@import url(./exo.css);


/* Wysihtml5 Klassen */
.wysiwyg-float-left {float:left;}
.wysiwyg-float-right {float:right;}
.wysiwyg-font-size-large {font-size:1.2em;}
.wysiwyg-font-size-medium {font-size:1em;}
.wysiwyg-font-size-small {font-size:0.8em;}
.wysiwyg-text-align-center {text-align:center;}
.wysiwyg-text-align-justify {text-align:justify;}
.wysiwyg-text-align-left {text-align:left;}
.wysiwyg-text-align-right {text-align:right;}

.fore-color [data-wysihtml5-command-value="eins"]{background:#1a1a1a;}	
.fore-color [data-wysihtml5-command-value="zwei"]{background:#417e88;}	
.fore-color [data-wysihtml5-command-value="drei"]{background:#e95e0f;}	
.wysiwyg-color-eins {color:#1a1a1a;}
.wysiwyg-color-zwei {color:#417e88;}
.wysiwyg-color-drei {color:#e95e0f;}

/*

Orange: 						rgb(204, 94,  30);
Türkis: 						rgb(65, 126, 136);
Dunkelgrau: 				rgb(64, 64, 66);
Dunkel-Dunkelgrau: 	rgb(44, 44, 45);
Mittelgrau: 				rgb(155, 156, 158); (Kontaktfelder, Breadcrumbs)
Hellgrau: 					rgb(134, 135, 136);

*/

/* Maximale Bildgröße ist Breite des Elternelements */
img {max-width:100%;}

* {box-sizing:border-box;}


/* Formular Pflichtfelder Styling */
.input_pflicht, .email_pflicht, .spam_pflicht {
	border-color:red;
}

/* Responsive Iframes, zum Beispiel für Google Maps, Iframe benutzt immer ganze Spaltenbreite*/
.iframe_wrapper {
  position: relative;
  padding-bottom: 75%; 
  height: 0;
  overflow: hidden;
}

.iframe_wrapper iframe {
	position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
 
}

.mobilmenu_button {
	display:none;
	width:50px;
	height:50px;
	background-position:center center;
	background-repeat:no-repeat;
	background-image:url("images/mobilmenu.png");
	background-color:#e95e0f;
	position:absolute;
	top:40px;
	left:0px;
}

#banner_source {display:none;}


/* Breadcrumbs */
.breadcrumbs {
	background:#eceded;
}

/*google map smartie*/
.map{
	height:350px;
}


/* suchmodul klassen */
.suchergebnisse {}
.suchergebnisse .item {}
.suchergebnisse .titel {}
.suchergebnisse .titel a {font-weight:bold;}
.suchergebnisse .subtitel {}
.suchergebnisse .text {}

* {font-family:"Exo", sans-serif;
letter-spacing:1px;	
}

html {

	overflow-x:hidden;
}

body {
	
	margin:0;
	padding:0;
	overflow-x:hidden;

}
.mm-page {overflow-x:hidden;}
.ym-wrapper {
	position:relative;
	max-width:1250px;
	margin:0 auto;
}


.ym-gbox-left {padding:0 20px 0 0;}
.ym-gbox {padding:0 10px;}
.ym-gbox-right {padding:0 0 0 20px;}



	.effekt {
	 -webkit-perspective: 600px;
         perspective: 600px;
		-webkit-transform:scale(0.95);
		    -ms-transform:scale(0.95);
		        transform:scale(0.95);
		-webkit-perspective-origin:center;
   perspective-origin:center;
   margin:10px 0 10px  0;
   position:relative;
   left:-12px;
	}
	.effekt.effekt2 {left:6px;}
	.effekt span, .effekt a {
		 display:block;	
		-webkit-transform-origin:left center;
	  -ms-transform-origin:left center;
	  transform-origin:left center;
  	
  	-webkit-transform:rotateY(-10deg);
  	transform:rotateY(-10deg);
		
		-webkit-transition: -webkit-transform 0.7s ease;
		transition: transform 0.7s ease; 
		position:relative;
  	height:200px;
  	overflow:hidden;
  	display:block;
  	border:1px solid #000;
  	border-radius:20px;
  	outline:1px solid transparent;
	}
			
	.effekt.effekt2 span, .effekt.effekt2 a {
				-webkit-transform-origin:right center;
	  -ms-transform-origin:right center;
	  transform-origin:right center;
		
		-webkit-transform:rotateY(10deg);
  	transform:rotateY(10deg);
  	
  	
	}
	
	.aktuelles .effekt span:hover, .aktuelles .effekt a:hover {
		-webkit-transform:rotateY(0deg);
  	transform:rotateY(0deg);
  	overflow:hidden;
	}


.effekt3 {
		-webkit-perspective: 600px;
		        perspective: 600px;
		-webkit-transform:scale(1);
		    -ms-transform:scale(1);
		        transform:scale(1);
		-webkit-perspective-origin:center;
   perspective-origin:center;
   margin:30px 0 30px  0;
   
	}
	
	.effekt3 span, .effekt3 a {
		display:block;	
		-webkit-transform-origin:left center;
	  -ms-transform-origin:left center;
	  transform-origin:left center;
  	
  	-webkit-transform:rotateY(10deg);
  	transform:rotateY(10deg);
		
		border:1px solid #fff;
		border-radius:20px;
		position:relative;
		height:350px;
		overflow:hidden;
		outline:1px solid #transparent;
	}
			

	
	
	.rslides_haus {
		overflow:visible !important;	
	}
	
	.effekt3 img, .effekt img {
		float:none !important;
		
		width:100% !important;
		position:absolute;
		top:-100%;
		left:0;
		right:0;
		bottom:-100%;
		margin:auto;
		max-width:100%;
		border-radius:20px;
	
	}
			
	/*.effekt img{
		max-width:100%;
		border-radius:20px;	
		float:none !important;
		border:1px solid #fff !important;
		width:auto !important;

	}
	*/
	
	
	
header {position:relative;}

header .logoleiste {height:84px;position:relative;}
header .logoleiste .infomenu {position:absolute;top:5px;left:0px;}
header .logoleiste .infomenu a {padding-right:10px;color:rgb(155, 156, 158);text-decoration:none;text-transform:uppercase;font-size:13px;}
header .logoleiste .infomenu a:hover {text-decoration:underline;}

header .logoleiste .logo {position:absolute;right:0px;top:0px;z-index:1000;width:237px;}
header .logoleiste .logo img {display:block;max-width:none;float:right;}

header .logoleiste .logo:after {

	content:"";
	display:block;
	height:5px;
	width:100%;
	position:absolute;
	top:144px;
	right:0px;
	background:#e95e0f;
	
} 


nav {position:relative;background:rgb(64,64,66);font-size:14px;}


nav ul.level_1 {
	width:1009px;
	padding:0 75px 0 30px;
	
	
	position:relative;
	list-style:none;
	margin:0;
	height:60px;
	
	display:-webkit-box;
	display:-webkit-flex;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-pack:justify;
	-webkit-justify-content:space-between;
	-ms-flex-pack:justify;
	justify-content:space-between;
	
}

nav ul.level_1:after {
content:"";
display:block;
height:5px;
width:100%;
position:absolute;
bottom:-5px;
background:#417e88;
left:0px;
z-index:20;
}



nav ul.level_1 > li {
			-webkit-box-flex:0;
	-webkit-flex:0 1 auto;
	    -ms-flex:0 1 auto;
	        flex:0 1 auto;		
	float:left;
	position:relative;
	margin:0;
}




nav ul.level_1 > li > a {
	color:#fff;
	font-size:14px;
	font-weight:bold;
	display:block;
	text-align:center;
	line-height:60px;
	padding:0 20px;
	text-decoration:none;
}

nav ul.level_1 > li:hover:after,
nav ul.level_1 > li.active:after {
	content:"";
	display:block;
	height:5px;
	width:100%;
	position:absolute;
	bottom:-5px;
	background:#e95e0f;
	left:0px;
	z-index:2000;
}



nav ul.level_1 > li > .has_child {
	position:absolute;
	top:30px;
	margin-top:-3px;
		width: 0;
	height: 0;
	border-style: solid;
	border-width: 6px 5px 0 5px;
	border-color: #ffffff transparent transparent transparent;
	right:0px;
}


nav ul.level_2 {
	position:absolute;
	display:none;
	z-index:3000;
	border-top:5px solid #417e88;
	margin:0;
	list-style:none;
	background:rgb(64,64,66);
	width:200px;
}

nav li.active ul.level_2, nav li:hover ul.level_2 {border-top:5px solid #e95e0f;}
nav li:hover ul.level_2 {
	display:block;
	
}

nav ul.level_2 > li {
	margin:0;


}
nav ul.level_2 > li > a {
	display:block;
	line-height:60px;
	height:60px;
	display:block;
	text-align:center;
	color:#fff;
	text-decoration:none;	
		padding:0 5px;
	
}

nav ul.level_2 > li > a:hover {background:rgb(44, 44, 45);} 


.navigationsbild, .navigationsbild li {position:relative;max-width:1380px;margin:0 auto;overflow:hidden;height:350px}
.navigationsbild img {
	display:block;
	position:absolute;
	margin:auto;
	top:-100%;
	left:0;
	right:0;
	bottom:-100%;
	margin:auto;
	max-width:100%;
}





.banner {
	background:#e95e0f;
	color:#fff;
	padding:16px 30px;
	border-top:1px solid #fff;
	position:relative;
}

.banner ul li {margin:0;}

.banner_link {
	color:#fff;
	display:block;

	padding:5px;
	border:1px solid #fff;
	position:absolute;
	right:30px;
	top:14px;
	text-decoration:none;
	height:30px;
	width:30px;
	z-index:10000;
	text-align:center;
}

.banner_link:hover {
	color:#e95e0f;
	background:#fff;
}



.untermenu {padding:50px 0;position:relative;z-index:10000;}

.untermenu ul.level_1 {list-style:none;margin:0 0 0 20px;font-size:14px;}
.untermenu ul.level_1 > li {position:relative;margin:0 0 1em 0;}
.untermenu ul.level_1 > li > a {color:#1a1a1a;text-transform:uppercase;text-decoration:none;text-decoration:none;font-weight:bold;}

.untermenu ul.level_1 > li.active:before {
	content:">";
	color:#e95e0f;
	display:block;
	position:absolute;
	left:-13px;
	font-weight:bold;
	font-size:20px;
}


.untermenu ul.level_1 > li.current:before {
content:"";
left:-12px;
top:6px;
position:absolute;
width: 0;
height: 0;
border-style: solid;
border-width: 4px 0 4px 5px;
border-color: transparent transparent transparent #e95e0f;		
	
}
.untermenu ul.level_1 > li.active > a {}


.untermenu ul.level_2 {list-style:none;margin:0;}
.untermenu ul.level_2 > li {position:relative;margin:0;}
.untermenu ul.level_2 > li > a {color:#1a1a1a;text-transform:uppercase;text-decoration:none;text-decoration:none;}
.untermenu ul.level_2 > li.current:before {
	content:"";
	left:-12px;
	top:6px;
position:absolute;
width: 0;
height: 0;
border-style: solid;
border-width: 4px 0 4px 5px;
border-color: transparent transparent transparent #e95e0f;	
	
}
.untermenu ul.level_2 > li.active > a {}




.navigationsbild_klein {position:relative;}
.navigationsbild_klein .wrapper {
	padding:0px 30px 0px 0px;
	width:114%;	
}

.navigationsbild_klein .wrapper .rslides li {margin:0px;padding:0px;}

.navigationsbild .rslides_nav.prev {
	position: absolute;
	left: 20px;
	color: #fff;
	border:2px solid #fff;
	height:32px;
	width:32px;
	display:block;
	text-align:center;
	padding:4px;
	text-decoration:none;
	top:50%;
	margin:-16px 0 0 0;
	z-index:1000;
}


.navigationsbild_klein .rslides_nav.prev {
	position: absolute;
	left: -50px;
	color: rgb(155, 156, 158);
	border:2px solid rgb(155,156,158);
	height:32px;
	width:32px;
	display:block;
	text-align:center;
	padding:4px;
	text-decoration:none;
	top:50%;
	margin:-16px 0 0 0;
}

.navigationsbild .rslides_nav.next {
	position: absolute;
	right: 20px;
	color: #fff;
	border:2px solid #fff;
	height:32px;
	width:32px;
	display:block;
	text-align:center;
	padding:4px;
	text-decoration:none;
	top:50%;
	margin:-16px 0 0 0;
	z-index:10000;
}

.navigationsbild_klein .rslides_nav.next {
	position: absolute;
	right: 0px;
	color: rgb(155, 156, 158);
	border:2px solid rgb(155,156,158);
	height:32px;
	width:32px;
	display:block;
	text-align:center;
	padding:4px;
	text-decoration:none;
	top:50%;
	margin:-16px 0 0 0;
	z-index:10000;
}

main {
	padding:40px;
	color:#1A1A1A;
	font-size:15px;
}
main a{color:#1a1a1a;}


footer {
	background:rgb(64, 64, 66);
	border-bottom:50px solid	rgb(44, 44, 45);
	padding:20px 0 50px 0;
	color:#fff;
	font-size:12px;
	max-width:1380px;
	margin:0 auto;
}
footer a {color:#fff;text-decoration:none;}

footer h3 {
	color:#fff;	
	position:relative;
	text-transform:uppercase;
	padding:15px 0 10px;
	
}
footer h3:before {
	display:block;
	content:"";
	background:	#417e88;
	height:5px;
	width:100px;
	position:absolute;
	top:0px;
	left:0px;
}



form.form {padding:20px 30px 20px 0;}

form.form .halb {
	float:left;
	width:50%;
	border:4px solid rgba(0,0,0,0);
}

form.form .ganz {
	border:4px solid rgba(0,0,0,0);
	float:left;
	width:100%;
}

form.form input[type="text"] {
	padding:8px 5px;
	background:rgb(155, 156, 158);
	color:#fff;
	width:100%;
	border:0;
	height:45px;
}

form.form textarea {
	padding:5px;
	width:100%;
	height:75px;
	background:rgb(155, 156, 158);
	color:#fff;
	border:0;
}



form.form input[type="submit"] {
	background:#e95e0f;
	color:#fff;
	
	display:block;
	width:100px;
	text-align:center;
	margin:0 auto;
	border:4px solid rgba(0,0,0,0);
	padding:8px 5px;
}



form.form ::-webkit-input-placeholder {color:#fff;}
form.form :-moz-placeholder {color:#fff;}
form.form ::-moz-placeholder {color:#fff;}
form.form :-ms-input-placeholder {color:#fff;}

.form_padding {padding:0.5em 0;}

.artikel {font-size:13px;padding:30px 0px;}
.artikel a, .artikel h4 {
	text-decoration:none;
	color:#1a1a1a;
	font-weight:bold;
	text-transform:uppercase;
}

footer .referenzen .image{
	float:left;
	width:90px;
	margin:0 6px 6px 0; 	
	height:90px;
	overflow:hidden;
}
footer .referenzen img{
	display:block;
	min-width:120px;
	max-width:200px;
}

.dateiliste, .dateiliste li {list-style:none;margin:0;}

.galerie {padding-bottom:2em;}
.galerie a.klein {height:70px;max-width:25%;padding:4px;float:left;overflow:hidden;}

.galerie a:nth-child(1n+5) {display:none;}
.galerie a.klein img {height:100%;display:block;max-width:none;}


.abstand {height:20px;}
.clear3 {clear:both;padding-bottom:20px;}


/* grid referenzen */
.grid {margin:0 -10px;}
.grid-sizer,
.grid-item {width:20%;}

.grid-item .inner {padding:10px;}

.grid-item a:first-child {display:block;height:0;padding-bottom:66.66%;overflow:hidden;}
.grid-item img {display:block;}
main.no-padding {padding:20px 0;}


.filters {padding:20px 0;}
.filters button {
	cursor:pointer;
	color:#aaa;
	padding:15px 20px;
	border-radius:0;
	background:transparent;
	text-align:center;
	text-transform:uppercase;
	border:1px solid #aaa;
	border-collapse:collapse;
	display:block;
	float:left;
	margin-right:-1px;
	outline:0;
}
.filters button.active {background-color:#e95e0f;color:#fff;}
	
	

@media screen and (max-width:1349px) {
	.navigationsbild, .navigationsbild li {height:auto;max-height:350px;}
	.navigationsbild img {position:static;}
	
}

@media screen and (max-width:1024px) {
	nav {display:none;}
	.mobilmenu_button {display:block;left:20px;}
	header .logoleiste {height:100px;}
	header .logoleiste .infomenu {left:20px;}
	header .logoleiste .logo {right:20px;top:19px;}
	header .logoleiste .logo:after {display:none;}
	
	
	
	.navigationsbild_klein {padding-left:20px;}
	main {padding:40px 20px;}
	.banner {padding:16px 80px 16px 20px;}
	
	footer {padding:20px 10px 50px 10px;}
	
	.effekt span, .effekt a {height:150px;border-radius:10px;}
	.effekt3 img, .effekt img {border-radius:10px;}
	.effekt3 span, .effekt3 a {height:auto;max-height:350px;}
	.effekt3 img {border-radius:10px;position:static;}
	.effekt img {}
}


@media screen and (max-width:950px) {
	.ym-g50, .ym-g75 {width:auto;float:none;}
	.ym-g50 .ym-gbox, .ym-g50 .ym-gbox-left, .ym-g50 .ym-gbox-right,
	.ym-g75 .ym-gbox, .ym-g75 .ym-gbox-left, .ym-g75 .ym-gbox-right {padding:0 0 1em 0;}
	.ym-g33, .ym-g25 {width:50%;}
	.ym-g33 .ym-gbox, .ym-g33 .ym-gbox-left, .ym-g33 .ym-gbox-right, 
	.ym-g25 .ym-gbox, .ym-g25 .ym-gbox-left, .ym-g25 .ym-gbox-right {padding:0 10px 1em 10px;}
	
	.navvigationsbild_klein {padding:0px 35px 0 50px;}
	.navigationsbild_klein .rslides_nav.prev {left:4px;}
	.untermenu {display:none;}

	form.form {padding: 20px 0px;}
}


@media screen and (max-width:768px) {
	.grid-sizer, .grid-item {width:33.33%;}	
	
}



@media screen and (max-width:600px) {
	
	
	.grid-sizer, .grid-item {width:50%;}
	.filters button {float:none;width:100%;}
	
	form.form .halb{float:none;width:100%;}
	form.form input[type="submit"] {margin:0 0 0 4px;}
	.infomenu {display:none;}
	header .logoleiste .logo {width:230px;top:30px;}
	header .logoleiste .logo img {max-width:100%;}
	
	h2 {font-size:18px;}
	
	
	.ym-g33, .ym-g25 {width:100%;}
	.ym-g33 .ym-gbox, .ym-g33 .ym-gbox-left, .ym-g33 .ym-gbox-right, 
	.ym-g25 .ym-gbox, .ym-g25 .ym-gbox-left, .ym-g25 .ym-gbox-right {padding:0 0 1em 0;}
	
	
	
}