@font-face {
    font-family: 'manrope-ttf';
    src: url(../fonts/ttf/DAMN.ttf);
}
@font-face {
    font-family: 'tennis-ttf';
    src: url(../fonts/ttf/Manrope-Light.ttf);
}
@font-face {
    font-family: 'manrope-woff2';
    src: url(../fonts/woff2/DAMN.woff2);
}
@font-face {
    font-family: 'tennis-woff2';
    src: url(../fonts/woff2/Manrope-Light.woff2);
}

* {box-sizing: border-box;}

html {scroll-behavior: smooth;}

:root {
    --colorWhite: #fff;
    --colorBlack: #000;
    --colorGreen: #d9f029;
    --bigText: 'tennis-woff2', 'tennis-ttf', sans-serif;
    --smallText: 'manrope-woff2', 'manrope-ttf', sans-serif;
}

body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

.anchor {
    position: relative;
    top: -50px;
}

.fixed {overflow: hidden;}

a {text-decoration: none;}

main {background-color: #0b0b0b;}

section {padding: 0 3%; background-color: #0b0b0b;}

::-webkit-scrollbar {
    width: 2.5px;
    background-color: #0b0b0b;
}
::-webkit-scrollbar-thumb {
    background-color: var(--colorGreen);
    border-radius: 20px;
}

.dark-block {display: none;}

.dark {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 99;
    opacity: .5;
    background-color: var(--colorBlack);
}

.scroll-button {
    width: 60px;
    height: 60px;
    position: fixed;
    inset: 90% 0 0 2%;
    border-radius: 100%;
    z-index: 999;
    cursor: pointer;
    transition: all .3s ease-in-out;
    opacity: 0;
    visibility: hidden;
    background-image: url(../img/img21.png);
    background-size: cover;
}

.burger-button {
    width: 60px;
    height: 60px;
    position: fixed;
    inset: 2% 20px 0 94%;
    border-radius: 1000px;
    z-index: 999;
    cursor: pointer;
    transition: all .3s ease-in-out;
    opacity: 0;
    visibility: hidden;
    background-color: var(--colorBlack);
    display: flex;
    justify-content: center;
    align-items: center;
}

.burger-button > div > div:nth-child(2) {width: 17px;}

.burger-button > div {
    width: 40%;
    height: calc((2px * 3) + (13% * 2));
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-direction: column;
}

.burger-button:hover .burger-button-line:nth-child(2) {width: 100%;}

.burger-menu {
    width: 300px;
    height: 100vh;
    background-color: #0b0b0b;
    position: fixed;
    left: -300px;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 40px 30px;
    gap: 15px;
    transition: all .3s ease-in-out;
    opacity: 1;
}

.cross {
    width: 30px;
    height: 30px;
    cursor: pointer;
}

.menu-active {left: 0;}

.burger-menu__child:nth-child(1) {transform: rotate(-45deg);}

.burger-menu__child:nth-child(2) {transform: rotate(45deg);}

.burger-menu > a {
    color: var(--colorWhite);
    font-family: var(--bigText);
    font-size: 20px;
    transition: all .2s ease-in-out;
}

.burger-menu > a:hover {color: var(--colorGreen);}

.burger-button-line {
    width: 100%;
    height: 2px;
    background-color: var(--colorGreen);
    border-radius: 50px;
    transition: all .2s ease-in-out;
}

.active {
    visibility: visible;
    opacity: 1;
}

.active-burger {
    visibility: visible;
    opacity: 1;
}

.photo {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    object-fit: cover;
}

.svg2 {display: none;}

.svg {
    position: absolute;
    inset: 0;
    width: 100%;
    z-index: 0;
}

.banner {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    gap: 5.9vw;
    padding: 2.3vw 2.8vw;
    position: relative;
}

.banner__video-list-container {
    display: flex;
    justify-content: space-between;
    position: relative;
    z-index: 2;
}

.banner__list-container {
    display: flex;
    flex-direction: column;
    gap: .3vw;
    padding: 2vw;
}

.banner__list-container > a {
    font-size: 1.2vw;
    color: var(--colorWhite);
    font-family: var(--bigText);
    transition: all .3s ease-in-out;
}

.banner__list-container > a:not(.banner__list-container > a:first-child):hover {color: #cdcdcd;}

.banner__list-container > a:first-child {
    font-size: 1.5vw;
    color: var(--colorGreen);
}

.banner__video {
    object-fit: cover;
    border-radius: 1vw;
    width: 23vw;
    height: 22vw;
}

.banner__text-registration-container {
    display: flex;
    align-items: flex-end;
    width: 100%;
    position: relative;
    z-index: 2;
}

.banner__text-registration-container > div {
    display: flex;
    width: 75%;
    justify-content: center;
}

.banner__registration {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--colorGreen);
    color: var(--colorBlack);
    font-family: var(--bigText);
    font-size: 1vw;
    width: 13vw;
    height: 3.5vw;
    border-radius: 3vw;
    transition: all .2s ease-in-out;
}

.banner__registration:hover {background-color: var(--colorWhite);}

.banner__text-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1vw;
}

.banner__text-container > span:nth-child(1), .banner__text-container > span:nth-child(3) {
    font-family: var(--bigText);
    font-size: 1.7vw;
    color: var(--colorWhite);
    opacity: .7;
}

.banner__text-container > span:nth-child(2) {
    font-family: var(--smallText);
    color: var(--colorWhite);
    font-size: 4vw;
    text-transform: uppercase;
}

.banner__text-container > span:nth-child(2) > span {color: var(--colorGreen);}
 
.nice {
    width: 100%;
    position: relative;
    z-index: 3;
}

.nice__big-text-container {
    display: flex;
    align-items: center;
    flex-direction: column;
    margin: auto;
}

.nice__big-text {margin-top: 0;}

.nice__blocks-container {
    display: flex;
    flex-direction: column;
    gap: 2vw;
    margin: 5% 0 10%;
}

.nice__blocks-container > div {
    display: flex;
    justify-content: space-between;
    height: 32vw;
}

.nice__block {
    width: calc(33% - 1%);
    border-radius: 2vw;
    padding: 0 60px;
}

.nice__block-white1 {
    position: relative;
    inset: 0;
    background-color: var(--colorWhite);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    
}

.nice__block-white1::before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 0;
    background-image: url(https://static.tildacdn.com/tild3161-3265-4431-b438-663231613262/Subtract.svg);
    background-size: 180%;
    opacity: 0.1;
    border-radius: 2vw;
}

.nice__block > span:nth-child(1) {
    font-family: var(--bigText);
    font-size: 1.5vw;
    text-align: center;
    font-weight: 700;
    z-index: 4;
    margin: 0 0 20px 0;
}

.nice__block > span:nth-child(2) {
    font-family: var(--bigText);
    font-size: 1.1vw;
    opacity: 0.7;
    text-align: center;
    font-weight: 500;
    z-index: 4;
}

.nice__block1:nth-child(2) {
    background-color: var(--colorGreen);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.nice__many-blocks {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: solid 2px var(--colorGreen);
    padding: 1.5vw;
}

.nice__many-blocks > div {
    display: flex;
    justify-content: space-between;
    height: calc(33% - 2%);
}

.nice__many-blocks-block {
    width: calc(33% - 2%);
    height: 100%;
    border-radius: 1vw;
    background-position: center;
    background-size: cover;
}

.nice__many-blocks-block1:nth-child(2) {background-color: var(--colorGreen);}

.nice__many-blocks-block1:nth-child(3) {background-image: url(../img/img3.jpg);}

.nice__many-blocks-block2:nth-child(1) {background-image: url(../img/img4.jpg);}

.nice__many-blocks-block2:nth-child(3) {background-image: url(../img/img5.jpg);}

.nice__many-blocks-block3:nth-child(1) {border: solid 2px #fff;}

.nice__many-blocks-block3:nth-child(2) {background-image: url(../img/img6.jpg);}

.nice__video {
    object-fit: cover;
    width: 100%;
    height: 100%;
    border-radius: 1vw;
}

.nice__big-text-container2 {
    width: 40vw;
    align-items: flex-start;
}

.nice__big-text2 {margin: 0;}

.nice__small-text {
    font-size: 1.5vw;
    font-family: var(--bigText);
    color: #cdcdcd;
    margin: 0;
}

/* 02.12.24 */

.nice3 {
    position: relative;
    inset: 0;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.nice2 {padding: 0 3%;}

.nice3__container {
    display: flex;
}

.nice__container-wrap {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    height: 47vw;
}

.nice__container-block1 {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    width: 33%;
}

.nice__container-block2 {
    display: flex;
    justify-content: center;
    width: 66%;
}

.nice__container-wrap-child1 {
    width: 100%;
    height: calc(66% - 10px);
    background-image: url(../img/img7.jpg);
    background-position: center;
    background-size: 100%;
    border-radius: 2vw;
}

.nice__container-wrap-child-video {background-image: none;}

.nice__container-wrap-child2 {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: calc(33% - 2%);
}

.nice__container-wrap-child2 > div {
    width: calc(50% - 3%);
    background-size: 100%;
    border-radius: 2vw;
}

.nice__container-wrap-child-child11 {background-image: url(../img/img8.jpg);}

.nice__container-wrap-child-child12 {background-image: url(../img/img9.jpg);}

.nice__container-wrap-child-child21 {background-image: url(../img/img10.jpg);}

.nice__container-wrap-child-child22 {background-image: url(../img/img11.jpg);}

.nice__container-wrap2 {
    width: 50%;
    margin-top: 25%;
}

.nice__video3 {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 2vw;
    background-image: none;
}

.nice3__container-correct {
    display: flex;
    justify-content: space-between;
    height: 30vw;
    align-items: flex-end;
}

.nice__container-block11 {width: calc(50% - 10%);}

.nice__container-block11 > div:nth-child(1) {
    width: 100%;
    height: 100%;
    background-image: url(../img/img12.jpg);
    background-position: center;
    background-size: 100%;
    border-radius: 2vw;
    position: relative;
    inset: 0;
    z-index: 5;
}

.nice__container-block22 {
    width: calc(50% - 5%);
    display: flex;
    justify-content: flex-end;
}

.nice__container-block22 > div {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    width: 69.2%;
    height: 100%;
}

.nice__container-wrap-child2-correct {height: 50%;}

.nice__container-wrap-child111 {
    width: calc(50% - 10%);
    background-size: 100%;
    border-radius: 2vw;
    background-image: url(../img/img13.jpg);
}

.nice__container-wrap-child222 {
    width: calc(50% - 10%);
    background-position: center;
    background-size: 100%;
    border-radius: 2vw;
    background-image: url(../img/img14.jpg);
}

.span {margin: 10vw 0;}

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

.span__block {
    height: 7vw;
    position: relative;
}

.span__block1 {margin-top: 30px;}

.span__block > span {
    font-size: 9vw;
    font-family: var(--smallText);
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.1);
    white-space: nowrap;
    
}

.span__block > span > span {
    font-size: 9vw;
    font-family: var(--smallText);
    text-transform: uppercase;
    color: var(--colorGreen);
}

.about-school__text-container {
    display: flex;
    gap: 1%;
        margin: 5vw 0 3vw;
}

.input-container {margin: 5vw 0 ;}

.about-school__wrap1 {width: 33%;}

.about-school__wrap2 {width: 45vw;}

.about-school__wrap2 > span > span{
    font-size: 4vw;
    font-family: var(--smallText);
    color: var(--colorGreen);
    text-transform: uppercase;
}

.about-school__wrap2 > span  {
    font-size: 4vw;
    font-family: var(--smallText);
    color: var(--colorWhite);
    text-transform: uppercase;
}

.about-school__container {
    display: flex;
    justify-content: space-between;
    margin: 7vw 0;
}

.about-school__block {
    width: calc(33% - 1%);
    height: 33vw;
    display: flex;
    border-radius: 2vw;
    background-position: center;
    background-size: cover;
}

.about-school__block1 {
    align-items: flex-start;
    justify-content: flex-end;
}

.about-school__mini-photo {
    width: 50%;
    height: 50%;
    background-image: url(../img/img15.jpg);
    background-position: center;
    background-size: cover;
    border-radius: 2vw;
    filter: grayscale(100%);
}

.about-school__block2 {background-image: url(../img/img16.jpg);}

.about-school__block3 {
    flex-direction: column;
    justify-content: flex-end;
}

.about-school__block3 > span:nth-child(1) {
    font-family: var(--bigText);
    font-size: 1.5vw;
    font-weight: 500;
    color: var(--colorGreen);
}

.about-school__block3 > span:nth-child(2) {
    font-family: var(--bigText);
    font-size: 1.1vw;
    font-weight: 500;
    color: var(--colorWhite);
    opacity: .7;
    margin-top: 1vw;
}

.about-school__span2 {margin-top: 5vw;}

.nice2__wrap2 {width: 45vw;}

.nice2__wrap2 > span {
    font-family: var(--bigText);
    color: #cdcdcd;
    font-size: 1.5vw;
}

.nice2__wrap2 > span > span {
    font-family: var(--bigText);
    color: var(--colorGreen);
    font-size: 1.5vw;
}

.about-school__wrap {
    width: 66%;
    height: 65vw;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: #fff 3px solid;
    border-radius: 2vw;
    padding: 2%;
}

.about-school__blocks-container {
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: calc(33% - 1%);
}

.about-school__mini-blocks {
    width: calc(33% - 1%);
    border: #fff 3px solid;
    border-radius: 2vw;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--colorBlack);
    font-family: var(--bigText);
    font-weight: 600;
    font-size: 1.5vw;
    padding: 2%;
}

.about-school__mini-blocks13, .about-school__mini-blocks31 {border: none;}

.about-school__mini-blocks12, .about-school__mini-blocks21, .about-school__mini-blocks23, .about-school__mini-blocks32 {background-color: var(--colorWhite);}

.about-school__mini-blocks22 {background-color: #d9f029; border: none;}

.about-school__mini-blocks33 {border: var(--colorGreen) 3px solid; color: var(--colorGreen);}

.about-school__mini-blocks11 {color: var(--colorWhite);}

.about-school__wrap-container {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    margin-top: 50px;
}

.about-school__input-container {
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: 4.5vw;
}

.input {
    width: calc(33% - 3%);
    height: 100%;
    background-color: var(--colorWhite);
    border-radius: 1vw;
    color: var(--colorBlack);
    font-size: 1.2vw;
    font-family: var(--bigText);
    font-weight: 600;
    border: none;
    padding: 3%;
}

.input:focus {outline: none;}

.input-button {
    width: calc(33% - 20px);
    height: 100%;
    background-color: var(--colorGreen);
    border-radius: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--colorBlack);
    font-size: 1vw;
    font-family: var(--bigText);
    font-weight: 600;
    transition: all .2s ease-in-out;
}

.input-button:hover {background-color: var(--colorWhite);}

.about-school__registration-container {width: 66%;}

.about-school__registration-container > span {
    color: #cdcdcd;
    font-size: 1vw;
    font-family: var(--bigText);
    text-transform: none;
    display: block;
    margin: 1vw 0;
}

.about-school__registration-container > span > span {
    color: var(--colorGreen);
    font-family: var(--bigText);
    font-size: 1vw;
    text-transform: none;
}

.about-me__container {
    width: 100%;
    height: 60vw;
    border-radius: 2vw;
    background-color: var(--colorGreen);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 2%;
    position: relative;
    inset: 0;
}

.about-me__container-box {
    width: 100%;
    height: calc(50% - 2%);
    display: flex;
    justify-content: space-between;
}

.about-me__information-block {
    width: calc(33% - 2%);
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.about-me__container-block {
    border-radius: 2vw;
    display: flex;
    align-items: center;
    text-align: center;
    font-family: var(--bigText);
    font-size: 1.1vw;
    color: #0b0b0b;
}

.about-me__container-block1 {
    width: 100%;
    height: calc(50% - 15px);
    background-color: var(--colorWhite);
    padding: 0 20%;
}

.about-me__container-block11 {
    width: 100%;
    height: calc(50% - 15px);
    border: solid 2px var(--colorWhite);
    padding: 0 20%;
}

.about-me__container-block2 {
    height: 100%;
    width: calc(50% - 15px);
}

.about-me__container-block3 {
    height: 100%;
    width: calc(50% - 15px);
    background-color: var(--colorWhite);
    padding: 0 10%;
}

.about-me__information-block > div:nth-child(2) {
    width: 100%;
    height: calc(50% - 15px);
    display: flex;
    justify-content: space-between;
}

.about-me__image-block {
    width: calc(33% - 15px);
    height: 100%;
    background-image: url(../img/img17.jpg);
    filter: grayscale(1);
    border-radius: 2vw;
    background-position: 90% 26%;
    background-size: cover;
}

.about-me__container-block22 {
    width: calc(50% - 2%);
    height: calc(50% - 2%);
    border: 2px solid var(--colorBlack);
    border-radius: 2vw;
    padding: 0 7%;
}

.video-block {
    width: calc(50% - 2%);
    height: 100%;
    border-radius: 2vw;
    object-fit: cover;
    position: relative;
    inset: 0;
    z-index: 3;
}

.about-me__big-text {
    font-family: var(--smallText);
    font-size: 4.4vw;
    color: var(--colorBlack);
    text-transform: uppercase;
    margin-top: 10%;
}

.about-me__medium-text {
    font-family: var(--bigText);
    font-size: 1.6vw;
}

.about-me__text-block {
    width: calc(33% - 15px);
    display: flex;
    flex-direction: column;
    position: relative;
    inset: 0;
    z-index: 3;
}

.about-me__small-text {
    font-family: var(--bigText);
    font-size: 1.1vw;
    color: #0b0b0b;
    opacity: .8;
}

.about-me__text-block > div {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    height: 60%;
}

.about-me__container-block111 {
    width: calc(50% - 2%);
    height: calc(50% - 2%);
    background-color: var(--colorWhite);
}

.about-me__image-block3 {
    background-image: url(../img/img18.jpg);
    width: calc(50% - 2%);
}

.comments__big-comment {width: calc(66% - 4.5px);}

.nice__many-blocks-block33 {background-image: url(../img/img19.jpg);}

.nice__many-blocks-block11 {background-image: url(../img/img20.jpg);}

.programms__block > div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    gap: 20px;
    position: relative;
    z-index: 1;
}

.programms__block > div > span {font-family: var(--bigText);}

.programms__block > div > span:nth-child(1) {font-size: 1.7vw;}

.programms__block > div > span:nth-child(2) {
    color: #0b0b0b;
    font-size: 1.1vw;
    opacity: .7;
}

.programms__block > div > a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 12.5vw;
    height: 3.3vw;
    background-color: var(--colorBlack);
    color: var(--colorWhite);
    border-radius: 100px;
    font-family: var(--bigText);
    font-weight: 500;
    font-size: 1vw;
    margin-top: 40px;
    transition: all .3s ease-in-out;
}

.programms__block > div > a:hover {
    background-color: var(--colorWhite);
    color: var(--colorBlack);
}

.programms__block2 {
    background-color: var(--colorWhite);
    display: flex;
    align-items: center;
    justify-content: center;
}

.programms__block2 > div > a {
    background-color: var(--colorGreen);
    color: var(--colorBlack);
    transition: all .3s ease-in-out;
}

.programms__block2 > div > a:hover {
    background-color: var(--colorBlack);
    color: var(--colorWhite);
}

.footer {padding: 3%;}

.footer__container {
    width: 100%;
    background-color: var(--colorGreen);
    border-radius: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px;
    position: relative;
    inset: 0;
}

.LutkovTennisSchoolyandexru {
    font-family: var(--smallText);
    font-size: 10.9vw;
    text-transform: uppercase;
    position: relative;
    inset: 0;
    z-index: 2;
}

.number {
    font-family: var(--smallText);
    font-size: 4vw;
}

.footer__list {
    display: flex;
    gap: 40px;
    margin: 30px 0;
}

.footer__list > span {
    font-family: var(--bigText);
    font-size: 1.7vw;
    color: var(--colorBlack);
}

.footer__information {
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 8px;
}

.footer__information > span {
    font-size: 1vw;
    font-family: var(--bigText);
    color: #0b0b0b;
    opacity: .7;
}

.footer__information > span:first-child {font-size: 1.1vw;}

.parallax-ball {position: absolute;}

.parallax-ball.ball1 {
    top: 45%;
    left: 10%;
    width: 7vw;
}

.parallax-ball.ball2 {
    top: 10%;
    left: 50%;
    transform: translate(-50%, 0);
    width: 11vw;
    transition: all .01s linear;
}

.parallax-ball.ball3 {
    top: 50%;
    left: 90%;
    width: 9vw;
}

.about-school {
    position: relative;
    inset: 0;
}

.parallax-ball.ball11 {
    top: 50%;
    left: 10%;
    width: 15vw;
}

.parallax-ball.ball22 {
    top: 60%;
    left: 10%;
    width: 20vw;
}

.parallax-ball.ball111 {
    top: 50%;
    left: 80%;
    width: 7vw;
}

.parallax-ball.ball222 {
    top: 60%;
    left: 14%;
    width: 10vw;
}

.parallax-ball.ball1111 {
    top: 40%;
    left: 15%;
    width: 15vw;
}

.parallax-ball.ball2222 {
    top: 60%;
    left: 5%;
    width: 20vw;
}

.parallax-ball.ball11111 {
    top: 25%;
    left: 75%;
    width: 17vw;
}

.parallax-ball.ball22222 {
    top: 25%;
    left: 3%;
    width: 20vw;
}

.comments {
    position: relative;
    inset: 0;
}

.swiper-slide {
    display: flex!important;
    align-items: center!important;
    justify-content: center!important;
    width: 100%;
    height: 500px!important;
    max-width: 1100px;
    position: relative;
    inset: 0;
    background-color: #d9f029;
    font-family: var(--smallText);
    font-size: 200px;
}

@media (max-width: 1100px) {.burger-button {inset: 2% 0 0 90%;}}

@media (max-width: 799px) {

    section {padding: 0 5%;}

    .banner {padding: 5vw 4vw;}

    .banner__list-container > a {
        font-size: 3vw;
    }
     
    .banner__list-container {padding: 5vw 4vw;}
    
    .banner__list-container > a:first-child {font-size: 3.5vw;}

    .banner__registration {
        width: 25vw;
        height: 7vw;
        font-size: 2.5vw;
        border-radius: 1000;
    }

    .banner__text-registration-container {
        flex-direction: column-reverse;
        align-items: flex-start;
        padding: 0 4vw;
        gap: 5vw;
    }

    .banner__text-container > span {font-size: 3vw!important;}
    
    .banner__text-container > span:nth-child(2) {font-size: 7vw!important;}
    
    .banner__text-container > span:nth-child(2) > br, .banner__text-container > span > br {display: none;}

    .banner__text-registration-container > div {display: block; width: 100%; justify-content: center;}

    .photo {height: 130vw;}

    .svg1 {display: none;}

    .svg2 {display: block;}

    .banner__video {
        width: 40vw;
        height: 40vw;
        border-radius: 3vw;
    }

    .nice__blocks-container {gap: 4vw;}

    .nice__blocks-container > div {
        flex-direction: column;
        height: auto;
        gap: 4vw;
    }

    .nice__block {
        width: 100%;
        height: 90vw;
        border-radius: 5vw;
    }

    .nice__block > span {
        font-size: 3vw!important;
    }

    .scroll-button {width: 50px; height: 50px;}

    .nice__blocks-container > div:nth-child(1) > div:nth-child(3), .nice__block2 {display: none;}

    .about-school__wrap2 > span, .about-school__wrap2 > span > span {font-size: 9vw!important;}

    .about-school__wrap2, .nice2__wrap2 {width: 100%;}

    .about-school__wrap1 {display: none;}

    .nice__many-blocks {padding: 3vw;}

    .nice__many-blocks-block, 
    .nice__video {border-radius: 3vw;}

    .nice2__wrap2 > span,
    .nice2__wrap2 > span > span {font-size: 3vw;}

    .nice3__container {flex-direction: column; gap: 5vw;}

    .nice__container-block2 {justify-content: flex-start;}

    .nice__container-block1 {width: 100%;}

    .nice__container-wrap {height: 130vw;}

    *:not(.svg, section, main, .scroll-button, .burger-menu, .burger-button, .swiper, .swiper-slide, .swiper-button-next, .swiper-button-prev) {border-radius: 5vw!important;}

    .nice__container-block2,
    .nice__container-wrap2 {width: 100%!important; margin: 0;}

    .about-school__container {flex-direction: column-reverse; gap: 5vw;}

    .about-school__block {width: 100%; justify-content: flex-start;}
    
    .about-school__block2 {height: 90vw;}
    
    .about-school__block1 {height: 45vw;}

    .about-school__block3 > span {font-size: 3vw!important;}

    .about-school__mini-photo {height: 100%;}

    .ball2, .ball3, .ball1, .ball22, .ball33, .ball11, .ball2222, .ball3333, .ball1111  {display: none;}

    .span__block {
        height: 15vw;
    }
    
    .span__block > span, .span__block > span > span {
        font-size: 20vw;
    }

    .ball111 {
        top: 70%!important;
        left: 70%!important;
        width: 25vw!important;
    }
    
    .ball222 {
        top: 56%!important;
        left: 20%!important;
        width: 15vw!important;
    }
    
    .ball11111 {
        top: 20%!important;
        left: 2%!important;
        width: 25vw!important;
    }
    
    .ball22222 {
        top: 20%!important;
        left: 67%!important;
        width: 28vw!important;
    }

    .about-school__wrap-container {
        justify-content: flex-start;
    }

    .about-school__wrap {
        width: 100%; 
        height: auto;
        padding: 5vw;
        gap: 5vw;
        
    }

    .about-school__blocks-container {
        flex-direction: column;
        height: auto;
        gap: 5vw;
    }

    .about-school__mini-blocks {
        width: 100%;
        height: 70vw;
        font-size: 4vw;
        padding: 4vw;
    }

    .about-school__mini-blocks31, .about-school__mini-blocks13 {display: none;}

    .about-school__input-container {
        flex-direction: column;
        height: auto;
        gap: 5vw;
    }

    .input {
        height: 15vw;
        width: 100%;
        border-radius: 2vw!important;
        font-size: 3vw;
    }

    .input-button {
        height: 15vw;
        width: 60%;
        border-radius: 50px!important;
        font-size: 3vw;
    }

    .about-school__registration-container > span {font-size: 3vw!important; margin: 3vw 0;}
    .about-school__registration-container > span > span {font-size: 3vw!important;}

    .about-me__container {
        height: auto;
        padding: 5vw;
        gap: 5vw;
    }
    
    .about-me__container-box {
        flex-direction: column;
        height: auto;
        gap: 5vw;
    }

    .about-me__image-block {
        width: 100%;
        height: 80vw;
    }
    
    .about-me__information-block {
        width: 100%;
    }
    
    .about-me__information-block2 {display: none;}

    .about-me__information-block > div:nth-child(2) {display: none;}

    .about-me__container-block1, .about-me__container-block22 {
        height: 30vw;
        width: 100%;
        font-size: 3vw!important;
        justify-content: center;
        align-items: center;
    }

    .about-me__text-block {
        width: 100%;
        gap: 3vw;
    }

    .about-me__big-text {
        font-size: 12vw;
    }
    
    .about-me__medium-text {
        font-size: 5vw;
    }
    
    .about-me__small-text {
        font-size: 4vw;
    }

    .about-me__text-block > div {gap: 3vw;}

    .about-me__container-block111 {display: none;}

    .nice__block-displaynone {display: none;}

    .programms__block > div > span {font-size: 5vw!important;}

    .programms__block > div > a {
        width: 30vw;
        height: 10vw;
        font-size: 3vw;
    }

    .footer__container {
        padding: 4vw;
    }
    
    .footer__container > span:nth-child(1) {
        font-size: 10vw;
    }
    
    .footer__container > span:nth-child(2) {
        font-size: 7vw;
    }

    .footer__list {
        flex-direction: column;
        gap: 3vw;
        text-align: center;
    }

    .footer__list > span {font-size: 3vw;}

    .footer__information > span {font-size: 3vw!important;}

    .burger-menu {
        width: 100%;
        left: -100%;
    }

    .menu-active {left: 0;}

    .burger-button {inset: 2% 0 0 90%;}

    .swiper-slide {height: 50vw!important; font-size: 30vw!important;}
}

@media (max-width: 650px) {.burger-button {
    inset: 2% 0 0 85%;
    width: 55px;
    height: 55px;
}}

@media (max-width: 400px) {.burger-button {inset: 2% 0 0 80%;}}


/* Swiper */

.swiper {
    width: 100%;
    max-width: 1100px;
    border-radius: 2vw;
}


.swiper-button-next, .swiper-rtl .swiper-button-prev {
    position: static!important;
    width: 42px!important;
    height: 40px!important;
    display: flex!important;
    background-color: #d9f029;
    border-radius: 5px;
}

.swiper-button-prev, .swiper-rtl .swiper-button-next {
    position: static!important;
    width: 42px!important;
    height: 40px!important;
    display: flex!important;
    justify-content: center!important;
    align-items: center!important;
    background-color: #d9f029;
    border-radius: 5px;
    transition: all .3s ease-in-out;
}

.swiper-button-prev > svg,
.swiper-button-next > svg {width: 24px!important; height: 24px!important;}

.swiper-button-next:hover, .swiper-rtl .swiper-button-prev:hover,
.swiper-button-prev:hover, .swiper-rtl .swiper-button-next:hover {
    background-color: var(--colorWhite);
}

.swiper-button-next:active, .swiper-rtl .swiper-button-prev:active,
.swiper-button-prev:active, .swiper-rtl .swiper-button-next:active {
    opacity: .35;
}

.swiper-button-next::after, .swiper-button-prev::after {content: ''!important;}

.swiper-button-container {
    display: flex;
    gap: 30px;
    width: 100%;
    justify-content: center;
    margin-top: 50px;
}