*{
    margin: 0;
    box-sizing: border-box;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.grid{
    display: grid;
}

.flex{
    display: flex;
}

.gap_30{
    grid-gap: 30px;
}

.gap_70{
    grid-gap: 70px;
}
.section{
    width: 100%;
}

.container {
    padding: 0 1.5%;
    color: white;
}

:root{
    --title: 75px;
    --text: 18px;
    --title-name: 900;
    --border-radius_35: 35px;
    --gap: 40px;
}

@keyframes spin-border {
    0% {
    transform: rotate(0deg);
    }
    100% {
    transform: rotate(360deg);
    }
    }

/* * */

.row__picture_choice {
    width: 60%;
    grid-gap: 30px;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(4, 1fr);
    border-radius: 35px;
}

.inner__picture_choice {
    border-radius: 30px;
}

.border_choice {
    border: 3px solid white;
}

.inner__picture_choice_1 {
    background: url('img/img__picture_choice/picture_choice_1.jpg');
    background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ;
}

.inner__picture_choice_4 {
    background: url('img/img__picture_choice/picture_choice_4.jpg');
    background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ;
}

.inner__picture_choice_5 {
    background: url('img/img__picture_choice/picture_choice_10.jpg');
    background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ;
}

.inner__picture_choice_6 {
    background: url('img/img__picture_choice/picture_choice_2.jpg');
        background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ;
}

.inner__picture_choice_7 {
    background: url('img/img__picture_choice/picture_choice_3.jpg');
        background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ;
}

.inner__picture_choice_10 {
    background: url('img/img__picture_choice/picture_choice_6.jpg');
        background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ;
}

.inner__picture_choice_14 {
    background: url('img/img__picture_choice/picture_choice_7.jpg');
        background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ;
}

.inner__picture_choice_16 {
    background: url('img/img__picture_choice/picture_choice_5.jpg');
        background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ;
}

.inner__picture_choice_18 {
    background: url('img/img__picture_choice/picture_choice_8.jpg');
        background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ;
}

.inner__picture_choice_19 {
    background: url('img/img__picture_choice/picture_choice_9.jpg');
        background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ;
}

/* 1 */

.containe__choice {
    position: relative;
    width: 100%;
    height: 1400px;
    background-color: #4200ff;
}

.title__choice {
    width: 100%;
    text-transform: uppercase;
    font-size: 100px;
    font-weight: 900;
    justify-content: center;
}

.wrap__choice{
    width: 100%;
    height: 700px;
}

#draggable, #draggable2, #draggable3, #draggable4, #draggable5, #draggable6, #draggable7, #draggable8, #draggable9, #draggable10, #draggable11, #draggable12  { width: 150px; height: 150px; padding: 0.5em; align-self: none; }

.row__choice_no {
    width: 20%;
    height: 100%;
    justify-content: center;
}

.wrap__choice_no {
    margin-top: 275px;
}

.wrap__choice_yes {
    margin-top: 275px;
}

.innner__picture_question {
    width: 250px;
    height: 250px;
    background-image: url('img/container_1/question.svg');
    transform: rotate(360deg);
    background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ;
}

.question_2{
    transform: rotate(60deg);
}

.row__choice_yes {
    width: 20%;
    height: 100%;
    justify-content: center;
}

.inner__choice{
    width: 230px;
    height: 110px;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    font-size: 50px;
    border: 3px solid black;
    color: black;
    text-transform: uppercase;
}

.inner__choice_yes {
    background-color: #ccff00;
    text-decoration: none;
}

.inner__choice_yes:hover {
    background-color: white;
}

.inner__choice_no {
    background-color: white;
}

.inner__choice_no:hover {
    background-color: #ccff00;
}

.my_draggadle_1{
    margin-left: 100px;
    margin-top: 100px;
    width: 100%;
    height: 100%;
}

.my_draggadle{
    width: 300px;
    height: 150px;
    z-index: 2;
}

.picture__cats_pats {
    position: absolute;
    bottom: 300px;
    width: 150px;
    height: 150px;
    background-image: url('img/pats.svg');
    transform: rotate(45deg);
    background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ;
}

.picture__cats_choice {
    position: absolute;
    width: 600px;
    height: 600px;
    right: 0;
    bottom: 0;
    background-image: url('img/picture_cats.png');
    background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ; 
    z-index: 2;
}

.popup-overlay {
    position: relative;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 99;
}

.popup-content {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 95%;
    height: 85%;
    background-color: #ccff00;
    z-index: 100;
    border-radius: 80px;
}

.popup-show {
    display: block;
}

.row_name_question {
    width: 70%;
    color: #4200ff;
}

.popup-content::after{
    position: absolute;
    content: "";
    width: 600px;
    height: 600px;
    right: 0;
    bottom: 0;
    background-image: url('img/picture_cats.png');
    background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ; 
    border-radius: 0 0 80px 0 ;
}

.wrap__name {
    width: 100%;
    height: 240px;
    font-size: 80px;
    align-items: center;
    justify-content: center;
    font-weight: var(--title-name);
}

.wrap__name_1 {
    height: 150px;
    font-size: 95px;
}

.wrap__open {
    position: absolute;
    width: 100px;
    height: 100px;
    background: url('img/cross.svg');
    background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ; 
    margin-top: 45px;
    right: 45px;
}

.wrap__name_2 {
    font-size: 155px;
}

.wrap__name_3 {
    position: relative;
    font-size: 135px;
}

.inner__name_black {
    position: absolute;
    bottom: 0;
    left: 30px;
    width: 100%;
    background-color: black;
    align-items: center;
    justify-content: center;
    color: white;
    border-radius: 50px;
}

.wrap__name_4 {
    font-size: 135px;
}

/* 2 */

.container_way {
    position: relative;
    width: 100%;
    height: 500px;
    padding: 2% 2%;
    background-color: #ccff00;
    grid-template-columns: auto 200px;
    align-items: center;
    padding-block-end: 400px;
}

.container_way::after{
    content: "";
    position: absolute;
    left: 0;
    top: -120px;
    width: 100%;
    height: 120px;
    background-image: url('img/edging/edging_1.svg');
    z-index: 3;
}

.wrap__name_way {
    color: white;
    font-size: var(--title);
    font-weight: var(--title-name);
    letter-spacing: 7px;
}
.wrap_scrole{
    z-index: 4;
}
.inner__circle_main {
    position: relative;
    width: 200px;
    height: 200px;
    border-radius: 100px;
    font-size: 40px;
    align-items: center;
    justify-content: center;
}

.inner_circle{
    position: absolute;
    top: 0;
    left: 0;
    width: 200px;
    height: 200px;
    border-radius: 100px;
    border: 2px dashed black;
    animation: spin-border 13s infinite linear;
}

/* 3 */

.containe__facts {
    position: sticky;
    position: relative;
    width: 100%;
    padding: 100px 0;
    background-color: #4200ff;
    display: grid;
    grid-gap: var(--gap);
    padding: 0 1.5%;
}

.containe__facts::after{
    content: "";
    position: absolute;
    left: 0;
    top: -120px;
    width: 100%;
    height: 120px;
    background-image: url('img/edging/edging_2.svg');
}

.title__facts {
    color: white;
    font-size: var(--title);
    font-weight: var(--title-name);
    text-transform: uppercase;
}

.span__facts {
    display: block;
    width: 100%;
    text-align: right;
}

.wrap__facts {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 240px);
    grid-gap: var(--gap);
    width: 75%; 
    color: black;
}

.inner__facts {
    padding: 30px;
    background: white;
    border-radius: var(--border-radius_35);
    font-size: var(--text);

}

.inner__lime {
    background: #ccff00;
}

.inner__facts_1 {grid-area: 1 / 1 / 2 / 2;}
.inner__facts_2 { grid-area: 1 / 2 / 2 / 3;}
.inner__facts_3 { grid-area: 1 / 3 / 2 / 4;}
.inner__facts_4 { grid-area: 2 / 1 / 3 / 2;}
.inner__facts_5 {
    grid-area: 2 / 2 / 3 / 4;
    align-items: center;
    justify-content: center;
    background-color: #4200ff;
    color: white;
}

.inner_big{
    display: flex;
    align-items: center;
    background: transparent;
    color: white;
    font-size: 25px;
    font-weight: 700;
}

.span_lime{
    color: black;
    position: relative;
    display: inline-block;
    z-index: 5;
}

.span_lime::before{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: #ccff00;
    z-index: -1;
    transform: rotate(-6deg);
    padding: 5px;
    border-radius: 25px;
    left: -5px;
    top: -5px;
}

.wrap__know{
    position: relative;
    width: 100%;
    height: 600px;
}

.inner__understand{
    position: absolute;
    right: 30%;
    bottom: 25%;
    width: 700px;
    height: 150px;
    background: black;
    border-radius: var(--border-radius_35);
    font-size: var(--title);
    justify-content: center;
    align-items: center;
    font-weight: var(--title-name);
}

.inner__picture_cats{
    position: absolute;
    width: 700px;
    height: 700px;
    right: -2%;
    bottom: 0;
    background-image: url('img/picture_cats.png');
    background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ; 
    z-index: 2;
}  

/* 4 */

.containe__facts_contin {
    position: relative;
    width: 100%;
    padding: 3%;
    background-color: #ccff00;
    display: grid;
    grid-gap: var(--gap);
    grid-template-areas: 'a a b b'
                         'c d b b'
                         'e f b b'
                         'g g h h';
    padding-block-end: 200px;
}

 .containe__facts_contin::after{
    content: "";
    position: absolute;
    left: 0;
    z-index: 3;
    top: -120px;
    width: 100%;
    height: 120px;
    background-image: url('img/edging/edging_3.svg');
}

.wrap__facts_contin {
    border-radius: var(--border-radius_35);
    justify-content: center;
    font-size: var(--subtext);
    color: black;
    padding: 30px;
    font-size: var(--text);

}

.a {
    grid-area: a;
    font-size: 30px;
}

.b {
    grid-area: b;
}

.c {
    grid-area: c;
    background-color: #4200ff;
    color: white;
    height: 300px;
}

.d {
    grid-area: d;    
    background-color: white;
}

.e {
    grid-area: e;
    position: relative;
    padding: 0;
    align-items: flex-end;
    height: 300px;
}

.inner__picture_pats{
    position: absolute;
    width: 150px;
    height: 150px;
    left: 0;
    background-image: url('img/pats.svg');
    transform: rotate(45deg);
    background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ;
}

.f {
    grid-area: f; 
    background-color: white;
}

.g {
    grid-area: g;   
}

.h {
    grid-area: h;
    color: black;
    font-size: var(--title);
    height: 300px;
    font-weight: var(--title-name);
}

.span__blue{
    color: black;
    position: relative;
    display: inline-block;
    z-index: 5;
}

.span__blue::before{
    content: '';
    position: absolute;
    width: 110%;
    height: 80%;
    background: #4200ff;
    z-index: -1;
    transform: rotate(-4deg);
    padding: 5px;
    border-radius: 50px;
    left: -5%;
    top: 10px;
}
/* 5 */

.containe_loves {
    position: relative;
    width: 100%;
    background-color: #4200ff;
    padding-block-end: 200px;
}

.containe_loves::after{
    content: "";
    position: absolute;
    left: 0;
    top: -120px;
    width: 100%;
    height: 120px;
    background-image: url('img/edging/edging_4.svg');
}

.wrap__love_name {
    width: 100%;
    font-size: var(--title);
    padding: 30px;
    font-weight: var(--title-name);
}

.wrap__love_picture {
    grid-gap: var(--gap);
    width: 100%;
    grid-template-columns: repeat(auto-fill,minmax(250px, 1fr));
}

.wrap__picture_love_pats{
    position: absolute;
    bottom: 80px;
    width: 150px;
    height: 150px;
    right: 1.5%;
    background-image: url('img/pats.svg');
    transform: rotate(315deg);
    background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ;
}

.inner_love {
    flex-direction: column;
}

.inner__picture_love {
    width: 100%;
    height: 250px;
    border-radius: var(--border-radius_35);
    background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100%;
    border: 3px solid white;

}

.inner__picture_love_1 {
    background-image: url('img/img__love_cats/cats_1.jpg');
}

.inner__picture_love_2 {
    background-image: url('img/img__love_cats/cats_2.jpg');

}

.inner__picture_love_3 {
    background-image: url('img/img__love_cats/cats_3.jpg');

}

.inner__picture_love_4 {
    background-image: url('img/img__love_cats/cats_4.jpg');

}

.inner__picture_love_5 {
    background-image: url('img/img__love_cats/cats_5.jpg');

}

.inner__name__picture_love {
    width: 100%;
    height: 50px;
    align-items: center;
    justify-content: center;
    font-size: 25px;
}

/* 6 */

.containe_happy {
    position: relative;
    width: 100%;
    height: 800px;
    background-color: #ccff00;
    grid-template-columns: 1.5fr 1fr;
}

.containe_happy::after{
    content: "";
    position: absolute;
    left: 0;
    top: -120px;
    width: 100%;
    height: 120px;
    background-image: url('img/edging/edging_5.svg');
}



.wrap__text_happy {
    position: relative;
}

.wrap__picture_happy {
    align-items: flex-end;
    justify-content: flex-end;
}

.inner__picture_happy_pats{
    position: absolute;
    bottom: 80px;
    width: 150px;
    height: 150px;
    background-image: url('img/pats.svg');
    transform: rotate(45deg);
    background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ;
}

.inner__text_happy{
    width: 100%;
    font-size: var(--title);
    font-weight: var(--title-name);
}

.inner__picture_happy{
    position: absolute;
    right: -1.5%;
    width: 50%;
    height: 70%;
    background-image: url('img/img__happy/cats_happy.png');
    background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100%;
}

/* 7 */

.container_purchase{
    position: relative;
    width: 100%;
    background-color: #4200ff;
}

.container_purchase::after{
    content: "";
    position: absolute;
    left: 0;
    top: -120px;
    width: 100%;
    height: 120px;
    background-image: url('img/edging/edging_6.svg');
}

.row__purchase_name {
    width: 100%;
    font-size: var(--title);
    font-weight: var(--title-name);
}

.row_cities {
    width: 100%;
    grid-template-columns: repeat(auto-fill,minmax(250px,3fr));
    align-items: center;
    grid-gap: var(--gap);
    padding: 50px 0;
    font-size: 20px;
}

.inner__cities_name {
    border: 3px solid black;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--border-radius_35);
    height: 50px;
    color: black;
    background: #ccff00;
}

.btn_active{
    background-color: white;
}

.wrap__picture_shelters {
    grid-template-columns: repeat(auto-fill,minmax(250px,3fr)); 
    display: grid;
    width: 100%;
    background-color: #4200ff;
    grid-gap: var(--gap);
}

.wrap__shelters_none {
    display: none;
}

.wrap_picture_shelters__active{
    display: grid;
}

.inner__shelters{
    border: 3px solid #ccff00;
    border-radius: var(--border-radius_35);
    background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 103% 100%;
    height: 200px;
}

/* moscow */

.inner__shelters_Moscow_1 {
    background-image: url('img/img__TAB/moscow/moscow_1.jpg');
}

.inner__shelters_Moscow_2 {
    background-image: url('img/img__TAB/moscow/moscow_2.jpg');

}

.inner__shelters_Moscow_3 {
    background-image: url('img/img__TAB/moscow/moscow_3.jpg');

}

.inner__shelters_Moscow_4 {
    background-image: url('img/img__TAB/moscow/moscow_4.jpg');

}

.inner__shelters_Moscow_5 {
    background-image: url('img/img__TAB/moscow/moscow_5.jpg');

}

.inner__shelters_Moscow_6 {
    background-image: url('img/img__TAB/moscow/moscow_6.jpg');

}

.inner__shelters_Moscow_7 {
    background-image: url('img/img__TAB/moscow/moscow_7.jpg');

}

.inner__shelters_Moscow_8 {
    background-image: url('img/img__TAB/moscow/moscow_8.jpg');

}

.inner__shelters_Moscow_9 {
    background-image: url('img/img__TAB/moscow/moscow_9.jpg');
}

.inner__shelters_Moscow_10 {
    background-image: url('img/img__TAB/moscow/moscow_10.jpg');
}

.inner__shelters_Moscow_11 {
    background-image: url('img/img__TAB/moscow/moscow_11.jpg');
}

.inner__shelters_Moscow_12 {
    background-image: url('img/img__TAB/moscow/moscow_12.jpg');
}

.wrap__picture_shelters_MosObl{
    display: none;
}

/* moscObl */


.inner__shelters_MosObl_1 {
    background-image: url('img/img__TAB/moscObl/moscObl_1.jpg');
}

.inner__shelters_MosObl_2 {
    background-image: url('img/img__TAB/moscObl/moscObl_2.jpg');
}

.inner__shelters_MosObl_3 {
    background-image: url('img/img__TAB/moscObl/moscObl_3.jpg');
}

.inner__shelters_MosObl_4 {
    background-image: url('img/img__TAB/moscObl/moscObl_4.jpg');
}

.inner__shelters_MosObl_5 {
    background-image: url('img/img__TAB/moscObl/moscObl_5.jpg');
}

.inner__shelters_MosObl_6 {
    background-image: url('img/img__TAB/moscObl/moscObl_6.jpg');
}

.inner__shelters_MosObl_7 {
    background-image: url('img/img__TAB/moscObl/moscObl_7.jpg');
}

.inner__shelters_MosObl_8 {
    background-image: url('img/img__TAB/moscObl/moscObl_8.jpg');
}

.inner__shelters_MosObl_9 {
    background-image: url('img/img__TAB/moscObl/moscObl_9.jpg');
}

/* kaluga */

.inner__shelters_Kaluga_1 {
    background-image: url('img/img__TAB/kaluga/kaluga_1.jpg');
}

.inner__shelters_Kaluga_2 {
    background-image: url('img/img__TAB/kaluga/kaluga_2.jpg');
}

.inner__shelters_Kaluga_3 {
    background-image: url('img/img__TAB/kaluga/kaluga_3.jpg');
}

.inner__shelters_Kaluga_4 {
    background-image: url('img/img__TAB/kaluga/kaluga_4.jpg');
}

.inner__shelters_Kaluga_5 {
    background-image: url('img/img__TAB/kaluga/kaluga_5.jpg');
}

.inner__shelters_Kaluga_6 {
    background-image: url('img/img__TAB/kaluga/kaluga_6.jpg');
}

/* tula */

.inner__shelters_Tula_1 {
    background-image: url('img/img__TAB/tula/tula_1.jpg');
}

.inner__shelters_Tula_2 {
    background-image: url('img/img__TAB/tula/tula_2.jpg');
}

/* 8 */

.containe__time_cats {
    width: 100%;
    height: 1400px;
    position: relative;
    background-color: #4200ff;
    padding: 0;
}

.containe__time_cats::after{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 200px;
    transform: rotate(180deg);
    background-image: url('img/edging/edging_7.svg');
}

.wrap__picture_end{
    width: 100%;
    height: 80%;
    overflow: hidden;
    opacity: 0.7;
}

.inner__picture_end {
    width: 100%;
    height: 100%;
    background-image: url('img/picture__cats_end.png');
    background-position: center center;
    background-repeat: no-repeat;
    object-fit: cover;
    background-size: 100% 100% ;
}

.animate__animated.animate__bounce {
    animation: pulse 7s ease-in-out infinite;
}


.wrap__time_cats{
    position: relative;
    width: 100%;
    height: 20%;
    background-color: #4200ff;
    font-size: clamp(190px, 130%, 160px);
    justify-content: center;
    align-items: center;
}

.wrap__time_cats::after{
    content: "";
    position: absolute;
    left: 0;
    top: -120px;
    width: 100%;
    height: 120px;
    background-image: url('img/edging/edging_8.svg');
}

/* media */
@media (max-width: 1920px){
    .wrap__picture_love_pats {
        bottom: 50px;
    }

    .inner__picture_happy {
        width: 43%;
        height: 100%;
    }
}

@media (max-width: 1760px){
    .popup-content {
        width: 95%;
        height: 80%;
    }

    .wrap__name {
        height: 210px;
    }

    .popup-content::after {
        width: 550px;
        height: 550px;
    }

    .wrap__name_1 {
        height: 140px;
        font-size: 86px;
    }

    .wrap__name_2 {
        font-size: 135px;
    }

    .wrap__name_3 {
        font-size: 120px;
    }

    .wrap__name_4 {
        font-size: 125px;
    }
}

@media (max-width: 1560px){
    :root{
        --title: 60px;
        --text: 18px;
    }

    .popup-content {
        height: 75%;
    }

    .wrap__name {
        height: 200px;
    }

    .popup-content::after {
        width: 550px;
        height: 550px;
    }

    .wrap__name_1 {
        height: 130px;
        font-size: 76px;
    }

    .wrap__name_2 {
        font-size: 125px;
    }

    .wrap__name_3 {
        font-size: 110px;
    }
    
    .wrap__name_4 {
        font-size: 115px;
    }

    .container_way {
        padding-block-end: 315px;
    }

    .containe__facts_contin {
        grid-gap: 50px;
        grid-template-areas:
                    'a a b b'
                    'c d b b'
                    'e f b b'
                    'h h h h';
        padding-block-end: 0;
    }

    .h {
        height: 200px;
    }

    .containe_loves {
        padding-block-end: 250px;
    }
    .wrap__picture_love_pats {
        bottom: 100px;
    }

    .inner__picture_happy {
        width: 50%;
        height: 95%;
    }

    .wrap__time_cats {
        font-size: 150px;
    }

}

@media (max-width: 1360px){

    .title__choice {
        font-size: 80px;
    }

    .containe__choice {
        height: 1300px;
    }

    .row__picture_choice {
        grid-gap: 6px;
    }

    .row__picture_choice {
        height: 95%;
    }

    .popup-content {
        height: 70%;
    }

    .wrap__name {
        height: 190px;
    }

    .popup-content::after {
        width: 500px;
        height: 500px;
    }

    .wrap__name_1 {
        height: 120px;
        font-size: 69px;
    }

    .wrap__name_2 {
        font-size: 120px;
    }

    .wrap__name_3 {
        font-size: 105px;
    }
    
    .wrap__name_4 {
        font-size: 110px;
    }
    
}

    @media (max-width: 1260px){
    .wrap__facts {
        width: 85%;
    }

    .popup-content {
        height: 60%;
    }

    .wrap__name {
        height: 160px;
    }

    .popup-content::after {
        width: 400px;
        height: 400px;
    }

    .wrap__name_1 {
        height: 100px;
        font-size: 55px;
    }

    .wrap__name_2 {
        font-size: 110px;
    }

    .wrap__name_3 {
        font-size: 95px;
    }

    .wrap__name_4 {
        font-size: 100px;
    }


}
@media (max-width: 1200px){

    :root{
        --title: 50px;
        --text: 16px;
        --title-name: 900;
        --border-radius_35: 35px;
        --gap: 30px;
    }

    /* 2 */

    .container_way {
        height: 350px;
        padding-block-end: 260px;
    }

    .gap_70 {
        grid-gap: 30px;
    }
    .inner_circle {
        width: 180px;
        height: 180px;
        font-size: 35px;
    }

     /* 3 */

    .containe__facts {
        padding: 0 1.5% 100px 1.5%;
    }

    .wrap__facts {
        width: 100%;
        grid-template-rows: repeat(2, 240px);
    }

    .inner__picture_cats {
        width: 600px;
        height: 600px;
    }

    .wrap__know {
        height: 500px;
    }
  
    .inner__understand {
        right: 39%;
        width: 600px;
    }

    /* 4 */

    .containe__facts_contin {
        grid-template-areas:
        'a a a a'
        'c c d d'
        'e e f f'
        'h h h h';
        padding-block-end: 0;
    }
    
    .wrap__facts_contin {
        padding: 25px;
    }

    .a {
        font-size: 25px;
    }

    .b {
        grid-area: none;
    }

    .c {
        height: 250px;
    }

    .h {
        height: 150px;
    }

    .e {
        height: 250px;
    }

    /* 5 */

    .containe_loves {
        padding-block-end: 260px;
    }

    .wrap__picture_love_pats {
        bottom: 100px;
    }


    /* 6 */

    .containe_happy {
        height: 500px;
        padding-block-end: 30px;
    }

    .inner__picture_happy {
        width: 47%;
        height: 80%;
    }

    .inner__picture_happy_pats {
        bottom: 35px;
    }

    /* 7 */

    .row_cities {
        grid-gap: 15px;
    }

    /* 8 */

    .containe__time_cats {
        height: 1000px;
    }
    .wrap__time_cats {
        font-size: 135px;
    }
}

@media (max-width:980px){
    :root{
        --title: 45px;
        --text: 14px;
        --title-name: 700;
        --border-radius_35: 35px;
        --gap: 25px;
    }

    .popup-content {
        height: 60%;
    }

    .wrap__name {
        height: 155px;
    }

    .popup-content::after {
        width: 350px;
        height: 350px;
    }

    .wrap__name_1 {
        height: 80px;
        font-size: 50px;
    }

    .wrap__name_2 {
        font-size: 100px;
    }

    .wrap__name_3 {
        font-size: 90px;
    }

    .wrap__name_4 {
        font-size: 90px;
    }

    .container_way {
        height: 330px;
        padding-block-end: 230px;
    }

    .containe__facts {
        padding: 0 1.5% 37px 1.5%;
    }

    .wrap__facts {
        width: 100%;
        grid-template-rows: repeat(2, 180px);
    }

    .inner__picture_cats {
        width: 500px;
        height: 500px;
    }

    .inner__understand {
        right: 44%;
        width: 450px;
        height: 120px;
    }

    .wrap__facts_contin {
        padding: 22px;
    }

    .c {
        height: 210px;
    }

    .e {
        height: 210px;
    }

    .containe_happy{
        display: flex;
    }

    .containe_happy {
        height: 700px;
    }

    .inner__picture_happy {
        width: 55%;
        height: 60%;
    }

    .inner__picture_happy_pats {
        bottom: 315px;
    }

    .containe__time_cats {
        height: 900px;
    }

    .wrap__time_cats {
        font-size: 95px;
    }

}