/*
 * screen.css - styl pro zobrazeni na obrazovce
 * Autor: Radek Liska, radarfox at seznam.cz 
 */

/* ==============================================[ pozicni bloky ] */

body {
	padding: 0;
	background: url(../img/body.jpg) repeat-x;
	text-align: center;
}

#all {
	position: relative;
	margin: 0 auto;
	padding: 280px 0 0;
	width: 900px;
	text-align: left;
}

#wrap {
	padding: 0 0 1px;
	background: url(../img/wrap.jpg) no-repeat 100% 100%;
}

#head,
#foot,
#column,
#main {
	position: relative;
	width: 100%;
	overflow: hidden;
}

#head {
	position: absolute;
	z-index: 1;
	top: 0;
	left: -205px;
	width: 1155px;
	height: 280px;
	background: url(../img/head.jpg) no-repeat 0 40px;
}

#foot {
	background: #f1ebe2 url(../img/foot.jpg) repeat-x;
	text-align: center;
}

#column {
	float: left;
	width: 200px;
}

#main {
	float: right;
	width: 650px;
}

/* ==============================================[ hlavicka ] */

#head .header,
#head .hr {
	display: none;
}

#logo,
#head .kalkulace,
#head .topmenu {
	position: absolute;
	overflow: hidden;
}

#logo {
	z-index: 2;
	top: 0px;
	left: 0px;
	margin: 0;
	padding: 0;
	width: 250px;
	height: 65px;
}

#logo a {
	position: relative;
	display: block;
	height: 100%;
}

#head .kalkulace {
	top: 40px;
	left: 990px;
	width: 110px;
	height: 105px;
}

#head .kalkulace p {
	margin: 0;
	height: 100%;
}

#head .kalkulace a {
	display: block;
	height: 100%;
}

#head .kalkulace span {
	display: none;
}

#head .topmenu {
	top: 20px;
	left: 500px;
	width: 480px;
	height: 30px;
	font-size: 12px;
	line-height: 30px;
	white-space: nowrap;
}

#head .topmenu ul {
	position: relative;
	height: 100%;
}

#head .topmenu ul li {
	float: left;
	margin: 0 10px 0 0;
	height: 100%;
}

#head .topmenu ul a {
	display: block;
	position: relative;
	height: 100%;
	background: url(../img/head-topmenu.gif) repeat-x;
	color: #bbb;
	font-weight: bold;
	text-decoration: none;
	text-transform: lowercase;
}

#head .topmenu ul a.active,
#head .topmenu ul a:hover {
	color: #fff;
	background: #e0e4e4;
}

#head .topmenu ul a.active {
	color: #4b88c7;
}

* html #head .topmenu ul a {
	float: left;
}

#head .topmenu ul span {
	display: block;
	margin: 0 16px;
	height: 100%;
	cursor: pointer;
}

* html #head .topmenu ul span {
	float: left;
	margin: 0 8px;
}

#head .topmenu ul span.bgl,
#head .topmenu ul span.bgr {
	position: absolute;
	top: 0;
	margin: 0;
	width: 12px;
	height: 100%;
	background: no-repeat;
}

#head .topmenu ul span.bgl {
	left: 0;
}

#head .topmenu ul span.bgr {
	right: 0;
}

* html #head .topmenu ul span.bgr {
	right: -1px;
}

#head .topmenu ul a.active span.bgl,
#head .topmenu ul a:hover span.bgl {
	background-image: url(../img/head-topmenu-bgl.gif);
}

#head .topmenu ul a.active span.bgr,
#head .topmenu ul a:hover span.bgr {
	background-image: url(../img/head-topmenu-bgr.gif);
}

/* ==============================================[ paticka ] */

#foot .wrap {
	position: relative;
	margin: 0 auto;
	padding: 0 0 45px;
	width: 900px;
	background: url(../img/foot-wrap.jpg) no-repeat;
	text-align: left;
}

#foot .hr {
	display: none;
}

#foot .header {
	margin: 0.5em 0;
	color: #cd5642;
	font-size: 150%;
}

#foot .kontakt {
	float: left;
	width: 200px;
}

#foot .kontakt table {
	margin: 0;
	font-size: 92%;
}

#foot .kontakt td,
#foot .kontakt th {
	padding: 0 5px 0.3em 0;
}

#foot .kontakt th {
	color: #cd5642;
	font-weight: normal;
}

#foot .klienti {
	float: left;
	margin: 0 30px;
	width: 440px;
}

#foot .klienti img {
	border: none;
}

#foot .doporucte {
	float: left;
	width: 200px;
}

#foot .doporucte p {
	text-align: center;
}

#foot .doporucte input {
	width: 180px;
}

#foot .bottommenu,
#foot .copyright {
	position: absolute;
	bottom: 0;
	height: 45px;
	background: url(../img/foot-line.gif) repeat-x;
	color: #999;
	font-size: 11px;
	line-height: 45px;
	white-space: nowrap;
	overflow: hidden;
}

#foot .bottommenu .header,
#foot .copyright .header {
	display: none;
}

#foot .bottommenu {
	left: 210px;
	width: 690px;
}

#foot .bottommenu ul {
	margin: 1px 0 0;
	height: 44px;
}

#foot .bottommenu ul li {
	float: left;
	padding: 0 0 0 2px;
	height: 100%;
	background: url(../img/foot-bottommenu-li.gif) repeat-y;
}

#foot .bottommenu ul a {
	display: block;
	margin: 1px 0 0;
	height: 43px;
	color: #999;
	background: url(../img/foot-bottommenu-a.gif) no-repeat 2px 0;
	text-decoration: none;
	line-height: 41px;
}

#foot .bottommenu ul li.n02 a {
	background-position: 2px -43px;
}

#foot .bottommenu ul li.n03 a {
	background-position: 2px -86px;
}

#foot .bottommenu ul li.n04 a {
	background-position: 2px -129px;
}

#foot .bottommenu ul li.n05 a {
	background-position: 2px -200px;
}

* html #foot .bottommenu ul a {
	float: left;
}

#foot .bottommenu ul a:hover {
	background-color: #e1d5c8;
}

#foot .bottommenu ul span {
	display: block;
	margin: 0 10px 0 30px;
	height: 100%;
	cursor: pointer;
}

* html #foot .bottommenu ul span {
	float: left;
	margin: 0 5px 0 15px;
}

#foot .copyright {
	left: 0;
	width: 210px;
}

#foot .copyright p {
	margin: 0;
	height: 100%;
	text-align: center;
}

#foot .copyright p.n01 {
	float: left;
	width: 140px;
}

#foot .copyright p.n01 a {
	display: block;
	width: 140px;
	height: 100%;
	background: url(../img/foot-copyright.gif) no-repeat 50% 50%;
}

#foot .copyright p.n01 span {
	display: none;
}

#foot .copyright p.n02 {
	float: right;
	width: 65px;
}

/* ==============================================[ sloupec ] */

#column .box {
	position: relative;
	margin: 0 0 10px;
	width: 100%;
	min-height: 192px;
	background: url(../img/column-box.jpg) no-repeat;
}

* html #column .box {
	height: 192px;
}

#column .box .hr {
	display: none;
}

#column .box .header {
	margin: 0.5em 0;
	color: #999;
	font-size: 150%;
	font-weight: bold;
}

#column .box .container {
	margin: 0 10px;
	padding: 1px 0;
}

#column .box.sidemenu ul {
	font-size: 92%;
}

#column .box.sidemenu ul li {
	width: 100%;
	border-bottom: 1px solid #ddd;
}

#column .box.sidemenu.s02 ul li {
	border: none;
}

#column .box.sidemenu ul a {
	display: block;
	padding: 4px 0;
	width: 100%;
	background: no-repeat 5px 50%;
	color: #999;
	text-decoration: none;
}

#column .box.sidemenu.s01 ul a {
	background-image: url(../img/column-sidemenu-s01.gif);
}

#column .box.sidemenu.s02 ul a {
	background-image: url(../img/column-sidemenu-s02.gif);
}

#column .box.sidemenu ul a.active,
#column .box.sidemenu ul a:hover {
	position: relative;
	left: 5px;
	color: #555;
}

#column .box.sidemenu ul span {
	display: block;
	margin: 0 5px 0 20px;
}

#column .box.sidemenu .bg {
	position: absolute;
	bottom: 5px;
	right: 5px;
	width: 70px;
	height: 70px;
	background: url(../img/column-sidemenu-bg.png) no-repeat 50% 50%;
}

* html #column .box.sidemenu .bg {
	background-image: url(../img/column-sidemenu-bg.gif);
}

#column .box.sidemenu .pk {
	position: absolute;
	bottom: 5px;
	right: 5px;
	width: 70px;
	height: 70px;
	background: url(../img/column-sidemenu-pk.png) no-repeat 50% 50%;
}

* html #column .box.sidemenu .pk {
	background-image: url(../img/column-sidemenu-pk.gif);
}
#column .box.sidemenu .pn {
	position: absolute;
	bottom: 5px;
	right: 5px;
	width: 70px;
	height: 70px;
	background: url(../img/column-sidemenu-pn.png) no-repeat 50% 50%;
}

* html #column .box.sidemenu .pn {
	background-image: url(../img/column-sidemenu-pn.gif);
}

/* ==============================================[ obsah ] */
.cenik, .cenik-right {float: left; width: 292px; height: 300px; margin: 5px 5px 0 0;  padding: 0 15px 0 15px; background: url('../images/cenik.gif') top; background-repeat:no-repeat; }
.cenik-right {margin: 5px 0 0 0;}
.cenik h3, .cenik-right h3 {margin: 15px 5px; padding: 0;}
.contact, .contact-right {float: left; width: 292px; height: 150px; margin: 5px 5px 0 0;  padding: 0 15px 0 15px; background: url('../images/cenik.gif') top; background-repeat:no-repeat; }
.contact-right {margin: 5px 0 0 0;}
.contact h3, .contact-right h3 {margin: 15px 5px; padding: 0;}
#main .navi {
	margin: 0.5em 0 1em;
	color: #4d82ae;
	font-size: 150%;
	font-weight: bold;
}

#main .navi a {
	color: #4d82ae;
	text-decoration: none;
}

#main .navi a:hover {
	color: #e00;
}

#main .box {
	margin: 2em 0;
	width: 100%;
}

#main .box .container {
	margin: 0;
	padding: 1px 15px;
	border: 1px solid #ede5de;
	background: #fefbf6 url(../img/main-box.jpg) repeat-x;
}

#main .box .header {
	margin: 0.5em 0;
	color: #b09d98;
	font-size: 150%;
	font-weight: bold;
}

#main .box.schema table {
	margin: 1em auto;
}

#main .box.schema table td {
	padding: 0;
}

#main .box.schema table span {
	display: block;
	margin: 0 10px;
}

#main .kolotoc {
	position: relative;
	margin: 1em 0;
	width: 100%;
	height: 190px;
	background: url(../img/main-kolotoc.jpg) repeat-x 0 75px;

}

#main .kolotoc .content {
	position: relative;
	margin: 0 55px;
	width: 540px;
	height: 100%;
	overflow: hidden;
}

#main .kolotoc .content .slider {
	position: absolute;
	top: 0;
	left: 0;
	width: 10000px;
	height: 100%;
	white-space: nowrap;
}

#main .kolotoc .content .img {
	float: left;
	margin: 0 5px;
	width: 170px;
	height: 100%;
	overflow: hidden;
}
#main .kolotoc .content .img-pas {
	float: left;
	margin: 0 5px;
	width: 170px;
	height: 100%;
	overflow: hidden;
}

#main .kolotoc .next,
#main .kolotoc .prev {
	position: absolute;
	top: 75px;
	width: 40px;
	height: 40px;
	background: url(../img/main-kolotoc-control.jpg) no-repeat 0 0;
	cursor: pointer;
}

#main .kolotoc .next {
	right: 0;
}

#main .kolotoc .prev {
	left: 0;
	background-position: 0 -40px;
}

#main .reference {
	margin: 1em 50px 1em 60px;
}

#main .reference .cislovanie{
	text-align:right;
}
#main .reference .cislovanie span{
  background-color:#558FCC; 
  color:#FFFFFF;
}
#main .reference .cislovanie a{
  text-decoration:none;
}
#main .reference .img {
	float: left;
	width: 170px;
	margin: 0 10px 15px 0;
}
#main .reference .img-pas {
	float: left;
	width: 170px;
	margin: 0 10px 15px 0;
}

#main .reference .img img {
	margin: 0;
}

#main .reference .img-pas img {
	margin: 0;
}

#main .detail {
	margin: 1em 0;
}

#main .detail .img {
	float: left;
	margin: 0;
	width: 170px;
}

#main .detail .img img {
	margin: 0;
}

#main .detail .img-pas {
	float: left;
	margin: 0;
	width: 170px;
}

#main .detail .img-pas img {
	margin: 0;
}

#main .detail .info {
	float: right;
	width: 460px;
}

#main .detail .info table td {
	color: #999;
}

#main .detail .info table th {
	color: #cb4d38;
	font-weight: normal;
	text-align: left;
	white-space: nowrap;
}

#valid_ok{
  width:600px; 
  padding: 5px 10px;
  border:solid 2px #9ab8d1;  
  background:#f0f4f7;
  
}
#valid_ok th{text-align:right;}
#valid_ok td,th{border:none; padding:5px 10px;}

#valid_nok{
  width:600px;
  padding: 5px 10px; 
  border:solid 2px #ff6060;  
  background:#ffeded;
  
}
#valid_nok th{text-align:right;}
#valid_nok td,th{border:none; padding:5px 10px;}