@import "fontello.css";
@import "fontello-codes.css";
@import "fontello-embedded.css";
@import "fontello-ie7-codes.css";
@import "fontello-ie7.css";
@import "animation.css";

@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 400;
  src: local('Ubuntu'), url(../font/Ubuntu.woff) format('woff');
}
@font-face {
  font-family: 'Rochester';
  font-style: normal;
  font-weight: 400;
  src: local('Rochester'), local('Rochester-Regular'), url(../font/Rochester.woff) format('woff');
}

.grey {
	color: #888;
}


.carousel-control.left,
.carousel-control.right {
	filter: alpha(opacity=0);
	opacity: 0;
	-webkit-transition: opacity 0.5s ease-in-out;
	-moz-transition: opacity 0.5s ease-in-out;
	-ms-transition: opacity 0.5s ease-in-out;
	-o-transition: opacity 0.5s ease-in-out;
	transition: opacity 0.5s ease-in-out;
}

.carousel:hover .carousel-control.left,
.carousel:hover .carousel-control.right {
	filter: alpha(opacity=70);
	opacity: 0.70;
}

.carousel:hover .carousel-control.left:hover,
.carousel:hover .carousel-control.right:hover {
	filter: alpha(opacity=100);
	opacity: 1.0;	
}

body {
	margin: 0;
	padding: 0;
	font-size: 13px;
	font-family: 'Ubuntu', sans-serif;
	background: url(/img/background-herp.png);
	background-attachment: fixed;
}

#viewport {
	margin-top: 50px;
	margin-bottom: 50px;
}

.right-column {
	min-height: 488px;
	padding: 0;
	background: white;
	box-shadow: inset 0 0 10.0em #666;
}

.right-column .right-column-inner {
	margin-top: 50px;
	margin-bottom: 50px;
}

.left-column {
	height: 488px;
	padding-bottom: 20px;
	background: rgba(0,0,0,0.75);
	text-align: center;
}

.logo {

}

.logo a {
	width: 80%;
	display: block;
	margin: -35px auto;
	margin-bottom: 0;
}

.logo a img {
	width: 100%;
}

.name {
	font-family: 'Rochester';
	color: white;
	text-align: center;
}
.name span {
	display: inline-block;
}
.name span:after {
	content: '';
	display: block;
	height: 1px;
	margin: 0 15%;
	width: 70%;
	border-top: solid 1px #777;
}

.tagline {
	margin: 30px 10% 20px;
	font-family: 'Ubuntu', sans-serif;
	color: #aaa;
	font-size: 1.85rem;
	width: 80%;
	font-style: oblique;
}

.social a {
	color: white;
}

.menu-column {
	padding: 0 10px;
}

.main-menu {
	margin: 0 0 5px;
	padding: 0;
}

.main-menu li {
	list-style-type: none;
	display: inline-block;
}

.main-menu li a {
	display: inline-block;
	background: rgba(0,0,0,0.70);
	padding: 5px;
	color: white;
	font-variant: small-caps;
	font-weight: bold;
	font-size: 15px;
	height: 30px;
	margin-right: 5px;
}

.main-menu li a:hover {
	text-decoration: none;
	background: rgba(0,0,0,0.90);
}

.posts {
}

.posts > article.post {
	padding: 10px;
	margin-bottom: 40px;
	border: solid 1px #ddd;
	background: #fff;
}

.posts > article.post:first-child {
	margin-top: 40px;
}

.posts > article.post header {
	margin-bottom: 10px;
}

.blog {
	background: url(/img/background.png);
	min-height: 488px;
}

.blog * {
	font-family: 'Courier New', Courier, FreeMono, monospace;
}

.blog .blog-heading {
	color: #aaa;
	font-size: 0.9em;
	position: absolute;
	z-index: 0;
}

.blog .blog-title {
	color: #eee;
}

.blog h3 {
	margin-top: 0;
	margin-bottom: 0;
}

.blog .btn-default {
	background: rgba(255,255,255,0.2);
	color: #fff;
}

.blog .posts > article {
	background: rgba(0,0,0,0.65);
	color: #fff;
	border: solid 1px #0f0;
	border: solid 1px rgba(0,255,0,0.15);

	overflow: hidden;
	text-shadow: 2px 2px 1px #030;
}

.blog img {
	border: solid 1px #0f0;
	padding: 5px;
	max-width: 100%;
}

.blog a {
	color: gray;
}
.blog a:hover {
	color: #f00;
}

.blog .dateline {
	margin-bottom: 20px;
}

.replies {
}

.replies > article.reply {
	background: #f1f1f1;
}

.replies > article.reply header {
	margin-bottom: 15px;
}

.replies > article.reply:first-child header {
	margin-top: 15px;
}

.plus-one.active { color: #dd4b39; }
.shared-public { color: #888; }
.padded-lr-5px { padding: 0 5px; }
.padded-ud-5px { padding: 5px 0; }
.padded-ud-10px { padding: 10px 0; }

.attachments {
	margin: 20px 0;
}

.attachment-item {
	display: block;
	text-align: center;
}

.attachment-item a {
	display: inline-block;
}


.creations {

}

.creation {
	border: solid 1px #ddd;
	background: #fff;
}

.creation > header {
	padding: 10px;
}

@media (min-width: 992px) and (max-width: 1200px) {
	.left-column {
		height: 404px;
	}
	.blog,
	.right-column {
		min-height: 404px;
	}

}

@media (min-width: 768px) and (max-width: 991px) {
	.left-column {
		height: 175px;
		text-align: left;
	}
	.name {
		text-align: left;
	}
	.tagline {
		text-align: left;
		margin: 25px 15px 10px;
		font-size: 1.6rem;
	}
	.menu-column {
	}
	.blog,
	.right-column {
		min-height: 469px;
	}
}

@media (max-width: 767px) {
	.left-column {
		height: auto;
	}
	.blog,
	.right-column {
		min-height: 300px;
	}
}