@media only screen and (max-width:850px) {
    .header_section .navbar {
        width: 95%;
    }

    .navbar .nav_inner .nav_right .side_menu_btn_container {
        display: none;
    }

    .about_us_section .about_us_container {
        flex-direction: column;
    }

    .footer_section .footer_container .app_link-container .link-row {
        flex-direction: column;
        text-align: center;
    }

    .hero_container .img_container .hero_img {
        max-width: 560px;
    }

    .hero_container .hero-content {
        top: 25%;
    }

    .appointment_section .appintment_container {
        width: 95%;
    }

    .appointment_section .appintment_container .bottom {
        padding: 10px;
    }

    .footer_section .footer_container {
        width: 95%;
        flex-direction: column;
    }

    .footer_section .footer_container .col {
        width: 100%;
    }

    .app_link-container {
        display: flex;
        gap: 10px;
    }
}

@media only screen and (max-width:690px) {
    .nav_hamburger_container {
        display: flex;
        justify-content: center;
        align-items: center;
        background: var(--theme-color);
        height: 50px;
        width: 50px;
        color: var(--light-color);
    }

    .navbar .nav_inner .nav_right {
        position: fixed;
        visibility: hidden;
        top: 0;
        left: 0;
        width: 0;
        padding: 0 50px;
        opacity: 0;
        transition: all 0.5s linear;
        flex-direction: column;
        height: 100vh;
        background: var(--background-color);
        z-index: 1000;
    }

    .navbar.open .nav_inner .nav_right {
        visibility: visible;
        width: 300px;
        opacity: 1;
    }

    .navbar .nav_inner .nav_right .nav_list {
        flex-direction: column;
        width: 100%;
    }

    .nav_close_btn_container {
        display: block;
        position: absolute;
        top: 20px;
        padding: 10px 15px;
        border-radius: 50%;
        border: 1px solid var(--secondary-color);
        right: 20px;
    }

    .nav_close_btn_container i {
        color: var(--secondary-color);

    }

    .nav_hamburger_container {
        padding: 10px 15px;
        border-radius: 50%;
    }

    .nav_hamburger_container i {
        color: var(--secondary-color);
        font-size: 1.2em;
    }

    .navbar .logo_container {
        justify-content: start;
    }

    .appointment_section .appintment_container .bottom form {
        flex-direction: column;
    }

    .before_after_section {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .before_after_container {
        margin: 15px 0;
        flex-direction: column;
        width: 95%;
    }

    .before_after_container .col {
        width: 100%;
    }

    .newsletter_section .newsletter_container {
        width: 90%;
        flex-direction: column;
    }

    .newsletter_section .newsletter_container .col .title_container h1 {
        text-align: center;
    }

    .newsletter_section .newsletter_container .col {
        width: 100%;
    }

    .testimonial_container {
        width: 95%;
    }

    .contact_container .content {
        flex-direction: column;
    }

    .contact_container .col:nth-child(1) {
        width: 100%;
    }

    .contact_container .col .call_container {
        padding: 30px 10px;
    }

    .copyright_container {
        flex-direction: column;
        gap: 10px;

    }

    .copyright_container .right,
    .copyright_container .left {
        width: 100%;
        text-align: center;
    }

    .hero_container .video-container {
        top: auto;
        bottom: 20%;
        z-index: 10;
    }

    .slogan_section::after {
        top: -20%;
    }

    .hero_container .video-container {
        bottom: 0;
    }

    .navbar .nav_inner .nav_right .nav_list li a {
        transition: none;
    }

    .navbar .back_overlay {
        background: rgba(0, 0, 0, 0.527);
        height: 100vh;
        width: 100%;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 500;
        display: none;
    }

    .navbar.open .back_overlay {

        display: flex;
    }

}