/*css untuk index/bg */

body, html {
    position: relative;
    Background-color:blue;
    scroll-padding-top:60px; /* Memberikan offset atas sebesar 20px */
    overflow-x: hidden;
    max-width: 100vw;
    width: 100%;
}

video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    cursor: pointer;
    position:relative;
    /*Background-image: url('images/banner/STEERING-WHEEL.jpg');*/
    Background-color:rgb(13, 5, 70);            
}

.mute-icon {
    position: absolute;
    bottom: 10px;
    left: 20px;
    font-size: 15px;
    color: white;
    z-index: 10;
    cursor: pointer;
    opacity:0.25;
    
}

.container-video {
    width: 100%; /* Pastikan lebar container mengikuti layar penuh */
    height: 35vw;  /*Tinggi container mengikuti layar penuh */
    background-color: black;
    display: flex; /* Flexbox untuk memastikan konten tetap sesuai */
    /*align-items: center;  Tengah vertikal */
    justify-content: center; /* Tengah horizontal */
    padding: 0; /* Hilangkan padding agar video benar-benar menempel */
    position: relative; /* Posisi relatif untuk ikon mute */
    overflow: hidden; /* Pastikan konten tidak melampaui container */
}

.container-luar {
    width: 100%;
    height: 100%; /* Pastikan elemen mengambil seluruh tinggi layar */
    background-color: red;
    align-items: center; /* Atur vertikal ke tengah */
    justify-content: center; /* Atur horizontal ke tengah */
    padding:0px;
    display: flex; /* Aktifkan Flexbox */
    background-image: url('https://mahatanimu.com/mmu/img/Picture2.jpg');
    background-size: 100% 100%; /* Memastikan gambar memenuhi seluruh container tanpa pengulangan */
    /*background-position: center; /* Memposisikan gambar di tengah */
    /*background-repeat: no-repeat;*/
}

.contentheader {
    position: absolute;
    z-index: 1;
    color: white;
    text-align: top !important;
    opacity:0.2;
}

.judul h3 {
    margin: 10px 0;
    font-size: 24px; /* Ukuran font default */
}

/* Media query untuk layar kecil (max-width: 768px) */
@media screen and (max-width: 768px) {
    .judul h3,.judul-product h3 {
        font-size: 16px; /* Ukuran font untuk layar kecil */
    }
}

/* Media query untuk layar yang lebih kecil (max-width: 480px) */
@media screen and (max-width: 480px) {
    .judul h3 {
        font-size: 14px; /* Ukuran font untuk layar sangat kecil */
    }
}

.space-atas {
    margin: 70px; /* Tambahkan margin ke semua sisi */
}