html, body
{
  background: black;
  background-color: black;
}

div#stats {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 500;
  width: max(200px, 10vw, 10vh);
  height: max(100px, 6vh, 6vw);
  opacity: 0.8;
  user-select: none;
}

#container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000000;
}

.canvas-box {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  transform-origin: 0px 0px;
  background: black;
}

.canvas {
  display: block;
  width: 100%;
  height: 100%;
  background: black;
}

@keyframes rotate_device {
  0% {transform: rotate(0);}
  25% {transform: rotate(0);}
  75% {transform: rotate(90deg);}
  100% {transform: rotate(90deg);}
}

.rotate_device_anim {
  animation-name: rotate_device;
  animation-duration: 6s;
  /*animation-iteration-count: infinite;*/
  animation-fill-mode: forwards;
}

@keyframes scale_logo {
  0% {transform: scale(0.7);}
  25% {transform: scale(0.7);}
  75% {transform: scale(1);}
  100% {transform: scale(1);}
}

.scale_logo_anim {
  animation-name: scale_logo;
  animation-duration: 6s;
  /*animation-iteration-count: infinite;*/
  animation-fill-mode: forwards;
}
