@media(max-width: 1024px) {

    .hero_form_row button{
        width: 100%;
        }
    .grid2_wrapper {
        grid-template-columns: repeat(4, 1fr);
    }
    
}

@media(max-width: 1199px){
    .hero_form_row button{
        width: 100%;
        }
    .hero_form_row{
        justify-content: center;
    }
    .hero_form_row > div{
        width: calc(50% - 13px);
    }
}

@media(max-width: 991px){

    .hero_form_row button{
        width: 100%;
        }
    /* nav */
    .wrap_nav{
        height: 67px;
    }
    #offcanvas{
        background: var(--royal_blue);
    }
    .nav_collapse_ul,
    .nav_collapse_ul li,
    .nav_collapse_ul li a{
        width: 100%;
        text-align: center;
    }
    .nav_collapse_ul li{
        margin-bottom: 8px;
    }
    .nav_collapse_ul li:last-child{
        order: -1;
        margin-bottom: 15px;
    }

    /* filter */
    .wrap_filter_box{
        background: var(--bs-white);
        padding-top: 1.5rem;
        padding-bottom: 2rem;
        position: fixed;
        top: 50%;
        left: 0;
        transform: translateY(-50%) translateX(-100%);
        max-width: 576px;
        width: 100%;
        box-shadow: 0 8px 16px #7f7f7f31;
        z-index: 2;
        -webkit-transform: translateY(-50%) translateX(-100%);
        -moz-transform: translateY(-50%) translateX(-100%);
        -ms-transform: translateY(-50%) translateX(-100%);
        -o-transform: translateY(-50%) translateX(-100%);
        transition: var(--transition_3s);
        -webkit-transition: var(--transition_3s);
        -moz-transition: var(--transition_3s);
        -ms-transition: var(--transition_3s);
        -o-transition: var(--transition_3s);
    }
    .wrap_filter_box.active{
        transform: translateY(-50%) translateX(0);
        -webkit-transform: translateY(-50%) translateX(0);
        -moz-transform: translateY(-50%) translateX(0);
        -ms-transform: translateY(-50%) translateX(0);
        -o-transform: translateY(-50%) translateX(0);
    }
    .filter_box{
        box-shadow: none;
    }

    /* other */
    .work_grid {
        grid-gap: 40px;
        grid-template-columns: repeat(2, 1fr);
    }

    .slider_wrapper {
        padding: 0 25px;
    }

    .swiper_navigation .swiper-button-next {
        right: -10px !important;
    }
    .swiper_navigation .swiper-button-prev {
        left: -10px !important;
    }

    .left_img {
        width: 20%;
    }
    
    .left_img > img.review_before_icon {
        width: 40px;
        bottom: -5%;
    }
}

@media(max-width: 767px){
    .hero_form_row button{
        width: 100%;
        }
    /* filter */
    .result_box .content{
        width: 100%;
        padding-bottom: 1.5rem;
    }

    /* other */
    .grid2_wrapper {
        grid-template-columns: repeat(3, 1fr);
    }
    .slider_wrapper {
        padding: 0;
    }

    .swiper_navigation .swiper-button-next {
        right: -5px !important;
    }
    .swiper_navigation .swiper-button-prev {
        left: -5px !important;
    }

    .client_slider {
        flex-direction: column;
    }
    .left_img {
        margin-bottom: 40px;
        width: 50%;
        max-width: 200px;
        margin-right: auto;
    }
    .left_img > img.review_before_icon {
        width: 60px;
        bottom: -5%;
    }

    /* about-us */
    .about_sec_2::after{
        display: none;
    }
    
}

@media(max-width: 576px){
    .hero_form_row button{
        width: 100%;
        }
    /* nav */
    .site_logo img {
        max-width: 130px;
    }

    /* banner */
    .site_banner{
        position: relative;
        height: auto;
        max-height: unset;
        padding-top: 30px;
        padding-bottom: 30px;
    }
    .hero_form{
        position: relative;
        padding: 1.5rem 2rem;
        background: transparent;
    }
    .hero_form{
        padding: 1.5rem 1.5rem;
    }
    .hero_form_row > div{
        width: 100%;
    }

    /* filter */
    .result_box .content .flexbox{
        flex-direction: column;
    }

    /* other */
    .work_grid {
        grid-template-columns: repeat(1, 1fr);
    }
    .work_grid .item {
        text-align: center;
    }
    .work_grid .item h5 br {
        display: none;
    }
    .grid2_wrapper {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media(max-width: 480px) {

    .hero_form_row button{
        width: 100%;
        }
    /* filter */
    .wrap_result_boxes .result_box {
        padding: 1.2rem 1.5rem;
    }
    .result_box .content .flexbox > div:first-child{
        margin-bottom: .5rem;
    }
    .result_action a{
        font-size: 12px !important;
    }
    .result_action .btn_royal_blue,
    .result_action .btn_royal_blue_link2 {
        padding: 8px 20px;
    }
    .filter_pagination button {
        margin-top: 4px;
        font-size: 12px;
        width: 25px;
        height: 25px;
    }
}