﻿@charset "utf-8";

/****************************/
/* BODY & SEITE (zentriert) */
/****************************/

/* Geisterbalken fr Firefox erzwingen */
html {
	min-height: 100.05%;
}

body { 
	margin: 0px; padding: 0px; 
	font-family: Arial, Helvetica, sans-serif; font-size:12px; line-height:16px;
	text-align: center;  /*IE*/
	color: #171717;
	background: url(../pic/back.gif) repeat; 
}

#seite {
	width: 725px; padding: 0px 10px 0px 10px;
	margin: 0px auto 0px auto;
	text-align: left;
	min-height: 450px;
	background:#FFFFFF;
}
	



/*******************/
/* Allgemeines*     /
/*******************/

h1 {
	margin: 0px 0px 12px 0px; padding: 0px;
	font-size: 13px; line-height: 16px; color:#191818;
}

h2, h2.lead, p.lead {
	margin-top:15px; margin-bottom: 8px; padding: 0px;
	font-size: 12px; line-height: 16px; 
	clear: left; 
}
	/* Lead */
	h2.lead, p.lead {
		margin-top: 0px;
		color: #595959; font-weight: bold;
	}
	.loopContainer h2 {
		margin: 0px;
		font-size: 12px;
	}

	h2 a:link, h2 a:visited {
		text-decoration: none;
		color: #595959;
	}

	h2 a:hover, h2 a:active {
		text-decoration: underline;
	}


h3 {
	margin: 0px 0px 8px 0px; padding: 0px;
	font-size: 11px; line-height: 14px;
	clear: left;
	color: #595959;
}
	h3.datum {
		margin: 0px 0px 8px 0px; padding: 0px;
		color:#BF120A;
	}

h5 {
	font-size: 13px;
}

	h5 a:link, h5 a:visited {
		text-decoration: none;
		color: #191818;
	}

	h5 a:hover, h5 a:active {
		text-decoration: underline;
		color: #000000;
	}

dl {
	margin: 8px 0px 8px 0px; padding: 0px;
}
dt {
	font-size: 11px; line-height: 14px;
	font-weight: bold;
	color: #595959;
}
dd {
	margin: 0px 0px 8px 25px;
}

p {
	margin: 0px 0px 8px 0px; padding: 0px;
	/*text-align: left;*/
	/* clear:left; verträgt sich nicht mit Kontaktformular */
}
	p.abstand {
		font-size: 1px; line-height: 3px;
		clear: both;
	}
	.loopContainer p {
		margin-bottom: 3px;
		font-size: 11px; line-height: 14px; 
	}
	#colRight p {
		margin: 0px 8px 10px 10px;
		font-size: 11px; line-height: 14px; color:#585555;
	}
	#colDynPage p {
		/*text-align: left;*/
		/* clear:left; verträgt sich nicht mit Kontaktformular */
	}
	.picDetailContainer p, #colRight .picDetailContainer p  {
		margin:0px 0px 10px 0px; padding:0px 4px;
		font-size: 10px; line-height: 12px;
		font-weight: normal; 
	}	

/* "normale" Links */
a:link {
	color: #4772A5;
}
a:visited  {
	color: #6E6E6E;
}
a:hover {
	color: #000000;
}
a:active {
	color: #000000;
}

	.mehr a:link, .mehr a:visited,
	.zurueck a:link, .zurueck a:visited
	 {
		padding-left: 15px;
		text-decoration:underline; font-weight: bold;
		background-image:url(../pic/pfeil.gif); background-position: left; background-repeat:no-repeat;
	}

	.zurueck a:link, .zurueck a:visited {
		padding-left: 11px;
		background-image:url(../pic/zurueck_pfeil.gif); background-position: left; background-repeat:no-repeat;
	}

	.mehr a:hover, .mehr a:active,
	.zurueck a:hover, .zurueck a:active	{
		text-decoration: underline;
	}

a.pfeil, #colRight a.pfeil {
	font-size: 11px; font-weight: bold;	padding-left:15px;
	text-decoration:underline;
	background-image:url(../pic/mehr_pfeil.gif); background-position: left; background-repeat:no-repeat;
}

img {
	margin:0px; padding:0px; border:none;
}

img.icon {
	/* position: relative; top:5px; */
	vertical-align: middle;
	margin: 2px 0px 2px 0px; padding:0px 0px 0px 5px;
}

/* Listen */
ul {
	margin: 8px 0px 15px 5px;
	padding-left:0px;
	list-style: none;
	/* list-style: square outside; */
}
	ul li {
	margin: 0px 0px 2px 0px;
	padding-left: 8px;
	background-image: url(../pic/li-punkt.gif); background-repeat:no-repeat; background-position: 0px 6px; 

}


ol {
	margin: 15px 0px 15px 60px;
	padding-left:0px;
}
	ol li {
	margin: 0px;
}

sub, sup {
	line-height: 0px;
}

/* Clear */
.clr {
	clear: both; line-height:1px;
}
.clrLeft {
	clear: left;
}
.clrRight {
	clear: right;
}

strong {
	color:#595959;
}

.grauFett, .textHi, .textError {
	font-weight: bold;
	color: #171717;
} 

/*******************************************/
/* Kopfbereich mit Sprachauswahl und Image */
/*******************************************/
#kopf {	
	width: 725px; height: 260px;
	margin: 0px; padding: 0px;
	position: relative; /*damit darin kopfImage absolut positioniert werden kann*/
	float: left;
 }

		#slideshow {
			clear:both; position:relative;
			/*background: url(../pic/kopf_image/back_kopfimage.jpg)*/
		}
		#slideshow img {
			display:none; 	position:absolute;
		}
		#slideshow img.start {
			display:block;
		}

	#kopfLogo {
		width:200px; height:45px; 
		/*absolut bezogen auf Elternelement*/
		position: absolute; top: 22px; left:0px;
		font-size:11px; font-weight:bold; color: #171717;
	}

	#kopfImage img{
		width: 725px; height:193px;
		margin:0px; padding:67px 0px 0px 0px;
		border:none; float:left;
		display:block; 

	}

	#kopfProdukt {
	width:196px; height:42px; 
	position:absolute; top:230px;left:0px;
	}

	#topNavigation {
		width: 100%; height:66px; padding:0px;
		text-align: right; 
		position: absolute;	left: 0px; top:126px;
		/*absolut bezogen auf Elternelement*/
	}
	
		#kopfLogo img {
			width:200px; height:45px; padding-right: 0px;
			border:none; float:left;
			display:block; 
		}
		
		#topNavigation img {
			width:192px; height:66px; border: 0px none; 
		}



#navMain, #navLeft, #navRight {
	float: left; display: block; white-space: nowrap; padding-top:10px; 
}
#navMain {
	/*absolut bezogen auf Elternelement*/
	position: absolute; top:10px; left:241px;
	width: 484px; height: 98px;
	margin: 0px; padding: 0px;
	background:url(../pic/back_mainnav.gif); background-repeat:no-repeat;
	float:left;

}

	#navMain .navMainZelle, #navMain .navMainZelleLast {
		float: left; padding:0px 0px 0px 0px;
	}

	#navMain .navMainZelleLast {
		padding-left:0px;padding-right:0px;background:none;
	}

	#navMain a:link, #navMain a:visited  {
		color: #EBF0F7; text-decoration: none;
	}
	#navMain a:hover, #navMain a:active {
		color: #383838;
	}



/********************/
/* Linke Spalte     */
/********************/
#colLeft {
	width: 196px; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; 
	float:left; text-align: right;
	background:url(../pic/spaltentrennstrich.gif) repeat-y;


}

	#colLeft .navLeftZelle {
		padding-top:1px; 

	}

	#colLeft #navLeft {

		
	}
	#navLeft {
		width: 196px; height:370px;
	}

	#navLeft h5 {
		height: 28px; width: 160px; margin:0px;
		text-align:right;
		padding-right: 15px; border-bottom: 1px dashed #777777;
	}


/********************/
/* Rechte Spalte     */
/********************/
#colRight {
	height: 450px; width: 175px; margin:0px 0px 0px 17px; padding: 38px 0px 0px 0px;  
	float:left; text-align: center;
	background:url(../pic/spaltentrennstrich.gif) no-repeat left 5px;
	}

	#colRight h5 {
		margin:0px;
	}

	#colRight ul {
		padding-left:15px; margin-bottom:20px;
		text-align: left;
	}
	#colRight ul li {
		/* line-height: 20px; */
	}

	/* "normale" Links */
	#colRight ul a:link, #colRight ul a:visited  {
		color: #4772A5; text-decoration:none;
	}
	
	#colRight ul a:hover, #colRight ul a:active {
		color: #000000; text-decoration:underline;
	}


	#colRight .teaserEinzeilig, #colRight .teaserZweizeilig {
		margin: 0px 17px 10px 18px; width: 138px;
		text-align: center; line-height: 15px;
		border:1px solid #D7E0EC; background:url(../pic/back_teaser.gif) repeat-x; 
		font-weight: bold; font-size: 13px;
	}
		#colRight .teaserEinzeilig {
			height: 25px; padding-top: 13px;
		}
		#colRight .teaserZweizeilig {
			height: 34px; padding-top: 4px;
		}

		#colRight .teaserEinzeilig a:link, #colRight .teaserEinzeilig a:visited,
		#colRight .teaserZweizeilig a:link, #colRight .teaserZweizeilig a:visited  {
			color: #6E6E6E; text-decoration: none;
		}
		#colRight .teaserEinzeilig a:hover, #colRight .teaserEinzeilig a:active,
		#colRight .teaserZweizeilig a:hover, #colRight .teaserZweizeilig a:active {
			color: #000000; text-decoration: underline;
		}




#colDetailPage #colRight {
	background-image:none;
}

/*****************************************/
/* Inhalt normal: mit colRight           */
/*****************************************/

#colInhalt {
	width: 334px; margin: 0px; padding: 10px 10px 10px 45px;
	float: left;
	background-color:#DAEFFF;
}

#colInhaltRahmenUnten, #colInhaltRahmenOben {
	clear: both;
}

#sieSindHier {
	height:30px;
	margin: 0px 0px 0px 0px;
	padding: 13px 0px 0px 45px; 
	line-height:17px; font-size:11px;
	color: #000000;
	background-color:#DAEFFF;
}

	#sieSindHier a:link, #sieSindHier a:visited {
		color: #595959;
		text-decoration:none;
	}
	
	#sieSindHier a:hover, #sieSindHier a:active {
		color: #000000;
		text-decoration: underline;
	}
	
	
#fussZeile, #fussNavigation {
	margin: 10px auto 0px auto; padding:0px;
	width: 725px; height: 18px;
	clear:both;
	text-align:center; background: #757575;
}

#fussZeile {
	font-size: 80%;
}
#fussZeile a:link, #fussZeile a:visited {
	color: #616161;
}

.mehr, .zurueck {
	margin: 0px 0px 5px 0px;
	font-size:11px;
}
	.mehr {
		margin: 0px;
		text-align: right;
	}
	.zurueck {
		text-align: left;
		clear:left;
	}

	.mehr img {

	}

.datum {
	font-size:11px; margin: 0px;
}


.loopContainer {
	clear:both; margin: 0px 0px 10px 0px;
	min-height: 70px;
}

	.loopLinkeSpalte {
		width:75px;
		margin: 0px 0px 15px 0px;
		font-size:9px;
		float: left;
	}
	.loopRechteSpalte {
		width: 259px;
		margin: 0px;
		float: left;
	}


/**********************************/
/* Inhalt inkl. colRight          */
/**********************************/
#colGanzeBreite, #colDynPage, #colDetailPage {
	float: left; width: 529px;
	background-color:#DAEFFF;

}


/* Pseudo colRight - auch picDetailContainer beachten */
#colDynPage #colInhalt {
	width: 334px; margin: 0px; padding-right: 150px;
}


/********************/
/* Table:           */
/********************/


/********************/
/* Bilder           */
/********************/

/* Positionierung ausserhalb colInhalt in Pseudo-ColRight oder colRight*/
.picDetailContainer {
	width:95px;

	/* rechter Rand = Bildbreite + padding+rechterRand(colInhalt) als Minuswert*/
	/* linker Rand = rechterRand colInhalt, damit in IE und Firefox gleich*/
	margin: 0px -140px 5px 0px; padding: 0px;
	float: right; clear:both; display: inline;
}
#colRight .picDetailContainer {
	margin: 0px 17px 10px 0px;	/* Abstand oben wegen dynamischer Seiten */
	display: block;

}

/* Container für Bild im Textbaustein-Loop */
.picDetail {
	width:95px; padding: 0px;
	margin:0px -140px 15px 25px; border:1px solid #D7E0EC;
	float: right;
	border:10px solid #FFFFFF;
}
	#colDynPage .picDetail, #colRight .picDetail, #colDetailPage picDetail {
	width:95px; margin:0px 0px 15px 25px; padding: 0px;
	border:10px solid #FFFFFF;
	}

.picPreview {
	margin: 2px 0px; border: 1px solid #D7E0EC;
}



/********************/
/* Bilder allgmein  */
/********************/

img.picNull {
	margin:0px; padding:0px; border:none;
}
img.picTrans {
	margin: 0; border: none; background: #FFFFFF; 
	/* filter:Alpha (opacity=70); -moz-opacity:0.7; */
}
img#kopfImageX {
	margin:0px; padding:0px;
}

/******************************************************************/
/* Formularelemente, vgl. auch kontaktformular.css, warenkorb.css */
/******************************************************************/

form, select, input, submit {
 margin:0px; padding:0px; 
}
	#colInhalt form {

	}

	form input {
		height: 18px; padding: 0px 0px 0px 2px; line-height: 19px;
		border: 1px solid #7F9DB9; background: #FAFAFA;
	}	

	form select {
		height: 20px; padding: 0px 0px 0px 2px; line-height: 19px;
		border: 1px solid #7F9DB9; background: #FAFAFA;
	}

	option {

	}	

	form submit {
		width: 150px;
		border: none;
	}

	label {
		line-height:19px; margin:0px; padding: 0px;
	}

.button {
	width: 66px; height: 20px; border: 1px solid #A6A6A6;
	margin-left:5px; padding:0px; line-height: 18px;
	font-size: 11px; font-weight: bold; text-align:center;
	background: url(../pic/button.gif); cursor: pointer;
}

		a.button:link, a.button:visited  {
			color: #000000; text-decoration: none;
		}
		a.button:hover, a.button:active {
			color: #000000; text-decoration: underline;
			background: url(../pic/button-hi.gif);
		}

/*SEO*/
ul.listeklein {
	font-size: 80%;
}
.listeklein li {
	background-image: none; 
}
/*SEO*/

