/* ## Global */
html {	/* tricky footer line */
	background: #E6E6E6 repeat-x url('../images/layout/body_background.gif');
}
body {
	background: repeat-x url('../images/layout/footer_background.gif') bottom center;
	text-align: center;
}
#main {
	width: 960px;
	margin: 35px auto 0 auto;
}

div.clear {
	clear: both;
	font-size: 1px;
	line-height: 0;
}

select, input.textField, textarea.textField {
	background-color: #F2F2F2;
	border: 1px solid #858585;
}
	input.textField, textarea.textField {
		width: 372px;

		font: 10pt 'Verdana', sans-serif;

		padding: 6px 0 0 5px;
	}
	input.textField {
		height: 23px;
	}
		input.textField:focus, textarea.textField:focus {
			background-color: #fff;
			border: 1px solid #FF9300;
		}
	input.fileInput {
		padding: 2px;
	}

	select {
		padding: 1px 2px;
	}

span.red, span.green {
	background: none !important;
}
span.red {
	color: #FF0000;
}
span.green {
	color: green;
}

/* ## Header */
#header {
	height: 90px;

	position: relative;

	/* border: 1px solid red; */
}
	#header #logo, #header #top_menu {
		position: absolute;
	}

	/* logo */
	#header #logo {
		top: 13px;
		left: 45px;
	}

	/* top menu */
	#header #top_menu {
		top: 5px;
		right: 32px;

		font: 10pt 'Arial', sans-serif;
		font-weight: bold;
	}

		/* links*/
		#top_menu a, #top_menu a:link, #top_menu a:visited {
			margin-left: 60px;

			padding: 25px 0 1px 0; /* for sexy border hover */

			display: block;
			float: left;

			text-align: center;
			text-decoration: none;

			color: #000;
		}
		#top_menu a:active, #top_menu a:hover {
			border-bottom: 2px solid #FFB400;
		}

		#top_menu a.selected {
			color: #FF9300 !important;	/* IE6 is too stupid, needs !important */
		}

		/* order for free button */
		#top_menu a#order_for_free {
			width: 75px;	height: 75px;

			padding-top: 19px;

			background: no-repeat url('../images/layout/order_bubble.gif');
		}
			#top_menu a#order_for_free:hover, #top_menu a#order_for_free.selected {
				color: #fff !important;
				border: none !important;
			}

/* ## Info (banner on top called so to disable stupid AdBlocks ;) */
#info {
	height: 275px;
	background: no-repeat url('../images/layout/info_background.gif');

	position: relative;
}
	#info h1#tagline, #info a#favat, #info h4 {
		position: absolute;
	}

	/* sexy text on top ;) */
	#info h1#tagline {
		top: 73px;
		left: 39px;

		text-align: left;
		text-indent: 51px;

		font: 22pt 'Arial', sans-serif;
	}
		span.darmowe {
			font-size: 30pt;
			padding-right: 2px;
		}
		span.na {
			font-size: 17pt;
		}
		span.oszczedzanie {
			font-size: 38pt;
			letter-spacing: -1px;
		}
		span.energia {
			font-size: 19pt;
			/* font-weight: bold; */
		}
		span.wfirmie {
			font-size: 23pt;
			letter-spacing: -1px;
		}

	/* tooltips */
	#info h4 {
		font: 10pt 'Verdana', sans-serif;
		font-weight: bold;

		line-height: 1.4em;
	}
		#info h4#tip_one {
			top: 62px;
			right: 278px;
		}
		#info h4#tip_two {
			bottom: 70px;
			right: 316px;
		}

	/* favat! */
	#info a#favat, #info a#favat:link, #info a#favat:visited {
		display: block;
		width: 270px;	height: 285px;
			top: 0;
			right: 30px;

		background: no-repeat url('../images/layout/info_favat_matrix.gif') 0 0;
	}
	#info a#favat:hover {
		/* background: no-repeat url('../images/layout/info_favat_hover.gif'); */
		background-position: -270px 0;
	}

/* ## Content, GENERAL */
div.content {
	padding: 33px 0 60px 0;
}

/* ## Content, MAIN SCREEN */
#content_home {
	padding-left: 25px;
}
	/* steps, general */
	#content_home a.step {
		display: block;
		width: 228px;	height: 210px;

		float: left;

		padding: 20px 0 0 30px;

		text-align: left;
		text-decoration: none;
	}
		#content_home a.step span {
			display: block;
		}
		#content_home a.step span.header {

			margin-bottom: 16px;

			font: 30pt 'Arial', sans-serif;
			letter-spacing: -1px;
			line-height: .9em;

			color: #FFA200;
		}
			#content_home a.step:hover span.header {
				color: #252525;
			}

		#content_home a.step span.text {

			font: 14px 'Verdana', sans-serif;
			line-height: 1.75em;
			color: #252525;
		}

	/* steps, individual */
	#content_home a#step1 {
		background: no-repeat url('../images/layout/step_1_matrix.gif') 0 0;
	}
		#content_home a#step1:hover { background-position: 0 -240px; }

	#content_home a#step2, #content_home a#step_3 {
		padding-left: 35px;
	}
	#content_home a#step2 {
		margin: 0 44px 0 63px;
		background: no-repeat url('../images/layout/step_2_matrix.gif') 0 0;
	}
		#content_home a#step2:hover { background-position: 0 -240px; }

	#content_home a#step3 {
		background: no-repeat url('../images/layout/step_3_matrix.gif') 0 0;
	}
		#content_home a#step3:hover { background-position: 0 -240px; }

/* ## Content, STEPS (and some globals) */
div#info_small, div#info_header {

	width: 960px;	height: 112px;
	position: relative;
}

div#info_small {
	background: no-repeat url('../images/layout/infosmall_background_matrix.gif') 0 0;
}

	div#info_small.step2 { background-position: 0 -112px; }
	div#info_small.step3 { background-position: 0 -224px; }
	div#info_small.step4 { background-position: 0 -336px; }

	/* typo */
	#info_small h1 {
		position: absolute;
			top: 29px;

		font: 22pt 'Arial', sans-serif;
		text-align: left;

		line-height: 1em;
	}
		#info_small h1 a, #info_small h1 a:link, #info_small h1 a:visited {
			color: #252525;
			text-decoration: none;
		}
		#info_small h1 a:hover, #info_small h1 a.selected {
			color: #fff !important;
			
		}

	/* elements */
	h1#header1 { left: 55px; }
	h1#header2 { left: 277px; }
	h1#header3 { left: 508px; }
	h1#header4 { left: 740px; }


#content_step {
}

/* ## Content, FVAT ANALYSER (and some globals) */
div#info_header {
	background: no-repeat url('../images/layout/infoheader_background.gif');
	text-align: left;
}

	#info_header h1, #info_header h2 {
		position: absolute;
			left: 55px;
	}
	#info_header h1 {
		top: 45px;
		font: 29pt 'Arial', sans-serif;
	}
	#info_header h2 {
		top: 26px;
		font: 11pt 'Verdana', sans-serif;
		font-weight: bold;

	}

div#content_favat {
}

	/* GLOBAL favat! torrah, torrah, torrah! guallimae shaptidei! favat! favat! */
	div#favat {
		width: 915px;	height: 1421px;
		margin: 0 auto;

		background: no-repeat url('../images/contents/favat.gif');

		position: relative;
	}

		/* hovered links */
		div#favat a, div#favat div.popup {
			position: absolute;

			/* border: 1px solid red; */
		}
			div#favat a:hover {
				border-bottom: 1px solid #FF9300;
			}

			a#f0 {
				width: 245px;
				height: 44px;

				top: 30px;
				left: 40px;
			}
				div#f0_popup {
					top: 28px;
					left: 283px;
				}

			a#f1 {
				width: 111px;
				height: 23px;

				top: 292px;
				left: 190px;
			}
				div#f1_popup {
					top: 272px;
					left: 300px;
				}

			a#f1a {
				width: 232px;
				height: 15px;

				top: 456px;
				left: 50px;
			}
				div#f1a_popup {
					top: 429px;
					left: 285px;
				}

			a#f2 {
				width: 327px;
				height: 19px;

				top: 552px;
				left: 50px;
			}
				div#f2_popup {
					top: 530px;
					left: 380px;
				}
			a#f3 {
				width: 320px;
				height: 19px;

				top: 596px;
				left: 50px;
			}
				div#f3_popup {
					top: 570px;
					left: 370px;
				}
			a#f3aa {
				width: 137px;
				height: 15px;

				top: 723px;
				left: 140px;
			}
				div#f3aa_popup {
					top: 693px;
					left: 280px;
				}

			a#f3a {
				width: 98px;
				height: 19px;

				top: 755px;
				left: 50px;
			}
				div#f3a_popup {
					top: 732px;
					left: 150px;
				}
			a#f3b {
				width: 185px;
				height: 19px;

				top: 800px;
				left: 50px;
			}
				div#f3b_popup {
					top: 778px;
					left: 235px;
				}

			a#f4 {
				width: 190px;
				height: 19px;

				top: 856px;
				left: 50px;
			}
				div#f4_popup {
					top: 833px;
					left: 240px;
				}

			a#f5 {
				width: 187px;
				height: 19px;

				top: 1040px;
				left: 50px;
			}
				div#f5_popup {
					top: 1017px;
					left: 237px;
				}

			a#f6 {
				width: 188px;
				height: 19px;

				top: 1083px;
				left: 50px;
			}
				div#f6_popup {
					top: 1060px;
					left: 237px;
				}

			a#f7 {
				width: 173px;
				height: 22px;

				top: 1273px;
				left: 520px;
			}
				div#f7_popup {
					top: 1230px;
					left: 695px;
				}

		/* popups */
		div#favat div.popup {
			margin-left: 10px;
		}
			div#favat div.popup div.popup_birdie, div#favat div.popup div.popup_content {
				float: left;
			}
			div#favat div.popup div.popup_birdie {
				width: 21px;	height: 29px;
				margin-top: 10px;
				background: no-repeat url('../images/layout/favat_tooltip_ptaszek.gif');
			}
			div#favat div.popup div.popup_content {
				background-color: #FFC038;
			}
				div#favat div.popup div.popup_content p {
					font: 10pt 'Verdana', sans-serif;
					font-weight: bold;

					line-height: 1.6em;

					padding: 5px 10px;
				}

/* ## Inner steps (globals) */
div.content_steps {
	padding-top: 7px;
}

	/* small favat */
	div.favat_small {
		width: 920px;	height: 345px;

		background-repeat: no-repeat;

		margin: 40px auto 4px auto;
	}
		div.favat_small#favat_step1 { background-image: url('../images/contents/step_1_favat.gif'); }
		div.favat_small#favat_step2 { background-image: url('../images/contents/step_2_favat.gif'); }
		div.favat_small#favat_step3 { background-image: url('../images/contents/step_3_favat.gif'); }

	/* texts */
	#step_texts_container {
		width: 900px;
		margin: 0 auto;
	}
		#step_texts_container #icon_container, #step_texts_container #text_container {
			float: left;
		}

		/* left: icon */
		#step_texts_container #icon_container {
			width: 305px;
			position: relative;
		}
			#step_texts_container #icon_container p {
				position: absolute;

				text-align: center;

				font: 8pt 'Verdana', sans-serif;
				line-height: 1.8em;
			}


			/* Inner steps (individual) */
			div.step1_icon {
				height: 360px;
				background: no-repeat url('../images/contents/step_1_icon.gif') 16px 24px;
			}
				div.step1_icon p {
					top: 280px;
					left: 37px;
				}
			div.step2_icon {
				height: 362px;
				background: no-repeat url('../images/contents/step_2_icon.gif') 17px 32px;
			}
				div.step2_icon p {
					top: 289px;
					left: 30px;
				}
			div.step3_icon {
				height: 360px;
				background: no-repeat url('../images/contents/step_3_icon.gif') 15px 25px;
			}
				div.step3_icon p {
					top: 283px;
					left: 47px;
				}


		/* right: texts */
		#step_texts_container #text_container {
				width: 590px;
				padding-top: 29px;
				text-align: left;
		}

	/* global: typo */
	div.content_steps h1, div#order_want_save h1, h1.form_sent {
		font: 28pt 'Arial', sans-serif;
		line-height: 1em;
		margin-bottom: 30px;
		/* margin: 0 0 11px 3px; */
	}
		div.content_steps h1 span, div#order_want_save h1 span {
			color: #FFA200;
		}
	div.content_steps p, div.content_steps ul li {
		font: 10pt 'Verdana', sans-serif;
		line-height: 1.8em;
/*
		margin-bottom: 10px;
		margin-right: 15px;
*/
		margin: 0 15px 10px 3px;
	}
		div.content_steps p span {
			background-color: #FFC038;
		}

	div.content_steps ul {
		margin: 15px 25px;

		list-style: square;
	}
		div.content_steps ul li {
			margin-bottom: 2px;
		}

	/* next/previous steps */
	#step_next_previous {
		margin-top: 20pt;
	}
		#step_next_previous a, #step_next_previous a:link, #step_next_previous a:visited {
			color: #252525;
			text-decoration: none;
		}
			#step_next_previous a:hover {
				color: #000;
			}

		#step_next_previous p {
			font-size: 10pt;
			font-weight: bold;
		}
			#step_next_previous p span {
				padding: 6px 10px;
				margin: 0 18px;

				background-color: #FFB400;
			}


/* ## Content, ORDER FOR FREE! */
#order_content {
	text-align: center;
}

	#order_money_wrapper {
		width: 557px;	height: 43px;

		margin: 0 auto;

		background-color: #FFC038;
	}
		#order_money_wrapper h1, #order_form_wrapper h3, h3.form_sent {
			padding-top: 10px;

			font: 10pt 'Verdana', sans-serif;
			font-weight: bold;
		}

		#order_money_wrapper select {
			margin-left: 17px;
		}

	#order_want_save {
		width: 640px;
		margin: 25px auto 0 auto;

		text-align: right;

		background: no-repeat url('../images/contents/order_ptaszek.gif') 0 3px;
	}
		#order_want_save h1 {
			/* reset from previous declaration */
			font-size: 29pt !important;
			margin: 0 !important; 
		}

	/* order form */
	#order_form_wrapper h3 {
		padding-top: 13px;
	}
	#order_form {
		width: 630px;
		margin: 53px auto 20px auto;

		/* bordeR: 1px solid red; */
	}
		#order_form table {
			float: left;

			/* border: 1px solid green; */
		}
			#order_form table td {
				vertical-align: top;
				padding-bottom: 16px;
			}

			#order_form table p {
				font: 10pt 'Verdana', sans-serif;
			}

		#order_form td.field {
			padding: 8px 22px;
			text-align: right;
		}
		#order_form td.value {
			padding-top: 1px;
			text-align: left;
		}
			#order_form td.value p {
				padding: 7px 0 0 10px;
			}
				#order_form td.value p span {
					margin-right: 58px;
				}

			#order_form td.value select {
				margin-top: 6px;
			}

		#order_form h2 {
			margin-top: 38px;
			font: 16pt 'Arial', sans-serif;
			line-height: 1.4em;
		}

		#order_form #order_files {
			margin: 28px 0 15px 0;
		}
			#order_files div.order_fileholder {
				margin-bottom: 7px;
			}

		#order_form h3#no_zips {
			line-height: 2.2em;
			margin-bottom: 5px;
		}

		#order_form p#guarantee {
			margin: 40px 0 0 0;
			font: 8pt 'Verdana', sans-serif;
		}
			p#guarantee a, p#guarantee a:link, p#guarantee a:visited {
				color: #252525;
				text-decoration: none;
			}
			p#guarantee a:hover {
				color: #000;
				text-decoration: underline;
			}
			

		/* form buttons */
		#order_form input#order_send_button, #contact_content input#email_send_button {
			margin-top: 24px;
			padding: 6px 10px;
			font: 10pt 'Verdana', sans-serif;
			font-weight: bold;

			background-color: #FFB400;
			border: none;

			cursor: pointer;
		}

		#order_form input#order_send_button {
			padding: 10px 16px;
		}

	/* form: sent */
	div#order_money_wrapper.form_sent {
		padding-top: 6px;
	}
	h1.form_sent {
		font-size: 29pt;
		margin: 20px 0 10px 0;
	}

/* ## Content, CONTACT */
#contact_content {
	padding-left: 11px;
	margin-top: 15px;
}
	#contact_content h1 {
		font: 23pt 'Arial', sans-serif;
		color: #252525;

		margin-bottom: 20px;
	}


	#contact_wrapper {
		margin: 0 auto;
		width: 880px;
	}

	#contact_form, #contact_data {
		float: left;
		text-align: left;

		/* border: 1px solid green; */
	}

	/* contact form */
	#contact_form {
		width: 380px;
	}
		#contact_form p {
			/* font: 13.3333px 'Verdana', sans-serif; */
			font: 10pt 'Verdana', sans-serif;
			margin: 6px 0 2px 8px;
		}
			#contact_form p.moreTop {
				margin-top: 15px;
			}
		#contact_form textarea {
			height: 290px;
		}

		#contact_form p#guarantee {
			margin-top: 5px;
			font: 8pt 'Verdana', sans-serif;
			line-height: 1.6em;

			text-align: center;
		}

		#contact_form div#contact_send_wrapper {
			text-align: right;
		}

		/* MessageBox */
		#contact_form div#MessageBox {
			margin-top: 26px;
			float: left;
		}
			#contact_form div#MessageBox p {
				font: 10pt 'Verdana', sans-serif;
				height: 16px;
				line-height: 16px;
			}

				#contact_form div#MessageBox p img {
					margin-right: 15px;
				}
	

	/* contact info */
	#contact_data {
		width: 425px;
		margin-left: 72px;
	}
		#contact_data h2, #contact_data p {
			font: 11pt 'Verdana', sans-serif;
			line-height: 1.7em;
			margin: 0 0 .7em 10px;
		}
		#contact_data h2 {
			font-weight: bold;
		}
			#contact_data h2 span {
				font-weight: normal;
			}
		#contact_data div#google_map {
			margin-top: 30px;
		}

/* ## Content, REFERENCE */
#reference_content {
	margin: 0 auto;
	padding-bottom: 80px;
	width: 922px;
}
	div.reference_wrapper {

	}
		div.reference_wrapper div.reference {
			float: left;

			text-align: left;

		}
			div.reference div.text {
				width: 610px;   height: 100px;
				background: no-repeat url('../images/layout/reference_background.gif');

			}

			/* hard reset */
			div.reference h1, div.reference h2, div.reference h3 {
				margin: 0;
				padding: 0;
			}

				div.reference h3 {

					padding: 12px 0 0 45px;
					font: 10pt 'Verdana', sans-serif;
					line-height: 1.8em;

				}

			div.reference div.signature {
				padding: 23px 0 0 45px;
			}
				div.reference h2, div.reference h1 {
					font: 11pt 'Verdana', sans-serif;
					font-weight: bold;
				}
				div.reference h2 {
					color: #252525;
					margin-bottom: 2px;
				}
				div.reference h1 {
					color: #FF9300;
				}


		div.reference_wrapper div.image {
			float: right;
		}
			div.reference_wrapper div.image a, div.reference_wrapper div.image a:link, div.reference_wrapper div.image a:visited {
				display: block;

				background-color: #E7E7E7;
				border: 1px solid #878787;

				padding: 3px 3px 0 3px;
			}

			div.reference_wrapper div.image a:hover { 
				background-color: #fff;
				border: 1px solid #FF9300;
			}
				div.reference_wrapper div.image img {
					margin: 0 !important;
					padding: 0 !important;
				}
/* ## Content, LINKS */
#content_links {
	width: 900px;
	margin: 0 auto;
	padding-top: 45px;

	font: 10pt 'Verdana', sans-serif;
}
	#content_links table {
		margin: 0 auto;
		text-align: left;
	}
		#content_links table td {
			padding: 0 40px;
		}
	#content_links ul li {
		font: 10pt 'Verdana', sans-serif;
		line-height: 1.2em;
		margin-bottom: 15px;
	}
		#content_links ul li a {
			font-size: 8pt;
		}
		#content_links a, #content_links a:link, #content_links a:visited, a.external, a:link.external, a:visited.external {
			color: #6B6F78;
		}
		#content_links a:hover, a:hover.external {
			color: #FF9300;
			text-decoration: none;
		}

	#content_links h4 {
		font-size: 11pt;
		font-weight: bold;
		margin-bottom: 20px;
	}


/*
 * ## Footer */
#footer {
	height: 70px;

	position: relative;

	color: #252525;
	font: 9pt 'Arial', sans-serif;
}
	#footer #footer_copy, #footer #footer_menu {
		position: absolute;
	}

	/* copyright */
	#footer #footer_copy {
		top: 6px;
		left: 45px;	/* TODO: do ustawienia */
	}
	#footer p {
		text-align: left;
		line-height: 1.85em;
	}
		#footer #footer_copy a, #footer #footer_copy a:link, #footer #footer_copy a:visited {
			text-decoration: none;
			color: #252525;
		}

	/* footer menu */
	#footer #footer_menu {
		top: 10px;
		right: 36px;

		
	}
		#footer #footer_menu a, #footer #footer_menu a:link, #footer #footer_menu a:visited {
			text-decoration: underline;
			color: #252525;

			margin: 0 9px;
		}
		#footer #footer_menu a:hover {
			text-decoration: none;
		}

		#footer #footer_menu a.selected {
			text-decoration: none !important;
			color: #EC8000 !important;
		}
