@charset "utf-8";
body {
	background: #FFF;
	margin: 0;
	padding: 0;
	color: #000;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 100%;
	line-height: 1.3;
}
/* ~~ Selektory elementů (tagů) ~~ */
ul, ol, dl { /* Kvůli rozdílům mezi prohlížeči je vhodné nastavit všem seznamům nulový padding a margin. Aby bylo nastavení konzistentní, můžete zadat požadované hodnoty buď zde, nebo u příslušných položek (LI, DT, DD), které jsou v seznamech obsaženy.
Pamatujte, že toto nastavení bude použito i v .nav seznamu (pokud ovšem nepoužijete specifičtější selektor). */
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0px;	 /* Horní margin odstraňujeme kvůli tomu, že za určitých okolností může margin "utéci" z DIV sekce, v níž je element obsažen. Spodní margin zajistí odsazení od následujících elementů. */
	padding-right: 15px;
	padding-left: 15px; /* je jednodušší nastavit padding elementům uvnitř DIVu než jej nastavovat samotnému DIV elementu (vyhneme se tak komplikovanému blokového modelu). Druhou možností by bylo použití vnořeného DIV elementu s bočním paddingem. */
}
a img { /* Tento styl zajistí odstranění modrého rámečku, které některé prohlížeče zobrazují okolo každého rámečku obsaženého uvnitř odkazu. */
	border: none;
}
/* ~~ Styly pro odkazy musí zůstat v uvedeném pořadí - včetně selektorů určujících zobrazení při najetí kurzorem myši na odkaz. ~~ */
a:link {
	color: #42413C;
	text-decoration: underline; /* pokud nehodláte používat obzvláště výjimečný vzhled odkazů, je vhodné odkazy podrhávat kvůli jejich snazší vizuální identifikaci */
}
a:visited {
	color: #6E6C64;
	text-decoration: underline;
}
a:hover, a:active, a:focus { /* díky těmto selektorům bude uživatel používající klávesnici rozpoznávat odkazy při jejich označení. */
	text-decoration: none;
}
/* ~~ kontejner s pevnou šířkou obsahuje všechny ostatní DIV elementy. ~~ */
.container {
	width: 950px;
	margin: 0 auto; /* nastavení pevné šířky a automatického okraje zajistí vycentrování obsahu. */
	border: 2px solid #060;
	background-color: #FFFFFF;
	background-image: url(obrazky/oddelovac.png);
	background-repeat: repeat-y;
}
.content h1 {
	font-size: 200%;
	margin-top: 10px;
	margin-bottom: 5px;
}
.content section h2 {
	font-size: 170%;
	color: #090;
	margin-top: 15px;
	margin-bottom: 5px;
}
.content .profil {
	margin-right: 25px;
	margin-bottom: 15px;
	margin-left: 25px;
	border-bottom-width: 10px;
	border-bottom-style: solid;
	border-bottom-color: #CADAAF;
}
.content section table{
	font-size: 90%;
	width: 740px;
	margin-left: 15px;
	border-bottom-width: 3px;
	border-bottom-style: solid;
	border-bottom-color: #060;
	border-collapse: collapse;
}
.content section table caption {
	font-size: 160%;
	line-height: 1.2em;
	font-weight: bold;
	color: #090;
	padding-top: 20px;
	padding-bottom: 10px;
}

.content section td, .content section th {
	text-align: left;
	padding: 5px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #090;
	vertical-align: top;
}
.content section th {
	color: #FFC;
	background-color: #090;
}
.content section .s100 {
	width: 100px;
}
.content section .s150 {
	width: 150px;
}

.content section .cena {
	text-align: center;
	width: 75px;
}
.content section .delka {
	text-align: center;
	width: 75px;
}

.content section .den {
	text-align: center;
	width: 75px;
}








#logo {
	position:absolute;
	width:170px;
	height:160px;
	z-index:1;
	margin-top: 10px;
	margin-left: 30px;
}
nav p {
	font-size: 90%;
	color: #FFC;
	background-color: #090;
	text-align: right;
	padding-top: 5px;
	padding-right: 20px;
	padding-bottom: 5px;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #060;
	font-weight: bold;
	margin: 0px;
	background-image: url(obrazky/pozadi.png);
	background-repeat: repeat-x;
}
nav p a:link, nav p a:visited {
	color: #FFC;
	text-decoration: none;
	padding: 5px;
}
nav p a:hover, nav p a:active {
	color: #FFF;
	background-color: #060;
}
/* ~~ Záhlaví stránky nemá nastavenou šířku, roztáhne se tedy přes celou stránku. ~~ */
header {
	background-color: #090;
	background-image: url(obrazky/banner.jpg);
	background-repeat: no-repeat;
	height: 130px;
}
/* ~~ Následují pravidla pro sloupce rozvržení. ~~ 

1) Padding je nastaven pouze pro horní a/nebo spodní stranu DIVu. Vnořené elementy mají padding nastaven po stranách. Díky tomu se nemusíme zabývat komplikovanými pravidly blokového modelu.
Pamatujte, že pokud přidáte padding nebo rámeček (border) pro samotný DIV, přičte se k nastavené šířce, čímž je teprve určena *celková* šířka. Alternativní možností je odstranění paddingu z vnořených elementů a použití druhého DIV elementu, kterému nastavíte požadovaný padding.

2) Sloupce nemají nastavenou vlastnost margin, protože jsou všechny obtékané. Pokud musíte margin nastavit, nenastavujte ji na té straně, pro niž nastavujete vlastnost float (pokud tedy blok má float: right, nenastavujte mu pravý margin). Často je možné místo margin použít padding. Pokud toto pravidlo musíte porušit, je vhodné nastavit bloku vlastnost "display:inline", čímž se vyhnete chybě v některých verzích prohlížeče Internet Explorer, který v těchto případech zdvojoval margin.

3) Protože lze třídy použít v jednom dokumentu vícekrát (a také protože je možné elementu nastavit více tříd), přiřadili jsme sloupcům tžídy místo identifikátorů. Dva postranní sloupce by například mohly být umístěny pod sebou. Pokud chcete používat styl jen jednou, lze pravidla snadno upravit tak, aby se vztahovala k identifikátorům místo ke třídám.

4) Pokud chcete mít navigaci na levé straně místo napravé, jednoduše nastavte sloupcům obrácené obtékání (float:right místo float:left) a zobrazí se v obráceném pořadí. Není tedy třeba přesouvat bloky v HTML části kódu.

*/
.sidebar1 {
	float: left;
	width: 180px;
	padding-bottom: 10px;
}
.green {
	color: #090;
}
.sidebar1 aside {
	font-size: 90%;
}
.content {
	padding: 10px 0;
	width: 770px;
	float: right;
}

/* ~~ Tento selektor vytváří prostor kolem seznamů v div.content ~~ */
.content ul, .content ol {
	padding: 0 15px 15px 40px; /* toto nastavení odpovídá výše uvedenému pravidlu pro nadpisy a odstavce. Dolní padding je nastaven pro vytvoření prostoru mezi položkami seznamu a na levé straně kvůli odsazení. Pravidlo lze podle libosti upravit. */
}

/* ~~ Styly pro navigaci. ~~ */
nav ul {
	list-style: none; /* Odstraňuje odrážky. */
	border-top: 1px solid #666; /* vytváří prostor mezi navigací a obsahem */
	font-size: 90%;
}
nav ul li {
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #0C0;
	border-right-color: #060;
	border-bottom-color: #060;
	border-left-color: #0C0;
}
nav ul a:link , nav ul a:visited { /* spojením selektoru zajistíme, že si tlačítka uchovají stejný vzhled i poté, co byla použita. */
	padding: 5px 5px 5px 15px;
	display: block; /* touto vlastností zajistíme, že se odkazy budou chovat jako blokové elementy a zaplní celý element LI, v němž jsou obsaženy. Celá oblast tak bude reagovat na kliknutí myši. */
	width: 160px;  /* nastavení šířky zajišťuje, že na kliknutí myši bude reagovat celá oblast i v Internet Exploreru 6. Pokud podporu pro IE6 nevyžadujete, lze nastavení odstranit. Správnou šířku zjistíte odečtením paddingu odkazu od šířky postranního sloupce. */
	text-decoration: none;
	background: #090;
	text-align: left;
	color: #FFC;
}
nav ul a:hover, nav ul a:active, nav ul a:focus { /* nastavuje barvu pozadí a písma pro navigaci myší i klávesnicí */
	background: #060;
	color: #FFF;
}

/* ~~ Zápatí stránky ~~ */
footer {
	padding: 10px 0;
	position: relative;/* nastavení pro IE6 */
	clear: both; /* atribut clear zajistí, že kontejner ví, kde končí jednotlivé sloupce */
	color: #FFC;
	font-size: 90%;
	background-color: #090;
	background-image: url(obrazky/pozadi.png);
	background-repeat: repeat-x;
}

/* Podpora HTML 5: nastavuje display:block novým elementům definovaným v HTML 5, aby prohlížeč věděl, jak je správně zobrazit. */
header, section, footer, aside, nav, article, figure {
	display: block;
}
.flt_rgt {
	float: right;
	margin-left: 10px;
}
.flt_lft {
	float: left;
	margin-right: 10px;
}
.content section {
	clear: both;
}
