.single-project {
    /* Breadcrumbs */
    .breadcrumbs span {
        color: var(--secondary-text, #333);
        font-weight: 400;
        font-size: 12px;
    }
    .breadcrumbs span a {
        color: var(--neutral-2, #A5ADB5);
    }
    .breadcrumbs span:not(:last-child):after {
        content: "/";
        padding: 0 8px;
        color: var(--neutral-2, #A5ADB5);
    }
    .breadcrumbs .breadcrumbs-wrapper {
        max-width: 40%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    @media only screen and (max-width: 768px) {
        .breadcrumbs .breadcrumbs-wrapper {
            max-width: 100%;
        }
    }

    .banner {
        min-height: 300px;
    }

    .sticky-footer, .relative-footer {
        display: none !important;
    }

    .project-desc .section-content {
        color: #222b45;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100% !important;
        margin-top: 40px;
        padding: 0 50px 30px 50px;
    }

    .project-desc-logo img {
        width: 220px;
        max-width: none !important;
    }

    .project-desc-video {
        min-width: 320px;
        padding-bottom: 4px;
    }

    .project-desc-video iframe {
        width: 100%;
        height: 100%;
        min-height: 230px;
        border: none;
    }

    .project-desc-text .section-title,
    .project-desc-text .section-title span {
        border-bottom: none;
        font-size: 24px;
        margin-bottom: 8px;
    }

    .project-desc-text p,
    .project-desc-text span>a {
        color: #222b45;
        line-height: 2;
    }

    .project-desc-text span>a {
        font-weight: bold;
    }

    .project-desc-text .description {
        margin-bottom: 0;
        text-align: justify;
        font-size: 16px;
        line-height: 24px;
        color: #525A80;
    }

    .project-desc-text .description.less {
        position: relative;
        margin-bottom: 8px;
        height: 141px;
        overflow-y: hidden;
        color: #525A80;
    }

    .project-desc-text .description.less::after {
        content: "....";
        position: absolute;
        right: 0;
        bottom: -5px;
        letter-spacing: 1px;
        z-index: 1;
        background-color: #ffffff;
    }

    .project-desc-text .description.more {
        margin-bottom: 8px;
        height: auto;
        overflow-y: none;
        border: none;
    }

    .project-desc-text .show-more,
    .project-desc-text .show-less {
        color: var(--primary-bg);
        font-weight: 600;
        line-height: 24px;
    }

    .project-desc-text .show-less {
        display: none;
    }

    .d-project-detail-banner {
        display: block;
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        background-color: #d6d6d647 !important;
    }

    .m-project-detail-banner {
        display: none;
    }

    @media screen and (min-width: 1920px) {
        .project-desc .section-content {
            padding: 12px;
        }

        .project-desc-text {
            font-size: 16px;
        }

        .project-desc-text .section-title,
        .project-desc-text .section-title span {
            color: #3C4268;
            border-bottom: none;
            font-size: 24px;
            line-height: 32px;
            margin-bottom: 8px;
        }

        .project-desc-text p,
        .project-desc-text span>a {
            color: #222b45;
            line-height: 2;
        }

        .project-desc-video {
            min-width: 460px !important;
        }

        .project-desc-video iframe {
            width: 100%;
            height: 100%;
            min-height: 300px;
        }
    }

    @media screen and (max-width: 1024px) {
        .project-desc .section-content {
            padding: 12px;
        }

        .project-desc-text {
            padding: 0 24px;
            font-size: 14px;
        }

        .project-desc-video {
            min-width: 230px !important;
        }

        .project-desc-video iframe {
            width: 100%;
            height: 100%;
            min-height: 160px;
        }
    }

    @media screen and (max-width: 768px) {
        .project-desc .section-content {
            padding: 0 0 30px 0;
            flex-direction: column;
        }

        .project-desc-logo {
            order: 1;
        }

        .project-desc-logo img {
            width: 50% !important;
        }

        .project-desc-text {
            padding: 0;
            order: 3;
        }

        .project-desc-video {
            width: 100%;
            order: 2;
            padding-bottom: 20px;
        }
    }

    @media screen and (max-width: 425px) {
        .m-project-detail-banner {
            display: block;
            width: 100%;
            height: 300px;
            background-repeat: no-repeat;
            background-size: contain;
            background-position: center;
            background-color: #d6d6d647 !important;
        }

        .d-project-detail-banner {
            display: none;
        }
    }


    .projdetail-whole-page-wrapper .banner {
        background-position: center center;
        background-size: contain;
        min-height: 100%;
        height: 100%;
        padding-bottom: 19%;
    }

    .projdetail-whole-page-wrapper h2 {
        font-size: 24px;
        line-height: 32px;
        text-align: center;
        margin-bottom: 30px;
        color: #333333;
    }

    .projdetail-whole-page-wrapper .line {
        max-width: 100%;
        width: 100%;
        border-top: 1px solid #DCDDE5;
        margin: 1.5em -15px;
    }

    .project-header-info .section-des {
        flex: 1;

        display: -ms-flexbox;
        display: flex;
        align-content: center;
        align-items: center;
    }

    .project-header-info .section-des .col-1 {
        position: relative;
    }

    .project-header-info .section-des .col-1::after {
        content: "";
        position: absolute;
        height: 100%;
        right: -15px;
        top: 0;
        bottom: 0;
        border-right: 1px solid #DCDDE5;
    }

    .project-header-info .section-des .col-2 {
        padding-left: 30px;
    }

    .project-header-info .section-des h1 {
        font-weight: 600;
        font-size: 32px;
        line-height: 43px;
        color: #3C4268;
        margin-bottom: 0;
    }

    .project-header-info .section-des .section-location {
        font-weight: 500;
        font-size: 14px;
        line-height: 21px;
        color: #989BB3;
    }

    .project-header-info .section-btn {
        width: 100%;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-flow: row wrap;
        flex-flow: row wrap;
        justify-content: space-between;
        align-items: center;
    }

    .project-header-info .category-project .category-project__btn-deals,
    .project-header-info .category-project .category-project__btn-hot,
    .project-header-info .category-project .category-project__btn-popular,
    .project-header-info .category-project .category-project__btn-collections {
        font-weight: 600;
        font-size: 14px;
        color: #fff;
        margin: 0 0;
        padding: 6px 17px;
        box-shadow: 0px 0px 2px rgba(40, 41, 61, 0.04), 0px 4px 8px rgba(96, 97, 112, 0.16);
        border-radius: 100px;
    }

    .project-header-info .category-project .category-project__btn-deals {
        background: linear-gradient(90deg, #FEB531 0%, #FFDB74 36.09%, #FFC734 52.03%, #FDB42D 97.84%);
    }

    .project-header-info .category-project .category-project__btn-hot {
        background: linear-gradient(90deg, #1757D7 -7.43%, #98BAFC 109.46%);
    }

    .project-header-info .category-project .category-project__btn-popular {
        background: linear-gradient(90deg, #844BE3 -7.43%, #BA92FE 109.46%);
    }

    .project-header-info .category-project .category-project__btn-collections {
        background: linear-gradient(90deg, #2CA1DB 1.7%, #63D9FE 109.46%);
    }

    .project-header-info .category-project .category-project__btn-hot:nth-child(2) {
        display: none;
    }

    .project-header-info .section-btn .btn-tools {
        -js-display: flex;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-flow: row wrap;
        flex-flow: row wrap;
    }

    .project-header-info .section-btn .section-share {
        position: relative;
        padding-left: 10px;
    }

    .project-header-info .section-btn .section-share .section-share_btn,
    .project-header-info .section-btn .section-share .section-share_btn:hover {
        background-color: #fff;
        color: #c4c4c4;
        border: none;
        box-shadow: 0px 0px 2px rgb(40 41 61 / 4%), 0px 4px 8px rgb(96 97 112 / 16%) !important;
        margin-bottom: 0px;
    }

    .project-header-info .section-btn .heateor_sss_sharing_container.show {
        opacity: 1;
    }

    .project-header-info .section-btn .heateor_sss_sharing_container .heateor_sss_sharing_title {
        font-weight: 400 !important;
        font-size: 14px;
        line-height: 21px;
        text-align: left;
    }

    .project-header-info .section-btn .heateor_sss_sharing_container .heateorSssSharingRound i {
        width: 32px !important;
        height: 32px !important;
        margin-right: 0.8em !important;
    }

    .project-header-info .section-btn .heateor_sss_sharing_container .heateorSssSharingRound:last-of-type i {
        margin-right: 0px;
    }

    .project-header-info .price-box {
        border-left: 1px solid #DCDDE5;

    }
    .project-header-info .price-box small {
        font-size: 12px;
        line-height: 16px;
        color: #989BB3;
        display: block;
    }

    .project-header-info .price-box .price-normal {
        font-weight: 700;
        font-size: 24px;
        line-height: 32px;
        color: #333333;
        white-space: nowrap;
    }

    .project-header-info .price-box .price-disc {
        font-weight: 500;
        font-size: 14px;
        line-height: 21px;
        color: #C1C1C1;
        text-decoration-line: line-through;
        white-space: nowrap;
    }

    .project-header-info .btn-box .go-to-unit-section,
    .project-header-info .btn-box .btn-brochure-unit {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 200px;
        border-radius: 8px;
        font-weight: 600;
        font-size: 16px;
        line-height: 24px;
        text-transform: capitalize;
    }

    .project-header-info .btn-box .go-to-unit-section {
        background: var(--primary-bg);
        color: #FFFFFF;
        height: 40px;
    }

    .project-header-info .btn-box .btn-brochure-unit {
        background: #fff;
        color: var(--primary-bg);
        border: 1px solid var(--primary-bg);
        height: 40px;

    }

    .project-header-info .project-promo {
        width: 100%;
        background: color-mix(in srgb, var(--primary-bg) 6%, white);
        border-radius: 8px;
        padding: 8px;
    }

    .project-header-info .project-promo .promo-title {
        font-weight: 600;
        font-size: 14px;
        line-height: 21px;
        color: #333;
        padding-bottom: 10px;
        display: block;
    }

    .project-header-info .project-promo ul li {
        font-size: 14px;
        line-height: 21px;
        margin-left: 1rem;
        color: #525A80;
    }

    .project-header-info .project-promo ul,
    .project-header-info .project-promo ul li:last-of-type,
    .project-header-info .project-promo ul li p {
        margin-bottom: 0px;
    }

    .project-desc .row .col {
        padding: 0 0px 30px;
    }

    .project-desc .row .col:first-of-type {
        padding-right: 15px;
    }

    .project-desc .row .col:last-of-type {
        padding-left: 15px;
    }

    .project-desc .row .col hr {
        margin: 30px 0;
    }

    .section-gallery iframe,
    .section-gallery img {
        border-radius: 8px;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
        -ms-border-radius: 8px;
        -o-border-radius: 8px;
    }

    .section-gallery .side {
        display: -ms-flexbox;
        display: flex;
        gap: 12px;
        height: 160px;
    }

    .section-gallery .side figure {
        width: 50%;
    }
    .section-gallery .main img {
        height: 220px;
        object-fit: cover;
    }
    .section-gallery .side figure img {
        height: 160px;
        object-fit: cover;
        width: 100%;
        max-width: 100%;
    }

    .project__facilities,
    .project__map {
        padding-top: 0px;
    }

    .project__facilities .facility-wrap {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-flow: row wrap;
        flex-flow: row wrap;
        gap: 14px;
        align-items: stretch;
    }

    .project__facilities .facility-wrap .item {
        display: -ms-flexbox;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        background: #FFFFFF;
        border-radius: 16px;
        width: 24%;
        min-height: 160px;
        padding: 25px 25px;
        box-shadow: 0px 5px 20px -11px rgba(16, 58, 108, 0.51);
        -webkit-box-shadow: 0px 5px 20px -11px rgba(16, 58, 108, 0.51);
        -moz-box-shadow: 0px 5px 20px -11px rgba(16, 58, 108, 0.51);
        font-size: 14px;
        line-height: 21px;  
        color: var(--primary-bg);
        text-align: center;
    }
    .project__facilities .d-tablet-only.d-desktop-only .item {
        font-weight: 500;
        font-size: 14px;
        line-height: 21px;
        color: var(--secondary-text);
    }

    .project__facilities .facility-wrap .icon-img,
    .project__facilities .d-tablet-only.d-desktop-only .icon-img {
        position: relative;
        box-shadow: inset 0px 2px 8px rgb(6 55 153 / 10%);
        border-radius: 100px;
        padding: 7px 7px;
        margin-bottom: 16px;
    }

    .project__facilities .facility-wrap .icon-img img,
    .project__facilities .d-tablet-only.d-desktop-only .icon-img img  {
        height: 72px;
        /* filter: brightness(0) saturate(100%) invert(21%) sepia(64%) saturate(5394%) hue-rotate(349deg) brightness(96%) contrast(93%); */
    }
    .project__facilities .d-tablet-only.d-desktop-only .icon-img img  {
        width: 24px;
        height: 24px;
    }
    .project__facilities .facility-wrap.less {
        position: relative;
        margin-bottom: 8px;
        height: 380px;
        overflow-y: hidden;
        border-bottom: 1px solid rgba(238, 238, 238, .6);
    }

    .project__facilities .facility-wrap.more {
        margin-bottom: 8px;
        height: auto;
        overflow-y: none;
        border: none;
    }

    .project__facilities .show-more,
    .project__facilities .show-less {
        color: var(--primary-bg);
        font-weight: 600;
        line-height: 2;
        text-align: center;
        display: block;
        width: 100%;
    }

    .project__facilities .show-less {
        display: none;
    }

    @media only screen and (max-width: 1024px) {
        .project__facilities .facility-wrap.less {
            height: 284px;
        }
    }

    /* map section */
    .map-wrap {
        position: relative;
        width: 100%;
    }

    .map-wrap .map-header {
        display: flex;
        overflow-x: auto;
        min-width: 100%;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .map-wrap .map-header::-webkit-scrollbar-thumb {
        border-radius: 0px;
        background: #fff;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        -o-border-radius: 0px;
    }

    .map-wrap .map-header .map-header-col {
        min-width: 100px;
        text-align: center;
        margin: 5px;
        cursor: pointer;
    }

    .map-wrap .map-header .active .title {
        color: #046BA9;
    }

    @media only screen and (min-width: 1024px) {
        .map-wrap .map-header {
            justify-content: center;
        }

        .map-wrap .map-header .map-header-col {
            min-width: 140px;
        }
    }

    .map-wrap .map-header .title {
        font-weight: 500;
        font-size: 14px;
        line-height: 21px;
        color: #103A6C;
        padding: 6px;
    }

    .map-wrap .map-header .icon img {
        height: 32px;
        filter: invert(65%) sepia(22%) saturate(247%) hue-rotate(196deg) brightness(92%) contrast(88%);
    }

    .map-wrap .map-header .active .icon img {
        filter: invert(19%) sepia(96%) saturate(7497%) hue-rotate(192deg) brightness(100%) contrast(97%);
    }

    .map-wrap .map-body {
        margin-top: 32px;
    }

    .map-wrap .map-body .gmap iframe {
        width: 100%;
    }

    .map-body .card .card-header {
        background-color: #046BA9;
        border-radius: 8px 8px 0 0;
        padding: 16px 16px;
    }

    .map-body .card .card-header .row .col:nth-child(2) {
        padding-left: 0;
    }

    .map-body .card .card-header h3 {
        font-weight: 600;
        font-size: 20px;
        line-height: 26px;
        color: #ffffff;
        margin: 0;
    }

    .map-body .card .card-header .col.small-9 {
        padding: 0 16px;
    }

    .map-body .card .card-header .col.small-3 {
        padding: 0 0;
    }

    .map-body .card .card-header p {
        font-weight: 500;
        font-size: 14px;
        line-height: 21px;
        font-size: 14px;
        color: #ffffff;
        margin-bottom: 12px;
    }

    .map-body .card .card-header select {
        height: 40px;
        border-radius: 4px;
        border: solid 1px #c5cee0;
        margin: 0;
    }

    .map-body .card .card-body .row {
        font-weight: 500;
        font-size: 16px;
        line-height: 24px;
        color: #103A6C;
        padding: 16px 0;
        border-bottom: 1px solid #edf1f7;
        margin-left: 0px;
        margin-right: 0px;
    }

    .map-body .card .card-body .col.small-9 {
        padding: 0 0;
    }

    .project__map #gmaps {
        min-height: 400px;
    }

    /* card-whole-list */
    .project__unit-list {
        background-color: color-mix(in srgb, var(--primary-bg) 6%, white);
    }

    .project__unit-list h2 {
        font-size: 32px;
        line-height: 43px;
        text-align: left;
        margin-bottom: 20px;
        color: #333;
    }

    .project__unit-list .card-whole-list {
        margin-left: -10px;
    }

    .project__unit-list .card-whole-list .card-project-container {
        border-radius: 12px;
    }

    .card-property-image-container .slider-wrapper {
        width: 100%;
    }

    .card-property-image-container .slider-wrapper .flickity-slider .img-inner {
        height: 220px;
        position: relative;
    }

    .card-property-image-container .slider-wrapper .flickity-slider .img-inner img {
        height: 100%;
        width: 100%;
        max-width: 100%;
        object-fit: cover;
        border-top-left-radius: 12px;
        border-top-right-radius: 12px;
    }

    .card-property-image-container .flickity-page-dots {
        bottom: 8px
    }

    .card-property-image-container .flickity-page-dots .dot {
        border-radius: 50%;
        width: 12px;
        height: 12px;
    }

    .content-btn {
        display: -ms-flexbox;
        display: flex;
        padding-bottom: 12px;
    }

    .content-btn .virtual,
    .content-btn .button-see-detail {
        border-radius: 8px;
        font-weight: 600;
        font-size: 16px;
        line-height: 24px;
        width: 100%;
        display: block;
        text-align: center;
        margin-top: 0px;
        padding: 6px 10px;
        cursor: pointer;
    }

    .content-btn .virtual {
        border: 1px solid #046BA9;
        background: #fff;
        color: #046BA9;
    }

    .content-btn .button-see-detail {
        background: #046BA9;
        color: #fff;
    }

    @media screen and (max-width: 845px) {
        .map-wrap .map-header .map-header-col {
            min-width: 26.3%;
        }
    }

    @media screen and (max-width: 767px) {
        .projdetail-whole-page-wrapper .section {
            padding: 15px 0px;
        }

        .projdetail-whole-page-wrapper .section .container .row {
            margin-left: 0px;
            margin-right: 0px;
        }

        .projdetail-whole-page-wrapper .line {
            margin: 1em 0;
        }

        .projdetail-whole-page-wrapper h2 {
            text-align: left;
            font-weight: 600;
            font-size: 20px;
            line-height: 26px;
        }

        .projdetail-whole-page-wrapper .banner {
            padding-bottom: 42.7%;
        }

        .project-header-info .section-des {
            flex-direction: column;
            align-content: flex-start;
            align-items: flex-start;
        }

        .project-header-info .section-des .col-1::after {
            display: none;
        }

        .project-header-info .section-des .col-2 {
            padding-left: 0px;
            padding-top: 16px;
        }

        .project-header-info .section-btn {
            padding-bottom: 16px;
        }


        .project-header-info .btn-box {
            width: 48%;
        }

        .project-header-info .btn-box .go-to-unit-section,
        .project-header-info .btn-box .btn-brochure-unit {
            width: 100%;
            margin: 0 0;
            padding: 0 0;
            letter-spacing: 0;
        }

        .project-header-info .btn-box.brochure {
            margin-left: 10px;
        }

        .project-desc .row .col:last-of-type {
            padding-left: 0px;
        }

        .project__facilities .facility-wrap .item {
            width: 48%;
        }

        .project__map .form-control {
            font-size: 14px;
            color: #525A80;
        }

        .project__map .map-body {
            position: relative;
            margin: 0;
            padding: 0 0;
            width: 100%;
        }

        .project__map .map-body .row .col {
            padding: 0 0px 30px;
            font-size: 14px;
            line-height: 21px;
        }

        .project__map .map-body .card .card-body .row {
            padding: 10px 0;
        }

        .project__map .gm-fullscreen-control {
            position: absolute !important;
        }

        .project__unit-list .card-whole-list {
            margin-left: 5px;
        }

        .map-wrap .map-heade::-webkit-scrollbar {
            width: 0 !important;
            display: none;
        }



    }

    @media screen and (max-width: 420px) {
        .project__unit-list .card-whole-list {
            margin-left: 0px;
        }
        .project__facilities .facility-wrap.less {
            height: 400px;
        }
    }

    @media screen and (max-width: 380px) {
        .project__facilities .facility-wrap {
            gap: 0.9em;
        }

        .project__facilities .facility-wrap.less {
            height: 348px;
        }

        .project__facilities .facility-wrap .item {
            width: 47.8%;
            height: 135px;
            padding: 10px;
            text-align: center;
        }

        .project-header-info .category-project span {
            font-size: 11px !important;
            padding: 6px 10px !important;
        }
    }

    .btn-tools .wishlist-icon,
    .wishlist-icon .wishlist-button {
        display: none;
    }

    .single-project .section.footer-cta {
        display: none;
    }
    .project-contact {
        display: none;
        box-shadow: 0px -4px 16px rgba(96, 97, 112, 0.16);
        background-color: #ffffff;
        margin-bottom: 24px;
    }
    .project-contact.sticky{
        display: block;
    }
    
    .project-contact .container {
        width: 100%;
        display: flex;
        padding: 20px 15px;
    }
    
    .project-contact .contact-info {
        display: -ms-flexbox;
        display: flex;
        flex-direction: row;
        align-items: center;
    }
    
    .project-contact .contact-info,
    .project-contact .contact-action {
        flex: 1;
        line-height: 1.3;
    }
    
    .project-contact .contact-info .segment-desc{
        padding-left: 30px;
    }
    .project-contact .contact-info .segment-desc .project-name {
        font-weight: 600;
        font-size: 20px;
        line-height: 26px;
        color: #103A6C;
        text-transform: capitalize;
        margin-bottom: 0;
    }
    
    .project-contact .contact-info .segment-desc .project-address {
        font-weight: 500;
        font-size: 14px;
        line-height: 21px;
        color: #989BB3;
        margin-bottom: 0px;
    }
    
    .project-contact .contact-action {
        display: flex;
        justify-content: flex-end;
        align-items: center;
    }
    .project-contact .segment-logo{
        position: relative;
    }
    .project-contact .segment-logo:after {
        content: "";
        position: absolute;
        height: 100%;
        right: -15px;
        top: 0;
        bottom: 0;
        border-right: 1px solid #DCDDE5;
    }
    .segment-logo .proj-detail-sticky-logo-wrapper {
        height: 37.8px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .segment-logo .proj-detail-developer-logo-img {
        height: 100%;
        max-width: 100%;
        object-fit: contain;
    }
    
    .project-contact .contact-action .btn-brochure-project,
    .project-contact .contact-action .btn-contact{
        width: 245px;
        height: 48px;
        font-weight: 600;
        font-size: 18px;
        line-height: 24px;
        border-radius: 8px;
        text-transform: capitalize;
        margin: 0 0 0 10px;
    }
    
    .project-contact .contact-action .btn-brochure-project{
        background: #FFFFFF;
        color: #333;
        border: 1px solid #333;
    }
    
    .project-contact .contact-action .btn-contact{
        background: var(--primary-bg);
        color: #fff;
    }
    
    .project-contact.sticky {
        position: sticky;
        bottom: 0;
        width: 100%;
        z-index: 10;
    }
    
    @media screen and (max-width: 768px) {
        .project-contact .section-content,
        .project-contact .container,
        .project-contact .contact-info{
        padding: 0 !important;
        }
        .project-contact .contact-action{
            padding-top: 10px;
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            align-items: center;
            gap: 12px;
        }
        .project-contact .contact-action > *{
            text-align: left;
        }

        .project-contact .contact-action .btn-brochure-project{
            width: 100%;
            color: var(--primary-text, color-mix(in srgb, var(--primary-bg), black 10%));
            border: 1px solid var(--primary-text, color-mix(in srgb, var(--primary-bg), black 10%));
            text-align: left;
        }
        .project-contact .contact-action .btn-brochure-project svg{
            color: var(--primary-bg);
        }
        
        .project-contact .contact-action .btn-whatsapp-pdp{
            font-size: 13px;
            line-height: 24px;
            margin: 0px;
        }
        .project-contact .contact-action .btn-whatsapp-pdp img{
            padding-right: 0.5rem;
        }
        .project-contact .contact-info .project-name {
        font-size: 18px!important;
        }
        
        .project-contact .contact-info .project-address {
        font-size: 14px;
        }
    
        .project-contact .contact-action .btn-contact {
        font-size: 13px;
        width: 100%;
        margin: 0;
        }
    
        .project-contact .contact-action .proj-detail-sticky-logo-wrapper {
        display: none !important;
        }
    
        .segment-logo .proj-detail-sticky-logo-wrapper{
        height: 100%;
        width: 60px;
        }
        .project-contact.sticky {
        padding: 16px 16px !important;
        }
        .project-contact .row{
        flex-direction: column;
        }
    
    }
    
    @media screen and (max-width: 425px) {
        
    
        .project-contact .container {
        margin-top: 0;
        }
    }
    @media only screen and (max-width: 600px) {
        .project-header-info .price-box {
            border-left: none;
        }
    }
    /* tablet */
    @media only screen and (min-width: 768px) and (max-width: 1180px) {
        .project__facilities .facility-wrap {
            gap: 18px;
        }
        .project__facilities .facility-wrap .item {
            width: 23%;
        }
        .project__facilities .facility-wrap.less {
            height: 211px;
        }
        .project-contact .contact-action .btn-brochure-project, .project-contact .contact-action .btn-contact {
            width: 245px !important;
        }
        @media (orientation: landscape) {
        }
        @media (orientation: portrait) {
        }
    }
    @media screen and (min-width: 1920px) {
        .project__facilities .facility-wrap {
            gap: 17px;
        }
    }

    .card-property-image-container .card-property-image {
        height: 220px;
    }

    .card-project-container .card-price-tag{
        font-size: 20px;
        line-height: 26px;
        font-weight: 600;
        color: #333333;
    }

    .card-project-container .card-title{
        font-weight: 600;
        font-size: 18px;
        line-height: 24px;
        color: #3D485D;
    }

    .card-project-container .card-title-span{
        font-weight: 500;
        font-size: 14px;
        line-height: 24px;
        color: #9EA3AE;
    }
    .card-project-container .card-extra-info .item .icon-label{
        color: #0D1A35;
    }
    .card-project-container .card-detail-container .card-dev-container{
        flex-direction: row;
        padding: 30px 0 4px;
    }
    .card-project-container .card-detail-container .card-price-label{
        display: none !important;
    }

    /* Top-level section-share rules (works regardless of CSS-nesting support) */
    .project-header-info .section-btn {
        width: 100%;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-flow: row wrap;
        flex-flow: row wrap;
        justify-content: space-between;
        align-items: center;
    }
    .project-header-info .section-btn .btn-tools {
        -js-display: flex;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-flow: row wrap;
        flex-flow: row wrap;
    }
    .project-header-info .section-btn .section-share {
        position: relative;
        padding-left: 10px;
    }
    .project-header-info .section-btn .section-share .section-share_btn,
    .project-header-info .section-btn .section-share .section-share_btn:hover {
        background-color: #fff;
        color: #c4c4c4;
        border: none;
        box-shadow: 0px 0px 2px rgb(40 41 61 / 4%), 0px 4px 8px rgb(96 97 112 / 16%) !important;
        margin-bottom: 0px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    .project-header-info .section-btn .heateor_sss_sharing_container {
        position: absolute;
        width: 208px;
        top: -140px;
        left: auto;
        right: 0;
        text-align: left;
        background: #FFFFFF;
        box-shadow: 0px 0px 2px rgb(40 41 61 / 4%), 0px 4px 8px rgb(96 97 112 / 16%);
        border-radius: 8px;
        padding: 10px;
        opacity: 0;
        z-index: 1;
        pointer-events: none;
    }
    .project-header-info .section-btn .heateor_sss_sharing_container.show {
        opacity: 1;
        pointer-events: auto;
    }
    .project-header-info .section-btn .heateor_sss_sharing_container .heateor_sss_sharing_title {
        font-weight: 400 !important;
        font-size: 14px;
        line-height: 21px;
        text-align: left;
    }
    .project-header-info .section-btn .heateor_sss_sharing_container .heateorSssSharingRound i {
        width: 32px !important;
        height: 32px !important;
        margin-right: 0.8em !important;
    }
    .project-header-info .section-btn .heateor_sss_sharing_container .heateorSssSharingRound:last-of-type i {
        margin-right: 0px;
    }

    .segment-brochure {
        @media screen and (max-width: 768px) {
            display: flex;
            flex: 1;
        }
    }
}