/* 
* www.einsparungsrechner.de - Framework.css
* © 2008 Wolf - Umwelttechnologie GmbH
* Developer Sebastian < sebastian@kuse.de >
 */

/* All Around */
body {
	 font-family:"Trebuchet MS", Arial, Verdana;
	 font-size:13px;
	 color:#99a;
	}

.Print {display:block !important; }
/* Framework */

	#TopBar {clear:both; height:90px;}
	#TopBar img { display:none;}
	#BottomBar {display:none;}
	#ContentPosition {
		 height:100%;
		 width:100%;
		 overflow:visible;
		}
		#BgTopLeft, #BgTopRight, #BgBottomRight, #BgBottomLeft {display:none;}
		#Content {
			 width:auto;
			 height:auto !important;
			 position:relative;
			}
			
/* Form */
.FormRow, #RowEnergie {
	 display:block;
	 clear:both;
	 padding-top:20px;
	}
.FormRow img, #RowEnergie img {
	 float:left;
	 margin-top:4px;
	}
.FormElements {
	 width:900px;
	 float:right;
	}
	.Element {
		 width:205px;
		 float:left;
		 margin:0 15px 0 0;
		 margin-bottom:10px;
		}
	.Element.Incorrect {
		color:#c20000;
		}
	.Element.Incorrect input {
		color:#c20000;
		font-weight:bold; 
		}
	.Element label {
		 height:40px;
		 width:174px;
		 display:block;
		}
		.Element input {
			display:block;
			width:120px;
			height:21px;
			color:#6e6e6e;
			text-align:left;
			padding:6px 54px 0 5px;
			background:url(images/InputBg.gif);
			border:0;
			}
		.Element input:focus {
			 color:#000;
			}
		input.euro {}
		input.liter {background-position:0 -56px;}
		input.min {background-position:0 -84px;}
		input.day {background-position:0 -28px;}
		
		select {
			 width:180px;
			 background:#F6F7FA;
			 margin-top:3px;
			 border:1px solid #E0E0E0;
			 color:#6E6E6E;
			}
	
	.RadioPosition {
		margin:2px 0;
		 width:177px;
		 float:left;
		 cursor:pointer;
		 height:20px;
		 line-height:15px;
		 border:1px solid #fff;
		 border-width:0 1px;
		 position:relative;
		}
		.RadioPosition div {
			border:1px solid #fff;
			border-width:1px 0;
			height:20px;
			position:relative;
			top:-1px;
		}
		.RadioPosition label {
			 float:left;
			 margin:2px;
			 cursor:pointer;
			 width:145px;
			}
		.RadioPosition input {
			 float:right;
			 cursor:pointer;
			 width:20px;
			 margin-top:-0px;
			}
	.RadioPosition:hover, .RadioPosition:hover div, .RadioPosition.Active, .RadioPosition.Active div {
		 border-color:#ccc;
		}
	
	.SubmitButton {
		 width:135px;
		 height:48px;
		 float:left;
		 line-height:300px;
		 font-size:0;
		 margin-left:84px;
		 overflow:hidden;
		 border:0;
		 cursor:pointer;
		 display:block;
		 background:url(images/ButtonSubmit.gif);
		}
	#Error {
		 float:left;
		 width:200px;
		 color:#999;
		 font-weight:normal;
		 margin-left:50px;
		 display:none;
		}
		
/* EnergieChange */
.GasPay, .GasType, #InputGas, #InputOel {display:none;}

	#RowEnergie.Gas .GasPay {
		 display:block;
		}
	#RowEnergie.Gas.Volume .GasType{
		 display:block;
		}
		
	#RowEnergie.Volume #InputkWh , #RowEnergie.Oel #InputkWh {display:none;}
	#RowEnergie.Volume #InputGas, #RowEnergie.Oel #InputOel {display:block;}
		
/* Info */
.Info {
	 display:block;
	 float:right;
	 margin:5px 0 0 0;
	 cursor:pointer;
	 width:19px;
	 position:relative;
	 height:19px;
	 opacity:0.5;
	 background:url(images/InfoButton.gif);
}
.Info:hover {
	 opacity:1;
	}
.Info p {
	 display:none;
	 position:absolute;
	 left:0;
	 top:-4px;
	 font-size:11px;	 color:#666;
	 padding:0 10px;
	 width:164px;
	 background:url(images/InfoBoxBg.gif) repeat-x;
	}
	.Info p span.Top, .Info p span.Bottom {
		 background:url(images/InfoBoxTop.gif);
		 height:9px;
		 width:184px;
		 left:-10px;
		 top:-9px;
		 display:block;
		 position:relative;
		}
	.Info p span.Bottom {
		 background:url(images/InfoBoxBottom.gif);
		 top:auto;
		 bottom:-9px;
		}
	.Info strong {
		 color:#003c81;
		 margin-top:-10px;
		 font-size:13px;
		 display:block;
		}
	.Info.Active {
		 opacity:1;
		 z-index:10;
		}
	.Info.Active p{
		 display:block;
		}
.Element.Radio .Info {
	 margin-top:2px;
	}

/* Result */
#ColLeft, #ColRight {
	 float:none;
	 overflow:visible;
	 width:auto;
	 margin-left:38px;
	 margin-top:20px;
	 height:auto;
	}

.ValuePoint {
	border:1px solid #ccc;
	border-width:0 1px;
	display:block;
	background:#fff;
	margin:4px 4px 4px 0;
	color:#003C81;
	position:relative;
}
.Result {background:#f6f6f6;}
.Sum {background:#003C81; color:#fff;}
.Sum .Value {color:#fff !important;}
.Sum b {color:#aaa !important;}
.Sum div div {padding-left:5px !Important}
	.ValuePoint div {
		 top:-1px;
		 position:relative;
		 border-top:1px solid #ccc;
		}
	.ValuePoint div div{
		 bottom:-2px;
		 top:auto;
		 padding:4px 4px 4px 32px;
		 border-top:0;
		 border-bottom:1px solid #ccc;
		}
	.ValuePoint .Number {
		 width:20px;
		 font-size:11px;
		 height:20px;
		 position:absolute;
		 left:4px;
		 top:2px;
		 text-align:center;
		 line-height:20px;
		 float:left;
		 background:url(images/NumberBg.gif);
		}	.ValuePoint.Result .Number {		 background:url(images/NumberBgResult.gif);		}
	.ValuePoint .Value {
		 font-size:15px;
		 color:#003c81;
		 font-weight:bold;
		 text-align:right;
		 width:100px;
		 display:block;
		 float:right;
		}
	.ValuePoint b {
		 font-weight:normal;
		 color:#666;
		 font-size:11px;
		}