html, body {
  height: 100%;
  overflow: hidden;
  font-family: monospace;
  font-size: 12px;
  margin: 0;
  padding: 0;
  background-color: #000;
  color: #fff;
  }


.video-container {
  height: 100%;
}

#video {
  position: absolute;
  transform: rotate3d(0,0,1,270deg);	
  transform-origin: bottom right;		
  right:0px;							
  //transform: rotate3d(0,0,1,90deg);   
  //transform-origin: bottom left;		
  width: 100vh;
  height: 100vw;
  margin-top: -100vw;
  
  object-fit: cover;
  z-index: 22;
  visibility: visible;
}




@media (orientation:portrait) {
  #video {
    position: absolute;
    transform: initial;
    transform-origin: bottom left;
    width: 100vw;
    height: 100vh;
    margin-top: 0;
    object-fit: cover;
    z-index: 22;
    visibility: visible;
  }
}

@media (orientation:landscape) {
  div.stats {
    visibility: visible;
    transform: rotate(270deg);
    transform-origin: top right;
    right: 0px;
    top: 330px;
    z-index: 22;
  }
}

body.fallback {
  padding: 50px;
}

body.fallback h1,
body.fallback h2,
body.fallback h3 {
  font-family: monospace;
  color: #333;
}


.press-audio {
	position: absolute;
	
	right: 15px;
	top: 15px;
	opacity: 0.5;
	font-size: 8px;
	z-index: 27;

}