body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    background-color: #1a1a2e; /* Warna latar belakang gelap */
    color: #f1f1f1; /* Warna teks terang */
}

.gallery-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

h1 {
    text-align: center;
    color: #00adb5; /* Warna judul cerah */
    margin-bottom: 20px;
}

.gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 15px; /* Jarak antar gambar */
}

.gallery-item {
    overflow: hidden; /* Menyembunyikan bagian gambar yang keluar */
    border-radius: 10px; /* Sudut melengkung */
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5); /* Bayangan lebih dalam */
    text-align: center; /* Rata tengah untuk konten */
    background-color: #0f3460; /* Warna latar belakang item galeri */
    transition: transform 0.3s; /* Efek transisi saat hover */
}

.gallery-item:hover {
    transform: scale(1.05); /* Efek zoom saat hover */
}

.gallery-item img {
    width: 100%; /* Gambar responsif */
    height: auto; /* Menjaga rasio aspek */
    border-bottom: 4px solid #00adb5; /* Garis bawah untuk efek visual */
}

button {
    margin-top: 10px; /* Jarak atas untuk tombol */
    padding: 10px 15px; /* Padding dalam tombol */
    font-size: 1rem; /* Ukuran font tombol */
    color: #fff; /* Warna teks tombol */
    background-color: #00adb5; /* Warna latar belakang tombol */
    border: none; /* Menghapus border default */
    border-radius: 5px; /* Sudut melengkung tombol */
    cursor: pointer; /* Pointer saat hover */
    transition: background-color 0.3s, transform 0.3s; /* Transisi saat hover */
}

button:hover {
    background-color: #007a7f; /* Warna saat hover */
    transform: scale(1.05); /* Efek zoom saat hover */
}