/* Osnovni reset */
body {
    margin: 0;
    padding: 0;
    font-family: Arial, sans-serif;
}

/* Stiliziranje bannera (kontejnera) */
.video-banner {
    position: relative; 
    width: 100%;
    /* Visina za velike ekrane (npr. desktop) */
    height: 1200px; /* Zadržavamo vašu fiksnu visinu za velike ekrane */
    overflow: hidden; 
    display: flex; 
    align-items: center; 
    justify-content: center;
    text-align: center;
}

/* --- MEDIA QUERIES ZA RESPONZIVNOST --- */

/* 1. Za tablete i manje laptope (širina manja od 992px) */
@media (max-width: 991.98px) {
    .video-banner {
        /* Smanjujemo visinu za srednje ekrane */
        height: 650px; 
    }
}

/* 2. Za mobitele (širina manja od 768px) */
@media (max-width: 767.98px) {
    .video-banner {
        /* Dodatno smanjujemo visinu za mobitele */
        height: 450px; 
    }

    /* Opcionalno: Smanjivanje veličine teksta na mobitelima radi boljeg prikaza */
    .banner-sadrzaj h1 {
        font-size: 1.8em;
    }
    
    .banner-sadrzaj p {
        font-size: 1em;
    }
}



/* Stiliziranje video elementa da pokrije cijeli kontejner */
#background-video {
    position: absolute; 
    top: 50%;
    left: 50%;
    min-width: 100%; 
    min-height: 100%; 
    width: auto;
    height: auto;
    z-index: 1; 
    transform: translate(-50%, -50%); 
    object-fit: cover; 
}

.gumb:hover {
    background-color: #e64a19;
}