.dash1 { opacity:.5; }
#header.expanded { top:0; }
/* BRANDS */

#brands { opacity:1; margin-top:125px; }
#brands .logos-wrapper { background:url(../imgs/slant-grid-bg.png) top left; border:1px solid #fff; border-left:none; border-right:none; padding:40px 0; text-align:center; }
#brands .logos-wrapper .logo-block { 
	display:inline-block; 
	width:15%;
	max-width:135px; 
	margin-right:1.4%; 
	position:relative;
	-webkit-transform-origin: 50% 50%;
	-moz-transform-origin: 50% 50%;
	-ms-transform-origin: 50% 50%;
	-o-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	transform-style: preserve-3d; 
}
#brands .logos-wrapper .logo-block.last { margin-right:0; }
#brands .logos-wrapper .logo-block .icon { width:100%; opacity:0; display:block; }
/* SHOWCASE */

#showcase { margin-top:125px; width:96%; padding:0 2%; max-width:768px; }
#showcase .project-block { display:block; clear:both; margin-bottom:20px; width:100%; height:200px; position:relative; background-repeat:no-repeat; background-position:center center; background-size:cover; }
#showcase .project-block.fp1 { background-image:url(../imgs/projects/feat01.jpg); }
#showcase .project-block.fp2 { background-image:url(../imgs/projects/feat02.jpg); }
#showcase .project-block.fp3 { background-image:url(../imgs/projects/feat03.jpg); }
#showcase .project-block.fp4 { background-image:url(../imgs/projects/feat04.jpg); }
#showcase .project-block.fp5 { background-image:url(../imgs/projects/feat05.jpg); }
#showcase .project-block.fp6 { background-image:url(../imgs/projects/feat06.jpg); }
#showcase .project-block.fp7 { background-image:url(../imgs/projects/feat07.jpg); }
#showcase .project-block.fp8 { background-image:url(../imgs/projects/feat08.jpg); }
#showcase .project-block.fp9 { background-image:url(../imgs/projects/feat09.jpg); }
#showcase .project-block.fp10 { background-image:url(../imgs/projects/feat10.jpg); }
#showcase .project-block.fp11 { background-image:url(../imgs/projects/feat11.jpg); }
#showcase .project-block.fp_benjaminmoore { background-image:url(../imgs/projects/feat_benjaminmoore.jpg); }
#showcase .project-block.fp_cardinalhealth { background-image:url(../imgs/projects/feat_cardinalhealth.jpg); }
#showcase .project-block.fp_intuit { background-image:url(../imgs/projects/feat_intuit.jpg); }
#showcase .project-block.fp_cisco { background-image:url(../imgs/projects/feat_cisco.jpg); }
#showcase  .project-block .overlay { transform:none !important; }

.project-block .overlay { background:rgba(0,0,0,0.75); display:block; width:100%; height:100%; text-align:center; opacity:0; }
.project-block .overlay h3 { font-size:48px; height:48px; color:#fff; position:absolute; margin:auto; top:0; bottom:0; left:0; right:0; text-shadow: 0 15px 25px rgba(0,0,0,1),0 15px 25px rgba(0,0,0,.5),0 15px 5px rgba(0,0,0,.12); }
.project-panel .icon {
	-webkit-transform-origin: 50% 50%;
	-moz-transform-origin: 50% 50%;
	-ms-transform-origin: 50% 50%;
	-o-transform-origin: 50% 50%;
	transform-origin: 50% 50%;

	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	transform-style: preserve-3d;

	display: block;
	padding: 0;
	border: 0;
}

/* PROJECT DETAILS */
#project .panel-head h2 { line-height:28px; }
#project .panel-head h2 span { display:block; font-size:24px; margin-top:2px; }
#project { margin-top:125px; opacity:0; }
#project .desc-panel { overflow:hidden; width:100%; height:0; margin-bottom:0; }
#project .desc-panel .desc-wrap { padding:15px; background:url(../imgs/slant-grid-bg.png) top left; border:1px solid #fff; border-left:none; border-right:none; }
#project .desc-panel .desc-wrap p { margin:0; padding:0; margin-bottom:10px; }
#project .desc-panel .desc-wrap p .btn-launch { cursor:pointer; text-decoration:underline; }
#project .img-panel { display:block; clear:both; margin-bottom:20px; max-width:768px; width:100%; height:auto; position:relative; }

/* PORTFOLIO */
.dash2.allproj { top:1400px; }
#portfolio { margin-top:125px; clear:both;  }

#portfolio .project-block { display:inline-block; position:relative;  margin-bottom:20px; width:157px; height:157px; float;left; background-repeat:no-repeat; background-position:center center; background-size:cover; }

#portfolio .thumb-link { 
	margin-bottom:1em; 
	margin-right:2%; 
	display:inline-block; 
	float:none; 
	position:relative; 
	opacity:1; 
	width:18.4%; 
	height:157px; 
}
#portfolio .collection .thumb-link:nth-of-type(5n+0) { margin-right:0; }
#portfolio .thumb-link .thumb { 
	position:relative; 
	width:100%; height:100%;
	background-position:center center; 
	background-size:cover;
	background-repeat:no-repeat; 
	overflow:hidden;
}
#portfolio .thumb-link .thumb .front-title { 
	position:absolute; 
	bottom:-2px; right:-1px; 
	text-align:right; 
	width:100%; 
	color:#fff; font-size:28px; 
	line-height:22px; 
	text-shadow: 0px 0px 6px rgba(0, 0, 0, 1); 
	opacity:0;
	-webkit-animation-duration:.5s; animation-duration:.5s; -webkit-transition-duration:.5s; transition-duration:.5s;
}
#portfolio .thumb-link .thumb .overlay { background:rgba(0,0,0,.95); }
#portfolio .thumb-link .thumb .overlay .title { max-width:130px; position:absolute; top:0; left:0; right:0; bottom:0; margin:auto; opacity:0;
	-webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-transition-duration:1.5s; transition-duration:1.5s;
}

@media only screen and (max-width : 768px) {
	.project-block .overlay { display:table; }
	.project-block .overlay h3 { font-size:2em; padding:0 5%; display:table-cell; text-align:center; vertical-align: middle; }
	
	#portfolio .thumb-link { 
		margin-bottom:.5em; 
		width:23.5%; 
	}
	#portfolio .thumb-link:nth-of-type(5n+0) { margin-right:2%; }
	#portfolio .thumb-link:nth-of-type(4n+0) { margin-right:0; }
	
	#brands .logos-wrapper .logo-block { width:30%; max-width:unset; }
	#brands .logos-wrapper .logo-block:nth-of-type(3n+0) { margin-right:0; }
}

@media only screen and (max-width : 640px) { 
	#portfolio .thumb-link { 
		width:31.3%;
		margin-right:3%;
		margin-bottom:.75em;
	}
	#portfolio .thumb-link:nth-of-type(5n+0) { margin-right:3%; }
	#portfolio .thumb-link:nth-of-type(4n+0) { margin-right:3%; }
	#portfolio .thumb-link:nth-of-type(3n+0) { margin-right:0; }
}

@media only screen and (max-width : 480px) { 
	#portfolio .thumb-link { 
		width:47%;
		margin-right:5%;
		margin-bottom:1em;
	}
	#portfolio .thumb-link .thumb .overlay .title { max-width:90%; }
	#portfolio .thumb-link:nth-of-type(5n+0) { margin-right:5%; }
	#portfolio .thumb-link:nth-of-type(4n+0) { margin-right:5%; }
	#portfolio .thumb-link:nth-of-type(3n+0) { margin-right:5%; }
	#portfolio .thumb-link:nth-of-type(2n+0) { margin-right:0; }
}