/*****Basic Elements*****/  

/*Define styles for basic elements: body, h1-h6, ul, ol, a, p, etc.*/  

body { 
	font-size:62.5%;
	font-family: Tahoma, Geneva, sans-serif;
	background: #005095;
	text-align: center;
	height: 100%;
	padding-bottom: 50px;
}
  
a { color: #005095; text-decoration: underline; }
a:hover, a:focus, a:active { color: #e61746;  }
a[href^="http:"] { background: url('../img/ico-link.gif') right top no-repeat; padding-right:12px; }
a[href$=".xls"], a[href$=".pdf"], a[href$=".doc"] { padding-left: 14px; background: url('../img/ico-file.gif') 0% 100% no-repeat; }


h1 { 
  position: relative;
	padding: 0 0 0 40px;
	color: #005196; 
	font-size: 14px; 
	line-height: 26px;
	font-weight: bold; 
	border-bottom: 1px solid #B1B1B1;
	margin: 0 80px 20px 26px;
}

p { margin-bottom: 12px; overflow: hidden; }

hr { height: 1px; color: #d0d0d0; background-color: #d0d0d0; border: 0px solid #d0d0d0; margin: 12px 0; clear: both; }

ul { list-style-type: square; list-style-position: outside; margin: 0 0 12px 18px; }
ul li { margin: 4px 0; }
  
/*****Generic Classes*****/  

/*Define styles for simple things like floating to the sides, removing a bottombottom margin on elements, etc  
Yes, these may not be as semantic as we would all like, but they are necessary for coding efficiently */   

.larger { font-size: 120% !important; }
.small { font-size: 90% !important; }

.mar-top-16 { margin-top: 16px; }

.col-in { padding: 5px 10px; }

.cleaner {
	background:transparent none repeat scroll 0 0;
	border:medium none;
	clear:both;
	font-size:1px;
	height:1px;
	margin:0;
	padding:0;
}
  
/*****Basic Layout*****/  

/*Define the basic template: header, footer, etc. Elements that help to define the basic layout of the site*/  

#main { 
	position: relative;
	margin: 50px auto 10px;
	width: 950px;
	min-height: 500px;
	_height: 590px;
	background: #fff url('../img/bg_stada_right.gif') 100% 98% no-repeat;
	text-align: left;
	padding: 5px;

}

#content-wrapper {
	position: relative;
	width: 950px;
	overflow: hidden;
	height: 100%;
	background: url('../img/bg-main.gif') 0 0 repeat-y;
}
 
#col1 {
	position: absolute;
	top: 0;
	left: 0;
	width: 210px;
	height: 100%;
	background: #005095;
}

#col2 { 
	float: right;
	margin-right: 5px;
	width: 210px;
	height: 100%;
	min-height: 500px;
	color: #fff;
	background: #005095 url('../img/bg_col2.png') 0 0 repeat-y;
}

#content { 
	float: right; 
	position: relative;
	width: 440px; 
	font-size: 12px; 
	line-height: 17px;
	margin-top: 10px;
	padding: 70px 40px;
	color: #444;
	background: url('../img/logo_stada.gif') top center no-repeat;
	overflow: hidden;
}

#copyright { 
  margin: 10px auto;
	width: 960px;
	text-align: center;
	color: #fff;
}

 
/***** col1 *****/  

/*Define all elements in the col1*/  

#col1 .col-in { position: relative; height: 230px; background: url('../img/col1-stripes.png') 0 0 no-repeat; z-index: 15; }

#slideshow {
    position:absolute;
    left: 0;
    bottom: 0;
    height:520px;
}
 
#slideshow img {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
    opacity:0.0;
}
 
#slideshow img.active {
    z-index:10;
    opacity:1.0;
}
 
#slideshow img.last-active {
    z-index:9;
}


/***** col2 *****/  

/*Define all elements in the col2*/  

#col2 a { color: #fff; }

#col2 .menu { margin:0; margin-bottom: 160px; min-height: 340px; _height: 340px; }
#col2 .menu li { margin: 0; position: relative; display: block; height: 1%; }

#col2 .menu li a { display: block; font-size: 11px; text-transform: uppercase; padding: 28px 32px 4px 4px; line-height: 16px; border: none; text-decoration: none; }
#col2 .menu li a:hover, #col2 .menu li a:active, #col2 .menu li a:focus { font-weight: bold; }

#col2 .menu li span { position: absolute; display: block; width: 190px; height: 40px; bottom: -40px; left: 0; background: url('../img/bg_menu_item.png') 0 0 no-repeat; }
#col2 .menu li ul span { background: none; }

#col2 .menu li ul { margin: 0;margin-top: 6px; background: #fff; text-align: right; }
#col2 .menu li ul a { color: #005095; border: none; padding: 0; display: inline; font-size: 10px; line-height: 13px; }
#col2 .menu li ul a:hover, #col2 .menu li ul a:active, #col2 .menu li ul a:focus { border-bottom: 1px solid #005095; }
#col2 .menu li ul li { text-transform: none !important; padding: 4px 10px; color: #005095; } 

#col2 .menu li .active { display: block; font-size: 11px; text-transform: uppercase; padding: 28px 32px 4px 4px; font-weight: bold; line-height: 16px;  }
#col2 .menu li ul li .active { display: inline; font-size: 10px; line-height: 13px; padding: 0; border-bottom: 1px solid #005095; }


#col2 .menu li.menu-item-1{ background: url('../img/ico_home.png') 158px 16px no-repeat; }
#col2 .menu-item-news { background: url('../img/ico_aktuality.png') 158px 16px no-repeat; }
#col2 .menu li.menu-item-2 { background: url('../img/ico_o-spolecnosti.png') 158px 16px no-repeat; }
#col2 .menu li.menu-item-3 { background: url('../img/ico_produkty.png') 158px 16px no-repeat; }
#col2 .menu li.menu-item-4 { background: url('../img/ico_farmako.png') 158px 30px no-repeat; }
#col2 .menu li.menu-item-6 { background: url('../img/ico_farmako.png') 158px 16px no-repeat; }
#col2 .menu li.menu-item-5 { background: url('../img/ico_informace.png') 158px 16px no-repeat; }
#col2 .menu li.menu-item-7 { background: url('../img/ico_kariera.png') 158px 16px no-repeat; }
#col2 .menu li.menu-item-8 { background: url('../img/ico_odkazy.png') 158px 16px no-repeat; }
#col2 .menu li.menu-item-10 { background: url('../img/ico_kontakty.png') 158px 16px no-repeat; }

#col2 #vpois { 
	position: absolute;
	width: 200px;
	height: 100px;
	bottom: 0px;
	left: 220px;
	_left: 5px;
}
#col2 #vpois span { 
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url('../img/button_vpois.png') 0 0 no-repeat;
	cursor: hand;
}
#col2 p { color: #fff; text-align:left; font-size: 10px; line-height: 16px; }

  
/*****Content*****/  

/*Define all elements in the content area*/  

#enter-section { overflow: hidden; margin-top: 100px; }
#enter-section a { text-decoration: none; }
#enter-section div { float: left; display: block; width: 164px; height: 164px; margin-left: 16px; padding: 15px; text-align: center; background: url('../img/bg-enter.png') 0 0 no-repeat; }
#enter-section div.enter-right { float: right; margin:0; margin-right: 16px; }
#enter-section a { display: block; color: #fff; font-size: 13px; line-height: 20px; font-weight: bold; margin-top: 20px; border: none; }
#enter-section .enter-button { display: block; width: 55px; height: 22px; margin-top: 70px; margin-left: 54px; background: url('../img/bg-enter-button.png') 0 0 no-repeat; }
#enter-section .enter-button a { font-size: 9px; font-weight: normal; margin: 0; }

h1 span { position: absolute; top: 4px; left:-30px; width: 28px; height: 28px; }
h1.menu-item-1 span{ background: url('../img/ico_home.png') left center no-repeat; }
h1.menu-item-news span{ background: url('../img/ico_aktuality.png') left center no-repeat; }
h1.menu-item-2 span { background: url('../img/ico_o-spolecnosti.png') left center no-repeat; }
h1.menu-item-3 span { background: url('../img/ico_produkty.png') left center no-repeat; }
h1.menu-item-4 span, h1.menu-item-6 span { background: url('../img/ico_farmako.png') left center no-repeat; }
h1.menu-item-5 span { background: url('../img/ico_informace.png') left center no-repeat; }
h1.menu-item-7 span { background: url('../img/ico_kariera.png') left center no-repeat; }
h1.menu-item-8 span { background: url('../img/ico_odkazy.png') left center no-repeat; }
h1.menu-item-10 span { background: url('../img/ico_kontakty.png') left center no-repeat; }

h1.menu-item-9 span { background: url('../img/ico_vpois.png') left center no-repeat; }

.filter, .filter-pro-odborniky { margin-bottom: 12px; font-size: 11px; }
.filter .active. .filter-pro-odborniky .active { color: #e61746; }

.product { position: relative; margin: 6px 0; overflow: hidden;  }

div.product h4 {display: none;}
div.product.expanded h4 {display: block; margin-top: 10px; margin-left: 10px;}
div.product .image {display:none; margin-top: 16px;}
div.product.expanded .image {display:block; float: right;}
div.product.expanded .image a { display: block; margin: 5px; padding: 5px; border: 1px solid #005095; }
div.product .description {display:none}
div.product.expanded .description {display:block; margin-left: 10px;}
div.product .files {display:none}
div.product.expanded .files {display:block; clear: left; margin-left: 10px;}


.product .expand { display: block; position: absolute; top: 0; left: 0px; width: 100%; height: 18px; background: url('../img/blank.gif') 0 0 no-repeat; cursor: pointer; _cursor: hand; z-index: 10; }

.expanded h3 {color: #005196; }
.product h3 { position: relative; font-size: 12px; cursor: pointer; _cursor: hand; z-index: 1; }
.product:hover h3 { color: #005196; }

.pro-verejnost .product p.odbornost {display:none !important;}

.product .description { margin-top: 16px; }
.product .description img { margin-bottom: 12px; }

.product .files { margin-top: 10px; }
.product .files a { display: block; padding-left: 14px; margin-right: 10px; border: none; background: url('../img/ico-file.gif') left center no-repeat; }

.product .files a:hover { text-decoration: underline; }


#workshopPopup { position: absolute; width: 503px; height: 193px; top: 180px; left: 260px; margin-left: -251px; background: url('../img/bg-workshopPopup.gif') 0 0 no-repeat; z-index: 1000; }
#workshopPopup #popupClose { float: right; margin: 10px; color: #fff; cursor:pointer; font-size:12px; font-weight: bold; text-align:right; }
#workshopPopup .regButton { position: absolute; top: 145px; left: 167px; width: 169px; height: 22px; }
#workshopPopup .regButton span { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../img/reg-button.gif') 0 0 no-repeat; }

/***** forms *****/




/* formular */

.required span { position: absolute; top: 0; left: 354px; color: #f00; }
.required { position: relative; }

form legend {
  font-size: 12px;
  margin-top: 14px;
  margin-bottom: 10px;
  padding-left: 14px;
  background: url('../img/square.gif') left center no-repeat;
}

form p {
	margin-bottom: 10px;
	overflow: hidden;
	_height: 1%;
}
form label { 
	float: left;
	width: 88px;
	padding-right: 20px;
	font-size: 10px;
	line-height: 18px;
	font-weight: bold;
}
form input {
	width: 236px;
	padding: 2px ;
	font-size: 10px;
	border: 1px solid #818285;
	background: #eee;
}
form input[type="radio"] { 
  background: none;
  border: none;
  width: 10px;
  clear: both;
  margin-bottom: 5px;
}
form textarea {
	width: 236px;
	padding: 4px 2px;
	font-size: 10px;
	border: 1px solid #818285;
	background: #eee;
}
form .button {
	width: 72px;
	padding: 4px 0;
	margin-left: 278px;
	font-weight: bold;
	text-transform: uppercase;
	color: #fff;
	background: #005095;
	border: none;
	cursor: pointer;
	_cursor: hand;
}
#workshopForm .required { color: #f00; }
#frmformWorkshop-s.button {margin: 20px 0; width: 120px;}

.radio-group label:first-child {display: none;} 
  
/***** copyright *****/  

/*Define all elements in the copyright*/  
  
#copyright a { color: #fff; }  
  
/*****Etc*****/  

/*Continue to define the other sections one by one*/

.filter, .filter-pro-odborniky {
  display: none;
}

div.flashes {
	color: #ff0000;
	padding: 1em;
	margin: 1em 0;
}

/** admin panel */

.admin-panel {
	opacity: 0.9;
	position: fixed;
	background: white;
	padding: 5px;
	border: 2px solid #B6D0F3;
	left: 10px;
	top: 40px;
	font-size: 12px;
	max-width: 300px;
}

#ajax-spinner {
    position:fixed;
    left: 50%;
    top: 50%;
    margin: -15px 0 0 -15px;
    background: white url('../images/loader.gif') no-repeat 50% 50%;
    padding: 13px;
    border: 2px solid #CCC;
    font-size: 0;
}

.texyla textarea {font-size: 105%}