/* Extra small devices (portrait phones, less than 576px) */

@media (max-width: 575.98px) {
    .flex-horizontal {
        flex-direction: column;
    }
    .sticky-search-container {
        padding-top: 20px;
    }
}


/* Small devices (landscape phones, less than 768px) */

@media (max-width: 767.98px) {
    .sticky-search-container {
        padding-top: 20px;
    }
    .page404des {
        font-size: 1em;
    }
    .flex-horizontal {
        flex-direction: column;
    }
    .website-content {
        min-height: 90vh !important;
    }
    .uilist {
        flex-direction: column;
        margin: auto;
    }
    .uilist {
        align-items: flex-start;
        margin-bottom: 10px;
    }
    #nav-image {
        display: block;
        margin-left: 10px;
        margin-right: 20px;
    }
    .website-title {
        margin-bottom: 0px !important;
    }
    .overlay {
        z-index: 5000;
    }
    .header-box {
        height: auto;
    }
    .heading-title {
        font-size: 20px;
    }
    .header-nav {
        display: none;
    }
    .header-container {
        height: 100%;
        width: 100%;
    }
    .logo {
        width: 100%;
        align-items: center;
    }
    .clear-fix {
        margin-top: 20px;
    }
    .card {
        margin-bottom: 16px;
    }
    .listing-item,
    .listing-description,
    .agent-profile,
    .review-item {
        flex-direction: column;
    }
    .listing-header,
    .listing-content,
    .listing-description p,
    .listing-detail,
    .agent-profile>img {
        width: 100%;
    }
    .nav-item>a {
        font-size: 10px;
    }
    .agent-profile>img {
        height: auto;
        margin-bottom: 10px;
    }
    .agent-contact {
        margin-top: 30px;
    }
    .agent-transactions {
        width: 100%;
    }
    .introduction>p {
        font-size: 14px;
        margin: 0px 0px 0px 10px;
    }
    .project-item {
        margin: 0px;
    }
    .reivew-info {
        margin-top: 20px;
    }
    .agent-image,
    .agent-info>h3 {
        display: none;
    }
    .agent-info {
        padding-left: 0px !important;
    }
    .contact-link {
        margin-top: 20px;
    }
    .agent-info ul {
        padding: 0px 0px 0px 10px;
        margin: 0px;
    }
    .saybtn {
        font-size: 14px;
        margin-top: 3em;
    }
    .title {
        margin: 5px 0px 0px 5px;
    }
    .project-title,
    .title {
        font-size: 16px;
    }
    .review-item,
    .award-item {
        margin-left: 5px;
    }
    .award-category,
    .agent-description {
        font-size: 0.9em;
    }
    .btn-propworth,
    .training-name {
        font-size: 0.8em;
    }
    /*==== Image slider ======*/
    .image-slider img {
        width: 100%;
        height: auto;
    }
    .review-date,
    .show-more>a,
    .award-date {
        font-size: 0.8em;
    }
    .reivew-type {
        font-size: 0.9em;
    }
    /*======event=======*/
    .btn_register {
        margin-left: 0 !important;
        margin-top: 10px;
    }
    .event-info h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        font-weight: 300;
    }
    .event_share_container,
    .event-info {
        padding: 10px 10px 10px 10px;
    }
    /*====== Project Detail ========*/
    .default-slider {
        transform: none;
    }
    .project-item {
        width: 100%;
    }
    .floor-plan-item,
    .stack-item,
    .floor-plan-subitem {
        width: 100%;
        padding-right: 0px;
    }
    .floor-plan-subitem img {
        height: 100px;
    }
    .demo-gallery>ul>li {
        width: 100% !important;
        border: none !important;
        margin: 0px !important;
        height: auto;
    }
    /*========== Listing Detail ============*/
    .viewdetail {
        margin-right: 0 !important;
        font-size: 0.8em;
    }
    .listinglist li {
        width: 50%;
    }
    .listing-item {
        height: auto;
    }
    .listing-header {
        max-height: none !;
        height: auto;
    }
    .video-item {
        width: 100%;
        margin-bottom: 0px 0px 10px 0px;
    }
    .price-type {
        margin-left: 0px;
    }
    .contact-era {
        display: block;
    }
    #wechatqrcode>canvas {
        width: 130px;
        height: 130px;
    }
    .share_ul {
        display: flex;
        flex-direction: row;
        align-items: center;
        margin-left: 0px !important;
        margin: auto;
    }
    .btn_contact {
        margin-left: auto;
        margin-right: 10px;
    }
    .project-detail .share_container .share_ul {
        display: none;
    }
    .contact-era .share_container {
        align-items: center;
        justify-content: center;
    }
    .facebook {
        background: #07417b;
        padding: 5px 13px 5px 13px;
    }
    .instagram {
        background: #563c7c;
        padding: 5px 10px 5px 10px;
    }
    .linkedin {
        background: #2089bd;
        padding: 5px 10px 5px 10px;
    }
    .whatsapp {
        background: #26d366;
        padding: 5px 10px 5px 10px;
    }
    .footer_container {
        padding: 30px 0px;
    }
    .white-content {
        background: #ffffff;
        padding-bottom: 4.5em;
    }
    #googleMap {
        height: 250px;
    }
    .progress-img {
        position: absolute;
        left: 40%;
        bottom: 15%;
        width: 80px !important;
        height: 80px !important;
    }
}


/* Medium devices (tablets, less than 992px) */

@media (min-width: 768px) and (max-width: 991.98px) {
    .sticky-search-container {
        padding-top: 32px;
    }
    .flex-horizontal {
        align-items: center;
    }
    .image-slider img {
        width: 100%;
        height: auto;
    }
    .project-item {
        width: 50%;
    }
    .col-lg-9 {
        flex: none !important;
        max-width: 100%;
    }
    .project-item {
        width: 100% !important;
    }
    .contact-era {
        display: block;
    }
    .contact-era {
        display: none !important;
    }
    .card {
        margin-bottom: 16px;
    }
    .listing-content {
        width: 65% !important;
    }
}


/* Large devices (desktops, less than 1200px) */

@media (min-width: 992px) and (max-width: 1199.98px) {
    .sticky-search-container {
        padding-top: 32px;
    }
    .flex-horizontal {
        align-items: center;
    }
    .image-slider img {
        width: 100%;
        height: auto;
    }
    .project-item {
        width: 100%;
    }
    .col-lg-9 {
        flex: none !important;
        max-width: 100%;
    }
    .contact-footer {
        display: block;
    }
    .contact-era {
        display: none !important;
    }
    .project-detail .share_container .share_ul {
        display: flex;
    }
}

@media(min-width: 1199.98px) {
    .sticky-search-container {
        padding-top: 32px;
    }
    .contact-era {
        display: none !important;
    }
}