/*
 *  Datei: vorteilsrechner_neu.css
 *  Funktion: steuert das Layout für den hkk Vorteilsrechner
 *  Author: Samuel Beck für neveling.net
 *  LC Date: 09.08.2010
 */
/*********************************************************************************** 
 * Formatierungen der Elemente fuer die startseite
 */	
div.centerVorteilsrechnerLink{
	text-align:center;
}
div.VorteilsrechnerLink{
	/*border: solid 1px #DE0615;*/
	background-color: #E5E4E0;
	width: 180px;
	padding: 5px 0;
	margin:5px auto;
	text-align:center;
}
div.VorteilsrechnerLink p{
	margin:0;
	padding:0;
	text-align:center;
}

/*********************************************************************************** 
 * Formatierungen der Elemente über der Bonusliste: 
 */	
.vorteilsrechnerHeader{
	margin:0 4px 0 4px;
	padding: 10px 0px 4px 0px;
	border-bottom:1px solid #DE0615;
	font-weight: bold;
	color: #DE0615;
}
.vorteilsrechnerSubHeader{
	margin:10px 4px 0px 4px;
	font-weight: bold;
}
.vorteilsrechnerInfo{
	margin:10px 4px 20px 4px;
}
#vorteilsrechnerErsparnisMaxDescript{
	float:left;
	width:95px;
	text-align: center;
	margin-left: 230px;
}
#vorteilsrechnerErsparnisAktuellDescript{
	float:right;
	width:50px;
	margin-right: 30px;
	text-align: center;
	font-weight: bold;
}
/*
 *  Beschriftung für die BonusListe
 */
#vorteilsrechnerDescript{
	height:30px;	
	clear: both;
	font-size:8pt; /*  FIX: verhindert, das die Tabelle beim verstellen der Schriftgroesse zerhackt wird */
}
/*********************************************************************************** 
 *Formatierung BonusListe (1-9)
 */
.vorteilsrechnerBonus{
	height:46px;
	margin-top:1px;
	border-top: 1px solid white;
	border-bottom: 1px solid white;
	/*border-right: 1px solid #E5E4E0;*/
	background-color: #E5E4E0;
	font-size:8pt; /* FIX: verhindert, das die Tabelle beim verstellen der Schriftgroesse zerhackt wird */
}

.vorteilsrechnerBonusReady{
	border-top: 1px solid #E5E4E0;
	border-bottom: 1px solid #E5E4E0;
	border-right: 1px solid #E5E4E0;
	background-color: white;
	background-image: url(/fileadmin/template/demo/img/haken.gif);
	background-position: 485px center;
	background-repeat: no-repeat;
}

.vorteilsrechnerBonusNum{
	width:18px;
	float:left;
	border-right: 1px solid white;
	background-color: #D9081E;
	color:white;
	line-height: 46px;
	text-align: center;
	font-weight: bold;
}
.vorteilsrechnerBonusHeadline{
	float:left;
	font-weight: bold;
	line-height: 46px;
	text-indent: 8px;
	width:220px;
}
.vorteilsrechnerBonusHeaddoubleline{
	float:left;
	font-weight: bold;
	margin-left: 8px;
	width: 212px;
	margin-top: 11px;
}
.vorteilsrechnerBonusHeadlineGesamt{
	float: left;
	line-height: 46px;
	text-indent: 26px;
	width: 222px;
	font-weight: bold;
}
.vorteilsrechnerErsparnisMax{
	float: left;
	width: 50px;
	line-height: 46px;
	text-align: right;
}
.vorteilsrechnerErsparnisMaxGesamt{
	float: left;
	width: 90px;
	line-height: 46px;
	text-align: left;
	font-weight: bold;
}
.vorteilsrechnerVorteilLink{
	float: left;
	width: 50px;
	margin-left: 42px;
	margin-top: 11px;
	color: #D9081E;
	cursor: pointer !important; 
}
.vorteilsrechnerVorteilLink:hover{
	float: left;
	width: 50px;
	margin-left: 42px;
	margin-top: 11px;
	color: #D9081E;
	cursor: pointer !important;
	text-decoration: underline;
}
.vorteilsrechnerVorteilLinkWrapper{
	width: 33px;
	float: right;
	cursor: pointer !important; 
}
.vorteilsrechnerErsparnisAktuell{
	float:right;
	margin-right: 30px;
	line-height: 46px;
	text-align: right;
	font-weight: bold;
}
/*********************************************************************************** 
 *  Resultat der Berechnungen (in grüner Box)
 */
.vorteilsrechnerErsparnisSumme{
	height: 56px;
	margin-top: 3px;
	margin-bottom: 3px;
	border: 1px solid #368A1A;
	clear: both;
	
}
.vorteilsrechnerErsparnisSumme #vorteilsrechnerResultatDesc{
	float: left;
	margin-left: 26px;
	margin-top: 10px;
}
.vorteilsrechnerErsparnisSumme #vorteilsrechnerResultatDesc h1{
	color: #368A1A;
	font-size: 125%;
}

.vorteilsrechnerErsparnisSumme #vorteilsrechnerResultatDesc h2{
	color: #368A1A;
	font-weight: normal;
	font-size:90%;
}
#vorteilsrechnerResultat{
	float: right;
	margin-right: 30px;
	line-height: 56px;
	text-align: right;
	font-weight: bold;
	font-size: 125%;
	color: #368A1A;
}
/***********************************************************************************
 *	Drucken Button 
 */
a.druckenButton,
a.druckenButton:hover {
	display:block;
	width:250px;
	padding: 0px 1px;
	margin: 20px 0 70px 255px;
	color:white;
	background-color: #D9081E;
	font-weight: bold;
	text-align:center;
	line-height: 16px;
	text-decoration:none;
	border-top: solid 2px #C0C0C0;
	border-left: solid 2px #C0C0C0;
	border-bottom: solid 2px #6B6C70;
	border-right: solid 2px #6B6C70;
}
a.druckenButton:active{
	text-decoration:none;
	border-top: solid 2px #6B6C70;
	border-left: solid 2px #6B6C70;
	border-bottom: solid 2px #C0C0C0;
	border-right: solid 2px #C0C0C0;
}
a.druckenButton img{
	margin-right:5px;
	margin-top:3px;
	margin-bottom:-1px;
}

/* ******************************************************************************
 * 	Formatierungen fuer Detail Pop-Ups
 */
#vorteilsrechnerDetail1Box,
#vorteilsrechnerDetail2Box,
#vorteilsrechnerDetail3Box,
#vorteilsrechnerDetail4Box,
#vorteilsrechnerDetail5Box,
#vorteilsrechnerDetail6Box,
#vorteilsrechnerDetail7Box,
#vorteilsrechnerDetail8Box,
#vorteilsrechnerDetail9Box{
	position: absolute;
	top: 0px;
	left: 0px;
	/*width: 100%;*/
	/*height:100%;*/
	text-align: center;
	/*padding-top: 100px;*/
	/*background-image: url("/fileadmin/template/demo/img/tr80b.png");*/

	

	
	background-repeat: repeat;
	background-attachment: scroll;
	z-index:1;
}
.vorteilsrechnerDetailBoxClose{
	position: absolute;
	top: 0px;
	left: 0px;
	/*width: 100%;*/
	z-index:-1;

	background-color:white;
	filter:alpha(opacity=80); /* IE */
	opacity:0.8; /* allgemein */
	-moz-opacity:0.8; /* Mozilla */
	-khtml-opacity:0.8; /* KTHML */
	-opera-opacity:0.8; /* Opera */
}
#vorteilsrechnerDetail1,
#vorteilsrechnerDetail2,
#vorteilsrechnerDetail3,
#vorteilsrechnerDetail4,
#vorteilsrechnerDetail5,
#vorteilsrechnerDetail6,
#vorteilsrechnerDetail7,
#vorteilsrechnerDetail8,
#vorteilsrechnerDetail9{
	border: solid 1px #BFBFBD;
	padding:12px;
	margin: 0 auto;
	background-color: white;
	z-index:2;
}
#vorteilsrechnerDetail1{width: 441px;}
#vorteilsrechnerDetail2{width: 577px;}
#vorteilsrechnerDetail3{width: 640px;}
#vorteilsrechnerDetail4{width: 400px;}
#vorteilsrechnerDetail5{width: 600px;}
#vorteilsrechnerDetail6{width: 441px;}
#vorteilsrechnerDetail7{width: 520px;}
#vorteilsrechnerDetail8{width: 441px;}
#vorteilsrechnerDetail9{width: 660px;}

#vorteilsrechnerDetail1 .vorteilsrechnerHeader,
#vorteilsrechnerDetail2 .vorteilsrechnerHeader,
#vorteilsrechnerDetail3 .vorteilsrechnerHeader,
#vorteilsrechnerDetail4 .vorteilsrechnerHeader,
#vorteilsrechnerDetail5 .vorteilsrechnerHeader,
#vorteilsrechnerDetail6 .vorteilsrechnerHeader,
#vorteilsrechnerDetail7 .vorteilsrechnerHeader,
#vorteilsrechnerDetail8 .vorteilsrechnerHeader,
#vorteilsrechnerDetail9 .vorteilsrechnerHeader{
	margin-top:22px;
}
#vorteilsrechnerDetail3 .vorteilsrechnerHeader,
#vorteilsrechnerDetail4 .vorteilsrechnerHeader,
#vorteilsrechnerDetail5 .vorteilsrechnerHeader,
#vorteilsrechnerDetail6 .vorteilsrechnerHeader,
#vorteilsrechnerDetail7 .vorteilsrechnerHeader,
#vorteilsrechnerDetail8 .vorteilsrechnerHeader,
#vorteilsrechnerDetail9 .vorteilsrechnerHeader{
	margin-bottom:10px;
}
#vorteilsrechnerDetail1 .vorteilsrechnerDetailSubHeader{
	color:#D9081E;
	font-weight: bold;
	clear:both;
	padding-top: 15px;
}
#vorteilsrechnerDetail2 .vorteilsrechnerDetailSubHeader,
#vorteilsrechnerDetail3 .vorteilsrechnerDetailSubHeader,
#vorteilsrechnerDetail8 .vorteilsrechnerDetailSubHeader{
	color:#D9081E;
	font-weight: bold;
	padding-top: 15px;
	padding-bottom: 10px;
}
.vorteilsrechnerDetailText{
	margin-bottom: 18px;
}
#vorteilsrechnerDetail3 .vorteilsrechnerDetailText,
#vorteilsrechnerDetail4 .vorteilsrechnerDetailText,
#vorteilsrechnerDetail5 .vorteilsrechnerDetailText,
#vorteilsrechnerDetail6 .vorteilsrechnerDetailText,
#vorteilsrechnerDetail7 .vorteilsrechnerDetailText,
#vorteilsrechnerDetail8 .vorteilsrechnerDetailText,
#vorteilsrechnerDetail9 .vorteilsrechnerDetailText{
	margin-top: 10px;
	margin-bottom: 15px;
}
.vorteilsrechnerDetailEingabe{
	width: 314px;
	height: 32px;
	line-height: 32px;
	background-color: #E5E4E0; 
	font-weight: bold;
	padding-left:3px;
	margin-bottom: 18px;
}
.vorteilsrechnerDetailEingabe #monatlicherZusatzbeitrag{
	height: 15px;
	line-height: 20px;
	text-align:right;
}
#vorteilsrechnerDetail2 .vorteilsrechnerDetailAusgabe{
	width: 314px;
	height: 32px;
	color: #369215; /* gruen */
	font-weight: bold;
	text-align: center;
	border: 1px solid #369215;
	padding-top: 3px;
	margin-bottom: 18px;
}
#vorteilsrechnerDetail3 .vorteilsrechnerDetailAusgabe,
#vorteilsrechnerDetail4 .vorteilsrechnerDetailAusgabe,
#vorteilsrechnerDetail5 .vorteilsrechnerDetailAusgabe,
#vorteilsrechnerDetail6 .vorteilsrechnerDetailAusgabe,
#vorteilsrechnerDetail7 .vorteilsrechnerDetailAusgabe,
#vorteilsrechnerDetail8 .vorteilsrechnerDetailAusgabe,
#vorteilsrechnerDetail9 .vorteilsrechnerDetailAusgabe{
	/*height: 32px;*/
	/*line-height: 32px;*/
	padding:10px;
	color: #369215; /* gruen */
	font-weight: bold;
	text-align: center;
	border: 1px solid #369215;
	margin-top: 15px;
	margin-bottom: 18px;
}
#vorteilsrechnerDetail3Warnung,
#vorteilsrechnerDetail4Warnung,
#vorteilsrechnerDetail9Warnung{
	display:none;
	/*height: 32px;*/
	/*line-height: 32px;*/
	padding:10px;
	font-weight: bold;
	text-align: center;
	color: #D9081E; /* rot */
	border: 1px solid #D9081E;
	margin-top: 15px;
	margin-bottom: 18px;
}
/*
 * zum verstecken der Detailboxen: (via js)
 */
.hiddenDetail{
	display: none;
}

/*
 * Grafiken für Detail Pop-Ups:
 */
#vorteilsrechnerDetail1 .KuhGrafik{
	border: solid 1px #e5e4e0; 
	float: right;
	margin-top:12px;
	margin-right:4px;
}
#vorteilsrechnerDetail2 .KuhGrafik{
	border: solid 1px #e5e4e0; 
	float: right;
	margin-top:12px;
	margin-right:4px;
	margin-left:15px;
}
#bild60eurWimpel{
	float:left;
	padding-top:24px;
	margin-top:12px;
}
/***********************************************************************************
 * Links für Detail Pop-Ups:
 */
a.closeWindowButton,
a.closeWindowButton:hover{
	display:block;
	width: 130px;
	padding: 1px 0;
	margin-top: 10px;
	color:white;
	background-color: #DE0615;
	font-weight: bold;
	text-align:center;
	text-decoration: none;
	border-top: solid 2px #C0C0C0;
	border-left: solid 2px #C0C0C0;
	border-bottom: solid 2px #6B6C70;
	border-right: solid 2px #6B6C70;
}
a.closeWindowButton:active{
	text-decoration: none;
	border-top: solid 2px #6B6C70;
	border-left: solid 2px #6B6C70;
	border-bottom: solid 2px #C0C0C0;
	border-right: solid 2px #C0C0C0;
}
a.closeSaveWindowButton,
a.closeSaveWindowButton:hover{
	display:block;
	width: 295px;
	padding: 1px 0;
	margin-top: 10px;
	color:white;
	background-color: #DE0615;
	font-weight: bold;
	text-align:center;
	text-decoration: none;
	border-top: solid 2px #C0C0C0;
	border-left: solid 2px #C0C0C0;
	border-bottom: solid 2px #6B6C70;
	border-right: solid 2px #6B6C70;
}
a.closeSaveWindowButton:active{
	text-decoration: none;
	border-top: solid 2px #6B6C70;
	border-left: solid 2px #6B6C70;
	border-bottom: solid 2px #C0C0C0;
	border-right: solid 2px #C0C0C0;
}
a.closeWindowX{
	float:right;
	background-image: url("/fileadmin/template/demo/img/ico_fensterschliessen.gif");
	background-position: right;
	background-repeat: no-repeat;
	display: inline;
	padding-right: 20px;
}
.jetztWechselnLink{
	float:right;
	margin-right:92px;
	margin-top:-35px;
}
/*********************************************************************************** 
 * Tabelenformatierungen fuer Detail 3 + 4 + 7 + 9: 
 */
#vorteilsrechnerDetail3 .vorteilsrechnerDetailTabelleTop,
#vorteilsrechnerDetail4 .vorteilsrechnerDetailTabelleTop,
#vorteilsrechnerDetail7 .vorteilsrechnerDetailTabelleTop,
#vorteilsrechnerDetail9 .vorteilsrechnerDetailTabelleTop{
	background-color: #E5E4E0;
	padding-left: 10px;
	padding-bottom:10px;
	font-size:8pt; /* FIX: verhindert, dass die Tabelle beim verstellen der Schriftgroesse zerhackt wird */
}
.selcetErwachsener1,
.selcetErwachsener2{
	display: block;
	float: left;
	width: 150px;
}
.DescBonuspunkte{
	display: block;
	float: left;
	width: 80px;
	margin-left: 220px;
	padding-bottom:5px;
	padding-top:5px;
}
.DescHandlungsfelder, .DescMann, .DescFrau, .DescKind1, .DescKind2, .DescKind3, .DescTarifstufe, .DescJahreseinkommen, .DescSelbstbehalt, .DescAuswahl, .DescPreisvorteil, .DescPraemie{
	display: block;
	float: left;
	width: 42px;
	text-align: center;
	padding-bottom:5px;
	padding-top:5px;
}
.DescHaeufigkeit{
	display: block;
	float:left;
	width: 62px;
	margin-left: 10px;
	padding-bottom:5px;
	padding-top:5px;
}
#vorteilsrechnerDetail3 .vorteilsrechnerDetailTabellenzeile,
#vorteilsrechnerDetail4 .vorteilsrechnerDetailTabellenzeile,
#vorteilsrechnerDetail7 .vorteilsrechnerDetailTabellenzeile,
#vorteilsrechnerDetail9 .vorteilsrechnerDetailTabellenzeile{
	clear:both;
	background-color:  #E5E4E0;
	/*border-top: 1px solid white;*/
	background-image: url(/fileadmin/template/demo/img/ws1px.png);
	background-position:top;
	background-repeat:repeat-x;
	height: 21px;
	line-height: 20px;
	padding-left: 10px;
	font-size:8pt; /* FIX: verhindert, das die Tabelle beim verstellen der Schriftgroesse zerhackt wird */
}
#vorteilsrechnerDetail3 .vorteilsrechnerDetailTabellenzeileDouble{
	clear:both;
	background-color:  #E5E4E0;
	/*border-top: 1px solid white;*/
	background-image: url(/fileadmin/template/demo/img/ws1px.png);
	background-position:top;
	background-repeat:repeat-x;
	height: 42px;
	line-height: 20px;
	padding-left: 10px;
	font-size:8pt; /* FIX: verhindert, das die Tabelle beim verstellen der Schriftgroesse zerhackt wird */
}
#vorteilsrechnerDetail3 .TabelleDesc, 
#vorteilsrechnerDetail4 .TabelleDesc, 
#vorteilsrechnerDetail4 .DescHandlungsfelder{
	display: block;
	float: left;
	width: 250px;
	text-align:left;
}
#vorteilsrechnerDetail7 .TabelleDesc, 
#vorteilsrechnerDetail7 .DescTarifstufe{
	display: block;
	float: left;
	width: 140px;
	text-align:left;
}
#vorteilsrechnerDetail9 .TabelleDesc{
	display: block;
	float: left;
	width: 270px;
	text-align:left;
}
#vorteilsrechnerDetail9 .TabellePreisvorteil{
	display: block;
	float: left;
	width: 80px;
	text-align:left;
	text-align:right;
	margin-right:15px;
}
#vorteilsrechnerDetail9 .DescPreisvorteil{
	display: block;
	float: left;
	width: 80px;
	text-align:left;
	margin-left:330px;
	margin-right:15px;
}
#vorteilsrechnerDetail9 .TabelleMehr, 
#vorteilsrechnerDetail9 .DescMehr{
	display: block;
	float: left;
	width: 60px;
	text-align:left;
}
#vorteilsrechnerDetail7 .DescJahreseinkommen,
#vorteilsrechnerDetail7 .TabelleJahreseinkommen{
	display: block;
	float: left;
	width: 150px;
	text-align:left;
}
#vorteilsrechnerDetail7 .DescPraemie,
#vorteilsrechnerDetail7 .TabZellePraemie{
	display: block;
	float: left;
	width: 50px;
	text-align:right;
}
#vorteilsrechnerDetail7 .DescSelbstbehalt,
#vorteilsrechnerDetail7 .TabZelleSelbstbehalt{
	display: block;
	float: left;
	width: 85px;
	text-align:right;
}
#vorteilsrechnerDetail7 .DescAuswahl,
#vorteilsrechnerDetail7 .TabZelleAuswahl{
	display: block;
	float: right;
	text-align:center;
	width: 80px;
}

#vorteilsrechnerDetail3 .TabelleBonuspunkte{
	display: block;
	float:left;
	width: 50px;
}
#vorteilsrechnerDetail3 .TabelleHaeufigkeit{
	padding-left:10px;
}
#vorteilsrechnerDetail3 .TabZelleMann, #vorteilsrechnerDetail4 .TabZelleMann, #vorteilsrechnerDetail9 .TabZelleMann,
#vorteilsrechnerDetail3 .TabZelleFrau, #vorteilsrechnerDetail4 .TabZelleFrau, #vorteilsrechnerDetail9 .TabZelleFrau,
#vorteilsrechnerDetail3 .TabZelleKind1, #vorteilsrechnerDetail9 .TabZelleKind1,
#vorteilsrechnerDetail3 .TabZelleKind2, #vorteilsrechnerDetail9 .TabZelleKind2,
#vorteilsrechnerDetail3 .TabZelleKind3, #vorteilsrechnerDetail9 .TabZelleKind3{
	display: block;
	float:left;
	width: 42px;
	height:21px;
	text-align: center;
}
#vorteilsrechnerDetail3 .vorteilsrechnerDetailTabellenzeileDouble .TabZelleMann, 
#vorteilsrechnerDetail3 .vorteilsrechnerDetailTabellenzeileDouble .TabZelleFrau,
#vorteilsrechnerDetail3 .vorteilsrechnerDetailTabellenzeileDouble .TabZelleKind1, 
#vorteilsrechnerDetail3 .vorteilsrechnerDetailTabellenzeileDouble .TabZelleKind2,
#vorteilsrechnerDetail3 .vorteilsrechnerDetailTabellenzeileDouble .TabZelleKind3{
	display: block;
	float:left;
	width: 42px;
	height:42px;
	text-align: center;
}
#vorteilsrechnerDetail3 .TabZelleMannActive, #vorteilsrechnerDetail4 .TabZelleMannActive, #vorteilsrechnerDetail9 .TabZelleMannActive,
#vorteilsrechnerDetail3 .TabZelleFrauActive, #vorteilsrechnerDetail4 .TabZelleFrauActive, #vorteilsrechnerDetail9 .TabZelleFrauActive,
#vorteilsrechnerDetail3 .TabZelleKind1Active,#vorteilsrechnerDetail9 .TabZelleKind1Active,
#vorteilsrechnerDetail3 .TabZelleKind2Active, #vorteilsrechnerDetail9 .TabZelleKind2Active,
#vorteilsrechnerDetail3 .TabZelleKind3Active, #vorteilsrechnerDetail9 .TabZelleKind3Active{
	background-color: #CFCECA; /*dunkel grau*/
	background-image: url(/fileadmin/template/demo/img/ws1px.png);
	background-position:top;
	background-repeat:repeat-x;
}
#vorteilsrechnerDetail3 .DescMannActive, #vorteilsrechnerDetail4 .DescMannActive, #vorteilsrechnerDetail9 .DescMannActive,
#vorteilsrechnerDetail3 .DescFrauActive, #vorteilsrechnerDetail4 .DescFrauActive, #vorteilsrechnerDetail9 .DescFrauActive,
#vorteilsrechnerDetail3 .DescKind1Active, #vorteilsrechnerDetail9 .DescKind1Active, 
#vorteilsrechnerDetail3 .DescKind2Active, #vorteilsrechnerDetail9 .DescKind2Active,
#vorteilsrechnerDetail3 .DescKind3Active, #vorteilsrechnerDetail9 .DescKind3Active{
	background-color: #CFCECA; /*dunkel grau*/
}
#vorteilsrechnerDetail5 .vorteilsrechnerKooperationpartnerWahl{
	padding:20px 10px 0 20px;
	background-color:  #E5E4E0; /*grau*/
}
#vorteilsrechnerCityWahl, #vorteilsrechnerStudioWahl{
	text-align:right;
}
#vorteilsrechnerDetail5 .vorteilsrechnerLabel{
	display:inline;
	text-align:right;
	float:left;
	padding-top:4px;
}
#vorteilsrechnerCityWahl .vorteilsrechnerLabel{
	display:inline;
	text-align:right;
	float:left;
}
#vorteilsrechnerStudioWahl .vorteilsrechnerLabel{
	display:inline;
	text-align:right;
	float:left;
}
#vorteilsrechnerDetail5 .vorteilsrechnerSelectField{
	width:480px;
	margin-bottom:20px;
	display:inline;
}