/* CSS Document */

/* lato-regular - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url('/fileadmin/fonts/lato-v23-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/fileadmin/fonts/lato-v23-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fileadmin/fonts/lato-v23-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('/fileadmin/fonts/lato-v23-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('/fileadmin/fonts/lato-v23-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/fileadmin/fonts/lato-v23-latin-regular.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-900 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 900;
  src: url('/fileadmin/fonts/lato-v23-latin-900.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/fileadmin/fonts/lato-v23-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fileadmin/fonts/lato-v23-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('/fileadmin/fonts/lato-v23-latin-900.woff') format('woff'), /* Modern Browsers */
       url('/fileadmin/fonts/lato-v23-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/fileadmin/fonts/lato-v23-latin-900.svg#Lato') format('svg'); /* Legacy iOS */
}
/* merriweather-regular - latin */
@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 400;
  src: url('/fileadmin/fonts/merriweather-v30-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/fileadmin/fonts/merriweather-v30-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fileadmin/fonts/merriweather-v30-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('/fileadmin/fonts/merriweather-v30-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('/fileadmin/fonts/merriweather-v30-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/fileadmin/fonts/merriweather-v30-latin-regular.svg#Merriweather') format('svg'); /* Legacy iOS */
}

* {
 -webkit-box-sizing:border-box;
 -moz-box-sizing: border-box;
 box-sizing:border-box;
}

html, body {
	height: 100%;
 	width:100%;
	padding:0;
 	margin:0;
    /*background:url("../Images/HeaderBild.jpg") no-repeat top center;*/
    background:url("../Images/welle-5.jpg") no-repeat top center;
    background-size: 100%;
    color:#2f2f2f;
	font-family: 'Lato', sans-serif;
}
@media only screen and (max-width:910px){ html, body { background-position:center 50px;}}



@media only screen and (min-width:910px){
	
div.navi-wrap, footer #footer-inner {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	}

div.navi-wrap {justify-content: space-between;}
div.logo-wrap > div {
	width: 50%;
}
    
div.navi-wrap .navi-position {padding: 30px 15px 0 0; height: 350px;}
    
}

/*Logo anklickbar für Mobil*/
.navi-wrap {position: relative;}
.navi-wrap .logo {position: relative; z-index: 100;}
.navi-wrap .toggle-menu {position: relative; z-index: 90;}

/* ### Inhalt ### */


.layout-1spalte .layout-space-r-l,
.layout-2spalten .layout-space-r-l,
.layout-2spalten_50 .layout-space-r-l,
.layout-jumbotron .layout-space-r-l,
.layout-drei-zeilen .layout-space-r-l {padding: 0 25px; min-height: 500px;}

.space-content {padding:0;}
.space-content .contenttable td {vertical-align: top;}

/* #### Multicolumn ### */
@media only screen and (min-width:910px){ 
/*.multicolumnContainer,*/
.layout-2spalten_50 .layout-space-r-l,
.layout-2spalten .layout-space-r-l,
.spalten-jumbotron {
	align-content: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	}
.spalten-jumbotron div,
/*.multicolumnLayout1 li,
.multicolumnLayout2 li,
.multicolumnLayout3 li,
.multicolumnLayout10 .columnLast*/
.layout-2spalten_50 .layout-space-r-l div,
.layout-2spalten .layout-space-r-l div:last-child {
	-webkit-box-flex: 1;
	-moz-box-flex: 1; 
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	}		
/*.multicolumnLayout10 .columnFirst,*/
.layout-2spalten .layout-space-r-l div {
	-webkit-box-flex: 3;
	-moz-box-flex: 3; 
	-webkit-flex: 3;
	-ms-flex: 3;
	flex: 3;
	}

/*.multicolumnContainer li {padding-right: 25px;}
.multicolumnContainer li:last-child {padding-right:0;}*/
}

/*@media only screen and (max-width:910px){
.multicolumnContainer .column {min-width: 100%;}
}*/


/*Spalten Jumbotron*/
/*.spalten-jumbotron div {width: 100%;}*/
@media only screen and (min-width:910px){
.spalten-jumbotron > div:first-child {margin-right: 25px; }
.spalten-jumbotron > div:last-child {margin-left: 25px; }
	.spalten-jumbotron > div {width: 33%; }
	.spalten-jumbotron > div > div {width: 100%;}
	.spalten-jumbotron {height: 100%;}
}


/*@media only screen and (max-width:910px){ .multicolumnContainer .column {float: none; width: 100%;} }*/


	
/* Responsive Bilder */
	
.space-content img,
.space-content figure,
.space-content .ce-outer,
.space-content .ce-inner,
.space-content .ce-row
{
	/*width: 100%;*/ max-width: 100%; height: auto;
}

.ce-column .lightbox {position: relative;}


@media only screen and (min-width:910px) {
.space-content .ce-row {
		display: -webkit-box;
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		margin-bottom: 10px; 
	}
.space-content	.ce-column { 
	-webkit-box-flex: 1;
	-moz-box-flex: 1; 
	width: 20%; 
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1; 
	}
    
.ce-textpic, .ce-image, .ce-nowrap .ce-bodytext, .ce-gallery, .ce-row, .ce-uploads li, .ce-uploads div { overflow: hidden; }
}

@media only screen and (max-width:910px) {	
	.space-content .ce-row {
		min-width: 100%;
		display: -webkit-box;
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: column; 
  		flex-direction: column;
	}

.ce-textpic {overflow: visible;}
.space-content .ce-gallery {width: 100%;}
.space-content .ce-column {margin-right:0; margin-bottom: 10px;}
.space-content	img, .space-content	figure { /*min-width: 100%;*/ height: auto; text-align: center; margin: 0 auto;}
	
.space-content .ce-inner, .space-content .ce-outer {width: 100%; height: auto;}
}



/*###################################*/


#wrapp-all {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 0 50px 0;
}


/* Logo */

div.logo-wrap {
	background-color:#fafafa;
 }
.logo { text-align: left; padding: 15px 0 25px 0; float:left;}
.logo img {height: auto; max-width: 80%; margin: 0 auto;}
.logo-name h1, .logo-name h1 a {color: #fff; padding: 25px; margin: 0; /*text-align: center;*/ text-decoration: none;}

@media only screen and (min-width: 910px) {
	.logo {padding: 30px 0 5px 15px;}
	.logo img { height: auto; /*max-width: 100%;*/}
}


/* ### Schrift #### */


.space-content h1 {
	font-family: 'Merriweather', serif;
	color: #334e7c;
	font-size: 3rem;
    text-shadow: #fff 0 0 10px;
}

.space-content h2 {
	font-family: 'Merriweather', serif;
	color: #2f2f2f;
}
	
.ce-center .text-center {text-align: center;}	
	
.space-content a {
	color:#555;
	transition: all .225s ease-in-out;
  	-webkit-transition: all .225s ease-in-out;
}
.space-content a:hover {color:rgba(1, 87, 155,1.0); }
.space-content .image-caption { font-size: 0.7rem; text-align: center; padding: 10px;}

footer, footer a {color: #2f2f2f;}
footer a:hover {color: #4e7ec6;}

@media only screen and (max-width:910px) {
	.space-content h1 { font-size: 2rem;}
	.space-content h2 { font-size: 1.5rem;}
    .space-content { padding-top: 70px;}
}

/*Silbentrennung*/
p, h2, h3 {
   -moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto;
}



/* Überschrift und Beschreibung */
.tx-ws-flexslider .caption-text {
	background: none;
	width: 100%;
	left: 0;
	text-align: center;
	color: #fff;
	text-shadow:0 2px 4px rgba(0,0,0,.8);
	font-size: 2rem;
}
.tx-ws-flexslider .caption-align-left .caption-text {left: 0;}

.tx-ws-flexslider .caption-text .caption-title {
	font-family: 'Lato', sans-serif;
	font-size: 5rem;
	font-weight: normal;
}


/*Link*/
@media only screen and (min-width:910px) {
.tx-ws-flexslider .caption-align-left .caption-link {
	width: 100%;
	min-width: 100%;
	height: 100%;
	left:0;
	bottom: 0;
}
.tx-ws-flexslider .caption-align-left .caption-link a {
	padding: 100px;
	width: 100%;
	min-width: 100%;
	height: 100%;
	display: block;
	color: transparent;
}
}

@media only screen and (max-width:910px) {
	.tx-ws-flexslider .caption-text .caption-title {font-size: 3rem;}
	.tx-ws-flexslider .caption-align-left .caption-link a {padding: 25px; display: block;}
}


#sd-lightbox {background: rgba(0, 0, 0, 0.7);}


.ce-bodytext p {margin-top: 0;}


/*### Spalten Abstand ###*/
@media only screen and (min-width:910px) {	
	.layout-2spalten .content_2Spalten_0,
	.layout-2spalten_50 .content_2Spalten_50_0
	{margin-right: 25px;}
	.layout-2spalten_50 .content_2Spalten_50_2
	{margin-left: 25px;}
}


/*### Liste mit Buchstaben ###*/

li > ol > li {list-style: lower-alpha;}

	
/* ### footer ### */

.content_1Spalte_0 div:last-child {padding-bottom: 0;}


footer {
	background:url("../Images/welle-footer.jpg") no-repeat center top;
    background-size: 100%;
    background-position: bottom;
}

footer #footer-inner {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0;
	padding: 0 25px 100px 25px;
}

footer .footerkontakt ul {
	list-style: none;
	padding:0;
}
footer .footerkontakt .metanav {padding-top: 50px;}
footer .footerkontakt .metanav a {padding:15px 30px 15px 0; font-weight: 900;}
footer .footerkontakt a {display:inline-block;  text-decoration: none;}
footer td {font-size: 0.8rem;}

@media only screen and (min-width:910px){
	footer #footer-inner > div {
		-webkit-box-flex: 1;
		-moz-box-flex: 1;
		width: 50%;
		-webkit-flex: 1;
		-ms-flex: 1;
		flex: 1;
	}
	footer #footer-inner .footerkontakt .ce-bodytext,
	/*footer #footer-inner .footerkontakt header {text-align: right;}*/
	footer #footer-inner .footerkontakt .ce-bodytext table td {padding: 5px 20px 5px 0;}
	footer #footer-inner .ce-gallery {overflow: visible;}
	footer .font-awesome-div {text-align: right;}
    footer td {font-size: 1.1rem;}
    footer {background-position: top;}
}

footer #footer-inner .footerkontakt img {max-width: 100%;margin-top: 50px;}
.font-awesome {padding:5px;}
.font-awesome-div {padding-top: 35px;}

.footer-navigation {padding-top: 30px;}


/*### Formular ###*/
.form-group .input > input,
.powermail_fieldwrap_datei input,
.form-group .input > .form-group > input,
.form-group textarea {
	width: 100%;
	/*padding: 5px;*/
	font-family: 'Lato', sans-serif;
	font-size:1rem;
	color: rgba(1, 87, 155,1.0);
	/*border: 1px solid rgba(224,224,224,0.73);*/
	box-shadow: rgba(124,124,124,0.4) 0 0 4px inset;
}
.form-group textarea {height: 100px;}
.form-group .xlarge {
    padding: 15px;
    height:200px;
    font-size:1.1rem;
    font-family: 'Lato', sans-serif;
}
form > div, form .row > div {padding-top: 25px;}

@media only screen and (min-width:910px){
form .row {
	/*display: -webkit-flex; Safari */
   	-webkit-flex-wrap: wrap; /* Safari 6.1+ */
    display: flex;
    flex-wrap: wrap;
	justify-content:space-between;
}
	
	form .row > div {
		width: 48%;
    	height: auto;
	}
}





/* ############ Boxen ################## */

/* #### großer botton ### */
.frame-linkbotton p a, .frame-produkt-link p strong a {
    display: inline-block;
    background-color: #4e7ec6;
    padding: 15px;
    color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    border-radius:50px;
    box-shadow: rgba(130,130,130,0.33) 0 5px 5px;
    margin: 40px 30px 30px 0;
}

.frame-linkbotton p a:hover, .frame-produkt-link p strong a:hover {
    background-color: #334e7c;
    color: #fff;
    box-shadow: rgba(130,130,130,0.83) 0 2px 5px;
}

@media only screen and (max-width:910px){ .frame-produkt-link p strong { display: block; text-align: center;}}

.frame-produkt-link .ce-left .contenttable td {
    padding: 5px 10px 5px 0;
}


@media only screen and (min-width:910px){ 
.frame-produkt-link .ce-left {
    align-content: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
}
.frame-produkt-link .ce-left div {
        -webkit-box-flex: 1;
	-moz-box-flex: 1; 
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
    }
    .frame-produkt-link .ce-left .ce-bodytext {padding-left: 25px;}

    .frame-block-nach-navi {
    padding-left: 30%;
    max-width: 1000px;
}
    
    .frame-produkt-link figure {
        margin: 0 auto;
    }

}


@media only screen and (min-width:910px){ 
   .frame-block-nach-navi {
    padding-left: 30%;
    max-width: 1000px;
}
}

@media only screen and (min-width:400px) and (max-width:600px) { .frame-block-nach-navi {padding-top: 80px;}}
@media only screen and (min-width:600px) and (max-width:910px) { .frame-block-nach-navi {padding-top: 150px;}}
@media only screen and (min-width:910px) and (max-width:1000px) { .frame-block-nach-navi {padding-top: 10px;}}
@media only screen and (min-width:1000px) and (max-width:1200px) { .frame-block-nach-navi {padding-top: 50px;}}
@media only screen and (min-width:1200px) and (max-width:2000px) { .frame-block-nach-navi {padding-top: 130px;}}

.frame-produkt-link .contenttable td {
    border-bottom: 1px solid #eee;
}


/*#### Cross Selling ######*/

.frame-cross-selling {
    height:70%;
    
}
.crossselling-wrap .crossselling-item {
    margin: 0 auto;
    text-align: center;
    position: relative;
}


.crossselling-wrap {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
}

@media only screen and (max-width:550px){
    .crossselling-wrap {
        flex-direction: column;
    } 
}

.crossselling-wrap .crossselling-item {
    min-height: 100%;
    position: relative;
}

.crossselling-wrap .crossselling-item .ce-bodytext a {
    display: inline-block;
    background-color: #4e7ec6;
    padding: 15px;
    color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 50px;
    box-shadow: rgba(130,130,130,0.33) 0 5px 5px;
    margin: 40px 0;
    text-align: center;
}
.crossselling-wrap .crossselling-item .ce-bodytext a:hover {
background-color: #334e7c;
    color: #fff;
    box-shadow: rgba(130,130,130,0.83) 0 2px 5px;
}

.crossselling-item {
    position:relative;
}

.crossselling-item .frame .ce-textpic {
    position:relative;
    bottom: 0;
}




/*### Inhalt mit h2 Überschrift, Botton und Linie ###*/
.frame-produkt-link, .frame-produkt-link h2 {
    padding-bottom: 15px;
    border-bottom: 1px solid #999;
}
.frame-produkt-link {margin-bottom: 100px;}



/* #### Multicolumn ### */
@media only screen and (min-width:910px){ 
.multicolumnContainer {
	align-content: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	}


.multicolumnContainer li {
	-webkit-box-flex: 1;
	-moz-box-flex: 1; 
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	}
.multicolumnContainer li {padding-right: 25px;}
.multicolumnContainer li:last-child {padding-right:0;}
.multicolumnContainer .columnItems {height: 100%;}
}

/*nur padding in spalten ohne ausgewählte Box*/
/*.spalten-jumbotron .frame-default p,
.spalten-jumbotron .frame-default h1,
.spalten-jumbotron .frame-default h2,
.spalten-jumbotron .frame-default h3,*/
div.frame-greybox p,
div.frame-greybox h1,
div.frame-greybox h2,
div.frame-greybox h3,
div.frame-whitebox p,
div.frame-whitebox h1,
div.frame-whitebox h2,
div.frame-whitebox h3,
div.frame-whiteborder p,
div.frame-whiteborder h1,
div.frame-whiteborder h2,
div.frame-whiteborder h3
{
	padding-right: 25px;
	padding-left: 25px;
}





@media only screen and (min-width:600px){
div.layout-grid {
    -webkit-flex-wrap: wrap; /* Safari 6.1+ */
    display: flex;   
    flex-wrap: wrap;
	justify-content: space-between;
 }

div.frame-layout-4 {
	width: 45%;
	padding: 25px 0;
	text-align: justify;
}
div.frame-layout-4 h2, div.frame-layout-4 h3 {
	text-align: center;
}

div.frame-layout-0 {
	flex-direction:column
}
	
div.frame-layout-5 img {
		border: solid #fff 1px;
		box-shadow: rgba(54,85,110,0.50) 2px 2px 4px;
	}
	
	div.frame-layout-5 figure {
		padding:5px;
	}


div.layout-grid {
	-moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto;
}
	
	
}






/* ################################ Navigation ########################### */

.topnavi {font-weight: 700;}

.topnavi { border-bottom: 0px solid transparent; } 												/*Border unter der Navi Desktop ganze Breite*/
#toggle-menu {
	/*background-color:#fafafa;*/
	/*border-bottom: 1px solid #666;*/} 															/*Hintergrundfarbe Navigation oben für Symbol nur mobil*/
.topnavi__lvl--first { background-color:#fafafa; } 												/*Hintergrundfarbe hinter den Button  für mobil*/
.topnavi__link--first { background-color:rgba(240,240,240,0.90);} 								/*normal Hintergrund 1. Ebene nur mobil*/
.topnavi__link--sub { background-color:rgba(240,240,240,0.90);} 								/*normal Hintergrund ab 2. Ebene*/
.topnavi__link--first:hover { background-color:rgba(255,255,255,1.0);} 							/*hover 1. Ebene mobil*/
.topnavi__link--sub:hover { background-color:rgba(255,255,255,1.0);} 							/*hover 2. Ebene*/
.topnavi__link--active { background-color:rgba(200,200,200,0.94);} 								/*Aktiv Hintergrund nur mobil*/
.topnavi__lvl--first > .topnavi__item { border-bottom: 1px solid #666; } 						/*Border unten 1. Ebene mobil*/
.topnavi__lvl--first .topnavi__item li { border-bottom: 1px solid #666; } 					    /*Border unten 2. Ebene */
  
@media only screen and (min-width: 910px) {
/*.topnavi {background-color:#fafafa; } */															/*Hintergrund ganze Breite*/
.topnavi__lvl--first {background-color: transparent; } 											/*Hintergrund ganze Breite*/
.topnavi__link--first { background-color: transparent;} 										/*Hintergrundfarbe Navi 1. Ebene nur Desktop*/
.topnavi__link--first:hover { background-color:transparent;} 									/*hover 1. Ebene nur Desktop */
.topnavi__link--active { background-color:transparent;} 											/*Aktiv Hintergrund nur Desktop */

.topnavi { border-bottom: 0px solid #ddd; } 													/*Border unter der Navi Desktop ganze Breite*/
#toggle-menu { border-bottom: 0px solid transparent; } 											/*ist ausgeblendet für Desktop*/	
.topnavi__lvl--sub { border-top: 1px solid #666;} 												/*Border oben bei Sub-Navigation*/
.topnavi__lvl--first > .topnavi__item { border-bottom: 1px solid transparent; } 				/*Border unten 1. Ebene Desktop*/
}


/*Symbol Navigation mobil*/

.topnavi .bar1, .topnavi .bar2, .topnavi .bar3 { background: #334e7c; } 							/*x für Navi Mobil*/
.topnavi .change .bar1, .topnavi .change .bar3 { background: #4e7ec6; } 							/*x für Navi Mobil wenn geöffnet*/



/*Schriftfarben*/
.topnavi__link--first, .topnavi__link--sub,
.topnavi__link--sub, .topnavi__item  {color:#555;} 												/*Schrift normal*/
.topnavi__link--active {color:#334e7c;} 														/*Schrift activ*/
.topnavi__link--first:hover, .topnavi__link--sub:hover {
	color:#4e7ec6;
	text-shadow: rgba(255,255,255,0.9) 0px 0px 2px;} 											/*Schrift hover*/
/*.topnavi {text-shadow: rgba(50,50,50,0.45) 1px 1px 3px;}*/



/*MENU ARROWS*/
.topnavi__label {
	background-color: #bbb;
	transition: all .125s ease-in-out;
  	-webkit-transition: all .125s ease-in-out; }
.topnavi__label:hover { background-color: #ddd; } 													/*Box für Pfeil bei sub-Navigation Desktop + mobil*/

.topnavi__arrow {border-top: 6px solid #666;}
.topnavi__arrow--sub {border-top: 6px solid #666;}
@media (min-width: 910px) {
    .topnavi__arrow--sub {
		border-left: 6px solid #666;
		border-top: 6px solid transparent;}
	.topnavi__label {background-color:transparent;}
	
}

/*ausblenden 1. Box für mobil*/
.topnavi label .topnavi__label { background-color: transparent;}
.container .topnavi__arrow {border-top: 6px solid transparent;}
.container .topnavi__arrow--sub {border-top: 6px solid transparent;}


/*korrektur position höhe 3. Ebene für Desktop*/
.topnavi__lvl--sub li ul {margin-top: -1px; }


@media (min-width: 910px) {
.topnavi {
	display:flex;

}
.topnavi__lvl--sub {margin-top: 1px;}


/*### Strich neben dem Button ####*/
.topnavi__lvl--first a::after {
    content: "I";
    padding-left: 0.6em;
    font-weight: 100;
}

.topnavi__lvl--first li:last-child a::after {
    content: none;
}
}

#toggle-menu {text-align: right;}

#toggle-menu .container {
    display: inline-block;
}
