html body {
    overflow-x: hidden !important;
    width: 100%;
}
:root {
    --white: #ffffff;
    --dark: #000000;
  }
  
  
  .buttonnn {
    font-size: 2rem;
    font-family: "Montserrat", sans-serif;
    padding: 1rem;
    position: relative;
    cursor: pointer;
    color: var(--dark);
  }
  .buttonnn:after {
    content: "";
    background: var(--dark);
    position: absolute;
    bottom: 0;
    height: 3px;
    width: 100%;
    left: 0;
    right: 0;
    transition: all cubic-bezier(0, 0.96, 0.58, 1.1) 1s;
    bottom: -5px;
    opacity: 0;
  }
  .buttonnn:hover:after {
    bottom: 15px;
    opacity: 1;
    transition: all cubic-bezier(0, 0.96, 0.58, 1.1) 1s;
  }
.chat-box {
    height: 400px;
    overflow-y: scroll;
    border: 1px solid #ddd;
    border-radius: 10px;
    padding: 10px;
}
.message {
    display: flex;
    margin-bottom: 15px;
}
.message .avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-right: 10px;
}
.message .content {
    max-width: 70%;
}
.message.sent .content {
    background-color: #ffc107;
    color: white;
    border-radius: 10px;
    padding: 10px;
    margin-left: auto;
}
.message.received .content {
    background-color: #f1f1f1;
    border-radius: 10px;
    padding: 10px;
}
.chat-input {
    border-radius: 20px;
}
.suggestions {
    margin-top: 10px;
}
.suggestion-btn {
    margin-right: 5px;
    margin-bottom: 5px;
}

.custom-prev,
.custom-next,
.custom-prev2,
.custom-next2 {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: black;
    border: none;
    padding: 10px;
    cursor: pointer;
}


.custom-prev {
    left: -15px;
}

.custom-next {
    right: -15px;
}
.custom-prev2 {
    left: -15px;
}

.custom-next2 {
    right: -15px;
}

/* Menggunakan Font Awesome untuk ikon kustom (opsional) */
.custom-prev::before,
.custom-next::before, 
.custom-prev2::before,
.custom-next2::before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 20px;
}
.custom-prev::before {
    content: '\f104'; /* Ikon panah kiri */
}
.custom-next::before {
    content: '\f105'; /* Ikon panah kanan */
} 
.custom-prev2::before {
    content: '\f104'; /* Ikon panah kiri */
}
.custom-next2::before {
    content: '\f105'; /* Ikon panah kanan */
} 

.home-section {
    height: 100vh;
    background-size: cover;
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../images/homepict.png);
    width: 100%;
}

.isi-index2-portofolio {
    background-color: #D79D1B;
    position: relative;
    height: 100%;
}

.isi-history-page {
    overflow-x: hidden;
}

.isi-portofolio-page {
    overflow-x: hidden;
}

.isi-about-page {
    overflow-x: hidden;
}

.isi-sipil-page {
    overflow-x: hidden;
}
/* .galeri-perijinan{
    height: 100vh ;
    overflow: hidden;
}
.galeri-perencanaan{
    height: 100vh ;
    overflow: hidden;
}
.galeri-management{
    height: 100vh ;
    overflow: hidden;
}
.galeri-bisnis{
    height: 100vh ;
    overflow: hidden;
} */

.slick-prev, .slick-next {
    font-size: 24px;
    color: black;
    z-index: 1;
}

.cardabt {
    background-color: #e1e1e1;
    border-radius: 18px;
    height: 285px;
}
.cardabt:hover {
    color: white;
}

.cardabt2 {
    background-color: #ffffff;
    height: 300px;
    border-radius: 18px;
}
.cardabt2:hover {
    background-color: #D79D1B;
    color: white;
    height: 300px;
    border-radius: 18px;
    transition: .5s ease;
}

.cardabt:hover #abt1 {
    content: url('images/moke1.png');
}
.cardabt:hover #abt2 {
    content: url('images/mok2.png');
}
.cardabt:hover #abt3 {
    content: url('images/mok3.png');
}
.cardabt:hover #abt4 {
    content: url('images/mok4.png');
}

/* Tambahkan efek transisi agar perubahan gambar lebih halus */
.cardabt img {
    transition: all 0.7s ease;
}

.cardnews {
    background-color: #ffffff;
    border-radius: 18px;
    border: solid 1px rgba(124, 124, 124, 0.379);
    transition: .5s ease;
}

.cardnews:hover {
    background-color: #ffffff;
    border-radius: 18px;
    border: solid 1px rgba(124, 124, 124, 0.379);
    transform: translateY(10%);
}


.btn-warning {
    background-color: #D79D1B;
}

.tentang-page {
    height: 35vh;
    background-color: #D79D1B;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
}

.isi-page {
    height: 70vh;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
}

.isi1-page {
    height: 63vh;
    background-color: #E1E1E1;
}

.isi2-page {
    height: 130vh;
    background-color: #D79D1B;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
}

.bungklus {
    top: 105vh;
}

.bg-secondary {
    background-color: #E1E1E1 !important;
}


.footer-page {
    height: 100%;
    background-size: cover;
    /* Sama dengan object-fit: cover */
    background-position: center;
    /* Fokus pada bagian bawah gambar */
    width: 100%;
    border-top-left-radius: 47px;
    border-top-right-radius: 47px;
}

.overlay-footer {
    background-color: #2A353D;
    width: 100%;
    height: 100%;
    border-top-left-radius: 47px;
    border-top-right-radius: 47px;
}

.modal-content {
    background-color: #D79D1B;
    /* Sesuaikan warna jingga sesuai dengan gambar */
    border-radius: 20px;
    /* Sudut melengkung */
    padding: 20px;
    /* Ruang dalam */
}

.modal-header {
    border-bottom: none;
    /* Menghilangkan garis bawah di header */
}

.modal-header .btn-close {
    background-color: rgb(255, 255, 255);
    /* Sesuaikan warna tombol tutup "X" */
    border-radius: 50%;
    /* Bentuk tombol bulat */
    padding: 5px;
}

.modal-body {
    color: rgb(0, 0, 0);
    /* Ubah warna teks jika diinginkan */
    font-size: 14px;
    /* Sesuaikan ukuran font */
}

/* Style for custom modal */
.custom-modal .modal-dialog2 {
    max-width: 800px;
    /* Wider modal */
}

.custom-modal-content2 {
    background-color: #1e1e1e;
    /* Dark background for modal */
    color: #fff;
    /* White text color */
    border-radius: 15px;
    /* Rounded corners */
}

.custom-modal-content .modal-header2 {
    background-color: #ffcc00;
    /* Yellow header */
    color: #000;
    /* Black text in header */

}

/* /--responsive--/ */
/* 1920 x 1080 */
@media (max-width: 1920px) {
    .menu-samping {
        display: none !important;
    }

    .hiddenmenu {
        display: none !important;
    }

    .ris {
        right: 25vh !important;
        bottom: -30vh !important;
    }

    .ros {
        left: 25vh !important;
        bottom: -30vh !important;
    }
    .ras{
        left: 65vh !important;
        bottom: 5vh !important;
    }
    .rus{
        right: 65vh !important;
        bottom: 5vh !important;
    }
    .subscribe-form .btn-light {
        font-size: 1.7rem !important;
    }

    .home-section h1 {
        font-size: 4rem !important;
        position: relative;
    }

    /* .isi-index2-portofolio {
        height: 138vh !important;
    } */

    /* .overlay-footer {
        height: 55vh !important;
    } */

    .bulet .rounded-circle {
        width: 55px !important;
        height: 55px !important;
    }

    .bulet .rounded-circle i {
        font-size: 2rem !important;
    }

    .baten .btn-light {
        font-size: 1.8rem !important;
    }

    .bulet1 {
        top: 19vh !important;
    }

    .bulet2 {
        top: 10vh !important;
        left: 695px !important;
    }

    .bulet3 {
        top: 21vh !important;
        right: 850px !important;
    }

    .bulet4 {
        top: 37.5vh !important;
        right: 430px !important;
    }

    .bulet5 {
        top: 28vh !important;
        right: 161px !important;
    }

    .tek {
        top: 11vh !important;
    }

    .tek1 {
        top: 6vh !important;
        left: 590px !important;
    }

    .tek2 {
        top: 26vh !important;
        right: 825px !important;
    }

    .tek3 {
        top: 43vh !important;
        right: 405px !important;
    }

    .tek4 {
        top: 18vh !important;
        right: 134px !important;
    }
}

@media (max-width: 1780px) {
    .ris {
        right: 20vh !important;
        bottom: -30vh !important;
    }

    .ros {
        left: 20vh !important;
        bottom: -30vh !important;
    }
    .ras {
        left: 57vh !important;
        bottom: 5vh !important;
    }
    .rus {
        right: 57vh !important;
        bottom: 5vh !important;
    }

    /* .overlay-footer {
        height: 47vh !important;
    } */

    /* .isi-index2-portofolio {
        height: 122vh !important;
    } */

    .text-portfolio2 {
        font-size: 1rem;
    }

    .bulet1 {
        top: 16vh !important;
    }

    .bulet2 {
        left: 652px !important;
    }

    .bulet3 {
        top: 17.5vh !important;
        right: 800px !important;
    }

    .bulet4 {
        top: 31vh !important;
        right: 385px !important;
    }

    .bulet5 {
        top: 24vh !important;
        right: 145px !important;
    }

    .tek1 {
        left: 560px !important;
    }

    .tek2 {
        top: 22vh !important;
        right: 778px !important;
    }

    .tek3 {
        top: 36vh !important;
        right: 362px !important;
    }

    .tek4 {
        top: 15vh !important;
        right: 122px !important;
    }
}

/* 1366 x 768 */
@media (max-width:1368px) {
    .subscribe-form .btn-light {
        font-size: 1.2rem !important;
    }

    .home-section h1 {
        font-size: 3.2rem !important;
        position: relative;
        
    }

    .baten .btn-light {
        font-size: 1.2rem !important;
    }
    .ros {
        left: 13vh !important;
        bottom: -35vh !important;
    }
    .ris {
        right: 13vh !important;
        bottom: -35vh !important;
    }
    .ras {
        left: 80vh !important;
    }

    .rus {
        right: 80vh !important;
    }


    .bulet1 {
        top: 17.5vh !important;
    }

    .bulet2 {
        left: 501px !important;
        top: 12vh !important;
    }

    .bulet3 {
        top: 19vh !important;
        right: 575px !important;
    }

    .bulet4 {
        top: 10.5vh !important;
        right: 348px !important;
    }

    .bulet5 {
        top: 28vh !important;
        right: 106px !important;
    }

    .tek {
        top: 12vh !important;
    }
    .tek1 {
        left: 395px !important;
        top: 7vh !important;
    }

    .tek2 {
        top: 25vh !important;
        right: 550px !important;
    }

    .tek3 {
        top: -3vh !important;
        right: 325px !important;
    }

    .tek4 {
        top: 15vh !important;
        right: 85px !important;
    }

    .text-portfolio {
        font-size: 1.1rem;
    }

    .text-portfolio1 {
        font-size: 0.8rem;
    }

    .text-portfolio2 {
        font-size: 0.9rem;
    }

    /* .isi-index2-portofolio {
        position: relative;
        height: 164vh !important;
    } */


    /* .overlay-footer {
        height: 59vh !important;
    } */
}

/* 1280 x 780 */
@media(max-width:1281px) {
    .pss{
        font-size: 2rem !important;
    }
    .isi-perajinan-page{
        overflow-x: hidden !important;
    }
    .isi-perencanaan-page{
        overflow-x: hidden !important;
    }
    .isi-management-page{
        overflow-x: hidden !important;
    }
    .isi-bisnis-page{
        overflow-x: hidden !important;
    }
    .ros {
        left: 7vh !important;
    }

    .ris {
        right: 7vh !important;
    }
    .ras {
        left: 78vh !important;
    }

    .text-portfolio2 {
        font-size: 0.936rem;
    }


    /* .overlay-footer {
        height: 58vh !important;
    } */

    /* .isi-index2-portofolio {
        position: relative;
        height: 164vh !important;
    } */

    .bulet1 {
        top: 16.5vh !important;
    }

    .bulet2 {
        left: 470px !important;
        top: 12vh !important;
    }

    .bulet3 {
        top: 18vh !important;
        right: 555px !important;
    }

    .bulet4 {
        top: 9.5vh !important;
        right: 326px !important;
    }

    .bulet5 {
        top: 28vh !important;
        right: 98px !important;
    }

    .tek {
        top: 10vh !important;
    }

    .tek1 {
        left: 368px !important;
        top: 7vh !important;
    }

    .tek2 {
        top: 26vh !important;
        right: 531px !important;
    }

    .tek3 {
        top: -3vh !important;
        right: 296px !important;
    }

    .tek4 {
        top: 15vh !important;
        right: 70px !important;
    }

}

/* 1151 x 600 */
@media(max-width:1151px) {
    .baten .btn-light {
        font-size: 0.8rem !important;
    }

    .bulet .rounded-circle {
        width: 45px !important;
        height: 45px !important;
    }

    .text-portfolio2 {
        font-size: 0.784rem;
    }

    .teks-nav {
        font-size: 0.94rem !important;
    }

    .kotak img {
        width: 90% !important;
    }

    .home-section h1 {
        font-size: 2.4rem !important;
    }

    .cardnews p {
        font-size: 0.95rem;
    }

    .text-portfolio1 {
        font-size: 1.2rem;
    }

    /* .isi-index2-portofolio {
        position: relative;
        height: 215vh !important;
    } */

    .ros {
        left: 12vh !important;
        bottom: -40vh !important;
    }

    .ris {
        right: 12vh !important;
        bottom: -40vh !important;
    }

    .ras {
        left: 101vh !important;
        bottom: 8vh !important;
    }

    .rus {
        right: 104vh !important;
        bottom: 8vh !important;
    }

    .tek1 {
        left: 320px !important;
    }

    .tek2 {
        top: 31vh !important;
        right: 476px !important;
    }

    .tek3 {
        top: 47vh !important;
        right: 212px !important;
    }

    .tek4 {
        top: 14vh !important;
        right: 62px !important;
    }

    .bulet1 {
        top: 19.5vh !important;
    }

    .bulet2 {
        left: 423px !important;
    }

    .bulet3 {
        top: 21.5vh !important;
        right: 500px !important;
    }

    .bulet4 {
        top: 37vh !important;
        right: 235px !important;
    }

    .bulet5 {
        top: 32vh !important;
        right: 85px !important;
    }



    .text-home {
        font-size: 2.8rem !important;
    }

    /* .overlay-footer {
        height: 76vh !important;
    } */
}

/* 1080 x 576 */
@media(max-width:1081px) {
    .pss{
        font-size: 1.9rem !important;
    }
    .home-section h1 {
        font-size: 2.2rem !important;
    }
    
    .card-berita2 {
        width: 9rem !important;
    }
    .ris {
        right: 9vh !important;
    }
    .ros {
        left: 9vh !important;
    }

    .ras {
        left: 108vh !important;
        bottom: 8vh !important;
    }

    .rus {
        right: 106vh !important;
        bottom: 8vh !important;
    }

    .kotak img {
        width: 86% !important;
    }

    /* .overlay-footer {
        height: 79vh !important;
    } */

    /* .isi-index2-portofolio {
        position: relative;
        height: 217vh !important;
    } */

    .teks-nav {
        font-size: 0.84rem !important;
    }

    .text-home {
        font-size: 2.6rem !important;
    }

    .bulet2 {
        left: 398px !important;
    }

    .bulet3 {
        top: 20.5vh !important;
        right: 430px !important;
    }

    .bulet4 {
        top: 35vh !important;
        right: 222px !important;
    }

    .bulet5 {
        right: 78px !important;
    }

    .tek1 {
        left: 300px !important;
    }

    .tek2 {
        top: 32vh !important;
        right: 408px !important;
    }

    .tek3 {
        top: 47vh !important;
        right: 201px !important;
    }

    .text-portfolio1 {
        font-size: 0.72rem;
    }

    .text-portfolio {
        font-size: 0.83rem;
    }
}

@media(max-width:992px) {
    .decor{
        display: none;
    }
    .pss{
        font-size: 1.5rem !important;
    }
    .galeri-perijinan {
        height: 105vh !important;
    }
    .galeri-perencanaan {
        height: 105vh !important;
    }
    .galeri-management {
        height: 105vh !important;
    }
    .galeri-bisnis {
        height: 105vh !important;
    }

    .home-section h1 {
        font-size: 2rem !important;
    }


    .cardnews p {
        font-size: 0.66rem;
    }

    .isi-portofolio-page .img-card img {
        width: 166px !important;
    }

    .ros {
        left: 22vh !important;
        bottom: -35vh !important;
    }

    .ris {
        right: 22vh !important;
        bottom: -35vh !important;
    }

    .bulet1 {
        top: 17.5vh !important;
    }

    .bulet2 {
        top: 14vh !important;
        left: 365px !important;
    }

    .bulet3 {
        top: 19vh !important;
        right: 415px !important;
    }

    .bulet4 {
        top: 32vh !important;
        right: 205px !important;
    }

    .bulet5 {
        top: 28vh !important;
        right: 68px !important;
    }

    .tek {
        top: 11vh !important;
    }

    .tek1 {
        left: 275px !important;
    }

    .tek2 {
        top: 30vh !important;
        right: 392px !important;
    }

    .tek3 {
        top: 42vh !important;
        right: 185px !important;
    }



    .fitt {
        position: relative;
        top: -186px !important;
    }

    .barc {
        width: 13% !important;
    }

    /* .overlay-footer {
        height: 124vh !important;
    } */

    /* .isi-index2-portofolio {
        position: relative;
        height: 220vh !important;
    } */

    .card-berita2 {
        position: relative;
        left: 73px;
    }

    .teks-nav {
        font-size: 0.73rem !important;
    }

    .text-home {
        font-size: 2.3rem !important;
    }

    .cardabt2 h5 {
        font-size: 1rem !important;
    }


    .logo-page h1 {
        font-size: 1.8rem !important;
    }
}

/* 780 x 487 */
@media(max-width:781px) {
    .pss{
        font-size: 1.3rem !important;
    }
    
    
    .card-berita2 {
        position: relative;
        left: -12px;
        width: 9rem !important;
    }
    .kecil {
        font-size: 0.77rem !important;
    }

    .tulisan-navbar a {
        position: relative;
        top: -3px;
        font-size: 0.7rem !important;
    }

    .subscribe-form .btn-light {
        font-size: 1rem !important;
    }

    .bulet .rounded-circle i {
        font-size: 1.5rem !important;
    }

    .home-section h1 {
        font-size: 2rem !important;
    }

    /* .overlay-footer {
        height: 148vh !important;
    } */

    /* .isi-index2-portofolio {
        position: relative;
        height: 232vh !important;
    } */

    .logo {
        position: relative;
        left: 10px;
    }

    .tulisan-navbar{
        display: none !important;
    }
    .navbar-tulisan{
        display: none !important;
    }

    .ros {
        left: 127vh !important;
        bottom: 6vh !important;
        display: none !important;
    }

    .ris {
        right: 127vh !important;
        bottom: 6vh !important;
        display: none !important;
    }

    .ras {
        left: 126vh !important;
        bottom: 8vh !important;
    }

    .rus {
        right: 126vh !important;
        bottom: 8vh !important;
    }

    .bulet1 {
        top: 17.5vh !important;
    }

    .bulet2 {
        top: 11vh !important;
        left: 289px !important;
    }

    .bulet3 {
        top: 19vh !important;
        right: 315px !important;
    }

    .bulet4 {
        top: 31.5vh !important;
        right: 152px !important;
    }

    .bulet5 {
        top: 22vh !important;
        right: 50px !important;
    }

    .tek {
        top: 7vh !important;
    }

    .tek1 {
        left: 208px !important;
        top: 5vh !important;
    }

    .tek2 {
        top: 28vh !important;
        right: 300px !important;
    }

    .tek3 {
        top: 40vh !important;
        right: 135px !important;
    }

    .tek4 {
        top: 12vh !important;
        right: 32px !important;
    }

    .home-section .btn-warning {
        font-size: 0.6rem !important;
    }

    .text-home {
        font-size: 1.89rem !important;
    }

    .bulet .rounded-circle {
        width: 30px !important;
        height: 30px !important;
    }

    .bulet .rounded-circle i {
        font-size: 1.1rem !important;
    }

    .bulet {
        left: -29px !important;
    }

    .kotak img {
        width: 60% !important;
    }

    .teks-nav {
        font-size: 0.56rem !important;
    }



    .isi-index2-portofolio .col-6 .card .card-body {
        font-size: 0.8rem !important;
    }

    .menu-samping {
        display: grid !important;
        position: absolute;
        right: 25px;
    }

    #hidemenu2 {
        position: absolute;
        top: 0;
        right: 0;
        background: #D79D1B;
        width: 90%;
        height: 100vh;
        transform: translateX(100%);
        transition: transform 0.5s ease-in-out;
        z-index: 1000;
    }

    #hidemenu2.show {
        transform: translateX(0);
    }
    #hidemenu2 {
        position: absolute;
        top: 0;
        right: 0;
        width: 90%;
        transform: translateX(100%);
        transition: transform 0.5s ease-in-out;
        z-index: 1000;
    }

    #hidemenu2.show {
        transform: translateX(0);
    }

    .hiddenmenu {
        display: grid !important;
        position: absolute;
        top: 0;
        right: -300px;
        /* Menu tersembunyi di luar layar */
        background: #f8f9fa;
        width: 300px;
        height: 100vh;
        transition: right 0.5s ease-in-out;
        z-index: 1000;
        padding: 20px;
    }

    .hiddenmenu h2{
        font-size: 1.5rem !important;
    }

    .hiddenmenu.show {
        right: 0;
        /* Menu ditampilkan */
    }

    /* Style untuk tombol tutup menu */
    #closemenu {
        cursor: pointer;
        font-size: 1.5rem;
        margin-bottom: 20px;
    }

    /* Style untuk tombol show menu */
    #showmenu {
        margin-top: 20px;
    }

    /* Style untuk ikon mata */
    #eyemenu {
        font-size: 2rem;
        cursor: pointer;
    }
}

@media(max-width:769px) {
    .pss{
        font-size: 1.2rem !important;
    }
    .teks-nav {
        font-size: 0.546rem !important;
    }
    .card-berita2 {
        position: relative;
        left: -15px;
        width: 9rem !important;
    }
}

@media(max-width:668px) {
    .pss{
        font-size: 1rem !important;
    }
    .card-berita2 {
        position: relative;
        left: 38px;
        width: 13rem !important;
    }
    .ras {
        left: 127vh !important;
        bottom: 8vh !important;
    }
    .logo {
        position: relative;
        left: -45px;
    }
    .rir {
        position: relative;
        left: 220px;
    }
    .ror {
        position: relative;
        left: 120px;
    }
    .rer {
        position: relative;
        right: 120px;
    }
    .rar {
        position: relative;
        right: 38px;
    }
    .bulet1 {
        top: 16.5vh !important;
    }

    .bulet2 {
        top: 13vh !important;
        left: 250px !important;
    }

    .bulet3 {
        top: 17vh !important;
        right: 265px !important;
    }

    .bulet4 {
        top: 27.5vh !important;
        right: 125px !important;
    }

    .bulet5 {
        top: 24vh !important;
        right: 38px !important;
    }

    .tek {
        top: 8vh !important;
    }

    .tek1 {
        left: 188px !important;
        top: 5vh !important;
    }

    .tek2 {
        top: 28vh !important;
        right: 255px !important;
    }

    .tek3 {
        top: 38vh !important;
        right: 114px !important;
    }

    .tek4 {
        top: 12vh !important;
        right: 17px !important;
    }

    .isi-portofolio-page .img-card img {
        width: 208px !important;
    }

    .subscribe-form .btn-light {
        font-size: 0.6rem !important;
    }


    /* .isi-index2-portofolio {
        position: relative;
        height: 405vh !important;
    } */

    .menu-samping {
        display: grid !important;
        position: absolute;
        right: 25px;
    }

    #hidemenu {
        position: absolute;
        top: 0;
        right: 0;
        background: #D79D1B;
        width: 90%;
        height: 100vh;
        transform: translateX(100%);
        transition: transform 0.5s ease-in-out;
        z-index: 1000;
    }

    #hidemenu.show {
        transform: translateX(0);
    }

    .hiddenmenu {
        display: grid !important;
        position: absolute;
        top: 0;
        right: -300px;
        /* Menu tersembunyi di luar layar */
        background: #f8f9fa;
        width: 300px;
        height: 100vh;
        transition: right 0.5s ease-in-out;
        z-index: 1000;
        padding: 20px;
    }

    .hiddenmenu.show {
        right: 0;
        /* Menu ditampilkan */
    }

    /* Style untuk tombol tutup menu */
    #closemenu2 {
        cursor: pointer;
        font-size: 1.5rem;
        margin-bottom: 20px;
    }

    /* Style untuk tombol show menu */
    #showmenu {
        margin-top: 20px;
    }

    /* Style untuk ikon mata */
    #eyemenu {
        font-size: 2rem;
        cursor: pointer;
    }

   

    .home-section h1 {
        font-size: 1.6rem !important;
    }



    .home-section h1 {
        font-size: 1.6rem !important;
    }

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

    .navbar-tulisan {
        width: 297px !important;
        display: none !important;
    }

    .tulisan-navbar {
        display: none;
    }
    /* .overlay-footer {
        height: 176vh !important;
    } */
    .barc {
        width: 19% !important;
    }
}

@media(max-width:580px) {
    .pss{
        font-size: .8rem !important;
    }
}

@media(max-width:451px) {
    .ggs{
        display: none !important;
    }
    .ggs2{
        display: block !important;
    }
    .psda{
        display: none !important;
    }
    .card-berita2 {
        position: relative;
        left: 38px;
        width: 10rem !important;
    }
    .logo-page .autoplay h3{
        font-size: 1rem !important;
    }
    .rir {
        position: relative;
        left: 176px;
    }
    .ror {
        position: relative;
        left: 98px;
    }
    .rer {
        position: relative;
        right: 98px;
    }
    .rar {
        position: relative;
        right: -4px;
    }
    .galeri-perijinan {
        height: 275vh !important;
    }
    .galeri-perencanaan {
        height: 275vh !important;
    }
    .galeri-management {
        height: 275vh !important;
    }
    .galeri-bisnis {
        height: 275vh !important;
    }
    .tek h1{
        font-size: 1.3rem !important;
    }
    .tek1 h1{
        font-size: 1.3rem !important;
    }
    .tek2 h1{
        font-size: 1.3rem !important;
    }
    .tek3 h1{
        font-size: 1.3rem !important;
    }
    .tek4 h1{
        font-size: 1.3rem !important;
    }
    .tek {
        top: 7vh !important;
        left: 78px !important;
    }
    .tek1 {
        left: 140px !important;
        top: 6vh !important;
    }
    .tek2 {
        top: 21vh !important;
        right: 160px !important;
    }
    .tek3 {
        top: 29vh !important;
        right: 70px !important;
    }
    .tek4 {
        top: 10vh !important;
        right: 13px !important;
    }
    .bulet1 {
        top: 13vh !important;
    }
    .bulet2 {
        top: 11vh !important;
        left: 177px !important;
    }
    .bulet3 {
        top: 14.5vh !important;
        right: 155px !important;
    }
    .bulet4 {
        top: 21.5vh !important;
        right: 65px !important;
    }
    .bulet5 {
        top: 18vh !important;
        right: 10px !important;
    }
    .bulet1 img{
        width: 30px !important;
        height: 30px !important;
    }
    .bulet2 img{
        width: 30px !important;
        height: 30px !important;
    }
    .bulet3 img{
        width: 30px !important;
        height: 30px !important;
    }
    .bulet4 img{
        width: 30px !important;
        height: 30px !important;
    }
    .bulet5 img{
        width: 30px !important;
        height: 30px !important;
    }
  
    .barc {
        width: 22% !important;
    }
    /* .overlay-footer {
        height: 173vh !important;
    } */
    .home-section h1 {
        font-size: 1.1rem !important;
    }
    .bungkus {
        width: 513px !important;
    }
    /* .isi-index2-portofolio {
        position: relative;
        height: 395vh !important;
    } */
}
/* @media(max-width:430px){
    .isi-index2-portofolio {
        position: relative;
        height: 208vh !important;
    }
    .subscribe-form .btn-light {
        position: relative;
        right: 25px;
        font-size: 1.5rem !important;
    }
    .home-section h1 {
        top: -25px !important;
        font-size: 3rem !important;
    }
    .galeri-perijinan {
        height: 142vh !important;
    }
    .galeri-perencanaan {
        height: 142vh !important;
    }
    .galeri-management {
        height: 142vh !important;
    }
    .galeri-bisnis {
        height: 142vh !important;
    }
    .ros {
        left: 67vh !important;
        bottom: 6vh !important;
    }
    .ris {
        right: 66vh !important;
        bottom: 6vh !important;
    }
    .bungkus {
        width: 551px !important;
    }
    .bulet1 {
        top: 7vh !important;
    }
    .bulet2 {
        top: 6vh !important;
        left: 171px !important;
    }
    .bulet3 {
        top: 7.5vh !important;
        right: 155px !important;
    }
    .bulet4 {
        top: 10.5vh !important;
        right: 61px !important;
    }
    .bulet5 {
        top: 10vh !important;
        right: 10px !important;
    }
    .tek {
        top: 4vh !important;
        left: 72px !important;
    }
    .tek1 {
        left: 132px !important;
        top: 3vh !important;
    }
    .tek2 {
        top: 11vh !important;
        right: 160px !important;
    }
    .tek3 {
        top: 14vh !important;
        right: 66px !important;
    }
    .tek4 {
        top: 6vh !important;
        right: 13px !important;
    }
    .rir {
        position: relative;
        left: 170px;
    }
    .ror {
        position: relative;
        left: 90px;
    }
    .rer {
        position: relative;
        right: 90px;
    }
    .rar {
        position: relative;
        right: 0px;
        font-size: 0.966rem;
    }
    .baten .btn-light {
        width: 20vh !important;
        height: 5vh !important;
        font-size: 1.2rem !important;
    }
    .overlay-footer {
        height: 95vh !important;
    }
} */
@media(max-width:415px) {
    .rir {
        position: relative;
        left: 160px;
    }
    .ror {
        position: relative;
        left: 85px;
    }
    .rer {
        position: relative;
        right: 85px;
    }
    .rar {
        position: relative;
        right: 0px;
        font-size: 0.928rem !important;
    }
    .bungkus {
        width: 477px !important;
    }
    .galeri-perijinan {
        height: 255vh !important;
    }
    .galeri-perencanaan {
        height: 255vh !important;
    }
    .galeri-management {
        height: 255vh !important;
    }
    .galeri-bisnis {
        height: 255vh !important;
    }
    .home-section h1 {
        font-size: 1rem !important;
    }
    .bulet2 {
        top: 11vh !important;
        left: 165px !important;
    }
    .bulet3 {
        top: 14vh !important;
        right: 140px !important;
    }
    .bulet4 {
        top: 20.5vh !important;
        right: 57px !important;
    }
    .tek1 {
        left: 134px !important;
        top: 6vh !important;
    }
    .tek2 {
        top: 21vh !important;
        right: 145px !important;
    }
    .tek3 {
        top: 28vh !important;
        right: 63px !important;
    }
    /* .overlay-footer {
        height: 176vh !important;
    } */
    /* .isi-index2-portofolio {
        position: relative;
        height: 395vh !important;
    } */

    .subscribe-form .btn-light {
        position: relative;
        right: 25px;
        font-size: 0.6rem !important;
    }
}

@media(max-width:385px) {
    .card-berita2 {
        position: relative;
        left: 9px;
        width: 10rem !important;
    }
    .rir {
        position: relative;
        left: 146px;
    }
    .ror {
        position: relative;
        left: 75px;
    }
    .rer {
        position: relative;
        right: 75px;
    }
    .rar {
        position: relative;
        right: 2px;
        font-size: 0.856rem !important;
    }
    .bungkus {
        width: 447px !important;
    }
    .tek {
        top: 8vh !important;
        left: 70px !important;
    }
    .tek1 {
        left: 122px !important;
        top: 6vh !important;
    }
    .tek2 {
        top: 20vh !important;
        right: 135px !important;
    }
    .tek3 {
        top: 26vh !important;
        right: 56px !important;
    }
    .tek4 {
        top: 10vh !important;
        right: 4px !important;
    }
    .bulet2 {
        top: 11vh !important;
        left: 155px !important;
    }
    .bulet3 {
        top: 13.5vh !important;
        right: 130px !important;
    }
    .bulet4 {
        top: 18.5vh !important;
        right: 49px !important;
    }
    .bulet5 {
        top: 18vh !important;
        right: 3px !important;
    }
    /* .overlay-footer {
        height: 174vh !important;
    } */

}

@media(max-width:376px) {
    .rir {
        position: relative;
        left: 142px;
    }
    .rar {
        position: relative;
        right: 2px;
        font-size: 0.834rem !important;
    }
    .home-section h1 {
        font-size: 0.9rem !important;
    }
    .bungkus {
        width: 438px !important;
    }
}

@media(max-width:321px) {
    .card-berita2 {
        position: relative;
        left: -6px;
        width: 9rem !important;
    }
    .rir {
        position: relative;
        left: 115px;
    }
    .ror {
        position: relative;
        left: 55px;
    }
    .rer {
        position: relative;
        right: 55px;
    }
    .rar {
        position: relative;
        right: 2px;
        font-size: 0.7rem !important;
    }
    .galeri-perijinan {
        height: 205vh !important;
    }
    .galeri-perencanaan {
        height: 205vh !important;
    }
    .galeri-management {
        height: 205vh !important;
    }
    .galeri-bisnis {
        height: 205vh !important;
    }
    .home-section h1 {
        font-size: 0.76rem !important;
    }
    .cardabt h5{
        font-size: 1rem !important;
    }
    .cardnews p {
        font-size: 0.54rem;
    }
    .bulet1 {
        top: 12vh !important;
    }
    .bulet2 {
        top: 11vh !important;
        left: 131px !important;
    }
    .bulet3 {
        top: 11.5vh !important;
        right: 95px !important;
    }
    .bulet4 {
        top: 16.5vh !important;
        right: 35px !important;
    }
    .bulet5 {
        top: 15vh !important;
        right: 0px !important;
    }
    .tek {
        top: 6vh !important;
        left: 38px !important;
    }
    .tek1 {
        left: 95px !important;
        top: 6vh !important;
    }
    .tek2 {
        top: 18vh !important;
        right: 100px !important;
    }
    .tek3 {
        top: 23vh !important;
        right: 40px !important;
    }
    .isi-about-page .cardabt h5{
        font-size: 1rem !important;
    }
    .baten{
        right: 10px !important;
    }
    .kotak img {
        width: 63% !important;
    }
    /* .isi-index2-portofolio {
        position: relative;
        height: 420vh !important;
    } */
    .bungkus {
        width: 383px !important;
    }
    .subscribe-form .btn-light {
        position: relative;
        right: 40px;
        font-size: 0.6rem !important;
    }
  
}