.videoclips-caption {
    background-image: url(https://cchh.blob.core.windows.net/media/koaridge/new/the-homes/keolu/keolu_banner_bg.jpg);
    background-repeat: repeat-x;
    background-size: auto 100%;
}

.section-laulea-intro {
    background-color: #f2ede5;
    color: #000;
}

.txt-title {
    color: #676767 !important;
}

.btn-color {
    background-color: #ffffff;
    color: #7b1e27;
    border-style: solid !important ;
    border-width: 1px !important;
    border-color: #7b1e27;
}

.btn-color:hover {
    color: #ffffff !important;
    border-color: #7b1e27 !important;
    background-color: #7b1e27 !important;
}

.btn-home-color {
    background-color: #7b1e27;
    color: #ffffff;
    border-style: solid !important;
    border-width: 1px !important;
    border-color: #7b1e27;
    font-size: 15px;
}

    .btn-home-color:hover {
        color: #000 !important;
        border-color: #7b1e27 !important;
        background-color: #fff !important;
    }

.bg-laulea {
    background-color: #a99969 !important;
}

.laulea-list {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.highlight-box-bg {
    background-color: #6e6750 !important;
}

.laulea-list li {
    background-image: url(https://cchh.blob.core.windows.net/media/koaridge/new/the-homes/laulea/icon_check.jpg);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 30px auto;
    padding-left: 40px;
    font-size: 22px;
    S line-height: 1.3;
    margin-bottom: 1rem;
}

.laulea-list.text-white li {
    background-image: url(https://cchh.blob.core.windows.net/media/koaridge/new/the-homes/laulea/icon_check.jpg);
}

.laulea-box {
    background-color: #a99969;
    max-width: 1170px;
}

.laulea-box-txt {
    font-size: 1.45rem;
}

.learn-more {
    color: #ffffff;
    text-decoration: underline;
    font-size: 1.45rem;
}

.keolu-section-features {
    background-image: url(https://cchh.blob.core.windows.net/media/koaridge/new/the-homes/keolu/homeownerfeature_bg.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

.keolu-feature-detail {
    color: #ffffff !important;
}


.laulea #legend-pa {
    background-color: #5a7080;
}

.laulea #legend-pb1 {
    background-color: #cc542b;
}

.laulea #legend-pb2 {
    background-color: #cc542b;
}


.laulea #legend-pb3 {
    background-color: #cc542b;
}

.laulea #legend-pc1 {
    background-color: #39b54a;
}

.laulea #legend-pc2 {
    background-color: #39b54a;
}

.laulea #legend-pd {
    background-color: #10693a;
}

.laulea #legend-pe1 {
    background-color: #2ca0a5;
}

.laulea #legend-pe2 {
    background-color: #2ca0a5;
}

.laulea #legend-pf1 {
    background-color: #855694;
}
.laulea #legend-pf2 {
    background-color: #855694;
}
.laulea #legend-pg {
    background-color: #9a8073;
}


.section-laulea-neighborhoods {
    background-image: url(https://cchh.blob.core.windows.net/media/koaridge/new/the-homes/laulea/laulea_feature_bg.jpg);
    background-repeat: no-repeat;
    /*background-position: center center;*/
    background-size: cover;
    color: #000000;
}

.laulea-feature-title {
    color: #7b1e27;
    font-size: 3rem;
    font-weight: 300;
}


.laulea #planHeaderc1,
.laulea #planHeaderc2 {
    background-color: #a99969;
    color: #fff !important;
    display: block;
    font-size: 23px;
    font-weight: 400;
    padding: .5rem .75rem;
    position: relative;
    text-transform: uppercase;
}

.laulea #planHeaderc1,
.laulea #planHeaderc2 {
    background-color: #a99969;
    text-decoration: none;
}

    .laulea #planHeaderc1::after,
    .laulea #planHeaderc2::after {
        content: "+";
        font-size: 18px;
        line-height: 1;
        position: absolute;
        top: 5px;
        right: 8px;
    }

    .laulea #planHeaderc1[aria-expanded="true"]::after,
    .laulea #planHeaderc2[aria-expanded="true"]::after {
        content: "-";
    }

.laulea #planc {
    padding: 0;
    border: 0;
}

.laulea #planHeaderd,
.laulea #planHeaderd2 {
    background-color: #a99969;
    color: #fff !important;
    display: block;
    font-size: 23px;
    font-weight: 400;
    padding: .5rem .75rem;
    position: relative;
    text-transform: uppercase;
}

.laulea #planHeaderd,
.laulea #planHeaderd2 {
    background-color: #a99969;
    text-decoration: none;
}

    .laulea #planHeaderd::after,
    .laulea #planHeaderd2::after {
        content: "+";
        font-size: 18px;
        line-height: 1;
        position: absolute;
        top: 5px;
        right: 8px;
    }

    .laulea #planHeaderd[aria-expanded="true"]::after,
    .laulea #planHeaderd2[aria-expanded="true"]::after {
        content: "-";
    }

/*.laulea #pland {
    padding: 0;
    border: 0;
}*/

.laulea #planHeaderb1,
.laulea #planHeaderb2,
.laulea #planHeaderb3{
    background-color: #a99969;
    color: #fff !important;
    display: block;
    font-size: 23px;
    font-weight: 400;
    padding: .5rem .75rem;
    position: relative;
    text-transform: uppercase;
}

.laulea #planHeaderb1,
.laulea #planHeaderb2,
.laulea #planHeaderb3 {
    background-color: #a99969;
    text-decoration: none;
}

    .laulea #planHeaderb1::after,
    .laulea #planHeaderb2::after,
    .laulea #planHeaderb3::after{
        content: "+";
        font-size: 18px;
        line-height: 1;
        position: absolute;
        top: 5px;
        right: 8px;
    }

    .laulea #planHeaderb1[aria-expanded="true"]::after,
    .laulea #planHeaderb2[aria-expanded="true"]::after,
    .laulea #planHeaderb3[aria-expanded="true"]::after {
        content: "-";
    }

.laulea #planb {
    padding: 0;
    border: 0;
}

.laulea .aside-nav-item > a {
    background-color: #a99969;
}

.laulea .asdie {
    background: url(https://cchh.blob.core.windows.net/media/koaridge/new/the-homes/laulea/laulea_document_bg.jpg);
}

.keolu-home-box {
    background-color: #3e82c2 !important;
}

.btn-keolu-information {
    background-color: #ffffff;
    color: #88b6e2;
}

.bg-keolu-information {
    width: 100%;
    height: 148px; /* Set your desired height */
    background-image: url(https://cchh.blob.core.windows.net/media/koaridge/new/the-homes/keolu/keolu-bar.png);
    background-size: cover; /* Scale image to cover the entire div */
    background-repeat: no-repeat;
    background-position: center; /* Center the image */
}

.white-bg {
    background-color: #ffffff !important;
}

.fixed-width-btn {
    width: 350px;
    display: inline-block;
    text-align: center;
}

.view-floor-plan {
    color: #000000;
    padding-top: 20px;
    text-align: center;
}


    .laulea #plans .slick-next:before,
    .laulea #plans .slick-prev:before {
        background-color: #a99969;
        color: #fff;
        display: block;
        line-height: 48px;
        height: 50px;
        width: 50px;
        margin-top: -25px;
        font-family: 'Lato', sans-serif;
        font-size: 32px;
        font-weight: 400;
    }

    .slick-prev {
        left: -50px !important;
    }

    .laulea #plans .slick-next:after {
        content: none;
    }

.sort-link {
    color: #ffffff !important;
}

.keolu .sitemap-status {
    background-color: #ffffff;
}

@media (max-width: 599.98px) {
    .section-navbar .nav-link, .section-sub-nav .nav-link {
        font-size: 14px;
        padding-left: 0 !important;
        padding-right: 1rem !important;
    }

    .laulea #plans .slick-next:before,
    .laulea #plans .slick-prev:before {
        width: auto;
    }

    .section-sitemap p {
        font-size: 0.9rem !important;
    }

    .slick-prev {
        left: -10px !important;
    }

    .status-available,
    .status-unavailable,
    .status-reserved,
    .status-sold{
        font-size: 13px;
        padding: 0 5px 0 5px;
    }

    .status-unavailable {

    }
}


.laulea .table-prices .thead-dark th {
    background-color: #a99969;
    border-color: #a99969;
}

/* Mobile only: side by side inside legend-item */
@media (max-width: 767.98px) { /* Bootstrap md breakpoint */
    /* Make legend item flex side by side */
    .legend-container.d-block.d-md-none .legend-item {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 0.3rem;
    }

    /* PLAN box stays fixed size, centered text */
    .legend-container.d-block.d-md-none .legend-name {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 70px;
        height: 70px;
        font-size: 18px;
        font-weight: 700;
        line-height: 1.3;
        text-align: center;
        flex-shrink: 0; /* do not shrink */
        color: #fff;
        background-color: #000; /* optional */
        padding: 0;
    }

    /* Paragraph next to PLAN box */
    .legend-container.d-block.d-md-none .legend-item p {
        flex: 1; /* take remaining space */
        margin-bottom: 0;
        white-space: normal; /* allow wrapping */
    }

        /* First part of paragraph stays on one line */
        .legend-container.d-block.d-md-none .legend-item p .no-wrap {
            white-space: nowrap;
        }

    /* Each col-6 ensures two-column layout */
    .legend-container.d-block.d-md-none .col-6 {
        width: 50%;
        box-sizing: border-box;
        padding-left: 0.25rem;
        padding-right: 0.25rem;
        margin-bottom: 0.5rem;
    }

    #dropdownPriceNav {
        background-color: #ffffff;
        color: #000;
        border: 1px solid #d3d3d3;
        font-size: 1rem;
        opacity: 1;
        padding: .375rem 1.5rem;
    }

    .price-title-spacing {
        padding-bottom: 1rem !important;
    }

    .legend-item p {
        padding-left: 0 !important;
    }

    .legend-container {
        padding: .5rem .1rem !important;
    }

    .section-sitemap p {
        font-size: 0.8rem !important;
    }

    .laulea .table-prices td:nth-child(1)::before {
        content: "Building";
        top: .75rem;
    }

    .laulea .table-prices td:nth-child(2)::before {
        content: "Unit";
    }

    .laulea .table-prices td:nth-child(3)::before {
        content: "Plan";
    }

    .laulea .table-prices td:nth-child(4)::before {
        content: "Beds/Bath";
    }

    .laulea .table-prices td:nth-child(5)::before {
        content: "Price";
    }

    .laulea .table-prices td:nth-child(6)::before {
        content: "Status";
    }

}

.sort-by-title {
    text-transform: uppercase;
    color: #bfbfbf !important;
    font-size: 15px;
}

.section-flipbook a {
    color: #fff !important;
}

.section-flipbook a:hover {
    color: #fff !important;
}