@charset "utf-8";

/* Eric Meyer's Reset CSS v2.0 - http://cssreset.com */
/*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,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,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}*/
/*font:inherit durch folgendes ersetzt wegen IE Bug: font-weight:inherit;font-style:inherit;font-family:inherit;*/
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,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,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font-weight:inherit;font-style:inherit;font-family:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}



/* enable for debugging - speziell BoxLayout auf Mobilgeräten [nicht löschen!] */
/*
* {
	color: rgba(200, 200, 200, 0.4) !important;
	border-color: rgba(0, 0, 0, 0.3) !important;
	outline-color: rgba(0, 0, 255, 0.3) !important;
	background: rgba(0, 0, 0, 0.07) !important;
}
*/




/******************************************
* line-height + font-size nur noch mit em!
* Ausnahme: fixe Größen wie Navigation!
*******************************************/


/* Generated by Font Squirrel (http://www.fontsquirrel.com) on May 31, 2010 */
/*
@font-face {
	font-family: 'IGaramond';
	src: url('fonts/igl-webfont.eot');
	src: local('â˜º'),
		url('fonts/igl-webfont.woff') format('woff'),
		url('fonts/igl-webfont.ttf') format('truetype'),
		url('fonts/igl-webfont.svg#webfontanpL753z') format('svg');
	font-weight: normal;
	font-style: normal;
}


@font-face {
	font-family: 'LiberationSansRegular';
	src: url('fonts/LiberationSans-Regular-webfont.eot');
	src: local('â˜º'),
		url('fonts/LiberationSans-Regular-webfont.woff') format('woff'),
		url('fonts/LiberationSans-Regular-webfont.ttf') format('truetype'), 
		url('fonts/LiberationSans-Regular-webfont.svg#webfont') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'LiberationSansItalic';
	src: url('fonts/LiberationSans-Italic-webfont.eot');
	src: local('â˜º'),
		url('fonts/LiberationSans-Italic-webfont.woff') format('woff'),
		url('fonts/LiberationSans-Italic-webfont.ttf') format('truetype'),
		url('fonts/LiberationSans-Italic-webfont.svg#webfont') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'LiberationSansBold';
	src: url('fonts/LiberationSans-Bold-webfont.eot');
	src: local('â˜º'),
		url('fonts/LiberationSans-Bold-webfont.woff') format('woff'), 
		url('fonts/LiberationSans-Bold-webfont.ttf') format('truetype'),
		url('fonts/LiberationSans-Bold-webfont.svg#webfont') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'LiberationSansBoldItalic';
	src: url('fonts/LiberationSans-BoldItalic-webfont.eot');
	src: local('â˜º'),
		url('fonts/LiberationSans-BoldItalic-webfont.woff') format('woff'),
		url('fonts/LiberationSans-BoldItalic-webfont.ttf') format('truetype'),
		url('fonts/LiberationSans-BoldItalic-webfont.svg#webfont') format('svg');
	font-weight: normal;
	font-style: normal;
}
*/


/****************************/
/* BODY & SEITE (zentriert) */
/****************************/

/*******************/
/* TEST: font-face */
/* START           */
/*******************/
/*
.ddmx  { 
	font-family: "LiberationSansItalic", Arial, Helvetica, sans-serif !important;
	font-weight: normal !important;
}
*/
/*******************/
/* TEST: font-face */
/* ENDE            */
/*******************/


html {
	/* min-height: 100.05%; */
	-webkit-text-size-adjust: none;	/* iphone, Achtung: betrifft auch Safari und Co! Damit bei Safari auf Mac die Schriftgröße auch passt . Kann aber sein dass FontSize A A A dann nicht auf Safari geht.*/
}

body { 
	margin: 0px; padding: 0px;
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;  /*IE*/
	color: #535353;
	background:url(../pic/back.gif) repeat-x #ededed;
}
/*styleswitcher normal*/
body, body.fontswitchNormal {
	font-size: 62.5%; line-height:1.7em;
}
/*styleswitcher big*/
body.fontswitchBig { 
	font-size: 70%; line-height:1.8em;
}
/*styleswitcher biggest*/
body.fontswitchBiggest { 
	font-size: 80%; line-height:2.2em;
}


#seite {
	/* width: 992px;/*resp. deaktiviert*/ /* #responsive17 */
	max-width: 992px; /* =100% */ 
	padding: 0px 0px 15px 0px; /* 366 *//*15px bottom damit der seitenhintergrund noch hinter die welle geht und nicht vorher endet*/
	margin: 0px auto 0px auto;
	text-align: left;
	/* min-height: 500px; */
	/* background: #E6E7E8; */
	/* background-image:url(../pic/back.gif); */
	background: #FFF;
}

#seiteBestellung {
	width:550px; 
	overflow:auto;
	padding: 0px 14px 15px 14px; 
	margin: 0px auto 0px auto;
	text-align: left;
	background:#FFF;
}

/*******************/
/* Allgemeines*     /
/*******************/

h1 {
	margin: 0px 0px 15px 0px; padding: 0px;
	font-size: 2.4em; 
	font-family: Arial; line-height:1.2em; font-weight: bold;
	color: #ED7E22; /*color:#f49a50;*/ /* color:#4A626C; */ /*UnterschBootsbauSegelschule*/
	/* color: #6E6E6E; */
}
.loopOhneAbstand h1 {
	clear: both; /* nötig für kurztextige Textbausteine wegen Umbruch */
	/*float: left; führt zu zu geringer Höhe auf Startseite! Konsequenz noch nicht vollständig untersucht*/ 
	width: 100%; margin-bottom: 20px;
	line-height: 1.2em; color: #272727; font-size: 1.8em;
	border-bottom: #e8e8e8 3px solid; 
}

.textbaustein h1 { /*'neu1234 nochNach0799ZuMigrieren, wie normales h1 auf detailseiten*/
	width: 100%;
	margin: 0 0 11px 0; /*damit tbs-bild mit rechten minibildern weiße abstandslinie passt*/
	padding: 0;
	border: 0 none;
	font-size: 2.4em;
	line-height: 1.2em;
	overflow: hidden; /*wichtig damit margin beim folgenden p funktioniert, sonst nimmt es sich den platz nicht*/
}
.textbaustein a h1 { /*'neu1234 nochNach0799ZuMigrieren, wie normales h1 auf detailseiten*/
	color: #ed7e22;	 /*UnterschBootsbauSegelschule*/
}

.loopStartBoxes h1 {
	margin:0px;
	width: 96.710526%; 						/* 304-10:324 */
	min-height:22px; /*nicht height sondern min-height. sonst geht das nicht responsive mit zeilenumbruch*/
	padding:8px 0 0 3.2895%; 	/* 10:324 */
	background:#f49a50; color:#000000; /*UnterschBootsbauSegelschule*/
	font-size: 14px;
	line-height: 1.286em;
}

h2, h2.lead, p.lead {
	margin-top:25px; margin-bottom: 16px; padding: 0px;
	font-size: 1.8em; line-height: 1.3em; 
	clear: left; color:#2F2F2F;
}

	/* Lead */
	h2.lead, p.lead {
		margin-top: 0px;
	}
	h2.lead, p.lead,
	.textbaustein div.loopText p { /*'neu1234 nochNach0799ZuMigrieren*/
		color: #656565; font-weight: normal;
	}	
	.loopContainer h2, dl h2 {
		margin: 0px; clear: none;
		font-size: 1.2em;
	}
	h2.anmeldeformular { /*angehängte formulare*/
		margin-top: 25px;
	}

	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: 1.4em; line-height: 1.3em;
	clear: left;
	color: #000; font-weight: bold;
}
	h3.datum {
		margin: 0px 0px 8px 0px; padding: 0px;
		color:#4A626C;
	}

h5 {
	font-size:14px; font-weight:bold;
	line-height:18px;
}

	/*Navigations-h5 (navLeft und verlinkte Überschriften in Teaser)*/
	h5 a {
	}

	h5 a:link, h5 a:visited {
	}

	h5 a:hover, h5 a:active {
	}

.textbaustein { /*'neu1234 nochNach0799ZuMigrieren*/
	clear: left;
	margin-bottom: 16px;
}

.textbaustein a { /*'neu1234 nochNach0799ZuMigrieren*/
	text-decoration: none;
}

dl {
	width: 100%; 
	margin: 0 0 20px 0;
	float: left;
}

	dt {
		margin: 0px 0px 3px 0px;
		clear: left;
		font-size: 1.2em; font-weight: bold;
	}

	
	dt a:link, dt a:visited {
		text-decoration: none;
		color:#324249;
	}

	dd {
		width: 79.899497%; /* 318px bezogen auf 398px */
		margin: 0px 0px 20px 0px;
		float:left;
	}

	dt .picPreview {
		margin: 3px 2.5125628% 20px 0px; /* 10px */
		float: left; border:0px;
		width:17.085427%; /* 68/398 */
	}
	
	.produktevariantenLoopstil dt .picPreview { /*seo-seiten!*/
		width: 68px; /*projektspez. bildgröße*/
	}	
	
	img.picPreview.feedImg { /*extern eingebundene rss feeds*/
		width: 68px;
	}
	
	dd.noPic {
		width: 100%;
	}



p {
	margin: 0 0 12px 0; padding: 0;
	font-size: 1.3em; line-height: 1.8em;
	/*Achtung: selbe font-size auch dem picContainer zuweisen*/
	/*text-align: left;*/
	/* clear:left; verträgt sich nicht mit Kontaktformular */
}
	p.abstand {
		font-size: 1px; line-height: 0.3em;
		clear: left;
	}
	.loopContainer p, dd p {
		margin-bottom: 3px;
		font-size: 1.1em; line-height: 1.4em;
	}
	#colRight p, #colLeft p {
	}
	
	
	#colDynPage p,
	#tinymce p {
		/*text-align: left;*/
		/* clear:left; verträgt sich nicht mit Kontaktformular */
	}
	.picDetailInternP, .picDetailContainerP, #colRight picDetailContainerP { 
		margin: 0 0 10px 0; padding: 0 0 5px 0;
		font-size: 1em; line-height: 1.2em;
		font-weight: normal; display:block;
	}	
	.picDetailContainerMini {} /*um Minibilder*/

	p.erweiterteSuche {
		background:#BFBEBE; margin: -3px 0 0 0; padding: 0;
		height: 1.7em; font-weight: bold;
		background-image:url(../pic/erweitertesuche.gif);
	}

	p.erweiterteSuche img{
		position: absolute;
		margin-left: 15.3em; margin-top:0.1em;
	}

	p.artikelNummer {
		font-weight: bold; font-size:1.1em;
	}

	.artikelNummer {
		color:#666;
	}

/* "normale" Links */
a:link {
	color: #ED7E22; /*color: #f49a50;*/ /*UnterschBootsbauSegelschule*/
}
a:visited  {
	color: #ED7E22; /*color: #f49a50;*/ /*UnterschBootsbauSegelschule*/
}
a:hover {
	color: #57a5e5;
}
a:active {
	color: #57a5e5;
}


/*'vardetailseite IE6 Gefahr da direkt punkt*/
.mehr.varianten {
	background-color: #FFCCCC;
}
.mehr.varianten a {
	font-weight: bold;
}


	/*+++++++++++++++++++++++++++
	Zeichen/Grafiken, die hinter internen/externen mehr-Links angefügt werden
	Hexadezimalzeichen möglich z.B. BB -> \00BB
	Grafiken möglich url()
	Statischer Text möglich " "
	++++++++++++++++++++++++++++*/
	.mehr a:after {
		/*content: " "url(../pic/arrow1.gif);*/ /*leerzeichen + grafik*/
		/*content: " \00BB";*/
		/*content: " \203A";*/
		/* content: " >"; */
	}
	
	/*'iCalendar*/
	.mehr.outlook a:after {
		content: " \00BB";
	}	
	
	.mehr a[target="_blank"]:after {
		content: " \00BB";
	}
	
	#colDetailPage .mehr a:after,
	#tinymce .mehr a:after { /*damit auf Detailseiten dokUrls keine Linkzeichen erhalten*/
		/*content: "";*/
	}
	
	.mehr a[class="dokicon"]:after, .mehr a[class *="dokicon"]:after { /*damit bei Links, denen bereits dokimages ("icon") zugeordnet sind, keine Zeichen hinzugefügt werden bzw eine der zugeordneten Klassen dokicon lautet*/
		content: "";
	}




	.mehr a:link, .mehr a:visited,
	.zurueck a:link, .zurueck a:visited
	 {
		padding-left: 15px;
		text-decoration:underline;
		/* background-image:url(../pic/pfeil.gif); background-position: left; background-repeat:no-repeat; */
	}
	
	/*'iCalendar*/
	.mehr.outlook a:link, .mehr.outlook a:visited, .mehr.outlook a:hover, .mehr.outlook a:active {
		padding-left: 0px;
	}

	.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: 1.1em; font-weight: bold; padding-left:15px;
	text-decoration:underline;
	background-image:url(../pic/mehr_pfeil.gif); background-position: left; background-repeat:no-repeat;
}

.erweiterteSuche a:link, .erweiterteSuche a:visited {
	padding:3px 0px 0px 10px;
	color: #FFF; text-decoration: none; display:block;
	background-image:url(../pic/mehr_pfeil.gif);	
	background-position: right;
	background-repeat:no-repeat;
}

.erweiterteSuche a:hover, .erweiterteSuche a:active  {
	color: #000;
}



img {
	margin:0px; padding:0px; border: 0 none;
}

img.icon {
	/* position: relative; top:5px; */
	vertical-align: middle;
	margin: 2px 0px 2px 0px; padding:0px 0px 0px 5px;
}

/* Listen */
ul {

}
#col > ul, 
#colInhalt > ul,
#tinymce > ul,
#colInhalt ul.feed-list { /*test1*/
	/* clear: both; */ /* Problem für platzierte Bilder, aber wichtig für umbruch falls liste direkt nach h1 innerhalb einer textbausteinloop zB auf der Startseite vorkommt; */
	font-size: 1.3em; line-height:1.8em;
	margin-bottom:15px;
}

	#colInhalt > ul li,
	#tinymce > ul li {
		padding-left:15px;
		background: url("../pic/li-punkt.gif") no-repeat 0 8px;
	}
	


ol {
	margin: 8px 0 15px 30px;
	padding-left:0px;
}
	ol li {
		margin: 0px;
		padding-left: 0px;
		font-size: 1.25em;
		line-height: 1.3em; 	
}
#col > ol, 
#colInhalt > ol, 
#colInhalt > ol > ol,
#tinymce > ol,
#tinymce > ol > ol { /*test1*/ /*'neu1234 nochNach0799ZuMigrieren*/
	/*
	font-size: 1.3em; line-height:1.8em;
	margin-bottom:15px;
	*/
	list-style:decimal;
}

	#colInhalt > ol li,
	#tinymce > ol li { /*'neu1234 nochNach0799ZuMigrieren*/
	}

sub, sup {
	line-height: 0px;
}
ul sup {
	font-size: 0.6em; vertical-align: super;
}

/* Clear */
.clr {
	clear: both; line-height:1px;
}
.clrLeft {
	clear: left;
}
.clrRight {
	clear: right;
}
.clrBothPlain {
	clear: both;
}

strong {
	font-weight: bold;
}

.grauFett, .textHi, .textError {
	font-weight: bold;
	color: #171717;
} 

.textError {
	color: #C00404;
}	

#metaNavigation {
	margin-left: -10000px;
	position: absolute;
}

/*******************************************/
/* Kopfbereich mit Sprachauswahl und Image */
/*******************************************/
#kopf {	
	width: 100%;
	margin: 0; /*margin wie containerbox padding hat, falls box verwendet wird*/
	padding: 0 0 0 0;
	float: left;
	position: relative;
 }

	#kopfLogo {
		float:left; width:50%; height:auto;
		line-height:0;
	}

		#kopfLogo img {
			width: 323px; /* width:65.120967%; */
			margin:0px; padding:0px;
		}

	#topNavigation {
		float:right; height: 21px; padding:24px 0px 0px 0px;
		width:50%; font-size:1.2em; 
	}
		#topNavigation li {
			display:inline; float:right;
			padding-right:20px; padding-left:12px;
			background-image: url(../pic/trenn_top.gif); background-repeat:no-repeat; background-position: right 6px;
		}
		#topNavigation li:first-child {
			background:none; padding-right:0px;
		}
		#topNavigation a:link, #topNavigation a:visited  {
			color: #13649c; text-decoration: none; font-weight:bold;
		}
		#topNavigation a:hover, #topNavigation a:active {
			color: #48a5e0;
		}

	p#location, 
	div#location { /*vcard/hcard*/
		float:right; height: 52px; padding:3px 0 0 0; margin:0px;
		width:50%; text-align:right;
		line-height:1.5em;
	}
	
		/* vcard/hcard Kopf*/
		#location .vcard > a:first-child { /*Bereichsnamen zwar im microformat inkludieren, aber nicht anzeigen*/
			display: none;
		}
		div#location {
			font-size: 1.3em; line-height: 1.5em;
		}
		div#location .vcard {
			color: #929292;
		}	

		#location img {
			float:right; margin-left:10px;
		}

		#location a:link, #location a:visited {
		text-decoration:none; color:#929292; 
		}

		#location a:hover, #location a:active {
		text-decoration:none; color:#48a5e0; 
		}


	#kopf .welle {
		clear:both;
		width:100%; height:50px;
		background:#ccc;
		position:absolute; bottom:-38px;
		z-index: 10; 
		background: url(../pic/welle_slider.png) no-repeat;

		
	}








/*++++++++++++
Navigation
++++++++++++++*/
#navMain, #navLeft, #navRight {
	float: left; display: block; white-space: nowrap;
	display: inline; /*IE6problem: doublemargin*/ 
}

#navLeft, #navRight {
	padding-top:10px; 
}

#navMain {
	width: 100%; 
	font-weight:bold; 				/* kopfNavKurse */
}

	#navMain .main {
		text-transform: uppercase; 	/* kopfNavKurse */
	}

	#navMain .subnav {
		font-weight:normal; 		/* kopfNavKurse */

	}
	#navMain a.subnav:link, navMain a.subnav:visited { /* kopfNavKurse */
		color:#daebf9;
	}
	#navMain a.subnav:hover, navMain a.subnav:active { /* kopfNavKurse */
		color:#000;
	}
	#navMain .topAbstand {
		margin-top:21px;			/* kopfNavKurse */
	}

#navLeft { /* teaserbox: nötig, da sonst die teaser ins menü fließen */
	float:none; 
}


/*++++++++++++
containerbox bsp pj1003
++++++++++++++*/
#containerbox, #containerbox_oben, #containerbox_unten {
	position: relative; /*position relativ führt im IE6 dazu, dass navLeft nicht angezeigt wird, aber nur, wenn nicht als ul-li gelöst*/
	clear: both;
	/*width: 816px;*/ /*858-2x21*/
	/*padding: 0 21px;*/	
}
	
#containerbox {
}

#containerbox_oben {
}

#containerbox_unten {
}



/********************/
/* Rechte Spalte     */
/********************/
#colRight {
	width: 31.932773%; 		/* 304:952 */
	margin: 0 0 0 2.101%; 	/*  20:952 */
	padding: 0;  
	float: left;
	text-align: center;
	}

	#colRight h5 a {
		margin:0px;
		min-height:18px;  padding:8px 0 4px 3.289%; /* 10:304 */
		background:#006ab2; color:#ffdf53; /*UnterschBootsbauSegelschule*/
		border:none;
	}
	
	#colRight h5 a:hover {
		background:#57a5e5;
	}

	
	#picContainer {	/*umschließt alle Bilder in der colRight*/
		/* margin-top: 38px; */
		font-size: 1.2em; /*wichtig für Bildbeschreibungstext anstelle der Formatierung des umgebenden p bei zugeordneten Bildern */
	}

	#colRight div.teaserBox { /*teaserbox*/
		/*width: 160px;*/
		text-align: left; clear:left;
		height: auto; /*damit das element eine höhe erhält*/
		line-height:0px; /* wichtig für Texlosen DIV */
		margin-bottom:20px;
	}

	#colRight div.halb {
		float:left; clear:none;
		width:46.710526%;
	}

		.teaserGesamt > .halb:nth-child(2n+2){
			margin-left:6.5789473%; /* 20:304 */
		}
		.teaserGesamt > .missingNth{
			margin-left:6.5789473%; /* 20:304 */
		}

	#colRight .halb h5 a {
		padding-left:7.0422535%;
	}



	.teaserBox img {
		width: 100%;
	}

	.teaserBox .picPreview { /* teaserbox */
		margin: 0px 0px; 
		border: 0 none;
		text-align: center;
		vertical-align:middle;	
	}
	
	.teaserBox ul { /*teaserbox*/
		background:#c8ddee;
		padding:4px 10px 5px 10px;
		margin-bottom:0px;
		text-align: left;
	}
	
	/* "normale" Links */
	.teaserBox ul a:link, .teaserBox ul a:visited  {
		color: #226496; text-decoration:none;
		font-size:1.2em; line-height:1.5em;
	}
	
	.teaserBox ul a:hover, .teaserBox ul a:active {
		color: #000000; text-decoration:none;
	}

	.teaserBox p {
		padding:4px 10px 0px 10px; margin:0px;
		font-size:1.2em; line-height:1.5em;
		background:#c8ddee;
	}

	.teaserBox p.mehr {
		padding:0px 10px 6px 10px;
		background:#c8ddee;
	}
	
	.teaserBox p a:link, .teaserBox p a:visited {
		color:#13649c; font-weight:bold;
	}

	.teaserBox p a:hover, .teaserBox p a:active {
		color:#000; 
	}




	/* damit die banner nicht unten noch einen div rand erhalten, falls sie verlinkt sind */
	#colLeft .teaserBox .bannerlink, #colRight .teaserBox .bannerlink { /*teaserbox*/
		line-height: 0px;
		font-size: 0px;	
	}
	
	#colRight .teaserGesamt { /*teaserbox*/
		overflow: auto; /*damit das element eine höhe erhält*/
	}
	
	.teaserBox a:link, .teaserBox a:visited {
		text-decoration: none;
	}	

	.teaserBox a img {
		opacity: 0.99; /*damit FF nicht flackert in Kombi mit opacity und hover, muss hier 0.99 sein. 1 bzw 'nichts' führt zu flackern*/
	}
	.teaserBox a:hover img { /*teaserbox*/
		opacity: .7; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter: alpha(opacity=70);				
	}



	
	.teaserBox h5 a:link, .teaserBox h5 a:visited, .teaserBox h5 a:active, .teaserBox h5 a:hover {
		display: block; /*feed-symbol wird so aber nicht mehr daneben sondern darunter angezeigt*/ /*display: block;*/
		/*background-color: #00CC33;*/
	}
	
	
	#colRight .nurLink a:link, #colRight .nurLink a:visited, #colLeft .nurLink a:link, #colLeft .nurLink a:visited { /*teaserbox*/
		color: #000000; text-decoration: none;
	}
		
	#colRight .nurLink a:hover, #colRight .nurLink a:active, #colLeft .nurLink a:hover, #colLeft .nurLink a:active  { /*teaserbox*/
		color: #5D8EC1; text-decoration: underline;
	}
		
	#colRight .nurLink, #colLeft .nurLink { /*teaserbox*/
		text-align: center;
	}	
				
#colDetailPage #colRight {
	background-image:none;
}

/*****************************************/
/* Inhalt normal: mit colRight           */
/*****************************************/

#colInhalt {
	width: 65.966386%; /* 628:952 */
	margin: 0;
	padding: 0; 
	float: left;
	display: inline; /*IE6problem: doublemargin*/
}

#colInhaltRahmenUnten, #colInhaltRahmenOben {
	clear: both;
}

#sieSindHier
{
	float: left; display:block; 
	width:96.97581%;
	margin: 0px 0px 0px 0px;
	padding: 13px 1.5120967% 9px 1.5120967%; /* 15:992 */ 
	color: #929292;
	font-size: 1.2em; line-height: 18px;
	background:#c7deee;
	word-spacing:3px;
}

	#sieSindHier a:link, #sieSindHier a:visited {
		color: #006ab3;
		text-decoration: none;
	}
	
	#sieSindHier a:hover, #sieSindHier a:active {
		color: #000000;
		text-decoration: underline;
	}

#sieSindHierBottom {
	display:none;
}
#sieSindHierBottomFuss {
	max-width: 962px;
	margin: 0 auto 0 auto; padding: 10px 0 0 0; 
	text-align: left; font-size:1.2em; line-height:1.4em;
	color:#bfdaec; word-spacing:3px;
	border-bottom:3px solid #3689c3;
}

	#sieSindHierBottomFuss a:link, #sieSindHierBottomFuss a:visited {
		color: #FFF; text-decoration: none;
	}
	#sieSindHierBottomFuss a:hover, #sieSindHierBottomFuss a:active {
		color: #bfdaec;	text-decoration: underline;
	}
	


#fussZeile, #fussNavigation {
	clear: both; 
	width: 100%;
	padding: 0px;
	margin: 0px auto 0px auto;
	background:none;
	text-align: center;
	overflow: auto;
}

#fussZeile {
	margin-top:-17px;
	background: url(../pic/welle_fuss.png) repeat-x;
}


#fussNavigation {
	float: left;
	margin: 0;
	padding: 10px 0;
	text-align: center;
	width: 100%;
	background: #DEDEDE;
}

#sieSindHierUndSitemap {
	width:100%; margin-top:17px;
	background:#006ab3;
}

#sitemap {
	clear:both; display:block;
	max-width:962px; margin: 10px auto 0px auto;
	text-align:left;

}

	ul#sitemap ul {
		padding:0px; line-height:0px;
		display:block;
	}
	ul#sitemap li {
		float:left; width:16.6666%;
		line-height:0px;
	}

	ul#sitemap li a  {
		display:block;
		text-decoration: none;
		font-size:1.2em; line-height:2em;
		font-weight:normal;
	}
	ul#sitemap li a.sitemapMain {
		font-weight:bold;
	}
	ul#sitemap li a.abstand {
		margin-top:2em; 
	}

		ul#sitemap li a:link, ul#sitemap li a:visited  {
			color:#FFF;
		}
		ul#sitemap li a:hover, ul#sitemap li a:active  {
			color:#bfdaec;
		}

	ul#sitemap li ul {
		width:100%; overflow:auto;
	}
	ul#sitemap li ul li {
		width:100%; 
	}

#interactLink {
	clear:left;
	max-width:962px;
	margin: 40px auto 0 auto;
	height: 2em;
	text-align: center;
	font-size: 1em;
}
	#interactLink a:link, #interactLink a:visited {
		text-decoration: none;
		color:#BBBBBB;
	}
	#interactLink a:hover {
		text-decoration: underline;
	}


.mehr, .zurueck, .blaettern {
	margin: 0px 0px 5px 0px;

}
	.mehr {
		margin-bottom: 16px;
		text-align: right; 
		display: block; /* wegen IE6*/
		clear:right; /* wg. AudioPlayer */
	}
	
	/*iCalendar*/
	.mehr.outlook {
		margin-bottom: 16px;
		text-align: left; 
		display: block; /* wegen IE6*/
		float: left;
	}	
	
	
	.zurueck {
		text-align: left;
		clear:left;
	}

	.blaettern {
		margin-top: 20px;
		clear: both; font-weight: bold;
		float: left;
	}

	/*'detailblaettern*/
	.blaettern .vorher {
		float:left;
		width:100px;
		text-align:left;
	}
	
	.blaettern .seiteninfo {
		float:left;
		width:198px; /*'blaetternspezial*/ /*width:166px;*/
		text-align:center;
	}
	
	.blaettern .nachher {
		float:right;
		width:100px;
		text-align:right;
	}

	.mehr img {

	}

.datum {
	margin: 0px; float: left; font-weight: bold;
	color: #4A626C;
}


.loop {
	/* LoopStyle für eingebundene Loops: Abstand nach oben und unten */
	margin: 20px 0px 20px 0px; clear: left; /*float: left;*/
}

.loop .picGalerie { /*damit text unterhalb einer bildergalerie normal weitergeht 12.11.28*/
	margin: 0;
	float: left; display: inline;
}

.loopOhneAbstand {
	/* LoopStyle für Loops am Seitenbeginn */
}
#colRight .loopOhneAbstand,
#colLeft .loopOhneAbstand {
	overflow: auto; /*damit das element eine höhe erhält*/
}

.loopStartBoxes {
	/* LoopStyle für TextbausteinLoops in Boxenform */
	margin-bottom: 20px;
	/*overflow: hidden;*/
	float:left; display:inline;/*wichtig, damit es sich die höhe nimmt*/
}

	.loopStartBoxesXXX .tbsboxohrahmen, /*'neu1234*/ /*'neu1234 nochNach0799ZuMigrieren*/
	.loopStartBoxesXXX a {
		clear:left; float:left;
		display: block; padding:0px; margin:0 0 5px 0;
		width:48.407643%; min-height:215px; /* 304:628 */
		line-height:0px;
		text-decoration: none;
	}
	.loopStartBoxes > * { /*'neu1234*/ /*'neu1234 nochNach0799ZuMigrieren*/
		clear:left; float:left;
		display: block; padding:0px; margin:0 0 5px 0;
		width:48.407643%; min-height:215px; /* 304:628 */
		line-height:0px;
		text-decoration: none;
	}	


		/* 'neu1234 ersatz für obiges - jedes beliebige kindelement also a oder div zb*/ /*'neu1234 nochNach0799ZuMigrieren*/
		.loopStartBoxes > *:nth-child(2n+2) 	/* jeder 2. Baustein */ {
			clear:none; margin-left:3.1847133%;
		}
		/* 'neu1234 ersatz für obiges - bel. kindelemente erster ebene*/ /*'neu1234 nochNach0799ZuMigrieren*/
		.loopStartBoxes > *.missingNth { 		/* jeder 2. Baustein für IE-8 (vgl. inc_js_und_css.asp) */
			clear:none; margin-left:3.1847133%; /* 20:628 */
		}

		.loopStartBoxes a img {
			opacity: 0.99; /*damit FF nicht flackert in Kombi mit opacity und hover, muss hier 0.99 sein. 1 bzw 'nichts' führt zu flackern*/
		}
		.loopStartBoxes a:hover img {
			opacity: .7; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter: alpha(opacity=70);				
		}
	
		.loopStartBoxes a:hover h1 {
			background:#48a5e0;
		}

	.loopStartBoxes p {
		width:100%;	padding:4px 0 0 0; margin:0;
		font-size:1.2em; line-height:1.4em; color:#000;
	}


ul.loopListe {
	/* LoopStyle für sonstige Loops */
	width:100%;
}

	.loopListe li {
	}
	
	.loopListe li a,
	.textbaustein, /*'neu1234 nochNach0799ZuMigrieren*/
	.textbaustein a { /*'neu1234 nochNach0799ZuMigrieren*/ 
		clear:left; float:left; width:100%;
		display: block; padding:0px; 

	}

	.loopListe li a:hover {

	}

	.loopListe li a img {
		float:left;
		width:22.611464%; margin:0 0 20px 0;
		opacity: 0.99; /*damit FF nicht flackert in Kombi mit opacity und hover, muss hier 0.99 sein. 1 bzw 'nichts' führt zu flackern*/
	}

	.loopListe li a:hover img {
		opacity: .7; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter: alpha(opacity=70);
	}	

	.loopListe li a div.loopText {
		width:74.203821%; float:left;
		padding:0; margin:0 0 0 3.1847133%;
	}
	
	.textbaustein div.loopText { /*'neu1234 nochNach0799ZuMigrieren*/
		margin-top: 16px; /*damit es auf gleicher höhe wie detailseitenlead beginnt*/
	}
	.textbaustein div.loopText.withPic { /*'neu1234 nochNach0799ZuMigrieren*/
		margin-right: 3.26884%;
		margin-bottom: 15px;
		padding: 0;
		width: 71.29796%;
	}


		.loopListe li a div.loopText h2 {
			width:100%; min-height:14px; margin:0px; padding:5px 0 0 0;
			font-size:1.4em; font-weight:bold; 
			color:#ed7e22; /*UnterschBootsbauSegelschule*/
			line-height:1.3em;
		}
		
		.loopListe li a:hover div.loopText h2,
		.textbaustein a:hover h1 { /*'neu1234 nochNach0799ZuMigrieren*/
			color:#48a5e0;
		} 
	
		.loopListe li a div.loopText p { 
			clear:left; line-height:18px; 
			width:100%; padding:8px 0 0 0; margin:0;
			color:#000;
		}
		.textbaustein div.loopText p { /*'neu1234 nochNach0799ZuMigrieren*/	
			clear:left; width:100%; padding:8px 0 0 0; margin:0;
			font-size: 18px;
			line-height: 23.4px;
			font-weight: normal;
		}		
		.textbaustein div.loopText p:first-child { /*'neu1234 nochNach0799ZuMigrieren*/
			padding: 0;
		}
	
		.loopListe li a div.loopText p.datum {
			min-height:18px; padding:0 0 0 0;
			font-size:1.4em; line-height:1.3em;
		}

		.loopListe li a div.loopText p.mehr {
			font-weight:bold; 
		}		
		.loopListe li a div.loopText p.mehr,
		.textbaustein div.loopText p.mehr { /*'neu1234 nochNach0799ZuMigrieren*/
			float:right; width:50%; clear:none;
			padding: 0; margin: 8px 0 10px 0;
			color:#ed7e22; /*UnterschBootsbauSegelschule*/
		}
		.textbaustein div.loopText p.mehr { /*'neu1234 nochNach0799ZuMigrieren*/
			margin-bottom: 0;
			width: 100%;
		}

		.loopListe li a div.loopText p.outlook{
			float:left;	
		}

		.loopListe li a:hover div.loopText p.mehr,
		.textbaustein a:hover div.loopText p.mehr span:first-child { /*'neu1234 nochNach0799ZuMigrieren*/	 
			color:#48a5e0;
		}

		.loopListe li a:hover div.loopText p.outlook {
			color:#ed7e22; /*UnterschBootsbauSegelschule*/
		}
		
		.loopListe li a div.loopText p.outlook:hover {
			color:#48a5e0;
		}


.dot h1 { /* vgl. h2 */
	margin-top:15px; margin-bottom: 8px; padding: 0px;
	font-size: 1.3em; line-height: 1.3em; 
	color:#2F2F2F; border-bottom: 1px dotted #777777;	
}

.preissymbolAktion {
	color: #A20505;
	font-weight: bold;
}

.loopMarken, 
.loopProdukte {
	width:99.497487%; /* 396:398, wg. outline */
	margin:0px auto 0px auto;
}

.loopProdukte {
	clear:both;
}

	.loopMarken ul, .loopProdukte ul {
		list-style: none;
		padding:0px; margin:0px;
	}
	.loopMarken li, .loopProdukte li {
		 float:left; display:block; 
		 margin:0px 0px 10px 0px; padding:0px;
		 width:31.155778%; 
		 line-height:15px; font-size:11px;
		 position:relative; /* für absolute Platzierungen */
	}
	.loopMarken li.midElement, .loopProdukte li.midElement { /* mittleres ListenElement bei 3/Zeile */
		margin: 0px 3.2663316% 0px 3.2663316%;
	}
	.loopMarken li img, .loopProdukte li img {
		width:100%; margin:0px; padding:0px;
		border:0px none;
		outline:1px solid #ccc;
	}
	.loopMarken li span {
		margin:0px; padding:0px;
		display:block; width:100%;
		height:25px;
	}
	.loopMarken li:hover, 
	.loopProdukte li:hover {
		outline:1px dotted #60854E;
	}


	.loopProdukte li span {
		position:relative;
		margin:0px; padding:0px;
		display:block; width:100%;
		height:45px; background:#FFF;
	}
	.loopProdukte li span.preis {
		margin:0px; padding:0px;
		display:block; width:100%;
		background:#FFF; height:15px;
	}
	.loopProdukte li img.neu,
	.loopProdukte li img.schnaeppchen {
		width: 23.387096%;
		outline:0px none;	
	} 
	.loopProdukte li img.neu {
		position: absolute; left:0px; top:0px;
	}
	.loopProdukte li img.schnaeppchen {
		position: absolute; right:0px; bottom:0px; z-index:50;
		/*
		width:23.387096%;
		outline:0px none;
		*/
	}



/**********************************/
/* Inhalt inkl. colRight          */
/**********************************/
#colGanzeBreiteBorder {
	clear:both; 
	position:relative; top:-15px;
	width:100%;	padding:26px 0 0 0;
	background: url(../pic/welle_slider.png) no-repeat;
}

#colGanzeBreite, #colDynPage, #colDetailPage {
	width:95.967741%; /* 952:992 */
	background:#FFF;
	padding:2.016129% 2.016129% 0 2.016129%; /* 20:992 */
	margin:0;
}

	#colGanzeBreiteBorder .startseite {
		margin:0 1.5120967% 0 1.5120967%; 			/* 15 */
		padding:0.5040322% 0.5040322% 0 0.5040322%; /* 5 */
	}


/* Pseudo colRight - auch picDetailContainer beachten */
#colDynPage #colInhalt {
	width: 65.966386%; /* 628:952 */
	padding-right: 34.033613%; /* 324px; */	
}

/********************/
/* Table:           */
/********************/
table.tabreset { /*cellpadding/cellspacing/valign*/
	border-collapse:collapse; border-spacing: 0; /*ersetzt cellspacing="0" */
	padding: 0px; /*ersetzt cellpadding="0"*/
	margin: 0 auto; /*align (center)*/
}
table.tabreset th,
table.tabreset td { /*ersetzt (so gut wie) valign*/
	vertical-align: top;
}
td.tdl {
	text-align: left; /*align="left"*/
}
td.tdr {
	text-align: right; /*align="right"*/
}
td.tdc {
	text-align: center; /*align="center"*/
	margin: 0 auto;
}

table { 
	border-collapse:collapse; border-spacing: 0; /*ersetzt cellspacing="0" */
	width:100%;
	margin:10px 0 30px 0;
}

table td {
	vertical-align: top; /*valign=top*/
	font-size: 1.3em; line-height:1.8em;
	padding: 0px; /*ersetzt cellpadding="0"*/
	background:#e3e9ee;
}
table.preise tr.weisserBackground td,
table.sportwochen tr.weisserBackground td,
table.einspalter tr.weisserBackground td,
table.zweispalter tr.weisserBackground td,
table.dreispalter tr.weisserBackground td {
	background-color:#FFFFFF;
	padding: 0px 0px;
}
table.preise {
}
/* Standard-Zelle */
table.preise td, table.sportwochen td {
	text-align:right;
	padding:5px 15px 5px 15px;
	border-bottom:2px solid #FFF;
}
table.einspalter,
table.zweispalter,
table.dreispalter {
	/*fehlt*/
}
table.einspalter td,
table.zweispalter td,
table.dreispalter td {
	/*text-align:right;*/
	padding:5px 15px 5px 15px;
	border-bottom:2px solid #FFF;
}
/*breite inhaltsspalten*/
table.einspalter tr td,
table.zweispalter tr td,
table.dreispalter tr td {		
	/* white-space: nowrap; */
	text-align: right;
}
table.zweispalter tr td {		
	/*width:20%;*/
}
table.dreispalter tr td {		
	width:10%;
}
table.einspalter tr td:first-child,
table.zweispalter tr td:first-child,
table.dreispalter tr td:first-child {
	text-align:left;
	/* white-space: nowrap; */
}
table.zweispalter tr td:first-child,
table.dreispalter tr td:first-child {
	/*width:70%;*/
	width: auto;
	white-space: normal;
	text-align: left;
}
	/* Erste Zeile bzw. Titel-Zelle */
	table.preise tr:first-child td, table.preise tr td.titelZelle,
	table.sportwochen tr:first-child td, table.sportwochen tr td.titelZelle  
	{
		font-weight:bold;
		background:#c7deee;
		padding:6px 15px 1px 15px;
	}
	table.einspalter tr:first-child td,
	table.zweispalter tr:first-child td,
	table.dreispalter tr:first-child td {
		font-weight:bold;
		background:#c7deee;
		padding:6px 15px 1px 15px;
	}

	/* Breite zweite und dritte Spalte */
	/* eine weitere Zelle -segelschulpreise*/
	/*table.preise tr:first-child td*/
	table.preise tr:nth-child(2) td:first-child {		
		width:40%;
	}
	/* zwei weitere Zellen - sportwochenpreise*/
	table.sportwochen tr:first-child td,
	table.sportwochen tr:nth-child(2) td:first-child { 	
		width:60%;
	}
	table.einspalter,
	table.zweispalter,
	table.dreispalter {
		/*fehlt*/
	}


	/* Breite erste Spalte */
	/*
	table.preise tr:first-child td:first-child,
	table.sportwochen tr:first-child td:first-child {
		width:60%;
	}
	*/
	table.preise tr:nth-child(2) td:first-child {/*table.sportwochen tr:nth-child(2) td:first-child*/
		width:40%;
	}
	table.einspalter,	
	table.zweispalter,
	table.dreispalter {
		/*fehlt*/
	}


	/* Erste Spalte */
	table.preise td:first-child, table.sportwochen td:first-child {
		font-weight:normal;	text-align:left;
	}
	table.einspalter,
	table.zweispalter,
	table.dreispalter {
		/*fehlt*/
	}




.valignMiddle {
	vertical-align: middle;
}


table.vertikal tr td:first-child, table.horizontal tr:first-child td { /*linke spalten hervorheben bzw. erste zeilen hervorheben*/
	font-weight: bold;
	color: #333;
}


/*
  Bestellungsübersicht beim Tracking
*/
table.bestelluebersicht {
	margin-top:15px; 
	width: 100%;
	background:#F0F0F0;
}

table.bestelluebersicht td {
	font-size: 1.2em; padding:5px;
}

table.bestelluebersicht tr td:first-child { /*linke spalte*/
	/*
	font-weight: bold;
	color: #333;
	*/
}


/*
  Produkttabellen
*/
#produktvarianten {
	width: 100%;
	background:#DEDEDE;
	border: 0 none; line-height:1.5em;
	font-size:1.1em;
}

	#produktvarianten .alternateColor {
		background:#EAEAEA;
	}

/************************************/
/* TABELLEN-KOPF produktvarianten	*/
/************************************/
#produktvarianten thead td {
	height: 25px; padding: 0px 5px 0px 5px;
	font-weight: bold; text-align: center;
	background:#FCC400;	border-bottom: 1px solid #FFF;
}

	#produktvarianten thead td.tableVariante {
		border-right: 1px solid #FFF;
		text-align: left;
	}

	#produktvarianten thead td.tableVersand {
		width: 50px; 
		border-right: 1px solid #FFF;
	}

	#produktvarianten thead td.tableStk {
		width: 40px; 
		/* border-right: 1px solid #FFF; */
	}

	#produktvarianten thead td.tablePreis {
		width: 102px; 
		text-align: right;
	}

	#produktvarianten .preis{
		font-weight: bold; color: #000;
	}

/************************************/
/* TABELLEN-Inhalt produktvarianten	*/
/************************************/

#produktvarianten tbody td {
	border-bottom:1px solid #FFF;
}

	#produktvarianten tbody td.tablePic {
		width: 45px;
		padding:5px 0px 0px 0px; 
		margin: 0px;		
		vertical-align: top;
		text-align: center;
	}

	#produktvarianten img.picPreview {
		width: 34px; 
		border: 1px solid #FFF;
		padding:0px; 
		margin: 0px;
	}

	#produktvarianten tbody td.tableVariante {
		padding:5px 0px 3px 0px; margin: 0px;		
		border-right: 1px solid #FFF;
	}

	#produktvarianten tbody td.tableVersand {
		text-align: center;
		border-right: 1px solid #FFF;
		line-height:2.0em;
	}

	#produktvarianten tbody td.tablePreis {
		text-align: right; padding-right: 5px;
		line-height:2.0em;
	}

	#produktvarianten tbody .noBottomBorder {
		border-bottom: none;		
	}

	#produktvarianten tbody tr:hover {
		background: #FCDE77;
	}

table#versandtabelle {
	border: 0 none;
}

#versandtabelle thead {
	font-weight: bold;	
}

	#versandtabelle thead td {
		text-align: right;	
		padding: 0px 5px;
		background:#ccc;
	}

#versandtabelle tbody td {
	text-align: right;	
	padding: 0px 5px;
	background: #F2F2F2;
}


.vcardlink {
	border:0 none;
}
/********************/
/* Bilder           */
/********************/

/* Positionierung ausserhalb colInhalt in Pseudo-ColRight oder colRight*/
.picDetailContainer {
	width:43.969849%; /* width: 175px bezogen auf 398  */
	/* rechter Rand = Bildbreite + padding+rechterRand(colInhalt) als Minuswert*/
	/* linker Rand = rechterRand colInhalt, damit in IE und Firefox gleich*/

	/* margin:0px -48.241206% 0px 4.2713567%; */ /* -192, 17 bezogen auf 398 */

	/* margin:0 -324px 15px 0; */
	margin:0 -51.59236% 15px 0; /* 324:952 */ /* #responsive17 */
	padding: 0px;
	clear:right; float: right; display: inline;

	/* auch #colDynPage #colInhalt beachten */

}

#picContainer .picDetailContainer {
	width:100%;
}


#colRight .picDetailContainer {
	margin: 0px 0px 16px 0px;	/* Abstand oben wegen dynamischer Seiten */
}

/* Container für Bild im Textbaustein-Loop */
.picDetail {
	width:100%; /* 106px bezogen auf 398px */
	padding:0; margin:0; border:0px none;
}
	.textbaustein .picDetail { /*'neu1234 nochNach0799ZuMigrieren - 160x160*/
		float: right;
		margin: 0 0 15px 0;
		padding: 0;
		width: 25.4332%;
	}
	#colDynPage .picDetail, #colRight .picDetail, #colDetailPage picDetail {
		width: 100%; /* 138px; */ 
		margin: 0px 0px 0px 0px; 
		padding: 0px;
	}
	


/* intern - Bild innerhalb des Contents anzeigen */
.picIntern {
	width: 100%; /* 398px; */
	padding: 0px; 
	margin: 0px;
}

.picFullTeaser { /*teaserbox*/
	width:100%; 
	padding: 0px;
}

.picPreview {
/*
	margin: 2px 0px; border: 1px solid #D7E0EC;
*/
}

/*minibild*/
.picMini {
	float: left;
	margin: 0 0 20px 0;
	width:46.71053%; /* 142:304 */
}
.picDetailContainer .first {}
.picDetailContainer .last {
	float: right; 
}
/*end minibild*/

.picGalerie {
	width: 100%;
}

	/* klassische Bildgalerie, eCards */
	.picGalerie ul {
		margin: 0px 0px 0px 0px; padding: 0px;
		list-style: none; 
		width:100%;
	}
	
	.picGalerie	ul li {
		/*
		margin: 0px 12px 12px 0px;
		*/
		padding: 0px;
		float:left;	background: none;
		width:17.587939%;
		margin:0px 3.0150753% 6px 0px;
		
	}
	
	.picGalerie	ul li .picPreview {
		width:100%;
	}

	.picGalerie .last {
		margin-right: 0px;
	}

	.picGalerie a:link.ecard, .picGalerie a:visited.ecard {
		display:block; text-align: center;
	} 

	.picGalerie a:hover.ecard, .picGalerie a:active.ecard {
	
	} 


/********************/
/* Bilder allgmein  */
/********************/

img.picNull {
	margin:0;
	padding:0;
	border: 0 none;
}
img.picTrans {
	margin: 0;
	border: 0 none;
	background: #FFFFFF; 
	/* filter:Alpha (opacity=70); -moz-opacity:0.7; */
}
img#kopfImageX {
	margin: 0;
	padding: 0;
	width: 782px; 
	height: 160px;
}

img.ecard {
	width:396px; 
	border:1px solid #D7E0EC; /* 366 */
}

img.wirecard {
	width:50px;
}

/******************************************************************/
/* Formularelemente, vgl. auch kontaktformular.css, warenkorb.css */
/******************************************************************/

form, select, input, textarea, submit {
	margin: 0;
	padding: 0; 
}
/* Schriftfamilie dezidiert angeben! v.a. wegen textarea!*/
/* Schriftgröße in em, damit abhängig von default-body-Größe*/
select, input, textarea, submit {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.3em; line-height: 2.0em;
}



	/*busabfahrtsplan start*/
	form#abfahrtsplan {
		padding: 5px 5px 0 5px;
		background-color: #EFEFEF;
		border: 1px solid #BDDAD6;
		font-size: 1.2em;
		line-height: 1.6em;
	}
	form#abfahrtsplan #vonplan,
	form#abfahrtsplan #bisplan {
		overflow: auto;
	}
	form#abfahrtsplan #vonplan label,
	form#abfahrtsplan #bisplan label {
		display: block; float: left; 
		width:40px;
		font-size: 1em;
		line-height: 1.5em;
	}
	form#abfahrtsplan #vonplan label {
		padding-top: 3px;
	}
	form#abfahrtsplan #bisplan label {
		padding-top: 1px;
	}
	form#abfahrtsplan #std_t_start {
		width: 340px;
		font-size: 1em;
	}
	form#abfahrtsplan #stationradio {
		margin: 3px 0 8px 40px;
		display: block; overflow:auto;
	}
	form#abfahrtsplan input[type="radio"] {
		border-style:none;
		height: 12px;
		line-height: 12px;
		margin-top: 2px;
		margin-right:5px;
		/*display: block; float: left;*/
	}
	form#abfahrtsplan #fahrplansenden {
		clear: both;
		text-align: right;
	} 
	form#abfahrtsplan .stadtbus {
		text-align: left;
		position: relative;
		width: 140px; 
		height: 27px;
		margin-top: 7px;
		margin-left: 40px;
	}
	form#abfahrtsplan .stadtbus img {
		position: absolute;
		top: -4px; right: 0px;
	}
	form#abfahrtsplan .button  {
		float: right; 
		width: 115px;
		margin: -2px 0 0 0;
	}
	form#abfahrtsplan .button input {
		background: none;
		border: none;
		font-weight: bold;
		font-size: 1em;
		line-height: 1.2em;
	}	
	/*busabfahrtsplan ende*/
	
	
	
	/*busabfahrtsplan vers3 start*/
	form#schedule_widget {
		padding: 5px;
		background-color: #EFEFEF;
		border: 1px solid #BDDAD6;
		font-size: 1.2em;
		line-height: 1.6em;
	}
	form#schedule_widget #formVonPlan,
	form#schedule_widget #formBisPlan {
		overflow: auto;
	}
	form#schedule_widget #formVonPlan label,
	form#schedule_widget #formBisPlan label {
		display: block; float: left; 
		width:40px;
		font-size: 1em;
		line-height: 1.5em;
	}
	form#schedule_widget #formVonPlan label {
		padding-top: 3px;
	}
	form#schedule_widget #formBisPlan label {
		padding-top: 1px;
	}
	form#schedule_widget #name_origin {
		width: 340px;
		font-size: 1em;
	}
	form#schedule_widget #formFahrplanSenden {
		text-align: right;
		clear: both;
		overflow: auto;
	} 
	form#schedule_widget .fahrplanbutton {
		margin: 0;
		clear: both;
		text-align: right;
		overflow: auto;
	}
	form#schedule_widget .fahrplanbutton input {
		padding: 0 5px;
		font-weight: bold;
		font-size: 0.9em;
		line-height: 1.2em;
		float: right;		
		width: auto;		
	}	
	/*busabfahrtsplan ende*/
		

/*	#colInhalt form {

	}*/

	form input,
	form select {
		height: 24px; 
		background: #FAFAFA;
		border: 0px none;
		outline: 1px solid #7F9DB9;
	}
	
	form input {
		padding: 0px; 
	}	

	form textarea {
		padding: 0px 0px 0px 2px; 
		border: 1px solid #7F9DB9; background: #FAFAFA;
	}	

	form select {
		padding: 0 0 0 2px; 
	}

	/*laut bereastreet und webaim soll bei JEDEM focus-element (Links, Menü, Formulareingaben) ein möglichst gut sichtbares outline definiert werden, speziell für jene, die mit tastatur navigieren */
	:focus {
		/*outline: 5px ridge #7F9DB9 !important;*/ /*zu bedenken: betrifft nicht nur tastaturnav sondern auch klick auf link*/
	}
	form input:focus, 
	form textarea:focus, 
	form select:focus {
		background: #c8ddee; 
	}

	form option.hi {
		background: #c8ddee;	
	}


	form submit {
		width: 150px;
		border: 0 none;
	}

	label {
		margin:0px; padding: 0px; display:block;
		font-size:1.3em; line-height:1.9em;
	}

	.readonlyInput label { /*'formReadonly - label ausblenden*/ 
		/*display: none;*/
	}
	
	.readonlyInput input { /*'formReadonly*/ 
		background: #ddd !important;
		color: #777;
	}
		
	.readonlyInputFull { /*'formReadonly*/
		display: none; /*none, damit bei nicht-übergebenen parametern das themenfeld/referenzfeld nicht angezeigt wird. 2013-07-08 wieder aktiviert*/
	}
	

	

	
.button, .anmeldeform .button, a.button, .mehr a.jetztanfragenbutton, .mehr.jetztanfragenbutton a {
	display:block; float:right;
	width: 142px; height: 33px; 
	border: 0px none; outline:0px none;
	margin-left:5px; margin-top: 0px;
	padding:0px; 
	line-height: 33px;
	font-size: 12px; font-weight: bold; 
	text-align:center;
	background: #026baf; /* url(../pic/button.gif); */
	color: #FFF; cursor: pointer;

}


		input.button:link, input.button:visited,
		a.button:link, a.button:visited,
		.mehr a.jetztanfragenbutton:link, .mehr a.jetztanfragenbutton:visited,
		.mehr.jetztanfragenbutton a:link, .mehr.jetztanfragenbutton a:visited {
			color: #FFF; text-decoration: none;
		}
		input.button:hover, input.button:active,
		a.button:hover, a.button:active,
		.mehr a.jetztanfragenbutton:hover, .mehr a.jetztanfragenbutton:active,
		.mehr.jetztanfragenbutton a:hover, .mehr.jetztanfragenbutton a:active {
			color: #48a5e0; 
			text-decoration: none;
			/* background: url(../pic/button-hi.gif); */
		}

		a.intoWarenkorb:link, a.intoWarenkorb:visited  {
			width:100px; 
			height: 18px; 
			display: block; 
			float:right; 
			margin: 0px; 
		}
		a.intoWarenkorb:hover, a.intoWarenkorb:active {
			text-decoration: underline;
		}
.anmeldeform .button, .einspalter .button, .zweispalter .button, .dreispalter .button, .preise .button, .sportwochen .button, .mehr a.jetztanfragenbutton, .mehr.jetztanfragenbutton a {
	float:right; 
	/* width:90px; */
}


img.thumbnail {/*Thumbnail-Bilder bei Presse in der rechten Spalte*/
	border: 0 none;
}

/********************************************************************/
/* Style-Sheets für Produkte-Loop und Detailseite mit Bestellbutton */
/********************************************************************/

.ohneBottomAbstand {
	margin-bottom: 0px;
}

/* Loop */
dd .preis {
	float:left; margin-top:-15px;
}

dd .button {
	float:right; margin-top:-6px;
}

/* Detailseite */
#preisUndBestellen {
	padding: 10px 10px 0px 10px; margin: 20px 0px 18px 0px;
	clear:both;	background: #E2E2E2;

}

	.ohneProduktDetail {
		height:45px;
	}
	
	.mitProduktDetail {
		height:70px;
	}

	#preisUndBestellen .preis {
		float:left;
	}
	
	#preisUndBestellen #bestellen {
		padding:0px; text-align:right; margin-top:14px;
	}

	#preisUndBestellen form {
		float:right;
	}
	
	.buttonInaktiv {
		width:100px; 
		padding-right:0px;
		background: none; 
		text-align: right; 
		border: 0 none;
	}

	#produktDetail1 {
		width:130px; 
		margin-bottom:5px;
	}
	
	.produktAnzahl {
		width:45px; 
		float:left; 
		margin-left: 5px;
	}

#abPreisBox {
	width: 97.487437%; /* 388px; */ 
	height: 20px;
	padding: 1.2562814%; /* 5px; */
	text-align: right;
	background: #FCC400;
	font-size:1.2em; line-height:1.9em;
}

	#abPreisBox .preis {
		float: right; font-weight: bold; color: #000;
	}

	.preisHinweisMwst {
		width: 98.743718%; /* 393:398 */
		padding: 5px 1.2562814% 10px 0px; /* 5:398 */
		text-align:right;



	}

.preisInline {
	white-space:nowrap; font-weight: bold;
}

/*****************/
/* PopupHinweise */
/*****************/
/*****************/
/* PopupHinweise */
/*****************/
#popupHinweis {
 position: absolute; z-index:500; top: 280px; margin-left:75px;
 width: 252px; height: 153px; padding:5px 4px 0px 4px;
 background: #E8E8E8; border: 0 none;
 background: url(../pic/popup_schlagschatten.png) no-repeat;

 /* filter:progid:DXImageTransform.Microsoft.Shadow(Color=#BDBDBD, direction=135, strength=8); */
}    

#popupHinweis .x {
	position: absolute; right:5px; top:5px;
}

#popupHinweis .titel {
 height:18px; padding:10px 0 0 0;
 border-bottom:2px solid #FFF;
 text-align:center; line-height:12px;
 font-size:12px; font-weight:bold;
 background: #114398; color:#FFFFFF;
 position: relative;
}    

#popupHinweis .titel a:link, #popupHinweis .titel a:visited {
 font-size:12px; color:#000; font-weight: bold;
 text-decoration:none; color:#FFF;
}
#popupHinweis .titel a:hover, #popupHinweis .titel a:active {
 color:#F3C83E;
}

#popupHinweis .close a:link, #popupHinweis .close a:visited {
 font-size:11px; color:#000; font-weight: bold;
}
#popupHinweis .close a:hover, #popupHinweis .close a:active {
 color:#114398;
}


#popupHinweis .text {
 background: #F3E4B5;
 padding:5px;text-align:center;
 font-size:1.2em; color:#000000;
}    

#popupHinweis .close {
 height: 25px; padding-top:10px;
 font-size:12px; color:#000000;text-align:center;
 background: #F3CD55;
} 



.hinweisBox {
	clear:left; width: 368px; display:block;
	padding:10px 15px 5px 15px; margin: 10px 0px 10px 0px;
	color: #191916; background:#F3CD55;
}

.hinweisBox h2 {
	margin-top:0px;
	color: #C00404;
} 

/*****************/
/* Indexfilter   */
/*****************/
#indexfilter {	/* Form */
	/* background:  #E0E0E0; */
	padding: 0px 0px 10px 10px; margin: 0px 0px 18px 0px;
	clear:both; 
	/* background: url(../pic/punktiert.gif); border: 0 none; */
	background: #E5E4E3;
}
	
	.indexfilter {	/* DIV */
		margin: 0px; padding-top:5px; height: 40px;
	}
	
	.indexfilterCheckbox {	/* DIV */
		margin: 4px 0px 0px 0px; padding-top:0px; height: 30px;
		float:left; display: block;
	}

	#indexfilter label {
		font-weight:bold; color: #595959;
		display: inline;/*wichtig damit label neben checkboxen die richtige breite erhalten - checkboxnewinsert*/
	}

	#indexfilter label.produktKategorie {
		color: #000;
	}
	
	#indexfilter .button {
		margin: 0;
	}

	
	.formfeld {
		float:left;
	}

	.formfeldCheckbox {
		float:left; 
		width: 190px; 
		padding-top:10px;
		font-size:1.2em; line-height:18px;
		color:#171717;
	}

	.formfeldCheckbox, .formfeldBeschriftungAktiv {
		color:#171717;
	}

	.formfeldBeschriftungInaktiv {
		color:#B0AEA3;
	}


	.formfeldRechts {
		float:right; margin-right: 10px;
		display:inline;
	}
	
	form p {
		clear:both;
	}

	form .inputNormal {
		width:179px;
		margin-right: 10px;
	}
	form .inputSchmal {
		width:55px;
		margin-right: 10px;
	}

	form .selectNormal {
		width:183px;
		margin-right: 10px;
	}
	form .selectSchmal {
		width:57px;
		margin-right: 10px;
	}

	form .selectBreit {
		width:202px;
		margin-right: 10px;
	}

	form .selectDoppelt {
		width:376px;
		margin-right: 10px;
	}	
	
	form .checkbox {
		width: 21px;
		border: 0 none;
		float: left;
	}

	.formfeldCheckbox .checkbox {
		margin-right: 5px; display:block;
	}
	
	.feed { /*rss-feed-erweitert*/
		margin: 0 0 0 3px;
		padding: 0 0 0 19px;
		background: url("../pic/feed-icon-14x14.png") no-repeat 0 50%; /*color image repeat attachment position;*/
	} 
	
	.feedFiltered { /*rss-feed-erweitert*/
		margin: 0 0 0 3px;
		padding: 0 0 0 19px;
		background: url("../pic/feed-icon-14x14-half.png") no-repeat 0 50%;
	}	
	
	.feed-list { /*rss-feed-erweitert*/
		margin: 0 0 15px 15px;
		padding: 0;
		list-style-type: none;
	}
	
	.feed-list li { /*rss-feed-erweitert*/
		margin: 0 0 10px 0;
		padding: 0;
		list-style-type: none;
	}
	
	.feed-list li a { /*rss-feed-erweitert*/
		padding: 0 0 0 19px;
		background: url("../pic/feed-icon-14x14.png") no-repeat 0 50%;
		list-style-type: none;
		color: #000;
	} 	
	

	.unscheinbar { /*rss-feed-erweitert*/
		font-size: 0.7em;
		font-style: normal;
		font-weight: normal;
	}

	a:link.feed, a:visited.feed, a:link.feed, a:visited.feed,
	a:link.feedFiltered, a:visited.feedFiltered, a:link.feedFiltered, a:visited.feedFiltered { /*rss-feed-erweitert*/
		text-decoration: none;
		display: inline !important;
	}
	
	/*teaserbox-style*/
	#colRight .userStyle1, #colLeft .userStyle1 {
		background-color: #FFCC66;
	}

	/*'teaser-termindatum-ausblenden*/
	.teaserGesamt .eventdate {
		display: none;
	}




/************************************
 404-suche und hinweistext 2013-06-26
 ***********************************/
	#fehlerhandling404 #suchmaske404 {
		float: left; 
		clear: left;
		width: 100%; 
		height:auto;
		margin: 0px; 
		padding: 10px 0px 0px 0px;
		overflow: hidden; 
	}
	#fehlerhandling404 form#formSuche404 { 
	}
	#fehlerhandling404 form#formSuche404 #suche404 {
		width: 48.571428%; 
		float:left; 
		margin-left:5.7142857%; 
	}
	#fehlerhandling404 form#formSuche404 .button {
		margin-top: 0 !important;
		width: 38.857142%;
	}
	#fehlerhandling404 #fehlermeldung404 #oops404 {
		font-size: 2em;
		line-height: 6em;
		text-align: right;
	}
	#fehlerhandling404 #fehlermeldung404 p.klein {
		margin-top: 25px;
	}
	#fehlerhandling404 .mehr {
		margin-top: 60px;
	}
	
/************************************
 Hinweistext für den User in hervorgehobener Box auf Detailseiten bei der Preview  
 ' preview_hinweis_box
 ************************************/
div#previewHinweisText {
	margin: 2px;
	padding: 2px;
	color : #000000;
	background-color: #FFFF99;
	border: 2px groove #000;
}

div#previewHinweisText h1 {
	margin: 0 0 2px 0;
	padding: 0;
	font-size: 1.2em;
	line-height: 1.4em;
}

form input.urlTextBox {
	width: 90%;
	height: 12px;
	line-height: 1.2em;
	padding: 0;
}

.textHiBereich {
	font-weight: bold;
	color: #171717;
} 

table.preview_box {
	width: 100%;
	line-height: 1.2em;
	font-size: 1em;
}

table.preview_box td {
	vertical-align: top;
}

table.preview_box td.ueberschrift {
	font-variant: small-caps;
	font-weight: bold;
	font-size: 1.2em;
}

table.preview_box td.bereichsbezeichnung {
	white-space: nowrap;
	vertical-align: top;
}

table.preview_box td.abstandhalter {
	padding-bottom: 20px;
}

table.preview_box td.linkspalte {
	width: 90%;
}

iframe {
	border: 0 none;
}
#uploadframe { /*iframe fileupload width:376px;height:100px;margin:0px;padding:0px;*/
	margin: 0;
	padding: 0;
	border: 0 none;
	width: 376px;
	height: 104px;	
	overflow: auto; /*scrolling=auto*/
	/*overflow: hidden;*/ /*scrolling=no*/
}

/*twitterfollow achtung IE6*/
#socialnet {
	background: url(../pic/social_bg.png) no-repeat;
	width: 80px;
	height: auto;
	position: fixed;
	border: 0 none;
	top: 37%;
	right: 0px;
	z-index: 500;	
}
#twitterfollow {
/*
	display: scroll;
	position: fixed;
	border: 0 none;
	top: 43%;
*/
	position: absolute;
	top: 50px; 
	right: 0px;
	z-index: 999;
}
#socialnet a {
	padding-bottom: 5px;
}

/*
'hreftypico:
a[href ^="http://"] - Links, deren href-Attributwert mit http:// beginnt
a[href $=".ogg"] - Links, deren href-Attributwert auf .ogg endet
a[href *=".gzip"], a[href *=".GZIP"] - wo .gzip vorkommt 
*/
a.dokicon, a.icondesc[href $=".jpg"], a.dokiconlink[target], a.dokiconbildsymbol, a.dokiconroutenplaner {
	padding: 1px 0px 1px 0px;
}
a.icondesc[href $=".jpg"], a.dokicon[href $=".jpg"], a.dokicon[href $=".jpeg"] { /*icondesc=Presse Beschreibungstext unter Bild in der rechten Spalte*/
	/* background: url(../pic/ico_kl_jpg.gif) no-repeat center right; */
}
a.thumbnail[href $=".jpg"] { /*Link um Thumbnail-Bilder bei Presse in der rechten Spalte*/
	background: none !important;
	padding: 0 0 5px 0;
}
a.dokiconlink[target="_blank"], a.dokiconlink[target="_self"] { /*externe Links zB auf Presseseite*/
	/* background: url(../pic/ico_kl_ext.gif) no-repeat center right; */
}
a.dokiconbildsymbol[href *=".jpg"] { /*[bild]01,symbol[/bild]*/
	/* margin-right: 5px; margin-left: 5px; */ /*damit es nicht am Text klebt, falls es nur das nakte Symbol ist*/
	/* background: url(../pic/ico_kl_jpg.gif) no-repeat center right; */
}
a.dokiconroutenplaner { 
	/*background: url(../pic/ico_kl_map.gif) no-repeat center right;*/
}
a.dokicon[href $="typ=.iCal"], a.dokicon[href $="typ=.vCard"] { /*iCal speichern bei Termin oder vcard*/ 
	/*background: url(../pic/ico_kl_events.gif) no-repeat center right;*/
}
a.dokicon[href $="typ=.vcardkontakt"] { 
	/*background: url(../pic/ico_kl_vcard.gif) no-repeat center right;*/
}
a.dokicon[href $=".mp3"] { /*mp3s enden noch nicht mit typ=.mp3*/
	/*background: url(../pic/ico_kl_mp3.gif) no-repeat center right;*/
}
a.dokicon[href $=".flv"] { /*flvs enden noch nicht mit typ=.flv*/
	/*background: url(../pic/ico_kl_flv.gif) no-repeat center right;*/
}
a.dokicon[href $=".pdf"] {
	/* background: url(../pic/ico_kl_pdf.gif) no-repeat center right; */
}
a.dokicon[href $=".png"], a.dokicon[href $=".tif"], a.dokicon[href $=".psd"] {
	/* background: url(../pic/ico_kl_Bilder.gif) no-repeat center right; */
}
a.dokicon[href $=".ppt"], a.dokicon[href $=".pps"], a.dokicon[href $=".exe"] {
	/* background: url(../pic/ico_kl_dummy.gif) no-repeat center right; */
}
a.dokicon[href $=".gif"] {
	/* background: url(../pic/ico_kl_gif.gif) no-repeat center right; */
}
a.dokicon[href $=".txt"], a.dokicon[href $=".csv"] {
	/* background: url(../pic/ico_kl_txt.gif) no-repeat center right; */
}
a.dokicon[href $=".rtf"], a.dokicon[href $=".doc"] {
	/* background: url(../pic/ico_kl_doc.gif) no-repeat center right; */
}
a.dokicon[href $=".xls"] {
	/* background: url(../pic/ico_kl_xls.gif) no-repeat center right; */
}
a.dokicon[href $=".zip"] { 
	/* background: url(../pic/ico_kl_zip.gif) no-repeat center right; */
}



.webindexbody { /*body von seiten mit iframe-einbindung forward+index+sprache/index*/
	text-align: center;
	padding:0px; margin:0;
}
.webindexloops { /*body von seiten mit iframe-einbindung für suchmasch.loops index+sprache/index*/
	width: 450px; 
	margin: auto;
}

#colRight #teasercontentEmpty {
	margin-top: -28px;
}

#seiteBestellung #colDetailPage {
	width: 100%;
}
#seiteBestellung #colInhalt {
	width: 100%;
	background: #FFF;
}
#seiteBestellung #bestellungsinputbuttonResumewarenkorb {
	float: right;
	width: 200px;
}
#seiteBestellung #bestellungsinputbuttonBestellungdrucken {
	float: right;
	margin-top: 13px;
}
#warenkorbKontoZurueckbutton {
	float: left;
}
img.warenkorbAdresstabelleAendernbutton {
	border: none;
	float: right;
	position: relative; 
	top: 0px;
	width: 84px;
	height: 21px;
}
#warnkorbAdresstabelleLieferadressblock {
	float: left;
	margin: 5px 0 0 0;
}
.warenkorbHinweisblock {
	padding: 5px 10px;
	clear: both;
}
#warenkorbHinweisZahlungsvorgang {
	text-align: left;
	margin-left: 32px;
}
#warenkorbBottomNavigation .zurueck,
#warenkorbButtomNavigation .fltLeft {
	float: left;
}
#warenkorbBottomNavigation .weiter {
	clear: right;
	float: right;
}
#warenkorbBottomNavigation input.wartend {
	float: right;
	color: #CCCCCC;
	cursor: wait;
}
.warenkorbTabelleText .spartippVersandkosten {
	margin-bottom: 10px;
	width: 300px;
}
.auswahllisteBackground, 
.noBg {
	background: none;
}
.attachBox {
	width: 344px;
}
.ortZusatz {
	font-weight: normal;
}
#abPreisBox a {
	float: left;
}
.minderHeight {
	height: 20px;
	padding-top: 10px;
}
.kontaktGeoLink {
	margin-bottom: 6px;
}
.kontaktUrl {
	margin-bottom: 14px;
}
.vcardBlock {
	margin-bottom: 0;
}
.indexfilter .formfeld label.suchsubmit {
	font-weight: normal;
}


#fussZeile .abst {
    padding: 0 2px;
}

/*'2013-07-01 browser-update - hinweis auf alte version*/
.buorg {
	padding: 15px !important;
}


/*********************
Scroll-To-Top Button -> siehe lib/scrolltotop/
**********************/

/*****************************************/
/* RESPONSIVES CSS #responsive17
/*****************************************/

.responsiveMapsContainer { /*iFrame Anfahrt*/
	position: relative;
	height: 0;
	padding-bottom: 60%; /* Höhe Map*/
	overflow: hidden;
}	 
.responsiveMapsContainer iframe {  /*iFrame Anfahrt*/
	position: absolute;	top: 0;	left: 0;
	width: 100%;
	height: 100%;
}


@media all and (max-width:767px) { /*mobile, alles unter ipad3 hochformat. */	
	.justDesktop {
		display: none !important;
	}
}
@media all and (min-width:768px) {
	.justMobile {
		display: none !important;
	}
}



/*****************************************/
/* 1040px
/*****************************************/

@media all and (max-width:1040px) {
	#kopfLogo {
		padding-left:2%; width:48%;	
	}

	p#location, div#location, #topNavigation {
		padding-right:2%; width:48%;	
	}

}

/*****************************************/
/* 900px
/*****************************************/

@media all and (max-width:900px) {

	#sieSindHierBottomFuss {
		padding-left:2%; padding-right:2%;
	}

	#sitemap {
		padding:2%;
	}
	ul#sitemap li {
		width:33%;
	}
	#fussSpalte4 {
	clear:both;
	}

	table.einspalter td,
	table.zweispalter td,
	table.dreispalter td {
		/*text-align:right;*/
		padding:5px 7px 5px 7px;
		font-size:1.2em;
	}

	table.einspalter tr:first-child td,
	table.zweispalter tr:first-child td,
	table.dreispalter tr:first-child td {
		padding:6px 7px 1px 7px;
		font-size:1.2em;
	}

}

/*****************************************/
/* 620px
/*****************************************/

@media all and (max-width:620px) {
	
	#fussSpalte1 {
		margin-bottom:20px;
	}
	#fussSpalte2 {
		clear:both;
		margin-bottom:20px;
	}
	#fussSpalte3 {
		clear:both;
		margin-bottom:20px;
	}
	#fussSpalte4 {
		clear:both;
		margin-bottom:20px;
	}
	#fussSpalte5 {
		clear:both;
		margin-bottom:20px;
	}
	#fussSpalte6 {
		clear:both;
		margin-bottom:20px;
	}

}



/*****************************************/
/* 800px
/*****************************************/

@media all and (max-width:800px) {

	#colRight div.halb {
		float:none;
		width:100%;
	}

		.teaserGesamt > .halb:nth-child(2n+2){
			margin-left:0;
		}
		.teaserGesamt > .missingNth{
			margin-left:0;
		}
}


/*****************************************/
/* 680px
/*****************************************/

@media all and (max-width:680px) {

	#kopfLogo {
		width:58%; padding-left:2%;
	}
		#kopfLogo img {
			width:100%; max-width:320px;
		}

	p#location, div#location, #topNavigation {
		padding-right:2%; padding-top:24px; width:auto; 	
	}

	#liTopImpressum, #liTopNewsletter, #location { /* .vcard */
		display:none !important;		
	}
}


/*****************************************/
/* 600px
/*****************************************/

@media all and (max-width:600px) {

	#colInhalt {
		width: 100%;
		float: left;
		display:block;
	}

	#colRight {
		clear:both; margin-top:20px;
		width: 100%;
		margin: 0; 	/*  20:952 */
		padding: 0;  
		float: left;
		text-align: center;
		display:block;
	}

	#colDynPage #colInhalt {
		width: 100%;
		padding-right: 0;
	}

	#colRight .teaserGesamt, #colRight #picContainer {
		max-width: 350px;
		margin:20px auto 20px auto;
	}

	/* PLATZIERTE FOTOS */
	#colRight .picDetailContainer,
	#colInhalt .picDetailContainer	
	 {
		display:block;
		clear: both; float: none;
		padding: 0;
		margin: 15px auto 0 auto;
		width: 100%; height:auto; 
		max-width:350px;
		text-align:center;
	}

	#colInhalt .picDetailContainer .picDetail,
	#colRight .picDetailContainer .picDetail {
		width:100%;
		float:none;
	}


}


/*****************************************/
/* 450px
/*****************************************/

@media all and (max-width:450px) {

	.loopStartBoxes {
	}

	.loopStartBoxes > * { /*'neu1234*/ /*'neu1234 nochNach0799ZuMigrieren vollflaechenclick*/
		clear:both; float:none;
		width:100%;
	}	

		/* 'neu1234 ersatz für obiges - jedes beliebige kindelement also a oder div zb*/ /*'neu1234 nochNach0799ZuMigrieren vollflaechenclick*/
		.loopStartBoxes > *:nth-child(2n+2) 	/* jeder 2. Baustein */ {
			clear:both; margin-left:0;
		}
		/* 'neu1234 ersatz für obiges - bel. kindelemente erster ebene*/ /*'neu1234 nochNach0799ZuMigrieren vollflaechenclick*/
		.loopStartBoxes > *.missingNth { 		/* jeder 2. Baustein für IE-8 (vgl. inc_js_und_css.asp) */
			clear:bot; margin-left:0; /* 20:628 */
		}
	
}