@charset "UTF-8";

@import "normalize.css";
@import "animations.css";
@import "typography.css";

@font-face {
    font-family: 'helveticaneuelight' !important;
    src: url('fonts/helveticaneue_lt-webfont.eot') !important;
    src: url('fonts/helveticaneue_lt-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/helveticaneue_lt-webfont.woff') format('woff'),
         url('fonts/helveticaneue_lt-webfont.ttf') format('truetype'),
         url('fonts/helveticaneue_lt-webfont.svg#helveticaneuelight') format('svg') !important;
    font-weight: normal !important;
    font-style: normal !important;
}
html, body {
	width:100%;
	height: 100% !important;
	font-size: 12px;
	vertical-align:top;
    font-family: 'helveticaneuelight' !important;
	color:#333 !important;
}
body {
	display:table !important;
	background: url('../img/bg-blur-2.jpg') no-repeat top center fixed;
	background-size: cover;
}
body.home {
	background: url('../img/bg-clear.jpg') no-repeat top center fixed;
	background-size: cover;
}
header {
	display: table !important;
	background: url('../img/bg-blur.jpg') no-repeat top center fixed;
	background-size: cover;
	background-color: rgba(0, 0, 0, .20);
	border-right: 1px solid rgba(255, 255, 255, .25);
	width:360px;
	height: 100% !important;
	box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.35) !important;
}
    header div.logo {
    	display: table-cell !important;
    	background: rgba(0, 0, 0, .10);
    	border-right: 1px solid rgba(255, 255, 255, .25);
    	width: 160px;
		height: 100% !important;
    	padding: 40px !important;
	}
		header div.logo a {
		}
    header nav {
    	display: table-cell !important;
    	min-width: 160px;
    	padding: 20px 0 0 0 !important;
	}
	header .social-links {
		float:left !important;
		width:50% !important;
		padding:0px 0px 0px 0px !important;
		margin:30px 0px 0px 0px !important;
		opacity:0.75;
	}
	header .social-links:hover {
		opacity:1;
	}
    header nav ul {
	}
        header nav li {
		}
		header nav li.here {
			background: rgba(255, 255, 255, .20)
		}
		header nav li.first {}
		header nav li.last {}
			header nav ul li ul {
				display:none;
			}
				header nav a {
					padding: 0 40px 0 40px;
					display: block;
					font-size: 18px;
					line-height: 54px;
					width: 100%;
					-o-transition:.5s;
					-ms-transition:.5s;
					-moz-transition:.5s;
					-webkit-transition:.5s;
					transition:.5s;
				}
				header nav a:hover {
					color: #fff;
					background: rgba(255, 255, 255, .15);
				}
/* Body Contents */
	section {
		display: table-cell !important;
		position: relative !important;
		padding: 30px 40px 0 40px !important;
		width: 100%;
		height: 100% !important;
	}
			a.demobox img {
				width:100% !important;
			}
			a.demobox {
				color:#fff !important;
			}
			a.demobox:hover {
				color:#fff !important;
				text-decoration:none;
			}
			.demo-reel {
				position:relative !important;
				display:block !important;
				width:100% !important;
				padding:15px !important;
				color:#fff !important;
				background: url('../img/bg-blur.jpg') no-repeat top center fixed;
				background-size: cover;
			}
			.demo-reel h1 {
				padding:0 0 10px 0 !important;
				color:#fff !important;
				font-size:22px;
			}
			.demo-reel h2 {
				padding:0 0 0 0 !important;
				color:#fff !important;
				font-size:18px;
			}
		article {
			display: table-cell !important;
			padding: 30px 40px 30px 40px !important;
			width: 100%;
			max-height: 100% !important;
		}
			article img {
				max-width:100% !important;
				width:100% !important;
			}
			article img.thumbnail {
				max-width:100px !important;
				max-height:75px !important;
				display:inline-block;
				background:rgba(0,0,0,0.1);
				border:1px solid rgba(0,0,0,0.1);
				margin:0 10px 10px 0 !important;
			}
			article img.thumb-Large {
				width:auto !important;
				max-width:22% !important;
			}
			article a.link-btn {
				color:#fff !important;
				padding:10px 15px 10px 15px;
				display:inline-block;
				background:rgba(0,0,0,0.25);
				border:1px solid rgba(0,0,0,0.1);
				text-decoration:none;
				font-size:14px;
			}
			article a.link-btn:hover {
				background:rgba(0,0,0,0.5);
				text-decoration:underline;
			}
/* Blog ----------- */
			.comment-form input, .comment-form textarea {
				clear:left !important;
			}
			.comment-form p {
			}
			.comment-form div {
				width:auto !important;
				max-width:auto !important;
				display:inline-block !important;
			}
			.comment-form div input {
				float:right !important;
			}
		section article {
			display: block !important;
			padding: 0 0 0 0 !important;
			clear:both !important;
		}
		section article .blogImage {
			float: right;
			max-width: 30%;
			padding: 10px;
			margin:0 0 20px 20px !important;
			border: 1px solid rgba(0,0,0,0.15);
			background: rgba(0,0,0, 0.1);
		}
			.pdf-viewer {
				display: block !important;
				position: absolute !important;
				width: 100% !important;
				height: 100% !important;
				top: 0 !important;
				left: 0 !important;
			}
		figure {
			padding:0 0 20px 0 !important;
		}
		section.portfolio {
			padding:0 !important;
		}
			.portfolio-box, .portfolio-box::after, .portfolio-box::before {
				width: 25% !important;
				min-width: 25% !important;
				max-width: 25% !important;
				padding: 0 0 0 0 !important;
				margin: 0 0 0 0 !important;
				content: "" !important;
				float:left !important;
				clear:none !important;
				background:#000;
			}
				.portfolio-box a {
					position: relative;
					text-align: center;
				}
				.portfolio-box a img {
					opacity: 1;
					-o-transition:.5s;
					-ms-transition:.5s;
					-moz-transition:.5s;
					-webkit-transition:.5s;
					transition:.5s;
				}
				.portfolio-box a:hover img {
					opacity: 0.5;
				}
					.port-thumbs {
						width:100%;
					}
					.portfolio-box div {
						display: none;
					}
					.portfolio-box a:hover div {
						color: #fff;
						width: 100%;
						text-align: center;
						display: block;
						position: absolute;
						height: 30px;
						line-height: 30px;
						background: -webkit-linear-gradient(rgba(0,0,0,0.00), rgba(0,0,0,0.75)); /* For Safari 5.1 to 6.0 */
						background: -o-linear-gradient(rgba(0,0,0,0.00), rgba(0,0,0,0.75)); /* For Opera 11.1 to 12.0 */
						background: -moz-linear-gradient(rgba(0,0,0,0.00), rgba(0,0,0,0.75)); /* For Firefox 3.6 to 15 */
						background: linear-gradient(rgba(0,0,0,0.00), rgba(0,0,0,0.75)); /* Standard syntax */
						margin: -30px 0 0 0 !important;
					}
	/* Side Sub Nav */
	aside {
		display: table-cell !important;
		border-left: 1px solid rgba(255, 255, 255, .25);
		background: url('../img/bg-blur.jpg') no-repeat top center fixed;
		background-size: cover;
		min-width: 200px !important;
		height: 100% !important;
		box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.35) !important;
	}
	aside.home-aside {
		min-width: 300px !important;
		padding: 30px !important;
		color: rgba(255, 255, 255, 1) !important;
	}
	aside.home-aside a {
		color: rgba(255, 255, 255, 1) !important;
	}
		aside.home-aside h3, aside.home-aside h4 {
			margin:0 0 0 0 !important;
			padding:0 0 0 0 !important;
			font-family: 'helveticaneuelight' !important;
		}
			aside.home-aside h3 {
				font-size:18px !important;
				padding:0 0 20px 0 !important;
			}
			aside.home-aside h4 {
				font-size:16px !important;
				padding:0 0 0 0 !important;
			}
		aside.home-aside i {
			font-size:10px !important;
		}
		
		aside.home-aside div.photos {
			position:relative !important;
			margin:10px 0 10px 0 !important;
		}
			aside.home-aside img {
				max-width:240px !important;
			}
			aside.home-aside div.photos div.numPhotos img {
				float:right;
				padding:0 0 0 5px;
			}
			aside.home-aside div.photos div.numPhotos {
				position:absolute !important;
				display:block;
				width:100% !important;
				height:32px !important;
				line-height:12px !important;
				margin:-32px 0 0 0 !important;
				padding:10px 10px 10px 10px !important;
				vertical-align:middle !important;
				text-align:right;
				background: -webkit-linear-gradient(rgba(0,0,0,0.00), rgba(0,0,0,0.50)); /* For Safari 5.1 to 6.0 */
				background: -o-linear-gradient(rgba(0,0,0,0.00), rgba(0,0,0,0.50)); /* For Opera 11.1 to 12.0 */
				background: -moz-linear-gradient(rgba(0,0,0,0.00), rgba(0,0,0,0.50)); /* For Firefox 3.6 to 15 */
				background: linear-gradient(rgba(0,0,0,0.00), rgba(0,0,0,0.50)); /* Standard syntax */
			}
		aside.home-aside p {
			font-size:12px !important;
			line-height:20px !important;
		}
			aside.home-aside p a {
				text-decoration:underline !important;
			}
			aside.home-aside p a:hover {
				text-decoration:none !important;
			}
		aside.home-aside ul, aside.home-aside li {
			padding:0 0 0 0 !important;
			margin:0 0 0 0 !important;
		}
			aside.home-aside ul {
				padding:8px 0 0 0 !important;
			}
			aside.home-aside li {
				padding:8px 0 8px 0 !important;
			}
			aside.home-aside hr {
				border-color:rgba(255,255,255,0.20);
			}
		aside nav {
			padding: 40px 0 0 0 !important;
		}
		aside nav ul {}
			aside nav li {
				display:block;
			}
			aside nav li.overview, aside nav li.overview:hover {
				text-decoration:none;
				background: rgba(255,255,255,.10);
			}
			aside nav li.overview a, aside nav li.overview a:hover {
				text-decoration:none;
				background: none;
			}
			aside nav li.first {}
			aside nav li.here {}
			aside nav li.last {}
			aside nav a {
				padding: 0 40px 0 40px;
				display: block;
				font-size: 16px;
				line-height: 50px;
				width: 100%;
				-o-transition:.5s;
				-ms-transition:.5s;
				-moz-transition:.5s;
				-webkit-transition:.5s;
				transition:.5s;
			}
			aside nav a:hover {
				color: #fff;
				background: rgba(255, 255, 255, .15);
			}
			aside .sort-controls a {
				font-size: 14px;
				line-height: 26px;
			}
iframe {
	display: block !important;
	margin: 0 0 10px 0 !important;
	max-width: 100% !important;
}
a.thumb {
	display: inline-block !important;
	background: #eee !important;
	padding: 10px !important;
	margin: 0 10px 10px 0 !important;
	width: auto !important;
	height: 150px !important;
	border: 1px solid #ccc !important;
}
	a.thumb img {
		height: 100% !important;
		width: auto !important;
	}