/* Minification failed. Returning unminified contents.
(3115,15): run-time error CSS1030: Expected identifier, found '.'
(3115,26): run-time error CSS1031: Expected selector, found ')'
(3115,26): run-time error CSS1025: Expected comma or open brace, found ')'
(3119,19): run-time error CSS1030: Expected identifier, found '.'
(3119,30): run-time error CSS1031: Expected selector, found ')'
(3119,30): run-time error CSS1025: Expected comma or open brace, found ')'
(6120,40): run-time error CSS1030: Expected identifier, found '.'
(6120,60): run-time error CSS1031: Expected selector, found ')'
(6120,60): run-time error CSS1025: Expected comma or open brace, found ')'
(6781,22): run-time error CSS1039: Token not allowed after unary operator: '-transparency-black-40'
(6782,28): run-time error CSS1039: Token not allowed after unary operator: '-transparency-white-20'
(8526,30): run-time error CSS1030: Expected identifier, found '.'
(8526,53): run-time error CSS1031: Expected selector, found ')'
(8526,53): run-time error CSS1025: Expected comma or open brace, found ')'
(8531,34): run-time error CSS1030: Expected identifier, found '.'
(8531,57): run-time error CSS1031: Expected selector, found ')'
(8531,57): run-time error CSS1025: Expected comma or open brace, found ')'
(8536,30): run-time error CSS1030: Expected identifier, found '.'
(8536,53): run-time error CSS1031: Expected selector, found ')'
(8536,53): run-time error CSS1025: Expected comma or open brace, found ')'
(8541,34): run-time error CSS1030: Expected identifier, found '.'
(8541,57): run-time error CSS1031: Expected selector, found ')'
(8541,57): run-time error CSS1025: Expected comma or open brace, found ')'
(10146,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(10153,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(10209,21): run-time error CSS1039: Token not allowed after unary operator: '-carousel-card-width'
(10227,38): run-time error CSS1039: Token not allowed after unary operator: '-carousel-card-width'
(10227,70): run-time error CSS1039: Token not allowed after unary operator: '-carousel-card-width'
(10232,42): run-time error CSS1039: Token not allowed after unary operator: '-carousel-card-width'
(10232,82): run-time error CSS1039: Token not allowed after unary operator: '-carousel-card-width'
(10247,28): run-time error CSS1039: Token not allowed after unary operator: '-carousel-card-width'
(10258,32): run-time error CSS1039: Token not allowed after unary operator: '-carousel-card-width'
(10263,27): run-time error CSS1039: Token not allowed after unary operator: '-carousel-card-width'
(10274,31): run-time error CSS1039: Token not allowed after unary operator: '-carousel-card-width'
 */
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: 400;
    src: local("Noto Sans"),local("NotoSans"),url(https://fonts.gstatic.com/s/notosans/v6/C7bP6N8yXZ-PGLzbFLtQKRJtnKITppOI_IvcXXDNrsc.woff2) format("woff2");
    unicode-range: u+0460-052f,u+20b4,u+2de0-2dff,u+a640-a69f
}

@font-face {
    font-display: swap;
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 400;
    src: local("Noto Sans"),local("NotoSans"),url(https://fonts.gstatic.com/s/notosans/v6/iLJc6PpCnnbQjYc1Jq4v0xJtnKITppOI_IvcXXDNrsc.woff2) format("woff2");
    unicode-range: u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116
}

@font-face {
    font-display: swap;
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 400;
    src: local("Noto Sans"),local("NotoSans"),url(https://fonts.gstatic.com/s/notosans/v6/5pCv5Yz4eMu9gmvX8nNhfRJtnKITppOI_IvcXXDNrsc.woff2) format("woff2");
    unicode-range: u+02bc,u+0900-097f,u+1cd0-1cf6,u+1cf8-1cf9,u+200b-200d,u+20a8,u+20b9,u+25cc,u+a830-a839,u+a8e0-a8fb
}

@font-face {
    font-display: swap;
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 400;
    src: local("Noto Sans"),local("NotoSans"),url(https://fonts.gstatic.com/s/notosans/v6/gEkd0pn-sMtQ_P4HUpi6WBJtnKITppOI_IvcXXDNrsc.woff2) format("woff2");
    unicode-range: u+1f??
}

@font-face {
    font-display: swap;
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 400;
    src: local("Noto Sans"),local("NotoSans"),url(https://fonts.gstatic.com/s/notosans/v6/iPF-u8L1qkTPHaKjvXERnxJtnKITppOI_IvcXXDNrsc.woff2) format("woff2");
    unicode-range: u+0370-03ff
}

@font-face {
    font-display: swap;
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 400;
    src: local("Noto Sans"),local("NotoSans"),url(https://fonts.gstatic.com/s/notosans/v6/mTzVK0-EJOCaJiOPeaz-hxJtnKITppOI_IvcXXDNrsc.woff2) format("woff2");
    unicode-range: u+0102-0103,u+1ea0-1ef9,u+20ab
}

@font-face {
    font-display: swap;
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 400;
    src: local("Noto Sans"),local("NotoSans"),url(https://fonts.gstatic.com/s/notosans/v6/erE3KsIWUumgD1j_Ca-V-xJtnKITppOI_IvcXXDNrsc.woff2) format("woff2");
    unicode-range: u+0100-024f,u+1e??,u+20a0-20ab,u+20ad-20cf,u+2c60-2c7f,u+a720-a7ff
}

@font-face {
    font-display: swap;
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 400;
    src: local("Noto Sans"),local("NotoSans"),url(https://fonts.gstatic.com/s/notosans/v6/LeFlHvsZjXu2c3ZRgBq9nFtXRa8TVwTICgirnJhmVJw.woff2) format("woff2");
    unicode-range: u+00??,u+0131,u+0152-0153,u+02c6,u+02da,u+02dc,u+2000-206f,u+2074,u+20ac,u+2212,u+2215
}

@font-face {
    font-display: swap;
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 700;
    src: local("Noto Sans Bold"),local("NotoSans-Bold"),url(https://fonts.gstatic.com/s/notosans/v6/PIbvSEyHEdL91QLOQRnZ16-j2U0lmluP9RWlSytm3ho.woff2) format("woff2");
    unicode-range: u+0460-052f,u+20b4,u+2de0-2dff,u+a640-a69f
}

@font-face {
    font-display: swap;
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 700;
    src: local("Noto Sans Bold"),local("NotoSans-Bold"),url(https://fonts.gstatic.com/s/notosans/v6/PIbvSEyHEdL91QLOQRnZ15X5f-9o1vgP2EXwfjgl7AY.woff2) format("woff2");
    unicode-range: u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116
}

@font-face {
    font-display: swap;
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 700;
    src: local("Noto Sans Bold"),local("NotoSans-Bold"),url(https://fonts.gstatic.com/s/notosans/v6/PIbvSEyHEdL91QLOQRnZ10Tj6bCwSDA5u__Fbjwz3f0.woff2) format("woff2");
    unicode-range: u+02bc,u+0900-097f,u+1cd0-1cf6,u+1cf8-1cf9,u+200b-200d,u+20a8,u+20b9,u+25cc,u+a830-a839,u+a8e0-a8fb
}

@font-face {
    font-display: swap;
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 700;
    src: local("Noto Sans Bold"),local("NotoSans-Bold"),url(https://fonts.gstatic.com/s/notosans/v6/PIbvSEyHEdL91QLOQRnZ1xWV49_lSm1NYrwo-zkhivY.woff2) format("woff2");
    unicode-range: u+1f??
}

@font-face {
    font-display: swap;
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 700;
    src: local("Noto Sans Bold"),local("NotoSans-Bold"),url(https://fonts.gstatic.com/s/notosans/v6/PIbvSEyHEdL91QLOQRnZ16aRobkAwv3vxw3jMhVENGA.woff2) format("woff2");
    unicode-range: u+0370-03ff
}

@font-face {
    font-display: swap;
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 700;
    src: local("Noto Sans Bold"),local("NotoSans-Bold"),url(https://fonts.gstatic.com/s/notosans/v6/PIbvSEyHEdL91QLOQRnZ1_8zf_FOSsgRmwsS7Aa9k2w.woff2) format("woff2");
    unicode-range: u+0102-0103,u+1ea0-1ef9,u+20ab
}

@font-face {
    font-display: swap;
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 700;
    src: local("Noto Sans Bold"),local("NotoSans-Bold"),url(https://fonts.gstatic.com/s/notosans/v6/PIbvSEyHEdL91QLOQRnZ1z0LW-43aMEzIO6XUTLjad8.woff2) format("woff2");
    unicode-range: u+0100-024f,u+1e??,u+20a0-20ab,u+20ad-20cf,u+2c60-2c7f,u+a720-a7ff
}

@font-face {
    font-display: swap;
    font-family: Noto Sans;
    font-style: normal;
    font-weight: 700;
    src: local("Noto Sans Bold"),local("NotoSans-Bold"),url(https://fonts.gstatic.com/s/notosans/v6/PIbvSEyHEdL91QLOQRnZ1-gdm0LZdjqr5-oayXSOefg.woff2) format("woff2");
    unicode-range: u+00??,u+0131,u+0152-0153,u+02c6,u+02da,u+02dc,u+2000-206f,u+2074,u+20ac,u+2212,u+2215
}

.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
}

.c-green {
    color: #44be4c !important
}

.c-red {
    color: #ed3445 !important;
    fill: #ed3445 !important
}

.c-orange {
    color: #ed9c00 !important
}

.c-yellow {
    color: #f8b814 !important;
    fill: #f8b814 !important
}

.c-black-40 {
    color: #999
}

.c-black-60 {
    color: #666
}

.c-black-80, .c-black-80:hover {
    color: #333
}

.c-orange {
    color: #ed9c00
}

.link-blue, a.link-blue {
    color: #007dff;
    text-decoration: underline
}

.c-blue {
    color: #007dff
}

.c-purple {
    color: #7528ab;
    fill: #7528ab !important
}

.c-white, .c-white a {
    color: #fff !important
}

.c-grey-4 {
    color: #a2aeb7
}

.c-grey-5 {
    color: #7b8c98
}

.c-grey-6 {
    color: #4a5b68
}

.c-grey-7 {
    color: #19232c
}

.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: #999
}

svg.c-black-60 {
    fill: #666
}

svg.c-black-80 {
    fill: #333
}

svg.c-green {
    fill: #44be4c !important
}

svg.c-orange {
    fill: #ed9c00
}

svg.c-red {
    fill: #ed3445 !important
}

svg.c-blue {
    fill: #007dff !important
}

svg.c-grey-2 {
    fill: #e3e7ef
}

svg.c-grey-4 {
    fill: #a2aeb7
}

svg.c-grey-5 {
    fill: #7b8c98
}

svg.c-grey-6 {
    fill: #4a5b68
}

svg.c-grey-7 {
    fill: #19232c !important
}

svg.c-yellow {
    fill: #fbee22
}

svg.c-grey-3 {
    fill: #cdd6dd
}

svg.c-grey-1 {
    fill: #f0f3f7
}

.bg-green {
    background: #44be4c
}

.bg-grey-2 {
    background: #e3e7ef
}

.bg-purple {
    background: #7528ab
}

.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 {
    scrollbar-color: #44be4c #19232c
}

.green-scroll-bg-grey-9 {
    scrollbar-color: #44be4c #131a21
}

.flickity-button {
    align-items: center;
    background: transparent;
    border: 1px solid #4a5b68;
    border-radius: 2px 0 0 2px;
    color: #4a5b68;
    cursor: pointer;
    display: flex;
    height: 36px;
    justify-content: center;
    position: absolute;
    top: 22px;
    width: 36px;
    z-index: 10
}

    .flickity-button.next {
        border-radius: 0 2px 2px 0
    }

@media (min-width:992px) {
    .flickity-button:hover {
        background: rgba(123,140,152,.1);
        color: #19232c
    }
}

.flickity-button:hover .flickity-button-icon {
    fill: #19232c
}

.flickity-button:disabled {
    background: transparent;
    color: #cdd6dd;
    opacity: 1
}

    .flickity-button:disabled .flickity-button-icon {
        fill: #cdd6dd
    }

.flickity-button:active, .flickity-button:focus {
    box-shadow: none;
    outline: none
}

@media (min-width:992px) {
    .bg-grey-8 .flickity-button:hover, .bg-grey-9 .flickity-button:hover {
        background: rgba(123,140,152,.1);
        color: #19232c
    }
}

.bg-grey-8 .flickity-button:hover .flickity-button-icon, .bg-grey-9 .flickity-button:hover .flickity-button-icon {
    fill: #fff
}

.item-slider {
    overflow-x: scroll;
    position: relative;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    align-items: flex-start;
    display: flex;
    left: -12px;
    padding: 0 12px;
    width: calc(100% + 24px)
}

@media (min-width:568px) {
    .item-slider {
        left: -16px;
        padding: 0 16px;
        width: calc(100% + 32px)
    }
}

@media (max-width:767px) {
    .item-slider {
        -webkit-overflow-scrolling: touch
    }
}

@media (min-width:768px) {
    .item-slider {
        left: auto;
        padding-left: 0;
        padding-right: 0;
        width: auto
    }
}

@media (min-width:992px) {
    .item-slider {
        height: auto;
        overflow-x: hidden
    }
}

body {
    font-family: Noto Sans,sans-serif;
    padding-top: 40px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background: #f0f3f7;
    color: #19232c;
    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: 87px
    }
}

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 8px
}

@media (min-width:568px) {
    .col-main-pad {
        padding: 0 16px
    }
}

@media (min-width:768px) {
    .col-main-pad {
        margin-left: auto;
        margin-right: auto
    }
}

@media (min-width:1200px) {
    .col-main-pad {
        max-width: 1200px
    }

    .col-list-cards {
        display: flex
    }
}

.col-menu {
    margin: auto;
    position: relative
}

@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: 20px auto;
    padding: 0 10px
}

@media (min-width:768px) {
    .col-text {
        margin: 50px auto;
        max-width: 870px
    }
}

@media (min-width:1200px) {
    .col-text {
        padding: 0
    }
}

.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
    }
}

.no-license-info .flag-icon-circle-small, .no-license-info .flag-icon-circle-small i {
    height: 16px;
    width: 16px
}

.no-license-info .flag-icon-circle-small {
    margin-top: -3px;
    vertical-align: middle
}

.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);
        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;
    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
    }

    .col-bonus, .col-casino-card {
        float: left;
        padding: 0 15px 0 0;
        width: 75%
    }
}

.lum-lightbox-inner img {
    max-height: 100vh !important;
    max-width: 100vw !important
}

.clickthroughlink-info {
    color: #007dff;
    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;
    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 {
    margin-right: 8px;
    fill: #fff;
    flex-shrink: 0;
    height: 18px;
    width: 18px
}

@media (min-width:1200px) {
    .btn svg {
        height: 18px;
        width: 18px
    }
}

.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: #44be4c;
    border: none
}

    .btn-green.active, .btn-green:active, .btn-green:focus, .btn-green:hover {
        background: #359a3c
    }

    .btn-green .loader {
        border-left: 2px solid #fff;
        border-top: 2px solid #fff;
        border-color: #44be4c #fff #fff #44be4c;
        border-style: solid;
        border-width: 2px;
        height: 14px;
        width: 14px
    }

    .btn-green.active .loader {
        display: inline
    }

.btn-red {
    background-color: #ed3445;
    border: none
}

    .btn-red.active, .btn-red:active, .btn-red:focus, .btn-red:hover {
        background: #db1326
    }

    .btn-red .loader {
        border-left: 2px solid #ed3445;
        border-top: 2px solid #ed3445
    }

    .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: #7528ab;
    border: none
}

    .btn-purple.active, .btn-purple:active, .btn-purple:focus, .btn-purple:hover {
        background: #591e82
    }

    .btn-purple .loader {
        border-left: 2px solid #fff;
        border-top: 2px solid #fff;
        border-color: #7528ab #fff #fff #7528ab;
        border-style: solid;
        border-width: 2px
    }

.btn-border-purple {
    border: 1px solid #7528ab;
    color: #7528ab
}

    .btn-border-purple.active, .btn-border-purple:active, .btn-border-purple:focus, .btn-border-purple:hover {
        background: #7528ab;
        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: #7528ab
    }

.btn-border-green {
    border: 1px solid #44be4c;
    color: #44be4c
}

    .btn-border-green.active, .btn-border-green:active, .btn-border-green:focus, .btn-border-green:hover {
        background: #44be4c;
        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: #44be4c
    }

.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 #4a5b68;
    color: #4a5b68
}

    .btn-border-dark svg {
        fill: #4a5b68
    }

    .btn-border-dark:hover {
        background: #4a5b68;
        color: #f0f3f7
    }

        .btn-border-dark:hover svg {
            fill: #f0f3f7
        }

.btn-small-button-dark, .btn-small-button-light {
    align-items: center;
    border: 1px solid #4a5b68;
    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: 19px;
    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: #44be4c
    }

        .btn-small-button-dark:hover svg {
            fill: #44be4c
        }

.main-header {
    background: #19232c;
    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: 68px
    }
}

@media (min-width:992px) {
    .main-header {
        height: 87px
    }
}

@media (max-width:767px) {
    .main-header {
        height: 40px
    }

        .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: #27343f;
        border-top: 1px solid #4a5b68;
        bottom: 0;
        display: block;
        height: 35px;
        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: #19232c;
    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: #4a5b68;
    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
}

@media (min-width:568px) {
    .page-header {
        padding-left: 24px
    }
}

@media (min-width:768px) {
    .page-header {
        flex-wrap: wrap;
        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: #44be4c
    }

.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 #44be4c;
    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: #27343f;
    display: flex;
    font-size: 14px;
    gap: 8px;
    line-height: 20px
}

    .author-row .author-avatar {
        margin-right: 10px
    }

    .author-row .avatar {
        border: 2px solid #44be4c;
        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: #131a21
        }

.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: #44be4c
}

    .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 {
    display: flex;
    flex: 1 0 160px;
    min-height: 160px;
    position: relative;
    z-index: 2
}

@media (min-width:568px) {
    .page-header-img {
        display: block;
        flex: 0 0 160px;
        margin-left: auto
    }
}

@media (min-width:768px) {
    .page-header-img {
        flex: 0 0 50%;
        margin-left: 0;
        max-height: 280px
    }
}

.page-header-img img {
    display: block;
    height: auto;
    margin: auto;
    max-width: 100%
}

@media (min-width:568px) {
    .page-header-img img {
        max-height: 100%;
        width: auto
    }
}

.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: #19232c;
        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: #19232c;
    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: center;
        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%
}

    .page-footer-cols a:hover span {
        text-decoration: underline
    }

    .page-footer-cols .shrink-icon {
        padding: 0 0 0 1px
    }

.footer-col-1-4 {
    border-top: 1px solid #4a5b68;
    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%
    }
}

@media (min-width:768px) {
    .footer-col-1-4 {
        flex: 1 1 25%
    }
}

@media (min-width:568px) {
    .footer-col-1-4:nth-child(2n) {
        border-left: 1px solid #4a5b68;
        padding-left: 16px
    }
}

@media (min-width:768px) {
    .footer-col-1-4:nth-child(3n+2) {
        border-left: 1px solid #4a5b68;
        padding-left: 16px
    }
}

@media (min-width:992px) {
    .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 #4a5b68;
    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
    }
}

.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;
    justify-content: flex-end
}

    .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: #44be4c
}

.cg-page-footer-social svg {
    display: block
}

.footer-col-partners {
    flex: 0 0 100%
}

@media (min-width:568px) {
    .footer-col-partners {
        display: flex
    }
}

.footer-col-partners .arrow {
    position: absolute;
    right: 0;
    top: 16px;
    fill: #cdd6dd
}

@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 #4a5b68;
    color: #cdd6dd;
    display: block;
    padding-bottom: 16px;
    position: relative
}

@media (min-width:568px) {
    .footer-col-partners .guru-academy {
        border-right: 1px solid #4a5b68;
        flex: 0 0 calc(50% + 1px);
        padding-right: 16px
    }
}

.footer-col-partners .guru-academy:hover .arrow {
    fill: #44be4c
}

.footer-col-partners .guru-self-exclusion {
    border-top: 1px solid #4a5b68;
    color: #cdd6dd;
    display: block;
    padding-bottom: 16px;
    position: relative
}

    .footer-col-partners .guru-self-exclusion:hover .arrow {
        fill: #44be4c
    }

@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 (max-width:767px) {
    .search-box-wrapper {
        display: none
    }
}

.search-box-dark.search-box-active .search-box-input-wrapper-dark {
    background: #fff
}

.search-box-dark .search-box-input-wrapper-dark {
    background: rgba(123,140,152,.1);
    border: 1px solid #4a5b68
}

.search-box-dark .search-ico-wrapper-dark {
    background: rgba(123,140,152,.1)
}

    .search-box-dark .search-ico-wrapper-dark svg {
        fill: #fff
    }

.search-box-input-dark {
    background: transparent;
    border: none
}

    .search-box-input-dark::placeholder {
        color: #e3e7ef
    }

    .search-box-active .search-box-input-dark, .search-box-input-dark:focus {
        color: #19232c
    }

        .search-box-active .search-box-input-dark::placeholder, .search-box-input-dark:focus::placeholder {
            color: #4a5b68
        }

        .search-box-active .search-box-input-dark + .search-ico-wrapper-dark svg, .search-box-input-dark:focus + .search-ico-wrapper-dark svg {
            fill: #44be4c
        }

.search-box-light .search-box-input-wrapper-light {
    background: #fff;
    border: 1px solid #a2aeb7
}

.search-box-light .search-ico-wrapper-light {
    background: rgba(123,140,152,.1)
}

    .search-box-light .search-ico-wrapper-light svg {
        fill: #4a5b68
    }

.search-box-input-light {
    background: #fff;
    border: none
}

    .search-box-input-light::placeholder {
        color: #7b8c98
    }

    .search-box-input-light:focus {
        background: #fff;
        color: #19232c
    }

        .search-box-input-light:focus::placeholder {
            color: #7b8c98
        }

        .search-box-input-light:focus + .search-ico-wrapper-light svg {
            fill: #44be4c
        }

@media (min-width:768px) {
    .homepage-wrapper .search-box-wrapper {
        margin: 40px 0
    }
}

.search-box-panel {
    background: #11091d no-repeat;
    display: flex;
    flex-direction: column;
    height: 300px;
    justify-content: center;
    padding: 50px 35px;
    position: relative;
    text-align: center
}

@media (min-width:568px) {
    .search-box-panel {
        display: block;
        height: auto;
        padding: 40px 45px
    }
}

@media (min-width:992px) {
    .search-box-panel {
        padding: 80px 45px 60px
    }
}

.search-box-panel > img {
    height: 100%;
    left: 0;
    object-fit: cover;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0
}

.search-box {
    display: none;
    height: 40px;
    margin: 0 auto;
    padding: 0 15px;
    position: relative
}

@media (min-width:768px) {
    .search-box {
        height: 87px;
        max-width: 620px;
        padding: 0
    }
}

@media (min-width:992px) {
    .search-box {
        max-width: 770px
    }
}

.search-box::placeholder {
    color: #252525;
    font-size: 16px
}

.search-box.search-box-active {
    background: transparent;
    display: block
}

.search-box .loader {
    align-items: center;
    border-left-color: #a2aeb7;
    border-top-color: #a2aeb7;
    border-width: 4px;
    display: flex;
    height: 25px;
    right: 80px;
    text-align: center;
    width: 25px
}

.search-box .icon-search {
    height: 18px;
    width: 18px
}

.search-box-input-wrapper {
    align-items: center;
    border-radius: 2px;
    display: flex;
    height: 100%;
    position: relative;
    z-index: 1
}

.search-box-input {
    border: 0;
    font-size: 16px;
    height: 100%;
    padding-left: 16px;
    padding-right: 24px;
    text-overflow: ellipsis;
    width: 100%
}

    .search-box-input:active, .search-box-input:focus, .search-box-input:hover {
        outline: 0
    }

.search-ico-wrapper {
    align-items: center;
    background: rgba(123,140,152,.1);
    display: flex;
    height: 38px;
    justify-content: center;
    width: 40px
}

@media (min-width:568px) {
    .search-ico-wrapper {
        height: 48px;
        width: 50px
    }
}

.header-search-wrapper {
    align-items: center;
    background: #19232c;
    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: #19232c;
    padding: 0 8px
}

@media (min-width:568px) {
    .header-search-wrapper .header-search-close {
        display: none
    }
}

.header-search {
    border: 1px solid #4a5b68;
    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-box-pills-wrapper {
    background: #cdd6dd;
    margin: 0 0 20px;
    padding: 12px 0;
    position: sticky;
    top: 0;
    z-index: 10
}

.search-box-pills {
    display: flex;
    overflow-x: auto;
    position: relative
}

@media (min-width:992px) {
    .search-box-pills {
        overflow: hidden;
        padding: 0 24px
    }
}

.search-box-pills .flickity-button {
    align-items: center;
    background: #fff;
    border-color: #a2aeb7;
    box-shadow: 0 0 8px 14px #cdd6dd;
    display: flex;
    height: 32px;
    justify-content: center;
    padding: 8px;
    position: absolute;
    width: 32px;
    z-index: 1
}

    .search-box-pills .flickity-button:focus {
        box-shadow: 0 0 8px 14px #cdd6dd
    }

    .search-box-pills .flickity-button:hover {
        background: #fff;
        border-color: #44be4c
    }

        .search-box-pills .flickity-button:hover .flickity-button-icon {
            fill: #44be4c
        }

    .search-box-pills .flickity-button.next {
        border-radius: 50px;
        right: 8px;
        top: 0
    }

@media (min-width:992px) {
    .search-box-pills .flickity-button.next {
        right: 24px
    }
}

.search-box-pills .flickity-button.previous {
    border-radius: 50px;
    left: 8px;
    top: 0
}

@media (min-width:992px) {
    .search-box-pills .flickity-button.previous {
        left: 24px
    }
}

.search-box-pills .flickity-button:disabled {
    display: none
}

.search-box-pill {
    align-items: center;
    background: #fff;
    border: 1px solid #a2aeb7;
    border-radius: 100px;
    color: #27343f;
    cursor: pointer;
    display: inline-flex;
    font-family: Noto Sans,sans-serif;
    font-size: 12px;
    font-weight: 700;
    gap: 4px;
    line-height: 16px;
    margin-right: 8px;
    padding: 4px 8px
}

@media (min-width:568px) {
    .search-box-pill {
        font-size: 16px;
        line-height: 22px
    }
}

@media (min-width:992px) {
    .search-box-pill {
        font-size: 14px;
        font-weight: 400;
        gap: 8px;
        line-height: 18px;
        padding: 6px 12px
    }
}

.search-box-pill svg {
    fill: #27343f;
    height: 16px;
    width: 16px
}

@media (min-width:992px) {
    .search-box-pill svg {
        height: 18px;
        width: 18px
    }
}

.search-box-pill:first-child {
    margin-left: 16px
}

@media (min-width:992px) {
    .search-box-pill:first-child {
        margin-left: 0
    }
}

.search-box-pill:last-child {
    margin-right: 16px
}

@media (min-width:992px) {
    .search-box-pill:last-child {
        margin-right: 0
    }
}

.search-box-pill.selected, .search-box-pill:hover {
    border-color: #44be4c;
    color: #44be4c
}

    .search-box-pill.selected svg, .search-box-pill:hover svg {
        fill: #44be4c
    }

.search-result-type {
    border: 1px solid #4a5b68;
    border-radius: 2px;
    color: #4a5b68;
    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: #f2f2f2
}

.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: 68px;
        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: 0 8px
}

@media (min-width:768px) {
    .menu {
        height: auto;
        padding-top: 8px
    }
}

.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: 48px
        }
}

.menu-logo {
    margin-left: 8px;
    margin-right: auto;
    position: relative;
    z-index: 5
}

@media (min-width:568px) {
    .menu-logo {
        overflow: hidden;
        width: 24px
    }
}

@media (min-width:768px) {
    .menu-logo {
        height: auto;
        margin-right: 4px;
        overflow: hidden;
        position: relative;
        width: auto
    }
}

@media (min-width:1200px) {
    .menu-logo {
        margin-right: 8px;
        overflow: visible;
        width: auto
    }
}

.menu-logo a, .menu-logo svg {
    display: block
}

.menu-logo img {
    display: block;
    height: 28px;
    overflow: hidden;
    width: auto
}

@media (min-width:568px) {
    .menu-logo img {
        height: 34px
    }
}

@media (min-width:992px) {
    .menu-logo img {
        height: 34px
    }
}

.menu-right {
    align-items: center;
    display: flex;
    height: 100%
}

@media (min-width:768px) {
    .menu-right {
        position: relative
    }
}

@media (min-width:568px) {
    .menu-right .menu-link-search {
        display: none
    }
}

.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 #4a5b68;
    border-radius: 2px;
    height: 32px;
    padding: 7px 8px
}

@media (min-width:992px) {
    .menu-right-btn {
        height: 36px;
        padding: 10px 16px
    }
}

.menu-right-btn .separator {
    background: #4a5b68;
    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-right-btn:hover {
    background: rgba(123,140,152,.1)
}

    .menu-right-btn:hover span {
        color: #44be4c
    }

    .menu-right-btn:hover .email svg {
        fill: #44be4c
    }

.menu-right-btn.active span {
    color: #44be4c
}

    .menu-right-btn.active span .email svg {
        fill: #44be4c
    }

.menu-right-link {
    align-items: center;
    border-radius: 2px 0 0 2px;
    color: #fff;
    cursor: pointer;
    display: flex;
    z-index: 2
}

    .menu-right-link .text {
        color: #fff;
        font-family: neo-sans,sans-serif;
        font-size: 12px;
        font-weight: 700;
        line-height: 14px
    }

@media (min-width:768px) {
    .menu-right-link .text {
        font-size: 14px;
        line-height: 18px
    }
}

.menu-right-link .text:hover, .menu-right-link.active .text {
    color: #44be4c
}

.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: #19232c
}

    .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: #19232c;
    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 svg {
    fill: #a2aeb7
}

    .menu-user-logged .popup-modal-exit-button svg:hover {
        fill: #4a5b68
    }

.menu-user-logged .sans {
    font-family: neo-sans,sans-serif;
    font-size: 16px;
    line-height: 20px
}

.menu-user-logged > a {
    align-items: center;
    color: #4a5b68;
    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: #19232c
    }

        .menu-user-logged > a:hover svg {
            fill: #19232c
        }

    .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: #4a5b68;
    margin-right: 8px
}

.menu-right-signup {
    border-left: 0;
    display: none;
    margin-left: -1px
}

@media (min-width:568px) {
    .menu-right-signup {
        display: flex
    }
}

.menu-right-signup:hover {
    cursor: pointer
}

    .menu-right-signup:hover .menu-right-link .text {
        color: #44be4c
    }

.menu-link {
    align-items: center;
    border-bottom: 1px solid #4a5b68;
    color: #fff;
    display: flex;
    flex: 1;
    font-family: neo-sans,sans-serif;
    font-size: 15px;
    font-weight: 700;
    justify-content: flex-start;
    overflow: hidden;
    padding: 11px 15px;
    position: relative;
    text-align: left;
    text-decoration: none
}

@media (min-width:768px) {
    .menu-link {
        border: none;
        flex: 0 auto;
        font-size: 13px;
        padding: 9px 10px 8px;
        position: relative;
        white-space: nowrap
    }

        .menu-link:after {
            background: #44be4c;
            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 {
        font-size: 14px;
        padding: 9px 10px 8px
    }

        .menu-link .menu-icon {
            display: block
        }
}

@media (min-width:1200px) {
    .menu-link {
        cursor: pointer
    }
}

.menu-link svg {
    flex-shrink: 0;
    height: 20px;
    margin-right: 8px;
    width: 20px
}

@media (min-width:768px) {
    .menu-link svg {
        margin-right: 4px
    }
}

.menu-link .icon-arrow {
    height: 9px;
    width: 14px
}

@media (min-width:768px) {
    .menu-link .icon-arrow {
        display: none
    }
}

.menu-link:focus {
    color: #fff;
    text-decoration: none
}

.menu-link:hover {
    color: #44be4c
}

.menu-link.is-active .icon-arrow {
    transform: rotate(-180deg)
}

.menu-link svg {
    fill: #44be4c
}

.tag-new {
    color: #f8ea14;
    font-family: neo-sans,sans-serif;
    font-size: 8px;
    position: absolute;
    right: -10px;
    text-transform: uppercase;
    top: -5px
}

@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 #4a5b68;
    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: #44be4c
}

.menu-lang {
    align-items: center;
    align-self: right;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-family: neo-sans,sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 14px;
    margin: 0 3px;
    position: relative;
    z-index: 3
}

@media (min-width:768px) {
    .menu-lang {
        font-size: 14px;
        line-height: 18px;
        margin: 0 8px
    }
}

@media (min-width:992px) {
    .menu-lang {
        margin: 0 16px
    }
}

.menu-lang:focus, .menu-lang:hover {
    text-decoration: none
}

.menu-lang i {
    display: inline-block;
    height: 14px;
    width: 16px
}

.menu-lang.active span {
    color: #44be4c
}

@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;
        scrollbar-width: none
    }

        .menu-nav::-webkit-scrollbar {
            display: none
        }
}

.menu-nav .active > a {
    color: #44be4c;
    position: relative
}

@media (min-width:768px) {
    .menu-nav .active > a:before {
        background: #44be4c;
        bottom: 0;
        content: "";
        height: 4px;
        left: 0;
        position: absolute;
        width: 100%
    }
}

.menu-collapse {
    background: #19232c;
    box-shadow: 20px 0 74px 0 rgba(0,0,0,.32);
    flex: 0 0 100%;
    height: calc(100% - 40px);
    left: 0;
    max-width: 245px;
    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: 35px;
        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: 10px 0;
    padding: 0 15px 16px
}

    .menu-collapse-bottom a {
        color: #999;
        display: block;
        font-size: 11px;
        padding: 5px 0
    }

@media (min-width:768px) {
    .menu-collapse-bottom {
        display: none
    }
}

.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
}

.sub-menu {
    background: #fff;
    box-shadow: 0 51px 74px 0 rgba(0,0,0,.32);
    display: block;
    left: 0;
    max-height: 0;
    overflow: hidden;
    padding: 0 0 0 16px;
    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
}

.none {
    display: none
}

.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
}

.dark-bg {
    background: #19232c
}

.dark-bg, .dark-grey-8-bg {
    color: #fff;
    overflow: hidden;
    position: relative
}

.dark-grey-8-bg {
    background: #131a21
}

.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: #44be4c
}

    .link-primary:hover {
        color: #239f29;
        cursor: pointer;
        text-decoration: underline
    }

        .link-primary:hover svg {
            fill: #239f29
        }

        .link-primary:hover * {
            color: #239f29 !important
        }

.link-secondary:hover {
    color: #44be4c;
    cursor: pointer
}

    .link-secondary:hover svg {
        fill: #44be4c !important
    }

    .link-secondary:hover * {
        color: #44be4c !important
    }

.ellipsis {
    text-overflow: ellipsis;
    white-space: nowrap
}

.ellipsis, .overflow-hidden {
    overflow: hidden
}

.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: #19232c;
    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: #19232c
}

.bg-grey-8, .bg-grey-9 {
    color: #f0f3f7;
    overflow: hidden;
    position: relative
}

.bg-grey-9 {
    background: #131a21
}

.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: #44be4c
    }

    .typography .badge.red svg {
        fill: #ce2935
    }

    .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%
}

.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: 18px
}

@media (min-width:992px) {
    .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:568px) {
    .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
}

.results-content-loader {
    display: none;
    position: relative
}

    .results-content-loader h3 {
        color: #252525
    }

    .results-content-loader h4 {
        color: #44be4c
    }

    .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(https://use.typekit.net/af/00ac0a/00000000000000003b9b2033/27/l?primer=f592e0a4b9356877842506ce344308576437e4f677d7c9b78ca2162e6cad991a&fvd=n7&v=3) format("woff2"),url(https://use.typekit.net/af/00ac0a/00000000000000003b9b2033/27/d?primer=f592e0a4b9356877842506ce344308576437e4f677d7c9b78ca2162e6cad991a&fvd=n7&v=3) format("woff"),url(https://use.typekit.net/af/00ac0a/00000000000000003b9b2033/27/a?primer=f592e0a4b9356877842506ce344308576437e4f677d7c9b78ca2162e6cad991a&fvd=n7&v=3) format("opentype")
}

@font-face {
    font-display: swap;
    font-family: neo-sans;
    font-style: normal;
    font-weight: 400;
    src: url(https://use.typekit.net/af/8870bf/00000000000000003b9b203a/27/l?primer=f592e0a4b9356877842506ce344308576437e4f677d7c9b78ca2162e6cad991a&fvd=n4&v=3) format("woff2"),url(https://use.typekit.net/af/8870bf/00000000000000003b9b203a/27/d?primer=f592e0a4b9356877842506ce344308576437e4f677d7c9b78ca2162e6cad991a&fvd=n4&v=3) format("woff"),url(https://use.typekit.net/af/8870bf/00000000000000003b9b203a/27/a?primer=f592e0a4b9356877842506ce344308576437e4f677d7c9b78ca2162e6cad991a&fvd=n4&v=3) format("opentype")
}

.tk-neo-sans {
    font-family: neo-sans,sans-serif
}

.filter-select-wrapper {
    align-items: center;
    display: flex;
    flex: 0 0 calc(50% - 8px);
    margin-left: 8px;
    position: relative;
    white-space: nowrap
}

@media (min-width:1200px) {
    .filter-select-wrapper {
        flex: 0 0 25%
    }
}

.filter-select-wrapper:hover select {
    background: rgba(123,140,152,.1)
}

    .filter-select-wrapper:hover select + svg {
        fill: #19232c
    }

.filter-select-wrapper .icon-sort {
    bottom: 0;
    left: 12px;
    margin: auto;
    position: absolute;
    top: 0;
    z-index: 3;
    fill: #4a5b68
}

.filter-select-wrapper select {
    -webkit-appearance: none;
    background: transparent;
    border-color: #7b8c98;
    border-radius: 2px;
    color: #4a5b68;
    flex: 1;
    font-size: 14px;
    height: 40px;
    padding: 0 28px 0 38px;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

    .filter-select-wrapper select + svg {
        fill: #7b8c98;
        z-index: 2
    }

@media (min-width:768px) {
    .filter-select-wrapper select {
        font-size: 14px;
        min-width: 190px;
        padding: 0 32px 0 38px
    }
}

.filter-select-wrapper label {
    display: none
}

.filter-select-wrapper-dark .arrow, .filter-select-wrapper-dark .icon-sort, .filter-select-wrapper-dark:hover select + svg {
    fill: #e3e7ef
}

.filter-select-wrapper-dark .cg-select-simple {
    border-color: #7b8c98;
    color: #e3e7ef
}

    .filter-select-wrapper-dark .cg-select-simple:hover {
        background: linear-gradient(0deg,rgba(123,140,152,.1),rgba(123,140,152,.1)),#1d2730;
        color: #cdd6dd
    }

    .filter-select-wrapper-dark .cg-select-simple option {
        color: #cdd6dd
    }

.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: #ed3445
    }

        .vote-link-down.voted svg, .vote-link-down:hover svg {
            fill: #ed3445
        }

.vote-link-bump svg {
    animation: bump .8s
}

.filter-item-active, .preset-filter-item-active {
    align-items: center;
    background: #e3e7ef;
    border-bottom: 1px solid #cdd6dd;
    border-radius: 20px;
    color: #19232c;
    display: inline-flex;
    font-size: 13px;
    font-weight: 700;
    line-height: 15px;
    margin: 5px 5px 0 0;
    padding: 5px 15px;
    position: relative
}

@media (max-width:767px) {
    .filter-item-active, .preset-filter-item-active {
        margin: 3px
    }
}

.filter-item-active svg, .preset-filter-item-active svg {
    fill: #a2aeb7;
    flex-shrink: 0;
    margin-left: 5px
}

.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
}

.filter-item-active .flag-icon-circle-small, .preset-filter-item-active .flag-icon-circle-small {
    flex-shrink: 0;
    margin-left: -5px
}

.filter-item-active-label {
    color: #7b8c98;
    font-size: 12px
}

.filter-item-active {
    cursor: pointer
}

    .filter-item-active:active, .filter-item-active:focus, .filter-item-active:hover {
        background: #cdd6dd;
        text-decoration: none
    }

        .filter-item-active:active svg, .filter-item-active:focus svg, .filter-item-active:hover svg {
            fill: #7b8c98
        }

.filter-item-clear {
    align-items: center;
    background: #4a5b68;
    border-radius: 20px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-family: neo-sans,sans-serif;
    font-size: 13px;
    font-weight: 700;
    line-height: 15px;
    margin-top: 5px;
    padding: 5px 10px
}

@media (max-width:767px) {
    .filter-item-clear {
        margin: 3px
    }
}

.filter-item-clear svg {
    fill: #fff;
    margin-left: 5px;
    transition: fill .2s ease-in-out
}

    .filter-item-clear svg.transparent {
        opacity: .6
    }

.filter-item-clear:active, .filter-item-clear:focus, .filter-item-clear:hover {
    background: #ce2935
}

    .filter-item-clear:active svg, .filter-item-clear:focus svg, .filter-item-clear:hover svg {
        opacity: 1
    }

@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-row .game-filter-sort {
    flex: 1 0 50%
}

.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: #333;
    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
}

.filter-heading-label {
    align-items: center;
    background: #f5ffd7;
    color: #239f29;
    display: flex;
    flex: 1 0 100%;
    font-size: 13px;
    font-weight: 700;
    line-height: 16px;
    margin-top: 4px;
    padding: 4px 16px;
    white-space: nowrap
}

.tippy-box .filter-heading-label {
    white-space: normal
}

@media (min-width:1200px) {
    .filter-heading-label {
        margin-left: 8px
    }
}

@media (min-width:992px) {
    .filter-heading-label {
        margin: 8px 0
    }
}

@media (min-width:1200px) {
    .filter-heading-label {
        margin: 0 0 0 8px
    }
}

.filter-heading-label svg {
    fill: #239f29
}

.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 {
    min-height: 400px;
    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(25,35,44,.8)
}

.results-main-bottom {
    color: #4a5b68;
    display: flex;
    flex-direction: column;
    margin: 16px 0 32px
}

@media (min-width:768px) {
    .results-main-bottom {
        flex-direction: row;
        flex-wrap: wrap
    }
}

.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
    }
}

.results-main-bottom.on-dark-bg {
    color: #a2aeb7
}

.results-main-bottom .paging {
    flex: 0 0 100%
}

.user-review-modal-select select {
    color: #7b8c98
}

    .user-review-modal-select select.dirty {
        color: #4a5b68
    }

@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
    }
}

.filter-list-item-img {
    border: 1px solid #cdd6dd;
    display: flex;
    justify-content: center;
    position: relative
}

    .filter-list-item-img img, .filter-list-item-img picture {
        display: block
    }

.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: #19232c;
    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: #44be4c #f0f3f7
    }

        html ::-webkit-scrollbar {
            height: 4px;
            width: 6px
        }

        html ::-webkit-scrollbar-track {
            background: #f0f3f7;
            width: 6px
        }

        html ::-webkit-scrollbar-thumb {
            background: #44be4c;
            border-radius: 2px
        }

        html body * {
            scrollbar-color: #44be4c #fff;
            scrollbar-width: thin
        }

        html.scrollbar-dark ::-webkit-scrollbar-track {
            background: #19232c
        }

        html.scrollbar-dark ::-webkit-scrollbar-thumb {
            background: #44be4c
        }

        html.scrollbar-dark body {
            scrollbar-color: #44be4c #19232c
        }
}

.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
    }
}

.filter-group {
    border-bottom: 1px solid #dce3e8;
    padding: 12px 16px
}

    .filter-group:last-child {
        border-bottom: none
    }

@media (min-width:1200px) {
    .filter-group {
        padding: 15px 0
    }
}

.filter-group .flag-icon {
    background-size: auto;
    margin-right: 8px;
    position: relative
}

.filter-group.active .filter-group-heading svg {
    fill: #44be4c
}

.filter-group.active .filter-group-heading {
    color: #44be4c;
    font-weight: 700
}

.filter-group.expanded .filter-arrow {
    transform: rotate(-180deg)
}

.filter-panel {
    background: #fff;
    border-radius: 2px;
    margin-bottom: 16px
}

@media (min-width:1200px) {
    .filter-panel {
        box-shadow: 0 4px 8px rgba(29,39,48,.16);
        padding-left: 16px
    }
}

.filter-group-desc-prefix {
    color: #44be4c
}

.filter-arrow {
    align-self: center
}

.filter-heading {
    color: #4a5b68;
    font-size: 12px;
    line-height: 16px;
    text-transform: uppercase
}

.filter-group-heading-desc {
    color: #4a5b68;
    font-size: 11px;
    line-height: 14px;
    overflow: hidden;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap
}

.filter-group-heading {
    align-items: center;
    background-color: #fff;
    color: #1d2730;
    cursor: pointer;
    display: flex;
    position: relative
}

    .filter-group-heading.active {
        color: #252525;
        font-weight: 700;
        text-decoration: none
    }

        .filter-group-heading.active .icon-simple-down {
            color: #252525
        }

    .filter-group-heading > svg {
        fill: #44be4c
    }

    .filter-group-heading .filter-group-icon {
        margin-right: 16px
    }

    .filter-group-heading .filter-arrow {
        fill: #7b8c98;
        margin: 0 0 0 16px
    }

    .filter-group-heading:hover, .filter-group-heading:hover .filter-group-heading-desc {
        color: #44be4c
    }

.filter-group-heading-name {
    font-family: neo-sans,sans-serif;
    font-size: 15px;
    font-weight: 700;
    line-height: 18px;
    margin-bottom: 5px;
    overflow: hidden;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap
}

.filter-items-active {
    display: none
}

@media (min-width:768px) {
    .filter-items-active {
        color: #4a5b68;
        display: block;
        font-size: 13px;
        margin-bottom: 16px;
        margin-top: 16px
    }
}

.tippy-popper .filter-items-active {
    display: none
}

.filter-mobile-top {
    align-items: center;
    display: flex;
    padding: 8px 8px 0
}

@media (min-width:1200px) {
    .filter-mobile-top {
        padding: 8px 0
    }
}

.filter-group-content {
    display: none;
    margin-top: 15px;
    position: relative
}

.expanded .filter-group-content {
    display: block
}

.filter-group-content.loading .loader-wrapper {
    align-items: center;
    background: #fff;
    content: "";
    display: flex;
    height: 100%;
    justify-content: center;
    left: 0;
    padding-bottom: 5px;
    padding-top: 5px;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 3
}

.filter-group-content.loading .loader {
    display: block
}

.filter-group-content .loader {
    display: none
}

.filter-group-content-scrollable {
    max-height: 240px;
    overflow-x: hidden;
    overflow-y: auto !important;
    position: relative
}

.cgf-facet-counter {
    color: #007dff;
    font-size: 13px;
    margin: 0 15px 0 auto
}

.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: #19232c;
    cursor: pointer;
    display: flex;
    font-size: 12px;
    height: 32px;
    min-height: 28px;
    position: relative;
    width: 100%
}

    .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 10px
        }

    .cgf-item.active {
        background: #e3e7ef;
        text-decoration: none
    }

        .cgf-item.active .cgf-facet-counter {
            display: none
        }

        .cgf-item.active .cg-checkbox input:checked + span .checked {
            display: block
        }

@media (min-width:1200px) {
    .cgf-item:hover {
        background: #e3e7ef;
        text-decoration: none
    }

        .cgf-item:hover .cg-checkbox input:checked + span .checked {
            display: block
        }
}

.cgf-item svg:not(.rep-badge) {
    fill: #a2aeb7
}

.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 10px;
    position: relative;
    width: 16px
}

    .cg-expandbox svg {
        fill: #7b8c98
    }

.filter-group-expandable.is-expanded .expandable-content {
    display: block
}

.filter-group-expandable.is-expanded .filter-item-expandable .filter-group-content-item-number {
    display: none
}

.filter-group-expandable.is-expanded .filter-item-expandable .filter-group-label {
    font-weight: 700
}

.filter-group-expandable.is-expanded .minus {
    display: block
}

.filter-group-expandable .expandable-content, .filter-group-expandable.is-expanded .plus {
    display: none
}

    .filter-group-expandable .expandable-content .cgf-item {
        padding-left: 22px
    }

.cgf-item .filter-group-label {
    color: #27343f
}

.filter-group-counter {
    align-items: center;
    background: #22b573;
    border-radius: 8px;
    color: #fff;
    display: flex;
    font-size: 11px;
    font-weight: 700;
    height: 15px;
    margin: 0 0 0 4px;
    min-width: 15px;
    padding: 2px 6px
}

    .filter-group-counter:empty {
        display: none
    }

.filter-item-expandable {
    align-items: center;
    color: #4a5b68;
    cursor: pointer;
    display: flex;
    font-size: 12px;
    min-height: 28px;
    position: relative
}

    .filter-item-expandable .minus {
        display: none
    }

    .filter-item-expandable .plus {
        display: block
    }

@media (min-width:1200px) {
    .filter-item-expandable:hover {
        background: #e3e7ef
    }
}

.filter-item-expandable.hidden ~ .expandable-content {
    display: none
}

.filter-header {
    display: flex;
    padding-left: 8px
}

.active .filter-header, .filter-header {
    text-align: center
}

    .filter-header svg {
        fill: #7b8c98
    }

div.filter {
    height: calc(100% - 57px);
    overflow: auto;
    transition: all .2s
}

@media (min-width:992px) {
    div.filter {
        height: calc(100% - 67px);
        padding: 32px;
        scrollbar-color: #44be4c #fff;
        scrollbar-width: thin
    }

        div.filter ::-webkit-scrollbar-track {
            background: #fff
        }
}

div.filter .additional-filters {
    border-bottom: 1px solid #cdd6dd;
    padding-bottom: 8px
}

    div.filter .additional-filters:empty {
        padding-bottom: 0
    }

div.filter .hr {
    background: #cdd6dd;
    display: block;
    height: 1px;
    margin-top: 8px
}

div.filter .active-filter-groups {
    padding-left: 8px
}

@media (min-width:1200px) {
    div.filter .active-filter-groups {
        padding-left: 0
    }
}

.filter-modal-link {
    align-items: center;
    background: #fff;
    border: 1px solid #4a5b68;
    border-radius: 3px;
    color: #000;
    cursor: pointer;
    display: flex;
    flex: 1;
    font-family: neo-sans,sans-serif;
    font-size: 13px;
    justify-content: center;
    padding: 7px 10px;
    text-align: center;
    text-decoration: none
}

    .filter-modal-link:last-child {
        margin-left: 5px
    }

@media (min-width:768px) {
    .filter-modal-link {
        font-size: 15px;
        line-height: 18px
    }
}

.filter-modal-link svg {
    fill: #7b8c98
}

.filter-modal-link.active {
    border-color: #22b573
}

    .filter-modal-link.active svg {
        fill: #22b573
    }

.header-breadcrumb {
    display: none;
    font-family: Noto Sans,Sans-Serif;
    padding: 10px 0;
    position: relative;
    width: 100%;
    z-index: 3
}

    .header-breadcrumb svg {
        fill: #4a5b68
    }

@media (min-width:768px) {
    .header-breadcrumb {
        align-items: flex-start;
        display: flex
    }
}

.header-breadcrumb a {
    align-items: center;
    color: #4a5b68;
    display: inline-flex;
    font-size: 12px;
    line-height: 16px;
    padding-left: 4px;
    position: relative;
    text-decoration: none;
    white-space: nowrap
}

    .header-breadcrumb a.active, .header-breadcrumb a:hover {
        color: #44be4c
    }

        .header-breadcrumb a.active svg.home, .header-breadcrumb a:hover svg.home {
            fill: #44be4c
        }

    .header-breadcrumb a.active {
        font-weight: 700
    }

    .header-breadcrumb a:first-child {
        padding-left: 0
    }

        .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-left: 4px;
    position: relative
}

.header-breadcrumb.header-breadcrumb-dark, .header-breadcrumb.header-breadcrumb-dark span.item {
    color: #cdd6dd
}

    .header-breadcrumb.header-breadcrumb-dark a {
        color: #e3e7ef
    }

    .header-breadcrumb.header-breadcrumb-dark svg {
        fill: #e3e7ef
    }

.casino-card-mini {
    background: #fff;
    border: 1px solid #cdd6dd;
    border-radius: 2px;
    box-shadow: 0 1px 0 #e3e7ef;
    display: flex;
    flex: 1 0 100%;
    font-size: 12px;
    height: 84px;
    line-height: 16px;
    margin: 4px 0;
    overflow: hidden;
    position: relative
}

@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 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
}

    .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;
    max-height: 32px;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -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: #44be4c
    }

.casino-card-mini .name {
    color: #19232c;
    display: -webkit-box;
    font-family: neo-sans,sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
    overflow: hidden;
    white-space: nowrap;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

    .casino-card-mini .name .num {
        flex: 0 0 20px
    }

.casino-card-mini .feature {
    color: #4a5b68;
    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 #7528ab;
    color: #7528ab
}

    .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: #7528ab;
        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: #7528ab
    }

@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: #27343f;
    border: 1px solid hsla(0,0%,100%,.1);
    box-shadow: inset 0 0 1px 1px hsla(0,0%,100%,.1);
    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 .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: #27343f;
        border-left: 4px solid #27343f;
        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 #4a5b68;
    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: #27343f;
    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
    }
}

.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-20, .game-slider-panel .neo-fs-20 a {
    color: #e3e7ef
}

    .game-slider-panel .neo-fs-20 a:hover {
        color: #44be4c
    }

.game-slider-panel .slider-name {
    margin-right: 16px;
    min-height: 36px
}

    .game-slider-panel .slider-name .tag-new {
        top: -12px
    }

.game-slider-panel-icon {
    height: 22px;
    margin-right: 10px;
    width: 22px;
    fill: #44be4c;
    flex-shrink: 0
}

@media (min-width:568px) {
    .game-slider-panel-icon {
        height: 26px;
        width: 26px
    }
}

@media (min-width:992px) {
    .game-slider-panel-icon {
        height: 30px;
        width: 30px
    }
}

.desktop-slider-panel > .neo-fs-20 {
    margin: 16px 0
}

@media (min-width:768px) {
    .desktop-slider-panel > .neo-fs-20 {
        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) {
    .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 {
    opacity: 1
}

.game-item:hover .game-item-img > img {
    transform: scale(1.1);
    transform-origin: center
}

.game-item:hover .overlay-text {
    transform: translateY(0)
}

.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 #5dd667;
    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
}

    .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;
    -webkit-backface-visibility: hidden;
    border-radius: 2px;
    display: none;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    left: 0;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    transition: all .2s ease-in-out;
    width: 100%;
    z-index: 3
}

@media (min-width:768px) {
    .game-item-overlay {
        display: flex
    }
}

.game-item-overlay:before {
    -webkit-backface-visibility: hidden;
    background: rgba(0,0,0,.7);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transform: scale(1.1);
    width: 100%;
    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;
    left: 16px;
    padding-right: 32px;
    position: absolute;
    top: 8px;
    transform: translateY(50px);
    transition: transform .2s ease-in-out;
    z-index: 3
}

@media (min-width:768px) {
    .game-item-overlay .overlay-text {
        font-size: 14px
    }
}

.game-item-overlay .overlay-loader {
    background: #19232c;
    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: #131a21;
    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: #44be4c
}

    .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: #44be4c
    }

@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: #19232c;
    padding: 1px 0
}

    .section-dark .active-filter-groups {
        color: #cdd6dd
    }

.game-filter-sort {
    color: #fff;
    text-align: right
}

    .game-filter-sort input {
        display: none
    }

        .game-filter-sort input:checked + label {
            color: #44be4c
        }

    .game-filter-sort label {
        color: #cdd6dd;
        cursor: pointer;
        margin: 0 5px
    }

        .game-filter-sort label:hover {
            text-decoration: underline
        }

    .game-filter-sort > * {
        display: inline-block;
        vertical-align: middle
    }

.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 #4a5b68;
    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: #44be4c
    }

        .game-provider-info-panel .provider-stats .provider-btn:hover svg {
            fill: #44be4c
        }

.game-provider-info-panel .provider-stats svg {
    fill: #cdd6dd
}

.game-provider-info-panel .provider-stats .icon {
    fill: #44be4c
}

.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 .flickity-button {
    background: #19232c;
    border: 1px solid #4a5b68;
    border-radius: 2px;
    bottom: 0;
    height: 100%;
    top: 0;
    transform: none;
    width: 30px
}

    .games-top-filters .flickity-button:disabled {
        opacity: 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: #19232c
}

    .games-top-filters .flickity-prev-next-button:hover .flickity-button-icon {
        fill: #44be4c
    }

.games-top-filters .flickity-prev-next-button.next {
    background: #19232c;
    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: #19232c;
    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: #4a5b68;
    transition: none
}

    .games-top-filters .btn-border-white:hover {
        color: #44be4c
    }

        .games-top-filters .btn-border-white:hover svg {
            fill: #44be4c
        }

.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 .game-genre-icon {
        fill: #44be4c
    }

    .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 #44be4c;
    color: #44be4c
}

    .game-type-item.active svg {
        fill: #44be4c
    }

    .game-type-item.active .facet-counter {
        display: none
    }

.game-type-item:hover {
    background: rgba(123,140,152,.2)
}

.filter-adv-button {
    background: transparent;
    cursor: pointer;
    white-space: normal
}

    .filter-adv-button.active .active-filter-items-num {
        display: block
    }

    .filter-adv-button .game-genre-icon {
        fill: #fff
    }

.active-filter-items-num {
    background: #44be4c;
    border-radius: 2px;
    color: #fff;
    display: none;
    font-size: 12px;
    line-height: 14px;
    padding: 4px;
    position: absolute;
    right: 4px;
    top: 4px
}

.game-section-header {
    padding-bottom: 16px
}

@media (min-width:1200px) {
    .game-section-header {
        padding-bottom: 24px
    }
}

.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
}

.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-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 h1 {
    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: #44be4c
        }
}

.games-box-wrapper {
    margin: 0 auto;
    max-width: 1152px;
    position: relative;
    width: 100%
}

@media (max-width:1168px) {
    .games-box-wrapper {
        max-width: 1152px;
        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: 1168px;
    padding: 16px 12px 8px;
    position: relative;
    width: 100%
}

    .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: #44be4c;
        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 {
        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 12px
    }

        .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: 50px;
        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 12px;
        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: #44be4c;
        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: #44be4c;
            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 #7528ab
}

.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-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 12px;
    text-align: left
}

    .games-box-btn-main:hover {
        background: linear-gradient(270deg,#0f8815,#21c12e)
    }

        .games-box-btn-main:hover svg {
            fill: #44be4c
        }

        .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: #44be4c
    }

.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 #4a5b68;
    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: #44be4c
}

.btn-icon-link:hover {
    color: #44be4c;
    cursor: pointer
}

    .btn-icon-link:hover svg {
        fill: #44be4c
    }

.btn-icon-link svg {
    flex-shrink: 0;
    fill: #fff
}

@media (min-width:768px) {
    .btn-icon-link svg {
        height: 24px;
        width: 24px
    }
}

.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 #4a5b68;
    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: #44be4c
}

    .btn-game:hover svg, .btn-game:hover > svg {
        fill: #44be4c
    }

@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: #44be4c
    }

.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: #ed3445
}

.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-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
}

.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: 16px;
    font-weight: 700;
    justify-content: center;
    line-height: 19px;
    margin-top: 8px;
    padding: 8px 16px
}

@media (min-width:568px) {
    .games-box-btn-secondary {
        height: 50px
    }
}

.games-box-btn-secondary:hover {
    background: linear-gradient(90deg,#a752ff,#4c1287)
}

.game-detail-controls {
    background: #19232c;
    display: flex;
    flex-direction: column;
    font-family: neo-sans,sans-serif;
    font-size: 12px;
    justify-content: space-between;
    margin: auto;
    max-width: 1168px;
    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: #44be4c
        }

.games-box-header-switch-exit-fullscreen {
    display: none
}

.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;
    background: #e3e7ef;
    border: 1px solid #e3e7ef;
    border-radius: 2px;
    display: flex;
    flex: 1 0 calc(33.3% - 4px);
    flex-direction: column;
    font-family: Noto Sans,Sans-Serif;
    font-size: 10px;
    justify-content: center;
    line-height: 14px;
    margin: 0;
    min-height: 50px;
    padding: 2px;
    position: relative;
    text-align: center
}

    .casino-game-genre-item.active {
        background: #fff
    }

    .casino-game-genre-item .availability-icon {
        height: 12px;
        position: absolute;
        right: 2px;
        top: 2px;
        width: 12px
    }

    .casino-game-genre-item .game-genre-icon {
        height: 18px;
        width: 18px
    }

.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: #44be4c
    }

.casino-game-genre-items-ul {
    display: flex;
    gap: 4px;
    overflow-x: scroll;
    position: relative
}

@media (min-width:768px) {
    .casino-game-genre-items-ul {
        flex-wrap: wrap;
        overflow: auto
    }
}

.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 .icon {
    margin-right: 4px;
    fill: #19232c
}

@media (min-width:568px) {
    .safety-index .icon {
        height: 24px;
        width: 24px
    }
}

.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-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: center;
    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 {
        font-size: 16px;
        line-height: 20px;
        padding: 16px
    }
}

.warning div {
    display: flex
}

.warning .description {
    display: none;
    font-size: 14px;
    padding-top: 8px
}

.warning .hideable-link {
    color: #44be4c
}

    .warning .hideable-link:hover {
        color: #3ca143;
        cursor: pointer;
        text-decoration: underline
    }

.warning .icon {
    align-self: start;
    margin-right: 8px
}

@media (min-width:568px) {
    .warning .icon {
        margin-right: 16px
    }
}

.warning .icon svg {
    height: 22px;
    width: 22px
}

@media (min-width:568px) {
    .warning .icon svg {
        height: 24px;
        width: 24px
    }
}

.warning .expand {
    align-self: start;
    margin: 4px 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;
    min-height: 22px
}

.warning-important {
    border: none
}

    .warning-important .icon {
        margin-right: 4px
    }

.warnings .warning {
    margin-bottom: 4px
}

@media (min-width:992px) {
    .warnings .warning {
        margin-bottom: 8px
    }
}

.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
}

.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: #19232c;
    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: #44be4c
    }

    .expandable-box:hover .down, .expandable-box:hover .up {
        fill: #44be4c
    }
}

@media (min-width:568px) {
    .expandable-box {
        font-size: 16px;
        line-height: 20px
    }
}

@media (min-width:768px) {
    .expandable-box {
        max-width: 630px
    }
}

.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 strong, .expandable-box > h3, .expandable-box > span.text-bold, .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: #44be4c
    }

    .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: #44be4c
    }

.expandable-box .up {
    display: none
}

.expandable-box .down, .expandable-box .up {
    fill: #4a5b68;
    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: #19232c;
    display: none;
    margin-bottom: 16px
}

.expandable-box a {
    color: #44be4c
}

    .expandable-box a:hover {
        color: #3ca143;
        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 #4a5b68;
    box-shadow: none;
    color: #f0f3f7
}

    .expandable-box-dark .expandable-box-content {
        color: #f0f3f7
    }

.results-header-top {
    color: #333;
    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: #4a5b68;
    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: #19232c;
    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: #44be4c
    }

.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: #4a5b68;
    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: #44be4c;
    box-shadow: 0 0 5px #44be4c,0 0 2px #44be4c
}

.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: #19232c;
    display: flow-root;
    overflow: hidden;
    position: relative
}

    .section-header-dark .list-section-heading {
        color: #fff
    }

    .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: #44be4c
            }

                .section-header-dark .header-breadcrumb a.active svg.home, .section-header-dark .header-breadcrumb a:hover svg.home {
                    fill: #44be4c
                }

        .section-header-dark .header-breadcrumb svg {
            fill: #e3e7ef
        }

.section-header-darker {
    background: #131a21
}

.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 16px
    }
}

@media (min-width:1200px) {
    .cg-tabs-main {
        margin: auto;
        max-width: 1200px
    }
}

.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: #4a5b68;
    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: #4a5b68;
    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: #44be4c
}

    .cg-tab-main.active svg, .cg-tab-main:hover svg {
        fill: #44be4c
    }

.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
}

.news-items-wrapper {
    display: grid;
    gap: 12px;
    margin: 16px auto
}

@media (min-width:568px) {
    .news-items-wrapper {
        gap: 16px;
        grid-template-columns: repeat(2,1fr)
    }
}

@media (min-width:768px) {
    .news-items-wrapper {
        grid-template-columns: repeat(3,1fr)
    }
}

@media (min-width:1200px) {
    .news-items-wrapper {
        gap: 16px 24px;
        grid-template-columns: repeat(4,1fr)
    }
}

.news-items-wrapper .sp-carousel-card-wrapper {
    flex: initial;
    margin: auto;
    width: auto
}

@media (min-width:768px) {
    .news-items-wrapper .sp-carousel-card-wrapper {
        flex: initial;
        width: auto
    }
}

@media (min-width:992px) {
    .news-items-wrapper .sp-carousel-card-wrapper {
        flex: initial;
        width: auto
    }
}

.news-grid-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin: 0 auto;
    width: 100%
}

.news-item-img-placeholder {
    padding-bottom: 77%;
    position: relative
}

    .news-item-img-placeholder.news-casino-img-placeholder {
        padding-bottom: 100%
    }

        .news-item-img-placeholder.news-casino-img-placeholder img {
            width: 100%
        }

    .news-item-img-placeholder img {
        position: absolute
    }

.news-item-img {
    height: 100%;
    left: 50%;
    transform: translate(-50%)
}

.news-item-body {
    overflow: hidden;
    padding: 24px;
    position: relative;
    transition: all .2s ease-in-out
}

.news-item-perex {
    color: #19232c;
    font-size: 16px;
    line-height: 24px;
    margin: 4px 0 0;
    -webkit-mask-image: -webkit-gradient(linear,left 70%,left bottom,from(#000),to(hsla(0,0%,100%,0)));
    position: relative;
    white-space: normal
}

@media (min-width:568px) {
    .news-item-perex {
        max-height: 96px;
        overflow: hidden
    }
}

.news-item-dark {
    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)
}

    .news-item-dark .created-date {
        color: #cdd6dd
    }

    .news-item-dark .news-item-heading {
        color: #f0f3f7 !important
    }

    .news-item-dark .news-item-body {
        color: #e3e7ef !important
    }

    .news-item-dark .news-item-perex {
        color: #f0f3f7 !important
    }

.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: #19232c;
    border: 1px solid #4a5b68;
    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: #44be4c
        }

    .custom-carousel-btn.is-disabled {
        background: #19232c;
        box-shadow: none
    }

        .custom-carousel-btn.is-disabled svg {
            fill: #4a5b68
        }

.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: 80%;
    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,#131a21,rgba(19,26,33,0));
        left: 0
    }

    .game-list-top-carousel-wrapper .cg-shadow.right {
        background: linear-gradient(-90deg,#131a21,rgba(19,26,33,0));
        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 {
    padding: 8px;
    fill: #fff;
    align-items: center;
    border: 1px solid #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    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: #000;
    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-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
    }


