@import "fonts/TTNormsPro.css";

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    color: var(--white);
}

:root {
    --white: rgb(249, 249, 249);
    --main-color: #ce203d;
    --green: #20ce45;
    --gray: rgb(145, 145, 145);
    --text-darkgray: rgba(255, 255, 255, .3);
    --text-lightgray: rgb(206, 206, 206);
    --opacback: rgba(3, 3, 3, .3);
    --darkgray: rgb(11, 11, 11);
    --darkygray: rgb(13, 13, 13);
    --main-theme: rgb(15, 15, 15);
    --buttonbg: linear-gradient(180deg, var(--main-color) 0%, #b11d35 100%);
    --defbuttonbg: linear-gradient(180deg, rgb(23 23 23) 0%, rgb(21 21 21) 100%);
    --defbuttonbg_hover: linear-gradient(180deg, rgb(27 27 27) 0%, rgb(24 24 24) 100%);
    --icongradient: linear-gradient(-45deg, var(--darkgray), var(--main-theme));
    --icongradient2: linear-gradient(-45deg, var(--darkgray), var(--darkygray));
    --centralized: 66.528%;

    --main-border: 24px;
    --minor-border: 16px;
}

html.transitions-disabled *,
html.transitions-disabled *::before,
html.transitions-disabled *::after {
    transition: none !important;
}

head,
script {
    display: none;
}

html {
    overflow-x: hidden;
    box-sizing: border-box;
}

body {
    background-color: #0d0d0d;
    font-family: TTNormsPro;
    overflow: hidden;
    margin: 0 auto;
    padding: 0;
}

button {
    font-family: TTNormsPro;
}

img {
    font-size: 0;
}

.ssiodox {
    background: #0f0f0f;
    background: url(/img/body_bg2.png) center top no-repeat #0f0f0f;
    position: relative;
    z-index: 1;
}

::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: rgb(10 10 10);
}

::-webkit-scrollbar-thumb {
    background: rgb(5 5 5);
    border-radius: 5px;
}


::-webkit-scrollbar-thumb:hover {
    background: rgb(2 2 2);
}

i {
    font-style: normal;
}

.h1,
.h2,
.h2,
.h3,
.h4,
.h6,
h1,
h2,
h2,
h3,
h4,
h6,
p,
.introduce-craft span {
    line-height: 1.2;
    margin-bottom: 0;
}

a,
p {
    color: var(--white);
    font-weight: 500;
    font-size: 16px;
}

header {
    position: fixed;
    display: flex;
    justify-content: center;
    backdrop-filter: blur(3px);
    /* background: rgba(11, 11, 11, .98); */
    background: transparent;
    height: 68px;
    z-index: 10001;
    width: 65.6%;
    left: 50%;
    transform: translateX(-50%);
    transition: none;
    border-radius: var(--main-border);
    padding-top: 18px;
    will-change: transform;
    backface-visibility: hidden;
    box-shadow: unset !important;
}

/* @media screen and (min-width: 1365px) {
    .ssiodox:not(.nondef) header.is-hidden .main-nav-content {
        transform: translate(0, -120%);
        opacity: 0;
        pointer-events: none;
    }
} */

  /* header.is-pinned {
    position: fixed;
  } */


.nondef header {
    width: 81.8%;
}

.review header,
.nondef:has(.topic-craft) header {
    width: 69.6%;
}

.nondef:has(.boxdefaultpage) header {
    width: 58%;
}

.nondef:has(.blog) header {
    width: 71.8%;
}

nav {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

button {
    cursor: pointer;
}

.main-nav-content,
.nav-content {
    display: flex;
    align-items: center;
    height: 100%;
}

.main-nav-content {
    transition: all .2s ease-in-out;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    margin-left: 4px;
}

.nav-content {
    width: auto;
    height: 45px;
    justify-content: flex-end;
    gap: 12px;
    border-radius: var(--main-border);
    background: rgba(11, 11, 11, .9);
    padding-left: 16px;
}

nav .logospace {
    height: auto;
    display: flex;
    align-items: center;
}

#logo {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

nav .pages {
    display: flex;
    align-items: center;
    position: relative;
    margin-top: 3px;
    height: 16px;
}

#theme-toggle,
#particles-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    outline: none;
    cursor: pointer;
    margin-bottom: 2px;
    z-index: 10;
    order: 0;
}

#particles-toggle {
    margin-bottom: unset;
}

.spaceblock {
    height: 144px;
}

.nondef .spaceblock {
    height: 84px;
}

.cookie-widget {
    width: 100%;
    height: 40px;
    background-color: rgba(10, 10, 10, .93);
    position: fixed;
    bottom: 0;
    z-index: 11111;
    animation-duration: .5s;
    animation-fill-mode: both;
    animation-name: btnEntrance;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.cookie-widget-info {
    color: rgba(255, 255, 255, .7);
    font-weight: 400;
    font-size: 12px;
    transition: color .1s ease-in-out;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.cookie-widget-info a {
    padding: 16px 5px;
    text-decoration: none;
    transition: all .2s ease-in-out;
}

.cookie-widget-button {
    outline: none;
    font-family: TTNormsPro;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 10px;
    border-radius: 5px;
    bottom: 17px;
    padding: 4px 8px;
    transition: all .2s ease-in-out;
    background-color: rgb(26 26 26);
    border: 2px #222222 solid;
    cursor: pointer;
    margin-left: 10px;
}

.cookie-widget-button:hover {
    border: var(--main-color) 2px solid;
    background-color: #a81d34;
}

.rec-box {
    background: var(--darkgray);
    position: relative;
    width: 300px;
    /* height: 220px; */
    height: auto;
    border-radius: var(--main-border);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
    transition: all .15s ease-in-out, opacity .25s;
    margin: 0;
    display: flex;
    flex-direction: column;
    opacity: 0;
    z-index: 1;
}

.rec-box::before {
    content: '';
    position: absolute;
    z-index: -1;
    left: 4px;
    right: 4px;
    top: 4px;
    bottom: 4px;
    background: linear-gradient(-45deg, var(--darkgray) 50%, var(--main-theme) 100%);
    opacity: .8;
    border-radius: var(--main-border);
}

.topic-boxes-holder .rec-box {
    height: 250px;
    order: -1;
    margin: 18px 9px 0 9px;
    top: 0;
    left: 0;
}

.rec-box.active {
    animation: fadeIn .2s ease-in-out forwards;
}

.rec-box .logobg {
    width: 100%;
    height: 40px;
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 13px;
}

.rec-box .logobg img {
    width: 60%;
    height: auto;
    max-height: 60%;
    max-width: 60%;
    border-radius: var(--main-border);
    transition: all .15s ease-in-out;
    position: relative;
    z-index: 1;
}

.rec-box .logobg a {
    width: 45px;
    height: 45px;
    min-width: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: var(--icongradient);
    border-radius: var(--main-border);
    margin-left: 11px;
    z-index: 1;
}

.rec-box .logobg a::before {
    content: '';
    position: absolute;
    background: var(--darkgray);
    border-radius: var(--main-border);
    left: 3px;
    right: 3px;
    top: 3px;
    bottom: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: -1;
}

.rec-box .content-buttons {
    margin-top: 2px;
    height: 0;
    overflow: hidden;
    transition: all .2s ease-in-out;
    transform: scale(.9);
    opacity: 0;
}

.rec-box:hover .content-buttons {
    height: 38px;
    transform: unset;
    opacity: 1;
}

.rec-box p {
    /* margin: 0 auto !important; */
    color: rgba(255, 255, 255, .6);
    font-weight: 400;
    font-size: 14px;
    text-transform: none;
    margin: 0 16px 0 10px;
    width: 75%;
}

.rec-box .logobg a img:hover {
    transform: scale(1.05);
}

.rec-box .content {
    width: 100%;
    margin: 0 auto;
    padding-bottom: 6px;
    margin-bottom: 8px;
    border-radius: var(--main-border);
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    user-select: none;
}

.rec-box .content .boxtitle {
    font-weight: 600;
    font-size: 18px;
    padding: 0 4px;
    margin: 5px 0;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
}

.boxreview,
.topicpage {
    position: relative;
    height: auto;
    width: 1022px;
    border-radius: var(--main-border);
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-content: flex-start;
    background: linear-gradient(180deg, var(--darkgray) 30%, rgba(0, 0, 0, 0) 100%);
    min-height: 600px;
    padding-top: 10px;
    z-index: 1;
}

.boxreview {
    margin-left: 8px;
    padding-top: unset;
    background: unset;
    margin-top: 56px;
}

.boxreview:has(.shortinfo.empty) {
    margin-top: 0;
}

.boxdefaultpage {
    position: relative;
    height: auto;
    width: 1150px;
    border-radius: var(--main-border);
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-content: flex-start;
    min-height: 750px;
    margin: 0 auto;
}

.main-col-info {
    height: auto;
    width: 95%;
    background: linear-gradient(15deg, var(--darkgray) 30%, rgba(0, 0, 0, .15) 100%);
    /* background: var(--darkgray); */
    border-radius: var(--main-border);
    margin-top: 10px;
    padding: 30px;
}

.main-col-info:first-child {
    margin-top: unset;
}

.main-col-info .theme-col-info h3 {
    color: var(--main-color);
    font-size: 22px;
    font-weight: 600;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.theme-col-info {
    margin-left: 20px;
}

.text-col-info-box {
    width: 100%;
    margin: 0 auto;
}

.text-col-info {
    width: 100%;
    display: list-item;
    list-style: none;
    font-size: 16px;
    font-weight: 500;
    padding: 12px 3px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.text-col-info .newest-boxes {
    width: 100%;
}

.text-col-info::marker {
    color: var(--main-color);
    font-weight: 500;
    font-size: 15px;
}

.main-col-info-upd p {
    padding: 5px 5px 0 18px;
    color: rgba(255, 255, 255, .7);
    font-weight: 400;
    font-size: 15px;
    transition: color .1s ease-in-out;
}

.text-col-info ul {
    padding: 5px 5px 0 18px;
    color: rgba(255, 255, 255, .7);
    font-weight: 400;
    font-size: 15px;
    transition: color .1s ease-in-out;
    list-style-type: none;
    width: 93%;
}

.text-col-info ul li p {
    margin-top: 7px;
    color: rgba(255, 255, 255, .7);
    font-weight: 400;
    font-size: 15px;
    line-height: 1.4;
}



.text-col-info ul li p:first-child {
    margin-top: unset;
}

.email-placeholder,
.skininspect-placeholder {
    width: 360px;
    height: 60px;
    margin: 0 auto;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    position: relative;
}

.skininspect-placeholder {
    height: 50px;
}

.skininspect-placeholder {
    width: 100%;
    margin-bottom: 9px;
}

.email-placeholder .email-text,
.skininspect-placeholder .skin-text {
    width: 300px;
    border-radius: 5px 0 0 5px;
    background-color: rgb(9 9 9);
}

.skininspect-placeholder .skin-text {
    width: 100%;
    background-color: var(--darkgray);
    border-radius: 5px;
}

.email-placeholder .email-text span,
.skininspect-placeholder .skin-text span {
    height: 100%;
    width: 100%;
    color: rgb(55, 55, 55);
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 500;
    transition: color .15s ease-in-out;
    font-size: 22px;
}

.skininspect-placeholder .skin-text span {
    font-size: 15px;
    white-space: nowrap;
    justify-content: flex-start;
    color: rgb(40 40 40);
    padding-left: 20px;
    overflow: hidden;
    max-width: 99%;
}

.email-placeholder .email-copy,
.skininspect-placeholder .skin-copy {
    width: 60px;
    height: 100%;
}

.skininspect-placeholder .skin-copy {
    position: absolute;
    width: 50px;
    right: 0;
}

.email-copy button,
.skin-copy button {
    width: 100%;
    height: 100%;
    background-size: cover;
    border: none;
    background-color: var(--darkgray);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0 5px 5px 0;
    position: relative;
}

.email-copy button {
    background-color: rgb(8 8 8);
}

.email-copy button:hover::after,
.skin-copy button:hover::after {
    opacity: 1;
}

.topicpage {
    width: 65.715%;
    padding-top: 0;
    background: unset;
    justify-content: flex-start;
    margin-left: 8px;
}

.topic-grandbox {
    background: var(--darkgray);
    position: relative;
    width: 300px;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
    transition: all .15s ease-in-out;
    border-radius: var(--main-border);
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 2;
}

.sitepage .topic-grandbox {
    min-height: 250px;
    margin: 0;
}

/* .topic-grandbox .topic-box {
    height: auto ;
} */

.topic-grandbox::after {
    content: unset;
    position: absolute;
    bottom: 0;
    z-index: -1;
    width: calc(100% - 16px);
    margin: 0 auto;
    margin-bottom: 9px;
    border-radius: var(--main-border);
    background: linear-gradient(180deg, var(--darkgray) 0%, rgb(12 12 12) 100%);
    box-shadow: 0 1px 2px 0 rgba(11, 11, 11, .4);
    height: 70%;
}

.topic-grandbox.sticker::after {
    content: unset;
}

.navigation-reset {
    position: absolute;
    display: flex;
    height: 50px;
    top: 230px;
    left: 50%;
    transform: translateX(-50%);
    cursor: pointer;
    padding: 0 15px;
    background: var(--main-theme);
    filter: drop-shadow(0 0 1px rgb(35 35 35));
    transition: all .15s ease-in-out;
    border-radius: var(--main-border);
    font-family: TTNormsPro;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 16px;
    align-items: center;
    justify-content: center;
}

.navigation-reset:hover {
    filter: brightness(+130%) drop-shadow(0 0 1px rgb(35 35 35));
    transform: scale(1.05) translateX(-50%);
}

.section {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    align-content: center;
    position: relative;
    top: -20px;
    max-width: 90%;
}

.section.second:not(.character) {
    width: 100%;
    margin-top: 13px;
    flex-direction: column;
    flex-wrap: nowrap;
}

.sitepage.topic-craft .section.second,
.topic-boxes-holder .topic-grandbox.sticker .section.second {
    margin-top: unset;
    margin-bottom: 10px;
}

.section.second .colors-box {
    width: 70%;
    display: flex;
    height: 100%;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: center;
    margin-top: 7px;
}

.site-searcher-box {
    height: 60px;
    width: 20%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--darkgray);
    border-radius: var(--minor-border);
    transition: .15s all ease-in-out;
    z-index: 100;
    cursor: pointer;
    margin: 8px;
    margin-right: unset;
    position: relative;
}

.site-searcher-box:last-child {
    margin-right: 8px;
}

.navigation-weapon-sort {
    height: 40px;
    width: 50px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #0f0f0f;
    filter: drop-shadow(0 0 1px rgb(35 35 35));
    border-radius: var(--main-border);
    transition: .15s all ease-in-out;
    cursor: pointer;
    color: var(--white);
    user-select: none;
    z-index: 11;
}

.navigation-weapon-sort i {
    transition: transform .15s ease-in-out;
}

.site-searcher-box:hover .site-searcher-logo {
    transform: scale(1.15);
}

.navigation-weapon-sort.enabled i::before,
.navigation-weapon-sort.reversed i::before {
    opacity: .8;
}

.site-searcher-box.enabled,
.navigation-weapon-sort.enabled,
.navigation-weapon-sort.reversed,
.navigation-weapon-type.enabled {
    opacity: 1;
}

.navigation-weapon-sort.reversed i {
    transform: scale(1, -1);
}

.site-searcher-logo {
    position: relative;
    align-items: center;
    justify-content: center;
    display: flex;
    height: auto;
    height: 50%;
    width: auto;
    transition: .15s .05s all ease-in-out;
}

.site-searcher-logo img {
    height: auto;
    width: 65%;
    max-height: 40px;
}

.site-searcher-box:hover {
    background-color: rgb(14 14 14);
}

.menu-holder {
    height: 100%;
    width: 100%;
    top: 0;
    overflow: hidden;
    padding-top: 3%;
    position: fixed;
    background-color: rgba(11, 11, 11, .9);
    user-select: none;
    pointer-events: none;
    z-index: 10000;
    visibility: visible;
    transition: all .15s ease-in-out;
    cursor: default;
    opacity: 0;
    display: flex;
    justify-content: center;
    backdrop-filter: blur(2px);
    transform: translateY(10px);
}

.menu-holder.active {
    opacity: 1;
    user-select: auto;
    pointer-events: all;
    transform: unset;
    /* height: 100%;
    width: 100%; */
}

.menu-box {
    display: flex;
    align-items: center;
    flex-direction: column;
    position: absolute;
    width: 820px;
    height: auto;
    min-height: 400px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(11, 11, 11, .9);
    border-radius: var(--main-border);
    box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .3);
    top: 120px;
}

.menu-search-section {
    height: auto;
    width: calc(100% - 9px);
    margin-left: 9px;
    margin-top: 10px;
    display: flex;
    align-items: center;
    flex-direction: column;
    flex-wrap: nowrap;
}

.menu-search-list {
    width: 100%;
    margin-top: 4px;
    margin-bottom: 9px;
    max-height: 637px;
    overflow-y: scroll;
    border-radius: var(--main-border);
    gap: 1px;
    display: flex;
    flex-direction: column;
}

.menu-search-list.hidden {
    margin: unset;
}

.menu-search-section .search-field {
    width: 100%;
    height: 64px;
    display: flex;
    align-items: center;
    position: relative;
    background: var(--icongradient);
    border-radius: var(--main-border) 0 0 var(--main-border);
}

.menu-search-section span {
    margin-left: 18px;
    color: var(--gray);
    font-size: 15px;
    font-weight: 500;
    opacity: .45;
}

.menu-main-section {
    width: calc(100% - 9px);
    gap: 9px;
    margin-top: 9px;
    margin-left: 9px;
    height: 637px;
    display: flex;
    flex-direction: row;
}

.menu-main-section.hidden {
    display: none;
}

.menu-nav-item {
    display: flex;
    align-items: center;
    transition: all .1s ease-in-out;
    height: 43px;
    border-radius: var(--main-border);
    cursor: pointer;
    gap: 9px;
    padding: 4px;
    font-size: 15px;
    font-weight: 500;
    user-select: none;
}

.menu-nav-item.active,
.menu-nav-item:hover {
    background: var(--darkygray);
}

.menu-nav-item span {
    margin-left: 0;
    transition: all .1s ease-in-out;
}

.menu-nav-item.active span.officon::before {
    filter: unset;
}

.menu-nav-item.active span.officon::after {
    background: linear-gradient(-45deg, var(--darkgray) 0%, rgba(43, 0, 16, .85) 100%);
}

.menu-nav-item span.officon::before {
    opacity: 1;
    height: 18px;
    width: 18px;
}

.menu-nav-part {
    width: 33%;
    height: 100%;
    border-radius: var(--main-border);
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.menu-main-parts {
    width: 67%;
    height: 100%;
    position: relative;
    border-radius: var(--main-border);
    background: linear-gradient(250deg, var(--darkgray), var(--main-theme), var(--darkgray));
}

.menu-main-part {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    align-items: center;
}

.menu-main-section-name {
    width: calc(100% - 18px);
    margin-top: 9px;
}

.menu-main-section-name span {
    padding: 8px 12px;
    background: var(--darkgray);

    /* margin-left: 4px; */
    border-radius: var(--main-border);
    font-size: 14px;
    font-weight: 500;
    color: rgb(100 100 100);
    height: auto;
    display: flex;
    width: fit-content;
}

.menu-main-section-name:has(span:empty) {
    display: none;
}

.menu-main-solid-list {
    width: calc(100% - 18px);
    margin-top: 9px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 6px;
}

.menu-main-solid-item {
    padding: 8px 12px;
    background: var(--darkgray);
    border-radius: var(--main-border);
    text-decoration: unset;
    font-size: 14px;
    font-weight: 500;
    color: rgb(100 100 100);
    transition: all .1s ease-in-out;
}

.menu-main-reviews {
    width: calc(100% - 18px);
    gap: 9px;
    height: auto;
    margin-top: 9px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
}

.menu-main-reviews-item {
    /* width: 123px;
    height: 62px; */

    width: 96px;
    height: 60px;
    background: var(--darkgray);
    cursor: pointer;
    position: relative;
    overflow: hidden;
    border-radius: var(--minor-border);
    transition: all .15s ease-in-out;
}

.menu-main-reviews-item:hover,
.menu-main-solid-item:hover {
    background: rgb(12, 12, 12);
    color: var(--white);
}

.menu-main-reviews-item .logobg {
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.menu-main-reviews-item .logobg img {
    /* max-width: 70%;
    max-height: 55%; */

    max-width: 70%;
    max-height: 50%;
}

.menu-main-reviews-item .content {
    position: absolute;
    bottom: 0;
    height: 20%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: translateY(30px);
    background: rgba(0, 0, 0, .15);
    user-select: none;
    pointer-events: none;
    overflow: hidden;
    transition: all .25s ease-in-out;
}

/* .menu-main-reviews-item:hover .content {
    height: 30%;
    transform: unset;
} */

.menu-main-reviews-item .content span {
    font-size: 9px;
    font-weight: 600;
    text-transform: uppercase;
}

#preview-window {
    width: 100%;
    height: 100%;
    top: 0;
    padding-top: 3%;
    position: fixed;
    background-color: rgba(11, 11, 11, .9);
    z-index: 10000;
    visibility: visible;
    transition: opacity .15s .0s ease-in-out, visibility .15s 0s;
    cursor: default;
    opacity: 1;
    display: flex;
    justify-content: center;
    backdrop-filter: blur(3px);
    pointer-events: all;
}

#preview-window.hidden {
    overflow: hidden;
    user-select: none;
    pointer-events: none;
    z-index: 99;
    opacity: 0;
}

#preview-window.hidden .site-searcher-buttons {
    opacity: 0;
    transform: scale(0.5);
    transition: all 0s 0s ease-in-out !important;
}

#preview-window .site-searcher-buttons {
    transition: opacity .15s .1s ease-in-out, transform .15s .05s;
    transform: scale(1);
    opacity: 1;
}

#preview-showcase {
    position: relative;
    top: 10%;
    background: rgba(11, 11, 11, .95);
    box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .3);
    border-radius: var(--main-border);
    height: fit-content;
    width: 800px;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
    overflow: hidden;
    transition: all .15s ease-in-out;
    transform: unset;
    opacity: 1;
}

#preview-window.hidden #preview-showcase {
    transform: translateY(20px);
    opacity: 0;
}

#preview-content {
    width: 100%;
    height: 400px;
    display: flex;
    overflow: hidden;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    position: relative;
    border-radius: var(--main-border);
}

#preview-content .skin-desc-name::before,
.box-skins.character .preview-item.skin .skin-desc-name::before {
    content: '';
    opacity: 1;
    width: 26px;
    height: 12px;
    display: block;
    border-radius: 12px;
    position: relative;
    margin-right: 14px;
}
#preview-content .skin-desc-name {
    font-weight: 500;
    position: absolute;
    display: flex;
    flex-direction: row;
    align-items: center;
    cursor: auto;
    z-index: 10;
    left: 25px;
    top: 21px;
}

.preview-extras {
    display: flex;
    position: absolute;
    align-items: center;
    flex-wrap: wrap;
    width: 35%;
    height: auto;
    left: 25px;
    bottom: 90px;
    z-index: 10;
}

.hidden .preview-extras {
    opacity: 0;
}

.skin-extra-info {
    order: -1;
    margin-bottom: 6px;
    margin-left: -4px;
    height: 24px;
    width: 100%;
    position: relative;
    display: flex;
    text-decoration: none;
    align-items: center;
    transition: all .15s ease-in-out;
}

.skin-extra-info a {
    height: 100%;
    width: auto;
    padding-right: 8px;
    position: relative;
    display: flex;
    text-decoration: none;
    align-items: center;
    transition: all .15s ease-in-out;
    opacity: .9;
}

.skin-extra-info a:hover {
    opacity: 1;
}

.skin-color-info,
.skin-extra-info {
    transition: opacity 0.3s ease, transform 0.3s ease !important;
    opacity: 1;
    transform: translateY(0);
}

.skin-color-info.hidden,
.skin-extra-info.hidden {
    opacity: 0;
    transform: translateY(10px);
    pointer-events: none;
}


.skin-extra-info img {
    height: 100%;
    width: auto;
}

.skin-extra-info span {
    margin-left: 4px;
    font-size: 14px;
}

.sticker .preview-extras {
    display: none;
}

.skin-color-info {
    display: flex;
    align-items: center;
    margin-left: 8px;
}

.skin-price-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 11px;
    font-weight: 500;
    position: absolute;
    text-wrap: nowrap;
    transition: all .15s ease-in-out;
    top: 5px;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
}

.skin-price-info .souvenir-price-info {
    color: #ffd700;
}

.box-skins.solo .box-skins-list .skin .skin-price-info {
    top: 12px;
}

.box-skins.solo .box-skins-list.showprice .skin .skin-price-info {
    opacity: .75;
}

.skin:hover .skin-price-info,
.box-skins.solo .box-skins-list.showprice .skin:hover .skin-price-info {
    opacity: 1;
}

#preview-content .skin-price-info {
    transform: unset;
    font-size: 14px;
    opacity: 1;
    width: auto;
    left: 25px;
    top: 47px;
    align-items: flex-start;
    justify-content: space-between;
    height: auto;
}

/* .skin-color-info:empty,
.skin-extra-info:empty {
    display: none;
} */

.skin-color-info .skin-color {
    width: 34px;
    height: 16px;
    border-radius: 5px;
    margin: 4px 14px;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
    filter: drop-shadow(0 1px 1px rgb(10 10 10)) blur(0);
    transition: all .15s ease-in-out;
    position: relative;
}

.skin-color-info .skin-color:hover {
    transform: scale(1.05);
    filter: brightness(1.05);
}

.skin-color-info .skin-color:first-child {
    margin-left: 0;
    width: 42px;
}

.skin-color.golden {
    background: #e4c82e;
    background: linear-gradient(180deg, #FEDB37 30%, #FDB931 100%);
}

.skin-color.silver {
    background: #E8E8E8;
    background: linear-gradient(180deg, #E8E8E8 30%, #afafaf 100%);
}

.skin-color.brown {
    background: #836953;
    background: linear-gradient(180deg, #836953 30%, #64503f 100%);
}

.skin-color.white {
    background: #FFFFFF;
    background: linear-gradient(180deg, #FFFFFF 30%, #dfdfdf 100%);
}

.skin-color.red {
    background: #be2424;
    background: linear-gradient(180deg, #be2424 30%, #881a1a 100%);
}

.skin-color.yellow {
    background: #FFE600;
    background: linear-gradient(180deg, #FFE600 30%, #ccb800 100%);
}

.skin-color.orange {
    background: #FFA726;
    background: linear-gradient(180deg, #FFA726 30%, #cf891f 100%);
}

.skin-color.cyan {
    background: #00eeff;
    background: linear-gradient(180deg, #00eeff 30%, #00c1cf 100%);
}

.skin-color.purple {
    background: #6635b4;
    background: linear-gradient(180deg, #6635b4 30%, #4f298d 100%);
}

.skin-color.pink {
    background: #f05ea7;
    background: linear-gradient(180deg, #f05ea7 30%, #c54d89 100%);
}

.skin-color.green {
    background: #30c530;
    background: linear-gradient(180deg, #30c530 30%, #249224 100%);
}

.skin-color.blue {
    background: #3374ff;
    background: linear-gradient(180deg, #3374ff 30%, #295ccc 100%);
}

.skin-color.black {
    background: #1f1f1f;
    background: linear-gradient(180deg, #181818 30%, #141414 100%);
}

.skin-color.gray {
    background: #858585;
    background: linear-gradient(180deg, #858585 30%, #5a5a5a 100%);
}


#preview-showcase .skin-alt-info {
    position: relative;
    transition: all .15s ease-in-out;
    cursor: pointer;
    z-index: 1;
    height: 24px;
    width: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.skin-craft-info {
    position: relative;
    margin-right: 8px;
}

#preview-showcase .skin-alt-info:hover {
    opacity: 1;
}

#preview-showcase .skin-alt-info.hidden {
    display: none;
    visibility: hidden;
}

#preview-showcase .titled[data-title]:after {
    left: -3px;
    content: attr(data-title);
    margin-top: -15px !important;
    font-size: 14px !important;
    background-color: unset !important;
    border: unset !important;
    height: unset !important;
    text-transform: unset !important;
    top: 0;
    transform: translateY(-35%);
    transition: all .05s ease-in-out;
    display: unset !important;
}

#preview-showcase:has(.skin-extra-info a) .titled[data-title]:after {
    transform: translateY(-150%);
}

#preview-showcase:has(.skin-extra-info a) .titled[data-title]:hover:after {
    transform: translateY(-225%);
    transition: all .15s ease-in-out;
    opacity: 1;
}

#preview-showcase .titled[data-title]:hover:after {
    transform: translateY(-35%);
    transition: all .15s ease-in-out;
    opacity: 1;
}

#preview-showcase #preview-content::before {
    content: '';
    width: 75%;
    height: 20%;
    position: absolute;
    filter: blur(115px);
    border-radius: var(--main-border);
}

#preview-window #preview-content::before {
    animation: skinblur 3s infinite;
}


#preview-showcase #preview-content img {
    animation: skinpulse 2s infinite;
}

#preview-showcase #preview-content.paused img {
    animation: unset;

}

@keyframes skinblur {
    0% {
        filter: blur(115px);
    }

    50% {
        filter: blur(130px);
    }

    100% {
        filter: blur(115px);
    }
}

@keyframes skinpulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.03);
    }

    100% {
        transform: scale(1);
    }
}


.white #preview-content::before,
.white #preview-content .skin-desc-name::before,
.skin.white::after,
.skin.white .skin-desc-name::before,
.navigation-weapon-type.white::before {
    background: rgb(176, 195, 217);
}

.lblue #preview-content::before,
.lblue #preview-content .skin-desc-name::before,
.skin.lblue::after,
.skin.lblue .skin-desc-name::before,
.navigation-weapon-type.lblue::before {
    background: rgb(94, 152, 217);
}

.blue #preview-content::before,
.blue #preview-content .skin-desc-name::before,
.skin.blue::after,
.skin.blue .skin-desc-name::before,
.navigation-weapon-type.blue::before {
    background: rgb(75, 105, 255);
}

.purple #preview-content::before,
.purple #preview-content .skin-desc-name::before,
.skin.purple::after,
.skin.purple .skin-desc-name::before,
.navigation-weapon-type.purple::before {
    background: rgb(136, 71, 255);
}

.pink #preview-content::before,
.pink #preview-content .skin-desc-name::before,
.skin.pink::after,
.skin.pink .skin-desc-name::before,
.navigation-weapon-type.pink::before {
    background: rgb(211, 44, 230);
}

.red #preview-content::before,
.red #preview-content .skin-desc-name::before,
.skin.red::after,
.skin.red .skin-desc-name::before,
.navigation-weapon-type.red::before {
    background: rgb(235, 75, 75);
}

.gold #preview-content::before,
.gold #preview-content .skin-desc-name::before,
.skin.gold::after,
.skin.gold .skin-desc-name::before,
.navigation-weapon-type.gold::before {
    background: rgb(228, 174, 57);
}

.sticker #preview-content::before,
.sticker #preview-content .skin-desc-name::before,
.skin.sticker::after {
    background: rgb(90 90 90);
}


.topic-craft #preview-content {
    background: radial-gradient(50% 65% at 50% 100%, #4b4b4b31, transparent 100%);
    color: transparent;
}

.sticker #preview-content,
.white #preview-content,
.lblue #preview-content,
.blue #preview-content,
.purple #preview-content,
.pink #preview-content,
.red #preview-content,
.gold #preview-content {
    background: unset;
}

.inspect-craft #preview-content {
    height: 500px;
    background-image: url(/img/inferno.webp);
    background-size: cover;
}

.inspect-craft #preview-showcase .officon::before {
    filter: brightness(.2);
    opacity: .7;
}

.inspect-craft .preview-nav-button {
    opacity: .25;
}

.inspect-craft #preview-showcase {
    width: 890px;
}

.inspect-craft .site-searcher-buttons,
.inspect-craft .preview-pause-button {
    display: none;
}

.inspect-craft #preview-content::before,
.inspect-craft #preview-content .skin-desc-name::before {
    content: unset;
}

.inspect-craft #preview-showcase #preview-content img {
    animation: unset;
    max-height: 100%;
    filter: unset;
}

#preview-showcase #preview-content img {
    z-index: 10;
    max-height: 84%;
    height: auto;
    width: auto;
    filter: drop-shadow(6px 4px 6px rgba(0, 0, 0, .4));
    transition: all .15s ease-in-out;
    pointer-events: none;
    user-select: none;
}

.preview-close-button,
.preview-pause-button {
    cursor: pointer;
    transition: all .15s ease-in-out;
    z-index: 100;
}

.preview-nav-button {
    position: absolute;
    top: 3px;
    right: 5px;
    cursor: pointer;
    transition: all .15s ease-in-out;
    z-index: 100;
}

.preview-buttons {
    position: absolute;
    width: auto;
    height: auto;
    right: 15px;
    top: 15px;
    align-items: center;
    transition: all .15s ease-in-out;
    z-index: 99;
    display: flex;
    flex-direction: column;
}

#preview-showcase:hover .preview-nav-button {
    opacity: .25;
}

.preview-pause-button,
.preview-nav-button {
    top: unset;
    right: unset;
    width: auto;
    height: auto;
    position: relative;
}

.preview-pause-button {
    padding: 11px;
    padding-top: 5px;
}

.preview-nav-button {
    font-size: 26px;
    position: absolute;
    font-size: 30px;
    top: 45%;
    transform: translateY(-50%);
    opacity: 0;
}

.preview-nav-button.left {
    left: 15px;
}

.preview-nav-button.right {
    right: 15px;
}

.preview-close-button:hover,
.preview-buttons:hover,
.preview-nav-button:hover {
    opacity: 1 !important;
}

.site-searcher-buttons {
    width: 100%;
    display: flex;
    justify-content: center;
    position: relative;
    padding: unset;
    z-index: 100;
    bottom: 0;
}

.site-searcher-box[data-title]:after,
.navigation-weapon-sort[data-title]:after,
.topic-grandbox .skin .skin-desc-name,
.topic-filter .singlemod-box[data-title]:after,
.main-mode:after,
.infoicon::after,
.route-semi::before,
.defbutton span,
.mirror-visit span,
.content-buttons .copy span {
    content: '';
    position: absolute;
    width: max-content;
    padding: 3px;
    font-size: 12px;
    font-weight: 500;
    margin-bottom: 20px;
    border-radius: 5px;
    pointer-events: none;
    display: flex;
    justify-content: center;
    user-select: none;
    left: 50%;
    transform: translateX(-50%) translateY(10px);
    filter: drop-shadow(0px 0px 1px rgb(22, 22, 22));
    transition: all .05s ease-in-out;
    align-items: center;
    pointer-events: none;
    opacity: 0;
}

.site-searcher-box[data-title]:hover:after,
.navigation-weapon-sort[data-title]:hover:after,
.topic-grandbox .skin:hover .skin-desc-name,
.defbutton:hover span,
.mirror-visit:hover span,
.content-buttons .copy:hover span {
    content: attr(data-title);
    transform: translateX(-50%);
    transition: all .15s ease-in-out;
    opacity: 1;
}

.defbutton span,
.mirror-visit span,
.content-buttons .copy span {
    font-size: 11px;
    transform: translateX(-50%) translateY(0);
    background-color: rgb(26 26 26);
    margin-bottom: 34px;
    filter: unset;
    padding: 5px 7px;
    margin-left: 6px;
    text-transform: none;
}

.boxes-holder:not(.main-page) .content-buttons .copy span {
    margin-left: -6px;
}

.defbutton:hover span,
.mirror-visit:hover span,
.content-buttons .copy:hover span {
    transform: translateX(-50%) translateY(-15px);
    font-size: 11px;
}

.content-buttons .copy.icon-changed span {
    opacity: 0;
}

.navigation-weapon-sort[data-title]:after {
    padding: 5px;
    filter: drop-shadow(0px 0px 8px rgb(0 0 0)) drop-shadow(0px 0px 8px rgb(0 0 0)) drop-shadow(0px 0px 8px rgb(0 0 0));
    /* filter: unset; */
    margin-top: -65px;
}

.site-searcher-box[data-title]:after {
    border: none;
    margin-top: -90px;
    background-color: unset;
    padding: 0;
    font-size: 14px;
}

.topic-boxes-holder .topic-grandbox.sticker .skin .skin-desc-name {
    display: none;
}

.topic-grandbox .skin .skin-desc-name {
    margin-bottom: unset;
    /* font-size: 11px; */
    text-transform: none;
    z-index: 100;
    top: -57%;
}

.navigation-weapon-type,
.navigation-weapon-name {
    padding: 5px 8px;
    z-index: 11;
    position: relative;
    background: var(--main-theme);
    filter: drop-shadow(0 0 1px rgb(35 35 35));
    display: flex;
    align-items: center;
    border-radius: var(--main-border);
    font-weight: 500;
    font-size: 12px;
    text-transform: uppercase;
    cursor: pointer;
    transition: .15s all ease-in-out;
    user-select: none;
    opacity: .3;
}

.section:has(.navigation-weapon-name),
.section:has(.navigation-weapon-type) {
    gap: 6px;
    margin-bottom: 3px;
}

.navigation-weapon-type {
    font-size: 11px;
}

.navigation-weapon-type.white::before,
.navigation-weapon-type.lblue::before,
.navigation-weapon-type.blue::before,
.navigation-weapon-type.purple::before,
.navigation-weapon-type.pink::before,
.navigation-weapon-type.red::before,
.navigation-weapon-type.gold::before {
    content: '';
    position: relative;
    display: block;
    z-index: 1;
    width: 8px;
    height: 8px;
    border-radius: 5px;
    margin-right: 6px;
}

.box-skins-nav {
    border-radius: var(--main-border);
    /* background: linear-gradient(15deg, rgba(0, 0, 0, .3) 30%, rgba(0, 0, 0, .15) 100%); */
    background: var(--darkgray);
    height: 55px;
    overflow: hidden;
    padding-right: 8px;
    width: 100%;
    position: relative;
    display: flex;
}

.box-skins-nav-list {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    position: relative;
    overflow-x: scroll;
    overflow-y: hidden;
}

.box-skins-nav .navigation-weapon-name {
    margin: 8px 5px;
    text-wrap: nowrap;
    color: var(--text-darkgray);
    background: unset;
    filter: unset;
    opacity: 1;
}

.navigation-weapon-type::after,
/* .navigation-weapon-name::before, */
.color-box-selection-button::before,
.color-box-overview-button::before,
.navigation-weapon-sort::before,
.navigation-reset::before,
.box-skins-name::before {
    content: '';
    background: linear-gradient(180deg, rgb(26 26 26) 0%, rgb(18 18 18) 100%);
    position: absolute;
    left: 2px;
    top: 2px;
    bottom: 2px;
    right: 2px;
    border-radius: var(--main-border);
    z-index: -1;
}

.box-skins-name::before {
    top: 4px;
    left: 4px;
    bottom: 4px;
    right: 4px;
    background: linear-gradient(150deg, var(--darkygray) 0%, var(--darkgray) 100%);
    border-radius: var(--main-border) 5px 5px var(--main-border);
}

.navigation-weapon-type.notexist,
.navigation-weapon-type.solo-category {
    display: none;
}

.navigation-weapon-type.enabled:hover,
.color-box-selection-button:hover,
.color-box-selection-button.clicked,
.color-box-overview-button:hover,
.navigation-weapon-sort:hover,
.navigation-weapon-sort.enabled,
.navigation-weapon-sort.reversed,
.navigation-weapon-name:hover {
    filter: drop-shadow(0 0 1px rgb(50 50 50));
    transition: .15s all ease-in-out;
    transform: scale(1.05);
    color: var(--white);
}

.box-skins-nav-list .navigation-weapon-name:hover {
    filter: unset;
}

.navigation-weapon-sort:hover i:before {
    opacity: .8;
}

.box-skins.selected {
    height: unset;
    max-height: 620px;
}

.box-skins.selected .box-skins-list {
    flex-wrap: wrap;
    align-content: flex-start;
    align-items: flex-start;
    width: 100%;
    padding-left: 0;
}

.box-skins.solo {
    overflow-x: unset;
    scroll-snap-type: unset;
    scroll-snap-align: unset;
    background: unset;
    height: fit-content;
    margin: unset;
}

.box-skins.solo .box-skins-list {
    flex-wrap: wrap;
    align-content: flex-start;
    align-items: flex-start;
    justify-content: center;
    background-color: unset;
    width: 100%;
}

.box-skins.selected .box-skins-list .skin {
    max-width: 300px;
    min-width: unset;
    height: 200px;
    width: 197px;
    flex-grow: 1;
    transition: unset;
}

.box-skins.solo .box-skins-list .skin {
    height: 200px;
    width: 200px;
    min-width: 157px;
    aspect-ratio: 1 / 1;
    transition: unset;
    margin: 0;
}

.sitepage.items .box-skins .skin:hover {
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .25);
}

.weapon-container:hover {
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, .25);
}

.sitepage.items .box-skins .skin:hover {
    background-color: var(--darkgray) !important;
    transition: background .15s ease-in-out !important;
}

.sitepage.items .box-skins.solo .box-skins-list .skin {
    transition: all .2s ease-in-out;
    width: 16%;
    flex-grow: 1;
    max-width: 201px;
    padding-left: unset;
}

.sitepage.items .skin img {
    transition: all .2s ease-in-out !important;
}

.sitepage.items .skin {
    transition: all .35s ease-in-out !important;
}

.sitepage.items .skin.disabled {
    height: 0;
    width: 0 !important;
    min-width: 0;
    margin: 0;
    animation: fadeOut_items .3s ease-in-out forwards;
}

@keyframes fadeOut_items {
    0% {
        opacity: 1;
        transform: translateY(0) scale(1);
        z-index: 1;
    }

    1% {
        z-index: 10;
    }

    99% {
        opacity: 0;
        transform: translateY(-10px) scale(0);
        z-index: 10;
    }

    100% {
        display: none;
    }
}

.sitepage.items .skin.disabled img {
    opacity: 0;
}

.box-skins.selected .skin::before {
    width: 100%;
}

.box-skins.selected .box-skins-name {
    display: none;
}

.box-skins.selected .skin img,
.box-skins.solo .skin img {
    height: 65%;
}

@-moz-document url-prefix() {

    * {
        scrollbar-color: #000000 #0c0c0c;
        scrollbar-width: thin;
    }

    .box-skins-list,
    .box-skins.selected,
    .box-skins-nav-list {
        scrollbar-width: thin;
        scrollbar-color: #2e2e2e transparent;
    }
}

.box-skins::-webkit-scrollbar {
    width: 4px;
}

.box-skins::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, .1);
    border-radius: 5px;
    transition: .15s background ease-in-out;
}

.box-skins::-webkit-scrollbar-thumb:hover {
    background: rgba(206, 32, 61, .8);
}

.box-skins::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, .3);
}

.topic-centralizer {
    width: 100%;
    min-height: 600px;
}

.sitepage.items .topic-centralizer {
    display: flex;
    min-height: 500px;
    justify-content: flex-start;
    flex-direction: column;
}

.box-skins {
    border-radius: var(--main-border);
    background: var(--darkgray);
    height: 130px;
    margin: 8px 0 0 0;
    width: 100%;
    overflow-x: hidden;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    user-select: none;
    scrollbar-color: unset;
    scrollbar-width: unset;
    position: relative;
}

.box-skins-list::-webkit-scrollbar,
.box-skins-nav-list::-webkit-scrollbar {
    width: 2px;
    height: 4px;
}

.box-skins-list::-webkit-scrollbar-track {
    background: transparent;
}

.box-skins-list::-webkit-scrollbar-thumb,
.box-skins-nav-list::-webkit-scrollbar-thumb {
    background: rgb(20 20 20);
    border-radius: 5px;
}

.box-skins-nav-list::-webkit-scrollbar-thumb {
    background: transparent;
}


.box-skins-list::-webkit-scrollbar-thumb:hover {
    background: rgb(30 30 30);
}

.box-skins .skin {
    height: 95%;
    width: 150px;
    min-width: 150px;
    max-width: 150px;
    margin-left: 5px;
    border-radius: var(--main-border);
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all .2s ease-in-out;
    z-index: 100;
    margin-top: 5px;
    position: relative;
    right: 0;
    cursor: pointer;
    user-select: none;
}

.box-skins .skin img,
.sitepage.items .skin img {
    opacity: 0;
}

.skin.imported img,
.box-skins .skin.imported img,
.box-skins .skin img.imported {
    opacity: 1;
    transform: scale(1);
    transition: all .15s ease-in-out;
}

.box-skins.selected .skin:first-child {
    margin-left: 5px;
}

.box-skins .skin:first-child {
    margin-left: unset;
}

.box-skins.selected:nth-child(2) .skin:first-child {
    padding-left: unset;
}

.box-skins.mac10 .skin {
    min-width: 100px;
}

.box-skins .skin:hover::before,
.box-skins .skin:hover .skin-desc-name,
.box-skins .skin:hover::after {
    opacity: 1;
}

.box-skins .skin:hover::before,
.box-skins .skin:hover .skin-desc-name,
.box-skins .skin:hover::after,
.box-skins-list.showrarity .skin:hover::before,
.box-skins-list.showrarity .skin.gold::after,
.box-skins-list.showrarity .skin.red::after,
.box-skins-list.showrarity .skin.pink::after,
.box-skins-list.showrarity .skin.purple::after,
.box-skins-list.showrarity .skin.blue::after,
.box-skins-list.showrarity .skin.lblue::after,
.box-skins-list.showrarity .skin.white::after {
    opacity: 1;
}

.box-skins-list.showrarity .skin::before {
    opacity: .35;
}

.skin::before {
    content: '';
}

.box-skins .skin::before,
.box-skins .skin .skin-desc-name {
    position: absolute;
    display: flex;
    opacity: 0;
    font-size: 11px;
    font-weight: 500;
    width: 135px;
    height: 60%;
    bottom: 0;
    justify-content: center;
    align-items: center;
    transition: .2s all ease-in-out;
    background: linear-gradient(360deg, rgba(0, 0, 0, .2) 0%, rgba(0, 0, 0, 0) 100%);
}

.sitepage.items .box-skins .skin .skin-desc-name {
    width: 90%;
}

.box-skins .skin::before {
    filter: blur(5px);
}

.box-skins.selected .skin::before {
    filter: blur(10px);
}

.skin::after {
    content: '';
    position: absolute;
    width: 16px;
    height: 8px;
    left: 15px;
    top: 15px;
    border-radius: 5px;
    background-color: var(--white);
    transition: opacity .15s ease-in-out;
    display: none;
    opacity: 0;
}

.box-skins.solo .skin::after {
    display: block;
}

.sitepage.items .box-skins .skin::before {
    content: '';
    width: 150px;
    height: 125px;
    left: -35px;
    top: -14px;
    transform: rotate(140deg);
    filter: blur(20px);
    transition: all .15s ease-in-out;
}

.sitepage.items .box-skins .skin {
    /* background: linear-gradient(-45deg, var(--darkgray) 50%, var(--darkygray) 100%); */
    background: var(--darkgray);
}

.box-skins.solo .skin::before {
    width: 90%;
}

.box-skins .skin .skin-desc-name {
    background: unset;
    filter: drop-shadow(0px 0px 3px black) drop-shadow(0px 0px 3px black);
    text-align: center;
    height: 35px;
    z-index: 3;
}

.box-skins.solo .skin .skin-desc-name {
    height: 50px;
}

.box-skins.disabled,
.box-skins.notexist {
    height: 0 !important;
    margin: 0 !important;
    overflow: hidden;
}

.box-skins.disabled .box-skins-list,
.box-skins.notexist .box-skins-list {
    overflow: hidden;
}

.box-skins.disabled .skin,
.box-skins.notexist .skin,
.box-skins.disabled .close-box-skins,
.box-skins.notexist .close-box-skins,
.box-skins.disabled .box-skins-control,
.box-skins.notexist .box-skins-control {
    display: none;
}

.box-skins .skin.white::before {
    background: radial-gradient(50% 65% at 50% 100%, rgba(176, 195, 217, .2), transparent 100%);
}

.box-skins .skin.lblue::before {
    background: radial-gradient(50% 65% at 50% 100%, rgba(94, 152, 217, .2), transparent 100%);
}

.box-skins .skin.blue::before {
    background: radial-gradient(50% 65% at 50% 100%, rgba(75, 105, 255, .2), transparent 100%);
}

.box-skins .skin.purple::before {
    background: radial-gradient(50% 65% at 50% 100%, rgba(136, 71, 255, .2), transparent 100%);
}

.box-skins .skin.pink::before {
    background: radial-gradient(50% 65% at 50% 100%, rgba(211, 44, 230, .2), transparent 100%);
}

.box-skins .skin.red::before {
    background: radial-gradient(50% 65% at 50% 100%, rgba(235, 75, 75, .2), transparent 100%);
}

.box-skins .skin.gold::before {
    background: radial-gradient(50% 65% at 50% 100%, rgba(228, 174, 57, .2), transparent 100%);
}

.box-skins.selected .skin .skin-desc-name,
.box-skins.solo .skin .skin-desc-name,
.box-skins.selected .skin .skin-price-info,
.box-skins.solo .skin .skin-price-info {
    font-size: 12px;
}

.box-skins.knives .skin,
.box-skins.gloves .skin,
.box-skins.gloves .skin {
    min-width: 90px;
}

.box-skins.smgs .skin,
.box-skins.smgs:hover .skin {
    min-width: 125px;
}

.box-skins .skin:hover {
    width: 150px;
    min-width: 150px;
}

.box-skins .skin:hover img {
    transform: scale(1.1) rotate(3deg);
}

/* .box-skins.knives .skin:hover img {
    transform: scale(1.2) rotate(3deg);
}

.box-skins.gloves .skin:hover img {
    transform: scale(1.25) rotate(3deg);
} */

.box-skins.selected .skin:hover img,
.box-skins.solo .skin:hover img {
    transform: scale(1.1) rotate(3deg);
}

.box-skins .skin img {
    width: auto;
    height: 82%;
    transition: all .2s ease-in-out;
    transform: scale(1.1);
    z-index: 2;
}

.box-skins.knives .skin img {
    width: auto;
    height: 60%;
}

.box-skins.gloves .skin img {
    width: auto;
    height: 60%;
}

.box-skins.solo .skin img {
    width: 80%;
    height: auto;
}

.box-skins-list {
    width: 100%;
    height: 100%;
    display: inline-flex;
    justify-content: flex-start;
    align-items: center;
    overflow-x: scroll;
    border-radius: 5px;
    opacity: 0;
    user-select: none;
}

.box-skins-list::-webkit-scrollbar {
    width: 2px;
}

.fade-in-topic .sitetoppannel,
.items.fade-in-topic .topic-grandbox,
.items.fade-in-topic .topicpage {
    transition: all .15s ease-in-out;
    opacity: 1 !important;
}

.box-skins-list.visible {
    opacity: 1;
}

.close-box-skins {
    width: 45px;
    height: 45px;
    background-color: #0b0b0b;
    border: 4px solid rgb(16 16 16);
    position: absolute;
    right: -3px;
    top: -3px;
    z-index: 1000;
    border-radius: 0 0 0 var(--main-border);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: rgb(46 46 46);
    transition: color .15s ease-in-out;
    cursor: pointer;
    margin-top: -2px;
    z-index: 1001;
}

.close-box-skins:hover i::before {
    opacity: 1;
}

.box-skins-list .skins-not-exist {
    width: 100%;
    height: 95%;
    margin-top: 5px;
    background-color: #0c0c0c;
    display: flex;
    align-items: center;
    justify-content: center;
}

.box-skins-list .skins-not-exist span {
    font-size: 60px;
    font-weight: 500;
    color: rgb(8 8 8);
}

.box-skins-name {
    width: 35px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    position: relative;
    user-select: none;
    z-index: 100;
}

.box-skins-name span {
    transform: rotate(90deg);
    color: var(--text-darkgray);
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 500;
    display: flex;
    align-items: center;
    height: 33px;
    min-width: 120px;
    justify-content: center;
    transition: .2s all ease-in-out;
    margin-left: 2px;
}

.box-skins.selected .box-skins-control,
.box-skins.solo .box-skins-control {
    display: none;
}

.box-skins-button {
    position: absolute;
    background-color: rgba(9, 9, 9, .5);
    height: 100%;
    width: 40px;
    color: var(--text-darkgray);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    transition: all .15s ease-in-out;
    z-index: 100;
}

.box-skins-button.hidden {
    display: none;
}

.box-skins-button:hover i::before {
    opacity: 1;
}

.box-skins-button.left {
    left: 34px;
}

.box-skins-button.right {
    right: 0;
}

h2,
h3 {
    font-weight: 500;
    font-size: 16px;
    width: 95%;
}

.boxreview .plusminus {
    width: 100%;
    height: auto;
    display: flex;
    align-content: center;
    align-items: flex-start;
    justify-content: space-between;
    margin-top: 0px;
    gap: 8px;
    order: -2;
}

.boxreview .plusminus .criteria {
    width: 50%;
    height: 100%;
    min-height: 230px;
    overflow: hidden;
    border-radius: var(--main-border);
    position: relative;
    transition: all .15s ease-in-out;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    position: relative;
    padding-bottom: 40px;
    z-index: 1;
}

.boxreview .plusminus .criteria p,
.boxreview .plusminus .criteria .par li,
.category-selector .category,
.category-selector .big-category {
    text-align: start;
    display: flex;
    justify-content: flex-start !important;
}

.boxreview .plusminus .criteria h2,
.boxreview .plusminus .criteria p {
    margin-left: unset;
    position: absolute;
    font-size: 16px;
    height: 32px;
    width: 90px;
    color: black;
    text-align: center;
    display: flex;
    align-items: center;
    left: 0;
    z-index: 1;
    justify-content: center !important;
    pointer-events: none;
    user-select: none;
    font-weight: 600;
    opacity: .9;
}

.boxreview .plusminus .criteria p::before {
    content: '';
    position: absolute;
    height: 100%;
    width: 100px;
    top: 0;
    left: -5px;
    z-index: -1;
    border-radius: 0 0 24px 0;
}

.boxreview .plusminus .criteria:nth-child(1) p::before {
    background-color: var(--green);
}

.boxreview .plusminus .criteria p::before {
    background: linear-gradient(-45deg, rgb(141, 21, 41), var(--main-color));
    background-clip: inherit;
}

.boxreview .plusminus .criteria:nth-child(1) p::before {
    background: linear-gradient(-45deg, rgb(21, 141, 51), var(--green));
    background-clip: inherit;
}

.boxreview .plusminus .criteria .par li {
    font-size: 16px;
    font-weight: 500;
    margin-top: 10px;
    width: 90%;
    line-height: 1.3;
}

.boxreview .plusminus .criteria .par {
    width: 450px;
    position: relative;
    left: 20px;
    height: 70%;
    display: flex;
    flex-direction: column;
    margin-top: 40px;
    padding-left: 24px;
}

.boxreview .plusminus .criteria::before {
    position: absolute;
    bottom: 25px;
    right: 30px;
}

.boxreview .plusminus .criteria .par li::before {
    margin-top: 2px;
    position: absolute;
    left: 0;
}

.boxreview .plusminus .criteria:nth-child(1) {
    background: linear-gradient(320deg, rgba(15, 207, 79, 0) 30%, rgba(15, 207, 79, .09) 100%);
    background-color: var(--darkgray);
}

.boxreview .plusminus .criteria:nth-child(2) {
    background: linear-gradient(320deg, rgba(207, 15, 49, 0) 30%, rgba(207, 15, 49, .09) 100%);
    background-color: var(--darkgray);
}

.site-attention {
    width: 100%;
    border-radius: var(--main-border);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 0;
    transition: all .15s ease-in-out;
    background: var(--darkgray);
    position: relative;
    margin-top: 8px;
    overflow: hidden;
    line-height: 22px;
    order: -2;
}

.site-attention span {
    font-weight: 500;
    font-size: 16px;
    user-select: none;
    text-align: center;
    z-index: 1;
    width: 85%;
}

.info-block {
    width: 100%;
    display: flex;
}

.site-attention.blocked {
    width: auto;
    justify-content: flex-start;
    height: 48px;
    padding: 0 20px;
    padding-left: 14px;
    width: 100%;
    order: -1;
}

.site-attention strong.styled {
    position: relative;
    z-index: 1;
    color: var(--main-color);
    font-weight: 600;
}

.site-attention strong.code {
    font-weight: 500;
    background: rgb(21 21 21); 
    padding: 3px 5px; 
    border-radius: 5px;
}

.site-attention strong.item {
    position: relative;
    z-index: 1;
    font-weight: 600;
}

.site-attention strong.item::after {
    display: none;
}

.site-attention span.main-line {
    width: 100%;
    position: relative;
    display: block;
}

.site-attention::after {
    background-image: unset;
    mask-image: url(/img/icons/gamemodes/map-marker-question.svg);
    mask-repeat: no-repeat;
    mask-size: 100%;
    background-color: var(--main-color);
    transform: rotate(-5deg);
    position: absolute;
    left: -30px;
    top: unset;
    height: 150px !important;
    width: 150px !important;
    opacity: .25 !important;
}

.site-attention.event::after {
    mask-image: url(/img/icons/gamemodes/party-horn.svg);
    height: 150px !important;
    width: 150px !important;
    top: 20px;
    left: 11px;
}

.site-attention.blocked::after,
.site-attention.notif::after {
    mask-image: url(/img/icons/gamemodes/triangle-warning.svg);
    left: 0;
}

.site-attention i {
    margin-left: 1px;
    margin-right: 15px;
}

/* .site-attention:hover {
    background-color: var(--darkygray);
} */


.site-attention.blocked span {
    width: 100%;
    text-align: start;
}

.site-attention span a {
    text-decoration: none;
    color: var(--main-color);
    transition: all .15s ease-in-out;
    font-weight: 600;
}

.boxreview .smallreview,
.instruction {
    width: 100%;
    position: relative;
    height: auto;
    background-color: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    align-content: flex-start;
    padding: 30px 0;
    background: var(--darkgray);
    border-radius: var(--main-border);
    margin-top: 8px;
}

.boxreview:has(.info-block) .smallreview {
    padding-top: 20px;
}

.sitetoppannel {
    position: relative;
    border-radius: var(--main-border);
    height: 50px;
    width: 100%;
    margin: 0 auto;
    z-index: 1000;
    display: flex;
    flex-direction: row;
    justify-content: center;
    background: var(--darkgray);
    padding: 6px 2px 6px 2px;
    opacity: 0;
}

.weapon-selection {
    width: max-content;
    min-width: 136px;
    max-height: 560px;
    max-width: 300px;
    margin-top: 34px;
    padding-top: 2px;
    overflow-y: scroll;
    overflow-x: hidden;
    position: absolute;
    display: block;
    z-index: 3;
    border-radius: var(--main-border);
    visibility: hidden;
    opacity: 0;
    background-color: var(--darkgray);
    box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .5);
    padding-left: 3px;
}

.sitetoppannel .weapon-container:first-child .weapon-selection {
    left: 0;
}

.sitetoppannel .weapon-container:last-child .weapon-selection {
    right: 0;
}

.weapon-selection::-webkit-scrollbar {
    width: 4px;
}

.weapon-selection::-webkit-scrollbar-track,
.box-skins-nav-list::-webkit-scrollbar-track {
    background: transparent;
}

.weapon-selection::-webkit-scrollbar-thumb {
    background: #2e2e2e;
    border-radius: 5px;
}

.weapon-selection::-webkit-scrollbar-thumb:hover {
    background: #414141;
}

.weapon-container:hover .weapon-selection {
    visibility: visible;
    opacity: 1;
}

.weapon-selection-redir {
    height: 100%;
    width: 100%;
    border-radius: var(--main-border);
    display: flex;
    align-items: center;
    text-decoration: none;
    position: relative;
}

.weapon-selection-unite:hover a,
.weapon-selection-unite.current a {
    background-color: rgba(255, 255, 255, .03);
}

.weapon-container:hover {
    background: var(--darkygray);
    border-radius: var(--main-border);
    transition: background .15s ease-in-out;
    z-index: 1;
}

.weapon-current img,
.weapon-selection-redir img {
    transition: .2s all ease-in-out;
}

.weapon-current:hover img {
    transform: scale(1.1) rotate(3deg);
}

.weapon-selection-redir:hover img {
    transform: scale(1.1);
}

.weapon-selection-redir:hover span {
    transform: scale(1.02);
}

.weapon-container {
    margin: 0 4px;
    border-radius: var(--main-border);
    width: 15%;
    background: var(--darkgray);
    cursor: pointer;
    display: flex;
    justify-content: center;
    position: relative;
}

.weapon-current {
    display: flex;
    align-items: center;
    height: 100%;
    width: 100%;
    justify-content: center;
}

.weapon-container:hover .weapon-current img {
    filter: grayscale(0);
    transform: scale(1.1) rotate(3deg);
}

.weapon-current img {
    width: auto;
    max-height: 70%;
    max-width: 30%;
    filter: grayscale(1);
}

.weapon-selection-unite {
    height: 40px;
    min-height: 40px;
    width: 100%;
    border-radius: 5px;
    border-bottom: 2px solid rgba(0, 0, 0, .1);
    transition: all .15s ease-in-out;
    display: flex;
    justify-content: center !important;
    align-items: center;
    position: relative;
    scroll-snap-align: start;
}

.weapon-selection-redir span {
    position: relative;
    height: 100%;
    width: auto;
    flex-grow: 1;
    display: flex;
    justify-content: start;
    align-items: center;
    text-align: center;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 500;
    padding: 0 10px;
    transition: all .15s ease-in-out;
    white-space: nowrap;
}

.weapon-selection-unite img {
    width: 35px;
    height: auto;
    filter: drop-shadow(0px 0px 4px black);
    margin-left: 10px;
}

.siteleftpannel .navigation-menu {
    position: relative;
    width: 300px;
    height: 50px;
    margin-top: 9px;
    border-radius: var(--main-border);
    background-color: rgba(0, 0, 0, .2);
    padding: 10px 0;
    overflow: hidden;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
    transition: all .9s ease-in-out;
}

.navigation-menu .navigation-title i {
    margin-left: 10px;
    transform: rotate(0deg);
    transition: all ease-in-out .6s;
}

.navigation-menu.active .navigation-title i {
    margin-left: 10px;
    transform: rotate(180deg);
    transition: all ease-in-out .6s;
}

.navigation-menu:hover.active {
    background: linear-gradient(150deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(65, 65, 65, 0.3) 50%, rgba(255, 255, 255, 0) 100%) !important;
}

.navigation-menu:hover {
    background: linear-gradient(150deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(65, 65, 65, 0.3) 50%, rgba(255, 255, 255, 0) 100%) !important;
}

.siteleftpannel .navigation-menu.active {
    height: 200px;
}

.siteleftpannel .navigation-menu .navigation-title {
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    vertical-align: baseline;
    width: 100%;
    right: 0;
    margin: 0 auto;
    text-transform: uppercase;
}

.siteleftpannel .navigation-menu .navigation-space {
    height: 1px;
    background: linear-gradient(56deg, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, .1) 50%, rgba(0, 0, 0, 0) 100%);
    width: 35%;
    right: 0;
    margin: 10px auto;
}

.siteleftpannel .navigation-menu li {
    color: rgb(255, 255, 255, .3);
    text-align: left;
    font-size: 14px;
    font-weight: 500;
    display: list-item;
    list-style: decimal;
    vertical-align: baseline;
    padding: 6px 2px;
    width: 80%;
    right: 0;
    margin: 0 auto;
}

.siteleftpannel .navigation-menu ul a {
    text-decoration: none;
}

.features,
.gamemodes {
    height: auto;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    border-radius: 5px;
}

.features {
    width: auto;
    order: -1;
    height: auto;
    transition: all .15s ease-in-out;
}

.shortinfo {
    width: 100%;
    height: 48px;
    /* background-color: var(--darkgray); */
    border-radius: var(--main-border);
    margin-top: -56px;
    display: flex;
    order: -2;
}

.shortinfo .features {
    padding: 0 9px;
    background-color: var(--darkgray);
    border-radius: var(--main-border);
    display: flex;
}

.shortinfo.empty {
    display: none;
}

.boxreview#mirror {
    min-height: 725px;
}

.gamemodes {
    position: absolute;
    bottom: 5px;
    z-index: 2;
}

.features .featuresbox {
    width: 100%;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gamemodes .featuresbox {
    width: 100%;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.features .featuresbox .typesinside,
.gamemodes .featuresbox .typesinside {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: flex-start;
    position: relative;
    flex-wrap: nowrap;
}

.features .featuresbox .typesinside {
    gap: 9px;
}

.gamemodes .featuresbox .typesinside {
    justify-content: center;
}

.features .featuresbox .typesinside img {
    width: 96px;
    height: 32px;
}

.features .featuresbox .typesinside img#nobonus {
    margin: 12px 0 12px 22px;
}

.gamemodes .featuresbox .typesinside a {
    transition: ease-in-out all .2s;
    position: relative;
    height: auto;
    width: auto;
    margin: 0 2px;
    padding: 2px;
    border-radius: 5px;
}

.gamemodes .featuresbox .typesinside a:hover {
    transform: scale(1.1);
    filter: grayscale(0) brightness(110%);
    z-index: 1;
}

.features .featuresbox .typesinside a,
.features .featuresbox .typesinside a::before {
    transition: all .15s ease-in-out;
    /* background-color: var(--main-theme); */
}

.features .featuresbox .typesinside a:hover,
.features .featuresbox .typesinside a:hover::before,
.features .featuresbox .typesinside a:hover::after {
    background-color: rgb(20 20 20);
}

.features .featuresbox .typesinside a:hover {
    transform: scale(1.03);
}

.boxreview#mirror .features .featuresbox .typesinside a:last-child {
    border-radius: 0 5px 5px 0;
    content: '';
}

.boxreview#mirror .features .featuresbox .typesinside a:last-child::after {
    content: unset;
}

.methodlist a {
    margin: 2px;
    height: 32px;
    width: 32px;
    transition: all .2s ease-in-out;
    transform: scale(0.89);
    filter: grayscale(1) brightness(100%);
    position: relative;
}

.star_rating,
.sitepage .ratingsumm .rating::before {
    width: 108px;
    height: 18px;
    background: linear-gradient(to right, rgb(141, 21, 41), var(--main-color));
    mask-image: url(/img/icons/gamemodes/star.svg);
    mask-repeat: repeat-x;
    mask-size: 21px 18px;
    mask-position: left center;
    -webkit-mask-image: url(/img/icons/gamemodes/star.svg);
    -webkit-mask-repeat: repeat-x;
    -webkit-mask-size: 22px 18px;
    -webkit-mask-position: left center;
    z-index: 1;
}

.sitepage .ratingsumm .rating::before {
    content: '';
    position: absolute;
    left: 0;
    opacity: .5;
}

.sitepage .ratingsumm .rating::before,
.sitepage .ratingsumm .rating .star_rating {
    mask-size: 19.5px 16px;
    -webkit-mask-size: 19.5px 16px;
    width: 98px;
    height: 18px;
}

.liverating .star_rating,
.sitepage .ratingsumm .rating .star_rating {
    mask-image: url(/img/icons/gamemodes/star-fill.svg);
}

.box.main .liverating .star_rating .bi-star {
    opacity: 0;
}

.box.main .liverating .star_rating {
    opacity: 1;
}

h2,
h3 {
    font-weight: 600;
    font-size: 20px;
    /* color: var(--main-color); */
}

.pages h1,
#PageSubt {
    text-transform: uppercase;
    font-size: 17px;
    font-weight: 600;
}

.pages h1 {
    color: var(--text-darkgray);
    font-size: 13px;
    user-select: none;
}

.smallreview p {
    display: flex;
    align-items: center;
    justify-content: center;
}

.smallreview h2,
.smallreview h3,
.instruction h2,
.instruction h3 {
    height: auto;
    margin-bottom: 20px;
    text-align: start;
}

.smallreview h2,
.smallreview h3,
.instruction h2,
.instruction h3,
.introduce-craft h2 {
    font-size: 20px;
    position: relative;
    display: flex;
}

.smallreview p {
    text-align: start;
}

.smallreview p {
    height: auto;
    font-weight: 500;
    font-size: 16px;
    width: 95%;
    display: block;
    position: relative;
    line-height: 1.4;
    color: var(--text-lightgray);
    text-wrap-style: pretty;
}

.criteria-descriptions {
    display: flex;
    flex-direction: row;
    margin-top: 8px;
    gap: 8px;
    flex-wrap: wrap;
    width: 100%;
}

.ssiodox:not(:has(.boxreview)) .criteria-descriptions {
    display: block;
    column-count: 2;
    width: 60%;
    margin: 0 auto;
    margin-top: 18px;
    
}

.ssiodox:not(:has(.boxreview)) .criteria-descriptions .smallreview {
    margin: unset;
    background: none;
    filter: unset;
    box-shadow: unset;
    padding: 10px;
    break-inside: avoid;
    width: 100%;
}

.smallreview.criteria h3 {
    width: auto;
    font-size: 16px;
    margin-bottom: 15px;
    user-select: none;
    align-items: center;
}

.smallreview.criteria h3::before {
    width: 18px;
    height: 18px;
    mask-image: url(/img/icons/gamemodes/map-marker-question.svg);
    mask-repeat: no-repeat;
    background: linear-gradient(to right, rgb(141, 21, 41), var(--main-color));
    mask-size: 100%;
    filter: grayscale(1);
    transition: all .15s ease-in-out;
    top: unset;
}

.boxreview .smallreview.criteria h3::before {
    width: 16px;
    height: 16px;
    mask-image: url(/img/icons/gamemodes/star-fill.svg);
}

.smallreview.criteria:hover h3::before {
    filter: grayscale(0);
}

.smallreview.criteria p,
.smallreview.criteria ol li {
    color: var(--gray);
    transition: all .15s ease-in-out;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    user-select: none;
}

.smallreview.criteria ol li strong {
    color: var(--gray);
}

.smallreview.criteria:hover p,
.smallreview.criteria:hover ol li {
    color: var(--text-lightgray);
}

.smallreview.criteria:hover ol li::before  {
    color: var(--main-color);
}

.smallreview.criteria ol {
    list-style: none;
    counter-reset: item1;
    line-height: 1.4;
    margin-top: 15px;
}

.smallreview.criteria ol li::before {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    counter-increment: item1;
    content: counter(item1, decimal);
    transition: all .15s ease-in-out;
    background: rgb(18 18 18);
    color: var(--gray);
    position: relative;
    margin-right: 4px;
    width: 16px;
    height: 16px;
    border-radius: 30%;
    font-weight: 600;
}

.smallreview.criteria ol li strong {
    transition: all .15s ease-in-out;
}

.smallreview.criteria:hover ol li strong {
    color: var(--white);
}

.smallreview.criteria::after {
    content: unset;
}

/* .smallreview.criteria h3 {
    margin-bottom: 15px;
} */

.boxreview .smallreview.criteria,
.smallreview.criteria {
    background: var(--darkgray);
    width: 45%;
    margin: 0 auto;
    padding: 25px;
    border-radius: var(--main-border);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
    filter: drop-shadow(0 0 1px rgb(10 10 10)) blur(0);
    justify-content: flex-start;
    flex-grow: 1;
}

.smallreview p:nth-child(3),
.smallreview p:nth-child(4),
.smallreview p:nth-child(5),
.smallreview p:nth-child(6),
.smallreview p:nth-child(7),
.smallreview p:nth-child(8),
.smallreview p:nth-child(9) {
    margin-top: 15px;
}

.ratingsumm {
    width: 100%;
    height: 100px;
    background: var(--darkgray);
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: center;
    justify-content: space-around;
    align-items: center;
    padding: 30px 0px 30px 0px;
    border-radius: var(--main-border);
}

.ratingsection {
    width: 95%;
    display: flex;
    height: 80%;
    justify-content: space-between;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
}

.ratingsection .ratingway {
    height: 120px;
    width: 25%;
    display: flex;
    font-size: 16px;
    font-weight: 600;
    justify-content: center;
    flex-direction: row;
    align-items: center;
}

.ratingsection .ratingway span {
    margin-right: 10px;
}

.instruction:nth-child(2) {
    filter: grayscale(1);
}

.instruction.double li {
    width: 100%;
}

.instruction.double {
    width: 50%;
    padding-left: 14px;
    border-radius: var(--main-border) 0 0 var(--main-border);
}

.instruction.notmain {
    width: 50%;
    transition: all .15s ease-in-out;
    border-radius: 0 10px 10px 0;
}

.instruction.notmain:hover {
    opacity: 1;
}

.instruction ol {
    width: 96%;
    counter-reset: item1;
}

.blog .instruction ol {
    gap: 8px;
    display: flex;
    flex-direction: column;
}

.instruction li {
    text-align: left;
    font-size: 16px;
    font-weight: 500;
    display: block;
    list-style: none;
    position: relative;
    line-height: 35px;
    color: var(--text-lightgray);
    width: 70%;
}

.instruction ol li:before {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    counter-increment: item1;
    content: counter(item1, decimal);
    background: rgb(18 18 18);
    color: var(--main-color);
    position: relative;
    margin-right: 10px;
    width: 22px;
    height: 22px;
    border-radius: 30%;
    font-weight: 600;
    font-size: 15px;
}

.instruction li a {
    font-weight: 600;
    color: var(--main-color);
    text-decoration: none;
}

.boxreview#mirror .typesinside {
    justify-content: center;
    border-radius: 5px 5px 0 0;
}

.instruction-mirrors ol {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 98%;
    height: 300px;
    align-content: center;
    align-items: center;
}

.instruction-mirrors h2 {
    text-align: center;
    height: auto;
    margin-bottom: 30px !important;
    color: var(--white);
}

.instruction-mirrors {
    padding: 30px 0 30px 0;
    justify-content: center;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    align-content: flex-start;
    border-radius: 0 0 5px 5px;
    width: 100%;
    height: auto;
    background: var(--darkgray);
    border-radius: var(--main-border);
}

.instruction-mirrors li {
    padding: 8px;
    display: flex;
    width: 350px;
}

.instruction-mirrors li a:hover {
    text-decoration: none;
    transform: scale(1.03);
    background-color: #202020;
    border: 2px solid #232323;
}

.instruction-mirrors li a {
    padding: 15px 50px;
    background-color: rgb(21 21 21);
    border: 2px #181818 solid;
    transition: ease-in-out all .15s;
    text-align: center;
    border-radius: var(--main-border);
    font-weight: 600;
    font-size: 14px;
    width: 100%;
    text-decoration: none;
    position: relative;
}

.actual::before {
    content: url(/img/icons/fire.svg);
    width: 26px;
    height: 26px;
    border-radius: var(--main-border);
    background: #ce203d;
    border: 2px solid #b52c42;
    right: -10px;
    top: -10px;
    display: flex;
    position: absolute;
    align-items: center;
    justify-content: center;
}

.mini-info {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-weight: 500;
    font-size: 15px;
    margin-top: -10px;
    margin-bottom: 10px;
    background-color: rgb(21 21 21);
    border: 2px #181818 solid;
    padding: 15px 30px;
    border-radius: var(--main-border);
    width: auto;
}

.mini-info .stronged {
    margin-left: 3px;
    text-decoration: none;
    color: rgb(155, 155, 155);
    font-weight: 600;
    transition: all .15s ease-in-out;
}

.mini-info a:hover {
    color: var(--main-color);
}

.mini-info .actual {
    position: relative;
    width: fit-content;
    margin: 0 5px;
}

.mini-info .actual::before {
    width: 22px;
    height: 22px;
    right: 0;
    top: 0;
    position: relative;
}

.smallreview p a {
    font-weight: 500;
    text-decoration: none;
    transition: all .15s ease-in-out;
}

.smallreview p a:hover {
    color: rgb(170, 25, 49);
}

.instruction li a:hover,
.smallreview p a:hover {
    filter: brightness(1.25);
}

.instruction li strong,
.instruction li a {
    font-weight: 500;
    position: relative;
    display: inline-block;
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    color: rgb(155, 155, 155);
    transition: all .15s ease-in-out;
    line-height: 28px;
    margin: 0 12px;
    z-index: 1;
}

.instruction li a {
    color: var(--main-color);
}

.instruction li strong::after,
.instruction li a::after,
.site-attention.event strong.item::after {
    content: '';
    z-index: -1;
    width: 100%;
    height: 85%;
    padding: 0px 7px;
    left: 50%;
    top: 50%;
    border-radius: 5px;
    transform: translateY(-50%) translateX(-50%);
    position: absolute;
    background: rgb(18 18 18);
}

.blog .instruction li strong::after,
.smallreview.criteria li strong::after,
.blog .instruction li a::after {
    padding: 2px 7px;
}

.blog .instruction li strong::after,
.blog .instruction li a::after {
    padding: 0 5px;
    height: 100%;
}

.blog .instruction li a::after {
    height: 140%;
}

.blog .instruction {
    filter: none;
}

.site-promo-copy {
    width: 25px;
    height: 25px;
    background: rgb(25 25 25);
    border: 2px #191919 solid;
    border-radius: 0 5px 5px 0;
    position: relative;
    transition: all .15s ease-in-out;
    display: inline-flex;
    vertical-align: middle;
    align-items: center;
    justify-content: center;
}

.site-promo-copy .copied-title {
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 600;
    bottom: 0;
    margin-left: 150px;
}

.site-promo-copy i {
    color: rgb(188, 188, 188);
    transition: opacity .15s ease-in-out;
    font-size: 12px;
    opacity: .4;
}

.instruction code,
.promo-box code {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    padding: 0 7px;
    height: 25px;
    border-radius: 5px 0 0 5px;
    font-weight: 600;
    font-size: 12px;
    margin-left: 3px;
    text-transform: uppercase;
    font-family: TTNormsPro;
    background: rgb(17 17 17);
    color: rgb(155, 155, 155);
    transition: all .15s ease-in-out;
}

.instruction code:hover,
.promo-box:hover code,
.site-promo-copy:hover,
.site-promo-copy:hover::after {
    color: rgb(188, 188, 188);
}

.promo-box:hover code {
    color: var(--white);
}

.site-promo-copy::after {
    transition: all .15s ease-in-out;
}

.screentable {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    align-content: flex-start;
    border-radius: var(--main-border);
    margin: 9px 0 0 0;
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.screentable:hover .screens button i,
.slider-container:hover button i {
    opacity: .5;
}

label.active {
    background-color: rgba(255, 255, 255, .5);
    border: solid 2px white;
    transform: scale(1.2);
}

label:hover {
    transform: scale(1.3) !important;
}

.pages button {
    background-color: transparent;
    border: none;
    outline: none;
    font-family: TTNormsPro;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 18px;
    border-radius: 5px;
    transition: all .15s ease-in-out;
    color: rgba(255, 255, 255, .3);
    margin-left: 6px;
}

#FAQ {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 0px;
    transition: all .6s ease-in-out, margin .25s .45s;
    transform: translateZ(0);
    overflow: hidden;
    margin: 0;
    bottom: 0;
    z-index: 10;
    position: relative;
}

#FAQ.active {
    /* background: linear-gradient(56deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 14%, rgba(0, 0, 0, 0.3) 50%, rgba(0, 0, 0, 0) 86%, rgba(0, 0, 0, 0) 100%); */
    transition: all .9s ease-in-out, margin .5s;
    margin-top: 9px;
}

#FAQ #PageSubt {
    width: 1000px;
    opacity: 0;
    transition: opacity .3s .15s ease-in-out;
    height: auto;
    font-size: 15px;
    font-weight: 500;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: none;
    padding: 15px 0;
    line-height: 1.4;
}

#FAQ.active #PageSubt {
    transition: opacity .3s .3s ease-in-out;
    opacity: 1;
}

nav img {
    height: auto;
    width: 130px;
    transition: all .2s ease-in-out;
}

#logo {
    transform: scale(1);
    transition: all .15s ease-in-out;
}

#logo:hover {
    transform: scale(1.05);
}

.category-selector {
    max-width: var(--centralized);
    min-width: var(--centralized);
    overflow: hidden;
    justify-content: flex-start;
    transition: all .15s ease-in-out;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 84px;
    height: 650px;
    display: flex;
}

.category-selector .category {
    position: relative;
}

.category-selector .category-box {
    position: relative;
    width: 300px;
    height: 60px;
    margin: 0 9px;
    scroll-snap-align: start;
    border-radius: var(--main-border);
    background-color: var(--darkgray);
    cursor: pointer;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
    filter: drop-shadow(0 0 1px rgb(10 10 10)) blur(0);
    transition: all .15s ease-in-out;
    display: flex;
    text-decoration: none;
}

.buttons-container {
    width: 70%;
    position: relative;
    top: 114px;
    margin: 0 auto;
}

.controls-button {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: translateY(-50%);
    transition: all .15s ease-in-out;
    color: rgba(255, 255, 255, .12);
    border: none;
    font-size: 20px;
    cursor: pointer;
    width: 25px;
    height: 40px;
    border-radius: var(--main-border);
    background: transparent;
}

.controls-button:first-child {
    left: 0;
    transform: translateY(-50%);
    transition: all .2s ease-in-out;
    opacity: 1;
}

.main-mode-selection .controls-button {
    width: 40px;
    background: var(--darkgray);
    opacity: .85;
}

.main-mode-selection .controls-button:first-child {
    left: 28px;
}

.main-mode-selection .controls-button:last-child {
    right: 28px;
}

.controls-button:last-child {
    right: 0;
}

.controls-button.disabled:first-child {
    transition: all 0s ease-in-out;
    transform: translateY(-50%) translateX(-50px);
    opacity: 0;
}

.controls-button.disabled:last-child {
    transition: all .2s ease-in-out;
    transform: translateY(-50%) translateX(50px);
    opacity: 0;
}

.controls-button.disabled {
    transition: visibility 0s .25s ease-in-out;
    visibility: hidden;
}

.controls-button:hover {
    transform: translateY(-50%) scale(1.1);
}

.controls-button:hover i::before {
    opacity: 1;
    transform: translateY(-50%) scale(1.1);
}

.controls-button:focus {
    outline: none;
}

.category-selector .category:hover .category-box {
    transform: scale(1.03);
}

.category-selector .category:hover .category-box .category-box-logo {
    filter: grayscale(0);
    transition: all .15s ease-in-out;
}

.category-selector .category-box .category-box-logo {
    aspect-ratio: 1 / 1;
    display: flex;
    justify-content: center;
    align-items: center;
    filter: grayscale(1);
    min-width: 50px;
    position: relative;
    overflow: hidden;
    margin: 4px;
}

.category-selector .category-box .category-box-logo::before {
    position: absolute;
    content: '';
    height: 100%;
    width: 100%;
}

.category-selector .category-box.active .category-box-logo img,
.category-selector .category:hover .category-box .category-box-logo img {
    opacity: 1;
}

.category-selector .category-box .category-box-logo img {
    opacity: .8;
    max-height: 60% !important;
    transition: all .15s ease-in-out;
    filter: drop-shadow(0 0 6px rgb(8 8 8));
    z-index: 1;
}

.category-selector .category-box#active .category-box-logo,
.category-selector .category-box.active .category-box-logo {
    filter: grayscale(0) !important;
}

.category-selector .category-box .category-box-content {
    position: relative;
    height: 100%;
    width: auto;
    z-index: 1;
    font-weight: 600;
    font-size: 17px;
    text-transform: uppercase;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
    transition: all .15s ease-in-out;
    padding-left: 10px;
    margin-right: 20px;
}

.boxes-holder,
.topic-boxes-holder {
    gap: 18px;
    max-width: var(--centralized);
    padding: 0 9px;
    margin: 0 auto;
    margin-top: 18px;
    width: auto;
    height: 100%;
    justify-content: center;
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    min-height: 550px;
    position: relative;
}

.topic-boxes-holder {
    min-height: 718px;
    /* gap: 18px 9px; */
}

.topic-boxes-holder:has(.pagination-holder) {
    margin-bottom: 50px;
}

.topic-boxes-holder.sticker-crafts.pagination {
    min-height: 812px;
}

.topic-filter {
    display: flex;
    flex-direction: row;
    position: relative;
    z-index: 3;
    width: 100%;
    height: 45px;
    gap: 9px;
    margin: -6px 0;
}

.topic-filter .singlemod-box:first-child {
    margin-left: 0;
}

.topic-filter .singlemod-box {
    flex-grow: unset;
    height: 45px;
    width: 45px;
}

.topic-filter .singlemod-box:hover {
    z-index: 2;
}

.topic-filter input.singlemod-box {
    opacity: 1;
    border: unset;
    outline: unset;
    font-weight: 600;
    font-size: 14px;
    color: rgba(255, 255, 255, .75);
    font-family: TTNormsPro;
    text-align: start;
    padding-left: 20px;
    cursor: text;
}

.topic-filter input.singlemod-box::placeholder {
    color: var(--text-darkgray);
    font-size: 14px;
}

.topic-filter .singlemod-box[data-title]::after {
    bottom: -50%;
    filter: none;
    padding: 5px 8px;
    font-weight: 600;
    font-size: 11px;
}

.topic-filter .singlemod-box[data-title]:hover::after {
    content: attr(data-title);
    transform: translateX(-50%) translateY(100%) !important;
    transition: all .15s ease-in-out;
    margin-top: 0px;
    opacity: 1;
}

.singlemod-box.topic-filter-tab {
    width: 220px;
}

.singlemod-box.topic-filter-tab:hover {
    transform: scale(1.03);
}

.category-centralizer {
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
}

.category-centralizer .buttons-container {
    display: none;
}

.notexist-block {
    max-width: 70%;
    width: auto;
    justify-content: center;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    flex-direction: column;
    position: absolute;
    transform: translateX(50%);
    right: 50%;
    top: 330px;
}

.notexist-block span:nth-child(1) {
    font-size: 36px;
    font-weight: 600;
    text-transform: uppercase;
}

.notexist-block span:nth-child(2) {
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 500;
}

.category-selector#notexist {
    overflow-y: unset !important;
}

#notexist {
    max-width: 82.5%;
    overflow: unset;
    position: relative;
    left: unset;
    top: 38px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-content: flex-start;
    overflow-y: auto;
    height: 800px !important;
}

#notexist::-webkit-scrollbar,
.topic-nav-menu::-webkit-scrollbar {
    width: 0;
}

#notexist .category-box {
    margin: 8px 8px;
}

.language-box {
    width: 280px;
    height: 40px;
    border-radius: 5px;
    position: absolute;
    top: 296px;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background-color: rgb(18 18 18);
    display: none;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 18px;
    color: var(--text-darkgray);
    z-index: 1;
}

.language-box .lang-menu ul {
    overflow: hidden !important;
}

.language-box .lang-menu {
    color: rgba(255, 255, 255, .5);
}

.slider-container.topic {
    left: 145px;
}

.slider-container:hover .controls {
    opacity: 1;
    top: 50%;
    transform: scale(1);
}

.sitepage {
    display: flex;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.sitedetails {
    position: absolute;
}

.siteleftpannel {
    position: relative;
    height: auto;
    width: 300px;
}

.sitepage.items .siteleftpannel {
    min-width: 300px;
    height: 100%;
    left: 1px;
}

.sitepage.items .box-skins {
    justify-content: flex-start;
    flex-direction: column;
    background: rgba(0, 0, 0, .3);
}

.sitepage.items .box-skins.solo .box-skins-list {
    justify-content: flex-start;
    overflow: hidden;
    margin: 0 auto;
    margin-top: 4px;
    width: calc(100% - 16px);
    padding-bottom: 8px;
    min-height: 500px;
    gap: 8px;
}

.sitepage.items .topicpage {
    width: 65.715%;
}

.item-topic-grandbox {
    position: relative;
    width: 300px;
    height: 100px;
    border-radius: var(--main-border) var(--main-border) 0 0;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
    background-color: rgb(10 10 10);
    transition: all .15s ease-in-out;
    margin: 0 !important;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.item-topic-grandbox .logobg {
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 10px;
    transition: all .3s ease-in-out;
    mask-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 1) 50%, rgba(0, 0, 0, 0));
    -webkit-mask-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 1) 50%, rgba(0, 0, 0, 0));
    -webkit-mask-image: -webkit-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));
}

.item-topic-grandbox .logobg img {
    height: 160%;
    margin-top: 30px;
    width: auto;
    z-index: 10;
}

.sitepage.items .topic-grandbox {
    height: auto;
    min-height: unset;
    transition: unset;
    margin-top: -8px;
    border-radius: 0 0 var(--main-border) var(--main-border);
    z-index: 10;
}

.sitepage.cases .topic-grandbox {
    border-radius: 0 0 5px 5px;
}

.sitepage.items .topic-grandbox .section {
    top: unset;
    border-radius: 5px;
    top: -20px;
}

.sitepage.items .section {
    margin-top: 10px;
    height: auto;
}

.sitepage.items .section.searchers {
    height: 30%;
    align-content: flex-start;
    margin-bottom: 11px;
    gap: 8px;
}

.sitepage.cases .section.searchers {
    margin-top: 10px;
    z-index: 100;
    height: auto;
}

.siteblock {
    position: fixed;
    display: flex;
    flex-direction: column;
    transition: all .2s ease-in-out;
    z-index: 1;
    gap: 8px;
}

.bonusincludes {
    margin-top: 8px;
}

.box-extra-links {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.nav-review {
    width: 300px;
    height: auto;
    position: relative;
    background-color: var(--darkgray);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--main-border);
    text-decoration: none;
    transition: all .15s ease-in-out;
    order: 2;
}

.nav-review ol {
    margin: 6px 0;
    width: calc(100% - 12px);
    counter-reset: item1;
}

.nav-review li {
    text-align: left;
    font-size: 16px;
    font-weight: 500;
    display: flex;
    position: relative;
    line-height: 24px;
    transition: all .15s ease-in-out;
    cursor: pointer;
    user-select: none;
    border-radius: var(--main-border);
    padding: 6px 0;
    padding-left: 12px;
    color: var(--gray);
}

.nav-review.blog li {
    padding-left: 5px;
}

.nav-review li:first-child {
    margin-top: unset;
}

.nav-review li:last-child {
    margin-bottom: unset;
}

.nav-review li.current {
    background: var(--icongradient2);
    color: var(--white);
}

.nav-review li.current::before {
    opacity: 1;
}

.nav-review li::before {
    content: "";
    position: relative;
    width: 8px;
    height: 8px;
    min-width: 8px;
    font-size: 24px;
    color: transparent;
    background: linear-gradient(to right, rgb(141, 21, 41), var(--main-color));
    -webkit-background-clip: text;
    background-clip: initial;
    transition: all .15s ease-in-out;
    border-radius: 30%;
    margin-right: 10px;
    top: 8px;
    opacity: .5;
}

.text-col-info-theme::before,
.nav-review.blog li::before {
    display: flex;
    align-items: center;
    justify-content: center;
    content: '1';
    background: rgb(18 18 18);
    color: var(--main-color);
    width: 22px;
    height: 22px;
    border-radius: 30%;
    margin-right: 10px;
    font-weight: 600;
    font-size: 15px;
    top: unset;
}

.nav-review.blog li::before {
    counter-increment: item1;
    content: counter(item1, decimal);
}

.text-col-info-box .text-col-info:nth-child(2) .text-col-info-theme::before {
    content: '2';
}

.text-col-info-box .text-col-info:nth-child(3) .text-col-info-theme::before {
    content: '3';
}

.text-col-info-box .text-col-info:nth-child(4) .text-col-info-theme::before {
    content: '4';
}

.text-col-info-box .text-col-info:nth-child(5) .text-col-info-theme::before {
    content: '5';
}

.boxreview .nav-review li:hover::before {
    transform: scale(1.3);
}

.nav-review li:hover {
    transform: scale(1.02);
    color: var(--white);
}

.navmark {
    animation: navmark-animation .6s ease-in-out;
    animation-iteration-count: 2;
}

@keyframes navmark-animation {
    0% {
        opacity: 1;
        border-radius: var(--main-border);
    }

    50% {
        opacity: .8;
        border-radius: var(--main-border);
    }

    100% {
        opacity: 1;
        border-radius: var(--main-border);
    }
}

.extra-abox {
    width: 300px;
    height: 60px;
    background-color: var(--darkgray);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--main-border);
    text-decoration: none;
    transition: all .15s ease-in-out;
    position: relative;
    overflow: hidden;
    order: 1;
}

.promo-box {
    height: 100px;
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    text-transform: uppercase;
    border: 0 solid transparent;
    margin-top: 0;
    order: 1;
    z-index: 1;
}

.promo-box .content {
    position: relative;
    justify-content: center;
    text-align: center;
    height: 100%;
    z-index: 1;
    width: 100%;
    padding: 0 20px;
    gap: 8px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.promo-box .content .defbutton {
    top: unset;
    bottom: 20px;
    right: 21px;
}

.promo-box .content .promo-code-desc {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
}

.promo-box::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 4px;
    right: 4px;
    top: 4px;
    bottom: 4px;
    background: linear-gradient(-45deg, var(--darkgray) 50%, var(--main-theme) 100%);
    opacity: .8;
    border-radius: var(--main-border);
}

.promo-box .content .bonus-type {
    filter: drop-shadow(0 0 1px var(--main-color));
    width: 45px;
    height: 45px;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 0;
    right: 15px;
    z-index: 1;
}

.promo-box .content .bonus-type::before {
    content: '';
    mask-image: url(/img/icons/gamemodes/ribbon.svg);
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    background: var(--buttonbg);
    width: 100%;
    height: 100%;
    position: absolute;
}

.promo-box .content .bonus-type i {
    margin-top: -6px;
    z-index: 1;
}

.promo-box .content .bonus-type i::before {
    height: 18px;
    width: 18px;
    opacity: 1;
    /* filter: brightness(.08); */
}

.promo-box.extra-abox .logobg span {
    font-size: 20px;
    color: rgb(46 46 46);
    user-select: none;
}

.promo-box.extra-abox .logobg::after {
    content: '';
    z-index: -1;
    width: 100%;
    font-weight: 600;
    position: absolute;
    font-size: 9px;
    padding: 2px 0 5px 0;
    color: rgb(46 46 46);
    transition: all .15s ease-in-out;
    background: var(--darkgray);
    bottom: -2px;
}
/* 
.promo-box.extra-abox:hover .logobg span,
.promo-box.extra-abox:hover .logobg::after {
    color: var(--gray);
} */

.promo-box.deposit-bonus .content .promo-code-desc::before {
    content: 'Deposit Bonus';
}

.lang-ru .promo-box.deposit-bonus .content .promo-code-desc::before {
    content: 'Бонус к Пополнению';
}

.promo-box.sell-bonus .content .promo-code-desc::before {
    content: 'Sell Bonus';
}

.lang-ru .promo-box.sell-bonus .content .promo-code-desc::before {
    content: 'Бонус к Продаже';
}

.promo-box.trade-bonus .content .promo-code-desc::before {
    content: 'Trade Bonus';
}

.lang-ru .promo-box.trade-bonus .content .promo-code-desc::before {
    content: 'Бонус к Обмену';
}

.promo-box.welcome-bonus .content .promo-code-desc::before {
    content: 'Free Bonus';
}

.lang-ru .promo-box.welcome-bonus .content .promo-code-desc::before {
    content: 'Приветственный Бонус';
}

.promo-box.extra-abox.else-bonus .logobg::after {
    content: 'Free Bonus';
}

.promo-box.extra-abox.else-bonus .logobg span {
    font-size: 13px;
    margin-bottom: 8px;
}

.promo-box.extra-abox span {
    font-size: 12px;
    font-weight: 600;
    width: auto;
    color: var(--gray);
    text-wrap: nowrap;
}

.promo-box p, 
.promo-box .content p:first-child,
.promo-box .content .promo-code-desc::before {
    color: var(--text-darkgray);
    width: auto;
    height: unset;
    margin: unset;
    font-weight: 500;
    font-size: 11px;
    transition: all .15s ease-in-out;
    user-select: none;
    text-transform: uppercase;
    text-wrap: nowrap;
}

.promo-box code {
    padding: unset;
    background: unset;
    font-size: 22px;
    color: var(--white);
    margin: unset;
    height: 20px;
}

.promo-box .site-promo-copy::after {
    opacity: .15;
}

.promo-box:hover .site-promo-copy::after {
    opacity: .35;
}

.promo-box .copy .copied-title {
    display: none !important;
}

.partner-site::before {
    content: 'Subsidiary';
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    color: black;
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    left: -30px;
    top: 10px;
    width: 150px;
    height: 18px;
    transform: rotate(-25deg) translateY(-50px) translateX(-50px);
    background-color: var(--main-color);
    transition: all .15s ease-in-out;
}

.lang-ru .partner-site::before {
    content: 'Партнер';
}

.lang-es .partner-site::before {
    content: 'Filial';
}

.partner-site:hover::before {
    transform: rotate(-25deg);
}

.return-box {
    width: 60px;
    height: 60px;
    background-color: rgba(0, 0, 0, .35);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 9px;
    border-radius: 5px;
    text-decoration: none;
    transition: all .2s ease-in-out;
    font-size: 26px;
    font-weight: 500;
    color: rgba(255, 255, 255, .3);
    position: absolute;
    top: 0;
    left: -70px;
}

.partner-site img {
    max-width: 150px;
    max-height: 50px;
    height: auto;
}

.extra-abox:hover {
    transform: scale(1.02);
}

.extra-abox span {
    font-size: 16px;
    font-weight: 500;
    transition: all .15s ease-in-out;
}

.mirror-redirect {
    justify-content: flex-start;
}

.mirror-redirect .mirror {
    border-radius: var(--main-border);
    height: calc(100% - 8px);
    width: auto;
    aspect-ratio: 1 / 1;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 4px;
    margin-right: 18px;
    background: var(--icongradient);
    box-shadow: 0 1px 2px 0 rgba(11, 11, 11, .4);
    transition: all .15s ease-in-out;
}

.mirror-redirect .mirror::before {
    background-size: 90%;
}

.extra-abox:hover .officon::before {
    opacity: .6;
}

.more-crafts span {
    font-size: 14px;
    text-align: center;
    text-wrap-style: pretty;
    width: 85%;
}

.bonusdesc {
    width: 300px;
    height: 100px;
    background-color: var(--opacback);
    border-radius: var(--main-border);
}

.sitedetails {
    z-index: 1;
    position: relative;
    width: 100%;
    display: flex;
    margin: 8px 0;
    height: 60px;
    transition: .25s all ease-in-out;
}

.nav-bar {
    width: 100%;
    height: 0%;
    background-color: rgba(11, 11, 11, .92);
    position: fixed;
    transition: all .22s ease-in-out;
    overflow: hidden;
    z-index: 1002;
    opacity: 0;
    top: 0;
}

.nav-bar.active {
    opacity: 1;
    height: 110%;
}

.category-centralizer.nav {
    margin-top: 120px;
}

.category-centralizer.nav .category-selector {
    align-content: flex-start;
    height: 600px !important;
}

.category-centralizer.nav .category-box {
    background: rgb(21 21 21);
}

.category-centralizer.nav .category-box-logo {
    background: rgba(0, 0, 0, .2);
}

.category-centralizer.nav .category:hover .category-box {
    background-color: rgb(16 16 16);
}

.sitedetails .sitepros {
    width: 100%;
    height: 60px;
    min-height: 60px;
    cursor: pointer;
    border-radius: var(--main-border);
    position: relative;
    font-weight: 500;
    display: flex;
    align-items: center;
    transition: .15s all ease-in-out;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
    overflow: hidden;
    flex-direction: column;
    justify-content: flex-start;
    background: var(--darkgray);
}

.sitedetails .sitepros.active,
.sitedetails .sitepros:hover {
    background: rgb(9 9 9);
}

.sitedetails .sitepros:first-child {
    margin-right: 4px;
}

.sitedetails .sitepros:last-child {
    margin-left: 4px;
}

.sitedetails .methodlist {
    height: auto;
    position: relative;
    transition: all .9s ease-in-out;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 90%;
    max-width: 650px;
    border-radius: 5px;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    padding-bottom: 18px;
}

.sitedetails .methodlist a:hover {
    transform: scale(1);
    transition: all ease-in-out .2s;
    filter: grayscale(0) brightness(110%);
}

.sitedetails .sitepros.active {
    height: 100%;
}

.sitedetails .sitepros span {
    min-height: 60px;
    width: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
    top: 0;
}

.sitepros span::after {
    margin-left: 10px;
}

.sitedetails .sitepros span::after {
    transform: rotate(0deg);
    transition: all ease-in-out .4s;
}

.sitedetails .sitepros.active span::after {
    transform: rotate(180deg);
    filter: none;
}

.topic-box {
    position: relative;
    width: 300px;
    height: auto;
    border-radius: var(--main-border);
    overflow: hidden;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
    filter: drop-shadow(0 1px 1px rgb(10 10 10)) blur(0);
    transition: all .15s ease-in-out;
    text-decoration: none;
    background: var(--darkgray);
}

.topic-boxes-holder .topic-grandbox.sticker .topic-box {
    box-shadow: unset;
    height: 128px;
}

.topic-grandbox .topic-box:hover {
    background-color: unset !important;
}

.topic-grandbox .topic-box {
    margin: unset;
    background: unset;
    height: 150px;
}

.sticker-crafts-list .topic-boxes-holder .topic-grandbox.sticker .topic-box {
    height: 100%;
}

.topic-grandbox .topic-box .logobg {
    height: 100%;
}

.sticker-crafts-list .topic-grandbox .topic-box .logobg {
    margin: 0;
    background: unset;
}

.topic-grandbox .topic-box:hover {
    transform: scale(1);
}

.topic-grandbox .topic-box .logobg {
    background-color: rgba(0, 0, 0, .1);
}

.topic-box:hover {
    transform: scale(1.03);
}

.topic-box .logobg img {
    transition: all .15s ease-in-out;
    height: 84%;
    width: auto;
}

.topic-box.items .logobg,
.topic-box .logobg.skincolors {
    height: 150px;
}

.topic-box .logobg.skincolors {
    visibility: hidden;
}

.topic-box .logobg.skincolors {
    transform: scale(1.05);
    opacity: 0;
    visibility: visible;
    transition: all .15s ease-in-out, opacity .4s;
    background-color: var(--darkygray);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    margin: 4px;
}

.topic-box .logobg {
    transition: all .2s ease-in-out;
    top: 0;
    /* mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 0));
    -webkit-mask-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 0)); */
    display: flex;
    justify-content: center;
    align-items: center;
    transform: scale(1);
    position: relative;
    margin-top: 6px;
    opacity: 1;
    border-radius: var(--main-border) var(--main-border) 3px 3px;
    background: linear-gradient(-45deg, var(--darkgray) 50%, var(--darkygray) 100%);
    overflow: hidden;
    margin: 4px;
    width: auto;
}

/* .sticker .topic-box .logobg,
.topic-craft:not(.loadout) .topic-grandbox .topic-box .logobg {
    margin: 8px 8px 0 8px;
    background: var(--icongradient);
    background: linear-gradient(-45deg, var(--darkgray) 50%, var(--darkygray) 100%);
    mask-image: unset;
    -webkit-mask-image: unset;
} */

.topic-boxes-holder .logobg.skincolors {
    transform: unset;
}

.topic-box .logobg.skincolors.active {
    transform: scale(1);
    opacity: 1;
}


.topic-boxes-holder .topic-box:hover .logobg,
.topic-boxes-holder .topic-grandbox:hover .topic-box .logobg,
.item-topic-grandbox:hover .logobg,
.topic-box.maestro:hover .logobg {
    transform: scale(1.03) !important;
    margin: 6px 8px 9px 8px !important;
    margin: 4px 6px 4px 6px !important;
}

.topic-box.maestro:hover .logobg {
    margin: 4px !important;
}

.item-topic-grandbox:hover .logobg {
    margin: unset !important;
}

.topic-boxes-holder .topic-box .logobg:hover img {
    transform: scale(1.05) rotate(3deg) !important;
    transition: all .15s ease-in-out !important;
}

.topic-box .content {
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(180deg, transparent, var(--darkgray));
    transition: all .15s ease-in-out;
    z-index: 10;
    position: relative;
}

/* .topic-box:hover .content {
    background: linear-gradient(180deg, transparent, var(--darkygray));
} */

.topic-box.maestro:hover .content {
    background: linear-gradient(180deg, transparent, var(--darkgray));
}

.topic-box .content span {
    display: block;
    font-weight: 600;
    font-size: 16px;
    opacity: .15;
    text-transform: uppercase;
    transition: opacity .15s ease-in-out;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    max-width: 90%;
    margin: 10px;
}

.topic-box:hover .content span {
    opacity: 1;
}

.box {
    position: relative;
    width: 300px;
    min-width: 300px;
    height: 400px;
    border-radius: var(--main-border);
    display: flex;
    justify-content: center;
    background: linear-gradient(180deg, var(--darkgray) 0%, rgb(13 13 13) 100%);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
    /* background: rgba(0, 0, 0, .2);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    filter: drop-shadow(0 1px 1px rgb(10 10 10)) blur(0); */
    transition: all .15s ease-in-out, overflow .15s .15s ease-in-out;
    z-index: 10;
}

.box.main {
    margin: 0;
    border-radius: var(--main-border);
    height: 250px;
    background: var(--darkgray);
    backdrop-filter: unset;
    -webkit-backdrop-filter: unset;
}

.box.main .logobg {
    height: auto;
    margin-bottom: 120px;
    background: unset;
    z-index: 1;
}

.box.main .logobg img {
    max-height: 60px;
}

.box.main .content {
    height: auto;
    position: absolute;
    bottom: 0;
}

.sitepage .box .content {
    background: var(--icongradient2);
}

.box.main .content-buttons {
    margin: 9px 0 20px 0;
}

.box.crypto-choice {
    opacity: .55;
}

.box.crypto-choice:hover {
    opacity: 1;
}

.more-content {
    height: auto;
    position: relative;
    display: flex;
    /* background: linear-gradient(180deg, var(--darkgray) 0%, rgb(13 13 13) 100%); */
    transition: all .15s ease-in-out, overflow .15s .15s ease-in-out;
    z-index: 10;
    width: 100%;
    justify-content: center;
    order: 1;

}

.more-content:hover {
    transform: unset !important;
}

.more-content .more-content-list {
    position: relative;
    display: flex;
    justify-content: flex-start;
    flex-direction: row;
    margin: unset;
    height: auto;
    gap: 9px;
}

.more-content .more-content-list span {
    /* text-transform: uppercase; */
    font-size: 15px;
    font-weight: 600;
    color: var(--gray);
    margin-left: 8px;
    user-select: none;
}

.more-content .more-content-title {
    display: flex;
    align-items: center;
    justify-content: center;
}

.more-content .singlemod-box {
    flex-grow: unset;
}


.more-content .more-content-list .content-category:hover img {
    filter: grayscale(0);
}

.sitepage .box .logobg .rating,
.sitepage .ratingsumm .rating {
    width: 122px;
    height: 32px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
    font-size: 18px;
    position: absolute;
    bottom: 8px;
    background: var(--darkygray);
    padding: 7px;
    z-index: 1;
}

.sitepage .box .logobg .rating {
    bottom: -1px;
}

.sitepage .ratingsumm .rating {
    position: relative;
    width: 98px;
    height: 18px;
    background: unset;
    padding: unset;
    bottom: unset;
}

@keyframes elemWidth {
    from {
        width: 0;
    }

    to {
        width: 100%;
    }
}

.liverating {
    width: 0;
    max-width: 108px;
    height: auto;
    display: flex;
    align-items: center;
    flex-direction: row;
    font-size: 18px;
    position: absolute;
    transition: all .15s ease-in-out;
    overflow: hidden;
    left: 7px;
}

/* .mirror .liverating {
    display: none;
}

.siteblock.mirror .box .logobg .rating {
    z-index: -1;
}

.siteblock.mirror .box.main .logobg .star_rating {
    display: none;
    color: var(--white);
}

.siteblock.mirror .box.main .logobg .star_rating:first-child {
    display: flex;
}

.siteblock.mirror .box.main .logobg .star_rating::before {
    content: 'Read Review';
    width: auto;
    height: 21px;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 500;
    opacity: 1;
    mask-image: unset;
    mask-repeat: unset;
    background: unset;
    mask-size: unset;
}

.sitepage.lang-ru .siteblock.mirror .box.main .logobg .star_rating::before {
    content: 'Читать Обзор';
} */

.liverating.fadein {
    animation-duration: .8s;
    animation-fill-mode: both;
    animation-name: elemWidth;
}

.sitepage .box .logobg .rating::after,
.sitepage .box .logobg .rating::before,
.sitealternates .rating-case-single::after,
.sitealternates .rating-case-single::before {
    content: '';
    position: absolute;
    width: 20px;
    height: 100%;
    background: var(--darkygray);
    box-sizing: border-box;
    transform: skewX(20deg);
    top: 0;
}

.sitealternates .rating-case-single::before {
    transform: skewX(-20deg) !important;
}

.sitepage .box .logobg .rating::before,
.sitealternates .rating-case-single::before {
    left: -8px;
    border-radius: 5px 0 0 0;
    transform: skewX(-20deg);

}

.sitepage .box .logobg .rating::after,
.sitealternates .rating-case-single::after {
    right: -8px;
    border-radius: 0 5px 0 0;
}

.sitealternates {
    position: relative;
    margin-top: 9px;
    width: 100%;
}

.alternates-title {
    width: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 14px;
    position: absolute;
    left: 50%;
    top: -2px;
    transform: translateX(-50%);
    color: var(--gray);
    height: 30px;
    padding: 0 12px;
    user-select: none;
    z-index: 100;
}

.alternates-title {
    background: var(--darkygray);
}

.alternates-title::after,
.alternates-title::before {
    content: '';
    position: absolute;
    width: 20px;
    height: 100%;
    box-sizing: border-box;
    border-radius: 0 0 5px 0;
    background: inherit;
    transform: skewX(-20deg);
    z-index: -1;
    top: 0;
    right: -10px;
}

.alternates-title::before {
    right: unset;
    left: -10px;
    transform: skewX(20deg);
    border-radius: 0 0 0 5px;
}

.sitealternatesboxes {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: flex-start;
    gap: 8px;
}

.sitealternates .rating-case-single {
    height: 30px;
    border-radius: 0;
    left: 50%;
    transform: translateX(-50%) !important;
    transition: unset !important;
    justify-content: center;
    padding-right: 10px;
    padding-bottom: unset;
    bottom: 8px;
}

.sitealternates .rating-case-single .rating-summ,
.sitealternates .rating-case-single .star_rating {
    font-size: 15px;
}

.sitealternates .box .logobg .rating {
    display: none;
}

.sitealternates .box {
    width: 25%;
    min-width: unset;
    height: 304px;
    background-color: unset;
    background: var(--darkgray);
    box-shadow: unset;
    border-radius: var(--main-border);
}

.sitealternates .box .logobg {
    background: unset;
    height: 50%;
}

.sitealternates .box .content {
    height: 50%;
    user-select: none;
    margin-bottom: 8px;
}

.sitealternates .box .logobg img {
    width: auto;
    max-width: 160px !important;
    height: auto;
    max-height: 60px !important;
}

.sitealternates .box .content h2,
.sitealternates .box .content .boxtitle {
    font-size: 18px;
}

.sitealternates .site-reward {
    height: 65px;
    width: 80%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin-top: 5px;
}

.sitealternates .site-reward::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 105%;
    height: 100%;
    border-radius: var(--main-border);
    background: var(--darkgray);
    z-index: 1;
}

.boxes-holder .box:hover,
.topic-box:hover,
.topic-boxes-holder .topic-grandbox.sticker:hover {
    transform: scale(1.04);
    backface-visibility: hidden;
    /* background: linear-gradient(150deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 10%, rgba(50, 50, 50, 0.25) 50%, rgba(255, 255, 255, 0) 100%) !important; */
}

.boxes-holder.main-page .box:hover {
    transform: scale(1.03);
}

.topic-boxes-holder .topic-grandbox.sticker:hover {
    z-index: 3;
}

.topic-box.maestro:hover {
    backface-visibility: unset;
}

.topic-grandbox .topic-box {
    filter: unset;
}

.box.skin-navigator:hover {
    background: linear-gradient(180deg, rgba(0, 0, 0, .1) 0%, rgba(0, 0, 0, .2) 100%) !important;
    transform: unset;
}

.box .logobg {
    top: 0;
    width: 100%;
    height: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: var(--main-border);
    position: relative;
}

.box.skin-navigator {
    height: 300px !important;
    width: 40px;
    position: fixed;
    left: 0;
    margin: unset;
    border-radius: 0 5px 5px 0;
}

.box.skin-navigator .logobg {
    height: 30%;
}

.box.skin-navigator .logobg span {
    font-weight: 600;
    font-size: 16px;
    text-transform: uppercase;
    text-align: center;
}

.box.skin-navigator .content {
    height: 100%;
    justify-content: center;
}

.box.skin-navigator .colors-list {
    height: 100%;
    width: 90%;
    border-radius: 5px;
    display: flex;
    padding: 10px;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    align-items: center;
    justify-content: center;
}

.box.skin-navigator .colors-list-unit:hover,
.section.second .colors-list-unit:hover {
    transform: scale(1.15);
    transition: all .2s ease-in-out;
}

.box.skin-navigator .colors-list-unit:active,
.section.second .colors-list-unit:active {
    filter: brightness(.75);
    transition: all .09s ease-in-out;
}

.colors-list-unit.golden {
    background: radial-gradient(ellipse farthest-corner at right bottom, #FEDB37 0%, #FDB931 8%, #9f7928 30%, #8A6E2F 40%, transparent 80%),
        radial-gradient(ellipse farthest-corner at left top, #FFFFFF 0%, #FFFFAC 8%, #D1B464 25%, #5d4a1f 62.5%, #5d4a1f 100%);
}

.colors-list-unit.silver {
    background: radial-gradient(ellipse farthest-corner at right bottom, #E8E8E8 0%, #D0D0D0 8%, #B8B8B8 30%, #A0A0A0 40%, transparent 80%),
        radial-gradient(ellipse farthest-corner at left top, #FFFFFF 0%, #F2F2F2 8%, #C9C9C9 25%, #777777 62.5%, #777777 100%);
}

.colors-list-unit.white {
    background: radial-gradient(ellipse farthest-corner at right bottom, #FFFFFF 0%, #E6E6E6 8%, #CCCCCC 30%, #B3B3B3 40%, transparent 80%),
        radial-gradient(ellipse farthest-corner at left top, #FFFFFF 0%, #F7F7F7 8%, #DDDDDD 25%, #BBBBBB 62.5%, #BBBBBB 100%);
}

.colors-list-unit.red {
    background: radial-gradient(ellipse farthest-corner at right bottom, #FF5F6D 0%, #E04848 8%, #B03737 30%, #8E2929 40%, transparent 80%),
        radial-gradient(ellipse farthest-corner at left top, #FF7B82 0%, #FF4C4C 8%, #CC3030 25%, #991F1F 62.5%, #991F1F 100%);
}

.colors-list-unit.yellow {
    background: radial-gradient(ellipse farthest-corner at right bottom, #FFE600 0%, #FFD000 8%, #B99A00 30%, #8F7700 40%, transparent 80%),
        radial-gradient(ellipse farthest-corner at left top, #FFF94C 0%, #FFF200 8%, #D4AF00 25%, #A58900 62.5%, #A58900 100%);
}

.colors-list-unit.orange {
    background: radial-gradient(ellipse farthest-corner at right bottom, #FFA726 0%, #FF8800 8%, #CC6D00 30%, #995200 40%, transparent 80%),
        radial-gradient(ellipse farthest-corner at left top, #FFC56C 0%, #FF9600 8%, #E07B00 25%, #B26400 62.5%, #B26400 100%);
}

.colors-list-unit.cyan {
    background: radial-gradient(ellipse farthest-corner at right bottom, #00FFFF 0%, #00D4D4 8%, #00A6A6 30%, #008080 40%, transparent 80%),
        radial-gradient(ellipse farthest-corner at left top, #66FFFF 0%, #00E6E6 8%, #00BFBF 25%, #007D7D 62.5%, #007D7D 100%);
}

.colors-list-unit.purple {
    background: radial-gradient(ellipse farthest-corner at right bottom, #B47DFF 0%, #8A4FFF 8%, #682BCC 30%, #502099 40%, transparent 80%),
        radial-gradient(ellipse farthest-corner at left top, #D3AFFF 0%, #9D6FFF 8%, #7C4FBF 25%, #5D3991 62.5%, #5D3991 100%);
}

.colors-list-unit.pink {
    background: radial-gradient(ellipse farthest-corner at right bottom, #FF99CC 0%, #FF66A3 8%, #CC527D 30%, #993F5E 40%, transparent 80%),
        radial-gradient(ellipse farthest-corner at left top, #FFC2E0 0%, #FF85B3 8%, #D16990 25%, #B25474 62.5%, #B25474 100%);
}

.colors-list-unit.green {
    background: radial-gradient(ellipse farthest-corner at right bottom, #66FF66 0%, #33CC33 8%, #28A128 30%, #207F20 40%, transparent 80%),
        radial-gradient(ellipse farthest-corner at left top, #A6FFA6 0%, #55DD55 8%, #3FB03F 25%, #2F802F 62.5%, #2F802F 100%);
}

.colors-list-unit.blue {
    background: radial-gradient(ellipse farthest-corner at right bottom, #3399FF 0%, #007FFF 8%, #0063CC 30%, #004A99 40%, transparent 80%),
        radial-gradient(ellipse farthest-corner at left top, #66BFFF 0%, #3399FF 8%, #0080FF 25%, #0059BF 62.5%, #0059BF 100%);
}

.colors-list-unit.black {
    background: radial-gradient(ellipse farthest-corner at right bottom, #4D4D4D 0%, #333333 8%, #1A1A1A 30%, #000000 40%, transparent 80%),
        radial-gradient(ellipse farthest-corner at left top, #666666 0%, #4C4C4C 8%, #333333 25%, #1A1A1A 62.5%, #1A1A1A 100%);
}

.colors-list-unit.gray {
    background: radial-gradient(ellipse farthest-corner at right bottom, #CCCCCC 0%, #B3B3B3 8%, #999999 30%, #808080 40%, transparent 80%),
        radial-gradient(ellipse farthest-corner at left top, #E6E6E6 0%, #CCCCCC 8%, #A6A6A6 25%, #8C8C8C 62.5%, #8C8C8C 100%);
}

.colors-list-unit.brown {
    background: radial-gradient(ellipse farthest-corner at right bottom, #836953 0%, #6F5847 8%, #5A4537 30%, #453528 40%, transparent 80%),
        radial-gradient(ellipse farthest-corner at left top, #A98C75 0%, #836953 8%, #6B5240 25%, #523E30 62.5%, #523E30 100%);
}


.box .logobg a {
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.box .logobg a:active img,
.rec-box .logobg a:active img {
    filter: brightness(.5) grayscale(0) !important;
    transition: all .15s ease-in-out;
}

nav img:active,
.category-selector .category:active .category-box-content,
.copyright a img:active {
    filter: brightness(.75);
    transition: all .09s ease-in-out;
}

.box .logobg img {
    width: auto;
    max-width: 250px;
    max-height: 90px;
    height: auto;
    transition: all .2s ease-in-out;
}

.box .logobg a:active img {
    transform: scale(1.05);
}

.box .logobg a img:hover {
    transform: scale(1.05);
}

.box .logobg .best,
.topic-box .best,
.box.crypto-choice .logobg:after {
    top: 0;
    right: 0;
    position: absolute;
    width: auto;
    padding: 0 16px;
    height: 32px;
    background: var(--buttonbg);
    filter: drop-shadow(1px 1px 4px rgb(10 10 10)) blur(0);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 12px;
    transition: all .15s ease-in-out;
    backface-visibility: hidden;
    user-select: none;
    z-index: 2;

    border-radius: 0 var(--main-border) 0 var(--main-border);
}

.topic-box .best {
    top: 4px;
    right: 4px;
    border-radius: 2px var(--main-border) 2px var(--main-border);
}

.box.crypto-choice .logobg:after {
    content: 'Cryptocurrency';
    background: #2066ce;
    filter: unset;
    text-shadow: 1px 1px 3px rgb(100 100 100);
    border-radius: 0 0 0 var(--main-border);
    top: 32px;
}

.lang-ru .box.crypto-choice .logobg:after {
    content: 'Криптовалюта';
}

.bonuses-block {
    top: 0;
    right: 0;
    position: absolute;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    transition: all .15s ease-in-out;
}

.box .logobg .bonuses-block .best {
    top: unset;
    right: unset;
    position: relative;
}

.box .logobg .best::before,
.topic-box .best::before {
    content: '';
    position: absolute;
    top: 0;
    left: -6px;
    transform: skewX(20deg);
    background: inherit !important;
    border-radius: var(--main-border) 0 0 var(--main-border);
    width: 20px;
    height: 100%;
    z-index: -1;
}

/* temp */

.box .logobg .best::before,
.box .logobg .best::before,
.topic-box .best::before {
    content: unset;
}

/* temp */

.box .logobg .route {
    background: rgb(14 14 14);
    color: rgba(255, 255, 255, .3);
    top: unset;
    left: unset;
    right: 3%;
    bottom: -10px;
    border-radius: 0 10px 0 0;
    transform: translateY(50px);
    transition: all .15s .05s ease-in-out, background .15s .05s, color .15s .05s;
    position: absolute;
    width: auto;
    padding: 0 10px 0 3px;
    height: 50px;
    padding-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    text-transform: uppercase;
    user-select: none;
    font-size: 11px;
    z-index: 1;
}

.main-page .box .logobg .route {
    display: none;
}

.box .logobg .route::before {
    content: '';
    position: absolute;
    top: unset;
    bottom: 0;
    left: -10px;
    transform: skewX(-20deg);
    border-radius: 5px 0 0 0;
    right: unset;
    background: rgb(14 14 14);
    transition: background .15s .05s;
    width: 20px;
    height: 100%;
    z-index: -1;
}

.box:hover .logobg .route,
.box:hover .logobg .route::before {
    transform: translateY(0);
    background: rgb(14 14 14);
}

.box:hover .logobg .route::before {
    transform: translateY(0) skewX(-20deg);
}

.sitealternates .box .logobg .route {
    transform: unset;
    transition: all .15s ease-in-out;
    bottom: unset;
    right: unset;
    top: 0;
    right: 0;
    display: none;
}

.sitealternates .box .logobg .route::before {
    transition: all .15s ease-in-out;
    transform: skewX(20deg);
    border-radius: 0 0 0 5px;
}

.box .main-mode {
    content: '';
    position: absolute;
    /* background: var(--main-theme); */
    background: var(--darkygray);
    transition: all .15s ease-in-out;
    border-radius: var(--main-border);
    right: 10px;
    bottom: 20px;
    width: 36px;
    height: 36px;
    cursor: help;
    z-index: 2;
}

.box.main .main-mode {
    bottom: 8px;
}

.main-mode-box {
    position: absolute;
    background: var(--icongradient);
    border-radius: var(--main-border);
    left: 3px;
    right: 3px;
    top: 3px;
    bottom: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
    filter: grayscale(1);
}

.main-mode-icon {
    position: relative;
}

.main-mode-icon::before,
.officon.globe::before {
    margin: 0 auto;
    content: '';
    width: 16px;
    height: 16px;
    display: inline-block;
    background-size: cover;
    transition: all .15s ease-in-out;
    filter: brightness(0) saturate(100%) invert(16%) sepia(69%) saturate(4202%) hue-rotate(339deg) brightness(95%) contrast(90%);
    margin-top: 4px;
    opacity: .3;
}

.officon.globe::before {
    width: 18px;
    height: 18px;
    filter: brightness(0) saturate(100%) invert(16%) sepia(69%) saturate(4202%) hue-rotate(339deg) brightness(95%) contrast(90%);
    margin-top: 2px;
}

.officon.globe:active::before {
    filter: brightness(0) saturate(100%) invert(16%) sepia(69%) saturate(4202%) hue-rotate(339deg) brightness(95%) contrast(90%) !important;
}

.route-semi:hover .officon::before {
    opacity: 1;
}

.boxes-holder .box:hover .main-mode,
.boxes-holder .box:hover .route-semi {
    background: rgb(17 17 17);
}

.boxes-holder .box:hover .logobg:has(div.route) .main-mode {
    bottom: 50px;
}

.boxes-holder.main-page .box:hover .logobg:has(div.route) .main-mode {
    bottom: 10px;
}

.main-mode:hover .main-mode-box,
.box .route-semi:hover {
    filter: grayscale(0);
}

.main-mode:hover .main-mode-icon::before {
    opacity: 1;
}

.main-mode:hover:after,
.box.main .main-mode:hover:after {
    opacity: 1;
    transform: translateY(50%);
}

.main-mode:after {
    font-size: 13px;
    margin-bottom: unset;
    bottom: 50%;
    left: unset;
    right: 45px;
    transform: translateY(50%) translateX(10px);
    width: auto;
    text-wrap: nowrap;
    display: flex;
    justify-content: flex-end;
    transition: all .15s ease-in-out;
}

.box.main .main-mode:after {
    transform: translateY(70%);
    right: 0;
    left: unset;
    bottom: 50px;
    width: unset;
    text-align: end;
    text-wrap: nowrap;
    filter: drop-shadow(0px 0px 1px rgb(22, 22, 22)) drop-shadow(0px 0px 6px var(--darkgray)) drop-shadow(0px 0px 6px var(--darkgray)) drop-shadow(0px 0px 6px var(--darkgray));
}

.main-mode {
    --casino-text: 'Casino';
    --classic-text: 'Classic Games';
    --cases-text: 'Case Opening';
    --betting-text: 'Match Betting';
    --playing-text: 'Play and Earn';
    --trading-text: 'Trading';
    --marketplace-text: 'Marketplace';
    --instant-sell-text: 'Instant Sell';
    --steamlvlup-text: 'Steam Level Up';
    --earning-text: 'Offerwalls';
}

.lang-ru {
    --casino-text: 'Казино';
    --classic-text: 'Классические Игры';
    --cases-text: 'Открытие Кейсов';
    --betting-text: 'Ставки на Матчи';
    --playing-text: 'Заработок на Игре';
    --trading-text: 'Обменник';
    --marketplace-text: 'Торговая Площадка';
    --instant-sell-text: 'Быстрая Продажа';
    --steamlvlup-text: 'Повышение Уровня';
    --earning-text: 'Сайт с Заданиями';
}

.main-mode.casino::after {
    content: var(--casino-text);
}

.main-mode.instant-sell::after {
    content: var(--instant-sell-text);
}

.main-mode.marketplace::after {
    content: var(--marketplace-text);
}

.main-mode.steamlvlup::after {
    content: var(--steamlvlup-text);
}

.main-mode.earning::after {
    content: var(--earning-text);
}

.main-mode.trading::after {
    content: var(--trading-text);
}

.main-mode.classic::after {
    content: var(--classic-text);
}

.main-mode.cases::after {
    content: var(--cases-text);
}

.main-mode.betting::after {
    content: var(--betting-text);
}

.main-mode.playing::after {
    content: var(--playing-text);
}

.box .giveawaysbanner {
    height: 100%;
    width: 100%;
    display: block;
    border-radius: 5px;
    overflow: hidden;
}

.sitepage .box .logobg .best {
    display: none;
}

.box .content {
    position: absolute;
    height: 50%;
    width: calc(100% - 18px);
    margin-bottom: 9px;
    border-radius: var(--main-border);
    background: var(--main-theme);
    background: linear-gradient(-45deg, var(--darkygray), var(--main-theme));
    bottom: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    transition: all .15s ease-in-out;
    align-items: center;
    transform: translateZ(0);
}


.category-selector .category .category-box .category-box-logo,
.singlemod-box,
.topic-box .content {
    transition: background .15s ease-in-out;
    border-radius: var(--main-border);
}

/* .boxes-holder:not(.main-page) .box:hover .content {
    background: rgb(21 21 21);
    transition: all .15s .05s ease-in-out, color .15s 0s, border .15s 0s, background .15s 0s;
} */


.category-selector .category:hover .category-box .category-box-logo::before,
.singlemod-select:hover::before,
.payments-button:hover::before,
.singlemod-box:hover .singlemod-icon:after,
.mirror-redirect:hover .mirror {
    filter: brightness(1.1) !important;
    transition: all .15s ease-in-out;
}

.box .content::before {
    position: absolute;
    content: '';
    height: 100%;
    width: 100%;
    z-index: -1;
    border-radius: var(--main-border);
    transition: all .15s ease-in-out;
    user-select: none;
    pointer-events: none;
    opacity: 0;
    background: linear-gradient(-45deg, transparent 0%, rgb(19, 19, 19) 100%);
}

.box.main .content::before {
    content: unset;
}

.boxes-holder .box:hover .content::before {
    opacity: 1;

}

.boxes-holder .box:hover .rating-case-single,
.boxes-holder .box:hover .rating-case-single::before,
.boxes-holder .box:hover .logobg .route,
.boxes-holder .box:hover .logobg .route::before {
    background: var(--main-theme);
}

.content p,
.content .boxtitle {
    font-weight: 500;
    font-size: 12px;
    margin-top: 13px;
    width: 233px;
    text-align: center;
    text-decoration: none;
}

.nav-review li,
.content p,
.content h4,
.instruction li,
.boxreview .plusminus .criteria .par li,
.nav-review li,
.rec-box p {
    text-wrap: pretty;
}


.content h2,
.content h4,
.content p:first-child,
.content .boxtitle {
    font-weight: 600;
    font-size: 22px;
    margin-top: 15px;
    text-transform: uppercase;
    text-align: center;
}

h4:has(.boxtitle) {
    margin-top: 15px;
    transition: all .15s ease-in-out;
}

.sitealternates .content .boxtitle {
    margin-top: 12px;
}

.content .boxtitle {
    transition: all .15s ease-in-out;
    line-height: 1.2;
    padding: 0 10px;
    width: auto;
}

.boxes-holder .content .boxtitle:hover,
.sitealternates .content .boxtitle:hover,
.rec-box .content .boxtitle:hover {
    color: rgb(188, 188, 188);
}

.content p:nth-child(2) {
    height: 55px;
    user-select: none;
    color: var(--text-lightgray);
}

.content p:nth-child(3) {
    color: var(--text-lightgray);
    font-weight: 600;
    font-size: 11px;
    width: 180px;
    height: 24px;
    text-align: center;
    text-transform: uppercase;
    user-select: none;
    display: flex;
    margin-top: 10px;
    align-items: center;
}

.bonus_info {
    display: none;
    align-items: center;
    height: 74px;
    width: 70%;
    position: relative;
    margin-top: 5px;
}

.content strong,
.rec-box strong {
    color: var(--text-lightgray);
    font-weight: 500;
    background: unset;
}

.content strong.code {
    color: var(--white);
    font-weight: 600;
}

.content span#bonus,
.sitealternates .site-reward p {
    display: block;
    font-weight: 500 !important;
    font-size: 15px;
    color: var(--gray);
    text-align: center;
    height: auto;
    width: 100%;
    z-index: 2;
    line-height: 1.3;
}

.sitealternates .site-reward p {
    margin-top: unset;
    text-transform: none;
    font-size: 14px;
}

.bonus_info::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 110%;
    height: 100%;
    background: var(--darkgray);
    box-shadow: 0 1px 2px 0 rgba(7, 7, 7, .7);
    border-radius: var(--main-border);
    z-index: 1;
}

.box.main .content h4::after {
    content: '';
    height: 2px;
    background: linear-gradient(56deg, rgba(0, 0, 0, 0) 0%, rgba(168, 29, 52, .65) 50%, rgba(0, 0, 0, 0) 100%);
    width: 100%;
    display: block;
    position: absolute;
    bottom: -5px;
}

.box.main .content h4::before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: -12px;
    left: -10px;
    z-index: -1;
    padding: 10px;
    background: radial-gradient(50% 100% at 50% 100%, rgba(172, 26, 50, .2), transparent 100%);
    filter: blur(5px);
}

.box.main .content h4::after,
.box.main .content h4::before {
    content: unset;
}

.boxes-holder .box:hover .content .defbutton {
    filter: drop-shadow(0 1px 4px rgb(15 15 15)) blur(0);
}

.content .defbutton,
.content .defbutton::before,
.content .review-button.mirror-visit::before {
    background: var(--defbuttonbg);
}

.box .content .review-button:not(.visit):hover,
.box .content .review-button:not(.visit):hover::after,
.box .content .review-button.mirror-visit:hover,
.box .content .review-button.mirror-visit:hover::before,
.box .content .defbutton:hover,
.box .content .defbutton:hover::before {
    background: var(--defbuttonbg_hover);
}

.box .content .tg-app:hover,
.box .content .tg-app:hover::before {
    /* background: #1c93e3; */
    background: linear-gradient(180deg, #1c93e3 0%, #1a88d1 100%);
    transition: all .07s ease-in-out;
}

.sitepage .content .defbutton,
.sitepage .content .defbutton::before,
.box.main .content .review-button.mirror-visit,
.box.main .content .review-button.mirror-visit::before {
    background: var(--darkgray);
}

.content .defbutton:hover,
.content .review-button.mirror-visit:hover {
    transform: scale(1.09) !important;
}

.boxes-holder .box:hover .content .defbutton,
.newest-boxes .box:hover .content .defbutton {
    transform: scale(1);
}

.box.main .content button:hover,
.box.main .content button:hover::before,
.box.main .content .review-button.mirror-visit:hover,
.box.main .content .review-button.mirror-visit:hover::before {
    background-color: rgb(22 22 22);
    animation: none;
    filter: unset;
}

.instruction-mirrors li a:active {
    background-color: #5a101c !important;
    border: 2px solid #771324 !important;
    transition: .09s all ease-in-out !important;
}

.content button:active,
.content button:active::before {
    background-color: #5a101c;
    transition: .09s all ease-in-out;
}


.sitepage.closed .plusminus,
.sitepage.closed .smallreview,
.sitepage.closed .instruction,
.sitepage.closed .sitedetails,
.sitepage.closed .box.main .logobg .rating,
.sitepage.closed .box.main .content,
.sitepage.closed h2,
.sitepage.closed h3 {
    display: none;
}

.sitepage.closed .info-block {
    width: 100%;
}

.sitepage.closed .site-attention.blocked {
    /* padding-left: 0; */
    background-color: rgb(15 15 15);
    width: 100%;
    border-radius: var(--main-border);
    margin-top: 0;
}

.sitepage.closed .box.main {
    height: 200px !important;
}

.sitepage.closed .box.main .logobg {
    height: 100%;
}

.sitepage.closed .box.main a {
    pointer-events: none;
}

.box.main .content h4 {
    width: auto;
    position: relative;
    user-select: none;
}

.content .defbutton {
    height: 28px;
    width: 28px;
    right: 12px;
    border-radius: 5px;
    position: absolute;
    top: 12px;
    border: unset;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .15s ease-in-out;
    border-radius: 2px var(--main-border) var(--main-border) 2px;
}

.content .tg-app {
    right: unset;
    border-radius: var(--main-border) 2px 2px var(--main-border);
    /* background: #1c93e3; */
    left: 12px;
}

.content .tg-app.defbutton::before {
    left: unset;
    right: -6px;
    transform: skewX(-20deg);
    border-radius: 0 5px 5px 0;
    /* background: #1c93e3; */
}

.content .tg-app.defbutton::after {
    margin-right: unset;
    margin-left: 4px;
}

.box.main .content .defbutton {
    bottom: unset;
    top: 12px;
    right: 12px;
}

.box.main .content .copy {
    display: none;
}

.newest-boxes .content .defbutton {
    display: none;
}

.content .defbutton::before,
.content .review-button.mirror-visit::before,
.box.main .content .review-button.mirror-visit::before {
    content: '';
    position: absolute;
    width: 20px;
    height: 100%;
    transition: all .15s ease-in-out;
    box-sizing: border-box;
    transform: skewX(20deg);
    z-index: -1;
    left: -6px;
    border-radius: 5px 0 0 5px;
    top: 0;
}

.content .review-button.mirror-visit::before,
.box.main .content .review-button.mirror-visit::before {
    transform: skewX(-20deg);
    border-radius: 0 5px 5px 0;
    left: unset;
    right: -6px;
}

.main-page .content .defbutton::before,
.content .review-button.mirror-visit::before {
    left: unset;
    right: -6px;
    transform: skewX(-20deg);
    border-radius: 0 5px 5px 0;
}

.main-page .box .content .defbutton::after {
    margin-left: 4px;
    margin-right: unset;
}

@keyframes icon-changed {
    0% {
        background-image: url(/img/icons/gamemodes/copy_bold.svg);
        opacity: 1;
    }

    5% {
        background-image: url(/img/icons/gamemodes/copy_bold.svg);
        opacity: 0;
    }

    10% {
        background-image: url(/img/icons/gamemodes/check.svg);
        opacity: 0;
    }

    50% {
        background-image: url(/img/icons/gamemodes/check.svg);
        opacity: 1;
    }

    90% {
        background-image: url(/img/icons/gamemodes/check.svg);
        opacity: 0;
    }

    95% {
        background-image: url(/img/icons/gamemodes/copy_bold.svg);
        opacity: 0;
    }

    100% {
        background-image: url(/img/icons/gamemodes/copy_bold.svg);
        opacity: .35;
    }
}

.icon-changed::after {
    animation: icon-changed .8s ease-in-out;
}

.box button:hover.icon-changed,
.box button:hover.icon-changed::before {
    background-color: rgb(32 32 32) !important;
}

.credits img:hover {
    transform: scale(1.1);
    opacity: 1;
}

.boxreview .slider-container {
    width: 100%;
    margin-top: 9px;
}

footer {
    width: 100%;
    height: 100%;
    margin-top: 50px;
}

footer .centralizer {
    width: 65%;
    margin: 0 auto;
    padding-bottom: 30px;
}

footer .centralizer .footer-content {
    display: flex;
    align-items: center;
    position: relative;
    height: 60px;
}

.copyright {
    width: 100px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    transition: all .15s ease-in-out;
}

.contact {
    width: auto;
    text-align: end;
    display: flex;
    justify-content: flex-end;
    margin-left: auto;
}

.contact-box {
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    transition: all .15s ease-in-out;
}

.contact-content {
    text-align: end;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.contact-box span {
    padding: 0 5px;
}

.copyright,
.contact-box {
    font-size: 13px;
    font-weight: 400;

    /* font-size: 11px;
    font-weight: 500;
    text-transform: uppercase; */
}

.credits {
    width: 100px;
    height: auto;
    text-transform: uppercase;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 18px;
}

.credits img {
    opacity: .25;
    height: auto;
    max-height: 40px;
    width: 100%;
    transition: all .15s ease-in-out;
}

.copyright #logo {
    justify-content: flex-start;
}

.copyright #logo:hover {
    transform: unset;
}

.copyright:hover {
    transform: scale(1.05);
}

.copyright img {
    height: auto;
    width: 130px;
    transition: all .15s ease-in-out;
    opacity: .25;
    filter: grayscale(1) brightness(5);
}

.copyright span {
    font-size: 11px;
    text-align: center;
    user-select: none;
}

.copyright:hover img {
    filter: grayscale(0);
    opacity: 1;
}

.copyright:hover span,
.contact-box:hover span {
    color: var(--white);
}


.newest-boxes-title {
    width: auto;
    height: auto;
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    display: flex;
    justify-content: flex-start;
    position: absolute;
    transition: all .15s ease-in-out;
    user-select: none;
    z-index: 10;
    left: 0;
    bottom: 0;
}

.newest-boxes-title-box {
    text-align: start;
    width: auto;
    padding: 10px;
    text-transform: uppercase;
    font-size: 12px;
    background-color: var(--darkgray);
    border-radius: var(--main-border) 0 10px 10px;
    z-index: 3;
    display: flex;
    align-items: center;
    transition: all .1s ease-in-out;
    text-wrap: nowrap;
    user-select: none;
    position: relative;
}

.newest-boxes:hover .newest-boxes-title-box span {
    color: var(--white);
}

.newest-boxes-title-box span {
    color: var(--text-darkgray);
    transition: all .1s ease-in-out;
}

.newest-boxes-title-box::after,
.newest-boxes-title-box::before {
    content: '';
    position: absolute;
    width: 20px;
    height: 100%;
    background-color: inherit;
    transition: all .15s ease-in-out;
    box-sizing: border-box;
    transform: skewX(-20deg);
    z-index: -1;
    right: -10px;
    border-radius: 0 5px 5px 0;
    top: 0;
}

.newest-boxes-title-box::before {
    content: unset;
    right: unset;
    left: -10px;
}

.newest-boxes {
    width: 1050px;
    height: auto;
    padding: 8px;
    display: flex;
    justify-content: center;
    border-radius: var(--main-border) 10px 10px 0;
    flex-wrap: wrap;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    align-content: flex-start;
    gap: 18px;
    margin-top: 10px;
    padding-bottom: 53px;
}

.blog .newest-boxes {
    padding: 8px;
}

.newest-boxes.topic {
    left: 145px;
    transform: scale(.88);
    margin-top: -10px;
}

.newest-boxes .box {
    height: 100px;
    width: 240px;
    min-width: unset;
    background: var(--darkgray);
    filter: unset;
}

.content-buttons {
    display: flex;
    margin-top: 6px;
}

.sitealternatesboxes .content-buttons {
    margin-top: 2px;
}

.box.main .content-buttons {
    margin-top: 9px;
    order: 1;
}

.content .review-button {
    background: var(--defbuttonbg);
    filter: drop-shadow(0 1px 4px rgb(10 10 10)) blur(0);
    border-radius: var(--main-border);
    position: relative;
    height: 32px;
    width: auto;
    padding: 0 8px;
    padding-left: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10000;
    margin: 4px 8px;
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    text-decoration: none;
    transition: all .15s ease-in-out;
    cursor: pointer;
}

.rec-box .content .review-button {
    height: 30px;
}

.boxes-holder .box:hover .content .review-button {
    filter: drop-shadow(0 1px 4px rgb(15 15 15)) blur(0);
}

.content .review-button.visit {
    background-color: var(--main-color);
    filter: drop-shadow(0 0 1px var(--main-color));
    background: var(--buttonbg);
    padding-left: 6px;
    padding-right: 14px;
    border-radius: var(--main-border) var(--main-border) var(--main-border) 0;
}

.content .review-button {
    backface-visibility: hidden;
    border-radius: var(--main-border) 0 var(--main-border) var(--main-border);
}

.content .review-button::after,
.content .review-button::before {
    content: '';
    position: absolute;
    transform: skewX(-20deg);
    width: 20px;
    height: 100%;
    z-index: -1;
    transition: all .15s ease-in-out;
    background: var(--defbuttonbg);
    text-wrap: nowrap;
    box-sizing: border-box;
    top: 0;
}

.sitepage .content .review-button:first-child,
.sitepage .content .review-button:first-child::after,
.sitepage .content .review-button:first-child::before {
    background-color: rgb(18 18 18);
}

.sitepage .content .review-button:hover:first-child,
.sitepage .content .review-button:hover:first-child::after,
.sitepage .content .review-button:hover:first-child::before,
.sitepage.topic .content .review-button:first-child,
.sitepage.topic .content .review-button:first-child::after,
.sitepage.topic .content .review-button:first-child::before {
    background-color: rgb(22 22 22);
}

.content .review-button.visit::after,
.content .review-button.visit::before {
    background-color: var(--main-color);
    background: var(--buttonbg);
}

.review-button {
    --read-more-text: 'Read More';
    --visit-text: 'Visit';
    --simillar-text: 'Simillar';
}

.lang-ru .review-button {
    --read-more-text: 'Подробнее';
    --visit-text: 'Перейти';
    --simillar-text: 'Похожие';
}

.lang-es .review-button {
    --read-more-text: 'Leer más';
    --visit-text: 'Visitar';
    --simillar-text: 'Similares';
}

.lang-pt .review-button {
    --read-more-text: 'Ler mais';
    --visit-text: 'Visitar';
    --simillar-text: 'Semelhantes';
}

.lang-tr .review-button {
    --read-more-text: 'Daha fazla oku';
    --visit-text: 'Ziyaret Et';
    --simillar-text: 'Benzer';
}

.lang-hi .review-button {
    --read-more-text: 'और पढ़ें';
    --visit-text: 'दौरा करें';
    --simillar-text: 'समान';
}


.content .review-button::before {
    content: var(--read-more-text);
    background: unset;
    position: relative;
    transform: unset;
    width: auto;
    height: auto;
    z-index: 1;
}

.box.main .content .review-button::before {
    content: var(--simillar-text);
}

.content .review-button:first-child:after {
    right: -5px;
    border-radius: 0 5px 5px 0;
}

.content .review-button.visit::before,
.box.main .content .review-button.visit::before {
    content: '';
    left: -5px;
    position: absolute;
    transform: skewX(-20deg);
    width: 20px;
    height: 100%;
    z-index: -1;
    border-radius: 5px 0 0 5px;
}

.content .review-button.visit::after {
    content: var(--visit-text);
    background-color: unset;
    background: unset;
    position: relative;
    transform: unset;
    width: auto;
    height: auto;
    z-index: 1;
}

.content .review-button.mirror-visit {
    height: 28px;
    width: 28px;
    margin: 4px 0px;
    position: absolute;
    background: var(--defbuttonbg);
    border-radius: var(--main-border) 2px 2px var(--main-border);
    filter: none;
    left: 12px;
    top: 12px;
    margin: 0;
}

.box.main .content .review-button.mirror-visit {
    display: none;
}

.boxes-holder:not(.main-page) .box .content:has(.review-button.mirror-visit) .tg-app {
    top: -36px;
}

.boxes-holder:not(.main-page) .box:hover .content:has(.review-button.mirror-visit) .tg-app {
    top: -66px;
}

.boxes-holder:not(.main-page) .box .content:has(.review-button.mirror-visit) .tg-app.defbutton::before {
    transform: skewX(20deg);
    border-radius: 0 5px 5px 0;
}

.main-page .content .review-button.mirror-visit {
    right: 15px;
    backface-visibility: unset;
}

.main-page .content .review-button.mirror-visit {
    left: -1px;
    top: 32px;
}

.box .content .review-button.mirror,
.boxes-holder .box:hover .content .review-button.mirror {
    filter: drop-shadow(0 1px 4px rgb(15 15 15)) blur(0);
}

.content .review-button.mirror-visit::after {
    content: url('/img/icons/gamemodes/mirror.svg');
    height: 15px;
    width: 15px;
    opacity: .35;
    position: absolute;
    top: unset;
    left: 10px;
    transform: none;
}

@media screen and (max-width: 1900px) {
    .content .review-button.mirror-visit {
        display: none;
    }
}

.content .review-button:hover {
    transform: scale(1.05);
}

.content .review-button:active,
.content .defbutton:active {
    filter: brightness(.75) drop-shadow(0 1px 4px rgb(15 15 15)) blur(0);
    transition: all .09s ease-in-out;
}

.newest-boxes .box .content {
    position: absolute;
    opacity: 0;
    transition: opacity .15s ease-in-out;
    user-select: none;
    background: unset;
    justify-content: center;
    margin-bottom: unset;
    flex-direction: row;
    z-index: 10;
}

.newest-boxes .box .logobg {
    position: relative;
    background: unset;
    overflow: unset;
    height: 100%;
}

.newest-boxes .box .logobg img {
    margin-top: unset;
    transition: all .15s ease-in-out;
    max-width: 85%;
    max-height: 55%;
}

.newest-boxes .box .best {
    top: -8px;
    right: -8px;
    z-index: 11;
}

.newest-boxes .box:hover .logobg img {
    opacity: .2;
}

.newest-boxes .box:hover .logobg img {
    filter: blur(8px) !important;
    transform: scale(.95);
}

.newest-boxes .box:hover .content {
    opacity: 1;
}

.newest-boxes .box .logobg,
.newest-boxes .box .content {
    height: 100%;
    width: 100%;
}

.mods-box {
    width: auto;
    height: auto;
    position: fixed;
    transition: opacity .15s ease-in-out;
    left: 261px;
    top: 174px;
    z-index: 2;
}

.mods-main-box {
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 9px;
}

.singlemod-box {
    width: 50px;
    height: 50px;
    background-color: var(--darkgray);
    transition: all .15s ease-in-out;
    border-radius: var(--main-border);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
    flex-grow: 1;
    position: relative;
    z-index: 1;
}

.singlemod-box[data-title]:after {
    content: attr(data-title);
    position: absolute;
    display: flex;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    opacity: 0;
    bottom: 50%;
    transform: translateY(50%) translateX(10%);
    padding: 12px 18px;
    background: var(--darkgray);
    border-radius: var(--main-border);
    transition: all .15s ease-in-out;
    top: unset;
    left: unset;
    right: 60px;
    width: auto;
    text-wrap: nowrap;
}

.more-content .more-content-list .singlemod-box[data-title]:after {
    bottom: -50%;
    left: 50%;
    right: unset;
    transform: translateX(-50%) translateY(30%);
    margin-top: 0px;
}

.more-content .more-content-list .singlemod-box:first-child[data-title]:after {
    transform: translateY(50%) translateX(10%);
    bottom: 50%;
    left: unset;
    right: 60px;
}

.more-content .more-content-list .singlemod-box:last-child[data-title]:after {
    transform: translateY(50%) translateX(-10%);
    bottom: 50%;
    right: unset;
    left: 60px;
}

.singlemod-box[data-title]:hover:after {
    opacity: 1;
    transform: translateY(50%) !important;
}

.more-content .more-content-list  .singlemod-box.active {
    user-select: none;
    pointer-events: none;
}

.more-content .more-content-list  .singlemod-box.active[data-title]:hover:after {
    display: none;
}

.more-content .more-content-list .singlemod-box[data-title]:not(:last-child):not(:first-child):hover:after {
    opacity: 1;
    transform: translateX(-50%) translateY(50%) !important;
}

.singlemod-box:hover,
.payments-button:hover {
    transform: scale(1.1);
}

.singlemod-box.active .singlemod-select img {
    filter: grayscale(0);
}

.singlemod-box.active {
    transform: scale(1.1);
}

.mods-box.skins-box .singlemod-box:hover {
    transform: scale(1.04);
}

.mods-box.skins-box .singlemod-box.active {
    transform: unset;
}

.mods-box.skins-box {
    position: relative;
    left: unset;
    top: unset;
    width: 100%;
    height: auto;
    min-height: 45px;
    z-index: 1;
    margin: -3px 0;
}

.main-page .mods-box:not(.skins-box) {
    display: none;
}

.main-page .skins-box {
    margin: -3px 8px;
}

.singlemod-box:hover span,
.singlemod-box.active span {
    color: var(--white);
    opacity: 1;
}

.mods-box.skins-box .mods-main-box {
    flex-direction: row;
    height: auto;
    gap: 12px;
}

.mods-box.skins-box .singlemod-box {
    height: 45px;
    width: 20%;
}

.singlemod-select span {
    width: auto;
    padding: 0 10px;
    text-transform: uppercase;
    font-size: 14px;
    color: var(--text-darkgray);
    font-weight: 600;
    transition: all .15s ease-in-out;
    text-wrap: nowrap;
    z-index: 1;
}

.mods-box.topic .singlemod-select img {
    width: 50%;
}

.mods-box:has(.back-button) {
    top: 18px;
    left: 260px;
}

.siteleftpannel .mods-box:has(.back-button) {
    left: unset;
    margin-left: -69px;
    position: fixed;
    top: 18px;
}

.nondef:has(.topic-craft) .siteleftpannel .mods-box:has(.back-button) {
    margin-left: -79px;
}

.singlemod-select {
    cursor: pointer;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    transition: all .15s ease-in-out;
    height: 100%;
    width: 100%;
    z-index: 1;
}

.singlemod-select:hover img,
.singlemod-select:hover i,
.payments-button:hover::after {
    transform: scale(1.05);
    filter: grayscale(0);
}

.singlemod-select img {
    filter: grayscale(1) brightness(.82) drop-shadow(0 0 6px rgb(8 8 8));
    transition: all .15s ease-in-out;
    width: 50%;
    height: auto;
}

.singlemod-select::before,
.pagination-button::before,
.search-container::before,
.payments-button::before {
    content: '';
    position: absolute;
    top: 4px;
    bottom: 4px;
    left: 4px;
    right: 4px;
    border-radius: var(--main-border);
    z-index: -1;
}

.singlemod-select::before,
.search-container::before,
.category-selector .category-box .category-box-logo::before,
.pagination-button::before,
.payments-button::before {
    background: var(--icongradient);
    transition: all .15s ease-in-out;
}

.mods-box.skins-box .singlemod-select::before {
    background: var(--icongradient);
}

.category-selector .category-box.active .category-box-logo::before,
.singlemod-box.active .singlemod-select::before {
    background: linear-gradient(-45deg, var(--darkgray) 0%, rgba(43, 0, 16, .85) 100%);
    transition: all .15s ease-in-out;
}

.mods-box.skins-box .singlemod-box.active .singlemod-select::before {
    background: linear-gradient(-45deg, var(--darkgray) 0%, rgba(20, 20, 20, .5) 100%);
    transition: all .15s ease-in-out;
}

.singlemod-select i {
    transition: all .15s ease-in-out;
    filter: grayscale(1);
    font-weight: 600;
    font-size: 22px;
}

.singlemod-box:hover .singlemod-icon::before,
.singlemod-box.active .singlemod-icon::before,
.boxes-holder-name a:hover .officon::before {
    filter: brightness(0) saturate(100%) invert(16%) sepia(69%) saturate(4202%) hue-rotate(339deg) brightness(95%) contrast(90%);
    opacity: 1;
}

.skins-box .singlemod-select {
    justify-content: flex-start;
}

.mods-box.skins-box .singlemod-select::before {
    content: unset;
}

.mods-box.skins-box .singlemod-box {
    width: auto;
}

.singlemod-select span {
    margin: 0 5px;
}

.singlemod-icon {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: var(--main-border);
    margin-left: 4px;
    height: 35px;
    width: 35px;
    transition: all .15s ease-in-out;
    z-index: 1;
}

.singlemod-icon::after {
    content: '';
    position: absolute;
    height: 100%;
    width: 100%;
    border-radius: inherit;
    z-index: -1;
    background: var(--icongradient);
    transition: all .15s ease-in-out;
}

.boxes-holder-name .singlemod-icon::after {
    content: unset;
}

.singlemod-box.active .singlemod-icon::after {
    background: linear-gradient(-45deg, var(--darkgray) 0%, rgba(43, 0, 16, .85) 100%);
}

.singlemod-icon::before {
    height: 100%;
    width: 100%;
    display: flex;
    font-size: 18px;
    align-items: center;
    justify-content: center;
    background-size: 55%;
    filter: drop-shadow(0 0 3px black) grayscale(1);
    transition: filter .15s ease-in-out !important;
    background-position: center;
    background-repeat: no-repeat;
    opacity: .2;
}

.singlemod-icon::before {
    content: '';
}

.topic-nav-box {
    background: rgb(14 14 14);
    position: relative;
    width: 100%;
    top: 0;
    height: 50px;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
    transition: all .2s ease-in-out;
    display: none;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    cursor: pointer;
}

.topic-nav-box::before {
    content: 'Change Items';
    z-index: 1;
    position: relative;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
}

.lang-ru .topic-nav-box::before {
    content: 'Сменить Предмет';
}

.topic-nav-selector {
    position: fixed;
    width: 100%;
    background-color: rgba(0, 0, 0, .8);
    z-index: 1000;
    backdrop-filter: blur(3px);
    height: 0%;
    opacity: 0;
    visibility: hidden;
    top: 78px;
    transition: none;
}

.topic-nav-selector.active {
    height: 100%;
    visibility: visible;
    transform: unset;
    opacity: 1;
    transition: all .15s ease-in-out;
}

.topicpage:has(.topic-nav-selector.active) {
    z-index: 12;
}

.topic-nav-menu {
    position: absolute;
    width: 90%;
    height: 80%;
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    align-items: flex-start;
    margin: 0 auto;
    overflow-y: auto;
    overflow-x: hidden;
    left: 0;
    right: 0;
    top: 15px;
}

.topic-nav-menu .weapon-current {
    justify-content: flex-start;
    padding: 0 12px;
}

.topic-nav-menu .weapon-current:hover {
    background-color: unset;
    transition: background-color .15s ease-in-out;
}

.topic-nav-menu .weapon-current i {
    position: absolute;
    right: 10px;
    transition: all .1s ease-in-out;
}

.weapon-container.active i {
    transform: rotate(180deg);
}

.topic-nav-menu .weapon-container:hover {
    background-color: rgb(16 16 16);
    transition: background-color .15s ease-in-out;
}

.topic-nav-menu .weapon-container {
    width: 100%;
    height: 40px;
    margin: 2px 0;
    background-color: var(--darkgray);
    border-radius: 5px;
    transition: all .15s ease-in-out;
}

.topic-nav-menu .weapon-container.active {
    z-index: 2;
}

.topic-nav-menu .weapon-container .weapon-selection {
    width: 100%;
    height: auto;
    left: 0;
    padding-left: 0;
    padding-top: 0;
    max-height: unset;
    overflow-y: unset;
    overflow-x: unset;
    scroll-snap-type: unset;
    scroll-snap-align: unset;
    position: relative;
    opacity: 0;
    visibility: hidden;
    margin-top: 6px;
}

.topic-nav-menu .weapon-container.active .weapon-selection {
    opacity: 1 !important;
    visibility: visible !important;
    max-width: unset;
    position: absolute;
    margin-top: 40px;
    display: block;
}

.topic-nav-menu .weapon-selection-unite {
    height: 40px;
    scroll-snap-align: unset;
    margin: 2px 0;
    z-index: 100;
    position: relative;
}

.topic-nav-menu .weapon-selection::-webkit-scrollbar,
.topic-nav-selector::-webkit-scrollbar {
    width: 0;
}

.topic-nav-menu .weapon-selection-unite a {
    text-decoration: none;
    justify-content: flex-start;
}

.topic-nav-menu span {
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 500;
}

.topic-nav-close {
    background-color: var(--darkgray);
    height: 40px;
    width: 30%;
    margin: 0 auto;
    margin-top: 15px;
    border-radius: 5px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

.topic-nav-close::after {
    content: 'Close';
    position: relative;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 13px;
    z-index: 1;
}

input {
    position: absolute;
    opacity: 0;
    margin-top: 0px;
    margin-left: 5px;
    cursor: pointer;
}

.scrolling a.category-box {
    pointer-events: none;
}

.screens button,
.slider-container button {
    content: '';
    position: absolute;
    background-color: transparent;
    border: none;
    height: 60%;
    width: auto;
    z-index: 20;
    font-size: 32px;
    cursor: pointer;
    transition: all .15s ease-in-out;
}

.screens button {
    transition: all .15s ease-in-out, opacity .5s;
}

.screens .prev-button {
    transform: translateX(-50px);
    opacity: 0;
}

.screens .next-button {
    transform: translateX(50px);
    opacity: 0;
}

.screens:hover .next-button,
.screens:hover .prev-button {
    transform: translateX(0);
    opacity: 1;
}

.screens button i,
.slider-container button i {
    transition: all .15s ease-in-out;
    filter: drop-shadow(0px 0px 3px rgb(22, 22, 22));
    opacity: .1;
}

.screens button:hover i,
.slider-container button:hover i {
    opacity: 1;
}

.prev-button {
    left: 0;
    bottom: 0;
    top: 0;
    position: absolute;
    margin: auto 0;
    z-index: 1;
}

.next-button {
    right: 0;
    bottom: 0;
    top: 0;
    position: absolute;
    margin: auto 0;
    z-index: 1;
}

input+label:hover::after {
    background-size: 45px 45px;
}

input:checked+label::after {
    background-image: none;
    left: 0;
    z-index: 10;
}

input:checked+label+.slide~input+label::after {
    display: none;
}

input:checked+label+.slide+input+label::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='16' style='fill:white'%3E%3Cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z' /%3E%3C/svg%3E");
    display: block;
    width: 80px;
    right: 0;
    left: auto;
}

.slide {
    background-position: center;
    background-size: 100%;
    background-repeat: no-repeat;
    height: 100%;
}

.settings-menu,
#back-to-top-btn {
    font-size: 24px;
    width: 40px;
    height: 40px;
    background-color: var(--darkgray);
    cursor: pointer;
    outline: none;
    border: 0px solid transparent;
    transition: .2s all ease-in-out;
    border-radius: var(--main-border);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
}

#back-to-top-btn {
    height: 0;
    overflow: hidden;
}

#back-to-top-btn.btnEntrance {
    margin-top: 10px;
}

.settings-menu {
    transition: all .15s ease-in-out;
}

.buttons-container-page {
    width: 40px;
    height: auto;
    display: flex;
    position: fixed;
    bottom: 20px;
    right: 20px;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-end;
    transition: all .2s ease-in-out;
    z-index: 11112;
}

.settings-button {
    width: 100%;
    height: 100%;
    font-size: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
    cursor: pointer;
    transition: .2s all ease-in-out;
    border-radius: 5px;
    position: relative;
}

#globe-icon::before {
    height: 20px;
    width: 20px;
}

#back-to-top-btn::before {
    height: 28px;
    width: 28px;
}

#back-to-top-btn.btnEntrance,
.settings-menu {
    border-radius: var(--main-border);
    height: 40px;
}

#back-to-top-btn.btnExit {
    height: 0;
}


.settings-button:hover {
    opacity: 1;
}

a[data-title]:after,
#button-route-filter[data-title]:after {
    content: '';
    opacity: 0;
    width: 150px;
    height: 10px;
    border-radius: 3px;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 12px;
    transition: opacity .15s ease-in-out;
    filter: drop-shadow(0px 0px 3px rgb(22, 22, 22));
    white-space: nowrap;
    pointer-events: none;
    position: absolute;
    top: -70%;
    left: -60px;
    display: flex;
    justify-content: center;
    user-select: none;
}

#button-route-filter[data-title]:after {
    content: attr(data-title);
    top: unset;
    width: auto;
    font-size: 11px;
    font-weight: 500;
    transition: all .15s ease-in-out;
    align-items: center;
    top: 50%;
    transform: translateY(-50%) translateX(5%);
    border-radius: var(--main-border);
    left: unset;
    right: 55px;
}

#button-route-filter[data-title]:hover:after {
    transform: translateY(-50%);
    opacity: 1;
}

[data-title]:hover:after {
    content: attr(data-title);
    opacity: 1;
}

.features .featuresbox .typesinside a {
    height: 32px;
    text-align: center;
    text-decoration: none;
    display: flex;
    align-items: center;
    padding: 2px 10px;
    font-weight: 600;
    font-size: 14px;
    position: relative;
    box-sizing: border-box;
    border-radius: var(--main-border);
    z-index: 1;
}

.typesinside i::before {
    height: 16px;
    width: 16px;
}

.features .featuresbox .typesinside a:first-child::before,
.skin-color-info .skin-color:first-child:before {
    content: unset;
}
.skin-color-info .skin-color::after,
.skin-color-info .skin-color::before {
    content: '';
    position: absolute;
    width: 20px;
    height: 100%;
    box-sizing: border-box;
    transform: skewX(-20deg);
    border-radius: 5px;
    top: 0;
}

.skin-color-info .skin-color::after,
.skin-color-info .skin-color::before {
    background: inherit;
}

.skin-color-info .skin-color::before {
    left: -9px;
}

.skin-color-info .skin-color::after {
    right: -9px;
}

.features .featuresbox .typesinside a:last-child::after,
.skin-color-info .skin-color:not(:first-child):last-child:after {
    transform: none;
}

.gamemodes .featuresbox .typesinside a::before {
    content: '';
    height: 18px;
    width: 18px;
    filter: drop-shadow(0 0 3px black);
    transition: filter .15s ease-in-out;
    border-radius: unset;
}

.sitedetails .methodlist a::before {
    content: '';
}

/* Gamemodes Images List Start */

.typesinside .cs2::before,
.main-mode.betting .main-mode-icon::before,
.boxes-holder-modes.esports .officon::before {
    background-image: url(/img/icons/gamemodes/esports.webp);
}

.typesinside .sport::before {
    background-image: url(/img/icons/gamemodes/realsport.webp);
}

.typesinside .slots::before,
.main-mode.casino .main-mode-icon::before,
.boxes-holder-modes.slots .officon::before {
    background-image: url(/img/icons/gamemodes/slots.webp);
}

.typesinside .slotsduels::before {
    background-image: url(/img/icons/gamemodes/slotsduels.webp);
}

.typesinside .livedealer::before {
    background-image: url(/img/icons/gamemodes/livedealer.webp);
}

.typesinside .poker::before {
    background-image: url(/img/icons/gamemodes/poker.webp);
}

.typesinside .blackjack::before {
    background-image: url(/img/icons/gamemodes/blackjack.webp);
}

.typesinside .baccarat::before {
    background-image: url(/img/icons/gamemodes/baccarat.webp);
}

.typesinside .wheel::before {
    background-image: url(/img/icons/gamemodes/wheel.webp);
}

.typesinside .roulette::before,
.main-mode.classic .main-mode-icon::before,
.boxes-holder-modes.roulette .officon::before {
    background-image: url(/img/icons/gamemodes/roulette.webp);
}

.typesinside .jackpot::before,
.boxes-holder-modes.jackpot .officon::before {
    background-image: url(/img/icons/gamemodes/jackpot.webp);
}

.typesinside .crash::before,
.boxes-holder-modes.crash .officon::before {
    background-image: url(/img/icons/gamemodes/crash.webp);
}

.typesinside .coinflip::before,
.boxes-holder-modes.coinflip .officon::before {
    background-image: url(/img/icons/gamemodes/coinflip.webp);
}

.typesinside .cases::before,
.main-mode.cases .main-mode-icon::before,
.boxes-holder-modes.cases .officon::before {
    background-image: url(/img/icons/gamemodes/cases.webp);
}

.typesinside .casebattles::before,
.boxes-holder-modes.casebattles .officon::before {
    background-image: url(/img/icons/gamemodes/casebattles.webp);
}

.typesinside .upgrader::before {
    background-image: url(/img/icons/gamemodes/upgrader.webp);
    transform: scale(.9);
}

.typesinside .duels::before {
    background-image: url(/img/icons/gamemodes/duels.webp);
}

.typesinside .plinko::before {
    background-image: url(/img/icons/gamemodes/plinko.webp);
}

.typesinside .dice::before {
    background-image: url(/img/icons/gamemodes/dice.webp);
}

.officon.dailyrewards::before {
    background-image: url(/img/icons/gamemodes/daily-calendar.svg);
}

.officon.rakeback::before {
    background-image: url(/img/icons/gamemodes/refund-alt.svg);
}

.sell-bonus .bonus-type i::before,
.trade-bonus .bonus-type i::before,
.officon.sell-bonus::before {
    background-image: url(/img/icons/gamemodes/badge-percent.svg);
}

.officon.faucet::before {
    background-image: url(/img/icons/gamemodes/faucet.svg);
}

.officon.rain::before {
    background-image: url(/img/icons/gamemodes/raindrops.svg);
}

.deposit-bonus .bonus-type i::before,
.officon.depositbonuses::before {
    background-image: url(/img/icons/gamemodes/plus-hexagon.svg);
}

.officon.giveaways::before {
    background-image: url(/img/icons/gamemodes/hand-present.svg);
}

.officon.globe::before {
    background-image: url(/img/icons/gamemodes/globe.svg);
}

.officon.cake::before {
    background-image: url(/img/icons/gamemodes/party-horn.svg);
    height: 18px;
    width: 18px;
    opacity: 1;
}

.typesinside .towers::before {
    background-image: url(/img/icons/gamemodes/towers.svg);
}

.typesinside .mines::before {
    background-image: url(/img/icons/gamemodes/mines.webp);
}

.typesinside .hilo::before {
    background-image: url(/img/icons/gamemodes/hilo.webp);
}

.typesinside .mining::before,
.main-mode.mining .main-mode-icon::before {
    background-image: url(/img/icons/gamemodes/mining.webp);
}

.typesinside .offerwalls::before,
.main-mode.earning .main-mode-icon::before,
.officon.earning::before {
    background-image: url(/img/icons/gamemodes/earning.webp);
}

.officon.fire::before {
    background-image: url(/img/icons/gamemodes/fire.svg);
}

.officon.wiki::before {
    background-image: url(/img/icons/gamemodes/wiki.webp);
}

.menu-nav-item .officon.earning::before {
    background-image: url(/img/icons/main-modes/earning.png);
}

.officon.newest::before {
    background-image: url(/img/icons/gamemodes/newest.webp);
}

.typesinside .playing::before,
.main-mode.playing .main-mode-icon::before {
    background-image: url(/img/icons/gamemodes/playing.webp);
}

.typesinside .trade-skins::before,
.main-mode.trading .main-mode-icon::before,
.officon.trade-skins::before {
    background-image: url(/img/icons/gamemodes/exchanger.webp);
}

.typesinside .buy-skins::before,
.officon.buy-skins::before {
    background-image: url(/img/icons/gamemodes/cart-buy.svg);
}

.officon.stickers::before {
    background-image: url(/img/icons/gamemodes/stickers.svg);
    height: 20px;
    width: 20px;
}

.officon.ak47::before {
    background-image: url(/img/icons/gamemodes/ak47.svg);
}

.officon.cs2::before {
    background-image: url(/img/icons/main-modes/cs2-logo.png);
}

.officon.rust::before {
    background-image: url(/img/icons/main-modes/rust-logo.png);
}

.officon.crypto::before {
    background-image: url(/img/icons/main-modes/crypto-logo.png);
}

.officon.steam::before {
    background-image: url(/img/icons/main-modes/steam.png);
}

.main-mode.instant-sell .main-mode-icon::before,
.officon.instant-sell::before,
.typesinside .instant-sell::before {
    background-image: url(/img/icons/gamemodes/cart-fast.svg);
}

.typesinside .sell-skins::before,
.officon.sell-skins::before {
    background-image: url(/img/icons/gamemodes/selling.svg);
}

.typesinside .marketplace::before,
.main-mode.marketplace .main-mode-icon::before,
.officon.marketplaces::before {
    background-image: url(/img/icons/gamemodes/marketplace.svg);
}

.else-bonus .bonus-type i::before,
.welcome-bonus .bonus-type i::before,
.gamemodes .typesinside .giveaways::before,
.officon.signupbonus::before {
    background-image: url(/img/icons/gamemodes/gift.svg);
}

.main-page .best::after,
.newest-boxes .best::after {
    background-image: url(/img/icons/gamemodes/freebies.webp);
}

.typesinside .steamlvlup::before,
.main-mode.steamlvlup .main-mode-icon::before {
    background-image: url(/img/icons/gamemodes/steamlvlup.webp);
}

.typesinside .steamtopup::before,
.main-mode.steamtopup .main-mode-icon::before {
    background-image: url(/img/icons/gamemodes/steamtopup.webp);
    width: 18px;
    height: 18px;
}

.typesinside .rental::before {
    background-image: url(/img/icons/gamemodes/rental.webp);
}

.typesinside .buy-games::before,
.methodlist .games::before {
    background-image: url(/img/icons/gamemodes/games.webp);
}

/* Gamemodes Images List End */

/* Payment Methods Start */

.methodlist .cs2::before {
    background-image: url(/img/icons/payments/cs2.webp);
    transform: scale(.9);
}

.methodlist .dota::before {
    background-image: url(/img/icons/payments/dota.webp);
    transform: scale(.9);
}

.methodlist .rust::before {
    background-image: url(/img/icons/payments/rust.webp);
    transform: scale(.9);
}

.methodlist .tf2::before {
    background-image: url(/img/icons/payments/tf2.webp);
}

.methodlist .visa::before {
    background-image: url(/img/icons/payments/visa.webp);
}

.methodlist .mastercard::before {
    background-image: url(/img/icons/payments/mastercard.webp);
}

.methodlist .paypal::before {
    background-image: url(/img/icons/payments/paypal.webp);
}

.methodlist .paysafe::before {
    background-image: url(/img/icons/payments/paysafe.webp);
    transform: scale(.9);
}

.methodlist .skrill::before {
    background-image: url(/img/icons/payments/skrill.webp);
}

.methodlist .qiwi::before {
    background-image: url(/img/icons/payments/qiwi.webp);
}

.methodlist .piastrix::before {
    background-image: url(/img/icons/payments/piastrix.webp);
}

.methodlist .webmoney::before {
    background-image: url(/img/icons/payments/webmoney.webp);
}

.methodlist .yumoney::before {
    background-image: url(/img/icons/payments/yumoney.webp);
}

.methodlist .bank-transfer::before {
    background-image: url(/img/icons/payments/bank-transfer.webp);
}

.methodlist .sbp::before {
    background-image: url(/img/icons/payments/sbp.webp);
}

.methodlist .fkwallet::before {
    background-image: url(/img/icons/payments/fkwallet.webp);
    transform: scale(.8);
}

.methodlist .gpay::before {
    background-image: url(/img/icons/payments/gpay.webp);
}

.methodlist .h1z1::before {
    background-image: url(/img/icons/payments/h1z1.webp);
}

.methodlist .apay::before {
    background-image: url(/img/icons/payments/apay.webp);
}

.methodlist .unionpay::before {
    background-image: url(/img/icons/payments/unionpay.webp);
}

.methodlist .g2apay::before {
    background-image: url(/img/icons/payments/g2apay.webp);
}

.methodlist .jeton::before {
    background-image: url(/img/icons/payments/jeton.webp);
    transform: scale(.95);
}

.methodlist .btc::before {
    background-image: url(/img/icons/payments/btc.webp);
}

.methodlist .btcc::before {
    background-image: url(/img/icons/payments/btc.webp);
}

.methodlist .usdt::before {
    background-image: url(/img/icons/payments/usdt.webp);
}

.methodlist .usdc::before {
    background-image: url(/img/icons/payments/usdc.webp);
}

.methodlist .eth::before {
    background-image: url(/img/icons/payments/eth.webp);
}

.methodlist .ltc::before {
    background-image: url(/img/icons/payments/ltc.webp);
}

.methodlist .ton::before {
    background-image: url(/img/icons/payments/ton.webp);
}

.methodlist .bnb::before {
    background-image: url(/img/icons/payments/bnb.webp);
}

.methodlist .bnbpay::before {
    background-image: url(/img/icons/payments/bnb.webp);
}

.methodlist .ripple::before {
    background-image: url(/img/icons/payments/ripple.webp);
    transform: scale(.9);
}

.methodlist .tron::before {
    background-image: url(/img/icons/payments/tron.webp);
    transform: scale(.9);
}

.methodlist .doge::before {
    background-image: url(/img/icons/payments/doge.webp);
}

.methodlist .polygon::before {
    background-image: url(/img/icons/payments/polygon.webp);
    transform: scale(.9);
}

.methodlist .avalanche::before {
    background-image: url(/img/icons/payments/avalanche.webp);
}

.methodlist .cardano::before {
    background-image: url(/img/icons/payments/cardano.webp);
}

.methodlist .solana::before {
    background-image: url(/img/icons/payments/solana.webp);
}

.methodlist .stellar::before {
    background-image: url(/img/icons/payments/stellar.webp);
}

.methodlist .eos::before {
    background-image: url(/img/icons/payments/eos.webp);
}

.methodlist .giftcard::before {
    background-image: url(/img/icons/payments/giftcard.webp);
}

.methodlist .lol::before {
    background-image: url(/img/icons/payments/lol.webp);
}

.methodlist .fortnite::before {
    background-image: url(/img/icons/payments/fortnite.webp);
}

.methodlist .valorant::before {
    background-image: url(/img/icons/payments/valorant.webp);
    transform: scale(.9);
}

.methodlist .roblox::before {
    background-image: url(/img/icons/payments/roblox.webp);
}

.methodlist .skinsback::before {
    background-image: url(/img/icons/payments/skinsback.webp);
}

.methodlist .skinpay::before {
    background-image: url(/img/icons/payments/skinpay.webp);
}

.methodlist .tradingcards::before {
    background-image: url(/img/icons/payments/tradingcards.webp);
}

.methodlist .kinguingiftcards::before {
    background-image: url(/img/icons/payments/kinguin.webp);
}

.methodlist .waxpeer::before {
    background-image: url(/img/icons/payments/waxpeer.webp);
}

.methodlist .gamemoney::before {
    background-image: url(/img/icons/payments/gamemoney.webp);
}

/* Payment Methods Ends */
.typesinside ::before,
.methodlist ::before {
    display: inline-block;
    background-size: cover;
    height: 28px;
    width: 28px;
}

.category-selector .category-box .category-box-content span,
.selected-lang,
.contact-box span,
.copyright span,
.contact,
.boxes-holder-name a,
.newest-boxes-more {
    color: var(--text-darkgray);
    transition: all .15s ease-in-out;
}

.boxes-holder-name a {
    transition: all .1s ease-in-out;
    flex-grow: 1;
}

.officon::before,
.boxreview .plusminus .criteria:nth-child(1) .par li::before,
.boxreview .plusminus .criteria:nth-child(1)::before,
.boxreview .plusminus .criteria:nth-child(2) .par li::before,
.boxreview .plusminus .criteria:nth-child(2)::before,
.big-category:has(.submenu2) a:not(.submenu2 a)::after,
.box .content .defbutton::after,
.site-promo-copy::after,
.sitedetails .sitepros span::after,
.email-copy button::after,
.skin-copy button::after,
.payments-button::after,
.site-attention::after {
    content: '';
    height: 22px;
    width: 22px;
    display: flex;
    font-size: 18px;
    align-items: center;
    justify-content: center;
    background-size: 100%;
    transition: all .15s ease-in-out;
    background-position: center;
    background-repeat: no-repeat;
    opacity: .25;
}

.singlemod-icon.officon::before {
    height: 18px;
    width: 18px;
}

.features .typesinside i {
    margin-right: 10px;
    z-index: 1;
}

.officon:hover::before,
.preview-pause-button:hover .officon::before,
.settings-button:hover .officon::before,
.extra-abox .officon:hover::before,
.search-container:hover .officon::before {
    opacity: 1;
}

#btnfaq.active::before,
.gamemodes .featuresbox .typesinside a:hover::before,
.features .typesinside i::before,
.officon.exclamation::before {
    filter: brightness(0) saturate(100%) invert(16%) sepia(69%) saturate(4202%) hue-rotate(339deg) brightness(95%) contrast(90%);
    opacity: 1;
}

.sitedetails .sitepros span::after,
.officon.oldcarret {
    background-image: url(/img/icons/gamemodes/caret-down.svg);
    transition: all .4s ease-in-out;
    filter: grayscale(1) brightness(5);
    opacity: 1;
    width: 16px;
    height: 16px;
}

.star_rating::before {
    width: 18px;
    height: 21px;
    opacity: 1;
    mask-image: url(/img/icons/gamemodes/star.svg);
    mask-repeat: no-repeat;
    background: linear-gradient(to right, rgb(141, 21, 41), var(--main-color));
    mask-size: 100%;
}

.box.main .star_rating {
    cursor: pointer;
    opacity: .5;
}

.ratingsumm .star_rating::before {
    width: 16px;
    height: 16px;
}

.rating-case-single .star_rating::before {
    content: unset;
}

.box .content .defbutton::after,
.site-promo-copy::after,
.email-copy button::after,
.skin-copy button::after {
    background-image: url(/img/icons/gamemodes/copy_bold.svg);
    opacity: .35;
    height: 12px;
    width: 12px;
}

.box .content .tg-app::after {
    background-image: url(/img/icons/gamemodes/telegram.svg);
    height: 16px;
    width: 16px;
}

.email-copy button::after,
.skin-copy button::after {
    opacity: .15;
}

.email-copy button::after {
    height: 21px;
    width: 21px;
}

.skin-copy button::after {
    height: 18px;
    width: 18px;
}

.content .defbutton::after {
    margin-right: 4px;
}

#btnfaq::before,
.infoicon::before {
    background-image: url(/img/icons/gamemodes/map-marker-question.svg);
    height: 16px;
    width: 16px;
    filter: grayscale(1);
}

.lightbulb-off::before {
    background-image: url(/img/icons/gamemodes/lightbulb-off.svg);
    width: 21px;
}

.lightbulb-on::before {
    background-image: url(/img/icons/gamemodes/lightbulb-on.svg);
    width: 21px;
}

.effect-on::before {
    background-image: url(/img/icons/gamemodes/effect-fill.png);
    width: 20px;
}

.effect-off::before {
    background-image: url(/img/icons/gamemodes/effect.png);
    width: 20px;
}

.route-shield::before {
    background-image: url(/img/icons/gamemodes/route-shield.svg);
}

.route-shield-slash::before {
    background-image: url(/img/icons/gamemodes/route-shield-slash.svg);
}

.officon.zoom-in::before {
    background-image: url(/img/icons/gamemodes/zoom-in.svg);
    height: 18px;
    width: 18px;
}

.officon.zoom-out::before {
    background-image: url(/img/icons/gamemodes/zoom-out.svg);
    height: 18px;
    width: 18px;
}

.officon.cross::before {
    background-image: url(/img/icons/gamemodes/cross-small.svg);
    height: 40px;
    width: 40px;
}

.officon.pause::before {
    background-image: url(/img/icons/gamemodes/pause.svg);
    height: 18px;
    width: 18px;
}

.officon.play::before {
    background-image: url(/img/icons/gamemodes/play.svg);
    height: 16px;
    width: 16px;
}

.officon.library::before {
    background-image: url(/img/icons/gamemodes/apps.svg);
    height: 20px;
    width: 20px;
}

.officon.diamond::before {
    background-image: url(/img/icons/gamemodes/diamond.svg);
    height: 16px;
    width: 16px;
}

.officon.price::before {
    background-image: url(/img/icons/gamemodes/price.svg);
    height: 16px;
    width: 16px;
}

.officon.sort::before {
    background-image: url(/img/icons/gamemodes/sort-alt.svg);
    height: 16px;
    width: 16px;
}

.officon.chevron::before {
    background-image: url(/img/icons/gamemodes/angle-small-up.svg);
    height: 32px;
    width: 32px;
}

.officon.mirror::before {
    background-image: url(/img/icons/gamemodes/mirror.svg);
}

.slick-slider .officon.chevron::before {
    height: 45px;
    width: 45px;
}

.buttons-container .officon.chevron::before,
.main-mode-selection .officon.chevron::before {
    height: 30px;
    width: 30px;
}

.preview-nav-button .officon.chevron::before {
    height: 50px;
    width: 50px;
}

.officon.exclamation::before {
    background-image: url(/img/icons/gamemodes/triangle-warning.svg);
    height: 18px;
    width: 18px;
}

.officon.chevron.right::before {
    transform: rotate(90deg);
}

.officon.chevron.left::before {
    transform: rotate(-90deg);
}

.search::before {
    background-image: url(/img/icons/gamemodes/search.svg);
    height: 18px;
    width: 18px;
}

.boxreview .plusminus .criteria:nth-child(1) .par li::before,
.boxreview .plusminus .criteria:nth-child(1)::before {
    background-image: url(/img/icons/gamemodes/caret-up.svg);
    height: 16px;
    width: 16px;
    opacity: .9;
}

.boxreview .plusminus .criteria:nth-child(2) .par li::before,
.boxreview .plusminus .criteria:nth-child(2)::before {
    background-image: url(/img/icons/gamemodes/caret-down.svg);
    height: 16px;
    width: 16px;
    opacity: .9;
}

.boxreview .plusminus .criteria:nth-child(1)::before,
.boxreview .plusminus .criteria:nth-child(2)::before {
    height: 40px;
    width: 40px;
}

.big-category:has(.submenu2) a:not(.submenu2 a)::after {
    background-image: url(/img/icons/gamemodes/caret-right.svg);
    height: 16px;
    width: 16px;
}

.big-category:hover:has(.submenu2) a:not(.submenu2 a)::after,
.big-category.active:has(.submenu2) a:not(.submenu2 a)::after {
    opacity: 1;
}

.box .content .defbutton:hover::after,
.box .content .review-button.mirror-visit:hover::after {
    opacity: 1;
}

.submenu li a:empty::after,
.submenu2 li a:empty::after,
.submenu2 a::after {
    content: unset !important;
}

.methodlist a[aria-label]:hover:after,
.gamemodes .featuresbox .typesinside a[aria-label]:hover:after {
    content: attr(aria-label);
    transform: translateX(-50%);
    opacity: 1;
}

.methodlist a[aria-label]:after,
.gamemodes .featuresbox .typesinside a[aria-label]:after {
    content: '';
    opacity: 0;
    width: auto;
    height: 10px;
    border-radius: 3px;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 12px;
    transition: all .15s ease-in-out;
    filter: drop-shadow(0px 0px 1px rgb(22, 22, 22));
    white-space: nowrap;
    pointer-events: none;
    position: absolute;
    top: -70%;
    display: flex;
    justify-content: center;
    user-select: none;
    left: 50%;
    transform: translateX(-50%) translateY(10px);
}

.gamemodes .featuresbox .typesinside a[aria-label]:after,
.methodlist a[aria-label]:after {
    top: -85%;
}

.methodlist a[aria-label]:after {
    top: -65%;
}

.slider-container .slick-slider {
    margin-top: 18px;
}

.sitepage.topic-craft .slick-slider {
    margin-top: unset;
    width: 98.5%;
}

.slick-slider {
    width: 1050px;
    margin: 0 auto;
    overflow: hidden;
    margin-top: 18px;
    border-radius: var(--main-border);
}

.screens.slick-slider {
    margin-top: unset;
}

.slick-slide img {
    width: 100%;
}

.screens .slick-dots {
    top: 8px !important;
}

.slick-dots {
    top: 15px !important;
    bottom: unset !important;
    height: 0;
}

.screens:not(.crafting-table-screens).slick-dotted.slick-slider,
.slider-container.slick-dotted.slick-slider {
    margin-bottom: 0;
    filter: drop-shadow(0 1px 1px rgb(10 10 10)) blur(0);
}

.topicpage .slider-container {
    width: 85%;
    margin: 0 auto;
    margin-top: 8px;
}

.slick-dots li {
    width: auto !important;
    height: auto !important;
    margin: 0 6px !important;
}

.slick-dots li button {
    width: 15px !important;
    height: 15px !important;
    font-size: 15px !important;
    border: solid 2px rgba(255, 255, 255, 0.4) !important;
    border-radius: 5px;
    background-color: rgba(0, 0, 0, .3);
    z-index: 2;
    cursor: pointer;
    box-shadow: 0 0 10px 0 rgba(.3, .3, .3, .6);
    transition: all .15s ease-in-out;
    position: relative;
}

.slick-dots li button:before {
    display: none;
}

.screens:not(.crafting-table-screens) li.slick-active button,
.slider-container li.slick-active button {
    background-color: rgba(255, 255, 255, .5) !important;
    border: solid 2px white !important;
    transform: scale(1.2) !important;
}

.screens:not(.crafting-table-screens) li.slick-active button:hover,
.slider-container li.slick-active button:hover {
    background-color: rgba(255, 255, 255, .5) !important;
    transform: scale(1.3) !important;
}

.slick-dots li {
    transition: .15s all ease-in-out;
}

.prev-button {
    transform: translateX(-35px);
}

.next-button {
    transform: translateX(35px);
}

.slider-container:hover button {
    transform: translateX(0);
}

.screens:not(.crafting-table-screens) .slick-dots li button:hover,
.slider-container .slick-dots li button:hover {
    border: solid 2px white !important;
}

@media(max-width: 1080px) {

    .pages button {
        padding: unset;
        padding-left: 10px;
    }

    .pages button:hover {
        color: rgba(255, 255, 255, .3);
        transition: all .3s ease-in-out;
    }
}

@media(max-width: 992px) {
    .container {
        padding: 20px 100px;
    }
}

@media(max-width:768px) {
    body {
        font-size: 16px;
    }

    .container {
        padding: 10px 50px;
    }

    h1 {
        font-size: 26px;
    }

    h2 {
        font-size: 22px;
    }

    hr {
        margin: 30px 0;
    }

    #back-to-top-btn,
    .settings-menu {
        font-size: 18px;
        bottom: 6px;
        right: 6px;
    }
}

.btnEntrance {
    animation-duration: 0.3s;
    animation-fill-mode: both;
    animation-name: btnEntrance;
}

.btnExit {
    animation-duration: 0.3s;
    animation-fill-mode: both;
    animation-name: btnExit;
}

@keyframes btnEntrance {
    from {
        opacity: 0;
        transform: translate3d(0, 100%, 0);
    }

    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}


@keyframes btnExit {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        transform: translate3d(0, 100%, 0);
    }
}

.category-selector .submenu,
.category-selector .submenu2 {
    position: absolute;
    width: 314px;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 100px;
    opacity: 0;
    z-index: -999;
    border-radius: 5px;
    display: block;
    overflow: initial !important;
    visibility: hidden;
}

.category-selector .submenu2 {
    display: none;
}

.submenu .big-category:nth-child(1) {
    margin-top: 18px;
}

.category-selector .category:hover .submenu {
    z-index: 90;
    opacity: 1;
    margin-top: 54px;
    transition: opacity ease-in-out .15s;
    display: block;
    visibility: visible;
}

.category-box.nonredir .submenu2 {
    opacity: 0 !important;
    z-index: -999;
    display: block;
    visibility: hidden !important;
}

ul .big-category:hover .submenu2,
ul .big-category.active .submenu2 {
    z-index: 90;
    opacity: 1;
    margin-top: 0;
    margin-left: 313px;
    transition: opacity ease-in-out .15s;
    display: block;
    visibility: visible;
    padding-right: 2px;
    padding-bottom: 2px;
}

.category .submenu li:first-child {
    border-radius: 5px 0 0 0;
}

.category .submenu li:last-child {
    border-radius: 0 0 0 5px;
    border-bottom: unset;
}

.category .submenu2 li:first-child {
    border-radius: 0 5px 0 0;
}

.category .submenu2 li:last-child {
    border-radius: 0 0 5px 0;
    border-bottom: unset;

}

.submenu li {
    margin: 0;
    width: 100%;
    display: block;

}

.submenu li a,
.submenu li .nonredir {
    padding: 14px 20px;
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: center;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .6);
    border-bottom: 2px solid rgba(0, 0, 0, .2);
    background-color: #0a0a0a;
    border-radius: 5px;
    margin-bottom: unset;
    color: rgba(255, 255, 255, .35);
    transition: all .1s ease-in-out !important;
    position: relative;
    z-index: 1;
}

.big-category a::before,
.big-category .nonredir::before {
    content: '';
    position: absolute;
    top: 5px;
    bottom: 5px;
    left: 5px;
    right: 5px;
    background: var(--icongradient);
    z-index: -1;
    border-radius: var(--main-border);
    transition: all .1s ease-in-out;
    opacity: 0;
}

.submenu .big-category:hover .submenu2 a::before {
    opacity: 0;
}

.submenu .big-category a:hover::before,
.submenu .big-category .nonredir:hover::before,
.submenu .big-category:hover a::before,
.submenu .big-category .submenu2 a:hover::before {
    opacity: 1;
}

.submenu2 li a {
    margin-left: 2px;
}

.submenu a,
.submenu .nonredir,
.submenu2 .big-category a {
    text-decoration: none;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
    color: rgba(255, 255, 255, .35);
}

/* .submenu .big-category a:hover,
.submenu .big-category .nonredir:hover {
    background-color: rgb(18 18 18);
}

.submenu li:hover a,
.submenu li a:active,
.submenu li a:hover {
    background-color: #0e0e0e;
} */

.submenu .big-category:hover a,
.submenu .big-category .nonredir:hover,
.submenu2 a:hover {
    color: var(--white);
}

.submenu .big-category:hover .submenu2 a {
    color: rgba(255, 255, 255, .35);
}

.submenu .big-category .submenu2 a:hover {
    color: var(--white);
}

.email-placeholder:hover span,
.skininspect-placeholder:hover span,
.box-skins:hover .box-skins-name span,
.box-skins-nav:hover .box-skins-name span,
.site-attention span a:hover,
.siteleftpannel .navigation-menu li:hover,
.siteleftpannel .navigation-menu li:hover::marker,
.category:hover .category-box-content span,
.category-box.active .category-box-content span,
.route:hover,
.site-item:hover a,
.payment-list .payment-method:hover,
.payment-list .payment-method.selected,
.lang-menu ul li:hover a {
    color: var(--white);
}

.lang-menu {
    width: auto;
    height: 20px;
    border-radius: 4px;
    font-weight: 600;
    position: relative;
    align-items: center;
    font-size: 15px;
    border: 1px var(--text-darkgray) solid;
    transition: all .15s ease-in-out;
}

.lang-menu .selected-lang {
    display: block;
    cursor: pointer;
    transition: all .15s ease-in-out;
    position: relative;
    padding: 0 4px;
}

.lang-menu:hover {
    background-color: var(--white);
    transition: all .15s ease-in-out;
    border: 1px var(--white) solid;
}

.lang-menu:hover .selected-lang {
    color: black;
}

.lang-menu ul {
    height: 0;
    overflow: hidden;
    display: flex;
    position: absolute;
    transform: translateX(-50%) translateZ(0);
    left: 50%;
    width: fit-content;
    border-radius: var(--main-border);
    border: none;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    transition: all .15s ease-in-out;
}

.lang-menu:hover ul {
    height: auto;
    padding-top: 10px;
}

.lang-menu ul li {
    list-style: none;
    text-align: left;
    display: flex;
    background-color: #0a0a0a;
    justify-content: flex-start;
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, .6);
}

.lang-menu ul li:last-child {
    border-bottom: 2px rgba(255, 255, 255, .12) solid;
}

.lang-menu ul li a {
    text-decoration: none;
    text-align: center;
    margin: 2px 4px;
    padding: 4px 8px;
    display: flex;
    flex-direction: row;
    color: var(--text-darkgray);
    transition: all .15s ease-in-out;
    font-weight: 500;
    font-size: 15px;
    width: 100%;
    border-radius: var(--main-border);
}

.lang-menu ul li i {
    opacity: .4;
    transition: all .15s ease-in-out;
}

.lang-menu ul li:hover a i {
    opacity: 1;
}

.lang-menu ul li:hover a {

    background: var(--icongradient);
}

i.flagbox {
    width: 18px;
    border-radius: 2px;
    aspect-ratio: 3 / 2;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50%;
    margin: auto 0;
    margin-right: 6px;
}



.lang-switch.lang-ru i {
    background-image: url(/img/icons/flags/ru.svg);
}

.lang-switch.lang-en i {
    background-image: url(/img/icons/flags/uk.svg);
}

.lang-switch.lang-pt i {
    background-image: url(/img/icons/flags/pt.svg);
}

.lang-switch.lang-es i {
    background-image: url(/img/icons/flags/es.svg);
}

.lang-switch.lang-tr i {
    background-image: url(/img/icons/flags/tr.svg);
}

.lang-switch.lang-hi i {
    background-image: url(/img/icons/flags/hi.svg);
}

.lang-switch.lang-pl i {
    background-image: url(/img/icons/flags/pl.svg);
}

.lang-switch.lang-ru::after {
    content: 'Русский';
}

.lang-switch.lang-en::after {
    content: 'English';
}

.lang-switch.lang-pt::after {
    content: 'Português';
}

.lang-switch.lang-es::after {
    content: 'Español';
}

.lang-switch.lang-tr::after {
    content: 'Türkçe';
}

.lang-switch.lang-hi::after {
    content: 'हिन्दी';
}

.lang-switch.lang-pl::after {
    content: 'Polski';
}

.site-item a {
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    color: var(--text-darkgray);
    position: relative;
    width: 100%;
    text-wrap: nowrap;
    margin: auto;
    height: auto;
    display: flex;
    align-items: center;
    padding: 8px 12px;
    transition: all .15s ease-in-out;
    z-index: 1;
}

.site-item .site-icon {
    max-width: 25px;
    width: auto;
    height: auto;
    margin-right: 9px;
}

.site-item a::after {
    /* content: ''; */
    position: absolute;
    top: 4px;
    bottom: 4px;
    left: 4px;
    right: 4px;
    background: var(--icongradient);
    transition: all .15s ease-in-out;
    border-radius: 5px;
    opacity: 0;
    z-index: -1;
}

.site-item a:hover::after {
    opacity: 1;
}

#search-input,
.payment-container input {
    margin-bottom: unset;
    margin-left: unset;
    cursor: text;
    width: 100%;
    height: 30px;
    color: rgba(255, 255, 255, .3);
    background-color: rgb(16 16 16);
    border-radius: 5px;
    border: none;
    font-size: 16px;
    font-family: 'TTNormsPro';
    font-weight: 500;
    padding: 0 30px;
    opacity: 0;
    outline: none !important;
    transition: all .15s ease-in-out;
}

#search-input.active {
    opacity: 1;
}

#search-input {
    opacity: 1;
    background-color: unset;
    font-size: 15px;
    padding: 0 20px;
}

#search-input:focus::placeholder {
    color: transparent;
}

input:not(:placeholder-shown) + .ghost { 
    opacity:0 
}

.search-container {
    order: 1;
    height: 50px;
    width: 50px;
    border-radius: var(--main-border);
    display: flex;
    justify-content: center;
    background: var(--darkgray);
    position: relative;
    z-index: 1;
}

.search-enabler {
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    outline: none;
    background-color: transparent;
    cursor: pointer;
    transition: all .2s ease-in-out;
    z-index: 10;
}

.search-enabler.disabled {
    margin-left: 6px;
    pointer-events: none;
}

.search-enabler.disabled .search::before {
    height: 14px;
    width: 14px;
}

.search-enabler i {
    transition: all .15s ease-in-out;
}

.lang-menu ul li a:active,
.pages button:active,
.controls-button:active,
.screens button i:active,
.socials a:active,
.site-promo-copy:active,
label:active,
.box-skins-button:active i,
.preview-close-button:active,
.preview-pause-button:active,
.preview-nav-button:active,
.methodlist a:active::before,
.email-copy button:active,
.email-copy button:active i,
.skin-copy button:active,
.skin-copy button:active i,
.officon:active::before,
.search-container:active .officon::before,
.settings-button:active .officon::before,
.skins-category-switch .category-switch:active::before,
.preview-pause-button:active .officon::before,
a.extra-abox:active span,
h4:active .boxtitle {
    filter: brightness(.4) !important;
    transition: all .09s ease-in-out;
}

.boxes-holder-name a:active,
.singlemod-box:active a,
.main-mode-unit:active,
.category-box:active,
.payments-button:active,
.newest-boxes-more:active,
.pagination-button:active,
a.extra-abox:active .officon,
.features .featuresbox .typesinside a:active {
    filter: brightness(.85) !important;
    transition: all .09s ease-in-out;
}

.singlemod-box:active,
.review-button:active,
.copy:active,
.controls-button:active i::before,
.featuresbox .typesinside a:active,
.sitedetails .methodlist a:active,
#theme-toggle:active,
#particles-toggle:active,
.search-enabler:active,
.box .logobg a:active img,
.lang-switch:active,
.navigation-weapon-type:active,
.navigation-weapon-name:active,
.close-box-skins:active::before,
.rec-box .logobg:active img,
.color-box-selection-button:active,
.colors-list-unit:active,
.site-searcher-box:active,
.skin-color:active,
.skin-alt-info:active,
.skin-extra-info a:active,
.box-skins-button:active i,
.settings-menu:active,
#back-to-top-btn:active,
.contact-content a:active,
.skin:active img,
.weapon-selection-unite:active,
.navigation-weapon-sort:active,
.pagination-holder button:not(.active):active,
.screens button:active i::before,
.slider-container button:active i::before,
.nav-review li:not(.current):active,
.boxes-holder-modes:active,
.boxes-holder-more:active,
.newest-boxes-more:active,
.instruction li a:active,
nav img:active,
.copyright a img:active {
    scale: .9;
    transform-origin: center center;
    transition: all .1s ease-in-out;
}

.category-box:active,
.skins-box .singlemod-box:active,
.topic-boxes-holder .topic-box:active,
.topic-boxes-holder .topic-grandbox:active,
.mirror-redirect:active,
.partner-site:active,
.logobg .rating:active,
.main-mode-unit:active,
h4:has(.boxtitle):active {
    scale: .96;
    transform-origin: center center;
    transition: all .1s ease-in-out;
}

form input {
    opacity: 1;
}

div#results {
    height: 200px;
    width: 200px;
}

.site-list::-webkit-scrollbar-thumb {
    background: rgb(55, 55, 55);
    border-radius: 2px !important;
}

.site-list::-webkit-scrollbar {
    width: 4px;
}

.site-list::-webkit-scrollbar-track {
    background: #121212;
}

.site-items {
    padding: 0;
    margin: 0;
    list-style: none;
}

@keyframes searchEntrance {
    from {
        margin-top: 0px;
    }

    to {
        margin-top: 10px;
    }
}


@keyframes searchExit {
    0% {
        display: block;
        opacity: 1;
    }

    50% {
        max-height: 0;
    }

    100% {
        display: none;
        max-height: 0;
        opacity: 0;
    }
}

.site-list {
    transition: all .15s ease-in-out;
    background-color: #0e0e0e;
    max-height: 190px;
    overflow-y: auto;
    overflow-x: hidden;
    position: absolute;
    transform: translateX(-50%);
    top: 25px;
    width: fit-content;
    min-width: 170px;
    max-width: 250px;
    border-radius: 5px;
    margin-top: 10px;
    left: 50%;
}

.site-list.hidden {
    animation-duration: 0.4s;
    animation-fill-mode: both;
    animation-name: searchExit;
}

.site-list.show {
    animation-duration: 0.15s;
    animation-fill-mode: both;
    animation-name: searchEntrance;
}

.site-item {
    height: 43px;
    border-radius: var(--main-border);
    /* box-shadow: 0 0 8px 0 rgba(0, 0, 0, .6); */
    display: flex;
    justify-content: center;
    transition: all .1s ease-in-out;
    align-items: center;
    justify-content: flex-start;
}

.site-item:hover {
    background: var(--darkygray);
}

.site-item.hidden {
    display: none;
}

.site-item.show {
    display: flex;
}

.site-item.gambling a::before,
.site-item.topic a::before,
.site-item.skins a::before,
.site-item.steam a::before,
.site-item.earning a::before,
.site-item.review a::before {
    content: "" !important;
    min-width: 25px;
    width: 25px;
    height: 25px;
    background-color: rgb(21, 21, 21);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 60%;
    margin-right: 9px;
    border-radius: 8px;
    filter: grayscale(1);
    transition: all .15s ease-in-out;
}

.site-item:hover a::before {
    filter: grayscale(0);
}

.site-item.skins a::before {
    background-image: url(code-parts/search-config/icons/skins-icon.png);
}

.site-item.topic a::before {
    background-image: url(code-parts/search-config/icons/wiki-icon-reversed.png);
}

.site-item.steam a::before {
    background-image: url(code-parts/search-config/icons/steam-icon.png);
}

.site-item.gambling a::before {
    background-image: url(code-parts/search-config/icons/gambling-icon.png);
}

.site-item.earning a::before {
    background-image: url(code-parts/search-config/icons/offerwalls-icon.png);
}

.site-item.review a::before {
    background-image: url(code-parts/search-config/icons/review-icon.png);
}

.site-item a:has(.site-icon)::before {
    content: unset !important;
}

.payment-list .payment-method:hover,
.payment-list .payment-method.selected {
    background-color: #0e0e0e;
}

.sub-site-list {
    padding-left: 10px;
}

.colors-box-selection {
    width: auto;
    display: flex;
    justify-content: center;
    position: relative;
}

.color-box-selection-button,
.color-box-overview-button {
    width: auto;
    padding: 8px 12px;
    background: linear-gradient(180deg, rgb(13, 13, 13) 0%, var(--main-theme) 100%);
    filter: drop-shadow(0 0 1px rgb(35 35 35));
    border-radius: var(--main-border);
    font-weight: 500;
    font-size: 12px;
    text-transform: uppercase;
    cursor: pointer;
    transition: .15s all ease-in-out;
    text-align: center;
    user-select: none;
    position: relative;
}

.color-box-overview-button {
    text-decoration: none;
    margin-left: 10px;
}

.color-box-selection-button.clicked {
    background-color: #191919;
}

.color-item,
.colors-list-unit {
    background-color: #1a1a1a;
    padding: 7px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#color-list {
    overflow: hidden;
    position: absolute;
    width: 196px;
    border-radius: var(--main-border);
    z-index: 10000;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: center;
    height: 0;
    opacity: 0;
    background: var(--icongradient);
    transition: .15s margin ease-in-out, .15s opacity ease-in-out;
    gap: 4px;
}

#color-list.active {
    height: auto;
    padding: 8px 0;
    margin-top: 41px;
    opacity: 1;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .3);
}

#color-list li a {
    text-decoration: none;
    font-weight: 500;
    color: var(--white) !important;
    width: 100%;
    height: 30px;
    font-size: 13px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#color-list li {
    display: flex;
    height: 22px;
    width: 22px;
}

#color-list li .colors-list-unit {
    width: 100%;
    height: 100%;
    border-radius: 7px;
    transition: all .15s ease-in-out;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, .3);
    filter: drop-shadow(0 1px 1px rgb(3 3 3)) blur(0);
    border: 1px solid rgba(255, 255, 255, .15);
}

/* .colors-list-unit.golden {
    background: linear-gradient(to right, #FFD700, #E6C200, #D4AF37);
}

.colors-list-unit.silver {
    background: linear-gradient(to right, #C0C0C0, #B0B0B0, #A8A8A8);
}

.colors-list-unit.white {
    background: linear-gradient(to right, #FFFFFF, #F5F5F5, #EDEDED);
}

.colors-list-unit.red {
    background: linear-gradient(to right, #FF4C4C, #E64545, #CC3D3D);
}

.colors-list-unit.yellow {
    background: linear-gradient(to right, #FFF200, #F2E600, #E5D900);
}

.colors-list-unit.orange {
    background: linear-gradient(to right, #FF9900, #F28C00, #E57F00);
}

.colors-list-unit.cyan {
    background: linear-gradient(to right, #00CCCC, #00B8B8, #00A3A3);
}

.colors-list-unit.purple {
    background: linear-gradient(to right, #9B59B6, #8E4DA8, #81429B);
}

.colors-list-unit.pink {
    background: linear-gradient(to right, #FF69B4, #F65DA8, #EC529C);
}

.colors-list-unit.green {
    background: linear-gradient(to right, #2ECC71, #29B866, #25A35A);
}

.colors-list-unit.blue {
    background: linear-gradient(to right, #3498DB, #2F89C6, #297AB1);
}

.colors-list-unit.black {
    background: linear-gradient(to right, #2B2B2B, #242424, #1E1E1E);
}

.colors-list-unit.gray {
    background: linear-gradient(to right, #A9A9A9, #999999, #8A8A8A);
}

.colors-list-unit.brown {
    background: linear-gradient(to right, #8B4513, #7A3E11, #6A370F);
} */

/* #color-list {
    margin-top: unset;
    margin-top: 10px;
    flex-wrap: wrap;
    width: 200px;
    gap: 4px;
}

#color-list li {
    position: relative;
    margin: unset;
    height: 20px;
    width: 40px;
}

#color-list li .colors-list-unit {
    width: 100%;
    height: 100%;
    margin: unset;
    border: unset;
    padding: unset;
    border-radius: 2px;
} */

.controls {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    z-index: 1001;
}

.controls button {
    margin: 0 5px;
}

.sitealternates .box:hover {
    background: var(--darkgray) !important;
    transition: all .2s ease-in-out;
    background-color: none;
}

.rating-case-single {
    width: auto;
    padding-right: 4px;
    height: 50px;
    padding-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    color: var(--main-color);
    transition: all .15s .05s ease-in-out, background .15s .0s;
    background: var(--darkygray);
    position: absolute;
    transform: translateY(50px);
    user-select: none;
    bottom: -10px;
    left: 10px;
    border-radius: 10px 0 0 0;
    z-index: 1;
}

.newest-boxes .rating-case-single {
    display: none;
}

.boxes-holder .rating-case-single::before {
    content: '';
    position: absolute;
    top: 0;
    right: -15px;
    transform: skewX(20deg);
    border-radius: 0 5px 0 0;
    transition: all .15s .05s ease-in-out, background .15s .0s;
    background: inherit;
    width: 25px;
    height: 100%;
    z-index: -1;
}

.logobg:hover .rating-case-single .rating-summ,
.logobg:hover .route,
.sitealternatesboxes .box:hover .rating-case-single .rating-summ,
.sitealternatesboxes .box:hover .route {
    opacity: 1;
    color: var(--white);
}

.logobg:hover .rating-case-single .star_rating,
.sitealternatesboxes .box:hover .rating-case-single .star_rating {
    filter: grayscale(0) !important;
}

.rating-case-single .star_rating {
    margin-left: 10px;
    filter: grayscale(1);
    transition: all .15s ease-in-out;
    mask-image: url(/img/icons/gamemodes/star-fill.svg);
    mask-size: 18px 14px;
    -webkit-mask-size: 18px 14px;
    width: 18px;
    height: 14px;
}

.rating-case-single .rating-summ {
    font-size: 14px;
    margin-left: 4px;
    font-weight: 500;
    opacity: .3;
    transition: all .15s ease-in-out;
    z-index: 1;
}

.box:hover .rating-case,
.box:hover .rating-case-single,
.box:hover .rating-case-single::before {
    transform: translateY(0);
}

.box:hover .rating-case-single::before {
    transform: translateY(0) skewX(20deg);
}

.sitepage.topic-craft .topicpage {
    background: linear-gradient(180deg, var(--darkgray) 50%, rgba(0, 0, 0, 0) 100%);
    width: 1000px;
    padding-bottom: 9px;
}

.sitepage.topic-craft .topic-grandbox,
.topic-boxes-holder .topic-grandbox.sticker {
    height: 230px;
    min-height: 230px;
    font-weight: 500;
    font-size: 14px;
}

.sitepage.topic-craft .box-extra-links {
    order: 1;
}

.sitepage.topic-craft .rec-box {
    order: 2;
}

.sitepage.topic-craft.loadout .topic-grandbox,
.topic-boxes-holder.loadout .topic-grandbox.sticker {
    height: auto;
}

.sitepage.topic-craft .section.first span,
.topic-boxes-holder .topic-grandbox.sticker .section.first span {
    margin-top: 8px;
}

.sitepage.topic-craft .section.first .craft-name,
.topic-boxes-holder .topic-grandbox.sticker .section.first .craft-name {
    margin-right: 4px;
}

.sitepage.topic-craft .section.second span,
.topic-boxes-holder .topic-grandbox.sticker .section.second span {
    font-size: 14px;
    color: rgba(255, 255, 255, .6);
    font-weight: 400;
    text-transform: none;
}

.topic-grandbox.sticker .section.first::after,
.sitepage.topic-craft .topic-grandbox .section.first::after {
    content: 'Required Stickers';
    position: relative;
    font-size: 13px;
    color: rgba(255, 255, 255, .6);
    font-weight: 400;
    text-transform: none;
    margin-bottom: 10px;
    width: 80%;
    text-align: center;
    text-wrap: nowrap;
}

.topic-boxes-holder.lang-ru .topic-grandbox.sticker .section.first::after,
.sitepage.topic-craft.lang-ru .topic-grandbox .section.first::after {
    content: 'Необходимые Стикеры';
}

.sitepage.topic-craft .section.third,
.topic-boxes-holder .topic-grandbox.sticker .section.third {
    display: flex;
    justify-content: center;
    position: relative;
}

.topic-grandbox .skin {
    width: 40px;
    height: 40px;
    margin: 5px;
    background: var(--icongradient);
    border: 2px solid var(--darkygray);
    transition: all .15s ease-in-out;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.topic-grandbox .skin:hover {
    filter: brightness(1.1);
}

.introduce-craft {
    margin: 0 20px;
    margin-top: 20px;
    min-height: 110px;
}

.introduce-craft p,
.introduce-craft span {
    height: auto;
    font-weight: 500;
    font-size: 16px;
    width: 100%;
    display: block;
    list-style: none;
    color: rgba(255, 255, 255, .7);
    line-height: 1.4;
}

.introduce-craft a {
    text-decoration: none;
}

.craft-components-list {
    display: contents;
    color: rgba(255, 255, 255, .7);
}

.introduce-craft span:first-of-type {
    margin-top: 12px;
}

.introduce-craft strong,
.introduce-craft p .skin-desc-name,
.introduce-craft span .skin-desc-name {
    font-weight: 500;
}

.introduce-craft span .skin-desc-name {
    cursor: pointer;
    transition: all .15s ease-in-out;
}

.introduce-craft span .skin {
    display: inline-flex;
    align-items: baseline;
    position: relative;
    margin: unset;
    width: auto;
    gap: unset;
}

.introduce-craft span .skin:hover .skin-desc-name {
    filter: brightness(.9);
}

.introduce-craft .skin span {
    margin: unset;
    margin-right: 4px;
    color: var(--white);
    width: auto;
}

#preview-content span {
    display: none;
}

.introduce-craft span img,
.introduce-craft span .skin-price-info,
.section .skin-price-info {
    display: none;
}

.topic-grandbox .skin img {
    height: auto;
    max-height: 95%;
}

.sitepage.topic-craft .topic-box .logobg img,
.topic-boxes-holder .topic-grandbox.sticker .topic-box .logobg img {
    max-height: 47%;
    width: auto;
    height: auto;
    max-width: 75%;
    transform: rotate(8deg);
    transition: all .15s ease-in-out;
    object-fit: contain;
    margin: auto 0;
}

.sitepage.topic-craft .siteleftpannel .topic-box .logobg.zoomed img {
    max-height: 155%;
}

.topic-boxes-holder .topic-grandbox.sticker .topic-box .logobg.zoomed img {
    max-height: 70%;
}

.topic-boxes-holder .topic-grandbox.sticker .topic-box .logobg.semizoomed img {
    max-height: 60%;
}

.topic-boxes-holder .topic-grandbox.sticker .topic-box .logobg.unzoomed img {
    max-height: 42%;
}

.sticker-crafts-list .topic-grandbox.sticker .topic-box .logobg img {
    transform: unset;
    max-height: 40%;
    max-width: 80%;
}

.sticker-crafts-list .topic-grandbox.sticker .topic-box .logobg.zoomed img {
    max-height: 55%;
}

.sitepage.topic-craft .sticker-crafts-list .topic-box:hover .logobg img {
    transform: scale(1.1) rotate(6deg);
}

.topic-box .best.cheap::after {
    content: 'Cheap';
}

.topic-box .best.mid::after {
    content: 'Affordable';
}

.topic-box .best.exp::after {
    content: 'Expensive';
}

.lang-ru .topic-box .best.cheap::after {
    content: 'Дешево';
}

.lang-ru .topic-box .best.mid::after {
    content: 'Доступно';
}

.lang-ru .topic-box .best.exp::after {
    content: 'Дорого';
}

.sitepage.topic-craft .topic-box:hover .logobg,
.topic-boxes-holder .topic-grandbox.sticker .topic-box:hover .logobg {
    transform: unset;
}

.sitepage.topic-craft .topic-box:hover .logobg img,
.topic-boxes-holder .topic-grandbox.sticker:hover .topic-box .logobg img {
    transform: scale(1.05) rotate(8deg);
}

.topic-box.maestro {
    width: 30.3%;
    height: auto;
    border-radius: var(--main-border);
    flex-grow: 1;
}

.topic-box.maestro:hover {
    transform: scale(1.03);
}

.topic-box.maestro .logobg {
    height: auto;
    mask-image: unset;
    -webkit-mask-image: unset;
    z-index: 2;
    position: relative;
}

.topic-box.maestro .content {
    height: 100%;
    width: 100%;
    position: absolute;
    transition: filter .15s ease-in-out, opacity .15s !important;
    background-position: center;
    background-size: cover;
    filter: brightness(1.1);
    opacity: 1;
    z-index: 1;
}

/* .topic-box.maestro:nth-child(1) .content,
.topic-box.maestro:nth-child(4) .content {
    background-image: url(/img/skins/topics/topic-backplate-1.webp);
}

.topic-box.maestro:nth-child(2) .content,
.topic-box.maestro:nth-child(5) .content {
    background-image: url(/img/skins/topics/topic-backplate-2.webp);
}

.topic-box.maestro:nth-child(3) .content,
.topic-box.maestro:nth-child(6) .content {
    background-image: url(/img/skins/topics/topic-backplate-3.webp);
} */

.topic-box.maestro .logobg img {
    width: 100%;
    height: auto;
}

/* .topic-box.maestro:hover .content {
    filter: brightness(1.2);
    opacity: .75;
} */

.topic-box.maestro .logobg:hover img {
    transform: scale(1.03) !important;
}

.topic-box.maestro:hover .logobg {
    transform: scale(1) !important;
}

.topic-boxes-holder .topic-grandbox.sticker {
    background: var(--darkgray);
    cursor: pointer;
    text-decoration: none !important;
    top: 0;
}

.topic-boxes-holder .topic-grandbox.sticker .logobg {
    background-color: unset;
}

.sitepage.topic-craft .topic-centralizer {
    justify-content: flex-start;
    min-height: unset;
    margin: 0 auto;
    width: 98.4%;
}

.preview-craft {
    width: 96.3%;
    height: auto;
    margin: auto;
    overflow: hidden;
    margin-top: 10px;
    display: flex;
    justify-content: space-between;
    position: relative;
    align-items: flex-end;
}

.preview-craft-unit {
    width: 33%;
    border-radius: var(--main-border);
    overflow: hidden;
    aspect-ratio: 16 / 9;
    opacity: .4;
    transition: all .15s ease-in-out;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: flex-end;
}

.transparent .preview-craft-unit {
    opacity: .7;
    background-color: unset;
}

.sitepage.topic-craft .topic-box .best {
    display: none;
}

.preview-craft-unit:first-child {
    padding-right: 2px;
}

.preview-craft-unit:last-child {
    padding-left: 2px;
}

.preview-craft-unit:hover {
    opacity: 1;
}

.preview-craft:has(.preview-craft-unit.preview) {
    min-height: 333px;
}

.preview-craft-unit.preview {
    opacity: 1;
    width: 100%;
    z-index: 100;
    filter: drop-shadow(2px 4px 12px black);
}

.transparent .preview-craft-unit.preview {
    filter: unset;
}

.preview-craft img {
    width: auto;
    height: 100%;
    border-radius: 5px;
}

.sitepage.topic-craft .crafting-table {
    width: 100%;
    position: relative;
    height: auto;
    margin-top: 9px;
    /* background: rgb(9 9 9); */
    background: var(--darkgray);
    border-radius: var(--main-border);
    margin-bottom: 9px;
    display: flex;
    justify-content: center;
}

.crafting-table-screens {
    width: 100% !important;
    height: 100%;
    overflow: hidden;
    position: relative;
    border-radius: var(--main-border);
    aspect-ratio: 16 / 9;
    background-size: cover;
    margin: 0 !important;
}

.crafting-table-screens img {
    width: 100%;
    user-select: none;
    pointer-events: none;
}

.crafting-table-screens.object img {
    width: auto;
    height: auto;
    max-height: 75%;
    max-width: 85%;
    margin-top: 43px;
    /* filter: drop-shadow(0 0.1rem 0.15rem rgba(0, 0, 0, 0.2)); */
    filter: drop-shadow(6px 4px 6px rgba(6, 6, 6, .5));
}

.crafting-table-screens.object.combined img {
    max-height: unset;
    max-width: unset;
    margin-left: 450px;
    margin-top: 200px;
    object-fit: contain;
}

.crafting-table-screen {
    position: absolute;
    transition: opacity .5s ease-in-out;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.slick-initialized .slick-slide.crafting-table-screen {
    display: flex;
}

.crafting-table-screens .slick-list,
.crafting-table-screens .slick-track {
    height: 100%;
}

.crafting-table-screens .slick-dots button {
    width: 100% !important;
    height: 40px !important;
    background-color: unset;
    background: linear-gradient(150deg, rgb(15 15 15) 0%, rgb(13 13 13) 100%);
    border-radius: var(--main-border);
    margin-top: 4px;
    transition: all .15s ease-in-out;
    box-shadow: unset;
    display: flex;
    justify-content: center;
    align-items: center;
    border: unset !important;
    cursor: pointer;
    opacity: .85;
}

.crafting-table-screens li {
    width: 100% !important;
    margin: 0 3px !important;
    max-width: 25%;
}

.crafting-table-screens .slick-dots {
    width: 98%;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    z-index: 100;
}

.crafting-table-screens .slick-dots button:hover {
    opacity: 1;
}

.crafting-table-screens .slick-active button {
    opacity: 1;
    background: linear-gradient(150deg, rgb(20 20 20) 0%, rgb(18 18 18) 100%);
}

.crafting-table-screens button:hover span,
.crafting-table-screens .slick-active button span {
    opacity: 1;
}

.crafting-table-screens button span {
    opacity: .35;
    transition: all .1s ease-in-out;
    font-size: 14px;
    font-weight: 500;
    user-select: none;
    font-family: TTNormsPro;
}

.crafting-table-screen .skin {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    border-radius: var(--main-border);
    position: absolute;
    left: 18px;
    bottom: 18px;
    background: linear-gradient(150deg, rgb(15 15 15) 0%, rgb(13 13 13) 100%);
    box-shadow: 0 1px 2px 0 rgba(11, 11, 11, .4);
    transition: all .15s ease-in-out;
    cursor: pointer;
    z-index: 5;
}

.crafting-table-screen .skin:hover {
    transform: scale(1.03);
    filter: brightness(1.1);
}

.crafting-table-screen .skin .skin-desc-name,
.crafting-table-screen .skin .skin-price-info {
    display: none;
}

.crafting-table-screen .skin img {
    margin: unset !important;
    height: 80%;
    width: auto;
    max-width: unset;
    max-height: unset;
}

.crafting-table-screen-description {
    position: absolute;
    background-color: rgba(16, 16, 16, .85);
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 36px;
    width: 100%;
    z-index: 1;
    bottom: 0;
    left: 0;
}

.crafting-table-screen-description p {
    user-select: none;
    font-weight: 500;
    font-size: 14px;
    width: 80%;
    display: flex;
    justify-content: center;
    text-align: center;
    margin-top: 10px;
}

.crafting-table-screens.object {
    background-image: url(/img/skins/topics/stickers-crafts/background.png);
    background-size: 75%;
    background-position: center 70px;
    background-repeat: no-repeat;
}

.category-box-content span {
    opacity: 0;
}

:lang(en) .category-box-content span {
    opacity: 1;
}

.category-box-content span.translated,
.category-selector#notexist .category-box-content span {
    opacity: 1;
}

.copied-title {
    position: absolute;
    bottom: 34px;
    margin-right: 10px;
    background-color: rgb(26 26 26);
    transition: background .15s ease-in-out;
    pointer-events: none;
    padding: 5px 7px;
    border-radius: 5px;
    font-size: 11px;
    font-weight: 500;
}

.skin-copy .copied-title,
.email-copy .copied-title {
    margin-right: unset;
    bottom: unset;
    top: -30px;
}

.main-page .copied-title {
    margin-right: unset;
    margin-left: 10px;
}

.gamemodes {
    bottom: -1px;
}

.gamemodes .featuresbox {
    border-radius: unset;
    min-width: 60px;
    padding: 5px;
    padding-bottom: 3px;
}

.gamemodes .featuresbox:after,
.gamemodes .featuresbox::before,
.gamemodes .featuresbox {
    background: var(--darkygray);
}

.gamemodes .featuresbox:after,
.gamemodes .featuresbox::before {
    content: '';
    position: absolute;
    width: 20px;
    height: 100%;
    transition: all .15s ease-in-out;
    box-sizing: border-box;
    transform: skewX(-20deg);
    z-index: -1;
    top: 0;
}

.gamemodes .featuresbox::before {
    left: -9px;
    border-radius: 5px 0 0 0;

}

.gamemodes .featuresbox::after {
    right: -9px;
    transform: skewX(20deg);
    border-radius: 0 5px 0 0;
}

.main-infobox {
    position: relative;
    display: flex;
    margin: 0 auto;
    width: auto;
    max-width: 1050px;
    height: auto;
    margin-top: 18px;
    justify-content: center;
    filter: drop-shadow(0 1px 1px rgb(10 10 10)) blur(0);
}

.boxreview .main-infobox {
    max-width: 100%;
    margin-top: 9px;
}

.boxreview .main-infobox-content {
    width: 80%;
}

.main-infobox-content {
    background-color: var(--darkgray);
    position: relative;
    width: 50%;
    height: 100%;
    border-radius: var(--main-border);
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
}

.main-infobox-content-text {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    user-select: none;
    z-index: 2;
}

.main-infobox-content-text p {
    color: var(--gray);
    font-weight: 500;
    font-size: 14px;
    transition: color .25s ease-in-out;
    line-height: 1.4;
}

/* .sitepage .main-infobox-content-text p {
    color: var(--gray);
} */

.main-infobox:hover .main-infobox-content-text p {
    color: var(--text-lightgray);
}

.main-infobox-content-block {
    background-color: var(--darkgray);
    position: relative;
    border-radius: var(--main-border);
    margin: 8px;
    padding: 12px;
    z-index: 2;
}

.main-infobox-content-text ul li {
    display: block;
}

.main-infobox-content-text p:nth-child(2) {
    margin-top: 10px;
}

.main-infobox-mascotte {
    background-color: var(--darkgray);
    position: relative;
    right: 0;
    top: 5px;
    border-radius: 50%;
    margin-right: 40px;
    width: 125px;
    min-width: 125px;
    height: 125px;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
}

.main-infobox-mascotte::before {
    content: '';
    width: 90%;
    height: 90%;
    background-repeat: no-repeat;
    position: absolute;
    display: block;
    background-size: contain;
    background-image: url(/img/icons/ambassador.png);
    top: 6px;
    left: 6px;
    overflow: hidden;
    border-radius: 0 0 50% 50%;
    z-index: 1;
}

.main-infobox-mascotte::after {
    content: '';
    width: 90%;
    height: 90%;
    background-repeat: no-repeat;
    position: absolute;
    display: block;
    background-size: contain;
    background: var(--icongradient);
    top: 6px;
    left: 6px;
    overflow: hidden;
    border-radius: 50%;
}

.main-infobox-content.second {
    margin-left: -20px;
    height: fit-content;
}

.main-infobox-content.second::before,
.main-infobox-content.second::after {
    content: none;
}

.main-infobox-content::before {
    content: '';
    background-color: inherit;
    position: absolute;
    left: -10px;
    height: 100px;
    width: 20px;
    top: 20px;
    border-radius: 50px 0 0 50px;
    z-index: 1;
}

.main-infobox-content::after {
    content: '';
    height: 100px;
    width: 40px;
    position: absolute;
    background-color: inherit;
    border-radius: 0 0 5px 0;
    left: 0;
    top: 40px;
    transform: rotate(135deg);
}

.main-infobox-mascotte::after,
.main-infobox-content-text ul,
.box .content,
.rec-box::before,
.boxreview .plusminus .criteria,
.main-infobox-mascotte::after,
.main-infobox-content-text ul,
.box-skins .skin,
.singlemod-select::before,
.main-infobox-content-block,
.character-model,
.instruction code,
.site-promo-copy,
.smallreview,
.instruction,
.screentable,
.sitepros,
.ratingsumm,
.boxreview .smallreview.criteria,
.shortinfo .feature,
header {
    box-shadow: 0 1px 2px 0 rgba(11, 11, 11, .4);
}

.boxreview .plusminus .criteria {
    box-shadow: 0 1px 2px 0 rgba(7, 7, 7, .7);
}

.main-page .content p:nth-child(3) {
    display: none;
}

.main-page .content .defbutton {
    border-radius: var(--main-border) 2px 2px var(--main-border);
    left: -1px;
    right: unset;
    top: -1px;
}

.main-page .content button,
.main-page .content .defbutton::before,
.main-page .content .review-button.mirror-visit,
.main-page .content .review-button.mirror-visit::before {
    background-color: rgb(11 11 11);
}

.siteblock.mirror .mirror-visit {
    display: none;
}

.main-page .box .content .defbutton::after {
    opacity: .25;
}

.main-page .box .content .defbutton:hover::after {
    opacity: 1;
}

.main-page {
    padding: 0;
}


.main-page .box {
    height: 150px;
    z-index: 3;
    filter: unset;
    min-width: unset;
    /* background: radial-gradient(75% 50% at 50% 0%, var(--main-theme), rgb(13 13 13) 100%); */
    /* background: var(--icongradient2); */
    background: linear-gradient(-45deg, transparent, var(--main-theme));
}

.main-page .box:hover {
    z-index: 4;
}

.main-mode-unit {
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
    height: 250px;
    width: 302px;
    min-width: 302px;
    border-radius: var(--main-border);
    margin: 0 8px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: all .15s ease-in-out;
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    background: rgba(0, 0, 0, .3);
    z-index: 1;
}

.main-mode-unit a {
    z-index: 1;
    position: relative;
    display: block;
}

.main-mode-unit a::before {
    transition: all .3s ease-in-out;
    z-index: -1;
}

.main-mode-unit .overflow {
    position: absolute;
    z-index: 1;
}

.main-mode-unit a::before {
    content: '';
    position: absolute;
    top: 0;
    height: 100%;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    opacity: .85;
}

.main-mode-unit.cs2 a::before {
    background-image: url(img/main-modes/best-cs-2.webp);
}

.main-mode-unit.rust a::before {
    background-image: url(img/main-modes/best-rust.webp);
}

.main-mode-unit.earning a::before {
    background-image: url(img/main-modes/best-earning.webp);
}

.main-mode-unit.trade-skins a::before {
    background-image: url(img/main-modes/best-trading-sites.webp);
}

.main-mode-unit.topic-skins a::before {
    background-image: url(img/main-modes/skins-by-color.webp);
}

.main-mode-unit.topics a::before {
    background-image: url(img/main-modes/topics.webp);
}

.main-mode-unit.topic-items a::before {
    background-image: url(img/main-modes/skins-by-type.webp);
}

.main-mode-unit.levelup a::before {
    background-image: url(img/main-modes/best-steam-sites.webp);
}

.main-mode-unit.instant-sell a::before {
    background-image: url(img/main-modes/best-instant-selling.webp);
}

.main-mode-unit:hover a::before {
    transform: scale(1.1) rotate(3deg);
    opacity: 1;
}

.main-mode-unit img {
    width: 100%;
    height: auto;
    transition: all .15s ease-in-out;
    display: block;
}

.main-mode-unit::before {
    content: '';
    position: absolute;
    top: 0;
    height: 100%;
    width: 100%;
    background: radial-gradient(815% 120% at 0% 0%, transparent, var(--main-color));
    background-position: center;
    background-repeat: no-repeat;
    transition: opacity .2s ease-in-out;
    opacity: .1;
}

.main-mode-unit:hover::before {
    opacity: 0;
}

.main-mode-selection {
    margin: 0 auto;
    width: 100%;
    min-width: 1272px;
    padding: 0;
    height: 250px;
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    overflow: hidden;
    transition: all .15s ease-in-out;
}

.main-mode-selection.hidden {
    display: none;
}

.main-mode-selection button,
.main-mode-selection .controls-button:hover,
.main-mode-selection .controls-button:first-child {
    transform: unset;
    margin: unset;
    bottom: 20px;
    top: unset;
}


.main-mode-selection .slick-list,
.main-mode-selection .slick-track {
    height: 100% !important;
}

.boxes-holder-section {
    width: auto;
    height: auto;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    position: relative;
}

.boxes-holder-section.big {
    max-width: unset;
    height: auto;
}

.boxes-holder-name h3,
.boxes-holder-name h2 {
    text-align: start;
    width: auto;
    padding: 10px;
    text-transform: uppercase;
    font-size: 12px;
    background-color: var(--darkgray);
    border-radius: var(--main-border) var(--main-border) 0 0;
    z-index: 3;
    display: flex;
    align-items: center;
    color: var(--text-darkgray);
    transition: all .1s ease-in-out;
    text-wrap: nowrap;
    user-select: none;
    position: relative;
}

.boxes-holder-name h3::after,
.boxes-holder-name h2::after {
    content: '';
    position: absolute;
    width: 20px;
    height: 100%;
    background-color: inherit;
    box-sizing: border-box;
    transform: skewX(20deg);
    z-index: -1;
    right: -8px;
    border-radius: 0 5px 0 0;
    top: 0;
}

.boxes-holder-section:hover .boxes-holder-name h3,
.boxes-holder-section:hover .boxes-holder-name h2 {
    color: var(--white);
}

.boxes-holder-name .singlemod-icon.trade-skins::before,
.boxes-holder-name .singlemod-icon.instant-sell::before,
.boxes-holder-name .singlemod-icon.earning::before {
    filter: invert(24%) sepia(65%) saturate(6150%) hue-rotate(319deg) brightness(95%) contrast(250%);
}

.newest-boxes-title-box .singlemod-icon::before {
    opacity: 1;
}

.boxes-holder-section:hover .boxes-holder-name .singlemod-icon.cs2::before,
.boxes-holder-section:hover .boxes-holder-name .singlemod-icon.rust::before,
.boxes-holder-section:hover .boxes-holder-name .singlemod-icon.crypto::before,
.boxes-holder-section:hover .boxes-holder-name .singlemod-icon.steam::before,
.newest-boxes .singlemod-icon::before {
    filter: grayscale(0);
}

.boxes-holder-section .boxes-holder-name .singlemod-icon.trade-skins,
.boxes-holder-section .boxes-holder-name .singlemod-icon.instant-sell,
.boxes-holder-section .boxes-holder-name .singlemod-icon.earning,
.newest-boxes .singlemod-icon {
    filter: grayscale(1) brightness(.8);
}

.boxes-holder-section:hover .boxes-holder-name .singlemod-icon.trade-skins,
.boxes-holder-section:hover .boxes-holder-name .singlemod-icon.instant-sell,
.boxes-holder-section:hover .boxes-holder-name .singlemod-icon.earning,
.newest-boxes:hover .singlemod-icon {
    filter: grayscale(0);
}

.main-page .best::after,
.newest-boxes .best::after {
    content: '';
    opacity: 1;
    height: 20px;
    width: 20px;
    display: flex;
    font-size: 18px;
    align-items: center;
    justify-content: center;
    background-size: 90%;
    transition: all .15s ease-in-out, filter 0s ease-in-out;
    filter: brightness(0) saturate(100%) invert(16%) sepia(69%) saturate(4202%) hue-rotate(339deg) brightness(95%) contrast(90%);
    position: relative;
    background-position: center;
    background-repeat: no-repeat;
    opacity: .25;
    filter: grayscale(1);
}

.main-page .box .logobg .best,
.newest-boxes .box .logobg .best {
    font-size: 0;
    background: var(--darkgray);
    z-index: 11;
    cursor: help;
    height: 30px;
    filter: unset;
}

.box .logobg .upd {
    position: relative;
    width: auto;
    padding: 0 16px;
    margin-right: 8px;
    height: 30px;
    background: var(--buttonbg);
    filter: drop-shadow(1px 1px 4px rgb(10 10 10)) blur(0);
    border-radius: 0 0 var(--main-border) var(--main-border);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 12px;
    transition: all .15s ease-in-out;
    backface-visibility: hidden;
    text-wrap: nowrap;
    user-select: none;
    z-index: 2;
}

.main-page .box .logobg .upd {
    position: absolute;
    margin: unset;
    right: 60px;
}

.main-page .box .logobg .best:hover,
.newest-boxes .box .logobg .best:hover {
    font-size: 12px;
    filter: grayscale(0);
    background: var(--buttonbg);
}

.main-page .box:hover .logobg .best::after,
.newest-boxes .box:hover .logobg .best::after {
    opacity: .4;
}

.main-page .box .logobg .best:hover::after,
.newest-boxes .box .logobg .best:hover::after {
    margin-left: 8px;
    filter: brightness(1) drop-shadow(1px 1px 3px rgb(100 100 100));
    opacity: 1;
}

.boxes-holder-name .boxes-holder-more,
.boxes-holder-modes,
.newest-boxes-more {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: auto;
    height: 80%;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 600;
    background-color: var(--darkgray);
    text-decoration: none;
    border-radius: 5px;
    right: 0;
    position: relative;
    margin-left: 20px;
    margin-bottom: 4px;
    text-wrap: nowrap;
    padding: 0 10px;
    z-index: 1;
}

.newest-boxes-more {
    height: 28px;
    margin-bottom: unset;
    margin-top: 5px;
    margin-left: 21px;
    padding-right: 15px;
}

.boxes-holder-name {
    height: 35px;
}

.boxes-holder-name .boxes-holder-more {
    flex-grow: 1;
    text-align: center;
    padding-left: unset;
    max-width: 200px;
    width: 100%;
}

.boxes-holder-modes {
    right: unset;
    margin-left: 20px;
    color: var(--text-darkgray);
}

.boxes-holder-name .boxes-holder-modes::before,
.boxes-holder-name .boxes-holder-more::before,
.boxes-holder-name .boxes-holder-modes::after,
.newest-boxes-more::before {
    content: '';
    position: absolute;
    width: 20px;
    height: 28px;
    background: inherit;
    box-sizing: border-box;
    transform: skewX(-20deg);
    z-index: -1;
    left: -8px;
    border-radius: 5px;
    bottom: 0;
}

.boxes-holder-name .boxes-holder-more::before {
    transform: skewX(20deg);
    border-radius: 5px 0 0 5px;
}

.boxes-holder-name .boxes-holder-more:nth-child(7) {
    max-width: 100px;
}

.boxes-holder-name .boxes-holder-more:nth-child(7):before {
    transform: skewX(-20deg);
    border-radius: 5px 0 0 5px;
}

.boxes-holder-name .boxes-holder-modes:nth-child(2n)::before {
    transform: skewX(20deg);
    left: -8px;
}

.boxes-holder-name .boxes-holder-modes:nth-child(2n):after {
    transform: skewX(-20deg);
    right: -8px;
    left: unset;
}

.boxes-holder-name .boxes-holder-modes::after {
    transform: skewX(20deg);
    right: -8px;
    left: unset;
}

.boxes-holder-name a:hover,
.newest-boxes-more:hover {
    color: var(--white);
}

.boxes-holder-name a:hover .officon::before {
    opacity: 1;
}

.boxes-holder-name {
    display: flex;
    position: relative;
    width: 100%;
    max-width: 1240px;
    align-items: flex-end;
    justify-content: flex-start;
    border-radius: var(--main-border) var(--main-border) 0 0;
    overflow: hidden;
}

.boxes-holder-name .singlemod-icon,
.newest-boxes-title-box .singlemod-icon {
    margin-right: 8px;
    height: 15px;
    width: 15px;
    background: none;
}

.boxes-holder-name .singlemod-icon::before {
    height: 15px;
    width: 15px;
    opacity: 1;
    filter: grayscale(1);
}

.boxes-holder-list {
    padding: 8px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px;
    border-radius: 0 5px 10px 10px;
    /* background: radial-gradient(300% 100% at 0% 0%, var(--darkgray), rgba(11, 11, 11, .3) 100%); */
    /* box-shadow: inset 0 0 5px 1px var(--darkgray); */
    /* background: var(--darkgray); */
    background: radial-gradient(150% 150% at 50% 0%, var(--darkgray), transparent 70%);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    width: calc(299.5px * 2 + 8px * 2);
    z-index: 3;
}

.big .boxes-holder-list {
    width: calc(304px* 4 + 8px* 3);
}

/* .boxes-holder-section.trade-skins {
    margin-right: -8px;
}

.boxes-holder-section.sell-skins {
    margin-left: -8px;
} */

.big .boxes-holder-list .box {
    width: 300px;
}

.boxes-holder-list .box {
    width: 295.5px;
}

.main-page .mods-box.skins-box .singlemod-box {
    flex-grow: 1;
}

.main-page .box .logobg img {
    max-width: 75%;
    max-height: 50%;
    filter: drop-shadow(0 1px 0 rgb(0 0 0)) drop-shadow(0 1px 0 rgb(0 0 0)) drop-shadow(0 0.1rem 0.15rem rgba(0, 0, 0, 0.2));
}

.main-page .logobg,
.main-page .content,
.main-page .boxes-holder .box:hover .content {
    position: absolute;
    width: 100%;
    height: 100%;
    transition: all .15s ease-in-out;
}

.main-page .logobg {
    transition: unset;
}

.main-page .logobg {
    border-radius: var(--main-border);
}

.main-page .content {
    opacity: 0;
}

.main-page .box:hover .content {
    opacity: 1;
    background: rgba(17, 17, 17, .95)
}

.main-page .content {
    margin-bottom: unset;
}

.main-page .content p {
    margin-top: 3px;
}

.main-page .content p:first-child {
    margin-top: 13px;
}

.main-page .content h4:has(.boxtitle) {
    margin-top: 13px;
}

.main-page .rating-case-single,
.main-page .box:hover .rating-case-single {
    transform: translateY(0);
    padding-bottom: unset;
    background: unset;
    left: 0;
}

.main-page .rating-case-single {
    margin-bottom: 5px;
    margin-left: 5px;
    height: 40px;
    bottom: 0;
}

.main-page .main-mode {
    bottom: 10px;
    background: rgb(14 14 14);
    z-index: 1;
}

.main-page .rating-case-single::before {
    content: none;
}

.payments-button {
    position: absolute;
    right: -64px;
    top: 5px;
    width: 50px;
    height: 50px;
    background-color: var(--darkgray);
    transition: all .15s ease-in-out;
    margin: 5px;
    border-radius: var(--main-border);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 3;
}

.payments-block .payments-button {
    position: relative;
    right: unset;
    top: unset;
    margin: 0;
}

.payments-block.visible .payments-button::before {
    content: none;
}

.payments-button::after {
    background-image: url(/img/icons/gamemodes/filter.svg);
    height: 18px;
    width: 18px;
    opacity: .99;
    filter: grayscale(1) brightness(.82) drop-shadow(0 0 6px rgb(8 8 8));
}

.payments-block {
    position: fixed;
    right: 141px;
    top: 174px;
    width: 170px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    z-index: 2;
}

.payments-block.visible .payments-button:hover {
    transform: unset;
}

.payments-block.stickers {
    right: unset;
    left: 161px;
    top: 228px;
    z-index: -1;
}

.payments-block.stickers .simplefilter-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    background-color: var(--darkgray);
    border-radius: var(--main-border) var(--main-border) 0 0;
    position: absolute;
    width: 45px;
    right: 0;
    top: 0;
}

.simplefilter-icon::before {
    height: 30px;
    width: 30px;
    transform: rotate(8deg);
    margin-bottom: 4px;
    margin-right: 6px;
}

.payments-block.stickers .payments-block-separate:nth-child(1) {
    height: 35px;
}

.payments-block.stickers .payments-block-separate,
.payments-block.stickers.visible .payments-block-separate {
    pointer-events: none;
    width: 100%;
}

.payments-block-separate {
    width: fit-content;
    border-radius: var(--main-border) var(--main-border) 0 0;
    transition: all .15s ease-in-out, padding 0s ease-in-out;
    position: relative;
    z-index: 1;
}

.payment-container input::before {
    content: '';
    background: linear-gradient(180deg, rgb(26 26 26) 0%, rgb(16 16 16) 100%);
    position: absolute;
    left: 2px;
    top: 2px;
    bottom: 2px;
    right: 2px;
    border-radius: 5px;
    z-index: -1;
}

.payment-close-button,
.close-button {
    position: absolute;
    right: 0;
    height: 100%;
    width: auto;
    align-items: center;
    cursor: pointer;
    margin-right: 5px;
    display: none;
    opacity: 0;
    pointer-events: none;
    transition: all .115s ease-in-out;
}

.close-button {
    opacity: 0;
    display: flex;
    height: 30px;
}

.close-button.visible {
    opacity: 1;
    pointer-events: all;
}

.payment-close-button.visible {
    display: flex;
}

.payment-close-button .officon::before,
.close-button .officon::before {
    height: 22px;
    width: 22px;
}

.close-button .officon::before {
    height: 26px;
    width: 26px;
}

.close-button:hover .officon::before {
    opacity: .15;
}

.payments-block .payments-block-separate:nth-child(2) {
    width: auto;
    height: 0;
    border-radius: 0 10px 10px 10px;
    background-color: var(--darkgray);
    overflow: hidden;
    padding: 0;
    margin-top: -10px;
}

.payments-block.visible .payments-block-separate:nth-child(2) {
    overflow: unset;
}

.payments-block .payments-block-separate:nth-child(2) .payment-container:nth-child(2) {
    padding-bottom: 10px;
    margin-top: 6px;
}

.payments-block.visible .payments-block-separate:nth-child(2) {
    height: auto;
    padding: 6px 0;
}

.methodlist .payment-method::before {
    content: '';
}

.methodlist .payment-method::before {
    height: 16px;
    width: 16px;
    min-width: 16px;
    margin-right: 8px;
    transition: all .1s ease-in-out;
    filter: brightness(0) saturate(100%) invert(16%) sepia(69%) saturate(4202%) hue-rotate(339deg) brightness(95%) contrast(90%);
    opacity: .3;
}

.payment-list .payment-method:hover::before,
.payment-list .payment-method.selected::before {
    opacity: 1;
}

.payment-container {
    width: auto;
    height: 30px;
    display: flex;
    position: relative;
    z-index: 1;
    transition: all .15s ease-in-out, z-index 0s ease;
    margin: 0 auto;
    width: 158px;
}

.payment-container input {
    font-size: 14px;
    transition: all .15s ease-in-out, opacity .1s ease-in-out;
    opacity: 0;
    transform: scale(.8);
    pointer-events: none;
    cursor: pointer;
}

.visible .payment-container input,
.visible .payment-close-button {
    opacity: 1;
    transform: scale(1);
    pointer-events: all;
    transition: all .15s ease-in-out, opacity .35s ease-in-out;
}

.payment-container input.active,
.payment-container input:hover {
    background-color: rgb(21 21 21);
}

.payment-container input::placeholder {
    color: rgba(255, 255, 255, .3);
    font-size: 14px;
}

.payment-list {
    transition: all .15s ease-in-out;
    background-color: #0e0e0e;
    max-height: 190px;
    overflow-y: auto;
    overflow-x: hidden;
    position: absolute;
    transform: translateX(-50%);
    top: 25px;
    width: 170px;
    border-radius: var(--main-border);
    margin-top: 0;
    left: 50%;
    display: none;
}

.payment-container:has(.payment-list.visible) {
    z-index: 2;
}

.payment-list.visible {
    display: block;
    animation-duration: 0.15s;
    animation-fill-mode: both;
    animation-name: searchEntrance;
}

.payment-list .payment-method {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-darkgray);
    background-color: #0c0c0c;
    border-radius: 5px;
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, .4);
    padding: 5px 10px;
    display: flex;
    text-wrap: nowrap;
    transition: all .1s ease-in-out;
    cursor: pointer;
    align-items: center;
    justify-content: flex-start;
}

.blog .main-col-info {
    border-radius: var(--main-border);
}

/* .blog .siteleftpannel {
    width: 0;
} */

.blog .siteleftpannel .mods-box {
    left: 14.65%;
}

.blog .text-col-info ul {
    padding: 5px 5px 0 5px;
}

.blog .topic-screenshot {
    width: 100%;
    height: auto;
    overflow: hidden;
    margin-top: 16px;
}

.blog .topic-screenshot img {
    width: 100%;
    height: auto;
    border-radius: var(--main-border);
}

.blog .newest-boxes .box {
    height: 80px;
    width: 200px;
    background: unset;
}

.blog .main-col-info {
    width: 100%;
    background: linear-gradient(200deg, var(--darkgray) 30%, rgba(0, 0, 0, .15) 100%);
}

.blog .topic-grandbox {
    min-height: unset;
    height: auto;
    margin-top: -20px;
    z-index: 10;
}

.blog .instruction {
    padding: unset;
    margin-top: 10px;
    background: unset;
}

.blog .instruction li {
    color: rgba(255, 255, 255, .7);
    font-weight: 400;
    font-size: 15px;
}

.blog .instruction li strong,
.smallreview.criteria li strong {
    color: var(--white);
    font-weight: 500;
    text-transform: none;
    font-size: inherit;
}

.blog .instruction li strong {
    margin: unset;
    margin-right: 8px;
    line-height: unset;
}

.blog .instruction:nth-child(2) {
    filter: none;
}

.blog .instruction li {
    width: 100%;
    line-height: 1.4;
}

.blog .instruction li a {
    color: #616161;
    line-height: unset;
}

.blog .instruction li a:hover {
    color: var(--main-color);
    filter: none;
}

.blog .instruction.points ol li:before {
    width: 8px;
    height: 8px;
    color: transparent;
    background: linear-gradient(90deg, rgb(141, 21, 41), var(--main-color));
    transition: all .15s ease-in-out
}

.blog .item-topic-grandbox .logobg img {
    width: 100%;
    height: auto;
    margin: unset;
    opacity: .7;
}

.blog .mods-box.mods-box.skins-box {
    height: auto;
    margin-top: 0;
    margin-bottom: 0;
}

.blog .mods-main-box {
    flex-wrap: wrap;
}

.blog .mods-box.skins-box .singlemod-box {
    margin: 8px !important;
}

.text-col-info-theme {
    position: relative;
    margin-left: 10px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    width: 100%;
}

.blog .text-col-info-theme {
    margin-left: 0;
}

.instruction h3::before,
.smallreview h2::before,
.smallreview h3::before,
.introduce-craft h2::before {
    content: "";
    position: relative;
    display: block;
    margin-right: 10px;
    width: 8px;
    height: 8px;
    font-size: 24px;
    color: transparent;
    background: linear-gradient(90deg, rgb(141, 21, 41), var(--main-color));
    -webkit-background-clip: text;
    background-clip: initial;
    transition: all .15s ease-in-out;
    border-radius: 30%;
    top: 8px;
}

.blog .main-infobox-mascotte {
    right: unset;
    top: unset;
    left: 50%;
    transform: translate(-50%);
}

.blog .nav-review {
    margin-top: unset;
}

.blog .item-topic-grandbox {
    border-radius: var(--main-border);
}

.blog .item-topic-grandbox .logobg {
    padding: unset;
}

.blog .newest-boxes .box .logobg img {
    max-width: 90%;
    max-height: 50%;
}

.skin-comparision-table {
    width: 98%;
    max-width: 700px;
    height: fit-content;
    margin: 0 auto;
    border-radius: var(--main-border);
    overflow: hidden;
    position: relative;
    margin-top: 10px;
}

.upperline-table,
.vertical-line {
    width: 100%;
    height: 40px;
    display: flex;
}

.vertical-lines-table {
    display: flex;
    height: auto;
    flex-direction: column;
}

.table-unit {
    border-bottom: 1px solid rgb(20 20 20);
    border-right: 1px solid rgb(20 20 20);
    color: rgba(255, 255, 255, .5);
    font-size: 14px;
}

.upperline-table .table-unit:last-child,
.vertical-lines-table .table-unit:last-child {
    border-right: none;
}

.vertical-lines-table .vertical-line:last-child .table-unit {
    border-bottom: none;
}

.table-unit.proffitable {
    color: var(--white);
}

.table-unit .mpercent {
    margin-left: 3px;
    color: rgba(255, 255, 255, .3);
    font-size: 11px;
}

.table-credits {
    font-size: 12px;
    font-weight: 400;
    margin-top: 15px;
    color: rgba(255, 255, 255, .3);
    text-align: center;
}

/* .upperline-table .table-unit:first-of-type {
    opacity: .5;
} */

.upperline-table .table-unit {
    height: 100%;
    width: 20%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.vertical-lines-table .table-unit {
    height: 40px;
    width: 20%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.table-unit a {
    height: auto;
    width: auto;
    display: flex;
    justify-content: center;
}

.table-unit img:hover {
    transform: scale(1.1);
}

.table-unit img {
    height: auto;
    width: auto;
    max-height: 35px;
    transition: all .3s ease-in-out;
}

.table-unit a img {
    height: auto;
    width: 65%;
    max-height: 30px;
}

.blog .topicpage {
    width: 55%;
}

#particleflakeContainer {
    position: absolute;
    left: 0px;
    top: 0px;
    display: none;
}

.particleflake {
    position: fixed;
    background-color: var(--darkgray);
    background-image: url(/img/icons/payments/rust.webp);
    background-size: 60%;
    background-position: center;
    background-repeat: no-repeat;
    user-select: none;
    pointer-events: none;
    border-radius: var(--main-border);
    z-index: -1;
    width: 35px;
    height: 35px;
    /* filter: grayscale(1); */
}

.content .review-button.visit::after,
.box .logobg .best,
.topic-box .best {
    text-shadow: 1px 1px 3px rgb(100 100 100);
}

@keyframes langelementr {

    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.box.hidden,
.box.hidden-deposit,
.box.hidden-withdrawal {
    opacity: 0;
    transform: translateY(-10px) scale(0);
    width: 0;
    height: 0;
    margin: 0;
    transition: all .4s ease-in-out, transform .3s ease-in-out;
    display: none;
}

.box.animate-in {
    animation: fadeInBoxes .4s ease-in-out forwards;
}

.box.hidden-route {
    display: none;
    visibility: hidden;
    animation: none;
}

.boxes-holder:has(.box.animate-in),
.boxes-holder:has(.box.hidden-deposit),
.boxes-holder:has(.box.hidden-withdrawal) {
    justify-content: flex-start;
}

.boxes-holder:has(.box.hidden-deposit) .main-mode-selection,
.boxes-holder:has(.box.hidden-withdrawal) .main-mode-selection,
.boxes-holder:has(.payments-block .payment-method) .main-mode-selection {
    display: none;
}

.box.hidden-withdrawal .logobg,
.box.hidden-withdrawal .content,
.box.hidden-deposit .logobg,
.box.hidden-deposit .content,
.box.hidden-route .logobg,
.box.hidden-route .content {
    opacity: 0;
    transition: all .5s ease-in-out;
    transform: scale(.5);
}

.box.was-hidden {
    opacity: 0;
    transition: none;
}

.box.animate-in .logobg .rating-case-single {
    opacity: 1;
}

@keyframes fadeInBoxes {
    0% {
        opacity: 0;
        transform: translateY(-10px) scale(0);
        width: 0;
        height: 0;
    }

    99% {
        opacity: 1;
        transform: translateY(0) scale(1);
        width: 300px;
        height: 400px;
    }

    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
        z-index: 1;
        width: 300px;
        height: 400px;
    }
}

.pagination-button {
    height: 40px;
    width: 40px;
    margin: 5px;
    border-radius: var(--main-border);
    position: relative;
    z-index: 1;
    border: unset;
    background-color: var(--darkgray);
    color: var(--text-darkgray);
    font-family: TTNormsPro;
    cursor: pointer;
    font-size: 16px;
    font-weight: 600;
    transition: all .15s ease-in-out;
    opacity: 1;
}

.pagination-button.arrow {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pagination-button.arrow::before {
    border-radius: var(--main-border);
}

.pagination-button.arrow .officon.chevron::before {
    height: 20px;
    width: 20px;
}

.pagination-button.disabled .officon::before,
.pagination-button.disabled:active i,
.pagination-button.disabled {
    filter: none !important;
    opacity: .45 !important;
}

.pagination-button.disabled .officon::before {
    opacity: .15 !important;
}

.pagination-holder:has(.pagination-button:last-child:nth-child(1)) {
    display: none;
}

.pagination-button:hover {
    filter: brightness(1.1);
    transform: scale(1.1);
    color: var(--gray);
}

.pagination-button.active {
    color: var(--main-color);
    transform: scale(1.1);
}

/* .pagination-button.active::before {
    background: linear-gradient(-45deg, var(--darkgray) 0%, rgba(43, 0, 16, .85) 100%);
} */

.topic-grandbox.hidden,
.topic-box.hidden {
    display: none;
}

.topic-boxes-holder .topic-grandbox.sticker {
    opacity: 0;
}

.pagination-holder {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    bottom: 0;
    margin-bottom: -32.5px;
    width: 100%;
}

.sticker-crafts .pagination-holder {
    bottom: 8px;
}

@media (display-mode: standalone) {
    body {
        background-color: #0d0d0d;
    }
}

@media screen and (max-width: 1365px) {
    .box-extra-links:has(.mirror-redirect) {
        padding-top: 16px;
    }
    
    .topic-boxes-holder,
    .topic-boxes-holder:has(.pagination-holder) {
        min-height: unset;
        padding-bottom: 45px;
    }

    .promo-box::after {
        content: unset !important;
    }

    .bonus_info {
        display: flex;
        align-items: flex-start;
        height: 50px;
    }

    .sitepage .box .logobg .rating {
        bottom: 20px;
    }

    .more-content {
        margin-bottom: 4px;
    }

    .box.crypto-choice {
        opacity: 1;
    }

    .boxes-holder:not(.main-page) .box .content:has(.review-button.mirror-visit) .tg-app {
        top: 12px;
    }

    .boxes-holder:not(.main-page) .box:hover .content:has(.review-button.mirror-visit) .tg-app {
        top: 12px;
    }

    .site-attention {
        width: 96%;
    }

    .site-attention.notif {
        order: -3;
    }

    .criteria-descriptions {
        gap: 6px;
        margin-top: 0;
        flex-direction: column;
    }

    .smallreview.criteria h3::before {
        filter: grayscale(0);
    }

    .boxreview .smallreview.criteria,
    .smallreview.criteria {
        width: 100%;
    }

    .ssiodox:not(:has(.boxreview)) .criteria-descriptions .smallreview {
        padding: 5px 15px;
    }

    .ssiodox:not(:has(.boxreview)) .criteria-descriptions .smallreview p,
    .ssiodox:not(:has(.boxreview)) .criteria-descriptions .smallreview ol li {
        color: var(--text-lightgray);
    }

    .ssiodox:not(:has(.boxreview)) .criteria-descriptions .smallreview ol li strong {
        color: var(--white);
    }

    .ssiodox:not(:has(.boxreview)) .criteria-descriptions .smallreview ol li::before {
        color: var(--main-color);
    }

    .mirror-redirect .mirror {
        margin: unset;
        margin-right: -4px;
        aspect-ratio: unset;
        background: unset;
    }

    .mirror-redirect .mirror::before {
        background-size: 74%;
    }

    .topic-filter .singlemod-box:nth-child(2),
    .topic-filter .singlemod-box:nth-child(3) {
        order: -1;
    }

    .topic-filter input.singlemod-box {
        width: 41%;
    }

    .skin-price-info {
        font-size: 12px;
    }

    .navigation-weapon-type {
        font-size: 12px;
    }

    .singlemod-select.back-button::before {
        opacity: .6;
    }

    .crafting-table-screen .skin {
        width: 60px;
        height: 60px;
        left: 9px;
        bottom: 9px;
    }

    .crafting-table-screen:has(.crafting-table-screen-description) .skin {
        z-index: 1;
    }

    .topic-filter {
        margin-bottom: unset;
        height: auto;
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
        margin: unset;
    }

    .topic-box,
    .topic-box.maestro {
        width: 32%;
        flex-grow: 1;
    }

    .topic-box .content span {
        font-size: 13px;
    }

    .topic-filter .singlemod-box.active,
    .topic-filter .singlemod-box:hover {
        transform: scale(1);
    }

    .topic-filter .singlemod-select img {
        max-width: 22px;
        max-height: 30px;
        width: auto;
        height: auto;
    }

    .big-category a::before,
    .big-category .nonredir::before {
        content: unset;
    }

    .box-extra-links:has(.more-crafts) {
        bottom: 7px;
        z-index: 3;
    }

    .box-extra-links .promo-box {
        display: none;
    }

    .box-extra-links .promo-box.counter-1 {
        display: flex;
    }

    .more-crafts span {
        font-size: 12px;
        color: var(--gray);
    }

    .box-skins.solo .box-skins-list .skin .skin-price-info {
        margin-left: 14px;
    }

    .preview-extras .skin-price-info {
        top: -260px;
    }

    .payments-block.stickers {
        display: none;
    }

    .object .crafting-table-screen::before {
        top: unset;
    }

    #preview-showcase {
        filter: unset;
    }

    .topic-box .logobg,
    .topic-box .logobg.skincolors {
        margin: 5px;
    }

    .topic-grandbox::after {
        width: calc(100% - 10px);
        margin-bottom: 6px;
    }

    .boxes-holder-name h3,
    .boxes-holder-name h2,
    .newest-boxes-more,
    .newest-boxes-title-box span,
    .main-infobox-content-text p,
    .topic-box .content span {
        color: var(--text-lightgray);
    }

    .boxes-holder-name h3 {
        flex-grow: 1;
    }

    .singlemod-select span,
    .boxes-holder-name .boxes-holder-more,
    .main-page .box .logobg .best,
    .newest-boxes .box .logobg .best,
    .boxes-holder-modes,
    .boxes-holder-name a {
        color: rgb(255, 255, 255, .35);
    }

    .lang-menu {
        border: 1px rgba(255, 255, 255, .45) solid;
    }

    .instruction-mirrors ol {
        height: auto;
        flex-wrap: nowrap;
    }

    .selected-lang {
        color: rgba(255, 255, 255, .45);
    }

    .rating-case-single .rating-summ {
        opacity: .8;
    }

    .topic-box .content span {
        opacity: 1;
    }

    .mini-info {
        flex-direction: row;
        flex-wrap: wrap;
        width: 90%;
        margin-bottom: 20px;
        font-size: 13px;
        padding: 10px;
    }

    .mini-info .stronged {
        font-size: 13px;
    }

    .boxes-holder .rating-case-single .star_rating {
        filter: none;
    }

    .mods-box.topic .singlemod-select img {
        filter: grayscale(1) brightness(1.8);
    }

    .boxes-holder-section .boxes-holder-name .singlemod-icon::before {
        filter: grayscale(0);
    }

    .boxes-holder-section .boxes-holder-name .singlemod-icon.trade-skins,
    .boxes-holder-section .boxes-holder-name .singlemod-icon.instant-sell,
    .boxes-holder-section .boxes-holder-name .singlemod-icon.earning,
    .newest-boxes .singlemod-icon {
        filter: unset;
    }

    .boxes-holder-section .boxes-holder-name .singlemod-icon.trade-skins::before,
    .boxes-holder-section .boxes-holder-name .singlemod-icon.instant-sell::before,
    .boxes-holder-section .boxes-holder-name .singlemod-icon.earning::before,
    .newest-boxes .singlemod-icon::before {
        filter: brightness(0) saturate(100%) invert(16%) sepia(69%) saturate(4202%) hue-rotate(339deg) brightness(95%) contrast(90%);
        opacity: 1;
    }

    .officon::before {
        opacity: .45;
    }

    .officon.star_rating::before {
        opacity: 1;
    }

    .category-selector .category-box .category-box-logo img {
        opacity: 1;
        filter: brightness(2) drop-shadow(0 0 6px rgb(8 8 8));
    }

    .category-selector .category-box.active .category-box-logo img,
    .category-selector .category-box.current .category-box-logo img {
        filter: drop-shadow(0 0 6px rgb(8 8 8));
    }

    .box .main-mode {
        background: rgb(21 21 21);
    }

    .boxes-holder .box:hover .content .defbutton {
        filter: none;
    }

    .content button,
    .content .defbutton::before,
    .content .review-button.mirror-visit,
    .content .review-button.mirror-visit::before {
        background-color: rgb(11 11 11);
        filter: none;
    }

    .boxes-holder .box .rating-case-single,
    .boxes-holder .box .rating-case-single::before,
    .boxes-holder .box:hover .rating-case-single,
    .boxes-holder .box:hover .rating-case-single::before,
    .boxes-holder .box .logobg .route,
    .boxes-holder .box .logobg .route::before,
    .boxes-holder .box:hover .logobg .route,
    .boxes-holder .box:hover .logobg .route::before {
        background: rgb(19 19 19);
    }

    .main-page .box .rating-case-single,
    .main-page .box .rating-case-single::before,
    .main-page .box:hover .rating-case-single,
    .main-page .box:hover .rating-case-single::before {
        background: unset;
    }

    :root {
        --opacback: var(--darkgray);
    }

    .sitepros,
    #FAQ,
    .pages,
    .category-selector,
    #notexist,
    .box {
        transform: translateZ(0);
    }

    .lang-menu ul li a i,
    .lang-menu ul li a {
        opacity: 1;
        color: var(--white);
    }

    .info-block,
    .sitepage.closed .info-block {
        order: -2;
        width: 90%;
        margin-top: -10px;
    }

    .sitepage.closed .boxreview:has(.features) {
        margin-top: 0;
    }

    .sitepage.closed .shortinfo {
        display: none;
    }

    .sitepage.closed .info-block {
        margin-top: 6px;
    }

    #theme-toggle,
    #particles-toggle {
        font-size: 16px;
        order: -1;
    }

    #particles-toggle {
        display: none;
    }

    .main-infobox {
        width: 96%;
        max-width: 800px;
        flex-direction: column;
        align-items: center;
        margin-top: 8px;
        z-index: 100;
        order: 1;
    }

    .shortinfo {
        height: auto;
        border-radius: unset;
        justify-content: center;
        background: var(--darkgray);
        margin-top: 8px;
        padding-bottom: 16px;
    }

    .shortinfo .features {
        margin-left: unset;
    }

    .main-infobox-content {
        width: 100%;
    }

    .box .main-mode {
        right: 10px;
    }

    .boxreview .main-infobox-content {
        width: 98%;
    }

    .main-infobox-content::before {
        left: 50%;
        transform: translateX(-50%) rotate(90deg);
        height: 70px;
        top: -45px;
    }

    .main-infobox-content::after {
        content: unset;
    }

    .main-infobox-mascotte {
        height: 65px;
        width: 65px;
        min-width: unset;
        margin-right: unset;
        right: unset;
        left: 50%;
        transform: translateX(-50%);
        position: absolute;
        z-index: 3;
        top: -40px;
    }

    .main-infobox-content.second {
        margin-left: unset;
        margin-top: -20px;
    }

    .main-infobox-mascotte::after,
    .main-infobox-mascotte::before {
        top: 6px;
        left: 6px;
        width: 80%;
        height: 80%;
    }

    .main-infobox-content-text ul li p {
        font-size: 13px;
    }

    .nav-review {
        width: 100%;
        border-radius: 0;
        margin-top: 0;
        box-shadow: unset;
    }

    .nav-review li,
    .nav-review.blog li {
        line-height: 24px;
        text-align: start;
        padding-left: unset;
        padding-left: unset;
        color: var(--white);
        width: 100%;
        break-inside: avoid;
    }

    .nav-review li.current {
        background: unset;
    }

    .nav-review li::before {
        opacity: 1;
    }

    .bonus_info::before {
        display: none;
    }

    .sitealternates .box .logobg {
        height: 43%;
        background: none;
        overflow: unset;
    }

    .main-infobox-content-text p {
        font-size: 13px;
    }

    .sitealternates .box .content {
        height: 52%;
    }

    .sitepage .box .logobg .rating,
    .sitepage .box .logobg .rating::after,
    .sitepage .box .logobg .rating::before {
        background: unset;
    }

    .sitealternatesboxes .content .review-button,
    .rec-box .content .review-button {
        height: 25px;
        padding: 0 5px;
        padding-right: 3px;
        padding-left: 9px;
        font-size: 11px;
    }

    .sitealternatesboxes .content .review-button.visit,
    .rec-box .content .review-button.visit {
        padding-right: 9px;
        padding-left: 3px;
    }

    .submenu2 li:hover,
    ul .submenu li:hover {
        margin-left: unset;
    }

    .nav-review ol {
        display: block;
        height: auto;
        width: 80%;
        column-count: 2;
        margin-left: 20px;
    }

    .nav-review li:hover {
        transform: unset;
    }

    .section {
        max-width: 90%;
    }

    .weapon-selection-unite {
        border-bottom: 2px solid rgba(0, 0, 0, .35);
    }

    .topic-nav-menu span {
        font-size: 13px;
    }

    .instruction-mirrors li {
        width: 85%;
    }

    .instruction-mirrors {
        padding: 15px 0;
    }

    .boxreview#mirror .features {
        order: 1;
    }

    .site-attention.blocked {
        background: unset;
        padding: 30px 10px;
        margin: 0 auto;
    }

    .alternates-title {
        top: 0;
    }

    .gamemodes {
        position: relative;
        order: 1;
        bottom: 0;
        width: 100%;
    }

    .preview-buttons,
    .preview-nav-button,
    #preview-showcase:hover .preview-nav-button {
        opacity: 1;
    }

    .preview-nav-button {
        top: 40%;
        width: 50px;
        height: 50px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .inspect-craft .preview-nav-button {
        top: 50%;
    }

    #preview-showcase .preview-extras {
        bottom: 130px;
        width: 80%;
    }

    .skin-extra-info a {
        opacity: 1;
    }

    .topic-box.maestro {
        border-radius: var(--main-border);
    }

    .topic-boxes-holder:has(.topic-box.maestro) {
        margin-top: 4px;
    }

    .instruction.double {
        width: 96%;
        margin-left: unset;
        padding: 30px 0;
        border-radius: var(--main-border);
    }

    .instruction.notmain {
        padding-top: 0;
    }

    .instruction.notmain h3,
    .instruction.notmain li a,
    .instruction.notmain li::marker,
    .instruction.notmain li strong {
        color: var(--gray);
    }

    .navigation-reset {
        left: 50%;
        top: 380px;
    }

    .topic-box .logobg,
    .topic-box .logobg.skincolors,
    .topic-box.items .logobg {
        background-color: rgba(0, 0, 0, .15);
        height: 115px;
    }

    .sitepage .topic-box .logobg,
    .sitepage .topic-box .logobg.skincolors,
    .sitepage .topic-box.items .logobg {
        height: 160px;
    }

    .sitepage .sticker-crafts-list .topic-box .logobg {
        height: 100%;
    }

    .topic-box .logobg img {
        height: 100%;
    }

    .topic-box .content {
        background-color: rgba(0, 0, 0, .25);
    }

    .box .logobg img {
        max-width: 80%;
        width: auto;
    }

    .box.main .logobg img {
        max-width: unset;
        max-height: unset;
    }

    .box.main .content h4 {
        margin-top: 5px;
    }

    .box.main .content-buttons {
        margin-top: unset;
    }

    .rating-case-single {
        transform: translateY(0) !important;
    }

    .boxes-holder .box .logobg:has(div.route) .main-mode {
        bottom: 50px;
    }

    .main-page .box .logobg:has(div.route) .main-mode {
        bottom: 10px;
    }

    .boxes-holder .box .logobg .route,
    .boxes-holder .box .logobg .route::before {
        background: rgb(17 17 17);
    }

    /* .rating-case-single,
    .boxes-holder .rating-case-single::before,
    .box .logobg .route,
    .box .logobg .route::before,
    .boxes-holder .box .content {
        background: rgb(21 21 21);
    } */

    .boxes-holder .box .content::before {
        opacity: 1;
        visibility: visible;
    }

    .rating-case-single,
    .boxes-holder .rating-case-single::before,
    .box .logobg .route,
    .box .logobg .route::before {
        background: inherit;
    }

    .rating-case-single,
    .boxes-holder .rating-case-single::before,
    .box .logobg .route,
    .box .logobg .route::before,
    .boxes-holder .box .content,
    .content .boxtitle,
    .box .content {
        transition: .15s all ease-in-out;
    }

    .newest-boxes .box .content {
        display: none;
    }

    .newest-boxes .box:hover .logobg {
        filter: unset;
    }

    .rating-case-single {
        background: rgb(15 15 15);
    }

    body {
        background: unset;
        background-color: rgb(20, 20, 20);
    }

    .mods-box {
        position: relative;
        left: unset;
        top: unset;
        width: 100%;
        height: 50px;
        order: -2;
    }

    .mods-box:has(.back-button) {
        top: unset;
        left: unset;
    }

    .mods-box.skins-box {
        order: -1;
    }

    .siteleftpannel .mods-box.topic .singlemod-box {
        margin: unset;
    }

    .singlemod-box[data-title]:hover:after {
        display: none;
    }

    .mods-box.topic {
        max-width: 1050px;
        height: unset;
    }

    .mods-box.topic .singlemod-box {
        width: 100%;
    }

    .mods-box.topic .singlemod-select img {
        height: 50%;
        width: auto;
    }

    .slider-container {
        width: 85%;
    }

    .sitepage.topic .slider-container,
    .sitepage.topic-craft .slider-container {
        order: 1;
    }

    .rec-box::before {
        left: 6px;
        right: 6px;
        top: 6px;
        bottom: 6px;
    }   

    .topicpage .slider-container {
        width: 98%;
        margin: 4px;
    }

    .crafting-table-screens .slick-dots {
        top: -30px !important;
    }

    .slick-dots {
        top: 5px !important;
    }

    .slick-slider img {
        width: 100%;
    }

    .slider-container .slick-arrow,
    .slider-container .slick-dots {
        opacity: 1 !important;
        transform: translateX(0) !important;
    }

    .slider-container button:hover i {
        font-size: 30px !important;
    }

    .sitepage.items .slider-container {
        left: unset;
        margin-bottom: 5px !important;
        width: 98%;
    }

    .boxes-holder .mods-box.skins-box {
        margin: unset;
        min-height: 40px;
        height: auto;
    }

    .boxes-holder:has(.box.hidden-deposit) .mods-box.mods-box.skins-box,
    .boxes-holder:has(.box.hidden-withdrawal) .mods-box.mods-box.skins-box,
    .boxes-holder:has(.box.animate-in) .mods-box.mods-box.skins-box {
        margin-left: unset;
        width: 100%;
    }


    .instruction.double h3 {
        font-size: 18px !important;
    }

    .singlemod-select span {
        font-size: 12px;
    }

    .mods-main-box {
        flex-direction: row;
        margin: 0 auto !important;
        gap: 6px;
    }

    .topic .mods-main-box {
        width: 100%;
    }

    .mods-box.skins-box .singlemod-box,
    .mods-box.skins-box .singlemod-box:first-child,
    .mods-box.skins-box .singlemod-box:last-child {
        margin: 0;
        height: 40px;
        width: auto;
    }

    .singlemod-icon {
        height: 32px;
        width: 32px;
    }

    .mods-box:not(.skins-box) .singlemod-box {
        flex-grow: 0;
    }

    .singlemod-select img {
        width: auto;
        max-height: 50%;
        max-width: 60%;
        filter: grayscale(1) brightness(1.7) drop-shadow(0 0 6px rgb(8 8 8));
    }

    .payments-button::after {
        filter: grayscale(1) brightness(1.7) drop-shadow(0 0 6px rgb(8 8 8));
    }

    div.category:first-child .category-box {
        margin: 8px 4px 0 0 !important;
    }

    #notexist .category-box {
        margin: 8px 4px 0 4px !important;
    }

    .topic-nav-box {
        display: flex;
    }

    .newest-boxes {
        max-width: 100%;
        margin: 0 auto;
        margin-top: 42px;
        width: auto;
        height: 100%;
        justify-content: center;
        display: flex;
        flex-wrap: wrap;
        left: unset;
        transform: unset;
        border-radius: 0 10px 10px 10px;
        background-color: var(--darkgray);
        padding-bottom: 8px;
    }

    .newest-boxes-title-box {
        border-radius: var(--main-border) 0 0 0;
    }

    .newest-boxes-title-box::after {
        transform: skewX(20deg);
        border-radius: 0 5px 0 0;
    }

    .newest-boxes-title {
        width: 100%;
        bottom: unset;
        top: -34px;
    }

    .newest-boxes.topic {
        left: unset;
        transform: unset;
        margin-top: unset;
    }

    .newest-boxes .box {
        height: 80px;
        width: 182px;
    }

    .box .logobg .best::after {
        display: none;
    }

    .main-page .box .logobg .best,
    .newest-boxes .box .logobg .best {
        font-size: 11px;
        text-shadow: none;
    }

    .box .logobg .best,
    .topic-box .best {
        filter: unset;
    }

    .main-page .box:hover .logobg .best,
    .main-page .box:hover .logobg .bonuses-block {
        opacity: 0;
    }

    .sitetoppannel {
        display: none;
    }

    .ssiodox {
        background: unset;
        display: flex;
        flex-direction: column;
    }

    .ssiodox.nondef {
        background: linear-gradient(180deg, var(--darkgray), transparent 300px);
    }

    .topic-grandbox,
    .sitepage.topic-craft .topic-grandbox,
    .topic-boxes-holder .topic-grandbox.sticker {
        width: 100%;
        height: auto;
        border-radius: var(--main-border);
        z-index: 101;
        top: 0;
    }

    .sitepage.cases .topic-grandbox,
    .sitepage.items .topic-grandbox {
        border-radius: 0;
    }

    .item-topic-grandbox {
        width: 100%;
        top: 0;
    }

    .section.second {
        width: 100%;
        margin-top: 17px;
    }

    .topic-boxes-holder .topic-grandbox.sticker {
        width: 48%;
        height: 190px;
        min-height: unset;
        padding-bottom: 10px;
        flex-grow: 1;
        z-index: 2;
    }

    .topic-boxes-holder .topic-grandbox.sticker .section.first span {
        font-size: 11px;
        white-space: nowrap;
        text-transform: none;
    }

    .topic-boxes-holder .topic-grandbox.sticker .section.first,
    .topic-boxes-holder .topic-grandbox.sticker .section.second,
    .topic-boxes-holder .topic-grandbox.sticker .section.third {
        top: unset;
        padding: 3px 0;
    }

    .sticker .section.first {
        gap: 2px;
        margin-top: 6px;
        flex-direction: column;
    }

    .sitepage.topic-craft .section.first span,
    .topic-boxes-holder .topic-grandbox.sticker .section.first span,
    .topic-boxes-holder .topic-grandbox.sticker .section.first .craft-name {
        margin: unset;
    }

    .topic-boxes-holder .topic-grandbox.sticker .section.second {
        padding-top: 0;
    }

    .topic-boxes-holder .topic-grandbox.sticker .section.third {
        flex-wrap: nowrap;
        height: 40px;
        width: 90%;
    }

    .topic-boxes-holder .topic-grandbox.sticker .topic-box {
        position: relative;
        height: 90px;
        z-index: 10;
    }

    .topic-boxes-holder .topic-grandbox.sticker .section.second span,
    .topic-boxes-holder .topic-grandbox.sticker .section.first::after,
    .sitepage.topic-craft .topic-grandbox .section.first::after {
        text-align: center;
        width: 95%;
        font-size: 10px;
        margin-bottom: unset;
    }

    .sitepage.topic-craft .topic-grandbox .section.first::after {
        font-size: 14px;
    }

    .topic-grandbox .skin img {
        height: 92%;
        width: auto;
    }

    .topic-boxes-holder .topic-grandbox.sticker .topic-box .logobg img {
        max-height: 60%;
        max-width: 80%;
        margin-top: 20px !important;
        margin: unset;
    }

    .topic-grandbox .topic-box {
        width: 100%;
    }

    .sitepage.topic-craft .section.third {
        height: auto;
        top: -10px;
    }

    .sitepage.topic-craft .section.second {
        width: 100%;
        margin-bottom: 0;
    }

    .sitepage.topic-craft .crafting-table {
        margin-bottom: 4px;
        padding-top: 40px;
    }

    .crafting-table-screens.object img {
        margin-top: unset;
    }

    .crafting-table-screens.object.combined img {
        margin-left: 350px;
        margin-top: 190px;
        max-width: 260%;
    }

    .crafting-table-screens.object {
        background-position: center;
    }

    .crafting-table-screens {
        overflow: unset;
    }

    .crafting-table-screen-description {
        height: auto;
    }

    .crafting-table-screen-description p {
        margin: unset;
    }

    .introduce-craft p,
    .introduce-craft span {
        font-size: 15px;
        margin-top: 8px;
    }

    .topic-boxes-holder {
        max-width: 98%;
        min-height: 400px;
        width: 100%;
    }

    .sitepage.topic .siteblock,
    .topic-centralizer,
    .sitepage.topic-craft .siteblock {
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
        margin: 0 auto;
        border-radius: var(--main-border);
    }

    .topic-centralizer {
        width: 100%;
    }

    .section.second .colors-box {
        margin-top: 3px;
    }

    .instruction-mirrors li a:active {
        background-color: #a81d34 !important;
        border: 2px solid #ce203d !important;
        transition: .09s all ease-in-out !important;
    }

    .rec-box,
    .sitepage.topic-craft .rec-box {
        width: 49%;
        border-radius: var(--main-border);
        opacity: 1;
        z-index: 1;
        flex-grow: 1;
    }

    .rec-box .logobg a {
        /* width: 80%; */
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .rec-box .content {
        padding-top: 6px;
        padding-bottom: unset;
    }

    .rec-box .content p {
        width: 90%;
        font-size: 13px !important;
    }

    .rec-box .content-buttons {
        height: 38px;
        transform: unset;
        opacity: 1;
    }

    .rec-boxes {
        display: flex;
        position: relative;
        width: 98%;
        gap: 4px;
        margin-top: 4px;
    }

    .rec-boxes .rec-box:nth-child(3) {
        display: none;
    }

    .sitepage.topic-craft .slick-slider {
        margin-top: 4px;
    }

    .rec-box.active {
        animation: unset;
    }

    .box-skins {
        margin: 4px 0 0 0 !important;
        width: 98%;
        background: var(--opacback);
    }

    .box-skins.character {
        width: calc(100% - 8px);
        margin-top: 2px !important;
    }

    .box-skins-nav {
        width: 98%;
        margin: 4px 0 0 0;
    }

    .sitepage.items .box-skins {
        width: 98%;
        padding-left: unset;
        background-color: unset;
        margin: unset !important;
    }

    .settings-menu {
        display: none;
    }

    h2 {
        font-size: 18px;
    }

    .buttons-container {
        display: none;
    }

    .slider-placer.topic {
        left: unset;
    }

    .content p:nth-child(3) {
        justify-content: center;
        position: relative;
        font-size: 10px;
        width: 80%;
    }

    .boxdefaultpage {
        width: 100%;
        padding-top: 10px;
    }

    .extra-abox {
        width: max-content;
        height: auto;
        padding: 5px 0;
        margin: 0 auto;
        box-shadow: unset;
        background-color: var(--darkgray);
        border-radius: unset !important;
    }

    .promo-box {
        height: 80px;
        width: 80%;
        filter: grayscale(0);
        background-color: unset;
        border: unset;
    }

    .promo-box.show,
    .box-extra-links:has(.mirror-redirect) .promo-box.show,
    .box-extra-links:has(.partner-site) .promo-box.show {
        margin: 0 auto;
        border: unset;
        animation: unset;
    }

    .promo-box .content {
        width: 85%;
    }

    .promo-box .content .defbutton {
        bottom: 0px;
    }

    .promo-box .content .defbutton:hover {
        transform: scale(1.09) translateY(-50%) !important;
    }

    .promo-box .content .defbutton::before {
        content: unset;
    }

    .promo-box p, 
    .promo-box .content p:first-child,
    .promo-box .content .promo-code-desc::before {
        color: var(--gray);
    }

    .promo-box code {
        color: var(--white);
    }

    .promo-box .site-promo-copy::after {
        opacity: .35;
    }

    .promo-box .copy .copied-title {
        display: block !important;
    }

    .extra-abox.promo-box:hover {
        transform: unset;
    }

    .mirror-redirect {
        position: absolute;
        z-index: 10;
        top: -15px;
        left: 50%;
        transform: translateX(-50%);
        padding: 0;
        background: unset;
        width: auto;
    }

    .mirror-redirect:hover {
        transform: translateX(-50%) scale(1.02);
    }

    .partner-site {
        margin-top: 10px;
    }

    .partner-site::before {
        content: none;
    }

    .mirror-redirect span {
        font-size: 12px;
        padding: 4px 8px;
        color: var(--gray);
    }

    .content .defbutton {
        display: none;
    }

    .box.main .content a.tg-app {
        left: 70px;
        top: 4px;
    }

    .partner-site img {
        padding: 5px 15px;
        border-radius: var(--main-border);
        background-color: rgb(18 18 18);
        filter: drop-shadow(0 0 1px rgb(50 50 50));
    }

    .boxes-holder,
    .topic-boxes-holder {
        padding: unset;
        gap: 8px;
        margin-top: 4px;
    }

    .boxes-holder {
        max-width: 98%;
        margin: 0 auto;
        width: auto;
        height: 100%;
        justify-content: center;
        display: flex;
        flex-wrap: wrap;
        margin-top: 4px;
    }

    .category-selector {
        max-width: 96%;
        width: unset !important;
        justify-content: center;
        height: 80px;
        top: 80px;
        display: flex;
    }

    .submenu2 li a {
        justify-content: center !important;
    }

    .category-selector.current {
        height: 100%;
        background-color: rgba(12, 12, 12, .9);
        transform: translateZ(0);
        z-index: 10;
        position: fixed;
        max-width: 100%;
        padding: 0 4px;
        z-index: 1000;
    }

    #notexist.current {
        background-color: unset;
        max-height: 100%;
    }

    .category-selector .category {
        height: 80px;
        position: static;
        flex-grow: 1;
    }

    .category-selector#notexist .category {
        flex-grow: unset;
    }

    .category-selector .category .submenu,
    .category-selector .category:hover .submenu {
        display: none;
        visibility: hidden;
    }

    .category-selector.current .category .submenu.current {
        display: block;
        visibility: visible;
        max-height: 400px;
        overflow-y: scroll !important;
        border-radius: var(--main-border);
    }

    .category-selector.current .category .submenu.current::-webkit-scrollbar {
        width: 0;
    }

    .category-selector .category .submenu {
        margin-left: unset;
        position: absolute;
        left: 50%;
        transform: unset;
        width: 90%;
    }

    #notexist .category .submenu {
        transform: translateX(-50%);
    }


    .submenu li {
        background: var(--darkgray);
    }

    .big-category.active a,
    .submenu .big-category a:hover,
    .submenu li:hover a {
        background-color: rgb(18 18 18);
    }

    .submenu li a,
    .submenu li .nonredir {
        box-shadow: 0 0 8px 0 rgba(0, 0, 0, .6);
        background-color: rgb(23 23 23);
        margin: 2px;
    }

    .category-selector .submenu,
    .category-selector .submenu2 {
        display: none;
        overflow: hidden !important;
        height: unset;
    }

    .category .submenu li a,
    .category .submenu li .nonredir {
        padding: 8px 10px !important;
        font-size: 11px;
        font-weight: 600;
        text-align: center;
        justify-content: center;
        color: var(--white);
    }

    .category .submenu li a::after {
        margin-left: 10px;
    }

    .category-selector div.category:hover .category-box .category-box-logo,
    .category-selector div.category .category-box .category-box-logo:hover {
        filter: grayscale(1);
        background-color: unset;
    }

    .category-selector.current .category-box.current .category-box-logo,
    .category-selector.current .category-box:hover .category-box-logo {
        filter: grayscale(0) !important;
    }

    .submenu .big-category a:hover,
    .submenu2 a:hover {
        color: var(--white);
    }

    .submenu .big-category.active a {
        color: var(--main-color);
        box-shadow: unset;
        transition: unset !important;
        font-size: 12px;
    }

    .submenu .big-category.active .submenu2 a {
        color: var(--white);
        font-size: 11px;
    }

    .submenu .big-category.active a i {
        font-size: 16px;
        margin-left: 5px;
    }

    .category-selector .category:hover .submenu,
    .submenu.current {
        z-index: 90;
        opacity: 1;
        transition: opacity ease-in-out .15s;
        margin-top: 88px;
        position: fixed;
    }

    .submenu .big-category:nth-child(1) {
        margin-top: unset;
    }

    .submenu .big-category {
        border-radius: 5px;
    }

    .big-category.current a {
        color: var(--main-color);
        background: linear-gradient(15deg, rgba(255, 255, 255, .6) 30%, rgba(0, 0, 0, 0) 100%);
    }

    #notexist ul li:hover .submenu,
    #notexist.current .category .submenu {
        position: absolute;
        left: 50%;
        margin-top: 20px !important;
    }

    .category-centralizer.nav .category-box {
        background: rgb(18 18 18);
    }

    .category-box.current {
        background: rgb(23 23 23);
    }

    .category-centralizer.nav .category:hover .category-box {
        background: rgb(23 23 23);
    }

    .category-centralizer.nav .category:hover .category-box {
        background: rgb(18 18 18);
    }

    .category-centralizer.nav .category:hover .category-box.current {
        background: var(--darkgray) !important;
    }

    .category-centralizer.nav .category-box-logo {
        background: none !important;
    }

    .category-selector .submenu2 {
        width: 100% !important;
        height: 100%;
        margin-top: unset !important;
        margin-left: unset !important;
        left: 0;
        margin-right: 2px;
    }

    #notexist .submenu {
        top: 150px;
    }

    .category-selector .submenu2 {
        opacity: 0 !important;
        visibility: hidden !important;
        display: none !important;
        top: unset;
        position: relative !important;
    }

    .category-selector .submenu,
    .category-selector .submenu2 {
        transform: unset;
    }

    ul .big-category.active .submenu2 {
        opacity: 1 !important;
        display: block !important;
        visibility: visible !important;
        z-index: 100;
    }

    .big-category.active .nonredir {
        color: var(--main-color);
    }

    .nav-bar {
        background-color: rgba(12, 12, 12, .85);
    }

    .category-centralizer.nav {
        margin-top: 80px;
        justify-content: unset;
    }

    .spaceblock {
        height: 202px;
    }

    .nondef .spaceblock {
        background: var(--darkgray);
    }

    .category-selector .category-box {
        margin: 8px 4px 0 4px !important;
        width: 204px;
        height: 70px;
        width: 70px;
        overflow: hidden;
        flex-grow: 1;
    }

    .category-selector .category .category-box .category-box-logo {
        width: 100%;
        transform: unset;
        background: unset;
    }

    .category-selector .category-box .category-box-content {
        display: none;
    }

    .features .featuresbox .typesinside,
    .gamemodes .featuresbox .typesinside {
        justify-content: center;
        flex-wrap: wrap;
        gap: unset;
    }

    .pages h1,
    #PageSubt {
        font-size: 16px;
        text-align: center;
    }

    .content p:nth-child(2) {
        width: 200px;
        height: 60px;
    }

    .socials {
        display: none !important;
    }

    .sitepage .box.main {
        border-radius: 0 !important;
        width: 100% !important;
    }

    .box.skin-navigator {
        display: none;
    }

    .sitealternatesboxes {
        gap: 6px;
    }

    .sitealternates .box {
        width: 24.5%;
        height: 250px;
    }

    .navigation-menu {
        display: none;
    }

    .boxreview,
    .topicpage,
    .sitepage.items .topicpage,
    .sitepage.topic-craft .topicpage {
        left: 0;
        margin: 0 auto;
        width: 100%;
        display: flex;
        justify-content: center;
        min-height: unset;
    }

    .sitepage.topic-craft .topicpage {
        width: 98%;
    }

    .boxreview {
        border-radius: 0;
        background: linear-gradient(180deg, var(--darkgray) 30%, rgba(0, 0, 0, 0) 100%);
        padding-top: unset;
    }

    .boxreview:has(.features) {
        margin-top: unset;
    }       

    .sitepage.topic-craft .topicpage {
        margin-top: 4px;
        min-height: 300px;
        padding-bottom: 4px;
    }

    .boxreview .plusminus {
        flex-wrap: nowrap;
        flex-direction: column;
        align-items: center;
        height: 100%;
        margin-top: unset;
    }

    .boxreview .plusminus .criteria {
        width: 100%;
        min-height: unset;
        padding-bottom: 40px;
    }

    .boxreview .plusminus .criteria .par h2 {
        position: static;
    }

    .boxreview .smallreview {
        margin-top: 9px;
    }

    .smallreview::after {
        bottom: -15px;
    }

    .boxreview .smallreview,
    .instruction,
    .boxreview .plusminus,
    .screentable,
    .sitedetails,
    .ratingsumm,
    .criteria-descriptions,
    .sitealternates,
    .boxreview .slider-container {
        width: 96%;
    }

    .boxreview .main-infobox {
        margin-top: 6px;
        width: 98%;
    }

    .ssiodox:not(:has(.boxreview)) .criteria-descriptions {
        width: 100%;
        margin-top: 8px;
        column-count: 1;
    }

    .instruction.notmain {
        opacity: 1;
        filter: unset;
        width: 96%;
        margin-left: unset;
        padding: 30px 0;
        border-radius: var(--main-border);
    }

    .screens .next-button,
    .screens .prev-button {
        transform: translateX(0);
        opacity: 1;
    }

    .sitepage .box.main .content {
        background: unset;
        margin: unset;
    }

    input+label::after {
        height: 210px !important;
    }

    .credits {
        position: relative;
    }

    .contact {
        width: 100%;
        position: relative;
        justify-content: center;
        order: -1;
        margin-bottom: 10px;
    }

    .contact .contact-box {
        margin: auto;
    }

    footer .centralizer {
        width: 95%;
    }

    footer .centralizer .footer-content {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        height: unset;
    }

    .sitedetails .sitepros.active {
        height: 100%;
    }

    .instruction li {
        font-size: 16px;
        width: 100%;
        line-height: 30px;
    }

    .sitepage {
        width: 100%;
        justify-content: flex-start;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .sitepage.topic-craft .siteleftpannel {
        width: 98%;
    }

    .sitepage:has(.boxdefaultpage) {
        padding-top: 50px;
    }

    .sitepage.topic.items {
        padding-top: unset;
    }

    .sitepage.topic.items .topic-centralizer {
        padding-top: 4px;
    }

    .sitedetails .sitepros {
        width: auto;
        min-width: 49.6%;
        background: var(--darkygray);
    }

    .sitedetails .sitepros:first-child {
        margin-right: unset;
    }

    .sitedetails .sitepros:last-child {
        margin-top: 6px;
        margin-left: unset;
    }

    .sitedetails .methodlist {
        width: 90%;
        padding-bottom: 30px;
    }

    nav img {
        filter: none;
    }

    .sitedetails {
        position: relative !important;
        margin: 4px 0;
        left: 0 !important;
        bottom: 0 !important;
        height: auto;
        flex-direction: column;
    }

    .siteleftpannel {
        position: relative;
        min-width: unset;
        height: unset;
        width: 100%;
        margin-right: 0;
        z-index: 12;
        left: 0;
        top: 0;
    }

    .topic .siteleftpannel {
        width: 98%;
    }

    .siteleftpannel .box.main,
    .sitepage .box:hover {
        background: var(--darkgray) !important;
        box-shadow: unset;
    }

    .box .logobg a {
        width: 90%;
        height: 90%;
    }

    .siteleftpannel .box .logobg a {
        height: auto;
        width: auto;
    }

    .siteleftpannel .box.main .logobg {
        background: unset;
    }

    .siteblock {
        position: relative;
        background: var(--darkgray);
        top: unset;
        gap: unset;
    }

    .ssiodox:has(header.is-hidden) .siteblock {
        top: unset;
    }

    .box {
        margin: unset;
        width: 24%;
        min-width: 223px;
        filter: none;
        flex-grow: 1;
        background: linear-gradient(180deg, var(--darkgray) 0%, rgb(13 13 13) 100%);
        backdrop-filter: unset;
       -webkit-backdrop-filter: unset;
    }

    .box.main {
        height: 350px;
    }

    nav #pagename {
        font-size: 13px;
    }

    nav img {
        width: 140px;
    }

    .siteleftpannel .mods-box.topic {
        margin: unset;
        left: 4px;
        top: 4px;
        top: 48px;
        z-index: 100;
        width: 50px;
        position: absolute;
    }

    nav .pages {
        padding-left: unset;
        justify-content: center;
        position: absolute;
        top: 69px;
        background-color: rgba(12, 12, 12, .9);
        transition: all .15s ease-in-out, visibility 0s 0s;
        visibility: visible;
        overflow: hidden;
        border-radius: var(--main-border);
        opacity: 1;
        width: 96%;
        left: 50%;
        justify-content: center;
        transform: translateX(-50%);
        margin-top: 5px;
        height: 50px;
    }

    header,
    .nondef header,
    .review header,
    .nondef:has(.topic-craft) header,
    .nondef:has(.boxdefaultpage) header,
    .nondef:has(.blog) header {
        width: 100%;
    }

    nav {
        width: 96%;
    }

    .category-selector {
        top: 122px;
    }

    .category-selector.current {
        top: 120px;
    }

    nav .pages.hidden,
    nav .pages.search_hidden {
        opacity: 0;
        visibility: hidden;
        transition: all .15s ease-in-out, visibility 0s .15s;
        pointer-events: none;
        user-select: none;
    }

    nav .pages.search_hidden {
        transition: none;
    }

    nav .pages.hardplaced {
        height: 50px;
        transition: all .15s ease-in-out, visibility 0s 0s;
        width: 104%;
        border-radius: 0;
        visibility: visible;
    }

    header:has(.pages.hardplaced) {
        margin: unset;
        width: 100%;
        border-radius: 0;
    }

    nav .pages.hardhidden {
        height: 0;
        visibility: hidden;
        transition: all .15s ease-in-out, visibility 0s .15s;
    }

    nav .pages button {
        padding-left: unset;
        position: absolute;
        right: 20px;
    }

    nav .pages h1 {
        width: 78%;
    }

    .pages button.active {
        color: var(--main-color);
    }

    nav .pages a {
        margin-left: 18px;
    }

    #FAQ {
        transition: all .6s ease-in-out;
    }

    #FAQ.active {
        margin: unset;
    }

    #FAQ #PageSubt {
        font-size: 13px !important;
        width: 90%;
    }

    footer#review .centralizer .footer-content a {
        left: 0 !important;
    }

    footer {
        margin-top: 15px;
        order: 2;
    }

    .text-col-info-theme,
    .blog .text-col-info-theme {
        margin-bottom: 5px;
        width: 96%;
    }

    .blog .instruction {
        margin-left: 12px;
    }

    .blog .instruction li {
        width: 100%;
    }

    .blog .instruction ol {
        width: 100%;
    }

    .blog .topicpage {
        width: 100%;
    }

    .blog .nav-review ol {
        max-height: 170px;
    }

    .blog .main-col-info {
        padding-top: 0;
        border-radius: unset;
    }

    #particleflakeContainer {
        display: none !important;
    }

    .blog .newest-boxes {
        justify-content: center;
        background: unset;
        margin-top: 10px;
    }

    .blog .newest-boxes .box {
        width: 45%;
    }

    .boxes-holder-section .box .logobg .best,
    .boxes-holder-section .box .logobg .upd,
    .boxes-holder-sectio .bonuses-block {
        top: -4px;
        right: -4px;
    }

    .boxes-holder-name {
        overflow-x: scroll;   
    }

    .boxes-holder-name::-webkit-scrollbar {
        height: 0;
    }

    .newest-boxes-more {
        margin-left: 22px;
        margin-top: 2px;
        flex-grow: 1;
        max-width: 200px;
        width: 100%;
    }

    .newest-boxes-title-box {
        flex-grow: 1;
    }

    .mods-box.skins-box .mods-main-box {
        flex-wrap: wrap;
        gap: 8px;
    }

    .newest-boxes-more::before {
        transform: skew(20deg);
    }

    .boxes-holder.main-page {
        flex-direction: column;
        flex-wrap: nowrap;
    }

    .main-mode-selection {
        height: auto;
        width: 100%;
        margin-top: 20px;
        max-height: 200px;
    }

    .boxes-holder .main-mode-selection {
        margin: unset;
        opacity: 0;
    }

    .boxes-holder .main-mode-selection.slick-slider {
        min-width: unset;
        opacity: 1;
        padding: 0;
    }

    .main-mode-unit {
        margin: 0 3px;
        min-width: unset;
        background: var(--darkgray);
    }

    .main-mode-unit img {
        width: 100%;
    }

    .main-page .mods-box {
        order: -2;
    }

    .box.main .review-button.mirror {
        display: none;
    }

    .main-page .mods-box.mods-box.skins-box {
        width: 100%;
        order: -1;
    }

    .boxes-holder-section,
    .boxes-holder-section.big {
        height: auto;
        max-width: unset;
        justify-content: center;
    }

    .boxes-holder-section:last-child {
        margin-bottom: 4px;
    }

    .boxes-holder.main-page .box .logobg,
    .boxes-holder.main-page .box .content {
        height: 100%;
        width: 100%;
    }

    .boxes-holder-section.big .box,
    .boxes-holder-section .box {
        width: 32.5%;
        flex-grow: 0;
    }

    .infoicon {
        display: none;
    }

    .boxes-holder-list,
    .big .boxes-holder-list {
        width: 100%;
    }

    .color-box-overview-button {
        margin-top: unset;
        margin-left: 8px;
    }

    .payments-block,
    .payments-button {
        display: none;
        visibility: hidden;
    }

    .payments-block,
    .payments-button {
        position: relative;
        right: unset;
        top: unset;
    }

    .boxes-holder-name .boxes-holder-more,
    .boxes-holder-modes,
    .newest-boxes-more {
        font-size: 12px;
    }

    .payments-block .payments-button,
    .payments-button {
        margin: unset;

    }

    .payments-block,
    .payments-button {
        margin-top: 4px;
    }

    .payments-button,
    .payments-block {
        width: 96%;
        max-width: 1050px;
    }

    .payments-button:hover {
        transform: unset;
    }

    .payments-block.visible .payments-block-separate:nth-child(2) {
        display: flex;
        justify-content: center;
    }

    .payment-container {
        margin: 5px;
        display: flex;
        opacity: 0;
        transition: all 0s ease-in-out;
        pointer-events: none;
    }

    .visible .payment-container {
        opacity: 1;
        transition: all .15s ease-in-out;
        pointer-events: all;
    }

    .payments-button:hover::after {
        transform: unset;
        filter: grayscale(1);
    }

    .payments-block.visible .payments-button::after {
        transform: unset;
        filter: grayscale(0);
    }

    .payments-block {
        order: 0;
        z-index: 100;
        height: 50px;
    }

    .payments-block.visible {
        height: auto;
    }

    .payments-block-separate {
        width: 100%;
    }

    .payments-block .payments-block-separate:nth-child(2) {
        padding-top: 0;
    }

    .payments-block.visible .payments-block-separate:nth-child(2) {
        padding-top: 5px;
        height: 55px;
    }

    .payments-block .payments-button {
        width: 100%;
    }

    .payment-list .payment-method,
    .methodlist .payment-method::before {
        color: var(--white);
        opacity: 1;
    }

    .payments-block.visible .payments-button::before {
        content: '';
        position: absolute;
        top: 4px;
        bottom: 4px;
        left: 4px;
        right: 4px;
        border-radius: var(--main-border);
        background: var(--icongradient);
        transition: all .15s ease-in-out;
        box-shadow: 0 1px 2px 0 rgba(11, 11, 11, .4);
    }

    .payments-button:hover::before {
        filter: none !important;
    }

    .payment-list .payment-method {
        padding: 10px 10px;
    }
}

@media screen and (max-width: 850px) {

    .main-mode-selection button,
    .main-mode-selection .controls-button:hover,
    .main-mode-selection .controls-button:first-child,
    .main-mode-selection .controls-button:last-child {
        bottom: 8px;
        width: 30px;
        height: 30px;
    }

    .buttons-container .officon.chevron::before, 
    .main-mode-selection .officon.chevron::before {
        height: 22px;
        width: 22px;
    }

    .main-mode-selection .controls-button:first-child {
        left: 8px;
    }

    .main-mode-selection .controls-button:last-child {
        right: 8px;
    }

    .menu-search-section .search-field .close-button {
        right: 18px;
    }

    .menu-box {
        width: 100%;
        height: auto;
        min-height: unset;
        left: unset;
        transform: unset;
        top: 70px;
    }

    .menu-main-reviews {
        gap: 7px;
    }

    .menu-main-reviews-item {
        width: 31%;
        min-width: 60px;
    }

    .menu-main-parts {
        overflow-y: scroll;
    }

    .sitepage.items .section.first {
        min-height: 60px;
    }

    .blog .instruction li strong {
        margin: unset;
        margin-right: 4px;
    }

    .blog .instruction li strong {
        display: unset;
    }

    .blog .instruction li strong::after {
        content: unset;
    }

    .sitepage.items .section.first:has(.solo-category) {
        min-height: unset;
    }

    #search-input {
        font-size: 14px;
    }

    .site-list li a {
        color: rgba(255, 255, 255, .45);
    }

    .topic-nav-menu .weapon-container .weapon-selection {
        position: absolute;
    }

    .pagination-holder {
        margin: unset;
        padding: 10px 0;
        position: relative;
    }

    .topic-boxes-holder:has(.pagination-holder) {
        margin: 0 auto;
        padding-bottom: unset;
        margin-top: 4px;
    }

    .pagination-button {
        height: 30px;
        width: 30px;
        margin: 5px 3px;
        font-size: 14px;
    }

    .table-unit .mpercent {
        display: none;
    }

    .mods-box.skins-box .singlemod-box:hover {
        transform: scale(1.01);
    }

    .box-skins .skin .skin-desc,
    .box-skins .skin .skin-desc-name {
        font-size: 12px;
    }

    .sitedetails {
        margin: 0;
        margin-top: 6px;
    }

    .gamemodes .featuresbox .typesinside a::before {
        height: 13px;
        width: 13px;
    }

    .ratingsection .ratingway span {
        width: 100%;
        text-align: center;
        margin: unset;
        margin-bottom: 4px;
    }

    .gamemodes .featuresbox:after,
    .gamemodes .featuresbox::before,
    .gamemodes .featuresbox {
        background: var(--darkgray);
    }

    .gamemodes .featuresbox:after,
    .gamemodes .featuresbox::before {
        content: unset;
    }

    .sitealternates .rating-case-single {
        bottom: -5px;
    }

    .sitealternates .site-reward p {
        font-size: 12px !important;
    }

    .sitealternates .box .content h2,
    .sitealternates .box .content p:first-child {
        font-size: 16px;
    }

    .sitealternates .rating-case-single .rating-summ,
    .sitealternates .rating-case-single .star_rating {
        font-size: 14px;
    }

    .sitealternatesboxes .box .rating-case-single .rating-summ,
    .sitealternatesboxes .box .route {
        opacity: 1 !important;
        color: var(--white);
    }

    .sitealternatesboxes .box .rating-case-single .star_rating {
        filter: grayscale(0) !important;
    }

    .features {
        width: 85%;
    }

    .features .featuresbox .typesinside a i {
        width: 16px;
    }

    .features .featuresbox .typesinside {
        gap: 9px;
    }

    .boxreview .smallreview,
    .boxreview:has(.info-block) .smallreview {
        padding: 10px 0px 0px 0px;
    }

    .boxreview .smallreview.criteria {
        padding: 20px;
    }

    .site-searcher-logo img {
        width: auto;
        max-width: 80%;
        max-height: 35px;
        height: auto;
    }

    #preview-content {
        height: 350px;
    }

    .inspect-craft #preview-content {
        height: auto;
    }

    .topic-boxes-holder .topic-grandbox.sticker .skin {
        width: 30px;
        height: 30px;
        margin: 0 2px;
    }

    #preview-showcase #preview-content img {
        max-width: 84%;
        height: auto;
        max-height: 70%;
    }

    .inspect-craft #preview-showcase #preview-content img {
        max-width: unset;
        width: 100%;
    }

    .site-searcher-buttons {
        position: relative;
    }

    #preview-showcase .skin-alt-info[data-title]:after {
        transition: .1s opacity ease-in-out;
    }

    #preview-showcase,
    .inspect-craft #preview-showcase {
        top: 15%;
        left: unset;
        width: 96%;
    }

    .inspect-craft #preview-showcase {
        top: 30%;
    }

    .preview-craft {
        margin: unset;
    }

    .preview-craft:has(.preview-craft-unit.preview) {
        min-height: 133px;
    }

    .boxreview .plusminus .criteria .par {
        width: 90%;
    }

    .topic-boxes-holder.sticker-crafts,
    .topic-boxes-holder.sticker-crafts.pagination,
    .topic-boxes-holder.sticker-crafts.pagination:has(.topic-filter) {
        min-height: 689px;
    }

    .topic-box.maestro {
        width: 45%;
        max-width: 300px;
        border-radius: var(--main-border);
    }

    .site-attention span {
        font-size: 15px;
        width: 80%;
    }

    .ratingsumm {
        height: auto;
        padding: unset;
        margin: 6px 0;
    }

    .ratingsection {
        flex-direction: row;
        width: 100%;
        height: 100%;
        gap: 6px;
    }

    .text-col-info ul {
        padding: 5px 5px 0 5px;
    }

    .nav-bar {
        background-color: rgba(12, 12, 12, .9);
    }

    .box-skins.solo .box-skins-list .skin {
        height: 170px;
        width: 31.5% !important;
        min-width: 120px;
    }

    .box-skins.selected .box-skins-list .skin {
        width: 48.7%;
    }

    .box-skins.selected .box-skins-list {
        justify-content: center;
    }

    .close-box-skins {
        margin-top: 0;
    }

    .sitepage.items .box-skins.solo .box-skins-list {
        justify-content: center;
        width: 100%;
        margin-top: unset;
        min-height: 300px;
        padding: unset;
        gap: 4px;
    }

    .sitedetails .sitepros span,
    .ratingsection .ratingway {
        font-size: 15px;
    }

    .sitealternates {
        margin-top: 4px;
    }

    .alternates-title {
        width: auto;
        text-wrap: nowrap;
    }

    .sitealternates .site-reward {
        width: 80%;
        align-items: center;
        margin-top: 5px;
        height: 50px;
    }

    .ratingsection .ratingway {
        width: 40%;
        height: auto;
        flex-grow: 1;
        margin: 0;
        padding: 20px 10px;
        background: var(--darkgray);
        border-radius: var(--main-border);
        flex-wrap: wrap;
    }

    .sitedetails .sitepros {
        background: var(--darkgray);
    }

    .ratingsumm {
        background: unset;
    }

    #notexist {
        max-width: 90%;
    }

    .mods-box.mods-box.skins-box {
        /* min-height: 92px; */
        width: 100%;
    }

    .buttons-container-page {
        bottom: 10px !important;
        right: 10px !important;
    }
}

@media screen and (max-width: 695px) {
    #preview-showcase #preview-content img {
        height: auto;
        margin-top: 30px;
    }

    .site-searcher-logo {
        height: auto;
    }

    .site-searcher-box {
        height: 45px;
        margin: 4px !important;
        position: static;
    }

    .site-searcher-box[data-title]:after {
        border: none;
        top: 70px;
        background-color: unset;
        padding: 0;
        font-size: 14px;
    }

    .site-searcher-buttons {
        flex-wrap: wrap;
    }

    .topic-box.maestro .content {
        filter: grayscale(0) brightness(1);
        opacity: .75;
    }

    .email-placeholder {
        width: 98%;
    }

    .main-col-info {
        width: 100%;
        margin-top: 6px;
        padding: 15px;
    }

    .boxdefaultpage {
        padding-top: 0px;
    }

    .box .logobg img {
        max-width: 70%;
        max-height: 70px;
    }

    .box.main .logobg img {
        max-width: 300px;
        max-height: 115px;
    }

    .instruction code,
    .site-promo-copy {
        border-radius: 5px;

    }

    .slider-container {
        width: 96%;
        margin-top: 2px;
        margin-bottom: -1px !important;
    }

    .boxreview .slider-container {
        margin-top: 5px;
    }

    .main-infobox {
        margin-top: 6px;
    }

    .boxes-holder-name .boxes-holder-more,
    .boxes-holder-modes,
    .newest-boxes-more {
        font-size: 11px;
    }

    .screens:not(.crafting-table-screens) .slick-dots li {
        width: 15px !important;
        height: 15px !important;
        margin: 0 5px !important;
    }

    .slick-dots li button {
        padding: 3px !important;
    }

    .smallreview h2,
    .smallreview:not(.criteria) h3,
    .instruction h2,
    .instruction h3 {
        font-size: 20px !important;
    }

    .instruction h2,
    .instruction h3 {
        margin-left: 13px;
    }

    .newest-boxes {
        width: 96%;
        justify-content: space-between;
        gap: 4px;
    }

    .newest-boxes .box {
        width: 45%;
        flex-grow: 1;
        background: linear-gradient(-45deg, transparent, var(--main-theme));
    }

    .newest-boxes .box .content h2 {
        display: none;
    }

    .newest-boxes .box .content p:first-child {
        display: none;
    }

    .newest-boxes .box .content p {
        font-size: 12px;
        height: 100%;
        text-align: center;
        margin-top: unset;
        display: flex;
        align-items: center;
    }

    .newest-boxes .box .content p:nth-child(3) {
        display: none;
    }

    .sitepage.items .box-skins.solo .box-skins-list .skin {
        height: 120px;
        width: 30%;
        max-width: 200px;
        flex-grow: 1;
    }

    .sitepage.items .skin.disabled {
        width: 0 !important;
        flex-grow: 0;
    }

    .box-skins.solo:nth-child(2) .skin img {
        width: auto;
        height: 70%;
    }

    .box {
        width: 40%;
        margin: unset;
        height: 320px;
        min-width: unset;
    }

    .boxes-holder:has(.box.animate-in),
    .boxes-holder:has(.box.hidden-deposit),
    .boxes-holder:has(.box.hidden-withdrawal) {
        padding-left: 2px;
    }

    @keyframes fadeInBoxes {
        0% {
            opacity: 0;
            transform: translateY(-10px) scale(0);
            width: 0;
            height: 0;
            margin: 0;
        }

        99% {
            opacity: 1;
            transform: translateY(0) scale(1);
            width: 48.94%;
            margin: 4px 2px 2px;
            height: 320px;
        }

        100% {
            opacity: 1;
            transform: translateY(0) scale(1);
            z-index: 1;
            width: 48.94%;
            margin: 4px 2px 2px;
            height: 320px;
        }
    }

    .language-box {
        display: flex;
        border: 2px solid #161616;
    }

    .boxes-holder {
        width: 96%;
        gap: 6px;
    }

    .topic-boxes-holder {
        gap: 6px;
    }

    .topic-filter {
        gap: 2px;
    }

    .boxes-holder .box .logobg {
        height: 40%;
    }

    .boxes-holder .box .content {
        height: 60%;
    }

    .topic-boxes-holder .topic-grandbox.sticker .topic-box .best {
        font-size: 11px !important;
        height: 27px;
    }

    .newest-boxes .box .logobg {
        height: 100% !important;
    }

    .newest-boxes .content .defbutton {
        display: none;
    }

    .newest-boxes .box .logobg img {
        margin-top: unset;
        max-width: 80%;
        max-height: 50px;
    }

    .box .logobg .route {
        font-size: 11px;
        color: rgba(255, 255, 255, .3);
        transform: unset;
        top: unset;
        left: unset;
    }

    .box .logobg .route::before {
        top: unset;
        bottom: 0;
        left: -8px;
        right: unset;
    }

    .boxes-holder .box:hover {
        transform: translateZ(0);
    }

    .cookie-widget-info {
        display: block;
        padding: 0 7px;
    }

    .cookie-widget-button {
        margin-right: 7px;
        margin-left: 0;
    }

    .smallreview:not(.criteria) p,
    .boxreview .plusminus .criteria .par li,
    .instruction li {
        font-size: 15px;
    }

    .smallreview:not(.criteria) p,
    .boxreview .plusminus .criteria .par li {
        line-height: 1.4;
    }

    .sitealternatesboxes .box .logobg img {
        max-width: 75% !important;
        max-height: 40% !important;
    }

    .category-selector .category-box {
        margin: 8px 4px 0 4px !important;
    }

    .content p:nth-child(2) {
        width: 96% !important;
        height: 55px;
        overflow: hidden;
    }

    .content p::-webkit-scrollbar {
        width: 0px;
    }

    .content p {
        font-size: 12px;
        margin-top: 10px;
    }

    .box .logobg .best,
    .box.crypto-choice .logobg:after {
        font-size: 11px;
    }

    .boxes-holder-section.big .box,
    .boxes-holder-section .box {
        width: 48%;
        flex-grow: 1;
    }

    .boxes-holder-list {
        background: var(--darkgray);
    }

    .mods-box.skins-box .mods-main-box {
        gap: 6px;
    }
    
    .boxes-holder-section,
    .boxes-holder-section.big {
        justify-content: space-between;
    }

    .main-page .box .logobg img {
        max-width: 82%;
        max-height: 60px;
    }

    .boxes-holder-section .boxes-holder-name h3 {
        text-wrap: nowrap;
    }

    .main-mode-selection {
        height: 160px;
    }
}

@media screen and (max-width: 644px) {
    .category-selector {
        min-width: unset !important;
        justify-content: flex-start;
    }

    nav img {
        width: 130px;
    }

    .pages h1,
    #PageSubt {
        font-size: 13px;
    }

    .pages h1 {
        font-size: 14px;
        color: var(--white);
    }

    .main-nav-content {
        margin-left: 8px;
    }

    .pages button {
        margin-left: unset;
    }

    .pages button {
        font-size: 18px;
    }

    .topic-box,
    .topic-box.maestro {
        width: 48%;
    }

    .sitealternatesboxes {
        flex-direction: row;
        flex-wrap: wrap;
        padding-top: 0px;
        display: flex;
        height: auto;
        justify-content: center;
        align-items: center;
        gap: 4px;
    }

    .sitealternates .box {
        width: 49%;
        height: 250px;
        flex-grow: 1;
    }
}

@media screen and (max-width: 555px) {
    .site-list {
        max-height: 100%;
        top: 58px;
        width: 101%;
        min-width: unset;
        max-width: unset;
        position: fixed;
        overflow-y: scroll;
        border-radius: 0;
    }
}

@media screen and (max-width: 460px) {

    .mods-box.mods-box.skins-box {
        min-height: 132px;
    }

    #btnfaq::before, .infoicon::before {
        height: 18px;
        width: 18px;
    }

    .box .logobg img {
        max-width: 70%;
        max-height: 90px;
    }

    .box {
        width: 96%;
        height: 350px;
    }

    .boxes-holder:has(.box.animate-in),
    .boxes-holder:has(.box.hidden-deposit),
    .boxes-holder:has(.box.hidden-withdrawal) {
        padding: unset;
    }

    @keyframes fadeInBoxes {
        0% {
            opacity: 0;
            transform: translateY(-10px) scale(0);
            width: 96%;
            height: 0;
            margin: 0;
        }

        99% {
            opacity: 1;
            transform: translateY(0) scale(1);
            width: 96%;
            margin: 8px 0px 0 0px;
            height: 350px;
        }

        100% {
            opacity: 1;
            transform: translateY(0) scale(1);
            z-index: 1;
            width: 96%;
            margin: 8px 0px 0 0px;
            height: 350px;
        }
    }

    .main-mode-unit {
        width: 200px;
    }

    .main-page .content .review-button.mirror-visit {
        top: -30px;
        left: -8px;
        display: none;
    }

    .content .review-button.mirror-visit {
        display: flex;
        backface-visibility: visible;
        right: -30px;
    }

    .content .review-button.mirror-visit {
        left: unset;
        right: -55px;
        top: 5px;
    }

    .content .review-button.mirror-visit::before {
        left: -6px;
        right: unset;
        border-radius: 5px 0 0 5px;
    }

    .content .review-button.mirror-visit::after {
        left: unset;
        right: 7px;
    }

    .boxes-holder .box .logobg {
        height: 40%;
    }

    .boxes-holder .box .content {
        height: 60%;
    }

    .box .logobg .best,
    .bonuses-block,
    .box.crypto-choice .logobg:after {
        font-size: 12px;
    }

    .box.crypto-choice .logobg:after {
        top: 32px;
    }

    .rating-case-single .rating-summ {
        font-size: 15px;
    }

    .content button {
        font-size: 12px;
    }

    .content .defbutton {
        display: flex;
        bottom: 16px;
        right: 30px;
    }

    .content .tg-app {
        right: unset;
        left: 30px;
    }

    .content p:nth-child(2) {
        width: 70% !important;
        height: 75px;
        font-size: 13px;
        margin-top: 10px;
    }

    .content p {
        margin-top: 0px;
    }

    .content p:nth-child(3) {
        width: 55%;
        font-size: 11px;
        margin-top: 5px;
    }

    .box.main .main-mode {
        right: 50px;
    }

    .main-page .box .main-mode {
        right: 10px;
    }

    .main-page .box .content p:nth-child(2) {
        width: 75% !important;
        font-size: 12px;
        margin-top: 15px;
        height: auto;
        max-height: 85px;
        text-align: start;
    }

    .main-page .content .review-button {
        font-size: 10px;
    }

    .main-page .box .content .boxtitle,
    .main-page .box .content h4 {
        font-size: 18px;
        display: none;
    }

    .boxes-holder .content-buttons {
        margin-top: 6px;
    }
}

@media screen and (max-width: 405px) {
    .sitepros i {
        margin-left: 5px;
    }
}

@media screen and (max-width: 390px) {
    .ratingsection .ratingway {
        font-size: 13px;
    }

    .sitedetails .sitepros span,
    .alternates-title,
    .ratingsection .ratingway {
        transition: all .1s ease-in-out;
    }
}

.box-skins.character {
    display: flex;
    flex-wrap: wrap;
    margin: 8px;
}

.sitepage.topic-craft.loadout .topic-centralizer {
    width: 100%;
    display: flex;
    justify-content: center;
    background: rgba(0, 0, 0, .3);
    border-radius: var(--main-border);
    margin-bottom: 8px;
}

.character-box {
    width: 100%;
    height: auto;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    min-height: 696px;
    gap: 8px;
}

.character-model {
    width: 400px;
    display: flex;
    justify-content: center;
    background: var(--darkgray);
    border-radius: var(--main-border);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .25);
    position: relative;
    height: auto;
    overflow: hidden;
}

.character-model .preview-item {
    position: absolute;
    bottom: 0;
    border-radius: var(--main-border);
    transition: unset;
    z-index: 1;
}

.box-skins.character .preview-item.skin {
    height: 100%;
    width: 100%;
    flex-grow: unset;
    animation: SkinPreview .15s ease-in-out forwards;
    pointer-events: none;
}

.box-skins.character .preview-item.skin img {
    width: 80%;
    height: auto;
    max-width: unset;
    max-height: unset;
    margin: 0 auto;
    filter: unset;  
}

.box-skins.character .skin::before, 
.box-skins.character .skin .skin-desc-name,
.box-skins.character .skin .skin-price-info {
    display: none;
}

.box-skins.character .preview-item.skin::before, 
.box-skins.character .preview-item.skin .skin-desc-name,
.box-skins.character .preview-item.skin .skin-price-info {
    opacity: 1;
    display: flex;
}

.box-skins.character .preview-item.skin::before {
    width: 300px;
    max-width: unset;
    height: 250px;
    left: -75px;
    top: -40px;
    transform: rotate(140deg);
    filter: blur(20px);
}

@keyframes SkinPreview {
    0% {
        transform: scale(1.05) translateY(0);
    }

    100% {
        transform: scale(1) translateY(0px);
    }
}

/* 
.character-model .preview-item:has(.skin) {
    background: linear-gradient(-45deg, var(--darkgray) 50%, var(--darkygray) 100%);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .25);
} */

.character-model::before {
    content: '';
    background-image: url(/img/skins/topics/sas.png);
    position: relative;
    display: block;
    filter: grayscale(1) brightness(.2);
    pointer-events: none;
    height: 100%;
    width: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 45%;
}

.sitepage.topic-craft.loadout .topicpage {
    background: unset;
    min-height: 1000px;
}

.character-items-list {
    position: relative;
    display: flex;
    height: 800px;
    width: auto;
    justify-content: center;
    height: fit-content;
    flex-wrap: wrap;
    flex-grow: 1;
    max-height: -webkit-fill-available;
    gap: 8px;
}

.sitepage.topic-craft .box-skins.character .slick-slider {
    margin-top: 2px;
}

.character-items-list.left {
    left: 0;
    width: 276px;
}

.character-items-list.right {
    right: 0;
    width: 276px;
}

.character-items-list.top {
    bottom: unset;
    flex-direction: row;
    height: auto;
    width: 100%;
}

.character-items-list.bottom {
    top: unset;
    flex-direction: row;
    height: auto;
    width: 100%;
}

.box-skins.character .skin {
    margin: unset;
    width: 130px;
    min-width: unset;
    height: 80px;
    background: linear-gradient(-45deg, var(--darkgray) 50%, var(--darkygray) 100%);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .25);
    max-width: unset;
    flex-grow: 1;
}

.box-skins.character .skin img {
    width: auto;
    max-width: 65%;
    max-height: 90%;
    height: auto;
}

.box-skins.character .skin::before {
    max-width: 200px;
}

.box-skins.character .skin::after {
    display: none;
}

.box-skins.character .skin.notexist::after {
    display: flex;
    content: 'Not Exist' !important;
    font-weight: 600;
    font-size: 12px;
    transform: rotate(8deg);
    text-transform: uppercase;
    position: absolute;
    margin: 0 auto;
    background: none;
    z-index: 10;
    width: auto;
    height: auto;
    left: unset;
    top: unset;
    opacity: .2;
}

.box-skins.character .skin.notexist img {
    opacity: .1;
}

.skin.notexist {
    pointer-events: none;
}

.box-skins.character .preview-item.skin .skin-desc-name::before {
    display: block;
    width: 18px;
    height: 8px;
}

.box-skins.character .skin .skin-desc-name,
.box-skins.character .skin .skin-price-info {
    height: auto;
    bottom: unset;
    width: auto;
    z-index: 10;
    left: 20px;
    top: 20px;
    font-size: 16px;
}

.box-skins.character .skin .skin-desc-name {
    filter: drop-shadow(0px 0px 3px black);
}

.box-skins.character .skin .skin-price-info {
    left: 20px;
    top: unset;
    bottom: 20px;
    transform: unset;
    font-size: 14px;
}

.sitepage.topic-craft .section.second.character {
    width: 90%;
    margin-bottom: 0;
}

.boxes-holder-modes .officon::before {
    filter: grayscale(1);
    transition: filter .15s ease-in-out;
    height: 12px;
    width: 12px;
}

.boxes-holder-modes .officon {
    margin-right: 7px;
    margin-left: -3px;
}

.sticker-crafts-list {
    display: flex;
    position: relative;
    overflow: hidden;
    transition: all .15s ease-in-out;
    margin: 0;
    height: 0;
    width: 100%;
}

.sticker-crafts-list.imported {
    height: 112px;
    margin-bottom: 7px;
}

.sticker-crafts-list .topic-grandbox::after {
    content: unset;
}

.sticker-crafts-list .topic-grandbox {
    overflow: hidden;
}

.sitepage.topic-craft .sticker-crafts-list .topic-grandbox {
    top: unset;
    margin: 0 4px;
    width: 25%;
    height: 110px;
    min-height: unset;
}

.sitepage.topic-craft .sticker-crafts-list .topic-grandbox:first-child {
    margin-left: unset;
}

.sitepage.topic-craft .sticker-crafts-list .topic-grandbox:last-child {
    margin-right: unset;
}

.sticker-crafts-list .topic-grandbox .section.first,
.sticker-crafts-list .topic-grandbox .section.second,
.sticker-crafts-list .topic-grandbox .section.third {
    display: none;
}

.sticker-crafts-list .topic-boxes-holder .topic-grandbox.sticker .topic-box .logobg.zoomed img,
.sticker-crafts-list .topic-boxes-holder .topic-grandbox.sticker .topic-box .logobg img {
    max-height: 50%;
    max-width: 90%;
    transform: rotate(8deg) translateZ(0);
}

.sticker-crafts-list .topic-boxes-holder .topic-grandbox.sticker .topic-box .logobg.zoomed img {
    max-height: 65%;
}

.sticker-crafts-list .topic-boxes-holder .topic-grandbox.sticker .topic-box:hover .logobg img {
    transform: scale(1.05) rotate(8deg) translateZ(0);
}

.sticker-crafts-list .topic-boxes-holder .topic-grandbox.sticker:hover {
    transform: scale(1) translateZ(0);
}

.sitepage.topic-craft .sticker-crafts-list .topic-grandbox .topic-box {
    width: 100%;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
        transform: translateY(-10px) scale(1.06);
        z-index: 10;
    }

    99% {
        opacity: 1;
        transform: translateY(0) scale(1);
        z-index: 10;
    }

    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
        z-index: 1;
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1;
        transform: translateY(0) scale(1);
        z-index: 1;
    }

    1% {
        z-index: 10;
    }

    100% {
        opacity: 0;
        transform: translateY(-10px) scale(0);
        z-index: 10;
    }
}


.topic-boxes-holder .topic-grandbox,
.topic-boxes-holder:not(.sticker-crafts) .topic-box {
    opacity: 0;
}

.topic-boxes-holder .topic-grandbox.visible,
.topic-boxes-holder .topic-grandbox.visible_sort,
.topic-boxes-holder:not(.sticker-crafts) .topic-box.visible,
.topic-boxes-holder:not(.sticker-crafts) .topic-box.visible_sort {
    opacity: 1;
}

.topic-grandbox.fade-in,
.topic-box.fade-in {
    animation: fadeIn .2s ease-in-out forwards;
}


.route-semi {
    right: 10px;
    bottom: 65px;
    position: absolute;
    background: var(--darkygray);
    transition: all .15s ease-in-out;
    border-radius: var(--main-border);
    width: 36px;
    height: 36px;
    cursor: help;
    z-index: 1;
    opacity: 1;
    font-size: 9px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    filter: grayscale(1);
}

.main-page .route-semi {
    right: 10px;
    bottom: 10px;
    opacity: 0;
    z-index: 3;
}

.main-page .box:hover .route-semi {
    opacity: 1;
}

.route-semi::after {
    content: '';
    position: absolute;
    background: var(--icongradient);
    border-radius: var(--main-border);
    left: 3px;
    right: 3px;
    top: 3px;
    bottom: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
    filter: grayscale(1);
    z-index: -1;
}

.route-semi::before {
    content: 'Могут быть проблемы с Доступом';
    color: var(--white);
    font-size: 13px;
    margin-bottom: unset;
    bottom: 50%;
    /* text-wrap: nowrap; */
    left: unset;
    right: 45px;
    width: 140px;
    text-align: center;
    /* text-wrap: auto; */
    display: flex;
    justify-content: flex-end;
    transition: all .15s ease-in-out;
    filter: drop-shadow(0px 0px 6px var(--darkgray)) drop-shadow(0px 0px 6px var(--darkgray)) drop-shadow(0px 0px 6px var(--darkgray));
    transform: translateY(50%) translateX(10px);
}

.route-semi:hover::before {
    opacity: 1;
    transform: translateY(50%);
}

@media screen and (max-width: 1365px) {

    .skins-category-switch {
        margin: 0 65px;
        margin-bottom: 10px;
    }

    .skininspect-placeholder {
        margin-bottom: unset;
    }

    .sticker-crafts .pagination-holder {
        bottom: 0;
    }

    .singlemod-box:has(.back-button):hover {
        transform: scale(1.01);
    }

    .topic-boxes-holder .topic-box:hover .logobg,
    .item-topic-grandbox:hover .logobg,
    .topic-box.maestro:hover .logobg {
        margin: 5px !important;
    }

    .topic-boxes-holder:not(.sticker-crafts) .topic-box.fade-in {
        animation: fadeIn .2s ease-in-out forwards;
    }

    .topic-boxes-holder .topic-grandbox.sticker.fade-in,
    .topic-grandbox.fade-in,
    .topic-box.fade-in {
        animation: none;
        opacity: 1;
    }

    .topic-boxes-holder .topic-grandbox.sticker,
    .topic-boxes-holder .topic-grandbox.sticker .topic-box,
    .topic-boxes-holder .topic-grandbox.sticker .topic-box .best {
        filter: unset;
        box-shadow: unset;
    }

    .topic-grandbox.fade-out {
        display: none;
    }

    .sticker-crafts-list.imported,
    .sitepage.topic-craft .sticker-crafts-list .topic-grandbox {
        height: 80px;
    }

    .sticker-crafts-list.imported {
        margin-top: 4px;
        margin-bottom: unset;
    }

    .sitepage.topic-craft .sticker-crafts-list .topic-grandbox {
        margin: 0 2px;
    }

    .sitepage.topic-craft .sticker-crafts-list .topic-grandbox:nth-child(4) {
        display: none;
    }

    .sitepage.topic-craft .topic-boxes-holder .topic-grandbox.sticker .topic-box .logobg img {
        margin-top: 10px !important;
    }

    .main-page .route-semi,
    .main-page .route-semi::before,
    .main-page .route-semi::after {
        display: none;
        content: none;
    }

    .box .route-semi {
        background: rgb(21 21 21);
    }

    .character-items-list {
        gap: 4px;
    }

    .box-skins.character .skin {
        box-shadow: unset;
        min-width: 130px;
    }

    .sitepage.topic-craft.loadout .topic-centralizer {
        margin-bottom: unset;
    }

    .character-box {
        flex-direction: column;
        justify-content: flex-start;
        flex-wrap: nowrap;
        margin-top: 2px;
        gap: 4px;
    }

    .character-items-list.left,
    .character-items-list.right {
        width: 100%;
    }

    .character-model {
        display: none;
    }
}

@media screen and (max-width: 460px) {

    .box .main-mode,
    .box .route-semi {
        right: 15px;
    }
}

.skins-category-switch {
    width: fit-content;
    display: flex;
    justify-content: center;
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    position: relative;
    isolation: isolate;
    margin-bottom: 10px;
    width: 70%;
}

.sitepage.topic-craft .section.second.character span,
.topic-boxes-holder .topic-grandbox.sticker .section.second.character span {
    opacity: 1;
}

label.skins-category-switch:hover {
    transform: none !important;
}

label.skins-category-switch:active {
    filter: none !important;
}

.skins-category-switch .category-switch:active {
    z-index: 100;
}

.skins-category-switch .category-switch {
    display: grid;
    place-content: center;
    transition: opacity .3s ease-in-out 0s;
    padding: 13px 20px;
    transition: all .15s ease-in-out;
    color: var(--gray);
    font-weight: 500;
    font-size: 12px;
    text-decoration: none;
    text-transform: uppercase;
}

.skins-category-switch.cheap .category-switch:nth-child(2),
.skins-category-switch.expensive .category-switch:nth-child(3),
.skins-category-switch .category-switch:hover:nth-child(3),
.skins-category-switch .category-switch:hover:nth-child(2) {
    color: var(--white);
}


.skins-category-switch::after,
.skins-category-switch .category-switch::before {
    content: "";
    position: absolute;
    border-radius: var(--main-border);
    transition: inset .15s ease-in-out;
}

.skins-category-switch::after {
    border-radius: var(--main-border);
}

.skins-category-switch.cheap .category-switch:nth-child(2)::before,
.skins-category-switch.expensive .category-switch:nth-child(3)::before,
.skins-category-switch .category-switch:hover:nth-child(2)::before {
    background: linear-gradient(180deg, rgb(22 22 22) 0%, rgb(16 16 16) 100%);
    inset: 4px 50% 4px 4px;
    transition: inset .2s ease-in-out, background-color .3s ease-in-out;
    z-index: -1;
}

.skins-category-switch.expensive::before {
    transition: inset .2s ease-in-out, background-color .3s ease-in-out;
}

.skins-category-switch.expensive .category-switch:nth-child(3)::before,
.skins-category-switch .category-switch:hover:nth-child(3)::before {
    background: linear-gradient(180deg, rgb(22 22 22) 0%, rgb(16 16 16) 100%);
    transition: inset .2s ease-in-out, background-color .3s ease-in-out;
    z-index: -1;
    inset: 4px 4px 4px 50%;
}

.skins-category-switch::after {
    inset: 0;
    z-index: -2;
    filter: unset;
    background: var(--darkgray);
    filter: drop-shadow(0 0 1px rgb(35 35 35));
}

.skins-category-switch.expensive:hover .category-switch:nth-child(3)::before {
    inset: 4px 4px 4px 35%;
}

.skins-category-switch.cheap:hover .category-switch:nth-child(2)::before {
    inset: 4px 35% 4px 4px;
}

.skins-category-switch {
    margin-top: 15px;
}

.skins-category-switch::before {
    content: 'Inventory by Color';
    display: flex;
    position: absolute;
    top: -20px;
    width: 100%;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 500;
}

.lang-ru .skins-category-switch::before {
    content: 'Инвентарь по Цвету';
}

a[href*="/?aff="][target="_blank"] {
    display: flex !important;
}