/* 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;
	/* #lazyLoad */
	opacity: 1;
	transition: opacity 1s;
}
img[data-src] {
	/* #lazyLoad */
	opacity: 0;
}



/****************************/
/* 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:#FFF;	
	scroll-behavior: smooth; /* vgl. smoothscroll.js */

	/* background-image: url(../pic/body.jpg); */
    /* background-repeat:no-repeat; */
    /* background-size:auto 1200px; */

    transition: 0s linear;
    transition-property: background-position;

}
body, input, textarea, button { /* Schriftfamilie dezidiert angeben! v.a. wegen textarea!*/
	font-family:"Open Sans",Arial,Helvetica, sans-serif;
}

html, html.fontswitchNormal {
	font-size: 62.5%; line-height:1em;
}
html.fontswitchBig { 
	font-size: 70%; line-height:1.1em;
}
html.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; max-width:1245px;
	padding: 0; margin: 140px auto 0 auto;
	color:#151515;
}

	.popup #seite {
		margin-top:0;
	}

	#seite.windowBreite {
		width:100%;
		max-width:none;
	}

	#seite.windowBreite.blau {
		background:#08186b; color:#FFF;	
	}

	#seite > .kundenstimmen {
		max-width:820px; margin:50px auto 0 auto;
		padding:20px;
		background: url("../pic/quote.png") 30px 30px no-repeat #cccccc;
		min-height:595px;
	}


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


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

h1 {
	margin: 0 auto 12px auto; /* Korrektur durch erhöhte line-height*/
	padding: 0px;
	font-weight:600;
	color:#000;
	font-size:3.0em;
	font-family: 'Open Sans', sans-serif;
	line-height:1.2em;
	text-align:left;
	letter-spacing: -0.04em;
	max-width:1245px;

	/*	background: url(../pic/head_underline.gif) no-repeat; background-position: left bottom;	padding-bottom:12px;^*/
	position:relative;


}



h1::after{
    content: "";
    position: absolute; z-index:1;
	bottom:-7px;
	left:0px; margin-left:0px;
    border-bottom: 3px solid #93cc3a;
	/* #isVisibleInViewport */
	-webkit-transition: width 1s;
	transition: width 2s;
    width: 10px; height: 3px;
}


	#seite.windowBreite h1,
	#fussNavigationSpalten h1
	{
		text-align:center;
		/* background-position: center bottom; */
	}

	#seite.windowBreite h1::after,
	#fussNavigationSpalten h1::after
	{
		left: 50%;
		-webkit-transform: translateX(-50%);
		-moz-transform: translateX(-50%);
		transform: translateX(-50%);
	}


	#seite h1.isvisible::after,
	#seite.windowBreite h1.isvisible::after,
	#fussNavigationSpalten h1.isvisible::after,
	#fussZeile #fussSitemap h1.isvisible::after
	{
		width:100px;
	}

	#seite.windowBreite.blau #colGanzeBreite > h1,
	#fussNavigationSpalten h1	
	{
		color:#FFF;
	}
	#fussNavigationSpalten h1 {
		margin-bottom:15px;
	}

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

	#seite #colInhalt .doubleLoop {
		text-align:center; 
	}

	#seite .doubleLoop .loopMitAbstand h1,
	#seite .doubleLoop .loopOhneAbstand h1,
	#seite .doubleLoop .loopKundenstimmenSlider h1 	
	{
		text-align:left;
		/* background-position:left bottom; */
	}

	#seite .doubleLoop .loopMitAbstand h1::after,
	#seite .doubleLoop .loopOhneAbstand h1::after,
	#seite .doubleLoop .loopKundenstimmenSlider h1::after {
		left:0px; margin-left:0px;
		-webkit-transform: translateX(0%);
		-moz-transform: translateX(0%);
		transform: translateX(0%);
	}

	#colInhalt h1 {
		margin-bottom:17px;
	}

	.kundenstimmen h1 {
		color:#FFF;
		background-image: none;
		padding-bottom:0px;
		text-align:center;
		margin-top:20px;
	}

	.kundenstimmen h1::after {
		display:none; z-index:-1;
	}

	#colInhalt .loopKundenstimmenSlider h1 {
		margin-bottom:2px;
	}

.durchgestrichen {
	text-decoration:line-through;
}

h2, h2.lead, p.lead {
	margin:0 auto 21px auto;
	font-size:2.4em;
	font-family: 'Open Sans', sans-serif;
	font-weight:600;
	line-height:1.3333em;
	text-align:left;
	color: #171717;
}

	#colInhalt > h2,
	#colInhalt > h2.lead,
	#colInhalt > p.lead
	{
		max-width:820px;
	}

	h2.lead, p.lead {
		font-size:1.8em;
	}

	.loopListe h2 {
		margin-bottom:16px;
	}

	.blau #colInhalt > h2 {
		color:#FFF;
	}

	.blau .contentWeiss > h2 {
		color: #373737;
	}

	.kundenstimmen > h2 {
		text-align:center;
	}

	
	.windowBreite > h2 {
		margin-left:auto; margin-right:auto;
		text-align:center;
	}

	.kundenstimmen > h2.lead {
		color:#FFF; font-weight:400;
	}


	h2,
	#tinymce h2 { /*detailseiten-zwischenüberschriften*/

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

	h2 a:link, h2 a:visited {
		text-decoration: underline;
	}

	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:17px 0 6px 0; padding:0 0 5px 0;
 		font-size:1.8em; font-weight:600;
	}
		.loopListe.kundenstimmen li div.loopText h2 {

		}

		.loopKundenstimmenSlider .flexslider li div.loopText h2 {
	 		font-size:1.8em; font-weight:600;			
		}

	.loopBildTextSlider li div.loopText h2,
	.loopKundenstimmenSlider li div.loopText h2,
	.loopTeaserSlider li div.loopText h2,
	.loopTextSlider li div.loopText h2
	{
		clear:left;
		margin:17px 0 6px 0; padding:0 0 5px 0;
 		font-size:1.8em; font-weight:600;
	}

	.halb .loopListe li div.loopText h2 {

	}

	a:link h2, a:visited h2 {
		color:#FFF;
		text-decoration:none;
	}

	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 {
		height:65px;
		width:100%; margin:0 0 0 0;
		padding:0px 10px 0px 10px; /* 13:316 */
		display:flex; align-items: center; justify-content: center;
		white-space:normal;
		font-size:1.8em; font-weight:600;
		text-decoration:none; text-align:center;
	}

	.loopBildTextSlider .slides li div.loopText h2,
	.loopTeaserSlider .slides li div.loopText h2
	{
		height:65px;
		width:100%; margin:0;
		padding:0px 10px 0px 10px; /* 13:316 */
		display:flex; align-items: center; justify-content: center;
		white-space:normal; text-align:center;
		font-size:1.5em; font-weight:600;
		text-decoration:none;
	}
	.loopTextSlider .slides li div.loopText h2	{
		text-align:left; justify-content: left;
		padding:22px 30px 4px 30px; background:transparent;
		display:block;
		font-size:1.8em;
	}

	.loopStartBoxes.hideTitle h2,
	.loopStartBoxes.hideTitle .loopListe li div.loopText h2 {
		display:none;
	}


h3, h4 {
	margin:0 0 3px 0; 	
	font-size:1.8em; line-height:1.59996em;
	font-family: 'Open Sans', sans-serif; font-weight:600;
	color: #171717;
	text-align:left;
}
	h3.datum, h3.date {
		font-size:1.8em; line-height:1.3333em;
		font-weight:600;
		color: #68676c;
		margin-bottom:16px;
		text-transform:none;
	}


	.windowBreite h3.datum, .windowBreite h3.date {
		text-align:center;
	}

	h3 span.lowercase {
		text-transform:lowercase !important;
	}

	h3.funktion {
		font-weight:600;
		font-size:1.8em; /* font-size:1.5em; */
		text-transform:none;
	}

	.loopListe.kundenstimmen h3, 
	.loopKundenstimmenSlider .slides h3
	{
		color:#FFF; font-weight:400;			
		font-size:1.5em;
	}


h4 {
	text-transform:none;
}

h5 {
	font-size: 1.0em; line-height: 1.2em;
}

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

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

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

	dt {
		margin: 0 0 3px 0;
		clear: left;
		background:#f6e1ba; overflow:auto;
	}
	
	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 24px 0; padding: 0;
	text-align: left; font-size:1.8em;
	line-height:1.46666em;  /* 22:15 */
}

	#seite.windowBreite p,
	#seite.windowBreite h2,
	#seite.windowBreite h3,
	#seite.windowBreite h4	{
		max-width:820px; clear:both;
		margin-left:auto; margin-right:auto;
	}

	#seite.windowBreite h3.date {
		max-width:1245px;
	}

	#seite.windowBreite #colInhalt .maxBreite,
	#seite.windowBreite #colInhalt .doubleLoop	
	{ /* #strLayout, p für Bilder in Layout 99 */

		display:inline-block;
		width:102.41% !important; max-width:1275px;   /* 1275:1245 */
		margin:0px -1.205% 15px -1.205%;
		text-align:center;
	}
	#seite.windowBreite #colInhalt > * > .doubleLoop {
		font-size:0;
	}

	#seite.windowBreite #colInhalt > * > .doubleLoop > * {
		font-size:1rem;
	}



	p.abstand {
		font-size: 1px; line-height: 0.3em;
		clear: left;
	}
	p.abstandgross {
		height: 30px;
	}	
	.loopContainer p, 
	dd p {
		margin-bottom: 3px;
	}
	
	#colRight p, 
	#colLeft p {
		margin: 0 0px 10px 0px;
		color:#585555;
	}

	.picDetailContainerP, .picDetailInternP,
	#colRight .picDetailContainerP { 
		display: block;
		margin: 5px 0 0px 0; 
		padding: 0;
		font-weight: normal; font-size:0.84em; line-height:22px; color:#a0a0a0;
		text-align:left;
	}	
	.picDetailContainerMini { /*um Minibilder*/
	} 
	.picDetailInternP {
		max-width:820px; margin-left:auto; margin-right:auto;
		line-height:inherit !important;
	}

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

	p.highlight a {
		height:65px; width:415px; margin:20px auto 10px auto;
		display:flex; align-items: center; justify-content: center;
		border:1px solid #091c7d;
		text-align:center; text-decoration:none;
		line-height:24px;
		border-radius:5px;
	}

		p.highlight a:link, p.highlight a:hover {
			text-decoration:none;
		}

		p.highlight a:hover {
			background:#091c7d; color:#FFF;
		}


	p.properties {
		font-family: 'Open Sans', sans-serif; font-weight:400;
	}
	p.properties span {
		font-size:15px; padding:5px 1% 5px 1%;
		background:#0070c0; margin-right:1%;
		color:#68676c;
		cursor: help;
		display:inline;
		white-space: nowrap;
		line-height:36px;
	}


	.kundenstimmen p {
		text-align:center;
	}


/* "normale" Links */
a:link {
	color: #091c7d;
}
a:visited {
	color: #091c7d;
}
a:hover {
	color: #000;
}
a:active {
	color: #3e3e3e;
}

	/*+++++++++++++++++++++++++++
	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 {
	}	
	.mehr a[target="_blank"]:after {
	}
	#colDetailPage .mehr a:after,
	#tinymce .mehr a:after { /*damit auf Detailseiten dokUrls keine Linkzeichen erhalten*/
	}
	
	.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*/
	}

	.mehr.vcardBlock a[class="dokicon"], 
	.mehr.vcardBlock a[class *="dokicon"] {
		padding-left:35px;
		background: url(../pic/ico_savekontakt.png) 0 3px no-repeat;
	}
	.mehr.vcardBlock a {
	}


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

.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;
}


img.zoomIn, #logo, #fussAusstattung img, #fussPartner img, ul.loopBilder li img {
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	transition: all 0.5s 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);
}

ul.loopBilder 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);
}

#fussAusstattung img:hover {
	-webkit-transform: scale(1.5);
	-moz-transform: scale(1.5);
	-o-transform: scale(1.5);
	-ms-transform: scale(1.5);
	transform: scale(1.5);
	
	box-shadow: 0px 0px 5px #888888;
	position:relative;z-index:100;
}

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

#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!*/


/*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: 600;
}
em {
	font-style: italic;
}

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

.textError {
	color: #f14b3a;
}	

#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;
	}

/********************************************/
/* Zentrierte singleBox820, teaserBoxContent*/
/********************************************/
.singleBox 
{
	margin:30px auto 30px auto;
	max-width:820px !important;
}

/* teaser-Content 820 */
.teaserBoxContent {
	margin:30px auto 30px auto;
	max-width:820px !important;
	font-size: 10px; font-size: 1rem;  /* Basis-Font-Size */
	background:#ccc; padding:25px 2.4% 25px 2.4%;		
}

.singleBox > *,
.teaserBoxContent > *
{
	text-align:center !important;
}

/***************************************************/
/* maxBreite: teaserBoxTitel + teaserBoxContent    */
/***************************************************/

/* teaser-MaxWidth 1245 */
.teaserBoxMaxBreite {
	max-width:1245px !important;
	margin:0 auto 2.4096% auto;
	min-height:297px;
	font-size:0; /* nospace-between-divs */
	overflow:hidden; padding-bottom:25px; /* divs-same-height*/
}

	.teaserBoxMaxBreite > * {
		min-height:297px;		
	}

	/* teaser-MaxWidth-TITLE */
	.teaserBoxMaxBreite .teaserBoxTitle {
		font-size: 10px; font-size: 1rem;  /* Basis-Font-Size */
		float: none; display: inline-block; vertical-align: top;
		width: 31.726907%; /* 396:1245 */
		margin:0 2.4096% 0 0; /* 30 */
		padding:25px 2.4096% 25px 2.4096%;
		background:#989898;
		padding-bottom:1000px; margin-bottom:-1000px; /* divs-same-height*/
	}

		.teaserBoxMaxBreite .teaserBoxTitle h2 {
			color:#FFF;
		}

	/* teaser-MaxWidth-CONTENT */
	.teaserBoxMaxBreite .teaserBoxContent {
		font-size: 10px; font-size: 1rem;  /* Basis-Font-Size */
		float: none; display: inline-block; vertical-align: top;
		width: 65.863453%; /* 820:1245 */
		margin: 0;
		padding:25px 2.4% 25px 2.4%;	
		text-align:left !important;
		background:#ddd; 
		padding-bottom:1000px; margin-bottom:-1000px; /* divs-same-height*/
	}

	.teaserBoxMaxBreite .teaserBoxContent > *
	{
		text-align:left !important;
	}

/***************************************************/
/* gesamteBreite: färbiger Teaser                  */
/***************************************************/
.teaserBoxGesamteBreite {
	max-width:none !important; 
	background:#93cc3a;
	padding:20px 10px 3px 10px; margin-top:20px; margin-bottom:20px;
}

/************************************************************************/
/* tripleBox: Dreier-Spalte im Contant (weiss, grau vgl. Zahlen-Counter */
/************************************************************************/
.tripleBox
{
	margin:30px auto 30px auto;
	max-width:1245px;
	text-align:center;

	/* #isVisibleInViewport */
	-webkit-transition: all 3s ease-in-out;
	transition: all 3s ease-in-out;
	opacity: 0.2;

}

	.tripleBox.isvisible 
	{
		opacity: 1;
	}

	#tinymce .tripleBox {
		max-width:1275px;
		opacity:1;
	}

	#seite.windowBreite h2,
	#seite.windowBreite h3,
	#seite.windowBreite h4	{

	}

	.tripleBox h1 {
		text-align:left !important;
		/* background-position: left bottom !important; */
	}
	#seite.windowBreite .tripleBox h1::after {
		left:0px; margin-left:0px;
		-webkit-transform: translateX(0%);
		-moz-transform: translateX(0%);
		transform: translateX(0%);
	}

	.tripleBox h2 {
		text-align:center;
	}

	.tripleBox .tripleBoxSpalten {
		font-size:0; background:#ccc;
	}

	.tripleBox.transparent .tripleBoxSpalten {
		background:transparent;
	}

	.tripleBoxSpalten div {
		width:375px; display:inline-block; /* 30 + 375 + 30 + 375 + 30 + 375 + 30 */
		min-height:280px;
		margin:0 15px 30px 15px;
		padding:30px 0px 0px 0px;
		vertical-align:top;
		font-size: 10px; font-size: 1rem;  /* Basis-Font-Size */
		background:#ccc;
	}

	.tripleBoxSpalten div:nth-child(1) {
		margin-left:30px;
	}
	.tripleBoxSpalten div:nth-child(2) {
	}
	.tripleBoxSpalten div:nth-child(3) {
		margin-right:30px;
	}

	.tripleBox.transparent .tripleBoxSpalten div {
		width:395px; margin-left:0; margin-right:0;
	}

	.tripleBox.transparent .tripleBoxSpalten div:nth-child(2) {
		margin-left:30px; margin-right:30px;
	}

	.weiss .tripleBoxSpalten div,
	.transparent .tripleBoxSpalten div	
	{
		background:transparent; padding:0; min-height:0;
	}


	.tripleBoxSpalten > div > h2 {
		font-size:3em;
		font-weight:600; color:#000 !important;
		margin-bottom:18px !important;
		text-align:left;
	}
	.tripleBoxSpalten > div > h2 span {
		font-size:2.4em; /* 72px */
	}

	.tripleBoxSpalten div h3 {
		font-size:1.8em; text-transform:none;
		font-weight:600; color:#373737;
		margin-bottom:6px !important;
		text-align:left;
	}
	.tripleBoxSpalten div p {
		font-size:1.8em;
		font-weight:400; color:#373737;
		margin-bottom:0px;
	}

	.tripleBox.transparent .tripleBoxSpalten div {
		width:395px; margin-left:0; margin-right:0;
	}

	.tripleBox.transparent .tripleBoxSpalten div:nth-child(2) {
		margin-left:30px; margin-right:30px;
	}


/************************************************************************/
/* doubleBox: Zweier-Spalte im Contant (weiss, grau vgl. Zahlen-Counter */
/************************************************************************/
.doubleBox
{
	margin:0px auto 30px auto;
	max-width:1245px;
	text-align:center;
}

	#tinymce .doubleBox {
		max-width:1275px;
	}

	.doubleBox h1 {
		text-align:left !important;
		background-position: left bottom !important;
	}

	.doubleBox h2 {
		text-align:center;
	}

	.doubleBox .doubleBoxSpalten {
		font-size:0; background:#ccc;
	}

	.doubleBox.transparent .doubleBoxSpalten {
		background:transparent;
	}

	.doubleBoxSpalten div {
		width:577.5px; display:inline-block; /* 30 + 375 + 30 + 375 + 30 + 375 + 30 */
		min-height:180px;
		margin:0 15px 30px 15px;
		padding:30px 0px 0px 0px;
		vertical-align:top;
		font-size: 10px; font-size: 1rem;  /* Basis-Font-Size */
	}
	.doubleBoxSpalten div:nth-child(1) {
		margin-right:15px;
	}
	.doubleBoxSpalten div:nth-child(2) {
		margin-left:15px;
	}

	.doubleBox.transparent .doubleBoxSpalten div { /* 607.5:1245 */
		width:48.79518%; margin:0; padding-top:10px;
	}
	.doubleBox.transparent .doubleBoxSpalten div:nth-child(1) {
		margin-right:1.2048%;
	}
	.doubleBox.transparent .doubleBoxSpalten div:nth-child(2) {
		margin-left:1.2048%;
	}
	.doubleBox ul { text-align: left; padding-left: 0;  list-style-position: outside;  list-style-image: none; color: #373737; }
	.doubleBox ul li { font-size: 1.6em; margin: 10px 0; padding-left: 20px; background: none; line-height: 1.2em; }
	.doubleBox ul li:before { content: ">"; font-size: 1em;  font-weight: bold;  line-height: 1.5em;  display: inline-block;  width: 1em;  margin-left: -18px;  color: #82c124; }
	



	.weiss .tripleBoxSpalten div,
	.transparent .tripleBoxSpalten div	
	{
		background:transparent; padding:0; min-height:0;
	}

	.tripleBoxSpalten > div > h2,
	.doubleBoxSpalten > div > h2 {
		font-size:3em;
		font-weight:600; color:#000 !important;
		margin-bottom:18px !important;
		text-align:left;
	}
	.tripleBoxSpalten > div > h2 span,
	.doubleBoxSpalten > div > h2 span	
	{
		font-size:2.4em; /* 72px */
	}

	.tripleBoxSpalten div h3,
	.doubleBoxSpalten div h3	
	{
		font-size:1.8em; text-transform:none;
		font-weight:600; color:#373737;
		margin-bottom:6px !important;
		text-align:left;
	}
	.tripleBoxSpalten div p,
	.doubleBoxSpalten div p
	{
		font-size:1.8em;
		font-weight:400; color:#373737;
		margin-bottom:0px;
	}












/*******************************************/
/* Kopfbereich mit Sprachauswahl und Image */
/*******************************************/
#stickyContainer {

	position:fixed; z-index:2000;
	width:100%; height:140px;
	background:#FFF;
/*	background: url("../pic/ukraine.gif") no-repeat left center;*/

	-webkit-transition: height 1s; /* Safari */
	transition: height 1s;
}

	#stickyContainer.sticky {
		height:100px;

		-webkit-box-shadow: 0px 3px 26px -12px rgba(0,0,0,0.53);
		-moz-box-shadow: 0px 3px 26px -12px rgba(0,0,0,0.53);
		box-shadow: 0px 3px 26px -12px rgba(0,0,0,0.53);

	}

	/* #AnchorOffset für stickyContainer */
	:target:before
	{
		content:""; display:block;
		height:130px; margin:-130px 0 0; /* fixed header height, negative fixed header height */
	}

#kopf {
	width:100%; max-width:1245px;
	margin:0 auto 0 auto;
	position:relative;

	left:0;right:0;
	/*background:#FFF;*/
}

	/* kopfLogo */
	#kopfLogo {
		width:15.416666%;
		position:relative; top:46px; left:0px;
		z-index:1000;

		-webkit-transition: all 1s; /* Safari */
		transition: all 1s;
	}

	#stickyContainer.sticky #kopfLogo {
		top:9px;	
	}



	#kopfLogoBild {
		width:100%; border:1px solid #FFF;
	}


	/* navTop */
	#navTop, #navTop ul {
		width:100%; height:30px; background:#08186b;
	}

		#navTop {
			max-width:1245px; margin:0 auto 0 auto; text-align:right;
			color:#FFF; padding-right:12px;
		}

		#navTop a {
			float:right; margin-left:20px;
			font-size:1.4em; line-height:30px;
		}

		#navTop a:link, #navTop a:visited {
			color:#FFF; text-decoration:none;
		}
		#navTop a:hover, #navTop a:active {
			color:#8cd027;
		}

		#navTop a span {
			float:left;
			display:block;margin-top:7px; padding:0; margin-right:7px !important;
			font-size:17px; line-height:17px;
		}

	#navTopKontakt a::before {
		content: "■";
		color:#ab002c;
		font-size:15px;
		position:absolute; left:25px; margin-top:-1px; line-height:1.5em;
	}
	
	#navTopSupport a::before {
		content: "■";
		color:#ab002c;
		font-size:15px;
		position:absolute; left:25px; margin-top:-1px; line-height:1.5em;
	}



	/* FLEXSLIDER */
	#kopfImage {
		max-width:1248px;
		margin:0 auto 0 auto;
		border-top:12px solid #FFF;
		clear:both;
	}

	#kopf #socialButtons {
		position:absolute; top:136px;
		left:50%; margin-left:-80px; /* (3*40+3*5)/2 */
	}
	#kopf #socialButtons li {
		display:inline-block;
	}

	#kopf #socialButtons li a {
		display:block;
		width:40px; height:40px;
		margin:5px; font-size:0;
		background-repeat: no-repeat;
		opacity: 0.5;
		filter: alpha(opacity=50); /* For IE8 and earlier */
	}
	#kopf #socialButtons li a:hover {
		background-position-y: -40px;
		opacity: 1;
		filter: alpha(opacity=100); /* For IE8 and earlier */
	}

	#socialButtonFacebook {
		background-image: url(../pic/social-buttons.png);
		background-position: 0 0;
	}
	#socialButtonInstagram {
		background-image: url(../pic/social-buttons.png);
		background-position: -40px 0;
	}
	#socialBUttonYoutube {
		background-image: url(../pic/social-buttons.png);
		background-position: -80px 0;
	}

/*
++++++++++++
Navigation
++++++++++++++
*/
#navMain, #navLeft, #navRight {
	white-space: nowrap;
}

#navMain {
	width: 75%; height:49px;
	position:absolute; top:47px; right:0;
	text-align:right;

	-webkit-transition: all 0.5s; /* Safari */
	transition: all 0.5s;

}

	#stickyContainer.sticky #navMain {
		top:10px;	
	}


#navLeft, #navRight {
	padding-top: 10px; 
}

#navLeft { /* teaserbox: nötig, da sonst die teaser ins menü fließen */
	float: none; 
}

/*
Highlight (ehem durch navigationHi())
*/
/* Aktiv-Zustand (inc_navigation_hi.asp) */
#navMain li > a.navHi,
#navMain li.navHi > a,
#navMain .megamenu_interact_theme .megamenu > li.navHi > a
{
	color: #8CD027;
}

	#navMain .megamenu_interact_theme .megamenu > #navMainWohnen.navHi > a {
		color: #4e9989;
	}
	#navMain .megamenu_interact_theme .megamenu > #navMainArbeit.navHi > a {
		color: #be3b5d;
	}
	#navMain .megamenu_interact_theme .megamenu > #navMainFreizeit.navHi > a {
		color: #e0a03b;
	}

#navTop > a.navHi {
	font-weight:600;	
}


#navTopPressezentrum.navHi > a
{
	color: #000;
}


/*++++++++++++
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: #68676c;
	border-style: solid;
	border-top-width: 0;
	
	background: none repeat scroll 0 0 #68676c;
	box-shadow: 0 0 10px #777;	
}
#containerbox_oben {	
}
#containerbox_unten {
}

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

/********************/
/* Rechte Spalte     */
/********************/
#colRight {
	position: relative;
	width: 31.7269%;	       /* 395:1245 */
	margin: 0 0 0 2.4096385%;  /*  30:1245 */
	padding: 0 0 0 0;  
	float: left;
	text-align: center;
	}

	#colDetailPageGanzeBreite #picContainer {	/*umschließt alle Bilder in der colRight*/
		display:none;
	}

/*
*************
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 0 50px 0;
		padding: 0;
		border: 0px none;
		text-align: left;
		/*font-size: 1.3em; line-height: 1.5em;*/
		background-color:#f0f0f0;
		overflow: auto; /*damit das element eine höhe erhält*/	
	}
	#colRight .teaserBox { /*teaserbox*/
	} 
	#colLeft .teaserBox { /*teaserbox*/
	} 	
	.teaserBox h5 { /*teaserbox*/
		margin: 0;
		padding-top: 10px;
		padding-bottom: 5px;
		text-align: center;
	}
	.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: 3px 10px 2px 25px;
		list-style-position: outside;
		text-align: left;
	}
	/* 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;
	}
				
	.teaserBox a:link, .teaserBox a:visited, .teaserBox a:hover, .teaserBox a:active {
		text-decoration: underline;
		display: block; /*feed-symbol wird so aber nicht mehr daneben sondern darunter angezeigt*/ /*display: block;*/
		font-size:1.5em;
		text-align:left; line-height:2em;
	}	

	.teaserBox h5 a:link, .teaserBox h5 a:visited {
		color: #000000; text-decoration:none;
		text-transform:uppercase; line-height:1.3333em;
		font-weight:600;
		border-bottom:1px solid #c8c8c8;
		margin:23px 8.333333% 0 8.333333%;
	}

	.teaserBox h5 a:active, .teaserBox h5 a:hover {
		color: #6E6E6E;
	}

	.teaserBox ul {
		margin:15px 8.333333% 14px 7%;
	}
	.teaserBox ul li {
		margin-bottom:6px;
	}
	.teaserBox ul li a:link, .teaserBox ul li a:visited {
		color:#ab002c;
		text-decoration:none;
		line-height:1.6em;
	}
	.teaserBox ul li a:hover, .teaserBox ul li a:active {
		color:#000;
	}

	.teaserBox ul li a:before
	{
		content: "■";
		color:#ab002c;
		font-size:15px;
		position:absolute; left:25px; margin-top:-1px; line-height:1.5em;
	
	}

	.teaserBox .eventdate {
		display:none;
	}

	.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;
		}

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

#colInhalt {
	position: relative;
	float: left; display: inline; /*IE6problem: doublemargin*/
	width: 65.863453%; /*=padding right bei #colDynPage #colInhalt*//* 820 bezogen auf 1245 ; */
	margin: 0;
	padding: 0;
	text-align:left;
	
	/* overflow:hidden; */
}

	#seite.windowBreite #colInhalt {
		width:100%; text-align:center;
	}

	#seite.windowBreite #colInhalt h2.lead {
		margin: 0 auto 30px auto;
		text-align:center;
	}

#colInhalt > ul,
#colInhalt > .contentWeiss > 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; 
}
#colInhalt > ul,
#colInhalt > .contentWeiss > ul,
#tinymce > .contentWeiss > ul
{/*wichtig:nicht tinymce!*/
	margin: 0 0 24px 0;
	text-align:left;
}

#seite.windowBreite #colInhalt > ul,
#seite.windowBreite #colInhalt > .contentWeiss > ul
{
	max-width:820px;
	margin-left:auto; margin-right:auto;
}

#colInhalt > ul > li,
#colInhalt .singleBox ul > li,
#colInhalt .teaserBoxContent ul > li,
#colInhalt > .contentWeiss > ul > li,
#fehlerhandling404 ul > li,
#tinymce ul > li {
		margin: 10px 0;
		padding-left: 20px;
		background:none;
		font-size:1.8em; line-height:1.3333em;
}

		#colInhalt > ul > li > ul > li, 
		#fehlerhandling404 ul > li > ul > li,
		#tinymce > ul > li > ul > li { 
				padding-left: 16px;
		}

/* Punkt*/
#colInhalt > ul > li:before,
#colInhalt > .contentWeiss > ul > li:before,
#colInhalt .singleBox > ul > li:before,
#colInhalt .teaserBoxContent > ul > li:before,
#tinymce > ul > li:before,
#fehlerhandling404 > ul > li:before
{
	content: ">";
	font-size:1em; font-weight:bold;
	line-height:1.5em;

	display: inline-block; width: 1em;
	margin-left: -18px;
	color:#82c124;
}

#colInhalt > ul.inhaltsverzeichnis {
	font-weight:600;
	padding-bottom:25px;
	border-bottom:1px solid #ccc;
	margin-bottom:50px;
}


#colInhalt > ul.infobox > li,
#tinymce > ul.infobox > li {
	padding:3px 0 1px 0;
	border-bottom:2px solid #ccc;
	line-height:1.3333em;
}

#colInhalt > ul.infobox > li strong,
#tinymce > ul.infobox > li strong {
	font-family: 'Open Sans', sans-serif; font-weight:400;
	color:#6f6f6f;
}


#colInhalt > ul.infobox > li:before,
#tinymce > ul.infobox > li:before
{
	content: "";
	color:#000;
	font-size:0.8em;
	position:absolute; left:0px; line-height:1.5em;
}


#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 {
	text-align:left; max-width:820px;
	display: block;
	list-style-type: decimal;
	margin:0px auto 24px auto;
	padding-left: 30px;

}
#tinymce ol {
	margin-left:0px;
}


#colInhalt ol > li, 
#tinymce ol > li {
		font-size:1.8em !important; line-height:1.3333em !important; text-align: left !important; 
		margin:10px 0 !important;
}

#colInhaltRahmenUnten, 
#colInhaltRahmenOben {
	clear: both;
}

#sieSindHier, 
#sieSindHierBottom,
#sieSindHierBottomV2 {
	width: 100%; min-height:35px;
	margin:0px 0 10px 0; padding: 10px; 
	color: #a8a9ae;
	text-align:center;
	font-size:1.4em; line-height:1.5em;
}
#sieSindHierBottom {
	margin: 0 0 15px 0; 
}

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

	#sieSindHierBottomV2 .dot {
		color:#a8a9ae;
	}

	#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: #8cd027;;
		text-decoration: none;
	}
	#sieSindHier a:hover, #sieSindHier a:active,
	#sieSindHierBottom a:hover, #sieSindHierBottom a:active,
	#sieSindHierBottomV2 a:hover, #sieSindHierBottomV2 a:active {
		color: #d0d3de;
		text-decoration: none;
	}


#fussShareButtons {
	height:50px; margin-top:30px; margin-bottom:30px;
	line-height:0;
}

	#fussShareButtons li {
		display:inline; font-size:0;
	}

	#fussShareButtons img {
		width:35px; height:35px; margin:10px;
		opacity: 0.7;
		filter: alpha(opacity=70); /* For IE8 and earlier */
		/* outline:2px solid #a8a9ae; */
	}

	#fussShareButtons img:hover {
		opacity: 1.0;
		filter: alpha(opacity=100); /* For IE8 and earlier */
		outline:2px solid #FFF;

		-webkit-transform: scale(1.15);
		-moz-transform: scale(1.15);
		-o-transform: scale(1.15);
		-ms-transform: scale(1.15);
		transform: scale(1.15);
	}

	#fussShareButtons img,
	#socialButtons img
	{
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		-ms-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}

	.contentWeiss {
		background:#FFF; padding:0; margin:0;
		padding:0px 0 20px 0;
		color:#000;
	}

	.contentWeiss > * {
		max-width:1245px;
	}

/*************/
/* FUSSZEILE */
/*************/
#fussZeile {
	clear: both; display:block;
	position: relative; 
	width:100%; 
	margin: 0 0 0 0; padding: 0;
	font-family: 'Open Sans', sans-serif; font-weight:400;
	text-align: center;
}

	/* NAVIGATION */
	#fussNavigation {
		background:#08186b; min-height:500px;
	}

		#fussNavigationSpalten {
			max-width:1245px; margin:0 auto 0 auto;

			/* #isVisibleInViewport */
			-webkit-transition: all 3s ease-in-out;
			transition: all 3s ease-in-out;
			opacity: 0.2;

		}
		#fussNavigationSpalten.isvisible {
			opacity: 1;
		}

		#fussNavigationSpalten .spalte1,
		#fussNavigationSpalten .spalte2,
		#fussNavigationSpalten .spalte3
		{
			float:left; width:395px; /* 395:1245 */
			text-align:left;
			min-height:480px;
		}

		#fussNavigationSpalten .spalte1,
		#fussNavigationSpalten .spalte3
		{
			margin-top:145px;
		}

		#fussNavigationSpalten .spalte2
		{
			margin:70px 2.40964% 0 2.4096385%; /* 30:1245 */
		}
		#fussNavigationSpalten .spalte2 h2,
		#fussNavigationSpalten .spalte2 .formAnweisung {
			font-size:0; line-height:0; margin:0; padding:0;			
		}

		#fussNavigationSpalten p, #fussNavigationSpalten h2 {
			line-height:22px; font-size:1.5em;
			margin-bottom:0px;
		}
		#fussNavigationSpalten p {
			margin-bottom:30px; color:#FFF;
		}

		#fussNavigationSpalten p span {
			width:85px; display:block; float:left; text-align:right; margin-right:20px;
			font-weight:600;
			opacity: 0.8;-moz-opacity: 0.8;filter: alpha(opacity=80); -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
		}
		#fussNavigationSpalten p a:link, #fussNavigationSpalten p a:visited {
			margin-bottom:30px; color:#93cc3a;
		}
		#fussNavigationSpalten p a:hover, #fussNavigationSpalten p a:active {
			margin-bottom:30px; color:#FFF;
		}

		#fussNavigationSpalten a > div:nth-of-type(1) {
			width:85px; height:85px; display:block; /* 85:395 */
			float:left; margin-right:5.06329%;					/* 20:395 */
			margin-bottom:20px;
		}
		#fussNavigationSpalten .dahoam div:nth-of-type(1) {
			background: url("../pic/icons.png") no-repeat 1px 0px;
		}
		#fussNavigationSpalten .klimaneutral div:nth-of-type(1) {
			background: url("../pic/icons.png") no-repeat 1px -85px;   /* 16.5% */
		}

		#fussNavigationSpalten .nonprofit div:nth-of-type(1) {
			background: url("../pic/icons.png") no-repeat 1px -430px;   /* 16.5% */
		}

		#fussNavigationSpalten .proethik div:nth-of-type(1) {
			background: url("../pic/icons.png") no-repeat 1px -170px;; /* 33% */
		}
		#fussNavigationSpalten .support div:nth-of-type(1) {
			background: url("../pic/icons.png") no-repeat 1px -255px;  /* 50% */
		}
		#fussNavigationSpalten .anschrift div:nth-of-type(1) {
			background: url("../pic/icons.png") no-repeat 1px -340px;
		}

		#fussNavigationSpalten a.anschrift {
			display:block; height:90px; clear:both; text-decoration: none;
		}

		#fussNavigationSpalten a div:nth-of-type(2) {
			width:290px; min-height:85px; float:left; 
		}
		#fussNavigationSpalten a div:nth-of-type(2) h2 {

		}
		#fussNavigationSpalten a div:nth-of-type(2) p {
			-webkit-hyphens: auto;
			-ms-hyphens: auto;
		}

		#fussNavigationSpalten a:link div, #fussNavigationSpalten a:visited div {
			color:#FFF;
			opacity: 0.8;-moz-opacity: 0.8;filter: alpha(opacity=80); -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
		}
		#fussNavigationSpalten a:link div p, #fussNavigationSpalten a:visited div p {
			opacity: 0.8;-moz-opacity: 0.8;filter: alpha(opacity=80); -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";		
		}

		#fussNavigationSpalten a:hover div, #fussNavigationSpalten a:active div,
		#fussNavigationSpalten a:hover div h2, #fussNavigationSpalten a:active div h2 		
		{
			color:#FFF;
			opacity: 1; -moz-opacity: 1; filter: alpha(opacity=100); -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; 
		}



	/* SITEMAP */
	#fussZeile #fussSitemap {
		width:100%; /* min-height:500px; */
		height:500px; overflow:hidden;
		margin:0 auto 0 auto;
		background: #93cc3a;
		position:relative; /* #particles */
	}

		#fussZeile #fussSitemap h1 {
			width:100%; max-width:none;
			padding-top:80px; margin-bottom:32px;			
			text-align:center;
			/* background: url(../pic/head_underline_white.gif) bottom center no-repeat; */
			color:#FFF;
		}
		#fussZeile #fussSitemap h1::after {
			left: 50%;
			-webkit-transform: translateX(-50%);
			-moz-transform: translateX(-50%);
			transform: translateX(-50%);
			border-color: #FFF;
		}


		#fussZeile #fussSitemap #fussSitemapSpalten {
			max-width:1245px; margin:0 auto 0 auto;
			position:absolute; /* #particles */

			top:0;
			right:0;
			bottom:0;
			left:0;
			z-index:0; background:transparent;

			/* #isVisibleInViewport */
			-webkit-transition: all 3s ease-in-out;
			transition: all 3s ease-in-out;
			opacity: 0.2;

		}
			#fussZeile #fussSitemap #fussSitemapSpalten.isvisible {
				opacity: 1;
			}


		#fussZeile #fussSitemap #fussSitemapSpalten::after { /* passt Containerhöhhe an */
			clear: both; content: ""; display: block; line-height: 0; height: 0;
		}

		#fussZeile #fussSitemapSpalten a:link, #fussZeile #fussSitemapSpalten a:visited
		{			
			color:#2f4213; 
			text-decoration:none;
		}
		#fussZeile #fussSitemapSpalten li.main a:link, #fussZeile #fussSitemapSpalten li.main a:visited {
			color:#FFF; 
		}

		#fussZeile #fussSitemapSpalten a:hover, #fussZeile #fussSitemapSpalten a:active,
		#fussZeile #fussSitemapSpalten li.main a:hover, #fussZeile #fussSitemapSpalten li.main a:active
		{
			color:#000; 
		}

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

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

		#fussZeile #fussSitemap #fussSitemapSpalten .spalte1,
		#fussZeile #fussSitemap #fussSitemapSpalten .spalte2,
		#fussZeile #fussSitemap #fussSitemapSpalten .spalte3
		{
			float:left; width:31.726907%; /* 395:1245 */
			text-align:center;
			min-height:300px;
			font-size:1.8em; line-height:30px;
		}
		#fussZeile #fussSitemap #fussSitemapSpalten .spalte2 {
			margin-left:30px; margin-right:30px;
		}

		#fussZeile #fussSitemap #fussSitemapSpalten li.main::before {
			content: ""; margin-right:0;
		}


		#interactLink a:link, #interactLink a:visited {
			padding:15px; display:block;
			font-size:1.5em; font-weight:400; line-height:18px;
			color:#efa24b; text-decoration:none;
		}
		#interactLink a:hover, #interactLink a:active {
			color:#000;
		}

		#firmenanschrift {
			font-size:1.6em; color:#FFF; line-height:1.5em; padding:10px;
		}

			#firmenanschrift a:link, #interactLink a:visited {
				color:#FFF;
			}

			#firmenanschrift a:hover, #interactLink a:active {
				color:#000;
			}


	#fussZeile #sieSindHierBottomV2 {
		display:none;
		font-size:1.5em;
		padding:0; margin:0 2.0833333% 0 2.0833333%; min-height:0;
		border-bottom:1px solid #c8c8c8;
	}




	/* TEASER */
	#fussZeile #fussTeaser {
		width:100%; max-width:1200px; min-height:230px;
		margin:0 auto 0 auto;
		background:#FFF;		
		position:relative;
	}

	#fussZeile #fussTeaser ul {
		width:100%; font-size:0; margin-top:60px;
	}

	#fussZeile #fussTeaser ul li {
		display: inline-block;
		margin:0 0 50px 0; padding:0;
		width: 350px; height:250px;
		line-height: 0px;
		font-size: 62.5%;  /* Basis-Font-Size */
		color: #68676c;
	}
	#fussZeile #fussTeaser ul li h2 {
		font-size:1.5em; text-transform:uppercase;		
		border-bottom:1px solid #c8c8c8;
	}

	#fussZeile #fussTeaser ul li h2 a:link, #fussZeile #fussTeaser ul li h2 a:visited
	{
		text-decoration:none;
	}

	#fussZeile #fussTeaser #fussTeaserAnreise {
		width:300px;
	}

	#fussZeile #fussTeaser #fussTeaserSpenden div {
		width:300px; height:185px;
		padding:18px 15px 0 20px;
		background: url("../pic/spende_back.jpg") no-repeat;
	}

		#fussZeile #fussTeaser #fussTeaserSpenden p {
			float:left; margin-bottom:12px;
			font-size:1.5em; line-height:1.2em;
		}

	#fussZeile #fussTeaser iframe {
		width:300px; height:185px; display: block;
		border: 0px; top: 0px;
		text-decoration: none;
	}


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


.mehr, 
.zurueck, 
.blaettern,
.zentriert {

}

	.mehr {
		display:block; clear:left;
	}

	#seite p.mehr {
		display:block; 
		max-width:820px; width:100%;
		text-align:center; min-height:30px;
		margin-bottom:30px;
	}

	#seite #colInhalt > p.mehr a,
	#seite #colInhalt div:not(.loopKundenstimmenSlider) > p.mehr a,
	#tinymce > p.mehr a
	{
		display:flex;
	    min-height: 65px; max-width: 395px; width:100%;
		align-items: center;
		justify-content: center;
		border: 1px solid #93cc3a;
		text-align: center;
		text-decoration: none;
		line-height: 24px;
		border-radius: 5px;
		color:#93cc3a;
		margin:0 auto 0 auto;
	}

	#seite #colInhalt p.mehr a:hover,
	#seite #colInhalt li.mehr a:hover,
	#fussTeaser p.mehr a:hover
	{
		background:#091c7d; border-color:#091c7d;
		color:#93cc3a;
	}

	#fussTeaser p.mehr a,
	#seite #colInhalt li.mehr a,
	#seite .loopKundenstimmenSlider p.mehr a
	{
		text-decoration: none;
		color:#93cc3a;
	}

	#seite .loopKundenstimmenSlider p.mehr {
		text-align:right;
	}

	#fussTeaser p.mehr a:hover,
	#seite #colInhalt li.mehr a:hover,
	#seite .loopKundenstimmenSlider p.mehr a:hover	
	{
		text-decoration: none;
		color:#091c7d; background:none;

	}


	.blaettern {
		display:none;
		float: left; /*display: inline;*/
		width: 100%;
		margin-top: 0px;
		clear: both; 
		font-size:1.8em; 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:#000;
}

	.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 .vorher a {
			margin-right:10px;
			text-decoration:none;
		}

	.blaettern .seiteninfo {
		float: left; /*display: inline;*/
		text-align: center;
	}
	.blaettern .nachher {
		float: right; /*display: inline;*/
		text-align: right;
	}
		.blaettern .nachher a {
			margin-left:10px;
			text-decoration:none;
		}

	.mehr img {
	}

.datum {
	float: left; /*display: inline;*/
	margin: 0 0 3px 0;
	color: #010101;
}

.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, .loopMitAbstand {
	margin:0 auto 0 auto;
	font-size: 10px; font-size: 1rem;  /* Basis-Font-Size */
	clear:right;

	/* #isVisibleInViewport */
	-webkit-transition: all 3s ease-in-out;
	transition: all 3s ease-in-out;
	opacity: 0.2;
}
	.loopOhneAbstand.isvisible, .loopMitAbstand.isvisible {
		opacity: 1;
	}

	
	#colRight .loopOhneAbstand,
	#colLeft .loopOhneAbstand {
		overflow: auto; /*damit das element eine höhe erhält*/
	}

	/* Loop auf halber Seitenbreite */
	#colInhalt .doubleLoop .loopOhneAbstand,
	#colInhalt .doubleLoop .loopMitAbstand
	{
		display:inline-block; float:none;
		width:48.755%; max-width:607px;
		margin-left:1.17647%; margin-right:1.17647%; /* 15:(1245+15+15) */
		vertical-align:top; /* wichtig für divs im doubleLoop */
	}
	

.loopMitAbstand {
	margin-top:50px;
}


.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;
	display:block; /* früher display:inline; damit es sich höhe nimmt*/
}

	.loopStartBoxes ul {
		font-size:0; /* #ulFontSize0 */
	}

	.loopStartBoxes > ul > li {
		display:inline-block;
		margin:0 15px 30px 15px; /*0 2.38095% 45px 2.38095%; /* margin:1.8018018%; */
		/* height:185px; */

		width:395px; height:297px !important; overflow:hidden;

		line-height:0px; text-decoration:none;
		text-align:center;
		font-size: 10px; font-size: 1rem;  /* Basis-Font-Size */
		color:#68676c;

	}

		.blau .loopStartBoxes > ul > li {

			/* #isVisibleInViewport */
			width:300px; height:225px !important;
			-webkit-transition: width 1s ease-in-out;
			transition: width 0.5s ease-in-out;
			opacity: 0.2;

		}

		.blau .loopStartBoxes.isvisible > ul > li {
			width:395px; height:297px !important; 
			opacity: 1;
		}


	.loopStartBoxes > ul > li.mehr {
		height:inherit !important;
	}


	.loopStartBoxes.columns4 > ul > li {
		width:297px; height:223px !important; margin:0 10px 30px 10px;
		font-size:8px;
	}


	.loopStartBoxes .bausteinGruppe > *,
	.loopStartBoxes ul > *  { 
	}	

		.loopStartBoxes ul a:link {
			text-decoration:none;
		}

		.loopStartBoxes ul a h2,
		.loopBildTextSlider	ul a h2,
		.loopTextSlider ul a h2,
		.loopTeaserSlider ul a h2
		{
			color:#FFF; text-decoration:none;
			background:rgba(140,208,39,0.9);
		}

		.loopStartBoxes .loopListe .mask:hover .loopText h2,
		.loopBildTextSlider	.flexslider .mask:hover .loopText h2,	
		.loopKundenstimmenSlider .flexslider .mask:hover .loopText h2,	
		.loopTeaserSlider .flexslider .mask:hover .loopText h2,
		.loopTextSlider .flexslider .mask:hover .loopText h2
		{
			display:flex; /* bei Kunden zuvor ausgeblendet */
			color:#000;
			background-color: transparent;
	
			-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;
		}

		.loopTextSlider .flexslider .mask:hover .loopText h2 {
		}

		.loopStartBoxes ul li:hover	> a > h2,
		.loopStartBoxes ul li > .linkersatz > a h2:hover		
		{
			color:#FFF; text-decoration:none;
		}

		.loopStartBoxes a img, .loopListe a img, .slides a img {

			-webkit-transition: 0.6s ease-in-out;
			-moz-transition: 0.6s ease-in-out;
			-o-transition: 0.6s ease-in-out;
			-ms-transition: 0.6s ease-in-out;
			transition: 0.6s ease-in-out;
		}
		
		/* ZoomInEffekt bei StartBoxe & loopListe: vgl. global_mediaqueries */
		.loopStartBoxes a:hover img, .loopListe a:hover img, .slides a:hover img {

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

	/*mask: imagewrapper */
	.loopListe li .mask,
	.slides li .mask,
	.loopKundenstimmenSlider .flexslider .slides li .mask
	{
		float:left;
		width:23.855421%; /* 297:1245 */
		overflow:hidden;
		border:0px none;
	}

		.slides li .mask {

		}

		.loopKundenstimmenSlider .flexslider .slides li .mask {
			float:none; border:3px solid #FFF;

		}

		.loopStartBoxes .mask,
		.loopStartBoxes .loopListe li .mask,
		.flexslider .slides li .mask {
			width:100%;
			/* margin-bottom:19px; */
			background: url("../pic/button-loading.png") no-repeat 50% 50%;
			overflow:hidden;
			position:relative;
		}

		.loopListe.kundenstimmen li .mask,
		.loopKundenstimmenSlider .slides li .mask { 
			border-radius:100%; border:3px solid #FFF;
			float:none; margin:-15px auto 0px auto;
		}
		.loopKundenstimmenSlider .slides li .mask { 
			background:none; margin:0px auto 0px auto;
		}

		.loopTextSlider .flexslider .slides li .mask {
			background:#93cc3a; height:297px;
		}
		.loopTextSlider .flexslider .slides li:hover .mask {
			background:#9fdc3f;;
		}
	
		.loopStartBoxes .loopListe .mask div.loopText p,
		.loopStartBoxes .slides .mask div.loopText p,
		.flexslider .slides .mask div.loopText p 	
		{
			width: 100%; margin:0px 0 0 0;
			text-align:center;
			overflow:hidden;
			padding:0px 30px 2px 30px; /* 13:316 */
			font-size:1.5em;
			color:#FFF;
	
			opacity: 1;
			filter: alpha(opacity=1);
	
			-webkit-hyphens: auto;
			-ms-hyphens: auto;
			hyphens: auto;
	
		}
		.loopTextSlider .flexslider .slides .mask div.loopText p {
			text-align:left; color:#000;
		}

	.loopListe li .mapWrapper {
		position:relative;
		float:left; clear:none;
		width:46.15384615384615%; margin:0;
		padding-bottom:46.15384615384615%;
		overflow:hidden;
	}

	.loopListe li .mapWrapper iframe,
	.loopListe li .mapWrapper img
	{
		position:absolute; width:100%; height:100%;
		top:0px; left:0px;
		background: url("../pic/button-loading.png") no-repeat 50% 50% #f0f0f0;
	}


.loopBildTextSlider,
.loopKundenstimmenSlider,
.loopTeaserSlider,
.loopTextSlider
{
	clear:both;
	position:relative;
	width:100%; max-width:1245px;
	margin:0 auto 0 auto;
	font-size: 10px; font-size: 1rem;  /* Basis-Font-Size */
}

	.loopBildTextSlider h1::after, .loopTeaserSlider h1::after, loopTextSlider h1::after {
		width:0px; height:0px; display:none; z-index:-1 !important;
	}

	.loopKundenstimmenSlider {

		display: inline-block;
		float: none;
		width: 48.755%;
		max-width: 607px;
		margin-left: 1.17647%;
		margin-right: 1.17647%;
		vertical-align: top;
		margin-top:50px;
	}

	#colInhalt .loopTeaserSlider h1 {
		margin-bottom:5px;
	}

	.loopBildTextSlider .slides li,
	.loopGalerieSlider .slides li {
		width:297px !important; height:297px !important;
		overflow:hidden;
	}

	.loopTeaserSlider .slides li {
		overflow:hidden;
	}
	.loopTextSlider .slides li {
		width:395px !important; height:297px !important;
		overflow:hidden;
	}
	.loopKundenstimmenSlider .slides li {
		height:329px; /* 314+15 */
		/* Background mit weißter Kante, da overflow bei Slider nicht möglich */
		background: url(../pic/quote_back.gif) repeat-x 15px 15px #FFF; 
		overflow:visible;
	}

	/* #back_hi: Rollover-Background-Animation nur bei DIVs möglich, nicht bei background-css	 */
	.loopKundenstimmenSlider .slides li .back_hi {
		position:absolute; top:0;
		width:100%; height:329px;
		background: url(../pic/quote_back_hi.gif) repeat-x 15px 15px #FFF; 
		opacity:0;
		transition: opacity .25s ease-in-out;
		-moz-transition: opacity .25s ease-in-out;
		-webkit-transition: opacity .25s ease-in-out;
	}
	.loopKundenstimmenSlider .slides li:hover .back_hi {
		opacity:1;
		filter: alpha(opacity=100);
	}

	.loopKundenstimmenSlider .slides li a {
		background: url("../pic/quote.png") 30px 45px no-repeat;
		text-decoration:none;
	}


/****************/
/* loopListe    */
/****************/
ul.loopListe {
	width:100%; text-align:center;	
}

	ul.loopListe.kundenstimmen {
		display:inline-block; float:none;
		width:100%; 
		margin-left:1.17647%; margin-right:1.17647%; /* 15:(1245+15+15) */
		vertical-align:top; /* wichtig für divs im doubleLoop */
		font-size:0;
	}

	ul.loopListe li {
		font-size: 10px; font-size: 1rem;  /* Basis-Font-Size */
	}

	/* #colInhalt .abstand ul.loopListe { */
	#colInhalt .abstand {
		margin-top:45px;
	}

	#colInhalt .loopStartBoxes.abstand {
		margin-top:0px;
	}


	#colInhalt .loopStartBoxes ul.loopListe {
		margin-top:15px !important;
	}

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

		.ganzeBreite ul.loopListe.kundenstimmen {
			max-width: 1245px;
		}

		.ganzeBreite .halbeBreite ul.loopListe.kundenstimmen {
			max-width: 1275px;
		}

	.loopStartBoxes ul.loopListe {
		max-width:1275px;
		margin:0 auto 0 auto;
	}

	.loopListe > li {

		position:relative;
		width:100%; padding-top:23.7751%;

		overflow:hidden;
		margin-bottom:25px;
		background:#93cc3a;

		/* transition: keine, da von gradient nicht unterstützt */

	}


		.loopListe > li.mehr {
			padding-top:30px;
		}

		.loopListe.kundenstimmen > li {
			display: inline-block;

			background:#ccc; padding-top:51.56%; /* 313:607 */
			overflow:visible;
			background: url("../pic/quote.png") 30px 30px no-repeat #93cc3a;

			/* max-width:820px; */
			padding-top:0; padding-bottom:25px;
			font-size: 10px; font-size: 1rem;  /* Basis-Font-Size */
			text-decoration: none; text-align: center;
			color: #68676c;
			vertical-align:top;

		}



		#colInhalt > .halbeBreite > .loopListe.kundenstimmen > li {
			max-width:607px;
			margin: 0 15px 30px 15px;
		}
		#colInhalt > .halbeBreite > .loopListe.kundenstimmen > li:not(.mehr) {
			min-height:314px;
		}

		#colInhalt > .halbeBreite > .loopListe.kundenstimmen .loopText p {
			font-size:1.8em; line-height:24px;
		}


	.loopStartBoxes .loopListe > li {
		background:transparent;
	}

	.loopListe > li:hover,
	.slides > li:hover
	{
		background-color:#9fdc3f;
	}
	.loopKundenstimmenSlider .slides > li:hover {
		background-color:inherit;
	}


	.loopListe > li.mehr,
	.loopTeaserSlider p.mehr,
	.loopKundenstimmenSlider p.mehr
	{
		text-align:right; min-height:30px; float:right;
		width:100%; padding-bottom:0;
		background:transparent;
		line-height:24px;
		font-size:15px;
		margin-top:-10px;
	}

	.loopListe.kundenstimmen > li.mehr {
		float:right;
	}


	.placeholder.loading {
		width:100%; min-height:50px;
		background-image: url(../pic/button-loading.gif); /* https://icons8.com/preloaders/ */
		background-repeat:no-repeat;
		background-position:center top;
	}

	.placeholder.loading.hide {
		background:none;
	}
	

	.loopListe > li.mehr.loading
	{
		background-image: url(../pic/button-loading.gif); /* https://icons8.com/preloaders/ */
		background-repeat:no-repeat;
		background-position:center top;
	}
	.loopListe > li.mehr.loading a {
		display:none !important;
	}

	.loopListe > li.mehr.hide {
		display:none !important;
	}

	.loopListe > li.mehr:after {
		font-size:15px; line-height:30px;
		height:30px; color:#93cc3a;
	}
	.loopListe > li.mehr:hover::after,
	.loopTeaserSlider p.mehr a::after  {
		color:#000;
	}


	.loopStartBoxes .loopListe > li {
		padding-top:0;
	}

	.halb .loopListe > li {
		margin-bottom:30px;
	}
		.loopListeXXX li:after {/* damit li gleich hoch wie sein content */
			clear: both;
			content: "";
			display: block;
			line-height: 0;
			height: 0;
		}


	.loopListe li .linkersatz,
	.loopListe > li > a,
	.slides > li > a,
	.textbaustein, 
	.textbaustein a
	{
		clear:left; float:left; width:100%;
		display: block; padding:0px; /* padding:1.97568%; /* 13:658 */
		text-decoration:none; /* GoogleChrome */
		position:absolute; top:0; left:0; right:0; bottom:0;
		z-index:1500;
	}

	.loopListe.kundenstimmen > li > a,
	.slides > li > a 	
	{
		position:relative;
	}


	.loopStartBoxes .loopListe li .linkersatz,
	.loopStartBoxes .loopListe li a {
		padding:0px;
	}

	.loopListe li .linkersatz {
		background:transparent;
	}

	.loopListe li img,
	.loopListe.kundenstimmen > li img
	{
		float:left;
		width:133.446%; 
		margin:0 0 0 -16.9%;
	}
	.loopStartBoxes .loopListe li img {
		margin-left:0;
	}
	.loopListe li img {
		/*
		opacity: .99;
		*/
	}

	.loopBildTextSlider .flexslider .slides img,
	.loopKundenstimmenSlider .flexslider .slides img,
	.loopTeaserSlider .flexslider .slides img,
	.loopTextSlider .flexslider .slides img 	
	{
		width:133.446%; margin:0 0 0 -16.9%;
	}

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

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

	.loopListe li div.loopText,
	.slider li div.loopText 
	{	
		float:left;
		width:72.931726%;		     /* 1225-40-297 : 1245 */ 
		margin:0 0 0 3.21285%;	    /* 40:1245 */
		padding:0 3.2% 0 0;
		height:95%; overflow:hidden;
	}

		.doubleLoop .loopListe li div.loopText {
			height:100%;
		}

		/* :not(.loopListe.kundenstimmen) div.loopText::after { */
		ul:not(.kundenstimmen):not(.startseite):not(.dynpreview) div.loopText::after {
			content: "";
			height:35%;
			width:72.9317%;
			position: absolute;
			background-image: linear-gradient(to top, #93cc3a, transparent);
			bottom: 0px; right:0px;
			z-index:10000;
		}
		.loopKundenstimmenSlider div.loopText::after,
		.loopTeaserSlider div.loopText::after {
			display:none;
		}

		.loopListe > li:hover div.loopText::after
		{
			background-image: linear-gradient(to top, #9fdc3f, transparent) !important;
		}


		.loopListe.kundenstimmen li div.loopText,
		.loopKundenstimmenSlider .slides li div.loopText
		{
			width:100%; text-align:center;
			padding:0 3.2% 0 3.2%; margin:5px 0 0 0;
		}

		.loopListe.kundenstimmen .loopText h2,
		.loopListe.kundenstimmen .loopText h3,
		.loopListe.kundenstimmen .loopText p,

		.loopKundenstimmenSlider .loopText h2,
		.loopKundenstimmenSlider .loopText h3,
		.loopKundenstimmenSlider .loopText p

		{
			text-align:center; margin:0; padding:0;
		}

		.loopListe.kundenstimmen .loopText p
		{
			margin-top:8px;
		}

		.halbeBreite .loopListe.kundenstimmen .loopText p,
		.loopKundenstimmenSlider .slides .loopText p		
		{
			margin-top:8px;
			font-size:1.5em; line-height:22px;
		}

	.loopListe li div.loopText.noPic {
		width:100%;		
	}

	.loopListe .mapUndText {
		margin-bottom:25px;
	}

		.loopListe .mapUndText::after {
			clear: both;
			content: "";
			display: block;
			line-height: 0;
			height: 0;
		}

	.loopKontaktDetail .loopListe li div.loopText {
		margin:0 0 0 7.692307692307692%; /* 50:650 */
		width:46.15384615%; float:left;
	}

	.loopKontaktDetail .loopListe li div.loopText.noPic {
		margin:0; width:100%;
	}

	.loopStartBoxes .loopListe li div.loopText,
	.loopBildTextSlider	.flexslider li div.loopText,
	.loopTeaserSlider .flexslider li div.loopText,
	.loopTextSlider .flexslider li div.loopText
	{
		width:100%; margin:0; padding:0;

		/* #umbau maskAnimation */
		position: absolute;
		color: #000;
		z-index: 100;
		left: 0;

		padding-top:233px;
		height:550px;
		top:0px;

		/* transition */
		-webkit-transition: all 500ms ease-out;
		-moz-transition: all 500ms ease-out;
		-o-transition: all 500ms ease-out;
		-ms-transition: all 500ms ease-out;	
		transition: all 500ms ease-out;

	}
	.loopTextSlider .flexslider li div.loopText {
		padding-top:0; text-align:left;
	}

	.loopBildTextSlider	.flexslider li div.loopText,
	.loopKundenstimmenSlider .flexslider li div.loopText,
	.loopTeaserSlider .flexslider li div.loopText,
	.loopTextSlider .flexslider li div.loopText
	{
		width:100%;
	}

	.loopStartBoxes .loopListe li div.loopText p {
		/* transition */
		-webkit-transition: all 500ms ease-out;
		-moz-transition: all 500ms ease-out;
		-o-transition: all 500ms ease-out;
		-ms-transition: all 500ms ease-out;	
		transition: all 500ms ease-out;

	}

	.loopStartBoxes.hideTitle .loopListe li div.loopText {
		padding-top:180px;
		opacity:0;
	}

	.loopStartBoxes.hideTitle .loopListe li:hover div.loopText {
		opacity:1;
	}

ul.loopBilder {
	width:103.74% !important;
	margin-left:-1.86916%;
	margin-right:-1.86916%;
	font-size:0; text-align:center;
}

	ul.loopBilder li {
		display:inline-block;
		margin-left:1.8018018%; margin-right:1.8018018%; margin-bottom:3.6036036%;
		width:13.063063%; /* 145:1110 */
		height:13.063063%; padding:0; line-height:0; font-size:0;
	}

	ul.loopBilder a,
	ul.loopBilder li .mask
	{
		width:100%; height:100%;
		overflow:hidden;
	}

	ul.loopBilder li img {
		width:100%; height:100%;
	}

.loopStartBoxes .loopListe .mask:hover .loopText
{
	/* Animation */
	-moz-transform: translateY(-150px);
	-o-transform: translateY(-150px);
	-webkit-transform: translateY(-150px);
	transform: translateY(-150px);

	/* Stil Allgemein */
	background-color: rgba(144,206,53,0.9);
}

.loopBildTextSlider .flexslider .mask:hover .loopText,
.loopKundenstimmenSlider .flexslider .mask:hover .loopText,
.loopTeaserSlider .flexslider .mask:hover .loopText
{
	/* Animation */
	-moz-transform: translateY(-220px);
	-o-transform: translateY(-220px);
	-webkit-transform: translateY(-220px);
	transform: translateY(-220px);

	/* Stil Allgemein */
	background-color: rgba(144,206,53,0.9);
}



	.loopStartBoxes.hideTitle .loopListe .mask:hover .loopText,
	.loopStartBoxes.hideTitle .slides .mask:hover .loopText
	{
		background-color: rgba(144,206,53,0.97);
	}





.loopStartBoxes .loopListe .mask:hover div.loopText p,
.loopStartBoxes .loopListe .mask:hover div.loopText p 
{

	opacity: 1.0;
	-moz-opacity: 1.0;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	background-color: transparent;
}

	div.loopText p {
		margin-bottom:0px;
		font-size:1.8em; /* #ulFontSize0 */
		color:#161e09;

	}


	.loopListe li div.loopText p.datum {
		font-size:1.8em;
		margin:0 0 6px 0;
		font-weight:400; 
		color:#FFF;
	}

	.loopListe li .mask p.datum,
	.slides li .mask p.datum	
	{
		font-size:1.5em;
		position:absolute; left:0; top:0; z-index:1000;
		color:#FFF; background:#08186b;
		padding:3px 5px 2px 5px;
	}

	.halb .loopListe li div.loopText p.datum {
		font-size:1.5em; margin-bottom:4px;
	}


.loopTeaserSlider {
}

	.loopTeaserSlider .flexslider {
		width: calc(100% - 316px);

	}

	.loopTeaserSlider h1 {
		display:block; float:left;
		width:297px; height:297px; 
		padding:30px 0 0 30px;
		text-align:left !important;
		background:#989898; color:#FFF;
		border:1px solid #ccc;
		margin-right:19px;
	}


.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,
#colDetailPageBlase
{
	width: 100%; /* 1000px; */
}

/* Pseudo colRight - auch picDetailContainer beachten */
#colDynPage #colInhalt {
	width: 100%;					 /* 100% wenn kein colLeft	*/
	padding-right: 34.13654%;	    /* 395+30:1245 */
}

/********************/
/* Table:           */
/********************/
table {
	width:100%;
	border-bottom:1px solid #000;
	max-width:820px; margin:0 auto 30px auto;
}

table td, table th {
	font-size:1.5em; line-height:1.3333em;
}

	table thead tr th {

	}
	
	/* Produktname */
	table thead tr:first-child th {
		font-weight:600;
		color:#000;
		font-size:1.8em;
		padding-bottom:6px;
	}

	table thead th {
		padding-bottom:6px;
	}

	/* Spalten-Überschrift */
	table tbody tr th {
		font-weight:400;
		color:#000;
		padding-bottom:6px;
		border-bottom:1px solid #ccc;
		text-align:right;
	}
	table tbody tr th:first-child,
	table tbody tr td:first-child	
	{
		text-align:left;
	}

	table tbody tr td {
		padding:10px; width:25%;	
		text-align:right;
		position:relative;
	}

	table tbody tr:nth-child(even) td {
		background:#ccc;
	}


	/* Bestellen */
	table tbody tr td a.material-icons {
		text-decoration:none;
		margin:0; font-size:25px;
		position:absolute; top:6px; right:10px;
	}


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

/* Positionierung ausserhalb colInhalt in Pseudo-ColRight oder colRight*/
.picDetailContainer {
	float: right; display: inline;
	width: 48.170731%; /* 395px bezogen auf colinhalt 820  */

	/* relativ platziert zu rechter Kante von colInhalt
	/* rechter Rand = Bildbreite + padding+rechterRand(colInhalt) als Minuswert: 395+30:820 */
	/* linker Rand = rechterRand colInhalt, damit in IE und Firefox gleich: 0 */

	margin:0 -51.829268% 30px 0;
	padding: 0;
	clear: right;
	/* auch #colDynPage #colInhalt beachten */
}

	p.maxBreite .picDetailContainer,
	.kundenstimmen p .picDetailContainer	
	{
		float:none; display: inline-block;
		width:47.6078%; margin:15px 1.17647% 15px 1.17647%;
		vertical-align:top; line-height:0;
	}

		.kundenstimmen p .picDetailContainer {
			width:395px; height:297px; margin:-60px 0 0 0;
		}


	#picContainer .picDetailContainer .mask {
		width:100%;
		height:100%;
	}

	.picDetailContainer .mask {
		border:0 none;
		display:block;

		overflow:hidden;
		position:relative;
		line-height:0;
	}

		.kundenstimmen .picDetailContainer .mask {
			width:297px; height:297px;
			border-radius: 100%;
			border: 3px solid #FFF;
			float: none;
			margin: 0px auto 0px auto;
		}


	#picContainer .picDetailContainer {
		width:100%;
	}

	#picContainer .picDetailContainer .mask,
	#picContainer .picDetailContainerMini .mask
	{
		margin-bottom:8.3333%; /* 25:30 */
	}

	#picContainer .picDetailContainerMini .mask {
		width: 46%; /* 145:330 */
		height:46%; float:left;
		padding:0;
		display:block;
	}
	#picContainer .picDetailContainerMini .last {
		float:right;
	}

	#colRight .picDetailContainer {
		margin: 0;
	}

	#colRight .picDetailContainer p {
		height:26px;
		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; 
	}
	
	#colDynPage .picDetail, 
	#colRight .picDetail, 
	#colDetailPage .picDetail,
	#colDetailPageBlase {
		width: 100%;
		margin: 0 0 0 0;  /* 26:316 */
		padding: 0;
	}

	.loopStartBoxes .mask .picDetail,
	.loopStartBoxes .mask .picPreview
	{
		float:none; padding:0;
		width:100%;
	}

	.loopStartBoxes.columns4 .mask .picPreview {
		/* Bild mittig platzieren */
		width:200px; margin:36px auto 37px auto;

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

	.loopStartBoxes.columns4 li:hover .mask .picPreview {
		-webkit-transform: scale(1.485);
		-moz-transform: scale(1.485);
		-o-transform: scale(1.485);
		-ms-transform: scale(1.485);
		transform: scale(1.485);
	}

	.maxBreite .mask .picDetail
	{
		float:none; padding:0; margin:0;
		width:100%;
	}
	.kundenstimmen .mask .picDetail
	{
		width:395px;
		float: none;
		margin: 0;
		padding: 0; 
		margin-left:-49px;
	}


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


.picPreview {
}

	.loopTextSlider .flexslider .slides .picPreview {
		display:none;
	}


/*minibild*/
.picMini {
	float: left; /*display: inline;*/
	margin:0; /* 26:316 */
	width:100%;
}
.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 {
	} 

	/* internMask vgl. .mask */
	.internMask {
		margin: 15px auto 20px auto;
		display: block; max-width:820px;
	}

	.internMask span:not(.picDetailInternP) {
		max-width:820px; 
		width:100%; height:75%;

		float: none;
		display: inline-block;
	
		margin: 0px auto 0px auto;
		vertical-align: top;
	
		display: block;
		overflow: hidden;
		position: relative;
		line-height:0px;
	}

		.internMask span a {
			text-decoration:none;
		}
	
		.internMask span .picIntern {
			width:100%;
			float: none; padding: 0; margin: 0;
		}

	.internMask .videoRelative {
		position: relative; padding-top: 56.22%; /* '820:461 */
	}

	.internMask .videoBack, iframe.videoAbsolute, video
	{
		background: url(../pic/white-loading.png) #000 no-repeat center center;
	}


	.picDetailContainer.videoRelative {
		position: relative; padding-top: 26.78%; /* 1275:341 */
	}

	.videoAbsolute {
		position: absolute; top: 0px; left: 0px; z-index: 0;
	}

	.videoBeschreibungAbsolute {
		position: absolute; width:100%;
	}


	/*****************/
	/* ZoomInEffekt  */
	/*****************/
	.picDetailContainer .mask a:hover img,
	.internMask a:hover img 	
	{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
		-o-transform: scale(1.1);
		-ms-transform: scale(1.1);
		transform: scale(1.1);
	}
	
	.picDetailContainer .mask a img,
	.internMask a img.picIntern 		
	{
		-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;
	}



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


/******************************************************************/
/* 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; */
	font-family:"Open Sans",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*/
	font-size:1.8em;
}

	/*busabfahrtsplan start*/
	form#abfahrtsplan {
		padding: 5px 5px 0 5px;
		border: 1px solid #BDDAD6;
		background-color: #EFEFEF;
		}
		form#abfahrtsplan #vonplan,
		form#abfahrtsplan #bisplan {
			overflow: auto;
		}
		form#abfahrtsplan #vonplan label,
		form#abfahrtsplan #bisplan label {
			float: left; display: block; 
			width: 40px;
		}
		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[type="submit"], form .button {
			height:65px;
		}
	
		form input[type="submit"]:hover, form .button:hover,
		#fussNavigation form input[type="submit"]:hover, #fussNavigation form .button:hover 		
		{
			color:#000;
		}

	p.anmeldeButton {
		margin-bottom:20px;height:45px;
	}

	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: #e2e2e2; 
	}

	form option.hi {
		background: #FFBA00;	
	}

	label {
		display: block;
		margin: 0; 
		padding: 0;
		font-size:1.8em; line-height:1.3333em;
	}

	#fussNavigationSpalten label {
		font-size:1.5em; color:#ced1e1;
	}

	.readonlyInput label { /*'formReadonly - label ausblenden*/ 
		/*display: none;*/
	}
	
	.readonlyInput input { /*'formReadonly*/ 
		background: #ddd !important;
		color: #777;
	}
		
	.readonlyInputFull { /*'formReadonly*/
		display: none !important; /*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;*/
		font-weight: bold; 
		text-align: center;
		cursor: pointer;
		color:#FFF; 

		background:#08186b;
		transition: 0.5s;

	}

		#fussNavigation .button, 
		#fussNavigation .anmeldeform .button, 
		#fussNavigation a.button {
			background:#87d01a; color:#fff;
			border-radius: 5px;
		}

		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,
		#fussNavigation input.button:hover, #fussNavigation input.button:active, 
		#fussNavigation a.button:hover, #fussNavigation a.button:active
		{
			color: #000; 
			text-decoration: none;
			background:#9fdc3f;
		}
	
	.button.anmeldung {
		margin:0 auto 0 auto;
		float:none;
	}
	
		
	.anmeldeform .button, a.button {
		display:block;
		width:395px;
		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: 100%; 
	margin: 10px 0 10px 0;
	padding: 10px 15px 10px 15px;
	clear: left;
	color: #838383; 

	font-size:1.2em;
	border:1px dashed #838383;
	text-align:left;
}

.hinweisBox h2 {
	margin-top: 0;
} 

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

#indexfilter {
	width:50%; 
	height:40px; margin-bottom:75px;
}

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

	#indexfilter label {

	}

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

	.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: 2px;
	padding: 2px;
	border: 2px groove #000;
	color : #000000;
	background-color: #FFFF99;
	}
	
	div#previewHinweisText h1 {
		margin: 0 0 2px 0;
		padding: 0;
	}

	div#previewHinweisText form input.urlTextBox {
		width: 90%;
		height: 12px;
		padding: 0;
	}

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

	div#previewHinweisText table.preview_box {
		width: 100%;
	}

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

	div#previewHinweisText table.preview_box td.ueberschrift {
		font-variant: small-caps;
		font-weight: bold;
	}

	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: 35%; /* Höhe Map*/
		overflow: hidden;
		margin:5px 0 50px 0;
	}	 

	.responsiveMapsContainerFuss {
		width:100%; padding-bottom:75%;
		position: relative;
	}

	.responsiveMapsContainer iframe,
	.responsiveMapsContainerFuss 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
**************/
#socialnetContainer {
	position:fixed; /* damit Button von CC auch nach unten verschoben wird */
	width:100%;
	z-index:3000;
}

#socialnet a {
	position: fixed; top: 235px; right: -125px; 

	width:275px; height:90px;
	padding-top:25px;
	background:#ce268f;
	border: 1px solid #FFF;

	z-index: 500;	
	font-size:18px; font-weight:bold;

	-webkit-box-shadow: 0px 0px 13px 1px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 0px 13px 1px rgba(0,0,0,0.75);
	box-shadow: 0px 0px 13px 1px rgba(0,0,0,0.75);

	-moz-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);

	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	
}

	#socialnet a:link, #socialnet a:visited {
		color:#FFF; text-decoration:none;
	}

	#socialnet a:hover, #socialnet a:active {
		background:#FFF; color:#c5007b;
		right: -110px; 
		-webkit-transition: all 0.5s ease-in-out;
		-moz-transition: all 0.5s ease-in-out;
		-o-transition: all 0.5s ease-in-out;
		transition: all 0.5s ease-in-out;
	}


	#socialnetContainer #socialnetTelefon {
		display:none;
	}

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

	a.dokicon::before {
		clear:both; display:block; float:left;
		content:  url(../pic/icons/download.png);
		margin-right:5px; margin-top:1px;
	}

		a.dokicon:hover::before{
			content:  url(../pic/icons/download-hi.png);
		}

	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"]::before {
		content:  url(../pic/icons/download.png);
	}
	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.png) !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 {
}

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


/********************************************/
/* contrast 							*/
/********************************************/
.contrast {
	background:#000; color:#FFF;
}
.contrast #seite {
	background:#000; border-color:#000;
	color:#FFF;
}

.contrast a:link, .contrast a:visited {
    color: #4AAEFF;
}
.contrast a:hover, .contrast a:active {
    color: #FA0000;
}

.contrast a:link .loopText p, .contrast a:visited .loopText p,
.contrast a:link .loopText h2, .contrast a:visited .loopText h2
{
    color: #FFF;
}
.contrast a:hover .loopText p, .contrast a:active .loopText p,
.contrast a:hover .loopText h2, .contrast a:active .loopText h2
{
    color: #FA0000;
}

.contrast .loopListe li div.loopText p.datum {
	color:#FA0000;
}

.contrast h1 {
	color:#FA0000;
}
.contrast h2,
.contrast h2.lead,
.contrast p.lead,
.contrast h3
 {
	color:#FFF;
}

/* contrast kopf */

.contrast #kopf {
	background:#000;
}

.contrast #TheSlider .slideFrame::after {
    border-color: #000 transparent transparent transparent !important;
}

.contrast .megamenu_container.megamenu_interact_theme {
	background:#000 !important;
}

.contrast #kopf #navMain .megamenu_interact_theme .megamenu > li > a {
	color:#FFF;
}


/* contrast content */

.contrast #sieSindHier a:hover, .contrast #sieSindHier a:active {
    color: #FFF;
    text-decoration: underline;
}

.contrast .loopStartBoxes ul a:link h2 {
	color:#FFF;
	background:#000;
}

.contrast .loopListe li.mehr a {
	background:#000;
	border:2px solid #FFF;
}

.contrast .loopListe li.mehr a:link,.contrast .loopListe li.mehr a:visited {
	color:#FFF;
}
.contrast .loopListe li.mehr a:hover,.contrast .loopListe li.mehr a:active {
	color:#FA0000;
}



/* contrast fuss */
.contrast #fussZeile #fussPartner	{
	background:#252424;
}

.contrast #fussZeile #fussTeaser {
	background:#000;
}

.contrast #fussTeaser h2 a:link,
.contrast #fussTeaser h2 a:visited {
	color:#FFF;
}
.contrast #fussTeaser h2 a:hover,
.contrast #fussTeaser h2 a:active {
	color:#808080;
}
.contrast #fussZeile #fussTeaser #fussTeaserSpenden div {
	background:#252424;
	color:#FFF;
}


.contrast #fussZeile #fussSitemap {
	background:#252424;
}

.contrast #fussZeile #fussSitemapSpalten a:link,
.contrast #fussZeile #fussSitemapSpalten a:visited {
	color:#c6c7c8;	
}
.contrast #fussZeile #fussSitemapSpalten a:hover,
.contrast #fussZeile #fussSitemapSpalten a:active {
	color:#FFF;	
}

.contrast #fussZeile #fussSitemapSpalten .main a:link,
.contrast #fussZeile #fussSitemapSpalten .main a:visited {
	color:#FFF;
}

.contrast #sieSindHierBottom a:hover, .contrast #sieSindHierBottom a:active, .contrast #sieSindHierBottomV2 a:hover, .contrast #sieSindHierBottomV2 a:active {
    color: #FFF;
    text-decoration: none;
}


/* contrast teaser */
.contrast .teaserBox {
	background-color:#252424;
}
.contrast .teaserBox ul li a:link {
	color:#fa0000;
}
.contrast .teaserBox h5 a:link {
	color:#FFF;
}


/*
'####################################################### 
' Element-Queries		   	 
'#######################################################
*/
/* CSS wenn width < 750 */
@element .loopListe and (max-width: 750px) and (min-width: 460px) {
  $this div.loopText p {
    font-size:1.5em;
  }
  $this li div.loopText h2 {
	margin-top:11px; margin-bottom:0px;
    font-size:1.5em;
  }

}

@element #colInhalt > .halbeBreite > .loopListe.kundenstimmen li a and (max-width: 750px) and (min-width: 445px) {
  $this div.loopText p {
    font-size:1.5em !important;
  }
}


/* ---- particles.js container ---- */

#particles-js {
  position: absolute;
  width: 100%;
  height: 100%;
}