/* @override http://www.wolf-umwelttechnologie.de/sites/all/themes/wolf/einsparungsrechner/framework.css */

/* 
* www.einsparungsrechner.de - Framework.css
* © 2008 Wolf - Umwelttechnologie GmbH
* Developer Wolf
 */

/* All Around */
.Print {display:none;}
			
/* Form */
.FormRow, #RowEnergie {
	 display:block;
	 clear:both;
	 padding-top:20px;
	}

.FormRow h3, #RowEnergie h3 {
	float:left;
	margin:0;
	}

.FormRow img, #RowEnergie img {
	 float:left;
	 margin-top:4px;
	}
.FormElements {
	 width:880px;
	 float:right;
	}
	#Content .Element {
		 width:205px;
		 float:left;
		 margin:0 15px 0 0;
		 margin-bottom:10px;
		}
		
		* html #Content .Element {
			margin-right: 10px;
		}
		
	#Content .Element.Incorrect {
		color:#ff4242;
		}
	#Content .Element.Incorrect input {
		color:#c20000;
		font-weight:bold; 
		}
	#Content .Element label {
		 height:40px;
		 width:174px;
		 display:block;
		}
		#Content .Element input {
			display:block;
			width:120px;
			height:25px;
			color:#6e6e6e;
			text-align:left;
			padding:2px 54px 0 5px;
			background:url(images/InputBg.gif);
			-moz-border-radius:2px;
			border-radius:2px;
			-webkit-border-radius:2px;
			border:0;
			}
		#Content .RadioPosition input {
			 background:transparent !important;
			}
		#Content .Element input:focus {
			 color:#000;
			}
		input.euro {}
		input.liter {background-position:0 -56px;}
		input.min {background-position:0 -84px;}
		input.percent {background-position:0 -112px;}
		input.day {background-position:0 -28px;}
		
		select {
			 width:180px;
			 background:#F6F7FA;
			 margin-top:3px;
			 border:1px solid #E0E0E0;
			 color:#6E6E6E;
			}
	
	#Content .RadioPosition {
		margin:2px 0;
		 width:177px;
		 float:left;
		 cursor:pointer;
		 -moz-border-radius:2px;
		 border-radius:2px;
		 -webkit-border-radius:2px;
		 height:20px;
		 line-height:15px;
		 border:1px solid #ccc;
		 position:relative;
		}
		#Content .RadioPosition div {
			height:20px;
			position:relative;
		}
		#Content .RadioPosition label {
			 float:left;
			 margin:2px;
			 height:15px;
			 cursor:pointer;
			 width:145px;
			}
		#Content .RadioPosition input {
			 float:right;
			 cursor:pointer;
			 width:auto;
			 padding:0;
			 margin-top:-2px;
			}
			
	#Content .RadioPosition:hover, #Content .RadioPosition:hover div, #Content .RadioPosition.Active, #Content .RadioPosition.Active div {
		 border-color:#ccc;
		 background:#f1f1f1;
		 color:#192741;
		}
	
	#Content .SubmitButton {
		 width:173px;
		 height:32px;
		 float:left;
		 line-height:300px;
		 font-size:0;
		 margin-left:75px;
		 margin-top:20px;
		 overflow:hidden;
		 border:0;
		 cursor:pointer;
		 display:block;
		 background:url(images/ButtonSubmit.gif);
		}
	* html .SubmitButton {
		 margin-left:42px;
		}
	#Error {
		 float:left;
		 width:200px;
		 color:#999;
		 font-weight:normal;
		 margin:20px 0 0 50px;
		 display:none;
		}
		
/* EnergieChange */
.GasPay, .GasType, #InputGas, #InputOel {display:none;}

	#RowEnergie.Gas .GasPay {
		 display:block;
		}
	#RowEnergie.Gas.Volume .GasType{
		 display:block;
		 font-size:12px
		}
		
	#RowEnergie.Volume #InputkWh , #RowEnergie.Oel #InputkWh {display:none;}
	#RowEnergie.Volume #InputGas, #RowEnergie.Oel #InputOel {display:block;}
	
	#InputGas {
		position: relative;
	}
		
/* 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.jpg);
}
.Info:hover {
	 opacity:1;
	}
.Info p {
	 display:none;
	 position:absolute;
	 left:0;
	 top:-4px;
	 font-size:11px;	 
	 color:#666;
	 padding:0 10px;
	 margin:0;
	 width:164px;
	 background:url(images/InfoBoxBg.gif) no-repeat;
	}
	
	#Content .Info p a {
		
		padding:0;
		color:#192741;
		background-image:none;
		text-decoration:underline !important;
	}
	
	.Info p span.Top, .Info p span.Bottom {
		 background:url(images/InfoBoxTop.png);
		 height:9px;
		 width:184px;
		 left:-10px;
		 top:-9px;
		 display:block;
		 position:relative;
		}
	.Info p span.Bottom {
		 background:url(images/InfoBoxBottom.png);
		 top:auto;
		 bottom:-9px;
		}
	.Info strong {
		 color:#192741;
		 margin-top:-10px;
		 font-size:13px;
		 display:block;
		}
	.Info.Active {
		 opacity:1;
		 z-index:10;
		}
	.Info.Active p{
		 display:block;
		}
#Content .Element.Radio .Info {
	 margin-top:2px;
	}

/* Result */
#ColLeft, #ColRight {
	 float:left;
	 overflow:hidden;
	 width:49%;
	}
#ColRight {
	 float:right;
}

.Headline {
	 margin-bottom:3px;
	}
.ValuePoint {
	display:block;
	background:transparent;
	margin:0px 4px 4px 0;
	border:1px solid #ccc;
	 -moz-border-radius:2px;
	 -webkit-border-radius:2px;
	 border-radius:2px;
	position:relative;
}
.Result {background:#eee; border:1px solid #ccc; color:#464646;}
.Sum div div {background:#a4bf29; color:#fff;}
.Sum .Value {color:#192741 !important;}
.Sum b {color:#333 !important;}
.Sum div div {padding-left:5px !Important}
	.ValuePoint div {
		 position:relative;
		 
		}
	.ValuePoint div div{
		 top:auto;
		 position:static;
		 padding:4px 120px 4px 32px;
		}
	.ValuePoint .Number, .ValuePoint .InlineNumber {
		 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.png) no-repeat transparent;
	}
	
	* html .ValuePoint .Number {
		left: -25px;
		background:url(images/NumberBg.gif) no-repeat transparent !important;
	}
	
	* html .ValuePoint .InlineNumber {
		background:url(images/NumberBg.gif) no-repeat transparent !important;
	}
	
	
	*+html .ValuePoint .Number {top:1px !important;}
	
	.ValuePoint .InlineNumber {position:static; display:inline-block; left:auto; top:auto; float:none; }
		
		.ValuePoint.Result .Number { background:url(images/NumberBg.png); }
		
		
		* html .ValuePoint .Number {
			 top:4px;
			}
		*+html .ValuePoint .Number {
			 top:4px;
			}
		
	.ValuePoint .Value {
		 font-size:15px;
		 
		 font-weight:bold;
		 text-align:right;
		 display:block;
		 position:absolute;
		 right:8px;
		 top:4px;
		}
	
	
	.ValuePoint b {
		 font-weight:normal;
		 font-size:11px;
		 color:#464646;
		}

