@font-face {
    font-weight: 300;
    font-family: "Roboto";
    font-style: normal;
    font-display: optional;
    src: url("../fonts/f1827-c881b.eot");
    src: local("Roboto Light"), local("Roboto-Light"),
        url("../fonts/6da0f-05fbf.woff2") format("woff2"),
        url("../fonts/ae4de-66d46.woff") format("woff"),
        url("../fonts/4ce17-3b64f.ttf") format("truetype");
}

@font-face {
    font-weight: 400;
    font-family: "Roboto";
    font-style: normal;
    font-display: swap;
    src: url("../fonts/e239f-e838b.eot");
    src: local("Roboto"), local("Roboto-Regular"),
        url("../fonts/61467-43374.woff2") format("woff2"),
        url("../fonts/a2288-67206.woff") format("woff"),
        url("../fonts/3ddcd-48665.ttf") format("truetype");
}

@font-face {
    font-weight: 700;
    font-family: "Roboto";
    font-style: normal;
    font-display: optional;
    src: url("../fonts/adcaf-47202.eot");
    src: local("Roboto Bold"), local("Roboto-Bold"),
        url("../fonts/d6532-45ec3.woff2") format("woff2"),
        url("../fonts/63628-e106b.woff") format("woff"),
        url("../fonts/5d9de-5a80c.ttf") format("truetype");
}

body {
    background: #000000c9;
    /* #F7F7F7 */
    color: #000;
    font-size: 16px;
    font: 16px "Open Sans", Verdana, sans-serif;
    /* font-family: "Roboto", -apple-system, BlinkMacSystemFont, Arial, sans-serif; */
    line-height: 1.35;
}


.body-main {
    background-color: #fff;
}


h1 {
    font-weight: bold;
    font-size: 45px;
    line-height: 40px;
    color: #ffb900;
}

a:hover {
    color: #000;
}

.h1-fs-small {
    font-size: 40px !important;
    line-height: 37px !important;
}

h2,
h3,
h4 {
    font-weight: bold;
    font-size: 22px;
    line-height: 43px;
    color: #ffb900;
}

a {
    color: #ffb900;
    text-decoration: none;
}




.ml-2 {
    margin-left: 2rem;
}

.mr-1 {
    margin-right: 1rem;
}

.mt-10-f {
    margin-top: 2rem;
}

.mt-6,
.mt-lg-6 {
    margin-top: 6rem;
}

/*** HEADER ***/

.admin_button {
    position: fixed;
    bottom: 0;
    left: 1%;
}


.index header {
    background: radial-gradient(79.22% 160.58% at 50% 50%, #D5D4D0 0%, #D5D4D0 1%, #EEEEEC 31%);
    /* min-height: 900px; */
}

header .welcome-text {
    font-weight: bold;
    font-size: 20px;
    line-height: 24px;
    color: #151515;
}


/*** SEARCH ***/

.form-control {
    border: 2px solid #353535;
    background-color: #EEEDEF !important;
    background: #EEEDEF;
    font-weight: 300;
    font-size: 16px;
    line-height: 19px;
    color: #353535;
}

.search form {
    /* max-width: 670px; */
    height: 40px;

    position: relative;
    /* width: 300px;
	margin: 0 auto; */

}

.search input {
    padding-left: 73px;
}




.search button {
    height: 13px;
    width: 13px;
    position: absolute;
    top: 10px;
    left: 50px;
    cursor: pointer;
    padding: 0;
    border-width: 0;
}

.search button:before {
    content: "";
    background-image: url('../img/ico/searth.svg');
    width: 13px;
    height: 13px;
    position: relative;
    background-size: 100% 100%;
    display: block;
}


/*
\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
            ХЛЕБНЫЕ КРОШКИ
\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
*/


.breadcrumb {
    /* margin-top: 2rem; */
    border: none;
}

.breadcrumb ul {
    padding-left: 0;
}

.breadcrumb ul>li {
    display: inline;
    font-weight: 400;
    font-size: 15px;
    line-height: 14px;
}

.breadcrumb ul>li:last-child {
    color: #858585;
    -webkit-text-decoration-line: underline;
    text-decoration-line: underline;
}

.breadcrumb ul>li a {
    color: #757575;
}

.breadcrumb ul>li:nth-last-child(n+2):after {
    content: ' /';
    font-size: 14px;
}

/*** MENU ***/

header nav {
    border-bottom: 1px solid #d9d9d9;
}

.navbar {
    background: #fff;
    padding: 0;
    position: relative;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 99999;
}

.nav-link {
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    color: #151515 !important;
}


.nav-item a {

    font-size: 16px !important;
    line-height: 19px !important;
    white-space: nowrap;
}

.nav-item a:hover {
    color: #00000069 !important
}

.active {
    color: #00000069 !important
}


/*** MAIN ***/

main {
    min-height: 100vh;
}



@media (min-width: 900px) {
    .index h2 {
        display: inline-block;
        height: 73px;
    }
}

.tag-cloud-section {
    min-height: 190px;
    max-width: 1411px;
}

.category-navigation-container {
    max-width: 1660px;
}

.tag-items-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.tag-section-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 999;
    position: relative;
}

.tag-items-grid .col-md-2,
.tag-items-grid .tag-pill {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    -webkit-filter: drop-shadow(2px 2px 3px rgba(21, 21, 21, 0.25));
    filter: drop-shadow(2px 2px 3px rgba(21, 21, 21, 0.25));
    background: #ffb900;
    /* border-radius: 8px; */
    width: 220px;
    height: 50px;
    margin-top: 10px;
    margin-left: 10px;
}

@media (max-width: 1000px) {
    .tag-items-grid .tag-pill {
        width: 120px;
        height: 30px;
    }

    .tag-items-grid a {
        font-size: 13px !important;
    }
}

.tag-items-grid a {
    width: 201px;
    height: 66px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: 16px;
    line-height: 19px;
    color: #151515;
}

.tag-items-grid a:hover {
    transition: all 0.2s;
    transform: translateY(-5%);
}

.carousel-control-prev-icon {
    background-image: url('../img/ico/button_slaider-left.svg');
    width: 60px;
    height: 60px;
}

.carousel-control-next-icon {
    background-image: url('../img/ico/button_slaider-right.svg');
    width: 60px;
    height: 60px;
}

.carousel-control-next {
    width: 60px;
    height: 60px;
    position: absolute;
    right: 1%;
    top: 63px;

    opacity: 0.4;
}

.carousel-control-prev {
    width: 60px;
    height: 60px;
    z-index: 99;
    position: absolute;
    left: 1%;
    top: 63px;
    opacity: 0.4;
}

.navigation-box {
    position: relative;
    z-index: 99;
    margin: 1rem 0 1.5rem;
    padding: 20px 30px;
    font-size: 20px;
    line-height: 24px;
}

.navigation-box a:hover {
    -webkit-text-decoration-line: underline;
    text-decoration-line: underline;
}

.h-sword-box {
    display: flex;
    align-items: center;
}

.h-sword-box h3 {
    display: inline-block;
    height: 73px;
}

.sword-left {
    width: 100%;
    display: inline-block;
    background: url('../img/ico/almaz-sword.png');
    background-size: 72px 72px;
    width: 72px;
    height: 72px;
    left: -10%;
    top: -7px;
    opacity: 0;

}


.sword-right {
    transform: rotate(-180deg);
    width: 100%;
    display: inline-block;
    background: url('../img/ico/almaz-sword.png');
    background-size: 72px 72px;
    width: 72px;
    height: 72px;
    right: -10%;
    top: -7px;
    opacity: 0;
}

.sword-left-anima {
    -webkit-animation: 0.5s linear 0s 1 normal move_sword_left;
    animation: 0.5s linear 0s 1 normal move_sword_left;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}

.sword-right-anima {

    -webkit-animation: 0.5s linear 0s 1 normal move_sword_right;

    animation: 0.5s linear 0s 1 normal move_sword_right;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}


.sword-left,
.sword-right {
    position: relative;
}

/* XYZ */
.feature-card {
    background: #ffb900;
    text-align: center;
    padding: 20px 36px;
    height: 100%;

}

.feature-card h5 {
    margin: 1rem 0;
    font-weight: bold;
    font-size: 24px;
    line-height: 29px;

    color: #151515;
}

.fs-36 {
    font-size: 36px !important;
}

.cta-button-section .primary-cta-button {
    margin-top: 0.5rem;
    display: inline-block;
    vertical-align: top;
    position: relative;
    padding: 14px 64px;
    text-align: center;
    text-decoration: none;
    background: #ffffff;
    color: #000000 !important;
}



@media (max-width: 1199px) {
    .cta-button-section .primary-cta-button {
        padding: 14px 34px;
    }
}


.white-box-square {
    background: #fff;
    padding: 25px 30px 10px 30px;
}

.white-box {
    position: relative;
}

.white-box-ol {
    margin: 1rem 0 3rem 0;
    position: relative;
    padding: 20px;
    background: #dbdbdb;
    z-index: 99;
}

.white-box-ol ol,
.white-box-ol ul {

    position: relative;
    z-index: 99;
}

.white-box-ol li {
    position: relative;
    padding-top: 1rem;
    z-index: 99;
}

.steav-index {
    background: url('../img/background/steav-index.png');
    background-size: 100% 100%;
    width: 592px;
    height: 494px;
    position: absolute;
    /* 	right: -47%; */
    top: 0;
    z-index: -21;
}

.steav-anima {
    -webkit-animation: 1.5s linear 0s 1 normal move_steav;
    animation: 1.5s linear 0s 1 normal move_steav;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}



.skin-preview {
    max-width: 162px;
    max-height: 227px;
}

.hd-skin-preview {
    margin-top: 1rem;
    max-width: 126px;
    max-height: 227px;
}


.skin-card {
    */ width: 90%;
    margin-bottom: 20px;
    border: 1px solid #ffb900;
    box-sizing: border-box;
    /* border-radius: 10px; */
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    z-index: 9999;
}

.skin-card:hover {
    background: linear-gradient(179.94deg, #F8FCC9 0.05%, #EEFFF0 99.95%);
}

.skin-card .skin-title {
    padding: 16px 0;
}

.skin-card .button {
    position: relative;
    width: 100%;
    text-align: center;
    padding: 12px 0;
    background: #ffb900;
    /* border-radius: 10px 10px 0px 0px; */
    font-size: 18px;
    line-height: 22px;
    color: #000;
    border: 0 !important;
}

.skin-card .button::before {
    content: 'СКАЧАТЬ';
    /* background-image: url("../img/ico/download_skins.svg"); */
    background-repeat: no-repeat;
    width: 75px;
    height: 15px;
    top: 0;
    left: 50%;
    /* display:block; */
}

.skin-card .button:hover::before {
    /* background-image: url("../img/ico/download_skins_hover.svg"); */
    color: rgba(255, 255, 255, 0.5);
}


.skins-nick .skin-card .button::after {
    content: 'Скопировать ник';
    /* background-image: url("../img/ico/download_skins.svg"); */
    background-repeat: no-repeat;
    width: 75px;
    height: 15px;
    top: 0;
    left: 50%;
    /* display:block; */
}

.skins-nick .skin-card .button:before {
    content: '';
    background-image: url("../img/ico/copi.png");
    background-repeat: no-repeat;
    width: 18px;
    height: 22px;
    top: 5px;
    left: -10px;
    display: inline-block;
    position: relative;
    z-index: 22;
}

.skin-card .button:hover::after {
    /* background-image: url("../img/ico/download_skins_hover.svg"); */
    color: rgba(255, 255, 255, 0.5);
}




.skins-installation-guide a {
    font-weight: bold;
    font-size: 18px;
    line-height: 22px;
    margin-left: 15px;
}

.skins-installation-guide a:hover {
    -webkit-text-decoration-line: underline;
    text-decoration-line: underline;
    color: #c1c1c1b8;
}

.skins-installation-guide img:nth-child(1) {
    margin-left: 2%;
}

.coupon-alert {
    display: none;
}

.coupon-alert-position {
    z-index: 9999999999;
    position: fixed;
    border-radius: 2px;
    top: 10%;
    right: 0;
    width: auto;
    clear: both;
    margin-top: 10px;
    max-width: 100%;
    height: auto;
    min-height: 48px;
    line-height: 1.5em;
    word-break: break-all;
    background-color: #323232;
    padding: 10px 25px;
    font-size: 1.1rem;
    font-weight: 300;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/*** Gallery ***/

.media-gallery {
    max-width: 734px;
    margin: 1rem 0 3rem 0;
    position: relative;
}


@media (max-width: 900px) {
    .media-gallery {
        width: 100%;
        max-width: 100%;
    }
}

.media-gallery iframe {
    max-height: 400px;
    height: 400px;
    width: 100%;
}

.media-gallery img {
    vertical-align: middle;
}

/* .gallery {
    display: none;
} */


/* Hide the images by default */
.mySlides {

    display: none;
}

/* Поправить параметр при адамтиве, на меньших экранах изображение будет растянуто */
.mySlides img {
    max-height: 419.63px;
    height: 400px;
    width: 100%;
}

@media (max-width: 600px) {
    .mySlides img {
        max-height: 419.63px;
        height: 100%;
        width: 100%;
    }
}

/* Add a pointer when hovering over the thumbnail images */
.cursor {
    cursor: pointer;
}

/* Next & previous buttons */
.prev,
.next {

    cursor: pointer;
    position: absolute;
    top: 40%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: #fff !important;
    font-weight: bold;
    font-size: 20px;
    border-radius: 0 3px 3px 0;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-user-select: none;
}

/* Position the "next button" to the right */
.next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
    background-color: rgba(0, 0, 0, 0.8);
}

/* Number text (1/3 etc) */
.numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

/* Container for image text */
/*  .caption-container {
	text-align: center;
	background-color: #222;
	padding: 2px 16px;
	color: white;
 } */

.row-gal:after {
    content: "";
    display: table;
    clear: both;
}

/* Six columns side by side */
.column {
    position: relative;
    float: left;
    width: 25%;
    z-index: 99;

}

.demo {
    position: relative;
    z-index: 999;
    padding: 4px;
    width: 100%;
    height: 91px;
}

/* Add a transparency effect for thumnbail images */
.demo {
    opacity: 0.6;

}

.active,
.demo:hover {
    opacity: 1;
}



/* Выбранная картинка рамка */


.fig {
    position: relative;
}


.fig::after {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    top: 0%;
    left: 50%;
    transform: translateX(-50%);
    background: black;
    display: block;
    z-index: -1;
}

.fig::before {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    content: '';
    margin-top: -40px;
    z-index: -999;
    border: 20px solid transparent;
    border-bottom: 20px solid black;
}

/* VIDEO */
.video-player button {
    position: absolute;
    top: 44%;
    transform: translateY(-44%);
}


.ytp-large-play-button {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 68px;
    height: 48px;
    margin-left: -34px;
    margin-top: -24px;
    transition: opacity .25s cubic-bezier(0, 0, 0.2, 1);
    z-index: 563;
}

.ytp-button {
    border: none;
    background-color: transparent;
    padding: 0;
    color: inherit;
    text-align: inherit;
    font-size: 100%;
    font-family: inherit;
    cursor: default;
    line-height: inherit;
}

.ytp-large-play-button-bg {
    transition: fill .1s cubic-bezier(0.4, 0, 1, 1), fill-opacity .1s cubic-bezier(0.4, 0, 1, 1);
    fill: #212121;
    fill-opacity: .8;
}

.ytp-large-play-button-bg:hover {
    transition: fill .1s cubic-bezier(0.4, 0, 1, 1), fill-opacity .1s cubic-bezier(0.4, 0, 1, 1);
    fill: #ff0000;
    fill-opacity: .8;
}


/*** DOWNLOAD BOX ***/

.download-white {
    max-width: 1000px;
}


.download-box {
    position: relative;
    width: 100%;
    padding: 40px 0;
    background: #454545;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    z-index: 2;
}

.container-download {
    position: relative;
    max-width: 1004px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
}

.container-download-v2 {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
}


.download-button-flex {
    background-color: #ffb900;
    border-radius: 10px;
    padding: 17px 18px;
    line-height: 19px;
    font-size: 16px;
    color: #000000 !important;
    display: flex;
    text-align: center;
    max-width: 45%;
    margin: 1rem;
}

.download-button-flex:hover {
    color: #989494 !important;
}

.button-wraper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: auto;
}

.button-wraper .button-img .img-hidden {
    background: url('../img/ico/download-ico.svg') no-repeat;
    background-size: 17px 19px;
    display: block;
    width: 30px !important;
    height: 19px;
    margin-left: 0.5rem;
    position: relative;
}


.container-download:after {
    content: '';
    position: absolute;
    background-image: url('../img/background/steav_bow.png');
    background-size: 100% 100%;
    width: 529px;
    height: 322px;
    top: -130px;
    left: -330px;
    z-index: -1;
}

.container-download::before {
    content: '';
    position: absolute;
    background-image: url('../img/background/zombi.png');
    background-size: 100% 100%;
    width: 169px;
    height: 258px;
    top: -160px;
    right: -100px;
    z-index: -1;
}


.download-box .container-text {
    max-width: 750px;
    width: 100%;
}

.download-box .container-text .text {
    background: #FFFFFF;
    position: relative;
    z-index: 99;
    font-weight: 600;
}

@media (max-width: 782px) {
    .download-box .container-text {
        max-width: 750px;
        width: 80%;
    }
}

@media (max-width: 1200px) {

    .download-button {
        margin: 0.4rem;
    }

    .container-download {
        max-width: 850px;
    }

    .container-download::before {
        right: -70px;
    }
}

@media (max-width: 960px) {
    .container-download {
        max-width: 1000px;
    }

    .container-download::before,
    .container-download::after {
        display: none;
    }
}

/*** Recommendation box ***/

.recommendation-box {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.recommendation-box h2 {
    align-self: flex-start;
}

.container-recommendation {
    display: flex;
    justify-content: center;
    width: 100%;
    max-width: 1410px;
    flex-wrap: wrap;
}

.recommendation-maxwh {
    max-width: 1410px;
}

@media (max-width: 1099px) {
    .container-recommendation {
        max-width: 100%;
    }
}

.recommendation-box .rec-item {
    width: 25%;
    height: 320px;
    padding: 20px 20px;
    background: #fff;
    display: flex;
    /* align-items: center; */
    justify-content: space-between;
    flex-direction: column;
    color: #000;
    margin-right: 10px;
    margin-top: 10px;
    max-width: 320px;
    width: 100%;
    /* text-align: center; */
}

.img-recommendation {
    width: 265px !important;
    height: 122px !important;
}



.recommendation-box .rec-item h5 {
    margin-top: 20px;
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
}

.recommendation-box .rec-item:hover {
    background: linear-gradient(180deg, #ffb900 0%, #b49d61 100%);
}


.rating-heart,
.rating-heart-no {
    background-image: url('../img/ico/rating-heart.svg');
    background-size: 100% 100%;
    width: 22px;
    height: 22px;
    display: inline-block;
}

.rating-heart-no {
    background-image: url('../img/ico/rating-heart-big-no.svg');
}

.rating-heart-big,
.heart-icon-large-outline {
    background-image: url('../img/ico/rating-heart-big.svg');
    background-size: 100% 100%;
    width: 30px;
    height: 30px;
    display: inline-block;
}

.heart-icon-large-outline {
    background-image: url('../img/ico/rating-heart-big-no.svg')
}

.count div {
    margin-right: 50px;
}

.count div:last-child {
    margin-right: 0px;
}

.rec-item .count {
    display: flex;
    text-align: center;
    flex-direction: row;
    padding-left: 25px;
    margin-top: 0.3rem;
}

.recommendation-box .rec-item div {
    position: relative;
}

.view,
.dwn,
.comment {
    display: inline-block;
    position: relative;
}

.view::before,
.dwn::before,
.comment::before {
    content: '';
    position: absolute;
    background-image: url('../img/ico/eye-rec.svg');
    background-size: 100% 100%;
    width: 23px;
    height: 23px;
    top: 50%;
    transform: translateY(-50%);
    left: -28px;
    display: inline-block;
}

.dwn::before {
    background-image: url('../img/ico/dwn-rec.svg');
}

.comment::before {
    background-image: url('../img/ico/comment-rec.svg');
}

.recommendation-box .rec-item .recommendation-action .recommendation-download {
    margin-top: 0.5rem;
    display: inline-block;
    vertical-align: top;
    position: relative;
    padding: 14px 64px;
    text-align: center;
    text-decoration: none;
    background: #048B14;
    color: #FFFFFF !important;
    border-radius: 10px;
}

.recommendation-box .rec-item .recommendation-action .recommendation-download:hover {
    background: #004D09;
}



.rec-h2 {
    height: 100% !important;
}

@media(max-width: 1319px) {
    .recommendation-box .rec-item {
        padding: 13px 33px;
        margin-right: 5px;
        margin-top: 5px;
        max-width: 270px;
    }
}

@media (max-width: 1099px) {
    .container-recommendation {
        max-width: 710px;
    }
}

/*** SHARE BOX ***/

.share-box {
    margin: 1.5rem 0;
    display: flex;
    align-items: center;
}

.share-box span {
    display: block;
}


.share-box .text {
    color: #ffb900;
    height: 100%;
    font-weight: 600;
    font-size: 24px;
    margin-right: 13px;
}

/***  FOOTER TEG ***/

.footer-teg {
    position: relative;
    z-index: 99;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.footer-teg .tag-cloud-section {
    max-width: 1411px;
}

.footer-teg .footer-teg-container {
    justify-content: flex-start;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.footer-teg .tag-pill {
    margin: 10px;
}

.footer-teg .tag-pill:nth-child(6),
.footer-teg .tag-pill:nth-child(16),
.footer-teg .tag-pill:nth-child(26),
.footer-teg .tag-pill:nth-child(36),
.footer-teg .tag-pill:nth-child(46),
.footer-teg .tag-pill:nth-child(56),
.footer-teg .tag-pill:nth-child(66),
.footer-teg .tag-pill:nth-child(76),
.footer-teg .tag-pill:nth-child(86),
.footer-teg .tag-pill:nth-child(96),
.footer-teg .tag-pill:nth-child(106),
.footer-teg .tag-pill:nth-child(116),
.footer-teg .tag-pill:nth-child(126) {
    margin-left: 75px !important;
}

@media (max-width:1340px) {
    .footer-teg .tag-cloud-section {
        width: 100%;
        max-width: 1200px;
    }

    .footer-teg .tag-pill {
        margin: 5px;
        max-width: 200px;
    }
}


@media (max-width: 1143px) {
    .footer-teg .tag-cloud-section {
        width: 100%;
        max-width: 800px;
    }

    .footer-teg .tag-pill {
        margin: 5px;
        max-width: 130px;
    }
}

@media (max-width: 800px) {

    .footer-teg .tag-pill:nth-child(6),
    .footer-teg .tag-pill:nth-child(16),
    .footer-teg .tag-pill:nth-child(26),
    .footer-teg .tag-pill:nth-child(36),
    .footer-teg .tag-pill:nth-child(46),
    .footer-teg .tag-pill:nth-child(56),
    .footer-teg .tag-pill:nth-child(66),
    .footer-teg .tag-pill:nth-child(76),
    .footer-teg .tag-pill:nth-child(86),
    .footer-teg .tag-pill:nth-child(96),
    .footer-teg .tag-pill:nth-child(106),
    .footer-teg .tag-pill:nth-child(116),
    .footer-teg .tag-pill:nth-child(126) {
        margin-left: 0px !important;
    }
}

/*** FOOTER ***/

footer a {
    color: #FFFFFF;
    font-weight: 300;
}

footer a:hover {
    color: #1C7315;
}

footer {
    position: relative;
    margin-top: 3rem;
    background: #333333;
    font-size: 18px;
    line-height: 22px;
    color: #FFFFFF;
    padding: 23px 0;
    font-weight: 300;
    z-index: 99;
}


footer .col-12 {
    position: relative;
    z-index: 99;
    margin-top: 1rem;
}

footer .col-md-3:last-child {
    margin-left: 1rem;
}

footer .container-fluid {
    max-width: 1500px;
}


/*** Becground desing img ***/

/*
footer::after {
	content: '';
	position: absolute;
	background-image: url('../img/background/eye-bec.png');
	width: 204px;
	height: 570px;
	right: 1%;
	bottom: 62%;
	z-index: -22;
} */

.green-ore-1,
.index .green-ore-2,
.almaz-ore-1,
.index .almaz-ore-2 {
    position: relative;
    z-index: 99;
}

.green-ore-1:before,
.index .green-ore-2:before {
    content: '';
    position: absolute;
    background-image: url('../img/background/ore-green.svg');
    width: 145px;
    height: 325px;
    z-index: -22;
}

.green-ore-1:before {
    right: 6%;
    top: 30vw;
}

.img-fluid {
    max-height: 350px;
}

.index .green-ore-2:before {
    left: -7vw;
    top: 0;
}

.almaz-ore-1::after,
.index .almaz-ore-2::after,
.dw-minecraft .almaz-ore-1::after {
    content: '';
    position: absolute;
    background-image: url('../img/background/ore-almaz.svg');
    width: 183px;
    height: 250px;
    z-index: -22;
}

.dw-minecraft h1,
.dw-servercraft h1,
.dw-shaderscraft h1,
.dw-texturescraft h1,
.dw-launcherscraft h1 {
    margin-top: 10px;
}

.index .almaz-ore-1::after {
    left: 3%;
    top: 671px;
}

.index .almaz-ore-2::after {
    right: -30vw;
    top: 1px;
}

.dw-minecraft .almaz-ore-1::after {
    top: 0;
    left: -9vw;
}

.article-index h3 {
    font-size: 24px;
}

.article-index h4 {
    font-size: 20px !important;
}

@media (max-width: 1200px) {
    .index .almaz-ore-1 {
        display: none;
    }
}

@media (max-width: 990px) {

    .dw-minecraft .almaz-ore-1::after {
        display: none;
    }

    .index .green-ore-1,
    .index .green-ore-2,
    .index .almaz-ore-2,
    .footer-teg::after {
        display: none;
    }

    .ml-2 {
        margin-left: 0;
    }
}


/*** DOWNLOAD MINECRAFT ***/

/* Group 75 */
.bee-box {
    margin-left: 2rem;
    position: relative;
    width: 365px;
    height: 90px;
    top: -33px;
    left: 0px;
}

/* Bee_types_BE 2 */
.bee-1 {
    position: absolute;
    width: 50px;
    height: 50px;
    left: 320px;
    bottom: 62px;
    background: url('../img/background/Bee_types_BE2.gif');
    -webkit-filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    background-size: 100% 100%;
}



/* Bee_types_BE 6 */
.bee-2 {
    position: absolute;
    width: 40px;
    height: 40px;
    right: 0;
    top: 42px;
    background: url('../img/background/Bee_types_BE2.gif');
    -webkit-filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    background-size: 100% 100%;
}



/* Bee_types_BE 3 */

.bee-3 {
    position: absolute;
    width: 150px;
    height: 98px;
    left: 0px;
    top: 30px;
    background: url('../img/background/Bee_types_BE2.gif');
    -webkit-filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    background-size: 100% 100%;
}


/* Bee_types_BE 4 */

.bee-4 {
    position: absolute;
    width: 110px;
    height: 110px;
    left: 150px;
    bottom: 0;
    background: url('../img/background/Bee_types_BE2.gif');
    -webkit-filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    background-size: 100% 100%;
}


/* Bee_types_BE 5 */

.bee-5 {
    position: absolute;
    width: 90px;
    height: 90px;
    left: 225px;
    top: 50px;

    background: url('../img/background/Bee_types_BE2.gif');
    -webkit-filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    background-size: 100% 100%;
}


@media (max-width: 1100px) {
    .bee-box {
        display: none;
    }

}

.card-wrapper select {
    padding: 12px 10px;
    border: 1px solid;
    border-radius: 10px;
    background-color: #EEEDEF;
}

.card-wrapper a {
    width: 90%;
}

.btn-show-all {
    background: #fff;
    border-radius: 10px;
    padding: 12px 103px;
    border: 0;
}

.btn-show-all:hover {
    background: #EEFFF0;
}

/*? PPaginator  */

.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
}

.page-link {
    position: relative;
    display: block;
    text-decoration: none;
    color: #151515;
    font-weight: bold;
    font-size: 18px;
    line-height: 22px;
    background-color: #ffb900;
    border: 1px solid #ffb900;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.page-link:hover {
    z-index: 2;
    color: #151515;
    background-color: #ffb900;
    border: 1px solid #151515;
    border-radius: 0px;
}

.page-link:focus {
    z-index: 3;
    color: #151515;
    background-color: #ffb900;
    outline: 0;
    box-shadow: 0 0 0 0.1rem #151515;
    border-radius: 0px;
}

.page-item.active .page-link {
    z-index: 3;
    color: #151515;
    background-color: #ffb900;
    border: 0px solid #151515;
}

.arrow-left,
.arrow-right {
    background: url('../img/ico/arrow-left.svg');
    background-size: 100% 100%;
    width: 17px;
    height: 28px;
    display: block;
}

.arrow-right {
    background: url('../img/ico/arrow-right.svg');
}


/*** CARD BOX--DOWNLOAD ***/

.content-wrapper-wide {
    max-width: 1410px;
}

/* .card-box {
    margin-top: 2rem;
} */

.card-box a:hover {
    color: #151515 !important;
}

.card-box h4 {
    font-weight: bold;
    font-size: 22px;
    line-height: 24px;
    color: #151515;
    margin-bottom: 0;
}

.card-box .version {
    font-size: 18px;
    line-height: 22px;
    color: #151515;
}

.card-box .card-item {
    margin-top: 0.5rem;
    padding: 4px;
    background: #ffb900;
    /* border: 1px solid #EEFFF0; */
    color: #000;
    margin-left: 1rem;
    position: relative;
    z-index: 99;
}

.card-box .card-item:hover {
    background: linear-gradient(180deg, #ffb900 0%, #b49d61 100%)
}


/*? NEW CARD */

.card-wrap {
    position: relative;
    display: flex;
    flex-wrap: wrap;
}

.card-wrap .dwn-count-box {
    margin-top: 0rem;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.card-wrap .img-box {
    width: 28%;
}

.card-wrap .img-box img {
    max-height: 230px;
}

.card-wrap .text-box {
    padding-left: 1rem;
    width: 70%;
    display: flex;
    flex-wrap: nowrap !important;
}

.card-wrap .name-box {
    width: 92%;
}

.card-wrap .img-card {
    width: 100%;
    height: 189px;
}

.text-box .text {
    font-size: 16px;
    line-height: 17px;
}

.card-wrap .rating-box {
    width: 8%;
    min-width: 127px;
    display: flex;
    justify-content: flex-end;
}

.card-wrap .year {
    position: absolute;
    right: 0;
    bottom: 0;
}



@media(max-width: 1168px) {
    .card-wrap .img-box {
        width: 40%;
    }

    .card-wrap .text-box {
        width: 60%;
    }

    .dwn-count-box .recommendation-action {
        margin-top: 0.5rem;
        margin-bottom: 1rem;
    }

    .dwn-count-box .count {
        margin-left: 1rem;
    }

    .card-wrap .dwn-count-box {
        margin-top: 2rem;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column-reverse;
    }

    .card-wrap .name-box {
        width: 68%;
    }

    .card-wrap .rating-box {
        width: 30%;
        min-width: 127px;
    }


}


@media(max-width: 960px) {
    .card-box h4 {
        text-align: center;
        margin-top: 1rem;
    }

    .card-box img {
        max-width: 100% !important;
    }



    .card-box {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
    }

    .card-item {
        width: 100%;
        max-width: 80%;
    }

    .card-wrap {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .card-wrap .text-box {
        margin-top: 1rem;
        flex-direction: column-reverse;
        padding-left: 0;
        width: 100%;
    }

    .card-wrap .version {
        justify-content: center;
        display: flex;
    }


    .card-wrap .img-box {
        width: 100%;
        justify-content: center;
        display: flex;
    }

    .card-wrap .name-box {
        width: 100%;
        justify-content: center;
    }

    .card-wrap .rating-box {
        width: 100%;
        justify-content: center;
    }

    .card-item {
        max-width: 80%;
        margin-left: 0rem !important;
    }


}

@media (max-width:500px) {
    .card-item {
        max-width: 95% !important;
        padding: 5px !important;

    }


}

/*! NEW CARD END */


.card-box img {
    width: 100%;
    height: 100%;
}

.card-box .recommendation-action .recommendation-download {
    margin-top: 0.5rem;
    margin-right: 1rem;
    display: inline-block;
    vertical-align: top;
    position: relative;
    padding: 14px 64px;
    text-align: center;
    text-decoration: none;
    background: #FFF;
    color: #000 !important;
}


.card-box .recommendation-action .recommendation-download:hover {
    color: #00000069
}


.card-box .count div {
    margin-right: 50px;
}

.card-box .count div:last-child {
    margin-right: 0px;
}

.card-box .count {
    display: flex;
    text-align: center;
    flex-direction: row;
    margin-top: 0.3rem;
    align-items: flex-end;
    justify-content: center;
}


.card-box .view,
.card-box .dwn,
.card-box .comment {
    display: inline-block;
    position: relative;

}

.card-box .view::before,
.card-box .dwn::before,
.card-box .comment::before {
    content: '';
    position: absolute;
    background-image: url('../img/ico/eye-rec.svg');
    background-size: 100% 100%;
    width: 23px;
    height: 23px;
    top: 50%;

    transform: translateY(-50%);
    left: -28px;
    display: inline-block;
}

.card-box .dwn::before {
    background-image: url('../img/ico/dwn-rec.svg');
}

.card-box .comment::before {
    background-image: url('../img/ico/comment-rec.svg');
}


/*? SIDEBAR DW MINECRAFT  */
.left-sidebar-box {
    position: relative;
    padding: 0;
    padding-left: 1rem;
}



.left-sidebar-box h5,
.left-sidebar-box h5 a {
    font-weight: bold;
    font-size: 20px;
    line-height: 29px;
    color: #ffb900;
}

.left-sidebar-box .pre-ico {
    margin-left: 50px;
    position: relative;
}

.left-sidebar-box .pre-ico::before {
    content: '';
    background-size: 100% 100%;
    width: 35px;
    height: 35px;
    position: absolute;
    left: -50px;
}

.left-sidebar-box .skins::before {
    background: url('../img/ico/skins.png');
}

.left-sidebar-box .hd_skins::before {
    background: url('../img/ico/hd_skins.png');
}

.left-sidebar-box .minecraftpe_skins::before {
    background: url('../img/ico/minecraftpe.png');
}

.left-sidebar-box .mods::before {
    background: url('../img/ico/mods.png');
}

.left-sidebar-box .textures::before {
    background: url('../img/ico/textures.png');
}

.left-sidebar-box .shaders::before {
    background: url('../img/ico/shaders.png');
}

.left-sidebar-box .maps::before {
    background: url('../img/ico/maps.png');
}

.left-sidebar-box .servers::before {
    background: url('../img/ico/servers.png');
}

.left-sidebar-box .launches::before {
    background: url('../img/ico/launchers.png');
}

.left-sidebar-box .seeds::before {
    background: url('../img/ico/seeds.png');
}

.left-sidebar-box .footer-teg {
    margin-left: 0px;
}

.left-sidebar-box .footer-teg::before {
    background-repeat: no-repeat;
    background: url('../img/ico/green_ore.png');
    width: 30px;
    height: 30px;
    left: 0px;
}



.left-sidebar-box ul {
    padding-left: 0;
    list-style: none;
}

.left-sidebar-box li {
    margin-top: 9px;
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
}

span[style="color:#397B21"] {
    color: #ffb900 !important;
}

.sidebar-cta {
    background: #ffb900;
    /* border-radius: 10px; */
    font-size: 16px;
    line-height: 24px;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    width: 90%;
    padding: 10px 5%;
    color: #000;
    border-width: 0;
    border-style: none;
    border-color: none;
    -o-border-image: none;
    border-image: none;
}

.sidebar-cta-red {
    background: #db1313;
}

.aside-button {
    background: #048B14;
    border-radius: 10px;
    font-size: 16px;
    line-height: 19px;
    display: flex;
    align-items: center;
    text-align: center;
    padding: 14px 52px;
    color: #FFFFFF;
    border-width: 0;
    border-style: none;
    border-color: none;
    -o-border-image: none;
    border-image: none;
}



.aside-button:hover,
.sidebar-cta:hover {
    color: #ffffffc7
}

.sidebar-cta-red:hover {
    background: #520808;
}


.aside-button-blue {
    background: #1f8feb;
}

.aside-button-blue:hover {
    background: #0a4b80;
}

.left-sidebar-box h3 {
    font-weight: normal;
    font-size: 20px;
    line-height: 24px;
    margin: 1.5rem 0;
}


.nav-version {
    border: 0;
}

.nav-version li {
    font-size: 18px;
    line-height: 22px;
    color: #151515;
    white-space: nowrap;
    margin-top: 0.6rem;
}

.nav-version input {
    background: #048B14;
    color: red;
    border: 1px solid #151515;

}

.nav-version label {
    cursor: pointer;
}

.aside-show-all {
    margin-left: 1rem;
    border: 0;
    font-size: 14px;
    line-height: 17px;
    -webkit-text-decoration-line: underline;
    text-decoration-line: underline;
}

.aside-show-all:hover {
    text-decoration: none;
}

.border-line-aside {
    position: relative;
}

.border-line-aside::after {
    content: '';
    width: 100%;
    background: #BCBCBC;
    height: 1px;
    display: block;
}

@media (max-width: 1168px) {
    .nav-version li {
        font-size: 16px;
        line-height: 22px;
    }
}

@media (max-width: 991px) {
    .left-sidebar-box:after {
        left: 0;
    }

    .nav-version ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        max-width: 95%;
    }

    .nav-version li {
        font-size: 16px;
        line-height: 22px;
        display: inline;
        padding-left: 0.5rem;
    }
}

@media (max-width:500px) {
    .card-box h4 {
        margin: 1.5rem 0;
        font-size: 15px;
        /* font-weight: 400 !important; */
    }
}

@media (max-width:973px) {
    .left-sidebar-box {
        display: none !important;
    }
}

/*??????? ckheckbox style */
/* для элемента input c type="checkbox" */
.custom-checkbox {
    position: absolute;
    z-index: -1;
    opacity: 0;
}

/* для элемента label, связанного с .custom-checkbox */
.custom-checkbox+label {
    display: inline-flex;
    align-items: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* создание в label псевдоэлемента before со следующими стилями */
.custom-checkbox+label::before {
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    flex-shrink: 0;
    flex-grow: 0;
    border: 1px solid #adb5bd;
    border-radius: 0.25em;
    margin-right: 0.5em;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 50% 50%;
}

/* стили при наведении курсора на checkbox */
.custom-checkbox:not(:disabled):not(:checked)+label:hover::before {
    border-color: #048b14a1;
}

/* стили для активного чекбокса (при нажатии на него) */
.custom-checkbox:not(:disabled):active+label::before {
    background-color: #048b14a1;
    border-color: #048b14a1;
}

/* стили для чекбокса, находящегося в фокусе */
.custom-checkbox:focus+label::before {
    box-shadow: 0 0 0 0.2rem rgba(30, 255, 0, 0.25);
}

/* стили для чекбокса, находящегося в фокусе и не находящегося в состоянии checked */
.custom-checkbox:focus:not(:checked)+label::before {
    border-color: #048b14d8;
}

/* стили для чекбокса, находящегося в состоянии checked */
.custom-checkbox:checked+label::before {
    border-color: #048B14;
    background-color: #048B14;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3e%3c/svg%3e");
}

/* стили для чекбокса, находящегося в состоянии disabled */
.custom-checkbox:disabled+label::before {
    background-color: #e9ecef;
}


.checkbox {
    margin-bottom: 1em;
}

/*! checkbox style END*/


/**** Article index  */



.article-index h1 {
    font-size: 25px;
}

.article-index h2 {
    margin-left: 2rem;
}

.article-index .container-download::before {
    content: '';
    position: absolute;
    background-image: url('../img/background/zombi.png');
    background-size: 100% 100%;
    width: 169px;
    height: 258px;
    top: -169px;
    right: 0;
    z-index: -1;
}

.article-index .container-download::after {
    left: -20vw;
}





.article-index .download-button {
    margin: 1rem;
    display: inline-block;
    vertical-align: top;
    position: relative;
    padding: 20px 18px;
    line-height: 19px;
    font-size: 16px;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 -1px rgba(0, 0, 0, 0.5);
    background: #048B14;
    color: #FFFFFF !important;
    border-radius: 10px;
    font-weight: 600;
    max-width: 231px;
    display: flex;
    align-items: center;
    height: 100%;
    max-height: 80px;
}



.mw-690px {
    max-width: 690px;
}

.statistic-box {
    padding: 26px 20px 20px 20px;
    /* max-width: 670px; */
}

.article-index .almaz-ore-1 {
    left: -31vw;
    z-index: -1;
}

.article-index .green-ore-1 {
    top: -10%;
    right: -30vw;
}

.statistic-box .count {
    margin-left: 1.5rem;
}

/* .article-index h2 {
	position: relative;
}

.mw-690px h2:first-child:after {
	position: absolute;
	content: '';
	background-image: url(/img/background/dragon.png);
	background-size: 100% 100%;
	width: 100%;
	height: 100%;
	width: 749px ;
	height: 404px;
	display: block;
	z-index: 22;
	right: -38vw;
	top: 10vw;
} */


.article-index .aside-menu {
    position: relative;
    z-index: 1;
}

.article-index .aside-menu h5 {
    font-weight: bold;
}

.aside-menu .border-line-aside {
    max-width: 90%;
}

/**** MODS INDEX  */

.mods-index .mw-690px a {
    color: #0d6efd;
}

.mods-index .downlist {
    background: #454545;
    padding: 20px;
    padding-left: 40px;
    color: #fff;
}



.mods-index h1 {
    font-size: 25px;
    line-height: 30px;
}



/*** ADAPTIVE ***/

@media (max-width: 1300px) {
    .tag-items-grid .col-md-2 {
        margin: 9.5px 4.5px;
    }
}

/*** BUTTON TOP  *** /

/* Кнопка вверх */
#myBtn {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 30px;
    z-index: 99;
    font-size: 18px;
    border: none;
    outline: none;
    background-color: #161616;
    color: white;
    cursor: pointer;
    width: 50px;
    height: 50px;
    border-radius: 55px;
    z-index: 999999999;

}

#myBtn:hover {
    opacity: 0.6;
}

.fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.fa-angle-double-up {
    position: relative;
    z-index: 999999999;
}

.fa-angle-double-up:before {
    content: "";
    background-image: url('../img/ico/arrow-top.svg');
    width: 17px;
    height: 22px;
    position: relative;
    z-index: 99;
    display: block;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999999999;
}


@media (max-width: 1200px) {

    .navbar-nav .nav-link {
        padding-left: 0.3rem !important;
        padding-right: 0.3rem !important;
    }

    .nav-item a {
        font-size: 14px !important;
        line-height: 14px !important;
    }

    h1 {
        font-size: 32px;
        line-height: 28px;
    }



    h2 {
        font-size: 26px;
        line-height: 43px;
    }
}


@media (max-width: 990px) {
    h1 {
        font-size: 22px;
        line-height: 30px;
        margin-top: 3rem;
    }

    h2,
    h3 {
        font-size: 21px;
        line-height: 28px;
    }

    .sword-left,
    .sword-right,
    .sword-left-anima,
    .sword-right-anima {
        display: none;
    }
}




@media (max-width: 900px) {
    h1 {
        font-size: 24px;
        line-height: 37px;
    }



    .mt-6 {
        margin-top: 2rem;
    }

    .mt-7 {
        margin-top: 7rem;
    }

    .navbar {
        padding: .5rem;
    }

    ul {
        padding-top: 1rem;
    }

    footer .col-md-3:last-child {
        margin-left: 0rem;
    }

    footer {
        text-align: center;
    }
}

@media (max-width:550px) {

    h1,
    .article-index h1,
    .mods-index h1 {

        font-size: 14px;
        line-height: 22px;
    }

    .index .white-box-ol,
    .navigation-box,
    .white-box-square {
        padding: 10px;
    }

    .navigation-box li {
        font-size: 16px !important;
    }

    .share-box .text {
        font-size: 20px;
        margin-right: 7px;
    }

    .demo {
        height: 50px;
    }

}


/* Checkbox stars */
.rating {
    overflow: hidden;
    vertical-align: bottom;
    display: inline-block;
    width: 155px;
    height: 30px;
}

.rating>input {
    opacity: 0;
    margin-right: -100%;
}

.rating>label {
    position: relative;
    display: block;
    float: right;
    background: url('../img/ico/rating-heart-big-no.svg');
    background-size: 30px 30px;
}


/* .rating .on-hert  {
	position: relative;
	display: block;
	float: right;
	background: url('../img/ico/rating-heart-big.svg');
	background-size: 30px 30px;
} */

/* .rating .on-hert:hover {
	background: url('../img/ico/rating-heart-big-no.svg');
} */

.rating>label:before {
    display: block;
    opacity: 0;
    content: '';
    width: 30px;
    height: 30px;
    background: url('../img/ico/rating-heart-big.svg');
    background-size: 30px 30px;
    transition: opacity 0.2s linear;
}




/* .rating > label.on-hert {
	background: url('../img/ico/rating-heart-big.svg');
} */


.rating>label:hover:before,
.rating>label:hover~label:before,
.rating:not(:hover)> :checked~label:before {
    opacity: 1;
}





.fcdn-download td {
    padding: 5px;
}

/* Для работы спойлеров */
input[id^='spoiler'] {
    display: none;
}

input[id^='spoiler']+label {
    margin: 0 auto;
    padding: 5px 20px;
    text-align: center;
    font-size: 24px;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.6s;
    background: #048b14;
    border-radius: 10px;
    padding: 10px 5%;
    color: #ffffff;
}

input[id^='spoiler']+label::before {
    content: '';
    margin-right: 5px;
    font-size: 20px;
    font-family: 'FontAwesome';
}

input[id^='spoiler']:checked+label {
    color: #333;
    background: #ccc;
}

input[id^='spoiler']:checked+label::before {
    content: '';
}

input[id^='spoiler']~.spoiler {
    height: 0;
    overflow: hidden;
    opacity: 0;
    margin: 10px auto 0;
    padding: 10px;
    background: #eee;
    border: 1px solid #ccc;
    border-radius: 8px;
    transition: all 0.6s;
}

input[id^='spoiler']:checked+label+.spoiler {
    height: auto;
    opacity: 1;
    padding: 10px;
}

.sorted-button-box a {
    padding: 5px;
}

.sorted-button-box .sorted-button-box--active {
    background: #fff;
    color: #000;
}

.category-filter {
    max-width: 1000px;
    position: relative;
    z-index: 999;
}

.category-filter .version,
.category_name {
    -webkit-filter: drop-shadow(2px 2px 3px rgba(21, 21, 21, 0.25));
    filter: drop-shadow(2px 2px 3px rgba(21, 21, 21, 0.25));
    background: #ffffff;
    margin: 0.1rem;

    padding: 1px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: 14px;
    width: 100%;
    max-width: 100px;
}


.category-filter a {
    padding: 0 3px;
}

.category_name {
    max-width: 120px;
    color: #000;
}

.category_name a {
    color: #000;
}

.category-filter--active,
.category-filter--active a,
.category-filter .version a:hover,
.category_name a:hover {
    background: #fff !important;
    color: #00000069 !important;
}


.category-filter .version a {
    background: #ffffff !important;
    color: #000000 !important;
}


.recomend-version {
    background: #FFFFFF;
    padding: 10px;
    margin: 0.5rem;
    color: #000;
}

.recomend-version:hover {
    color: #bebebec2;
}

.fcdn-download {
    background-color: #FFFFFF !important;
    font-size: 22px !important;
    padding: 30px !important;
}



.fcdn-download a:hover {
    color: #0454ff !important;
}

.downlist {
    font-size: 23px;
}





@media (max-width:550px) {

    .downlist,
    .fcdn-download {
        font-size: 18px;
    }
}

@media (max-width:450px) {

    .downlist,
    .fcdn-download {
        font-size: 16px;
    }
}

.emoji,
.emoji2 {
    max-width: 64px !important;
    width: 64px !important;
    max-height: 64px !important;
    height: 64px !important;
}

/* Основные стили для блока управления загрузками */
.news__downloads_controls {
    display: flex;
    flex-wrap: wrap;
    /* Позволяет элементам переноситься */
    gap: 10px;
    /* Отступы между элементами */
    margin-bottom: 20px;
    background-color: #ffb900;
    /* Светлый фон, как на скриншоте */
    padding: 10px 15px;
    align-items: center;
    /* Выравнивание по центру по вертикали */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

/* Стили для кнопок фильтра (Все, Популярные, для Forge и т.д.) */
/* Используем атрибут data-versions-filter для стилизации */
.news__downloads_controls>div[data-versions-filter] {
    padding: 8px 15px;
    border: 1px solid #ccc;
    cursor: pointer;
    background-color: #e9e9e9;
    /* Цвет по умолчанию для неактивных кнопок */
    color: #555;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    font-size: 14px;
    white-space: nowrap;
    /* Предотвращает перенос текста */
    user-select: none;
    /* Предотвращает выделение текста при клике */
}

.news__downloads_controls>div[data-versions-filter]:hover {
    background-color: #ddd;
    border-color: #bbb;
}

/* Стиль для активной кнопки фильтра */
.news__downloads_controls>div[data-versions-filter].active_dw {
    background-color: #363636;
    /* Синий цвет, как на скриншоте */
    color: white;
    border-color: #363636;
    font-weight: bold;
}

/* Стиль для разделителя */
.news__downloads_controls_divider {
    border-left: 1px solid #ccc;
    height: 25px;
    /* Высота разделителя */
    margin: 0 5px;
}

/* Стили для выпадающего списка версий */
.news__downloads_controls select[data-versions-selector] {
    padding: 7px 10px;
    /* Немного меньше padding, чтобы соответствовать кнопкам */
    border: 1px solid #ccc;
    border-radius: 5px;
    background-color: #e9e9e9;
    color: #555;
    cursor: pointer;
    font-size: 14px;
    min-width: 100px;
    /* Минимальная ширина для селектора */
    appearance: none;
    /* Убираем стандартные стили select */
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23000000%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13.2-5.4H18.2c-4.1%200-7.9%201.5-10.9%204.5-3.2%203.1-4.7%207.2-4.7%2011.3s1.5%208.2%204.7%2011.3l133.3%20133.3c3.1%203.1%207.2%204.7%2011.3%204.7%204.1%200%208.2-1.5%2011.3-4.7l133.3-133.3c3.1-3.1%204.7-7.2%204.7-11.3s-1.5-8.2-4.7-11.3z%22%2F%3E%3C%2Fsvg%3E');
    /* Кастомная стрелка */
    background-repeat: no-repeat;
    background-position: right 8px center;
    background-size: 12px;
    padding-right: 25px;
    /* Отступ для стрелки */
}

/* Заголовок секции загрузок */
.news__downloads_title h2 {
    font-size: 24px;
    color: #ffb900;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
}

.news__downloads_title h2::before {
    content: "\21E9";
    /* Unicode символ стрелки вниз */
    /* Если используете Font Awesome, раскомментируйте это: */
    /* font-family: 'Font Awesome 6 Free'; */
    /* font-weight: 900; */
    margin-right: 10px;
    color: #007bff;
    /* Цвет иконки */
}

/* Стили для каждого блока версии */
.news__downloads {
    margin-bottom: 15px;
    /* Отступ между блоками версий */
    overflow: hidden;
    /* Для border-radius */
    background-color: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

/* Заголовок версии внутри блока загрузки */
.downloads__title {
    background-color: #ffb900;
    padding: 10px 15px;
    font-size: 18px;
    font-weight: bold;
    color: #333;
    display: flex;
    align-items: center;
}

.downloads__title p {
    margin: 0;
    display: flex;
    align-items: center;
}

.downloads__title p::before {
    content: "";
    /* Иконка Minecraft */
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url('https://ru-minecraft.ru/templates/ru-minecraft/images/minecraft.png');
    /* Путь к вашей иконке Minecraft */
    background-size: cover;
    margin-right: 8px;
    vertical-align: middle;
}

/* Контейнер для списка файлов */
.downloads__items {
    padding: 15px;
    background-color: #454545;
}

/* Отдельный элемент загрузки (файл) */
.downloads__item {
    display: flex;
    flex-wrap: wrap;
    /* Позволяет элементам переноситься на новую строку */
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px dashed #000000;
    /* Пунктирная линия между файлами */
}

.downloads__item a {
    color: #fff;
}

.downloads__item a:hover {
    color: #9c9b9bdc !important;
}

.downloads__item:last-child {
    border-bottom: none;
    /* Убираем последнюю линию */
}

/* Тип загрузчика (Forge, Neoforge, Fabric) */
.downloads__type {
    display: inline-flex;
    align-items: center;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 13px;
    font-weight: bold;
    color: red;
    margin-right: 15px;
    min-width: 70px;
    /* Для единообразия ширины кнопок */
    justify-content: center;
    text-transform: capitalize;
    /* Автоматически делает первую букву заглавной */
}

.downloads__type a {
    color: white;
    text-decoration: none;
}

/* Цвета для разных типов загрузчиков */
.downloads__type--Forge {
    background-color: #3f51b5;
    /* Темно-синий */
}

.downloads__type--Neoforge {
    background-color: #4CAF50;
    /* Зеленый */
}

.downloads__type--Fabric {
    background-color: #f44336;
    /* Красный */
}

/* Стиль для ссылки на файл */
.attachment {
    flex-grow: 1;
    /* Позволяет ссылке занимать доступное пространство */
    margin-right: 10px;
}

.attachment a {
    color: #ffb900;
    text-decoration: none;
    font-weight: 500;
}

.attachment a:hover {
    text-decoration: underline;
}

.card {
    color: #000 !important;
}



/* Размер файла */
.attachment-size {
    font-size: 12px;
    opacity: 0.7;
    margin-left: 5px;
    white-space: nowrap;
    color: #ffffff;
}

/* Блок зависимостей */
.downloads__deps {
    font-size: 13px;
    color: #fff;
    margin-top: 5px;
    /* Отступ сверху */
    width: 100%;
    /* Занимает всю ширину, если переносится */
    /* Используйте padding-left, если хотите выровнять текст по началу ссылки */
    padding-left: calc(70px + 15px);
    /* min-width downloads__type + margin-right */
    box-sizing: border-box;
}

.downloads__deps a {
    color: #007bff;
    text-decoration: none;
}

.downloads__deps a:hover {
    text-decoration: underline;
}

/* Сообщение "Нет файлов, подходящих под выбранные фильтры" */
.no-files-message {
    padding: 20px;
    text-align: center;
    color: #666;
    font-size: 16px;
    background-color: #ffe0b2;
    /* Светло-оранжевый фон */
    border: 1px solid #ffcc80;
    border-radius: 8px;
    margin-top: 20px;
}

/* Кнопка сброса внутри сообщения "Нет файлов" */
.no-files-message>div[data-versions-reset] {
    display: inline-block;
    margin-top: 10px;
    padding: 8px 15px;
    background-color: #f0ad4e;
    /* Оранжевый */
    color: white;
    border-radius: 5px;
    cursor: pointer;
}



.bedrock-button-download {
    background: #ffffff;
    border-radius: 10px;
    font-size: 16px;
    line-height: 24px;
    padding: 10px 5%;
    color: #000000 !important;
    display: block;
    border-width: 0;
    border-style: none;
    border-color: none;
    -o-border-image: none;
    border-image: none;
    width: 60%;
    max-width: 500px;
    font-weight: bold;
}

.bedrock-button-download:hover {
    background: #ffffff !important;
    color: #b4b4b4b2 !important;
}

.bedrock-views {
    color: #9B9B9B;
    margin-left: 1rem;
    margin-top: 0.5rem;
}

.bedrock-container-text img {
    max-width: 100% !important;
    height: auto !important;
}


@media (max-width: 900px) {
    .bedrock-button-download {
        background: #ffffff;
        border-radius: 10px;
        font-size: 15px;
        line-height: 24px;
        padding: 10px 5%;
        color: #000000;
        display: block;
        border-width: 0;
        border-style: none;
        border-color: none;
        -o-border-image: none;
        border-image: none;
        width: 90%;
        max-width: 500px;
    }

    .adh-banner {
        min-width: 400px;
    }

}