﻿.luckywheel {
    position: absolute;
    margin: auto;
    left: 50%;
    top: 90px;
    margin-left: -255px;
    z-index: 91
}

.luckywheel.running .lights i:before {
-webkit-animation: jds .4s infinite ease;
animation: jds .4s infinite ease
}

.luckywheel.running .lights i:after {
-webkit-animation: jds .4s .2s infinite ease;
animation: jds .4s .2s infinite ease
}

.luckywheel:not(.running) .lights i:first-child:before {
-webkit-animation: jds .6s 0ms infinite ease;
animation: jds .6s 0ms infinite ease
}

.luckywheel:not(.running) .lights i:first-child:after {
-webkit-animation: jds .6s 50ms infinite ease;
animation: jds .6s 50ms infinite ease
}

.luckywheel:not(.running) .lights i:nth-child(2):before {
-webkit-animation: jds .6s .1s infinite ease;
animation: jds .6s .1s infinite ease
}

.luckywheel:not(.running) .lights i:nth-child(2):after {
-webkit-animation: jds .6s .15s infinite ease;
animation: jds .6s .15s infinite ease
}

.luckywheel:not(.running) .lights i:nth-child(3):before {
-webkit-animation: jds .6s .2s infinite ease;
animation: jds .6s .2s infinite ease
}

.luckywheel:not(.running) .lights i:nth-child(3):after {
-webkit-animation: jds .6s .25s infinite ease;
animation: jds .6s .25s infinite ease
}

.luckywheel:not(.running) .lights i:nth-child(4):before {
-webkit-animation: jds .6s .3s infinite ease;
animation: jds .6s .3s infinite ease
}

.luckywheel:not(.running) .lights i:nth-child(4):after {
-webkit-animation: jds .6s .35s infinite ease;
animation: jds .6s .35s infinite ease
}

.luckywheel:not(.running) .lights i:nth-child(5):before {
-webkit-animation: jds .6s .4s infinite ease;
animation: jds .6s .4s infinite ease
}

.luckywheel:not(.running) .lights i:nth-child(5):after {
-webkit-animation: jds .6s .45s infinite ease;
animation: jds .6s .45s infinite ease
}

.luckywheel:not(.running) .lights i:nth-child(6):before {
-webkit-animation: jds .6s .5s infinite ease;
animation: jds .6s .5s infinite ease
}

.luckywheel:not(.running) .lights i:nth-child(6):after {
-webkit-animation: jds .6s .55s infinite ease;
animation: jds .6s .55s infinite ease
}

.luckywheel:not(.running) .lights i:nth-child(7):before {
-webkit-animation: jds .6s .6s infinite ease;
animation: jds .6s .6s infinite ease
}

.luckywheel:not(.running) .lights i:nth-child(7):after {
-webkit-animation: jds .6s 0ms infinite ease;
animation: jds .6s 0ms infinite ease
}

.luckywheel:not(.running) .lights i:nth-child(8):before {
-webkit-animation: jds .6s 50ms infinite ease;
animation: jds .6s 50ms infinite ease
}

.luckywheel:not(.running) .lights i:nth-child(8):after {
-webkit-animation: jds .6s .1s infinite ease;
animation: jds .6s .1s infinite ease
}

.luckywheel:not(.running) .lights i:nth-child(9):before {
-webkit-animation: jds .6s .15s infinite ease;
animation: jds .6s .15s infinite ease
}
 

 
   
  
.luckywheel .lw-small {
position: absolute;
top: 290px;
left: 400px;
z-index: 2
}

 

.luckywheel .lw-small:after, .luckywheel .lw-small:before {
content: " ";
display: inline-block;
background-repeat: no-repeat;
position: absolute
}

  
 
.luckywheel .lw-small .center:after, .luckywheel .lw-small .center:before {
content: " ";
display: inline-block;
background-repeat: no-repeat;
position: absolute
}
    

.luckywheel .lw-big {
position: absolute;
 
z-index: 3
}

.luckywheel .lw-big:before {
    width: 520px;
    height: 548px;
    background-image: url(../images/media/luckywheel.064dec70.png);
    background-position: -55px -2px;
    top: 0;
    left: 0;
    z-index: 10
}


.luckywheel .lw-big:after, .luckywheel .lw-big:before {
content: " ";
display: inline-block;
background-repeat: no-repeat;
position: absolute
}

.luckywheel .lw-big:after {
    width: 49px;
    height: 74px;
    background-image: url(../images/media/luckywheel.064dec70.png);
    background-position: -2px -2px;
    top: 14px;
    left: 237px;
    z-index: 11
}
 

 

.luckywheel .lw-big .lw-in-rw, .luckywheel .lw-big .lw-out-rw {
display: inline-block;
background-repeat: no-repeat;
position: absolute
}



    .luckywheel .lw-big .center {
        position: absolute;
        top: 220px;
        left: 196px;
        width: 139px;
        cursor: pointer;
        z-index: 12;
        -webkit-transform-origin: 69px 69px;
        -ms-transform-origin: 69px 69px;
        transform-origin: 69px 69px
    }

.luckywheel .lw-big .center:hover {
-webkit-animation: bounceScale .25s ease-in-out;
animation: bounceScale .25s ease-in-out
}

.luckywheel .lw-big .center:before {
    content: " ";
    display: inline-block;
    width: 139px;
    height: 139px;
    background-repeat: no-repeat;
    background-image: url(../images/media/luckywheel.064dec70.png);
    background-position: -728px -2px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2
}

.luckywheel .lw-big .center i {
position: absolute;
top: 0;
left: 0;
z-index: 1
}

 

.luckywheel .lw-big .center i:after {
    -webkit-transform: rotate(33deg);
    -ms-transform: rotate(33deg);
    transform: rotate(33deg);
    -webkit-animation-delay: .4s;
    animation-delay: .4s
}

.luckywheel .lw-big .center .text-spin {
position: absolute;
top: 50px;
left: 40px;
z-index: 3
}

.luckywheel .lw-big .center .count {
    font-size: 33px;
    font-weight: 800;
    top: 75px;
}

.luckywheel .lw-big .center .count, .luckywheel .lw-big .center .text-count {
color: #641003;
text-shadow: 0 1px rgba(239,157,52,.6);
width: 100%;
position: absolute;
left: 0;
text-align: center;
z-index: 3
}

.luckywheel .lw-big .center .text-count {
font-size: 16px;
top: 133px
}



    .luckywheel .button-close {
        width: 66px;
        height: 66px;
        background-repeat: no-repeat;
        background-image: url(../images/media/luckywheel.064dec70.png);
        background-position: -579px -2px;
        z-index: 5;
        position: absolute;
        left: 463px;
        top: 49px;
    }

.luckywheel .ic-close {
    position: relative;
    display: inline-block;
    background-repeat: no-repeat;
    width: 21px;
    height: 22px;
    background-image: url(../images/media/luckywheel.064dec70.png);
    background-position: -871px -2px;
    left: 22px;
    top: 21px;
}
    .luckywheel .button-history {
        width: 75px;
        height: 51px;
        background-repeat: no-repeat;
        background-image: url(../images/media/luckywheel.064dec70.png);
        background-position: -649px -2px;
        z-index: 5;
        position: absolute;
        left: 466px;
        top: 448px;
    }
.luckywheel .button-history:hover, .luckywheel .button-close:hover {
    -webkit-filter: brightness(130%);
    filter: brightness(130%);
    cursor: pointer;
}

.vqmm {
    position: absolute;
    top: 150px;
    left: -25px;
}
.vq-thongbao {
    height: 129px;
    width: 540px;
    background-color: rgba(19, 18, 21, 0);
    background-image: -webkit-linear-gradient(left, rgba(41, 7, 70, 0) 0%, rgba(168, 20, 40, 0.7) 20%, rgba(168, 20, 40, 0.7) 50%, rgba(168, 20, 40, 0.7) 80%, rgba(41, 7, 70, 0) 100%);
    background-image: linear-gradient(to right, rgba(41, 7, 70, 0) 0%, rgba(168, 20, 40, 0.7) 20%, rgba(168, 20, 40, 0.7) 50%, rgba(168, 20, 40, 0.7) 80%, rgba(41, 7, 70, 0) 100%);
    position: absolute;
    top: 49px;
    left: 28px;
    display: table;
    text-align: center;
    z-index: 5;
    padding: 30px 0 0;
}

.vqmm_popup_history {
    width: 570px;
    z-index: 1300;
    position: absolute;
}
.vqmm_popup_history .vqmm_history_content .vq-popup.popup-lich-su {
    width: 570px;
    top: 100px;
}



.vqmm_popup_history .vqmm_history_content .vq-popup .popup-head .btn-close-popup {
    width: 30px;
    height: 30px;
    display: inline-block;
    position: absolute;
    top: 20px;
    left: 518px;
    cursor: pointer;
}



.vqmm_popup_history .vqmm_history_content .vq-popup .popup-body {
    margin: 20px;
    min-height: 160px;
    background-color: #1b0101;
    background-image: -webkit-linear-gradient(top, #1b0101, #3a1c0b);
    background-image: linear-gradient(to bottom, #1b0101, #3a1c0b);
}

.vqmm_popup_history .vqmm_history_content .vq-popup .popup-body .tbl-popup {
    width: 100%;
    border-collapse: collapse;
     
}
.vqmm_popup_history .vqmm_history_content .vq-popup .popup-body .tbl-popup thead tr {
    background-color: #7a523b;
    background-image: -webkit-linear-gradient(bottom, #7a523b, #9c7556);
    background-image: linear-gradient(to top, #7a523b, #9c7556);
}
.vqmm_popup_history .vqmm_history_content .vq-popup .popup-body .tbl-popup thead tr th {
    padding: 5px;
    color: #fff000;
    font-weight: 600;
    text-align: center;
}
    .vqmm_popup_history .vqmm_history_content .vq-popup .popup-body .tbl-popup tbody tr:nth-child(odd) {
        background: #5e3f2d;
    }
    .vqmm_popup_history .vqmm_history_content .vq-popup .popup-body .tbl-popup tbody tr {
        background: #4f3221;
    }

.vqmm_popup_history .vqmm_history_content .vq-popup .popup-body .tbl-popup tbody tr td {
   
    padding: 5px;
    text-align: center;
    color: #fff;
}
    .vqmm_popup_history .vqmm_history_content .vq-popup .popup-body .tbl-popup tbody tr:nth-child(odd) td {
        color: #fff;
    }
