﻿@charset "utf-8";

.nptbccm-w{top:0;bottom:0;background-color:rgba(0,0,0,.4);align-items:center}.nptbccm-wc{max-width:460px}.nptbccm-wb{border-radius:8px}.nptbccm-wrf{flex-direction:column-reverse}.nptbccm-wrf-r{display:flex;flex-direction:column-reverse;width:100%;align-items:center}.nptbccm-wrf-l{margin-bottom:1em}.nptbccm-w-btn-ok{font-size:1.6em;width:100%;text-align:center}.nptbccm-w-btn-settings{margin:1em 0}.nptbccm-w-btn-settings{font-size:14px;padding:.4em .6em .4em .6em;margin-right:0}.nptbccm a,.nptbccm-whr-l{color:#666}.nptbccm-wrf-l>*{margin-right:8px;margin-left:8px}@media screen and (max-width:480px){.nptbccm-wrb p{font-size:12px}.nptbccm-whr-l{font-size:14px}.nptbccm-ibtn a{font-size:12px}}

/*=== Für CMS Debugausgaben ===*/
.cms4d_odebug{
	color:rgb(0,0,0);
	background-color:white;
	font-family:Verdana;
	font-size:11px;
	text-align:left;
	padding:10px;
	float:left;
	clear:both;
	width:100%;
}
.cms4d_odebug h1{
	color:rgb(0,0,0);
	font-size:16px;
	text-indent:0px;
	background-image:none;
}
.cms4d_odebug pre{
	color:rgb(0,0,0);
	font-family:Verdana;
}

/*=== Für Videos ===*/
.embed-container{
	position:relative;
	padding-bottom:56.25%;
	height:0;
	overflow:hidden;
	max-width:100%;
	height:auto;
	margin-bottom:10px;
}
.embed-container iframe, .embed-container object, .embed-container embed{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
.embed-size-container
{
	max-width: 600px;
	margin-bottom: 1.8em;
}


/*========== 30.07.2014, dogan ===============*/
html{
	-webkit-text-size-adjust:100%;
	-ms-text-size-adjust:none;
	-moz-text-size-adjust:none;

	width:100%;
	min-width:100%;
	float:left;
	clear:both;

	height:100%;
	min-height:100%;
}
body{
	color:rgb(51,51,51);
	background-color:white;
	font-family:roboto2014_regular, Arial, 'Arial Unicode MS', Helvetica, sans-serif;
	font-size:18px;

	margin:0;
	padding:0;

	width:100%;
	min-width:100%;
	float:left;
	clear:both;

	height:100%;
	min-height:100%;

	background:rgb(0,77,158) url(images-nh/body-bg.png) repeat-x center top;
}
	body:after{
		content:'marker0';
		display:none;
	}


@media print{
	body{
		color:black;
		background-color:white;
		text-align:left;
		margin:0;
		padding:0;
	}
}
/*IE Tabellenfehler*/
table{
	font-size:1em;
}





/*========= Layout Seite ==========*/
@media screen, projection{

	.row{
		width:100%;
		float:left;
		clear:both;
		position:relative;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
		.row_center{
			max-width:1160px;
			margin:0 auto;
			position:relative;
		}
			.hpad_1{
				padding-left:40px;
				padding-right:40px;
			}
			.vpad_1{
				padding-top:40px;
				padding-bottom:40px;
			}
				.floater, .floater_stack, .floater_stack > div{
					width:100%;
					float:left;
					clear:both;
					position:relative;
					-webkit-box-sizing:border-box;
					-moz-box-sizing:border-box;
					box-sizing:border-box;
				}
					.floater_stack{
						clear:none;
						margin-right:-100%;
					}


	/*========= Aufbau ==========*/
	/*In diesem Projekt hat der body eine Hintergrundfarbe - alle Inhalte sollen aber auf Weiß stehen. Das Grid ist zwar 1160/40, aber bei einem Viewport
	von 1280px geht das Layout über die volle Breite. D.h. auch die weiße Hintergrundfarbe für top und content muss bis zum Rand gehen.
	Um mit den Aufbau nicht zu weit von Standard abzuweichen, liegen die Inhaltsreihen wie gehabt in ihren eigenen row-Containern mit eigener Zentrierung.
	Insgesamt wird dieses Konstrukt aber in einem page_container/inner_page_container verschachtelt, so das alle in einer weißen Fläche liegen, die zentriert und max. 1280px breit ist.*/
	.page_container{
		/*Zentrierung*/
		max-width:1280px;
		margin:0 auto;
		position:relative;
		/*Für IE8 Breite festnageln. Wird später für alle Browser mit mediaqueries aufgelöst. s.u. Viewports*/
		min-width:1160px;
	}
		.inner_page_container{
			/*Hintergrundfarbe für alle Inhalte*/
			background-color:white;
			width:100%;
			float:left;
			clear:both;
			position:relative;
		}


	/*===== Kopfzeile ======*/
	.top_row{
		padding-top:10px;
		padding-bottom:25px;
		z-index:6000;
	}
		.top_row img{
			display:block;
			max-width:100%;
			width:auto;
			height:auto;
			border:none;
			outline:none;
		}
		.top_row a{
			outline:none;
		}

		/*Dieser Container steht im HTML-Code vor dem Logo-Container. Zunächst ist nur der Claim sichtbar. Später wird für sehr kleine Viewports der DIV über die volle Breite gezogen
		und das enhaltene Funktionsmenü eingeblendet (Suche, Sprachumschaltung). s.u. Navigation...*/
		.top_fbar{
			max-width:100%;
			float:right;
			padding-top:13px;
			color:rgb(173,173,173);
			font-family:roboto2014_condensed_bold, Arial, Helvetica, sans-serif;
			font-size:36px;
			line-height:1em;
			z-index:10;
		}
			.top_claim{
				float:left;
			}
			/*weiteres zu .fb_buttons s.u. Navigation...*/
		.top_logo{
			max-width:100%;
			float:left;
			padding-top:9px;
			margin-left:-20px;
			z-index:20;
		}
		/*Aufbau hmenu Reihe s.u. hmenu*/


	/*======== Kopfbild / Slider =======*/
	.top_img_row{
		z-index:5000;
	}
		.top_img_row_center{
			max-width:1280px;
			margin:0 auto;
			position:relative;
		}
			.top_img_container{
				width:100%;
				height:100%;
				float:left;
				position:relative;
			}


	/*======= Inhalt =========*/
	.content_row{
		margin-top:35px;
		z-index:3000;
	}
		/* 1) Standardlayout: center_col über volle Breite, left_col ausgeblendet.*/
		.center_col{
			width:100%;
			float:left;
			position:relative;
			z-index:10;
		}
			.html_content{
				width:100%;
				float:left;
				clear:both;
				position:relative;
			}
		.left_col{
			width:25%;
			float:left;
			margin-right:-100%;
			position:relative;
			padding-bottom:40px;
			display:none;
			z-index:20;
		}
		/* 2) Standardlayout mit Submenu: left_col feste Breite, center_col floatet im verbleibenden rechten Raum.*/
		body.smenu_lvl_1 .left_col{
			display:block;
		}
		body.smenu_lvl_1 .center_col{
			/*.left_col räumt mit margin-right:-100% den Raum rechts komplett frei, so dass .center_col nach oben rutschen kann.
			Damit die Textinhalte .left_col aber nicht überdecken, erhält .center_col ein padding-left in der gleichen Breite wie .left_col+spaltenabstand*/
			padding-left:28.2%;
		}
			body.smenu_lvl_1 .html_content{
			}



	/*===== CTA ======*/
	.cta_row{
		padding-bottom:40px;
	}
		.cta_box{
			text-decoration:none;
			display:block;
			width:100%;
			float:left;
			clear:both;
			border:1px solid rgb(0,77,158);
			font-family:roboto2014_bold, Arial, Helvetica, sans-serif;
			font-size:24px;
			letter-spacing:1px;
			line-height:1.3em;
			color:white;
			text-shadow:2px 2px 4px rgba(0,0,0,0.2);
	
			padding:0.6em 4em 1em 1em;
			/*BEACHTE: IE9 kann einen Gradient nicht mit runden Ecken abscheiden. Alle ab IE10*/
			border-radius:10px;
	
			background:#3d82cc;
			background:-moz-linear-gradient(top, #3d82cc 0%, #004d9e 100%); /* FF3.6+ */
			background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#3d82cc), color-stop(100%,#004d9e)); /* Chrome,Safari4+ */
			background:-webkit-linear-gradient(top, #3d82cc 0%,#004d9e 100%); /* Chrome10+,Safari5.1+ */
			background:-o-linear-gradient(top, #3d82cc 0%,#004d9e 100%); /* Opera 11.10+ */
			background:-ms-linear-gradient(top, #3d82cc 0%,#004d9e 100%); /* IE10+ */
			background:linear-gradient(to bottom, #3d82cc 0%,#004d9e 100%); /* W3C */
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3d82cc', endColorstr='#004d9e',GradientType=0 ); /* IE6-9 */
		}
			.cta_box:before{
				/*icon-arrow-circle-right*/
				content:'\f0a9';
				font-family:fontawesome;
				font-size:2.916666em;
				line-height:1em;
				width:1em;
				height:1em;
				display:inline-block;
				position:absolute;
				right:0.1em;
				top:0.2em;
			}


	/*====== Footer =======*/
	.footer_row{
		background-color:rgb(229,237,245);
		font-family:roboto2014_condensed_regular, Arial, Helvetica, sans-serif;
		color:rgb(51,51,51);
	}
		.footer_row a, .footer_row a:hover{
			text-decoration:none;
			color:inherit;
		}
		.footer_row h1,
		.footer_row h2,
		.footer_row h3{
			color:rgb(0,77,158);
			font-family:roboto2014_condensed_bold, Arial, Helvetica, sans-serif;
			font-size:inherit;
			margin:0;
			padding:0;
		}
		/*Icons*/
		.fa:before{
			content:'';
			font-family:fontawesome;
			display:inline-block;
			margin-right:0.25em;
		}
			.fa.fa_user:before{
				/*icon-user*/
				content:'\f007';
			}
			.fa.fa_mail:before{
				/*icon-envelope*/
				content:'\f0e0';
			}
			.fa.fa_info:before{
				/*icon-info-circle*/
				content:'\f05a';
			}
			.fa.fa_mapmarker:before{
				/*icon-map-marker*/
				content:'\f041';
			}

		/*--- Kontaktmenu ---*/
		.fo_contact{
			font-size:24px;
			text-align:center;
			padding:23px 0 10px 0;
		}
			.fo_contact_links{
				margin-top:13px;
			}
				.fo_contact h2{
					text-transform:uppercase;
				}
				.fo_contact a{
					display:inline-block;
					margin:0 0.6em 0.5em 0.6em;
				}
					.fo_contact a:before{
						color:rgb(0,77,158);
					}

		/*--- Quicklinks ---*/
		/*weitere Formate s.u. .qmenu*/
		.fo_qmenu{
			border-top:1px solid white;
			/*WICHTIG: horizontalen overflow abschneiden, der durch Spaltencontainer erzeugt wird s.u.*/
			overflow:hidden;
			padding:5px 0 23px 0;
		}

		/*--- Adresse ---*/
		.fo_address{
			border-top:1px solid white;
			font-size:16px;
			text-align:center;
			padding:20px 0 40px 0;
		}
			.address span{
				display:inline-block;
			}
			.folinks{
				padding-top:15px;
			}
			.folinks a{
				display:inline-block;
				padding:0 10px;
			}
				.folinks a:before{
					/*icon-chevron-right*/
					content:'\f054';
					font-family:fontawesome;
					display:inline-block;
					margin-right:0.25em;
				}
}






/*======================= PRINT ===========================*/
@media print{
	html, body{
		background-color:white;
		background-image:none;
		/*Grundschrift normalisieren*/
		font-size:16px;
	}


	.head_container{
		display:none;
	}
	.top_container{
		display:none;
	}
	.topmenu_row{
		display:none;
	}
	.top_row, .top_img_row, .top_img_pcontainer, .top_img_container{
		display:none;
	}
		.top_img_row{
			width:100%;
			float:left;
			clear:both;
			padding-bottom:20px;
		}
		/*Slider Controls im Kopfbild ausblenden*/
		.top_img_row .cms4d_slider3_cbtn, .top_img_row .cms4d_slider3_ibtn_container, .slider0_ibtn_row{
			display:none;
		}
	.katmenu_row, .katmenu_outer_container, .katmenu_container{
		display:none;
	}
	.fmenu0_row{
		display:none;
	}
	.treemenu_container, .bcmenu_container, .katmenu_container, .submenu_container{
		display:none;
	}
	.left_col{
		display:none;
	}
	.right_col{
		display:none;
	}
	.content_container{
		background-image:none;
		padding:0;
		margin:0;
	}
	.bcmenu_top, .bcmenu_bottom{display:none;}

	.footer_address{
		width:100%;
		float:left;
		clear:both;
		border-top:1px solid black;
		padding-top:20px;
		font-size:12px;
	}
		.footer_address > span{
			display:inline-block;
		}
	.footer_controls_container, .footer_controls, .footer_logos{
		display:none;
	}

	/*Allgemeine Klasse, um gewünschte Elemente durch direkte Notation im HTML-Quelltext von der Druckausgabe auszunehmen*/
	*.noprint{
		display:none !important;
	}

}






/*==================== BLOCKFORMATE ====================*/
@media screen, projection{
	pre{
		font-size:1em;
		clear:both;
	}

	h1, h2, h3, h4, h5, h6{
		font-size:inherit;
		font-family:roboto2014_medium, Arial, Helvetica, sans-serif;
		font-weight:normal;
		margin:0 0 0.6em 0;
		padding:0;
		color:rgb(82,141,204);
		/*Headlines im normalen Text immer clearen*/
		clear:both;
	}
	h1{
		font-size:32px;
		line-height:1.2em;
		margin-bottom:0.6em;
		color:rgb(0,77,158);
	}
	h2{
		font-size:26px;
		line-height:1.2em;
	}
	h3{
		font-family:roboto2014_regular, Arial, Helvetica, sans-serif;
		font-size:20px;
		line-height:1.2em;
	}
	h4{
		font-size:1em;
		line-height:1.2em;
	}
	h5, h6{
		font-size:1em;
		line-height:1.2em;
	}
	p{
		line-height:1.3333em;
		line-height:1.444444em;
		margin:0;
		padding:0;
		margin-bottom:1.6em;
	}
		p + p{
			margin-top:-0.5em;
		}

	a{
		color:rgb(0,77,158);
		text-decoration:none;
	}
		.html_content a:hover{
			text-decoration:underline;
		}
		a:active, a:visited{
			text-decoration:none;
		}

	/*--- Listendefinition neu, alle ab IE9+ ---*/
	.html_content ul, .html_content li{
		list-style:none;
		margin:0;
		padding:0;
		position:relative;
	}
		/*Einrückungen*/
		.html_content ul{
			/*Level-0 mit Abstand vertikal zum vorherigen und folgenden Inhalt*/
			margin:1.5em 0 1.5em 0;
		}
			.html_content ul ul{
				/*Level-n ohne Abstand vertikal*/
				margin-top:0;
				margin-bottom:0;
			}
			.html_content li{
				/*Abstand der Items vertikal*/
				margin-top:0.75em;
				/*Einzug für Bullet durch padding. D.h. das Bullet/Icon liegt jetzt innerhalb des LI-Elementes. Wenn zum Umfließen eines linkstehenden Elementes (fbox_2)
				die Liste umgeschaltet wird (LI display:table), überlagern die Bullets das linksstehende Element nicht mehr.*/
				padding-left:1.5em;
			}
		/*Bullets*/
		.html_content ul li:before{
			/*icon-circle*/
			content:'\f111';
			/*icon-square*/
			/*content:'\f0c8';*/
			font-family:'fontawesome';
			position:relative;
			font-size:1em;
			width:1em;
			left:-1.4em;
			margin-right:-1em;
			color:rgb(0,77,158);
		}
			/*Bullets ab Level 1*/
			.html_content li li:before{
			}
		/*Beginnende Blockelemente in LI müssen inline-block sein, da das Element sonst erst unterhalb der Grundlinie
		des Bullets beginnt. Das Bullet ist inline-block und soll ja in einer Zeile mit dem Inhaltstext stehen.
		ACHTUNG: dies gilt immer nur für das erste Element, da sonst die folgenden rechts hoch rutschen würden !*/
		li h1:first-child, li h2:first-child, li h3:first-child, li h4:first-child, li h5:first-child, li h6:first-child,
		li p:first-child, li pre:first-child,
		li div:first-child
		{
			display:inline-block;
			clear:both;
		}


	/*Hochgestellt kleiner. In Headlines kleiner als im Fließtext.*/
	sup{
		font-size:0.8em;
		line-height:1em;
		font-weight:normal;
	}
		h1 sup,
		h2 sup,
		h3 sup{
			font-size:0.5em;
			line-height:1em;
		}


	/*normale HR, alle ab IE7*/
	hr{
		height:1px;
		overflow:hidden;
		border:none;
		border-top:1px solid rgb(203,221,240);
		padding:0;
		margin:0 0 15px 0;
		clear:both;
		float:none;
	}
		/*hr gestrichelt*/
		hr.dashed{
			border-top:1px dashed rgb(204,204,204);
		}
		/*hr mit 3d Schattenkante. De Container ändert sich zwar in der Breite, die Höhe bleibt aber gleich. Dadurch wird das Hintergrundbild nur horizontal gestaucht.*/
		hr.shadow{
			height:13px;
			border:none;
			background:url(images/hr-shadow-bg.png) no-repeat center top;
			background-size:100% 100%;
		}

	/*fette Darstellung bei strong und b deaktivieren, da sonst der verwendete fette Schriftschnitt nochmals mit einer Outline gezeichnet wird.*/
	strong, b{
		font-family:roboto2014_bold, Arial, 'Arial Unicode MS', Helvetica, sans-serif;
		font-weight:normal;
	}
		a strong, a b{
			color:inherit;
		}

}
@media print{
	h1{
		color:black;
		font-size:1.2em;
		margin:0 0 1em 0;
		padding:0;
		background-image:none;
	}
	h2{
		color:black;
		font-size:1.1em;
		margin:0 0 0.5em 0;
		padding:0;
		background-image:none;
	}
	h3, h4{
		color:black;
		font-size:1em;
		margin:0 0 0.5em 0;
		padding:0;
		background-image:none;
	}
	p{
		margin:0 0 1em 0;
		padding:0;
	}
}




/*==================== CMS4D GRID projektspezifisch ====================*/
/*abweichender Spaltenabstand in diesem Projekt, für grid 1160/40*/
div[class*=c4g_grid_]{margin-left:-40px;padding-bottom:40px;}
	div[class*=c4g_grid_] > div{border-width:40px;}
/*Durch die Zusatzklasse wird das padding unten herausgenommen*/
div[class*=c4g_grid_].no_padding_bottom{padding-bottom:0;}
/*Floatende Bilder im Inhaltstext mit den Standardklassen bild_links, bild_rechts.
Diese sollen nicht breiter als 50% sein, um ausreichend Raum für den text zu lassen.*/
.html_content img.bild_links, .html_content img.bild_rechts{
	max-width:50%;
}
	.html_content img.bild_links{
		margin:0 40px 10px 0;
	}
	.html_content img.bild_rechts{
		margin:0 0 10px 40px;
	}




/*========= div. Blockformate =======*/
.col_header{
	width:100%;
	float:left;
	clear:both;
	position:relative;
	margin-bottom:25px;

	font-family:roboto2014_condensed_bold, Arial, Helvetica, sans-serif;
	font-size:32px;
	line-height:1em;
	color:rgb(0,77,158);
}
.col_header *{
	font-family:inherit;
	font-size:inherit;
	line-height:inherit;
	color:inherit;
	margin:0;
	padding:0;
}
	.col_header a, .col_header a:hover{
		text-decoration:none;
	}
	/*Pfeil Icon wenn Hyperlink*/
	.col_header a:after{
		/*icon-chevron-right*/
		content:'\f054';
		font-family:fontawesome;
		color:rgb(204,204,204);
		display:inline-block;
		margin-left:0.25em;
	}

/*Link Button MEHR allgemein*/
.link_btn{
	display:inline-block;
	color:white;
	background-color:rgb(0,77,158);
	padding:3px 8px 4px 10px;
	border-radius:5px;
	font-size:16px;
}
	.link_btn:after{
		/*icon-caret-right*/
		content:'\f0da';
		font-family:fontawesome;
		display:inline-block;
		margin-left:0.45em;
	}





/*================ Produkte ================*/
/*--- allgemein ---*/
.product, .product *{
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
	.product img{
		max-width:100%;
		width:auto;
		height:auto;
	}
/*------ Produktgruppen Auflistung ---------
Standardlayout Desktop: zunächst 2-spaltig. Gruppenbild links, fixe Breite. Untergruppen-Liste (Zanhformen) rechts, restliche Breite.
Um die Datenpflege zu vereinfachen, liegen die Inhalte im Body in Standardelementen, die gemäß ihrer Reihenfolge bestimmte Formatierungsaufgaben automatisieren.
Folgt z.B. auf eine H3 ein P mit IMG-Elementen, so werden diese als Zahnform-Grafiken gewertet und der Abstand zwischen den Bildern erhöht.
*/
.pr_group{
	position:relative;
	padding-bottom:1em;
}
	/*clearfix*/
	.pr_group:before, .pr_group:after{
		content:'';
		display:table;
		width:100%;
		clear:both;
	}
	.pr_group h2{
		/*typisch h2, volle Breite*/
		width:100%;
		clear:both;
		border-top:1px solid rgb(203,221,240);
		border-bottom:1px solid rgb(203,221,240);
		margin:0 0 1em 0;
		padding:0.5em 0 0.6em 0;
	}
	.pr_group_img{
		float:left;
		margin-right:-100%;
		position:relative;
		z-index:30;
	}
		.pr_group_img img{
			display:block;
			margin:0 auto;
		}
	.pr_group_body{
		float:left;
		padding-left:300px;
		position:relative;
		z-index:20;
	}
		/*HR-Trenner*/
		.pr_group_body hr{
			border-top:1px dashed rgb(203,221,240);
			margin-bottom:1.2em;
		}

		/*Zahnformen*/
		.pr_group_body h3+p img{
			margin-right:1em;
			/*folgende Absätze näher heran ziehen*/
			margin-bottom:-0.5em;
		}

/*----- Produkte breakpoints -----*/
@media screen and (max-width:1200px){
	/*Wenn Submenu mit left_col, dann ab hier Bildspalte auch relative Breite*/
	body.smenu_lvl_1 .pr_group_img{
		width:31.8%;
	}
	body.smenu_lvl_1 .pr_group_body{
		padding-left:36.6%;
	}
}
@media screen and (max-width:939px){
	/*Ab hier beginnt die mobile Ansicht und left_col wird ausgeblendet. Nun für alle Vorkommen relative Breiten.*/
	body.smenu_lvl_1 .pr_group_img,
	.pr_group_img{
		width:29%;
	}
	body.smenu_lvl_1 .pr_group_body,
	.pr_group_body{
		padding-left:33.333333%;
	}
}
@media screen and (max-width:470px){
	/*Final Smartphone. Bild und Body jeweils einspaltig umbrechen*/
	.pr_group h2{
		/*Headline als Trenner optisch stärker hervorheben*/
		font-size:1.2em;
		background-color:rgb(245,250,255);
	}
	.pr_group_img{
		width:100% !important;
		clear:both;
		margin-bottom:1em;
	}
		/*Bild zentriert*/
		.pr_group_img img{
			max-width:50%;
			margin:0 auto;
		}
	.pr_group_body{
		width:100% !important;
		clear:both;
		margin:0;
		padding:0 !important;
	}
}





/*======================== Slider ==========================*/
/*----- slider0 -------*/
.slider0 .cms4d_slider3_cbtn{
	display:none;
}
	.slider0:hover .cms4d_slider3_cbtn{
		display:block;
	}
.slider0 .cms4d_slider3_ibtn_container{
	width:auto;
	left:auto;
	right:0;
	padding-right:6px;
}
	.slider0 .cms4d_slider3_ibtn{
		margin:auto 4px;
	}
	.slider0 .cms4d_slider3_ibtn.on{
		border-color:rgb(102,102,102);
	}


/*------- slider1 Start News, slider2 Start Messen ------*/
/*Die beiden Slider sind identisch aufgebaut/formatiert und liegen in einem zweispaltigen Grid, zunächst 66/33.
Zur allgemeineren Formatierung haben beide die Zusatzklasse nslider.*/
.row_start_aktuelles{
	border-bottom:1px solid rgb(204,204,204);
	padding-bottom:20px;
	margin-bottom:20px;
}
.row_start_aktuelles .trenner_v{
	border-left:1px solid rgb(204,204,204);
	height:100%;
	position:absolute;
	left:65.4%;
	margin-left:40px;
}
	div.grid_start_aktuelles{
		padding-bottom:0;
	}
		.start_col_news{
		}
		.start_col_messen{
			padding-left:40px;
		}

/*Slider*/
.nslider{
	font-size:16px;
}
	/*Blockformate*/
	.nslider h1,
	.nslider h2,
	.nslider h3,
	.nslider h4,
	.nslider h5,
	.nslider h6{
		font-family:roboto2014_medium, Arial, Helvetica, sans-serif;
		font-size:1.125em;
		color:rgb(0,77,158);
	}
	.nslider p{
		line-height:1.3333em;
	}
	/*Link MEHR*/
	.nslider .box_link span{
		display:inline-block;
		color:white;
		background-color:rgb(0,77,158);
		padding:3px 8px 4px 10px;
		border-radius:5px;
	}
		.nslider .box_link span:after{
			/*icon-caret-right*/
			content:'\f0da';
			font-family:fontawesome;
			display:inline-block;
			margin-left:0.45em;
		}

/*Indexbuttons*/
.start_aktuelles_ibtn_container{
	width:100%;
	float:left;
	clear:both;
}
	.start_aktuelles_ibtn_container .cms4d_slider3_ibtn_container{
		position:relative;
		top:auto;
		bottom:auto;
		margin-top:20px;
	}
	.start_aktuelles_ibtn_container .cms4d_slider3_ibtn{
		width:15px;
		height:15px;
		border:1px solid rgb(204,204,204);
		background-color:white;
	}
	.start_aktuelles_ibtn_container .cms4d_slider3_ibtn.on{
		background-color:rgb(204,204,204);
	}
/*--- Slider Aktuelles breakpoints ---*/
@media screen and (max-width:939px){
	.row_start_aktuelles .trenner_v{
		left:63.4%;
	}
	.start_col_messen{
		padding-left:20px;
	}
}
@media screen and (max-width:760px){
	/*grid umschalten zu einspaltig*/
	.row_start_aktuelles .trenner_v{
		display:none;
	}
	div.grid_start_aktuelles > div:nth-child(1n){
		width:100%;
		clear:both;
	}
	div.grid_start_aktuelles .start_col_messen{
		padding-left:0;
		/*Abstand nach oben durch Einblenden der Spalten border*/
		border-top-style:solid;
	}
		/*optischer Trenner zum News Slider durch :before Element*/
		.start_col_messen:before{
			content:'';
			display:block;
			width:100%;
			border-top:1px solid rgb(204,204,204);
			margin-bottom:20px;
		}
}






/*================ Grid Leistungsspektrum Start =================*/
/*Von vorne herein geringerer Spaltenabstand*/
div.grid_leistungen{margin-left:-30px;padding-bottom:30px;}
div.grid_leistungen > div{border-width:30px;}
.lbox{
	font-family:roboto2014_condensed_regular, Arial, Helvetica, sans-serif;
	font-size:19px;
	line-height:1em;
}
.lbox_head, .lbox_img{
	width:100%;
	float:left;
	clear:both;
}
.lbox_head{
	color:white;
	background-color:rgb(0,77,158);
	padding:15px 10px 16px 14px;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
}
	.lbox_head:after{
		/*icon-arrow-circle-right*/
		content:'\f0a9';
		font-family:fontawesome;
		font-size:28px;
		float:right;
		/*momentan nicht verwendet*/
		display:none;
	}
/*Die Bilder werden ausnahmsweise mit width:100% immer in die volle Spaltenbreite gezwungen. Dies stellt sicher, dass die Box immer voll ausgefüllt ist.
Hierdurch werden die Bilder je nach Layoutbreite allerdings über ihre Originalgröße skaliert, weshalb sie im Original schon größer angelegt sein müssen,
um die Darstellungsqualität im Rahmen zu halten.
Mindestbreite im Original ist 300px = Endgröße bei Layoutbreite 320px für Smartphones hoch.*/
.lbox_img img{
	display:block;
	border:none;
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
	width:100%;
	/*WICHTIG: height auf auto, da sonst unproportionale Verzerrung*/
	height:auto;
}
	/*Taste mit Bullet-Pfeil r/u über Bild*/
	.lbox_img:after{
		/*icon-arrow-circle-right*/
		content:'\f0a9';
		font-family:fontawesome;
		font-size:28px;
		line-height:1em;
		display:inline-block;
		overflow:hidden;
		color:white;
		position:absolute;
		right:0;
		bottom:0;

		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
		width:2em;
		height:2em;
		overflow:hidden;
		padding:0.5em 0 0 0.6em;
		background-color:rgb(0,77,158);
		border-bottom-right-radius:10px;
		border-top-left-radius:1em;
		border-top:1px solid rgb(0,77,158);
		border-left:1px solid rgb(0,77,158);
		text-shadow:2px 2px 4px rgba(0,0,0,0.3);

		background:#3d82cc;
		background:-moz-linear-gradient(top, #3d82cc 0%, #004d9e 100%); /* FF3.6+ */
		background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#3d82cc), color-stop(100%,#004d9e)); /* Chrome,Safari4+ */
		background:-webkit-linear-gradient(top, #3d82cc 0%,#004d9e 100%); /* Chrome10+,Safari5.1+ */
		background:-o-linear-gradient(top, #3d82cc 0%,#004d9e 100%); /* Opera 11.10+ */
		background:-ms-linear-gradient(top, #3d82cc 0%,#004d9e 100%); /* IE10+ */
		background:linear-gradient(to bottom, #3d82cc 0%,#004d9e 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3d82cc', endColorstr='#004d9e',GradientType=0 ); /* IE6-9 */
	}
/*----- Grid breakpoints -------*/
@media screen and (max-width:1200px){
	div.grid_leistungen{margin-left:-20px;}
	div.grid_leistungen > div{border-width:20px;}
	.lbox{font-size:18px;}
}
@media screen and (max-width:1000px){
	/*vorzeitig 3-spaltig*/
	div.grid_leistungen > div{width:33.333333%;}
		div.grid_leistungen > div:nth-child(1n){clear:none;border-top-style:none;}
		div.grid_leistungen > div:nth-child(3n+1){clear:left;}
			div.grid_leistungen > div:nth-child(1n+4){border-top-style:solid;}
	.lbox{font-size:17px;}
}
@media screen and (max-width:760px){
	/*vorzeitig 2-spaltig*/
	div.grid_leistungen > div{width:50%;}
		div.grid_leistungen > div:nth-child(1n){clear:none;border-top-style:none;}
		div.grid_leistungen > div:nth-child(2n+1){clear:left;}
			div.grid_leistungen > div:nth-child(1n+3){border-top-style:solid;}
}
@media screen and (max-width:600px){
	div[class*=c4g_grid_].grid_leistungen{margin-left:-15px;padding-bottom:15px;}
	div[class*=c4g_grid_].grid_leistungen > div{border-width:15px;}
	.lbox{font-size:16px;}
		.lbox_head{padding:12px 5px 13px 10px;}
}
@media screen and (max-width:470px){
	.lbox{font-size:15px;}
}
@media screen and (max-width:400px){
	.lbox{font-size:18px;}
}



/*================ Grid Infobox =================*/
div.grid_infobox{margin-left:-30px;padding-bottom:30px;}
div.grid_infobox > div{border-width:30px;}
.fbox{
	font-family:roboto2014_condensed_regular, Arial, Helvetica, sans-serif;
	font-size:19px;
	line-height:1em;
}
.fbox_head, .fbox_img{
	width:100%;
	float:left;
	clear:both;
}
.fbox_head{
	color:white;
	background-color:rgb(0,77,158);
	padding:15px 10px 16px 14px;
	border-radius:10px;
	font-size:22px;
}

.fbox_img img{
	display:block;
	border:none;
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
	width:100%;
	/*WICHTIG: height auf auto, da sonst unproportionale Verzerrung*/
	height:auto;
}

.fbox_body{
	width:100%;
	float:left;
	clear:both;
	margin-top:0.5em;
}

/*----- Grid breakpoints -------*/
@media screen and (max-width:1200px){
	div.grid_infobox{margin-left:-20px;}
	div.grid_infobox > div{border-width:20px;}
	.lbox{font-size:18px;}
}
@media screen and (max-width:1000px){
	.fbox{font-size:17px;}
}
@media screen and (max-width:760px){
	.fbox .fbox_head{font-size:19px;}
}
@media screen and (max-width:600px){
	/*vorzeitig 1-spaltig*/
	div.grid_infobox > div{
		width:100%;
		margin-bottom:1em;
	}

	.fbox .fbox_head{font-size:22px;}
}
@media screen and (max-width:470px){
}
@media screen and (max-width:400px){
}





/*============ Start Über uns ============*/
.row_start_about h1{
	font-size:26px;
}






/*==================== NAVIGATION ====================*/

/*---------- Funktionsmenüs Suche, Sprachumschaltung -----------*/
/*In diesem Projekt gibt es wegen der Komplexen Layoutumschaltung beim Schrumpfen 3 Vorkommen der beiden Buttons. Einmal im normalen hmenu für die Desktopansicht (s.u. hmenu).
Dann zusammen mit dem fmenu0_btn in fmenu0_btn_container für Tabletansicht. Und zuletzt zusammen mit dem Claim in top_fbar für Smartphoneansicht.*/
/*--- In Hauptmenu Dropdown ---*/
/*Menbuttons Suche und Sprachumschaltung. Die eigentliche Schaltfläche liegt auf dem innenliegenden SPAN. Der äußere DIV wird zur Erzeugung der vertikalen Trenner verwendet :before*/
.hm_buttons{
	float:left;
	margin-left:0.8em;
	cursor:default;
}
	.hm_btn{
		float:left;
	}
		/*Trenner v*/
		.hm_btn:before{
			content:'|';
			color:rgb(153,153,153);
			display:inline-block;
		}
			.hm_btn.htm_btn_single:before{
				content:'';
			}
			/*Schaltfläche*/
			.hm_btn span{
				display:inline-block;
				padding:7px 0.5em 7px 0.5em;
				cursor:pointer;
			}
			.hm_btn.btn_langswitch span{
				text-transform:uppercase;
			}
			/*Icons*/
			.hm_btn span:before, .hm_btn span:after{
				display:inline-block;
				font-family:fontawesome;
			}
				.hm_btn.btn_search span:before{
					/*icon-search*/
					content:'\f002';
				}
				.hm_btn.btn_langswitch span:after{
					/*icon-caret-down*/
					content:'\f0d7';
					color:rgb(153,153,153);
					margin-left:0.25em;
				}
			/*Ausnahmen*/
			/*Der letzte Button hat kein padding-right, so dass er rechts optisch mit dem Satzspiegel abschließt.*/
			.hm_btn:last-child span{
				padding-right:0;
			}

/*--- In Funktionsmenü mit FMenu, Tabletansicht ---*/
.fm_buttons{
	float:left;
}
	.fm_btn{
		float:left;
		font-size:21px;
		line-height:1em;
		color:rgb(102,102,102);
		margin-right:0.25em;
	}
		.fm_btn span{
			display:inline-block;
			padding:8px 0.25em 8px 0.25em;
			cursor:pointer;
		}
		.fm_btn.btn_langswitch span{
			text-transform:uppercase;
		}
			.fm_btn span:before, .fm_btn span:after{
				display:inline-block;
				font-family:fontawesome;
			}
			.fm_btn.btn_search span:before{
				/*icon-search*/
				content:'\f002';
			}
			.fm_btn.btn_langswitch span:after{
				/*icon-caret-down*/
				content:'\f0d7';
				color:rgb(153,153,153);
				margin-left:0.25em;
			}

/*--- In Funktionsmenü top_fbar, Smartphoneansicht ---*/
.fb_buttons{
	float:right;
	/*zunächst unsichtbar*/
	display:none;
}
	.fb_btn{
		float:left;
		margin-right:0.25em;
	}
		.fb_btn span{
			display:inline-block;
			padding:5px;
			cursor:pointer;
		}
		.fb_btn.btn_langswitch span{
			text-transform:uppercase;
		}
			.fb_btn span:before, .fb_btn span:after{
				display:inline-block;
				font-family:fontawesome;
			}
			.fb_btn.btn_search span:before{
				/*icon-search*/
				content:'\f002';
			}
			.fb_btn.btn_langswitch span:after{
				/*icon-caret-down*/
				content:'\f0d7';
				color:rgb(204,229,255);
				margin-left:0.25em;
			}
/*Ausnahmen für geöffneten Zustand*/
.hm_btn.btn_langswitch.is_open span:after,
.fm_btn.btn_langswitch.is_open span:after,
.fb_btn.btn_langswitch.is_open span:after{
	/*icon-caret-up*/
	content:'\f0d8';
}

/*--- Menü-Popups Suche, Sprachwahl ---*/
/*Die beiden Controls werden immer an dem auslösenden Button geöffnet. s. JS*/
.cms4d_menu_popup, .cms4d_menu_popup *{
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
/*Gesamtcontainer für Positionierung*/
.cms4d_menu_popup{
	position:absolute;
	/*Der Abstand des Pfeils + Content zur Oberkante des Containers kann über eine transparente border gesichert werden.
	Dadruch werden beide Element nach unten versetzt, um den optischen Abstand zum auslösenden Button zu steuern.*/
	border-top:4px solid transparent;
	display:none;
	z-index:10000;
}
	/*Aufwärtspfeil-Container. Der sichtbare Pfeil, der auf den auslösenden Button zeigt wird als :before hierin mittig zentriert*/
	.cms4d_menu_popup_arrow{
		position:absolute;
		font-size:0.0001px;
		line-height:0.0001px;
		text-align:center;
		left:0;
		top:0;
	}
		.cms4d_menu_popup_arrow.arrow_back{
			z-index:10;
		}
			.cms4d_menu_popup_arrow.arrow_back:before{
				content:'';
				display:block;
				width:0;
				height:0;
				border:10px solid rgb(153,153,153);
				border-top-style:hidden;
				border-left-color:transparent;
				border-right-color:transparent;
				position:absolute;
				left:50%;
				margin-left:-10px;
				margin-top:-10px;
			}
		.cms4d_menu_popup_arrow.arrow_front{
			z-index:30;
		}
			.cms4d_menu_popup_arrow.arrow_front:before{
				content:'';
				display:block;
				width:0;
				height:0;
				border:10px solid white;
				border-top-style:hidden;
				border-left-color:transparent;
				border-right-color:transparent;
				position:absolute;
				left:50%;
				margin-left:-10px;
				margin-top:1px;
				margin-top:-9px;
			}
	.cms4d_menu_popup_content{
		z-index:20;
		position:relative;
		background-color:white;
		border:1px solid rgb(153,153,153);
		border-radius:5px;
		-webkit-box-shadow:5px 5px 5px 0px rgba(0,0,0,0.5);
		box-shadow:5px 5px 5px 0px rgba(0,0,0,0.5);
		padding:9px 10px 11px 10px;
	}

/*Aussehen der Formularelemente für alle Browser und OS vereinheitlichen*/
.cms4d_menu_popup input,
.cms4d_menu_popup button{
	/*Erscheinungsbild aufheben*/
	-webkit-appearance:none;
	-moz-appearance:none;
	appearence:none;
	font-size:1em;
}
	.cms4d_menu_popup input[type=text]{
		border:1px solid rgb(204,204,204);
		background-color:rgb(240,240,240);
		border-radius:4px;
		height:2em;
		padding:0;
		padding-left:5px;
	}
	.cms4d_menu_popup input[type=button],
	.cms4d_menu_popup input[type=submit]{
		height:2em;
		min-width:2em;
		cursor:pointer;
		padding:0;
		color:white;
		background:rgb(153,153,153);
		border-radius:5px;
		border:1px solid rgb(153,153,153);
	}

/*Menüpopup Suche*/
.cms4d_menu_popup.search{
	line-height:1em;
}
	/*Button mit Icon. Hier ist der Unicode für das Lupen-Icon als HTML-Entität im Value des Button-Elements gesetzt (s. HTML-Quelltext).*/
	.cms4d_menu_popup.search input[type=submit]{
		font-family:fontawesome;
	}
	
/*Menüpopup Sprachwahl*/
.cms4d_menu_popup.langswitch .cms4d_menu_popup_content{
	padding-top:2px;
	padding-bottom:5px;
}
.cms4d_menu_popup.langswitch a{
	color:rgb(102,102,102);
	display:block;
	border-top:1px solid rgb(204,204,204);
	padding:0.4em 0 0.4em 0;
}
	.cms4d_menu_popup.langswitch a:first-child{
		border-top:none;
	}
	.cms4d_menu_popup.langswitch a.on{
		color:rgb(0,77,158);
		font-family:roboto2014_medium, Arial, Helvetica, sans-serif;
	}






/*------- Hauptmenu Dropdown -------*/
/*Zusammen mit dem rechts floatenden Hauptmenu Dropdown liegen noch weiter Buttons in dieser Reihe. Später muss diese komplette Zeile
unter das Logo umgebrochen werden. Deshalb gibt es 2 Container, die das Floating und die Breite der Zeile steuern.*/
.hmenu_trenner{
	/*floatet NICHT und wird später sichtbar, sobald die hmenu Zeile umgebrochen wird.
	Der DIV kann durch negative margin l/r aus dem durch hpad1_erzeugten padding herausgezogen werden. Somit muss später das padding der Elemente in top-row
	nicht einzeln gesteuert werden, sondern nur das Verhalten der Trennzeile. Später wird der Trenner zusammen mit der hmenu Zeile komplett ausgeblendet.*/
	clear:both;
	margin-left:-30px;
	margin-right:-30px;
	padding-top:10px;
	border-bottom:1px solid rgb(204,204,204);
	display:none;
}
.hmenu_row{
	/*wird später über die komplette Breite umbgebrochen. s. viewports*/
	float:right;
	font-family:roboto2014_condensed_regular, Arial, Helvetica, sans-serif;
	font-size:19px;
	line-height:1em;
	color:rgb(51,51,51);
	padding-top:12px;
	min-width:730px;
}
	.us .hmenu_row{
		min-width:530px;
	}
	.hmenu_box{
		float:right;
		z-index:30;
	}
		/*Hauptmenu Dropdown*/
		.hmenu_container{
			float:left;
		}
.hmenu{
}
.hmenu a{
	color:inherit;
	display:block;
}
	.hmenu li.lvl0{
		margin-left:1em;
	}
		.hmenu li.lvl0:first-child{
			margin-left:0;
		}
		.hmenu a.lvl0{
			padding:7px 0 7px 0;
		}
			.hmenu a.lvl0 > span{
				display:inline-block;
			}
				/*Icons*/
				.hmenu a.lvl0:before{
					/*icon-circle*/
					content:'\f111';
					font-family:fontawesome;
					color:inherit;
					display:inline-block;
					margin-right:0.1em;
					/*In diesem Projekt alle ausgeblendet, außer bei Home*/
					display:none;
				}
				/*Home nur als Icon Haus, Text ausblenden*/
				.__________hmenu li.page-start a.lvl0:before{
					/*icon-home*/
					content:'\f015';
					display:inline-block;
					position:relative;
					top:-1px;
				}
					._________hmenu li.page-start > a.lvl0 > span{
						display:none;
					}
		/*Home-Link komplett ausblenden*/
		.hmenu li.page-start{
			display:none;
		}
.hmenu .sub{
	width:300px;
	padding-bottom:30px;
	line-height:1.2em;
}
.hmenu .sub2{
	/*border-radius:0;*/
	color:rgb(51,51,51);
}
	.hmenu .sub a{
		color:inherit;
		border-top:1px solid rgb(230,230,230);
	}
		.hmenu .sub li:first-child a{
			border-top:none;
		}
		.hmenu .sub a > span{
			display:inline-block;
			/*Damit bei mehrzeilig umbrechenden Beschriftungen das Bullet außerhalb des Textblocks liegt, wird im span links eine
			große margin gesetzt und das Bullet negativ nach links aus dem Container gezogen.*/
			padding:10px 10px 12px 2em;
		}
			.hmenu .sub a > span:before{
				/*icon-circle*/
				content:'\f111';
				/*icon-square*/
				content:'\f0c8';
				/*icon-circle-o*/
				content:'\f10c';
				font-family:fontawesome;
				width:1em;
				display:inline-block;
				margin:0 0.4em 0 -1.4em;
				position:relative;
				color:rgb(204,204,204);
			}

	/*hove, act, on*/
	.hmenu a:hover, .hmenu a.act, .hmenu a.on, .hmenu li.cms4d_js_open a.lvl0, .hmenu .sub a:hover > span:before, .hmenu li.cms4d_js_open a.lvl0{
		color:rgb(0,77,158);
	}
	.hmenu a.act, .hmenu a.on{
		font-family:roboto2014_condensed_bold, Arial, Helvetica, sans-serif;
	}
		.hmenu .sub a:hover, .hmenu .sub a.act, .hmenu .sub a.on{
			color:rgb(0,77,158);
		}
		.hmenu .sub a.act, .hmenu .sub a.on{
			font-family:roboto2014_condensed_regular, Arial, Helvetica, sans-serif;
		}
		.hmenu .sub a:hover > span:before,
		.hmenu .sub a.act > span:before,
		.hmenu .sub a.on > span:before{
			/*icon-circle*/
			content:'\f111';
			color:rgb(153,153,153);
		}
		.hmenu .sub a.act > span:before, .hmenu .sub a.on > span:before{
			color:rgb(0,77,158);
		}




/*--- Submenu Treeview ---*/
.smenu_1_container{
	width:100%;
	float:left;
	clear:both;
	margin-top:2px;
}
.tree{
	width:100%;
	float:left;
	clear:both;
	font-size:18px;
	line-height:1.2em;
	font-family:roboto2014_condensed_regular, Arial, Helvetica, sans-serif;
	color:rgb(51,51,51);
}
.tree ul, .tree li{
	list-style:none;
	padding:0;
	margin:0;
	display:block;
}
.tree a{
	display:block;
	text-decoration:none;
	color:inherit;
}
.tree a > span{
	display:block;
}
	/*Level 0*/
	._____tree a.lvl0{
		border-top:1px solid rgb(230,230,230);
	}
		.tree li.lvl0:first-child a{
			border-top:none;
		}
		.tree a.lvl0 > span{
			/*padding:0.75em 0 0.75em 0;*/
			padding:0.6em 0 0.6em 0;
		}
			.tree a.lvl0 > span:before{
				/*icon-square*/
				content:'\f0c8';
				/*icon-circle-o*/
				content:'\f10c';
				font-family:fontawesome;
				display:inline-block;
				/*Bullet nach links ins padding ziehen*/
				margin-left:-1.4em;
				/*erste Zeile korrigieren*/
				/*margin-right:0.5em;*/
				margin-right:0.4em;
				color:rgb(204,204,204);
			}

/*Level n*/
.tree .sub{
	font-size:17px;
	padding-bottom:10px;
}
	.tree .sub2{
		display:block;
	}
		.tree .sub a{
			padding:0.4em 0 0.4em 0;
		}
			.tree .sub a span:before{
				/*icon-square*/
				content:'\f0c8';
				/*icon-circle-o*/
				content:'\f10c';
				font-family:fontawesome;
				/*Bullet nach links ins padding ziehen*/
				margin-left:-1.2em;
				/*erste Zeile korrigieren*/
				/*margin-right:0.35em;*/
				margin-right:0.2em;
				color:rgb(204,204,204);
			}
	/*hover, act, on*/
	.tree a:hover, .tree a.act, .tree a.on{
		color:rgb(0,77,158);
	}
		.tree a:hover > span:before,
		.tree a.act > span:before,
		.tree a.on > span:before{
			/*icon-circle*/
			content:'\f111';
			color:rgb(153,153,153);
		}
	.tree a.act > span:before,
	.tree a.on > span:before{
		color:rgb(0,77,158);
	}
	._______tree a.on{
		font-family:roboto2014_condensed_bold, Arial, Helvetica, sans-serif;
	}

	/*Einrückungen / Offsets*/
	.tree a.lvl0{padding-left:1.4em;}
	/*Einrückung ab lvl1: für durchgängig ab lvl0 gleich formatierte Treeviews = Standardeinrückung lvl0 + (Standardeinrückung lvln * n).*/
	.tree a.lvl1{padding-left:2.8em;}
	.tree a.lvl2{padding-left:4.1em;}
	.tree a.lvl3{padding-left:5.35em;}
	.tree a.lvl4{padding-left:6.65em;}
	.tree a.lvl5{padding-left:7.9em;}
	.tree a.lvl6{padding-left:9.2em;}
	.tree a.lvl7{padding-left:10.5em;}
	.tree a.lvl8{padding-left:11.75em;}



/*--- fmenu0 ---*/
.fmenu0_row{
	display:none;
	z-index:1000;
}
.fmenu0_btn_container, .fmenu0_btn_container *{
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
.__________fmenu0_btn_container{
	width:100%;
	float:right;
	position:relative;
	margin-right:20px;
	z-index:20;
}
	/*Sichtbarer Button*/
	.___________________fmenu0_btn{
		position:absolute;
		right:0;
		/*Wird nach oben aus dem Container gezogen und überlagert vorherige Elemente.*/
		top:-50px;
	}
.fmenu0_btn_container{
	position:absolute;
	right:0;
	top:-40px;
	margin-right:20px;
	z-index:20;
}
/*Sichtbarer Button*/
.fmenu0_btn{
	float:left;
}
		/*Button mit Icon und Label*/
		.fm_button{
			font-family:roboto2014_condensed_regular, Arial, 'Arial Unicode MS', Helvetica, sans-serif;
			font-size:21px;
			line-height:1em;

			float:left;
			position:relative;
			color:rgb(102,102,102);
			background-color:white;
			border:1px solid rgb(204,204,204);
			border-radius:5px;
			min-height:39px;
			white-space:nowrap;
			cursor:pointer;
			padding:0 7px 0 10px;
		}
			.fm_button .icon{
				display:inline-block;
				padding-top:7px;
			}
				.fm_button .icon:before{
					/*icon-reorder*/
					content:'\f0c9';
					font-family:'fontawesome';
					display:inline-block;
					width:1em;
				}
			.fm_button .label{
				display:inline-block;
				padding:7px 2px 0 3px;
			}
			/*wenn FMenu offen*/
			.fmenu0_btn .btn_fmenu_opener.open{
				color:rgb(153,153,153);
				background-color:rgb(235,235,235);
				border-color:rgb(153,153,153);
				border-bottom-left-radius:0;
				border-bottom-right-radius:0;
				border-bottom:none;
				/*Mindesthöhe = negativer Offset des Öffnen-Buttons (.fmenu0_btn_container oder .fmenu0_btn)*/
				min-height:40px;
				/*Nachfolgenden FMenu Container um 1px nach oben ziehen, so dass der Öffnen-Button diesen überlagert.*/
				margin-bottom:-1px;
			}
				.fmenu0_btn .btn_fmenu_opener.open .icon:before{
					/*icon-remove*/
					content:'\f00d';
					/*Zeichen zentrieren*/
					padding-left:1px;
					margin-right:-1px;
				}
			#fmenu0_container .cms4d_fmenu_content{
				border-top:1px solid rgb(153,153,153);
			}

#fmenu0_container{
	margin-top:-1px;
	z-index:10;
}
	.cms4d_fmenu_head, .cms4d_fmenu_body, .cms4d_fmenu_footer{
		background-color:rgb(235,235,235);
		color:black;
	}
		/*Icon: zurück zur aktuellen Seite, r/o neben Menütitel*/
		.cms4d_fmenu_head .btn.act:before{
			color:rgb(102,101,99);
		}
		/*Taste allgemein*/
		.cms4d_fmenu .fbtn{
			background-color:white;
			border-color:rgb(204,204,204);
		}
			/*Icon: Taste mit eigenem Seitenlink, Doc Symbol links vor Text*/
			.cms4d_fmenu .flbl a:before{
				color:rgb(153,152,151);
			}
			/*Icon: Taste allgemein, Symbol Pfeil nach rechts - nächste Ebene*/
			.cms4d_fmenu .fcbtn > span{
				background-color:rgb(153,153,153);
			}
			/*--- act, on ---*/
			/*aktive Taste*/
			.cms4d_fmenu .fcol.on .fbtn{
				font-family:roboto2014_condensed_regular, Arial, Helvetica, sans-serif;
				background-color:rgb(245,215,51);
				border-color:rgb(153,153,153);
			}
				/*Icon aktive Taste*/
				.cms4d_fmenu .fcol.on .flbl a:before{
					color:rgb(102,101,99);
				}
				/*Text aktive Taste*/
				.cms4d_fmenu .fcol.on .flbl a {
					color:rgb(51,51,51);
				}
		.cms4d_fmenu_footer .btn{
			background-color:rgb(153,153,153);
		}
/*Zeilenumbrüche durch Entität*/
.cms4d_fmenu .flbl span{
	white-space:pre-line;
}




/*--- Breadcrumb Menü ---*/
/*Farben erben. So muss je nahc Hintergrundfarbe der Seite nicht explizit jedes Unterelement neu formatiert werden.*/
.bcmenu{
	color:inherit;
}
	.bcmenu .btn,
	.bcmenu .btn.on,
	.bcmenu a.btn
	{
		color:inherit;
	}
.bcmenu a > span{
	/*Für mehrzeillige Menülabels mit &#xa; als Entität für Zeilenumbruch muss der Umbruch neutralisiert werden.
	Andernfalls verschiebt sich die Grundlinie in iOS Safari gegenüber den anderen Labeln, obwohl der Text optisch nur in einer Zeile gerendert wird.*/
	word-break:break-all;
	white-space:normal;
}
.bcmenu_top{
	margin-bottom:10px;
	display:none;
/*etwas nach oben ziehen, um Platz zu sparen*/
margin-top:-0.5em;
}
.bcmenu_bottom{
	/*border-top:1px solid rgb(230,230,230);*/
	padding:10px 0 15px 0;
}
/*Nie auf Startseite*/
body.page-start .bcmenu_top, body.page-start .bcmenu_bottom{
	display:none;
}
/*Home Button nur Icon*/
.bcmenu .btn.home > span{display:none;}
	.bcmenu .btn.home:after{
		/*icon-home*/
		content:'\f015';
		font-family:fontawesome;
		display:inline-block;
	}




/*------- Footer Quicklinks -------*/
.qmenu{
	/*Die Spaltencontainer .qm_box haben links und rechts ein padding zum Nachbarn. Dies beträgt jeweils die Hälfte des gewünschten optischen Spaltenabstands: 1em * 2
	Damit der erste Spaltencontainer optisch linksbündig mit dem Satzspiegel abschließt und der letzte rechtsbündig, wird der Gesamtcontainer
	um jeweils eine halben Spaltenabstand nach außen gezogen. Der entstehende Overflow wird vom übergeordneten .fo_qmenu abgeschnitten.
	Optisch wirkt am Ende der Gesamte Inhaltsblock, als wäre er genauso breit, wie der Satzspiegel.*/
	margin-left:-1em;
	margin-right:-1em;

	font-size:16px;
	/*Die Spaltencontainer mit den Links werden als inline-Elemente behandelt und können so auch horizontal zentriert werden.*/
	text-align:center;
	/*WICHTIG: da sich die Spaltencontainer dann wie Buchstaben in einer Textzeile verhalten, entstehen durch Whitespace im HTML-Code
	auch die typischen Buchstabenabstände. Diese würden aber verhindern, dass die Container selbst bei mathematisch exakter Breite alle in einer Zeile passen.
	Deshalb werden die Buchstabenabstände negativ neutralisiert. Wenn also die Breite einer .qm_box auf 20% gesetzt wird, passen auch wirklich 5 Element in eine Reihe.
	OK getestet in allen Browsern ab IE8.*/
	letter-spacing:-0.25em;
}
	.qm_box{
		display:inline-block;
		text-align:left;
		/*WICHTIG: vertical-align muss top sein, damit sich alle Container ungeachtet ihrer eigenen Höhe an der Oberkante des übergeordneten Containers anordnen.*/
		vertical-align:top;
		position:relative;
		/*Buchstabenabstand für normale Texte wiederherstellen*/
		letter-spacing:normal;
		/*Die Breite wird zunächst auf 20% gesetzt, so dass sich 5 Spalten ergeben. Da Setzen der width erzwingt auch, dass die Container nie von selbst umbrechen,
		so lange die Teilung mathematisch <= 100% ergibt (ähnlich float).*/
		width:20%;
		padding-left:1em;
		padding-right:1em;
		/*Abstand zur folgenden Reihe nach Umbruch. Der Abstand wird auf padding/margin verteilt,
		um später bei 1-spaltiger Darstellung eine Trennlinie vertikal mittig einschieben zu können.*/
		padding-top:0.6em;
		margin-top:0.5em;
	}
		.qm_head{
			font-family:roboto2014_condensed_bold, Arial, Helvetica, sans-serif;
			font-size:1.125em;
			line-height:1.2em;
			color:rgb(0,77,158);
			margin-bottom:0.3em;
		}
		.qm_body a{
			float:left;
			clear:both;
			/*Durch das padding-left wird die linke Textkante auch bei umbrechenden Menübeschriftungen definiert. Das Bullet wird negativ nach links raus gezogen*/
			padding-left:1em;
			padding-top:0.4em;
			padding-bottom:0.4em;
		}
			.qm_body a:before{
				/*icon-chevron-right*/
				content:'\f054';
				font-family:fontawesome;
				display:inline-block;
				width:1em;
				/*in Paddingbereich raus ziehen*/
				margin-left:-1em;
			}
/*---- qmenu breakpoints -----*/
@media screen and (max-width:1000px){
	/* 3-spaltig */
	.qm_box{width:33%;}
}
@media screen and (max-width:600px){
	/* 2-spaltig
	Spaltencontainer linksbündig ausrichten, damit letzte Box nicht zentriter alleine steht.*/
	.qmenu{
		text-align:left;
		/*erhöhten Spaltenabstand NICHT ausgleichen. Die Spalten sollen nicht zu nah am Viewportrand sitzen.*/
		margin-left:-1em;
		margin-right:-1em;
	}
	.qm_box{
		width:50%;
		/*Spaltenabstand erhöhen*/
		padding-left:2em;
		padding-right:2em;
	}
}
@media screen and (max-width:400px){
	/* 1-spaltig*/
	.qm_box{
		width:100%;
		border-top:2px dotted white;
	}
		.qm_box:first-child{
			border-top-style:hidden;
		}
}







/*================== VIEWPORTS ================*/
/*--- Alle Browser, die mediaqueries unterstützen, ab IE9 ---*/
@media screen and (width){
	/*--- IE8 Layoutbreiten-Begrenzung aufheben ---*/
	/*Für alle Browser, die mediaqueries unterstützen darf das Layout jetzt schrumpfen. Min. 320px (incl. padding!), iPhone3 hoch*/
	/*.row_center{
		min-width:280px;
	}*/
	.page_container{
		min-width:280px;
	}
}

/*Kopfzeile bei Breite > 1310px anderer Randabstand. Die nächste typische Monitorbreite wäre 1330px.*/
@media screen and (min-width:1315px){
	/*=== Layout ===*/
	.top_row .row_center{
		/*Logo und Claim/Hmenu wandern weiter nach außen über den Satzspiegel hinaus.*/
		max-width:1240px;
	}
		.top_row .hpad_1{
			padding-left:0;
			padding-right:0;
		}
}

@media screen and (max-width:1280px){
	/*=== layout ===*/
	/*Ab <= 1280 kein Hintergrundbild mehr, Farbe weiß.*/
	body{
		background-image:none;
		background-color:white;
	}
}
@media screen and (max-width:1240px){
	/*=== Navigation ===*/
	.hmenu_row{
		font-size:17px;
		padding-top:14px;
	}
}
@media screen and (max-width:1200px){
	.hpad_1{padding-left:30px;padding-right:30px;}
	.vpad_1{padding-top:30px;padding-bottom:30px;}

	/*=== Layout ===*/
	.top_row{
		padding-top:0;
		padding-bottom:15px;
	}
		.top_fbar{
			padding-top:16px;
		}
		.hmenu_row{
			padding-top:11px;
		}
	.content_row{
		margin-top:25px;
	}
}
@media screen and (max-width:1160px){
	/*=== Navigation ===*/
	/*Trenner einblenden, hmenu über komplette Breite unterhalb Logo*/
	.hmenu_trenner{
		display:block;
	}
	.hmenu_row{
		width:100%;
		clear:both;
		font-size:18px;
		padding-top:12px;
	}
}
@media screen and (max-width:1100px){
}
/*Ab iPad quer*/
@media screen and (max-width:1024px){
	/*=== Navigation ===*/
	/*Raum für linke Spalte etwas schmaler*/
	body.smenu_lvl_1 .center_col{
		padding-left:27.2%;
	}

	/*=== slider0 ===*/
	/*Cursor-Tasten immer sichtbar*/
	.slider0 .cms4d_slider3_cbtn {
		display: block;
	}
		.slider0 .cms4d_slider3_ibtn{
			width:14px;
			height:14px;	
		}
}

/*--- ab kleiner XGA 1024, < iPad quer ---*/
@media screen and (max-width:1000px){
	.hpad_1{padding-left:20px;padding-right:20px;}
	.vpad_1{padding-top:20px;padding-bottom:20px;}

	/*=== Blockformate ===*/
	h1{font-size:30px;}
	h2{font-size:24px;}
	/*h3{font-size:1.3em;}
	h4{font-size:1.1em;}*/

	/*=== Layout ===*/
	.top_logo{
		margin-left:-10px;
	}
	.hmenu_trenner{
		margin-left:-20px;
		margin-right:-20px;
	}
	.content_row{
		margin-top:20px;
	}
	.col_header{
		margin-bottom:20px;
	}
}
@media screen and (max-width:950px){
}
@media screen and (max-width:939px){
	/*=== cms4d grid ===*/
	/*Ab hier Spaltenabstand für alle grid Layoutkombinationen pauschal verkleinern*/
	div[class*=c4g_grid_]{margin-left:-20px;padding-bottom:20px;}
		div[class*=c4g_grid_] > div{border-left-width:20px;border-top-width:20px;}
	/*Margin bei im Inhalt fließenden Bildern verringern*/
	.html_content img.bild_links{margin-right:30px;}
	.html_content img.bild_rechts{margin-left:30px;}
	/*=== fbox_2 ===*/
	/*Spaltenabstand global verringern*/
	.fbox_2 .box_img{padding-right:10px;}
		.fbox_2 .box_img ~ *{
			padding-left:10px;
		}

	/*=== Layout ===*/
	/*Startseite: rechte Spalte bricht immer in vole Breite unter center_col.
	Der Platz für center_col 100% ist bei Viewportbreite 624px exakt so breit wie 2 Spalten im Ursprungslayout: 2 Spalten zu 300 + 1 Spaltenabstand zu 20 + 2 padding außen zu 15*/
	body.page-start .center_col{
		width:100%;
		clear:both;
	}
	body.page-start .right_col{
		width:100%;
		clear:both;
		/*Abstand nach unten, da jetzt nicht mehr von sgrid1 erzeugt*/
		margin-bottom:30px;
	}

	/*=== Navigation ===*/
	/*--- Ab jetzt nur noch mobile Menü ----*/
	.hmenu_row{display:none;}
	/*FMenu mobile einblenden*/
	.fmenu0_row{display:block;}
	/*Breadrumb oben/unten*/
	.bcmenu_top, .bcmenu_bottom{display:block;}
		/*nicht auf Startseite*/
		body.page-start .bcmenu_top{
			display:none;
		}
	/*--- left_col, submenu ---*/
	/*Submenu ausblenden, center_col immer über volle Breite*/
	body.smenu_lvl_1 .left_col{
		display:none;
	}
		body.smenu_lvl_1 .center_col{
			padding-left:0;
		}



	/*=== Layout ===*/
	.top_fbar{
		font-size:26px;
		padding-top:17px;
	}
		.hmenu_trenner{
			display:none;
		}
	.cta_box{
		font-family:roboto2014_condensed_regular, Arial, Helvetica, sans-serif;
		font-size:23px;
		letter-spacing:normal;
	}
	.col_header{
		font-size:28px;
	}

}

@media screen and (max-width:800px){
}


/*--- grosse Tablets hoch ---*/
@media screen and (max-width:774px){
	.hpad_1{padding-left:20px;padding-right:20px;}
}


/*--- mittlere Tablets iPad hoch (768) ---*/
@media screen and (max-width:768px){
}

/*--- ab kleiner iPad ---*/
@media screen and (max-width:760px){
	.hpad_1{padding-left:15px;padding-right:15px;}
	.vpad_1{padding-top:15px;padding-bottom:15px;}
	/*Inline Bilder: ab jetzt max. breit und durch display:block alleinstehend in ihrer Zeile*/
	.content_container img.bild_links, .content_container img.bild_rechts{
		float:none;
		max-width:100%;
		display:block;
		margin-left:0;
		margin-right:0;
		margin-bottom:15px;
	}

	/*=== Navigation ===*/
	.fmenu0_btn_container{
		margin-right:15px;
	}

	/*=== layout ===*/
	.cta_box{
		font-size:21px;
	}
		.cta_box:before{
			margin-left:0.25em;
		}
		/*Innenliegende SPANs blockweise umbrechen*/
		.cta_box span{
			display:inline-block;
		}




	/*=== layout US-Mode ===*/
	.us .top_fbar{
		/*Der DIV steht im HTML Code vor dem Logo. Jetzt wird das floating aufgelöst und durch negative margin wird der DIV über die volle Viewportbreite gezogen.*/
		float:none;
		clear:both;
		width:auto;
		max-width:none;
		padding:0;
		margin-left:-15px;
		margin-right:-15px;
		color:white;
		background-color:rgb(0,77,158);
		font-family:roboto2014_condensed_regular, Arial, Helvetica, sans-serif;
		font-size:21px;
		line-height:1em;
		text-align:left;
		padding:8px 0px 9px 10px;
	}
		/*clearfix, damit der Container durch die innenliegenden floatenden Inhalte trotzdem auseinander gedrückt wird.*/
		.us .top_fbar:before, .top_fbar:after{
			content:'';
			display:block;
			display:table;
			width:100%;
			clear:both;
		}
		.us .top_claim{
			text-transform:uppercase;
			padding:5px 0 7px 0;
		}
		.us .fb_buttons{
			display:block;
		}
	.us .top_logo{
		max-width:75%;
	}

	/*=== navigation ===*/
	/*Die beiden Funktionsbuttons neben dem fmenu0 werden ausgeblendet, da jetzt in top_fbar verfügbar*/
	.us .fm_buttons{
		display:none;
	}




}
@media screen and (max-width:708px){
	/*=== cms4d grid ===*/
	/*Inline Bilder: ab hier schrumpfen alle inline Bilder gleich schnell mit gleicher Breite*/
	.content_container img.bild_links, .content_container img.bild_rechts{
		max-width:42%;
	}
	/*=== fbox_2 ===*/
	/*ALLE fbox_2 Varianten: Texte floaten ab jetzt regulär rechts ums Bild.*/
	.fbox_2 .box_img{
		padding-right:inherit;
		margin-right:20px;
		margin-bottom:5px;
	}
		.fbox_2 .box_img ~ *{
			float:none !important;
			clear:none !important;
			width:auto !important;
			display:block !important;
			left:auto !important;
			margin-right:auto !important;
			padding-left:inherit !important;
		}
		/*LI-Elemente umfließen lassen. Die übergeordnete UL erstreckt sich hinter dem Bild über die volle Breite des Spalten-Containers.
		BEACHTE: leider ist es nicht gelungen, auch die Listen zufriedenstellend um das .box_img fließen zu lassen. Hierzu sind umfangreiche Regelumschreibungen notwendig.
		Trotzdem ergibt sich das altbekannte Problem, dass die LI-Elemente immer ganz nach links unter dem Bild durchfließen. Also spätestens bei mit Linien getrennten
		LI-Elementen zeigt sich eine unschöne Darstellung. Die folgende Lösung ist so halbwegs brauchbar...
		ACHTUNG: allerdings wird der Text nach den Icons beim Opera mobile in die nächste Zeile umgebrochen. Keine Idee...*/
		.fbox_2 ul > li{
			/*sehr dubios - aber funktioniert als einzige Variante so, dass die LI-Elemente tatsächlich wie gewünscht vom links stehenden .box_img vollkommen verdrängt werden.*/
			display:table;
			border:none;
		}
			/*ggf. gesetzte Trennlinien ausblenden. Leider gibt es keine Möglichkeit den LI-Elementen eine volle Breite zu setzen, so dass die Trennlinien immer nur
			so breit sichtbar sind, wie der innere Text das LI auseinanderdrückt. Das sieht dann bei unterschiedlichen Längen rechts ziemlich ausgefranst aus.*/
			.fbox_2 ul.hlines li{
				border-top-style:none;
			}
			/*BR-Tags auflösen*/
			.fbox_2 br{
				display:none;
			}
}
@media screen and (max-width:680px){
	/*=== Blockformate ===*/
	h1{font-size:1.5em;}
	h2{font-size:1.3em;}
	/*h3{font-size:1.1em;}*/
}


/*viewport < Ursprungsbreite Kopfbilder Slider0 (664px) ---*/
@media screen and (max-width:663px){
}

@media screen and (max-width:660px){
	/*=== cms4d grid ===*/
	/*Spaltenzahlen anpassen*/
	div.c4g_grid_6 > div
	,div.c4g_grid_5 > div{width:25%;}
		div.c4g_grid_6 > div:nth-child(1n)
		,div.c4g_grid_5 > div:nth-child(1n){clear:none;border-top-style:none;}
		div.c4g_grid_6 > div:nth-child(4n+1)
		,div.c4g_grid_5 > div:nth-child(4n+1){clear:left;}
			div.c4g_grid_6 > div:nth-child(1n+5)
			,div.c4g_grid_5 > div:nth-child(1n+5){border-top-style:solid;}
	div.c4g_grid_3 > div{width:50%;}
		div.c4g_grid_3 > div:nth-child(1n){clear:none;border-top-style:none;}
		div.c4g_grid_3 > div:nth-child(2n+1){clear:left;}
			div.c4g_grid_3 > div:nth-child(1n+3){border-top-style:solid;}
}

@media screen and (max-width:650px){
}


/*--- Smartphone gross quer (z.B. Galaxy S3) ---*/
@media screen and (max-width:640px){
}

/*--- kleine Tablets, Smartphone mittel quer ab <= 610px ---*/
@media screen and (max-width:610px){
	/*=== layout ===*/
	.top_fbar{
		/*Der DIV steht im HTML Code vor dem Logo. Jetzt wird das floating aufgelöst und durch negative margin wird der DIV über die volle Viewportbreite gezogen.*/
		float:none;
		clear:both;
		width:auto;
		max-width:none;
		padding:0;
		margin-left:-15px;
		margin-right:-15px;
		color:white;
		background-color:rgb(0,77,158);
		font-family:roboto2014_condensed_regular, Arial, Helvetica, sans-serif;
		font-size:21px;
		line-height:1em;
		text-align:left;
		padding:8px 0px 9px 10px;
	}
		/*clearfix, damit der Container durch die innenliegenden floatenden Inhalte trotzdem auseinander gedrückt wird.*/
		.top_fbar:before, .top_fbar:after{
			content:'';
			display:block;
			display:table;
			width:100%;
			clear:both;
		}
		.top_claim{
			text-transform:uppercase;
			padding:5px 0 7px 0;
		}
		.fb_buttons{
			display:block;
		}
	.top_logo{
		max-width:75%;
	}

	/*=== navigation ===*/
	/*Die beiden Funktionsbuttons neben dem fmenu0 werden ausgeblendet, da jetzt in top_fbar verfügbar*/
	.fm_buttons{
		display:none;
	}
}
@media screen and (max-width:564px){
}
@media screen and (max-width:533px){
}
@media screen and (max-width:500px){
	.hpad_1{padding-left:15px;padding-right:15px;}

	/*=== Navigation ===*/
	/*Menübeschriftung ausblenden*/
	.fmenu0_btn .label{
		display:none;
	}

}


/*--- Smartphone quer < 480px (iPhone=480) ---*/
@media screen and (max-width:470px){
	/*=== cms4d fmenu ===*/
	/*einspaltig*/
	.cms4d_fmenu .fcol{width:100%;clear:both;}

	/*=== slider0 ===*/
	/*Indexbuttons nur noch als optische Marker*/
	.slider0 .cms4d_slider3_ibtn_container{
		bottom:5px;
		right:0px;
		padding:0;
	}
		.slider0 .cms4d_slider3_ibtn{
			width:8px;
			height:8px;
			margin:0 4px 0 0;
		}
			.slider0 .cms4d_slider3_ibtn.on{
				background-color:black;
				border-color:white;
			}
		/*Layer mit Textbox floatet ab jetzt und drückt das Slide in der Höhe gemäß seines Textinhaltes zusätzlich auseinander.*/
		.slider0 .layer.static{
			/*position wird mit important hoch gewichtet, falls der Layer durch andere parallele Regeln (z.B. fullscreen) vorher position:absolute war.*/
			position:static !important;
			float:left;
			clear:both;
			width:100%;
		}
			/*Positionierungs-Container static schalten*/
			.sbox1_pos{
				/*Box nicht mehr position:absolute sondern static. Dadurch wirken die jQuery Animation bezgl. position nicht mehr. Die jQuery styles werden zwar nachwievor geschrieben,
				haben aber bei static keinen Auswirkung auf left/top/.... Dies hat den Effekt, dass es einen nahtlosen Übergang zwischen animierter und statischer
				Darstellung gibt. Wird in einer laufenden Animation der viewport vergrößert, so greifen automatisch sofort wieder die styles auf dem Element :-).
				ACHTUNG: alle anderen Animationen bezgl. size/opacity/... etc. werden natürlich weiterhin ausgeführt!*/
				/* 1) Normalisieren*/
				position:static;
				width:auto;
				max-width:none;
				border-radius:0;
				padding:0;
				margin:0;
				right:auto;
				left:auto;
				top:auto;
				bottom:auto;
				/* 2) Effekte löschen*/
				border:none;
				box-shadow:none;
				background-color:rgb(148,163,151);
				/* 3) floaten, volle Breite*/
				width:100%;
				max-width:100%;
				float:left;
				clear:both;
			}
				.sbox1{
					/*ENTSCHEIDEND: da jetzt hier die font-size als ABSOLUTER Pixel-Wert gesetzt wird, greift die Skalierung der innenliegenden Inhalte
					über die globale Slider font-size nicht mehr.*/
					font-size:20px;
					line-height:1.2em;
					text-align:left;
					padding:10px 15px 25px 10px;
				}
					.sbox1 .box_head{
						font-size:inherit;
						line-height:inherit;
					}
						.sbox1 .box_head *{
							font-size:inherit;
							line-height:inherit;
						}
					.sbox1 .box_body{
						font-size:inherit;
						line-height:inherit;
					}
						.sbox1 .box_body p{
							font-size:inherit;
							line-height:inherit;
						}
						.sbox1 .box_body h1,
						.sbox1 .box_body h2,
						.sbox1 .box_body h3,
						.sbox1 .box_body h4,
						.sbox1 .box_body h5,
						.sbox1 .box_body h6{
							font-size:2em;
						}
}



/*--- Smartphone hoch ab <= 400px ---*/
@media screen and (max-width:400px){
	/*=== cms4d grid ===*/
	/*Für alle Grids nur noch einspaltig*/
	div[class*=c4g_grid_] > div{width:100%;clear:both;}
		div[class*=c4g_grid_] > div:nth-child(1n+2){border-top-style:solid;}
	div.c4g_grid_33_66 > div{width:100%;}
		div.c4g_grid_33_66 > div:first-child{width:100%;}
	div.c4g_grid_66_33 > div{width:100%;}
		div.c4g_grid_66_33 > div:first-child{width:100%;}
	/*Inline Bilder: ab jetzt max. breit und durch display:block alleinstehend in ihrer Zeile*/
	.content_container img.bild_links, .content_container img.bild_rechts{
		float:none;
		max-width:100%;
		display:block;
		margin-left:0;
		margin-right:0;
		margin-bottom:15px;
	}
	/*Allgemeine Sonder-Regel, die beim Setzen der Zusatzklasse .c4g_final_2 ab hier bei einem zweispaltigen Grid endet.
	Dies wird z.B. für Thumbnailgalerien oder Logo Grids verwendet, die auch auf einem Handy (320, zweispaltig) noch gut lesbar/klickbar sind.*/
	div.c4g_final_2[class*=c4g_grid_] > div{
		width:50%;
		clear:none;
		border-top-style:solid;
	}
		div.c4g_final_2[class*=c4g_grid_] > div:nth-child(1), div.c4g_final_2[class*=c4g_grid_] > div:nth-child(2){
			border-top-style:none;
		}
		div.c4g_final_2[class*=c4g_grid_] > div:nth-child(2n-1){
			clear:left;
		}
	/*=== fbox_2 ===*/
	/*ALLE Elemente über volle Breite floaten.*/
	.fbox_2 .box_img{
		margin-right:0;
		margin-bottom:15px;
	}
		.fbox_2 .box_img, .fbox_2 .box_head, .fbox_2 .box_body, .fbox_2 .box_link{
			width:100% !important;
			float:left !important;
			clear:both !important;
		}
		.fbox_2 ul > li{
			/*Darstellung wurde vorher auf display:table geschaltet für Umfließen. Jetzt wieder zurücksetzen.*/
			display:list-item;
		}

	.hpad_1{padding-left:10px;padding-right:10px;}
	.vpad_1{padding-top:10px;padding-bottom:10px;}


	/*=== Layout ===*/
	.top_logo{
		margin-left:-5px;
	}
	.top_fbar{
		margin-left:-10px;
		margin-right:-10px;
	}
}


/*--- unterhalb von großen Smartphones Hochformat (Galaxy SIII (360px), iPhone6 (375px), und Ähnliche) ---*/
@media screen and (max-width:350px){
}

/*--- Minimale Layoutbreite: Smartphone hoch bis 320px, typisch iPhone5 und älter und andere Ältere im Hochformat ---*/
@media screen and (max-width:320px){
}






/*--- Container Formate ----*/
fieldset{
	border:none;
	padding:0px;
	margin:0px;
}
.box_headline_1 *, .box_headline_2 *{
	margin:0;
	padding:0;
}
.box_headline_1{
	color:white;
	background-color:rgb(169,14,14);
	text-align:left;
	font-size:1em;
	font-weight:bold;
	margin:0;
	padding:6px 0 7px 9px;
}
.box_headline_2{
	color:white;
	background-color:rgb(205,131,26);
	text-align:left;
	font-size:1em;
	font-weight:bold;
	margin:0;
	padding:6px 0 7px 9px;
}




/*Hilfsklassen*/
.clearboth{
	float:none;
	clear:both;
}
.displaynone{
	display:none;
}


/*=== cms4d Module ===*/
.cms4dmodul_2_teaser_modulcontainer, .cms4dmodul_3_teaser_modulcontainer{
	padding:0px;
	width:420px;
	float:right;
	margin-left:40px;
}
.cms4dmodul_2_teaser_modulcontainer ul, .cms4dmodul_2_teaser_modulcontainer li, .cms4dmodul_3_teaser_modulcontainer ul, .cms4dmodul_3_teaser_modulcontainer li{
	list-style:none;
	float:left;
	margin:0;
	padding:0;
	width:420px;
	
}
.cms4dmodul_2_teaser_modulbodycontainer, .cms4dmodul_3_teaser_modulbodycontainer{
	padding:0px;
	width:420px;
}
.cms4dmodul_2_teaser_modulbodycontainer ul li, .cms4dmodul_3_teaser_modulbodycontainer ul li{
	background-image:none;
	margin:0;
	padding:0;

}

.cms4dmodul_2_teaser_headline, .cms4dmodul_3_teaser_headline{
	color:rgb(136,119,96);
}

.cms4dmodul_2_liste_modulbodycontainer .news_liste_hr, .cms4dmodul_3_liste_modulbodycontainer .news_liste_hr{
}


/*---------------------------*/

.cms4dmodul_2_liste_modulcontainer, .cms4dmodul_3_liste_modulcontainer{
	margin-bottom:0px;
}
.cms4dmodul_2_liste_modulcontainer ul, .cms4dmodul_2_liste_modulcontainer li{
	margin:0;
	padding:0;
}
.cms4dmodul_3_liste_modulcontainer ul, .cms4dmodul_3_liste_modulcontainer li{
	list-style:none;
	margin:0;
	padding:0;
}
.cms4dmodul_2_liste_modulbodycontainer{
	margin:0;
	padding:0;
}
.cms4dmodul_3_liste_modulbodycontainer{
	background-color:transparent;
	padding:0px;
}
.cms4dmodul_2_liste_modulbodycontainer ul li, .cms4dmodul_3_liste_modulbodycontainer ul li{
	background-image:none;
	margin:0;
	padding:0;
}

.cms4dmodul_2_liste_headline, .cms4dmodul_3_liste_headline{
	font-size:1.5em;
	border-bottom:1px solid #CCCCCC;
	padding-bottom:0.5em;
	margin-bottom:0;
}

.cms4dmodul_2_liste_modulbodycontainer .news_liste_hr, .cms4dmodul_3_liste_modulbodycontainer .news_liste_hr{
	border-top:1px solid white;
}

.cms4dmodul_2_liste_modulbodycontainer h2, .cms4dmodul_3_liste_modulbodycontainer .news_liste_hr{
	border-top:1px solid white;
}





/*htmlfragment_teaser*/
.htmlfragment_teaser
{
    
}
.html_teaser p{
	margin:0 0 0.5em 0;
}
.html_teaser_hr{
	border-top:1px dashed rgb(153,153,153);
	height:1em;
	margin-top:1em;
	clear:both;
}

.news_teaser{
	float:left;
	border-top:1px solid #E5DDC9;
	padding-top:1em;
	margin-bottom:1.2em;
	width:420px;
	font-size:0.9em;
}

.news_teaser h4{
	font-size:1.35em;
}
.news_teaser h4 a, .news_teaser h4 a:hover{
	color:rgb(179,157,107);
	text-decoration:none;
}

.news_teaser_date{
	font-weight:bold;
	font-size:1em;
}
.news_teaser_lnk{
	font-weight:bold;
}
.news_teaser .data_img_container{
	width:220px;
	overflow:hidden;
}
.news_teaser .data_img{
	border:none;
	margin-bottom:0.75em;
}

.news_teaser ul{
	list-style:none;
	margin:0;
	padding:0;
}
.news_teaser ul ul{
	list-style:none;
	margin:0 0 0 9px;
	padding:0;
}
.news_teaser ul li{
	padding:0;
	margin:0 0 0 -8px;
}

.news_teaser p{
	line-height:1.2em;
	padding:0;
	margin-bottom:0.6em;
}
.news_teaser p a, .news_teaser p a:hover{
	color:rgb(110,92,67);
	text-decoration:none;
}





/*=== Info Box 1, cms4dmodul -1 ===*/
/*für alle*/
.ibox_1_1 .body, .ibox_1_2 .body, .ibox_2_1 .body, .ibox_2_2 .body{
	border:1px solid #B0BCC4;
	background-color:#E9ECEF;
	padding:9px 9px 0 9px;
}
.ibox_1_1 img, .ibox_1_2 img, .ibox_2_1 img, .ibox_2_2 img{
	border:1px solid #B0BCC4;
	width:120px;
	height:90px;
	overflow:hidden;
	background-color:white;
}
/*Extraklasse für Modul-Container DIV, für kleinere Texte*/
.smalltext .body{
	font-size:9px;
}
.smalltext .ltable .td_left{
	padding-right:9px;
}

@media all{
	/*Die beiden Stile für ibox_1_1 sind bis auf die Überschrift (Farbe) identisch*/
	.cms4dmodul_-1_1_modulcontainer{
		margin-bottom:15px;
	}
	.ibox_1_1, .ibox_1_2{
	}
	.ibox_1_1_body_container{
	}
	.ibox_1_1 a, .ibox_1_2 a{
		color:black;
	}
	.ibox_1_1 a:hover, .ibox_1_2 a:hover{
	}
	.ibox_1_1 a.lnk_href, .ibox_1_2 a.lnk_href{
		color:rgb(153,0,102);
		font-weight:bold;
	}
	.ibox_1_1 .h_txt{
		color:black;
		font-size:1.2em;
		margin:0 0 0.5em 0;
		padding:0;
	}
	.ibox_1_2 .h_txt{
		color:black;
		font-size:1.2em;
		margin:0 0 0.5em 0;
		padding:0;
	}
	.ibox_1_1 a.h_txt, .ibox_1_2 a.h_txt{
		border:none;
		background-color:transparent;
		background-image:none;
		margin:0;
		padding:0;
		font-size:1em;
	}
	.ibox_1_1 .s_txt, .ibox_1_2 .s_txt{
		font-size:9px;
	}
	.ibox_1_1 .i_txt{
	}
	.ibox_1_1 .b_txt{
	}
	.ibox_1_1 .ltable, .ibox_1_1 .ltable{
		width:100%;
	}
	.ibox_1_1 .td_left, .ibox_1_2 .td_left{
		padding:0 15px 9px 0;
 	}
	.ibox_1_1 .td_right, .ibox_1_2 .td_right{
		width:100%;
 	}




	.cms4dmodul_-1_2_modulcontainer{
		margin-bottom:15px;
	}
	.ibox_2_1{
	}
	.ibox_2_1_body_container{
	}
	.ibox_2_1 a, .ibox_2_2 a{
		color:black;
	}
	.ibox_2_1 a:hover, .ibox_2_2 a:hover{
	}
	.ibox_2_1 a.lnk_href, .ibox_2_2 a.lnk_href{
		color:rgb(153,0,102);
		font-weight:bold;
	}
	.ibox_2_1 .h_txt{
		border-left:8px solid rgb(153,0,102);
		border-top:1px solid rgb(204,204,204);
		border-right:1px solid rgb(153,153,153);
		border-bottom:1px solid rgb(153,153,153);
		color:rgb(0,0,0);
		font-size:1em;
		margin:0;
		/*padding:5px 9px 7px 7px;*/
		padding:4px 9px 6px 7px;
		background-color:rgb(204,204,204);
		background-image:url(images-wd/box-headline-bg-hellgrau.gif);
		background-repeat:repeat-x;
	}
	.ibox_2_2 .h_txt{
		border-top:1px solid rgb(184,77,148);
		border-bottom:1px solid rgb(153,0,102);
		color:white;
		font-size:1em;
		margin:0;
		/*padding:5px 9px 7px 9px;*/
		padding:4px 9px 6px 9px;
		background-color:rgb(153,0,102);
		background-image:url(images-wd/box-headline-bg-violett.gif);
		background-repeat:repeat-x;
	}
	.ibox_2_1 a.h_txt, .ibox_2_2 a.h_txt{
		border:none;
		background-color:transparent;
		background-image:none;
		margin:0;
		padding:0;
	}
	.ibox_2_1_image_container, .ibox_2_2_image_container{
		margin-bottom:1em;
	}
	.ibox_2_1 .s_txt, .ibox_2_2 .s_txt{
		font-size:9px;
	}
	.ibox_2_1 .i_txt{
	}
	.ibox_2_1 .b_txt{
	}
}



/*--- Bildergalerie ---*/
.bildergalerie_container{
	margin-bottom:30px;
	width:100%;
	float:left;
}
.img_register{
	margin:0 0 1em 0;
}
.img_register .but_fwd_back{
	color:black;
	border:1px solid #D2D2D2;
	background-color:#EAEAEA;
	font-weight:bold;
	text-decoration:none;
	padding:1px 4px 2px 4px;
	margin-right:4px;
	float:left;
}
.img_register .but_fwd_back:hover{
	color:white;
	background-color:#AA8345;
	text-decoration:none;
}

.img_register .but_fwd_back_on{
	color:white;
	border:1px solid #D2D2D2;
	background-color:#AA8345;
	font-weight:bold;
	text-decoration:none;
	padding:1px 4px 2px 4px;
	margin-right:4px;
	float:left;
}

.bildergalerie_liste{
	width:100%;
	float:left;
	padding:0px;
	margin:0 auto;
}

.bildergalerie_liste .thumb_container{
	width:100px;
	height:100px;
	overflow:hidden;
	float:left;
	border:1px solid #7D8A80;
	margin-right:10px;
	margin-bottom:10px;
}
.bildergalerie_liste .thumb_container img{
	width:100px;
	height:100px;
	min-width:100px;
	min-height:100px;
	max-width:100px;
	max-height:100px;
	border:none;
}


/*--- Platzhalter Bildergalerien ---*/
.bildergalerie1{
	width:100%;
	float:left;
}
.bildergalerie1 .galerie_content{
	width:100%;
	float:left;
	max-height:315px;
	overflow:hidden;
}

	.bildergalerie1 .galerie_content .big{
		float:left;
		width:50%;
	}
		.bildergalerie1 .galerie_content .big img{
			width:100%;
			max-width:430px;
		}

	.bildergalerie1 .galerie_content .thumb{
		float:left;
		width:50%;
		height:150px;
	}
		.bildergalerie1 .galerie_content .thumb img{
			width:47%;
			margin:0px 0px 3% 3%;
			float:left;
		}
		.bildergalerie1 .galerie_content .thumb a:nth-child(3) img{
			margin-bottom:0;
		}
		.bildergalerie1 .galerie_content .thumb a:nth-child(4) img{
			margin-bottom:0;
		}

	.bildergalerie1 .thumb2{
		display:none;
		float:left;
		width:100%;
		margin-top:1.5%;
		padding:10px 0px 0px 12px;
		background-color:#F0F0EE;
		border-radius:5px;

		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
		.bildergalerie1 .thumb2 img{
			width:82px;
			height:46px;
			float:left;
			margin:0 10px 10px 0px;
			border:1px solid rgb(190,190,190);
			border-radius:2px;
		}


@media screen and (max-width:470px){

	.bildergalerie1 .galerie_content{
		max-height:none;
		overflow:visible;
	}
		.bildergalerie1 .galerie_content .big{
			width:100%;
			margin-bottom:2%;
		}
		.bildergalerie1 .galerie_content .thumb{
			width:100%;
			height:auto;
		}
			.bildergalerie1 .galerie_content .thumb img{
				width:49%;
				margin:0 2% 2% 0;
			}
			.bildergalerie1 .galerie_content .thumb a:nth-child(2) img{
				margin-right:0;
			}
			.bildergalerie1 .galerie_content .thumb a:nth-child(4) img{
				margin-right:0;
			}

	.bildergalerie1 .thumb2{
		margin-top:0.5%;
	}
}


.bildergalerie2{
	width:100%;
	float:left;
}
.bildergalerie2 .galerie_content{
	width:100%;
	float:left;
	max-height:315px;
	overflow:hidden;
}

	.bildergalerie2 .galerie_content .thumb{
		float:left;
		width:50%;
	}
		.bildergalerie2 .galerie_content .thumb img{
			width:47%;
			margin:0 3% 3% 0;
			float:left;
		}


@media screen and (max-width:470px){

	.bildergalerie2 .galerie_content{
		max-height:none;
		overflow:visible;
	}
		.bildergalerie2 .galerie_content .thumb{
			width:100%;
			height:auto;
		}
			.bildergalerie2 .galerie_content .thumb img{
				width:49%;
				margin:0 2% 2% 0;
			}
			.bildergalerie2 .galerie_content .thumb a:nth-child(2) img{
				margin-right:0;
			}
			.bildergalerie2 .galerie_content .thumb a:nth-child(4) img{
				margin-right:0;
			}
}



/*--- Event Liste/Details ---*/
.event_register{
	width:100%;
	float:left;
}
.event_register a, .event_register a:hover{
	color:white;
	border:1px solid #224191;
	background-color:#6C8DC5;
	padding:4px 4px 4px 4px;
	margin-right:4px;
	float:left;
	text-decoration:none;
	font-size:0.9em;
	border-radius:5px;

	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.event_register .year_buttons{
	float:left;
	clear:both;
	margin-bottom:4px;
}
.event_register .year_buttons a:hover{
	color:white;
	background-color:#224191;
	text-decoration:none;
}
.event_register .but_y{
	background-color:#6C8DC5;
}
.event_register .act_year{
	border:1px solid #224191;
	color:white;
	background-color:#224191;
	font-weight:bold;
	padding:4px 8px 4px 8px;
	margin-right:2px;
	float:left;
	font-size:0.9em;
	border-radius:5px;
}

.event_register .month_buttons{
	clear:left;
}
.event_register .month_buttons a:hover{
	color:white;
	background-color:#224191;
	text-decoration:none;
}
.event_register .but_m{
	color:black;
	border:1px solid #224191;
	background-color:#E5F1FF;
	margin-bottom:4px;
}
.event_register .but_m_act{
	border:1px solid #224191;
	background-color:#6C8DC5;
	margin-bottom:4px;
}
.event_register .but_m_on{
	border:1px solid #224191;
	color:white;
	background-color:#476BB3;
	font-weight:bold;
	margin-bottom:4px;
}
.event_register .monat_name{
	margin:5px 0 0 0;
	font-weight:bold;
	padding-bottom:0.8em;
	border-bottom:1px solid #6C8DC5;
}

.event_liste{
	float:left;
	width:100%;
	margin-bottom:2em;
}
.event_liste ul{
	list-style:none;
	margin:0;
	padding:0;
}
.event_liste ul li{
	background-image:none;
	list-style:none;
	margin:15px 0 0 0;
	padding:0 0 5px 0;
	float:left;
	width:100%;
	clear:both;
	border-bottom:1px solid #6C8DC5;
}
.event_liste ul li:before{
	display:none;
}
.event_liste ul li:last-child{
	border-bottom:none;
}
.event_liste .content{
	float:left;
	width:100%;
}
.event_liste .headline{
}
.event_liste .headline a{
	color:#224191;
	text-decoration:none;
}
.event_liste .headline a:hover{
	color:#224191;
	text-decoration:none;
}

.event_liste .body_text{
	float:left;
	max-width:385px;
}

.event_liste .body_text_max{
	min-width:100%;
}

.event_liste .body_text a, .event_liste .body_text a:hover{
	color:rgb(51,51,102);
	text-decoration:none;
}

.event_liste .body_text p{
	margin-bottom:0.5em;
}

.event_liste_date{
	margin-bottom:0.5em;
	font-size:0.9em;
	font-weight:bold;
	color:black;
}

.event_liste .data_img_container{
	width:200px;
	overflow:hidden;
	float:left;
	margin-top:-5px;
	margin-right:15px;
	margin-bottom:10px;
}
.event_liste .data_img{
	border:none;
	margin-top:5px;
}
.event_liste .data_img_txt{
	font-size:9px;
}

.event_liste .event_liste_lnk{
	width:100%;
	float:left;
	clear:both;
	text-align:left;
	padding-top:0.9em;
	font-size:14px;
	position:relative;
	margin-bottom:0.5em;
}
	.event_liste .event_liste_lnk span{
		font-family:open_sans_semibold, Arial, Helvetica, sans-serif;
		display:inline-block;
	}
	.event_liste .event_liste_lnk span:after{
		content:'\e69d';
		display:inline-block;
		font-family:'fontawesome_icons';
		font-size:1.4em;
		color:#476BB3;
		padding-left:0.5em;
		position:relative;
		top:2px;
	}


@media screen and (max-width:1023px){
	.event_liste .data_img_container{
		max-width:37%;
		margin-right:3%;
	}
	.event_liste .body_text{
		max-width:60%;
	}
}
@media screen and (max-width:480px){
	.event_liste .data_img_container{
		width:100%;
		max-width:100%;
		margin-right:0;
	}
	.event_liste .body_text{
		width:100%;
		max-width:100%;
	}
}



/*--- News Liste/Details ---*/
.news_liste{
	float:left;
	width:100%;
	margin-bottom:2em;
}
.news_liste ul{
	list-style:none;
	margin:0;
	padding:0;
}
.news_liste ul li{
	background-image:none;
	list-style:none;
	margin:30px 0 0 0;
	padding:0 0 30px 0;
	float:left;
	width:100%;
	clear:both;
	border-bottom:1px solid #CCCCCC;
}
.news_liste ul li:before{
	display:none;
}
.news_liste ul li:last-child{
	border-bottom:none;
}
.news_liste .content{
	float:left;
	width:100%;
}

.news_liste .body_text{
	float:left;
	width:68%;
}
.news_liste .body_text_max{
	min-width:100%;
}
.news_liste .body_text a, .news_liste .body_text a:hover{
	text-decoration:none;
}
.news_liste .body_text p{
	margin-bottom:0.8em;
}
.news_liste .body_text p:last-child{
	float:left;
	margin-bottom:0em;
}

.news_liste .headline{
	font-size:1.2em;
	display:block;
}

.news_liste .headline a, .news_liste .headline a:hover{
	color:inherit;
	text-decoration:none;
	display:block;
}

.news_liste_date{
	margin-bottom:0.5em;
	font-size:0.9em;
	font-weight:bold;
	color:black;
}
.news_liste .data_img_container{
	width:200px;
	width:30%;
	overflow:hidden;
	float:left;
	margin-top:-5px;
	margin-right:15px;
	margin-bottom:10px;

	margin-right:2%;
}
.news_liste .data_img{
	border:none;
	margin-top:5px;
	border-radius:0px;
}
.news_liste .data_img_txt{
	font-size:9px;
}
.news_liste .body_text ul, .news_liste .body_text li{
	list-style:none;
	margin:0;
	padding:0;
	position:relative;
}
	.news_liste .body_text li{
		margin-top:0.5em;
		border:none;
	}
	.news_liste .body_text ul{
		margin:1.5em 0 1.5em 1.3em;
	}
	.news_liste .body_text ul ul{
		margin-top:0;
		margin-bottom:0;
	}
	.news_liste .body_text ul li:before{
		content:'\f111';
		font-family:'fontawesome';
		display:inline-block;
		position:relative;
		font-size:1em;
		left:-1.2em;
		margin-right:-0.9em;
		color:rgb(0,77,158);
	}

.news_liste .news_liste_lnk{
}
	.news_liste .news_liste_lnk span{
		margin-top:0.5em;
		color:white;
		background-color:#004D9E;
		display:inline-block;
		border-radius:5px;
		padding:0.15em 0.3em 0.15em 0.5em;
		font-family:roboto2014_condensed_regular, Arial, Helvetica, sans-serif;
		padding:0.12em 0.4em 0.18em 0.5em;
	}
		.news_liste .news_liste_lnk span:after{
			/*icon-caret-right*/
			content:'\f0da';
			font-family:fontawesome;
			display:inline-block;
			margin-left:0.5em;
		}


.news_details{
}
.news_details_date{
	margin-bottom:15px;
	font-weight:bold;
}

.news_details h2, .news_details h3, .news_details h4, .news_details h5, .news_details h6{
	clear:none;
}

.news_details address{
	margin:0 0 1em 0;
}
@media screen{
	.news_details_backlink_top{
		float:right;
		margin-bottom:0.5em;
	}
		.news_details_backlink_top span{
			font-size:1em;
			line-height:1em;
			color:white;
			background-color:#004D9E;
			display:inline-block;
			border-radius:5px;
			padding:5px 7px 5px 7px;
		}
		.news_details_backlink_top span:before{
			/*icon-caret-left*/
			content:'\f0d9';
			font-family:'fontawesome';
			margin-right:0.4em;
		}
}
@media print{
	.news_details_backlink_top{
		display:none;
	}
}

.news_details .data_img_container{
	float:right;
	width:auto;
	max-width:40%;
	margin:0px 0px 20px 20px;
	border:1px solid #224191;
	border:none;
	border-radius:10px;
	overflow:hidden;
	position:relative;
}
.news_details .data_img{
	width:100%;
}
.news_details .data_img a{
	display:block;
	position:relative;
	z-index:10;
}
.news_details .data_img img{
	border:none;
	width:100%;
}
.news_details .data_img_txt{
	font-size:0.8em;
	text-align:center;
	margin-top:1px;
}



@media screen and (max-width:1023px){
	.news_liste .data_img_container{
		max-width:34%;
		margin-right:3%;
	}
	.news_liste .body_text{
		max-width:63%;
	}
}
@media screen and (max-width:760px){
	.news_liste .data_img_container{
		max-width:28%;
		margin-right:3%;
	}
	.news_liste .body_text{
		max-width:69%;
	}
}
@media screen and (max-width:640px){
	.news_liste .data_img_container{
		max-width:35%;
		margin-right:3%;
	}
	.news_liste .body_text{
		max-width:62%;
	}
}
@media screen and (max-width:480px){
	.news_liste .data_img_container{
		width:100%;
		max-width:100%;
		margin-right:0;
	}
	.news_liste .body_text{
		width:100%;
		max-width:100%;
	}
	.news_details .data_img_container{
		width:100%;
		max-width:100%;
	}
}



/*--- News Liste Accordion ---*/
.accordion{
	float:left;
	width:100%;
}
.accordion ul{
	list-style:none;
	margin:0;
	padding:0;
	float:left;
}
.accordion ul li{
	background-image:none;
	list-style:none;
	float:left;
	clear:both;
	width:100%;
	margin:0 0 1em 0;
	padding:0;
}
.accordion ul li:before{
	display:none;
}

.accordion h2.head_close{
	font-family:open_sans_regular, Arial, 'Arial Unicode MS', Helvetica, sans-serif;
	margin:0;
	font-size:1em;
	font-weight:normal;
	background-color:#6C8DC5;
	padding:5px 10px 5px 10px;
	color:white;
	width:100%;
	cursor:pointer;
	border-radius:5px;

	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

.accordion h2.head_close:before{
	font-family:fontawesome_icons;
	content:'\e69d';
	font-size:28px;
	float:left;
	margin:6px 10px 4px 0px;
}

.accordion h2.head_open{
	font-family:open_sans_regular, Arial, 'Arial Unicode MS', Helvetica, sans-serif;
	margin:0;
	font-size:1em;
	font-weight:normal;
	background-color:#476BB3;
	padding:5px 10px 5px 10px;
	color:white;
	width:100%;
	cursor:pointer;
	border-radius:5px 5px 0px 0px;

	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

.accordion h2.head_open:before{
	font-family:fontawesome_icons;
	content:'\e69f';
	font-size:28px;
	float:left;
	margin:6px 10px 4px 0px;
}

.accordion .body{
	display:none;
	padding:12px 15px 1px 15px;
	background-color:#E5F1FF;
	border-radius:0px 0px 5px 5px;
}

.accordion .body p{
	margin-bottom:1em;
}

.accordion .body a{
	color:#224191;
	font-weight:bold;
}



/*--- HTML-Fragment Liste ---*/
.htmlfragment_liste{
	background-image:none;
	background-color:transparent;
	border:none;
	margin:0px;
	padding:0px;
}
.htmlfragment_liste ul{
	margin:0px;
	padding:0px;
	list-style:none;
	background-image:none;
	background-color:transparent;
}
.htmlfragment_liste ul li{
	margin:0 0 0px 0;
	padding:0;
	background-image:none;
	background-color:transparent;
}

.htmlfragment_liste ul ul{
	/*aus optischen Gründen 1px weiter nach rechts für die erste UL*/
	margin:1em 0 1em 13px;
	padding:0;
	list-style:none;
}
.htmlfragment_liste ul ul li{
	padding:0 0 0 17px;
	margin:0 0 0.2em -12px;
	background-image:url(images-wd/li-bullet.gif);
	background-repeat:no-repeat;
	background-position:0 6px;
}

.htmlfragment_liste ul ul ul{
	margin:1em 0 0 17px;
}



/*=== Sitemap ===*/
@media screen, projection{
	.sitemap{
		line-height:normal;
	}

	.sitemap a{
		color:black;
	}

	.sitemap a:hover{

	}
	.sitemap ul li{
		font-weight:bold;
		margin-bottom:1.5em;
	}
	.sitemap ul li a{
		color:rgb(102,102,102);
	}
	.sitemap ul li ul li{
		font-weight:normal;
		margin-bottom:0.5em;

	}
}
@media print{
}



/*--- Paging-Buttons ---*/
.paging_bt1{
	cursor:pointer;
	border:1px solid black;
	background-color:#528DCC;
	color:white;
	font-size:18px;
	font-weight:bold;
	text-decoration:none;
	border:1px solid #004D9E;
	border-radius:3px;
}
.paging_bt1:hover{
	text-decoration:none;
}

.paging_bt2{
	cursor:pointer;
	border:1px solid black;
	background-color:#004D9E;
	color:white;
	font-size:18px;
	font-weight:bold;
	text-decoration:none;
	border:1px solid #004D9E;
	border-radius:3px;
}
.paging_bt2:hover{
	text-decoration:none;
}







/*--- Suche ---*/
.suche_container{
	position:absolute;
	top:0px;
	right:0px;
	background-color:#5987BF;
	height:40px;
	width:0px;
	overflow:hidden;
	border-top-left-radius:10px;
	border-bottom-left-radius:10px;
}

.suche_container:before{
	/*icon-search*/
	content:'\e600';
	font-family:fontawesome_icons;
	font-size:26px;
	line-height:26px;
	display:block;
	padding-bottom:2px;
	padding-top:8px;
	padding-left:8px;
	/*ab IE10+*/
	text-shadow:2px 2px 2px rgba(0,0,0,0.2);
}


.suche{
	position:absolute;
	top:6px;
	left:45px;
	width:145px;
	overflow:hidden;
	float:left;
	padding:0;
	margin:0;
}
.suche_eingabe{
	width:110px;
	border:1px solid white;
	border-radius:5px;
	font-size:14px;
	padding:4px;
}
.suche_button{
	width:28px;
	height:28px;
	border:1px solid #094A98;
	border-radius:5px;
	background-color:#094A98;
	background-image:url(images-wd/icon-lupe.png);
	background-repeat:no-repeat;
	background-position:center center;
	margin-left:6px;
	cursor:pointer;
}







/*--- Formularfelder ---*/
.ft1{
	font-family:open_sans_regular, Arial, "Arial Unicode MS", Helvetica, sans-serif;
	color:black;
	font-size:14px;
	width:220px;
	background-color:#F4F4F4;
	border:1px solid #94A397;
	border-radius:5px;
	padding:6px;
}
.ft1:focus{
	background-color:#F0F0F0;
}

.ft2{
	font-family:open_sans_regular, Arial, "Arial Unicode MS", Helvetica, sans-serif;
	color:black;
	font-size:14px;
	width:50px;
	background-color:#F4F4F4;
	border:1px solid #94A397;
	border-radius:5px;
	padding:6px;
}
.ft2:focus{
	background-color:#F0F0F0;
}

.ft3{
	font-family:open_sans_regular, Arial, "Arial Unicode MS", Helvetica, sans-serif;
	color:black;
	font-size:14px;
	width:90%;
	max-width:520px;
	background-color:#F4F4F4;
	border:1px solid #94A397;
	border-radius:5px;
	padding:6px;
}
.ft3:focus{
	background-color:#F0F0F0;
}


.ta1{
	font-family:open_sans_regular, Arial, "Arial Unicode MS", Helvetica, sans-serif;
	color:black;
	font-size:14px;
	width:90%;
	max-width:525px;
	height:152px;
	background-color:#F4F4F4;
	border:1px solid #94A397;
	border-radius:5px;
	padding:4px;
}

.ta1:focus{
	background-color:#F0F0F0;
}


.fs1{
	font-family:open_sans_regular, Arial, "Arial Unicode MS", Helvetica, sans-serif;
	color:black;
	font-size:14px;
	background-color:white;
	border:1px solid #DDDDDD;
	border-radius:5px;
	padding:4px;
	max-width:100%;
	width:auto;
}


.bt1{
	color:white;
	border:1px solid rgb(0,77,158);
	background-color:rgb(0,77,158);
	font-family:roboto2014_regular, Arial, "Arial Unicode MS", Helvetica, sans-serif;
	display:inline-block;
	text-align:left;
	font-size:1.3em;
	line-height:1.2em;
	border-radius:5px;
	padding:6px 16px 7px 16px;
	margin-top:2px;
	cursor:pointer;
}


.bt1_dummy{
	line-height:1.2em;
	border-radius:5px;
	font-size:1.3em;
	line-height:1.4em;
	padding:6px 16px 7px 16px;
	margin-top:0px;
	position:relative;
	font-family:roboto2014_regular, Arial, "Arial Unicode MS", Helvetica, sans-serif;
	color:rgb(0,77,158);
	border:1px solid rgb(198,199,197);
	border-top-color:rgb(211,211,209);
	display:none;
}
	.bt1_dummy img{
		width:24px;
		float:left;
		margin:5px 5px 0px 0px;
	}


.bt2{
	color:white;
	background-color:#94A397;
	border:1px solid #94A397;
	display:inline-block;
	text-align:left;
	font-size:1em;
	line-height:1.2em;
	border-radius:5px;
	padding:3px 10px 4px 10px;
	margin-top:2px;
}


.bt_upload{
	color:white;
	border:1px solid #94A397;
	background-color:#94A397;
	font-family:roboto2014_regular, Arial, "Arial Unicode MS", Helvetica, sans-serif;
	display:inline-block;
	text-align:left;
	font-size:1.0em;
	line-height:1.2em;
	border-radius:5px;
	padding:6px 11px 6px 11px;
	margin-top:2px;
	cursor:pointer;
}
	.bt_upload:after{
		font-family:fontawesome;
		content:'\f055';
		font-size:1.2em;
		margin-left:10px;
		margin-top:0px;
		float:right;
	}
	.bt_upload_minus{
		border-bottom-left-radius:0px;
		border-bottom-right-radius:0px;
	}
	.bt_upload_minus:after{
		content:'\f13a';
	}



.hidden_formfield{
	position:absolute;
	top:-9999px;
	left:-9999px;
}
.checkbox{
	cursor:default;
}
.checkbox:before{
	content:'\f096';
	font-family:fontawesome;
	margin-right:8px;
	margin-left:2px;
}
input[type=checkbox]:checked ~ .checkbox:before{
	content:'\f046';
	margin-right:5px;
}





/*--- Artikel Liste ---*/
.artikel_liste{
	width:100%;
	float:left;
}

.artikel .row{
	float:left;
	width:100%;
	margin-bottom:1em;
}

	.artikel_liste_headline{
		font-size:1.1em;
		color:black;
	}


	.artikel .artikel_detail_img{
		float:left;
		width:100%;
		background-color:#004D9E;
		background-color:transparent;
		border-radius:5px;
		overflow:hidden;
		padding:5px 20px 0px 0px;

		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
		.artikel .artikel_detail_img .img{
			float:left;
			margin-right:0%;
			padding:0px;
			width:50%;
		}
			.artikel .artikel_detail_img .img img{
				border:1px solid #004D9E;
				border-radius:5px;
				width:100%;

				-webkit-box-sizing:border-box;
				-moz-box-sizing:border-box;
				box-sizing:border-box;
			}
		.artikel .artikel_detail_img .info{
			float:left;
			color:white;
			color:#004D9E;
			font-family:roboto2014_medium, Arial, "Arial Unicode MS", Helvetica, sans-serif;
			width:50%;

			padding:5px 0px 0px 20px;

			-webkit-box-sizing:border-box;
			-moz-box-sizing:border-box;
			box-sizing:border-box;
		}

.artikel .detail{
	font-weight:bold;
}
	.artikel .detail span{
		text-transform:uppercase;
	}


.tbl1_artikel{

	width:100%;
	border-collapse:collapse;

	empty-cells:show;

	font-size:1em;
	margin:1em 0 1em 0;

}

	.tbl1_artikel tr{
		background-color:#E5EDF5;
	}

	.tbl1_artikel td{
		padding:15px;
		word-wrap:break-word;

		vertical-align:center;

		border-bottom:1px solid #004D9E;
	}

	.tbl1_artikel p{

		padding:0;

		margin:0;

		line-height:inherit;

	}

	.tbl1_artikel tr:first-child{
		background-color:#004D9E;
		color:white;
		border-bottom:none;
	}
	.tbl1_artikel tr+tr:hover{
		cursor:pointer;
		background-color:#B8D0E8;
	}

.tb1_artikel_small td{
	padding:5px;
	width:40px;
}
.tb1_artikel_small td+td{
	width:auto;
}





@media screen and (max-width:640px){
	.tbl1_artikel{

		font-size:0.9em;
	}

	.tbl1_artikel td{
		padding:5px;
	}
	.tb1_artikel_small td{
		font-size:0.8em;
	}

	.artikel .artikel_detail_img .info{
		font-size:0.8em;
	}
}
@media screen and (max-width:480px){
	.artikel .artikel_detail_img .info{
		font-size:0.9em;
	}

	.tbl1_artikel{

		font-size:0.7em;
	}

	.tbl1_artikel td{
		padding:2px;
	}


	.artikel .artikel_detail_img{
		padding:0px;
	}
	.artikel .artikel_detail_img .img{
		width:100%;
	}
	.artikel .artikel_detail_img .info{
		width:100%;
		padding:10px 0 10px 0;
	}
	.artikel .artikel_detail_img .info{
		font-size:1em;
	}
}








/*--- Kundenspezifische Klassen für HTML-Editor ---*/

a.link_icon{
}
	a.link_icon,
	a.link_icon:hover{
		color:rgb(0,77,158);
		text-decoration:none;
	}
	a.weiss:hover{
		color:white;
	}
		/*Allgemein*/
		a.link_icon:before{
			content:'';
			font-family:fontawesome;
			margin-right:0.3em;
			display:none;
		}
		a.link_icon:after{
			/*icon-arrow-circle-right*/
			content:'\f0a9';
			font-family:fontawesome;
			margin-left:0.3em;
		}
		a.weiss{
			color:white;
		}
		/*Speziell*/
		a.link_icon.ansprechpartner:before{
			/*icon-user*/
			content:'\f007';
			display:inline-block;
		}
		a.link_icon.kontakt:before{
			/*icon-envelope*/
			content:'\f0e0';
			display:inline-block;
		}
			a.link_icon.kontakt:after{display:none;}
		a.link_icon.www:before{
			/*icon-globe*/
			content:'\f0ac';
			display:inline-block;
			margin-right:0.4em;
		}
			a.link_icon.www:after{display:none;}
		a.link_icon.pdf:before{
			/*icon-file-pdf-o*/
			content:'\f1c1';
			display:inline-block;
			margin-right:0.3em;
		}
			a.link_icon.pdf:after{display:none;}


.link_btn{
	color:white;
	background-color:#004D9E;
	display:inline-block;
	text-align:left;
	font-size:1em;
	line-height:1.2em;
	border-radius:5px;
	padding:9px 10px 10px 10px;
}
	.link_btn:after{
		/*icon-arrow-circle-right*/
		content:'\f0a9';
		font-family:fontawesome;
		display:inline-block;
		margin-left:0.3em;
		position:relative;
		bottom:-1px;
		font-size:1.2em;
	}
	a.link_btn, a.link_btn:hover{
		text-decoration:none;
	}

	/*Speziell*/
	a.link_btn.ansprechpartner:before{
		/*icon-user*/
		content:'\f007';
		font-family:fontawesome;
		margin-right:0.35em;
		display:inline-block;
	}
	a.link_btn.kontakt:before{
		/*icon-envelope*/
		content:'\f0e0';
		font-family:fontawesome;
		margin-right:0.35em;
		display:inline-block;
	}
	a.link_btn.www:before{
		/*icon-globe*/
		content:'\f0ac';
		font-family:fontawesome;
		margin-right:0.35em;
		display:inline-block;
	}
	a.link_btn.pdf:before{
		/*icon-file-pdf-o*/
		content:'\f1c1';
		font-family:fontawesome;
		margin-right:0.35em;
		display:inline-block;
	}



a.anfahrt{
	float:left;
	line-height:1.2em;
	font-size:0.95em;
	margin-right:30px;
	margin-bottom:20px;
}
	a.anfahrt,
	a.anfahrt:hover{
		color:white;
		text-decoration:none;
	}
	a.anfahrt:before{
		content:'\f041';
		font-family:fontawesome;
		margin-right:0.25em;
		font-size:40px;
		line-height:1em;
		float:left;
	}
	a.anfahrt:after{
		content:'\f0a9';
		font-family:fontawesome;
		margin-left:0.3em;
		display:none;
	}

a.impressum{
	float:left;
	margin:0px 20px 10px 0px;
	white-space:nowrap;
	display:inline-block;
}
	a.impressum,
	a.impressum:hover{
		color:white;
		text-decoration:none;
	}
	a.impressum:before{
		content:'\f15c';
		font-family:fontawesome;
		margin-right:0.25em;
		}
	a.impressum:after{
		content:'\f0a9';
		font-family:fontawesome;
		margin-left:0.3em;
	}

a.facebook{
	float:left;
	line-height:1.2em;
	font-size:0.95em;
	margin-bottom:20px;
}
	a.facebook,
	a.facebook:hover{
		color:white;
		text-decoration:none;
	}
	a.facebook:before{
		content:'\f082';
		font-family:fontawesome;
		margin-right:0.1em;
		font-size:40px;
		line-height:1em;
		float:left;
	}

a.bt_back_top{
	float:right;
	text-align:left;
	font-size:0.8em;
	position:relative;
	margin-top:0em;
	margin-bottom:0.5em;
	border-radius:5px;
	text-decoration:none;
	text-align:left;
	display:inline-block;
	padding:2px 8px 3px 9px;
	border-radius:5px;
	color:white;
	background-color:rgb(0,77,158);
	font-family:roboto2014_regular, Arial, "Arial Unicode MS", Helvetica, sans-serif;
}
	a.bt_back_top:before{
		content:'\f0d9';
		font-family:'fontawesome';
		padding-right:0.5em;
	}
	a.bt_back_top:hover{
		text-decoration:none;
	}

a.bt_forward_top{
	float:right;
	text-align:left;
	font-size:0.8em;
	position:relative;
	margin-top:0em;
	border-radius:5px;
	text-decoration:none;
	text-align:left;
	display:inline-block;
	padding:2px 8px 3px 9px;
	border-radius:5px;
	color:white;
	background-color:rgb(0,77,158);
	font-family:roboto2014_regular, Arial, "Arial Unicode MS", Helvetica, sans-serif;
}
	a.bt_forward_top:after{
		content:'\f0da';
		font-family:'fontawesome';
		padding-left:0.5em;
	}
	a.bt_forward_top:hover{
		text-decoration:none;
	}

div.telefon{
	font-size:1.4em;
	float:left;
	width:100%;
	font-weight:bold;
	margin-bottom:0.3em;
}
	div.telefon:before{
		content:'\f098';
		font-family:fontawesome;
		margin-right:0.1em;
		font-size:32px;
		float:left;
	}

div.email{
	font-size:1.4em;
	float:left;
	width:100%;
	font-weight:bold;
	margin-bottom:0.3em;
}
	div.email a:before{
		content:'\f0e0';
		font-family:fontawesome;
		margin-right:0.3em;
		font-size:28px;
		float:left;
	}



div.fax{
}
	div.fax:before{
		content:'\f1ac';
		font-family:fontawesome;
		margin-right:0.35em;
		font-size:0.95em;
	}



/*--- Tabellen ---*/

.tbl1{

	width:100%;
	border-collapse:collapse;

	empty-cells:show;

	font-size:1em;
	margin-bottom:30px;

}

	.tbl1, .tbl1 tr, .tbl1 td{
		background-color:#E5F1FF;
	}

	.tbl1 td{
		padding:15px;
		word-wrap:break-word;

		vertical-align:center;

		border-bottom:1px solid #6C8DC5;
	}

	.tbl1 p{

		padding:0;

		margin:0;

		line-height:inherit;

	}

	.tbl1 tr:first-child td{
		color:black;

		background-color:#6C8DC5;
		color:white;
		border-bottom:none;
	}
	.tbl1 tr:nth-child(2n+3) td{
	}

	.tbl1 tr+tr td{
		width:auto;

	}
	.tbl1 tr+tr td img{

		width:100%;
		max-width:150px;
	}

	.tbl1 tr+tr td+td{

		width:auto;
	}
	.tbl1 tr+tr td+td+td{
		width:auto;
	}


@media screen and (max-width:480px){
	.tbl1{

		font-size:0.9em;
	}

	.tbl1 td{
		padding:5px;
	}

}
@media screen and (max-width:400px){
	.tbl1{

		font-size:0.8em;
	}

	.tbl1 td{
		padding:4px;
	}

}


/*--- Bild-Container ---*/
.bildbox{
	border:1px solid rgb(148, 163, 151);
	padding:4px;
	font-size:0.8em;
	max-width:30%;
}
	.bildbox p{
		margin:0;
	}
	.bildbox img{
		width:100%;
		margin-bottom:2px;
	}
	.bildbox.bildbox_rechts{
		float:right;
		margin:0px 0px 15px 15px;
	}
	.bildbox.bildbox_links{
		float:left;
		margin:0px 15px 15px 0px;
	}
@media screen and (max-width:760px){
	.bildbox{
		max-width:40%;
	}
}
@media screen and (max-width:500px){
	.bildbox{
		max-width:100%;
		width:100%;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
		.bildbox.bildbox_rechts, .bildbox.bildbox_links{
			margin:1em 0 1em 0;
		}
}



/*--- GoogleMap ---*/
#gm_error{
	float:left;
	margin:25px 0px 5px 0px;
}
#map{
	margin-bottom:1em;
	border:1px solid #CCCCCC;
	height:400px;
	width:100%;
}
#map img{
	max-width:none;
}
#route{
	margin-left:0px;
	margin-bottom:1.5em;
}



/*--- JSSOR ---*/
.slider_close{
	cursor:pointer;
	position:relative;
	margin-left:30px;
}
	.slider_close img{
		width:36px;
		height:36px;
		position:absolute;
		top:0px;
		left:0px;
	}
	.slider_close:after{
		content:'\f00d';
		font-family:fontawesome;
		color:white;
		font-size:42px;
	}

.slider_expand{
	cursor:pointer;
	position:relative;
	margin-left:30px;
}
	.slider_expand img{
		width:36px;
		height:36px;
		position:absolute;
		top:0px;
		left:0px;
	}
	.slider_expand:after{
		content:'\f065';
		font-family:'fontawesome';
		color:white;
		font-size:42px;
	}

.slider_play{
	cursor:pointer;
	position:relative;
	margin-left:40px;
}
	.slider_play img{
		width:36px;
		height:36px;
		position:absolute;
		top:0px;
		left:0px;
	}
	.slider_play:after{
		content:'\f04b';
		font-family:fontawesome;
		color:white;
		font-size:42px;
	}

.slider_stop{
	cursor:pointer;
	position:relative;
	margin-left:40px;
}
	.slider_stop img{
		width:36px;
		height:36px;
		position:absolute;
		top:0px;
		left:0px;
	}
	.slider_stop:after{
		content:'\f04c';
		font-family:fontawesome;
		color:white;
		font-size:42px;
	}

.slider_index{
	position:relative;
	margin-left:30px;
	font-size:42px;
	color:white;
	font-family:'roboto_bold';
	font-family:'sourcesanspro_bold';
}


.slider_compress{
	cursor:pointer;
	position: fixed;
	top: 10px;
	right: 10px;
	text-shadow: 2px 2px 5px #000000;
}

	.slider_compress:after{
		content:'\f066';
		font-family:'fontawesome';
		color:white;
		font-size:42px;		
	}

@media screen and (max-width:1024px){
	body:after{
		content:'marker1';
		display:none;
	}
	.slider_close{
		margin-left:25px;
	}
		.slider_close img{
			width:30px;
			height:30px;
		}
		.slider_close:after{
			font-size:35px;
		}

	.slider_expand{
		margin-left:25px;
	}
		.slider_expand img{
			width:30px;
			height:30px;
		}
		.slider_expand:after{
			font-size:35px;
		}

	.slider_play{
		margin-left:33px;
	}
		.slider_play img{
			width:30px;
			height:30px;
		}
		.slider_play:after{
			font-size:35px;
		}

	.slider_stop{
		margin-left:33px;
	}
		.slider_stop img{
			width:30px;
			height:30px;
		}
		.slider_stop:after{
			font-size:35px;
		}

	.slider_index{
		margin-left:25px;
		font-size:35px;
	}
}

@media screen and (max-width:640px){
	body:after{
		content:'marker2';
		display:none;
	}
	.slider_close{
		margin-left:15px;
	}
		.slider_close img{
			width:18px;
			height:18px;
		}
		.slider_close:after{
			font-size:21px;
		}

	.slider_expand{
		margin-left:15px;
	}
		.slider_expand img{
			width:18px;
			height:18px;
		}
		.slider_expand:after{
			font-size:21px;
		}

	.slider_play{
		margin-left:20px;
	}
		.slider_play img{
			width:18px;
			height:18px;
		}
		.slider_play:after{
			font-size:21px;
		}

	.slider_stop{
		margin-left:20px;
	}
		.slider_stop img{
			width:18px;
			height:18px;
		}
		.slider_stop:after{
			font-size:21px;
		}

	.slider_index{
		margin-left:15px;
		font-size:21px;
	}	
}

#zoom_slider_content{
}


.jssorb13 div, .jssorb13 div:hover, .jssorb13 .av {
	background: url(../jssor/b02.png) no-repeat;
	overflow: hidden;
	cursor: pointer;
}

.jssorb13 div {
	background-position: -5px -5px;
}

.jssorb13 div:hover, .jssorb13 .av:hover {
	background-position: -35px -5px;
}

.jssorb13 .av {
	background-position: -65px -5px;
}

.jssorb13 .dn, .jssorb13 .dn:hover {
	background-position: -95px -5px;
}

.jssora20l, .jssora20r, .jssora20ldn, .jssora20rdn
{
	position: absolute;
	cursor: pointer;
	display: block;
	background: url(../jssor/a13.png) no-repeat;
	overflow:hidden;
}
.jssora20l { background-position: -3px -33px; }
.jssora20r { background-position: -63px -33px; }
.jssora20l:hover { background-position: -123px -33px; }
.jssora20r:hover { background-position: -183px -33px; }
.jssora20ldn { background-position: -243px -33px; }
.jssora20rdn { background-position: -303px -33px; }

@media screen and (max-width:939px){
	.jssora20l, .jssora20r, .jssora20ldn, .jssora20rdn{display:none}
}


