/* CSS Document */


html, body { 		
	height: 100%; 
	margin: 0;
	padding: 0;
	}

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.875em;
	text-align: left;
	background: #ffffff url('grafiken/hg_body.gif') repeat-x;
	color: #676767;
	}
	
a:link{
	color:#676767;
	text-decoration: underline;}

a:visited{
	color:#676767;
	text-decoration: underline;}

a:hover{
	color:#676767;
	text-decoration: none;}

a:active{
	color:#676767;
	text-decoration: underline;}
	
	
	
/*-- Überschriften*/

h1 {
	font-size: 1.5em;
	margin: 0;
	padding-left: 30px;
	line-height: 38px;
	font-style: normal;
	font-weight: lighter;
	}
	
h2 {
	font-size: 1.5em;
	margin: 0;
	padding-left: 10px;
	line-height: 38px;
	font-style: normal;
	font-weight: lighter;
	color: #7393AC;
	}

h3 {
	color: #2E5375;
	padding: 0px;
	margin: 0px;
	font-size: 100%;
	font-weight: bold;
	line-height: 18px;
	}

h4 {
	padding: 0px;
	margin: 0px;
	font-size: 100%;
	font-weight: bold;
	line-height: 18px;
	}
.h4gruen {
	color: #84BB2C;
	}
.h4orange {
	color: #FA771C;
	}
.h4blau {
	color: #3783D9;	
	}

.klasseh7 {
	font-size: 1.5em;
	margin: 0;
	padding-left: 0px;
	font-style: normal;
	font-weight: lighter;
	color: #7393AC;
	}


/*========= Grundstruktur ========================================================================*/

/*Maincontainer mit Hintergrund links*/

#maincontainer {
	position: relative;
	margin: 0;
	padding:0;
	background: transparent url('grafiken/hg_maincontainer.jpg') top left no-repeat;
	display: block;

}

*html #maincontainer, 
#maincontainer_firma, 
#maincontainer_sponsoring, 
#maincontainer_endverbraucher, 
#maincontainer_familie, 
#maincontainer_kidsworld, 
#maincontainer_spiele, 
#maincontainer_gastronomie, 
#maincontainer_emagazin, 
#maincontainer_classic, 
#maincontainer_orange, 
#maincontainer_dorange, 
#maincontainer_zitrone, 
#maincontainer_zitronetrueb, 
#maincontainer_dzitronetrueb, 
#maincontainer_colamix, 
#maincontainer_bitterlemon, 
#maincontainer_waldmeister, 
#maincontainer_himbeer, 
#maincontainer_wq111, 
#maincontainer_wq111tuerkis, 
#maincontainer_apfelschorle, 
#maincontainer_ace, 
#maincontainer_mo, 
#maincontainer_cassis, 
#maincontainer_waterapfel, 
#maincontainer_lemon, 
#maincontainer_wellness, 
#maincontainer_isopower, 
#maincontainer_sportvital, 
#maincontainer_sports, 
#maincontainer_gourmet/*NEU für IE7*/
 {
	border: 1px solid white;
}


/*Container zur Unterteilung in Inhaltsbereiche*/

#main1 {
	margin:0; 
	padding:0;
	background: url('grafiken/hg_links.jpg') left bottom no-repeat ; /*Positionierung Meerjungfrau*/
	height: auto;
}

#main2 {
	margin:0; 
	padding:0;
	background: url('grafiken/hg_rechts.gif') repeat-y right top; /*Positionierung rechter Rand*/
	height: auto;
	overflow: visible;
}



#header {
	position: relative;
	margin:0; 
	padding-right: 51px;
	background: transparent;
	height: 41px;
	text-align: right;
	}

#textbox {
	position: absolute;
	top: 0;
	right: 0;
	padding-right: 51px;
	padding-top: 20px;
}



#left { /*linker Bereich*/
	width: 210px;
	float:left;
	margin:0; 
	padding-right: 0px;
	padding-left: 0px;	
	padding-top: 270px;
	padding-bottom: 130px;
	}
	
#right { /*rechter Bereich - Abstand zum Rand*/
	position: relative;
	float: right;
	width: 44px;
	margin:0; 
	padding: 0;
	text-align: left;
	}
	
#middle { /*Mittelteil*/
	position: relative;
	margin: 0 44 0 0; /*für IE 0 44 0 208*/
	padding: 270 20 0 0;
	background: transparent;
	text-align: left;
	}
	
#inhalt {
	position: relative;
	margin-right: 51px;
	margin-left: 250px;
	height: auto;
	display: block;
	}

#ueber_box {
	display: block;
	margin-left: -30;
	background: url('grafiken/hg_h1.gif') no-repeat left top;
	height: 25px;
	}


#kopf {
	position: absolute;
	height: 235px;
	width: 100%;
	top: 54px;
	}
	
#kopf_innen {
	position: relative;
	height: 236px;
	margin-right: 51px;
	margin-left: 217px;
	background: url('grafiken/hg_titelpic.jpg') repeat-x right bottom;
	}
		
		/*Kopfaufteilung für Flashkopfeinbindung*/
		#titelpic {
			position: relative;
			margin: 2 0 0 0;
			padding: 0;
			height: 214px;
			}
		#titelpic_oben {
			margin: 0;
			padding: 0;
			height: 175px;
			background: transparent;
			}
		#titelpic_unten {
			margin: 0;
			padding: 0;
			height: 39px;
			background: url('grafiken/hg_titelpic_unten.jpg') no-repeat left top;
			text-align: right;
			}
			
		#titelpic_innen {
			display: block;
			padding-top: 10px;
			padding-right: 10px;
			font-size: 100%;
			}
			
			

.cleaner {
	clear:both;
	height:1px;
	font-size:1px;
	border: 0px none;
	margin: 0; 
	padding:0;
	background:transparent;
	}
	
#footer {
	margin:0 35 0 210;
	height: 39px;
	background:#ccc;
	background: #ACC5D9 url('grafiken/hg_footer_re.gif') top right no-repeat;
	text-align: center;
}	

#footer_innen {
	display: block;
	padding-top: 10px;
	}
	




/*=== Navigationsbereiche ============================================================================*/	
	
/*------- Aktuellbox -----------------*/

#subnavibox_aktuell {
	position: absolute;
	width: 188px;
	top: 311px;
	left: 10px;
	}

#subnavibox_aktuell ul {
	width:    188px;
	margin:    0;
	padding:    0;
	list-style:      none;
	text-align: left;
	}

#subnavibox_aktuell li {
	margin-left:   10px;
	padding:    0;
	text-align:    left;
	line-height: 140%;
	}

#subnavibox_aktuell a {
	padding-top:    4px;
	text-decoration:  none;
	color: #E50003;
	}

#subnavibox_aktuell a:hover {
	text-decoration:  underline;
	}

#subnavibox_aktuell a:acitve {
	text-decoration: none;
	}

#subnavibox_aktuell p {
	margin-left:   10px;
	margin-right: 10px;
	line-height: 120%;
	}
	
.mehr {
	text-align: right;
	}


/*------ Hauptmenü im Kopfbereich -------------*/

#mainMenu {
	background: #E6EEF5;
	margin: 0;
	padding: 0;
	height: 20px;
	text-a lign: left;
	}

#mainMenu ul
	{
	margin: 0;
	padding: 0;
	list-style-type: none;
	text-align: left;
	}

#mainMenu li { 
	float: left;
	width : 120px;
	text-align : center;
	}

#mainMenu a, #mainMenu a:visited
	{
	display: block;
	height: 16px;
	color: #676767;
	text-align: center;
	text-decoration: none;
	border-right: 2px solid #fff;
	padding-top: 2px;
	padding-bottom: 2px;
	background-color : #E6EEF5;
	}		

#mainMenu a.aktiv {
	color: #ffffff !important; 
	background-color: #ACC5D9; 
	position: relative !important;
}

#mainMenu a:active {
	position: relative;
	color: #ffffff; 
	background-color: #ACC5D9; 
	text-decoration: none;
	margin-left: 0;
	margin-right: 0;
	}

#mainMenu a:hover {
	position: relative;
	color: #ffffff;  
	text-decoration: none;
	margin-right: 0;
	background-color : #ACC5D9;
	}



/*------- Subnavigation -----------------*/

#subnavibox {
	position: absolute;
    z-index: 90;
	top: 311px;
    left: 10px;
	padding: 0px;
    text-align: left;
	width:188px;
	}
#subnavibox_innen {
	width: 189px;
	background-color: #FFFFFF;
	}

ul#subnav {
	list-style: none;
	margin: 0 0 0 1px;
	padding: 0;
	background-color: #FFFFFF;
	border-bottom: 1px solid #FFffff;
	}
ul#subnav li a:link, ul#subnav li a:visited {
	text-decoration: none;
	display: block;
	width: 100%;
	padding: 9px 0;
	font: normal 100%/100% arial, helevetica, sans-serif;
	color: #676767;
	border-bottom: 1px solid #838383;
	margin: 0;
	}
	
ul#subnav li a:hover {
	/*background: url ('grafiken/hg_sub.jpg') left center no-repeat;*/
	color: #676767;
	border-bottom: 1px solid #838383;
	background-color: #E6EEF5;
	}

ul#subnav ul#subnav2 {
	position: relative;
	display: block;
	margin: -1px 0 0 0;
	padding: 0;
	text-align:left;
	list-style: none;
	}
ul#subnav ul#subnav2 li a, 
ul#subnav ul#subnav2 li a:visited {
	margin: 0 -10px 0 0;
	padding: 7px 0;
	color: #003B7D;
	width: 100%;
	font-weight: normal;
	background-image: none;
	border-bottom: 1px solid #838383;
	background: url('grafiken/hg_subnav2a.gif') left center repeat-y;
	font: 100%/100% arial, helevetica, sans-serif;
	}

ul#subnav ul#subnav2 li a:hover, 
ul#subnav ul#subnav2 li a:active, 
ul#subnav ul#subnav2 li a:focus {
	padding: 7px 0;
	margin: 0 -10px 0 0;
	color: #003B7D;  
	text-decoration: none;
	font-weight: normal;
	background-image: none;
	border-bottom: 1px solid #838383;
	background: url('grafiken/hg_subnav2b.gif') left center repeat-y;
	}
/*
ul#subnav ul#subnav2 ul li a, 
ul#subnav ul#subnav2 ul li a:visited, 
ul#subnav ul#subnav2 ul li a:hover, 
ul#subnav ul#subnav2 ul li a:active, 
ul#subnav ul#subnav2 ul li a:focus {
	background: url('grafiken/hint_snav03.gif') left center repeat-y;
	}*/

.abstand_subnav {
	padding-left: 10px;
	margin: 0;
	}
.abstand_subnav2 {
	padding-left: 30px;
	margin: 0;
	}

.aktivbut_subnav {
	padding-left: 10px;
	margin: 0;
	font-weight: bold;
	}

/*=== Startseite spezifisch ============================================================================*/
	
.teaserbox {
	border: 1px solid #ffffff;
	height:140px;
	margin-bottom: 10px;
	padding-bottom: 12px;
	background: #ffffff url("grafiken/hg_teaserbox.gif") repeat-x top;
	}
.teaserbox p {
	padding: 10px 10px 0 10px;
	border-left: 1px solid #ffffff;
	border-right: 1px solid #ffffff;
	margin: 0;
	}
.teaserbox h3 {
	margin: 0;
	padding: 10px;
	border-left: 1px solid #ffffff;
	border-right: 1px solid #ffffff;
	border-top: 1px solid #ffffff;
	}

.teaserbild {
	float: left;
	margin-right: 10px;
	}

.infolink {
	margin-top: 0;
	padding-top: 0;
	text-align: right;
	font: normal normal normal 100%/ 0px Arial, Helvetica, sans-serif;
	}
	
.infolink a:link{
	color:#2E5375;
	text-decoration: underline;}

.infolink a:visited{
	color:#2E5375;
	text-decoration: underline;}

.infolink a:hover{
	color:#2E5375;
	text-decoration: none;}

.infolink a:active{
	color:#2E5375;
	text-decoration: underline;}




/*=== Produktseite spezifisch ============================================================================*/
#maincontainer_classic {
	position: relative;
	margin: 0;
	padding:0;
	background: transparent url('grafiken/hg_maincontainer_classic.jpg') top left no-repeat;
}

#bilderfenster {
	position: relative;
	display: block;
	height: auto;
	margin-right: 0px;
	left: 1px;
	top: -2px;
	}

#werkfenster {
	position: relative;
	display: block;
	width: 200px;
	margin-right: 0px;
	margin-top: 120px;
	float:right;
	text-align: right;
	}

#kaestchen2 {
	position: relative;
	display: block;
	width: 360px;
	height: auto;
	margin-bottom: 0px;
	margin-left: 0px;
	}

#kaestchen {
	position: relative;
	display: block;
	width: 360px;
	height: 127px;
	margin-bottom: 0px;
	margin-left: 0px;
	background: url('grafiken/galerien/flaschenleiste_classic.gif') no-repeat left top;
	}

#kaestchen li {
	list-style: none;
	}
#kaestchen a {
	display: block;
 	position: absolute;
	font-size: 10px;
	color: #6F6F6F;
	width: 21px;
	height: 21px;
	text-decoration: none;
	background: url('grafiken/kasten.gif') no-repeat left top;
	visibility: visible;
	overflow: hidden;
	z-index: 50;
}

#kaestchen a span {
	visibility: hidden;
	}


/*Tabellenangaben*/

.tabelle_produktuebersicht {
	font-size: 100%;
	padding-top: 0px;
	}
	
.tabelle { /*für Einzelprodukt*/
	font-size: 100%;
	width: 360px;
	}



.tabelle_geschichte { 
	font-size: 100%;
	}

.tabellenzelle {
	padding: 5px;
	}

.wertetabelle_classic {
	background: #DEECF4 url('grafiken/tab_hg_classic.jpg') no-repeat right bottom;
	font-size: 100%;
	line-height: 140%;
	}

#wk1 {left: 20px; top: 18px;}
#wk2 {left: 105px; top: 18px;}
#wk3 {left: 175px; top: 18px;}
#wk4 {left: 252px; top: 31px;}
#wk5 {left: 315px; top: 44px;}





/*=== Sonstiges ============================================================================*/

.unsichtbar {
	display:none;
	}

.fliesstext {
	color: #929292;
	}
	
.bildrechts {
		position: relative;
		left: 0px;
		top: 0px;
		float: right;
		margin: 0px 0px 15px 20px;
		}	
	
.formularfeld {
	background: #DEECF4;
	}
	
	
#inhalt_aktuell {
	position: relative;
	margin-right: -13px;
	margin-left: 250px;
	height: auto;
	display: block;
	}




#spalter_re {
	font-family: Arial, Helvetica, sans-serif;
	display: block;
	float: right;
	padding: 0;
	margin: 0;
	border: 0;
	color: #676767;
	background: transparent;
	width: 220px;
}
#spalter_li {
	display: block;
	padding: 0;
	margin: 0 250 0 0px;
	border: 0;
	background: transparent;
}

h5{
	display: block;
	width: 220px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
	font-weight: bold;
	padding: 3px 0px 3px 0px;
	margin: 0px;
	background: #fff;
	
	/*border-top: solid 1px #BAC3D0;*/
	}
.h5gruen {
	border-top: solid 1px #84BB2C;
	border-bottom: solid 1px #84BB2C;
	color: #84BB2C;
	background: #F2F8E9;
	}
.h5orange {
	border-top: solid 1px #FA771C;
	border-bottom: solid 1px #FA771C;
	color: #FA771C;
	background: #FEF1E8;
	}
.h5blau {
	border-top: solid 1px #3783D9;
	border-bottom: solid 1px #3783D9;
	color: #3783D9;
	background: #EBF2FB;
	}
	
h6{
	display: block;
	width: 220px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
	font-weight: normal;
	padding: 3px 0px 3px 0px;
	margin: 0px;
	background: #fff;
	}
.h6aktuelles {
	border-top: solid 1px #949494;
	border-bottom: solid 1px #949494;
	color: #fff;
	background: #B0B0B0;
	
	}
		
.spaltentext {
	padding-top: 2px;
	}
.spaltenbild {
	padding: 0px;
	}

.listentext {
		padding: 0px;
		margin: 10px 0px 10px 0px;
		}


.piclinks {
		position: relative;
		float: left;
		margin: 0px 10px 10px 0px;
		}
		
.picrechts {
		position: relative;
		float: right;
		margin: 0px 10px 0px 10px;
		}
		
/* ===== E-Magazin*/	
		
.teaserblock {
	border: 1px solid #ffffff;
	margin-bottom: 10px;
	padding-bottom: 12px;
	background: #ffffff url("grafiken/hg_teaserbox.gif") repeat-x top;
	}
.teaserblock p {
	padding: 10px 10px 0 10px;
	border-left: 1px solid #ffffff;
	border-right: 1px solid #ffffff;
	margin: 0;
	}
.teaserblock h3 {
	margin: 0;
	padding: 10px;
	border-left: 1px solid #ffffff;
	border-right: 1px solid #ffffff;
	border-top: 1px solid #ffffff;
	}		
		
/*	.bildlinks1 {
		position: relative;
		left: 20px;
		top: 3px;
		float: left;
		margin: 0px 20px 6px 0px;
		padding-right: 20px;
		}
	.bildlinks2 {
		float: left;
		padding-right: 10px;
		}
	.bildlinks_zimmer {
		float: left;
		border-right: solid 1px #BAC3D0;
		padding-right: 10px;
		margin-right:10px;
		}
	.bildrechts {
		position: relative;
		left: 0px;
		top: 43px;
		float: right;
		margin: 5px 13px 40px 12px;
		}
	.bildrechts_neu {
		position: relative;
		left: 0px;
		top: 43px;
		float: right;
		margin: 5px 13px 10px 12px;
		}
	.bildlinks_neu {
		position: relative;
		left: 0px;
		top: 6px;
		float: left;
		margin: 5px 13px 10px 12px;
		}