/* ___| CSS document |_____________________ */


html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, menu, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td { margin: 0; padding: 0; }
body	{ font-family: Arial, sans-serif; font-size: 12px; color: #393939; background: #393939; }
a img	{ border: 0; }
.none	{ display: none; }
.hidden	{ visibility: hidden; }
.clear	{ margin: 0; padding: 0; height: 0; overflow: hidden; clear: both; }


/* ___| container |_____________________ */


#container { margin: 0 auto; width: 910px; position: relative; }
#main { margin: 0; padding: 0 22px 0 21px; float: left; clear: both; width: 867px; background: #fff url("../img/bg_main.png") repeat-y; }


/* ___| header |_____________________ */


#header { width: 866px; height: 96px; float: ; clear: both; background: url("../img/bg_header.png") no-repeat right 0; }
#header p { margin: 13px 205px 0 0; float: right; font-size: 15px; }
#header p em { font-style: normal; }
#header h1#frydl { margin: 0; float: none; font-weight: normal; font-size: 27px; color: #f00000; position: absolute; top: 50px; right: 28px; }
#header h1#tit {
	margin: 16px 0 0 28px;
	left: 0;
	top: 0;
	width: 193px;
	height: 57px;
	overflow: hidden;
	background: none;
	display: block;
	position: relative;
	float: left;
	}
#header h1#tit a {
	width: 193px;
	height: 57px;
	color: #000;
	text-decoration: none;
	cursor: pointer;
	display: block;
	}
#header h1#tit span {
	left: 0;
	top: 0;
	width: 193px;
	height: 57px;
	background: url("../img/kanalizace-frydl.png") no-repeat;
	display: block;
	position: absolute;
	}



#header #tit {
	margin: 16px 0 0 28px;
	left: 0;
	top: 0;
	width: 193px;
	height: 57px;
	overflow: hidden;
	background: none;
	display: block;
	position: relative;
	float: left;
	}
#header #tit a {
	width: 193px;
	height: 57px;
	color: #000;
	text-decoration: none;
	cursor: pointer;
	display: block;
	}
#header #tit span {
	left: 0;
	top: 0;
	width: 193px;
	height: 57px;
	background: url("../img/kanalizace-frydl.png") no-repeat;
	display: block;
	position: absolute;
	}


	
#header ul { margin: 0; padding: 0; position: absolute; top: 13px; right: 24px; }
#header ul li { margin: 0; list-style: none; float: left; }
#header ul li a { 
	margin: 0 4px 0 0; 
	padding-top: 7px;
	width: 87px; 
	height: 23px; 
	text-align: center; 
	display: block; 
	float: left; 
	font-size: 11px;
	color: #9e9e9e;
	text-decoration: underline;
	background: url("../img/bg_top-menu.png") no-repeat 0 0;
	}
#header ul li a:hover { color: #000; background: url("../img/bg_top-menu.png") no-repeat -87px 0; }


/* ___| menu |_____________________ */


menu { 
	margin: 0;
	padding: 0; 
	position: absolute;
	top: 352px; left: 38px; 
	}
menu li { margin: 0 11px; font-size: 13px; list-style: none; display: inline; }
menu li a { padding-top: 6px; color: #bd0101; font-weight: bold; text-decoration: underline; }
menu li a:hover { color: #393939; }

body#subpage menu { 
	padding: 20px 0 0 17px;
	left: 22px; 
	top: 95px; 
	width: 850px; 
	height: 66px; 
	background: #f0f1f2 url("../img/bg_menu.png") no-repeat; 
	}
body#subpage menu li a:hover { background: url("../img/arr.png") no-repeat center top; }
body#subpage menu li a:active { background: url("../img/arr.png") no-repeat center top; }
p#path { margin: 0; padding-left: 24px; position: absolute; font-size: 13px; left: 42px; top: 153px; background: url("../img/arr_menu.png") no-repeat left 2px; }
p#path a { color: #393939; text-decoration: underline; }
p#path a:hover { text-decoration: none; }


/* ___| top text |_____________________ */


.top-text { 
	margin: 0 0 18px 0; 
	float: left; 
	clear: both; 
	width: 867px; 
	height: 278px; 
	background: #d6d7d7 url("../img/bg_top-text.png") no-repeat 0 127px; 
	}
.top-flash { 
	margin: 0; 
	float: left; 
	clear: both; 
	width: 867px; 
	height: 127px; 
	background: #ccc7d7; 
	}
.text-box { margin: 0; padding: 15px 20px 0 22px; width: 247px; float: left; }
.text-box h2 { margin-bottom: 10px; padding: 0 0 0 26px; font-weight: normal; font-size: 20px; color: #393939; background: url("../img/bg_tit.png") no-repeat left 2px; }
.text-box p { font-size: 12px; }


/* ___| content |_____________________ */


#content { 
	margin: 0 0 3px 0;
	padding: 0 0 30px 0; 
	float: left; 
	clear: both; 
	width: 867px; 
	background: url("../img/bg_content.png") no-repeat bottom; 
	}
body#subpage #content { margin-top: 100px; }
#col_left { margin: 0 15px 0 20px; width: 535px; float: left; }
#col_left h3 { margin-bottom: 15px; font-weight: normal; font-size: 20px; color: #393939; }
#col_left h4 { margin-bottom: 5px; font-weight: bold; font-size: 15px; color: #393939; }
#col_left p { margin-bottom: 14px; line-height: 130%; font-size: 12px; }

#col_right { margin: 0; width: 297px; float: left; }
#kontakt {
	margin: 0; 
	padding-left: 67px;
	width: 230px;
	height: 108px;
	background: url("../img/bg_con.png") no-repeat;
	float: left;
	clear: both;
	}
#kontakt p { padding: 23px 0 7px 0; font-size: 12px; float: none; clear: both; }
#kontakt p a { color: #393939; text-decoration: underline; }
#kontakt p a:hover { text-decoration: none; }
#kontakt p span { font-size: 20px; vertical-align: middle; }
#video {
	margin: 3px 0 0 0; 
	padding: 5px 10px 0 88px;
	width: 199px;
	height: 75px;
	background: #393939 url("../img/bg_video.png") no-repeat;
	float: left;
	clear: both;
	}
#video p { margin: 2px 0 0 0; color: #fff; font-size: 12px; float: left; clear: both; }
#video h3 { font-size: 13px; margin-bottom: 1px; }
#video h3 a { color: #f00000; text-decoration: underline; }
#video h3 a:hover { text-decoration: none; }

#sluzby {
	margin: 3px 0 0 0; 
	padding: 10px 10px 0 70px;
	width: 227px;
	height: 246px;
	background: url("../img/bg_sluzby.jpg") no-repeat;
	float: left;
	clear: both;
	}
#sluzby p { margin: 10px 0 0 0; color: #000; font-size: 12px; float: left; clear: both; }
#sluzby h3 { font-size: 20px; margin-bottom: 1px; }
#sluzby h4 { font-size: 12px; font-weight: bold; margin-bottom: 1px; color: #393939; }
#sluzby ul { margin: 0; padding: 0; position: relative; top: 7px; left: -50px; width: 300px; }



/* ___| greybox |_____________________ */


#greybox { margin: 0 0 0 -4px; float: left; clear: both; width: 910px; position: relative; }
#greybox_t { margin: 0; height: 16px; font-size: 0; float: left; clear: both; width: 910px; background: #d7d7d7 url("../img/bg_greybox_t.png") no-repeat; }
#greybox_m { margin: 0; padding: 10px 22px 6px 21px; float: left; clear: both; width: 867px; background: #d7d7d7 url("../img/bg_greybox_m.png") repeat-y; }
#greybox_b { margin: 0; height: 19px; font-size: 0; float: left; clear: both; width: 910px; background: #d7d7d7 url("../img/bg_greybox_b.png") no-repeat; }
.item { margin: 0 0 0 26px; float: left; width: 400px; }
.item h4 { margin-bottom: 4px; font-size: 15px; }
.item h4 a { color: #393939; text-decoration: none; }
.item h4 a:hover { text-decoration: underline; }
.item p { margin: 0 0 2px 0; font-size: 12px; }
.item p.odk a { margin: 0; color: #f00000; font-weight: bold; text-decoration: underline; padding-left: 13px; background: url("../img/arr_red.png") no-repeat left 4px; }
.item p.odk a:hover { color: #393939; }
.item img { margin: 0 14px 46px 0; float: left; border: 1px solid #fff; }
.hline { margin: 9px 0 11px 8px; height: 2px; background: #fff; float: left; clear: both; width: 860px; font-size: 0; }

h3.btn a { 
	margin: 0; 
	display: block; 
	width: 212px; 
	height: 41px; 
	line-height: 41px; 
	vertical-align: middle;
	font-weight: normal;
	background: url("../img/btn.png") no-repeat; 
	position: absolute; 
	top: -33px; 
	left: 46px; 
	text-align:center;
	text-decoration: none;
	font-size: 20px;
	color: #393939;
	}
h3.btn a:hover { text-decoration: underline; }


/* ___| footer |_____________________ */


p#p-foot { margin: 4px 0 14px 40px; font-size: 12px; color: #fff; float: left; }
p#p-foot-r { margin: 4px 40px 0 0; float: right; color: #d7d7d7; }
p#p-foot-r a { text-decoration: none; color: #d7d7d7; }
p#p-foot-r a:hover { text-decoration: underline; }
p#footer { margin: 0 0 0 12px; color: #aaa; font-size: 10px; padding: 17px 0 40px 12px; width: 875px; height: 21px; float: left; clear: both; background: url("../img/bg_footer.png") no-repeat top; }
p#footer a { margin: 0 6px; font-size: 12px; color: #aaa; text-decoration: none; font-weight: bold; }
p#footer a:hover { text-decoration: underline; }