/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */

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%; }
	
body	{ }
ol, ul  { list-style: none; }

/* remember to define focus styles! */
:focus  { outline: 0; }

/* tables still need 'cellspacing="0"' in the markup */
table 	{ /* border-collapse: collapse; border-spacing: 0; */ }


/*---------------------------------------------- 
				F A R B E N

font blau:			#000000;
font rot:			#d30014;
font grau:			#6d6d6d;

background menu:	#ececec;

------------------------------------------------*/


/*---------------------------------------------- 
				A L L G E M E I N
------------------------------------------------*/

body {
	background: #ffffff url(bg.jpg)  repeat-x; 
	font-family: Arial, Helvetica, Verdana, sans-serif; font-size: 12px; line-height: 17px; color: #6d6d6d; 
	}

#container {
	width: 840px;
	margin: 0 auto;
	background-color: #fff;
	margin-top: 70px;
	position: relative;}
	
#top {
	}
	
#top .heap_logo {
	position: absolute;
	top: -70px;
	left: 15px;
	}
	
#top .langnav {
	position: absolute;
	top: 14px;
	right: 200px;
	}
	
.langnav a { font-size: 11px; text-decoration: none; color: #6d6d6d; }
.langnav a:hover { text-decoration: underline; }

#top .total_logo {
	position: absolute;
	top: -70px;
	right: 0px;
	}

#header {
	padding: 44px 15px 0 15px; }
	
#main { margin-top: 15px;
		overflow: hidden;
		height: 100%;
		position: relative;}	
	
#col1 {
	width: 220px;
	float: left;
	padding-left: 15px;}
	
#col2 {
	float: left;
	width: 540px; 
	padding-left: 50px;
	padding-bottom: 10px;}
	
#bottom {
	background-color: #eaeaeb;
	padding: 10px 0;
	position: relative;   	/* Damit wir einem z-index geben können / sonst werden die "schattenbilder" vor diesem div angezeigt */
	z-index:2;}				
	

/* --------------------- container --------------------- */
#container .shadow_left {
	position: absolute;
	top: 186px;
	left: -30px; /* breite des bildes */
	z-index: 1;
	}

#container .shadow_right {
	position: absolute;
	top: 186px;
	right: -30px;/* breite des bildes */
	z-index: 1;
	}
	
	
	
/* --------------------- COL1 --------------------- */
#adresse {
	margin: 0 0 10px 0;
	padding-left: 15px;
	font-size: 11px;
	}
	
#adresse a.email { color: #d30014; text-decoration: none;}
#adresse a.email:hover { text-decoration: underline;}
	
.img_col1 { margin: 25px 0 0 15px;}

.button_leftcol {
	margin: 0px 0 10px 0;
	}



/* --------------------- BOTTOM --------------------- */
#bottom_inhalt {
	width: 840px;
	margin: 0 auto;
	text-align:center; font-size: 11px;}
	
#bottom img {
	margin-right: 15px;	}
	
#bottom a {color:#6d6d6d; text-decoration: none;}
#bottom a:hover {color:#d30014;}
	
#bottom a.email {color:#d30014; text-decoration:none;}
#bottom a.email:hover {color:#d30014; text-decoration:underline;}
	

/* --------------------- NAV 1st level --------------------- */

#nav { background-color: #ececec; padding-bottom: 10px; margin-bottom: 10px; }

ul.nav1st {}
	
ul.nav1st li {
	line-height: 25px;
	background: url(border_nav.jpg) bottom left no-repeat;
	width: 200px;
	margin-left: 15px; }

ul.nav1st a, ul.nav1st a:link {
	margin-bottom:0px;
	font-size: 14px; text-decoration: none; color:#6d6d6d;line-height: 28px; font-weight: bold;
	display:block; }

ul.nav1st a:hover {	color:#d30014;  }
ul.nav1st li a.current, ul.nav1st li a.current:link { color:#d30014;  }


/* --------------------- NAV 2nd level --------------------- */

ul.nav2nd {}

ul.nav2nd li {
	line-height: 21px;
	background: none;
	width: 180px;
	margin-left: 25px; }

ul.nav2nd a, ul.nav2nd a:link {
	margin-bottom:0px;
	font-size: 12px; text-decoration: none; color:#6d6d6d;line-height: 22px; font-weight: bold;
	display:block; }

ul.nav2nd a:hover {	color:#000000;  }
ul.nav2nd li a.current, ul.nav2nd li a.current:link { color:#000000;  }



/* --------------------- NAV 3rd level --------------------- */

ul.nav3rd {}

ul.nav3rd li {
	line-height: 19px;
	background: none;
	width: 165px;
	margin-left: 40px; }

ul.nav3rd a, ul.nav3rd a:link {
	margin-bottom:0px;
	font-size: 12px; text-decoration: none; color:#6d6d6d;line-height: 22px;
	display:block; }

ul.nav3rd a:hover {	color:#d30014;  }
ul.nav3rd li a.current, ul.nav3rd li a.current:link { color:#d30014;  }




/* - - - - - - - - mod 18 - Bread Crumb Navigation - - - - - - - - - - */

.breadcrumbnav, #bread {
font-size: 11px; color: #6d6d6d;
/* border: 1px solid #000; */
margin-bottom: 10px;}

.breadcrumbnav a:link, #bread a:link 		{ color: #d30014; text-decoration: none; }
.breadcrumbnav a:visited, #bread a:visited 	{ color: #d30014; text-decoration: none; }
.breadcrumbnav a:active, #bread a:active 	{ color: #d30014; text-decoration: underline; }
.breadcrumbnav a:hover, #bread a:hover 		{ color: #d30014; text-decoration: underline; }




/*  - - - - - - - -   rex4mod1 - Artikel schreiben - - - - - - - - - - */

div.rex4mod1 {
 	font-size: 12px; 
	margin-bottom: 10px; 
	overflow:hidden; 	/* damit die floats gecleared werden - nicht entfernen */
	height:100%;		/* IE6 overflow:hidden hack - nicht entfernen  */}  

div.rex4mod1_date { display:none; }

div.rex4mod1_title {
	font-family: Arial, Helvetica, Verdana, sans-serif; 
	font-size: 30px; color: #000000; line-height:35px; font-weight: bold;
	margin-bottom: 15px; }

div.rex4mod1_editor {
 	font-size: 12px;
	margin-bottom: 10px; }
	
div.rex4mod1_editor p {
 	margin-top: 3px; }

div.rex4mod1_editor h1 {
	font-family: Arial, Helvetica, Verdana, sans-serif;
	font-size: 18px; color: #d30014; line-height:25px;	margin-top: 10px; margin-bottom: 3px; }

div.rex4mod1_editor h2 {
	font-family: Arial, Helvetica, Verdana, sans-serif;
	font-size: 15px; line-height:20px;	
	margin-top: 10px; }
	
div.rex4mod1_editor h3 {
	font-family: Arial, Helvetica, Verdana, sans-serif;
	font-size: 13px; line-height:20px;	font-weight: bold;
	margin-top: 10px; }

div.rex4mod1_editor ul {
	list-style: disc;
	margin-left:30px; margin-top:5px; margin-bottom:5px; }

div.rex4mod1_editor ol {
	margin-left:30px; margin-top:5px; margin-bottom:5px;
	list-style-type: decimal; } 
	
div.rex4mod1_editor a:link 		{ color: #d30014; text-decoration: none; }
div.rex4mod1_editor a:visited	{ color: #d30014; text-decoration: none; }
div.rex4mod1_editor a:active 	{ color: #d30014; text-decoration: underline; }
div.rex4mod1_editor a:hover 	{ color: #d30014; text-decoration: underline; }

div.rex4mod1_editor table {
	width:500px; } 

div.rex4mod1_editor td {
	background-color: #eeeeee;
	padding-left:5px; padding-right:5px; } 
	
div.rex4mod1_editor thead td {
	background-color: #5a6571; color:#fff;
	padding-left:5px; padding-right:5px; }
	
	



/*  - - - - - - - -   rex4mod - 7 - Sitemap  - - - - - - - - - - */

/* Allgemein */

.wglLinkTree             				{ margin:0; }
.wglLinkTree *                  		{ margin:0;padding:0 }
.wglLinkTree ul                     	{ list-style-type:none; }
.wglLinkTree li                 		{ list-style:none; }

/* - - - - Sitemap Level 1 - - - - */

.wglLinkTree .navLevel1 { 
	/* border: 1px dotted #5a6571;  */
	margin:0px 0; 
	font-size:14px; line-height:30px; }

.wglLinkTree .navLevel1 a       		{ color: #d30014; font-weight:bold; text-decoration: none;}
.wglLinkTree .navLevel1 a:hover    		{ color: #d30014; font-weight:bold; text-decoration: underline;}


/* - - - - Sitemap Level 2 - - - - */

.wglLinkTree .navLevel2 {
	margin-left:25px; padding-left:15px; 
	font-size:12px; line-height:18px;
	background-image: url(line.gif); background-repeat: no-repeat; background-position: left center; }

.wglLinkTree .navLevel2 a        		{ color: #000000; font-weight:bold; text-decoration: none;}
.wglLinkTree .navLevel2 a:hover			{ color: #000000; font-weight:bold; text-decoration: underline;}


/* - - - - Sitemap Level 3 - - - - */

.wglLinkTree .navLevel3 { 
	margin-left:25px; padding-left:40px; 
	font-size:12px; line-height:18px;
	background-image: url(line2.gif); background-repeat: no-repeat; background-position: left center; }
	
.wglLinkTree .navLevel3 a          		{ color: #6d6d6d; font-weight:bold; text-decoration: none;}
.wglLinkTree .navLevel3 a:hover      	{ color: #6d6d6d; font-weight:bold; text-decoration: underline;}


/* - - - - Sitemap Level 4 - - - - */

.wglLinkTree .navLevel4 { 
	margin-left:25px; padding-left:65px; 
	font-size:12px; line-height:18px;
	background-image: url(line3.gif); background-repeat: no-repeat; background-position: left center; }

.wglLinkTree .navLevel4 a           	{ color: #6d6d6d; font-weight:normal; text-decoration: none;}
.wglLinkTree .navLevel4 a:hover       	{ color: #6d6d6d; font-weight:normal; text-decoration: underline;}






/*  - - - - - - - -   mod09 - Dokumente bereitstellen - - - - - - - - - - */

div.dokumentedownload {
	font-size:12px; color:#748891; text-align: left; line-height:17px;
	border-top: 1px dotted #000000;
	/* border-bottom: 1px dotted #000000;*/
	padding: 5px 10px 15px 25px ;
	margin: 10px 0; 
	/* background: url(download.gif) no-repeat 0 5px; */ }
	
.dokumentedownload .data_title {font-size:12px; color:#000000;}

div.dokumentedownload a:link 	{ color: #000000; font-weight:bold; text-decoration: none; }
div.dokumentedownload a:visited	{ color: #000000; font-weight:bold; text-decoration: none; }
div.dokumentedownload a:active 	{ color: #000000; font-weight:bold; text-decoration: underline; }
div.dokumentedownload a:hover 	{ color: #000000; font-weight:bold; text-decoration: underline; }

	
	
	
	
/*  - - - - - - - -   ADDON - Prix des carburants - - - - - - - - - - */
#anzeige_petrol {
	width: 260px;
	padding:5px;
	border: 2px solid #e8e8e8;
	background-image: url(bg_petrol.jpg);
	margin: 10px auto;
	}
	
#petrol_logo {
	text-align: center;
	margin-bottom: 20px;
	}
	
#petrol_image {
	text-align: center;
	margin-bottom: 20px;
	margin-top: 60px;
	}


#petrol {
	overflow: hidden;
	height: 100%;
	}
	
.petrol_info {
	/*border-bottom: 1px dotted #000000;
	border-bottom: 1px solid #ececec;
	*/
	overflow: hidden;
	height: 100%;
	padding: 7px 10px;
	margin: 2px auto;
	border-bottom: 1px solid #d5d5d5;
	}
	
.petrol_name {
	float: left;
	font-size: 14px; font-weight: bold; color: #000000;
	}
	
.petrol_price {
	float: right;
	font-size: 17px; font-weight: bold; color: #000000;
	background-color: #000;
	text-align: right;
	/*width: 75px;*/
	}
	
.petrol_date {
	font-style:italic;
	font-size: 11px;
	color: #6d6d6d;
	font-weight: normal;
	}
	
	
	



/*  - - - - - - - -   rex4mod2 - News schreiben - - - - - - - - - - */

div.rex4mod2 {
 	font-size: 12px; 
	margin-bottom: 10px; 
	overflow:hidden; 	/* damit die floats gecleared werden - nicht entfernen */
	height:100%;		/* IE6 overflow:hidden hack - nicht entfernen  */ }   

div.rex4mod2_date { display:none; }

div.rex4mod2_title {
	font-family: Arial, Helvetica, Verdana, sans-serif;  
	font-size: 25px; color: #000000; line-height:35px;
	margin-bottom: 20px; }
	
	
div.rex4mod2_introcontainer {
	overflow:hidden; 	/* damit die floats nach dem container gecleared werden*/
	height:100%;		/* IE6 overflow:hidden hack */
}

/* Foto und Text der Einleitung befinden sich in rex4mod2_introcontainer */
	
	div.rex4mod2_introfoto {
		float:left; 
		margin: 5px 20px 10px 0; }
	
	div.rex4mod2_introfoto img { }
	
	div.rex4mod2_introtext {
		font-size: 13px; color: #5a6571; line-height:20px; font-style:italic;
		margin-bottom: 20px; }

/* Foto und Text der Einleitung befinden sich in rex4mod2_introcontainer */

	
div.rex4mod2_editor {
 	font-size: 12px;
	margin-bottom: 10px; } 

div.rex4mod2_editor h1 {
	font-family: Arial, Helvetica, Verdana, sans-serif;  font-weight:normal;
	font-size: 18px; color: #d30014; line-height:25px;	margin-bottom: 10px; }

div.rex4mod2_editor h2 {
	font-family: Arial, Helvetica, Verdana, sans-serif;  font-weight:bold;
	font-size: 15px; line-height:20px;	margin-bottom: 10px;
	margin-bottom: 10px; }

div.rex4mod2_editor ul {
	list-style: none;
	margin-left:0px; margin-top:10px; margin-bottom:10px; }

div.rex4mod2_editor ul li {
	padding-left:30px; 
	background: url(col1_pfeil.gif) no-repeat left top; }

div.rex4mod2_editor ol {
	margin-left:35px; margin-top:10px; margin-bottom:10px;
	list-style-type: decimal; } 
	
div.rex4mod2_editor a:link 		{ color: #d30014; text-decoration: none; }
div.rex4mod2_editor a:visited	{ color: #d30014; text-decoration: none; }
div.rex4mod2_editor a:active 	{ color: #d30014; text-decoration: underline; }
div.rex4mod2_editor a:hover 	{ color: #d30014; text-decoration: underline; }

div.rex4mod2_editor table { width:500px; } 

div.rex4mod2_editor td {
	background-color: #eeeeee;
	padding-left:5px; padding-right:5px; } 
	
div.rex4mod2_editor thead td {
	background-color: #5a6571; color:#fff;
	padding-left:5px; padding-right:5px; }
	




/*  - - - - - - - -   rex4mod - 3 - Teaser  - - - - - - - - - - */


.teaser {							/* ------ der komplette Teaser ------- */
	margin-bottom:20px;
	font-size: 12px; }

.teaserartikel {					/* ------ ein Teaserartikel ------- */
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: 1px dotted #000000; 		/* muss sein, sonst Probleme in IE7 */
	/* overflow:hidden; 	 */				/* damit die floats nach dem container gecleared werden*/
	/* height:100%;			*/				/* IE6 overflow:hidden hack */ }

.teaserdatum {
		font-size: 11px; color:#5a6571; line-height:10px; text-align: left;}

	div.teaserfoto {				/* ------ das Teaserfoto ------- */
		margin: 5px 15px 15px 0px; 
		float:left; }
		
	div.teasertext {				/* ------ die restliche Teaserinfos ------- */
		/* border: 1px solid #000000; */ }
	
	.teasertitel {
		font-family: Arial, sans-serif; font-weight:bold; color:#fd9308;
		font-size: 13px; line-height:17px;	margin-bottom: 5px;}
	
	div.teasertitel a:link 			{ color: #d30014; text-decoration: none; }
	div.teasertitel a:visited 		{ color: #d30014; text-decoration: none; }
	div.teasertitel a:active 		{ color: #d30014; text-decoration: underline; }
	div.teasertitel a:hover 		{ color: #d30014; text-decoration: underline; }
	
	.teasereinleitung 				{	}
	
	.teasereinleitung p 			{ padding:0px; margin:0px; }
		
	div.teasereinleitung a:link 	{ color: #000000; text-decoration: none; }
	div.teasereinleitung a:visited 	{ color: #000000; text-decoration: none; }
	div.teasereinleitung a:active 	{ color: #000000; text-decoration: underline; }
	div.teasereinleitung a:hover 	{ color: #000000; text-decoration: underline; }

.teasernav 						{ 
								overflow:hidden; 	/* damit die floats hiernach gecleared werden*/
								height:100%;		/* IE6 overflow:hidden hack */ }

	.vor		{ float:right; }
	.zurueck	{ float:left; }


div.teasernav a:link 				{ color: #000000; text-decoration: none; }
div.teasernav a:visited 			{ color: #000000; text-decoration: none; }
div.teasernav a:active 				{ color: #000000; text-decoration: none; }
div.teasernav a:hover 				{ color: #000000; text-decoration: none; }

.teaserarchivlink 					{ display:none; }

div.teaserarchivlink a:link 		{ color: #000000; text-decoration: none; }
div.teaserarchivlink a:visited 		{ color: #000000; text-decoration: none; }
div.teaserarchivlink a:active 		{ color: #000000; text-decoration: none; }
div.teaserarchivlink a:hover 		{ color: #000000; text-decoration: none; }





/* Formular Definition */
/*//////////////////////////////////////////////////////////////////////////////*

/* Div das das Formular umschließt */
.formgen {
	font-size: 12px;
	/* padding-right: 10px;
	padding-left: 10px; */
}


/* Was passiert wenn auf das Label geklickt wird? */
label,
select,
input[type=checkbox],
input[type=radio],
input[type=button],
input[type=submit]
{
cursor : pointer;

}



.formgen form
{
line-height : 120%;

}




/* 
Wie sehen die einzelnen Blöcke aus? 
Jedes Feld wird von einem DIV umschlossen, das hier definiert werden kann
*/


.formgen .formblock
{
	/*margin-bottom: 15px;
	margin-top: 10px;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 2px;
	padding-left: 5px;	*/
	
}
 .forminfo 
{
	/*width: 360px;
	margin-bottom: 15px;
	background-color: #FFCC33;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 2px;
	padding-left: 5px;
	font-weight: bold;
	border: 5px dashed #990000;*/
	color: #d30014;
	font-weight: bold;
}

/*
Verhalten von br-Tags
*/
.formgen br
{
clear : both;
}


/* 
--------- FORMULAR-OBJEKTE ------------ 
*/

.formgen input, .formgen textarea 
{
	color: #6d6d6d;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

/* Mehrzeiliges Eingabefeld */
.formgen .formtextfield
{
	width: 250px;
	color: #6d6d6d;
	height: 125px;
	border: 1px solid #6d6d6d;
	background-color: #fbfbfb;
	margin-top: 5px;  /* Bezeoht sich auf die lein-height von .formgen label */
}


/* Textfeld */
.formgen .formtext
{
	color: #6d6d6d;
	line-height: 50px;
	width: 250px;
	background-color: #fbfbfb;
	border: 1px solid #6d6d6d;
	margin-top: 5px;  /* Bezeoht sich auf die lein-height von .formgen label */
}

.formgen input:focus, .formgen input:hover,
.formgen select:focus, .formgen select:hover, 
.formgen textarea:focus, .formgen textarea:hover {
	border: 1px solid #000000;
}



/* Label */
.formgen label {
	width: 150px;
	clear: left;
	float: left;
	line-height: 25px;
	font-weight: bold;
	color: #6d6d6d;
}


/* Aussehen der Select-Ausgabe */
.formgen .formselect
{
	width: 200px;
	background-color: #33FF33;
	margin-left: 4px;
	color: #000000;
}


/* Sende-Button */
.formgen .formsubmit
{
	width: 250px;
	margin: 0 0 0 160px;  /* 150px für die breite der label + 10px für das padding-left der .unterteilung */
	text-align: center; font-size: 14px; font-weight: bold;
	background-color: #6d6d6d;
	border: 1px solid #6d6d6d;
	color: #ffffff;
	margin-top: 15px;
}

.formgen .formsubmit:hover
{
	background-color: #ffffff;
	border: 1px solid #6d6d6d ;
	color: #6d6d6d;
}

/* Fieldsetbeschriftung */
.formgen legend {
	color: #FFFFFF;
	background-color: #990000;
	width: 150px;
}
.formgen .fieldset {
	margin-bottom: 10px;
}

/* -------------- AUSGABEN / Fehlermeldungen --------*/


/* Markierung der Labels bei Fehler */
.formgen .formerror {
	border-bottom-width: 1px;
	color: #d30014;
}

.formgen .captcha
{
	text-align:center;
	margin-top: 5px;
}

.formgen .formcaptcha
{
}

.formgen .formreq {
	color: #6d6d6d;
}

.formgen .formheadline {
	color: #000000;
	background-color: #ececec;
	line-height: 25px;
	font-weight: bold;
	margin: 25px 0 7px 0;
	padding-left: 10px;
}


.formgen .unterteilung {
	padding-left: 10px;
	}
	
.form-module-thanks {
	font-weight: bold;
	}


/*//////////////////////////////////////////////////////////////////////////////*
/* Ende der Formulardefinition */






/*  - - - - - - - -   mod 34 - Liste der Unterkategorien - - - - - - - - - - */

div.unterkategorienliste {  
	font-family: Arial, Helvetica, sans-serif; font-weight:normal; font-size: 16px; color: #000000; 
	margin-bottom: 15px; }

div.unterkategorienliste ul { list-style:none; }
div.unterkategorienliste ul li { margin-bottom:5px; }

div.unterkategorienliste a {
	background-image: url(list_nav2nd.jpg);
	background-repeat: no-repeat;
	background-position: 0px 7px;	
	line-height:25px; 
	padding-left:15px;}

div.unterkategorienliste a:link 	{ color: #d30014; text-decoration: none; }
div.unterkategorienliste a:visited { color: #d30014; text-decoration: none; }
div.unterkategorienliste a:active 	{ color: #d30014; text-decoration: underline; }
div.unterkategorienliste a:hover 	{ color: #d30014; text-decoration: underline; }





/*  - - - - - - - -   R O T A T O R - - - - - - - - - - */
div#rotator_box { position: relative; margin-bottom:10px; }
		
div#rotator {
			position: relative;
			width:255px; 
			min-height:55px;
			height: auto !important;				/* IE6 hack */
			height:55px;							/* IE6 hack */	 }
			
div#rotator a 		{ position: absolute; z-index: 10; }
div#rotator a.show 	{ z-index:500; }
div#rotator a img 	{ border: none; }

div#rotator_box .bg { position: absolute; top: 0; left: 0; }