/**
 * =============================================================================
 * Zaklad stranky
 * =============================================================================
 */

* {	margin: 0; padding: 0; }

html { background: #e8e8e8 url("background.gif") repeat-x; }
body { background: transparent url("background_page.gif") center top repeat-y; }
#page-background-1 { background: transparent url("background_header.jpg") center top no-repeat; }
#page-background-2 { background: transparent url("background_content.png") center 338px no-repeat; }
#page-background-3 { background: transparent url("background_footer.png") center bottom no-repeat; }

body, #the-content input[type="submit"] {
	font-size: 10pt;
	font-family: tahoma, sans-serif;
	color: #4a4a4a;
}

a { color: #0f568b; }
a:hover { color: #b00000; }

a img { border: 0; }

ul { list-style-image: url("bullet.gif"); }


.break { clear: both; }
/**
* =============================================================================
* Rozvrzeni stranky
* =============================================================================
*/
/* #page div { border: 1px solid red; } */

#page { width: 920px; margin: 0 auto; }

	#header { width: 900px; height: 170px; padding: 0 10px; position: relative; }

	#offer { margin: 25px 25px 5px 25px; }

	#breadcrumb {
		padding: 10px 5px 5px 5px;
		background: transparent url("menu_shadow.png") left bottom no-repeat;
	}

	#menu {
		width: 100%; height: 65px;
		background: transparent url("menu.png") no-repeat;
	}

	#content {
		padding: 10px;
		min-height: 450px;
	}
		#column-1 { float: left; width: 200px; }
		#column-2 { float: right; width: 200px;	}
		#the-content { margin: 0 215px 20px 215px;}
		/*#the-content { float: left; margin: 0 0px 20px 0px; }*/
		#the-content-2 { background: url("dots_2.gif") top left repeat-x; margin: 0 10px;}


	#footer {
		height: 111px;
	}

/**
 * =============================================================================
 * Barvy
 * =============================================================================
 */

	.dark { color: #0f568b;}
	.light { color: #fff; }

/**
 * =============================================================================
 * Konkretni prvky
 * =============================================================================
 */

/* Hlavicka */
#header h1 {
	width: 384px; height: 103px;
	display: block; position: relative;
	top: 39px; float: left;
}
	#header h1 span {
		width: 100%; height: 100%;
		display: block; position: absolute;
		background: url("logo.jpg") no-repeat;
	}

#header .offer {
	position: absolute; top: 15px; left: 450px;
	padding: 30px;
	width: 115px; height: 116px;

}
	#header .offer span {
		display: block; position: absolute;
		width: 175px; height: 176px; top: 0; left: 0;
		background: url("offer-2010.png") no-repeat;
	}



#header .boxes {
	padding-top: 5px; margin-left: 690px;
	height: 150px;
}

	#header .boxes h2 {
		text-transform: uppercase;
		font-size: 12px;
		margin-top: 10px;
		margin-bottom: 10px;
	}

	#search { margin-bottom: 21px; }
	#widget-search-query {	width: 155px; background: #fff url("search_icon.png") left center no-repeat; padding-left: 20px; }

	#who-is-name { text-align: right; width: 100px; }
	#who-is-ext { width: 60px; }

	#who-is-submit, #search-submit { top: 6px; position: relative; }



/* Reklama */
#offer p {
	text-align: center;
	color: #0f568b;
	font-size: 17px; font-weight: bold;
	width: 100%;
}

/* Breadcrumb */
#breadcrumb p { color: #0f568b; text-align: center; text-transform: lowercase; }
#breadcrumb a { text-decoration: none; }
#breadcrumb span.choosen { font-weight: bold; }

/* Menu */
#menu ul.depth-0 {
	list-style: none;
	margin: 0; padding: 8px 15px;
	text-align: center;
}
	#menu li.depth-0 {
		display: inline-block;
		height: 48px; line-height: 48px;
		font-weight: bold;
		background: transparent url("menu_separator.png") top right no-repeat;
		padding-right: 1px;
		position: relative; /**/
	}

		#menu li.depth-0 a, #menu li.depth-0 span.choosen {
			color: #fff; text-decoration: none;
			display: block; padding: 0 15px;
		}

		#menu li.depth-0.first a {
			background: transparent url("menu_separator.png") top left no-repeat;
			padding-left: 16px;
		}

		#menu li.depth-0 span {	display: block;	}
		#menu li.depth-0.has-children a span, #menu li.depth-0.has-children span.choosen span { background: url("arrow_down.gif") center 35px no-repeat; }

		#menu li.depth-0 a:hover, #menu li.depth-0 span.choosen { background-color: #0f568b; }



#menu ul.depth-1 {
	width: 100%; /**/
	margin: 0; padding: 10px 0;
	position: absolute; display: none;
	background: #0f568b;
	opacity: 0.97;
	text-align: left;
	-moz-border-radius-bottomleft: 7px;
	-moz-border-radius-bottomright: 7px;
	-webkit-border-bottom-right-radius: 7px;
	-webkit-border-bottom-left-radius: 7px;
}

	#menu li.depth-1 {
		display: block;
		margin: 0; padding: 0 15px; line-height: normal;
		background: none;
		position: static;
		text-align: center;
	}

		#menu li.depth-0.has-children li.depth-1 a span { background: none; }

		#menu li.depth-1 a, #menu li.depth-1 span.choosen {
			color: #fff;
			display: block;
			padding: 7px 5px; margin: 0;
			background: none;
		}

		#menu li.depth-1.first a, #menu li.depth-1.first span.choosen { background: none; }
		#menu li.depth-1 a:hover, #menu li.depth-1 span.choosen { color: #c1e4ff; text-decoration: underline; }


#menu li:hover ul {display:block; z-index:10;}
#menu li.depth-0:hover a, #menu li.depth-0:hover span.choosen { background-color: #0f568b; }
#menu li.depth-0:hover a span, #menu li.depth-0:hover span.choosen span { background-position: center 38px; }




/* Obsah */
#the-content h2 { color: #0f568b; font-size: 14pt; margin-bottom: 11pt; }
	#the-content h2 + p { color: #0f568b; }
#the-content h3 { color: #0f568b; font-size: 11pt; margin-bottom: 11pt; }
	#the-content h3.as-h4 { font-size: 10pt; }
#the-content p + h3 { margin-top: 20pt; }
#the-content p { margin-bottom: 11pt; text-align: justify; line-height: 16pt; }
	#the-content p + p, #the-content table + p { text-indent: 1.5em; }
#the-content hr { border: 0; height: 1px; background: transparent url("dots_2.gif") repeat-x; margin: 12pt 0;}
#the-content ul { margin-left: 40px; line-height: 16pt; text-align: justify; margin-bottom: 11pt; }
	#the-content li { margin-bottom: 3pt; }
#the-content p.no-indent { text-indent: 0; }
#the-content p.no-indent + p { text-indent: 0; }

a.button-link {
	margin-top: 30px; margin-bottom: 30px;
	display: inline-block;
	background: #0f568b url("background_button.gif") 0 0 repeat-x;
	line-height: 31px; padding: 0 20px;
	-moz-border-radius: 5px; -webkit-border-radius: 5px; behavior:url(border-radius.htc);
	color: #fff; font-weight: bold; text-decoration: none;
}
	a.button-link:hover { background-position: 0 -31px;}

	a.important { font-weight: bold; text-decoration: none; background: url("arrow_right.gif") center right no-repeat; padding-right: 7px;}
			a.important:hover { text-decoration: underline; }


#the-content p.center, #the-content td.center { text-align: center; text-indent: 0; }
#the-content p.right, #the-content td.right, #the-content th.right { text-align: right; text-indent: 0; }
#the-content p.left, #the-content td.left, #the-content th.left { text-align: left; }
#the-content table.center { margin-left: auto; margin-right: auto; }
#the-content table td, #the-content table th { padding: 4px 4px; }
#the-content thead td, #the-content th { background: #0f568b; color: #fff; font-weight: bold; text-align: center; }
	#the-content thead a { color: #fff; }

#the-content table { border: 1px dashed #ccc; margin-bottom: 11pt; }

#the-content p.error { text-align: center; font-weight: bold; color: red; padding: 5px; border: 1px solid red;}

#the-content .reference-button { display: inline-block; width: 100px; text-align: center; margin: 5px; text-decoration: none; }
	/* #the-content .reference-button img { border: 0; background: url("image_frame.png") -8px 0 no-repeat; padding: 5px 2px 16px 2px; } */
	#the-content img.shadow { border: 0; background: url("image_frame.png") -8px 0 no-repeat; padding: 5px 2px 16px 2px; }
	#the-content .float-right { float: right; margin-left: 15px; }
	#the-content .float-left { float: left; margin-right: 15px; }
	#the-content .float-container { float: left; width: 100%; }

#the-content .box-background { padding: 15px 5px 10px 5px; background: #eee; -moz-border-radius: 5px; -webkit-border-radius: 5px; behavior:url(border-radius.htc); }
#the-content .no-wrap { white-space: nowrap; }


/* Paticka */
#footer {
	text-align: center;
	font-size: 8pt;
	position: relative;
}
	#footer ul { list-style: none; background: url("footer_line.png") bottom center no-repeat; padding: 10px 0;}
	#footer li { display: inline; border-left: 1px solid #4a4a4a; padding: 0 7px;}
		#footer li.first { border-left: 0; }

	#footer a { color: #4a4a4a; text-decoration: none; text-transform: lowercase;}
		#footer a:hover { color: #b00000; text-decoration: underline; }
		#footer span.choosen { color: #b00000; text-transform: lowercase; }

	#footer p { text-align: center; color: #4a4a4a; padding: 10px 0;}

	#up_button { position: absolute; display: block; top: 0; right: 50px; width: 62px; height: 34px; overflow: hidden;}
		#up_button span { position: absolute; display: block; width: 52px; height: 24px; background: 0 0 url("button_up.gif") no-repeat; padding: 5px;}
		#up_button:hover span { background-position: 0 -34px; }



/**
 * =============================================================================
 * Widgety
 * =============================================================================
 */

.widget {
	clear: both;
	padding-bottom: 15px;
}

	.widget h3, .widget h4, .widget p {
		margin: 0 12px 5px 12px;
		text-align: justify;
	}

	.widget h3 {
		font-size: 10pt; font-weight: bold;
		text-transform: lowercase;
		margin-bottom: 10px;
		color: #0f568b;
	}

		.widget h3 a { text-decoration: none; color: #b00000; background: url("arrow_right.gif") center right no-repeat; padding-right: 7px;}
			.widget h3 a:hover { text-decoration: underline; }

	.widget h4 {
		font-size: 10pt; font-weight: bold;
		color: #0f568b;
		margin-bottom: 5px;
	}




/* Novinky */
.news-item {
	background: url("background_news.png") top left no-repeat;
	padding-top: 10px;
}

	.news-item p { font-size: 8pt; padding-bottom: 10px; line-height: 12pt;}

	.news-item .perex { background: url("dots_1.gif") bottom center repeat-x; }
	.news-item .date { float: left; color: #0f568b; }
	.news-item .more { float: right; }
		.news-item .more a { color: #b00000; text-decoration: none; font-weight: bold; background: url("arrow_right.gif") center right no-repeat; padding-right: 7px;}
		.news-item .more a:hover { text-decoration: underline;}



/* Kontakt */
.contact {
	background: url("background_contact.jpg") left -10px no-repeat;
	padding-top: 165px;
}

	.contact p { text-align: center; background: url("dots_1.gif") bottom center repeat-x; padding-bottom: 10px;}
	.contact a { color: #4a4a4a; text-decoration: none; }
		.contact a:hover { color: #b00000; text-decoration: underline; }


/* Prevod domen - who is */
.migrate-domain {
	background: url("background_domains.jpg") left top no-repeat;
	padding-top: 100px;
}

/* Registrace */
.registration p { text-align: left; }
.registration a {
	display: block;
	width: 94px; height: 101px; /* 186 x 131px */
	background: url("registration.gif")  -6px 0 no-repeat;
	margin: 0;
	padding: 30px 80px 0 12px;
	font-weight: bold; text-decoration: none;
	text-align: left;
}

/* Prave dokoncujeme */
/* Reference */
.related-work { }
	.current-occupation p, .related-work p { text-align: left;	}
	.current-occupation img, .related-work img { border: 0; background: url("image_frame.png") -8px 0 no-repeat; padding: 5px 10px 16px 2px; }

/* Prihlaseni */
.login { background: url("background_login.png") left bottom no-repeat; margin-bottom: 25px;}
	.login form { margin-top: 18px; }
	.login input[type="text"], .login input[type="password"] { margin-bottom: 5px; width: 80px; font-size: 11px; }
	.login input, .login label { float: left; }
	.login label { width: 55px; padding-right: 5px; line-height: 21px; text-align: right;}
	.login br { clear: left; }
	.login input[type="image"] { float: left; }
	.login p { clear: left; text-align: center; font-size: 8pt;}
	.login a { background: url("arrow_right.gif") center right no-repeat; padding-right: 7px; text-decoration: none; }


/* Cenik domen */

.price-list {
	background: url("background_prices.jpg") right 25px no-repeat;
	min-height: 180px;
}

	.price-list table { border: 0;}
	.price-list td { border: 0; font-size: 8pt; font-weight: bold; padding: 2px 10px;}
	.price-list td.price { color: #0f568b; }

/* Nasi klienti */
.clients {
	text-align: center;
	float: left; width: 607px;
	background: url("dots_2.gif") top right repeat-y;
	padding: 10px 20px;
}
	.clients h3 { text-align: center;}



.partners {
	clear: none; margin-left: 650px;
	padding: 10px;
}

	.partners h3 { text-align: center;}

	.partners ul { list-style: none; text-align: center; line-height: 1.5em; }
	.partners li a { color: #4a4a4a; font-weight: bold; font-size: 8pt; text-decoration: none; }
		.partners li a:hover { color: #b00000; text-decoration: underline; }

/**
 * =============================================================================
 * Boxy - TODO: tahame se s tim i tam, kde tyto styly nepouzivame
 * =============================================================================
 */

#homepage-header-1 { background: url("content/header-1.jpg") no-repeat center top; height: 134px; padding-top: 140px; margin-bottom: -90px !important ; }
#homepage-header-2 { background: url("content/header-2.jpg") no-repeat center top; height: 134px; padding-top: 140px; margin-bottom: -90px !important ; }

#the-content div.button {
	width: 130px; min-height: 200px;
	padding: 10px 15px 10px 90px;
	margin-bottom: 5px;
	float: left;
}

	#the-content div.button .content { min-height: 175px;  }

	#the-content div.button h3 { text-align: right; color: #0f568b; margin-bottom: 20px; font-size: 10pt;}
	#the-content div.button ul { list-style: none; margin: 0;}
	#the-content div.button li { text-align: right; font-size: 9pt; line-height: 18pt;}
	#the-content div.button a { text-decoration: none; }
		#the-content div.button a:hover { color: #b00000; text-decoration: underline; }

	#the-content div.button .more { text-align: right; margin-right: 0; }
	#the-content div.button .more a { font-weight: bold; background: url("arrow_more.png") center right no-repeat; padding-right: 12px; }
	#the-content div.button .more a { font-weight: bold; }

#the-content .webhosting { background: url("box_webhosting.jpg") no-repeat; }
#the-content .webdesign { background: url("box_webdesign.jpg") no-repeat; }
#the-content .webprogram { background: url("box_webprogram.jpg") no-repeat; clear: both; }
#the-content .others { background: url("box_others.jpg") no-repeat; }

#the-content .button-2 {
	width: 480px;
	margin-bottom: 10px;
	background: #f2f2f2 url("background_box.gif") left bottom no-repeat;
	color: #0f568b;
}
	#the-content .button-2 h3 { font-size: 10pt; }

	#the-content .button-2 h3 a { text-decoration: none; color: #b00000; background: url("arrow_right.gif") center right no-repeat; padding-right: 7px;}
			#the-content .button-2 h3 a:hover { text-decoration: underline; }

	#the-content .hosting-start { background: url("box_start.jpg") no-repeat; padding: 75px 15px 5px 15px;}
/* 	#the-content .discount-25 { background: url("discount-25.png") 375px 10px no-repeat; padding: 75px 15px 5px 15px;}
	Zaradit pripadne pod div hosting-start v HTML clanku */


	#the-content .hosting-business { background: url("box_business.jpg") no-repeat; padding: 75px 15px 5px 15px; }
/* 	#the-content .discount-50 { background: url("discount-50.png") 375px 10px no-repeat; padding: 75px 15px 5px 15px;} */

	#the-content .hosting-maximum { background: url("box_maximum.jpg") no-repeat; padding: 75px 15px 5px 15px; }
	#the-content .hosting-mini { background: url("box_mini.jpg") no-repeat; padding: 75px 15px 5px 15px;}
	#the-content .hosting-standard { background: url("box_standard.jpg") no-repeat; padding: 75px 15px 5px 15px;}
	#the-content .hosting-exclusive { background: url("box_exclusive.jpg") no-repeat; padding: 75px 15px 5px 15px;}


/**
 * =============================================================================
 * Vyplneni objednavky
 * =============================================================================
 */

.registration-navigation { background: url("form_navigation.png") 0 0 no-repeat; height: 54px; margin-bottom: 15px}
.registration-navigation div {
	float: left; line-height: 54px;
	text-align: center; font-weight: bold;
	text-transform: uppercase;
}
	.registration-navigation div.active {
		color: #0f568b;
		background: url("form_arrow.gif") bottom center no-repeat;
	}

	.registration-navigation div.counter {
		font-size: 14pt; color: #0f568b;
	}


/**
 * =============================================================================
 * Formulare
 * =============================================================================
 */

input[type="text"], input[type="password"], textarea {
	border: 1px solid #dedede;
	background: #fff;
	padding: 3px;
}

select {
	border: 1px solid #dedede;
	background: #fff;
	padding: 2px;
}

#the-content form { float: left; width: 100%; padding: 20px 0 10px 0; margin: 0 0 20px 0; background: #eee; -moz-border-radius: 5px; -webkit-border-radius: 5px; behavior:url(border-radius.htc); }
#the-content label, #the-content form span.label { float: left; width: 140px; text-align: right; padding-right: 15px; padding-top: 3px; color: #0f568b; font-weight: bold;}
	#the-content label.opposite { width: auto; text-align: left; padding-right: 0; padding-left: 10px; }

#the-content input, #the-content form span.readonly, #the-content select, #the-content textarea  { float: left; margin-bottom: 10px; padding: 3px;}
#the-content input[type="submit"] {
	padding: 5px 20px; margin-left: 155px;
	background: #0f568b url("background_button.gif") 0 0 repeat-x;
	height: 31px;
	-moz-border-radius: 5px; -webkit-border-radius: 5px; behavior:url(border-radius.htc);
	color: #fff; font-weight: bold; text-decoration: none;
	border: 0; cursor: pointer;
}
	#the-content input[type="submit"]:hover { background-position: 0 -31px;	}
	#the-content input[type="submit"].inline { margin-left: 10px; }

#the-content input[type="radio"] { margin-left: 155px; margin-top: 4px;}
#the-content input[type="checkbox"] { margin-left: 155px; margin-top: 4px;}


#the-content form br { clear: left; }
#the-content form h4 {  margin-bottom: 5px; margin-left: 15px;}
#the-content form p.help { margin-left: 155px; margin-right: 30px; }
#the-content form span.inline { float: left; margin: 3px 5px 0 5px; }
#the-content form span.inline.first { margin-left: 0; }
#the-content form hr { margin-left: 30px; margin-right: 30px;  }
#the-content input.right-align { text-align: right; }
#the-content form span.readonly { width: 280px; }
#the-content form span.readonly.no-width { width: auto; }

#the-content .bigskip { margin-top: 15px; }