a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
    border: 0;
    font-size: 100%;
    font: inherit;
    margin: 0;
    padding: 0;
    vertical-align: baseline
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}

body {
    line-height: 1
}

ol,
ul {
    list-style: none
}

blockquote,
q {
    quotes: none
}

blockquote:after,
blockquote:before,
q:after,
q:before {
    content: "";
    content: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

:active,
:focus,
a,
input {
    outline: 0 !important;
    -moz-outline-style: none !important
}

a {
    background-color: transparent;
    text-decoration: none
}

a:active,
a:hover {
    outline: 0
}

button,
input,
select,
textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit
}

b {
    font-weight: 700
}

i {
    font-style: italic
}

strong {
    font-weight: 700
}

html {
    -webkit-text-size-adjust: 100%
}

.hidden {
    display: none !important
}

.visible {
    display: block !important
}

@-ms-viewport {
    width: device-width
}

.visible-lg,
.visible-md,
.visible-sm,
.visible-xs,
.visible-xxs {
    display: none !important
}

@media (max-width:568px) {
    .visible-xxs {
        display: block !important
    }
}

@media (min-width:380px) and (max-width:767px) {
    .visible-xs {
        display: block !important
    }
}

@media (min-width:768px) and (max-width:991px) {
    .visible-sm {
        display: block !important
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .visible-md {
        display: block !important
    }
}

@media (min-width:1200px) {
    .visible-lg {
        display: block !important
    }
}

@media (max-width:568px) {
    .hidden-xxs {
        display: none !important
    }
}

@media (min-width:568px) and (max-width:767px) {
    .hidden-xs {
        display: none !important
    }
}

@media (min-width:768px) and (max-width:991px) {
    .hidden-sm {
        display: none !important
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .hidden-md {
        display: none !important
    }
}

@media (min-width:1200px) {
    .hidden-lg {
        display: none !important
    }
}

* {
    box-sizing: border-box
}

.normal-cursor {
    cursor: auto
}

.cf:after {
    clear: both;
    content: " ";
    display: block;
    font-size: 0;
    height: 0;
    visibility: hidden
}

.lang-disables-italic .als-alert,
.lang-disables-italic .cg-post-quote-content,
.lang-disables-italic .cg-post-reply-bottom,
.lang-disables-italic .crp-detail-case p,
.lang-disables-italic .note-content,
.lang-disables-italic .quote-widget-content,
.lang-disables-italic .user-review-intervention,
.lang-disables-italic blockquote p,
.lang-disables-italic em,
.lang-disables-italic i {
    font-style: normal !important
}

@font-face {
    font-display: swap;
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 100 900;
    src: url(../fonts/NotoSans/NotoSans-VariableFont_wdth,wght.ttf) format("truetype");
}

@font-face {
    font-display: swap;
    font-family: Noto Sans;
    font-style: italic;
    font-weight: 100 900;
    src: url(../fonts/NotoSans/NotoSans-Italic-VariableFont_wdth,wght.ttf) format("truetype");
}

.my-m {
    margin-bottom: 16px;
    margin-top: 16px
}

.my-l {
    margin-bottom: 20px;
    margin-top: 20px
}

.my-xl {
    margin-bottom: 24px;
    margin-top: 24px
}

.my-xs {
    margin-bottom: 4px;
    margin-top: 4px
}

.my-xxs {
    margin-bottom: 2px;
    margin-top: 2px
}

.my-s {
    margin-bottom: 8px;
    margin-top: 8px
}

.my-xxl {
    margin-bottom: 48px;
    margin-top: 48px
}

.my-auto {
    margin-bottom: auto;
    margin-top: auto
}

.mx-auto {
    margin-right: auto
}

.ml-auto,
.mx-auto {
    margin-left: auto
}

.mr-auto {
    margin-right: auto
}

.gap-s {
    gap: 8px
}

@media (min-width:768px) {
    .sm\:ml-auto {
        margin-left: auto
    }

    .sm\:ml-s {
        margin-left: 8px
    }
}

.mx-s {
    margin-left: 8px;
    margin-right: 8px
}

.mx-xs {
    margin-left: 4px;
    margin-right: 4px
}

.mx-m {
    margin-left: 16px;
    margin-right: 16px
}

.mx-l {
    margin-left: 20px;
    margin-right: 20px
}

.mx-xxs {
    margin-left: 2px;
    margin-right: 2px
}

.mt-xxs {
    margin-top: 2px
}

.mt-xs {
    margin-top: 4px
}

.mt-s {
    margin-top: 8px
}

.mt-m {
    margin-top: 16px
}

.mt-l {
    margin-top: 20px
}

.mt-xl {
    margin-top: 24px
}

.mt-xxl {
    margin-top: 48px
}

.mr-xs {
    margin-right: 4px
}

.mr-s {
    margin-right: 8px
}

.mr-m {
    margin-right: 16px
}

.ml-m {
    margin-left: 16px
}

.ml-s {
    margin-left: 8px
}

.ml-xs {
    margin-left: 4px
}

.mb-xxs {
    margin-bottom: 2px
}

.mb-xs {
    margin-bottom: 4px
}

.mb-s {
    margin-bottom: 8px
}

.mb-m {
    margin-bottom: 16px
}

.mb-l {
    margin-bottom: 20px
}

.mb-xl {
    margin-bottom: 24px
}

.mb-xxl {
    margin-bottom: 48px
}

.px-s {
    padding-left: 8px;
    padding-right: 8px
}

.px-m {
    padding-left: 16px;
    padding-right: 16px
}

.py-m {
    padding-bottom: 16px;
    padding-top: 16px
}

.py-l {
    padding-bottom: 20px;
    padding-top: 20px
}

.py-xxl {
    padding-bottom: 48px;
    padding-top: 48px
}

.py-s {
    padding-bottom: 8px;
    padding-top: 8px
}

.my-32-res {
    margin: 24px 0
}

@media (min-width:992px) {
    .my-32-res {
        margin: 32px 0
    }
}

.mt-32-res {
    margin-top: 16px
}

@media (min-width:768px) {
    .mt-32-res {
        margin-top: 24px
    }
}

@media (min-width:1200px) {
    .mt-32-res {
        margin-top: 32px
    }
}

.my-16-res {
    margin: 8px 0
}

@media (min-width:768px) {
    .my-16-res {
        margin: 16px 0
    }
}

.mx-auto-res {
    margin: 0 8px
}

@media (min-width:768px) {
    .mx-auto-res {
        margin: 0 16px
    }
}

@media (min-width:992px) {
    .mx-auto-res {
        margin: 0 24px
    }
}

@media (min-width:1200px) {
    .mx-auto-res {
        margin: 0 auto
    }
}

@media (min-width:568px) {
    .sm\:px-s {
        padding-left: 8px;
        padding-right: 8px
    }
}

@media (min-width:992px) {
    .md\:px-0 {
        padding-left: 0;
        padding-right: 0
    }
}

@media (min-width:568px) {
    .sm\:px-0 {
        padding-left: 0;
        padding-right: 0
    }
}

@media (min-width:768px) {
    .sm\:my-xxl {
        margin-bottom: 48px;
        margin-top: 48px
    }
}

@media (min-width:568px) {
    .xs\:mx-auto {
        margin-left: auto;
        margin-right: auto
    }
}

@media (min-width:768px) {
    .sm\:mx-auto {
        margin-left: auto;
        margin-right: auto
    }

    .sm\:ml-xs {
        margin-left: 4px
    }
}

.mt-0 {
    margin-top: 0
}

:root {
    --color-primary-400: #5dd667;
    --color-primary-500: #44be4c;
    --color-primary-600: #2c8d33;
    --color-secondary-900: #4c1287;
    --color-secondary-800: #7528ab;
    --color-ui-link-light: #007dff;
    --color-ui-link-dark: #3498ff;
    --color-text-900: #1b2731;
    --color-text-600: #4b5a65;
    --color-bg-50: #edf2f7;
    --color-bg-100: #d6e1ea;
    --color-bg-200: #afc2cd;
    --color-bg-600: #4b5a65;
    --color-bg-800: #27343f;
    --color-bg-900: #1b2731;
    --color-bg-950: #131a21;
    --color-ui-black: #000;
    --color-ui-error-red: #ed3445;
    --color-btn-primary-hover: var(--color-primary-600)
}

.c-green {
    color: var(--color-primary-500) !important
}

.c-red {
    color: var(--color-ui-error-red) !important;
    fill: var(--color-ui-error-red) !important
}

.c-orange {
    color: #ed9c00 !important
}

.c-yellow {
    color: #f8b814 !important;
    fill: #f8b814 !important
}

.c-orange {
    color: #ed9c00
}

.link-blue,
a.link-blue {
    text-decoration: underline
}

.c-blue,
.link-blue,
a.link-blue {
    color: var(--color-ui-link-light)
}

.c-purple {
    color: var(--color-secondary-800);
    fill: var(--color-secondary-800) !important
}

.c-white,
.c-white a {
    color: #fff !important
}

.c-grey-4 {
    color: #a2aeb7
}

.c-grey-5 {
    color: #7b8c98
}

.c-grey-6 {
    color: var(--color-text-600)
}

.c-grey-7 {
    color: var(--color-text-900)
}

.c-grey-3 {
    color: #cdd6dd
}

.c-grey-2 {
    color: #e3e7ef
}

.c-grey-1 {
    color: #f0f3f7
}

svg.c-white {
    fill: #fff
}

svg.c-orange {
    fill: #ed9c00 !important
}

svg.c-black-40 {
    fill: var(--color-bg-200)
}

svg.c-green {
    fill: var(--color-primary-500) !important
}

svg.c-orange {
    fill: #ed9c00
}

svg.c-red {
    fill: var(--color-ui-error-red) !important
}

svg.c-blue {
    fill: var(--color-ui-link-light) !important
}

svg.c-grey-2 {
    fill: #e3e7ef
}

svg.c-grey-4 {
    fill: #a2aeb7
}

svg.c-grey-5 {
    fill: #7b8c98
}

svg.c-grey-6 {
    fill: var(--color-text-600)
}

svg.c-grey-7 {
    fill: var(--color-bg-900) !important
}

svg.c-yellow {
    fill: #fbee22
}

svg.c-grey-3 {
    fill: #cdd6dd
}

svg.c-grey-1 {
    fill: #f0f3f7
}

.bg-green {
    background: var(--color-primary-500)
}

.bg-grey-2 {
    background: #e3e7ef
}

.bg-purple {
    background: var(--color-secondary-800)
}

.c-green-linear-text {
    background: linear-gradient(90deg, #5dd667, #239f29);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent
}

.green-scroll-bg-grey-8,
.green-scroll-bg-grey-9 {
    scrollbar-color: var(--color-primary-500) var(--color-bg-900)
}


.hp-slider-header {
    align-items: center;
    display: flex;
    gap: 8px;
    margin-bottom: 14px;
    min-height: 36px
}

@media (min-width:992px) {
    .hp-slider-header {
        min-height: 40px
    }

    .hp-slider-header .btn {
        margin-right: 80px
    }
}

.hp-slider-header img {
    display: block
}

.hp-slider-header .tag-new {
    top: -12px
}

body {
    font-family: Noto Sans, sans-serif;
    padding-top: 40px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background: #f0f3f7;
    color: var(--color-text-900);
    font-size: 14px;
    line-height: 1.42857143;
    text-rendering: auto
}

@media (min-width:768px) {
    body {
        padding-top: 68px
    }
}

@media (max-height:650px) and (orientation:landscape) {
    body {
        padding-top: 0
    }
}

@media (min-width:992px) {
    body {
        padding-top: 83px
    }
}

body.overflow {
    background: #e3e7ef;
    height: 100%;
    overflow: hidden
}

svg {
    pointer-events: none
}

.svg-loader {
    overflow: hidden;
    position: absolute
}

.svg-loader,
.svg-loader svg {
    height: 0;
    width: 0
}

.bg-white {
    background: #fff
}

.bg-grey-1 {
    background: #f0f3f7;
    padding: 1px 0
}

.bg-wrapper {
    background: #f0f3f7;
    display: flow-root
}

@media (min-width:768px) {
    .col-main {
        margin: auto
    }
}

@media (min-width:1200px) {
    .col-main {
        max-width: 1200px
    }
}

.col-main-pad {
    padding: 0 12px
}

@media (min-width:568px) {
    .col-main-pad {
        margin-left: auto;
        margin-right: auto;
        padding: 0 16px
    }
}

@media (min-width:1200px) {
    .col-main-pad {
        max-width: 1200px
    }
}

.col-menu {
    margin: auto;
    position: relative;
    height: 100%
}

@media (min-width:1200px) {
    .col-menu {
        max-width: 1200px
    }
}

.col-responsive-pad {
    margin: auto;
    padding: 0 12px
}

@media (min-width:568px) {
    .col-responsive-pad {
        padding: 0 16px
    }
}

@media (min-width:1200px) {
    .col-responsive-pad {
        max-width: 1200px
    }
}

.col-text {
    margin: 0 auto;
    padding: 0 12px
}

@media (min-width:568px) {
    .col-text {
        padding: 0 16px
    }
}

@media (min-width:768px) {
    .col-text {
        margin: 0 auto;
        max-width: 832px
    }
}

.col-text-mx {
    margin: 20px auto
}

@media (min-width:768px) {
    .col-text-mx {
        margin: 50px auto
    }
}

.col-narrow {
    margin: auto;
    max-width: 1000px
}

.no-license-info {
    align-items: center;
    display: flex;
    font-family: Noto Sans, Sans-Serif;
    font-size: 12px;
    font-weight: 700;
    gap: 4px;
    line-height: 16px;
    margin: 8px
}

@media (min-width:768px) {
    .no-license-info {
        font-size: 16px;
        justify-content: center;
        line-height: 22px;
        margin: 4px 0 0
    }
}

.col-filter {
    background-color: #fff;
    background-position: 98% 30px;
    background-repeat: repeat-y;
    background-size: 19px 10px;
    box-shadow: 20px 0 74px 0 rgba(0, 0, 0, .32);
    height: calc(100% - 40px);
    left: 0;
    max-width: 400px;
    overflow: auto;
    position: fixed;
    top: 40px;
    transform: translateX(-120%);
    transition: all .23s ease-out;
    width: 90%;
    z-index: 2
}

@media (min-width:768px) {
    .col-filter {
        height: calc(100% - 68px);
        max-width: 460px;
        overflow: hidden;
        top: 68px
    }
}

@media (min-width:992px) {
    .col-filter {
        height: calc(100% - 84px);
        top: 84px
    }
}

.col-filter.active {
    transform: translateX(0)
}

.col-filter form {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    position: relative;
    row-gap: 8px
}

@media (min-width:1200px) {
    .col-filter-desktop {
        background: none;
        box-shadow: none;
        display: block;
        float: left;
        height: auto;
        overflow: visible;
        padding: 0;
        position: static;
        transform: none;
        transition: none;
        width: 25%
    }
}

@media (min-width:992px) {
    .col-filter-desktop .filter-mobile-bottom {
        display: none
    }
}

@media (min-width:1200px) {
    .col-filter-desktop .filter-mobile-top {
        display: none
    }
}

@media (min-width:992px) {
    .col-filter-desktop .filter {
        padding: 0
    }
}

@media (min-width:1200px) {
    .col-filter-desktop .filter {
        height: auto;
        margin-top: 20px
    }

    .col-filter-desktop .filter-group-heading .filter-arrow {
        margin: 0 16px 0 8px
    }
}

.lum-lightbox-inner img {
    max-height: 100vh !important;
    max-width: 100vw !important
}

.clickthroughlink-info {
    color: var(--color-ui-link-light);
    cursor: pointer;
    display: block;
    font-family: Noto Sans, sans-serif;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
    width: 100%
}

.clickthroughlink-info svg {
    margin-right: 5px
}

.clickthroughlink-info.white {
    color: #fff !important
}

.clickthroughlink-info.white svg {
    fill: #fff !important
}

.clickthroughlink-info.width-50 {
    width: 50% !important
}

button {
    background: transparent;
    border: none
}

.btn {
    align-items: center;
    -webkit-appearance: none;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-family: neo-sans, sans-serif;
    font-size: 14px;
    font-weight: 700;
    gap: 8px;
    justify-content: center;
    line-height: 20px;
    min-height: 42px;
    padding: 8px;
    position: relative;
    text-align: center;
    text-decoration: none;
    transition: all .2s
}

@media (min-width:568px) {
    .btn {
        font-size: 16px;
        line-height: 22px;
        min-height: 48px
    }
}

@media (min-width:992px) {
    .btn:hover {
        color: #fff;
        text-decoration: none
    }
}

.btn .loader {
    border-width: 3px;
    display: none;
    height: 20px;
    margin-right: 8px;
    width: 20px
}

.btn svg {
    fill: #fff;
    flex-shrink: 0;
    height: 18px;
    width: 18px
}

@media (min-width:568px) {
    .btn svg {
        height: 20px;
        width: 20px
    }
}

.btn.active .loader {
    display: inline-flex
}

.btn-width-xs {
    min-width: 142px
}

@media (min-width:568px) {
    .btn-width-s {
        min-width: 200px
    }
}

.btn-width-m {
    min-width: 280px
}

.btn-complaint {
    background-color: #ed7600;
    border: none
}

.btn-complaint:hover {
    background-color: #de6e00
}

.btn-green {
    background-color: var(--color-primary-500);
    border: none
}

.btn-green.active,
.btn-green:active,
.btn-green:focus,
.btn-green:hover {
    background: var(--color-btn-primary-hover)
}

.btn-green .loader {
    border: 2px solid #fff;
    border-left: 2px solid var(--color-primary-500);
    border-top: 2px solid var(--color-primary-500);
    height: 14px;
    width: 14px
}

.btn-green.active .loader {
    display: inline
}

.btn-red {
    background-color: var(--color-ui-error-red);
    border: none
}

.btn-red.active,
.btn-red:active,
.btn-red:focus,
.btn-red:hover {
    background: var(--color-ui-error-red)
}

.btn-red .loader {
    border-left: 2px solid var(--color-ui-error-red);
    border-top: 2px solid var(--color-ui-error-red)
}

.btn-red.active .loader {
    display: inline
}

.btn-grey {
    background-color: #a2aeb7;
    border: none
}

.btn-grey.active,
.btn-grey:active,
.btn-grey:focus,
.btn-grey:hover {
    background-color: #7b8c98
}

.btn-grey-disabled {
    background-color: #a2aeb7
}

.btn-grey-disabled:hover {
    cursor: default
}

.btn-purple {
    background-color: var(--color-secondary-800);
    border: none
}

.btn-purple.active,
.btn-purple:active,
.btn-purple:focus,
.btn-purple:hover {
    background: var(--color-secondary-900)
}

.btn-purple .loader {
    border: 2px solid #fff;
    border-left: 2px solid var(--color-secondary-800);
    border-top: 2px solid var(--color-secondary-800)
}

.btn-border-purple {
    border: 1px solid var(--color-secondary-800);
    color: var(--color-secondary-800)
}

.btn-border-purple.active,
.btn-border-purple:active,
.btn-border-purple:focus,
.btn-border-purple:hover {
    background: var(--color-secondary-800);
    color: #fff
}

.btn-border-purple.active svg,
.btn-border-purple:active svg,
.btn-border-purple:focus svg,
.btn-border-purple:hover svg {
    fill: #fff
}

.btn-border-purple svg {
    fill: var(--color-secondary-800)
}

.btn-border-green {
    border: 1px solid var(--color-primary-500);
    color: var(--color-primary-500)
}

.btn-border-green.active,
.btn-border-green:active,
.btn-border-green:focus,
.btn-border-green:hover {
    background: var(--color-primary-500);
    color: #fff
}

.btn-border-green.active svg,
.btn-border-green:active svg,
.btn-border-green:focus svg,
.btn-border-green:hover svg {
    fill: #fff
}

.btn-border-green svg {
    fill: var(--color-primary-500)
}

.btn-border-white {
    border: 1px solid #f0f3f7;
    color: #f0f3f7
}

.btn-border-white.active,
.btn-border-white:active,
.btn-border-white:focus,
.btn-border-white:hover {
    background: hsla(0, 0%, 100%, .1)
}

.btn-responsive {
    width: auto
}

@media (max-width:567px) {
    .btn-responsive {
        width: 100%
    }
}

.btn-width-full {
    display: flex;
    width: 100%
}

.btn-small {
    font-size: 12px;
    padding-bottom: 7px;
    padding-top: 7px
}

.btn-small i {
    font-size: .83em;
    margin-right: .5em
}

.btn-border {
    border-radius: 2px;
    cursor: pointer;
    display: inline-flex;
    font-weight: 700;
    text-align: center;
    text-decoration: none
}

.btn-border-dark {
    box-shadow: inset 0 0 0 1px var(--color-bg-800);
    color: var(--color-text-900)
}

.btn-border-dark svg {
    fill: var(--color-text-900)
}

.btn-border-dark:hover {
    background: var(--color-bg-800);
    color: #f0f3f7
}

.btn-border-dark:hover svg {
    fill: #f0f3f7
}

.btn-small-button-dark,
.btn-small-button-light {
    align-items: center;
    border: 1px solid var(--color-bg-600);
    border-radius: 2px;
    color: #e3e7ef;
    cursor: pointer;
    display: flex;
    font-family: Noto Sans, sans-serif;
    font-size: 14px;
    height: 36px;
    justify-content: center;
    line-height: 18px;
    min-height: 0;
    padding: 8px 16px;
    white-space: nowrap
}

.btn-small-button-dark:hover,
.btn-small-button-light:hover {
    background: rgba(123, 140, 152, .2)
}

.btn-small-button-dark svg,
.btn-small-button-light svg {
    height: 16px;
    width: 16px
}

.btn-small-button-dark:hover {
    background: rgba(123, 140, 152, .1);
    color: var(--color-primary-500)
}

.btn-small-button-dark:hover svg {
    fill: var(--color-primary-500)
}

.link-info {
    color: var(--color-ui-link-light);
    display: inline-block;
    font-family: Noto Sans, sans-serif;
    text-transform: none;
    white-space: nowrap
}

.main-header {
    background: var(--color-bg-900);
    box-shadow: 0 5px 10px rgba(0, 0, 0, .45);
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

@media (min-width:768px) {
    .main-header {
        height: 70px
    }
}

@media (min-width:992px) {
    .main-header {
        height: 83px
    }
}

@media (max-width:767px) {

    .main-header.is-open {
        position: static
    }
}

.main-header__absolute {
    left: 0;
    position: absolute;
    top: 0
}

.main-header-bg-variant-bc {
    display: none
}

@media (min-width:992px) {
    .main-header-bg-variant-bc {
        background: var(--color-bg-800);
        border-top: 1px solid var(--color-bg-600);
        bottom: 0;
        display: block;
        height: 32px;
        left: 0;
        position: absolute;
        width: 100%;
        z-index: 4
    }
}

.main-header-static .main-header {
    position: absolute
}

@media (max-height:650px) and (orientation:landscape) {
    .main-header-static .main-header {
        position: relative
    }
}

@media (orientation:portrait) {
    .main-header {
        position: fixed
    }
}

@media (min-height:650px) and (orientation:landscape) {
    .main-header {
        position: fixed
    }
}

.main-header-bg {
    background: var(--color-bg-900);
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

@media (max-height:650px) and (orientation:landscape) {
    body {
        padding-top: 0
    }

    .main-header {
        position: relative
    }
}

.cookies-policy-alert {
    background: var(--color-bg-600);
    bottom: 0;
    color: #fff;
    font-size: 12px;
    line-height: 14px;
    padding: 8px;
    position: fixed;
    text-align: left;
    z-index: 3000
}

.cookies-policy-alert svg {
    height: 14px;
    width: 14px
}

@media (min-width:1200px) {
    .cookies-policy-alert svg {
        height: 18px;
        width: 18px
    }
}

@media (min-width:992px) {
    .cookies-policy-alert {
        font-size: 14px;
        line-height: 17px;
        position: static;
        text-align: center;
        width: 100%
    }
}

.cookies-policy-alert a {
    color: #fff;
    text-decoration: underline
}

.no-commision-policy-bar {
    background: #d9ecff;
    font-size: 12px;
    line-height: 14px;
    padding: 8px 0;
    z-index: 3000
}

.no-commision-policy-bar-body {
    align-items: center;
    display: flex;
    gap: 8px;
    justify-content: space-between
}

.no-commision-policy-bar-body svg {
    flex-shrink: 0
}

.cookies-policy-alert-body {
    align-items: center;
    display: flex;
    justify-content: center;
    margin: auto;
    max-width: 1000px
}

.page-header {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding-left: 12px;
    position: relative;
    flex-wrap: wrap;
}

@media (min-width:568px) {
    .page-header {
        padding-left: 24px;
        flex-wrap: nowrap;
    }
}

@media (min-width:768px) {
    .page-header {
        margin: auto;
        padding-right: 16px;
    }
}

@media (min-width:1200px) {
    .page-header {
        max-width: 1200px;
        padding: 0 16px 0 48px
    }
}

.page-header-no-mobile-img {
    padding-right: 12px
}

@media (min-width:568px) {
    .page-header-no-mobile-img {
        padding-right: 24px
    }

    .page-header-no-mobile-img .page-header-heading {
        max-width: none
    }
}

.page-header-no-mobile-img .page-header-img {
    display: none
}

@media (min-width:768px) {
    .page-header-no-mobile-img .page-header-img {
        display: block
    }
}

.circles {
    height: calc(100% + 100px);
    width: 100%
}

.circles .circle-green {
    background: #2c8532;
    border-radius: 50%;
    box-shadow: 0 0 10px 5px #2c8532, 0 0 20px 10px #2c8532, 0 0 40px 20px #2c8532, 0 0 80px 40px #2c8532;
    height: 50px;
    left: -230px;
    opacity: .6;
    position: absolute;
    top: -70px;
    transform: rotate(45deg);
    width: 400px
}

@media (min-width:768px) {
    .circles .circle-green {
        box-shadow: 0 0 10px 5px #2c8532, 0 0 20px 10px #2c8532, 0 0 40px 20px #2c8532, 0 0 80px 40px #2c8532, 0 0 160px 100px #2c8532;
        left: -300px;
        top: -134px;
        width: 600px
    }
}

.circles .circle-green-single {
    left: 40%;
    top: -50px;
    transform: translateX(-50%) rotate(45deg)
}

@media (min-width:992px) {
    .circles .circle-green-single {
        left: -300px;
        top: -134px;
        transform: rotate(45deg)
    }
}

.circles .circle-purple {
    background: #9539c7;
    border-radius: 50%;
    bottom: -290px;
    box-shadow: 0 0 10px 5px #9539c7, 0 0 20px 10px #9539c7, 0 0 40px 20px #9539c7, 0 0 80px 40px #9539c7;
    height: 50px;
    opacity: .5;
    position: absolute;
    right: -170px;
    transform: rotate(45deg);
    width: 300px
}

@media (min-width:568px) {
    .circles .circle-purple {
        bottom: auto;
        top: -70px;
        transform: rotate(135deg)
    }
}

@media (min-width:768px) {
    .circles .circle-purple {
        box-shadow: 0 0 10px 5px #9539c7, 0 0 20px 10px #9539c7, 0 0 40px 20px #9539c7, 0 0 80px 40px #9539c7, 0 0 160px 100px #9539c7;
        right: -330px;
        top: -140px;
        width: 600px
    }
}

.page-header-expand {
    margin-top: 4px;
    position: relative;
    text-align: center;
    z-index: 2
}

@media (min-width:992px) {
    .page-header-expand {
        margin-top: 8px
    }
}

.page-header-expand:hover {
    cursor: pointer
}

.page-header-expand:hover svg {
    fill: var(--color-primary-500)
}

.page-header-expand svg {
    fill: #a2aeb7
}

.page-header-heading {
    overflow: hidden;
    padding: 16px 0;
    position: relative;
    z-index: 1
}

@media (min-width:568px) {
    .page-header-heading {
        max-width: 360px;
        padding: 24px 0
    }
}

@media (min-width:768px) {
    .page-header-heading {
        flex: 0 0 50%;
        max-width: none;
        padding: 48px 32px 48px 0
    }
}

@media (min-width:1200px) {
    .page-header-heading {
        flex: 0 0 calc(50% - 32px);
        padding: 64px 32px 64px 0;
        text-align: left
    }
}

.page-header-heading .desc {
    font-family: neo-sans, sans-serif;
    font-size: 14px;
    font-style: normal;
    line-height: 18px;
    margin: 8px 0 0
}

@media (min-width:992px) {
    .page-header-heading .desc {
        font-size: 16px;
        line-height: 22px;
        margin: 16px 0 0
    }
}

.page-header-heading .btn {
    margin: 16px 0 0
}

@media (min-width:568px) {
    .page-header-heading .btn {
        margin-top: 24px
    }
}

.page-header-heading p {
    margin: 8px 0 18px
}

@media (min-width:768px) {
    .page-header-heading p {
        margin: 8px 0 24px
    }
}

.page-header-authors {
    align-items: center;
    color: #cdd6dd;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px
}

@media (min-width:768px) {
    .page-header-authors {
        gap: 16px
    }
}

.page-header-authors .dot {
    background: hsla(0, 0%, 100%, .2);
    border-radius: 50%;
    display: block;
    height: 4px;
    width: 4px
}

@media (min-width:768px) {
    .page-header-authors .icon {
        height: 20px;
        width: 20px
    }
}

.page-header-author,
.page-header-authors .date-wrapper {
    align-items: center;
    display: flex;
    gap: 8px
}

.page-header-author {
    font-size: 14px;
    line-height: 20px;
    text-shadow: -2px 2px 4px rgba(0, 0, 0, .34)
}

@media (min-width:768px) {
    .page-header-author {
        font-size: 16px;
        line-height: 22px
    }
}

.page-header-author .avatar img {
    height: 16px;
    width: 16px
}

@media (min-width:768px) {
    .page-header-author .avatar img {
        height: 20px;
        width: 20px
    }
}

.page-header-author .avatar {
    border: 1px solid var(--color-primary-500);
    border-radius: 50%;
    box-shadow: -2px 2px 4px 0 rgba(0, 0, 0, .34);
    display: flex;
    position: relative
}

.page-header-author .badge {
    position: absolute;
    right: -8px;
    top: -4px;
    z-index: 3
}

.page-header-author-main .avatar img {
    height: 20px;
    width: 20px
}

@media (min-width:768px) {
    .page-header-author-main .avatar img {
        height: 24px;
        width: 24px
    }
}

.page-header-avatars {
    align-items: center;
    display: flex
}

.page-header-main-author-popup .author-description,
.page-header-main-author-popup .btn {
    margin-top: 12px
}

@media (min-width:992px) {

    .page-header-main-author-popup .author-description,
    .page-header-main-author-popup .btn {
        margin-top: 16px
    }
}

.author-row {
    align-items: center;
    color: var(--color-text-900);
    display: flex;
    font-size: 14px;
    gap: 8px;
    line-height: 20px
}

.author-row .author-avatar {
    margin-right: 10px
}

.author-row .avatar {
    border: 2px solid var(--color-primary-500);
    border-radius: 50%;
    box-shadow: -2px 2px 4px 0 rgba(0, 0, 0, .34);
    display: flex;
    position: relative
}

.author-row .badge {
    position: absolute;
    right: -4px;
    top: -4px;
    z-index: 3
}

@media (min-width:768px) {
    .author-row .badge {
        right: -6px;
        top: -6px
    }

    .page-header-main-author-popup .author-row .badge {
        height: 28px;
        width: 28px
    }
}

.author-row .author-name {
    font-family: neo-sans, sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 24px
}

.author-row .author-position {
    line-height: 20px;
    margin-top: 4px
}

.author-row .author-type {
    margin-bottom: 4px
}

.contributors {
    align-items: center;
    display: flex;
    font-size: 14px;
    gap: 8px;
    line-height: 20px
}

@media (min-width:768px) {
    .contributors {
        font-size: 16px;
        line-height: 22px
    }
}

.contributors-avatars {
    display: flex;
    margin-left: 16px
}

.contributors-avatars .avatar {
    border: none;
    margin-left: -8px
}

@media (min-width:768px) {
    .contributors-avatars .avatar {
        margin-left: -16px
    }
}

.contributors-popup .arrow {
    fill: #a2aeb7
}

.contributors-popup .author-info {
    flex: 1 0
}

.contributors-popup .author-row {
    gap: 12px;
    padding: 8px
}

.contributors-popup .author-row:hover {
    background: rgba(123, 140, 152, .1)
}

.contributors-popup .author-row:hover .arrow {
    fill: var(--color-text-900)
}

.contributors-popup .author-name {
    font-size: 16px;
    line-height: 22px
}

.page-header-expandable .desc {
    color: #fff;
    margin-top: 0;
    max-height: 60px;
    overflow: hidden;
    position: relative;
    transition: max-height .3s ease-in-out
}

@media (min-width:568px) {
    .page-header-expandable .desc {
        max-height: 62px
    }
}

@media (min-width:768px) {
    .page-header-expandable .desc {
        max-height: 80px
    }
}

.page-header-expandable .desc a {
    color: var(--color-primary-500)
}

.page-header-expandable .desc a:hover {
    text-decoration: underline
}

.page-header-expandable .toggle .desc {
    max-height: 1000px
}

.page-header-expandable .toggle .desc:before {
    opacity: 0;
    transform: scaleY(.1);
    transform-origin: bottom
}

.page-header-expandable .toggle .page-header-expand {
    transform: rotateX(180deg)
}

.page-header-img {
    aspect-ratio: 2 / 1;
    overflow: hidden;
    position: relative;
    width: 100%;
    z-index: 2
}

@media (min-width:568px) {
    .page-header-img {
        aspect-ratio: 2 / 1;
        width: 100%
    }
}

@media (min-width:768px) {
    .page-header-img {
        aspect-ratio: auto;
        flex: 0 0 50%;
        max-height: 280px;
        width: auto
    }
}

.page-header-img img {
    display: block;
    height: auto;
    margin: 0;
    width: 100%
}

@media (min-width:568px) {
    .page-header-img img {
        height: 100%;
        object-fit: cover;
        width: 100%
    }
}

.page-header-img picture {
    align-items: center;
    display: flex;
    height: 160px;
    margin: auto;
    width: 160px
}

@media (min-width:568px) {
    .page-header-img picture {
        height: 160px;
        width: 160px
    }
}

@media (min-width:768px) {
    .page-header-img picture {
        height: 200px;
        width: auto
    }
}

@media (min-width:992px) {
    .page-header-img picture {
        width: 400px
    }
}

.heading-margin-wrapper {
    margin: 32px 0;
    text-align: center
}

.heading-margin-wrapper .neo-fs-32 {
    color: var(--color-text-900);
    display: inline-block;
    margin: 0 16px;
    padding: 0 0 5px
}

@media (min-width:568px) {
    .heading-margin-wrapper .neo-fs-32 {
        margin: auto;
        max-width: 500px
    }
}

@media (min-width:768px) {
    .heading-margin-wrapper .neo-fs-32 {
        max-width: 550px
    }
}

@media (min-width:992px) {
    .heading-margin-wrapper .neo-fs-32 {
        max-width: 750px
    }
}

.heading-margin-wrapper.on-dark-bg .neo-fs-32 {
    color: #fff
}

@media (min-width:768px) {
    .heading-margin-wrapper.on-dark-bg {
        margin: 50px 0
    }
}

@media (min-width:992px) {
    .heading-margin-wrapper.on-dark-bg {
        margin: 70px 0
    }
}

.heading-margin-wrapper p {
    color: #7b8c98;
    font-size: 15px;
    line-height: 21px;
    margin: 20px auto
}

@media (min-width:568px) {
    .heading-margin-wrapper p {
        max-width: 500px
    }
}

@media (min-width:768px) {
    .heading-margin-wrapper p {
        max-width: 620px
    }
}

@media (min-width:992px) {
    .heading-margin-wrapper p {
        max-width: 750px
    }
}

.page-footer {
    background: var(--color-bg-900);
    color: #cdd6dd;
    margin-top: 32px;
    overflow: hidden;
    padding: 16px;
    position: relative;
    width: 100%
}

@media (min-width:992px) {
    .page-footer {
        margin-top: 64px
    }
}

.page-footer .logo-guru {
    display: block;
    margin-bottom: 16px
}

@media (min-width:568px) {
    .page-footer .logo-guru {
        align-items: flex-start;
        display: flex;
        flex: 0 0 50%
    }
}

.page-footer .logo-guru img {
    display: block
}

.theme-dark .page-footer {
    margin-top: 0
}

.footer-col-label {
    color: #a2aeb7;
    display: block;
    font-family: Noto Sans, Sans-Serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    margin: 16px 0 8px;
    text-transform: uppercase
}

@media (min-width:568px) {
    .footer-col-label {
        margin: 16px 0
    }
}

@media (min-width:768px) {
    .footer-col-label {
        margin: 24px 0 16px
    }
}

.page-footer-games {
    margin-top: 0
}

.page-footer-cols {
    display: flex;
    flex-wrap: wrap;
    width: 100%
}

@media (min-width:568px) {
    .page-footer-cols .footer-col-1-4:nth-child(2n) {
        border-left: 1px solid var(--color-bg-600);
        padding-left: 16px
    }
}

@media (min-width:992px) {
    .page-footer-cols .footer-col-1-4:nth-child(2n) {
        padding-left: 24px
    }
}

@media (min-width:768px) {
    .page-footer-cols .footer-col-1-4:nth-child(3n+2) {
        border-left: 1px solid var(--color-bg-600);
        padding-left: 16px
    }
}

@media (min-width:992px) {
    .page-footer-cols .footer-col-1-4:nth-child(3n+2) {
        padding-left: 24px
    }
}

.page-footer-cols a:hover span {
    text-decoration: underline
}

.page-footer-cols .shrink-icon,
.page-footer-cols .shrink-icon svg {
    height: 18px;
    width: 18px
}

.footer-col-1-4 {
    border-top: 1px solid var(--color-bg-600);
    flex: 1 1 100%;
    font-size: 14px;
    line-height: 18px;
    padding: 0 16px 16px 0
}

@media (min-width:568px) {
    .footer-col-1-4 {
        flex: 1 1 50%;
        order: 4
    }
}

@media (min-width:768px) {
    .footer-col-1-4 {
        flex: 1 1 25%
    }
}

@media (min-width:992px) {
    .footer-col-1-4 {
        padding: 0 24px 24px 0
    }

    .footer-col-1-4:first-child {
        max-width: 40%
    }
}

.footer-col-about {
    flex: 1 1 100%;
    order: 4
}

@media (min-width:768px) {
    .footer-col-about {
        flex: 0 1 33.3%
    }
}

@media (min-width:992px) {
    .footer-col-about {
        flex: 1 0 auto
    }
}

.cg-footer-col-social {
    border-top: 1px solid var(--color-bg-600);
    flex: 1 1 100%;
    padding: 16px 0
}

@media (min-width:568px) {
    .cg-footer-col-social {
        border: none;
        display: flex;
        flex: 1 1 50%;
        justify-content: flex-end;
        order: 2;
        padding: 0
    }
}

.cg-footer-col-social label {
    color: #a2aeb7;
    display: block;
    font-family: Noto Sans, Sans-Serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    margin-bottom: 8px;
    text-transform: uppercase
}

.cg-page-footer-social {
    align-items: center;
    display: flex
}

@media (min-width:568px) {
    .cg-page-footer-social {
        justify-content: flex-end;
        order: 3
    }
}

.cg-page-footer-social a {
    display: block;
    margin: 0 12px 0 0
}

@media (min-width:768px) {
    .cg-page-footer-social a {
        margin: 0 16px 0 0
    }
}

.cg-page-footer-social a:hover svg {
    fill: var(--color-primary-500)
}

.cg-page-footer-social svg {
    display: block
}

.footer-col-partners {
    flex: 0 0 100%
}

@media (min-width:568px) {
    .footer-col-partners {
        display: flex;
        order: 6
    }
}

.footer-col-partners .arrow {
    fill: #cdd6dd;
    position: absolute;
    right: 0;
    top: 16px
}

@media (min-width:568px) {
    .footer-col-partners .arrow {
        right: 16px
    }
}

.footer-col-partners img {
    display: block;
    margin-bottom: 8px
}

.footer-col-partners .guru-academy {
    border-top: 1px solid var(--color-bg-600);
    color: #cdd6dd;
    display: block;
    padding-bottom: 16px;
    position: relative
}

@media (min-width:568px) {
    .footer-col-partners .guru-academy {
        border-right: 1px solid var(--color-bg-600);
        flex: 0 0 calc(50% + 1px);
        padding-right: 16px
    }
}

.footer-col-partners .guru-academy:hover .arrow {
    fill: var(--color-primary-500)
}

.footer-col-partners .guru-self-exclusion {
    border-top: 1px solid var(--color-bg-600);
    color: #cdd6dd;
    display: block;
    padding-bottom: 16px;
    position: relative
}

.footer-col-partners .guru-self-exclusion:hover .arrow {
    fill: var(--color-primary-500)
}

@media (min-width:568px) {
    .footer-col-partners .guru-self-exclusion {
        flex: 0 0 calc(50% - 1px);
        padding-left: 16px
    }
}

@media (min-width:768px) {
    .footer-col-partners .guru-self-exclusion {
        padding-bottom: 24px;
        padding-left: 24px
    }
}



















@media (min-width:768px) {
    .homepage-wrapper .search-box-wrapper {
        margin: 40px 0
    }
}

















.header-search-wrapper {
    align-items: center;
    background: var(--color-bg-900);
    display: flex;
    flex: 1;
    height: 100%;
    left: calc(100% - 4px);
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 11
}

@media (min-width:568px) {
    .header-search-wrapper {
        height: auto;
        position: static;
        width: auto
    }
}

.header-search-wrapper.expanded {
    transform: translateX(-100%)
}

.header-search-wrapper .header-search-close {
    background: var(--color-bg-900);
    padding: 0 8px
}

@media (min-width:568px) {
    .header-search-wrapper .header-search-close {
        display: none
    }
}

.header-search {
    border: 1px solid var(--color-bg-600);
    border-radius: 2px;
    display: flex;
    flex: 1;
    margin-left: 8px;
    min-width: 0
}

.header-search .header-search-input {
    border: none;
    border-radius: 2px 0 0 2px;
    flex: 1;
    font-size: 16px;
    height: 30px;
    line-height: 18px;
    margin: 0;
    min-width: 0;
    padding-left: 16px
}

@media (min-width:992px) {
    .header-search .header-search-input {
        height: 34px
    }
}

.header-search .menu-link-search {
    border-radius: 0 2px 2px 0;
    display: none;
    margin: 0;
    padding: 6px 16px
}

@media (min-width:568px) {
    .header-search .menu-link-search {
        display: flex
    }
}

.header-search-close {
    cursor: pointer;
    padding: 0 6px
}
























.search-result-type {
    border: 1px solid var(--color-bg-600);
    border-radius: 2px;
    color: var(--color-text-600);
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px;
    margin-left: 8px;
    padding: 0 4px
}

.avatar {
    border-radius: 50%;
    overflow: hidden
}

.avatar.moderator {
    background: #b3f0b8
}

.avatar-small,
.avatar-small img {
    display: block;
    height: 18px;
    margin-right: 8px;
    object-fit: cover;
    width: 18px
}

svg.avatar-man {
    background: #a7c9eb
}

svg.avatar-woman {
    background: #d4d2ed
}

svg.avatar-unspecified {
    background: var(--color-bg-50)
}

.menu-badge {
    align-items: center;
    align-self: flex-start;
    cursor: pointer;
    display: flex;
    filter: drop-shadow(0 4px 4px rgba(0, 0, 0, .25));
    height: 100%;
    justify-content: center;
    margin-left: 8px;
    position: relative;
    width: 36px;
    z-index: 5
}

@media (min-width:992px) {
    .menu-badge {
        margin-left: 16px
    }
}

.menu-badge svg {
    position: absolute;
    z-index: 5
}

@media (min-width:768px) {
    .menu-badge svg {
        height: 70px;
        top: -6px
    }
}

@media (min-width:992px) {
    .menu-badge svg {
        height: 84px
    }
}

.menu-badge:after {
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8px), 50% 100%, 0 calc(100% - 8px));
    content: "";
    height: calc(100% + 16px);
    position: absolute;
    width: 100%;
    z-index: 1
}

@media (min-width:768px) {
    .menu-badge:after {
        height: 76px;
        top: -6px
    }
}

@media (min-width:992px) {
    .menu-badge:after {
        height: 92px
    }
}

.menu {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    height: 40px;
    justify-content: space-between;
    padding: 8px;
    height: 100%;
}




.menu .search-box-results-wrapper {
    position: relative;
    width: 100%
}

@media (min-width:768px) {
    .menu .menu-active-info {
        display: none
    }
}

.menu .menu-active-info .btn {
    display: none
}

@media (min-width:768px) {
    .menu:has(.menu-badge) .menu-collapse {
        padding: 0 40px 0 8px
    }

    .menu:has(.menu-badge) .menu-collapse:after {
        right: 52px
    }
}

.menu-logo {
    margin-left: 8px;
    margin-right: auto;
    position: relative;
    z-index: 5
}

@media (min-width:568px) {
    .menu-logo {
        overflow: hidden;
    }
}

@media (min-width:768px) {
    .menu-logo {
        height: auto;
        margin: 0 4px 4px 8px;
        overflow: hidden;
        position: relative;
        width: auto
    }
}

@media (min-width:992px) {
    .menu-logo {
        margin: 0 8px;
        overflow: visible;
        width: auto
    }
}

.menu-logo a,
.menu-logo svg {
    display: block
}

.menu-logo img {
    display: block;
    height: 32px;
    overflow: hidden;
    width: auto
}

@media (min-width:568px) {
    .menu-logo img {
        height: 38px
    }
}

@media (min-width:992px) {
    .menu-logo img {
        height: 40px
    }
}

.menu-right {
    position: relative;

    align-items: center;
    display: flex;
    height: 100%
}


.menu-user {
    display: flex;
    height: 100%;
    z-index: 2
}

@media (min-width:768px) {
    .menu-user {
        display: block;
        height: 18px
    }
}

.menu-user .avatar {
    border: 1px solid #fff;
    border-radius: 50%;
    height: 20px;
    margin-bottom: -3px;
    margin-right: 0;
    margin-top: -3px;
    object-fit: cover;
    width: 20px
}

@media (min-width:992px) {
    .menu-user .avatar {
        height: 23px;
        margin-right: 10px;
        width: 23px
    }
}

.menu-user .email {
    align-items: center;
    cursor: pointer;
    display: flex;
    font-family: neo-sans, sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 18px
}

@media (min-width:992px) {
    .menu-user .email {
        font-size: 14px
    }
}

.menu-user .email span {
    display: block;
    display: none;
    max-width: 130px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

@media (min-width:992px) {
    .menu-user .email span {
        display: inline
    }
}

.menu-user .email svg {
    fill: #fff
}

.menu-user:hover .menu-user-logged,
.menu-user:hover .menu-user-notifications {
    transform: translateY(0)
}

.menu-right-btn {
    border: 1px solid var(--color-bg-600);
    border-radius: 2px;
    height: 26px;
    padding: 4px 6px;
    font-size: 12px;
    background-color: #fc2626;
    display: flex;
    align-items: center;
    font-weight: 600;
    transition: background-color 0.2s ease;
}

.menu-right-btn span {
    color: #fff;
}

.menu-right-btn:hover {
    background-color: #c41e2e;
}

@media (min-width:768px) {
    .menu-right-btn {
        height: 30px;
        padding: 6px 10px;
        font-size: 13px
    }
}

@media (min-width:992px) {
    .menu-right-btn {
        height: 36px;
        padding: 10px 16px;
        font-size: inherit
    }
}

.menu-right-btn .separator {
    background: var(--color-bg-600);
    display: none;
    margin: -8px 8px;
    width: 1px
}

@media (min-width:568px) {
    .menu-right-btn .separator {
        display: block
    }
}

@media (min-width:992px) {
    .menu-right-btn .separator {
        margin: -10px 10px
    }
}

.menu-user-logged {
    background: #fff;
    border-radius: 2px;
    width: 100%
}

@media (min-width:568px) {
    .menu-user-logged {
        width: 336px
    }
}

@media (min-width:992px) {
    .menu-user-logged {
        left: 0
    }
}

.menu-user-logged .menu-user-login {
    color: #7b8c98;
    display: block;
    font-family: neo-sans, sans-serif;
    font-size: 14px;
    overflow: hidden;
    padding: 5px 20px;
    position: relative;
    text-overflow: ellipsis
}

@media (min-width:992px) {
    .menu-user-logged .menu-user-login {
        display: none
    }
}

.menu-user-logged .avatar-with-name {
    color: var(--color-text-900)
}

.menu-user-logged .avatar-with-name img,
.menu-user-logged .avatar-with-name svg {
    height: 18px;
    min-width: 18px;
    width: 18px
}

.menu-user-logged .avatar-with-name span {
    display: block;
    font-family: Noto Sans, sans-serif;
    font-size: 14px;
    font-weight: 700
}

.menu-user-logged .menu-user-avatar-with-name {
    align-items: center;
    background: linear-gradient(0deg, rgba(123, 140, 152, .1), rgba(123, 140, 152, .1)), #fff;
    color: var(--color-text-900);
    display: flex;
    margin: -16px -16px 16px;
    padding: 8px
}

@media (min-width:768px) {
    .menu-user-logged .menu-user-avatar-with-name {
        display: none;
        margin: -24px -24px 16px
    }
}

.menu-user-logged .menu-user-avatar-with-name img,
.menu-user-logged .menu-user-avatar-with-name svg {
    height: 18px;
    min-width: 18px;
    width: 18px
}

.menu-user-logged .menu-user-avatar-with-name span {
    display: block;
    font-family: Noto Sans, sans-serif;
    font-size: 14px;
    font-weight: 700
}

.menu-user-logged .popup-modal-exit-button {
    height: 13px;
    position: absolute;
    right: 16px;
    top: 16px;
    width: 13px
}

@media (min-width:992px) {
    .menu-user-logged .popup-modal-exit-button {
        right: 24px;
        top: 24px
    }
}

.menu-user-logged .popup-modal-exit-button img,
.menu-user-logged .popup-modal-exit-button svg {
    fill: #a2aeb7
}

.menu-user-logged .popup-modal-exit-button img:hover,
.menu-user-logged .popup-modal-exit-button svg:hover {
    fill: var(--color-text-600)
}

.menu-user-logged .sans {
    font-family: neo-sans, sans-serif;
    font-size: 16px;
    line-height: 20px
}

.menu-user-logged>a {
    align-items: center;
    color: var(--color-text-600);
    display: flex;
    font-size: 14px;
    font-weight: 700;
    justify-content: center;
    line-height: 19px;
    margin-bottom: 8px;
    overflow: hidden;
    padding: 8px;
    position: relative
}

.menu-user-logged>a:hover {
    background: #f0f3f7;
    border-radius: 2px;
    color: var(--color-text-900)
}

.menu-user-logged>a:hover svg {
    fill: var(--color-text-900)
}

.menu-user-logged>a:last-child {
    margin-bottom: -8px
}

.menu-user-logged .logout-link {
    border-top: 1px solid #cdd6dd;
    margin-bottom: 8px
}

.menu-user-logged svg {
    fill: var(--color-text-600);
    margin-right: 8px
}

.menu-link {
    align-items: center;
    color: #fff;
    display: flex;
    flex: 1;
    font-family: neo-sans, sans-serif;
    font-size: 16px;
    font-weight: 700;
    gap: 16px;
    justify-content: flex-start;
    line-height: 20px;
    overflow: hidden;
    padding: 16px 24px;
    position: relative;
    text-align: left;
    text-decoration: none
}

@media (min-width:768px) {
    .menu-link {
        border: none;
        flex: 0 auto;
        font-size: 14px;
        gap: 4px;
        padding: 9px 8px 8px;
        position: relative;
        white-space: nowrap
    }

    .menu-link:after {
        background: var(--color-primary-500);
        bottom: 0;
        content: "";
        height: 5px;
        left: 0;
        position: absolute;
        transform: translateX(-101%);
        transition: transform .2s ease-in-out;
        width: 100%
    }

    .menu-link .menu-icon {
        display: none
    }
}

@media (min-width:992px) {
    .menu-link {
        padding: 9px 8px 8px
    }

    .menu-link .menu-icon {
        display: block
    }
}

@media (min-width:1200px) {
    .menu-link {
        cursor: pointer
    }
}

.menu-link svg {
    flex-shrink: 0
}

.menu-link .icon-arrow {
    height: 16px;
    width: 16px
}

@media (min-width:768px) {
    .menu-link .icon-arrow {
        display: none
    }
}

.menu-link:focus {
    color: #fff;
    text-decoration: none
}

.menu-link:hover {
    color: var(--color-primary-500)
}

.menu-link.is-active .icon-arrow {
    transform: rotate(-180deg)
}

.menu-link svg {
    fill: var(--color-primary-500)
}

.tag-new {
    color: #f8ea14;
    font-family: neo-sans, sans-serif;
    font-size: 8px;
    position: absolute;
    right: -10px;
    text-transform: uppercase;
    top: -10px
}

@media (min-width:768px) {
    .menu-link-user {
        display: none
    }
}

.menu-link-email {
    max-width: 130px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.menu-link-search {
    align-items: center;
    border: 1px solid var(--color-bg-600);
    border-radius: 2px;
    cursor: pointer;
    display: flex;
    height: 32px;
    margin-left: 4px;
    padding: 8px
}

@media (min-width:568px) {
    .menu-link-search {
        border: none;
        height: auto
    }
}

.menu-link-search:hover svg {
    fill: var(--color-primary-500)
}

.menu-nav {
    background: var(--color-bg-800);
    padding: 8px 0
}

@media (min-width:768px) {
    .menu-nav {
        align-items: center;
        display: flex;
        flex: 1;
        height: 100%;
        margin: 0 0 0 -8px;
        overflow: auto;
        -ms-overflow-style: none;
        padding: 0;
        scrollbar-width: none
    }

    .menu-nav::-webkit-scrollbar {
        display: none
    }
}

.menu-nav .active>a {
    color: var(--color-primary-500);
    position: relative
}

@media (min-width:768px) {
    .menu-nav .active>a:before {
        background: var(--color-primary-500);
        bottom: 0;
        content: "";
        height: 4px;
        left: 0;
        position: absolute;
        width: 100%
    }
}

.menu-collapse {
    background: var(--color-bg-900);
    box-shadow: 20px 0 74px 0 rgba(0, 0, 0, .32);
    flex: 0 0 100%;
    height: calc(100% - 40px);
    left: 0;
    max-width: 320px;
    overflow: auto;
    position: fixed;
    top: 40px;
    transform: translateX(-150%);
    transition: all .23s ease-out;
    width: 80%
}

@media (min-width:768px) {
    .menu-collapse {
        align-items: center;
        background: transparent;
        box-shadow: none;
        display: flex;
        height: 28px;
        max-width: none;
        overflow: hidden;
        padding: 0 0 0 8px;
        position: static;
        transform: none;
        width: auto
    }
}

@media (min-width:992px) {
    .menu-collapse {
        height: 31px;
        margin-top: 8px
    }
}

@media (min-width:768px) {
    .menu-collapse:after {
        background: linear-gradient(90deg, transparent, #19232c);
        content: "";
        height: 30px;
        position: absolute;
        right: 8px;
        width: 10px;
        z-index: 1000
    }
}

@media (min-width:992px) {
    .menu-collapse:after {
        background: linear-gradient(90deg, transparent, #27343f)
    }
}

.menu-collapse.is-active {
    transform: translateX(0)
}

@media (min-width:768px) {
    .menu-collapse.is-active {
        height: 100%
    }

    .menu-collapse li {
        display: flex;
        height: 100%
    }
}

.menu-collapse-bottom {
    margin: 8px 0;
    padding: 0 8px 16px
}

.menu-collapse-bottom .menu-item,
.menu-collapse-bottom a {
    color: #fff;
    display: block;
    font-family: neo-sans, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
    margin: 0;
    padding: 16px
}

@media (min-width:768px) {
    .menu-collapse-bottom {
        height: 1px;
        left: -9999px;
        overflow: hidden;
        position: absolute;
        top: auto;
        width: 1px
    }
}

.menu-collapse-bottom .cg-page-footer-social {
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-start
}

.menu-collapse-bottom .cg-page-footer-social a {
    padding: 8px
}

.menu-collapse-bottom .cg-page-footer-social svg {
    height: 32px;
    width: 32px
}

.menu-icon-label {
    background: none;
    border: 0;
    color: #fff;
    height: 40px;
    margin-left: -8px;
    min-width: 40px;
    padding: 0;
    position: relative;
    top: -4px;
    width: 40px;
    z-index: 5
}

@media (min-width:768px) {
    .menu-icon-label {
        top: 0
    }
}

.menu-icon-label:hover {
    cursor: pointer
}

@media (min-width:768px) {
    .menu-icon-label {
        display: none
    }
}

.menu-icon-label .close {
    display: none
}

.menu-icon-label .open {
    display: block
}

.modal-open .menu-icon-label .open {
    display: none
}

.modal-open .menu-icon-label .close {
    display: block
}

.menu-icon-wrapper {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.opacity-80 {
    opacity: .7 !important
}

.menu-expandable-user {
    border-radius: 2px;
    filter: drop-shadow(0 4px 8px rgba(29, 39, 48, .16));
    text-align: center
}

.menu-expandable-user img {
    margin-right: 8px
}

.menu-expandable-user hr {
    background: #cdd6dd;
    border: none;
    height: 1px;
    margin: 0 -8px 8px
}

@media (min-width:568px) {
    .menu-expandable-user-narrow {
        max-width: 189px;
        text-align: left
    }
}

@media (min-width:992px) {
    .menu-expandable-user-narrow {
        max-width: 189px;
        text-align: left
    }
}

.menu-expandable-user-narrow a {
    justify-content: start;
    margin: 0 -8px 8px
}

.menu-expandable-user-narrow a:first-of-type {
    margin-top: -8px
}

.sgw-toolbar-wrapper {
    position: relative;
    z-index: 5
}

@media (min-width:768px) {
    .sgw-toolbar-wrapper {
        margin: auto;
        max-width: 1200px;
        z-index: 2003
    }
}

.sgw-toolbar-outside {
    display: block;
    position: relative
}

@media (min-width:768px) {
    .sgw-toolbar-outside {
        z-index: 2001
    }
}

.sgw-toolbar {
    align-items: center;
    color: #f18b25;
    display: flex;
    font-weight: 700
}

@media (min-width:992px) {
    .sgw-toolbar {
        height: 32px
    }
}

.sgw-toolbar.menu-link:hover {
    color: #f18b25
}

.sgw-toolbar.menu-link svg {
    fill: #f18b25
}

.nav-pills {
    display: flex;
    gap: 8px;
    left: -12px;
    margin: 16px 0 0;
    overflow-y: auto;
    padding: 0 12px 16px;
    position: relative;
    width: calc(100% + 24px)
}

@media (min-width:768px) {
    .nav-pills {
        flex-wrap: wrap;
        margin: 24px 0 0
    }
}

.nav-pills svg {
    flex-shrink: 0
}

.nav-pills a,
.nav-pills>label {
    border: 1px solid #a2aeb7;
    border-radius: 100px;
    box-shadow: 0 8px 10px -10px rgba(0, 0, 0, .6);
    color: var(--color-text-900);
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    line-height: 18px;
    padding: 6px 12px;
    white-space: nowrap
}

.nav-pills a:hover,
.nav-pills>label:hover {
    background: rgba(123, 140, 152, .1);
    border: 1px solid var(--color-bg-900)
}

.nav-pills a.active,
.nav-pills>label.active {
    padding: 6px 12px 6px 8px
}

@media (min-width:768px) {

    .nav-pills a.active,
    .nav-pills>label.active {
        padding: 8px 16px 8px 8px
    }
}

.nav-pills a.active .icon-active,
.nav-pills>label.active .icon-active {
    display: block
}

.nav-pills a:first-child .tab-counter,
.nav-pills>label:first-child .tab-counter {
    display: inline
}

@media (min-width:768px) {

    .nav-pills a,
    .nav-pills>label {
        padding: 8px 16px
    }
}

.nav-pills a input,
.nav-pills>label input {
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0
}

.nav-pills a .icon-active,
.nav-pills>label .icon-active {
    display: none;
    fill: var(--color-primary-500)
}

@media (min-width:768px) {

    .nav-pills a .icon-active,
    .nav-pills>label .icon-active {
        height: 22px;
        width: 22px
    }
}

.nav-pills a .tab-counter,
.nav-pills>label .tab-counter {
    display: none
}

.nav-pills a {
    color: var(--color-text-900)
}

.nav-pills>label {
    align-items: center;
    cursor: pointer;
    display: inline-flex;
    gap: 8px;
    position: relative
}

.nav-pills .flickity-button.next,
.nav-pills .flickity-button.previous {
    background: #f0f3f7;
    border: 1px solid #a2aeb7;
    border-radius: 50%;
    box-shadow: 2px 2px 5px 14px #f0f3f7;
    height: 36px;
    right: 12px;
    top: 8px;
    width: 36px
}

.nav-pills .flickity-button.next:disabled,
.nav-pills .flickity-button.previous:disabled {
    opacity: 0
}

.nav-pills .flickity-button.next:hover,
.nav-pills .flickity-button.previous:hover {
    background: #f0f3f7
}

.nav-pills .flickity-button.next:hover .flickity-button-icon,
.nav-pills .flickity-button.previous:hover .flickity-button-icon {
    fill: var(--color-text-900)
}

.nav-pills .flickity-button.previous {
    left: 12px
}

@media (min-width:568px) {
    .nav-pills.nav-pills-list {
        left: -16px;
        width: calc(100% + 32px)
    }
}

@media (min-width:768px) {
    .nav-pills.nav-pills-list {
        padding: 0 12px 24px
    }
}

@media (min-width:992px) {
    .nav-pills.nav-pills-list {
        gap: 12px;
        margin: 32px 0 0;
        padding: 0 12px 32px
    }
}

.nav-pills-white label {
    background: #fff;
    border: none;
    font-size: 14px;
    line-height: 20px
}

@media (min-width:768px) {
    .nav-pills-white label {
        font-size: 16px;
        line-height: 22px
    }
}

.nav-pills-white label.active {
    border: none;
    box-shadow: none;
    cursor: default
}

.nav-pills-white label.active:hover {
    background: #fff
}

.nav-pills-white label:hover:not(.active) {
    background: #fff;
    border: none
}

@media (min-width:768px) {
    .nav-pills-white label:hover:not(.active) {
        box-shadow: 0 12px 12px -12px var(--color-primary-500)
    }
}

.nav-pills-b label.active {
    background: #e3e7ef;
    box-shadow: none;
    cursor: default
}

.nav-pills-b label.active:hover {
    background: #e3e7ef
}

.nav-pills-b>label .icon-active {
    fill: var(--color-text-900)
}

@media (min-width:768px) {
    .nav-pills-b>label .icon-active {
        height: 18px;
        width: 18px
    }
}

.nav-pills-c label {
    border-radius: 2px
}

.nav-pills-c label.active {
    background: #e3e7ef;
    box-shadow: none;
    cursor: default
}

.nav-pills-c label.active:hover {
    background: #e3e7ef
}

.nav-pills-c>label .icon-active {
    fill: var(--color-text-900)
}

@media (min-width:768px) {
    .nav-pills-c>label .icon-active {
        height: 18px;
        width: 18px
    }
}

.sgw-badge svg {
    fill: #20286d
}

.sgw-badge:after {
    background: #ea5b0b
}

.sub-menu {
    background: var(--color-bg-800);
    box-shadow: 0 51px 74px 0 rgba(0, 0, 0, .32);
    display: block;
    left: 0;
    max-height: 0;
    overflow: hidden;
    padding: 0 0 0 24px;
    transition: all .2s ease-in-out;
    width: 100%;
    z-index: 3
}

@media (min-width:768px) {
    .sub-menu {
        background: none;
        bottom: 0;
        box-shadow: none;
        left: 0;
        max-height: none;
        min-height: 250px;
        opacity: 0;
        overflow: visible;
        padding: 0;
        position: absolute;
        transform: translateY(-100%);
        transform-origin: top;
        transition: none
    }
}

.sub-menu.is-active {
    display: block;
    transform: none
}

@media (min-width:768px) {
    .sub-menu.is-active {
        transform: translateY(-100%)
    }
}

.text-center {
    text-align: center !important
}

.text-left {
    text-align: left !important
}

.text-right {
    text-align: right !important
}

@media (min-width:992px) {
    .md\:text-right {
        text-align: right !important
    }
}

@media (min-width:768px) {
    .sm\:text-right {
        text-align: right !important
    }

    .sm\:text-left {
        text-align: left !important
    }
}

.text-bold {
    font-weight: 700
}

.text-uppercase {
    text-transform: uppercase
}

.text-lowercase {
    text-transform: lowercase
}

.text-shadow {
    text-shadow: 0 2px 8px rgba(0, 0, 0, .6)
}

.micromodal-slide {
    display: none
}

.cg-flash-message {
    align-items: stretch;
    background: #fff;
    border: 1px solid #f0f3f7;
    border-radius: 2px;
    bottom: 8px;
    box-shadow: 0 24px 48px rgba(0, 0, 0, .32);
    display: flex;
    justify-content: space-between;
    left: 50%;
    max-width: 360px;
    padding: 4px 34px 4px 4px;
    position: fixed;
    transform: translateX(-50%) translateY(120%);
    width: calc(100% - 16px);
    z-index: 10
}

@media (min-width:568px) {
    .cg-flash-message {
        bottom: auto;
        left: auto;
        right: 32px;
        top: 120px;
        transform: translateX(130%) translateY(0)
    }
}

.cg-flash-message.flash-message-visible,
.cg-flash-message.is-open {
    transform: translateX(-50%) translateY(0)
}

@media (min-width:568px) {

    .cg-flash-message.flash-message-visible,
    .cg-flash-message.is-open {
        transform: translateX(0) translateY(0)
    }
}

.cg-flash-message.flash-message-visible.cg-flash-message-mobile-moved,
.cg-flash-message.is-open.cg-flash-message-mobile-moved {
    bottom: 70px
}

.detail-not-available-overlay {
    backdrop-filter: blur(10px);
    background: grey;
    background: rgba(0, 0, 0, .6);
    height: 100%;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10
}

.overlay-content-wrapper {
    color: #fff;
    left: 50%;
    max-width: 800px;
    padding: 24px;
    position: absolute;
    text-align: center;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%
}

@media (min-width:992px) {
    .overlay-content-wrapper {
        padding: 48px
    }
}

.overlay-content-wrapper .neo-fs-28 {
    margin-bottom: 8px
}

@media (min-width:1200px) {
    .overlay-content-wrapper .neo-fs-28 {
        margin-bottom: 16px
    }
}

.none {
    display: none !important
}

.flex {
    display: flex
}

.inherit {
    display: inherit
}

.inline-block {
    display: inline-flex
}

.inline-block * {
    vertical-align: middle
}

.inline-flex {
    display: inline-flex
}

.relative {
    position: relative
}

.absolute {
    position: absolute
}

@media (min-width:568px) {
    .xs\:flex {
        display: flex
    }

    .xs\:block {
        display: block
    }

    .xs\:none {
        display: none
    }
}

@media (min-width:768px) {
    .sm\:none {
        display: none
    }

    .sm\:flex {
        display: flex
    }

    .sm\:block {
        display: block
    }
}

@media (min-width:992px) {
    .md\:flex {
        display: flex
    }

    .md\:block {
        display: block
    }
}

@media (min-width:1200px) {
    .lg\:block {
        display: block
    }

    .lg\:flex {
        display: flex
    }
}

.flex-inline {
    display: inline-flex
}

.flex-1 {
    flex: 1
}

.flex-2 {
    flex: 2
}

.order-1 {
    order: 1
}

.flex-col {
    flex-direction: column
}

.flex-wrap {
    flex-wrap: wrap
}

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

@media (min-width:768px) {
    .sm\:justify-between {
        justify-content: space-between
    }
}

.justify-evenly {
    justify-content: space-evenly
}

.justify-center {
    justify-content: center
}

.justify-end {
    justify-content: flex-end
}

.justify-start {
    justify-content: flex-start
}

@media (min-width:568px) {
    .xs\:justify-start {
        justify-content: flex-start
    }

    .xs\:justify-end {
        justify-content: flex-end
    }
}

@media (min-width:768px) {
    .sm\:justify-start {
        justify-content: flex-start
    }
}

.content-between {
    align-content: space-between
}

.items-center {
    align-items: center
}

.items-end {
    align-items: flex-end
}

.align-center {
    align-items: center
}

@media (min-width:568px) {
    .xs\:items-start {
        align-items: flex-start
    }
}

.items-start {
    align-items: start
}

.items-stretch {
    align-items: stretch
}

.items-baseline {
    align-items: baseline
}

.self-center {
    align-self: center
}

.flex-no-shrink {
    flex-shrink: 0
}

.self-right {
    align-self: right
}

.flex-row {
    flex-direction: row;
    height: 100%
}

.flex-column {
    flex-direction: column
}

@media (min-width:568px) {
    .xs\:flex-row {
        flex-direction: row
    }
}

@media (min-width:768px) {
    .sm\:flex-row {
        flex-direction: row
    }
}

@media (min-width:568px) {
    .xs\:flex-column {
        flex-direction: column !important
    }
}

@media (min-width:768px) {
    .sm\:flex-column {
        flex-direction: column !important
    }
}

@media (min-width:992px) {
    .md\:flex-column {
        flex-direction: column !important
    }
}

.basis-100 {
    flex-basis: 100%
}

.cf-left {
    clear: left
}

.cf-right {
    clear: right
}

.cf-both {
    clear: both
}

.float-left {
    float: left
}

.float-right {
    float: right
}

.inline-block {
    display: inline-block
}

.dark-bg {
    background: var(--color-bg-900)
}

.dark-bg,
.dark-grey-8-bg {
    color: #fff;
    overflow: hidden;
    position: relative
}

.dark-grey-8-bg {
    background: var(--color-bg-950)
}

.block {
    display: block
}

@media (min-width:568px) {
    .xs\:none {
        display: none
    }
}

.link {
    cursor: pointer
}

.link:hover,
.underline,
.underline-link {
    text-decoration: underline
}

.underline-link {
    cursor: pointer;
    opacity: 1
}

.link-primary {
    color: var(--color-text-900);
    font-weight: 700;
    overflow-wrap: break-word;
    text-decoration: underline
}

.link-primary svg {
    fill: var(--color-text-900)
}

.link-primary:hover {
    color: var(--color-text-900);
    cursor: pointer;
    text-decoration: none
}

.link-primary:hover svg {
    fill: var(--color-text-900)
}

.link-primary:hover * {
    color: var(--color-text-900) !important
}

.link-primary-regular {
    color: var(--color-text-900);
    font-weight: 400;
    overflow-wrap: break-word;
    text-decoration: underline
}

.link-primary-regular svg {
    fill: var(--color-text-900)
}

.link-primary-regular:hover {
    color: var(--color-text-900);
    cursor: pointer;
    text-decoration: none
}

.link-primary-regular:hover svg {
    fill: var(--color-text-900)
}

.link-primary-regular:hover * {
    color: var(--color-text-900) !important
}

.bg-grey-8 .link-primary,
.bg-grey-9 .link-primary,
.section-dark .link-primary {
    color: var(--color-primary-500)
}

.bg-grey-8 .link-primary svg,
.bg-grey-9 .link-primary svg,
.section-dark .link-primary svg {
    fill: var(--color-primary-500)
}

.bg-grey-8 .link-primary:hover,
.bg-grey-9 .link-primary:hover,
.section-dark .link-primary:hover {
    color: var(--color-primary-500)
}

.bg-grey-8 .link-primary:hover svg,
.bg-grey-9 .link-primary:hover svg,
.section-dark .link-primary:hover svg {
    fill: var(--color-primary-500)
}

.bg-grey-8 .link-primary:hover *,
.bg-grey-9 .link-primary:hover *,
.section-dark .link-primary:hover * {
    color: var(--color-primary-500) !important
}

.link-secondary:hover {
    cursor: pointer;
    text-decoration: underline
}

.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.pointer {
    cursor: pointer
}

.expanded-visible {
    display: none
}

.expanded-hidden {
    display: block
}

.min-width-0 {
    min-width: 0
}

.homepage-section {
    background: #f0f3f7;
    overflow: hidden
}

.homepage-section-dark {
    background: var(--color-bg-900);
    overflow: hidden
}

.homepage-section-bottom {
    margin: 32px 0;
    text-align: center
}

.homepage-section-wrapper {
    padding: 0 15px
}

.homepage-section-content {
    margin: 40px auto
}

@media (min-width:1200px) {
    .homepage-section-content {
        margin: 0 auto;
        max-width: 1200px
    }
}

.text-left {
    text-align: left
}

.text-right {
    text-align: right
}

.bg-grey-8 {
    background: var(--color-bg-900)
}

.bg-grey-8,
.bg-grey-9 {
    color: #f0f3f7;
    position: relative
}

.bg-grey-9 {
    background: var(--color-bg-950)
}

.overflow-hidden {
    overflow: hidden
}

.hp-section-label,
.section-label {
    color: hsla(0, 0%, 100%, .2);
    font-family: Noto Sans, sans-serif;
    font-size: 14px;
    font-weight: 700;
    margin: 24px 0;
    position: relative;
    text-align: center;
    text-transform: uppercase
}

@media (min-width:992px) {

    .hp-section-label,
    .section-label {
        margin: 32px 0
    }
}

.hp-section-label:before,
.section-label:before {
    background: hsla(0, 0%, 100%, .2);
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    top: 50%;
    width: 100%
}

.hp-section-label span,
.section-label span {
    padding: 0 16px;
    position: relative;
    z-index: 2
}

.hp-section-label.dark,
.section-label.dark {
    color: #7b8c98
}

.hp-section-label.dark span,
.section-label.dark span {
    background: #f0f3f7
}

.hp-section-label.dark:before,
.section-label.dark:before {
    background: #7b8c98
}

.typography a:hover {
    cursor: pointer
}

.typography li,
.typography p {
    font-size: 16px;
    line-height: 24px
}

.typography .article-toggle .down,
.typography .article-toggle.toggle .right {
    display: none
}

.typography .article-toggle.toggle .article-toggle-content,
.typography .article-toggle.toggle .down {
    display: block
}

.typography .article-toggle .article-toggle-content {
    display: none
}

.typography .badge {
    border-radius: 50%;
    height: 24px;
    width: 24px
}

.typography .badge.green svg {
    fill: var(--color-primary-500)
}

.typography .badge.red svg {
    fill: var(--color-ui-error-red)
}

.typography .badge svg {
    height: 24px;
    width: 24px
}

.typography .anchor {
    display: block;
    position: relative;
    top: -50px;
    visibility: hidden
}

@media (min-width:992px) {
    .typography .anchor {
        top: -90px
    }
}

.typography figure img {
    display: block;
    width: 100%
}

.typography .note,
.typography .table-responsive,
.typography blockquote,
.typography fieldset,
.typography figure,
.typography iframe,
.typography ol,
.typography p,
.typography ul {
    margin-bottom: 16px
}

@media (min-width:992px) {

    .typography .note,
    .typography .table-responsive,
    .typography blockquote,
    .typography fieldset,
    .typography figure,
    .typography iframe,
    .typography ol,
    .typography p,
    .typography ul {
        margin-bottom: 24px
    }
}

.homepage-section .typography figure {
    margin-bottom: 0
}

.typography ol,
.typography ul {
    margin-bottom: 24px;
    margin-left: 0
}

.typography ol>li,
.typography ul>li {
    list-style: none;
    margin-bottom: 8px;
    padding-left: 24px;
    position: relative
}

.typography ul>li:before {
    background: var(--color-bg-900);
    border-radius: 50%;
    content: "";
    height: 6px;
    left: 7px;
    position: absolute;
    top: 12px;
    width: 6px
}

.typography ol {
    counter-reset: list;
    padding-left: 0
}

.typography ol>li {
    counter-increment: list;
    list-style: none;
    margin-bottom: 5px;
    padding-left: 35px
}

.typography ol>li:before {
    color: var(--color-text-900);
    content: counter(list) ".";
    font-size: 18px;
    font-weight: 700;
    left: 4px;
    position: absolute;
    top: 0
}

.fs-xs {
    font-size: 11px;
    line-height: 12px
}

.fs-s {
    font-size: 12px;
    line-height: 14px
}

.fs-l {
    font-size: 14px;
    line-height: 20px
}

@media (min-width:568px) {
    .fs-l {
        font-size: 16px;
        line-height: 24px
    }
}

.fs-m {
    font-size: 14px;
    line-height: 18px
}

.fs-xl {
    font-size: 18px;
    line-height: 1.2em
}

.fs-xxl {
    font-size: 22px
}

.fs-xxl,
.fs-xxxl {
    line-height: 1.1em
}

.fs-xxxl {
    font-size: 30px
}

.neo-fs-18 {
    font-family: neo-sans, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px
}

@media (min-width:768px) {
    .neo-fs-18 {
        font-size: 18px;
        line-height: 22px
    }
}

.neo-fs-18 a {
    color: inherit
}

.neo-fs-20 {
    font-family: neo-sans, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px
}

@media (min-width:568px) {
    .neo-fs-20 {
        font-size: 18px;
        line-height: 24px
    }
}

@media (min-width:992px) {
    .neo-fs-20 {
        font-size: 20px;
        line-height: 26px
    }
}

.neo-fs-20 a {
    color: inherit
}

.neo-fs-22 {
    font-family: neo-sans, sans-serif;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px
}

@media (min-width:768px) {
    .neo-fs-22 {
        font-size: 20px;
        line-height: 26px
    }
}

@media (min-width:992px) {
    .neo-fs-22 {
        font-size: 22px;
        line-height: 28px
    }
}

.neo-fs-28 {
    font-family: neo-sans, sans-serif;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 26px
}

@media (min-width:768px) {
    .neo-fs-28 {
        font-size: 25px;
        line-height: 29px
    }
}

@media (min-width:992px) {
    .neo-fs-28 {
        font-size: 28px;
        line-height: 34px
    }
}

.neo-fs-25 {
    font-family: neo-sans, sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px
}

@media (min-width:568px) {
    .neo-fs-25 {
        font-size: 22px;
        line-height: 26px
    }
}

@media (min-width:992px) {
    .neo-fs-25 {
        font-size: 25px;
        line-height: 30px
    }
}

.neo-sub-fs-22 {
    font-family: neo-sans, sans-serif;
    font-size: 18px;
    font-style: normal;
    line-height: 24px
}

@media (min-width:768px) {
    .neo-sub-fs-22 {
        font-size: 20px;
        line-height: 26px
    }
}

@media (min-width:992px) {
    .neo-sub-fs-22 {
        font-size: 22px;
        line-height: 26px
    }
}

.neo-fs-32 {
    font-family: neo-sans, sans-serif;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 29px
}

@media (min-width:768px) {
    .neo-fs-32 {
        font-size: 28px;
        line-height: 34px
    }
}

@media (min-width:992px) {
    .neo-fs-32 {
        font-size: 32px;
        line-height: 36px
    }
}

.neo-sub-fs-20 {
    font-family: neo-sans, sans-serif;
    font-size: 17px;
    font-style: normal;
    line-height: 24px
}

@media (min-width:768px) {
    .neo-sub-fs-20 {
        font-size: 18px;
        line-height: 26px
    }
}

@media (min-width:992px) {
    .neo-sub-fs-20 {
        font-size: 20px;
        line-height: 26px
    }
}

.neo-sub-fs-18 {
    font-family: neo-sans, sans-serif;
    font-size: 16px;
    font-style: normal;
    line-height: 22px
}

@media (min-width:768px) {
    .neo-sub-fs-18 {
        font-size: 17px;
        line-height: 24px
    }
}

@media (min-width:992px) {
    .neo-sub-fs-18 {
        font-size: 18px;
        line-height: 24px
    }
}

.neo-sub-fs-16 {
    font-family: neo-sans, sans-serif;
    font-size: 16px;
    font-style: normal;
    line-height: 22px
}

.neo-fs-18-fixed {
    font-family: neo-sans, sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 24px
}

.article-navigation-wrapper .h4:empty {
    display: none
}

.typography .article-navigation {
    background: #fff;
    border: 1px solid var(--color-bg-600);
    border-radius: 2px;
    color: var(--color-text-900);
    font-family: neo-sans, sans-serif;
    font-weight: 700;
    margin-bottom: 32px;
    padding: 8px
}

@media (min-width:992px) {
    .typography .article-navigation {
        margin-bottom: 48px
    }
}

.typography .article-navigation a {
    color: var(--color-text-900);
    display: block
}

.typography .article-navigation ol,
.typography .article-navigation ul {
    margin: 0
}

@media (min-width:992px) {

    .typography .article-navigation ol,
    .typography .article-navigation ul {
        margin: 0
    }
}

.typography .article-navigation ol a,
.typography .article-navigation ul a {
    background: url(https://static.casino.guru/res/45e0eb75237f484fe531fbde728cd778a/images/svg/arrow-down.svg) no-repeat right 8px center;
    background-size: 16px 16px;
    padding: 4px 24px 4px 30px
}

.typography .article-navigation ol a:hover,
.typography .article-navigation ul a:hover {
    background: url(https://static.casino.guru/res/45e0eb75237f484fe531fbde728cd778a/images/svg/arrow-down.svg) no-repeat #f0f3f7 right 8px center;
    background-size: 16px 16px;
    color: var(--color-primary-500);
    text-decoration: none
}

.typography .article-navigation ol li,
.typography .article-navigation ul li {
    font-size: 14px;
    line-height: 20px;
    margin: 0;
    padding-left: 0
}

.typography .article-navigation ol li:before,
.typography .article-navigation ul li:before {
    content: none
}

@media (min-width:568px) {

    .typography .article-navigation ol li,
    .typography .article-navigation ul li {
        font-size: 16px;
        line-height: 22px
    }

    .typography .article-navigation ol li a,
    .typography .article-navigation ul li a {
        padding: 8px 0 8px 40px
    }
}

.typography .article-navigation ol ol,
.typography .article-navigation ol ul,
.typography .article-navigation ul ol,
.typography .article-navigation ul ul {
    font-family: Noto Sans, sans-serif;
    font-size: 12px;
    line-height: 16px;
    margin-top: 2px;
    padding-left: 30px
}

@media (min-width:568px) {

    .typography .article-navigation ol ol,
    .typography .article-navigation ol ul,
    .typography .article-navigation ul ol,
    .typography .article-navigation ul ul {
        margin-top: 4px
    }

    .typography .article-navigation ol ol li,
    .typography .article-navigation ol ul li,
    .typography .article-navigation ul ol li,
    .typography .article-navigation ul ul li {
        font-size: 14px;
        line-height: 20px
    }
}

.typography .article-navigation ol ol li a,
.typography .article-navigation ul ol li a {
    padding: 4px 24px 4px 40px
}

@media (min-width:568px) {

    .typography .article-navigation ol ol li a,
    .typography .article-navigation ul ol li a {
        padding: 8px 24px 8px 40px
    }
}

.typography .article-navigation ul li a:before {
    background: var(--color-bg-900);
    border-radius: 50%;
    content: "";
    height: 6px;
    left: 11px;
    position: absolute;
    top: 11px;
    width: 6px
}

@media (min-width:568px) {
    .typography .article-navigation ul li a:before {
        top: 15px
    }
}

.typography .article-navigation ul li a:hover:before {
    background: var(--color-bg-900)
}

.typography .article-navigation ol {
    counter-reset: section
}

.typography .article-navigation ol>li>a:before {
    content: counters(section, ".") ".";
    counter-increment: section;
    font-size: 14px;
    left: 4px;
    position: absolute;
    top: 4px
}

@media (min-width:568px) {
    .typography .article-navigation ol>li>a:before {
        left: 10px;
        top: 8px
    }
}

.results-content-loader {
    display: none;
    position: relative
}

.results-content-loader h3 {
    color: #252525
}

.results-content-loader h4 {
    color: var(--color-primary-500)
}

.results-content-loader img {
    display: inline-block;
    left: 0;
    margin: 0 auto;
    max-width: 100%;
    position: absolute;
    right: 0
}

.results-content-loader.active {
    display: block
}

.section-dark .results-content-loader h3 {
    color: #fff
}

.results-content-loader-inside {
    height: 300px;
    position: relative;
    width: 100%
}

.results-content-loader-text {
    margin: 10px 0 0
}

.results-content-loader-spinner {
    bottom: 0;
    height: 300px;
    left: 0;
    margin: 0 auto;
    position: absolute;
    right: 0;
    text-align: center;
    top: 100px;
    width: 100%
}

.main-header {
    z-index: 2002
}

.results-content-loader {
    z-index: 1000
}

.results-content-overlay {
    z-index: 999
}

@media (min-width:768px) {
    .menu {
        z-index: 10
    }
}

.main-header-bg,
.menu-link,
.menu-right {
    z-index: 4
}

@font-face {
    font-display: swap;
    font-family: neo-sans;
    font-style: normal;
    font-weight: 700;
    src: url(../fonts/NeoSans/NeoSans Bold.woff2) format("woff2");
}

@font-face {
    font-display: swap;
    font-family: neo-sans;
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/NeoSans/NeoSans.woff2) format("woff2");
}

.tk-neo-sans {
    font-family: neo-sans, sans-serif
}
























.menu-expandable-popup {
    left: 0;
    position: absolute;
    top: 0;
    transform: translateY(-200%)
}

.vote-link-up {
    cursor: pointer
}

.vote-link-up.voted,
.vote-link-up:hover {
    color: #22b573
}

.vote-link-up.voted svg,
.vote-link-up:hover svg {
    fill: #22b573
}

.vote-link-down {
    cursor: pointer
}

.vote-link-down.voted,
.vote-link-down:hover {
    color: var(--color-ui-error-red)
}

.vote-link-down.voted svg,
.vote-link-down:hover svg {
    fill: var(--color-ui-error-red)
}

.vote-link-bump svg {
    animation: bump .8s
}

.filter-item-active,
.preset-filter-item-active {
    align-items: center;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 8px 8px -8px rgba(0, 0, 0, .24);
    color: var(--color-text-900);
    display: inline-flex;
    font-size: 12px;
    font-weight: 700;
    gap: 8px;
    line-height: 16px;
    margin: 8px 8px 0 0;
    padding: 6px 8px;
    position: relative
}

@media (min-width:568px) {

    .filter-item-active,
    .preset-filter-item-active {
        font-size: 14px;
        line-height: 20px;
        padding: 6px 12px
    }
}

.filter-item-active svg,
.preset-filter-item-active svg {
    fill: #a2aeb7;
    flex-shrink: 0
}

@media (min-width:568px) {

    .filter-item-active svg,
    .preset-filter-item-active svg {
        height: 18px;
        width: 18px
    }
}

.filter-item-active span,
.preset-filter-item-active span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

@media (min-width:992px) {

    .filter-item-active span,
    .preset-filter-item-active span {
        white-space: normal
    }
}

.filter-item-active .icon,
.preset-filter-item-active .icon {
    margin-left: -8px
}

.preset-filters {
    background: #d9ecff;
    border: 1px solid var(--color-ui-link-light);
    border-radius: 2px;
    margin: 12px 0 8px;
    padding: 8px 12px
}

.preset-filters:empty {
    display: none
}








.section-dark .filter-item-clear {
    color: #fff
}

.section-dark .filter-item-clear svg {
    fill: #fff
}



.side-filter .filter-item-clear {
    margin-top: 6px
}

@media (min-width:768px) {
    .results-header-row {
        align-items: center;
        display: flex;
        justify-content: space-between;
        margin: 16px 0
    }
}

.results-header-row .neo-fs-20 {
    flex: 1
}

.results-header-heading {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    font-family: neo-sans, sans-serif;
    font-size: 14px;
    font-weight: 700;
    position: relative
}

.tippy-popper .results-header-heading {
    color: var(--color-text-900);
    display: block
}

.results-header-heading .heading {
    display: inline;
    flex: 1 0;
    font-family: neo-sans, sans-serif;
    font-size: 16px;
    font-weight: 700;
    vertical-align: middle
}

@media (min-width:1200px) {
    .results-header-heading .heading {
        font-size: 20px;
        line-height: 20px
    }
}

.results-header-heading svg {
    flex-shrink: 0
}

.results-header-heading .widget-social {
    position: absolute;
    right: 0;
    top: 20px
}


.tippy-box .filter-heading-label {
    white-space: normal
}





.results-header .active-filter-groups {
    display: none
}

@media (min-width:768px) {
    .results-header .active-filter-groups {
        display: flex
    }
}

@media (min-width:1200px) {
    .results-header .active-filter-groups {
        display: none
    }
}

#popover-results-filter-top .popover {
    max-width: 100%;
    width: 400px
}

.results-content {
    width: 100%
}

.results-content.active {
    filter: blur(4px)
}

.results-content.active .results-content-overlay {
    display: block
}

.results-content-overlay {
    background: hsla(0, 0%, 100%, .8);
    display: none;
    height: 85%;
    position: absolute;
    width: 100%
}

.results-content-overlay-dark {
    background: rgba(var(--color-bg-900), .8)
}

.results-main-bottom {
    color: var(--color-text-600);
    display: flex;
    flex-direction: column;
    margin: 16px 0
}

@media (min-width:768px) {
    .results-main-bottom {
        border: none;
        flex-direction: row;
        flex-wrap: wrap;
        margin: 32px 0;
        padding: 0
    }
}

.results-main-bottom .paging-btn-wrapper {
    flex: 0 0 100%;
    margin-bottom: 16px;
    text-align: center
}

@media (min-width:568px) {
    .results-main-bottom .paging-btn-wrapper {
        margin-bottom: 24px
    }
}

@media (min-width:768px) {
    .results-main-bottom .paging-btn-wrapper {
        margin-bottom: 32px
    }
}

.results-main-bottom.on-dark-bg {
    color: #a2aeb7
}

.results-main-bottom .paging {
    flex: 0 0 100%;
    margin: 16px 0
}

.user-review-modal-select select {
    color: #7b8c98
}

.user-review-modal-select select.dirty {
    color: var(--color-text-600)
}

@media (min-width:768px) {
    .user-review-modal-select {
        width: calc(50% - 8px)
    }

    .active-filter-groups {
        align-items: center;
        display: flex;
        flex-wrap: wrap
    }
}

@media (min-width:992px) {
    .active-filter-groups {
        display: block
    }
}

.active-filter-groups .filter-header {
    flex: 0 0 100%;
    margin: 4px 4px 0 0
}

@media (min-width:1200px) {
    .active-filter-groups .filter-header {
        margin: 0
    }
}

.payment-list-results {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr))
}

@media (min-width:992px) {
    .payment-list-results {
        grid-template-columns: repeat(auto-fill, minmax(240px, 1fr))
    }
}

.payment-list-item {
    background: #fff;
    border-radius: 2px;
    padding: 4px;
    position: relative
}

@media (min-width:768px) {
    .payment-list-item {
        padding: 8px
    }
}



.payment-list-item-bottom {
    text-align: center
}

.payment-list-item-bottom .btn {
    margin: 4px 0
}

@media (min-width:768px) {
    .payment-list-item-bottom .btn {
        margin: 8px 0
    }
}

.payment-list-item-facet {
    background: rgba(123, 140, 152, .1);
    border-radius: 2px;
    color: var(--color-text-900);
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    padding: 2px 6px;
    position: absolute;
    right: 0;
    top: 0
}

@media (min-width:992px) {
    html {
        scrollbar-color: var(--color-primary-500) #f0f3f7
    }

    html ::-webkit-scrollbar {
        height: 4px;
        width: 6px
    }

    html ::-webkit-scrollbar-track {
        background: #f0f3f7;
        width: 6px
    }

    html ::-webkit-scrollbar-thumb {
        background: var(--color-primary-500);
        border-radius: 2px
    }

    html body * {
        scrollbar-color: var(--color-primary-500) #fff;
        scrollbar-width: thin
    }

    html.scrollbar-dark ::-webkit-scrollbar-track {
        background: var(--color-bg-900)
    }

    html.scrollbar-dark ::-webkit-scrollbar-thumb {
        background: var(--color-primary-500)
    }

    html.scrollbar-dark body {
        scrollbar-color: var(--color-primary-500) var(--color-bg-900)
    }
}

.side-filter .filter-search-input-wrapper {
    margin-right: 0
}

@media (min-width:768px) {

    .active-filter-group,
    .game-results-header .active-filter-group {
        display: inline-block
    }
}





























.tippy-popper .filter-items-active {
    display: none
}







.expanded .filter-group-content {
    display: block
}












.cgf-facet-counter {
    background: rgba(123, 140, 152, .1);
    border-radius: 2px;
    color: var(--color-text-900);
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    margin: 0 8px 0 auto;
    padding: 0 6px
}

@media (min-width:568px) {
    .cgf-facet-counter {
        font-size: 14px;
        line-height: 20px
    }
}

.cgf-icon-wrapper {
    display: inline-flex;
    margin: 0 5px 0 0
}

.cgf-icon-wrapper .cg-checkbox-icon {
    margin-right: 0
}

.live-genre .cgf-icon-wrapper {
    position: relative
}

.live-genre .cgf-icon-wrapper:after {
    background: #e61c00;
    border-radius: 24px;
    content: " ";
    height: 3.75px;
    position: absolute;
    right: 0;
    top: 0;
    width: 3.75px
}

.live-genre .cgf-icon-wrapper svg {
    height: 16px;
    margin-right: 2px;
    margin-top: 2px;
    width: 16px
}

.cgf-item {
    align-items: center;
    color: var(--color-text-900);
    cursor: pointer;
    display: flex;
    font-size: 12px;
    height: 32px;
    line-height: 16px;
    min-height: 28px;
    position: relative
}

@media (min-width:768px) {
    .cgf-item {
        font-size: 14px;
        height: 36px;
        line-height: 20px
    }
}

.cgf-item .icon,
.cgf-item .icon-badge {
    margin-left: 7px;
    margin-right: 3px
}

.cgf-item .cg-checkbox {
    display: flex
}

.cgf-item .cg-checkbox span {
    margin: 0 8px
}

.cgf-item.active {
    text-decoration: none
}

.cgf-item.active .cgf-facet-counter {
    display: none
}

.cgf-item.active .cg-checkbox input:checked+span .checked {
    display: block
}

.cgf-item.active .cg-checkbox-icon {
    fill: var(--color-primary-500)
}

@media (min-width:1200px) {
    .cgf-item:hover {
        background: rgba(123, 140, 152, .1);
        text-decoration: none
    }

    .cgf-item:hover .cg-checkbox input:checked+span .checked {
        display: block
    }
}

.cgf-item svg {
    fill: #7b8c98
}

.cgf-item:focus {
    text-decoration: none
}

@media (min-width:1200px) {
    .cgf-item.active:hover {
        text-decoration: none
    }
}

.cgf-child {
    padding-left: 22px
}

.cg-expandbox {
    align-items: center;
    background: #fff;
    border: 1px solid #7b8c98;
    border-radius: 2px;
    display: flex;
    flex-shrink: 0;
    height: 16px;
    justify-content: center;
    margin: 0 8px;
    position: relative;
    width: 16px
}

@media (min-width:568px) {
    .cg-expandbox {
        height: 18px;
        width: 18px
    }
}

.cg-expandbox svg {
    fill: #7b8c98
}







.cgf-item .filter-group-label {
    color: var(--color-text-900)
}









.active .filter-header,


div.filter {
    height: calc(100% - 57px);
    overflow: auto;
    transition: all .2s
}

@media (min-width:992px) {
    div.filter {
        height: calc(100% - 67px);
        scrollbar-color: var(--color-primary-500) #fff;
        scrollbar-width: thin
    }

    div.filter ::-webkit-scrollbar-track {
        background: #fff
    }
}

div.filter .additional-filters {
    padding-bottom: 8px
}

div.filter .additional-filters:empty {
    padding-bottom: 0
}

div.filter .hr {
    background: #cdd6dd;
    display: block;
    height: 1px;
    margin-top: 8px
}







.header-breadcrumb {
    display: none;
    font-family: Noto Sans, Sans-Serif;
    padding: 16px 0;
    position: relative;
    width: 100%;
    z-index: 3
}

@media (min-width:768px) {
    .header-breadcrumb {
        align-items: flex-start;
        display: flex
    }
}

.header-breadcrumb svg {
    fill: var(--color-text-600)
}

.footer-breadcrumbs-wrapper .header-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    padding: 0 0 16px;
    row-gap: 8px
}

.header-breadcrumb a {
    align-items: center;
    color: var(--color-text-600);
    display: inline-flex;
    font-size: 12px;
    line-height: 16px;
    padding-right: 4px;
    position: relative;
    text-decoration: none;
    white-space: nowrap
}

.header-breadcrumb a.active,
.header-breadcrumb a:hover {
    color: var(--color-primary-500)
}

.header-breadcrumb a.active svg.home,
.header-breadcrumb a:hover svg.home {
    fill: var(--color-primary-500)
}

.header-breadcrumb a.active {
    font-weight: 700
}

.header-breadcrumb a:first-child:before {
    display: none !important
}

.header-breadcrumb span.item {
    align-items: center;
    color: #7b8c98;
    display: inline-flex;
    font-size: 12px;
    line-height: 16px;
    padding-right: 4px;
    position: relative
}

.header-breadcrumb.breadcrumb-dark,
.header-breadcrumb.breadcrumb-dark span.item {
    color: #cdd6dd
}

.header-breadcrumb.breadcrumb-dark a {
    color: #e3e7ef
}

.header-breadcrumb.breadcrumb-dark svg {
    fill: #e3e7ef
}

.casino-card-mini {
    background: #fff;
    border-radius: 2px;
    box-shadow: 0 16px 16px -16px rgba(0, 0, 0, .24);
    display: flex;
    flex: 1 0 100%;
    font-size: 12px;
    height: 84px;
    line-height: 16px;
    overflow: hidden;
    position: relative
}

.casino-card-mini.inner-shadow {
    box-shadow: inset 0 0 1px 1px rgba(0, 0, 0, .1)
}

@media (min-width:768px) {
    .casino-card-mini {
        flex: 0 0 calc(50% - 4px);
        min-height: 84px
    }
}

.casino-card-mini .btn-cta-wrapper {
    align-items: flex-start;
    bottom: 0;
    column-gap: 8px;
    display: flex;
    flex-wrap: wrap;
    opacity: 0;
    overflow: hidden;
    padding: 0 0 0 8px;
    position: absolute;
    right: 0;
    top: 0;
    transform: translateX(150%);
    transition: transform .2s ease-in-out, opacity .2s ease-in-out;
    width: calc(100% - 76px);
    z-index: 4
}

@media (min-width:992px) {
    .casino-card-mini .btn-cta-wrapper {
        padding: 0 8px
    }
}

.casino-card-mini .btn-cta-wrapper .clickthroughlink-info {
    display: flex;
    justify-content: right;
    position: absolute;
    top: 7px;
    width: calc(100% - 52px)
}

@media (min-width:992px) {
    .casino-card-mini .btn-cta-wrapper .clickthroughlink-info {
        margin-right: 0;
        width: calc(100% - 16px)
    }
}

.casino-card-mini .btn-cta-wrapper:has(.add-in-content-info) .btn,
.casino-card-mini .btn-cta-wrapper:has(.clickthroughlink-info) .btn {
    margin-top: 24px
}

.casino-card-mini .btn-cta-wrapper .add-in-content-info {
    bottom: unset;
    font-size: 10px;
    justify-content: right;
    line-height: 10px;
    margin-right: 8px
}

.casino-card-mini .btn-cta-wrapper .add-in-content-info:last-child {
    margin-right: 0
}

.casino-card-mini .btn-cta-wrapper .btn {
    flex: 1 0;
    margin: auto 0;
    min-height: 48px
}

.casino-card-mini .btn-cta-wrapper .btn svg {
    display: none
}

.casino-card-mini .card-header {
    align-items: center;
    border-radius: 2px;
    display: flex;
    margin: 4px 0 4px 4px;
    opacity: 1;
    transition: opacity .2s ease-in-out;
    z-index: 5
}

.casino-card-mini .card-header img,
.casino-card-mini .card-header picture {
    display: block
}

.casino-card-mini .pros {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    max-height: 32px;
    overflow: hidden;
    -webkit-box-orient: vertical
}

.casino-card-mini .card-content-wrapper {
    display: flex;
    flex: 1;
    overflow: hidden
}

.casino-card-mini .card-body {
    display: flex;
    flex: 1 0;
    flex-direction: column;
    gap: 4px;
    justify-content: space-evenly;
    opacity: 1;
    overflow: hidden;
    padding: 6px 38px 6px 8px;
    transform: translateX(0);
    transition: opacity .2s ease-in-out, transform .2s ease-in-out
}

.casino-card-mini .card-body .clickthroughlink-info {
    height: 8px;
    pointer-events: none;
    z-index: -1
}

@media (min-width:568px) {
    .casino-card-mini .card-body .clickthroughlink-info {
        height: 22px
    }
}

.casino-card-mini .card-body .text-wrapper {
    white-space: normal
}

.casino-card-mini .card-body .safety-index {
    display: block
}

.casino-card-mini .clickthroughlink-info {
    font-size: 10px
}

.casino-card-mini .close-ico {
    border-left: 1px solid #e3e7ef;
    height: 100%;
    padding: 0 6px
}

.casino-card-mini .show-ico {
    border-left: 1px solid #e3e7ef;
    bottom: 0;
    margin: auto;
    opacity: 1;
    padding-left: 6px;
    position: absolute;
    right: 6px;
    top: 0;
    transition: opacity .2s ease-in-out
}

.casino-card-mini .show-ico:hover svg {
    fill: var(--color-primary-500)
}

.casino-card-mini .name {
    color: var(--color-text-900);
    display: -webkit-box;
    font-family: neo-sans, sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    max-height: 40px;
    max-width: 100%;
    position: relative;
    white-space: normal
}

.casino-card-mini .name .num {
    flex: 0 0 20px
}

.casino-card-mini .feature {
    color: var(--color-text-600);
    font-size: 14px;
    font-weight: 700;
    line-height: 20px
}

@media (min-width:992px) {
    .casino-card-mini .close-ico {
        display: none
    }
}

.casino-card-mini .btn-border {
    border: 1px solid var(--color-secondary-800);
    color: var(--color-secondary-800)
}

.casino-card-mini .btn-border.active,
.casino-card-mini .btn-border:active,
.casino-card-mini .btn-border:focus,
.casino-card-mini .btn-border:hover {
    background: var(--color-secondary-800);
    color: #fff
}

.casino-card-mini .btn-border.active svg,
.casino-card-mini .btn-border:active svg,
.casino-card-mini .btn-border:focus svg,
.casino-card-mini .btn-border:hover svg {
    fill: #fff
}

.casino-card-mini .btn-border svg {
    fill: var(--color-secondary-800)
}

@media (max-width:991px) {
    .casino-card-mini.active .show-ico {
        opacity: 0
    }

    .casino-card-mini.active .card-body {
        transform: translateX(-150%)
    }

    .casino-card-mini.active .btn-cta-wrapper {
        opacity: 1;
        transform: translateX(0);
        z-index: 1
    }
}

@media (min-width:992px) {
    .casino-card-mini:hover .show-ico {
        opacity: 0
    }

    .casino-card-mini:hover .card-body {
        transform: translateX(-150%)
    }

    .casino-card-mini:hover .btn-cta-wrapper {
        opacity: 1;
        transform: translateX(0);
        z-index: 3
    }
}

.casino-card-mini-dark {
    background: var(--color-bg-800);
    box-shadow: inset 0 0 1px 1px hsla(0, 0%, 100%, .1), 0 16px 16px -16px rgba(0, 0, 0, .24);
    color: #f0f3f7;
    padding-left: 1px
}

.casino-card-mini-dark .name {
    color: #f0f3f7
}

.casino-card-mini-dark .feature {
    color: #a2aeb7
}

.casino-card-mini-dark .show-ico {
    border-left: 1px solid rgba(0, 0, 0, .2)
}

.casino-card-mini-dark .disputed-amount {
    color: #cdd6dd
}

.casino-card-mini-dark .disputed-amount strong {
    color: #fff
}

.casino-card-mini-dark .btn-border {
    border: 1px solid #f0f3f7;
    color: #f0f3f7
}

.casino-card-mini-dark .btn-border.active,
.casino-card-mini-dark .btn-border:active,
.casino-card-mini-dark .btn-border:focus,
.casino-card-mini-dark .btn-border:hover {
    background: hsla(0, 0%, 100%, .1)
}

.casino-card-mini-dark .card-header {
    background: var(--color-bg-800);
    border-left: 4px solid var(--color-bg-800);
    margin-left: 0
}

.casino-card-mini-dark .close-ico {
    border-left: 1px solid rgba(0, 0, 0, .2);
    padding: 0 0 0 6px
}

.games-box-placeholder-b:after {
    background: linear-gradient(180deg, transparent 50.09%, #000), linear-gradient(0deg, rgba(0, 0, 0, .5), rgba(0, 0, 0, .5)), 50%/cover no-repeat;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: background .5s linear;
    width: 100%;
    z-index: 5
}

.games-box-placeholder-b .main-game-btn-wrapper {
    transform: translateX(0);
    transition: all .5s linear
}

.games-box-placeholder-b.expanded-top-casinos:after {
    background: linear-gradient(180deg, transparent 50.09%, #000), linear-gradient(0deg, rgba(0, 0, 0, .8), rgba(0, 0, 0, .8)), 50%/cover no-repeat
}

@media (max-width:767px) {
    .games-box-placeholder-b.expanded-top-casinos .main-game-btn-wrapper {
        opacity: 0;
        z-index: -1
    }
}

@media (min-width:768px) {
    .games-box-placeholder-b.expanded-top-casinos .main-game-btn-wrapper {
        transform: translateY(-50%)
    }
}

.play-in-casino-wrapper-b {
    bottom: 16px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 8px;
    position: absolute;
    width: 100%;
    z-index: 6
}

@media (min-width:768px) {
    .play-in-casino-wrapper-b {
        max-width: 362px;
        padding: 16px
    }
}

.play-in-casino-wrapper-b .close {
    display: none
}

.play-in-casino-wrapper-b.expanded .close {
    display: flex
}

.play-in-casino-wrapper-b.expanded .open {
    display: none
}

.play-in-casino-wrapper-b.expanded .top-casino-card-bottom {
    opacity: 0
}

.play-in-casino-wrapper-b.expanded .play-in-casino-body {
    max-height: 1000px;
    overflow: auto;
    padding-right: 2px;
    z-index: 10
}

.play-in-casino-wrapper-b.expanded .casino-card-mini:not(:first-child) {
    opacity: 1
}

.play-in-casino-wrapper-b.expanded .btn-show-more-casinos-wrapper {
    max-height: 500px;
    opacity: 1;
    z-index: 10
}

.play-in-casino-wrapper-b.expanded .play-in-casino-desc {
    margin: 12px 0;
    max-height: 500px;
    opacity: 1;
    z-index: 10
}

@media (min-width:568px) {
    .play-in-casino-wrapper-b.expanded .play-in-casino-desc {
        margin: 8px 0
    }
}

.play-in-casino-wrapper-b .btn-show-more-casinos-wrapper,
.play-in-casino-wrapper-b .play-in-casino-desc {
    margin: 0;
    max-height: 0;
    opacity: 0;
    transition: all .5s ease-in-out;
    z-index: -1
}

.play-in-casino-wrapper-b .btn-game {
    margin-top: 8px;
    width: 100%
}

.play-in-casino-wrapper-b .play-in-casino-header {
    align-items: center;
    display: flex;
    font-size: 18px;
    font-weight: 700;
    gap: 8px;
    line-height: 24px
}

.play-in-casino-wrapper-b .ico-wrapper {
    border: 1px solid var(--color-bg-600);
    border-radius: 2px;
    box-sizing: content-box;
    margin-left: auto;
    padding: 4px 8px
}

.play-in-casino-wrapper-b .ico-wrapper:hover {
    background: rgba(123, 140, 152, .1)
}

.play-in-casino-wrapper-b .casino-card-mini:not(:first-child) {
    opacity: 0;
    transition: opacity .5s ease-in-out;
    z-index: -1
}

.play-in-casino-wrapper-b .play-in-casino-body {
    max-height: 100px;
    overflow: hidden;
    position: relative;
    transition: max-height .5s ease-in-out
}

.play-in-casino-wrapper-b .top-casino-card-bottom {
    margin-top: -4px;
    position: absolute;
    transition: opacity .5s ease-in-out;
    width: 100%
}

.play-in-casino-wrapper-b .bg-card {
    background: var(--color-bg-800);
    border: 1px solid rgba(123, 140, 152, .1);
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    box-shadow: 0 32px 24px -24px rgba(0, 0, 0, .24);
    display: block;
    height: 6px;
    margin-left: 2%;
    width: 96%
}

.play-in-casino-wrapper-b .second-bg-card {
    margin: 0 0 0 4%;
    width: 92%
}

.games-box-placeholder-c:after {
    background: linear-gradient(180deg, transparent 75%, #000), linear-gradient(0deg, rgba(0, 0, 0, .8), transparent), 50%/cover no-repeat;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: background .2s ease-in-out;
    width: 100%;
    z-index: 5
}

.play-in-casino-wrapper-c {
    bottom: 16px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 16px 8px;
    position: absolute;
    width: 100%;
    z-index: 6
}

@media (min-width:768px) {
    .play-in-casino-wrapper-c {
        padding: 16px
    }
}

.play-in-casino-wrapper-c.slider-enabled .btn-show-all-casinos {
    margin-right: 84px
}

.play-in-casino-wrapper-c .flickity-prev-next-button {
    top: -36px !important
}

.play-in-casino-wrapper-c .slider-name {
    width: 100%
}

.play-in-casino-wrapper-c .game-slider-panel-icon {
    fill: #fff
}

.play-in-casino-wrapper-c .casino-mini-card-wrapper {
    flex: 0 0 320px;
    max-width: 320px;
    padding-right: 8px;
    width: 100%
}

@media (min-width:568px) {
    .play-in-casino-wrapper-c .casino-mini-card-wrapper {
        flex: 0 0 340px;
        max-width: 340px
    }
}

@media (min-width:768px) {
    .play-in-casino-wrapper-c .casino-mini-card-wrapper {
        max-width: unset;
        width: calc(33.33333% + 3px)
    }
}

.play-in-casino-wrapper-c .casino-card-mini {
    margin: 8px 0 0;
    width: 100%
}

@media (min-width:768px) {
    .play-in-casino-wrapper-c .casino-card-mini {
        margin: 16px 0 0
    }
}

.top-game-wrapper {
    margin-right: 8px;
    padding-bottom: 16px;
    position: relative
}

@media (min-width:568px) {
    .top-game-wrapper {
        margin-right: 24px
    }
}

@media (min-width:992px) {
    .top-game-wrapper {
        padding-bottom: 12px;
        width: calc(25% - 18px)
    }
}

@media (min-width:1200px) {
    .top-game-wrapper {
        width: calc(20% - 19.2px)
    }
}

.top-game-wrapper .number {
    color: rgba(0, 0, 0, .7);
    filter: drop-shadow(0 0 8px #0F1);
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: var(--color-primary-400);
    bottom: 0;
    font-family: neo-sans, sans-serif;
    font-size: 48px;
    font-style: normal;
    font-weight: 700;
    left: 8px;
    line-height: normal;
    position: absolute;
    z-index: 5
}

@media (min-width:568px) {
    .top-game-wrapper .number {
        bottom: 6px;
        font-size: 64px;
        line-height: 60px
    }
}

@media (min-width:992px) {
    .top-game-wrapper .number {
        bottom: 16px;
        font-size: 80px;
        line-height: 74px
    }
}

.top-game-wrapper .game-item {
    flex: 100% !important;
    min-width: auto !important;
    padding: 10px 0 0 18px !important;
    width: 100% !important
}

@media (min-width:568px) {
    .top-game-wrapper .game-item {
        padding: 10px 0 0 32px !important
    }
}

.top-game-wrapper .game-item-img {
    min-height: 120px;
    width: 90px
}

@media (min-width:568px) {
    .top-game-wrapper .game-item-img {
        min-height: 186px;
        width: 140px
    }
}

@media (min-width:992px) {
    .top-game-wrapper .game-item-img {
        min-height: 255px;
        min-width: 180px;
        width: auto
    }
}

.game-slider-panel {
    margin: 24px 0;
    user-select: none
}

@media (min-width:768px) {
    .game-slider-panel {
        padding: 0
    }
}

@media (min-width:992px) {
    .game-slider-panel {
        margin: 32px 0
    }
}

.game-slider-panel .neo-fs-18,
.game-slider-panel .neo-fs-18 a {
    color: #e3e7ef
}

.game-slider-panel .neo-fs-18 a:hover {
    color: var(--color-primary-500)
}

.game-slider-panel .slider-name {
    margin-right: 16px;
    min-height: 36px
}

.game-slider-panel .slider-name .tag-new {
    top: -12px
}

.game-slider-panel-icon {
    fill: var(--color-primary-500);
    flex-shrink: 0;
    height: 18px;
    margin-right: 8px;
    width: 18px
}

@media (min-width:992px) {
    .game-slider-panel-icon {
        height: 20px;
        width: 20px
    }
}

.desktop-slider-panel>.neo-fs-18 {
    margin: 16px 0
}

@media (min-width:768px) {
    .desktop-slider-panel>.neo-fs-18 {
        margin: 0 0 16px
    }
}

.game-slider .game-item {
    flex: 0 0 43%;
    min-width: 140px;
    padding: 10px 8px 10px 0;
    width: 43%
}

@media (min-width:568px) {
    .game-slider .game-item {
        flex: 0 0 29%;
        width: 29%
    }
}

@media (min-width:768px) {
    .game-slider .game-item {
        flex: 0 0 calc(25% - 6px);
        margin-right: 8px;
        padding: 10px 0 16px;
        width: calc(25% - 6px)
    }
}

@media (min-width:1200px) {
    .game-slider .game-item {
        flex: 0 0 calc(20% - 6px);
        width: calc(20% - 6px)
    }
}

.game-slider .game-item:hover {
    z-index: 3
}

@media (min-width:992px) {
    .game-slider .game-item:hover .game-item-overlay {
        opacity: 1
    }
}

.flickity-enabled.game-slider {
    width: auto
}

@media (min-width:992px) {
    .slider-enabled .btn-games-show-all {
        margin-right: 80px
    }
}

.game-item {
    display: inline-block;
    overflow: hidden;
    position: relative;
    transition: all .2s ease-in-out
}

@media (min-width:992px) {
    .game-item {
        display: inline-block
    }
}

.game-item .game-item-promo-label {
    text-transform: uppercase
}

@media (max-width:991px) {
    .game-item .game-item-promo-label {
        font-size: 10px
    }
}

.game-item:hover .game-item-content,
.game-item:hover .game-item-overlay {
    display: block;
    opacity: 1
}

.game-item:hover .game-item-img>img {
    transform: scale(1.1);
    transform-origin: center
}

.game-item:hover .game-item-name {
    color: #fff;
    text-decoration: underline
}

.game-item:hover .game-item-name span {
    color: #fff
}

@media (min-width:768px) {
    .game-item {
        overflow: visible
    }
}

.game-item .btn-play {
    align-items: center;
    background: linear-gradient(270deg, #21c12e, #0f8815);
    border: 2px solid var(--color-primary-400);
    border-radius: 50%;
    display: flex;
    height: 56px;
    justify-content: center;
    position: relative;
    width: 56px;
    z-index: 3
}

.flag-live {
    align-items: center;
    background: var(--transparency-black-40, rgba(0, 0, 0, .4));
    border: 1px solid var(--transparency-white-20, hsla(0, 0%, 100%, .2));
    border-radius: 2px;
    color: #fff;
    display: flex;
    font-family: Noto Sans, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    gap: 8px;
    height: 26px;
    padding: 6px 8px;
    position: absolute;
    right: 8px;
    text-transform: uppercase;
    top: 8px;
    z-index: 2
}

@media (min-width:768px) {
    .flag-live {
        font-size: 14px;
        height: 30px
    }
}

.flag-live:after,
.flag-live:before {
    border-radius: 50%;
    content: "";
    display: block;
    height: 6px;
    margin: 0 4px;
    width: 6px
}

.flag-live:before {
    background: #d60e16
}

.flag-live:after {
    animation: pulse-circle 2s infinite;
    position: absolute
}

.game-item-name {
    color: #f0f3f7;
    display: block;
    font-family: Noto Sans, sans-serif;
    font-size: 12px;
    font-weight: 700;
    margin: 4px 0;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: all .2s ease-in-out
}

@media (min-width:768px) {
    .game-item-name {
        font-size: 14px;
        line-height: 16px;
        margin: 8px 0
    }
}

.game-item-name span {
    color: #7b8c98;
    font-weight: 400
}

.game-provider-counter {
    color: #f0f3f7
}

.game-item-img {
    border-radius: 2px;
    display: block;
    overflow: hidden;
    position: relative;
    transition: all .2s ease-in-out;
    z-index: 3
}

.game-item-img:before {
    content: "";
    display: block;
    padding-bottom: 77%
}

.game-item-img>picture>img {
    -webkit-backface-visibility: hidden;
    height: 100%;
    left: 0;
    object-fit: cover;
    position: absolute;
    top: 0;
    transition: transform .3s ease-in-out;
    width: 100%;
    z-index: 2
}

.game-item-img.no-flash>img,
.game-item-img.no-flash>picture img {
    filter: grayscale(1)
}

.game-item-overlay {
    align-items: center;
    border-radius: 2px;
    display: none;
    flex-direction: column;
    justify-content: center;
    opacity: 0;
    overflow: hidden;
    transition: all .2s ease-in-out;
    z-index: 3
}

.game-item-overlay,
.game-item-overlay:before {
    -webkit-backface-visibility: hidden;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.game-item-overlay:before {
    background: rgba(0, 0, 0, .7);
    content: "";
    transform: scale(1.1);
    z-index: 2
}

.game-item-overlay .btn {
    position: relative;
    z-index: 3
}

.game-item-overlay .overlay-text {
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: opacity .2s ease-in-out;
    z-index: 3
}

@media (min-width:768px) {
    .game-item-overlay .overlay-text {
        font-size: 14px
    }
}

.play-btn-cta {
    background-color: #44be4c;
    border-radius: 4px;
    color: #fff;
    display: inline-block;
    font-size: 16px;
    font-weight: 700;
    padding: 10px 28px;
    transition: background-color 0.2s ease;
}

.play-btn-cta:hover {
    background-color: #33a03b;
}

.game-item-overlay .overlay-loader {
    background: var(--color-bg-900);
    bottom: 8px;
    color: #fff;
    font-weight: 700;
    padding: 2px 4px;
    position: absolute;
    right: 16px;
    z-index: 3
}

.game-item-results {
    display: flex;
    flex-wrap: wrap
}

.game-item-results .game-item {
    flex: 0 1 50%;
    margin: 20px 10px 0 0;
    max-width: calc(50% - 5px)
}

.game-item-results .game-item:nth-child(2n) {
    margin-right: 0
}

@media (min-width:568px) {
    .game-item-results .game-item {
        flex: 0 1 33.333%;
        margin: 20px 10px 0 0;
        max-width: calc(33.333% - 7px)
    }

    .game-item-results .game-item:nth-child(2n) {
        margin-right: 10px
    }

    .game-item-results .game-item:nth-child(3n) {
        margin-right: 0
    }
}

@media (min-width:768px) {
    .game-item-results .game-item {
        flex: 0 1 25%;
        margin: 20px 10px 0 0;
        max-width: calc(25% - 8px)
    }

    .game-item-results .game-item:nth-child(2n),
    .game-item-results .game-item:nth-child(3n) {
        margin-right: 10px
    }

    .game-item-results .game-item:nth-child(4n) {
        margin-right: 0
    }
}

@media (min-width:1200px) {
    .game-item-results .game-item {
        flex: 0 1 20%;
        margin: 20px 10px 0 0;
        max-width: calc(20% - 8px)
    }

    .game-item-results .game-item:nth-child(2n),
    .game-item-results .game-item:nth-child(3n),
    .game-item-results .game-item:nth-child(4n) {
        margin-right: 10px
    }

    .game-item-results .game-item:nth-child(5n) {
        margin-right: 0
    }
}

.custom-graphics {
    background: var(--color-bg-950);
    border-radius: 0;
    margin-left: -12px;
    margin-right: -12px;
    overflow: hidden;
    padding: 24px 16px;
    position: relative
}

@media (min-width:568px) {
    .custom-graphics {
        margin-left: -16px;
        margin-right: -16px
    }
}

@media (min-width:992px) {
    .custom-graphics {
        border-radius: 4px;
        margin: 0;
        padding: 24px
    }
}

.custom-graphics .neo-fs-20 {
    margin-top: 0;
    position: relative
}

.custom-graphics .game-item-img {
    border-radius: 4px;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .25)
}

.custom-graphics .game-item-img:before {
    padding-bottom: 120%
}

.custom-graphics .item-slider {
    left: 0;
    margin-left: -16px;
    margin-right: -16px;
    padding: 0;
    width: calc(100% + 32px)
}

.custom-graphics .item-slider .game-item:first-of-type {
    margin-left: 12px
}

.custom-graphics .item-slider .game-item:last-of-type {
    margin-right: 4px
}

@media (min-width:568px) {
    .custom-graphics .item-slider .game-item:first-of-type {
        margin-left: 16px
    }

    .custom-graphics .item-slider .game-item:last-of-type {
        margin-right: 8px
    }
}

@media (min-width:768px) {
    .custom-graphics .item-slider {
        margin-left: 0;
        margin-right: 0;
        width: unset
    }

    .custom-graphics .item-slider .game-item:first-of-type {
        margin-left: 0
    }

    .custom-graphics .item-slider .game-item:last-of-type {
        margin-right: 0
    }
}

.custom-graphics .btn-games-show-all-top {
    backdrop-filter: blur(12px);
    display: none
}

@media (min-width:992px) {
    .custom-graphics .btn-games-show-all-top {
        display: block
    }
}

.custom-graphics .btn-games-show-all-bottom {
    backdrop-filter: blur(12px);
    margin-top: 24px
}

@media (min-width:992px) {
    .custom-graphics .btn-games-show-all-bottom {
        display: none
    }
}

.custom-graphics-bkg {
    bottom: 0;
    left: 0;
    object-fit: cover;
    opacity: .15;
    position: absolute;
    right: 0;
    top: 0
}

.custom-graphics-img {
    height: auto;
    max-width: 344px;
    position: absolute;
    width: 50%
}

.custom-graphics-img.left {
    bottom: 0;
    left: 0;
    max-width: 214px
}

.custom-graphics-img.right {
    right: 0;
    top: 0
}

.custom-graphics-shape {
    position: absolute
}

.custom-graphics-shape.left {
    border-radius: 50%;
    bottom: -90px;
    filter: blur(58px);
    height: 240px;
    left: 30px;
    transform: rotate(25.132deg);
    width: 108px
}

@media (min-width:992px) {
    .custom-graphics-shape.left {
        bottom: -106px;
        height: 300px;
        left: 30px;
        width: 154px
    }
}

.custom-graphics-shape.right {
    border-radius: 50%;
    filter: blur(58px);
    height: 240px;
    right: 30px;
    top: -140px;
    transform: rotate(25.132deg);
    width: 94px
}

@media (min-width:992px) {
    .custom-graphics-shape.right {
        height: 320px;
        right: 140px;
        top: -103px;
        width: 90px
    }
}

.game-carousel-win-screenshots .btn-small-button-light.c-grey-6,
.game-carousel-win-screenshots .c-grey-6,
.game-carousel-win-screenshots .c-grey-7 {
    color: #e3e7ef
}

.game-carousel-win-screenshots .c-grey-6 svg {
    fill: #e3e7ef
}

.game-carousel-win-screenshots .winning-screenshots-wrap {
    margin: 0
}

.game-carousel-win-screenshots .winning-screenshots-disclaimer {
    color: #7b8c98
}

.game-carousel-win-screenshots .btn-small-button-light svg,
.game-carousel-win-screenshots svg {
    fill: #fff
}

.game-carousel-win-screenshots .btn-small-button-light:hover,
.game-carousel-win-screenshots .btn-small-button-light:hover .c-grey-6 {
    color: var(--color-primary-500)
}

.game-carousel-win-screenshots .btn-small-button-light:hover .c-grey-6 svg,
.game-carousel-win-screenshots .btn-small-button-light:hover svg,
.game-carousel-win-screenshots .flickity-button:hover .flickity-button-icon {
    fill: var(--color-primary-500)
}

@media (min-width:1200px) {
    .game-carousel-win-screenshots .winning-screenshots-slider-item {
        margin: 0 24px 0 0;
        max-width: calc(20% - 20px);
        width: calc(20% - 20px)
    }

    .game-carousel-win-screenshots .winning-screenshots-slider-item:last-of-type {
        margin-right: 20px
    }
}

.game-section-header .search-box-wrapper {
    flex: 1
}

@media (min-width:1200px) {
    .game-section-header .search-box-wrapper {
        bottom: 0;
        flex: 100%;
        margin: auto;
        max-width: 770px
    }
}

.game-section-header .search-box {
    max-width: 854px
}

@media (min-width:992px) {
    .game-section-header .search-box {
        max-width: none
    }
}

.game-section-header .search-box-results {
    top: 54px
}

.game-section-header .results {
    max-height: 416px
}

.game-section-header .icon-search {
    height: 18px;
    width: 18px
}

.game-section-header .search-box {
    height: 50px
}

.game-section-header .search-ico-wrapper {
    display: flex
}

.game-section-header-img {
    margin: auto;
    max-width: 60%
}

@media (min-width:1200px) {
    .game-section-header-img {
        flex: 0 0 50%;
        margin: 0
    }
}

.game-section-header-img img {
    height: auto;
    width: 100%
}

.section-dark {
    background: var(--color-bg-900);
    padding: 1px 0
}

.section-dark .active-filter-groups {
    color: #cdd6dd
}

.game-results-header {
    margin-top: 16px
}

.game-results-header .filter-select-wrapper {
    flex: 0 0 250px;
    margin: 8px 0 0
}

@media (min-width:768px) {
    .game-results-header .filter-select-wrapper {
        margin-top: 0
    }
}

@media (min-width:1200px) {
    .game-results-header .filter-select-wrapper {
        flex: 0 0 25%
    }
}

.game-provider-info-panel {
    background: linear-gradient(180deg, #222e38, #1d2730);
    box-shadow: 0 10px 25px rgba(0, 0, 0, .45), inset 0 0 0 1px hsla(0, 0%, 100%, .1);
    color: #f0f3f7;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 8px
}

@media (min-width:568px) {
    .game-provider-info-panel {
        flex-direction: row
    }
}

.game-provider-info-panel .provider-body {
    flex: 1;
    padding: 12px;
    position: relative
}

@media (min-width:568px) {
    .game-provider-info-panel .provider-body {
        padding: 16px
    }
}

@media (min-width:992px) {
    .game-provider-info-panel .provider-body {
        padding: 24px
    }
}

.game-provider-info-panel .neo-fs-32 {
    position: relative;
    z-index: 2
}

.game-provider-info-panel .provider-img {
    align-items: center;
    background: rgba(123, 140, 152, .1);
    display: flex;
    justify-content: center;
    margin: 4px
}

@media (min-width:568px) {
    .game-provider-info-panel .provider-img {
        width: 160px
    }
}

.game-provider-info-panel .provider-img img {
    max-width: 100%
}

.game-provider-info-panel .provider-img picture {
    display: flex;
    justify-content: center;
    width: 100%
}

.game-provider-info-panel .provider-stats {
    align-self: center;
    flex: 0 0 100%;
    margin-top: 8px;
    order: 3;
    position: relative;
    z-index: 2
}

@media (min-width:992px) {
    .game-provider-info-panel .provider-stats {
        align-items: center;
        display: flex;
        gap: 16px
    }
}

.game-provider-info-panel .provider-stats .provider-btn {
    align-items: center;
    border: 1px solid var(--color-bg-600);
    border-radius: 2px;
    color: #cdd6dd;
    display: flex;
    flex: 1;
    gap: 8px;
    margin: 8px 0 0;
    padding: 8px
}

.game-provider-info-panel .provider-stats .provider-btn:hover {
    background: hsla(0, 0%, 100%, .1);
    color: var(--color-primary-500)
}

.game-provider-info-panel .provider-stats .provider-btn:hover svg {
    fill: var(--color-primary-500)
}

.game-provider-info-panel .provider-stats svg {
    fill: #cdd6dd
}

.game-provider-info-panel .provider-stats .icon {
    fill: var(--color-primary-500)
}

.games-top-filters {
    margin-top: 16px;
    position: relative;
    z-index: 2
}

.games-top-filters .game-genre-icon {
    height: 24px;
    width: 24px
}

.games-top-filters .cg-checkbox {
    display: none
}

.games-top-filters .game-type-filter {
    overflow-x: scroll;
    position: relative;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    border-radius: 2px;
    display: flex;
    margin: 8px -8px;
    padding: 0 8px;
    width: calc(100% + 16px)
}

@media (min-width:568px) {
    .games-top-filters .game-type-filter {
        margin: 16px -16px;
        padding: 0 16px;
        width: calc(100% + 32px)
    }
}

@media (min-width:768px) {
    .games-top-filters .game-type-filter {
        display: flex;
        height: 88px
    }
}

@media (min-width:992px) {
    .games-top-filters .game-type-filter {
        left: auto;
        margin: 0 0 8px;
        overflow: hidden;
        padding: 0;
        width: auto
    }
}

.games-top-filters .game-type-filter .flickity-viewport {
    z-index: 2
}

.games-top-filters .flickity-button {
    background: var(--color-bg-900);
    border: 1px solid var(--color-bg-600);
    border-radius: 2px;
    bottom: 0;
    height: 100%;
    top: 0;
    transform: none;
    width: 30px
}

.games-top-filters .flickity-button:disabled {
    opacity: 0;
    z-index: 0
}

.games-top-filters .flickity-button:before {
    bottom: -1px;
    content: "";
    position: absolute;
    top: -1px;
    width: 10px
}

.games-top-filters .flickity-button svg {
    fill: #cdd6dd
}

.games-top-filters .flickity-prev-next-button:hover {
    background: var(--color-bg-900)
}

.games-top-filters .flickity-prev-next-button:hover .flickity-button-icon {
    fill: var(--color-primary-500)
}

.games-top-filters .flickity-prev-next-button.next {
    background: var(--color-bg-900);
    right: 0
}

.games-top-filters .flickity-prev-next-button.next:before {
    background: linear-gradient(90deg, rgba(29, 39, 48, 0), #1d2730 56%);
    right: 29px
}

.games-top-filters .flickity-prev-next-button.previous {
    background: var(--color-bg-900);
    left: 0
}

.games-top-filters .flickity-prev-next-button.previous:before {
    background: linear-gradient(270deg, rgba(29, 39, 48, 0), #1d2730 56%);
    left: 29px
}

.games-top-filters .btn-border-white {
    background: rgba(123, 140, 152, .1);
    border-color: var(--color-text-600);
    transition: none
}

.games-top-filters .btn-border-white:hover {
    color: var(--color-primary-500)
}

.games-top-filters .btn-border-white:hover svg {
    fill: var(--color-primary-500)
}

.game-type-item {
    align-items: center;
    background: rgba(123, 140, 152, .1);
    border: 1px solid #4a5b68;
    border-radius: 2px;
    color: #e3e7ef;
    display: flex;
    flex: 0 0 110px;
    flex-direction: column;
    font-size: 12px;
    font-weight: 700;
    justify-content: center;
    line-height: 16px;
    min-height: 80px;
    overflow: hidden;
    padding: 8px;
    position: relative;
    text-align: center;
    text-transform: uppercase
}

.game-type-item:hover {
    cursor: pointer
}

.game-type-item .game-genre-icon {
    fill: var(--color-primary-500)
}

.game-type-item:not(:last-child) {
    margin-right: 4px
}

@media (min-width:768px) {
    .game-type-item {
        flex: 0 0 120px;
        height: 100%;
        width: 120px
    }

    .game-type-item:not(:last-child) {
        margin-right: 8px
    }
}

.game-type-item .filter-group-label {
    margin: 8px 0 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal
}

.game-type-item .facet-counter {
    align-items: center;
    background: rgba(123, 140, 152, .1);
    border-radius: 2px;
    color: #f0f3f7;
    display: flex;
    font-size: 12px;
    font-weight: 700;
    gap: 10px;
    line-height: 16px;
    padding: 2px 6px;
    position: absolute;
    right: 0;
    top: 0
}

.game-type-item.active {
    border: 1px solid var(--color-primary-500);
    color: var(--color-primary-500)
}

.game-type-item.active svg {
    fill: var(--color-primary-500)
}

.game-type-item.active .facet-counter {
    display: none
}

.game-type-item:hover {
    background: rgba(123, 140, 152, .2)
}




.active-filter-items-num {
    background: var(--color-primary-500);
    border-radius: 2px;
    color: #fff;
    display: none;
    font-size: 12px;
    line-height: 14px;
    padding: 4px;
    position: absolute;
    right: 4px;
    top: 4px
}

.game-section-header .search-box-wrapper {
    display: block;
    margin: 24px 0 0
}

@media (min-width:1200px) {
    .game-section-header .search-box-wrapper {
        max-width: none
    }
}

.game-section-header .search-box-input {
    background: transparent
}

.game-section-header .search-box {
    max-width: none;
    padding: 0
}


.last-tournament-card.purple .card-label,
.last-tournament-card.purple .last-tournament-type,

.last-tournament-card.gold .card-label,
.last-tournament-card.gold .last-tournament-type,

.last-tournament-card.blue .card-label,
.last-tournament-card.blue .last-tournament-type,

.last-tournament-card.green .card-label,
.last-tournament-card.green .last-tournament-type,





.card-content-text {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 16px;
    overflow: hidden;
    padding: 16px 16px 12px;
    text-align: left;
    width: 100%
}

.game-tournament-prize {
    align-items: center;
    background: linear-gradient(136deg, #fff -53.13%, #ffe70f 70.86%);
    border: none;
    border-radius: 3px;
    display: flex;
    justify-content: center;
    margin-top: auto;
    padding: 8px 0;
    width: 100%
}

.game-tournament-prize div {
    align-items: center;
    color: var(--color-text-900);
    display: inline-flex;
    font-family: neo-sans, sans-serif;
    font-size: 22px;
    font-weight: 700;
    line-height: 24px;
    position: relative;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .25)
}

.game-tournament-prize div img {
    flex-shrink: 0;
    height: 48px;
    left: 100%;
    margin-left: 8px;
    position: absolute;
    top: -20px;
    width: 48px
}

.game-tournament-prize.disabled {
    background: linear-gradient(136deg, #fff -53.13%, #a0a0a0 70.86%);
    filter: grayscale(1)
}

.game-tournament-buttons {
    display: flex;
    gap: 8px
}

.game-tournament-buttons .game-tournament-button {
    flex-basis: calc(50% - 4px);
    flex-grow: 0;
    flex-shrink: 0
}

.game-tournament-buttons .game-tournament-button-full {
    flex-basis: 100%
}
















.card-flipped .tournament-cards {
    transform: rotateY(180deg)
}








.game-tournament-prize-pool {
    font-family: neo-sans, sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px
}

@media (min-width:768px) {
    .game-tournament-prize-pool {
        font-size: 20px;
        line-height: 26px
    }
}

.game-tournament-prize-pool.yellow {
    color: #fbee22
}







.homepage-slider .homepage-tournaments,
.homepage-tournaments {
    align-items: stretch;
    display: flex;
    margin: 12px 0;
    position: relative
}

@media (min-width:992px) {

    .homepage-slider .homepage-tournaments,
    .homepage-tournaments {
        left: auto;
        max-width: none;
        overflow-x: hidden;
        padding-right: 0;
        width: auto
    }
}

.homepage-slider .homepage-tournaments .tournament-card,
.homepage-tournaments .tournament-card {
    padding: 0
}

.homepage-slider .homepage-tournaments .games-box-btn-main,
.homepage-tournaments .games-box-btn-main {
    border-radius: 50%;
    grid-column: 3;
    grid-row: 1/-1;
    height: 56px;
    margin: 0;
    width: 56px
}

@media (min-width:568px) {

    .homepage-slider .homepage-tournaments .games-box-btn-main,
    .homepage-tournaments .games-box-btn-main {
        margin: 8px
    }
}

.homepage-slider .homepage-tournaments .games-box-btn-main .icon-wrapper,
.homepage-tournaments .games-box-btn-main .icon-wrapper {
    border: 0;
    margin: 0
}

.homepage-slider .homepage-tournaments .games-box-btn-main:hover .icon-wrapper,
.homepage-tournaments .games-box-btn-main:hover .icon-wrapper {
    background: transparent
}

.homepage-slider .homepage-tournaments .games-box-btn-main:hover svg,
.homepage-tournaments .games-box-btn-main:hover svg {
    fill: #fff
}

.homepage-slider .homepage-tournaments .tournament-heading,
.homepage-tournaments .tournament-heading {
    grid-column: 2;
    grid-row: 1;
    height: auto;
    margin: 0
}

@media (min-width:992px) {

    .homepage-slider .homepage-tournaments .tournament-heading,
    .homepage-tournaments .tournament-heading {
        display: -webkit-box;
        -webkit-line-clamp: 1;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-box-orient: vertical
    }
}

.homepage-slider .homepage-tournaments .tournament-card-outer,
.homepage-tournaments .tournament-card-outer {
    box-shadow: none;
    flex: 1 0 276px;
    height: auto;
    margin-bottom: 16px
}

.homepage-slider .homepage-tournaments .tournament-card-outer:last-child,
.homepage-tournaments .tournament-card-outer:last-child {
    margin-right: 0
}

@media (min-width:992px) {

    .homepage-slider .homepage-tournaments .tournament-card-outer,
    .homepage-tournaments .tournament-card-outer {
        flex: 0 0 calc(25% - 12px);
        height: auto;
        margin-right: 12px;
        width: calc(25% - 12px)
    }
}

@media (min-width:768px) {

    .homepage-slider .homepage-tournaments .tournament-card .card-label,
    .homepage-tournaments .tournament-card .card-label {
        font-size: 14px;
        line-height: 10px
    }

    .homepage-slider .homepage-tournaments .tournament-card,
    .homepage-tournaments .tournament-card {
        height: 100%;
        max-width: none
    }
}

.card-other-info {
    margin-bottom: 8px;
    margin-top: 0 !important
}

.game-block {
    background-color: #000;
    background-size: cover;
    overflow: hidden;
    padding: 8px 0;
    position: relative;
    width: 100%
}

@media (min-width:992px) {
    .game-block {
        padding: 16px 0
    }
}

.game-detail-related-threads .context-menu-wrapper {
    display: none
}

.game-detail-discussion-wrapper {
    margin: auto;
    max-width: 1200px;
    padding: 16px 8px;
    width: 100%
}

@media (min-width:568px) {
    .game-detail-discussion-wrapper {
        padding: 24px 16px
    }
}

@media (min-width:992px) {
    .game-detail-discussion-wrapper {
        padding: 32px 16px
    }
}

html {
    scroll-padding-top: 144px
}

.game-block-overlay {
    bottom: 0;
    filter: blur(30px);
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.game-block-overlay img {
    height: 100%;
    width: 100%
}

.game-block-header {
    align-items: center;
    background: #1d2730;
    color: #fff;
    display: flex;
    font-family: neo-sans, sans-serif;
    font-size: 25px;
    font-weight: 700;
    padding: 8px;
    position: relative;
    text-align: center
}

@media (min-width:568px) {
    .game-block-header {
        min-height: 40px
    }
}

@media (min-width:992px) {
    .game-block-header {
        min-height: 42px
    }
}

.game-block-header .game-name-wrapper {
    flex: 1;
    font-size: 16px;
    line-height: 18px
}

.game-block-header .flag-live {
    bottom: -34px;
    padding: 4px 6px;
    right: 8px;
    top: auto;
    z-index: 1
}

@media (min-width:768px) {
    .game-block-header .flag-live {
        bottom: -42px;
        padding: 6px 8px;
        right: 12px
    }
}

@media (min-width:992px) {
    .game-block-header .flag-live {
        bottom: -52px;
        font-size: 16px;
        height: 36px;
        padding: 8px 10px;
        right: 16px
    }
}

.game-block-header .flag-live:before {
    height: 8px;
    width: 8px
}

.game-block-header .game-provider {
    display: inline-block;
    font-family: Noto Sans, Sans-Serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px
}

@media (min-width:768px) {
    .game-block-header .game-provider {
        font-size: 14px;
        line-height: 16px
    }
}

@media (min-width:992px) {
    .game-block-header .game-provider {
        font-size: 16px;
        line-height: 16px
    }

    .game-block-header .game-provider:hover:is(a) {
        color: var(--color-primary-500)
    }
}

.games-box-wrapper {
    margin: 0 auto;
    max-width: 1184px;
    position: relative;
    width: 100%
}

@media (max-width:1200px) {
    .games-box-wrapper {
        max-width: 1184px;
        width: calc(100% - 16px)
    }
}

.games-box-wrapper.age-confirm-opened .game-box-age-confirm {
    position: relative
}

@media (min-width:768px) {
    .games-box-wrapper.age-confirm-opened .game-box-age-confirm {
        position: absolute
    }
}

.games-box-wrapper.age-confirm-opened .games-box {
    position: absolute
}

@media (min-width:768px) {
    .games-box-wrapper.age-confirm-opened .games-box {
        position: relative
    }
}

.game-detail-main {
    color: #f8f8fa;
    column-gap: 20px;
    display: grid;
    grid-template-areas: "overview" "info" "stats" "themes" "about" "video" "provider";
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto auto auto auto auto;
    margin-left: auto;
    margin-right: auto;
    max-width: 1200px;
    padding: 16px 12px 8px;
    position: relative;
    width: 100%
}

@media (min-width:568px) {
    .game-detail-main {
        padding: 16px 16px 8px
    }
}

.game-detail-main>:not(:last-child) {
    margin-bottom: 16px
}

@media (min-width:568px) {
    .game-detail-main>:not(:last-child) {
        margin-bottom: 24px
    }
}

.game-detail-main h2 {
    align-items: center;
    display: flex;
    margin-bottom: 16px
}

.game-detail-main h2 svg {
    fill: var(--color-primary-500);
    margin-right: 8px
}

@media (min-width:768px) {
    .game-detail-main {
        grid-template-areas: "overview overview" "info stats" "info stats" "about about" "video video" "provider provider";
        grid-template-columns: 300px auto;
        grid-template-rows: auto 1fr auto auto
    }

    .game-detail-main .game-detail-main-info-and-themes {
        display: block
    }

    .game-detail-main .game-detail-main-overview {
        position: relative;
        z-index: 2
    }
}

@media (min-width:992px) {
    .game-detail-main {
        column-gap: 32px;
        grid-template-areas: "info overview" "info stats" "info about" "info video" "info provider";
        grid-template-columns: 300px 1fr;
        grid-template-rows: auto auto auto 1fr;
        padding: 16px
    }

    .game-detail-main .game-detail-main-info-and-themes {
        margin-bottom: 0
    }

    .game-detail-main .game-detail-main-stats {
        position: relative;
        z-index: 2
    }

    .game-detail-main .game-detail-main-about div.game-detail-main-about-text img {
        height: 200px
    }
}

@media (min-width:1200px) {
    .game-detail-main {
        column-gap: 48px;
        grid-template-columns: 320px 1fr;
        padding-bottom: 16px
    }
}

.game-detail-main .circle-purple {
    background: #9539c7;
    border-radius: 50%;
    box-shadow: 0 0 10px 5px #9539c7, 0 0 20px 10px #9539c7, 0 0 40px 20px #9539c7, 0 0 80px 40px #9539c7, 0 0 160px 100px #9539c7;
    height: 100px;
    left: -170px;
    opacity: .5;
    position: absolute;
    transform: rotate(45deg);
    width: 600px
}

.game-detail-main-info-and-themes {
    display: contents;
    font-family: Noto Sans, Sans-Serif;
    grid-area: info;
    position: relative;
    z-index: 2
}

.game-detail-main-info {
    background: linear-gradient(270deg, #222e38, #1d2730);
    border: 1px solid hsla(0, 0%, 100%, .1);
    border-radius: 2px;
    box-shadow: 0 24px 48px rgba(0, 0, 0, .4);
    margin-bottom: 16px
}

@media (min-width:568px) {
    .game-detail-main-info {
        margin: 0 auto 24px;
        max-width: 320px
    }
}

@media (min-width:768px) {
    .game-detail-main-info {
        margin: 0 0 24px
    }
}

.game-detail-main-info picture {
    display: block;
    padding-bottom: 77.185%;
    position: relative
}

.game-detail-main-info h2 {
    margin-top: 20px;
    padding-left: 16px
}

.game-detail-main-info img {
    height: auto;
    left: 0;
    position: absolute;
    width: 100%
}

.game-detail-main-info table {
    width: 100%
}

.game-detail-main-info table:last-of-type {
    margin-bottom: 16px
}

.game-detail-main-info table:last-of-type tr:last-child td {
    padding-bottom: 0
}

.game-detail-main-info table tr td {
    font-size: 16px;
    line-height: 22px;
    padding: 4px 16px;
    vertical-align: middle
}

.game-detail-main-info table tr td:last-child {
    text-align: right
}

.game-detail-main-info .hidden-info {
    display: none
}

@media (min-width:992px) {
    .game-detail-main-info .hidden-info {
        display: table-row
    }
}

.game-detail-main-info .hide-hidden-info {
    display: none
}

.game-detail-main-info .hide-hidden-info,
.game-detail-main-info .show-hidden-info {
    padding: 0 0 16px;
    text-align: center !important
}

.game-detail-main-info .hide-hidden-info span,
.game-detail-main-info .show-hidden-info span {
    color: var(--color-primary-500);
    font-size: 16px;
    font-weight: 700;
    line-height: 22px
}

.game-detail-main-info .hide-hidden-info span svg,
.game-detail-main-info .show-hidden-info span svg {
    fill: var(--color-primary-500);
    left: 1px;
    position: relative;
    top: 2px
}

@media (min-width:992px) {

    .game-detail-main-info .hide-hidden-info,
    .game-detail-main-info .show-hidden-info {
        display: none
    }
}

.game-detail-main-info.game-week-promotion {
    border: 1px solid var(--color-secondary-800)
}

.game-themes-pills {
    margin: 0 0 16px
}

@media (min-width:568px) {
    .game-themes-pills {
        margin: 0 0 24px
    }
}

@media (min-width:768px) {
    .game-themes-pills {
        margin: 24px 0 0
    }
}

.game-detail-main-overview {
    font-family: neo-sans, sans-serif;
    font-size: 16px;
    grid-area: overview;
    line-height: 22px;
    position: relative;
    z-index: 2
}

@media (min-width:992px) {
    .game-detail-main-overview {
        font-size: 18px;
        line-height: 24px
    }
}

.games-box-btn-secondary {
    align-items: center;
    background: linear-gradient(90deg, #4c1287, #a752ff);
    border: 2px solid #9539c7;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-family: neo-sans, sans-serif;
    font-size: 14px;
    font-weight: 700;
    gap: 8px;
    justify-content: center;
    line-height: 18px;
    margin-top: 8px;
    padding: 12px 16px
}

@media (min-width:568px) {
    .games-box-btn-secondary {
        font-size: 16px;
        height: 50px;
        line-height: 20px
    }
}

@media (min-width:992px) {
    .games-box-btn-secondary svg {
        height: 24px;
        width: 24px
    }
}

.games-box-btn-secondary:hover {
    background: linear-gradient(90deg, #a752ff, #4c1287)
}

.games-box-btn-main {
    align-items: center;
    background: linear-gradient(270deg, #21c12e, #0f8815);
    border: 2px solid #5dd667;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
    display: flex;
    justify-content: center;
    padding: 8px 16px;
    text-align: left
}

@media (min-width:568px) {
    .games-box-btn-main {
        padding: 16px
    }
}

.games-box-btn-main:hover {
    background: linear-gradient(270deg, #0f8815, #21c12e)
}

.games-box-btn-main:hover svg {
    fill: var(--color-primary-500)
}

.games-box-btn-main:hover .icon-wrapper {
    background: #fff
}

.games-box-btn-main svg {
    fill: #fff
}

.games-box-btn-main .icon-wrapper {
    align-items: center;
    border: 1px solid #fff;
    border-radius: 50%;
    display: flex;
    flex-shrink: 0;
    height: 36px;
    justify-content: center;
    margin-right: 8px;
    width: 36px
}

.games-box-btn-main strong {
    display: block;
    font-family: neo-sans, sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 22px
}

@media (min-width:568px) {
    .games-box-btn-main strong {
        font-size: 20px;
        line-height: 24px
    }
}

.games-box-btn-main small {
    font-size: 14px;
    line-height: 16px
}

@media (min-width:568px) {
    .games-box-btn-main {
        height: 76px
    }
}

.btn-game-like-trigger .by-state {
    display: none
}

.btn-game-like-trigger .by-state.active {
    display: flex;
    fill: var(--color-primary-500)
}

.btn-game-discussion span,
.btn-game-share span {
    display: none
}

@media (min-width:568px) {

    .btn-game-discussion span,
    .btn-game-share span {
        display: inline
    }
}

@media (min-width:768px) {

    .btn-game-discussion span,
    .btn-game-share span {
        display: none
    }
}

@media (min-width:992px) {

    .btn-game-discussion span,
    .btn-game-share span {
        display: inline
    }
}

.game-vote-btn-wrapper {
    border: 1px solid var(--color-bg-600);
    border-radius: 2px;
    display: flex;
    height: 40px;
    margin-right: auto;
    order: 1
}

@media (min-width:768px) {
    .game-vote-btn-wrapper {
        margin-left: auto;
        margin-right: 0
    }
}

.game-vote-btn-wrapper .btn-icon-link:hover {
    background: rgba(123, 140, 152, .1);
    cursor: pointer
}

.btn-icon-link {
    align-items: center;
    color: #f0f3f7;
    display: inline-flex;
    font-family: Noto Sans, sans-serif;
    font-size: 14px;
    gap: 8px;
    justify-content: center;
    line-height: 18px;
    order: 2;
    padding: 8px
}

@media (min-width:768px) {
    .btn-icon-link {
        border: none;
        font-size: 16px;
        height: auto;
        line-height: 20px;
        order: 1;
        padding: 0 8px
    }
}

.btn-icon-link.active svg {
    fill: var(--color-primary-500)
}

.btn-icon-link:hover {
    color: var(--color-primary-500);
    cursor: pointer
}

.btn-icon-link:hover svg {
    fill: var(--color-primary-500)
}

.btn-icon-link svg {
    fill: #fff;
    flex-shrink: 0
}

@media (min-width:768px) {
    .btn-icon-link svg {
        height: 24px;
        width: 24px
    }
}

@media (min-width:992px) {
    .btn-icon-link svg {
        height: 18px;
        width: 18px
    }
}

.btn-icon-link .active .loader {
    display: inline-flex
}

.btn-icon-link .loader {
    border-width: 3px;
    display: none;
    height: 16px;
    margin-right: 8px;
    width: 16px
}

.vote-dislike {
    align-items: center;
    border-left: 1px solid var(--color-bg-600);
    display: flex;
    padding: 6px
}

.vote-dislike .filled {
    display: none
}

.vote-dislike svg {
    fill: #fff
}

.vote-dislike.active svg {
    display: none
}

.vote-dislike.active .filled {
    display: block
}

.btn-game {
    align-items: center;
    border: 1px solid #4a5b68;
    border-radius: 2px;
    color: #f0f3f7;
    cursor: pointer;
    display: flex;
    font-family: Noto Sans, sans-serif;
    font-size: 14px;
    font-weight: 400;
    gap: 8px;
    justify-content: center;
    line-height: 19px;
    padding: 8px;
    transition: background-color .2s ease-in-out
}

@media (min-width:768px) {
    .btn-game {
        font-size: 16px;
        height: 40px
    }
}

@media (min-width:992px) {
    .btn-game {
        padding: 8px 16px
    }
}

.btn-game .active-btn,
.btn-game.voted .vote-not-active,
.btn-game.voted:hover .vote-not-active {
    display: none
}

.btn-game.voted .vote-active,
.btn-game.voted:hover .vote-active {
    display: inline
}

.btn-game:hover {
    background: rgba(123, 140, 152, .2);
    color: var(--color-primary-500)
}

.btn-game:hover svg,
.btn-game:hover>svg {
    fill: var(--color-primary-500)
}

@media (min-width:768px) {
    .btn-game svg {
        height: 24px;
        width: 24px
    }
}

.btn-game .active .loader {
    display: inline-flex
}

.btn-game .loader {
    border-width: 3px;
    display: none;
    height: 16px;
    margin-right: 8px;
    width: 16px
}

.btn-game.none {
    display: none
}

.btn-user-list {
    align-items: center;
    display: flex;
    gap: 8px
}

.btn-user-list:hover svg {
    fill: var(--color-primary-500)
}

.games-box {
    border: 1px solid hsla(0, 0%, 100%, .1);
    box-sizing: border-box;
    color: #fff;
    filter: drop-shadow(0 24px 48px rgba(0, 0, 0, .4));
    margin: auto;
    overflow: hidden;
    position: relative;
    width: 100%
}

.vote-link-down svg {
    fill: #ed9c00;
    flex-shrink: 0
}

.vote-link-down:hover svg {
    fill: #e19500
}

.vote-link-down.voted svg {
    fill: var(--color-ui-error-red)
}

.games-box-game {
    align-items: center;
    display: none;
    height: 100%;
    left: 0;
    margin: 0 auto;
    top: 0;
    width: 100%
}

.games-box-placeholder {
    height: 100%;
    margin: 0 auto;
    position: relative;
    width: 100%
}

.games-box-placeholder .main-game-btn-wrapper {
    left: 50%;
    margin: 0 auto;
    max-width: 280px;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    z-index: 9
}

@media (min-width:568px) {
    .games-box-placeholder .main-game-btn-wrapper {
        max-width: 320px
    }
}

.games-box-placeholder .release-date {
    color: #f0f3f7;
    font-family: neo-sans, sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 18px;
    margin-top: 16px;
    text-align: center
}

@media (min-width:568px) {
    .games-box-placeholder .release-date {
        font-size: 16px;
        line-height: 20px;
        margin-top: 24px
    }
}

@media (min-width:992px) {
    .games-box-placeholder .release-date {
        margin-top: 32px
    }
}

.games-box-content {
    align-items: center;
    background: #000;
    display: flex;
    height: 100%;
    max-height: calc(100vh - 290px);
    min-height: 200px;
    overflow: hidden;
    position: relative
}

.games-box-content .iframe-wrapper {
    margin: auto;
    max-height: 100%
}

.games-box-content .live-stream-video,
.games-box-content iframe {
    display: block;
    height: 100%;
    margin: auto;
    width: 100%
}

.games-box-placeholder-image {
    align-items: center;
    display: flex;
    justify-content: center;
    margin: auto;
    opacity: .35;
    padding-bottom: 57.4%;
    pointer-events: none;
    text-align: center;
    user-select: none;
    width: 100%
}

.games-box-placeholder-image picture {
    height: 100%;
    width: 100%
}

.games-box-placeholder-image img {
    height: 100%;
    left: 0;
    margin: 0 auto;
    object-fit: cover;
    position: absolute;
    width: 100%
}

.games-box-placeholder-b:has(.play-in-casino-wrapper) .games-box-placeholder-image,
.games-box-placeholder-c:has(.play-in-casino-wrapper) .games-box-placeholder-image {
    padding-bottom: 85%
}

@media (min-width:568px) {

    .games-box-placeholder-b:has(.play-in-casino-wrapper) .games-box-placeholder-image,
    .games-box-placeholder-c:has(.play-in-casino-wrapper) .games-box-placeholder-image {
        padding-bottom: 57.4%
    }
}

.games-box-placeholder-b:has(.play-in-casino-wrapper) .main-game-btn-wrapper,
.games-box-placeholder-c:has(.play-in-casino-wrapper) .main-game-btn-wrapper {
    top: 30%
}

@media (min-width:768px) {

    .games-box-placeholder-b:has(.play-in-casino-wrapper) .main-game-btn-wrapper,
    .games-box-placeholder-c:has(.play-in-casino-wrapper) .main-game-btn-wrapper {
        top: 50%
    }
}

.games-box-placeholder-b+.label-purple,
.games-box-placeholder-c+.label-purple {
    border-radius: 0;
    clip-path: polygon(0 0, 4% 100%, 100% 100%, 100% 0);
    left: auto;
    padding: 4px 12px 4px 20px;
    right: 0
}

.game-detail-controls {
    background: var(--color-bg-900);
    display: flex;
    flex-direction: column;
    font-family: neo-sans, sans-serif;
    font-size: 12px;
    justify-content: space-between;
    margin: auto;
    max-width: 1200px;
    padding: 12px
}

@media (min-width:992px) {
    .game-detail-controls {
        padding: 16px 24px
    }
}

.games-box-fullscreen .game-detail-controls {
    display: none
}

.games-box-controls-buttons {
    align-items: center;
    display: flex
}

@media (min-width:768px) {
    .games-box-controls-buttons {
        flex: 1;
        flex-wrap: wrap;
        position: relative
    }
}

.games-box-controls-buttons .btn-game {
    flex: 0 1 auto
}

.games-box-controls-buttons svg {
    fill: #fff
}

.games-box-controls-buttons .btn-report-problem {
    display: none
}

@media (min-width:768px) {
    .games-box-controls-buttons .btn-report-problem {
        display: flex
    }
}

.games-box-controls-buttons .btn-report-problem span {
    display: none
}

@media (min-width:992px) {
    .games-box-controls-buttons .btn-report-problem span {
        display: flex
    }
}

.game-icon-link {
    align-items: center;
    display: flex;
    gap: 8px
}

.game-icon-link svg {
    padding: 2px
}

.games-box-controls-vote {
    display: none
}

@media (min-width:768px) {
    .games-box-controls-vote {
        display: flex
    }
}

.games-box-controls-vote.btn-game {
    flex: 0 0 40px
}

@media (min-width:768px) {
    .games-box-controls-vote>span>span {
        font-size: 16px
    }
}

.game-block-header-fullscreen {
    display: none
}

@media (min-width:768px) {
    .game-block-header-fullscreen {
        display: flex;
        order: 2
    }
}

.games-box-header-switch {
    align-items: center;
    cursor: pointer;
    display: flex;
    font-family: neo-sans, sans-serif;
    font-size: 12px;
    font-weight: 700;
    justify-content: center;
    position: relative;
    transition: all .2s
}

.games-box-header-switch.active,
.games-box-header-switch:active,
.games-box-header-switch:focus,
.games-box-header-switch:hover {
    text-decoration: none
}

.games-box-header-switch:hover {
    cursor: pointer
}

.games-box-header-switch:hover svg {
    fill: var(--color-primary-500)
}

.games-box-header-switch-exit-fullscreen {
    display: none
}

.game-player-modal {
    position: relative
}

.game-player-modal .cg-modal-close {
    cursor: pointer;
    right: 0;
    top: -40px
}

.game-player-modal .cg-modal-close:hover svg {
    fill: var(--color-primary-500)
}

.game-player-modal .game-block-header-fullscreen {
    display: flex
}

.games-box-header-switch-fullscreen-fallback {
    align-items: center;
    color: #fff;
    display: none
}

@media (max-height:950px) and (orientation:landscape) {
    .games-box-fullscreen .games-box-header-switch-exit-fullscreen {
        display: none !important
    }
}

.btn-play-for-real {
    display: none;
    margin-right: auto
}

@media (min-width:768px) {
    .btn-play-for-real {
        display: flex
    }
}

.available-mini-casinos {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 16px 0
}

@media (min-width:568px) {
    .available-mini-casinos {
        gap: 8px
    }
}

@media (min-width:768px) {
    .available-mini-casinos {
        flex-direction: row;
        flex-wrap: wrap;
        margin: 24px 0
    }
}

.available-mini-casinos .casino-card-mini {
    margin: 0;
    text-align: left
}

@media (min-width:768px) {
    .available-mini-casinos .casino-card-mini {
        flex: 0 0 49%
    }
}

.casino-game-genre-item {
    align-items: center;
    border: 1px solid #e3e7ef;
    border-radius: 2px;
    display: flex;
    flex: 1 0 calc(33.3% - 4px);
    font-family: Noto Sans, Sans-Serif;
    font-size: 12px;
    font-weight: 700;
    gap: 8px;
    justify-content: center;
    line-height: 18px;
    margin: 0;
    padding: 6px 12px;
    position: relative;
    text-align: center;
    white-space: nowrap
}

.casino-game-genre-item.active {
    background: #fff
}

.casino-game-genre-item .game-genre-icon {
    flex-shrink: none;
    height: 16px;
    width: 16px
}

.casino-game-genre-item-m {
    font-size: 12px;
    line-height: 16px;
    min-height: 68px;
    min-width: 100px
}

.casino-game-genre-item-m .availability-icon {
    height: 14px;
    width: 14px
}

.casino-game-genre-item-m .game-genre-icon {
    height: 22px;
    width: 22px
}

.casino-open-icons-item {
    align-items: center;
    display: flex;
    flex: 0 0 50%;
    margin: 2px 0;
    position: relative;
    text-align: left
}

.casino-open-icons-item svg {
    margin: 0 8px 0 0
}

.casino-open-icons-item.active svg {
    fill: var(--color-primary-500)
}

.casino-game-genre-items-ul {
    display: flex;
    gap: 4px;
    margin: 12px 0 0;
    overflow-x: scroll;
    padding: 0 0 8px;
    position: relative
}

@container casino-card (max-width: 735px) {
    .casino-game-genre-items-ul {
        margin: 12px 0 0;
        padding: 0 40px 8px 0
    }
}

@container casino-card (min-width: 736px) {
    .casino-game-genre-items-ul {
        gap: 12px;
        margin: 16px 0 0;
        padding: 0 50px 0 0
    }
}

.casino-game-genre-items-ul .availability-icon {
    height: 12px;
    position: absolute;
    right: 2px;
    top: 2px;
    width: 12px
}

.safety-index {
    align-items: center;
    display: flex;
    font-size: 12px;
    line-height: 16px
}

@media (min-width:568px) {
    .safety-index {
        font-size: 14px;
        line-height: 19px
    }
}

.safety-index .text-wrapper {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    line-height: 16px
}

.safety-index .rating-small {
    font-family: Noto Sans, Sans-Serif;
    font-size: 12px;
    line-height: 14px
}

@media (min-width:568px) {
    .safety-index .rating-small {
        font-size: 14px;
        line-height: 16px
    }
}

.safety-index .rating-group {
    border-radius: 2px;
    color: #fff;
    font-family: neo-sans, sans-serif;
    font-size: 16px;
    line-height: 12px;
    padding: 4px 6px
}

@media (min-width:568px) {
    .safety-index .rating-group {
        line-height: 16px
    }
}

.safety-index-b {
    align-items: center;
    display: flex;
    gap: 8px;
    margin: 8px 0
}

.safety-index-b .status-label {
    align-items: center;
    border-radius: 2px;
    display: flex;
    font-size: 16px;
    height: 30px;
    justify-content: center;
    line-height: 20px;
    width: 50px
}

@media (min-width:768px) {
    .safety-index-b .status-label {
        font-size: 20px;
        height: 34px;
        line-height: 24px;
        width: 54px
    }
}

.safety-index-b .safety-index-text {
    font-size: 14px;
    line-height: 18px
}

@media (min-width:768px) {
    .safety-index-b .safety-index-text {
        font-size: 16px;
        line-height: 20px
    }
}

.rating-b.perfect {
    background: #00833e;
    color: #fff
}

.rating-b.very_good {
    background: #3a9564;
    color: #fff
}

.rating-b.good {
    background: #7fa63a;
    color: #fff
}

.rating-b.questionable {
    background: #fac30c;
    color: #000
}

.rating-b.bad {
    background: #e97f14;
    color: #1f1f1f
}

.rating-b.very_bad {
    background: #d22f23;
    color: #fff
}

.rating-b.fresh {
    background: #23b3b8;
    color: #fff
}

.safety-index-label-b {
    color: var(--color-text-600);
    font-family: Noto Sans, Sans-Serif;
    font-size: 10px;
    font-weight: 400;
    line-height: 14px;
    text-transform: none
}

@media (min-width:568px) {
    .safety-index-label-b {
        font-size: 12px;
        line-height: 16px
    }
}

.safety-index-label {
    font-family: Noto Sans, Sans-Serif;
    font-size: 12px;
    line-height: 14px;
    margin: 0 4px 0 0
}

@media (min-width:568px) {
    .safety-index-label {
        font-size: 14px;
        line-height: 18px
    }
}

.safety-index-text {
    align-items: center;
    display: flex;
    font-size: 16px;
    line-height: 18px;
    margin: 0
}

@media (min-width:768px) {
    .safety-index-text {
        font-size: 18px;
        line-height: 20px
    }
}

.safety-index-text-c {
    display: inline-block
}

@media (min-width:768px) {
    .sm\:squared-safety-index .text-wrapper {
        justify-content: center;
        text-align: center
    }

    .sm\:squared-safety-index .icon {
        margin-bottom: 4px;
        margin-right: 0
    }

    .sm\:squared-safety-index .safety-index-label {
        margin-right: 0
    }
}

.warning {
    align-items: flex-start;
    border: 1px solid #000;
    border-radius: 2px;
    cursor: pointer;
    display: flex;
    font-size: 14px;
    line-height: 18px;
    padding: 8px;
    text-align: left
}

@media (min-width:568px) {
    .warning {
        padding: 16px
    }
}

.warning div {
    display: flex
}

.warning .description {
    display: none;
    font-size: 14px;
    padding-top: 8px
}

.warning .hideable-link {
    color: var(--color-primary-500)
}

.warning .hideable-link:hover {
    color: var(--color-primary-600);
    cursor: pointer;
    text-decoration: underline
}

.warning .icon {
    align-self: start;
    margin-right: 8px
}

.warning .expand {
    align-self: start;
    margin: 2px 0 0 8px;
    transition: .2s ease-in-out
}

.warning.expanded .description {
    display: initial
}

.warning.expanded .expand {
    transform: rotate(-180deg)
}

.warning .content {
    flex-direction: column;
    flex-grow: 1
}

.warning-danger .title {
    display: inline;
    font-weight: 700
}

.warning-important {
    border: none
}

.casino-detail-box-warnings {
    border-bottom: 1px solid #cdd6dd;
    margin-top: 8px
}

.casino-detail-box-description {
    flex: 1 0 100%
}

.casino-detail-main-col .warning-important {
    padding: 0 8px
}

.casino-detail-main-col .warning-important .description {
    padding: 0
}

.casino-detail-main-col .warning {
    cursor: default;
    margin-bottom: 12px
}

@media (min-width:992px) {
    .casino-detail-main-col .warning {
        margin-bottom: 16px
    }
}

.casino-detail-main-col .warning .expand {
    display: none
}

.casino-detail-main-col .warning .description {
    display: initial
}

.casino-detail-warnings-wrapper {
    order: 2
}

.casino-card-content .warning-important,
.top-casino-card-pros-and-cons .warning-important {
    padding: 8px
}

.casino-card-content .warning-important .title,
.top-casino-card-pros-and-cons .warning-important .title {
    display: -webkit-box;
    flex-grow: 1;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-height: 1.2;
    overflow: hidden
}

.casino-card-content .warning-important.expanded .title,
.top-casino-card-pros-and-cons .warning-important.expanded .title {
    display: block
}

.warning-red {
    background: #feebed;
    border-color: #ed3445
}

.warning-red svg {
    fill: #ed3445
}

.warning-orange {
    background: #fcf0d9;
    border-color: #ed9c00
}

.warning-orange svg {
    fill: #ed9c00
}

.warning-other {
    background: #d9ecff;
    border-color: #007dff
}

.warning-other svg {
    fill: #007dff
}

.c-warning-red {
    color: #ed3445;
    fill: #ed3445
}

.c-warning-orange {
    color: #ed9c00;
    fill: #ed9c00
}

.c-warning-other {
    color: #007dff;
    fill: #007dff
}

.warning-indicator {
    border-left-width: 4px;
    filter: drop-shadow(0 4px 8px rgba(29, 39, 48, .16));
    font-family: neo-sans, sans-serif;
    margin: 4px 0
}

@media (min-width:568px) {
    .warning-indicator {
        display: none
    }
}

.warning-indicator .icon {
    margin-right: 12px;
    position: relative
}

.warning-indicator .title {
    font-size: 14px;
    font-weight: 700
}

.warning-indicator .expand {
    align-self: center
}

.expandable-box {
    align-items: center;
    background: #fff;
    border-radius: 2px;
    box-shadow: 0 1px 0 #e3e7ef;
    color: var(--color-text-900);
    cursor: pointer;
    display: flex;
    font-size: 14px;
    line-height: 18px;
    margin: 0 auto 8px;
    min-height: 50px;
    padding: 0 16px;
    text-align: left
}

@media (min-width:992px) {
    .expandable-box:hover h3 {
        color: var(--color-primary-500)
    }

    .expandable-box:hover .down,
    .expandable-box:hover .up {
        fill: var(--color-primary-500)
    }
}

@media (min-width:568px) {
    .expandable-box {
        font-size: 16px;
        line-height: 20px
    }
}

.expandable-box h3,
.expandable-box>strong,
.typography .expandable-box h3 {
    font-size: 14px;
    font-weight: 700;
    line-height: 18px;
    margin: 0 8px 0 0
}

@media (min-width:568px) {

    .expandable-box h3,
    .expandable-box>strong,
    .typography .expandable-box h3 {
        font-size: 16px;
        line-height: 20px;
        margin: 0 16px 0 0
    }
}

.expandable-box>h3,
.expandable-box>span.text-bold,
.expandable-box>strong,
.typography .expandable-box>h3 {
    align-items: center;
    display: inline-flex;
    flex: 1 0;
    font-family: neo-sans, sans-serif;
    margin-right: 8px;
    min-height: 50px;
    padding: 16px 0
}

.expandable-box.toggle {
    flex-wrap: wrap;
    height: auto
}

.expandable-box.toggle>h3,
.expandable-box.toggle>strong {
    color: var(--color-primary-500)
}

.expandable-box.toggle .expandable-box-content,
.expandable-box.toggle p {
    display: block;
    flex: 1 0 100%
}

.expandable-box.toggle .down {
    display: none
}

.expandable-box.toggle .up {
    display: block;
    fill: var(--color-primary-500)
}

.expandable-box .up {
    display: none
}

.expandable-box .down,
.expandable-box .up {
    fill: var(--color-text-600);
    height: 16px;
    margin-left: auto;
    width: 16px
}

@media (min-width:568px) {

    .expandable-box .down,
    .expandable-box .up {
        height: 18px;
        width: 18px
    }
}

.expandable-box svg {
    flex-shrink: 0;
    margin-left: auto
}

.expandable-box p:not(:last-child) {
    margin-bottom: 16px
}

.expandable-box .expandable-box-content,
.expandable-box>p {
    color: var(--color-text-900);
    display: none;
    margin-bottom: 16px
}

.expandable-box a {
    color: var(--color-text-900)
}

.expandable-box a:hover {
    text-decoration: underline
}

.expandable-box .expandable-box-content,
.expandable-box a,
.expandable-box p {
    font-size: 14px;
    line-height: 18px;
    position: relative
}

@media (min-width:568px) {

    .expandable-box .expandable-box-content,
    .expandable-box a,
    .expandable-box p {
        font-size: 16px;
        line-height: 20px
    }
}

.expandable-box-dark {
    background: rgba(123, 140, 152, .1);
    border: 1px solid var(--color-bg-600);
    box-shadow: none;
    color: #f0f3f7
}

.expandable-box-dark .expandable-box-content {
    color: #f0f3f7
}

.results-header-top {
    color: var(--color-text-900);
    display: none
}

.tippy-box .results-header-top {
    display: block;
    max-width: 300px
}

.slideable-panel .results-header-top {
    display: block
}

.results-header-top p {
    border-bottom: 1px solid #cdd6dd;
    clear: both;
    color: var(--color-text-600);
    margin-bottom: 8px;
    padding: 8px 0
}

@media (min-width:1200px) {
    .results-header-top p {
        border-bottom: none;
        margin-bottom: 0;
        padding: 8px 0 0
    }
}

.results-header-top svg {
    vertical-align: middle
}

@media (min-width:1200px) {
    .results-header-top svg {
        height: 32px;
        width: 32px
    }
}

.list-section-perex {
    color: #4a5b68;
    font-size: 14px;
    line-height: 17px;
    margin: 15px 0
}

@media (min-width:768px) {
    .list-section-perex {
        font-size: 15px;
        line-height: 20px
    }
}

.list-section-perex-casino-widget {
    margin-bottom: 5px;
    margin-top: 0
}

.section-tabs-wrapper {
    border-bottom: 1px solid #dce3e8;
    height: 71px;
    position: relative
}

@media (min-width:768px) {
    .section-tabs-wrapper {
        overflow-x: visible
    }
}

.section-tabs-wrapper .cg-tab-main.active,
.section-tabs-wrapper .cg-tab-main:hover {
    background: #f0f3f7
}

@media (min-width:768px) {
    .section-tabs {
        margin: auto;
        padding: 0 16px
    }
}

@media (min-width:1200px) {
    .section-tabs {
        max-width: 1200px
    }
}

.section-tabs-visible {
    padding: 0 8px
}

@media (min-width:1200px) {
    .section-tabs-visible {
        padding: 0 16px
    }
}

.list-top {
    background-color: #f8f8fa;
    overflow: auto
}

.in-page-nav-wrapper {
    background: var(--color-bg-900);
    position: sticky;
    top: 40px;
    z-index: 10
}

@media (min-width:768px) {
    .in-page-nav-wrapper {
        height: 36px;
        overflow: hidden;
        top: 68px
    }
}

@media (min-width:992px) {
    .in-page-nav-wrapper {
        top: 87px
    }
}

.in-page-nav-wrapper .in-page-nav-inside {
    margin: auto;
    position: relative
}

@media (min-width:1200px) {
    .in-page-nav-wrapper .in-page-nav-inside {
        max-width: 1200px
    }
}

.in-page-nav {
    align-items: center;
    color: #e3e7ef;
    display: flex;
    padding: 8px 12px;
    position: sticky
}

@media (min-width:568px) {
    .in-page-nav {
        padding: 8px 16px
    }
}

@media (min-width:768px) {
    .in-page-nav.aligned-right .in-page-arrow {
        display: none
    }

    .in-page-nav.aligned-right .in-page-arrow.in-page-arrow-left {
        display: block
    }
}

.in-page-nav .js-in-page-tabs {
    height: 20px;
    overflow: hidden
}

.in-page-nav .in-page-arrow {
    display: none;
    height: 20px;
    position: relative
}

@media (min-width:768px) {
    .in-page-nav .in-page-arrow {
        display: block
    }
}

.in-page-nav .in-page-arrow:before {
    background: linear-gradient(90deg, rgba(25, 35, 44, 0), #19232c 60%);
    content: "";
    height: 100%;
    left: -24px;
    position: absolute;
    top: 0;
    width: 24px;
    z-index: 10
}

.in-page-nav .in-page-arrow svg {
    fill: #cdd6dd
}

.in-page-nav .in-page-arrow.in-page-arrow-left {
    display: none;
    left: 0
}

.in-page-nav .in-page-arrow.in-page-arrow-left:before {
    background: linear-gradient(-90deg, rgba(25, 35, 44, 0), #19232c 60%);
    left: 20px
}

.in-page-nav .in-page-arrow:hover {
    cursor: pointer
}

.in-page-nav .in-page-arrow:hover svg {
    fill: var(--color-primary-500)
}

.in-page-nav ul {
    display: flex;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none
}

.in-page-nav ul::-webkit-scrollbar {
    display: none
}

.in-page-nav ul li {
    align-items: center;
    display: flex;
    padding: 0 12px 0 8px
}

@media (min-width:568px) {
    .in-page-nav ul li {
        padding: 0 16px 0 8px
    }
}

.in-page-nav ul li:before {
    background: var(--color-bg-600);
    border-radius: 50%;
    content: "";
    height: 6px;
    left: -8px;
    position: relative;
    width: 6px
}

.in-page-nav ul li.highlighted a {
    color: #fff
}

.in-page-nav ul li.highlighted:before {
    background: var(--color-primary-500);
    box-shadow: 0 0 5px var(--color-primary-500), 0 0 2px var(--color-primary-500)
}

.in-page-nav a {
    color: #a2aeb7;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    white-space: nowrap
}

.in-page-nav a:hover {
    color: #fff
}

.in-page-nav b {
    white-space: nowrap
}

.js-in-page-nav-section {
    scroll-margin-top: 80px
}

@media (min-width:768px) {
    .js-in-page-nav-section {
        scroll-margin-top: 120px
    }
}

.section-header-dark {
    background: var(--color-bg-900);
    display: flow-root;
    overflow: hidden;
    position: relative
}

.section-header-dark .list-section-heading {
    color: #fff
}

.section-header-dark:has(.page-header) .header-breadcrumb {
    margin-bottom: -48px
}

.section-header-dark .header-breadcrumb {
    color: #e3e7ef
}

.section-header-dark .header-breadcrumb span.item {
    color: #cdd6dd
}

.section-header-dark .header-breadcrumb a {
    color: #e3e7ef
}

.section-header-dark .header-breadcrumb a.active,
.section-header-dark .header-breadcrumb a:hover {
    color: var(--color-primary-500)
}

.section-header-dark .header-breadcrumb a.active svg.home,
.section-header-dark .header-breadcrumb a:hover svg.home {
    fill: var(--color-primary-500)
}

.section-header-dark .header-breadcrumb svg {
    fill: #e3e7ef
}

.section-header-darker {
    background: var(--color-bg-950)
}

.casino-detail-breadcrumb {
    display: none
}

@media (min-width:1200px) {
    .casino-detail-breadcrumb {
        display: block
    }
}

.casino-detail-breadcrumb .header-breadcrumb {
    position: static
}

.cg-tabs-main {
    display: flex;
    height: 70px;
    justify-content: flex-start;
    padding: 0 8px
}

@media (min-width:568px) {
    .cg-tabs-main {
        padding: 0 12px
    }
}

@media (min-width:1200px) {
    .cg-tabs-main {
        margin: auto;
        max-width: 1200px;
        padding: 0
    }
}

.cg-tabs-scrollable {
    height: 71px;
    overflow-x: scroll;
    position: relative;
    white-space: nowrap
}

@media (min-width:768px) {
    .cg-tabs-scrollable {
        height: 70px;
        overflow-x: visible;
        padding-left: 0
    }
}

.cg-tabs-scrollable .cg-tab-main {
    min-width: 130px
}

.cg-tab-main {
    align-items: center;
    background: #e3e7ef;
    border-left: 1px solid #cdd6dd;
    border-top: 1px solid #cdd6dd;
    color: var(--color-text-600);
    cursor: pointer;
    display: flex;
    flex: 1;
    flex-direction: column;
    font-family: Noto Sans, sans-serif;
    font-size: 10px;
    font-weight: 700;
    height: 70px;
    justify-content: center;
    line-height: 11px;
    max-width: 400px;
    padding: 0 5px;
    position: relative;
    text-align: center;
    text-transform: uppercase;
    transition: background-color .2s ease-in-out
}

.cg-tab-main:first-child {
    border-radius: 2px 0 0 0
}

.cg-tab-main:last-child {
    border-radius: 0 2px 0 0
}

@media (min-width:568px) {
    .cg-tab-main {
        font-size: 14px;
        line-height: 17px;
        text-transform: none
    }
}

@media (min-width:768px) {
    .cg-tab-main {
        font-family: neo-sans, sans-serif
    }
}

.cg-tab-main:last-child {
    border-right: 1px solid #cdd6dd
}

.cg-tab-main svg {
    fill: var(--color-text-600);
    flex-shrink: 0;
    height: 24px;
    margin-bottom: 4px;
    width: 24px
}

@media (min-width:568px) {
    .cg-tab-main svg {
        height: 28px;
        width: 28px
    }
}

.cg-tab-main.active {
    height: 71px
}

.cg-tab-main.active,
.cg-tab-main:hover {
    background: #f0f3f7;
    color: var(--color-primary-500)
}

.cg-tab-main.active svg,
.cg-tab-main:hover svg {
    fill: var(--color-primary-500)
}

.cg-tab-main input {
    left: -10000px;
    position: absolute;
    top: 0
}

.cg-tab-main .tab-counter {
    background: rgba(123, 140, 152, .1);
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    padding: 2px 6px;
    position: absolute;
    right: 0;
    top: 0
}

@media (min-width:768px) {
    .cg-tab-main .tab-counter {
        font-size: 14px;
        line-height: 19px
    }
}

.cg-tab-main span {
    align-items: center;
    display: inline-flex;
    flex: 0 0 22px;
    justify-content: center
}

.sp-card .img-wrapper {
    background: var(--color-ui-black)
}

.sp-card img {
    bottom: 0;
    left: 0;
    margin: auto;
    max-height: 100%;
    max-width: 100%;
    min-width: 100%;
    object-fit: cover;
    position: absolute;
    right: 0;
    top: 0
}

.sp-card .sp-title {
    color: var(--color-text-900);
    font-family: neo-sans, sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 22px
}

.sp-card .sp-description {
    font-size: 16px;
    line-height: 22px
}

.sp-card .sp-links {
    display: flex;
    flex-direction: column;
    gap: 8px;
    word-wrap: break-word;
    font-weight: 700;
    margin-bottom: auto;
    white-space: normal
}

.sp-carousel-card-wrapper {
    display: flex;
    flex: 0 0 274px;
    margin: 0 12px 0 0;
    padding-bottom: 16px;
    width: 274px
}

@media (min-width:568px) {
    .sp-carousel-card-wrapper {
        margin: 0 16px 0 0
    }
}

@media (min-width:768px) {
    .sp-carousel-card-wrapper {
        flex: 0 0 calc(33.333% - 10.66667);
        padding-bottom: 24px;
        width: calc(33.333% - 10.66667)
    }
}

@media (min-width:1200px) {
    .sp-carousel-card-wrapper {
        flex: 0 0 calc(25% - 24px);
        margin: 0 24px 0 0;
        width: calc(25% - 24px)
    }
}

.sp-carousel-card-wrapper:last-child {
    margin-right: 0
}

.sp-carousel-card-wrapper:has(.links) {
    min-height: 100%
}

@media (min-width:768px) {
    .flickity-slider .sp-carousel-card-wrapper {
        flex: 0 0 calc(33.333% - 10.66667px);
        padding-bottom: 24px;
        width: calc(33.333% - 10.66667px)
    }
}

@media (min-width:1200px) {
    .flickity-slider .sp-carousel-card-wrapper {
        flex: 0 0 calc(25% - 18px);
        width: calc(25% - 18px)
    }
}

.sp-carousel-card {
    background: #fff;
    border-radius: 2px;
    box-shadow: 0 16px 16px -16px rgba(0, 0, 0, .16);
    display: flex;
    flex-direction: column;
    padding: 4px;
    position: relative;
    width: 100%
}

.sp-carousel-card:hover {
    box-shadow: 0 24px 20px -16px rgba(0, 0, 0, .16)
}

.sp-carousel-card .card-content {
    padding: 16px 12px 12px
}

.sp-carousel-card .img-wrapper {
    display: block;
    height: 160px;
    overflow: hidden;
    position: relative;
    width: 100%
}

.sp-carousel-card .bottom-actions {
    border-top: 1px solid #cdd6dd;
    margin-top: auto;
    padding-top: 8px
}

.sp-carousel-card .sp-description {
    margin-bottom: auto
}

.sp-carousel-card .sp-description,
.sp-carousel-card .sp-title {
    word-wrap: break-word;
    white-space: normal
}

.sp-carousel-card .card-content {
    display: flex;
    flex-direction: column;
    flex-grow: 1
}

.sp-carousel-card .card-content-title-desc-wrapper {
    height: 110px;
    margin-bottom: 16px;
    overflow: hidden
}

.sp-carousel-card .card-content-title-desc-wrapper .sp-title {
    margin-bottom: 22px
}

.sp-carousel-card .card-content-title-links-wrapper {
    margin-bottom: 16px
}

.sp-carousel-card .safety-badge {
    align-items: center;
    align-self: flex-start;
    display: flex;
    filter: drop-shadow(0 4px 4px rgba(0, 0, 0, .25));
    height: 42px;
    justify-content: center;
    position: absolute;
    right: 8px;
    width: 36px;
    z-index: 5
}

.sp-carousel-card .safety-badge svg {
    position: absolute;
    z-index: 5
}

.sp-carousel-card .safety-badge:after {
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8px), 50% 100%, 0 calc(100% - 8px));
    content: "";
    height: calc(100% + 16px);
    position: absolute;
    width: 100%;
    z-index: 1
}


.cg-custom-carousel-wrapper {
    position: relative
}

.custom-carousel-btn {
    align-items: center;
    display: flex;
    z-index: 15
}

.cg-custom-carousel-slider {
    align-items: stretch;
    display: flex;
    height: 100%;
    width: 100%
}

.cg-custom-carousel-wrapper {
    user-select: none
}

.cg-custom-carousel-wrapper .cg-custom-carousel {
    align-items: center;
    display: flex;
    overflow: hidden;
    position: relative;
    width: 100%
}

.cg-carousel-item {
    flex: 0 0 80%;
    opacity: 1;
    overflow: hidden;
    width: 80%
}

.cg-carousel-item img {
    object-fit: cover;
    width: 100%
}

.cg-carousel-after-init-css .cg-carousel-item {
    transition: transform .2s ease-out, opacity .2s linear;
    will-change: transform
}

.cg-carousel-after-init-css .cg-custom-carousel-slider {
    transition: transform .2s linear;
    will-change: transform
}

.cg-carousel-initialized .cg-carousel-item {
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    will-change: transform
}

.cg-carousel-initialized .cg-custom-carousel-slider {
    align-items: center;
    position: absolute
}

.cg-carousel-initialized .cg-carousel-layer-hidden {
    opacity: 0
}

.cg-carousel-initialized .cg-carousel-layer-hidden.prev {
    transform: translateX(-500%)
}

.cg-carousel-initialized .cg-carousel-layer-hidden.next {
    transform: translateX(500%)
}

.cg-carousel-initialized .cg-carousel-layer-2 {
    z-index: 3
}

.cg-carousel-initialized .cg-carousel-layer-2.prev {
    transform: translateX(-250%)
}

.cg-carousel-initialized .cg-carousel-layer-2.next {
    transform: translateX(150%)
}

.cg-carousel-initialized .cg-carousel-layer-1 {
    z-index: 5
}

.cg-carousel-initialized .cg-carousel-layer-1.prev {
    transform: translateX(-150%)
}

.cg-carousel-initialized .cg-carousel-layer-1.next {
    transform: translateX(50%)
}

.cg-carousel-initialized .cg-carousel-layer-0 {
    transform: translateX(-50%);
    z-index: 10
}

.game-section-carousel-header {
    gap: 16px
}

@media (max-width:991px) {
    .game-section-carousel-header {
        flex-wrap: wrap;
        padding-right: 12px
    }

    .game-section-carousel-header .page-header-heading,
    .game-section-carousel-header .page-heading-carousel {
        flex: 1 0 100%
    }
}

@media (min-width:768px) {
    .game-section-carousel-header {
        gap: 24px
    }
}

@media (min-width:992px) {
    .game-section-carousel-header {
        gap: 0
    }

    .game-section-carousel-header .page-heading-carousel {
        flex: 1 0 50%
    }
}

.game-section-carousel-header .page-header-heading {
    padding: 16px 0 0;
    text-align: center
}

@media (min-width:568px) {
    .game-section-carousel-header .page-header-heading {
        max-width: none;
        padding: 24px 0 0
    }
}

@media (min-width:768px) {
    .game-section-carousel-header .page-header-heading {
        padding: 48px 0 0
    }
}

@media (min-width:992px) {
    .game-section-carousel-header .page-header-heading {
        padding: 48px 32px 48px 0;
        text-align: left
    }
}

@media (max-width:991px) {
    .page-heading-carousel .custom-carousel-btn {
        display: none
    }
}

.custom-carousel-btn {
    background: var(--color-bg-900);
    border: 1px solid var(--color-bg-600);
    border-radius: 2px;
    bottom: 20px;
    box-shadow: 0 0 8px 0 #000;
    justify-content: center;
    margin: auto;
    top: 0
}

.custom-carousel-btn svg {
    fill: #fff;
    height: 20px;
    width: 20px
}

.custom-carousel-btn:hover {
    background: linear-gradient(0deg, rgba(123, 140, 152, .2), rgba(123, 140, 152, .2)), #1d2730
}

.custom-carousel-btn:hover svg {
    fill: var(--color-primary-500)
}

.custom-carousel-btn.is-disabled {
    background: var(--color-bg-900);
    box-shadow: none
}

.custom-carousel-btn.is-disabled svg {
    fill: var(--color-text-600)
}

.cg-carousel-item {
    padding: 0 8px
}

@media (min-width:768px) {
    .cg-carousel-item {
        padding: 0 12px
    }
}

.game-list-top-carousel-wrapper {
    position: relative;
    z-index: 5;
    --carousel-card-width: 85%;
    margin-left: -8px;
    width: calc(100% + 16px)
}

@media (min-width:568px) {
    .game-list-top-carousel-wrapper {
        --carousel-card-width: 400px;
        margin-left: 0;
        width: 100%
    }
}

@media (min-width:992px) {
    .game-list-top-carousel-wrapper {
        margin-top: 16px
    }
}

.game-list-top-carousel-wrapper .cg-custom-carousel {
    min-height: 210px
}

@media (min-width:568px) {
    .game-list-top-carousel-wrapper .cg-custom-carousel {
        min-height: 242px
    }
}

.game-list-top-carousel-wrapper .cg-shadow {
    bottom: 0;
    position: absolute;
    top: 0;
    width: 24px;
    z-index: 20
}

.game-list-top-carousel-wrapper .cg-shadow.left {
    background: linear-gradient(90deg, var(--color-bg-95) 0, rgba(19, 26, 33, 0) 100%);
    left: 0
}

.game-list-top-carousel-wrapper .cg-shadow.right {
    background: linear-gradient(-90deg, var(--color-bg-95) 0, rgba(19, 26, 33, 0) 100%);
    right: 0
}

.game-list-top-carousel-wrapper .flickity-page-dots {
    bottom: 0;
    display: flex;
    justify-content: center;
    margin: 16px 0;
    position: relative
}

.game-list-top-carousel-wrapper .flickity-page-dots .dot {
    cursor: pointer
}

.game-list-top-carousel-wrapper .cg-carousel-item {
    align-items: center;
    display: flex;
    flex: 1;
    max-width: var(--carousel-card-width)
}

.game-list-top-carousel-wrapper .game-data-overlay {
    padding: 12px
}

@media (min-width:568px) {
    .game-list-top-carousel-wrapper .game-data-overlay {
        padding: 16px
    }
}

.game-list-top-carousel-wrapper .game-carousel-item {
    width: 100%
}

.game-list-top-carousel-wrapper .cg-custom-carousel-slider {
    transform: translate3d(calc(var(--carousel-card-width)*-1 + var(--carousel-card-width)*.1), 0, 0)
}

@media (min-width:568px) {
    .game-list-top-carousel-wrapper .cg-custom-carousel-slider {
        transform: translate3d(calc(var(--carousel-card-width)*-1 + (100% - var(--carousel-card-width))/2), 0, 0)
    }
}

.game-list-top-carousel-wrapper .game-data-overlay {
    min-height: 200px
}

@media (min-width:568px) {
    .game-list-top-carousel-wrapper .game-data-overlay {
        min-height: 230px
    }
}

.game-list-top-carousel-wrapper .custom-carousel-btn.next {
    right: calc(50% - var(--carousel-card-width)/2*1.1)
}

@media (min-width:992px) {
    .game-list-top-carousel-wrapper .custom-carousel-btn.next {
        right: calc(50% - 181.5px)
    }
}

@media (min-width:1200px) {
    .game-list-top-carousel-wrapper .custom-carousel-btn.next {
        right: calc(50% - var(--carousel-card-width)/2*1.1)
    }
}

.game-list-top-carousel-wrapper .custom-carousel-btn.prev {
    left: calc(50% - var(--carousel-card-width)/2*1.1)
}

@media (min-width:992px) {
    .game-list-top-carousel-wrapper .custom-carousel-btn.prev {
        left: calc(50% - 181.5px)
    }
}

@media (min-width:1200px) {
    .game-list-top-carousel-wrapper .custom-carousel-btn.prev {
        left: calc(50% - var(--carousel-card-width)/2*1.1)
    }
}

.game-list-top-carousel-wrapper .cg-carousel-layer-0 {
    transform: scale(1.05)
}

.game-list-top-carousel-wrapper .cg-carousel-initialized .cg-custom-carousel-slider {
    transform: translateX(0)
}

.game-list-top-carousel-wrapper .cg-carousel-initialized .cg-carousel-layer-0 {
    transform: translateX(-50%) scale(1.05)
}

.game-list-top-carousel-wrapper .cg-carousel-layer-1 {
    z-index: 5
}

.game-list-top-carousel-wrapper .game-btns-wrapper {
    display: flex;
    flex-direction: column
}

@media (min-width:768px) {
    .game-list-top-carousel-wrapper .game-btns-wrapper {
        column-gap: 16px;
        flex-direction: row;
        max-width: 392px
    }
}

.page-heading-carousel-static .game-list-top-carousel-wrapper {
    display: flex;
    justify-content: center;
    padding: 0 0 32px
}

.game-carousel-item .game-name {
    line-height: 20px
}

@media (min-width:768px) {
    .game-carousel-item .game-name {
        font-size: 18px;
        line-height: 24px
    }
}

.game-carousel-item .overlay-loader,
.game-carousel-item .overlay-text {
    display: none
}

@media (min-width:992px) {
    .game-carousel-item:hover .overlay-loader {
        display: block;
        position: absolute;
        right: 8px;
        top: 8px;
        z-index: 10
    }
}

@media (min-width:1200px) {
    .game-carousel-item:hover .overlay-text {
        display: inline-block;
        margin-left: 8px
    }
}

.game-carousel-item {
    border-radius: 2px;
    height: 100%;
    max-height: 100%;
    max-width: 100%;
    min-height: 2px;
    overflow: hidden;
    position: relative
}

.game-carousel-item .img-wrapper {
    border-radius: 2px;
    box-shadow: 0 4px 12px 0 rgba(0, 0, 0, .24);
    height: 100%;
    left: 0;
    object-fit: cover;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1
}

.game-carousel-item .img-wrapper img {
    height: 100%
}

.game-carousel-item .img-wrapper picture {
    display: block;
    height: 100%
}

.game-carousel-item .btn-wrapper {
    display: none;
    gap: 8px;
    width: 100%;
    z-index: 10
}

@media (min-width:568px) {
    .game-carousel-item .btn-wrapper {
        display: flex
    }
}

.game-carousel-item .btn-wrapper .btn {
    flex: 1 0 50%
}

.game-carousel-item .title-ico-wrapper {
    align-items: center;
    display: flex;
    gap: 8px;
    justify-content: space-between
}

.game-carousel-item .ico-wrapper {
    align-items: center;
    border: 1px solid #fff;
    border-radius: 50%;
    display: flex;
    fill: #fff;
    justify-content: center;
    padding: 8px;
    z-index: 5
}

@media (min-width:568px) {
    .game-carousel-item .ico-wrapper {
        display: none
    }
}

.game-carousel-item .game-name {
    font-family: neo-sans, sans-serif;
    font-size: 16px;
    font-weight: 700
}

@media (min-width:568px) {
    .game-carousel-item .game-name {
        font-size: 20px
    }
}

.game-carousel-item .game-provider-name {
    font-size: 12px
}

@media (min-width:568px) {
    .game-carousel-item .game-provider-name {
        font-size: 14px
    }
}

.game-carousel-item .more-options {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 10
}

.game-cover-holder {
    cursor: pointer
}

.game-item-promo-label {
    align-items: center;
    clip-path: polygon(0 0, 0 100%, 94% 100%, 100% 0);
    color: #fff;
    display: flex;
    font-size: 12px;
    font-weight: 700;
    gap: 8px;
    left: 0;
    padding: 4px 20px 4px 12px;
    position: absolute;
    text-transform: uppercase;
    top: 0;
    z-index: 5
}

@media (min-width:568px) {
    .game-item-promo-label {
        font-size: 14px
    }
}

.promo-label-black {
    background: var(--color-ui-black);
    border-radius: 0 0 2px 0;
    box-shadow: 0 4px 12px 0 rgba(29, 39, 48, .3)
}

.label-purple {
    background: linear-gradient(89deg, #4c1287, #a752ff);
    border-radius: 0 0 2px 0;
    box-shadow: 0 4px 8px 0 rgba(29, 39, 48, .16)
}

.label-early-access {
    background: linear-gradient(89deg, #003a8f 0, var(--Color-Ui-link-Blue---Light-BG, #007dff) 100%);
    border-radius: 0 0 2px 0;
    box-shadow: 0 4px 12px 0 rgba(29, 39, 48, .3)
}

.label-orange {
    background: #ea5b0b;
    border-radius: 0 0 2px 0
}

.game-data-overlay {
    border-radius: 2px;
    color: #fff;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: flex-end;
    opacity: 1;
    padding: 16px;
    position: relative;
    z-index: 20
}

.game-data-overlay:before {
    background: linear-gradient(0deg, #000 12%, transparent 50%);
    border-radius: 2px;
    bottom: -1px;
    content: "";
    left: -1px;
    position: absolute;
    right: -1px;
    top: -1px
}

.game-data-overlay .btn {
    min-height: 36px
}

.is-dragging .game-data-overlay {
    z-index: 1
}

.game-data-payload {
    margin-top: 16px
}

.game-data-payload .game-name {
    font-family: neo-sans, sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 26px
}

.game-data-payload .game-provider-name {
    font-size: 14px;
    line-height: 17px
}

.homepage-slider {
    margin: 16px 0;
    position: relative
}

@media (min-width:768px) {
    .homepage-slider {
        margin: 24px 0
    }
}

@media (min-width:992px) {
    .homepage-slider {
        margin: 32px 0
    }
}

.homepage-slider .item-slider {
    width: calc(100% + 24px)
}

@media (min-width:568px) {
    .homepage-slider .item-slider {
        left: calc(-50vw - -50%);
        padding: 0 calc(50vw - 50%);
        width: 100vw
    }
}

@media (min-width:992px) {
    .homepage-slider .item-slider {
        left: -16px;
        padding: 0 0 0 16px;
        width: calc(100% + 16px)
    }
}

.homepage-slider .alternative-btn-wrapper {
    margin: 16px 0 0 16px
}

.card-mini-wrapper {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 8px;
    margin-right: 12px;
    max-width: none
}

@media (min-width:568px) {
    .card-mini-wrapper {
        gap: 16px;
        margin-right: 16px
    }
}

@media (min-width:992px) {
    .card-mini-wrapper {
        margin-bottom: 12px
    }
}

@media (min-width:1200px) {
    .card-mini-wrapper {
        gap: 24px;
        margin-right: 24px
    }
}

.card-mini-wrapper:last-child {
    margin-right: 0
}

@media (min-width:992px) {
    .card-mini-wrapper:last-child {
        margin-right: 24px
    }
}

.two-row-three-card-wrapper .card-mini-wrapper {
    flex: 1 0 92%;
    max-width: 310px
}

@media (min-width:768px) {
    .two-row-three-card-wrapper .card-mini-wrapper {
        flex: 1 0 45%;
        max-width: none
    }
}

@media (min-width:992px) {
    .two-row-three-card-wrapper .card-mini-wrapper {
        flex: 0 0 calc(33.34% - 10.66667px);
        width: calc(33.34% - 10.66667px)
    }
}

@media (min-width:1200px) {
    .two-row-three-card-wrapper .card-mini-wrapper {
        flex: 0 0 calc(33.34% - 16px);
        max-width: none;
        width: calc(33.34% - 16px)
    }
}

@keyframes lum-fade {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes lum-fadeZoom {
    0% {
        transform: scale(0.5);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes lum-loader-rotate {
    0% {
        transform: translate(-50%, -50%) rotate(0);
    }

    50% {
        transform: translate(-50%, -50%) rotate(-180deg);
    }

    100% {
        transform: translate(-50%, -50%) rotate(-360deg);
    }
}

@keyframes lum-loader-before {
    0% {
        transform: scale(1);
    }

    10% {
        transform: scale(1.2) translateX(6px);
    }

    25% {
        transform: scale(1.3) translateX(8px);
    }

    40% {
        transform: scale(1.2) translateX(6px);
    }

    50% {
        transform: scale(1);
    }

    60% {
        transform: scale(0.8) translateX(6px);
    }

    75% {
        transform: scale(0.7) translateX(8px);
    }

    90% {
        transform: scale(0.8) translateX(6px);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes lum-loader-after {
    0% {
        transform: scale(1);
    }

    10% {
        transform: scale(1.2) translateX(-6px);
    }

    25% {
        transform: scale(1.3) translateX(-8px);
    }

    40% {
        transform: scale(1.2) translateX(-6px);
    }

    50% {
        transform: scale(1);
    }

    60% {
        transform: scale(0.8) translateX(-6px);
    }

    75% {
        transform: scale(0.7) translateX(-8px);
    }

    90% {
        transform: scale(0.8) translateX(-6px);
    }

    100% {
        transform: scale(1);
    }
}

.lum-lightbox {
    background: rgba(0, 0, 0, 0.6);
}

.lum-lightbox-inner {
    top: 2.5%;
    right: 2.5%;
    bottom: 2.5%;
    left: 2.5%;
}

.lum-lightbox-inner img {
    position: relative;
}

.lum-lightbox-inner .lum-lightbox-caption {
    margin: 0 auto;
    color: #fff;
    max-width: 700px;
    text-align: center;
}

.lum-loading .lum-lightbox-loader {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 66px;
    height: 20px;
    animation: lum-loader-rotate 1800ms infinite linear;
}

.lum-lightbox-loader:before,
.lum-lightbox-loader:after {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    margin-top: -10px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.9);
}

.lum-lightbox-loader:before {
    left: 0;
    animation: lum-loader-before 1800ms infinite linear;
}

.lum-lightbox-loader:after {
    right: 0;
    animation: lum-loader-after 1800ms infinite linear;
    animation-delay: -900ms;
}

.lum-lightbox.lum-opening {
    animation: lum-fade 180ms ease-out;
}

.lum-lightbox.lum-opening .lum-lightbox-inner {
    animation: lum-fadeZoom 180ms ease-out;
}

.lum-lightbox.lum-closing {
    animation: lum-fade 300ms ease-in;
    animation-direction: reverse;
}

.lum-lightbox.lum-closing .lum-lightbox-inner {
    animation: lum-fadeZoom 300ms ease-in;
    animation-direction: reverse;
}

.lum-img {
    transition: opacity 120ms ease-out;
}

.lum-loading .lum-img {
    opacity: 0;
}

.lum-gallery-button {
    overflow: hidden;
    text-indent: 150%;
    white-space: nowrap;
    background: transparent;
    border: 0;
    margin: 0;
    padding: 0;
    outline: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    height: 100px;
    max-height: 100%;
    width: 60px;
    cursor: pointer;
}

.lum-close-button {
    position: absolute;
    right: 5px;
    top: 5px;
    width: 32px;
    height: 32px;
    opacity: 0.3;
}

.lum-close-button:hover {
    opacity: 1;
}

.lum-close-button:before,
.lum-close-button:after {
    position: absolute;
    left: 15px;
    content: " ";
    height: 33px;
    width: 2px;
    background-color: #fff;
}

.lum-close-button:before {
    transform: rotate(45deg);
}

.lum-close-button:after {
    transform: rotate(-45deg);
}

.lum-previous-button {
    left: 12px;
}

.lum-next-button {
    right: 12px;
}

.lum-gallery-button:after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    width: 36px;
    height: 36px;
    border-top: 4px solid rgba(255, 255, 255, 0.8);
}

.lum-previous-button:after {
    transform: translateY(-50%) rotate(-45deg);
    border-left: 4px solid rgba(255, 255, 255, 0.8);
    box-shadow: -2px 0 rgba(0, 0, 0, 0.2);
    left: 12%;
    border-radius: 3px 0 0 0;
}

.lum-next-button:after {
    transform: translateY(-50%) rotate(45deg);
    border-right: 4px solid rgba(255, 255, 255, 0.8);
    box-shadow: 2px 0 rgba(0, 0, 0, 0.2);
    right: 12%;
    border-radius: 0 3px 0 0;
}

/* This media query makes screens less than 460px wide display in a "fullscreen"-esque mode. Users can then scroll around inside the lightbox to see the entire image. */
@media (max-width: 460px) {
    .lum-lightbox-image-wrapper {
        display: flex;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
    }

    .lum-lightbox-caption {
        width: 100%;
        position: absolute;
        bottom: 0;
    }

    /* Used to centre the image in the container, respecting overflow: https://stackoverflow.com/a/33455342/515634 */
    .lum-lightbox-position-helper {
        margin: auto;
    }

    .lum-lightbox-inner img {
        max-width: none;
        max-height: none;
    }
}

.tippy-box[data-animation=fade][data-state=hidden] {
    opacity: 0;
}

[data-tippy-root] {
    max-width: calc(100vw - 10px);
}

.tippy-box {
    position: relative;
    background-color: #333;
    color: #fff;
    border-radius: 4px;
    font-size: 14px;
    line-height: 1.4;
    white-space: normal;
    outline: 0;
    transition-property: transform, visibility, opacity;
}

.tippy-box[data-placement^=top]>.tippy-arrow {
    bottom: 0;
}

.tippy-box[data-placement^=top]>.tippy-arrow:before {
    bottom: -7px;
    left: 0;
    border-width: 8px 8px 0;
    border-top-color: initial;
    transform-origin: center top;
}

.tippy-box[data-placement^=bottom]>.tippy-arrow {
    top: 0;
}

.tippy-box[data-placement^=bottom]>.tippy-arrow:before {
    top: -7px;
    left: 0;
    border-width: 0 8px 8px;
    border-bottom-color: initial;
    transform-origin: center bottom;
}

.tippy-box[data-placement^=left]>.tippy-arrow {
    right: 0;
}

.tippy-box[data-placement^=left]>.tippy-arrow:before {
    border-width: 8px 0 8px 8px;
    border-left-color: initial;
    right: -7px;
    transform-origin: center left;
}

.tippy-box[data-placement^=right]>.tippy-arrow {
    left: 0;
}

.tippy-box[data-placement^=right]>.tippy-arrow:before {
    left: -7px;
    border-width: 8px 8px 8px 0;
    border-right-color: initial;
    transform-origin: center right;
}

.tippy-box[data-inertia][data-state=visible] {
    transition-timing-function: cubic-bezier(.54, 1.5, .38, 1.11);
}

.tippy-arrow {
    width: 16px;
    height: 16px;
    color: #333;
}

.tippy-arrow:before {
    content: "";
    position: absolute;
    border-color: transparent;
    border-style: solid;
}

.tippy-content {
    position: relative;
    padding: 5px 9px;
    z-index: 1;
}

.tippy-box[data-theme~=light] {
    color: #26323d;
    box-shadow: 0 0 20px 4px rgba(154, 161, 177, .15), 0 4px 80px -8px rgba(36, 40, 47, .25), 0 4px 4px -2px rgba(91, 94, 105, .15);
    background-color: #fff;
}

.tippy-box[data-theme~=light][data-placement^=top]>.tippy-arrow:before {
    border-top-color: #fff;
}

.tippy-box[data-theme~=light][data-placement^=bottom]>.tippy-arrow:before {
    border-bottom-color: #fff;
}

.tippy-box[data-theme~=light][data-placement^=left]>.tippy-arrow:before {
    border-left-color: #fff;
}

.tippy-box[data-theme~=light][data-placement^=right]>.tippy-arrow:before {
    border-right-color: #fff;
}

.tippy-box[data-theme~=light]>.tippy-backdrop {
    background-color: #fff;
}

.tippy-box[data-theme~=light]>.tippy-svg-arrow {
    fill: #fff;
}

lite-youtube {
    background-color: #000;
    position: relative;
    display: block;
    contain: content;
    background-position: center center;
    background-size: cover;
    cursor: pointer;
    max-width: 720px;
}

/* gradient */
lite-youtube::before {
    content: attr(data-title);
    display: block;
    position: absolute;
    top: 0;
    /* Pixel-perfect port of YT's gradient PNG, using https://github.com/bluesmoon/pngtocss plus optimizations */
    background-image: linear-gradient(180deg, rgb(0 0 0 / 67%) 0%, rgb(0 0 0 / 54%) 14%, rgb(0 0 0 / 15%) 54%, rgb(0 0 0 / 5%) 72%, rgb(0 0 0 / 0%) 94%);
    height: 99px;
    width: 100%;
    font-family: "YouTube Noto", Roboto, Arial, Helvetica, sans-serif;
    color: hsl(0deg 0% 93.33%);
    text-shadow: 0 0 2px rgba(0, 0, 0, .5);
    font-size: 18px;
    padding: 25px 20px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    box-sizing: border-box;
}

lite-youtube:hover::before {
    color: white;
}

/* responsive iframe with a 16:9 aspect ratio
    thanks https://css-tricks.com/responsive-iframes/
*/
lite-youtube::after {
    content: "";
    display: block;
    padding-bottom: calc(100% / (16 / 9));
}

lite-youtube>iframe {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border: 0;
}

/* play button */
lite-youtube>.lty-playbtn {
    display: block;
    /* Make the button element cover the whole area for a large hover/click target… */
    width: 100%;
    height: 100%;
    /* …but visually it's still the same size */
    background: no-repeat center/68px 48px;
    /* YT's actual play button svg */
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 68 48"><path d="M66.52 7.74c-.78-2.93-2.49-5.41-5.42-6.19C55.79.13 34 0 34 0S12.21.13 6.9 1.55c-2.93.78-4.63 3.26-5.42 6.19C.06 13.05 0 24 0 24s.06 10.95 1.48 16.26c.78 2.93 2.49 5.41 5.42 6.19C12.21 47.87 34 48 34 48s21.79-.13 27.1-1.55c2.93-.78 4.64-3.26 5.42-6.19C67.94 34.95 68 24 68 24s-.06-10.95-1.48-16.26z" fill="red"/><path d="M45 24 27 14v20" fill="white"/></svg>');
    position: absolute;
    cursor: pointer;
    z-index: 1;
    filter: grayscale(100%);
    transition: filter .1s cubic-bezier(0, 0, 0.2, 1);
    border: 0;
}

lite-youtube:hover>.lty-playbtn,
lite-youtube .lty-playbtn:focus {
    filter: none;
}

/* Post-click styles */
lite-youtube.lyt-activated {
    cursor: unset;
}

lite-youtube.lyt-activated::before,
lite-youtube.lyt-activated>.lty-playbtn {
    opacity: 0;
    pointer-events: none;
}

.lyt-visually-hidden {
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

.choices {
    position: relative;
    margin-bottom: 24px;
    font-size: 16px;
}

.choices:focus {
    outline: 0;
}

.choices:last-child {
    margin-bottom: 0;
}

.choices.is-disabled .choices__inner,
.choices.is-disabled .choices__input {
    background-color: #eaeaea;
    cursor: not-allowed;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.choices.is-disabled .choices__item {
    cursor: not-allowed;
}

.choices [hidden] {
    display: none !important;
}

.choices[data-type*=select-one] {
    cursor: pointer;
}

.choices[data-type*=select-one] .choices__inner {
    padding-bottom: 7.5px;
}

.choices[data-type*=select-one] .choices__input {
    display: block;
    width: 100%;
    padding: 10px;
    border-bottom: 1px solid #ddd;
    background-color: #fff;
    margin: 0;
}

.choices[data-type*=select-one] .choices__button {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjMDAwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==);
    padding: 0;
    background-size: 8px;
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -10px;
    margin-right: 25px;
    height: 20px;
    width: 20px;
    border-radius: 10em;
    opacity: .5;
}

.choices[data-type*=select-one] .choices__button:focus,
.choices[data-type*=select-one] .choices__button:hover {
    opacity: 1;
}

.choices[data-type*=select-one] .choices__button:focus {
    box-shadow: 0 0 0 2px #00bcd4;
}

.choices[data-type*=select-one] .choices__item[data-value=""] .choices__button {
    display: none;
}

.choices[data-type*=select-one]:after {
    content: "";
    height: 0;
    width: 0;
    border-style: solid;
    border-color: #333 transparent transparent;
    border-width: 5px;
    position: absolute;
    right: 11.5px;
    top: 50%;
    margin-top: -2.5px;
    pointer-events: none;
}

.choices[data-type*=select-one].is-open:after {
    border-color: transparent transparent #333;
    margin-top: -7.5px;
}

.choices[data-type*=select-one][dir=rtl]:after {
    left: 11.5px;
    right: auto;
}

.choices[data-type*=select-one][dir=rtl] .choices__button {
    right: auto;
    left: 0;
    margin-left: 25px;
    margin-right: 0;
}

.choices[data-type*=select-multiple] .choices__inner,
.choices[data-type*=text] .choices__inner {
    cursor: text;
}

.choices[data-type*=select-multiple] .choices__button,
.choices[data-type*=text] .choices__button {
    position: relative;
    display: inline-block;
    margin: 0 -4px 0 8px;
    padding-left: 16px;
    border-left: 1px solid #008fa1;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==);
    background-size: 8px;
    width: 8px;
    line-height: 1;
    opacity: .75;
    border-radius: 0;
}

.choices[data-type*=select-multiple] .choices__button:focus,
.choices[data-type*=select-multiple] .choices__button:hover,
.choices[data-type*=text] .choices__button:focus,
.choices[data-type*=text] .choices__button:hover {
    opacity: 1;
}

.choices__inner {
    display: inline-block;
    vertical-align: top;
    width: 100%;
    background-color: #f9f9f9;
    padding: 7.5px 7.5px 3.75px;
    border: 1px solid #ddd;
    border-radius: 2.5px;
    font-size: 14px;
    min-height: 44px;
    overflow: hidden;
}

.is-focused .choices__inner,
.is-open .choices__inner {
    border-color: #b7b7b7;
}

.is-open .choices__inner {
    border-radius: 2.5px 2.5px 0 0;
}

.is-flipped.is-open .choices__inner {
    border-radius: 0 0 2.5px 2.5px;
}

.choices__list {
    margin: 0;
    padding-left: 0;
    list-style: none;
}

.choices__list--single {
    display: inline-block;
    padding: 4px 16px 4px 4px;
    width: 100%;
}

[dir=rtl] .choices__list--single {
    padding-right: 4px;
    padding-left: 16px;
}

.choices__list--single .choices__item {
    width: 100%;
}

.choices__list--multiple {
    display: inline;
}

.choices__list--multiple .choices__item {
    display: inline-block;
    vertical-align: middle;
    border-radius: 20px;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 500;
    margin-right: 3.75px;
    margin-bottom: 3.75px;
    background-color: #00bcd4;
    border: 1px solid #00a5bb;
    color: #fff;
    word-break: break-all;
    box-sizing: border-box;
}

.choices__list--multiple .choices__item[data-deletable] {
    padding-right: 5px;
}

[dir=rtl] .choices__list--multiple .choices__item {
    margin-right: 0;
    margin-left: 3.75px;
}

.choices__list--multiple .choices__item.is-highlighted {
    background-color: #00a5bb;
    border: 1px solid #008fa1;
}

.is-disabled .choices__list--multiple .choices__item {
    background-color: #aaa;
    border: 1px solid #919191;
}

.choices__list--dropdown {
    visibility: hidden;
    z-index: 1;
    position: absolute;
    width: 100%;
    background-color: #fff;
    border: 1px solid #ddd;
    top: 100%;
    margin-top: -1px;
    border-bottom-left-radius: 2.5px;
    border-bottom-right-radius: 2.5px;
    overflow: hidden;
    word-break: break-all;
    will-change: visibility;
}

.choices__list--dropdown.is-active {
    visibility: visible;
}

.is-open .choices__list--dropdown {
    border-color: #b7b7b7;
}

.is-flipped .choices__list--dropdown {
    top: auto;
    bottom: 100%;
    margin-top: 0;
    margin-bottom: -1px;
    border-radius: .25rem .25rem 0 0;
}

.choices__list--dropdown .choices__list {
    position: relative;
    max-height: 300px;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    will-change: scroll-position;
}

.choices__list--dropdown .choices__item {
    position: relative;
    padding: 10px;
    font-size: 14px;
}

[dir=rtl] .choices__list--dropdown .choices__item {
    text-align: right;
}

@media (min-width:640px) {
    .choices__list--dropdown .choices__item--selectable {
        padding-right: 100px;
    }

    .choices__list--dropdown .choices__item--selectable:after {
        content: attr(data-select-text);
        font-size: 12px;
        opacity: 0;
        position: absolute;
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
    }

    [dir=rtl] .choices__list--dropdown .choices__item--selectable {
        text-align: right;
        padding-left: 100px;
        padding-right: 10px;
    }

    [dir=rtl] .choices__list--dropdown .choices__item--selectable:after {
        right: auto;
        left: 10px;
    }
}

.choices__list--dropdown .choices__item--selectable.is-highlighted {
    background-color: #f2f2f2;
}

.choices__list--dropdown .choices__item--selectable.is-highlighted:after {
    opacity: .5;
}

.choices__item {
    cursor: default;
}

.choices__item--selectable {
    cursor: pointer;
}

.choices__item--disabled {
    cursor: not-allowed;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    opacity: .5;
}

.choices__heading {
    font-weight: 600;
    font-size: 12px;
    padding: 10px;
    border-bottom: 1px solid #f7f7f7;
    color: gray;
}

.choices__button {
    text-indent: -9999px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 0;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}

.choices__button:focus,
.choices__input:focus {
    outline: 0;
}

.choices__input {
    display: inline-block;
    vertical-align: baseline;
    background-color: #f9f9f9;
    font-size: 14px;
    margin-bottom: 5px;
    border: 0;
    border-radius: 0;
    max-width: 100%;
    padding: 4px 0 4px 2px;
}

[dir=rtl] .choices__input {
    padding-right: 2px;
    padding-left: 0;
}

.choices__placeholder {
    opacity: .5;
}

@charset "UTF-8";

/*!
 * Bootstrap v3.3.7 (http://getbootstrap.com)
 * Copyright 2011-2016 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */
[role=button] {
    cursor: pointer;
}

.invisible {
    visibility: hidden;
}

* html .cf-mobile {
    zoom: 1;
}

*:first-child+html .cf-mobile {
    zoom: 1;
}

.pointer {
    cursor: pointer;
}


.hp-slider-header-no-arrows {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
    gap: 8px;
    min-height: 22px;
}

@media (min-width: 568px) {
    .hp-slider-header-no-arrows {
        min-height: 30px;
        margin-bottom: 16px;
    }
}

[class*=" f24-"],
[class^=f24-] {
    width: 24px;
    height: 24px;
    background-image: url(../images/shared/flags-sprite/export/flags-sprite@2x.png);
    background-size: 449px 449px;
    background-repeat: no-repeat;
    display: inline-block;
}

.f24-IO {
    background-position: 0 0;
}

.f24-ad {
    background-position: -25px 0;
}

.f24-ae {
    background-position: 0 -25px;
}

.f24-af {
    background-position: -25px -25px;
}

.f24-ag {
    background-position: -50px 0;
}

.f24-ai {
    background-position: -50px -25px;
}

.f24-al {
    background-position: 0 -50px;
}

.f24-am {
    background-position: -25px -50px;
}

.f24-an {
    background-position: -50px -50px;
}

.f24-ao {
    background-position: -75px 0;
}

[class*=f24-ar] {
    background-position: -75px -25px;
}

.f24-as {
    background-position: -75px -50px;
}

.f24-at {
    background-position: 0 -75px;
}

.f24-au {
    background-position: -25px -75px;
}

.f24-aw {
    background-position: -50px -75px;
}

.f24-ax {
    background-position: -75px -75px;
}

.f24-az {
    background-position: -100px 0;
}

.f24-ba {
    background-position: -100px -25px;
}

.f24-bb {
    background-position: -100px -50px;
}

.f24-bd {
    background-position: -100px -75px;
}

.f24-be {
    background-position: 0 -100px;
}

.f24-bf {
    background-position: -25px -100px;
}

.f24-bg {
    background-position: -50px -100px;
}

.f24-bh {
    background-position: -75px -100px;
}

.f24-bi {
    background-position: -100px -100px;
}

.f24-bj {
    background-position: -125px 0;
}

.f24-bl {
    background-position: -125px -25px;
}

.f24-bm {
    background-position: -125px -50px;
}

.f24-bn {
    background-position: -125px -75px;
}

.f24-bo {
    background-position: -125px -100px;
}

.f24-bq {
    background-position: 0 -125px;
}

.f24-br {
    background-position: -25px -125px;
}

.f24-bs {
    background-position: -50px -125px;
}

.f24-bt {
    background-position: -75px -125px;
}

.f24-bv {
    background-position: -100px -125px;
}

.f24-bw {
    background-position: -125px -125px;
}

.f24-by {
    background-position: -150px 0;
}

.f24-bz {
    background-position: -150px -25px;
}

[class*=f24-ca] {
    background-position: -150px -50px;
}

.f24-cc {
    background-position: -150px -75px;
}

.f24-cd {
    background-position: -150px -100px;
}

.f24-cf {
    background-position: -150px -125px;
}

.f24-cg {
    background-position: 0 -150px;
}

.f24-ch {
    background-position: -25px -150px;
}

.f24-ci {
    background-position: -125px -425px;
}

.f24-ck {
    background-position: -50px -150px;
}

.f24-cl {
    background-position: -75px -150px;
}

.f24-cm {
    background-position: -100px -150px;
}

.f24-cn {
    background-position: -125px -150px;
}

.f24-co {
    background-position: -150px -150px;
}

.f24-cr {
    background-position: -175px 0;
}

.f24-cu {
    background-position: -175px -25px;
}

.f24-cv {
    background-position: -175px -50px;
}

.f24-cw {
    background-position: -175px -75px;
}

.f24-cx {
    background-position: -175px -100px;
}

.f24-cy {
    background-position: -175px -125px;
}

.f24-cz {
    background-position: -175px -150px;
}

[class*=f24-de] {
    background-position: 0 -175px;
}

.f24-dj {
    background-position: -25px -175px;
}

.f24-dk {
    background-position: -50px -175px;
}

.f24-dm {
    background-position: -75px -175px;
}

.f24-do {
    background-position: -100px -175px;
}

.f24-dz {
    background-position: -125px -175px;
}

.f24-ec {
    background-position: -150px -175px;
}

.f24-ee {
    background-position: -175px -175px;
}

.f24-eg {
    background-position: -200px 0;
}

.f24-eh {
    background-position: -200px -25px;
}

.f24-er {
    background-position: -200px -50px;
}

.f24-es {
    background-position: -200px -75px;
}

.f24-et {
    background-position: -200px -100px;
}

.f24-eu {
    background-position: -200px -125px;
}

.f24-fa {
    background-position: -200px -150px;
}

.f24-fi {
    background-position: -200px -175px;
}

.f24-fj {
    background-position: 0 -200px;
}

.f24-fk {
    background-position: -25px -200px;
}

.f24-fm {
    background-position: -50px -200px;
}

.f24-fo {
    background-position: -75px -200px;
}

.f24-fr {
    background-position: -100px -200px;
}

.f24-ga {
    background-position: -125px -200px;
}

.f24-gb-eng {
    background-position: -150px -200px;
}

.f24-gb-sct {
    background-position: -175px -200px;
}

.f24-gb-wls {
    background-position: -200px -200px;
}

.f24-gb {
    background-position: -225px 0;
}

.f24-gd {
    background-position: -225px -25px;
}

.f24-ge {
    background-position: -225px -50px;
}

.f24-gf {
    background-position: -225px -75px;
}

.f24-gg {
    background-position: -225px -100px;
}

.f24-gh {
    background-position: -225px -125px;
}

.f24-gi {
    background-position: -225px -150px;
}

.f24-gl {
    background-position: -225px -175px;
}

.f24-gm {
    background-position: -225px -200px;
}

.f24-gn {
    background-position: 0 -225px;
}

.f24-gp {
    background-position: -25px -225px;
}

.f24-gq {
    background-position: -50px -225px;
}

.f24-gr {
    background-position: -75px -225px;
}

.f24-gs {
    background-position: -100px -225px;
}

.f24-gt {
    background-position: -125px -225px;
}

.f24-gu {
    background-position: -150px -225px;
}

.f24-gw {
    background-position: -175px -225px;
}

.f24-gy {
    background-position: -200px -225px;
}

.f24-hk {
    background-position: -225px -225px;
}

.f24-hm {
    background-position: -250px 0;
}

.f24-hn {
    background-position: -250px -25px;
}

.f24-hr {
    background-position: -250px -50px;
}

.f24-ht {
    background-position: -250px -75px;
}

.f24-hu {
    background-position: -250px -100px;
}

.f24-id {
    background-position: -250px -125px;
}

.f24-ie {
    background-position: -250px -150px;
}

.f24-il {
    background-position: -250px -175px;
}

.f24-im {
    background-position: -250px -200px;
}

.f24-in {
    background-position: -250px -225px;
}

.f24-iq {
    background-position: 0 -250px;
}

.f24-ir {
    background-position: -25px -250px;
}

.f24-is {
    background-position: -50px -250px;
}

.f24-it {
    background-position: -75px -250px;
}

.f24-je {
    background-position: -100px -250px;
}

.f24-jm {
    background-position: -125px -250px;
}

.f24-jo {
    background-position: -150px -250px;
}

.f24-jp {
    background-position: -175px -250px;
}

.f24-ke {
    background-position: -200px -250px;
}

.f24-kg {
    background-position: -225px -250px;
}

.f24-kh {
    background-position: -250px -250px;
}

.f24-ki {
    background-position: -275px 0;
}

.f24-km {
    background-position: -275px -25px;
}

.f24-kn {
    background-position: -275px -50px;
}

.f24-kp {
    background-position: -275px -75px;
}

.f24-kr {
    background-position: -275px -100px;
}

.f24-ku {
    background-position: -275px -125px;
}

.f24-kw {
    background-position: -275px -150px;
}

.f24-ky {
    background-position: -275px -175px;
}

.f24-kz {
    background-position: -275px -200px;
}

.f24-la {
    background-position: -275px -225px;
}

.f24-lb {
    background-position: -275px -250px;
}

.f24-lc {
    background-position: 0 -275px;
}

.f24-li {
    background-position: -25px -275px;
}

.f24-lk {
    background-position: -50px -275px;
}

.f24-lr {
    background-position: -75px -275px;
}

.f24-ls {
    background-position: -100px -275px;
}

.f24-lt {
    background-position: -125px -275px;
}

.f24-lu {
    background-position: -150px -275px;
}

.f24-lv {
    background-position: -175px -275px;
}

.f24-ly {
    background-position: -200px -275px;
}

.f24-ma {
    background-position: -225px -275px;
}

.f24-mc {
    background-position: -250px -275px;
}

.f24-md {
    background-position: -275px -275px;
}

.f24-me {
    background-position: -300px 0;
}

.f24-mf {
    background-position: -300px -25px;
}

.f24-mg {
    background-position: -300px -50px;
}

.f24-mh {
    background-position: -300px -75px;
}

.f24-mk {
    background-position: -300px -100px;
}

.f24-ml {
    background-position: -300px -125px;
}

.f24-mm {
    background-position: -300px -150px;
}

.f24-mn {
    background-position: -300px -175px;
}

.f24-mo {
    background-position: -300px -200px;
}

.f24-mp {
    background-position: -300px -225px;
}

.f24-mq {
    background-position: -300px -250px;
}

.f24-mr {
    background-position: -300px -275px;
}

.f24-ms {
    background-position: 0 -300px;
}

.f24-mt {
    background-position: -25px -300px;
}

.f24-mu {
    background-position: -50px -300px;
}

.f24-mv {
    background-position: -75px -300px;
}

.f24-mw {
    background-position: -100px -300px;
}

.f24-mx {
    background-position: -125px -300px;
}

.f24-my {
    background-position: -150px -300px;
}

.f24-mz {
    background-position: -175px -300px;
}

.f24-na {
    background-position: -200px -300px;
}

.f24-nc {
    background-position: -225px -300px;
}

.f24-ne {
    background-position: -250px -300px;
}

.f24-nf {
    background-position: -275px -300px;
}

.f24-ng {
    background-position: -300px -300px;
}

.f24-ni {
    background-position: -325px 0;
}

.f24-nl {
    background-position: -325px -25px;
}

.f24-no {
    background-position: -325px -50px;
}

.f24-np {
    background-position: -325px -75px;
}

.f24-nr {
    background-position: -325px -100px;
}

.f24-nu {
    background-position: -325px -125px;
}

.f24-nz {
    background-position: -325px -150px;
}

.f24-om {
    background-position: -325px -175px;
}

.f24-pa {
    background-position: -325px -200px;
}

.f24-pe {
    background-position: -325px -225px;
}

.f24-pf {
    background-position: -325px -250px;
}

.f24-pg {
    background-position: -325px -275px;
}

.f24-ph {
    background-position: -325px -300px;
}

.f24-pk {
    background-position: 0 -325px;
}

.f24-pl {
    background-position: -25px -325px;
}

.f24-pm {
    background-position: -50px -325px;
}

.f24-pn {
    background-position: -75px -325px;
}

.f24-pr {
    background-position: -100px -325px;
}

.f24-ps {
    background-position: -125px -325px;
}

.f24-pt {
    background-position: -150px -325px;
}

.f24-pw {
    background-position: -175px -325px;
}

.f24-py {
    background-position: -200px -325px;
}

.f24-qa {
    background-position: -225px -325px;
}

.f24-re {
    background-position: -250px -325px;
}

.f24-ro {
    background-position: -275px -325px;
}

.f24-rs {
    background-position: -300px -325px;
}

.f24-ru {
    background-position: -325px -325px;
}

.f24-rw {
    background-position: -350px 0;
}

.f24-sa {
    background-position: -350px -25px;
}

.f24-sb {
    background-position: -350px -50px;
}

.f24-sc {
    background-position: -350px -75px;
}

.f24-sd {
    background-position: -350px -100px;
}

.f24-se {
    background-position: -350px -125px;
}

.f24-sg {
    background-position: -350px -150px;
}

.f24-sh {
    background-position: -350px -175px;
}

.f24-si {
    background-position: -350px -200px;
}

.f24-sj {
    background-position: -350px -225px;
}

.f24-sk {
    background-position: -350px -250px;
}

.f24-sl {
    background-position: -350px -275px;
}

.f24-sm {
    background-position: -350px -300px;
}

.f24-sn {
    background-position: -350px -325px;
}

.f24-so {
    background-position: 0 -350px;
}

.f24-sr {
    background-position: -25px -350px;
}

.f24-ss {
    background-position: -50px -350px;
}

.f24-st {
    background-position: -75px -350px;
}

.f24-sv {
    background-position: -100px -350px;
}

.f24-sx {
    background-position: -125px -350px;
}

.f24-sy {
    background-position: -150px -350px;
}

.f24-sz {
    background-position: -175px -350px;
}

.f24-tc {
    background-position: -200px -350px;
}

.f24-td {
    background-position: -225px -350px;
}

.f24-tf {
    background-position: -250px -350px;
}

.f24-tg {
    background-position: -275px -350px;
}

.f24-th {
    background-position: -300px -350px;
}

.f24-tj {
    background-position: -325px -350px;
}

.f24-tk {
    background-position: -350px -350px;
}

.f24-tl {
    background-position: -375px 0;
}

.f24-tm {
    background-position: -375px -25px;
}

.f24-tn {
    background-position: -375px -50px;
}

.f24-to {
    background-position: -375px -75px;
}

.f24-tr {
    background-position: -375px -100px;
}

.f24-tt {
    background-position: -375px -125px;
}

.f24-tv {
    background-position: -375px -150px;
}

.f24-tw {
    background-position: -375px -175px;
}

.f24-tz {
    background-position: -375px -200px;
}

.f24-ua {
    background-position: -375px -225px;
}

.f24-ug {
    background-position: -375px -250px;
}

.f24-um {
    background-position: -375px -275px;
}

.f24-us-ak {
    background-position: -375px -300px;
}

.f24-us-al {
    background-position: -375px -325px;
}

.f24-us-ar {
    background-position: -375px -350px;
}

.f24-us-az {
    background-position: 0 -375px;
}

.f24-us-ca {
    background-position: -25px -375px;
}

.f24-us-co {
    background-position: -50px -375px;
}

.f24-us-ct {
    background-position: -75px -375px;
}

.f24-us-dc {
    background-position: -100px -375px;
}

.f24-us-de {
    background-position: -125px -375px;
}

.f24-us-fl {
    background-position: -150px -375px;
}

.f24-us-ga {
    background-position: -175px -375px;
}

.f24-us-hi {
    background-position: -200px -375px;
}

.f24-us-ia {
    background-position: -225px -375px;
}

.f24-us-id {
    background-position: -250px -375px;
}

.f24-us-il {
    background-position: -275px -375px;
}

.f24-us-in {
    background-position: -300px -375px;
}

.f24-us-ks {
    background-position: -325px -375px;
}

.f24-us-ky {
    background-position: -350px -375px;
}

.f24-us-la {
    background-position: -375px -375px;
}

.f24-us-ma {
    background-position: -400px 0;
}

.f24-us-md {
    background-position: -400px -25px;
}

.f24-us-me {
    background-position: -400px -50px;
}

.f24-us-mi {
    background-position: -400px -75px;
}

.f24-us-mn {
    background-position: -400px -100px;
}

.f24-us-mo {
    background-position: -400px -125px;
}

.f24-us-ms {
    background-position: -400px -150px;
}

.f24-us-mt {
    background-position: -400px -175px;
}

.f24-us-nc {
    background-position: -400px -200px;
}

.f24-us-nd {
    background-position: -400px -225px;
}

.f24-us-ne {
    background-position: -400px -250px;
}

.f24-us-nh {
    background-position: -400px -275px;
}

.f24-us-nj {
    background-position: -400px -300px;
}

.f24-us-nm {
    background-position: -400px -325px;
}

.f24-us-nv {
    background-position: -400px -350px;
}

.f24-us-ny {
    background-position: -400px -375px;
}

.f24-us-oh {
    background-position: 0 -400px;
}

.f24-us-ok {
    background-position: -25px -400px;
}

.f24-us-or {
    background-position: -50px -400px;
}

.f24-us-pa {
    background-position: -75px -400px;
}

.f24-us-ri {
    background-position: -100px -400px;
}

.f24-us-sc {
    background-position: -125px -400px;
}

.f24-us-sd {
    background-position: -150px -400px;
}

.f24-us-tn {
    background-position: -175px -400px;
}

.f24-us-tx {
    background-position: -200px -400px;
}

.f24-us-ut {
    background-position: -225px -400px;
}

.f24-us-va {
    background-position: -250px -400px;
}

.f24-us-vt {
    background-position: -275px -400px;
}

.f24-us-wa {
    background-position: -300px -400px;
}

.f24-us-wi {
    background-position: -325px -400px;
}

.f24-us-wv {
    background-position: -350px -400px;
}

.f24-us-wy {
    background-position: -375px -400px;
}

[class*=f24-us] {
    background-position: -400px -400px;
}

.f24-uy {
    background-position: -425px 0;
}

.f24-uz {
    background-position: -425px -25px;
}

.f24-va {
    background-position: -425px -50px;
}

.f24-vc {
    background-position: -425px -75px;
}

.f24-ve {
    background-position: -425px -100px;
}

.f24-vg {
    background-position: -425px -125px;
}

.f24-vi {
    background-position: -425px -150px;
}

.f24-vn {
    background-position: -425px -175px;
}

.f24-vt {
    background-position: -425px -200px;
}

.f24-vu {
    background-position: -425px -225px;
}

.f24-ws {
    background-position: -425px -250px;
}

.f24-xa {
    background-position: -425px -275px;
}

.f24-xb {
    background-position: -425px -300px;
}

.f24-xe {
    background-position: -425px -325px;
}

.f24-xh {
    background-position: -425px -350px;
}

.f24-xk {
    background-position: -425px -375px;
}

.f24-xm {
    background-position: -425px -400px;
}

.f24-xr {
    background-position: -150px -425px;
}

.f24-ye {
    background-position: 0 -425px;
}

.f24-yt {
    background-position: -25px -425px;
}

.f24-za {
    background-position: -50px -425px;
}

.f24-zm {
    background-position: -75px -425px;
}

.f24-zw {
    background-position: -100px -425px;
}

.modal {
    top: 150px;
}

.modal.modal-fullscreen {
    top: 0;
    z-index: 999999;
    padding-top: 25px;
}

.icon {
    text-rendering: optimizeLegibility;
}

.popover {
    border: 0;
    min-width: 270px;
    box-shadow: 0 2px 25px rgba(0, 0, 0, 0.15);
}

.popover.bottom>.arrow {
    border-color: transparent;
}

.noscroll {
    overflow: hidden;
}

/* Safari */
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

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

    100% {
        transform: rotate(360deg);
    }
}

.loader {
    border: 5px solid #ffffff;
    border-radius: 50%;
    border-top: 5px solid #44be4c;
    border-left: 5px solid #44be4c;
    width: 30px;
    height: 30px;
    margin-left: 8px;
    -webkit-animation: spin 1s linear infinite;
    /* Safari */
    animation: spin 1s linear infinite;
    display: block;
}

.loader.loader-small {
    display: inline-block;
    border: 2px solid #a2aeb7;
    border-top: 2px solid transparent;
    border-left: 2px solid transparent;
    width: 12px;
    height: 12px;
}

@keyframes loading {
    100% {
        transform: translateX(100%);
    }
}

.load-animation:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: var(--color-bg-900);
    left: 0;
    top: 0;
    z-index: 3;
}

.load-animation:after {
    top: 0;
    z-index: 3;
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient(110deg, rgba(162, 174, 183, 0) 15%, rgba(162, 174, 183, 0.2) 49%, rgba(255, 255, 255, 0) 50%, rgba(162, 174, 183, 0) 85%);
    transform: translateX(-100%);
    animation: loading 1.5s infinite;
    animation-play-state: paused;
}

.load-animation.in-progress {
    animation-play-state: running;
}

.load-animation-light:before {
    background: transparent;
}

.load-animation-light:after {
    background: linear-gradient(110deg, rgba(162, 174, 183, 0) 15%, white 49%, rgba(255, 255, 255, 0) 50%, rgba(162, 174, 183, 0) 85%);
}

HTML {
    cursor: pointer;
    scroll-behavior: smooth;
}

body {
    cursor: default;
}

body.overlay-active {
    overflow: hidden;
    position: relative;
}

@media (min-width: 1200px) {
    body.overlay-active {
        overflow: visible;
    }
}

.exit-link.active .loader {
    width: 16px;
    height: 16px;
    margin: 0 8px 0 0;
}

.exit-link.active svg {
    display: none;
}

.flag-icon {
    position: relative;
    display: block;
    width: 18px;
    height: 18px;
    border-radius: 18px;
    box-shadow: 0 0 4px 0 rgba(29, 39, 48, 0.48);
}

.flag-icon-24 {
    position: relative;
    display: block;
    width: 24px;
    height: 24px;
    border-radius: 24px;
}

.country-change-flag {
    display: inline-block;
    position: relative;
}

.country-change-flag .avail-ico {
    display: inline-flex;
    position: absolute;
    bottom: -3px;
    right: -3px;
}

.country-change-flag .avail-ico svg {
    outline: 1px solid white;
    border-radius: 12px;
    outline-offset: -1px;
}

.flag-icon-grayscale {
    filter: grayscale(100%);
}

.icon-blue {
    color: var(--color-ui-link-light);
}

.btn-orange {
    background-color: #ED9C00;
    border: none;
}

.btn-orange:hover,
.btn-orange:active,
.btn-orange:focus,
.btn-orange.active {
    background: #ba7a00;
}

.btn-blue {
    background-color: var(--color-ui-link-light);
    border: none;
}

.btn-blue:hover,
.btn-blue:active,
.btn-blue:focus,
.btn-blue.active {
    background: var(--color-ui-link-light);
}

.btn-complaint {
    background-color: #ed7600;
    border: none;
}

.btn-complaint:hover,
.btn-complaint:active,
.btn-complaint:focus,
.btn-complaint.active {
    background: #ba5d00;
}

.btn-flex {
    display: flex;
}

.btn-flex-mobile {
    display: flex;
}

@media (min-width: 768px) {
    .btn-flex-mobile {
        display: inline-flex;
    }
}

.btn-small-button-light,
a.btn-small-button-light {
    background: transparent;
    color: var(--color-text-600);
}

.btn-small-button-light:hover,
a.btn-small-button-light:hover {
    background: rgba(123, 140, 152, 0.2);
    color: var(--color-text-600);
}

.btn-small-button-light svg,
a.btn-small-button-light svg {
    fill: var(--color-text-600);
}

.btn-white {
    background: #fff;
    color: var(--color-ui-black);
    font-size: 13px !important;
    padding-top: 15px;
}

.btn-white:hover,
.btn-white:active,
.btn-white:focus,
.btn-white.active {
    background: #e6e6e6;
    color: var(--color-ui-black);
}

.btn-white svg {
    fill: var(--color-text-600);
}

.btn-facebook {
    background: #4267B2;
}

.btn-facebook:hover {
    background: #34518d;
}

.btn-linkedin {
    background: #0E76A8;
}

.btn-linkedin:hover {
    background: #34518d;
}

.btn-disabled {
    color: white;
    background: #a2aeb7;
    cursor: default !important;
}

.btn-disabled:hover,
.btn-disabled:active,
.btn-disabled:focus {
    color: white;
    background: #a2aeb7;
}

.btn-disabled svg {
    fill: white;
}

.btn-border-light {
    color: var(--color-text-600);
    box-shadow: inset 0 0 0 1px var(--color-bg-600);
    background: transparent;
    border: none;
}

@media (min-width: 992px) {
    .btn-border-light:hover {
        background: var(--color-bg-600);
        color: #cdd6dd;
    }

    .btn-border-light:hover svg {
        fill: #E3E7EF;
    }
}

.btn-border-light svg {
    fill: var(--color-text-600);
}

.btn-border-none {
    color: var(--color-text-600);
    box-shadow: inset 0 0 0 1px var(--color-bg-600);
    background: transparent;
    border: none;
    border: none;
    box-shadow: none;
}

@media (min-width: 992px) {
    .btn-border-none:hover {
        background: var(--color-bg-600);
        color: #cdd6dd;
    }

    .btn-border-none:hover svg {
        fill: #E3E7EF;
    }
}

.btn-border-none svg {
    fill: var(--color-text-600);
}

.btn-outline-grey {
    border: none;
    box-shadow: inset 0 0 0 1px var(--color-bg-600);
    color: var(--color-text-600);
    background: transparent;
}

.btn-outline-grey:hover {
    color: #F0F3F7;
    background: var(--color-bg-600);
}

.btn-outline-grey:hover svg {
    fill: #F0F3F7;
}

.btn-outline-grey svg {
    fill: var(--color-text-600);
}

.article-share-widget-btn {
    flex: 1;
}

.article-share-widget-btn.fb {
    background: #4267B2;
}

.article-share-widget-btn.fb:hover {
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), #4267B2;
}

.article-share-widget-btn.vk {
    background: #45668E;
}

.article-share-widget-btn.vk:hover {
    background: #254872;
}

.article-share-widget-btn.twitter {
    background: #1DA1F2;
}

.article-share-widget-btn.twitter:hover {
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), #1DA1F2;
}

.article-share-widget-btn.okru {
    background: #EC9837;
}

.article-share-widget-btn.okru:hover {
    background: #DF8D2E;
}

.article-share-widget-btn.instagram {
    background: linear-gradient(255.96deg, #1D47D7 0%, #A346AA 36.17%, #E95744 62.21%, #F7CC6F 100%);
}

.btn-info {
    padding: 4px 4px;
    margin-left: auto;
    color: var(--color-ui-link-light);
    border: 1px solid var(--color-ui-link-light);
    border-radius: 2px;
    display: inline-block;
    white-space: nowrap;
    text-transform: none;
    font-family: "Noto Sans", sans-serif;
}

.btn-info:hover {
    background: #D9ECFF;
}

.link-dark {
    color: var(--color-text-600);
}

.link-dark svg {
    fill: var(--color-text-600);
}

.link-dark:hover {
    color: var(--color-text-900);
}

.link-dark:hover svg {
    fill: var(--color-text-900);
}

.btn-social-login {
    border: 1px solid #a2aeb7;
    padding: 6px;
    height: 42px;
    display: flex;
    align-items: center;
    border-radius: 2px;
    text-align: center;
    font-family: "neo-sans", sans-serif;
    font-weight: 600;
    font-size: 14px;
    line-height: 17px;
    color: var(--color-text-600);
    cursor: pointer;
    margin-top: 5px;
}

@media (min-width: 768px) {
    .btn-social-login {
        font-size: 16px;
        line-height: 19px;
        height: 48px;
        padding: 8px;
    }
}

.btn-social-login:hover {
    box-shadow: 0px 4px 8px rgba(29, 39, 48, 0.16);
    color: var(--color-text-900);
}

.btn-row-inline {
    display: flex;
    column-gap: 8px;
}

.btn-row-inline>* {
    flex: 1;
}

@media (min-width: 768px) {
    .btn-row-inline>* {
        flex: none;
    }
}

.btn-follow {
    color: var(--color-text-600);
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    text-transform: none;
    cursor: pointer;
    font-weight: bold;
    font-size: 12px;
    line-height: 16px;
    font-family: "Noto Sans", sans-serif;
}

@media (min-width: 568px) {
    .btn-follow {
        font-size: 14px;
        line-height: 20px;
    }
}

.btn-follow svg {
    margin-right: 4px;
    fill: var(--color-text-900);
}

.btn-follow:hover {
    color: var(--color-primary-500);
}

.btn-follow:hover svg {
    fill: var(--color-primary-500);
}

.btn-follow.active {
    color: var(--color-text-900);
}

.btn-follow.active:hover {
    color: var(--color-primary-500);
}

.btn-follow.active:hover svg {
    fill: var(--color-primary-500);
}

.footer-col-newsletter {
    flex: 1 1 100%;
    overflow: hidden;
    border-top: 1px solid var(--color-bg-600);
    margin-bottom: 16px;
}

@media (min-width: 568px) {
    .footer-col-newsletter {
        margin-top: 0;
        order: 5;
    }
}

@media (min-width: 992px) {
    .footer-col-newsletter {
        order: 7;
        flex: 1 1 30%;
        padding: 16px 0;
        margin-bottom: 0;
    }
}

.footer-col-newsletter .loader {
    display: none;
}

.footer-col-newsletter form {
    margin-top: 8px;
}

@media (min-width: 568px) {
    .footer-col-newsletter form {
        margin-top: 16px;
    }
}

@media (min-width: 768px) {
    .footer-col-newsletter form {
        max-width: 620px;
        margin: auto;
    }
}

@media (min-width: 992px) {
    .footer-col-newsletter form {
        margin-bottom: 20px;
    }
}

.footer-col-newsletter form>div {
    flex-wrap: wrap;
}

@media (min-width: 568px) {
    .footer-col-newsletter form>div {
        flex-wrap: nowrap;
    }
}

.footer-col-newsletter .custom-email-checkbox {
    width: 16px;
    height: 16px;
    min-width: 16px;
    background: transparent;
    border: 1px solid #a2aeb7;
    border-radius: 3px;
}

.footer-col-newsletter .cg-input-wrapper {
    width: 100%;
    margin-bottom: 8px;
    background: rgba(123, 140, 152, 0.1);
}

@media (min-width: 568px) {
    .footer-col-newsletter .cg-input-wrapper {
        flex-basis: 100%;
        width: initial;
        margin-right: 8px;
    }
}

.footer-col-newsletter input[type=checkbox] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
    margin-left: 0;
}

.footer-col-newsletter input[type=checkbox]:checked+.custom-email-checkbox {
    background: center/10px no-repeat var(--color-primary-500) url("../images/ico_ui_available_white.svg");
    border-color: var(--color-primary-500);
}

.footer-col-newsletter button[type=submit] {
    background: var(--color-primary-500);
    color: white;
    height: 48px;
    padding: 10px 20px;
    border: none;
    font-size: 16px;
    border-radius: 2px;
    font-family: "neo-sans", sans-serif;
    font-weight: bold;
    white-space: nowrap;
    width: 100%;
}

.footer-col-newsletter button[type=submit] .loader {
    width: 15px;
    height: 15px;
    margin: 0 5px 0 0;
}

.footer-col-newsletter button[type=submit].active .loader {
    display: inline-block;
}

@media (min-width: 568px) {
    .footer-col-newsletter button[type=submit] {
        width: initial;
    }
}

.page-footer-logos {
    flex-basis: 100%;
    border-top: 1px solid var(--color-bg-600);
}

.footer-logo {
    display: inline-block;
    height: 35px;
}

.footer-logo img {
    height: 100%;
    -webkit-filter: grayscale(100%);
}

.page-footer-logos-list {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin: 24px 0;
}

.footer-copyright {
    border-top: 1px solid var(--color-bg-600);
    color: #cdd6dd;
    font-size: 12px;
}

@media (min-width: 768px) {
    .footer-copyright {
        display: flex;
        align-items: flex-start;
    }
}

.footer-copyright .logo {
    margin-right: 20px;
    display: block;
}

.footer-copyright a {
    color: var(--color-primary-500);
    font-weight: bold;
}

.footer-copyright a:hover {
    text-decoration: underline;
    color: var(--color-primary-600);
}

.footer-copyright p {
    margin: 16px 0;
}

@media (min-width: 768px) {
    .footer-copyright p {
        margin: 24px 0;
    }
}

.tippy-box[data-theme=tippy-select] {
    background: white;
    overflow: hidden;
}

@media (min-width: 768px) {
    .tippy-box[data-theme=tippy-select] {
        width: 300px;
    }
}

.tippy-box[data-theme=tippy-select] .tippy-content {
    padding: 0;
}

.tippy-box[data-theme=tippy-select] .tippy-arrow {
    display: none;
}

.footer-language-select-wrapper {
    flex: 1 0 300px;
}

@media (min-width: 768px) {
    .footer-language-select-wrapper {
        margin-left: 32px;
    }
}

.footer-language-select {
    border: 1px solid var(--color-bg-600);
    padding: 8px;
    border-radius: 2px;
    display: flex;
    align-items: center;
    background: rgba(123, 140, 152, 0.1);
    position: relative;
    height: 40px;
    font-size: 16px;
    line-height: 22px;
}

@media (min-width: 768px) {
    .footer-language-select {
        height: 50px;
    }
}

.footer-language-select svg {
    fill: #7B8C98;
}

.footer-language-select .label {
    padding-left: 8px;
}

.footer-language-select .arrow {
    position: absolute;
    right: 8px;
}

.footer-language-options {
    max-height: 200px;
    overflow: auto;
    width: 100%;
    position: relative;
}

.footer-language-options a {
    display: block;
    color: var(--color-text-900);
    min-width: 200px;
    padding: 4px 8px;
    line-height: 22px;
}

.footer-language-options a:hover {
    background: #F0F3F7;
}

.footer-language-options+.overlay {
    content: "";
    position: absolute;
    bottom: 0;
    height: 24px;
    width: 100%;
    right: 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0), white);
    pointer-events: none;
}









.search-results-group:first-child {
    margin-top: 24px;
}

.search-results-group:last-child {
    border: none;
}

.search-results-group .item-icon {
    flex: 0 0 48px;
    text-align: left;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #E3E7EF;
    border: 1px solid #cdd6dd;
    border-radius: 2px;
    padding: 5px 6px;
    margin-right: 16px;
}

.search-results-group .item-icon svg {
    width: 14px;
    height: 14px;
    fill: var(--color-text-600);
}

.search-results-group .item-img {
    text-align: left;
    flex: 0 0 64px;
}

.search-results-group .item-img img {
    display: block;
    background: #E3E7EF;
    height: 24px;
    width: 48px;
    border-radius: 2px;
    object-fit: cover;
}

.search-results-group .item-img.flash img {
    filter: grayscale(1);
}

.search-results-group .item-reputation {
    display: inline;
    align-items: center;
}

.search-results-group .item-reputation b {
    font-weight: bold;
}

.search-results-group .item-reputation svg {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.search-results-group .item-stars {
    max-width: 220px;
    position: relative;
}

.search-results-group .casino-item-img {
    flex: 0 0 auto;
    margin-right: 16px;
    border-radius: 2px;
    overflow: hidden;
}

.search-results-group .casino-item-img img {
    width: 48px;
    height: 24px;
}

.search-results-group-header {
    padding: 0 5px;
    margin: 8px 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 16px;
    line-height: 18px;
    font-weight: 700;
    color: var(--color-primary-500);
}

@media (min-width: 768px) {
    .search-results-group-header {
        margin: 12px 0;
    }
}

.search-results-group-header .item-icon svg {
    fill: var(--color-primary-500);
}

.search-results-group-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--color-text-900);
    font-size: 14px;
    line-height: 20px;
    overflow: hidden;
    padding: 4px 16px;
    margin-bottom: 8px;
}

@media (min-width: 992px) {
    .search-results-group-item {
        margin-bottom: 4px;
        padding: 4px 24px;
    }
}

.search-results-group-item b {
    background: #cdd6dd;
    border-radius: 2px;
    padding: 0 2px;
}

.search-results-group-item .stats b,
.search-results-group-item .item-reputation b {
    background: initial;
    border-radius: 0;
    padding: 0;
}

.search-results-group-item .item-body {
    flex: 1;
    text-align: left;
    text-overflow: ellipsis;
    overflow: hidden;
}

.search-results-group-item .item-body .fs-s {
    margin-top: 2px;
}

.search-results-group-item .item-body .provider {
    font-size: 13px;
    line-height: 17px;
}

.search-results-group-item svg {
    fill: #a2aeb7;
}

.search-results-group-item .live-flag {
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-transform: uppercase;
}

.search-results-group-item .live-flag .dot {
    width: 6px;
    height: 6px;
    background: var(--color-ui-error-red);
    border-radius: 50%;
    display: inline-block;
}

a.search-results-group-item:hover {
    background: #F0F3F7;
}

.complaints-search-results-group-item {
    align-items: flex-start;
}

.complaints-search-results-group-item .casino-item-img {
    margin-right: 8px;
}

.complaints-search-results-group-item .item-icon {
    margin-top: 2px;
}

.search-item-body-wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    flex: 1;
    font-family: "Noto Sans", sans-serif;
    font-size: 12px;
}

.search-item-body-wrapper .avatar-small {
    min-width: 20px;
}

.search-item-body-wrapper .item-desc {
    flex: 1 0 100%;
    word-break: break-word;
}

@media (min-width: 768px) {
    .search-item-body-wrapper .item-desc {
        font-size: 14px;
    }
}

.search-item-body-wrapper .post-author-with-avatar {
    display: flex;
    align-items: center;
    flex: 1;
    min-width: 70px;
}

.forum-category-thread-search-wrapper .search-box-input {
    text-overflow: ellipsis;
}

.search-thread-body-wrapper .thread-col-stats {
    vertical-align: middle;
    display: inline-flex;
}

@media (min-width: 992px) {
    .search-thread-body-wrapper .thread-col-stats {
        flex: 0 0 auto;
    }
}

.search-thread-body-wrapper .stats {
    vertical-align: middle;
    min-width: 60px !important;
    margin-right: 8px !important;
}

.search-post-body-wrapper .post-category {
    flex: 1 0 100%;
}

@media (min-width: 568px) {
    .search-post-body-wrapper .post-category {
        flex: 0 1 auto;
    }
}

.search-post-body-wrapper .post-time {
    color: #7B8C98;
    text-transform: uppercase;
}

.search-post-body-wrapper .post-time-author {
    white-space: nowrap;
    flex-wrap: wrap;
}

.search-post-body-wrapper .dot {
    width: 4px;
    height: 4px;
    display: inline-block;
    vertical-align: middle;
    background: #a2aeb7;
    border-radius: 50%;
    margin-right: 4px;
    margin-bottom: 2px;
}

.search-forum-category-result {
    font-family: "Noto Sans", sans-serif;
    color: var(--color-text-900);
    font-size: 12px;
    margin-bottom: 8px;
    align-items: flex-start;
    font-weight: 400;
}

.search-forum-category-result .title {
    margin-bottom: 2px;
}

@media (min-width: 768px) {
    .search-forum-category-result .title {
        font-size: 14px;
    }
}

.search-forum-category-result .num {
    font-weight: 500;
    margin: 0 4px;
}

.search-forum-category-result .num:first-of-type {
    margin: 0 4px 0 0;
}

.nav-pills-dark {
    gap: 0;
    margin: 0;
}

.nav-pills-dark a {
    border: 1px solid var(--color-primary-500);
    color: #F0F3F7;
    align-items: center;
    display: flex;
    gap: 8px;
    margin: 8px 6px;
}

.nav-pills-dark a:hover {
    box-shadow: 0px 0px 8px 0px var(--color-primary-500);
    color: var(--color-primary-500);
    background: transparent;
    border: 1px solid var(--color-primary-500);
}

.nav-pills-dark .flickity-button-icon {
    width: 16px;
    height: 16px;
}

.nav-pills-dark svg {
    fill: var(--color-primary-500);
}

@media (min-width: 992px) {
    .nav-pills-dark svg {
        width: 22px;
        height: 22px;
    }
}

.nav-pills-dark .flickity-button.next,
.nav-pills-dark .flickity-button.previous {
    border: 1px solid var(--color-primary-500);
    box-shadow: 2px 2px 5px 14px var(--color-bg-950);
    background: var(--color-bg-950);
}

.nav-pills-dark .flickity-button.next:hover,
.nav-pills-dark .flickity-button.previous:hover {
    background: var(--color-bg-950);
    box-shadow: 0 0 8px 0 var(--color-primary-500), 2px 2px 5px 12px #131a21;
}

.nav-pills-dark .flickity-button.next:hover .flickity-button-icon,
.nav-pills-dark .flickity-button.previous:hover .flickity-button-icon {
    fill: var(--color-primary-500);
}

.menu-active-info .close-ico {
    display: none;
}

.menu-badge-content-wrapper {
    padding: 16px;
    position: relative;
}

.menu-badge-content-wrapper .body {
    line-height: 18px;
}

.menu-badge-content-wrapper .title {
    font-size: 16px;
    font-family: "neo-sans", sans-serif;
}

.tippy-content .menu-badge-content-wrapper {
    margin: -16px;
}

.slideable-panel .menu-badge-content-wrapper {
    background: none;
}

.menu-collapse .menu-badge-content-wrapper .title-wrapper {
    margin-bottom: 8px;
}

.menu-badge-content-wrapper .close-ico {
    position: absolute;
    right: 8px;
    top: 8px;
    z-index: 10;
    pointer-events: all;
    fill: rgba(255, 255, 255, 0.3);
}

.menu-badge-content-wrapper .close-ico:hover {
    fill: #fff;
}

.sgw-tooltip-wrapper {
    background: #20286D;
    color: #fff;
}

.sgw-tooltip-wrapper .title-icon {
    fill: #EA5B0B;
}

.sgw-tooltip-wrapper .btn {
    background: #EA5B0B;
    width: 100%;
}

.sgw-tooltip-wrapper .btn:hover {
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.1) 100%), #EA5B0B;
}

.menu .sgw-tooltip-wrapper .btn {
    display: inline-flex;
}

.safety-badge:after {
    background: linear-gradient(180deg, #46DD21 0%, #37C4FF 100%);
}

.safe-zone-wrapper {
    background: linear-gradient(299deg, #37C4FF 0.84%, #46DD21 100%);
}

.safe-zone-wrapper .close-ico {
    fill: var(--color-text-600);
}

.slideable-panel:has(.safe-zone-wrapper) {
    background: linear-gradient(299deg, #37C4FF 0.84%, #46DD21 100%);
}

.submenu {
    text-align: left;
    margin: 0 30px 0 30px;
    display: block;
}

@media (min-width: 768px) {
    .submenu {
        box-shadow: 5px 5px 30px rgba(var(--color-ui-black), 0.1);
        position: absolute;
        top: 100%;
        min-width: 250px;
        background: var(--color-primary-500);
        margin: 0;
        display: none;
    }
}

.submenu.is-active {
    display: block;
}

@media (min-width: 768px) {
    .menu-item:hover .submenu {
        display: block;
    }
}

.submenu-link {
    font-size: 14px;
    text-decoration: none;
    display: block;
    padding: 15px 14px;
    line-height: 1.3em;
    color: #fff;
    position: relative;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-width: 0 0 1px 0;
}

@media (min-width: 768px) {
    .submenu-link {
        padding: 17px 15px 15px 40px;
        border-width: 1px 0 0 0;
    }
}

.submenu-link:hover,
.submenu-link:focus {
    color: #fff;
    text-decoration: none;
}

@media (min-width: 992px) {

    .submenu-link:hover,
    .submenu-link:focus {
        background: var(--color-primary-600);
    }
}

.submenu-link i {
    display: inline-block;
}

@media (max-width: 767px) {
    .submenu-link i {
        width: 25px;
    }
}

@media (min-width: 768px) {
    .submenu-link i {
        position: absolute;
        left: 12px;
        top: 19px;
    }
}

.menu-collapse li .sub-menu.is-active-2 {
    transform: translate(0, 100%);
    opacity: 1;
}

.is-active .sub-menu-wrapper {
    padding-bottom: 8px;
}

@media (min-width: 768px) {
    .is-active .sub-menu-wrapper {
        padding: 0;
    }
}

@media (min-width: 768px) {
    .sub-menu-wrapper {
        background: var(--color-bg-800);
        z-index: 2;
        position: relative;
        display: flex;
        justify-content: flex-start;
        max-width: 1200px;
        margin: 4px 16px 0;
        box-shadow: 0px 24px 48px rgba(0, 0, 0, 0.32);
        border-radius: 2px;
        padding: 32px 24px;
        gap: 16px;
        overflow: hidden;
    }
}

@media (min-width: 992px) {
    .sub-menu-wrapper {
        gap: 24px;
        padding: 48px 220px 48px 48px;
    }
}

@media (min-width: 1200px) {
    .sub-menu-wrapper {
        margin: 4px auto 0;
    }
}

.sub-menu-wrapper .circles {
    position: absolute;
    z-index: 1;
}

.sub-menu-wrapper .submenu-circle-green {
    background: rgba(35, 159, 41, 0.6);
    filter: blur(52px);
    width: 400px;
    height: 90px;
    transform: rotate(45deg);
    position: absolute;
    left: -200px;
    top: -100px;
    display: none;
}

@media (min-width: 768px) {
    .sub-menu-wrapper .submenu-circle-green {
        display: block;
    }
}

.sub-menu-wrapper picture,
.sub-menu-wrapper>img {
    display: none;
}

@media (min-width: 768px) {

    .sub-menu-wrapper picture,
    .sub-menu-wrapper>img {
        align-self: center;
    }
}

@media (min-width: 992px) {

    .sub-menu-wrapper picture,
    .sub-menu-wrapper>img {
        display: block;
        margin: 0;
        position: absolute;
        right: 0;
        bottom: 0;
    }
}

.sub-menu-col {
    font-family: "Noto Sans", sans-serif;
}

@media (min-width: 768px) {
    .sub-menu-col {
        border-right: 1px solid var(--color-bg-600);
        flex: 1;
        max-width: 268px;
        padding-right: 24px;
        position: relative;
        z-index: 2;
    }
}

.sub-menu-col:nth-last-child(3) {
    border-right: none;
}

.sub-menu-col:first-of-type .col-label {
    margin-top: 16px;
}

@media (min-width: 768px) {
    .sub-menu-col:first-of-type .col-label {
        margin: 0 0 24px 0;
    }
}

.sub-menu-col .col-label {
    font-family: neo-sans, sans-serif;
    font-size: 16px;
    line-height: 20px;
    font-weight: 700;
    color: white;
    margin: 24px 0 24px 0;
}

@media (min-width: 768px) {
    .sub-menu-col .col-label {
        margin: 0 0 24px 0;
        font-size: 18px;
        line-height: 24px;
        font-weight: normal;
    }
}

.sub-menu-col a {
    padding: 8px 8px 8px 32px;
    font-size: 14px;
    line-height: 18px;
    display: flex;
    align-items: center;
    position: relative;
    color: #F0F3F7;
}

.sub-menu-col a:first-child {
    border-top: none;
}

@media (min-width: 768px) {
    .sub-menu-col a {
        padding: 8px 8px 8px 8px;
        font-weight: 700;
        font-size: 14px;
        line-height: 19px;
        margin: 0;
        border: none;
    }
}

@media (min-width: 992px) {
    .sub-menu-col a {
        font-size: 14px;
    }
}

.sub-menu-col a:hover {
    background: rgba(123, 140, 152, 0.1);
    border-radius: 2px;
}

.sub-menu-col a.active {
    margin-right: 16px;
    color: var(--color-primary-500);
}

@media (min-width: 768px) {
    .sub-menu-col a.active {
        margin-right: 0;
    }
}

.sub-menu-col svg {
    margin-right: 8px;
}

/**************************\
  Demo Animation Style
\**************************/
@keyframes mmfadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes mmfadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

@keyframes mmslideIn {
    from {
        transform: translateY(15%);
    }

    to {
        transform: translateY(0);
    }
}

@keyframes mmslideOut {
    from {
        transform: translateY(0);
    }

    to {
        transform: translateY(-10%);
    }
}

.micromodal-slide.is-open {
    display: block;
}

.micromodal-slide[aria-hidden=false] .cg-modal-overlay {
    animation: mmfadeIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden=false] .cg-modal-container {
    animation: mmslideIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden=true] .cg-modal-overlay {
    animation: mmfadeOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden=true] .cg-modal-container {
    animation: mmslideOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2002;
    background-color: #000;
    opacity: 0;
    height: 100%;
    transform: translateY(-100%);
}

body.overlay-active .modal-backdrop {
    opacity: 0.5;
    transform: translateY(0);
}

body.search-overlay-active .modal-backdrop {
    opacity: 0.5;
    height: 100%;
    z-index: 2000;
    transform: translateY(0);
}

.cg-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    padding: 15px;
    justify-content: center;
    align-items: center;
    overflow-x: hidden;
    overflow-y: auto;
    z-index: 9999;
}

@media (min-width: 768px) {
    .cg-modal-overlay {
        padding: 30px;
    }
}

.cg-modal-overlay-fullscreen {
    padding: 8px;
}

.tooltip-section {
    padding-bottom: 16px;
    border-bottom: 1px solid #E3E7EF;
    margin-bottom: 16px;
}

.tooltip-section:last-child {
    border: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.casino-card-languages-ul {
    min-width: 280px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.cg-modal-container {
    max-width: 600px;
    border-radius: 2px;
    box-sizing: border-box;
    position: relative;
    margin: auto;
    min-width: 304px;
    width: 100%;
}

@media (min-width: 568px) {
    .cg-modal-container {
        min-width: 536px;
    }
}

@media (min-width: 992px) {
    .cg-modal-container {
        width: 600px;
    }
}

.modal-content-tabs {
    width: 100%;
    display: flex;
}

.modal-content-tab {
    width: 50%;
    padding: 8px;
    border-bottom: 2px solid #E3E7EF;
    background: #fff;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    text-transform: uppercase;
    color: #7B8C98;
    border-bottom: 2px solid #E3E7EF;
}

.modal-content-tab:hover {
    color: var(--color-text-600);
}

.modal-content-tab.active {
    color: var(--color-text-900);
    border-bottom: 2px solid var(--color-primary-500);
}

.cg-modal-register-row {
    align-items: flex-start;
    margin-bottom: 8px;
    width: 100%;
}

@media (min-width: 568px) {
    .cg-modal-register-row {
        display: flex;
        flex-direction: row;
        margin-bottom: 8px;
        margin-top: 8px;
    }

    .cg-modal-register-row>div {
        margin-bottom: 0;
        margin-top: 0;
        flex-grow: 1;
        width: 50%;
    }

    .cg-modal-register-row>div:first-of-type {
        margin-right: 4px;
    }

    .cg-modal-register-row>div:last-of-type {
        margin-left: 4px;
    }
}

@media (min-width: 768px) {
    .cg-modal-register-row>div:first-of-type {
        margin-right: 8px;
    }

    .cg-modal-register-row>div:last-of-type {
        margin-left: 8px;
    }
}

.cg-modal-1\/2-btn {
    width: 50%;
    flex: 1 0;
}

.cg-modal-close {
    position: absolute;
    right: 4px;
    top: 4px;
    padding: 6px;
    cursor: pointer;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cg-modal-close:hover,
.cg-modal-close:active,
.cg-modal-close:focus,
.cg-modal-close.active {
    text-decoration: none;
    color: var(--color-primary-500);
}

@media (min-width: 992px) {
    .cg-modal-close {
        right: 4px;
        top: 4px;
    }
}

.cg-modal-content {
    text-align: center;
    background: white;
    padding: 32px 16px 16px;
}

@media (min-width: 568px) {
    .cg-modal-content {
        padding: 40px 32px 32px;
    }
}

@media (min-width: 992px) {
    .cg-modal-content {
        padding: 48px;
    }
}

.cg-modal-content .avatar-loader {
    display: none;
}

.cg-modal-content .neo-fs-28 {
    margin-top: 0;
}

.cg-modal-content .cg-modal-btn-row {
    margin: 16px 0 0;
}

@media (min-width: 568px) {
    .cg-modal-content .cg-modal-btn-row {
        margin: 24px 0 0;
    }
}

@media (min-width: 992px) {
    .cg-modal-content .cg-modal-btn-row {
        margin: 32px 0 0;
    }
}

.cg-modal-promo-container {
    overflow: hidden;
    max-width: 536px;
}

@media (min-width: 992px) {
    .cg-modal-promo-container {
        display: flex;
        max-width: none;
        width: 800px;
    }
}

.cg-modal-btn-row,
.cg-btn-row {
    display: flex;
    flex-direction: column;
    row-gap: 8px;
}

@media (min-width: 568px) {

    .cg-modal-btn-row,
    .cg-btn-row {
        column-gap: 8px;
        flex-direction: row;
        align-items: flex-start;
    }
}

.cg-modal-btn-column {
    margin-top: 16px;
    display: flex;
    flex-direction: column;
    row-gap: 8px;
}

@media (min-width: 568px) {
    .cg-modal-btn-column {
        row-gap: 16px;
        margin-top: 24px;
    }
}

@media (min-width: 992px) {
    .cg-modal-btn-column {
        margin-top: 32px;
    }
}

.cg-modal-promo-content {
    padding: 38px 24px 24px;
    background: white;
    order: 1;
    flex: 1;
}

@media (min-width: 568px) {
    .cg-modal-promo-content {
        padding: 24px;
    }
}

@media (min-width: 768px) {
    .cg-modal-promo-content {
        padding: 32px;
        text-align: left;
    }
}

@media (min-width: 992px) {
    .cg-modal-promo-content {
        padding: 48px;
    }
}

.cg-modal-promo-content ul li {
    font-size: 16px;
    line-height: 24px;
    padding: 2px 0;
    display: flex;
    align-items: flex-start;
}

.cg-modal-promo-content ul svg {
    flex-shrink: 0;
    margin-top: 4px;
}

@media (min-width: 568px) {
    .cg-modal-promo-content .article-share-widget-btn {
        margin-right: 4px;
    }
}

.cg-modal-promo-content input[type=checkbox] {
    margin: 4px 8px 0 0;
}

.modal-img-flag {
    position: absolute;
    top: 40px;
    right: 30px;
}

@media (min-width: 768px) {
    .modal-img-flag {
        top: 70px;
    }
}

.modal-img-flag .flag-icon {
    width: 72px;
    height: 53px;
    border-radius: 8px;
    overflow: hidden;
}

@media (min-width: 768px) {
    .modal-img-flag .flag-icon {
        width: 90px;
        height: 66px;
    }
}

.cg-modal-promo-img {
    background: #F0F3F7;
    align-items: center;
    justify-content: center;
    order: 2;
    position: relative;
}

@media (min-width: 568px) {
    .cg-modal-promo-img {
        display: flex;
        max-height: 200px;
        overflow: hidden;
    }
}

@media (min-width: 992px) {
    .cg-modal-promo-img {
        padding-top: 0;
        flex: 0 0 290px;
        max-height: none;
        overflow: hidden;
    }
}

@media (min-width: 992px) {
    .cg-modal-promo-img .wrapper {
        position: absolute;
        width: 100%;
        height: 100%;
    }
}

.cg-modal-promo-img img {
    max-width: 100%;
    height: auto;
}

@media (min-width: 992px) {
    .cg-modal-promo-img img {
        height: 100%;
        width: 100%;
        object-fit: cover;
    }
}

.modal-container-bonus {
    border-radius: 2px;
}

.modal-container-bonus .cg-modal-content {
    border-radius: 2px;
    padding: 48px 0 0 0;
}

@media (min-width: 768px) {
    .modal-container-bonus .cg-modal-content {
        padding: 64px 32px 32px;
    }
}

.newsletter-modal-container .newsletter-form {
    text-align: center;
}

.newsletter-modal-container .newsletter-form-labels label {
    display: flex;
    align-items: center;
    color: var(--color-text-600);
    font-size: 16px;
    line-height: 20px;
}

.newsletter-modal-container .newsletter-form-labels label:not(:last-child) {
    margin-bottom: 8px;
}

.newsletter-modal-container a {
    color: var(--color-primary-500);
}

.newsletter-modal-container ul {
    list-style-type: disc;
}

.newsletter-modal-container ul li {
    text-align: left;
    padding: 4px 0;
    font-weight: bold;
}

.newsletter-modal-container .feedback-panel {
    display: none;
}

.newsletter-modal-container .invalid input[type=email] {
    border-color: var(--color-ui-error-red);
}

.newsletter-modal-container .invalid .feedback-panel {
    display: block;
}

.newsletter-modal-container .subscribe-newsletter-btn {
    width: 100%;
    margin-top: 8px;
}

@media (min-width: 568px) {
    .newsletter-modal-container .subscribe-newsletter-btn {
        width: auto;
        min-width: 120px;
        margin-left: 8px;
        margin-top: 0;
    }
}

.cg-modal-footer {
    padding: 16px 16px;
    left: -16px;
    width: calc(100% + 32px);
    margin-bottom: -24px;
    position: relative;
    background: #F0F3F7;
}

@media (min-width: 568px) {
    .cg-modal-footer {
        padding: 24px 32px;
        width: calc(100% + 64px);
        margin-bottom: -32px;
        left: -32px;
        margin-top: 32px;
    }
}

@media (min-width: 992px) {
    .cg-modal-footer {
        padding: 32px 48px;
        width: calc(100% + 96px);
        margin-bottom: -48px;
        left: -48px;
        margin-top: 48px;
    }
}

.cg-modal-footer a {
    font-weight: bold;
}

.fade-burger {
    color: #fff;
}

.redirect-popup h3 {
    font-family: "neo-sans", sans-serif;
    font-size: 22px;
    font-weight: 700;
    line-height: 26px;
}

@media (min-width: 768px) {
    .redirect-popup h3 {
        font-size: 25px;
        line-height: 29px;
    }
}

.redirect-popup i {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    box-shadow: 0px 0px 4px 0px rgba(29, 39, 48, 0.48);
}

@media (min-width: 768px) {
    .redirect-popup i {
        width: 40px;
        height: 40px;
    }
}

@media (min-width: 992px) {
    .redirect-popup i {
        width: 60px;
        height: 60px;
    }
}

.redirect-popup .btn {
    min-width: 256px;
}

.redirect-popup .btn-wrapper {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

@media (min-width: 768px) {
    .redirect-popup .btn-wrapper {
        flex-direction: row;
        gap: 16px;
    }
}

.cg-flash-message {
    transition: transform 0.3s ease-in-out;
}

.cg-flash-message .btn-flash-message-wrapper {
    display: flex;
    gap: 8px;
    margin-top: 8px;
}

.cg-flash-message .btn-flash-message {
    border: 1px solid #cdd6dd;
    padding: 4px 8px;
    flex: 1;
    border-radius: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cg-flash-message .btn-flash-message:hover {
    background: #F0F3F7;
}

.cg-flash-message-img {
    border-radius: 2px;
    overflow: hidden;
    margin-right: 8px;
    flex-shrink: 0;
}

.cg-flash-message-img img {
    display: block;
    height: 100%;
    object-fit: contain;
    background: #E3E7EF;
}

.cg-flash-message-close {
    display: block;
    position: absolute;
    top: 8px;
    right: 8px;
    cursor: pointer;
}

.cg-flash-message-close:hover {
    opacity: 0.8;
}

.cg-flash-message-close svg {
    display: block;
}

.cg-flash-message-content {
    font-family: "neo-sans", sans-serif;
    color: var(--color-text-900);
    font-weight: 700;
    font-size: 16px;
    line-height: 19px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.cg-flash-message-content a {
    color: var(--color-text-900);
}

.cg-flash-message-content a:hover {
    color: var(--color-primary-500);
}

.cg-modal-bonus-tutorial-overlay {
    align-items: flex-start;
}

.cg-modal-bonus-tutorial-overlay img {
    display: block;
    max-width: 100%;
    height: auto;
}

.cg-modal-bonus-tutorial-overlay .load-animation {
    overflow: hidden;
    position: relative;
}

.bonus-tutorial-placeholder {
    overflow: hidden;
}

.bonus-tutorial-modal-container {
    max-width: 100%;
}

@media (min-width: 768px) {
    .bonus-tutorial-modal-container {
        max-width: 1000px;
    }
}

.bonus-tutorial-modal-container picture {
    margin: 16px 0;
    border: 4px solid white;
    border-radius: 2px;
    display: block;
    max-width: 100vw;
}

.bonus-tutorial-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: white;
    font-weight: 700;
    font-size: 16px;
    line-height: 20px;
    font-family: "neo-sans", sans-serif;
    margin-bottom: 8px;
}

@media (min-width: 768px) {
    .bonus-tutorial-modal-header .header-bonuses {
        width: 30px;
        height: 30px;
    }
}

.bonus-tutorial-modal-header .close {
    fill: #a2aeb7;
    display: block;
    cursor: pointer;
}

@media (min-width: 768px) {
    .bonus-tutorial-modal-header .close {
        width: 24px;
        height: 24px;
    }
}

.badge-reminder-modal .btn-wrapper {
    margin-top: 16px;
}

@media (min-width: 768px) {
    .badge-reminder-modal .btn-wrapper {
        align-items: center;
        margin-top: 24px;
    }
}

.modal .language-modal {
    padding: 30px 35px 30px 20px;
}

@media (min-width: 768px) {
    .modal .language-modal {
        padding: 30px 45px 30px 30px;
    }
}

.select-language-with-icon i {
    display: block;
    margin-right: 7px;
    vertical-align: middle;
}

.select-language-with-icon-wrapper {
    display: flex;
    align-items: center;
    padding-right: 30px;
}

.language-modal-add {
    font-weight: bold;
    font-size: 16px;
    line-height: 22px;
    color: var(--color-primary-500);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.country-subtitle {
    display: block;
    margin-top: 8px;
    font-family: "neo-sans", sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    line-height: 22px;
}

@media (min-width: 768px) {
    .country-subtitle {
        font-size: 17px;
        line-height: 24px;
    }
}

@media (min-width: 992px) {
    .country-subtitle {
        font-size: 18px;
        line-height: 24px;
        margin-top: 16px;
    }
}

.language-select-btn {
    border: 1px solid #a2aeb7;
    border-radius: 2px;
    padding: 8px;
    flex: 1;
    text-align: center;
    position: relative;
    cursor: pointer;
}

@media (min-width: 568px) {
    .language-select-btn {
        padding: 16px;
    }
}

@media (min-width: 768px) {
    .language-select-btn {
        padding: 24px;
    }
}

.language-select-btn:first-child {
    margin-right: 8px;
}

@media (min-width: 568px) {
    .language-select-btn:first-child {
        margin-right: 16px;
    }
}

.language-select-btn:hover {
    border-color: var(--color-primary-500);
}

.language-select-btn:hover .check-icon {
    border-color: var(--color-primary-500);
    background: var(--color-primary-500);
}

.language-select-btn label {
    font-size: 16px;
    line-height: 19px;
    display: inline-block;
    margin: 0 0 8px 0;
    color: var(--color-text-900);
}

.language-select-btn .check-icon {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 8px;
    right: 8px;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    border: 1px solid #a2aeb7;
    background: white;
}

@media (min-width: 568px) {
    .language-select-btn .check-icon {
        width: 22px;
        height: 22px;
    }

    .language-select-btn .check-icon svg {
        width: 16px;
        height: 16px;
    }
}

.language-select-btn .flag-icon {
    margin: 8px auto;
    width: 32px;
    height: 24px;
    display: block;
}

@media (min-width: 568px) {
    .language-select-btn .flag-icon {
        width: 64px;
        height: 48px;
    }
}

@media (min-width: 768px) {
    .language-select-btn .flag-icon {
        width: 86px;
        height: 64px;
    }
}

.language-buttons {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.language-buttons button {
    width: 100%;
}

.modal-language-form-title {
    font-size: 12px;
    font-weight: bold;
    color: var(--color-text-900);
    text-transform: uppercase;
    text-align: left;
}

.menu-expandable-popup.menu-language-settings-popup {
    overflow: unset;
}

.menu-expandable-popup.menu-language-settings-popup select {
    width: 100%;
    height: 50px;
}

.menu-expandable-popup.menu-language-settings-popup .choices__list--dropdown .choices__item--selectable {
    padding-right: 10px;
}

.menu-language-settings-popup .cg-choices .choices:after {
    top: 16px;
}

.profile-link-advanced-settings {
    display: flex;
    align-items: center;
    justify-content: center;
}

.profile-link-advanced-settings a {
    color: var(--color-primary-500);
    display: flex;
    align-items: center;
    font-weight: bold;
    cursor: pointer;
}

.profile-link-advanced-settings a:hover {
    text-decoration: underline;
}

.profile-link-advanced-settings a svg {
    margin-right: 0.25em;
}

.popup-modal-exit-button {
    text-align: right;
}

.popup-modal-exit-button svg {
    cursor: pointer;
    width: 18px;
    height: 18px;
}

.popup-modal-exit-button svg:hover {
    fill: var(--color-text-600);
}

.menu-language-settings-popup-content .loader {
    margin-right: auto;
    margin-left: auto;
}

@media (min-width: 768px) {
    .sm\:w-auto {
        width: auto;
    }
}

.w-full {
    width: 100%;
}

.relative {
    position: relative;
}

.inline {
    display: inline;
}

.align-middle {
    vertical-align: middle;
}

.no-wrap {
    white-space: nowrap;
}

.rot-180 {
    transform: rotate(180deg);
}

@media (min-width: 568px) {
    .sm\:no-wrap {
        white-space: nowrap;
    }
}

.base-link:hover {
    cursor: pointer;
    opacity: 0.8;
}

.cursor-pointer {
    cursor: pointer;
}

.opacity-0 {
    opacity: 0;
}

.toggle .expanded-visible,
.slide-toggle .expanded-visible,
.slide-toggle+* .expanded-visible {
    display: block;
}

@media (min-width: 768px) {

    .toggle .expanded-visible,
    .slide-toggle .expanded-visible,
    .slide-toggle+* .expanded-visible {
        display: block;
    }
}

.toggle .expanded-hidden,
.slide-toggle .expanded-hidden,
.slide-toggle+* .expanded-hidden {
    display: none;
}

.perfect {
    color: #43C429;
    fill: #43C429;
}

.very-bad {
    color: var(--color-ui-error-red);
    fill: var(--color-ui-error-red);
}

.bad {
    color: #ed7600;
    fill: #ed7600;
}

.unknown {
    color: #d1d4d9;
    fill: #d1d4d9;
}

.questionable {
    color: #ED9C00;
    fill: #ED9C00;
}

.good {
    color: #81cc15;
    fill: #81cc15;
}

.bg-perfect {
    background: #43C429;
}

.bg-verybad {
    background: var(--color-ui-error-red);
}

.bg-none {
    background: #A2A2A2;
}

.bg-transparent {
    background: transparent;
}

.bg-questionable {
    background: #ED9C00;
}

.bg-good {
    background: #81cc15;
}

.vertical-align-middle {
    vertical-align: middle;
}

.vertical-align-bottom {
    vertical-align: bottom;
}

.hover:hover {
    opacity: 0.8;
    cursor: pointer;
}

.b-w {
    filter: grayscale(100%);
}

strong,
.strong {
    font-weight: bold;
}

.img-placeholder img {
    display: none;
}

.translate svg {
    margin-right: 4px;
    flex-shrink: 0;
}

.translate a {
    display: flex;
}

.translate img {
    margin-top: 2px;
    margin-left: 4px;
    display: block;
}

.translate .translate-text {
    font-size: 12px;
    line-height: 16px;
    color: #757575;
}

.grecaptcha-badge {
    display: none;
}

.hr {
    border-bottom: 1px solid #cdd6dd;
}

.safety-index-detail {
    display: flex;
    border: 1px solid #cdd6dd;
    border-radius: 2px;
    padding: 8px;
    font-size: 14px;
    line-height: 18px;
    gap: 8px;
    margin-top: 8px;
    align-items: flex-start;
}

.safety-index-detail span {
    border-radius: 2px;
    font-size: 16px;
    line-height: 16px;
    font-weight: 700;
    padding: 8px;
    color: white;
}

.tippy-box[data-theme=light],
.tippy-box[data-theme=tippy-with-header] {
    background-color: white;
    text-align: left;
    box-shadow: 0 2px 25px rgba(0, 0, 0, 0.15);
    color: #1D2730;
    font-size: 13px;
    border-radius: 2px;
    overflow: hidden;
}

.tippy-box[data-theme=light] .tippy-arrow:before,
.tippy-box[data-theme=tippy-with-header] .tippy-arrow:before {
    color: #fff;
}

.tippy-content {
    padding: 16px;
}

.tooltip-title {
    padding-right: 16px;
}

.header-tooltips {
    position: absolute;
    width: 100%;
    height: 40px;
    top: 4px;
    left: -4px;
}

.header-tooltips .tippy-close,
.header-tooltips .placeholder {
    z-index: 100;
    position: relative;
    width: 40px;
}

.header-tooltips svg {
    fill: var(--color-text-600);
}

.header-tooltips .tippy-close:hover svg {
    fill: var(--color-text-900);
}

.tippy-close {
    padding: 10px;
    cursor: pointer;
}

*[id^=tippy-] {
    pointer-events: initial;
}

.tippy-content {
    word-wrap: break-word;
    font-size: 14px;
    line-height: 18px;
}

.popover-heading-label {
    display: block;
    font-family: neo-sans, sans-serif;
    font-size: 16px;
    line-height: 20px;
    font-style: normal;
    font-weight: 700;
    color: var(--color-text-900);
    margin-bottom: 12px;
}

@media (min-width: 768px) {
    .popover-heading-label {
        margin-bottom: 16px;
    }
}

.tippy-box[data-theme~=secondary-tooltip] .tippy-content {
    font-size: 12px;
    line-height: 16px;
    padding: 4px;
}

.magic-line {
    position: absolute;
    bottom: 0;
    z-index: 30;
    margin: 0;
    border: 0;
    width: 0;
    left: 0;
    height: 4px !important;
    padding: 0;
    background: var(--color-primary-500);
    pointer-events: none;
    transition-property: left, width;
    transition-duration: 0.25s;
    border-radius: 2px 2px 0 0;
    opacity: 0;
    /* initially hidden, gets visible by JS when really used */
}

.strong {
    font-weight: 700;
}

.text-line-through {
    text-decoration: line-through;
    color: var(--color-ui-error-red);
}

.text-line-through span {
    color: var(--color-ui-black);
}

.neo-sans {
    font-family: "neo-sans", sans-serif;
    font-weight: 700;
}

.typography p.smaller {
    font-size: 16px;
}

.typography p.note-box {
    background-color: #E3E7EF;
    padding: 30px 30px;
}

.typography i,
.typography em {
    font-style: italic;
}

.typography i.icon {
    font-style: initial;
}

.typography figure>.table-responsive {
    margin-bottom: 0;
}

.typography h2,
.typography h3,
.typography h4,
.typography h5,
.typography h6 {
    font-family: "neo-sans", sans-serif;
    font-weight: 700;
}

.typography h2 {
    margin: 32px 0 16px;
    font-family: "neo-sans", sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 22px;
    line-height: 26px;
}

@media (min-width: 768px) {
    .typography h2 {
        font-size: 25px;
        line-height: 29px;
    }
}

@media (min-width: 992px) {
    .typography h2 {
        font-size: 28px;
        line-height: 34px;
    }
}

@media (min-width: 568px) {
    .typography h2 {
        margin: 40px 0 16px;
    }
}

@media (min-width: 992px) {
    .typography h2 {
        margin: 48px 0 24px;
    }
}

.typography h3 {
    margin: 24px 0 8px;
    font-family: "neo-sans", sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 20px;
    line-height: 24px;
}

@media (min-width: 568px) {
    .typography h3 {
        font-size: 22px;
        line-height: 26px;
    }
}

@media (min-width: 992px) {
    .typography h3 {
        font-size: 25px;
        line-height: 30px;
    }
}

@media (min-width: 568px) {
    .typography h3 {
        margin: 32px 0 16px;
    }
}

@media (min-width: 992px) {
    .typography h3 {
        margin: 40px 0 16px;
    }
}

.typography h4,
.typography .h4 {
    margin: 24px 0 8px;
    font-weight: 700;
    font-family: "neo-sans", sans-serif;
    font-style: normal;
    font-size: 18px;
    line-height: 24px;
}

@media (min-width: 768px) {

    .typography h4,
    .typography .h4 {
        font-size: 20px;
        line-height: 26px;
    }
}

@media (min-width: 992px) {

    .typography h4,
    .typography .h4 {
        font-size: 22px;
        line-height: 26px;
    }
}

@media (min-width: 568px) {

    .typography h4,
    .typography .h4 {
        margin: 32px 0 8px;
    }
}

@media (min-width: 992px) {

    .typography h4,
    .typography .h4 {
        margin: 40px 0 8px;
    }
}

.typography strong,
.typography b:not(.link-info) {
    color: var(--color-text-900);
}

.typography blockquote {
    background: #E3E7EF;
    padding: 25px;
}

.typography blockquote p {
    font-size: 18px;
    margin-bottom: 1.2em;
    font-weight: 700;
    color: var(--color-text-900);
    font-style: italic;
}

@media (min-width: 768px) {
    .typography blockquote p {
        font-size: 20px;
    }
}

.typography blockquote p.smaller {
    font-style: italic;
    font-size: 17px;
    font-weight: normal;
}

.typography .blockquote-ext {
    padding: 10px 10px 10px 30px;
    border-left: 5px solid #e5e5e5;
    background-color: transparent;
}

.typography .blockquote-ext p {
    font-weight: 400;
    color: #717171;
}

.typography a:not(.btn):not(.no-style),
.typography .link-primary {
    color: var(--color-text-900);
    overflow-wrap: break-word;
    text-decoration: underline;
}

.typography a:not(.btn):not(.no-style) svg,
.typography .link-primary svg {
    fill: var(--color-text-900);
}

.typography a:not(.btn):not(.no-style):hover,
.typography .link-primary:hover {
    text-decoration: none;
    color: var(--color-text-900);
    cursor: pointer;
}

.typography a:not(.btn):not(.no-style):hover svg,
.typography .link-primary:hover svg {
    fill: var(--color-text-900);
}

.typography a:not(.btn):not(.no-style):hover *,
.typography .link-primary:hover * {
    color: var(--color-text-900) !important;
}

.section-dark .typography a:not(.btn):not(.no-style),
.section-dark .typography .link-primary {
    color: var(--color-primary-500);
}

.section-dark .typography a:not(.btn):not(.no-style) svg,
.section-dark .typography .link-primary svg {
    fill: var(--color-primary-500);
}

.section-dark .typography a:not(.btn):not(.no-style):hover,
.section-dark .typography .link-primary:hover {
    color: var(--color-primary-500);
}

.section-dark .typography a:not(.btn):not(.no-style):hover svg,
.section-dark .typography .link-primary:hover svg {
    fill: var(--color-primary-500);
}

.section-dark .typography a:not(.btn):not(.no-style):hover *,
.section-dark .typography .link-primary:hover * {
    color: var(--color-primary-500) !important;
}

.typography .btn-content-wrapper {
    margin-bottom: 12px;
}

@media (min-width: 568px) {
    .typography .btn-content-wrapper {
        margin-bottom: 16px;
    }
}

@media (min-width: 1200px) {
    .typography .btn-content-wrapper {
        margin-bottom: 24px;
    }
}

.typography .btn-content-wrapper .btn {
    width: 100%;
}

@media (min-width: 568px) {
    .typography .btn-content-wrapper .btn {
        max-width: 320px;
    }
}

.typography hr {
    border-top: 2px solid #44be4c;
}

.typography figcaption {
    display: block;
    margin: 8px 0 0 0;
    line-height: 1.5em;
    text-align: center;
    color: var(--color-text-600);
}

.typography .note {
    background: #D9ECFF;
    border: 1px solid #007DFF;
    border-radius: 2px;
    font-size: 16px;
    line-height: 24px;
    padding: 16px;
}

@media (min-width: 568px) {
    .typography .note {
        padding: 24px;
    }
}

@media (min-width: 992px) {
    .typography .note {
        padding: 32px;
    }
}

.typography .note p:last-of-type {
    margin-bottom: 0;
}

.typography .note-inner {
    display: flex;
    align-items: start;
}

.typography .note-inner svg {
    fill: #007DFF;
}

.typography .note-inner div:first-of-type {
    margin-right: 16px;
}

.typography .note-content {
    font-style: italic;
    margin-bottom: 0;
}

.typography .quote-widget {
    background: rgba(123, 140, 152, 0.1);
    border: 1px solid #4A5B68;
    border-radius: 2px;
    line-height: 24px;
    padding: 16px;
}

@media (min-width: 568px) {
    .typography .quote-widget {
        padding: 24px;
    }
}

@media (min-width: 992px) {
    .typography .quote-widget {
        padding: 32px;
    }
}

.typography .quote-widget p {
    font-size: 16px;
}

.typography .quote-widget-inner {
    display: flex;
    align-items: start;
    color: var(--color-text-900);
}

.typography .quote-widget-inner svg {
    fill: #000;
}

.typography .quote-widget-inner div:first-of-type {
    margin-right: 16px;
}

.typography .quote-widget-content {
    font-weight: bold;
    font-style: italic;
    margin-bottom: 0;
}

.typography .tip-widget {
    background: #E7F9E8;
    border: 1px solid #5DD667;
    border-radius: 2px;
    line-height: 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 133px 0 16px;
    padding: 16px;
    /* allow tip widget to be used without an image */
}

@media (min-width: 568px) {
    .typography .tip-widget {
        padding: 24px;
    }
}

@media (min-width: 992px) {
    .typography .tip-widget {
        padding: 32px;
    }
}

@media (min-width: 568px) {
    .typography .tip-widget {
        margin: 24px 0;
        flex-direction: row;
    }
}

@media (min-width: 768px) {
    .typography .tip-widget {
        margin: 32px 0;
    }
}

.typography .tip-widget p {
    font-size: 16px;
}

.typography .tip-widget[data-img=""] {
    margin-top: 0;
}

.typography .tip-widget[data-img=""] .tip-widget-image {
    display: none;
}

.typography .tip-widget-image {
    padding: 0 16px;
    transform: translateY(-75%);
    margin-bottom: -113px;
}

@media (min-width: 568px) {
    .typography .tip-widget-image {
        margin-bottom: 0;
        transform: none;
        margin-right: 16px;
    }
}

@media (min-width: 768px) {
    .typography .tip-widget-image {
        margin-right: 24px;
    }
}

.typography .tip-widget-image img {
    width: 117px;
    height: auto;
    object-fit: contain;
}

@media (min-width: 568px) {
    .typography .tip-widget-image img {
        width: 150px;
        height: auto;
    }
}

.typography .tip-widget-content {
    font-weight: bold;
    font-size: 16px;
}

.typography .alert-widget {
    background: #feebed;
    border: 1px solid #ED3445;
    border-radius: 2px;
    line-height: 24px;
    margin-bottom: 24px;
    padding: 16px;
}

@media (min-width: 568px) {
    .typography .alert-widget {
        padding: 24px;
    }
}

@media (min-width: 992px) {
    .typography .alert-widget {
        padding: 32px;
    }
}

.typography .alert-widget p {
    font-size: 16px;
}

.typography .alert-widget-inner {
    display: flex;
    align-items: start;
    color: var(--color-text-900);
}

.typography .alert-widget-inner svg {
    fill: #ED3445;
}

.typography .alert-widget-inner div:first-of-type {
    margin-right: 16px;
}

.typography .alert-widget-content {
    font-weight: bold;
    margin-bottom: 0;
}

.rectification {
    flex: 0 0 100%;
}

.rectification .quote-widget p {
    font-size: 21px;
    line-height: 24px;
}

@media (min-width: 768px) {
    .rectification .quote-widget p {
        font-size: 29px;
        line-height: 33px;
    }
}

.table {
    left: -15px;
    width: calc(100% + 30px);
    text-align: left;
}

@media (min-width: 568px) {
    .table {
        left: auto;
        width: 100%;
    }
}

.table-responsive {
    border-radius: 2px;
    border: 1px solid #fff;
    text-align: left;
}

.example {
    background-color: #E7F9E8;
    border: 1px solid #5DD667;
    border-radius: 2px;
    margin-bottom: 24px;
    overflow: hidden;
    padding: 16px;
}

@media (min-width: 568px) {
    .example {
        padding: 24px;
    }
}

@media (min-width: 992px) {
    .example {
        padding: 32px;
    }
}

.example p:last-of-type,
.example ul:last-of-type {
    margin-bottom: 0;
}

.example strong {
    font-weight: bold;
}

.example-title {
    text-transform: uppercase;
    font-size: 20px;
    font-weight: bold;
    padding-bottom: 8px;
}

.example-title img {
    vertical-align: middle;
    display: inline-block;
    margin-right: 8px;
    margin-top: -3px;
}

.video-wrapper {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 25px;
    height: 0;
}

.video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

lite-youtube {
    max-width: none;
}

.modal-overlay {
    z-index: 9999;
}

.main-header.modal-opened,

.lum-lightbox {
    z-index: 2003;
}

.col-filter {
    z-index: 2003;
}

@media (min-width: 1200px) {
    .col-filter-desktop {
        z-index: 4;
    }
}

.header-search.expanded {
    z-index: 2002;
}


.main-header__absolute {
    z-index: 1500;
}

.header-search {
    z-index: 5;
}

.redirect-popup {
    z-index: 5;
}

/*
 * The Typekit service used to deliver this font or fonts for use on websites
 * is provided by Adobe and is subject to these Terms of Use
 * http://www.adobe.com/products/eulas/tou_typekit. For font license
 * information, see the list below.
 *
 * neo-sans:
 *   - http://typekit.com/eulas/00000000000000003b9b2033
 *   - http://typekit.com/eulas/00000000000000003b9b2034
 *   - http://typekit.com/eulas/00000000000000003b9b2035
 *   - http://typekit.com/eulas/00000000000000003b9b203a
 *
 * © 2009-2018 Adobe Systems Incorporated. All Rights Reserved.
 */
/*{"last_published":"2018-12-17 15:36:47 UTC"}*/
.form-input {
    font-size: 16px;
    padding: 10px 15px;
    color: var(--color-text-900);
    width: 100%;
    border: 1px solid #a2aeb7;
    -webkit-appearance: none;
    border-radius: 2px;
}

.form-input:focus {
    border-color: var(--color-ui-link-light);
    box-shadow: 0px 0px 5px #007DFF80;
}

.form-line {
    margin: 20px 0;
}

.form-error {
    border-color: red;
}

.form-error-msg {
    font-size: 12px;
    margin: 5px 0 0 0;
    line-height: 1.3em;
    color: red;
}

.form-warning {
    background: #F8EA1480;
    padding: 10px;
    color: var(--color-text-900);
    font-size: 13px;
    line-height: 15px;
}

.form-label {
    font-size: 16px;
}

.tippy-box .form-label {
    display: block;
    margin: 10px 0;
}

input[type=radio].cg-radio,
input[type=radio].cg-radio-after {
    position: absolute;
    top: auto;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
    width: 1px;
    height: 1px;
    white-space: nowrap;
    /* https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe */
    margin-top: 20px;
}

input[type=radio].cg-radio+label:before,
input[type=radio].cg-radio-after+label:after {
    content: "";
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    display: block;
    border-radius: 50%;
    border: 1px solid #7B8C98;
    background: white;
}

input[type=radio].cg-radio+label:before {
    margin: 0 8px 0 4px;
}

input[type=radio].cg-radio-after+label:after {
    margin-left: auto;
}

input[type=radio].cg-radio:checked+label:before,
input[type=radio].cg-radio-after:checked+label:after {
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
    border: 5px solid var(--color-primary-500);
}

input[type=radio].cg-radio:checked+label:hover:before,
input[type=radio].cg-radio-after:checked+label:hover:after {
    border: 5px solid var(--color-primary-600);
}

input[type=radio].cg-radio:checked:disabled+label:before,
input[type=radio].cg-radio-after:checked:disabled+label:after {
    border: 5px solid #a2aeb7;
}

input[type=radio].cg-radio:checked+label {
    color: var(--color-text-900);
}

input[type=radio].cg-radio+label {
    cursor: pointer;
    display: inline-flex;
    margin-right: 10px;
    color: var(--color-text-900);
    align-items: center;
}

.cg-input-label-top {
    transition: all 0.3s cubic-bezier(0, 0.05, 0.4, 1);
    text-transform: uppercase;
    color: #7B8C98;
    position: absolute;
    top: 6px;
    line-height: 8px;
    left: 15px;
    z-index: 2;
    font-size: 10px;
    font-weight: bold;
    text-align: left;
    white-space: nowrap;
    max-width: calc(100% - 24px);
    overflow: hidden;
    text-overflow: ellipsis;
}

.cg-user-review-textarea {
    resize: none;
    padding: 4px;
    max-height: 48px;
    overflow: hidden;
    width: 100%;
    border: none;
}

.cg-user-review-textarea::placeholder {
    color: #7B8C98;
}

.cg-input-label {
    color: #7B8C98;
    position: absolute;
    top: 5px;
    left: 15px;
    opacity: 0;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: calc(100% - 15px);
}

.cg-input-info {
    background: #D9ECFF;
    padding: 4px 12px;
    font-size: 12px;
    line-height: 16px;
    color: var(--color-text-900);
    text-align: left;
    border-radius: 2px;
}

.choices.is-focused {
    box-shadow: 0px 0px 5px #007DFF80;
}

.choices.is-focused .choices__inner {
    border-color: var(--color-ui-link-light) !important;
}

.cg-input-field,
.crp-input-text,
.cg-textarea {
    width: 100%;
    font-size: 15px;
    line-height: 20px;
    color: var(--color-text-600);
    padding: 20px 15px 6px;
    border: 1px solid #a2aeb7;
    z-index: 2;
    position: relative;
    background: transparent;
    min-height: 48px;
    border-radius: 2px;
    margin: 0;
}

.cg-input-field.error,
.crp-input-text.error,
.cg-textarea.error {
    border: 1px solid var(--color-ui-error-red);
}

.cg-input-field.valid,
.crp-input-text.valid,
.cg-textarea.valid {
    border: 1px solid var(--color-primary-500);
}

.cg-input-field:focus,
.crp-input-text:focus,
.cg-textarea:focus {
    border-color: var(--color-ui-link-light);
    box-shadow: 0px 0px 5px #007DFF80;
}

.cg-input-field:placeholder-shown~.cg-input-label-top,
.crp-input-text:placeholder-shown~.cg-input-label-top,
.cg-textarea:placeholder-shown~.cg-input-label-top {
    opacity: 0;
}

.cg-input-field.placeholder-shown~.cg-input-label-top,
.cg-input-field:focus+.cg-input-label,
.crp-input-text.placeholder-shown~.cg-input-label-top,
.crp-input-text:focus+.cg-input-label,
.cg-textarea.placeholder-shown~.cg-input-label-top,
.cg-textarea:focus+.cg-input-label {
    opacity: 0;
}

.cg-input-field:focus~.cg-input-label-top,
.crp-input-text:focus~.cg-input-label-top,
.cg-textarea:focus~.cg-input-label-top {
    transform: translateY(0);
    opacity: 1;
}

.cg-input-field:placeholder-shown+.cg-input-label,
.crp-input-text:placeholder-shown+.cg-input-label,
.cg-textarea:placeholder-shown+.cg-input-label {
    opacity: 1;
}

.cg-input-field.placeholder-shown+.cg-input-label,
.crp-input-text.placeholder-shown+.cg-input-label,
.cg-textarea.placeholder-shown+.cg-input-label {
    opacity: 1;
}

.cg-input-field:focus~.cg-input-label,
.crp-input-text:focus~.cg-input-label,
.cg-textarea:focus~.cg-input-label {
    opacity: 0;
}

.cg-input-field+.cg-input-label,
.crp-input-text+.cg-input-label,
.cg-textarea+.cg-input-label {
    transform: translateY(10px);
    transition: all 0.1s ease-in-out;
    font-size: 16px;
    line-height: 20px;
}

.cg-input-field::-webkit-input-placeholder,
.crp-input-text::-webkit-input-placeholder,
.cg-textarea::-webkit-input-placeholder {
    color: #7B8C98;
}

.cg-input-field.dark,
.crp-input-text.dark,
.cg-textarea.dark {
    color: #7B8C98;
    border-color: var(--color-text-600);
}

.cg-input-field-delete {
    width: 24px;
    display: flex;
    align-items: center;
    border-left: 0;
    justify-content: center;
}

.cg-input-field-delete:hover {
    cursor: pointer;
}

.cg-input-field-delete:hover svg {
    fill: var(--color-text-900);
}

.cg-input-field-uncover {
    position: absolute;
    right: 16px;
    top: 16px;
    cursor: pointer;
    z-index: 3;
}

.cg-input-field-uncover svg {
    pointer-events: all;
    width: 20px;
    height: 20px;
    fill: #7B8C98;
}

.cg-input-field-uncover:hover svg {
    fill: var(--color-text-600);
}

.cg-textarea {
    padding: 8px 16px;
    display: block;
    resize: none;
}

.cg-input-label-error {
    color: var(--color-ui-error-red);
    display: block;
    padding: 7px 15px;
    font-size: 12px;
    line-height: 15px;
    background: #fdeaec;
}

.cg-input-label-error .loader {
    display: inline-block;
    border: 2px solid #a2aeb7;
    border-radius: 50%;
    border-top: 2px solid transparent;
    border-left: 2px solid transparent;
    width: 12px;
    height: 12px;
    -webkit-animation: spin 1s linear infinite;
    /* Safari */
    animation: spin 1s linear infinite;
}

.form-or-separator {
    position: relative;
}

.form-or-separator:before {
    content: "";
    position: absolute;
    border-bottom: 1px solid #a2aeb7;
    width: 100%;
    height: 1px;
    left: 0;
    z-index: 1;
    top: 50%;
}

.form-or-separator span {
    background: white;
    text-transform: uppercase;
    z-index: 2;
    position: relative;
    font-size: 12px;
    padding: 0 10px;
}

.cg-select {
    border-radius: 2px;
    border: 1px solid #a2aeb7;
    font-size: 16px;
    color: var(--color-text-600);
    width: 100%;
    -webkit-appearance: none;
    background: transparent;
    padding: 19px 15px 6px;
    position: relative;
    z-index: 2;
    min-height: 40px;
    margin: 0;
}

@media (min-width: 768px) {
    .cg-select {
        min-height: 48px;
    }
}

.cg-select:focus {
    border-color: var(--color-ui-link-light);
}

.cg-select+.cg-input-label-top {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 10px;
    opacity: 1;
    transform: translateY(0);
}

.cg-select.valid {
    border: 1px solid var(--color-primary-500);
}

.cg-select.error {
    border: 1px solid var(--color-ui-error-red);
}

.cg-select.without-label {
    padding: 13px 15px;
}

.cg-select.without-label option:first-child {
    color: #7B8C98;
}

input[type=text]:disabled,
input[type=email]:disabled,
input[type=password]:disabled,
input[type=password]:disabled,
input[type=text]:read-only,
input[type=email]:read-only {
    background: #E3E7EF;
    color: #a2aeb7;
}

.cg-select-arrow {
    position: absolute;
    right: 20px;
    top: 18px;
    fill: #7B8C98;
    z-index: 1;
}

.cg-label-static {
    font-size: 12px;
    font-weight: bold;
    color: #7B8C98;
    text-transform: uppercase;
    line-height: 14px;
}

.cg-checkbox {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.cg-checkbox span {
    display: block;
    width: 16px;
    height: 16px;
    border: 1px solid #7B8C98;
    background: white;
    border-radius: 2px;
    position: relative;
}

@media (min-width: 768px) {
    .cg-checkbox span {
        width: 18px;
        height: 18px;
    }
}

.cg-checkbox span svg {
    display: none;
}

.cg-checkbox input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

@media (min-width: 992px) {
    .cg-checkbox input:not(:disabled):not(:checked)+span:hover {
        background: center/11px no-repeat #cdd6dd url("../images/ico_ui_available_white.svg");
        border-color: #7B8C98;
    }
}

.cg-checkbox input:checked+span {
    background: center/11px no-repeat var(--color-primary-500) url("../images/ico_ui_available_white.svg");
    border-color: var(--color-primary-500);
}

.cg-checkbox input:checked+span:hover {
    background: center/11px no-repeat var(--color-primary-600) url("../images/ico_ui_available_white.svg");
}

.cg-checkbox input:checked:disabled+span {
    background: center/11px no-repeat #a2aeb7 url("../images/ico_ui_available_white.svg");
    border-color: #a2aeb7;
}

.cg-checkbox-m span {
    width: 20px;
    height: 20px;
}

.cg-checkbox-icon {
    margin: 0 5px 0 0;
}

.cg-field-error .cg-input-label .cg-input-label-top {
    color: var(--color-ui-error-red);
}

.cg-field-error input,
.cg-field-error select,
.cg-field-error span,
.cg-field-error textarea {
    border-color: var(--color-ui-error-red) !important;
}

.ql-toolbar {
    border-top-right-radius: 2px;
    border-top-left-radius: 2px;
}

.ql-container {
    font-size: 16px;
    font-family: "Noto Sans", Sans-Serif;
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
}

.ql-container em {
    font-style: italic;
}

.ql-container .ql-image {
    display: none;
}

.ql-video {
    max-width: 100%;
}

.ql-editor {
    min-height: 200px;
    max-height: 400px;
    overflow-wrap: anywhere;
}

.ql-editor .image {
    display: inline-flex;
    vertical-align: middle;
    margin: 1em 5px !important;
    overflow: hidden;
    width: 100px;
    height: 100px;
    object-fit: cover;
}

.ql-editor .image img {
    height: 100%;
    object-fit: cover;
    width: 100%;
    overflow: visible;
    margin: 0;
}

.ql-editor img {
    display: inline-flex;
    vertical-align: middle;
    margin: 1em 5px !important;
    overflow: hidden;
    width: 100px;
    height: 100px;
    object-fit: cover;
}

.ql-editor .img-loader {
    display: inline-flex;
    vertical-align: middle;
    margin: 1em 5px !important;
    overflow: hidden;
    width: 100px;
    height: 100px;
    object-fit: cover;
    background: #E3E7EF;
}

.ql-editor .image>figcaption {
    position: absolute;
    width: 100%;
    bottom: 0;
    line-height: 11px;
    padding: 5px;
}

.ql-snow .ql-tooltip {
    z-index: 3;
}

.ql-snow .ql-tooltip input.ql-error {
    border: 1px solid var(--color-ui-error-red);
}

.ql-container.error {
    border: 1px solid var(--color-ui-error-red) !important;
}

.cg-input-wrapper {
    position: relative;
    background: white;
    display: inline-block;
}

.cg-select-simple {
    border-radius: 2px;
    border: 1px solid #a2aeb7;
    min-width: 0;
    font-size: 14px;
    color: var(--color-text-600);
    z-index: 2;
    -webkit-appearance: none;
    background: transparent;
    padding: 7px 35px 7px 10px;
    position: relative;
    max-width: 100%;
    height: 40px;
}

.cg-select-simple+svg {
    position: absolute;
    right: 10px;
    top: 0;
    bottom: 0;
    margin: auto;
    fill: #7B8C98;
    z-index: 1;
}

.cg-select-simple option {
    color: var(--color-text-900);
    text-transform: none;
}

.cg-alert {
    display: flex;
    align-items: center;
    padding: 8px;
    border-radius: 2px;
}

@media (min-width: 768px) {
    .cg-alert {
        padding: 16px;
    }
}

.cg-alert.cg-alert-green {
    background: #E7F9E8;
    border: 1px solid #5DD667;
    font-weight: bold;
}

.cg-alert.cg-alert-grey {
    background: #F0F3F7;
}

.password-complexity-indicator {
    display: flex;
    flex-direction: column;
}

.password-complexity-indicator .item {
    width: 50%;
    height: 6px;
    border-radius: 2px;
    background: #E3E7EF;
    margin-right: 2px;
}

.password-complexity-indicator .item:last-of-type {
    margin-right: 0;
    margin-left: 2px;
}

.password-complexity-indicator .item.red {
    background: #D60E16;
}

.password-complexity-indicator .item.orange {
    background: #ed7700;
}

.password-complexity-indicator .item.lime {
    background: #83cb13;
}

.password-complexity-indicator .item.green {
    background: #43C529;
}

.password-complexity-indicator .message {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: 2px;
    font-weight: bold;
}

.password-complexity-indicator .message svg {
    margin-right: 4px;
}

.password-complexity-indicator .message.red {
    color: #D60E16;
}

.password-complexity-indicator .message.orange {
    color: #ed7700;
}

.password-complexity-indicator .message.lime {
    color: #83cb13;
}

.password-complexity-indicator .message.green {
    color: #43C429;
    fill: #43C529;
}


.login-form {
    max-width: 400px;
    margin: auto;
    text-align: center;
    color: var(--color-text-600);
}

.login-form h3 {
    line-height: 25px;
    color: var(--color-text-900);
    font-size: 28px;
    margin: 8px 0;
    font-family: "neo-sans", sans-serif;
    font-weight: 700;
}

@media (min-width: 768px) {
    .login-form h3 {
        margin: 16px 0;
    }
}

.login-form h4 {
    color: var(--color-text-900);
    font-size: 18px;
    line-height: 22px;
    font-family: "neo-sans", sans-serif;
    font-weight: 700;
}

.login-form h5 {
    color: var(--color-text-900);
    font-size: 15px;
    line-height: 18px;
    font-family: "neo-sans", sans-serif;
    font-weight: 700;
}

.login-form .link,
.login-form .underline-link {
    color: var(--color-primary-500);
    font-weight: bold;
    text-decoration: none;
}

.login-form .link:hover,
.login-form .underline-link:hover {
    color: var(--color-primary-600);
    text-decoration: underline;
}

.login-form-bottom .cg-input-label-error {
    text-align: center;
}

.login-form-bottom .link {
    margin: auto;
}

.menu-expandable-popup {
    overflow: hidden;
    transition: transform 0.2s cubic-bezier(0, 0.05, 0.4, 1);
    box-shadow: 0 2px 25px rgba(0, 0, 0, 0.15);
    padding: 16px;
    background: white;
    width: 100%;
}

@media (min-width: 568px) {
    .menu-expandable-popup {
        width: 336px;
    }
}

@media (min-width: 768px) {
    .menu-expandable-popup {
        padding: 24px;
    }
}

.menu-expandable-popup.active {
    transform: translate(0, 0);
    top: 40px;
}

@media (min-width: 768px) {
    .menu-expandable-popup.active {
        top: 64px;
    }
}

@media (min-width: 992px) {
    .menu-expandable-popup.active {
        top: 84px;
    }
}

.menu-expandable-popup svg {
    pointer-events: initial;
}

.login-popup-submit {
    width: 100%;
}

.menu-user-notifications-icon {
    z-index: 7;
    color: white;
    display: flex;
    align-items: center;
    margin-left: 4px;
    cursor: pointer;
    position: relative;
    border: 1px solid var(--color-bg-600);
    border-radius: 2px;
    height: 32px;
    min-width: 32px;
    justify-content: center;
}

@media (min-width: 992px) {
    .menu-user-notifications-icon {
        height: 36px;
        min-width: 36px;
        margin-left: 16px;
    }
}

.menu-user-notifications-icon span {
    display: flex;
}

.menu-user-notifications-icon span svg {
    position: relative;
    left: 0;
}

.menu-user-notifications-icon span svg.has-notification {
    transform: rotate(330deg);
    left: -2px;
}

.menu-user-notifications-icon span span {
    background: var(--color-ui-error-red);
    border-radius: 25px;
    padding: 0 6px;
    font-size: 10px;
    line-height: 14px;
    position: absolute;
    top: -5px;
    right: 0;
    font-weight: bold;
}

.menu-user-notifications-icon svg {
    fill: white;
}

.menu-user-notifications-icon:hover svg,
.menu-user-notifications-icon.active svg {
    fill: var(--color-primary-500);
}

.menu-user-notifications {
    background: white;
    padding: 8px;
    max-height: 70vh;
    overflow-y: auto !important;
    scrollbar-color: var(--color-bg-600) #cdd6dd;
    scrollbar-width: thin;
}

@media (min-width: 992px) {
    .menu-user-notifications {
        min-width: 250px;
        left: 0;
    }
}

.menu-user-notifications::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.menu-user-notifications::-webkit-scrollbar-track-piece {
    background-color: #cdd6dd;
}

.menu-user-notifications::-webkit-scrollbar-thumb {
    height: 30px;
    background-color: var(--color-text-600);
}

.notifications-top-bar {
    display: flex;
    flex-direction: row;
    flex: 1;
    justify-content: flex-end;
    font-size: 12px;
    line-height: 16px;
}

.notifications-top-bar div,
.notifications-top-bar a {
    color: #7B8C98;
    cursor: pointer;
    display: flex;
    margin: 0 4px;
    align-items: center;
}

.notifications-top-bar div svg,
.notifications-top-bar a svg {
    fill: #7B8C98;
    margin-right: 4px;
}

.notifications-top-bar div:hover,
.notifications-top-bar a:hover {
    color: var(--color-text-600);
}

.notifications-top-bar div:hover svg,
.notifications-top-bar a:hover svg {
    fill: var(--color-text-600);
}

.notifications-empty {
    margin: auto;
    padding: 16px 8px 8px 8px;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.notifications-empty p {
    font-family: "neo-sans", sans-serif;
    font-size: 22px;
    line-height: 28px;
    font-weight: bold;
    text-align: center;
}

.notifications-empty img {
    width: 300px;
    margin: 0 auto;
    max-width: 100%;
}

.notifications-item {
    font-family: "Noto Sans", Sans-Serif;
    font-size: 12px;
    line-height: 16px;
    display: flex;
    padding: 8px;
    position: relative;
    cursor: pointer;
}

.notifications-item:hover {
    border-radius: 2px;
    background: #E3E7EF;
}

.notifications-item .notification-type {
    fill: var(--color-text-900);
}

.notifications-item-avatar {
    min-width: 48px;
    min-height: 48px;
    align-self: center;
    margin-right: 8px;
    position: relative;
}

.notifications-item-avatar img,
.notifications-item-avatar svg {
    width: 48px;
    height: 48px;
    object-fit: cover;
    border-radius: 50%;
}

.notifications-item-avatar .flag-icon {
    position: absolute;
    bottom: -2px;
    right: -5px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    margin: 0;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.24);
}

.notifications-item-label {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 1;
    font-weight: bold;
}

.notifications-item-time {
    color: var(--color-text-900);
    text-transform: uppercase;
}

.notifications-item-text {
    color: var(--color-text-900);
    padding-right: 24px;
}

.notifications-item-is-read {
    font-weight: normal;
    color: #7B8C98;
}

.notifications-item-is-read .notifications-item-text {
    color: #7B8C98;
    font-weight: normal;
}

.notifications-item-is-read .notifications-item-text b {
    font-weight: bold;
}

.notifications-item-is-read .notification-type {
    fill: #7B8C98;
}

.notifications-item-is-read .notifications-item-time {
    color: #7B8C98;
}

.folder-geo-popup {
    padding: 16px;
    background: #F0F3F7;
    box-shadow: 0 0 48px 0 #000;
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 10;
}

.folder-geo-popup .col-responsive-pad {
    gap: 12px;
    justify-content: center;
    align-items: center;
    display: flex;
    flex-wrap: wrap;
}

.folder-geo-popup p {
    font-size: 12px;
    line-height: 16px;
    flex: 1 1 200px;
}

@media (min-width: 768px) {
    .folder-geo-popup p {
        font-size: 16px;
        line-height: 20px;
    }
}

.folder-geo-popup .flag-icon {
    width: 32px;
    height: 32px;
    border: 1px solid #FFF;
    border-radius: 100px;
    box-shadow: 0 0 4px 0 rgba(29, 39, 48, 0.48);
}

.folder-geo-popup .cursor-pointer {
    padding: 6px;
}

@media (min-width: 992px) {
    .folder-geo-popup .cursor-pointer {
        fill: #7B8C98;
        order: 4;
        margin-right: 8px;
    }

    .folder-geo-popup .cursor-pointer:hover svg {
        fill: var(--color-text-900);
    }
}

.folder-geo-popup .cursor-pointer svg {
    display: block;
}

@media (min-width: 768px) {
    .folder-geo-popup .cursor-pointer svg {
        width: 20px;
        height: 20px;
    }
}

@media (min-width: 992px) {
    .folder-geo-popup .cursor-pointer svg {
        width: 24px;
        height: 24px;
    }
}

.folder-geo-popup .btn {
    flex: 1 0 100%;
}

@media (min-width: 992px) {
    .folder-geo-popup .btn {
        order: 3;
        flex: 0 1 250px;
        margin-left: auto;
    }
}

[hidden],
template {
    display: none;
}

.choices {
    text-align: left;
    margin: 0;
}

.choices__list--single {
    padding: 0;
    display: block;
}

.choices__list--dropdown {
    z-index: 3;
    line-height: 14px;
}

.cg-choices {
    position: relative;
}

.cg-choices .choices__inner {
    border-radius: 2px;
    border: 1px solid #a2aeb7 !important;
    background: white;
    font-size: 15px;
    color: var(--color-text-600);
    padding: 12px 15px 12px;
    height: 100%;
}

.cg-choices .choices {
    flex: 1;
}

.cg-choices .choices:after {
    content: "";
    display: block;
    width: 14px;
    height: 14px;
    position: absolute;
    background: url("../images/svg/ico_ui_arrowdown-grey.svg");
    right: 20px;
    top: 16px;
    z-index: 1;
    border: none;
    margin: 0;
}

.choices .cg-choices.with-label:after {
    top: 20px;
}

.cg-choices.with-close {
    display: flex;
}

.cg-choices.with-close .cg-select-arrow {
    right: 60px;
}

.cg-choices.with-label .choices__inner {
    padding: 18px 16px 8px;
}

.cg-choices-close {
    border: 1px solid #a2aeb7;
    display: flex;
    align-items: center;
    padding: 5px 15px;
    border-left: none;
    cursor: pointer;
}

.cg-choices-close:hover {
    background: #cdd6dd;
}

.choices[data-type*=select-one].is-open:after {
    margin: 0;
}

.choices[data-type*=select-one] .choices__inner {
    padding-bottom: 6px;
}

.choices-casino-img {
    flex: 0 0 15px;
    display: flex;
    justify-content: center;
    margin-right: 5px;
}

.choices-casino-img img {
    width: 15px;
    height: 15px;
}

.choices-casino-img .avatar-small {
    width: 15px;
    height: 15px;
    margin-right: 0;
}

.choices.is-disabled .choices__inner {
    background: #E3E7EF;
}

.choices__placeholder {
    color: #7B8C98 !important;
    opacity: 1 !important;
}

.choices[data-type*=select-one] select.choices__input {
    display: block !important;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    left: 0;
    bottom: 0;
}

.cg-casino-choices .choices__inner {
    padding: 18px 10px 5px !important;
}

.choices__list--dropdown .choices__list {
    max-height: 250px;
}

.js-cg-choices-select {
    border: 1px solid #a2aeb7 !important;
    background: white;
    font-size: 15px;
    color: var(--color-text-600);
    width: 100%;
    padding: 20px 15px 8px;
}

.choices__list--dropdown .choices__item--selectable {
    cursor: default;
    padding-right: 16px;
}

.choices[data-type*=select-one] {
    cursor: default;
}

.choices__list--dropdown [data-value=placeholder] {
    display: none;
}

.paging {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin: 16px 0;
    row-gap: 8px;
}

@media (min-width: 568px) {
    .paging {
        margin: 24px 0;
    }
}

@media (min-width: 992px) {
    .paging {
        margin: 32px 0;
    }
}

.paging.border {
    border-top: 1px solid #cdd6dd;
    border-bottom: 1px solid #cdd6dd;
    margin: 4px 0 0 0;
    padding: 8px 0;
}

@media (min-width: 768px) {
    .paging.border {
        padding: 4px 0;
        border-bottom: none;
    }
}

.paging-info {
    order: 2;
    color: var(--color-text-900);
}

@media (min-width: 568px) {
    .paging-info {
        order: unset;
    }
}

.paging-num {
    color: var(--color-text-600);
    font-size: 14px;
    line-height: 18px;
    height: 29px;
    min-width: 29px;
    padding: 0 8px;
    text-align: center;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
    border-radius: 3px;
    cursor: pointer;
    vertical-align: middle;
    margin: 0 3px;
}

.paging-num.active {
    font-weight: 700;
    background: var(--color-primary-500);
    color: white;
}

.paging-num.active:hover {
    background: var(--color-primary-500);
    color: white;
}

.paging-num:hover {
    background: #E3E7EF;
    color: var(--color-primary-500);
    font-weight: bold;
}

.paging-num:hover svg {
    fill: var(--color-primary-500);
}

.paging-num a {
    align-items: center;
    justify-content: center;
    display: inline-flex;
    width: 100%;
    height: 100%;
}

.paging-left svg {
    fill: var(--color-text-600);
}

.paging-right svg {
    fill: var(--color-text-600);
}

.paging-goto-wrapper {
    display: flex;
    align-items: center;
    flex: 0 0 100%;
    justify-content: center;
}

@media (min-width: 568px) {
    .paging-goto-wrapper {
        margin-left: auto;
        flex: auto;
        justify-content: flex-end;
    }
}

.paging-goto {
    display: inline-flex;
    align-items: center;
    border: 1px solid #7B8C98;
    border-radius: 2px;
    margin: 0 8px;
}

.paging-goto:focus-within {
    border-color: var(--color-text-900);
}

.paging-goto input {
    appearance: none;
    border: none;
    font-size: 14px;
    color: var(--color-text-600);
    width: 58px;
    padding: 0 12px;
    background: transparent;
    margin: 4px 0 4px 4px;
}

.paging-goto .paging-goto-btn {
    cursor: pointer;
    padding: 7px;
    margin: 3px;
    display: flex;
    align-items: center;
    border-radius: 2px;
}

.paging-goto .paging-goto-btn:hover {
    background: rgba(123, 140, 152, 0.1);
}

.paging-goto .paging-goto-btn:hover svg {
    fill: var(--color-primary-500);
}

.paging-goto svg {
    min-width: 15px;
    min-height: 15px;
    fill: var(--color-text-600);
}

.paging-dark {
    color: #a2aeb7;
}

@media (min-width: 568px) {
    .paging-dark {
        padding: 4px 0;
    }
}

.paging-dark.border {
    border-top: 1px solid var(--color-bg-600);
}

@media (max-width: 767px) {
    .paging-dark.border {
        border-bottom: 1px solid var(--color-bg-600);
    }
}

.paging-dark .paging-num {
    color: #a2aeb7;
}

.paging-dark .paging-num.active {
    background: var(--color-primary-500);
    color: var(--color-text-900);
}

.paging-dark .paging-num.active:hover {
    background: var(--color-primary-500);
    color: var(--color-text-900);
}

.paging-dark .paging-num:hover {
    background: rgba(68, 190, 76, 0.3);
    color: var(--color-primary-500);
}

.paging-dark .paging-num:hover svg {
    fill: var(--color-primary-500);
}

.paging-dark .paging-goto-btn:hover {
    background: rgba(68, 190, 76, 0.3);
    color: var(--color-primary-500);
}

.paging-dark .paging-goto-btn:hover svg {
    fill: var(--color-primary-500);
}

.paging-dark .paging-goto:focus-within {
    border-color: #E3E7EF;
}

.paging-dark .paging-goto input {
    color: #a2aeb7;
}

.paging-dark .paging-goto svg {
    fill: #a2aeb7;
}

.submit-successful {
    background: #E7F9E8;
    border: 1px solid #5DD667;
    padding: 8px;
    margin-bottom: 8px;
    flex: 1 0;
}

@media (min-width: 568px) {
    .submit-successful {
        padding: 16px;
    }
}

.submit-fail {
    background: #feebed;
    border: 1px solid #ED3445;
    padding: 8px;
    margin-bottom: 8px;
    flex: 1 0;
}

@media (min-width: 568px) {
    .submit-fail {
        padding: 16px;
    }
}

.no-results {
    padding: 24px;
    text-align: center;
    margin: 16px 0;
    font-family: "neo-sans", sans-serif;
    color: var(--color-text-900);
    background: #E3E7EF;
}

@media (min-width: 568px) {
    .no-results {
        padding: 32px;
        margin: 24px 0;
    }
}

@media (min-width: 992px) {
    .no-results {
        padding: 48px;
        margin: 24px 0;
    }
}

.no-results>*:last-child {
    margin-bottom: 0 !important;
}

.no-results .neo-fs-28 {
    margin-bottom: 8px;
}

@media (min-width: 568px) {
    .no-results .neo-fs-28 {
        margin-bottom: 16px;
    }
}

.no-results .neo-sub-fs-18 {
    margin-bottom: 8px;
}

.no-results .filter-clear-wrapper,
.no-results .btn-wrapper {
    margin: 16px 0;
}

@media (min-width: 568px) {

    .no-results .filter-clear-wrapper,
    .no-results .btn-wrapper {
        margin: 24px 0;
    }
}

@media (min-width: 992px) {

    .no-results .filter-clear-wrapper,
    .no-results .btn-wrapper {
        margin: 32px 0;
    }
}

.no-results .neo-fs-28,
.no-results .neo-sub-fs-18 {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.section-dark .no-results {
    color: white;
    background: rgba(74, 91, 104, 0.2);
}

@keyframes bump {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.3);
    }

    100% {
        transform: scale(1);
    }
}

.popover-card-vote {
    width: 260px;
}

.popover-card-vote .popover-close {
    position: absolute;
    top: 0;
    z-index: 2;
    right: 0;
    padding: 10px;
    cursor: pointer;
}

.popover-card-vote .popover-close svg {
    fill: var(--color-text-600);
}

.popover-card-vote .popover-close svg:hover {
    fill: var(--color-text-900);
}

.popover-card-vote h4 {
    font-size: 20px;
    line-height: 24px;
    font-weight: 700;
    color: var(--color-text-900);
    font-family: "neo-sans", sans-serif;
}

.popover-card-vote form {
    color: var(--color-text-600);
    margin: 15px 0 0 0;
}

.popover-card-vote label {
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    cursor: pointer;
}

.popover-card-vote textarea {
    border: 1px solid #cdd6dd;
    font-size: 13px;
    width: 100%;
    height: 70px;
    display: block;
    padding: 5px;
    resize: vertical;
    font-family: "Noto Sans", sans-serif;
    border-radius: 2px;
}

.popover-card-vote .vote-up {
    fill: #22B573;
    display: block;
    margin: 10px auto;
}

.popover-card-vote .vote-down {
    fill: #ED9C00;
    display: block;
    margin: 10px auto;
}

.popover-card-vote input {
    margin-right: 20px;
}

.popover-card-vote .btn-border {
    margin: 10px 0 15px;
}

.popover-card-vote input[type=radio].cg-radio+label:before {
    margin-right: 8px;
    margin-left: 2px;
}

.popover-card-vote .user-vote-finish {
    text-align: center;
    padding: 30px 20px 40px;
}

.popover-card-vote .user-vote-finish img {
    height: 130px;
}

@media (min-width: 768px) {
    .popover-card-vote .user-vote-finish img {
        height: 200px;
    }
}

.popover-card-vote .user-vote-label {
    display: flex;
    justify-content: flex-start;
    padding-left: 60px;
    font-weight: 700;
    width: 100%;
    margin: 5px auto;
    text-align: left;
}

.popover-card-vote .user-vote-label:hover {
    color: #E3E7EF;
}

.popover-card-vote .user-vote-label svg {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
}

.popover-working-countries {
    min-width: 200px;
}

.popover-vote-row {
    display: flex;
    align-items: flex-start;
    margin: 6px 0;
    font-size: 14px;
    line-height: 18px;
}

@media (min-width: 768px) {
    .popover-vote-row {
        font-size: 16px;
        line-height: 20px;
    }
}

.user-vote-disabled {
    opacity: 0.4;
}

.widget-social {
    display: none;
}

@media (min-width: 768px) {
    .widget-social {
        display: flex;
        margin-left: auto;
    }
}

.widget-social .social-link {
    margin: 0 5px 0 0;
    display: block;
}

.widget-social .social-link:hover {
    opacity: 0.8;
}

.widget-social .social-link svg {
    display: block;
}

.widget-social .fb svg {
    fill: #24408d;
}

.widget-social .vk svg {
    fill: #45668E;
}

.widget-social .twitter svg {
    fill: #1DA1F2;
}

.widget-social .okru svg {
    fill: #EC9837;
}

.widget-social .instagram svg {
    fill: #e1306c;
}

.tippy-bod .widget-social {
    display: none;
}

.side-filter-header {
    background: #F0F3F7;
    padding: 12px;
}

@media (min-width: 768px) {
    .side-filter-header {
        padding: 24px;
    }
}

.side-filter-header-label {
    font-size: 12px;
    line-height: 16px;
    text-transform: uppercase;
    font-weight: bold;
    color: var(--color-text-600);
    margin-top: 8px;
}












.js-xhr-loading .filter-mobile-loader {
    display: block;
}

.js-results-header .popover {
    max-width: 100%;
    width: 400px;
}




input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
    display: none;
}







.cgf-range-slider {
    margin: 16px 0 16px;
}
















.loading .filter-question {
    box-shadow: none;
}


.tooltip-buttons {
    display: flex;
    position: relative;
    margin-top: 8px;
    margin-bottom: -8px;
    left: -8px;
    width: calc(100% + 16px);
    z-index: 3;
    gap: 8px;
}

.tooltip-buttons .btn {
    flex: 1;
}

.mobile-handle {
    background: rgba(123, 140, 152, 0.2);
    border-radius: 4px;
    height: 8px;
    width: 48px;
    position: relative;
}

.slideable-panel-header {
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.slideable-panel-header .panel-close {
    position: absolute;
    right: 4px;
    top: 4px;
    width: 32px;
    height: 32px;
    padding: 6px;
}

.slideable-panel-header .panel-close svg {
    fill: #7B8C98;
}

@media (min-width: 768px) {
    .slideable-panel-header {
        display: none;
    }
}

.slideable-panel-body {
    overflow: auto;
    max-height: 65vh;
}

.slideable-panel {
    width: 100%;
    position: fixed;
    bottom: 0;
    max-height: 70vh;
    box-shadow: 0 0 45px rgba(0, 0, 0, 0.35);
    padding: 0 16px 16px;
    background: white;
    z-index: 10000;
    transform: translateY(150%);
    transition: transform 0.3s ease-in-out;
    left: 0;
    min-height: 30vh;
}

.slideable-panel.slideable-panel-active {
    transform: translateY(0);
}

@media (min-width: 768px) {
    .slideable-panel {
        width: auto;
        position: static;
        max-height: none;
        box-shadow: none;
        padding: 0;
        min-height: initial;
        border-radius: inherit;
        transform: none;
        bottom: auto;
    }
}

.slideable-panel .filter-group-heading-name {
    color: var(--color-text-900);
    font-size: 16px;
    font-weight: 700;
    font-family: neo-sans, sans-serif;
    text-transform: none;
}

.slideable-panel .casino-card-logos-list {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}

.slideable-panel .casino-card-logos-list .casino-card-logos-item {
    width: auto;
    margin: 0;
}

.footer-breadcrumbs-wrapper {
    flex: 1 0 100%;
}

@media (min-width: 568px) {
    .footer-breadcrumbs-wrapper {
        order: 3;
    }
}

.avatar-rank-progress-bar {
    display: block;
}

.avatar-rank-progress-bar svg {
    width: 52px;
    height: 52px;
    transform-origin: center center;
    transform: rotate(90deg);
    display: block;
}

@media (min-width: 768px) {
    .avatar-rank-progress-bar svg {
        width: 132px;
        height: 132px;
    }
}

.avatar-rank-progress-bar .bar {
    stroke-linecap: round;
    stroke-width: 8px;
    stroke: #cdd6dd;
}

@media (min-width: 768px) {
    .avatar-rank-progress-bar .bar {
        stroke-width: 7px;
    }
}

.avatar-rank-progress-bar .progress {
    stroke-linecap: round;
    stroke-width: 8px;
}

@media (min-width: 768px) {
    .avatar-rank-progress-bar .progress {
        stroke-width: 7px;
    }
}

.avatar-rank-token {
    bottom: 0;
    left: 50%;
    width: 20px;
    height: 20px;
    position: absolute;
    text-align: center;
    margin: auto;
    display: block;
    transform: translate(-50%, 0);
    z-index: 3;
}

@media (min-width: 768px) {
    .avatar-rank-token {
        bottom: 10px;
        width: 34px;
        height: 34px;
    }
}

.avatar-rank-token img {
    width: 100%;
    height: auto;
}

.avatar-rank-progress {
    position: relative;
}

.avatar-rank-progress .avatar {
    top: 9px;
    left: 9px;
    position: absolute;
}

@media (min-width: 768px) {
    .avatar-rank-progress .avatar {
        top: 21px;
        left: 21px;
    }
}

.avatar-no-rank {
    position: relative;
}

.avatar-no-rank .avatar {
    top: 9px;
    left: 9px;
    height: 34px;
    width: 34px;
}

@media (min-width: 768px) {
    .avatar-no-rank .avatar {
        top: 21px;
        left: 21px;
        width: 90px;
        height: 90px;
    }
}

.user-content-author .avatar {
    display: block;
    width: 34px;
    height: 34px;
    object-fit: cover;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 2;
}

@media (min-width: 768px) {
    .user-content-author .avatar {
        margin: auto;
        margin-bottom: 10px;
        width: 90px;
        height: 90px;
    }
}

.cg-visitor-staff-author .user-content-author {
    margin-right: 0;
    min-width: 42px;
    height: 40px;
}

.cg-visitor-staff-author .avatar {
    width: 30px;
    height: 30px;
    top: 6px;
    left: 6px;
    margin-bottom: 0;
}

.cg-visitor-staff-author .user-rank-tooltip .avatar {
    top: 0;
    left: 0;
}

.cg-visitor-staff-author .user-rank-tooltip .cg-post-author-name {
    margin-left: 0;
    width: auto;
}

.cg-visitor-staff-author .avatar-rank-progress-bar {
    width: 42px;
    height: 42px;
}

.cg-visitor-staff-author .avatar-rank-progress-bar .bp {
    display: none;
}

.cg-visitor-staff-author .avatar-rank-progress-bar svg {
    width: 42px;
    height: 42px;
}

.cg-visitor-staff-author .avatar-rank-progress-bar .progress,
.cg-visitor-staff-author .avatar-rank-progress-bar .bar {
    stroke-width: 8px;
    stroke-linecap: butt;
}

.cg-visitor-staff-author .avatar-rank-token {
    width: 16px;
    height: 16px;
    bottom: 0;
}

.cg-contributor-author .user-content-author {
    margin-right: 0;
}

.cg-contributor-author .avatar {
    width: 48px;
    height: 48px;
    top: 8px;
    left: 8px;
    margin-bottom: 0;
}

.cg-contributor-author .avatar-rank-progress-bar {
    width: 64px;
    height: 64px;
}

.cg-contributor-author .avatar-rank-progress-bar .bp {
    display: none;
}

.cg-contributor-author .avatar-rank-progress-bar svg {
    width: 64px;
    height: 64px;
}

.cg-contributor-author .avatar-rank-progress-bar .progress,
.cg-contributor-author .avatar-rank-progress-bar .bar {
    stroke-width: 5px;
    stroke-linecap: butt;
}

@media (min-width: 768px) {
    .cg-contributor-author .avatar-rank-token {
        width: 20px;
        height: 20px;
        bottom: 0;
    }
}

.tooltip-user-row .avatar-popup .avatar {
    width: 32px;
    height: 32px;
    top: 6px;
    left: 6px;
    margin-bottom: 0;
}

.avatar-popup .user-content-author {
    margin-right: 0;
}

.avatar-popup .avatar-rank-progress-bar {
    width: 44px;
    height: 44px;
}

.avatar-popup .avatar-rank-progress-bar .bp {
    display: none;
}

.avatar-popup .avatar-rank-progress-bar svg {
    width: 46px;
    height: 46px;
    margin-top: -1px;
    margin-left: -1px;
}

.avatar-popup .avatar-rank-progress-bar .progress,
.avatar-popup .avatar-rank-progress-bar .bar {
    stroke-width: 10px;
    stroke-linecap: butt;
}

.avatar-popup .avatar-rank-progress-bar .bronze {
    stroke: #5B2924;
}

.avatar-popup .avatar-rank-progress-bar .silver {
    stroke: #545B5C;
}

.avatar-popup .avatar-rank-progress-bar .gold {
    stroke: #B17C30;
}

.avatar-popup .avatar-rank-progress-bar .master {
    stroke: #A752FF;
}

.avatar-popup .avatar-rank-progress-bar .expert {
    stroke: #0045F2;
}

.avatar-popup .avatar-rank-progress-bar .admin {
    stroke: #5DD667;
}

@media (min-width: 768px) {
    .avatar-popup .avatar-rank-token {
        width: 16px;
        height: 16px;
        bottom: -2px;
    }
}

.cg-review-author-small .avatar {
    width: 48px;
    height: 48px;
    top: 9px;
    left: 9px;
}

.cg-review-author-small .avatar-rank-progress-bar {
    width: 66px;
    height: 66px;
}

.cg-review-author-small .avatar-rank-progress-bar .bp {
    display: none;
}

.cg-review-author-small .avatar-rank-progress-bar svg {
    width: 66px;
    height: 66px;
}

.cg-review-author-small .avatar-rank-progress-bar .progress,
.cg-review-author-small .avatar-rank-progress-bar .bar {
    stroke-width: 5px;
    stroke-linecap: butt;
}

.cg-review-author-small .avatar-rank-token {
    width: 20px;
    height: 20px;
    bottom: 3px;
}

.cg-review-author-small .avatar-rank-token img {
    width: 100%;
    height: 100%;
}

.win-bet-size-row {
    flex-direction: column;
}

@media (min-width: 768px) {
    .win-bet-size-row {
        flex-direction: row;
        gap: 8px;
    }

    .win-bet-size-row fieldset {
        width: 33.33%;
    }
}

.win-bet-size-row fieldset {
    display: flex;
    flex-grow: 1;
    margin-bottom: 8px;
}

.win-bet-size-row fieldset div {
    width: 100%;
}

.win-bet-size-row fieldset:last-of-type {
    margin-bottom: 0;
}

@media (min-width: 768px) {
    .win-bet-size-row fieldset {
        margin-bottom: 0;
    }
}

.cg-modal-content .cant-find,

@media (min-width: 768px) {

    .cg-modal-content .cant-find,
}

.cg-modal-content .cant-find a,
.cg-modal-content .cant-find a:link,
.cg-modal-content .cant-find a:visited,

.add-winning-screenshot .crp-drop-area,

.add-winning-screenshot .crp-drop-area .file-upload input,

.add-winning-screenshot .crp-drop-area h4,

.add-winning-screenshot .crp-drop-area p,

.add-winning-screenshot .crp-drop-area.highlight,

.add-winning-screenshot .cg-select:disabled,
.add-winning-screenshot input[type=text]:disabled,

.add-winning-screenshot .crp-attachment,

@media (min-width: 568px) {

    .add-winning-screenshot .crp-attachment,
    .winning-screenshot-fields .crp-attachment,
}

.add-winning-screenshot .crp-attachment .attachment-ico,

.add-winning-screenshot .crp-attachment .text,

.add-winning-screenshot .crp-attachment progress::-moz-progress-bar,

.add-winning-screenshot .crp-attachment progress::-webkit-progress-bar,

.add-winning-screenshot .crp-attachment progress,

.add-winning-screenshot .crp-attachment-error,

.add-winning-screenshot .crp-attachment-remove,

.add-winning-screenshot .crp-attachment-remove:hover,

.add-winning-screenshot .crp-attachment-remove:hover svg,

.add-winning-screenshot .crp-attachment-remove .loader,

.add-winning-screenshot .crp-attachment-remove.in-progress .loader,

.add-winning-screenshot .crp-attachment-remove.in-progress:after,

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

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

    100% {
        transform: rotate(360deg);
    }
}

/* winning screenshot widget - forum homepage/post */


.cg-post .cg-post-body .winning-screenshot {
    margin-bottom: 8px;
}

@media (min-width: 768px) {
    .cg-post .cg-post-body .winning-screenshot {
        margin-top: 8px;
    }
}











.cg-post .cg-post-body .winning-screenshot-casino a {
    color: #000;
}







.cg-post .cg-post-body .winning-screenshot-tag {
    color: #fff;
}













.btns-winning-screenshot-mobile {
    display: flex;
    margin-top: 16px;
}

@media (min-width: 768px) {
    .btns-winning-screenshot-mobile {
        display: none;
    }
}

























.cg-post-footer {
    padding-top: 12px;
    display: flex;
    justify-content: flex-start;
    clear: both;
    align-items: center;
    border-top: 1px solid #E3E7EF;
    flex-wrap: wrap;
}

.cg-post-footer .icon-link {
    color: var(--color-text-600);
    font-size: 12px;
    line-height: 16px;
    display: inline-flex;
    align-items: center;
    margin-right: 16px;
}

.cg-post-footer .icon-link.active {
    color: var(--color-primary-500);
}

.cg-post-footer .icon-link.active svg {
    fill: var(--color-primary-500);
}

.cg-post-footer .icon-link.active.cross svg {
    fill: var(--color-ui-error-red);
}

.cg-post-footer .icon-link.active.mark svg {
    fill: #ED9C00;
}

.cg-post-footer .icon-link.active.circle svg {
    fill: var(--color-ui-link-light);
}

@media (min-width: 568px) {
    .cg-post-footer .icon-link {
        font-size: 16px;
        line-height: 22px;
    }
}

.cg-post-footer .icon-link:hover {
    color: var(--color-primary-500);
    cursor: pointer;
}

.cg-post-footer .icon-link:hover svg {
    fill: var(--color-primary-500);
}

.cg-post-footer .icon-link:hover.cross svg {
    fill: var(--color-ui-error-red);
}

.cg-post-footer .icon-link:hover.mark svg {
    fill: #ED9C00;
}

.cg-post-footer .icon-link svg {
    fill: var(--color-text-600);
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

.cg-post-footer .icon-link svg+span {
    margin-left: 4px;
}

.cg-post-footer .post-like {
    margin-right: 0;
}

.cg-post-author {
    display: flex;
    align-items: center;
    position: relative;
}

@media (min-width: 768px) {
    .cg-post-author {
        display: block;
        padding: 0 32px 0 0;
        flex: 0 0 164px;
    }
}

@media (min-width: 992px) {
    .cg-post-author {
        padding: 0 64px 0 0;
        flex: 0 0 196px;
    }
}

.cg-post-author .rating {
    display: flex;
}

@media (min-width: 768px) {
    .cg-post-author .rating {
        justify-content: center;
    }
}

.cg-post-author .rating svg {
    width: 10px;
    height: 10px;
}

@media (min-width: 768px) {
    .cg-post-author .cg-post-author-name {
        text-align: center;
        justify-content: center;
        max-width: 132px;
    }
}

@media (min-width: 992px) {
    .cg-post-author .cg-post-author-name {
        font-size: 15px;
        line-height: 18px;
    }
}

.cg-review-author {
    align-items: flex-start;
}

@media (min-width: 768px) {
    .cg-review-author {
        align-items: center;
    }
}

.cg-review-author .cg-post-author-country {
    display: none;
}

@media (min-width: 768px) {
    .cg-review-author .cg-post-author-country {
        display: flex;
    }
}

.cg-review-author .cg-post-author-name>.cg-post-author-country {
    display: inline-block;
    margin-left: 4px;
    margin-top: 2px;
}

@media (min-width: 768px) {
    .cg-review-author .cg-post-author-name>.cg-post-author-country {
        display: none;
    }
}

.cg-review-author .cg-post-author-label {
    display: none;
}

@media (min-width: 768px) {
    .cg-review-author .cg-post-author-label {
        display: block;
    }
}

.avatar-attachment-rating {
    position: absolute;
    top: 28px;
    left: 77px;
    display: flex;
    align-items: center;
    gap: 4px;
}

@media (min-width: 768px) {
    .avatar-attachment-rating {
        display: none;
    }
}

.cg-post-author-name {
    font-family: "neo-sans", sans-serif;
    font-weight: bold;
    display: flex;
    align-items: center;
    font-size: 14px;
    line-height: 16px;
    justify-content: flex-start;
    color: var(--color-text-900);
}

.cg-post-author-name .avatar {
    display: none;
}

.cg-post-author-name a {
    color: var(--color-text-900);
    overflow: hidden;
    text-overflow: ellipsis;
}

.cg-post-author-detail-wrapper {
    overflow: hidden;
}

.cg-post-author-country {
    font-family: "Noto Sans", sans-serif;
    display: flex;
    align-items: center;
    color: var(--color-text-900);
    font-size: 12px;
    line-height: 14px;
    gap: 4px;
}

@media (min-width: 768px) {
    .cg-post-author-country {
        justify-content: center;
    }
}

@media (min-width: 768px) {
    .cg-post-author-country label {
        display: none;
    }
}

.tooltip-user-row {
    display: flex;
    align-items: center;
    position: relative;
    padding: 8px 0;
    color: var(--color-text-600);
}

.tooltip-user-row .avatar {
    display: block;
    width: 36px;
    height: 36px;
    margin: 0 10px 0 0;
    object-fit: cover;
}

.tooltip-user-row .cg-post-author-country {
    justify-content: flex-start;
}

.post-panel-tooltip-mobile {
    /* width: 100%;
   position: fixed;
   bottom: 0;
   max-height: 70vh;
   padding: 16px;
   border-radius: 2px 2px 0 0;
   box-shadow: 0 0 45px rgba(0,0,0,.35);
   background: white;
   z-index: 2004;
   @media (max-height: $main-menu-floating-height-breakpoint) and (orientation: landscape) {
       max-height: 90vh;
   }*/
}

.post-like-panel-avatars {
    display: flex;
    align-items: center;
}

.post-like-panel-avatars>.avatar {
    width: 22px;
    height: 22px;
    box-shadow: 0 0 0 2px white;
    margin-left: -8px;
    transition: 0.1s ease-in-out all;
    background: white;
}

.post-like-panel-avatars>.avatar:hover {
    margin-left: -5px;
    margin-right: 9px;
}

.post-like-panel-avatars>.avatar:last-child:hover {
    margin-left: -8px;
    margin-right: 0;
}

.post-like-panel {
    margin-left: 16px;
}

.post-like-panel .tippy-content {
    width: 300px;
}

.post-like-panel-tooltip {
    height: 100%;
}

@media (min-width: 768px) {
    .post-like-panel-tooltip {
        height: auto;
        min-width: 280px;
    }
}

.post-like-panel-tooltip ul {
    overflow-y: auto;
    height: calc(100% - 90px);
}

@media (min-width: 768px) {
    .post-like-panel-tooltip ul {
        height: auto;
        max-height: 220px;
    }
}

.post-like-panel-tooltip ul li {
    border-top: 1px solid #E3E7EF;
}

.post-like-panel-tooltip ul li:last-child {
    border-bottom: 1px solid #E3E7EF;
}

.post-like-panel-tooltip .post-like svg {
    fill: var(--color-text-900);
}

.post-like-panel-tooltip .post-like.voted {
    color: var(--color-primary-500);
}

.post-like-panel-tooltip .post-like.voted svg {
    fill: var(--color-primary-500);
}

.post-like-panel-tooltip .close-wrapper {
    position: absolute;
    top: 8px;
    right: 8px;
}

.cg-post-author-label {
    font-family: "neo-sans", sans-serif;
    font-weight: normal;
    font-size: 12px;
    line-height: 14px;
    color: var(--color-text-600);
    margin: 2px 0;
    word-break: break-word;
}

@media (min-width: 768px) {
    .cg-post-author-label {
        text-align: center;
        font-size: 14px;
        line-height: 16px;
    }
}

@media (min-width: 768px) {
    .cg-post-author-label strong {
        order: 1;
    }
}

.cg-post-author-label-left {
    text-align: left;
}

.post-like-panel-expand {
    width: 22px;
    height: 22px;
    box-shadow: 0 0 0 2px white;
    margin-left: -9px;
    transition: 0.1s ease-in-out all;
    background: #cdd6dd;
    border-radius: 50%;
    display: inline-flex;
    vertical-align: middle;
    align-items: center;
    justify-content: center;
}

.post-like-panel-expand svg {
    fill: var(--color-text-600);
}

.user-content-author {
    margin-right: 8px;
}

@media (min-width: 768px) {
    .user-content-author {
        margin-right: 0;
    }
}

.user-review-post-tag {
    border-radius: 2px;
    padding: 2px 8px;
    font-size: 14px;
    line-height: 19px;
    font-weight: bold;
    z-index: 5;
    color: var(--color-text-600);
    border: 1px solid #E3E7EF;
}

@media (min-width: 768px) {
    .user-review-post-tag {
        top: 16px;
        right: 120px;
    }
}

@media (min-width: 992px) {
    .user-review-post-tag {
        position: absolute;
        top: 8px;
        right: 8px;
    }
}

.post-header-time {
    font-size: 12px;
    line-height: 14px;
    color: var(--color-text-600);
    display: flex;
    align-items: center;
    margin-right: auto;
}

.post-header-time:before {
    content: "";
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #a2aeb7;
    display: inline-block;
    margin-right: 5px;
}

.quick-scroll {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid #a2aeb7;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    margin-bottom: 8px;
    margin-right: 8px;
    transition: opacity 0.3s;
    opacity: 1;
    backdrop-filter: blur(8px);
}

@media (min-width: 768px) {
    .quick-scroll {
        margin-right: 16px;
    }

    .quick-scroll:hover {
        border-color: var(--color-primary-500);
    }
}

.quick-scroll.inactive {
    opacity: 0;
    pointer-events: none;
}

.quick-scroll-wrapper {
    position: fixed;
    bottom: 14px;
    right: 0;
    z-index: 999;
}

@media (min-width: 992px) {
    .quick-scroll-wrapper {
        bottom: 80px;
    }
}

.complaint-card-mini {
    min-height: 100px;
    color: var(--color-text-900);
}

.complaint-card-mini:hover .name {
    color: var(--color-primary-500);
}

.complaint-card-mini .card-header {
    padding: 24px;
}

.complaint-card-mini .complaint-card-body {
    flex: 1;
    padding: 12px 38px 12px 8px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    gap: 12px;
    font-size: 12px;
}

.complaint-card-mini .complaint-card-body strong {
    font-size: 14px;
}

.complaint-card-mini .complaint-card-body .name {
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    max-height: 40px;
    display: -webkit-box;
}

.stats-cards {
    display: flex;
    gap: 8px;
    overflow: auto;
}

.stats-card {
    width: 100%;
    border-radius: 2px;
    background: white;
    padding: 12px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

@media (min-width: 568px) {
    .stats-card {
        flex: 0 0 calc(50% - 4px);
    }
}

@media (min-width: 768px) {
    .stats-card {
        flex: 0 0 calc(33.333% - 6px);
    }
}

@media (min-width: 992px) {
    .stats-card {
        max-width: calc(25% - 6px);
    }
}

.stats-card label {
    font-size: 14px;
    line-height: 20px;
    font-family: "Noto Sans", sans-serif;
    color: var(--color-text-900);
    display: block;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    z-index: 5;
}

.stats-card svg {
    flex-shrink: 0;
}

.stats-card b {
    z-index: 5;
    font-size: 22px;
    line-height: 28px;
    color: var(--color-text-900);
    font-family: "neo-sans", sans-serif;
    font-weight: bold;
    margin-top: 12px;
}

.stats-card-border-light {
    border: 1px solid #a2aeb7;
}

.stats-card-dark {
    background: transparent;
    position: relative;
    border: 1px solid var(--color-bg-600);
}

.stats-card-dark label {
    color: #cdd6dd;
}

.stats-card-dark b {
    color: #fff;
}

.stats-card-dark .info {
    position: absolute;
    right: 8px;
    top: 8px;
}

@media (min-width: 768px) {
    .stats-card-dark .ellipsis {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
}

@media (min-width: 992px) {
    .profile-body {
        background: linear-gradient(to right, white, white 49%, #F0F3F7 50%);
        margin-bottom: -64px;
    }
}

.profile-heading {
    margin: 16px 0 32px 0;
}

.profile-content {
    flex: 1;
    background: #F0F3F7;
    padding-top: 48px;
}

@media (min-width: 992px) {
    .profile-content {
        padding: 32px 0 32px 32px;
        overflow: hidden;
    }
}

@media (min-width: 1200px) {
    .profile-content {
        padding: 32px 0 32px 48px;
    }
}

.profile-menu-scroll-wrapper {
    overflow-x: auto;
}

@media (min-width: 768px) {
    .profile-menu-scroll-wrapper {
        overflow-x: visible;
    }
}

.profile-menu-wrapper {
    position: fixed;
    top: 40px;
    width: 100vw;
    left: 0;
    z-index: 10;
}

@media (min-width: 568px) {
    .profile-menu-wrapper {
        top: 40px;
    }
}

@media (min-width: 768px) {
    .profile-menu-wrapper {
        top: 68px;
    }
}

@media (min-width: 992px) {
    .profile-menu-wrapper {
        position: static;
        width: auto;
        flex: 0 0 300px;
        background: white;
        padding: 32px 16px 32px 0;
    }
}

@media (min-width: 1200px) {
    .profile-menu-wrapper {
        flex: 0 0 320px;
        padding: 32px 32px 32px 0;
    }
}

@media (max-height: 650px) and (orientation: landscape) and (max-width: 768px) {
    .profile-menu-wrapper {
        position: absolute;
        top: 0;
    }
}

.profile-menu-wrapper .profile-label-sm {
    display: none;
}

@media (min-width: 992px) {
    .profile-menu-wrapper .profile-label-sm {
        display: block;
    }
}

.profile-menu-wrapper .menu-items {
    transition: opacity 0.2s ease-in;
    background: white;
    overflow-x: scroll;
    white-space: nowrap;
    position: relative;
    -webkit-overflow-scrolling: touch;
    display: flex;
    align-items: flex-start;
}

@media (min-width: 992px) {
    .profile-menu-wrapper .menu-items {
        height: auto;
        width: auto;
        padding: 0;
        left: auto;
        display: flex;
        gap: 4px;
        flex-direction: column;
        margin-bottom: 16px;
        overflow: hidden;
        align-items: normal;
    }
}

.profile-menu-wrapper .menu-item {
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--color-text-600);
    font-family: "Noto Sans", sans-serif;
    text-transform: uppercase;
    padding: 8px 12px;
}

@media (min-width: 992px) {
    .profile-menu-wrapper .menu-item {
        color: var(--color-text-900);
        text-transform: none;
        font-family: "neo-sans", sans-serif;
        font-size: 16px;
        font-weight: 700;
        line-height: 20px;
        gap: 16px;
    }
}

.profile-menu-wrapper .menu-item:hover,
.profile-menu-wrapper .menu-item.active {
    background: #F0F3F7;
}

.profile-menu-wrapper .menu-item svg {
    fill: var(--color-text-600);
    width: 16px;
    height: 16px;
}

@media (min-width: 992px) {
    .profile-menu-wrapper .menu-item svg {
        width: 24px;
        height: 24px;
    }
}

.profile-menu-wrapper .menu-item.active {
    color: var(--color-text-900);
    position: relative;
}

@media (min-width: 992px) {
    .profile-menu-wrapper .menu-item.active {
        color: var(--color-primary-500);
    }
}

.profile-menu-wrapper .menu-item.active svg {
    fill: var(--color-text-900);
}

@media (min-width: 992px) {
    .profile-menu-wrapper .menu-item.active svg {
        fill: var(--color-primary-500);
    }
}

.profile-menu-wrapper .menu-item.active:after {
    content: "";
    height: 3px;
    width: 100%;
    background: var(--color-primary-500);
    border-radius: 2px;
    position: absolute;
    bottom: 0;
    left: 0;
}

@media (min-width: 992px) {
    .profile-menu-wrapper .menu-item.active:after {
        content: none;
    }
}

.profile-menu-wrapper .menu-item.active:hover {
    background: #F0F3F7;
    color: var(--color-primary-500);
}

.profile-menu-wrapper .menu-item.active:hover svg {
    fill: var(--color-primary-500);
}

.profile-menu-wrapper .user-info {
    display: none;
}

@media (min-width: 992px) {
    .profile-menu-wrapper .user-info {
        display: flex;
        gap: 16px;
        align-items: center;
        margin: 16px 0 32px;
    }
}

.profile-menu-wrapper .user-info img {
    width: 54px;
    height: 54px;
    object-fit: cover;
}

.profile-menu-wrapper .user-info .user-name {
    font-family: neo-sans, sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    display: block;
}

@media (min-width: 992px) {
    .reviews-profile-col {
        display: flex;
    }
}

.reviews-profile-col .advanced-language-settings {
    padding: 0;
}

.profile-label-sm {
    font-weight: bold;
    font-size: 12px;
    line-height: 20px;
    text-transform: uppercase;
    color: #7B8C98;
    margin-right: 4px;
}

.user-rank-label {
    display: inline-block;
    background: linear-gradient(white, white) padding-box, linear-gradient(to right, darkblue, darkorchid) border-box;
    border-radius: 3px;
    border: 2px solid transparent;
    padding: 2px 6px;
    font-size: 14px;
    font-weight: 700;
    line-height: 18px;
}

.user-rank-label span {
    color: transparent;
}

.user-rank-label.bronze {
    background: linear-gradient(white, white) padding-box, linear-gradient(89deg, #5B2924 0%, #B6A785 99.52%) border-box;
}

.user-rank-label.bronze span {
    background: linear-gradient(89deg, #5B2924 0%, #B6A785 99.52%) padding-box;
    background-clip: text;
}

.user-rank-label.silver {
    background: linear-gradient(white, white) padding-box, linear-gradient(89deg, #545B5C 0%, #C5D2D6 100%) border-box;
}

.user-rank-label.silver span {
    background: linear-gradient(89deg, #545B5C 0%, #C5D2D6 100%) padding-box;
    background-clip: text;
}

.user-rank-label.gold {
    background: linear-gradient(white, white) padding-box, linear-gradient(8deg, #B17C30 12.41%, #EBBB10 87.59%) border-box;
}

.user-rank-label.gold span {
    background: linear-gradient(8deg, #B17C30 12.41%, #EBBB10 87.59%) padding-box;
    background-clip: text;
}

.user-rank-label.platinum {
    background: linear-gradient(white, white) padding-box, linear-gradient(89deg, #0045F2 0%, #5A85EE 100%) border-box;
}

.user-rank-label.platinum span {
    background: linear-gradient(89deg, #0045F2 0%, #5A85EE 100%) padding-box;
    background-clip: text;
}

.user-rank-label.diamond {
    background: linear-gradient(white, white) padding-box, linear-gradient(89deg, #4C1287 0%, #A752FF 100%) border-box;
}

.user-rank-label.diamond span {
    background: linear-gradient(89deg, #4C1287 0%, #A752FF 100%) padding-box;
    background-clip: text;
}

.user-rank-label.admin {
    background: linear-gradient(white, white) padding-box, linear-gradient(90deg, #5DD667 0%, #239F29 100%) border-box;
}

.user-rank-label.admin span {
    background: linear-gradient(90deg, #5DD667 0%, #239F29 100%) padding-box;
    background-clip: text;
}

.user-rank-label-large {
    font-family: neo-sans, sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    padding: 0;
    border: 0;
    background: transparent !important;
}

.user-rank-label-small {
    font-family: "Noto Sans", sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
    padding: 0;
    border: 0;
    background: none !important;
}

.user-current-progress {
    margin: 8px 0 0;
    font-size: 12px;
    font-weight: 700;
    line-height: 14px;
    text-transform: uppercase;
    color: #7B8C98;
}

.user-current-progress b {
    color: var(--color-text-900);
}

.user-current-progress .progress {
    display: flex;
    height: 8px;
    border-radius: 16px;
    border: 1px solid var(--Colors-Grey-Light-03, #CDD6DD);
    background: var(--Colors-Grey-Light-02, #E3E7EF);
    position: relative;
    margin: 8px 0;
}

.user-current-progress .progress-active {
    border-radius: 16px;
    border: 1px solid var(--colors-transparency-black-10, rgba(0, 0, 0, 0.1));
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
    position: absolute;
    left: -1px;
    top: -1px;
    height: calc(100% + 2px);
    min-width: 16px;
}

.user-current-progress.bronze .progress-active {
    background: linear-gradient(89deg, #5B2924 0%, #B6A785 99.52%) border-box;
}

.user-current-progress.bronze .progress-active .avatar-border {
    background: linear-gradient(89deg, #5B2924 0%, #B6A785 99.52%) border-box;
}

.user-current-progress.platinum .progress-active {
    background: linear-gradient(89deg, #0045F2 0%, #5A85EE 100%) border-box;
}

.user-current-progress.platinum .progress-active .avatar-border {
    background: linear-gradient(89deg, #0045F2 0%, #5A85EE 100%) border-box;
}

.user-current-progress.silver .progress-active {
    background: linear-gradient(89deg, #545B5C 0%, #C5D2D6 100%) border-box;
}

.user-current-progress.silver .progress-active .avatar-border {
    background: linear-gradient(89deg, #545B5C 0%, #C5D2D6 100%) border-box;
}

.user-current-progress.gold .progress-active {
    background: linear-gradient(89deg, #B17C30 12.41%, #EBBB10 87.59%) border-box;
}

.user-current-progress.gold .progress-active .avatar-border {
    background: linear-gradient(89deg, #B17C30 12.41%, #EBBB10 87.59%) border-box;
}

.user-current-progress.diamond .progress-active {
    background: linear-gradient(89deg, #4C1287 0%, #A752FF 100%) border-box;
}

.user-current-progress.admin .progress-active {
    background: linear-gradient(90deg, #5DD667 0%, #239F29 100%) border-box;
    width: calc(100% + 2px) !important;
}

.c-user-review-reputation-PERFECT {
    color: #3DEE3A;
}

.c-user-review-reputation-GREAT {
    color: #9FF11A;
}

.c-user-review-reputation-GOOD {
    color: #D8DC00;
}

.c-user-review-reputation-OK {
    color: #FFB257;
}

.c-user-review-reputation-WEAK {
    color: #FF6847;
}

.user-review-reputation-bg-PERFECT {
    background: #3DEE3A;
}

.user-review-reputation-bg-GREAT {
    background: #9FF11A;
}

.user-review-reputation-bg-GOOD {
    background: #D8DC00;
}

.user-review-reputation-bg-OK {
    background: #FFB257;
}

.user-review-reputation-bg-WEAK {
    background: #FF6847;
}

.badge-before {
    position: relative;
    padding-left: 18px;
    font-size: 14px;
    line-height: 19px;
}

.badge-before:not(:last-child) {
    margin-right: 16px;
}

.badge-before:before {
    position: absolute;
    content: "";
    width: 12px;
    height: 12px;
    border-radius: 50%;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}

.badge-before.user-review-reputation-PERFECT:before {
    background: #3DEE3A;
}

.badge-before.user-review-reputation-GREAT:before {
    background: #9FF11A;
}

.badge-before.user-review-reputation-GOOD:before {
    background: #D8DC00;
}

.badge-before.user-review-reputation-OK:before {
    background: #FFB257;
}

.badge-before.user-review-reputation-WEAK:before {
    background: #FF6847;
}

.reviews-bar-wrapper {
    width: 100%;
    display: flex;
    border-radius: 2px;
    overflow: hidden;
    gap: 2px;
    height: 8px;
}

.not-enough-reviews .reviews-bar-wrapper {
    filter: grayscale(1);
}

.reviews-bar-pill {
    display: inline-block;
    height: 16px;
}

.reviews-bar-legend {
    flex-wrap: wrap;
    display: flex;
    transition: max-height ease-in-out 0.2s, opacity ease-in-out 0.2s;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    row-gap: 8px;
}

.toggle .reviews-bar-legend {
    max-height: 200px;
    opacity: 1;
}

.not-enough-reviews .reviews-bar-legend {
    filter: grayscale(1);
}

.review-rating-pills {
    display: flex;
    position: relative;
    margin: 8px 0;
    flex: 1;
    min-width: 156px;
}

.review-rating-pills .active {
    position: absolute;
    display: flex;
    justify-content: flex-start;
    left: 0;
    z-index: 4;
    overflow: hidden;
    flex: 1;
}

.review-rating-pills .inactive {
    display: flex;
    justify-content: flex-start;
    flex: 1;
}

.review-rating-pills .inactive .pill {
    background: #cdd6dd;
}

.review-rating-pills .pill {
    flex-shrink: 0;
    border-radius: 2px;
    flex: 20%;
    height: 10px;
}

.review-rating-pills .pill:not(:last-child) {
    margin-right: 2px;
}

.pagination-box-showing {
    display: inline-block;
}

.pagination-next-button {
    transform: rotate(-180deg);
}

.pagination-box-results-info {
    text-align: center;
    line-height: 16px;
    font-size: 12px;
}

@media (min-width: 768px) {
    .pagination-box-results-info {
        font-size: 14px;
        flex: 0 0 50%;
        display: block;
        text-align: right;
    }
}

.pagination-box-results-info.without-author {
    flex: auto;
    text-align: center;
}

.pagination-box-results-author {
    display: flex;
    align-items: center;
    flex-direction: column;
    line-height: 18px;
}

@media (min-width: 768px) {
    .pagination-box-results-author {
        flex-direction: row;
        margin-right: auto;
        flex: 0 0 50%;
    }
}

.pagination-box-results-author svg,
.pagination-box-results-author img {
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    display: block;
}

@media (min-width: 768px) {

    .pagination-box-results-author svg,
    .pagination-box-results-author img {
        width: 38px;
        height: 38px;
    }
}

.pagination-box-results-author .avatar {
    margin-right: 8px;
    flex-shrink: 0;
    border: 2px solid var(--color-bg-600);
}

.pagination-box-results-author .avatar-desc {
    text-align: center;
}

@media (min-width: 768px) {
    .pagination-box-results-author .avatar-desc {
        text-align: left;
    }
}

@keyframes pulse-circle {
    25% {
        box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1);
    }

    50% {
        box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 0 0 rgba(255, 255, 255, 0.1);
    }

    75% {
        box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.1), 0 0 0 4px rgba(255, 255, 255, 0.1);
    }

    100% {
        box-shadow: 0 0 0 4px rgba(255, 255, 255, 0), 0 0 0 4px rgba(255, 255, 255, 0);
    }
}

.game-slider-scroll-wrapper {
    position: relative;
}

@media (min-width: 992px) {
    .game-slider-scroll-wrapper {
        height: auto;
        overflow: visible;
    }
}

@media (min-width: 768px) {
    .game-slider-scroll-wrapper .game-item-name {
        display: block;
    }
}

.game-item-flash {
    background: var(--color-bg-900);
    border-radius: 50%;
    position: absolute;
    width: 32px;
    height: 32px;
    right: 4px;
    top: 4px;
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media (min-width: 768px) {
    .game-item-flash {
        width: 40px;
        height: 40px;
    }
}

@media (min-width: 768px) {
    .game-item-flash svg {
        width: 32px;
        height: 32px;
    }
}

.game-provider-item-img {
    position: relative;
    transition: all 0.2s ease-in-out;
    display: block;
    padding-bottom: 77%;
    background: rgba(123, 140, 152, 0.1);
    border-radius: 2px;
}

.game-provider-item-img>img {
    top: 50%;
    left: 50%;
    z-index: 2;
    position: absolute;
    transform: translate(-50%, -50%);
    max-width: 100%;
    -webkit-backface-visibility: hidden;
    width: 170px;
}

.game-preview-wrapper {
    width: 100vw;
    position: fixed;
    bottom: 0;
    left: 0;
    transform: translateY(150%);
    z-index: 2004;
    transition: transform 0.23s ease-in-out;
    padding: 16px;
    background: var(--color-bg-900);
    border: 1px solid rgba(123, 140, 152, 0.1);
    box-shadow: 0px 24px 48px rgba(0, 0, 0, 0.32);
    border-radius: 2px;
    color: #F0F3F7;
    /* fix for iphones */
}

@media (min-width: 1200px) {
    .game-preview-wrapper {
        position: static;
        bottom: auto;
        left: auto;
        width: auto;
        transform: none;
        transition: transform 0.3s ease-in-out;
    }
}

.game-preview-wrapper .name {
    font-family: "neo-sans", sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 18px;
    line-height: 20px;
}

.game-preview-wrapper img {
    width: 100%;
    object-fit: cover;
    max-height: 150px;
    display: block;
}

.game-preview-wrapper.game-preview-active {
    transform: translateY(0);
}

.game-preview-wrapper video {
    background: rgba(123, 140, 152, 0.1);
    border: 1px solid rgba(123, 140, 152, 0.1);
    border-radius: 2px;
    width: 100%;
}

.game-preview-wrapper .video {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.game-preview-wrapper .loader-wrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.game-preview-wrapper .game-name {
    margin: 16px 0 8px;
}

.game-preview-wrapper .game-name .names {
    cursor: pointer;
    padding-right: 8px;
}

.game-preview-wrapper .games-box-btn-main {
    margin: 8px 0;
    gap: 8px;
}

.game-preview-wrapper .games-box-btn-main svg {
    border: 1px solid #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    padding: 8px;
    width: 38px;
    height: 38px;
}

.game-preview-wrapper .games-box-btn-main:hover svg {
    fill: var(--color-primary-500);
    background: white;
}

.game-preview-wrapper .game-preview-top {
    display: none;
}

@media (max-width: 767px) {
    .game-preview-wrapper .mobile-handle {
        background: rgba(123, 140, 152, 0.2);
        border-radius: 2px;
        height: 6px;
        width: 48px;
        position: relative;
    }

    .game-preview-wrapper .drag-area-extension {
        position: absolute;
        width: 100%;
        height: 50px;
        left: 0;
        top: -25px;
    }

    .game-preview-wrapper .game-preview-close {
        display: flex;
        transform: translateY(-16px) translateX(16px);
        padding: 8px;
    }

    .game-preview-wrapper .game-preview-top {
        display: flex;
        width: 100%;
        justify-content: space-between;
        margin-bottom: -16px;
    }

    .game-preview-wrapper .game-preview-center-placeholder {
        width: 36px;
    }
}

@media (max-width: 767px) {
    .game-preview-wrapper .games-box-btn-main:hover {
        background: linear-gradient(270deg, #21C12E 0%, #0F8815 100%);
    }

    .game-preview-wrapper .btn-game:hover {
        background: rgba(123, 140, 152, 0.1);
    }

    .game-preview-wrapper .btn-game:hover svg {
        fill: #fff;
    }
}

.tippy-box[data-theme=game-preview] {
    width: 320px;
}

.tippy-box[data-theme=game-preview]>.tippy-content {
    padding: 0;
}

#login-signup-popup {
    font-family: "Noto Sans", sans-serif;
}

.tippy-box[data-theme=game-preview] #login-signup-popup .tippy-content {
    white-space: nowrap;
    padding: 16px;
}

.game-detail-top-casinos {
    padding: 8px 12px 16px 12px;
    max-width: 1200px;
    margin: auto;
}

@media (min-width: 568px) {
    .game-detail-top-casinos {
        padding: 16px;
    }
}

@media (min-width: 768px) {
    .game-detail-top-casinos {
        padding: 24px 16px;
    }
}

@media (min-width: 992px) {
    .game-detail-top-casinos {
        padding: 32px 16px;
    }
}

.game-detail-top-casinos .btn-wrapper {
    overflow: hidden;
}

.game-detail-top-casinos .btn {
    font-size: 14px;
    line-height: 17px;
}

@media (min-width: 568px) {
    .game-detail-top-casinos .btn {
        min-height: 50px;
        font-size: 16px;
        line-height: 19px;
    }
}

.game-detail-related-bonuses {
    padding: 8px 12px 16px 12px;
    max-width: 1200px;
    margin: auto;
}

@media (min-width: 568px) {
    .game-detail-related-bonuses {
        padding: 16px;
    }
}

@media (min-width: 768px) {
    .game-detail-related-bonuses {
        padding: 24px 16px;
    }
}

@media (min-width: 992px) {
    .game-detail-related-bonuses {
        padding: 32px 16px;
    }
}

.game-detail-related-bonuses .casino-card-mini-wrapper {
    display: flex;
    max-width: none;
    flex: 0 0 92%;
    width: 92%;
    flex-direction: column;
    gap: 4px;
    margin-right: 12px;
    margin-bottom: 8px;
}

.game-detail-related-bonuses .casino-card-mini-wrapper:last-child {
    margin-right: 0;
}

@media (min-width: 768px) {
    .game-detail-related-bonuses .casino-card-mini-wrapper {
        flex: 0 0 45%;
        width: 45%;
    }
}

@media (min-width: 992px) {
    .game-detail-related-bonuses .casino-card-mini-wrapper {
        margin-bottom: 12px;
        gap: 8px;
        max-width: none;
        margin-right: 24px;
        flex: 0 0 calc(33.34% - 48px/3);
        width: calc(33.34% - 48px/3);
    }
}

.game-provider-not-available {
    margin-bottom: 8px;
}

@media (min-width: 568px) {
    .game-provider-not-available {
        margin-bottom: 16px;
    }
}

.game-provider-not-available .content {
    margin: 0 8px;
}

@media (min-width: 568px) {
    .game-provider-not-available .content {
        margin: 0 16px;
    }
}

.game-type-card {
    display: flex;
    margin: 5px 0;
}

@media (min-width: 768px) {
    .game-type-card {
        flex: 0 0 50%;
    }
}

@media (min-width: 992px) {
    .game-type-card {
        margin: 0;
        width: 25%;
        padding: 0 5px;
    }
}

@media (min-width: 1200px) {
    .game-type-card {
        width: 20%;
        flex: 0 0 20%;
    }
}

.game-type-card svg {
    fill: var(--color-primary-500);
    width: 30px;
    height: 30px;
    margin: 0 10px 0 0;
}

@media (min-width: 992px) {
    .game-type-card svg {
        margin: 0 0 20px 0;
        width: 60px;
        height: 60px;
    }
}

.game-type-card .game-provider-counter {
    bottom: 10px;
    right: 10px;
    margin: 0 0 0 auto;
}

@media (min-width: 992px) {
    .game-type-card .game-provider-counter {
        position: absolute;
    }
}

.banner-request-game {
    color: white;
    background: linear-gradient(270deg, #222E38 0%, #1D2730 100%);
    border: 1px solid rgba(123, 140, 152, 0.1);
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.16);
    padding: 16px;
    font-size: 16px;
    line-height: 20px;
    font-family: "neo-sans", sans-serif;
}

@media (min-width: 568px) {
    .banner-request-game {
        margin-top: 32px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 16px 24px;
    }
}

.banner-request-game .btn {
    margin-top: 16px;
}

@media (min-width: 568px) {
    .banner-request-game .btn {
        margin-top: 24px;
    }
}

.banner-request-game .img-wrapper {
    display: block;
    margin: auto;
    cursor: pointer;
}

@media (min-width: 568px) {
    .banner-request-game .img-wrapper {
        margin: 0;
        order: 2;
    }
}

.banner-request-game .img-wrapper img {
    display: block;
    margin: auto;
}

.section-tournaments {
    overflow: visible;
    padding: 1px;
}

@media (min-width: 568px) {
    .section-tournaments {
        background-position: center -70px;
    }
}

@media (min-width: 768px) {
    .section-tournaments {
        background-position: center -100px;
        background-size: 1400px;
    }
}

@media (min-width: 1200px) {
    .section-tournaments {
        background-size: 1650px;
        overflow: hidden;
    }
}

.section-tournaments:before {
    content: "";
    width: calc(100% - 2px);
    height: calc(100% - 40px);
    z-index: 1;
    position: absolute;
    background: rgba(29, 39, 48, 0.5);
}

@media (min-width: 768px) {
    .section-tournaments:before {
        content: none;
    }
}

.section-tournaments .game-box-age-confirm {
    z-index: 30;
}

.section-tournaments .col-responsive-pad {
    position: relative;
    z-index: 2;
}

.section-tournaments .tournament-header {
    text-align: center;
    max-width: 600px;
    margin: 24px auto 16px;
    text-shadow: 0px 2px 8px rgba(0, 0, 0, 0.6);
}

@media (min-width: 568px) {
    .section-tournaments .tournament-header {
        margin: 32px auto 24px;
    }
}

@media (min-width: 768px) {
    .section-tournaments .tournament-header {
        margin: 24px auto 24px;
    }
}

@media (min-width: 1200px) {
    .section-tournaments .tournament-header {
        margin: 32px auto;
    }
}

.no-tournaments-panel {
    background: var(--color-bg-900);
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #F0F3F7;
    padding: 16px;
    gap: 16px;
    border-radius: 2px;
    text-align: center;
}

@media (min-width: 768px) {
    .no-tournaments-panel {
        padding: 24px;
        gap: 24px;
    }
}

@media (min-width: 1200px) {
    .no-tournaments-panel {
        padding: 48px;
    }
}

.no-tournaments-panel img {
    max-width: 100%;
}

.green-shadow {
    right: 0;
}

.green-shadow:before {
    top: 0;
    right: 0;
    background: var(--color-primary-500);
}

@media (min-width: 992px) {
    .green-shadow:before {
        box-shadow: 0 0 180px 180px var(--color-primary-500);
    }
}

.purple-shadow:before {
    top: 0;
    left: 0;
    background: var(--color-secondary-800);
}

@media (min-width: 992px) {
    .purple-shadow:before {
        box-shadow: 0 0 220px 220px var(--color-secondary-800);
    }
}

.shadow {
    display: none;
}

@media (min-width: 992px) {
    .shadow {
        display: block;
        width: 1px;
        height: 1px;
        position: absolute;
    }

    .shadow:before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        border-radius: 50%;
        display: block;
        z-index: 2;
    }
}

.discussion-button-wrapper {
    position: relative;
    display: flex;
    justify-content: center;
    z-index: 2;
    margin: 24px 0;
}

@media (min-width: 992px) {
    .discussion-button-wrapper {
        margin: 32px 0;
    }
}

.discussion-button-wrapper .btn {
    width: 100%;
    margin: 0 16px;
}

@media (min-width: 568px) {
    .discussion-button-wrapper .btn {
        max-width: 300px;
    }
}














.tournaments-table-inner {
    margin-top: 12px;
}

@media (min-width: 568px) {
    .tournaments-table-inner {
        margin-top: 16px;
    }
}

@media (min-width: 768px) {
    .tournaments-table-inner {
        margin-top: 24px;
    }
}

.last-tournament-card {
    overflow: hidden;
    color: #F0F3F7;
    font-size: 14px;
    font-family: "Noto Sans", sans-serif;
    font-weight: 700;
    padding-bottom: 8px;
}

@media (min-width: 768px) {
    .last-tournament-card {
        font-size: 16px;
    }
}

.last-tournament-card.hidden {
    display: none;
}

.last-tournament-card .disabled .last-tournament-icon {
    filter: grayscale(1);
}

.last-tournament-card-inner {
    border-radius: 2px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(39, 52, 63, 0.8);
    margin-bottom: 8px;
    padding: 4px;
    display: flex;
    gap: 8px;
    align-items: center;
}

@media (min-width: 768px) {
    .last-tournament-card-inner {
        gap: 16px;
    }
}

.last-tournament-card-inner .tournament-icon,
.last-tournament-card-inner .tournament-actions {
    flex-shrink: 0;
    margin-right: 4px;
}

.last-tournament-actions .btn {
    padding: 8px 16px;
    height: 60px;
    width: 42px;
}

@media (min-width: 768px) {
    .last-tournament-actions .btn {
        height: 64px;
    }
}

.last-tournament-actions .btn-play {
    width: 48px;
    height: 48px;
    border-radius: 24px;
    background: var(--color-primary-500);
    box-shadow: 0 12px 6px -6px rgba(0, 0, 0, 0.25);
    background: linear-gradient(277deg, #21C12E 0%, #0F8815 100%);
    border: 2px solid var(--color-primary-400);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

@media (min-width: 768px) {
    .last-tournament-actions .btn-play {
        margin-right: 8px;
    }
}

.last-tournament-actions .btn-play:hover {
    background: white;
    border-color: white;
}

.last-tournament-actions .btn-play:hover svg {
    fill: var(--color-primary-500);
}

.last-tournament-actions .btn-play.disabled {
    border: 2px solid #7B8C98;
    background: linear-gradient(89deg, #545B5C 0%, #C5D2D6 100%);
}

.last-tournament-actions .btn-play.disabled:hover {
    background: linear-gradient(89deg, #545B5C 0%, #C5D2D6 100%);
    border-color: #7B8C98;
}

.last-tournament-actions .btn-play.disabled:hover svg {
    fill: white;
}

.last-tournament-header {
    display: table-row;
    color: #a2aeb7;
    font-weight: 700;
    font-family: "Noto Sans", sans-serif;
    border-bottom: 1px solid var(--color-bg-800);
    border-top: 1px solid var(--color-bg-800);
}

.last-tournament-header div {
    display: table-cell;
    font-size: 12px;
    padding: 8px;
    text-transform: uppercase;
    white-space: nowrap;
}

@media (min-width: 768px) {
    .last-tournament-header div {
        font-size: 14px;
    }
}

.last-tournament-icon {
    width: 90px;
    height: 56px;
    position: relative;
    border-radius: 0 0 2px 2px;
    overflow: hidden;
}

.last-tournament-icon .bkg img,
.last-tournament-icon .front img {
    width: 100%;
    height: 100%;
    position: absolute;
}

.last-tournament-icon .bkg img {
    object-fit: cover;
}

.last-tournament-icon .front img {
    object-fit: contain;
}

@media (min-width: 768px) {
    .last-tournament-icon {
        width: 124px;
        height: 64px;
    }
}

.last-tournament-type {
    text-align: center;
    background: #7B8C98;
    color: #fff;
    padding: 6px 12px;
    border-radius: 2px 2px 0 0;
    font-size: 10px;
    font-weight: 700;
    line-height: 8px;
    /* 80% */
    text-transform: uppercase;
    width: 90px;
}

@media (min-width: 768px) {
    .last-tournament-type {
        width: 124px;
    }
}

.last-tournament-meta {
    width: 50%;
    flex-basis: 50%;
    display: flex;
    flex-direction: column;
    color: #F0F3F7;
    font-size: 14px;
    line-height: 20px;
    gap: 8px;
    font-style: normal;
    font-weight: 400;
}

@media (min-width: 768px) {
    .last-tournament-meta {
        font-size: 20px;
        line-height: 26px;
    }
}

.last-tournament-meta small {
    color: #cdd6dd;
    font-size: 12px;
    line-height: 16px;
}

@media (min-width: 768px) {
    .last-tournament-meta small {
        font-size: 16px;
        line-height: 22px;
    }

    .last-tournament-meta small svg {
        display: inline-block;
    }
}

.last-tournament-meta .flex {
    display: flex;
    align-items: center;
    gap: 8px;
}

.last-tournament-meta .flex svg {
    display: none;
}

@media (min-width: 768px) {
    .last-tournament-meta .flex svg {
        display: inline-block;
    }
}

.last-tournament-winner {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
}

.last-tournament-winner a,
.last-tournament-winner a:visited {
    color: #cdd6dd;
    text-decoration: none;
    max-width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    padding-right: 4px;
    white-space: nowrap;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
    display: -webkit-box;
}

@media (min-width: 768px) {
    .last-tournament-winner {
        gap: 8px;
        font-size: 20px;
        line-height: 26px;
    }
}

.last-tournament-winner img {
    border: 1px solid #7B8C98;
    border-radius: 24px;
}

@media (min-width: 768px) {
    .last-tournament-winner img {
        width: 24px;
        height: 24px;
    }
}

.last-tournament-name {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

@media (min-width: 568px) {
    .last-tournament-name {
        max-width: 284px;
    }
}

@media (min-width: 768px) {
    .last-tournament-name {
        flex-grow: 1;
        flex-basis: 33%;
    }
}

.last-tournament-name a.title,
.last-tournament-name span.title {
    color: #F0F3F7;
    overflow: hidden;
    display: -webkit-box;
    font-family: "neo-sans", sans-serif;
    line-height: 20px;
    font-size: 16px;
    -webkit-line-clamp: 1;
    /* number of lines to show */
    line-clamp: 1;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    margin-bottom: 2px;
}

@media (min-width: 768px) {

    .last-tournament-name a.title,
    .last-tournament-name span.title {
        font-size: 20px;
        line-height: 24px;
        -webkit-line-clamp: 2;
        /* number of lines to show */
        line-clamp: 2;
        -webkit-box-orient: vertical;
        text-overflow: ellipsis;
    }
}

.last-tournament-card-lvl1 {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex-basis: 100%;
}

@media (min-width: 768px) {
    .last-tournament-card-lvl1 {
        flex-direction: row;
        align-items: center;
        gap: 24px;
    }
}

.last-tournament-card-lvl2 {
    display: flex;
    flex-direction: row;
}

@media (min-width: 768px) {
    .last-tournament-card-lvl2 {
        flex-grow: 2;
        flex-basis: 66%;
    }
}

.last-tournament-provider {
    color: #F0F3F7;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    font-family: "Noto Sans", sans-serif;
    text-transform: none;
    display: none;
}

@media (min-width: 768px) {
    .last-tournament-provider {
        display: block;
    }
}

.last-tournament-show-more {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 12px 0;
}

@media (min-width: 568px) {
    .last-tournament-show-more {
        margin: 16px 0;
    }
}

@media (min-width: 992px) {
    .last-tournament-show-more {
        margin: 24px 0;
    }
}














.joining-tournaments .loader-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
}












@media (min-width: 768px) {

    .tournament-leaderboard .close,
}











.leaderboard-content {
    display: none;
    box-shadow: inset 0 6px 16px rgba(0, 0, 0, 0.4);
    position: absolute;
    width: 100%;
    left: 0;
    top: 100%;
    margin: 0;
    padding: 8px;
    z-index: 10;
    height: calc(40vh);
    overflow: hidden;
    font-size: 12px;
}

@media (min-width: 568px) {
    .leaderboard-content {
        height: 100%;
    }
}

@media (min-width: 992px) {
    .leaderboard-content {
        display: block;
    }
}

.leaderboard-content .scroll-area {
    height: 100%;
    padding-right: 12px;
    scrollbar-width: thin;
    overflow: auto;
    scrollbar-color: #44be4c #314251;
    position: relative;
}

.leaderboard-content .scroll-area::-webkit-scrollbar {
    width: 4px;
}

.leaderboard-content .scroll-area::-webkit-scrollbar-track {
    background: rgba(123, 140, 152, 0.2);
}

.toggle .leaderboard-content {
    display: block;
}

.leaderboard-content .leaderboard-row {
    padding: 8px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid rgba(123, 140, 152, 0.2);
}

.leaderboard-content .leaderboard-row:hover {
    background: rgba(123, 140, 152, 0.1);
}

.leaderboard-content .leaderboard-row span:first-child {
    min-width: 16px;
    text-align: center;
}

.leaderboard-content .leaderboard-row img {
    border-radius: 50%;
    overflow: hidden;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

.leaderboard-content .leaderboard-row a {
    color: #F0F3F7;
    overflow: hidden;
    text-overflow: ellipsis;
}

.leaderboard-content .leaderboard-row a:visited,
.leaderboard-content .leaderboard-row a:active {
    color: #F0F3F7;
}

.leaderboard-content .leaderboard-row a:hover {
    text-decoration: underline;
}

.leaderboard-content .leaderboard-row.leaderboard-row-header {
    background: #19232c;
    border-top: 1px solid rgba(123, 140, 152, 0.2);
    position: sticky;
    top: 0;
}

.leaderboard-content .leaderboard-row .rank-hdr {
    margin-right: 8px;
}

.leaderboard-content .first-page .leaderboard-row:nth-child(1) {
    background: linear-gradient(8deg, rgba(177, 124, 48, 0.3) 12.41%, rgba(235, 187, 16, 0.3) 87.59%);
}

.leaderboard-content .first-page .leaderboard-row:nth-child(2) {
    background: linear-gradient(89deg, rgba(84, 91, 92, 0.3) 0%, rgba(197, 210, 214, 0.3) 100%);
}

.leaderboard-content .first-page .leaderboard-row:nth-child(3) {
    background: linear-gradient(89deg, rgba(91, 41, 36, 0.3) 0%, rgba(182, 167, 133, 0.3) 99.52%);
}

.leaderboard-content .leaderboard-row-highlight {
    background: var(--color-bg-600);
    border-radius: 2px;
}

.lb-score {
    margin-left: auto;
    text-align: right;
}

.lb-prize {
    width: 50px;
    min-width: 50px;
    text-align: right;
}

@media (orientation: portrait) and (min-width: 768px) {
    .leaderboard-content {
        display: block;
        position: static;
        box-shadow: none;
        transform: none;
        padding: 0;
        margin: 16px 0;
        background: transparent;
    }
}

/* override pre live turnaj leaderboard popup state */
.live-tournament .leaderboard-content {
    background: #1D2730;
}






.no-free-spins {
    position: relative;
    z-index: 2;
    max-width: 460px;
    margin: auto;
}

.no-free-spins p {
    margin: 8px 0;
}

.no-free-spins a {
    font-weight: bold;
}

.no-free-spins .js-warning-close:hover svg {
    cursor: pointer;
    fill: var(--color-primary-500);
}






















@media (orientation: landscape) and (min-width: 992px) {

    .tournament-leaderboard .close,
}









@media (orientation: landscape) {
    .leaderboard-content {
        transform: translateX(200px);
        width: 300px;
        top: 0;
        box-shadow: inset 6px 0px 16px rgba(0, 0, 0, 0.4);
    }
}

@media (orientation: landscape) and (min-width: 992px) {
    .leaderboard-content {
        position: static;
        box-shadow: none;
        transform: none;
        padding: 0;
        margin: 16px 0;
        width: auto;
    }
}

.closed-tournament {
    color: #F0F3F7;
    font-family: "Noto Sans", sans-serif;
    position: relative;
}

@media (min-width: 1200px) {
    .closed-tournament .tournament-container {
        max-width: 860px;
    }
}


































































.tournaments-blocked {
    margin: 8px;
    padding: 16px 24px;
    background: rgba(123, 140, 152, 0.1);
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
    text-align: center;
}

@media (min-width: 568px) {
    .tournaments-blocked {
        padding: 24px 32px;
    }
}

@media (min-width: 768px) {
    .tournaments-blocked {
        margin: 24px 16px;
        gap: 24px;
    }
}

@media (min-width: 992px) {
    .tournaments-blocked {
        margin: 32px auto;
        padding: 48px;
        max-width: 1200px;
    }
}

.tournaments-blocked .text-wrapper {
    max-width: 700px;
}

.tournaments-blocked .image {
    max-width: 440px;
    margin: 0 -16px;
}

.tournaments-blocked .image img {
    width: 100%;
}

.tournaments-blocked span,
.tournaments-blocked p {
    color: #fff;
}

@media (min-width: 768px) {
    .tournaments-all-casinos-button {
        margin: 8px 0;
    }
}

@media (min-width: 992px) {
    .tournaments-all-casinos-button {
        margin: 16px 0;
    }
}

.game-tournament-detail {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 32px;
    padding: 0 8px;
}

@media (min-width: 568px) {
    .game-tournament-detail {
        gap: 16px;
    }
}

@media (min-width: 992px) {
    .game-tournament-detail {
        padding: 0;
    }
}

.game-tournament-detail .top-casinos-header {
    display: none;
    margin: 0;
}

@media (min-width: 768px) {
    .game-tournament-detail .top-casinos-header {
        display: flex;
    }
}

.game-tournament-discussion-wrapper {
    margin: 16px 0;
}

@media (min-width: 568px) {
    .game-tournament-discussion-wrapper {
        margin: 24px 0;
    }
}

@media (min-width: 768px) {
    .game-tournament-discussion-wrapper {
        margin: 32px 0;
    }
}

@media (min-width: 992px) {
    .game-tournament-discussion-wrapper {
        margin: 64px 0;
    }
}

.tournaments-bg {
    height: 500px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 0;
    left: -12px;
    width: calc(100% + 24px);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.tournaments-bg img {
    max-width: 600px;
}

@media (min-width: 568px) {
    .tournaments-bg img {
        max-width: 900px;
    }
}

.tournaments-bg .homepage-slider {
    padding-bottom: 32px;
    margin-bottom: 0;
}

.tournaments-bg .hp-slider-header svg {
    fill: #fbee22;
}

.tournaments-bg .cg-shadow {
    display: none;
}




.card-prize-table {
    -webkit-mask-image: -webkit-gradient(linear, center bottom, center top, from(rgba(0, 0, 0, 0)), color-stop(0.2, black), to(black));
}

@media (min-width: 768px) {
    .homepage-slider-tournaments-shadow:after {
        content: "";
        background: linear-gradient(90deg, rgba(19, 26, 33, 0) 0%, #131A21 100%);
        width: 24px;
        height: 100%;
        position: absolute;
        right: 0;
        top: 0;
        z-index: 2;
    }
}

@media (min-width: 992px) {
    .homepage-slider-tournaments-shadow:after {
        content: none;
    }
}

.game-notavailable-modal {
    width: 100%;
    background: var(--color-bg-900);
    color: #fff;
    box-shadow: 0px 1px 18px 4px rgba(0, 0, 0, 0.5);
    padding: 16px 8px;
}

@media (min-width: 568px) {
    .game-notavailable-modal {
        padding: 24px 5%;
    }
}

.game-notavailable-modal-info {
    display: flex;
    flex-direction: column;
}

@media (min-width: 568px) {
    .game-notavailable-modal-info {
        flex-direction: row;
    }
}

.game-notavailable-modal-info-text {
    flex: 1;
    font-family: "neo-sans", sans-serif;
    order: 1;
}

@media (min-width: 568px) {
    .game-notavailable-modal-info-text {
        order: initial;
    }
}

.game-notavailable-modal-info-text-heading {
    font-size: 20px;
    line-height: 26px;
    color: #F0F3F7;
    font-weight: bold;
}

@media (min-width: 568px) {
    .game-notavailable-modal-info-text-heading {
        font-size: 22px;
    }
}

@media (min-width: 1200px) {
    .game-notavailable-modal-info-text-heading {
        font-size: 28px;
        line-height: 34px;
    }
}

.game-notavailable-modal-info-text-description {
    color: #cdd6dd;
    font-size: 18px;
    line-height: 24px;
    margin-top: 8px;
}

.game-notavailable-modal-info-text-description a {
    color: var(--color-primary-500);
    font-weight: bold;
}

@media (min-width: 568px) {
    .game-notavailable-modal-info-text-description {
        margin-top: 16px;
    }
}

.game-notavailable-modal-info-image {
    flex: 1;
    text-align: right;
    order: 0;
    padding-bottom: 8px;
}

@media (min-width: 568px) {
    .game-notavailable-modal-info-image {
        padding-bottom: 0;
        order: initial;
    }
}

.game-notavailable-modal-info-image img {
    width: 100%;
}

@media (min-width: 568px) {
    .game-notavailable-modal-info-image img {
        max-width: 320px;
    }
}

@media (min-width: 1200px) {
    .game-notavailable-modal-info-image img {
        max-width: 420px;
    }
}

.game-notavailable-modal-carousel {
    border-top: 1px solid var(--color-bg-600);
    margin-top: 16px;
    padding-top: 16px;
}

.game-notavailable-modal-carousel .game-slider-panel {
    padding: 0;
    margin: 0 0 16px 0;
}

.game-notavailable-modal-carousel .game-slider-scroll-wrapper {
    margin-left: -5px;
    margin-right: -5px;
}

.game-notavailable-modal-carousel .game-slider {
    padding-left: 0;
    padding-right: 0;
}

.game-notavailable-modal-carousel .flickity-prev-next-button.previous {
    right: 40px;
}

.game-notavailable-modal-carousel .flickity-prev-next-button.next {
    right: 0;
}

.game-notavailable-modal-carousel p {
    font-family: "Noto Sans", Sans-Serif;
    font-size: 14px;
    line-height: 19px;
    font-weight: bold;
    color: #cdd6dd;
}

.game-notavailable-modal-carousel p a {
    color: var(--color-primary-500);
}

@media (min-width: 568px) {
    .game-notavailable-modal-carousel p {
        font-size: 16px;
        line-height: 22px;
    }
}

@media (min-width: 1200px) {
    .game-notavailable-modal-carousel {
        margin-top: 20px;
        padding-top: 20px;
    }
}

.section-game-review {
    background: #F0F3F7;
    overflow: hidden;
}

.game-detail-wrapper {
    position: relative;
    overflow: hidden;
}

.game-detail-main-video {
    grid-area: video;
}

.game-detail-main-theme {
    font-size: 13px;
    line-height: 18px;
    font-weight: bold;
    color: var(--color-text-900);
    display: inline-block;
    padding: 3px 8px;
    background: var(--color-bg-100);
    border-radius: 25px;
    margin-right: 4px;
    margin-bottom: 4px;
}

.game-detail-main-embed {
    box-shadow: 0px 24px 48px rgba(0, 0, 0, 0.4);
    background: linear-gradient(270deg, #222E38 0%, #1D2730 100%);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 2px;
    display: none;
    margin-top: 24px;
}

@media (min-width: 992px) {
    .game-detail-main-embed {
        display: block;
    }
}

.game-detail-main-embed-text {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    align-items: center;
    text-align: center;
    font-size: 18px;
    line-height: 22px;
    font-weight: bold;
    padding: 0 16px 0 0;
    overflow: hidden;
}

.game-detail-main-embed-text img {
    margin-right: 8px;
    left: -13px;
    top: 22px;
    position: relative;
}

.game-detail-main-embed-button-area {
    padding: 16px;
    display: flex;
    justify-content: center;
}

.game-detail-main-embed-button-area #game-embed-button {
    background: var(--color-primary-500);
    border-radius: 2px;
    padding: 16px 20px;
    color: #F0F3F7;
    font-size: 16px;
    line-height: 19px;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.game-detail-main-embed-button-area #game-embed-button svg {
    margin-right: 8px;
    min-width: 18px;
}

.game-detail-image-gallery {
    position: relative;
}

.game-detail-image-gallery .gallery-image {
    max-height: 100%;
}

.game-detail-image-gallery .gallery-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

.game-detail-image-gallery .flickity-button {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(20px);
}

.game-detail-image-gallery .flickity-prev-next-button {
    top: 50%;
    transform: translateY(-50%);
}

.game-detail-image-gallery .flickity-prev-next-button.previous {
    left: 16px;
}

.game-detail-image-gallery .flickity-prev-next-button.next {
    right: 16px;
}

.game-detail-main-stats {
    grid-area: stats;
    font-family: "Noto Sans", Sans-Serif;
    gap: 8px;
}

.game-detail-main-stats .stats-cards {
    flex-direction: column;
    overflow: unset;
}

@media (min-width: 568px) {
    .game-detail-main-stats .stats-cards {
        flex-direction: row;
        flex-wrap: wrap;
    }
}

@media (min-width: 568px) {
    .game-detail-main-stats .stats-card {
        flex: 0 0 calc(50% - 4px);
    }
}

@media (min-width: 768px) {
    .game-detail-main-stats .stats-card {
        flex: 1 1 100%;
    }
}

@media (min-width: 992px) {
    .game-detail-main-stats .stats-card {
        max-width: calc(50% - 6px);
    }
}

.game-detail-main-stats .stats-card b {
    margin-top: unset;
}

.game-detail-main-about {
    grid-area: about;
    container-type: inline-size;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

@media (min-width: 768px) {
    .game-detail-main-about {
        gap: 24px;
    }
}

.game-detail-main-about-text {
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.24);
    background: linear-gradient(270deg, #222E38 0%, #1D2730 100%);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 2px;
    padding: 16px;
    font-size: 16px;
    line-height: 24px;
    display: flex;
    align-items: center;
    flex-direction: column;
}

@media (min-width: 568px) {
    .game-detail-main-about-text {
        padding: 24px;
    }
}

.game-detail-main-about-text p {
    z-index: 1;
}

.game-detail-main-about-text a {
    color: var(--color-primary-500);
    font-weight: bold;
}

@media (min-width: 992px) {
    .game-detail-main-about-text a:hover {
        color: var(--color-primary-600);
        text-decoration: underline;
    }
}

.game-detail-main-about-text img {
    max-height: 190px;
}

.game-detail-controls {
    background: var(--color-bg-900);
}

.game-detail-main-quick-verdict {
    display: flex;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.24);
    background: linear-gradient(270deg, #222E38 0%, #1D2730 100%);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 2px;
    flex-direction: column;
}

.game-detail-main-quick-verdict-heading {
    font-family: "neo-sans", sans-serif;
    background: rgba(123, 140, 152, 0.1);
    color: #F0F3F7;
    display: flex;
    font-weight: bold;
    align-items: center;
    margin: 4px;
    border-radius: 2px;
    gap: 8px;
    padding: 8px;
}

@media (min-width: 992px) {
    .game-detail-main-quick-verdict-heading {
        justify-content: center;
    }
}

.game-detail-main-quick-verdict-heading img {
    height: 120px;
}

.game-detail-main-quick-verdict-heading-score {
    display: flex;
    flex-direction: column;
}

@media (min-width: 568px) {
    .game-detail-main-quick-verdict-heading-score {
        align-items: center;
    }
}

.game-detail-main-quick-verdict-heading-score-number {
    font-size: 25px;
    line-height: 29px;
}

@media (min-width: 568px) {
    .game-detail-main-quick-verdict-heading-score-number {
        font-size: 32px;
        line-height: 36px;
    }
}

.game-detail-main-quick-verdict-heading-score-label {
    font-size: 14px;
    line-height: 17px;
    text-transform: uppercase;
    text-align: center;
}

@media (min-width: 568px) {
    .game-detail-main-quick-verdict-heading-score-label {
        font-size: 16px;
        line-height: 20px;
    }
}

.game-detail-main-quick-verdict-content {
    color: #F0F3F7;
    padding: 16px;
    font-size: 14px;
    line-height: 20px;
}

@media (min-width: 568px) {
    .game-detail-main-quick-verdict-content {
        padding: 24px;
        font-size: 16px;
        line-height: 22px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
    }
}

.game-detail-main-quick-verdict-content p {
    margin: 8px 0 16px;
}

.game-detail-main-quick-verdict-content-heading {
    font-family: "neo-sans", sans-serif;
    font-weight: bold;
    font-size: 20px;
    line-height: 26px;
}

@media (min-width: 992px) {
    .game-detail-main-quick-verdict-content-heading {
        font-size: 22px;
    }
}

@media (min-width: 1200px) {
    .game-detail-main-quick-verdict-content-heading {
        font-size: 25px;
        line-height: 29px;
    }
}

.game-detail-main-provider {
    grid-area: provider;
    align-self: start;
    container-type: inline-size;
}

.game-detail-main-provider.video-grid-name {
    grid-area: video;
}

.game-detail-video {
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.24);
    background: linear-gradient(270deg, #222E38 0%, #1D2730 100%);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 2px;
    background-image: url("../images/svg/game-detail-video-mobile-background.svg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding: 16px;
    margin: 0 8px 16px 8px;
}

@media (min-width: 568px) {
    .game-detail-video {
        margin: 0 16px 16px 16px;
        background-image: url("../images/svg/game-detail-video-desktop-background.svg");
    }
}

@media (min-width: 992px) {
    .game-detail-video {
        margin: 0 auto 24px auto;
        padding: 20px;
        max-width: 1200px;
    }
}

.game-detail-video-wrapper {
    max-width: 320px;
    display: flex;
    flex-direction: column;
    margin: 0 auto;
}

@media (min-width: 568px) {
    .game-detail-video-wrapper {
        flex-direction: row;
        max-width: none;
        margin: 0;
    }
}

.game-detail-video-wrapper-content {
    font-family: "neo-sans", sans-serif;
    order: 2;
    color: #F0F3F7;
}

@media (min-width: 568px) {
    .game-detail-video-wrapper-content {
        flex: 1;
        order: 1;
    }
}

.game-detail-video-wrapper-content-heading {
    font-size: 22px;
    line-height: 26px;
    padding: 16px 0 8px 0;
}

@media (min-width: 568px) {
    .game-detail-video-wrapper-content-heading {
        padding: 0 0 16px 0;
        font-size: 25px;
        line-height: 29px;
    }
}

@media (min-width: 992px) {
    .game-detail-video-wrapper-content-heading {
        font-size: 28px;
        line-height: 34px;
    }
}

.game-detail-video-wrapper-content-text {
    font-size: 16px;
    line-height: 20px;
}

@media (min-width: 568px) {
    .game-detail-video-wrapper-content-text {
        font-size: 17px;
        line-height: 24px;
    }
}

@media (min-width: 992px) {
    .game-detail-video-wrapper-content-text {
        font-size: 18px;
    }
}

.game-detail-video-wrapper-content-text .btn {
    margin-top: 20px;
    width: 100%;
    display: block;
    height: 40px;
}

@media (min-width: 568px) {
    .game-detail-video-wrapper-content-text .btn {
        width: auto;
    }
}

@media (min-width: 992px) {
    .game-detail-video-wrapper-content-text .btn {
        height: 50px;
    }
}

.game-detail-video-wrapper-video {
    order: 1;
}

@media (min-width: 568px) {
    .game-detail-video-wrapper-video {
        flex: 1;
        order: 2;
        margin-left: 16px;
    }
}

@media (min-width: 992px) {
    .game-detail-video-wrapper-video {
        margin-left: 20px;
    }
}

@media (min-width: 1200px) {
    .game-detail-video-wrapper-video {
        flex: 0 0 550px;
    }
}

.game-detail-video-wrapper-video iframe {
    width: 100%;
}

.game-detail-tips-head {
    font-family: "neo-sans", sans-serif;
    color: #F0F3F7;
    text-align: center;
    max-width: 580px;
    margin: 0 auto 16px;
    padding: 0 16px;
}

@media (min-width: 768px) {
    .game-detail-tips-head {
        margin: 0 auto 24px auto;
    }
}

.game-detail-games-carousel {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 12px;
}

@media (min-width: 568px) {
    .game-detail-games-carousel {
        padding: 0 16px;
    }
}

@media (min-width: 992px) {
    .game-detail-games-carousel .game-slider-panel {
        padding: 0;
    }
}

.game-detail-tips-wrapper {
    padding: 24px 12px;
}

@media (min-width: 992px) {
    .game-detail-tips-wrapper {
        padding: 32px 16px;
    }
}

@media (min-width: 992px) {
    .game-detail-tips-slider-wrapper {
        max-width: 1170px;
        margin: 54px auto 40px;
    }
}

.game-detail-tips-slider-wrapper .game-detail-news-item-wrapper {
    width: 320px;
    flex: 1 0 320px;
    padding: 0 8px;
}

@media (min-width: 568px) and (max-width: 700px) {
    .game-detail-tips-slider-wrapper .game-detail-news-item-wrapper {
        width: 280px;
        flex: 1 0 280px;
    }
}

@media (min-width: 992px) {
    .game-detail-tips-slider-wrapper .game-detail-news-item-wrapper {
        padding: 8px 8px 32px;
        width: 25%;
        flex: 1 0 25%;
        min-height: 100%;
        display: flex;
    }
}

.bullet {
    border-radius: 50%;
    width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.bullet svg {
    fill: black;
}

.bullet.bullet-green {
    background: var(--color-primary-500);
}

.bullet.bullet-greensvg {
    fill: var(--color-text-900);
}

.bullet.bullet-grey {
    background: #a2aeb7;
}

.bullet.bullet-grey svg {
    fill: var(--color-text-900);
}

.bullet.bullet-with-white-svg svg {
    filter: brightness(0) invert(1);
}

.games-content-image {
    margin-right: 15px;
}

.games-content-image img {
    margin-bottom: 24px;
}

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

@container (min-width: 544px) {
    .game-detail-main-about-text {
        flex-direction: row;
    }

    .game-detail-main-about-text img {
        order: 1;
        height: 180px;
        top: -40px;
    }

    .game-detail-main-quick-verdict {
        flex-direction: row;
        position: relative;
    }

    .game-detail-main-quick-verdict-heading {
        flex: 1 0 180px;
        flex-direction: column;
        max-width: 180px;
        gap: 0;
        justify-content: center;
        padding: 16px;
    }
}

#gamefileEmbedGamalyze {
    background: #fff;
}

.popover-card-vote .game-vote-down .vote-down {
    fill: #ED9C00;
}

.games-box-fullscreen {
    width: 100%;
    height: 100%;
    padding: 0;
    margin: initial;
}

.game-box-age-confirm {
    position: absolute;
    left: 0;
    width: 100%;
    background: var(--color-bg-900);
    z-index: 10;
    min-height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    color: white;
    box-shadow: 0px 1px 18px 4px rgba(0, 0, 0, 0.5);
    overflow: hidden;
    flex-direction: column;
}

@media (min-width: 568px) {
    .game-box-age-confirm {
        padding: 20px 40px;
    }
}

@media (min-width: 768px) {
    .game-box-age-confirm {
        flex-direction: row;
        justify-content: space-evenly;
    }
}

@media (min-width: 992px) {
    .game-box-age-confirm {
        padding: 50px;
        height: calc(100% - 100px);
    }
}

.game-box-age-confirm .age-icon {
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    background: rgba(123, 140, 152, 0.1);
    color: var(--color-ui-error-red);
    border-radius: 50%;
    font-family: "neo-sans", sans-serif;
    font-weight: bold;
    font-size: 16px;
    text-align: center;
    justify-content: center;
    margin-left: 8px;
}

@media (min-width: 768px) {
    .game-box-age-confirm .age-icon {
        margin-left: 0;
    }
}

.game-box-age-confirm .title {
    font-family: "neo-sans", sans-serif;
    font-weight: bold;
    color: #F0F3F7;
    font-size: 20px;
    line-height: 26px;
    margin-bottom: 16px;
}

@media (min-width: 568px) {
    .game-box-age-confirm .title {
        font-size: 22px;
        line-height: 26px;
    }
}

@media (min-width: 1200px) {
    .game-box-age-confirm .title {
        font-size: 25px;
        line-height: 29px;
    }
}

.game-box-age-confirm .focus .autocomplete-wrapper {
    display: block;
}

.game-box-age-confirm .cg-input-field {
    border-color: var(--color-text-600);
    background: transparent;
    color: white;
}

.game-box-age-confirm .cg-input-field:focus {
    outline: 2px solid white;
}

.game-box-age-confirm .cg-input-field:focus+.autocomplete-wrapper {
    display: block;
}

.game-box-age-confirm .cg-select {
    border-color: var(--color-text-600);
    background: transparent;
    color: white;
}

.game-box-age-confirm .cg-select option {
    color: var(--color-text-900);
}

.game-box-age-confirm input.touched:invalid {
    border-color: var(--color-ui-error-red);
}

.game-box-age-confirm .cg-input-label,
.game-box-age-confirm .cg-input-label-top {
    color: #cdd6dd;
}

.game-box-age-confirm .cg-input-wrapper {
    background: var(--color-bg-600);
    position: relative;
    z-index: 2;
    display: block;
}

.game-box-age-confirm .age-verify-birth-date fieldset {
    margin: 0 10px 0 0;
}

.game-box-age-confirm .age-verify-birth-date fieldset:last-child {
    margin: 0;
}

.game-box-age-confirm p {
    font-size: 16px;
    line-height: 19px;
    margin-bottom: 16px;
    color: #cdd6dd;
}

@media (min-width: 768px) {
    .game-box-age-confirm p {
        font-size: 16px;
        line-height: 20px;
    }
}

.game-box-age-confirm .age-confirm-text {
    max-width: 600px;
}

.game-box-age-confirm .age-confirm-img {
    max-width: 80%;
    display: none;
}

@media (min-width: 768px) {
    .game-box-age-confirm .age-confirm-img {
        display: block;
        flex: 0 0 160px;
        margin-right: 20px;
    }
}

@media (min-width: 1200px) {
    .game-box-age-confirm .age-confirm-img {
        margin-right: 80px;
        flex: 0 0 auto;
    }
}

.game-box-age-confirm .age-confirm-img img {
    max-width: 100%;
}

.game-box-age-confirm .age-verify-features {
    display: flex;
    font-size: 14px;
    line-height: 16px;
    color: #cdd6dd;
    max-width: 400px;
    flex-direction: column;
    align-items: center;
}

@media (min-width: 768px) {
    .game-box-age-confirm .age-verify-features {
        display: flex;
        width: 100%;
        justify-content: flex-end;
    }
}

@media (min-width: 992px) {
    .game-box-age-confirm .age-verify-features {
        font-size: 16px;
        line-height: 20px;
    }
}

.game-box-age-confirm .age-verify-features ul {
    margin-top: 16px;
    align-self: flex-start;
}

@media (min-width: 768px) {
    .game-box-age-confirm .age-verify-features ul {
        margin-top: 24px;
        align-self: center;
    }
}

.game-box-age-confirm .two-inputs {
    position: relative;
    display: flex;
    align-items: center;
    align-content: space-between;
    flex-wrap: wrap;
}

@media (min-width: 768px) {
    .game-box-age-confirm .two-inputs {
        flex-wrap: nowrap;
    }
}

.game-box-age-confirm .two-inputs .cg-input-wrapper {
    width: 100%;
}

.game-box-age-confirm .two-inputs .cg-input-wrapper:first-of-type {
    margin-bottom: 8px;
}

@media (min-width: 768px) {
    .game-box-age-confirm .two-inputs .cg-input-wrapper {
        flex: 1;
    }

    .game-box-age-confirm .two-inputs .cg-input-wrapper:first-of-type {
        margin-bottom: 0;
    }
}

.game-box-age-confirm .age-verify-note {
    display: flex;
    padding: 8px;
    background: #D9ECFF;
    border-radius: 2px;
    border: 1px solid #007DFF;
    margin-top: 16px;
}

@media (min-width: 768px) {
    .game-box-age-confirm .age-verify-note {
        margin-top: 0;
        max-width: 272px;
        margin-left: 32px;
    }
}

.game-box-age-confirm .age-verify-note div {
    color: #1D2730;
    font-size: 14px;
    line-height: 19px;
    font-weight: bold;
}

.game-box-age-confirm .age-verify-note svg {
    fill: #007DFF;
    min-width: 22px;
    margin-right: 16px;
}

.game-box-age-confirm .success {
    margin-right: 10px;
}

.game-box-age-confirm .success:not(hidden) {
    animation: bump 0.8s;
}

.game-box-age-confirm .js-btn-verify-age {
    height: 40px;
    font-size: 14px;
    line-height: 17px;
    width: 100%;
    text-align: center;
}

.game-box-age-confirm .verify-terms-and-conditions {
    font-size: 12px;
    line-height: 16px;
    color: #a2aeb7;
    margin-top: 8px;
    text-align: center;
}

.game-box-age-confirm .game-ornament-1 {
    position: absolute;
    top: 500px;
    right: -30px;
}

@media (min-width: 768px) {
    .game-box-age-confirm .game-ornament-1 {
        top: initial;
        bottom: 0;
        right: -30px;
    }
}

.game-box-age-confirm .game-ornament-2 {
    position: absolute;
    top: 300px;
    left: -10px;
}

@media (min-width: 768px) {
    .game-box-age-confirm .game-ornament-2 {
        top: initial;
        bottom: -10px;
        left: -10px;
    }
}

.game-box-age-confirm .game-ornament-3 {
    position: absolute;
    top: -60px;
    right: 10px;
}

@media (min-width: 768px) {
    .game-box-age-confirm .game-ornament-3 {
        top: -60px;
        right: 300px;
    }
}

.game-box-age-confirm .game-box-close-age-verify {
    font-size: 14px;
}

@media (min-width: 568px) {
    .game-box-age-confirm .game-box-close-age-verify {
        font-size: 16px;
        margin-top: 8px;
    }
}

.game-box-age-confirm .game-box-close-age-verify svg {
    width: 14px;
    height: 14px;
}

@media (min-width: 568px) {
    .game-box-age-confirm .game-box-close-age-verify svg {
        width: 16px;
        height: 16px;
    }
}

.game-box-age-confirm-finished {
    max-width: 420px;
    text-align: center;
}

.btn-agechecked {
    background: var(--color-ui-link-light);
    border-color: var(--color-ui-link-light);
}

.age-confirm-content {
    max-width: 400px;
}

.age-confirm-content .ukgc-logo {
    width: 100px;
}

@media (min-width: 768px) {
    .age-confirm-content .ukgc-logo {
        width: 150px;
    }
}

.age-confirm-content .cg-input-wrapper {
    border-radius: 2px;
}

.age-verify-form {
    width: 100%;
}

@media (min-width: 768px) {
    .age-verify-form {
        width: 400px;
    }
}

.age-verify-form .autocomplete-wrapper {
    background: white;
    position: absolute;
    display: none;
    bottom: 0;
    transform: translateY(100%);
    width: 100%;
    z-index: 3;
}

.age-verify-form .autocomplete-wrapper li {
    border-bottom: 1px solid #cdd6dd;
    padding: 5px;
    font-size: 12px;
    line-height: 13px;
    color: var(--color-text-600);
    cursor: pointer;
}

.age-verify-form .autocomplete-wrapper li:hover,
.age-verify-form .autocomplete-wrapper li.selected {
    background: #cdd6dd;
}

.game-report-problem {
    position: absolute;
    left: 0;
    width: 100%;
    background: var(--color-bg-900);
    z-index: 10;
    min-height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    color: white;
    box-shadow: 0px 1px 18px 4px rgba(0, 0, 0, 0.5);
    overflow: hidden;
}

.game-report-problem textarea {
    background: rgba(123, 140, 152, 0.1);
    border: 1px solid #a2aeb7;
    border-radius: 2px;
    width: 100%;
    height: 150px;
    margin: 16px 0;
    color: white;
}

.game-report-problem .report-problem-row {
    margin: 8px 0;
    display: flex;
    font-size: 14px;
    line-height: 19px;
}

@media (min-width: 768px) {
    .game-report-problem .report-problem-row {
        font-size: 16px;
        line-height: 22px;
    }
}

.game-report-problem .close {
    display: block;
    cursor: pointer;
}

.game-report-problem .close:hover svg {
    fill: var(--color-primary-500);
}

.game-report-problem .close svg {
    fill: #7B8C98;
    display: block;
}

@media (min-width: 568px) {
    .game-report-problem .close svg {
        width: 22px;
        height: 22px;
    }
}

@media (min-width: 992px) {
    .game-report-problem .close svg {
        width: 24px;
        height: 24px;
    }
}

.game-report-problem .slide-1,
.game-report-problem .user-vote-finish {
    max-width: 650px;
    margin: auto;
    flex: 1;
}

@media (min-width: 568px) {
    .game-report-content {
        display: flex;
        align-items: flex-start;
        margin: 16px 0;
    }
}

.game-report-content input[type=radio].cg-radio+label {
    color: white;
}

.game-report-content input[type=radio].cg-radio:checked+label {
    color: white;
}

.header-wrapper {
    background: var(--color-bg-900);
    position: static;
    z-index: 10;
    top: 0;
    left: 0;
    width: 100%;
    height: 36px;
    display: flex;
    align-items: center;
}

.header-wrapper.game-player-menu-opened .game-player-menu {
    transform: translateY(0);
}

.header-wrapper.game-player-menu-opened .arrow {
    transform: rotateZ(180deg);
}

.header-wrapper .logo {
    width: 14px;
    overflow: hidden;
    display: block;
    position: absolute;
    margin-left: 16px;
    z-index: 3;
}

.header-wrapper .logo img {
    height: 20px;
    width: auto;
}

.header-wrapper .arrow {
    fill: white;
    flex: 1;
}

.header-wrapper .game-report-problem {
    left: 0;
    top: 0;
    width: 100vw;
    display: block;
}

.game-player-menu-arrow {
    flex: 1;
    text-align: center;
    position: relative;
    z-index: 2;
    background: var(--color-bg-900);
    height: 100%;
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--color-bg-800);
}

.game-player-menu {
    background: var(--color-bg-900);
    position: absolute;
    left: 0;
    width: 100%;
    top: 36px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    transform: translateY(-130%);
    transition: transform 0.1s ease-in-out;
    z-index: 1;
}

.game-player-menu .menu-item {
    border: 1px solid #4A5B68;
    border-radius: 2px;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 8px;
    font-size: 16px;
    line-height: 22px;
    font-family: "Noto Sans", Sans-Serif;
    font-weight: normal;
}

.game-player-menu .menu-item svg {
    margin-right: 8px;
    fill: #fff;
}

.game-player-menu .menu-item:hover {
    color: var(--color-primary-500);
    background: rgba(123, 140, 152, 0.2);
}

.game-player-menu .menu-item:hover svg {
    fill: var(--color-primary-500);
}

.game-player-menu .menu-item .active-btn,
.game-player-menu .menu-item .active {
    display: none;
}

.game-player-menu .menu-item .active-btn.js-btn-loader,
.game-player-menu .menu-item .active.js-btn-loader {
    display: flex;
}

.game-player-menu .menu-item .active-btn .loader,
.game-player-menu .menu-item .active .loader {
    display: inline-flex;
}

.game-player-menu .menu-item.voted .vote-not-active,
.game-player-menu .menu-item.voted:hover .vote-not-active {
    display: none;
}

.game-player-menu .menu-item.voted .vote-active,
.game-player-menu .menu-item.voted:hover .vote-active {
    display: inline;
}

.game-player-menu .menu-item.none {
    display: none;
}

.game-player-menu .menu-item .loader {
    display: none;
    width: 16px;
    height: 16px;
    border-width: 3px;
    margin: 0;
}

.game-player-menu .play-in-casino {
    margin: 16px 0;
}

.game-player-menu .btn-user-list svg {
    margin-right: 0;
}

.game-player-menu .btn-game {
    font-size: 16px;
    line-height: 19px;
}

.game-player-menu .btn-icon-link {
    order: initial;
}

.game-player-menu .game-vote-btn-wrapper {
    margin: 0 0 0 auto;
}

.game-fallback-container {
    background: black;
    position: fixed;
    width: 100%;
}

@media (orientation: landscape) {
    .game-fallback-container {
        margin-left: 36px;
    }

    .header-wrapper {
        width: 36px;
        height: 100%;
        flex-direction: column;
        position: fixed;
        border-right: 1px solid var(--color-bg-800);
    }

    .header-wrapper .game-report-problem {
        left: 36px;
        width: 100vw;
        overflow: scroll;
        height: 100%;
    }

    .header-wrapper .game-report-problem textarea {
        margin: 0;
    }

    .header-wrapper .logo {
        position: static;
        margin: 8px 0;
    }

    .header-wrapper.game-player-menu-opened .arrow {
        transform: rotateZ(90deg);
    }

    .game-player-menu-arrow .arrow {
        transform: rotateZ(-90deg);
    }

    .game-player-menu {
        width: 350px;
        height: 100%;
        left: 36px;
        top: 0;
        transform: translatex(-130%);
        overflow: auto;
    }
}

.user-vote-finish {
    position: relative;
}

.user-vote-finish .close {
    position: absolute;
    top: 0;
    right: 0;
}

.login-signup-popup-screen {
    background: var(--color-bg-900);
    color: #fff;
    position: absolute;
    top: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.login-signup-popup-screen .message {
    font-family: "Noto Sans", sans-serif;
    font-size: 16px;
    line-height: 22px;
    padding: 16px;
    text-align: center;
}

.login-signup-popup-screen .close {
    top: 16px;
    right: 16px;
    position: absolute;
    pointer-events: all;
}

.tippy-box[data-theme~=gameflix] {
    background: var(--color-bg-900);
    border: 1px solid rgba(123, 140, 152, 0.1);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.8);
    border-radius: 2px;
}

.tippy-box[data-theme~=gameflix] .tippy-content {
    padding: 8px;
}

.tippy-box[data-theme~=gameflix] .tippy-arrow {
    color: var(--color-text-900);
}

.game-like-popup {
    display: flex;
    flex-direction: column;
}

.game-like-popup .btn {
    font-family: "Noto Sans", sans-serif;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #F0F3F7;
    width: 100%;
    justify-content: flex-start;
    white-space: nowrap;
}

.game-like-popup .btn svg {
    min-width: 18px;
    min-height: 18px;
    /* safari flickering fix */
    -webkit-transform: translate3d(0, 0, 0);
    -webkit-backface-visibility: hidden;
    -webkit-transform-style: preserve-3d;
}

.game-like-popup .btn .active {
    fill: var(--color-primary-500);
    display: none;
}

.game-like-popup .btn.active svg {
    display: none;
}

.game-like-popup .btn.active .active {
    display: flex;
}

.game-like-popup .btn:hover {
    background: rgba(123, 140, 152, 0.2);
    border-radius: 2px;
}

.game-like-popup .btn:hover svg {
    fill: var(--color-primary-500);
}

.game-like-popup .btn:hover.active svg {
    display: flex;
}

.game-like-popup .btn:hover.active .active {
    display: none;
}

.casino-detail-reputation-details {
    background: white;
    padding: 16px;
    border-radius: 2px;
}

@media (min-width: 768px) {
    .casino-detail-reputation-details {
        flex: 1;
        padding: 24px;
    }
}

.casino-detail-reputation-details .info {
    display: block;
}

.casino-detail-reputation-details .rating-item:not(:first-child) {
    margin: 8px 0 0;
}

.casino-detail-reputation-details .rating-item:not(:last-child) {
    padding: 0 0 8px;
    border-bottom: 1px solid #cdd6dd;
}

.casino-detail-reputation-details .rating-item-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

@media (min-width: 768px) {
    .casino-detail-reputation-details .rating-item-row {
        font-size: 16px;
        line-height: 22px;
    }
}

.casino-detail-user-score {
    margin-top: 8px;
}

.casino-detail-user-score .btn-wrapper {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height ease-in-out 0.2s, opacity ease-in-out 0.2s;
}

.casino-detail-user-score.toggle .btn-wrapper {
    max-height: 200px;
    opacity: 1;
}

.casino-detail-user-score .user-score-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
}

.casino-detail-not-available {
    background: rgba(123, 140, 152, 0.1);
    padding: 16px;
    text-align: center;
    margin: 16px 0;
}

.casino-detail-not-available h1 {
    margin-bottom: 8px;
}

@media (min-width: 992px) {
    .casino-detail-not-available h1 {
        margin-bottom: 16px;
    }
}

@media (min-width: 568px) {
    .casino-detail-not-available {
        padding: 24px;
        margin-top: 24px;
    }
}

@media (min-width: 768px) {
    .casino-detail-not-available {
        padding: 32px;
        margin-top: 24px;
    }
}

@media (min-width: 992px) {
    .casino-detail-not-available {
        margin: 32px auto 0;
        max-width: 800px;
        padding: 48px;
    }
}

.casino-detail-not-available ul {
    margin-left: 32px;
    text-align: left;
}

.casino-detail-not-available ul li {
    list-style: disc;
}

.bonus-exclusive-tag {
    background: var(--color-primary-600);
    padding: 4px 12px;
    border-radius: 15px;
    color: white;
    font-family: "Noto Sans", sans-serif;
    font-weight: bold;
    display: flex;
    align-items: center;
    font-size: 12px;
    line-height: 16px;
    display: inline-flex;
}

.bonus-exclusive-tag svg {
    width: 16px;
    height: 16px;
}

.bonus-limited-tag {
    background: var(--color-bg-900);
    background: var(--color-primary-600);
    padding: 4px 12px;
    border-radius: 15px;
    color: white;
    font-family: "Noto Sans", sans-serif;
    font-weight: bold;
    display: flex;
    align-items: center;
    font-size: 12px;
    line-height: 16px;
    display: inline-flex;
}

.bonus-limited-tag svg {
    width: 16px;
    height: 16px;
}

@media (min-width: 768px) {
    .bonus-limited-tag {
        font-size: 14px;
        line-height: 20px;
    }

    .bonus-limited-tag svg {
        width: 18px;
        height: 18px;
    }
}

.casino-card-logos-list {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    max-height: 210px;
    overflow: auto;
}

.tippy-box .casino-card-logos-list {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    gap: 4px;
}

.casino-card-logos-item img {
    display: block;
    font-size: 8px;
    overflow: hidden;
    background: white;
    border-radius: 2px;
    margin: auto;
    white-space: break-spaces;
}

.casino-card-logos-item picture {
    border: 1px solid #E3E7EF;
    border-radius: 2px;
    justify-content: center;
    height: 100%;
    background: white;
    display: flex;
    align-items: center;
}

.casino-card-logos-item.not-available {
    filter: grayscale(1);
    background: #F0F3F7;
}

.casino-card-logos-item.not-available img {
    background: #F0F3F7;
}

.add-in-content-info {
    display: inline-flex;
    cursor: pointer;
    vertical-align: middle;
    width: auto;
    color: var(--color-ui-link-light);
}

.add-in-content-info svg {
    margin: 0 2px;
    fill: var(--color-ui-link-light);
}

.add-in-content-info.ml-0 svg {
    margin-left: 0;
}

.bonus-lines-tooltip .bonus-info-icon {
    fill: var(--color-text-600);
    margin: 0 8px 0 0;
    flex-shrink: 0;
}

@media (min-width: 568px) {
    .bonus-lines-tooltip .bonus-info-icon {
        width: 24px;
        height: 24px;
    }
}

.blacklist-card-tag {
    border-radius: 2px;
    font-family: Noto Sans;
    font-weight: bold;
    font-size: 14px;
    line-height: 19px;
    background: #D60E16;
    padding: 2px 8px;
    color: white;
    display: inline-block;
}

.tag-social {
    font-family: "Noto Sans", sans-serif;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal;
    display: flex;
    align-items: center;
    gap: 8px;
}

.tag-sweepstake {
    background: #D9ECFF;
    position: relative;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 12px;
    font-family: "Noto Sans", sans-serif;
    border-radius: 20px;
}

@media (min-width: 568px) {
    .tag-sweepstake {
        font-size: 14px;
        line-height: 20px;
    }
}

@media (min-width: 568px) {
    .tag-sweepstake img {
        width: 18px;
        height: 18px;
    }
}

.casino-card-logo {
    height: 80px;
    z-index: 4;
}

@container casino-card (min-width: 960px) {
    .casino-card-logo {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
    }

    .casino-card-closed .casino-card-logo {
        width: 70%;
        margin: 0 auto 8px auto;
    }
}

.casino-card-logo img {
    height: 90px;
    max-width: 100%;
    width: auto;
}

@container casino-card (min-width: 960px) {
    .casino-card-logo img {
        height: auto;
    }
}

.casino-card-logo .logo-square {
    display: none;
}

@container casino-card (min-width: 960px) {
    .casino-card-logo .logo-square {
        display: block;
        width: 100%;
    }
}

.casino-card-logo .logo-wide {
    display: block;
    top: -5px;
    position: relative;
}

@container casino-card (min-width: 960px) {
    .casino-card-logo .logo-wide {
        display: none;
    }
}

.btn-read-review {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    color: var(--color-secondary-800);
    font-size: 14px;
    justify-content: center;
    line-height: 16px;
    font-family: "neo-sans", sans-serif;
    font-weight: bold;
    padding: 0;
    min-height: 0;
}

.btn-read-review svg {
    fill: var(--color-secondary-800);
}

.btn-read-review:hover {
    text-decoration: underline;
    color: var(--color-secondary-900);
    fill: var(--color-secondary-900);
}

.card-alert {
    font-size: 12px;
    line-height: 14px;
    margin: 2px;
    background: #F0F3F7;
    font-weight: bold;
    color: var(--color-text-600);
    padding: 8px;
    display: flex;
    align-items: center;
    border-radius: 2px;
    gap: 8px;
}

@container casino-card (min-width: 736px) {
    .card-alert {
        padding: 7px 10px;
        font-size: 14px;
        line-height: 18px;
        margin: 8px 0 0 0;
    }
}

.casino-card-tc-info {
    background: white;
    padding: 8px;
    font-size: 10px;
    line-height: 12px;
    color: var(--color-text-600);
}

.casino-card-tc-info a {
    color: var(--color-ui-link-light);
}

.casino-card-tc-info .sep {
    content: "";
}

.casino-card-tc-info .sep:after {
    content: " ";
    width: 3px;
    height: 3px;
    display: inline-block;
    background: #cdd6dd;
    border-radius: 50%;
    margin: -2px 4px 0;
    position: relative;
    top: -2px;
}

.card-alert-bullet {
    border-radius: 50%;
    width: 14px;
    height: 14px;
    display: inline-flex;
    margin-right: 8px;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

@container casino-card (min-width: 736px) {
    .card-alert-bullet {
        width: 18px;
        height: 18px;
    }
}

.card-alert-bullet svg {
    fill: white;
}

@container casino-card (min-width: 736px) {
    .card-alert-bullet svg {
        width: 12px;
        height: 12px;
    }
}

.card-alert-bullet.grey-dark {
    background: var(--color-bg-600);
}

.card-alert-bullet.red {
    background: var(--color-ui-error-red);
}

.card-alert-error {
    background: #FEEBED;
    color: var(--color-ui-error-red);
}

.bullet.neutral svg {
    fill: #7B8C98;
}

.bullet.green {
    background: var(--color-primary-500);
}

.bullet.yellow {
    background: #ED9C00;
}

.bullet.grey {
    background: #7B8C98;
}

.bullet.red {
    background: var(--color-ui-error-red);
}

.fill-neutral {
    fill: #7B8C98;
}

.fill-green {
    fill: var(--color-primary-500);
}

.fill-yellow {
    fill: #ED9C00;
}

.fill-grey {
    fill: #7B8C98;
}

.fill-red {
    fill: var(--color-ui-error-red);
}

.casino-card-available-games-ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    white-space: nowrap;
    position: relative;
    grid-column-gap: 8px;
}

.casino-card-available-games-ul li {
    text-align: left;
    flex: 0 0 70px;
    margin-right: 3px;
    font-size: 12px;
    line-height: 16px;
    color: #a2aeb7;
    padding: 3px 0;
    white-space: normal;
    position: relative;
    display: flex;
    text-decoration: line-through;
    align-items: center;
}

@media (min-width: 768px) {
    .casino-card-available-games-ul li {
        margin: 0;
        flex: none;
    }
}

.casino-card-available-games-ul li svg {
    display: block;
    flex: 0 0 26px;
}

.casino-card-available-games-ul li .bullet-dot {
    border-radius: 50%;
    width: 7px;
    height: 7px;
    background: #a2aeb7;
}

.casino-card-available-games-ul li .bullet-dot.active {
    background: var(--color-primary-500);
}

.casino-card-available-games-ul li .bullet {
    position: absolute;
    top: 4px;
    right: 4px;
    margin-right: 0;
    display: none;
}

.casino-card-available-games-ul li.active {
    text-decoration: none;
    color: var(--color-text-900);
}

.casino-card-available-games-ul li.active .game-icon {
    fill: var(--color-text-900);
}

.casino-card-available-games-ul .game-icon {
    width: 20px;
    height: 20px;
    margin: 0 4px;
    fill: #a2aeb7;
    display: block;
}

.reviews-summary {
    background: white;
    border: 2px;
    padding: 16px;
    box-shadow: 0px 1px 0px #E3E7EF;
    border-radius: 2px;
    display: grid;
    gap: 16px;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto 1fr;
}

@media (min-width: 568px) {
    .reviews-summary {
        grid-template-columns: 120px 1fr;
        grid-template-rows: auto 1fr;
    }
}

@media (min-width: 768px) {
    .reviews-summary {
        padding: 24px;
        grid-template-columns: 120px 200px 1fr;
        grid-template-rows: auto;
        row-gap: 0;
    }
}

@media (min-width: 992px) {
    .reviews-summary {
        grid-template-columns: 200px 200px 1fr;
    }
}

.reviews-summary .neo-fs-28 {
    margin: 0;
}

@media (min-width: 768px) {
    .reviews-summary .neo-fs-28 {
        margin: 8px 0;
    }
}

.reviews-summary .casino-img-wrapper {
    margin: -12px -12px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 62px;
    border-radius: 2px;
    overflow: hidden;
}

@media (min-width: 568px) {
    .reviews-summary .casino-img-wrapper {
        margin: -12px 0 -12px -12px;
        height: auto;
        grid-row-start: 1;
        grid-row-end: 3;
    }
}

@media (min-width: 768px) {
    .reviews-summary .casino-img-wrapper {
        margin: -20px 0 -20px -20px;
    }
}

.reviews-summary .user-reviews-casino-img {
    height: 100%;
}

@media (min-width: 568px) {
    .reviews-summary .user-reviews-casino-img {
        height: auto;
    }
}

.reviews-summary .user-reviews-casino-img img {
    height: 100%;
    max-width: 100%;
    display: block;
}

@media (min-width: 568px) {
    .reviews-summary .user-reviews-casino-img img {
        height: auto;
    }
}

@media (min-width: 768px) {
    .reviews-summary .review-bar-with-legend {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
}

@media (min-width: 768px) {
    .reviews-summary .user-score-info {
        float: none;
        vertical-align: middle;
        margin-left: 8px;
    }
}

@media (min-width: 568px) {
    .reviews-summary .reviews-bar-wrapper {
        margin: 0 0 8px;
        height: 12px;
    }
}

@media (min-width: 768px) {
    .reviews-summary .text-rating-wrapper {
        align-items: flex-start;
    }
}

@media (min-width: 768px) {
    .reviews-summary .reviews-count {
        margin-left: unset;
    }
}

.top-casino-card-wrapper {
    width: 100%;
    margin-bottom: 8px;
    max-width: 1170px;
}

.top-casino-card-wrapper:last-of-type {
    margin-bottom: 0;
}

@media (min-width: 568px) {
    .top-casino-card-wrapper {
        margin-bottom: 16px;
    }

    .top-casino-card-wrapper:last-of-type {
        margin-bottom: 0;
    }
}

.top-casino-card-wrapper .bonus-name {
    font-family: "neo-sans", sans-serif;
    font-size: 14px;
    line-height: 17px;
}

@media (min-width: 768px) {
    .top-casino-card-wrapper .bonus-name {
        font-size: 16px;
        line-height: 19px;
    }
}

.top-casino-card-wrapper .bonus-name-additional {
    font-family: "neo-sans", sans-serif;
    font-size: 14px;
    line-height: 17px;
}

.top-casino-card-wrapper .hide-card-detail {
    display: none;
}

.top-casino-card-wrapper .casino-header-logo img {
    top: -8px;
    position: relative;
}

@media (min-width: 568px) {
    .top-casino-card-wrapper .casino-header-logo img {
        position: static;
    }
}

.top-casino-card-wrapper img {
    margin: auto;
    max-width: 100%;
}

.top-casino-card-wrapper .btn {
    width: 100%;
    min-height: 40px;
}

@media (min-width: 568px) {
    .top-casino-card-wrapper .btn {
        min-height: 50px;
        font-size: 16px;
        line-height: 19px;
    }
}

.top-casino-card-wrapper.active .show-card-body svg {
    transform: rotateX(180deg);
}

.top-casino-card-wrapper.active .top-casino-card-body {
    display: block;
}

@media (min-width: 768px) {
    .top-casino-card-wrapper.active .top-casino-card-body {
        display: grid;
    }
}

.top-casino-card-wrapper .casino-card-tc-info {
    box-shadow: inset 0px 4px 4px rgba(0, 0, 0, 0.16);
    margin-top: -2px;
    display: flex;
    gap: 2px;
    flex-wrap: wrap;
}

.top-casino-card-wrapper .btn>div,
.top-casino-card-wrapper .btn {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

@media (max-width: 375px) {
    .top-casino-card-wrapper .casino-card-info a {
        word-break: break-all;
    }
}

@media (min-width: 568px) {
    .top-casino-card-wrapper .casino-card-info a {
        word-break: normal;
    }
}

.top-casino-card-wrapper .casino-card-info a.bonus-name {
    word-break: normal;
}

.top-casino-card {
    padding: 8px;
    border-radius: 2px;
    background: #fff;
    display: grid;
    grid-template-rows: auto auto auto;
    grid-template-columns: 1fr 110px;
    grid-template-areas: "header header" "content content" "replacable-part replacable-part" "bottom bottom";
}

@media (min-width: 568px) {
    .top-casino-card {
        grid-template-rows: auto auto;
        grid-template-columns: 160px 1fr;
        grid-template-areas: "header content" "header replacable-part" "header bottom";
    }
}

@media (min-width: 768px) {
    .top-casino-card {
        padding: 16px;
        grid-template-columns: 160px 1fr 130px;
        grid-template-areas: "header content replacable-part " "header bottom bottom";
    }
}

@media (min-width: 992px) {
    .top-casino-card {
        padding: 24px;
        grid-template-rows: auto;
        grid-template-columns: 160px 8fr 130px auto;
        grid-template-areas: "header content replacable-part bottom";
    }
}

.top-casino-card.on-dark-bg {
    box-shadow: 0px 24px 48px rgba(0, 0, 0, 0.4);
}

.top-casino-card.on-light-bg {
    box-shadow: 0px 4px 8px rgba(29, 39, 48, 0.08);
}

@media (min-width: 568px) {
    .top-casino-card .casino-header-logo img {
        height: auto;
        width: 100%;
    }
}

@media (min-width: 568px) {
    .top-casino-card>* {
        margin: 0 8px;
    }
}

@media (min-width: 992px) {
    .top-casino-card>* {
        margin: 0 16px;
    }
}

.top-casino-card .btn-wrapper {
    margin-top: auto;
    width: calc(50% - 4px);
    flex: 0 0 calc(50% - 4px);
}

@media (min-width: 992px) {
    .top-casino-card .btn-wrapper {
        min-width: 164px;
        margin-right: 8px;
    }

    .top-casino-card .btn-wrapper:last-child {
        margin-right: 0;
    }
}

@media (min-width: 768px) {
    .top-casino-card .safety-index {
        flex-direction: column;
        justify-content: center;
    }
}

.top-casino-card .casino-header-logo {
    border-radius: 2px;
    margin: -4px -4px 0 -4px;
    grid-area: header;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

@media (min-width: 568px) {
    .top-casino-card .casino-header-logo {
        margin: -4px 0px -4px -4px;
    }
}

@media (min-width: 768px) {
    .top-casino-card .casino-header-logo {
        margin: -12px 0px -12px -12px;
    }
}

@media (min-width: 992px) {
    .top-casino-card .casino-header-logo {
        margin: -20px 0px -20px -20px;
    }
}

.top-casino-card .ctli-header-logo {
    position: absolute;
    bottom: 8px;
    margin: auto;
    z-index: 5;
}

.top-casino-card .casino-safety-index,
.top-casino-card .casino-rating {
    grid-area: replacable-part;
    margin: 8px 0;
}

@media (min-width: 568px) {

    .top-casino-card .casino-safety-index,
    .top-casino-card .casino-rating {
        margin: 8px;
    }
}

@media (min-width: 992px) {

    .top-casino-card .casino-safety-index,
    .top-casino-card .casino-rating {
        align-self: center;
    }
}

@media (max-width: 567px) {
    .top-casino-card .casino-rating {
        text-align: left;
        flex-wrap: wrap;
        flex-direction: row;
        column-gap: 8px;
    }
}

@media (max-width: 567px) {
    .top-casino-card .reviews-bar-wrapper {
        order: 3;
    }
}

.top-casino-card .casino-card-bonus {
    margin-top: 4px;
}

.top-casino-card .casino-card-info {
    grid-area: content;
    margin-top: 8px;
}

@media (min-width: 568px) {
    .top-casino-card .casino-card-info {
        margin-top: auto;
        margin-bottom: auto;
    }
}

.top-casino-card .casino-card-bottom {
    grid-area: bottom;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

@media (min-width: 992px) {
    .top-casino-card .casino-card-bottom {
        align-self: center;
        margin: 0 0 0 16px;
    }
}

.top-casino-card-available-games-small {
    display: flex;
    white-space: nowrap;
    position: relative;
    list-style-type: none;
    flex-wrap: wrap;
    margin: 8px 0 0;
}

.top-casino-card-available-games-small li:not(:last-child) {
    flex: 0 0 auto;
    margin-right: 16px;
    font-weight: bold;
    color: #a2aeb7;
    font-size: 12px;
    line-height: 16px;
    text-transform: uppercase;
    text-decoration: line-through;
    white-space: nowrap;
    position: relative;
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

.top-casino-card-available-games-small li:not(:last-child) svg {
    fill: #a2aeb7;
}

.top-casino-card-available-games-small li:not(:last-child).active {
    color: var(--color-text-900);
    text-decoration: none;
}

.top-casino-card-available-games-small li:not(:last-child).active svg {
    fill: var(--color-primary-500);
}

.top-casino-card-available-games-small .link-info {
    font-weight: bold;
    margin-bottom: 8px;
    font-size: 12px;
    line-height: 16px;
    cursor: pointer;
    text-transform: uppercase;
}

.top-casino-card-body {
    margin-top: 8px;
    padding: 16px;
    border-radius: 2px;
    background: #fff;
    display: none;
}

@media (min-width: 768px) {
    .top-casino-card-body {
        padding: 24px;
        grid-template-rows: auto auto auto auto auto;
        grid-template-columns: 1fr 1fr;
        column-gap: 20px;
        grid-template-areas: "warning repStats" "replacablePart repStats" "games games" "languages languages" "payments payments" "divider divider" "none buttons";
    }
}

@media (min-width: 992px) {
    .top-casino-card-body {
        padding: 32px;
    }
}

@media (min-width: 1200px) {
    .top-casino-card-body {
        grid-template-rows: auto auto auto auto auto auto;
        grid-template-columns: 1fr 1fr 1fr;
        column-gap: 32px;
        grid-template-areas: "repStats warning languages" "repStats warning games" "repStats payments games" "replacablePart payments games" "divider divider divider" "none none buttons";
    }
}

.top-casino-card-body.on-dark-bg {
    box-shadow: 0px 24px 48px rgba(0, 0, 0, 0.4);
}

.top-casino-card-body.on-light-bg {
    box-shadow: 0px 4px 8px rgba(29, 39, 48, 0.08);
}

.top-casino-card-body .loader {
    grid-area: payments;
}

.top-casino-card-body .top-casino-card-section {
    margin-bottom: 16px;
}

@media (min-width: 768px) {
    .top-casino-card-body .top-casino-card-section {
        margin-bottom: 24px;
    }
}

@media (min-width: 1200px) {
    .top-casino-card-body .top-casino-card-section {
        margin-bottom: 16px;
    }
}

.top-casino-card-body .rating-item {
    margin: 2px 0;
}

.top-casino-card-body .loader {
    margin: auto;
}

.top-casino-card-body .title-part {
    font-family: "Noto Sans", Sans-Serif;
    display: flex;
    color: var(--color-text-600);
    font-size: 12px;
    line-height: 16px;
    font-weight: 700;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.top-casino-card-body .casino-detail-reputation-details {
    border: 1px solid #cdd6dd;
    padding: 16px;
    margin-top: 8px;
}

.top-casino-card-body .user-score-pills {
    margin: 0 8px 0 0;
}

.top-casino-card-body .buttons-wrapper {
    grid-area: buttons;
    display: flex;
    justify-content: space-between;
    padding-top: 8px;
}

@media (min-width: 568px) {
    .top-casino-card-body .buttons-wrapper {
        padding-top: 16px;
    }
}

.top-casino-card-body .divider {
    grid-area: divider;
    border-top: 1px solid #cdd6dd;
}

@media (min-width: 1200px) {
    .top-casino-card-body .divider {
        margin-top: 16px;
    }
}

.top-casino-card-body .btn-wrapper {
    flex: 0 0 calc(50% - 4px);
    margin-top: auto;
}

.top-casino-card-games-wrapper .casino-game-genre-item:nth-child(n+7) {
    display: none;
}

@media (min-width: 568px) {
    .top-casino-card-games-wrapper .casino-game-genre-item:nth-child(n+7) {
        display: flex;
    }
}

.top-casino-card-games-wrapper .casino-game-genre-item:nth-child(n+11) {
    display: none;
}

@media (min-width: 1200px) {
    .top-casino-card-games-wrapper .casino-game-genre-item:nth-child(n+10) {
        display: none;
    }
}

.top-casino-card-lang-options {
    font-size: 12px;
    line-height: 16px;
    grid-area: languages;
}

.top-casino-card-lang-options ul {
    margin-top: 8px;
}

@media (min-width: 568px) {
    .top-casino-card-lang-options ul {
        display: flex;
        flex-wrap: wrap;
    }
}

.top-casino-card-lang-options li {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-right: 16px;
}

@media (min-width: 768px) {
    .top-casino-card-lang-options li {
        margin-bottom: 8px;
    }
}

@media (min-width: 1200px) {
    .top-casino-card-lang-options li {
        flex: 0 0 100%;
    }
}

.top-casino-card-lang-options .bullet {
    width: 6px;
    height: 6px;
    margin-right: 4px;
    border-radius: 50%;
}

.top-casino-card-lang-options .bullet svg {
    display: none;
}

.top-casino-card-lang-options .flag-icon {
    box-shadow: 0 0 4px rgba(29, 39, 48, 0.48);
    border-radius: 50%;
    width: 14px;
    height: 14px;
}

.top-casino-card-user-reviews {
    grid-area: replacablePart;
    display: flex;
    align-items: flex-end;
}

@media (min-width: 1200px) {
    .top-casino-card-user-reviews {
        align-self: end;
    }
}

.top-casino-card-user-reviews .casino-detail-user-score {
    width: 100%;
}

.top-casino-card-user-reviews .no-reviews {
    font-size: 14px;
    line-height: 18px;
}

@media (min-width: 568px) {
    .top-casino-card-user-reviews .no-reviews {
        font-size: 16px;
        line-height: 24px;
    }
}

.top-casino-card-reputation-details {
    grid-area: repStats;
}

.top-casino-card-pros-and-cons {
    grid-area: warning;
}

.top-casino-card-pros-and-cons .casino-card-list-item {
    display: flex;
    margin-bottom: 8px;
}

.top-casino-card-pros-and-cons .casino-card-list-item:last-child {
    margin-bottom: 0;
}

.top-casino-card-pros-and-cons span {
    display: inline-flex;
}

.top-casino-card-pros-and-cons .casino-card-list-item svg {
    margin: 1px 4px 0 0;
}

.top-casino-card-pros-and-cons .js-pac-toggle {
    display: none;
}

.tooltip-title {
    display: none;
}

.tippy-content .tooltip-title {
    display: flex;
}

.top-casino-card-section .popover-heading-label {
    display: none;
}

.slideable-panel-active .top-casino-card-payments .popover-heading-label {
    display: block;
}

.top-casino-card-payments-tooltip-list {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -2px;
}

.top-casino-card-payments-tooltip-list .casino-card-logos-item {
    width: calc(25% - 4px);
    margin: 2px;
}

.top-casino-card-payment-methods {
    grid-area: payments;
}

@media (min-width: 1200px) {
    .top-casino-card-payment-methods {
        align-self: end;
    }
}

@media (min-width: 768px) {
    .top-casino-card-payment-methods .casino-card-logos-item {
        width: calc(20% - 4px);
    }
}

@media (min-width: 1200px) {
    .top-casino-card-payment-methods .casino-card-logos-item {
        width: calc(25% - 4px);
    }
}

.top-casino-card-payment-methods .casino-card-logos-item:nth-child(n+9) {
    display: none;
}

@media (min-width: 768px) {
    .top-casino-card-payment-methods .casino-card-logos-item:nth-child(n+9) {
        display: block;
    }
}

@media (min-width: 1200px) {
    .top-casino-card-payment-methods .casino-card-logos-item:nth-child(n+9) {
        display: none;
    }
}

@media (min-width: 768px) {
    .top-casino-card-payment-methods .casino-card-logos-item:nth-child(n+11) {
        display: none;
    }
}

.top-casino-card-available-games {
    grid-area: games;
}

@media (min-width: 1200px) {
    .top-casino-card-available-games {
        align-self: end;
    }
}

.top-casino-card-available-games .casino-game-genre-item {
    flex-direction: column;
}

@media (min-width: 568px) {
    .top-casino-card-available-games .casino-game-genre-item {
        flex: 1 0 calc(20% - 8px);
        max-width: 20%;
    }
}

@media (min-width: 1200px) {
    .top-casino-card-available-games .casino-game-genre-item {
        flex: 1 0 calc(33.3% - 8px);
        max-width: 33.3333%;
    }
}

.top-casino-card-available-games .game-genre-icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

@media (min-width: 768px) {
    .top-casino-card-available-games .casino-game-genre-items-ul {
        flex-wrap: wrap;
        overflow: visible;
    }
}

.game-tournament-detail .top-casino-card-wrapper {
    max-width: 100%;
}

.casino-card-content .warning-danger {
    padding: 8px;
    border: 1px solid var(--color-ui-error-red);
    margin: 0;
}

.info-box {
    border: 1px solid transparent;
    padding: 8px;
    display: flex;
    align-items: center;
    border-radius: 2px;
    color: var(--color-text-900);
    text-align: left;
}

@media (min-width: 768px) {
    .info-box {
        padding: 16px;
    }
}

.info-box .ico-type {
    margin-right: 16px;
}

.info-box .ico-type svg {
    display: block;
}

.bonus-info-row-description .warnings {
    width: calc(100% + 28px);
    margin-left: -28px;
    margin-top: 16px;
}

@media (min-width: 568px) {
    .bonus-info-row-description .warnings {
        width: calc(100% + 32px);
        margin-left: -32px;
    }
}

.bonus-info-row-description .warning {
    margin: 0;
    padding: 0;
    border: none;
    background: none;
    color: #000;
    margin-bottom: 10px;
}

.bonus-info-row-description .warning:last-of-type {
    margin-bottom: 0;
}

.bonus-info-row-description .warning .icon {
    width: 20px;
    height: 20px;
}

@media (min-width: 568px) {
    .bonus-info-row-description .warning .icon {
        width: 24px;
        height: 24px;
    }
}

.bonus-info-row-description .warning .title {
    font-size: 14px;
    font-weight: bold;
}

@media (min-width: 568px) {
    .bonus-info-row-description .warning .title {
        font-size: 16px;
    }
}

.bonus-info-row-description .warning .description {
    font-size: 14px;
    padding-top: 0;
}

@media (min-width: 992px) {
    .about-us .expandable-box {
        max-width: 970px;
    }
}

.expandable-box-with-ico .ico {
    width: 22px;
    height: 22px;
}

@media (min-width: 568px) {
    .expandable-box-with-ico .ico {
        width: 24px;
        height: 24px;
    }
}

.expandable-box-with-ico strong {
    margin: 0 8px;
}

@media (min-width: 568px) {
    .expandable-box-with-ico strong {
        margin: 0 16px;
    }
}

.expandable-box-with-ico>p {
    padding-left: 30px;
}

@media (min-width: 568px) {
    .expandable-box-with-ico>p {
        padding-left: 38px;
    }
}

.expandable-box-new-hp {
    max-width: unset;
}

.sp-card.green .btn {
    background: var(--color-primary-500);
    color: #fff;
}

.sp-card.green .btn:hover {
    background: var(--color-primary-600);
}

.sp-card.purple .btn {
    background: var(--color-secondary-800);
    color: #fff;
}

.sp-card.purple .btn:hover {
    background: var(--color-secondary-900);
}

.sp-card.se {
    background: linear-gradient(91deg, #3D573F -13.28%, #B0CFB3 130.98%);
}

.sp-card.se .sp-description,
.sp-card.se .sp-title {
    color: #fff;
}

.sp-card.se .btn {
    border: 2px solid #2D492F;
    background: #FFF;
    color: #2D492F;
}

.sp-card .sp-title:hover {
    text-decoration: underline;
}

.sp-card .read-more {
    font-size: 16px;
    color: var(--color-text-600);
}

.sp-card .read-more svg {
    fill: var(--color-text-600);
}

.sp-card .read-more:hover {
    color: var(--color-text-900);
}

.sp-card .read-more:hover svg {
    fill: var(--color-text-900);
}

.sp-card .read-minutes {
    color: var(--color-text-600);
}

.sp-card .read-minutes svg {
    fill: var(--color-text-600);
}

.sp-carousel-card-dark {
    background: var(--color-bg-800);
    color: #E3E7EF;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.sp-carousel-card-dark .bottom-actions {
    border-top: 1px solid var(--color-bg-600);
}

.sp-carousel-card-dark .sp-title {
    color: #F0F3F7;
}

.sp-carousel-card-dark .read-more {
    color: var(--color-primary-500);
}

.sp-carousel-card-dark .read-more svg {
    fill: var(--color-primary-500);
}

.sp-carousel-card-dark .read-more:hover {
    color: var(--color-primary-500);
    text-decoration: underline;
}

.sp-carousel-card-dark .read-more:hover svg {
    fill: var(--color-primary-500);
}

.sp-carousel-card-dark .read-minutes {
    color: #F0F3F7;
}

.sp-carousel-card-dark .read-minutes svg {
    fill: #F0F3F7;
}

.top-rated-card-image {
    max-height: 160px;
    overflow: hidden;
}

.content-widget-pad {
    margin: 16px 0;
}

@media (min-width: 768px) {
    .content-widget-pad {
        margin: 24px 0;
    }
}

@media (min-width: 768px) {
    .content-widget-pad {
        margin: 32px 0;
    }
}

@media (min-width: 992px) {
    .two-row-two-card-wrapper .show-more {
        margin-right: 0px;
    }
}

@media (min-width: 992px) {
    .two-row-two-card-wrapper.slider-enabled .show-more {
        margin-right: 80px;
    }
}

.two-row-two-card-wrapper .card-mini-wrapper {
    flex: 1 0 92%;
    max-width: 310px;
}

@media (min-width: 768px) {
    .two-row-two-card-wrapper .card-mini-wrapper {
        flex: 1 0 45%;
        max-width: none;
    }
}

@media (min-width: 992px) {
    .two-row-two-card-wrapper .card-mini-wrapper {
        flex: 0 0 calc(50% - 24px / 2);
        width: calc(50% - 24px / 2);
    }
}

@keyframes clock-ticking {
    0% {
        -webkit-transform: rotate(0deg) translate3d(0px, -50%, 0px);
        transform: rotate(0deg) translate3d(0px, -50%, 0px);
    }

    100% {
        -webkit-transform: rotate(360deg) translate3d(0px, -50%, 0px);
        transform: rotate(360deg) translate3d(0px, -50%, 0px);
    }
}

.widget-important-things a,
.widget-faq a {
    color: var(--color-text-900);
    font-weight: bold;
    text-decoration: underline;
}

@media (min-width: 992px) {

    .widget-important-things a:hover,
    .widget-faq a:hover {
        text-decoration: none;
    }
}

.widget-hours-spent {
    background: #9dcd64;
    font-family: "neo-sans", sans-serif;
    text-align: center;
    padding: 40px 0 40px;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    overflow: hidden;
}

@media (min-width: 568px) {
    .widget-hours-spent {
        padding: 10px 0;
    }
}

.widget-hours-spent img {
    max-height: 100%;
}

.widget-hours-spent svg {
    display: none;
}

@media (min-width: 992px) {
    .widget-hours-spent svg {
        display: block;
        margin: 10px auto;
    }
}

.widget-hours-spent .img-1 {
    display: none;
}

@media (min-width: 568px) {
    .widget-hours-spent .img-1 {
        display: flex;
        justify-content: flex-end;
        flex: 1 0 200px;
        overflow: hidden;
        height: 260px;
    }
}

@media (min-width: 768px) {
    .widget-hours-spent .img-1 {
        flex: 0 1 600px;
        max-width: 100%;
        margin: 30px 0 10px;
    }
}

@media (min-width: 992px) {
    .widget-hours-spent .img-1 {
        height: auto;
        max-height: 400px;
        margin: 20px 0;
    }
}

.widget-hours-spent .img-2 {
    display: none;
}

@media (min-width: 568px) {
    .widget-hours-spent .img-2 {
        display: flex;
        flex: 1 0 200px;
        overflow: hidden;
        height: 260px;
    }
}

@media (min-width: 768px) {
    .widget-hours-spent .img-2 {
        flex: 0 1 600px;
        max-width: 100%;
        margin: 30px 0 10px;
    }
}

@media (min-width: 992px) {
    .widget-hours-spent .img-2 {
        height: auto;
        max-height: 400px;
        margin: 20px 0;
    }
}

@media (min-width: 568px) {
    .widget-hours-spent .text {
        flex: 0 0 300px;
    }
}

@media (min-width: 768px) {
    .widget-hours-spent .text {
        flex: 0 0 400px;
        line-height: 80px;
    }
}

.widget-hours-spent h3 {
    font-size: 34px;
    font-weight: 700;
    margin: auto;
    color: white;
}

@media (min-width: 768px) {
    .widget-hours-spent h3 {
        font-size: 60px;
        margin-top: 30px;
    }
}

.widget-hours-spent p {
    font-size: 14px;
    line-height: 18px;
    color: white;
    margin: 10px auto;
    padding: 0 20px;
}

@media (min-width: 768px) {
    .widget-hours-spent p {
        padding: 0;
        margin: 10px auto;
        max-width: 450px;
        font-size: 31px;
        line-height: 34px;
    }
}

.widget-hours-spent .clock-tick {
    display: none;
}

@media (min-width: 992px) {
    .widget-hours-spent .clock-tick {
        display: block;
        height: 23px;
        width: 1px;
        position: absolute;
        left: 50%;
        top: 23px;
        background: white;
        -webkit-animation: clock-ticking 60s linear infinite;
        animation: clock-ticking 60s linear infinite;
    }
}

.widget-usage-reasons .reason-items {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

@media (min-width: 568px) {
    .widget-usage-reasons .reason-items {
        flex-direction: row;
        flex-wrap: wrap;
    }
}

@media (min-width: 1200px) {
    .widget-usage-reasons .reason-items {
        gap: 24px;
    }
}

.widget-usage-reasons .reason-item {
    border-radius: 2px;
    background: white;
    padding: 24px;
    overflow: hidden;
    box-shadow: 0 16px 16px -16px rgba(0, 0, 0, 0.24);
}

@media (min-width: 568px) {
    .widget-usage-reasons .reason-item {
        flex: 1 0 calc(50% - 8px);
        width: calc(50% - 8px);
    }
}

@media (min-width: 1200px) {
    .widget-usage-reasons .reason-item {
        flex: 1 0 calc(50% - 12px);
        width: calc(50% - 12);
    }
}

@media (min-width: 568px) {
    .widget-usage-reasons h3 {
        margin-bottom: 24px;
    }
}

@media (min-width: 992px) {
    .widget-usage-reasons h3 {
        margin-bottom: 32px;
    }
}

.widget-usage-reasons svg {
    fill: var(--color-text-600);
    display: block;
    margin-left: auto;
    flex: 0 0 32px;
}

@media (min-width: 768px) {
    .widget-usage-reasons svg {
        width: 40px;
        height: 40px;
        flex: 0 0 40px;
    }
}

.widget-usage-reasons .reason-header {
    display: flex;
    gap: 16px;
    margin-bottom: 16px;
}

@media (min-width: 768px) {
    .widget-usage-reasons .reason-header {
        gap: 24px;
    }
}

.widget-usage-reasons h4 {
    font-family: "neo-sans", sans-serif;
    font-weight: 700;
    font-size: 18px;
    color: var(--color-text-900);
    line-height: 24px;
}

@media (min-width: 768px) {
    .widget-usage-reasons h4 {
        font-size: 20px;
        line-height: 26px;
        max-width: none;
    }
}

@media (min-width: 992px) {
    .widget-usage-reasons h4 {
        font-size: 22px;
        line-height: 28px;
        max-width: none;
    }
}

.widget-usage-reasons p {
    color: var(--color-text-900);
    font-size: 16px;
    line-height: 24px;
}

.widget-rating-explanation .desc {
    font-size: 16px;
    color: var(--color-text-600);
    max-width: 700px;
    margin: 20px auto 0;
    text-align: center;
}

.rating-explanation-circle {
    border-radius: 50%;
    position: relative;
    width: 230px;
    height: 230px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "neo-sans", sans-serif;
    text-align: center;
    margin: 40px auto 20px;
    overflow: hidden;
}

.rating-explanation-circle .inside {
    width: calc(100% - 30px);
    height: calc(100% - 30px);
    border-radius: 50%;
    background: #e5e8e9;
    background: linear-gradient(135deg, #e5e8e9 0%, #f3f7f8 100%);
    position: relative;
    box-shadow: 9px 7px 12px 0px #0000003b;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0 20px;
}

.rating-explanation-circle .inside .flag-icon {
    width: 40px;
    height: 40px;
}

.rating-explanation-circle .inside-border {
    content: "";
    border-radius: 50%;
    border-width: 4px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-style: dotted;
    border-top-color: var(--color-secondary-800);
    border-right-color: var(--color-secondary-800);
    border-bottom-color: var(--color-primary-500);
    border-left-color: var(--color-primary-500);
    transform: rotateZ(-45deg);
}

.rating-explanation-circle .rating b {
    font-size: 30px;
    font-weight: 700;
}

.rating-explanation-circle label {
    font-weight: 700;
    font-size: 18px;
    line-height: 20px;
}

@media (min-width: 992px) {
    .rating-explanation-table-wrapper {
        margin-bottom: 30px;
        display: flex;
    }
}

.rating-explanation-table {
    border-top: 10px solid var(--color-primary-500);
    background: white;
    padding: 25px 25px 5px;
    flex: 1;
}

@media (min-width: 768px) {
    .rating-explanation-table {
        padding: 45px 45px 5px;
    }
}

@media (min-width: 992px) {
    .rating-explanation-table {
        padding: 45px 25px 5px;
    }
}

.rating-explanation-table.left {
    margin-right: auto;
}

@media (min-width: 992px) {
    .rating-explanation-table.left {
        margin-right: 40px;
    }
}

.rating-explanation-table:last-child {
    border-top-color: 10px solid var(--color-secondary-800);
}

.rating-explanation-table.right {
    border-color: var(--color-secondary-800);
}

.rating-explanation-table.right .svg-circle {
    background: var(--color-secondary-800);
}

.rating-explanation-table .svg-circle {
    border-radius: 50%;
    width: 80px;
    height: 80px;
    background: #81CD15;
    padding: 15px;
    margin-right: 20px;
    flex-shrink: 0;
}

.rating-explanation-table img {
    flex-shrink: 0;
    margin: 0 0 10px 0;
}

@media (min-width: 768px) {
    .rating-explanation-table img {
        margin-right: 20px;
    }
}

.rating-explanation-table svg {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
}

.rating-explanation-table li {
    margin: 0 0 45px 0;
    text-align: center;
}

@media (min-width: 768px) {
    .rating-explanation-table li {
        display: flex;
        text-align: left;
    }
}

.rating-explanation-table h4 {
    margin: 0 0 10px 0;
    font-size: 18px;
    line-height: 22px;
    font-family: "neo-sans", sans-serif;
    font-weight: 700;
}

.rating-explanation-table p {
    font-size: 14px;
    line-height: 16px;
}

.rating-explanation-table-name {
    font-family: "neo-sans", sans-serif;
    font-weight: 700;
    text-align: center;
    margin: 20px 0;
    font-size: 22px;
    line-height: 24px;
}

@media (min-width: 768px) {
    .rating-explanation-table-name {
        font-size: 37px;
        line-height: 40px;
        margin: 30px 0;
    }
}

@media (min-width: 992px) {
    .rating-explanation-table-name {
        display: none;
    }
}

.rating-explanation-arrow svg {
    fill: #7B8C98;
    display: block;
    margin: 0 auto -10px;
}

.rating-explanation-arrow:after {
    width: 2px;
    height: 60px;
    background: #7B8C98;
    content: "";
    margin: auto;
    display: block;
}

.rating-explanation-heading {
    display: flex;
    color: var(--color-primary-500);
    position: relative;
    padding-top: 30px;
    margin: 0 0 20px 0;
}

.rating-explanation-heading h3 {
    flex: 1;
    position: relative;
    padding-top: 10px;
    font-size: 16px;
    line-height: 20px;
    font-family: "neo-sans", sans-serif;
    font-weight: 700;
    text-align: left;
}

@media (min-width: 768px) {
    .rating-explanation-heading h3 {
        font-size: 37px;
        line-height: 40px;
    }
}

@media (min-width: 992px) {
    .rating-explanation-heading h3 {
        text-align: center;
    }
}

.rating-explanation-heading h3:after {
    content: "";
    position: absolute;
    top: -30px;
    left: 10%;
    width: 2px;
    height: 30px;
    background: #a2aeb7;
}

@media (min-width: 992px) {
    .rating-explanation-heading h3:after {
        left: 50%;
    }
}

.rating-explanation-heading h3:before {
    content: "";
    position: absolute;
    top: -30px;
    right: 0;
    width: 90%;
    height: 2px;
    background: #a2aeb7;
}

@media (min-width: 992px) {
    .rating-explanation-heading h3:before {
        width: 50%;
    }
}

.rating-explanation-heading h3.right {
    color: var(--color-secondary-800);
    text-align: right;
    padding-right: 20px;
}

@media (min-width: 992px) {
    .rating-explanation-heading h3.right {
        text-align: center;
        padding-right: 0;
    }
}

.rating-explanation-heading h3.right:before {
    right: auto;
    left: 0;
}

.rating-explanation-heading h3.right:after {
    left: 90%;
}

@media (min-width: 992px) {
    .rating-explanation-heading h3.right:after {
        left: 50%;
    }
}

.rating-explanation-heading h3.left {
    padding-left: 20px;
    text-align: left;
}

@media (min-width: 992px) {
    .rating-explanation-heading h3.left {
        padding-left: 0;
        text-align: center;
    }
}

.rating-explanation-heading .plus {
    flex: 0 0 40px;
    position: relative;
    text-align: center;
    font-family: "neo-sans", sans-serif;
    font-weight: 700;
    color: #7B8C98;
    font-size: 40px;
}

.rating-explanation-heading .plus:before {
    content: "";
    position: absolute;
    top: -30px;
    right: 0;
    width: 100%;
    height: 2px;
    background: #a2aeb7;
}

.widget-jackpots {
    background: url("../images/casino-list/jackpot-bg.jpg") no-repeat;
    background-size: cover;
    background-position: center;
}

.widget-important-things {
    max-width: 832px;
}

.widget-important-things .neo-fs-28 {
    margin-bottom: 12px;
}

@media (min-width: 568px) {
    .widget-important-things .neo-fs-28 {
        margin-bottom: 16px;
    }
}

@media (min-width: 992px) {
    .widget-important-things .neo-fs-28 {
        margin-bottom: 24px;
    }
}

.widget-important-things .homepage-desc {
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 16px;
}

@media (min-width: 568px) {
    .widget-important-things .homepage-desc {
        margin-bottom: 24px;
    }
}

@media (min-width: 992px) {
    .widget-important-things .homepage-desc {
        margin-bottom: 32px;
    }
}

.important-things-item {
    background: white;
    position: relative;
    padding: 16px;
    box-shadow: 0 16px 16px -16px rgba(0, 0, 0, 0.24);
    border-radius: 2px;
}

.important-things-item:not(:last-child) {
    margin: 0 0 8px 0;
}

@media (min-width: 568px) {
    .important-things-item {
        padding: 24px;
    }
}

.important-things-item .important-things-title-wrapper {
    display: flex;
    align-items: center;
    gap: 12px;
}

.important-things-item h3 {
    font-family: "neo-sans", sans-serif;
    font-weight: 700;
    font-size: 16px;
    line-height: 20px;
    color: var(--color-text-900);
}

@media (min-width: 568px) {
    .important-things-item h3 {
        font-size: 18px;
        line-height: 22px;
    }
}

.important-things-item p {
    font-size: 14px;
    line-height: 20px;
    color: var(--color-text-900);
    margin-top: 12px;
}

@media (min-width: 568px) {
    .important-things-item p {
        margin-top: 16px;
    }
}

@media (min-width: 992px) {
    .important-things-item p {
        font-size: 16px;
        line-height: 22px;
    }
}

.important-things-item ol {
    margin: 20px 0 20px 20px;
    font-size: 16px;
    color: var(--color-text-900);
}

.important-things-item ol li {
    margin: 16px 0;
    list-style-type: decimal;
}

.important-things-item .read-more,
.important-things-item .read-less {
    font-size: 16px;
    cursor: pointer;
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
    justify-content: flex-end;
    font-weight: bold;
    gap: 8px;
    margin-top: 12px;
}

@media (min-width: 568px) {

    .important-things-item .read-more,
    .important-things-item .read-less {
        margin-top: 16px;
    }
}

@media (min-width: 992px) {

    .important-things-item .read-more:hover,
    .important-things-item .read-less:hover {
        text-decoration: underline;
    }
}

.important-things-item .read-more svg,
.important-things-item .read-less svg {
    width: 18px;
    height: 18px;
}

.important-things-item .read-less {
    display: none;
}

.important-things-item.toggle .toggle-hidden {
    display: block;
}

.important-things-item.toggle .read-less {
    display: flex;
}

.important-things-item.toggle .read-more {
    display: none;
}

.important-things-item .toggle-hidden {
    display: none;
}

.guide-cards {
    align-items: center;
    margin: 8px 0;
}

@media (min-width: 992px) {
    .guide-cards {
        margin: 24px 0;
    }
}

.guide-slider-scroll-wrapper {
    position: relative;
    overflow-x: hidden;
}

@media (min-width: 992px) {
    .guide-slider-scroll-wrapper {
        height: auto;
        overflow: visible;
    }
}

.widget-guides {
    margin-top: 20px;
}

.widget-guides .guide-card-wrapper {
    padding: 0 10px 0 0;
    transition: transform 0.3s ease-in-out;
    flex: 0 0 60%;
    display: inline-block;
}

@media (min-width: 568px) {
    .widget-guides .guide-card-wrapper {
        flex: 0 0 33.333%;
        width: 33.33%;
    }
}

@media (min-width: 992px) {
    .widget-guides .guide-card-wrapper {
        padding: 15px 15px;
    }
}

.widget-guides .guide-card-wrapper:hover {
    transform: scale(1.1);
    transform-origin: center center;
}

.widget-guides .guide-card {
    display: flex;
    align-items: center;
    font-family: "neo-sans", sans-serif;
    font-weight: 700;
    font-size: 22px;
    line-height: 26px;
    background: #F0F3F7;
    height: 80px;
    padding: 0 5px;
    justify-content: center;
    margin-right: 30px;
    color: var(--color-text-900);
}

@media (min-width: 992px) {
    .widget-guides .guide-card {
        height: 150px;
        padding: 0 20px;
    }
}

.widget-guides .guide-card:last-child {
    margin-right: 0;
}

.widget-guides .guide-card svg {
    width: 50px;
    height: 40px;
    flex-shrink: 0;
}

.widget-guides .guide-card h3 {
    white-space: normal;
    font-size: 14px;
    line-height: 18px;
}

@media (min-width: 992px) {
    .widget-guides .guide-card h3 {
        font-size: 22px;
        line-height: 26px;
    }
}

.guide-slider {
    overflow-x: scroll;
    white-space: nowrap;
    position: relative;
    -webkit-overflow-scrolling: touch;
    display: flex;
    padding: 10px 0;
}

@media (max-width: 767px) {
    .guide-slider {
        -webkit-overflow-scrolling: touch;
    }
}

@media (min-width: 992px) {
    .guide-slider {
        display: block;
        height: auto;
        overflow-x: visible;
        padding: 0;
    }
}

.guide-slider .game-item {
    width: 210px;
    padding: 20px 5px 0;
}

.guide-slider .game-item:hover {
    z-index: 3;
}

.guide-slider .game-item:hover .game-item-overlay {
    opacity: 1;
}

.guide-slider .game-item:hover .game-item-img {
    box-shadow: 0 0 20px black;
    transform: scale(1.07);
}

.guide-slider .flickity-button {
    top: -35px;
}

.widget-faq {
    padding: 0 12px;
    margin: 0 auto 32px auto;
    max-width: 832px;
}

@media (min-width: 1200px) {
    .best-casino-row {
        border-width: 3px;
        border-style: solid;
    }
}

.best-casino-row-arrow {
    display: block;
    width: 100%;
    height: 20px;
    max-width: 1170px;
    position: relative;
    top: -1px;
}

@media (min-width: 992px) {
    .best-casino-row-arrow {
        height: 25px;
    }
}

/*.responsive-table {
    width: 100%;
    overflow-x: auto;
    text-align: left;
    table {
        left: auto;
        td,th {
            @include bp(rev-mobile-landscape) {
                font-size: smaller;
            }
        }
    }
}*/
.purple-shadow:after {
    content: "";
    position: absolute;
    opacity: 0.4;
    filter: blur(60px);
    background: #9539C799;
    z-index: 0;
}

.green-shadow:before {
    content: "";
    position: absolute;
    opacity: 0.4;
    filter: blur(60px);
    background: #44BE4C;
    z-index: 0;
    transform: rotate(-45deg);
}

.author-widget-shadows:before {
    width: 80px;
    height: 325px;
    bottom: -200px;
    right: -50px;
}

@media (min-width: 568px) {
    .author-widget-shadows:before {
        width: 100px;
        height: 400px;
        right: -60px;
        bottom: -250px;
    }
}

@media (min-width: 992px) {
    .author-widget-shadows:before {
        width: 120px;
        height: 488px;
        bottom: -300px;
    }
}

.author-widget-shadows:after {
    width: 140px;
    height: 140px;
    left: -100px;
    top: -100px;
}

@media (min-width: 568px) {
    .author-widget-shadows:after {
        left: -125px;
        top: -125px;
        width: 180px;
        height: 180px;
    }
}

@media (min-width: 992px) {
    .author-widget-shadows:after {
        width: 220px;
        height: 220px;
    }
}

.author-widget-shadows .read-more {
    display: flex;
    gap: 8px;
    align-items: center;
    font-weight: bold;
    margin-top: 12px;
    color: var(--color-text-900);
}

.author-widget-shadows .read-more:hover {
    text-decoration: underline;
    color: var(--color-text-900);
}

@media (min-width: 568px) {
    .author-widget-shadows .read-more {
        margin-top: 16px;
    }
}

@media (min-width: 992px) {
    .author-widget-shadows .read-more {
        margin-top: 24px;
    }
}

.dynamic-author-widget {
    position: relative;
    overflow: hidden;
    margin-bottom: 1.4em;
    display: grid;
    grid-template-columns: 64px auto;
    gap: 24px 8px;
    grid-template-areas: "image header" "content content";
    padding: 24px;
    background: linear-gradient(90.45deg, #F8F8FA 0.03%, #FFFFFF 100%);
    box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.08);
    border-radius: 2px;
    border: 2px solid #FFF;
}

@media (min-width: 568px) {
    .dynamic-author-widget {
        padding: 32px;
        gap: 24px 32px;
        grid-template-columns: auto 90px;
        grid-template-areas: "header header" "content image";
    }
}

@media (min-width: 992px) {
    .dynamic-author-widget {
        gap: 24px 48px;
        padding: 48px;
    }
}

@media (min-width: 568px) {
    .dynamic-author-widget .check-badge {
        width: 26px;
        height: 26px;
    }
}

@media (min-width: 992px) {
    .dynamic-author-widget .check-badge {
        width: 30px;
        height: 30px;
    }
}

.dynamic-author-widget .about-author-desc {
    font-family: "Noto Sans", Sans-Serif;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 20px;
    grid-area: content;
    z-index: 5;
}

@media (min-width: 568px) {
    .dynamic-author-widget .about-author-desc {
        font-size: 16px;
        line-height: 22px;
    }
}

.dynamic-author-widget a {
    display: inline-flex;
}

.dynamic-author-widget .auth-header {
    z-index: 5;
    grid-area: header;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.dynamic-author-widget .avatar {
    width: 64px;
    height: 64px;
    border-radius: 80px;
    border: 2px solid #FFF;
    box-shadow: 0px 24px 20px -16px rgba(0, 0, 0, 0.16);
}

@media (min-width: 568px) {
    .dynamic-author-widget .avatar {
        width: 90px;
        height: 90px;
    }
}

.dynamic-author-widget .image-wrapper {
    grid-area: image;
    margin: auto;
    z-index: 5;
    position: relative;
    display: flex;
    align-items: center;
}

.dynamic-author-widget .avatar-photo {
    width: 80px;
    height: 80px;
    object-fit: cover;
    box-shadow: inset 0 -20px 20px -10px rgba(255, 255, 255, 0.5);
}

@media (min-width: 568px) {
    .dynamic-author-widget .avatar-photo {
        width: 204px;
        height: 204px;
    }
}

@media (min-width: 992px) {
    .dynamic-author-widget .avatar-photo {
        width: 250px;
        height: 250px;
    }
}

.dynamic-author-widget .user-position {
    font-family: "Noto Sans", Sans-Serif;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 20px;
}

@media (min-width: 992px) {
    .dynamic-author-widget .user-position {
        font-size: 16px;
        line-height: 22px;
    }
}

.dynamic-author-widget .icons-wrapper {
    display: flex;
    gap: 8px;
}

@media (min-width: 568px) {
    .dynamic-author-widget .icons-wrapper {
        position: absolute;
        top: 0;
        right: 0;
    }
}

.dynamic-author-widget .icons-wrapper a {
    margin-top: 8px;
}

@media (min-width: 568px) {
    .dynamic-author-widget .icons-wrapper a {
        margin-top: 0;
    }
}

@media (min-width: 568px) {
    .dynamic-author-widget .icons-wrapper svg {
        width: 24px;
        height: 24px;
    }
}

@media (min-width: 992px) {
    .dynamic-author-widget .icons-wrapper svg {
        width: 28px;
        height: 28px;
    }
}

.dynamic-author-widget-photo-layout {
    grid-template-columns: 80px auto;
}

@media (min-width: 568px) {
    .dynamic-author-widget-photo-layout {
        grid-template-columns: auto 172px;
    }
}

@media (min-width: 992px) {
    .dynamic-author-widget-photo-layout {
        grid-template-columns: auto 180px;
    }
}

@media (min-width: 568px) {
    .dynamic-author-widget-photo-layout .image-wrapper-photo {
        position: absolute;
        bottom: -32px;
        right: -32px;
    }
}

@media (min-width: 992px) {
    .dynamic-author-widget-photo-layout .image-wrapper-photo {
        bottom: -48px;
        right: -48px;
    }
}

@media (min-width: 568px) {
    .dynamic-quote-author-widget {
        padding: 32px;
        gap: 24px 12px;
        grid-template-columns: 64px auto;
        grid-template-areas: "image header" "content content";
    }
}

@media (min-width: 992px) {
    .dynamic-quote-author-widget {
        gap: 32px 16px;
        padding: 48px;
        grid-template-columns: 64px auto;
    }
}

.dynamic-quote-author-widget .avatar {
    width: 64px !important;
    height: 64px !important;
    border-radius: 100px;
    border: 2px solid var(--color-primary-500);
}

.dynamic-quote-author-widget .quotes {
    position: absolute;
    inset: 0;
}

.dynamic-quote-author-widget .quotes:before,
.dynamic-quote-author-widget .quotes:after {
    content: "";
    position: absolute;
    background: url("../images/svg/quote-bg.svg") no-repeat;
    width: 46px;
    height: 46px;
    z-index: 2;
}

.dynamic-quote-author-widget .quotes:before {
    left: 0;
    top: 4px;
    transform: rotate(-20deg);
}

.dynamic-quote-author-widget .quotes:after {
    right: 0;
    bottom: 0;
}

.blacklisted-casinos-widget {
    border-top: 1px solid #cdd6dd;
    border-bottom: 1px solid #cdd6dd;
    padding-top: 16px;
    padding-bottom: 16px;
}

@media (min-width: 568px) {
    .blacklisted-casinos-widget {
        padding-top: 24px;
        padding-bottom: 24px;
    }
}

@media (min-width: 992px) {
    .blacklisted-casinos-widget {
        padding-top: 32px;
        padding-bottom: 32px;
    }
}

.blacklisted-casinos-widget h3 {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.blacklisted-casinos-widget .desc {
    max-width: 600px;
}

.blacklisted-casinos {
    white-space: nowrap;
    overflow: hidden;
    display: flex;
    overflow-x: auto;
    width: calc(100% + 24px);
}

@media (min-width: 568px) {
    .blacklisted-casinos {
        width: calc(100% + 32px);
    }
}

@media (min-width: 768px) {
    .blacklisted-casinos {
        width: calc(100% + 32px);
        padding: 0 16px;
        left: -16px;
    }
}

@media (min-width: 992px) {
    .blacklisted-casinos {
        width: auto;
        padding: 0;
        left: auto;
        overflow-x: hidden;
    }
}

.casino-card-blacklist {
    display: flex;
    min-width: 200px;
    max-width: 280px;
    flex-direction: column;
    border-radius: 2px;
    background: white;
    box-shadow: 0px 4px 8px 0px rgba(29, 39, 48, 0.08);
    flex: 1 0 220px;
    padding: 4px;
    margin-right: 12px;
    margin-bottom: 8px;
}

@media (min-width: 568px) {
    .casino-card-blacklist {
        min-width: 250px;
    }
}

@media (min-width: 992px) {
    .casino-card-blacklist {
        margin-bottom: 16px;
        margin-right: 16px;
        max-width: none;
        min-width: 0;
        width: calc(33.333% - 12px);
        flex: 0 0 calc(33.333% - 12px);
    }
}

@media (min-width: 1200px) {
    .casino-card-blacklist {
        margin-right: 24px;
        width: calc(33.333% - 18px);
        flex: 0 0 calc(33.333% - 18px);
    }
}

.casino-card-blacklist h5 {
    flex: 1;
    white-space: normal;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
}

.casino-card-blacklist .safety-index {
    justify-content: center;
}

.casino-card-blacklist .blacklist-tags {
    border-top: 1px solid #E3E7EF;
    padding: 12px 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
}

.casino-card-blacklist .img-wrapper {
    border-radius: 2px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    filter: grayscale(100%);
    background: #595959;
}

.casino-card-blacklist .img-wrapper img {
    display: block;
}

.casino-card-blacklist .card-body {
    padding-top: 12px;
    display: flex;
    gap: 12px;
    flex-direction: column;
}

.btn-show-all-bottom {
    margin-top: 12px;
    min-width: 240px;
}

.games-content-carousel .btn-show-all-bottom {
    color: #fff;
}

.games-content-carousel .btn-show-all-bottom:hover {
    color: #fff;
    text-decoration: none;
}

.games-content-carousel .game-item {
    width: 150px;
    flex: 0 0 150px;
    padding: 0 12px 0 0;
}

@media (min-width: 568px) {
    .games-content-carousel .game-item {
        width: 190px;
        flex: 0 0 190px;
        padding: 0 16px 0 0;
    }
}

@media (min-width: 992px) {
    .games-content-carousel .game-item {
        padding: 0 0 12px 0;
        margin-right: 16px;
        width: calc(25% - 10px);
    }
}

@media (min-width: 1200px) {
    .games-content-carousel .game-item {
        margin-right: 24px;
        width: calc(25% - 18px);
    }
}

.games-content-carousel .game-item:hover .game-item-name,
.games-content-carousel .game-item:hover .game-item-name span {
    color: initial;
}

.games-content-carousel .game-item-img:before {
    padding-bottom: 190px;
}

@media (min-width: 992px) {
    .games-content-carousel .game-item-img:before {
        padding-bottom: 245px;
    }
}

.games-content-carousel .game-item-name {
    font-size: 14px;
    line-height: 18px;
    color: var(--color-ui-black);
    font-weight: 700;
    white-space: normal;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    max-height: 36px;
}

@media (min-width: 568px) {
    .games-content-carousel .game-item-name {
        font-size: 16px;
        line-height: 20px;
        max-height: 40px;
    }
}

.games-content-carousel .game-item-name span {
    color: #7B8C98;
    font-weight: normal;
}

.widget-stepper .flickity-button,
.widget-stepper .flickity-page-dots {
    display: none;
}

@media (min-width: 992px) {

    .widget-stepper .flickity-button,
    .widget-stepper .flickity-page-dots {
        display: flex;
    }
}

@media (max-width: 991px) {
    .widget-stepper .flickity-viewport {
        overflow: visible;
    }
}

.widget-stepper .step-item-wrapper {
    display: flex;
    min-height: 100%;
    overflow: visible;
    padding: 8px 10px 16px;
    flex: 1 0 auto;
    max-width: 300px;
}

.widget-stepper .step-item-wrapper.is-selected .step-item {
    transform: scale(1.05);
}

@media (min-width: 992px) {
    .widget-stepper .step-item-wrapper {
        padding: 20px 10px 24px 8px;
    }
}

@media (min-width: 1200px) {
    .widget-stepper .step-item-wrapper {
        padding: 12px 12px 24px 12px;
    }
}

.widget-stepper .step-item {
    transition: transform 0.2s ease-in-out;
    position: relative;
    overflow: hidden;
    padding: 16px;
    width: 100%;
    border-radius: 2px;
    border: 2px solid #FFF;
    white-space: wrap;
    background: #FFF;
    box-shadow: 0 16px 16px -16px rgba(0, 0, 0, 0.24);
}

.widget-stepper .step-item svg {
    position: absolute;
    right: 4px;
    top: 4px;
    fill: #fff;
}

.widget-stepper .steps {
    display: flex;
    gap: 16px;
}

@media (min-width: 992px) {

    .widget-stepper .steps:before,
    .widget-stepper .steps:after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        width: 30px;
        z-index: 10;
    }
}

.widget-stepper .steps:before {
    background: linear-gradient(90deg, #F0F3F7 0%, rgba(240, 243, 247, 0) 100%);
    left: 16px;
}

.widget-stepper .steps:after {
    background: linear-gradient(-90deg, #F0F3F7 0%, rgba(240, 243, 247, 0) 100%);
    right: 0;
}

.widget-stepper .steps:has(.previous[disabled=true]):before {
    width: 0;
}

.widget-stepper .steps:has(.next[disabled=true]):after {
    width: 0;
}

.widget-stepper img {
    position: relative;
    width: 100%;
    aspect-ratio: 16/9;
    margin-bottom: 16px;
}

.widget-stepper .img-wrapper:before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 100%);
}

.widget-stepper .step-title {
    display: flex;
    font-family: "neo-sans", sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 22px;
    height: 44px;
    align-items: center;
    margin-bottom: 16px;
}

.widget-stepper .step-number {
    align-self: flex-start;
    margin-right: 8px;
}

.widget-stepper p {
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 0;
}

.widget-stepper .green-shadow:before {
    width: 147px;
    height: 331px;
    left: -171px;
    top: -163px;
}

.pros-cons-widget {
    font-size: 16px;
    line-height: 22px;
    color: var(--color-text-900);
    margin: 24px 0;
}

@media (min-width: 992px) {
    .pros-cons-widget {
        margin: 32px 0;
    }
}

.pros-cons-widget .neo-fs-25 {
    margin-bottom: 12px;
}

@media (min-width: 568px) {
    .pros-cons-widget .neo-fs-25 {
        margin-bottom: 16px;
    }
}

.pros-cons-widget .description {
    margin-bottom: 24px;
}

.pros-cons-widget .pros-and-cons {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

@media (min-width: 768px) {
    .pros-cons-widget .pros-and-cons {
        flex-direction: row;
    }
}

@media (min-width: 992px) {
    .pros-cons-widget .pros-and-cons {
        gap: 32px;
    }
}

.pros-cons-widget .pros svg {
    fill: var(--color-primary-400);
}

.pros-cons-widget .cons svg {
    fill: #ED9C00;
}

.pros-cons-widget .item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.pros-cons-widget .item:not(:last-child) {
    margin-bottom: 12px;
}

.pros-cons-widget .item svg {
    flex: 0 0 18px;
}

.table-wrap {
    overflow: auto;
    margin-bottom: 24px;
}

.table-wrap table {
    min-width: 50vh;
    width: 100%;
    border-collapse: collapse;
    border: 2px solid #fff;
}

.table-wrap table thead th,
.table-wrap table tbody td {
    border: 1px solid #fff;
}

.table-wrap table thead th {
    background-color: #2d8733;
    color: #fff;
    font-weight: 700;
    padding: 10px 12px;
    text-align: center;
    vertical-align: middle;
}

.table-wrap table tbody tr:nth-child(odd) {
    background-color: #fff;
}

.table-wrap table tbody tr:nth-child(even) {
    background-color: #f4f5f8;
}

.table-wrap table tbody td {
    color: #000;
    padding: 10px 12px;
    text-align: center;
    vertical-align: middle;
}

/* Hero image */
.page-header-img {
    border-radius: 12px;
    overflow: hidden;
    margin: 12px;
}

@media (min-width: 568px) {
    .page-header-img {
        margin: 16px;
    }
}

@media (min-width: 768px) {
    .page-header-img {
        border-radius: 16px;
        margin: 16px 16px 16px 0;
    }
}

.menu-logo img {
    margin: auto 0;
}

.menu-logo {
    display: flex;
    align-items: center;
}

.section-dark {
    margin-bottom: 36px;
}

.game-item.touch-active .game-item-overlay {
    opacity: 1;
    visibility: visible;
}