/*WHEEL POINTER & BACKGROUND*/
    
@-webkit-keyframes pound {to { -webkit-transform: scale(0.7); }}
@keyframes pound {to { -webkit-transform: scale(0.7); }}
@-webkit-keyframes fadeout{to { opacity: 0; }}
@keyframes fadeout{to { opacity: 0; }}
.fadeout{
    animation: fadeout 2s ;
    -webkit-animation: fadeout 2s ;
    animation-iteration-count:1;
    -webkit-animation-iteration-count:1;
}

.bg-frame{position: absolute; margin: 0 0 0 0;}
.plate-frame{
    position: absolute; 
    margin: 0 0 0 0;
    /*-webkit-animation-duration: 2s;animation-duration: 2s;*/
    -webkit-animation-fill-mode: both;animation-fill-mode: both;
}
.pointer-frame{
    position: absolute;
    -webkit-animation: pound .25s infinite alternate;
    margin: 0 0 0 0;
}
#pointer-frame.off {
    -webkit-animation-name: none;
            animation-name: none;	
}


/*COUPON KEYOARD*/
.opacity{background-color: rgba(0,0,0,0.5);}
.behind{z-index : -5;}

/*OTHERS*/
img{width: 100%; height: 100%;}
body{         
    position: absolute;
    overflow:hidden ;            
    font-family: "微軟正黑體";
    width:100%;
    height:100%;
    margin: 0 0 0 0;
}
.background{
    background-color: black;
    position: absolute;
    top:0%;
    left:0%;
    width:100%;
    height:100%;
    z-index: -2;
}
.hidden{display: none;}
.center-div{
    position: absolute;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: -ms-flexbox;
    display:flex;
    -webkit-box-align:center;
        -ms-flex-align:center;
            align-items:center;
    -webkit-box-pack:center;
        -ms-flex-pack:center;
            justify-content:center;
}
.left-div{
    position: absolute;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: -ms-flexbox;
    display:flex;
    -webkit-box-align:center;
        -ms-flex-align:center;
            align-items:center;
    -webkit-box-pack:flex-start;
        -ms-flex-pack:flex-start;
            justify-content:flex-start;
}
.right-div{
    position: absolute;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: -ms-flexbox;
    display:flex;
    -webkit-box-align:center;
        -ms-flex-align:center;
            align-items:center;
    -webkit-box-pack:flex-end;
        -ms-flex-pack:flex-end;
            justify-content:flex-end;
}
.text-align-left{text-align: left;}
.text-align-center{text-align: center;}
.text-align-right{text-align: right;}
.input-text-center{text-align: center;}

.userinfo-wrap{
    max-height: 50vh;
    overflow: scroll;
    background: #efefef;
    border-radius: 5%;
}

/* #qrcode{
    width:30vw;
    height:30vw;
}
#qrcode canvas{
    width:100%;
    height:100%;
} */