body {
    text-align: center;
    margin: 0;
    padding: 0;
    background-color: #f1dff3; 
}

/* Kontejner pro obsah stránky */
.container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Styl pro nadpisy h1 */
h1 {
    background-color: #5f2680; /* Tmavě fialová barva pro pozadí nadpisu */
    color: white;
    padding: 20px;
    width: 100%;
    margin: 0;
    border-bottom: 3px solid black; /* Černá čára pod nadpisem */
}
/* Tlačítka */
.buttons {
    background-color: #9966b1; /* Světlejší fialová */
    padding: 20px;
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 15px;
}

    .buttons a {
        display: inline-block;
        text-decoration: none;
        color: #f5ebf5; /* Světlejší fialová pro text tlačítek */
        font-size: 18px;
        padding: 15px 30px; /* Více horizontálního paddingu pro obdélníkový tvar */
        background: #b87fc2; /* Světlejší fialová pro pozadí tlačítka */
        border-radius: 10px; /* Mírně zakulacené rohy */
        text-align: center;
        border: 2px solid #070707; /* Tmavší okraj */
        transition: background-color 0.3s ease, color 0.3s ease; /* Plynulý přechod při hover */
    }

        .buttons a:hover {
            background-color: rgba(185, 217, 229, 0); /* Bílá barva na pozadí při najetí */
            color: #000000; /* Tmavě šedá barva písma */
        }

/* Styl pro textové bloky */
.about-text {
   
    padding: 20px;
    width: 80%;
    margin: 0 auto;
}

/* Kontejner pro obrázek */
.image-container {
    margin-top: 20px;
    text-align: center;
}

    /* Tabulka pro obrázky */
    .image-container table {
        margin: 0 auto; /* Vycentrování tabulky */
        border-collapse: collapse;
    }

    .image-container td {
        padding: 10px;
    }

    .image-container img {
        max-width: 100%; /* Obrázek bude mít maximální šířku 100% */
        height: auto; /* Výška obrázku se automaticky přizpůsobí šířce */
    }



h1 {
    background-color: #5f2680; /* Tmavě fialová barva pro pozadí nadpisu */
    color: white;
    padding: 20px;
    width: 100%;
    margin: 0;
    border-bottom: 3px solid black; /* Černá čára pod nadpisem */
}

/* Kontejner pro text a obrázek na stránce "O mně" */
.about-page {
    padding: 20px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

    /* Kontejner pro tlačítka a text */
    .about-page .buttons {
        margin-bottom: 20px; /* Vzdálenost od nadpisu */
    }

/* Specifické úpravy pro stránku "Zvířata" */
.zvirata-page {
    background-color: #f1dff3; /* Světle šedé pozadí */
}

/* Tabulka pro obrázky */
.image-container table {
    margin: 0 auto; /* Vycentrování tabulky */
    border-collapse: collapse;
}

.image-container td {
    padding: 10px;
}

.image-container img {
    max-width: 100%; /* Obrázek bude mít maximální šířku 100% */
    height: auto; /* Výška obrázku se automaticky přizpůsobí šířce */
}