.custom-bg-secondary {
  background-color: #EAEAEA; /* Warna latar belakang */
}

.custom-bg-red {
  background-color: #ce3030; /* Warna latar belakang */
  border-radius: 10px;
}

.custom-bg-hijau {
  background-color: #389140; /* Warna latar belakang */
}

.custom-bg-birudongker {
  background-color: #001233; /* Warna latar belakang */
}


.custom-bg-card-biru {
  background-color: #056EE1; /* Warna latar belakang */
}

.custom-bg-card-biru:hover {
  background-color: #389140;
}

.btn-instagram {
  background-color: #E1306C; /* Warna latar belakang Instagram */
  color: white; /* Warna teks */
}
.btn-instagram:hover {
  background-color: #F77737; /* Warna latar belakang saat hover */
}


/* Contoh media query untuk mengatur ukuran gambar pada tampilan mobile */
@media (max-width: 668px) {
  .navbar-brand img {
    max-height: 30px; /* Ukuran gambar pada tampilan mobile */
  }
}

/* Contoh media query untuk tampilan desktop */
@media (min-width: 669px) {
  .navbar-brand img {
    max-height: 40px; /* Ukuran gambar pada tampilan desktop */
  }
}


/** slider **/
.d-radius{
  border-radius: 8px;
}
.carousel-control-next-icon,.carousel-control-prev-icon{
  background-color:#4f38a4 ;
  border-radius:50px;
  background-size:17px
}

.mading{
  height: 280px;
  overflow: scroll;
  overflow-x: hidden; 

}

#myUL {
  display: flex;
  flex-direction: column; /* Mengatur item <li> dalam satu kolom */
  align-items: stretch; /* Menjamin bahwa item <li> mengambil lebar penuh */
  padding-left: 0;
  margin: 0;
  list-style-type: none;
}

#myUL li {
  font-size: 12px;
  padding: 5px 10px; /* Padding atas, bawah, dan samping */
  border-bottom: 1px solid #ddd; /* Garis pemisah antara item */
}

/** navbar **/
/* Mengatur agar dropdown menu tampil pada hover */
.dropdown:hover .dropdown-menu {
  display: block;
}

.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
}


.font-title {
    font-size: 0.8rem; /* Default untuk tablet atau desktop */
    font-weight: bold;
}

@media (max-width: 768px) {
    .font-title {
        font-size: 0.8rem; /* Ukuran lebih kecil untuk mobile */
    }
}

.card-img-top {
    width: 100%; /* Atur lebar sesuai elemen parent */
    height: 150px; /* Atur tinggi sesuai yang diinginkan */
    object-fit: cover; /* Memotong gambar agar sesuai area tanpa distorsi */
}

.card-img-top-bacainformasi {
    width: 100%; /* Atur lebar sesuai elemen parent */
    height: 350px; /* Atur tinggi sesuai yang diinginkan */
    object-fit: cover; /* Memotong gambar agar sesuai area tanpa distorsi */
}