﻿
@media only screen and (max-width: 480px) {
    .admin-login-container .admin-login-form {
        justify-content: unset;
        padding: 15px;
    }

    .main-header-02 {
        min-width: unset;
        padding: 0;
    }

    .hiring-container-layout,
    .hiring-layout .hiring-container,
    .we-offer-div-layout .we-offer-container {
        width: 100%;
    }

    .hiring-form-container,
    .hiring-layout .hiring-container {
        padding: 15px;
    }
    .main-menu-mobile .mobile-btn-menu {
        padding: 5px 0;
    }

    .project-inquiry {
        padding: 15px;
    }

    .we-offer-div-layout .follow-step-layout {
        padding: 15px;
    }

    .we-offer-container .content-span {
        padding: 15px;
        text-align: justify;
    }
    .we-offer-div-layout .we-offer-card-layout {
        padding: 15px;
    }
    .follow-step-header small {
        text-align: justify;
    }

    .news-container-layout .news-card-layout {
        width: 100%;
    }

    .news-container-layout {
        padding: 15px;
        margin-top: 0;
    }

    .main-container {
        gap: 0;
    }

    .tabset{
        margin-top: 10px;
        padding: 0 15px;
    }

    .tabset .hiring-form-container {
        padding: 0;
    }

    .save-hiring-button {
        width: 100%;
    }

    .we-offer-container .title-h3{
        padding: 0 5px;
    }

    .user-profile-names h2 span {
        font-size: 20px;
    }
    .moa-file-preview-container {
        display: flex;
        justify-content: center;
        width: 100%;
    }
  
}

@media only screen and (min-width: 481px) {
    .user-identity-container {
        top: -80px;
    }
    .user-profile-container .tabset {
        margin-top: 70px;
    }
}

@media only screen and (max-width: 767px) {
    .real-estate-content .real-estate-row {
        flex-direction: column;
        padding: 0 15px;
        display: flex;
    }
    .individual-listing-content .individual-listings-img-cont {
        width: 100%;
        flex-direction: column;
        display: flex;
    }

    .admin-login-container {
        padding-left: 10px;
        padding-right: 10px;
    }

}



/*layout2 media query*/
@media only screen and (min-width: 768px) {
    .main-listings-layout .top-listings-container {
        grid-template-rows: auto 1fr;
    }

    /* .top-listings-container .top-listings-project-infos {
        grid-template-rows: 65px 35px auto auto 55px;
    }*/

    .top-listings-image-thumbnail {
        height: 85px;
    }

        .top-listings-image-thumbnail span svg {
            height: 15px;
        }

    .top-listings-container .top-listings-project-infos {
        margin-top: 35px;
    }

    .top-listings-image-thumbnail .images-thumbnail-container {
        grid-template-columns: 100px 100px 100px 100px 100px;
        justify-content: center;
    }

    .top-listings-container .top-listings-project-infos {
        gap: 10px;
    }

    .top-listings-image-container img {
        height: 530px;
    }

    .thumbnail-image-project img {
        height: 100%;
        width: 100%;
    }


    .main-listings-layout .top-listings-container {
        width: 100%;
    }

    .project-icon-infos .project-icon-layout {
        grid-template-columns: 1fr 1fr;
    }

    .top-listings-project-infos .project-icon-infos {
        grid-template-columns: 350px 350px;
        justify-content: center;
    }

    .project-gallery .row {
        height: 550px;
    }

        .project-gallery .row .left-col {
            width: 61.5%;
        }

        .project-gallery .row .right-col {
            display: flex;
            width: 50%;
        }

        .project-gallery .row .total-photos {
            display: none;
        }

    .gallery-modal-content img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .construction-card {
        width: 500px;
    }

    .project-inquiry {
        width: 500px;
    }

    .we-offer-div-layout .we-offer-container {
        width: 1200px;
    }

    .we-offer-div-layout .we-offer-card-layout {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .hiring-container-layout {
        width: 1200px;
    }

    .input-form-layout .input-container-layout {
        /*flex-direction: row;*/
    }

    .single-input {
        width: 595px !important;
    }

    .real-estate-container {
        grid-template-rows: 85px 1fr;
        justify-content: center;
    }

        .real-estate-container .real-estate-header {
            height: 85px;
        }

    .real-estate-header .real-estate-search-container {
        flex-direction: row;
    }

    .real-estate-content .real-estate-row {
        flex-direction: row;
        align-items: center;
    }

    .real-estate-row .real-estate-col {
        flex-direction: row;
    }

    .real-estate-search-container .real-estate-dropdown {
        grid-template-columns: 210px 55px;
    }

    .real-estate-search-container .real-estate-dropdown:first-child {
        grid-template-columns: 265px!important;
    }

    .real-estate-search-container .real-estate-dropdown:nth-last-child(-n+2) {
            grid-template-columns: 265px !important;
     }

    .individual-listings-container {
        grid-template-rows: 85px 1fr;
        justify-content: center;
    }

        .individual-listings-container .individual-listings-header {
            width: 1200px;
            justify-content: space-between;
        }

    .individual-listing-content .individual-listings-img-cont {
        width: 1200px;
        background-color: #DCDCDC;
    }

    .individual-listings-img-cont .individual-listings-slider {
        /*width: 250px;
        height: 250px;*/
    }

}

@media only screen and (max-width: 767px) {
    .main-listings-layout .top-listings-container {
        grid-template-rows: 1fr auto;
    }


    /* .top-listings-container .top-listings-project-infos {
        grid-template-rows: 65px 35px auto auto 55px;
    }*/

    .we-offer-div-layout .follow-step-layout {
        padding: 20px;
    }

    .top-listings-image-thumbnail {
        height: 85px;
    }

        .top-listings-image-thumbnail span svg {
            height: 25px;
        }

   /* .we-offer-div-layout .we-offer-container {
        width: 450px;
    }*/

    .we-offer-div-layout .we-offer-card-layout {
        grid-template-rows: 1fr 1fr 1fr;
    }

    .top-listings-image-thumbnail .images-thumbnail-container {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    }

    .top-listings-image-container img {
        height: 100%;
        width: 100%;
    }

    .thumbnail-image-project img {
        height: 100%;
        width: 100%;
    }

    .individual-listings-slider img{
        width:100%!important;
    }


    .main-listings-layout .top-listings-container {
        /*  width: 460px;*/
    }

    .top-listings-project-infos .project-icon-infos {
        grid-template-columns: 1fr 1fr;
    }

    .project-gallery .row {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

        .project-gallery .row .left-col {
            width: 100%;
            height: 250px;
            margin-bottom: 15px;
        }

        .project-gallery .row .total-photos {
            display: inline-block;
        }

        .project-gallery .row .right-col {
            display: none;
        }


    .gallery-modal-content img {
        width: 500px;
    }

    .construction-card {
        width: 385px;
    }

    .project-inquiry {
        width: 100%;
    }

   /* .hiring-container-layout {
        width: 450px;
    }*/

    .input-form-layout .input-container-layout {
        flex-direction: column;
    }

    .single-input {
        width: 100% !important;
    }

    .real-estate-container {
        grid-template-rows: auto 1fr;
    }

        .real-estate-container .real-estate-header {
            height: auto;
            padding: 10px;
        }

    .real-estate-header .real-estate-search-container {
        flex-direction: column;
        padding: 15px;
        border: none !important;
        box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.3);
    }

    .real-estate-content .real-estate-row {
        flex-direction: column;
        padding: 0 15px;
    }

    .real-estate-row .real-estate-col {
        flex-direction: column;
    }

    .real-estate-search-container .real-estate-dropdown {
        grid-template-columns: 1fr 55px;
        border: 1px solid #DCDCDC !important;
        border-left: none !important;
    }

    .real-estate-search-container .searchLocation {
        border: 1px solid #DCDCDC !important;
    }

    .real-estate-container .search-realestate {
        height: 45px;
        justify-content: center;
        margin-top: 15px;
    }

    .individual-listings-container {
        grid-template-rows: auto 1fr;
        justify-content: unset!important;
    }

    .project-details-item {
        box-shadow: none !important
    }

    .individual-listings-container .individual-listings-header {
        width: 100%;
        flex-direction: column;
        gap: 10px;
        padding: 15px;
    }

    .individual-listing-content .individual-listings-img-cont {
        width: 100%;
        flex-direction: column;
        display: flex;
    }

    .pin-right-design {
        right: 4% !important;
    }

        .pin-right-design svg {
            height: 15px !important;
        }

    .individual-listings-img-cont .individual-listings-slider {
        width: 100%;
        height: 100%;
        padding: 0 20px !important;
    }

    .individual-listings-slider img:first-child {
        padding-top: 15px !important;
    }

   /* .project-img-title{
        bottom:10%!important;
    }*/

    .project-details-item .project-details-header {
        margin: 0 10px !important;
    }

    .virtuallink-span {
        background-color: transparent !important;
    }

    .no-data-available {
        background-color: transparent !important;
    }

    .real-estate-dropdown input{
        border-right: 1px solid #DCDCDC!important;
    }

    .real-estate-search-container .real-estate-dropdown:first-child {
        grid-template-columns: 1fr !important;
    }

    .real-estate-search-container .real-estate-dropdown:nth-last-child(-n+2) {
        grid-template-columns: 1fr !important;
    }

    .real-estate-dropdown input:last-child {
        border-right: none!important;
     }

     .real-estate-dropdown input:first-child {
            border-right: none !important;
     }

    .privacy-terms-wrapper{
        justify-content:unset;
        padding: 10px 15px;
    }


    .privacy-terms-container {
        width: 100% !important;
    }


    .inquiry-v2-container {
        padding: 15px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {

    .project-gallery .row {
        height: auto;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .we-offer-div-layout .we-offer-container {
        width: 700px;
        grid-template-rows: auto auto auto auto;
    }

    /* .we-offer-div-layout .we-offer-card-layout {
        grid-template-rows: 1fr 1fr 1fr;
    }*/

    .project-gallery .row .right-col {
        width: 100%;
        height: 200px;
        margin: 0;
    }

    .project-gallery .row .left-col {
        width: 100%;
        height: 400px;
        margin-bottom: 5px;
    }

    .project-gallery .row .right-col .thumb-col {
        width: 33.33% !important;
        height: 100% !important;
    }

    .gallery-modal-content img {
        width: 500px;
        height: 500px;
    }

    .construction-card {
        width: 500px;
    }

    .project-inquiry {
        width: 500px;
    }

    .hiring-container-layout {
        width: 100%;
        padding: 0 35px;
    }

    .input-form-layout .input-container-layout {
        flex-direction: row;
    }

    .single-input {
        width: 100% !important;
    }

    .real-estate-container {
        grid-template-rows: auto 1fr;
        justify-content: unset !important;
        margin-top: -35px;
    }

        .real-estate-container .real-estate-header {
            height: auto;
            padding: 0 15px;
        }

    .real-estate-header .real-estate-search-container {
        flex-direction: column;
        padding: 15px;
        border: none !important;
        box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.3);
    }

    .real-estate-content .real-estate-row {
        flex-direction: column !important;
        padding: 0 15px;
    }

    .real-estate-row .real-estate-col {
        flex-direction: row;
    }

    .real-estate-search-container .real-estate-dropdown {
        grid-template-columns: 1fr 55px;
        border: 1px solid #DCDCDC !important;
        border-left: none !important;
    }

    .real-estate-search-container .searchLocation {
        border: 1px solid #DCDCDC !important;
    }

    .real-estate-container .search-realestate {
        height: 45px;
        justify-content: center;
        margin-top: 15px;
    }

    .individual-listings-container {
        grid-template-rows: 85px 1fr;
        justify-content: unset!important;
        padding: 0 5px;
    }

            .individual-listings-container .individual-listings-header {
            width: 100%;
            justify-content: space-between;
            padding: 0 15px;
        }

    .individual-listing-content .individual-listings-img-cont {
        width: 100%;
    }

    .individual-listings-img-cont .individual-listings-slider {
        width: 185px;
        height: 185px;
    }

  /*  .project-img-title {
        bottom: 15% !important;
        width:180px!important;
        padding:0 15px;
    }*/

    .individual-listings-slider > .date-added-wrapper {
       width:180px!important;
    }
        .real-estate-dropdown input {
        border-right: 1px solid #DCDCDC !important;
    }

    .real-estate-search-container .real-estate-dropdown:first-child {
        grid-template-columns: 1fr !important;
    }

    .real-estate-search-container .real-estate-dropdown:nth-last-child(-n+2) {
        grid-template-columns: 1fr !important;
    }

    .real-estate-dropdown input:last-child {
        border-right: none !important;
    }

    .real-estate-dropdown input:first-child {
        border-right: none !important;
    }

    .privacy-terms-wrapper {
        justify-content: unset;
        padding: 10px 15px;
    }


    .privacy-terms-container {
        width: 100% !important;
    }
}

