/* =====================================================================================================
*    title: Bio Salám v1                                                                               *
*     site: www.biosalam.cz                                                                            *
*    media: all                                                                                        *
*   design: Toman Design [info@tomandesign.com]                                                        *
*     code: Miroslav Jahoda, Polygrafix [mirek@polygrafix.cz]                                          *
*     date: 03/2009                                                                                    *
===================================================================================================== */

/* Reset a základní nastavení
----------------------------------------------------------------------------------------------------- */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, img, a, em, strong, abbr, acronym, address, ol, ul, li, dl, dt, dd, form, fieldset, label, blockquote, hr {margin: 0; padding: 0; border: 0; outline: 0; font-weight: normal; font-style: normal; font-size: 100%; vertical-align: baseline;}
html, body#biosalam {width: 100%; height: 100%;}
body {font: 75%/1.3em verdana, tahoma, sans-serif; color: rgb(0,0,0); background: url('../images/bg_stranka.gif') top left repeat-x rgb(196,185,122);}
#obal {position: relative; width: 800px; margin: 0 auto; padding: 0 21px 0; background: url('../images/bg_obal.jpg') 0 45px no-repeat;}
strong {font-weight: bold;}
em {font-style: italic;}
ul, ol {list-style: none;}
p, address {margin-bottom: 0.65em;}
.clear {display: block; visibility: hidden; clear: both; height: 1px; line-height: 1px;}
.i, hr {display: none;}
.posledni {margin-right: 0 !important;}

/* Vzorník 
----------------------------------------------------------------------------------------------------- */
.err, .ok {clear: left; margin: 10px 0; padding: 10px; text-align: center; color: rgb(250,240,203); background-color: rgb(215,25,32);}
.ok {background-color: rgb(147,175,43) !important;}

/* Odkazy 
----------------------------------------------------------------------------------------------------- */
a:link {font-weight: bold; color: rgb(255,255,255); text-decoration: none;}
a:visited {font-weight: bold; color: rgb(255,255,255); text-decoration: none;}
a:hover {color: rgb(255,255,255); text-decoration: underline;}
a.external {color: rgb(0,0,0); /*padding-right: 22px; background: url('../images/external.gif') top right no-repeat;*/}

/* Layout 
----------------------------------------------------------------------------------------------------- */
#hlavicka {height: 222px;}
#hlavni {min-height: 400px; padding-right: 40px; background: url('../images/bg_hlavni.jpg') top left repeat-y;}
  #nav {position: absolute; top: 300px; left: 0; width: 196px;}
  #stranka {margin-left: 196px; padding: 17px 0;}
    #intro {padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px dotted rgb(255,255,255);}
    #text {}
    .no-intro {margin-left: 53px;}
#paticka {height: 70px; /*background: url('../images/bg_stranka2.gif') bottom left repeat rgb(196,185,122);*/}
  #paticka p {margin: 0 auto; width: 800px; padding: 12px 21px 0; clear: left;}
  
/* Hlavička a nadpisy 
----------------------------------------------------------------------------------------------------- */
#logo {position: absolute; top: 38px; top: 38px; left: 0; z-index: 100;}
#logo_img {position: absolute;}
#quote_img {position: absolute; left: -1000px;}
#top {width: 800px; height: 222px;}

h1, #aktuality h2 {font: 200%/1.7em georgia, serif;}
h3 {margin-bottom: 0.65em; font-weight: bold;}
h3.linka {margin: 1.3em 0 0 284px; padding-top: 1.3em; border-top: 1px dotted rgb(255,255,255);}
h3 span {float: right; margin-top: -1.3em;}
h3 a:visited {font-weight: bold;}
h4 {margin-top: 0.65em; color: rgb(255,255,255);}

p.linka {margin-bottom: 0.65em; padding-bottom: 0.65em; border-bottom: 1px dotted rgb(255,255,255);}

/* Navigace 
----------------------------------------------------------------------------------------------------- */
#nav ul {}
#nav ul li {height: 36px;}
  #nav a:link, #nav a:visited {display: block; position: absolute; z-index: 10; width: 176px; height: 36px; padding-left: 36px; font: bold 100% georgia, serif; text-transform: uppercase; color: rgb(0,0,0);}
  #nav a:hover {color: rgb(0,0,0);}
    #nav a span {display: block; position: absolute; z-index: 20; top: 0; left: 0; width: 212px; height: 36px;}
    #nav .index span {background: url("../images/li_index.jpg") 0 0 no-repeat;}
    #nav .bio-vyrobky span {background: url("../images/li_bio-vyrobky.jpg") 0 0 no-repeat;}
    #nav .co-je-bio span {background: url("../images/li_co-je-bio.jpg") 0 0 no-repeat;}
    #nav .bio-a-zdravi span {background: url("../images/li_bio-a-zdravi.jpg") 0 0 no-repeat;}
    #nav .kde-koupite span {background: url("../images/li_kde-koupite.jpg") 0 0 no-repeat;}
    #nav .otazky span {background: url("../images/li_otazky.jpg") 0 0 no-repeat;}
    #nav .kontakt span {background: url("../images/li_kontakt.jpg") 0 0 no-repeat;}
    #nav .aktivni a span, #nav a:hover span {background-position: 0 -72px !important;}

#paticka ul {margin: 0 auto; width: 800px; padding: 12px 21px 0; background: url('../images/bg_paticka.gif') top center no-repeat;}
  #paticka li {float: left; margin-right: 5px; padding-right: 5px; border-right: 1px solid rgb(0,0,0);}
    #paticka li.posledni {border: none;}
      #paticka a:link, #paticka a:visited, #paticka a:hover {font-weight: normal; color: rgb(0,0,0);}

/* Stránka 
----------------------------------------------------------------------------------------------------- */
.fotka {width: 279px; height: 286px; background: url('../images/bg_foto.jpg') top left no-repeat;}
  .fotka img {margin: 14px 0 0 16px;}
.hlavni {float: left; margin: -3px 10px 0 -5px;}

#aktuality {clear: left; margin-top: 10px;}
  #aktuality div, #akce div {margin-bottom: 15px; padding-bottom: 5px; border-bottom: 1px dotted rgb(255,255,255);}
  #aktuality div.posledni, #akce div.posledni {border-bottom: none;}
    #aktuality p, #akce p {margin-bottom: 0.65em;}

.vyrobek {clear: both; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px dotted rgb(255,255,255);}
#nabidka .posledni {border: none;}
  .vyrobek img {display: block;}
  .vyrobek .popisek {float: right; width: 280px;}

#kraje {padding-top: 0.65em;}
  #kraje li {float: left; width: 33%; padding: 5px 0;}

/* Otázky
----------------------------------------------------------------------------------------------------- */
#otazky p.linka {width: 567px; margin: 0.65em 0; padding: 0.65em 0; border-top: 1px dotted rgb(255,255,255);}
#otazky .err {width: 547px;}
#otazky h3.linka {width: 567px; margin: 0 0 0.65em; padding: 0 0 0.65em; border-top: none; border-bottom: 1px dotted rgb(255,255,255);}
#otazky h4 {font-weight: bold; color: rgb(0,0,0);}
  #otazky h4 a {margin-right: 10px;}

#qa {width: 535px; height: 285px; margin-bottom: 0.65em; padding-left: 45px; background: url('../images/bg_formular.jpg') 0 30px no-repeat;}
  #qa h1 {margin-left: 255px;}
  #qa ul {margin-top: 1.3em;}
    #qa li {margin: 0 0.65em 0.65em 0;}
    #qa #li_email, #qa #li_jmeno {float: left;}
    #qa #li_kontrola, #qa #li_nazev {margin-left: 199px;}
    #qa #li_otazka {margin-bottom: 0;}

  #qa label {display: block; padding: 0 0 2px 16px; font-weight: bold;}
  #qa #li_kontrola {position: relative;}
    #qa #li_kontrola label span {position: absolute; right: 40px; bottom: 3px; margin: 0; font-weight: normal;}
  
  #qa input, #qa textarea {padding: 4px 0 0 6px; font: bold 100%/1.3em verdana, tahoma, sans-serif; background: url('../images/bg_input.jpg') top left no-repeat; border: none;}
  #qa input {width: 170px; height: 16px;}
    #qa .submit {width: auto; height: 20px; margin-left: 16px; padding: 0 0 5px; background: transparent; border-bottom: 1px solid rgb(0,0,0);}
    #qa #email, #qa #nazev {margin-left: 16px;}
    #qa #kontrola {width: 270px;}
  #qa textarea {width: 477px; height: 65px;}
  
  #qa strong {position: relative; top: 5px; font-weight: bold; font-size: 150%; line-height: 0.5em;}
  /*#qa #li_otazka strong {position: relative; top: -55px;}*/
  
  #qa #li_otazka div {position: relative; top: -12px; padding-left: 16px; width: 477px; height: 65px;}
  #qa span {float: right; margin-right: 50px; font-weight: bold;}

.vypis {width: 567px; margin-bottom: 0.65em; border-bottom: 1px dotted rgb(255,255,255);}
.no-intro .vypis {width: 514px;}
  .vypis h4 span {font-weight: bold; color: rgb(255,255,255);}

/* IE6
----------------------------------------------------------------------------------------------------- */
* html #hlavni {height: 400px;}
* html .hlavni {margin-left: -2px;}
* html #nav a:hover span {cursor: pointer;}
* html #qa #li_nazev input {margin-top: 1px;}
* html #qa #li_kontrola label span {top: 21px; left: 226px;}
* html #qa #li_otazka div {margin-bottom: -7px;}
* html #qa textarea {background-attachment: fixed;}
 
/* IE7 
----------------------------------------------------------------------------------------------------- */
*:first-child+html #nav a:hover span {cursor: pointer;}
*:first-child+html #qa #li_nazev input {margin-top: 1px;}
*:first-child+html #qa #li_otazka div {margin-bottom: -7px; background: url('../images/bg_input.jpg') 16px 0px no-repeat;}
*:first-child+html #qa textarea {height: 60px; background: none;}