/*-----------------------------------------------------------------------------
author:    www.blackwaspdigital.com
-----------------------------------------------------------------------------*/


/* =cypher-surveying People page
-----------------------------------------------------------------------------*/
.content {
	padding:0 0 5em 0;
	}

.hideForScreen {
	display:none;
	}
	
section {
	width:100%;
	padding:0;	
	margin:0 auto;
	background:none;
	position:relative;
	height:1000px;
	}	
	
.peopleLeft {
	width:22%;
	padding:5%;	
	margin:0 0;
	background:rgba(0, 0, 0, 0.85);
	}
	
.peopleDetail {
	width:58%;
	padding:5% 5% 0 5%;	
	margin:0 auto;
	background:rgba(0, 0, 0, 0.85);
	position:absolute;
	top:0;
	right:0;
	}
	
.peopleTitle {
	cursor:pointer;
	margin:0 0 1em 0;
	padding:.5em;
	font-family: 'eurostilebold', sans-serif;
	-webkit-transition: background 0.4s ease-in-out;
	-moz-transition: background 0.4s ease-in-out;
	-o-transition: background 0.4s ease-in-out;
	transition: background 0.4s ease-in-out;
	font-size:1.1em;
	}
	
.peopleTitle:hover {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0c69aa+0,003d73+100 */
background: #0c69aa; /* Old browsers */
background: -moz-linear-gradient(top, #0c69aa 0%, #003d73 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #0c69aa 0%,#003d73 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #0c69aa 0%,#003d73 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0c69aa', endColorstr='#003d73',GradientType=0 ); /* IE6-9 */
	}
	
.close {
	font-family: 'eurostilebold', sans-serif;
	-webkit-transition: background 0.4s ease-in-out;
	-moz-transition: background 0.4s ease-in-out;
	-o-transition: background 0.4s ease-in-out;
	transition: background 0.4s ease-in-out;
	font-size:1.1em;
	float:right;
	background:#0c69aa;
	margin:-30px -30px .25em .25em;
	border:none;
	color:#ffffff;
	}
	
.close:hover {
	background:#000000;
	}
	
.peopleImg {
	width:25%;
	max-width:300px;
	float:left;
	margin:0 5% 5% 0;
	border:#565656 solid 5px;
	}
	
	
		
	
@media screen and (max-width: 1250px) {
	

		
}

@media screen and (max-width: 950px) {
	
.hideForScreen {
	display:block;
	}
	
.hideForMobile {
	display:none;
	}
	
section {
	width:90%;
	padding:5%;	
	margin:0 auto;
	background:rgba(0, 0, 0, 0.85);
	height:auto;
	}
	
.peopleLeft {
	width:100%;
	padding:0;	
	margin:0 0;
	background:none;
	}
	
.peopleDetail {
	width:100%;
	padding:0 0 0 0;
	background:none;
	position:relative;
	top:auto;
	right:auto;
	}
	
.close {
	margin:0 0 .25em .25em;
	}
		
}

@media screen and (max-width: 600px) {
	
.peopleImg {
	width:75%;
	max-width:300px;
	float:none;
	margin:0 auto 2em auto;
	border:#565656 solid 5px;
	}

}