@font-face {
    font-display: block;
    font-family: "icons";
    font-style: normal;
    font-weight: normal;
    src: url("icons.woff2?aserg5") format("woff2"), url("/assets/fonts/icons.woff?aserg5") format("woff")
}

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

.icon-open-fullscreen::before {
    content: ""
}

.icon-close-fullscreen::before {
    content: ""
}

.icon-burger-new::before {
    content: ""
}

.icon-add-below::before {
    content: ""
}

.icon-drag-arrow::before {
    content: ""
}

.icon-logout-new::before {
    content: ""
}

.icon-mycasinos::before {
    content: ""
}

.icon-profile::before {
    content: ""
}

.icon-stories::before {
    content: ""
}

.icon-thumb-new::before {
    content: ""
}

.icon-bojoko-b::before {
    content: ""
}

.icon-custom-options::before {
    content: ""
}

.icon-select::before {
    content: ""
}

.icon-sort::before {
    content: ""
}

.icon-linkedin::before {
    content: ""
}

.icon-play::before {
    content: ""
}

.icon-burger::before {
    content: ""
}

.icon-cross::before {
    content: ""
}

.icon-minus::before {
    content: ""
}

.icon-arrow-right-2::before {
    content: ""
}

.icon-reply::before {
    content: ""
}

.icon-heart-bubble::before {
    content: ""
}

.icon-thumb::before {
    content: ""
}

.icon-image::before {
    content: ""
}

.icon-undo::before {
    content: ""
}

.icon-dots::before {
    content: ""
}

.icon-search::before {
    content: ""
}

.icon-settings::before {
    content: ""
}

.icon-notifications::before {
    content: ""
}

.icon-preview::before {
    content: ""
}

.icon-quote::before {
    content: ""
}

.icon-clear::before {
    content: ""
}

.icon-heart-filled::before {
    content: ""
}

.icon-heart::before {
    content: ""
}

.icon-banking::before {
    content: ""
}

.icon-bonuses::before {
    content: ""
}

.icon-casinos::before {
    content: ""
}

.icon-home::before {
    content: ""
}

.icon-reviews::before {
    content: ""
}

.icon-slots::before {
    content: ""
}

.icon-editor-html::before {
    content: ""
}

.icon-editor-hyperlink::before {
    content: ""
}

.icon-editor-removehyperlink::before {
    content: ""
}

.icon-editor-image::before {
    content: ""
}

.icon-editor-quote::before {
    content: ""
}

.icon-editor-ul::before {
    content: ""
}

.icon-editor-ol::before {
    content: ""
}

.icon-editor-underline::before {
    content: ""
}

.icon-editor-bold::before {
    content: ""
}

.icon-editor-cursive::before {
    content: ""
}

.icon-editor-h2::before {
    content: ""
}

.icon-editor-h3::before {
    content: ""
}

.icon-editor-h4::before {
    content: ""
}

.icon-editor-clearformatting::before {
    content: ""
}

.icon-view::before {
    content: ""
}

.icon-edit::before {
    content: ""
}

.icon-trash::before {
    content: ""
}

.icon-logout::before {
    content: ""
}

.icon-camera::before {
    content: ""
}

.icon-triangle-down::before {
    content: ""
}

.icon-triangle-up::before {
    content: ""
}

.icon-triangle-right::before {
    content: ""
}

.icon-arrow-down::before {
    content: ""
}

.icon-arrow-up::before {
    content: ""
}

.icon-arrow-left::before {
    content: ""
}

.icon-arrow-right::before {
    content: ""
}

.icon-plus::before {
    content: ""
}

.icon-user-bubble::before {
    content: ""
}

.icon-smiley-sad::before {
    content: ""
}

.icon-circle-help::before {
    content: ""
}

.icon-circle-close::before {
    content: ""
}

.icon-circle-exclamation::before {
    content: ""
}

.icon-circle-success::before {
    content: ""
}

.icon-circle-info::before {
    content: ""
}

.icon-circle-error::before {
    content: ""
}

.icon-warning::before {
    content: ""
}

.icon-facebook::before {
    content: ""
}

.icon-twitter::before {
    content: ""
}

.icon-instagram::before {
    content: ""
}

.icon-rumble::before {
    content: ""
}

.icon-circle-plus::before {
    content: ""
}

.icon-email {
    transform: scale(1.15);
    content: url(/assets/img/svg/mail-icon.svg)
}

.svg-facebook {
    content: url(/assets/img/svg/facebook-icon.svg)
}

.svg-linkedin {
    content: url(/assets/img/svg/linkedin-icon.svg)
}

.svg-youtube {
    content: url(/assets/img/svg/youtube-icon.svg)
}

.icon-toplist-card-badge {
    content: url(/assets/img/toplist-card-badge-icon.png)
}

[class*=icon-colored-] {
    display: inline-block;
    height: 1.5rem;
    width: 1.5rem
}

[class*=icon-colored-]::after {
    display: block
}

[class*=icon-flag-] {
    display: inline-block;
    height: 1.5rem;
    width: 1.5rem
}

[class*=icon-flag-]::after {
    display: block
}

.icon-flag-us::after {
    content: url("/assets/img/svg/flags/en_US.UTF-8.svg")
}

.icon-flag-est::after {
    content: url("/assets/img/svg/flags/flag-estonia.svg")
}

.icon-flag-ca::after {
    content: url("/assets/img/svg/flags/flag-canada.svg")
}

.icon-flag-uk::after {
    content: url("/assets/img/svg/flags/flag-uk.svg")
}

.icon-flag-gb::after {
    content: url("/assets/img/svg/flags/flag-uk.svg")
}

.icon-flag-ca-round::after {
    content: url("/assets/img/svg/flags/flag-canada-round.svg")
}

.icon-flag-uk-round::after {
    content: url("/assets/img/svg/flags/flag-uk-round.svg")
}

.icon-flag-gb-round::after {
    content: url("/assets/img/svg/flags/flag-uk-round.svg")
}

.icon-colored-eye::after {
    content: url("/assets/img/page-preview.svg")
}

.icon-colored-unchecked::after {
    content: url("/assets/img/icon/checkbox-not-checked.svg")
}

.icon-colored-checked::after {
    content: url("/assets/img/icon/checkbox-checked.svg")
}

.icon-colored-exclamation::after {
    content: url("/assets/img/svg/icon-exclamantionmark.svg")
}

.icon-colored-edit::after {
    content: url("/assets/img/svg/icon-edit.svg")
}

.icon-colored-1st-reviews::after {
    content: url("/assets/img/svg/icon-1st-reviews.svg")
}

.icon-colored-reviews::after {
    content: url("/assets/img/svg/icon-reviews.svg")
}

.icon-colored-checkbox::after {
    content: url("/assets/img/svg/checkbox-non-active.svg")
}

.icon-colored-checkbox-active::after {
    content: url("/assets/img/svg/checkbox-active.svg")
}

.icon-colored-heart::after {
    content: url("/assets/img/svg/fp-heart-bubble.svg")
}

.icon-colored-bojoko-b::after {
    content: url("/assets/img/svg/bojoko-b.svg")
}

:root {
    --cb: cubic-bezier(0.465, 0.183, 0.153, 0.946)
}

* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    outline: none
}

[hidden] {
    display: none !important
}

#darken-page {
    animation: fade-in .5s;
    animation-delay: .5s;
    animation-fill-mode: both;
    animation-iteration-count: 1;
    background: rgba(0, 0, 0, .7);
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 99999
}

button, .button, [type=submit] {
    cursor: pointer
}

.scrollbar-measure {
    height: 100px;
    overflow: scroll;
    position: absolute;
    top: -9999px;
    width: 100px
}

html {
    -webkit-overflow-scrolling: touch;
    overflow-x: hidden;
    overflow-y: scroll;
    scroll-behavior: smooth;
    touch-action: manipulation;
    width: 100%
}

html.no--scroll {
    overflow: hidden
}

@media (max-width: 1025px) {
    html body::after {
        background: rgba(0, 0, 0, 0);
        content: " ";
        transition: background .4s ease
    }

    html.no-scroll, html.no--scroll {
        height: 100%;
        overflow: hidden
    }

    html.no-scroll body, html.no--scroll body {
        position: relative
    }
}

body {
    color: #5b5b5b;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    font: 16px system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Ubuntu", "Google Sans", "Noto Sans", "Droid Sans", "Roboto", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    height: auto;
    margin: 0;
    min-height: 100vh;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
    width: 100%
}

@media (max-width: 1025px) {
    body {
        display: block
    }
}

hr {
    background: #dcdcdc;
    border: 0;
    height: 1px;
    width: 100%
}

.page .content {
    padding-top: 10px
}

.page .top-author-info {
    font-size: .8rem
}

@media (min-width: 901px) {
    .page h1 {
        font-size: 2.5rem
    }
}

@media (max-width: 420px) {
    .page h1 {
        font-size: 1.8rem;
        margin-bottom: .15em
    }
}

.review .content {
    padding-top: 10px
}

.show-more-shortcode {
    position: relative
}

.show-more-shortcode__content {
    height: 2.5em;
    overflow: hidden;
    display: block
}

.show-more-shortcode__toggle {
    text-transform: initial;
    align-self: end;
    position: absolute;
    right: 0;
    bottom: 0;
    background: #fff;
    z-index: 2;
    font-size: 1rem;
    color: #ff851b;
    border: 0;
    padding: 0;
    line-height: 1.4
}

.show-more-shortcode__toggle::before {
    z-index: 1;
    content: "... ";
    background: #fff;
    padding-right: 8px;
    padding-left: 6px;
    color: #999;
    pointer-events: none;
    position: absolute;
    right: 99%
}

.show-more-shortcode__text-close {
    display: none
}

@media (max-width: 600px) {
    .show-more-shortcode__content {
        height: 4em;
        word-break: inherit
    }
}

.show-more-shortcode--open .show-more-shortcode__content {
    height: 100%
}

.show-more-shortcode--open .show-more-shortcode__toggle {
    display: block;
    position: initial;
    margin-left: auto
}

.show-more-shortcode--open .show-more-shortcode__toggle::before {
    content: ""
}

.show-more-shortcode--open .show-more-shortcode__text-close {
    display: inherit
}

.show-more-shortcode--open .show-more-shortcode__text-open {
    display: none
}

p, ol, ul {
    font-size: var(--normal-font-size);
    margin-bottom: 16px;
    line-height: 28px;
    text-align: start;
}

.no-padding-top {
    padding-top: 0 !important
}

img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
}

picture img {
    border-radius: 14px;
    margin: 20px auto;
}

/*img {
    height: auto;
    max-width: 100%;
    vertical-align: top
}*/

img.fullwidth {
    display: block;
    margin: 20px auto
}

img.blur {
    filter: blur(15px)
}

iframe {
    border: none
}

.content {
    flex: 1 0 auto;
    font-weight: 400;
    line-height: 1.5;
    margin: auto;
    max-width: 1024px;
    padding: 40px 0;
    width: 100%
}

@media (max-width: 1055px) {
    .content {
        padding: 10px 15px
    }
}

.content.narrow {
    width: 800px;
    margin: auto
}

.content .main {
    min-width: 0
}

.content.no-vertical-padding {
    padding: 0
}

@media (max-width: 1025px) {
    .content.no-vertical-padding {
        padding: 0 15px
    }
}

.content iframe {
    -webkit-border-radius: 8px;
    border-radius: 8px;
    float: right;
    margin-bottom: 40px;
    margin-left: 30px;
    -webkit-mask-image: -webkit-radial-gradient(circle, #fff 100%, #000 100%);
    max-width: 100%;
    overflow: hidden;
    -webkit-transform: translateZ(0)
}

@media (max-width: 1000px) {
    .content iframe {
        float: none;
        height: 50vw;
        margin-bottom: 0;
        margin-left: 0;
        width: 100%
    }
}

.content img.float-left {
    margin: 0 15px 10px 0
}

.content img.float-right {
    margin: 0 0 10px 15px
}

@media (max-width: 640px) {
    .content img.float-left, .content img.float-right {
        display: block;
        float: none;
        margin: 10px auto
    }
}

@media (min-width: 641px)and (max-width: 790px) {
    .content img.float-left, .content img.float-right {
        width: 50%
    }
}

.content img.w60 {
    max-width: 60%
}

.content img.w70 {
    max-width: 70%
}

.content img.w80 {
    max-width: 80%
}

.content img.w90 {
    max-width: 90%
}

@media (max-width: 1024px) {
    .content img.w60, .content img.w70, .content img.w80, .content img.w90 {
        max-width: 100%
    }
}

.content img.center {
    display: block;
    float: none;
    margin: auto
}

.content .rounded {
    background: #fff;
    border-radius: 15px;
    padding: 10px
}

@media (max-width: 1025px) {
    .content .rounded {
        padding: 0
    }
}

.content .main.with-shadow, .content .side.with-shadow {
    box-shadow: 0 4px 6px 0 rgba(0, 0, 0, .4)
}

.float-left {
    float: left
}

.float-right {
    float: right
}

.hide-desktop {
    display: inherit
}

@media (min-width: 1026px) {
    .hide-desktop {
        display: none !important
    }
}

.hide-mobile {
    display: inherit
}

@media (max-width: 1025px) {
    .hide-mobile {
        display: none !important
    }
}

.overflow-wrapper {
    display: block;
    overflow-x: auto;
    width: 100%
}

.indent {
    margin-left: 20%
}

.separator {
    background: #f6f6f6 linear-gradient(to bottom, #f6f6f6 0%, #fff 100%);
    display: block;
    margin: 20px 0;
    min-height: 40px
}

input, textarea, select {
    color: #171717;
    font: 300 1rem system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Ubuntu", "Google Sans", "Noto Sans", "Droid Sans", "Roboto", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"
}

input:not([type=checkbox]):not([type=radio]), textarea {
    -webkit-appearance: none
}

textarea {
    resize: vertical
}

.uppercase, .uc {
    text-transform: uppercase
}

.clearfix {
    clear: both
}

.quote {
    font-size: 1.8em;
    margin: 30px 0 30px 120px;
    position: relative
}

.quote .author {
    color: #bfbfbf;
    font-size: 18px;
    font-style: italic;
    margin-top: 15px;
    text-align: right
}

.quote::before {
    color: #ff851b;
    content: "";
    font-family: "icons" !important;
    position: absolute;
    top: 0;
    transform: translateX(-60px)
}

@media (max-width: 1025px) {
    .quote {
        font-size: 1.4em;
        margin: 30px 0 30px 70px
    }

    .quote .author {
        font-size: 16px
    }
}

@media (max-width: 700px) {
    .quote {
        margin: 30px 0 30px 60px
    }

    .quote::before {
        transform: translateX(-50px)
    }
}

@media (max-width: 400px) {
    .quote {
        font-size: 1.2em;
        margin: 30px 0 30px 40px
    }

    .quote::before {
        transform: translateX(-40px)
    }
}

.caption {
    color: #383838;
    font-weight: 600;
    font-size: 1em;
    line-height: 125%;
    margin: -15px 15px 30px;
    text-align: left
}

.fp .swap-order > :first-child {
    margin-bottom: 30px
}

.fp nav.content-nav {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    padding: 15px
}

.fp nav.content-nav a {
    font-size: 1.2rem;
    font-weight: 400;
    padding: 0 5px;
    white-space: nowrap
}

.fp nav.content-nav .sep {
    align-items: center;
    display: flex
}

@media (max-width: 600px) {
    .swap-order {
        display: flex;
        flex-flow: column
    }

    .swap-order > :first-child {
        margin-bottom: 0 !important;
        order: 2
    }
}

:target {
    scroll-margin-top: 90px
}

@media (max-width: 1025px) {
    :target {
        scroll-margin-top: 75px
    }
}

.block {
    display: block
}

.flex {
    display: flex
}

.flex.row {
    flex-flow: row
}

.flex.center {
    justify-content: center
}

.section-with-image {
    margin: 1.5em 0
}

.section-with-image > p {
    margin-top: 10px;
    text-align: center
}

@media (max-width: 320px) {
    .section-with-image > p img {
        width: 250px
    }
}

.section-with-image > img {
    display: block;
    margin: 10px auto 0;
    text-align: center
}

@media (min-width: 600px) {
    .section-with-image {
        display: grid;
        grid-gap: 20px;
        grid-template-columns:1fr 300px
    }
}

.content-center {
    padding: 9px 15px 15px;
    text-align: center
}

.template, template {
    display: none
}

.value-attr::after {
    content: attr(data-value)
}

.value-attr-before::before {
    content: attr(data-value)
}

.avatar.with-progress-bar {
    background: #eee;
    border-radius: 50%;
    display: flex;
    flex-shrink: 0;
    -webkit-mask-image: -webkit-radial-gradient(circle, #fff, #000);
    mask-image: -webkit-radial-gradient(circle, #fff, #000);
    overflow: hidden;
    padding: 12px;
    position: relative
}

.avatar.with-progress-bar::before {
    animation-delay: .4s;
    background: #fff;
    border-radius: 50%;
    bottom: 0;
    box-shadow: 0 4px 6px 0 rgba(0, 0, 0, .5);
    content: "";
    display: block;
    left: 0;
    margin: 12px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1
}

.avatar.with-progress-bar img {
    background: rgba(0, 0, 0, 0);
    border-radius: 50%;
    padding: 2px;
    position: relative;
    z-index: 2
}

[data-modal-open] {
    cursor: pointer
}

.tab-container .tab:not(.active) {
    display: none
}

[data-propagate-click] {
    cursor: pointer
}

@keyframes fade-in {
    from {
        opacity: 0
    }
}

@keyframes slide-down {
    from {
        transform: scaleY(0);
        transform-origin: 50% 0
    }
    to {
        transform: none;
        transform-origin: 50% 0
    }
}

@keyframes rotate {
    to {
        transform: rotate(359deg)
    }
}

.loading-animation {
    align-items: center;
    display: inline-flex;
    justify-content: space-between
}

.loading-animation i {
    animation: loading-animation 1.4s linear infinite;
    background: rgba(0, 0, 0, 0) url("/assets/img/bojoko-b.svg") 50% 50% no-repeat;
    display: block;
    height: 60px;
    margin: 5px;
    opacity: 0;
    vertical-align: bottom;
    width: 60px
}

.loading-animation i:nth-of-type(1) {
    left: -80px;
    width: 30px
}

.loading-animation i:nth-of-type(2) {
    animation-delay: .1s;
    left: -160px;
    width: 50px
}

.loading-animation i:nth-of-type(3) {
    animation-delay: .2s;
    left: -240px
}

.loading-animation i:nth-of-type(4) {
    animation-delay: .3s;
    left: -320px;
    width: 50px
}

.loading-animation i:nth-of-type(5) {
    animation-delay: .4s;
    left: -400px;
    width: 30px
}

@keyframes loading-animation {
    0% {
        opacity: 0
    }
    10% {
        opacity: 1
    }
    70% {
        opacity: 0
    }
    100% {
        opacity: 0
    }
}

@keyframes kit {
    0% {
        left: 2px;
        transform: translateX(0) rotate(-20deg)
    }
    50% {
        left: calc(100% - 2px);
        transform: translateX(-100%) rotate(20deg)
    }
    100% {
        left: 0;
        transform: translateX(0) rotate(-20deg)
    }
}

@keyframes scale-down {
    0% {
        transform: scale(1)
    }
    50% {
        transform: scale(0.9)
    }
    100% {
        transform: scale(1)
    }
}

h1, .h1, h2, h3, h4, h5 {
    text-align: center;
    color: #4d4d4d;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Ubuntu", "Google Sans", "Noto Sans", "Droid Sans", "Roboto", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    margin: 0
}

h1, h2, h3 {
    font-weight: normal;
    line-height: 1.3
}

h1, .h1 {
    font-size: 2.75em;
    line-height: 1.3
}

h1 .admin-edit, .h1 .admin-edit {
    color: #bfbfbf;
    font-size: 18px
}

h1 .admin-edit:hover, .h1 .admin-edit:hover {
    color: #ff851b
}

h2 {
    font-size: 2em
}

.page-notfound h2 {
    font-size: 1.9em
}

h3 {
    font-size: 1.4em
}

h4 {
    font-size: 1.2em
}

h4 + p {
    margin-top: 0
}

h1.center, h2.center, h3.center, h4.center, h5.center, p.center, .sub-title.center, a.center {
    text-align: center
}

h1.align-left, h2.align-left, h3.align-left, h4.align-left, h5.align-left, p.align-left, .sub-title.align-left, a.align-left {
    text-align: left
}

h1.align-right, h2.align-right, h3.align-right, h4.align-right, h5.align-right, p.align-right, .sub-title.align-right, a.align-right {
    text-align: right
}

h1.justify, h2.justify, h3.justify, h4.justify, h5.justify, p.justify, .sub-title.justify, a.justify {
    text-align: justify
}

h1.bo, h1 .bo, h2.bo, h2 .bo, h3.bo, h3 .bo, h4.bo, h4 .bo, h5.bo, h5 .bo, p.bo, p .bo, .sub-title.bo, .sub-title .bo, a.bo, a .bo {
    color: #ff851b;
    font-size: 1.35em
}

p.bottom-space {
    margin-bottom: 50px
}

.underline {
    border-bottom: 1px solid #bfbfbf
}

.text-underline {
    text-decoration: underline
}

.strikethrough {
    text-decoration: line-through
}

span.center {
    text-align: center
}

span.mediumgray {
    color: #bfbfbf
}

.strong {
    font-weight: bold
}

.bold-semi {
    font-weight: 400
}

.bold {
    font-weight: 600
}

.bold-fat {
    font-weight: 700
}

.orange {
    color: #ff851b
}

.link {
    color: #ff851b;
    cursor: pointer
}

.link:hover {
    color: #e86d13
}

.text-center {
    text-align: center
}

.sub-title {
    color: #999;
    font-size: 1.6em;
    line-height: 1.3;
    margin-bottom: 40px;
    margin-right: 0;
    margin-top: 0
}

a {
    color: #ff851b;
    text-decoration: none
}

a:hover {
    color: #e86d13
}

a img {
    vertical-align: top
}

a.slider-see-more {
    display: block;
    font-size: 1.125em;
    font-weight: 400;
    margin: 15px 0
}

.fp-sub-title * {
    display: block
}

.fp-sub-title h2 {
    font-size: 2em;
    margin-bottom: 0 !important
}

.fp-sub-title span {
    font-size: 2.5em
}

.content h1, .content h2, .content h3, .content h4 {
    margin-bottom: .25em;
    margin-top: 1.25em
}

.content h1:first-child, .content h2:first-child, .content h3:first-child, .content h4:first-child {
    margin-top: 0
}

.content .toplist-frame p, .content .content-list p, .content .card p {
    font-size: inherit
}

.content p.info-txt {
    font-size: .9em;
    font-style: italic
}

.info-txt {
    font-size: .8em
}

input + .info-txt, textarea + .info-txt {
    display: block;
    padding-right: 5px;
    text-align: right
}

@media (max-width: 900px) {
    h1, .h1 {
        font-size: 2em;
        line-height: 1.1
    }

    h2 {
        font-size: 1.5em
    }

    h3 {
        font-size: 1.3em
    }
}

table, th, td {
    border: 1px solid;
    padding: 5px;
    margin: 5px;
}

.footer {
    background-color: #eee;
    box-shadow: inset 0 20px 10px -10px #ddd;
    color: #4d4d4d;
    flex: 0 0 auto;
    font-size: .9em;
    margin-top: auto;
    padding: 40px 15px
}

.footer__wrapper {
    margin: auto;
    max-width: 1170px
}

.footer__container {
    display: flex;
    flex-flow: row wrap
}

.footer__column {
    flex: 1 0 100%;
    text-align: center;
    margin: 0 0 15px
}

.footer__column:first-child {
    margin: 0
}

.footer__column a {
    padding: 8px 0
}

@media (max-width: 899px) {
    .footer__column {
        text-align: left
    }
}

@media (min-width: 900px) {
    .footer__column {
        flex: 1 0 0;
        text-align: unset;
        margin-left: 25px
    }

    .footer__column a {
        padding: 0
    }
}

@media (max-width: 1025px) {
    .footer__column {
        display: flex;
        flex-flow: column nowrap
    }

    .footer__column a {
        padding: 5px 0
    }
}

.footer .vertical-links__title {
    font: 700 1.1em system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Ubuntu", "Google Sans", "Noto Sans", "Droid Sans", "Roboto", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    margin: 0 0 8px
}

.footer .vertical-links a {
    color: #4d4d4d;
    padding: 2px 0;
    min-height: 24px
}

.footer .vertical-links a:hover {
    color: #ff851b
}

@media (min-width: 900px) {
    .footer .vertical-links__title {
        margin: 0 0 3px
    }

    .footer .vertical-links a {
        display: block
    }
}

.footer__bottom-nav {
    margin-top: 30px;
    text-align: center
}

.footer__bottom-nav a {
    color: #999;
    margin-left: 20px
}

.footer__bottom-nav a:hover {
    color: #e86d13
}

.footer__bottom-nav a:first-child {
    margin-left: 0
}

@media (max-width: 449px) {
    .footer__bottom-nav {
        margin-top: 50px
    }
}

.footer .gamble-responsibly {
    align-items: flex-end;
    justify-content: center;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 20px
}

.footer .gamble-responsibly__link {
    color: #bfbfbf
}

.footer .gamble-responsibly__link:hover {
    color: #4d4d4d
}

.footer .gamble-responsibly__link:first-child {
    margin-left: 0
}

.footer .gamble-responsibly__link--gambleaware img {
    height: 15px
}

.footer .gamble-responsibly__link--gamcare img {
    height: 40px
}

.footer .gamble-responsibly__link--gamstop img {
    height: 16px
}

.footer .gamble-responsibly__link--play-responsibly {
    height: 11px;
    flex-basis: 100%;
    margin-left: 0
}

.footer .about-bojoko h3 {
    font-size: 1.2rem
}

.footer .about-bojoko p {
    color: #282828;
    font-size: .9rem;
    font-weight: 300;
    line-height: 1.3
}

.footer .icons {
    align-items: center;
    display: flex;
    width: 100%;
    margin-top: 10px
}

.footer .icons a:not(:first-child) {
    margin-left: 10px
}

@media (max-width: 899px) {
    .footer .icons {
        justify-content: left;
        margin-top: 35px
    }
}

@media (max-width: 1025px) {
    .footer .icons__age-limit {
        height: 40px;
        width: auto
    }
}

.footer__social {
    width: 100%;
    margin-top: 0;
    margin-bottom: 0;
    display: flex
}

.footer__social a {
    margin-left: 10px
}

.footer__social a:first-child {
    margin-left: 0
}

.footer__social-icon {
    width: 30px;
    height: 30px
}

@media (max-width: 1025px) {
    .footer__social-icon {
        width: 36px;
        height: 36px
    }
}

.footer__social-icon:hover {
    transform: scale(1.1)
}

.footer__awards {
    font-size: 2.65rem;
    color: #999;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between
}

.footer__award {
    margin-bottom: 20px;
    width: 100%
}

@media (max-width: 900px) {
    .footer__award {
        height: 2.65rem;
        width: auto
    }

    .footer__award--increased-max-height {
        height: auto;
        max-height: 5rem
    }
}

.footer__trademark {
    color: #bfbfbf;
    margin-top: 20px;
    text-align: center
}

.dmca-badge {
    color: #fff !important;
    flex: 0 0 auto;
    font: bold .61em/24px "Arial";
    text-transform: uppercase;
    gap: 0
}

.dmca-badge:hover {
    color: #fff !important
}

.dmca-badge__left {
    display: inline-block;
    background-color: #ff851b;
    border-right: 1px #fff solid;
    padding: 1px 4px
}

.dmca-badge__right {
    display: inline-block;
    background-color: #4d4d4d;
    padding: 1px 8px
}

.dmca-badge__invisible {
    display: none
}

.bo-styled {
    display: flex;
    flex-shrink: 0;
    position: relative
}

.bo-styled .hidden-checker {
    display: none !important
}

.bo-styled:not(.twocol) {
    flex-direction: column
}

.bo-styled.checked :invalid {
    background: #fff2e7;
    border-color: #e86d13
}

.bo-styled.twocol .button {
    margin-top: 40px
}

.bo-styled.twocol .button.flex-bottom {
    margin-top: auto
}

.bo-styled.twocol > div {
    display: flex;
    flex: 1 0 0;
    flex-direction: column
}

.bo-styled.twocol > div:first-of-type {
    margin-right: 10px
}

.bo-styled.twocol > div:last-of-type {
    margin-left: 10px
}

.bo-styled .twocol .button {
    margin-top: 40px
}

.bo-styled input:disabled {
    cursor: not-allowed
}

.bo-styled .single-line {
    align-items: center;
    display: grid;
    grid-auto-columns: auto;
    grid-auto-flow: column;
    min-width: 300px
}

.bo-styled .single-line span {
    flex: 0 100%
}

.bo-styled .single-line > div, .bo-styled .single-line > label, .bo-styled .single-line > input, .bo-styled .single-line > select {
    flex: 1 1 auto;
    margin: 0 !important;
    position: static;
    width: auto
}

.bo-styled .single-line > div:not(:first-child), .bo-styled .single-line > label:not(:first-child), .bo-styled .single-line > input:not(:first-child), .bo-styled .single-line > select:not(:first-child) {
    border-bottom-left-radius: 0;
    border-left: 0;
    border-top-left-radius: 0
}

.bo-styled .single-line > div:not(:last-child), .bo-styled .single-line > label:not(:last-child), .bo-styled .single-line > input:not(:last-child), .bo-styled .single-line > select:not(:last-child) {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0
}

.bo-styled .single-line label {
    min-height: 36px
}

.bo-styled .single-line .checkbox-text-only {
    border: 1px solid #999;
    padding: 4px 0
}

.bo-styled .single-line--two-elements {
    align-items: center;
    display: grid;
    grid-auto-columns: auto;
    grid-auto-flow: column
}

.bo-styled .single-line--two-elements .select-mutation {
    margin-top: 0
}

.bo-styled .single-line--two-elements > :first-child {
    border-bottom-right-radius: 0 !important;
    border-top-right-radius: 0 !important
}

.bo-styled .relative {
    position: relative
}

.bo-styled .relative .info-bubble {
    top: -25px
}

.bo-styled .info-bubble {
    animation: .3s fade-in 1;
    display: none;
    left: 100%;
    position: absolute;
    text-align: left;
    top: 0;
    width: 100%
}

.bo-styled .tab-container {
    margin-top: 10px
}

.bo-styled .tab-container label {
    margin-top: 10px
}

.bo-styled .hover-bubble:hover .info-bubble {
    display: block
}

.bo-styled.bo-styled--casino-edit .checkbox-text-only {
    display: inline-block !important
}

.bo-styled label {
    color: #4d4d4d;
    display: block;
    font-size: 1.1em;
    margin-bottom: 5px;
    position: relative
}

.bo-styled label:not(:first-of-type):not(.checkbox-text-only):not(.label-button) {
    margin-top: 10px
}

.bo-styled label.no-margin {
    margin: 0 !important
}

.bo-styled label.no-margin-bottom {
    margin-bottom: 0
}

.bo-styled label input:focus + .info-bubble, .bo-styled label select:focus + .info-bubble, .bo-styled label textarea:focus + .info-bubble {
    display: block
}

.bo-styled label.public-select {
    color: #4d4d4d;
    font-size: .8em
}

.bo-styled label.checkbox {
    align-items: center;
    display: flex
}

.bo-styled label.checkbox input {
    margin-top: 5px;
    min-height: inherit
}

.bo-styled label.checkbox-text-only {
    align-items: center;
    background: linear-gradient(to bottom, #fff, #e9e9e9);
    border: 1px solid #dcdcdc;
    border-radius: 50px;
    color: #5b5b5b;
    content: attr(data-label);
    cursor: pointer;
    flex: 1;
    font-size: 1em;
    font-weight: 400;
    padding: 6px 15px;
    text-align: center;
    -webkit-user-select: none;
    user-select: none;
    width: 100%
}

.bo-styled label:not(.checkbox-text-only):not(.label-button) + p {
    margin-top: 0
}

.bo-styled .label {
    font-size: 1.1em
}

.bo-styled input:not([type=checkbox]):not([type=radio]), .bo-styled select, .bo-styled textarea {
    background: #f9f9f9;
    border: 1px solid #999;
    border-radius: 50px;
    box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0);
    display: block;
    line-height: 1.5;
    margin-top: 2px;
    min-height: 34px;
    padding: 5px 15px;
    transform: translateY(0);
    transition: all .2s linear;
    width: 100%
}

.bo-styled input:not([type=checkbox]):not([type=radio]):focus:not(select), .bo-styled select:focus:not(select), .bo-styled textarea:focus:not(select) {
    background: #fff;
    box-shadow: 0 3px 5px 0 #4d4d4d;
    transform: translateY(-2px)
}

.bo-styled textarea {
    border-radius: 10px !important
}

.bo-styled .select-mutation {
    margin-top: 2px;
    position: relative !important;
    width: 100% !important
}

.bo-styled .select-mutation select {
    -webkit-appearance: none;
    background: #f9f9f9;
    border: 1px solid #999;
    border-radius: 50px;
    height: calc(34px + 2px);
    padding: 0 25px 0 15px;
    width: 100%
}

.bo-styled .select-mutation:focus {
    box-shadow: none;
    transform: none
}

.bo-styled .select-mutation::after {
    align-items: center;
    content: "";
    display: flex;
    font-family: "icons" !important;
    font-size: .6rem;
    justify-content: center;
    pointer-events: none;
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-40%)
}

.bo-styled .select-mutation.select-mutation--flat-left select {
    border-bottom-left-radius: 0;
    border-left: none;
    border-top-left-radius: 0;
    margin-top: 0;
    padding: 0 20px 0 10px;
    height: calc(34px + 4px)
}

.bo-styled .select-mutation.select-mutation--flat-left::after {
    right: 8px
}

.bo-styled select.with-icons {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Ubuntu", "Google Sans", "Noto Sans", "Droid Sans", "Roboto", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "icons"
}

.bo-styled .input-with-nofix, .bo-styled .input-with-prefix, .bo-styled .input-with-suffix {
    align-items: center;
    background: #f9f9f9;
    border: 1px solid #999;
    border-radius: 50px;
    box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0);
    display: flex;
    line-height: 1em;
    margin: 2px 0 0;
    transform: translateY(0);
    transition: all .2s linear;
    width: 100%
}

.bo-styled .input-with-nofix input, .bo-styled .input-with-prefix input, .bo-styled .input-with-suffix input {
    background: rgba(0, 0, 0, 0);
    border: none !important;
    border-radius: 0;
    flex-grow: 1;
    margin: 0
}

.bo-styled .input-with-nofix input:focus, .bo-styled .input-with-nofix input:focus-within, .bo-styled .input-with-prefix input:focus, .bo-styled .input-with-prefix input:focus-within, .bo-styled .input-with-suffix input:focus, .bo-styled .input-with-suffix input:focus-within {
    box-shadow: none !important;
    transform: none !important
}

.bo-styled .input-with-nofix::before, .bo-styled .input-with-nofix::after, .bo-styled .input-with-prefix::before, .bo-styled .input-with-prefix::after, .bo-styled .input-with-suffix::before, .bo-styled .input-with-suffix::after {
    border-radius: 8px;
    color: #999;
    flex: 0 0 auto;
    font-size: .9rem;
    font-weight: 700
}

.bo-styled .input-with-nofix:focus-within, .bo-styled .input-with-prefix:focus-within, .bo-styled .input-with-suffix:focus-within {
    background: #fff;
    box-shadow: 0 3px 5px 0 #4d4d4d;
    transform: translateY(-2px)
}

.bo-styled .input-with-nofix.info-bubble-on-top, .bo-styled .input-with-prefix.info-bubble-on-top, .bo-styled .input-with-suffix.info-bubble-on-top {
    z-index: 1
}

.bo-styled .input-with-nofix::before {
    padding: 0
}

.bo-styled .input-with-prefix {
    min-height: 34px
}

.bo-styled .input-with-prefix::before {
    content: attr(data-content);
    padding: 0 4px 0 10px
}

.bo-styled .input-with-prefix input {
    padding-left: 0
}

.bo-styled .input-with-suffix {
    min-height: 34px;
    text-align: right
}

.bo-styled .input-with-suffix::after {
    content: attr(data-content);
    padding: 0 10px 0 4px;
    text-transform: lowercase
}

.bo-styled .input-with-suffix input {
    padding-right: 0;
    text-align: right
}

.bo-styled input[type=checkbox], .bo-styled input[type=radio] {
    display: inline-block;
    width: auto
}

.bo-styled input[type=checkbox] + label.change-button-value::after, .bo-styled input[type=radio] + label.change-button-value::after {
    content: attr(data-content)
}

.bo-styled input[type=checkbox].text-only, .bo-styled input[type=radio].text-only {
    display: none;
    visibility: hidden
}

.bo-styled input[type=checkbox].text-only:checked + label.checkbox-text-only, .bo-styled input[type=radio].text-only:checked + label.checkbox-text-only {
    background-image: linear-gradient(to bottom, #ff851b, #e86d13);
    border-color: #e86d13;
    color: #fff
}

.bo-styled input[type=checkbox].text-only:checked + label.change-button-value::after, .bo-styled input[type=radio].text-only:checked + label.change-button-value::after {
    content: attr(data-content-checked)
}

.bo-styled.narrow {
    max-width: 400px
}

.bo-styled .right {
    margin-left: auto
}

.bo-styled .disclaimer {
    color: #4d4d4d;
    font-size: .8em;
    text-align: center
}

.bo-styled .disclaimer span {
    font-size: 16px;
    margin-right: 5px;
    vertical-align: top
}

.bo-styled input[type=text]:disabled {
    border: none
}

.bo-styled.inline-checkboxes label:not(.label), .bo-styled .inline-checkboxes label:not(.label) {
    display: inline-block;
    width: auto
}

.bo-styled .boolean-radio {
    align-items: center;
    border: 0;
    display: flex;
    justify-content: space-between;
    padding: 0
}

.bo-styled .boolean-radio input {
    display: none
}

.bo-styled .boolean-radio label {
    background: linear-gradient(to bottom, #fff, #e9e9e9);
    border: 1px solid #dcdcdc;
    border-radius: 50px;
    color: #5b5b5b;
    cursor: pointer;
    flex: 1 0 0;
    margin: 0;
    padding: 6px 15px;
    text-align: center;
    text-transform: uppercase
}

.bo-styled .boolean-radio label:not(:first-of-type) {
    margin-left: 20px
}

.bo-styled .boolean-radio input:checked + label {
    background-image: linear-gradient(to bottom, #ff851b, #e86d13);
    border-color: #e86d13;
    color: #fff
}

.bo-styled .boolean-radio input:checked + label.black {
    background-color: #4d4d4d
}

.bo-styled .radioset .radio {
    align-content: center;
    display: flex;
    flex-shrink: 0;
    font-size: 1.15rem
}

.bo-styled .radioset .radio input {
    flex: initial;
    margin-right: 10px
}

.bo-styled .radioset .radio [class*=icon-] {
    border-radius: 50px;
    margin-right: 5px;
    overflow: hidden
}

.bo-styled hr {
    background: #bfbfbf;
    border: none;
    display: none;
    height: 1px;
    margin-top: 40px;
    width: 100%
}

.bo-styled a.button.gray, .bo-styled button[type=submit].button.orange {
    min-height: 40px
}

.bo-styled button[type=submit] {
    margin-top: 20px
}

.bo-styled .placeholder {
    min-height: 150px;
    min-width: 550px
}

@media (max-width: 600px) {
    .bo-styled .placeholder {
        min-width: 0
    }
}

@media (max-width: 800px) {
    .bo-styled hr {
        display: block
    }

    .bo-styled.twocol > div {
        flex: 1 0 100%;
        max-width: 100%
    }

    .bo-styled.twocol > div .button {
        margin-top: 20px
    }

    .bo-styled.twocol > div:first-of-type {
        margin: 0
    }

    .bo-styled.twocol > div:last-of-type {
        margin: 20px 0 10px
    }

    .bo-styled .twocol .button {
        margin-top: 20px
    }

    .bo-styled .fixed-margin {
        margin: 20px 0 10px
    }

    .bo-styled .fixed-margin .button {
        margin: 0
    }
}

.async-form {
    position: relative
}

.async-form .overlay {
    align-items: center;
    background-color: rgba(255, 255, 255, .75);
    bottom: 0;
    display: flex;
    justify-content: center;
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.cool-checkbox {
    display: flex;
    justify-content: center;
    position: relative
}

.cool-checkbox input {
    display: none
}

.cool-checkbox input::after, .cool-checkbox input::before {
    font-size: 1em
}

.cool-checkbox input + label {
    background-color: #f6f6f6;
    border: 1px solid #4d4d4d;
    border-radius: 2em;
    cursor: pointer;
    display: inline-block;
    height: 26px;
    margin: 0;
    position: relative;
    transition: background-color .2s ease-out;
    width: 62px
}

.cool-checkbox input + label::after {
    background-color: #bfbfbf;
    border-radius: 3em;
    content: "";
    display: block;
    height: calc(100% - 2px);
    left: 1px;
    position: absolute;
    top: 1px;
    transition: left .2s ease-out;
    width: 24px
}

.cool-checkbox input + label .status-indicator {
    left: 50%;
    position: absolute
}

.cool-checkbox input + label .status-indicator::after {
    color: #bfbfbf;
    content: attr(data-text-on);
    left: 35px;
    position: absolute;
    top: -2px
}

.cool-checkbox input + label .status-indicator::before {
    color: #4d4d4d;
    content: attr(data-text-off);
    position: absolute;
    right: 35px;
    top: -2px
}

.cool-checkbox input:checked + label {
    background-color: #4d4d4d
}

.cool-checkbox input:checked + label::after {
    background-color: #ff851b;
    left: calc(100% - 25px)
}

.cool-checkbox input:checked + label .status-indicator::after {
    color: #4d4d4d
}

.cool-checkbox input:checked + label .status-indicator::before {
    color: #bfbfbf
}

.cool-checkbox.reverse-colors input + label {
    border: 1px solid #4d4d4d
}

.cool-checkbox.reverse-colors input + label::after {
    background-color: #ff851b
}

.cool-checkbox.reverse-colors input + label .status-indicator::after {
    color: #bfbfbf
}

.cool-checkbox.reverse-colors input + label .status-indicator::before {
    color: #ff851b
}

.cool-checkbox.reverse-colors input:checked + label {
    background-color: #f6f6f6
}

.cool-checkbox.reverse-colors input:checked + label::after {
    background-color: #ff851b
}

.cool-checkbox.reverse-colors input:checked + label .status-indicator::after {
    color: #ff851b
}

.cool-checkbox.reverse-colors input:checked + label .status-indicator::before {
    color: #bfbfbf
}

.settings-row {
    align-items: center;
    display: flex;
    margin: 5px 0
}

.settings-row p {
    display: inline-block;
    flex-grow: 1;
    margin: 0
}

.boolean-toggle {
    display: inline-block;
    flex: 0 0 auto;
    margin-left: auto
}

.slide-toggle {
    display: none !important
}

.slide-toggle:checked + label {
    background-color: #ff851b;
    border-color: #ff851b
}

.slide-toggle:checked + label::before {
    background-color: #fff;
    right: 1px
}

.slide-toggle:disabled + label {
    cursor: not-allowed;
    opacity: .4
}

.slide-toggle + label {
    background-color: #eee;
    border: 1px solid #bfbfbf;
    border-radius: 25px;
    box-sizing: content-box;
    cursor: pointer;
    display: inline-block;
    height: 25px;
    line-height: 25px;
    margin: 0 5px;
    overflow: hidden;
    padding: 0;
    position: relative;
    transition: all .15s ease-out;
    vertical-align: bottom;
    width: 60px
}

.slide-toggle + label::before {
    background-color: #bfbfbf;
    border-radius: 25px;
    bottom: 0;
    content: "";
    display: block;
    height: 23px;
    margin: 0;
    position: absolute;
    right: 36px;
    top: 1px;
    transition: all .15s ease-out 0s;
    width: 23px
}

.checkbox {
    display: none !important
}

.checkbox + label {
    background: #dcdcdc url("/assets/img/icon/checkbox-not-checked.svg") no-repeat 50% 50%;
    border-radius: 25px;
    box-sizing: content-box;
    cursor: pointer;
    display: inline-block;
    height: 25px;
    line-height: 25px;
    margin: 0 5px;
    overflow: hidden;
    padding: 0;
    position: relative;
    transition: all .15s ease-out;
    vertical-align: bottom;
    width: 25px
}

.checkbox:checked + label {
    background-color: #ff851b;
    background-image: url("/assets/img/icon/checkbox-checked.svg")
}

.checkbox:disabled + label {
    cursor: not-allowed;
    opacity: .25
}

[type=submit][disabled], [type=submit].disabled {
    cursor: not-allowed
}

[type=submit][disabled].orange, [type=submit][disabled].orange:hover, [type=submit].disabled.orange, [type=submit].disabled.orange:hover {
    background-color: #ffbc81
}

.count-checked {
    counter-reset: checked-count
}

.count-checked input:checked {
    position: relative
}

.count-checked input:checked + label::before {
    content: counter(checked-count) ".";
    counter-increment: checked-count;
    font-weight: bold;
    left: 10px;
    position: absolute
}

[data-ajax-validation].invalid, [class*=input-with-].invalid {
    border-color: #ff3c00 !important
}

[data-ajax-validation].invalid:focus-within, [class*=input-with-].invalid:focus-within {
    box-shadow: 0 3px 5px 0 #992400 !important
}

.ajax-validation-message {
    font-size: .875rem;
    height: 1.3125rem
}

.ajax-validation-message.invalid {
    color: #ff3c00
}

.linkbutton {
    background: none;
    border: 0;
    color: #999;
    display: inline;
    font-size: 1rem;
    padding: 0;
    text-align: left
}

.linkbutton:hover {
    color: #ff851b
}

.button {
    align-items: center;
    background: #fff;
    border: 1px solid;
    border-radius: 50px;
    color: #5b5b5b;
    display: flex;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Ubuntu", "Google Sans", "Noto Sans", "Droid Sans", "Roboto", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 1rem;
    font-weight: 400;
    justify-content: center;
    line-height: 1;
    padding: 6px 15px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    transition: none;
    user-select: none
}

.button.with-shadow {
    box-shadow: 0 3px 5px 0 #bfbfbf
}

.button.with-dark-shadow {
    box-shadow: 0 2px 3px #171717;
    position: relative;
    transition: all .1s linear
}

.button.with-dark-shadow:hover {
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
    transform: translateY(3px)
}

.button.with-dark-shadow:active {
    box-shadow: 0 0 0 #ff851b;
    transform: translateY(3px)
}

.button.wider {
    padding: 10px 45px
}

@media (max-width: 480px) {
    .button.wider {
        padding: 10px 15px
    }
}

.button.f-bigger {
    font-size: 1.25rem
}

.button.f-big {
    font-size: 2rem
}

.button.f-400 {
    font-weight: 400
}

.button.tt-none {
    text-transform: none
}

.button.with-icon {
    padding: 3px 10px 3px 3px
}

.button.no-border {
    border: none
}

.button.no-padding {
    padding: 5px 0
}

.button [class^=icon-] {
    margin-right: 10px
}

.button [class^=icon-].after {
    margin-left: 5px;
    margin-right: 0
}

.button [class^=icon-].before {
    margin-left: 0;
    margin-right: 5px
}

@media (max-width: 500px) {
    .button span.mobile-icon-only {
        margin-right: 0
    }
}

.button.disabled {
    cursor: not-allowed
}

.button.inline {
    display: inline-flex
}

.button.wide {
    width: 100%
}

@media (max-width: 500px) {
    .button .nomobile {
        display: none
    }
}

.button.just-text {
    background: none;
    border: none;
    color: #ff851b
}

.button.just-text.active {
    color: #4d4d4d
}

.button.just-text:disabled {
    color: #dcdcdc;
    cursor: not-allowed
}

.button.round {
    display: block;
    margin-right: auto;
    padding: 4px 5px
}

.button.round span {
    margin: 0
}

.button.small {
    background: none;
    border: none;
    padding: 5px 2px
}

.button.small span {
    margin: 0
}

.button.load-more {
    border: none;
    border-radius: 0;
    color: #bfbfbf;
    font-size: 1rem;
    text-align: center;
    width: 100%
}

.button.load-more [class*=icon] {
    padding-left: 8px
}

.button.load-more:hover, .button.load-more.selected {
    color: #999
}

.button.hide {
    display: none !important
}

.button.white.selected {
    background: #5b5b5b;
    color: #fff
}

.button.darkgray {
    background: linear-gradient(to bottom, #5a5a5a, #4d4d4d);
    border-color: #4d4d4d;
    color: #dcdcdc
}

.button.darkgray:hover, .button.darkgray.selected {
    background-color: #383838
}

.button.gray {
    background: linear-gradient(to bottom, #fff, #e9e9e9);
    border-color: #dcdcdc;
    color: #5b5b5b
}

.button.gray.active {
    background: linear-gradient(to bottom, #ff851b, #e86d13);
    border-color: #e86d13;
    color: #fff
}

.button.gray.disabled {
    color: #999
}

.button.lightgray {
    border: none;
    color: #dcdcdc
}

.button.lightgray:hover {
    color: #bfbfbf
}

.button.lightgray.checked {
    color: #ff851b
}

.button.orange {
    background: #e86d13;
    background-image: linear-gradient(to bottom, #ff851b, #e86d13);
    border-color: #e86d13;
    color: #fff
}

.button.orange.active {
    background-image: linear-gradient(to bottom, #ff851b, #e86d13);
    border-color: #e86d13;
    color: #fff
}

.button.orange:hover {
    background-image: none
}

.button.green {
    background: #008713;
    background-image: linear-gradient(#00b019, #008713);
    border-color: #008713;
    color: #fff
}

.button.green:hover {
    background-image: none
}

.button span.infotxt {
    font-size: .7em;
    padding-left: 5px;
    padding-top: 3px;
    text-transform: lowercase
}

.button.scale:active {
    animation: scale-down .2s;
    transform-origin: center center
}

.button--shortcode {
    display: inline-block;
    word-break: break-word;
    margin: 5px 0;
    font-size: 1.4em;
    padding: 10px 35px
}

@media (max-width: 900px) {
    .button--shortcode {
        font-size: 1.1rem;
        padding: 10px 15px
    }
}

@media (max-width: 420px) {
    .button--shortcode {
        width: 100%
    }
}

button.link, span.link, a.link {
    background: none;
    border: none;
    color: #ff851b;
    cursor: pointer;
    font: inherit;
    padding: 0;
    text-align: left
}

button.link:hover, span.link:hover, a.link:hover {
    color: #e86d13
}

.show-more {
    display: block;
    text-align: center
}

.show-more .link {
    align-items: center;
    color: #999;
    display: flex;
    font-size: 1.25em;
    margin: auto;
    text-transform: uppercase
}

.show-more .link:hover {
    color: #ff851b
}

.show-more .link span {
    margin: 0 10px
}

.logo-button-container {
    display: grid;
    grid-gap: 10px;
    grid-template-columns:repeat(auto-fill, minmax(75px, 1fr))
}

.logo-button-container .highlighted {
    order: -1
}

@media (max-width: 900px) {
    .logo-button-container {
        grid-template-columns:repeat(auto-fill, minmax(65px, 1fr))
    }
}

.logo-button {
    border: 2px solid #fff;
    border-radius: 5px;
    box-shadow: 0 0 3px 0 #999;
    font-size: 1.8em;
    font-weight: bold;
    height: 50px;
    line-height: 1.2em;
    object-fit: contain;
    overflow: hidden;
    padding: 5px;
    text-align: center;
    width: 100%
}

.logo-button.highlighted {
    box-shadow: 0 0 5px 0 #e86d13
}

@media (max-width: 900px) {
    .logo-button {
        height: 45px
    }
}

button.open-search {
    background-color: #fff;
    border: 1px solid #bfbfbf;
    border-radius: 50%;
    color: #bfbfbf;
    cursor: pointer;
    padding: 0;
    transition: all .2s
}

button.open-search i {
    font-size: 18px;
    font-weight: bold
}

.open .open-search {
    background: #ff851b;
    border-color: #ff851b;
    color: #fff
}

.button.image-upload .icon-camera {
    font-size: 2rem
}

.rating-0, .rating-05, .rating-10, .rating-15, .rating-20, .rating-25, .rating-30, .rating-35, .rating-40, .rating-45, .rating-50 {
    background-position: 0 50%, 21px 50%, 42px 50%, 63px 50%, 84px 50%;
    background-repeat: no-repeat;
    display: inline-block;
    height: 18px;
    vertical-align: middle;
    width: 102px
}

.rating-0.big, .rating-05.big, .rating-10.big, .rating-15.big, .rating-20.big, .rating-25.big, .rating-30.big, .rating-35.big, .rating-40.big, .rating-45.big, .rating-50.big {
    background-position: 0 50%, 28px 50%, 56px 50%, 84px 50%, 112px 50%;
    height: 26px;
    width: 137px
}

.rating-0.medium, .rating-05.medium, .rating-10.medium, .rating-15.medium, .rating-20.medium, .rating-25.medium, .rating-30.medium, .rating-35.medium, .rating-40.medium, .rating-45.medium, .rating-50.medium {
    background-position: 0 50%, 19px 50%, 38px 50%, 57px 50%, 76px 50%;
    height: 16px;
    width: 95px
}

.rating-0.small, .rating-05.small, .rating-10.small, .rating-15.small, .rating-20.small, .rating-25.small, .rating-30.small, .rating-35.small, .rating-40.small, .rating-45.small, .rating-50.small {
    background-position: 0 50%, 17px 50%, 34px 50%, 51px 50%, 68px 50%;
    height: 15px;
    width: 83px
}

.rating-0 {
    background-image: url("/assets/img/bojoko-b-gray.svg"), url("/assets/img/bojoko-b-gray.svg"), url("/assets/img/bojoko-b-gray.svg"), url("/assets/img/bojoko-b-gray.svg"), url("/assets/img/bojoko-b-gray.svg")
}

.rating-05 {
    background-image: url("/assets/img/bojoko-b-half.svg"), url("/assets/img/bojoko-b-gray.svg"), url("/assets/img/bojoko-b-gray.svg"), url("/assets/img/bojoko-b-gray.svg"), url("/assets/img/bojoko-b-gray.svg")
}

.rating-10 {
    background-image: url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b-gray.svg"), url("/assets/img/bojoko-b-gray.svg"), url("/assets/img/bojoko-b-gray.svg"), url("/assets/img/bojoko-b-gray.svg")
}

.rating-15 {
    background-image: url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b-half.svg"), url("/assets/img/bojoko-b-gray.svg"), url("/assets/img/bojoko-b-gray.svg"), url("/assets/img/bojoko-b-gray.svg")
}

.rating-20 {
    background-image: url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b-gray.svg"), url("/assets/img/bojoko-b-gray.svg"), url("/assets/img/bojoko-b-gray.svg")
}

.rating-25 {
    background-image: url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b-half.svg"), url("/assets/img/bojoko-b-gray.svg"), url("/assets/img/bojoko-b-gray.svg")
}

.rating-30 {
    background-image: url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b-gray.svg"), url("/assets/img/bojoko-b-gray.svg")
}

.rating-35 {
    background-image: url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b-half.svg"), url("/assets/img/bojoko-b-gray.svg")
}

.rating-40 {
    background-image: url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b-gray.svg")
}

.rating-45 {
    background-image: url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b-half.svg")
}

.rating-50 {
    background-image: url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b.svg"), url("/assets/img/bojoko-b.svg")
}

.header-main {
    background: #fff;
    border-bottom: 1px solid #999;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Ubuntu", "Google Sans", "Noto Sans", "Droid Sans", "Roboto", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    height: 65px;
    position: sticky;
    position: -webkit-sticky;
    top: 0;
    transform: translateZ(0);
    width: 100%;
    z-index: 5;
    box-shadow: none;
    border-color: #dcdcdc
}

.header-main__wrapper {
    align-items: center;
    display: flex;
    flex-flow: row nowrap;
    height: 100%;
    margin: auto;
    max-width: 1170px;
    position: relative
}

@media (max-width: 1200px) {
    .header-main__wrapper {
        padding: 0 15px
    }
}

@media (max-width: 1170px) {
    .header-main__wrapper {
        margin: 0;
        padding: 0;
        height: 60px;
        justify-content: space-between
    }
}

@media (max-width: 1170px) {
    .header-main {
        height: 60px
    }
}

.header-logo {
    display: flex;
    /*height: 100%;*/
    padding: 5px 0
}

@media (max-width: 1200px) {
    .header-logo {
        padding: 5px
    }
}

@media (min-width: 1171px) {
    .main-nav-toggle {
        display: none
    }
}

@media (max-width: 1170px) {
    .main-nav-toggle {
        font-size: 1.25rem;
        height: 100%;
        margin-right: 5px;
        padding: 5px 10px;
        position: relative;
        width: 50px
    }

    .main-nav-toggle [class*=icon-] {
        color: #4d4d4d;
        left: 50%;
        position: absolute;
        top: 50%;
        transform-origin: center;
        transition: all .2s
    }

    .main-nav-toggle__open-menu {
        transform: translate(-50%, -50%)
    }

    .main-nav-toggle__close-menu {
        opacity: 0;
        transform: translate(-50%, -50%) rotate(-45deg)
    }

    .main-nav-toggle.open .main-nav-toggle__close-menu {
        opacity: 1;
        transform: translate(-50%, -50%)
    }

    .main-nav-toggle.open .main-nav-toggle__open-menu {
        opacity: 0;
        transform: translate(-50%, -50%) rotate(45deg)
    }
}

@media (max-width: 420px) {
    .main-nav-toggle {
        padding: 5px 0 5px 10px;
        width: 40px
    }
}

.header-search {
    display: none
}

@media (min-width: 1170px) {
    .header-search {
        align-items: center;
        display: flex;
        justify-content: flex-end;
        position: relative;
        z-index: 1
    }

    .header-search__form {
        align-self: center;
        display: grid;
        grid-gap: 5px;
        grid-template-columns:1fr auto
    }

    .header-search__wrapper {
        background: #fff;
        border-radius: 8px;
        border-top: 1px solid #bfbfbf;
        opacity: 0;
        padding: 5px 10px 5px 15px;
        pointer-events: none;
        position: absolute;
        right: 0;
        top: 37px;
        transform: translateY(10px) scaleY(0);
        transform-origin: top;
        transition: all .1s ease-in-out;
        z-index: 6
    }

    .header-search__wrapper label {
        display: none
    }

    .header-search__wrapper input {
        background: rgba(0, 0, 0, 0);
        border: none;
        font-size: 1.2rem;
        line-height: 24px;
        min-width: 200px
    }

    .header-search__wrapper input::placeholder {
        color: #dcdcdc
    }

    .header-search--toggle {
        background: none;
        border: none;
        color: #999;
        display: flex;
        font-size: 1.6rem;
        height: 35px;
        justify-content: center;
        margin-right: 15px;
        width: 35px;
        z-index: 1
    }

    .header-search--toggle:hover {
        color: #ff851b
    }

    .header-search--toggle span {
        margin: 0 !important
    }

    .header-search__submit {
        background: #ff851b;
        border-color: #ff851b;
        color: #fff;
        padding: 8px
    }

    .header-search__submit span {
        margin: 0 !important
    }

    .header-search.empty .close-search {
        display: none
    }

    .header-search.open .header-search--toggle {
        color: #ff851b
    }

    .header-search.open .header-search__wrapper {
        box-shadow: 0 4px 6px 0 rgba(0, 0, 0, .4);
        opacity: 1;
        pointer-events: all;
        transform: translateY(10px) scaleY(1)
    }
}

@media (max-width: 1025px) {
    .menu-open {
        opacity: 1
    }
}

.footer-language-menu {
    border: none;
    border-top: 1px solid #dcdcdc;
    display: flex;
    padding: 0;
    padding-top: 25px;
    margin: 0 auto;
    justify-content: center
}

.footer-language-menu__link {
    align-items: center;
    display: flex;
    margin: 0 10px
}

.footer-language-menu__icon-flag {
    border-radius: 50px;
    overflow: hidden;
    border: 2px solid rgba(0, 0, 0, 0);
    height: 2rem;
    width: 2rem
}

.footer-language-menu__icon-flag--active {
    border-color: #ff851b
}

@media (max-width: 1025px) {
    .footer-language-menu {
        padding-top: 25px
    }
}

@media (max-width: 1025px) {
    .footer-language-menu {
        width: 100%
    }
}

@media (min-width: 1171px) {
    .main-nav {
        display: flex;
        margin: 0 auto 0 45px;
        max-width: 1024px
    }

    .main-nav--content-wrapper {
        display: flex;
        justify-content: center;
        list-style: none;
        margin: 0;
        padding: 0
    }

    .main-nav--item-wrapper {
        display: grid
    }

    .main-nav--item-wrapper.visible > .main-nav--submenu:not(.main-nav--submenu--category) {
        display: grid;
        max-height: 999px;
        opacity: 1;
        transform: scaleY(1) translateX(-50%)
    }

    .main-nav--content-wrapper > .main-nav--item-wrapper {
        border-right: 1px solid #f6f6f6
    }

    .main-nav--content-wrapper > .main-nav--item-wrapper:last-of-type {
        border-right: none
    }

    .main-nav--content-wrapper > .main-nav--item-wrapper > a {
        display: none
    }

    .main-nav--content-wrapper > .main-nav--item-wrapper > button {
        background: rgba(0, 0, 0, 0);
        border: none;
        padding: 12px 25px
    }

    .main-nav--content-wrapper > .main-nav--item-wrapper > button .open-submenu--desktop {
        color: #5b5b5b;
        font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Ubuntu", "Google Sans", "Noto Sans", "Droid Sans", "Roboto", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        font-size: 1rem;
        font-weight: 500;
        text-transform: uppercase;
        display: grid;
        grid-template-columns:1fr auto;
        gap: 4px;
        line-height: normal
    }

    .main-nav--content-wrapper > .main-nav--item-wrapper > button .open-submenu--desktop::after {
        font-family: "icons";
        content: "";
        color: #5b5b5b;
        font-size: 1rem;
        transform: scaleY(1);
        transition: .15s transform ease-in-out;
        line-height: normal;
        align-self: end
    }

    .main-nav--content-wrapper > .main-nav--item-wrapper.active .open-submenu--desktop {
        color: #ff851b
    }

    .main-nav--content-wrapper > .main-nav--item-wrapper.visible > button .open-submenu--desktop {
        color: #ff851b
    }

    .main-nav--content-wrapper > .main-nav--item-wrapper.visible > button .open-submenu--desktop::after {
        transform: scaleY(-1)
    }

    .main-nav--submenu {
        display: block
    }

    .main-nav--submenu:not(.main-nav--submenu--category) {
        background: #fff;
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
        border-top: 2px solid #ff851b;
        box-shadow: 0 4px 6px 0 rgba(0, 0, 0, .5);
        display: grid;
        gap: 25px 0;
        grid-template-columns:repeat(5, 1fr);
        left: 50%;
        list-style: none;
        max-height: 0;
        opacity: 0;
        padding: 20px;
        position: absolute;
        top: 100%;
        transform: scaleY(0) translateX(-50%);
        transform-origin: top;
        transition: all .15s var(--cb);
        width: 970px
    }

    .main-nav--submenu--main-link {
        grid-column: 1/6;
        width: 100%
    }

    .main-nav--submenu--main-link a {
        margin: 0 auto;
        padding: 6px 55px;
        width: auto
    }

    .main-nav--submenu--category {
        padding: 0
    }

    .main-nav--submenu--category .main-nav--item-wrapper {
        margin-bottom: 8px
    }

    .main-nav--submenu--category .main-nav--item-wrapper.active a {
        color: #e86d13;
        font-weight: 600
    }

    .main-nav--category-wrapper {
        border-right: 1px solid #f6f6f6;
        grid-template-rows:auto 1fr;
        padding-left: 15px;
        padding-right: 15px
    }

    .main-nav--category-wrapper:first-of-type {
        padding-left: 0
    }

    .main-nav--category-wrapper:last-of-type {
        border-right: none;
        padding-right: 0
    }

    .main-nav .open-submenu--arrow {
        display: none
    }

    .main-nav .open-submenu.active span, .main-nav .open-submenu:hover span {
        color: #ff851b
    }

    .main-nav .open-submenu-category {
        background: rgba(0, 0, 0, 0);
        border: none;
        font-weight: bold;
        margin-bottom: 8px;
        padding: 0;
        pointer-events: none;
        text-align: left
    }

    .main-nav .open-submenu-category--title {
        color: #4d4d4d;
        font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Ubuntu", "Google Sans", "Noto Sans", "Droid Sans", "Roboto", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        font-size: 1rem;
        font-weight: 600
    }

    .main-nav .open-submenu-category--arrow {
        display: none
    }
}

@media (max-width: 1170px) {
    .main-nav {
        bottom: 0;
        display: block;
        height: calc(100vh - 60px);
        left: 0;
        overflow: hidden;
        -webkit-overflow-scrolling: touch;
        pointer-events: none;
        position: fixed;
        scroll-behavior: smooth;
        top: 60px;
        width: 100%;
        z-index: 8
    }

    .main-nav.open {
        overflow-x: hidden;
        overflow-y: scroll;
        pointer-events: all
    }

    .main-nav.open .main-nav--content-wrapper {
        transform: translateX(0)
    }

    .main-nav--content-wrapper {
        background: #282828;
        margin: 0;
        max-width: 450px;
        min-height: calc(100vh - 60px);
        opacity: 1;
        padding: 0 0 90px;
        pointer-events: all;
        transform: translateX(-100%);
        transition: transform .2s var(--cb)
    }

    .main-nav--item-wrapper {
        border-bottom: 1px solid #4d4d4d;
        display: grid;
        grid-template-columns:1fr auto;
        min-height: 45px;
        padding: 0
    }

    .main-nav--item-wrapper a {
        color: #eee;
        font-size: 1rem;
        overflow: hidden;
        padding: 12px 15px;
        text-overflow: ellipsis;
        white-space: nowrap
    }

    .main-nav--item-wrapper a.active {
        color: #ff851b
    }

    .main-nav--item-wrapper .open-submenu--arrow {
        transform: translate(-50%, -50%) rotate(90deg)
    }

    .main-nav--item-wrapper.active .open-submenu--title {
        color: #ff851b
    }

    .main-nav--item-wrapper.visible > .main-nav--submenu, .main-nav--item-wrapper.visible-mobile > .main-nav--submenu {
        max-height: 9999px;
        opacity: 1;
        transform: scaleY(1)
    }

    .main-nav--item-wrapper.visible .open-submenu--arrow, .main-nav--item-wrapper.visible-mobile .open-submenu--arrow {
        transform: translate(-50%, -50%) rotate(-90deg)
    }

    .main-nav--item-wrapper.no-children .open-submenu {
        display: none
    }

    .main-nav--content-wrapper > .main-nav--item-wrapper.active > .open-submenu span {
        color: #ff851b
    }

    .main-nav--content-wrapper > .main-nav--item-wrapper.visible > a, .main-nav--content-wrapper > .main-nav--item-wrapper.visible-mobile > a {
        background: linear-gradient(to bottom, #ff851b, #e86d13);
        color: #fff
    }

    .main-nav--content-wrapper > .main-nav--item-wrapper.visible > button, .main-nav--content-wrapper > .main-nav--item-wrapper.visible-mobile > button {
        background: linear-gradient(to bottom, #ff851b, #e86d13);
        border-color: #fff;
        color: #fff
    }

    .main-nav--content-wrapper > .main-nav--item-wrapper.visible > button span, .main-nav--content-wrapper > .main-nav--item-wrapper.visible-mobile > button span {
        color: #fff !important
    }

    .main-nav--category-wrapper.active .open-submenu-category--arrow {
        color: #ff851b
    }

    .main-nav--category-wrapper .main-nav--item-wrapper {
        border-bottom: 2px solid #4d4d4d
    }

    .main-nav--category-wrapper.visible > button {
        border-bottom: 2px solid #4d4d4d
    }

    .main-nav--category-wrapper.visible > button .open-submenu-category--arrow {
        color: #fff;
        transform: rotate(-90deg)
    }

    .main-nav--submenu {
        background: #383838;
        display: grid;
        grid-column: 1/span 2;
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        padding-left: 30px;
        transform: scaleY(0);
        transform-origin: top;
        transition: all .2s var(--cb)
    }

    .main-nav--submenu li a {
        padding-left: 0
    }

    .main-nav--submenu li:last-child {
        border-bottom: none
    }

    .main-nav--submenu--main-link {
        display: none
    }

    .main-nav--submenu--category a {
        color: #fff
    }

    .main-nav .open-submenu {
        background: rgba(0, 0, 0, 0);
        border: none;
        border-left: 1px solid #383838;
        color: #999;
        font-size: 1.35rem;
        position: relative;
        width: 45px
    }

    .main-nav .open-submenu--arrow {
        color: #4d4d4d;
        font-size: 1.5rem;
        left: 50%;
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%) rotate(90deg);
        transform-origin: center
    }

    .main-nav .open-submenu--desktop {
        display: none
    }

    .main-nav .open-submenu.active {
        color: #ff851b
    }

    .main-nav .open-submenu-category {
        align-items: center;
        background: rgba(0, 0, 0, 0);
        border: none;
        color: #eee;
        display: flex;
        font: 1rem system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Ubuntu", "Google Sans", "Noto Sans", "Droid Sans", "Roboto", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        justify-content: space-between;
        overflow: hidden;
        padding: 12px 15px 12px 0;
        position: relative;
        text-overflow: ellipsis;
        white-space: nowrap
    }

    .main-nav .open-submenu-category--arrow {
        color: #999;
        font-size: 1.35rem;
        transform: rotate(90deg);
        transform-origin: center
    }
}

@media (max-width: 450px) {
    .main-nav {
        right: 0
    }
}

.main-nav form.search {
    display: none
}

@media (max-width: 1170px) {
    .main-nav form.search {
        display: grid;
        grid-template-columns:1fr auto;
        margin: 90px 10px 10px
    }
}

@media (max-width: 1170px)and (max-width: 500px) {
    .main-nav form.search {
        border-radius: 30px;
        padding: 0;
        width: auto
    }
}

html.modal-open {
    overflow: hidden
}

#modal-root {
    display: none
}

.language-nav {
    display: none
}

@media (max-width: 1025px) {
    .language-nav {
        border-bottom: 1px solid #383838;
        border-top: 1px solid #383838;
        display: grid;
        grid-gap: 10px 15px;
        grid-template-columns:repeat(auto-fill, minmax(30px, 1fr));
        padding: 10px 15px
    }

    .language-nav__flag {
        border-radius: 50px;
        overflow: hidden;
        border: 2px solid rgba(0, 0, 0, 0);
        height: 2rem;
        width: 2rem
    }

    .language-nav__flag--active {
        border-color: #ff851b
    }
}

.twocol {
    display: flex;
    flex-flow: row wrap
}

.twocol .col, .twocol > div {
    flex: 1 0 0;
    max-width: calc(50% - 10px)
}

.twocol .col:first-child, .twocol > div:first-child {
    margin-right: 10px
}

.twocol .col:last-child, .twocol > div:last-child {
    margin-left: 10px
}

.twocol.centered-items {
    align-items: center
}

.twocol .col-header {
    display: block;
    margin: auto
}

@media (max-width: 600px) {
    .twocol .col, .twocol > div {
        flex: 1 0 100%;
        max-width: 100%
    }

    .twocol .col:first-child, .twocol > div:first-child {
        margin-right: 0
    }

    .twocol .col:last-child, .twocol > div:last-child {
        margin-left: 0
    }
}

.twocol-aside {
    display: flex;
    justify-content: space-between
}

.twocol-aside > div {
    flex: 0 0 auto
}

.twocol-aside > div.col-main {
    width: calc(65% - 20px)
}

.twocol-aside > div.col-aside {
    width: calc(35% - 20px)
}

[class*=grid-] {
    display: grid;
    grid-auto-flow: column;
    grid-template-rows:auto;
    margin: 15px 0
}

[class*=grid-].with-padding {
    padding: 60px 15px
}

[class*=grid-].gap-10 {
    grid-gap: 10px
}

[class*=grid-].gap-15 {
    grid-gap: 15px
}

[class*=grid-].gap-20 {
    grid-gap: 20px
}

[class*=grid-].gap-30 {
    grid-gap: 30px
}

.grid-3 {
    grid-auto-flow: dense;
    grid-template-columns:repeat(auto-fill, minmax(300px, 1fr))
}

@media (max-width: 1025px) {
    .grid-3 {
        grid-template-columns:repeat(auto-fill, minmax(280px, 1fr))
    }
}

.grid-4 {
    grid-auto-flow: dense;
    grid-template-columns:repeat(auto-fill, minmax(242px, 1fr))
}

.grid-5 {
    grid-auto-flow: dense;
    grid-template-columns:repeat(auto-fill, minmax(192px, 1fr));
    justify-content: space-between
}

.grid-6 {
    grid-auto-flow: dense;
    grid-template-columns:repeat(auto-fill, minmax(160px, 0.5fr));
    justify-content: space-between
}

.toc {
    margin: 50px 0
}

.toc .toc-inner {
    column-count: 2;
    column-gap: 40px
}

@media (max-width: 900px) {
    .toc .toc-inner {
        display: flex;
        flex-flow: column nowrap
    }
}

.toc .h2, .toc .level1 {
    display: block;
    font-size: 1.5em;
    font-weight: 500;
    line-height: 1.3em;
    margin: 0 0 10px
}

.toc .h3 {
    display: block;
    font-size: 1.3em;
    margin: 20px 0 0
}

.toc .h4, .toc .level2 {
    display: block;
    font-size: 1.1em
}

.toc .h5 {
    display: block;
    font-size: 1em
}

.toc .h6 {
    display: block;
    font-size: .9em
}

.toc .toc-section {
    margin: 0 0 30px
}

.toc .toc-section .toc-section-header {
    display: block;
    font-size: 1.5em;
    font-weight: 700;
    margin: 0 0 10px
}

.toc .toc-section a {
    display: block;
    margin: 8px 0
}

.with-sidebar .side .toc-side .toc-section {
    margin: 15px 0
}

.with-sidebar .side .toc-side .toc-section .arrow-block {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: -12px
}

.with-sidebar .side .toc-side .toc-section .arrow-block--btn-elem {
    cursor: pointer;
    font-size: 18px
}

.with-sidebar .side .toc-side .toc-section .arrow-block--btn-elem::after {
    content: "";
    font-family: "icons";
    line-height: .8em;
    padding-left: 10px
}

.with-sidebar .side .toc-side .toc-section > [class*=level] {
    display: none
}

.with-sidebar .side .toc-side .toc-section > [class*=level1] {
    display: block
}

.with-sidebar .side .toc-side .toc-section.section-open .arrow-block--btn-elem::after {
    content: ""
}

.with-sidebar .side .toc-side .toc-section.section-open > [class*=level] {
    display: block
}

.toc-side {
    font-size: .9em;
    position: sticky;
    position: -webkit-sticky;
    top: 40px
}

.toc-side .toc-side-main-header {
    display: block;
    font-size: 1.15em;
    font-weight: 700;
    margin: 10px 0;
    word-break: break-word;
    text-transform: uppercase
}

.toc-side .level1 {
    cursor: pointer;
    display: block !important;
    font-size: 1.05em;
    font-weight: 400;
    margin: 0 0 10px;
    text-transform: uppercase
}

.toc-side a {
    margin: 8px 0
}

@media (max-width: 1025px) {
    .with-sidebar .main .toc .toc-inner {
        display: flex;
        flex-flow: column nowrap
    }
}

@media (max-width: 900px) {
    .with-sidebar .toc-sidebar {
        display: none
    }
}

.content ul, ul.b-balls {
    list-style-image: url("/assets/img/bojoko-b-ul.svg")
}

.content ul li, ul.b-balls li {
    padding: 5px 0
}

.content ul li.no-bullet, ul.b-balls li.no-bullet {
    list-style-image: none;
    list-style-type: none
}

.content ul.split, .content ol.split {
    -webkit-columns: 2;
    columns: 2;
    list-style-position: inside;
    padding-left: 20px
}

@media (max-width: 480px) {
    .content ul.split, .content ol.split {
        padding-left: 10px
    }
}

@media (max-width: 800px) {
    .content ul.split, .content ol.split {
        -webkit-columns: 1;
        columns: 1
    }
}

@media (max-width: 480px) {
    .content ul:not(.bo-style):not(.simple), .content ol:not(.bo-style):not(.simple) {
        padding-left: 20px
    }
}

.content ul.simple {
    list-style: none;
    padding: 0
}

.content ul.simple li {
    list-style-image: none;
    list-style-type: none
}

.content ul.user-list {
    display: flex;
    flex-flow: column nowrap;
    margin: 0;
    padding: 0
}

.content ul.user-list li {
    align-items: center;
    border-bottom: 1px solid #f6f6f6;
    display: grid;
    grid-template-columns:40px 1fr auto;
    padding: 8px 0
}

.content ul.user-list li:last-of-type {
    border-bottom: none
}

.content ul.user-list li.you {
    order: -1
}

.content ul.user-list .avatar {
    align-self: flex-start;
    border-radius: 100%;
    display: block;
    flex: 0 0 40px;
    height: 40px;
    overflow: hidden;
    width: 40px
}

.content ul.user-list .username {
    overflow: hidden;
    padding-left: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.content ul.user-list .button.load-more {
    grid-column: span 3
}

.content ol {
    counter-reset: item;
    margin: 0 0 1.5em
}

.content ol.cards {
    margin: 0 auto;
    padding: 0
}

.content ol:not(.simple) > li {
    counter-increment: item;
    list-style-type: none;
    margin: 0;
    padding: 5px 0;
    position: relative
}

.content ol:not(.simple) > li::before {
    content: counter(item) ".";
    font-weight: bold;
    position: absolute;
    right: calc(100% + 5px)
}

.content ol.detailed {
    counter-reset: item;
    margin: 20px 0;
    padding: 0
}

.content ol.detailed li {
    display: block;
    margin: 15px 0;
    padding: 0
}

.content ol.detailed li::before {
    content: counter(item, ".") ". ";
    font-weight: 300;
    position: static
}

.content ol.detailed li.new-section {
    margin-top: 30px
}

.content ol.detailed li li {
    margin-left: 30px
}

.content ol.detailed li > ol {
    margin: 20px 0;
    padding-left: 0
}

#toast-root {
    color: #5b5b5b;
    display: flex;
    flex-direction: column;
    font-size: 1em;
    position: fixed;
    right: 10px;
    top: 80px;
    width: 300px;
    z-index: 11
}

#toast-root .toast {
    align-items: center;
    border-radius: 10px;
    box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .35);
    color: #fff;
    cursor: pointer;
    display: flex;
    margin-bottom: 10px;
    opacity: .95;
    padding: 15px 20px;
    transition: opacity .2s
}

#toast-root .toast.fading {
    opacity: 0
}

#toast-root .toast:hover {
    opacity: .95;
    transition-duration: .4s
}

#toast-root .toast::before {
    font-family: icons;
    font-size: 2em;
    margin-right: 10px
}

#toast-root .toast.success {
    background: #53b178 linear-gradient(to right, #62d68d 30%, #53b178 70%)
}

#toast-root .toast.success::before {
    content: ""
}

#toast-root .toast.info {
    background: #767676 linear-gradient(to right, #999 30%, #767676 70%)
}

#toast-root .toast.info::before {
    content: ""
}

#toast-root .toast.warning {
    background: #ef9358 linear-gradient(to right, #ffcb65 30%, #ef9358 70%)
}

#toast-root .toast.warning::before {
    content: ""
}

#toast-root .toast.error {
    background: #de7466 linear-gradient(to right, #ff805e 30%, #de7466 70%)
}

#toast-root .toast.error::before {
    content: ""
}

#toast-root .toast h3 {
    font-size: 1.15em;
    line-height: 1em;
    margin: 0 0 5px
}

#toast-root .toast p {
    margin: 0
}

@media (max-width: 1025px) {
    #toast-root {
        top: 90px
    }
}

html.modal-open #toast-root {
    top: 10px
}

.arrow-top-middle::before, .arrow-top-left::before, .arrow-top-right::before, .arrow-left::before {
    background: #fff;
    border-style: solid;
    content: "";
    position: absolute
}

.arrow-left {
    margin-left: 40px
}

.arrow-left::before {
    border-color: #dcdcdc;
    border-width: 0 0 1px 1px;
    -webkit-clip-path: polygon(0 0, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 100%, 0 100%);
    height: 35px;
    left: 0;
    top: 20px;
    transform: translateX(-50%) rotate(45deg) skew(-15deg, -15deg);
    width: 35px
}

.arrow-top-right {
    margin-top: 7px
}

.arrow-top-right::before {
    border-color: #999;
    border-width: 1px;
    -webkit-clip-path: polygon(0 100%, 100% 0, 0 0);
    clip-path: polygon(0 100%, 100% 0, 0 0);
    height: 20px;
    right: 18px;
    top: 0;
    transform: translateY(-50%) rotate(45deg);
    width: 20px
}

.arrow-top-left {
    margin-top: 7px
}

.arrow-top-left::before {
    border-color: #999;
    border-width: 1px;
    -webkit-clip-path: polygon(0 100%, 100% 0, 0 0);
    clip-path: polygon(0 100%, 100% 0, 0 0);
    height: 20px;
    left: 18px;
    top: 0;
    transform: translateY(-50%) rotate(45deg);
    width: 20px
}

.arrow-top-middle {
    margin-top: 20px
}

.arrow-top-middle::before {
    border-color: #dcdcdc;
    border-width: 1px;
    -webkit-clip-path: polygon(0 100%, 100% 0, 0 0);
    clip-path: polygon(0 100%, 100% 0, 0 0);
    height: 20px;
    right: calc(50% - 20px);
    top: 0;
    transform: translateY(-50%) rotate(45deg);
    width: 20px
}

.notification-item {
    align-items: center;
    display: flex;
    padding: 15px 10px
}

.notification-item::before {
    background: #eee;
    border: 0;
    border-radius: 8px;
    content: "";
    flex: 0 0 auto;
    height: 16px;
    margin-right: 5px;
    width: 16px
}

.notification-item.unseen::before {
    background: #ff851b
}

.notification-item.unopened {
    background: rgba(255, 133, 27, .1)
}

.notification-item:hover {
    background-color: rgba(0, 0, 0, .05)
}

.notification-item .notification-content {
    min-width: 0
}

.notification-item img {
    border-radius: 30px;
    flex: 0 0 60px;
    height: 60px;
    margin-right: 10px;
    max-width: 60px;
    object-fit: cover;
    width: 60px
}

.notification-item h3, .notification-item p, .notification-item .notification-meta {
    display: block;
    margin: 3px 0
}

.notification-item span {
    color: #4d4d4d;
    font-size: .8em;
    font-weight: bold;
    line-height: 1.2em
}

.notification-item .notification-content p {
    color: #4d4d4d;
    font-size: .8rem;
    font-weight: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.notification-item .notification-meta {
    color: #bfbfbf;
    font-size: .7em
}

.notification-item:not(:last-child) {
    border-bottom: 1px solid #eee
}

.newsletter-subscribe {
    width: 100%;
    margin: 0 auto;
    background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.92), rgb(255, 255, 255)), url("/assets/img/cards.jpg");
    background-size: cover;
    padding: 40px;
    border-top: 1px solid #aeaeae;
    text-align: center
}

.newsletter-subscribe__label-text {
    color: #4d4d4d;
    font-size: 16px
}

.newsletter-subscribe__checkbox {
    width: 14px;
    height: 14px
}

.newsletter-subscribe__title {
    color: #4d4d4d;
    font-size: 36px;
    font-weight: 600;
    margin: 0
}

.newsletter-subscribe__subtitle {
    color: #4d4d4d;
    font-size: 24px;
    margin-top: 0;
    margin-bottom: 0;
    padding-bottom: 5px
}

.newsletter-subscribe__submit {
    border-radius: 0 29px 29px 0;
    font-size: 24px;
    color: #fff;
    text-transform: none;
    padding: 5px 25px;
    text-align: center
}

.newsletter-subscribe__input-wrapper {
    display: grid;
    grid-template-columns:1fr auto;
    padding-bottom: 20px;
    margin: 15px auto 0;
    max-width: 580px
}

.newsletter-subscribe__input {
    padding: 12px 14px 12px 22px;
    border: 1px solid #aeaeae;
    font-size: 1.25rem;
    border-radius: 29px 0 0 29px
}

.newsletter-subscribe__separator {
    max-width: 440px;
    margin: 20px auto;
    background: linear-gradient(270deg, rgba(255, 133, 27, 0) -0.64%, rgba(255, 133, 27, 0) -0.63%, #ff851b 46.28%, rgba(255, 133, 27, 0) 91.29%)
}

.newsletter-subscribe__label-text {
    color: #4d4d4d;
    font-size: 18px
}

.newsletter-subscribe__checkbox {
    width: 14px;
    height: 14px
}

@media (max-width: 640px) {
    .newsletter-subscribe {
        padding: 25px 40px
    }

    .newsletter-subscribe__input-wrapper {
        grid-template-columns:auto auto
    }

    .newsletter-subscribe__title {
        font-size: 30px
    }

    .newsletter-subscribe__subtitle {
        font-size: 20px;
        line-height: 1.5
    }

    .newsletter-subscribe__input {
        text-align: left;
        padding: 8px;
        font-size: 16px;
        border-radius: 24px 0 0 24px
    }

    .newsletter-subscribe__submit {
        border-radius: 0 24px 24px 0;
        font-size: 16px;
        padding: 8px
    }
}

.breadcrumb {
    display: flex;
    flex-flow: row wrap;
    font-weight: 400;
    margin: 8px 0;
    font-size: .8rem;
    line-height: 1.6
}

.breadcrumb .sptr {
    padding: 0 5px
}

.breadcrumb + h1 {
    margin-top: 0 !important
}

form.search {
    background-color: #fff;
    border: 1px solid #dcdcdc;
    border-radius: 20px;
    box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0);
    display: inline-flex;
    font-size: .9rem;
    max-width: 100%;
    min-height: 37px;
    min-width: 140px;
    overflow: hidden;
    transform: translateY(0);
    transition: all .2s linear
}

form.search:focus-within {
    background: #fff;
    box-shadow: 0 3px 5px 0 #4d4d4d;
    transform: translateY(-2px)
}

form.search label {
    display: none
}

form.search input {
    -webkit-appearance: none;
    background: none;
    border: 0;
    -webkit-border-radius: 0;
    margin: 0;
    -webkit-padding-start: 0
}

form.search input[type=search] {
    flex: 1 1 auto;
    font-size: 1.25em;
    min-width: 100px;
    padding: 5px 5px 5px 15px
}

form.search input[type=search]::placeholder {
    color: #ddd
}

form.search input[type=submit] {
    background-color: #ff851b;
    border: 2px solid #fff;
    border-radius: 20px;
    color: #fff;
    display: inline-block;
    flex: 0 0 35px;
    font-family: "icons";
    font-size: 1.225em;
    height: 35px;
    padding: 0;
    width: 35px
}

form.search input[type=submit]:hover {
    background-color: #e86d13
}

.notification-bottom {
    align-items: baseline;
    background: rgba(23, 23, 23, .7);
    bottom: 0;
    color: #fff;
    display: flex;
    overflow: hidden;
    padding: 3px 10px 3px 15px;
    position: -ms-device-fixed;
    position: fixed;
    width: 100%;
    z-index: 6
}

@media (min-width: 1026px) {
    .notification-bottom {
        align-items: center;
        height: 40px;
        text-align: center
    }
}

.notification-bottom .message-cont {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    justify-content: center
}

@media (min-width: 640px) {
    .notification-bottom .message-cont {
        flex-direction: row
    }
}

.notification-bottom p {
    font-size: 12px
}

.notification-bottom button {
    border-radius: 4px;
    font-size: 12px;
    margin: 0 0 10px;
    padding: 5px 14px
}

@media (min-width: 640px) {
    .notification-bottom button {
        margin: auto 10px
    }
}

.notification-bottom span.close {
    color: #bfbfbf;
    cursor: pointer;
    display: inline-flex;
    font-size: 15px;
    padding: 0 0 0 10px
}

@media (max-width: 1025px) {
    .mobile-cta-footer + .notification-bottom {
        transition: transform .3s linear
    }

    .mobile-cta-footer.visible + .notification-bottom {
        transform: translateY(-75px)
    }
}