html,body{padding:0;margin:0;background-color:#222222;overflow:hidden;touch-action:none;width:100%;height:100%;font-family:'Title',Arial,sans-serif;font-size:8px;font-weight:600;} @font-face{font-family:'Title';src:url('font/Saira-SemiBold.woff') format('woff');} div#copyright{position:absolute;left:6px;bottom:6px;font-family:Arial,sans-serif;font-size:1.5em;color:white;background-color:green;padding:2px 6px 3px 6px;z-index:100;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;} div#startScreen{position:relative;width:100%;height:100%;background-color:#222222;z-index:10;display:block;} div#logo{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-91%);-ms-transform:translate(-50%,-91%);transform:translate(-50%,-91%);border:2px solid white;} div#logo *{display:block;box-sizing:border-box;} div#loading-bar{position:absolute;width:160%;height:5%;left:-30%;top:120%;border-style:solid;border-color:#FFFFFF;border-width:1px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;} div#bar{position:absolute;width:0%;height:100%;left:0%;top:0%;background-color:#FFFFFF;} img#btPlay{display:none;position:absolute;box-sizing:border-box;top:120%;width:70%;left:16%;} img#btPlay:active,.button:active{-webkit-transform:translateY(4px);-ms-transform:translateY(4px);transform:translateY(4px);} #vr{visibility:hidden;position:absolute;z-index:100;right:70px;bottom:30px;} #vr>img{position:absolute;cursor:pointer;opacity:0.4;width:25px;height:25px;} #vr>img:hover{opacity:1;} div#guideText{display:none;position:absolute;left:50%;top:10%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);background-color:rgba(255,94,0,0.1);color:white;border:1px solid white;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;padding:0.32em;font-size:2.75em;z-index:12;width:200px;text-align:center;} .overlay{position:absolute;display:none;top:0;left:0;z-index:11;background-color:rgba(0,0,0,0.6);width:100%;height:100%;} div#popupContainer{position:relative;width:100%;height:100%;background-color:rgba(0,0,0,0.6);z-index:12;text-align:center;display:none;} div#popupContainer *{display:inline-block;box-sizing:border-box;} div#popup{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:300px;} div#popupTitle{background-color:green;color:white;border:1px solid white;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;font-size:3.25em;font-weight:bold;padding:4px 4px 6px 4px;width:100%;margin-top:5%;margin-left:-300%;opacity:0;} div#popupMsg{background-color:white;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;border:1px solid green;width:100%;margin-left:-300%;opacity:0;font-size:2.75em;color:red;font-family:'Title',Arial,sans-serif;padding:0.54em;margin-top:0.64em;height:5.54em;} div#popupMsg>span:first-child{margin:0.27em 0;color:blue;} div#popupFooter{width:100%;margin-left:-300%;opacity:0;margin-top:6px;} #menu-overlay{z-index:20;} div#controlPanel{position:absolute;display:none;bottom:56px;right:-200px;width:156px;padding:6px 6px 2px 6px;border:2px solid white;background-color:rgba(255,255,0,0.2);-webkit-border-radius:12px;-moz-border-radius:12px;border-radius:12px;z-index:21;} .button{display:inline-block;padding:6px;width:76x;height:76px;box-sizing:border-box;} #btMenu{display:block;cursor:pointer;z-index:21;position:absolute;bottom:6px;right:6px;opacity:0.4;} .xflip{-webkit-transform:scaleX(-1);transform:scaleX(-1);} #btMenu:hover{opacity:1;} .language{display:none;}