@charset "utf-8";
body  {
	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: #333;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 100%;
	background-color: #FFF;
}

/* Tipy pro hybridní rozvržení
1. Jelikož velikost bočních sloupců určená jednotkami em je založena na výchozí velikosti písma uživatele, bude nutné zajistit, aby to zohledňovala grafika pozadí těchto sloupců. Při správném vytvoření je tato verze vhodnější pro uživatele, kteří vyžadují větší velikost písma, jelikož poměr šířky sloupců zůstává zachován. Pokud to není pro návrh žádoucí, změňte šířku na velikost v obrazových bodech a zároveň odpovídajícím způsobem změňte okraje u tagu #mainContent div.
2. Jelikož velikost postranních sloupců v tomto rozvržení je založena na 100% velikosti písma v elementu body, v případě zmenšení velikosti textu celkově pomocí velikosti písma: 80 % v elementu body nebo #container; dojde k poměrnému zmenšení šířek sloupců. Zmenšení můžete kompenzovat zvětšením šířky a velikosti postranních okrajů v tagu #mainContent 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.
4. Tag #container div není nutný pro toto rozvržení při 100% šířce. Můžete jej využít k vytvoření falešných sloupců nebo omezení šířky rozvržení.
5. U tagu #container div není nutné používat 100% šířku, jelikož tag div automaticky pokryje 100 % dostupného místa. Nastavení je zde použito pro případ, že budete chtít zmenšit velikost celého kontejneru – například za účelem ponechání volného místa na obou okrajích. Nastavení tak bude již pro úpravy k dispozici.
*/
.thrColHybHdr #container {
	width: 100%;
	background: #FFFFFF;
	/*margin: 0 auto;  the auto margins (in conjunction with a width) center the page if needed */
	text-align: left; /* Dojde k potlačení zarovnání textu: zarovnání na střed u elementu body. */
}  
.thrColHybHdr #header {
	background-color: #E0E0E0;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #999;
	padding: 10px 0;
} 
.thrColHybHdr #header h1, .thrColHybHdr #header h2 {
	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;
	color: #333;
	text-align: center;
}

/* 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 „.thrColHybHdr #sidebar1 p“.
*/
.thrColHybHdr #sidebar1 {
	float: left;
	width: 20%; /* Horní a dolní odsazení vytvářejí uvnitř tagů div viditelnou mezeru. */
	background-color: #FFF;
	padding-top: 15px;
	padding-bottom: 15px;
	padding-left: 0;
	text-align: right;
	margin: 0px;
}

.thrColHybHdr #sidebar1 a {
	text-decoration: none;
	color: #CCC;
}

.thrColHybHdr #sidebar1 a.aktivni {
	text-decoration: none;
	color: #666;
}

.thrColHybHdr #sidebar2 {
	float: right;
	width: 20%; /* Horní a dolní odsazení vytvářejí uvnitř tagů div viditelnou mezeru. */
	background-color: #FFF;
	padding-top: 15px;
	padding-right: 0;
	padding-bottom: 15px;
	padding-left: 0;
}
.thrColHybHdr #sidebar1 h3, .thrColHybHdr #sidebar1 p, .thrColHybHdr #sidebar2 p, .thrColHybHdr #sidebar2 h3 {
	margin-left: 10px; /* Pro každý prvek umístěný do sloupce je nutné zadat levý a pravý okraj. */
	margin-right: 10px;
}

.thrColHybHdr #sidebar2 h4  {
	margin-left: 6px; /* Pro každý prvek umístěný do sloupce je nutné zadat levý a pravý okraj. */
	margin-right: 10px;
	margin-bottom: 6px;
	color: #48566F;
	width: 95%;
	background-color: #F8F8F8;
	padding-top: 4px;
	padding-bottom: 4px;
	padding-left: 4px;
}

.thrColHybHdr #sidebar2 p {
	margin-top: 2px;
}

/* 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.
*/
.thrColHybHdr #mainContent {
	margin-top: 0;
	margin-right: 20%;
	margin-bottom: 0;
	margin-left: 20%;
	padding-top: 0;
	padding-right: 2.3em;
	padding-bottom: 0;
	padding-left: 2.3em;
/*	min-width: 400px;
	max-width: 900px;*/
}

.thrColHybHdr #mainContent h1, .thrColHybHdr #mainContent h2 {
	color: #666;	
}

.thrColHybHdr #mainContent p.datum {
	font-size: 90%;
	font-style: italic;
	color: #999;
}

.thrColHybHdr #mainContent p.pdf {
	background-image: url(images/pdf.png);
	background-repeat: no-repeat;
	padding-left: 64px;
	height: 60px;
	padding-top: 30px;
	margin-top: 30px;
}

.thrColHybHdr #mainContent p.doc {
	background-image: url(images/doc.png);
	background-repeat: no-repeat;
	padding-left: 64px;
	height: 60px;
	padding-top: 30px;
	margin-top: 30px;
}

.thrColHybHdr #mainContent a {
	text-decoration: none;
	color: #7585A4;
}

.thrColHybHdr #mainContent p.zvyrazneni {
	color: #036;
	text-align: center;
	font-weight: bold;
}

.thrColHybHdr #mainContent p.zvyrazneni a {
	color: #39F;
}

.thrColHybHdr #mainContent p.zvyrazneni_2 {
	color: #930;
	text-align: center;
	font-weight: bold;
}


.thrColHybHdr #mainContent p.dovetek {
	color: #09F;
	text-align: center;
}

.thrColHybHdr #footer {
	background-color: #666;
} 
.thrColHybHdr #footer p {
	color: #FFF;
	text-align: center;
	font-size: 110%;
	font-weight: bold;
	margin: 0px;
	padding: 12px 0;
}

/* 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;
}

.red {
	color: #F30;	
}