/* CSS Document */
   body {
      background: ##00aa77;
      background-image: url("pozadi1.png"), url("pozadi2.png");
      background-repeat: repeat-x, repeat;
}
#kontejner {
  width: 900px;
  margin: 0 auto;
  border: 1px solid black;
  border-radius: 50px;  /* zaoblí rohy kontejneru */
}
#hlavicka {
  background-color: white; /* barva pozadi hlavicky */
  padding: 10px; /* nastavim vnitrni okraj na 10px z horni a spodni strany */
  height: 70px;
  text-align: center; /* zarovnani na stred */ 
  color: rgb(0,0,255);
  border-bottom: 1px solid #ccc; /* ramecek ze spod hlavicky */ 
  -webkit-border-radius: 50px 50px 0 0;  /* zaobleni hlavicky pouze zvrchu pro ruzne prohlizece */
  border-radius: 50px 50px 0 0;  /* zaobleni hlavicky pouze zvrchu pro ruzne prohlizece */          
}
#menu {
  background-color: #ddd; /* barva pozadi menu */
  text-align: center; /* zarovnani na stred */
}
#menu ul {
  list-style: none; /* odstranim odrazky v menu */
  margin: 0; /* zruseni vnejsiho okraje */
  padding: 0; /* zruseni vnitrniho okraje */
}
#menu ul li {
  display: inline; /* zobrazeni jako radkovy element (tag) */
}
#menu ul li a {
  padding: 10px;  /* vnitrni okraj - kde reaguje odkaz */
  display: inline-block;  /* zobrazeni jako radkove blokovy element (tag) */ 
  text-decoration: none; /* zruseni podtrzeni odkazu */
  color: #000; /* barva textu (cerna) */
}
#menu ul li a:hover {
  background-color: #fff; /* po najeti barva pozadi (bila) */
  text-decoration: underline; /* po najeti podtrhne */
  color: rgb(0,0,255); /* po najeti barva textu zelena */
}
#obsah {
  background-color: #fff; /* barva pozadi bila */
  padding: 10px;
}
#obsah img {
  padding: 10px 20px;  /* v obsahu vsechny img ohranici rameckem 10px zvrchu a zespod a 20px zleva a zprava */
  border-radius: 30px; /* zaoblí fotky v obsahu */
}
#levy-sloupec {
  width: 280px; /* sirka sloupce */
  float: left; /* obtekani */
  padding: 0 10px; /* odsazeni 10px ze stran !!!musim odecist ze sirky!!! */
}
#pravy-sloupec {
  width: 580px; /* sirka sloupce */
  float: right; /* obtekani */
  padding: 0 10px; /* odsazeni 10px ze stran !!!musim odecist ze sirky!!! */ 
}   
ul  {
  list-style-position: inside; /* odrazkovy seznam odskoci od obrazku, bude zarovnany pod sloupcem */
}
#paticka {
  background-color: #ddd;
  height: 50px;
  padding: 10px;
  border-top: 1px solid #ccc; /* ramecek z vrchu paticky */
  text-align: center; /* zarovnani na stred */
  -webkit-border-radius: 0 0 50px 50px; /* zaobleni hlavicky pouze zespodu pro ruzne prohlizece z ccs3generator.com */
  border-radius: 0 0 50px 50px;   /* zaobleni hlavicky pouze zespod pro ruzne prohlizece */
}
.na-stred {
  text-align: center;
}
.obr-foto-hlav {
  background-image: url('film.jpg'); /* vlozi fotku do hlavicky */
}
.mapa {
    text-align: center;
}
.mapa iframe {
    border: 8px solid rgb(86,86,86);  /* ramecek kolem map */
}
.galerie .foto {  /* SKATULKA NA FOTKU */
  display: inline-block;
  background-color: rgb(199,199,199); /* aby bylo videt, kde skatulka je */
}
.galerie .foto a {
  display: table-cell; /* "zobraz" div s vlastnostmi bunky tabulky */
  text-align: center;
  vertical-align: middle;
  width: 290px;
  height: 290px;
}
.galerie .foto a span {
  color: black;
}
.galerie .foto a img {    /* FOTKA VE SKATULCE */
  max-width: 250px; /* fotky v galerii - max sirka 250px */
  max-height: 250px; /*  fotky v galerii - max vyska 250px */ 
}
 .floatl {
  float: left; /* zarovna nalevo a obtece obsah z prave strany */
      }
      
.floatr {
  float: right; /* zarovna napravo a obtece obsah z leve strany */
      }
.clear {
  clear: both; /* zakazuje obtekani */
}
ul {
  list-style-position: inside; /* odrazkovy seznam odskoci od obrazku, bude zarovnany pod sloupcem */
}
table {
  background-color: black; /* pozadí tabulky na cernou */
  width: 100%; /* sirka tabulky, lze zadat i v px */
  text-align: center; /* zarovnani na stred */
  
}
th, td {
  background-color: white; /* barva pozadí jednotlivych buněk prekryji cerne pozadi tabulky */
}