* {
	margin: 0;
	padding: 0;
}

html, body {
	height: 100%;
}
body {
	font: 83% 'Trebuchet MS', 'Geneva CE', lucida, sans-serif;
	background: #262626 url('bgr.jpg') top center fixed;
	margin: 0px;
	padding: 0;
	height: 100%;
	text-align: center;
}

#drzak {
 		position: relative;
    margin: 0px auto;
    text-align:left;
    width: 980px;
		background: #2E2C2D url('drzak_repeat.gif') 0px 0px repeat-y;
		min-height: 100%;
		height: 100%;
		}
		
#drzak-top {
		background: transparent url('drzak_top.jpg') 0px 20px no-repeat;
		min-height: 780px;
		}		
		
body>#drzak {
		height: auto;
}

#pravy {
    float: right;
    width: 250px;
    margin:0; 
		padding:0;
		padding-bottom: 80px;
		position: relative;
		z-index: 2;
		  }
#pravy-obsah {
      margin: 30px 20px 20px 0px;
		}
		
#levy {
    margin:0 280px 0 0; 
		padding:0;
		padding-bottom: 80px;
		position: relative;
		z-index: 2;
		  }

#levy-obsah {
    margin: 30px 20px 0px 20px;
		padding: 0px 10px 20px;
		background: transparent  url('levy_bgr.jpg') top left no-repeat;
      }

hr.cleaner {
      clear:both;
      height:1px;
      margin: -1px 0 0 0; padding:0;
      border:none;
      visibility: hidden;
      }

#hlavicka {
	background: transparent url('hlavicka.jpg') top left no-repeat;
	height: 180px !important;
	margin: 0px;
	position: relative;
	z-index: 2;
}  

#paticka {
	margin: 0px auto;
	margin-top: 50px;
	width: 100%;
	height: 50px;
	color: #ffffff;
	position: absolute;
	bottom: 0px;
	left: 0px;
	z-index: 2;
}


/* --------- prvky ---------- */


h1,h2,h3,h4 { font-weight: normal; margin: 0 0 0.15em 0; line-height: 1.5em; }

h1 {  font-size: 2.2em; color: #fc2f84; color: #999999; color: #a5fd3e; margin-bottom: 0.7em; }
h2 {  font-size: 1.5em; color: #a5fd3e; margin-bottom: 1em; margin-top: 2em;}
h2 a {color: #a5fd3e;}
h3 {  font-size: 1.2em; color: #FEF047; padding-bottom: 10px; margin-top: 0em;  }
#pravy h3 {font-size: 1.2em; color: #a5fd3e; margin-top: 0em;} 
p, address, table, ul, form { color: #939393; margin: 0 0 1em 0;	}
p, address {	font-style: normal;	line-height: 1.6; }
li {margin: 0px; list-style-position: inside;}
a {color: #fff; }
a:hover {color: #fff; text-decoration: none;}
td {background: #252525;}
td { padding: 0.2em 1em 0.2em 0.5em; line-height: 20px; height: 30px;}
td img, img.ikonka  {position: relative; top: 3px; margin-right: 5px;}
thead td {background: #111; color: #fff}
tr.mezera {height: 20px;}

/* ------------ formulare ------------------- */

/* ------------ hlavicka ------------------- */

#hlavicka h2 {	text-align: left; 	margin: 0px;	padding: 0px;	text-indent: 1em;	line-height: 2em; }
#logo {	position: absolute;	top: 40px;	left: 20px;	z-index: 5; 	background: transparent url('hlavicka.jpgg') -40px -20px;	width: 940px;	height: 120px;	}		
#logo span {	display: block;	width: 940px;	height: 120px;	background: transparent url('hlavicka.jpg') -20px -40px;	position: absolute;	top: 0px;	left: 0px;	z-index: 5;	cursor: hand;}

/* --------- index paletky ------------- */
#paletky {margin: -30px 0px 50px 3px; padding-bottom: 50px; height: 320px;}
.paletka-sluzby, .paletka-reference, .paletka-osobni {width: 293px; height: 300px; float: left; background: black; margin: 0px 0px 0px 25px; position: relative; z-index: 50;}
#paletky h2 { font-size: 1.5em; display: block; height: 50px; position: relative; top: 10px; line-height: 40px; margin: 0px 0px 20px; padding: 0 0 0 20px;  }
#paletky p, #paletky ul { margin: 0px; padding: 20px 0 0 20px; }
#paletky ul { font-size: 1.2em;}

.paletka-sluzby {background: url('paletka-sluzby-new.jpg') no-repeat;}
.paletka-reference {background: url('paletka-reference-new.jpg') no-repeat;}
.paletka-osobni{background: url('paletka-osobni-new.jpg') no-repeat;}

.paletka-sluzby h2, .paletka-sluzby ul {color: #a5fd3e;}
.paletka-reference h2, .paletka-reference ul {color: #fffd56;}
.paletka-osobni h2, .paletka-osobni ul {color: #88c9ff;}

.info-index {position: absolute; left: 720px; top: 25px; width: 230px;}
.dalsi {position: relative; top: 220px; left: 0px; width: 230px;}

#pravy .paletka {width: 230px; background: #1e1d1e url('paletka.jpg') no-repeat; margin: 0px 0px 25px ; position: relative; z-index: 50; padding-bottom: 20px;}
#pravy .paletka p, #pravy paletka ul, #pravy .paletka address { margin: 0px; padding: 20px 0 0 20px;}
#pravy .paletka h3 { font-size: 1.1em; display: block; height: 50px; position: relative; top: 10px; line-height: 40px; margin: 0px 0px 20px; padding: 0 0 0 20px;  }

/* -- horni menu -- */ 
#navigace {
    width: 940px;
    height: 40px;
    margin: 0px 20px;
    padding: 0;    
    border-width : 1px 0px;
    border-top: 1px solid #555;
    border-bottom: 1px solid #222;
    position: relative;
    z-index: 10;
    background: transparent url("menu.png");
}


#navigace li {
    margin: 0 0 0 0px;
    padding: 0px;
    float: left;
    list-style: none;
    background: transparent url("menu_bgr_black.gif") 0px 0px repeat-x;
    position: relative;
    line-height: normal;
}

#navigace li a {
    line-height: 40px;
    display: block;
    _float: left;
    color: #bbb;
    font-size: 13px;
    text-decoration: none;
    padding: 0 10px 0 40px;
    margin-left: 0px;
    background: transparent url("menu-polozka.png") 0px -100px repeat-x;
}

#navigace li.active a{
    background: transparent url("menu-polozka.png") 0px 0px repeat-x;
    color: #fff;
}

#navigace li a:hover, #navigace li:hover{
    background: black url("menu-polozka.png") 0px 0px repeat-x;
    color: #fff;
}

#navigace li.first {
    padding-left: 15px;
    background: none;
}

#navigace li ul {
    width: 250px;
    margin: 0;
    
    position: absolute;
    top: 40px;
    left: 0px;
    background: transparent url("submenu.png");
    display: none;
}

#navigace li:hover ul {
    display: block;
}

#navigace li ul li {
    padding: 0px;
    float: none;
    background: transparent url("submenu.jpg") 0px -100px;   
    text-align: left;
}

#navigace li ul li a {
    width: 250px;
    padding: 12px 0px 12px 0px;
    text-indent: 40px;
    line-height: normal;
    font-size: 13px;
    font-weight: normal;
    float: none;
    background: transparent url("hr.gif") 0 bottom repeat-x !important;
}

#navigace li ul li.active {
    background: url("submenu.jpg") 0px -200px;   
}

#navigace li ul li:hover {
    background: url("submenu.jpg") 0px 0px;   
}


	

/* --------- levy ------------- */
.reference {
	width: 660px;
	background: transparent url('reference.jpg') 0px 0px no-repeat;
	
  border-bottom: 1px solid #000000;
  margin: 2em 0em 1em;
  padding: 7px 0px 5px;  	
  position: relative;
}

.reference h3 {  margin: 10px 15px 0px 15px; color: #999999; font-size: 1.4em;}
.reference p {  margin: 10px 15px 15px 15px; color: #999999; line-height: 1.2em;}
.reference a span { background: transparent url('zobrazit.png') 0px 0px no-repeat; width: 250px; height: 50px; position: absolute; top: 142px; left: 205px;}
.reference a:hover span {display: block; background-position: 0px -50px;}
.reference a {background: transparent;}
.reference p a {background: #000;}


strong {color: #ddd;}
/* --------- pravy---------- */
.button {position: relative; width: 225px; height: 25px;}
.button a span {width: 225px; height: 25px; position: absolute; top: 0px; left: 0px; background-position: 0px 0px; display: block;}
.button a:hover span {background-position: 0px -25px;}
.button .web {background-image: url('galerie-web.gif'); }
.button .grafika {background-image: url('galerie-grafika.gif'); }
.sto {width: 100px important; margin-top: 20px;}
.button .zpet {background-image: url('zpet.gif'); width: 100px;}

.green {color: #a5fd3e;}
.yellow {color: #fffd56;}
.blue {color: #88c9ff;}

/* --------- paticka  ---------- */

#paticka-text {
	text-align: right;
	margin: 0px 10px;	
	padding: 0px 2em;
	line-height: 50px;
	background: transparent;
	color: #999999;
}