@import url("reset.css");

@charset "UTF-8";

#screenshot-watermark {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 998;
  height: 100%;
  width: 100%;
  background: #FFF; 
  display: none;
}
#screenshot-watermark h2 {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -100%);
          transform: translate(-50%, -100%);
  font-family:'BrandonGrotesque-Regular', sans-serif;
	font-size:24px;
	letter-spacing: 0.07em;
	color:#000;
  white-space: nowrap;
  width: 100%;
  text-align: center;
}
@media (max-width: 767px) {
  #screenshot-watermark h1 {
    font-size: 33px;
  }
}
.screen_cross {
	position:absolute;
	top:49px; 
	right:56px;
	z-index:710;
	cursor:pointer;
}



@font-face {
    font-family: 'proximanova-light';
    src: url('proximanova-light-webfont.eot');
    src: url('proximanova-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('proximanova-light-webfont.woff') format('woff'),
         url('proximanova-light-webfont.ttf') format('truetype');
         /*url('proximanova-light-webfont.svg#proximanova-light-webfont') format('svg');*/
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Proxima-Nova-Semibold';
    src: url('Proxima-Nova-Semibold.eot');
    src: url('Proxima-Nova-Semibold.eot?#iefix') format('embedded-opentype'),
         url('Proxima-Nova-Semibold.woff') format('woff'),
         url('Proxima-Nova-Semibold.ttf') format('truetype');
         /*url('Proxima-Nova-Semibold.svg#Proxima-Nova-Semibold') format('svg');*/
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'BrandonGrotesque-Black';
    src: url('BrandonGrotesque-Black-webfont.eot');
    src: url('BrandonGrotesque-Black-webfont.eot?#iefix') format('embedded-opentype'),
         url('BrandonGrotesque-Black-webfont.woff') format('woff'),
         url('BrandonGrotesque-Black-webfont.ttf') format('truetype');
         /*url('brandongrotesque-black-webfont.svg#brandongrotesque-black-webfont') format('svg');*/
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'BrandonGrotesque-Medium';
    src: url('BrandonGrotesque-Medium.eot');
    src: url('BrandonGrotesque-Medium.eot?#iefix') format('embedded-opentype'),
         url('BrandonGrotesque-Medium.woff') format('woff'),
         url('BrandonGrotesque-Medium.ttf') format('truetype');
         /*url('brandongrotesque-black.svg#brandongrotesque-black') format('svg');*/
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'BrandonGrotesque-Regular';
    src: url('brandon-regular.eot');
    src: url('brandon-regular.eot?#iefix') format('embedded-opentype'),
         url('brandon-regular.woff') format('woff'),
         url('brandon-regular.ttf') format('truetype');
         /*url('brandongrotesque-black.svg#brandongrotesque-black') format('svg');*/
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'BrandonGrotesque-Light';
    src: url('BrandonGrotesque-Light.eot');
    src: url('BrandonGrotesque-Light.eot?#iefix') format('embedded-opentype'),
         url('BrandonGrotesque-Light.woff') format('woff'),
         url('BrandonGrotesque-Light.ttf') format('truetype');
         /*url('brandongrotesque-black.svg#brandongrotesque-black') format('svg');*/
    font-weight: normal;
    font-style: normal;
}

html {
	text-rendering: optimizeLegibility;
}

body {
	font-family:'proximanova-light', sans-serif;
	font-size:12px;
	background-color: #1c1c1c;
	margin: 0;
	padding: 0;
}


img {
	border:none;
}

/*    FULL SCREEN INTRO PIC      */

/* !FOCUSED IMAGES */
/*-----------------------------------------*/
.focuspoint {
	position: fixed; /*Any position but static should work*/
	overflow: hidden;
	/*display:table;*/
}
.focuspoint img {
	position: absolute;
	left: 0;
	top: 0;
	margin: 0;
	display: block;
	/* fill and maintain aspect ratio */
	width: auto; height: auto;
	min-width: 100%; min-height: 100%;
	max-height: none; max-width: none;
	z-index:1;
}

#bg {
	position:fixed; 
	z-index:1; 
	/*overflow:hidden; */
	top:0px; 
	left:0px;
}
#bgimg {
	visibility:hidden;
}

/*    FULL SCREEN FOREGROUND PIC      */

#fg {
	position:fixed;  
	/*overflow:hidden;*/ 
	top:0px; 
	left:0px;
	z-index:20;
}
#fgimg {
	visibility: hidden;
}

/*    INTRO PAGE    */
.intro_container {
	position:relative;
	width: 100%;
	margin: 0 auto;
	text-align:center;	
}
.intro_container h1 {
	position:relative;
	font-family:'BrandonGrotesque-Regular', sans-serif;
	font-size:24px;
	letter-spacing: 0.07em;
	margin:0 auto;
	color:#FFF;
	text-align:center;
	z-index:10;
	opacity:0;
}
.introHeader {	
	position:fixed;
	top:0;
	left:0;
	z-index:400;
	width:100vw;
	height:100vh;
	display:none;
}


.logo_white {
	font-family: 'BrandonGrotesque-Regular' ,sans-serif;
	letter-spacing:0.05em;
	color:#FFF;
	font-size:14px;
	position:fixed;
	top:53px;
	left:56px;
	color:#FFF;
	z-index:100;
}
.menu_logo {
	font-family: 'BrandonGrotesque-Regular' ,sans-serif;
	letter-spacing:0.05em;
	color:#199fb4;
	font-size:14px;
	position:absolute;
	top:53px;
	left:56px;
	z-index:510;
}

.logo {
	font-family: 'BrandonGrotesque-Regular' ,sans-serif;
	letter-spacing:0.05em;
	color:#199fb4;
	font-size:14px;
	position:fixed;
	top:53px;
	left:56px;
	z-index:700;
}

#screenshot-watermark a:link {
	color: #000;
	text-decoration: none; 
}
#screenshot-watermark a:visited {
	color: #000;
	text-decoration: none;
}
#screenshot-watermark a:hover, a:active, a:focus { 
	text-decoration: none;
	color: #199fb4;
}
.introNav a:link {
	color: #FFF;
	text-decoration: none; 
}
.introNav a:visited {
	color: #FFF;
	text-decoration: none;
}
.introNav a:hover, a:active, a:focus { 
	text-decoration: none;
	color: #199fb4;
}

.mainNav a:link {
	color: #199fb4;
	text-decoration: none; 
}
.mainNav a:visited {
	color: #199fb4;
	text-decoration: none;
}
.mainNav a:hover, a:active, a:focus { 
	text-decoration: none;
	color: #FFF;
}
.logo a:link {
	color: #199fb4;
	text-decoration: none; 
}
.logo a:visited {
	color: #199fb4;
	text-decoration: none;
}
.logo a:hover, a:active, a:focus { 
	text-decoration: none;
	color: #FFF;
}
.tintCap a:link {
	color: #FFF;
	text-decoration: none; color:#FFF0;; 
}
.tintCap a:visited {
	color: #FFF;
	text-decoration: none; color:#FFF0;; 
}
.tintCap a:hover, a:active, a:focus { 
	text-decoration: none; color:#FFF0;; 
	color: #FFF;
}
.header {	
	position:fixed;
	top:0;
	left:0;
	z-index:400;
	width:100vw;
	height:100vh;
	display:none;
}

.menu_icon {
	position:fixed;
	top:49px; 
	right:56px;
	z-index:200;
	cursor:pointer;
	z-index:400;
}

.menu_cross {
	position:fixed;
	top:49px; 
	right:56px;
	z-index:410;
	cursor:pointer;
	display:none;
}
.full_screen {
	position:fixed;
	bottom:20px; 
	right:56px;
	z-index:410;
	cursor:pointer;
}
.icon {
	position:fixed;
	top:9px; 
	right:18px;
	cursor:pointer;
	z-index:200;
}

.back_cross {
	position:fixed;
	top:49px; 
	right:56px;
	z-index:900;
	cursor:pointer;
	padding:0 0 20px 20px;
}

/*    NAVIGATION    */



/*  INTRO NAV  */
.menu-archive {
	font-size:20px;
}

.openingNav {
	position:relative;
	/*display:none;*/
	/*float:none;*/
	width:100vw;
	height: 100vh;
	text-align:center;
	top:0;
	background-color: rgba(0, 0, 0, 0.7);
	z-index:400;
}
ul.introNav {
	font-family: 'BrandonGrotesque-Light', sans-serif;
	list-style: none;
	font-size:32px;
	line-height:40px;
	padding-top:50px;
	letter-spacing:0.04em;
}
ul.introNav li {
	display: block;
	color:#FFF;
	height:40px;
}
ul.introNav li + li {
	padding-left: 0px;
}
ul.introNav li a:hover {
	color: #199fb4;
}
ul.introNav li.active a {
	color:#199fb4;
	text-decoration: none;
}

/*  MAIN NAV  */

.mainNav {
	position:relative;
	width:100vw;
	height: 100vh;
	text-align:center;
	top:0;
	background-color:#000;
	z-index:600;
}
ul.nav {
	position:relative;
	font-family: 'BrandonGrotesque-Light', sans-serif;
	list-style: none;
	font-size:32px;
	line-height:40px;
	padding-top:50px;
	letter-spacing:0.04em;
	z-index:650;
}
ul.nav li {
	display: block;
	color:#9fbfbc;
	height:40px;
	text-align:center;
}
ul.nav li + li {
	padding-left: 0px;
}
ul.nav li a:hover {
	color: #FFF;
}
ul.nav li.active a {
	color:#FFF;
	text-decoration: none;
}


/*   THUMBNAILS   */
/*     SLIDESHOW    */

.fltrt {  
	float: right;
}
.fltlft { 
	float: left;
}
.clearfloat { 
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}

/*///////   SCROLLING SECTIONS  /////////////////////////////////////////////////////////////////*/
.info_tint {
	position:fixed;
	top:0;
	left:0;
	width:100vw;
	height:100vh;
	background-color: rgba(0, 0, 0, 0.7);
	display:none;
	z-index:50;
}
/*  ID TO SCROLL TO IN THUMBS SECTION  */
#scroller {
}
.info-thumbnails {
	position:relative;
	top:100vh;   
	left:0;	
	z-index:200;
	height:auto;
	max-height:100vh;
	opacity:0;	
}
.background {

}

* {
  box-sizing: border-box; 
}

.section {
	position:relative;
 	width: 100%;
  	display: table;
 	margin: 0;
  	height: 100vh;
}
.thumb-section {
	position:relative;
 	width: 100%;
  	display: table;
 	margin: 0;
  	/*height: 100vh;*/
}
.white_content {
	position:relative;
	height:100vh;
}
.content {
	position:relative;
 	display: table-cell;
  	vertical-align: middle;
  	
}
.content h1 {
	font-family:'BrandonGrotesque-Light', sans-serif;
	font-size:50px;
	line-height:60px;
	letter-spacing:0.14em;
	color:#199fb4;
	padding:190px 0 0 0;
	text-align:center;
}
.info_text {
	width:60%;
 	max-width:720px;
	font-family:'proximanova-light', sans-serif;
  	font-size:20px;
  	line-height:30px;	
  	text-align:center;
	margin:0 auto;
	padding:60px 0 100px 0;
	color:#FFF;
	letter-spacing:0.02em;
}
.info_text h2 {
	font-family:'Proxima-Nova-Semibold', sans-serif;
}
.info_text a:link {
	color: #FFF;
	text-decoration: underline; 
}
.info_text a:visited {
	color: #FFF;
	text-decoration: none;
}
.info_text a:hover, a:active, a:focus { 
	text-decoration: none;
	color: #199fb4;
}
.poem-text {
	width:60%;
 	max-width:720px;
	font-family:'proximanova-light', sans-serif;
  	font-size:20px;
  	line-height:30px;	
  	text-align:center;
	margin:0 auto;
	padding:60px 0 0px 0;
	color:#FFF;
	letter-spacing:0.02em;
}
.poem-text h2 {
	font-family:'Proxima-Nova-Semibold', sans-serif;
}
.poem-text a:link {
	color: #FFF;
	text-decoration: underline; 
}
.poem-text a:visited {
	color: #FFF;
	text-decoration: none;
}
.poem-text a:hover, a:active, a:focus { 
	text-decoration: none;
	color: #199fb4;
}
.gallery_footer {
	position:fixed;
	height:32px;
	bottom:50px;
	left:0;
	width:100%;
	z-index:100;
}
.down_arrow {
	position:relative;
	top:0px;
	bottom:0;
	margin:0 auto;
	width:62px;
	height:32px;
	padding:20px 0 20px 0;
	cursor:pointer;
	z-index:100;
}
.down_arrow2 {
	position:relative;
	top:60px;
	bottom:0;
	margin:0 auto;
	width:62px;
	height:32px;
	/*opacity:0;*/
	cursor:pointer;
	z-index:100;
}

.arrow-down {
    -webkit-animation: arrow-move-and-fade 2s ease-in-out infinite;
    animation:         arrow-move-and-fade 2s ease-in-out infinite;
    background: transparent url(../gifs/arrow_down_blue.png) 50% 50% no-repeat;
    background-size: contain;
    bottom: 10px;
    color: #fee4c0;
    cursor:pointer;
    height: 45px;
    left: 50%;
    line-height: 60px;
    margin: 0px 0 0 -30px;
    position: fixed;
    text-align: center;
    text-decoration: none;
    text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.4);
    width: 60px;
    z-index: 40;
	display:none;
}

/* Animated scroll arrow animation*/
@-webkit-keyframes arrow-move-and-fade {
    0%   { -webkit-transform:translate(0,-20px); opacity: 0;  }
    50%  { opacity: 1;  }
    100% { -webkit-transform:translate(0,20px); opacity: 0; }
}
@keyframes arrow-move-and-fade {
    0%   { -webkit-transform:translate(0,-20px); transform:translate(0,-20px); opacity: 0;  }
    50%  { opacity: 1;  }
    100% { -webkit-transform:translate(0,20px); transform:translate(0,20px); opacity: 0; }
}



.scroll_button {
	height:14px;
	font-family:'BrandonGrotesque-Medium', sans-serif;
	font-size:14px;
	letter-spacing:0.12em;
	color:#fff;
	text-align:center;	
	width:100%;
	visibility:hidden;
	padding-bottom:20px
}

/*    THUMBNAILS   */
.thumbContent {
	padding-top:100px;
	width:60%;
	max-width:970px;
	margin:0 auto;	
}
/*  THUMBNAILS MASONRY    */


.hide {
    visibility: hidden;
    opacity: 0;
}
.item{
	float:left;
	margin:0 0px 3.5% 0;
	border:1px solid #FFF;
	/*opacity: 0;*/
}
.item img {
	display:block;
	width:100%;	
}

.item,
.grid-sizer {
  width: 31%;
}
.gutter-sizer {
    width: 3.5%;
}

/**** Transitions for Masonry ****/

.masonry,
.masonry .masonry-brick {
  -webkit-transition-duration: 0.4s;
     -moz-transition-duration: 0.4s;
      -ms-transition-duration: 0.4s;
       -o-transition-duration: 0.4s;
          transition-duration: 0.4s;
}

.masonry {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.masonry .masonry-brick {
  -webkit-transition-property: left, right, top;
     -moz-transition-property: left, right, top;
      -ms-transition-property: left, right, top;
       -o-transition-property: left, right, top;
          transition-property: left, right, top;
}


.preloader {
	position: fixed;
	top: 50%;
	left: 50%;
	margin: -21px 0 0 -21px;
	z-index: 1;
	width: 42px;
	height: 42px;
	z-index:100;
}


/*.videoWrapper */
.iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#page-wrap {
    width: 86%;
    margin: 0 auto;
	margin-top:52px !important;
}
figure { 
	display: block;
	padding: 10px; 
}

.js-resize {
	/*border:1px solid #FFF;*/
}




/*///////   COLLECTED THUMBNAILS  /////////////////////////////////////////////////////////////////*/

.collected_content {
	width:70%;
	max-width: 960px;
	margin:0 auto;
	padding:170px 0 50px 0;
}
.collected_content h1 {
	font-family:'BrandonGrotesque-Light', sans-serif;
	font-size:45px;
	line-height:60px;
	letter-spacing:0.12em;
	color:#199fb4;
	text-align:center;
}
.collected_thumbs {
	width:100%;
	padding-top:70px;
}

.hide {
    visibility: hidden;
    opacity: 0;
}

.projectsThumbnails {
	width:100%;
	/*float:left;*/
}
.menuThumb {
	width:48%;
	margin-right:4%;
	margin-bottom:4%;
	float:left;
	display:inline-block;
	position:relative;
}
.menuThumb IMG {
	max-width:100%;
	width:100%;
	height:auto;
}
.projectsThumbnails DIV:nth-of-type(2n+2) {
	margin-right:0%;
}
.menuTint {
	position:absolute;
	top:0;
	left:0;
	background-color:#000;
	text-align:center;
	width:100%;
	height:100%;
	opacity:0.5;
	filter:alpha(opacity=50); 
	display:none;
}
.tintCap {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:auto;
	text-align:center;
	margin:0 auto;
	padding:0;
	display:none;
}
.tintCap h2 {
	font-family:'BrandonGrotesque-Light', sans-serif;
	font-size:32px;
	letter-spacing:0.13em;
	color:#FFF;
	 /*-webkit-text-fill-color:#FFF;*/
	text-align:center;
}

/*///////   COLLECTED ZOOM PAGES /////////////////////////////////////////////////////////////////*/
#zoomTool {
}

.zoom-layout {
    height: 100%;
	background-color:#232021;
}

.zoom-layout .container {
    height: 100%;
}

.container {
    position: relative;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}
.info_caption {
	position:fixed;
	width:50%;
	max-width:740px;
	text-align:center;
	font-family:'proximanova-light', sans-serif;
	font-size:20px;
	line-height:30px;
	letter-spacing:0.02em;
	color:#FFF;
	z-index:320;
	opacity:0;
	display:none;
}
.info_caption div {
	display:inline;
}
.info_caption span {
	opacity:1;
}
.close-cross {
	padding-bottom:10px;
	text-align:right;
	cursor:pointer;
}

.zoom_tint {
	position:fixed;
	top:0;
	left:0;
	width:100vw;
	height:100vh;
	background-color: rgba(0, 0, 0, 0.6);
	display:none;
	z-index:300;
}
/*    THUMBS FOR ZOOM PAGE   */ 
/*.zoom_thumbs {
	position:fixed;
	top:0;
	left:0;
	width:100vw;
	height:100vh;
	z-index:500;
	opacity:0;
	display:none;
}
.zoom_menu {
	position:fixed;
	top:49px; 
	right:56px;
	z-index:200;
	cursor:pointer;
	display:none;
	z-index:510;
}*/

/*    INFO BUTTON    */
.collected-caption {
	position:fixed;
	left:58px;
	bottom:58px;
	z-index:350;
	display:block;
}
.collected-caption button {
    display: block;
    margin: auto;
}
.collected-caption button {
    pointer-events: all;
}

.collected-caption button path, .collected-caption button rect {
    fill: #9C9E9F;
}

.collected-caption button:hover path, .collected-caption button:hover rect {
    fill: #fff;
}


.collected-zoom {
	position:absolute;
	right:90px;
	bottom:45px;
	font-family:'BrandonGrotesque-Medium', sans-serif;
	font-size:14px;
	letter-spacing:0.12em;
	color:#FFF;
	z-index:350;
}
/*    ARROW BUTTONS    */
.collected_nav {
	position:relative;
	z-index:350;
}
.collected_nav  {
    pointer-events: all;
}

.collected_nav  path, .collected_nav  polygon {
    fill: #FFF;
}

.collected_nav:hover path, .collected_nav:hover polygon {
    fill: #199fb4;
}
#prev {
	position:fixed;
	top: 50%;
	margin-top:-14px;
    left:56px;
    z-index: 350;
	padding:0 20px 20px 0;
}

#next {
	position:fixed;
	top: 50%;
	margin-top:-14px;
    right:56px;
    z-index: 350;
	padding:0 0 20px 20px;
}

/*///////   ZOOM PAGES /////////////////////////////////////////////////////////////////*/


/* HIDE ORIGINAL ZOOM CONTROLLER */
.leaflet-control-container {
	display:none;
}

/*       HACK TO PREVENT GRID LINES      */
/*.leaflet-tile {
    outline: 1px solid transparent;
}*/

.insect-zoom-control {
    width: 44px;
    position: fixed;
    right: 56px;
	bottom:50px;
    z-index: 350;
}
.insect-zoom-control-label {    
	font-family:'BrandonGrotesque-Medium', sans-serif;
	font-size:14px;
	letter-spacing:0.12em;
	color:#FFF;
    padding: 10px 0;
    text-align: center;
}




.insect-zoom-control button {
    display: block;
    margin: auto;
}

.insect-zoom-control button path, .insect-zoom-control button polygon {
    fill: #9C9E9F;
}

.insect-zoom-control button:hover:not([disabled]) path, .insect-zoom-control button:hover:not([disabled]) polygon {
    fill: #fff;
}

.insect-zoom-control button[disabled] {
    cursor: auto;
}



.no-js .insect-zoom-control {
    display: none;
}

.insect-zoom-control {
    font-family:'BrandonGrotesque-Medium', sans-serif;
	font-size:14px;
	letter-spacing:0.12em;
	color:#FFF;
    padding: 10px 0;
    text-align: center;
	display:block;
}

.zoom-tool {
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
	background-color:#232021;
	height:100%;
}

.no-js .zoom-tool {
    background-repeat: no-repeat;
    background-position: center;
    background-size: 300px 300px;
}

.js .zoom-tool {
    background: none !important
}

.leaflet-zoom-anim .leaflet-zoom-animated {
    transform: translateZ(0);
    transition-duration: .6s;
    transition-timing-function: ease-in-out;
}

.zoom-instruction {
    position: fixed;
    top: 50%;
    left: 50%;
    height: 200px;
    width: 200px;
    margin-left: -100px;
    margin-top: -100px;
    text-align: center;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 50%;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 50px 20px 0 20px;
    border: 5px solid rgba(255, 255, 255, 0.5);
	font-family:Helvetica, Arial, sans-serif;
	font-size:18px;
	line-height:20px;
	color:#FFF;
	z-index:350;
	display:none;
}
@media screen and (min-width:1024px) {
    .zoom-instruction {
        display: none !important;
    }
}

/*.no-js .zoom-instruction {
    display: none;
}*/

button {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    outline: none;
    pointer-events: all;
}

path, polygon {
    fill: #fff;
}




/*///////   MEDIA CHANGES 1024px /////////////////////////////////////////////////////////////////*/

@media (max-width: 1024px) {
	
/*.zoom-instruction {
	display:block;
}	*/
	
.logo_white {
	top:31px;
	left:28px;
}
.back_cross {
	top:31px;
	right:28px;
}
.menu_icon {
	top:28px;
	right:28px;
}
.menu_cross {
	top:28px;
	right:28px;
}
.menu_logo {
	top:31px;
	left:28px;
}
.logo {
	top:31px;
	left:28px;
}
.zoom_menu {
	top:31px;
	right:28px;
}

.icon_right,
.icon_left {
	display:none;
}

.slider_caption {
	position:fixed;
	left:0;
	bottom:4px;
	z-index:200;
	height:25px;
	font-size:11px;
	text-align:center;
	width:100%;
	
}
.scroll_button {
	height:12px;
	font-family:'BrandonGrotesque-Medium', sans-serif;
	font-size:12px;
	color:#000;
	text-align:center;
	width:100%;
	visibility:hidden;
	padding-bottom:14px;
}
.gallery_footer {
	position:fixed;
	height:32px;
	bottom:30px;
	left:0;
	width:100%;
	z-index:200;
	cursor:pointer;
}
._footer {
	position:absolute;
	height:40px;
	bottom:-10px;
	left:0;
	width:100%;
	z-index:200;
	cursor:pointer;
}
/*  INTRO NAV  */
ul.introNav {
	font-family: 'BrandonGrotesque-Light', sans-serif;
	list-style: none;
	font-size:28px;
	line-height:34px;
	padding-top:50px;
}
ul.introNav li {
	display: block;
	color:#000;
	height:34px;
}
ul.introNav li + li {
	padding-left: 0px;
}
ul.introNav li a:hover {
	color: #666;
}
ul.introNav li.active a {
	color:#9fbfbc;
	text-decoration: none;
}

/*  MAIN NAV  */
ul.nav {
	font-family: 'BrandonGrotesque-Light', sans-serif;
	list-style: none;
	font-size:28px;
	line-height:34px;
	padding-top:50px;
}
ul.nav li {
	display: block;
	color:#000;
	height:34px;
}
ul.nav li + li {
	padding-left: 0px;
}
ul.nav li a:hover {
	color: #666;
}
ul.nav li.active a {
	color:#9fbfbc;
	text-decoration: none;
}

.content h1 {
	font-family:'BrandonGrotesque-Light', sans-serif;
	font-size:38px;
	letter-spacing:0.1em;
	color:#199fb4;
	padding:80px 0 30px 0;
	text-align:center;
}
.info_text {
	width:95%;
 	max-width:none;
	font-family:'proximanova-light', sans-serif;
  	font-size:18px;
  	line-height:28px;	
  	text-align:center;
	margin:0 auto;
	padding:50px 0 50px 0;
	color:#FFF;
	letter-spacing:0.02em;
}
.poem-text {
	width:95%;
 	max-width:none;
	font-family:'proximanova-light', sans-serif;
  	font-size:18px;
  	line-height:28px;	
  	text-align:center;
	margin:0 auto;
	padding:50px 0 0px 0;
	color:#FFF;
	letter-spacing:0.02em;
}
#page-wrap {
    width: 86%;
    margin: 0 auto;
	margin-top:30px !important;
}

.collected_content {
	width:100%;
	max-width: none;
	margin:0 auto;
	padding:90px 70px 50px 70px;
}
.collected_content h1 {
	font-family:'BrandonGrotesque-Light', sans-serif;
	font-size:38px;
	line-height:30px;
	letter-spacing:0.14em;
	color:#199fb4;
	text-align:center;
}
.collected_thumbs {
	width:100%;
	padding-top:60px;
}
.tintCap h2 {
	font-family:'BrandonGrotesque-Light', sans-serif;
	font-size:28px;
	letter-spacing:0.1em;
	color:#FFF;
	 -webkit-text-fill-color:#FFF;
	text-align:center;
}
.tintCap {
	display:block;
}

#prev {
    left:28px;
}

#next {
    right:28px;
}
.info_caption {
	font-size:20px;
	line-height:30px;
	letter-spacing:0.06em;
	width:60%;
	/*display:block;*/
}
.collected-caption {
	left:18px;
	bottom:22px;
	/*display:none;*/
}
.insect-zoom-control  {
    right: 28px;
	bottom:28px;
	display:none;
}

}

/*///////   MEDIA CHANGES 767px /////////////////////////////////////////////////////////////////*/

@media screen and (max-width:767px) {


	
.menu_icon {
	top: 18px;
	right: 18px;
}
.logo {
	top: 22px;
	left: 18px;
}
.back_cross {
	top:18px;
	right:18px;
}
.menu_cross {
	top:18px;
	right:18px;
}
.menu_logo {
	top:22px;
	left:18px;
}
.logo_white {
	top:22px;
	left:18px;
}
.zoom_menu {
	top:22px;
	right:18px;
}

.content h1 {
	font-family:'BrandonGrotesque-Light', sans-serif;
	font-size:20px;
	line-height:24px;
	letter-spacing:0.14em;
	color:#199fb4;
	padding:100px 0 0 0;
	text-align:center;
}
.info_text {
	width:96%;
 	max-width:none;
	font-family:'proximanova-light', sans-serif;
  	font-size:16px;
  	line-height:24px;	
  	text-align:center;
	margin:0 auto;
	padding:50px 0 20px 0;
	color:#FFF;
	letter-spacing:0.02em;
}
.poem-text {
	width:96%;
 	max-width:none;
	font-family:'proximanova-light', sans-serif;
  	font-size:16px;
  	line-height:24px;	
  	text-align:center;
	margin:0 auto;
	padding:50px 0 0px 0;
	color:#FFF;
	letter-spacing:0.02em;
}
#page-wrap {
    width: 100vw;
    margin: 0 auto;
	margin-top:10px !important;
}
figure { 
	display: block;
	padding: 18px; 
}
/*    THUMBNAILS   */
.thumbContent {
	width:96%;
	max-width:970px;
	margin:0 auto;	
}

.projectsThumbnails {
	width:100%;
	/*float:left;*/
}
.menuThumb {
	width:100%;
	margin-right:0%;
	margin-bottom:4%;
	float:none;
	display:inline-block;
	position:relative;
}

.menuThumb IMG {
	max-width:100%;
	width:100%;
	height:auto;
}
.projectsThumbnails DIV:nth-of-type(2n+2) {
	margin-right:0%;
}
.collected_content {
	width:100%;
	max-width: none;
	margin:0 auto;
	padding:90px 20px 50px 20px;
}
.collected_content h1 {
	font-family:'BrandonGrotesque-Light', sans-serif;
	font-size:28px;
	line-height:28px;
	letter-spacing:0.14em;
	color:#199fb4;
	text-align:center;
}
.collected_thumbs {
	width:100%;
	padding-top:80px;
}
#prev {
    left:18px;
}

#next {
    right:18px;
}


.section {
	position:relative;
 	width: 100vw;
  	padding: 0; /*7%;*/
  	display: table;
 	margin: 0;
  	height: 100vh;
}
.thumb-section {
	position:relative;
 	width: 100vw;
  	padding: 0; /*7%;*/
  	display: table;
 	margin: 0;
  	/*height: 100vh;*/
}
.info_caption {
	font-size:16px;
	line-height:20px;
	letter-spacing:0.06em;
	width:70%;
}

.zoom_tint {
	background-color: rgba(0, 0, 0, 1.0);
}
.insect-zoom-control {
    display: none; 
}
/*  INTRO NAV  */
ul.introNav {
	font-family: 'BrandonGrotesque-Light', sans-serif;
	list-style: none;
	font-size:20px;
	line-height:26px;
	padding-top:50px;
}
ul.introNav li {
	display: block;
	color:#000;
	height:26px;
}
/*  MAIN NAV  */
ul.nav {
	font-family: 'BrandonGrotesque-Light', sans-serif;
	list-style: none;
	font-size:20px;
	line-height:26px;
	padding-top:50px;
}
ul.nav li {
	display: block;
	color:#000;
	height:26px;
}

}

/*///  iPhone 5  ///*/

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 767px) { 
		
		
.collected-caption {
	left:18px;
	bottom:22px;
}

}


/*///  iPhone 5 Landscape  ///*/

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 767px) 
and (orientation : landscape) {
		
.collected-caption {
	left:18px;
	bottom:66px;
}
		
}




