/*
	Mobile styles
*/

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

body, html, p, h1, h2, h3, h4, a {
	font-size:21px!important;
}

#mobi-home-anchor {
  font-family: 'GT Sectra Display Regular', helvetica!important;
}

.mobi-desc, #mobi{
	display:block!important;
	padding:50px 0 10px 0;
	background:white;
}

.mobi-menu {
	padding:25px 0 0 6px;
	line-height:1.6;
	height:100vh;
	background:white;
	margin-left: -6px;
}

.spacer .s_viewport {
	height: -o-calc(100vh - 40px); /* opera */
	height: -webkit-calc(100vh - 40px); /* google, safari */
	height: -moz-calc(100vh - 40px); /* firefox */
}

.desc {
	max-height: none;
	display:none;
	overflow: hidden;
	z-index:10;
	height: -o-calc(100vh - 130px); /* opera */
	height: -webkit-calc(100vh - 130px); /* google, safari */
	height: -moz-calc(100vh - 130px); /* firefox */
	width: -o-calc(100vw - 12px); /* opera */
	width: -webkit-calc(100vw - 12px); /* google, safari */
	width: -moz-calc(100vw - 12px); /* firefox */
	background:white;
	padding: 0px 6px 0px 6px;
	left:0;
	position:fixed;
	margin-top:20px;
	
}

.wrap{
    max-height: none;
    position: fixed;
   	height: -o-calc(100vh - 130px); /* opera */
	height: -webkit-calc(100vh - 130px); /* google, safari */
	height: -moz-calc(100vh - 130px); /* firefox */
	width: -o-calc(100vw - 12px); /* opera */
	width: -webkit-calc(100vw - 12px); /* google, safari */
	width: -moz-calc(100vw - 12px); /* firefox */
    overflow: hidden;
    display: block;
    padding-top:0;
}

.contentdesc {
	display: block;
	position:absolute;
	overflow-y: scroll;
	z-index:100;
	padding-top:20px;
	height: -o-calc(100vh - 240px); /* opera */
	height: -webkit-calc(100vh - 240px); /* google, safari */
	height: -moz-calc(100vh - 240px); /* firefox */	
}

.description {
	padding: 0 6px 0 6px!important;	
}

#pin10 .description {
	padding:0px!important;
}

#pin10 #grad {
	margin-top:0px!important;
	background: -webkit-linear-gradient(rgba(255,255,255,1), rgba(255,255,255,0))!important;
    background: -o-linear-gradient(rgba(255,255,255,1), rgba(255,255,255,0))!important;
    background: -moz-linear-gradient(rgba(255,255,255,1), rgba(255,255,255,0))!important;
    background: linear-gradient(rgba(255,255,255,1), rgba(255,255,255,0))!important;
}

.mobi-header {
	display:block!important;
	width:100%;
	padding:6px;
	z-index:10000;
	background:white;
	position:fixed;
	height:40px;
	top:0;
}

.hamburger {
	height:36px;
	width:36px;
	top:0;
	right:0;
	padding:10px;
	position: fixed;
	z-index:1000000000!important;
}

.hamburger img {
	height:auto;
    width: 100%;
    position:relative;
}

.plus {
	display:block;
	height:36px;
	width:36px;
	right:0;
	top:36px;
	padding: 10px;
	position:absolute;
	z-index:9998!important;
	visibility:hidden;
}

.plus img {
	width: 60%;
	padding:10% 0 0 20%;
    position:relative;
}

.minus {
	display:none;
	height:36px;
	width:36px;
	right:0;
	top:36px;
	background:white;
	padding:10px;
	position:absolute;
	z-index:9999!important;
}

.minus img {
	height:auto;
    width: 60%;
	padding:10% 0 0 20%;
    position:relative;
}

.mobi-menu, #header, .no-mob, #still-center img  {
	display:none!important;
}

#still-right img, #still-left img {
    width: 70%!important;
    padding-bottom:8px;
}

.text-excerpt {
	width:70%!important;
}

.text-excerpt p {
	padding: 8% 4% 8% 8%!important;
}

#text-right{
	left:30%!important;
}

#abouttext {
	margin-left:10px!important;
}

.about-mob {
	display:block!important;	
}

#grad {
	z-index: 10000;
	position: relative;
}

.loading {
	left:155px!important;
	top:9px!important;
}

#abouttext a{
	text-decoration: underline!important;
}

.mobpdf{
	display:block!important;
	height: -o-calc(100vh - 130px); /* opera */
	height: -webkit-calc(100vh - 130px); /* google, safari */
	height: -moz-calc(100vh - 130px); /* firefox */
}

.pdfbtn {
	margin-top:40%!important;
}

#project-content10 {
	height: -o-calc(100vh - 100px)!important; /* opera */
	height: -webkit-calc(100vh - 100px)!important; /* google, safari */
	height: -moz-calc(100vh - 100px)!important; /* firefox */
}

}



/* 
	Large screens 
*/

@media only screen and (min-width : 1824px) {

p , h1, h2, h3, h4, a  {
	font-size: 14.5px!important;
}

a.active {
  font-family: 'GT Sectra Display Regular', helvetica;
  font-size: 13.5px!important;
}

.film iframe {
	height:900px!important;
}

.screen object {
	height:850px!important;
}

.mobi-desc, .mobi-header, #mobi, .about-mob {
	display:none;
}

.text-excerpt p {
	padding: 70px 25% 70px 25%!important;
}

.spacer.s4 {
	height:80px!important;
}

.loading {
	top: 5px!important;
    left: 114px!important;
}

}


/*
	Desktop-specific styles
*/

.mobi-desc, .mobi-header, #mobi, .about-mob {
	display:none;
}

/*
	General styles
*/

@font-face {
  font-family: 'GT Sectra Display Light';
  src: url('GT-Sectra-Display-Light.eot'); /* IE9 Compat Modes */
  src: url('GT-Sectra-Display-Light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('GT-Sectra-Display-Light.woff') format('woff'), /* Pretty Modern Browsers */
       url('GT-Sectra-Display-Light.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('GT-Sectra-Display-Light.svg#svgFontName') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'GT Sectra Display Regular';
  src: url('GT-Sectra-Display-Regular.eot'); /* IE9 Compat Modes */
  src: url('GT-Sectra-Display-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('GT-Sectra-Display-Regular.woff') format('woff'), /* Pretty Modern Browsers */
       url('GT-Sectra-Display-Regular.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('GT-Sectra-Display-Regular.svg#svgFontName') format('svg'); /* Legacy iOS */
}

body {
	font-family: 'GT Sectra Display Light', helvetica;
	background-color: white;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

body, html {
	height: 100%;
}

p , h1, h2, h3, h4, a  {
	font-family: 'GT Sectra Display Light', helvetica;
	font-size: 13px;
	-webkit-margin-before: 0em;
    -webkit-margin-after: 0em;
}

a, a:visited {
	text-decoration: none;
	color:black;
}

a:hover {
	text-decoration: underline;
}

a.active {
  font-family: 'GT Sectra Display Regular', helvetica;
  font-size: 12.5px;
}

#initial {
	position:fixed;
	width:100%;
	height:100vh;
	overflow:hidden;
	padding:6px;
	z-index:10001;
	background:white;	
	margin-top:4px;
}

#initial p {
	font-family: 'GT Sectra Display Regular', helvetica;
    font-size: 12.5px;
}

.loading {
	top: 4px;
    left: 94px;
    position: absolute;
    width: 13px;
    height: auto;
    z-index: 10000;
}

.loading img {
	width:100%;
}

.film iframe, .screen object {
	height:600px;
}

#covergrad {
	display:block;
	height : 90vh;
	background: -webkit-linear-gradient(rgba(195,195,195, 0.8), rgba(255,255,255,0)); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(rgba(195,195,195, 0.8), rgba(255,255,255,0)); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(rgba(195,195,195, 0.8), rgba(255,255,255,0)); /* For Firefox 3.6 to 15 */
	background: linear-gradient(rgba(195,195,195, 0.8), rgba(255,255,255,0)); /* Standard syntax (must be last) */
	margin-top:-100vh;
}

.touchonly {
	display: none;
}

/*
	Custom styles
*/

section {
font-size:0;
}

.menu {
	position:fixed;
	width:100%;
	padding:6px;
	z-index:10000;
	background:white;
}

.description {
	padding:30px 6px 6px 6px;
	background:white;
}

#pin10 .description {
	padding:4px;
	background:none;
}

#pin10 #grad {
	margin-top:4px;
	background:none;
	border-top: 1px solid black;
}

.description a {
	padding-left:10px;
	text-decoration:underline;
}

#blank {
	background:white;
}

#grad {
	height : 45px;
	background: -webkit-linear-gradient(rgba(255,255,255,1), rgba(255,255,255,0)); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(rgba(255,255,255,1), rgba(255,255,255,0)); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(rgba(255,255,255,1), rgba(255,255,255,0)); /* For Firefox 3.6 to 15 */
	background: linear-gradient(rgba(255,255,255,1), rgba(255,255,255,0)); /* Standard syntax (must be last) */
}

#gradfix {
	background: white;
	height:45px;
	margin-top:-45px;
}

.content, .pin {
	position:relative;
}

#main {
	z-index:0;
}

#pin1 {
	z-index:15;
}

#project-content1 {
	z-index:10;
}

#pin12 {
	z-index:25;
}

#project-content12 {
	z-index:20;
}

#pin2 {
	z-index:35;
}

#project-content2 {
	z-index:30;
}

#pin3 {
	z-index:45;
}

#project-content3 {
	z-index:40;
}

#pin4 {
	z-index:55;
}

#project-content4 {
	z-index:50;
}

#pin42 {
	z-index:65;
}

#project-content42 {
	z-index:60;
}

#pin5 {
	z-index:75;
}

#project-content5 {
	z-index:70;
}

#pin6 {
	z-index:85;
}

#project-content6 {
	z-index:80;
}

#pin7 {
	z-index:95;
}

#project-content7 {
	z-index:90;
}

#pin72 {
	z-index:105;
}

#project-content72 {
	z-index:100;
}

#pin73 {
	z-index:115;
}

#project-content73 {
	z-index:110;
}

#pin8 {
	z-index:125;
}

#project-content8 {
	z-index:120;
}

#pin9 {
	z-index:135;
}

#project-content9 {
	z-index:130;
}

#pin10 {
	z-index:145;
}

#project-content10 {
	z-index:140;
	background-color: white; 
	height: -o-calc(100vh - 32px); /* opera */
	height: -webkit-calc(100vh - 32px); /* google, safari */
	height: -moz-calc(100vh - 32px); /* firefox */
}

#about{
	z-index:140;
}

#still-left {
	position:inherit;
	text-align:left;
	background:white;
}

#still-right {
	position:inherit;
	text-align:right;
	background:white;
}

#still-center {
	position:inherit;
	text-align:center;
	background:white;
}

#still-left img, #still-right img, #still-center img {
	width:40%;
	margin-bottom:40px;
}

.text-excerpt {
	width:40%;
	text-align:left;
	vertical-align: center;
	margin-bottom:40px;
}

#text-right {
	left:60%;
	position:inherit;
}

.text-excerpt p {
	position:relative;
	padding:50px;
	z-index: ;
}

.spacer.s0 {
	height: 1px;
}
.spacer.s2 {
	height: 20px;
/*	top: 25px;
    position: relative;
    background: linear-gradient(rgba(0, 0, 0, 0), rgba(17, 17, 17, 0.15));*/
}
.spacer.s4 {
	height: 40px;
}
.spacer.s6 {
	height: 60px;
}
.spacer.s90 {
	height: 70px;
}

.spacer.s_viewport {
	height: 100vh;
}

.film {
	width:100%;
	height:auto;
}

.screen {
	width:100%;
	height:76vh;
	background-color: white;
	z-index:2;
	position:absolute;
	opacity: 0.9;
}

.pdfbtn {
	position:absolute;
	text-align: center;
	z-index:82;
	font-size: 11pt;
	margin:20% 40% 0;
	width:20%;
	cursor: pointer;
}

.pdf object, .pdf iframe {
	width:100%;
	height:76vh;
}

.closepdf {
	position:fixed;
	z-index:500;
	font-size: 11pt;
	text-align: center;
	padding:4px;
	cursor: pointer;
	width:20%;
	margin:0 auto 0;
	text-align: center;
	bottom:0px;
	width:100%;
	background:white;
	border-top: 1px solid black;
}

#closepdf1, #closepdf2, #closepdf3, .mobpdf{
	display:none;
}

#abouttext {
	width:95%;
	margin-left:3%;
    padding-top:10px;
    display:block;
}

.aboutpara {
	width:35%;
	margin-right:4%;
	display:inline-block;
    position:relative;
    vertical-align:top;
}

#abouttext a {
	padding-left: 0;
}

#cues p {
	width:100%;
    display:inline-block;
    position:relative;
    vertical-align:top;
}

#cues h1, #cues p {
	margin:0;
	padding:0;
}

#cues  {
    width:20%;
    display:inline-block;
    position:relative;
    vertical-align:top;
}

/*
	Scrollmagic styles
*/

html.touch .touchonly {
	display: block;
}
.noselect * {
	user-select: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
}
.doselect * {
	user-select: auto;
	-webkit-user-select: auto;
	-khtml-user-select: auto;
	-moz-user-select: auto;
	-o-user-select: auto;
}

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

.clearfix {
    display: inline-block;
}

html[xmlns] .clearfix {
}

* html .clearfix {
    height: 1%;
}

.close, .readmore {
	display:none;
}

.readmore {
	width:100vw;
	background:black;
	color:white;
	top:0;
	z-index:10!important;
	opacity: 0.25;
	outline:none;	
}

.readmorebtn {
	visibility:hidden;
	outline:none;
}

.readmore p {
	width:50vw;
	margin:200px 25vw 150px;
	position:relative;
}

.readmore img {
	width:80vw;
	margin-top:220px 10vw 0;
}

#readmore1_background {
	background:black!important;
	z-index:12!important;
}

#readmore1_wrapper {
	z-index:14!important;
}

#readmore2_background {
	background:black!important;
	z-index:22!important;
}

#readmore2_wrapper {
	z-index:24!important;
}

#readmore3_background {
	background:black!important;
	z-index:42!important;
}

#readmore3_wrapper {
	z-index:44!important;
}

#readmore4_background {
	background:black!important;
	z-index:52!important;
}

#readmore4_wrapper {
	z-index:54!important;
}

#readmore5_background {
	background:black!important;
	z-index:72!important;
}

#readmore5_wrapper {
	z-index:74!important;
}

#readmore6_background {
	background:black!important;
	z-index:82!important;
}

#readmore6_wrapper {
	z-index:84!important;
}

#readmore7_background {
	background:black!important;
	z-index:92!important;
}

#readmore7_wrapper {
	z-index:94!important;
}

#readmore72_background {
	background:black!important;
	z-index:102!important;
}

#readmore72_wrapper {
	z-index:104!important;
}


#readmorebtn1, #readmorebtn2 {
	outline:none;
}