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

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

body {
	padding: 12px 0;
	text-align: center;
}

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

#inner {
	float: left;
	width: 866px;
}

.col2 #inner {
	width: 896px;
}

#head,
#foot,
#lcolumn,
#rcolumn,
#main {
	position: relative;
	z-index: 0;
	width: 100%;
}

#head {
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	height: 78px;
	background: url(../img/head.gif) repeat-x 0 68px;
}

#foot {
	height: 220px;
	background: url(../img/foot.jpg) no-repeat;
}

#lcolumn,
#rcolumn {
	z-index: 1;
	float: left;
	width: 220px;
}

.col2 #lcolumn {
	display: none;
}

#rcolumn {
	float: right;
}

#main {
	z-index: 1;
	float: right;
	width: 616px;
}

* html #main {
	overflow: hidden;
}

.col2 #main {
	width: 100%;
}

#main.text {
	float: left;
	width: 880px;
}

/* ==============================================[ vlastni tridy ] */

.left {
	float: left
}

.right {
	float: right
}

.hidden {
	display: none !important;
}

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

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

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

#logo {
	z-index: 2;
	top: 0;
	left: 896px;
	margin: 0;
	padding: 0;
	width: 220px;
	height: 60px;
}

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

#head .topmenu {
	top: 34px;
	left: 5px;
	width: 882px;
	height: 29px;
	font-size: 13px;
	line-height: 29px;
	white-space: nowrap;
}

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

#head .topmenu ul li {
	float: left;
	margin: 0 5px 0 0;
}

#head .topmenu ul a {
	display: block;
	color: #888;
	text-decoration: none;
	text-transform: uppercase;
}

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

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

#head .topmenu ul span {
	margin: 0 5px;
}

#head .sipka {
	top: 68px;
	left: 5px;
	width: 882px;
	height: 10px;
	font-size: 0;
}

#head .sipka div {
	position: absolute;
	top: 0;
	left: 0;
	width: 20px;
	margin: 0;
	height: 100%;
	background: url(../img/head-sipka.gif) no-repeat;
}

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

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

#foot p {
	margin: 0;
}

#foot .seo,
#foot .tagy,
#foot .bottommenu,
#foot .kontakt,
#foot .copyright {
	position: absolute;
	font-size: 11px;
	overflow: hidden;
}

#foot .seo {
	top: 35px;
	left: 240px;
	width: 630px;
	height: 35px;
	color: #888;
	font-size: 13px;
	text-transform: uppercase;
}

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

#foot .tagy {
	top: 85px;
	left: 240px;
	width: 630px;
	height: 85px;
	background: #fff;
	font-size: 10px;
}

#foot .tagy p {
	margin: 10px;
}

#foot .tagy a {
	color: #666;
	text-decoration: none;
}

#foot .tagy a:hover {
	color: #000;
}

#foot .bottommenu {
	top: 188px;
	left: 0;
	width: 1120px;
	height: 32px;
	line-height: 32px;
	white-space: nowrap;
}

#foot .bottommenu ul {
	height: 100%;
}

#foot .bottommenu ul li {
	float: left;
	margin: 0 4px 0 0;
	width: 220px;
	height: 100%;
	text-align: center;
}

#foot .bottommenu ul a {
	display: block;
	color: #666;
	text-decoration: none;
	text-transform: lowercase;
}

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

#foot .bottommenu ul a:hover {
	color: #000;
}

#foot .kontakt {
	top: 90px;
	left: 25px;
	width: 190px;
	height: 80px;
}

#foot .kontakt table {
	margin: 0;
	width: 100%;
}

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

#foot .kontakt table a {
	color: #666;
	text-decoration: none;
}

#foot .kontakt table a:hover {
	color: #000;
}

#foot .copyright {
	top: 25px;
	left: 920px;
	width: 170px;
	height: 145px;
}

#foot .copyright .header {
	display: block;
	margin: 0 0 1em;
	color: #666;
	font-size: 13px;
	font-weight: normal;
	text-transform: uppercase;
}

#foot .copyright strong {
	color: #bf0000;
	font-weight: normal;
}

/* ==============================================[ boxy ] */

#all .box {
	position: relative;
	z-index: 0;
	float: left;
	margin: 0 4px 4px 0;
	width: 220px;
	height: 185px;
	font-size: 10px;
}

#lcolumn .box,
#rcolumn .box {
	float: none;
	margin-right: 0;
}

#all .box.medium {
	width: 444px;
}

#all .box.large {
	width: 444px;
	height: 374px;
}

#all .box.huge {
	width: 892px;
	height: 374px;
}

#all .box.tall {
	height: 374px;
}

#all .box.large.expandleft {
	float: right;
}

#all .box .bg {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
	width: 218px;
	height: 184px;
	border: 0 solid #ccc;
	border-width: 0 1px 1px;
	background: #dedfe0 url(../img/box-01-bg.gif) repeat-x;
	overflow: hidden;
}

#all .box.medium .bg {
	width: 442px;
}

#all .box.large .bg {
	width: 442px;
	height: 373px;
}

#all .box.huge .bg {
	width: 890px;
	height: 373px;
}

#all .box.tall .bg {
	height: 373px;
}

#all .box.expandleft .bg {
	left: auto;
	right: 0;
}

#all .box .bgt {
	position: absolute;
	top: 0;
	left: 20px;
	z-index: 10000;
	width: 22px;
	height: 12px;
	background: url(../img/box-01-bgt.png) no-repeat;
	font-size: 0;
}

* html #all .box .bgt {
	background-image: url(../img/box-01-bgt.gif);
}

#all .box .container {
	margin: 0 18px;
	padding: 1px 0;
}

#all .box .header {
	text-transform: uppercase;
}

#all .box .full {
	display: none;
}

#all .box .hidden {
	display: block !important;
}

#all .box .hr.hidden {
	display: none !important;
}

#all .box .more,
#all .box .less {
	position: absolute;
	bottom: 0;
	right: 0;
	height: 25px;
	line-height: 20px;
	white-space: nowrap;
	background: #dedfe0 url(../img/box-01-more-1.gif) no-repeat 100% 100%;
}

#all .box.expandleft .more,
#all .box.expandleft .less {
	right: auto;
	left: 0;
	background-image: url(../img/box-01-more-2.gif);
	background-position: 0 100%;
}

#all .box .less {
	display: none;
}

#all .box .more p,
#all .box .less p {
	margin: 0;
	height: 100%;
}

#all .box .more a,
#all .box .less a {
	display: block;
	padding: 0 20px;
	height: 100%;
	text-decoration: none;
}

* html #all .box .more a,
* html #all .box .less a {
	float: right;
}

* html #all .box.expandleft .more a,
* html #all .box.expandleft .less a {
	float: left;
}

#all .box.style2 .bg {
	border-color: #df8080;
	background-color: #fff;
	background-image: url(../img/box-02-bg.gif);
}

#all .box.style2 .bgt,
* html #all .box.style2 .bgt {
	background-image: url(../img/box-02-bgt.gif);
}

#all .box.style3 .bgt,
* html #all .box.style3 .bgt {
	background-image: url(../img/box-03-bgt.gif);
}

#all .box.style3 .bg {
	border-color: #df8080;
	background-color: #bf0000;
	background-image: url(../img/box-03-bg.gif);
	color: #fff;
}

#all .box.style3 h1,
#all .box.style3 h2,
#all .box.style3 h3,
#all .box.style3 h4,
#all .box.style3 a {
	color: #fff;
}

#all .box.style3 a:hover {
	color: #666;
}

#all .box.schuzky .button a {
	display: block;
	padding: 5px 0;
	background: #fff;
	color: #bf0000;
	text-align: center;
	text-decoration: none;
}

#all .box.schuzky .button a:hover {
	color: #000;
}

#all .box.login form {
	margin: 0;
	width: 100%;
}

#all .box.login input,
#all .box.login button {
	padding: 6px;
	border: none;
	background: #fff;
}

#all .box.login button {
	padding: 5px;
	color: #bf0000;
}

#all .box.login button:hover {
	color: #000;
}

#all .box.login .n01 input {
	width: 170px;
}

#all .box.login .n02 {
	float: left;
	margin: 0;
	padding: 0;
	width: 100px;
}

#all .box.login .n02 input {
	width: 90px;
}

#all .box.login .n03 {
	float: right;
	margin: 0;
}

#all .box.vytizeni .bar {
	position: relative;
	margin: 1em 0;
	width: 400px;
	height: 36px;
	background: url(../img/box-vytizeni-bar.jpg) no-repeat 50% 0;
}

#all .box.vytizeni .pointer {
	position: absolute;
	top: -5px;
	left: 0;
	width: 9px;
	height: 47px;
	background: url(../img/box-vytizeni-pointer.jpg) no-repeat;
}

#all .box.vytizeni .bar.v01 .pointer {left: 15px}
#all .box.vytizeni .bar.v02 .pointer {left: 55px}
#all .box.vytizeni .bar.v03 .pointer {left: 95px}
#all .box.vytizeni .bar.v04 .pointer {left: 135px}
#all .box.vytizeni .bar.v05 .pointer {left: 175px}
#all .box.vytizeni .bar.v06 .pointer {left: 215px}
#all .box.vytizeni .bar.v07 .pointer {left: 255px}
#all .box.vytizeni .bar.v08 .pointer {left: 295px}
#all .box.vytizeni .bar.v09 .pointer {left: 335px}
#all .box.vytizeni .bar.v10 .pointer {left: 375px}

#all .box.vytizeni .n01,
#all .box.vytizeni .n02,
#all .box.vytizeni .n03 {
	float: left;
	margin: 0 10px 0 0;
	width: 110px;
	color: #025f00;
	text-align: center;
}

#all .box.vytizeni .n02 {
	width: 150px;
	color: #ce8900;
}

#all .box.vytizeni .n03 {
	margin: 0;
	color: #c00;
}

#all .box.vytizeni strong {
	font-weight: normal;
}

#all .box .banner {
	position: absolute;
	top: 1px;
	left: 0;
	width: 218px;
	height: 183px;
}

#all .box .banner p {
	margin: 0;
	height: 100%;
	font-size: 13px;
	text-align: center;
	text-transform: uppercase;
	line-height: 1.4;
}

#all .box .banner a {
	display: block;
	height: 100%;
	background: url(../img/banner-01.jpg) no-repeat 50% -1px;
	color: #aaa;
	text-decoration: none;
}

#all .box .banner.n01 a {background-image: url(../img/banner-01.jpg)}
#all .box .banner.n02 a {background-image: url(../img/banner-02.jpg)}
#all .box .banner.n03 a {background-image: url(../img/banner-03.jpg)}
#all .box .banner.n04 a {background-image: url(../img/banner-04.jpg)}
#all .box .banner.n05 a {background-image: url(../img/banner-05.jpg)}
#all .box .banner.n06 a {background-image: url(../img/banner-06.jpg)}
#all .box .banner.n07 a {background-image: url(../img/banner-07.jpg)}
#all .box .banner.n08 a {background-image: url(../img/banner-08.jpg)}
#all .box .banner.n09 a {background-image: url(../img/banner-09.jpg)}
#all .box .banner.n10 a {background-image: url(../img/banner-10.jpg)}

#all .box .banner a:hover {
	background-position: 50% -186px;
	color: #666;
}

#all .box .banner span {
	display: block;
	position: absolute;
	top: 25px;
	left: 18px;
	padding: 10px 5px;
	width: 175px;
	background: #fff;
	cursor: pointer;
}

#all .box .banner.textbottom span {
	top: auto;
	bottom: 15px;
}

/* ==============================================[ sloupce ] */

#lcolumn .lang,
#rcolumn .lang {
	margin: 0 0 10px;
	width: 100%;
	height: 60px;
	font-size: 10px;
}

#lcolumn .lang .header,
#rcolumn .lang .header {
	display: none;
}


#lcolumn .lang ul,
#rcolumn .lang ul {
	height: 100%;
}

#lcolumn .lang ul li,
#rcolumn .lang ul li {
	float: left;
	margin: 0 2px;
	width: 50px;
	height: 100%;
}

#lcolumn .lang ul a,
#rcolumn .lang ul a {
	display: block;
	height: 100%;
	color: #888;
	background: no-repeat 50% 100%;
	text-decoration: none;
}

#lcolumn .lang ul a:hover,
#rcolumn .lang ul a:hover,
#lcolumn .lang ul a.active,
#rcolumn .lang ul a.active {
	color: #bf0000;
	background-image: url(../img/column-lang-sipka.gif);
}

#lcolumn .lang ul span,
#rcolumn .lang ul span {
	display: block;
	width: 100%;
	height: 50px;
	background: url(../img/column-lang.gif) no-repeat;
	cursor: pointer;
}

#lcolumn .lang ul li.n01 span,
#rcolumn .lang ul li.n01 span {background-position: -0px 0px;}
#lcolumn .lang ul li.n02 span,
#rcolumn .lang ul li.n02 span {background-position: -50px 0px;}
#lcolumn .lang ul li.n03 span,
#rcolumn .lang ul li.n03 span {background-position: -100px 0px;}
#lcolumn .lang ul li.n04 span,
#rcolumn .lang ul li.n04 span {background-position: -150px 0px;}

#lcolumn .lang ul li.n01 a:hover span,
#rcolumn .lang ul li.n01 a:hover span,
#lcolumn .lang ul li.n01 a.active span,
#rcolumn .lang ul li.n01 a.active span {background-position: -0px -50px;}
#lcolumn .lang ul li.n02 a:hover span,
#rcolumn .lang ul li.n02 a:hover span,
#lcolumn .lang ul li.n02 a.active span,
#rcolumn .lang ul li.n02 a.active span {background-position: -50px -50px;}
#lcolumn .lang ul li.n03 a:hover span,
#rcolumn .lang ul li.n03 a:hover span,
#lcolumn .lang ul li.n03 a.active span,
#rcolumn .lang ul li.n03 a.active span {background-position: -100px -50px;}
#lcolumn .lang ul li.n04 a:hover span,
#rcolumn .lang ul li.n04 a:hover span,
#lcolumn .lang ul li.n04 a.active span,
#rcolumn .lang ul li.n04 a.active span {background-position: -150px -50px;}

#lcolumn .nabidka,
#rcolumn .nabidka {
	margin: 0 0 4px -10px;
	width: 230px;
	height: 66px;
	background: url(../img/column-nabidka.gif) no-repeat;
	font-size: 13px;
	text-transform: uppercase;
}

#lcolumn .nabidka p,
#rcolumn .nabidka p {
	margin: 0;
	height: 100%;
	text-align: center;
}

#lcolumn .nabidka a,
#rcolumn .nabidka a {
	display: block;
	height: 100%;
	color: #fff;
	text-decoration: none;
}

#lcolumn .nabidka span,
#rcolumn .nabidka span {
	display: block;
	margin: 0 10px;
	padding: 10px 0;
}

#lcolumn .nabidka span span,
#rcolumn .nabidka span span {
	display: inline;
	margin: 0;
	padding: 0;
	color: #bf0000;
}

#lcolumn .kapitoly .menu,
#rcolumn .kapitoly .menu {
	margin: 20px 18px;
	color: #bf0000;
}

#lcolumn .kapitoly .menu li,
#rcolumn .kapitoly .menu li {
	margin: 5px 0;
}

#lcolumn .kapitoly .menu a,
#rcolumn .kapitoly .menu a {
	color: #888;
	text-decoration: none;
}

#lcolumn .kapitoly .menu a:hover,
#rcolumn .kapitoly .menu a:hover {
	color: #000;
}

/* ==============================================[ obsah ] */

#top .services {
	margin: 10px 0;
	width: 100%;
	height: 110px;
	font-size: 13px;
	overflow: hidden;
}

#top .services ul li {
	position: relative;
	float: left;
	margin: 0 16px 0 0;
	width: 110px;
	height: 110px;
	overflow: hidden;
}

#top .services ul li.n07 {
	margin: 0;
}

#top .services ul a {
	display: block;
	height: 100%;
	color: #828282;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
}

#top .services ul a:hover {
	color: #bf0000;
}

#top .services ul a span {
	display: block;
	padding: 60px 0 0;
	cursor: pointer;
}

#top .services ul a span.icon {
	position: absolute;
	top: 0;
	left: 31px;
	width: 48px;
	height: 48px;
	padding: 0;
	background: url(../img/top-services.jpg) no-repeat 0 0;
}

#top .services ul li.n01 a span.icon {background-position: -0px 0}
#top .services ul li.n02 a span.icon {background-position: -48px 0}
#top .services ul li.n03 a span.icon {background-position: -96px 0}
#top .services ul li.n04 a span.icon {background-position: -144px 0}
#top .services ul li.n05 a span.icon {background-position: -192px 0}
#top .services ul li.n06 a span.icon {background-position: -240px 0}
#top .services ul li.n07 a span.icon {background-position: -288px 0}

#top .services ul li.n01 a:hover span.icon {background-position: -0px -48px}
#top .services ul li.n02 a:hover span.icon {background-position: -48px -48px}
#top .services ul li.n03 a:hover span.icon {background-position: -96px -48px}
#top .services ul li.n04 a:hover span.icon {background-position: -144px -48px}
#top .services ul li.n05 a:hover span.icon {background-position: -192px -48px}
#top .services ul li.n06 a:hover span.icon {background-position: -240px -48px}
#top .services ul li.n07 a:hover span.icon {background-position: -288px -48px}

#top .head {
	margin: 0 0 15px;
	height: 40px;
	background: url(../img/top-head.gif) repeat-x 0 50%;
	line-height: 40px;
	white-space: nowrap;
	overflow: hidden;
}

#top .head .header {
	float: left;
	margin: 0;
	padding: 0 10px 0 40px;
	background: #fff url(../img/top-header.gif) no-repeat 0 50%;
	font-size: 18px;
	text-transform: uppercase;
}

#top .head .navi {
	float: right;
	margin: 0;
	padding: 0 0 0 10px;
	background: #fff;
	color: #bf0000;
}

#top .head .navi a {
	color: #888;
	text-decoration: none;
}

#top .head .navi a:hover {
	color: #000;
}

#main .slogan {
	position: absolute;
	z-index: 10000;
	top: 240px;
	left: 448px;
	margin: 0;
	width: 454px;
	height: 87px;
	background: url(../img/main-slogan.gif) no-repeat;
}

#main .slogan span {
	display: none;
}

#main .zalozky {
	position: relative;
	margin: 1em 0;
	padding: 0 0 5px;
	width: 100%;
	height: 50px;
	background: url(../img/head.gif) repeat-x 0 40px;
	font-size: 13px;
	line-height: 29px;
	white-space: nowrap;
	overflow: hidden;
}

#main .zalozky ul {
	margin: 0 5px;
	height: 100%;
}

#main .zalozky ul li {
	float: left;
	margin: 0 5px 0 0;
}

#main .zalozky ul a {
	display: block;
	color: #888;
	text-decoration: none;
	text-transform: uppercase;
}

* html #main .zalozky ul a {
	float: left;
}

#main .zalozky ul a.active,
#main .zalozky ul a:hover {
	background: #bf0000;
	color: #fff;
}

#main .zalozky ul span {
	margin: 0 5px;
}

#main .zalozky .sipka {
	position: absolute;
	top: 40px;
	left: 5px;
	height: 10px;
	font-size: 0;
}

#main .zalozky .sipka div {
	position: absolute;
	top: 0;
	left: 0;
	width: 20px;
	margin: 0;
	height: 100%;
	background: url(../img/head-sipka.gif) no-repeat;
}

#main .columns {
	margin: -1em 58px 1em;
}

#main .columns .column {
	width: 330px;
}

#main .seo table strong {
	color: #bf0000;
	font-weight: bold;
}

#main .seo table a {
	padding: 0 16px 0 0;
	background: url(../img/main-seo-a.gif) no-repeat 100% 0;
	color: #565656;
	text-decoration: none;
}

#main .seo table a:hover {
	color: #000;
}

#main .seo table td {
	padding: 5px 10px;
	vertical-align: middle;
}

#main .seo table td.n01,
#main .seo table td.n03,
#main .seo table td.n04 {
	text-align: center;
	white-space: nowrap;
}

#main .construct {
	position: relative;
	margin: 100px 0 100px 460px;
	padding: 2px 25px;
	width: 380px;
	border-left: 1px solid #e8c0c0;
	font-size: 118%;
	text-transform: uppercase;
}

#main .construct .slogan {
	left: -460px;
	top: 0;
}

#main .construct .header {
	margin: 1em 0;
	font-size: 100%;
}