html, body {
   margin: 0;
   padding: 0;
   }
   
body {
    background: url('../images/background-book.jpg') center top no-repeat #252525;
    color: white;
    text-align: center;
    line-height: 130%;
    font-size: 80%;
    width: 100% !important;
    }

body, input, textarea {
    font-family: "Arial CE", arial, "Helvetica CE", Arial, helvetica, sans-serif;
    }


hr {
    clear: both;
    float: none;
    padding: 0;
    margin: 1.25em 0;
    &margin: .5em 0;
    visibility: hidden;
    }


/* kvůli nemožnosti nastavení nulové výšky <hr /> v IE */
div.clear {
    clear: both;
    }

/* kompenzace výšky boxů v jednotlivých prohlížečích */
div.tune {
    line-height: 0;
    height: 1.9em;
    _display: none;
    &height: 0;
    }

    
a:hover, a:active {
    text-decoration: underline !important;
    }
    
a img {
    border: none;
    }
    
p {
    padding:0;
    margin: 0;
    margin-top: 1em;
    }

table {
    border-collapse: collapse;
    margin: 1em auto;
    }

div#text td, div#text th {
    text-align: center;
    padding: .2em .6em;
    border: 1px solid black;
    }
    
div#text ul, div#text ol {
    margin-top: 1em;
    padding-left: 2em;
    margin-left: 0;
    }

div#text ul {
    list-style-image: url('../images/dash-black.gif');
    }
    
div#container {
    width: 985px;
    margin: 5px auto 0;
    text-align: left;
    }
    
/*
div#content {
    background: url('../images/fake-columns.gif') bottom no-repeat;
    }
*/




/* ==================== header (logo + flags) ==================== */

div#header {
    margin: 1em 0;
    position: relative;
    }

div#header span {
    font-size: 16pt;
    font-family: Verdana, sans-serif;
    font-weight: bold;
    letter-spacing: .2em;
    vertical-align: middle;
    position: relative;
    bottom: 12px;
    right: 6px;
    }
    
div#header a {
    color: white;
    text-decoration: none !important;
    }
    
div#flags {
    text-align: right;
    float: right;
    position: absolute;
    top: .3em;
    right: 0;
    }
    
div#flags p {
    text-transform: uppercase;
    font-weight: bold;
    text-align: right;
    margin-top: 10px;
    position: relative;
    left: .6em;
    }

div#flags p a {
    padding: 0 .6em 0 6px;
    }

div#flags p a:hover {
    text-decoration: underline !important;
    }




/* ==================== dropdown menu ==================== */

ul#menu  {
    position: relative;
    z-index: 10;
    margin:0;
    padding: 0;
    list-style-type:none;
    height: 2em;
    margin-bottom: 5px;
    }
ul#menu li {
    display: block;
    float:left;
    margin-bottom: 2px;
    background: url('../images/menu-gray.gif') top left #444;
    line-height: 2em;
    overflow: hidden;
    border-right: 1px solid white;
    text-transform: uppercase;
    text-align: center;
    }
ul#menu a {
    font-weight:bold;
    color:white;
    display:block;
    text-decoration:none;
    margin: 0;
    }
ul#menu ul {
    position:absolute;
    visibility:hidden;
    background: #444;
    width: 18em;
    margin:0;
    padding:0;
    list-style-type:none;
    }
ul#menu li:hover ul, ul#menu li.hover ul {
    visibility: visible;
    }
ul#menu li.orange:hover {
    background: url('../images/menu-orange.gif') top left #f38733;
    }
ul#menu li.green:hover, ul#menu li#calc {
    background: url('../images/menu-green.gif') top left #92b51b;
    }
    
ul#menu li li {
    text-align: left;
    float: none;
    border: none;
    padding: 0;
    margin: 0;
    background: transparent;
    text-transform: none;
    margin-left: .4em;
    }
li.orange, li.green, li.menuitem {
    behavior: url('/code/hover.htc');
    }
    
ul#menu li#last {border:none;}
ul#menu li#last ul {right:0;}

li.orange a, li.green a {
    overflow: hidden;
    height: 2em;
    }


/* ==================== 3 column layout ==================== */

div#left, div#center, div#right {
    float: left;
    width: 325px;
    padding: 0;
    margin: 0;
    margin-right: 5px;
    }

div#right {margin-right: 0;}


/* ==================== color boxes ==================== */

div.orange, div.green, div.white {
    padding: .8em 0 .5em;
    margin-bottom: 5px;
    color: white;
    position: relative;
    width: 100%;
    }

div.orange {
    background: url('../images/gradient-orange.gif') top center repeat-x #F46729;
    }
    
div.green {
    background: url('../images/gradient-green.gif') top center repeat-x #7BB51E;
    }
    
div#mini {background-image: none; padding-top: .6em;}
div#mini h3 {margin: 0 !important;}
    
.orange p, .green p, white p {
    margin: 0 1em .6em;
    }
    
.orange ul, .green ul, white ul {
    margin: 0 1em .6em 2em;
    list-style-type: circle;
    list-style-image: url('../images/dash-white.gif');
    }

h4 {
    font-size: 125%;
    line-height: 1em;
    margin: 0 1em .6em .8em;
    padding-top: .5em;
    }
    
div.height {
    height: 6em;
    padding: .3em;
    }
    
div.height p, div.height ul {margin-top: 0; margin-bottom:0;}

div#publish {background: url('../images/photos/open.gif') bottom right no-repeat;}
div#marketing {background: url('../images/photos/publications.gif') bottom right no-repeat;}
div#eshop {background: url('../images/photos/books.gif') bottom right no-repeat;}

div.height ul {
    margin-left: 1.2em;
    }

h3 {
    display: block;
    background: #231F20;
    background: black;
    overflow: hidden;
    height: 36px;
    margin: 0;
    margin-top: 1em;
    font-size: 130%;
    }

h3 a, h3 span {
    display:block;
    line-height: 36px;
    text-decoration: none;
    }

h3, h3 a {color: #F4662A}
.green h3 a, .white h3 a, .green h3 span {color: #71BF45}

h3 img {
    height: 36px;
    width: 49px;
    background: url('../images/button.gif') left no-repeat;
    float: left;
    padding-right: .2em;
    }
    
ul {padding: 0 1em}


/* ==================== footer ==================== */

div#footer {
    padding: 1em 0 6em;
    }

div#footer p {
    margin: 0;
    float: left;
    text-align: center;
    width: 160px;
    }
    
div#footer a, div#disclaimer a {
    color: white;
    text-decoration: none;
    }
    
div#footer small {font-size: 70%;}


#disclaimer {font-size: 70%;}
#disclaimer * {margin: 1em 0;}
#disclaimer p {float: left; line-height: 30px;}
#disclaimer img {float: right;}



/* ==================== top ==================== */

#top {margin-bottom: 5px;}

#top .green, #top .orange {
    width: 325px;
    float: left;
    margin: 0;
    }

#top .green {margin-right: 5px;}


/* ==================== content ==================== */

img.book {
    float: left;
    margin-right: 1em;
    }

div.white p {
    clear: both;
    position: relative;
    margin: 1.2em;
    }

div#page {
    background: url('../images/border-line.gif') center repeat-y #f3f3f3;
    color: black;
    border-top: 1px solid #444;
    }
    
div#page div#text {
    width: 655px;
    float: left;
    }

div#text div {
    margin:2em;
    margin-bottom: 4em;
    }

div#page div#right {
    float: right;
    width: 325px;
    margin: 0;
    }
    
div#page div#right img, div.box {
    position: relative;
    border-bottom: 5px solid #333;
    width: 100% !important;
    }
    
div.box {padding: .7em 0 .7em;}
div.box p {margin: .6em 1.8em 1.2em; }
div.box h2 {margin: 1em 1.3em 1em;}


    
div#page div#right img {border:none;}
    
#text h2 {
font-size: 130%;
line-height: 140%;
margin-top: 2.5em;
}

#page h2 {color: #76B843}
#page h2.orange {color: #f88d37}

h1.orange, h1.green, h2.fake {
    color: white;
    line-height: 1.2em;
    padding: .3em 1.2em;
    margin: 5px 0 4px;
    clear:both;
    color: white;
    font-size: 160%;
    }

h1.orange, h2.fake {background: url('../images/stripe-orange.gif') center repeat-x #f88d37;}
h1.green, #calculator h3 {background: url('../images/stripe-green.gif') center repeat-x #a2c425;}

a {
    color: black;
    }
.orange p a, .green p a {
    color: white;
    }


div.white,
div.kniha,
div.kosik table th.empty,
div.detail-knihy,
div.kosik,
div.anotace,
div.podobne,
div.sloupecek
    {
    background: #f1f1f1;
    color: black;
    }

div#sidebar div,
div.anotace,
div.podobne {
    background: #ddd;
    }

div#sidebar {
    color: black;
    float: right;
    width: 325px;
    }
    
div#sidebar div {
    margin-bottom: 5px;
    padding-top: .4em;
    padding-bottom: .3em;
    }
    
div#sidebar h3,
div#right div h3
    {
    margin-top: 0;
    }

div.green h3, div.orange h3 {margin-top: 1em !important;}


#text ul a {text-decoration:none;}



/* ======================= knihy ======================== */

div.kniha {
  width: 325px;
  margin: 0 5px 5px 0;
  float: left;
  position: relative;
  height: 10em;
  }

div.kniha a {
  text-decoration: none;
  display: block;
  padding: .1em;
  margin: .6em 1em 0 0;
  }

div.kniha span.cena {
  position: absolute;
  bottom: 1.8em;
  right: 75px;
  color: #76B843;
  font-weight:bold;
  text-align: right;
  }


a.kosik, a.pokladna, input.imagebutton, .minikosik {
  background: url('../images/button-l.gif') center no-repeat #888;
  display: block;
  height: 2.5em;
  line-height: 2.5em;
  width: 160px;
  text-align: center;
  color: white !important;
  text-decoration: none !important;
  font-weight:bold;
  position: relative;
  }

a.minikosik {
    background: url('../images/button-s.gif') center no-repeat #888;
    height: 34px;
    width: 48px;
    }

a.pokladna, a.kosik, input.imagebutton {
  font-size: 125%;
  margin-top: .8em;
  }

div.kniha a.minikosik{
  position: absolute;
  bottom: 1em;
  right: 1em;
  margin: 0;
  }

img.book, #reference p img {
  float: left;
  }

div.kniha img.book {
  margin: 6px 14px;
  }

div.kniha div.title {
  margin-left: 85px;
  }

p.novinka, #reference p {
  clear: left;
  margin-bottom: 10px;
  margin-top: 1em;
  }
  
p.novinka a {text-decoration:none;}

p.kategorie {line-height: 1.4em;}

#reference p img, p.novinka img {
  margin: 0 10px 10px 0;
  }

span.plusminus a:hover {
  text-decoration: none !important;
  background: LemonChiffon;
  }
#sidebar span.plusminus {display:none;}

#sidebar small {color: gray}

#sidebar ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
    }
    
#sidebar p, #sidebar ul {
    margin: 1em;
    }


/* =============================== detail knihy ==================================== */

div.obal,
div.podobne
    {
    width: 655px;
    }

div.podobne {
    margin-top: 5px;
    padding-bottom: 1.5em;
    }

div.podobne p {
    padding: .5em 2em;
    clear: left;
    float:none;
    margin-bottom: 2.5em;
    }

div.podobne h4 {
    margin-left: 1.8em;
    padding-top: 1.8em;
    }

div.detail-knihy,
div.anotace,
div.kosik
  {
  padding: 2em 2em 2.5em;
  position: relative;
  }
  
div.kosik {padding-top: 1em;}

div.detail-knihy {min-height: 270px}

.detail-knihy img {float:none;}

.detail-knihy h1,
.detail-knihy h2 {
    font-size:180%;
    padding: 0 1em;
    line-height: 1.2em;
    }

.detail-knihy h1 {margin-top: .7em;}
.detail-knihy h2 {font-weight: normal;}

.detail-knihy .nadpisy,
.detail-knihy p {
    position:absolute;
    left:225px;
    _left:200px;
    }
.detail-knihy .nadpisy {top:10px;}
.detail-knihy p {top:220px; padding: 0 1.9em;}

.detail-knihy .cena {position: absolute; top:230px; right:25px; text-align:center;}
.detail-knihy .cena b {color: green}

div.anotace {
  margin-top: 5px;
  }

a.pdf, a.doc, a.xls, a.txt, a.zip, span#libraryclick, p.hotline {
  padding-left:22px;
  background: url('../images/icon-pdf.gif') transparent no-repeat left center;
  }
  
a.doc {background-image: url('../images/icon-word.gif');}
a.xls {background-image: url('../images/icon-excel.gif');}
a.txt {background-image: url('../images/icon-text.gif');}
a.zip {background-image: url('../images/icon-zip.gif');}

p.hotline {background-image: url('../images/icon-phone.gif');}

span#libraryclick {
    text-decoration: underline;
    cursor:pointer;
    _cursor:hand;
    background-image: url('../images/icon-info.gif');
    }

div#libraryinfo {
    margin-top: .5em;
    padding: .3em .6em;
    border: 1px solid silver;
    background: #eee;
    }
    
div#libraryinfo p {
    padding: 0;
    margin: 0;
    }

#calculator a {color:black !important;}

p.embed {text-align:center}







/* ============================== věci ke košíku =================================== */

div.kosik small {position:relative; top:1em; left:1em; color: gray}

div.kosik table {
  font-size: 90%;
  width: 100%;
  background-color: #fff;
  border: none !important;
  }

div.kosik table td, div.kosik table th {
  text-align: right;
  border: 1px solid #ccc !important;
  padding: .2em .4em !important;
  border-left:none !important;
  border-right: none !important;
  }

div.kosik table th.first, div.kosik table td.first {
  text-align: left;
  width: 50%;
  }






input.imagebutton, div.kosik a {
    float:right;
    }
input.imagebutton {
  background: url('../images/button-l.gif') center no-repeat #999;
  width: 160px !important;
  height: 2.5em;
  border: none;
  cursor:pointer;
  _cursor:hand;
  }


label {
  width:  100px;
  display: block;
  float:left;
  line-height: 24px;
  _padding-left: .5em;
  padding-bottom: .5em;
  }
  
label.radio {
    display:inline;
    float: none;
    padding-right: 1em;
    }


.kosik form br, form.login br, form#register br {
  clear:left;
  }
  
form.login input {width:100px}

form fieldset input {width: 20em;}

input#formCity,
input#formZip,
input#formZipInvoice,
input#formCityInvoice,
input#formUser,
input#formPass1,
input#formPass2
    {width: 10em;}

input.radio {width: auto;}

fieldset {
    border:1px solid #ccc;
    margin: .4em 0 1em;
    }

legend {
    color: #888;
    padding: 0 0.4em;
    font-size:100%;
    font-weight:normal;
    }


div.kosik table, div.kosik form {
  margin: .7em 0 1em !important;
  }

p.warning {color:red; font-weight:bold;}

span.cena-final {
    float: right;
    position: relative;
    }


span.plusminus a {
  color: #222;
  display: block;
  padding: 0 .3em;
  text-decoration: none;
  border: 1px solid #eee;
  margin: 1px;
  }




/* ========================================= nová kalkulačka ========================================= */


.vypocitej {
  float: left;
  }

#poznamkaKusy, #poznamkaStrany  {color:red;}

div.sloupecek {
    width: 193px;
    min-height: 70em;
    _height: 70em;
    float: left;
    margin-right: 5px;
    }

div.sloupecek#posledni {margin-right: 0;}

div.matrjoska, div.sede {padding: .8em;}
div.sede {
    height: 10em;
    background-color: #777;
    color: white;
    font-weight: bold;
    }
div.matrjoska {padding-top: 0}

#calculator h3 {
    color: white;
    line-height: 2em;
    height: 2em;
    text-align: center;
    font-size: 110%;
    text-transform: uppercase;
    margin: 0;
    }
    
div.sede span#poznamkaRozmery {font-weight:normal !important;}

input.text {width: 96%; font-weight: normal;}
select {width: 99%}

form#calculator {margin:0}

#calculator table {
    width: 100%;
    }
#calculator table td.price {
    text-align: right;
    font-weight: bold;
    }
    
#calculator table td.price big {
    font-size: 150%;
    }