@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Symbols+2&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
body { display: flex; justify-content: center; padding: 0; margin: 0 }
#unity-container { position: relative}
#unity-container { max-width: 100vmin; display: flex; flex-direction: column; align-items: center; height: calc(100vh - 120px); }
#instructions { position: relative; width: 100%;}
#instructions-text {padding:12px; font-family: Roboto; font-size: 20px;}
#unity-canvas { background: #231F20 }
#unity-canvas-container { max-width: 100vmin; max-height: 100vmin; flex-shrink: 1;display: flex;min-width: 20vmin;min-height: 20vmin; }
#unity-loading-bar { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: none }
#unity-logo { width: 340px; height: 130px; background: url('SplashscreenWeb.png') no-repeat center;}
#unity-progress-bar-empty { width: 320px; height: 18px; margin-top: 10px; margin-left: 6.5px; background: url('progress-bar-empty-dark.png') no-repeat center }
#unity-progress-bar-full { width: 0%; height: 18px; margin-top: 10px; background: url('progress-bar-full-dark.png') no-repeat center }
#unity-footer { position: relative; padding-top:6px; width: 100%;}
#unity-webgl-logo { float:left; width: 204px; height: 38px; background: url('webgl-logo.png') no-repeat center; display: none;}
#unity-build-title { float: left; margin-top: 5px; margin-right: 10px; line-height: 38px; font-family: "Roboto"; font-size: 20px; display: none;}
#unity-fullscreen-button { cursor:pointer; float: right; width: 38px; height: 38px; background: url('fullscreen-button.png') no-repeat center;}
#unity-webxr-link { float: left; margin-right: 10px; line-height: 38px; font-family: arial; font-size: 18px; display: none;}
#entervr:enabled { float: right; width: 90px; height: 38px; display: inline-block; border: 0; margin: 6px; margin-right: 0px; color: white; font-family: "Roboto"; font-size: 18px; font-weight: bold;}
#enterar:enabled { float: right; width: 38px; height: 38px; background-color: #1eaed3; display: inline-block; border: 0; display: none; margin: 6px; font-size: 18px;}
#entervr:disabled { float: right; width: 90px; height: 38px; background-color: #dddddd; display: inline-block; border: 0; margin: 6px; margin-right: 0px; font-family: "Roboto"; font-size: 18px;}
#enterar:disabled { float: right; width: 38px; height: 38px; background-color: #dddddd; display: inline-block; border: 0; display: none; margin: 6px; font-size: 18px;}
#play:enabled { float: left; display: inline-block; border: 0; margin: 6px;}
#pause:enabled { float: left; display: inline-block; border: 0; margin: 6px;}
#stop:enabled { float: left; display: inline-block; border: 0; margin: 6px;}
#rewind:enabled { float: left; display: inline-block; border: 0; margin: 6px;}
#reset:enabled { float: left; width: 80px; height: 38px; color: white; font-family: "Roboto"; font-weight: 500; font-size: 14px;  display: inline-block; border: 0; margin: 6px;}
.icons {max-height: 30px; width: auto;}
.button { border-radius: 5px;}
.button:enabled {background-color: #1eaed3;}
.button:hover {background-color: #7ac9dd;}
.button:active {background-color: #2c8399;}