/* Styly pro kontejner obsahující tlačítka a nastavení menu 
.container {
    position: relative; /* Nastavení relativní pozice pro kontejner 
}

/* Styly pro nastavení menu 
    .settings-menu {
        background-color:  #212121 ;
        display: none;
        position: absolute;
        top: 1500%; /* Upraveno pro vertikální zarovnání do středu stránky 
        left: 50%; /* Zarovnání na střed stránky horizontálně 
        transform: translate(-50%, -50%); /* Posunutí menu zpět o polovinu své šířky a výšky 
        border: 1px solid #ccc;
        padding: 10px;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    }
    

.set 
    font-family: Arial, sans-serif; /* Nastavení výchozího fontu pro celou stránku 
    margin: 0; /* Ostranění vnějšího okraje (margin) pro tělo stránky 
    display: flex; /* Použití flexboxu pro flexibilní uspořádání obsahu 
    align-items: center; /* Vyrovnání obsahu na vertikální ose 
    justify-content: center; /* Vyrovnání obsahu na horizontální ose 
    height: 45vh; /* Nastavení výšky stránky na 100% viditelné výšky okna prohlížeče 
    background-color: #212121; 
}


.settings-icon  {
    width: 20%;
    height: 20%;
    top: -50%
}*/

body{
    background-color: #212121 !important; 
    
    }

.text{
    text-decoration-line: underline;
    text-decoration-thickness: 15%;
    text-shadow: 0 0 3px red, 0 0 5px darkred;  
}

.image-container {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    /*height: 55.5vh;*/
    
}

.image {
    position: relative;
    width: 50%;
    height: auto;
    overflow: hidden;
    
}

/*.image2 {
    position: relative;
    width: 50%;
    height: auto;
    overflow: hidden;
}*/

/*.up{
    /*margin-top: -10%; /* Přidáno pro posunutí textu dolů 
}*/
.image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity 0.3s;
}

.image img:last-child {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
}

.image:hover img:first-child {
    opacity: 0;
}

.image:hover img:last-child {
    opacity: 1;
}

.text-container {
    padding: 20px; /* Přidáme odsazení pro lepší vzhled */
    max-width: auto; /* Přidáno pro omezení šířky textu */
    max-height: auto;
    flex: 1; /* Přidáno pro umístění textu vedle obrázku */ 
    align-items: left; /* Zarovnání prvků podél osy y */
    /*margin-top: 5%; /* Přidáno pro posunutí textu dolů */
}

.text-container2 {
    padding: 20px; /* Přidáme odsazení pro lepší vzhled */
    max-width: auto; /* Přidáno pro omezení šířky textu */
    max-height: auto;
    flex: 1; /* Přidáno pro umístění textu vedle obrázku */ 
    align-items: left; /* Zarovnání prvků podél osy y */  
    /*margin-top: -10%; /* Přidáno pro posunutí textu dolů */
}