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

/*form reset*/
button,textarea,select,input{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;-webkit-background-clip: padding;-moz-background-clip: padding;background-clip:padding-box;-webkit-border-radius:0;-moz-border-radius:0;-ms-border-radius:0;-o-border-radius:0;border-radius:0;background-color:#fff;color:#000;outline:0;margin:0;padding:0;text-align:left;font-size:100%;height:2em;vertical-align:middle;}/*-webkit-appearance:none; weg, da sonst in chrome nicht ordentlich*/
button,input{line-height: normal;}
button[disabled],input[disabled]{cursor: default;}
input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;height:13px;width:13px;}/*webkit-appearance wegen chrome, sonst nicht oder nur kaum sichtbar*/
textarea{overflow: auto;vertical-align:top;}
input{line-height: normal !important;}/*wegen FF bug*/
form{position: relative;}
form,select,input,textarea,submit,input[type="submit"],button{margin:0;padding:0;}
select,input,textarea{padding:0.5em;}
option{margin:0;padding:0 3px;/*line-height: normal !important;*/}
input[type="submit"],button{padding:0.5em;} /* !important;*/

/*
Klassennamen ausschließen (nicht class):
div:not(.classXXX) {
	font-weight: bold;
}
*/
/*
resetting box-sizing:
content-box: Default. The width and height properties (and min/max properties) includes only the content. Border, padding, or margin are not included
border-box: The width and height properties (and min/max properties) includes content, padding and border, but not the margin
initial: Sets this property to its default value.
inherit: Inherits this property from its parent element
*/
html {
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box; /* Firefox, other Gecko */
	box-sizing: border-box; /* Opera/IE 8+ */
	/* height: 100%; */
}
*, *:before, *:after {
	box-sizing: inherit;
}
img { 
	box-sizing: content-box;
	color:#FFF;
	opacity: 1; transition: opacity 1s; /* #lazyLoad */
}

img[data-src] {
	opacity: 0; 						/* #lazyLoad */
}


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



/****************************/
/* BODY & SEITE (zentriert) */
/****************************/

html {
	-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: 0; 
	padding: 0;
	height: 100%;/*wegen bg*/
	text-align: center;  /*IE*/
	color: #090909;
	/*
	background: url(../pic/back.jpg);
	scroll-behavior: smooth; vgl. smoothscroll.js 
	*/
}
body, input, textarea, button { /* Schriftfamilie dezidiert angeben! v.a. wegen textarea!*/
	font-family:"Source Sans Pro",Arial,Helvetica, sans-serif;
}

body, body.fontswitchNormal {
	font-size: 62.5%; line-height:1em;
}
body.fontswitchBig { 
	font-size: 70%; line-height:1.1em;
}
body.fontswitchBiggest { 
	font-size: 80%; line-height:1.2em;
}


body#tinymce { /*iframebody*/
	padding: 5px; /*wichtig für randabstand im eingabetextfeld!*/
}


/*
	padding darf bei border-box bei #seite nie prozentuell angegeben werden. am besten padding: 0 und dann padding über #seitencontent steuern
	#seite sollte nur die volle breite des inhalts inkl. dem "virtuellen und unsichtbaren" rand zum gerät hin enthalten.
*/
#seite {
	clear:both; width:100%;
	min-width: 320px; /*wichtig wegen mobiler geräte, der max bereich.*/
	max-width: 1200px; /* =100% ... 1052 seitencontentbreite + 2*10px(2*1%)padding bei seitencontent -> also wie wenn ehemalige seite 768 breit gewesen wäre*/ 
	padding: 0;
	margin: 0px auto 0 auto;
	background-color:rgba(255,255,255,0.3);
}

#seite #seitencontent {
	
	/* position:relative; z-index:10; */
	float:left;
	width: 100%; max-width:1200px;
	margin: 0 0 0 0;

	padding: 0 0 30px 0; /*1% von weite von #seitencontent (also relativ zur weite). wird den 100% der contentweite abgezogen*/
	border:0px none;

	/* http://www.css3generator.in/css-gradient.html */

}


/*wrapper*/
/*box zentrieren/div zentrieren -> <div class="wrapCenter1"><div class="wrapCenter2">[zentrierter content]</div></div>*/
.wrapCenter1 {position: absolute; left: 50%;}
.wrapCenter2 {position: relative; left: -50%;}


/*******************/
/* Variablen   *    /
/*******************/
:root {

	/*color */
	--colGrau: #6f6f6f;
/* #5b5452 */
}




/*******************/
/* Allgemeines*     /
/*******************/

h1 {
	margin: 0px 0 15px 0; /* Korrektur durch erhöhte line-height*/
	padding: 0;
	
	color:#0a0a0a;
	font-family:"Source Sans Pro",Arial,Helvetica, sans-serif;  font-weight:400;

	font-size:4.5em;
	line-height:1.2em;
	text-align:left;
}
	
	#colGanzeBreite .loopOhneAbstand h1 {
		text-align:left;
	}

	#produktdetail h1,
	.loopOhneAbstand h1 {
		clear: left; /* nötig für kurztextige Textbausteine wegen Umbruch, Problem wenn */
		width: 100%;
		/* text-transform:uppercase; */
		text-align:left;
	}

	.loopOhneAbstand h1 a, .loopMitAbstand h1 a {
		text-decoration: none !important;
	}


#abPreis {
	display:inline;
	float:right;
	width:auto; min-width:159px;
	padding:0 1% 0 1%;

	background:#47c0ec;
	color:#daf2fb;
}	


h2, h2.lead, p.lead {
	margin:0 0 25px 0; 	
	font-size:2em;

	font-family:"Source Sans Pro",Arial,Helvetica, sans-serif;  font-weight:600;

	line-height:1.66em;	
	color: var(--colGrau);
}
	h2,
	#tinymce h2 { /*detailseiten-zwischenüberschriften*/
		clear:left;
		border-top:1px dashed var(--colGrau);
		border-bottom:1px dashed var(--colGrau);
		min-height:40px; padding-top:8px; padding-bottom:5px;
		color:#000;
	}
	/* Lead */
	h2.lead, p.lead,
	#tinymce h2.lead, #tinymce p.lead,
	.loopText h2, .loopStartBoxes h2 {
		border:none; min-height:inherit;
	}
	h2.lead, p.lead,
	#tinymce h2.lead, #tinymce p.lead,
	.textbaustein div.loopText p { /*'neu1234 nochNach0799ZuMigrieren vollflaechenclick*/

	}	
	.loopContainer h2, 
	dl h2 {
		margin: 0;
		clear: none;
	}
	h2.anmeldeformular { /*angehängte formulare*/
		margin-top: 25px;
	}

	h2 a:link, h2 a:visited {
		text-decoration: none;
		/* float:right; vgl. klimaneutrales webhosting */
	}

	h2 a.rechts:link, h2 a.rechts:visited {
		text-decoration: none;
		float:right;
	}


	/*focus wegen ie10 - back weg*/
	h2 a:hover, h2 a:active {
		text-decoration: underline;
	}

	.loopListe li div.loopText h2 {
		clear:left;
		margin:0; padding:0;
 		font-weight:600;
	}

	a:link h2, a:visited h2 {
		color:#e4011f;
	}

	a:hover h2, a:active h2 {
		color:#000;
	}


	/* h2 in start-text-bausteinen bzw. in loopStartBoxes allgemein */
	.loopStartBoxes h2,
	.loopStartBoxes .loopListe li div.loopText h2 {
		/* 12px + 316px + 12px */
		width: 100%; margin:0 0 1px 0;
		padding:0;
		display:block;
		white-space:normal;
		text-decoration:none; text-align:left;
		/*background: url(../pic/trenn_center.png) no-repeat bottom center;*/
		padding-bottom:0px;
	}

h3 {
	margin:0 0 0 0; 	
	font-size:2em; line-height:1.66666em;
	font-family:"Source Sans Pro",Arial,Helvetica, sans-serif;
	font-weight:600;
	color: var(--colGrau);
}

	h3.datum, h3.date {
		font-size:2em; line-height:1.3333em;
		color:#434748;
		font-weight:400;
		margin-bottom:16px;
	}

h5 {
	min-height:40px;
	font-size: 1.5em; line-height: 1em;
	font-weight:600;

	border-top:1px dashed var(--colGrau);
	border-bottom:1px dashed var(--colGrau);
	min-height:40px; padding-top:4px;

	}



	/*Navigations-h5 (navLeft und verlinkte Überschriften in Teaser)*/
	h5 a {
		/*font-size: 13px; line-height:15px;*/
	}

	h5 a:link, h5 a:visited {
		text-decoration: none;
	}

	h5 a:hover, h5 a:active {
		text-decoration: none;
		color: #000000;
	}



dl {
	width: 100%; 
	margin: 0 0 20px 0;
	float: left;
}

	dt {
		margin: 0 0 3px 0;
		clear: left;
		background:#f6e1ba; overflow:auto;
		/*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: 0 0 20px 0;
		float: left;
	}

	dt .picPreview {
		width: 17.085427%; /* 68/398 */
		margin: 3px 2.5125628% 20px 0; /* 10px */
		float: left; 
		border: 0;
		
	}
	

	
	img.picPreview.feedImg { /*extern eingebundene rss feeds*/
		width: 68px;
	}
	
	dd.noPic {
		width: 100%;
	}


p {
	margin: 0 0 25px 0; padding: 0;
	text-align: left; font-size:2em;
	line-height:1.6em; 
	/*font-size: 1.2em;*/ /*Achtung: selbe font-size auch dem picContainer zuweisen*/
	/*
	/* clear:left; verträgt sich nicht mit Kontaktformular */
}
	p.abstand {
		font-size: 1px; line-height: 0.3em;
		clear: left;
	}

	p.negativAbstand {
		margin-top:-24px;
	}

	p.negativAbstand {
		margin-top:-24px;
	}


	p.abstandgross {
		height: 30px;
	}	
	.loopContainer p, 
	dd p {
		margin-bottom: 3px;
		/*font-size: 1.1em; line-height: 1.4em;*/
	}
	
	#colRight p, 
	#colLeft p {
		margin: 0;
		color:#585555;
	}

	#colRight p.mehr, 
	#colLeft p.mehr {
		display:none;
	}


	#colDynPage p {
		/* clear:left; verträgt sich nicht mit Kontaktformular */
	}
		
	.teaserBox p { /*teaserbox*/
	    padding: 5px 10px 22px 0;
	}

	.picDetailInternP, 
	.picDetailContainerP, 
	#colRight .picDetailContainerP { 
		display: block;
		margin: 0 0 10px 0; 
		padding: 0 0 5px 0;
		/*font-size: 1em; line-height: 1.2em;*/
		font-weight: normal; 
	}	
	.picDetailContainerMini { /*um Minibilder*/
	} 

	p.erweiterteSuche {
		height: 1.7em;
		margin: -3px 0 0 0; 
		padding: 0;
		 
		font-weight: bold;
		
		background: #BFBEBE;
		background-image: url(../pic/erweitertesuche.gif);
	}

	p.erweiterteSuche img {
		position: absolute;
		margin-top: 0.1em;
		margin-left: 15.3em; 
	}

	.loopStartBoxes p {
		text-align:left;
	}

	p.produkttabelle, p.highlight, ul.highlight, .mehr {
		clear:left;
		/*	background: url(../pic/trenn_senkrecht.png) no-repeat top left; */
		line-height:1.6em;
	}


/* "normale" Links */
a:link {
	color: #E4011F;
}
a:visited {
	color: #E4011F;
}
a:hover {
	color: #000000;
}
a:active {
	color: #000000;
}

	/*+++++++++++++++++++++++++++
	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 {
	}
	
	/*'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;
		margin-bottom:10px;
	}
	/*'iCalendar und linke/rechteSpalten mehr-links*/
	.mehr.outlook a:link, .mehr.outlook a:visited, .mehr.outlook a:hover, .mehr.outlook a:active,
	#colRight .mehr a:link, #colRight .mehr a:visited,
	#colLeft .mehr a:link, #colLeft .mehr a:visited	 {
		padding-left: 0;
	}

	.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 {
	padding-left: 15px;
	font-weight: bold;
	text-decoration:underline;
	/*font-size: 1.1em;*/ 
	/*background-image:url(../pic/mehr_pfeil.gif); background-position: left; background-repeat:no-repeat;*/
}

.erweiterteSuche a:link, .erweiterteSuche a:visited {
	display: block;
	padding: 3px 0 0 10px;
	text-decoration: none;
	color: #FFF; 
}

.erweiterteSuche a:hover, .erweiterteSuche a:active {
	color: #000;
}

img {
	margin: 0; 
	padding: 0; 
	border: 0 none;
}

img.icon {
	/* position: relative; top:5px; */
	margin: 2px 0 2px 0; 
	padding: 0 0 0 5px;
	vertical-align: middle;
}


/* updates interne Bilder */

.ganzeBreite .internzoom, .ganzeBreite .noInternzoom {
	display: inline-block;
	margin:0 auto 0 auto;
	width: 47.95918%; /* 587.5 : (1200 + 25) */
	margin: 1.0204%;  /*  12.5 : (1200 + 25) */
}

	.ganzeBreite .internzoom a, .ganzeBreite .noInternzoom a {
		display:inline; font-size:0;
	}

	.ganzeBreite .internzoom.ganzeBreite, .ganzeBreite .noInternzoom.ganzeBreite {
		width:100%; margin:1.0204% 0 1.0204% 0;
	}

	.ganzeBreite img {
		width:100%;	
	}

	/* #pseudoClassHasAlternative --> parent() in inc_javascript_und_css_seitenende.asp , */
	.parentParagraphImg {
		clear:both;
		text-align:center; line-height:0; padding:0;
		margin-left: -1.0204%; margin-right: -1.0204%;
	}

	/* #pseudoClassHasAlternative --> parent() in inc_javascript_und_css_seitenende.asp */
	.parentParagraphImgGanzeBreite {
		clear:both;
		margin-left:0; margin-right:0;
	}



img.zoomIn, #logo, #fussAusstattung img, #fussPartner img {
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

a:hover img.zoomIn, a:hover #logo {
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-o-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}


/* Listen */
/*styles nur in untercontainern wie zb colInhalt definieren, wegen tinymce*/
ul {}
ol {}

#colInhalt div.mehr ul { /*404*/
	list-style: none;
	list-style-type: none;
	/*font-size: 14px; line-height: 1.4em;*/
}

#colGanzeBreite ul, 
#colInhalt ul,
#colGanzeBreite ol, 
#colInhalt ol
{ /*wichtig: clearboth darf nicht bei tinymce sein! #tinymceX ul*/
  /* clear: both; */ /*wichtig für umbruch falls liste direkt nach h1 innerhalb einer textbausteinloop zB auf der Startseite vorkommt; */
}

ul li {} /*angaben nur in bestimmten untercontainern, sonst zeigt es im tinymce falsche styles!*/	
ul ul {} /*angaben nur in bestimmten untercontainern, sonst zeigt es im tinymce falsche styles!*/
ol {}    /*angaben nur in bestimmten untercontainern, sonst zeigt es im tinymce falsche styles!*/
ol li {} /*angaben nur in bestimmten untercontainern, sonst zeigt es im tinymce falsche styles!*/


#colInhalt ul.loopListe li {

}
	
#colInhalt ol,
#tinymce ol {
/*
	margin: 8px 0 15px 30px;
	padding-left: 0;
*/
}
#colInhalt ol li,
#tinymce ol li {
	/*
	margin: 0;
	padding-left: 0px;
	/*font-size: 1.25em; line-height: 1.3em;*/
}

#colGanzeBreite p strong, #colGanzeBreite ul strong, #colGanzeBreite ol strong,
#colInhalt p strong, #colInhalt ul strong, #colInhalt ol strong, .formAnweisung strong
{
/* Auswirkung auf Links
	color:#464040;
*/
}

/*Aufzählung/Verzeichnis der Subseiten auf Dynpage-Übersichtsseiten*/
#colInhalt ul.subsiteEnumeration,
#tinymce ul.subsiteEnumeration {
	margin-top: 16px;
}
#colInhalt ul.subsiteEnumeration li a,
#tinymce ul.subsiteEnumeration li a {
	font-weight: bold;
}
#colInhalt ul.subsiteEnumeration li a:link, #colInhalt ul.subsiteEnumeration li a:active,
#tinymce ul.subsiteEnumeration li a:link, #tinymce ul.subsiteEnumeration li a:active {
	color: #006666; /*evtl weg*/
}
#colInhalt ul.subsiteEnumeration li a:hover, #colInhalt ul.subsiteEnumeration li a:visited,
#tinymce ul.subsiteEnumeration li a:hover, #tinymce ul.subsiteEnumeration li a:visited {
	color: #003399; /*evtl weg*/
}

sub, sup {
	line-height: 0;
}
ul sup, ol 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;
}
em {
	font-style: italic;
}

.grauFett, 
.textHi, 
.textError {
	font-weight: bold;
	color: #171717;
} 

.textError {
	color: #C00404;
}	

#metaNavigation {
	position: absolute;
	margin-left: -10000px;
}

/*
hinweis, damit ein element die HLHE der inneren elemente nimmt, kann man statt overflow: visible auch folgendes machen.
angenommen sitepart ist das element, das sich die höhe nicht nimmt, weil es zb gefloatet ist. dann...
*/
.sitepart {
	/*...*/
	}
	.sitepart:after {/*so gilt containerhöhe auch bei sNav, aber megamenu geht trotzdem wichtig für höhe, aber achtung, nicht beim megamenu*/
		clear: both;
		content: "";
		display: block;
		line-height: 0;
		height: 0;
	}


/****************************/
/* kopfUndSeite  */
/****************************/
#kopfUndSeite {
	background:#FFF;
}

/****************************/
/* stickyContainer  */
/****************************/
#stickyContainer {
	position:fixed; top:0; z-index:150;
	width:100%; height:110px;
	background: rgba(0,0,0,0.1);
	transition: all 1.5s ease-in-out;
	opacity:1;
}

	#stickyContainer.sticky {
		/* background: rgba(2,0,36,0.9); */
		/* background: linear-gradient(90deg, rgba(2,0,36,1) 51%, rgba(206,209,209,1) 100%); */
		background-size: cover;
		background-image: url(../pic/nav-bg.jpg);
	}

	#stickyContainer.no_slider {
		background: linear-gradient(90deg, rgba(2,0,36,1) 51%, rgba(206,209,209,1) 100%);
	}

	#stickyContainer.sticky.downScroll {
	}
	#stickyContainer.sticky.upScroll {
	}

	/* kopf */
	/*******************/	
	#kopf {
		max-width:1200px; min-height:110px;
		padding:0px;
		margin:0 auto 0 auto;
	}	

	#kopfLogo {
		width:200px; height:95px; padding:10px 0px 0px 0px; margin:0px;
		float:left;
		background:#FFF;
	    display: block;
	    text-align: center;
	  	border-bottom-right-radius: 20px;
		position:relative;z-index:17000;
	}
		#kopfLogo:hover {
		}
		#kopfLogo img {
			width:150px; height:70px; margin:0 auto 0 auto;
			border-bottom-right-radius: 0px;
		}

	#kopfNavigation {
		float:left; 
		width: calc(100% - 200px); display:block;
		position:relative;
	}
	
	#navDivider {
		width: 2000px; height:2px;
		position:absolute; left:0px; top:-6px;
	    border: 1px dashed #fff;
	}

	#navMain {
		float:right;
		margin-top:67px;
		width:897px;
		background:transparent;
		position:relative;
	}
		

	/* navTop */
	/*******************/	
	#navTop {
		position:absolute; top:23px; right:0; width:897px;
		z-index:15000;
		height:35px;
	}

	#navTopMobile {
		display:none;
	}

	/* navTop */
	/*******************/	
	#navTopSearch {
		float:left; width:150px;
		position:relative; font-size:0; height:0px;
	}

		#navTopSearch a:link, #navTopSearch a:visited {
			color:#FFF;
		}

		#navTopSearch a:hover, #navTopSearch a:active {
			color:#CCC;
		}

		#navTopSearch i {
			float:left; display:block; margin-top:5px;
			z-index:1100;
		}
		#navTopSearch span {
			float:left; display:block; padding:11px 0 8px 5px;
			font-size:15px;
		}


		/* Lupe-Background-Kreis */
		.btn-material {
			position: absolute; z-index:16000;
			top: 0px;
			width: 30px;
			height: 30px;
			left: -5px;
			border-radius: 100%;
			box-sizing: border-box;
			background: transparent;
			outline: 0;
			transform-origin: 50%;
			transition: all 0.7s cubic-bezier(0.4, 0, 0.2, 1);
			opacity:0.1;
		}

			#navTopSearch:hover .btn-material {
				background: #e50721;
			}



		/* Close Icon */
		.icon-close {
		  position: fixed;  z-index:16100;
		  top: 30px;
		  right: 30px;
		  color: #FFF;
		  cursor: pointer;
		  font-size: 70px;
		  opacity: 0;
		  transition: all 0.3s ease-in-out;
		  /* pointer-events:yes !important; */
		}
			.icon-close:hover {
			  transform: rotate(0);
			}

		/* Search-DIV 		  */
		/**********************/
		.search-input {
		  height: 60px;
		  position: absolute;
		
		  width:100%; 
		  max-width:650px;
		
		  opacity: 0;
		  transform: translate(40px, 0);
		  transition: opacity 0.7s ease-in-out;
		
		  position: absolute;  z-index:16100;
		  top: -50%; left: 50%;
		  transform: translate(-50%, -50%);
		  
		}
			/* Search-INPUT-Feld */
			.search-input input {
			  color: #000;
			  margin-top:0px;
			  font-size: 2.4em; line-height:2.4em;
			  border: 0; min-height:60px;
			  background: transparent;
			  -webkit-appearance: none;
			  box-sizing: border-box;
			  outline: 0;
			  font-weight: 200;
			  background-color:transparent;
			  float:left;
			}
			/* Search-INPUT-Feld-Placeholder */
			.search-input::-webkit-input-placeholder,
			.search-input:-moz-placeholder,
			.search-input:-ms-input-placeholder {
				opacity: 1;
				color: #EEE;
			}
			
				#stickyContainer #formSearch input:focus {
					background: transparent; 
				}
		
		/* Search-ACTIVE 	  */
		/**********************/
		.search-active .search-input {
		  opacity: 1;
		  z-index:16100;
		  background:#FFF;
		  top: 200px;
		}
		
		.search-active .search-input .material-icons {
			position:absolute;right:0;
			font-size:50px;
			margin-top:-53px; margin-right:10px;
			color:#e50721; z-index:9000;
			cursor:pointer;
		}
		
			/* Rotating Icon */
			.search-input.searching .material-icons {
				-webkit-animation:flipIcon 1s ease-in-out infinite;
				-moz-animation:flipIcon 1s ease-in-out infinite;
				animation:flipIcon 1s ease-in-out infinite;
				color:#ccc; cursor:default;
			}
			
			@-moz-keyframes flipIcon { 100% { -moz-transform: rotateY(360deg); } }
			@-webkit-keyframes flipIcon { 100% { -webkit-transform: rotateY(360deg); } }
			@keyframes flipIcon { 100% { -webkit-transform: rotateY(360deg); transform:rotateY(360deg); } }
		
			.search-active .search-input:not(.searching) .material-icons:hover {
				color:#000;
			}
		
		.search-active .icon-close {
		  opacity: 1; font-size:60px;
		  transform: rotate(-90deg);
		  z-index:16100;
		}
		
		.search-active .btn-material {
		  transform: scale(150);
		  background: #e50721; /* e50721 */
		  opacity:0.9;
		}
		.search-active .icon-material-search {
		  opacity: 0;
		}


/*
Highlight (ehem durch navigationHi())
*/
/* Aktiv-Zustand (inc_navigation_hi.asp) */
#topNavigation a.navHi,
#topNavigation li a.navHi,
#topNavigation li.navHi a,
#navMain li > a.navHi,
#navMain li.navHi > a,
#colRight h5.navHi,
#colRight h5.navHi > a,
#colRight h5 a.navHi,
#colRight li > a.navHi,
#colRight li.navHi > a,
#colRight ul li.navHi a,
#navTop ul li.navHi > a
{
	color: #CCC !important;

}





/*++++++++++++
containerbox bsp pj1003 u 1433 minisplash
++++++++++++++*/
#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;	
}
/*falls containerbox mit schatten*/	
#containerbox {
	margin: 20px auto 20px auto;/* 20 für shadow*/
	padding: 10px 0;
	
	text-align: left;
		
	border-color: #fff;
	border-style: solid;
	border-top-width: 0;
	
	background: none repeat scroll 0 0 #fff;
	box-shadow: 0 0 10px #777;	
}
#containerbox_oben {	
}
#containerbox_unten {
}



/********************/
/* Linke Spalte     */
/********************/
/* nicht in Verwendung */


/********************/
/* Rechte Spalte     */
/********************/
#colRight {
	position: relative;
	width: 24%; 				/* 288:1200 */
	margin: 0 0 0 1.6666666666%;   /* 20:1200	*/
	padding: 0 0 0 0;  
	float: left;
	text-align: center;
	}

	#picContainer {	/*umschließt alle Bilder in der colRight*/
		/*font-size: 1.2em;*/ /*wichtig für Bildbeschreibungstext anstelle der Formatierung des umgebenden p bei zugeordneten Bildern */
	}



/*
*************
TEASERboxen
*************
*/
.teaserGesamt {
	position: relative;
	/*margin-top: 10px;*/
	overflow: auto; /*damit das element eine höhe erhält*/
	}
	#colRight .teaserGesamt { /*teaserbox*/
	}
	#colLeft .teaserGesamt { /*teaserbox*/
	}		
	.teaserBox {
		position: relative;
		margin: 0;
		padding: 0;
		border: none;
		text-align: left;
		/*font-size: 1.3em; line-height: 1.5em;*/
		background-color:#FFF;
		overflow: auto; /*damit das element eine höhe erhält*/	
	}
	#colRight .teaserBox { /*teaserbox*/
	} 
	#colLeft .teaserBox { /*teaserbox*/
	} 	
	.teaserBox h5 { /*teaserbox*/
		margin: 0;
		padding-top: 13px;
		padding-bottom: 5px;
		text-align: left;
	}

	.onlineAuftraege h5 { /* anfrage-navigation */
		/* background: url(../pic/strichliert_rot.png) repeat-x 0 0; */
		background:#e4011f;
		text-align: center;

		border-top:0px none;;
		border-bottom:1px dashed #FFF;

	}

	.teaserBox img {
		max-width: 100%;
	}
	.teaserBox .picPreview { /* teaserbox */
		margin: 4px 0; 
		border: 0 none;
		text-align: center;
		vertical-align: middle;	
	}
	.teaserBox ul { /*teaserbox*/
		margin: 0;
		padding: 5px 10px 5px 0px;
		list-style-position: outside;
		text-align: left;
		font-size: 1.5em; line-height: 1.6em;
		margin-bottom:16px;
	}

	.onlineAuftraege ul {
		text-align:center;
		background-color:#DCDCDC;
		line-height:2em;
		padding-bottom:18px; padding-top:14px;
		margin-bottom:30px;

	    -webkit-border-bottom-right-radius: 40px;
	    -khtml-border-bottom-right-radius: 40px;
	    -moz-border-radius-bottomright: 40px;
	    border-bottom-right-radius: 40px;
	}


	/* damit die banner nicht unten noch einen div rand erhalten, falls sie verlinkt sind */
	.teaserBox .bannerlink { /*teaserbox*/
		line-height: 0;
		font-size: 0;	
	}
	.teaserGesamt .picFullTeaser { /*teaserbox*/
		width:100%; 
		padding: 0px;
	}
	.teaserGesamt .userStyle1, .teaserGesamt .userStyle1 { /*teaserbox-style*/
		background-color: #FFCC66;
	}
	.teaserGesamt .eventdate { /*'teaser-termindatum-aus- oder einblenden*/
		display: none;
	}
					
	.teaserBox a:link, .teaserBox a:visited {
		color: #e4011f;
		text-decoration: none;
	}	
	.teaserBox a:hover, .teaserBox a:active {
		color: #000000 !important;
		text-decoration: none;
	}	

	.teaserBox ul li a:link, .teaserBox ul li a:visited {
		color:#707070;
		display:block;
	}	
	.teaserBox ul li a:hover, .teaserBox ul li a:active {
		color: #000 !important;
	}	

	.onlineAuftraege a:link, .onlineAuftraege a:visited {
		font-weight:600; color:#434343;
	}
	.onlineAuftraege a:hover, .onlineAuftraege a:active {
	}


	.onlineAuftraege h5 a:link, .onlineAuftraege h5 a:visited {
		color: #FFF; text-decoration: none;
	}
	.onlineAuftraege h5 a:hover, .onlineAuftraege h5 a:active {
		color: #000000 !important;
		text-decoration: none;
	}	




	.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;*/
	}
	.teaserBox .nurLink { /*teaserbox*/
		text-align: center;
	}	
	.teaserBox .nurLink a:link, .teaserBox .nurLink a:visited { /*teaserbox*/
		color: #000000; text-decoration: none;
	}
	.teaserBox .nurLink a:hover, .teaserBox .nurLink a:active { /*teaserbox*/
		color: #5D8EC1; text-decoration: underline;
	}

	#colRight #teasercontentEmpty {
		margin-top: -28px;
	}	




		/*teaserboxtest mit "Bilderrahmen" multiple backgrounds*/
		.test #colRight .teaserBox {
			background-image: url(../test_pic/tafel_bg_links.jpg), url(../pic/tafel_bg_rechts.jpg);
			background-position: center left, center right;
			background-repeat: no-repeat, no-repeat;
			background-size: cover, cover;
			
			background-clip: border-box;
			
			margin: 0 !important;
			
			border: 0px none;	
		}
		.test #colRight .teaserBox {
			margin-bottom: 40px !important;
		}
		.test #colRight .teaserBox:before,
		.test #colRight .teaserBox:after,
		.test .picDetailContainerXXX:before,
		.test .picDetailContainerXXX:after {
			content: " ";
			background-color: #006666; /*braucht eine farbe, sonst braun durch das "COVER" von links/rechts-rahmen*/
			display: block;
			width: 100%;
			background-repeat: no-repeat;
			background-clip: border-box;
			background-size: contain;	
		}
			.test #colRight .teaserBox:before,
			.test .picDetailContainerXXX:before {
				height: 40px;/*veränderung wirkt sich auf #colRight .teaserBox margin-bottom und top aus*/
				background-image: url(../test_pic/tafel_bg_oben.gif);
				background-position: bottom center;
			}
			.test #colRight .teaserBox:after,
			.test .picDetailContainerXXX:after {
				height: 10px;/*veränderung wirkt sich auf #colRight .teaserBox margin-bottom und top aus*/
				background-image: url(../test_pic/tafel_bg_unten.gif);
				background-position: top center;
			}
		.test #colRight .teaserBox .tContent,
		.test .picDetailContainerXXX img {
			background-color: #EEE;
			margin-left: 10px;
			margin-right: 10px;
			overflow: hidden;
		}
		/*rotate - schief aufgehangene Bilder*/
		.test .teaserGesamtxxx .teaserBox:nth-child(odd) {
		/*	-moz-transform:rotate(5deg); /* Firefox 3.6 Firefox 4 */
		/*	-webkit-transform:rotate(5deg); /* Safari */
		/*	-o-transform:rotate(5deg); /* Opera */
		/*	-ms-transform:rotate(5deg); /* IE9 */
		/*	transform:rotate(5deg); /* W3C */	   
		}
		.test .teaserGesamtxxx .teaserBox:nth-child(even) {
		/*	-moz-transform:rotate(-5deg); /* Firefox 3.6 Firefox 4 */
		/*	-webkit-transform:rotate(-5deg); /* Safari */
		/*	-o-transform:rotate(-5deg); /* Opera */
		/*	-ms-transform:rotate(-5deg); /* IE9 */
		/*	transform:rotate(-5deg); /* W3C */	   
		}
		/*ende teaserboxtest*/

		
	
				


/*****************************************/
/* Inhalt normal: mit colRight           */
/*****************************************/

#colInhalt {
	position: relative;
	float: left; display: inline; /*IE6problem: doublemargin*/
	width: 74.333333%; /*892:1200 */
	margin: 0;
	padding: 0;
	text-align:left;
}

	#colInhalt.ganzeBreite  {
		width:100%; text-align:left;
	}

	#colInhalt > h2 {
		/* max-width:658px; */
	}

#colInhalt > ul,
#fehlerhandling404 > ul,
#tinymce > ul,
#colInhalt ul.feed-list { /*weg nur temporär eingebaut damit man im arztpackage noch übersichten sieht und text nicht in der wurscht daher kommt.*/
	margin: 8px 0 15px 0;
	padding-left: 0;
	list-style-position: outside; list-style-image: none; 
	/*font-size: 1.2em; line-height: 1.5em;*/
}
#colInhalt > ul {/*wichtig:nicht tinymce!*/
	overflow: hidden; /*overflow hidden: damit das element eine höhe erhält*/
	margin: 0 0 24px 0;
}

#colInhalt > ul > li, 
#fehlerhandling404 ul > li,
#tinymce > ul > li { 
		margin: 0;
		padding-left: 16px;
		background:none;
		font-size:2em; line-height:1.666666em;
}

#colInhalt > ol > li, 
#tinymce > ol > li {
		/*
		font-size:1.5em; line-height:1.59996em;
		*/
	    font-size: 2em;
	    line-height: 1.666666em;
}

/* roter Punkt*/
#colInhalt > ul > li:before,
#tinymce > ul > li:before,
#fehlerhandling404 > ul > li:before
{
	content: "●";
	color:#E4011F;
	position:absolute; left:0px;
	line-height:28px;
}

#colInhalt table ul li
{
	padding-left:15px;
}

#colInhalt table ul li:before
{
	content: "●";
	color:#3732bc;
	position:absolute; left:15px; line-height:1.25em;
}


#colInhalt > ul.highlight > li:before {
	content: "";
}



#colInhalt ol,
#tinymce ol {
	list-style: decimal;
	margin:0px 0px 24px 18px;
	list-style-position: outside;
}


#colInhaltRahmenUnten, 
#colInhaltRahmenOben {
	clear: both;
}

#sieSindHier, 
#sieSindHierBottom,
#sieSindHierBottomV2 {
	width: 100%; max-width:1200px;
	min-height:50px;
	margin: 0 auto 0 auto; padding: 20px 0 10px 36px; /* 26:1200 */
	
	color: #000000;
	text-align:left;
	font-size:1.5em; line-height:1.2222em;

	background: url("../pic/siesindhier.png") no-repeat left 27px;

}
#sieSindHierBottom {
	margin: 0 0 15px 0; 
}
#sieSindHierBottomV2 {
	display:none;
}

#sieSindHier .dot,
#sieSindHierBottomV2 .dot {
	/*standardfontsize: 12px zu 14px bei siesindhier*/
	font-size: 0.9em; width: 1em; color:#aeaeae;
	display: inline-block; /*=font-size: 11px;line-height:17px -> w:11px;h:17px;*/
	margin-left: 0.2em; margin-right: 0.2em;
	padding: 0;
	text-align: center; 
	vertical-align:1px;
}

	#sieSindHierBottomV2 .dot {
		color:#c6ebf9;
	}

	#sieSindHier a,
	#sieSindHierBottom a {
		/*display: compact;*/ /*compact darf wegen chrome nicht verwendet werden, außer es ist bewusst gewünscht. führt sonst zu zeilenumbruch*/ /*padding-right: 3px;*/
	}

	#sieSindHier a:link, #sieSindHier a:visited,
	#sieSindHierBottom a:link, #sieSindHierBottom a:visited,
	#sieSindHierBottomV2 a:link, #sieSindHierBottomV2 a:visited {
		color: #595959;
		text-decoration: none;
	}
	#sieSindHier a:hover, #sieSindHier a:active,
	#sieSindHierBottom a:hover, #sieSindHierBottom a:active,
	#sieSindHierBottomV2 a:hover, #sieSindHierBottomV2 a:active {
		color: #3732bc;
		text-decoration: underline;
	}


	#sieSindHierBottomV2 a:first-of-type 
	{
	/*
		font-weight:600; color:#ecfae6 !important;
	*/
	}
	#sieSindHierBottomV2 a:hover
	{
	/*
		color:#FFF !important;
	*/
	}
	



#fussZeile {
	clear: both;
	position: relative; 
	width:100%; 
	margin: 0; padding: 0;

	font-family:"Source Sans Pro",Arial,Helvetica, sans-serif;  font-weight:600;
	font-weight:400;
	text-align: center;

	background: rgb(164,0,24);
	background: linear-gradient(90deg, rgba(164,0,24,1) 0%, rgba(241,7,44,1) 50%, rgba(194,1,30,1) 100%);
	color:#FFF;
}

	#fussZeile #fussZertifizierungen {
		width:100%; background: #FFF url("../pic/trennlinie.png")repeat-x top;
	}

	#fussZeile #fussZertifizierungen ul {
		max-width:1200px; margin:0 auto 0 auto;
	}

	#fussZeile #fussZertifizierungen ul li {
		display:inline;
	}

	#fussZeile #fussZertifizierungen img {
		/* width:7.91666%; 				*/ /* 95:1200 */
		/* margin:26px 0.5% 26px 0.5%;	*/ /* 6:1200 */	
		width:95px; margin:26px 0px 26px 0px;

	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;

	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; /* IE8 */
	filter: alpha(opacity=70); /* IE 5-7 */
	opacity: 0.7;
	}


#fussZeile #fussZertifizierungen a:hover img {
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-o-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);

	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* IE8 */
	filter: alpha(opacity=100); /* IE 5-7 */
	opacity: 1;

}








	#fussZeile #fussSitemap {
		max-width: 1200px; 
		padding: 20px 0 20px 0;
		margin: 0px auto 0 auto;
		height:auto; overflow:visible;
		font-size:1.5em; line-height:24px;
	}

		#fussZeile #fussSitemap #fussSitemapSpalten {
			position:relative; z-index:1;
			float:left; margin:0 0 20px 0;
			width: 100%; max-width:1200px;
			padding: 0;
			height:auto;
		}

		#fussZeile #fussSitemap #fussSitemapSpalten .spalte1,
		#fussZeile #fussSitemap #fussSitemapSpalten .spalte2,
		#fussZeile #fussSitemap #fussSitemapSpalten .spalte3,
		#fussZeile #fussSitemap #fussSitemapSpalten .spalte4
		{
			float:left; width:32.22%;
			margin-right:1.66%; /* 20 */
			text-align:left;
		}
		#fussZeile #fussSitemap #fussSitemapSpalten .spalte4 {
			margin-right:0;
		}

		#fussZeile #fussSitemap #fussSitemapSpalten .main {
			font-weight:600;
		}

		#fussZeile #fussSitemap #fussSitemapSpalten .abstand {
			margin-top:24px;
		}

		#fussZeile #fussSitemap a:link, #fussZeile #fussSitemap a:visited {
			color:#FFF; text-decoration:none; 
		}
		#fussZeile #fussSitemap .main a:link, #fussZeile #fussSitemap .main a:visited {
			color:#FFF; 
		}
		#fussZeile #fussSitemap a:hover, #fussZeile #fussSitemap a:active,
		#fussZeile #fussSitemap .main a:hover, #fussZeile #fussSitemap .main a:active
		{
			color:#000;
		}

		#interactLink {
			clear:both; float:none;
			width: 100%;
			margin:10px 0 0px 0; padding:10px;
			text-align: center;
			font-size: 1.4em;
		}

		#fussZeile #interactLink a:link, #fussZeile #interactLink a:visited {
			color:#f28291; text-decoration:none;
		}
		#fussZeile #interactLink a:hover, #fussZeile #interactLink a:active {
			color:#FFF;
		}

#backTop {
	float: right;
	text-align: right;
}


.mehr, 
.zurueck, 
.blaettern,
.zentriert {
	margin: 0 0 5px 0;

}
	.mehr {
		clear:left;
		display: block; /* wegen IE6*/
		margin-bottom: 30px; margin-top:-18px;
		text-align: left; 
	}
	/*iCalendar*/
	.mehr.outlook {
		display: block; /* wegen IE6*/
		float: left;	
		margin-bottom: 16px;
		text-align: left; 
	}	
	.zurueck {
		text-align: left;
		clear: left;
	}
	.blaettern {
		float: left; /*display: inline;*/
		width: 100%;
		margin-top: 0px;
		clear: both; 
		font-size:1.5em; line-height:3em;
		font-weight: 400;
	}

.blaettern:hover {
    -moz-transition: all .4s ease-in;
    -o-transition: all .4s ease-in;
    -webkit-transition: all .8s ease-in;
    transition: all .4s ease-in;
    background:#e6efc0;
}




	.zentriert {
		display: block; /* wegen IE6*/
		margin-left:auto; margin-right:auto;
		margin-bottom: 16px;
		text-align: center; 
	}

	/*'detailblaettern*/
	.blaettern .vorher,
	.blaettern .nachher {
		width: 25%;
	}
	.blaettern .seiteninfo {
		width: 50%;
	}
	.blaettern .vorher {
		float: left; /*display: inline;*/
		text-align: left;
	}
	.blaettern .seiteninfo {
		float: left; /*display: inline;*/
		text-align: center;
	}
	.blaettern .nachher {
		float: right; /*display: inline;*/
		text-align: right;
	}


	.mehr img {
	}

.datum {
	float: left; /*display: inline;*/
	margin: 0;
}



.loop {
	/* LoopStyle für eingebundene Loops: Abstand nach oben und unten */
	margin: 20px 0 20px 0; 
	clear: left; /*float: left;*/
}

.loop .picGalerie { /*damit text unterhalb einer bildergalerie normal weitergeht 12.11.28*/
	float: left; display: inline;
	margin: 0;
}

.loopOhneAbstand {
	/* LoopStyle für Loops am Seitenbeginn */
	}
	
	#colRight .loopOhneAbstand,
	#colLeft .loopOhneAbstand {
		overflow: auto; /*damit das element eine höhe erhält*/
	}

.loopTeam {
	overflow: auto;
	margin-bottom:26px;
}



.loopOhneTitelUndLead { /* vgl. showAllPreviews Fotoalbum dyn. Seite */
	
}

	.loopOhneTitelUndLead h2, .loopOhneTitelUndLead p {
		display:none;
	}


/* LoopStyle für TextbausteinLoops und normale Loops in nebeneinander stehenden Boxen */
.loopStartBoxes {
	margin-bottom: 0px;
	width:100%;
	float:left; display:inline;/*wichtig, damit es sich die höhe nimmt*/
}

	.loopStartBoxes .bausteinGruppe > *,
	.loopStartBoxes ul > *  { 
		float:left;
		display: block; margin:0;
		width:32.286995%; /* 288:892 */
		line-height:0px; text-decoration:none;
		text-align:center;
	}	

		/* #vier */
		.loopStartBoxes.vier .bausteinGruppe > *,
		.loopStartBoxes.vier ul > *  { 
			width:24%; /* 288:1200 */
		}



	.loopStartBoxes .bausteinGruppe a {
		background:#FFF; margin:0 0 26px 0;
	}

		.loopStartBoxes:not(.vier) .bausteinGruppe > *:nth-child(3n+1),
		.loopStartBoxes:not(.vier) ul > *:nth-child(3n+1) 					/* jeder 1. Baustein in 3er-Zeile */ {
			clear:both;
		}
		.loopStartBoxes:not(.vier) .bausteinGruppe > *:nth-child(3n+2),
		.loopStartBoxes:not(.vier) ul > *:nth-child(3n+2)  				/* jeder 2. Baustein in 3er-Zeile */ {
			margin-left:1.5695067%; margin-right:1.5695067%; 				/* 14:892 */
		}

		/* #vier */
		.loopStartBoxes.vier .bausteinGruppe > *,
		.loopStartBoxes.vier ul > * {
			margin-left:0.6666%; margin-right:0.6666%;
		}

		.loopStartBoxes.vier .bausteinGruppe > *:nth-child(4n+1),
		.loopStartBoxes.vier ul > *:nth-child(4n+1) 					/* jeder 1. Baustein in 3er-Zeile */ {
			margin-left:0px; clear:both;
		}
		.loopStartBoxes.vier .bausteinGruppe > *:nth-child(4n+4),
		.loopStartBoxes.vier ul > *:nth-child(4n+4)  				/* jeder 2. Baustein in 3er-Zeile */ {
			margin-right:0px;
		}




		.loopStartBoxes a img, .loopListe a img {

			-webkit-transition: all 0.6s ease-in-out;
			-moz-transition: all 0.6s ease-in-out;
			-o-transition: all 0.6s ease-in-out;
			-ms-transition: all 0.6s ease-in-out;
			transition: all 0.6s ease-in-out;

/*
			-webkit-transform: scale(1.1);
			-moz-transform: scale(1.1);
			-o-transform: scale(1.1);
			-ms-transform: scale(1.1);
			transform: scale(1.1);
*/

		}

		
		/* ZoomInEffekt bei StartBoxe & loopListe: vgl. global_mediaqueries */
		.loopStartBoxes a:hover img, .loopListe a:hover img {

			-webkit-transform: scale(1.1) rotate(-1deg);
			-moz-transform: scale(1.1) rotate(-1deg);
			-o-transform: scale(1.1) rotate(-1deg);
			-ms-transform: scale(1.1) rotate(-1deg);
			transform: scale(1.1) rotate(-1deg);
			/*
		    -webkit-filter: brightness(1.5);
		    filter: brightness(1.5);
			*/		
		}
		/* SchattenEffekt bei StartBoxen */
		.loopStartBoxes .bausteinGruppe a:hover,
		.loopStartBoxes .loopListe li a:hover
		{
		/*
			-webkit-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.20);
			-moz-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.20);
			box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.20);
		*/
		}
	

	/*mask: imagewrapper */
	.loopListe li .mask {
		float:left;
		width:21.524663%; /* 192:892 */
		overflow:hidden;
		/*
		-webkit-box-shadow: 0px 0px 29px -5px rgba(0,0,0,0.30);
		-moz-box-shadow: 0px 0px 29px -5px rgba(0,0,0,0.30);
		box-shadow: 0px 0px 29px -5px rgba(0,0,0,0.30);
		*/
	}

	.loopStartBoxes .mask, .loopStartBoxes .loopListe li .mask {
		width:100%;	
		height:100%;
		margin-bottom:6px;
		overflow:hidden;
		background: url("../pic/ajax-loader.gif") no-repeat 50% 50%;
	}

	.loopStartBoxes .loopListe.kataloge li .mask {
		border:1px solid #ddd;
	}

	.loopStartBoxes p {
		width: 100%; margin:0px 0 9px 0;
		padding:0;
		font-size:1.5em; /* line-height:1.6em; */
		color: var(--colGrau);
		font-family:"Source Sans Pro",Arial,Helvetica, sans-serif;  font-weight:600;
	}

ul.loopListe {
	/* LoopStyle für sonstige Loops */
	width:100%;	
}

	.ganzeBreite ul.loopListe {
		max-width:658px;
		margin:0 auto 0 auto;		
	}

	.loopStartBoxes ul.loopListe {
		max-width:none;
		margin:0;
	}


	.loopListe li {

	}
	
	.loopListe li.mehr {
	}

	.loopListe li.mehr a {
	}

	.loopListe li .linkersatz,
	.loopListe li > a,
	.textbaustein, 
	.textbaustein a {
		clear:left; float:left; width:100%;
		display: block; padding:0px; /* padding:1.97568%; /* 13:658 */
		margin-bottom:26px;
		min-height:145px;
		text-decoration:none; /* GoogleChrome */
		background:#FFF;
	}

	.loopListe li a:hover {
	/*
		-webkit-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.20);
		-moz-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.20);
		box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.20);
	*/
	}


	/* falls Loop über ganzeBreite eingebaut */
	.loopListe li > a, .loopListe li > .linkersatz {
		max-width:892px;
	}


	.loopStartBoxes .loopListe li .linkersatz,
	.loopStartBoxes .loopListe li a {
		padding:0px;
		/* min-height:305px; */
	}


	.loopListe li .linkersatz {
		background:transparent;
	}

	.loopListe li img {
		float:left;
		/*width:22.94303%; /* 145px : 558-26 */ 
		width:100%;
		margin:0; 

	}

	.loopListe li img {
		opacity: .99;
	}


	/* Sonderfall FAQ */
	.loopWidthNoPicPreview {
		clear:left;
	}

	.loopWidthNoPicPreview .loopListe li .mask {
		/*	max-height:90px; */
	}
	
	.loopWidthNoPicPreview .loopListe li img {
		/*	margin-top:-30px; */
	}

	.loopListe li div.loopText {
		float:left;
		width:76.90582%; 				/* 892-192-14 : 892 */ 
		margin:0 0 0 1.5695067%;	 	/* 14:892 */
		padding:0 0 0 0;

	}

	.loopStartBoxes .loopListe li div.loopText {
		width:100%; margin:0; padding:0;
	}


	div.loopText p {
		margin-bottom:5px;
		font-size:1.5em;
	}

	.loopListe li a div.loopText h2 {
		text-decoration:none; text-align:left; /* text-transform: uppercase; */
		color:#e4011f;
	}

	.loopListe li a:hover div.loopText h2 {
		color:#000;
	}

	.loopListe li div.loopText p { 
		clear:left; 
		display:table;
		color: var(--colGrau);
	}

	.loopListe li div.loopText p.datum {
		margin:0 0 0 0;
		font-weight:600; 
		color: var(--colGrau);
	}

	.loopListe li a div.loopText p.mehr {
	}		
	.loopListe li a div.loopText p.mehr,
	.loopListe li a:hover div.loopText p.mehr,
	.loopListe li a:hover div.loopText p.outlook {
	}
	.loopListe li a div.loopText p.outlook:hover {
	}





.dot h1 { /* vgl. h2 */
	margin-top: 15px; 
	margin-bottom: 8px; 
	padding: 0px;
	border-bottom: 1px dotted #777777;	
	/*font-size: 1.3em; line-height: 1.3em; */
	color:#2F2F2F;
}







/**********************************/
/* Inhalt inkl. colRight          */
/**********************************/
#colGanzeBreite, 
#colDynPage, 
#colDetailPage {
	width: 100%; /* 1000px; */
}

/* Pseudo colRight - auch picDetailContainer beachten */
#colDynPage #colInhalt {

	/*width: 67.457627%;*/ 			/* 398px; bezogen auf 590 	*/
	/*padding-right: 32.542372%;*/ 	/* 342px; 316w+26m			*/
	width: 100%;					/* 100% wenn kein colLeft	*/
	padding-right: 34.2%;			/* 342px:1000 */
	
}
	




/********************/
/* Table:           */
/********************/

table {
	width:100%;
	border-collapse: collapse; border-spacing: 0; /*ersetzt cellspacing="0" */
	padding: 0; /*ersetzt cellpadding="0"*/
	margin: 0 0 26px 0;
	background:#FFF;

	-webkit-border-radius: 16px;
	-moz-border-radius: 16px;
	border-radius: 16px;
}

td  {
	font-size:2em; line-height:1.6666em;
}

	#kalenderstart_table td {
		font-size:1em;
	}

	td p {
		margin:0; padding:0; font-size:1em;
	}
	
	td:first-child, td:first-child strong {
		font-weight:600 !important;
		color:var(--colGrau);
		width:200px;
	}

table.contentBreite {
	width:100%;
}

table.contentBreite td {

}


/* Tabellen-Titel, Zwischen-Titel */
table.preise thead th, table.preise tbody th {
	padding:13px 13px 13px 13px;
	font-family:"Source Sans Pro",Arial,Helvetica, sans-serif;
	text-align:left;
	font-size:2em; line-height:1.2222em;

	border-bottom:1px solid #dbdde2;
	text-align:right;
	font-weight:400;
}

	table.preise thead th {
		padding-bottom:0px;
		border:0px none;
	}

	table.preise tbody th {
		padding-top:26px;
	}

/* erste Zelle linksbündig */
table.preise td:first-child, table.preise th:first-child {
	text-align:left; width:60%;
}

/* Tabellenzellen */
table.preise td {
	padding:9px 13px 8px 13px;
	border-bottom:1px solid #dbdde2; /* vgl. table.preise thead th */
	font-size:1.5em; line-height:1.22222em;
	text-align:right;
}

	table.preise td > p {
		font-size:1em; margin-bottom:0px;
	}

/* TabellenFußzeile */
table.preise tfoot td {
	color:#777777;
}

table.preise tfoot td {
	border-bottom:0px none;
}


/********************/
/* Bilder           */
/********************/

/* Positionierung ausserhalb colInhalt in Pseudo-ColRight oder colRight*/
.picDetailContainer {
	float: right; display: inline;
	width: 48.02431%; /* width:  316px bezogen auf 658  */
	/* relativ platziert zu rechter Kante von colInhalt
	/* rechter Rand = Bildbreite + padding+rechterRand(colInhalt) als Minuswert*/
	/* linker Rand = rechterRand colInhalt, damit in IE und Firefox gleich*/
	margin: 0 -51.97568% 0 3.95136%; /* 0, -342px, 0, 26px bezogen auf colInhalt 658px */
	padding: 0;
	clear: right;
	/* auch #colDynPage #colInhalt beachten */
}

	#picContainer .picDetailContainer {
		width:100%;
	}

	#colRight .picDetailContainer {
		margin: 0 0 0 0;	/* Abstand oben wegen dynamischer Seiten */
	}

	#colRight .picDetailContainer p {
		height:26px;
		margin:1.2em; text-align:right;
		font-size:1em;
	}

/* Container für Bild im Textbaustein-Loop */
.picDetail {
	float: right; /*display: inline;*/
	width: 26.633165%; /* 106px bezogen auf 398px */
	margin: 0 0 15px 3.7688442%; /* 15px */
	padding: 0; 
	border: 0px none;
	}
	
	#colDynPage .picDetail, 
	#colRight .picDetail, 
	#colDetailPage .picDetail {
		width: 100%;
		margin: 0 0 8.23% 0;  /* 26:316 */
		padding: 0;
	}

	.loopStartBoxes .mask .picDetail,
	.loopStartBoxes .mask .picPreview 
	{
		float:none; padding:0;
		width:100%;
		/* margin:-22%; /* Bild mittig platzieren */
		margin:0;
	}

/* intern - Bild innerhalb des Contents anzeigen */
.picIntern {
	width: 100%; /* 398px; */
	margin: 0;	
	padding: 0; 
}

.picPreview {
}

/*minibild*/
.picMini {
	float: left; /*display: inline;*/
	width: 45.886075%;	 /* 145:316 */
	margin: 0 0 8.23% 0; /* 26:316 */
}
.picDetailContainer .first {}
.picDetailContainer .last {
	float: right; /*display: inline;*/ 
}
/*end minibild*/


/* klassische Bildgalerie, eCards */
.picGalerie {/*resp*/
	width: 100%;
	text-align: center;
	}
	
	.picGalerie ul {/*resp*/
		width: 100%;
		width: auto;
		height: auto;
		float: left; display: block;
		margin: 0 auto 0px auto;
		padding: 0;
		clear: left;
		text-align: center;		
		list-style: none;
	}	
	.picGalerie	ul li,
	.picGalerie	ul li.last {/*resp*/
		float: left; /*display: inline;*/
		width: auto;
		margin: 0;	
		padding: 0;
		background: none;
	}
	.picGalerie	ul li {/*resp*/
		width:34.2%;
		max-width: 342px;
		padding-left:0px;
		padding-right:2.6%; /* 26px */
		padding-bottom:2.6%;
	}
	.picGalerie	ul li.last {/*resp*/
		width:31.6%;
		max-width: 316px;
		padding-right: 0;
	}
	.picGalerie	ul li .picPreview {/*resp*/
		width: 100%;
		/*max-width: 232px;*/
		/*max-height: 232px;*/		
		margin: 0;
		border: 0px none;
	}		
	.picGalerie	ul li a {/*resp*//*damit nicht zusätzlicher rand hinzukommt*/
		display: block;
		line-height: 0;
		text-decoration:none;
	}

	.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.ecard {
	width: 396px; /*besser prozent*/
	border: 1px solid #D7E0EC; /* 366 */
}

img.thumbnail {/*Thumbnail-Bilder bei Presse in der rechten Spalte*/
	width:100%;
	border: 0 none;
}

/*transparenu bei hover*/
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*/
}
a:hover img {
/*
	opacity: 0.8;
	-moz-opacity: 0.8;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	filter: alpha(opacity=80);
	background-color: transparent;
*/
}


/******************************************************************/
/* Formularelemente, vgl. auch kontaktformular.css, warenkorb.css */
/******************************************************************/

/* Schriftfamilie dezidiert angeben! v.a. wegen textarea!*/
/* Schriftgröße in em, damit abhängig von default-body-Größe*/
select, input, textarea, submit, form input[type=submit], button {
	font-family: Arial, Helvetica, sans-serif; /*nicht entfernen*/
	font-size: 1.5em; line-height: normal; /*nicht entfernen*/
}
textarea {
	line-height: 1.5em;
}
option {
	font-size: inherit; line-height: inherit;
}
select option { /*um zeilenhöhe auszugleichen?*/
	padding-top: 3px;
	padding-bottom: 3px;
}


form input[type=submit], button {
	-webkit-appearance: none; /*ohne dies lässt sich der button für safari nur schwer stylen mobil/iphone/ipad*/
}

	/*busabfahrtsplan start*/
	form#abfahrtsplan {
		padding: 5px 5px 0 5px;
		border: 1px solid #BDDAD6;
		background-color: #EFEFEF;
		/*font-size: 1.2em; line-height: 1.6em;*/
		}
		form#abfahrtsplan #vonplan,
		form#abfahrtsplan #bisplan {
			overflow: auto;
		}
		form#abfahrtsplan #vonplan label,
		form#abfahrtsplan #bisplan label {
			float: left; display: block; 
			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 {
			display: block;
			margin: 3px 0 8px 40px;
			overflow:auto;
		}
		form#abfahrtsplan input[type="radio"] {
			/*float: left; display: block;*/
			margin-top: 2px;
			margin-right:5px;		
			height: 12px;
			line-height: 12px;
			border-style: none;
		}
		form#abfahrtsplan #fahrplansenden {
			clear: both;
			text-align: right;
		} 
		form#abfahrtsplan .stadtbus {
			position: relative;
			width: 140px; 
			height: 27px;
			margin-top: 7px;
			margin-left: 40px;
			text-align: left;
		}
		form#abfahrtsplan .stadtbus img {
			position: absolute;	top: -4px; right: 0;
		}
		form#abfahrtsplan .button {
			float: right; /*display: inline*/ 
			width: 115px;
			margin: -2px 0 0 0;
		}
		form#abfahrtsplan .button input {
			border: none;
			background: none;
			font-weight: bold;
			/*font-size: 1em; line-height: 1.2em;*/
		}	
	/*busabfahrtsplan ende*/
	
	
	
	/*busabfahrtsplan vers3 start*/
	form#schedule_widget {
		padding: 5px;
		border: 1px solid #BDDAD6;
		background-color: #EFEFEF;
		/*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 {
			float: left; display: block; 
			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 {
			clear: both;
			text-align: right;
			overflow: auto;
		} 
		form#schedule_widget .fahrplanbutton {
			margin: 0;
			clear: both;
			text-align: right;
			overflow: auto;
		}
		form#schedule_widget .fahrplanbutton input {
			float: right; /*display: inline;*/
			width: auto;
			padding: 0 5px;
			font-weight: bold;
			/*font-size: 0.9em; line-height: 1.2em;*/		
		}	
	/*busabfahrtsplan ende*/
		


/*form,*/

	::-webkit-input-placeholder { color:#97979a; }
	::-moz-placeholder { color:#97979a; } /* firefox 19+ */
	:-ms-input-placeholder { color:#97979a; } /* ie */
	input:-moz-placeholder { color:#97979a; }

	form input, form select, form input[type="submit"], form .button {
		padding-top:5px;
		padding-bottom:3px;
		height:40px;
	}	

	form input,
	form select,
	form textarea {
		border: 1px solid #b6b5b9;	
		background: #FFF;
	}
		
	form input,
	form select {
		min-height:30px; min-width:185px;		
	}

	form select { 
	}
	
	form textarea { 
	}	


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

	form option.hi {
		background: #ffdee2;	
	}


	/*
	form submit, form button, form input[type=submit] {
		width: 150px;
		border: 0 none;
	}
	*/

	label {
		display: block;
		margin: 0 0 5px 0; 
		padding: 0;
		font-size:1.5em; line-height:1.2222em;
	}

	.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*/
	}
	
	.button, 
	.anmeldeform .button, 
	a.button {
		width: auto; /*width: 66px;*/
		min-height:40px;
		border: 0px none;
		padding: 5px 0px 3px 0px; 
		/*line-height: 1.8em; font-size: 11px;*/
		text-align: center;
		background: #E4011F;
		cursor: pointer;
		color:#FFF; 

	}

		/* Anfragebutton */
		p a.button {
			margin:26px auto 52px auto;
		}

		input.button:link, input.button:visited, 
		a.button:link, a.button:visited {
			text-decoration: none;
			font-size:1em; line-height:2em;
			display:block;
		}
		input.button:hover, input.button:active, 
		a.button:hover, a.button:active {
			color: #FFF; 
			text-decoration: none;
			background:#4d4d4d;
		}
		
		
	.anmeldeform .button, a.button {
		float: none; display:inline;
		min-width:288px; max-width:400px;
		margin-left:auto; margin-right:auto;
	}
	
	.anmeldeform .auswahllisteBackground { /*form inc_anmeldeformular*/
		background: none;
	}	


	#suche #stichwort {
		width:203px;	
	}
	
	#suche .button {
		width:100px; min-width:inherit;
		margin-left:1.23574%; /* 13:1052 */
	}






.hinweisBox,
h2.alert, #tinymce h2.alert {
	display: block;
	width: 368px; 
	margin: 10px 0 10px 0;
	padding: 10px 15px 5px 15px;
	clear: left;
	color: #191916; 
	background:#F3CD55;
}

.hinweisBox h2 {
	margin-top: 0;
} 

/*****************/
/* Indexfilter   */
/*****************/

#indexfilter {
	width:100%; 
	height:40px; margin-bottom:32px;
}

#indexfilter .selectAndButton {
	width:100%; max-width:658px;
	float:left;
	min-height:40px;
}

	#indexfilter label {
		visibility: hidden; height:0px;
	}

	/* Auswahlliste */
	#indexfilter select {
		width:72.036474%; 		/* 474:658 */
		float:left;
	}
	/* Button */
	#indexfilter input.button {
		width:24.01216%;		/* 158:658 */
		min-width:inherit;
		margin-left:3.951368%;	/* 26:658 */
		float:left;
	}



#indexfilterXXX {	/* Form */
	position: relative;
	width: 100%;
	margin: 0 0 18px 0;
	padding: 0 10px 10px 10px;/*padding top wird quasi durch .indexfilter-padding-top ausgeglichen*/
	clear: both; 
	background: #f6f0d0;
	}
	.indexfilterXXX {	/* DIV */
		position: relative;
		height: auto;
		margin: 0;
		/*padding-top: 5px;*/
		padding: 10px 0 0 0;
		}
		.indexfilterXXX:after {/*so gilt containerhöhe*/
			clear: both;
			content: "";
			display: block;
			line-height: 0;
			height: 0;
		}
	
	.indexfilterCheckboxXXX {	/* DIV */
		float: left; display: block;
		height: 30px;
		margin: 4px 0 0 0; 
		padding-top: 0;
	}

	#indexfilterXXX label {
		display: inline;/*wichtig damit label neben checkboxen die richtige breite erhalten - checkboxnewinsert*/
		font-weight: bold; 
		color: #595959;
	}

	#indexfilterXXX label.produktKategorie {
		color: #000;
	}
	
	#indexfilterXXX .button {
		margin: 0;
	}
	
	.indexfilterXXX .formfeld label.suchsubmit { /*indexfilter form*/
		font-weight: normal;
	}
	
	#indexfilterXXX .minderHeight { /*indexfilter form*/
		height: 20px;
		padding-top: 10px;
	}	


	.formfeld {
		float: left;
	}

	.formfeldCheckbox {
		float: left; /*display: inline;*/
		width: 190px; 
		padding-top: 10px;
		/*font-size: 1.2em; line-height:18px;*/
		color:#171717;
	}

	.formfeldCheckbox, 
	.formfeldBeschriftungAktiv {
		color: #171717;
	}

	.formfeldBeschriftungInaktiv {
		color: #B0AEA3;
	}


	.formfeldRechts {
		float: right; display: inline;
		margin-right: 10px;
	}
	
	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 {
		float: left;
		width: 21px;
		border: 0 none;
	}

	.formfeldCheckbox .checkbox {
		display: block;
		margin-right: 5px;
	}


/****************
	RSS-Feed Symbole ...
****************/	
.feed,
.feedFiltered { /*rss-feed-erweitert*/
	margin: 0 0 0 3px;
	padding: 0 0 0 19px;
	}
	.feed { /*rss-feed-erweitert*/	
		background: url("../pic/feed-icon-14x14.png") no-repeat 0 50%; /*color image repeat attachment position;*/
	} 
	.feedFiltered { /*rss-feed-erweitert*/
		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;
	} 	
	
	#fussZeile a.feed {
		color: #fff;
		font-weight: bold;
	}
	
	.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*/
		display: inline !important;
		text-decoration: none;
	}
	

	
	
/************************************
 404-suche und hinweistext 2013-06-26
 ***********************************/
#fehlerhandling404 #suchmaske404 {
	float: left; /*display: inline;*/ 
	width: 100%; 
	height: auto;
	margin: 0; 
	padding: 10px 0 0 0;
	clear: left;
	overflow: auto; 
	}
	#fehlerhandling404 form#formSuche404 { 
	}
	#fehlerhandling404 form#formSuche404 #suche404 {
		float: left;
		width: 48.571428%;  
		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: 50px;
	padding: 2px;
	border: 2px groove #000;
	color : #000000;
	background-color: #FFFF99;
	}
	
	div#previewHinweisText h1 {
		margin: 0 0 2px 0;
		padding: 0;
		/*font-size: 1.2em; line-height: 1.4em;*/
	}

	div#previewHinweisText form input.urlTextBox {
		width: 90%;
		height: 12px;
		padding: 0;
		/*line-height: 1.2em;*/
	}

	div#previewHinweisText .textHiBereich {
		font-weight: bold;
		color: #171717;
	} 

	div#previewHinweisText table.preview_box {
		width: 100%; background:#FFFF99;
		/*font-size: 1em; line-height: 1.2em;*/
	}

	div#previewHinweisText table.preview_box td {
		vertical-align: top;
	}

	div#previewHinweisText table.preview_box td.ueberschrift {
		font-variant: small-caps;
		font-weight: bold;
		/*font-size: 1.2em;*/
	}

	div#previewHinweisText table.preview_box td.bereichsbezeichnung {
		white-space: nowrap;
		vertical-align: top;
	}

	div#previewHinweisText table.preview_box td.abstandhalter {
		padding-bottom: 20px;
	}

	div#previewHinweisText table.preview_box td.linkspalte {
		width: 90%;
	}
	
	
/***************
iframes und Spez-Container um iframes
***************/	
iframe, object, embed { /*How To Keep Your iFrame Content Responsive with CSS*/
	max-width: 100%;
	}
	iframe {
		border: 0 none;
	}
	#uploadframe { /*iframe fileupload width:376px;height:100px;margin:0px;padding:0px;*/
		width: 376px;
		height: 104px;
		margin: 0;
		padding: 0;
		border: 0 none;	
		overflow: auto; /*scrolling=auto*/
		/*overflow: hidden;*/ /*scrolling=no*/
	}
	.responsiveMapsContainer { /*iFrame Anfahrt*/
		position: relative;
		height: 0;
		padding-bottom: 34%; /* Höhe Map*/
		overflow: hidden;
	}	 
	.responsiveMapsContainer iframe {  /*iFrame Anfahrt*/
		position: absolute;	top: 0;	left: 0;
		width: 100%;
		height: 100%;
	}
	.video,
	#tinymce .video { /*iFrame cms youtube*/
		position: relative;
		padding-bottom: 56%;
		height: 0;
		overflow: hidden;
		margin-bottom: 20px;
	}	 
	.video iframe,
	#tinymce .video iframe {  /*iFrame cms youtube*/
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}	

/**************
twitterfollow 
achtung IE6 -> muss responsive natürlich umgebaut werden
**************/
#socialnet {
	position: fixed; top: 37%; left: 0;/*right: 0px;*/
	
	width: 80px;
	height: 200px; /*height: auto;*/
	border: 0 none;
	
	z-index: 500;	
	
	margin-left: -52px;	
	-webkit-transition: margin 1s ease;
	-moz-transition: margin 1s ease;
	-o-transition: margin 1s ease;
	-ms-transition: margin 1s ease;
	transition: margin 1s ease;	

	background: url(../pic/social_bg_left_hidden.png) no-repeat;	
	}
	#socialnet:hover, 
	#socialnet:active {
		margin-left: 0;	
		background-image: url(../pic/social_bg_left.png);
		
	}
	#socialnet #twitterfollow {
		/*
			display: scroll;
			position: fixed; top: 43%;
			border: 0 none;
		*/
		position: absolute;	top: 22px; left: 0; /*right: 0px;*/
		z-index: 999;
	}
	#socialnet a {
		padding-bottom: 5px;
	}


/*******************
href-symbole
'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, a.dokiconlink, a.dokiconbildsymbol, a.dokiconroutenplaner {
	}
	p.mehr a.dokicon, a.dokicon, a.icondesc[href $=".jpg"], a.dokiconlink[target], a.dokiconbildsymbol, a.dokiconroutenplaner {
		/*padding: 1px 20px 1px 0;*/
		padding: 1px 0px 1px 0;
	}
	a.icondescX[href $=".jpg"], a.dokiconX[href $=".jpg"], a.dokiconX[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*/
		padding: 0 0 5px 0;
		background: none !important;
	}
	a.dokiconlinkX[target="_blank"], a.dokiconlinkX[target="_self"] { /*externe Links zB auf Presseseite*/
		background: url(../pic/ico_kl_ext.gif) no-repeat center right;
	}
	a.dokiconbildsymbolX[href *=".jpg"] { /*[bild]01,symbol[/bild]*/
		margin-right: 5px; /*damit es nicht am Text klebt, falls es nur das nakte Symbol ist*/
		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.dokiconroutenplanerX { 
		background: url(../pic/ico_kl_map.gif) no-repeat center right;
	}
	a.dokiconX[href $="typ=.iCal"], a.dokiconX[href $="typ=.vCard"] { /*iCal speichern bei Termin oder vcard*/ 
		background: url(../pic/ico_kl_events.gif) no-repeat center right;
	}
	a.dokiconX[href $="typ=.vcardkontakt"] { 
		background: url(../pic/ico_kl_vcard.gif) no-repeat center right;
	}
	a.dokiconX[href $=".mp3"] { /*mp3s enden noch nicht mit typ=.mp3*/
		background: url(../pic/ico_kl_mp3.gif) no-repeat center right;
	}
	a.dokiconX[href $=".flv"] { /*flvs enden noch nicht mit typ=.flv*/
		background: url(../pic/ico_kl_flv.gif) no-repeat center right;
	}
	a.dokiconX[href $=".pdf"] {
		background: url(../pic/ico_kl_pdf.gif) no-repeat center right;
	}
	a.dokiconX[href $=".png"], a.dokiconX[href $=".tif"], a.dokiconX[href $=".psd"] {
		background: url(../pic/ico_kl_Bilder.gif) no-repeat center right;
	}
	a.dokiconX[href $=".ppt"], a.dokiconX[href $=".pps"], a.dokiconX[href $=".exe"] {
		background: url(../pic/ico_kl_dummy.gif) no-repeat center right;
	}
	a.dokiconX[href $=".gif"] {
		background: url(../pic/ico_kl_gif.gif) no-repeat center right;
	}
	a.dokiconX[href $=".txt"], a.dokiconX[href $=".csv"] {
		background: url(../pic/ico_kl_txt.gif) no-repeat center right;
	}
	a.dokiconX[href $=".rtf"], a.dokiconX[href $=".doc"] {
		background: url(../pic/ico_kl_doc.gif) no-repeat center right;
	}
	a.dokiconX[href $=".xls"] {
		background: url(../pic/ico_kl_xls.gif) no-repeat center right;
	}
	a.dokiconX[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;
}




	

/**************
Sonstiges
***************/
.noBg {
	background: none;
}	
.attachBox {
	width: 344px;
}
.ortZusatz {
	font-weight: normal;
}
.kontaktGeoLink {
	margin-bottom: 6px;
}
.kontaktUrl {
	margin-bottom: 14px;
}
.vcardBlock {
	margin-bottom: 0;
}
.vcardlink {
	border:0 none;
}

/*'2013-07-01 browser-update - hinweis auf alte version*/
.buorg {
	padding: 15px !important;
}


/*Buttons, u.a. auch Warenkorb und Form absenden. Styles ausgegliedert, damit nicht inline. siehe speichernButton()*/
.speichernButton_Enabled {
	cursor: pointer !important;
	background-image: url(../pic/buttonwarenkorb.gif) !important;

}
.speichernButton_Disabled {
	cursor: wait !important;
	background-image: url(../pic/button-loading.gif) !important;
	background-repeat: no-repeat !important;
	background-position: center center !important;
}


/*standard*/
.justDesktop {
	display: inherit; /*fuer den fall dass auch spans diese class haben*/
}
.justMobile {
	display:none;
}

.allTouchDevices  {
	display:none;
}

/*'2013-10-24 - damit touchenabled devices trotzdem im megamenu den hauptnavigationslink erneut angezeigt(klickbar) bekommen*/
#kopf.deviceSupportsTouch .allTouchDevices,
#kopf.deviceSupportsTouch .justMobile.allTouchDevices { 
	display: block !important;
}
/*2015-04-02 - damit touchenabled devices bei indexfilter die trennstriche nicht angezeigt bekommen*/
#kopf.deviceSupportsTouch form select .separator {
	display: none;
}

/*********************
Scroll-To-Top Button -> siehe lib/scrolltotop/
**********************/

/* #EasyAutocomplete */
.easy-autocomplete.eac-square {
	font-family:"Open Sans",Arial,Helvetica, sans-serif !important;
}

.easy-autocomplete.eac-square input {
	font-family:"Open Sans",Arial,Helvetica, sans-serif;
	border-color:#FFF;
	box-shadow: none;
	outline-width:0px !important;
	border:none !important;
	width:100%;
}

.easy-autocomplete.eac-square ul, .easy-autocomplete.eac-square ul li, .easy-autocomplete.eac-square ul .eac-category {
	border-color:#FFF;	
	color:#000;
	text-align:left;
	border:none !important;
}

.easy-autocomplete-container .eac-item {
	height:20px; line-height:20px;
}


/*********************
doubleLoop
**********************/

.doubleLoop {
	clear:both;
	width: 101.6666%; /* 1220px; */
	margin:0 auto 0 auto;
	text-align:center;
	margin:0 -0.83% 0 -0.83%; /* 10:1200 */
}

	.doubleLoop .loopMitAbstand,
	.doubleLoop .loopOhneAbstand
	{
		width:48.36%; /* 590:1220 */
		display:inline-block; float:none;
		margin-left:0.8196%; margin-right:0.8196%; /* 10:1220 */
		vertical-align:top; /* wichtig für divs im doubleLoop */
	}
	
	.doubleLoop {
		font-size:0;
	}
	
	.doubleLoop > * {
		font-size:10px;
	}
	
	.doubleLoop .loopText h2 {
		font-size:1.5em;
	}

	.doubleLoop .loopText h2 a {
		display:block; float:right;
	}