@import url("normalize.css");
@import url("main.css");

*{
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

html, body{
    background:#E2E2E2;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor:default;
}
body{
    position:fixed;
    overflow:hidden;
    top:0;
    left:0;
    width: 100%;
    height: 100%;
    background-color:#000000;
}

/*#page-stretcher{
    position:absolute;
    width:100%;
    z-index:200;
    opacity:0.4;
    background-color: greenyellow;
    height:200px;
}*/

canvas,
#html-dynamic-wrap{
    position:absolute;
    left: 50%;
    top: 50%;
    border: 0;
    box-sizing: border-box;
}

canvas{
    z-index:10;
}
#html-dynamic-wrap{
    z-index:1;
}


#html-dynamic-wrap>*{
    position:absolute;
    display:none;
}
.flipX{
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}

#rotate-overlay-wrap{
    display:none;
    background-color:rgba(0,0,0,.75);
    width:100%;
    height:100%;
    position:absolute;
    background-image:url("../img/rotate-phone.png");
    background-size: 90px auto;
    background-position:center center;
    background-repeat:no-repeat;
    z-index:992;
}



#progress-bar-wrap,
#progress-bar-wrap *{
    position:absolute;
}
#progress-bar-wrap{
    /*display:none;*/
    left: 50%;
    bottom:20px;
    width:428px;
    height:56px;
    margin-left:-214px;
    z-index: 991;
}
#progress-bar-wrap .bar-back{
    width:100%;
    height: 62px;
}
#progress-bar-back{
    background-image:url("../img/progress-bar-back.png");
    background-size:100% 100%;
    background-repeat:no-repeat;
}
#progress-bar-back-red{
    background-image:url("../img/progress-bar-back-red.png");
    background-size:100% 100%;
    background-repeat:no-repeat;
    clip: rect(0,0,0,0);
}
#progress-bar-logo{
    background-image:url("../img/progress-bar-logo.png");
    background-size:100% 100%;
    background-repeat:no-repeat;
    margin-left: 4px;
    top: 7px;
    width: 50px;
    height: 50px;
}
@media screen and (max-width:768px){
    #progress-bar-wrap{
        transform:scale(.7);
        -webkit-transform:scale(.7);
        bottom:6px;
    }
}
@media screen and (max-width:480px){
    #dialog,
    #progress-bar-wrap,
    #preloader{
        transform:scale(.66);
        -webkit-transform:scale(.66);
    }
}
@media screen and (max-width:384px){
}