/* #region NAVBAR */
.darkMode #navbar {
    background-color: var(--bgDeepDark);
}
.darkMode .navbar-brand .wrapLogo {
    position: relative;
}
.darkMode .navbar-brand .wrapLogo::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(https://shgb-affiliate.azureedge.net/webreplika/webview/logoTriyanaVillaDark.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
.darkMode .navbar-brand img {
    opacity: 0;
}
.darkMode .navbar-nav .nav-link {
    color: var(--primerDark);
}
.darkMode .navbar-nav .nav-link:hover {
    color: #fff;
}
.darkMode .navbar-nav .nav-link.active {
    color: var(--orange);
}
/* #endregion */

/* #region HEADER */
.darkMode .mainHeader {
    background-color: var(--bgPrimerDark);
}
.darkMode .mainHeader .teks {
    text-shadow: 4px 3px var(--bgDeepDark);
}
.darkMode .mainHeader a {
    color: var(--bgDeepDark);
}
.darkMode .mainHeader a:hover {
    box-shadow: 4px 5px 10px var(--bgDeepDark);
}
/* #endregion */

/* #region GREETING */
.darkMode .greeting {
    background-color: var(--bgPrimerDark);
}
.darkMode .greeting .kanan h1 {
    color: #fff;
}
.darkMode .greeting .kanan p  {
    color: var(--primerDark);
}
.darkMode .greeting .kanan .mainBenefit .item {
    box-shadow: 4px 5px 10px var(--bgDeepDark);
}
.darkMode .greeting .kanan .mainBenefit .item span {
    color: var(--bgDeepDark);
}
.darkMode .greeting .partikel {
    opacity: .1;
}
/* #endregion */

/* #region SOLUSI */
.darkMode .solusi {
    background-color: var(--bgPrimerDark);
}
.darkMode .solusi .atas .kiri .wrapLogo {
    position: relative;
}
.darkMode .solusi .atas .kiri .wrapLogo::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(https://shgb-affiliate.azureedge.net/webreplika/webview/logoTriyanaVillaDark.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
.darkMode .solusi .atas .kiri img {
    opacity: 0;
}
.darkMode .solusi .atas .kiri h1 {
    color: #fff;
}
.darkMode .solusi .atas .kiri h3,
.darkMode .solusi .bawah h6  {
    color: var(--primerDark);
}
.darkMode .solusi .partikel {
    opacity: .1;
}
/* #endregion */

/* #region JOINT OWNERSHIP */
.darkMode .jointOwnership {
    background: linear-gradient(to bottom, #000 30%, var(--bgDeepDark) 100%);
}
.darkMode .jointOwnership .atas .mainJudul {
    color: #fff;
}
.darkMode .jointOwnership .atas .carousel-joint .carousel-cell {
    background-color: var(--bgPrimerDark);
}
.darkMode .jointOwnership .atas .carousel-cell p:nth-of-type(1) {
    color: #fff;
}
.darkMode .jointOwnership .atas .carousel-cell p:nth-of-type(2) {
    color: var(--primerDark);
}
.darkMode .jointOwnership .atas .carousel-joint .flickity-slider::before {
    background: linear-gradient(to left, #000 95%, transparent);
}
.darkMode .jointOwnership .atas .info p {
    color: var(--primerDark);
}
.darkMode .jointOwnership .bawah .tanya {
    background-color: var(--bgPrimerDark);
}
.darkMode .jointOwnership .bawah .tanya h2 {
    color: #fff;
}
.darkMode .jointOwnership .bawah .pertanyaan {
    color: var(--primerDark);
}
.darkMode .jointOwnership .bawah .pertanyaan:hover {
    color: #fff;
    background-color: var(--bgDeepDark);
}
.darkMode .jointOwnership .bawah .mainJudul {
    color: #fff;
}
.darkMode .jointOwnership .bawah .tabel .item:nth-child(even) {
    background-color: #f2f2f2;
}
.darkMode .jointOwnership .bawah .tabel .item:nth-child(odd) {
    background-color: #fff;
}
/* #endregion */

/* #region LOVINA */
.darkMode .lovina {
    background-color: var(--bgPrimerDark);
}
.darkMode .lovina .pantai .banner::after {
    background: linear-gradient(to bottom, var(--bgPrimerDark) 50%, transparent 100%);
}
.darkMode .lovina .pantai .teks .wrapLogo {
    position: relative;
}
.darkMode .lovina .pantai .teks .wrapLogo::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(https://shgb-affiliate.azureedge.net/webreplika/webview/logoLovinaDark.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
.darkMode .lovina .pantai .teks img {
    opacity: 0;
}
.darkMode .lovina .pantai .teks p {
    color: #fff;
}
.darkMode .lovina .pantai .carousel-pantai .flickity-page-dots .dot {
    background: var(--primerDark);
}

.darkMode .lovina .peta .popup {
    background-color: var(--bgPrimerDark);
}
.darkMode .lovina .peta .popup::before {
    border-bottom: 8px solid var(--bgPrimerDark);
}
.darkMode .lovina .peta .popup p:nth-of-type(1),
.darkMode .lovina .peta .teks h1 {
    color: #fff;
}
.darkMode .lovina .peta .popup p:nth-of-type(2),
.darkMode .lovina .peta .teks p {
    color: var(--primerDark)
}
.darkMode .lovina .peta .partikel {
    opacity: .1;
}
/* #endregion */

/* #region TIPE VILLA */
.darkMode .tipe {
    background-color: var(--bgPrimerDark);
}
.darkMode .tipe .mainJudul {
    color: #fff;
}
.darkMode .tipe h5 {
    color: var(--primerDark);
}
.darkMode .tipe .kolom .jenis:hover {
    box-shadow: 5px 10px 20px var(--bgDeepDark);
}
.darkMode .tipe .kolom .jenis .teks {
    background: linear-gradient(to bottom, transparent 0%, var(--bgDeepDark) 100%);
}
.darkMode .tipe .kolom .jenis:hover .teks {
    background: linear-gradient(to bottom, transparent 0%, var(--bgDeepDark) 70%);
}
/* #endregion */

/* #region BENEFIT */
.darkMode .benefit {
    background-color: var(--bgPrimerDark);
}
.darkMode .benefit .mainJudul {
    color: #fff;
}
.darkMode .benefit h5 {
    color: var(--primerDark);
}
.darkMode .benefit .list .item {
    color: var(--bgDeepDark);
    background-color: var(--primerDark);
}
.darkMode .benefit .list .item:hover {
    color: #fff;
    background-color: var(--bgDeepDark);
    box-shadow: 4px 8px 20px #000;
}
.darkMode .benefit .partikel {
    opacity: .1;
}
/* #endregion */

/* #region PROMO */
.darkMode .promo {
    background-color: var(--bgPrimerDark);
}
.darkMode .promo .bigCard {
    background-color: var(--primerDark);
    box-shadow: 5px 10px 25px #000;
}
.darkMode .promo h4,
.darkMode .promo h1,
.darkMode .promo h6,
.darkMode .promo p {
    color: var(--bgDeepDark);
}
.darkMode .promo span {
    color: var(--bgPrimerDark);
}
.darkMode .promo .partikel {
    filter: grayscale(1);
    opacity: .6;
}
/* #endregion */

/* #region VILLA ROSE & LILY */
.darkMode .tipeVilla {
    background-color: var(--bgPrimerDark);
}
.darkMode .tipeVilla .logoAtas .wrapLogo {
    position: relative;
}
.darkMode .tipeVilla .logoAtas .wrapLogo::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(https://shgb-affiliate.azureedge.net/webreplika/webview/logoTriyanaVillaDark.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
.darkMode .tipeVilla .logoAtas .wrapLogo img {
    opacity: 0;
}
.darkMode .tipeVilla .harga .judul {
    color: #fff;
}
.darkMode .tipeVilla .harga .info {
    color: var(--primerDark);
}
.darkMode .tipeVilla .harga .tabel .item:nth-of-type(1) {
    background-color: var(--bgDeepDark);
}
.darkMode .tipeVilla .harga .tabel .item:nth-of-type(2),
.darkMode .tipeVilla .harga .tabel .item:nth-of-type(4) {
    background-color: #f2f2f2;
}
.darkMode .tipeVilla .harga .syarat {
    color: var(--primerDark);
}
.darkMode .tipeVilla .spek .head {
    background-color: var(--bgDeepDark);
    box-shadow: 5px 8px 20px #000;
}
.darkMode .tipeVilla .spek .wrap .list {
    background-color: #f2f2f2;
    box-shadow: 5px 8px 20px #000;
}
/* #endregion */

/* #region HUBUNGI KAMI */
.darkMode .hubungiKami {
    background-color: var(--bgPrimerDark);
}
.darkMode .hubungiKami .wrapper {
    background-color: #f1f1f1;
    box-shadow: 5px 10px 25px #000;
}
.darkMode .hubungiKami .wrapper h1,
.darkMode .hubungiKami .wrapper h5 {
    color: var(--bgDeepDark);
}
/* #endregion */

/* #region FOOTER */
.darkMode footer {
    background: linear-gradient(to bottom, var(--bgDeepDark) 40%, #000 100%);
}
.darkMode footer .logoBulat {
    border: 8px solid var(--bgPrimerDark);
}
.darkMode footer .bawah p:nth-of-type(2) {
    color: var(--primerDark);
}
.darkMode footer .partikel {
    filter: grayscale(1);
    opacity: .2;
}
/* #endregion */