@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');

body,
html {
    height: 100%
}

:root {
    --primary-color: #EFEFED;
    --secondary-color: #fff;
    --text-color: #000;
    --fine-color: #DADADA;
    --news-color: #FBFBFB;
    --donate-image: url(../images/donate/card-icon.svg);
    --profile-menu: url(../images/str.png);
    --ling-color: #fff;
    --img-visible: 1;
    --block-r: #efefed;
    --stars-img: url(../images/profile/stars.png);
    --timers-img: url(../images/profile/timers.png);
    --cash-img: url(../images/profile/cash.png);
    --bank-img: url(../images/profile/bank.png);
    --donate-img: url(../images/profile/donate.png);
    --rub-color: rgba(51, 51, 51, 0.50);

}

.dark-mode {
    --primary-color: #1f1f1f;
    --secondary-color: #303039;
    --text-color: #fff;
    --fine-color: #303039;
    --news-color: #303039;
    --donate-image: url(../images/donate/card-icon-white.svg);
    --profile-menu: url(../images/str-white.png);
    --ling-color: #181616;
    --img-visible: 0;
    --block-r: #1f1f1f;
    --stars-img: url(../images/profile/stars-black.png);
    --timers-img: url(../images/profile/timers-black.png);
    --cash-img: url(../images/profile/cash-black.png);
    --bank-img: url(../images/profile/bank-black.png);
    --donate-img: url(../images/profile/donate-black.png);
    --rub-color: rgba(255, 255, 255, 0.50);
}

body {
    font-family: Inter;
    background: var(--primary-color);
}

#__layout,
#__nuxt {
    height: 100%
}

::-webkit-scrollbar {
    width: 4px
}

::-webkit-scrollbar-track {
    background-color: #ffffff26
}

::-webkit-scrollbar-thumb {
    background: #ffc107
}

.toggle {
    display: flex;
    margin-top: 1px;
    cursor: pointer;
}

.toggle .toggle-icon {
    font-size: 24px;
    color: var(--text-color);
}

.footer-list__link:nth-child(3):hover {
    color: var(--text-color);
}

.burger-menu_btn {
    display: none;
    position: absolute;
    width: 40px;
    height: 40px;
    background-color: transparent;
}

.burger-menu_btn span {
    position: absolute;
    width: 30px;
    height: 3px;
    background-color: var(--text-color);
    left: 5px;
    transition: transform .5s, opacity .5s;
}

.burger-menu_btn span:nth-child(1) {
    transform: translateY(-10px);
}

.burger-menu_btn span:nth-child(2) {
    transform: translateY(10px);
}

.nav.open .burger-menu_btn span:nth-child(1) {
    transform: translateY(0) rotate(45deg);
}

.nav.open .burger-menu_btn span:nth-child(2) {
    opacity: 0;
}

.nav.open .burger-menu_btn span:nth-child(3) {
    transform: translateY(0) rotate(-45deg);
}


.container {
    margin: 0 auto;
    padding: 0 15px;
    max-width: 1200px;
}

.nav {
    padding: 10px 0 0 0;
}

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

.upper {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.apps {
    display: -ms-flexbox;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    overflow: hidden;
    flex: 1 0 auto;
}

.aaa {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto
}

img.logo {
    width: 65px;
    height: 79px;
    margin-left: 10px;  
}

.nav-list {
    display: flex;
    align-items: center;
    column-gap: 60px;
}

.nav-list__link {
    color: var(--text-color);
    transition: color .2s ease;
}

.nav-list__link:hover {
    color: #757070;
}

.nav-list__link--active {
    position: relative;
    top: 1px;
}

.nav-list__link--active::after {
    content: "";
    display: block;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    top: 1px;
    border-bottom: 3px solid #68db00;
    width: 50%;
    border-radius: 10px;
}

.nav-list__btn-profile {
    border-radius: 5px;
    background: linear-gradient(301deg, #408502 0%, #68db00 100%);
    box-shadow: 0px 0px 10px 5px rgb(61 249 0 / 26%);
    transition: transform .2s ease;
}

.nav-list__btn-profile:hover {
    transform: scale(1.01);
}

.nav-list__btn-navbar {
    margin-left: 17px;
    width: 195px;
    text-align: center;
    cursor: pointer;
}

.header-container {
    display: flex;
    justify-content: space-between;
    column-gap: 60px;
    padding-bottom: 25px;
}

.btn-info {
    margin-top: 40px;
    width: 200px;
    display: flex;
    height: 50px;
    border-radius: 9px;
    background: linear-gradient(266deg, #408502 0%, #68db00 100%);
    box-shadow: 0px 0px 10px 5px rgb(61 249 0 / 26%);
    cursor: pointer;
    transition: transform .2s ease;
    justify-content: center;
    align-items: center;
}

.btn-info:hover {
    transform: scale(1.01);
}

.nav-list__link-profile {
    display: block;
    color: var(--text-color);
    margin: 15px 25px;
}

.link_btn-info {
    column-gap: 10px;
    display: flex;
    color: #fff;
    text-wrap: nowrap;
    align-items: center;
}

img.play {
    display: block;
    width: 14px;
    height: 15px;
    background-repeat: no-repeat;
    object-fit: cover;
}

.car {
    width: 515px;
    height: 430px;
    margin-left: 40px;
    background: url(../images/car.png);
    background-repeat: no-repeat;
    background-size: cover;
}

.info-title:nth-child(1) {
    position: relative;
    font-weight: 700;
    margin-top: 6rem;
    font-size: 30px;
    line-height: 35px;
    color: var(--text-color);
    max-width: 587px;
}

.info-title:nth-child(2) {
    font-weight: 500;
    margin-top: 30px;
    font-size: 18px;
    color: var(--text-color);
    max-width: 475px;
}

.info-title:nth-child(3) {
    font-weight: 500;
    margin-top: 20px;
    font-size: 18px;
    color: var(--text-color);
    max-width: 505px;
}

.info-title:nth-child(1) span {
    background: linear-gradient(180deg, #408502 0%, #68db00 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.info-title:nth-child(1)::after {
    content: "RP";
    position: absolute;
    display: flex;
    margin-left: 19.1rem;
    margin-top: -5rem;
    width: 30px;
    font-size: 13px;
    height: 15px;
    border-radius: 3px;
    background: #68db00;
    box-shadow: 0px 0px 10px 0px #68db00;
    justify-content: center;
    align-items: center;
}

.info-title:nth-child(1)::before {
    content: "РЕАЛЬНО КРУТОЙ";
    position: absolute;
    width: 475px;
    color: var(--ling-color);
    font-size: 60px;
    line-height: 60px;
    letter-spacing: 30px;
    margin-top: -20px;
    z-index: -1;
    opacity: 0.8;
}

.servers_list::after {
    content: "МОНИТОРИНГ";
    position: absolute;
    margin-top: -168px;
    margin-left: 1049px;
    color: var(--ling-color);
    font-weight: 600;
    font-size: 56px;
    opacity: 0.5;
    z-index: -1;
}

.servers_list-row {
    display: flex;
    justify-content: center;
    column-gap: 15px;
    padding-bottom: 40px;
}

.servers-item {
    position: relative;
    width: 270px;
    height: 90px;
    border-radius: 10px;
    background: var(--secondary-color);
    overflow: hidden;
    transition: all .3s ease;
}

.servers-item:hover {
    transform: scale(1.05);
    box-shadow: 0px 0px 77px -31px rgba(0, 0, 0, 0.27);
}

.servers-item:nth-child(2) .progress__value {
    background: #FFA959;
}

.servers-item:nth-child(3) .progress__value {
    background: rgba(173, 255, 0, 0.50);
}

.servers-item:nth-child(2) .server-text::after {
    background-color: #FFA959;
    box-shadow: 0px 0px 0px 2px rgba(255, 169, 89, 0.1);
}

.servers-item:nth-child(3) .server-text::after {
    background-color: #ADFF00;
    box-shadow: 0px 0px 0px 2px rgba(173, 255, 0, 0.1);
}

.servers-item:nth-child(4) {
    width: 140px;
}

.servers-item:nth-child(4) .server-text {
    margin-left: 60px;
    margin-top: 50px;
    font-size: 12px;
}

.servers-item:nth-child(4) .server-text::after {
    background-color: #A1DF36;
    box-shadow: 0px 0px 0px 2px rgba(161, 223, 54, 0.1);
}

.servers-item:nth-child(4) .server-text_sub {
    text-wrap: nowrap;
    margin-top: 30px;
    margin-left: 30px;
}

img.servers-circle {
    object-fit: cover;
    position: absolute;
    width: 35%;
    margin-top: 62px;
    margin-left: -22px;
}

img.servers-icon {
    position: absolute;
    width: 12%;
    object-fit: cover;
    background-repeat: no-repeat;
    margin-top: 19px;
    margin-left: 30px;
    z-index: 2;
}

img.servers-icon_two {
    position: absolute;
    width: 20%;
    z-index: 1;
    margin-top: -6px;
    margin-left: -6px;
    opacity: var(--img-visible);
}

.server-text {
    position: absolute;
    font-size: 14px;
    font-weight: 500;
    margin-top: 21px;
    margin-left: 90px;
    display: flex;
    align-items: center;
    color: var(--text-color);
}

.server-text::after {
    content: "";
    position: absolute;
    left: 0;
    margin-left: -10px;
    width: 5px;
    height: 5px;
    background-color: #FFDB59;
    box-shadow: 0px 0px 0px 2px rgba(255, 219, 89, 0.1);
    border-radius: 50%;
}

.server-text_sub {
    position: absolute;
    font-size: 10px;
    font-weight: 600;
    color: #DBD7CF;
    margin-top: 44px;
    margin-left: 80px;
}

img.copy-ip {
    position: absolute;
    margin-left: 200px;
    margin-top: 20px;
    width: 5%;
    cursor: pointer;
    object-fit: cover;
    background-repeat: no-repeat;
}

.progress {
    background: #D7D7D7;
    border-radius: 10px;
    position: relative
}

.progress__value {
    border-radius: 10px;
    position: absolute;
    top: 0;
    left: 0;
    background: #FFDB59;
}

.progress-bar {
    position: absolute;
    margin-top: 68px;
    margin-left: 50px;
}

.section-block_row {
    padding-bottom: 40px;
    display: flex;
    justify-content: center;
}

.section-invis {
    width: 100px;
    height: 8px;
    border-radius: 5px;
    background: #FFF;
}

.section-vis {
    width: 50%;
    height: 8px;
    border-radius: 5px;
    background: #68db00;
}

.start-game_row {
    display: flex;
    justify-content: center;
    padding-bottom: 30px;
}

.start-game_block {
    display: flex;
    width: 1000px;
    height: 300px;
    border-radius: 14px;
    background: var(--secondary-color);
    overflow: hidden;
}

.start-game_left {
    width: 43%;
}

a.start-game_video {
    position: absolute;
    display: flex;
    box-shadow: 0px 0px 0px 15px rgba(249, 92, 62, 0.2);
    background-color: #F95C3E;
    width: 80px;
    margin-top: -12rem;
    margin-left: 10rem;
    height: 80px;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
}

img.start-game_video {
    width: 25px;
}

.start-game_text:nth-child(1) {
    margin-top: 50px;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 1.1px;
    width: 296px;
    margin-left: 20px;
    color: var(--text-color);
}

.start-game_text:nth-child(2) {
    margin-left: 20px;
    margin-top: 25px;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0.8px;
    width: 400px;
    color: var(--text-color);
}

.start-game_text:nth-child(3) {
    margin-left: 20px;
    margin-top: 25px;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0.8px;
    width: 425px;
    color: var(--text-color);
}

.header-block_help {
    position: absolute;
    display: flex;
    color: #D6D4CF;
    text-transform: uppercase;
    font-size: 16px;
    transform: rotate(270deg);
    font-weight: 500;
    margin-left: 327px;
    margin-top: 300px;
    cursor: default;
    align-items: center;
}

.header-block_help::after {
    content: "";
    width: 150px;
    height: 2px;
    background: #E2E2E1;
    position: absolute;
    margin-left: 90px;
}

.play-block_help {
    position: absolute;
    display: flex;
    color: #D6D4CF;
    text-transform: uppercase;
    font-size: 16px;
    transform: rotate(270deg);
    font-weight: 500;
    margin-left: 281px;
    cursor: default;
    align-items: center;
}

.play-block_help::after {
    content: "";
    width: 150px;
    height: 2px;
    background: #E2E2E1;
    position: absolute;
    margin-left: 180px;
}

.settings-block_help {
    position: absolute;
    display: flex;
    color: #D6D4CF;
    text-transform: uppercase;
    font-size: 16px;
    transform: rotate(270deg);
    font-weight: 500;
    margin-left: -58px;
    margin-top: 365px;
    cursor: default;
    align-items: center;
}

.settings-block_help::after {
    content: "";
    width: 150px;
    height: 2px;
    background: #E2E2E1;
    position: absolute;
    margin-left: 115px;
}

.news-block_help {
    position: absolute;
    display: flex;
    color: #D6D4CF;
    text-transform: uppercase;
    font-size: 16px;
    transform: rotate(270deg);
    font-weight: 500;
    margin-left: -88px;
    margin-top: 308px;
    cursor: default;
    align-items: center;
}

.news-block_help::after {
    content: "";
    width: 150px;
    height: 2px;
    background: #E2E2E1;
    position: absolute;
    margin-left: 100px;
}

.profile-block_help {
    position: absolute;
    display: flex;
    color: #D6D4CF;
    text-transform: uppercase;
    font-size: 16px;
    transform: rotate(270deg);
    font-weight: 500;
    margin-left: -120px;
    margin-top: 350px;
    cursor: default;
    align-items: center;
}

.profile-block_help::after {
    content: "";
    width: 150px;
    height: 2px;
    background: #E2E2E1;
    position: absolute;
    margin-left: 170px;
}

.admin-block_help {
    position: absolute;
    display: flex;
    color: #D6D4CF;
    text-transform: uppercase;
    font-size: 16px;
    transform: rotate(270deg);
    font-weight: 500;
    margin-left: -120px;
    margin-top: 320px;
    cursor: default;
    align-items: center;
}

.admin-block_help::after {
    content: "";
    width: 150px;
    height: 2px;
    background: #E2E2E1;
    position: absolute;
    margin-left: 130px;
}

.play-block_row {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

.play-block_item {
    display: flex;
    column-gap: 15px;
    padding-bottom: 10px;
}

.play-block_left {
    width: 150px;
    height: 150px;
    background-color: var(--secondary-color);
    border-radius: 11px;
    display: flex;
    font-size: 26px;
    font-weight: 600;
    color: var(--text-color);
    justify-content: center;
    align-items: center;
    letter-spacing: 1.6px;
    overflow: hidden;
}

.play-block_left::after {
    content: "";
    position: absolute;
    background-color: #68db00;
    width: 3px;
    height: 30px;
    margin-top: -120px;
    border-radius: 0 0 10px 10px;
}

.play-block_left::before {
    content: "";
    position: absolute;
    background-color: #68db00;
    width: 3px;
    height: 30px;
    margin-top: 120px;
    border-radius: 10px 10px 0 0;
}

.play-block_left p {
    position: relative;
    z-index: 1;
}

.play-block_left p::after {
    content: "ШАГ";
    position: absolute;
    color: var(--block-r);
    font-size: 34px;
    margin-left: -60px;
    margin-top: -5px;
    z-index: -1;
}

.play-block_right {
    position: relative;
    border-radius: 11px;
    background-color: var(--secondary-color);
    height: 150px;
    width: 835px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.play-block_right::after {
    content: "";
    background-color: #68db00;
    box-shadow: 0px 0px 20px #68db00;
    width: 20px;
    height: 20px;
    margin-left: -17px;
    border-radius: 50%;
    position: absolute;
}

.play-block_right::before {
    content: "";
    background-color: var(--block-r);
    width: 50px;
    height: 50px;
    margin-left: -32px;
    border-radius: 50%;
    position: absolute;
}

.play-block_text {
    margin-left: 60px;
    color: var(--text-color);
}

a.download_page {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 600px;
    background: linear-gradient(266deg, #408502 0%, #68db00 100%);
    box-shadow: 0px 0px 10px 5px rgb(61 249 0 / 26%);
    width: 200px;
    border-radius: 7px;
    height: 50px;
    color: #fff;
    transition: transform .2s ease;
}

a.download_page:hover {
    transform: scale(1.01);
}

.download {
    display: flex;
    align-items: center;
    column-gap: 5px;
    justify-content: center;
}

img.download {
    width: 15px;
    border-radius: 50%;
}

.social-block_help {
    position: absolute;
    display: flex;
    color: #D6D4CF;
    text-transform: uppercase;
    font-size: 20px;
    transform: rotate(270deg);
    font-weight: 500;
    margin-left: 316px;
    margin-top: 400px;
    cursor: default;
    align-items: center;
}

.social-block_help::after {
    content: "";
    width: 150px;
    height: 2px;
    background: #E2E2E1;
    position: absolute;
    margin-left: 110px;
}

.social-block_row {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

.social-block_item {
    background-color: var(--secondary-color);
    max-width: 1000px;
    height: 300px;
    border-radius: 11px;
    position: relative;
    overflow: hidden;
    margin-top: 30px;
}

.social-text {
    position: absolute;
    top: 0;
    font-size: 26px;
    font-weight: 500;
    margin-top: 60px;
    margin-left: 50px;
    color: var(--text-color);
}

.social-block_item:nth-child(2) .social-text,
.social-block_item:nth-child(2) .social-sub {
    margin-left: 500px;
}

.social-sub {
    position: absolute;
    top: 0;
    max-width: 406px;
    margin-top: 115px;
    margin-left: 50px;
    color: #BEBEBE;
}

a.vkontakte-btn {
    position: absolute;
    top: 0;
    left: 0;
    margin-left: 50px;
    margin-top: 200px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(45deg, #408502 0%, #68db00 100%);
    box-shadow: 0px 0px 10px 5px rgb(61 249 0 / 26%);
    border-radius: 8px;
    color: #fff;
    transition: transform .2s ease;
}

a.vkontakte-btn:hover {
    transform: scale(1.01);
}

.vkontakte-text {
    display: flex;
    align-items: center;
    column-gap: 10px;
    margin: 20px 30px;
}

.vkontakte-img {
    width: 20px;
    border-radius: 50%;
}

a.discord-btn {
    position: absolute;
    top: 0;
    left: 0;
    margin-left: 500px;
    margin-top: 200px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(45deg, #408502 0%, #68db00 100%);
    box-shadow: 0px 0px 10px 5px rgb(61 249 0 / 26%);
    border-radius: 8px;
    color: #fff;
    transition: transform .2s ease;
}

a.discord-btn:hover {
    transform: scale(1.01);
}

.discord-text {
    display: flex;
    align-items: center;
    column-gap: 10px;
    margin: 20px 30px;
}

.discord-img {
    width: 20px;
    border-radius: 50%;
}

.footer {
    height: 5rem;
    margin-top: 3.5rem;
    background-color: var(--fine-color);
    display: flex;
    align-items: center;
    transition: all .2s ease;
    flex: 0 0 auto;
}

.footer__wrap {
    display: flex;
    width: 100%;
    align-items: center;
}

.footer__logo img {
    width: 30px;
}

.footer__logo {
    color: var(--text-color);
    display: flex;
    align-items: center;
    text-decoration: none;
    text-align: center;
    column-gap: 5px;
    font-weight: 400;
    font-size: 16px;
    transition: color .2s ease;
}

.footer__logo span {
    font-weight: 700;
}

.footer-list {
    display: flex;
    align-items: center;
    column-gap: 60px;
    font-size: 16px;
    margin-left: 70px;
    font-weight: 400;
    font-family: Inter;
}

.footer-list__link {
    color: var(--text-color);
    transition: color .2s ease;
    text-wrap: nowrap;
}

.footer-list__link:hover {
    color: #757070;
}

.news {
    font-size: 40px;
    font-weight: 500;
    width: 0px;
    color: var(--text-color);
}

.news::after {
    content: "НОВОСТИ ПРОЕКТА";
    position: absolute;
    width: 10px;
    color: var(--ling-color);
    font-size: 47px;
    font-weight: 700;
    letter-spacing: 10px;
    margin-top: -105px;
    margin-left: -5px;
    z-index: -1;
    opacity: 0.6;
}

.news span {
    font-weight: 300;
}

.news_item-row {
    display: flex;
    align-items: center;
    column-gap: 40px;
}

.news-print {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 3rem;
}

a.news-vk_btn {
    width: 180px;
    height: 60px;
    border-radius: 6px;
    border: 2px solid #68db00;
    box-shadow: 0px 0px 10px 0px #68db00;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all .2s ease;
}
a.news-vk_btn:hover {
    transform: scale(1.02);
    background-color: #68db00;
}

.news-vk_text {
    text-decoration: none;
    color: var(--text-color);
}

.news_item {
    margin-top: 6rem;
    width: 358px;
    height: 441px;
    border-radius: 10px;
    border: 2px solid var(--news-color);
    background: var(--news-color);
    overflow: hidden;
    transition: all .2s ease;
}

.news_item:hover {
    box-shadow: 0 32px 50px -16px rgba(0,0,0,.12);
    transform: translateY(-16px)
}

.news__image {
    width: 100%;
    height: 200px;
}

.news__title {
    font-size: 16px;
    font-weight: 700;
    margin-top: 22px;
    margin-left: 13px;
    color: var(--text-color);
}

.news__desc {
    color: #AFAFAF;
    width: 325px;
    height: 75px;
    font-size: 12px;
    margin-top: 28px;
    margin-left: 13px;
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
}

.news_down {
    display: flex;
    justify-content: center;
    column-gap: 95px;
    margin: 0px 5px;
    align-items: center;
    margin-top: 50px;
}

.news__date {
    color: #AFAFAF;
    font-weight: 600;
    font-size: 14px;
}

.news__btn {
    width: 148px;
    display: flex;
    height: 28px;
    align-items: center;
    border-radius: 5px;
    border: 1px solid #68db00;
    box-shadow: 0px 0px 5px 1px rgb(96 249 0 / 20%);
    justify-content: center;
    cursor: pointer;
    transition: all .2s ease;
}

.news__btn:hover {
    background-color: #68db00;
    border: none;
}

.loader {
    width: 100px;
    height: 100px;
    margin-top: 10rem;
    margin-left: auto;
    margin-right: auto;
    display: inline-block;
    position: relative;
  }
  .loader::after,
  .loader::before {
    content: '';
    box-sizing: border-box;
    width: 100px;
    height: 100px;
    border: 4px solid var(--secondary-color);
    position: absolute;
    left: 0;
    top: 0;
    animation: animloader 2s ease-in-out infinite;
  }
  .loader::after {
    border-color: #f9ab00;
    animation-delay: 1s;
  }
  
  @keyframes animloader {
    0% {
      transform: scale(0);
      opacity: 1;
    }
    100% {
      transform: scale(1);
      opacity: 0;
    }
  }
      

a.post-card__link {
    text-decoration: none;
    color: #68db00;
    font-size: 14px;
}

.news__btn:hover a.post-card__link {
    color: #FBFBFB;
}

.swal-icon--success__hide-corners {
    background-color: #fff0;
}

.swal-icon--success:after, .swal-icon--success:before {
    position: inherit;
}

.swal-modal {
    background-color: var(--secondary-color);
}

.swal-title {
    color: var(--text-color);
}

.swal-text {
    color: var(--text-color);
}

.login-block_row {
    display: flex;
    justify-content: center;
    height: 73.81vh;
    align-items: center;
}

.login-item {
    width: 430px;
    height: 438px;
    background-color: var(--secondary-color);
    border-radius: 15px;
    display: flex;
    box-shadow: 0px 3px 0px 0px #68db00;
    flex-direction: column;
    align-items: center;
}

.login {
    font-weight: 700;
    color: #68db00;
    font-size: 30px;
    margin-top: 19px;
}

.login_case {
    width: 329px;
    height: 51px;
    border-radius: 5px;
    background: #defae1;
    display: flex;
    margin: 7px 0 14px 0;
}

.login_form {
    display: flex;
    flex-direction: column;
    margin-top: 50px;
}

.login_case,
.settings_case,
.admin_case,
.modal-donate_case {
    transition: all .2s ease;
}

.login_case:hover,
.settings_case:hover,
.admin_case:hover,
.modal-donate_case:hover {
    transform: scale(1.01);
}

.login_case input,
.settings_case input,
.admin_case input,
.modal-donate_case input {
    width: 100%;
    margin: 0 10px;
    border-radius: 5px;
}

.login-text {
    color: #68db00;
    font-size: 15px;
    font-weight: 500;
}

.login_btn {
    width: 238px;
    height: 49px;
    border-radius: 7px;
    background: linear-gradient(301deg, #408502 0%, #68db00 100%);
    box-shadow: 0px 0px 10px 5px rgb(61 249 0 / 26%);
    color: var(--text-color);
    display: flex;
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
    align-items: center;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 17px;
    margin-top: 12px;
    transition: transform .2s ease;
}

.login_btn:hover {
    transform: scale(1.01);
}

.profile {
    display: flex;
    justify-content: center;
}

.settings {
    display: flex;
    justify-content: center;
    column-gap: 20px;
}

.admin {
    display: flex;
}

.card-profile_player {
    display: flex;
    justify-content: center;
    margin-top: 99px;
    background: var(--secondary-color);
    width: 284px;
    height: 377px;
    border-radius: 10px;
    box-shadow: 0px 3px 0px 0px #68db00;
    transition: all .10s ease;
}

.number-server {
    position: absolute;
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    margin-left: -215px;
    margin-top: 12px;
    text-transform: uppercase;
    color: var(--text-color);
}

.number-server span {
    color: #68db00;
    font-weight: 700;
    font-size: 20px;
}

.player-icon {
    width: 180px;
    height: 180px;
    background-color: #68db00;
    border-radius: 50%;
    box-shadow: 0px 0px 0px 15px rgb(191 255 159 / 58%);
    margin-top: 35px;
    overflow: hidden;
}

.player-image {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
}

.player-name {
    position: absolute;
    margin-top: 240px;
    width: 284px;
    letter-spacing: 1px;
    font-weight: 500;
    font-size: 20px;
    text-align: center;
    color: var(--text-color);
}

.player-status {
    position: absolute;
    margin-top: 270px;
    width: 284px;
    font-weight: 300;
    font-size: 12px;
    letter-spacing: 1.92px;
    color: var(--text-color);
    text-align: center;
}

.btn_profile-exit {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 156px;
    height: 41px;
    margin-top: 305px;
    border-radius: 5px;
    border: 2px solid #FF5C39;
    cursor: pointer;
    background: rgba(217, 217, 217, 0.00);
    transition: all .2s ease;
}

.btn__exit {
    color: #FF5C39;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

.btn_profile-exit:hover {
    background: #FF5C39;
}

.btn_profile-exit:hover .btn__exit {
    color: #fff;
}

.card-profile_level {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 99px;
    margin-left: 16px;
    width: 226px;
    height: 132.015px;
    border-radius: 10px;
    background: var(--secondary-color);
    box-shadow: 0px 3px 0px 0px #68db00;
    transition: all .10s ease;
}

.card-profile_level:hover,
.card-profile_game:hover,
.card-profile_money:hover,
.card-profile_bank:hover {
    margin-top: 92px;
    background-color: var(--secondary-color);
}

.card-profile_level__stars {
    background-image: var(--stars-img);
    width: 70%;
    height: 43%;
    margin-top: 5.74px;
    background-size: cover;
    background-repeat: no-repeat;
}

.card-profile_level-text {
    margin-top: 5px;
    font-size: 14px;
    letter-spacing: 1.4px;
    font-weight: 400;
    color: var(--text-color);
}

.card-profile_level-text span {
    font-weight: 700;
}

.card-profile_level-exp {
    color: #AFAFAF;
    font-weight: 500;
    font-size: 12px;
    letter-spacing: 0.24px;
    margin-top: 5.74px;  
    transition: all .10s ease; 
}

.card-profile_game {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 99px;
    margin-left: 16px;
    width: 140px;
    height: 132.015px;
    border-radius: 10px;
    background: var(--secondary-color);
    box-shadow: 0px 3px 0px 0px #68db00;
    transition: all .10s ease;
}

.card-profile_game__timers {
    background-image: var(--timers-img);
    width: 80%;
    height: 35%;
    margin-top: 20px;
    background-size: cover;
    background-repeat: no-repeat;
}

.card-profile_game-text {
    font-size: 14px;
    font-weight: 700;
    color: var(--text-color);
}

.card-profile_game-desc {
    color: #AFAFAF;
    font-size: 12px;
    font-weight: 500;
    margin-top: 6px;
    text-align: center;
    width: 76px;
    letter-spacing: 0.24px;
    transition: all .10s ease;
}

.card-profile_money {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 231px;
    height: 132.015px;
    border-radius: 10px;
    background: var(--secondary-color);
    box-shadow: 0px 3px 0px 0px #68db00;
    margin-top: 99px;
    margin-left: 16px;
    transition: all .10s ease;
}

.card-profile_money_image {
    background-image: var(--cash-img);
    width: 45%;
    height: 38%;
    margin-top: 5.74px;
    background-size: cover;
    background-repeat: no-repeat;
}

.card-profile_money-text {
    margin-top: 10px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1.4px;
    color: var(--text-color);
}

.card-profile_money-desc {
    color: #AFAFAF;
    font-size: 12px;
    letter-spacing: 0.24px;
    font-weight: 500;
    width: 152px;
    margin-top: 5px;
    text-align: center;
    transition: all .10s ease;
}

.card-profile_bank {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 99px;
    width: 226px;
    height: 132.015px;
    margin-left: 16px;
    border-radius: 10px;
    background: var(--secondary-color);
    box-shadow: 0px 3px 0px 0px #68db00;
    transition: all .10s ease;
}

.card-profile_bank_image {
    background-image: var(--bank-img);
    width: 45%;
    height: 38%;
    margin-top: 5.74px;
    background-size: cover;
    background-repeat: no-repeat;
}

.card-profile_bank_text {
    margin-top: 10px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1.4px;
    color: var(--text-color);
}

.card-profile_bank-desc {
    color: #AFAFAF;
    font-size: 12px;
    letter-spacing: 0.24px;
    font-weight: 500;
    width: 152px;
    margin-top: 5px;
    text-align: center;
    transition: all .10s ease;
}

.card-profile_info {
    position: absolute;
    margin-top: 245px;
    margin-left: -190px;
    width: 380px;
    height: 231px;
    border-radius: 10px;
    background: var(--secondary-color);
    box-shadow: 0px 3px 0px 0px #68db00;
    transition: all .10s ease;
}

.card-profile_info-information {
    width: 345px;
    display: flex;
    justify-content: space-between;
    position: relative;
    color: var(--text-color);
    font-size: 12px;
    font-weight: 500;
    top: 16px;
    margin-bottom: 8px;
    margin-left: 18px;
}

.card-profile_donate {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: absolute;
    margin-top: 245px;
    margin-left: 365px;
    width: 140px;
    height: 132.566px;
    border-radius: 10px;
    background: var(--secondary-color);
    box-shadow: 0px 3px 0px 0px #68db00;
    transition: all .10s ease;
}

.card-profile_donate-image {
    background-image: var(--donate-img);
    width: 70%;
    height: 37%;
    margin-top: 10px;
    background-size: cover;
    background-repeat: no-repeat;
}

.card-profile_donate-text {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1.4px;
    color: var(--text-color);
}

.card-profile_donate-desc {
    color: #AFAFAF;
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    margin-top: 4px;
    letter-spacing: 0.24px;
}

.card-profile_money-text span,
.card-profile_bank_text span,
.card-profile_donate-text span {
    color: var(--rub-color);
}

.coming-elements_container {
    display: flex;
    column-gap: 15px;
    margin-top: 40px;
}

.homes-block {
    display: flex;
    flex-direction: column;
}

.homes-block_help::after {
    content: "Дома";
    position: absolute;
    margin-top: -23px;
    color: var(--text-color);
    margin-left: 50px;
    font-size: 16px;
    font-weight: 500;
}

.homes-block_help::before {
    content: "";
    position: absolute;
    width: 40px;
    height: 3px;
    border-radius: 10px;
    background-color: #D6D4CF;
    margin-top: -13px;
}

.homes-block_item {
    display: flex;
    width: 285px;
    height: 91.014px;
    margin: 5px 0;
    border-radius: 10px;
    background: var(--secondary-color);
    box-shadow: 0px 3px 0px 0px #68db00;
}

.profile-item-none .homes-block_item {
    padding-bottom: 10rem;    
}

.profile-item-none {
    color: var(--text-color);
    display: flex;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
}

.homes-block_image {
    background-image: url(../images/profile/home.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 70px;
    height: 70px;
    margin-top: 10px;
    margin-left: 10px;
}

.homes-block_number {
    margin-top: 28px;
    font-size: 16px;
    font-weight: 500;
    margin-left: 5px;
    color: var(--text-color);
}

.homes-block_price {
    position: absolute;
    font-size: 16px;
    font-weight: 400;
    margin-top: 49px;
    margin-left: 85px;
    color: var(--text-color);
}

.homes-block_price span {
    color: #AEAEAE;
    font-size: 14px;
    font-weight: 500;
}

.cars-block {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.cars-block_help::after {
    content: "Автопарк";
    position: absolute;
    margin-top: -23px;
    margin-left: 55px;
    color: var(--text-color);
    font-size: 18px;
    font-weight: 500;
}

.cars-block_help::before {
    content: "";
    position: absolute;
    width: 40px;
    height: 3px;
    border-radius: 10px;
    background-color: #D6D4CF;
    margin-top: -13px;
    margin-left: 5px;
}

.cars-block_item {
    display: flex;
    width: 279.061px;
    margin: 5px 5px;
    height: 91.014px;
    border-radius: 10px;
    background: var(--secondary-color);
    box-shadow: 0px 3px 0px 0px #68db00;
}

.cars-block_image {
    background-image: url(../images/profile/cars.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 70px;
    height: 70px;
    margin-top: 10px;
    margin-left: 10px;
}

.cars-block_number {
    position: absolute;
    margin-top: 28px;
    font-size: 16px;
    font-weight: 500;
    margin-left: 84px;
    text-wrap: nowrap;
    color: var(--text-color);
}

.cars-block_price {
    position: absolute;
    font-size: 16px;
    font-weight: 400;
    margin-top: 49px;
    margin-left: 84px;
    color: var(--text-color);
}

nav ul li ul {
    position: absolute;
    display: none;
    width: 195px;
    flex-direction: column;
    align-items: center;
}

nav ul li ul li {
    display: flex;
    margin-top: 5px;
    width: 100%;
    height: 40px;
    background: linear-gradient(301deg, #408502 0%, #68db00 100%);
    box-shadow: 0px 0px 10px 5px rgb(61 249 0 / 26%);
    border-radius: 5px;
    justify-content: center;
    align-items: center;
    transition: all .3s ease;
}

nav ul li ul li a {
    color: var(--text-color);
}

nav ul li ul li:hover {
    transform: scale(1.02);
}

nav ul li:hover > ul {
    display: flex;
}

.menu-profile {
    background-image: var(--profile-menu);
    position: absolute;
    margin-top: -26px;
    width: 10px;
    height: 6px;
    margin-left: 82px;
    background-size: cover;
    background-repeat: no-repeat;
}

.nav-list__btn-profile:hover .menu-profile {
    display: none;
}

.login-error {
    position: absolute;
    background-color: #ff5c39;
    display: flex;
    color: #fff;
    font-size: 20px;
    font-weight: 500;
    width: 30px;
    height: 30px;
    margin-top: 125px;
    margin-left: 270px;
    border-radius: 5px;
    justify-content: center;
    align-items: center;
}

.login-proccess {
    position: absolute;
    background-color: #ffae39;
    display: flex;
    color: #ffffff;
    font-size: 20px;
    font-weight: 500;
    width: 30px;
    height: 30px;
    margin-top: 125px;
    margin-left: 270px;
    border-radius: 5px;
    justify-content: center;
    align-items: baseline;
}

.login-success {
    position: absolute;
    background-color: #45b346;
    display: flex;
    color: #ffffff;
    font-size: 20px;
    font-weight: 500;
    width: 30px;
    height: 30px;
    margin-top: 125px;
    margin-left: 270px;
    border-radius: 5px;
    justify-content: center;
    align-items: baseline;
}

.app {
    position: relative;
    max-width: 960px;
    height: 130px;
    border-radius: 20px 40px;
    background: linear-gradient(353deg, #408502 0%, #68db00 100%);
    margin-top: 100px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 31rem;
    }
  .app .pointer {
    position: absolute;
    z-index: 1;
    margin-top: -20px;
    left: 50%;
    transform: translate3d(-50%, -25px, 0);
    height: 220px;
    filter: drop-shadow(0 0 20px rgba(230, 174, 174, 0.3));
    }
  .app .scope {
    overflow: hidden;
  }
  .app .scope .list {
    position: relative;
    display: inline-flex;
    left: 0;
    transform: translate3d(0, 0, 0);
    list-style: none;
    transition: 5s cubic-bezier(0.21, 0.53, 0.29, 0.99);
    }
    .app .scope .list__item {
        flex-shrink: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 133px;
        height: 130px;
        opacity: 0.5;
        transition: 0.3s ease;
    }
  .app .scope .list__item.active {
    opacity: 1;
  }
  .app .scope .list__item.active img {
    transform: scale(1.05);
    border: none;
  }
  .app .scope .list__item img {
    height: 70%;
    border: 8px solid white;
    border-radius: 50%;
    -o-object-fit: contain;
       object-fit: contain;
    transition: 0.3s ease;
  }
  .app .start {
    position: absolute;
    top: 130%;
    left: 50%;
    transform: translate3d(-50%, 20px, 0);
    padding: 8px 25px;
    border-radius: 5px;
    background: linear-gradient(15deg, #408502 0%, #68db00 100%);
    box-shadow: 0px 0px 10px 5px rgb(61 249 0 / 26%);
    font-weight: 500;
    color: #fff;
    transition: opacity 0.2s ease;
    cursor: pointer;
  }
  .app .start:hover {
    opacity: 0.8;
  }

li.item {
    margin-top: 35px;
    width: 10%;
}

.roulette_prizes {
    position: absolute;
    display: flex;
    column-gap: 15px;
    margin-top: 11rem;
    left: 0;
    flex-wrap: wrap;
    justify-content: center;
}

.prize_item {
    background: var(--secondary-color);
    width: 224px;
    height: 136px;
    margin-bottom: 15px;
    border-radius: 10px;
    box-shadow: 0px 2px 0px 0px #68db00;
    display: flex;
    justify-content: center;
}

img.img_item {
    height: 50%;
    margin-top: 25px;
}

.prize_name {
    position: absolute;
    margin-top: 100px;
    font-weight: 500;
    color: var(--text-color);
    text-wrap: nowrap;
}

.prizes-block {
    position: absolute;
    left: 0;
    top: -30px;
    font-size: 16px;
    margin-left: 30px;
    color: #68db00;
}

.prizes-block::after {
    content: "";
    position: absolute;
    width: 30px;
    background: #dadada;
    margin-left: -279px;
    margin-top: 10px;
    width: 20px;
    height: 2px;
    border-radius: 10px;
}

.settings-block {
    font-weight: 700;
    font-size: 30px;
    color: #68db00;
    margin-top: 20px;
    text-transform: uppercase;
}

.card-profile_settings {
    display: flex;
    margin-top: 127px;
    background: var(--secondary-color);
    width: 430px;
    height: 438px;
    border-radius: 10px;
    box-shadow: 0px 3px 0px 0px #68db00;
    transition: all .10s ease;
    flex-direction: column;
    align-items: center;
}

.settings_case {
    display: flex;
    width: 329px;
    height: 51px;
    border-radius: 5px;
    background-color: #defae1;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

.settings_form {
    display: flex;
    flex-direction: column;
    margin-top: 29px;
}

.settings-text {
    color: #68db00;
    font-size: 15px;
    font-weight: 500;
}

.settings_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 150px;
    height: 40px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px;
    color: #fff;
    background: linear-gradient(336deg, #408502 0%, #68db00 100%);
    box-shadow: 0px 0px 10px 5px rgb(61 249 0 / 26%);
    transition: transform .2s ease;
}

.settings_btn:hover,
.news_del-btn:hover {
    transform: scale(1.03);
}

.settings_qr {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.settings_qr img {
    width: 200px;
    padding-bottom: 20px;
    margin-top: 20px;
    display: flex;
}

.settings_qr p {
    text-align: center;
    color: #68db00;
    font-size: 16px;
    font-weight: 600;
    margin-top: 20px;
}

.card-admin {
    display: flex;
    justify-content: center;
    margin-left: 20px;
    margin-top: 99px;
    background: var(--secondary-color);
    width: 400px;
    height: 377px;
    border-radius: 10px;
    box-shadow: 0px 3px 0px 0px #68db00;
    transition: all .10s ease;
}

.admin-form {
    margin-top: 40px;
}

.admin-text {
    color: #68db00;
    font-size: 15px;
    font-weight: 500;
    transition: all .2s ease;
}

.admin_case {
    display: flex;
    width: 329px;
    height: 40px;
    border-radius: 5px;
    background-color: #defae1;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
}

.ucp__info {
    display: flex;
    align-items: center;
    text-align: left;
    margin: 15px 10px 15px 10px;
    border-radius: 13px;
    padding: 20px;
    box-shadow: 0px 0px 2px 0px var(--primary-color);
    height: 80px;
}

.circle {
    border-radius: 15px;
    height: 70px;
}

.news-list_admin {
    display: flex;
    margin-top: 50px;
    background: var(--secondary-color);
    width: 100%;
    height: auto;
    border-radius: 10px;
    box-shadow: 0px 3px 0px 0px #68db00;
    flex-direction: column;
    margin-bottom: 5px;
}

.news_name {
    display: flex;
    align-items: center;
    flex-direction: column;
    margin-left: auto;
    margin-right: auto;
    color: var(--text-color);
}

.news_del-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 150px;
    height: 40px;
    border-radius: 10px;
    background: linear-gradient(336deg, #408502 0%, #68db00 100%);
    box-shadow: 0px 0px 10px 5px rgb(61 249 0 / 26%);
    transition: transform .2s ease;
}

.admin-block {
    position: absolute;
    margin-top: 10px;
    font-weight: 500;
    color: #68db00;
    opacity: 0.8;
    text-transform: uppercase;
}

a.text_del-btn {
    color: var(--text-color);
}

.news_none-admin {
    height: 100px;
    display: flex;
    position: relative;
    justify-content: center;
    top: 80px;
    font-size: 20px;
    color: #68db00;
    font-weight: 500;
    padding-bottom: 12.5rem;
}


.left-block_donate {
    display: flex;
    flex-direction: column;
    width: 50%;
}

.donate-title {
    width: 285.628px;
    font-weight: 700;
    font-size: 30px;
    text-transform: uppercase;
    background: linear-gradient(290deg, #408502 0%, #68db00 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-top: 92px;
}

.donate-sub {
    color: #AFAFAF;
    margin-top: 24px;
    width: 321px;
    font-size: 18px;
    font-weight: 500;
}

.donate-button {
    display: flex;
    margin-top: 24px;
    width: 281.643px;
    height: 65.097px;
    border-radius: 5px;
    background: linear-gradient(11deg, #408502 0%, #68db00 100%);
    box-shadow: 0px 0px 10px 5px rgb(61 249 0 / 26%);
    justify-content: center;
    align-items: center;
    transition: transform .2s ease;
    color: #FFF;
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
}

.donate-button:hover {
    transform: scale(1.01);
}

.right-block_donate {
    display: flex;
    position: absolute;
    flex-direction: column;
    top: 0;
    margin-top: 158px;
    margin-left: 601px;
}

.block-donate_list {
    width: 404px;
    height: 91px;
    border-radius: 5px;
    background: var(--secondary-color);
    box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.08);
}

.donate-list_text {
    font-size: 18px;
    color: var(--text-color);
    font-weight: 600;
    margin-top: 10px;
    margin-left: 200px;
}

.donate-list_sub {
    width: 226px;
    color: #AFAFAF;
    font-size: 16px;
    margin-top: 3px;
    margin-left: 130px;
    text-align: center;
}

.block-donate_info {
    width: 404px;
    height: 141px;
    border-radius: 5px;
    background: var(--secondary-color);
    box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.08);
    margin-top: 34px;
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
}

.donate-list-btn {
    position: absolute;
    top: 0;
    width: 65px;
    margin-top: 13px;
    display: flex;
    margin-left: 20px;
    height: 65px;
    border-radius: 50px;
    background: #ff5c39;
    box-shadow: 0px 0px 10px 2px #ff5c3980;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    font-weight: 600;
    color: #fff;
    cursor: default;
}

.donate-info_one {
    margin-left: 20px;
    margin-top: 41px;
    display: flex;
    align-items: center;
    flex-direction: column;
}

.one-info_text {
    width: 60px;
    display: flex;
    height: 60px;
    border-radius: 50px;
    background: linear-gradient(211deg, #408502 0%, #68db00 100%);
    box-shadow: 0px 0px 10px 5px rgb(61 249 0 / 26%);
    justify-content: center;
    font-weight: 500;
    align-items: center;
    font-size: 18px;
    color: #fff;
    cursor: default;
}

.one-info_sub {
    color: #AFAFAF;
    font-size: 14px;
    font-weight: 500;
    margin-top: 5px;
}

.donate-info_two {
    margin-left: 42px;
    display: flex;
    margin-top: 41px;
    flex-direction: column;
    align-items: center;
}

.two-info_text {
    width: 60px;
    display: flex;
    height: 60px;
    border-radius: 50px;
    background: linear-gradient(211deg, #408502 0%, #68db00 100%);
    box-shadow: 0px 0px 10px 5px rgb(61 249 0 / 26%);
    justify-content: center;
    font-weight: 500;
    align-items: center;
    font-size: 18px;
}

.two-info_sub {
    color: #AFAFAF;
    font-size: 14px;
    font-weight: 500;
    margin-top: 5px;
}

.donate-info_three {
    margin-left: 67px;
    display: flex;
    align-items: center;
    flex-direction: column;
    margin-top: 41px;
}

.three-info_text {
    width: 60px;
    display: flex;
    height: 60px;
    border-radius: 50px;
    background: linear-gradient(211deg, #408502 0%, #68db00 100%);
    box-shadow: 0px 0px 10px 5px rgb(61 249 0 / 26%);
    justify-content: center;
    font-weight: 500;
    align-items: center;
    font-size: 18px;
}

.three-info_sub {
    color: #AFAFAF;
    font-size: 14px;
    font-weight: 500;
    margin-top: 5px;
}

.card-donate_row {
    display: flex;
    flex-direction: row;
    margin-top: 44px;
}

.card-donate {
    width: 225px;
    height: 328px;
    display: flex;
    border-radius: 10px;
    border: 2px solid #DADADA;
    background: rgba(255, 255, 255, 0.00);
    flex-direction: column;
    align-items: center;
    margin: 5.2px 11px;
    transition: all .2s ease;
}

.card-donate:hover {
    transform: scale(1.03);
    border: 2px solid #68db00;
}

.card-img {
    width: 80px;
    height: 80px;
    margin-top: 25px;
    background: var(--donate-image);
}

.card-donate:hover .card-img {
    background: url(../images/donate/card-icon-hover.svg);
}

.card-text {
    font-size: 24px;
    text-align: center;
    font-weight: 500;
    width: 133px;
    margin-top: 25px;
    cursor: default;
    color: var(--text-color);
}

.card-text span {
    font-weight: 700;
}

.card-sub {
    margin-top: 25px;
    text-align: center;
    font-size: 24px;
    font-weight: 700;
    cursor: default;
    color: var(--text-color);
}

a.card-btn {
    margin-top: 46px;
    font-weight: 700;
    font-size: 18px;
    color: var(--text-color);
    transition: all .2s ease;
}

a.card-btn:hover {
    transform: scale(1.01);
}

.card-donate:hover .card-btn {
    background: linear-gradient(355deg, #408502 0%, #68db00 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.modal {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 99998;
    background-color: rgba(30,29,29,.24);
    backdrop-filter: blur(8px);
    display: grid;
    align-items: center;
    justify-content: center;
    visibility: hidden;
    opacity: 0;
}

.modal__box {
    width: 400px;
    height: 500px;
    background-color: var(--secondary-color);
    border-radius: 10px;
    z-index: 1;
    transform: scale(0);
}

.modal.open {
    visibility: visible;
    opacity: 1;
}

.modal.open .modal__box {
    transform: scale(1);
    display: flex;
    justify-content: center;
}

button#close-my-modal-btn {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    position: absolute;
    top: 2rem;
    right: 2rem;
    background-color: #f8f8f8;
    display: flex;
    justify-content: center;
    align-items: center;
}

.modal-donate_logo {
    background-image: url(../images/logo.svg);
    position: absolute;
    width: 130px;
    height: 155px;
    background-size: cover;
    background-repeat: no-repeat;
    margin-top: 20px;
    display: flex;
}

.donate-form {
    display: flex;
    flex-direction: column;
    margin-top: 200px;
}

.modal-donate_case {
    display: flex;
    width: 329px;
    height: 51px;
    border-radius: 5px;
    background-color: #defae1;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

button.modal-donate-btn {
    display: flex;
    margin-top: 50px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px;
    background: linear-gradient(289deg, #408502 0%, #68db00 100%);
    box-shadow: 0px 0px 10px 5px rgb(61 249 0 / 26%);
    transition: transform .2s ease;
}

a.donate-modal-text {
    color: var(--text-color);
    margin: 15px;
}

button.modal-donate-btn:hover {
    transform: scale(1.03);
}

.ctn-preloader {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: default;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 9000;
}

.ctn-preloader .animation-preloader {
    z-index: 1000;
}

.ctn-preloader .animation-preloader .spinner {
    -webkit-animation: spinner 1s infinite linear;
    animation: spinner 1s infinite linear;
    border-radius: 50%;
    border: 3px solid rgba(0, 0, 0, 0.2);
    border-top-color: #000000;
    height: 9em;
    margin: 0 auto 3.5em auto;
    width: 9em;
}

.ctn-preloader .animation-preloader .txt-loading {
    font: bold 5em "Montserrat", sans-serif;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading {
    color: rgba(0, 0, 0, 0.2);
    position: relative;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:before {
    -webkit-animation: letters-loading 4s infinite;
    animation: letters-loading 4s infinite;
    color: #000000;
    content: attr(data-text-preloader);
    left: 0;
    opacity: 0;
    font-family: "Montserrat", sans-serif;
    position: absolute;
    top: -3px;
    -webkit-transform: rotateY(-90deg);
    transform: rotateY(-90deg);
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(2):before {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(3):before {
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(4):before {
    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(5):before {
    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(6):before {
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(7):before {
    -webkit-animation-delay: 1.2s;
    animation-delay: 1.2s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(8):before {
    -webkit-animation-delay: 1.4s;
    animation-delay: 1.4s;
}

.ctn-preloader.dark .animation-preloader .spinner {
    border-color: rgba(255, 255, 255, 0.2);
    border-top-color: #fff;
}

.ctn-preloader.dark .animation-preloader .txt-loading .letters-loading {
    color: rgba(255, 255, 255, 0.2);
}

.ctn-preloader.dark .animation-preloader .txt-loading .letters-loading:before {
    color: #fff;
}

.ctn-preloader p {
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 8px;
    text-align: center;
    color: #3b3b3b;
}

.ctn-preloader .loaders {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    font-size: 0;
    z-index: 1;
    pointer-events: none;
}

.ctn-preloader .loaders .row {
    height: 100%;
}

.ctn-preloader .loaders .loader-section {
    padding: 0px;
}

.ctn-preloader .loaders .loader-section .bg {
    position: absolute;
    background-color: #fff;
    height: 100%;
    left: 0;
    width: 100%;
    -webkit-transition: all 800ms cubic-bezier(0.77, 0, 0.175, 1);
    transition: all 800ms cubic-bezier(0.77, 0, 0.175, 1);
}

.ctn-preloader.loaded .animation-preloader {
    opacity: 0;
    -webkit-transition: 0.3s ease-out;
    transition: 0.3s ease-out;
}

.ctn-preloader.loaded .loader-section .bg {
    width: 0;
    -webkit-transition: 0.7s 0.3s all cubic-bezier(0.1, 0.1, 0.1, 1);
    transition: 0.7s 0.3s all cubic-bezier(0.1, 0.1, 0.1, 1);
}

@-webkit-keyframes spinner {
    to {
        -webkit-transform: rotateZ(360deg);
        transform: rotateZ(360deg);
    }
}

@keyframes spinner {
    to {
        -webkit-transform: rotateZ(360deg);
        transform: rotateZ(360deg);
    }
}

@-webkit-keyframes letters-loading {

    0%,
    75%,
    100% {
        opacity: 0;
        -webkit-transform: rotateY(-90deg);
        transform: rotateY(-90deg);
    }

    25%,
    50% {
        opacity: 1;
        -webkit-transform: rotateY(0deg);
        transform: rotateY(0deg);
    }
}

@keyframes letters-loading {

    0%,
    75%,
    100% {
        opacity: 0;
        -webkit-transform: rotateY(-90deg);
        transform: rotateY(-90deg);
    }

    25%,
    50% {
        opacity: 1;
        -webkit-transform: rotateY(0deg);
        transform: rotateY(0deg);
    }
}

@media screen and (max-width: 767px) {
    .ctn-preloader .animation-preloader .spinner {
        height: 8em;
        width: 8em;
    }

    .ctn-preloader .animation-preloader .txt-loading {
        font: bold 3.5em "Montserrat", sans-serif;
    }
}

@media screen and (max-width: 500px) {
    .ctn-preloader .animation-preloader .spinner {
        height: 7em;
        width: 7em;
    }

    .ctn-preloader .animation-preloader .txt-loading {
        font: bold 2em "Montserrat", sans-serif;
    }
}

@media only screen and (max-width: 1865px) {
.header-block_help,
.play-block_help,
.social-block_help,
.settings-block_help,
.admin-block_help,
.news-block_help,
.servers_list::after {
    display: none;
}
}

/* Large Devices, Wide Screens */
@media only screen and (max-width: 1200px) {
.info-title:nth-child(1)::after {
    display: none;
}

.nav-list {
    margin-left: 15px;
}

.right-block_donate {
    margin-left: 546px;
}

.card-profile_player {
    width: 276px;
}

.player-icon {
    margin-left: -30px;
}

.player-name,
.player-status {
    width: 226px;
}
}

@media only screen and (max-width: 925px) {
.settings {
    flex-direction: column;
    width: 100%;
    align-items: center;
}
}

/* Medium Devices, Desktops */
@media only screen and (max-width: 992px) {
img.logo {
    display: none;
}

.header-container {
    justify-content: center;
}

.btn-info {
    margin-left: auto;
    margin-right: auto;
}

.play-block_left,
.play-block_right::before,
.play-block_right::after,
.start-game_left,
a.start-game_video {
    display: none;
}

.info-title:nth-child(1) {
    max-width: 498px;
}

.info-title:nth-child(2) {
    max-width: 446px;
}

.info-title:nth-child(3) {
    max-width: 472px;
}

.right-info {
    display: none;
}

.start-game_row {
    width: 100%;
}

.start-game_block {
    justify-content: center;
}

.play-block_right {
    align-items: center;
    text-align: center;
}

a.download_page {
    position: relative;
    margin-left: 0px;
    margin-top: 25px;
}

.play-block_text {
    margin-left: 0px;
    max-width: 90%;
}

.social-block_item img {
    height: 100%;
}

.play-block_item {
    justify-content: center;
    width: 100%;
}

.footer-list__link:nth-child(3) {
    display: none;
}

.nav-list {
    column-gap: 37px;
}

.news_item-row {
    flex-direction: column;
    margin-top: 5rem;
    max-width: 100%;
}

.news_item {
    margin-top: 10px;
}

.right-block_donate {
    display: none;
}

.card-donate_row {
    flex-direction: column;
    align-items: center;
}

.card-donate {
    width: 100%;
    margin: 0 0px 1rem;
}

.app .scope .list__item {
    width: 112px;
}

.prize_item {
    width: 108px;
}

.profile, .admin {
    flex-direction: column;
    align-items: center;
}

.card-profile_info,
.card-profile_donate {
    margin-left: 15px;
    position: relative;
}

.card-profile_level,
.card-profile_game,
.card-profile_money,
.card-profile_bank,
.card-profile_info,
.card-profile_donate {
    margin-top: 25px;
}

.player-icon {
    margin-left: 0px;
}

.player-name,
.player-status {
    width: 277px;
}

.card-profile_settings {
    margin-bottom: 5px;
}
}

@media only screen and (max-width: 855px) {
.servers_list-row {
    flex-direction: column;
    align-items: center; 
}

.servers-item {
    margin-bottom: 10px;
}
}

/* Small Devices, Tablets */
@media only screen and (max-width: 768px) {
.coming-elements_container {
    flex-direction: column;
    align-items: center;
}

nav ul li ul {
    margin-top: -15px; 
}

.cars-block {
    margin-top: 40px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}

img.logo {
    display: block;
	width: 50px;
    margin-left: 0px;
}

.burger-menu_btn {
    display: block;
    z-index: 3;
    position: relative;
}

.nav-list {
    position: absolute;
    display: block;
    left: -1000px;
    top: 0;
    width: 100%;
    margin-left: 0px;
    background-color: var(--secondary-color);
    padding: 100px 20px 20px 20px;
    transition: transform .5s;
    z-index: 2;
}

.nav-list__link {
    color: var(--text-color);
    font-size: 24px;
    display: block;
    padding: 10px 20px;
}

.nav-list__link-profile {
    padding: 15px 25px;
}

nav.nav {
    width: 100%;
    background-color: var(--secondary-color);
    padding: 10px;
}

.nav-list__link--active::after {
    display: none;
}

.nav.open .nav-list {
    transform: translateX(1000px);
}

.info-title {
    max-width: 459px;
}

.info-sub {
    max-width: 459px;
}

.news-print {
    margin-top: 7rem;
}

.footer-list__item:nth-child(3) {
    display: none;
}

}

@media only screen and (max-width: 630px) {
.footer-list__item:nth-child(1) {
    display: none;
}
}

/* Extra Small Devices, Phones */
@media only screen and (max-width: 480px) {

.modal-donate_case {
    width: 100%;
}

.social-text,
.social-sub {
    margin-left: 0px;
    text-align: center;
    max-width: 90%;
}

.start-game_right {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.app {
    margin-bottom: 38.6rem;
}

.start-game_text:nth-child(1) {
    margin-top: 25px;
    max-width: 90%;
    width: auto;
    margin-left: 0px;
}

.start-game_text:nth-child(2) {
    max-width: 90%;
    width: auto;
    margin-left: 0px;
}

.start-game_text:nth-child(3) {
    max-width: 90%;
    width: auto;
    margin-left: 0px;
}

a.vkontakte-btn,
a.discord-btn {
    left: auto;
    margin-left: auto;
}

.info-title:nth-child(2) {
    margin-top: 120px;
}

.social-block_item img {
    opacity: 0;
}

.social-block_item:nth-child(2) .social-text,
.social-block_item:nth-child(2) .social-sub {
    margin-left: 0px;
}

.discord-text img,
.vkontakte-text img {
    display: none;
}

.social-block_item {
    display: flex;
    justify-content: center;
}

.footer-list {
    column-gap: 6px;
    margin-left: 11px;
}

.nav.open .nav-list {
    transform: translateX(1000px);
}

.nav-list {
    width: 106.5%;
}

.news__desc {
    max-width: 90%;
}

.card-donate {
    width: 90%;
}

.modal__box {
    width: 300px;
}

.prizes-block {
    margin-left: 80px;
}

.footer-list__item:nth-child(1),
.footer-list__item:nth-child(3) {
    display: none;
}

.card-profile_info-information {
    width: 228px;
}

.card-profile_settings {
    width: 100%;
}

.settings-block {
    text-align: center;
}

.settings_case {
    width: 235px;
}

.card-admin {
    width: 100%;
    margin-left: 0px;
}

.admin_case {
    width: 226px;
}

.news-list_admin {
    width: 100%;
}

.news_name {
    display: none;
}

.ucp__info { 
    column-gap: 20px;
}

.card-profile_info {
    width: 258px;
}
}

@media only screen and (width: 414px) {

.app .scope .list__item {
    width: 128px;
    height: 128px;
}

}

@media only screen and (width: 390px) {

.app .scope .list__item {
    width: 120px;
    height: 120px;
}
}