html {
    scroll-padding-top: 68px;
}

li {
    /* margin-bottom: 0; */
}

.col-nav-logo {
    width: 16%;
    display: flex;
    align-items: center;
}

.col-nav-kategori {
    width: 11%;
    display: flex;
    align-items: center;
    justify-content: end;
    color: var(--text-color);
}

.col-nav-search {
    width: 41%;
    display: flex;
    align-items: center;
}

/* .col-nav-icon {
    width: 10%;
    display: flex;
    align-items: center;
    justify-content: end;
}

.col-nav-devider {
    width: 6%;
    display: flex;
    justify-content: center;
} */

.col-nav-button {
    width: 31%;
    display: flex;
    align-items: center;
    justify-content: end;
    margin-right: 10px;
}

.btn-nav {
    border: 1px solid var(--btn-nav);
}

.btn-nav:hover {
    border-color: var(--hijau-tua);
    color: var(--hijau-tua);
}

.divider-nav {
    height: 26px;
    width: 1px;
    background-color: var(--text-color);
    margin: 0px 10px;
    color: transparent;
}

.btn-nav-icon {
    border: none;
    color: var(--text-color);
}

.btn-nav-icon:hover {
    color: var(--text-color);
}

.btn-nav-icon img {
    width: 20px;
    height: 20px;
    /* filter: invert(0%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(64%) contrast(50%); */
}

.btn-nav-icon.lonceng img {
    filter: none;
}

.btn-nav-icon img:hover {
    filter: none;
}

.search-container {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.search-container i {
    position: absolute;
    left: 10px;
    font-size: 9px;
    color: var(--text-color);
}

.search-input {
    padding: 6px 5px 5px 25px;
    border-radius: 5px;
    border: 1px solid var(--border);
    outline: none;
    width: 100%;
    background-color: transparent;
    color: var(--text-color);
    font-size: 9px;
}

.search-input::placeholder {
    font-size: 9px;
    color: var(--text-color);
}

.result-search {
    display: none;
    position: absolute;
    top: 42px;
    width: inherit;
    border: 1px solid var(--border);
    border-radius: 5px;
    overflow: hidden;
}

.item-result-search {
    border-bottom: 1px solid var(--border);
    display: none;
    background-color: var(--cream-putih);
    width: 100%;
}

.item-result-search:hover, .item-result-search.active, .item-result-search:focus, .item-result-search:focus-visible {
    background-color: var(--cream-muda);
    outline: none;
}

.item-result-search:hover a {
    font-weight: 600;
}

.item-result-search a {
    padding: 5px;
    text-decoration: none;
    color: var(--text-color);
    font-size: 9px;
    width: 100%;
    display: block;
}

.nav-logo {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.nav-logo a img {
    padding: 5px 0px 5px 7px;
    width: auto;
    height: 69%;
}

.index-title-kategori h1 {
    font-size: 14px;
    color: var(--hijau-tua);
    text-align: center;
}

.index-title-kategori p {
    text-align: center;
    font-size: 11px;
    padding: 0 15%;
    color: var(--text-color);
    margin-bottom: 0;
}

.index-list-kategori {
    display: flex;
    justify-content: center;
}

.index-item-kategori {
    width: 100px;
    margin-top: 10px;
    padding: 10px 15px;
    background: transparent;
    text-decoration: none;
    color: var(--text-color);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.index-item-kategori:hover {
    background: var(--cream-putih);
}

.index-item-kategori img {
    width: 35px;
    height: 35px;
    margin: 0 auto;
}

.index-item-kategori h2 {
    font-size: 10px !important;
    margin-bottom: 0;
    margin-top: 10px;
    text-align: center;
}

.left-title {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.left-title span {
    display: inline-block;
    width: 3px;
    height: 20px;
    background-color: var(--orange);
    margin-right: 12px;
}

.left-title p {
    font-size: 14px;
    margin-bottom: 0;
    color: var(--hijau-tua);
}

.text-selengkapnya {
    white-space: nowrap;
    text-decoration: none;
    display: flex;
    align-items: center;
    margin-bottom: 0;
    color: var(--text-color);
}

.text-selengkapnya:hover {
    font-weight: 600;
}

.text-selengkapnya p {
    font-size: 11px;
    color: var(--hijau-tua);
    margin-bottom: 0;
    margin-right: 5px;
}

.text-selengkapnya img {
    width: 10px;
    margin-right: 10px;
}

.index-merek-perangkat {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
    gap: 18px;
}

.item-merek-perangkat {
    width: calc(19% - .5vw);
    background-color: transparent;
    box-sizing: border-box;
    border: 1px solid var(--border);
    margin-bottom: 12px;
}

.item-merek-perangkat:nth-child(5n) {
    margin-right: 0;
}

.item-merek-perangkat:hover {
    background-color: var(--cream-putih);
}

.item-merek-perangkat:hover figure img {
    opacity: 1;
}

.item-merek-perangkat {
    text-decoration: none;
    color: var(--text-color);
    padding: 15px;
}

.item-merek-perangkat figure {
    height: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 0;
}

.item-merek-perangkat figure img {
    margin: auto;
    height: 100%;

}

.item-merek-perangkat h3 {
    font-size: 10px;
    text-align: center;
    margin-bottom: 0;
}

.footer-top {
    background-color: var(--cream-tua);
    width: 100%;
    display: flex;
    padding-bottom: 20px;
}

.footer-bottom {
    display: flex;
    align-items: center;
    width: 100%;
    background-color: var(--nav);
    border-top: 1px solid var(--border);
}

.footer-bottom p {
    font-size: 9px;
    color: var(--hijau-tua);
    margin: 8px;
}

.col-footer-logo {
    display: flex;
    justify-content: center;
    align-items: start;
    width: 24%;
}

.col-footer-logo img {
    width: 124px;
    margin: 20px;
    margin-top: 8px;
}

.img-barcode {
    width: 100px !important;
}

.col-footer-transaksi {
    width: 16%;
}

.col-footer-pembayaran {
    width: 14%;
}

.col-footer-informasi {
    width: 16%;
}

.col-footer-bantuan {
    width: 30%;
    padding-right: 15px;
}

.col-footer-transaksi p, .col-footer-pembayaran p, .col-footer-informasi p, .col-footer-bantuan p {
    font-size: 11px;
    color: var(--hijau-tua);
    margin: 8px 0;
    font-weight: 600;
}

.col-footer-transaksi span {
    font-size: 10px;
}

.item-kanal-transaksi img {
    height: 20px;
    width: auto;
    margin: 8px 0;
}

.item-kanal-transaksi a {
    text-decoration: none;
    color: var(--text-color);
}

.item-kanal-transaksi p, .col-footer-bantuan .text-footer-bantuan {
    color: var(--text-color);
    font-weight: 400;
}

.item-footer-pembayaran img {
    height: auto;
    width: 63px;
    margin: 5px 0;
}

.item-informasi {
    margin-bottom: 7px;
}

.item-informasi a {
    text-decoration: none;
    color: var(--text-color);
    font-size: 10px;
}

.item-informasi a:hover {
    font-weight: 600;
}

.item-bantuan {
    margin-bottom: 7px;
}

.col-footer-bantuan p {
    font-size: 10px;
    line-height: 12px;
}

.item-bantuan img {
    width: 17px;
    height: auto;
    margin-right: 10px;
}

.item-bantuan a {
    color: var(--text-color);
    text-decoration: none;
    font-size: 10px;
}

.item-bantuan a:hover {
    font-weight: 600;
}

.btn-hostakita {
    border: 1px solid var(--btn-hijau-tua);
    background-color: transparent;
    color: var(--btn-font-hijau-tua) !important;
}

.btn-hostakita:hover, .btn-hostakita:focus, .btn-hostakita:active {
    background-color: var(--btn-hijau-tua) !important;
    color: var(--btn-hover-hijau-tua) !important;
    border: 1px solid var(--btn-hijau-tua) !important;
}



.btn-humane {
    border: 1px solid var(--btn-hijau-tua);
    background-color: var(--btn-hijau-tua);
    color: var(--btn-hover-hijau-tua) !important;
}

.btn-humane:hover, .btn-humane:focus, .btn-humane:active {
    background-color: transparent;
    color: var(--btn-hijau-tua) !important;
}

.nav-link span:hover {
    font-weight: 600;
}

.col-nav-kategori span:hover {
    font-weight: 600;
    cursor: pointer;
}

.we-are {
    margin-left: 20px;
    font-size: 10px;
    margin-bottom: 1px;
    color: var(--hijau-tua);
}

.sysin {
    font-size: 14px;
    margin-bottom: 0;
    font-weight: 600;
    margin-top: -2px;
    margin-left: 20px;
    color: var(--hijau-tua)
}

.deret-merek-perangkat {
    display: flex;
    justify-content: start;
    flex-wrap: wrap;
    align-items: center;
    padding: 0px 15px;
    width: 100%;
}

.item-deret-merek-perangkat {
    width: 15.5%;
    padding: 13px 0;
    border: 1px solid var(--border);
    text-decoration: none;
    color: var(--text-color);
    margin: 1% 0.5%;
}

.item-deret-merek-perangkat figure {
    display: flex;
    justify-content: center;
    height: 17px;
    margin-bottom: 0;

}

.item-deret-merek-perangkat:hover {
    background-color: var(--border);
}

.item-deret-merek-perangkat img {
    height: 100%;
}

.item-deret-merek-perangkat h3 {
    font-size: 11px;
    text-align: center;
    margin-bottom: 0;
    height: 20px;
}

.merk-lainnya {
    background-color: var(--background);
    color: var(--text-color);
}

.merk-lainnya a figure img {
    width: 20px;
}

.detail-text-merek-perangkat {
    width: 97%;
    margin: auto;
    padding-bottom: 30px;
}

.detail-text-merek-perangkat h1 {
    text-align: center;
    font-size: 14px;
    color: var(--hijau-tua);
}

.detail-text-merek-perangkat p {
    text-align: left;
    font-size: 11px;
    margin-bottom: 0;
}

.list-contoh-perangkat {
    margin: auto;
    width: 80%;
    padding: 0px 0px 0px 10px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.item-contoh-perangkat {
    width: 16.6%;
    padding: 10px;
    border-radius: 10px;
}



.item-contoh-perangkat img {
    width: 100%;
}

.head-perangkat {
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 10px;
    /* display: flex; */
    width: 100%;
    margin-top: 33px;
}

.head-perangkat figure {
    width: 20%;
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: end;
    margin-bottom: 0;
    flex-direction: column;
}

.head-perangkat figure img {
    width: 100px;
}

.head-perangkat figure .desc-text-sysin {
    margin-bottom: 0;
    width: 100px;
    margin-top: 40px;
}

.head-perangkat figure .desc-text-sysin.toko-ladang {
    margin-bottom: 0;
    width: 100px;
    margin-top: 50px;
}

.head-perangkat figure .desc-text-sysin a {
    width: 100%;
}

.text-gambaran {
    width: 80%;
}

.text-gambaran .title-text-gambaran {
    padding-left: 10px;
    font-size: 11px;
    margin-bottom: 0;
    font-weight: 500;
    color: var(--hijau-tua);
}

.text-gambaran .desc-text-gambaran {
    padding-left: 10px;
    font-size: 9px;
    line-height: 12px;
    color: var(--hijau-tua);
}

.text-gambaran .disadur-text-gambaran {
    font-size: 8px;
    padding-left: 10px;
}

.display-perangkat {
    display: flex;
    width: 100%;
}

.text-display-perangkat p {
    margin-bottom: 0;
}

.text-display-perangkat {
    width: 20%;
    display: flex;
    align-items: center;
}

.item-contoh-perangkat figure {
    border: 1px solid var(--border);
    width: 100%;
    height: 100px;
    padding: 10px;
    margin-bottom: 0;
}

.item-contoh-perangkat figure img {
    width: 70%;
}


.item-contoh-perangkat-lainnya figure {
    background-color: transparent;
}

.item-contoh-perangkat-lainnya figure span {
    font-size: 9px;
    color: var(--text-color);
}

.item-contoh-perangkat-lainnya figure img {
    width: 30px;
}

.penampakan-kami {
    height: 222px;
    border-radius: 10px;
}

.penampakan-kami .middle-image1 img {
    height: 154px;
}

.penampakan-kami .middle-image2 img {
    height: 56px;
}

.figure-sysin img {
    padding-left: 20px;
    margin-top: 10px;
}

.figure-sysin .title-text-gambaran {
    color: var(--hijau-tua);
}

.text-sysin {
    width: 80%;
}

.text-sysin .title-text-sysin {
    padding-left: 10px;
    font-size: 11px;
    margin-bottom: 0;
    font-weight: 500;
    color: var(--hijau-tua);
}

.text-sysin .desc-text-sysin {
    padding-left: 10px;
    font-size: 9px;
    line-height: 12px;
    color: var(--text-color);
    margin: 5px 0;
}

.text-sysin .desc-text-sysin a {
    text-decoration: none;
    color: var(--orange);
    font-size: 9px;
}

.text-sysin .desc-text-sysin a:hover {
    font-weight: 600;
}

.pattern-top {
    margin: 0;
    padding-top: 33px;
}

.pattern-top img {
    width: 100%;
    opacity: 0.5;
}

.kategori-show {
    position: absolute;
    width: 100%;
}

.bell, .newsletter {
    position: absolute;
    right: 0;
    width: 29%;
    border: 1px solid var(--border);
    padding: 15px;
    background-color: var(--background);
    border-radius: 0 0 10px 10px;
}

.bell .card, .newsletter .card {
    border: 1px solid var(--border);
    background-color: var(--background);
    border-radius: 10px;
}

.title-produk {
    font-size: 10px;
    text-decoration: none;
    color: var(--hijau-tua);
    cursor: pointer;
    border-bottom: 1px solid #1c44361f;
    padding-bottom: 5px;
    display: flex;
}

.title-produk:hover {
    font-weight: 600;
}

.isi-kategori-produk .title-produk {
    border: none !important;
    cursor: default;
}

.icon-kategori-nav {
    width: 15px;
    margin-right: 9px;
}

.list-produk-kategori-nav {
    padding-left: 5px;
    display: grid;
}

.list-produk-kategori-nav a {
    text-decoration: none;
    color: var(--text-color);
    font-size: 10px;
    margin-bottom: 8px;
}

.list-produk-kategori-nav a:hover {
    font-weight: 600;
}

.produk-content {
    display: flex;
    width: 100%;
}

.produk-content-left {
    background: transparent;
    width: 20%;
    border: none !important;
}

.produk-content-left a {
    font-size: 10px !important;
    text-decoration: none;
    color: var(--hijau-tua) !important;
}

.produk-content-right {
    width: 80%;
    padding: 8px;
    padding-top: 0;

}

.produk-content-right .ads {
    width: 100%;
    margin-bottom: 15px;
}

.text-ringkasan {
    font-size: 12px;
}

.produk-content-right h2 {
    font-size: 12px;
    margin-bottom: 0;
    color: var(--hijau-tua);
}

.title-produk-content-left {
    display: flex;
    align-items: center;
    padding: 5px;
    background-color: var(--side-label);
    color: var(--text-color);
    cursor: default;
    pointer-events: none;
}

.list-produk-content-left {
    display: flex;
    align-items: center;
    padding: 5px;
    border-bottom: 1px solid var(--border);
    cursor: pointer;
}

.list-produk-content-left.default {
    display: flex;
    align-items: center;
    padding: 5px;
    border-bottom: 1px solid var(--border);
    cursor: default;
}

.list-produk-content-left:hover {
    border-left: 2px solid var(--orange);
    background-color: var(--side-option) !important;
}

.list-produk-content-left.active {
    background-color: var(--side-option);
    border-left: 2px solid var(--orange);
}

.title-produk-content-left span, .list-produk-content-left span {
    font-size: 10px;
    line-height: 12px;
    width: 85%;
    margin-bottom: 0;
    color: var(--hijau-tua);
}

.title-produk-content-left figure, .list-produk-content-left figure {
    width: 15%;
    margin-right: 4px;
    margin-bottom: 0;
}

.title-produk-content-left figure img, .list-produk-content-left figure img {
    width: 20px;
    height: 20px;
}

.list-produk-content-left.left-other {
    font-size: 9px !important;
    line-height: 10px;
}

.list-produk-content-left.left-other a {
    font-size: 9px;
    line-height: 12px;
    width: 80%;
    margin-bottom: 0;
}

.list-produk-content-left.left-other figure {
    width: 20% !important;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 0;
}

.list-produk-content-left.left-other figure img {
    width: 17px !important;
    height: 17px !important;
}

.produk-content-left .card-header {
    background-color: var(--cream-muda);
    color: var(--hijau-tua);
    padding: 10px 5px;
    border-color: transparent;
}

.produk-content-left .title-orders-produk {
    border-bottom: 1px solid #1c44361f;
    background-color: transparent;
}

.icon-title-produk-layanan {
    display: flex;
    align-items: center;
    margin-bottom: 0;
    justify-content: center;
    flex-direction: column;
}

.icon-title-produk-layanan figure {
    margin-bottom: 0;
    width: 36px;
    margin-bottom: 15px;
}

.icon-title-produk-layanan figure img {
    width: 100%;
}

.icon-title-produk-layanan h6 {
    font-size: 11px;
    margin-bottom: 5px;
}

.icon-title-produk-layanan p {
    margin-bottom: 0;
    font-size: 9px;
    line-height: 15px;
}

.icon-title-produk-layanan p img {
    width: 8px;
}

.list-kategori-produk-all {
    border-color: var(--border) !important;
    background-color: var(--background);
    margin-bottom: 20px;
}

.item-kategori-produk-all {
    display: grid;
    justify-content: center;
    border-radius: 10px;
    background-color: transparent;
}

.item-kategori-produk-all h6 {
    color: var(--text-color);
    font-size: 11px;
    margin-bottom: 5px;
    text-align: center;
}

.item-kategori-produk-all p {
    color: var(--text-color);
    font-size: 9px;
    text-align: center;
    margin-bottom: 0;
    line-height: 11px;
    height: 55px;
}

.item-kategori-produk-all figure {
    display: flex;
    justify-content: center;
    height: 40px;
    margin-top: 15px;
}

.item-kategori-produk-all figure img {
    height: 100%;
    width: auto;
}

.head-list-kategori-produk-all {
    padding: 33px 5.5% 5.5% 15px !important;
    display: flex;
    justify-content: center;
}


.card-pilihan-merek-perangkat figure {
    height: 30px;
    display: flex;
    padding: 0 20%;
}

.card-pilihan-merek-perangkat figure img {
    width: 54%;
    margin: auto;
}

.list-produk-content-left.other-category {
    border-bottom: 1px solid #1c44361f;
}

.list-produk-content-left.other-category figure {
    margin-right: 0;
}

.list-produk-content-left.other-category figure img {
    width: 20px;
    height: 20px;
}

.list-produk-content-left.other-category a {
    font-size: 9px;
}

.image-title-product {
    width: 24px;
    margin-right: 10px;
}

.index-title-kategori figure img {
    width: 70px;
}

.index-title-kategori figure {
    display: grid;
    justify-content: center;
}

.card-page-promo {
    border-radius: 10px;
    background-color: transparent;
    border: 1px solid #1c44361f !important;
}

.page-promo {
    border-radius: 10px;
    padding: 20px 25px;
    background-color: transparent;
}

.page-promo h6 {
    font-size: 14px;
    text-align: center;
    font-weight: 600;
    margin-bottom: 15px;
}

.item-produk-promo {
    display: grid;
    flex-direction: column;
    border: 1px solid #1c44361f;
    padding: 10px;
    text-decoration: none;
    color: var(--text-color);
    border-radius: 10px;
    background-color: var(--cream-tua);
}

.item-produk-promo:hover {
    font-weight: 600;
    background-color: var(--cream-putih);
}

.item-produk-promo figure {
    display: flex;
    justify-content: center;
}

.item-produk-promo figure img {
    width: 50px;
}

.item-produk-promo h6 {
    font-size: 11px;
    font-weight: 500;
    height: 10px;
}

.card-body-type-produk {
    border: none;
    border-radius: 10px;
    box-shadow: none;
    background-color: var(--card-header);
    color: var(--text-color);
    text-decoration: none;
}

.card-body-type-produk:hover {
    background-color: var(--cream-putih);
}

.card-body-type-produk:not(.collapsed) {
    border: 1px solid var(--hijau-tua) !important;
}

.card-body-type-produk:not(.collapsed) p {
    font-weight: 600;
}

.card-body-type-produk span {
    width: 20px;
    height: 20px;
    background-color: var(--orange);
    color: var(--cream-putih);
    border-radius: 50%;
    position: absolute;
    left: -3px;
    top: -3px;
    text-align: center;
    padding-top: 2px;
}

.card-body-type-produk:not(.collapsed) span {
    background-color: var(--hijau-tua);
}

.daftar-produk-merek-perangkat {
    display: flex;
    justify-content: center;
}


.item-produk-merek-perangkat {
    width: 15%;
    padding: 10px 0;
}

.item-produk-merek-perangkat a {
    text-decoration: none;
    color: var(--text-color);
}

.item-produk-merek-perangkat a figure {
    display: flex;
    justify-content: center;
    height: 50px;
}

.item-produk-merek-perangkat:hover {
    background-color: var(--cream-putih);
}

.item-produk-merek-perangkat a img {
    /* filter make grey  */
    /* filter: grayscale(100%) brightness(0.6) invert(0.5); */

    filter: grayscale(100%);
    opacity: 0.5;
    mix-blend-mode: multiply;
    padding: 10px;
    width: 100%;
}

.item-produk-merek-perangkat a h3 {
    font-size: 11px;
    text-align: center;
    margin-bottom: 0;
    height: 20px;
}

.img-title-produk {
    width: 20px;
    margin-right: 7px;
}

.label-judul-produk {
    display: grid;
    flex-direction: column;
    justify-content: center;
}

.label-judul-produk figure {
    margin: 10px 0 30px 0;
}

.label-detail-paket {
    display: grid;
    flex-direction: column;
    justify-content: center;
}

.label-detail-paket figure {
    margin: -60px 0 15px 150px;
}

.label-detail-paket figure img {
    height: 70px;
}

.card-body-type-produk.coming-soon {
    background-color: var(--cream-putih);
}

.card-body-type-produk.coming-soon:hover {
    background-color: var(--cream-tua);
    filter: grayscale(70%);
}

.pilihan-merek-perangkat {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
    padding: 10px 35px;
    width: 100%;
}

.item-pilihan-merek-perangkat {
    width: 15%;
    padding: 10px 0;
}

.item-pilihan-merek-perangkat a {
    text-decoration: none;
    color: var(--text-color);
}

.item-pilihan-merek-perangkat a figure {
    display: flex;
    justify-content: center;
    height: 50px;
}

.item-pilihan-merek-perangkat:hover {
    background-color: var(--cream-putih);
}

.item-pilihan-merek-perangkat a img {
    filter: grayscale(100%);
    opacity: 0.5;
    mix-blend-mode: multiply;
    padding: 10px;
    width: 100%;
}

.item-pilihan-merek-perangkat a h3 {
    font-size: 11px;
    text-align: center;
    margin-bottom: 0;
    height: 20px;
}

.col-pilihan-merek .card-body-berita figure {
    background-color: var(--cream-muda);
    padding: 0px;
    margin-bottom: 0;
    display: flex;
    justify-content: center;
    border-radius: 10px 10px 0 0;
}

.col-pilihan-merek .card-body-berita figure img {
    background-color: var(--cream-muda);
    padding: 35px
}

.card-pilihan-merek-perangkat p {
    height: 100%;
}

.hr-divider {
    border-color: var(--border) !important;
    opacity: 1;
}

.varian-produk {
    height: 20px !important;
    width: auto !important;
    margin: auto !important;
    padding: 3px 0;
}

.list-varian-produk .btn {
    display: grid;
    justify-content: center;
    align-items: center;
    box-shadow: none;
    background: none;
    margin: 3px 0;
}



#accordionPromoDiskon .accordion-button::after {
    display: none;
}

.accordion-button:not(.collapsed) {
    border: 1px solid var(--hijau-tua);
    background: var(--cream-muda);
    color: var(--text-color);
}

.accordion-button {
    box-shadow: none;
}

.accordion-button:focus {
    box-shadow: none;
    outline: none;
}

.btn-real:hover, .btn-real:focus, .btn-real:active {
    border: 1px solid var(--hijau-tua) !important;
    color: var(--text-color);
}

.filtering-produk {
    color: var(--text-color);
}

.filtering-produk button {
    text-decoration: none;
    color: var(--text-color);
    background-color: transparent;
    border: none;
}

.filtering-produk button.active {
    color: var(--text-color);
    font-weight: 600;
}

.filtering-produk button:hover {
    font-weight: 600;
}

.promo-diskon {
    text-decoration: none;
    color: var(--hijau-tua);
}

.promo-diskon:hover {
    font-weight: 500;
}

.promo-diskon figure img {
    width: 100%;
}

.promo-diskon h5 {
    font-size: 11px;
}

.syarat-ketentuan-promdis {
    padding: 15px 0 0 15px;
    padding-bottom: 0;
    color: var(--text-color);
}

.syarat-ketentuan-promdis h1 {
    font-size: 14px;
}

.syarat-ketentuan-promdis p {
    font-size: 11px;
}

.newsletter h1 {
    font-size: 11px;
    margin-bottom: 10px;
}

.newsletter p, .newsletter input, .newsletter label {
    font-size: 9px;
}

.bell h1 {
    font-size: 11px;
    margin-bottom: 10px;
}

.bell h2 {
    font-size: 10px;
    margin-bottom: 10px;
}

.bell p, .bell input, .bell label {
    font-size: 9px;
}

.bell img {
    width: 15px;
    height: 15px;
}

.modal-detail-produk .modal-dialog {
    top: 20%;
}

.modal-detail-produk .modal-content, .modal-detail-produk .modal-body {
    border-radius: 10px;
}

.modal-detail-produk .modal-header {
    border-radius: 10px 10px 0 0;
}

.modal-desc-detail-produk h1 {
    font-size: 14px;
    color: var(--hijau-tua);
}

.modal-desc-detail-produk h2 {
    font-size: 12px;
    color: var(--hijau-tua);
    margin-bottom: 10px;
}

.image-light {
    display: var(--image-light);
}

.image-dark {
    display: var(--image-dark);
}

.image-light-flex {
    display: var(--image-light-flex);
}

.image-dark-flex {
    display: var(--image-dark-flex);
}

.head-nav {
    border-bottom: 1px solid var(--border-nav);
}

.footer {
    border-top: 1px solid var(--border-nav);
    border-right: 1px solid var(--border-nav);
    border-left: 1px solid var(--border-nav);
}

.grid--content-nav {
    /* border-right: 1px solid var(--border-nav); */
    /* border-left: 1px solid var(--border-nav); */
    /* padding-top: 16.5px; */
    padding-bottom: 50px;
}

.rincian-gambar-perangkat {
    border: 1px solid var(--border) !important;
    border-radius: 10px;
    margin-top: 5px;
}

.rincian-gambar-perangkat figure {
    margin-bottom: 0;
    border-radius: 10px;
}

.rincian-gambar-perangkat figure img {
    border-radius: 10px;
    max-width: 100%;
}

.rincian-deskripsi-perangkat {
    height: 222px;
    margin-top: 5px;
    color: var(--hijau-tua);
}

.action-list-gambar {
    border: 1px solid var(--border) !important;
    height: 50px;
    margin: 5px 0;
    border-radius: 5px;
    display: flex;
}

.action-list-gambar figure {
    margin-bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.action-list-gambar figure img {
    width: 35px;
    padding-top: 5px;
}

.share-produk {
    display: flex;
    align-items: center;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    padding: 3px 0;
    margin-top: 5px;
}

.share-produk a {
    text-decoration: none;
}

.share-produk h6:hover {
    font-weight: 600;
}

.share-produk img {
    width: 12px;
}

.share-produk h6 {
    color: var(--hijau-tua);
    margin-bottom: 0;
    padding-left: 5px;
    font-size: 9px;
}

.list-jenis-produk button img {
    width: 15px !important;
    height: 15px !important;
}

.list-jenis-produk button:hover {
    background-color: transparent;
}

.modal-share-link .modal-content .modal-header, .modal-share-link .modal-content .modal-body, .modal-share-link .modal-content .modal-footer {
    border-radius: 10px;
}

.modal-share-link .modal-content .modal-footer {
    padding: 9px;
}

.text-selengkapnya-rincian-deskripsi {
    text-decoration: none;
    color: var(--hijau-tua);
}

.text-selengkapnya-rincian-deskripsi:hover {
    font-weight: 600;
}

.sticky-top {
    top: -1px;
}

.index-kategori {
    padding-top: 33px;
}

.preview-product {
    height: 270px;
}

.preview-product p {
    color: var(--hijau-tua);
}

.item-kategori-produk-all.paket-produk {
    padding-top: 0;
}


.icon-deskripsi-produk {
    width: 100%;
    height: 40px;
    border: 1px solid var(--border);
    padding: 5px;
    border-radius: 10px;
    margin-bottom: 0;
    display: flex;
    justify-content: center;
}

.icon-deskripsi-produk img {
    width: auto;
    height: 100%;
}

.text-deskripsi-produk {
    display: grid;
    flex-direction: column;
}

.text-deskripsi-produk h3 {
    font-size: 10px;
    margin-bottom: 3px;
}

.text-deskripsi-produk a {
    font-size: 9px;
    margin-bottom: 0;
    line-height: 10px;
    color: var(--text-color);
    text-decoration: none;
}

.text-deskripsi-produk a:hover {
    font-weight: 600;
    cursor: default;
}

.figure-image-title-card {
    height: 100% !important;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0;
    width: 30%;
}

.figure-image-title-card img {
    border-radius: 10px 10px 0 0;
    height: 100%;
    overflow: hidden;
    position: relative;
    object-fit: cover;
    padding: 5px;
}

.figure-image-title-card .other-plus {
    height: 5rem;
}

.desc-image-title-card {
    background-color: var(--cream-putih);
    width: 70%;
    padding: 6px;
    padding-right: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.desc-image-title-card p {
    margin-bottom: 0;
    font-size: 10px;
    color: var(--text-color);
    line-height: 12px;
}

.card-body-type-produk.accordion-button {
    display: flex;
    flex-direction: row;
    padding: 0;
    background-color: var(--border);
    height: 40px;
    overflow: hidden;
}

.card-body-type-produk.accordion-button::after {
    display: none;
}

.deskripsi-spesifikasi {
    margin-top: 10px;
    padding-bottom: 7px;
    padding-left: 10px;
    margin-right: 7px;
    border-bottom: 1px solid var(--border);
}

.deskripsi-spesifikasi h1 {
    font-size: 11px;
    margin-bottom: 3px;
}

.deskripsi-spesifikasi p {
    font-size: 10px;
    margin-bottom: 0;
    line-height: 10px;
}

.text-type-produk {
    margin-bottom: 10px;
}

#jejakCctv .middle-image1 img {
    height: 180px;
}

#jejakCctv .middle-image2 img {
    height: 90px;
}

.div-coming-soon {
    border: 1px solid #1F8D63;
    padding: 0px;
    margin-top: 6em;
    width: 50%;
}

.div-coming-soon h3 {
    font-size: 14px;
    font-weight: 600;
    color: var(--hijau-tua);
}

.div-coming-soon p {
    font-size: 11px;
    color: var(--hijau-tua);
    padding: 0 10px;
}

.deskripsi-paket {
    border: 1px solid var(--border);
    border-radius: 10px;
    margin-bottom: 15px;
}

.deskripsi-paket h3 {
    font-size: 16px;
    font-weight: 600;
}

.deskripsi-paket .left-title span {
    margin-right: 0;
}

.deskripsi-paket p {
    padding: 10px;
    margin-bottom: 0;
    color: var(--text-color);
}

.deskripsi-paket .left-title p {
    padding: 10px 7px;
    color: var(--hijau-tua);
}

.fasilitas-utama-paket {
    border: 1px solid var(--border);
    border-radius: 10px;
    margin-bottom: 15px;
    overflow: hidden;
}

.fasilitas-utama-paket .left-title span {
    margin-right: 0;
}

.fasilitas-utama-paket p {
    padding: 10px 7px;
}

.fasilitas-utama-paket .index-list-kategori {
    display: flex;
    justify-content: start;
}

.fasilitas-utama-paket .index-list-kategori .index-item-kategori {
    margin-top: 0;
    width: 100%;
}

.fasilitas-utama-paket .index-list-kategori .index-item-kategori h2 {
    color: var(--text-color);
}

.fasilitas-paket {
    border: 1px solid var(--border);
    border-radius: 10px;
}

.fasilitas-paket p {
    padding: 10px 7px;
}

.fasilitas-paket .left-title span {
    margin-right: 0;
}

.list-fasilitas {
    padding: 0px 10px 10px 10px;
}

.item-fasilitas {
    display: flex;
    align-items: center;
    padding-right: 0;
}

.item-fasilitas p {
    padding: 5px;
    padding-right: 0;
    margin-left: 3px;
    line-height: 12px;
    color: var(--text-color);
    font-size: 10px;
}

.item-fasilitas i {
    color: var(--text-color);
}

.rekomendasi-internet {
    border: 1px solid var(--border);
    border-radius: 10px;
    display: flex;
    width: 100%;
}

.rekomendasi-internet .left-rekomendasi-internet {
    background-color: #1c4436;
    width: 7%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px 0 0 10px;
}

.rekomendasi-internet .left-rekomendasi-internet i {
    color: #fff;
    font-size: 24px;
}

.rekomendasi-internet .center-rekomendasi-internet {
    width: 75%;
    padding: 10px;
}

.rekomendasi-internet .center-rekomendasi-internet p {
    margin-bottom: 0;
    color: var(--text-color);
    line-height: 13px;
}

.rekomendasi-internet .right-rekomendasi-internet {
    width: 18%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-right: 10px;
}

.rekomendasi-internet .right-rekomendasi-internet a {
    width: auto;
    /* background-color: var(--card-header); */
    border: 1px solid var(--hijau-tua);
    color: var(--hijau-tua);
    border-radius: 10px;
    text-align: center;
    padding: 10px 6px;
    text-decoration: none;
    font-size: 10px;
    line-height: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}


.rekomendasi-internet .right-rekomendasi-internet a i {
    font-size: 14px;
}

.rekomendasi-internet .right-rekomendasi-internet a:hover {
    background-color: var(--hijau-tua);
    border: 1px solid var(--hijau-tua);
    color: var(--cream-putih);
}


.faq-accordion {
    margin-bottom: 30px;
}

.faq-accordion .accordion-item {
    /* border-radius: 0; */
    margin-bottom: 10px;
    border: none;
}

.faq-accordion .accordion-item .accordion-header {
    border-left: 3px solid var(--orange);
    border-radius: 0;
}

.faq-accordion .accordion-item .accordion-collapse .accordion-body {
    background-color: var(--card-header);
    color: var(--hijau-tua);
}

.faq-accordion .accordion-item .accordion-header .accordion-button {
    padding: 8px 5px;
    background-color: var(--card-header);
    color: var(--hijau-tua);
    border-radius: 0;
}

.faq-accordion .accordion-item .accordion-header .accordion-button p {
    margin-bottom: 0;
}

.faq-accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) {
    border: none;
    background-color: var(--orange);
    border-radius: 0;
    color: #fff;
    box-shadow: none;
}

.faq-accordion .accordion-item .accordion-header .accordion-button:not(.collapsed)::after {
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.faq-accordion .accordion-item .accordion-header .accordion-button::after {
    /* set btn grey  */
    --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23b2b2b2'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}


.head-sistem-integrator {
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 10px;
    /* display: flex; */
    width: 100%;
    margin-bottom: 15px;
}

.head-sistem-integrator figure {
    width: 20%;
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.head-sistem-integrator figure img {
    width: 100px;
}

.head-sistem-integrator .title-text-sysin {
    font-size: 11px;
}

.head-sistem-integrator .desc-text-sysin {
    font-size: 10px;
}


.fasilitas-kelengkapan {
    border: 1px solid var(--border);
    border-radius: 10px;
    margin-bottom: 15px;
}

.fasilitas-kelengkapan h3 {
    font-size: 16px;
    font-weight: 600;
}

.fasilitas-kelengkapan .left-title span {
    margin-right: 0;
}

.fasilitas-kelengkapan p {
    padding: 10px 7px;
}


.kebijakan-paket {
    border: 1px solid var(--border);
    border-radius: 10px;
}

.kebijakan-paket h3 {
    font-size: 16px;
    font-weight: 600;
}

.kebijakan-paket .left-title span {
    margin-right: 0;
}

.kebijakan-paket p {
    padding: 10px 7px;
}

.kebijakan-paket .list-kebijakan-paket {
    padding: 5px 10px;
}

.kebijakan-paket .list-kebijakan-paket h3 {
    font-size: 12px;
    margin-bottom: 0;
    color: var(--hijau-tua);
}

.kebijakan-paket .list-kebijakan-paket p {
    margin-bottom: 0;
    padding: 0;
    color: var(--text-color);
}

.penawaran-pilihan-paket {
    display: flex;
    justify-content: center;
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 14px 14px 14px 10px;
}

.penawaran-pilihan-paket .row {
    width: 100%;
}

.list-pilihan-paket {
    margin-bottom: 14px;
}

.touch-target {
    display: inline-block;
    padding: 1px 1px;
    text-decoration: none;
}

.title-jadwal-shalat {
    text-align: center;
}

.title-jadwal-shalat h1 {
    font-size: 20px;
    color: var(--hijau-tua);
    font-weight: 600;
}

.title-jadwal-shalat h2 {
    font-size: 12px;
    color: var(--hijau-tua);
}

.title-jadwal-shalat p {
    font-size: 10px;
    color: var(--hijau-tua);
    margin-bottom: 0;
    line-height: 11px;
}

.desc-jadwal-shalat {
    margin-top: 10px;
}

.desc-jadwal-shalat p {
    margin-bottom: 0;
}

.desc-jadwal-shalat .item-jadwal-shalat {
    margin: 5px 0;
    background-color: var(--salam);
    border: 1px solid var(--border);
    padding: 5px 8px;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.item-jadwal-shalat h1 {
    font-size: 12px;
    text-align: center;
    margin-bottom: 0;
    font-weight: 600;
}

.item-jadwal-shalat p {
    font-size: 12px;
    text-align: center;
    margin-bottom: 0;
}


.list-surah {
    text-decoration: none;
}

.list-surah .item-surah {
    color: var(--text-color);
    background-color: var(--salam);
    border: 1px solid var(--border);
    padding: 5px 8px;
    border-radius: 10px;
    margin: 5px 0;
}

.list-surah .item-surah:hover {
    background-color: var(--border);
    border: 1px solid var(--border);
}

.list-surah p {
    margin-bottom: 0;
}

.list-surah .nama-surah {
    font-size: 11px;
    text-transform: none;
}

.list-surah .nama-surah:first-letter {
    text-transform: capitalize;

}

.list-surah .arti-surah {
    font-size: 9px;
}

.list-surah .desc-surah {
    font-size: 9px;
}

.arrow-surat {
    text-decoration: none;
    color: var(--hijau-tua);
    margin-top: 10px;
}

.arrow-surat:hover {
    font-weight: 600;
}

.text-paket {
    color: var(--hijau-tua);
    text-align: center;
    font-size: 9px;
}

.mosque figure {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100px;
    margin-top: 30px;
    margin-bottom: 0;
}

.mosque figure img {
    height: 100%;
}

.head-surat {
    color: var(--hijau-tua);
}

.head-surat h1 {
    text-align: center;
    font-size: 28px;
    margin-bottom: 3px;
}

.head-surat h2 {
    text-align: center;
    font-size: 14px;
    margin-bottom: 3px;
}

.head-surat h3 {
    text-align: center;
    font-size: 12px;
    margin-bottom: 13px;
}

.head-surat p {
    text-align: center;
    margin-bottom: 0;
    font-size: 10px;
    line-height: 12px;
}

.help {
    width: 100%;
    display: flex;
}

.help-left {
    width: 35%;
    padding-right: 20px;
}

.help-left .stick {
    position: sticky;
    top: 68px;
    overflow: hidden;
}

.help-left .stick .card .card-header.top {
    background-color: var(--cream-putih);
}

.help-left .stick .card .card-header a {
    text-decoration: none;
    color: var(--hijau-tua);
    font-size: 11px;
}

.help-left .stick .card .card-header a i {
    width: 15px;
    text-align: center;
}

.help-left .stick .card .card-header a:hover, .help-left .stick .card .card-header a.active {
    font-weight: 600;
}

.help-left .stick .card .card-header {
    background-color: var(--cream-muda);
}

.help-right {
    width: 65%;
    padding: 0;
}

.help-right .title-help, .help-right .title-help span {
    font-size: 16px;
    margin-bottom: 10px;
    color: var(--hijau-tua);
}

.help-right figure {
    width: 100%;
    margin-bottom: 20px;
    border-radius: 10px;
    overflow: hidden;
}

.content-help {
    margin-top: 15px;
}

.item-content-help .accordion {
    margin-bottom: 15px;
}

/* .item-content-help .accordion .accordion-item .accordion-header, .item-content-help .accordion .accordion-item .accordion-collapse .accordion-body {
    border: 1px solid var(--border) !important;
}

.item-content-help .accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) {
    background-color: var(--border);
    color: var(--hijau-tua);
} */

/* .item-content-help .accordion .accordion-header .accordion-button:not(.collapsed)::after {
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23b2b2b2'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
} */

.help-left .card .card-header a:active {
    font-weight: 600;
}

.nav-tentang-kami {
    display: none;
}

.search-box {
    display: none;
}

.tentang-halaman-utama:hover {
    font-weight: 400 !important;
}

.list-dzikir {
    background-color: #fff;
    padding: 0;
    text-decoration: none;
    border-radius: 10px;
}

.list-dzikir:not(.collapsed) {
    border: 1px solid var(--hijau-tua) !important;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.1);
}

.list-dzikir::after {
    display: none;

}

.list-dzikir figure {
    display: flex;
    justify-content: center;
    align-items: start;
    height: 110px;
    margin-bottom: 0;

}

.list-dzikir figure img {
    height: 100%;
}

.desc-dzikir {
    width: 100%;
    background-color: #fff;
    padding: 10px;
    border-radius: 0 0 10px 10px;
}

.desc-dzikir h1 {
    font-size: 12px;
    text-align: center;
    margin-bottom: 0;
}

.title-dzikir h1 {
    text-align: center;
    margin-bottom: 5px;
    margin-top: 20px;
    font-size: 16px;
    color: var(--hijau-tua);
}

.title-dzikir h2, .title-dzikir h2 {
    font-weight: 400;
    text-align: center;
    margin-bottom: 10px;
    font-size: 11px;
    padding: 0 10%;
    color: var(--hijau-tua);
}

.kontak-pusat-bantuan .item-bantuan a {
    font-size: 11px;
}

.card-kontak {
    border: none !important;
    /* padding: 10px; */
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.card-kontak .item-content-help .title-help {
    margin-bottom: 5px;
    font-size: 14px;
    text-align: center;
}

.card-kontak .item-content-help p {
    margin-bottom: 5px;
    text-align: center;
}

.kontak-pusat-bantuan {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.membantu {
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    padding: 20px;
}

.membantu-tidak .btn {
    width: 80px;
    margin-bottom: 10px;
}

.membantu h1 {
    font-size: 11px;
    font-weight: 400;
    margin-bottom: 15px;
}

.membantu p {
    font-size: 10px;
    margin-top: 10px;
    margin-bottom: 0;
}

.card.card-kontak {
    margin-top: 15px;
}


.list-bantuan-yty {
    background-color: #fff;
    padding: 0;
    text-decoration: none;
    border-radius: 10px;
}

.list-bantuan-yty:not(.collapsed) {
    border: 1px solid var(--hijau-tua) !important;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.08);
}

.list-bantuan-yty::after {
    display: none;

}

.list-bantuan-yty figure {
    display: flex;
    justify-content: center;
    align-items: start;
    height: 75px;
    margin-bottom: 0;
    padding: 10px;
}

.list-bantuan-yty figure img {
    height: 100%;
}

.title-faq-youtyliety h1 {
    text-align: left;
    margin-bottom: 25px;
    margin-top: 20px;
    font-size: 14px;
    color: var(--hijau-tua);
}

.title-faq-youtyliety h2, .title-faq-youtyliety h2 {
    font-weight: 400;
    text-align: center;
    margin-bottom: 10px;
    font-size: 11px;
    padding: 0 10%;
    color: var(--hijau-tua);
}


.desc-list-bantuan {
    width: 100%;
    background-color: #fff;
    padding: 7px;
    border-radius: 0 0 10px 10px;
}

.desc-list-bantuan h1 {
    font-size: 12px;
    text-align: center;
    margin-bottom: 0;
}


@media screen and (min-width: 320px) and (max-width: 479px) {
    .col-nav-kategori {
        display: none;
    }

    .col-nav-search {
        display: none;
    }

    .btn.btn-nav-icon.lonceng {
        display: none;
    }

    .col-nav-logo, .col-nav-button {
        width: 50%;
    }

    .index-item-kategori {
        width: 40px;
        margin-top: 10px;
        padding: 10px 0px;
    }

    .index-item-kategori {
        width: 45px;
        margin-top: 10px;
        padding: 0px;
    }

    .index-item-kategori img {
        width: 25px;
        height: 25px;
        margin: 0 auto;
    }

    .index-item-kategori h2 {
        font-size: 7px !important;
    }

    .left-title p {
        font-size: 11px;
    }

    .index-title-promo {
        font-size: 9px;
    }

    .index-merek-perangkat {
        gap: 5px;
    }

    .item-merek-perangkat {
        padding: 3px;
    }

    .item-merek-perangkat figure {
        height: 10px;
    }

    .footer-top {
        flex-wrap: wrap;
    }

    .col-footer-logo {
        width: 45%;
    }

    .col-footer-transaksi, .col-footer-pembayaran {
        width: 27%;
    }

    .col-footer-transaksi p, .col-footer-pembayaran p, .col-footer-informasi p, .col-footer-bantuan p {
        font-size: 10px;
        margin: 5px 0;
    }

    .item-kanal-transaksi img {
        height: 16px;
    }

    .col-footer-transaksi span {
        font-size: 7px;
    }

    .item-footer-pembayaran img {
        width: 50px;
    }

    .col-footer-informasi {
        width: 45%;
        padding-left: 5%;
        padding-right: 5%;
    }

    .col-footer-bantuan {
        width: 55%;
        padding-right: 0;
    }

    .carousel-image.display-produk {
        height: 8rem !important;
    }

    .list-dzikir figure {
        height: 59px;
    }

    .desc-dzikir h1 {
        font-size: 7px;
    }

    .desc-dzikir {
        padding: 5px;
    }

    .index-title-kategori p {
        padding: 0 2%;
        font-size: 10px;
    }

    .index-title-kategori figure img {
        width: 40px;
    }

    .item-kategori-produk-all figure {
        height: 35px;
        margin-top: 7px;
    }

    .item-kategori-produk-all {
        padding: 5px;
    }

    .produk-content-left {
        display: none;
    }

    .produk-content-right {
        width: 100%;
    }

    .produk-content-right .carousel-image.display-produk {
        height: 11rem !important;
    }

    .item-fasilitas p {
        padding: 2px;
        margin-left: 3px;
        line-height: 11px;
        font-size: 9px;
    }

    .penawaran-pilihan-paket {
        padding: 12px 6px;
    }

    .rekomendasi-internet .center-rekomendasi-internet p {
        font-size: 10px;
        line-height: 12px;
    }

    .rekomendasi-internet .left-rekomendasi-internet i {
        font-size: 14px;
    }

    .rekomendasi-internet .right-rekomendasi-internet a {
        margin-right: 5px;
    }

    .rekomendasi-internet .center-rekomendasi-internet {
        padding: 10px;
    }

    .head-sistem-integrator figure, .head-perangkat figure {
        width: 40%;
        padding: 5px;
    }

    .text-sysin {
        width: 60%;
    }

    .item-kategori-produk-all p {
        height: 75px;
        padding: 0 10px;
    }

    .icon-deskripsi-produk {
        height: 28px;
        padding: 3px;
        border-radius: 4px;
    }

    .item-deret-merek-perangkat {
        padding: 3px;
    }

    .item-deret-merek-perangkat figure {
        height: 9px;
    }

    .head-perangkat figure .desc-text-sysin.toko-ladang {
        margin-top: 120px;
    }

    .nav-tentang-kami {
        display: none !important;
    }

    .search-box {
        display: none !important;
    }

    .greeting-about {
        padding: 10px 22px !important;
    }

    .help-left {
        display: none;
    }

    .help-right {
        width: 100%;
    }
}

/* end   */