html {
    background-color: #1a1a1a;
}

::-webkit-scrollbar {
    width: 0px;
    background: transparent; /* make scrollbar transparent */
}

body {
    background: #1a1a1a;
    background-position: center;
    background-size: auto;
    background-attachment: scroll;
    margin: 0;
    line-height: normal;
    font-family: Verdana, Geneva, sans-serif;
    /*font-family: sans-serif; "Open Sans", sans-serif, "Microsoft JhengHei";*/
    font-size: 18px;
    color: #fff;
    background-image: url(/data/2061/uploads/texture.png);
}

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

img {
    vertical-align: middle;
}

table {
    width: 100%;
}

button {
    outline: 0;
    border: 0;
}

input {
    outline: 0;
    border: 0;
}

iframe {
    width: 100%;
    height: 850px;
    border-radius: 6px;
    -webkit-box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
    -moz-box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
    box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
    border: 1px solid #cfc47d;
}

a, a:hover, a:active, a:focus {
    text-decoration: none;
}

ul, ol {
    margin-left: 20px;
    margin-bottom: 20px;
}

li {
    list-style-type: disc;
    padding: 5px 0;
}

ol.f > li {
    list-style-type: decimal !important;
}

ol.q > li {
    list-style-type: lower-roman !important;
}

ul.a > li {
    list-style-type: circle;
}

@media screen and (max-width:767px) {
    iframe {
        height: 70vh;
    }
}

@media screen and (min-height:767px) {
    #divBody {
        min-height: 500px;
    }
}
/***************************************************************************** style */
.w1440 {
    max-width: 1440px;
    margin: auto;
    width: 100%;
}

a {
    color: rgb(207, 173, 103);
}

    a:hover {
        color: rgb(207, 173, 103);
    }

h1 {
    color: rgb(207, 173, 103);
    font-weight: bold;
}

h3 {
    color: rgb(207, 173, 103);
    font-weight: bold;
}

h4 {
    color: rgb(207, 173, 103);
    font-weight: bold;
    margin-top: 30px;
    margin-bottom: 15px;
}

h5 {
    color: rgb(207, 173, 103);
    font-size: 18px;
}

.underline {
    text-decoration: underline;
}

button.close {
    transition: transform 0.2s ease-in-out;
    font-size: 40px;
    opacity: 1;
    text-shadow: none;
    font-weight: normal;
}

    button.close:hover {
        transform: rotate(180deg);
    }

.pd-5 {
    padding: 5px;
}


.modal-backdrop {
    background-color: #000;
}

    .modal-backdrop.in {
        opacity: 0.8;
    }

@media screen and (max-width:767px) {
    .box-container {
        margin: 25px auto;
    }
}
/**** bootstrap */
.d-flex {
    display: flex;
}

.flex-wrap {
    flex-wrap: wrap;
}

.justify-content-center {
    justify-content: center;
}

.justify-content-between {
    justify-content: space-between;
}

.align-items-center {
    align-items: center;
}

.text-center {
    text-align: center;
}

/**** scroll bar */
::-webkit-scrollbar {
    width: 8px;
    height: 5px;
}

::-webkit-scrollbar-button {
    width: 0px;
    height: 0px;
}

::-webkit-scrollbar-thumb {
    background: #888;
    border: 0px none #ffffff;
    border-radius: 50px;
}

    ::-webkit-scrollbar-thumb:hover {
        background: #888;
    }

    ::-webkit-scrollbar-thumb:active {
        background: #888;
    }

::-webkit-scrollbar-track {
    background: #F5F5F5;
    border: 0px none #ffffff;
    border-radius: 50px;
}

    ::-webkit-scrollbar-track:hover {
        background: #F5F5F5;
    }
/*::-webkit-scrollbar-track:active { background: #F5F5F5; }*/
::-webkit-scrollbar-corner {
    background: transparent;
}

/***************************************************************************** NEWS */
.wrap-icon {
    width: 38px;
    height: 38px;
    background: rgba(0,0,0,0.6);
    box-shadow: inset 0 0 2px #445c93;
    border-radius: 13px;
    padding: 6px 8px;
    border: 1px solid #333;
    position: absolute;
}

.img-bell {
    width: 22px;
    transform: scale(1.4);
    -webkit-animation: ring-data-news 3s ease-in-out infinite;
    animation: ring-data-news 3s ease-in-out infinite;
}

/***************************************************************************** TERMS */
.collapse-box {
    border: 1px solid #888;
    border-radius: 6px;
    margin: 10px 0;
}

.btn-collapse {
    width: 100%;
    border-radius: 0;
    margin: 0;
    text-align: left;
    border: 0;
    position: relative;
    padding: 7px 15px;
    background-color: #af0013;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

.btn-collaps:hover {
    border-color: #eb2e42;
    color: #fff;
}

.btn-collapse.collapsed:after {
    content: '+';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #eb2e42;
    font-weight: bold;
    font-size: 21px;
}

.btn-collapse.collapsed {
    background-color: transparent;
}

.btn-collapse:not(collapsed):after {
    content: '-';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-weight: normal;
    font-size: 21px;
}

.content.collapse {
    padding-left: 10px;
    padding-right: 10px;
}

.content.collapsing {
    padding-left: 10px;
    padding-right: 10px;
}

/***************************************************************************** ADMIN  */
#theme-contain-adminloginx {
    padding: 20px 15px;
}

    #theme-contain-adminloginx input {
        padding: 5px 7px;
        border: 1px solid #666;
        margin: 5px auto;
        background-color: #fff;
        color: #000;
    }

    #theme-contain-adminloginx > p + table {
        max-width: 350px;
        margin: 0 auto;
        width: 90%;
    }

        #theme-contain-adminloginx > p + table > tbody > tr > td:nth-child(2) {
            padding-left: 10px;
        }

    #theme-contain-adminloginx table {
        border: 0 !important;
    }

        #theme-contain-adminloginx table td {
            border: 0 !important;
        }
/***************************************************************************** HEADER TOP */
.divHeader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 99;
}

.header-top {
    position: relative;
    z-index: 99;
}

    .header-top:before {
        content: '';
        position: absolute;
        top: 0;
        bottom: 30px;
        right: 0;
        left: 0;
        background: linear-gradient(180deg,#222222 0%,#000000 100%);
        transform: translateZ(0);
        pointer-events: none;
    }

.headertop-wrapper {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    max-width: 1440px;
    margin: auto;
    position: relative;
    z-index: 99;
}

.header-top:after {
    content: '';
    position: absolute;
    bottom: 30px;
    right: 0;
    left: 0;
    height: 5px;
    background-image: url('/data/2058/uploads/img-border.png');
    background-size: 100% auto;
}

.headertop-wrapper > div {
    flex: 2;
    width: 100%;
    margin-bottom: 30px;
}

    .headertop-wrapper > div.headertop-center {
        flex: 3;
        margin-bottom: 0 !important;
    }

.announce-box {
}

.btn-noti {
    background-color: transparent;
}

#horizontal-scrolling-msg ul {
    margin-bottom: 0;
}

#horizontal-scrolling-msg li {
    display: inline-block;
    margin-right: 30px;
}

.header-text {
    padding: 20px;
    font-size: 16px;
    text-align: center;
}
/** LOGO **/
.header-logo {
    background-image: url('/data/2058/uploads/bg-logo.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    text-align: center;
}

    .header-logo img {
        max-width: 100%;
    }

.announce-icon {
    position: relative;
    padding: 5px;
    border-radius: 50%;
    background-color: #000;
}

.icn-bell {
    animation: mybell 4s .7s ease-in-out infinite;
    transform-origin: 50% 4px;
    height: 25px;
}

@keyframes mybell {
    0% {
        transform: rotate(0);
    }

    1% {
        transform: rotate(30deg);
    }

    3% {
        transform: rotate(-28deg);
    }

    5% {
        transform: rotate(34deg);
    }

    7% {
        transform: rotate(-32deg);
    }

    9% {
        transform: rotate(30deg);
    }

    11% {
        transform: rotate(-28deg);
    }

    13% {
        transform: rotate(26deg);
    }

    15% {
        transform: rotate(-24deg);
    }

    17% {
        transform: rotate(22deg);
    }

    19% {
        transform: rotate(-20deg);
    }

    21% {
        transform: rotate(18deg);
    }

    23% {
        transform: rotate(-16deg);
    }

    25% {
        transform: rotate(14deg);
    }

    27% {
        transform: rotate(-12deg);
    }

    29% {
        transform: rotate(10deg);
    }

    31% {
        transform: rotate(-8deg);
    }

    33% {
        transform: rotate(6deg);
    }

    35% {
        transform: rotate(-4deg);
    }

    37% {
        transform: rotate(2deg);
    }

    39% {
        transform: rotate(-1deg);
    }

    41% {
        transform: rotate(1deg);
    }

    43% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(0);
    }
}

.header-menubtn {
    float: right;
}

.btn-menu {
    position: relative;
}

    .btn-menu > div {
        padding: 5px;
        cursor: pointer;
    }

    .btn-menu span {
        width: 30px;
        height: 4px;
        display: block;
        margin: 4px 0;
        margin-left: auto;
        background-color: #E9D195;
        border-radius: 4px;
        -webkit-transition: -webkit-transform 0.3s linear;
        transition: -webkit-transform 0.3s linear;
        transition: transform 0.3s linear;
        transition: transform 0.3s linear, -webkit-transform 0.3s linear;
    }

        .btn-menu span:nth-child(2) {
            width: 25px;
        }

        .btn-menu span:nth-child(3) {
            width: 20px;
        }

@media screen and (max-width:1200px) {
    .header-text {
        font-size: 13px;
    }
}

@media screen and (max-width:1023px) {
    .announce-scroll {
        display: none;
    }

    .header-text {
        display: none;
    }

    .headertop-left {
        padding-left: 10px;
    }

    .headertop-right {
        padding-right: 10px;
    }

    .headertop-wrapper > div {
        flex: 1;
    }

        .headertop-wrapper > div.headertop-center {
            flex: 2;
        }
}

@media screen and (max-width:767px) {
    .header-top.active {
        z-index: 1060;
    }

    .header-top:before {
        bottom: 15px;
    }

    .header-top:after {
        bottom: 15px;
        height: 3px;
    }

    .headertop-wrapper > div {
        margin-bottom: 15px;
    }

        .headertop-wrapper > div.headertop-center {
            flex: 4;
        }

    .btn-menu span {
        width: 25px;
        height: 3px;
        margin: 3px 0;
        margin-left: auto;
    }

        .btn-menu span:nth-child(2) {
            width: 20px;
        }

        .btn-menu span:nth-child(3) {
            width: 15px;
        }
}
/** POPUP **/
.popup-wrapper {
    background-color: #fff;
    border-radius: 15px;
    color: #000;
    padding: 25px;
}
/** NOTI POPUP **/
.noti-container {
}

.noti-wrapper {
}

.noti-top {
    border-bottom: 1px solid #ccc;
    text-align: center;
    margin-bottom: 25px;
    padding-bottom: 10px;
    padding-top: 10px;
}

    .noti-top img { /*filter: brightness(0) */
    }

.noti-container ul {
    margin-bottom: 0;
}

.noti-bottom {
    text-align: center;
}

button.close.btn-not {
    text-align: center;
    float: none;
    font-size: 14px;
    color: #aaa;
}

    button.close.btn-not:hover {
        text-decoration: underline;
        color: #000;
        transform: none !important;
    }

/** button **/
button {
    margin: 5px;
}

.btn-login, .btn-register, .btn-lang {
}

.btn-login, .btn-register {
    font-size: 16px;
    display: block;
    padding: 8px 25px;
    font-weight: bold;
    border-radius: 10px;
}

.btn-login {
    color: #000;
    background: linear-gradient(180deg,#f7d53f 18.92%,#bd6728);
    box-shadow: 0 2px 30px rgba(244,209,91,.42), inset 0 2px 0 #ffedb6;
}

    .btn-login:hover {
    }

    .btn-login:active {
    }

.btn-register {
    background: linear-gradient(180deg,#DB0010,#A9000D);
    color: #fff;
    border: 1px solid #af0013;
    animation: blink2 1.5s infinite;
}

    .btn-register:hover {
        color: #fff;
        background-color: #666;
        border-color: #666;
    }

    .btn-register:active {
        color: #fff;
        background: linear-gradient(180deg,#59020e,#59020e);
        border-color: #59020e;
    }

    .btn-register:focus {
        color: #fff;
    }

@media screen and (max-width:550px) {
    .btn-login, .btn-register {
        padding: 12px 12px;
    }
}

/***************************************************************************** LANGUAGE */
.btn-lang {
    overflow: hidden;
    border-radius: 50%;
    border: 2px solid #fff;
}

    .btn-lang:hover {
        border-color: #fff;
    }

.modal-lang .modal-dialog {
}

.modal-lang button.close {
    opacity: 1;
}

.modal-lang .close span {
    color: #aaa;
    font-size: 40px;
    opacity: 1;
    text-shadow: none;
    font-weight: normal;
}

.lang-choose {
    text-align: center;
    display: flex;
    justify-content: center;
}

    .lang-choose img {
        max-width: 50px;
        display: block;
        margin: auto;
        margin-bottom: 5px;
        transition: transform 0.2s ease-in-out;
    }

    .lang-choose a {
        padding: 10px;
        margin: 10px;
        color: #666;
    }

        .lang-choose a:hover {
            color: #af0013;
        }

            .lang-choose a:hover img {
                /*transform: scale(1.2);*/
            }


/***************************************************************************** HEADER BOTTOM */
.header-bottom {
    padding-top: 10px;
    animation: shining 8s infinite;
    box-shadow: 1px 3px 20px -5px rgba(255, 251, 94, 0.5);
    -webkit-box-shadow: 1px 3px 20px -5px rgba(255, 251, 94, 0.5);
    -moz-box-shadow: 1px 3px 20px -5px rgba(255, 251, 94, 0.5);
}

.headerbottom-wrapper {
    max-width: 1500px;
    padding-left: 15px;
    padding-right: 15px;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.div-auth {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
}

@media screen and (min-width:1024px) {
    .header-bottom {
        background: linear-gradient(180deg,#E9D195,#8C713D);
        -webkit-box-shadow: 0 2px 6px 0 rgb(0 0 0 / 50%);
        box-shadow: 0 2px 6px 0 rgb(0 0 0 / 50%);
        border-bottom: 1px solid #373d4a;
    }
}

.headerbottom-wrapper {
    justify-content: space-between;
}


/*** float ***/
.divFloat img {
    background-color: #fff;
    padding: 3px;
}

.divFloat ul {
    margin-left: 0;
    margin-bottom: 0;
}

    .divFloat ul > li {
        list-style-type: none;
        padding: 0;
    }

        .divFloat ul > li > a {
            display: block;
            border-radius: 50%;
            overflow: hidden;
            width: 50px;
            margin: 5px;
            transition: transform 0.2s ease-in-out;
            animation: at-ripple-blue 1s linear infinite;
        }

            .divFloat ul > li > a:hover {
                transform: scale(1.1);
            }

            .divFloat ul > li > a > img {
                width: 100%;
            }

@media screen and (min-width:1024px) {
    .divFloat {
        position: fixed;
        right: 10px;
        top: 50%;
        z-index: 99;
    }

        .divFloat ul > li > a {
            box-shadow: 3px 3px 3px rgba(0,0,0,0.6);
        }
}

@media screen and (max-width:1023px) {
    .headerbottom-right {
        position: relative;
        z-index: 99;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
    }

    .divFloat ul {
        display: flex;
    }

        .divFloat ul > li > a {
            width: 35px;
        }
}

@media screen and (max-width:375px) {
    .divFloat {
        order: 2;
    }
}

/***************************************************************************** CSS MENU */
#cssmenu {
    font-family: Verdana, Geneva, sans-serif;
}

#divMenu {
}

    #divMenu.fade {
        transition: 0;
    }

#cssmenu {
    position: static;
}

    #cssmenu > ul {
        display: flex;
        white-space: nowrap;
        position: static;
    }

        #cssmenu > ul > li {
            float: none;
            position: static;
        }

            #cssmenu > ul > li > a {
                border: 0;
                position: static;
                padding: 5px 14px !important;
                text-align: center;
                font-size: 16px;
                color: #000;
                text-shadow: 0 1px 1px rgba(255,255,255,0.25);
                font-weight: bold;
            }

            #cssmenu > ul > li:hover > a {
                color: #000;
                border-bottom: 0px solid #333;
            }

            #cssmenu > ul > li.has-sub > a::after {
                display: none;
            }

    #cssmenu ul ul {
        left: 0 !important;
        right: 0;
        position: absolute;
        z-index: 99;
        max-width: 1500px;
        margin: auto;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        opacity: 0;
        visibility: hidden;
        -webkit-box-shadow: 0 2px 6px 0 rgb(0 0 0 / 50%);
        box-shadow: 0 2px 6px 0 rgb(0 0 0 / 50%);
        border-bottom: 1px solid #373d4a;
    }

    #cssmenu > ul > li:hover > ul, #cssmenu > ul > li > ul:hover {
        opacity: 1;
        visibility: visible;
    }

    #cssmenu ul ul:before {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100vw;
        background-color: rgba(0,0,0,0.7);
        margin: auto;
        margin-left: 50%;
        transform: translateX(-50%);
        backdrop-filter: blur(5px);
    }

    #cssmenu ul li:hover > ul > li {
        height: auto;
    }

    #cssmenu ul ul li {
        height: auto;
        margin-bottom: 10px;
    }

        #cssmenu ul ul li:hover {
            height: auto;
        }

        #cssmenu ul ul li a {
            width: auto;
            background-color: transparent;
        }

            #cssmenu ul ul li a:hover {
                background-color: transparent;
            }

        #cssmenu ul ul li:hover > a {
            background-color: transparent;
        }

    #cssmenu > ul > li.active > a {
        color: #000;
        border-bottom: 0px solid #e9d195;
    }

    #cssmenu > ul > li > a:hover {
        color: #000;
    }

        #cssmenu > ul > li > a:hover img, #cssmenu > ul > li.active > a img {
            /*filter: brightness(2);*/
        }

@media screen and (min-width:1250px) {
}

@media screen and (min-width:1024px) {
    #divMenu {
        display: block !important;
    }

    #btnMenu {
        display: none;
    }

    #cssmenu > ul {
        background-image: none !important
    }

        #cssmenu > ul > li > a > img {
            margin-left: auto;
            margin-right: 8px;
            margin-bottom: 10px;
            height: 35px;
        }

        #cssmenu > ul > li > ul {
            padding-bottom: 20px;
        }

            #cssmenu > ul > li > ul:hover:before {
                background-color: rgba(0,0,0,0.8);
            }

            #cssmenu > ul > li > ul > li a {
                text-align: center;
                font-weight: bold;
                padding: 10px
            }

            #cssmenu > ul > li > ul > li img {
                max-width: 160px;
                width: 100%;
                display: block;
                margin: auto;
                margin-bottom: 5px;
            }

            #cssmenu > ul > li > ul:hover img {
                filter: saturate(0.5);
            }

            #cssmenu > ul > li > ul > li > a:hover img {
                filter: saturate(1);
            }

            #cssmenu > ul > li > ul:hover a {
                color: #888;
            }

            #cssmenu > ul > li > ul a:hover {
                color: #fff;
            }


    #divMenu {
        display: block;
        position: static;
        opacity: 1;
        overflow: hidden !important;
    }

        #divMenu .modal-dialog {
            width: 100%;
            margin: 0;
            transition: none;
            transform: none;
            position: static;
        }

    .menuHeader {
        display: none !important;
    }
}

@media screen and (max-width:1500px) and (min-width:1249px) {
    #cssmenu > ul > li > a {
        /*font-size: 12px;*/
    }
}

@media screen and (max-width:1250px) and (min-width:1024px) {
    #cssmenu > ul > li > a {
        padding-left: 6px !important;
        padding-right: 6px !important;
        /*font-size: 10px;*/
    }

    .btn-login, .btn-register {
        font-size: 12px;
    }
}

@media screen and (max-width:1023px) {
    #divMenu {
        padding-left: 0 !important;
    }

    #menuContainer {
        width: 100%;
        margin: 0;
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        margin: 0;
        z-index: 1050;
        max-width: 250px;
        background-color: whitesmoke;
        overflow-y: auto;
        padding-bottom: 25px;
    }

    #cssmenu, #menuadd {
    }

        #cssmenu > ul {
            padding-top: 100px;
        }

        #cssmenu > ul, #menuadd > ul {
            display: block;
            padding-left: 15px;
            padding-right: 15px;
            margin: 0;
        }

        #menuadd > ul {
            margin-top: -10px;
        }

            #cssmenu > ul > li, #menuadd > ul > li {
                list-style-type: none;
                padding: 0;
            }

                #cssmenu > ul > li > a, #menuadd > ul > li > a {
                    text-transform: capitalize;
                    border-radius: 50px;
                    padding-top: 15px !important;
                    padding-bottom: 15px !important;
                    margin-top: 10px;
                    margin-bottom: 10px;
                    text-align: left;
                    padding-left: 25px !important;
                    color: #000;
                    display: block;
                }

                    #cssmenu > ul > li > a img, #menuadd > ul > li > a img {
                        height: 18px;
                        margin-right: 10px;
                    }

                #cssmenu > ul > li > ul, #menuadd > ul > li > ul {
                    display: none !important;
                }

                #cssmenu > ul > li:hover, #menuadd > ul > li:hover {
                }

                    #cssmenu > ul > li:hover a, #menuadd > ul > li:hover a {
                    }

    #divMenu .modal-dialog {
        transform: translate(-100%, 0);
        transition: 0.15s;
    }

    #divMenu.in .modal-dialog {
        transform: translate(0, 0);
    }

    .header-top {
        z-index: 109;
    }

    #divMenu {
        z-index: 108
    }

    .modal-backdrop--custom {
        /*z-index: 107;*/
        z-index: 5;
    }

    .modal-menu.fade .modal-dialog {
        -webkit-transform: translate3d(0, -25%, 0);
        transform: translate3d(0, -25%, 0);
    }

    .modal-menu.fade:not(.in) .modal-dialog {
        -webkit-transform: translate3d(-25%, 0, 0);
        transform: translate3d(-25%, 0, 0);
    }

    #divMenu .modal-dialog {
        transition: transform 0.15s, opacity 0s;
    }
}

@media screen and (max-width:767px) {
    #cssmenu > ul {
        padding-top: 125px;
    }
}

@media screen and (max-width:550px) {
    #cssmenu > ul {
        padding-top: 22vw;
    }
}

/***************************************************************************** FOOTER */
.footer-container {
    margin: 0 auto;
}

.footer-content {
    text-align: center;
}

@media screen and (max-width:767px) {
    .footer-content {
        padding-bottom: 30px;
    }

        .footer-content h4 + h2 {
            font-size: 1.0em;
        }
}

/*** footer ***/
.footer-info {
    margin-bottom: 50px;
}

.provider-container {
}

.plogo-box {
    margin-top: 40px;
}

.contact-list {
}

    .contact-list ul {
        margin: 0;
    }

        .contact-list ul > li {
            list-style-type: none;
            padding: 2px 0;
        }

            .contact-list ul > li a {
                text-decoration: underline;
                color: #fff;
            }

.social-list {
    display: flex;
}

.icn-social {
    display: block;
    padding: 5px;
    position: relative;
    margin: 5px;
}

    .icn-social:before {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        border-radius: 10px;
        background-color: #670210;
        transition: transform 0.4s ease-in-out;
        pointer-events: none;
    }

    .icn-social img {
        filter: grayscale(2) contrast(3) invert(1);
        transform: scale(0.7);
        transition: transform 0.2s ease-in-out;
    }

    .icn-social:hover:before {
        transform: scale(0);
        transition-duration: 0.2s;
    }

    .icn-social:hover img {
        filter: none;
        transform: scale(1.0)
    }

@media screen and (min-width:768px) {
    .footer-info {
        display: flex;
        padding-left: 20px;
        padding-right: 20px;
    }

    .footer-text {
        flex: 3;
        padding-right: 35px;
    }

    .footer-contact {
        flex: 2;
    }

    .footer-social {
        flex: 2;
    }

        .footer-contact h4, .footer-social h4 {
            margin-top: 20px;
        }
}

@media screen and (max-width:767px) {
    .footer-container {
        padding-bottom: 75px;
    }

    .footer-info {
        padding-left: 20px;
        padding-right: 20px;
    }

    .footer-contact, .footer-social {
        margin-top: 50px;
    }
}

/*** footer mobile ***/
.footer-mobile {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 99;
    background: #670210;
}

    .footer-mobile ul {
        margin-left: 0;
        margin-bottom: 0;
        display: flex;
        align-items: center;
    }

        .footer-mobile ul > li {
            list-style-type: none;
            padding: 0;
            flex: 1;
        }

            .footer-mobile ul > li > a {
                display: block;
                padding: 8px 0;
                text-align: center;
                color: #000;
                background: linear-gradient(180deg,#E9D195,#8C713D);
                font-size: 10px;
            }

            .footer-mobile ul > li:not(:first-child) {
                border-left: 0px solid #ddd;
            }

            .footer-mobile ul > li:not(:last-child) {
                border-right: 1px solid #333;
            }

            .footer-mobile ul > li > a img {
                display: block;
                margin: auto;
                margin-bottom: 10px;
                filter: brightness(2);
                max-height: 30px;
            }

            .footer-mobile ul > li > a:hover {
                background: #E9D195;
            }

/***************************************************************************** LOGIN */
.modal-login {
}

    .modal-login button.close {
        opacity: 1;
    }

    .modal-login .close span {
        color: #000;
    }

    .modal-login .modal-dialog {
        background-color: transparent;
        border-radius: 20px;
        padding: 15px;
    }

    .modal-login .login-title { /*display: none;*/
    }

.login-logo {
    text-align: center;
    background: linear-gradient(rgb(233, 209, 149), rgb(140, 113, 61));
}

    .login-logo img {
        max-width: 80%;
    }

.modal-login .div-login {
    padding: 0;
}

.modal-login .popup-wrapper {
    background-color: transparent;
    padding: 0;
    -webkit-box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
    -moz-box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
    box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
}

@media screen and (max-width:550px) {
    #loginModal {
        padding-left: 0 !important;
    }

        #loginModal .modal-dialog {
            padding: 0;
            border-radius: 0;
            margin: 0;
            height: 100%;
        }

    .modal-login button.close {
        padding: 20px;
    }

    #loginModal .div-login {
        border-radius: 0;
    }
}

.customform {
    padding: 5px 20px 20px 20px;
}

    .customform dd {
        text-align: center;
    }

    .customform input {
        width: 100%;
        border-radius: 6px;
        text-align: left;
        padding: 10px 25px;
        margin: 5px 0;
        color: #fff;
        background-color: #99999999;
    }

#customform_UserName {
}

#customform_Password {
}

#customform_UserName, #customform_Password {
}

#customform_submit {
    margin: 0 auto auto;
    font-weight: bold;
    transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
    width: auto;
    min-width: 100%;
    border-radius: 6px;
    text-align: center;
    font-size: 18px;
    /*color: #000;
    background: linear-gradient(180deg,#E9D195,#8C713D);*/
    color: #ddd;
    background: #000;
    border-radius: 10px;
    border: 2px solid #f5ea96;
}

    #customform_submit:hover {
        /*color: #000;
        background: linear-gradient(180deg,#8C713D,#8C713D);*/
        color: #ddd;
        background: #000;
        -webkit-box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
        -moz-box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
        box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
        border-radius: 10px;
    }

    #customform_submit:active {
        /*color: #000;
        background: linear-gradient(180deg,#8C713D,#8C713D);*/
        color: #ddd;
        background: #000;
        -webkit-box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
        -moz-box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
        box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
        border-radius: 10px;
    }

.form-title {
    margin: 5px;
    font-weight: bold;
    color: #fff;
    text-align: left;
}

.login-title {
    text-align: center;
}

.login-bottom {
    padding: 50px 0 50px;
    border-top: 1px solid #888;
    margin-left: 25px;
    margin-right: 25px;
    text-align: center;
    color: #888;
}

    .login-bottom a {
        border-radius: 6px;
        color: #fff;
        border: 1px solid #A9000D;
        display: inline-block;
        padding: 12px 40px;
        font-weight: bold;
        margin: 20px 0;
        background: linear-gradient(180deg,#DB0010,#A9000D);
    }

        .login-bottom a:hover {
            background-color: #000;
            color: #e5ba5d;
        }

#theme-contain-login {
    padding-bottom: 25px;
}

.div-login {
    max-width: 600px;
    margin: 0 auto;
    width: 100%;
    background-color: rgb(32, 32, 32);
    border-radius: 20px;
    padding: 0 20px;
}

.login-title {
    background: linear-gradient(rgb(233, 209, 149), rgb(140, 113, 61));
}


.customform input::-webkit-input-placeholder {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    -webkit-transition: .2s;
    transition: .2s;
}

.customform input::-moz-placeholder {
    transform: translateX(0px);
    -webkit-transition: .2s;
    transition: .2s;
}

.customform input:-ms-input-placeholder {
    transform: translateX(0px);
    -webkit-transition: .2s;
    transition: .2s;
}

.customform input::placeholder {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    -webkit-transition: .2s;
    transition: .2s;
}

.customform input:focus::-webkit-input-placeholder {
    -webkit-transition: .2s;
    transition: .2s;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
}

.customform input:focus::-moz-placeholder {
    -webkit-transition: .2s;
    transition: .2s;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    transition-timing-function: ease-in;
}

.customform input:focus:-ms-input-placeholder {
    -webkit-transition: .2s;
    transition: .2s;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    transition-timing-function: ease-in;
}

.customform input:focus::placeholder {
    -webkit-transition: .2s;
    transition: .2s;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
}



#redirectaddr {
    margin-bottom: 50px;
    text-align: center;
}

    #redirectaddr a {
        padding: 10px 25px;
        border-radius: 50px;
        border: 1px solid #e5ba5c;
        color: #fff;
        position: relative;
    }

        #redirectaddr a:hover {
            background-color: #e5ba5c;
            color: #000;
        }

        #redirectaddr a:after {
            content: '';
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            border: 1px solid #e5ba5c;
            border-radius: 50px;
            animation: myaddr 1s infinite ease-in-out;
            pointer-events: none;
        }

@keyframes myaddr {
    0% {
        opacity: 1;
        border-radius: 50px;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
    }

    100% {
        opacity: 0;
        border-radius: 50px;
        top: -20px;
        bottom: -20px;
        left: -20px;
        right: -20px;
    }
}


/***************************************************************************** REGISTER */
#theme-contain-registration {
    background-image: url(/data/2061/uploads/bg-12.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: -8px;
    padding-bottom: 30px;
    background-color: #000;
}

.reg-ad {
}

    .reg-ad img {
        max-width: 100%;
    }

.divRegister {
    display: flex;
}


@media screen and (min-width:1024px) {
    .ad-1 {
    }

    .ad-register {
        background: rgba(0,0,0,0.6);
        margin-top: 50px;
        margin: 50px auto 30px auto;
        max-width: 800px;
        border-radius: 6px;
        -webkit-box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
        -moz-box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
        box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
    }

    .ad-2 {
    }

    .divRegister {
        align-items: center;
    }
}

@media screen and (max-width:1023px) {
    .divRegister {
        flex-wrap: wrap;
        justify-content: center;
    }

    .ad-register {
        width: 100%;
        flex: 1 1 100%;
        padding-top: 25px;
    }

    .ad-1, .ad-2 {
        flex: 1 1 50%;
    }

    .ad-1 {
        padding-left: 15px;
    }

    .ad-2 {
        padding-right: 15px;
    }
}

@media screen and (max-width:767px) {
    .divRegister {
        flex-wrap: wrap;
        justify-content: center;
    }

    .ad-register {
        width: 100%;
        flex: 1 1 100%;
    }
}

.register-form {
}

#registerform {
    width: 100%;
    padding: 0px 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
}

    #registerform dl {
        margin: 5px auto;
        width: 100%;
        flex: 1 1 100%;
    }

    #registerform dt {
        width: 100%;
        color: #fff;
        font-size: 12px;
        margin-bottom: 5px;
        font-weight: normal;
    }

    #registerform dd {
        position: relative;
    }

    #registerform textarea, #registerform input[type=text], #registerform input[type=password] {
        width: 100%;
        color: #fff;
        font-size: 14px;
        padding: 10px 10px 10px 20px;
        background: #99999999;
        border: 0px solid #ddd;
        border-radius: 6px;
    }

        #registerform textarea:focus, #registerform input[type=text]:focus, #registerform input[type=password]:focus {
            border-color: #e5ba5d;
        }

#groupUsername dd {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

    #groupUsername dd #registerform_UserName {
        width: auto;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    #groupUsername dd #registerform_UserNameMsg {
        width: 100%;
        color: #e5ba5d;
    }

#groupUsername .icnR {
    top: 5px;
}

#registerform input.btnCheckUser {
    margin-top: 0;
    margin-bottom: 0; /*margin-left: 15px;*/
    padding: 10px 20px; /*max-width: calc(40% - 15px);*/
    font-size: 12px;
    cursor: pointer;
    margin-left: 10px;
}

#registerform_Currency {
    border: 0px solid;
    width: 100%;
    color: #fff;
    font-size: 14px;
    padding: 10px 10px 10px 20px;
    background-color: #fff;
    border-bottom: 1px solid #aaa;
    background: #99999999;
    border-radius: 6px;
}

#registerform #registerform_varifycode {
    width: calc(100% - 115px);
    float: left;
}

#registerform .btnCheckUser {
    color: #000;
    font-weight: bold;
    border: 1px solid #e5ba5d;
    padding: 8px 12px;
    font-size: 14px;
    text-transform: uppercase;
    margin: 6px 0;
    background-color: #e5ba5d;
}

#registerform_btnSubmit {
    font-weight: bold;
    padding: 8px 12px;
    font-size: 14px;
    text-transform: uppercase;
    margin: 6px 0;
    border-radius: 6px !important;
    background: linear-gradient(180deg,#DB0010,#A9000D);
    color: #fff;
    border: 1px solid #af0013;
    width: 100%;
}

    #registerform .btnCheckUser:hover, #registerform_btnSubmit:hover {
        background-color: #f2cc7c;
    }

    #registerform .btnCheckUser:active, #registerform_btnSubmit:active {
        border-radius: 6px;
        background: linear-gradient(180deg,#DB0010,#A9000D);
        color: #fff;
        border: 1px solid #af0013;
    }

#groupSubmit {
    text-align: center;
}

#registerform_btnSubmit {
    padding: 15px 75px;
    cursor: pointer;
    border-radius: 15px;
}

#registerform:after {
    font-size: 10px;
    color: #fff;
}

#groupVerifyCode dd:last-child {
    position: static;
}

#groupVerifyCode img {
    margin-left: 15px;
}

input::-webkit-input-placeholder {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    -webkit-transition: .4s;
    transition: .4s;
}

input::-moz-placeholder {
    transform: translateX(0px);
    -webkit-transition: .4s;
    transition: .4s;
}

input:-ms-input-placeholder {
    transform: translateX(0px);
    -webkit-transition: .4s;
    transition: .4s;
}

input::placeholder {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    -webkit-transition: .4s;
    transition: .4s;
}

input:focus::-webkit-input-placeholder {
    -webkit-transform: translateX(200px);
    transform: translateX(200px);
    -webkit-transition: .4s;
    transition: .4s;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
}

input:focus::-moz-placeholder {
    transform: translateX(200px);
    -webkit-transition: .4s;
    transition: .4s;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    transition-timing-function: ease-in;
}

input:focus:-ms-input-placeholder {
    transform: translateX(200px);
    -webkit-transition: .4s;
    transition: .4s;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    transition-timing-function: ease-in;
}

input:focus::placeholder {
    -webkit-transform: translateX(200px);
    transform: translateX(200px);
    -webkit-transition: .4s;
    transition: .4s;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
}

input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0px 1000px #fcffd3 inset;
}

.small {
    font-size: 12px;
}

.w3-text-red {
    color: #ff5858;
}

.divRegister-box {
    background-color: #fff;
}

.img-register {
    overflow: hidden;
}

.register-box-wrapper > .right {
}

.register-logo {
    position: absolute;
    bottom: 15px;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 9;
}

    .register-logo img {
        height: 100px;
        display: block;
        margin: auto;
    }

#groupAffiliate {
    max-width: 100% !important;
    padding-right: 0 !important;
}

#registerform_FullNameDescription {
    color: #ff5858;
    padding-top: 5px;
}

@media screen and (max-width: 1024px) {
    #registerform {
        padding: 0 25px 25px;
    }
}

@media screen and (min-width: 768px) {
    #groupPassword, #groupComfirmPassword, #groupMobileNumber, #groupCurrency, #groupAffiliate, #groupReferralCode {
        flex: 1 1 50%;
        max-width: 50%;
    }

    #groupPassword, #groupAffiliate {
        padding-right: 15px;
    }

    #groupComfirmPassword, #groupMobileNumber, #groupReferralCode {
        padding-left: 15px;
    }
}

@media screen and (min-width: 767px) {
    .imgRegister-window {
        margin-left: 50%;
        transform: translateX(-50%);
    }

    .note {
        font-size: 11px;
        width: 550px;
    }

    .small {
        font-size: 11px;
    }
}

@media screen and (max-width: 766px) {
    .modal-register .modal-content {
        border: 0;
        border-radius: 0;
    }

    .registration-wrapper {
        padding: 0;
    }

    .divRegister-box {
        padding: 0;
    }

    .register-box-wrapper {
        border-radius: 0;
    }

    .register-logo {
        top: auto;
        left: 10px;
        right: auto;
    }

        .register-logo img {
            height: 50px;
        }

    .div-register {
        border-radius: 0;
        margin: 0;
    }
}

@media screen and (max-width: 768px) and (min-width:608px) {
    #registerform {
        flex-wrap: wrap;
        flex-direction: row;
    }

    #registerform_btnSubmit {
        padding: 15px 35px;
    }

    .note {
        position: absolute;
        width: 535px;
        font-size: 11px;
    }

    .small {
        font-size: 11px;
    }
}

@media screen and (max-width: 766px) {
    #registerform {
    }

        #registerform .btnCheckUser {
            font-size: 3vw;
        }

    #registerform_btnSubmit {
        margin: 25px auto 0;
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }

    #groupUsername dd #registerform_UserName {
        width: 100%;
    }

    #groupPassword {
        position: relative;
    }

    #registerform_Password:focus {
        margin-bottom: 37px;
    }

        #registerform_Password:focus + .note {
            display: block;
            margin-top: -37px;
        }

    #registerform input.btnCheckUser {
        font-size: 10px;
    }

    .register-logo {
        display: none;
    }
}


/***************************************************************************** BODY */
.divBanner-sub img {
    width: 100%;
}

.desktopview {
}

.mobileview {
    display: none;
}
/*** home banner ***/
.divBanner {
    background-position: center;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

    .divBanner:before {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        pointer-events: none;
        background-image: url('/data/2061/uploads/bg-banner3.png');
        background-size: auto 100%;
        background-repeat: no-repeat;
        background-position: center;
        animation: mybg 5s infinite cubic-bezier(0.4, 0, 0.2, 1);
    }

    .divBanner:after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 100px;
        margin: auto;
        background: linear-gradient(to bottom, #000, rgba(0,0,0,0.0));
        pointer-events: none;
    }

    .divBanner img {
        width: 100%;
    }

#mainslider {
    margin-bottom: 0;
    padding-top: 0;
    -webkit-box-shadow: 0 2px 6px 0 rgb(0 0 0 / 50%);
    box-shadow: 0 2px 6px 0 rgb(0 0 0 / 50%);
    border-bottom: 1px solid #373d4a;
}

.flexslider {
    background-color: transparent;
    border: 0;
    margin: 0;
}

.flex-direction-nav {
    height: 0;
    list-style-type: none;
}

    .flex-direction-nav, .flex-direction-nav li {
        padding: 0;
        list-style-type: none;
    }

.banner-btns { /* padding-top: 40px; padding-bottom: 40px;*/
    text-align: center;
    display: table;
    margin: auto;
}

.bannerbtns-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 20px auto 40px;
}

.btn-banner {
    margin: 10px;
}

.btn-banner {
    border-radius: 2vw;
    overflow: hidden;
    display: block;
    transition: transform 0.2s ease-in-out;
    animation: myshine 2s infinite;
}

    .btn-banner img {
        max-width: 100%;
    }

.bannerbtns-wrapper:hover .btn-banner {
    animation: none;
}

.btn-banner:hover {
    transform: scale(1.1);
    animation: myshine 1s infinite !important;
}

.btn-banner:focus {
    transform: scale(1.05);
}

.btn-banner:active {
    transform: scale(1.0);
    transition: transform 0s;
}

@keyframes myshine {
    0%, 100% {
        filter: brightness(1);
    }

    50% {
        filter: brightness(2);
    }
}

@keyframes mybg {
    0%, 100% {
        opacity: 0.2;
    }

    50% {
        opacity: 1;
    }
}


@media screen and (min-width:1024px) {
    .divBanner:after {
        height: 250px;
    }

    .divBanner {
        margin-top: -142px;
        padding-top: 130px;
    }

    .header-bottom {
        position: relative;
        z-index: 98;
        margin-top: -30px;
    }
}

@media screen and (max-width:1023px) {
    .divBanner {
        margin-top: -10vw;
        padding-top: 10vw;
    }

    .div-auth {
        position: relative;
        z-index: 99;
    }
}

@media screen and (max-width:768px) {
    .divBanner {
        margin-top: -12vw;
        padding-top: 12vw;
    }
}

@media screen and (max-width:767px) {
    .divBanner {
        margin-top: -15vw;
        padding-top: 15vw;
    }

    .bannerbtns-wrapper {
        margin: 10px auto 20px;
        padding: 0 25px;
    }
}




/*** home slide ***/
.divBanner {
    /* -webkit-box-shadow: 0 2px 6px 0 rgb(0 0 0 / 50%);
    box-shadow: 0 2px 6px 0 rgb(0 0 0 / 50%);*/
    -webkit-box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
    -moz-box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
    box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
}

.divHome-slide {
}

.slide-content {
    display: flex;
    padding: 20px;
}

    .slide-content > div {
    }

    .slide-content img {
        max-width: 100%;
    }

.slide-fix {
    width: 40%;
}

.slide-scroll {
    width: 60%;
}

.slide-box {
    overflow: hidden;
    border-radius: 15px;
    display: block;
}

    .slide-box:hover:after {
        content: '';
        position: absolute;
        top: 2px;
        bottom: 2px;
        left: 2px;
        right: 2px;
        margin: auto;
        border: 3px solid #c9a448;
        border-radius: 13px;
        outline: 2px solid #ffec85;
        pointer-events: none;
    }


@media screen and (max-width:1023px) {
    .slide-fix {
        width: 25%;
    }

    .slide-scroll {
        width: 60%;
    }
}

@media screen and (max-width:600px) {
    .slide-content {
        padding-right: 0px;
    }

    .slide-fix {
        width: 41%;
    }

    .slide-scroll {
        width: 90%;
    }
}

/*** home event ***/
.divHome-event {
}

.event-content {
    position: relative;
    padding: 25px 50px;
}

    .event-content .event-prev {
        background-image: url('/data/2058/uploads/btn-swiper-prev.png');
        left: 5px;
    }

    .event-content .event-next {
        background-image: url('/data/2058/uploads/btn-swiper-next.png');
        right: 5px;
    }

    .event-content .event-prev, .event-content .event-next {
        background-size: 30% auto;
        width: 30px;
        height: 30px;
        border-radius: 50%;
        background-color: #4d4d4da6
    }

.event-container {
}

.event-box {
    border: 1px solid #b30014;
    border-radius: 15px;
    padding: 10px;
    background-image: url('/data/2058/uploads/bg-red.png');
}

    .event-box:hover {
        border-color: #f4be13;
    }

.event-top {
    display: flex;
    justify-content: space-between;
    margin-bottom: 15px;
}

    .event-top img {
        margin: 5px;
        height: 15px;
        vertical-align: auto;
    }

.event-players {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin-bottom: 10px;
}

.event-player img {
    display: block;
    margin: auto;
    margin-bottom: 10px;
    border: 1px solid #fff;
    border-radius: 6px;
}

.event-vs {
    padding: 0 10px;
    margin-bottom: 10px;
}

@media screen and (max-width:1024px) {
    .event-content {
        padding: 20px;
    }

        .event-content .event-prev, .event-content .event-next {
            display: none;
        }
}

@media screen and (max-width:676px) {
    .event-content {
        padding: 15px;
    }

    .event-top {
        font-size: 3vw;
    }

        .event-top img {
            margin: 3px;
        }
}

/*** home mobile product ***/
.home-sc {
    margin: 40px 0;
}

.m_prod-tab {
    overflow-x: auto;
}

    .m_prod-tab ul {
        padding: 5px 0;
        margin: 0;
        display: flex;
    }

        .m_prod-tab ul > li {
            list-style-type: none;
            padding: 0;
            height: 100%;
        }

.btn-prod_m {
    display: block;
    padding: 15px 15px;
    border-radius: 10px;
    background: rgb(100, 100, 100);
    color: #cdcdcd !important;
    text-align: center;
    white-space: nowrap;
    margin: 5px;
}

    .btn-prod_m.active {
        background: linear-gradient(rgb(233, 209, 149), rgb(140, 113, 61));
        color: #333 !important;
    }

    .btn-prod_m img {
        display: block;
        margin: auto;
        margin-bottom: 10px;
        ;
        filter: brightness(2);
    }

.m_prod-tab::-webkit-scrollbar {
    width: 3px;
    height: 3px;
}

.m_prod-tab::-webkit-scrollbar-button {
    width: 0px;
    height: 0px;
}

.m_prod-tab::-webkit-scrollbar-thumb {
    background: #333;
    border: 0px none #ffffff;
    border-radius: 50px;
}

    .m_prod-tab::-webkit-scrollbar-thumb:hover {
        background: #333;
    }

    .m_prod-tab::-webkit-scrollbar-thumb:active {
        background: #333;
    }

.m_prod-tab::-webkit-scrollbar-track {
    background: #000;
    border: 0px none #ffffff;
    border-radius: 50px;
}

    .m_prod-tab::-webkit-scrollbar-track:hover {
        background: #000;
    }

.m_prod-tab::-webkit-scrollbar-corner {
    background: transparent;
}


.m_prod-box {
    display: none;
}

    .m_prod-box.active {
        display: block;
    }

    .m_prod-box ul {
        display: flex;
        flex-wrap: wrap;
        margin: 0;
        padding-top: 20px;
    }

        .m_prod-box ul > li {
            padding: 0;
            list-style-type: none;
        }

    .m_prod-box button {
        background: transparent !important;
        border: 0;
        padding: 3px;
    }

    .m_prod-box img {
        width: 100%;
    }

@media screen and (min-width:1024px) {
    .m_prod-box ul > li {
        flex: 1 1 25%;
        max-width: 25%;
    }
}

@media screen and (max-width:1023px) {
    .m_prod-box ul > li {
        flex: 1 1 33.33%;
        max-width: 33.33%;
    }
}

@media screen and (max-width:599px) {
    .m_prod-box ul > li {
        flex: 1 1 33.33%;
        max-width: 33.33%;
    }

    .btn-prod_m {
        font-size: 10px;
    }
}

/*** home production ***/
.divHome-prod {
    padding: 20px 0;
}

.prod-container {
    padding-left: 15px;
    padding-right: 15px;
}

.title-main {
    text-align: center;
    position: relative;
}

    .title-main h1:before,
    .title-main h1:after {
        content: "";
        display: block;
        position: absolute;
        max-width: 460px;
        height: 21px;
        top: 10px;
        background-size: auto 100%;
        width: 50vw;
        pointer-events: none;
    }

    .title-main h1:before {
        background-image: url(/data/2061/uploads/titleset-left@2x.png);
        background-position: right center;
    }

    .title-main h1:after {
        right: 0;
        background-image: url(/data/2061/uploads/titleset-right@2x.png);
        background-position: left center;
    }

.prod-btn-container > .inner {
    display: flex;
    align-items: center;
    justify-content: center;
}

.prod-btn-container .btn-prod {
    flex: 1;
    margin: 10px;
    text-align: center;
    padding: 2px;
    font-weight: bold;
    cursor: pointer;
    border: 0.03rem solid #333;
    border-bottom-left-radius: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgb(32, 32, 32);
    position: relative;
}

    .prod-btn-container .btn-prod:hover {
    }

    .prod-btn-container .btn-prod.active {
        text-shadow: 0 0 5px #fff;
        background-color: #a90014;
        color: #fff;
    }

    .prod-btn-container .btn-prod img {
        margin-right: 5px;
        width: 100%;
    }

    .prod-btn-container .btn-prod > div {
        position: absolute;
        bottom: 10px;
    }

    .prod-btn-container .btn-prod .icn-prod {
        display: inline-block;
        margin-right: 14px;
        height: 28px;
        width: 28px;
        background-image: url('/data/2058/uploads/sprite7.png');
        background-size: 606px 44px;
    }

        .prod-btn-container .btn-prod .icn-prod.sport {
            background-position: -456px 0px;
        }

    .prod-btn-container .btn-prod.active .icn-prod.sport, .prod-btn-container .btn-prod:hover .icn-prod.sport {
        background-position: -494px -3px;
    }

    .prod-btn-container .btn-prod .icn-prod.casino {
        background-position: -152px 0px;
    }

    .prod-btn-container .btn-prod.active .icn-prod.casino, .prod-btn-container .btn-prod:hover .icn-prod.casino {
        background-position: -188px -3px;
    }

    .prod-btn-container .btn-prod .icn-prod.poker {
        background-position: -76px 0px;
    }

    .prod-btn-container .btn-prod.active .icn-prod.poker, .prod-btn-container .btn-prod:hover .icn-prod.poker {
        background-position: -116px -3px;
    }

    .prod-btn-container .btn-prod .icn-prod.games {
        background-position: -228px 0px;
    }

    .prod-btn-container .btn-prod.active .icn-prod.games, .prod-btn-container .btn-prod:hover .icn-prod.games {
        background-position: -266px -3px;
    }

    .prod-btn-container .btn-prod .icn-prod.lottery {
        background-position: -304px 0px;
    }

    .prod-btn-container .btn-prod.active .icn-prod.lottery, .prod-btn-container .btn-prod:hover .icn-prod.lottery {
        background-position: -342px -3px;
    }

    .prod-btn-container .btn-prod .icn-prod.jackpot {
        background-position: -380px 0px;
    }

    .prod-btn-container .btn-prod.active .icn-prod.jackpot, .prod-btn-container .btn-prod:hover .icn-prod.jackpot {
        background-position: -417px -3px;
    }

.prod-main-container {
    margin: 25px 0;
    position: relative;
}

.prod-box {
    display: flex;
    align-items: stretch;
    justify-content: center;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    pointer-events: none;
    overflow: hidden;
}

    .prod-box.active {
        opacity: 1;
        position: relative;
        z-index: 2;
        pointer-events: auto;
    }

    .prod-box > div {
        overflow: hidden;
        flex: 1;
        transition: transform 1s ease-in-out, opacity 1s ease-in-out;
        opacity: 0;
    }

        .prod-box > div.left {
            transform: translateX(-50px);
        }

        .prod-box > div.right {
            transform: translateX(50px);
        }

    .prod-box.active > div {
        opacity: 1;
    }

        .prod-box.active > div.left {
            transform: translateX(0);
        }

        .prod-box.active > div.right {
            transform: translateX(0);
        }

    .prod-box.unactive {
        opacity: 1;
    }

        .prod-box.unactive > div.left {
            transform: translateX(-50px);
        }

        .prod-box.unactive > div.right {
            transform: translateX(50px);
        }

    .prod-box > div.right {
        padding-left: 20px;
    }

.prod-detail {
    display: flex;
    flex-direction: column;
}

.prod-box .img {
    text-align: center;
    position: relative;
}

    .prod-box .img img {
        width: 100%;
        max-width: 500px;
        z-index: 2;
        position: relative;
    }

        .prod-box .img img.float {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            z-index: 3;
            margin: auto;
            animation: myFloat 3s ease-in-out infinite;
            pointer-events: none;
        }

.prod-top {
    margin-top: 25px;
}

.prod-box .img:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-image: url('/data/2058/uploads/logo-m77top.png');
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 80% auto;
}

.prod-top .title {
    font-size: 40px;
    margin-bottom: 0;
}

.prod-top .sub-title {
    font-size: 14px;
    color: #aaa;
}

.prod-top .prod-text {
    font-size: 16px;
    margin-top: 25px;
    line-height: 1.5em;
    color: #fff;
    font-weight: normal;
}

.prod-logo {
    margin: 25px 0;
}

.prod-btn {
}

    .prod-btn a {
        display: table;
        padding: 8px 25px;
        background-color: #af0013;
        border: 2px solid #af0013;
        font-weight: bold;
        color: #fff;
        border-bottom-left-radius: 10px;
    }

        .prod-btn a:hover {
            background-color: #fff;
            color: #af0013;
        }

.owl-logo.owl-carousel .owl-item {
    padding: 5px;
}

.owl-carousel .owl-item img {
    display: block;
    width: 100%
}

@keyframes myFloat {
    0%, 100% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-10px);
    }
}

@media screen and (max-width: 1200px) {
    .prod-btn-container .btn-prod {
        margin: 10px 5px;
    }

    .title-main h1:before, .title-main h1:after {
        width: 30vw;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .prod-container {
        display: flex;
        align-content: stretch;
    }

        .prod-container > div {
            overflow: hidden;
        }

    .prod-btn-container {
        flex: 1;
        margin-top: 25px;
    }

    .prod-main-container {
        flex: 4;
        margin-top: 0;
    }

    .prod-btn-container > .inner {
        flex-direction: column;
    }

    .prod-btn-container .btn-prod {
        width: 100%;
    }

    .prod-box {
        flex-direction: column;
    }

    .prod-top {
        margin-top: 0;
        text-align: center;
    }

    .prod-btn a {
        margin: auto;
    }
}

@media screen and (max-width: 767px) {
    .title-main h1:before, .title-main h1:after {
        width: 10vw;
    }

    .prod-btn-container > .inner {
        flex-wrap: wrap;
    }

    .prod-btn-container .btn-prod {
        flex: 1 1 31%;
        max-width: 31%;
        margin: 1%;
        font-size: 11px;
    }

        .prod-btn-container .btn-prod img {
            display: block;
            margin: 5px auto 0;
        }

    .prod-box > div.left {
        transform: translateY(0);
    }

    .prod-box > div.right {
        transform: translateY(0);
    }

    .prod-box.active > div.left {
        transform: translateY(0);
    }

    .prod-box.active > div.right {
        transform: translateY(0);
    }

    .prod-box.unactive > div.left {
        transform: translateX(0px) translateY(50px);
    }

    .prod-box.unactive > div.right {
        transform: translateX(0px) translateY(-50px);
    }

    .prod-box > div.right {
        padding-left: 20px;
        padding-right: 20px;
    }

    .prod-box {
        flex-direction: column;
    }

    .prod-top {
        margin-top: 0;
        text-align: center;
    }

    .prod-btn a {
        margin: auto;
    }

    .prod-box .img {
        padding-left: 25px;
        padding-right: 25px;
    }
}

/*** home download ***/
.title-main p {
    padding-left: 15px;
    padding-right: 15px;
}

.divHome-download {
    margin-bottom: 50px;
}

.download-container {
    margin-top: 20px;
    margin-bottom: 40px;
}

.download-img {
    text-align: center;
}

    .download-img img {
        max-width: 100%;
    }

.download-qr {
    display: flex;
}

.qr-box {
    background-color: #fff;
    flex: 1;
    margin: 10px;
    border-radius: 15px;
    padding: 10px;
}

    .qr-box h4 {
        margin-top: 10px;
        margin-left: 10px;
        margin-bottom: 5px;
        color: #cc2366;
    }

.qr-info {
    display: flex;
    color: #000;
}

    .qr-info img {
        max-width: 100%;
    }

.qr-detail {
    padding: 5px 15px;
}

    .qr-detail b {
        font-size: 18px;
        margin-bottom: 10px;
    }

    .qr-detail p {
        color: #aaa;
        margin-top: 10px;
    }

    .qr-detail a {
        display: table;
        margin-top: auto;
        background-color: #af0013;
        padding: 7px 10px;
        color: #fff;
        font-size: 12px;
        font-weight: bold;
        border-bottom-left-radius: 10px;
        border-top-right-radius: 10px;
    }

        .qr-detail a:hover {
            background-color: #666;
        }

.download-benefit {
    display: flex;
    justify-content: center;
    margin-top: 10px;
    margin-bottom: 20px;
}

.app-info {
    flex: 1;
    position: relative;
    text-align: center;
    margin: 10px;
}

.app-bg {
    position: absolute;
    z-index: -1;
    bottom: -20px;
    left: 0px;
    right: 0px;
    max-width: 200px;
    max-height: 200px;
    width: 20vw;
    height: 20vw;
    margin: auto;
    border-radius: 50%;
    border: 1px solid #941a1d;
}

.app-img {
    max-width: 150px;
    width: 10vw;
    animation: mydownload 2s ease-in-out infinite;
}

.app-text {
    text-shadow: 2px 2px 3px rgba(0,0,0,0.8);
}

    .app-text h1 {
        margin-top: 10px;
        color: #f4be13;
    }

@media screen and (max-width:1200px) and (min-width:1023px) {
    .download-infomation {
        flex: 4;
    }

    .download-img {
        flex: 2;
    }
}

@media screen and (min-width:1024px) {
    .download-container {
        display: flex;
        justify-content: center;
        align-items: center;
    }
}

@media screen and (max-width:1023px) {
    .download-img {
        margin-top: 20px;
        padding: 15px;
    }

    .download-benefit {
        margin-top: 40px;
        margin-bottom: 0;
    }

    .app-info {
        transform: translateY(5vw);
        margin: 0;
    }

        .app-info:nth-child(2) {
            transform: translateY(0);
        }
}

@media screen and (max-width:767px) {
    .download-qr {
        display: block;
    }

    .app-bg {
        width: 28vw;
        height: 28vw;
        max-width: 150px;
        max-height: 150px;
    }
}

@media screen and (max-width:500px) {
    .app-text {
        font-size: 9px;
    }

        .app-text h1 {
            font-size: 22px;
        }
}

@keyframes mydownload {
    0%, 100% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-10px);
    }
}

/*** home info ***/
.info-container {
}

    .info-container > ul {
        margin: 0;
    }

.product, .services, .bank {
    list-style: none;
    background: #6d0510;
    padding: 20px 20px;
    min-height: 450px;
    text-align: left;
    vertical-align: top;
    border-bottom-left-radius: 20px;
}

.info-container > ul > li > ul > li {
    list-style: none;
    margin: 10px 0;
}

.info-container .carousel {
    min-height: 490px;
}

.info-container .item > ul > li {
    margin: 10px 0;
    list-style-type: none;
}

.info-container .carousel-indicators .active {
    background-color: #f4be13;
    border: none;
}

.item ul {
    margin-left: 0;
}

.item li {
    list-style-type: none;
}

.info .carousel-indicators li {
    background-color: #fff;
    margin-right: 8px;
    width: 12px;
    height: 12px;
}

.carousel li {
    margin-right: 5px !important;
}

.top {
    font-size: 40px;
    border-bottom: 1px dotted #eee;
    color: #f4be13;
    margin-bottom: 10px;
    padding-bottom: 10px;
}

.product .bigText, .services .bigText, .bank .bigText {
    font-size: 20px;
    color: #fff;
}

.product .smallText, .services .smallText, .bank .smallText {
    font-size: 12px;
    color: #dfb6bf;
}

.mins {
    float: right;
}

.services ul li:nth-child(3) div {
    display: inline-block;
    vertical-align: middle;
    margin: 10px 0;
}

.services ul li:nth-child(3) > div:nth-child(3) {
    margin-left: 25px;
    ;
    vertical-align: middle;
}

    .services ul li:nth-child(3) > div:nth-child(3) .bigText {
        font-size: 40px;
    }

.services .progress {
    background: #fff;
    padding: 3px;
    border-radius: 50px;
}

.services .progress-bar {
    background: #f4be13;
    border-radius: 50px;
}

.services .dpBar {
    width: 10%;
}

.services .wdBar {
    width: 30%;
}

.bank ul {
    margin-left: 0;
}

    .bank ul > li {
        list-style: none;
    }

.bank .listStyle li {
    list-style: disc !important;
    margin: 20px 25px !important;
}

.bank ul > li > ul > li {
    margin: 20px 25px;
}

.bank img {
    transition: 0.2s;
    filter: grayscale(1);
    max-width: 100%;
}

    .bank img:hover {
        filter: grayscale(0);
    }

@media screen and (min-width:1024px) {
    .info-container > ul {
    }
}

@media screen and (max-width:676px) {
    .product, .services, .bank {
    }

        .bank img {
            filter: grayscale(0);
        }
}


/*** home text ***/
.divHome-text .row {
    padding-left: 15px;
    padding-right: 15px;
}

.mt-4 {
    background-color: transparent;
    color: #eb2e42 !important;
    font-size: 22px;
    font-weight: bold;
    text-align: center;
    margin: 20px auto;
    display: block;
}

@media screen and (max-width:1200px) {
    .divHome-text {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
}

@media screen and (max-width:767px) {
    #aboutCollapse {
        display: block;
        font-size: 11px;
    }

        #aboutCollapse h2 {
            font-size: 1.5em;
        }
}

/************************ GAMES LIST ************************/
.gl-tabgames {
    position: relative;
    -webkit-box-shadow: 0 2px 6px 0 rgb(0 0 0 / 50%);
    box-shadow: 0 2px 6px 0 rgb(0 0 0 / 50%);
    border-bottom: 1px solid #373d4a;
    background: rgb(32, 32, 32);
    margin-top: 30px;
}

.gl-box {
    background: rgb(32, 32, 32);
}

.btn-gl {
    text-align: center;
    color: #888;
    padding: 15px 0 15px;
    background-color: transparent;
    cursor: pointer;
    position: relative;
    margin: 0;
}

    .btn-gl.active {
        background-color: #000;
        color: #fff;
        border-bottom: 2px solid #e9d195;
    }

    .btn-gl img {
        height: 16px;
        margin-top: -10px;
    }

.gl-box-wrapper {
    display: flex;
    flex-wrap: wrap;
    padding: 5px;
}

.gl-item {
    position: relative;
    flex: 1 1 calc(16.66% - 20px);
    text-align: center;
    margin: 5px 10px 10px;
    max-width: calc(16.66% - 20px);
    font-size: 12px;
    border: 1px solid #373d4a;
    background: #333;
}

    .gl-item:hover {
        filter: brightness(1) drop-shadow(0 0 4px rgba(203, 182, 152, 1));
    }

    .gl-item img {
        vertical-align: middle;
        width: 100%;
    }

.item-img {
    position: relative;
    margin-bottom: 5px;
}

.gl-hover {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0,0,0,0.6);
    opacity: 0;
    transition: opacity 0.1s ease-in-out;
    display: flex;
}

.gl-item:hover .gl-hover {
    opacity: 1;
}

.gl-detail {
    transform: translateY(20px);
    transition: transform 0.2s ease-in-out;
    color: #fff;
    margin: auto;
}

.gl-item:hover .gl-detail {
    transform: translateY(0px);
}

.gl-item h1 {
    font-size: 20px;
}

.gl-item .btn-login {
    background-color: #af0013;
    color: #fff;
    text-shadow: 1px 1px 3px #222;
    margin-top: 10px;
}

    .gl-item .btn-login:hover {
        background-color: #666;
        border-color: #666;
    }


.gl-next, .gl-prev {
    top: 0;
    bottom: 0;
    margin: auto;
    background-size: 27px 27px;
    width: 35px;
    background-image: none !important;
    height: auto;
}

    .gl-next:after {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 7.5px 0px 7.5px 10px;
        border-color: transparent transparent transparent #aaaaaa;
    }

    .gl-prev:after {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 7.5px 10px 7.5px 0px;
        border-color: transparent #aaaaaa transparent transparent;
    }

.gl-btnShow {
    display: flex;
    justify-content: center;
    padding-bottom: 15px;
}

.btn-show {
    margin: 10px 5px;
    display: table;
    padding: 8px 20px;
    border-radius: 30px;
    background-color: #222;
    border: 1px solid #c78d2a;
    font-size: 16px;
    color: #fff;
    cursor: pointer;
}

    .btn-show:hover {
        background-color: #c78d2a;
    }

@media screen and (min-width: 1024px) {
    .gl-prev, .gl-next { /*display: none;*/
    }

    .gl-tab {
        max-width: 93%;
    }

    .btn-gl {
        font-size: 18px;
    }
}

@media screen and (max-width: 1024px) {
    .gl-item {
        flex: 1 1 calc(25% - 20px);
        max-width: calc(25% - 20px);
    }
}

@media screen and (max-width: 1023px) {
    .gl-tab {
        max-width: 85%;
    }

    .gl-item h1 {
        font-size: 16px;
        margin-top: 0px;
    }
}

@media screen and (max-width: 768px) {
    .gl-item {
        flex: 1 1 calc(25% - 10px);
        max-width: calc(25% - 10px);
        margin: 5px 5px 10px
    }
}

@media screen and (max-width: 767px) {
    .gl-item {
        flex: 1 1 calc(33% - 10px);
        max-width: calc(33% - 10px);
        font-size: 9px;
    }

    .gl-tab {
        max-width: calc(100% - 70px);
    }

    .btn-gl {
        font-size: 2.5vw;
    }

    .gl-prev {
        left: 0;
    }

    .gl-next {
        right: 0;
    }
}

/************************ GAMES LIST ************************/
.gamelist {
    display: block;
    margin: 20px auto 25px;
}

.gamelist-right {
    width: 100%;
}

.gamelist-left > div {
    background-color: #63543c;
    padding: 2px;
}

.gamelist-title {
    font-size: 16px;
    font-weight: bold;
    padding: 10px 5px;
    text-transform: capitalize;
}

    .gamelist-title img {
        width: 25px;
        margin: 0 10px;
    }

.gamelist-slide img {
    width: 100%;
}

.gamelist-right .list {
    padding-top: 2%;
    font-size: 0;
}

.btn {
    border: 0px solid transparent;
}

.imgItem {
    width: 48%;
    margin: 5% 1% 1%;
    display: inline-block;
    border: 1px solid #af0013;
    background-size: 100% 100%;
    position: relative;
    text-align: center;
    border-radius: 15px;
}

    .imgItem img.logo {
        position: absolute;
        top: 10px;
        height: 5vw;
        max-height: 50px;
        left: 10px;
        margin: auto;
    }

    .imgItem img.img {
        width: 60%;
        -webkit-transition: -webkit-transform 0.1s linear;
        transition: -webkit-transform 0.1s linear;
        transition: transform 0.1s linear;
        transition: transform 0.1s linear, -webkit-transform 0.1s linear;
        -webkit-transform-origin: bottom;
        transform-origin: bottom;
        margin: auto;
        margin-top: -30px;
    }

    .imgItem .text {
        width: 80%;
        margin: auto;
    }

    .imgItem h3 {
        margin: 10px auto;
    }

    .imgItem em {
        margin: 0;
        font-size: 10px;
    }

    .imgItem p {
        margin-top: 5px;
        font-size: 10px;
        min-height: 48px;
        line-height: normal;
        color: #fff;
    }

    .imgItem .btn {
        text-align: center;
        cursor: pointer;
        color: #000;
        padding: 15px 0;
        border-bottom-left-radius: 14px;
        font-weight: bold;
        background: linear-gradient(180deg,#E9D195,#8C713D);
        -webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
        box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
    }

        .imgItem .btn:hover {
            background: linear-gradient(180deg,#8C713D,#8C713D);
        }

.list .imgItem:hover img.img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.list .imgItem {
    background-image: url('/data/2061/uploads/bg-white-gold.jpg');
}

.imgItem.comingsoon {
    background-image: url('/data/2061/uploads/img-gl-rummy_comingsoon.jpg');
    background-size: cover;
    background-position: center;
    border-color: #444;
}

    .imgItem.comingsoon img {
        pointer-events: none;
    }

@media screen and (min-width: 1400px) {
    .imgItem {
        width: 31.33%;
        margin: 3% 1% 1%;
    }
}

@media screen and (min-width: 1024px) {
    .imgItem img.img {
        margin-left: -10px;
    }

    .imgItem .main {
        text-align: left;
    }

        .imgItem .main .img {
            width: 50%;
        }

        .imgItem .main .logo {
            max-height: 50px;
            top: auto;
            bottom: 10px;
            left: auto;
            right: 10px;
        }

    .imgItem .detail {
        position: absolute;
        width: 55%;
        top: 0;
        right: 0;
        text-align: left;
        padding-right: 15px;
    }

    .imgItem h3 {
        text-align: left;
    }

    .imgItem .text {
        width: 100%;
    }

    .imgItem h3 {
        margin-top: 20px;
    }

    .imgItem p {
        min-height: 32px;
    }

    .imgItem .btn {
        border-radius: 10px;
        display: table;
        padding: 8px 25px;
        font-size: 12px;
    }
}

@media screen and (max-width: 1023px) {
    .imgItem {
        cursor: pointer;
    }

        .imgItem h3 {
            font-size: 2vw;
        }
}

@media screen and (max-width: 768px) {
    .imgItem div {
        font-size: 2vw;
    }

    .imgItem .btn {
        display: block;
    }
}

@media screen and (max-width: 767px) {
    .imgItem h3 {
        font-size: 3vw;
    }

    .imgItem img.logo {
        left: 5px;
        height: 7vw;
    }

    .imgItem {
        width: 48%;
        border-radius: 2vw;
        margin-top: 8vw;
    }

        .imgItem .text {
            padding-bottom: 2vw;
        }

        .imgItem p {
            font-size: 9px;
            display: none;
        }
}

@media screen and (max-width: 425px) {
    .imgItem {
        width: 90%;
        margin: 5%;
    }

        .imgItem .btn {
            padding: 2vw 0;
            font-size: 3vw;
        }

        .imgItem p {
            font-size: 9px;
            display: none;
        }
}

.text-info {
    max-width: 1250px;
    margin: 0 auto;
    width: 100%;
    text-align: center;
    padding: 20px 0 40px;
    color: #444;
}


/**/
table {
    border-left: 1px solid #808080;
    border-top: 1px solid #808080;
}

    table td {
        border-right: 1px solid #808080;
        border-bottom: 1px solid #808080;
    }



/************************ FAQ ************************/
#theme-contain-lottery {
    background-image: url(/data/2061/uploads/bg-13.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: -8px;
    padding-bottom: 30px;
    background-color: #000;
    padding-top: 30px;
}

#theme-contain-responsible-gaming, #theme-contain-affiliate, #theme-contain-918kiss, #theme-contain-banking, #theme-contain-terms-condition {
    background-image: url(/data/2061/uploads/bg-12.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: -8px;
    padding-bottom: 30px;
    background-color: #000;
    padding-top: 30px;
}

    #theme-contain-responsible-gaming .container, #theme-contain-affiliate .container, #theme-contain-918kiss .container, #theme-contain-banking .container, #theme-contain-terms-condition .container {
        padding: 30px;
        border-radius: 6px;
        /*background: rgb(32, 32, 32);
    box-shadow: 0 2px 4px #00000024, 0 3px 4px #0000001f, 0 1px 5px #0003;
    border: solid 1px #333;
    box-shadow: #000 0 -1px 0;*/
        background: rgba(0,0,0,0.7);
        -webkit-box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
        -moz-box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
        box-shadow: 0px 0px 6px 0px rgb(203, 182, 152, 0.7);
    }

.panel-title {
    font-size: 18px;
}

.panel-default {
    border-color: #333;
}

    .panel-default > .panel-heading {
        /*background: linear-gradient(rgb(233, 209, 149), rgb(140, 113, 61));*/
        background: linear-gradient(180deg,#222222 0%,#000000 100%);
        border-color: #333;
        border-right: 1px solid rgba(2, 2, 2, 0.28);
        border-left: 1px solid rgba(2, 2, 2, 0.28);
        border-top: 1px solid rgba(250, 250, 250, 0.27);
        box-shadow: 0 0 5px rgba(1, 1, 1, 0.7);
    }

        .panel-default > .panel-heading > a {
            color: #ddd;
        }

        .panel-default > .panel-heading + .panel-collapse > .panel-body {
            border-top-color: #333;
            border-top: 1px solid #333;
            background: rgb(32, 32, 32);
            color: #808080;
            text-align: left;
        }

            .panel-default > .panel-heading + .panel-collapse > .panel-body strong {
                text-transform: uppercase;
                color: #ddd;
            }

            .panel-default > .panel-heading + .panel-collapse > .panel-body a {
                text-decoration: underline;
                color: #ddd;
            }

#promotion-top {
    text-align: center;
}

#promotion-filter {
    display: table;
    margin: auto;
}

#prmotion-faq > div {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 25px;
    padding-top: 25px;
}

#faq {
    margin: 7px 0;
}

    #faq > a, #faq > a:hover, #faq > a:visited {
        color: #444;
    }

.promot {
    position: relative;
    max-width: 1000px;
    width: 100%;
    margin: auto;
    height: 200px;
}

.promocontent {
    max-width: 415px;
    float: right;
    height: 200px;
    position: absolute;
    top: 0;
    right: 0;
    margin: auto;
    padding: 0 10px;
    display: block;
    width: 100%;
    padding-right: 15px;
}

    .promocontent h2 {
        font-size: 18px;
        color: #af0013;
        text-align: left;
        padding: 10px 0px;
    }

    .promocontent p {
        color: #666;
        font-size: 13px;
        line-height: normal;
        margin: 0;
        padding: 0px 10px;
    }

.btnFaq {
    position: absolute;
    bottom: 15px;
}

.btnMore, .btnJoin {
    padding: 7px 15px;
    min-width: 100px;
    display: inline-block;
    cursor: pointer;
    text-align: center;
}

.btnMore {
    background-color: #fff;
    border-bottom-left-radius: 10px;
    border: 1px solid #af0013;
    color: #af0013;
}

    .btnMore:hover, .btnMore:active, .btnMore:visited {
        background-color: #af0013;
        color: #fff;
    }

.btnJoin {
    background-color: #af0013;
    border: 1px solid #af0013;
    color: #fff;
    margin-left: 5px;
}

    .btnJoin:hover, .btnJoin:active {
        border-color: #666;
        background-color: #666;
    }

ol#faq {
    position: relative;
}

    ol#faq > li {
        list-style-type: none;
        padding: 0;
    }

#answer {
    max-width: 1000px;
    border: 2px solid #b08507;
    margin: 5px auto;
    padding: 0 20px 20px;
    box-sizing: border-box;
}

    #answer table {
        margin: 10px auto 20px;
        border-top: 1px solid #444;
        border-left: 1px solid #444;
    }

        #answer table > tbody > tr:first-child > td, .popup-info table > thead > tr > th, popup-info table > thead > tr:first-child > td {
            background-color: #61542d !important;
            padding: 7px;
            color: #fff;
        }

    #answer th {
        padding: 7px;
        border-right: 1px solid #444;
        border-bottom: 1px solid #444;
    }

    #answer td, #answer table > thead + tbody > tr:first-child > td {
        padding: 4px 7px;
        border-right: 1px solid #444;
        border-bottom: 1px solid #444;
        background-color: #fff;
        color: #000;
        font-weight: normal;
    }

    #answer span {
        display: block;
    }

    #answer p + ol, #answer p + ul, #answer ul, #answer ol {
        margin-left: 40px;
    }

        #answer p + ol > li, #answer p + ul > li, #answer ul > li, #answer ol > li {
            padding: 7px 0;
            list-style-type: decimal;
        }

            #answer p + ol > li a, #answer p + ul > li a, #answer ol > li a, #answer ul > li a {
                text-decoration: underline;
                color: #dd0000;
            }

            #answer p + ol > li ol, #answer p + ul > li ul, #answer p + ol > li ul, #answer p + ul > li ol {
                margin: 5px 20px;
            }

                #answer p + ol > li ul > li, #answer p + ul > li ol > li {
                    list-style-type: disc;
                }

#faq_modal {
    margin-left: 0;
}

    #faq_modal > li {
        margin: 10px 3px;
        overflow: hidden;
        padding: 0;
    }

.fancybox-inner {
    padding: 20px;
    padding-bottom: 100px;
    width: auto !important;
}

    .fancybox-inner h1 {
        color: #000;
    }

    .fancybox-inner li {
        list-style-type: disc;
    }

.faq-promos .tab {
    border: 0px solid red;
    text-align: center;
    width: 82%;
    margin: auto;
}

.tab-title {
    font-size: 30px;
    padding-bottom: 20px;
    font-weight: bold;
}

button.tablinks {
    border: 0px solid green;
    width: 16%;
    padding: 20px 10px;
}

@media screen and (min-width: 1024px) {
    #divBody {
        margin-top: 155px;
        background-image: url(/data/2061/uploads/bg-14.jpg);
    }

        #divBody > div#theme-contain-promotions > .w90 {
            width: 100%;
        }


    .fancybox-inner .promot {
        overflow: hidden;
    }

    .fancybox-inner .promocontent {
        max-width: 380px;
    }

        .fancybox-inner .promocontent h2 {
            font-size: 17px;
            font-weight: 600;
        }

        .fancybox-inner .promocontent h4 {
            font-weight: normal;
        }
}

@media (max-width: 1000px) and (min-width: 768px) {
    .promot {
        height: auto;
    }

        .promot > a > img {
            width: 100%;
        }

    .promocontent {
        max-width: 43%;
        height: 18.7vw;
    }

        .promocontent h2 {
            font-size: 1.7vw;
            margin-bottom: 5px;
        }

        .promocontent p {
            font-size: 12px;
        }

    .btnFaq {
        bottom: 1.5vw;
    }

    .btnMore, .btnJoin {
        font-size: 1.5vw;
        padding-top: 0.5vw;
        padding-bottom: 0.5vw;
    }
}

@media screen and (max-width: 1023px) {
    #promotion-filter {
        display: block;
        margin: auto;
        width: 100%;
        padding: 0 5%;
        position: relative;
    }

        #promotion-filter:before {
            content: '';
            position: absolute;
            top: 0;
            bottom: 5px;
            left: 0;
            width: 5%;
            pointer-events: none;
            border-right: 1px solid #a59347;
            text-align: center;
            background-size: 50% auto;
            background-position: center;
            background-repeat: no-repeat;
            background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23888888'%2F%3E%3C%2Fsvg%3E");
        }

        #promotion-filter:after {
            content: '';
            position: absolute;
            top: 0;
            bottom: 5px;
            right: 0;
            width: 5%;
            pointer-events: none;
            border-left: 1px solid #a59347;
            text-align: center;
            background-size: 50% auto;
            background-position: center;
            background-repeat: no-repeat;
            background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23888888'%2F%3E%3C%2Fsvg%3E");
        }

        #promotion-filter > ul {
            display: block;
            width: 100%;
            overflow-y: hidden;
            overflow-x: auto;
        }

            #promotion-filter > ul > li {
                display: table-cell;
                float: none;
                vertical-align: top;
                text-align: center;
                padding: 15px 15px;
                line-height: 18px;
                white-space: nowrap;
            }

    #faq {
        margin: 10px 0;
    }

    #prmotion-faq > div {
        padding-top: 0;
    }

    .fancybox-inner .promot {
        overflow: hidden;
    }

        .fancybox-inner .promot img {
            width: auto;
            height: 32.5vw;
        }

    .fancybox-inner .promocontent {
        display: none;
    }

    button.tablinks {
        border: 0px solid green;
        width: 49%;
        padding: 20px 10px;
    }

        button.tablinks span {
            font-size: 12px;
        }
}

@media screen and (min-width: 768px) {
    .titlePromotion {
        display: none;
    }

    #answer > .promot-img {
        display: none;
    }
}

@media screen and (max-width: 767px) {
    #faq_template_list {
        overflow: hidden;
        width: 100%;
        margin: auto;
        max-width: 507px;
    }

    .promot {
        height: auto;
    }

        .promot > a, .promot-img {
            overflow: hidden;
            display: block !important;
            width: 100%;
            height: 35.6vw;
            margin: auto;
        }

    .promot-img {
        border: 1px solid #441414;
        height: 33.2vw;
    }

        .promot > a > img, .promot-img img {
            height: 100%;
            width: auto;
        }

    .promocontent {
        position: static;
        border-top: 1px solid #63543c;
        padding-bottom: 10px;
        height: auto;
        background-image: url('/data/1262/uploads/bg-promotion-detail.jpg?v1');
        background-size: 100% 100%;
        max-width: initial;
    }

        .promocontent h2 {
            font-weight: 600;
        }

    .fright > a {
        display: block;
    }

    .fright br {
        display: none;
    }

    .fleft {
        width: 0;
        padding: 0;
    }

    #faq_template_list ol#faq li#faq {
        overflow: hidden;
        border: 1px solid #63543c;
        padding: 0;
    }

    .blackpromo {
        font-size: 16px;
        margin: 5px 0 5px !important;
        font-weight: bold;
    }

    .blackp-content {
        padding-bottom: 0;
        font-size: 11px;
        line-height: normal;
    }

    .butgrey {
        margin: 0 !important;
        font-size: 12px;
        padding: 5px 15px;
    }

    .butred {
        font-size: 12px;
        padding: 5px 15px;
    }

    #question {
    }

        #question + div {
            position: fixed;
            z-index: 111;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            margin: auto;
            background-color: #fff;
            overflow: scroll;
        }

    #faq_template_list ol#faq li#faq div#answer {
        margin-top: 0;
        padding-top: 80px;
        padding-bottom: 40px;
        min-height: 100vh;
        overflow-x: auto;
        margin-bottom: 40px;
    }

    .titlePromotion {
        display: table;
        width: 100%;
        background-color: #eee;
        border-bottom: 1px solid #ccc;
        position: fixed;
        top: 0;
    }

        .titlePromotion > p {
            display: table-cell;
            vertical-align: middle;
            text-align: center;
            height: 50px;
        }

    .promotionClose {
        display: table-cell;
        width: 50px;
        height: 50px;
        vertical-align: middle;
        text-align: center;
        position: absolute;
        top: 0;
        right: 0;
    }

        .promotionClose span {
            background-color: #888;
            width: 18px;
            height: 3px;
            display: block;
        }

            .promotionClose span:first-child {
                -webkit-transform: translate(15px,23px) rotate(45deg);
                transform: translate(15px,23px) rotate(45deg);
            }

            .promotionClose span:last-child {
                -webkit-transform: translate(15px, 20px) rotate(-45deg);
                transform: translate(15px, 20px) rotate(-45deg);
            }

    #answer > a {
        margin-bottom: 10px;
    }

    #faq_template_list ol#faq li#faq div#answer {
        border: 0;
        background-color: #fff;
    }

    #tab-promotion {
        padding: 15px 0;
        overflow: auto;
        width: 100vw;
        padding: 0px 0px 10px;
        border-top: 1px solid #441414;
    }

        #tab-promotion > ul {
            margin: auto;
            text-align: center;
            display: table;
            width: 100%;
            background-color: #efefef;
        }

            #tab-promotion > ul > li {
                padding: 12px 10px;
                display: table-cell;
                font-size: 12px;
                word-break: keep-all;
            }

                #tab-promotion > ul > li:not(:last-child) {
                    border-right: 1px solid #ddd;
                }

                #tab-promotion > ul > li.active {
                }

    .btnFaq {
        position: static;
        bottom: auto;
        display: table;
        margin: 15px 0 0 auto;
    }

    .fancybox-inner {
    }

        .fancybox-inner .promot {
            overflow: hidden;
        }

            .fancybox-inner .promot img {
                width: auto;
                height: 29.5vw;
            }

        .fancybox-inner .promocontent {
            display: none;
        }


    #faq_fbinner .tbl-lottery > thead > tr > th,
    #faq_fbinner .tbl-lottery > tbody > tr > th:first-child,
    #faq_fbinner .tbl-lottery > tbody > tr > th,
    #faq_fbinner .tbl-lottery > tbody > tr > td {
        font-size: 12px;
    }
}

/************************ MOBILE ************************/
.mobileOnly {
}

@media screen and (min-width:1023px) {
    .mobileOnly {
        display: none !important;
    }
}

@media only screen and (max-width: 479px) {
    #inews{min-height: 670px !important;}
    .desktopview {
        display: none;
    }

    .mobileview {
        display: block;
    }

    .header-bottom {
        animation: none;
        box-shadow: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
    }

    .w1440 {
        width: 96%;
        margin: 0 2%;
    }

    #divBody {
        min-height: initial;
        margin-top: 62px;
    }

    .container {
        margin: 10px !important;
    }

    .header-top .headertop-wrapper .headertop-left .announce-box .d-flex img {
        height: 42px;
        margin: 10px;
    }

    .modal-login {
        margin: 10px !important;
    }

        .modal-login button.close {
            margin-top: -18px;
        }

    #loginModal .modal-dialog {
        height: auto !important;
    }

    #cssmenu > ul > li > a, #menuadd > ul > li > a {
        padding-top: 5px !important;
        padding-bottom: 5px !important;
        padding-left: 5px !important;
        font-size: 18px;
    }

    .card .card-header h5 {
        text-align: center !important;
    }

    .list-group-item:first-child {
        width: 48%;
        text-align: center;
    }

    #mainslider {
        margin-top: -42px;
    }

    .panel-group {
        padding: 6px;
        margin-bottom: 0px !important;
    }

    .divHome-prod {
        padding: 0;
    }

        .divHome-prod .w1440 .title-main .inner h1 {
            font-size: 20px !important;
        }

    .slide-content {
        display: block;
    }

    .slide-left iframe {
        max-height: 240px;
        height: 240px;
    }

    .slide-fix {
        width: 100%;
    }

    .slide-scroll {
        width: 100%;
    }

    #theme-contain-affiliate, #theme-contain-sportsbook {
        margin-top: 60px;
    }

        #theme-contain-affiliate .container {
            margin: 10px !important;
            padding: 15px !important;
        }

    #theme-contain-live-casino, #theme-contain-games {
        margin-top: -108px;
    }

        #theme-contain-live-casino .divBanner img {
            width: 100%;
        }

    #theme-contain-registration {
        margin-top: -80px;
    }

    #theme-contain-promotion {
        margin-top: -20px;
    }

    #theme-contain-lottery {
        margin-top: -50px;
    }

    #theme-contain-horse-racing {
        margin-top: 0;
    }

        #theme-contain-horse-racing .gamelist {
            padding-top: 0;
        }

    #theme-contain-cockfight, #theme-contain-fishing {
        margin-top: 60px;
    }

    .footer-container {
        padding-bottom: 133px;
    }
}


@keyframes shining {
    0% {
        border-bottom: 1px solid #fffbe9;
    }

    50% {
        border-bottom: 1px solid #cc4e14;
    }

    100%, 0% {
        border-bottom: 1px solid #fff674;
    }
}


.moving-div {
    animation-name: move;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}

@keyframes move {
    0% {
        transform: translateY(15%);
    }

    100% {
        transform: translateY(-15%);
    }
}

@keyframes blink2 {
    0% {
        opacity: 1
    }

    50% {
        opacity: .5
    }

    to {
        opacity: 1
    }
}

@keyframes at-ripple-blue {
    0% {
        box-shadow: 0 4px 10px rgba(111, 155, 180, 0.774), 0 0 0 0 rgba(72, 126, 161, 0.644), 0 0 0 5px rgba(42, 94, 161, 0.788), 0 0 0 10px rgba(47, 120, 153, 0.719);
    }

    100% {
        box-shadow: 0 4px 10px rgba(91, 162, 209, 0.192), 0 0 0 5px rgba(80, 157, 219, 0.274), 0 0 0 10px hsla(202, 75%, 71%, 0.205), 0 0 0 20px rgba(107, 203, 241, 0.192);
    }
}

@keyframes ring-data-news {
    0% {
        transform: rotate(-15deg)
    }

    2% {
        transform: rotate(15deg)
    }

    4% {
        transform: rotate(-18deg)
    }

    6% {
        transform: rotate(18deg)
    }

    8% {
        transform: rotate(-22deg)
    }

    10% {
        transform: rotate(22deg)
    }

    12% {
        transform: rotate(-18deg)
    }

    14% {
        transform: rotate(18deg)
    }

    16% {
        transform: rotate(-12deg)
    }

    18% {
        transform: rotate(12deg)
    }

    20% {
        transform: rotate(0deg)
    }
}



.btn-menu span {
}

    .btn-menu span:first-child, .btn-menu span:nth-child(2) {
        -webkit-transform-origin: left center;
        transform-origin: left center
    }

    .btn-menu span:nth-child(2) {
        -webkit-animation: x-hamburger-wave .4s ease-out .3s infinite alternate;
        animation: x-hamburger-wave .4s ease-out .3s infinite alternate
    }

    .btn-menu span:nth-child(3) {
        -webkit-transform-origin: left center;
        transform-origin: left center;
        -webkit-animation: x-hamburger-wave .4s ease-out .6s infinite alternate;
        animation: x-hamburger-wave .4s ease-out .6s infinite alternate
    }

@-webkit-keyframes x-hamburger-wave {
    0% {
        width: 70%
    }

    to {
        width: 100%
    }
}

@keyframes x-hamburger-wave {
    0% {
        width: 70%
    }

    to {
        width: 100%
    }
}