html {
    background-color: #fff;              /* Farba pozadia celej stránky */
    font-family: Arial, sans-serif;       /* Základné písmo stránky */
}

/* Vzhľad tela stránky */
body {
    text-align: center;                   /* Zarovnanie textu na stred */
    margin: 0;                            /* Odstránenie vonkajších okrajov */
    padding: 0;                           /* Odstránenie vnútorných okrajov */
    background-color: #fff;               /* Biele pozadie obsahu */
    color: #222;                          /* Tmavá farba textu */
}

/* Hlavná obsahová časť stránky */
main {
    width: 70%;                           /* Šírka hlavného obsahu */
    margin: 20px auto;                    /* Centrovanie a horný/dolný okraj */
    padding: 20px;                        /* Vnútorný okraj obsahu */
    text-align: center;                   /* Zarovnanie textu */
}

/* Zvýraznený text pomocou značky <mark> */
mark {
    font-weight: bold;                    /* Tučné písmo */
    font-style: italic;                   /* Kurzíva */
    text-decoration: underline;           /* Podčiarknutie */
    background-color: rgba(211, 27, 27, 0.907); /* Červené pozadie */
    color: white;                         /* Biela farba textu */
}

/* Štýl pre logo Pizzerie Kurima */
.logo {
    width: 40%;            /* Šírka loga */
    max-width: 420px;      /* Maximálna šírka loga */
    height: auto;          /* Zachovanie pôvodného pomeru strán */
    display: block;        /* Nastavenie ako blokový prvok (nutné pre centrovanie) */
    margin: 15px auto;     /* Horný/dolný okraj 15px, vodorovne automaticky na stred */
}

/* Ikona Facebooku */
.facebook-icon {
    width: 50px;          /* Pevná šírka ikony */
    height: auto;         /* Zachovanie pomeru strán */
    display: inline-block;
    vertical-align: middle;
}


/* Zoznam v navigácii */
nav ul {
    list-style: none;                     /* Odstránenie odrážok */
    padding: 0;                           /* Bez vnútorného okraja */
    margin: 10px 0;                       /* Horný a dolný okraj */
}

/* Položky navigačného menu */
nav ul li {
    display: inline-block;                /* Zobrazenie vedľa seba */
}

/* Odkazy v navigácii */
nav ul li a {
    text-decoration: none;                /* Odstránenie podčiarknutia */
    font-weight: bold;                    /* Tučné písmo */
    color: black;                         /* Farba odkazu */
    padding: 10px;                        /* Vnútorný okraj */
    transition: 0.3s;                     /* Plynulý prechod efektov */
}

/* Efekt po prejdení myšou v menu */
nav ul li a:hover {
    color: white;                         /* Zmena farby textu */
    background-color: black;              /* Čierne pozadie */
    border-radius: 5px;                   /* Zaoblené rohy */
}

/* Tabuľka */
table {
    margin: 20px auto;                    /* Centrovanie tabuľky */
    border-collapse: collapse;            /* Spojenie okrajov buniek */
    width: 70%;                           /* Šírka tabuľky */
}

/* Bunky tabuľky */
td,
th {
    border: 2px solid black;              /* Ohraničenie buniek */
    padding: 10px;                        /* Vnútorný okraj */
    text-align: center;                   /* Zarovnanie textu */
}

/* Obrázky v tabuľke */
td img {
    width: 120px;                         /* Pevná šírka obrázka */
    border-radius: 10px;                  /* Zaoblené rohy */
}

/* Všeobecný štýl pre všetky obrázky */
img {
    border-radius: 10px;                  /* Zaoblené rohy */
    transition: transform 0.3s ease,
                box-shadow 0.3s ease;     /* Plynulá animácia */
}

/* Efekt po prejdení myšou nad obrázkom */
img:hover {
    transform: scale(1.1);                /* Zväčšenie obrázka */
    box-shadow: 0 0 15px black;            /* Tieň okolo obrázka */
}

/* Galéria obrázkov */
.galeria {
    text-align: center;                   /* Centrovanie obsahu */
}

/* Obrázky v galérii */
.galeria img {
    display: inline-block;                /* Zobrazenie vedľa seba */
    margin: 10px;                         /* Medzery medzi obrázkami */
    max-width: 45%;                       /* Maximálna šírka obrázka */
}

/* Sekcia jednej etapy rekonštrukcie */
.etapa {
    margin-top: 40px;                     /* Horný okraj */
    margin-bottom: 50px;                  /* Dolný okraj */
    text-align: left;                     /* Zarovnanie textu doľava */
}

/* Nadpis etapy */
.etapa h3 {
    font-size: 24px;                      /* Veľkosť písma */
    margin-bottom: 10px;                  /* Spodný okraj */
}

/* Citácia v etape */
.etapa blockquote {
    font-size: 16px;                      /* Veľkosť textu */
    line-height: 1.6;                     /* Riadkovanie */
    border-left: 5px solid red;            /* Červená čiara vľavo */
    padding-left: 15px;                   /* Odsadenie textu */
}

/* Bočný informačný panel */
aside {
    background-color: #f3f3f3;             /* Svetlé pozadie */
    padding: 15px;                        /* Vnútorný okraj */
    margin-top: 30px;                     /* Horný okraj */
    border-radius: 10px;                  /* Zaoblené rohy */
}

/* Audio a video prvky */
audio,
video {
    display: block;                       /* Zobrazenie ako blok */
    margin: 20px auto;                    /* Centrovanie */
    width: 60%;                           /* Šírka prehrávača */
    border-radius: 10px;                  /* Zaoblené rohy */
}

/* Sekcia o obci Kurima */
#kurima {
    background-color: #fff7e6;             /* Svetlé pozadie */
    padding: 20px;                        /* Vnútorný okraj */
    border-radius: 10px;                  /* Zaoblené rohy */
}

/* Pätička stránky */
footer {
    margin-top: 40px;                     /* Horný okraj */
    padding: 20px;                        /* Vnútorný okraj */
    background-color: #222;               /* Tmavé pozadie */
    color: white;                         /* Farba textu */
}

/* Zoznam v pätičke */
footer ul {
    list-style: none;                     /* Bez odrážok */
    padding: 0;                           /* Bez vnútorného okraja */
}

/* Položky zoznamu v pätičke */
footer ul li {
    margin: 5px 0;                        /* Medzera medzi položkami */
}