body { padding: 0; margin: 0 }
#moondrift-webplayer { position: fixed; width: 100%; height: 100%; background: #000418 }
#moondrift-container { position: fixed; width: 100%; height: 100%; }
#moondrift-canvas { width: 100%; height: 100%; background: #000418 }
#moondrift-loading-bar { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: none }
#moondrift-progress-bar-empty { width: 100%; height: 1vw; margin-top: 10px ; border-color: #ff00f3; border-style: solid; border-width: 1px;}
#moondrift-progress-bar-full { width: 0%; height: 70%; margin: 0.25%;background: linear-gradient(to right, #ff00ef38, #fffb00); }
#moondrift-warning { position: absolute; left: 50%; top: 5%; transform: translate(-50%); background: white; padding: 10px; display: none }
#moondrift-fullscreen-button { position: absolute; right: 0px; bottom: 0px;  z-index: 1; float: right; width: 38px; height: 38px; background: url('fullscreen-button.png') no-repeat center }

@media all and (display-mode: fullscreen) {
    #moondrift-fullscreen-button {
      display: none
    }
  }