.IndexBody #navbar {
    background-color: transparent;
    text-align: left;
    margin-top: -6.5%;
    margin-left: -4.5%;
    padding-top: 0%;
    top: 100px; position: relative;
}
.container-main h1 {
    position: absolute;
    left: 0;
    top: 35%;
    transform: translateY(-50%);
    color: white; /* Můžete změnit barvu písma podle potřeby */
    padding-left: 20px; /* Můžete upravit odsazení podle potřeby */
    font-family: "Nadpis";
    font-size: 72px;
    max-width: 50%;
}
.vice {
    color: green;
    text-decoration: none;
}

.container-main .ikonkyMain {
    width: 6%;
    margin-left: 10%;
    position: absolute;
    top: 30%;
}

.container-main p {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    color: white; /* Můžete změnit barvu písma podle potřeby */
    padding-left: 20px; /* Můžete upravit odsazení podle potřeby */
    font-size: 16px;
    margin-top: 10%;
    margin-left: 0.5%;
    width: 50%;
    text-align: justify;
}

.container-main {
    display: flex;
    max-width: 65%;
    margin: auto;
    padding-left: 35%;
    position: relative;
}

.container-main h2 {
    color: white;
}

.container-main img {
    display: flex;
    max-width: 100%;
    margin: auto;
}
#PotucekIMG {
    display: none;
}
.highlight {
    color: green;
}

@media screen and (max-width: 700px) {
    .vice {
        margin-top: 15%;
    }
    #textik {
        margin-bottom: 25%;
    }
    .IndexBody #navbar {
        background-color: black;
        text-align: left;
        margin-top: 0%;
        margin-left: 0%;
        padding-top: 0%;
        top: 0; 
        position: relative;
    }
    .menu-button {
        font-size: 50px;
    }
    /* Hlavní kontejner */
    .container-main {
        display: flex;
        flex-direction: column; /* Usnadní umístění elementů pod sebe */
        max-width: 100%;
        padding-left: 0;
        padding-right: 0;
        margin: 0;
    }

    /* Hlavní nadpis */
    .container-main h1 {
        display: flex;
        flex-direction: column;
        justify-content: flex-start; /* Zarovnání prvků na začátek (na vrch) */
        align-items: left;
        text-align: left; /* Vycentrování textu */
        position: relative;
        font-size: 50px;
        max-width: 100%;
        margin-bottom: -20%;
        margin-top: 20%;
    }

    /* Obrázek pro mobilní verzi */
    #mainimg {
        width: 100%;
        height: auto;
        margin: 10px 0;
        order: 2;
        display: none;
    }
    #PotucekIMG {
        display: flex;
        margin: 0;
    }
    .PotucekIMG-Wrapper {
        position: relative;
        display: inline-block; /* Zachová velikost podle obsahu */
    }
    
    .PotucekIMG-Wrapper img {
        display: block;
        width: 100%;
        height: auto;
        object-fit: cover;
    }
    .PotucekIMG-Wrapper::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 50%; /* Výška přechodu */
        height: 70%; /* Zvětšuje výšku přechodu */
        background: linear-gradient(to top,  
            rgba(0, 0, 0, 1) 0%,   /* Silná černá na úplném dně */
            rgba(0, 0, 0, 0.8) 30%,  
            rgba(0, 0, 0, 0.5) 60%,  
            rgba(0, 0, 0, 0) 100%  /* Průhlednost nahoře */
        );
    }

    /* Ikony pro mobilní verzi */
    .container-main .ikonkyMain {
        width: 30%; /* Zvětšení velikosti ikon */
        margin: 5px; /* Mezery mezi ikonami */
        position: relative;
        top: auto;
        margin-left: 0;
        order: 3;
        display: inline-block; /* Zajištění, že budou vedle sebe */
    }

    /* Text pro mobilní verzi */
    .container-main p {
        position: relative;
        top: auto;
        left: 0;
        transform: none;
        font-size: 20px;
        width: 90%;
        margin: 10px 0;
        text-align: justify;
        order: 4;
    }

    /* Nový kontejner pro ikony, aby byly vedle sebe */
    .container-main .ikonkyMain-container {
        display: flex;
        margin-top: -25%;
        margin-bottom: 20%;
        order: 5;
        justify-content: center; /* Horizontální střed */
        align-items: center; /* Vertikální střed */
    }
    .ikonkyMain-container a {
        display: flex; /* Flex pro centrální zarovnání obrázku */
        justify-content: center; /* Horizontální střed */
        align-items: center; /* Vertikální střed */
    }
}