html {
    scroll-behavior: smooth;
    overflow-x: hidden;
  }
 
.container {
    display: flex;
    max-width: 1440px;
    flex-direction: column;
    font-family: Inika, sans-serif;
    margin: auto;
}
 
#header {
    max-width: 1440px;
    height: 134px;
    background-color: #EDF2EC;
}

.navbar {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    max-width: 1220px;
    padding-left: 109px;
    padding-right: 109px;
    height: 50px;
    margin-top: 41px;
}

.nav_list {
    list-style-type: none;
    display: flex;
    flex-direction: row;
    align-content: space-between;
    margin-top: 18px;
}

.text_logo {
    position: relative;
    text-decoration: none;
    color: #000000;
    transition: 0.5s;
}
    
.text_logo:first-child::before {
    content: "";
    position: absolute;
    left: -20px;
    width: 20px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(assets/logo/logo_vector.svg);
}
    
.nav_item {
    text-decoration: none;
    color: #010201;
    padding-left: 46px;
    transition: 0.5s;
}

.main {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
}

#welcome {
    max-width: 1440px;
    height: 532px;
    background: #EDF2EC;
}

.welcome_container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 70px;
    padding-right: 70px;
    height: 408px;
    padding-top: 54px;
}

.welcome_wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: space-between;
    width: 549px;
    height: 340px;
    padding-top: 44px;
}

.welcome_title {
    width: 549px;
    height: 101px;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-size: 45px;
    line-height: 50px;
    color: #717171;
    margin: 0;
}

.welcome_wrapper span {
    color: #499A18;
}

.welcome_text {
    width: 526px;
    height: 105px;
    font-size: 20px;
    line-height: 35px;
    color: #636060;
}

.welcome_button {
    width: 158px;
    height: 44px;
    border: 2px solid #E06733;
    font-size: 100%;
    border-radius: 10px;
    font-family: 'Inter';
    transition: 0.5s;
}

#About_us {
    display: flex;
    flex-direction: row;
    max-width: 1440px;
    height: 666px;
    justify-content: space-between;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
}

.about_container {
    width: 605px;
    height: 350px;
    padding-left: 109px;
}

.about_title {
    width: 463px;
    height: 102px;
    margin: 0;
    font-family: 'Inika';
    font-style: normal;
    font-weight: 400;
    font-size: 40px;
    line-height: 52px;
    color: #499A18;
}

.about_title span {
    color: #E06733;
}

.about_text {
    width: 605px;
    height: 208px;
    margin-top: 42px;
    font-size: 20px;
    line-height: 30px;
    color: #636060;
}

.about_img {
    width: 464px;
    height: 479px;
}

#Service {
    display: flex;
    flex-direction: column;
    max-width: 1440px;
    height: 1300px;
    background: #EDF2EC;
}

.service_content {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding-left: 109px;
    padding-top: 40px;
    width: 1007px;
    height: 94px;
    margin-bottom: 105px;
}

.service_title {
    width: 306px;
    height: 94px;
    margin: 0;
    font-size: 40px;
    line-height: 52px;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    color: #499A18;
}

.service_list_buttons {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    list-style-type: none;
    width: 559px;
    height: 50px;
}

.service_item {
    width: 161px;
    height: 50px;
    border: 1px solid #E06733;
    color: #E06733;
    border-radius: 5px;
    font-family: 'Inika';
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 26px;
    transition: 0.5s;
}

.services_list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    height: 955px;
    max-width: 1222px;
    margin-left: auto;
    margin-right: auto;
    padding: 0px;
    list-style-type: none;
}

.service_img {
    width: 329px;
    height: 350px;
}

.img_first {
    background-image: url(assets/image/first.png)
}

.img_second {
    background-image: url(assets/image/second.png)
}

.img_third {
    background-image: url(assets/image/third.png)
}

.img_fourth {
    background-image: url(assets/image/fourth.png)
}

.img_fifth {
    background-image: url(assets/image/fifth.png)
}

.img_sixth {
    background-image: url(assets/image/sixth.png)
}

.description {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    width: 330px;
    height: 80px;
    border-width: 0px 1px 1px 1px;
    border-style: solid;
    border-color: #E3E1D5;
    border-radius: 0px 0px 20px 20px;
    margin-bottom: 72px;
}

.description-title {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 20px;
    margin: 10px 0px;
    text-align: center;
    color: #E06733;
}

.description-text {
    margin: 0;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    text-align: center;
    color: #717171;
}

#Price {
    max-width: 1440px;
    height: 560px;
}

.prices_container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    height: 405px;
    padding-top: 40px;
    max-width: 1222px;
    padding-left: 40px;
    padding-right: 40px;
    margin-left: auto;
    margin-right: auto;
}

.prices_content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 332px;
    height: 392px;
}

.prices_title {
    width: 135px;
    height: 49px;
    margin: 0px;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-size: 40px;
    line-height: 48px;
    color: #000000;
}

.prices_menu {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    width: 332px;
    height: 283px;
    border: 1px solid #E3E1D5;
    border-radius: 20px;
}

.text_prices_basics {
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 20px;
    color: #000000;
    text-align: start;
    font-family: 'Inter';
    padding-left: 40px;
}

.price_basic {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 250px;
    height: 50px;
    background: #EDF2EC;
    border-radius: 20px;
    border-color: #EDF2EC;
    cursor: pointer;
}

.icon_prices {
    padding-right: 40px;
}

.price_basic_hidden,
.price_standard_hidden,
.price_pro_hidden {
    position: absolute;
    margin-top: -50px;
    width: 250px;
    height: 154px;
    background: #D6E7D2;
    border-radius: 20px;
    z-index: 1;
    cursor: pointer;
}

.title_prices_hidden {
    margin: 0px;
    padding-left: 40px;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 20px;
    color: #000000;
    text-align: start;
}

#icon_hidden,
#icon-standard-hidden,
#icon-care-hidden {
    width: 16px;
    height: 16px;
    padding-right: 40px;
}

.border_hidden {
    display: block;
    width: 164px;
    height: 0px;
    border: 0.5px solid #AEA1A1;
    margin-left: auto;
    margin-right: auto;
}

.title_price_wrapper {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    height: 40px;
}

.text_prices_hidden {
    width: 169px;
    height: 30px;
    padding-left: 40px;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 300;
    font-size: 10px;
    line-height: 10px;
    color: #717171;
}

.text_cost_hidden {
    width: 123px;
    height: 17px;
    padding-left: 40px;
    margin: 10px 0px;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 20px;
    color: #000000;
}

.text_currency_hidden{
    font-weight: bold;
    color: #E06733;
}

.text_number_hidden {
    font-size: 16px;
    font-weight: bold;
    color: #E06733;
}

.prices_order {
    width: 86px;
    height: 25px;
    margin-left: 40px;
    background: #FFFFFF;
    border-radius: 10px;
    border: 1px solid #FFFFFF;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 20px;
    color: #717171;
    transition: 0.5s;
}

.help_container {
    display: flex;
    flex-direction: column;
    align-items: end;
    justify-content: space-between;
}

.title_help {
    width: 454px;
    height: 103px;
    margin: 0px;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-size: 40px;
    line-height: 50px;
    text-align: right;
    color: #000000;
}

.help_btn {
    width: 162px;
    height: 50px;
    border: 1px solid #E06733;
    border-radius: 5px;
    font-family: 'Inika';
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 26px;
    text-align: center;
    color: #E06733;
    background-color: #FFFFFF;
    transition: 0.5s;
}

.help_img {
    width: 152px;
    height: 175px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(assets/image/leafs2.png)
}

#Contacts {
    display: flex;
    justify-content: space-between;
    max-width: 1440px;
    height: 550px;
    padding-top: 53px;
    padding-left: 109px;
    padding-right: 109px;
    background: #EDF2EC;
}

.contact_container {
    width: 660px;
    display: flex;
    justify-content: space-between;
}

.contact_title {
    width: 195px;
    height: 51px;
    margin: 0px;
    font-family: 'Inika';
    font-style: normal;
    font-weight: 700;
    font-size: 40px;
    line-height: 52px;
    color: #499A18;
}

.contact_form {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 50px;
    width: 450px;
    margin-top: 100px;
    background: #D6E7D2;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}

.contacts_text {
    padding-left: 30px;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 40px;
    letter-spacing: 0.05em;
    color: #717171;
}

.contact_icon,
.contact_icon_hidden {
    margin-right: 30px;
}

.contacts_form_hid {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 450px;
    height: 234px;
    background: #DCE9D9;
}

.contacts_form_text {
    width: 380px;
    height: 35px;
    margin-bottom: 0px;
    font-family: 'Inter';
    font-style: normal;
    font-size: 16px;
    line-height: 30px;
    letter-spacing: 0.05em;
    margin-left: 30px;
    border: 1px solid #D9D9D9;
    border-width: 0px 0px 2px 0px;
    color: #499A18;
}

.contacts_form_text:hover {
    color: #717171;
    border-color: #717171;
    cursor: pointer;
}

.contacts_address {
    width: 448px;
    height: 214px;
    margin-top: 47px;
    background: #EDF2EC;
    border: 1px solid #000000;
    border-radius: 20px;
}

.container_address_text {
    display: flex;
    justify-content: space-between;
    padding-left: 30px;
    height: 40px;
    width: 308px;
}

.address_text {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 40px;
    letter-spacing: 0.05em;
    color: #000000;
}

.button_address {
    width: 122px;
    height: 26px;
    margin-top: 30px;
    margin-left: 162px;
    font-size: 10px;
    border: 1px solid #E06733;
    border-radius: 5px;
    transition: 0.5s;
}

.footer {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    max-width: 1222px;
    min-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    height: 130px;
}

.footer_date {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    width: 170px;
    justify-content: space-between;
}

.footer_date p,
.footer_date a {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 50px;
    text-decoration: none;
    color: #000;
}

.footer_wrapper_media {
    display: flex;
}

.footer_list_media {
    display: flex;
    flex-direction: row;
    list-style-type: none;
    justify-content: space-between;
    width: 200px;
}

.contacts_active {
    background: #C1E698;
    box-shadow: 0px 0px 0px 0px #FFFFFF;
}

.welcome_button:hover,
.help_btn:hover,
.service_item:hover,
.button_address:hover,
.prices_order:hover {
    cursor: pointer;
    background-color: #E06733;
    color: #FFFFFF;
    transition: 0.5s;
}

.nav_item:hover,
.footer_date a:hover,
.text_logo:hover {
    color: #E06733;
    transition: 0.5s;
}

.contact_icon:hover,
.contact_icon_hidden:hover {
    cursor: pointer;
}

.blurs {
    filter: blur(2px);
}
 
.active {
    color:#FFFFFF;
    background-color: #E06733;
}

@media (max-width: 1000px) and (min-width: 701px) {
    #header {
        max-width: 1000px;
        height: 117px;
    }

    .navbar {
        max-width: 670px;
        margin-left: auto;
        margin-right: auto;
    }

    #welcome {
        max-width: 1000px;
        height: 420px;
    }

    .welcome_container {
        max-width: 670px;
        height: 310px;
        flex-direction: row-reverse;
    }

    .welcome_wrapper {
        width: 346px;
        height: 310px;
        padding-top: 0px
    }

    .welcome_title {
        width: 341px;
        height: 101px;
        font-size: 35px;
    }

    .welcome_text {
        width: 341px;
        height: 105px;
        font-size: 16px;
        line-height: 25px;
        letter-spacing: 0.1px;
    }

    .welcome_img img{
        width: 280px;
        height: 255px;
    }

    #About_us {
        max-width: 1000px;
        height: 783px;
        flex-direction: column;
    }

    .about_container {
        width: 668px;
        padding-top: 40px;
        padding-left: 0px;
    }

    .about_img {
        display: flex;
        justify-content: center;
        padding-top: 40px;
    }
    .about_img img {
        width: 250px;
        height: 258px;
    }

    .about_title {
        width: 423px;
        font-size: 35px;
        line-height: 46px;
        text-align: center;
        margin-left: auto;
        margin-right: auto;
    }

    .about_text {
        width: 670px;
        margin-left: auto;
        margin-right: auto;
        font-size: 20px;
        line-height: 30px;
    }

    #Service {
        max-width: 1000px;
        height: 1780px;
    }

    .service_content {
        flex-direction: column;
        align-items: start;
        height: 200px;
        margin-left: 50px;
        margin-bottom: 40px;
    }

    .service_list_buttons {
        margin-top: 50px;
        padding-left: 0px;
    }

    .services_list {
        max-width: 770px;
        padding-left: 50px;
        padding-right: 50px;
    }

    .service_img  {
        width: 279px;
    }

    .img_first {
        background-image: url(assets/image/first380.png)
    }
    
    .img_second {
        background-image: url(assets/image/second380.png)
    }
    
    .img_third {
        background-image: url(assets/image/third380.png)
    }
    
    .img_fourth {
        background-image: url(assets/image/fourth380.png)
    }
    
    .img_fifth {
        background-image: url(assets/image/fifth380.png)
    }
    
    .img_sixth {
        background-image: url(assets/image/sixth380.png)
    }

    .description  {
        width: 279px;
    }

    #Price {
        max-width: 770px;
        height: 585px;
        margin-left: auto;
        margin-right: auto;
    }

    .prices_container {
        margin-left: auto;
        margin-right: auto;
        max-width: 720px;
        height: 530px;
        padding-left: 40px;
        padding-top: 40px;
    }

    .prices_title {
        font-size: 35px;
        line-height: 42px;
    }

    .help_container {
        width: 296px;
        height: 368px;
        padding-top: 100px;
    }

    .title_help {
        width: 296px;
        height: 78px;
        font-size: 25px;
        line-height: 35px;
    }


    #Contacts {
        max-width: 1000px;
        height: 740px;
        padding-left: 50px;
        padding-right: 50px;
        padding-top: 0px;
        flex-direction: column-reverse;
        align-items: center;
    }

    .contant_img {
        width: 200px;
        height: 249px;
    }

    .contact_container {
        flex-direction: column;
        width: 460px;
        align-items: center;
        margin-top: 30px;
    }

    .contact_title {
        margin: 0px;
    }

    .contact_form {
        margin-top: 50px;
    }

    .footer {
        max-width: 1000px;
        min-width: 0px;
        flex-direction: column;
        justify-content: center;
    }

    .footer_date p {
        margin: 0px;
    }

    .footer_list_media {
        padding-left: 0px;
    }
}

@media (max-width: 699px) {

    #header {
        max-width: 699px;
        height: 96px;
        display: flex;
        flex-direction: row;
        align-items: center;
        padding-left: 40px;
    }

    .navbar {
        max-width: 699px;
        padding-right: 0px;
        padding-left: 0px;
        margin: 0px;
    }

    .nav_list {
        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
        position: fixed;
        right: 0px;
        top: -150%;
        height: 99%;
        margin: 0;
        width: 170px;
        transition: all 1.5s ease 0s;
        background-color: #D6E7D2;
        border-radius: 20px 0 0 20px;
        border: 3px solid #499A18;
    }

    .nav_list_open {
        top: 0%;
    }

    .nav_item {
        color: #717171;
        margin-left: 18px;
        font-size: 30px;
        padding-left: 0px;
    }

    .navbar_burger {
        display: block;
        position: relative;
        width: 40px;
        height: 24px;
        left: 80%;
        z-index: 0;
    }

    .navbar_burger::before,
    .navbar_burger::after {
        content: '';
        background-color: #FFFFFF;
        position: absolute;
        width: 40px;
        height: 0px;
        border: 1px solid #717171;
    }

    .navbar_burger::before {
        top: 0px;
    }

    .navbar_burger::after {
        bottom: 0px;
    }

    .navbar_burger_close {
        position: fixed;
        width: 30px;
        height: 30px;
        z-index: 2;
        right: 30px;
        margin-top: -330px;
        transition: all 1s ease 0s;
    }

    .navbar_close_line_1,
    .navbar_close_line_2 {
        position: absolute;
        width: 100%;
        height: 0px;
        border: 1px solid #717171;
    } 

    .navbar_close_line_1 {
        transform: rotate(45deg); 
    }

    .navbar_close_line_2 {
        transform: rotate(-225deg);
    }

    .navbar_burger_line {
        position: absolute;
        width: 40px;
        height: 0px;
        top: 11px;
        border: 1px solid #717171;
    }

    .navbar_burger:hover,
    .navbar_burger::before:hover,
    .navbar_burger::after:hover,
    .navbar_burger_line:hover {
        border-color:#E06733;
        cursor: pointer;
    }

    #welcome {
        max-width: 699px;
        height: 300px;
    }

    .welcome_container {
        max-width: 699px;
        height: 300px;
        padding-top: 0px;
    }

    .welcome_img {
        display: none;
    }

    .welcome_wrapper {
        width: 330px;
        height: 252px;
        padding-top: 25px;
    }

    .welcome_title {
        width: 330px;
        height: 72px;
        font-size: 25px;
        line-height: 35px;
    }

    .welcome_text {
        width: 320px;
        height: 106px;
        font-size: 16px;
        line-height: 25px;
    }

    .welcome_button {
        width: 100px;
        height: 35px;
        font-size: 10px;
    }

    #About_us {
        max-width: 699px;
        height: 516px;
        flex-direction: column;
        justify-content: end;
    }

    .about_container {
        width: 330px;
        padding-left: 0px;
    }

    .about_title {
        width: 288px;
        height: 58px;
        font-size: 25px;
        line-height: 33px;
    }

    .about_text {
        width: 330px;
        font-size: 15px;
        line-height: 25px;
        margin-top: 30px;
    }

    .about_img,
    .about_img img {
        width: 150px;
        height: 147px;
    }

    #Service {
        max-width: 699px;
        height: 3150px;
    }

    .service_content {
        height: 200px;
        width: 252px;
        flex-direction: column;
        padding-right: 0px;
        padding-left: 40px;
        margin-bottom: 30px;
    }

    .service_title {
        height: 69px;
        width: 187px;
        font-size: 25px;
        line-height: 33px;
    }

    .service_list_buttons {
        width: 252px;
        height: 80px;
    }

    .service_item {
        width: 121px;
        height: 35px;
        font-size: 15px;
    }

    .services_list {
        display: block;
        max-width: 550px;
        height: 2870px;
    }

    .service_img {
        width: 280px;
        background-repeat: round;
    }

    .description {
        width: 280px;
        align-items: center;
        margin-bottom: 45px;
    }

    .description-title {
        margin: 7px 0px;
    }

    .description-text {
        width: 201px;
    }

    #Price {
        max-width: 699px;
        height: 512px;
    }

    .prices_container {
        flex-direction: column;
        max-width: 699px;
        height: 512px;
        padding-top: 0px;
        justify-content: space-evenly;
        align-items: center;
    }

    .prices_content {
        width: 224px;        
        height: 300px;
        align-items: center;

    }

    .prices_title {
        width: 90px;
        height: 27px;
        font-size: 25px;
        line-height: 31px;
    }

    .prices_menu {
        width: 224px;
        height: 235px;
    }

    .price_basic {    
        width: 180px;
    } 

    .text_prices_basics {
        font-size: 15px;
        padding-left: 30px;
    }

    .icon_prices {
        padding-right: 30px;
    }

    .help_container {
        align-items: center;
    }

    .title_help {
        width: 230px;
        height: 77px;
        font-size: 20px;
        line-height: 30px;
        text-align: center;
    }

    .title_help span {
        color: #499A18;
    }

    .help_btn {
        width: 121px;
        height: 35px;
        font-size: 15px;
    }

    .help_img {
        display: none;
    }

    .price_basic_hidden, 
    .price_standard_hidden, 
    .price_pro_hidden {
        width: 180px;
    }

    .title_prices_hidden {
        font-size: 15px;
        padding-left: 30px;
    }

    #icon_hidden, 
    #icon-standard-hidden, 
    #icon-care-hidden {
        padding-right: 30px;
    }

    .border_hidden {
        width: 120px;
    }

    .text_prices_hidden {
        width: 130px;
        padding-left: 30px;
    }

    .text_cost_hidden {
        padding-left: 30px;
    }

    #Contacts {
        max-width: 699px;
        flex-direction: column-reverse;
        height: 445px;
        padding-left: 40px;
        padding-right: 40px;
        align-items: center;
    }

    .contant_img {
        width: 100px;
        height: 125px;
    }

    .contact_container {
        flex-direction: column;
        width: 300px;
        align-items: center;
    }

    .contact_title {
        height: 32px;
        font-size: 25px;
        text-align: center;
        margin: 0;
    }

    .contact_form {
        width: 300px;
        margin-top: 70px;
    }

    .contacts_form_hid {
        width: 300px;
        position: absolute;
    }

    .contacts_form_text {
        width: 230px;
    }

    .contacts_address {
        position: absolute;
        width: 282px;
    }

    .container_address_text {
        width: 210px;
    }

    .address_text {
        line-height: 20px;
    }

    .button_address {
        margin-left: 80px;
    }

    .footer {
        max-width: 699px;
        min-width: 0px;
        flex-direction: column;
    }

    .footer_date p {
        margin: 10px 0px;
    }

    .footer_list_media {
        padding-left: 0;
        margin: 10px 0px;
    }

    .navbar_burger_close:hover,
    .navbar_burger:hover {
        cursor: pointer;
    }
}

.hidden {
    display: none;
}

.opacity {
    opacity: 0;
}