/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/


#rotationFeature h1, #rotationFeature h2, #rotationFeature p{
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}


/* Body . Type */


		
	#rotationFeature p {
	font-size: 17px;
	padding-bottom: 20px;
	}
	
	#rotationFeature h1 {
	font-size: 36px;
	line-height: 40px;
	color: #666;
	}	
	
	#rotationFeature h2 {
	font-size: 22px;
	color: #666;
	}


	
	#rotationFeature p a {
	color: #ff6d0b;
	font-weight: 400;
	}
	
	#rotationFeature p a:hover { opacity: 0.5; }
	
	
	#rotationFeature .text ul {
	padding-bottom: 20px;
	}
	
	#rotationFeature .text ul li {
	list-style-image: url("../img/icon_list.png");
	list-style-position: outside;
	margin-left: 20px;
	padding-left: 0px;
	}
	
	#rotationFeature b {
	font-weight: 400;
	color: #666;
	}	

	#rotationFeature a {
	-webkit-transition: 0.15s ease-in-out;
	-webkit-transition-property: color, background-color, opacity, box-shadow;
	text-decoration: none;
	}	
	
	#rotationFeature h3 a  		{ color: #666; opacity: 0.5; }
	#rotationFeature h3 a:hover  { opacity: 1; }
	#rotationFeature h3 .active  { opacity: 1; color: #ff6d0b; }	
	
	

.row { width: 100%; margin-bottom: 40px; float: left; overflow: hidden; }





.portfolio_brick {
	width: 100%;
	height: 0;
	padding-bottom: 50%;
	margin-bottom: 60px;
	-webkit-border-radius: 4px;
	-moz-border-radius:    4px;
	border-radius: 		   4px;
	box-shadow: 		inset 0px 0px 150px rgba(0,0,0,0.15);
	-webkit-box-shadow: inset 0px 0px 150px rgba(0,0,0,0.15);
	-moz-box-shadow: 	inset 0px 0px 150px rgba(0,0,0,0.15);
	background: #fff;
	opacity: 0;
	display: none;
	}
	
.portfolio_brick.selected {
	/*opacity: 1;*/
	display: block;
	z-index: 2000;
}

	.info_wrap {
	float: left;
	width: 50%;
	height: 0;
	padding-bottom: 50%;
	}
	
	.project_info {
	text-align: center;
	width: 70%;
	padding-top: 12%;
	margin: auto;
	}
	
/* PROJECT INFO ADJUST */	
	
	
	
	
	.project_info h2 {
	color: #aaa;
	}
	
	.project_info p {
	padding-top: 20px;	
	}
	
	.project_info .project_icon {
	width: 150px;
	height: 150px;
	padding-bottom: 20px;
	}
	
	.photo_wrap {
	float: left;
	width: 50%;
	height: 0;
	padding-bottom: 50%;
	position: relative;
	-webkit-border-top-right-radius: 	4px;
	-webkit-border-bottom-right-radius: 4px;
	-moz-border-radius-topright: 		4px;
	-moz-border-radius-bottomright: 	4px;
	border-top-right-radius: 			4px;
	border-bottom-right-radius: 		4px;
	background: #66696b;
	box-shadow: 		inset 0px 0px 150px rgba(0,0,0,0.4);
	-webkit-box-shadow: inset 0px 0px 150px rgba(0,0,0,0.4);
	-moz-box-shadow: 	inset 0px 0px 150px rgba(0,0,0,0.4);
	}
	
	.photo_wrap div {
	width: 100%;
	}

	img.screen_shot {
		position: absolute;
		width:100%;
		opacity: 0;
		height: 100%;
		left:4px;
	}

img.screen_shot.selected {
	opacity: 1;
	z-index: 2000;
	width:100%;
	height: 100%;
}
	
	.page_indicator {
	position: absolute;
	bottom: -40px;
	float:left;
	width: 100%;
	text-align: center;
	}
	
	.page_indicator a {
	display: inline-block;
	position: relative;
	width: 16px;
	height: 16px;
	background: url("../img/page_indicator.png") no-repeat;
	background-size: 6px 6px;
	background-position: 5px 5px;
	opacity: 0.3;
	}
	
	.page_indicator a:hover {
	opacity: 1;
	background-size: 8px 8px;
	background-position: 4px 4px;
	}
	
	.page_indicator .selected {
	opacity: 1;
	background-size: 8px 8px;
	background-position: 4px 4px;
	}
	
	
#thumbnails .col_1 { text-align: center; padding-bottom: 5%;}

	#thumbnails .col_1 a { opacity: 0.3; }
	#thumbnails .col_1 a.selected { opacity: 1; }
	#thumbnails .col_1 a:hover { opacity: 1; }	
	
	.project_thumb {
	width: 100%;
	text-align: center;
	}	

	.project_thumb .project_icon {
	width: 90px;
	height: 90px;
	}
	
	.project_thumb h2 {
	display: none;
	}


	
	
	

	
	
/* --- Forms & Such --- */

	.button {
	background: rgba(218,223,225,1);
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 3px;
	font-size: 11px;
	font-family: "depot-new-web", "Helvetica Neue", Helvetica, sans-serif; 
	color: #666;
	padding: 10px 17px 0px 20px;
	display: inline-block;
	height: 28px;
	border: none;
	border-bottom: 1px solid #c1c4c6;
	-webkit-border-radius: 4px;
	-moz-border-radius:    4px;
	border-radius: 		   4px;
	text-shadow: 0px 1px 0px #eee;
	-moz-box-shadow: 	0 1px 2px 0 rgba(0,0,0,0.1);
	-webkit-box-shadow: 0 1px 2px 0 rgba(0,0,0,0.1);
	box-shadow: 		0 1px 2px 0 rgba(0,0,0,0.1);
	margin: 5px;
	}
	
	.button:hover {
	background: rgba(232,235,238,1);
	color: #000;
	}

	.button:active {
	background: rgba(223,227,229,1);
	}







	
	
@media screen and (max-width: 1300px) {

	.content {  margin: auto; width: 920px; }

	.col_2 { width: 49.5%; margin: 0 0.25% 0.5% 0.25%; float: left; }
	.col_2span { width: 100%; margin: 0 0 1% 0; }
	
	.jobstext { width: 32.83333333333333%; margin: 0 0.25% 0.5% 0.25%; float: left; }
	.apply { width: 32.83333333333333%; margin: 0 0.25% 0.5% 0.25%; float: left; }

	
	.project_info {
	width: 80%;
	padding-top: 11%;
	}
	
	.project_info .project_icon {
	width: 120px;
	height: 120px;
	}
	

	

	/* 3 Lines 1 Button Line */
	#project_chancey .project_info,
	#project_carousel .project_info,
	#project_actilife .project_info {
	padding-top: 10%;
	}
	

	

}	
	
@media screen and (max-width: 980px) {





	.project_info .project_icon {
	width: 140px;
	height: 140px;
	}


	.portfolio_brick {
		width: 100%;
		height: auto;
		padding-bottom: 0;
	}
	
	.info_wrap {
	float: none;
	width: 100%;
	height: auto;
	padding-bottom: 10%;
	}
	
	.photo_wrap {
	float: none;
	width: 100%;
	height: 0;
	padding-bottom: 100%;
	-webkit-border-top-right-radius: 	0;
	-webkit-border-bottom-left-radius: 4px;
	-moz-border-radius-topright: 		0;
	-moz-border-radius-bottomleft: 		4px;
	border-top-right-radius: 			0;
	border-bottom-left-radius: 			4px;
	}
	

/* PROJECT INFO ADJUST */	
	
	
	/* 3 Lines 1 Button Line */
	#project_chancey .project_info {
	padding-top: 10%;
	}
	


	.featured .project_thumb {
		display: block;
		width: 100%;
		margin: 0;
		padding: 8% 0 7%;
		border-bottom: 1px solid #eee;
	}
	
	.featured .project_thumb:last-child {
		border-bottom: none;
	}
	
	.featured a {
	background: none;
	}

	.featured a:first-child {
		background: none;
	}

	.featured .project_thumb:hover {
		background-image: none;
	}
	
}



	
@media screen and (max-width: 600px) {

	.content {  margin: auto; width: 90%; padding-top: 20px;}
	
	.col_1 { width: 100%; margin: 0 0 1% 0; }
	
	#thumbnails .project_icon {
	width: 110px;
	height: 110px;
	}
	
	h1 {
	font-size: 32px;
	line-height: 34px;
	}	

	.about_square h1 {
	font-size: 32px;
	line-height: 34px;
	}


	#thumbnails .col_1 a { opacity: 1; }

	.portfolio_brick {
	box-shadow: 		inset 0px 0px 100px rgba(0,0,0,0.2);
	-webkit-box-shadow: inset 0px 0px 100px rgba(0,0,0,0.2);
	-moz-box-shadow: 	inset 0px 0px 100px rgba(0,0,0,0.2);
	}


	.page_nav a {
	display: block;
	}


}









/*retina*/

@media all and (-webkit-min-device-pixel-ratio: 1.5) {

.page_indicator a {
	background: url("../img/page_indicator@2x.png") no-repeat;
	background-size: 6px 6px;
	background-position: 5px 5px;
	}
	
	.page_indicator a:hover {
	background: url("../img/page_indicator@2x.png") no-repeat;
	background-size: 8px 8px;
	background-position: 4px 4px;
	}

	.page_indicator .selected {
	background: url("../img/page_indicator@2x.png") no-repeat;
	background-size: 8px 8px;
	background-position: 4px 4px;
	}



		
.icon_next {
	background: url("../img/icon_right@2x.png") no-repeat;
	background-size: 24px 24px;
	}
	
	.icon_prev {
	background: url("../img/icon_left@2x.png") no-repeat;
	background-size: 24px 24px;
	}

}