body h1 {
    font-family: Milonga;
}

body p {
    font-family: Metrophobic;
    margin: 0;
    padding: 0;
}

#apref{
    color: white !important;
    transition: 0.5s !important;
}

#apref:hover{
    transition: 0.5s !important;
    color:#4fb351 !important;

}

#Och-sec {
    margin-top: -1.2rem;
    background-image: url(assets/mapka.webp);
    height: 100vh;
    width: 100%;
    display: flex;
    flex-direction: column; /* Změňte na sloupec, aby byly prvky pod sebou */
    justify-content: center; /* Vertikální centrování obsahu */
    align-items: center; /* Horizontální centrování obsahu */
    text-align: center;
}

#Och-sec h1 {
    margin-top: 10rem;
    margin-bottom: 2rem; /* Přidání mezery pod nadpisem */
    text-align: center; /* Centrovat text */
    font-family: Milonga;
}

.mapicka {
    width: 40%;
    height: 400px; /* Nastavte výšku mapy (v případě potřeby) */
    border: 3px solid #A67B5B;
}

#Och-sec-2 {
    background-image: url(assets/apartmany-orechovka-ubytovani-sekerovy-loucky-turnov-ed8e-\ 2.webp);
    height: 81vh;
    display: flex; /* Použití flexboxu */
    align-items: center; /* Vertikální centrování */
}

#sec2 {
    background-color: rgba(0, 0, 0, 0.6); /* Transparent overlay */
    backdrop-filter: blur(10px);
    border: 3px solid #2C5F2D;
    border-radius: 60px;
    height: 30vh; 
    width: 50%; /* Levá část */
    margin-right: auto; /* Tlačí sekci vlevo */
    display: flex;
    flex-direction: column; /* Zarovnání textu vertikálně */
    justify-content: center; /* Vertikální centrování textu */
}

#Och-sec-3 {
    background-image: url(assets/koueplanOch.webp);
    height: 60vh;
    display: flex; /* Použití flexboxu */
    align-items: center; /* Vertikální centrování */
}

#sec3 {
    background-color: rgba(0, 0, 0, 0.6); /* Transparent overlay */
    backdrop-filter: blur(10px);
    border: 3px solid #2C5F2D;
    border-radius: 60px;
    height: 33vh;
    width: 50%; /* Pravá část */
    margin-left: auto; /* Tlačí sekci vpravo */
    display: flex;
    flex-direction: column; /* Zarovnání textu vertikálně */
    justify-content: center; /* Vertikální centrování textu */
}

/* Styly pro texty */
.Och-leva {
    margin-left: 30%; /* Upravte podle potřeby */
    margin-right: 2%;
    margin-bottom: 3%;
}

.Och-prava {
    margin-left: 5%; /* Upravte podle potřeby */
    margin-right: 30%; /* Mezera mezi nadpisem a odstavcem */
    margin-bottom: 3%;
}

#Och-sec-4 {
    background-image: url(assets/loznice.webp);
    height: 65vh;
    display: flex; /* Použití flexboxu */
    align-items: center; /* Vertikální centrování */
}

#sec4 {
    background-color: rgba(0, 0, 0, 0.6); /* Transparent overlay */
    backdrop-filter: blur(10px);
    border: 3px solid #2C5F2D;
    border-radius: 60px;
    height: 40vh; 
    width: 50%; /* Levá část */
    margin-right: auto; /* Tlačí sekci vlevo */
    display: flex;
    flex-direction: column; /* Zarovnání textu vertikálně */
    justify-content: center; /* Vertikální centrování textu */
}

#Och-sec-5 {
    background-image: url(assets/vytapeni.webp);
    height: 60vh;
    display: flex; /* Použití flexboxu */
    align-items: center; /* Vertikální centrování */
}

#sec5 {
    background-color: rgba(0, 0, 0, 0.6); /* Transparent overlay */
    backdrop-filter: blur(10px);
    border: 3px solid #2C5F2D;
    border-radius: 60px;
    height: 25vh;
    width: 50%; /* Pravá část */
    margin-left: auto; /* Tlačí sekci vpravo */
    display: flex;
    flex-direction: column; /* Zarovnání textu vertikálně */
    justify-content: center; /* Vertikální centrování textu */
}

#Och-sec-6 {
    background-image: url(assets/hriste.webp);
    height: 65vh;
    display: flex; /* Použití flexboxu */
    align-items: center; /* Vertikální centrování */
}

#sec6 {
    background-color: rgba(0, 0, 0, 0.6); /* Transparent overlay */
    backdrop-filter: blur(10px);
    border: 3px solid #2C5F2D;
    border-radius: 60px;
    height: 40vh; 
    width: 50%; /* Levá část */
    margin-right: auto; /* Tlačí sekci vlevo */
    display: flex;
    flex-direction: column; /* Zarovnání textu vertikálně */
    justify-content: center; /* Vertikální centrování textu */
}

#Och-sec-7 {
    background-image: url(assets/kuchyn.webp);
    height: 60vh;
    display: flex; /* Použití flexboxu */
    align-items: center; /* Vertikální centrování */
}

#sec7 {
    background-color: rgba(0, 0, 0, 0.6); /* Transparent overlay */
    backdrop-filter: blur(10px);
    border: 3px solid #2C5F2D;
    border-radius: 60px;
    height: 25vh;
    width: 50%; /* Pravá část */
    margin-left: auto; /* Tlačí sekci vpravo */
    display: flex;
    flex-direction: column; /* Zarovnání textu vertikálně */
    justify-content: center; /* Vertikální centrování textu */
}

#Och-sec-8 {
    background-image: url(assets/stromZ.webp);
    height: 65vh;
    display: flex; /* Použití flexboxu */
    align-items: center; /* Vertikální centrování */
}

#sec8 {
    background-color: rgba(0, 0, 0, 0.6); /* Transparent overlay */
    backdrop-filter: blur(10px);
    border: 3px solid #2C5F2D;
    border-radius: 60px;
    height: 40vh; 
    width: 50%; /* Levá část */
    margin-right: auto; /* Tlačí sekci vlevo */
    display: flex;
    flex-direction: column; /* Zarovnání textu vertikálně */
    justify-content: center; /* Vertikální centrování textu */
}

/* Responzivní úpravy */
@media (max-width: 768px) {
    #Och-sec h1 {
        margin-top: 5rem; /* Zmenšení horního odsazení pro menší obrazovky */
        font-size: 1.8rem; /* Zmenšení velikosti textu */
    }

    .mapicka {
        width: 90%; /* Plná šířka pro menší obrazovky */
        height: 200px; /* Výška pro menší obrazovky */
    }

    #sec2,
    #sec3,
    #sec4,
    #sec5,
    #sec6,
    #sec7,
    #sec8 {
        width: 90%; /* Plná šířka pro menší obrazovky */
        height: auto; /* Automatická výška */
        padding: 15px; /* Zmenšení paddingu pro menší obrazovky */
        margin: 10px 0; /* Přidání mezer mezi sekcemi */
    }

    /* Zmenšení velikosti rámečku */
    #sec2, #sec3, #sec4, #sec5, #sec6, #sec7, #sec8 {
        border: 2px solid #2C5F2D; /* Zmenšení tloušťky rámečku */
    }
}

@media (max-width: 480px) {
    #Och-sec h1 {
        margin-top: 3rem; /* Další zmenšení pro velmi malé obrazovky */
        font-size: 1.5rem; /* Další zmenšení velikosti textu */
    }

    .mapicka {
        height: 150px; /* Další zmenšení výšky mapy */
    }

    /* Úpravy pro sekce */
    #sec2, #sec3, #sec4, #sec5, #sec6, #sec7, #sec8 {
        font-size: 0.9rem; /* Zmenšení velikosti textu pro sekce */
    }
}

@media (max-width: 420px) {
    .och {
        padding-top: 15vh;
        margin: 0;
        margin-bottom: 20px; /* Přidání spodního marginu pro rovnoměrné mezery */
    }

    /* Případně přizpůsobení textů a dalších prvků */
    #Och-sec h1 {
        margin-top: 3rem; /* Další zmenšení pro velmi malé obrazovky */
        font-size: 1.5rem; /* Další zmenšení velikosti textu */
    }

    .mapicka {
        height: 150px; /* Další zmenšení výšky mapy */
    }

    /* Úpravy pro sekce */

}