/**
 * 
 *  Víno Pálava 
 *  
 *  Hlavni CSS styl
 *  
 *
 *    I.   Zakladni CSS tridy
 *    II.  Nadpisy & zakladni tagy 
 *  
 *    1) Typografie
 *    2) Layout
 *    3) Jednotlive stranky
 *
 *  media: screen
 *
 **/ 
 /*
 * I. Zakladni CSS tridy
 *     ==================
 **/
html, body, div, p, li, ul, form, 
set, h1, h2, h3, h4, h5, h6   { margin: 0; padding: 0; list-style: none; }
.none     { display: none;}
.hidden   { visibility: hidden;}
.fl       { float: left !important;}
.fr       { float: right !important;}
.left     { text-align: left;}
.right    { text-align: right;}
.center   { text-align: center !important;}
.bold     { font-weight: bold;}
.italic   { font-style: italic;}
.nomargin { margin: 0 !important;}
img       { border: none;}
a         { outline-style: none; }
.red      { color: #ff2805 !important;}
.clear        { display: block; clear: both; width: 100%; height: 0; line-height: 0; font-size: 0; }
.clear1px     { clear: both; height: 1px; font-size: 1px; line-height: 1px; /* for IE */}
.clear5px     { clear: both; height: 5px; font-size: 5px; line-height: 5px; /* for IE */ }
.clear20px    { clear: both; height: 20px; font-size: 20px; line-height: 20px; /* for IE */ }
.clear30px    { clear: both; height: 30px; font-size: 30px; line-height: 30px; /* for IE */ }
.borderRight {  border-right: 1px solid #d9eaf4; }

html, body         { height: 100%; }

/*
 * II. Nadpisy & zakladni tagy
 *     =======================
 **/

/* -- Odkazy -- */
a, a:visited, a:active, a:link { text-decoration: underline; }
a:hover                        { text-decoration: none; }
a span { cursor: pointer;}

/* -- Nadpisy -- */
h1         { font-size: 1.8em; margin: 0 0 25px; }
h2         { font-size: 1.4em; margin: 0 0 10px; }
h3         { font-size: 1.2em; margin: 0 0 5px; } 
h4         { font-size: 1em; margin: 0 0 5px; }     
.title     { font-size: 1.4em; margin: 0 0 25px; }

/* -- Obrázky -- */
.imgLeft  { float: left; margin: 0 10px 10px 0; }
.imgRight { float: right; margin: 0 0 10px 10px; }
a.fancybox img { border: 5px solid #efefef; }
a:hover.fancybox img { border: 5px solid #dfdfdf; }

/*
 * 1) Typografie
 *    ==========
 **/
body, input, textarea { font: 0.9em/1.4em Arial, sans-serif; }
a { color: #ba2334; }

h1, h2, h3 { color: #ba2334; font-family: Georgia; font-style: italic; }
table { font-size: 1em;}

#content, input, textarea { color: #565656;}
#content p {  margin-bottom: 20px; font-size: 0.917em; line-height: 1.4em; }
#content p strong { color: #222; }

#content ul.list { margin: 0 0 20px 20px; font-size: 0.917em; line-height: 1.4em; }

#footer p { font-size: 0.8em; color: #787878; }

/*
 * 2) Layout
 *    ======
 **/
body  { letter-spacing: 0em; background: #D2E9BB url(../images/bg-body.jpg) no-repeat scroll 50% 0px; }


#main {
 	width: 980px;
	margin: 0 auto;
	text-align: left;
	min-height: 100%;
	height: 100%;
	position: relative;
}
 
body>#main {
 	height: auto;
}

#header {
  position: relative;
  margin-bottom: 180px;
  width: 980px; height: 85px;
  background-color: #fff;
  /* background: url(../images/bg-header.jpg) 0 70px no-repeat;  */
}
#content {
  width: 980px; 
 	padding: 20px 0 40px;
 	overflow: hidden; 
	background-color: #fff;
}
#content .content { float: right; margin: 0; padding: 0 20px 20px 10px; width: 700px  }
#content .sidebar { float: left; margin: 0; padding: 0 10px 20px 20px; width: 220px; min-height: 250px; }
#footer {
	position: absolute; bottom: 0; left: 0;	text-align: center;
  padding: 10px 20px;
	width: 940px; height: 20px;
	overflow: hidden;
	border-top: 1px solid #efefef;
}

/*
 * Header 
 * ======
 **/
 
/* -- Logo -- */
#logo { width: 380px;	height: 120px; margin: auto; }
#logo a {
	display: block; 
	position: relative; top: 10px;
	margin: 0; padding: 0;
	width: 380px;	height: 120px; line-height: 60px;
	font-size: 0em; font-weight: bold; 
  text-decoration: none;
}
#logo a span {
	display: block;
	position: absolute;	left: 20px;	top: 0px;	z-index: 1;
	margin: 0;	padding: 0;
	width: 380px;	height: 120px;
	cursor: pointer;
	background: url(../images/logo-kosik.png) 0 0 no-repeat;
}

/* -- navigation -- */
#navigation { position: absolute;	right: 20px; top: 0;	z-index: 1; margin: 0; padding: 0; }          
#navigation li { margin: 0; padding: 0; display: inline; font-size: .8em; }
#navigation li a { padding: 4px 6px; background-color: #efefef; text-decoration: none; }
#navigation li a:hover { color: #fff;  background-color: #ba2334; }

/* --  Main menu -- */
#main-menu ul li a         { display:block; background-color: #801b09; color: #fff; padding: 5px 10px; border-bottom: 1px solid #983016; text-decoration: none; }
#main-menu ul li.active a:hover,
#main-menu ul li a:hover   { background-color: #ba2334; color: #fff; }
#main-menu ul li.active a  { background-color: #8e220f; color: #fff; border-bottom: 1px solid #983016; }
  #main-menu ul li ul      { margin-left: 10px; display: none; }
  #main-menu ul li ul li a { background-color: #8e220f; font-size: .917em; }
  #main-menu ul li ul li a:hover { background-color: #ba2334; }

  #main-menu ul li.show ul      { display: block; }
  
/* --  ul, ol List -- */
#content .list li { background: url(../images/ul-list.gif) 0 7px no-repeat; padding-left: 15px; }  

/* -- Cols layout -- */
.cols { overflow: hidden; height: 100%; clear: both; }
.cols .col1 { float: left; }
.cols .col2 { float: left; }
.cols50 .col1 { float: left; width: 47% !important; }
.cols50 .col2 { float: right; width: 47% !important; }
.cols3 .col1,
.cols3 .col2,
.cols3 .col3 { width: 33%; }
.cols3 .col3 { float: right; }
.cols4 .col1,
.cols4 .col2,
.cols4 .col3,
.cols4 .col4 { float: left; width: 25%; }
.cols1v2 .col1 { width: 33%; }
.cols1v2 .col2 { width: 66%; }
.cols2v1 .col1 { width: 66%; }
.cols2v1 .col2 { width: 33%; }



/*
 * Photogallery 
 * ============
 **/
 
#photogallery .thumb { float: left; margin: 0 20px 20px 0; height: 155px; overflow: hidden;}
#photogallery .thumb.last { margin: 0 0 20px 0; }
#photogallery .thumb img { border: 5px solid #efefef; }
#photogallery .thumb p { width: 150px; height: 32px; overflow: hidden; font-size: .8em; font-style: italic; margin: 0 0 0 5px; padding: 0; }

/*
 * Product list 
 * ============
 **/
 
#productList .thumb { float: left; margin: 0 20px 20px 0; }
#productList .thumb.last { margin: 0 0 20px 0; }
#productList .thumb img { border: 5px solid #efefef; }
#productList .thumb p { width: 150px; height: 32px; overflow: hidden; font-size: .8em; font-family: Georgia; font-style: italic; margin: 0 0 0 5px; padding: 0; }

/*
 * Product detail 
 * ============
 **/
 
#productDetail .thumb { float: left; margin: 0 20px 20px 0; }
#productDetail .thumb img { border: 5px solid #efefef; }
#productDetail .thumb p { width: 150px; height: 32px; overflow: hidden; font-size: .8em;  font-style: italic; margin: 0 0 0 5px; padding: 0; }

#productDetail ul { margin-left: 180px; }
#productDetail ul li { margin-bottom: 4px; }
#productDetail ul li strong { display: block; float: left; width: 180px; font-size: .8em; font-family: Georgia; font-style: italic;  }
#productDetail ul li span { display:block; margin-left: 180px; }