@font-face {
    font-family: 'Nadpis';
    src: url('../built\ titling\ bd.otf') format('woff2');
    font-weight: normal;
    font-style: normal;
}
body {
    margin: 0;
    padding: 0;
}

.text {
    flex: 1;
    text-align: justify;
    padding-right: 20px;
    font-size: 25px;
}
.image img {
    max-width: 100%;
    height: auto;
}
#hlavicka {
    background-image: url(../img/les.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom;
    height: 300px; /* zvětšeno, aby se vešel i padding uvnitř */
}   

#hlavicka2 {
    width: 100%;  /* Nastaví šířku headeru na 100% */
    height: 250px;
    gap: 20px;  /* Mezera mezi jednotlivými prvky */
    text-align: center;
    padding-top: 20px;
}
.logo {
    max-width: auto;  /* Určuje šířku obrázků (můžete upravit dle potřeby) */
    height: 50%;  /* Udržuje poměr stran obrázku */
    margin-left: 25%;
    display: block;
    margin: 0 auto;
}

.title {
    font-family: 'Nadpis';
    margin: 0;  /* Zruší defaultní okraje h1 */
    font-size: 35px;  /* Nastaví velikost písma pro h1 */
    text-align: center;  /* Zarovná text do středu */
    color: white;
}

/* Footer */
#paticka {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #222;
    padding: 20px;
    color: white;
    text-align: center;
}

/* Nadpis v patičce */
#paticka h2 {
    margin-bottom: 20px;
    font-size: 1.5em;
    font-weight: bold;
    color: white;
}

/* Hlavní grid pro sponzory */
.sponzori-main {
    display: grid;
    grid-template-columns: repeat(7, 1fr); /* 7 sloupců */
    gap: 30px 20px; /* mezery mezi buňkami (řádek, sloupec) */
    justify-items: center; /* centrování obsahu v buňkách */
    margin-bottom: 20px;
    width: 100%;
    max-width: 1400px;
}

/* Každý sponzor + text */
.sponzori-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    max-width: 180px;
}

.sponzori-wrapper img {
    height: 7.1em;
    width: auto;
    transition: transform 0.3s ease;
}

.sponzori-wrapper img:hover {
    transform: scale(1.2);
}

.sponzori-wrapper p {
    font-size: 0.9em;
    margin-top: 10px;
}

/* Styl pro ikony bez textu (např. Pardubice VII apod.) */
.sponzori-container {
    display: contents; /* Zruší box kolem, aby šlo použít v rámci gridu */
}

/* Styl pro samotné ikony (bez wrapperu) */
.sponzori {
    display: block;
}

.sponzori img {
    width: 110px;
    height: auto;
    transition: transform 0.3s ease;
}

.sponzori img:hover {
    transform: scale(1.2);
}

/* Styl pro text copyrightu */
#paticka p {
    margin-top: 20px;
    font-size: 0.9em;
    opacity: 0.7;
    text-align: center;
}

/* Responsivní přizpůsobení pro menší zařízení */
@media screen and (max-width: 1100px) {
    .sponzori-main {
        grid-template-columns: repeat(4, 1fr);
    }
}


/* Responsivní styl pro mobilní zařízení */
@media screen and (max-width: 700px) {
    .sponzori-main {
        grid-template-columns: repeat(2, 1fr);
    }
    #paticka {
        text-align: center;
    }

    .logo {
        max-width: auto;
        height: 50%;
    }
    .title {
        font-family: 'Nadpis';
        margin: 0;  /* Zruší defaultní okraje h1 */
        font-size: 35px;  /* Nastaví velikost písma pro h1 */
        text-align: center;  /* Zarovná text do středu */
        margin-top: 50px;
        color: white;
    }

    .sponzori-main {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 15px; /* Vzdálenost mezi jednotlivými řádky */
    }

    /* Zobrazí sponzori-wrapper vedle sebe */
    .sponzori-wrapper {
        display: inline-flex; /* Použijeme inline-flex, aby byly vedle sebe */
        flex-direction: column; /* Text a obrázky jsou pod sebou */
        align-items: center;
        justify-content: center;
        gap: 10px; /* Vzdálenost mezi textem a obrázkem */
        width: 50%; /* Každý wrapper bude mít 50% šířky */
    }

    /* Zajistí, že ikony ve sponzori-container budou pod sebou */
    .sponzori-container {
        display: flex;
        flex-direction: column; /* Ikony pod sebou */
        align-items: center;
        justify-content: center;
        gap: 10px; /* Vzdálenost mezi jednotlivými ikonami */
    }

    .sponzori-container .sponzori img {
        width: 50%;
        height: auto;
        transition: transform 0.3s ease;
    }

    /* Zajišťuje, že odkazy a ikony mají prostor mezi nimi */
    .sponzori-wrapper a, .sponzori-container a {
        margin: 10px 0; /* Prostor mezi obrázky sponzorů */
    }

    .sponzori-wrapper p, .sponzori-container p {
        text-align: center;
        font-size: 14px; /* Zmenšení textu pro mobilní zařízení */
    }

    /* Ujistíme se, že wrappery zaberou maximální šířku */
    .sponzori-wrapper,
    .sponzori-container {
        width: 100%;
    }

    /* Na mobilních zařízeních omezíme vzdálenost mezi jednotlivými wrappery */
    .sponzori-main {
        gap: 20px;
    }
}
