html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;margin:0.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace, monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}*:before,*:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}input,button,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit}figure{margin:0}img{vertical-align:middle;max-width: 100%; height: auto;}.img-responsive{display:block;max-width:100%;height:auto}hr{margin-top:20px;margin-bottom:20px;border:0;border-top:1px solid #eee}.hide{display:none !important}.show{display:block !important}.invisible{visibility:hidden}html{font-size:10px;-webkit-tap-highlight-color:rgba(0,0,0,0)}
body{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;/*font-size:14px;*/line-height:1.42857143;color:#445469;background:#fff url("../img/indexbg.png") no-repeat; background-size: cover;}
p,h1,h2,h3,h4,h5,h6 {padding: 0; margin: 0;}
a{color:#337ab7;text-decoration:none}
a:hover,a:focus{text-decoration:none}
a:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}

.loading {background-image: url("../img/download.gif");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto 60%;
}
.SHADE {top: 0; left:0; width:100%; height: 100%; bottom:0; z-index: 11;}
.BOX-V {box-orient: vertical;-webkit-box-orient: vertical; -moz-box-orient: vertical;-ms-flex-direction:column;}
.BOX-D {box-align: end; box-pack: center -webkit-box-align: end; -webkit-box-pack: center; -ms-flex-align:end; -ms-flex-pack:center;}
.BOX-M {box-align: center;box-pack: center; -webkit-box-align: center; -webkit-box-pack: center; -ms-flex-align:center; -ms-flex-pack:center;}
.BOX-S {display:block; box-flex:1; -webkit-box-flex:1; -moz-box-flex:1;-ms-flex:1;}
.BOX   ,.BOX-V,.BOX-D,.BOX-M, .FOOTER{display:box; display: -webkit-box; display: -moz-box; display: -ms-flexbox;}
.BBOX  ,.BOX,.APP-STAGE,.INSET-STAGE,.STAGE,.PAGE-STAGE,.PAGE,.PAGE-BOX,.INSET-PAGE,.FOOTER{box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
.poscenter{
            position:absolute;
            left:50%;
            top:50%;
            transform:translate(-50%,-50%);
            -webkit-transform:translate(-50%,-50%);
        }

#welcome { background-color:rgba(0,0,0,.8); text-align: center; font-weight: bold;overflow: hidden;}
.welcome-bg {position:absolute;top:0;left:0;right:0;bottom:0; /*background: url(./81345eabgw1ei0jyahwhwj20gp0qzt9s.jpg) center center no-repeat;*/ background-size:100% 100%; opacity: .4;overflow: hidden;}
#GameTimeLayer {top:5%; left: 0; width:100%; text-align: center; color:#ffea00; font-size: 4em; text-shadow: 0 0 5px rgba(0, 0, 0, 0.26);overflow: hidden;}
#GameLayerBG {top:0;left:0;right:0;bottom:0;overflow:hidden; background-color: #1acdf5;}
.GameLayer {position:absolute;bottom:0;left:0;}
.block {position:absolute;/*border-top:1px solid #ddd; */background-repeat: no-repeat; background-position: center;}
.t1,.t2,.t3,.t4,.t5 { background-color:#000; border-bottom: solid 1px #292929;}
.tt1,.tt2,.tt3,.tt4,.tt5 { background-color:#ffea00;}

.bl {border-left:1px solid #ddd;}
@-ms-keyframes flash {
    0% { opacity: 1; }
    50% { opacity: 0; }
    100% { opacity: 1; }
}
@-webkit-keyframes flash {
    0% { opacity: 1; }
    50% { opacity: 0; }
    100% { opacity: 1; }
}
.flash {-webkit-animation: flash .2s 3;animation: flash .2s 3;}
.bad {background-color: #f00; -webkit-animation: flash .2s 3;animation: flash .2s 3;}
*    {-webkit-tap-highlight-color: rgba(0,0,0,0);-ms-tap-highlight-color: rgba(0,0,0,0); tap-highlight-color: rgba(0,0,0,0); -ms-user-select: none;}

#GameScoreLayer {}
.bgc1,.bgc2,.bgc3,.bgc4,.bgc5 { background-color: rgba(0, 0, 0, 0.8);}
.share-icon {width:1.7em; background-repeat:no-repeat; background-size: auto 100%;}
#GameScoreLayer-btn .btn,#GameScoreLayer-share .btn {}
.btn:active {opacity: 0.2;}
#landscape {display: none;}
#gameBody {position: relative; width: 640px; margin: 0 auto; height: 100%;}


.vetically{display:-webkit-box;display:flex;display:-webkit-flex;-webkit-box-pack:center;-webkit-box-align:center;-webkit-box-orient:vertical;justify-content:center;-webkit-justify-content:center;align-items:center;-webkit-align-items:center;flex-direction:column;-webkit-flex-direction:column}



/*---------------- buttom ----------------*/
.btn {
    color: white;
    background-image: url("../img/btn.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    font-weight: 600;
    font-size: 16px;
    text-decoration: none;
    background-color: transparent;
    text-align: center;
    padding: 10px 40px;
    margin: 0;
    display: inline-block;
    appearance: none;
    cursor: pointer;
    border: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
}
.btn:visited {
    /*color: #489cec;*/
    color: white;
}
.btn:hover, .btn:focus {
    text-decoration: none;
    outline: none;
}
.btn:active, .btn.active {
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
    text-decoration: none;
    color: #999;
    -webkit-transition-duration: 0s;
    transition-duration: 0s;
    -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
}
.btn.disabled,.btn:disabled {
    top: 0 !important;
    background: #EEE !important;
    border: 1px solid #DDD !important;
    text-shadow: 0 1px 1px white !important;
    color: #CCC !important;
    cursor: default !important;
    appearance: button !important;
    -webkit-appearance: button !important;
    -moz-appearance: button !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    opacity: .8 !important;
}

/*3d button*/
.btn-3d {
    color: white;
    position: relative;
    top: 0;
    /*-webkit-box-shadow: 0 1px 0 #dac00a, 0 1px 1px rgba(0, 0, 0, 0.2);*/
    /*box-shadow: 0 1px 0 #dac00a, 0 1px 1px rgba(0, 0, 0, 0.2);*/
}
.btn-3d:hover, .btn-3d:focus {
    /*background-color: #ffec1c;*/
    /*border-color: #ffec1c;*/
    color: white;
    /*-webkit-box-shadow: 0 7px 0 #dac00a, 0 5px 3px rgba(0, 0, 0, 0.2);*/
    /*box-shadow: 0 5px 0 #dac00a, 0 5px 3px rgba(0, 0, 0, 0.2); */
}
.btn-3d:active, .btn-3d.active, .btn-3d.is-active {
    background-color: #ffec1c;
    border-color: #ffec1c;
    color: #489cec;
    top: 5px;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: .15s;
    transition-duration: .15s;
    /*-webkit-box-shadow: 0 2px 0 #dac00a, 0 3px 3px rgba(0, 0, 0, 0.2);*/
    /*box-shadow: 0 2px 0 #dac00a, 0 3px 3px rgba(0, 0, 0, 0.2);*/
}

.selectPage,.guize  {position: fixed; z-index: 99; width: 100%; height: 100%; top: 0; left: 0; background-color: #1acdf5;}

.selectPage .btn {font-size: 1.5rem; display: block; margin:5% auto; width: 55%;}

.popbox {margin: 0 10% 0 10%; border-radius: 0.8rem; background-color: #f1f2f2; width: 80%;}
.popbox .boxTitle {font-size: 1.5rem; color: #fff; padding: 0 0;}
.boxTitle{

}
.boxTitle img{
    max-width: 200%;
    width: 110%;
    transform: translate(-5%,-55%);
    -webkit-transform: translate(-5%,-55%);
    -moz-transform: translate(-5%,-55%);
}
.boxCont {
    color: black;
    padding: 0 5% 10%;
    font-size: 1.2rem;
    margin-top:-2rem;
}

.guize {text-align: left; color: #fff; overflow: scroll; font-size: 0.8rem; z-index: 100;}
.guize p {width: 100%; padding: 0 10%;}
.guize ul{padding: 0 10% 0 15%;}

.phoneinput {border: none; background-color: #d1d1d1; display: block; width: 100%; border-radius: 1.5rem; padding: 0.6rem 0.5rem; font-size: 1.2rem; text-align: center; text-decoration: none; outline: none; margin-bottom: 1rem;
    -webkit-box-shadow: 0px 0.2rem 0.2rem rgba(0, 0, 0, 0.16) inset; box-shadow: 0px 0.2rem 0.2rem rgba(0, 0, 0, 0.16) inset;}
#lqllBg{
    background-image: url("../img/indexbg.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: 100%;
}
#lqllTitle{
    width: 70%;
    margin:auto;
    padding: 28% 0 0;

}
.lqllP{
    width: 80%;
    text-align: center;
    font-size: 1.1rem;
    color: black;
    display: block;
    margin: auto;
    font-weight: bold;
}
#lqllIcon{
    width: 70%;
    margin: auto;
}