@charset "UTF-8";
/* CSS Document */



@font-face {
  font-family:'tiempos';
  src: url(tiempos-text-web-regular.woff);}



html, body {
  width: 100%;
  height: 100%;}

body {
	margin:0;
	padding:0; }

#wrapper {
	width:100%;
	min-height:100%;
	margin:0 auto; 
	padding-top:0px;}	
	
#home {
	position:fixed;
	z-index:8;		
	left:3.5%;
	top:16px;}

#footer {
	position:relative;
	margin-left:3.5%;
	padding-top:50px;
	padding-bottom:50px;
	font-size:15px;
	letter-spacing: 0.03em;
	font-family: 'Lato', sans-serif;
	font-weight:300;
	clear:both;}
	




/* MENU MENU MENU MENU MENU MENU MENU MENU MENU MENU MENU MENU MENU MENU MENU MENU */
		
#indexfixed {
	position:fixed;
	margin-left: 3.5%;
	top:33px;
	z-index:5;
	width:15.5%;}
	
#nametitle {
	clear:left;
	font-family: 'tiempos', serif;	
	font-size:34.35px;
	text-transform:none;
	color:black;
	letter-spacing:0.012em;
	line-height:138%;}
	
#upcoming {		
	font-family: 'Lato', sans-serif;
	font-weight:300;
	text-transform:none;
	color:black;
	font-size:14.25px;
	line-height:135%;
	letter-spacing:0.03em;}
	
#upcoming span {
	font-weight:400;}

#menuitems {
	position:relative;
	top:28px;
	margin-top:0;
	left:20.75%;
	z-index:5;		
	width:67.5%;  
	clear:left;
	padding-bottom:50px;}




	
/* LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS */

a.navlink:link, a.navlink:visited {	
	text-decoration:none;
	font-family: 'Lato', sans-serif;
	font-weight:300;
	letter-spacing: 0.015em;
	color:black;
	font-size:23px;
	
	padding-bottom:6px;
	padding-left:0;
	padding-right:0;}
	
a.navlink:hover {
	color:palegreen;} 

.nav a, .navlinkindex a {		
	display:block;	
	float:left;		
	padding:6px;
	margin-left:4px;}

a.navlinkindex:link, a.navlinkindex:visited {
	font-family: 'tiempos', serif;	
	font-size:34.35px;
	text-decoration:none;
	color:black;
	letter-spacing:0.001em;
	line-height:138%;
	margin-right:8px;	

	clear:left;
	float:left;}
	
a.navlinkindex:hover {
	color:palegreen; }

a.projectlink:link, a.projectlink:visited {
	font-family: 'tiempos', serif;	
	font-size:15px;
	text-decoration:none;
	color:black;
	letter-spacing:0.03em;
	line-height:138%;
	margin-right:8px;
	
	clear:left;
	float:left;}
	
a.projectlink:hover {
	color:palegreen; }
	
a.infotextlink:link, a.infotextlink:visited {	
	font-family: 'Lato', sans-serif;
	font-size:14.25px;
	font-weight:300;
	color:black;
	letter-spacing:0.03em;
	line-height:135%;
	
	text-transform:none;
	text-decoration:none;}

a.infotextlink:hover {
	color:palegreen;}







	
	
	
	
	
/* IMAGES IMAGES IMAGES IMAGES IMAGES IMAGES IMAGES IMAGES IMAGES IMAGES IMAGES IMAGES */
	
#imagecontainerindex {
	width:85%;
	position:fixed;
	z-index:-5;
	margin-top:-50px;
	margin-left:5%;	
	background:none;
	height:100%;
	opacity:0.7;}

#imagecontainer {
	width:85%;
	position:relative;
	margin-top:50px;
	margin-left:5%; 
	background:none;
	height:100%;}
	
#imageblockv, #imageblockh {
	position:relative;
	display:block;
	float:left;
	text-align:left;
	margin:8px;
	width:90%;}
	
#imageblockv img, #imageblockh img {
	width:100%;
	height:auto;}
	
.video {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	margin-left:5%;
	margin:8px;}

.video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height:100%;}
	
.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: 1.2s ease;
  background-color:palegreen;}

#imageblockv:hover .overlay, #imageblockh:hover .overlay {
  opacity: 0.9;}

.text {
  position: fixed;
  top:45%;
  left:3.5%;	
  pointer-events: none;}
  
.text, .text span {
 width:15%;
 
 font-family: 'Lato', sans-serif;
 font-size:14.25px;
 font-weight:300;
 line-height:135%;
 letter-spacing:0.03em;
 text-transform:none;
 color:black;
 text-align:left;}
  
.text span {
 font-style:italic;}





/* DROP DOWN DROP DOWN DROP DOWN DROP DOWN DROP DOWN */

.dropdowntext {
    position:fixed;
    display: inline-block;
	z-index:19;
	
	width:67.5%;
	height:30%;
	top:0;
	margin-top:20px;
	left:0;
	margin-left:16.25%;
	margin-bottom:0;}

.dropdowntext span {
	margin-left:7.41%;
	margin-top:0;
	padding-top:0;
	padding-bottom:4px;
		
	border-bottom:0px solid black;
	font-family: 'tiempos', serif;	
	font-size:24.25px;
	line-height:138%;
	text-transform:none;
	font-style: normal;
	color: black;
	letter-spacing:0.005em;}

.dropdown-content {
    display: none;
    position: absolute;
    background-color:white;
	border:1px dotted black;
	opacity:0.97;
    /*box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.2);*/
	
	z-index:20;
	margin-top:0;
	margin-top:4px;
	margin-left:5%;
		
	width:78.613%;
	height:auto;
	min-height:250%;
	max-height:275%;
	overflow:scroll;}

.dropdown-content p {
	position:relative;
	width:45.125%;
	margin-top:2.41%;
	margin-left:3.25%;
	margin-bottom:7.41%;
	clear:none;
	float:left;
	
	font-family: 'tiempos', serif;	
	font-size:15px;
	text-transform:none;
	color:black;
	letter-spacing:0.03em;
	line-height:138%;}

.dropdown-content p img {
	width:200px;
	height:auto;}

.dropdown-content p sup {
	vertical-align: baseline;
	position:relative;
	top:-0.4em;}

.dropdowntext:hover .dropdown-content {
    display: block;
transition: 1.2s ease;}

.dropdowntext:hover .dropdown-content p {
	border-bottom:0px solid palegreen;}
	
	
	
	
	
	
/* TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT */

#projecttext {
	position:relative;
	left:16.25%;
	margin-left:5%;
	margin-top:150px;
	margin-bottom:45px;
	width:23.625%; 
	
	font-family: 'tiempos', serif;	
	font-size:15px;
	line-height:138%;
	text-transform:none;
	font-style: normal;
	color:black;
	letter-spacing:0.03em;}
	
#projecttext span {
	font-size:24.25px;
	letter-spacing:0.03em;
	line-height:135%;}
	
#infotext, #infotext span, #infotext p, #infotextpress, #infotextpress span, #infotextpress p, #infotextbio, #infotextbio span, #infotextbio p {
	clear:left;
	padding-bottom:50px;
	padding-top:50px;
	margin-top:75px;
	
	font-family: 'Lato', sans-serif;
	font-size:14.25px;
	font-weight:300;
	text-transform:none;
	color:black;
	letter-spacing:0.03em;
	line-height:135%;}

#infotext, #infotextpress, #infotextbio {
	margin-left:3.5%;}

#infotextpress, #infotext {
	width:60%;}

#infotextbio {
	width:30%;}
	
#infotext span, #infotextpress span, #infotextbio span {
	font-weight:300;}

#infotextpress p, #infotextbio p {
	font-weight:400;
	margin-bottom:0;
	padding-bottom:0;}
	
	



	
	
/* SMALL SCREEN TEXT SMALL SCREEN TEXT SMALL SCREEN TEXT SMALL SCREEN TEXT */
  
#touchtext, #touchtextcaptions {
	display:none;
	clear:left;
	float:left;
	margin-top:50px;}
	
#touchtext, #touchtext span {
	padding-top:50px;
	padding-bottom:100px;
	margin-left:15%;
	width:70%;
	
	font-family: 'tiempos', serif;	
	font-size:15px;
	text-transform:none;
	color:#black;
	letter-spacing:0.03em;
	line-height:138%;}

#touchtext span {
	padding-bottom:4px;
	border-bottom:1px solid #191047;}

#touchtext sup {
	vertical-align: baseline;
	position:relative;
	top:-0.4em;}

#touchtext img {
	width:200px;
	height:auto;}
	
#touchtextcaptions, #touchtextcaptions span, #touchtextcaptions p {
	width:50%;
	clear:left;
	margin-left:3.5%;
	padding-bottom:50px;
	
	font-family: 'Lato', sans-serif;
	font-size:14.25px;
	font-weight:300;
	text-transform:none;
	color:black;
	letter-spacing:0.055em;
	line-height:145%;}
	
#touchtextcaptions span {
	margin-left:0;
	font-weight:300;
	font-style:italic;}
	
#touchtextcaptions p {
	margin-left:0;
	margin-bottom:0;
	padding-bottom:0;
	font-weight:400;}
	















	


/*MEDIA QUERIES MEDIA QUERIES MEDIA QUERIES MEDIA QUERIES MEDIA QUERIES MEDIA QUERIES MEDIA QUERIES */

@media only screen and (max-width: 1500px) {
	.dropdowntext {
		width:77.5%;
		margin-left:15.25%;}  

		#projecttext {
		width:30%;}}
	
@media only screen and (max-width: 1315px) {
	#nametitle, a.navlinkindex:link, a.navlinkindex:visited {
		font-size:30px;}
	.dropdowntext span, #projecttext span {	
		font-size:21.25px;}
	#footer, a.projectlink:link, a.projectlink:visited, .dropdown-content p, #projecttext, #touchtext, #touchtext span {
		font-size:13.125px;}
	#upcoming, a.infotextlink:link, a.infotextlink:visited, .text, .text span, #infotext, #infotext span, #infotext p, #infotextpress, #infotextpress span, #infotextpress p, #infotextbio, #infotextbio span, #infotextbio p {	
		font-size:12.5px;}
	a.navlink:link, a.navlink:visited {	
		font-size:20.125px;}
	
	.text {top:37.5%;} 
	.dropdowntext {
		width:85%;
		margin-left:14.75%;}

	#projecttext {
		width:27.5%;} 
	#home {
		top:18px;}  

	#infotextbio {
	width:40%;}
}

	
	
	
@media only screen and (max-width: 900px) {
	#nametitle, a.navlinkindex:link, a.navlinkindex:visited {
		font-size:30px;}
	.dropdowntext span, #projecttext span {	
		font-size:21.25px;}
	#footer, a.projectlink:link, a.projectlink:visited, .dropdown-content p, #projecttext, #touchtext, #touchtext span {
		font-size:13.125px;}
	#upcoming, a.infotextlink:link, a.infotextlink:visited, .text, .text span, #infotext, #infotext span, #infotext p, #infotextpress, #infotextpress span, #infotextpress p, #touchtextcaptions, #touchtextcaptions span, #touchtextcaptions p, #infotextbio, #infotextbio span, #infotextbio p {	
		font-size:12.5px;}
	a.navlink:link, a.navlink:visited {	
		font-size:20.125px;}
	
	#indexfixed {
		position:relative;
		width:90%;}
	#nametitle {
		margin-left:14%;}
	#menuitems {
		position:relative;
		margin-top:28px;
		padding-top:25px;
		left:15%;
		width:80%;  }
	#imagecontainerindex {
		width:95%;
		margin-left:5%;	}
	#upcoming: {
		margin-bottom:50px;	}
	
	#touchtext, #touchtextcaptions {
		display:block;}
	#touchtextcaptions p {
		left:0; }
	.dropdowntext {
		display:none;}
	#home {
		top:25px;}
	#projecttext {
		clear:left;
		width:40%;
		left:15%;
		margin-left:0;}
	#imageblockv, #imageblockh {
		width:100%; }
	.overlay {
		display:none;}
	#infotext {
		width:90%;}  

	#infotextbio {
		width:50%;}}




@media only screen and (max-width: 700px) {
	
	#nametitle, a.navlinkindex:link, a.navlinkindex:visited {
		font-size:30px;}
	.dropdowntext span, #projecttext span {	
		font-size:21.25px;}
	#footer, a.projectlink:link, a.projectlink:visited, .dropdown-content p, #projecttext, #touchtext, #touchtext span {
		font-size:13.125px;}
	#upcoming, a.infotextlink:link, a.infotextlink:visited, .text, .text span, #infotext, #infotext span, #infotext p, #infotextpress, #infotextpress span, #infotextpress p, #touchtextcaptions, #touchtextcaptions span, #touchtextcaptions p, #infotextbio, #infotextbio span, #infotextbio p {	
		font-size:12.5px;}
	a.navlink:link, a.navlink:visited {	
		font-size:20.125px;}
	
	#indexfixed {
		position:relative;
		width:90%;}
	#nametitle {
		margin-left:9%;}
	#menuitems {
		position:relative;
		margin-top:28px;
		padding-top:25px;
		left:10%;
		width:85%;  }
	#imagecontainerindex {
		width:95%;
		margin-left:5%;	}

	#touchtext {
		margin-left:10%;
		width:80%;}
	#touchtext span {
		left:0;}
	#nametitle span {
		padding-left:0px;} 

	#touchtext, #touchtextcaptions {
		display:block;}
	#touchtextcaptions p {
		left:0; }
	.dropdowntext {
		display:none;}
	#home {
		top:25px;}
	#projecttext {
		clear:left;
		width:40%;
		left:10%;
		margin-left:0;}
	#imageblockv, #imageblockh {
		width:100%; }
	.overlay {
		display:none;}
	
	#infotextbio {
	width:60%;}

}

