

#pengalaman {
	overflow: auto;
}
#serkom {
	overflow: auto;
}
#alat_uji {
	overflow: auto;
}

/* Gaya untuk mengubah warna toggler icon saat di-scroll */
#navbar.navbar-scrolled .navbar-toggler-icon {
    background-color: black !important;
}

 /*untuk layar device berukuran kecil*/


#navbar_landing {
    background-color: rgba(224, 251, 255, 0,1);

    transition: background-color 0.3s ease-in-out;
}

#navbar{
    background-color: #0ffff7; /* Warna navbar saat di-scroll */
}

#navbar_landing.scrolled {
background-color: #0ffff7; /* Warna navbar saat di-scroll */
color: black;
}

#navbar_landing a {
    color: white; /* Warna awal teks nav-link */
    font-weight: 700 !important;

    transition: color 0.3s ease-in-out;
}
#navbar_landing a.active {
    color: white; /* Warna awal teks nav-link */
    /* text-shadow: rgb(255, 255, 255) 1px 0px 0px, rgb(255, 255, 255) 0.540302px 0.841471px 0px, rgb(255, 255, 255) -0.416147px 0.909297px 0px, rgb(255, 255, 255) -0.989992px 0.14112px 0px, rgb(255, 255, 255) -0.653644px -0.756802px 0px, rgb(255, 255, 255) 0.283662px -0.958924px 0px, rgb(255, 255, 255) 0.96017px -0.279415px 0px;; */

    transition: color 0.3s ease-in-out;
}

#navbar_landing.scrolled a {
    color: black; /* Warna teks nav-link saat di-scroll */
    font-weight: 700 !important;

}
#navbar_landing.scrolled a.active {
    color: white; /* Warna teks nav-link saat di-scroll */
}

#nav-text{
    font-family: 'Raleway', sans-serif;
}

#career{
    font-family: 'Nunito', sans-serif;
}

h1{
    font-family: 'Merriweather', serif;
}
h3{
    font-family: 'Merriweather', serif;
}
h5{
    font-family: 'Raleway', sans-serif;
}

p{
    font-family: 'Quicksand', sans-serif;
}
li{
    font-family: 'Quicksand', sans-serif;
}
td{
    font-family: 'Quicksand', sans-serif;
}

.nav-underline .nav-item a{
    font-weight: 700 !important;
    color: black;
}
.nav-underline .nav-item a.active{
    font-weight: 700 !important;
    color: blue;
    border-bottom: 3px solid blue;
}

/* kl mau jadi kyk pill tombol navbar yg aktif */
.nav-pills .nav-item a{
    font-weight: 700 !important;
    color: black;
    padding: 2px 15px !important;
}
.nav-pills .nav-item a.active{
    font-weight: 700 !important;
    padding: 2px 15px !important;
    border-bottom: 5px solid blue;
    border-radius: 20px !important;
}
.point h3{
    display: inline-block;
    border-bottom: solid 3px #0ffff7;
    line-height: 1.1;
    margin-bottom: 0;
    padding-bottom: 10px;
    vertical-align: middle;
}

.content {
height: 1500px; /* Contoh ketinggian konten */
padding-top: 100px; /* Padding atas untuk menyembunyikan konten di bawah navbar */
}


.first {
/* background-image: url(../img/first.jpeg); */
/* background: url(../img/first.jpeg), radial-gradient(circle at 20% 50%, transparent 0%, transparent 10%, rgba(56, 56, 56, 0.5) 20%, rgba(56, 56, 56, 0.5) 40%, rgba(56, 56, 56, 0.5) 60%); */
/* width: 200%; */
background: url(../img/landing.jpeg), radial-gradient(rgba(19, 19, 19, 0.5) 20%, rgba(19, 19, 19, 0.5) 40%, rgba(19, 19, 19, 0.5) 60%);
background-blend-mode: overlay;
height: 100vh;
background-size: cover;
background-repeat: no-repeat;
display: flex;
justify-content: center;
align-items: center;
}

.first h1{
    color: white;
    /* text-shadow: 1px 1px white; */
}

#footer{
    background-color: #0ffff7;
}

.col-pengalaman1{
    padding-top: 100px !important;
}

.list-group-item{
    margin-top: -7.5px !important;
}

.lamar{
    margin-top: 30px;
}

.icon img{
    width: 150px;

}

.lingkup{
    padding-left: -20px;
    padding-right: -20px;
}

.petinggi{
    border-color: #3DDAD7;
}

.member{
    border-color: #0ffff7;
}

.foto-card img {
    height: 200px; /* Sesuaikan tinggi gambar sesuai kebutuhan Anda */
    object-fit: cover; /* Menjaga aspek rasio gambar */
}

@media screen and (max-width: 425px) {
    .logo_nav{
        height: 55px;
    }
    .navbar-brand{
        font-size: 14px;
    }
    .card{
        margin-left: 3px;
    }
    .first, .struktur{
        width: 100%
    }
    #map{
        width: 100%;
    }
    #logo {
        max-width: 100%;
    }
    #foto {
        max-width: 100%;
    }

    .splide__slide #logo img {
        width: 100%;
        height: auto;
        max-height: 55px; /* Sesuaikan tinggi gambar pada layar kecil */
    }
    .splide__slide #foto img {
        width: 100%;
        height: auto;
        max-height: 55px; /* Sesuaikan tinggi gambar pada layar kecil */
    }

    .foot-content{
        width: 100%;
    }
 }

 /*untuk layar device berukuran sedang*/
 @media screen and (max-width: 768px) {
    #page-top, .first, .struktur {
        width: 100%;
    }

    #items {
        overflow-x: auto; /* Membuat tabel dapat digulir pada perangkat seluler */
    }

    #items th, #items td {
        white-space: nowrap; /* Mencegah pemotongan teks pada perangkat seluler */
    }

    #map{
        width: 100%;
    }
    .modalxl {
        max-width: 90%;
    }
    #iframeTrafo {
        width: 100%;
        height: calc(80vh - 150px); /* Sesuaikan tinggi modal */
        border: 0;
    }
    .modal-dialog {
        max-height: 80vh;
    }
 }

 /*untuk layar device berukuran besar*/
 @media screen and (max-width: 1024px) {
    .first, .struktur {
        width: 100%;
    }
    #map{
        width: 100%;
    }
    .modalxl {
        max-width: 90%;
    }
    #iframeTrafo {
        width: 100%;
        height: calc(80vh - 150px); /* Sesuaikan tinggi modal */
        border: 0;
    }
    .modal-dialog {
        max-height: 90%;
    }
 }

 @media screen and (max-width: 1440px) {
    .first, .struktur {
        width: 100%;
    }
    #map{
        width: 100%;
    }
    .modalxl {
        max-width: 90%;
    }
    .modal-dialog {
        max-height: 80vh;
    }
 }
