/* ----------- blocks.css ----------- */

body {
	-webkit-font-smoothing: antialiased!important;
	margin: 0;
	padding:0;
  	background: #FFF; 
	}

	.section {
		overflow: hidden;
		}

	/* FULLPAGE */
	/* POSTER SECTION 0 -- VIDEO AND TYPOGRAPHY */
		
	/* POSTER SECTION 0 -- TYPOGRAPHY */
	#section0 .date, #sectionBLZ0 .date {
		position: absolute;
		z-index: 4;
		left: 50%;
		width:45%;
		top: 2%;
		margin-right:0px;
		/* 
		* Preventing flicker on some browsers 
		* See http://stackoverflow.com/a/36671466/1081396  or issue #183
		*/
		-webkit-transform: translate3d(0,0,0);
		-ms-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0);
		}
		
	#section0 .layer {
		position: absolute;
		z-index: 4;
		left: 50%;
		width:45%;
		top: 25%;
		-webkit-transform: translate3d(0,0,0);
			-ms-transform: translate3d(0,0,0);
			transform: translate3d(0,0,0);
		}
	
	#section0 .layer h1, #sectionBLZ0 .layer h1{
		display:block;
		margin-top:15px;
		}
	
	#section0 .layer h2, #sectionBLZ0 .layer h2 {
		display:block;
		margin-bottom:15px;
		}
	
	.top {
		display:block;
		margin:0px;
		border-top:1px solid rgba(0,0,0,0.5);
		}
		
	.bottom {
		display:block;
		margin:0px;
		border-bottom:1px solid rgba(0,0,0,0.5);
		}	
		
div.poster-controlArrow {
    -webkit-user-select: none; /* webkit (safari, chrome) browsers */
    -moz-user-select: none; /* mozilla browsers */
    -khtml-user-select: none; /* webkit (konqueror) browsers */
    -ms-user-select: none; /* IE10+ */
    margin-top:0px;
    cursor: pointer;
    width: 100%;
    height: 44px;
    border-style: none;
    -webkit-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}


span.poster-prev, span.poster-next {display:block; width: 44px;
  	height: 44px;}


.poster-prev {
    left: 0px;
    background-image: url('default-skin/default-skin.svg');
    background-size: 264px 88px;
	background-position: -145px -44px;    
	opacity: 0.8;
}

.poster-next {
    right: 0px;
    width: 44px;
  	height: 44px;
    background-image: url('default-skin/default-skin.svg');
    background-size: 264px 88px;
    background-position: -75px -44px;
    opacity: 0.8;
	}


		
		
	/* OVERVIEW SECTION 1 -- BACKGROUND ART, SLIDES NAVIGATION AND TYPOGRAPHY */	
	/* OVERVIEW SECTION 1 -- SLIDES NAVIGATION AND TYPOGRAPHY */
	
	.header {
		display:block;
		height:auto;
		max-width: 80em;
		margin: 0 0.93em;
		padding: 0 0em 1em;
		border-bottom: solid 1px rgba(0,0,0,0.5); 
		} 
		
	.title {
		display:inline-block;
		float:left;
		text-align:left;
		min-width: 320px;
		width: 75%;
		margin: 0;
		padding: 0;
		} 
		
	.legend {
		display:inline-block;
		float:left;
		text-align:left;
		height:auto;
		margin: 0;
		padding: 0;
		}


	.bullBefore:before {
		position:relative;
		white-space: pre;
		left: -15px;
		content:'\2022';
		margin-right: -5px;
		color: #3399FF;
		}
		
		
	/* OVERVIEW SECTION 1 -- TYPOGRAPHY  */	
	.intro {
		display:block;
		position:relative;
  		margin-left: 25%;
  		top: 39.5%;
  		width:70%;
  		padding: 0;
  		}
  	
  	
  	section.header {
		display:block;
		height:auto;
		max-width: 100%;
		margin: 0 20px;
		padding: 0 10px;
		border-bottom: solid 1px rgba(0,0,0,0.5); 
		} 
		
  	section.bio {
  		display:block;
		width: 88%;
		margin: 0 auto;
		padding: 0;
  		}
  		
  	.info-lft {
		display:inline-block;
		width:25%;
		text-align:right;
		margin-right:3%;
		float:left;
		}	
		
	.info-right {
		display:inline-block;
		width:70%;
		text-align:left;
		float:left;
		}
  	
	.intro h1{
		display:block;
		margin-top:16px;
		margin-bottom:0px;
		}
	
	.intro h2 {
		display:block;
		margin-top:0px;
		margin-bottom:16px;
		}
		
	.intro h3  {
		display:block;
		margin:0px;
		}
	
	.intro .info-lft h4  {
		display:block;
		margin:0px;
		}



  		

		
#btn {
	cursor: -webkit-zoom-in;
  	cursor: -moz-zoom-in;
  	cursor: zoom-in;
  	} 
    
.spacer {height:60px;margin-bottom:60px;background-color:#fff;}  

.wrapper-margins {margin-bottom:60px;margin-top:60px;}  

.clearfix:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    line-height: 0;
    visibility: hidden;
}
  		


					.cv {max-width:50%;margin:10px 0;float:left;}
					.cv .cvblock {display:inline-block;width:100%;padding:6px 0;}
					.cv .date {display:block;width:15%;float:left;}
					.cv .info {display:block;float:left;width:85%;}
					
					
  		
  /* ----------- iPhone 5 and 5S ----------- */
/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (display-mode: standalone){
  .cv {max-width:100%;margin:10px 0;float:left;}
}

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 350px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {

	#section0 .layer {
		}
	
	.intro {
  		margin-left: 20%;
  		top: 37%;
  		width:70%;
  		}
  	.cv {max-width:100%;margin:10px 0;float:left;}
}

/* Landscape */
@media only screen 
  and (min-device-width: 480px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {
	#section0 .layer {
		}
	
	.intro {
  		margin-left: 30%;
  		top: 29%;
  		width:70%;
  		}
  	.cv {max-width:100%;margin:10px 0;float:left;}	
}	

/* ----------- iPhone 6 ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) { 

}

/* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) { 
  	#section0 .layer {
		}
	.intro {
  		margin-left: 25%;
  		top: 39.5%;
  		}
  	.cv {max-width:100%;margin:10px 0;float:left;}
}

/* Landscape */
@media only screen 
  and (min-device-width: 660px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {   
  	#section0 .layer {
	}	
	.intro {
  		margin-left: 30%;
  		top: 30%;
  		width:70%;
  		}
}


/* ----------- All iPads ----------- */
/* iPad in portrait & landscape */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (-webkit-min-device-pixel-ratio: 1){ 
  	
  	#section0 .layer {
	}
		
	.intro {
  		margin-left: 25%;
  		top: 42%;
  		width:70%;
  		}
		
	.intro h1{
		margin-top:16px;
		margin-bottom:0px;
		}
	
	.intro h2 {
		margin-top:0px;
		margin-bottom:16px;
		}
		
	.intro h3  {
		margin:0px;
		}
	
	.intro .info-lft h4  {
		margin:0px;
		}
		
		
	.info-lft {
		width:25%;
		margin-right:3%;
		}	
		
	.info-right {
		width:70%;
		}

}

/* iPad in landscape */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) 
and (-webkit-min-device-pixel-ratio: 1) { 	
}

/* iPad in portrait */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) 
and (-webkit-min-device-pixel-ratio: 1) { 
}

/* ----------- RETINA iPads ----------- */
/* Retina iPad in portrait & landscape */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)
and (-webkit-min-device-pixel-ratio: 2) { 
}

/* Retina iPad in landscape */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape)
and (-webkit-min-device-pixel-ratio: 2) { 
}

/* Retina iPad in portrait */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio: 2) { 
}

/* Retina iPad PRO in portrait & landscape */
/* Landscape*/
@media only screen 
and (min-device-width: 1024px) 
and (max-device-width: 1366px) 
and (-webkit-min-device-pixel-ratio: 2)  
and (orientation: landscape) { 
}

/* Portrait*/
@media only screen 
and (min-device-width: 1024px) 
and (max-device-width: 1366px) 
and (-webkit-min-device-pixel-ratio: 2)  
and (orientation: portrait)  { 
}

/* ----------- Non-Retina Screens ----------- */
@media screen 
  and (min-device-width: 1200px) 
  and (-webkit-min-device-pixel-ratio: 1) { 
  
  #section0 .layer {
		}
	
	.intro {
  		margin-left: 25%;
  		top: 42%;
  		width:70%;
  		max-width:640px;
  		}
				
	.intro h1{
		margin-top:16px;
		margin-bottom:0px;
		}
	
	.intro h2 {
		margin-top:0px;
		margin-bottom:16px;
		}
		
	.intro h3  {
		margin:0px;
		}
	
	.intro .info-lft h4  {
		margin:0px;
		}
	}

/* ----------- Retina Screens ----------- */
@media screen 
  and (min-device-width: 1200px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (min-resolution: 192dpi) { 

	.intro {
  		margin-left: 25%;
  		top: 42%;
  		width:70%;
  		max-width:640px;
  		}
		
	.intro h1{
		margin-top:16px;
		margin-bottom:0px;
		}
	
	.intro h2 {
		margin-top:0px;
		margin-bottom:16px;
		}
		
	.intro h3  {
		margin:0px;
		}
	
	.intro .info-lft h4  {
		margin:0px;
		}
		
}