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

html {
    scroll-behavior: smooth!important;
  }

::-webkit-scrollbar {
    width: 0.45rem!important;
    height: 4px!important;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(to bottom,#fff50f 5%,#cda301 100%) !important;
    border-radius: 3px;
}

::-webkit-scrollbar-track {
    background: #2c2c2c!important;
}

@font-face {
    font-family: "myfont";
    src: url("Trade-Gothic-LT-Bold.woff2") format('woff');
    font-weight: bold;
}

@font-face {
    font-family: "myfont2";
    src: url("rogfonts-regular_es.woff2") format('woff');
    font-weight: bold;
}

body {
    font-family: sans-serif;
    color:#fff;
}



.ol, ul {
    list-style: none;
}

body * {
    box-sizing: border-box;
}

* {
    outline: none;
}

a:hover {
    color: unset;
}
/** BUTTON BACK TO TOP **/

#button1 {
    display: inline-block;
    background-color: #ffc908;
    width: 50px;
    height: 50px;
    text-align: center;
    border-radius: 4px;
    position: fixed;
    bottom: 30px;
    right: 30px;
    transition: background-color .3s, 
      opacity .5s, visibility .5s;
    opacity: 0;
    visibility: hidden;
    z-index: 1000;
    text-decoration: none;
  }
  #button1::after {
    content: "\f077";
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    font-size: 2em;
    line-height: 50px;
    color: #fff;
  }
  #button1:hover {
    cursor: pointer;
    background-color: #f7a800;

    color: black;
  }
  #button1:active {
    background-color: rgb(231, 168, 31);
  }
  #button1.show {
    opacity: 1;
    visibility: visible;

  }

/** BUTTON BACK TO TOP END **/

/** WHATSAPP CONTENT **/

.chat-element-bottom {
    bottom: 115px;
    left: auto;
    opacity: 1;
    right: 20px;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0)!important;
    -webkit-transition: .35s;
    -o-transition: .35s;
    transition: .35s;
    -webkit-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    width: auto;
    position: fixed!important;
}


.ctr--chat {
    background: #ede3dd;
    border: 1px solid #e1d1c8;
    border-radius: 20px;
    -webkit-box-shadow: 0 2px 5px rgba(6, 8, 10, .1);
    box-shadow: 0 2px 5px rgba(6, 8, 10, .1);
    max-width: 285px;
    -webkit-transform: translateY(130%);
    -ms-transform: translateY(130%);
    transform: translateY(130%);
    -webkit-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
    -webkit-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
    width: auto;
    z-index: 6666;
}

    .ctr--chat .ctr-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        background: #2e8d7c;
        border-radius: 20px 20px 0 0;
        padding: 12px 15px;
        justify-content: space-between;
    }

    .ctr--chat .ctr-header .title {
        display: flex;
        align-items: center;
    }

    .ctr--chat .ctr-header .title i {
        font-size: 17px;
        margin-right: 5px;
    }

    .ctr--chat .ctr-header .title .whatsapp {
        font-size: 14px;
        color: white;
        line-height: 20px;
    }

    .ctr--chat .close-button {
        background: rgba(0, 0, 0, .3);
        border-radius: 50px;
        color: #fff;
        font-size: 17px;
        height: 25px;
        line-height: 25px;
        position: absolute;
        right: 15px;
        text-align: center;
        width: 25px;
        z-index: 9999;
        text-decoration: none;
    }

    .ctr--chat .ctr-content {
        padding: 6px 20px 13px;
    }

    .ctr--chat .ctr-bubble {
        background: #fff;
        border: 2px solid #fff;
        border-radius: 4px 20px 20px 20px;
        -webkit-box-shadow: 0 2px 2px rgba(6, 8, 10, .1);
        box-shadow: 0 2px 2px rgba(6, 8, 10, .1);
        line-height: 18px;
        margin: 12px 0;
        padding: 12px 15px;
        width: 240px;
    }

    .ctr--chat .ctr-bubble p {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 0px;
        color: black;
    }


/** WHATSAPP CONTENT END **/

/** LOGIN FORM **/

.hover-container.login .nrc-form .nrc-form-item {
    display: block!important;
    position: relative;
}

.nrc-form .nrc-form-item.vertical {
    margin-bottom: 0;
}

.nrc-form .nrc-form-item {
    align-items: center;
}

.nrc-form .nrc-form-item.vertical .nrc-form-input {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
}

#login.modal-body .nrc-form .nrc-form-item .nrc-form-input input {
    margin-right: 0;
    width: 100%;
}

.nrc-form .nrc-form-item .nrc-form-input input {
    margin-right: 20px;
    width: 430px;
}



.nrc-form .nrc-form-item .nrc-form-input select {
    margin-right: 20px;
    width: 430px;
}

.nrc-form-input input, .nrc-form-input select {
    appearance: none!important;
    background-color: #2b2b2b!important;
    border: none;
    transition: border-color 0.3s ease;
    border: 1px solid transparent;
    border-radius: 3px;
    box-sizing: border-box;
    padding: 11px;
    color: white!important;
    display: block;
    font-size: 13px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 500;
    letter-spacing: 0.2px;
    padding-left: 10px;
    padding-right: 10px;
    width: calc(100% - 0px);
    background-image: url(images/chevron-bottom-white.png);
}

    .nrc-form-input input:focus, .nrc-form-input select:focus {
        border: 1px solid #ffe018;
        box-shadow: unset;
    }



.nrc-form-input .Select-control.invalid, .nrc-form-input input.invalid {
    background-color: rgba(255,223,223,.4);
    color: black;
}

.nrc-form-input input.invalid {
    background-color: #fff;
    border-color: #ffc908;
    box-shadow: 0 0 3px #ffd922;
}

.nrc-form .nrc-form-item.vertical .nrc-form-input small {
    height: 44px;
    text-align: left;
    width: 100%;
}

    .nrc-form .nrc-form-item small.invalid-msg {
        color: #d22323;
        font-size: 14px;
        font-stretch: normal;
        font-style: normal;
        font-weight: 300;
    }

    .invalid-msg {
        margin-top: 5px;
        display: none;
    }

    .highlight-color {
        color: #fdad00;
        text-decoration: none!important;
    }

        .highlight-color:hover {
            color: #fdad00;
            text-decoration: none;
        }

.flex-right-bottom {
    align-items: flex-end;
    display: flex;
    justify-content: flex-end;
}

#login .nrc-form .nrc-form-item {
    align-items: flex-start;
    display: inline;
    justify-content: flex-start;
}

.hidden {
    display: none;
}

.custom-file {
    position: relative;
    height: calc(1.5em + 0.75rem + 2px);
    margin-bottom: 0;
    display: flex;
    width: 100%;
}

.nrc-form-item input[type=file] {
    padding: 0 15px;
    font-size: 14px;
    color: #fff;
    min-height: 40px;
    background: unset;
    border: 1px solid #aaa;
    border-radius: 3px;
    outline: none !important;
    transition: border-color 0.3s ease;
    letter-spacing: 0.4px;
}

.nrc-form-item .custom-file-label {
    z-index: 1;
    height: 42px;
    padding: 0.375rem 0.75rem;
    font-weight: 400;
    line-height: 1.5;
    color: #fff;
    background-color: #2b2b2b!important;
    border: 0.125rem solid transparent;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    -moz-appearance: auto !important;
    appearance: auto !important;
    font-size: 13px;
    width: 100%;
    display: flex;
    align-items: center;
}

    .nrc-form-item .input-group-append button {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        color: black;
    }

    .btn-default {
        background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#eaee0e 99.39%),#ffc908;
        background-position: 50%0;
        background-size: 200%;
        box-shadow: 0 5px 10px 0 rgba(6,8,15,.1),inset 0 0 3px 0#ffdd8f;
        height: 2.5rem;
        font-size: 15px;
        font-weight: 600;
        line-height: 2.5rem;
        display: flex;
        align-items: center;
        border-radius: 3px;
        gap: 5px;
        padding: 0 1.875rem;
        transition: box-shadow .5s ease-out .1s,background-position .3s ease-in,text-shadow .3s ease-in .1s;
        border: 0;
    }

    .btn-default.upload {
        height: 44px;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

    .spinner-border {
        vertical-align: -0.125em;
        border: 0.25em solid currentColor;
        border-right-color: transparent;
        border-radius: 50%;
        animation: .75s linear infinite spinner-border;
    }

    @keyframes spinner-border {
        100% {
            transform: rotate(360deg);
        }
    }

    .dataTables_length td, .dataTables_filter label {
        color: white !important;
        font-size: 13px;
    }

    .dataTables_filter input {
        color: #ffe018;
    }

    .dataTables_filter input:focus {
        border: 1px solid #ffe018;
    }


    .dataTables_length select {
        color:  #ffe018;
        outline: none;
        width: auto;
        background-color: #383535 !important;
        appearance: none;
        background-image: url(images/down1.png);
        background-position: center right 5px;
        background-repeat: no-repeat;
        background-size: 10px;
        /* padding: 4px 10px!important; */
        padding-left: 5px !important;
        padding-right: 20px !important;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        word-wrap: wrap;
        height: 29.8px;
    }

    .dataTables_wrapper .dataTables_filter input {
        padding: 4px !important;
        transition: .3s ease;
    }

    .dataTables_filter input:focus {
        outline: 2px solid rgba(240, 255, 35, 0.4);
    }

.records table {
    border: 2px solid #ffe018;
    color: white;
    border-radius: 5px;
}

.records table thead {
    background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#eaee0e 99.39%),#ffc908;
}

.records table thead tr th {
    text-align: center;
    border-right: 1px solid rgba(0,0,0,.2);
}

.records table tbody tr td {
    padding: 10px;
    font-size: 13px;
    letter-spacing: 0.4px;
    text-align: center;
    border-right: 1px solid rgba(0,0,0,.2);
    vertical-align: bottom;
    color: white;
}

    .records table tbody tr td i {
        color: white;
    }

table.dataTable thead > tr > th.sorting {
    font-size: 13px;
    text-align: center;
    font-weight: 600;
}

.dataTables_wrapper .dataTables_info {
    color: #fff !important;
    font-size: 14px;
}

.dataTables_wrapper .dataTables_paginate, .dataTables_wrapper .dataTables_paginate {
    font-size: 13px !important;
    color: white !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
    color: rgb(255 255 255 / 72%) !important
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    border: 0;
    border-radius: 3px;
    color: #fff !important;
    height: 32.5px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover, .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    border: 0;
    background: #ffc908;
    color: #fff !important;
}



/** LOGIN FORM END **/

/** REGISTER FORM **/

.main-wrap {
    margin: 0 auto;
    position: relative;
}

.main-wrap.signup {
    justify-content: center;
    gap: 8px;
}

.white-container {
    background-color: #222;
    border-radius: 5px;
    box-shadow: 0 2px 4px 0rgba(0,0,0,.25);
    margin: 56px auto;
    padding: 20px 40px 40px;
    width: 55%;
}

.white-container.two {
    width: 45%;
    padding: 15px 10px 40px;
}

.section-block .header {
    border-bottom: 1px solid #ccc;
    height: 38px;
    margin-bottom: 10px;
    padding: 0 10px 10px;
}

    .section-block .header .titles {
        align-items: baseline;
        display: flex;
    }

    .section-block .header h3 {
        color: #ffd800;
        font-size: 22px;
        font-weight: 400;
        user-select: none;
    }

    .register.nav-tabs {
        display: flex;
        justify-content: center;
        gap: 8px;
    }

    .register .nav-link {
        height: 35px;
        border: 1px solid transparent;
        background: #ffc908e0;
        opacity: .5;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 3px;
        color: #000000d1;
        font-size: 14px;
        font-weight: 600;
        min-width: 180px;
        gap: 7px;
        letter-spacing: 0.5px;
    }

    .register .nav-link.active {
        background: #ffc908;
        color:black;
        border-radius: 3px;
        transition: all 0.5s ease;
        border-color: transparent;
        border-color: #ccb802 #cfc500 #d5b60c;
        box-shadow: 0 0 8px #b5b00ec2;
        opacity: 1;
    }

.signup-group .form-group {
    display: grid;
}

.signup-group .form-group label {
    font-size: 14px;
    line-height: 20px;
    display: block;
    text-align: left;
    width: 100%;
    color: #fff;
    margin-bottom: 8px;
    letter-spacing: 0.3px;
}

    .signup-group .form-group input {
        line-height: 15px;
        width: 100%;
        font-size: 14px;
        padding: 11px;
        border: 1px solid transparent;
        border-radius: 3px;
        background: #454545;
        transition: border-color 0.3s ease;
        outline: none !important;
        color: #fff;
    }

    .signup-group .form-group input:focus {
        border-color: #ffe018;
    }

    .signup-group .alert-notes {
        color: #ff5656;
        font-size: 13px;
        line-height: 1.3;
        text-align: left;
        margin-top: 5px;
        margin-bottom: 5px;
    }    

    .signup-group .alert-notes::before {
        content: "!";
        display: inline-block;
        width: 14px;
        margin-right: 5px;
        border-radius: 50%;
        background-color: #f35e5e;
        color: #fff;
        font-size: 12px;
        font-weight: 700;
        text-align: center;
        vertical-align: middle;
    }

input::-webkit-input-placeholder { -webkit-transition:.5s;}
input:-moz-input-placeholder { -moz-transition:.5s;}
input::-moz-input-placeholder { -moz-transition:.5s;}
input:-ms-input-placeholder { -ms-transition:.5s;}

input:focus::-webkit-input-placeholder { color:transparent;}
input:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */
input:focus::-moz-placeholder { color:transparent; } /* FF 19+ */
input:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */

.toggle-password, .toggle-password2, .toggle-password3, .toggle-password4 {
    float: right;
    margin-right: 10px;
    margin-top: -28px;
    position: relative;
    z-index: 2;
    cursor: pointer;
}

.carousel-inner.register, .carousel-item.register img {
    border-radius: 8px;
}

.check-wrap {
    width: 100%;
    margin: 0 0 10px;
    text-align: left;
    position: relative;
}

.check-wrap input {
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.check-wrap [type=checkbox] {
    display: none;
}

    .check-wrap [type=checkbox] + label {
        cursor: pointer;
    }

    .check-wrap label {
        position: relative;
        transition: background .3s ease-out .1s,box-shadow .5s ease-in .1s;
        width: 100%;
        display: flex;
    }

    .check-wrap [type=checkbox]:checked + label .check-cube {
        background: rgb(255 231 0);
    }

    .check-wrap .check-cube {
        position: relative;
        vertical-align: middle;
        display: inline-block;
        width: 18px;
        height: 17px;
        margin-right: 7px;
        overflow: hidden;
        transition: transform .3s ease-out .1s,background .3s ease-in .1s;
        transition: transform .3s ease-out .1s,background .3s ease-in .1s,-webkit-transform .3s ease-out .1s;
        border: 1px solid rgba(0,0,0,.1);
        border-radius: 2px;
        background: #fff;
        box-shadow: 0 1px 2px 0 rgba(0,0,0,.05), 0 2px 3px 0 rgba(0,0,0,.05), 0 3px 4px 0 rgba(0,0,0,.05);
    }

    .check-wrap p {
        font-size: 13px;
        line-height: 20px;
        color: rgba(255,255,255,.8);
    }

    .check-wrap .check-cube::before {
        width: 100%;
        height: 100%;
        -webkit-transform: translate(0,30px);
        transform: translate(0,30px);
        transition: transform .3s ease-out .1s,opacity .3s ease-out;
        transition: transform .3s ease-out .1s,opacity .3s ease-out,-webkit-transform .3s ease-out .1s;
        opacity: 0;
        background: url(images/check.png) no-repeat center;
        background-size: 90%;
        content: "";
        display: inline-block;
        position: absolute;
    }

    .check-wrap [type=checkbox]:checked + label .check-cube::before {
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
        opacity: 1;
    }

    .check-wrap [type=checkbox] + label::after {
        content: "";
        display: block;
        clear: both;
    }

.ac {
    width: 100%;
    display: flex;
    align-items: center;
    vertical-align: middle;
}

.form-group .form-select {
    transition: border-color 0.3s ease !important;
    outline: none !important;
    background-color: #454545 !important;
    color: #fff;
    background-image: url(images/chevron-bottom-white.png) !important;
    background-size: 20px;
    font-size: 13px;
    height: 40px;
    transition: box-shadow 0.3s ease !important;
    outline: none !important;
    border: 1px solid transparent;
}

.form-group .form-select:focus {
    box-shadow: 0 0 1px 0.3px #ffe018;
}

    .register-tet {
        margin-top: 25px;
        display: block;
        justify-content: center;
        text-align: center;
    }

    .register-title {
        color: #ffd800;
        font-weight: 600;
        font-size: 24px;
    }

    .register-desc {
        font-size: 15px;
        margin-top: 10px;
    }

    .register-list-item {
        display: flex;
        justify-content: center;
        text-align: center;
        align-items: center;
        gap: 8px;
    }

    .register-list-item img {
        width: 55px; 
        height: 100%;
    }

    .register-list-item p {
        margin-bottom: 0px;
        font-size: 11px;
        color: rgb(134, 151, 162);
        text-align: left;
    }

    .is-invalid {
        border-color: var(--bs-danger) !important;
        transition: border-color 0.3s ease !important;
        color: var(--bs-danger) !important;
        padding-right: calc(1.5em + 0.75rem);
        background-image: url(images/invalid.svg) !important;
        background-repeat: no-repeat !important;
        background-position: right calc(0.375em + 0.1875rem) center !important;
        background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) !important;
        box-shadow: 0 0 0 0.25rem rgba(220,53,69,.0) !important;
    }

    .login-forgetpass {
        min-width: max-content;
        font-size: 13px;
        max-width: 100%;
        float: right;
        color: #b2b2b2;
        text-decoration: underline;
        transition: .3s
    }

    .login-forgetpass:hover, .login-accs a:hover  {
        color: #ffd800;
    }

    .login-accs {
        display: flex;
        justify-content: center;
        text-align: center;
        align-items: center;
        gap: 6px;
        transition: .3s
    }

    .login-accs p {
        margin-bottom: 0px;
        font-size: 13px;
    }

    .login-accs a {
        color: #b2b2b2;
        font-size: 13px;
        transition: .3s
    }
    
.nrc-form .nrc-form-item {
    margin-bottom: 30px;
}

.nrc-form .nrc-form-item {
    align-items: flex-start;
    display: flex;
    justify-content: flex-start;
}

    .nrc-form-item .nrc-form-input {
        align-items: center;
        display: flex;
        justify-content: center;
    }

    .nrc-form-item .nrc-form-input.identity {
        align-items: center;
        display: flex;
        justify-content: left;
        width: 100%;
    }


    .nrc-form .nrc-form-item .nrc-form-label {
        padding-right: 10px;
        width: 220px;
        text-align: left;
    }

.nrc-form .nrc-form-item .nrc-form-label label {
    color: #fff;
    font-size: 14px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 600;
    letter-spacing: 0.3px;
    line-height: 36px;
    position: relative;
}

.nrc-form .nrc-form-item small {
    color: #b5abab;
    font-size: 14px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 300;
    line-height: 36px;
    width: 500px;
}

    .nrc-form .nrc-form-item .nrc-form-label label.form-require:before {
        color: #ffd800;
        content: "*";
        font-size: 18px;
        font-stretch: normal;
        font-style: normal;
        font-weight: 600;
        left: -5px;
        line-height: 0;
        position: absolute;
        top: 12px;
    }

.agree-policy {
    align-items: center;
    display: flex;
    justify-content: center;
}

.agree-policy label {
    color: white;
    font-size: 14px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 300;
    margin-right: 4px;
}

.validate-policy {
    color: #ff3737;
    font-size: 14px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 300;
    text-align: center;
}

input[type='checkbox'] {
    accent-color: rgb(255 231 0);
}

input[type=text]:focus, input[type=password]:focus, textArea[type=textArea]:focus, .input[type=number]:focus {
    border-color: #ffe018;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
  }

  textarea {
    outline: 1px solid transparent;
  }

  textarea:focus-visible {
    outline: 1px solid #ffd800;
    box-shadow: 0px 0px 5px 2px #dbdbdb;
  }


.btn-group {
    margin: 40px 0;
    align-items: center;
    display: flex;
    justify-content: center;
}

    .btn-group.model {
        margin-top: 20px;
        margin-bottom: 5px;
        margin-left: 0px;
        margin-right: 0px;
        width: 100%;
    }

    .btn-group.model .nrc-button {
        width: 100%;
    }


.forgot-body p {
    color: white;
    font-size: 15px;
}

::-webkit-calendar-picker-indicator {
    filter: invert(1);
}

.form-group textarea {
    position: static;
    font-size: 13px;
    border: 1px solid #adacb1;
    border-radius: 3px;
    background: #454545 !important;
    width: 100%;
    color: white;
    font-weight: 700;
    appearance: none !important;
}

.form-group textarea:focus {
    border: 1px solid #ffe018;
    outline: none!important;
    box-shadow: unset;
    color: white;
}

.registration-success-copy-fields {
    display: flex;
}

    .registration-success-copy-fields .copy-content {
        border-radius: 3px;
        width: 100%;
        min-height: 40px;
        display: flex;
        border: 1px solid #adacb1;
    }

    .registration-success-copy-item {
        padding: 3px 10px;
        display: flex;
        align-items: center;
    }

    .registration-success-copy-fields-item:first-child {
        position: relative;
    }

    .registration-success-copy-fields-item {
        min-width: 0;
        flex-grow: 1;
    }

    .registration-success-copy-fields-item:first-child:before {
        position: absolute;
        top: 19%;
        width: 1px;
        height: 1.5em;
        content: "";
        right: 0px;
        background-color: #adacb1;
    }

    .registration-success-copy-item-name {
        margin-right: 3px;
        display: block;
        color: white;;
        font-size: 13px;
        line-height: 1.0px;
        font-weight: 600;
    }

    .registration-success-copy-item input.copy-one {
        color: #ffd800!important;
        font-size: 13px!important;
        background: none !important;
        font-weight: 700;
        line-height: 1.0px;
        border: none;
        height: 25px;
        position: relative;
        padding: 0;
    }

    .login-form-inner .form-group button {
        text-align: center;
        outline: none !important;
        border: none;
        height: 40px;
        line-height: 40px;
        width: 100%;
        color: #fff;
        text-shadow: 0 0 1px #fffa;
        cursor: pointer;
    }

    .one-click-copybutton {
        display: flex;
        align-items: center;
        text-align: center;
        justify-content: center;
        width: 40px !important;
        margin-left: 7px;
        background: #ffc908;
        color: black;
        border: 1px solid #d5b60c;
        border-radius: 3px;
        font-weight: 700;
    }

    .one-click p {
        color: #ffe00a;
        font-size: 14px;
        text-align: center;
        margin-top: 15px;
        font-weight: 600;
        margin-bottom: 0px;
    }

    .registration-complete-form-account-info-section {
        margin-top: 12px;
        display: flex;
        gap: 15px;
        position: relative;
    }

    .one-click .form-group a {
        margin-top: 10px;
        text-align: center;
        outline: none !important;
        border: none;
        height: 40px;
        line-height: 40px;
        width: 100%;
        color: black;
        cursor: pointer;
        font-size: 14px;
        font-weight: 700;
        text-decoration: none;
        border-radius: 3px;
        background: linear-gradient(180deg, rgba(0 0 0 / 0%), rgb(225 179 25 / 23%) 48.43%, #eaee0e 99.39%), #ffc908;
    }


/** REGISTER FORM END **/

.approot {
    background-color: #000;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

.main-wrap {
    margin: 0 auto;
    position: relative;
}

.quick-nav {
    background-color: #000;
    height: 32px;
    line-height: 32px;
    width: 100%;
}

.quick-nav .main-wrap{
    display: flex;
    justify-content: space-between;
}

.quick-nav .current-timer {
    color: white;
    font-size: 13px;
    white-space: nowrap;
    width: 130px;
}

.lang {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    color: black;
    font-size: 13px;
    padding-left: 10px;
    font-weight: 500;
}

.lang img {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    border: 1px solid black;
}

.lang .current-lang-box {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 8px;
    cursor: pointer;
}

    .lang .current-lang-box i {
        margin-left: 5px;
    }

    .lang .lan-list-box {
        position: absolute;
        top: 100%;
        left: 0;
        font-size: 15px;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
        background: #111;
        padding-left: 11px;
        padding-right: 11px;
        padding-top: 10px;
        padding-bottom: 5px;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
        z-index: 5;
        transform: translateY(0px);
        opacity: 0;
        transition: .4s;
        pointer-events: none;
    }

    .lang .lan-list-box.active {
        opacity: 1;
        pointer-events: all;
        transform: translateY(1px);
    }

    .lang .lan-list-box li {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        height: 35px;
        margin-bottom: 15px;
        padding-right: 5px;
        cursor: pointer;
        z-index: 1;
        white-space: nowrap;
        transition: .7s;
    }

    .lang .lan-list-box li:last-child {
        margin-bottom: 5px;
    }

    .lang .lan-list-box li span {
        margin-left: 5px;
        color: rgb(227, 227, 227);
        font-size: 13px;
        transition: .3s;
    }

    .lang .lan-list-box li span:hover {
        color: #ffd800; 
    }

.lang-item:hover {
    background-color: #ffd106;
}


.lang-item {
    display: none;
    position: absolute;
    right: 0;
    background-color: #f5d64b;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 20;
    padding: 0 10px;
    font-weight: 500;
}


.lang:hover .lang-item {
    display: block; 
}

/** HEADER **/

.approot header {
    /** background: rgba(255, 216, 0); **/
    background: #161616;
    position: relative;
    width: 100%;
}

.approot header .navigation {
    display: flex;
    flex-direction: row;
    text-align: center;
    justify-content: center;
    position: static;
}

.approot header .navigation .navigation-inner {
    justify-content: center;
    width: 100%;
    height: 76px;
    align-items: center;
    display: flex;
    margin: 0 auto;
    padding: 0 20px;
}

.approot header .logo {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
    flex-shrink: 0;
    margin-right: 20px;
}

.approot header .logo img {
    width: 255px!important;
}

.more-icon.left {
    display: flex;
    padding-right: 15px;
    margin-left: 55px;
    align-items: center;
    cursor: pointer;
    color: white;
    transition: .2s;
}
  
.more-icon.right {
    display: flex;
    padding-left: 5px;
    align-items: center;
    cursor: pointer;
    color: white;
    transition: .4s;
}

    .more-icon.left:hover, .more-icon.right:hover {
        color: #ffd800;
    }

.navigation .navigation-inner .nav {
    display: flex;
    padding-bottom: 6px;
    flex-flow: row nowrap;
    justify-content: flex-start;
    padding: 0;
    width: 888px;
    height: 100%;
    list-style-type: none;
    overflow-y: hidden;
    overflow-x: scroll;
    white-space: nowrap;
    -ms-overflow-style: none;
    -webkit-tap-highlight-color: transparent;
}

    .navigation .navigation-inner .nav::-webkit-scrollbar {
        display: none!important;
    }

.approot header .navigation .navigation-inner .nav .nav-item  {
    color: white;
    cursor: pointer;
    height: auto;
    width: auto;
    position: relative;
    text-align: center;
    white-space: nowrap;
    display: flex;
    text-align: center;
    align-items: center;
    justify-content: flex-end;
}

.approot header .navigation .navigation-inner .nav .nav-item a {
    color: #e3e3e3;
    align-items: center;
    font-weight: 500;
    display: flex;
    padding: 0 5px;
    justify-content: center;
    flex-direction: row;
    text-decoration: none;
    letter-spacing: 0.3px;
    font-size: 15px;
    transition: .3s;
}

    #nav-item:hover {
        background-color: #1b0b2c;
        transition: 0.2s;
    } 

.approot header .navigation .navigation-inner .nav .nav-item a> i {
    align-items: center;
    color: white;
    display: flex;
    font-size: 11px;
    justify-content: center;
    padding-left: 5px;
    text-decoration: none;
    transition: .3s;
}



/** --------------------------------  **/

.approot header .navigation .navigation-inner .nav .submenu {
    background-color: #1d1d1d;
    box-shadow: 0 10px 10px rgb(0 0 0 / 10%);
    left: 0;
    height: 0px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    text-align: center;
    top: 100%;
    transition: .3s;
    width: 100%;
    z-index: 20;
    border-bottom: 4px transparent;
}

.approot header .navigation .navigation-inner .nav .nav-item:hover + .submenu {
    opacity: 1;
    height: 300px;
}

.approot header .navigation .navigation-inner .nav .submenu:hover {
    height: 300px;
    opacity: 1;
}

    .approot header .navigation .navigation-inner .nav li {
        border-bottom: 2px solid transparent;
        margin-right: 20px;
        display: flex;
        text-align: center;
        justify-content: center;
        transition: .3s;
    }

    .approot header .navigation .navigation-inner .nav li:hover {
        border-bottom: 2px solid #fee121;
        transition: 0.2s;
    }

    .approot header .navigation .navigation-inner .nav li.active {
        border-bottom: 2px solid #fee121;
        transition: 0.2s;
    }

    .approot header .navigation .navigation-inner .nav li:hover a, .approot header .navigation .navigation-inner .nav li:hover a i {
        color: #ffd800;
    }

    .approot header .navigation .navigation-inner .nav li.active a, .approot header .navigation .navigation-inner .nav li.active a i {
        color: #ffd800;
    }



.approot header .navigation .navigation-inner .nav .submenu ul {
    font-size: 0;
    height: 300px;
    margin-left: 140px;
    margin-right: 140px;
    position: relative;
    overflow: scroll;
    overflow-x: hidden;
    white-space: normal;
}

.approot header .navigation .navigation-inner .nav .submenu ul li{ 
    display: inline-flex;
    height: 100%;
    position: relative
}

.approot header .navigation .navigation-inner .nav .submenu ul li a {
    font-size: 14px;
    color: #fff;
    display: block;
    height: 100%;
    padding: 0 15px;
    position: relative;
    transition: .2s;
    border-bottom: 3px solid transparent;
    text-decoration: none;
}

.approot header .navigation .navigation-inner .nav .submenu ul li a:hover {
    background-color: #302c35!important;
}

.approot header .navigation .navigation-inner .nav .submenu ul li img {
    display: block;
    height: 80%;
    position: relative;
    top: 10%;
}

.approot header .navigation .navigation-inner .nav .submenu ul li a span {
    position: relative;
    top: 30px;
}


/** --------------------------------  **/
    
/** HEADER END**/

/** PLAYER NAV **/

.player-nav {
    background-image: linear-gradient(#ffc136,#dfbc2f);
    border: 1px solid #cb9d00;
    height: 50px;
    display: flex;
    justify-content: space-between;
}

.main-wrap {
    margin: 0 auto;
    position: relative;
    display: flex;
    justify-content: space-between!important;
}

    .main-wrap .left {
        display: flex;
        align-items: center;
        gap: 10px;
        height: 100%;
    }

    .main-wrap .left .current-timer {
        font-size: 13px;
        font-family: sans-serif;
        color: black;
        letter-spacing: 0.2px;
        border-right: 1px solid #363636;
        width: 140px;
    }

.notlogin-player-nav {
    align-items: center;
    display: flex;
    height: 100%;
    width: 100%;
    padding: 0 20px;
}

.login-title {
    align-items: center;
    color: black;
    display: flex;
    font-size: 13px;
}

    .login-title i {
        border: 1px solid #000;
        border-radius: 50%;
        display: block;
        font-size: 19px;
        height: 28px;
        margin-right: 5px;
        width: 28px;
        padding:  2px;
    }

.btn-big {
    border: 1px solid #8c2aa3;
    cursor: pointer;
    font-size: 13px;
    letter-spacing: 0.2px;
    font-weight: 700;
    height: 32px;
    line-height: 23px;
    border-radius: 4px;
    margin: 0 5px;
    min-width: 60px;
    padding: 0 15px;
    user-select: none;
    display: flex;
    text-decoration: none;
    align-items: center;
    transition: .3s;
}   

    .btn-login {
        background: #1d1d1d;
        border-color: #ffe200;
        color: #ffffff;
    }

        .btn-login:hover {
            background: #2d2b2b;
            border-color: #ffe200;
            color: #ffffff;
        }

    .btn-signup {
        background-color: #FFD800;
        border-color: #000000;
        color: black;
        text-decoration: none;
    }

    .btn-signup a{
        text-decoration: none;
        color: black;
    }

        .btn-signup:hover {
            background: #ffbb35;
            border-color: #000000;
            color: black;
        }

/** PLAYER NAV END **/

/** PLAYER LOGIN NAV **/

.login-nav-item {
    cursor: pointer;
    display: inline-block;
    font-size: 15px;
    vertical-align: middle;
}

.login-nav-item.profile a {
    color: black;
}

    .login-nav-item.profile a:hover {
        color: black;
    }

.login-nav-item a {
    color: rgba(255, 255, 255, 255);
    font-weight: 600;
    display: block;
    padding: 0 10px;
    text-decoration: none;
    transition: .2s;
}

    .login-nav-item a:hover {
        color: rgb(9 9 78);
    }

    .login-nav-item a.active {
        color: rgb(9 9 78);
    }

.id a {
    color: black;
    font-weight: 700;
    cursor: pointer;
    padding: 0 10px;
    text-decoration: none;
    font-size: 15px;
}   

.wallet {
    align-items: center;
    white-space: nowrap;
    z-index: 10;
}

    .wallet h2 {
        color: black;
        font-size: 16px;
        font-weight: 600;
        margin-bottom: 0px;
    }





/** PLAYER LOGIN NAV END **/

/** SIDE BAR **/

.side-menu {
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 95px;
    z-index: 25;
}

.side-menu li+li {
    margin-top: 5px;
}

.side-menu li a {
    background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#eaee0e 99.39%),#ffc908;
    border: 2px solid #c2824e;
    border-radius: 5px 0 0 5px;
    color: black;
    display: block;
    font-size: 12px;
    height: 60px;
    line-height: 1.4;
    overflow: hidden;
    padding-left: 60px;
    text-decoration: none;
    transform: translateZ(0);
    transition: transform .3s linear;
    width: 280px;
}

    .side-menu li a:hover {
        transform: translate3d(-160px,0,0);
        transition: transform .4s ease-out .2s;
    }

    .side-menu li a img {
        left: 0;
        position: absolute;
    }

    .side-menu li a>h2 {
        color: black;
        font-size: 15px;
        font-weight: 600;
        line-height: 1.4;
        padding: 10px 0 0px;
        padding-left: 2px;
    }

    .side-menu li a>p {
        color: black;
        padding-left: 2px;
        font-weight: 500;
    }

    .side-menu li a>i {
        color: black;
        font-size: 32px;
        height: 100%;
        left: 0;
        line-height: 60px;
        position: absolute;
        text-align: center;
        top: 0;
        width: 60px;
    }

/** SIDE BAR END**/

/** MARQUEE CONTENT **/



.approot .marquee-container .marquee-block {
    background-color: rgba(0,0,0,.5);
    height: 40px;
    line-height: 30px;
    width: 100%;
    z-index: 1;
}

.approot .marquee-container .marquee-block .marquee-news {
    margin: auto;
    position: relative;
}

.news.marquee-wrap {
    box-sizing: border-box;
    cursor: pointer;
    height: 40px;
    margin: auto;
    padding-left: 30px;
    position: relative;
    width: 100%;
}

.news.marquee-wrap .visible-area {
    height: 100%;
    overflow: hidden;
    position: relative;
}

.marquee-custom {
    font-size: 15px;
    margin-top: 7px;
}

.news-title {
    line-height: 41px;
    position: absolute;
    top: 0;
}

.approot .marquee-container .marquee-block .marquee-news .news-title {
    background-color: #ffd800;
    border-radius: 50%;
    color: black;
    height: 40px;
    margin: 0;
    padding: 0;
    text-align: center;
    transform: scale(.7);
    width: 40px;
}

.approot .marquee-container.promox {
    position: relative;
    width: 100%;
    top: -8px;
}

/** MARQUEE CONTENT END**/

/** CAROUSEL SLIDER **/

.app-body {
    flex-grow: 1;
    background: #1e1e1e;
    position: relative;
    min-height: 49vh;
}

.home-area {
    overflow: hidden;
    width: 100%;
}

.home-area .carousel {
    overflow: hidden;
    position: relative;
}

    .home-area .carousel.sports {
        height: 100%;
        border-radius: 15px;
    }

    .home-area .carousel-indicators {
        margin-bottom: 0px!important;
    }

    .carousel-indicators [data-bs-target] {
        box-sizing: content-box;
        flex: 0 1 auto;
        width: 10px;
        height: 10px;
        padding: 0;
        margin-right: 3px;
        margin-left: 3px;
        text-indent: -999px;
        cursor: pointer;
        background-color: #828280;
        background-clip: padding-box;
        border: 0;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-radius: 90%;
        transition: background .3s ease-out .1s;
        opacity: 1;
    }

    .carousel-indicators [data-bs-target]:hover {
        background-color: white;
        box-shadow: 0 0 2px #0000;
        outline: none;
    }
    
    .carousel-indicators .active {
        background-color: #ffd800;
        box-shadow: 0 0 2px #0000;
        outline: none;
    }



.home-area .carousel .carousel-inner .carousel-item a {
    cursor: grab!important;
}


.carousel-control-next-icon {
    height: 4rem!important;
    width: 3rem!important;
}

.carousel-control-prev-icon {
    height: 4rem!important;
    width: 3rem!important;
}

/** CAROUSEL SLIDER END**/

/** HOME GAME QUICK **/
.approot .home-icon-title {
    max-width: 1132px;
    margin: 0 auto;
    width: 100%;
}

.home-area .home-game-quick {
    background: #1e1e1e;
    padding: 60px 0;
    z-index: 3;
}

.home-area .home-icon-title {
    align-items: center;
    color: white;
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
}

.home-area .home-icon-title i {
    align-items: center;
    border: 1px solid #ffd800;
    color: #ffd800;
    border-radius: 50%;
    display: flex;
    font-size: 30px;
    height: 60px;
    justify-content: center;
    margin-right: 20px;
    width: 101px;
}

.home-area .home-icon-title .title-text {
    display: flex;
    flex-direction: column;
}

.home-area .home-icon-title .title-text>:not(small) {
    font-size: 27px;
    margin-bottom: 8px;
    background-image: linear-gradient(180deg,#fdd800 22%,#ffd800 27%,#ffe400 78%);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    font-weight: 700;
    text-align: center;
    user-select: none;
}

.home-area .home-icon-title .title-text small {
    color: white;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.6;
    text-align: center;
}

.home-quick-box {
    display: grid;
    grid-template-columns: repeat(4,1fr);

}

.home-quick-box-item {
    cursor: pointer;
    height: 350px;
    margin: 0 3px;
    position: relative;
    width: 295px;
}

.home-quick-box-item .gametype-cover.sports {
    background-image: url(images/sports1.jpg);
}

.home-quick-box-item .gametype-cover.live {
    background-image: url(images/live1.jpg);
}

.home-quick-box-item .gametype-cover.slots {
    background-image: url(images/egame1.jpg);
}

.home-quick-box-item .gametype-cover.chess {
    background-image: url(images/chess1.jpg);
}

.home-quick-box-item .gametype-cover {
    height: 100%;
    position: relative;
    transform-style: preserve-3d;
    transition: all .8s;
    width: 100%;
}

.home-quick-box-item h4>div:first-child {
    font-size: 18px;
    letter-spacing: 1px;
    margin-bottom: 20px;
    font-weight: 600;
}

    .home-quick-box-item h4>div:last-child {
        font-size: 12px;
        color: #cbb7db;
    }

    .home-quick-box .home-quick-box-item h4{
        align-items: center;
        background: transparent url(images/box1.png) 50%/240px 69px no-repeat;
        bottom: 20px;
        color: #fff;
        display: flex;
        flex-direction: column;
        justify-content: center;
        left: 0;
        min-height: 69px;
        position: absolute;
        transition: bottom .5s cubic-bezier(.5,-.5,.5,1.5);
        animation-timing-function:cubic-bezier(.18,.89,.32,1.28);
        width: 100%;
        z-index: 2;
    }

    .home-quick-box .home-quick-box-item:hover h4 {
        bottom: 35px;
    }

    .home-quick-box .home-quick-box-item:hover .gametype-cover {
        transform: rotateY(1turn);
    }

    .home-quick-box .home-quick-box-item .gametype-cover:after {
        background-color: rgba(0,0,0,.3);
        content:"";
        height: calc(100% - 4px);
        left: 2px;
        position: absolute;
        top: 2px;
        transition: background-color .3s;
        transition-delay: .3s;
        width: calc(100% - 4px);
    }

    .home-quick-box .home-quick-box-item:hover .gametype-cover:after {
        background-color: rgba(0,0,0,.8);
    }

.home-area .app-download {
    position: relative;
    overflow: hidden;
    padding-top: 5px;
}

    .app-download .app-download-container {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        background-color: #272626;
        border-radius: 15px;
        background-size: cover;
        box-shadow: -0.01rem -0.04rem 0.1rem 0 hsla(0,0%,100%,.1);
    }

    .app-download .app-download-container .section-qr {
        padding: 50px 38px 40px 80px;
        width: 55%;
    }

    .app-download .app-download-container .section-slider {
        width: 50%;
    }

    .app-download .brand-container {
        position: relative;
        color: #fff;
        font-size: 22px;
        padding-left: 20px;
    }

    .app-download .brand-logo {
        position: absolute;
        left: 0;
        top: 0;
        width: 70px;
        height: 70px;
    }

    .app-download .brand-quote {
        font-size: 25px;
        padding-left: 65px;
        letter-spacing: 0.3px;
    }

    .app-download .brand-quote span, .app-download .brand-title span {
        color: #ffd800;
        font-weight: 700;
    }

    .app-download .brand-title {
        font-size: 28px; 
        padding-left: 65px;
        display: flex;
        gap: 8px;
        align-items: center;
    }

    .app-download .brand-title img {
        display: inline;
        width: 115px;
    }

    .qr-container {
        position: relative;
        padding-top: 50px;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
    }

    .app-download .qr-block {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        padding-right: 95px;
    }

    .app-download .qr-block .qr-code {
        line-height: 0;
        border-width: 4px;
        border-style: solid;
        border-color: white;
        border-image: initial;
        margin-right: 25px;
    }

        .app-download .qr-block .qr-code .qr-platform-icon img {
            width: 100%;
        }

    .app-download .qr-platform-icon {
        padding-top: 10px;
        width: 100px;
    }

    .qr-platform-ins {
        padding-top: 13px;
        cursor: pointer;
    }

/** HOME GAME QUICK END**/

/** SPORTS CONTENT **/

.home-area .home-sports {
    padding: 1px 0;
    margin-top: 90px;
    margin-bottom: 30px;
}

.home-area .home-welcome .step-container { 
    display: grid;
    grid-template-columns: 23% 23% 23% 23%;
    margin: 20px 0;
    width: 100%;
    justify-content: space-between;
    text-align: center;
}

.home-area .home-welcome .step-container .guide-box {
    padding: 15px;
    border-radius: 8px;
}

    .home-area .home-welcome .step-container .guide-box.box-0 {
       border: 1px solid red;
    }

    .home-area .home-welcome .step-container .guide-box.box-1 {
        border: 1px solid #67e49e;
    }

    .home-area .home-welcome .step-container .guide-box.box-2 {
        border: 1px solid #f7921a;
    }

    .home-area .home-welcome .step-container .guide-box.box-3 {
        border: 1px solid #f7f01a;
    }

.home-area .home-welcome .step-container .guide-box img {
    width: 113px;
    height: 96px;
}

.home-area .home-welcome .step-container .guide-box .guide-content {
    margin: 10px 8px 8px;
    word-break: break-word;
}

.home-area .home-welcome .step-container .guide-box .guide-content p {
    margin: 0;
    font-size: 14px;
    color: white;
}
  
.home-area .home-welcome .progress-bar-img {
    margin: 25px 0;
    border-bottom: 2px solid transparent;
    border-image: linear-gradient(0.25turn, rgb(251 2 2), rgb(79 255 111), rgb(255 111 20), rgb(233 255 50));
    border-image-slice: 1;
}

    .home-area .home-welcome .step-title-container {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 10px 0 0;
    }

    .home-area .home-welcome .step-title-container .step-title {
        width: 300px;
        text-align: center;
        font-size: 17px;
        letter-spacing: 0.2px;
        font-weight: 600;
    }

    .home-area .home-welcome .step-title-container .step-title:not(:last-child) {
        margin: 0 35px 0 0;
    }

    .home-area .home-welcome .step-title-container .step-title.title-0 {
        color: #ff4141;
    }

    .home-area .home-welcome .step-title-container .step-title.title-1 {
        color: #50c583;
    }

    .home-area .home-welcome .step-title-container .step-title.title-2 {
        color: #f7921a;
    }

    .home-area .home-welcome .step-title-container .step-title.title-3 {
        color: #f9f300;
    }

.games-banner {
    position: relative;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    display: flex;
    justify-content: center;
}

.games-banner .games-sec {
    width: 100%;
    height: 58vh;
    position: relative;
}

.games-banner .games-sec img {
    width: 100%;
    object-fit: cover;
    object-position: center center;
    display: inline-block;
    height: 100%;
}

.games-banner .games-sec .conts {
    position: absolute;
    left: 50%;
    height: 100%;
    width: 100%;
    top: 0;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    overflow: hidden;
    color: #fff;
}

    .games-banner .games-sec .conts .content {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        position: absolute;
        width: 30%;
        right: 20%;
        top: 17%;
        font-size: 25px;
    }

   .games-banner .games-sec .conts .content img {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 250px;
    }

    .games-banner .games-sec .conts .content .desc {
        color: white;
        font-size: 17px;
        text-align: center;
        font-size: 19px;
    }




/** SPORTS CONTENT **/

/** EGAME **/

.home-area .home-egame {
    background: #1e1e1e;
    padding: 60px 0;
    z-index: 3;
}

.home-egame .egame-container {
    margin: 0 auto;
    width: 1200px;
}

.home-area .home-egame .home-icon-title {
    max-width: 780px;
}

.home-egame .home-icon-title i{
    align-items: center;
    border: 1px solid #ffd800;
    border-radius: 50%;
    display: flex;
    font-size: 30px;
    height: 60px;
    justify-content: center;
    margin-right: 20px;
    width: 156px;
}

.egame-tab {
    background-color: #ffd800;
    border-radius: 6px;
    height: 92px;
    margin-bottom: 10px;
    overflow: hidden;
    width: 100%;
}

.egame-tab .egame-providers {
    height: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
}

    .egame-container .egame-providers>div {
        color: black;
        cursor: pointer;
        display: inline-block;
        font-size: 14px;
        font-weight: 600;
        height: 100%;
        text-align: center;
        user-select: none;
        vertical-align: middle;
        width: 125px;
    }

    .egame-container .egame-providers>div:hover {
        background-image: linear-gradient(#ffd650,#ffa034);
        color: white;
    }
    
    .egame-container .egame-providers>div.active{
        background-image: linear-gradient(#ffd650,#ffa034);
        color: white;
    }

    .egame-container .egame-providers>div.active .egame-pic img{
        filter: brightness(700%) grayscale(100%);
    }
    .egame-container .egame-providers div:before {
        margin: 0 auto;
    }

.egame-content {
    background: url(images/gamebox.png) 50%/cover no-repeat;
    overflow: hidden;
    position: relative;
}

.egame-content:before{
    content: "";
    float: left;
    padding-bottom: 23%;
    width: 100%;
}
.egame-games {
    box-sizing: border-box;
    display: grid;
    grid-template-columns: repeat(50,1fr);
    height: 230px;
    padding: 25px;
    position: absolute;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
}

    .egame-games li {
        align-items: center;
        border: 1px solid #ffcd22;
        display: flex;
        flex: 1;
        flex-direction: column;
        justify-content: center;
        margin: 0 4px;
        position: relative;
        text-align: center;
    }

        .egame-games li img {
            height: 110px;
            margin: 0 auto 10px;
        }

        .egame-games li .title {
            color:  white;
            font-size: 14px;
        }

.egame-games li .link-cover {
    align-items: center;
    background-color: rgba(0,0,0,.8);
    display: flex;
    height: 100%;
    justify-content: center;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: opacity .3s ease;
    width: 100%;
}

    .egame-games li .link-cover button {
        padding: 0;
        transform: scale(.9);
        white-space: nowrap;
        width: 80%;
    }

    .egame-games li .link-cover .add-fav {
        display: none;
    }

    .egame-games li:hover .link-cover {
        opacity: 1;
    }

    .nrc-button {
        background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#eaee0e 99.39%),#ffc908;
        border: 0;
        border-radius: 3px;
        padding: 10px;
        color: black;
        cursor: pointer;
        display: flex;
        align-items: center;
        font-size: 15px;
        font-weight: 700;
        width: 50%;
        height: 40px;
        box-shadow: 0px 2px 10px #41413494;
        transition: .2s ease;
        text-decoration: none;
        justify-content: center;
    }

    .nrc-button:hover {
        background-color: #ffa41c;
        color: black;
    }

    .resume-item .nrc-button:hover {
        background: #ffa41c;
    }

    .nrc-button.app {
        font-size: 13px;
        padding: 10px;
        height: 30px;
        width: 100%;
    }

    .nrc-button.history {
        margin-top: 15px;
        width: 100%;
    }

.home-egame .home-jp {
    align-items: center;
    display: flex;
    height: 45px;
    justify-content: center;
    left: -7px;
    margin: 0 auto;
    position: relative;
    top: -45px;
    user-select: none;
    width: 315px;
}

.home-egame .home-jp .home-jp-gp h2 {
    color: white;
    font-size: 14px;
    padding-right: 5px;
}

.home-egame .home-jp .home-jp-digi {
    color: #ffd800;
    font-size: 19px;
    width: 120px;
}

    .is-animated {
        animation: .2s zoom-in;
    }

    @keyframes zoom-in {
        0% {
         transform: scale(.2);
        } 
        100% {
          transform: none;
        }
      }


/** EGAME END **/

/** HOME MOBILE **/

.home-area .home-mobile {
    background: url(images/home3.jpg) 50%/cover no-repeat;
    height: 500px;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

/** HOME MOBILE END **/

/** HOME SERVICE **/
.home-area .home-service {
    background-color: #1e1e1e;
    display: block;
    line-height: 1.6;
    padding:  15px 0 50px;
    text-align: center;
}

.home-area .metal-title {
    display: flex;
    font-size: 30px;
    font-weight: 600;
    justify-content: center;
    margin-bottom: 20px;
}

.metal-title .golden {
    padding-right: 8px;
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-image: linear-gradient(180deg,#fdd800 22%,#ffd800 27%,#ffe400 78%);
    display: block;
    line-height: 1.2;
    position: relative;
}

.metal-title .silver {
    color: white;
    display: block;
    line-height: 1.2;
    position: relative;
}

.home-subtitle {
    color: white;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 20px;
}

.pie-list {
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    padding: 0 20px;
}

.pie-list li {
    align-items: center;
    display: flex;
    height: 150px;
    justify-content: center;
    padding: 0;
    position: relative;
    width: 133px;
}

    .pie-list li .pie-ani {
        background-image: url(images/pie-white.png);
        background-position: 50%;
        background-repeat: no-repeat;
        height: 85px;
        position: relative;
        width: 95px;
    }

    .pie-list li .pie-ani .pie-content {
        align-items: center;
        display: flex;
        height: 100%;
        justify-content: center;
        padding-top: 10px;
        width: 100%;
    }

    .pie-list li .pie-ani .pie-content .num {
        color: black;
        display: inline;
        font-weight: 700;
        font-size: 33px;
    }

    .pie-list li .pie-ani .pie-content .unit {
        bottom: -24px;
        color: #ffd800;
        font-weight: 500;
        display: inline;
        z-index: 20;
        font-size: 15px;
        position: absolute;
    }

    .pie-list li .pie-ani img {
        left: -20px;
        position: absolute;
        top: -19.5px;
    }

        .pie-list li .pie-ani .mask {
            height: 133px;
            left: 47px;
            overflow: hidden;
            position: absolute;
            top: -20px;
            transform-origin: left;
            width: 67px;
        }

        .pie-list li .pie-ani .mask>div {
            height: 133px;
            left: 0;
            overflow: hidden;
            position: absolute;
            top: 0;
            width: 67px;
        }

        .pie-list li .pie-ani .mask>div>div {
            border: 15px solid rgb(26 25 25 / 90%);
            border-radius: 50%;
            box-sizing: border-box;
            height: 133px;
            overflow: hidden;
            position: absolute;
            right: 0;
            top: 0;
            width: 133px;
        }

        .pie-list li .pie-ani .filter {
            height: 133px;
            left: -20px;
            overflow: hidden;
            position: absolute;
            top: -20px;
            width: 67px;
        }

        .pie-list li .pie-ani .filter > div {
            height: 133px;
            left: 0;
            overflow: hidden;
            position: absolute;
            top: 0;
            width: 67px;
        }

        .pie-list li .pie-ani .filter>div>div {
            border: 15px solidrgba(229,229,229,.8);
            border-radius: 50%;
            box-sizing: border-box;
            height: 133px;
            left: 0;
            overflow: hidden;
            position: absolute;
            top: 0;
            width: 133px;
        }

        .pie-list li .pie-ani .mask.over-half > div {
            animation: mask1 .7s linear .7s infinite both;
            animation-delay: 2.7s;
            animation-fill-mode: forwards;
            animation-iteration-count: 1;
            transform: rotate(0);
            transform-origin: left;
        }

        .pie-list li .pie-ani .mask.half > div {
            animation: mask2 .7s linear .7s infinite both;
            animation-delay: 2.7s;
            animation-fill-mode: forwards;
            animation-iteration-count: 1;
            transform: rotate(0);
            transform-origin: left;
        }

        .pie-list li .pie-ani .pie1>div {
            animation: pie1 .6s linear;
            animation-delay: 2s;
            animation-fill-mode: forwards;
            animation-iteration-count: 1;
            transform: rotate(0deg);
            transform-origin: right;
        }

        .pie-list li .pie-ani .pie2 > div {
            animation: pie2 .7s linear;
            animation-delay: 2s;
            animation-fill-mode: forwards;
            animation-iteration-count: 1;
            transform: rotate(0deg);
            transform-origin: right;
        }

        .pie-list li .pie-ani .pie3 > div {
            animation: pie3 1.05s linear;
            animation-delay: 2s;
            animation-fill-mode: forwards;
            animation-iteration-count: 1;
            transform: rotate(0deg);
            transform-origin: right;
        }

        .pie-list li .pie-ani .pie4 > div {
            animation: pie4 .6s linear;
            animation-delay: 2s;
            animation-fill-mode: forwards;
            animation-iteration-count: 1;
            transform: rotate(0deg);
            transform-origin: right;
        }

        @keyframes pie1 {
            0%{
                transform:rotate(0deg)
            }
            to{
                transform:rotate(175deg)
            }
        }
        @keyframes pie2 {
            0%{
                transform:rotate(0deg)
            }
            to{
                transform:rotate(181deg)
            }
        }
        @keyframes pie3 {
            0%{
                transform:rotate(0deg)
            }
            to{
                transform:rotate(138deg)
            }
        }
        @keyframes pie4 {
            0%{
                transform:rotate(0deg)
            }
            to{
                transform:rotate(181deg)
            }
        }
        @keyframes mask1 {
            0%{
                transform:rotate(0deg)
            }
            to{
                transform:rotate(115deg)
            }
        }
        @keyframes mask2 {
            0%{
                transform:rotate(0deg)
            }
            to{
                transform:rotate(150deg)
            }
        }

.pie-list li >.pie-text {
    bottom: -43px;
    left: 50%;
    line-height: 1;
    position: absolute;
    text-align: center;
    transform: translateX(-50%);
    white-space: nowrap;
}

.pie-list li>.pie-text h5 {
    color: #ffd800;
    font-size: 12px;
    font-weight: 700;
    margin: 5px 0 6px;
    text-transform: uppercase;
}

.pie-list li>.pie-text p {
    color: white;
    font-size: 16px;
    font-weight: 700;
}


/** HOME SERVICE END **/

/** HOME FEATURE **/

.home-area .home-feature {
    background-color: #1e1e1e;
    padding: 40px 20px 0;
}

.home-feature .feature-list {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 auto;
    text-align: left;
}

.home-feature .feature-list li {
    align-items: center;
    display: flex;
    margin-bottom: 40px;
    width: calc(50% - 50px);
}

    .home-feature .feature-list li .img.feature1 {
        background-image: url(images/a1.png);
    }
    .home-feature .feature-list li .img.feature2 {
        background-image: url(images/a2.png);
    }
    .home-feature .feature-list li .img.feature3 {
        background-image: url(images/a3.png);
    }
    .home-feature .feature-list li .img.feature4 {
        background-image: url(images/a4.png);
    }

.home-feature .feature-list li .img {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    height: 75px;
    width: 75px;
}

.home-feature .feature-list li .feature-content {
    line-height: 1.8;
    padding-left: 30px;
    width: calc(100% - 75px);
}

.feature-content h4 {
    color: #ffd800;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 8px
}

.feature-content p {
    color: white;
    font-size: 14px;
}

/** HOME FEATURE ENDS **/

/** ABOUT US **/

.general-layout {
    background-color: #3c3c3c;
    box-sizing: border-box;
    color: #777;
    font-size: 14px;
    line-height: 1.8;
    margin: auto;
    min-height: 650px;
    padding: 50px 100px;
    position: relative;
}

    .general-layout .gr-menu {
        left: 0;
        position: absolute;
        text-align: center;
        top: 0;
        width: 220px;
        margin-top: 65px;
    }

    .general-layout .gr-menu ul {
        list-style-type: none;
        margin-top: 65px;
        padding: 0;
    }

    .general-layout li {
        display: list-item;
        margin: 3px 0;
    }

    .general-layout .gr-menu li a {
        color: #fff;
        cursor: pointer;
        display: block;
        line-height: 20px;
        padding: 15px 0;
        text-decoration: none;
        width: 100%;
    }

    .general-layout a {
        font-size: 15px;
    }

        .general-layout .gr-menu li a.active, .general-layout .gr-menu li a:hover {
            background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#eaee0e 99.39%),#ffc908;
            box-shadow: 0px 0px 8px #c1b870;
            color: black;
            font-weight: 700;
        }

    .aboutus-tab-group .nav-link {
        padding: 0px!important;
    }

    .aboutus-tab-group .nav-link.active {
        background-color: transparent;
    }

    .aboutus-tab-group ul li {
        padding: 0px;
        margin: 0;
    }    

    .aboutus-tab-group .nav-link.active a {
        background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#eaee0e 99.39%),#ffc908;
        box-shadow: 0px 0px 8px #c1b870;
        color: black;
        font-weight: 700;
    }

.general-layout .cont {
    box-sizing: border-box;
    color: #777;
    font-size: 14px;
    left: 99px;
    line-height: 1.8;
    position: relative;
    width: calc(100% - 110px);
}

    .general-layout h1 {
        color: #ffd800;
        font-size: 23px;
        margin: 0.67em 0;
        font-weight: 700;
    }

    .general-layout h3 {
        color: #ffd800;
        font-size: 1.2em;
        margin: 1em 0;
        font-weight: 700;
    }

    .general-layout p {
        margin: 0.25em 0;
        color: #fff;
    }

    .article-detail h4 {
        color: white;
        font-weight: 700;
        font-size: 15px;
        margin-top: 25px;
    }

    .article-detail p {
        color: rgb(187 187 187);
        font-weight: 500;
        margin-bottom: 10px;
        font-size: 13px;
    }

.social-links {
    display: flex;
    align-items: center;
}

.social-btn {
    cursor: pointer;
    height: 60px;
    width: 60px;
    color: #fff;
    border-radius: 3px;
    box-shadow: 0px 10px 10px rgba(0,0,0,0.1);
    text-shadow: 0 1px 3px #967302;
    background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#eaee0e 99.39%),#ffc908;
    margin: 5px;
    transition: 1s;
    text-decoration: none;
}

.social-btn:hover {
    padding-left: 15px;
    padding-right: 15px;
    width: 230px;
    border-radius: 3px;
    background-position: 0 0;
    box-shadow: 0 2px 2px 1px rgba(6,8,15,.1),0 4px 4px 1px rgba(6,8,15,.1),0 8px 8px 1px rgba(6,8,15,.1),0 16px 16px 1px rgba(6,8,15,.1),0 32px 32px 1px rgba(6,8,15,.1),inset 0 0 3px 0#ffdd8f;
    text-shadow: 0 1px 3px #967302;
    color: white;
    gap: 8px;
}

    .social-btn i {
        color: #fff;
    }

    .social-btn span {
        width: 0px;
        overflow: hidden;
        transition: 0.5s;
        text-align: center;
    }

    .social-btn:hover span {
        padding: 2px;
        width: max-content;
    }

.vip_benefits table {
    border: 2px solid #ffd800;
    color: #fff;
    border-radius: 5px;
}

table.dataTable.no-footer {
    border-bottom: 1px solid #ffd800 !important;
}

.vip_benefits table thead {
    background-color: #ffd800;
}

.vip_benefits table thead tr th {
    text-align: center;
    border-right: 1px solid rgba(0,0,0,.2);
}

table.dataTable thead th {
    padding: 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    font-weight: bold;
    font-size: 14px;
    color: black;
}

.vip_benefits table tbody tr td {
    padding: 10px;
    font-size: 13px;
    letter-spacing: 0.4px;
    text-align: center;
    border-right: 1px solid rgba(0,0,0,.2);
    vertical-align: bottom;
}

table tbody tr td img {
    max-height: 30px !important;
}


/** ABOUT US END **/

/** PROMOTION **/

.section-promo {
    min-height: calc(100vh - 375px);
    padding: 40px 0;
}

.main-wrap.promotion {
    display: block;
}

.section-promo .promo_menu {
    margin-bottom: 20px;
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
}

    .section-promo .promo_menu .pmbox{
        padding: 0 15px;
        background-color: #000;
        color: #fff;
        font-size: 14px;
        height: 53px;
        line-height: 53px;
        margin-right: 5px;
        margin-top: 15px;
        min-width: 135px;
        font-weight: 700;
        opacity: .9;
        text-align: center;
        cursor: pointer;
        transition: .2s ease;
    }

    .section-promo .promo_menu .pmbox:hover{
        background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#eaee0e 99.39%),#ffc908;
        color: black;
        opacity: 1;
    }

    .section-promo .promo_menu .pmbox.active{
        background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#eaee0e 99.39%),#ffc908;
        color: black;
        font-weight: 700;
        opacity: 1;
    }

.promo_box {
    display: block;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 24px;
    position: relative;
}

.promo_box .promo_bx {
    cursor: pointer;
    margin: 10px 0;
    width: calc(33.3% - 30px);
    transition: .3s ease;
    background: #141414;
    overflow: hidden;
    border-radius: 7px;
    padding-bottom: 38px;
    position: relative;
}

    .promo_box .promo_bx:hover {
        transform: translateY(3px);
    }
    
.promo_box .promo_bx img {
    border-radius: 7px;
}

.promo_box .promo_bx .content-box {
    position: relative;
    z-index: 1;
    margin: -16px 20px;
    background: #3b3b3b;
    padding: 14px 15px;
    border-radius: 7px;
    color: #fff;
}

    .promo_box .promo_bx .content-box .title {
        font-size: 17px;
        font-weight: 600;
        line-height: 20px;
        margin-bottom: 5px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .promo_box .promo_bx .content-box .time {
        font-size: 12px;
        line-height: 20px;
        width: 100%;
        min-height: 15px;
        letter-spacing: .5px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: #b4b4b4;
        display: flex;
        align-items: center;
    }

    .promo_box .promo_bx .content-box .time::before {
        content: "";
        font-size: 12px;
        letter-spacing: .5px;
        display: inline-block;
        position: relative;
        width: 14px;
        height: 14px;
        margin-right: 5px;
        vertical-align: middle;
        background: url(images/icon-time.png) no-repeat center/cover;
    }

    .promo_box .promo_bx .content-box .time span {
        margin-right: 5px;
    }


    .promo_box .promo_bx .content-box .cta-box {
        display: flex;
        justify-content: flex-end;
        align-items: center;
        padding: 0 6px 6px;
        position: relative;
        z-index: 2;
        gap: 4px;
        margin-top: 25px;
    }

    .promo_box .promo_bx .content-box .cta-box .more-btn {
        background-color: initial;
        border: 1px solid #fff;
        min-width: 100px;
        border-radius: 5px;
        cursor: pointer;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 14px;
        font-weight: 500;
        color: #fff;
        margin-left: 10px;
        padding: 4px;
        text-decoration: none;
    }

    .promo_box .promo_bx .content-box .cta-box .promo-btn {
        background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#eaee0e 99.39%),#ffc908;
        border: 1px solid transparent;
        min-width: 100px;
        border-radius: 5px;
        cursor: pointer;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 14px;
        font-weight: 600;
        color: black;
        margin-left: 10px;
        padding: 4px;
        text-decoration: none;
        transition: .3s;
    }

    .promo_box .promo_bx .content-box .cta-box .promo-btn:hover {
        background-color: #ffa41c;
    }


#login {
    top: 25%!important;
}

    .modal-content {
        max-height: 80vh;
        border: 1px solid black;
        background-color: #1e1e1e;
    }
    
    .modal-dialog {
        border-radius: 10px;
        height: 80vh;
        max-width: 1110px;
        position: relative;
        width: 70vw;
        justify-content: center;
    }

    .modal-verify {
        max-width: 400px;
    }

    .modal-header {
        background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#eedb0e 99.39%),#ffc908;
        height: 50px;
        color: black;
        font-weight: 700;
        padding: 0 20px;
        font-size: 28px;
    }

    .modal-header i {
        color: black!important;
        cursor: pointer;
    }

    .modal-dialog .modal-content .fixed-pt {
        background-color: rgba(204,204,204,.1);
        box-shadow: 1px 0 0 0 rgb(204 204 204 / 30%);
        box-sizing: border-box;
        height: calc(100% - 50px);
        position: absolute;
        max-width: 350px;
        padding: 15px;
        top: 50px;
        transition: .2s ease;
        width: 35%;
        z-index: 1;
    }

    .modal-dialog .modal-content .fixed-pt img{
        display: block;
        width: 100%;
    }

    .modal-dialog .modal-content .fixed-pt h1.title{
        font-size: 18px;
        line-height: 1.4;
        margin: 15px 0;
        color: white;
    }

    .modal-dialog .modal-content .toggle-btn i{
        align-items: center;
        display: none;
        color: #3e1283;
        background-color: rgba(239,239,239,.9);
        border-radius: 50%;
        box-shadow: 0 1px 5px rgba(0,0,0,.5);
        font-size: 16px;
        line-height: 1;
        text-indent: -2px;
        text-transform: none;
        transition: .3s ease;
        justify-content: center;
        position: absolute;
        right: -14px;
        top: 50%;
        transform: translateY(-20%);
        width: 30px;
        height: 30px;
        z-index: 10;
        cursor: pointer;
    }

        .modal-dialog .modal-content .toggle-btn i:hover {
            background-color: #efefef;
            transform: translateY(0.5px);
            color: #611dcb;
        }

        .modal-dialog .modal-content .toggle-btn.min:after {
            content: "\f061";
            text-indent: 3px;
        }

        .modal-dialog .modal-content .fixed-pt.min {
            padding: 10px;
            width: 0%;
        }

        .modal-dialog .modal-content .fixed-pt.min h1.title, .modal-dialog .modal-content .fixed-pt.min img {
            display: none;
        }

 .modal-body.promox{
    box-sizing: border-box;
    height: calc(100% - 50px);
    margin: 0 0 0 35%;
    overflow: auto;
    padding: 10px;
    width: 65%;
}

    .modal-body.promox.active{
        margin-left: 0;
        padding: 20px 50px 80px;
        width: 100%;
    }

.nrc-editor-view {
    height: auto;
    line-height: 1.4;
    font-size: 13px;
    padding: 3px;
    color:  white;
}

    .nrc-editor-view p {
        word-wrap: break-word;
        margin-bottom: 22px;
    }
    
    .nrc-editor-view >p:empty {
        height: 14px;
    }

    .nrc-editor-view ol {
        list-style-type: decimal;
    }

    .nrc-editor-view li {
        margin: 1em 0 1em -0.5em;
    }

    .nrc-editor-view table tbody tr td {
        border: 1px solid grey;
        padding: 3px 2px;
        width: 140px;
    }

    .modal-dialog .modal-content .apply-btn {
        background: transparent;
        bottom: 0;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        left: 0;
        max-width: 350px;
        padding: 20px;
        position: absolute;
        transition: .2s ease;
        width: 35%;
        z-index: 5;
        gap: 5px;
    }

    .modal-dialog .modal-content .apply-btn button {
        box-shadow: 0 2px 10px rgb(0 0 0 / 20%);
        cursor: pointer;
        transition: .3s ease;
    }

    .modal-dialog .modal-content .apply-btn button:hover {
        transform: translateY(2px);
      
    }

    .modal-content .nrc-button {
        font-size: 15px;
        height: 35px;
        padding: 0 30px;
        box-shadow: 0px 2px 10px #ffbd2b;
        width: 100%;
    }

    .modal-dialog .modal-content .apply-btn.active {
        max-width: 100%;
        width: 100%;
    }

/** PROMOTION END **/

/** DOWNLOAD **/

.qr {
    overflow: hidden;
    position: relative;
}

.qr .main-wrap {
    margin: auto;
    position: relative;
    width: 1200px;
}

.qr .main-block {
    align-items: center;
    background: #5801d8 url(images/qr-bg.jpg) 50%/cover no-repeat;
    display: flex;
    height: calc(100vh - 300px);
    min-height: 720px;
    overflow: hidden;
    width: 100%;
}

.qr .mobile-block {
    height: 867px;
    position: absolute;
    right: -80px;
    top: 60%;
    transform: translateY(-48%) scale(.9);
    width: 852px;
}

.qr .mobile-block .m-screen {
    height: 522px;
    left: 254px;
    position: absolute;
    top: 147px;
    width: 294px;
    z-index: 1;
}

    .qr .mobile-block:before {
        background: url(images/qr-ball.png) 50%/cover no-repeat;
    }

    .qr .mobile-block:after {
        background: url(images/qr-screen.png) 50%/cover no-repeat;
    }

    .qr .mobile-block:after, .qr .mobile-block:before {
        content: "";
        height: 100%;
        position: absolute;
        transition: .4s ease;
        width: 100%;
    }

    .qr .mobile-block .m-screen img {
        display: block;
        height: 100%;
        width: 100%;
    }

    .qr .mobile-block .m-screen:after {
        background: linear-gradient(55deg,transparent 66%,hsla(0,0%,100%,.05) 0);
        content: "";
        height: 100%;
        left: 0;
        position: absolute;
        top: 0;
        transition: .4s ease;
        width: 100%;
    }

    .qr .mobile-block:hover:before {
        transform: scale(1.2);
    }

    .qr .mobile-block:hover .m-screen:after {
        opacity: 0;
    }

.qr .qr-block {
    background-color: rgba(17,17,17,.6);
    border-radius: 15px;
    box-sizing: border-box;
    color: #fff;
    font-size: 14px;
    font-weight: 100;
    line-height: 1.5;
    margin-left: 80px;
    padding: 20px 70px;
    position: relative;
    text-align: center;
    width: 450px;
}

.qr .qr-block:after {
    background: url(images/qr-ball2.png) 50%/cover no-repeat;
    content: "";
    height: 867px;
    left: -200px;
    position: absolute;
    top: -180px;
    transform: scale(.9);
    width: 852px;
}

.qr .qr-block h2 {
    font-size: 24px;
    font-weight: 700;
    height: 1.5;
    padding-top: 20px;
    white-space: nowrap;
}

.qr .qr-block .des {
    border-bottom: 1px solid #fff;
    padding-bottom: 20px;
    padding-top: 10px;
}

    .qr .qr-block .qrcode {
        font-size: 15px;
        padding-top: 8px;
    }

    .qr .qr-block .qrcode .qr-item {
        display: flex;
        justify-content: space-between;
        padding: 15px 0;
    }
    
    .qr .qr-block .qrcode>div {
        font-size: 13px;
        text-align: center;
    }

    .qr-item .qr-android img, .qr-item .qr-ios img {
        padding: 5px;
        background-color: rgb(255, 255, 255);
        margin: auto;
        box-sizing: content-box;
        width: 100px;
        height: 100px;
    }

    .qr .qr-block .qrcode>div h6 {
        margin-top: 5px;
    }

/** DOWNLOAD END **/

/** VIP CONTENT **/

.vip-info-page-wrapper {
    display: flex;
    flex-direction: column;
    margin: auto;
    max-width: 1200px;
}

.vip-info-page-wrapper>div.vip-info-bg>img {
    display: block;
    width: 100%;
}

.vip-info-page-wrapper>div.vip-level-slider {
    align-items: center;
    display: flex;
    height: 310px;
    justify-content: center;
}

    .vip-info-page-wrapper>div.vip-level-slider .swiper {
        height: 60%;
        max-width: 630px;
        width: 50%;
    }

    .vip-info-page-wrapper>div.vip-level-slider .swiper .swiper-slide img {
        border-radius: 10px;
    }

    .vip-info-page-wrapper>div.vip-level-slider .swiper .swiper-button-next {
        right: -100px;
    }

    .vip-info-page-wrapper>div.vip-level-slider .swiper .swiper-button-prev {
        left: -100px;
    }

    .vip-info-page-wrapper>div.vip-level-slider .swiper .swiper-slide {
        align-items: center;
        display: flex;
        height: 100%;
        justify-content: center;
    }

    .vip-info-page-wrapper>div.vip-level-slider .swiper .swiper-pagination {
        bottom: -40px;
    }

        .swiper-pagination-bullet {
            background: #fabb2e!important;
        }

        .swiper-button-next, .swiper-button-prev {
            color: #fabb2e!important;
        }

.vvip.app-body {
    background: #111;
}

    



.vip-reward-info {
    align-items: flex-start;
    display: flex;
    font-size: 14px;
    justify-content: center;
    margin: 50px 0;
}

.vip-reward-info .info-table {
    background: #3c3c3c;
    padding: 0 25px;
    width: 1200px;
}

.vip-reward-info .info-table .info-title {
    color: #454545;
    font-size: 20px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 600;
    letter-spacing: normal;
    line-height: normal;
    line-height: 4.5;
    text-align: center;
}

.vip-table2 {
    padding-top: 20px;
}

.vip-table2 table {
    width: 100%;
    color: white;
}

.vip-table2 table tr th {
    padding: 12px;
    width: 16%;
    text-align: center;
}

.vip-table2 table tr td {
    padding: 12px;
    width: 16%;
    text-align: center;
}

    .vip-table2 table tr.heading th:first-child, .vip-table2 table tr td:first-child {
        width: 20%;
        text-align: left;
    }

.vip-table2 table tr.heading th {
    border-bottom: 0.01rem solid #ffd800;
}

.vip-table2 table tr.titleRow td img {
    height: 24px;
}

    .vip-table2 table tr.titleRow td>p {
        display: inline-block;
        vertical-align: middle;
        align-items: center;
    }

    .vip-table2 table tr.titleRow td p {
        font-size: 17px;
        font-weight: 600;
        line-height: 19px;
        color: #ffd800;
        padding-left: 12px;
        padding-top: 18px;
        letter-spacing: 0.4px;
    }

    .vip-table2 table tr.contentRow td:first-child {
        text-align: left;
        font-size: 14.5px;
        font-weight: 600;
        line-height: 17px;
        color: white;
        padding-left: 44px;
    }

    .vip-table2 table tr.contentRow td {
        font-size: 14px;
        font-weight: 400;
        line-height: 19px;
        color: white;
    }



.index_tab {
    color: white;
    border: 2px solid #fabb2e;
    padding: 20px;
    margin-top: 20px;
    margin-bottom: 40px;
    background-color: #565656;
    -webkit-box-shadow: 0px 0px 6px 0px rgb(218 150 1 / 86%);
    box-shadow: 0px 0px 6px 0px rgb(218 150 1 / 86%);
    border-radius: 7px;
}

.index_tab ol {
    margin-top: 15px;
    line-height: 2;
}

.bg-content-section .vip-panel {
    height: 100%;
    line-height: 0;
}

    .bg-content-section .vip-panel .slider {
        height: 500px;
        width: 100%;
        object-fit: cover;
    }

    .bg-content-section .vip-panel .slider .slider-container { 
        width: 100%;
        height: 100%;
        position: relative;
    }

    .bg-content-section .vip-panel .slider .slider-container>div { 
        width: 100%;
        height: 100%;
        background-image: url(images/vip-banner.png);
        display: block;
        justify-content: center;
        background-position: center center;
        object-fit: cover;
    }

    .bg-content-section .vip-panel .slider .slider-container>div>div {
        position: relative;
    }

    .bg-content-section .vip-panel .slider .slider-container>div>div img {
        width: 100%;
        height: 100%;
    }

    .bg-content-section .vip-panel .slider .slider-container .container .content.ww {
        width: 52%;
    }

    .bg-content-section .vip-panel .slider .slider-container .container .content {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        word-break: break-word;
        text-align: left;
        height: 100%;
        padding-bottom: 100px;
        padding-top: 100px;
        width: 42%;
    }

    .bg-content-section .vip-panel .slider .slider-container .container .content .title {
        text-transform: uppercase;
        font-weight: 700;
        margin-bottom: 30px;
        color: #ffd800;
        font-size: 20px;
        line-height: 20px;
        letter-spacing: 0.3px;
    }

    
    .bg-content-section .vip-panel .slider .slider-container .container .content .desc {
        font-size: 13px;
        color: white;
        line-height: 18px;
    
    }

    .bg-content-section .vip-panel .slider .slider-container .container .content .desc>p {
        margin-bottom: 20px;
    }

    
.vip-panel .vip-box {
    width: 100%;
    margin: auto;
}

.vip-panel .vip-box .vip-status {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 20px auto 30px;
    width: 100%;
    border-bottom: 1px solid #3e3b2f;
}

    .vip-panel .vip-box .vip-status .status-img {
        width: 320px;
        position: absolute;
        left: 1%;
        top: -50%;
        object-fit: cover;
    }

    .vip-panel .vip-box .vip-status .progress-status {
        width: 70%;
        margin-bottom: 30px;
    }

    .vip-panel .vip-box .vip-status .progress-status .current-status {
        width: 100%;
        position: relative;
    }

    .vip-panel .vip-box .vip-status .progress-status .current-status .status-title {
        font-weight: 700;
        font-size: 16px;
        line-height: 8px;
        color: #ffd800;
        margin-left: 5px;
    }

    .vip-panel .vip-box .vip-status .progress-status .current-status .progress-bar {
        position: relative;
        overflow: hidden;
        height: 40px;
        margin-top: 20px;
        border-radius: 80px;
        background: repeating-linear-gradient(35deg,#3b3f4c,#3b3f4c 0.15rem,#111 0,#111 0.2rem);
    }

    .vip-panel .vip-box .vip-status .progress-status .current-status .progress-bar>span {
        position: relative;
        display: block;
        height: 100%;
    }

    .vip-panel .vip-box .vip-status .progress-status .current-status .progress-bar>span:after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        background: repeating-linear-gradient(35deg,#977c32,#977c32 0.15rem,#111 0,#111 0.2rem);
    }



.vip-reward-info .container {
    overflow: auto;
    width: 100%;
    padding: 0px;
    white-space: nowrap;
    width: 100%;
    max-width: 1100px;
    margin: 0px;
    border-radius: 25px;
}


.vip-reward-info .container .vip-table {
    border-collapse: collapse;
    table-layout: fixed;
}

.vip-reward-info .container .vip-table tr {
    display: table-row;
    vertical-align: middle;
    border-color: inherit;
    text-align: center;
}

    .vip-reward-info .container .vip-table tr td {
        align-items: flex-start;
        vertical-align: inherit;
        color: #ffd800;
        font-size: 15px;
        padding: 0 20px;
        letter-spacing: 0.2px;
        line-height: 20px;
        padding-bottom: 10px;
        text-align: center;
    }

    .vip-reward-info .container .vip-table tr td:first-child {
        text-align: left;
        font-size: 14px;
        line-height: 25px;
        color: #a9acb6;
        position: sticky;
        top: 0;
        background: #0c0c0c;
        overflow: hidden;
        padding-right: 7px !important;
        left: 0 !important;
    }

    .vip-reward-info .container .vip-table tr td img {
        max-width: 87px;
        height: 100%;
        max-height: 100%!important;
    }


    .vip-reward-info .container .vip-table .table-type {
        border-bottom: 1px solid #3e3b2f;
    }

    .vip-reward-info .container .vip-table .table-type td {
        font-weight: 700;
        padding-bottom: 20px;
        font-size: 15px;
    }

    .vip-reward-info .container .vip-table .table-type td:first-child {
        font-size: 18px;
        font-weight: 700;
        line-height: 10px;
        letter-spacing: 0.4px;
        color: #ffd800;
        padding-left: 10px;
        position: sticky;
        top: 0;
        background: #0c0c0c;
        overflow: hidden;
        padding-right: 7px !important;
        left: 0 !important;

    }
    
    .vip-reward-info .container .vip-table .table-type td:not(:first-child) {
        padding-top: 7px;
    }


    .vip-reward-info .container .vip-table .table-type td.type-silver {
        color: rgb(208 223 87);
    }

    .vip-reward-info .container .vip-table .table-type td.type-rose {
        color: rgb(247 167 167);
    }

    .vip-reward-info .container .vip-table .table-type td.type-gold {
        color: rgb(252 94 110);
    }

    .vip-reward-info .container .vip-table .table-type td.type-platinum {
        color: rgb(55 168 255);
    }

    .vip-reward-info .container .vip-table .table-type td.type-diamond {
        color: rgb(114 223 135);
    }

    .vip-reward-info .container .vip-table .table-type td.type-royal {
        color: rgb(240, 199, 131);
    }

    .vip-reward-info .container .vip-table tr td.content-title {
        text-align: left;
        font-size: 15px;
        font-weight: 600;
        line-height: 10px;
        color: #ffd800;
        padding-top: 25px;
        padding-bottom: 15px;
    }

    .vip-reward-info .container .vip-table tr:not(:first-child):not(:nth-child(2)) td:first-child {
        padding-left: 10px;
        padding-right: 60px;
        position: sticky;
        top: 0;
        background: #0c0c0c;
        overflow: hidden;
        padding-right: 20px !important;
        left: 0 !important;
    }

    .tnc-title {
        text-transform: uppercase;
        font-weight: 700;
        margin-bottom: 30px;
        color: #ffd800;
        font-size: 17px;
        line-height: 20px;
        letter-spacing: 0.3px;
        text-align: center;
    }

    .tnc-desc {
        margin-top: 15px;
        font-size: 14px;
        letter-spacing: 0.2px;
    }

    .vip-reward-info .container.second {
        white-space: normal;
    }


.red {
    color: red;
    font-weight: 600;
}

/** VIP CONTENT END **/

/** SLOTS CONTENT **/

.app-body.egame {
    background: linear-gradient(0deg,#0b0b0b,#12191c);
    overflow: hidden;
    height: 100%;
}

.egame .egame-main {
    margin: 0px auto;
    min-height: 600px;
    position: relative;
    width: 1200px;
}

.slots-games .container .slots-games-items {
    display: flex;
    margin-top: 0px;
    padding-bottom: 5px;
}

    .slots-games .container .slots-games-items .brand-list {
        width: 250px;
        height: 100%;
        border-bottom-left-radius: 5px;
        border-top-left-radius: 5px;
        background: #282828;
        padding-left: 15px;
        padding-right: 5px;
    }

    .slots-games .container .slots-games-items .brand-list .ck_filter {
        display: flex;
        height: 58px;
        width: 100%;
        align-items: center;
        border-bottom: 0.01rem solid rgba(77,79,85,.4);
        font-size: 14px;
        color: rgba(162,170,189,.5);
        transition: color .3s;
        cursor: pointer;
    }

    .slots-games .container .slots-games-items .brand-list .ck_filter a {
        background: transparent;
        padding: 0;
        text-decoration: none;
        display: flex;
        width: 100%;
        gap: 5px;
        color: white;
        font-size: 15px;
        align-items: center;
        font-weight: 500;
        opacity: .4;
        word-wrap: break-word;
        text-align: center;
        transition: .3s;
    }

    .slots-games .container .slots-games-items .brand-list .ck_filter.is-checked a, .slots-games .container .slots-games-items .brand-list .ck_filter a:hover {
        color: #ffd800;
        opacity: 1;
    }

    .slots-games .container .slots-games-items .brand-list .ck_filter a img {
        width: 35px;
        filter: grayscale(100%) brightness(100%);
    }

    .slots-games .container .slots-games-items .brand-list .ck_filter a:hover img, .slots-games .container .slots-games-items .brand-list .ck_filter.is-checked a img {
        filter: grayscale(0%);
    }


    .slots-games-items .slots-games-right {
        margin-right: 35px;
        margin-left: 30px;
        padding-top: 12px;
        position: relative;
        min-height: 50vh;
    }

    .slots-games-items .slots-games-right .type-nav-box {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 10px;
    }

    .slots-games-items .slots-games-right .type-nav-box .type-list {
        display: flex;
        align-items: center;
        margin: 0;
        padding-left: 0px;
    }

    .slots-games-items .slots-games-right .type-nav-box .type-list li {
        height: 20px;
        padding: 0 20px;
        font-size: 15px;
        color: rgba(162,170,189,.5);
        transition: color .3s;
        cursor: pointer;
    }

    .slots-games-items .slots-games-right .type-nav-box .type-list li span.active, .slots-games-items .slots-games-right .type-nav-box .type-list li span:hover {
        color: #ffd800; 
    }

    .slots-games-items .slots-games-right .type-nav-box .type-list li:not(:last-child) {
        border-right: 1px solid #45484d;
    }

    .slots-games-items .slots-games-right .type-nav-box .type-list li span {
        transition: color .2s;
    }

    .slots-games-items .slots-games-right .type-nav-box .search-box {
        height: 20px;
        border: 1px solid #40444d;
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 15px 15px;
        transition: background .3s ease-in-out .1s,box-shadow .5s ease-in-out,border .3s ease-in-out .1s;
    }

    .slots-games-items .slots-games-right .type-nav-box .search-box input {
        border: none;
        background: transparent;
        color: white;
        font-size: 14px;
        letter-spacing: 1px;
    }

    .slots-games-items .slots-games-right .type-nav-box .search-box input:focus {
        box-shadow: none;
    }

    .slots-games-items .slots-games-right .type-nav-box .search-box i {
        color: rgba(162,170,189,.5);
    }

/* Pagination */

.page-navigation {
    margin-bottom: 3px;
}

.page-navigation .previous_link,
.page-navigation .next_link,
.page-navigation .go_to_page,
.pagination-game .prev-page,
.pagination-game .next-page,
.pagination-game .page-number{
    text-decoration: none;
    color: white;
    border-color: transparent;
    padding: 10px 13px;
    justify-content: center;
    text-align: center;
    display: inline-flex;
    transition: 0.4s;
    background: #343434;
    align-items: center;
    font-weight: 500;
    font-size: 13px;
}

    .page-navigation .go_to_page:hover {
        transition: 0.4s;
    }

.page-navigation .previous_link,.pagination-game .prev-page { 
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    position: relative;
    transition: 0.4s;
    border: none;
}

.page-navigation .next_link,.pagination-game .next-page {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    transition: 0.4s;
}

.page-navigation .previous_link:hover, 
.page-navigation .previous_link:active, 
.page-navigation .next_link:hover, 
.page-navigation .next_link:active, 
.page-navigation .go_to_page:hover, 
.page-navigation .go_to_page:active, 
.page-navigation .go_to_page.active_page,
.pagination-game .page-number.active,
.pagination-game .next-page:hover,
.pagination-game .prev-page:hover,
.pagination-game .page-number:hover{
    background: #ffd800;
    align-items: center;
    transition: 0.4s;
    color: black;
}

.cursor-pointer {
    cursor: pointer;
}

    .page-navigation.navigation-mission a{
        background: unset;
    }

    .page-navigation.navigation-mission .go_to_page {
        padding: 4px 10px;
        border-radius: 3px;
    }

   
/* Pagination */

.game-content {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    padding: 0;
    margin-top: 20px;
}

.game-content li {
    width: auto;
    height: 160px;
    margin-right: 15px;
    margin-bottom: 20px;
    overflow: hidden;
    border-radius: 10px;
    background: #131313;
    margin-bottom: 20px;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s,-webkit-transform .3s;
    cursor: pointer;
}

.game-content li:hover {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
    box-shadow: 0 0.1rem 0.04rem #121111;
}

    .game-content li:not(:nth-child(5n)) {
        margin-right: 20px;
    }

    .game-content li .img-box {
        width: 100%;
        height: 115px;
        position: relative;
        display: block!important;
        overflow: hidden;
        background-size: 100% 100%;
    }

    .game-content li .img-box .hover-box {
        transition: opacity .3s,-webkit-transform .3s;
        transition: transform .3s,opacity .3s;
        transition: transform .3s,opacity .3s,-webkit-transform .3s;
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        opacity: 1;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: rgba(31,6,7,.79);
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
    }

    .game-content li:hover .img-box .hover-box {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;  
    }

.nrc-button.lobby {
    width: 70%;
    text-transform: uppercase;
    font-size: 13px;
    height: 30px;
}

.game-content li > p {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 5px;
    font-size: 13px;
    color: #a2aabd;
    position: relative;
    transition: .3s;
    height: 40px;
}

    .game-content li:hover > p {
        color: white;
    }

    .game-content li > p > span {
        width: 145px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .game-content li > p .fav, .game-content li > p i:hover {
        color: #ffd800;
    }

    .game-content li > p i {
        font-size: 16px;
        color: #414244;
        transition: 0.3s ease-in-out;
    }




    .game-content li > p:before {
        transition: background .5s;
        content: "";
        position: absolute;
        background: #8a7605;
        height: 3px;
        left: 0;
        bottom: 0;
        width: 100%;
    }

    .game-content li:hover > p:before, .game-content li:hover > p:after {
        background: #ffd800;
    }

    .game-content li > p:after {
        transition: background .5s;
        content: "";
        position: absolute;
        background:#8a7605;
        width: 75px;
        height: 4px;
        left: 20px;
        bottom: 2px;
        -webkit-transform: perspective(0.5em) rotateX(8deg);
        transform: perspective(0.5em) rotateX(8deg);
    }

.segame-providers {
    display: flex;
    left: 0px;
    overflow: auto;
    position: absolute;
    top: -20%;
    width: 100%;
    z-index: 1;
    justify-content: center;
}


.segame-gplogo {
    color: #444;
    cursor: pointer;
    font-size: 14px;
    height: 90px;
    position: relative;
    text-align: center;
    transition: color .4s;
    white-space: nowrap;
    width: 60px;
}

.segame-gplogo>span {
    bottom: 0;
    display: block;
    left: 20px;
    line-height: 20px;
    overflow: hidden;
    position: absolute;
}

    .segame-gplogo.active {
        color: black;
    }

    .segame-gplogo img {
        z-index: 88;
        background-color: #000;
        border-radius: 50%;
        content: "";
        height: 60px;
        left: 0;
        position: absolute;
        top: 0;
        transition: background-color .4s;
        width: 60px;
        z-index:11;
    }

    .segame-gplogo.active img{
        background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(198 122 14 / 10%) 48.43%,#ff9e16 99.39%),#ffe46c;
    }

    .segame-gplogo.active span{
        color: black;
        font-weight: 900;
    }


.segame-gplogo+.segame-gplogo {
    margin-left: 16px;
}

.segame-item {
    background-color: #000;
    background-image: linear-gradient(45deg,#141414 25%,transparent 0),linear-gradient(-45deg,#141414 25%,transparent 0),linear-gradient(45deg,transparent 75%,#141414 0),linear-gradient(-45deg,transparent 75%,#141414 0);
    background-size: 16px 16px;
    border-radius: 8px;
    box-shadow: inset 0 0 16px 4px #000;
    float: left;
    height: 190px;
    line-height: 1;
    margin: 0 12px 12px 0;
    overflow: hidden;
    perspective: 475px;
    position: relative;
    width: 190px;
}

.segame-tools {
    margin-top: 184px;
    
}

    /**  .segame-item:first-of-type {
        height: 392px;
        perspective: 980px;
        width: 392px;
    }**/

    .segame-item:before {
        bottom: 26px;
        color: #ffdc42;
        font-weight: 400;
        content: attr(data-gameprovider);
        left: 14px;
        position: absolute;
        text-shadow: 0 1px 5px #ffe1ac;
        z-index: 1;
        font-size: 18px;
    }

    .segame-item>.title {
        background-image: linear-gradient(180deg,transparent 0,rgba(0,0,0,.1) 5%,#000 70%);
        bottom: 0;
        color: #fff;
        font-size: 14px;
        height: 50px;
        left: 0;
        line-height: 30px;
        padding: 20px 0 0 14px;
        position: absolute;
        text-shadow: 0 1px 5px #000;
        width: 100%;
    }

    .segame-item>.img {
        height: 100%;
    }

    .segame-item>.img>img {
        display: block;
        height: 100%;
        width: 100%;
    }

    .segame-item>.link-cover {
        align-items: center;
        background-color: rgba(0,0,0,.8);
        display: flex;
        flex-direction: column;
        height: 100%;
        justify-content: space-evenly;
        left: 0;
        position: absolute;
        top: 0;
        transform: rotateX(-105deg);
        transform-origin: 50% 0;
        transform-style: preserve-3d;
        transition: transform .3s linear;
        width: 100%;
        z-index: 1;
    }

.segame-item>.link-cover>.nrc-button {
    background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#eaee0e 99.39%),#ffc908;
    font-weight: 800;
    height: 40px;
    line-height: 40px;
    padding: 0 10px;
    transition: background-color .4s,transform .4s;
    width: 80%;
    text-align: center;
    text-decoration: none;
    color: black;
}

.segame-item:hover > .link-cover {
    transform: rotate3d(0,0,0,0deg);
}

.segame-item > .link-cover > .nrc-button:hover {
    box-shadow: 0 1px 0 rgba(255,255,255,.8),inset 0 2px 4px rgba(71, 70, 70, 0.5),0 1px 6px 2px rgba(0,0,0,.8);
    transform: scale3d(1.05,1.05);
    
}

/** SLOTS CONTENT END **/

/** SPORTS CONTENT **/

.section-row {
    min-height: calc(100vh - 375px);
    padding: 60px 0;
    width: 1200px;
}

.replaceimgdetect img {
    max-width: 85%!important;
}

.nav-tabs {
    border-bottom: none;
}

.game_products {
    display: flex !important;
    justify-content: center;
    transition: all 300ms ease;
    grid-gap: 14px;
    align-items: center;
    height: 100%;
    justify-content: center;
    text-align: center;
    flex-wrap: wrap;
    margin-bottom: 25px;
}

    .game_products .nav-item .nav-link {
        width: 170px;
        height: 75px;
        background: #1e2022;
        border-radius: 8px;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 5px;
        overflow: hidden;
        transition: -webkit-transform .6s;
        transition: transform .6s;
        transition: transform .6s,-webkit-transform .6s;
        position: relative;
        transition: .6s;
        opacity: .6;
    }

    .game_products .nav-item .nav-link:before {
        transition: background .5s;
        content: "";
        position: absolute;
        height: 3px;
        left: 0;
        bottom: 0;
        width: 100%;
        background: #ffe400;
    }

    .game_products .nav-item .nav-link:after {
        width: 80px;
        height: 4px;
        bottom: 2px;
        -webkit-transform: perspective(0.5em) rotateX(8deg);
        transform: perspective(0.5em) rotateX(8deg);
        transition: background .5s;
        content: "";
        position: absolute;
        background: #ffe400;
    }

    .game_products .nav-item .nav-link.active, .game_products .nav-item .nav-link:hover {
        -webkit-transform: translateY(-15px);
        transform: translateY(-15px);
        opacity: 1;
    }

    .game_products .nav-item .nav-link img {
        transition: .3s;
    }

    .game_products li .nav-link img {
        filter: grayscale(100%) brightness(180%);
        opacity: .4;
    }

    .game_products li .nav-link:hover img, .game_products li .nav-link.active img{
        filter: grayscale(0%);
        opacity: 1;
    }


.inner_main .nav-item .nav-link {
    padding: 0;
    border: transparent;
}


    .tab_bar_title_sec_inner {
        font-size: 35px;
        font-weight: 700;
        color: #ffd800;
        text-shadow: 0px 1px 1px #685f5f;
        margin-bottom: 10px;
        line-height: normal;
    }

    .tab_bar_dec {
        font-size: 16px;
        justify-content: center;
        color: black;
        display: none;
    }

    .game_products_btn {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 30px;
        border: none;
        background: none;
    }

    .game_products_btntext {
        position: absolute;
        color: #ffffff;
        font-size: 22px;
        font-weight: 700;
    }

/** SPORTS CONTENT END **/

/** DAILY CHECKIN CONTENT  **/
.white-container.checkin {
    min-height: 400px;
}

.daily-checkin-title {
    display: flex;
    align-items: center;
    justify-content: center;
}

.checkin-coin {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
}

.checkin-coin-total {
    background-image: linear-gradient(180deg,#fdd800 22%,#ffd800 27%,#ffe400 78%);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    font-weight: 600;
    margin: 0;
    font-size: 2.3rem;
    line-height: 2.75rem;
}

.checkin-coin svg:first-child  {
    margin-right: 0.5rem;
    width: 1.875rem;
    height: 1.875rem;
}

.checkin-coin svg:last-child  {
    margin-left: 0.1875rem;
    width: 1.875rem;
    height: 1.875rem;
}

.checkin-wraper {
    margin-top: 0.75rem;
}

    .checkin-ul {
        list-style: none;
        margin: 0;
        margin-top: 15px;
        padding: 0 0.625rem;
        display: flex;
        justify-content: space-between;
    }

    .daily-checkin {
        width: 5.9rem;
        text-align: center;
        color: rgba(0,0,0,.6);
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        justify-content: start;
        margin-right: 25px;
    }

    .daily-checkin.active {
       color: #461496;
    }

    .daily-checkin-height {
        height: 8rem;   
        width: 100%;
        text-align: center;
        border-radius: 4px;
        border: 1px solid rgba(255 0 266 / 4%);
        background: rgb(255 255 255 / 85%);
        box-shadow: 3px 3px 8px #fffbc7;
        position: relative;
        overflow: hidden;
        backdrop-filter: blur(5px);
    }

        .daily-checkin-height.active {
            background-image: linear-gradient(45deg, #0045c7, #ff2c7d);
            border: 1px solid rgba(255 255 255 /49%);
            backdrop-filter: blur(5px);
        }  
        
    .daily-checkin-num {
        color: #3c3939;
        top: 0.75rem;
        font-size: 15px;
        font-weight: 700;
        line-height: .875rem;
        position: absolute;
        width: 100%;
        padding: 7px;
        left: 50%;
        transform: translateX(-50%);
    }

        .daily-checkin-num.active{
            color: white;
        }

    .daily-checkin-img {
        width: 2.3rem;
        height: 2.3rem;
        bottom: 0.75rem;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        border-radius: 50%;
        border: 1px solid rgb(253 255 0 / 68%);
    }

    .daily-checkin-img.active {
        width: 2.3rem;
        height: 2.3rem;
        bottom: 0.75rem;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        border: none;
    }

        .daily-checkin-height:after {
            animation: shadowlight 2.5s infinite both;
            background-color: rgb(255 255 255 / 36%);
            content: "";
            height: 10%;
            position: absolute;
            top: 40%;
            left: -30%;
            transform: translate3d(80%,0,0) rotate(45deg);
            width: 250%;
        }

        @keyframes shadowlight {
            0% {
                transform: translate3d(-60%,0,0) rotate(-45deg);
            }
        
            to {
                transform: translate3d(60%,0,0) rotate(-45deg);
            }
        }


    .daily-checkin-date {
        margin-top: 0.375rem;
        font-size: .9rem;
        line-height: .875rem;
        font-weight: 400;
        color:white;
    }

        .daily-checkin-date.active {
            color: #ffd800;
            font-weight: 600;
        }

        .daily-checkin-btn {
            display: block;
            width: auto;
            border-radius: 30px;
            border: none;
            color: black;
            font-weight: 600;
            background: none;
            background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#eaee0e 99.39%),#ffc908;
            box-shadow: 0px 0px 9px #b2a565;
            height: 45px;
            font-size: 14px;
            margin: 25px auto 0;
            padding: 0 30px;
        }


/** DAILY CHECKIN END  **/

/** MY PROFILE CONTENT  **/

.main-wrap2 {
    margin: 0 auto; 
    position: relative;
}

.app-body .signup {
    margin-top: 35px;
}

.main-header {
    position: relative;
}

.white-container2 {
    background-color: #000;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: 0 2px 4px 0rgba(0,0,0,.25);
    padding: 20px 40px 40px;
    height: 71px;
}

.white-container3 {
    background-color: #3c3c3c;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    box-shadow: 0 2px 4px 0rgba(0,0,0,.25);
    padding: 20px 40px 40px;
    margin-bottom: 40px;
}

.white-container2  ul  {
    list-style: none;
    position: absolute;
    top: 0px;
    left: 0px;
    align-items: center;
    width: 95%;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    margin-left: 35px;
    display: flex;
    justify-content: flex-start;
}

.white-container2 ul li {
    display: inline-block;
    height: 70px;
    width: auto;
}

    .white-container2 ul li a {
        color: #efefef;
        cursor: pointer;
        font-size: 16px;
        font-stretch: normal;
        font-style: normal;
        font-weight: 500;
        line-height: 2;
        height: 100%;
        transition: .1s ease;
        gap: 4px;
        width: auto;
        padding: 0 25px;
        text-decoration: none;
        align-items: center;
        display: flex;
        flex-direction: column;
        justify-content: center;
        text-align: center;
    }

    .white-container2 ul li a span {
        font-size: 13px;
    }

    .white-container2 ul li a i {
        display: block;
        font-size: 25px;
        width: 100%;
        align-items: center;
        justify-content: center;
    }

    .white-container2 ul li a.active, .white-container2 ul li a:hover {
        background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#eaee0e 99.39%),#ffc908;
        color: black;
        font-weight: 500;
    }

    .white-container2 ul li a.active {
        font-weight: 600;
    }

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

.tips-info-a {
    position: relative;
    box-shadow: 0 2px 4px rgba(0,0,0,.5);
    margin-bottom: 25px;
    border-radius: 5px;
    text-align: left;
    white-space: normal;
}

.tips-info-a.verify-tips {
    padding: 12px 15px;
    border: 1px solid #fffe00;
    background-color: #241e08;
}

    .tips-info-a::before {
        content: '\f05a';
        font-family: "Font Awesome 6 Pro";
        font-weight: 600;
        font-size: 16px;
        position: absolute;
        top: 15px;
        left: 18px;
        width: 0.9375rem;
        height: 0.9375rem;
        vertical-align: sub;
        width: 0.9375rem;
        height: 0.9375rem;
        color: #ffee26;
    }

    .tips-title-box {
        justify-content: space-between;
        margin-bottom: 10px;
        display: flex;
        flex-flow: row nowrap;
        align-items: center;
        margin: 0;
    }

    .tips-title-box h6 {
        flex: 1;
        width: 100%;
        align-items: center;
    }

    .tips-info-a.verify-tips p {
        display: block;
        color: #ffee26;
        position: relative;
        left: 25px;
        top: 8px;
        margin-bottom: 5px;
    }

    .tips-title-box h6 p {
        flex: 1;
        width: 100%;
        font-size: 13px;
        font-weight: 400;
        vertical-align: text-top;
    }

    .tips-info-a ol {
        font-size: 14px;
        text-align: left;
        vertical-align: top;
    }

    .tips-info-a.verify-tips ol {
        display: flex;
        flex-flow: row nowrap;
        justify-content: space-between;
        width: 100%;
        padding-top: 10px;
        border-top: 1px dotted #fffe00;
        padding-left: 0;
        list-style: none;
        margin: 0;
    }

    .tips-info-a.verify-tips ol .info-personal {
        flex: 1 1 16%;
    }

    .tips-info-a.verify-tips ol .info-contact {
        flex: 1 1 16%;
    }

    .tips-info-a.verify-tips ol > li:last-child {
        margin-right: 0;
    }

    .tips-info-a.verify-tips ol > li {
        margin-right: 10px;
        padding: 10px 10px 10px;
        line-height: 1.2;
        list-style: none;
    }

    .tips-info-a.verify-tips label::before {
        content: "";
        display: inline-block;
        margin-right: 5px;
        vertical-align: sub;
        width: 3px;
        height: 15px;
        border-radius: 5px;
    }

    .info-personal label::before {
        background: #ffae17;
    }

    .info-contact label::before {
        background: #ff6817;
    }

    .info-personal label {
        color: #ffae17;
    }

    .info-contact label {
        color: #ff6817;
    }

    .tips-info-a.verify-tips label {
        display: block;
        margin-bottom: 10px;
        font-size: 13px;
        font-weight: 700;
    }

    .tips-info-a.verify-tips ul {
        padding-left: 0;
        list-style: none;
    }

    .tips-info-a.verify-tips .pass {
        padding-left: 35px;
    }

    .tips-info-a ul {
        display: inline-block;
        width: 100%;
        font-size: 13px;
        text-align: left;
        vertical-align: top;
    }

    .tips-info-a ul li {
        list-style: disc outside;
    }
    
    .info-personal li {
        background: rgb(146 146 146 / 15%);
        color: #ffae17;
        display: inline-block;
        padding: 5px 15px;
        border-radius: 15px;
        vertical-align: middle;
        cursor: pointer;
    }

    .info-contact li {
        background: rgb(146 146 146 / 15%);
        color: #ff6817;
        display: inline-block;
        padding: 5px 15px;
        border-radius: 15px;
        vertical-align: middle;
        cursor: pointer;
    }



.profile>div:first-child {
    margin-right: 50px;
    width: 690px;
}

.profile>div:last-child {
    width: 480px;
}

.section-block2 .header {
    border-bottom: 1px solid #ccc;
    height: 38px;
    margin-bottom: 10px;
    padding: 0 10px 10px;
    gap: 10px;
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.section-block2 .header .titles {
    align-items: baseline;
    display: flex;
    flex: 1 1 16%;
}

.section-block2 .header h3 {
    background-image: linear-gradient(180deg,#fdd800 22%,#ffd800 27%,#ffe400 78%);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    font-size: 19px;
    font-weight: 700;
    user-select: none;
}

.section-block2 .header .profile-btn {
    text-decoration: none;
    background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(247 222 140 / 23%) 48.43%,#ffd946a3 99.39%),#ffb308;
    border: 1px solid transparent;
    border-radius: 5px;
    color: black;
    font-size: 13px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 600;
    height: 33px;
    padding-top: 5px;
    padding-left: 20px;
    padding-right: 20px;
    transition: .3s;
    box-shadow: 0px 1px 6px #c98d07;
}

    .section-block2 .header .profile-btn:hover {
        text-decoration: none;
        background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#ffd634 99.39%),#ffcf22;
        box-shadow: 0px 2px 10px #978a52;
    }

.profile-btn {
    text-decoration: none;
    background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(247 222 140 / 23%) 48.43%,#ffd946a3 99.39%),#ffb308;
    border: 1px solid transparent;
    border-radius: 5px;
    color: black;
    font-size: 14px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 800;
    height: 36px;
    padding-top: 1px;
    padding-left: 20px;
    padding-right: 20px;
    transition: .3s;
    box-shadow: 0px 2px 10px #ba9ac9;
    letter-spacing: 0.2px;
}

.profile-btn:hover {
    text-decoration: none;
    background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#ffd634 99.39%),#ffcf22;
    box-shadow: 0px 2px 10px #978a52;
}

.resume-details {
    padding: 20px 0;
}

.resume-details div.resume-item {
    align-items: center;
    color: #363636;
    display: flex;
    justify-content: space-between;
    font-size: 16px;
    line-height: 1.2;
    margin-bottom: 15px;
}

    .resume-details div.resume-item p.title {
        margin-right: 20px;
        text-align: left;
        font-size: 14px;
        color: #fff;
        width: 20%;
        font-weight: 600;
        margin-bottom: 0px;
        user-select: none;
    }

    .resume-details div.resume-item p.value {
        color: #fff;
        font-size: 14px;
        text-align: left;
        width: 70%;
    }

    .resume-details div.resume-item .nrc-form-input {
        width: 70%;
        text-align: left;
        display: flex;
        position: relative;
    }

    .resume-details div.resume-item .nrc-form-input i {
        color: white;
        position: absolute;
        right: 0;
        top: 9px;
        padding-right: 10px;
        cursor: pointer;
        font-size: 17px;
        transition: .3s;
    }

    .resume-details div.resume-item .nrc-form-input i:hover {
        color: #ffe00a;
    }

    .resume-details div.resume-item .nrc-form-input .tick {
        color: lime;
        cursor: unset;
    }

    .resume-details div.resume-item .nrc-form-input .tick:hover {
        color: lime;
    }



    .profile-promo img {
        width: 100%;
        margin-bottom: 8px;
        transition: .3s ease;
    }

    .profile-promo img:hover {
        transform: translateY(3px);
    }

.box {
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 2px;
    overflow: hidden;
    position: relative;
    box-shadow: 0px 2px 10px #9f99a2;
    transition: .3s ease;
}

    .box:hover {
        transform: translateY(3px);
    }

    .profile .box {
        align-items: center;
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
        height: 90px;
        padding-right: 20px;
        margin-bottom: 25px;
    }

    .profile .box.bank-card {
        margin-bottom: 20px;
    }

.profile .box .title {
    background-image: linear-gradient(180deg,#787878,#3c3b3b);
    border-bottom: 1px solid #ccc;
    box-sizing: border-box;
    color: #fff;
    display: flex;
    flex-direction: column;
    height: 100px;
    justify-content: center;
    padding: 0 16px;
    position: relative;
    width: 125px;
    font-size: 14px;
}

    .profile .box .title:after {
        border-bottom: 99px solid #fff;
        border-left: 16px solid transparent;
        content: "";
        height: 0;
        position: absolute;
        right: 0;
        top: 0;
    }

    .profile .box .info {
        flex: 1;
        padding-left: 10px;
    }


.profile .box.wallets.game .title {
    background-image: linear-gradient(180deg,#7b7b7b 20%,#c3c3c3 100%);
    color: #fff;
}

.turnover-winover {
    font-size: 24px;
    font-weight: 700;
}


.profile .box .info .card-no, .profile .box .info .bank {
    color: rgb(148, 148, 148);
    font-size: 13px;
}

.profile .box .info .card-name {
    color: rgb(83, 83, 83);
    font-size: 14px;
}

.profile .box .btn {
    border: 1px solid #ffc908;
    border-radius: 5px;
    color: #f5b400;
    cursor: pointer;
    height: 35px;
    font-weight: 600;
    font-size: 14px;
    margin-left: 10px;
    text-align: center;
    width: 114px;
    box-shadow: 0px 2px 10px #d39b33;;
}

    .profile .box .btn:hover {
        background-color: #ffc908;
        color: black;
    }

.profile .box .add-info {
    align-items: center;
    color: #c72828;
    cursor: pointer;
    display: flex;
    flex: 1;
    flex-direction: row;
    justify-content: center;
}

.profile .box .add-info i {
    font-size: 22px;
    margin-right: 10px;
}

    .profile .box .add-info .add-info-title {
        font-size: 17px;
        font-weight: 500;
    }

    .profile .box .add-info .add-info-dec {
        font-size: 13px;
    }

.profile .box.wallets .title {
    background-image: linear-gradient(180deg,#ff6e13 20%,#d6ac08 100%);
}

.profile .box .price {
    color: #ffab13;
    flex: 1;
    font-size: 26px;
    font-weight: 600;
    line-height: 100px;
    text-align: right;
}

.voucher-container {
    display: flex;
    flex-flow: row wrap;
    grid-gap: 10px;
}

.img-voucher{
    width: 100%;
    max-width: 140px;
    cursor: pointer;
    transform: scale(.95);
    transition: all .2s linear;
}

    .img-voucher:hover {
        width: 100%;
        max-width: 140px;
        cursor: pointer;
        transform: scale(.99);
        transition: all .2s linear;
    }

    .voucherp {
        text-align: justify;
        overflow-y: auto;
        color: black;
        font-size: 13px;
        margin-bottom: 0px!Important;
        line-height: 1.3;
    }

.list-details {
    border: 1px solid #ccc;
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    border-top: 0;
    overflow: hidden;
}

    .list-details div {
        height: 45px;
        padding: 0 20px;
        padding-top: 15px;
    }

    .list-details div {
        align-items: center;
        display: flex;
        justify-content: space-between;
    }

    .list-details div:nth-child(2n) {
        background-color: #f5f5f5;
    }

    .list-details div p {
        color: #282828;
        font-size: 14px;
        font-stretch: normal;
        font-style: normal;
        font-weight: 300;
    }

.form-group {
    margin-bottom: 1rem;
}

.form-group b {
    color: #3e1283;
}

.nrc-button.grey {
    background: #aaa!important;
}

.nrc-button.grey:hover {
    background: #c0bdbd;
}

.nrc-button.save:hover {
    background-color: #ffa41c;
    color: black;
}

.nrc-button.sms:hover {
    background-color: #ffa41c;
}

.nrc-button.sms {
    transition: .3s ease;
}
.nrc-button.sms:focus {
    transform: translateY(4px);
}

.flex-center {
    align-items: center;
    display: flex;
    justify-content: center;
}

    .flex-center a {
        width: auto;
        padding: 0 35px;
        text-decoration: none;
        align-items: center;
        display: flex;
        gap: 7px;
        justify-content: center;
        height: 44px;
    }

    .flex-center a:hover {
        text-decoration: none;
        align-items: center;
        display: flex;
        justify-content: center;
        color: white;
    }

.status-active {
    color: #8fc31f;
    font-weight: 600;
}   

.status-p, .value {
    color: white;
}

.nrc-form-input .Select-control:disabled, .nrc-form-input input:disabled {
    background-color: #2b2b2b;
}

    .choose-box2.betting {
        grid-template-columns: repeat(7,1fr);
        width: auto;
    }

    .choose-box2.col-5 {
        display: flex;
        flex-flow: row wrap;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 11px;
        width: auto;
        padding-left: 0rem!important;
    }

    .choose-box2 li, .choose-box2 label {
        position: relative;
        border-radius: 3px;
    }

    .boxx-content {
        flex: 0 0 14.5%;
        width: 19%;
        padding: 0 1px;
        margin: 0px -2px;
        text-align: center;
        cursor: pointer;
    }

    .choose-box2.betting .boxx-content {
        padding: 0;
        margin: 0;
        width: 160px;
    }

    .choose-box2 input {
        display: none;
    }

    .style-add-amount.facelift {
        margin: 0;
        display: block !important;
        padding: 4px 15px;
        overflow: hidden;
        transition: .3s;
        border: 1px solid rgba(255,255,255,.5);
        color: rgba(255,255,255,.5);
        cursor: pointer;
        text-align: center;
    }

    .choose-box2 [type=checkbox]:checked + label, .choose-box2 [type=radio]:checked + label {
        border-color: #ffe200;
        color: #ffdc00;
    }

    .choose-box2 p, .choose-box2 span {
        font-size: 12px;
        line-height: 1.25rem;
        margin-bottom: 0;
        margin-top: 2px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        letter-spacing: 0.3px;
        user-select: none;
    }

    .boxx-content label::after, .boxx-content label::before {
        content: "";
        position: absolute;
        transition: .3s;
        opacity: 0;
    }
    
    .boxx-content label::before {
        content: '\f00c';
        font-family: "Font Awesome 6 Pro";
        font-weight: 800;
        z-index: 2;
        right: 1px;
        bottom: 4px;
        width: 10px;
        height: 10px;
        font-size: 13px;
        width: 13px;
        height: 13px;
        color: #101935;
    }

    .boxx-content label::after {
        z-index: 1;
        right: 0;
        bottom: 0;
        width: 0;
        margin-right: 0px;
        height: 0;
        border-width: 0 0 20px 20px;
        border-style: solid;
        border-color: transparent transparent #ffe43c;
    }

    .boxx-content [type=checkbox]:checked + label::after, .boxx-content [type=checkbox]:checked + label::before, .boxx-content [type=radio]:checked + label::after, .boxx-content [type=radio]:checked + label::before {
        opacity: 1;
    }

    .filter-group label {
        font-size: 13px;
    }
    
    .tips-group {
        position: relative;
        border: 2px solid #ffa70d;
        background-color: rgb(0 0 0 / 47%);
        margin-bottom: 0.625rem;
        padding: 0.9375rem 1.25rem 0.9375rem 2.5rem;
        border-radius: 5px;
        text-align: left;
        white-space: normal;
    }

    .tips-group::before {
        content: '\f05a';
        font-family: "Font Awesome 6 Pro";
        font-weight: 600;
        font-size: 16px;
        position: absolute;
        top: 15px;
        left: 1.25rem;
        width: 0.9375rem;
        height: 0.9375rem;
        vertical-align: sub;
    }

    .tips-group .bet-info {
        width: 100%;
        display: inline-block;
        vertical-align: middle;
    }

    .tips-group .bet-info p {
        width: auto;
        margin-right: 6px;
        padding-right: 6px;
        border-right: 1px solid #fff;
        margin-bottom: 0px;
    }

    .tips-group b, .tips-group p {
        display: inline-block;
        color: #fff;
        font-size: 14px;
        text-align: left;
        vertical-align: middle;
    }

    .tips-group .bet-info p:last-child {
        font-size: 14px;
        margin-right: 0;
        padding-right: 0;
        border-right: 0;
    }

    .tips-group span {
        padding: 0 5px;
        color: #ffe43c;
        font-size: 14px;
        letter-spacing: 0.3px;
    }

    .dataTables_empty img {
        background-position: center center;
        justify-content: center;
        display: flex;
        align-items: center;
        vertical-align: middle;
        text-align: center;
        margin: auto;
        max-height: unset !important;
    }

    .dataTable-hover tbody tr:hover {
        color: #ffd800;
        cursor: pointer;
        transition: ease-in-out .5s;
    }


    .swipe-page-deposit, .swipe-page-withdrawal, .swipe-page-promotion, .swipe-page-transfer {
        -webkit-transition: opacity 1s;
        transition: opacity 1s;
        width: auto;
    }
    
        .swipe-page-deposit .container-player-group, .swipe-page-withdrawal .container-player-group, .swipe-page-promotion .container-player-group, .swipe-page-transfer .container-player-group {
            padding: unset;
            margin-bottom: 0;
            border-radius: 3px;
            background: transparent;
            box-shadow: unset;
            position: relative;
            width: 100%;
            margin-right: 2px;
        }
    
        .swipe-page-deposit.open, .swipe-page-withdrawal.open, .swipe-page-promotion.open, .swipe-page-transfer.open {
            opacity: 1;
            height: 100%;
            transform: scaleY(1);
        }
    
        .swipe-page-deposit.closed, .swipe-page-withdrawal.closed, .swipe-page-promotion.closed, .swipe-page-transfer.closed {
            display: none;
            opacity: 0;
            height: 0;
            transform: scaleY(0);
        }
    
    @-webkit-keyframes slide {
        0% {
            visibility: hidden;
            -webkit-transform: translateX(5rem);
            transform: translateX(5rem);
        }
    
        60% {
            -webkit-transform: translateX(-.3125rem);
            transform: translateX(-.3125rem);
        }
    
        to {
            visibility: visible;
            -webkit-transform: translateX(0);
            transform: translateX(0);
        }
    }
    
    @keyframes slide {
        0% {
            visibility: hidden;
            -webkit-transform: translateX(5rem);
            transform: translateX(5rem);
        }
    
        60% {
            -webkit-transform: translateX(-.3125rem);
            transform: translateX(-.3125rem);
        }
    
        to {
            visibility: visible;
            -webkit-transform: translateX(0);
            transform: translateX(0);
        }
    }
    
    @-webkit-keyframes bounce-point {
        0% {
            -webkit-transform: scale(.6);
            transform: scale(.6);
        }
    
        60% {
            -webkit-transform: scale(1.2);
            transform: scale(1.2);
        }
    
        to {
            -webkit-transform: scale(1);
            transform: scale(1);
        }
    }
    
    @keyframes bounce-point {
        0% {
            -webkit-transform: scale(.6);
            transform: scale(.6);
        }
    
        60% {
            -webkit-transform: scale(1.2);
            transform: scale(1.2);
        }
    
        to {
            -webkit-transform: scale(1);
            transform: scale(1);
        }
    }
    
    .swipe-page-account {
        -webkit-transition: opacity 1s;
        transition: opacity 1s;
        width: auto;
    }
    
        .swipe-page-account .container-player-group {
            padding: unset;
            margin-bottom: 0;
            border-radius: 3px;
            background: #313131;
            box-shadow: unset;
            position: relative;
            width: 100%;
            margin-right: 2px;
        }
    
        .swipe-page-account.open {
            opacity: 1;
            height: 100%;
            transform: scaleY(1);
        }
    
        .swipe-page-account.closed {
            opacity: 0;
            height: 0;
            transform: scaleY(0);
        }

.main-table-box {
    margin-bottom: 20px;
    position: relative;
    display: flex;
    width: 100%;
    align-items: center;
}

.btn-return {
    position: relative;
    padding: 5px 13px 5px 13px;
    transition: .3s;
    border: 1px solid #fff;
    border-radius: 3px;
    color: #fff;
    font-size: 12px;
    cursor: pointer;
    text-decoration: none;
    background-color: transparent;
}

    .btn-return:hover {
        border-color: #ffe00a;
        color: #ffe00a;
    }

    .btn-return:hover i {
        left: 5px;
    }

.main-table-box .bank-name-block {
    display: flex;
    align-items: center;
    position: absolute;
    right: 0;
    background: #2b2b2b;
    padding: 6px 10px;
    border-radius: 9px;
    color: #fff;
    gap: 5px;
}

.main-table-box .bank-name-block img {
    width: auto;
    height: 30px;
    margin-right: 5px;
}

.main-table-box .bank-name-block span {
    font-size: 13px;
    letter-spacing: 1.0px;
}

.details-box {
    display: grid;
    width: 100%;
    grid-template-columns: 60% 40%;
}

    .transaction-details-wrap.details, .transaction-details-wrap.timeline {
        background: rgb(0 0 0 / 51%);
        padding: 20px;
    }

    .transaction-details-wrap.details .title, .transaction-details-wrap.timeline .title {
        align-items: center;
        display: flex;
        justify-content: space-between;
    }

    .transaction-details-wrap.details .title h3, .transaction-details-wrap.timeline .title h3 {
        color: #ffe00a;
        font-size: 16px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        width: 100%
    }

    .transaction-details-wrap.details .timeline-wrap, .transaction-details-wrap.timeline .timeline-wrap {
        bottom: 0;
        margin: 10px 0;
        padding: 10px 0;
        margin-top: 5px;
        position: relative;
    }

    .transaction-details-wrap.details .timeline-wrap .timeline-block, .transaction-details-wrap.timeline .timeline-wrap .timeline-block {
        color: rgba(255, 255, 255, .6);
        display: grid;
        grid-template-columns: 4.375rem 4.375rem calc(100% - 8.75rem);
        margin-bottom: 18px;
        position: relative;
    }

    .transaction-details-wrap.details .timeline-wrap .timeline-block.current, .transaction-details-wrap.timeline .timeline-wrap .timeline-block.current {
        color: #fff;
    }

    .transaction-details-wrap.details .timeline-wrap .timeline-block .date, .transaction-details-wrap.timeline .timeline-wrap .timeline-block .date {
        display: flex;
        flex-direction: column;
    }

    .transaction-details-wrap.details .timeline-wrap .timeline-block.current .date, .transaction-details-wrap.timeline .timeline-wrap .timeline-block.current .date {
        margin-top: 0;
    }

    .transaction-details-wrap.details .timeline-wrap .timeline-block .date span, .transaction-details-wrap.timeline .timeline-wrap .timeline-block .date span {
        font-size: 12px;
        margin-top: 5px;
        text-align: right;
    }

    .transaction-details-wrap.details .timeline-wrap .timeline-block .date span + span, .transaction-details-wrap.timeline .timeline-wrap .timeline-block .date span + span {
        margin-top: 5px;
    }

    .transaction-details-wrap.details .timeline-wrap .timeline-block .point, .transaction-details-wrap.timeline .timeline-wrap .timeline-block .point {
        align-items: center;
        background: #fff;
        border-radius: 50%;
        box-shadow: 0.125rem 0.125rem 0 0 rgba(0,0,0,.1);
        display: flex;
        grid-column: 2 / span 1;
        height: 0.75rem;
        justify-content: center;
        justify-self: center;
        position: absolute;
        top: 1.25rem;
        width: 0.75rem;
        z-index: 1;
        left: 11px;
    }

    .transaction-details-wrap.details .timeline-wrap .timeline-block .bounce, .transaction-details-wrap.timeline .timeline-wrap .timeline-block .bounce {
        -webkit-animation: bounce-point .5s .8s;
        animation: bounce-point .5s .8s;
    }

    .transaction-details-wrap.details .timeline-wrap .timeline-block.current .point, .transaction-details-wrap.timeline .timeline-wrap .timeline-block.current .point {
        border: 0.1875rem solid #fff;
        box-shadow: 0.125rem 0.125rem 0 0 rgba(0,0,0,.1), inset 0.125rem 0.125rem 0 0 rgba(0,0,0,.1);
        height: 2.5rem;
        top: 0.3125rem;
        width: 2.5rem;
        z-index: 1;
        left: 14px;
    }

    .transaction-details-wrap.timeline .timeline-wrap.success .timeline-block.current .point, .transaction-details-wrap.timeline .timeline-wrap.success .timeline-block::before {
        background-color: rgb(73 137 76) !important;
    }

    .transaction-details-wrap.timeline .timeline-wrap.failed .timeline-block.current .point, .transaction-details-wrap.timeline .timeline-wrap.failed .timeline-block::before {
        background-color: #ba0808  !important;
    }

    .transaction-details-wrap.timeline .timeline-wrap.new .timeline-block.current .point, .transaction-details-wrap.timeline .timeline-wrap.new .timeline-block::before {
        background-color: #0a97e9  !important;
    }

    .transaction-details-wrap.timeline .timeline-wrap.processing .timeline-block.current .point, .transaction-details-wrap.timeline .timeline-wrap.processing .timeline-block::before {
        background-color: #6c757d  !important;
    }




    .transaction-details-wrap.details .timeline-wrap.success .timeline-block.current .point::before, .transaction-details-wrap.timeline .timeline-wrap.success .timeline-block.current .point::before {
        content: "\f00c";
        font: var(--fa-font-solid);
        position: relative;
        bottom: -1px;
        font-size: 20px;
        left: -5px;
    }

    .transaction-details-wrap.details .timeline-wrap.failed .timeline-block.current .point::before, .transaction-details-wrap.timeline .timeline-wrap.failed .timeline-block.current .point::before {
        content: "\f00d";
        font: var(--fa-font-solid);
        position: relative;
        bottom: -1px;
        font-size: 20px;
        left: -5px;
    }

    .transaction-details-wrap.details .timeline-wrap.processing .timeline-block.current .point::before, .transaction-details-wrap.timeline .timeline-wrap.processing .timeline-block.current .point::before {
        content: "\f456";
        font: var(--fa-font-solid);
        position: relative;
        bottom: -1px;
        font-size: 20px;
        left: -5px;
    }

    .point {
        color: white;
        font-weight: 700;
        font-size: 18px;
        letter-spacing: 0.3px;
        padding-left: 10px;
        position: absolute;
        top: 8px;
        right: 17px;
    }

    .transaction-details-wrap.details .timeline-wrap .timeline-block::before, .transaction-details-wrap.timeline .timeline-wrap .timeline-block::before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 100px;
        width: 4px;
        height: calc(100% + 29px);
        border-radius: 10px;
    }

    .transaction-details-wrap.details .timeline-wrap .timeline-block, .transaction-details-wrap.timeline .timeline-wrap .timeline-block:first-child .transaction-details-wrap.details .timeline-wrap .timeline-block:first-child::before, .transaction-details-wrap.timeline .timeline-wrap .timeline-block:first-child::before {
        display: none;
    }

    .transaction-details-wrap.details .timeline-wrap .timeline-block:last-child::before, .transaction-details-wrap.timeline .timeline-wrap .timeline-block:last-child::before {
        height: 55px;
        top: -23px;
    }


    .transaction-details-wrap.details .timeline-wrap .timeline-block .text, .transaction-details-wrap.timeline .timeline-wrap .timeline-block .text {
        background: #333;
        border-radius: 3px;
        box-shadow: 0.125rem 0.125rem 0 0 rgba(0,0,0,.1);
        grid-column: 3 / span 1;
        padding: 15px;
        position: relative;
        text-align: left;
        white-space: normal;
        word-wrap: break-word;
        font-size: 14px;
    }

    .transaction-details-wrap.details .timeline-wrap .timeline-block.current .text, .transaction-details-wrap.timeline .timeline-wrap .timeline-block.current .text {
        font-weight: 500;
    }

    .transaction-details-wrap.details .timeline-wrap .timeline-block .text::before, .transaction-details-wrap.timeline .timeline-wrap .timeline-block .text::before {
        content: "";
        position: absolute;
        left: -8px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0.625rem 0.54375rem 0.625rem 0;
        border-color: transparent #333 transparent transparent;
    }

    .transaction-details-wrap.details .details-wrap, .transaction-details-wrap.timeline .details-wrap {
        margin-top: 10px;
    }

    .transaction-details-wrap.details .details-wrap .info, .transaction-details-wrap.timeline .details-wrap .info {
        align-items: center;
        background: rgba(102, 102, 102, .2);
        color: #fff;
        display: grid;
        grid-template-columns: 1fr 1fr;
        padding: 15px 10px;
    }

        .transaction-details-wrap.details .details-wrap .info:nth-child(2n), .transaction-details-wrap.timeline .details-wrap .info:nth-child(2n) {
            background: rgba(128, 128, 128, .2);
        }

    .transaction-details-wrap.details .details-wrap .info .name, .transaction-details-wrap.timeline .details-wrap .info .name {
        font-size: 14px;
        font-weight: 500;
    }

    .transaction-details-wrap.details .details-wrap .info .value, .transaction-details-wrap.timeline .details-wrap .info .value {
        font-size: 14px;
        text-align: right;
        white-space: normal;
        word-break: break-word;
        word-wrap: break-word;
    }


/** MY PROFILE CONTENT END **/

/** MY VIP CONTENT **/

.vip-display {
    height: 150px;
    display: flex;
    justify-content: center;
}

.vip-display-level {
    margin-right: 15px;
}

.vip-display-level img{
    border-radius: 8px;
    height: 90%;
}

.vip-intro-text a {
    font-size: 12px;
    font-weight: 400;
    position: absolute;
    text-align: center;
    bottom: 10%;
    left: 40%;
    width: auto;
    padding: 3px 10px;
    color: white;
    z-index: 5;
    background: #e63846;
    border-radius: 3px;
    text-decoration: none;
}

    .vip-intro-text > a:before {
        content: '\f05a';
        font-family: "Font Awesome 6 Pro";
        font-weight: 600;
        font-size: 13px;
        line-height: 100%;
        margin: auto;
        margin-right: 5px;
    }

.vip-display-link {
    align-items: center;
    border-radius: 10px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    height: 100%;
    transition: transform .3s;
}

    .vip-display-link img {
        height: auto;
        width: 115px;
        position: relative;
        top: 0px;
        z-index: 1;
    }


    .vip-display-link .points {
        margin-bottom: 0;
    }

    .vip-display-link .points i {
        margin: auto 5px;
        font-size: 17px;
        color: #ffd800;
    }

    .vip-display-link .points span {
        margin: auto 5px;
        font-size: 35px;
        font-weight: 500;
        color: #ffd800;
        letter-spacing: 0.2px;
    }

    .vip-display-link .d-flex {
        gap: 5px;
        justify-content: center;
    }

    .vip-display-link .d-flex > a {
        display: flex;
        margin: auto;
        margin-top: 5px;
        font-size: 12px;
        padding: 3px 10px;
        color: white;
        background: #e63846;
        border-radius: 3px;
        letter-spacing: 0.2px;
        text-decoration: none;
        transition: .2s ease-in-out;
    }

    .vip-display-link .d-flex > a:hover {
        background: #b3232f;
    }

    .vip-display-link .d-flex > .level-up:hover {
        background: #258005;
    }

    .vip-display-link .d-flex > a:before {
        content: '\f05a';
        font-family: "Font Awesome 6 Pro";
        font-weight: 600;
        font-size: 13px;
        line-height: 100%;
        margin: auto;
        margin-right: 5px;
    }

    .vip-display-link .d-flex > .level-up {
        display: flex;
        margin: auto;
        margin-top: 5px;
        font-size: 12px;
        padding: 3px 10px;
        color: white;
        background: #2fb500;
        border-radius: 3px;
        text-decoration: none;
    }


    .vip-display-link .d-flex > .level-up:before {
        content: '\f148';
        font-family: "Font Awesome 6 Pro";
        font-weight: 600;
        font-size: 13px;
        line-height: 100%;
        margin: auto;
        margin-right: 5px;
    }


.deposit-progressbar-container {
    display: flex;
    justify-content: flex-end;
    float: right;
    flex: 1;
    width: 100%;
    right: 0;
    position: relative;
}

.deposit-progressbar-wrapper {
    width: 50%;
    padding: 10px 10px;
    background: #3d3d3d;
    border-radius: 5px;
}

    .deposit-progressbar-container .deposit-progressbar-wrapper .deposit-detail-container {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 0 0 15px;
    }

    .deposit-progressbar-container .deposit-progressbar-wrapper .deposit-status-container {
        display: flex;
        align-items: center;
    }

    .member-level-wrapper .member-level, .next-member-level-wrapper .next-member-level {
        font-size: 12px;
        font-weight: 600;
    }

    .deposit-progressbar-wrapper .deposit-status-container {
        display: flex;
        align-items: center;
    }

    .deposit-status-container .status-progress-container {
        width: 100%;
    }

    .deposit-status-container .status-progress-container .status-progress {
        height: 19px;
        background: rgba(0, 0, 0, .1019607843);
        border-radius: 10px;
        overflow: hidden; 
        position: relative;
    }

    .deposit-status-container .status-progress-container .progress-bar {
        background: linear-gradient(180deg, rgba(0 0 0 / 0%), rgb(224 172 0 / 23%) 48.43%, #e27600 99.39%), #fac400;
        border-radius: 0.5rem;
        display: flex;
        justify-content: space-between;
        height: 100%;
        z-index: 1;
    }

    .deposit-status-container .status-progress-container .deposit-status-wrapper {
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 10px;
        padding: 0 14px;
        position: absolute;
        top: 0;
        height: 100%;
        width: 100%;
        color: white;
        z-index: 2;
    }




.vip-conditions {
    display: flex;
    justify-content: center;
    align-items: center;
}

.card-content {
    font-weight: 400;
    padding: 15px;
    cursor: default;
    background: #fff;
}

.card-content .condition-title {
    color: black;
    align-items: center;
    display: flex;
    justify-content: space-between;
}

    .card-content .condition-title .status {
        border-radius: 100px;
        font-size: 13px;
        font-weight: 300;
        margin-left: 5px;
        padding: 4px 7px;
        white-space: nowrap;
    }

    .card-content .condition-title .status.not-pass {
        border: 1px solid #e94951;
        color: #e94951;
    }

.card-detail-content {
    background-color: #fff;
    border-top: 1px solid #e9e9e9;
    padding: 15px;
}    

.condition-item-block {
    color: black;
    cursor: default;
}

    .condition-item-block .status {
        border-radius: 5px;
        font-size: 14px;
        font-weight: 300;
        margin-left: 5px;
        padding: 6px 7px;
        white-space: nowrap;
        text-decoration: none;
        box-shadow: 0 1px 6px 2px rgb(255 63 95 / 44%);
    }

    .condition-item-block .status.not-pass{
        background: #e94951;
        color: white;
    }

.vip-privilege {
    margin: 10px 0;
}

.vip-privilege .titles h3 {
    background-image: linear-gradient(180deg,#fdd800 22%,#ffd800 27%,#ffe400 78%);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    font-size: 18px;
    font-weight: 600;
}

.vip-privilege-block {
    grid-gap: 10px;
    display: grid;
    grid-template-columns: repeat(5,1fr);
}

    .vip-privilege-item {
        background-color: #f6f6f6;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        border-radius: 5px;
        padding: 10px;
    }

    .vip-privilege-block>div {
        text-align: center;
    }

    .privilege-item-img {
        height: 64px;
    }

    .privilege-item-title {
        color: black;
        font-weight: 400;
        line-height: 22px;
        font-size: 14px;
        margin: 8px 0;
        overflow: hidden;
        text-overflow: ellipsis;
        user-select: none;
    }

.claim-btn {
    border-radius: 3px;
    color: black;
    font-weight: 700;
    font-size: 14px;
    height: inherit;
    padding: 6px 15px;
    cursor: default;
    width: 100%;
    user-select: none;
}

.nrc-button.nrc-button-disabled {
    border: none;
    box-shadow: none;
    cursor: not-allowed;
    opacity: .4;
}

.vips-row {
    display: flex;
    padding: 10px 0;
}

    .vips-main-info {
        position: relative;
        display: flex;
        background: #2b2b2b;
        border-radius: 3px;
        width: 70%;
        padding: 15px;
        min-height: 105px;
        margin-bottom: 10px;
        overflow: hidden;
    }

    .vips-main-info:before {
        content: '';
        position: absolute;
        right: -60px;
        top: -30px;
        width: 200px;
        height: 200px;
        background: url(images/bg-banner-vip.png) no-repeat, #0003;
        background-size: 70%;
        background-position: center;
        border: 10px double #000000cf;
        border-radius: 50%;
        transform: rotate(20deg);
        opacity: 0.3;
    }

        .vips-main-info img {
            width: 100px;
            height: 65px;
            margin: auto 0;
            margin-right: 5px;
        }

        .vips-main-index {
            display: grid;
            margin: auto 10px;
        }

        .vips-main-index span {
            font-size: 14px;
            color: #bbb;
            font-weight: 600;
            letter-spacing: 1.0px;
        }

        .vips-main-index h5 {
            margin-top: 5px;
            font-size: 18px;
            font-weight: 600;
        }

        .type-silver {
            color: rgb(208 223 87);
        }

        .type-rose {
            color: rgb(247 167 167);
        }

        .type-gold {
            color: rgb(252 94 110);
        }

        .type-platinum {
            color: rgb(55 168 255);
        }

        .type-diamond {
            color: rgb(114 223 135);
        }

        .type-royal {
            color: rgb(240, 199, 131);
        }


    .vips-level-info {
        display: inline-grid;
        background: #2b2b2b;
        width: calc(30% - 10px);
        min-height: 105px;
        margin-left: 10px;
        margin-bottom: 10px;
        border-radius: 3px;
    }

.text-left {
    text-align: left !important;
}

.text-right {
    text-align: right !important;
}

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



/** MY VIP CONTENT END **/

/** DEPOSIT CONTENT **/

.nav-tabs {
    border-bottom: none;
}

.afterlogin_deposit.nav-tabs .nav-item {
    margin-top: 15px;
    margin-right: 20px;
}

.afterlogin_deposit.nav .nav-item .nav-link {
    min-width: 150px;
    border-radius: 5px;
    text-align: center;
    background: #f8f9fb;
    color: black;
    height: 38px;
    border: 1px solid #ffc908;
    box-shadow: 0px 2px 10px #db9d2cd6;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
}

    .afterlogin_deposit.nav .nav-item .nav-link:hover {
        background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#ffd634 99.39%),#ffcf22;
        color: black;
        border: 1px solid #ffc908;
    }

    .afterlogin_deposit.nav .nav-item .nav-link.active {
        background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(247 222 140 / 23%) 48.43%,#ffd946a3 99.39%),#ffb308;
        color: black;
        border: 1px solid #ffc908;
    }

.mydeposit.nav .nav-item .nav-link {
    min-width: 100px;
    text-align: center;
    background: #f8f9fb;
    color: #000000;
    height: 38px;
    border: 2px solid #a3a2a3;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    background-size: cover;
    background-position: center;
    min-width: auto;
    transition: .3s ease;
}

    .mydeposit.nav .nav-item .nav-link:hover {
        box-shadow: 2px 0px 5px 0px #ffd800;
    }

    .mydeposit.nav .nav-item .nav-link.active {
        box-shadow: 1px 0px 3px 0px #ffd800;
        border: 2px solid #ffb108;
    }

.deposit_new_table {
    -webkit-box-shadow: 0px 0px 6px 0px rgb(196 182 127 / 70%);
    -moz-box-shadow: 0px 0px 6px 0px rgb(196 182 127 / 70%);
    box-shadow: 0px 0px 6px 0px rgb(196 182 127 / 70%);
    background-color: #fff;
    border: 2px solid #ffd800;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
}

.bank-list {
    padding-top: 20px;
    padding-bottom: 0px;
    list-style: none;
}

.bank-list li {
    padding-bottom: 5px;
    color: rgb(59, 59, 59);
    font-size: 16px;
}

.bank-bold {
    color: black!important;
    font-weight: 600;
    letter-spacing: 0.3px;
}

    .bank-bold.copy  {
        display: flex;
        grid-gap: 15px;
    }

.nrc-form .nrc-form-item .nrc-form-label2 {
    padding-left: 10px;
    width: 280px;
    text-align: left;
    color: white;
}

.nrc-form .nrc-form-item .nrc-form-label2 label.form-require:before {
    color: #ffd800;
    content: "*";
    font-size: 18px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 600;
    left: -5px;
    line-height: 0;
    top: 12px;
}

.nrc-formik-file input {
    opacity: 1;
    z-index: 99;
    height: 40px;
    padding: 5px;
    display: block;
    cursor: pointer;
}

.deposit-btn .nrc-button {
    padding: 0 30px;
    width: 150px;
    font-size: 16px;
    margin-left: 15px;
    transition: .3s ease;
}

    .deposit-btn .nrc-button:hover {
        transform: translateY(2px);
        background-color: #ffa41c;
    }

    .modal-sm {
        max-width: 300px;
        height: auto!important;
        width: auto!important;
        
    }

    .amountwrapper {
        display: flex;
        text-align: center;
    }

    .amount-btn {
        font-size: 14px;
        font-weight: 500;
        line-height: 19px;
        color: black;
        display: inline-block;
        padding: 5px 0;
        width: 70px;
        text-align: center;
        cursor: pointer;
        margin-right: 10px;
        margin-bottom: 0rem;
        border-radius: 3px;
        border: 1px solid #ffc908;
        background-color: white;
    }

    .amount-btn:hover {
        background-color: #ffd800;
        color: black;
    }

    .amount-btn.active {
        background-color: #ffc908;
        color: black;
    }

.suggestInput.long {
    width: 100%;
}

.suggestInput {
    padding: 8px;
    color: #000;
    width: 320px;
    height: 40px;
    font-size: .875rem;
    font-weight: 600;
    margin-bottom: 2rem;
    border-radius: 12px;
    border: 1px solid #ffc908;
    background: #fff;
}

.textArea {
    min-height: 150px;
}

.title-box.coupon {
    justify-content: space-between;
    display: block;
}

    .deposit-discount-select {
        padding: 7px 15px;
        border-radius: 3px;
        background: linear-gradient(180deg, rgba(0 0 0 / 0%), rgb(225 179 25 / 23%) 48.43%, #eaee0e 99.39%), #ffc908;
        box-shadow: 0 0.0625rem 0.0625rem rgba(0,0,0,.5);
        color: black;
        font-size: 13px;
        font-weight: 600;
        cursor: pointer;
        letter-spacing: 0.3px;
        transition: .3s ease;
        text-decoration: none;
    }

    .deposit-discount-select:hover {
        color: black;
    }

    .deposit-discount-select::after {
        content: '\f106';
        display: inline-block;
        font-family: "Font Awesome 6 Pro";
        font-weight: 600;
        font-size: 12px;
        color: black;
        line-height: 100%;
        margin-left: auto;
        margin-right: 0px;
        margin-top: 9px;
        width: 0.5rem;
        height: 11px;
        margin-bottom: 0.125rem;
        transition: .3s ease-in-out;
    }

    .deposit-discount-select.collapsed::after {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
        transition: .3s ease-in-out;
    }

    .title-box span {
        display: inline-block;
        font-size: 13px;
        vertical-align: middle;
        color: #f2dc9c;
    }
    
    .deposit-discount-select .diss-c {
        color: white;
        font-size: 12px;
        margin-right: 5px;
        line-height: 1.3;
        height: 14px;
    }

    .deposit-discount-select span {
        color: #fff;
        padding: 0 8px;
        border-radius: 10px;
        background-color: #ff003f;
    }

    .all-coupon-select-box {
        margin-bottom: 10px;
        border-radius: 0 0 3px 3px;
        background-color: #242424;
        box-shadow: 0 0 3px rgba(0,0,0,.5);
        transition: .3s ease;
    }

    .all-coupon-select-box::after, .all-coupon-select-box::before, .list-aside::after, .list-aside::before {
        content: "";
        display: table;
    }

    .all-coupon-select-box .col {
        display: grid;
        grid-template-columns: repeat(6, 1fr);
        align-content: center;
        justify-content: flex-start;
        grid-gap: 6px;
        width: 100%;
        padding: 10px;
        margin-bottom: 0px;
    }

    .all-coupon-select-box li {
        position: relative;
        margin-bottom: 7px;
        overflow: hidden;
        border-radius: 3px;
        text-align: center;
        cursor: pointer;
        height: 70px;
    }    

    .all-coupon-select-box [type=radio] {
        display: none;
    }

    .all-coupon-select-box .couponimg {
        display: block;
        position: relative;
        height: 100%;
        transition: .3s;
        border-width: 0;
        border-radius: 0;
        background-size: cover;
        color: #fff;
    }

    .all-coupon-select-box .couponimg .bg-load {
        height: 100%;
        background-position: center;
        background-size: cover;
    }

    .all-coupon-select-box [type=radio]:checked + .couponimg .status-check {
        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
        border: 3px solid #ffe43c;
        background: 0 0;
    }

    .status-check {
        z-index: 1;
        right: 31%;
        line-height: 0;
    }

    .status-more {
        z-index: 2;
        left: 31%;
        margin-right: 0.3125rem;
    }

    .status-check, .status-more {
        position: absolute;
        top: -50%;
        width: 24px;
        height: 24px;
        -webkit-transform: translate(0, -50%);
        transform: translate(0, -50%);
        transition: .3s;
        border: 1px solid #fff;
        border-radius: 0.125rem;
        background-color: #f7cf04;
        vertical-align: middle;
        cursor: pointer;
    }

    .all-coupon-select-box [type=radio]:checked + .couponimg .status-check::before {
        z-index: 2;
        right: 0;
        bottom: 0;
        width: 10px;
        height: 10px;
        color: black;
        font-weight: 800;
        -webkit-mask-size: contain;
        mask-size: contain;
    }

    .all-coupon-select-box [type=radio]:checked + .couponimg .status-check::after {
        content: "";
        position: absolute;
        z-index: 1;
        right: -0.125rem;
        bottom: -0.125rem;
        width: 0;
        height: 0;
        border-width: 0 0 22px 22px;
        border-style: solid;
        border-color: transparent transparent #ffe43c;
    }

    .all-coupon-select-box [type=radio]:checked + .couponimg .status-more {
        left: 50%;
        margin-right: 0;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    .all-coupon-select-box li:hover .status-check, .all-coupon-select-box li:hover .status-more {
        top: 50%;
    }

    .status-check::before {
        content: '\f00c' !important;
        font-family: "Font Awesome 6 Pro";
        font-weight: 600;
        font-size: 12px;
        color: black;
        display: flex;
        height: 100%;
        align-items: center;
        justify-content: center;
    }

    .status-more::before {
        content: '\f141'!important;
        font-family: "Font Awesome 6 Pro";
        font-weight: 600;
        font-size: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: black;
        height: 100%;
    }

    .status-check:hover, .status-more:hover {
        border-radius: 100%;
        border-color: #ff9804;
        background-color: #ff9804;
    }

    .status-check::before, .status-more::before {
        content: "";
        position: absolute;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
    }

    .all-coupon-select-box [type=radio]:checked + .couponimg .status-check:hover {
        border-radius: 0.125rem;
        border-color: #ffe43c;
        background: 0 0;
    }

.input-box.promo-code {
    padding: 0 10px;
    margin-bottom: 10px;
}

.submit-money-group {
    position: relative;
    flex-flow: row nowrap;
}

.input-box.promo-code .input-box-50 {
    padding-top: 0px;
}

.input-box .input-box-50 {
    width: 30%;
    margin-bottom: 0;
    vertical-align: top;
    display: inline-flex;
    justify-content: space-between;
    padding-top: 15px;
}

    .input-box.input-money  {
        position: relative;
        flex: 1;
        margin-right: 5px;
        overflow: hidden;
        vertical-align: middle;
    }

    .input-box.input-money input {
        width: 100%;
        height: 40px;
        text-align: right;
    }

    .input-box.promo-code .input-box.input-money input {
        background: #454545;
        border: 1px solid transparent;
        border-radius: 3px;
        text-align: start;
        color: white;
        font-size: 14px;
        padding: 0 10px;
    }

    .submit-money-group .button {
        display: flex;
        position: relative;
        gap: 6px;
        align-items: center;
        text-align: center;
        justify-content: center;
        overflow: hidden;
        border: 0;
        color: black;
        font-weight: 600;
    }

    .submit-money-group .btn-default {
        min-width: 120px;
        vertical-align: middle;
    }

.title-box {
    display: flex;
    justify-content: inherit;
}

.title-box label {
    font-size: 14px;
    letter-spacing: 0.2px;
    line-height: 26px;
}

.title-box .col-2 {
    line-height: 35px;
}

    .choose-box .nav-tabs {
        display: grid !important;
        grid-template-columns: repeat(5, 1fr) !important;
        justify-content: left;
        grid-gap: 10px;
    }

    .nav-tabs .content_bankType {
        border: 1px solid rgba(255, 255, 255, .5);
        height: 64px;
        width: 140px;
        color: grey;
        padding: 0 !important;
        display: flex;
        justify-content: center;
        text-align: center;
        margin-left: 0px !important;
        background-color: inherit;
        border-radius: 4px;
        transition: .3s ease;
    }

    .nav-tabs .content_bankType:first-child {
        margin-bottom: 0.5rem !important;
        margin-left: 0px !important;
    }

    .choose-box label {
        position: relative;
        border-radius: 3px;
        display: block;
        padding: 0.3125rem 0.9375rem;
        overflow: hidden;
        transition: .3s;
        cursor: pointer;
        height: 62px;
    }

    .nav-tabs .content_bankType label i {
        font-size: 25px !important;
        padding-top: 4px;
    }

    .choose-box p {
        font-size: 13px;
        line-height: 2.0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .nav-tabs .content_bankType:hover {
        color: #ffd800;
        border-color: var(--lightorange);
        box-shadow: 0 0 0 1px rgb(255 194 20 / 52%);
    }

    .nav-tabs .content_bankType.active {
        color: #ffd800;
        border-color: var(--lightorange);
        background-color: inherit;
    }

    .choose-box .active label::before {
        content: '\f00c';
        font-family: "Font Awesome 6 Pro";
        font-weight: 800;
        margin: auto;
        position: absolute;
        transition: .3s;
        z-index: 2;
        right: 0px;
        bottom: 4px;
        font-size: 13px;
        width: 13px;
        height: 13px;
        color: #101935;
    }

    .choose-box .active label::after {
        content: "";
        display: block;
        z-index: 1;
        right: 0;
        bottom: 0;
        width: 0;
        height: 0px;
        border-width: 0 0 20px 20px;
        border-style: solid;
        border-color: transparent transparent #ffe43c;
        margin-top: -39px;
        margin-left: 104px;
    }

    .choose-box2 li, .choose-box2 label {
        position: relative;
        border-radius: 3px;
    }

    .choose-box2 [type=radio], .choose-box2 input {
        display: none!important;
    }

    .style-add-amount {
        display: flex;
        cursor: pointer;
        margin: 0;
    }

    .choose-box2 [type=checkbox]:checked + label, .choose-box2 [type=radio]:checked + label {
        border-color: #ffd800;
        color: #ffd800;
    }

    .choose-box2 img {
        width: auto;
        height: 30px;
    }

.form-group input {
    font-size: 14px;;
    width: 53%;
    padding: 11px;
    border: 1px solid transparent;
    border-radius: 3px;
    background: #252424;
    transition: border-color 0.3s ease;
    outline: none !important;
    color: #fff;
}

.form-group input[readonly] {
    font-size: 14px;
    width: 53%;
    padding: 11px;
    border: 1px solid transparent;
    border-radius: 3px;
    background: #252424;
    transition: border-color 0.3s ease;
    outline: none !important;
    color: #fff0d8;
}

    .form-group input:focus {
        box-shadow: none!important;
        background-color: #252424;
        border-color: #ffe018;
        color: white;
    }

    .input-group-text.currency {
        display: flex;
        align-items: center;
        background: #ffeb22;
        border: 1px solid transparent;
        cursor: pointer;
        padding: 10px 10px;
        color: black;
        font-weight: 700;
        border-radius: 3px;
        transition: .3s ease-in-out;
        user-select: none;
    }

    .input-group-text.copy {
        display: flex;
        align-items: center;
        background: #ffeb22;
        border: 1px solid transparent;
        cursor: pointer;
        padding: 10px 20px;
        border-radius: 3px;
        transition: .3s ease-in-out;
    }

        .input-group-text.copy:hover {
            background: #f9c108;
            }

    .input-group-text.copy i {
        color: black;
        font-size: 16px;
        font-weight: 700;
    }

    .reset-btn {
        position: absolute;
        z-index: 1;
        top: 50%;
        right: -50px;
        width: 35px !important;
        height: 35px;
        padding: 0 !important;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        transition: .3s;
        background-color: #f2dc9c;
        font-size: 0;
        text-indent: -99999px;
        cursor: pointer;
        -webkit-mask: url(images/icon-delete.svg) no-repeat center / 40%;
        mask: url(images/icon-delete.svg) no-repeat center / 40%;
    }

    .style-add-amount span {
        position: relative;
        font-size: 13px;
        color: #bbb;
        border: 1px solid #aaa;
        transition: border-color 0.2s ease, color 0.3s ease, box-shadow 0.2s ease;
        border-radius: 5px;
        text-align: center;
        padding: 6px 12px;
        min-width: 85px;
        user-select: none;
    }

    .style-add-amount input:hover ~ span {
        color: #ffe43c;
        border-color: #ffe43c !important;
        box-shadow: 0 0 2px #ffe43c8a;
    }

    .style-add-amount input:checked ~ span, .style-add-amount input[type=radio]:focus ~ span, .style-add-amount input[type=button]:focus ~ span {
        color: #ffe43c;
        border-color: #ffe43c !important;
        box-shadow: 0 0 2px #ffe43c8a;
        animation: moneyBtn-Animation .5s ease-in-out;
    }

    .custom-file-label {
        z-index: 1;
        height: calc(1.4em + 1rem + 2px);
        padding: 0.375rem 0.75rem;
        font-weight: 400;
        line-height: 1.5;
        color: #fff;
        background-color: #252424 !important;
        border: 0.125rem solid transparent;
        border-top-left-radius: 3px;
        border-bottom-left-radius: 3px;
        -moz-appearance: auto !important;
        appearance: auto !important;
        font-size: 15px;
        width: 34%;
    }

    .custom-file-label.deposit {
        width: 100% !important;
        height: 45px;
        align-items: center;
        display: flex;
    }

    .input-box.input-m {
        position: relative;
        flex: 1;
        margin-right: 1px;
        overflow: hidden;
        vertical-align: middle;
    }

    .input-box.input-m input {
        width: 100%;
        text-align: right;
    }

    .input-m.active .reset-btn  {
        right: 0;
        background: #f35e5e;
    }


@keyframes moneyBtn-Animation {
    0% {
        -webkit-filter: drop-shadow(0 0 0 #ffe43c);
        filter: drop-shadow(0 0 0 #ffe43c);
    }
    100% {
        -webkit-filter: drop-shadow(0 -20px 0 transparent);
        filter: drop-shadow(0 -20px 0 transparent);
    }
}

.payment-notice {
    margin-top: auto;
    border-radius: 10px;
    padding: 25px;
    background-color: #343434
}

    .payment-notice h6 {
        color: #f5fc4a;
        margin-bottom: 8px;
        font-weight: 600;
        user-select: none;
    }

    .payment-notice ol {
        padding-left: 1rem;
        margin-bottom: 0;
    }

    .payment-notice ol li {
        font-size: 12px;
        margin-bottom: 5px;
        letter-spacing: 0.3px;
    }

.qrpay-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    background: linear-gradient(to bottom, #ffd800 0, #d4e000 100%);
    box-shadow: 0 1px 4px rgba(0,0,0,.5);
    padding: 5px;
    border-radius: 10px;
    width: auto;
    margin-left: 12px
}

.qrpay-container img {
    width: 200px !important;
}

.input-group.input-m.crypto {
    display: flex;
    align-items: center;
}

    .input-group.input-m.crypto i {
        margin-left: 10px!important;
        margin-right: 10px;
    }

    .input-group.input-m.crypto span {
        height: 45px;
        border-top-left-radius: 3px!important;
        border-bottom-left-radius: 3px!important;
    }

    .input-group.input-m.crypto input {
        border-radius: 3px!important;
        border-top-left-radius: 0px!important;
        border-bottom-left-radius: 0px!important;
    }

    .cu-rate {
        font-size: 12px;
        font-weight: 500;
        color: #ffbb00;
    }

.promo-card-cont {
    width: 50%;
}

.promo-card {
    width: auto;
    height: auto;
    border-radius: 5px;
    box-shadow: 1px 7px 10px 1px rgb(0 0 0 / 56%);
    background: linear-gradient(150deg, #ff6200, #f1d800 100%);
    padding: 15px 10px;
    position: relative;

}

    .promo-card::before {
        position: absolute;
        content: "";
        height: 29px;
        left: -20px;
        top: 65px;
        border-radius: 40px;
        background-color: #3c3c3c;
        z-index: 1;
        width: 37px;
    }

    .promo-card::after {
        position: absolute;
        content: "";
        height: 29px;
        right: -20px;
        border-radius: 40px;
        z-index: 1;
        top: 65px;
        background-color: #3c3c3c;
        width: 37px;
    }

    .promo-card .main {
        gap: 45px;
        padding: 0 10px;
        width: 100%;
        display: flex;
        flex-flow: row nowrap;
        justify-content: flex-start;
        position: relative;
        align-items: center;
        margin: 0 auto;
        align-items: center;
    }

    .promo-card .content {
        flex: 1;
        width: 51%;
        color: #fff;
    }

    .promo-card .co-img {
        width: 195px;
        height: 108px;
        overflow: hidden;
        border-radius: 8px;
        background-position: center;
        background-size: cover;
        box-shadow: 0 0 1px rgba(0,0,0,.5);
    }

    .promo-card .co-img img {
        width: 100%;
        border-radius: 6px;
    }

    .promo-card .main .vertical { 
        border-left: 4px dotted black;
        height: 100px;
        position: absolute;
        left: 38%;
    }

    .promo-card .main .content h3 {
        font-size: 18px;
        color: black;
    }

    .promo-card .main .content p {
        font-size: 14px;
        font-weight: 600;
        color: black;
        margin-top: 20px;
        margin-bottom: 0px;
    }

    .promo-card .main .content span {
        font-size: 12px;
        font-weight: 500;
        color: black;
    }

    .promotion-detail-btn.cont {
        float: right;
        transition: .3s;
        background: 0 0;
        color: white;
        font-size: 12px;
        letter-spacing: 0.5px;
        text-align: right;
        text-decoration: underline;
        cursor: pointer;
        margin: 0;
        border: 0 solid transparent;
        outline: 0;
        background: linear-gradient(150deg, #ff0000, #890303 100%);
        border-radius: 20px;
        padding: 6px 15px;
    }



/** DEPOSIT CONTENT END **/

/** HISTORY CONTENT  **/

.myrewards.nav .nav-item .nav-link {
    min-width: 110px;
    text-align: center;
    background: #ffffff;
    color: rgb(58, 58, 58);
    height: 39px;
    border: 1px solid #ffc908;
    font-size: 16px;
    font-weight: 600;
    margin: 20px 0;
    box-shadow: 0px 2px 10px #db9d2cd6;
}

    .myrewards.nav .nav-item .nav-link.active {
        background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(247 222 140 / 23%) 48.43%,#ffd946a3 99.39%),#ffb308;
        color: black;
        height: 39px;
        font-weight: 600;
        border: 1px solid #ffc908;
    }

.card {
    border: 1px solid rgba(0,0,0,.06);
}

.card-header:first-child {
    border-radius: 0.45rem 0.45rem 0 0;
}

.card-header { 
    padding: 1.5rem;
    background-color: #f5f5f5;
    border-bottom: none;
}

.card .card-title {
    font-weight: 500;
    letter-spacing: .05rem;
    font-size: 1.24rem;
    color: #464855;
    text-align: right;
}

.card-content.history {
    background-color: #f5f5f5;
    padding: 0px;
}

.table thead th {
    vertical-align: bottom;
    border-bottom: 2px solid #E3EBF3;
}

    .table.table-xl th, .table.table-xl td {
        padding: 1.25rem 2rem;
        color: #5a5d6d;
    }

    .table.table-xl tbody tr:hover {
        background-color: rgba(255, 255, 255, 0.74);
    }

    .table.table-xl tbody tr i {
        color: black;
        cursor: pointer;
    }

    .badge-success {
        background-color: #28D094;
    }

    .badge-secondary {
        background-color: #6B6F82;
    }

    .badge-danger {
        background-color: #FF4961;
    }
    
/** HISTORY CONTENT END **/

/** REFERRAL CONTENT **/

.label {
    padding: 10px;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
}

.copy-text {
    position: relative;
    padding: 5px;
    border-radius: 6px;
    border: 1px solid #ffc908;
    width: 400px;
}

    .copy-text input.text {
        border: none;
        padding: 5px;
        font-size: 14px;
        color: #fff;
        outline: none;
        width: 350px;
        background-color: transparent;
    }

    .copy-text .button-copy {
        padding: 8px;
        background-image: linear-gradient( #ffbb4a, rgb(209 116 11));
        color: white;
        font-size: 15px;
        border: none;
        outline: none;
        border-radius: 6px;
        cursor: pointer;
    }

    .button-copy2 {
        background-image: linear-gradient( #ffe17b, rgb(255 155 21));
        color: white;
        font-size: 15px;
        border: none;
        outline: none;
        border-radius: 6px;
        width: 28px;
        display: flex;
        height: 30px;
        align-items: center;
        justify-content: center;
        cursor: pointer;
    }

    .button-copy2:hover{
        color: white;
    }

    .bank-1 {
        color: black;
        text-decoration: none;
    }

    .bank-1:hover {
        color: black;
    }

.rewards_title {
    color: #fff;
    font-size: 15px;
    font-weight: 500;
}

.reward_title b {
    background-image: linear-gradient(180deg,#fdd800 22%,#ffd800 27%,#ffe400 78%);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    font-size: 17px;
}    

.referral-ol {
    color: white;
    font-size: 14px;
}

    .referral-ol li {
        margin-bottom: 8px;
        letter-spacing: 0.2px;
    }

    .referral-card.card-other {
        display: grid;
        grid-template-columns: auto 1fr;
        margin-top: 10px;
        width: 35%;
        border-radius: 12px;
        padding-right: 20px;
        background: radial-gradient(110.75% 100% at 0 0, #ffa300 0, #ffc80057, #8e8cff00);
        grid-gap: 16px;
        box-shadow: 0 0 10px 0px #03030361;
    }

    .referral-card.card-other img {
        height: auto;
        width: 75px;
        vertical-align: middle;
    }

    .referral-card.card-other .card-info {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .referral-card.card-other .card-info h3 {
        font-size: 14px;
        font-weight: 700;
        letter-spacing: 0.2px;
        margin-bottom: 5px;
    }

    .referral-card.card-other .card-info .card-desc {
        font-size: 12px;
        font-weight: 500;
        color: #e1e1e1;
    }


.referral-wrap {
    display: flex;
    grid-gap: 10px;
}

.referral-btn {
    background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#eaee0e 99.39%),#ffc908;
    border: 0;
    border-radius: 5px;
    color: black;
    cursor: pointer;
    font-size: 13px;
    font-weight: 700;
    height: 38px;
    box-shadow: 0px 2px 10px #525d6b94;
    transition: .2s ease;
    width: auto;
    padding: 0 20px;
    text-decoration: none;
    align-items: center;
    justify-content: center;
}

.referral-btn:hover {
    color: black;
}

.referralp {
    font-size: 13px;
    color: white;
    font-weight: 600;
    margin-top: 5px;
}

.agent-report {
    display: flex;
    grid-gap: 20px;
}

    .report-detail {
        width: 100%;
        border-radius: 8px;
        padding: 24px 8px;
        font-size: 16px;
        text-align: center;
        background: #fff;
        display: flex;
        flex-direction: column;
        gap: 21px;
        color: black;
        box-shadow: 0px 3px 9px 1px #e2d992;
    }

    .report-detail span:nth-child(2) {
        font-weight: 700;
        font-size: 17px;
        word-wrap: break-word;
    }

.dateField {
    width: 45%;
    height: 30px;
    display: block;
    margin: 0 auto;
    font-weight: 500;
    text-align: center;
    font-size: 14px;
}
    
.referralHistoryTable {
    width: 100%;
    margin-top: 20px;
    border-collapse: collapse;
    color: white;
}
    
.referralHistoryTable, td, th {
    text-align: center;
}

.emptyTable {
    margin-left: auto;
    border: none;
    margin-bottom: 20px;
    width: max-content;
    color: white;
}

.emptyTable th {
    font-weight: 500;
    border: none!important;
}

.empty-container {
    display: flex;
    align-items: center;
    justify-content: center;
}

    .modal-referral {
        max-width: 575px;
    }

.list-group-horizontal {
    flex-direction: row;
    width: 100%;
    padding-left: 0px;
}

    .list-group-horizontal li {
        padding: 0 12px 0px;
        cursor: pointer;
        display: inline-block;
        flex: 1 1;
        width: 15%;
        text-align: center;
    }   

    .share-link {
        position: relative;
        display: flex;
        width: 2.5rem;
        height: 2.5rem;
        margin: 0 auto 0.3125rem;
        transition: .3s;
        border-radius: 50%;
        background: linear-gradient(180deg, rgba(0 0 0 / 0%), rgb(225 179 25 / 23%) 48.43%, #eedb0e 99.39%), #ffc908;
        justify-content: center;
        align-items: center;
    }

    .share-link i {
        color: black;
        font-size: 20px;
    }

    .list-group-horizontal .copy-link a {
        text-decoration: none;
    }

    .list-group-horizontal .copy-link p {
        transition: .3s;
        color: white;
        text-align: center;
        white-space: nowrap;
        margin: 0;
        font-size: 13px;
        text-decoration: none;
        user-select: none;
        letter-spacing: 0.2px;
    }


/** REFERRAL CONTENT END **/

/** NOTIFICATION CONTENT  **/

.mynoti .nav-item {
    background: #1c1a1a;
}

.mynoti .nav-item:first-of-type {
    border-top-left-radius: 200px;
    border-bottom-left-radius: 200px;
    padding: 4px;
}

.mynoti .nav-item:last-of-type {
    border-top-right-radius: 200px;
    border-bottom-right-radius: 200px;
    padding: 4px;
}

.mynoti .nav-item .nav-link {
    min-width: 110px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: white;
    height: 39px;
    font-size: 16px;
    font-weight: 600;
    border: 0;
    border-radius: 200px;
}

.mynoti .nav-item .nav-link.active {
    color: black;
    background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#eaee0e 99.39%),#ffc908;
    box-shadow: 0 2px 10px #525d6b94;
}

    .noti-container {
        border: 2px solid #ffd800;
        border-radius: 1.2rem;
        background-color: #f6f6f6;
        padding: 1rem;
        display: flex;
        flex-direction: row;
        gap: 1rem;
        margin-bottom: 1rem;
    }

    .noti-date-container {
        background: linear-gradient(180deg,rgba(0 0 0 / 0%),rgb(225 179 25 / 23%) 48.43%,#eaee0e 99.39%),#ffc908;
        border: 1px solid #ffd800;
        border-radius: 16px;
        height: 60px;
        width: 60px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

        .noti-day {
            width: 60px;
            font-size: 15px;
            font-weight: 700;
            color: black;
        }

        .noti-date {
            width: 60px;
            font-size: 20px;
            font-weight: 700;
            line-height: 1.2rem;
            color: black;
        }

    .noti-content {
        display: flex;
        flex-direction: column;
        color: black;
    }

    .notiTitle {
        font-size: 17px;
        font-weight: 700;
    }

#mdlNotification .modal-title {
    font-size: 14px;
}

#mdlNotification .pop-inner-ref {
    color: white;
    font-size: 13px;
    margin-bottom: -15px;
}

#mdlNotification .modal-header {
    height: 100%;
    padding: 10px 11px 10px 15px;
    min-height: 60px;
}

#mdlNotification .modal-lg {
    max-width: 620px;
}

table tbody tr td img {
    max-height: 20px !important;
}

.download_main {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    text-align: center;
    grid-column-gap: 15px;
}

    .download_box_column {
        width: 100%;
        padding: 10px;
        position: relative;
        background-color: #333;
        border-radius: 3px;
        margin-bottom: 20px;
    }

    .download_box_column .download_icon {
        position: absolute;
        z-index: 1;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        align-content: center;
        vertical-align: middle;
    }

    .download_box_column .download_scan img {
        width: 140px;
    }

    .download_box_column .download_icon i {
        color: #ffe00a;
        font-size: 23px;
        margin-top: -5px;
        margin-right: 10px;
        margin-left: 5px;
    }

    .download_box_column .download_icon h3 {
        color: #fff;
        font-size: 15px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        width: 100%;
        margin-top: 9px;
    }
    
    .download_box_column .download_scan {
        height: 120px;
        text-align: center;
        justify-content: center;
        margin-top: 50px;
        margin-bottom: 17px;
        margin-left: 10px;
        margin-right: 10px;
        display: flex;
        align-items: center;
    }

    .download_box_column .download_text {
        font-size: 14px;
        font-weight: 600;
        letter-spacing: 0.5px;
        user-select: none;
    }

    .download_box_column .download_scan.pc {
        width: 120px;
        height: 159px !important;
        text-align: center;
        margin-top: 50px;
        margin-bottom: 17px;
        margin-left: 10px;
        margin-right: 10px;
        display: flex;
        align-items: center;
    }

    .nrc-button.dwld {
        gap: 7px;
    }


@keyframes fall {
    0% {
        visibility: hidden;
        -webkit-transform: translateY(-5rem);
        transform: translateY(-5rem);
    }
    60% {
        -webkit-transform: translateY(0.3125rem);
        transform: translateY(0.3125rem);
    }
    100% {
        visibility: visible;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

/** NOTIFICATION CONTENT END **/

/** FOOTER **/

.footer .footer-main {
    padding: 40px 0;
}

footer .footer-main .footer-cont.pure-g {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

    .footer-main .container .top {
        display: flex;
        justify-content: space-between;
    }

    .footer-main .container .top .provider {
        display: flex;
        width: 100%;
        flex-direction: row;
        justify-content: space-between;
        flex-wrap: nowrap;
    }

    .footer-main .container .top .provider .mergelayout {
        margin-right: 3px;
    }

    .footer-main .container .top .provider .mergelayout:first-child {
        width: 30%;
    }

    .footer-main .container .top .provider .mergelayout:nth-child(2) {
        width: 45%;
    }

    .footer-main .container .top .provider .mergelayout:last-child {
        width: 25%;
    }

    .footer-main .container .top .provider li {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        margin-right: 25px;
        margin-bottom: 10px;
        color: rgba(162,170,189,.4);
        position: relative;
        font-size: 13px;
        line-height: 2.0;
    }

    .footer-main .container .top .provider li:last-child {
        margin-right: 0;
    }

    .footer-main .container .top .provider li .title {
        color: white;
        letter-spacing: 0.2px;
    }

    .footer-main .container .top .provider li .gaminglic {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        margin: 10px 0 0;
    }

    .footer-main .container .top .provider li .content-text {
        font-size: 12px;
        line-height: 1.4;
        margin-top: 15px;
        margin-bottom: 15px;
        color: #b5b6b8;
    }

    .footer-main .container .top .provider li .cpyright {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        margin: 5px 0 20px;
        align-items: center;
    }

    .footer-main .container .top .provider li .cpyright div {
        display: flex;
        align-items: center;
        font-size: 11px;
        color: #ababab;
        gap: 8px;
    }

    .footer-main .container .top .provider li .brand-merge {
        display: flex;
        margin: 5px 0 20px;
        flex-direction: row;
        align-items: center;
        gap: 10px;
        width: 100%;
        flex-wrap: wrap;
    }

    .footer-main .container .top .provider li .brand-merge a {
        width: 120px;
    }

        .footer-main .container .top .provider li .brand-merge img {
            filter: grayscale(100%) brightness(180%);
            opacity: .5;
            transition: .2s;
            width: 35px;
        }

        .footer-main .container .top .provider li .brand-merge img:hover {
            filter: grayscale(0%);
            opacity: 1;
        }

    .footer-main .container .top .provider li .brand-merge.footer {
        width: 100%;
        gap: 9px;
    }
    
    .footer-main .container .top .provider li .brand-merge.footer.power img {
        max-width: 170px;
        width: auto;
    }

.footer-main .container .last-footer {
    display: flex;
    align-items: center;
    margin-bottom: 25px;
    padding-left: 2rem;
}

.footer-main .container .last-footer .mergelayout {
    display: flex;
    width: 100%;
    align-items: center;
}

    .footer-main .container .last-footer .mergelayout div:first-child {
        width: 70%;
    }

    .footer-main .container .last-footer .mergelayout .follow-us {
        width: 30%;
    }

    .footer-main .container .last-footer .mergelayout div a {
        color: #909090;
        font-size:  13px;
        border-right: 1px solid #909090;
        padding: 0 11px;
        cursor: pointer;
        text-decoration: none;
        transition: .3s;
    }

    .footer-main .container .last-footer .mergelayout div a:hover {
        color: #ffd800;
    }

    .footer-main .container .last-footer .mergelayout div a:first-child {
        padding: 0 11px 0 0;
    }

    .footer-main .container .last-footer .mergelayout div a:last-child {
        border-right: 0;
    }

    .footer-main .container .last-footer .mergelayout .follow-us .cont {
        display: flex;
        justify-content: end;
        border: 0;
        width: 100%;
    }

    .footer-main .container .last-footer .mergelayout .follow-us .cont a {
        border-right: 1px solid transparent;
        padding: 0 2px;
        font-size: 25px;
    }
    
    .footer-main .container .last-footer .mergelayout .follow-us .cont a img {
        width: 40px;
    }


.pure-g {
    text-rendering: optimizeSpeed;
}

.footer-cont.pure-g .pure-u-3-5 {
    border-bottom: 1px solid rgba(0,0,0,.2);
    box-shadow: 0 1px 0 0 rgb(255 255 255 / 10%);
    width: 100%;
}

.footer-logo-box {
    margin: 0 auto;
    padding-bottom: 10px;
    padding-top: 40px;
}

.footer-logo-box img {
    max-width: 160px;
    filter: grayscale(100%) brightness(180%);
    opacity: .5;
    transform: scale(.9);
    transition: .2s;
    padding: 5px 12px;
}

    .footer-logo-box img:hover{
        filter: grayscale(0%) ;
        opacity: 1;
        transform: scale(.9);
    }

.menu-footer {
    display: flex;
    width: 100%;
    justify-content: center;
}

.menu-footer a {
    color: #979797;
    border-right: 1px solid #9c937c;
    font-size: 14px;
    margin: 15px 0;
    padding: 2px 10px;
    text-decoration: none;
}

    .menu-footer a:last-child {
        border-right: 0;
    }

    .menu-footer a:hover {
        color: #ffd800;

    }

.copyright {
    color: #979797;
    font-size: 12px;
    text-align: center;
}

.powered {
    width: 100%;
    color: #c5c5c5;
    display: flex;
    font-size: 13px;
    text-align: center;
    justify-content: center;
    align-items: center;
}

.img-footer {
    width: 300px;
    margin-left: 10px;
}

.payment {
    width: 100%;
    color: #979797;
    display: grid;
    grid-gap: 5px;
    font-size: 13px;
    text-align: center;
    justify-content: center;
    align-items: center;
}

    .payment-img img {
        max-width: 195px;
        filter: grayscale(100%) brightness(180%);
        opacity: .5;
        transform: scale(.9);
        transition: .2s;
    }

    .payment-img img:hover {
        filter: grayscale(0%) ;
        opacity: 1;
        transform: scale(.9);
    }

/** FOOTER ENDS **/

/** LUCKY DRAW SIDE BAR **/

.caicai {
    position: fixed;
    bottom: 20px;
    z-index: 9999;
    margin-left: 50px;
    animation: float 3s ease-in-out infinite;
  
}

    .caicai img {
        width: 140px;
        transition: transform .15s; 
    }

    .caicai img:hover {
        transform: scale(1.1);
        -ms-transform: scale(1.1); /* IE 9 */
        -webkit-transform: scale(1.1); /* Safari 3-8 */
    }
    

@keyframes float {
    0% {
        -webkit-transform: translatey(0px);
        transform: translatey(0px);
    }

    50% {
        -webkit-transform: translatey(-35px);
        transform: translatey(-35px);
    }

    100% {
        -webkit-transform: translatey(0px);
        transform: translatey(0px);
    }
}


.event-qmenu.menu-close {
    transform: translateX(-83px);
} 

.event-qmenu {
    animation: aqm 1.8s ease infinite;
    bottom: 10px;
    filter: drop-shadow(0 2px 8px rgba(0,0,0,.8));
    left: 0;
    min-height: auto !important;
    position: fixed;
    transition: .3s ease;
    width: 110px;
    display: none;
    z-index: 21;
}

.event-qmenu .handle {
    bottom: 5px;
    cursor: pointer;
    position: absolute;
    right: 2px;
    width: 30px;
}

.event-qmenu .handle:after {
    color: #fff;
    content: "";
    font-family: "Font Awesome 6 Free";
    font-size: 28px;
    font-style: normal;
    font-variant: normal;
    font-weight: 700;
    left: -11px;
    line-height: 1;
    position: absolute;
    text-align: center;
    text-shadow: 0 -1px 3px #290c56;
    text-transform: none;
    top: 50%;
    transform: translateY(-50%) rotate(-180deg);
    width: 50px;
    transition: all ease-in 0.2s;
}

    .event-qmenu.menu-close .handle:after {
        left: -13px;
        text-shadow: 0 1px 3px #290c56;
        transform: translateY(-50%) rotate(0deg);
    }

    .event-qmenu .handle path {
        fill: #ffc908;
    }

    .event-qmenu .cont {
        align-items: center;
        background-color: rgba(0,0,0,.8);
        border: 3px solid #ffc908;
        border-bottom-right-radius: 15px;
        border-left: 0;
        border-top-right-radius: 15px;
        display: flex;
        flex-wrap: wrap;
        min-height: 103px;
        padding: 10px;
        width: 80px;
        transition: .5s ease;
    }
    
        .event-qmenu .cont .event-item {
            align-items: center;
            cursor: pointer;
            display: flex;
            height: 60px;
            justify-content: center;
            margin: 5px 0;
            position: relative;
            transition: .3s ease;
            width: 60px;
        }
    
            .event-qmenu .cont .event-item:hover {
                transform: scale(1.2);
            }
    
            .event-qmenu .cont .event-item img {
                display: block;
                max-height: 100%;
                max-width: 100%;
            }
    

@keyframes aqm {
    0% {
        filter: drop-shadow(0 2px 8px rgba(0,0,0,.8));
    }

    55% {
        filter: drop-shadow(0 2px 6px #ffbb3d);
    }

    70% {
        filter: drop-shadow(0 2px 6px #ffbb3d);
    }

    to {
        filter: drop-shadow(0 2px 8px rgba(0,0,0,.8));
    }
}

/** LUCKY DRAW SIDE BAR END **/

.home-area .home-winner {
    background-color: #1e1e1e;
    padding: 40px 20px 0;
}

.home-area .home-winner .metal-title {
    font-size: 38px;
}

.table-container {
    max-height: 480px;
    overflow-y: scroll;
    scrollbar-width: none;
}

.table-container::-webkit-scrollbar {
    display: none;
    scrollbar-width: none;
}

#popup {
    top: 15px!important;
}

#popup .modal-dialog {
    box-shadow: none!important;
}

#popup .modal-content {
    border-radius: 28px;
    box-shadow: 0px 0px 7px 4px #ffd974;
}

    #popup .modal-content.transparent {
        border-radius: 0px;
        box-shadow: none;
        background-color: transparent;
        border: none;
    }



.commonModal {
    color: #fff;
    font-size: 12px;
    border-radius: 24px;
    text-align: center;
    margin: 0 auto;
    border: 2px solid rgb(255 229 74);
    -moz-box-shadow: 0px 0px 7px 4px #ffd974;
    -webkit-box-shadow: 0px 0px 7px 4px #ffd974;
    box-shadow:  0px 0px 7px 4px #ffd974;
    background: linear-gradient(to top,#000000,#1e1e1e,#282828);
    overflow: hidden;
}

.commonModal.white {
    color: #fff;
    font-size: 12px;
    border-radius: 24px;
    text-align: center;
    margin: 0 auto;
    border: 2px solid rgb(255 229 74);
    -moz-box-shadow: 0px 0px 7px 4px #ffd974;
    -webkit-box-shadow: 0px 0px 7px 4px #ffd974;
    box-shadow: 0px 0px 7px 4px #ffd974;
    background: linear-gradient(to top,#ffd55e,#ffe8a1,#ffffff);
    overflow: hidden;
}


.tncModalClose {
    margin: 0;
    padding: 0;
    width: 30px;
    height: 30px;
    z-index: 99;
    top: -10px;
    right: -10px;
    border: none;
    display: block;
    font-size: 18px;
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgb(255 229 74);
}


    .tncModalClose.voucher {
        margin: 0;
        padding: 0;
        width: 30px;
        height: 30px;
        z-index: 99;
        top: 3px;
        right: 10px;
        border: none;
        display: block;
        font-size: 18px;
        position: absolute;
        border-radius: 50%;
        border: 1px solid rgb(255 229 74);
    }   

.signup-hint {
    color: white;
}

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

.svg-inline--fa {
    display: inline-block;
     font-size: inherit; 
    height: 1em;
    overflow: visible;
     vertical-align: -0.125em;
}
.popup.header {
    color: #ffd800;
    font-weight: 700;
    font-size: 17px;
}

.popup.p {
    color: white;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.winnersrow {
    height: 64px;
}

.winner-table {
    font-size: .875rem;
    width: 100%;
    min-width: 240px;
    color: black;
    margin-bottom: 30px;
}

.winner-table__col-2, .winner-table__col-3, .winner-table__col-4, .winner-table__col-5 {
    width: 15%;
}

.winner-table__col-1 {
    width: 10%;
    position: relative;
}

.winner-table__col-6 img {
    cursor: pointer;
}

    .winner-table__col-6 a {
        text-decoration: none;
    }
        .winner-table__col-6 a:hover {
            background: #ffd800;
            color: black;
        }

.commonBtn {
    font-size: .875rem;
    font-weight: 600;
    padding: 5px 24px;
    border-radius: 100px;
    min-width: 96px;
    transition: all .2s linear;
    cursor: pointer;
}

.btn-hollow {
    color: black;
    background: 0 0;
    border: 1px solid rgb(242 169 31);
}

.winnersrow:nth-child(2n-1) td {
    background:rgb(211 211 211);
}

.winnersrow td {
    background: rgb(246 246 247);
}

.winner-icon {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 40px;
}

.winner-icon__circle {
    position: absolute;
    z-index: 0;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 64px;
    opacity: .8;
}

.gamelog .modal-dialog {
    box-shadow: none!important;
}


.modal.gamelog .modal-content {
    position: absolute;
}