@font-face {
    font-family: 'Montserrat';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url("/assets/vendor/fonts.gstatic.com/f9c1616c4a7e42ebd4236707.woff2") format('woff2');
    unicode-range: U +0460 -052F, U +1C80 -1C8A, U +20B4, U +2DE0 -2DFF, U + A640-A69F, U + FE2E-FE2F;
}

p {
    font-size: 1em;
    line-height: 1.2em;
    margin: 0;
    padding: 5px 0
}

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
}

.classified {
    --rarity-color: #47194e;
    --rarity-color-lighten: #bd9fb7;
    --rarity-color-0: rgba(71, 25, 78, 0);
    --rarity-color-10: rgba(71, 25, 78, .1);
    --rarity-color-35: rgba(71, 25, 78, .35);
    --rarity-color-70: rgba(71, 25, 78, .7);
    --rarity-color-90: rgba(71, 25, 78, .9)
}

.rare {
    --rarity-color: #534213;
    --rarity-color-lighten: #bfb8a0;
    --rarity-color-0: rgba(83, 66, 19, 0);
    --rarity-color-10: rgba(83, 66, 19, .1);
    --rarity-color-35: rgba(83, 66, 19, .35);
    --rarity-color-70: rgba(83, 66, 19, .7);
    --rarity-color-90: rgba(83, 66, 19, .9)
}

@font-face {
    font-family: Ecoin;
    font-style: normal;
    font-weight: 400;
    src: url("/assets/ecoin.ttf")
}



* {
    -webkit-text-size-adjust: 100%;
    box-sizing: border-box
}

article,
aside,
footer,
header,
nav,
section {
    display: block
}

body,
html {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    scrollbar-gutter: stable;
    width: 100%
}

body {
    -webkit-font-smoothing: antialiased;
    background-color: #080c12;
    color: #fff;
    font-family: 'Montserrat', 'Ecoin', sans-serif;
    font-size: 14px
}

body.js-hide-scroll,
body.noscroll {
    overflow-y: hidden
}

body::-webkit-scrollbar-track {
    background-color: transparent
}

body::-webkit-scrollbar {
    height: 3px;
    width: 6px
}

body::-webkit-scrollbar-thumb {
    background-color: rgba(115, 140, 178, .2)
}

ol,
ul {
    list-style-type: none
}

button,
input,
textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    border: none;
    border-radius: 0;
    box-shadow: none;
    font-family: inherit;
    margin: 0;
    outline: none;
    padding: 0
}

a,
h1,
h2,
h3,
h4,
h5,
h6,
p {
    word-wrap: break-word
}

a {
    color: #fff;
    display: inline-block;
    text-decoration: none
}

button {
    background-color: inherit;
    cursor: pointer
}

img {
    background-color: transparent;
    display: block;
    height: auto;
    max-width: 100%
}

i {
    font-style: normal
}

.gradient-text {
    background-clip: text;
    background-image: linear-gradient(#fff, #0c121b 150%);
    background-position: 50%;
    color: transparent
}

.layout {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    position: relative;
    width: 100%
}

@media not screen and (min-width:1024px) {
    .layout {
        overflow: hidden
    }
}

.layout__header {
    position: relative;
    z-index: 5
}

.layout__footer {
    position: relative;
    z-index: 1
}

.layout__content {
    margin-bottom: auto;
    padding: 20px 0;
    position: relative
}

@media (min-width:900px) {
    .layout {
        width: 100%
    }
}

@media (min-width:1024px) {

    .layout_smoke:after,
    .layout_smoke:before {
        background-image: url("/assets/smoke.png");
        background-size: 100%;
        content: "";
        display: block;
        height: 100%;
        position: absolute;
        top: 0;
        width: 360px;
        z-index: -1
    }
}

.layout_smoke:before {
    left: 0
}

.layout_smoke:after {
    right: 0;
    transform: scaleX(-1)
}

.wrapper {
    margin: 0 auto;
    max-width: 1700px;
    padding: 0 10px;
    width: 100%
}

@media (min-width:768px) {
    .wrapper {
        padding: 0 30px
    }
}

.price {
    color: inherit;
    display: inline-block;
    font-weight: inherit;
    text-transform: none
}

.price:after,
.price:before {
    font-style: inherit;
    font-weight: inherit !important;
    line-height: 1em;
    vertical-align: baseline
}

.price:after {
    margin-left: 2px
}

.price:before {
    margin-right: 2px
}

.price.price-RUB:after {
    content: "₽"
}

.price.price-USD:before {
    content: "$"
}

.price.price-EUR:before {
    content: "€"
}

.price.price-COIN {
    display: inline-flex;
    flex-direction: row-reverse
}

.price.price-COIN:after {
    color: inherit;
    content: "\E800";
    font-size: 1em;
    font-weight: 400 !important;
    line-height: 1.5em;
    margin-right: 4px;
    text-transform: none
}

.price.price-percent:after {
    content: "%";
    font-family: inherit;
    font-weight: inherit !important
}

.price.price-bonus {
    align-items: center;
    display: flex
}

.price.price-bonus:after {
    display: none
}

.price.price-bonus:before {
    content: "";
    margin-right: 10px;
    margin-top: 6px
}

input[type=text] {
    height: 56px
}

.icon:before {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: inline-block;
    flex: none;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    position: relative;
    transition: .2s ease
}

.icon_search:before {
    height: 18px;
    -webkit-mask-image: url("/assets/search-269fc20343.svg");
    mask-image: url("/assets/search-269fc20343.svg");
    width: 18px
}

.icon_contract:before,
.icon_contracts:before {
    -webkit-mask-image: url("/assets/contracts-icon.svg");
    mask-image: url("/assets/contracts-icon.svg")
}

.icon_battles:before {
    -webkit-mask-image: url("/assets/battles-icon.svg");
    mask-image: url("/assets/battles-icon.svg")
}

.icon_upgrade:before,
.icon_upgrades:before {
    -webkit-mask-image: url("/assets/upgrades-icon.svg");
    mask-image: url("/assets/upgrades-icon.svg")
}

.icon_events:before {
    height: 16px;
    -webkit-mask-image: url("/assets/events-icon-951eba4f02.svg");
    mask-image: url("/assets/events-icon-951eba4f02.svg");
    width: 16px
}

.icon_cases:before {
    -webkit-mask-image: url("/assets/cases.svg");
    mask-image: url("/assets/cases.svg")
}

.icon_trash:before {
    -webkit-mask-image: url("/assets/trash.svg");
    mask-image: url("/assets/trash.svg")
}

.icon_close:before {
    -webkit-mask-image: url("/assets/close.svg");
    mask-image: url("/assets/close.svg")
}

.icon_completed:before,
.icon_steam:before {
    -webkit-mask-image: url("/assets/steam.svg");
    mask-image: url("/assets/steam.svg")
}

.icon_crown:before {
    -webkit-mask-image: url("/assets/crown.svg");
    mask-image: url("/assets/crown.svg")
}

.icon_copy:before {
    height: 20px;
    -webkit-mask-image: url("/assets/vendor/easydrop.bar/f78bc9d30813e6932c1e6c3e.svg");
    mask-image: url("/assets/vendor/easydrop.bar/f78bc9d30813e6932c1e6c3e.svg");
    width: 20px
}

.btn {
    align-items: center;
    background: #f3b705;
    background-position: 50%;
    background-repeat: no-repeat;
    border: 1px solid transparent;
    border-radius: 10px;
    color: #000;
    cursor: pointer;
    display: inline-flex;
    font-size: 14px;
    font-weight: 600;
    height: 46px;
    justify-content: center;
    line-height: 130%;
    padding: 0 16px;
    position: relative;
    transition: all .3s ease;
    transition-property: box-shadow, background, border-color, color;
    user-select: none;
    white-space: nowrap
}

.btn:hover {
    background-color: #fac117
}

.btn__content {
    gap: 4px;
    height: 100%;
    justify-content: center;
    pointer-events: none
}

.btn__content,
.btn__icon {
    align-items: center;
    display: flex
}

.btn__icon:before {
    height: 18px;
    transition: background-color .3s ease;
    width: 18px
}

.btn__label {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center
}

.btn_color-primary {
    background-color: #f3b705;
    color: #000
}

.btn_color-primary:hover {
    background-color: #ff7300
}

.btn_color-primary:focus {
    box-shadow: 0 0 15px 0 #f3b705
}

.btn_color-primary .btn__icon:before {
    background: #000
}

.btn_color-primary.btn.active,
.btn_color-primary.btn_active {
    background-color: #ff7300
}

.btn_color-primary.btn_shade-darken {
    background-color: #daa404
}

.btn_color-primary.btn_shade-darken:hover {
    background-color: #a87f03
}

.btn_color-primary.btn_shade-fade {
    background-color: rgba(243, 183, 5, .07)
}

.btn_color-primary.btn_shade-fade:hover {
    background-color: rgba(243, 183, 5, .14)
}

.btn_color-primary.btn_style-outline {
    backdrop-filter: blur(20px);
    background-color: rgba(243, 183, 5, .2);
    border: 1px solid rgba(255, 115, 0, .5)
}

.btn_color-primary.btn_style-outline:hover {
    background-color: rgba(243, 183, 5, .4);
    border-color: rgba(255, 115, 0, .6)
}

.btn_color-primary.btn_style-outline:focus {
    box-shadow: 0 0 15px 0 rgba(255, 115, 0, .3)
}

.btn_color-primary.btn_shade-fade.btn_style-outline {
    border: 1px solid rgba(243, 183, 5, .1)
}

.btn_color-primary.btn_shade-fade.btn_style-outline:hover {
    border: 1px solid rgba(243, 183, 5, .3)
}

.btn_color-primary.btn_transparent {
    background: rgba(1, 8, 18, .7);
    color: #f3b705
}

.btn_color-primary.btn_transparent:hover {
    color: #ff7300
}

.btn_color-primary.btn_transparent .btn__icon:before {
    background: #f3b705
}

.btn_color-primary.btn_transparent:hover .btn__icon:before {
    background: #ff7300
}

.btn_color-secondary {
    background-color: #738cb21a;
    color: hsla(0, 0%, 100%, .4)
}

.btn_color-secondary:hover {
    background-color: rgba(115, 140, 178, .2)
}

.btn_color-secondary:focus {
    box-shadow: 0 0 15px 0 #738cb21a
}

.btn_color-secondary .btn__icon:before {
    background: hsla(0, 0%, 100%, .4)
}

.btn_color-secondary.btn.active,
.btn_color-secondary.btn_active {
    background-color: rgba(115, 140, 178, .2)
}

.btn_color-secondary.btn_shade-darken {
    background-color: rgba(99, 126, 169, .102)
}

.btn_color-secondary.btn_shade-darken:hover {
    background-color: rgba(77, 102, 140, .102)
}

.btn_color-secondary.btn_shade-fade {
    background-color: rgba(115, 140, 178, .07)
}

.btn_color-secondary.btn_shade-fade:hover {
    background-color: rgba(115, 140, 178, .14)
}

.btn_color-secondary.btn_style-outline {
    backdrop-filter: blur(20px);
    background-color: rgba(115, 140, 178, .2);
    border: 1px solid rgba(115, 140, 178, .5)
}

.btn_color-secondary.btn_style-outline:hover {
    background-color: rgba(115, 140, 178, .4);
    border-color: rgba(115, 140, 178, .6)
}

.btn_color-secondary.btn_style-outline:focus {
    box-shadow: 0 0 15px 0 rgba(115, 140, 178, .3)
}

.btn_color-secondary.btn_shade-fade.btn_style-outline {
    border: 1px solid rgba(115, 140, 178, .1)
}

.btn_color-secondary.btn_shade-fade.btn_style-outline:hover {
    border: 1px solid rgba(115, 140, 178, .3)
}

.btn_color-secondary.btn_transparent {
    background: rgba(1, 8, 18, .7);
    color: #738cb21a
}

.btn_color-secondary.btn_transparent:hover {
    color: rgba(115, 140, 178, .2)
}

.btn_color-secondary.btn_transparent .btn__icon:before {
    background: #738cb21a
}

.btn_color-secondary.btn_transparent:hover .btn__icon:before {
    background: rgba(115, 140, 178, .2)
}

.btn_color-success {
    background-color: #6dae01;
    color: #fff
}

.btn_color-success:hover {
    background-color: hsla(0, 0%, 100%, .6)
}

.btn_color-success:focus {
    box-shadow: 0 0 15px 0 #6dae01
}

.btn_color-success .btn__icon:before {
    background: #fff
}

.btn_color-success.btn.active,
.btn_color-success.btn_active {
    background-color: hsla(0, 0%, 100%, .6)
}

.btn_color-success.btn_shade-darken {
    background-color: #5d9501
}

.btn_color-success.btn_shade-darken:hover {
    background-color: #3d6201
}

.btn_color-success.btn_shade-fade {
    background-color: rgba(109, 174, 1, .07)
}

.btn_color-success.btn_shade-fade:hover {
    background-color: rgba(109, 174, 1, .14)
}

.btn_color-success.btn_style-outline {
    backdrop-filter: blur(20px);
    background-color: rgba(109, 174, 1, .2);
    border: 1px solid hsla(0, 0%, 100%, .5)
}

.btn_color-success.btn_style-outline:hover {
    background-color: rgba(109, 174, 1, .4);
    border-color: hsla(0, 0%, 100%, .6)
}

.btn_color-success.btn_style-outline:focus {
    box-shadow: 0 0 15px 0 hsla(0, 0%, 100%, .3)
}

.btn_color-success.btn_shade-fade.btn_style-outline {
    border: 1px solid rgba(109, 174, 1, .1)
}

.btn_color-success.btn_shade-fade.btn_style-outline:hover {
    border: 1px solid rgba(109, 174, 1, .3)
}

.btn_color-success.btn_transparent {
    background: rgba(1, 8, 18, .7);
    color: #6dae01
}

.btn_color-success.btn_transparent:hover {
    color: hsla(0, 0%, 100%, .6)
}

.btn_color-success.btn_transparent .btn__icon:before {
    background: #6dae01
}

.btn_color-success.btn_transparent:hover .btn__icon:before {
    background: hsla(0, 0%, 100%, .6)
}

.btn_size-big {
    font-size: 16px;
    height: 56px;
    padding: 0 25px
}

.btn_size-big.btn_type-square {
    padding: 0;
    width: 56px
}

.btn_size-fill {
    font-size: 13px;
    height: 100%;
    padding: 0 16px
}

.btn_size-fill.btn_type-square {
    padding: 0;
    width: 100%
}

.btn_size-extract(small mid big content fill, 6) {
    font-size: extract(12px 13px 16px 13px 13px, 6);
    height: extract(24px 36px 56px auto 100%, 6);
    padding: 0 extract(8px 12px 25px 16px 16px, 6)
}

.btn_size-extract(small mid big content fill, 6).btn_type-square {
    padding: 0;
    width: extract(24px 36px 56px auto 100%, 6)
}

.btn_size-extract(small mid big content fill, 7) {
    font-size: extract(12px 13px 16px 13px 13px, 7);
    height: extract(24px 36px 56px auto 100%, 7);
    padding: 0 extract(8px 12px 25px 16px 16px, 7)
}

.btn_size-extract(small mid big content fill, 7).btn_type-square {
    padding: 0;
    width: extract(24px 36px 56px auto 100%, 7)
}

.btn_type-square {
    overflow: hidden;
    width: 46px
}

.btn_type-square .btn__icon:before {
    margin: 0
}

.btn[disabled],
.btn_disabled {
    pointer-events: none
}

.btn_transparent {
    background-color: transparent
}

.btn_transparent:hover {
    background-color: hsla(0, 0%, 100%, .1)
}

.btn_transparent .btn__icon:before {
    background: #fff
}

.btn_size-big {
    border-radius: 12px
}

.btn_size-big .btn__icon:before {
    height: 18px;
    width: 18px
}

.btn_uppercase {
    text-transform: uppercase
}

.btn_color-primary.btn[disabled],
.btn_color-primary.btn_disabled {
    background-color: #483f0c
}

.btn_color-primary.btn[disabled].btn_transparent,
.btn_color-primary.btn_disabled.btn_transparent {
    background: rgba(1, 8, 18, .7)
}

.btn_color-primary.btn_transparent:hover {
    background: rgba(1, 8, 18, .9)
}

.btn_color-success.btn[disabled],
.btn_color-success.btn_disabled {
    background-color: rgba(109, 174, 1, .5)
}

.btn_color-primary.btn_timer {
    color: #fff;
    margin-top: 31px
}

.btn_color-primary.btn_timer .btn__icon:before {
    background-color: #fff
}

.btn_color-secondary {
    backdrop-filter: blur(20px)
}

.btn_color-secondary.active {
    color: #fff
}

.btn_color-secondary.active .btn__icon:before {
    background-color: #fff
}

.btn.asc .btn__icon {
    transform: scaleY(-1)
}

.new-popup {
    align-items: center;
    background: rgba(0, 0, 0, .3);
    display: flex;
    height: 100%;
    justify-content: center;
    left: 0;
    padding: 10px;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9999
}

.new-popup.new-popup_prizes {
    visibility: hidden
}

.new-popup.active {
    opacity: 1;
    pointer-events: auto;
    visibility: visible
}

@media (min-width:768px) {
    .new-popup {
        padding: 30px
    }
}

.new-popup__box {
    background: #0c121b;
    border-radius: 6px;
    margin: auto;
    max-height: 100%;
    max-width: 660px;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 30px 25px;
    position: relative;
    width: 100%
}

@media (min-width:768px) {
    .new-popup__box {
        border-radius: 20px;
        padding: 50px
    }

    .new-popup__box::-webkit-scrollbar-track {
        background-color: transparent
    }

    .new-popup__box::-webkit-scrollbar {
        height: 3px;
        width: 3px
    }

    .new-popup__box::-webkit-scrollbar-thumb {
        background-color: rgba(115, 140, 178, .2)
    }
}

@media (min-width:1024px) {
    .new-popup__box {
        padding: 60px 80px
    }
}

.new-popup__close {
    position: absolute;
    right: 20px;
    top: 20px;
    z-index: 2
}

@media (min-width:1024px) {
    .new-popup__close {
        right: 28px;
        top: 28px
    }
}

.new-popup_default .new-popup__box {
    max-width: 545px
}

@media (min-width:1024px) {
    .new-popup_prizes .new-popup__box {
        padding: 58px 50px 40px
    }
}

.new-popup_prizes .new-popup__close {
    right: 0;
    top: 0
}

@media (min-width:768px) {
    .new-popup_prizes .new-popup__close {
        right: 20px;
        top: 20px
    }
}

@keyframes popupShow {
    to {
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes popupOverlayShow {
    to {
        opacity: 1
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes skinRotate {
    0% {
        transform: translate(-50%, -50%) rotate(0deg)
    }

    50% {
        transform: translate(-50%, -50%) rotate(180deg)
    }

    to {
        transform: translate(-50%, -50%) rotate(0deg)
    }
}

.timer {
    display: flex;
    gap: 5px
}

@media (min-width:768px) {
    .timer {
        gap: 18px
    }
}

.timer__nums {
    align-items: center;
    backdrop-filter: blur(4px);
    background: #1e7f8780;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    font-size: 16px;
    font-weight: 600;
    height: 44px;
    justify-content: center;
    line-height: 24px;
    position: relative;
    text-align: center;
    width: 50px
}

.timer__nums:after {
    color: rgba(174, 191, 217, .8);
    content: ":";
    position: absolute;
    right: -11px;
    top: 50%;
    transform: translateY(-50%)
}

.timer__column:last-child .timer__nums:after {
    display: none
}

.timer__label {
    color: #fff;
    font-size: 11px;
    line-height: 16px;
    opacity: .4
}

.timer_raffle .timer__nums {
    backdrop-filter: none;
    background: transparent;
    height: 16px;
    width: 24px
}

.timer_raffle .timer__label {
    font-size: 0
}

@keyframes preloader-rotate {
    to {
        transform: rotate(1turn)
    }
}

@-o-keyframes preloader-rotate {
    to {
        -o-transform: rotate(1turn)
    }
}

@-ms-keyframes preloader-rotate {
    to {
        -ms-transform: rotate(1turn)
    }
}

@-webkit-keyframes preloader-rotate {
    to {
        -webkit-transform: rotate(1turn)
    }
}

@-moz-keyframes preloader-rotate {
    to {
        -moz-transform: rotate(1turn)
    }
}

.header__bottom {
    min-height: 55px
}

@media (min-width:768px) {
    .header__bottom {
        min-height: 72px
    }
}

.header-top {
    padding: 8px 10px;
    position: relative;
    z-index: 60
}

@media not screen and (min-width:1250px) {
    .header-top {
        background: #0c121b;
        border-radius: 20px;
        margin-top: 10px;
        max-width: 300px;
        opacity: 0;
        padding: 5px 15px 15px;
        position: absolute;
        right: 10px;
        top: 100%;
        visibility: hidden;
        width: 100%
    }
}

@media (min-width:1250px) {
    .header-top {
        align-items: center;
        border-bottom: 1px solid #6b698333;
        display: flex;
        gap: 4px;
        padding: 8px 20px
    }
}

@media not screen and (min-width:1250px) {
    .header-top__socials {
        margin: 0 4px
    }
}

@media (min-width:1250px) {
    .header-top__socials {
        margin-left: auto;
        order: 2
    }
}

@media not screen and (min-width:1250px) {
    .header-top.fixed {
        position: fixed;
        top: 56px
    }

    .header-top.active {
        opacity: 1;
        visibility: visible
    }
}

.header-bottom {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding: 15px 10px 0;
    position: relative
}

@media (min-width:768px) {
    .header-bottom {
        padding: 15px 25px 0
    }
}

@media not screen and (min-width:768px) {
    .header-bottom__userbar {
        max-width: calc(100% - 80px)
    }
}

.header-bottom__nav {
    align-items: center;
    display: flex
}

@media not screen and (min-width:1024px) {
    .header-bottom__nav {
        background-color: #0c121b;
        bottom: 0;
        height: 56px;
        left: 0;
        padding: 0 10px;
        position: fixed;
        width: 100%
    }
}

@media (min-width:768px) {
    .header-bottom__nav {
        height: 63px
    }
}

@media (min-width:1024px) {
    .header-bottom__nav {
        flex-basis: 100%;
        height: unset;
        padding: 0 20px
    }
}

@media (min-width:1250px) {
    .header-bottom__nav {
        padding: 0 30px
    }
}

@media not screen and (min-width:1024px) {
    .header-bottom__nav-inner {
        height: 100%;
        width: 100%
    }
}

.header-bottom__logo {
    flex: none;
    height: 36px;
    width: 61px
}

@media (min-width:768px) {
    .header-bottom__logo {
        height: 60px;
        width: 102px
    }
}

.header-bottom_fixed {
    padding: 11px 15px
}

.header-bottom_fixed .header-bottom__logo {
    height: 45px;
    width: 71px
}

.header-logo {
    display: block;
    height: 100%;
    position: relative;
    transition: .2s ease;
    width: 100%
}

.header-logo:hover {
    opacity: .7
}

.header-logo:after,
.header-logo:before {
    content: "";
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: .4s ease-in-out;
    width: 100%
}

.header-logo:before {
    background-image: url("/assets/vendor/easydrop.bar/9b806acd0044cc9ee058f98a.svg");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    opacity: 1
}

.nav-site {
    display: flex;
    flex-wrap: wrap
}

.nav-site__link {
    color: rgba(174, 191, 217, .8);
    transition: .2s ease
}

@media not screen and (min-width:1250px) {
    .nav-site_top {
        display: flex;
        flex-direction: column
    }
}

@media (min-width:1250px) {
    .nav-site_top {
        gap: 20px
    }
}

@media not screen and (min-width:1250px) {
    .nav-site_top .nav-site__link {
        border-bottom: 1px solid rgba(115, 140, 178, .1)
    }
}

.nav-site_top .nav-site__link-inner {
    align-items: center;
    display: flex;
    font-size: 13px;
    gap: 5px;
    line-height: 20px;
    position: relative;
    transition: .2s ease-in-out;
    white-space: nowrap
}

@media not screen and (min-width:1250px) {
    .nav-site_top .nav-site__link-inner {
        padding: 10px 0
    }
}

.nav-site_top .nav-site__link-inner.active,
.nav-site_top .nav-site__link-inner:hover,
.nav-site_top .nav-site__link-inner_new {
    color: #f3b705
}

.nav-site_top .nav-site__link-inner_new:before {
    align-items: center;
    background-color: #f3b705;
    background-image: url("/assets/fire.svg");
    background-position: 7px 5px;
    background-repeat: no-repeat;
    border-radius: 100px;
    box-sizing: border-box;
    color: #0c121b;
    content: "NEW";
    display: flex;
    font-size: 11px;
    font-weight: 600;
    height: 23px;
    justify-content: flex-start;
    line-height: 13px;
    padding-left: 21px;
    position: relative;
    text-align: left;
    width: 57px
}

.nav-site_top .nav-site__link-inner_new:hover {
    filter: brightness(1.2)
}

.nav-site_bottom {
    align-items: center;
    flex-wrap: nowrap;
    height: 100%;
    justify-content: space-between;
    width: 100%
}

@media (min-width:375px) {
    .nav-site_bottom {
        justify-content: space-around
    }
}

@media (min-width:1024px) {
    .nav-site_bottom {
        grid-row-gap: 10px;
        grid-column-gap: 20px;
        display: grid;
        grid-auto-flow: column;
        grid-template-columns: repeat(auto-fit, minmax(100px, auto));
        grid-template-rows: repeat(2, auto)
    }
}

@media (min-width:1250px) {
    .nav-site_bottom {
        display: flex;
        gap: 28px
    }
}

.nav-site_bottom .nav-site__link {
    align-items: center;
    display: flex;
    position: relative
}

@media not screen and (min-width:1024px) {
    .nav-site_bottom .nav-site__link {
        flex: 1 1 0;
        height: 100%;
        overflow: hidden
    }

    .nav-site_bottom .nav-site__link-text {
        max-width: 85%;
        overflow: hidden;
        text-overflow: ellipsis
    }
}

.nav-site_bottom .nav-site__link-text span {
    display: inline-block;
    flex: none;
    min-width: 15px
}

@media not screen and (min-width:1024px) {
    .nav-site_bottom .nav-site__link-text span {
        display: none
    }
}

.nav-site_bottom .nav-site__link-inner {
    align-items: center;
    display: flex;
    flex-direction: column;
    font-size: 6px;
    font-weight: 700;
    justify-content: center;
    line-height: 12px;
    text-transform: uppercase;
    transition: .2s ease-in-out;
    white-space: nowrap
}

@media not screen and (min-width:1024px) {
    .nav-site_bottom .nav-site__link-inner {
        height: 100%;
        width: 100%
    }
}

@media (min-width:768px) {
    .nav-site_bottom .nav-site__link-inner {
        font-size: 11px
    }
}

@media (min-width:1024px) {
    .nav-site_bottom .nav-site__link-inner {
        flex-direction: row;
        font-size: 13px;
        line-height: 12px
    }
}

@media (min-width:1250px) {
    .nav-site_bottom .nav-site__link-inner {
        border-radius: 8px;
        padding: 0
    }
}

.nav-site_bottom .nav-site__link-inner:before {
    background-color: #aebfd9cc;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    flex: none;
    height: 20px;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    transition: .2s ease-in-out;
    width: 20px
}

@media (min-width:768px) {
    .nav-site_bottom .nav-site__link-inner:before {
        margin: 0 0 5px
    }
}

@media (min-width:1024px) {
    .nav-site_bottom .nav-site__link-inner:before {
        margin: 0 7px 0 0
    }
}

.nav-site_bottom .nav-site__link-inner:hover {
    color: #f3b705
}

.nav-site_bottom .nav-site__link-inner:hover:before {
    background-color: #f3b705
}

.nav-site_bottom .nav-site__link-inner.highlight {
    color: #feb91f
}

.nav-site_bottom .nav-site__link-inner.highlight:before {
    background-color: #f3b705
}

.nav-site_bottom .nav-site__link-inner.active {
    color: #f3b705
}

.nav-site_bottom .nav-site__link-inner.active:before {
    background-color: #f3b705
}

.nav-site_bottom .nav-site__link-inner span+span {
    margin-left: 5px
}

@keyframes opacityPulseFull {

    0%,
    to {
        opacity: 0
    }

    50% {
        opacity: 1
    }
}

.login-block,
.userbar-block {
    align-items: center;
    display: flex;
    gap: 6px;
    justify-content: flex-end
}

@media (min-width:768px) {

    .login-block,
    .userbar-block {
        gap: 11px
    }
}

.login-block__bars,
.userbar-block__bars {
    align-items: center;
    background: rgba(115, 140, 178, .1);
    border-radius: 8px;
    display: flex;
    flex: none;
    height: 36px;
    justify-content: center;
    width: 36px
}

@media (min-width:768px) {

    .login-block__bars,
    .userbar-block__bars {
        height: 46px;
        width: 46px
    }
}

@media (min-width:1250px) {

    .login-block__bars,
    .userbar-block__bars {
        display: none
    }
}

.login-block__btn,
.userbar-block__btn {
    height: 42px
}

.login-block_sticky .login-block__bars,
.login-block_sticky .userbar-block__bars,
.userbar-block_sticky .login-block__bars,
.userbar-block_sticky .userbar-block__bars {
    display: none
}

.bars {
    position: relative;
    width: 18px
}

.bars,
.bars:after,
.bars:before {
    background: rgba(174, 191, 217, .8);
    border-radius: 2px;
    height: 2px
}

.bars:after,
.bars:before {
    content: "";
    display: block;
    position: absolute;
    transition: .2s ease
}

.bars:before {
    top: -5px;
    width: 18px
}

.bars:after {
    bottom: -5px;
    width: 12px
}

.bars.active {
    background: transparent
}

.bars.active:before {
    transform: translateY(5px) rotate(45deg)
}

.bars.active:after {
    transform: translateY(-5px) rotate(-45deg);
    width: 18px
}

.socials-links {
    align-items: center;
    display: flex;
    gap: 4px
}

.socials-links__link {
    background-color: rgba(115, 140, 178, .1);
    border-radius: 10px;
    display: block;
    flex: none;
    height: 36px;
    position: relative;
    width: 36px
}

.socials-links__link:after {
    background-color: hsla(0, 0%, 85%, .8);
    content: "";
    height: 20px;
    left: 50%;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask-size: 100%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: .2s ease-in-out;
    width: 20px
}

.socials-links__link:hover:after {
    background-color: #fff
}

.socials-links__link_vk:after {
    -webkit-mask-image: url("/assets/vk.svg");
    mask-image: url("/assets/vk.svg")
}

.socials-links__link_telegram:after {
    -webkit-mask-image: url("/assets/telegram-a798de8ee7.svg");
    mask-image: url("/assets/telegram-a798de8ee7.svg")
}

.quick-links {
    background: #080c12;
    border-bottom: 1px solid rgba(115, 140, 178, .1);
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: fixed;
    top: 0;
    transition: .2s ease;
    width: 100%;
    z-index: 1000
}

@media not screen and (min-width:1024px) {
    .quick-links__main {
        display: none
    }
}

.quick-links__secondary {
    border-top: 1px solid rgba(115, 140, 178, .1)
}

.quick-links__links:after,
.quick-links__links:before {
    background: linear-gradient(270deg, #080c12 -2.11%, #080c12 14.08%, rgba(28, 23, 67, 0));
    bottom: 0;
    content: "";
    display: block;
    height: 47px;
    pointer-events: none;
    position: absolute;
    transition: opacity .2s ease;
    width: 72px
}

.quick-links__links:after {
    opacity: 1;
    right: 0
}

.quick-links__links:before {
    left: 0;
    opacity: 0;
    transform: scaleX(-1);
    z-index: 1
}

.quick-links__links-scrolled {
    max-width: 100%;
    overflow: auto;
    scroll-behavior: smooth
}

.quick-links__links-scrolled::-webkit-scrollbar {
    display: none
}

.quick-links__links-items {
    align-items: flex-end;
    display: flex;
    float: left;
    gap: 20px;
    min-width: 100%;
    padding: 0 15px;
    white-space: nowrap
}

.quick-links__link {
    color: rgba(174, 191, 217, .8);
    cursor: pointer;
    display: block;
    font-size: 13px;
    padding: 16px 0 18px;
    transition: color .2s ease, border-color .2s ease
}

.quick-links__link.active,
.quick-links__link:hover {
    color: #f3b705
}

.quick-links.active {
    opacity: 1;
    pointer-events: auto
}

.quick-links.started .quick-links__links:before {
    opacity: 1
}

.quick-links.finished .quick-links__links:after {
    opacity: 0
}

.drophistory {
    overflow: hidden;
    width: 100%
}

.drophistory__wrapper {
    display: flex;
    position: relative;
    width: 100%
}

.drophistory__inner {
    display: flex;
    left: -7px;
    position: relative
}

.drophistory__item {
    flex: none;
    height: 55px;
    margin-right: -5px;
    position: relative;
    width: 66px
}

@media (min-width:768px) {
    .drophistory__item {
        height: 92px;
        margin-right: -8px;
        width: 110px
    }
}

.drophistory__item img {
    transition: .2s ease
}

@media (min-width:768px) {
    .drophistory__item:hover .item-history img {
        transform: scale(.8)
    }

    .drophistory__item:hover .drophistory-tooltip {
        opacity: 1;
        top: 50%;
        transform: translate(-50%, -50%) scale(1);
        visibility: visible
    }
}

@media not screen and (min-width:768px) {
    .drophistory__farm {
        display: none
    }
}

@media (min-width:768px) {
    .drophistory__farm {
        height: 100%
    }
}

.item-history {
    align-items: center;
    background: #0c121b;
    display: flex;
    height: 100%;
    justify-content: center;
    -webkit-mask-image: url("/assets/item-history-269fc20343.svg");
    mask-image: url("/assets/item-history-269fc20343.svg");
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    position: relative;
    width: 100%
}

.item-history img {
    position: relative;
    width: 56px;
    z-index: 3
}

@media (min-width:768px) {
    .item-history img {
        width: 84px
    }
}

.item-history:after,
.item-history:before {
    content: "";
    position: absolute
}

.item-history:before {
    border-radius: 50%;
    filter: blur(14px);
    height: 25px;
    isolation: isolate;
    left: 50%;
    mix-blend-mode: hard-light;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 25px;
    z-index: 1
}

@media (min-width:768px) {
    .item-history:before {
        filter: blur(21px);
        height: 45px;
        width: 45px
    }
}

.item-history:after {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100%;
    height: 18px;
    right: 15px;
    top: 10%;
    width: 18px;
    z-index: 5
}

@media (min-width:768px) {
    .item-history:after {
        height: 20px;
        right: 20px;
        width: 20px
    }
}

.item-history_common {
    background: linear-gradient(0deg, rgba(59, 47, 60, .4), #3b2f3c)
}

.item-history_common:before {
    background-color: #feffc9
}

.item-history_uncommon {
    background: linear-gradient(0deg, rgba(29, 67, 76, .4), #1d434c)
}

.item-history_uncommon:before {
    background-color: #00f0ff
}

.item-history_milspec {
    background: linear-gradient(0deg, rgba(29, 47, 76, .4), #1d2f4c)
}

.item-history_milspec:before {
    background-color: #009dff
}

.item-history_restricted {
    background: linear-gradient(0deg, rgba(52, 33, 80, .4), #342150)
}

.item-history_restricted:before {
    background-color: #db00ff
}

.item-history_classified {
    background: linear-gradient(0deg, rgba(71, 25, 78, .4), #47194e)
}

.item-history_classified:before {
    background-color: #ff21b3
}

.farm {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100%;
    background: #0c121b;
    display: flex;
    font-size: 11px;
    height: 92px;
    line-height: 13px;
    -webkit-mask-image: url("/assets/item-history-top.svg");
    mask-image: url("/assets/item-history-top.svg");
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    padding-left: 12px;
    position: relative;
    width: 211px
}

.farm:before {
    border-radius: 50%;
    content: "";
    filter: blur(21px);
    height: 45px;
    isolation: isolate;
    mix-blend-mode: hard-light;
    position: absolute;
    right: 40px;
    top: 50%;
    transform: translateY(-50%);
    width: 45px
}

.farm__info,
.farm__user-img,
.farm__won-item {
    pointer-events: none
}

.farm__info {
    position: relative;
    z-index: 5
}

.farm__title {
    align-items: center;
    display: flex;
    font-weight: 600;
    margin: 10px 0;
    min-height: 26px;
    width: 125px
}

.farm__names {
    width: 130px
}

.farm__first-name,
.farm__second-name {
    margin-bottom: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.farm__first-name {
    color: hsla(0, 0%, 85%, .4)
}

.farm__second-name {
    font-weight: 600
}

.farm__won-item {
    align-items: center;
    display: flex;
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%)
}

.farm__won-item:before {
    animation: wonFarm 2s ease-in-out 1s infinite;
    background-repeat: no-repeat;
    background-size: 100%;
    content: "";
    height: 70px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 82px;
    will-change: transform;
    z-index: 1
}

.farm__won-item img {
    backface-visibility: hidden;
    position: relative;
    transition: .2s ease-in-out;
    width: 95px;
    z-index: 2
}

.farm .drophistory-tooltip {
    width: 211px
}

.farm .drophistory-tooltip__user {
    padding-left: 90px
}

.farm .drophistory-tooltip__case-img {
    justify-content: flex-start;
    padding-left: 95px
}

.farm_rare {
    background: linear-gradient(0deg, rgba(83, 66, 19, .4), #534213)
}

.farm:hover .farm__info {
    display: none
}

.farm:hover .farm__won-item {
    display: none
}

.farm:hover .farm__won-item img {
    transform: translateY(-6px)
}

.farm:hover .farm__names {
    width: 200px
}

.farm:hover .drophistory-tooltip {
    opacity: 1;
    top: 50%;
    visibility: visible
}

@keyframes wonFarm {
    0% {
        opacity: .5;
        transform: translate(-50%, -50%) scale(1)
    }

    50% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1.15)
    }

    to {
        opacity: .5;
        transform: translate(-50%, -50%) scale(1)
    }
}

.drophistory-tooltip {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    height: 80px;
    left: 50%;
    opacity: 0;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    transform-origin: top;
    transition: .3s ease;
    visibility: hidden;
    width: 100%;
    z-index: 15
}

@media not screen and (min-width:768px) {
    .drophistory-tooltip {
        display: none
    }
}

@media (min-width:768px) {
    .drophistory-tooltip {
        height: 92px
    }
}

.drophistory-tooltip:after {
    border-bottom: 10px solid rgba(0, 0, 0, .8);
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    content: "";
    display: none;
    font-size: 0;
    height: 0;
    left: 50%;
    line-height: 0px;
    margin-left: -10px;
    position: absolute;
    top: -10px;
    width: 0
}

.drophistory-tooltip__case-img {
    display: flex;
    height: 100%;
    justify-content: center;
    position: absolute;
    top: 10px;
    width: 100%;
    z-index: 1
}

.drophistory-tooltip__case-img img {
    height: 50px;
    width: auto
}

@media (min-width:768px) {
    .drophistory-tooltip__case-img img {
        height: 60px
    }
}

.drophistory-tooltip__user-name {
    color: #fff;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    margin-top: 3px;
    max-width: 75px;
    opacity: .4;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.drophistory-tooltip__user {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-top: auto;
    padding: 0 10px 5px 15px;
    position: relative;
    z-index: 2
}

.drophistory-tooltip__user-img {
    border: 1px solid #06a4bc;
    border-radius: 100%;
    height: 40px;
    width: 40px
}

.drophistory-tooltip__drop-name {
    display: none
}

.footer {
    background: #000;
    margin-top: 80px;
    padding: 0 0 40px
}

@media (min-width:768px) {
    .footer {
        margin-top: 120px
    }
}

.footer__counters {
    margin-bottom: -40px;
    position: relative;
    top: -40px
}

@media (min-width:768px) {
    .footer__counters {
        margin-bottom: -45px;
        top: -45px
    }
}

.footer__payments {
    border-bottom: 1px solid #131b28;
    margin: 33px 0 40px;
    padding: 0 0 40px
}

@media (min-width:768px) {
    .footer__bottom {
        column-gap: 50px;
        display: grid;
        gap: 40px;
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (min-width:1250px) {
    .footer__bottom {
        display: flex;
        justify-content: space-between
    }
}

.footer__title {
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
    margin-bottom: 21px;
    text-transform: uppercase
}

.footer__link,
.footer__text {
    color: rgba(174, 191, 217, .8);
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 10px
}

@media not screen and (min-width:768px) {

    .footer__info,
    .footer__links {
        margin-bottom: 30px
    }
}

@media (min-width:1250px) {
    .footer__info {
        max-width: 250px
    }
}

.footer__link {
    display: block;
    transition: .2s ease
}

.footer__link:hover {
    color: #f3b705
}

.footer__contacts {
    margin-bottom: 40px
}

.pay-systems {
    align-items: center;
    display: flex;
    justify-content: center;
    width: 100%
}

@media not screen and (min-width:768px) {
    .pay-systems {
        flex-wrap: wrap;
        gap: 40px;
        padding: 0 15px
    }
}

@media (min-width:768px) {
    .pay-systems {
        justify-content: space-between
    }
}

.pay-systems__system {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100%
}

.pay-systems__system_visa {
    background-image: url("/assets/visa-33c5143d29.svg");
    height: 22px;
    width: 67px
}

.pay-systems__system_mastercard {
    background-image: url("/assets/mastercard-33c5143d29.svg");
    height: 26px;
    width: 142px
}

.pay-systems__system_skinpay {
    background-image: url("/assets/skinpay-33c5143d29.svg");
    height: 24px;
    width: 136px
}

.pay-systems__system_mir {
    background-image: url("/assets/mir-3358d74e0b.svg");
    height: 28px;
    width: 103px
}

.pay-systems__system_crypto {
    background-image: url("/assets/crypto-33c5143d29.svg");
    height: 28px;
    width: 72px
}

.site-counters {
    background: #000;
    border-radius: 15px;
    column-gap: 5px;
    display: grid;
    gap: 5px;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(3, 1fr);
    padding: 5px
}

@media (min-width:768px) {
    .site-counters {
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(2, 1fr)
    }
}

@media (min-width:1250px) {
    .site-counters {
        gap: 5px;
        grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
        grid-template-rows: 1fr
    }
}

.site-counter {
    align-items: center;
    background: #0c121b;
    border-radius: 10px;
    display: flex;
    font-size: 13px;
    height: 51px;
    line-height: 20px;
    padding: 0 10px;
    position: relative;
    width: 100%
}

@media (min-width:768px) {
    .site-counter {
        height: 78px;
        line-height: 20px;
        padding: 0 23px
    }
}

.site-counter:after {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: 36px;
    position: absolute;
    right: 8px;
    top: 8px;
    width: 36px
}

@media (min-width:768px) {
    .site-counter:after {
        height: 62px;
        width: 62px
    }
}

.site-counter__head {
    color: rgba(174, 191, 217, .8)
}

.site-counter__count {
    align-items: center;
    display: flex;
    font-weight: 700;
    gap: 4px
}

.site-counter__count span {
    color: #5ab19a
}

.site-counter__count span+span {
    color: #ff4e18
}

.site-counter_cases:after {
    background-image: url("/assets/cases.png")
}

.site-counter_contracts:after {
    background-image: url("/assets/contracts.png")
}

.site-counter_upgrade:after {
    background-image: url("/assets/upgrade.png")
}

.site-counter_battles:after {
    background-image: url("/assets/battles.png")
}

.site-counter_users:after {
    background-image: url("/assets/users.png")
}

.site-counter_online:after {
    background-image: url("/assets/online.png")
}

.layout-home__counters {
    margin-bottom: 30px
}

@media not screen and (min-width:1250px) {
    .layout-home__counters {
        display: none
    }
}

.main-title {
    font-size: 20px;
    font-weight: 800;
    line-height: 28px;
    margin: 30px 0 10px;
    text-align: center;
    text-transform: uppercase
}

@media (min-width:768px) {
    .main-title {
        font-size: 32px;
        line-height: 40px;
        margin: 50px 0 30px
    }
}

@media (min-width:1250px) {
    .main-title {
        margin: 50px 0 20px
    }
}

.main-title__inner {
    background-clip: text;
    background-image: linear-gradient(#fff, #0c121b 150%);
    background-position: 50%;
    color: transparent
}

.cases {
    display: flex;
    flex-wrap: wrap;
    justify-content: center
}

.cases__case {
    flex: none;
    padding: 15px 5px;
    width: 50%
}

@media (min-width:768px) {
    .cases__case {
        padding: 10px;
        width: 25%
    }
}

@media (min-width:1250px) {
    .cases__case {
        padding: 15px;
        width: 20%
    }
}

.case {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-between;
    text-align: center
}

.case__name {
    color: rgba(174, 191, 217, .8);
    font-size: 13px;
    line-height: 20px;
    margin: 7px 0;
    transition: .2s ease
}

@media (min-width:1024px) {
    .case__name {
        font-size: 16px;
        line-height: 24px;
        margin: 13px 0
    }
}

.case__price {
    align-items: center;
    background-color: #18212e;
    border: 3px solid #000;
    border-radius: 10px;
    color: #ffd600;
    display: inline-flex;
    font-size: 12px;
    font-weight: 700;
    gap: 5px;
    height: 39px;
    justify-content: center;
    line-height: 24px;
    margin-top: auto;
    padding: 0 12px;
    text-transform: uppercase;
    transition: .2s ease
}

@media (min-width:1024px) {
    .case__price {
        border-radius: 15px;
        border-width: 5px;
        font-size: 16px;
        height: 60px;
        padding: 0 20px
    }
}

.case__old-price {
    color: #6a696b;
    font-size: 12px;
    font-weight: 400;
    text-decoration: line-through
}

@media (min-width:1024px) {
    .case__old-price {
        font-size: 16px
    }
}

.case__img {
    align-items: center;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    justify-content: center;
    transition: .2s ease
}

.case__img img {
    flex: none
}

.case__info {
    position: relative
}

.case:hover .case__img {
    transform: scale(1.1)
}

.case:hover .case__name {
    color: #fff
}

.case:hover .case__price {
    background-color: #1e2a3b
}

.topbar {
    position: relative
}

@media (min-width:768px) {
    .topbar {
        margin: 0 auto 30px
    }
}

.topbar__filters {
    background: #0c121b;
    border-radius: 8px;
    height: 66px;
    margin-top: 20px;
    position: relative;
    z-index: 2
}

@media not screen and (min-width:1024px) {
    .topbar__filters {
        overflow: hidden
    }
}

@media (min-width:1024px) {
    .topbar__filters {
        padding: 0 10px
    }
}

.topbar__filters-inner {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: space-between;
    transition: transform .3s ease-in-out
}

@media not screen and (min-width:1024px) {
    .topbar__filters-inner {
        transform: translate(-100%)
    }

    .topbar__filters-inner.active {
        transform: translate(0)
    }
}

.topbar__complex {
    align-items: center;
    display: flex;
    gap: 5px
}

@media not screen and (min-width:1024px) {
    .topbar__complex {
        flex: none;
        padding: 0 10px;
        width: 100%
    }
}

@media (min-width:1024px) {
    .topbar__complex {
        flex-grow: 1;
        justify-content: space-between;
        margin-left: auto
    }
}

.topbar__search {
    display: flex;
    gap: 10px;
    width: 100%
}

@media not screen and (min-width:1024px) {
    .topbar__search {
        flex: none;
        padding: 0 10px
    }
}

@media (min-width:1024px) {
    .topbar__search {
        padding: 0;
        width: auto
    }

    .topbar__search-close,
    .topbar__search-control {
        display: none
    }
}

.topbar__search-close-icon:before {
    height: 11px;
    width: 11px
}

.topbar__price {
    flex-grow: 1;
    margin: 0 10px
}

@media not screen and (min-width:768px) {
    .topbar__price {
        display: none
    }
}

.topbar__btns {
    display: flex;
    gap: 10px
}

@media not screen and (min-width:1024px) {
    .topbar__btns {
        display: none
    }
}

.topbar__btn-clear-icon:before {
    background-color: #fd3f37 !important
}

.cases-search {
    background: #080c12;
    border: 1px solid #121a25;
    border-radius: 8px;
    display: flex;
    height: 46px;
    position: relative;
    width: 100%
}

.cases-search:after {
    background-color: rgba(115, 140, 178, .6);
    content: "";
    display: block;
    height: 18px;
    left: 14px;
    -webkit-mask-image: url("/assets/search-269fc20343.svg");
    mask-image: url("/assets/search-269fc20343.svg");
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    opacity: .6;
    position: absolute;
    top: 14px;
    width: 18px
}

.cases-search__field {
    width: 100%
}

.cases-search__field input {
    background: transparent;
    border-radius: 8px;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    height: 100%;
    line-height: 21px;
    overflow: hidden;
    padding: 0 40px;
    width: 100%
}

.cases-search__field input::placeholder {
    color: rgba(115, 140, 178, .6)
}

.cases-search__field input:focus,
.cases-search__field input:hover {
    background-color: #0c121b
}

.filters,
.price-filters {
    border-radius: 10px;
    display: inline-flex;
    overflow: hidden
}

.filters__filter,
.price-filters__filter {
    align-items: center;
    background: rgba(115, 140, 178, .1);
    cursor: pointer;
    display: flex;
    flex: 1 1 0;
    font-size: 13px;
    font-weight: 600;
    height: 46px;
    justify-content: center;
    line-height: 20px;
    margin-left: 1px;
    min-width: 88px;
    position: relative;
    transition: .2s ease;
    white-space: nowrap;
    z-index: 1
}

.filters__filter span,
.price-filters__filter span {
    color: hsla(0, 0%, 100%, .4);
    transition: .2s ease
}

.filters__filter:before,
.price-filters__filter:before {
    background: rgba(115, 140, 178, .1);
    content: "";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: .2s ease;
    visibility: hidden;
    width: 100%;
    z-index: -1
}

.filters__filter:first-child,
.price-filters__filter:first-child {
    border-radius: 3px 0 0 3px;
    margin-left: 0
}

.filters__filter:last-child,
.price-filters__filter:last-child {
    border-radius: 0 3px 3px 0
}

.filters__filter:not(.active):hover:before,
.price-filters__filter:not(.active):hover:before {
    opacity: .5;
    visibility: visible
}

.filters__filter.active span,
.price-filters__filter.active span {
    color: #fff
}

.filters__filter.active:before,
.price-filters__filter.active:before {
    opacity: 1;
    visibility: visible
}

.filters_in-topbar,
.price-filters_in-topbar {
    display: flex;
    gap: 5px
}

.filters_in-topbar .filters__filter,
.filters_in-topbar .price-filters__filter,
.price-filters_in-topbar .filters__filter,
.price-filters_in-topbar .price-filters__filter {
    background-color: transparent;
    height: 46px;
    padding: 7px 10px
}

.filters_in-topbar .filters__filter span,
.filters_in-topbar .price-filters__filter span,
.price-filters_in-topbar .filters__filter span,
.price-filters_in-topbar .price-filters__filter span {
    color: #ac9dbc
}

.filters_in-topbar .filters__filter:before,
.filters_in-topbar .price-filters__filter:before,
.price-filters_in-topbar .filters__filter:before,
.price-filters_in-topbar .price-filters__filter:before {
    background: hsla(0, 0%, 100%, .07);
    border-radius: 6px
}

.filters_in-topbar .filters__filter:hover span,
.filters_in-topbar .price-filters__filter:hover span,
.price-filters_in-topbar .filters__filter:hover span,
.price-filters_in-topbar .price-filters__filter:hover span {
    color: #fff
}

.filters_in-topbar .filters__filter:hover:before,
.filters_in-topbar .price-filters__filter:hover:before,
.price-filters_in-topbar .filters__filter:hover:before,
.price-filters_in-topbar .price-filters__filter:hover:before {
    opacity: .5
}

.filters_in-topbar .filters__filter.active:before,
.filters_in-topbar .price-filters__filter.active:before,
.price-filters_in-topbar .filters__filter.active:before,
.price-filters_in-topbar .price-filters__filter.active:before {
    opacity: 1
}

.filters_in-topbar .filters__filter.active span,
.filters_in-topbar .price-filters__filter.active span,
.price-filters_in-topbar .filters__filter.active span,
.price-filters_in-topbar .price-filters__filter.active span {
    color: #fff
}

.filters_in-topbar .filters__filter_available,
.filters_in-topbar .filters__filter_fav,
.filters_in-topbar .price-filters__filter_available,
.filters_in-topbar .price-filters__filter_fav,
.price-filters_in-topbar .filters__filter_available,
.price-filters_in-topbar .filters__filter_fav,
.price-filters_in-topbar .price-filters__filter_available,
.price-filters_in-topbar .price-filters__filter_fav {
    background: rgba(115, 140, 178, .1);
    border-radius: 6px;
    gap: 5px;
    justify-content: flex-start;
    margin-left: auto;
    width: auto
}

.filters_in-topbar .filters__filter_available:before,
.filters_in-topbar .filters__filter_fav:before,
.filters_in-topbar .price-filters__filter_available:before,
.filters_in-topbar .price-filters__filter_fav:before,
.price-filters_in-topbar .filters__filter_available:before,
.price-filters_in-topbar .filters__filter_fav:before,
.price-filters_in-topbar .price-filters__filter_available:before,
.price-filters_in-topbar .price-filters__filter_fav:before {
    background: #080c12;
    border: 1px solid #121a25;
    border-radius: 22px;
    display: block;
    height: 24px;
    opacity: 1;
    position: relative;
    visibility: visible;
    width: 38px;
    z-index: 1
}

.filters_in-topbar .filters__filter_available:after,
.filters_in-topbar .filters__filter_fav:after,
.filters_in-topbar .price-filters__filter_available:after,
.filters_in-topbar .price-filters__filter_fav:after,
.price-filters_in-topbar .filters__filter_available:after,
.price-filters_in-topbar .filters__filter_fav:after,
.price-filters_in-topbar .price-filters__filter_available:after,
.price-filters_in-topbar .price-filters__filter_fav:after {
    background-color: rgba(115, 140, 178, .6);
    border-radius: 50%;
    content: "";
    display: block;
    height: 16px;
    position: absolute;
    top: 50%;
    transform: translate(4px, -50%);
    transition: transform .2s ease;
    width: 16px;
    z-index: 2
}

.filters_in-topbar .filters__filter_available:hover,
.filters_in-topbar .filters__filter_fav:hover,
.filters_in-topbar .price-filters__filter_available:hover,
.filters_in-topbar .price-filters__filter_fav:hover,
.price-filters_in-topbar .filters__filter_available:hover,
.price-filters_in-topbar .filters__filter_fav:hover,
.price-filters_in-topbar .price-filters__filter_available:hover,
.price-filters_in-topbar .price-filters__filter_fav:hover {
    background: rgba(115, 140, 178, .2)
}

.filters_in-topbar .filters__filter_available:hover:before,
.filters_in-topbar .filters__filter_fav:hover:before,
.filters_in-topbar .price-filters__filter_available:hover:before,
.filters_in-topbar .price-filters__filter_fav:hover:before,
.price-filters_in-topbar .filters__filter_available:hover:before,
.price-filters_in-topbar .filters__filter_fav:hover:before,
.price-filters_in-topbar .price-filters__filter_available:hover:before,
.price-filters_in-topbar .price-filters__filter_fav:hover:before {
    opacity: 1
}

.filters_in-topbar .filters__filter_available.active:after,
.filters_in-topbar .filters__filter_fav.active:after,
.filters_in-topbar .price-filters__filter_available.active:after,
.filters_in-topbar .price-filters__filter_fav.active:after,
.price-filters_in-topbar .filters__filter_available.active:after,
.price-filters_in-topbar .filters__filter_fav.active:after,
.price-filters_in-topbar .price-filters__filter_available.active:after,
.price-filters_in-topbar .price-filters__filter_fav.active:after {
    background-color: #f3b705;
    transform: translate(17px, -50%)
}

.filters_in-topbar .filters__filter_available span,
.filters_in-topbar .filters__filter_fav span,
.filters_in-topbar .price-filters__filter_available span,
.filters_in-topbar .price-filters__filter_fav span,
.price-filters_in-topbar .filters__filter_available span,
.price-filters_in-topbar .filters__filter_fav span,
.price-filters_in-topbar .price-filters__filter_available span,
.price-filters_in-topbar .price-filters__filter_fav span {
    color: hsla(0, 0%, 100%, .8)
}

.global-intro {
    background-color: #000;
    border-radius: 10px;
    padding: 5px
}

.global-intro__grid {
    display: flex;
    flex-direction: column;
    gap: 5px
}

@media (min-width:1250px) {
    .global-intro__grid {
        flex-direction: row
    }
}

.global-intro__main {
    aspect-ratio: 345/152
}

@media (min-width:768px) {
    .global-intro__main {
        aspect-ratio: 698/300
    }
}

@media (min-width:1250px) {
    .global-intro__main {
        aspect-ratio: 1117/453;
        flex-grow: 1;
        min-width: 0
    }
}

.global-intro__secondary {
    display: flex;
    flex-direction: column;
    gap: 5px
}

@media (min-width:768px) {
    .global-intro__secondary {
        flex-direction: row;
        flex-wrap: wrap
    }
}

@media (min-width:1250px) {
    .global-intro__secondary {
        flex: none;
        flex-direction: column;
        flex-wrap: nowrap;
        width: 420px
    }
}

.global-intro__secondary-item {
    height: 62px;
    min-width: 0
}

@media (min-width:768px) {
    .global-intro__secondary-item {
        flex: 1 1 0;
        height: 150px;
        min-width: 49%
    }
}

@media (min-width:1250px) {
    .global-intro__secondary-item {
        min-width: 0
    }
}

.global-intro_only-secondary .global-intro__main {
    display: none
}

@media (min-width:1250px) {
    .global-intro_only-secondary .global-intro__secondary {
        flex-direction: row;
        width: 100%
    }

    .global-intro_only-secondary .global-intro__secondary-item {
        min-width: 0
    }
}

.global-carousel {
    height: 100%;
    position: relative;
    width: 100%
}

.global-carousel__wrapper {
    border-radius: 10px;
    height: 100%;
    overflow: hidden;
    width: 100%
}

.global-carousel__items {
    backface-visibility: hidden;
    display: flex;
    height: 100%;
    transform: translateZ(0);
    width: 100%;
    will-change: transform
}

.global-carousel__item {
    flex: none;
    height: 100%;
    width: 100%
}

.carousel-item {
    background-color: #1c1743;
    border-radius: 10px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    position: relative;
    z-index: 1
}

.carousel-item,
.carousel-item:after {
    background-position: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    width: 100%
}

.carousel-item:after {
    content: "";
    display: block;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    z-index: -1
}

.carousel-item>div:last-child {
    margin-top: auto
}

.carousel-item__title {
    font-weight: 700;
    text-transform: uppercase
}

.carousel-item__text,
.carousel-item__timer-label {
    color: hsla(0, 0%, 100%, .8);
    flex: none;
    font-size: 14px;
    line-height: 16px
}

.carousel-item_mini {
    background-size: auto 100%;
    justify-content: center;
    padding: 12px 15px
}

@media (min-width:768px) {
    .carousel-item_mini {
        gap: 7px;
        padding: 16px 20px 20px
    }
}

.carousel-item_mini:after {
    background-size: auto 100%
}

.carousel-item_mini .carousel-item__text,
.carousel-item_mini .carousel-item__timer-label,
.carousel-item_mini .carousel-item__title {
    flex: none;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.carousel-item_mini .carousel-item__title {
    color: hsla(0, 0%, 85%, .8);
    font-size: 11px;
    font-weight: 400;
    line-height: 16px;
    text-transform: none
}

@media (min-width:768px) {
    .carousel-item_mini .carousel-item__title {
        font-size: 13px;
        line-height: 20px
    }
}

.carousel-item_mini .carousel-item__text {
    color: #ffd600;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    text-transform: uppercase
}

@media (min-width:768px) {
    .carousel-item_mini .carousel-item__text {
        font-size: 16px;
        font-weight: 600;
        line-height: 24px
    }
}

@media not screen and (min-width:768px) {
    .carousel-item_mini .carousel-item__btn {
        display: none
    }
}

.carousel-item_code {
    background-color: #000
}

.carousel-item_code:after {
    background-image: url("/assets/code.png")
}

@media not screen and (min-width:768px) {
    .carousel-item_code .carousel-item__btn {
        position: absolute;
        right: 15px
    }

    .carousel-item_code .carousel-item__btn-mix {
        font-size: 0;
        padding: 0 5px 0 12px
    }
}

@media (min-width:768px) {
    .carousel-item_code .carousel-item__btn-icon-mix:before {
        display: none
    }
}

.carousel-item_dailybonus {
    background-color: #0e1621
}

.carousel-item_dailybonus:after {
    background-image: url("/assets/dailybonus.png");
    background-size: auto 100%
}

.carousel-item_dailybonus .carousel-item__timer {
    position: absolute;
    right: 15px
}

@media (min-width:768px) {
    .carousel-item_dailybonus .carousel-item__timer {
        bottom: 22px;
        right: 46px
    }

    .carousel-item_dailybonus .carousel-item__text span {
        display: none
    }
}

.carousel-item_dailybonus.carousel-item_available .carousel-item__timer {
    display: none
}

.carousel-item_dailybonus.carousel-item_available .carousel-item__btn {
    pointer-events: auto
}

.carousel-item_dailydraw {
    background: linear-gradient(180deg, #0e1621 -73.49%, #b72606 179.22%)
}

.carousel-item_dailydraw:after {
    background-image: url("/assets/dailydraw.png")
}

@keyframes rotateOut {
    0% {
        transform: rotateY(0deg)
    }

    to {
        transform: rotateY(90deg)
    }
}

@keyframes rotateIn {
    0% {
        transform: rotateY(-90deg)
    }

    to {
        transform: rotateY(0deg)
    }
}

@keyframes showItem {
    to {
        opacity: 1;
        visibility: visible
    }
}

@keyframes preOpen {
    0% {
        filter: brightness(1);
        transform: rotateY(0deg)
    }

    40% {
        filter: brightness(1.12);
        transform: rotateY(13deg)
    }

    to {
        filter: brightness(1);
        transform: rotateY(0deg)
    }
}

@keyframes cardOpenRotate {
    0% {
        transform: rotateY(0deg)
    }

    33% {
        transform: rotateY(180deg)
    }

    66% {
        transform: rotateY(1turn)
    }

    to {
        transform: rotateY(540deg)
    }
}

@keyframes visibleName {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes levitation {
    0% {
        transform: translateY(0) rotate(0deg) scale(1)
    }

    25% {
        transform: translateY(-6px) rotate(.4deg) scale(1.012)
    }

    50% {
        transform: translateY(-12px) rotate(-.4deg) scale(1.02)
    }

    75% {
        transform: translateY(-6px) rotate(.4deg) scale(1.012)
    }

    to {
        transform: translateY(0) rotate(0deg) scale(1)
    }
}

@keyframes levitation_mob {
    0% {
        transform: translate(0)
    }

    25% {
        transform: translateY(7px) rotate(2deg)
    }

    75% {
        transform: translateY(-7px) rotate(-2deg)
    }

    to {
        transform: translate(0)
    }
}

@keyframes roundAnimation1 {
    to {
        opacity: 0
    }
}

@keyframes roundAnimation2 {
    to {
        opacity: 0
    }
}

@keyframes roundPriceAnimation1 {
    0% {
        opacity: 0;
        transform: translateY(-50%)
    }

    10% {
        opacity: 1;
        transform: translate(0)
    }

    50% {
        opacity: 1;
        transform: translate(0)
    }

    90% {
        opacity: 0;
        transform: translateY(50%)
    }

    to {
        opacity: 0
    }
}

@keyframes roundPriceAnimation2 {
    0% {
        opacity: 0;
        transform: translateY(-50%)
    }

    10% {
        opacity: 1;
        transform: translate(0)
    }

    50% {
        opacity: 1;
        transform: translate(0)
    }

    90% {
        opacity: 1;
        transform: translate(0)
    }

    to {
        opacity: 0;
        transform: translateY(50%)
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(1turn)
    }
}

tbody td.table-users__profit {
    color: #f3b705;
    padding-right: 20px
}

@media (min-width:768px) {
    tbody td.table-users__profit {
        padding-right: 50px
    }
}

tbody td.table-users__place,
thead th.table-users__place {
    padding: 0 20px
}

@media (min-width:768px) {

    tbody td.table-users__place,
    thead th.table-users__place {
        padding-left: 50px
    }
}

@media not screen and (min-width:768px) {
    thead th.table-users__place {
        font-size: 0
    }
}

@keyframes tilt-shaking {
    0% {
        transform: rotate(0deg)
    }

    25% {
        transform: rotate(5deg)
    }

    50% {
        transform: rotate(0deg)
    }

    75% {
        transform: rotate(-5deg)
    }

    to {
        transform: rotate(0deg)
    }
}

.raffles__title-mix {
    margin-bottom: 7px
}

.raffles__winners {
    display: flex;
    justify-content: center
}

.raffles__winners-link {
    align-items: center;
    color: #ffd600;
    display: flex;
    font-size: 16px;
    gap: 6px;
    line-height: 24px;
    transition: .2s ease
}

.raffles__winners-link:before {
    background-color: #ffd600;
    height: 16px;
    transition: .2s ease;
    width: 16px
}

.raffles__winners-link:hover {
    color: #fff
}

.raffles__winners-link:hover:before {
    background-color: #fff
}

@media not screen and (min-width:1510px) {
    .refill-prize-widget {
        position: relative
    }
}

@media (min-width:1510px) {
    .refill-prize-widget {
        display: flex;
        gap: 10px
    }
}

.refill-prize-widget__items {
    display: flex;
    gap: 10px;
    margin-top: 10px;
    max-width: 100%;
    padding: 0 0 10px
}

@media (min-width:768px) {
    .refill-prize-widget__items {
        margin-top: 30px;
        padding: 0
    }
}

@media not screen and (min-width:1510px) {
    .refill-prize-widget__items {
        overflow-x: visible;
        overflow-y: auto
    }
}

@media (min-width:1510px) {
    .refill-prize-widget__items {
        flex-grow: 1;
        padding: 0
    }
}

.refill-prize-widget__items::-webkit-scrollbar-track {
    background-color: transparent
}

.refill-prize-widget__items::-webkit-scrollbar {
    height: 3px;
    width: 3px
}

.refill-prize-widget__items::-webkit-scrollbar-thumb {
    background-color: rgba(174, 191, 217, .8)
}

.refill-prize-widget__item {
    height: 108px
}

@media not screen and (min-width:1510px) {
    .refill-prize-widget__item {
        flex: none;
        width: 302px
    }
}

@media (min-width:1510px) {
    .refill-prize-widget__item {
        flex: 1 1 0;
        max-width: 355px;
        width: 0
    }
}

.refill-prize-widget__item:first-child {
    margin-left: auto
}

.refill-prize-widget__item:last-child {
    margin-right: auto
}

.refill-prize-item {
    backdrop-filter: blur(20px);
    border-radius: 8px;
    height: 100%;
    overflow: hidden;
    position: relative;
    text-align: left;
    width: 100%;
    z-index: 1
}

.refill-prize-item:before {
    background-size: contain;
    border-radius: 8px;
    content: "";
    display: block;
    height: 100%;
    left: 0;
    opacity: .5;
    position: absolute;
    top: 0;
    transition: opacity .2s ease;
    width: 100%;
    z-index: -1
}

.refill-prize-item__content {
    align-items: stretch;
    display: flex;
    height: 100%;
    padding: 13px 10px
}

.refill-prize-item__content:after {
    background-position: top;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 101px
}

.refill-prize-item__img {
    align-items: center;
    display: flex;
    flex: none;
    justify-content: center;
    position: relative;
    width: 36%;
    z-index: 2
}

.refill-prize-item__img:before {
    background: url("/assets/raffle-item.svg") 50% no-repeat;
    content: "";
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1
}

.refill-prize-item__img img {
    transition: transform .2s ease
}

.refill-prize-item__info {
    flex-grow: 1;
    max-width: 100%;
    min-width: 0;
    padding-left: 14px
}

.refill-prize-item__title {
    color: hsla(0, 0%, 85%, .6);
    font-size: 13px;
    line-height: 20px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.refill-prize-item__price {
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    margin-top: 2px;
    width: 100%
}

.refill-prize-item__timer {
    display: inline-flex;
    margin-top: 9px
}

.refill-prize-item__users {
    align-items: center;
    background: hsla(0, 0%, 100%, .2);
    border-radius: 6px;
    display: flex;
    font-size: 12px;
    font-weight: 700;
    gap: 5px;
    left: 5px;
    line-height: 15px;
    padding: 4px 7px;
    position: absolute;
    top: 5px;
    z-index: 2
}

.refill-prize-item__users:before {
    background: url("/assets/user-269fc20343.svg") 50% no-repeat;
    content: "";
    display: block;
    height: 12px;
    position: relative;
    width: 12px
}

.refill-prize-item__status {
    display: none;
    font-size: 0;
    left: 8px;
    position: absolute;
    top: 8px;
    z-index: 1
}

.refill-prize-item__status:after,
.refill-prize-item__status:before {
    content: "";
    display: block;
    position: relative
}

.refill-prize-item_clickable {
    cursor: pointer;
    transition: .2s ease
}

.refill-prize-item_clickable:after {
    background: none 50% no-repeat;
    content: "";
    display: block;
    height: 9px;
    opacity: 0;
    position: absolute;
    right: 6px;
    top: 6px;
    transition: .2s ease;
    width: 9px
}

.refill-prize-item_clickable:hover:before {
    opacity: .6
}

.refill-prize-item_clickable:hover:after {
    opacity: 1
}

.refill-prize-item_clickable:hover img {
    transform: scale(1.1)
}

.refill-prize-item.common:before {
    background: linear-gradient(180deg, #a9a9a9, #353345 175.36%)
}

.refill-prize-item.common .refill-prize-item__content:after {
    background-image: url("/assets/vendor/easydrop.bar/0074956951496aa09d27da37.png");
    z-index: 1
}

.refill-prize-item.common .refill-prize-item__price {
    color: #cfcfcf
}

.refill-prize-item.uncommon:before {
    background: linear-gradient(180deg, #1bceff, #001f49 175.36%)
}

.refill-prize-item.uncommon .refill-prize-item__content:after {
    background-image: url("/assets/vendor/easydrop.bar/a70f209f361ebff3e541c153.png");
    z-index: 1
}

.refill-prize-item.uncommon .refill-prize-item__price {
    color: #68deff
}

.refill-prize-item.milspec:before {
    background: linear-gradient(180deg, #1068ff, #002b6a 175.36%)
}

.refill-prize-item.milspec .refill-prize-item__content:after {
    background-image: url("/assets/vendor/easydrop.bar/56996930acfb7271f02c10fd.png");
    z-index: 1
}

.refill-prize-item.milspec .refill-prize-item__price {
    color: #5d98ff
}

.refill-prize-item.restricted:before {
    background: linear-gradient(180deg, #8c53ff, #32235a 175.36%)
}

.refill-prize-item.restricted .refill-prize-item__content:after {
    background-image: url("/assets/restricted.png");
    z-index: 1
}

.refill-prize-item.restricted .refill-prize-item__price {
    color: #bfa0ff
}

.refill-prize-item.classified:before {
    background: linear-gradient(180deg, #f739ff, #4a1e5a 175.36%)
}

.refill-prize-item.classified .refill-prize-item__content:after {
    background-image: url("/assets/classified.png");
    z-index: 1
}

.refill-prize-item.classified .refill-prize-item__price {
    color: #fa86ff
}

.refill-prize-item.covert:before {
    background: linear-gradient(180deg, #ff3d00, #770129 175.36%)
}

.refill-prize-item.covert .refill-prize-item__content:after {
    background-image: url("/assets/covert.png");
    z-index: 1
}

.refill-prize-item.covert .refill-prize-item__price {
    color: #ff774d
}

.refill-prize-item.rare:before {
    background: linear-gradient(180deg, #ffd41a, #5a4a1f 175.36%)
}

.refill-prize-item.rare .refill-prize-item__content:after {
    background-image: url("/assets/rare.png");
    z-index: 1
}

.refill-prize-item.rare .refill-prize-item__price {
    color: #ffe267
}

@keyframes opacityPulse100 {
    0% {
        opacity: 0
    }

    50% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.prizes-popup {
    align-items: center;
    display: flex;
    flex-direction: column;
    text-align: center
}

.prizes-popup__title {
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
    margin-bottom: 5px;
    text-transform: uppercase
}

@media (min-width:768px) {
    .prizes-popup__title {
        font-size: 20px;
        line-height: 140%
    }
}

.prizes-popup__sub-title {
    color: rgba(174, 191, 217, .8);
    font-size: 16px;
    line-height: 24px
}

.prizes-popup__skin {
    height: 101px;
    margin-top: 20px;
    width: 310px
}

@media not screen and (min-width:375px) {
    .prizes-popup__skin {
        transform: scale(.8)
    }
}

@media (min-width:768px) {
    .prizes-popup__skin {
        width: 360px
    }
}

.prizes-popup__progress {
    margin-top: 30px;
    padding: 0 22px;
    width: 100%
}

@media (min-width:768px) {
    .prizes-popup__progress {
        padding: 0 28px
    }
}

.prizes-popup__progress,
.prizes-popup__submit {
    color: rgba(174, 191, 217, .8);
    font-size: 14px;
    line-height: 20px
}

.prizes-popup__progress-bar {
    margin-top: 18px
}

.prizes-popup__progress-values {
    align-items: center;
    color: rgba(174, 191, 217, .8);
    display: flex;
    width: 100%
}

.prizes-popup__progress-text-section_goal {
    color: #fff
}

.prizes-popup__login,
.prizes-popup__progress-btn,
.prizes-popup__submit-btn {
    margin-top: 20px
}

.progress-bar {
    background: #030709;
    border: 1px solid #192435;
    border-radius: 33px;
    height: 26px;
    padding: 1px;
    width: 100%
}

.progress-bar__progress {
    background: #d8a70a;
    border-radius: 35px;
    height: 100%;
    position: relative
}

.progress-bar__value {
    background: #7ed321;
    border-radius: 4px;
    bottom: 50%;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    left: 100%;
    line-height: 18px;
    padding: 5px 6px;
    position: absolute;
    transform: translate(-50%);
    white-space: nowrap
}

.progress-bar__value:after {
    border-color: #7ed321 transparent transparent;
    border-style: solid;
    border-width: 5px 4.5px 0;
    content: "";
    display: block;
    height: 0;
    left: 50%;
    position: absolute;
    top: 100%;
    transform: translate(-50%);
    width: 0
}

input.refill-input__field {
    backface-visibility: hidden;
    border-radius: 12px;
    box-shadow: none;
    color: #fff;
    font-size: 16px;
    height: 66px;
    line-height: 24px;
    padding: 21px 20px 21px 52px;
    position: relative;
    transition: .08s ease;
    width: 100%
}

input.refill-input__field::-webkit-inner-spin-button,
input.refill-input__field::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input.refill-input__field[type=number] {
    -moz-appearance: textfield
}

input.refill-input__field:before {
    content: "";
    position: absolute
}

@media (hover:none) and (pointer:coarse) {
    input.refill-input__field:active {
        -webkit-tap-highlight-color: transparent
    }
}

input.refill-input__field.input-error {
    border-color: red
}

@keyframes flashBattlePassProgress {
    0% {
        opacity: 1;
        right: 100%
    }

    20% {
        opacity: 1
    }

    40% {
        opacity: 1;
        right: -510px
    }

    to {
        opacity: 0;
        right: -510px
    }
}

@keyframes toastGlide {
    0% {
        transform: translateY(10px)
    }

    to {
        transform: translateY(0)
    }
}

.header-logo:before {
    background-image: url("/assets/logo.png")
}

@media (min-width:1250px) {

    .layout-home:after,
    .layout-home:before {
        background-position: 50%;
        background-repeat: no-repeat;
        background-size: contain;
        content: "";
        display: block;
        height: 883px;
        position: absolute;
        top: -125px;
        width: 617px;
        z-index: -1
    }
}

.layout-home:before {
    background-image: url("/assets/left-decoration.webp");
    left: 0
}

.layout-home:after {
    background-image: url("/assets/right-decoration.webp");
    right: 0
}