/* CSS Document */

#kontajner {
            margin: 0 auto;            /* nasledujuce 2 riadky nastavia kontainer na stred */
            width: 97%;                /* pre mensie  treba nastavovat sirku dalsich casti - Obsahu  */
            border-style: solid;
            border-width: 1px;          /*šírka hranice sa do rozmeru elementu nezapočítava*/
            font-family: calibri;
        }

#hlavicka {   
            background-image: url('https://www.shutterstock.com/image-photo/set-natural-products-isolated-on-260nw-1493560172.jpg');
            background-position: center;
            background-repeat: no-repeat;
            color: black;
            text-align: center;
            font-size: 3.5em;
            height: 100px;
            border-bottom: solid;
            border-width: 1px;
        }
                            /* po odkomentovani sa stranka rozpadne, pustit menu, obsah, odkazy, pata  */
#menu {
          
            background-color: lightpink;
            width: 14%;
            height: 530px;
            color: white;
            float: left;        /*nastavime obtekanie zlava*/
        }


#obsah {
            width: 70%;
            float: left;                      /*nastavime obtekanie zlava*/
            margin-left: 10px;             /*odsadenie textu, border je len kvoli prehladnosti */
          
        }


#zaujimavosti {
            width: 15.2%;
            font-size: 1.15em;
            background-color: pink;
            height: 530px;
            float: left;                     /*nastavime obtekanie zlava*/
        }


#pata {     clear: left;
            height: 90px;
            border-top: solid;
            border-width: 1px;
            background-color: pink;
        }
                                      /* stranka by mala byt ok, zatial nefunguju navigacne
                                         postupne skusat vypnut border-radius, fonty, farby, rozmery a pod. */

a.tlacitko {
   margin-left: 10px;
   margin-top: 30px;
   font-family: Arial, sans-serif;
   border-radius: 20px 20px;                        /* bud nie je vobec, alebo je px 1x, 2x, 4x */
   font-size: 11pt;
   font-weight:bold;
   width: 130px;
   border: 1px black solid;
   padding: 8px;
   display: block;
   text-align: center;
   text-decoration: none;
   color: black;
   background-color: #FFCCCC;   
}
     
h2 {
     text-align: center;
     }

p     {
      text-align: justify;
      margin-left: 20px;
      margin-right: 20px;
      }
      

ul.my-list {
  list-style: none;      
  padding-left: 0;       
}

ul.my-list li {
  position: relative;
  padding-left: 15px;    
  margin-bottom: 8px;
}

ul.my-list li::before {
  content: "?";          
  position: absolute;
  left: 0;
  top: 0;
  font-size: 18px;
  line-height: 1;
}


  
a.tlacitko:hover {
    color: #FF66FF;
    background-color: white;
}
img.rounded {
    border-radius: 50%;
    border: 5px solid #FFCCCC;
    box-shadow: 0 0 10px rgba(0,0,0,0.3);
}