@charset "UTF-8";
@import url("http://fast.fonts.net/t/1.css?apiType=css&projectid=9dd85959-5274-416d-b046-dfa93a9dc6ff");
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, #contact-page a div, .interface-wrapper .curent-collection .info-trigger, .interface-wrapper .list .label, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; }

html { line-height: 1; }

ol, ul { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; }

q, blockquote { quotes: none; }
q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; }

a img, #contact-page a div img, .interface-wrapper .curent-collection .info-trigger img, .interface-wrapper .list .label img { border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

@-webkit-keyframes flash { 0% { opacity: 0; }
  50% { opacity: 1; }
  100% { opacity: 0; } }
@-moz-keyframes flash { 0% { opacity: 0; }
  50% { opacity: 1; }
  100% { opacity: 0; } }
@-o-keyframes flash { 0% { opacity: 0; }
  50% { opacity: 1; }
  100% { opacity: 0; } }
@keyframes flash { 0% { opacity: 0; }
  50% { opacity: 1; }
  100% { opacity: 0; } }
@-webkit-keyframes rafmode { 0% { -webkit-filter: saturate(0); }
  50% { -webkit-filter: saturate(10); }
  100% { -webkit-filter: saturate(0); } }
@-moz-keyframes rafmode { 0% { -webkit-filter: saturate(0); }
  50% { -webkit-filter: saturate(10); }
  100% { -webkit-filter: saturate(0); } }
@-o-keyframes rafmode { 0% { -webkit-filter: saturate(0); }
  50% { -webkit-filter: saturate(10); }
  100% { -webkit-filter: saturate(0); } }
@keyframes rafmode { 0% { -webkit-filter: saturate(0); }
  50% { -webkit-filter: saturate(10); }
  100% { -webkit-filter: saturate(0); } }
@font-face { font-family: "ITC Century W01 Book"; src: url("/static/fonts/34bdfb95-ecc9-425e-9fc9-871696c5c4d8.eot?#iefix"); src: url("/static/fonts/34bdfb95-ecc9-425e-9fc9-871696c5c4d8.eot?#iefix") format("eot"), url("/static/fonts/94ca6cf1-5688-4f93-9901-5f01e1c5b845.woff2") format("woff2"), url("/static/fonts/d1d878f1-1eed-46bf-ac30-069a1ba84787.woff") format("woff"), url("/static/fonts/e7f0a599-5795-4940-b7b1-c6214f8dda5e.ttf") format("truetype"), url("/static/fonts/f4726f88-8823-4fc2-b15e-d0da10839700.svg#f4726f88-8823-4fc2-b15e-d0da10839700") format("svg"); }
@font-face { font-family: "HelveticaNeueW01-77BdCn_692722"; src: url("/static/fonts/83d5bc89-af33-46a9-8fe3-15d87784f50e.eot?#iefix"); src: url("/static/fonts/83d5bc89-af33-46a9-8fe3-15d87784f50e.eot?#iefix") format("eot"), url("/static/fonts/ab23c239-fb66-406e-bce6-f0f260f5a217.woff2") format("woff2"), url("/static/fonts/102ab74c-0e84-4fe5-a17a-b20fb643591a.woff") format("woff"), url("/static/fonts/1d146b29-55e2-485b-96aa-5cb628e7e9eb.ttf") format("truetype"), url("/static/fonts/d90b3358-e1e2-4abb-ba96-356983a54c22.svg#d90b3358-e1e2-4abb-ba96-356983a54c22") format("svg"); }
@font-face { font-family: "Times NR W01 Regular"; src: url("/static/fonts/77192624-c5c4-4ad5-8ebb-9bc1b763c38b.eot?#iefix"); src: url("/static/fonts/77192624-c5c4-4ad5-8ebb-9bc1b763c38b.eot?#iefix") format("eot"), url("/static/fonts/58f3a7d9-90a1-4495-af82-ed851cf1bb45.woff2") format("woff2"), url("/static/fonts/1e1624a0-ede0-4a16-a691-1fc16ea45fef.woff") format("woff"), url("/static/fonts/2376f100-60f8-476c-8a41-2773fcc2e1c4.ttf") format("truetype"), url("/static/fonts/42cded57-38b2-48c3-ba36-6533cb3065ea.svg#42cded57-38b2-48c3-ba36-6533cb3065ea") format("svg"); }
body { font-family: 'HelveticaNeueLTPro-BdCn', 'HelveticaNeueW01-77BdCn_692722'; font-size: 22px; letter-spacing: .021em; color: black; font-kerning: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-transform: uppercase; line-height: 1.4; }
h1 { font-family: 'HelveticaNeueLTPro-BdCn','HelveticaNeueW01-77BdCn_692722', sans-serif; font-size: 2.3em; line-height: 1.1em; }

#video-overlay { z-index: 6000; }

#header, .interface, .interface-wrapper { z-index: 5000; }

#transition-cover { z-index: 4000; }

#rotation-message { z-index: 4000; }

#interaction-helper { z-index: 2001; }

#lookbook { z-index: 2000; }

.mobile-container { z-index: 1000; }

body, html { width: 100%; height: 100%; background-color: white; -webkit-filter: hue-rotate(0deg); /*
	background-color: white!important;
	@include animation(background-color, $pageTransitionTime, $pageTransitionEase);	
	.page-loaded &{
		background-color: inherit!important;
	}
*/ }
body.info-open, html.info-open { color: white !important; }
body.raf, html.raf { -webkit-filter: invert(1); filter: invert(1); /* 	-webkit-filter: invert(1); 	filter: invert(1);
*/ }

::selection { background: rgba(0, 0, 0, 0.99); color: #292929; }

.cf:after { content: ""; display: table; clear: both; }

#transition-cover { width: 100%; height: 100%; position: fixed; top: 0; left: 0; background-color: black; display: block; -moz-transition-property: opacity; -o-transition-property: opacity; -webkit-transition-property: opacity; transition-property: opacity; -moz-transition-duration: 0s; -o-transition-duration: 0s; -webkit-transition-duration: 0s; transition-duration: 0s; -moz-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -o-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; }
.page-loaded #transition-cover { display: none; }

img, video { display: block; }
img.scale, video.scale { width: 100%; height: auto; }

.scale-video { position: relative; padding-bottom: 56.25%; /* 16:9 */ }
.scale-video object, .scale-video embed, .scale-video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

a, #contact-page a div, .interface-wrapper .curent-collection .info-trigger, .interface-wrapper .list .label { color: inherit; text-decoration: none; cursor: pointer; }
a:hover, #contact-page a div:hover, .interface-wrapper .curent-collection .info-trigger:hover, .interface-wrapper .list .label:hover { opacity: .7; }
.no-touchevents a:active, .no-touchevents #contact-page a div:active, #contact-page a .no-touchevents div:active, .no-touchevents .interface-wrapper .curent-collection .info-trigger:active, .interface-wrapper .curent-collection .no-touchevents .info-trigger:active, .no-touchevents .interface-wrapper .list .label:active, .interface-wrapper .list .no-touchevents .label:active { opacity: 0.1; }

p { margin-bottom: 1.2em; }
p:last-child { margin-bottom: 0; }

.content-container { width: 100%; height: 100%; }

.page-container { width: 100%; margin: 20rem auto 0; padding: 0 90px; height: auto; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }.page-container .landscape { display: none; }

.dynamic-wrapper { position: relative; width: 100%; background-color: rgba(0, 0, 0, 0.2); }
.dynamic-wrapper img { position: absolute; top: 0; left: 0; opacity: 0; -moz-transition-property: opacity; -o-transition-property: opacity; -webkit-transition-property: opacity; transition-property: opacity; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -moz-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -o-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; }
.dynamic-wrapper img.loaded { opacity: 1; }

.ghost-img { display: none; }

.fright { float: right !important; }

.fleft { float: left !important; }

.outer { width: 100%; height: 100%; display: table; }

.inner { display: table-cell; text-align: center; vertical-align: middle; }

#splash-page { background-color: white; overflow: hidden; }
#splash-page #transition-cover { display: none; }
#splash-page .campaign-container { position: absolute; width: 100%; height: 100%; }
#splash-page img { max-width: 100%; max-height: 100%; display: none; position: absolute; top: 50%; left: 50%; -moz-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); -webkit-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%); }
#splash-page img:first-child { display: block; }
#splash-page a:hover, #splash-page #contact-page a div:hover, #contact-page a #splash-page div:hover, #splash-page .interface-wrapper .curent-collection .info-trigger:hover, .interface-wrapper .curent-collection #splash-page .info-trigger:hover, #splash-page .interface-wrapper .list .label:hover, .interface-wrapper .list #splash-page .label:hover { opacity: 1; }
#splash-page a:active, #splash-page #contact-page a div:active, #contact-page a #splash-page div:active, #splash-page .interface-wrapper .curent-collection .info-trigger:active, .interface-wrapper .curent-collection #splash-page .info-trigger:active, #splash-page .interface-wrapper .list .label:active, .interface-wrapper .list #splash-page .label:active { opacity: 1; }

#about-page { background-color: white; }
#about-page .serif { font-family: 'CenturyStd-Book', 'ITC Century W01 Book', serif; letter-spacing: -0.01em; font-size: 1.02em; }
#about-page .synopsis, #about-page .divider, #about-page .timeline { font-family: 'HelveticaNeueLTPro-BdCn','HelveticaNeueW01-77BdCn_692722', sans-serif; font-size: 2.3em; line-height: 1.1em; }#about-page .section-wrapper { padding-bottom: 100px; }#about-page .timeline:after { padding-top: 100px; content: '—'; display: block; }#about-page .timeline p { z-index: 100; position: relative; }
#about-page .timeline .serif::selection { background: rgba(0, 0, 0, 0.99); color: #fff !important; }
#about-page .synopsis .serif { text-transform: none; }
#about-page .synopsis .important::selection { background: rgba(0, 0, 0, 0.99); color: #fff !important; }
#about-page .interviews { line-height: 1.5em; text-transform: none; }#about-page .interviews li, #about-page .interviews h4 { display: inline; }
#about-page .interviews h3 { padding-bottom: 1em; text-transform: uppercase; }
#about-page .interviews h4 { text-transform: uppercase; }
#about-page .interviews li:last-child { margin-bottom: 0; }#about-page .float-image { position: fixed; opacity: 0; pointer-events: none; -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); z-index: -1; }#about-page .float-image.image01 { top: 30%; left: 5%; }
#about-page .float-image.image02 { bottom: 20%; right: 5%; }
#about-page .float-image.image03 { top: 200px; left: 200px; }
#about-page .float-image.image04 { bottom: 27%; right: 15%; }

#contact-page .content-container { text-align: center; overflow-wrap: break-word; word-wrap: break-word; -ms-word-break: break-all; word-break: break-word; /* -ms-hyphens: auto; -moz-hyphens: auto; -webkit-hyphens: auto; hyphens: auto;
*/ }
#contact-page h2, #contact-page strong { font-family: 'HelveticaNeueLTPro-BdCn','HelveticaNeueW01-77BdCn_692722', sans-serif; font-size: 2.3em; line-height: 1.1em; }#contact-page .block { padding-bottom: 8em; }#contact-page header { margin-bottom: 2em; }

#zoomExp { background-color: black; color: white; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
#zoomExp .next-image { position: fixed; text-align: center; display: block; top: 50%; left: 50%; margin-left: -1.1em; z-index: 1; width: 2.2em; -webkit-user-drag: none; outline: 0; }
#zoomExp .next-image .block-interface { pointer-events: none; }
#zoomExp .zoom-container { overflow: scroll; width: 100%; height: 100%; position: fixed; }
#zoomExp .image-wrapper { width: 100%; position: relative; width: 3415px; display: none; cursor: move; /* fallback if grab cursor is unsupported */ cursor: grab; cursor: -moz-grab; cursor: -webkit-grab; }#zoomExp .image-wrapper:active { cursor: grabbing; cursor: -moz-grabbing; cursor: -webkit-grabbing; }
#zoomExp .image-wrapper.visible { display: block; }
#zoomExp .image-wrapper .zoom-image { position: absolute; top: 0; left: 0; width: 100%; height: auto; }
#zoomExp .image-wrapper .high-res { opacity: 0; -moz-transition-property: opacity; -o-transition-property: opacity; -webkit-transition-property: opacity; transition-property: opacity; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -moz-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -o-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; }
#zoomExp .image-wrapper .high-res.show { opacity: 1; }

#quotesExp { width: 100%; position: absolute; z-index: 0; }
#quotesExp .black-flash-half { height: 50%; width: 100%; background-color: black; position: fixed; display: none; -moz-transform-origin: 0% 0% 50%; -ms-transform-origin: 0% 0% 50%; -webkit-transform-origin: 0% 0% 50%; transform-origin: 0% 0% 50%; }
#quotesExp #bg-video-wrapper { position: fixed; background-color: white !important; overflow: hidden; width: 1000px; height: 540px; border: 5px solid white; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }#quotesExp #video { opacity: 0; height: 104%; position: absolute; top: -2%; }
#quotesExp #video.loaded { opacity: 1; }
#quotesExp .scroll-container { overflow: hidden; position: absolute; top: 0px; height: 100%; width: 100%; }
#quotesExp .scroll-container .element { position: absolute; text-transform: none; }
#quotesExp .scroll-container .story-element-1 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 4vw; left: 30%; }
#quotesExp .scroll-container .story-element-2 { font-family: "Courier New", monospace; line-height: 1em; font-size: 1.4vw; left: 10%; }#quotesExp .scroll-container .story-element-3 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 6vw; left: 15%; width: 65vw; }
#quotesExp .scroll-container .story-element-4 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 6vw; left: 15%; width: 80vw; }
#quotesExp .scroll-container .story-element-5 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 6vw; left: 15%; }
#quotesExp .scroll-container .story-element-6 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 6vw; left: 30%; }
#quotesExp .scroll-container .story-element-7 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 6vw; left: 20%; }
#quotesExp .scroll-container .story-element-8 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 1.5vw; left: 30%; width: 64vw; }#quotesExp .scroll-container .story-element-9 { font-family: "Courier New", monospace; line-height: 1em; font-size: 1.2vw; left: 10%; }#quotesExp .scroll-container .story-element-10 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 2vw; left: 45%; width: 50vw; }
#quotesExp .scroll-container .story-element-11 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 6vw; left: 17%; width: 100vw; }
#quotesExp .scroll-container .story-element-12 { font-family: "Courier New", monospace; line-height: 1em; font-size: 1vw; left: 27%; padding-right: 100px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }#quotesExp .scroll-container .story-element-13 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 6vw; left: 2%; }
#quotesExp .scroll-container .story-element-14 { font-family: "Courier New", monospace; line-height: 1em; font-size: 1vw; left: 10%; }#quotesExp .scroll-container .story-element-15 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 8vw; left: 25%; line-height: 0.9em; }
#quotesExp .scroll-container .story-element-16 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 12vw; left: 20%; line-height: 0.7em; }
#quotesExp .scroll-container .story-element-17 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 2.5vw; left: 2%; }
#quotesExp .scroll-container .story-element-18 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 9vw; left: 10%; width: 60vw; line-height: 0.9em; }
#quotesExp .scroll-container .story-element-18 .indent1 { margin-left: 10vw; display: block; }
#quotesExp .scroll-container .story-element-18 .indent2 { margin-left: 20vw; display: block; }
#quotesExp .scroll-container .story-element-19 { font-family: "Courier New", monospace; line-height: 1em; font-size: 1vw; left: 50%; }#quotesExp .scroll-container .story-element-20 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 3vw; left: 20%; }
#quotesExp .scroll-container .story-element-21 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 12vw; left: 2%; }
#quotesExp .scroll-container .story-element-22 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 1vw; left: 30%; }#quotesExp .scroll-container .story-element-23 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 1.4vw; left: 37%; }#quotesExp .scroll-container .story-element-24 { font-family: "Courier New", monospace; line-height: 1em; font-size: 1.5vw; left: 15%; }#quotesExp .scroll-container .story-element-25 { font-family: "Courier New", monospace; line-height: 1em; font-size: 0.8vw; left: 50%; }#quotesExp .scroll-container .story-element-26 { font-family: "Times NR W01 Regular", "Times New Roman", serif; line-height: 1em; font-size: 4vw; left: 30%; }
#quotesExp .scroll-container .story-element-27 { font-family: "Courier New", monospace; line-height: 1em; font-size: 1.4vw; left: 10%; }
#matrixExp { color: white; background-color: black; width: 100%; height: 100%; position: absolute; /*
	.content-container{ position: relative; z-index: 2; background-color: black;	 }
*/ }
#matrixExp:after { content: ''; width: 14px; height: 14px; position: absolute; left: 50%; top: 50%; margin-left: -7px; margin-top: -7px; background-color: white; border-radius: 100px; -webkit-animation: flash 1s infinite cubic-bezier(0.445, 0.05, 0.55, 0.95); -moz-animation: flash 1s infinite cubic-bezier(0.445, 0.05, 0.55, 0.95); -o-animation: flash 1s infinite cubic-bezier(0.445, 0.05, 0.55, 0.95); animation: flash 1s infinite cubic-bezier(0.445, 0.05, 0.55, 0.95); }
#matrixExp .button-container { z-index: 2; position: fixed; top: 50%; left: 50%; -moz-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); -webkit-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%); }
#matrixExp .button { width: 25%; height: 25%; float: left; position: relative; background-color: rgba(0, 0, 0, 0.5); opacity: 0; cursor: pointer; }
#matrixExp .button:hover { opacity: 1; }
#matrixExp .button:active { background-color: rgba(0, 0, 0, 0.8); }
#matrixExp .button.icon .fullscreen-icon { opacity: 1; }
#matrixExp .fullscreen-icon { position: absolute; width: 40px; height: 40px; left: 50%; top: 50%; margin-left: -20px; margin-top: -20px; background-size: contain; background-repeat: no-repeat; opacity: 0; background-color: black; border: 7px solid black; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
#matrixExp .fullScreen-video { min-width: 100%; min-height: 100%; width: auto; height: auto; }
#matrixExp #video-bg { position: fixed; top: 50%; left: 50%; z-index: 1; -moz-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); -webkit-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%); }
#matrixExp #single-video-overlay { width: 100%; height: 100%; position: fixed; top: 50%; left: 50%; -moz-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); -webkit-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%); background-color: black; z-index: 3; display: none; cursor: pointer; }
#matrixExp #single-video-overlay:after { content: ''; width: 14px; height: 14px; position: absolute; left: 50%; top: 50%; margin-left: -7px; margin-top: -7px; background-color: white; border-radius: 100px; -webkit-animation: flash 1s infinite cubic-bezier(0.445, 0.05, 0.55, 0.95); -moz-animation: flash 1s infinite cubic-bezier(0.445, 0.05, 0.55, 0.95); -o-animation: flash 1s infinite cubic-bezier(0.445, 0.05, 0.55, 0.95); animation: flash 1s infinite cubic-bezier(0.445, 0.05, 0.55, 0.95); }
#matrixExp #single-video-overlay.visible { display: block; }
#matrixExp #single-video-player { z-index: 2; position: fixed; top: 50%; left: 50%; display: none; -moz-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); -webkit-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%); }
#matrixExp #single-video-player.visible { display: block; }
#header { text-align: center; top: 3vw; position: fixed; left: 50%; margin-left: -6.5em; width: 13em; -moz-backface-visibility: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; color: black; }
.page-loaded #header { color: inherit; }
#header h1 { display: block; color: white; letter-spacing: 0.04em; }
#header h1 a::selection, #header h1 #contact-page a div::selection, #contact-page a #header h1 div::selection, #header h1 .interface-wrapper .curent-collection .info-trigger::selection, .interface-wrapper .curent-collection #header h1 .info-trigger::selection, #header h1 .interface-wrapper .list .label::selection, .interface-wrapper .list #header h1 .label::selection { background: rgba(0, 0, 0, 0.99); color: #fff !important; }
.page-loaded #header h1 { color: inherit; }
.landscape #header h1 { color: white; }
#header .link { margin: 0 5px; }
#header #header-links { -moz-transition-property: opacity; -o-transition-property: opacity; -webkit-transition-property: opacity; transition-property: opacity; -moz-transition-duration: 0.2s; -o-transition-duration: 0.2s; -webkit-transition-duration: 0.2s; transition-duration: 0.2s; -moz-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -o-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; }
#header #header-links.hide { opacity: 0; }

.interface-wrapper { position: relative; display: none; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.page-loaded .interface-wrapper { display: block; }
.interface-wrapper .side-list { position: fixed; width: 150px; top: 50%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -moz-transition-property: opacity; -o-transition-property: opacity; -webkit-transition-property: opacity; transition-property: opacity; -moz-transition-duration: 0.2s; -o-transition-duration: 0.2s; -webkit-transition-duration: 0.2s; transition-duration: 0.2s; -moz-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -o-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; }.interface-wrapper .side-list.empty { display: none; }
.interface-wrapper .past-list { left: 3vw; }
.interface-wrapper .future-list { text-align: right; right: 0; margin-right: 3vw; }
.interface-wrapper .date { position: relative; display: block; }
.interface-wrapper .curent-collection { position: fixed; width: 100px; text-align: center; opacity: 1; left: 50%; margin-left: -50px; -moz-transition-property: opacity; -o-transition-property: opacity; -webkit-transition-property: opacity; transition-property: opacity; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -moz-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -o-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; bottom: 3vw; }
.interface-wrapper .list .label { cursor: pointer; }
#lookbook { color: white; background-color: black; width: 100%; height: 100%; position: fixed; left: 0; top: 0; display: none; }
.info-open #lookbook { display: block; }
#lookbook .downloads { position: fixed; top: 50%; left: 50%; width: 180px; text-align: center; z-index: 1; margin-left: -90px; height: 200px; /* .list{ display: table-cell; vertical-align: middle; }
*/ }
.touchevents #lookbook .downloads .desktop-version, .mobile-device #lookbook .downloads .desktop-version { display: none; }
#lookbook .downloads .mobile-version { display: none; }
.touchevents #lookbook .downloads .mobile-version, .mobile-device #lookbook .downloads .mobile-version { display: block; }
#lookbook .downloads .label { margin-bottom: 20px; }
#lookbook .collection-scroll { width: 100%; height: 100%; position: fixed; top: 0; left: 0; -webkit-overflow-scrolling: touch; }
#lookbook .look-number { position: absolute; color: white; z-index: 1; left: 3vw; top: 3vw; height: auto; }
#lookbook .dynamic-load.loading { background-color: #121212; box-shadow: inset -2px 0px 0px 2px black; }
#lookbook .dynamic-load.loading:after { content: ''; width: 14px; height: 14px; position: absolute; left: 50%; top: 50%; margin-left: -7px; margin-top: -7px; background-color: white; border-radius: 100px; -webkit-animation: flash 1s infinite cubic-bezier(0.445, 0.05, 0.55, 0.95); -moz-animation: flash 1s infinite cubic-bezier(0.445, 0.05, 0.55, 0.95); -o-animation: flash 1s infinite cubic-bezier(0.445, 0.05, 0.55, 0.95); animation: flash 1s infinite cubic-bezier(0.445, 0.05, 0.55, 0.95); }#lookbook #video-overlay { width: 100%; height: 100%; z-index: 1; background-color: black; position: fixed; top: 0; left: 0; display: none; }
#lookbook #video-overlay:after { content: ''; width: 14px; height: 14px; position: absolute; left: 50%; top: 50%; margin-left: -7px; margin-top: -7px; background-color: white; border-radius: 100px; -webkit-animation: flash 1s infinite cubic-bezier(0.445, 0.05, 0.55, 0.95); -moz-animation: flash 1s infinite cubic-bezier(0.445, 0.05, 0.55, 0.95); -o-animation: flash 1s infinite cubic-bezier(0.445, 0.05, 0.55, 0.95); animation: flash 1s infinite cubic-bezier(0.445, 0.05, 0.55, 0.95); }
#lookbook #video-overlay .video-wrapper { position: absolute; width: 100%; padding-bottom: 56.25%; height: 0; left: 50%; top: 50%; z-index: 1; -moz-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); -webkit-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%); }
#lookbook #video-overlay .video-wrapper .vimeo-video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#lookbook #video-overlay .close-overlay { position: absolute; top: 3vw; right: 3vw; color: white; z-index: 2; }

.mobile-container { width: 100%; height: 100%; position: fixed; top: 0; left: 0; display: none; background-color: black; background-position: center center; background-size: cover; }
.mobile-device .mobile-container { display: block; }
.mobile-container video { position: fixed; top: 50%; left: 50%; min-width: 120%; min-height: 120%; width: auto; height: auto; -moz-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); -webkit-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%); }

#interaction-helper { width: 100%; height: 100%; position: fixed; top: 0; left: 0; pointer-events: none; display: none; }
#interaction-helper.show { display: block; }
#interaction-helper p { background-color: black; display: inline; padding: 15px 30px; color: white; }

@media screen and (max-width: 590px) { body { font-size: 18px; }  .page-container { margin: 10rem auto 0; padding: 0 20px; }  #about-page .synopsis, #about-page .divider, #about-page .timeline { font-size: 1.5em; }  #about-page .section-wrapper { padding-bottom: 50px; }  #about-page .timeline:after { padding-top: 50px; }  #about-page .interviews { padding-bottom: 20px; }  #about-page .interviews li { display: block; margin-bottom: 20px; }  #about-page .float-image { display: none; }  #contact-page h2, #contact-page strong { font-size: 1.5em; }  #contact-page .block { padding-bottom: 4em; }  #zoomExp .image-wrapper { width: 2049px; }  .touchevents #quotesExp #bg-video-wrapper { display: none; }  #quotesExp .scroll-container .story-element-2 { font-size: 10px; }  #quotesExp .scroll-container .story-element-8 { font-size: 12px; }  #quotesExp .scroll-container .story-element-9 { font-size: 10px; }  #quotesExp .scroll-container .story-element-12 { font-size: 9px; }  #quotesExp .scroll-container .story-element-14 { font-size: 9px; }  #quotesExp .scroll-container .story-element-19 { font-size: 9px; }  #quotesExp .scroll-container .story-element-22 { font-size: 9px; }  #quotesExp .scroll-container .story-element-23 { font-size: 10px; }  #quotesExp .scroll-container .story-element-24 { font-size: 11px; }  #quotesExp .scroll-container .story-element-25 { font-size: 8px; }  #quotesExp .scroll-container .story-element-27 { font-size: 10px; }  #matrixExp #interaction-helper { display: none; }  #lookbook .collection-scroll { overflow-y: scroll; }
  #lookbook .scrollContainer { height: auto; }
  #lookbook .dynamic-load { width: 100%; position: relative; }
  #lookbook img { height: auto; width: 100%; display: block; padding: 0; margin: 0; } }

@media screen and (min-width: 589px) and (max-width: 1025px) { .page-container { padding: 0 40px; margin: 15rem auto 0; }  #about-page .synopsis, #about-page .divider, #about-page .timeline { font-size: 1.8em; }  #about-page .float-image { -moz-transform: scale(0.8); -ms-transform: scale(0.8); -webkit-transform: scale(0.8); transform: scale(0.8); }  #contact-page h2, #contact-page strong { font-size: 1.8em; }  #contact-page .block { padding-bottom: 6em; } }

@media screen and (min-width: 590px) { #about-page .interviews li:not(:last-child):after { content: '•'; font-size: 0.6em; margin: 0 10px; position: relative; top: -0.13em; }  .touchevents #matrixExp #video-bg { opacity: 0.3; -moz-transition-property: opacity; -o-transition-property: opacity; -webkit-transition-property: opacity; transition-property: opacity; -moz-transition-duration: 0.2s; -o-transition-duration: 0.2s; -webkit-transition-duration: 0.2s; transition-duration: 0.2s; -moz-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -o-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; }
  .touchevents #matrixExp .button-container { background-image: url("/static/images/matrix/first-frame.jpg"); background-size: cover; background-repeat: no-repeat; background-position: center center; opacity: 0; }
  .touchevents #matrixExp #single-video-player { opacity: 0; }
  .touchevents #matrixExp #single-video-player.visible { opacity: 1; }
  .touchevents #matrixExp .button-container { pointer-events: none; }
  #matrixExp.initalized #video-bg { opacity: 1; -moz-transition-property: opacity; -o-transition-property: opacity; -webkit-transition-property: opacity; transition-property: opacity; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -moz-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -o-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); -webkit-transition: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; }
  #matrixExp.initalized .button-container { pointer-events: all; background-image: none; opacity: 1; }
  #matrixExp.initalized .button { opacity: 1; background-color: transparent; }  #lookbook .collection-scroll { overflow-x: scroll; overflow-y: hidden; }
  #lookbook .collection-scroll > * { height: 100%; }
  #lookbook img { height: 100%; width: 100%; display: inline; padding: 0; margin: 0; position: absolute; top: 0; left: 0; }
  #lookbook .scrollContainer { height: 100%; cursor: move; cursor: -moz-grab; cursor: -webkit-grab; }
  #lookbook .scrollContainer:active { cursor: move; cursor: grabbing; cursor: -moz-grabbing; cursor: -webkit-grabbing; }
  #lookbook .collection-wrapper { height: 100%; display: inline; }
  #lookbook .dynamic-load { height: 100%; position: relative; float: left; } }

@media screen and (max-width: 1025px) { .interface-wrapper .side-list { bottom: 3vw; top: auto; margin-top: 0 !important; }  .interface-wrapper .list .label { margin-top: 20px; cursor: pointer; }  .interface-wrapper .hide .date { display: none; } }

@media screen and (min-width: 1025px) { .interface-wrapper .list .label { margin-bottom: 20px; }  .interface-wrapper .hide { opacity: 0; } }
