/* HTML5 DISPLAY DEFINITIONS */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }


* { margin:0; padding:0; border:0; }
html, body {height: 100%;}
html, button, input, select, textarea { font-family: sans-serif; color: #363735; }
html { font-family: sans-serif; /* 1 */font-size: 100%; -webkit-text-size-adjust: 100%;/* 2 */ -ms-text-size-adjust: 100%;/* 2 */}
html { width:100%; position: relative; font-size: 100%;}
html { overflow-y: scroll; }
@font-face {font-family: 'sansbold';src: url('fonts/opensans-bold-webfont.woff2') format('woff2'),url('fonts/opensans-bold-webfont.woff') format('woff');font-weight: normal;font-style: normal;}
@font-face {font-family: 'sanslight';src: url('fonts/opensans-light-webfont.woff2') format('woff2'),url('fonts/opensans-light-webfont.woff') format('woff');font-weight: normal;font-style: normal;}
@font-face {font-family: 'sansreg';src: url('fonts/opensans-regular-webfont.woff2') format('woff2'),url('fonts/opensans-regular-webfont.woff') format('woff');font-weight: normal;font-style: normal;}

body {
	font-family:  Helvetica, Geneva, Arial, Verdana, sans-serif;
	color: #363735;
	line-height: 1.2em;
	background-color: #ffffff;
	margin: 0;	
	}
a {background-color: transparent;}
a:active, a:hover {outline: 0;}
*:focus  { outline: 0;}
b, strong {font-weight: 600;}
#mercall, #content {width:100%;}
.clear { clear: both; }
.clearex:after { clear: both; }
.left {float:left;}
.right {float:right;}
img{border:0;vertical-align:top;max-width:100%;}
.opsan {font-family:'sansreg', sans-serif; font-weight: 400;font-size:1em;line-height: 1.6em;}
.opsanbo {font-family:'sansbold', sans-serif; font-weight: 600;font-size:0.8em;}
.opsanli {font-family:'sanslight', sans-serif; font-weight: 300;}
.fliess {font-size:0.9em;line-height:1.6em;}
.fluss {font-size:0.9em;line-height:1.6em;}
.floss {font-size:1.8em;line-height:1.2em;}
.kontab {padding:14px 0;}
section, header,footer,nav { display:block;}
#header{z-index:80;min-height:144px;width:100%;overflow:hidden;margin:60px 0 0 0;background:#fff;}
.screen-reader-text {clip: rect(1px, 1px, 1px, 1px);height: 1px;overflow: hidden;position: absolute !important;width: 1px;}
.center {max-width:1000px;width:100%;margin:0 auto;}
a {color:#1f2c56; text-decoration:none; -webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out;}
a:hover {color:#838481;}
#logo {width:420px;height:74px;margin-bottom:80px;float:left;}
#claim {
    font-family:'sansreg', sans-serif; font-weight: 400;
    text-transform:uppercase;
    letter-spacing:0.1em;
    color:#7a7b77;
    font-size:1em;
    float:right;
    margin-top:60px;
}




/* ################### NAVI ################ */
.btn_navbar { position:absolute; right:0; top:8px; background:url('../pix/nav_button.png') no-repeat; width:65px; height:34px; cursor:pointer; display:none;z-index:1009;}
.btn_navbar:hover { background:url('../pix/nav_button1.png') no-repeat;}

#mainNav{text-align:center;z-index:999;}
#navi li{
    display:inline;
    float:left;
}
#navi a{
    font-family:'sansreg, sans-serif; font-weight: 400;
    letter-spacing:0.05em;
    color:#1f2952;
    position:relative;
    display:inline-block;
    text-decoration:none;
    text-transform:uppercase;
    font-size:0.9em;
    line-height:2.9em;    
}
#navi a span{
    color:#1f2952;
    text-decoration:none;
    text-transform:uppercase;
    padding:0 1.7em;
    display:block;
}
#navi a:active{
    top:1px;
}
#navi a:hover span ,
#navi li.active span {
    color:#fff;
    background: #1f2952;
 }
.trenn {background-image: url('../pix/trenn.gif');width:1px;line-height:2.6em;}

/* ----- DROPPIDOWN ----- */
ul#navi li:hover > ul {visibility:visible;opacity:1;}
ul#navi ul, ul#navi ul li ul {
	list-style: none;
    margin: 0;
    padding: 0;    
	visibility:hidden;
    position: absolute;
    z-index: 99999;
	width:310px;
	background:#fff;
	opacity:0;
	-webkit-transition:opacity 0.2s linear, visibility 0.2s linear; 
	-moz-transition:opacity 0.2s linear, visibility 0.2s linear; 
	-o-transition:opacity 0.2s linear, visibility 0.2s linear; 
	transition:opacity 0.2s linear, visibility 0.2s linear; 	
}
ul#navi ul {top: 256px;}
ul#navi ul li {clear:both;width:100%;border:0 none;border-top:2px solid #f1f1f1;}
ul#navi ul li a {
	background:none;
	padding:6px 0 6px 15px;
	color:#1f2952;
	font-size:0.8em;
	text-decoration:none;
	display:inline-block;
	border:0 none;
	text-align:left;
	float:left;
	clear:both;
	width:295px;
	line-height:28px;}
ul#navi ul li a:hover {
	background-color:#1f2952;
	color:#fff;
    }
ul#navi li a.first {border-left: 0 none;}
ul#navigation li a.last {border-right: 0 none;}

#logo, #claim, #mainNav a:hover span , #mainNav li.active span, #starthead, .startheadblau, #bild1, .namer1, .namer2 {-webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out;}

/* ################# CONTENT ##################*/ 

.grayground {background-color: #f1f1f1;}

.starthead{
    font-family:'sanslight', sans-serif; font-weight:300;
    text-transform:uppercase;
    letter-spacing:0.1em;
    color:#7a7b77;
    font-size:2em;
    text-align: left;
    padding:50px 0 40px;
    line-height: 1.2em;
    }    
.startheadblau {color:#1f2952;/* font-size:1.1em; */}

#bild1 {width:100%;max-height: 720px;overflow:hidden;}
#headpic {width:100%;max-height: 510px;overflow:hidden;z-index:20;}
.zweih {margin-left:200px;}
.lasche {text-align:center;margin-top: -28px;}
.laschekl {text-align:center;margin-top: -18px;z-index:90;position:relative;}
.p-lamid {margin-top:-120px;}

/* ############# PARALAXX  ################## */
.lamid {bottom:0;left:0;width:100%;text-align:center;}
.parallax-container {height: 360px;width: 100%;}

.o-lamid {display:none;}

.lawrapp {height: 120px;overflow:hidden;position: relative;margin:0 auto;}
.bluetr, .bluetr_vis {position:absolute; width:100%;z-index:20;height:100%;background:#1f2d57;background: rgba(31,45,87,0.8);}
.latxt {font-size:2em;text-transform:uppercase;color:#fff;padding: 30px 0;}
.lapic, .latxt{position:absolute;z-index:30;bottom:0;left:0;width:100%;text-align:center;}
.lawidth1 {width:360px;}
.lawidth2 {width:600px;}
.lawidth3 {width:700px;}
.twocol {padding:20px 0 80px}

.twofull {width:100%;margin-bottom:20px;}
.cleft {width: 49%;}
.cspac {width: 2%;}
.cright {width: 49%;}

.feeleft {width: 49.5%;overflow: hidden;position:relative;}
.feespac {width: 1%;}
.feeright { width: 49.5%;overflow: hidden;position:relative;}
.untspac {height:100px;}
.untspac1 {height:40px;}
.bild1 {z-index:9;position:static;left:0;}
.bild21, .bild22, .bild23, .bild24 {display: block;visibility: visible; opacity: 0.02;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=2)";filter: alpha(opacity=2);-moz-opacity:0.02;-khtml-opacity: 0.02; z-index:10;width:100%;left:0;position:absolute;-webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out;}
.wiover1, .wiover2, .wiover3, .wiover4 {width:100%;position:relative;}
.namer {width:100%; background:#fff;text-align:center;padding:30px 0;font-family:'sanslight', sans-serif; font-weight:300;text-transform:uppercase;letter-spacing:0.1em;color:#7a7b77;font-size:2em;margin-top:-1px;position:relative;z-index:16;}
.whiteground {background: #fff;}
.wleft {width: 22%;}
.wspac {width: 5%;}
.wright {width: 73%;}
.wleftco {padding:40px 0 40px 80px;}
.wrightco, .datenco {padding:40px 60px 40px 0;}
.icokl {margin-bottom:10px;}
.subhead {font-size:1.4em;line-height:1.2em;background-image: url('../pix/pfeil-b.png');background-repeat: no-repeat;background-position: 0 6px;padding:0 0 10px 22px;}
.subb {background-image: url('../pix/pfeil-b.png');background-repeat: no-repeat;background-position: 0 6px;padding:0 0 10px 22px;}
.wrightco li {list-style-image:url('../pix/pfeil-g.png');list-style-position:outside;margin-bottom:1.4em;}
.wrightco li li {list-style-image:url('../pix/dot.gif');background-position: 0 -6px;text-indent: 0em;margin-bottom:0em;}
.datenco li {list-style-image:url('../pix/dot.gif');list-style-position:inside;text-indent: 1em;margin-bottom:0em;font-size: 0.9em;line-height: 1.6em;}

/* 
.wrightco li li {list-style-type:none;list-style-image:none;text-indent: 0em;margin-bottom:0em;}
 */

.wrightco li ul {list-style-position:inside!important;}
.wrightco2 {padding:40px 60px 15px 0;}

.lirein {padding-left:22px;}

.fourcol {padding:50px 0 110px;}
.fourone, .fourtwo, .fourtres, .fourquad {background:#fff;width:240px;transition: all .2s ease-in-out;margin-top:10px;}
.fourone a, .fourtwo a, .fourtres a, .fourquad a {color:#313131;}
.fourone:hover, .fourtwo:hover, .fourtres:hover, .fourquad:hover {transform: scale(1.1);}
.fourtwo, .fourtres {border-left: 5px solid #f1f1f1;border-right: 5px solid #f1f1f1;}
.fourone {border-right: 5px solid #f1f1f1;}
.fourquad {border-left: 5px solid #f1f1f1;}
.foco {padding: 40px 15px 20px;text-align: center;}
.leisthead {font-size:1.2em;line-height:1.4em;margin:15px 0 50px;}
.leistpic {width:100%;max-height:360px;overflow:hidden;z-index:20;}

.graycol {padding:0 0 110px 0;}
.grayone, .graytwo, .grayone1, .graytwo1 {width:220px;margin:0 10px 10px 0;padding:10px 10px 10px 10px;}
.grayone, .graytwo {min-height:110px;}
.grayone1, .graytwo1 {min-height:186px;}
.grayfull {width:230px;padding:10px 10px 10px 10px;min-height:110px;}
.grayfull-last {width:220px;padding:10px 10px 10px 10px;min-height:110px;}
.grayone, .grayone1, .grayfull, .grayfull-last {background:#f1f1f0;}
.graytwo, .graytwo1 {background:#e7e8ec;}
.grayone li, .graytwo li, .grayone1 li, .graytwo1 li, .grayfull li, .grayfull-last li {list-style-image:url('../pix/dot.gif');list-style-position:outside;margin-bottom:0.5em;font-size:0.8em;}
.grayone ul, .graytwo ul, .grayone1 ul, .graytwo1 ul, .grayfull ul, .grayfull-last ul, .focu ul {padding-left:14px;}
.focu li {list-style-image:url('../pix/dot.gif');list-style-position:outside;margin-bottom:0.5em;}
.gunox {width:500px;margin:0 auto;}
.mop {list-style-image:url('../pix/dot.gif');list-style-position:outside;margin-bottom:0.5em;}

.focone, .focquad {background:#fff;width:240px;min-height:700px;}
.focone, .foctwo, .foctres {background:#fff;width:240px;margin:10px 10px 0 0;}
.focquad {margin:10px 0 0 0;}
.focu {padding: 0 10px 20px;}
.fochead {font-size:1.2em;line-height:1.4em;margin:5px 0 10px;}

.kont {padding:40px 50px 40px;}
.line {background:#b3b4b0;height:1px;width:100%;}
hr {width:100%;height:1px;background:#cdcdcd;border:0;margin:20px 0;}

#boxx {
    display: block;height: 60px;width:600px;
}
    .twocolpic {width:85%;}
/* ############## Back to TOP ################## */

a.back-to-top {display: none;width: 30px;height: 23px;text-indent: -9999px;position: fixed;z-index: 999;right: 20px;bottom: 20px;background: url('../pix/top1.png') no-repeat;}
a:hover.back-to-top {background: url('../pix/top2.png') no-repeat;}
.simple-back-to-top {display:none;}

/* ############## MEDIA QUERYS ################## */

@media only screen and (max-width: 1300px) {
    .fleft {width: 49%;}
    .fspac {width: 2%;}
    .fright {width: 49%;}
    .namer {font-size:1.35em;}
}
@media only screen and (max-width: 1024px) {	
    .center {padding:0 10px;width:auto;max-width: 100%;}
    #navi a {font-size:0.9em;}
    .trenn {line-height: 2.5em;}
    #navi a span{padding:0 1em;}
    #claim {font-size:0.85em;}
    #bild1 {max-height: 500px;}
    .lasche {width:150px;height:19px;margin: -19px auto 0;}
    .untspac {height:80px;}
    ul#navi ul {top: 258px;}
    .fourcol, .graycol {width:520px;margin:0 auto;}
    .spacgrey {width:220px;}
    .fourone {margin-left: 5px;}
    .focone, .focquad {width:246px;min-height:420px;}
    .parallax-container {height: 300px;}

}
@media only screen and (max-width: 860px) {
	#header {min-height: 122px;}
    #claim {width:100%;margin-top: 20px;margin-bottom:20px;}
    #logo {margin:0;}
    #navi a span{padding:0 0.6em;}
    #bild1 {max-height: 400px;}
    ul#navi ul {top: 235px;}
    .namer {font-size:1.3em;line-height:1.4em;} 
    .wleftco {padding:40px 0 50px 60px;} 
    .zweih {margin-left:50px;} 	
}
@media only screen and (max-width: 960px) {
		
}
@media only screen and (max-width: 790px) {
	.btn_navbar {display:block;}
    #mainNav {left:0; margin:0 0 0 0; display:none; width:100%;}
    #navi li{display:block; text-align:center; background:#fff; border-bottom:2px solid #f1f1f1;width:96%;}
    #navi a {line-height:2em;width:100%;}
    #navi .trenn {display:none;}
    #navi a span{padding:0 0; width:100%;display:block;}
    ul#navi ul, ul#navi ul li ul {visibility:visible;position: relative;width:100%;opacity:1;background:#eff0ea;}
    ul#navi ul {top:0;}
    ul#navi ul li {border-top:2px solid #fff;}
    ul#navi ul li a {width:100%;text-align:center;padding:6px 0 6px 0;background:#eff0ea;}
    .starthead{font-size:1.7em;padding:30px 0;}    
    .center {padding:0 20px;}
    #header {min-height: 90px;}
    #bild1 {max-height: 300px;}
    .twocol {padding:40px 0 40px}
    .cleft, .cspac, .cright, .fleft, .fspac, .fright, .feeleft, .feespac, .feeright {width: 100%;float:none;/* text-align: center; */}
    .opsan {float:none;}
    .untspac {height:40px;}
    .p-lamid {margin-top:-70px;}
    .lawrapp {height: 70px;}
    .latxt {font-size:1.2em;padding: 15px 0;}
    .lawidth1 {width:280px;}
    .lawidth2 {width:330px;}
    .lawidth3 {width:400px;}
    .zweih {margin-left:0px;}
    .lapic img{width:160px;height:20px;}
    .wleftco {padding:40px 0 50px 40px;}
    .parallax-container {height: 250px;}
    .fluss table {margin:0 auto;}
    .tabmitt {margin:0 auto;}
}
@media only screen and (max-width: 520px) {
    .fourcol, .graycol, .gunox {width:250px;margin:0 auto;}
    .leisthead {font-size: 1em;margin: 15px 0 20px;}

}
@media only screen and (max-width: 515px) {
	#logo { width:290px;height:51px;}
    #claim {font-size:0.65em;}
    #header {min-height: 60px;margin:50px 0 0 0;}
    .starthead{font-size:1em;padding:15px 0;}    
    /* .startheadblau {font-size:1.1em;} */
    #bild1 {max-height: 200px;}
    .lasche {width:90px;height:11px;margin: -11px auto 0;}
    .twocol {padding:30px 0 30px}
    .wleft, .wspac {display:none;}
    .wright {width:100%;}
    .wrightco {padding:40px 10px 20px 20px;}
    .fliess {font-size:0.8em;}
    .fluss {font-size:0.8em;line-height:1.4em;}
    .floss {font-size:1.5em;line-height:1.2em;}
    .latxt {font-size:1.0em;}
    .lawidth2, .lawidth3 {width:100%;} 
    .fourcol, .focone, .focquad, .graycol, .gunox, .fourone, .fourtwo, .fourtres, .fourquad {width:100%;border:none;}
    .focone, .focquad {min-height:200px;}
    .fourone:hover, .fourtwo:hover, .fourtres:hover, .fourquad:hover {transform: scale(1);}
    .grayfull, .grayfull-last, .grayone, .graytwo, .grayone1, .graytwo1 {width:95%;border:none;}
    .grayone, .graytwo, .grayone1, .graytwo1 {margin:0 0 10px 0;padding:padding:10px 0 10px 5px;}
    .grayfull {min-height:auto;}
    .kont {padding:20px 20px 20px;}
    .parallax-container {display: none!important;}
    .o-lamid {display:block;}
}
@media only screen and (max-width: 330px) {
    /* #headpic, #bild1, .leistpic, .foco {display:none;} */
    .twocolpic {display:none;}
    .lawrapp {height: 55px;}
    .p-lamid {margin-top:-55px;}
    .latxt {font-size:0.8em;padding: 10px 0;}
    .lawidth2, .lawidth3 {width:85%;} 	   
}
@media all
	and (min-device-width: 768px)
	and (max-device-width: 1024px){
	#header{
		padding:2px 0 0;
		height:0;
		overflow:hidden;
		position:static;
	}
	#content{padding:0;}
	
}