html { box-sizing: border-box; }
*, ::before, ::after { box-sizing: inherit; }
html, body { height: 100%; }
canvas { display: block; }
body { margin: 0px; }
#unity-container { width: 100%; height: 100%; }
#unity-canvas { width: 100%; height: 100%; background: rgb(255, 255, 255); }
#loading-cover { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; }
#unity-loading-bar { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; align-items: center; }
#unity-logo { text-align: center; }
#unity-logo img { max-width: 80%; }
#unity-progress-bar-empty { width: 80%; height: 24px; margin: 10px 20px 20px 10px; text-align: left; border: 1px solid white; padding: 2px; }
#unity-progress-bar-full { width: 0%; height: 100%; background: white; }
.light #unity-progress-bar-empty { border-color: black; }
.light #unity-progress-bar-full { background: black; }
#unity-fullscreen-button { position: absolute; right: 10px; bottom: 10px; width: 38px; height: 38px; background: url("fullscreen-button.png") center center / contain no-repeat; }
.spinner, .spinner::after { border-radius: 50%; width: 5em; height: 5em; }
.spinner { margin: 10px; font-size: 10px; position: relative; text-indent: -9999em; border-width: 1.1em; border-style: solid; border-color: rgba(255, 255, 255, 0.2) rgba(255, 255, 255, 0.2) rgba(255, 255, 255, 0.2) rgb(255, 255, 255); transform: translateZ(0px); animation: 1.1s linear 0s infinite normal none running spinner-spin; }
@keyframes spinner-spin { 
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
