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

  *Filename:            global.css
  *Description:         Global CSS
  *Version:             1.0.0 (2009-08-20) YYYY-MM-DD
  *Website:             hrejiviplysaci.cz
  *Author:              Jaroslav Piela
  
  === STRUCTURE =========================================
  
  *Page width:          904px
  *Number of columns:   1
  
  === SWATCH COLORS =====================================
  
  #1e8eaf - blue
  #ddf3f9 - light blue
  #98bd3d - green
  #4f5b56 - dark grey
  #999    - light grey

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


/* === ELEMENTS STYLES =============================== */
body {
  background: #fcdc89;
	font: 85%/1.4 Arial, sans-serif;
	color: #1e8eaf;
	text-align: center;
	margin: 0;
	padding: 0;
}

input, textarea {
	font-family: Arial, sans-serif;
}

td, th, input, textarea {
	font-size: 100%;
}

h1 {
	margin: 0 0 14px 0;
	font-size: 150%;
	border-bottom: 1px solid #bbe6f3;
	width: 620px;
	color: #999;
}

h1 span {
	display: none;
}

h2, h3 {
  font-size: 150%;
  color: #999;
  padding: 0;
  margin: 0.8em 0 0.3em 0;
}

h3 {
  font-size: 140%;
  color: #1e8eaf;
}

a {
	color: #98bd3d;
}

a img {
  border: none;
}

a:hover {
	color: #1e8eaf;
}

table {
  border-collapse: collapse;
  line-height: 1.7em;
}

table a {
  color: #1e8eaf;
}

th, td {
  text-align: left;	
  padding: 5px 7px;
}

th {
  font-weight: normal;

}

p {
  padding: 0;
  margin: 0 0 1.5em 0;
  line-height: 1.7em;
}

p:first-letter {
  font-size: 200%;
  font-weight: bold;  
}

form {
  margin: 0;
  padding: 0;
}

input {

}

input.i,
textarea.i {
  background: url('/img/bgr-input.jpg') no-repeat top left;
  border: 1px solid #3caccd;
  padding: 8px 5px 2px 5px;
}

input.i {
  width: 205px;
  height: 20px;
}

textarea.i {
  width: 205px;
  height: 100px;
}

input.i.short {
  width: 80px;
}

input.i.shorter {
  width: 30px;
}

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}


/* === COMMON CLASSES ================================ */

.dspln {
  display: none;
}

.left {
  text-align: right;
}

.right {
  text-align: right;
}

.fright {
  float: right
}

.fleft {
  float: left;
}

.center {
  text-align: center;
}

.vtop {
  vertical-align: top;
}

.small {
  font-size: 90%;
}

.cleaner {
  clear: both;
  font-size: 1%;
  height: 1px;
}

.grp {
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
  position: relative;  
}

.grp span {
  background: no-repeat top left;
  display: block;
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
}

a.grp {
  cursor: pointer;
}

.grey {
  color: #999;
}

.blue {
  color: #1e8eaf; 
}

.red {
  color: red;
}

.bold {
  font-weight: bold;
}

.no-margin {
  margin: 0;
}

p.info,
div.oki,
p.err {
  background: url('/img/bgr-info.jpg') no-repeat top left;
  text-align: center;
  padding: 15px;
}

.err {
  color: red;
} 

.oki {
  font-weight: bold;
  margin: 0 0 15px 0; 
}

.mar.top-15 {
  margin: 15px 0 0 0;
}

/* === CLASSES ======================================== */

.column-1 {
  width: 600px;
  float: left;
}

.column-2 {
  width: 285px;
  float: right;
}

.column-1 h2,
.column-2 h2,
.column-3 h2 {
  margin-top: 0;
}

.column-3 {
  width: 410px;
  float: left;
}

.column-3.l {
  margin: 0 30px 0 0;
}

.column-4 {
  width: 316px;
  float: left;
}

.column-5 {
  width: 285px;
  float: right;
}

.list {
  margin: 0;
  padding: 0;
}

.list li {
  background: url('/img/bgr-list.gif') no-repeat center left;
  list-style: none;
  line-height: 2.2em;
  padding: 0 0 0 37px;
}

.rc-tl {
  background: url('/img/bgr-rc-tl.gif') no-repeat top left #ddf3f9;
}

.rc-tr {
  background: url('/img/bgr-rc-tr.gif') no-repeat top right #ddf3f9;
}

.rc-bl {
  background: url('/img/bgr-rc-bl.gif') no-repeat top left #ddf3f9;
}

.rc-br {
  background: url('/img/bgr-rc-br.gif') no-repeat top right #ddf3f9;
}

.bgr.rc-bl,
.bgr.rc-br,
.bgr.rc-tl,
.bgr.rc-tr {
  width: 19px;
  height: 39px;
} 

.line {
  border-bottom: 1px solid #bbe6f3;
  height: 1px;
  font-size: 1%;
  margin: 0 0 10px 0;
}

/* === LAYOUT ========================================= */

#bgr {
  background: url('/img/bgr-body.jpg') repeat-x top left #fcf4cd;
}

#screen {
	position: relative;
	width: 904px;
	text-align: left;
	margin: 0 auto;
	padding: 386px 0 0 0;
}

#main {
  width: 100%;
	background: url('/img/bgr-main.gif') repeat-y top left;
}

#content {
  background: url('/img/bgr-content-top.gif') no-repeat top left;
}

#content .box {
  background: url('/img/bgr-content-bottom.gif') no-repeat bottom left;
  padding: 28px 25px 55px 25px;
}

#txt {
  float: right;
  width: 625px;
}

#left {
  width: 205px;
  float: left;
}


/* === HEADER ========================================= */

#header {
  background: url('/img/bgr-header.jpg') no-repeat top left;
	position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 386px;
}

#logo, #logo span {
	width: 290px; height: 55px;
	position: absolute;
	display: block;
	left: 0; top: 0;
}

#logo {
  top: 118px; left: 0;
}

#logo span {
  background: url('/img/logo.jpg') no-repeat top left;
}

#logo a span {
  cursor: pointer;
}

#cart-info {
  position: absolute;
  top: 182px; left: 720px;
  width: 155px;
  text-align: center;
  color: #d2c22b;
}

/* === MENU =========================================== */

#menu {
  position: absolute;
  top: 337px; left: 88px;
	margin: 0; padding: 0;
	height: 45px; 
}

#menu li {
  width: 95px; height: 100%;
	list-style: none;
	padding: 0;
	margin: 0;
  float: left;
}

#menu li a,
#menu li strong {
  position: relative;
  width: 100%; height: 100%;
  display: block;
  overflow: hidden;
}

#menu li a span,
#menu li strong span {
  background: url('/img/btn-menu.gif') no-repeat top left;
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  display: block;
}

#menu li#root { width: 95px; }
#menu li#root span { background-position: 0 0; }
#menu li#root a:hover span { background-position: 0 -45px; }
#menu li#root strong span { background-position: 0 -90px; }

#menu li#obchod { width: 153px; }
#menu li#obchod span { background-position: -92px 0; }
#menu li#obchod a:hover span { background-position: -92px -45px; }
#menu li#obchod strong span { background-position: -92px -90px; }

#menu li#jak-nakupovat { width: 204px; }
#menu li#jak-nakupovat span { background-position: -245px 0; }
#menu li#jak-nakupovat a:hover span { background-position: -245px -45px; }
#menu li#jak-nakupovat strong span { background-position: -245px -90px; }

#menu li#caste-dotazy { width: 165px; }
#menu li#caste-dotazy span { background-position: -449px 0; }
#menu li#caste-dotazy a:hover span { background-position: -449px -45px; }
#menu li#caste-dotazy strong span { background-position: -449px -90px; }

#menu li#kontakt { width: 106px; }
#menu li#kontakt span { background-position: -614px 0; }
#menu li#kontakt a:hover span { background-position: -614px -45px; }
#menu li#kontakt strong span { background-position: -614px -90px; }

  /* LEFT MENU */
  
  #lmenu {
    margin: 0 0 25px 0;
    padding: 28px 0 0 0;
  }
  
  #lmenu a {
    color: #1e8eaf;
    text-decoration: none; 
  }
  
  #lmenu a:hover,
  #lmenu a.set {
    text-decoration: underline;
  }
	
	
/* === FOOTER ========================================= */

#footer {
	background: #fcdc89;
	color: #999; 
}

#footer .content {
  background: url('/img/bgr-footer.gif') no-repeat top left;
	position: relative;
	width: 970px; height: 134px;
	margin: 0 auto;
	text-align: left;
}

#footer .box {
  margin: 0 35px;
  padding: 55px 0 15px 0;
}

#footer a,
#footer strong {
  color: #4f5b56;
  text-decoration: none;
}

#footer a:hover {
  text-decoration: underline;
}

#footer ul {
  padding: 0;
  margin: 0;
  text-align: justify;
}

#footer li {
	list-style: none;
	display: inline;
	padding: 0 2.2em 0 0;
}

#copyright {
  width: 440px;
}

#copyright,
#help-contact {
  font-size: 90%;
  line-height: 1.7em;
}

#copyright a,
#help-contact a {
  color: #999;
}

#help {
  float: right;
  width: 170px;
}

#copyright,
#help-contact {
  border-top: 1px solid #edcb70;
  margin: 0.35em 0 0 0;
  padding: 0.35em 0 0 0;
}


/* === GRP ELEMENTS =================================== */

#btn-co-je-v-kosiku {
  position: absolute;
  top: 83px; left: 739px;
  width: 124px; height: 31px;
}

#btn-co-je-v-kosiku span {
  background-image: url('/img/btn-co-je-v-kosiku.jpg');
}

a#btn-co-je-v-kosiku:hover span {
  background-position: 0 -31px;
}

#btn-objednat {
  position: absolute;
  top: 314px; left: 785px;
  width: 116px; height: 116px;
}

#btn-objednat span {
  background-image: url('/img/btn-objednat.png');
  padding: 116px 0 0 116px;
}

#menu-part {
  position: absolute;
  top: 345px; left: -9px;
  width: 9px; height: 50px;  
}

#menu-part span {
  background-image: url('/img/bgr-menu-part.gif');
}

.btn {
  background-image: url('/img/bgr-btn-1.png');
  background-color: transparent;
  width: 99px; height: 47px;
  text-align: center;
  color: #1e8eaf;
  font-size: 110%;
  cursor: pointer;
}

.btn span {
  margin: 12px 0 0 0;
}

.btn {
  text-decoration: none;
}

.btn:hover {
  text-decoration: underline;
}

input.btn {
  border: 0;
}

.btn.grp.center {
  margin: 15px auto;
}


/* === PAGES ========================================== */

  /* ROOT */
  
  #btn-1-nakoupite {
    margin: 0 25px 0 0;
    float: left;
  }

  #btn-2-dorucime {
    margin: 0 24px 0 0;
    float: left;
  }  

  div.scrollable {  
    position:relative; 
    overflow:hidden; 
    width: 100%; 
    height: 100%; 
  }  

  div.scrollable .items-light {
    position: relative;
    width: 20000em;
    height: 100%;
  }  


/* === OTHERS ========================================= */

  /* ITEMS */
    
  .items {
    padding: 0;
    margin: 0;
  }
    
  .items td {
    width: 315px;
    padding: 0 0 8px 0;
    vertical-align: top;
  }
    
  .items td .content {
    background: url('/img/bgr-item.jpg') no-repeat top left;
  }
    
  .items .img {
    width: 116px;
    padding: 7px; 
    float: left;
    position: relative;
  }
    
  .items .desc {
    line-height: 1.5em;
    float: right;
    width: 148px;
    margin: 10px 9px 0 0;
    padding: 0 7px 0 0;
    color: #999;
  }
    
  .items h2 {
    margin: 0 0 0.3em 0;
    padding: 0;
    font-size: 130%;
  }
    
  .items h2 a {
    color: #999;
    text-decoration: none;
  }
    
  .items h2 a:hover {
    text-decoration: underline;
  }
    
  .items .btn {
    border: 0;
    position: relative;
    right: -11px;
    float: right;
  }
    
  .items .price {
    font-size: 80%;

    margin: 0 0 3px 0; 
  }
  
  .items .price em {
    font-size: 120%;
    color: #1e8eaf;
    font-style: normal;
  }
        
  .items-light {
    margin: 0;
    padding: 0; 
  }
    
  .items-light li {
    width: 144px; height: 156px;
    margin: 0 6px 0 0;
    padding: 0;
    float: left;
    list-style: none;
    position: relative;
  }
    
  .items-light li div {
    background: url('/img/bgr-image.gif') no-repeat top left;
    padding: 7px;
  }
    
  .items-light .btn {
    position: absolute;
    top: 100px; left: 46px;
  }
    
  .items fieldset {
    border: 0;
    margin: 0;
    padding: 0;
  }
    
  .items form {
    margin: 0;
    padding: 0;
  }
  

  /* ITEMS DETAIL */
    
  #mainimg {
    background: url('/img/bgr-image-big.gif') no-repeat top left;
    width: 316px; height: 316px;
    display: block;
  }
    
  #mainimg img {
    margin: 8px; 
  }
    
  #imgs {
    margin: 0;
    padding: 0;
  }
    
  #imgs li {
    background: url('/img/bgr-image-small.gif') no-repeat top left;
    margin: 8px 8px 0 0;
    padding: 0;
    list-style: none;
    float: left;
    font-size: 1%;
  }
    
  #imgs li a {
    margin: 5px;
    display: block;
  }
    
  #imgs li.third {
    margin-right: 0;
  }
    
  #desc {
    width: 100%;
    margin: 0 0 10px 0;
  }
    
  #desc td, #desc td {
    padding: 0;
    margin: 0;
  }
    
  #desc th {
    background: none;
    font-weight: normal;
    color: #999;
    width: 50%;
    vertical-align: top;
  }
  
  #item-desc {
    margin: 30px 0 0 0;
  }

  #item-perex {
    margin: 30px 0 10px 0;
  }  
    
  #price {
    background: url('/img/bgr-price.gif') no-repeat top left;
    width: 285px;
    height: 73px;
    position: relative;
  } 
  
  #price strong {
    font-size: 120%;
  }
  
  #price .inner {
    padding: 15px 15px 0 15px;
  } 
  
  #price #addNew {
    position: absolute;
    bottom: -15px; 
    left: 175px;
  }
  
  .sale {
    margin: 10px 0 3px 0;
    color: red;
    font-weight: bold; 
  } 

  
  /* PAGINATOR */
    
  .paginator {
    border-top: 1px solid #bbe6f3;
    margin: 15px 0 0 0;
    padding: 5px 0 0 0;
    color: #999;
    text-align: center;
  }
    
  .paginator a {
    text-decoration: none;
  }
    
  .paginator a:hover {
    text-decoration: underline;
  }
    
  .paginator strong {
    font-weight: normal;
  }
    
  .paginator .fleft {
    text-align: left;
  }
    
  .paginator .fright {
    text-align: right;
  }
    
  .pages a,
  .pages strong,
  .pages span {
    margin: 0 0.5em 0 0;
  }
    
  .pages strong {
    font-weight: bold;
  }   

  
  /* NAVIGATION */
  
  #nav {
    border-bottom: 1px solid #bbe6f3;
    margin: 0 0 12px 0;
    padding: 0 0 12px 0;
  }      
    
  /* CART */
    
  #cart {
    position: relative;
  }
    
  #cart table {
    width: 100%;
  }

  #cart th {
    background-color: #ddf3f9;
    font-size: 120%;
    line-height: 2em;  
  }
    
  #cart td {
    border: 1px solid #ddf3f9;
  }
    
  #cart-footer {
    background: #ddf3f9;
    position: relative;
    height: 39px;
    margin: 0 0 30px 0;      
  }
  
  #cart-footer.no-marign {
    margin: 0;
  }
    
  #editCart,
  #emptyCart,
  #orderBtn {
    position: absolute;
    bottom: -15px;
  }
    
  #editCart {
    left: 20px;
    z-index: 100;      
  }
    
  #emptyCart {
    left: 130px;
    color: red;      
  }
    
  #orderBtn {
    left: 500px;
    font-weight: bold;
  }
    
  .highlighted {
    background: #fdf6d5;
  }
    
  .name {
    width: 270px;
  }
    
  .name2 {
    width: 300px;
  }
    
  .del {      
    font-size: 80%;
  }
    
  .del,
  .del a {
    color: #ff0000;
  }
    
    
  /* DELIVERY ADDRESS */
    
  #adr th {
    background: none;
    width: 130px; 
  }
    
  .req {
    font-weight: bold;
  }