@charset "utf-8";
body  {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #666666;
	margin: 0; /* Je vhodné nastavit nulový okraj a odsazení elementu body a umožnit tak použití různých výchozích hodnot prohlížeče. */
	padding: 0;
	text-align: center; /* Umístí kontejnery na střed v prohlížečích IE 5*. Text je nastaven na výchozí zarovnání vlevo v selektoru #container. */
	color: #000000;
}

/* Tipy pro elastická rozvržení
1. Jelikož celková velikost u elastických rozvržení je dána výchozí velikostí písma uživatele, nelze hodnoty s jistotou předpokládat. Při správném použití jsou vhodnější pro uživatele, kteří vyžadují větší velikost písma, protože poměr délky řádků zůstává zachován.
2. Nastavení velikostí tagů div v tomto rozvržení je založeno na 100% velikosti písma v elementu body. V případě celkového zmenšení velikosti textu pomocí velikosti písma: 80 % v elementu body nebo #container; dojde k poměrnému zmenšení celého rozvržení. Zmenšení můžete kompenzovat samostatným zvětšením některých tagů div.
3. Pokud dojde ke změně velikosti písma v různé míře u jednotlivých tagů div, nikoli celkově (např. tag #sidebar1 je nastaven na 70 % velikosti písma a tag #mainContent je nastaven na 85 % velikosti písma), dojde k poměrné změně celkové velikosti každého z tagů div. Můžete provést úpravy na základě konečné velikosti písma.
*/
.twoColElsRtHdr #container { 
	width: 46em;  /* Tato šířka vytvoří kontejner, který lze umístit do okna prohlížeče s šířkou 800 px, pokud je pro text ponechána výchozí velikost písma prohlížeče. */
	background: #FFFFFF;
	margin: 0 auto; /* Automatické okraje (společně se šířkou) nastaví stránku na střed. */
	border: 1px solid #000000;
	text-align: left; /* Dojde k potlačení zarovnání textu: zarovnání na střed u elementu body. */
} 
.twoColElsRtHdr #header { 
	background: #ffffff; 
	padding: 0 10px;  /* Toto odsazení odpovídá zarovnání vlevo u elementů v tazích div, které se nacházejí pod ním. Pokud je v tagu #header použit obraz namísto textu, můžete chtít odsazení odstranit. */
} 
.twoColElsRtHdr #header h1 {
	margin: 0; /* vynulováním okraje posledního elementu v tagu #header div zabráníte sbalení okraje – nevysvětlitelné mezeře mezi tagy div. Pokud má tag div kolem pevný okraj, není tato operace nutná, jelikož rovněž nedochází ke sbalení okraje. */
	padding: 10px 0; /* Použitím odsazení namísto okraje umožníte ponechání elementu ve vzdálenosti od okrajů tagu div. */
}

/* Tipy pro tag sidebar1:
1. Pokud nastavíte hodnotu velikosti písma pro tento tag div, celková šířka tagu div bude upravena odpovídajícím způsobem.
2. Jelikož jsou používány jednotky em, je vhodné nepoužívat odsazení pro vlastní postranní lištu. U prohlížečů, které odpovídají standardům, bude přidáno k šířce, čímž dojde k vytvoření neznámé skutečné šířky. 
3. Mezeru mezi stranou tagu div a obsaženými elementy lze vytvořit vložením levého a pravého okraje těchto elementů, jak je uvedeno v pravidle „.twoColElsRtHdr #sidebar1 p“.
*/
.twoColElsRtHdr #sidebar1 {
	float: right;
	width: 12em; /* Jelikož se jedná o plovoucí element, je nutné zadat šířku. */
	background: #3192CC; /* Barva pozadí se bude zobrazovat v délce obsahu sloupce, nikoli však dále. */
	padding: 15px 0; /* Horní a dolní odsazení vytvářejí uvnitř tagů div viditelnou mezeru. */
}
.twoColElsRtHdr #sidebar1 h3, .twoColElsRtHdr #sidebar1 p {
	margin-left: 10px; /* Pro každý prvek umístěný do sloupce je nutné zadat levý a pravý okraj. */
	margin-right: 10px;
}

/* Tipy pro tag mainContent:
1. Pokud nastavíte v tagu #mainContent div odlišnou hodnotu velikosti písma než v tagu #sidebar1 div, okraje tagu #mainContent div budou založeny na příslušné velikosti písma a šířka tagu #sidebar1 div bude založena na velikosti písma. Hodnoty těchto tagů div můžete upravit.
2. Mezera mezi tagy mainContent a sidebar1 je vytvořena levou mezerou v tagu mainContent div. Bez ohledu na to, jaké množství obsahu tag sidebar1 div obsahuje, mezera sloupce bude zachována. Levý okraj můžete odstranit, chcete-li, aby text v tagu #mainContent div vyplnil prostor v tagu #sidebar1, když obsah tagu #sidebar1 skončí.
3. Chcete-li zabránit posunutí plovoucího objektu, vyzkoušejte přibližnou maximální velikost obrázku či elementu, jelikož toto rozvržení je založeno na velikosti písma nastavené uživatelem v kombinaci s nastavenými hodnotami. Pokud má uživatel velikost písma nastavenu na menší než běžnou velikost, bude v tagu #mainContent div k dispozici méně místa, než se zobrazuje při zkoušení.
4. V podmíněném komentáři aplikace Internet Explorer níže je vlastnost zoom použita k získání vlastnosti tagu mainContent „hasLayout“. Je tak zabráněno několika chybám, které mohou u prohlížeče IE vyskytnout.
*/
.twoColElsRtHdr #mainContent {
  	margin: 0 13em 0 10px; /* Levý okraj bude mít ideální vzhled, pokud bude hodnota odsazení odpovídat nastavení u záhlaví a zápatí. */
} 
.twoColElsRtHdr #footer {
	padding: 0 10px;
	background-color: #3192CC;
} 
.twoColElsRtHdr #footer p {
	margin: 0; /* Vynulováním okrajů prvního elementu v zápatí zabráníte možnému sbalení okraje – vzniku mezery mezi tagy div. */
	padding: 10px 0; /* Odsazení tohoto elementu vytvoří mezeru stejně jako okraj, avšak bez problému se sbalením okraje. */
}

/* Různé třídy pro opakované použití */
.fltrt { /* Tuto třídu lze použít pro nastavení plovoucího elementu vpravo na stránce. Plovoucí element musí předcházet element, vedle kterého se má na stránce zobrazovat. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* Tuto třídu lze použít pro nastavení plovoucího elementu vlevo na stránce. */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* Tato třída musí být umístěna u elementu div nebo break a musí být posledním elementem před uzavřením kontejneru, který musí plovoucí prvek zcela obsahovat. */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}.menuVitvar {
	background-color: #004588;
	height: auto;
	width: 44.8em;
	text-transform: none;
	text-align: left;
	color: #FFF;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: -0.7em;
	padding-top: 10px;
	padding-right: 5px;
	padding-bottom: 10px;
	padding-left: 15px;
}
a {
	color:white;
	text-decoration: none;
	text-transform: none;
}
a:hover {
	color:#FFF;
	text-decoration: underline;
}
a:visited {
	color:#FFF;
	font-weight: bold;
}
#podpis {
	position: relative;
	color: #099;
	visibility: visible;
	left: 0;
	top: 10;
}
.hesloVitvar {
	background-color: #FC0;
	height: auto;
	width: auto;
	margin: 0px;
	padding: 15px;
	text-transform: none;
	text-align: right;
	font-weight: bold;
	color: #004588;
	clear: none;
	float: none;
}
#apDiv1 {
	position:relative;
	left:auto;
	top:-90px;
	width:271px;
	height:60px;
	z-index:1;
	background-color: #004588;
}


.podpisVitvar {
	color: #FFF;
	padding: 10px;
	float:left;
}
#galerie {
	border:1px #000 solid;
	margin-bottom:5px;
	margin-left: 5px;
}
#a-kdu {
	color:#004588;
	text-decoration: none;
	text-transform: none;
}
#a-kdu:hover {
	color:#004588;
	text-decoration: underline;
}
#a-kdu:visited {
	color:#004588;
	font-weight: bold;
}