@charset "utf-8";
/* CSS Document */

:root {
  --grey: rgb(80,83,80);
  --red: rgb(211,18,23);
  --green: rgb(104,164,48);
  --white: rgb(227,227,227);
  --weiss: rgb(255,255,255);
}

body {margin: 0; padding: 0; font-family: "Roboto Condensed", sans-serif; font-size: 20px; color: var(--grey);}

img {width: 100%; height: auto; border: 0; display: block;}
.clearer::after {content: ""; display: table; clear: both;}

.video {width: 100%; position: relative; padding-bottom: 56.25%; height: 0; height: auto; overflow: hidden;}
.video iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

.btn-red {box-sizing: border-box; padding: 10px 16px; background-color: var(--red); color: var(--weiss)!important; text-decoration: none; text-transform: uppercase; font-size: 22px;}
.btn-red:hover {background-color: var(--green); color: var(--weiss)!important;}

.highlighter {display: table; box-sizing: border-box; padding: 6px 10px; font-weight: bold; color: var(--grey); background-color: var(--white);}





.header {width: 100%; position: fixed; top: 0; left: 0; z-index: 10000; background-color: var(--weiss);}
.header-inner {width: 100%; position: relative; height: 120px;}
.brand-area {background-color: var(--green); max-width: 150px; position: absolute; top: 0; left: 0; padding: 30px 20px;}
.brand-area::after {position: absolute; top: 0; left: 130px; content: ""; border-style: solid; border-color: transparent transparent transparent var(--green); border-width: 0 0 150px 60px;}
.brand {width: 90px;}
.nav-area {width: 92%; max-width: 1400px; margin: 0 auto; position: relative; height: 120px; box-sizing: border-box; padding: 80px 0 0 0;}

@media screen and (max-width: 700px){
.brand-area {padding: 25px 15px;}
.brand-area::after {border-width: 0 0 125px 55px; left: 105px;}
.brand {width: 75px;}
.header-inner {height: 80px;}
}

.einleitung-master {width: 100%; position: relative; background-color: var(--grey);}
.einleitung-hd-format {width: 100%; max-width: 1920px; margin: 0 auto; position: relative;}
.einleitung-teiler {width: 50%; max-width: 960px; float: right; position: relative; height: 800px;}
.einleitung-bild .custom {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-position: center center;}
.einleitung_cont {position: absolute; top: 0; height: 100%;}
.ec_inner {position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 100%; height: auto;}
.ec_inner p, .cont-headline p {font-size: 20px; font-weight: bold; color: var(--green); margin: 0 0 20px 0; text-transform: uppercase;}
.ec_inner p::before, .cont-headline p::before {font-family: 'Font Awesome 5 Free'; content: "\f45c"; font-weight: bold; margin: 0 10px 0 0; font-size: 20px;}
.ec_inner h2 {font-size: 70px; font-weight: bold; color: var(--weiss); margin: 0 0 60px 0; text-transform: uppercase;}
.ec_inner a {box-sizing: border-box; padding: 10px 16px; background-color: var(--red); color: var(--weiss); text-decoration: none; text-transform: uppercase; font-size: 22px;}
.ec_inner a:hover {background-color: var(--green);}
.down-arrow {position: absolute; bottom: -40px; left: 50%; margin-left: -50px; width: 100px; height: 100px; background-color: var(--grey); transform: rotate(45deg);}

.einleitung-content-master {width: 100%; position: relative; background-color: var(--white);}
.einleitung-content-bild {width: 60.41666628%; max-width: 1160px; position: relative; z-index: 1;}
.einleitung-content-bild-right {float: right; width: 66.62499958%; max-width: 1260px; position: relative; z-index: 1;}
.ecb-zusatz {width: 39.58333372%; height: 150px; background-color: var(--white); position: absolute; right: 0; bottom: -150px;}
.ecb-zusatz-left {width: 39.58333372%; height: 150px; background-color: var(--white); position: absolute; left: 0; bottom: -150px;}

.einleitung-content-text {box-sizing: border-box; padding: 60px 40px; background-color: var(--grey); color: var(--weiss); position: relative; z-index: 2; max-width: 500px; float: right; margin-top: -440px; margin-right: 100px; border: 6px var(--weiss) solid;}
.einleitung-content-text-left {box-sizing: border-box; padding: 60px 40px; background-color: var(--grey); color: var(--weiss); position: relative; z-index: 2; max-width: 540px; margin-top: -440px; margin-right: 100px; border: 6px var(--weiss) solid; display: inline-block; width: 90%;}
.einleitung-content-text h2, .einleitung-content-text-left h2 {font-size: 60px; text-transform: uppercase; margin: 0;}
.einleitung-content-text h3, .einleitung-content-text-left h3 {font-size: 40px; margin: 0; position: relative; z-index: 1;}
.einleitung-content-text hr, .einleitung-content-text-left hr {width: 50%; height: 6px; color: var(--green); background-color: var(--green); border: 0; margin: 60px auto;}
.einleitung-content-text-left p {font-size: 36px; line-height: 38px; text-transform: uppercase; margin: 0; position: relative; z-index: 10;}
.einleitung-content-text-left h3 {margin: 0 0 60px 0;}

.einleitung-content-text-karriere {box-sizing: border-box; padding: 60px 40px; background-color: var(--grey); color: var(--weiss); position: relative; z-index: 2; max-width: 750px; margin-top: -440px; margin-right: 100px; border: 6px var(--weiss) solid; display: inline-block; width: 92%;}
.einleitung-content-text-karriere h2 {font-size: 60px; text-transform: uppercase; margin: 0;}
.einleitung-content-text-karriere h3 {font-size: 40px; margin: 0 0 40px 0; position: relative; z-index: 1;}
.einleitung-content-text-karriere hr {width: 50%; height: 6px; color: var(--green); background-color: var(--green); border: 0; margin: 60px auto;}
.einleitung-content-text-karriere p {font-size: 20px; line-height: 28px; margin: 0 0 40px 0;}

.bewerbungsbox {position: relative; float: right; background-color: var(--grey); box-sizing: border-box; padding: 30px; color: var(--weiss); margin-top: -220px; width: 50%; max-width: 620px;}
.bewerbungsbox h2 {font-size: 28px; margin: 0 0 5px 0;}
.bewerbungsbox p {font-size: 20px; line-height: 26px; margin: 0 0 30px 0;}
.bewerbungsform {width: 100%; max-width: 550px; margin: 0 auto;}

@media screen and (max-width: 1470px){
.bewerbungsbox {width: 75%; max-width: 800px; margin-top: 80px;}
}
@media screen and (max-width: 1435px){
.einleitung-content-bild-right {width: 80%;}
.einleitung-content-text-karriere {margin-top: -100px; margin-right: auto; margin-left: auto;}
}
@media screen and (max-width: 1200px){
.einleitung-content-text-left {max-width: 440px; margin-top: -240px;}
.einleitung-content-text-left h2 {font-size: 50px;}
.einleitung-content-text-left h3 {font-size: 30px; margin: 0 0 46px 0;}
.einleitung-content-text-left p {font-size: 26px; line-height: 26px;}
.einleitung-content-bild-right {width: 90%;}
}
@media screen and (max-width: 1150px){
.einleitung-teiler {width: 100%; max-width: none; float: none; height: 700px;}
.einleitung-bild .custom {background-size: cover;}
.einleitung-bild {height: 800px;}
.einleitung-content-text {margin-right: 0px; margin-top: -240px; max-width: 400px;}
.einleitung-content-bild {width: 80%;}
.einleitung-content-text h2 {font-size: 50px;}
.einleitung-content-text h3 {font-size: 30px;}
.ecb-zusatz {width: 30%;}
}
@media screen and (max-width: 1060px){
.nav-area {display: none;}
.einleitung-content-bild-right {width: 100%;}
.einleitung-content-text-left {margin-top: -80px;}
}
@media screen and (max-width: 840px){
.einleitung-content-text-left {margin-left: auto; margin-right: auto; margin-top: -5px; display: table;}
}
@media screen and (max-width: 790px){
.einleitung-content-bild {width: 94%;}
.einleitung-content-text h2 {font-size: 40px;}
.einleitung-content-text h3 {font-size: 20px;}
.ecb-zusatz {width: 10%;}
}
@media screen and (max-width: 755px){
.einleitung-content-text {margin-bottom: 100px;}
.bewerbungsbox {width: 90%;}
}
@media screen and (max-width: 665px){
.ec_inner h2 {font-size: 55px;}
}
@media screen and (max-width: 600px){
.einleitung-content-text {margin-top: -170px;}
.einleitung-content-bild {width: 100%;}
.einleitung-content-text-karriere h2 {font-size: 40px;}
.einleitung-content-text-karriere h3 {font-size: 24px;}
}
@media screen and (max-width: 500px){
.einleitung-content-text-left {top: 30px;}
.einleitung-content-text-karriere {margin-top: -80px; width: calc(100% + 12px); margin-left: -6px; padding: 60px 15px;}
.bewerbungsbox {width: 100%; float: none;}
}
@media screen and (max-width: 440px){
.ec_inner h2 {font-size: 40px;}
.einleitung-teiler {height: 600px;}
.einleitung-bild {height: 450px;}
.einleitung-content-text-left h2 {font-size: 40px;}
.einleitung-content-text-left h3 {font-size: 28px; margin: 0 0 46px 0;}
.einleitung-content-text-left p {font-size: 26px; line-height: 26px;}
}
@media screen and (max-width: 400px){
.ec_inner h2 {font-size: 36px;}
.einleitung-teiler {height: 600px;}
.einleitung-bild {height: 350px}
.einleitung-content-text {float: none; margin-left: auto; margin-right: auto;}
}




.row-fluid {position: absolute; top: 120px; width: 100%;}
.hg-colored {background: linear-gradient(var(--white) 500px, #fff 1px);}
.content {width: 92%; max-width: 1400px; margin: 150px auto 1px auto; position: relative;}
.margin0 {margin: 150px auto 1px auto;}
.margin50150 {margin: 50px auto 150px auto;}
.margin150 {margin: 150px auto;}
.margin0250 {margin: 0 0 250px 0;}
.margin00 {margin: 0;}
.display-yes {display: table;}
.display-no {display: none;}

@media screen and (max-width: 700px){
.row-fluid {top: 80px;}
}


/* welcome */
.welcome-image, .welcome-cont-image {margin: 0 auto; position: relative; z-index: 1;}
.welcome-image {max-width: 1200px; top: -50px;}
.welcome-cont-image {max-width: 1250px; top: -75px;}
.welcome-h1 {line-height: 40px; position: relative; z-index: 2; display: table; box-sizing: border-box; padding: 20px; background-color: var(--green); color: var(--white); margin: 0; border-color: var(--weiss); border-width: 0px 6px 6px 0px; border-style: solid;}
.we-love {font-size: 40px; text-transform: uppercase; font-weight: 100; margin: 0; display: contents;}
.heavy-metal {font-size: 40px; text-transform: uppercase; font-weight: 900; margin: 0; display: contents;}
.welcome-cont {position: relative; z-index: 2; width: 90%; max-width: 600px; box-sizing: border-box; padding: 25px 25px 35px 25px; background-color: var(--grey); color: var(--weiss); top: -180px; left: 55%; border: 6px var(--weiss) solid;}
.welcome-cont p {line-height: 28px; margin: 0 0 40px 0;}
.welcome-cont h2 {font-size: 34px; line-height: 34px; margin: 0 0 40px 0;}
.welcome-cont a, .service-field a {box-sizing: border-box; padding: 10px 16px; background-color: var(--red); color: var(--weiss); text-decoration: none; text-transform: uppercase; font-size: 20px;}
.welcome-cont a:hover, .service-field a:hover {background-color: var(--green);}

.cont-headline {position: relative; z-index: 2; width: 90%; max-width: 650px; box-sizing: border-box; padding: 35px 25px; background-color: var(--grey); margin-top: -180px; margin-bottom: 60px; float: right; border-color: var(--weiss); border-width: 6px 0 0 6px; border-style: solid;}
.cont-headline h1 {font-size: 38px; line-height: 36px; margin: 0; text-transform: uppercase; color: var(--weiss);}

.contentfeld {width: 55%; max-width: 750px; background-color: var(--grey); color: var(--weiss); box-sizing: border-box; padding: 55px 25px;}
.contentfeld p, .cb-text p {line-height: 28px; margin: 0 0 40px 0;}
.contentfeld ul, .cb-text ul {margin: 0 0 40px 0;}
/*
.contentfeld li, .cb-text li {list-style-type: none; line-height: 28px;}
.contentfeld li::before, .cb-text li::before {font-family: 'Font Awesome 5 Free'; content: "\f45c"; font-weight: bold; margin: 0 10px 0 0; font-size: 18px; color: var(--green);}
*/
.contentfeld li, .cb-text li {list-style: none; padding: 0px 0 0px 32px; background-image: url(../../../images/elemente/list-quader.svg); background-repeat: no-repeat; background-position: left 3px; background-size: 20px; margin: 0 0 18px 0;}
.contentfeld a, .cb-text a {color: var(--green); text-decoration: none;}
.contentfeld a:hover, .cb-text a:hover {color: var(--red);}
.contentbild {width: 55%; max-width: 750px; float: right; margin: -50px 0 60px 0; z-index: 1; border-width: 6px 0px 0px 6px; border-color: var(--weiss); border-style: solid;}
.cb-text {background-color: var(--grey); box-sizing: border-box; padding: 55px 25px; color: var(--weiss);}
.cf-abstand {margin: 0 0 60px 0; display: inline-block;}

@media screen and (max-width: 1330px){
.welcome-cont {left: 40%;}
.welcome-cont-image {max-width: 1050px;}
}
@media screen and (max-width: 1020px){
.welcome-cont {left: auto; margin: 0 auto 100px auto; top: -150px;}
.cont-headline {margin-top: -100px;}
.contentfeld ul {margin: 0 0 40px -40px;}
}
@media screen and (max-width: 945px){
.hg-colored {background: linear-gradient(var(--white) 400px, #fff 1px);}
}
@media screen and (max-width: 755px){
.contentfeld, .contentbild {width: 90%;}
}
@media screen and (max-width: 720px){
.cont-headline {width: 60%;}
}
@media screen and (max-width: 670px){
.welcome-cont-image {top: -35px;}
.cont-headline {margin-top: -60px; border-width: 6px 6px 0 6px; min-width: 370px;}
.welcome-cont-image img {width: 108%; margin: 0 -4%;}
.hg-colored {background: linear-gradient(var(--white) 350px, #fff 1px);}
}
@media screen and (max-width: 560px){
.we-love, .heavy-metal {font-size: 30px;}
.welcome-h1 {line-height: 30px;}
}
@media screen and (max-width: 500px){
.welcome-cont {top: -50px; border: 0; width: 100%; margin: 0 auto 170px auto;}
.welcome-image {top: -20px;}
}
@media screen and (max-width: 460px){
.contentfeld, .contentbild {width: 95%;}
.hg-colored {background: linear-gradient(var(--white) 300px, #fff 1px);}
}
@media screen and (max-width: 421px){
.service-field a {font-size: 18px; padding: 8px 12px;}
}
@media screen and (max-width: 400px){
.cont-headline {min-width: 0px; width: 100%;}
.cont-headline h1 {font-size: 30px;}
}
@media screen and (max-width: 380px){
.service-field a {font-size: 17px; padding: 8px 10px;}
}
@media screen and (max-width: 356px){
.service-field a {padding: 8px 6px;}
}


.kontakt-einleitung {position: relative;}
.kontakt-einleitung .welcome-h1 {position: absolute; top: 50%; transform: translateY(-50%); left: 16%; z-index: 10; border-color: var(--white); border-width: 6px 6px 6px 0px; border-style: solid;}
.kontakt-einleitung .heavy-metal {font-size: 50px; line-height: 50px;}
.kontakt-einleitungsbild {width: 86%; max-width: 1000px; float: right; margin-top: -50px; position: relative; z-index: 1;}
.kontakt-brand {width: 25%; max-width: 100px; margin: 40px 0;}
.k-teiler-left, .k-teiler-right {width: 50%; max-width: 700px; float: left;}
.k-teiler-left p {margin: 0 0 40px 0; font-size: 24px; line-height: 32px;}
.k-teiler-right p {font-size: 34px; line-height: 60px; margin: 0 0 40px 0; font-weight: 900;}
.k-teiler-right .fas, .k-teiler-right .far {width: 54px; line-height: 44px; text-align: center; margin-right: 20px; box-sizing: border-box; padding: 5px 10px; background-color: var(--green); color: var(--weiss);}
.k-teiler-right a {color: var(--grey); text-decoration: none;}
.k-teiler-right a:hover {color: var(--red);}

@media screen and (max-width: 1320px){
.kontakt-einleitung .welcome-h1 {left: 0;}
}
@media screen and (max-width: 815px){
.k-teiler-left, .k-teiler-right {width: 100%; float: none;}
.k-teiler-left {margin-bottom: 60px;}
}
@media screen and (max-width: 760px){
.kontakt-einleitungsbild {float: none; width: calc(100% + 8%); margin-left: -4%;}
.kontakt-einleitung .welcome-h1 {left: -4%; top: auto; bottom: -114px;}
.kontakt-brand {margin: 100px 0 40px 0;}
}
@media screen and (max-width: 560px){
.kontakt-einleitung .heavy-metal {font-size: 30px; line-height: 30px;}
}
@media screen and (max-width: 407px){
.k-teiler-right p {font-size: 28px;}
.kontakt-einleitung .welcome-h1 {top: 114%; bottom: auto;}
.kontakt-brand {margin: 140px 0 40px 0;}
}


.standort {position: relative;}
.standort i {width: 20px; text-align: center; margin-right: 10px;}
.standort h2 {font-size: 30px; margin: 0 0 40px 0; box-sizing: border-box; padding: 6px 10px; display: table; background-color: var(--green);}
.standort h3 {font-size: 23px; margin: 0 0 40px 0;}
.standort p:last-child {margin: 0 0 1px 0;}
.standort hr {height: 6px; border: 0; color: var(--green); background-color: var(--green); width: 50%; margin: 40px 0;}

.location-box-l, .location-box-r {position: absolute; top: 50%; transform: translateY(-50%); width: 300px;}
.location-box-l {left: -300px;}
.location-box-r {right: -300px;}
.dot-line-l, .dot-line-r {position: absolute; top: 50%; transform: translateY(-50%); width: 210px; height: 1px; box-sizing: border-box; border-top: 5px var(--grey) dotted;}
.dot-line-l {right: 0px;}
.dot-line-r {left: 0px;}
.location-btn .pulser {position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 50%; box-shadow: 0 0 0 0 rgba(74, 74, 74, 0.7); transform: scale(1); animation: pulse 2s infinite; background: var(--grey);}
.location-btn {background-color: var(--grey); width: 90px; height: 90px; border-radius: 50%; font-size: 40px; line-height: 90px; text-align: center; color: var(--weiss); position: absolute; top: -45px; cursor: pointer;}
.lb-r {left: 210px;}
.lb-l {right: 210px;}
.location-btn .fas {display: table; margin: 25% auto; color: #ffffff; position: relative; z-index: 1;}
@keyframes pulse {
0% {transform: scale(0.95); box-shadow: 0 0 0 0 rgba(74, 74, 74, 0.7);}
70% {transform: scale(1); box-shadow: 0 0 0 20px rgba(74, 74, 74, 0);}
100% {transform: scale(0.95); box-shadow: 0 0 0 0 rgba(74, 74, 74, 0);}
}

@media screen and (max-width: 755px){
.location-box-l, .location-box-r {top: 5px; transform: translateY(0); width: 50px;}
.location-box-l {left: auto; right: -5px;}
.location-box-r {right: -5px;}
.dot-line-l, .dot-line-r {display: none;}
.location-btn .pulser {box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7); animation: mobilpulse 2s infinite; background: var(--weiss);}
.location-btn {width: 30px; height: 30px; font-size: 18px; color: var(--grey); top: 7px; background-color: var(--weiss);}
.location-btn .fas {color: var(--grey); margin: 20% auto;}
.lb-r {left: auto;}
.lb-l {right: auto;}
}
@keyframes mobilpulse {
0% {transform: scale(0.95); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7);}
70% {transform: scale(1); box-shadow: 0 0 0 10px rgba(255, 255, 255, 0);}
100% {transform: scale(0.95); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);}
}

.about-cont1 {margin: 140px 0 0 0;}
.about-cont2 {margin: 140px 0;}
.about-cont22 {margin: -40px 0; display: inline-block;}
.about-cont3 {margin: -60px 0 80px 0; display: inline-block;}
.about-cont3b {margin: -80px 0 0 0;}
.about-cont4 {margin: 500px 0 0 0;}
.top-40 {margin: -40px 0 0 0;}
.top450 {margin: 450px 0 0 0;}
.about-cont2 .top500 {margin: 500px 0 0 0;}
.about-cont3 .top800 {margin: 800px 0 0 0;}
.about-cont3 .top1200 {margin: 1200px 0 -50px 0;}
.about-teiler {width: 50%; max-width: 700px; float: left; background-color: var(--grey); box-sizing: border-box; position: relative; color: var(--weiss);}
.about-inner {padding: 55px 75px;}
.about-inner p {line-height: 28px; margin: 0 0 40px 0;}
.about-inner h2 {font-size: 30px; margin: 0 0 40px 0;}
.about-fb a {color: var(--white); font-size: 100px; text-align: center; margin: 0 auto; display: table;}
.about-fb a:hover {color: var(--red);}
.about-green {background-color: var(--green);}
.about-red {background-color: var(--red);}
.about-white {background-color: var(--white); color: var(--grey);}
.about-we-love {position: absolute; right: -6px; top: -100px;}
.about-we-love .welcome-h1 {border-color: var(--weiss); border-width: 6px 6px 0px 6px; border-style: solid;}

@media screen and (max-width: 965px){
.about-inner {padding: 55px 25px;}
}
@media screen and (max-width: 840px){
.about-we-love {right: 20%;}
.about-we-love .welcome-h1 {border-width: 6px;}
.about-teiler {width: 90%; max-width: none;}
.about-teiler:nth-child(2) {margin-left: 10%;}
.top-40 {margin: 40px 0 0 0;}
.top450 {margin: -50px 0 150px 0;}
.about-cont3 .top800, .about-cont3 .top1200, .about-cont4 {margin: -50px 0 150px 4%;}
}
@media screen and (max-width: 500px){
.about-we-love {top: -60px; right: 0.5%;}
}
@media screen and (max-width: 450px){
.about-teiler {width: 96%; max-width: none;}
.about-teiler:nth-child(2) {margin-left: 4%;}
}


.download-h2 {box-sizing: border-box; padding: 10px 14px; display: table; background-color: var(--green); color: var(--weiss);}
.download-btn-box {width: 30.4761903%; max-width: 426.6666667px; float: left; background-color: var(--grey); color: var(--weiss); box-sizing: border-box; padding: 50px 20px; margin-right: 2.85714284%; text-align: center; margin-bottom: 40px;}
.download-btn-box p {margin: 0 0 40px 0;}
.download-btn {font-size: 70px; color: var(--white); width: 120px; height: 120px; border-radius: 50%; border: 8px var(--white) solid; margin: 0 auto; display: block; line-height: 120px; text-align: center;}
.download-btn:hover {color: var(--green); border-color: var(--green);}
.download-rows {margin: 0 0 40px 0;}
.download-new {margin: 0 0 100px 0;}
.download-end {margin: 0 0 250px 0;}

@media screen and (max-width: 921px){
.download-btn-box {width: 45%;}
}
@media screen and (max-width: 530px){
.download-btn-box {width: 92%; float: none;margin-right: auto; margin-left: auto; max-width: 300px;}
}


/* Google Maps - Alle Standorte */
.auswahl-standorte-lb {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(74,74,74,0.95); display: none; z-index: 665555;}
.auswahl-standorte {position: absolute; top: 10%; left: 0; width: 100%; height: 90%;}
.auswahl-standorte iframe {width: 100%; height: 100%;}
.google-standort {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.closer-as {width: 30%; max-width: 20px; cursor: pointer; position: absolute; top: 30px; right: 30px;}




/* service */
.service-master {width: 100%; padding: 50px 0; background-color: var(--white); position: relative;}
.service-hg-anhang {width: 40%; height: 150px; background-color: var(--white); position: absolute; left: 0; top: -150px;}
.service-hg-anhang2 {width: 40%; height: 150px; background-color: var(--white); position: absolute; right: 0; bottom: -150px;}
.service-inner {width: 92%; max-width: 1400px; margin: 0 auto; position: relative;}
.service-h2 {line-height: 40px; position: relative; z-index: 2; display: table; box-sizing: border-box; margin: 0; top: -150px;}
.service-fields {width: 100%; box-sizing: border-box; position: relative; margin-bottom: 55px;}
.service-field {position: relative; width: 30.71428553%; max-width: 430px; float: left; box-sizing: border-box; padding: 60px 20px 20px 20px; background-color: var(--grey); color: var(--weiss); min-height: 500px;}
.service-field:nth-child(2) {margin: 0 3.928571405%;}
.service-field h3 {font-size: 30px; text-transform: uppercase; color: var(--weiss); margin: 0 0 40px 0; height: 74px;}
.service-field p {margin: 0 0 40px 0; line-height: 28px;}
.service-icon {width: 100px; height: 100px; box-sizing: border-box; padding: 10px; background-color: var(--green); position: absolute; top: -15px; right: -15px; border-color: var(--white); border-width: 0px 0px 6px 6px; border-style: solid;}

.service-cont-icon {width: 150px; height: 150px; box-sizing: border-box; padding: 15px; background-color: var(--green); position: relative; z-index: 2; border-color: var(--white); border-width: 0px 6px 6px 0px; border-style: solid;}
.service-field .l-btn {position: absolute; left: 20px; bottom: 10px;}

@media screen and (max-width: 1330px){
.service-field {width: 100%; max-width: none; float: none; min-height: 1px; margin: 0 auto 30px auto;}
.service-field:nth-child(2) {margin: 0 auto 30px auto;}
.service-fields {margin-bottom: auto;}
.service-field .l-btn {position: relative; left: auto; bottom: auto;}
}
@media screen and (max-width: 670px){
.service-hg-anhang {width: 50%;}
.service-cont-icon {width: 90px; height: 90px; border-width: 0px 6px 6px 6px; padding: 8px; display: inline-flex;}
}
@media screen and (max-width: 560px){
.service-h2 {line-height: 30px;}
}
@media screen and (max-width: 460px){
.service-icon {width: 75px; height: 75px; padding: 6px; top: -20px; right: -10px;}
}
@media screen and (max-width: 430px){
.service-hg-anhang {width: 60%;}
}
@media screen and (max-width: 390px){
.service-hg-anhang2 {width: 20%;}
}


/* karriere */
.karriere-master {width: 100%; position: relative;}
.karriere-boxes {width: 50%; float: left; position: relative;}
.karriere-hg-anhang {width: 50%; height: 150px; background-color: var(--white); position: absolute; right: 0; top: 0;}
.karriere-cont {width: 80%; max-width: 750px; position: relative; box-sizing: border-box; padding: 125px 25px 35px 25px; background-color: var(--grey); color: var(--weiss); margin-top: 260px; left: -60px; border-width: 6px 0px 6px 6px; border-style: solid; border-color: var(--weiss);}
.karriere-h3 {line-height: 40px; position: absolute; z-index: 2; display: table; box-sizing: border-box; padding: 20px; background-color: var(--green); color: var(--white); margin: 0; border: 6px var(--weiss) solid; top: -60px; left: -50px;}
.karriere-standort {font-size: 14px;}
.karriere-standort .fas {margin: 0 5px 0 0;}
.karriere-link {color: var(--weiss); text-decoration: none; font-weight: 900; font-size: 18px;}
.karriere-link:hover {color: var(--green);}
.karriere-cont ul, .jobs-cont ul {margin: 0 0 20px -40px;}
.karriere-cont li, .jobs-cont li {list-style: none; padding: 0px 0 0px 32px; background-image: url(../../../images/elemente/list-pfeil.svg); background-repeat: no-repeat; background-position: left 3px; background-size: 20px; margin: 0 0 18px 0;}
.karriere-cont p {margin: 0 0 40px 0;}
.karriere-slogan {}

.stellenbeschreibung {box-sizing: border-box; padding: 55px 40px; position: relative; background-color: var(--white);}
.stellenbeschreibung::after {content: ""; width: 60px; height: 60px; background-color: var(--green); border: 6px var(--weiss) solid; position: absolute; top: -15px; right: -15px;}
.ankerpunkt150 {position: absolute; left: 0; top: -150px; width: 0; height: 0;}
.sb-first {margin: 100px 0 50px 0;}
.sb-other {margin: 50px 0;}
.sb-last {margin: 50px 0 250px 0;}
.sb-alone {margin: 100px 0 250px 0;}
.stellenbeschreibung h2 {font-size: 30px; margin: 0 0 40px 0; box-sizing: border-box; padding: 10px 14px; background-color: var(--green); color: var(--weiss); display: table;}
.stellenbeschreibung p {margin: 0 0 40px 0; line-height: 28px;}
.stellenbeschreibung ul {margin: -30px 0 40px -20px;}
.stellenbeschreibung li {line-height: 28px; list-style-type: none;}
.stellenbeschreibung li::before {content: "\f101"; font-family: 'Font Awesome 5 Free'; color: var(--green); font-weight: bold; margin-right: 10px;}
.k-lighter {box-sizing: border-box; padding: 25px; background-color: var(--weiss); border-left: 6px var(--green) solid;}
.k-darker {box-sizing: border-box; padding: 25px; background-color: var(--grey); color: var(--white); margin: 0 0 1px 0!important;}
.k-darker a {color: var(--green); text-decoration: none;}
.k-darker a:hover {color: var(--red);}
@media screen and (max-width: 1525px){
.karriere-cont {width: 90%;}
}
@media screen and (max-width: 1360px){
.karriere-boxes:first-child {width: 70%;}
.karriere-boxes:last-child {width: 30%;}
.karriere-cont {width: 190%; margin-top: 560px; left: -460px;}
}
@media screen and (max-width: 1075px){
.karriere-boxes:first-child {width: 80%;}
.karriere-boxes:last-child {width: 92%;}
.karriere-boxes {float: none;}
.karriere-hg-anhang {width: 20%;}
.karriere-cont {width: 100%; margin-top: -50px; left: 50px; margin-left: auto; margin-right: auto;}
.stellenbeschreibung::after {width: 30px; height: 30px;}
}
@media screen and (max-width: 800px){
.karriere-boxes:first-child {width: 90%;}
.karriere-boxes:last-child {width: 92%;}
.karriere-boxes {float: none;}
.karriere-hg-anhang {width: 10%;}
.karriere-cont {width: 100%; margin-top: 10px; left: 8%; border: 0;}
}
@media screen and (max-width: 560px){
.karriere-h3 {line-height: 30px; left: -30px;}
}
@media screen and (max-width: 500px){
.stellenbeschreibung {padding: 55px 15px;}
}
@media screen and (max-width: 420px){
.karriere-boxes:first-child {width: 94%;}
.karriere-boxes:last-child {width: 94%;}
.karriere-boxes {float: none;}
.karriere-hg-anhang {width: 6%;}
.karriere-cont {width: 100%; margin-top: 10px; left: 6%; border: 0;}
}


/* karusell */
.karusell-master {width: 92%; max-width: 1400px; margin: 120px auto 280px auto; overflow: hidden;}
.karusell-master .slider_item img {filter: grayscale(100%);}
.karusell-master .slider_item img:hover {filter: grayscale(0%);}
.karusell-header {box-sizing: border-box; padding: 20px; line-height: 40px; z-index: 1; background-color: var(--green); color: var(--white); margin: 0; display: table; position: relative;}
.karusell-header h3 {font-size: 30px; text-transform: uppercase; color: var(--white); margin: 0; height: 74px; display: table;}
.karusell-header-box {border-bottom: 6px var(--green) solid;}
.karusell {}
.partner-slogan {line-height: 100px; color: var(--weiss); box-sizing: border-box; padding: 0 30px; float: right; background-color: var(--green); display: table;}
.partner-slogan h4 {font-size: 30px; text-transform: uppercase; margin: 0;}
.partner-box {border-top: 6px var(--green) solid;}
@media screen and (max-width: 587px){
.partner-slogan h4 {font-size: 20px;}
}
@media screen and (max-width: 560px){
.karusell-header {line-height: 30px;}
}
@media screen and (max-width: 413px){
.partner-slogan h4 {font-size: 16px;}
}


/* footer */
.footer {width: 100%; box-sizing: border-box; padding: 30px 0 50px 0; background-color: var(--grey); position: relative;}
.footer-hg-anhang {width: 40%; background-color: var(--grey); height: 150px; position: absolute; left: 0; top: -150px;}
.footer-inner {width: 92%; max-width: 1400px; margin: 0 auto; position: relative; color: var(--white);}
.footer-teiler {width: 50%; max-width: 700px; float: left; position: relative;}
.footer-inner h2 {font-size: 40px; text-transform: uppercase; color: var(--white); position: absolute; left: 0; top: -175px;}
.footer-inner a.standorte {color: var(--white); text-decoration: none; margin-right: 15px;}
.footer-inner a.standorte:hover {color: var(--green);}
.footer-inner .logo {width: 25%; max-width: 70px; margin: 0 0 30px 0;}
.footer-inner .logo2 {width: 20%; max-width: 50px; margin: 0 0 20px 0;}
.footer-inner .p30 {margin: 0 0 30px 0; font-size: 20px; line-height: 28px;}
.footer-inner .p20 {margin: 0 0 20px 0; font-size: 16px; line-height: 24px;}
.footer-inner .fas, .footer-inner .far {width: 20px; margin-right: 15px; font-size: 18px;}
.footer-inner .pInfo {font-size: 14px; max-width: 50%; margin: 0 0 50px 0;}
.footer-btn {box-sizing: border-box; padding: 10px 16px; background-color: var(--white); color: var(--grey); text-decoration: none; text-transform: uppercase; font-size: 20px;}
.footer-btn-smal {box-sizing: border-box; padding: 8px 14px; background-color: var(--white); color: var(--grey); text-decoration: none; text-transform: uppercase; font-size: 16px;}
.footer-btn:hover, .footer-btn-smal:hover {background-color: var(--green); color: var(--weiss);}
.footer-inner hr {height: 4px; border: 0; color: var(--white); background-color: var(--white); margin: 40px 0;}
.footer-inner h3 {font-size: 24px; color: var(--white); margin: 0 0 40px 0;}
.footer-teiler3 {width: 32.85714266%; max-width: 460px; float: left; position: relative;}

.footer-infos {float: right;}
.footer-info1 div.clearer {width: 200px;}
.footer-info1 a {color: var(--grey); text-decoration: none;}
.footer-info1 .fb-nav-btn::after {background-color: var(--grey);}
.footer-info1 .fb-nav-btn:hover {background-color: var(--green);}
.footer-info1 .fb-nav-btn:hover::after {color: var(--green);}
.footer-info1 .fb-nav-btn {margin: 0 0 10px 0;}
.footer-info1 .fb-nav-btn:first-child {margin: 0 10px 10px 30px;}
.footer-info2 {font-size: 16px;}
.footer-info2 a {text-decoration: none; color: var(--white);}
.footer-info2 a:hover, .agb-footer-btn:hover {color: var(--green);}
.footer-sitename {position: absolute; left: 0; bottom: 0; font-size: 16px;}
.agb-footer-btn {cursor: pointer; color: var(--white);}

@media screen and (max-width: 901px){
.footer-teiler3 {width: 100%; float: none; margin-top: 70px;}
.footer-teiler3:first-child {margin-top: 0px;}
}
@media screen and (max-width: 640px){
.footer-teiler {width: 100%; float: none;}
.footer-teiler:first-child {margin-bottom: 100px;}
}
@media screen and (max-width: 595px){
.footer-infos {float: none; margin-bottom: 60px;}
.footer-info1 .fb-nav-btn:first-child {margin: 0 10px 10px 0px;}
}
@media screen and (max-width: 480px){
.footer-hg-anhang {width: 50%;}
}
@media screen and (max-width: 380px){
.footer-hg-anhang {width: 60%;}
}


/* GoogleMaps */
.googlemaps-master {width: 86.45833278%; max-width: 1660px; position: relative; margin: -80px 0 100px 0; display: table;z-index: 10; box-sizing: border-box; border-width: 6px 6px 0px 0px; border-style: solid; border-color: var(--weiss);}


/* Infofeld */
.infofeld-master {width: 100%; margin: 100px 0 100px 0;}
.infofeld-inner {width: 92%; max-width: 1400px; margin: 0 auto;}
.infofeld {float: right; width: 50%; max-width: 700px;}
.infofeld h3 {margin: 0 0 40px 0; font-size: 26px;}
.infofeld p {margin: 0 0 40px 0; line-height: 24px; font-size: 16px;}
.infofeld .fas, .infofeld .far {width: 20px; margin-right: 15px;}
.infofeld a {color: var(--grey); text-decoration: none;}
.infofeld a:hover {color: var(--red);}


/* Galerie */
.galerie-master {position: relative;}
.galerie-topper0 {margin: 0 0 250px 0;}
.galerie-topper80 {margin: -85px 0 250px 0;}
.galerie-topper35 {margin: -35px 0 250px 0;}
.galerie-h2 {position: absolute; left: 0; top: -101px; box-sizing: border-box; padding: 15px 20px; background-color: var(--red);}
.galerie-h2 h2 {font-size: 36px; text-transform: uppercase; color: var(--white); line-height: 36px; margin: 0;}


/* Impressum */
.dienstanbieter {box-sizing: border-box; padding: 8px 14px; background-color: var(--green); color: var(--white); margin: 0 0 100px 0; display: table; font-size: 30px;}
.impressum-h2 {font-size: 40px; margin: 0 0 40px 0;}
.widerspruch {margin: 0 0 40px 0;}
.impress-master-box {margin: 60px 0;}
.impressbox-left, .impressbox-right {float: left; width: 55%; max-width: 770px; box-sizing: border-box;}
.impressbox-left {padding: 80px 20px 10px 20px; position: relative; background-color: var(--grey); color: var(--weiss);}
.impressbox-right {margin: 50px 0 0 -10%; padding: 20px 20px 10px 20px; background-color: var(--white); position: relative; z-index: 10; border-width: 6px 0px 6px 6px; border-style: solid; border-color: var(--weiss);}
.impress-brand {width: 25%; max-width: 100px; margin: 40px 0; background-color: var(--weiss); padding: 6px; border-radius: 50%; position: absolute; left: 20px; top: -100px;}
.impressbox-left p, .impressbox-right p {margin: 0 0 40px 0; line-height: 28px;}
.impressbox-left .fas, .impressbox-left .far, .impressbox-right .far {width: 20px; margin-right: 15px;}
.impressbox-left a {color: var(--weiss); text-decoration: none;} 
.impressbox-right a {color: var(--grey); text-decoration: none;}
.impressbox-left a:hover, .impressbox-right a:hover {color: var(--green);}
.haftungsausschluss {margin: 60px 0;}
.haftungsausschluss h2 {font-size: 26px; margin: 0 0 40px 0;}
.haftungsausschluss p {font-size: 18px; line-height: 26px; margin: 0 0 40px 0;}
.buntsucht {box-sizing: border-box; padding: 30px 20px; display: table; float: right; background-color: var(--grey); color: var(--weiss); margin: 60px 0 -10px 0;}
.buntsucht h2 {font-size: 26px; margin: 0 0 40px 0;}
.buntsucht p {margin: 0 0 40px 0;}
.buntsucht a {color: var(--weiss); text-decoration: none;}
.buntsucht a:hover {color: var(--green);}

@media screen and (max-width: 1340px){
.impressum-h2 {margin: 100px 0 40px 0;}
}
@media screen and (max-width: 1054px){
.buntsucht {margin: 60px 0;}
}
@media screen and (max-width: 955px){
.impressbox-left, .impressbox-right {float: none; width: 75%;}
.impressbox-right {margin: -20px 0 0 0; float: right;}
}
@media screen and (max-width: 594px){
.impressbox-left, .impressbox-right {width: 92%;}
}
@media screen and (max-width: 488px){
.impressbox-left, .impressbox-right {width: 98%;}
}
@media screen and (max-width: 412px){
.impressbox-left p, .impressbox-right p {font-size: 18px; line-height: 26px;}
.impressbox-left .fas, .impressbox-left .far, .impressbox-right .far {margin-right: 7px;}
}

/* Datenschutz */
.datenschutz-master {margin: 50px 0 250px 0;}
.datenschutz-master h2 {font-size: 30px; margin: 0 0 40px 0;}
.datenschutz-master h3 {font-size: 26px; margin: 0 0 40px 0;}
.datenschutz-master h4 {font-size: 22px; margin: 0 0 40px 0;}
.datenschutz-master p {font-size: 18px; margin: 0 0 40px 0; line-height: 26px;}
.datenschutz-master a {color: var(--green); text-decoration: none;}
.datenschutz-master a:hover {color: var(--red);}
.datenschutz-master ul {margin: 0 0 40px 0;}
.datenschutz-master li {font-size: 18px; line-height: 26px;}
.hd-datenschutz {width: 100%; max-width: 450px; margin: 0 0 40px 0;}
.hd-d {background-color: var(--white); box-sizing: border-box; display: table; padding: 6px 10px;}

/* AGB */
.agb-master {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(255,255,255,0.85); z-index: 555555;}
.agb-inner {width: 90%; max-width: 500px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background-color: var(--grey); color: var(--weiss); box-sizing: border-box; padding: 30px 20px;}
.agb-inner h2 {font-size: 30px; margin: 0 0 40px 0;}
.agb-inner p {font-size: 17px; line-height: 25px; margin: 0 0 40px 0;}
.agb-inner a {color: var(--green); text-decoration: none;}
.agb-inner a:hover {color: var(--red);}
.agb-close {position: absolute; top: 30px; right: 20px; font-size: 20px; color: var(--weiss); cursor: pointer; transform: rotate(0deg); -webkit-transition: all .3s ease; transition: all .3s ease;}
.agb-close:hover {transform: rotate(90deg); -webkit-transition: all .3s ease; transition: all .3s ease;}

/* Alle Standorte - Button */
.alle-standorte {position: fixed; right: 0; top: 30%; transform: translateY(-50%); background-color: var(--green); color: var(--white); z-index: 554433; font-size: 38px; box-sizing: border-box; padding: 10px 15px; cursor: pointer; -webkit-transition: all .3s ease; transition: all .3s ease;}
.alle-standorte:hover {background-color: var(--red); -webkit-transition: all .3s ease; transition: all .3s ease;}
@media screen and (max-width: 750px){
.alle-standorte {top: auto; transform: translateY(0); bottom: 15px; font-size: 28px; padding: 7px 12px;}
}

/* Aufrecht */
.aufrecht {position: fixed; width: 100%; height: 100%; background-color: rgba(80,83,80,0.95); top: 0; left: 0; display: none; z-index: 665566;}
.aufrecht p {color: var(--weiss); margin: 0; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center;}
.aufrecht .fas {margin: 0 5px;}
@media screen and (max-height: 450px){
.aufrecht {display: block;}
}