@import url("https://fonts.googleapis.com/css?family=Biryani:300,400|Cuprum:400,700|Exo:400,700|Oswald:300,400|Palanquin+Dark:400,600");
@import url("https://fonts.googleapis.com/css?family=Titillium+Web:300,400,700,900");

body {
    --g-primary-color-normal: #134682;
    --g-primary-color-dark: #0f1655;
    --g-secondary-color-normal: #134682;
    --g-secondary-color-dark: #0f1655;
    --g-space-xl: 40px;
    --g-space-lg: 20px;
    --g-space-md: 15px;
    --g-space-sm: 10px;
    --g-space-xs: 5px;
    --g-radius-xl: 40px;
    --g-radius-lg: 20px;
    --g-radius-md: 10px;
    --g-radius-sm: 5px;
    --g-radius-xs: 3px;
    --g-main-font: "Oswald", sans-serif;
    --g-full: 100%;
    --g-half: 50%;
    --g-one-third: 33.3333%;
    --g-quater: 25%;
    --g-transition: all .5s
}

body.light-mode {
    --g-main-color-a-normal: #f0ebe4;
    --g-main-color-a-light: #fdf9f5;
    --g-main-color-a-dark: #f5e4f0;
    --g-main-color-b-normal: #333743;
    --g-main-color-b-light: #4b5062;
    --g-main-color-b-dark: #272b34;
    --g-gradient-normal: radial-gradient(circle, #fdf9f5, #f0ebe4)
}

body.dark-mode {
    --g-main-color-a-normal: #111111;
    --g-main-color-a-light: #111111;
    --g-main-color-a-dark: #000000;
    --g-main-color-b-normal: #ddd;
    --g-main-color-b-light: #fff;
    --g-main-color-b-dark: #bbb;
    --g-gradient-normal: radial-gradient(circle, #000000, #181818)
}

[data-simplebar] {
    position: relative;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: flex-start;
    align-items: flex-start
}

.simplebar-wrapper {
    overflow: hidden;
    width: inherit;
    height: inherit;
    max-width: inherit;
    max-height: inherit
}

.simplebar-mask {
    direction: inherit;
    overflow: hidden;
    width: auto !important;
    height: auto !important;
    z-index: 0
}

.simplebar-mask, .simplebar-offset {
    position: absolute;
    padding: 0;
    margin: 0;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0
}

.simplebar-offset {
    direction: inherit !important;
    box-sizing: inherit !important;
    resize: none !important;
    -webkit-overflow-scrolling: touch
}

.simplebar-content-wrapper {
    direction: inherit;
    box-sizing: border-box !important;
    position: relative;
    display: block;
    height: 100%;
    width: auto;
    visibility: visible;
    overflow: auto;
    max-width: 100%;
    max-height: 100%
}

.simplebar-content:after, .simplebar-content:before {
    content: " ";
    display: table
}

.simplebar-placeholder {
    max-height: 100%;
    max-width: 100%;
    width: 100%;
    pointer-events: none
}

.simplebar-height-auto-observer-wrapper {
    box-sizing: inherit !important;
    height: 100%;
    width: inherit;
    max-width: 1px;
    position: relative;
    float: left;
    max-height: 1px;
    overflow: hidden;
    z-index: -1;
    padding: 0;
    margin: 0;
    pointer-events: none;
    flex-grow: inherit;
    flex-shrink: 0;
    flex-basis: 0
}

.simplebar-height-auto-observer {
    box-sizing: inherit;
    display: block;
    opacity: 0;
    top: 0;
    left: 0;
    height: 1000%;
    width: 1000%;
    min-height: 1px;
    min-width: 1px;
    z-index: -1
}

.simplebar-height-auto-observer, .simplebar-track {
    position: absolute;
    overflow: hidden;
    pointer-events: none
}

.simplebar-track {
    z-index: 1;
    right: 0;
    bottom: 0;
    background-color: var(--g-main-color-a-light)
}

[data-simplebar].simplebar-dragging .simplebar-track {
    pointer-events: all
}

.simplebar-scrollbar {
    right: 4px;
    width: 5px;
    min-height: 10px
}

.simplebar-scrollbar, .simplebar-scrollbar:before {
    position: absolute;
    background: var(--g-main-color-a-dark);
    border-radius: 7px
}

.simplebar-scrollbar:before {
    content: "";
    left: 0;
    right: 0;
    opacity: 0;
    transition: opacity .2s linear
}

.simplebar-track .simplebar-scrollbar.simplebar-visible:before {
    opacity: .5;
    transition: opacity 0s linear
}

.simplebar-track.simplebar-vertical {
    top: 0;
    width: 11px
}

.simplebar-track.simplebar-vertical .simplebar-scrollbar:before {
    top: 2px;
    bottom: 2px
}

.simplebar-track.simplebar-horizontal {
    left: 0;
    height: 11px
}

.simplebar-track.simplebar-horizontal .simplebar-scrollbar:before {
    height: 100%;
    left: 2px;
    right: 2px
}

.simplebar-track.simplebar-horizontal .simplebar-scrollbar {
    right: auto;
    left: 0;
    top: 2px;
    height: 7px;
    min-height: 0;
    min-width: 10px;
    width: auto
}

[data-simplebar-direction=rtl] .simplebar-track.simplebar-vertical {
    right: auto;
    left: 0
}

.hs-dummy-scrollbar-size {
    direction: rtl;
    position: fixed;
    opacity: 0;
    visibility: hidden;
    height: 500px;
    width: 500px;
    overflow-y: hidden;
    overflow-x: scroll
}

#promonew {
    padding: 30px 0
}

#promonew .new-promo-box > img {
    width: 100%;
    border-radius: 5px
}

.hidden {
    display: none !important
}

.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show > .btn-primary.dropdown-toggle:focus {
    box-shadow: none
}

.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
    background-color: unset;
    border-color: unset
}

select.form-control:not([size]):not([multiple]) {
    height: 34px
}

[class*=btn-] {
    border-radius: var(--g-radius-sm);
    padding: var(--g-space-xs) var(--g-space-lg);
    line-height: 25px;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none !important;
    box-shadow: none !important;
    outline: none !important
}

.btn-primary {
    background-color: var(--g-primary-color-normal) !important;
    color: #fff !important;
    border: none
}

.btn-primary.active, .btn-primary:active, .btn-primary:hover {
    color: #fff;
    background-color: var(--g-primary-color-dark) !important
}

.btn-secondary {
    background-color: var(--g-secondary-color-normal) !important;
    color: #fff !important;
    border: none
}

.btn-secondary.active, .btn-secondary:active, .btn-secondary:hover {
    background-color: var(--g-secondary-color-dark) !important;
    color: #fff
}

.btn-blue {
    background-color: var(--blue) !important;
    color: #fff !important
}

.btn-blue.active, .btn-blue:active, .btn-blue:hover {
    color: #fff;
    background-color: var(--blue-dark) !important
}

.btn-red {
    background-color: var(--red) !important;
    color: #fff !important
}

.btn-red.active, .btn-red:active, .btn-red:hover {
    color: #fff;
    background-color: var(--red-dark) !important
}

.btn-green {
    background-color: var(--green) !important;
    color: #fff !important
}

.btn-green.active, .btn-green:active, .btn-green:hover {
    color: #fff;
    background-color: var(--green-dark) !important
}

.btn-gray {
    background-color: var(--gray) !important;
    color: #fff !important
}

.btn-gray.active, .btn-gray:active, .btn-gray:hover {
    color: #fff;
    background-color: var(--gray-dark) !important
}

.btn-yellow {
    background-color: var(--yellow) !important;
    color: #333 !important
}

.btn-yellow.active, .btn-yellow:active, .btn-yellow:hover {
    color: #333;
    background-color: var(--yellow-dark) !important
}

.btn-orange {
    background-color: var(--orange) !important;
    color: #fff !important
}

.btn-orange.active, .btn-orange:active, .btn-orange:hover {
    color: #fff;
    background-color: var(--orange-dark) !important
}

.btn-white {
    background-color: #fff !important;
    color: #333 !important
}

.btn-white.active, .btn-white:active, .btn-white:hover {
    background-color: #ddd
}

.link {
    font-weight: 700;
    color: var(--g-main-color-b-dark);
    display: inline-block
}

.link.active, .link:active, .link:hover {
    color: var(--g-main-color-b-light)
}

:focus {
    outline: none !important;
    box-shadow: none !important
}

.form-control:focus {
    box-shadow: none;
    color: var(--g-main-color-b-normal)
}

/*@font-face {
    font-family: pokerklas;
    src: url(https://cdnv2.klasseo.com/assets/aypoker//fonts/pokerklas/pokerklas.eot?3xp3sa);
    src: url(https://cdnv2.klasseo.com/assets/aypoker//fonts/pokerklas/pokerklas.eot?3xp3sa#iefix) format("embedded-opentype"), url(https://cdnv2.klasseo.com/assets/aypoker//fonts/pokerklas/pokerklas.ttf?3xp3sa) format("truetype"), url(https://cdnv2.klasseo.com/assets/aypoker//fonts/pokerklas/pokerklas.woff?3xp3sa) format("woff"), url(https://cdnv2.klasseo.com/assets/aypoker//fonts/pokerklas/pokerklas.svg?3xp3sa#pokerklas) format("svg");
    font-weight: 400;
    font-style: normal
}*/

[class*=" pk-icon"], [class^=pk-icon] {
    font-family: pokerklas !important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.pk-icon.dice:before {
    content: "\e900"
}

.pk-icon.live-casino:before {
    content: "\e901"
}

.pk-icon.horse-racing:before {
    content: "\e902"
}

.pk-icon.bingo:before {
    content: "\e903"
}

.pk-icon.virtual-bet:before {
    content: "\e904"
}

.pk-icon.sport:before {
    content: "\e905"
}

.pk-icon.casino:before {
    content: "\e906"
}

.pk-icon.pokerklas:before {
    content: "\e907"
}

.pk-icon.pokerklas-logo:before {
    content: "\e908"
}

a {
    transition: var(--g-transition)
}

a, a:hover {
    text-decoration: none
}

.btn {
    transition: var(--g-transition);
    border-radius: var(--g-radius-sm);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    cursor: pointer
}

.form-group {
    margin: 5px 0 !important;
    position: relative
}

.form-group label {
    font-size: 12px
}

.form-group .icon-button {
    position: absolute;
    right: var(--g-space-sm);
    bottom: 5px;
    background-color: transparent;
    color: var(--g-main-color-b-normal);
    font-size: 20px;
    padding: var(--g-space-xs);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    line-height: 25px;
    border: none;
    opacity: .5;
    cursor: pointer
}

.form-group .select2-selection__placeholder, .form-group .select2-selection__rendered {
    color: var(--g-main-color-b-normal) !important;
    font-size: 13px
}

.form-group .form-control, .form-group .select2-container {
    background-color: var(--g-main-color-a-normal);
    border: 1px solid #666;
    border-radius: var(--g-radius-sm);
    color: var(--g-main-color-b-dark);
    font-size: 13px;
    display: block;
    width: 100% !important;
    margin-bottom: 5px;
    font-family: Arial
}

.form-group .form-control.is-invalid, .form-group .select2-container.is-invalid {
    border-color: var(--red-dark)
}

.form-group .form-control:disabled, .form-group .form-control[disabled], .form-group .form-control[readonly], .form-group .select2-container:disabled, .form-group .select2-container[disabled], .form-group .select2-container[readonly] {
    opacity: .5;
    cursor: not-allowed
}

.form-group .form-control:focus, .form-group .select2-container:focus {
    border-color: var(--g-main-color-b-dark);
    background-color: var(--g-main-color-a-dark)
}

.modal .modal-content {
    background-color: transparent;
    border: none;
    padding: var(--g-space-md)
}

.modal .modal-dialog {
    transition: transform .1s ease-out !important;
    border-radius: var(--g-radius-sm);
    overflow: hidden;
    background-color: var(--g-main-color-a-dark);
    border: 1px solid var(--g-main-color-a-normal)
}

.modal .modal-footer, .modal .modal-header {
    border: none
}

.modal .modal-header {
    padding-top: 0;
    padding-bottom: 0
}

.modal .modal-header h3 {
    font-weight: 700;
    color: var(--g-main-color-b-normal)
}

.modal .modal-header .close {
    color: #fff
}

#login-form [class^=btn-] {
    display: block
}

#login-form .pokerklas-logo {
    font-size: 25px;
    margin: var(--g-space-sm) 0 var(--g-space-md) 0;
    display: inline-block
}

#login-form .link {
    padding: var(--g-space-sm);
    margin: var(--g-space-xs) 0
}

#login-form hr {
    margin-top: 0;
    border-color: var(--g-main-color-b-dark);
    opacity: .1
}

.modal-backdrop.show {
    opacity: .95;
    background-color: #2d2728
}

.sm-next {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.sm-prev {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

#pokerActions {
    background-color: var(--g-main-color-a-normal)
}

#authLogoutForm, #emailAuthForm, #googleAuthOtpForm, #smsAuthForm {
    background-color: var(--g-main-color-a-normal) !important
}

.modal .close {
    font-size: 55px !important;
    font-weight: 400;
    padding-top: 0;
    z-index: 9;
    position: absolute;
    right: 10px;
    top: 0
}

.modal .modal-dialog {
    transform: scale(0) !important;
    border: 1px solid #666
}

.modal.show .modal-dialog {
    transform: scale(1) !important
}

.modal .modal-body h5 {
    background-color: var(--g-main-color-a-light);
    border-radius: var(--g-radius-sm);
    font-size: 14px;
    padding: var(--g-space-sm) var(--g-space-md);
    margin-bottom: var(--g-space-sm);
    width: 100%;
    color: var(--g-main-color-b-normal)
}

.modal .modal-body h5 i[class*=icon-] {
    transform: translateY(2px);
    display: inline-block
}

.modal .modal-body h5 button {
    float: right;
    background-color: transparent;
    color: var(--g-main-color-b-normal);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    cursor: pointer
}

.modal .modal-body form {
    display: flex;
    flex-direction: column;
    background-color: var(--g-main-color-a-dark);
    border-radius: var(--g-radius-sm)
}

.modal .modal-body form hr {
    border-top: 1px solid var(--g-main-color-a-normal);
    width: 100%
}

.modal .modal-body form .option-group {
    display: flex
}

.modal .modal-body form .option-group .custom-radio {
    background-color: var(--g-main-color-a-normal);
    border: 1px solid var(--g-main-color-a-light);
    border-radius: var(--g-radius-sm);
    color: var(--g-main-color-b-dark);
    font-size: 13px;
    display: block;
    width: 100% !important;
    margin-bottom: 5px
}

.modal .modal-body form .option-group .custom-control-label {
    display: block;
    cursor: pointer;
    padding: var(--g-space-xs) var(--g-space-md) var(--g-space-xs) var(--g-space-sm)
}

.modal .modal-body form .option-group .custom-control-label:after, .modal .modal-body form .option-group .custom-control-label:before {
    top: 6px;
    left: 11px
}

.modal .modal-body form .option-group .custom-control-label:after {
    opacity: .6
}

.modal .modal-body form .option-group .custom-control-label:before {
    background-color: var(--g-main-color-a-dark)
}

.modal .modal-body form .form-group label {
    text-transform: uppercase;
    margin-bottom: 0
}

.modal .modal-body form .form-group .form-control, .modal .modal-body form .form-group .select2-selection--single, .modal .modal-body table {
    border-radius: var(--g-radius-sm)
}

.modal .modal-body table {
    background-color: var(--g-main-color-a-dark);
    margin-bottom: 0
}

.modal .modal-body table tr {
    border-color: #666
}

.modal .modal-body table tr td, .modal .modal-body table tr th {
    font-size: 12px;
    border-color: #666;
    padding: var(--g-space-xs) var(--g-space-sm);
    vertical-align: middle;
    color: var(--g-main-color-b-normal)
}

#forgotPasswordModal, #gamePreModal, #loginModal {
    text-align: center
}

.custom-radio .custom-control-input:checked ~ .custom-control-label:before {
    background-color: var(--g-primary-color-normal)
}

.custom-radio label:hover:before {
    background-color: var(--g-main-color-a-dark)
}

.custom-radio label:before {
    background-color: var(--g-main-color-a-normal)
}

.form-control.custom-select {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23aaaaaa' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E")
}

.dataTables_wrapper .row {
    margin: 0
}

.dataTables_wrapper .row .col-sm-6 {
    max-width: 100%;
    width: 100%;
    min-width: 100%
}

.dataTables_wrapper .col-sm-6 {
    padding: 0
}

.dataTables_wrapper table {
    border: none
}

.dataTables_wrapper table button {
    padding: 0 var(--g-space-xs)
}

.dataTables_wrapper table .unread {
    background-color: var(--g-main-color-a-light) !important
}

.dataTables_wrapper .dataTables_processing {
    display: flex;
    align-items: center;
    align-content: center;
    background: var(--g-main-color-a-light);
    color: var(--g-main-color-b-normal);
    border-radius: var(--g-radius-sm);
    padding: 0;
    height: auto
}

.dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_paginate {
    background-color: var(--g-main-color-a-dark);
    border-radius: var(--g-radius-sm);
    font-size: 12px;
    color: var(--g-main-color-b-normal);
    padding: var(--g-space-xs) var(--g-space-sm);
    margin: var(--g-space-xs) 0;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    justify-content: center
}

.dataTables_wrapper .dataTables_filter label, .dataTables_wrapper .dataTables_info label, .dataTables_wrapper .dataTables_length label, .dataTables_wrapper .dataTables_paginate label {
    margin: 0
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    background-color: var(--g-main-color-a-normal) !important;
    border-radius: var(--g-radius-sm);
    padding: var(--g-space-xs) var(--g-space-sm);
    line-height: 8px;
    color: var(--g-main-color-b-normal) !important
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
    opacity: .6
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: var(--g-main-color-a-light) !important;
    border: 1px solid var(--g-main-color-a-dark);
    color: var(--g-main-color-b-normal) !important
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    border: 1px solid var(--g-main-color-a-dark);
    color: var(--g-main-color-b-light) !important
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    border: 1px solid var(--g-main-color-a-dark);
    background: var(--g-main-color-a-light)
}

.dataTables_wrapper input, .dataTables_wrapper select {
    border: none;
    border-radius: var(--g-radius-sm);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-left: 5px
}

.dataTables_wrapper input, .dataTables_wrapper select, .select2-dropdown {
    background-color: var(--g-main-color-a-normal);
    color: var(--g-main-color-b-normal)
}

.select2-dropdown {
    border-color: var(--g-main-color-a-light);
    font-size: 13px
}

.select2-dropdown .select2-search__field {
    background-color: var(--g-main-color-a-dark);
    border-color: var(--g-main-color-a-light);
    color: var(--g-main-color-b-normal)
}

table.dataTable tbody tr {
    background-color: rgba(0, 0, 0, .1)
}

#userPageContent {
    border-radius: var(--g-radius-sm);
    background-color: var(--g-main-color-a-normal) !important;
    color: var(--g-main-color-b-normal)
}

#userPageContent h5 {
    border-radius: var(--g-radius-sm);
    background-color: var(--g-main-color-a-light);
    color: var(--g-main-color-b-normal) !important;
    padding: var(--g-space-sm) var(--g-space-md);
    font-size: 14px
}

#userPageContent h5 i {
    margin-right: 5px
}

#userPageContent > hr {
    display: none
}

#scrollToTop {
    box-shadow: none !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    background-color: var(--g-main-color-a-normal) !important;
    border: 1px solid var(--g-main-color-a-light);
    right: 0
}

#scrollToTop span {
    border-bottom-color: var(--g-main-color-b-normal);
    margin-left: -5px
}

.iziModal .iziModal-header {
    border-bottom: 1px solid var(--g-main-color-a-light);
    background-color: var(--g-main-color-a-normal) !important;
    color: var(--g-main-color-b-normal)
}

.iziModal .iziModal-header.iziModal-noSubtitle {
    padding: 5px 12px;
    height: 35px
}

.iziModal .iziModal-header-title {
    color: var(--g-main-color-b-normal)
}

.iziModal .iziModal-wrap {
    height: calc(100% - 89px) !important
}

.iziModal .iziModal-content {
    height: 100%
}

.iziModal .iziModal-content iframe {
    height: 100% !important
}

body.bottom-bar-hidden .iziModal .iziModal-wrap {
    height: calc(100% - 35px) !important
}

.iziModal-isOverflow .modal-backdrop {
    z-index: 9999999
}

.iziModal-isOverflow .modal {
    z-index: 99999999
}

#announcementPopup, #announcementPopup pre {
    color: var(--g-main-color-b-normal)
}

#GuvenlikBilgileri {
    max-width: 100%
}

#eS8rbT1-1564221973064 {
    transform: translateY(-40px) !important
}

.modal-is-visible .cd-modal {
    z-index: 99999999998 !important
}

.modal-is-visible .cd-modal-close {
    z-index: 99999999999 !important
}

#tournamentDetails {
    padding-bottom: 120px
}

#tournamentPage {
    background-color: #222
}

#tournamentPage .tournament-box .tournament-header {
    background-color: #45464a
}

#tournamentPage .tournament-box .tournament-footer .btn.details {
    background-color: #414244;
    color: #eee
}

#sportProviderSwitch {
    border-bottom: 1px solid #383a40;
    border-top: 1px solid #383a40;
    background-color: #111
}

#sportProviderSwitch div a:after, #sportProviderSwitch div a:before {
    filter: invert(44%) sepia(64%) saturate(7036%) hue-rotate(331deg) brightness(99%) contrast(97%)
}

.dark-mode .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #252931;
    border: 1px solid #3b3d42
}

#newMainPageSlider {
    position: relative
}

#newMainPageSlider .swiper-button-next, #newMainPageSlider .swiper-button-prev, #newMainPageSlider .swiper-container-rtl .swiper-button-next, #newMainPageSlider .swiper-container-rtl .swiper-button-prev {
    filter: brightness(1%) invert(1)
}

@media (max-width: 992px) {
    #newMainPageSlider .swiper-button-next, #newMainPageSlider .swiper-button-prev, #newMainPageSlider .swiper-container-rtl .swiper-button-next, #newMainPageSlider .swiper-container-rtl .swiper-button-prev {
        transform: scale(.8)
    }
}

@media (max-width: 768px) {
    #newMainPageSlider .swiper-button-next, #newMainPageSlider .swiper-button-prev, #newMainPageSlider .swiper-container-rtl .swiper-button-next, #newMainPageSlider .swiper-container-rtl .swiper-button-prev {
        transform: scale(.5)
    }
}

body {
    font-family: var(--g-main-font);
    color: var(--g-main-color-b-normal);
    background-color: var(--g-main-color-a-dark);
    padding-top: 76px
}

body.flashbar-visible {
    padding-top: 106px
}

main {
    display: flex;
    flex-direction: column
}

header, main {
    width: var(--g-full)
}

header {
    display: flex !important;
    justify-content: space-between;
    align-content: center;
    align-items: center;
    position: fixed;
    z-index: 100;
    left: 0;
    top: 0;
    padding: var(--g-space-sm) var(--g-space-lg);
    background-image: var(--g-gradient-normal);
    border-top: 5px solid transparent;
    border-bottom: 3px solid var(--g-primary-color-normal);
    box-shadow: 0 0 10px hsla(0, 0%, 100%, .1)
}

header a {
    color: var(--g-main-color-b-normal) !important
}

header a:hover {
    color: var(--g-main-color-b-light) !important
}

header #headerLogo img {
    height: 50px;
    margin: 8px 0
}

header #mainMenuDesktop {
    font-size: 0;
    display: flex
}

header #mainMenuDesktop a {
    font-size: 15px;
    line-height: 16px;
    font-weight: 700;
    padding: 2px var(--g-space-sm);
    border-top: 4px solid transparent;
    border-bottom: 2px solid transparent;
    position: relative;
    font-family: var(--g-main-font);
    display: flex;
    flex-direction: initial;
    align-items: center;
    align-content: center;
    justify-content: center
}

header #mainMenuDesktop a .new-tag {
    height: 12px;
    line-height: 11px;
    transform: rotate(5deg);
    right: 7px;
    top: -8px
}

header #mainMenuDesktop a .fa {
    font-size: 19px !important
}

header #mainMenuDesktop a i {
    font-size: 18px
}

header #mainMenuDesktop a.active {
    color: var(--g-primary-color-normal)
}

header #mainMenuDesktop a:after {
    top: -40px;
    left: 50%;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border: 8px solid transparent;
    margin-left: -8px;
    transition: var(--g-transition)
}

header #mainMenuDesktop a:hover {
    color: var(--g-primary-color-normal)
}

header #mainMenuDesktop a:hover:after {
    border-top-color: var(--g-primary-color-normal);
    top: -20px
}

header #memberActions {
    font-size: 0;
    display: flex;
    align-items: center;
    align-content: center
}

header #memberActions #beforeLoginMenuDesktop {
    display: flex
}

header #memberActions #dropdownBalance {
    position: relative;
    display: flex
}

header #memberActions #dropdownBalance hr {
    margin: var(--g-space-sm) 0;
    width: 100%;
    border: 1px solid var(--g-main-color-a-normal)
}

header #memberActions #dropdownBalance a {
    margin: 0
}

header #memberActions #dropdownBalance.opened #balanceMenuDropdown {
    display: flex;
    flex-direction: column
}

header #memberActions #balanceMenuDropdown {
    display: none;
    position: absolute;
    right: 0;
    top: calc(100% + 10px);
    background-color: var(--g-main-color-a-dark);
    border: 2px solid var(--g-main-color-a-light);
    border-radius: var(--g-radius-sm);
    padding: 15px;
    min-width: 300px
}

header #memberActions #balanceMenuDropdown:after {
    bottom: 100%;
    right: 10%;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border: 10px solid rgba(136, 183, 213, 0);
    border-bottom: 10px solid var(--g-main-color-a-light);
    margin-left: -10px
}

header #memberActions #balanceMenuDropdown #dropdownBalanceList p, header #memberActions #balanceMenuDropdown #dropdownRakeback p {
    display: flex;
    align-content: center;
    align-items: center;
    font-size: 14px;
    margin: 0
}

header #memberActions #balanceMenuDropdown #dropdownBalanceList p span, header #memberActions #balanceMenuDropdown #dropdownRakeback p span {
    margin-left: auto
}

header #memberActions #balanceMenuDropdown #dropdownBalanceList p span button, header #memberActions #balanceMenuDropdown #dropdownRakeback p span button {
    background-color: transparent;
    border: none;
    color: var(--g-main-color-b-normal);
    cursor: pointer;
    padding: 5px
}

header #memberActions #balanceMenuDropdown #dropdownBalanceList p small, header #memberActions #balanceMenuDropdown #dropdownRakeback p small {
    transform: translateY(1px);
    margin-left: var(--g-space-xs)
}

header #memberActions a {
    border-radius: var(--g-radius-sm);
    font-size: 13px;
    font-weight: 700;
    padding: var(--g-space-xs) var(--g-space-sm);
    margin-left: var(--g-space-xs);
    color: var(--g-main-color-b-normal)
}

header #memberActions a#openLoginModal, header #memberActions a#openMemberMenu, header #memberActions a #toggleBalanceDropdown {
    background-color: var(--g-secondary-color-normal)
}

header #memberActions a#openLoginModal:hover, header #memberActions a#openMemberMenu:hover, header #memberActions a #toggleBalanceDropdown:hover {
    background-color: var(--g-main-color-a-normal)
}

header #memberActions a#goToRegisterPage, header #memberActions a#openRegisterModal, header #memberActions a#toggleBalanceDropdown {
    background-color: var(--g-primary-color-normal)
}

header #memberActions a#goToRegisterPage:hover, header #memberActions a#openRegisterModal:hover, header #memberActions a#toggleBalanceDropdown:hover {
    background-color: var(--g-primary-color-dark)
}

#externalCallUs {
    position: relative
}

#externalCallUs.opened #callUsIframe {
    left: 50%
}

#externalCallUs.opened #callUsIframeOverlay {
    left: 0
}

#externalCallUs #callUsIframe {
    position: fixed;
    top: 50%;
    left: -250%;
    transform: translate(-50%, -50%);
    width: 350px;
    height: 440px;
    padding: 10px;
    background-color: var(--g-main-color-a-dark);
    border-radius: 10px;
    z-index: 1001;
    transition: all .3s
}

#externalCallUs #callUsIframe i {
    font-size: 40px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 1002
}

#externalCallUs #callUsIframe iframe {
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    position: absolute;
    z-index: 1003
}

#externalCallUs #closeCallUsIframe {
    position: absolute;
    top: -10px;
    right: -10px;
    background-color: var(--g-main-color-a-light);
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border-radius: 30px;
    z-index: 1005;
    font-size: 13px;
    cursor: pointer
}

#externalCallUs #callUsIframeOverlay {
    position: fixed;
    top: 0;
    left: -100%;
    height: 100%;
    width: 100%;
    background-color: var(--g-main-color-a-normal);
    opacity: .7;
    z-index: 1000;
    transition: all .1s
}

#bottomBar {
    display: flex;
    justify-content: space-between;
    align-content: center;
    align-items: center;
    position: fixed;
    z-index: 999999;
    left: 0;
    bottom: 0;
    width: var(--g-full);
    background-color: var(--g-primary-color-normal);
    border-top: 3px solid var(--g-main-color-a-light);
    color: var(--g-main-color-b-normal);
    box-shadow: 0 0 10px hsla(0, 0%, 100%, .1);
    transition: var(--g-transition)
}

#bottomBar.on-the-top {
    z-index: 1000000000000000000
}

#bottomBar #toggleBottomBar {
    transition: none
}

#bottomBar.in-visible {
    bottom: -100px
}

#bottomBar.in-visible #toggleBottomBar {
    position: fixed;
    bottom: -100px;
    right: -100px;
    border-top-left-radius: var(--g-radius-sm);
    border: 1px solid var(--g-primary-color-dark);
    background-color: var(--g-primary-color-normal);
    color: #fff;
    transform: rotate(-45deg);
    padding: 10px 70px 130px;
    transition: none
}

#bottomBar.in-visible #toggleBottomBar i {
    transform: rotate(45deg)
}

#bottomBar.in-visible #toggleBottomBar .fa-eye-slash:before {
    content: "\f06e"
}

#bottomBar .site-time {
    font-size: 13px;
    line-height: 30px;
    border-right: 1px solid var(--g-primary-color-dark);
    padding: var(--g-space-sm)
}

#bottomBar > div {
    display: flex
}

#bottomBar > div:last-child {
    border-left: 1px solid var(--g-primary-color-dark)
}

#bottomBar > div > div {
    display: flex
}

#bottomBar a {
    color: var(--g-main-color-b-normal);
    padding: var(--g-space-md);
    font-size: 14px;
    font-weight: 400;
    border-right: 1px solid var(--g-primary-color-dark)
}

#bottomBar a .badge {
    background-color: var(--g-primary-color-normal);
    font-size: 11px;
    border-radius: var(--g-radius-sm);
    padding: 3px 4px;
    transform: translateY(-2px);
    display: inline-block;
    margin-left: 2px;
    color: #fff
}

#bottomBar a .only-icon {
    font-size: 18px
}

#bottomBar a:hover {
    color: var(--g-main-color-b-light)
}

#bottomBar .bottom-bar-sub-menu-wrapper {
    display: flex;
    flex-direction: column;
    position: relative
}

#bottomBar .bottom-bar-sub-menu-wrapper.visible > a {
    background-color: var(--g-primary-color-dark);
    border-right: 1px solid var(--g-primary-color-dark)
}

#bottomBar .bottom-bar-sub-menu-wrapper.visible .bottom-bar-sub-menu {
    display: flex
}

#bottomBar .bottom-bar-sub-menu {
    display: none;
    position: absolute;
    padding: var(--g-space-md);
    flex-direction: column;
    right: 0;
    background-color: var(--g-primary-color-dark);
    border-top-left-radius: var(--g-radius-sm);
    border-top-right-radius: var(--g-radius-sm);
    border: 1px solid var(--g-primary-color-dark);
    border-bottom: none;
    width: 220px;
    bottom: 100%
}

#bottomBar .bottom-bar-sub-menu#balanceMenu {
    width: 250px
}

#bottomBar .bottom-bar-sub-menu a {
    padding: var(--g-space-xs) var(--g-space-lg);
    margin: var(--g-space-xs) 0
}

#bottomBar .bottom-bar-sub-menu hr {
    border-color: var(--g-main-color-a-normal);
    width: 100%;
    opacity: .4;
    margin-top: .5rem;
    margin-bottom: .5rem
}

#modalBalanceList li {
    border: none
}

#modalBalanceList li, #modalBalanceList li:nth-child(2n) {
    background-color: transparent
}

#mobileRotateMenu {
    transform: scale(.1);
    position: fixed;
    overflow: hidden;
    bottom: -500px;
    left: 50%;
    margin-left: -150px;
    background-color: var(--g-main-color-a-dark);
    border-radius: 50%;
    width: 400px;
    height: 400px;
    transition: all .5s;
    z-index: 99;
    font-size: 1rem
}

#mobileRotateMenu.opened {
    bottom: -100px;
    right: -180px;
    left: auto
}

#mobileRotateMenu ul {
    margin: 0;
    height: 100%;
    padding: 0
}

#mobileRotateMenu.opened {
    border-radius: 50%;
    opacity: 1;
    transition: all .3s ease;
    transform: scale(1);
    pointer-events: auto
}

#mobileRotateMenu.opened li {
    position: absolute;
    font-size: 1.3em !important;
    width: 10.1em;
    height: 11.2em;
    transform-origin: 100% 100%;
    overflow: hidden;
    left: 50%;
    top: 0;
    margin-top: -1.3em;
    margin-left: -10em;
    transition: border .3s ease
}

#mobileRotateMenu.opened li a {
    display: block;
    height: 12.4em;
    width: 11.5em;
    position: absolute;
    bottom: -5.2em;
    right: -6em;
    border-radius: 50%;
    text-decoration: none;
    color: var(--g-main-color-b-normal);
    padding-top: 1.8em;
    text-align: center;
    transform: skew(-50deg) rotate(-70deg) scale(1);
    transition: opacity .3s, color .3s;
    background-color: var(--g-secondary-color-a-dark);
    font-size: 1.5em !important
}

#mobileRotateMenu.opened li a.bottom-logout span {
    padding: 8px 5px 10px
}

#mobileRotateMenu.opened li a i {
    font-size: 1em !important;
    border: 2px solid var(--g-main-color-a-light);
    border-radius: var(--g-radius-sm);
    padding: 2px 13px
}

#mobileRotateMenu.opened li a span {
    background-color: var(--g-main-color-a-normal);
    border-radius: 50%;
    padding: 8px 5px 15px
}

#mobileRotateMenu.opened li a .badge {
    font-size: 8px;
    width: 20px;
    height: 20px;
    line-height: 15px;
    background-color: var(--g-primary-color-normal);
    border-radius: 50%;
    text-align: center;
    position: absolute;
    margin-left: -12px;
    margin-top: 6px
}

#mobileRotateMenu.opened li:first-child {
    transform: rotate(-87deg) skew(50deg);
    z-index: 10
}

#mobileRotateMenu.opened li:nth-child(2) {
    transform: rotate(-58deg) skew(50deg);
    z-index: 9
}

#mobileRotateMenu.opened li:nth-child(3) {
    transform: rotate(-29deg) skew(50deg);
    z-index: 8
}

#mobileRotateMenu.opened li:nth-child(4) {
    transform: rotate(0deg) skew(50deg);
    z-index: 7
}

#mobileRotateMenu.opened li:nth-child(5) {
    transform: rotate(29deg) skew(50deg);
    z-index: 6
}

#mobileRotateMenu.opened li:nth-child(6) {
    transform: rotate(58deg) skew(50deg);
    z-index: 5
}

#mobileRotateMenu.opened li:nth-child(7) {
    transform: rotate(230deg) skew(50deg);
    z-index: 4
}

#mobileRotateMenu.opened li:nth-child(8) {
    transform: rotate(270deg) skew(50deg);
    z-index: 3
}

#mobileRotateMenu.opened li:nth-child(9) {
    transform: rotate(310deg) skew(50deg);
    z-index: 2
}

#mobileRotateMenu.opened li:nth-child(10) {
    transform: rotate(350deg) skew(50deg);
    z-index: 1
}

#bottomBarBalanceList p, #bottomBarRakeback p {
    display: flex;
    align-content: center;
    align-items: center;
    font-size: 14px;
    margin: 0
}

#bottomBarBalanceList p span, #bottomBarRakeback p span {
    margin-left: auto
}

#bottomBarBalanceList p span button, #bottomBarRakeback p span button {
    background-color: transparent;
    border: none;
    color: var(--g-main-color-b-normal);
    cursor: pointer;
    padding: 5px
}

#bottomBarBalanceList p small, #bottomBarRakeback p small {
    transform: translateY(1px);
    margin-left: var(--g-space-xs)
}

#bottomBarMessageList, #bottomBarNotificationsList {
    display: flex;
    flex-direction: column;
    padding: var(--g-space-sm) 0;
    width: 100%
}

#bottomBarMessageList a, #bottomBarNotificationsList a {
    display: flex;
    flex-direction: column;
    padding: var(--g-space-sm);
    background-color: rgba(0, 0, 0, .05);
    margin: 1px -15px !important;
    text-align: center;
    color: var(--g-main-color-b-normal)
}

#bottomBarMessageList a strong, #bottomBarNotificationsList a strong {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

#bottomBarMessageList a p, #bottomBarNotificationsList a p {
    margin: 0;
    font-size: 12px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

#bottomBarMessageList a small, #bottomBarNotificationsList a small {
    font-size: 10px;
    background-color: rgba(0, 0, 0, .1);
    border-radius: var(--g-radius-sm);
    display: inline-flex;
    width: auto;
    align-self: center;
    margin-top: var(--g-space-xs);
    padding: 0 var(--g-space-sm)
}

#bottomBarMessageList a.unread-item, #bottomBarNotificationsList a.unread-item {
    background-color: hsla(0, 0%, 100%, .05)
}

.read-all {
    position: absolute;
    right: 0;
    top: 0;
    padding: var(--g-space-xs) var(--g-space-sm) var(--g-space-xs) var(--g-space-xs);
    color: var(--g-main-color-b-normal)
}

.read-all i {
    font-size: 20px !important
}

.no-message, .no-notification {
    font-size: 12px;
    text-align: center;
    margin-top: var(--g-space-md);
    padding: var(--g-space-sm) var(--g-space-md);
    border-radius: var(--g-radius-sm);
    background-color: var(--g-main-color-a-normal);
    letter-spacing: 1px
}

#activityModal .read-all {
    left: 0;
    right: auto
}

#activityModal #bottomBarMessageList, #activityModal #bottomBarNotificationsList {
    margin-top: 10px
}

#activityModal .setting-group {
    background-color: var(--g-main-color-a-dark);
    border-radius: var(--g-radius-sm);
    padding: var(--g-space-md)
}

.setting-group {
    display: flex;
    flex-direction: column
}

.setting-group .custom-radio {
    padding: var(--g-space-xs) 0 var(--g-space-sm) 0;
    cursor: pointer
}

.setting-group .custom-radio label {
    display: flex;
    transition: var(--g-transition);
    cursor: pointer
}

.setting-group .custom-radio label:hover {
    color: var(--g-main-color-b-light);
    padding-left: 5px
}

.setting-group .custom-radio label i {
    margin-right: 5px;
    transform: translateY(5px)
}

.setting-group .custom-radio label:after, .setting-group .custom-radio label:before {
    left: auto;
    right: 0;
    top: var(--g-space-xs);
    transform: translateY(3px)
}

.setting-group .custom-radio label:before {
    transition: var(--g-transition)
}

/*#comm100-float-button-2 > div {
    right: -310px !important;
    bottom: 50px !important
}*/

#chat_window_container {
    bottom: 40px !important
}

#Widget724.posleft {
    bottom: 80px !important
}

#favoriteItems, #recentItems {
    min-width: 300px;
    max-height: 500px;
    overflow-y: auto;
    top: auto;
    color: var(--g-main-color-b-normal)
}

.favorite-item {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid var(--g-main-color-a-normal);
    margin: 3px 0;
    padding: 3px 0
}

.favorite-item:last-child {
    border: none
}

.favorite-item a {
    padding: 0 !important;
    flex-grow: 1;
    color: var(--g-main-color-b-normal)
}

.favorite-item a img {
    height: 30px;
    width: 30px;
    border-radius: 5px;
    margin-right: 5px
}

.favorite-item a span {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.favorite-item button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    background-color: var(--g-main-color-a-light);
    color: var(--g-main-color-b-dark)
}

#barSupportMenu {
    position: absolute;
    right: 8px;
    bottom: 54px;
    border: none;
    margin: 0;
    z-index: -1
}

#barSupportMenu #toggleBarSupportMenu {
    padding: 0;
    border: none
}

#barSupportMenu #barSupportMenuItems {
    display: flex;
    flex-direction: column;
    transition: opacity .2s;
    position: absolute;
    bottom: -600px;
    right: 7px;
    width: 150px;
    background-color: #67ab32;
    color: #fff;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    opacity: 0
}

#barSupportMenu #barSupportMenuItems.opened {
    bottom: 100%;
    opacity: 1
}

#barSupportMenu #barSupportMenuItems a {
    padding: 10px 15px;
    border: none;
    border-bottom: 1px solid #609f2e
}

body.bottom-bar-hidden footer {
    padding-bottom: 0
}

footer {
    font-size: 0;
    background-color: var(--g-main-color-a-normal);
    padding-bottom: 50px
}

footer, footer h2 {
    text-align: center
}

footer h2 {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: var(--g-space-lg)
}

footer #footerBrand {
    padding: 0
}

footer #footerBrand a img {
    max-height: 100px
}

footer #footerBrand p {
    font-size: 16px;
    font-weight: 300
}

footer #footerPayoutSection {
    padding: var(--g-space-lg) 0
}

footer #footerPayoutSection a {
    border: 1px solid var(--g-main-color-a-light);
    color: var(--g-main-color-b-dark);
    font-size: 13px;
    border-radius: var(--g-radius-sm);
    padding: var(--g-space-sm) var(--g-space-lg);
    margin: var(--g-space-sm)
}

footer #footerAboutText {
    padding: var(--g-space-lg)
}

footer #footerAboutText p {
    font-size: 12px
}

footer #footerPaymentMethodsSection, footer #footerProvidersSection {
    padding: var(--g-space-md);
    background-color: var(--g-main-color-a-normal)
}

footer #footerPaymentMethodsSection i, footer #footerProvidersSection i {
    transform: scale(.7);
    margin: 0;
    opacity: .8;
    transition: var(--g-transition)
}

footer #footerPaymentMethodsSection i:hover, footer #footerProvidersSection i:hover {
    opacity: 1;
    transform: scale(.8)
}

footer #footerLinksSection {
    padding: var(--g-space-md) 0
}

footer #footerLinksSection a {
    font-size: 14px;
    display: inline-block;
    color: var(--g-main-color-b-normal);
    padding: 3px var(--g-space-sm);
    margin: var(--g-space-xs) 0;
    border-right: 1px solid hsla(0, 0%, 100%, .5)
}

footer #footerLinksSection a:hover {
    color: #fff
}

footer #footerLinksSection a:last-child {
    border: none
}

footer #footerSocialMediaLinksSection {
    padding: 40px 0 20px
}

footer #footerSocialMediaLinksSection a {
    color: var(--g-main-color-b-normal);
    background-color: var(--g-main-color-a-normal);
    border-radius: var(--g-radius-sm);
    font-size: 20px;
    width: 45px;
    height: 45px;
    display: inline-block;
    line-height: 45px;
    text-align: center;
    margin: var(--g-space-xs)
}

footer #footerSocialMediaLinksSection a:hover {
    color: #fff
}

footer #footerSocialMediaLinksSection a.facebook:hover {
    background-color: #3a5e8d
}

footer #footerSocialMediaLinksSection a.twitter:hover {
    background-color: #63a6da
}

footer #footerSocialMediaLinksSection a.instagram:hover {
    background-color: #82735e;
    background: radial-gradient(circle at 30% 107%, #fdf497 0, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%)
}

footer #footerSocialMediaLinksSection a.googleplus:hover {
    background-color: #dd4b39
}

footer #footerSocialMediaLinksSection a.vine:hover {
    background-color: #00a478
}

footer #secureGamingSection {
    padding: var(--g-space-md)
}

footer #secureGamingSection #secureGamingLinks {
    display: flex;
    justify-content: center
}

footer #secureGamingSection #secureGamingLinks i {
    margin: 0 10px
}

footer #secureGamingSection #licence {
    margin: 0 !important
}

footer #secureGamingSection #apg-seal-container img {
    min-width: 45px !important
}

footer #secureGamingSection .dmca-badge img {
    max-height: 40px
}

footer #secureGamingSection p {
    font-size: 12px;
    opacity: .5;
    margin: 5px 0
}

footer #footerPlatformSection {
    padding: var(--g-space-lg) 0;
    margin-top: 15px
}

footer #footerPlatformSection a {
    background-repeat: no-repeat;
    background-size: 100%;
    display: inline-block
}

footer #footerPlatformSection a img {
    max-height: 30px
}

footer #footerPlatformSection.bottom-bar-hidden {
    padding-bottom: 20px !important
}

#providersModal .modal-body {
    border-top: 1px solid var(--g-main-color-a-light);
    margin-top: var(--g-space-sm);
    text-align: center
}

#providersModal .modal-body i {
    transform: scale(.7);
    margin: 0 -15px;
    opacity: .9;
    transition: var(--g-transition)
}

#providersModal .modal-body i:hover {
    opacity: 1;
    transform: scale(.8)
}

#memberMenuModal h3 {
    font-size: 20px;
    font-weight: 400
}

#memberMenuModal h3 .close {
    position: absolute;
    right: 20px;
    top: 10px
}

#memberMenuModal h3 a {
    transform: translateY(-1px);
    display: inline-block;
    border-radius: var(--g-radius-sm);
    font-size: 13px;
    padding: var(--g-space-xs) var(--g-space-md);
    margin-left: var(--g-space-xs);
    color: var(--g-main-color-b-normal);
    background-color: var(--g-main-color-a-light)
}

#memberMenuModal h3 a:hover {
    background-color: var(--g-main-color-a-normal)
}

#memberMenuModal .ticket-list {
    background-color: var(--g-main-color-a-dark);
    border-radius: var(--g-radius-sm)
}

#memberMenuModal .ticket-list label {
    border-color: var(--g-main-color-a-light);
    border-radius: var(--g-radius-sm);
    color: var(--g-main-color-b-normal);
    overflow: hidden;
    margin: 5px
}

#memberMenuModal .ticket-list label p {
    font-size: 15px
}

#memberMenuModal .ticket-list label span {
    background-color: var(--g-main-color-a-normal);
    color: var(--g-main-color-b-normal)
}

#memberArea {
    display: flex
}

#memberArea #memberMenu {
    display: flex;
    flex-direction: column;
    background-color: var(--g-main-color-a-normal);
    width: 200px;
    border-radius: var(--g-radius-sm);
    margin-right: 20px;
    padding: var(--g-space-sm)
}

#memberArea #memberMenu a {
    color: var(--g-main-color-b-normal);
    padding: var(--g-space-xs) var(--g-space-md);
    white-space: nowrap;
    margin: var(--g-space-xs) 0
}

#memberArea #memberMenu a:hover {
    color: var(--g-primary-color-normal)
}

#memberArea #memberMenu a.active {
    pointer-events: none;
    background-color: var(--g-primary-color-normal);
    border-radius: var(--g-radius-sm)
}

#memberArea #memberMenu a.active, #memberArea #memberMenu a.active:hover {
    color: var(--g-main-color-b-light)
}

#memberArea #memberMenu a i {
    margin-right: var(--g-space-xs)
}

#memberArea #memberMenu a [class^=icon-] {
    display: inline-block;
    transform: translateY(3px)
}

#memberArea #memberAreaContent {
    display: flex;
    flex-direction: column;
    background-color: var(--g-main-color-a-normal);
    width: calc(100% - 220px);
    border-radius: var(--g-radius-sm);
    min-height: 100%;
    padding: var(--g-space-md) var(--g-space-lg)
}

#memberArea #memberAreaContent form {
    padding: var(--g-space-sm) var(--g-space-md)
}

#resetUserPhone button {
    margin-top: var(--g-space-sm)
}

#memberAreaCreditCard table tr td:last-child .actions {
    display: flex;
    justify-content: flex-end
}

#memberAreaCreditCard table tr td:last-child form {
    padding: 0 !important
}

#memberAreaCreditCard table tr td:last-child .btn-sm {
    border: none;
    font-size: 12px;
    white-space: nowrap;
    margin-left: 3px
}

#memberAreaDetails table tr td:last-child {
    text-align: right
}

#memberAreaBonuses .pokerBonusProgressBar {
    background-color: var(--g-main-color-a-dark);
    border: 1px solid var(--g-main-color-a-light)
}

#memberAreaBonuses .pokerBonusProgressBar div {
    background-image: linear-gradient(45deg, var(--g-main-color-a-light), var(--g-main-color-a-dark))
}

#memberAreaBonuses .pokerBonusProgressBar div.released {
    background-image: linear-gradient(45deg, var(--g-primary-color-normal), var(--g-primary-color-dark))
}

#memberAreaBonuses .pokerBonusProgressFooter small {
    color: var(--g-main-color-b-normal)
}

#memberAreaBonuses #pokerBonusHistoryTable tr td:last-child, #memberAreaBonuses #pokerBonusHistoryTable tr th:last-child {
    text-align: right
}

#amountForLottery {
    margin: 0
}

#userTicketList li {
    margin: var(--g-space-xs) 0;
    padding: var(--g-space-xs);
    border: 1px solid var(--g-main-color-a-light)
}

#userTicketList li, #userTicketList li span {
    background-color: transparent
}

#changeTickets, #getTickets {
    margin: 15px 0
}

#ticketColorSchema {
    text-align: center;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin: 15px 0;
    padding-top: 20px;
    border-top: 1px solid var(--g-main-color-a-light)
}

#ticketColorSchema p {
    margin-top: 3px
}

#ticketColorSchema small {
    width: 100%
}

.security-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    padding: var(--g-space-xs) 0;
    margin: var(--g-space-xs) 0;
    border-bottom: 1px solid var(--g-main-color-a-normal);
    border-top: 1px solid var(--g-main-color-a-normal)
}

.security-row label {
    margin: 0
}

.security-row .badge {
    margin-right: auto;
    margin-left: var(--g-space-xs)
}

#activityModal h3 {
    font-size: 15px;
    font-weight: 400;
    text-align: center;
    width: 100%
}

#activityModal h3 a {
    transform: translateY(-1px);
    display: inline-block;
    border-radius: var(--g-radius-sm);
    font-size: 13px;
    padding: var(--g-space-xs) var(--g-space-md);
    margin-left: var(--g-space-xs);
    color: var(--g-main-color-b-normal);
    background-color: var(--g-main-color-a-light)
}

#activityModal h3 a:hover {
    background-color: var(--g-main-color-a-normal)
}

#activityModal #activityModalContent {
    display: flex;
    flex-direction: column
}

#activityModal #activityModalContent .section-header {
    border-radius: var(--g-radius-sm);
    background-color: var(--g-main-color-a-light);
    color: var(--g-main-color-b-light);
    font-size: 14px;
    padding: var(--g-space-sm) var(--g-space-md);
    margin-top: var(--g-space-lg)
}

#activityModal #activityModalContent .payment-area {
    display: none
}

#activityModal #activityModalContent .payment-area p {
    font-size: 12px;
    text-align: center
}

#activityModal #activityModalContent .payment-area .modal-footer {
    padding: 0
}

#activityModal #activityModalContent .payment-method {
    background-color: var(--g-main-color-a-dark);
    border-radius: var(--g-radius-sm);
    border: 1px solid #666;
    margin: var(--g-space-xs) 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-size: 12px;
    padding: var(--g-space-sm);
    align-items: center;
    align-content: center;
    cursor: pointer
}

#activityModal #activityModalContent .payment-method i {
    margin-bottom: 10px
}

#activityModal #activityModalContent .payment-method p {
    margin: 0
}

#activityModal #activityModalContent #sectionFilter {
    position: relative;
    background-color: var(--g-main-color-a-light);
    overflow-x: auto;
    overflow-y: hidden;
    padding: 5px 0
}

#activityModal #activityModalContent #sectionFilter a {
    border-radius: 30px;
    background-color: var(--g-main-color-a-dark);
    font-size: 12px;
    padding: var(--g-space-xs) var(--g-space-md);
    white-space: nowrap;
    border-right: 1px solid var(--g-main-color-a-normal);
    text-align: center;
    cursor: pointer;
    margin: 2px;
    width: auto
}

#activityModal #activityModalContent #sectionFilter a.mixitup-control-active {
    background: var(--g-primary-color-normal);
    color: #fff
}

#activityModal #activityModalContent #sectionFilter .sm-next, #activityModal #activityModalContent #sectionFilter .sm-prev {
    display: none;
    position: absolute;
    z-index: 1;
    top: 0;
    height: 100%;
    background-color: var(--g-main-color-a-light);
    background-repeat: no-repeat;
    background-size: 50%;
    background-position: 50%;
    padding: 5px 25px
}

#activityModal #activityModalContent #sectionFilter .swiper-button-disabled {
    background-size: 0;
    background-color: var(--g-main-color-a-dark) !important;
    border-radius: 0
}

#activityModal #activityModalContent #sectionFilter .sm-prev {
    left: -37px;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTS0xLTFoNTgydjQwMkgtMXoiLz48Zz48cGF0aCBmaWxsPSJub25lIiBkPSJNMCAwaDUwdjUwSDB6Ii8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTM1IDQ3LjI1bDIuMDg2LTIuMDg2TDE2LjkyMiAyNSAzNy4wODYgNC44MzYgMzUgMi43NSAxMi43NSAyNXoiLz48L2c+PC9zdmc+)
}

#activityModal #activityModalContent #sectionFilter .sm-next {
    right: -37px;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTS0xLTFoNTgydjQwMkgtMXoiLz48Zz48cGF0aCBmaWxsPSJub25lIiBkPSJNMCAwaDUwdjUwSDB6Ii8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE1IDIuNzVsLTIuMDg2IDIuMDg2TDMzLjA3OCAyNSAxMi45MTQgNDUuMTY0IDE1IDQ3LjI1IDM3LjI1IDI1eiIvPjwvZz48L3N2Zz4=)
}

#activityModal #activityModalContent #sectionFilter .swiper-wrapper {
    height: auto
}

#activityModal .modal-dialog {
    background-color: var(--g-main-color-a-normal)
}

#activityModal hr {
    width: 100%;
    border-top: 1px solid var(--g-main-color-a-dark)
}

#activityModal form {
    padding: var(--g-space-sm) var(--g-space-md)
}

#activityModal table tr td:last-child {
    text-align: right
}


.frameLayoutModal {
    background-color: #212121;
    border-radius: 10px !important;
    border-top: 1px solid transparent;
    width: calc(100% - 100px) !important;
    margin: 50px auto !important;
}

#messageContent {
    background-color: var(--g-main-color-a-dark);
    border-radius: var(--g-radius-sm);
    padding: var(--g-space-md)
}

#messages tr td:nth-child(2) {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 200px
}

#messages tr td:last-child {
    white-space: nowrap
}

.list-group-item {
    background-color: var(--g-main-color-a-normal);
    color: var(--g-main-color-b-normal);
    font-size: 12px
}

.list-group-item:hover {
    color: var(--g-main-color-b-light);
    background-color: var(--g-main-color-a-light)
}

.list-group-item.active {
    background-color: var(--g-secondary-color-normal);
    border-color: var(--g-secondary-color-dark)
}

#deposit-envoy-form .list-group-item, #deposit-paygiga-form .list-group-item {
    background-color: #fff !important;
    color: var(--g-main-color-a-dark)
}

#registerPage .register-description {
    background-color: var(--g-main-color-a-light);
    border: none;
    margin: var(--g-space-lg) 0
}

#registerPage .card {
    background-color: var(--g-main-color-a-normal);
    border: 1px solid var(--g-main-color-a-light);
    margin-bottom: var(--g-space-lg)
}

#registerPage .panel-heading {
    border-radius: var(--g-radius-sm);
    background-color: var(--g-main-color-a-light);
    padding-left: var(--g-space-lg);
    margin-bottom: var(--g-space-sm) !important
}

#registerPage .panel {
    border-radius: var(--g-radius-sm);
    background-color: var(--g-main-color-a-dark);
    padding: var(--g-space-md)
}

#registerPage form .option-group {
    display: flex
}

#registerPage form .option-group .custom-radio {
    background-color: var(--g-main-color-a-normal);
    border: 1px solid var(--g-main-color-a-light);
    border-radius: var(--g-radius-sm);
    color: var(--g-main-color-b-dark);
    font-size: 13px;
    display: block;
    width: 100% !important;
    margin-bottom: 5px
}

#registerPage form .option-group .custom-control-label {
    display: block;
    cursor: pointer;
    padding: var(--g-space-xs) var(--g-space-md) var(--g-space-xs) var(--g-space-sm)
}

#registerPage form .option-group .custom-control-label:after, #registerPage form .option-group .custom-control-label:before {
    top: 6px;
    left: 11px
}

#registerPage form .option-group .custom-control-label:after {
    opacity: .6
}

#registerPage form .option-group .custom-control-label:before {
    background-color: var(--g-main-color-a-dark)
}

#registerPage form .row {
    margin-right: -10px;
    margin-left: -10px
}

#registerPage form .form-group label {
    text-transform: uppercase;
    margin-bottom: 0
}

#registerPage form .form-group .form-control {
    border-radius: var(--g-radius-sm)
}

#registerPage .btn-primary:disabled {
    background-color: #333743
}

#registerModal {
    margin-top: 60px;
    z-index: 99999999 !important
}

#registerModal .modal-dialog {
    max-width: 575px;
    width: 100%;
    height: auto;
    position: fixed;
    left: 50%;
    top: 35%;
    transform: translate(-50%, -30%) scale(1) !important;
    z-index: 50;
    overflow-X: hidden;
    border-radius: 5px;
    background-color: transparent;
    border: none
}

#registerModal .modal-dialog .modal-content {
    padding: 0 !important;
    color: #333
}

#registerModal .modal-dialog .modal-content input.is-valid, #registerModal .modal-dialog .modal-content select.is-valid {
    border-color: #339069 !important
}

#registerModal .modal-dialog .reg-main-holder {
    width: 100%;
    background: #fff;
    border-radius: 5px;
    float: left;
    padding: 10px 15px
}

#registerModal .icons-holder {
    width: 100%;
    padding: 10px 0 0
}

#registerModal .icons-holder .icons-nav {
    list-style-type: none;
    padding: 0;
    display: flex;
    justify-content: space-between
}

#registerModal .icons-holder .icons-nav .col-md-3 {
    width: 25%;
    text-align: center
}

#registerModal .icons-holder .icons-nav li .icons-link {
    text-decoration: none;
    color: #c8c9cd;
    font-size: 11px;
    font-weight: 700
}

#registerModal .icons-holder .icons-nav li .icons-link .nav-icons-container {
    width: 105px !important;
    height: 47px !important;
    opacity: .6;
    margin: 0 auto
}

#registerModal .icons-holder .icons-nav li .icons-link.active {
    color: #7b7c81
}

#registerModal .icons-holder .icons-nav li .icons-link.active .nav-icons-container {
    opacity: 1
}

#registerModal hr {
    width: 88%;
    height: 2px;
    background: #f4f4f4;
    margin: 5px auto;
    position: relative;
    border-top: 0
}

#registerModal .sprite-global-registration {
    background-repeat: no-repeat;
    background-size: 900px 953px;
    display: inline-block;
    transform: scale(.4);
    transform-origin: 52px top
}

#registerModal .sprite-global-registration.sprite-global-registration-account {
    background-position: -510px -290px;
    width: 116px;
    height: 116px
}

#registerModal .sprite-global-registration.sprite-global-registration-details {
    background-position: -650px -479px;
    width: 116px;
    height: 116px
}

#registerModal .sprite-global-registration.sprite-global-registration-contact {
    background-position: -776px -479px;
    width: 116px;
    height: 116px
}

#registerModal .sprite-global-registration.sprite-global-registration-bonus {
    background-position: -520px -536px;
    width: 116px;
    height: 116px
}

#registerModal .form-group {
    padding: 0 5px
}

#registerModal .form-group .form-control {
    background-color: transparent;
    color: #7b7c81;
    border-radius: 5px;
    font-weight: 700;
    border: 2px solid #ececec;
    height: 45px;
    padding: 0 15px
}

#registerModal .form-group .form-control:focus, #registerModal .form-group .form-control:hover {
    border-color: #7b7c81
}

#registerModal .form-group .form-control[placeholder] {
    color: #7b7c81
}

#registerModal .form-group .form-control.is-invalid {
    border-color: #ff4141;
    margin-bottom: 0
}

#registerModal .form-group .form-text.text-danger.filled {
    background: #ff4141;
    color: #fff !important;
    text-align: center;
    font-size: 12px !important;
    padding: 5px;
    display: block;
    width: 90%;
    margin: 0 auto;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px
}

#registerModal .form-group label {
    margin-left: 20px;
    text-align: left;
    color: #7b7c81;
    margin-bottom: 15px;
    font-weight: 700;
    float: left;
    width: 100%
}

#registerModal h3 {
    font-weight: 700;
    color: #7b7c81;
    margin-bottom: 15px;
    font-size: 16px;
    text-transform: none;
    text-align: center
}

#registerModal #registrationAccountBonus, #registerModal #registrationAccountContact, #registerModal #registrationAccountDetail, #registerModal #registrationAccountInformation {
    background: #fff;
    margin: 10px auto;
    width: 90%
}

#registerModal button {
    background: #333743 !important;
    color: #fff;
    outline: none;
    border: none;
    border-radius: 5px !important;
    width: 100% !important;
    padding: 12px 0;
    font-weight: 600;
    text-transform: uppercase;
    margin: 20px auto;
    opacity: 1;
    font-size: 13px
}

#registerModal button i {
    margin-left: var(--g-space-xs)
}

#registerModal .next-tab {
    background: #333743 !important;
    color: #fff;
    outline: none;
    border: none;
    border-radius: 5px !important;
    width: 100% !important;
    padding: 12px 0;
    font-weight: 600;
    text-transform: uppercase;
    margin: 20px auto;
    opacity: 1;
    font-size: 13px;
    display: block;
    text-align: center
}

#registerModal .next-tab.unactive {
    opacity: .3
}

#registerModal .holder {
    display: flex;
    justify-content: space-between
}

#registerModal .holder .form-group {
    width: 50%
}

#registerModal .gender-section {
    display: flex
}

#registerModal .gender-section .register-text {
    width: 30%;
    margin: 0 0 0 20px
}

#registerModal .gender-section .option-group {
    width: 70%
}

#registerModal .gender-section .custom-control {
    margin: 0;
    display: flex;
    align-items: center;
    align-content: center
}

#registerModal .gender-section .custom-control-label {
    margin: 0
}

#registerModal .gender-section label {
    display: flex;
    align-self: center
}

#registerModal .blockify {
    font-size: 14px;
    line-height: 1.42857143;
    color: #333;
    margin-bottom: var(--g-space-sm)
}

#registerModal .blockify p {
    margin: 0;
    text-align: center
}

#registerModal .blockify a {
    margin-left: 4px;
    color: #d94327
}

#registerModal .close {
    font-weight: 100;
    background-color: transparent !important;
    opacity: 1;
    text-transform: capitalize;
    margin: 0;
    width: auto !important;
    text-shadow: none !important;
    padding: 5px !important
}

#registerModal .google-sec-code .g-recaptcha > div {
    margin: 0 auto;
    height: auto !important
}

.modal-backdrop.fade.show.register-modal {
    opacity: .75;
    z-index: 9999999 !important
}

#submit.register-submit:disabled {
    opacity: .23
}

#registerModal #registrationAccountBonus a:hover {
    color: #333
}

#registerModal #registrationAccountBonus .form-group label {
    float: none
}

#UyeOlForm .form-group .field-info {
    right: 16px;
    top: 7px
}

#UyeOlForm .form-group .field-info.birthday {
    top: 0
}

section#maiPageSteps {
    padding: var(--g-space-lg);
    display: flex;
    justify-content: center;
    background-color: var(--g-main-color-a-dark)
}

section#maiPageSteps .step {
    display: flex;
    padding: 20px 60px 20px 20px;
    position: relative
}

section#maiPageSteps .step img {
    position: absolute;
    right: 8px;
    top: 30px;
    display: block
}

section#maiPageSteps .step a {
    display: flex;
    flex-direction: column;
    transition: all .2s ease-in
}

section#maiPageSteps .step a:hover {
    transform: scale(1.1)
}

section#maiPageSteps .step a:hover h1, section#maiPageSteps .step a:hover h3 {
    text-shadow: rgba(46, 46, 46, .5) 0 0 8px
}

section#maiPageSteps .step a h1 {
    color: var(--g-main-color-b-normal);
    font-size: 42px;
    font-weight: 900
}

section#maiPageSteps .step a h3 {
    color: var(--g-main-color-b-light);
    font-size: 18px;
    font-weight: 400
}

section#maiPageSteps .step a h1, section#maiPageSteps .step a h3 {
    text-align: center;
    margin: 0;
    transition: all .2s ease-in
}

#pokerPage #pokerGames {
    padding-top: var(--g-space-lg)
}

#pokerPage .game-list .game {
    background-color: var(--g-main-color-a-normal);
    border: 5px solid var(--g-main-color-a-light);
    border-radius: var(--g-radius-sm);
    overflow: hidden
}

#pokerPage .game-list .game a {
    display: flex;
    flex-direction: column;
    align-content: center;
    align-items: center;
    width: 100%
}

#pokerPage .game-list .game a p {
    color: var(--g-main-color-b-normal);
    text-align: center;
    font-size: 20px;
    margin: var(--g-space-sm) 0 0 0
}

#pokerPage .game-list .game a > span {
    border: 1px solid var(--g-main-color-a-light);
    border-radius: var(--g-radius-sm);
    padding: var(--g-space-xs) var(--g-space-md);
    color: #fff;
    position: absolute !important;
    top: 60px;
    left: 50%;
    margin-left: 0 !important;
    transform: translateX(-50%)
}

#pokerPage .game-list .game a .gradient {
    display: none
}

#pokerPage .game-list .game a .buttons {
    height: 100%;
    position: absolute;
    bottom: -100%;
    background-color: var(--g-main-color-a-light);
    transition: var(--g-transition);
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center
}

#pokerPage .game-list .game a:hover .buttons {
    bottom: 0
}

#pokerPage .game-list .game a:hover .buttons .btn {
    background-color: var(--g-primary-color-normal);
    padding: var(--g-space-xs) var(--g-space-lg)
}

#pokerPage .btn.trans {
    background-color: var(--g-main-color-a-light);
    padding: var(--g-space-sm) 0;
    color: var(--g-main-color-b-normal);
    font-size: 18px;
    border-radius: var(--g-radius-sm)
}

#pokerPage .btn.trans:hover {
    background-color: var(--g-main-color-a-normal) !important
}

#pokerPage #pokerActions {
    display: flex;
    align-items: center
}

#pokerPage #pokerActions #create-poker-form .plus-username-input.form-control {
    color: #333
}

#pokerPage .box {
    border: 5px solid rgba(53, 50, 50, .58);
    background-color: rgba(76, 79, 88, .35)
}

#pokerPage .box .box-header {
    border-bottom: 3px solid rgba(84, 84, 84, .5)
}

#newCasinoPage #casinoGames #gameList .game {
    border: none
}

#gamePreModal .modal-header i {
    border: 3px solid var(--g-main-color-b-normal);
    background-color: var(--g-main-color-b-normal)
}

#gamePreModal .modal-body .game-image {
    border: 5px solid var(--g-main-color-a-normal)
}

#gamePreModal #loginLogo img {
    opacity: 1 !important
}

#newCasinoPage {
    background-color: var(--g-main-color-a-dark)
}

#newCasinoPage h2 {
    color: var(--g-main-color-b-light) !important
}

#newCasinoPage #casinoGames {
    padding: 0;
    min-height: auto
}

#newCasinoPage #casinoGames.unactive {
    display: none
}

#newCasinoPage #casinoGames #gameList .game {
    border-radius: var(--g-radius-sm)
}

.btn.fetch-casino-games {
    background-color: var(--g-primary-color-normal)
}

body #lgf-container {
    max-height: calc(100% - 56px)
}

body.bottom-bar-hidden #lgf-container {
    max-height: 100%
}

body.flashbar-visible #lgf-container {
    max-height: calc(100% - 56px)
}

body.flashbar-visible.bottom-bar-hidden #lgf-container {
    max-height: 100%
}

#detailedList {
    background: var(--g-main-color-a-dark)
}

#detailedList .casino-loader.text-center {
    background-color: var(--g-main-color-a-normal)
}

#detailedList .casino-loader.text-center .fetch-casino-games.more-loader .casino-loader-text {
    background: var(--g-main-color-a-dark);
    color: var(--g-main-color-b-light)
}

#gameList .game {
    border-radius: var(--g-radius-sm)
}

#newCasinoPage #casinoGames #defaultList .game-list-section {
    background-color: var(--g-main-color-a-dark)
}

#newCasinoPage #casinoGames #defaultList .game-list-section:nth-child(2n) {
    background-color: var(--g-main-color-a-light)
}

#newCasinoPage #casinoGames #defaultList .game-list-section:nth-child(2n) .casino-loader.text-center {
    background-color: var(--g-main-color-a-dark)
}

#newCasinoPage #casinoGames #defaultList .game-list-section:nth-child(2n) .casino-loader.text-center button {
    background-color: var(--g-main-color-a-light)
}

#newCasinoPage #casinoGames #defaultList .game-list-section:last-child .casino-loader.text-center {
    background-color: var(--g-main-color-a-normal)
}

#newCasinoPage #casinoGames #defaultList .game-list-section .casino-loader.text-center {
    background-color: var(--g-main-color-a-light)
}

#newCasinoPage #casinoGames #defaultList .game-list-section .casino-loader.text-center button {
    background-color: var(--g-main-color-a-dark);
    color: var(--g-main-color-b-light)
}

#gamePreModal .modal-dialog #GonderBtn, #gamePreModal .modal-dialog .btn.btn-primary.btn-block {
    border: 2px solid var(--g-secondary-color-dark) !important
}

#gamePreModal .modal-dialog .link {
    color: var(--g-secondary-color-dark)
}

#blogPage #pageHeader {
    background-color: var(--g-main-color-a-light);
    border-radius: var(--g-radius-sm);
    color: var(--g-main-color-b-normal);
    padding: var(--g-space-sm) var(--g-space-lg)
}

#blogPage #leftBar {
    background-color: var(--g-main-color-a-dark);
    border-radius: var(--g-radius-sm);
    padding: var(--g-space-md)
}

#blogPage #leftBar a {
    margin: var(--g-space-xs) 0
}

#blogPage #leftBar #pageSearch, #blogPage #leftBar a {
    border-radius: var(--g-radius-sm);
    background-color: var(--g-main-color-a-normal)
}

#blogPage #leftBar #pageSearch {
    border-color: var(--g-main-color-a-light);
    margin-bottom: var(--g-space-md);
    font-size: 14px
}

#blogPage .blogContent {
    background-color: var(--g-main-color-a-dark);
    border-radius: var(--g-radius-sm);
    padding: var(--g-space-lg)
}

body.light-mode header {
    box-shadow: 0 0 20px hsla(0, 0%, 100%, .4)
}

body.light-mode header #headerLogo:before {
    background-color: rgba(0, 0, 0, .05)
}

body.light-mode header #beforeLoginMenuDesktop a {
    color: var(--g-main-color-a-light)
}

body.light-mode header #beforeLoginMenuDesktop a:first-child {
    background-color: var(--g-main-color-b-light)
}

body.light-mode header #beforeLoginMenuDesktop a:first-child:hover {
    background-color: var(--g-main-color-b-normal)
}

body.light-mode header #beforeLoginMenuDesktop a:last-child {
    background-color: var(--g-primary-color-normal)
}

body.light-mode header #beforeLoginMenuDesktop a:last-child:hover {
    background-color: var(--g-primary-color-dark)
}

body.light-mode footer #footerPlatformSection a {
    background-image: url(../../common/img/KlasPlatform-dark.png)
}

body.light-mode footer #footerPlatformSection a img {
    opacity: 0
}

body.light-mode #bottomBar {
    border-top: 5px solid var(--g-main-color-a-dark);
    box-shadow: 0 0 20px hsla(0, 0%, 100%, .4)
}

body.light-mode #bottomBar > div:last-child {
    border-left: 1px solid var(--g-main-color-a-dark)
}

body.light-mode #bottomBar a {
    border-right: 1px solid var(--g-main-color-a-dark)
}

body.light-mode #bottomBar .site-time {
    border-color: var(--g-main-color-a-dark)
}

body.light-mode section#maiPageSteps .step a:hover h1, body.light-mode section#maiPageSteps .step a:hover h3 {
    text-shadow: hsla(0, 0%, 100%, .5) 0 0 18px
}

body.light-mode #pokerActions {
    color: var(--g-main-color-b-normal)
}

body.light-mode #pokerPage .game-list .game .online {
    color: var(--g-main-color-b-normal);
    border-color: var(--g-main-color-b-normal)
}

body.light-mode #memberActions a#openLoginModal, body.light-mode #memberActions a#openMemberMenu {
    background-color: var(--g-main-color-b-light);
    color: var(--g-main-color-a-normal) !important
}

body.light-mode .form-control {
    border-color: var(--g-main-color-a-normal)
}

body.light-mode .form-control:focus {
    border-color: var(--g-main-color-a-dark);
    background-color: var(--g-main-color-a-light)
}

body.light-mode #newCasinoPage #casinoGames #casinoSidebar {
    border-right: 1px solid rgba(0, 0, 0, .05)
}

body.light-mode #newCasinoPage #casinoGames #casinoSidebar a {
    color: #333;
    border-bottom: 1px solid rgba(0, 0, 0, .05)
}

body.light-mode #blogPage {
    background-color: var(--g-main-color-a-normal)
}

body.light-mode #blogPage #leftBar a {
    color: var(--g-main-color-b-light)
}

body.light-mode #activityModal #activityModalContent #sectionFilter .sm-next {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgNTAgNTAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTEzLjg1NCA0OC43MDdMMzcuNTYxIDI1IDEzLjg1NCAxLjI5M2wtMS40MTUgMS40MTRMMzQuNzMyIDI1IDEyLjQzOSA0Ny4yOTN6Ii8+PC9zdmc+)
}

body.light-mode #activityModal #activityModalContent #sectionFilter .sm-prev {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgNTAgNTAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTM3LjU2MSA0Ny4yOTNMMTUuMjY3IDI1IDM3LjU2MSAyLjcwN2wtMS40MTUtMS40MTRMMTIuNDM5IDI1bDIzLjcwNyAyMy43MDd6Ii8+PC9zdmc+)
}

body.light-mode .iziModal .iziModal-header .iziModal-button {
    filter: invert(200%)
}

body.light-mode.mobile-page #mainPage {
    background: none
}

body.light-mode.mobile-page #mainPage .event-list .event .event-bradcrumb a, body.light-mode.mobile-page #mainPage .event-list .event .event-name {
    color: #fff
}

body.light-mode.mobile-page #memberMenuModal #memberAreaContent .change-pass .form-group label, body.light-mode.mobile-page #memberMenuModal #memberAreaContent .information .form-group label, body.light-mode.mobile-page #memberMenuModal #memberAreaContent h5, body.light-mode.mobile-page #memberMenuModal #memberAreaDetails .balance-info .currentBalance p, body.light-mode.mobile-page #memberMenuModal #memberAreaDetails .close, body.light-mode.mobile-page #memberMenuModal #memberAreaDetails .table tr td, body.light-mode.mobile-page #memberMenuModal #memberAreaDetails .table tr th {
    color: var(--g-main-color-b-light)
}

body.light-mode.mobile-page #mobileMainMenu.mobileSportMenuBox #sportTopMenu .sport-icon-top {
    filter: brightness(0) hue-rotate(1turn)
}

body.light-mode.mobile-page #mobileMainMenu.mobileSportMenuBox #sportTopMenu a, body.light-mode.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu a {
    color: var(--g-main-color-b-normal)
}

body.light-mode.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu a .sport-icon, body.light-mode.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu a .sport-menu-icon {
    filter: brightness(0) hue-rotate(1turn)
}

body.light-mode.mobile-page #mobileMainMenu .dropdownDepositBox #dropdownDepositBtn {
    color: var(--g-main-color-b-noraml) !important
}

body.light-mode.mobile-page header #headerForSportPage .sportPageContainer a span, body.light-mode.mobile-page header .header-area {
    filter: brightness(0) hue-rotate(1turn)
}

body.light-mode.mobile-page header #headerForSportPage .sportPageContainer a p {
    color: var(--g-main-color-b-normal)
}

body.light-mode.mobile-page .modal-backdrop.fade.show.login-modal {
    filter: invert(1) brightness(100%) hue-rotate(150deg)
}

body.light-mode.mobile-page #loginModal .modal-body form .form-group .form-control {
    border-color: var(--g-main-color-a-dark)
}

body.light-mode.mobile-page #bottomBar #mobileBottomMenu a .icon-holder {
    filter: brightness(25%) hue-rotate(1turn)
}

body.light-mode.mobile-page #mobileRotateMenu.opened .bottom-logout span i {
    border-color: var(--g-main-color-b-light);
    background-color: var(--g-main-color-b-normal);
    color: var(--g-main-color-a-light)
}

body.light-mode #mainPage #mainPageBoxes .container .box {
    color: #333
}

body.light-mode #mainPage #mainPageBoxes .container .box .box-header > i.sport-icon, body.light-mode #mainPage #mainPageGameSliders .game-slider-title > i.sport-menu-icon {
    filter: invert(100%)
}

body.light-mode #opportunitiesSlider .swiper-slide img {
    opacity: .8
}

body.light-mode header #memberActions #dropdownBalance a {
    color: #fff !important
}

body.light-mode #memberArea #memberMenu a.active {
    color: #fff
}

body.dark-mode #loginLogo {
    background-image: url(../img/logo-dark-bg.png);
    background-size: auto 100%;
    background-position: 50%;
    background-repeat: no-repeat
}

body.dark-mode #loginLogo img {
    opacity: 0
}

#mainPage .container {
    max-width: 1500px
}

#mainPage #maiPageSlider {
    box-shadow: 0 0 5px 5px rgba(0, 0, 0, .2);
    z-index: 1
}

#mainPage #maiPageSlider .owl-nav button {
    position: absolute;
    z-index: 9999;
    top: 14vw
}

#mainPage #maiPageSlider .owl-nav button.owl-prev {
    left: 5%
}

#mainPage #maiPageSlider .owl-nav button.owl-prev i {
    font-size: 30px !important
}

#mainPage #maiPageSlider .owl-nav button.owl-next {
    right: 5%
}

#mainPage #maiPageSlider .owl-nav button.owl-next i {
    font-size: 30px !important
}

#mainPage #mainPageBoxes {
    padding: 30px 0 0;
    z-index: 9
}

#mainPage #mainPageBoxes .mobile-title, #mainPage #mainPageBoxes .see-all-link {
    display: none
}

#mainPage #mainPageBoxes .container {
    display: flex
}

#mainPage #mainPageBoxes .container .box {
    border: 1px solid var(--g-main-color-a-light);
    background-color: var(--g-main-color-a-normal);
    color: #fff;
    margin: 10px;
    position: relative
}

#mainPage #mainPageBoxes .container .box .box-content {
    height: calc(100% - 45px)
}

#mainPage #mainPageBoxes .container .box .box-header {
    padding: 10px 20px;
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: flex-start;
    background-color: var(--g-main-color-a-dark);
    border-bottom: 1px solid var(--g-main-color-a-light)
}

#mainPage #mainPageBoxes .container .box .box-header > i {
    font-size: 24px !important;
    margin-right: 5px
}

#mainPage #mainPageBoxes .container .box .box-header > i.sport-icon {
    width: 24px;
    height: 24px
}

#mainPage #mainPageBoxes .container .box .box-header .options {
    display: flex;
    margin-left: auto
}

#mainPage #mainPageBoxes .container .box .box-header a {
    padding: 5px 10px;
    font-size: 14px !important
}

#mainPage #mainPageBoxes .container .box .box-header a, #mainPage #mainPageBoxes .container .box .box-header select {
    background-color: transparent;
    font-size: 12px;
    color: var(--g-main-color-b-dark);
    border: 1px solid var(--g-main-color-a-normal);
    margin-left: 3px;
    height: auto
}

#mainPage #mainPageBoxes .container .box .box-header a {
    padding: 0 10px
}

#mainPage #mainPageBoxes .container .box .box-header select {
    padding: 0 15px 0 5px
}

#mainPage #mainPageBoxes .container .box .box-header #featuredEventsIntervalSelect, #mainPage #mainPageBoxes .container .box .box-header #liveEventsIntervalSelect, #mainPage #mainPageBoxes .container .box .box-header #upcomingEventsIntervalSelect {
    width: 80px
}

#mainPage #mainPageBoxes .container .box .box-header #featuredEventsSportSelect, #mainPage #mainPageBoxes .container .box .box-header #liveEventsSportSelect, #mainPage #mainPageBoxes .container .box .box-header #upcomingEventsSportSelect {
    width: 120px
}

#mainPage #mainPageBoxes .container .box .box-header p {
    margin-right: auto
}

#mainPage #mainPageBoxes .container .box:first-child {
    width: calc(60% - 20px)
}

#mainPage #mainPageBoxes .container .box:nth-child(2) {
    width: calc(40% - 20px)
}

#mainPage #mainPageGameSliders {
    padding: 20px 10px
}

#mainPage #mainPageGameSliders .mobile-title {
    display: none
}

#mainPage #mainPageGameSliders .controls {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    -webkit-border-radius: 20px;
    align-self: center;
    transform: translateY(-32px)
}

#mainPage #mainPageGameSliders .swiper-pagination {
    position: relative;
    align-content: center;
    align-items: center;
    display: flex
}

#mainPage #mainPageGameSliders .swiper-pagination-bullet {
    width: 15px;
    height: 15px;
    margin: 5px 3px
}

#mainPage #mainPageGameSliders .swiper-pagination-bullet-active {
    background-color: var(--g-secondary-color-normal)
}

#mainPage #mainPageGameSliders .sm-next, #mainPage #mainPageGameSliders .sm-prev {
    background-color: #111;
    border-radius: 50%;
    margin: 5px;
    background-repeat: no-repeat;
    background-size: 50%;
    background-position: 50%;
    height: 20px;
    width: 20px;
    padding: 0;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    position: relative
}

#mainPage #mainPageGameSliders .swiper-button-disabled {
    opacity: .2
}

#mainPage #mainPageGameSliders .sm-prev {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTS0xLTFoNTgydjQwMkgtMXoiLz48Zz48cGF0aCBmaWxsPSJub25lIiBkPSJNMCAwaDUwdjUwSDB6Ii8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTM1IDQ3LjI1bDIuMDg2LTIuMDg2TDE2LjkyMiAyNSAzNy4wODYgNC44MzYgMzUgMi43NSAxMi43NSAyNXoiLz48L2c+PC9zdmc+)
}

#mainPage #mainPageGameSliders .sm-next {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTS0xLTFoNTgydjQwMkgtMXoiLz48Zz48cGF0aCBmaWxsPSJub25lIiBkPSJNMCAwaDUwdjUwSDB6Ii8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE1IDIuNzVsLTIuMDg2IDIuMDg2TDMzLjA3OCAyNSAxMi45MTQgNDUuMTY0IDE1IDQ3LjI1IDM3LjI1IDI1eiIvPjwvZz48L3N2Zz4=)
}

#mainPage #mainPageGameSliders .game-slider-title {
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: flex-start;
    font-size: 13px;
    position: relative;
    width: 100%;
    text-align: left;
    color: var(--g-main-color-b-normal);
    background-color: var(--g-main-color-a-light);
    padding: 10px 25px
}

#mainPage #mainPageGameSliders .game-slider-title .see-all-link {
    margin-left: auto;
    color: #fff;
    font-weight: 700;
    font-size: 15px
}

#mainPage #mainPageGameSliders .game-slider-title > i {
    color: var(--g-primary-color-normal);
    font-size: 20px;
    margin-right: 5px
}

#mainPage #mainPageGameSliders .game-slider-title > i.sport-menu-icon {
    width: 24px;
    height: 24px
}

#mainPage #mainPageGameSliders .game-slider-title:after {
    top: 100%;
    left: 50%;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border: 12px solid rgba(136, 183, 213, 0);
    border-top: 12px solid var(--g-main-color-a-light);
    margin-left: -12px;
    display: none
}

#mainPage #mainPageGameSliders .most-popular-games-slider {
    border: 1px solid var(--g-main-color-a-light);
    padding: 5px 0 25px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background-color: var(--g-main-color-a-normal)
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game {
    margin: 5px;
    position: relative;
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
    transition: all .5s;
    width: 150px;
    height: 150px;
    border: 5px solid var(--g-main-color-a-normal)
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game .hover-box {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: var(--g-main-color-a-light);
    z-index: 10;
    color: #fff;
    text-align: center;
    background-size: cover;
    transition: all .3s
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game .hover-box > p {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    font-size: 12px;
    text-align: left;
    padding: 0 0 0 5px
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game .hover-box > .toggle-favorite {
    position: absolute;
    font-size: 20px;
    top: 10px;
    right: 10px
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game .hover-box > .open-in-new-tab {
    position: absolute;
    font-size: 20px;
    bottom: 10px;
    right: 10px
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game .hover-box .buttons {
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    position: absolute;
    width: 100%;
    display: none
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game .hover-box .buttons button {
    padding: 5px 10px;
    border-radius: 5px;
    margin: 3px 0;
    background-color: #fff;
    font-size: 12px
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game .hover-box .buttons button:hover {
    opacity: .9
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game:hover .game-image {
    transform: scale(1.2)
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game:hover .hover-box {
    opacity: 1
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game .buttons {
    display: flex;
    flex-direction: column;
    align-items: center;
    align-content: center;
    justify-content: center;
    position: absolute;
    top: 200%;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--g-main-color-a-light);
    transition: all .3s
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game:hover {
    border-color: var(--g-main-color-a-light)
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game:hover .buttons, #mainPage #mainPageGameSliders .most-popular-games-slider .game:hover p {
    top: 0
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game:hover i.open-in-new-tab, #mainPage #mainPageGameSliders .most-popular-games-slider .game:hover i.toggle-favorite {
    opacity: 1
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game img {
    -o-object-fit: fit;
    object-fit: fit;
    width: 100%;
    height: 100%
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game p {
    font-size: 12px;
    padding: 0 0 0 5px;
    position: absolute;
    top: -200%;
    color: red;
    width: 100%;
    transition: all .3s;
    text-align: left;
    z-index: 9
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game i {
    position: absolute;
    text-shadow: 0 0 2px #000;
    color: #fff;
    z-index: 10;
    font-size: 20px !important;
    transform: scale(.55)
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game i.provider-o {
    position: absolute;
    bottom: 5px;
    transform: translateX(-50%) scale(.45)
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game i.open-in-new-tab {
    bottom: 5px;
    right: 5px;
    opacity: 0
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game i.toggle-favorite {
    top: 5px;
    right: 5px;
    opacity: 0
}

#mainPage #mainPageGameSliders .most-popular-games-slider .game button {
    border-radius: 20px;
    margin: 3px 0;
    background-color: var(--g-secondary-color-normal);
    font-size: 12px;
    white-space: nowrap
}

#mainPage #mainPageGameSliders .most-popular-games-slider .swiper-wrapper {
    height: auto
}

#mainPage .event-list {
    font-size: 13px;
    line-height: 12px;
    font-family: arial;
    display: flex;
    flex-direction: column;
    overflow: auto;
    height: 300px;
    background-color: var(--g-main-color-a-normal)
}

#mainPage .event-list > i.fa-spin {
    align-self: center;
    top: 50%;
    position: absolute;
    font-size: 20px !important
}

#mainPage .event-list .sport-group {
    border-bottom: 15px solid var(--g-main-color-a-normal);
    border-right: 1px solid var(--g-main-color-a-dark)
}

#mainPage .event-list .sport-group .sport-content {
    display: flex;
    flex-direction: column
}

#mainPage .event-list .sport-group .sport-header {
    box-shadow: 0 0 5px 5px rgba(0, 0, 0, .2);
    background-color: var(--g-main-color-a-normal);
    border: 1px solid var(--g-main-color-a-light);
    padding: 10px 15px;
    width: calc(100% - 20px);
    color: var(--g-main-color-b-normal);
    display: flex;
    font-weight: 700;
    border-radius: 3px;
    margin: 10px 10px 0;
    position: sticky;
    top: 0;
    z-index: 10
}

#mainPage .event-list .sport-group .category-group {
    padding: 10px 10px 0
}

#mainPage .event-list .sport-group .category-group .category-header {
    background-color: var(--g-main-color-a-light);
    border-radius: 3px;
    padding: 7px 10px;
    width: 100%;
    color: var(--g-main-color-b-normal);
    display: flex
}

#mainPage .event-list .sport-group .category-group .tournament-group .tournament-header {
    background-color: var(--g-main-color-a-dark);
    border-radius: 3px;
    padding: 5px 10px;
    margin: 5px;
    width: calc(100% - 10px);
    color: var(--g-main-color-b-normal);
    display: flex
}

#mainPage .event-list .sport-group .category-group .tournament-group .event {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    border: 1px solid var(--g-main-color-a-dark);
    margin: 5px;
    padding-left: 10px
}

#mainPage .event-list .sport-group .category-group .tournament-group .event .event-name {
    color: var(--g-main-color-b-normal)
}

#mainPage .event-list .sport-group .category-group .tournament-group .event .event-name small {
    color: var(--g-main-color-b-dark);
    font-size: 10px
}

#mainPage .event-list .sport-group .category-group .tournament-group .event .event-odds {
    display: flex
}

#mainPage .event-list .sport-group .category-group .tournament-group .event .event-odds .odd {
    display: flex;
    margin: 8px 5px;
    padding: 5px 10px;
    border-radius: 3px;
    background-color: var(--g-main-color-a-dark);
    color: var(--g-main-color-b-normal)
}

#mainPage .event-list .sport-group .category-group .tournament-group .event .event-odds .odd.disabled {
    pointer-events: none;
    opacity: .6
}

#mainPage .event-list .sport-group .category-group .tournament-group .event .event-odds .odd .odd-name {
    font-weight: 700;
    padding-right: 5px;
    margin-right: 5px;
    border-right: 1px solid var(--g-main-color-a-normal);
    opacity: .5
}

#opportunitiesSlider {
    position: relative;
    height: 300px;
    overflow: hidden
}

#opportunitiesSlider #zeppelinJackpot p {
    background-color: hsla(0, 0%, 100%, .6);
    border-radius: 20px;
    padding: 5px 10px;
    font-size: 13px;
    margin: 3px 0;
    color: #333;
    text-align: center;
    min-width: 200px;
    display: flex;
    justify-content: space-between
}

#opportunitiesSlider #zeppelinJackpot p small {
    margin-left: 5px;
    font-weight: 700
}

#opportunitiesSlider .swiper-slide {
    height: 100%
}

#opportunitiesSlider .swiper-slide img {
    width: 100%;
    height: 100%;
    opacity: .4
}

#opportunitiesSlider .swiper-slide .slider-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

#opportunitiesSlider .swiper-slide .slider-content p {
    margin: 0
}

#opportunitiesSlider .swiper-slide .slider-content a.btn {
    padding: 15px 50px;
    border-radius: 40px !important;
    color: #fff;
    background-color: #3da72a;
    font-weight: 700;
    transition: all .3s;
    position: relative;
    margin-top: 10px
}

#opportunitiesSlider .swiper-slide .slider-content a.btn:hover {
    transform: translateY(-3px)
}

#opportunitiesSlider .swiper-slide .slider-content a.btn:hover:before {
    opacity: 0
}

#opportunitiesSlider .swiper-slide .slider-content a.btn:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    border-radius: 40px;
    transition: all .3s;
    background: linear-gradient(180deg, hsla(0, 0%, 100%, .3) 0, hsla(0, 0%, 100%, 0))
}

#opportunitiesSlider:hover .sm-next, #opportunitiesSlider:hover .sm-prev {
    top: 50%
}

#opportunitiesSlider .sm-next, #opportunitiesSlider .sm-prev {
    background-color: #111;
    border-radius: 50%;
    margin: 5px;
    background-repeat: no-repeat;
    background-size: 50%;
    background-position: 50%;
    height: 40px;
    width: 40px;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    position: absolute;
    top: -500px;
    transform: translateY(-50%);
    z-index: 9
}

#opportunitiesSlider .swiper-button-disabled {
    opacity: .7;
    background-color: #444
}

#opportunitiesSlider .sm-prev {
    left: 10px;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTS0xLTFoNTgydjQwMkgtMXoiLz48Zz48cGF0aCBmaWxsPSJub25lIiBkPSJNMCAwaDUwdjUwSDB6Ii8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTM1IDQ3LjI1bDIuMDg2LTIuMDg2TDE2LjkyMiAyNSAzNy4wODYgNC44MzYgMzUgMi43NSAxMi43NSAyNXoiLz48L2c+PC9zdmc+)
}

#opportunitiesSlider .sm-next {
    right: 10px;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTS0xLTFoNTgydjQwMkgtMXoiLz48Zz48cGF0aCBmaWxsPSJub25lIiBkPSJNMCAwaDUwdjUwSDB6Ii8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE1IDIuNzVsLTIuMDg2IDIuMDg2TDMzLjA3OCAyNSAxMi45MTQgNDUuMTY0IDE1IDQ3LjI1IDM3LjI1IDI1eiIvPjwvZz48L3N2Zz4=)
}

body.mobile-page {
    padding-top: 60px
}

body.mobile-page main#ssSportsPage {
    top: 56px;
    height: calc(100% - 60px)
}

body.mobile-page main#ssSportsPage iframe {
    top: 45px
}

body.mobile-page .tvbet-menu-icon, body.mobile-page .zeppelin-menu-icon {
    filter: grayscale(0) brightness(10)
}

body.mobile-page #mainMenu .menu-links a .new-tag {
    padding: 8px 0
}

body.mobile-page a .new-tag:before {
    opacity: 0
}

body.mobile-page #supportModal .btn-green {
    background-color: var(--g-primary-color-normal) !important
}

body.mobile-page.opened-rotate-menu #bottomBar {
    pointer-events: none;
    background-color: transparent;
    box-shadow: none
}

body.mobile-page.opened-rotate-menu #bottomBar #mobileBottomMenu a {
    opacity: 0
}

body.mobile-page.opened-rotate-menu #favoriteGames, body.mobile-page.opened-rotate-menu #favoriteItems, body.mobile-page.opened-rotate-menu #recentItems {
    display: none !important
}

body.mobile-page.modal-open #favoriteGames, body.mobile-page.modal-open #favoriteItems, body.mobile-page.modal-open #recentItems {
    display: none
}

body.mobile-page #recentItems.opened {
    display: flex;
    height: 155px;
    bottom: 60px;
    width: 100%;
    left: 0;
    position: fixed;
    border-radius: 0;
    overflow-x: auto;
    flex-direction: row
}

body.mobile-page #recentItems.opened .recent-item {
    border: none;
    position: relative;
    padding: 0;
    margin: 0
}

body.mobile-page #recentItems.opened .recent-item a span {
    display: none
}

body.mobile-page #recentItems.opened .recent-item a img {
    height: 140px;
    width: 140px
}

body.mobile-page #favoriteItems.opened {
    display: flex;
    height: 155px;
    bottom: 60px;
    width: 100%;
    left: 0;
    position: fixed;
    border-radius: 0;
    overflow-x: auto;
    flex-direction: row
}

body.mobile-page #favoriteItems.opened .favorite-item {
    border: none;
    position: relative
}

body.mobile-page #favoriteItems.opened .favorite-item a span {
    display: none
}

body.mobile-page #favoriteItems.opened .favorite-item a img {
    height: 140px;
    width: 140px
}

body.mobile-page #favoriteItems.opened .favorite-item .remove-favorite {
    position: absolute;
    top: -13px;
    right: 6px;
    background-color: transparent;
    padding: 5px
}

body.mobile-page #favoriteItems.opened .favorite-item .remove-favorite i {
    font-size: 25px !important
}

body.mobile-page #gamePreModal {
    color: #333;
    top: 0 !important;
    max-height: 100% !important
}

body.mobile-page #gamePreModal #loginForm {
    padding-bottom: 150px
}

body.mobile-page #gamePreModal #openRegisterModal {
    background: linear-gradient(135deg, #ff5e3a, #ff4a36) !important;
    border-radius: 5px;
    color: #fff;
    margin: 5px;
    padding: 10px 0
}

body.mobile-page #gamePreModal .game-image {
    margin-top: 5px
}

body.mobile-page #mobileRightMenu {
    position: fixed;
    right: -200%;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 99999999997
}

body.mobile-page #mobileRightMenu ul {
    list-style: none;
    background-color: var(--g-main-color-a-normal);
    overflow: auto;
    width: 100%;
    height: 100%;
    max-width: 200px;
    position: absolute;
    z-index: 99999999999;
    padding: 10px;
    transition: all .4s;
    right: -200%
}

body.mobile-page #mobileRightMenu ul li {
    margin: 5px 0
}

body.mobile-page #mobileRightMenu ul a {
    color: var(--g-main-color-b-normal);
    margin: 3px 0
}

body.mobile-page #mobileRightMenu ul a img {
    transform: scale(.8)
}

body.mobile-page #mobileRightMenu #closeMobileRightMenu {
    background-color: rgba(0, 0, 0, .4);
    position: absolute;
    z-index: 99999999998;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

body.mobile-page #mobileRightMenu.opened, body.mobile-page #mobileRightMenu.opened ul {
    right: 0
}

body.mobile-page #mobileRotateMenu {
    border: 5px solid var(--g-main-color-a-normal);
    left: 200%
}

body.mobile-page #mobileRotateMenu ul {
    position: relative
}

body.mobile-page #mobileRotateMenu ul li {
    width: 10em;
    height: 10.8em
}

body.mobile-page #mobileRotateMenu ul li a {
    padding-top: 2.7em;
    bottom: -5em;
    height: 12.4em;
    width: 12.4em
}

body.mobile-page #mobileRotateMenu ul li a span {
    padding: 0 2px 5px !important
}

body.mobile-page #mobileRotateMenu ul li a span i, body.mobile-page #mobileRotateMenu ul li a span img {
    transform: scale(.7)
}

body.mobile-page #mobileRotateMenu ul:after {
    top: 50px;
    left: 50px;
    width: calc(100% - 100px);
    height: calc(100% - 100px)
}

body.mobile-page #mobileRotateMenu ul:after, body.mobile-page #mobileRotateMenu ul:before {
    position: absolute;
    content: "";
    border: 5px solid var(--g-main-color-a-normal);
    border-radius: 200px
}

body.mobile-page #mobileRotateMenu ul:before {
    top: 100px;
    left: 100px;
    width: calc(100% - 200px);
    height: calc(100% - 200px)
}

body.mobile-page #mobileRotateMenu.opened {
    bottom: -180px;
    left: auto
}

body.mobile-page #toggleMobileRotateMenu.opened {
    opacity: 1 !important;
    pointer-events: auto !important
}

body.mobile-page #toggleMobileRotateMenu.opened p {
    opacity: 0
}

body.mobile-page .tickets {
    color: #333
}

body.mobile-page .tickets h5 button {
    color: #333;
    transform: translateX(15px)
}

body.mobile-page .ticket-list {
    background-color: transparent
}

body.mobile-page .ticket-list label {
    border-color: #999;
    color: #333
}

body.mobile-page .ticket-list label span {
    background-color: #ddd;
    color: #333
}

body.mobile-page #memberAreaLottery {
    color: #333
}

body.mobile-page #memberAreaLottery form {
    background-color: transparent
}

body.mobile-page #memberAreaBonuses .pokerBonusProgressFooter small, body.mobile-page .pokerBonusProgressHeader p {
    color: #333
}

body.mobile-page #noty_layout__topRight {
    z-index: 999999999999999
}

body.mobile-page #announcementPopup {
    z-index: 99999999999
}

body.mobile-page #announcementPopup .modal-dialog {
    top: 0
}

body.mobile-page #mainMenuCards {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding: 3px
}

body.mobile-page #mainMenuCards a {
    width: calc(50% - 6px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    align-items: center;
    margin: 3px;
    background-color: rgba(0, 0, 0, .3);
    color: var(--g-main-color-b-normal);
    border-radius: 3px;
    padding: 10px 0
}

body.mobile-page #mainMenuCards a span {
    display: none
}

body.mobile-page #mainMenuCards a i {
    font-size: 35px !important
}

body.mobile-page #mobileMenuLiveEvents a {
    display: flex;
    align-items: center;
    align-content: center;
    width: 100%
}

body.mobile-page #mobileMenuLiveEvents a span {
    margin-left: auto !important;
    background-color: var(--g-secondary-color-normal);
    color: #fff;
    font-size: 12px;
    border-radius: 5px;
    padding: 5px
}

body.mobile-page #mobileMenuLiveEvents a i {
    margin-right: 10px;
    font-family: sportfont;
    font-size: 35px !important;
    width: auto
}

body.mobile-page #mobileMenuLiveEvents a .sport-icon {
    margin-right: 10px
}

body.mobile-page.open {
    height: 100%;
    overflow: hidden !important;
    width: 100%;
    position: fixed
}

body.mobile-page header {
    box-shadow: 0 0 1px 1px #222;
    border: none;
    justify-content: space-between;
    padding: var(--g-space-xs);
    z-index: 99999999
}

body.mobile-page header a.mobile-header-logo {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

body.mobile-page header .header-area {
    background-position: 0 0;
    background-size: 1000px 1000px;
    display: block;
    width: 40px;
    height: 40px;
    margin: 0 auto
}

body.mobile-page header .header-area.header-menu-icon {
    background-position: 0 11.11111111111111%;
    background-size: 400px 400px
}

body.mobile-page header .header-area.header-bet-icon {
    background-size: 400px 400px;
    background-position: 0 22.22222222222222%
}

body.mobile-page header .header-area.header-register-icon {
    background-size: 400px 400px;
    background-position: 0 33.33333333333333%
}

body.mobile-page header .header-area.header-login-icon {
    background-size: 400px 400px;
    background-position: 0 44.44444444444444%
}

body.mobile-page header .header-area.header-mybet-icon {
    background-size: 400px 400px;
    background-position: 0 55.55555555555555%
}

body.mobile-page header .header-area.header-user-icon {
    background-size: 400px 400px;
    background-position: 0 66.66666666666666%
}

body.mobile-page header .header-area.bet-history-icon {
    background-size: 400px 400px;
    background-position: 44.44444444444444% 11.11111111111111%
}

body.mobile-page header .header-area.bohus-history-icon {
    background-size: 400px 400px;
    background-position: 44.44444444444444% 33.33333333333333%
}

body.mobile-page header .header-area.transaction-history-icon {
    background-size: 400px 400px;
    background-position: 44.44444444444444% 22.22222222222222%
}

body.mobile-page header .header-area.free-bet-icon {
    background-size: 400px 400px;
    background-position: 44.44444444444444% 44.44444444444444%
}

body.mobile-page header .header-area.protection-icon {
    background-size: 400px 400px;
    background-position: 55.55555555555555% 22.22222222222222%
}

body.mobile-page header .header-area.withdraw-icon {
    background-size: 400px 400px;
    background-position: 77.77777777777777% 44.44444444444444%
}

body.mobile-page header .header-area.logout-icon {
    background-size: 400px 400px;
    background-position: 22.22222222222222% 33.33333333333333%
}

body.mobile-page header .header-area.header-poker-icon {
    background-position: 11.11111111111111% 22.22222222222222%;
    background-size: 400px 400px
}

body.mobile-page header #headerForSportPage {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 20005
}

body.mobile-page header #headerForSportPage .sportPageContainer {
    display: flex;
    width: calc((100% - 20px) / 3);
    justify-content: space-between;
    text-align: center
}

body.mobile-page header #headerForSportPage .sportPageContainer a {
    display: flex;
    flex-direction: column;
    padding: var(--g-space-xs);
    font-size: 12px;
    align-items: center;
    justify-content: center
}

body.mobile-page header #headerForSportPage .sportPageContainer a p, body.mobile-page header #headerForSportPage .sportPageContainer a span {
    margin: 0;
    white-space: nowrap
}

body.mobile-page header #headerForSportPage a.active_tab {
    filter: brightness(35%) sepia(130%) hue-rotate(-59.75deg) saturate(482%)
}

body.mobile-page header #headerForSportPage a.mobile-header-logo {
    position: static;
    width: calc((100% - 20px) / 3);
    text-align: center;
    transform: translate(0)
}

body.mobile-page header #headerForSportPage #toggleMobileMainMenu {
    border: none
}

body.mobile-page header #headerForSportPage #toggleMobileMainMenu.active_tab {
    filter: brightness(35%) sepia(130%) hue-rotate(-59.75deg) saturate(482%);
    background-color: transparent
}

body.mobile-page header #headerForSportPage #memberActions a {
    font-weight: 400
}

body.mobile-page header #headerForSportPage #memberActions #beforeLoginMenuDesktop, body.mobile-page header #headerForSportPage #memberActions #bottomBarBalance {
    width: 100%;
    justify-content: space-between
}

body.mobile-page header #headerForSportPage #memberActions #openLoginModal {
    border: none
}

body.mobile-page header #headerForSportPage #memberActions #goToRegisterPage, body.mobile-page header #headerForSportPage #memberActions #openRegisterModal, body.mobile-page header #headerForSportPage #memberActions #toggleBalanceMenu {
    background: transparent
}

body.mobile-page header #toggleMobileMainMenu {
    border: 2px solid var(--g-main-color-a-light);
    border-radius: var(--g-radius-sm);
    padding: var(--g-space-xs) var(--g-space-md);
    font-size: 14px
}

body.mobile-page header #toggleMobileMainMenu.opened i:before {
    content: "\f00d" !important
}

body.mobile-page header #memberActions a {
    color: var(--g-main-color-b-normal) !important
}

body.mobile-page header #memberActions #openLoginModal {
    border: 2px solid var(--g-main-color-a-light);
    border-radius: var(--g-radius-sm);
    background-color: transparent;
    font-weight: 400
}

body.mobile-page header #memberActions #beforeLoginMenuDesktop {
    width: 100%;
    justify-content: space-between
}

body.mobile-page header #memberActions #goToRegisterPage, body.mobile-page header #memberActions #openRegisterModal {
    background: var(--g-primary-color-normal);
    color: #fff !important;
    background-color: transparent;
    font-weight: 400;
    display: flex;
    align-items: center
}

body.mobile-page header #memberActions #toggleUserMenuCasino {
    font-size: 10px;
    padding: 0
}

body.mobile-page header #memberActions #toggleUserMenuCasino .gradientBox {
    background-color: transparent !important;
    background: var(--g-primary-color-normal);
    padding: 6px 2px;
    margin: 0 !important;
    border-radius: var(--g-radius-sm)
}

body.mobile-page header #memberActions #toggleUserMenuCasino .gradientBox .current_balance {
    font-weight: 400;
    margin: 0 !important;
    background-color: var(--g-main-color-a-normal);
    border-radius: var(--g-radius-sm);
    padding: 4px 8px
}

body.mobile-page header #memberActions #toggleUserMenuCasino .gradientBox .current_balance i {
    padding-left: 5px
}

body.mobile-page #supportOptions {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    align-content: center
}

body.mobile-page #supportOptions a {
    text-align: left;
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: flex-start;
    width: 80%;
    padding: 10px 20px
}

body.mobile-page #supportOptions a i {
    font-size: 40px !important;
    margin-right: 10px;
    margin-left: 10px
}

body.mobile-page #liveSupportPopup {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999999;
    display: none;
    width: 100%;
    height: 100%;
    overflow: hidden
}

body.mobile-page #liveSupportPopup #liveSupportPopupContent {
    position: fixed;
    top: 0;
    left: 0;
    background-color: #000;
    width: 100%;
    height: 100%;
    transition: all .5s;
    padding-top: 40px
}

body.mobile-page #liveSupportPopup #liveSupportPopupContent #liveSupportPopupHeader {
    color: #fff;
    font-family: Arial, Helvetica, sans-serif;
    background-color: #000;
    border-bottom: 3px solid #000;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%
}

body.mobile-page #liveSupportPopup #liveSupportPopupContent #liveSupportPopupHeader h1 {
    position: relative;
    padding: 10px 20px;
    background-color: #111;
    font-size: 14px;
    width: calc(100% - 50px);
    margin: 0;
    display: inline-block
}

body.mobile-page #liveSupportPopup #liveSupportPopupContent #liveSupportPopupHeader button {
    position: absolute;
    right: 0;
    border: none;
    font-size: 20px;
    width: 50px;
    line-height: 40px;
    text-align: center;
    color: #555;
    cursor: pointer;
    transition: all .5s
}

body.mobile-page #liveSupportPopup #liveSupportPopupContent #liveSupportPopupBody {
    height: 100%;
    overflow: auto
}

body.mobile-page #liveSupportPopup #liveSupportPopupContent #liveSupportPopupBody iframe {
    width: 100%;
    height: 100%
}

body.mobile-page .full-page-menu {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    align-content: center;
    justify-content: center
}

body.mobile-page .full-page-menu a {
    width: calc(33.333% - 10px);
    background-color: var(--g-primary-color-dark);
    color: var(--g-main-color-b-normal);
    border-radius: var(--g-radius-sm);
    padding: 20px 0;
    text-align: center;
    font-size: 12px;
    margin: 5px;
    display: flex;
    flex-direction: column
}

body.mobile-page .full-page-menu a .new-tag {
    background-color: hsla(0, 0%, 100%, .2) !important
}

body.mobile-page .full-page-menu a i {
    font-size: 25px
}

body.mobile-page #mobileExtras {
    text-align: center
}

body.mobile-page #bottomBar {
    height: 60px;
    border-top: none
}

body.mobile-page #bottomBar #mobileBottomMenu {
    width: 100%;
    display: flex;
    justify-content: space-between
}

body.mobile-page #bottomBar #mobileBottomMenu a {
    width: 20%;
    display: flex;
    flex-direction: column;
    align-content: center;
    align-items: center;
    justify-content: center;
    border-right: none
}

body.mobile-page #bottomBar #mobileBottomMenu a p {
    margin: 0;
    font-size: .8rem
}

body.mobile-page #bottomBar #mobileBottomMenu .icon-holder {
    width: 100%;
    max-width: 25px;
    height: 25px;
    margin: 0 auto;
    display: block;
    position: relative;
    text-align: center
}

body.mobile-page #bottomBar #mobileBottomMenu .sprite-global-layout {
    background-repeat: no-repeat;
    background-size: 807px 775px;
    display: inline-block;
    transform: scale(.2);
    transform-origin: left top
}

body.mobile-page #bottomBar #mobileBottomMenu .sprite-bonus {
    background-position: -403px 0;
    width: 129px;
    height: 123px
}

body.mobile-page #bottomBar #mobileBottomMenu .sprite-help {
    background-position: -403px -120px;
    width: 120px;
    height: 110px
}

body.mobile-page #bottomBar #mobileBottomMenu .sprite-spin {
    background-position: -403px -240px;
    width: 120px;
    height: 110px
}

body.mobile-page #bottomBar #mobileBottomMenu .sprite-btop {
    background-position: -130px -473px;
    width: 120px;
    height: 110px
}

body.mobile-page #bottomBar #mobileBottomMenu .sprite-menu {
    background-position: 0 -473px;
    width: 120px;
    height: 110px
}

body.mobile-page #bottomBar #mobileBottomMenu #scrollToTop {
    display: flex !important;
    position: static;
    border: none;
    border-radius: 0 !important;
    text-indent: 0;
    background-color: transparent !important;
    height: 100%;
    justify-content: center;
    align-items: center
}

body.mobile-page #bottomBar #mobileBottomMenu #scrollToTop span {
    position: static;
    margin: 0;
    border-bottom: 0
}

body.mobile-page #bottomBar #mobileBottomMenu #scrollToTop p {
    text-align: center
}

body.mobile-page #bottomBar #toggleMobileRotateMenu .sprite-text-open, body.mobile-page #bottomBar #toggleMobileRotateMenu i {
    display: none
}

body.mobile-page #bottomBar #toggleMobileRotateMenu.opened {
    background-color: var(--g-main-color-a-dark);
    transform: translateY(-1px)
}

body.mobile-page #bottomBar #toggleMobileRotateMenu.opened i {
    display: block
}

body.mobile-page #bottomBar #toggleMobileRotateMenu.opened .sprite-text-menu {
    display: none
}

body.mobile-page #bottomBar #toggleMobileRotateMenu.opened .sprite-text-open {
    display: block
}

body.mobile-page #bottomBar #toggleMobileRotateMenu.opened span {
    display: none
}

body.mobile-page #mobileMainMenu {
    position: fixed;
    top: 0;
    left: -2000px;
    width: 100%;
    z-index: 99;
    transition: all .2s;
    background-color: var(--g-main-color-a-dark);
    height: calc(100vh - 60px);
    overflow-x: auto;
    flex-direction: column
}

body.mobile-page #mobileMainMenu .menu-items {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center
}

body.mobile-page #mobileMainMenu .menu-items > a {
    background-color: transparent;
    border: .5px solid var(--g-main-color-a-normal);
    width: 50%;
    text-align: center;
    display: flex;
    justify-content: center;
    line-height: 35px;
    color: var(--g-main-color-b-normal)
}

body.mobile-page #mobileMainMenu .menu-items > a i {
    font-size: 20px
}

body.mobile-page #mobileMainMenu .menu-items > a .new-tag {
    font-size: 13px;
    top: 5px;
    right: 5px;
    height: 30px;
    width: 30px !important;
    line-height: 30px;
    text-align: center;
    border-radius: 50%;
    padding: 0;
    background-color: var(--g-main-color-a-dark)
}

body.mobile-page #mobileMainMenu:not(.mobileSportMenuBox).visible {
    position: relative;
    overflow-x: hidden;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 69px
}

body.mobile-page #mobileMainMenu.visible {
    left: 0;
    display: flex !important;
    z-index: 99999999
}

body.mobile-page #mobileMainMenu #mobileExtras {
    width: 100%
}

body.mobile-page #mobileMainMenu #mobileExtras .site-time, body.mobile-page #mobileMainMenu #mobileExtras a {
    border: none;
    background-color: transparent;
    color: var(--g-main-color-b-normal)
}

body.mobile-page #mobileMainMenu #modeSwitcher {
    width: 100%;
    display: flex;
    justify-content: space-around;
    padding: 0 var(--g-space-xl);
    margin-top: var(--g-space-xs);
    border-bottom: 1px solid var(--g-main-color-a-normal)
}

body.mobile-page #mobileMainMenu #modeSwitcher .switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 28px
}

body.mobile-page #mobileMainMenu #modeSwitcher .switch input {
    opacity: 0;
    width: 0;
    height: 0
}

body.mobile-page #mobileMainMenu #modeSwitcher .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--g-main-color-a-normal);
    border: 2px solid var(--g-main-color-a-light);
    transition: .4s
}

body.mobile-page #mobileMainMenu #modeSwitcher .slider:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 4px;
    bottom: 2px;
    background-color: #fff;
    transition: .4s
}

body.mobile-page #mobileMainMenu #modeSwitcher input:checked + .slider {
    background-color: var(--g-main-color-a-normal);
    border: 2px solid var(--g-main-color-a-light)
}

body.mobile-page #mobileMainMenu #modeSwitcher input:checked + .slider:before {
    transform: translateX(26px)
}

body.mobile-page #mobileMainMenu #modeSwitcher .slider.round {
    border-radius: var(--g-radius-sm)
}

body.mobile-page #mobileMainMenu #modeSwitcher .slider.round:before {
    border-radius: 50%
}

body.mobile-page #mobileMainMenu .dropdownDepositBox {
    background: var(--g-primary-color-normal);
    padding: 2px;
    width: 50%;
    margin: var(--g-space-xs);
    border-radius: var(--g-radius-sm);
    display: flex
}

body.mobile-page #mobileMainMenu .dropdownDepositBox a {
    width: 100%;
    background-color: var(--g-main-color-a-normal) !important;
    color: var(--g-main-color-b-normal) !important;
    margin: 0 !important;
    font-size: 14px;
    line-height: 20px;
    height: 100%
}

body.mobile-page #mobileMainMenu .commonBalance {
    width: 90%;
    display: flex;
    justify-content: space-between
}

body.mobile-page #mobileMainMenu .commonBalance .bonusBalance p, body.mobile-page #mobileMainMenu .commonBalance .currentBalance p {
    margin-bottom: 0
}

body.mobile-page #mobileMainMenu .commonBalance .bonusBalance span, body.mobile-page #mobileMainMenu .commonBalance .currentBalance span {
    color: var(--primary-text-color);
    font-size: 20px;
    line-height: 10px;
    font-weight: 600
}

body.mobile-page #mobileMainMenu .commonBalance .bonusBalance {
    text-align: right
}

body.mobile-page #mobileMainMenu .commonBalance .bonusBalance span {
    color: var(--main-orange)
}

body.mobile-page #mobileMainMenu .languageSwitcherBox {
    width: 100%;
    text-align: center
}

body.mobile-page #mobileMainMenu .languageSwitcherBox a {
    padding: var(--g-space-sm) 0;
    display: block;
    border-bottom: 1px solid var(--g-main-color-a-normal)
}

body.mobile-page #mobileMainMenu .languageSwitcherBox #languageSwitcher {
    width: 100%;
    display: none;
    transition: .4s
}

body.mobile-page #mobileMainMenu .languageSwitcherBox #languageSwitcher.opened {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: row
}

body.mobile-page #mobileMainMenu .languageSwitcherBox #languageSwitcher div {
    display: flex;
    justify-content: center;
    padding: var(--g-space-sm) 0;
    border: .5px solid var(--g-main-color-a-normal);
    width: 50%
}

body.mobile-page #mobileMainMenu .languageSwitcherBox #languageSwitcher label:after, body.mobile-page #mobileMainMenu .languageSwitcherBox #languageSwitcher label:before {
    display: none
}

body.mobile-page #mobileMainMenu #mobileMainMenuOverlay {
    background-color: rgba(0, 0, 0, .5) !important;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox {
    width: 100%;
    padding-top: 0;
    margin-top: 60px;
    align-items: baseline;
    padding-bottom: 0;
    height: calc(100% - 60px);
    z-index: 99999999;
    border-top: 1px solid var(--g-main-color-b-normal);
    background-color: transparent !important
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox #sportTopMenu {
    display: flex;
    justify-content: space-between;
    width: 300px;
    background-color: var(--g-main-color-a-normal);
    border-right: 1px solid var(--g-main-color-b-normal);
    height: 100px
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox #sportTopMenu.display-none {
    display: none
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox #sportTopMenu a {
    position: relative;
    display: inline-block;
    overflow: hidden;
    width: 25%;
    height: 100%;
    font-size: 6.5pt;
    font-weight: 700;
    text-decoration: none;
    text-align: center;
    transition: box-shadow .1s linear, opacity .1s linear, color .1s linear;
    padding-bottom: 3px;
    color: #fff;
    opacity: .667;
    padding-top: 12px
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox #sportTopMenu a.active_tab {
    box-shadow: 0 -3px var(--g-secondary-color-normal) inset;
    opacity: 1
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox #sportTopMenu .sport-icon-top {
    background-position: 0 0;
    background-size: 1000px 1000px;
    display: block;
    width: 43px;
    height: 43px;
    margin: 0 auto 8px;
    transform: scale(.8)
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox #sportTopMenu .sport-icon-top.all-sports {
    background-position: 55.55555555555556% 88.88888888888889%;
    background-size: 480px 480px
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox #sportTopMenu .sport-icon-top.livebetting {
    background-position: 66.66666666666666% 22.22222222222222%;
    background-size: 480px 480px
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox #sportTopMenu .sport-icon-top.promotions {
    background-position: 11.11111111111111% 55.55555555555556%;
    background-size: 480px 480px
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox #sportTopMenu .sport-icon-top.extras_options {
    background-position: 66.66666666666666% 11.11111111111111%;
    background-size: 480px 480px
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox #sportTopMenu .sport-icon-top.sport-poker {
    background-position: 11.11111111111111% 22.22222222222222%;
    background-size: 480px 480px
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox #sportTopMenu .sport-icon-top.aviator {
    background-position: 33.333333333333% 0;
    background-size: 480px 480px
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu {
    width: 300px;
    background-color: var(--g-main-color-a-dark);
    height: 100%;
    border-right: 1px solid var(--g-main-color-b-normal);
    overflow: scroll;
    display: none;
    transform: translateY(-1px)
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu.block-active {
    display: block
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu a {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: var(--g-space-sm);
    border-top: none;
    color: #fff;
    line-height: 14px;
    transition: 0s !important
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu a small {
    color: var(--g-secondary-color-normal)
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu a i {
    font-size: 40px !important;
    margin-right: 10px
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu a.activeSport {
    background: rgba(0, 0, 0, .25);
    box-shadow: 3px 0 0 var(--g-secondary-color-normal) inset !important;
    transition: 0s
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu a .sport-favorite {
    background-size: 560px 560px;
    opacity: .333;
    width: 56px;
    height: 56px;
    position: absolute;
    top: 0;
    right: 0;
    pointer-events: auto !important;
    background-position: 77.77777777777779% 0
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu a span {
    margin-left: var(--g-space-sm)
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu.settingSport, body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu.supportSport {
    padding: var(--g-space-sm)
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu.settingSport hr, body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu.supportSport hr {
    border-top-color: var(--g-main-color-b-light)
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu.settingSport h5, body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu.supportSport h5 {
    color: var(--g-main-color-b-light);
    position: relative;
    margin-bottom: 0
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu.settingSport h5 .close_tab, body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu.supportSport h5 .close_tab {
    color: var(--g-main-color-b-light);
    font-size: 23px;
    line-height: 25px;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    background: none !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox .sport-button {
    position: absolute;
    left: 305px;
    bottom: 2%;
    width: 48px;
    height: 48px;
    transition: opacity .1s linear;
    border: none;
    border-radius: 50%
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox .sport-button.icon-chat {
    background-position: 66.66666666666666% 0;
    background-size: 480px 480px;
    background-color: var(--g-primary-color-normal)
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox .sport-button.icon-setting {
    background-position: 66.66666666666666% 44.44444444444444%;
    background-size: 480px 480px;
    bottom: 11%;
    background-color: var(--g-main-color-b-dark)
}

body.mobile-page #mobileMainMenu.mobileSportMenuBox .sport-button.icon-setting span {
    display: none
}

body.mobile-page #rakeback-form-bottom-bar {
    padding: 0 !important;
    background-color: transparent
}

body.mobile-page #mobileTotalBalance {
    background-color: var(--g-main-color-a-dark);
    border-radius: var(--g-radius-sm);
    text-align: center;
    padding: var(--g-space-xs) 0;
    font-size: 14px
}

body.mobile-page .bottom-bar-sub-menu {
    display: none
}

body.mobile-page #activityModalContent {
    position: relative;
    padding-bottom: 100px
}

body.mobile-page #activityModalContent > strong {
    display: none
}

body.mobile-page #activityModalContent .payment-options {
    padding-top: 50px
}

body.mobile-page #activityModalContent .payment-options #sectionFilter {
    position: fixed !important;
    left: 0;
    top: 38px;
    width: 100%;
    z-index: 999999
}

body.mobile-page header {
    background-color: var(--g-main-color-a-dark);
    height: 60px;
    display: flex
}

body.mobile-page header a {
    color: var(--g-gradient-normal);
    font-size: 20px
}

body.mobile-page footer #footerPaymentMethodsSection {
    overflow-x: auto;
    white-space: nowrap
}

body.mobile-page #bottomBarBalanceList p span button, body.mobile-page #bottomBarRakeback p span button {
    padding: 5px 10px
}

body.mobile-page #activityModal .modal-header {
    padding: 5px 10px !important;
    height: 40px
}

body.mobile-page #activityModal .modal-header h3 {
    text-align: left
}

body.mobile-page #activityModal .modal-header .close {
    transform: translateY(-5px)
}

body.mobile-page #activityModal #activityModalContent #sectionFilter .sm-prev {
    left: -14px;
    padding-right: var(--g-space-md)
}

body.mobile-page #activityModal #activityModalContent #sectionFilter .sm-next {
    right: -14px;
    padding-left: var(--g-space-md)
}

body.mobile-page #activityModal hr {
    margin: 10px 0
}

body.mobile-page #memberMenuModal {
    z-index: 9999999;
    margin: 60px 0 0
}

body.mobile-page #memberMenuModal .modal-dialog {
    max-width: 100%;
    background-color: #f3f3f3
}

body.mobile-page #memberMenuModal .modal-dialog #memberArea {
    flex-direction: column
}

body.mobile-page #memberMenuModal .modal-dialog #memberArea #memberMenu {
    width: 100%;
    flex-direction: row;
    overflow-x: auto;
    padding: var(--g-space-xs);
    border-radius: 0
}

body.mobile-page #memberMenuModal .modal-dialog #memberArea #memberMenu > div {
    white-space: nowrap
}

body.mobile-page #memberMenuModal .modal-dialog #memberArea #memberMenu a {
    font-size: 12px;
    display: inline-block;
    text-align: center
}

body.mobile-page #memberMenuModal .modal-dialog #memberArea #memberAreaContent {
    width: 100%;
    padding-bottom: 100px
}

body.mobile-page #memberMenuModal #memberAreaContent {
    background-color: #f3f3f3;
    padding: 0;
    border-radius: 0
}

body.mobile-page #memberMenuModal #memberAreaContent table {
    background-color: #fff
}

body.mobile-page #memberMenuModal #memberAreaContent table tr td, body.mobile-page #memberMenuModal #memberAreaContent table tr th {
    border-color: #aaa;
    color: #333
}

body.mobile-page #memberMenuModal #memberAreaContent .dataTables_wrapper .dataTables_filter, body.mobile-page #memberMenuModal #memberAreaContent .dataTables_wrapper .dataTables_info, body.mobile-page #memberMenuModal #memberAreaContent .dataTables_wrapper .dataTables_length, body.mobile-page #memberMenuModal #memberAreaContent .dataTables_wrapper .dataTables_paginate, body.mobile-page #memberMenuModal #memberAreaContent .dataTables_wrapper select, body.mobile-page #memberMenuModal #memberAreaContent .form-group .form-control, body.mobile-page #memberMenuModal #memberAreaContent .form-group .select2-selection--single {
    border-radius: 5px;
    background-color: #fff;
    color: #333
}

body.mobile-page #memberMenuModal #memberAreaContent .dataTables_wrapper .dataTables_filter input {
    background-color: #eee;
    color: #333
}

body.mobile-page #memberMenuModal #memberAreaContent .dataTables_wrapper table .unread {
    background-color: rgba(0, 0, 0, .2) !important
}

body.mobile-page #memberMenuModal #memberAreaContent form {
    background-color: transparent
}

body.mobile-page #memberMenuModal #memberAreaContent form .form-group .col-4 {
    flex-direction: column
}

body.mobile-page #memberMenuModal #memberAreaContent h5 {
    background-color: transparent;
    border-radius: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    color: #333;
    border-bottom: 1px solid var(--g-main-color-b-dark);
    font-size: 18px;
    font-weight: 600
}

body.mobile-page #memberMenuModal #memberAreaContent h5 .fa {
    font-size: 30px !important;
    line-height: 10px !important;
    opacity: .75;
    padding: 10px 15px;
    transform: translateX(-10px)
}

body.mobile-page #memberMenuModal #memberAreaContent h5 .fa.fa-arrow-left {
    margin-top: 5px;
    transform: scale(.8)
}

body.mobile-page #memberMenuModal #memberAreaContent h5 .close {
    color: #ddd !important;
    box-shadow: none;
    line-height: 10px;
    opacity: .75;
    font-size: 30px !important;
    margin-top: -5px;
    height: 30px
}

body.mobile-page #memberMenuModal #memberAreaContent #AccountHistory .row {
    justify-content: space-between
}

body.mobile-page #memberMenuModal #memberAreaContent #AccountHistory .row .history-section {
    color: var(--g-main-color-a-dark);
    font-weight: 600;
    text-align: center
}

body.mobile-page #memberMenuModal #memberAreaContent #AccountHistory .row .history-section.active {
    color: #cd4436
}

body.mobile-page #memberMenuModal #memberAreaContent .change-pass, body.mobile-page #memberMenuModal #memberAreaContent .information {
    background-color: transparent;
    border-radius: 0;
    padding: var(--g-space-xs) 0
}

body.mobile-page #memberMenuModal #memberAreaContent .change-pass .form-group, body.mobile-page #memberMenuModal #memberAreaContent .information .form-group {
    margin: 0 !important;
    padding: 0 5px !important
}

body.mobile-page #memberMenuModal #memberAreaContent .change-pass .form-group label, body.mobile-page #memberMenuModal #memberAreaContent .information .form-group label {
    color: var(--g-main-color-a-dark);
    margin-right: 5px
}

body.mobile-page #memberMenuModal #memberAreaContent .change-pass .form-group .form-control, body.mobile-page #memberMenuModal #memberAreaContent .information .form-group .form-control {
    border-radius: 0;
    background-color: transparent;
    border: none;
    color: #666;
    opacity: 1;
    font-size: 14px;
    padding: 0 5px 0 0
}

body.mobile-page #memberMenuModal #memberAreaContent .change-pass .form-group.pass, body.mobile-page #memberMenuModal #memberAreaContent .change-pass .form-group div, body.mobile-page #memberMenuModal #memberAreaContent .information .form-group.pass, body.mobile-page #memberMenuModal #memberAreaContent .information .form-group div {
    display: flex
}

body.mobile-page #memberMenuModal #memberAreaContent .change-pass .form-group.pass div, body.mobile-page #memberMenuModal #memberAreaContent .information .form-group.pass div {
    flex-direction: column;
    justify-content: center
}

body.mobile-page #memberMenuModal #memberAreaContent .change-pass .form-group.pass #submit, body.mobile-page #memberMenuModal #memberAreaContent .information .form-group.pass #submit {
    width: 50%;
    margin-right: 0 !important
}

body.mobile-page #memberMenuModal #memberAreaContent .change-pass > div:not(:last-child), body.mobile-page #memberMenuModal #memberAreaContent .information > div:not(:last-child) {
    border-bottom: 1px solid var(--g-main-color-b-normal)
}

body.mobile-page #memberMenuModal #memberAreaContent .change-pass #submit, body.mobile-page #memberMenuModal #memberAreaContent .information #submit {
    margin: var(--g-space-sm) auto !important;
    background-color: var(--g-main-color-b-light) !important;
    border: 2px solid #9fa5a6 !important;
    color: #9fa5a6 !important;
    width: 90%
}

body.mobile-page #memberMenuModal #memberAreaContent .balance-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    padding: 0 var(--g-space-xs)
}

body.mobile-page #memberMenuModal #memberAreaContent .balance-info .currentBalance span {
    color: #cd4436;
    font-size: 20px;
    font-weight: 600
}

body.mobile-page #memberMenuModal #memberAreaContent .balance-info .currentBalance p {
    color: var(--g-main-color-a-dark);
    margin-bottom: 0 !important
}

body.mobile-page #memberMenuModal #memberAreaContent .balance-info .dropdownDepositBox .btn {
    background-color: #000 !important;
    border: 2px solid #cd4436 !important;
    color: #fff !important
}

body.mobile-page #memberMenuModal #memberAreaContent hr {
    margin: 2px 0 !important
}

body.mobile-page #memberMenuModal #memberAreaContent .info-container {
    display: flex;
    justify-content: space-between
}

body.mobile-page #memberMenuModal #memberAreaContent .info-container > div {
    display: flex;
    flex-direction: column;
    width: 100%
}

body.mobile-page #memberMenuModal #memberAreaContent .info-container > div:last-child {
    justify-content: flex-end;
    text-align: right
}

body.mobile-page #memberMenuModal #memberAreaContent .option-group .custom-radio {
    background-color: transparent;
    border-color: var(--g-main-color-b-normal);
    color: #333
}

body.mobile-page #memberMenuModal #memberAreaContent .option-group .custom-control-label:before {
    background-color: var(--g-main-color-a-light)
}

body.mobile-page #memberMenuModal #memberAreaContent .option-group .custom-control-label:after {
    opacity: 1
}

body.mobile-page #memberMenuModal #memberTopMenu {
    display: flex;
    justify-content: space-between;
    width: 100%
}

body.mobile-page #memberMenuModal #memberTopMenu a {
    padding: 5px 5px 2px;
    background-color: #2b303a;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px
}

body.mobile-page #memberMenuModal #memberSubMenu {
    width: 100%
}

body.mobile-page #memberMenuModal #memberSubMenu .member-info {
    justify-content: center;
    width: 100%;
    display: none
}

body.mobile-page #memberMenuModal #memberSubMenu .member-info.block-active {
    display: block;
    white-space: nowrap
}

body.mobile-page #memberMenuModal #memberSubMenu .member-info a {
    padding: var(--g-space-xs) var(--g-space-sm) !important;
    margin: 0 var(--g-space-sm)
}

body.mobile-page #memberMenuModal #memberSubMenu .member-info a.active {
    background-color: var(--g-main-color-a-light)
}

body.mobile-page #memberMenuModal #memberSubMenu .member-info.user-bonus a {
    margin: 0 var(--g-space-xs);
    padding: var(--g-space-xs)
}

body.mobile-page #memberMenuModal #memberAreaGoogleAuthOtp .btn-secondary {
    font-size: 12px
}

body.mobile-page #memberMenuModal #memberAreaSecurity h5 {
    margin-bottom: 0
}

body.mobile-page #memberMenuModal #memberAreaSecurity form {
    background-color: transparent;
    border-radius: 0;
    padding: var(--g-space-xs) 0
}

body.mobile-page #memberMenuModal #memberAreaSecurity form .security-row {
    margin: 0 !important;
    padding: 5px !important;
    border-bottom: none;
    border-top-color: var(--g-main-color-b-dark)
}

body.mobile-page #memberMenuModal #memberAreaSecurity form .security-row label {
    color: var(--g-main-color-a-dark);
    margin-right: 5px
}

body.mobile-page #memberMenuModal #memberAreaSecurity form .security-row:last-child {
    border-bottom: 1px solid var(--g-main-color-b-dark)
}

body.mobile-page #memberMenuModal #memberAreaSecurity form .security-row .btn-secondary {
    background-color: var(--g-main-color-b-light) !important;
    border: 2px solid #9fa5a6 !important;
    color: #9fa5a6 !important
}

body.mobile-page #memberMenuModal #memberAreaSecurity .alert {
    border: none;
    background-color: #eaeaea;
    color: var(--g-main-color-a-dark);
    margin-top: 0;
    padding: 5px !important
}

body.mobile-page #memberMenuModal #memberAreaSecurity .alert .btn-secondary {
    background-color: #000 !important;
    border: 2px solid #cd4436 !important;
    color: #fff !important;
    font-size: .8rem !important
}

body.mobile-page #memberMenuModal #memberAreaSecurity .alert strong {
    font-weight: 500 !important
}

body.mobile-page #memberMenuModal #memberAreaBonuses .info-box {
    color: var(--g-main-color-a-dark);
    padding: 0 var(--g-space-sm)
}

body.mobile-page #memberMenuModal #memberAreaBonuses label {
    color: var(--g-main-color-a-dark)
}

body.mobile-page #memberMenuModal #memberAreaBonuses form {
    background-color: transparent;
    border-radius: 0
}

body.mobile-page #memberMenuModal #memberAreaBonuses #submit, body.mobile-page #memberMenuModal #memberAreaBonuses form .btn-secondary {
    background-color: var(--g-main-color-b-light) !important;
    border: 2px solid #9fa5a6 !important;
    color: #9fa5a6 !important
}

body.mobile-page #memberMenuModal #memberAreaBonuses #use-promotion-code-form {
    border-top: none
}

body.mobile-page #memberMenuModal #memberAreaBonuses #use-promotion-code-form .form-control {
    border-radius: 0;
    background-color: transparent;
    border: none;
    color: #9fa5a6;
    opacity: 1;
    font-size: 14px;
    padding: 10px 5px 0 0;
    border-bottom: 1px solid #9fa5a6 !important
}

body.mobile-page #memberMenuModal #memberAreaBonuses #member-discount-button-form {
    border-top: none
}

body.mobile-page #memberMenuModal #memberAreaBonuses h3 {
    color: #cd4436;
    font-size: 16px;
    margin: 10px auto 5px;
    text-align: center;
    font-weight: 600
}

body.mobile-page #memberMenuModal #memberAreaBonuses .bonuus-lottery, body.mobile-page #memberMenuModal #memberAreaBonuses .discount-bonus {
    margin: var(--g-space-lg) 0
}

body.mobile-page #memberMenuModal #memberAreaBonuses #amountForLottery {
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--g-main-color-b-dark);
    border-radius: 0;
    color: var(--g-main-color-b-dark)
}

body.mobile-page #memberMenuModal #memberAreaBonuses #bonuses_wrapper .dataTables_length {
    border-radius: 0;
    background-color: var(--g-main-color-b-normal);
    padding: var(--g-space-sm);
    border-top: 1px solid var(--g-main-color-b-dark);
    border-bottom: 1px solid var(--g-main-color-b-dark)
}

body.mobile-page #memberMenuModal #memberAreaBonuses #bonuses_wrapper .dataTable {
    background-color: #eaeaea;
    border-radius: 0;
    border: none
}

body.mobile-page #memberMenuModal #memberAreaBonuses #bonuses_wrapper .dataTable thead {
    padding: var(--g-space-sm) 0
}

body.mobile-page #memberMenuModal #memberAreaBonuses #bonuses_wrapper .dataTable thead tr {
    border: none
}

body.mobile-page #memberMenuModal #memberAreaBonuses #bonuses_wrapper .dataTable thead tr th {
    color: var(--g-main-color-a-dark);
    font-weight: 600;
    font-size: 14px;
    border: none;
    text-align: center;
    border-top: 2px solid var(--g-main-color-b-normal)
}

body.mobile-page #memberMenuModal #memberAreaBonuses #bonuses_wrapper .dataTable thead tr th:nth-child(2) {
    border-right: 2px solid var(--g-main-color-b-normal);
    border-left: 2px solid var(--g-main-color-b-normal)
}

body.mobile-page #memberMenuModal #memberAreaBonuses #bonuses_wrapper .dataTable tbody tr td {
    color: var(--g-main-color-a-dark);
    font-weight: 500;
    font-size: 14px;
    border: none;
    text-align: center;
    border-top: 2px solid var(--g-main-color-b-normal);
    border-bottom: 2px solid var(--g-main-color-b-normal);
    background-color: #eaeaea;
    padding: var(--g-space-sm)
}

body.mobile-page #memberMenuModal #memberAreaBonuses #bonuses_wrapper .dataTables_info, body.mobile-page #memberMenuModal #memberAreaBonuses #bonuses_wrapper .dataTables_paginate {
    background-color: #e5e5e5;
    border-radius: 0;
    border: none;
    color: var(--g-main-color-a-dark);
    font-size: 14px;
    padding: var(--g-space-sm)
}

body.mobile-page #memberMenuModal #memberAreaBonuses #bonuses_wrapper .dataTables_paginate {
    margin-top: 0
}

body.mobile-page #memberMenuModal #memberAreaBonuses #bonuses_wrapper .dataTables_paginate a {
    background-color: var(--g-main-color-b-normal) !important;
    padding: 7px var(--g-space-md);
    color: var(--g-main-color-a-dark) !important
}

body.mobile-page #memberMenuModal #memberAreaBonuses .text-center {
    color: var(--g-main-color-a-dark);
    font-size: 14px;
    text-transform: uppercase;
    opacity: .75
}

body.mobile-page #memberMenuModal #memberAreaBonuses .pokerBonusProgressBar {
    background-color: #ddd;
    border-color: #aaa
}

body.mobile-page #memberMenuModal #memberAreaBankAccounts, body.mobile-page #memberMenuModal #memberAreaTrasactions {
    margin-bottom: 30px
}

body.mobile-page #memberMenuModal #memberAreaBankAccounts h5, body.mobile-page #memberMenuModal #memberAreaTrasactions h5 {
    margin-bottom: 0
}

body.mobile-page #memberMenuModal #memberAreaBankAccounts .table-responsive .table, body.mobile-page #memberMenuModal #memberAreaTrasactions .table-responsive .table {
    background-color: #e5e5e5;
    border-radius: 0;
    border: none
}

body.mobile-page #memberMenuModal #memberAreaBankAccounts .table-responsive .table tr td, body.mobile-page #memberMenuModal #memberAreaBankAccounts .table-responsive .table tr th, body.mobile-page #memberMenuModal #memberAreaTrasactions .table-responsive .table tr td, body.mobile-page #memberMenuModal #memberAreaTrasactions .table-responsive .table tr th {
    color: var(--g-main-color-a-dark);
    font-size: 14px;
    padding: var(--g-space-sm);
    border: none;
    text-align: center
}

body.mobile-page #memberMenuModal #memberAreaBankAccounts .table-responsive .table tr:nth-of-type(odd), body.mobile-page #memberMenuModal #memberAreaTrasactions .table-responsive .table tr:nth-of-type(odd) {
    background-color: transparent;
    border-bottom: 2px solid var(--g-main-color-b-normal)
}

body.mobile-page #memberMenuModal #memberAreaBankAccounts form, body.mobile-page #memberMenuModal #memberAreaTrasactions form {
    background-color: transparent;
    border-radius: 0;
    padding: var(--g-space-xs) 0
}

body.mobile-page #memberMenuModal #memberAreaBankAccounts form .form-group, body.mobile-page #memberMenuModal #memberAreaTrasactions form .form-group {
    margin: 0 !important;
    padding: 0 5px !important
}

body.mobile-page #memberMenuModal #memberAreaBankAccounts form .form-group label, body.mobile-page #memberMenuModal #memberAreaTrasactions form .form-group label {
    color: var(--g-main-color-a-dark);
    margin-right: 5px
}

body.mobile-page #memberMenuModal #memberAreaBankAccounts form .form-group .form-control, body.mobile-page #memberMenuModal #memberAreaTrasactions form .form-group .form-control {
    border-radius: 0;
    background-color: transparent;
    border: none;
    color: #9fa5a6;
    opacity: 1;
    font-size: 14px;
    border-bottom: 2px solid var(--g-main-color-b-normal)
}

body.mobile-page #memberMenuModal #memberAreaBankAccounts form .select2-selection--single, body.mobile-page #memberMenuModal #memberAreaTrasactions form .select2-selection--single {
    background-color: transparent;
    border-color: var(--g-main-color-b-normal)
}

body.mobile-page #memberMenuModal #memberAreaBankAccounts #submit, body.mobile-page #memberMenuModal #memberAreaTrasactions #submit {
    background-color: #fff !important;
    border: 2px solid #9fa5a6 !important;
    color: #9fa5a6 !important
}

body.mobile-page #memberMenuModal #memberAreaBankAccounts .dataTables_filter, body.mobile-page #memberMenuModal #memberAreaBankAccounts .dataTables_info, body.mobile-page #memberMenuModal #memberAreaBankAccounts .dataTables_length, body.mobile-page #memberMenuModal #memberAreaBankAccounts .dataTables_paginate, body.mobile-page #memberMenuModal #memberAreaTrasactions .dataTables_filter, body.mobile-page #memberMenuModal #memberAreaTrasactions .dataTables_info, body.mobile-page #memberMenuModal #memberAreaTrasactions .dataTables_length, body.mobile-page #memberMenuModal #memberAreaTrasactions .dataTables_paginate {
    background-color: #fff;
    border-radius: 0;
    border: none;
    color: #444;
    font-size: 14px;
    padding: var(--g-space-sm);
    border-bottom: 2px solid var(--g-main-color-b-normal)
}

body.mobile-page #memberMenuModal #memberAreaBankAccounts .dataTables_filter input, body.mobile-page #memberMenuModal #memberAreaTrasactions .dataTables_filter input {
    background-color: var(--g-main-color-b-normal) !important;
    padding: 7px var(--g-space-md);
    color: var(--g-main-color-a-dark) !important
}

body.mobile-page #memberMenuModal #memberAreaBankAccounts .dataTables_paginate, body.mobile-page #memberMenuModal #memberAreaTrasactions .dataTables_paginate {
    margin-top: 0
}

body.mobile-page #memberMenuModal #memberAreaBankAccounts .dataTables_paginate a, body.mobile-page #memberMenuModal #memberAreaTrasactions .dataTables_paginate a {
    background-color: var(--g-main-color-b-normal) !important;
    padding: 7px var(--g-space-md);
    color: var(--g-main-color-a-dark) !important
}

body.mobile-page #memberMenuModal .section-header {
    font-size: 16px;
    font-weight: 600;
    padding: var(--g-space-sm) var(--g-space-md);
    margin-bottom: 0;
    color: var(--g-main-color-a-dark);
    opacity: .75
}

body.mobile-page #memberMenuModal .payment-area {
    display: none
}

body.mobile-page #memberMenuModal .payment-area p {
    font-size: 12px;
    text-align: center
}

body.mobile-page #memberMenuModal .payment-area .modal-footer {
    padding: 0
}

body.mobile-page #memberMenuModal .payment-method {
    margin: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-size: 12px;
    padding: var(--g-space-sm);
    align-items: center;
    align-content: center;
    cursor: pointer;
    border-bottom: 2px solid var(--g-main-color-a-normal);
    color: var(--g-main-color-b-light);
    background-color: var(--g-main-color-a-dark)
}

body.mobile-page #memberMenuModal .payment-method i {
    margin-bottom: 10px
}

body.mobile-page #memberMenuModal .payment-method p {
    margin: 0
}

body.mobile-page #memberMenuModal #sectionFilter {
    position: relative;
    background-color: var(--g-main-color-a-dark)
}

body.mobile-page #memberMenuModal #sectionFilter a {
    max-width: 120px;
    backgrounds-color: var(--g-main-color-a-dark);
    font-size: 12px;
    padding: var(--g-space-sm) var(--g-space-md);
    white-space: nowrap;
    border-right: 1px solid var(--g-main-color-a-normal);
    text-align: center;
    cursor: pointer
}

body.mobile-page #memberMenuModal #sectionFilter a.mixitup-control-active {
    background-color: var(--g-primary-color-normal)
}

body.mobile-page #memberMenuModal #sectionFilter .sm-next, body.mobile-page #memberMenuModal #sectionFilter .sm-prev {
    position: absolute;
    z-index: 1;
    top: 0;
    height: 100%;
    background-color: var(--g-main-color-a-light) !important;
    background-repeat: no-repeat;
    background-size: 50%;
    background-position: 50%;
    padding: 5px 25px
}

body.mobile-page #memberMenuModal #sectionFilter .swiper-button-disabled {
    background-size: 0;
    background-color: var(--g-main-color-a-dark) !important;
    border-radius: 0
}

body.mobile-page #memberMenuModal #sectionFilter .sm-prev {
    left: -37px;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTS0xLTFoNTgydjQwMkgtMXoiLz48Zz48cGF0aCBmaWxsPSJub25lIiBkPSJNMCAwaDUwdjUwSDB6Ii8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTM1IDQ3LjI1bDIuMDg2LTIuMDg2TDE2LjkyMiAyNSAzNy4wODYgNC44MzYgMzUgMi43NSAxMi43NSAyNXoiLz48L2c+PC9zdmc+)
}

body.mobile-page #memberMenuModal #sectionFilter .sm-next {
    right: -37px;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTS0xLTFoNTgydjQwMkgtMXoiLz48Zz48cGF0aCBmaWxsPSJub25lIiBkPSJNMCAwaDUwdjUwSDB6Ii8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE1IDIuNzVsLTIuMDg2IDIuMDg2TDMzLjA3OCAyNSAxMi45MTQgNDUuMTY0IDE1IDQ3LjI1IDM3LjI1IDI1eiIvPjwvZz48L3N2Zz4=)
}

body.mobile-page #memberMenuModal #sectionFilter .swiper-wrapper {
    height: auto
}

body.mobile-page #memberMenuModal #paymentModal h5 .go-back-to-payment-options {
    color: var(--g-main-color-a-light);
    opacity: .75;
    display: flex;
    align-items: center;
    align-content: center
}

body.mobile-page #memberMenuModal #paymentModal h5 .go-back-to-payment-options i {
    margin-right: var(--g-space-sm)
}

body.mobile-page #memberMenuModal .integration-body .table {
    background-color: #e5e5e5;
    border-radius: 0;
    border: none
}

body.mobile-page #memberMenuModal .integration-body .table tr td, body.mobile-page #memberMenuModal .integration-body .table tr th {
    color: var(--g-main-color-a-dark);
    font-size: 14px;
    padding: var(--g-space-sm);
    border: none;
    text-align: center
}

body.mobile-page #memberMenuModal .integration-body .table tr:nth-of-type(odd) {
    background-color: transparent
}

body.mobile-page #memberMenuModal .integration-body .table tr:nth-child(2) {
    border-bottom: 2px solid var(--g-main-color-b-normal);
    border-top: 2px solid var(--g-main-color-b-normal)
}

body.mobile-page #memberMenuModal .integration-body form {
    background-color: transparent
}

body.mobile-page #memberMenuModal .integration-body form .form-group {
    margin: 0 !important;
    padding: 0 5px !important
}

body.mobile-page #memberMenuModal .integration-body form .form-group label {
    color: var(--g-main-color-a-dark);
    margin-right: 5px
}

body.mobile-page #memberMenuModal .integration-body form .form-group .form-control {
    border-radius: 0;
    background-color: transparent;
    border: none;
    color: #9fa5a6;
    opacity: 1;
    font-size: 14px;
    border-bottom: 2px solid var(--g-main-color-b-normal)
}

body.mobile-page #memberMenuModal .modal-footer .btn {
    background-color: var(--g-main-color-b-light) !important;
    border: 2px solid #9fa5a6 !important;
    color: #9fa5a6 !important;
    width: 90%;
    margin: 0 auto
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #addCardButton {
    display: flex;
    padding: 0 var(--g-space-md) var(--g-space-xs);
    border-bottom: 1px solid #cd4436
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #addCardButton h3 {
    color: var(--g-primary-color-normal);
    border: 2px solid var(--g-primary-color-normal);
    padding: var(--g-space-xs) var(--g-space-sm);
    border-radius: var(--g-radius-sm);
    font-size: 14px;
    margin-left: var(--g-space-sm)
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #addCardButton h3 i {
    color: var(--g-primary-color-normal);
    font-size: 12px !important
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #addCardButton h3.active {
    background-color: var(--g-primary-color-normal);
    color: var(--g-main-color-b-light)
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #addCardButton h3.active i {
    color: var(--g-main-color-b-light)
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #addCardButton i {
    color: var(--g-main-color-a-normal);
    font-size: 25px !important
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #addCard {
    display: none
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #addCard.active {
    display: block
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #addCard .alert.alert-info {
    border: none;
    background-color: #eaeaea;
    color: var(--g-main-color-a-dark);
    margin-top: 0;
    padding: 5px !important
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #addCard form {
    background-color: transparent;
    border-radius: 0;
    padding: var(--g-space-xs) 0
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #addCard form .form-group {
    margin: 0 !important;
    padding: 0 5px !important
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #addCard form .form-group label {
    color: var(--g-main-color-a-dark);
    margin-right: 5px
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #addCard form .form-group .form-control {
    border-radius: 0;
    background-color: transparent;
    border: none;
    color: #9fa5a6;
    opacity: 1;
    font-size: 14px;
    border-bottom: 2px solid var(--g-main-color-b-normal)
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #addCard form .select2-selection--single {
    background-color: transparent;
    border-color: var(--g-main-color-b-normal)
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #addCard form #submit {
    background-color: var(--g-main-color-b-light) !important;
    border: 2px solid #9fa5a6 !important;
    color: #9fa5a6 !important;
    margin-bottom: 40px
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #paymentMethod {
    padding-bottom: 50px
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #paymentMethod h3 {
    display: flex;
    align-items: center;
    align-content: center;
    font-size: 16px;
    color: var(--g-main-color-a-normal);
    padding: var(--g-space-sm) var(--g-space-md)
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #paymentMethod h3 p {
    display: flex;
    flex-direction: column;
    margin: 0
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #paymentMethod h3 p span:first-child {
    font-weight: 600
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #paymentMethod h3 p span:last-child {
    font-size: 14px
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #paymentMethod h3 i {
    font-size: 25px !important;
    font-weight: 600;
    margin-right: var(--g-space-sm)
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #paymentMethod .table {
    background-color: #e5e5e5;
    border-radius: 0;
    border: none
}

body.mobile-page #memberMenuModal #memberAreaCreditCard #paymentMethod .table tr td, body.mobile-page #memberMenuModal #memberAreaCreditCard #paymentMethod .table tr th {
    color: var(--g-main-color-a-dark);
    font-size: 14px;
    padding: var(--g-space-xs);
    border: none;
    text-align: center;
    border-bottom: 2px solid var(--g-main-color-b-normal)
}

body.mobile-page #memberMenuModal #memberAreaDetails .table {
    background-color: #e5e5e5;
    border-radius: 0;
    border: none
}

body.mobile-page #memberMenuModal #memberAreaDetails .table .btn-sm {
    padding: 0 5px
}

body.mobile-page #memberMenuModal #memberAreaDetails .table tr td, body.mobile-page #memberMenuModal #memberAreaDetails .table tr th {
    color: var(--g-main-color-a-dark);
    font-size: 12px;
    padding: var(--g-space-sm);
    border: none;
    text-align: center
}

body.mobile-page #memberMenuModal #memberAreaDetails .table tr:nth-of-type(odd) {
    background-color: transparent
}

body.mobile-page #memberMenuModal #memberAreaDetails .table tr:nth-child(2) {
    border-bottom: 2px solid var(--g-main-color-b-normal);
    border-top: 2px solid var(--g-main-color-b-normal)
}

body.mobile-page #memberMenuModal #depositOptions h5, body.mobile-page #memberMenuModal #drawOptions h5 {
    margin-bottom: 0;
    display: flex
}

body.mobile-page #toggleMobileMainMenu.visible {
    background-color: var(--g-main-color-a-dark);
    transform: translateY(-1px)
}

body.mobile-page .modal-dialog {
    -webkit-overflow-scrolling: touch;
    margin: 0;
    position: fixed;
    top: 60px
}

body.mobile-page .modal-content, body.mobile-page .modal-dialog {
    height: 100%;
    width: 100%;
    min-width: 100%;
    border-radius: 0 !important;
    left: 0
}

body.mobile-page .modal-content {
    padding: 0 !important;
    top: 0
}

body.mobile-page .modal-header {
    border-bottom: 1px solid var(--g-main-color-a-dark) !important;
    padding: var(--g-space-xs) !important;
    padding-bottom: 0 !important;
    border-radius: 0;
    background-color: var(--g-main-color-a-dark)
}

body.mobile-page .modal-header .close {
    padding: var(--g-space-md) var(--g-space-lg)
}

body.mobile-page .modal-body {
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    border-radius: 0 !important;
    padding: 0 !important
}

body.mobile-page #mainPage #mainPageBoxes .container {
    flex-direction: column
}

body.mobile-page #mainPage #mainPageBoxes .container .box:first-child, body.mobile-page #mainPage #mainPageBoxes .container .box:nth-child(2) {
    width: calc(100% - 20px)
}

body.mobile-page #mainPage #mainPageBoxes .container .box .box-header {
    padding: 5px 10px;
    font-size: 14px
}

body.mobile-page #mainPage #opportunitiesSlider .swiper-slide .slider-content a.btn {
    padding: 10px 25px
}

body.mobile-page #mainPage .event-list {
    font-size: 11px;
    height: 200px;
    overflow: hidden;
    border: 3px solid var(--g-main-color-a-dark)
}

body.mobile-page #mainPage .event-list .event {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    align-items: center;
    text-align: center;
    overflow: hidden;
    background-size: cover
}

body.mobile-page #mainPage .event-list .event .event-bradcrumb {
    margin-bottom: auto;
    font-size: 12px;
    line-height: 10px;
    padding: 15px 0;
    border-bottom: 1px solid var(--g-main-color-a-dark);
    background-color: rgba(0, 0, 0, .1);
    width: 100%
}

body.mobile-page #mainPage .event-list .event .event-bradcrumb a {
    color: var(--g-main-color-b-normal)
}

body.mobile-page #mainPage .event-list .event .event-bradcrumb strong {
    color: #00a879
}

body.mobile-page #mainPage .event-list .event .event-time {
    font-size: 12px;
    color: #00a879;
    text-align: center;
    width: 100%;
    margin: 5px 10px
}

body.mobile-page #mainPage .event-list .event .event-name {
    color: var(--g-main-color-b-normal);
    font-size: 14px;
    margin: 15px 0
}

body.mobile-page #mainPage .event-list .event .event-name span {
    color: #00a879
}

body.mobile-page #mainPage .event-list .event .event-odds {
    display: flex;
    margin-bottom: 20px
}

body.mobile-page #mainPage .event-list .event .event-odds .odd {
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
    flex-direction: column;
    margin: 10px 5px 0;
    padding: 8px 15px;
    border-radius: 3px;
    background-color: var(--g-main-color-a-light);
    color: var(--g-main-color-b-normal);
    text-align: center;
    font-size: 14px;
    min-width: 70px
}

body.mobile-page #mainPage .event-list .event .event-odds .odd.disabled {
    pointer-events: none;
    opacity: .6
}

body.mobile-page #mainPage .event-list .event .event-odds .odd .odd-name {
    font-weight: 700;
    opacity: .5;
    font-size: 12px;
    padding-bottom: 5px;
    margin-bottom: 5px;
    border-bottom: 1px solid hsla(0, 0%, 100%, .3);
    width: 100%
}

body.mobile-page #mainPage .event-list .event .event-odds .odd:active, body.mobile-page #mainPage .event-list .event .event-odds .odd:focus {
    background-color: #00a879
}

body.mobile-page #mainPage .event-list .sm-next, body.mobile-page #mainPage .event-list .sm-prev {
    background-color: #111;
    border-radius: 50%;
    margin: 5px;
    background-repeat: no-repeat;
    background-size: 50%;
    background-position: 50%;
    height: 40px;
    width: 40px;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    position: absolute;
    top: -500px;
    transform: translateY(-50%);
    z-index: 9
}

body.mobile-page #mainPage .event-list .swiper-button-disabled {
    opacity: .7;
    background-color: #444
}

body.mobile-page #mainPage .event-list .sm-prev {
    left: 10px;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTS0xLTFoNTgydjQwMkgtMXoiLz48Zz48cGF0aCBmaWxsPSJub25lIiBkPSJNMCAwaDUwdjUwSDB6Ii8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTM1IDQ3LjI1bDIuMDg2LTIuMDg2TDE2LjkyMiAyNSAzNy4wODYgNC44MzYgMzUgMi43NSAxMi43NSAyNXoiLz48L2c+PC9zdmc+)
}

body.mobile-page #mainPage .event-list .sm-next {
    right: 10px;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTS0xLTFoNTgydjQwMkgtMXoiLz48Zz48cGF0aCBmaWxsPSJub25lIiBkPSJNMCAwaDUwdjUwSDB6Ii8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE1IDIuNzVsLTIuMDg2IDIuMDg2TDMzLjA3OCAyNSAxMi45MTQgNDUuMTY0IDE1IDQ3LjI1IDM3LjI1IDI1eiIvPjwvZz48L3N2Zz4=)
}

body.mobile-page #mainPage #mainPageGameSliders {
    flex-direction: column
}

body.mobile-page #mainPage #mainPageGameSliders .desktop-title {
    display: none
}

body.mobile-page #mainPage #mainPageGameSliders .mobile-title {
    display: inline-block
}

body.mobile-page #toggleMobileMainMenu.visible i:before {
    content: "\f00d"
}

body.mobile-page #forgotPasswordModal, body.mobile-page #loginModal {
    color: #333
}

body.mobile-page #forgotPasswordModal .modal-dialog, body.mobile-page #loginModal .modal-dialog {
    height: auto;
    width: 94%;
    max-width: 500px;
    min-width: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) !important;
    border-radius: var(--g-radius-sm) !important;
    margin: 0
}

body.mobile-page #forgotPasswordModal .modal-header, body.mobile-page #loginModal .modal-header {
    border-bottom: none !important
}

body.mobile-page #forgotPasswordModal .modal-header h3, body.mobile-page #forgotPasswordModal .modal-header h5, body.mobile-page #loginModal .modal-header h3, body.mobile-page #loginModal .modal-header h5 {
    color: var(--primary-text-color);
    position: relative;
    left: 50%;
    transform: translateX(-50%)
}

body.mobile-page #forgotPasswordModal .modal-header h3, body.mobile-page #loginModal .modal-header h3 {
    font-size: 20px
}

body.mobile-page #forgotPasswordModal .modal-header .close, body.mobile-page #loginModal .modal-header .close {
    color: #ddd
}

body.mobile-page #forgotPasswordModal .modal-content, body.mobile-page #loginModal .modal-content {
    background-color: var(--light-grey)
}

body.mobile-page #forgotPasswordModal .modal-body, body.mobile-page #loginModal .modal-body {
    overflow-y: hidden;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50%;
    margin-bottom: 100px !important
}

body.mobile-page #forgotPasswordModal .modal-body form, body.mobile-page #loginModal .modal-body form {
    padding: 15px;
    text-align: center;
    max-width: 100%;
    height: 100%;
    margin: 0;
    border-radius: 0
}

body.mobile-page #forgotPasswordModal .modal-body form #headerLoginStepStarter, body.mobile-page #loginModal .modal-body form #headerLoginStepStarter {
    padding: 0 15%
}

body.mobile-page #forgotPasswordModal .modal-body form label, body.mobile-page #loginModal .modal-body form label {
    color: #fff
}

body.mobile-page #forgotPasswordModal .modal-body form .form-group, body.mobile-page #loginModal .modal-body form .form-group {
    margin-top: var(--g-space-md) !important
}

body.mobile-page #forgotPasswordModal .modal-body form .form-group .form-control, body.mobile-page #loginModal .modal-body form .form-group .form-control {
    background-color: #222;
    border-radius: var(--g-radius-sm);
    border: 2px solid #333;
    padding: .6rem .75rem;
    color: #fff
}

body.mobile-page #forgotPasswordModal .modal-body form .form-group .form-control::-moz-placeholder, body.mobile-page #loginModal .modal-body form .form-group .form-control::-moz-placeholder {
    color: #888
}

body.mobile-page #forgotPasswordModal .modal-body form .form-group .form-control:-ms-input-placeholder, body.mobile-page #loginModal .modal-body form .form-group .form-control:-ms-input-placeholder {
    color: #888
}

body.mobile-page #forgotPasswordModal .modal-body form .form-group .form-control::placeholder, body.mobile-page #loginModal .modal-body form .form-group .form-control::placeholder {
    color: #888
}

body.mobile-page #forgotPasswordModal p, body.mobile-page #loginModal p {
    margin-bottom: 0;
    color: var(--g-main-color-b-dark)
}

body.mobile-page #forgotPasswordModal .link, body.mobile-page #loginModal .link {
    color: #ddd;
    text-transform: capitalize
}

body.mobile-page #forgotPasswordModal #openRegisterModal, body.mobile-page #loginModal #openRegisterModal {
    background-color: transparent !important;
    color: #ddd !important;
    font-weight: 700
}

body.mobile-page #newCasinoPage #casinoGames #gameList .game {
    border-radius: 5px;
    border: none
}

body.mobile-page #memberMenuModal {
    color: #ddd
}

body.mobile-page #memberMenuModal h3 .close {
    top: 0
}

body.mobile-page #memberMenuModal .modal-header h3 {
    width: 100%
}

body.mobile-page #memberMenuModal .modal-body h5 button {
    color: #333
}

body.mobile-page .casino-split-box {
    max-width: 100%;
    background-size: 99%;
    width: 56px;
    background-repeat: no-repeat
}

body.mobile-page .casino-split-box.active {
    background-position: 0 6.9%
}

body.mobile-page .casino-split-box.user-casino-icon {
    background-position: 0 27.6%
}

body.mobile-page .casino-split-box.user-casino-icon.active {
    background-position: 0 34.6%
}

body.mobile-page .casino-split-box.balance-casino-icon {
    background-position: 0 13.8%
}

body.mobile-page .casino-split-box.balance-casino-icon.active {
    background-position: 0 20.7%
}

body.mobile-page .casino-split-box.notifications-casino-icon {
    background-position: 0 69.1%
}

body.mobile-page .casino-split-box.notifications-casino-icon.active {
    background-position: 0 76.1%
}

body.mobile-page .casino-split-box.secure-casino-icon {
    background-position: 0 41.5%
}

body.mobile-page .casino-split-box.secure-casino-icon.active {
    background-position: 0 48.4%
}

body.mobile-page #siteSettings {
    display: block;
    background-color: red;
    width: 300px
}

body.mobile-page .modal-backdrop.fade.show.login-modal, body.mobile-page .modal-backdrop.fade.show.pass-modal {
    background-color: transparent;
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    opacity: 1;
    margin-top: 60px
}

body.mobile-page #gamePreModal {
    top: 60px;
    z-index: 1100
}

body.mobile-page #gamePreModal .modal-dialog {
    top: 60px !important
}

body.mobile-page #newCasinoPage #casinoDefault #gameList, body.mobile-page #newCasinoPage #casinoGames #gameList {
    padding: 0
}

body.mobile-page #newCasinoPage #casinoGames h2 {
    font-size: 18px;
    padding: 10px !important
}

body.mobile-page #newCasinoPage #casinoGames #defaultList .default-game-list .game {
    border-radius: 5px
}

body.mobile-page #newCasinoPage #casinoGames #defaultList .default-game-list .game img {
    border-radius: var(--g-radius-sm)
}

body.mobile-page #newCasinoPage #casinoGames #defaultList .default-game-list .game:first-child, body.mobile-page #newCasinoPage #casinoGames #defaultList .default-game-list .game:nth-child(14) {
    grid-row: span 1 !important;
    grid-column: span 1 !important
}

body.mobile-page #newCasinoPage #casinoGames #defaultList .default-game-list .casino-loader.text-center button {
    font-size: 14px
}

body.mobile-page .phpdebugbar-openhandler-overlay.block {
    display: block !important
}

body.mobile-page #scrollToTop {
    z-index: 20000
}

body.mobile-page #activityModal {
    z-index: 99999999 !important;
    margin-top: 48px
}

body.mobile-page #favoriteGames {
    display: flex;
    justify-content: space-between;
    align-content: center;
    align-items: center;
    background-color: var(--g-main-color-a-dark);
    width: 100%;
    position: absolute;
    bottom: 60px;
    padding: 10px var(--g-space-sm)
}

body.mobile-page #favoriteGames.opened {
    bottom: 210px
}

body.mobile-page #favoriteGames.opened .fa {
    transform: rotate(180deg)
}

body.mobile-page #favoriteGames.opened-favorites #toggleRecents, body.mobile-page #favoriteGames.opened-recents #toggleFavorites {
    opacity: 0;
    pointer-events: none
}

body.mobile-page #favoriteGames .title_holder {
    display: flex;
    align-content: center;
    align-items: center
}

body.mobile-page #favoriteGames .title_holder .title {
    text-transform: uppercase;
    font-size: 14px;
    color: #fff;
    font-weight: 700;
    margin-bottom: 0;
    cursor: pointer;
    margin-right: 5px;
    align-items: center
}

body.mobile-page #favoriteGames .title_holder .fa {
    color: #fe7332
}

body.mobile-page #randomGame {
    width: 100%;
    position: absolute;
    bottom: 60px;
    background: #272a31;
    display: none
}

body.mobile-page #randomGame .random_holder {
    padding: 3px 0
}

body.mobile-page #randomGame .random_holder .title_holder {
    margin-bottom: 10px;
    width: 100%;
    display: flex;
    position: relative;
    justify-content: center;
    align-content: center;
    align-items: center
}

body.mobile-page #randomGame .random_holder .title_holder .title {
    text-transform: uppercase;
    font-size: 14px;
    color: #fff;
    font-weight: 700;
    margin-bottom: 0;
    cursor: pointer;
    margin-right: 5px
}

body.mobile-page #randomGame .random_holder .title_holder .fa {
    color: #fe7332
}

body.mobile-page #randomGame .random_holder .random_main_slider {
    max-width: 768px;
    margin: 0 auto;
    width: 100%;
    display: block;
    position: relative
}

body.mobile-page #randomGame.active {
    display: block
}

body.mobile-page #randomGame #randomList {
    display: flex;
    position: relative
}

body.mobile-page #randomGame #randomList .game {
    width: 120px;
    height: 120px;
    filter: blur(10px);
    margin: 5px 5px 10px 0;
    opacity: .75
}

body.mobile-page #randomGame #randomList .game .hover-box, body.mobile-page #randomGame #randomList .game .provider-m {
    display: none
}

body.mobile-page #randomGame #randomList .game.random {
    filter: blur(0);
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-97%);
    z-index: 99;
    opacity: 1
}

body.mobile-page #randomGame #randomList .game img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 10px
}

body.mobile-page #randomGame #randomList .random-game-list {
    display: flex
}

body.mobile-page #randomGame #randomList .random-game-list.active {
    -webkit-animation: random 3s ease-in-out;
    animation: random 3s ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

body.mobile-page #randomGame #randomList .random-game-list.animation {
    -webkit-animation: rand 3s ease-in-out;
    animation: rand 3s ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

body.mobile-page #randomGame #randomList .random-game-list.animation .random {
    transform: translateX(112%) !important
}

body.mobile-page #spinIt.active {
    background-color: var(--g-main-color-a-dark) !important
}

body.mobile-page #registerModal {
    margin-top: 60px
}

body.mobile-page #registerModal .form-control::-moz-placeholder {
    color: #aaa
}

body.mobile-page #registerModal .form-control:-ms-input-placeholder {
    color: #aaa
}

body.mobile-page #registerModal .form-control::placeholder {
    color: #aaa
}

body.mobile-page #registerModal p {
    color: #333
}

body.mobile-page #registerModal .modal-dialog {
    border-radius: 0;
    height: calc(100vh - 60px);
    top: 60px;
    left: 0;
    transform: scale(1) !important;
    overflow-y: auto;
    background: #fff
}

body.mobile-page #registerModal .reg-main-holder {
    border-radius: 0;
    height: calc(100vh - 60px);
    padding: 0
}

body.mobile-page #registerModal .sprite-global-registration {
    transform-origin: 24px top
}

body.mobile-page #registerModal .icons-holder .icons-nav li .icons-link {
    font-size: 9px
}

body.mobile-page #registerModal .icons-holder .icons-nav li .icons-link .nav-icons-container {
    width: 74px !important
}

body.mobile-page #sportMenuPromotions {
    display: flex;
    flex-direction: column
}

body.mobile-page #sportMenuPromotions a {
    display: flex;
    font-size: 12px
}

body.mobile-page #sportMenuPromotions a > div {
    align-self: flex-start
}

body.mobile-page #sportMenuPromotions a img {
    width: 64px;
    height: 64px;
    margin-right: 10px;
    align-self: flex-start
}

body.mobile-page #sportMenuPromotions a h6 {
    font-size: 13px;
    margin-bottom: 5px
}

body.mobile-page #sportMenuPromotions a p {
    font-size: 11px;
    margin-bottom: 0
}

body.mobile-page #sportMenuPromotions #allPromotions {
    font-size: 15px;
    border-bottom: 1px solid var(--g-main-color-a-light)
}

body.mobile-page #sportMenuPromotions .arrow-icon {
    font-size: 0;
    min-width: 34px;
    width: 34px;
    height: 34px;
    vertical-align: top;
    background-position: 66.66666666666666% 77.77777777777779%;
    background-size: 340px 340px;
    margin-left: auto !important
}

body.light-mode .tvbet-menu-icon, body.light-mode .zeppelin-menu-icon {
    filter: grayscale(0) brightness(10)
}

body.light-mode.mobile-page #memberMenuModal #memberTopMenu a {
    background-color: #e4e6ec
}

body.light-mode.mobile-page #memberMenuModal #memberTopMenu a img {
    filter: invert(1) brightness(140%)
}

body.light-mode.mobile-page #memberMenuModal #memberAreaCreditCard #addCardButton i {
    color: #333;
    font-size: 25px !important
}

body.light-mode.mobile-page #memberMenuModal #memberAreaCreditCard #paymentMethod .table tr td, body.light-mode.mobile-page #memberMenuModal #memberAreaCreditCard #paymentMethod .table tr th {
    color: #333 !important
}

body.light-mode.mobile-page #memberMenuModal #memberAreaCreditCard #paymentMethod .table tr [class*=btn-] {
    padding: 0 var(--g-space-sm);
    width: 100%
}

body.light-mode.mobile-page #memberMenuModal #memberAreaBonuses .text-center, body.light-mode.mobile-page #memberMenuModal #memberAreaSecurity .alert, body.light-mode.mobile-page #memberMenuModal #memberAreaSecurity form .security-row label {
    color: #333 !important
}

body.light-mode.mobile-page #memberMenuModal #memberAreaBankAccounts .dataTables_filter input, body.light-mode.mobile-page #memberMenuModal #memberAreaTrasactions .dataTables_filter input {
    background-color: #ddd !important;
    color: #333 !important
}

body.light-mode.mobile-page #memberMenuModal #memberAreaBankAccounts .table-responsive .table tr td, body.light-mode.mobile-page #memberMenuModal #memberAreaBankAccounts .table-responsive .table tr th, body.light-mode.mobile-page #memberMenuModal #memberAreaBankAccounts label, body.light-mode.mobile-page #memberMenuModal #memberAreaBonuses #bonuses_wrapper .dataTables_info, body.light-mode.mobile-page #memberMenuModal #memberAreaBonuses #bonuses_wrapper .dataTables_paginate, body.light-mode.mobile-page #memberMenuModal #memberAreaBonuses #bonuses_wrapper .dataTable tbody tr td, body.light-mode.mobile-page #memberMenuModal #memberAreaBonuses #bonuses_wrapper .dataTable thead tr th, body.light-mode.mobile-page #memberMenuModal #memberAreaBonuses .info-box, body.light-mode.mobile-page #memberMenuModal #memberAreaBonuses label, body.light-mode.mobile-page #memberMenuModal #memberAreaTrasactions .table-responsive .table tr td, body.light-mode.mobile-page #memberMenuModal #memberAreaTrasactions .table-responsive .table tr th, body.light-mode.mobile-page #memberMenuModal #memberAreaTrasactions label {
    color: #333 !important
}

body.light-mode.mobile-page #memberMenuModal #memberAreaBonuses #bonuses_wrapper .dataTables_length {
    background-color: #fff;
    color: #333 !important
}

body #modalBalanceList {
    list-style: none;
    padding: 0
}

body #modalBalanceList li {
    display: flex;
    justify-content: space-between;
    background-color: hsla(0, 0%, 100%, .01);
    padding: 10px 15px
}

body #modalBalanceList li:nth-child(2n) {
    background-color: hsla(0, 0%, 100%, .05)
}

body #modalBalanceList li p {
    margin: 0
}

body #login-form {
    max-width: 400px;
    margin: 0 auto
}

body #login-form #loginLogo img {
    max-height: 40px
}

body #sportUserMenu {
    position: absolute;
    top: 61px;
    right: 0;
    background-color: var(--g-main-color-a-dark);
    border: 1px solid var(--g-main-color-b-normal);
    padding: var(--g-space-sm);
    width: 300px;
    display: none;
    z-index: 20005
}

body #sportUserMenu #openMemberMenu {
    background-color: transparent !important
}

body #sportUserMenu .account-user {
    display: flex;
    justify-content: space-between;
    align-items: center
}

body #sportUserMenu .account-user #openMemberMenu {
    align-items: center
}

body #sportUserMenu .account-user i {
    font-size: 23px !important;
    color: #000;
    background: #fff;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: var(--g-space-xs);
    position: relative
}

body #sportUserMenu .account-user i:after {
    content: "";
    position: absolute;
    width: 28px;
    height: 28px;
    border: 1px solid var(--g-primary-color-normal);
    border-radius: 50%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

body #sportUserMenu .account-user span {
    display: flex;
    flex-direction: column;
    line-height: 16px
}

body #sportUserMenu .account-user span .current_balance {
    color: var(--g-secondary-color-normal);
    font-size: 11px
}

body #sportUserMenu.visible {
    display: block
}

body #sportUserMenu a {
    padding: 0;
    font-size: 14px;
    display: flex;
    justify-content: flex-start;
    align-content: center;
    align-items: center
}

body #sportUserMenu a div {
    margin: 0 var(--g-space-xs) 0 0;
    transform: scale(.8)
}

body #sportUserMenu #dropdownDepositBtn {
    border-radius: 0;
    text-align: center;
    justify-content: center;
    width: 35%;
    height: 31px;
    padding: var(--g-space-xs) 0;
    align-items: center;
    font-size: 12px;
    background-color: var(--g-secondary-color-normal)
}

body .modal-backdrop {
    z-index: 999 !important
}

@media (max-width: 1400px) {
    header #mainMenuDesktop a {
        font-size: 13px
    }
}

@media (max-width: 1300px) {
    header {
        padding: var(--g-space-sm) var(--g-space-sm)
    }

    header #headerLogo img {
        max-height: 40px;
        margin: 10px 0
    }

    header #memberActions a {
        font-size: 12px
    }

    header #mainMenuDesktop a {
        padding: 2px 7px
    }
}

@media (max-width: 1200px) {
    .container {
        max-width: 100%
    }

    header #headerLogo img {
        max-height: 35px;
        margin: 11px 0
    }

    header #mainMenuDesktop a {
        font-size: 12px;
        padding: 2px 5px
    }

    #pokerPage .game-list .game .online {
        font-size: 10px
    }
}

@media (max-width: 992px) {
    header #mainMenuDesktop a {
        font-size: 11px;
        padding: 3px 5px
    }

    header #mainMenuDesktop a .fa {
        font-size: 18px !important
    }

    header #mainMenuDesktop a i {
        font-size: 15px
    }

    #newCasinoPage #mainPage #mainPageBoxes .container {
        flex-direction: column
    }

    #newCasinoPage #mainPage #mainPageBoxes .container .box:first-child, #newCasinoPage #mainPage #mainPageBoxes .container .box:nth-child(2) {
        width: calc(100% - 20px)
    }

    #newCasinoPage #mainPage #mainPageBoxes .container .box .box-header {
        padding: 5px 10px
    }

    body.mobile-page #randomGame #randomList .game.random {
        transform: translateX(55%) !important
    }

    body.mobile-page #randomGame #randomList .random-game-list.animation .random {
        transform: translateX(265%) !important
    }

    body.mobile-page .increasing-daily-cc-limit-form {
        background-color: transparent
    }

    #memberArea #memberAreaContent #messages table button {
        padding: 0 10px 5px
    }
}

@media (max-width: 768px) {
    #memberArea #memberAreaContent, .modal-body {
        padding: var(--g-space-xs)
    }

    #memberArea #memberAreaContent .info-box {
        font-size: 12px
    }

    .full-page-menu a span {
        font-size: 12px;
        line-height: 12px;
        white-space: nowrap
    }

    header a.mobile-header-logo img {
        max-height: 40px
    }

    footer #secureGamingLinks {
        flex-wrap: wrap
    }

    footer #secureGamingLinks i {
        margin: 10px !important
    }

    #newCasinoPage #casinoGames #gameList .game {
        width: auto;
        padding-bottom: calc(100% - 20px)
    }

    #blogPage #pageHeader, #blogPage .blogContent {
        margin-top: var(--g-space-md)
    }

    body.mobile-page .select2-container--default .select2-selection--single .select2-selection__rendered, body.mobile-page .select2-results__option {
        color: #444 !important
    }

    body.mobile-page .select2-container {
        z-index: 999999999999
    }

    body.mobile-page .select2-container .select2-dropdown {
        background-color: #fff;
        border-color: #ddd
    }

    body.mobile-page .select2-container .select2-dropdown .select2-search__field {
        background-color: #ddd;
        border-color: #ccc;
        color: #444
    }

    body.mobile-page #randomGame #randomList .game.random {
        transform: translateX(37%) !important
    }

    body.mobile-page #randomGame #randomList .random-game-list.animation .random {
        transform: translateX(255%) !important
    }

    body.mobile-page #mainPage #mainPageGameSliders {
        padding: 0
    }

    body.mobile-page #mainPage #mainPageGameSliders .game {
        margin: 0
    }

    body.mobile-page #mainPage #mainPageGameSliders .controls, body.mobile-page #mainPage #mainPageGameSliders .desktop-title {
        display: none
    }

    body.mobile-page #mainPage #mainPageGameSliders .game-slider-title {
        padding: 7px;
        background-color: rgba(0, 0, 0, .3)
    }

    body.mobile-page #mainPage #mainPageGameSliders .game-slider-title > i {
        background-size: 270px 270px
    }

    body.mobile-page #mainPage #mainPageGameSliders .game-slider-title .see-all-link {
        font-size: 11px;
        margin-left: auto
    }

    body.mobile-page #mainPage #mainPageGameSliders .most-popular-games-slider {
        border: none;
        background-color: rgba(0, 0, 0, .1);
        padding: 10px
    }

    body.mobile-page #mainPage #mainPageGameSliders .most-popular-games-slider .game {
        border: none;
        border-radius: 2px
    }

    body.mobile-page #mainPage #mainPageGameSliders .most-popular-games-slider .game .provider-m {
        display: none
    }

    body.mobile-page #mainPage #mainPageBoxes {
        padding: 0
    }

    body.mobile-page #mainPage #mainPageBoxes .mobile-title, body.mobile-page #mainPage #mainPageBoxes .see-all-link {
        display: flex
    }

    body.mobile-page #mainPage #mainPageBoxes .desktop-title, body.mobile-page #mainPage #mainPageBoxes .options {
        display: none !important
    }

    body.mobile-page #mainPage #mainPageBoxes .container {
        padding: 0
    }

    body.mobile-page #mainPage #mainPageBoxes .container .box {
        width: 100% !important;
        margin: 0;
        border: none;
        background-color: transparent
    }

    body.mobile-page #mainPage #mainPageBoxes .container .box .box-header {
        line-height: 14px;
        background-color: rgba(0, 0, 0, .7);
        border: none;
        padding: 7px
    }

    body.mobile-page #mainPage #mainPageBoxes .container .box .box-header .see-all-link {
        font-size: 11px !important;
        font-weight: 700;
        border: none;
        margin-left: auto;
        padding: 0;
        color: #fff
    }

    body.mobile-page #mainPage #mainPageBoxes .container .box .box-header .see-all-link i {
        margin-left: 3px
    }

    body.mobile-page #mainPage #mainPageBoxes .container .box:nth-child(2) {
        display: none
    }
}

@media (max-width: 576px) {
    body main {
        padding-bottom: 0 !important
    }

    body.mobile-page .full-page-menu a {
        width: calc(50% - 10px)
    }

    body.mobile-page header #toggleMobileMainMenu {
        padding: var(--g-space-xs) var(--g-space-lg);
        font-size: 12px
    }

    body.mobile-page header #memberActions #goToRegisterPage, body.mobile-page header #memberActions #openLoginModal {
        padding: var(--g-space-xs) 4px;
        font-size: 12px
    }

    body.mobile-page #bottomBar #mobileBottomMenu a span {
        font-size: 10px;
        white-space: nowrap
    }

    body.mobile-page #loginModal {
        margin-top: 60px
    }

    body.mobile-page #loginModal .modal-dialog {
        width: 94%;
        top: 30px;
        transform: translateX(-50%) !important
    }

    .modal .modal-body h5 {
        font-size: 13px
    }

    #memberAreaContent {
        padding: var(--g-space-xs)
    }

    #pokerPage #pokerActions {
        flex-direction: column
    }

    #pokerPage #pokerActions #create-poker-form .plus-username-input.form-control {
        margin: 7px 0
    }

    .full-page-menu a span {
        font-size: 11px
    }

    body.mobile-page #bottomBar #mobileBottomMenu a p {
        font-size: .6rem;
        white-space: nowrap
    }

    #loginModal .google-sec-code {
        width: 104%;
        position: relative;
        left: -6px
    }
}

@media (max-width: 420px) {
    #newCasinoPage {
        padding: 0
    }

    #pokerPage .game-list .game a p {
        font-size: 15px
    }

    #pokerPage .game-list .game .online {
        font-size: 10px
    }

    body.mobile-page #sportUserMenu {
        width: 220px
    }

    body.mobile-page header #toggleMobileMainMenu {
        font-size: 11px
    }

    body.mobile-page header #memberActions #goToRegisterPage, body.mobile-page header #memberActions #openLoginModal, body.mobile-page header #memberActions #openRegisterModal {
        font-size: 10px
    }

    body.mobile-page header a.mobile-header-logo {
        font-size: 12px
    }

    body.mobile-page header #headerForSportPage .sportPageContainer a {
        font-size: 11px
    }

    body.mobile-page header #headerForSportPage .sportPageContainer a .current_balance, body.mobile-page header #headerForSportPage .sportPageContainer a p {
        transform: translateY(-5px)
    }

    body.mobile-page #loginModal .modal-dialog .modal-body form #headerLoginStepStarter {
        padding: 0 5%
    }

    #mainPage {
        padding-bottom: 0
    }
}

@media (max-width: 376px) {
    body.mobile-page #randomGame #randomList .game.random {
        transform: translateX(-112%)
    }

    body.mobile-page #randomGame #randomList .random-game-list.animation .random {
        transform: translateX(97%) !important
    }
}

@media (max-width: 347px) {
    body.mobile-page #mobileMainMenu.mobileSportMenuBox #sportTopMenu, body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu {
        width: 240px
    }

    body.mobile-page #mobileMainMenu.mobileSportMenuBox .mobileSportMenu a {
        font-size: 14px
    }

    body.mobile-page #mobileMainMenu.mobileSportMenuBox .sport-button {
        left: 245px;
        bottom: 1%
    }
}

@media (max-width: 320px) {
    body.mobile-page #loginModal .modal-dialog {
        width: 100%
    }

    body.mobile-page #mobileMainMenu.mobileSportMenuBox .sport-button.icon-setting {
        bottom: 12%
    }
}

@media (max-width: 1200px) and (min-width: 768px) {
    #newCasinoPage #casinoGames #gameList .game:first-child, #newCasinoPage #casinoGames #gameList .game:nth-child(11), #newCasinoPage #casinoGames #gameList .game:nth-child(15), #newCasinoPage #casinoGames #gameList .game:nth-child(25), #newCasinoPage #casinoGames #gameList .game:nth-child(29) {
        grid-column: span 1;
        grid-row: span 1
    }
}

@-moz-document url-prefix() {
    body.mobile-page header #headerForSportPage .sportPageContainer {
        width: 32%
    }
}

@-webkit-keyframes random {
    0% {
        transform: translateX(0)
    }
    to {
        transform: translateX(-250px)
    }
}

@keyframes random {
    0% {
        transform: translateX(0)
    }
    to {
        transform: translateX(-250px)
    }
}

@-webkit-keyframes rand {
    0% {
        transform: translateX(-250px)
    }
    to {
        transform: translateX(-500px)
    }
}

@keyframes rand {
    0% {
        transform: translateX(-250px)
    }
    to {
        transform: translateX(-500px)
    }
}

body.mobile-page #memberMenuModal #memberTopMenu a img {
    filter: invert(1) brightness(140%)
}

@media screen and (max-width: 992px) and (orientation: landscape) {
    body.mobile-page {
        padding-top: 45px;
        font-size: 13px
    }

    body.mobile-page #forgotPasswordModal .modal-body form .form-group .form-control, body.mobile-page #loginModal .modal-body form .form-group .form-control {
        padding: 5px 10px;
        font-size: 12px
    }

    body.mobile-page #forgotPasswordModal #GonderBtn, body.mobile-page #forgotPasswordModal .btn-primary, body.mobile-page #loginModal #GonderBtn, body.mobile-page #loginModal .btn-primary {
        margin-top: var(--g-space-md) !important;
        padding: 5px 0
    }

    body.mobile-page #forgotPasswordModal .modal-body form .form-group, body.mobile-page #loginModal .modal-body form .form-group {
        margin-top: 3px !important
    }

    body.mobile-page .modal-backdrop.fade.show.login-modal, body.mobile-page .modal-backdrop.fade.show.pass-modal {
        margin-top: 45px
    }

    body.mobile-page #forgotPasswordModal .modal-header h3, body.mobile-page #loginModal .modal-header h3 {
        padding-top: 0
    }

    body.mobile-page #forgotPasswordModal .modal-header h3, body.mobile-page #forgotPasswordModal .modal-header h5, body.mobile-page #loginModal .modal-header h3, body.mobile-page #loginModal .modal-header h5 {
        margin-top: 0
    }

    body.mobile-page #forgotPasswordModal .modal-body, body.mobile-page #loginModal .modal-body {
        margin-bottom: 30px !important
    }

    body.mobile-page #loginModal {
        margin-top: 45px
    }

    body.mobile-page #loginModal .modal-dialog {
        top: calc(50% - -25px);
        transform: translate(-50%, -50%) !important
    }

    body.mobile-page #loginModal .link {
        margin: 0
    }

    body.mobile-page header {
        height: 45px
    }

    body.mobile-page header a.mobile-header-logo img {
        max-height: 30px
    }

    body.mobile-page header .header-area {
        margin: -10px 0 !important;
        transform: scale(.8)
    }
}

@media (-ms-high-contrast: none), screen and (-ms-high-contrast: active) {
    body {
        background-color: #cad6e2;
        color: #333743;
        font-family: Titillium Web
    }

    body .link {
        color: #272b34
    }

    body #pokerActions {
        color: #333743
    }

    body #pokerPage .game-list .game .online {
        color: #333743;
        border-color: #333743
    }

    body header {
        background-image: radial-gradient(circle, #e7eef5, #cad6e2);
        border-bottom: #cad6e2;
        width: 100%;
        padding: 0 20px
    }

    body header #dropdownBalance a#toggleBalanceDropdown {
        background-color: #06a578;
        color: #333743
    }

    body header #dropdownBalance #balanceMenuDropdown {
        background-color: #cad6e2;
        border: 2px solid #f6fdff;
        border-radius: 20px
    }

    body header #headerLogo {
        color: #333743
    }

    body header #mainMenuDesktop a {
        color: #333743;
        transition: all .5s;
        padding: 10px 15px;
        font-family: Titillium Web
    }

    body header #mainMenuDesktop a:hover {
        color: #06a578
    }

    body header #mainMenuDesktop a:hover:after {
        border-top-color: #06a578
    }

    body header #memberActions a {
        border-radius: 40px;
        padding: 5px 20px;
        margin-left: 5px;
        color: #ddd
    }

    body header #memberActions a#goToRegisterPage {
        background-color: #06a578
    }

    body header #memberActions #openLoginModal {
        background-color: #4b5062;
        color: #ddd
    }

    body header #memberActions a#openLoginModal, body header #memberActions a#openMemberMenu {
        background-color: #4b5062
    }

    body header #memberActions a#openLoginModal:hover, body header #memberActions a#openMemberMenu:hover {
        background-color: #333743
    }

    body section#maiPageSteps {
        background-color: #cad6e2
    }

    body section#maiPageSteps .step a h1, body section#maiPageSteps .step a h3 {
        color: #333743
    }

    body footer h2 {
        margin-bottom: 20px;
        color: #333743
    }

    body footer #footerLinksSection {
        background-color: #e7eef5;
        padding: 40px
    }

    body footer #footerLinksSection a {
        color: #333743;
        border-radius: 20px;
        background-color: #cad6e2;
        padding: 5px 20px;
        margin: 5px
    }

    body footer #footerLinksSection a:hover {
        background-color: #06a578
    }

    body footer #footerSocialMediaLinksSection {
        padding: 40px 20px
    }

    body footer #footerSocialMediaLinksSection a {
        color: #333743;
        background-color: #e7eef5;
        border-radius: 40px;
        margin: 5px
    }

    body footer #secureGamingSection {
        background-color: #e7eef5;
        padding: 40px 20px
    }

    body footer #secureGamingSection p {
        color: #333743
    }

    body footer #footerPlatformSection {
        padding: 20px 20px 80px
    }

    body #bottomBar {
        width: 100%;
        background-color: #e7eef5;
        border-top: 3px solid #cad6e2;
        color: #333743;
        transition: all .5s
    }

    body #bottomBar a {
        color: #333743;
        padding: 10px 15px;
        border-right: 1px solid #cad6e2
    }

    body #bottomBar .site-time {
        border-right: 1px solid #cad6e2;
        border-left: 1px solid #cad6e2;
        padding: 10px
    }

    body #bottomBar .bottom-bar-sub-menu {
        background-color: #f6fdff;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
        border-color: #cad6e2;
        padding: 15px
    }

    body #bottomBar .bottom-bar-sub-menu .custom-radio {
        padding: 5px 0 10px
    }

    body #bottomBar .bottom-bar-sub-menu .custom-radio .custom-control-input:checked ~ .custom-control-label:before {
        background-color: #06a578
    }

    body #bottomBar.in-visible #toggleBottomBar {
        border-top-left-radius: 10px;
        border-color: #057f5c;
        background-color: #06a578
    }

    body .form-group .icon-button {
        right: 10px;
        color: #333743;
        padding: 5px
    }

    body .modal .modal-header .close, body .modal .modal-header h3 {
        color: #ddd
    }

    body .modal .modal-content {
        padding: 20px
    }

    body .modal .modal-dialog {
        border-radius: 5px;
        background-color: #cad6e2;
        border: 1px solid #e7eef5
    }

    body .modal .modal-body form {
        color: #333743
    }

    body .modal .modal-body form .form-group .form-control {
        border-radius: 5px
    }

    body #registerPage .register-description {
        background-color: #f6fdff;
        margin: 20px 0
    }

    body #registerPage .card {
        background-color: #e7eef5;
        border: 1px solid #f6fdff;
        margin-bottom: 20px
    }

    body #registerPage .panel-heading {
        border-radius: 20px;
        background-color: #f6fdff;
        padding-left: 20px;
        margin-bottom: 5px !important
    }

    body #registerPage .panel {
        border-radius: 20px;
        background-color: #cad6e2;
        padding: 10px
    }

    body #pokerActions {
        background-color: #e7eef5
    }

    body #pokerGames .game-list .game {
        background-color: #e7eef5;
        border: 5px solid #f6fdff;
        border-radius: 5px
    }

    body #pokerGames .game-list .game img {
        width: 100%
    }

    body #pokerGames .game-list .game p {
        color: #333743;
        margin: 10px 0
    }

    body #pokerGames .game-list .game a > span {
        border: 1px solid #f6fdff;
        border-radius: 40px;
        padding: 5px 15px
    }

    body #pokerGames .game-list .game a .buttons {
        background-color: #f6fdff;
        transition: all .5s
    }

    body #pokerGames .game-list .game a:hover .buttons .btn {
        background-color: #06a578;
        padding: 5px 20px
    }

    body #pokerPage .btn.trans {
        padding: 10px 0;
        color: #333743;
        background-color: #f6fdff;
        border-radius: 40px
    }

    body #pokerPage .btn.trans:hover {
        background-color: #e7eef5 !important
    }

    body #activityModal .modal-dialog {
        background-color: #e7eef5
    }

    body #activityModal #activityModalContent .section-header {
        border-radius: 20px;
        background-color: #f6fdff;
        padding: 10px 15px;
        margin-top: 20px
    }

    body #activityModal #activityModalContent .payment-method {
        background-color: #cad6e2;
        border-radius: 5px;
        margin: 5px 0;
        padding: 10px
    }

    body #activityModal #activityModalContent #sectionFilter a.mixitup-control-active {
        background-color: #06a578
    }

    body #activityModal #activityModalContent #sectionFilter .sm-next, body #activityModal #activityModalContent #sectionFilter .sm-prev {
        background-color: #f6fdff
    }

    body #activityModal #activityModalContent #sectionFilter .sm-prev {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0
    }

    body #activityModal #activityModalContent #sectionFilter, body #activityModal #activityModalContent #sectionFilter .swiper-button-disabled {
        background-color: #cad6e2
    }

    body #activityModal #activityModalContent #sectionFilter a {
        background-color: #cad6e2;
        padding: 10px 15px;
        border: 1px solid #e7eef5
    }

    body #bottomBar .bottom-bar-sub-menu {
        border: 1px solid #cad6e2
    }

    body #bottomBar .bottom-bar-sub-menu hr {
        border-color: #e7eef5
    }

    body #bottomBarBalanceList p span button, body #bottomBarRakeback p span button {
        color: #333743
    }

    body .no-message, body .no-notification {
        margin-top: 15px;
        padding: 10px 15px;
        border-radius: 5px;
        background-color: #e7eef5
    }

    body #memberMenuModal h3 a {
        background-color: #f6fdff;
        color: #333743;
        margin-left: 5px;
        padding: 5px 15px;
        border-radius: 40px
    }

    body #memberArea #memberMenu {
        background-color: #e7eef5;
        border-radius: 5px;
        padding: 10px
    }

    body #memberArea #memberMenu a {
        color: #333743;
        padding: 5px
    }

    body #memberArea #memberMenu a.active {
        background-color: #06a578;
        border-radius: 20px;
        color: #4b5062
    }

    body #memberArea #memberAreaContent {
        background-color: #e7eef5;
        border-radius: 5px;
        padding: 15px 20px
    }

    body .modal .modal-body form {
        background-color: #cad6e2;
        border-radius: 5px;
        padding: 10px 15px
    }

    body .modal .modal-body form .option-group .custom-radio {
        background-color: #e7eef5;
        border: 1px solid #f6fdff;
        border-radius: 5px
    }

    body .modal .modal-body form .option-group .custom-control-label {
        padding: 5px 15px 5px 10px
    }

    body .modal .modal-body form .option-group .custom-control-label:before {
        background-color: #333743
    }

    body .modal .modal-body h5 {
        background-color: #f6fdff;
        border-radius: 20px;
        padding: 10px 15px;
        margin-bottom: 10px
    }

    body .modal .modal-body table {
        background-color: #cad6e2;
        border-radius: 5px
    }

    body .modal .modal-body table tr {
        border-color: #e7eef5
    }

    body .modal .modal-body table tr td {
        border-color: #e7eef5;
        padding: 5px 10px
    }

    body .form-group .form-control {
        background-color: #e7eef5;
        border: 1px solid #f6fdff;
        color: #272b34
    }

    body #newCasinoPage #casinoGames {
        background-color: #cad6e2
    }

    body #newCasinoPage #casinoGames #gameList .game {
        border: 5px solid #e7eef5
    }

    body.dark-mode {
        background-color: #272b34;
        color: #ddd;
        font-family: Titillium Web
    }

    body.dark-mode #pokerActions {
        color: #ddd
    }

    body.dark-mode #pokerPage .game-list .game .online {
        color: #ddd;
        border-color: #ddd
    }

    body.dark-mode #gamePreModal .madal .modal-content {
        padding: 20px
    }

    body.dark-mode #gamePreModal .modal-header i {
        border: 3px solid #ddd;
        background-color: #ddd;
        margin-right: 10px
    }

    body.dark-mode header {
        background-image: radial-gradient(circle, #333743, #272b34);
        border-bottom: #272b34;
        width: 100%;
        padding: 0 20px
    }

    body.dark-mode header #dropdownBalance a#toggleBalanceDropdown {
        background-color: #06a578;
        color: #ddd
    }

    body.dark-mode header #dropdownBalance #balanceMenuDropdown {
        background-color: #272b34;
        border: 2px solid #4b5062;
        border-radius: 20px
    }

    body.dark-mode header #dropdownBalance #balanceMenuDropdown #dropdownBalanceList p, body.dark-mode header #dropdownBalance #balanceMenuDropdown #dropdownBalanceList p span button, body.dark-mode header #dropdownBalance #balanceMenuDropdown #dropdownRakeback p span button, body.dark-mode header #headerLogo {
        color: #ddd
    }

    body.dark-mode header #mainMenuDesktop a {
        color: #ddd;
        transition: all .5s;
        padding: 10px 15px;
        font-family: Titillium Web
    }

    body.dark-mode header #mainMenuDesktop a:hover {
        color: #06a578
    }

    body.dark-mode header #mainMenuDesktop a:hover:after {
        border-top-color: #06a578
    }

    body.dark-mode header #memberActions a {
        border-radius: 40px;
        padding: 5px 20px;
        margin-left: 5px;
        color: #ddd
    }

    body.dark-mode header #memberActions a#goToRegisterPage {
        background-color: #06a578
    }

    body.dark-mode header #memberActions #openLoginModal {
        background-color: #4b5062;
        color: #ddd
    }

    body.dark-mode header #memberActions a#openLoginModal, body.dark-mode header #memberActions a#openMemberMenu {
        background-color: #4b5062
    }

    body.dark-mode header #memberActions a#openLoginModal:hover, body.dark-mode header #memberActions a#openMemberMenu:hover {
        background-color: #333743
    }

    body.dark-mode section#maiPageSteps {
        background-color: #272b34
    }

    body.dark-mode section#maiPageSteps .step a h1, body.dark-mode section#maiPageSteps .step a h3 {
        color: #ddd
    }

    body.dark-mode footer h2 {
        margin-bottom: 20px;
        color: #ddd
    }

    body.dark-mode footer #footerLinksSection {
        background-color: #333743;
        padding: 40px
    }

    body.dark-mode footer #footerLinksSection a {
        color: #ddd;
        border-radius: 20px;
        background-color: #272b34;
        padding: 5px 20px;
        margin: 5px
    }

    body.dark-mode footer #footerLinksSection a:hover {
        background-color: #06a578
    }

    body.dark-mode footer #footerSocialMediaLinksSection {
        padding: 40px 20px
    }

    body.dark-mode footer #footerSocialMediaLinksSection a {
        color: #ddd;
        background-color: #333743;
        border-radius: 40px;
        margin: 5px
    }

    body.dark-mode footer #secureGamingSection {
        background-color: #333743;
        padding: 40px 20px
    }

    body.dark-mode footer #secureGamingSection p {
        color: #ddd
    }

    body.dark-mode footer #footerPlatformSection {
        padding: 20px 20px 80px
    }

    body.dark-mode #bottomBar {
        width: 100%;
        background-color: #333743;
        border-top: 3px solid #4b5062;
        color: #ddd;
        transition: all .5s
    }

    body.dark-mode #bottomBar a {
        color: #ddd;
        padding: 10px 15px;
        border-right: 1px solid #4b5062
    }

    body.dark-mode #bottomBar .site-time {
        border-right: 1px solid #4b5062;
        border-left: 1px solid #4b5062;
        padding: 10px
    }

    body.dark-mode #bottomBar .bottom-bar-sub-menu {
        background-color: #4b5062;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
        border-color: #272b34;
        padding: 15px
    }

    body.dark-mode #bottomBar .bottom-bar-sub-menu .custom-radio {
        padding: 5px 0 10px
    }

    body.dark-mode #bottomBar .bottom-bar-sub-menu .custom-radio .custom-control-input:checked ~ .custom-control-label:before {
        background-color: #06a578
    }

    body.dark-mode #bottomBar.in-visible #toggleBottomBar {
        border-top-left-radius: 10px;
        border-color: #057f5c;
        background-color: #06a578
    }

    body.dark-mode .form-group .icon-button {
        right: 10px;
        color: #ddd;
        padding: 5px
    }

    body.dark-mode .modal .modal-header .close, body.dark-mode .modal .modal-header h3 {
        color: #ddd
    }

    body.dark-mode .modal .modal-content {
        padding: 20px
    }

    body.dark-mode .modal .modal-dialog {
        border-radius: 5px;
        background-color: #272b34;
        border: 1px solid #333743
    }

    body.dark-mode .modal .modal-body form {
        color: #ddd
    }

    body.dark-mode .modal .modal-body form .form-group .form-control {
        border-radius: 5px
    }

    body.dark-mode #registerPage .register-description {
        background-color: #4b5062;
        margin: 20px 0
    }

    body.dark-mode #registerPage .card {
        background-color: #333743;
        border: 1px solid #4b5062;
        margin-bottom: 20px
    }

    body.dark-mode #registerPage .panel-heading {
        border-radius: 20px;
        background-color: #4b5062;
        padding-left: 20px;
        margin-bottom: 5px !important
    }

    body.dark-mode #registerPage .panel {
        border-radius: 20px;
        background-color: #272b34;
        padding: 10px
    }

    body.dark-mode #pokerActions {
        background-color: #333743
    }

    body.dark-mode #pokerGames .game-list .game {
        background-color: #333743;
        border: 5px solid #4b5062;
        border-radius: 5px
    }

    body.dark-mode #pokerGames .game-list .game img {
        width: 100%
    }

    body.dark-mode #pokerGames .game-list .game p {
        color: #ddd;
        margin: 10px 0
    }

    body.dark-mode #pokerGames .game-list .game a > span {
        border: 1px solid #4b5062;
        border-radius: 40px;
        padding: 5px 15px
    }

    body.dark-mode #pokerGames .game-list .game a .buttons {
        background-color: #4b5062;
        transition: all .5s
    }

    body.dark-mode #pokerGames .game-list .game a:hover .buttons .btn {
        background-color: #06a578;
        padding: 5px 20px
    }

    body.dark-mode #pokerPage .btn.trans {
        padding: 10px 0;
        color: #ddd;
        background-color: #4b5062;
        border-radius: 40px
    }

    body.dark-mode #pokerPage .btn.trans:hover {
        background-color: #333743 !important
    }

    body.dark-mode #activityModal .modal-dialog {
        background-color: #333743
    }

    body.dark-mode #activityModal #activityModalContent .payment-method {
        background-color: #272b34;
        border-radius: 5px;
        margin: 5px 0;
        padding: 10px
    }

    body.dark-mode #activityModal #activityModalContent .section-header {
        background-color: #4b5062;
        border-radius: 20px;
        padding: 10px 15px;
        margin-top: 20px
    }

    body.dark-mode #activityModal #activityModalContent #sectionFilter {
        background-color: #272b34
    }

    body.dark-mode #activityModal #activityModalContent #sectionFilter a {
        background-color: #272b34;
        padding: 10px 15px;
        border: 1px solid #333743
    }

    body.dark-mode #activityModal #activityModalContent #sectionFilter a.mixitup-control-active {
        background-color: #06a578
    }

    body.dark-mode #activityModal #activityModalContent #sectionFilter .swiper-button-disabled {
        background-color: #272b34
    }

    body.dark-mode #activityModal #activityModalContent #sectionFilter .sm-next, body.dark-mode #activityModal #activityModalContent #sectionFilter .sm-prev {
        background-color: #4b5062
    }

    body.dark-mode #bottomBar .bottom-bar-sub-menu {
        border: 1px solid #272b34
    }

    body.dark-mode #bottomBar .bottom-bar-sub-menu hr {
        border-color: #333743
    }

    body.dark-mode #bottomBarBalanceList p span button, body.dark-mode #bottomBarRakeback p span button {
        color: #ddd
    }

    body.dark-mode .no-message, body.dark-mode .no-notification {
        margin-top: 15px;
        padding: 10px 15px;
        border-radius: 5px;
        background-color: #333743
    }

    body.dark-mode #memberMenuModal h3 a {
        background-color: #4b5062;
        color: #ddd;
        margin-left: 5px;
        padding: 5px 15px;
        border-radius: 40px
    }

    body.dark-mode #memberArea #memberMenu {
        background-color: #333743;
        border-radius: 5px;
        padding: 10px
    }

    body.dark-mode #memberArea #memberMenu a {
        color: #ddd;
        padding: 5px
    }

    body.dark-mode #memberArea #memberMenu a.active {
        background-color: #06a578;
        border-radius: 20px;
        color: #fff
    }

    body.dark-mode #memberArea #memberAreaContent {
        background-color: #333743;
        border-radius: 5px;
        padding: 15px 20px
    }

    body.dark-mode .modal .modal-body form {
        background-color: #272b34;
        border-radius: 5px;
        padding: 10px 15px
    }

    body.dark-mode .modal .modal-body form .option-group .custom-radio {
        background-color: #333743;
        border: 1px solid #4b5062;
        border-radius: 5px
    }

    body.dark-mode .modal .modal-body form .option-group .custom-control-label {
        padding: 5px 15px 5px 10px
    }

    body.dark-mode .modal .modal-body form .option-group .custom-control-label:before {
        background-color: #272b34
    }

    body.dark-mode .modal .modal-body h5 {
        background-color: #4b5062;
        border-radius: 20px;
        padding: 10px 15px;
        margin-bottom: 10px
    }

    body.dark-mode .modal .modal-body table {
        background-color: #272b34;
        border-radius: 5px
    }

    body.dark-mode .modal .modal-body table tr {
        border-color: #333743
    }

    body.dark-mode .modal .modal-body table tr td {
        border-color: #333743;
        padding: 5px 10px
    }

    body.dark-mode .form-group .form-control {
        background-color: #333743;
        border: 1px solid #4b5062;
        color: #bbb
    }

    body.dark-mode #newCasinoPage #casinoGames {
        background-color: #272b34
    }

    body.dark-mode #newCasinoPage #casinoGames #gameList .game {
        border: 5px solid #333743
    }

    body .btn-primary {
        background-color: #06a578
    }

    body .btn-primary:hover, body .btn-primary:not(:disabled):not(.disabled):active {
        background-color: #057f5c
    }

    body [class^=btn-] {
        border-radius: 20px;
        padding: 5px 20px
    }

    body .btn {
        border-radius: 20px
    }

    body .btn-gray {
        background-color: #6c757d
    }

    body .btn-gray:hover {
        background-color: #343a40
    }

    body #bottomBarMessageList, body #bottomBarNotificationsList {
        padding: 10px 0
    }

    body #login-form .link {
        padding: 10px;
        margin: 5px 0
    }

    body #login-form hr {
        border-color: #bbb
    }

    body #login-form .pokerklas-logo {
        margin: 10px 0 15px
    }

    body .link {
        color: #bbb
    }

    body .sm-next {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0
    }

    body .btn-secondary {
        background-color: #315e92
    }

    body .btn-secondary:hover {
        background-color: #2b5280
    }

    body .fetch-casino-games.btn {
        background-color: #06a578
    }
}

html[dir=rtl] .is-new-design #gamePreModal .google-sec-code iframe, html[dir=rtl] .is-new-design #loginModal .google-sec-code iframe {
    width: calc(100% + 64px)
}

html[dir=rtl] #newMainPageSlider .owl-stage-outer {
    direction: ltr
}

html[dir=rtl] .modal .modal-header .close {
    margin: -1rem auto -1rem -1rem;
    left: 20px;
    right: auto;
    top: 10px
}

html[dir=rtl] #gamePreModal {
    left: auto;
    right: 50%;
    transform: translate(50%, -50%)
}

html[dir=rtl] .is-new-design #gamePreModal .google-sec-code iframe, html[dir=rtl] .is-new-design #loginModal .google-sec-code iframe {
    transform-origin: right top;
    margin-bottom: 10px
}

html[dir=rtl] .setting-group .custom-radio label:after, html[dir=rtl] .setting-group .custom-radio label:before {
    right: auto;
    left: 0
}

html[dir=rtl] #bottomBar.in-visible #toggleBottomBar {
    right: auto;
    left: -100px;
    transform: rotate(45deg)
}

html[dir=rtl] #bottomBar.in-visible #toggleBottomBar i {
    transform: rotate(-45deg)
}

html[dir=rtl] #memberArea #memberMenu {
    margin-left: 20px;
    margin-right: 0
}

html[dir=rtl] #memberAreaDetails table tr td {
    text-align: right
}

html[dir=rtl] #memberAreaDetails table tr td:last-child {
    text-align: left
}

html[dir=rtl] .form-group {
    text-align: right
}

html[dir=rtl] .form-group .icon-button {
    left: var(--g-space-sm);
    right: auto
}

html[dir=rtl] #lcWithdrawModal .close {
    float: left
}

html[dir=rtl] #bottomBarBalanceList p span, html[dir=rtl] #bottomBarRakeback p span {
    margin-right: auto;
    margin-left: 0
}

html[dir=rtl] #themeSwitcher .custom-radio i {
    margin-left: 8px
}

html[dir=rtl] #bottomBarMessageContent .read-all, html[dir=rtl] #bottomBarNotificationsContent .read-all {
    left: 0;
    right: auto
}

html[dir=rtl] #memberAreaContent .alert, html[dir=rtl] #memberAreaContent .info-box {
    text-align: right
}

html[dir=rtl] .modal .modal-body h5 button {
    float: left
}

html[dir=rtl] #registerPage .panel-heading {
    text-align: right
}

html[dir=rtl] #bottomBar {
    left: 0
}

html[dir=rtl] #bottomBar .bottom-bar-sub-menu {
    left: 0;
    right: -173px
}

html[dir=rtl] #bottomBar #bottomBarMessages #bottomBarMessageContent strong {
    text-align: right
}

html[dir=rtl] #bottomBar #bottomBarMessages #bottomBarMessageContent .read-message strong {
    text-align: center
}

html[dir=rtl] #bottomBar #bottomBarNotifications #bottomBarNotificationsContent strong {
    text-align: right
}

html[dir=rtl] #pokerPage .game-list .game .online:before {
    margin-right: 0;
    margin-left: 5px
}

html[dir=rtl] #blogPage #leftBar, html[dir=rtl] #blogPage #pageHeader, html[dir=rtl] #blogPage .blogContent {
    text-align: right
}

html[dir=rtl] #login-form .form-group .icon-button {
    left: 0;
    right: auto
}

html[dir=rtl] header #headerLogo:before {
    right: -300px;
    left: auto
}

html[dir=rtl] header #headerLogo:hover:before {
    right: -45px;
    left: auto
}

html[dir=rtl] header #memberActions #balanceMenuDropdown {
    left: 45px;
    right: auto
}

html[dir=rtl] header #memberActions #balanceMenuDropdown #dropdownBalanceList p small, html[dir=rtl] header #memberActions #balanceMenuDropdown #dropdownRakeback p small {
    margin-right: var(--g-space-xs)
}

html[dir=rtl] header #memberActions #balanceMenuDropdown #dropdownBalanceList p span, html[dir=rtl] header #memberActions #balanceMenuDropdown #dropdownRakeback p span {
    margin-right: auto;
    margin-left: 0
}

html[dir=rtl] #memberArea #memberMenu a, html[dir=rtl] .modal .modal-body h5 {
    text-align: right
}

html[dir=rtl] #memberMenuModal h3 .close {
    left: 20px;
    right: auto
}

html[dir=rtl] #UyeOlForm .form-group .field-info {
    right: auto;
    left: 10px
}

html[dir=rtl] #registerModal .sprite-global-registration {
    transform-origin: 64px top
}

html[dir=rtl] body.mobile-page #registerModal .sprite-global-registration {
    transform-origin: 92px top
}

html[dir=rtl] body.mobile-page #mobileMainMenu.mobileSportMenuBox .sport-button {
    right: 245px;
    left: auto
}