@charset "utf-8";
address, article, aside, button, blockquote, body, dd, dialog, dl, dt, fieldset, footer, form, h1, h2, h3, h4, h5, h6, header, li, nav, ol, p, pre, section, td, th, tr, ul {
    margin: 0;
    padding: 0; 
}

body {
  background: black;
  font-family:"Romain", sans-serif;
  margin: 0;
  padding: 0;
  color: white;
  line-height: 0;
  text-transform: uppercase;  
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;	

}

@font-face 	{ font-family: "Romain"; src: url("Px437_IBM_ISO9.ttf");}

html {
    -webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */
}


a { color:#fcfcfc;	text-decoration:none;}

h1 {
 font-family:  "Romain";
 font-size: 2.25vw;
 line-height: 2vw; 
 color:#fcfcfc;	
 font-weight:300 !important;	
 overflow:hidden;
 -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;		
	
}

h4 {
 font-family:  "Romain";
 font-size: 1.25vw;
 line-height: 1.75vw; 
 color:#fcfcfc;	
 font-weight:300 !important;	
 overflow:hidden;
 -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;		
	
}


.transition-fade {
    transition: .2s;
    opacity: 1;
}

html.is-animating .transition-fade{
    opacity: 0;
}

.margins {margin-left:2vw;}
.dotmargin {margin-left:.75vw;}	
.dockmargin {padding-top:1vw;}


.quotes {
  position: absolute;
  width: 90vw;
}

.impressions {
  position: absolute;
  width: 90vw;
  margin-left:3vw;
  
}

.border {
  position: absolute;
  border:#fcfcfc 1px solid;
  z-index:10;
  top:0;	
  left:0;	
}

.qimages {
  position: absolute;
  z-index:0;
  top:0;	
  left:0;	
  opacity:0;	
  
}

.qimages_cap {
  position: absolute;
  margin-left:3vw;
}

.titler {
  position: absolute;
  margin-left:3vw;
}

.menu_inner {
  margin-left:3vw;
}

.move {
  position: relative;
  width: 100vw;
}

.move_2 {
  position: relative;
  width: 100vw;
}

.move_3 {
  position: relative;
  width: 100vw;
}

.move_4 {
  position: relative;
  width: 100vw;
}


.parent {
	
	margin: 0 auto 0;
  position: relative;

}

.parent canvas {
  position: absolute;
  top: 0;
	left: 0;
}

.videoWrapper {
	position: relative;
	margin:0 !important;
	padding-bottom: 56.25%; /* 16:9 */
	top: 0;
	height: 0;
	border:none !important;
	overflow:hidden !important;
	display:flex;
	align-items:center;
	justify-content:center;
}

.videoWrapper iframe {
	position: absolute;
	margin:0 !important;
	top: 0 !important;
	left: 0;
	width: 100% !important;	
	height: 100% !important;
	border:none !important;
	
}

.vimeo-wrapper {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   overflow: hidden !important;
   pointer-events:none;
}

.vimeo-wrapper iframe {
   width: 200vw;
   height: 56.25vw; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
   min-height: 150vh;
   max-width: 300vw; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
}


.vimeo-wrapper2 {
   position: relative;
	margin:0 !important;
	padding-bottom: 56.25%; /* 16:9 */
	top: 0;
	height: 0;
	border:none !important;
	overflow:hidden !important;
	display:flex;
	align-items:center;
	justify-content:center;
}

.vimeo-wrapper2 a {
   position: absolute;
	margin:0 !important;
	top: 0;
	height: 100%;
	width:100%;
	z-index:10000 !important;
}

.vimeo-wrapper2 iframe {
	position: absolute;
	margin:0 !important;
	top: 0 !important;
	left: 0;
	width: 100% !important;	
	height: 100% !important;
	border:none !important;
}

.vidwidth {width:95vw;}
.vidwidth2 {width:95vw; height:45vh;}
.vidwidth3 {width:95vw; height:55vh;}



.mainframe 				{opacity:1 !important; transition:opacity .25s;}
.mainframe.is-hidden    {opacity:0 !important; }

.tallimage {width:60vw;}


.trax {height:auto; width:15vw;}

.play-pause {cursor:pointer;}

.play {
  width:15vw; 
  height:15vw; 
  position:relative;
  border-radius: 50%; 
  display:flex; 
  border:white 1px solid;
  align-items:center; 
  justify-content:center;
}

.play-dot {
  position:absolute; 
  top:2vh;
  height:1vw;
  width:1vw;
  border-radius:50%;
  background:white;
  z-index:2;  
}


.traxno {}

.opencontainer {
  margin: 0 auto;
  width: 97%;
  position:relative;
  overflow: hidden;
  display:flex;	
  justify-content:space-between;	
  align-items:flex-end;
  flex-wrap:wrap;	
}


.oscontainer {
  display:flex;
  flex-wrap:wrap;
  flex-direction:column;
  height:100vh;
  width:100vw;	
  position:fixed; 
  left:0; 
  top:0;
  overflow: scroll; 
  -webkit-overflow-scrolling: touch;	
}

.module{
  height:100vh;
  width:100vw;	
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  background:black;
  overflow:hidden;	
  margin-right:5vw;
  position:relative;	
}

.mod-100 {width:100vw}
.mod-50 {width:80vw}


.productenhance {display:none; z-index:-1;}
.productenhance.is-active {display:inline; opacity:1; overflow: scroll; -webkit-overflow-scrolling: touch;
  background:black; height:100vh; width:100vw; position:fixed; left:0; top:0; z-index:100000 !important;}

.infotop {position:relative; height:auto; padding-bottom:5vh;}


.imagecontainer {

  overflow: hidden;
  background-color: black;
  width:95%;	
  height:0;	
  	
}

.imagecontainer ul {
  display: flex;
  flex-wrap: wrap;
  /*border:1px solid white;
  border-left: 1px solid white;
  border-right: 1px solid white;
  border-bottom: 1px solid white;*/	
  margin: 0 -1px -1px 0;  
  list-style: none;
  padding: 0;
}

.imagecontainer li {
  flex: 1 0 150px;
  height: auto;
  margin-right:10px;	
  /*border-right: 1px solid white;*/
  border-bottom: 1px solid white;

}

.imagecontainer li:empty {
    height: 0;
    border: none;
}


.imagecontainer2 {

  background-color: black;	
  width:100vw;	
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  justify-content:space-between; 	
  padding: 0;	
}







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

.vidwidth4 {position:relative; bottom:0; width:24vw; height:7.75vh;}	
	
.productenhance.is-active {height:87vh; width:100vw;}	
.oscontainer {height:87vh; width:100vw;}	
.module {height:87vh; width:100vw;}	

	
h1 {
 font-family:  "Romain";
 font-size: 5vw;
 line-height: 4.5vw;
}
	
h4 {
 font-family:  "Romain";
 font-size: 3.25vw;
 line-height: 3.75vw;
}	
	
.margins {margin-left:3vw;}	
.dockmargin {padding-top:3vw;}
.dotmargin {margin-left:.25vw;}	
.tallimage {width:93vw;}	
	
}










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


/* IPAD STYLES */

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {}


/* IPHONE LANDSCAPE STYLES */

@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 667px) 
and (orientation : landscape) {
	

	h1 {font-size:18px !important; line-height:17px !important; letter-spacing:0px;}	
	
	
}





*:focus {
outline: 0;
outline: none;
}