/* 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; */ }


body {
	background-color:#efeff1; background-image:url(bg.jpg); background-repeat:no-repeat; background-position:top center;
	font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 12px; color:#464648; text-align: left; line-height:16px; }

html, body {
	height: 100%;
}

#container {
	width:800px;
	margin: 0px auto; /* zentriert die Seite */
	min-height: 100%; 
	margin-bottom: -35px;
	position: relative;
}
	
/* ----------------------------------------- */
/*        			 TOP    			     */
/* ----------------------------------------- */

#top {
	/*background-color:#000;*/
	height:51px;		
	overflow:hidden; 	/* damit die floats nach der Navi gecleared werden*/
	height:100%;		/* IE6 overflow:hidden hack */
}

#topinfos 	{
	font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px;
	float:left;
	width:400px;
	margin-top:33px;
	/*background-color:#99CC00;*/ }

#topinfos a:link 	{ color: #464648; text-decoration: none; }
#topinfos a:visited { color: #464648; text-decoration: none; }
#topinfos a:active 	{ color: #464648; text-decoration: underline; }
#topinfos a:hover 	{ color: #464648; text-decoration: underline; }

#topnavi { 
	background-image:url(nav1_bg.jpg); background-repeat:repeat-x;
	width:367; 
	height:51px;
	float:right; 
}

/* ----------------------------------------- */
/*        			 HEADER    			     */
/* ----------------------------------------- */


#header {
	/*background-color:#00CCFF;*/
	height:200px;
	overflow:hidden; 	/* damit die floats nach der Navi gecleared werden*/
	height:100%;		/* IE6 overflow:hidden hack */
}


#header img {
	float:left;
}


/* ----------------------------------------- */
/*        			 SUBNAVI   			     */
/* ----------------------------------------- */

#subnavi {
	background-image:url(nav2_bg.jpg); background-repeat:repeat-x;
	height:31px; line-height:31px;
}

#subnavi2 {
	/*margin:10px 0 10px 0;
	background-color:#33CC66;*/
}

/* ----------------------------------------- */
/*        			 MAIN    			     */
/* ----------------------------------------- */

#main {
	overflow:hidden; 	/* damit die floats nach der Navi gecleared werden*/
	height:100%;		/* IE6 overflow:hidden hack */
}

#col1 		{ float:left; width:199px;  /*background-color:#666699;*/ padding: 33px 0 20px 0;}
#col2		{ float:left; width:550px; /*background-color:#ff6600;*/ padding:0 0px 20px 50px;}

.adresse 	{ border-bottom:1px solid #d3d4d4; border-top:1px solid #d3d4d4; padding:10px;}
.adresse a:link { color: #787878; text-decoration: none; }
.adresse a:visited { color: #787878; text-decoration: none; }
.adresse a:active { color: #e46800; text-decoration: underline; }
.adresse a:hover { color: #e46800; text-decoration: underline; }

.geschaeftsstellen 	{	margin-bottom:20px; font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 15px;
	border-top:1px solid #d3d4d4; padding-top:10px;}
.geschaeftsstelle1 	{	margin-bottom:5px;}
.geschaeftsstelle2 	{	margin-bottom:5px;}
.geschaeftsstelle3 	{	margin-bottom:5px;}

.schriftgroesse {margin:0 0 5px 0; text-align:right; }

/* ----------------------------------------- */
/*        			 FOOTER    			     */
/* ----------------------------------------- */

/*#footer {	background-color: red; }*/

.clearfooter {
	height: 34px;
	clear: both;
}


#footer {
	height: 34px;
	position: relative;
	background-color:#dcddde;
	border-top:1px solid #b8b8b9;
	background-image: url(footer.jpg);
	background-repeat: repeat-x;
	background-position: bottom;	
	text-align:center;
	/*padding-top:4px;*/
	font-size:11px; font-family:Verdana, Arial, Helvetica, sans-serif;
}

#footer a:link { color: #464648; text-decoration: none; }
#footer a:visited { color: #464648; text-decoration: none; }
#footer a:active { color: #e46800; text-decoration: none; }
#footer a:hover { color: #e46800; text-decoration: none; }

/* --------------------- NAV TOP 1st level --------------------- */
	
/* 	Erklärung von froschtaler.be: der Bereich in dem die Navi sich befindet, muss eine Höhe zugewiesen bekommen:
	z.B.: <td style="height:37px;">. Damit die Navi jetzt in der Mitte erscheint muss man (1) definieren!
*/	

ul.nav1st {
	margin:0px;
	padding:0;
}
	
ul.nav1st li {				/* setzt die Elemente nebeneinander*/
	float:left;		
	margin:0px; padding:0px;
	list-style:none;
}

ul.nav1st a, ul.nav1st a:link {
	display:block; /*	damit kann man die Linkhöhe und -breite definieren. Klappt im IE 6 NICHT, daher der Hack mit min-width */	
	height:51px;
	line-height:51px;
	padding:0 30px;
	font-family:Helvetica, Arial, sans-serif; font-size:20px; color:#fff;
	text-decoration:none;
	min-width:0px;			/* IE6 hack */	/*	Mindestbreite =0, danach				*/
	width: auto !important;	/* IE6 hack */	/*  erkennt der Browser automatisch			*/
	width:0px;				/* IE6 hack */	/*  die Breite des Elements		 			*/
	white-space : nowrap;	/* IE6 hack */	/*  Damit 2 Wörter nicht getrennt werden	*/
}

ul.nav1st a:hover {
	background-image:url(nav1_on.jpg); background-repeat:repeat-x;}

ul.nav1st li a.current, ul.nav1st li a.current:link {
	background-image:url(nav1_on.jpg); background-repeat:repeat-x;}


ul.nav1st li a.current:hover {
	background-image:url(nav1_on.jpg); background-repeat:repeat-x;}



/* --------------------- NAV TOP 2nd level --------------------- */
	
/* 	Erklärung von froschtaler.be: der Bereich in dem die Navi sich befindet, muss eine Höhe zugewiesen bekommen:
	z.B.: <td style="height:37px;">. Damit die Navi jetzt in der Mitte erscheint muss man (1) definieren!
*/	

ul.nav2nd {
	border-top:1px solid #fff;
	margin:0px;
	padding:0;
}
	
ul.nav2nd li {				/* setzt die Elemente nebeneinander*/
	float:left;		
	margin:0px; padding:0px;
	list-style:none;
}

ul.nav2nd a, ul.nav2nd a:link {
	display:block; /*	damit kann man die Linkhöhe und -breite definieren. Klappt im IE 6 NICHT, daher der Hack mit min-width */	
	height:30px;
	line-height:30px;
	padding:0 10px;
	border-right:1px solid #fff;
	font-family:Helvetica, Arial, sans-serif; color:#fff; font-size:13px; text-decoration: none;
	min-width:0px;			/* IE6 hack */	/*	Mindestbreite =0, danach				*/
	width: auto !important;	/* IE6 hack */	/*  erkennt der Browser automatisch			*/
	width:0px;				/* IE6 hack */	/*  die Breite des Elements		 			*/
	white-space : nowrap;	/* IE6 hack */	/*  Damit 2 Wörter nicht getrennt werden	*/
}

ul.nav2nd a:hover {
	background-image:url(nav2_on.jpg); background-repeat:repeat-x;
}

ul.nav2nd li a.current, ul.nav2nd li a.current:link {
	background-image:url(nav2_on.jpg); background-repeat:repeat-x;
}

ul.nav2nd li a.current:hover {
	background-image:url(nav2_on.jpg); background-repeat:repeat-x;
}





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

ul.nav3rd {
	margin: 0px 0 15px 0; border-bottom:1px solid #d3d4d4; padding-bottom:10px;
}

ul.nav3rd li {
	margin-bottom:1px;
}

ul.nav3rd a, ul.nav3rd a:link {
	font-family: Helvetica, Verdana, Arial, sans-serif; font-size:12px;	
	display:block;
	height:26px;
	line-height:26px;
	font-weight:bold; color:#464648; text-decoration: none;
	padding-left:10px;
}

ul.nav3rd a:hover {
	background-image:url(nav3_on.png); color:#fff; 
}

ul.nav3rd li a.current, ul.nav3rd li a.current:link {
	background-image:url(nav3_on.png); color:#fff;
}

ul.nav3rd li a.current:hover {
	background-image:url(nav3_on.png); color:#fff;
}


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

div.rex4mod1 {
 	font-size: 12px; 
	line-height:16px;
	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:Helvetica, Arial, sans-serif;
	font-size: 30px; color: #e36800; line-height:35px;
	margin-bottom: 10px; }

div.rex4mod1_editor {
 	font-size: 12px;
	margin-bottom: 30px;
	line-height:18px; } 

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

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

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

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

div.rex4mod1_editor table {
	width:550px; } 

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

	
/*  - - - - - - - -   mod02 - Titel - - - - - - - - - - */

div.title1 {
	font-family:Helvetica, Arial, sans-serif;
	font-size: 30px; color: #e36800; line-height:35px;
	margin-bottom:15px;
}

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

div.title3 {
	font-weight:bold; 
	font-size: 14px; line-height:20px;	margin-bottom: 10px;
}

/*  - - - - - - - -  rex4mod - 13 - do form!  - - - - - - - - - - */


/* --------------------------------------------- */ 
/*			   FORMULAR-DEFINITION				 */
/* --------------------------------------------- */ 

/* Div das das Formular umschließt */

.formgen {
	/*display:none;*/
	width:500px;		/* die komplette Breite des Container: darf nicht gelöscht werden! */
	font-family: Helvetica, Verdana, Geneva, Arial, sans-serif; font-size:12px; color:#5a6571; line-height:16px;
	/* border:1px solid #fff; */ }

/* Was passiert wenn auf das Label geklickt wird? */
label, select, input[type=checkbox], input[type=radio], input[type=button], input[type=submit] {
	cursor : pointer; }
	
/* Das Formular an sich: eigentlich unnötig */
.formgen form { /* border:1px solid #ff6600; */ }

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

/* Die Fehlermeldung nach Submit */
.forminfo { 
	color: #990000;	font-size: 12px; font-weight:bold;
	/* border:1px solid #000; */
	/* padding:10px; */
	margin: 0 0 10px 0; }
	
	
/* Verhalten von br-Tags */
.formgen br { clear : both; }

/* Verhalten von p-Tags */
.formgen p { 
	padding:0px; 
	margin:0px; 
	/* border:1px solid #ff6600; */ }


/* --------------------------------------------- */ 
/*			   FORMULAR-FELDER					 */
/* --------------------------------------------- */ 


/*	label - Die Feldbezeichnung */
.formgen label {					
	/* border: 1px solid #fff; */ 
	font-size: 12px;
	width: 120px;		/* 140 - 20 */
	clear: left; float: left;
	margin:0 20px 5px 0; 
	padding-left:20px; }
	

/*	text - Textfeld */
.formgen .formtext {
	width: 300px;
	height: 16px;				
	/* padding:3px; */				/* kein padding, da IE Probleme */
	margin-bottom: 4px;
	border: 1px solid #5a6571; 
	font-family: Helvetica, Verdana, Geneva, Arial, sans-serif; font-size:12px; color:#5a6571; line-height:16px;}
	
/*	passwort - Textfeld */
.formgen .formpassword {
	width: 300px;
	height: 16px;				/* 20 -3 -3 */
	/* padding:3px; */				/* kein padding, da IE Probleme */
	margin-bottom: 4px;
	font-family: Helvetica, Verdana, Geneva, Arial, sans-serif; font-size:11px; color:#5a6571; line-height:16px;
	border: 1px solid #5a6571; }	
	
/*	textarea - Mehrzeiliges Eingabefeld */
.formgen .formtextfield {
	font-family: Helvetica, Verdana, Geneva, Arial, sans-serif; font-size:11px; color:#5a6571; line-height:16px; /* muss definiert sein */
	width: 300px;
	height: 150px;
	/* padding:3px; */				/* kein padding, da IE Probleme */
	border: 1px solid #5a6571; }
	
/*	select - Aussehen der Select-Ausgabe */
.formgen .formselect {
	width: 300px;
	border: 1px solid #5a6571; 
	font-family: Helvetica, Verdana, Geneva, Arial, sans-serif; font-size:11px; color:#5a6571; line-height:16px;}

.formgen input:focus, .formgen input:hover,
.formgen select:focus, .formgen select:hover, 
.formgen textarea:focus, .formgen textarea:hover {		/* die Felder im hover Zustand */
	background-color: #f6f6f6; }
	
	
	
/* --------- START Radiobuttons --------- */


/* 	Eine Gruppe der Radio Buttons */	
.radio_container	{ 
	/* border: 1px solid #000;  */
	clear:left;						/* damit es nicht links floatet */
	margin-left:160px;	 			/* Label breite & margin-right + formblock breite & border  */ }

 .formgen label.formradio {			/* übernimmt die Css von .formgen label, daher jetzt einige Änderungen */
	/* border:1px solid blue;   */
	clear: none; float:none; 		/* nicht löschen */
	padding:0px; }
	
/*	radio - Aussehen der Radio Buttons */				
.formgen input.formradio {
	float:left; 
	margin-right:20px; 				/* jede Margin MUSS auf eine separate Linie */
	margin-bottom:5px;				/* jede Margin MUSS auf eine separate Linie */ } 
 
/* --------- ENDE Radiobuttons --------- */


/* Block, in dem sich das SUBMIT befindet */
.formgen .formblock { 							
	/* border:1px solid #fff;  */
	background-color:#f0f0f0; 
	padding: 0 0 20px 0; }
	
/* Sende-Button */
.formgen .formsubmit {
	width: 302px;										/* 300 +8, ansonsten zu schmal */
	text-align: center; color: #fff; font-weight:bold;
	background-color: #606061;
	border: 1px solid #606061;
	margin-left:160px;	 								/* Label breite & margin-right + formblock breite & border  */
	padding:2px 0; }	

.formgen .formsubmit:hover { color: #606061; }

/* Das Checkbox -Label */	
.formgen label.formcheck {			/* übernimmt die Css von .formgen label, daher jetzt einige Änderungen */
	/* border:1px solid blue; */ 
	width:300px;  
	clear: none; float:none; 		/* nicht löschen */
	padding:0px; }
	
/* Der Checkbox -Button */	
.formgen input.formcheck {
	/* border: 1px solid #fff;		 */					/* klappt nicht! keine Ahnung warum */
	margin-right:20px; 				/* jede Margin MUSS auf eine separate Linie */
	margin-left:20px; 				/* jede Margin MUSS auf eine separate Linie */
	margin-bottom:5px;				/* jede Margin MUSS auf eine separate Linie */ }


/* --------------------------------------------- */ 
/*			   FORMULAR-REST					 */
/* --------------------------------------------- */ 
	
/* Ein Trennelement */	
.formgen .formtrenn hr {
	/* border:1px solid #000; */ }

/* Eine Headline */
.formgen .formheadline {
	/* border:1px solid #000; */
	background-color:#606061;
	font-size:12px; color:#fff; font-weight:bold; line-height:20px;  
	padding:0 20px; }
	
/* Eine Info */
.formgen .formhinweis {
	/* border:1px solid #000;  */
	padding:10px;
	color:#5a6571;}
	
/* Ein Fehler - Markierung der Labels bei Fehler */
.formgen .formerror { color: #990000; }

/* Der Captcha Container */
.formgen label.formcaptcha { /* border: 1px solid #000; */ }
	
/* Das Captcha Bild */
.formgen img.formcaptchaimg { /* border:1xp solid #5a6571; */ }
	
	
/* Falls vorhanden: die Div Klassen */
.formgen div.unterteilung { 						/* beliebig verschiedenamige Klassen definierbar */
	/* border: 1px solid #ff6600; */ 
	background-color:#f0f0f0; 
	padding: 20px 0; }


/* Die Fieldsetgruppe */			
.formgen fieldset.fieldset {
	/* border: 1px solid #ff6600; */ }
	
/* Fieldsetbeschriftung */							/* klappt nicht! keine Ahnung warum */
.formgen fieldset.fieldset legend {
	/* border: 1px solid #ff6600; */ }
	
#form-module-thanks {
	/* border: 1px solid #ff6600; */
	font-family: Helvetica, Verdana, Geneva, Arial, sans-serif; font-size: 11px; line-height:16px; }


/*  - - - - - - - -   rex4mod - 6 - Slightbox  - - - - - - - - - - */

div.rex4mod6 {
	/* border:1px solid #000; */
	margin-bottom: 15px;
	overflow:hidden; 	/* damit die floats nach der Navi gecleared werden*/
	height:100%;		/* IE6 overflow:hidden hack */ }


div.rex4mod6 a {
	/* border: 1px solid #ff6600; */
	margin: 0 7px 7px 0;
	padding:0px;
	float:left;	
	overflow:hidden; /* damit die floats nach der Navi gecleared werden*/ 
	height:100%;/* IE6 overflow:hidden hack */ }


div.rex4mod6 img {
	border: 1px solid #5a6571;   }
	
	
/* - - - - - - - - - 3er Bilderreihe - - - - - - - - - - - - - - - - */

.bildcontainer {
	padding-top:25px;
	border-top:1px dotted #5a6571;
	width:540px;
}

.pic1		{float:left; margin-right:14px; width:170px; overflow:hidden; /* damit die floats nach der Navi gecleared werden*/ height:100%;/* IE6 overflow:hidden hack */}
.pic1text 	{font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; line-height:14px; width:170px;margin-bottom:30px; margin-top:5px;}

.pic2		{float:left; margin-right:14px; width:170px; overflow:hidden; /* damit die floats nach der Navi gecleared werden*/ height:100%;/* IE6 overflow:hidden hack */}
.pic2text 	{font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; line-height:14px; width:170px; margin-top:5px;}

.pic3		{float:left; overflow:hidden; /* damit die floats nach der Navi gecleared werden*/ height:100%;/* IE6 overflow:hidden hack */}
.pic3text 	{font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; line-height:14px; margin-top:5px;}


/*  - - - - - - - -   rex4mod - 16 - Aktionswochen (Optik) - - - - - - - - - - */

.colmessage { padding:10px;font-family: Helvetica, Verdana, Arial, sans-serif; font-size:12px; color:#4f4f50; line-height:17px; width:180px; background-image:url(aktion_bg_opt.jpg); background-repeat:no-repeat; background-color:#dcddde; text-align:center;} /* 185 macht rechts Probleme ! */
.colmessage h1 { font-size: 14px; line-height:18px; margin-bottom: 5px; color:#e97e00; font-weight:bold; text-align:center;}
.colmessagetitle {background-image:url(aktion_bgtitle.jpg); background-repeat:repeat-x; height:30px; line-height:30px; font-size:16px; font-weight:bold; color:#fff; padding-left:10px;}
.colmessagefooter { background-image:url(aktion_bgfooter.jpg); background-repeat:repeat-x; height:11px;}

.colmessage a:link 		{ color: #e97e00; text-decoration: none; }
.colmessage a:visited 	{ color: #e97e00; text-decoration: none; }
.colmessage a:active 	{ color: #e97e00; text-decoration: underline; }
.colmessage a:hover 	{ color: #e97e00; text-decoration: underline; }


/*  - - - - - - - -   rex4mod1 - 16 - Artikel schreiben (Akustik) - - - - - - - - - - */

.colmessage2 { padding:10px;font-family: Helvetica, Verdana, Arial, sans-serif; font-size:12px; color:#4f4f50; line-height:17px; width:180px; background-image:url(aktion_bg_aku.jpg); background-repeat:no-repeat; background-color:#dcddde; text-align:center;} /* 185 macht rechts Probleme ! */
.colmessage2 h1 { font-size: 14px; line-height:18px; margin-bottom: 5px; color:#e97e00; font-weight:bold; text-align:center;}
.colmessagetitle2 {background-image:url(aktion_bgtitle.jpg); background-repeat:repeat-x; height:30px; line-height:30px; font-size:16px; font-weight:bold; color:#fff; padding-left:10px; border-bottom:1px solid #fff;}
.colmessagefooter2 { background-image:url(aktion_bgfooter.jpg); background-repeat:repeat-x; height:11px;}

.colmessage2 a:link 	{ color: #e97e00; text-decoration: none; }
.colmessage2 a:visited 	{ color: #e97e00; text-decoration: none; }
.colmessage2 a:active 	{ color: #e97e00; text-decoration: underline; }
.colmessage2 a:hover 	{ color: #e97e00; text-decoration: underline; }


/*  - - - - - - - -   rex4mod1 - Artikel schreiben (Optik) - - - - - - - - - - */

.colmessage3 			{ 
	font-family: Helvetica, Verdana, Arial, sans-serif; font-size:12px; color:#4f4f50; line-height:17px; text-align:left; 
	width:200px;} 
	
.colmessage3 h1 		{ font-size: 14px; line-height:18px; margin-bottom: 5px; color:#e97e00; font-weight:bold; text-align:left;}

.colmessage3 a:link 	{ color: #e97e00; text-decoration: none; }
.colmessage3 a:visited 	{ color: #e97e00; text-decoration: none; }
.colmessage3 a:active 	{ color: #e97e00; text-decoration: underline; }
.colmessage3 a:hover 	{ color: #e97e00; text-decoration: underline; }




/*  - - - - - - - -   mod38 - fotomitlink - - - - - - - - - - */


div.fotomitlink {
	padding: 0px;
	background-color: #FFFFFF;
	margin-bottom:0;
}

div.fotomitlink img {

}









#videocontainer { margin-bottom:50px; width:550px; text-align:center;}