html,body{background-color:#131421;margin:0;padding:0;position:relative;font-family:"Arial";width:100%;height:100%;touch-action:none;overflow:hidden;} #game{position:absolute;left:0;top:0;z-index:0;} #xloader{background:url('media/graphics/misc/gloader.svg') center no-repeat;} #canvas{position:absolute;left:0;top:0;width:100%;height:100%;-ms-interpolation-mode:nearest-neighbor;-webkit-transform:scale3d(1,1,1);z-index:1;} #orientate{position:absolute;float:left;width:100%;height:100%;top:0;left:0;z-index:10002;display:none;} #orientate img{position:absolute;float:left;width:100%;height:100%;} .play{position:absolute;float:left;width:100%;height:100%;z-index:1000;background-color:#fff;left:0;top:0;display:none;} .play img{position:absolute;float:left;width:100%;height:100%;z-index:1000;left:0;top:0;} #nohtml5{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000;z-index:1002;visibility:hidden;} #nohtml5 img{position:absolute;width:100%;height:100%;} #nohtml5-bubble{position:absolute;bottom:20px;left:50px;width:380px;height:100px;z-index:1002;color:#000;background:rgba(255,255,255,0.75);-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;} #nohtml5-text{padding:10px;} .horizontal-seperator{height:10px;width:100%;} .lds-circle{display:inline-block;transform:translateZ(1px);} .lds-circle > div{display:inline-block;width:64px;height:64px;margin:8px;border-radius:50%;background:#fff;animation:lds-circle 2.4s cubic-bezier(0,0.2,0.8,1) infinite;} @font-face{font-family:'soup';src:url('media/fonts/maingame.ttf');} @keyframes lds-circle{0%,100%{animation-timing-function:cubic-bezier(0.5,0,1,0.5);} 0%{transform:rotateY(0deg);} 50%{transform:rotateY(1800deg);animation-timing-function:cubic-bezier(0,0.5,0.5,1);} 100%{transform:rotateY(3600deg);} }