@charset "utf-8";
/* ######################################################################################################
** ### Allg. Einstellungen ##############################################################################
** ######################################################################################################
*/
/* Alle Schriftgrößen einheitlich auf Standardgröße (16 Pixel zurücksetzen */
html * { font-size: 100.01% }

/* Globales Zurücksetzen der Innen- und Außenabstände für alle HTML-Elemente */
* { margin:0; padding: 0 }

/* Korrektur: Das Zurücksetzen der Abstände verursacht zu kleine Selectboxen. */
option { padding-left: 0.4em }

/* Erzwingen vertikaler Scrollbalken in Netscape, Firefox und Safari Browsern */
html { height: 100% }
body {
    min-height: 101%;

/* Standardschriftgröße von 12 Pixeln */
    font-family: Verdana, sans-serif;
    font-size: 75.00%; 
 
/* (de) Vorgabe der Standardfarben und Textausrichtung */
    color: #000;
    background: #777600 url(../../images/bg.jpg) repeat-x;
    text-align: left;
  }

/* Rahmen für <fieldset> und <img> Elemente löschen */
fieldset, img { border: 0 solid}  


/* ### Überschriften Formatierungen ### */
h1,h2,h3 { font-weight:bold; margin: 0 0 0.25em 0; }
h1 { font-size: 100%; padding: 30px 0 10px 0; }                        /* 24px */
h2 { font-size: 100%; color: #424224; margin: 0; }                     /* 20px */
h3 { font-size: 100%; color: #000; margin: 0; }                        /* 18px */
h4 { font-size: 80%; color: #000; margin: 0; border-bottom: 1px dotted #000; }                     /* 16px */
h5 { font-size: 100% }                     /* 14px */


/* ### Absätze ### */
p { line-height: 1.5em; margin: 0 0 1em 0; }

/* ### Links (Allgemein) ### */
a { color: #424224; text-decoration: none; }

/* ### Lists | Listen  #### */
ul, ol, dl { line-height: 1.5em; margin: 0 0 1em 1em }
li { margin-left: 1.5em; line-height: 1.5em; }


/* ### text formatting | Textauszeichnung ### */
cite, blockquote { font-style:italic }
blockquote { margin: 0 0 1em 1.5em }

strong,b { font-weight: bold }
em,i { font-style:italic }

/* ### Skip Links ### */
.skip, .hideme {
   position: absolute;
   top: -1000em;
   left: -1000em;
   height: 1px;
   width: 1px;
  }

.skip:focus, .skip:active {
   position: static;
   top: 0;
   left: 0;
   height: auto;
   width: auto;
  }
  
/**
 *
 * |-------------------------------|
 * | #header  960px                |
 * |-------------------------------|
 * | #col1   | #col2               |
 * | 273 px  | flexible            |
 * |-------------------------------|
 * | #footer                       |
 * |-------------------------------|
 */
 
#page_margins { width: 960px; margin: 0px auto; }
#page{ background: #fbfbec; border: 1px solid #000; position:relative; margin-bottom: 5px; } 

/* ######################################################################################################
** ### Header ###########################################################################################
** ######################################################################################################
*/
#header { 
	position: relative;
	height: 240px; 
	text-align: left; 
   }

#logo { margin: 0; float: left; }
#header_bild { margin: 0;}
/* verhindert Abstand zwischen Logo und Headerbild bei IE6 */
* html #header_bild { position: absolute; padding: 0; }

/* ######################################################################################################
** ### Content Bereich ##################################################################################
** ######################################################################################################
*/
#main { clear:both; width: auto; background: #fbfbec; margin: 20px 40px 10px 0; }

#col1 { float: left; width: 273px; }
/* gesonderte Breite für IE6 */
* html #col1 { width: 289px; margin-right: -3px;}
#col2 { margin: 0 0 0 287px; background: url(../../images/content_bg_main.gif) repeat-y; }
#col2_content { min-height: 500px; padding: 0 50px 30px 130px; background: url(../../images/content_bg_oben.gif) no-repeat; }
/* Abschluss-Grafik (Olivenbaum) für rechte Spalte */
#bg_unten { background: url(../../images/content_bg_unten.gif) bottom left no-repeat; }

/* Anpassung: #col2 mittels z-index hinter die float-Spalten verschieben */
#col1 {z-index: 3}
#col2 {z-index: 1}
#col1_content {z-index: 4}
#col2_content {z-index: 2}

#col1_content, #col2_content { position:relative }

/* Box in col1_content */
#col1_content {
	margin-left: 24px;
	margin-bottom: 20px;
	padding-bottom: 10px; 
	width: 243px;
	}

#col1_content p { line-height: 1.25em; margin: 0 0 1.5em 0; }

/* Linkliste */
#linkliste { background-color:#777600; width:958px; height:25px; border:1px solid #000000; margin-bottom:20px;}
#linkliste_name {padding-left:25px; padding-top:5px;}

/* Absicherung für die Positionierung von #footer */
#footer { clear:both; display:block; margin-top: -12px; font-size: 80%;}
#footer p { padding: 0 0 0 24px; line-height: 1.0em; }
#footer a { color: #424224; text-decoration: none; }

#footer_left { padding:10px 0 0 24px;  float:left;}
#footer_right { padding:10px 51px 0 0; text-align:right; text-decoration:none;}

/**
 *
 * ### Linke Spalte Angebot Box ###
 *
 */
#angebot { border-top: 1px solid #424224; padding: 25px 0 0 0; margin-top: 25px; }	
#angebot img { float: left; margin-top: -5px; }
#angebot h2 { margin-bottom: 13px; }
#angebot h3, #angebot p { margin-left: 90px; }
#shop_button { margin-top: 35px; }
#shop_button a { display: block; background-image: url(../../images/button_off.gif); width: 219px; height: 104px; }
#shop_button a:hover { background-image: url(../../images/button_on.gif); }

	
/* ######################################################################################################
** ### Position Hauptnavi ###############################################################################
** ######################################################################################################
*/
 
#nav_main { position: absolute; top: 17px; left: 285px;  }

/* ######################################################################################################
** ### Subtemplates #####################################################################################
** ######################################################################################################
*/

	.subcolumns { 
		width: 99%;
		padding: 0 1px 0 1px; 
		margin: 0 -1px 0 -1px; 
		overflow:hidden;
	}
		
	.c50l, .c25l, .c33l, .c38l, .c66l, .c75l, .c62l {float: left; overflow: hidden;}
	.c50r, .c25r, .c33r, .c38r, .c66r, .c75r, .c62r {float: right; overflow: hidden;}
	
	.c25l, .c25r { width: 24.999%; }
	.c33l, .c33r { width: 33.333%; }
	.c50l, .c50r { width: 49.999%; }
	.c66l, .c66r { width: 66.666%; }
	.c75l, .c75r { width: 74.999%; }
	.c38l, .c38r { width: 38.196%; } /* Goldener Schnitt */
	.c62l, .c62r { width: 61.803%; } /* Goldener Schnitt */
	
	.subc  { padding: 0 0.5em 0 0.5em; overflow: hidden; }
	.subcl { padding: 0 1em 0 0; overflow: hidden; }
	.subcr { padding: 0 0 0 1em; overflow: hidden; }
	.subcl img { margin: 0.4em 0 0 0; }
	#bildunterschrift { font-size: 80%; color: #424224;}
	#name { font-size: 80%; color: #424224; }
	#beruf { font-size: 80%; color: #424224; }

/* ######################################################################################################
** ### Browser Hacks ####################################################################################
** ######################################################################################################
 */
* html #col1 { position:relative; } /* Nur für < IE7, sonst gibts im IE7 neue Positionierungsprobleme */
* html #col2 { position:relative; } /* Nur für < IE7, sonst gibts im IE7 neue Positionierungsprobleme */

	/*------------------------------------------------------------------------------------------------------*/
	/* Bug: "Escaping Floats Bug" Der Hack sorgt im IE dafür, dass Floats ihre Breite behalten und nicht    */
	/* unkontrolliert seitlich ausbrechen. */
	/* 
	** IE5.x/Win - x
	** IE5.x/Mac - 0
	** IE6       - x
	** IE7       - x
	*/	
	   
	/* Hides from IE-mac \*/
	.hold_floats { height: 1%; }
	/* End hide from IE-mac */
	/*------------------------------------------------------------------------------------------------------*/
		/*------------------------------------------------------------------------------------------------------*/
	/* Allgemeine IE-Layouthilfe, um die freie Spaltenanordnung zu gewährleisten und die Robustheit der     */
	/* DIV-Container für beliebige Inhalte zu erhöhen. Die Eigenschaft "zoom" erzwingt "hasLayout" im IE.   */
	/* 
	** IE5.01/Win - 0 (Eigenschaft "zoom" wird nicht interpretiert)
	** IE5.x/Win - x
	** IE5.x/Mac - x
	** IE6       - x
	** IE7       - x
	*/	

	#page_margins, #page, #header, #nav, #main, #footer { zoom: 1; }


	* html .c50l, * html .c25l, * html .c33l, * html .c38l, * html .c66l,
	* html .c75l, * html .c62l, * html .c50r, * html .c25r, * html .c33r,
	* html .c38r, * html .c66r, * html .c75r, * html .c62r {
	  display:inline; 
	}
	
	* html .subcolumns .subc,
	* html .subcolumns .subcl,
	* html .subcolumns .subcr { 
	  word-wrap: break-word;
	  overflow:hidden;
	}	
	
	.clear {
		clear:both;
	}	
