/* ------------------------------------------------------------- */
/*  WWW.SEVERSKELISTY.CZ verze 2009                              */
/*  Copyright by Michael Stanovsky                               */
/* ------------------------------------------------------------- */
/* inspirace: http://www.vitdlouhy.cz/clanky/2sloupce-fixed.php  */
/* definice písma: http://www.pestujemeweb.cz/obsah/ruzne/velikost-pisma.php */


/*  hlavní styly pro SL - vcetne kryplovaní kvuli FrontPage      */ 
/*                        kryplovani shazuju pomoci STYLENFP.CSS */
/*                        ktery přidávám do dokumentu pomocí PHP,*/
/*                        takže ho FrontPage nevidí              */

/* 16.5.2010 - šedomodrá #306872 v odkazech -> tmavší #173337 (u nadpisů necháno) */
/* 16.5.2010 - modrá nahrazena šedomodrou: #004488 -> #306872 (nadpisy+odkazy)    */
/* 12.9.2010 - předělány tisky                                                    */

/* použité písmo: 'Verdana CE',Verdana,'Geneva CE','Arial CE','Helvetica CE',Arial,sans-serif;
alternativy http://typografie.dero.name/typografie-fonty-3.phtml: 
   široký bezpatkový:      Verdana,'Geneva CE',lucida,sans-serif;
   moc úzký bezpatkový:    Tahoma,'Lucida Grande CE',lucida,sans-serif;
   lepší malé bezpatkový:  'Trebuchet MS','Geneva CE',lucida,sans-serif;
   blbý patkový:           'Palatino Linotype','New York CE',utopia,serif;
   lepší patkový:          Georgia,'New York CE',utopia,serif;
   neproporcionální:       'Lucida Console','Monaco CE',fixed,monospace;
*/

body            { font-size: 9pt;
                  font-family: 'Verdana CE',Verdana,'Geneva CE','Arial CE','Helvetica CE',Arial,sans-serif;
                  background-color: #303030;
                  xx-background-image: url("imagesp/pozbig001.jpg");
                  text-align: center;          /* kvuli MSIE<7 - aby to bylo ve středu na stránce, jinak stačí v #papir margin: 0 auto; */
                  margin: 0px;        
                  padding: 0px;
     }

/* tipy pro použití AFTER - přidávání odkazu - nejlépe při tisku (otázka, zda to není rušivé) */
/* http://24ways.org/2007/back-to-the-future-of-print                                         */
/*
 a:link:after, a:visited:after, a:hover:after, a:active:after { content: " <" attr(href) "> ";
                                                                color: grey;
                                                                font-style: italic;
                                                                font-weight: normal;
                                                              }
*/


     
/* ---------------------------------------------------
   http://www.webtip.cz/art/wt_tech_html/wt_css02.html
   ---------------------------------------------------
   CENTROVÁNÍ - každý jinak
   ve většině prohlížečů funguje - ačkoli by správně nemělo, neboť parametr text-align má mít vliv pouze na plovoucí (inline) objekty - 
   tedy nikoli na bloky. V Mozille už to je odstraněno, ale margin: auto tam ještě není (2002)
       #obalka { text-align: center }
       #obsah { width: 50%; margin: auto }
       ...
       <DIV id="obalka">
           <DIV id="obsah">
           Text...
           </DIV>
       </DIV>
       
   RÁMEČKY - starý MSIE blbě
   nastavte mu v CSS hodnoty padding: 0 a border: 0. Tím zajistíte, že se vykreslí v přesné šířce. 
   Dovnitř něj pak umístěte druhý blok, jemuž již nenastavíte žádnou šířku (width: auto), 
   ale padding a border již můžete dát libovolný - tento vnitřní blok bude ve všech browserech 
   roztažen na maximální šířku tak, aby zcela zaplnil vnější omezující "obálku". 
       #obalka {width: 350px; padding: 0 }
       #obsah { padding: 8px; border: 2px solid black; background: white}
       ...
       <DIV id="obalka">
           <DIV id="obsah">
           Obsah...
           </DIV>
       </DIV>

   ABSOLUTNÍ POZICOVÁNÍ
   Plovoucí a pozicované bloky spolu nijak nekomunikují a nemůžete tedy říci: 
     "Blok_X bude umístěn tam, kde skončí blok_Y, podle toho, kolik v něm bude textu..." 
   Každý blok kromě vlastností width a height může mít ve spojení s atributem position:
     abslolute i vlastnosti left, right, top a bottom. Ty určují vzdálenost levého, pravého, horního,
     resp. spodního okraje bloku od nadřazeného kontejneru. 
   Okrajem prvku se přitom rozumí vnější hrana oblasti margin - má-li tedy nějaký blok nastaveno
     left: 10px, margin: 10px a padding: 10px, bude začínat 10px od levého okraje, 
     pak bude následovat 10px margin a 10px padding - samotný obsah tedy bude vzdálen od levého okraje 30px.   
     
   SAZBA
   V levém sloupci menu, v prostředním články, v pravém další informace
   sloupce měly výšku přizpůsobenu svému obsahu, jehož délku většinou předem neznáme
   sloupce uděláme plovoucí (float: left, float: right) - stejně jako se v HTML dělají obtékané obrázky
     - a tyto sloupce budou "obaleny" omezujícím boxem
   zajistíme, že na stránce bude vedle sebe v jednom rámečku několik boxů, přičemž obálka bude mít výšku nejvyššího z nich:
      
<STYLE>
DIV { font-size: 12px }
 
#obalka { width: 600px; padding: 0; margin: 0 }
 
#zahlavi { float: none; background: #D0C000; padding: 0; margin: 0; border-bottom: 1px solid black }
#l-box { float: left; width: 30%; background: #FFC000; padding: 0; margin: 0; }
#m-box { float: left; width: 40%; background: #FFC080; padding: 0; margin: 0; }
#r-box { float: right; width: 30%; background: #C0D0FF; padding: 0; margin: 0; }
 
.inbox  { padding: 5px; }
.inbox2 { padding: 5px; border-left: 1px solid black;}
 
	}

</STYLE>
 
<DIV id="obalka"> 
	<DIV id="zahlavi"> 
		<DIV class="inbox"> 
			Třísloupcová "sazba" - ponechána variabilní výška sloupců
		</DIV>
	</DIV>
	<DIV id="l-box"> 
		<DIV class="inbox"> 
			<H2>Toto je první sloupec.</H2>
			<P>Je to blok a má nastaveno oblékání vlevo (float: left)</P>
		</DIV>
	</DIV>
	<DIV id="m-box"> 
		<DIV class="inbox2"> 
			<H2>Toto je druhý sloupec</H2>
			<P>Má také float: left a černý rámeček pouze vlevo</P>
		</DIV>
	</DIV>
	<DIV id="r-box"> 
		<DIV class="inbox2"> 
			<H2>Pravý sloupec...</H2>
			<P>... má pro změnu float: right a rovněž černý rámeček pouze vlevo</P>
		</DIV>
	</DIV>
</DIV>

----------------

<STYLE>
DIV { font-size: 12px }
 
#obalka { width: 600px; padding: 0; margin: 0 }
 
#zahlavi { float: none; background: #D0C000; padding: 0; margin: 0; border-bottom: 1px solid black }
#l-box { float: left; width: 30%; height: 120px; background: #FFC000; padding: 0; margin: 0; }
#m-box { float: left; width: 40%; height: 120px; background: #FFC080; padding: 0; margin: 0; }
#r-box { float: right; width: 30%; height: 120px; background: #C0D0FF; padding: 0; margin: 0; }
 
.inbox  { padding: 5px; }
.inbox2 { padding: 5px; border-left: 1px solid black;}
 
	}
</STYLE>
 
<DIV id="obalka"> 
	<DIV id="zahlavi"> 
		<DIV class="inbox"> 
			Třísloupcová "sazba" - nastavena fixní výška sloupců
		</DIV>
	</DIV>
	<DIV id="l-box"> 
		<DIV class="inbox"> 
			<H2>Toto je první sloupec.</H2>
			<P>Je to blok a má nastaveno oblékání vlevo (float: left)</P>
		</DIV>
	</DIV>
	<DIV id="m-box"> 
		<DIV class="inbox2"> 
			<H2>Toto je druhý sloupec</H2>
			<P>Má také float: left a černý rámeček pouze vlevo</P>
		</DIV>
	</DIV>
	<DIV id="r-box"> 
		<DIV class="inbox2"> 
			<H2>Pravý sloupec...</H2>
			<P>... má pro změnu float: right a rovněž černý rámeček pouze vlevo</P>
		</DIV>
	</DIV>
</DIV>

-------------------
   BLBĚ VYPADÁ !!!!!
   obsah sloupce v půlce stránky skončí a až do konce zabírá pouze místo prázdnou, jednobarevnou plochou. 
   Pokud bychom se tomu chtěli vyhnout a prostor na stránce tak využít lépe, poskytují nám k tomu 
   i ty "nedokonalé" CSS plovoucí sloupce dokonce výhodu. Stačí totiž, když uděláme plovoucí pouze 
   krajní sloupce a za ně v kódu umístíme obsah "sloupce" prostředního, již bez obtékání. 
   Ten bude krajní sloupce obtékat a až jejich obsah skončí, bude pokračovat v celé šíři sazby.    

<STYLE>
DIV { font-size: 12px }
 
#obalka { width: 600px; padding: 0; margin: 0 }
 
#zahlavi { float: none; background: #D0C000; padding: 0; margin: 0; border-bottom: 1px solid black }
#l-box { float: left; width: 30%; background: #FFC000; padding: 0; margin: 0; }
#m-box { float: none; background: #FFD0A0; padding: 0; margin: 0; }
#r-box { float: right; width: 30%; background: #C0D0FF; padding: 0; margin: 0; }
 
.inbox  { padding: 5px; }
 
	}
</STYLE>
 
<DIV id="obalka"> 
	<DIV id="zahlavi"> 
		<DIV class="inbox"> Třísloupcová "sazba" - ponechána volná výška sloupců, plovoucí pouze krajní sloupce</DIV>
	</DIV>
	<DIV id="l-box"> 
		<DIV class="inbox"> 
			<H2>Toto je první sloupec.</H2>
			<P>Je to blok a má nastaveno oblékání vlevo (float: left)</P>
		</DIV>
	</DIV>
	<DIV id="r-box"> 
		<DIV class="inbox"> 
			<H2>Pravý sloupec...</H2>
			<P>... má pro změnu float: right</P>
		</DIV>
	</DIV>
	<DIV id="m-box"> 
		<DIV class="inbox2"> 
			<H2>Toto je druhý sloupec</H2>
			<P>Má již float: none a je v HTML umístěn jako poslední. Proto se nejdříve vykreslí levý sloupec (plovoucí vlevo), poté pravý sloupec (plovoucí vpravo) a tento sloupec, již bez obtékání až nakonec, mezi ně...</P>
		</DIV>
	</DIV>
</DIV>

-------------------

<STYLE>
DIV { font-size: 12px }
 
#obalka { width: 100%; background: #FFD0A0; padding: 0 0 10px 0; margin: 0; }
 
#zahlavi { float: none; background: #D0C000; padding: 0; margin: 0; border-bottom: 1px solid black }
#l-box { float: left; width: 30%; background: #FFC000; padding: 0; margin: 0 10px 10px 0; }
#r-box { float: right; width: 30%; background: #C0D0FF; padding: 0; margin: 0 0 10px 10px; }
 
.inbox  { padding: 5px; }
 
	}
</STYLE>
 
<DIV id="obalka"> 
	<DIV id="zahlavi"> 
		<DIV class="inbox"> 
			Třísloupcová "sazba" - plovoucí pouze krajní sloupce, variabilní šířka sloupců (celek má šířku 100%)
		</DIV>
	</DIV>
	<DIV id="l-box"> 
		<DIV class="inbox"> 
			<H2>Toto je první sloupec.</H2>
			<P>Je to blok a má nastaveno oblékání vlevo (float: left)</P>
		</DIV>
	</DIV>
	<DIV id="r-box"> 
		<DIV class="inbox"> 
			<H2>Pravý sloupec...</H2>
			<P>... má pro změnu float: right</P>
		</DIV>
	</DIV>
 
			<H2>Toto je střední "sloupec"</H2>
			
	<P>Je v HTML umístěn jako poslední, již není ani umístěn v samostatném bloku. Nejdříve vykreslí levý sloupec (plovoucí 
		vlevo), poté pravý sloupec (plovoucí vpravo) a tento sloupec, již bez obtékání až nakonec, mezi ně... Navíc bylo vhodné 
		doplnit pozadí do obálky, protože některé prohlížeče ponechají před prostředním sloupcem prázdný řádek. A nakonec, 
		aby nebyl text nalepený na spodní okraj obálky, byl obálce přidán 10px padding-bottom. Je v HTML umístěn jako poslední, 
		již není ani umístěn v samostatném bloku. Nejdříve vykreslí levý sloupec (plovoucí vlevo), poté pravý sloupec (plovoucí 
		vpravo) a tento sloupec, již bez obtékání až nakonec, mezi ně... Navíc bylo vhodné doplnit pozadí do obálky, protože 
		některé prohlížeče ponechají před prostředním sloupcem prázdný řádek. A nakonec, aby nebyl text nalepený na spodní 
		okraj obálky, byl obálce přidán 10px padding-bottom.</P>
 
</DIV>

 
  
   
--------------------------------------------------------- */     

#papir          { position: static;
                  width: 909px;
                  padding: 0px;
                  background-image: url("images/papir0.gif");
                  background-color: #FFFFFF;   /* nedám-li patičku, nefunguje v Opeře a Firefoxu; Netscape vyžaduje v patičce text */
                  margin: 0px auto;            /* střed stránky, protože tohle nezná MSIE<7, musí být také v body text-align:center; */
                  text-align: left;            /* aby se texty zařezávaly doleva */
/* nasleduje zmena kvuli vyvoji ve FrontPage - tu shazuji pomoci STYLENFP.CSS na hodnoty uvedene vyse */
                  position: absolute; left:0px; top:0px;
                  width: 741px;
                  padding: 0 15px 0 70px; 
                  background-image: url("images/nicwhite.gif");
     }

#hlavicka-null  { width: 100%; padding: 0; border: 0;       /* NULL --- různé prohlížeče různě interpretují css - viz vitdlouhy.cz */
     }
#hlavicka       { 
     }
#hlavicka1      { margin: -2px 25px 10px 25px;
     }
#zahlavi        { height: 110px; 
                  background:url('imagesp/poz001.jpg') no-repeat;  /* tady je to zbytečné, budu ho měnit pomocí PHP přímo v dokumentu */
                }

#sloupec-l-null { width: 60px; float: left; padding: 0; border: 0; 
     }
#sloupec-l      { padding: 15px 0 0 35px;
     }
           
#sloupec-null   { width: 780px; float: right; padding: 0; border: 0; 
     }
#sloupec        { padding: 0 15px 0 70px; 
                  margin: 0 35px 0 0;
                  border: 2px solid #CCCCCC;
                  border-radius: 9px; 
                  background-color: #FFFFFF; 
                }
#citac          { width: 90px; 
                  height: 50px; 
                  z-index: 1; 
                  float: left;
                  margin: 8px 0 0 8px;
     }

#paticka-null   { clear: both; width: 100%; padding: 0; border: 0; 
     }
#paticka        { margin: 0 40px 0 0;                  
     }

#sloupec-ptyd   { float: right;                      /* pravý sloupec v posledním týdeníku */
                  text-align: center; 
                  width: 145px; 
                  margin: 5px -10px 5px 8px; 
                  background: #EEEEEE;
                  border-radius:6px;
                  padding:5px 0px 10px 0px;
     }
#sloupec-ptyd hr { height: 1px;
                color: #AAAAAA;
                background-color: #AAAAAA;
                border: 0px solid #AAAAAA;
     }

.odsazeni       { margin: 0px 0px 0px 15px;
     }

.skryj	        { position:absolute; 
                  left:-1000px; top:-1000px; 
                  width:1px; height:1px; 
                  overflow:hidden; 
                }

/*   F O R M U L A R E    */
   
input, span.input 
                { border: 1px solid #7F7F7F;
                  margin-top: 1px;
                  margin-bottom: 1px;
                  color: #000000; 
                  font-size: 8pt;
                  font-family: 'Verdana CE',Verdana,'Geneva CE','Arial CE','Helvetica CE',Arial,sans-serif; /* v body nestačí, MSIE sem dává Arial */
     }
input.bezokraje { border: 0px solid; 
                  padding-top:0px;
                  padding-bottom:0px;
                  vertical-align:-25%;
     }
input.neviditelny 
                { height: 1px; 
                  width: 1px; 
                  font-size: 1px; 
                  border: 0px solid;
     }
#diskuse input.neviditelny                     /* pro diskusi pod článkem zelené pozadí */
                { background:#CDE9DA
     }
textarea        { border: #7F7F7F 1px solid;
                  color: #000000; 
                  font-size: 8pt;
                  font-family: 'Verdana CE',Verdana,'Geneva CE','Arial CE','Helvetica CE',Arial,sans-serif; /* v body nestačí, MSIE sem dává Arial */
     }

/*   F O R M U L A R E   -   ENHANCED EDITOR       */

.dhtmed-o { border-bottom: buttonshadow 1px solid;
            border-left: buttonhighlight 1px solid;
            border-right: buttonshadow 1px solid;
            border-top: buttonhighlight 1px solid;
            cursor: hand;
            margin-left: 0px;
            margin-right: 0px
     }

.dhtmed-v { margin-left: 1px;
            margin-right: 1px;
            margin-top: 2px;
            visibility: visible
     }

/*   O B R A Z K Y    A    Č Á R Y   */   

hr            { height: 1px; 
                color: #006B9F;
                background-color: #006B9F; 
                border: 0px solid #006B9F; 
                color: #208BAF;
                background-color: #208BAF; 
                border: 0px solid #208BAF; 
     }
hr.s          { height: 1px;                      /* linka ... tmavě šedá např. pro počítadlo online */
                color: #444444;
                background-color: #444444;
                border: 0px solid #444444;
                width: 90%;
                text-align: center;
     }

img           { border-color: #000000;            /* barvy rámečku kolem obrázku */
                border-radius: 4px; 
     }
        
/*  P Í S M O   -   N A D P I S Y  */

h1            { font-size: 14pt;
                text-align: left;
                margin: 10px 0 5px 0;
                color: #C00000;
                font-weight: bold;
     }
h1 a:link, h1 a:visited, h1 a:active, h1 a:hover
              { color: #C00000;
     }

h2            { font-size: 11pt;
                text-align: left;
                margin: 8px 0 5px 0;
                color: #306872;
                font-weight: bold;
     }
h2 a:link, h2 a:visited, h2 a:active, h2 a:hover
              { color: #306872;
     }   

h3            { font-size: 10pt;
                text-align: left;
                margin: 2px 0 0 0;
                padding-left: 10px;
                font-weight: bold;
                background-image: url("images/square2.gif");   
                color: #306872;
     }
h3 a:link, h3 a:visited, h3 a:active, h3 a:hover
              { color: #306872;
     }   
     
h4            { font-size: 11pt;             /* ODKAZY - záchranka kdybych zapoměl DIV ID= */
                text-align: left;
                color: #306872;
                font-weight: bold;
                margin: 8px 0 5px 0;
                padding: 1px 10px 1px 10px;
                background: #EEEEEE; 
     }
h4 a:link, h4 a:visited, h4 a:active, h4 a:hover
              { color: #306872;
     }   

/*   P I S M O   */

p             { margin: 5px 0 5px 0;
                text-align: justify;
                line-height: 1.2;
                line-height: 1.3;   /* 17. 12. 2011 ??????? */
                color: #000000; 
     }

p a:link, p a:visited, p a:active, p a:hover
              { color: #173337;
     }

/* tecky misto cary - treba doladit, vynechat obrazky, vynechat menu aj...
                xxx-border-bottom: 1px #333333 dashed;
                xxx-text-decoration: none;
*/

span.mensi-s { font-size: 8pt;
                color: #777777;
     }
span.mensi   { font-size: 7pt;
     }
span.s       { color: #777777;
     }
     
p.MsoNormal, p.l, p.ls, p.mensi-l, p.mensi-ls    /* zbytečné - viz popis "p" */
              { text-align: justify;
     }
p.h3date      { text-align: left;
                margin: 0px;
     }
p.r, p.rs, p.mensi-r, p.mensi-rs, p.mensi2-rs 
              { text-align: right;
     }
p.c, p.cs, p.mensi-c, p.mensi-cs
              { text-align: center;
     }
p.ls, p.rs, p.cs, p.mensi-ls, p.mensi-rs, p.mensi2-rs, p.mensi-cs, 
span.h3-mensi-s, 
p.h3date      { color: #777777;
     }
p.mensi-l, p.mensi-r, p.mensi-c, p.mensi-ls, p.mensi-rs, p.mensi-cs,
span.h3-mensi-s, 
.mensi-l, 
p.h3date      { font-size: 8pt;
     }
p.mensi2-rs   { font-size: 7pt;
     }
p.ls a:link, p.ls a:visited, p.ls a:active, p.ls a:hover,
p.rs a:link, p.rs a:visited, p.rs a:active, p.rs a:hover,
p.cs a:link, p.cs a:visited, p.cs a:active, p.cs a:hover,
p.mensi-ls a:link, p.mensi-ls a:visited, p.mensi-ls a:active, p.mensi-ls a:hover,
p.mensi-rs a:link, p.mensi-rs a:visited, p.mensi-rs a:active, p.mensi-rs a:hover,
p.mensi2-rs a:link, p.mensi2-rs a:visited, p.mensi2-rs a:active, p.mensi2-rs a:hover,
p.mensi-cs a:link, p.mensi-cs a:visited, p.mensi-cs a:active, p.mensi-cs a:hover,
p.h3date a:link, p.h3date a:visited, p.h3date a:active, p.h3date a:hover,
span.h3-mensi-s a:hover, span.h3-mensi-s a:link, span.h3-mensi-s a:visited, span.h3-mensi-s a:active
              { color: #777777;
     }

span.h3-mensi-s a:hover,
p a:hover     { background: #E0E0E0;
     }
     
     
/*  P Í S M O   -   M E N U  */
/* menu: nepodržené, menu-u: podtržené, menu-right: podtržené v rámečku napravo    */
/* menutyd - jako menu, ale šedý podklad a orámované - mezimenu v týdeníku i jinde */

p.menu, p.menutyd, p.menu-ul, p.menu-ur, p.menu-urs, p.menu-right
                  { font-size: 8pt;
                    font-weight: bold;
                    text-align: left;        
                    color: #173337;
                    margin: 1px 10px 1px 15px;
                    text-decoration: none;
     }
p.menutyd         { text-align:right; 
                    background: #EEEEEE; 
                    border-top: 1px solid #006B9F; 
                    border-bottom: 1px solid #006B9F; 
                    padding: 1px 10px 1px 10px; 
                    margin: 10px 0px 10px 0px;
     }     
p.menu-ur         { text-align: right;
     }
p.menu-urs        { text-align: right;
                    color: #777777;
     }
p.menu-right      { float: right;
                    text-align: right;
                    margin: 4px 0px 4px 8px;     /* odsazení bloku */
                    padding: 4px;  
                    border: 3px solid #EEEEEE;   /* ohraničení */
                    background: #FFFFFF;         /* pro jistotu i barva */
     }

p.menu a:link, p.menu a:visited, p.menu a:active,
p.menutyd a:link, p.menutyd a:visited, p.menutyd a:active
                  { text-decoration: none;
                    cursor:hand;
     }
p.menu-ul a:link, p.menu-ul a:visited, p.menu-ul a:active,
p.menu-ur a:link, p.menu-ur a:visited, p.menu-ur a:active,
p.menu-right a:link, p.menu-right a:visited, p.menu-right a:active
                  { text-decoration: underline;
                    cursor:hand;
     }
p.menu a:hover, 
p.menutyd a:hover, 
p.menu-ul a:hover, 
p.menu-ur a:hover, 
p.menu-right a:hover
                  { text-decoration: underline;
                    background: #E0E0E0;
     }

/*  P Í S M O   -   T A B U L K Y  */
td             { font-size: 9pt;
                 margin: 0px;
                 font-family: 'Verdana CE',Verdana,'Geneva CE','Arial CE','Helvetica CE',Arial,sans-serif;  /* pro sichr, možná stačí jen v body */
               }  

h1.tab         { margin: 15px 5px 5px 5px;
                 text-align: left;
     }
h2.tab         { margin: 8px 5px 5px 5px;
                 text-align: left;
     }
p.tab-l,p.tab-ls
               { text-align: left;
                 margin: 0 5px 0 5px;
     }
p.tab-r,p.tab-rs
               { text-align: right;
                 margin: 0 5px 0 5px;
     }
p.tab-c,p.tab-cs
               { text-align: center;
                 margin: 0 5px 0 5px;
     }
p.tab-mensi-l ,p.tab-mensi-ls
               { font-size: 8pt;
                 text-align: left;
                 margin: 0 5px 0 5px;
     } 
p.tab-mensi-r,p.tab-mensi-rs
               { font-size: 8pt;
                 text-align: right;
                 margin: 0 5px 0 5px;
     }
p.tab-mensi-c,p.tab-mensi-cs
               { font-size: 8pt;
                 text-align: center;
                 margin: 0 5px 0 5px;
     }
p.tab-vetsi-l  { font-size: 11pt;
                 text-align: left;
                 margin: 0 5px 0 5px;
     }      
p.tab-vetsi-r  { font-size: 11pt;
                 text-align: right;
                 margin: 0 5px 0 5px;
     }
p.tab-vetsi-c  { font-size: 11pt;
                 text-align: center;
                 margin: 0 5px 0 5px;
     }
p.tab-ls,p.tab-rs,p.tab-cs,p.tab-mensi-ls,p.tab-mensi-rs,p.tab-mensi-cs
               { color: #777777;
     }

     
/*  P Í S M O   -   S P E C I A L N I  */

#niceditor p   { margin: 5px;
               }

p.chyba        { color: #C00000;              /* CHYBOVE HLASKY */
                 margin: 5px 0px 5px 0px;
                 text-align: left;
                 font-weight: bold;
                 background: #FFFF00; 
     }

p.googletopmessage
               { color: #C00000;              /* oznámení v případě google-překladu */
                 margin: 0px 25px 0px 25px;
                 text-align: center;
                 background: #FFFF00; 
                 border-top:    4px #005E51 solid;
                 border-bottom: 5px #005E51 solid;
     }
     
p.citac        { color: #888888;              /* POČITADLO */
                 font-size: 8pt;
                 text-align: left;
                 margin: 0px 0px 0px 0px;
     }
span.citacbig  { color: #333333;              /* POČITADLO VELKÉ */
                 font-size: 10pt;
                 font-weight: bold;
     }
span.citacsmall { color: #333333;              /* POČITADLO MALÉ */
                 font-weight: bold;
     }

p.citacstranky { font-size: 8pt;              /* POCITADLO STRANKY */
                 text-align: left;
                 color: #777777;
                 margin-left: 180px;
     }

p.pop          { color: #777777;              /* POPISEK OBRAZKU */
                 font-size: 8pt;
                 text-align: center;
                 margin: 1px 0 0 0;
                 line-height: 1.1;
     }

p.pop-left, p.pop-right, p.pop-center                     
               { font-size: 8pt;              /* popis písma */
                 text-align: center;
                 line-height: 1.1;
                 color: #777777;
                 padding: 2px 4px 2px 4px;  
                 border: 3px solid #EEEEEE;   /* ohraničení */
                 border-radius: 9px; 
                 background: #FFFFFF;         /* pro jistotu i barva */
     }
p.pop-left     { float: left;
                 margin: 4px 8px 4px 0px;     /* odsazení bloku */
     }      
p.pop-right    { float: right;
                 margin: 4px 0px 4px 8px;     /* odsazení bloku */
     }     
p.pop-center   { width: 625 px;               /* šířka obrázku + 2px rámeček obrázku + 6px rámeček bloku = předefinovat v textu */
     }     
p.pop-left img, p.pop-right img, p.pop-center img, p.menu-right img
               { border: 1px solid;          /* rámeček kolem obrázku */
                 margin: 2px 0px 2px 0px;
                 border-radius: 6px; 
     }     
p.pop a:link, p.pop a:visited, p.pop a:active, p.pop a:hover,
p.pop-left a:link, p.pop-left a:visited, p.pop-left a:active, p.pop-left a:hover,
p.pop-right a:link, p.pop-right a:visited, p.pop-right a:active, p.pop-right a:hover,
p.pop-center a:link, p.pop-center a:visited, p.pop-center a:active, p.pop-center a:hover
               { color: #777777;
     }
     
/* pop-left/right předefinuju, aby se nezobrazovalo obdélnikové pozadí, ale takový hezký oblý rámeček    */
/* ------------------------------------------------------------ vynález VaN cz 20.6.2010 --------------  */
p.pop-left-xx   { margin: 5px 10px 15px -10px;   /* jiné ohraničení - teoreticky by se nemuselo měnit    */
               }
p.pop-right-xx  { margin: 5px -10px 15px 10px;   /* jiné ohraničení - teoreticky by se nemuselo měnit    */
               }
p.pop-left-xx, p.pop-right-xx
               { padding: 0px;                   /* výplň musí být nulová, jinak se obrázek nevycentruje */
                 border: 1px solid #333333;      /* celkové orámování (vč. textu) vypnout; musím to      */
                                  /* orámovat 1px, bylo-li by 0px, neobtékalo by to popisek pod obrázkem */
                 background-color: #333333;      /* pozadí vypnout; přepíše se rámečkem, ale co kdyby... */
                 /* background: url(...) no-repeat; - pro každý obrázek je pozadí/rámeček jinak velké;   */
                 /*           generuju je pomocí frame.php, sem ale vložit ani rozměr, ani jméno obrázku */
                 /*           to se však dá vyčíst z DOM modelu, dělám to dynamicky - javascript frame() */
                 /* POZOR: Safari a Chrome neumějí vyčíst rozměr, pokud není explicitně zadán v tagu IMG */
               }
p.pop-left-xx img, p.pop-right-xx img
               { margin: 20px;          /* tímhle obteču obrázek o 20px prostorem, kde bude vidět pozadí */
               }     
     

/*  M E N U   H O V E R  */
/*  inspirace: http://css.interval.cz/clanky/hover-menu          */
/*  je třeba opravit chování HOVER ve starších verzích MSIE      */
/*  www.hszk.bme.hu/~hj130/css/list_menu/hover                   */
/*  to se opravuje stylem stylehov.css - přidávám ho do html-dokumentu přes PHP aby na něj neviděl FrontPage */
/*  pozor, když to přejmenuješ, musíš změnit jméno i v stylehov.css */

#menuhover {
      xxx-width: 100%;              /* kvuli MSIE<=6 musí být 99% - asi špatně interpretuje STRICT model - UŽ ZASE NE!! */
      margin: 0px;
      padding: 0px 0px 11px 0px;
     }

#menuhover ul {
     }

#menuhover li {                      /* popis jen základního menu */
      width: 148px;    /* 148 */
      border: 1px solid #222747;
      border-right: 0;               /* zařídí, aby dělící čáry nebyly dvojité */
      float: left; 
      list-style-type: none;
     }      
#menuhover li.rightpolozka {          /* pravé ohraničení u poslední položky menu */
      border: 1px solid #222747;
     }   

#menuhover li ul {                   /* popis kompletního rozbalovaného submenu */
      background-color: #FFFFFF;     /* barva buňky může být jakákoliv; nesmí však chybět kvůli MSIE5+Opeře (jinak se shazuje submenu) */
      position: absolute;
      visibility: hidden;            /* defaultně zhasnuté */
      width: 50px;                   /* jakákoliv hodnota <= šířka základního menu */
      margin: 1px 0 0 -1px;          /* "1px" a "-1px" musí korespondovat se šířkou border */
      padding: 0;
      float: none;
      list-style-type: none;      
     }      

#menuhover li ul li {                /* popis položek rozbalovaného submenu */
      border: 1px solid #222747;     /* obnoví ohraničení vpravo, které bylo vymazáno v "#menuhover li"  */
      border-top: 0;
     }    

#menuhover li:hover ul,              /* rozbaluje submenu */
#menuhover li.hover ul{              /* je to u 2x, Firefox se na to kouká jinak nez MSIE */
      visibility: visible;
     }

#menuhover a {                       /* popis písma a buňky - normální */
      background-color: #7C8EA5;     /* barva buňky */
      padding: 1px 1px 3px 1px;      /* odsazení od okrajů v buňce */
      font-size: 8pt;
      line-height: 1.1;
      color: #FFFFFF;
      font-weight: bold;
      text-decoration: none;
      display: block;
     }   
#menuhover ul a {                     /* dtto - změna pro rozbalené menu */
      padding: 1px 5px 3px 8px;       /* odsazení od okrajů v buňce */
      text-align: left;
     }   

#menuhover a:hover {                  /* popis písma - vybrane (dědí se z "#menuhover a") */
      background-color: #405070;
      color: #FFFF77;
     }
    
     
/*  M E N U   L E V E   */
/*  v levém sloupci, dříve v podobném stylu jako horní hover-menu */

#blokokrajovy-null {
      width: 99%;                     /* kvuli MSIE<=6 musí být 99% - asi špatně interpretuje STRICT model - ?????? */
      margin: 0px 0px 5px 0px;
      padding: 0px;
      width: 153px;
     }
#blokokrajovy {
      background-color: #7C8EA5;
      border: 1px solid #405070; 
      border-radius: 6px; 
      padding-bottom: 2px;
     }
#blokokrajovy h2 { 
      color: #FFFFFF;
      font-size: 9pt;
      padding: 4px 1px 4px 2px; 
      margin: 2px 1px 4px 1px;
      background-color: #405070;   
      border-radius: 4px; 
     }
#blokokrajovy img {
      margin-left: -2px;
      border-radius: 6px; 
     }
#blokokrajovy a, 
#blokokrajovy p {
      margin: 1px 0 1px 0;
      padding: 0 3px 0 7px;
      text-indent: -8px;
      font-size: 8pt;
      font-family: 'Arial CE','Helvetica CE',Arial,sans-serif;   /* !!! bez Verdany, je moc široká !!! */
      line-height: 1.0;
      color: #FFFFFF;
      text-align: left;
      text-decoration: none;
      display: block;
     }   
#blokokrajovy a:hover {
      color: #FFFF77;
      background-color: #405070;
     }

/*  M E N U   H O R N I   */
/*  menu pod horním hover-menu s šedým, bílým či modrým podkladem a zarovnané vlevo/vpravo */

#menuhorni       { padding: 1px 5px 0px 4px;         /* MSIE */
                    xxx-padding: 1px 5px 0px 4px;        /* FIREFOX, OPERA - asi jiný box model */
                    xxx-margin-top: -8px;                /* OPERA - asi jiný box model */
                    xxx-float: left;                     /* FIREFOX - za hover-menu následovat (div style="float:left;") */
                 } 
#menuhorni .s    { float: right;                    /* šedivý řádek */
                   background: #EEEEEE;
                   width: 746px;
                 } 
#menuhorni .s .l { float: left;                     /* šedivý řádek vpravo */
                   margin-left: 5px;                    
                 }   
#menuhorni .s .r { float: right;                    /* šedivý řádek vpravo */
                    padding-top: 4px;
                 }   
#menuhorni .w    { float: right;                    /* bílý řádek */
                   background: #FFFFFF;
                   width: 746px;
                 } 
#menuhorni .w .r { float: right;                    /* bílý řádek vpravo */
                   padding-top: 4px;
                 } 
#menuhorni .m    { float: right;                    /* modrý řádek */
                   background: #E7F0F7;
                   width: 746px;
                   margin-bottom:3px;
                 } 
#menuhorni .m .r { float: right;                    /* modrý řádek vpravo */
                 }

/*  M E N U   D O L N I   */

#menudolni, #menudolnis
                 { padding: 1px 0 1px 0;
                   margin:  2px 0 2px 0;
                 }      
#menudolnis      { background: #EEEEEE;
                 }      
p.menu-d         { font-size: 8pt;
                   font-weight: bold;
                   text-align: center;        
                   color: #173337;
                   text-decoration: none;
                 }
p.menu-d a:link, p.menu-d a:visited, p.menu-d a:active
                 { text-decoration: none;
                 }
p.menu-d a:hover { text-decoration: underline;
                 }

/* -------------------------------------------------------- */     

/*  O D K A Z Y  */
#odkazy       { padding: 10px 10px 3px 10px; 
                margin: 5px 0px 5px 0px;
                border: 3px solid #E25B07; 
                background: #FFECBC;
                clear: right;
                border-radius: 8px;
              }
#odkazy h4    { color: #FFFFFF;
                margin: -9px -9px 5px -9px;
                background: #E25B07; 
                border-radius: 5px;
              }
#odkazy h4 a:link, #odkazy h4 a:visited, #odkazy h4 a:active, #odkazy h4 a:hover
              { color: #FFFFFF;
              }  
#odkazy p, #odkazy p.l
              { text-align: left;
              } 

/*  P O Z N A M K Y  */

#note         { padding: 10px 10px 3px 10px; 
                margin: 5px 0px 5px 0px;
                border: 3px solid #777777; 
                background: #EEEEEE;
                clear: right;
                border-radius: 8px;
              }
#note h4      { color: #FFFFFF;
                margin: -9px -9px 5px -9px;
                background: #777777; 
                border-radius: 5px;
              }
#notebezram h4{ color: #FFFFFF;
                margin: 0px -9px 5px -9px;
                background: #AAAAAA; 
                border-radius: 5px;
              }
#note h4 a:link, #note h4 a:visited, #note h4 a:active, #note h4 a:hover,
#notebezram h4 a:link, #notebezram h4 a:visited, #notebezram h4 a:active, #notebezram h4 a:hover
              { color: #FFFFFF;
              }  
#note p, #note p.l,
#notebezram p, #notebezram p.l
              { text-align: left;
              } 

/*  H O D N O C E N I  */

#hodnoceni    { padding: 10px 10px 3px 10px; 
                margin: 5px 0px 5px 0px;
                border: 3px solid #173337; 
                background: #F2F4FF;
                clear: right;
                border-radius: 8px;
              } 
#hodnoceni h4 { color: #FFFFFF;
                margin: -9px -9px 5px -9px;
                background: #004477; 
                border-radius: 5px;
              } 
#hodnoceni h4 a:link, #hodnoceni h4 a:visited, #hodnoceni h4 a:active, #hodnoceni h4 a:hover
              { color: #FFFFFF;
              } 
#hodnoceni p, #hodnoceni p.l, #hodnoceni p.ls
              { text-align: left;
                font-size: 9pt;
                color: #004477; 
              } 
#hodnoceni p.ls
              { color: #777777;
                font-size: 8pt;
                margin: 0px 0px 5px 2px; 
              }     
#hodnoceni input
              { border: 0px solid;
                color: #004477; 
                font-weight: bold;
                font-size: 9pt;
                margin: 0px;
                padding: 0px; 
              }
#hodnoceni input.znamka0 {background: #F2F4FF;}
#hodnoceni input.znamka1 {background: #E0E6EB; width: 25px;}
#hodnoceni input.znamka2 {background: #D0D8DF; width: 25px;}
#hodnoceni input.znamka3 {background: #C0CBD6; width: 25px;}
#hodnoceni input.znamka4 {background: #AFBBC9; width: 25px;}
#hodnoceni input.znamka5 {background: #A0AFBF; width: 25px;}
#hodnoceni input.over    {background: #E0E070; width: 25px;}

/*  A N K E T A  */

#anketa       { padding: 10px 10px 3px 10px; 
                margin: 5px 0px 5px 0px;
                border: 3px solid #173337; 
                background: #F2F4FF;
                clear: right;
                border-radius: 8px;
              } 
#anketa h4    { color: #FFFFFF;
                margin: -9px -9px 5px -9px;
                background: #173337; 
                border-radius: 5px;
              }
#anketa h4 a:link, #anketa h4 a:visited, #anketa h4 a:active, #anketa h4 a:hover
              { color: #FFFFFF;
              }  
#anketa p, #anketa p.l
              { text-align: left;
              } 

/*  R E K L A M A  */

/* Paleta Google/Seznam(sklik) - dole
   rámeček: #E9E2D1
   proužek: #E9E2D1 (pouze sklik)
   titulek: #885637
   pozadí:  #E9E2D1
   text:    #000000
   url:     #306872
*/
/* Paleta Google/Seznam(sklik) - hore (banner, tydeník-vpravo)
   rámeček: #EEEEEE
   proužek: #EEEEEE (pouze sklik)
   titulek: #306872
   pozadí:  #EEEEEE
   text:    #000000
   url:     #306872
*/
   
#reklamahore  { width: 503px;
                background: #EEEEEE;
                margin: 5px 0px 0px 0px;
                xxborder: 1px solid #000000;
                padding: 8px 0px 0px 5px;
              }
#reklamadole  { padding: 10px 10px 3px 10px; 
                margin: 5px 0px 5px 0px;
                border: 3px solid #885637; 
                background: #E9E2D1;
                clear: right;
                border-radius: 8px;
              }
#reklamadole h4 
              { color: #FFFFFF;
                margin: -9px -9px 5px -9px;
                background: #885637; 
                border-radius: 5px;
              }
#reklamadole h4 a:link, #reklamadole h4 a:visited, #reklamadole h4 a:active, #reklamadole h4 a:hover
              { color: #FFFFFF;
              }  
#reklamadole p, #reklamadole p.l
              { text-align: left;
              } 

#pravareklama 
{
	xx-width:120px;
	xx-margin:0px;
	xx-float:right;
}


/*  D I S K U S E  za  clankem  */
/*  C H A T  - navstevni kniha  */

#diskuse      { margin: 0; 
                padding: 10px; 
                border: 3px solid #005C53; 
                background: #CDE9DA;
                clear: right;
                border-radius: 8px;
              }
#chat         { margin: 0; 
                padding: 10px; 
              }
#diskuse h3, #chat h3
              { font-size: 9pt;
              }
#diskuse h4   { color: #FFFFFF;
                margin: -9px -9px 5px -9px;
                background: #005C53; 
                border-radius: 5px;
              }
#diskuse p, #diskuse p
              { line-height: 1.1;
                margin 0px 0px 0px 0px;
              }
    
/* ----------------------------------------------------- */

/*   T I S K   */

@media screen
{
#tiraz-print, #hlavicka-print
                 { display: none; 
                 }
}

@media print
{
#pravareklama,
#zahlavi, #menuhover, #menuhorni, #menudolnis, #menudolni, .menutydenikove, 
#reklamadole, #hodnoceni, #anketa, #diskuse, #odkazy,
#hlavicka-null, #hlavicka, #servisniudaje, #noprint,
#sloupec-l-null,#sloupec-l,
#sloupec-p-null,#sloupec-p,
#sloupec-ptyd-null,#sloupec-ptyd,
p.menu-right     { display: none;
                   xxwidth: 1px;
                   xxfloat: none;
                 }

body, td, p      { font-family: 'Times New Roman CE','Times New CE','Times CE','Times New Roman','Times New','Times',times,Georgia,Serif;
                   font-size: 1em;
                   background: #FFFFFF;
                 }
h1               { font-size: 2em;
                 }
h2               { font-size: 1.5em;
                 }
h3               { font-size: 1.17em; 
                   background-image: url("images/nicwhite.gif");
                   padding-left: 0px;
                 }
                 
#hlavicka-print, #paticka-null, #paticka, #tiraz-print
                 { border-top:    1px solid #777777;
                   border-bottom: 1px solid #777777;
                   display: block;
                   margin: 0px;
                   padding: 0px;
                 }
#tiraz-print     { border-top: 1px solid #777777;
                   font-size: 0.83em;
                 }

#sloupec-null, #sloupec, #papir, #note           /* !!!! POZOR !!! PAPIR musi byt zreplikovan i do STYLENFP */
                 { width:100%;
                   margin: 0px;
                   padding: 0px;
                   border: 0px solid #FFFFFF;
                   background-image: url("images/nicwhite.gif");
                 }
h4, #note h4     { color: #000000;
                   background: #FFFFFF;
                   font-size: 1.5em;
                   padding: 0px;
                   margin: 8px 0px 5px 0px;
                   color: #306872;
                 }

span.mensi, span.mensi-s,
p.mensi-l, p.mensi-r, p.mensi-c, p.mensi-ls, p.mensi-rs, p.mensi-cs,
span.h3-mensi-s, 
.mensi-l, 
p.h3date, p.mensi2-rs,
p.tab-mensi-l, p.tab-mensi-ls, p.tab-mensi-r, p.tab-mensi-rs, p.tab-mensi-c, p.tab-mensi-cs,
p.pop, p.pop-left, p.pop-right, p.pop-center                     
                 { font-size: 0.83em;
                 }
p.tab-vetsi-l, p.tab-vetsi-r, p.tab-vetsi-c
                 { font-size: 1.17em;
                 }
}