@charset "utf-8";
/* CSS Document */

/* -----------------------------------------------------------------
Název souboru:		screen.css
Autor:				Jan Bartůněk | j.bartunek@redneck.cz
Popis:				Základní rozvržení a výchozí pravidla stylů pro web Redneck.cz
Obsah:
	- Vynulování výchozích stylů prohlížečů
	- Layout
	- Design všech horních panelů
--------------------------------------------------------------------
*/

/********** VYNULOVÁNÍ VÝCHOZÍCH PRAVIDEL PROHLÍŽEČŮ **************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/********** OBECNÉ DEKLARACE *************************/
body {
	font-size: 62.5%;
	font-family: Verdana, Geneva, sans-serif;
	background: #efefef url(images/body_pattern.png) fixed;
	-webkit-font-smoothing: subpixel-antialiased;
}
.clearer {clear: both;}
.invisible {display: none; visibility: hidden;}
.left {float: left;}
.right {float: right;}

/********** LAYOUT ************************************/
#container {width: 1000px; margin: 30px auto 0 auto;}
#home { width: 1000px; height: 734px; margin: 30px auto 0 auto; padding: 0 55px; background: url(images/home.png) no-repeat; position: relative;}
#home div.stripe{ position: absolute; left: -15px; top: 501px; width: 169px; height: 169px; background:url(images/last_proj.png) no-repeat; z-index: 100; }

#header {width: 960px; height: 364px; padding: 31px 20px 0 20px; position: relative; background: url(images/header.png) no-repeat;}
#header > a {width: 246px; height: 93px; display:block;}
#header ul {list-style-type: none;}
#header li {}
#header li a {width: 246px; height: 31px; display: block;}
#header.home {background: none;}

#header_rotator {width: 714px; height: 333px; position: absolute; left: 266px; top: 31px;}

#main {	width: 960px; padding: 27px 20px 50px; background: url(images/content_pattern.png) #fff center top repeat-y; overflow: hidden;}

#main div.left { width: 407px; padding: 0 30px 0 45px;}
#main div.right {
	width: 407px;
	padding: 0 45px 0 25px;
	border-left: #eaeaea 1px solid;
}
#main div.contact.left { width: 375px; padding: 0 0 0 45px;}
#main div.right.contact2 { width: 447px;}
#main div.contact img { margin: 0 20px 5px 0; border: 6px #e1e1e1 solid; float: left; }
#main #form { margin-bottom: 40px; }
#main #form input, #main #form textarea { height: 30px;  width: 340px; border: none; border-top: #e9e9e9 1px solid; background-color: #f1f1f1; margin-bottom: 20px;}
#main #form textarea { height: 185px;}
#main #form label { float: left; clear: left; display: block; line-height: 38px; margin-bottom: 20px;}
#main #form #contact_submit {
	clear: both;
	float: none;
}
#main #form legend { letter-spacing: .1ex;}
#main #form table th { vertical-align: top; width: 80px;}

#main_bottom {height: 29px; background: url(images/mainstripe_bottom.png); clear: both;}

a.logo img {margin: 41px auto 19px auto; display: block;}

#footer {width: 948px; height: 192px; margin: 0 auto 20px auto; background: url(images/footerstripe_top.png) scroll 0 28px no-repeat; }

#footer > div {float: left;}
#footer > div.first {width: 200px;}
#footer > div.second {width: 350px; padding-right: 50px;}
#footer > div.third {width: 348px; position: relative;}

#footer > div.first a {text-decoration: underline;}
#footer > div h3 { height: 43px;}
#footer > div.second img {width: 70px; height: 70px; float: left; margin: 0 10px 10px 0;}
#footer a#fb { width: 90px; height: 19px; display: block; position: absolute; left: 144px; top: 123px; background: url(images/fb.png) bottom no-repeat;}
#footer a:hover#fb, #footer a:active#fb, #footer a:focus#fb { background-position: top;}
#footer a#tw { width: 90px; height: 19px; display: block; position: absolute; left: 257px; top: 123px; background: url(images/twitter.png) bottom no-repeat;}
#footer a:hover#tw, #footer a:active#tw, #footer a:focus#tw { background-position: top;}

/********** TYPOGRAPHY ************************************/
#header li a { color: #393939; font-size: 1.4em; font-weight: bold; letter-spacing: .2ex; text-align: center; text-transform: uppercase; text-decoration: none; padding: 16px 0 13px 0; }
#header li a span { font-family: "Book Antiqua", "Palatino Linotype",  Palatino, serif; font-size: .8em; font-weight: bold; text-transform: none; color: #9a9a9a; line-height: 2.0em;}
#header li a:hover, #header li a:active, #header li a:focus, #header li.active a { color: #63c5d6;}
#header li a:hover span, #header li a:active span, #header li a:focus span { color: #a5c6cc;}

#main a { color: #666666; text-decoration: none; border-bottom: 1px #666666 dotted; }
#main a:hover { color: #444343; text-decoration: none; border-bottom: 1px #666666 solid; }
#main .left h2, #main .right h2, legend, .caption h4 { float: left; width: 180px; margin: 0 20px 5px 0; padding: 0 0 5px 0; border-bottom: #f7f7f7 1px solid; font-size: 1.8em; font-weight: lighter; color: #63c5d6; line-height: 1.5em; text-align: center; letter-spacing: -0.05ex;}
#main .right h2 { width: 160px;}
#main .right h2.odd,
#main .left h2.odd { float: right; margin-left: 18px;}

p, dt, dd, label, #main h3, #main li, #footer li, #main blockquote { font-family: "Book Antiqua", "Palatino Linotype",  Palatino, serif; font-size: 1.4em; letter-spacing: .2ex; line-height: 1.6em; color: #666666;}
#main p {text-indent: .5em; margin-bottom: 10px;}
#main h2 + p {text-indent: 0;}
#main p.last, #main ul {margin-bottom: 40px;}
#main p {text-align: justify;}
#main p strong, #main p em { color: #5A5A5A; }
#main li { padding: 0 0 10px 25px; background: url(images/listpointer.png) 5px 9px no-repeat;}
#main h3 { color: #5A5A5A; padding-bottom: 5px;}
#main blockquote { text-align: center; padding: 0 50px 20px 50px;}
#main a.btn, #main #form input.submit { font-family: Verdana, Geneva, sans-serif; color: #f7f7f7; background-color: #63c5d6; font-size: 2.1em; padding: 2px 0;  text-transform: uppercase; text-decoration: none; border: none; letter-spacing: .05ex; line-height: 27px; width: 290px; height: 27px; margin: auto; display: block; text-align: center; cursor: pointer;}
#main dt { font-weight: bold;}
#main dd { }
#main dd.price { text-align: right; font-weight: bold;}

#main div.contact h2, legend { letter-spacing: -0.1ex; width: auto; float: none; text-align: left; clear: left; margin-right: 0;}
#main div.contact h2 span { color: #d6d6d6;}
#main .left.contact p { text-indent: -1.5ex; margin-bottom: 50px; }
#main div.right h2.contact { float: none; width: auto; text-align: left; }
#main div.right p.contact { text-indent: 0; margin: 0 0 5px 0;}

#main #form input, #main #form textarea { padding: 4px 20px; font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; font-size: 1.8em; letter-spacing: .2ex; color: #666; }
#main #form input { font-weight: bold;}
#main #form input.submit { width: 120px; font-size: 2.2em; font-weight: normal; padding-bottom: 4px;}
#main #form p { text-align: center; margin-bottom: 10px;}

#footer h3 {font-size: 1.4em; text-transform: uppercase; letter-spacing: .1ex; color: #444343; font-weight: normal;}
#footer p, .caption p { letter-spacing: .25ex; line-height: 1.2em; color: #666666;}
#footer li { line-height: 2.2em; letter-spacing: .2ex;}
#footer a {text-decoration: none; color: #838383;}
#footer a:hover, #footer a:active, #footer a:focus { color: #5a5a5a;}

/********** CONTENT ROTATOR ********************/
/*** GENERAL ****/
#header_rotator strong {font-weight: bold;}
#header_rotator li { margin-bottom: 9px;}
#header_rotator li span {font-family: Verdana, Geneva, sans-serif; font-size: 1.45em; font-style: italic; font-weight: lighter; color: #393939; background-color: #e4e4e4; opacity: 0.8; letter-spacing: .2ex; line-height: 1.4em;}

#uvod, #prez, #market, #ddd, #kontakt {width: 714px; height: 333px; position: absolute; top: 0px; left: 0px; display: none; overflow: hidden; }
#uvod.active, #prez.active, #market.active, #ddd.active, #kontakt.active { display: block;}
#prez ul, #market ul, #ddd ul, #kontakt ul { list-style-type: none; position: absolute; }
#uvod h3, #prez h3, #market h3, #ddd h3, #kontakt h3 {position: absolute;  color: #f1f1f1; background-color: #000; font-size: 3.2em; text-transform: uppercase; padding-top: 10px; opacity: 0.85;}
/*** CONCRETE ****/
#uvod { background: url(images/rot_uvod.png); z-index: 10;}
#uvod h3 { left: 130px; top: 210px;}
#uvod h3.first { left: 45px; top: 80px; color: #000; background-color: #ddd; opacity: 0.7;}
#uvod p { position: absolute; left: 48px; top: 36px; font-family: Verdana, Geneva, sans-serif; font-size: 1.8em; color: #6e6e6e; line-height: 1.2em }

#prez { background: url(images/rot_prez.png); z-index: 8;}
#prez h3 { left: 107px; top: 82px;}
#prez h3.first { left: 173px; top: 40px; letter-spacing: -0.1ex;}
#prez ul {left: 62px; top: 170px; }

#market { background: url(images/rot_market.png); z-index: 6;}
#market h3 { left: 291px; top: 249px;}
#market h3.first { left: 138px; top: 207px;}
#market ul {left: 65px; top: 41px; }

#ddd { background: url(images/rot_3d.png); z-index: 4;}
#ddd h3 { left: 260px; top: 84px;}
#ddd h3.first { left: 140px; top: 42px;}
#ddd ul {left: 66px; top: 170px;}

#kontakt { background: url(images/rot_kontakt.png); z-index: 2;}
#kontakt h3 { left: 47px; top: 242px; color: #000; background-color: #ddd; opacity: 0.7;}
#kontakt h3.first { left: 170px; top: 42px; background-color: #000; opacity: 0.85; color: #f1f1f1;}
#kontakt ul.first {left: 66px; top: 122px;}
#kontakt ul.second {left: 242px; top: 122px;}