/* Ganti dengan gaya khusus halaman */
body {
    font-family: 'Helvetica Neue', sans-serif;

    
}

.hero-section {
    background-size: cover;
    background-position: center;
    height: 80vh;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
}

.contact-section {
    background-image: url('contact-background.jpg');
    background-size: cover;
    background-position: center;
    height: 60vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.footer {
    color: #fff;
}

/* Background images responsif untuk ukuran layar <= 576px (extra small) */
@media (max-width: 576px) {
    body {
        /* Ganti background image atau background color untuk tampilan layar kecil */
        background-color: #f2f2f2;
    }
}

/* Background images responsif untuk ukuran layar antara 577px dan 768px (small) */
@media (min-width: 577px) and (max-width: 768px) {
    body {
        /* Ganti background image atau background color untuk tampilan layar kecil */
        background-color: #f2f2f2;
    }
}

/* Background images responsif untuk ukuran layar antara 769px dan 992px (medium) */
@media (min-width: 769px) and (max-width: 992px) {
    body {
        /* Ganti background image atau background color untuk tampilan layar menengah */
        background-color: #f2f2f2;
    }
}

/* Background images responsif untuk ukuran layar > 992px (large) */
@media (min-width: 993px) {
    body {
        /* Ganti background image atau background color untuk tampilan layar besar */
        background-color: #ffffff;
    }
}


/* Tampilan responsif untuk ukuran layar <= 576px (extra small) */
@media (max-width: 576px) {
    /* Ganti font size pada judul utama */
    h1 {
        font-size: 24px;
    }

    /* Ganti font size pada paragraf teks */
    p {
        font-size: 14px;
    }

    /* Ganti ukuran gambar pada bagian About */
    .img-fluid {
        max-width: 200px;
    }

    /* Ganti font size pada link navigasi */
    .navbar-nav a {
        font-size: 14px;
    }

    /* Ganti margin pada tombol kontak */
    .btn-outline-light {
        margin-top: 10px;
    }
}

/* Tampilan responsif untuk ukuran layar antara 577px dan 768px (small) */
@media (min-width: 577px) and (max-width: 768px) {
    /* Ganti font size pada judul utama */
    h1 {
        font-size: 30px;
    }

    /* Ganti font size pada paragraf teks */
    p {
        font-size: 16px;
    }

    /* Ganti ukuran gambar pada bagian About */
    .img-fluid {
        max-width: 250px;
    }

    /* Ganti font size pada link navigasi */
    .navbar-nav a {
        font-size: 16px;
    }

    /* Ganti margin pada tombol kontak */
    .btn-outline-light {
        margin-top: 20px;
    }
}

/* Tampilan responsif untuk ukuran layar antara 769px dan 992px (medium) */
@media (min-width: 769px) and (max-width: 992px) {
    /* Ganti ukuran gambar pada bagian About */
    .img-fluid {
        max-width: 300px;
    }

    /* Ganti margin pada tombol kontak */
    .btn-outline-light {
        margin-top: 30px;
    }
}

/* Tampilan responsif untuk ukuran layar > 992px (large) */
@media (min-width: 993px) {
    /* Ganti ukuran gambar pada bagian About */
    .img-fluid {
        max-width: 350px;
    }

    /* Ganti margin pada tombol kontak */
    .btn-outline-light {
        margin-top: 40px;
    }
}

.hero-section {
    background-image: url('img/background.png');
    background-size: cover;
    background-position: center;
    height: 80vh;
    display: flex;
    justify-content: center;
    align-items: center;
}