:root{
    --light: #f5f5f5;
    --red: #EB1F06;
    --red-hover: #b9010e;
    --dark: #272727;
    --white: #ffffff;
    --black: #010316;
    --lightgrey: #E2E2E2;
    --green: #46b450;
    --green-hover: #389e42;

    --timeline-circle-size: 80px;
    --timeline-line-height: 2px;
    --timeline-line-color: #ccc;
}


body,html,*{font-size:18px;line-height:1.7;font-family:'Encode Sans';font-weight:400;}
html{scroll-behavior: smooth;}
body{overflow-x: hidden !important;}

a{color:var(--black);text-decoration:none;font-size:100%;transition:all .3s ease;}
a:hover{text-decoration:none;color:var(--red);transition:all .3s ease;}
a:focus{text-decoration:none;}
p a{text-decoration: underline;}
p a:hover{color: var(--red);}
li{list-style:none;padding-left:30px;position:relative;}
li:before{content:'';width:20px;height:20px;display:block;background:url('media/checkmark.svg');background-repeat:no-repeat;background-size:100%;background-position:center;position:absolute;top:5px;left:0;}
#BorlabsCookieBox li::before{display: none;}

ul{padding:0;margin:0;}

img{max-width:100%;height:auto;}

p{color: var(--dark);}

.grid-5{display: grid; grid-template-columns: repeat(5, 1fr); gap: 1.5rem}

h1{font-size:325%;font-weight:600;display:block;position:relative;color:var(--black);margin:0;line-height:1.2;}
h2{font-size:225%;font-weight:600;display:block;color:var(--black);margin:0;line-height:1.2;}
h3{font-size:150%;font-weight:600;display:block;color:var(--black);margin:0;line-height:1.2;}

.headline{font-weight:600;display:block;color:var(--black);margin:0;line-height:1.2;padding-bottom: 30px;}
.subline{font-size:115%;font-weight:600;display:block;color:var(--black);}
.topline{color: var(--red); width: fit-content; padding-left: 90px; position: relative; font-weight: 400; padding-bottom: 15px;}
.topline::before{content: ''; display: block; position: absolute; width: 55px; height: 2px; padding-right: 15px; background-color: var(--red); left: 0; top: 16px;}
/* .topline::after{content: ''; display: block; position: absolute; width: 8px; height: 8px; border-radius: 8px; background-color: var(--red); left: 26px; top: 13px;} */

.headline.dark{color: var(--white);}
.headline.center{width: 100%; text-align: center; padding-top: 25px;}

.headerbtn{position:relative; display: block; width: fit-content; border:solid 2px var(--red);padding:8px 50px; font-weight: 500; border-radius: 0; font-size:1.1rem; background:var(--red);color:var(--white);transition:all .3s ease;line-height:1.2;text-align:center;}
.headerbtn:hover{background:var(--red-hover);transition:all .3s ease;color:var(--white);}

.btn{color: var(--red); font-weight: 600; transition: all 0.3s ease; position: relative;padding-left: 50px;}
.btn:hover{color: var(--red-hover);}
.btn::before{content: ''; display: block; position: absolute; left: 0; background: url('media/button_arrow.png'); background-repeat: no-repeat; background-size: contain; height: 30px; width: 30px; transition: all 0.3s ease;}
.btn:hover::before{left: 10px;}

strong{font-weight:600;font-size:100%;}
.center{margin: 0 auto; display: block; width: fit-content;}

/* .container{max-width:1500px;}
.container.wide{max-width:1800px;} */

.btn.tuer::before{display: none;}
.btn.tuer{ display: inline-block; padding: 0.75rem 1.5rem; background-color: var(--red); color: #ffffff; border: none; border-radius: 4px; font-size: 1rem; 
    font-weight: 600; text-align: center; text-decoration: none; cursor: pointer; transition: background-color 0.25s ease, transform 0.15s ease; margin: 20px 0;}
.btn.tuer:hover,.btn.tuer:focus {background-color: var(--red-hover);}
.btn.tuer:active {transform: translateY(1px);}
.btn.tuer:disabled {opacity: 0.6;cursor: not-allowed;}

.download-link{display: block; position: relative; padding-left: 25px;}
.download-link::before{content:'';width:20px;height:20px;display:block;background:url('media/download.svg');background-repeat:no-repeat;background-size:100%;background-position:center;position:absolute;top:5px;left:0;}


/*------------------------------------Header-------------------------------------------------*/

#page-header{position:absolute;top:0;right:0;left:0;padding:15px 0;background:var(--white);z-index:999;}

#page-header .logo img{width: auto; height: 75px;}
#page-header .infos{text-align: end;}
#page-header .infos a{padding-left: 75px; position: relative;}
#page-header .infos a::before{content: ''; display: block; position: absolute; background-repeat: no-repeat; background-size: contain; width: 20px; height: 20px; left: 47px; top: 4px;}
#page-header .infos .email::before{background-image: url("media/mail.svg"); top: 6px;}
#page-header .infos .telefon::before{background-image: url("media/telefon.svg"); width: 18px; height: 18px;}

#page-header #toppermenu{top: 50%; position: relative; transform: translateY(-50%);}
#page-header #toppermenu .menu{text-align: end;}
#page-header #toppermenu .menu li{display: inline-block; padding-left: 60px;}
#page-header #toppermenu .menu li::before{display: none;}
#page-header #toppermenu .menu li a{padding:30px 0;text-decoration:none;position:relative; font-weight: 500; font-size: 1.1rem; color: var(--black);}
#page-header #toppermenu .menu li a::before{content: '';position: absolute;width: 100%;height: 2px;background-color: var(--red);bottom: 25px;left: 0;transform-origin: right;transform: scaleX(0);transition: transform .3s ease-in-out;}
#page-header #toppermenu .menu li a:hover::before{transform-origin: left;transform: scaleX(1);}
#page-header #toppermenu .menu li:last-child a{position:relative; border:solid 2px var(--red);padding:5px 35px 8px;background:var(--red);color:var(--white)!important;transition:all .3s ease;line-height:1;text-align:center;}
#page-header #toppermenu .menu li:last-child a::before{display: none;}
#page-header #toppermenu .menu li.current-menu-item a{color: var(--red);}
#page-header #toppermenu .menu li:last-child a:hover{color: var(--white); background-color: var(--red-hover);border-color: var(--red-hover);}
#page-header #toppermenu.active{display: block;}


#page-header .burgerbutton{display:none; z-index: 999; width:40px;height:30px;position:absolute;top:30px;right:15px;cursor:pointer; background: none; border: none;}
#page-header .burgerbutton span{display:block;width:100%;height:3px;margin:8px 0;background:var(--black);border-radius:20px;transition:all .3s ease;}
#page-header .burgerbutton span:nth-child(1){margin-top: 0px;}
#page-header .burgerbutton.active span:nth-child(1){transform:rotate(45deg);transition:all .3s ease;margin-top:4px;}
#page-header .burgerbutton.active span:nth-child(2){opacity:0;transition:all .3s ease;}
#page-header .burgerbutton.active span:nth-child(3){transform:rotate(-45deg);transition:all .3s ease;margin-top:-22px;}

#page-header.bottom{padding: 10px 0;position:fixed;top:0;left:0;right:0;background:var(--white);-webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */              -moz-animation: fadein 2s; /* Firefox < 16 */-ms-animation: fadein 2s; /* Internet Explorer */-o-animation: fadein 2s; /* Opera < 12.1 */animation: fadein 2s;z-index:999;}
#page-header.bottom .infos{display:none;}
#page-header.bottom #toppermenu{transform: none;}
#page-header.bottom .logo img{width:auto; height: 60px;}
#page-header.bottom .container > .row{align-items: center;}


@keyframes fadein {
    from { top: -125px; }
    to   { top: 0; }
}
@-moz-keyframes fadein {
    from { top: -125px; }
    to   { top: 0; }
}
@-webkit-keyframes fadein {
    from { top: -125px; }
    to   { top: 0; }
}
@-ms-keyframes fadein {
    from { top: -125px; }
    to   { top: 0; }
}

/*------------------------------------Footer-------------------------------------------------*/

#page-footer{background:var(--dark);padding:50px 0 15px; color: var(--white);}
#page-footer a{color: var(--white); font-size: 85%;}
#page-footer a:hover{color: var(--red);}
#page-footer .headline{font-size: 1.25rem;}

#page-footer .logo img{max-width: 250px; width: 100%}

#page-footer .backtotop .scrollup{cursor:pointer;}
#page-footer .backtotop .scrollup:hover img{transform:scale(1.1);transition:all .3s ease;}
#page-footer .backtotop .scrollup img{margin:0 auto;display:block;transition:all .3s ease;}

#page-footer .anfahrt .headline{padding-bottom: 25px;}
#page-footer .anfahrt .adresse{padding-left: 35px; position: relative;}
#page-footer .anfahrt .adresse:before{content: ''; display: block; position: absolute; left: 0; top: 10px; width: 25px; height: 35px; background: url("media/pin.svg"); background-size: contain; background-repeat: no-repeat;}
#page-footer .anfahrt .adresse p{font-size: 85%; color: var(--white);}

#page-footer .kontakt .headline{padding-bottom: 25px;}
#page-footer .kontakt{position: relative;}
#page-footer .kontakt a{padding-left: 30px; position: relative; display: block; padding-bottom: 10px; width: fit-content;}
#page-footer .kontakt a::before{content: ''; display: block; position: absolute; background-repeat: no-repeat; background-size: contain; width: 20px; height: 20px; left: 0; top: 5px;}
#page-footer .kontakt .email::before{background-image: url("media/mail-light.svg"); }
#page-footer .kontakt .telefon::before{background-image: url("media/telefon-light.svg"); width: 18px; height: 18px;}
#page-footer .kontakt .instagram{display: block; position: absolute; right: 50px; top: 0;}
#page-footer .kontakt .instagram::before{display: none;}
#page-footer .kontakt .instagram img{height: 40px; width: 40px; filter: invert(100%);}
#page-footer .kontakt .facebook{display: block; position: absolute; right: 50px; top: 60px;}
#page-footer .kontakt .facebook::before{display: none;}
#page-footer .kontakt .facebook img{height: 40px; width: 40px; filter: invert(100%);}

#page-footer .socialmedia a{padding-right: 15px;}
#page-footer .socialmedia img{max-width: 40px; filter: invert(1); transition: all 0.3s ease;}
#page-footer .socialmedia a:hover img{scale: 1.15;}

#page-footer .copyright, #page-footer .rechtliches{padding-top: 150px;}
#page-footer .copyright span{display:block;color:#fff;font-size:75%;}

#page-footer .rechtliches{text-align: end;}
#page-footer .rechtliches a{display: inline-block; padding: 0 10px;}

/*------------------------------ACF-Flexible-Content-----------------------------------------*/

.inhaltsbloecke{margin-top:105px;}
div[class^="flx_"], div[class*="flx_"]{padding:75px 0;}

.flx_headerblock{position:relative; background-repeat: no-repeat; background-position: top; background-size: cover; padding: 150 0!important;}
/* .flx_headerblock::before{content:'';position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 50%, rgba(51, 51, 51, 0) 80%);z-index:0} */
.flx_headerblock .container{position: relative; z-index: 10;}
.flx_headerblock .content{padding: 30px; background: rgba(255, 255, 255, 0.65); max-width: 65%;}
.flx_headerblock .content *{color: #555;}
.flx_headerblock .content .headerbtn{color: white; margin-top: 30px;}
.flx_headerblock h1{color:#fff;font-size:4rem;line-height:1.2; padding-bottom: 0;}
.flx_headerblock .topline{color: var(--red);}
.flx_headerblock .topline::before{background-color: var(--red);}
.flx_headerblock .topline::after{background-color: var(--red);}
.flx_headerblock .content{color:#fff;}
.flx_headerblock .content p{font-size:120%;margin-bottom:50px; font-weight: 400;}
.flx_headerblock .btn{padding: 8px 35px;border:none; margin-top: 30px;}
.flx_headerblock .btn::after{display: none;}
.flx_headerblock .btn.link1{margin-right: 25px;margin-bottom: 25px;}
.flx_headerblock .btn.link2{background-color: var(--white); color: var(--dark);margin-bottom: 25px;}
.flx_headerblock .btn.link2:hover{background-color: var(--lightgrey); color: var(--dark);}

.flx_headerblock.mitbild{position:relative; padding:150px 0!important; overflow:hidden;}
.flx_headerblock.mitbild .headerbild{position:absolute; inset:0; z-index:0;}
.flx_headerblock.mitbild .headerbild img{width:100%; height:100%; object-fit:cover; object-position:center; display:block;}
.flx_headerblock.mitbild .container{position:relative; z-index:2; height:500px; align-content:end;}

.flx_headerblock.mitvideo{padding: 0!important; max-height: 800px;}
.flx_headerblock.mitvideo {position: relative; overflow: hidden;}
.flx_headerblock.mitvideo video {width: 100%; max-height: 800px; object-fit: cover;}
.flx_headerblock.mitvideo .overlay{position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.4); color: #fff;}
.flx_headerblock.mitvideo .overlay .container{position: relative; top: 70%; transform: translateY(-70%);}

.flx_headerblock.mitfarbe{height:250px;}
.flx_headerblock.mitfarbe .content{top:unset;bottom:20%;}

.flx_ansprechpartnerbox{padding:75px 0;background:#021D3A;margin:100px 0;}
.flx_ansprechpartnerbox .links .content p{color:#fff;margin:35px 0;display:block;}
.flx_ansprechpartnerbox .links .content .headline{color:#fff;}
.flx_ansprechpartnerbox .links .content .btn{padding:15px 75px 15px 25px;}
.flx_ansprechpartnerbox .mitte{margin-top:35px;}
.flx_ansprechpartnerbox .mitte .item{margin:25px 0;}
.flx_ansprechpartnerbox .mitte .item .icon{text-align:right;}
.flx_ansprechpartnerbox .mitte .item .icon img{max-width:75%;}
.flx_ansprechpartnerbox .mitte .item .inhalt{padding-top:10px;}
.flx_ansprechpartnerbox .mitte .item .inhalt .bezeichnung{font-size:100%;font-weight:600;color:#fff;display:block;line-height:1.2;}
.flx_ansprechpartnerbox .rechts .person img{border-radius:50%;}
.flx_ansprechpartnerbox .rechts .person .info{position:absolute;bottom:0;right:0;}
.flx_ansprechpartnerbox .rechts .person .info .name{font-size:125%;font-weight:600;color:#fff;display:block;line-height:1.2;}
.flx_ansprechpartnerbox .rechts .person .info .bezeichnung{font-size:100%;font-weight:300;color:#fff;display:block;line-height:1.2;}

.flx_bildblock{margin-bottom:200px;}
.flx_bildblock .inhalt{width:75%;display:block;margin:0 auto;}
.flx_bildblock .imageone{width:75%;display:block;position:relative;}
.flx_bildblock .imageone:after{content:'';display:block;width:100px;height:100px;background:#33CBE5;position:absolute;bottom:-25px;left:-25px;opacity:0.8;}
.flx_bildblock img{width:100%;}
.flx_bildblock .imagetwo{width: 40%;float: right;margin-top: -250px;position: relative;}

.flx_bildblock.masonry{margin-bottom: 0; padding: 75px 0 0!important;}
.flx_bildblock.masonry .container{padding-bottom: 100px;}
.flx_bildblock.masonry .headerbtn{margin-top: 50px;}

.flx_bildblock.masonry .inhalt{max-width: 80%; margin: 0; padding-bottom: 50px;}
.flx_bildblock.masonry .bildblock {display: block;}
.flx_bildblock.masonry .bildblock-item {width: calc(33.333% - 10px); display: inline-block; margin-bottom: 10px; overflow: hidden;}
.flx_bildblock.masonry .bildblock-item img{width: 100%; height: 100%; object-fit: cover; display: block;}
.flx_bildblock.masonry .side-by-side-images {display: flex; gap: 0.5rem; margin-right: 0.5rem;}

.flx_bildblock.masonry .side-by-side-images .imageone,.flx_bildblock.masonry .side-by-side-images .imagetwo {flex: 1;  overflow: hidden; margin-top: 0;}
.flx_bildblock.masonry .side-by-side-images img {width: 100%; height: 100%; object-fit: cover; display: block;}


 
/* .flx_textblock.nurtext .text h2{margin: 50px 0 30px;} */
.flx_textblock h1{padding-bottom: 50px;}

.flx_textblock .text, .flx_textblock .bild, .flx_textblock .leistungen{align-content: center;}

.flx_textblock .headline{width: 100%;}
.flx_textblock .text ul, .flx_textblock .text ol{margin:0px 0px 30px; padding: 0;}
.flx_textblock .text ul li{display:block;font-weight:500;margin:8px 0;}
.flx_textblock .text h3{margin-top: 30px; margin-bottom: 10px;}

.flx_textblock.mitbildrechts img{position:relative;z-index:99;}
.flx_textblock.mitbildrechts .grafisches_element{display:block;width:100px;height:100px;background:#33CBE5;position:absolute;bottom:-25px;left:-10px;opacity:0.8;z-index:100;}
.flx_textblock.mitbildlinks img{position:relative;z-index:99; width: 100%;}
.flx_textblock.mitbildlinks .grafisches_element{display:block;width:100px;height:100px;background:#33CBE5;position:absolute;bottom:-25px;left:-10px;opacity:0.8;z-index:100;}


.flx_textblock .formular{position:relative;z-index:99;background:#fff;padding:25px;width:75%;margin-top:-250px;float:right;-webkit-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.05);-moz-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.05);box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.05);}
.flx_textblock .formular input, .flx_textblock .formular textarea{border:none;background:#f2f2f2;color:#444;margin:5px 0;width:100%;padding:10px;}
.flx_textblock .formular .datenschutz input{width:12px;margin-right:2px;}
.flx_textblock .formular .datenschutz p{font-size:75%;}
.flx_textblock .formular input.btn:hover{background:#333;color:#fff;transition:all .3s ease;}

.flx_textblock.mitslider .kontakt{align-content: center;}
.flx_textblock.mitslider .kontakt img{display: block; width: 35px; height: 35px; margin-bottom: 10px;}
.flx_textblock.mitslider .kontakt .telefon{font-weight: 500; display: block;}
.flx_textblock.mitslider .slider{position: relative; padding-bottom: 40px;}
.flx_textblock.mitslider .slider .owl-nav .owl-prev img{ transform: rotate(180deg);}
.flx_textblock.mitslider .slider .owl-nav{position: absolute; bottom: -80px;}
.flx_textblock.mitslider .slider .owl-nav .owl-next{margin-left: 30px;}

.flx_textblock.mitslider .slideState{height: 5px; background: #f1c8c3; position: relative; border-radius: 5px;margin-top: 20px;}
.flx_textblock.mitslider .slideState span{ position: absolute; border-radius: 5px; height: 100%; background: #eb1f06; left: 0; top: 0; transition: all 0.5s ease; color: #FFF; padding-left: 15px;}

.flx_textblock.mitslider .slider .button{position: absolute; top: 50%; transform: translateY(-50%); right: 10px; z-index: 99; border-radius: 30px; width: 60px; height: 30px; }
.flx_textblock.mitslider .slider .button button{width: 60px; height: 30px; border-radius: 15px;background:rgba(255,255,255,0.7); opacity:1;border: 2px var(--white) solid;;backdrop-filter: blur(3px);}
.flx_textblock.mitslider .slider .button button::after{content: ''; background-image: url("media/arrow_right.svg"); background-repeat: no-repeat; width: 20px; height: 20px;
                                                        position: absolute; right: 0px; top: 50%; transform: translateY(-50%); background-size: contain;}
           
.flx_textblock.mitleistungen .leistung{position: relative; display: block; width: 66%; padding: 20px; margin-bottom: 60px; display: flex; align-items: flex-start; gap: 1rem}
.flx_textblock.mitleistungen .leistung:nth-child(2n){margin-left: auto;}
.flx_textblock.mitleistungen .leistung:before{content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 30%; border-top: 2px solid var(--red); border-right: 2px solid var(--red);}
.flx_textblock.mitleistungen .leistung:after{content: ''; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 30%; border-bottom: 2px solid var(--red); border-left: 2px solid var(--red);}
.flx_textblock.mitleistungen .leistung img{width: auto; height: 50px; flex-shrink: 0;}
.flx_textblock.mitleistungen .leistung .text{flex: 1;}
.flx_textblock.mitleistungen .leistung .text .headline{padding-bottom: 10px;}
.flx_textblock.mitleistungen .leistung .text .inhalt{font-size: 0.9rem;}

.flx_iconblock{margin:100px 0;}
.flx_iconblock .item{padding:0 25px;}
.flx_iconblock .item img{max-width:35%;margin:0 auto 25px;display:block;}
.flx_iconblock .item .inhalt{text-align:center;}


.flx_produktteaser .row{justify-content:center;}
.flx_produktteaser > .container > .headline{font-size:250%;width:50%;}
.flx_produktteaser .kacheln{padding-top: 30px;}
.flx_produktteaser .kachel{margin-bottom:30px;overflow:hidden;}
.flx_produktteaser .kachel .link{display:block;text-decoration:none;}
.flx_produktteaser .kachel img{display:block;height:auto;width:100%;transition:transform .3s ease; aspect-ratio: 3/4; object-fit: cover; object-position: center;}
.flx_produktteaser .kachel .headline{color:var(--black);font-size:1rem;font-weight:300;width:100%;padding:20px 0 0;transition:color .3s ease,transform .3s ease;}
.flx_produktteaser .kachel img:hover{transform:scale(1.05);}
.flx_produktteaser .kachel .headline:hover{color:var(--red);transform:translateY(-3px);}
.flx_produktteaser .kachel .link:focus-visible img{transform:scale(1.05);}
.flx_produktteaser .kachel .link:focus-visible .headline{color:var(--red);transform:translateY(-3px);}

/* .flx_kontakt .container{background-color: var(--light); padding: 100px 0; border-radius: 10px;} */
.flx_kontakt h2{padding-bottom: 30px;}
.flx_kontakt .ansprechpartner{margin-top: 50px;}
.flx_kontakt .ansprechpartner .partnercol{align-content: center;}
.flx_kontakt .ansprechpartner .partnercol h3{font-size: 1.25rem; padding-bottom: 20px;}
.flx_kontakt .ansprechpartner .partnercol .name{font-weight: 400; padding-bottom: 10px;}
.flx_kontakt .ansprechpartner .partnercol .email{font-weight: 300; display: block; margin-bottom: 10px; position: relative; padding-left: 35px;}
.flx_kontakt .ansprechpartner .partnercol .email:before{content: ''; display: block; position: absolute; left: 0; top: 50%; width: 20px; height: 20px; transform: translateY(-50%);
    background: url('media/mail.png'); background-repeat: no-repeat; background-size: contain; background-position: center;}
.flx_kontakt .ansprechpartner .partnercol .telefon{font-weight: 300; display: block; position: relative; padding-left: 35px;}
.flx_kontakt .ansprechpartner .partnercol .telefon:before{content: ''; display: block; position: absolute; left: 0; top: 50%; width: 20px; height: 20px; transform: translateY(-50%);
    background: url('media/telefon.png'); background-repeat: no-repeat; background-size: contain; background-position: center;}
.flx_kontakt .ansprechpartner img{border-radius: 100%; max-width: 250px; width: 100%;}

.flx_kontakt .kontaktheadline{padding-bottom: 25px;}
.flx_kontakt label{width: 100%;}
.flx_kontakt select{width: 100%; background-color: white; border: none; border-radius: 5px; padding: 10px; color: var(--dark);}
.flx_kontakt input{width: 100%; border: none; border-radius: 5px; padding: 8px 20px;}
.flx_kontakt textarea{width: 100%; max-height: 150px; border: none; border-radius: 5px; padding: 8px 20px;}
.flx_kontakt input[type="checkbox"]{width: fit-content;display: block;top: 21px;position: relative;}
.flx_kontakt .wpcf7-form-control-wrap{width: 100%; display: block;margin-top: 5px;}
.flx_kontakt .wpcf7-list-item{margin: 0;}
.flx_kontakt .wpcf7-acceptance .wpcf7-list-item-label{display: inline-block; padding-left: 25px; width: calc(100%-25px);}
.flx_kontakt div[data-id="firmenname-group"] p{margin-bottom: 0;}
.flx_kontakt .wpcf7-submit{width: fit-content; padding:10px 30px;font-size:100%;font-weight:600;background:var(--red);color:var(--white);transition:all .3s ease;line-height:1;text-align:center; border-radius: 0;}
.flx_kontakt .wpcf7-submit:hover{background-color: var(--red-hover); color: var(--white);}
.flx_kontakt .wpcf7-submit::after{display: none;}
.flx_kontakt .formular a{text-decoration:underline;}
.flx_kontakt .pflicht{text-align: end;}
.flx_kontakt .pflicht p{ font-size: 0.8rem;}


.flx_leistungsbereiche{padding: 150px 0 100px; scroll-margin-top:120px;}
.flx_leistungsbereiche:nth-of-type(2n){background-color: var(--lightgrey);}
.flx_leistungsbereiche:last-of-type{margin-bottom: 100px;}
.flx_leistungsbereiche .btn{margin-bottom: 50px;}
.flx_leistungsbereiche .fixbild{margin-bottom: 50px; text-align: right;}
.flx_leistungsbereiche .fixbild img{height: 100%;object-fit: cover; aspect-ratio: 3/4; max-width: 300px;}
.flx_leistungsbereiche .downloads{padding: 15px 0;}
.flx_leistungsbereiche .downloads .download-link{display: block; position: relative; padding-left: 25px;}
.flx_leistungsbereiche .downloads .download-link::before{content:'';width:20px;height:20px;display:block;background:url('media/download.svg');background-repeat:no-repeat;background-size:100%;background-position:center;position:absolute;top:5px;left:0;}
.flx_leistungsbereiche .sliderbild{aspect-ratio: 7 / 5;object-fit: cover;}
.flx_leistungsbereiche .owl-nav{display: unset;}
.flx_leistungsbereiche .owl-nav .owl-prev{position: absolute;top: 39%;left: 30px;border: none;background: var(--red);height: 40px;width: 40px;border-radius: 50%;}
.flx_leistungsbereiche .owl-nav .owl-next{position: absolute;top: 39%;right: 30px;border: none;background: var(--red);height: 40px;width: 40px;border-radius: 50%;}
.flx_leistungsbereiche .owl-nav .owl-prev span,
.flx_leistungsbereiche .owl-nav .owl-next span{color: var(--white);font-weight: 600;font-size: 160%;line-height: 1.15;}



/*Contact Form 7 Anpassungen*/
.wpcf7 form.sent .wpcf7-response-output{background-color: #46b450!important;color: var(--white)!important;padding: 1rem!important;text-align: center!important;font-weight: 600!important;border-radius: 10px!important;}
.wpcf7 form.sent .uacf7-form-wrapper-container{display: none!important;}
.wpcf7 .wpcf7-acceptance a{font-weight: 500;text-decoration: underline;}
.wpcf7 .wpcf7-acceptance a:hover{color: var(--red);}


.flx_kundenstimmen .headline{padding-bottom: 100px;}
.flx_kundenstimmen .name{font-size: 80%;}
.flx_kundenstimmen .kundenstimme-slide{background-color: var(--light); padding: 20px; border-radius: 10px;}


.flx_slider{background-color: var(--dark); padding: 150px 0!important; overflow-x: hidden;}
.flx_slider .container{position: relative}
.flx_slider .headline{padding-bottom: 100px;}
.flx_slider .btn{position: absolute; top: 50px; right: 0; padding: 10px 55px 10px 30px;}
.flx_slider .btn::after{content: ''; position: absolute; display: block; background-image: url('media/arrow_right.svg'); background-repeat: no-repeat; background-size: contain; 
                                                        width: 20px; height: 20px; right: 20px; top: 10px; filter: invert(100%); transition: all 0.3s ease;}
/* .flx_slider .btn:hover::after{filter: invert(0);} */

.flx_slider .slider {width: calc(100vw - (100vw - 100%)/2); position: relative;}
.flx_slider .slider .item{background-color: var(--white); padding: 50px; border-radius: 10px;min-height:420px;}
.flx_slider .slider .item h2{color: var(--red); padding-bottom: 10px;}
.flx_slider .slider .item h4{padding-bottom: 10px;}
/* .flx_slider .slider .owl-dots{width:90%;display:flex;align-items:center;margin-top:15px;}
.flx_slider .slider .owl-dots .owl-dot{width:100px;height:2px;background:var(--white);display: inline-block;}
.flx_slider .slider .owl-dots .owl-dot.active{width:100px;height:5px;background:var(--white);border-radius:5px;display: inline-block;} */
.flx_slider .slider .owl-nav{width:10%;display:flex;justify-content:space-between;margin-top:25px;}
.flx_slider .slider .owl-nav .owl-prev{display:inline-block;width:25px;height:35px;background:url('media/arrow_right.svg');background-size:100%;background-position:center;background-repeat:no-repeat;filter:brightness(50);transform:rotate(180deg);}
.flx_slider .slider .owl-nav .owl-next{display:inline-block;width:25px;height:35px;background:url('media/arrow_right.svg');background-size:100%;background-position:center;background-repeat:no-repeat;filter:brightness(50);}


.flx_teaser{padding: 40px 0!important;}
.flx_teaser .teasercol{align-content: center;}
.flx_teaser .item{padding-right: 25px;display:flex;gap:30px; justify-content: center;}
.flx_teaser .item .text{color: var(--dark);font-weight: 600;align-content:center;}

.flx_partnerblock .topline{display: block; margin: 0 auto;}
.flx_partnerblock .row{display: flex; flex-wrap: wrap; gap: 0; align-items: center; justify-content: center;}
.flx_partnerblock .inhalt{width: 65%; text-align: center; margin: 0 auto;}
.flx_partnerblock .headline.partner{padding-top: 100px; font-size: 1.25rem;}
.flx_partnerblock .partner{width: 80%; display: block; position: relative; margin: 0 auto;}
.flx_partnerblock .partner .kachel{text-align: center; padding-bottom: 50px; max-width: 20%; flex: 0 0 20%;}
.flx_partnerblock .partner img{transition: all 0.3s ease; max-height: 90px; max-width: 180px; width: 100%; height: auto; object-fit: contain; filter: grayscale(1);}
@media (max-width: 1199px){.flx_partnerblock .partner{width: 90%;}.flx_partnerblock .partner .kachel{max-width: 25%; flex: 0 0 25%;}}
@media (max-width: 991px){.flx_partnerblock .inhalt{width: 80%;}.flx_partnerblock .partner{width: 100%;}.flx_partnerblock .partner .kachel{max-width: 33.333%; flex: 0 0 33.333%;}.flx_partnerblock .headline.partner{padding-top: 70px;}}
@media (max-width: 767px){.flx_partnerblock .inhalt{width: 100%;}.flx_partnerblock .partner .kachel{max-width: 50%; flex: 0 0 50%; padding-bottom: 35px;}.flx_partnerblock .headline.partner{padding-top: 50px; font-size: 1.125rem;}.flx_partnerblock .partner img{max-height: 70px; max-width: 150px;}}
@media (max-width: 480px){.flx_partnerblock .partner .kachel{max-width: 50%; flex: 0 0 50%;}.flx_partnerblock .partner img{max-height: 65px; max-width: 140px;}}


.flx_kachelblock .kachel { position: relative; }
.flx_kachelblock .row { justify-content: center; }
.flx_kachelblock .kachel .link { display: block; position: relative; overflow: hidden; }
.flx_kachelblock .kachel .link::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0, 0, 0, 0.55), rgba(0, 0, 0, 0.15)); z-index: 1; pointer-events: none; }
.flx_kachelblock .kachel img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; transition: transform 0.4s ease; }
.flx_kachelblock .kachel .link:hover img, .flx_kachelblock .kachel .link:focus-visible img { transform: scale(1.08); }
.flx_kachelblock .kachel .headline { position: absolute; top: 50%; left: 50%; z-index: 2; transform: translate(-50%, -50%); width: 100%; padding: 20px; text-align: center; color: #fff; }

.flx_leistungen .nav-item{display: block; align-content: center;}
.flx_leistungen button{position:relative; padding:15px 30px;font-size:100%; background: #afb2ba; color:#fff;transition:all .3s ease;line-height:1.2;text-align:center; border-radius: 10px;}
.flx_leistungen button.nav-link:hover{background-color: var(--dark);color: var(--white);}
.flx_leistungen button.nav-link.active{background-color: var(--red); font-size: 130%; padding: 15px 35px; position: relative; z-index: 1;}
.flx_leistungen button.nav-link.active:hover{background-color: var(--red); font-size: 130%; padding: 15px 35px; position: relative; z-index: 1;}
.flx_leistungen button.nav-link.active:hover{color: var(--white);}
.flx_leistungen button.nav-link.active::before{content: ''; display: block; z-index: 0; position: absolute; width: 40px; height: 40px; left: 50%; bottom: -20px; 
                                            transform: translateX(-50%); background-color: var(--red); clip-path: polygon(0 50%, 100% 50%, 50% 100%);}
.flx_leistungen ul{width: fit-content; margin: auto; padding-bottom: 100px;}
.flx_leistungen ul li::before{display: none;}
.flx_leistungen .content{position: relative;}
.flx_leistungen .content .accordion{margin: 0; padding-top: 0;}
.flx_leistungen .content .accordion .accordion-item{border:none;margin-bottom:10px;}
.flx_leistungen .content .accordion .accordion-header{font-size:100%;}
.flx_leistungen .content .accordion .accordion-button{padding: 15px 0; font-weight:600;color:var(--dark);border-bottom:solid 2px var(--lightgrey);background:none;border-radius: 0;box-shadow:none;}
/* .flx_leistungen .content .accordion .accordion-item:last-child .accordion-button{border-bottom: none;} */
.flx_leistungen .content .accordion .accordion-button::after{content: ''; width: 25px; height: 25px; display: block; position: absolute; right: 0; top: 12.5px; background-image: url("media/plus.svg"); background-repeat: no-repeat;background-size:100%;}
.flx_leistungen .content .accordion .accordion-button a{font-weight: 500;}
.flx_leistungen .content .accordion .accordion-body{padding:15px 0;}
.flx_leistungen img{width: 100%;border-radius: 10px;}
.flx_leistungen .headline{width: 100%;}
.flx_leistungen .btn{float: right;margin-top: 50px;padding: 10px 30px;}
.flx_leistungen .btn::after{display: none;}


.flx_timeline { position: relative; }
.flx_timeline .inhalt{padding-bottom: 100px;}
.flx_timeline .timeline-wrapper { position: relative; display: flex; justify-content: space-between; flex-wrap: nowrap; gap: 2rem;}
.flx_timeline .timeline-item:not(:last-child)::after {content: ""; position: absolute; top: calc(var(--timeline-circle-size)/2); left: calc(var(--timeline-circle-size)/2); width: 100%; height: var(--timeline-line-height); background-color: var(--timeline-line-color); z-index: 1; transform: translateY(-50%);}
.flx_timeline .timeline-item { flex: 1; position: relative; }
.flx_timeline .timeline-circle { width: var(--timeline-circle-size); height: var(--timeline-circle-size); border: 2px solid var(--red); border-radius: 50%; display: flex; justify-content: center; align-items: center; position: relative; z-index: 2; background: #fff; }
.flx_timeline .timeline-circle img { width: 50%; height: auto; display: block; }
.flx_timeline .timeline-headline { margin-top: 1.5rem; margin-bottom: 0.5rem; font-size: 1.1rem; font-weight: 600; }
.flx_timeline .timeline-text { font-size: 1rem; line-height: 1.4; max-width: 80%; font-weight: 200; }

.flx_blogteaser .center{width: 80%; text-align: center;}
.flx_blogteaser .inhalt{padding-bottom: 60px;}
.flx_blogteaser .blog-slider h3{font-size: 1.1rem; padding: 15px 0;}
.flx_blogteaser .blog-thumb{position: relative; margin-top: 20px;}
.flx_blogteaser .blog-thumb .blog-date-badge {position: absolute; z-index: 1; top: -10px; right: -10px; background: var(--red); color: #fff; font-size: 0.85rem; font-weight: 600; padding: 8px 35px; border-radius: 5px;}
.flx_blogteaser .owl-carousel .owl-item img{height: 300px; object-fit: cover;}
.flx_blogteaser .blog-excerpt p{overflow: hidden;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;}

.flx_teamstimmen .teamstimmen-slider {position: relative; padding-top: 80px;}
.flx_teamstimmen .teamstimmen-slider .owl-stage-outer{padding-top: 75px;}
.flx_teamstimmen .teamstimmen-slider .teamstimme-item {position: relative; background: #fff; text-align: center; padding: 60px 100px; margin: 20px 150px; box-shadow: 0 4px 12px rgba(0,0,0,0.08);}
.flx_teamstimmen .teamstimme-bild {position: absolute; top: -75px; left: 50%; transform: translateX(-50%); z-index: 2;}
.flx_teamstimmen .teamstimme-bild img {width: 150px; height: 150px; border-radius: 50%; object-fit: cover; border: 3px solid #fff; box-shadow: 0 4px 10px rgba(0,0,0,0.1);}
.flx_teamstimmen .teamstimme-text {text-align: center; margin-top: 60px; font-size: 1.1rem; line-height: 1.6; color: #333;}
.flx_teamstimmen .teamstimme-text p{font-size: 1.25rem;}
.flx_teamstimmen .teamstimme-name {text-align: center; font-weight: 600; margin-top: 50px; font-size: 1rem; color: #000;}
.flx_teamstimmen .owl-nav {position: absolute; top: 58%; left: 0; right: 0; transform: translateY(-50%); display: flex; justify-content: space-between; padding: 0px; pointer-events: none;}
.flx_teamstimmen .owl-nav button {background: none; border: none; font-size: 40px; color: #333; pointer-events: all;}
.flx_teamstimmen .owl-nav button:hover {color: #eb1f06;}
.flx_teamstimmen .owl-dots {text-align: center; margin-top: 20px;}
.flx_teamstimmen .owl-dot span {width: 12px; height: 12px; margin: 5px; background: #b1b1b1; display: inline-block; border-radius: 50%; transition: background 0.3s ease;}
.flx_teamstimmen .owl-dot.active span {background: #eb1f06;}


.flx_downloadbereich li{list-style:none;padding-left:30px; padding-bottom: 10px; position:relative;}
.flx_downloadbereich li::before{display: none;}
.flx_downloadbereich li a::before{content:'';width:20px;height:20px;display:block;background:url('media/download.svg');background-repeat:no-repeat;background-size:100%;background-position:center;position:absolute;top:5px;left:0;}




/*-------------------------------Stellenangebote------------------------------------------*/    
.flx_karriere{position: relative;padding:50px 0;}
.flx_karriere .kachel img{width: 100%; aspect-ratio: 16/9; object-fit: cover;}
.flx_karriere .stellenangebot{padding: 50px;}
.flx_karriere .jobbild::after{position: absolute; content:'';background: linear-gradient(0deg, rgba(33,33,38,1) 0%, rgba(255,255,255,0) 100%);bottom: 0; right: 0;height: 200px;width: 100%;}
.flx_karriere .jobinfosStelle{z-index: 5; text-align: center; width: 100%;position: absolute; bottom: 30px; left: 0; right: 0; margin-inline: auto;}
.flx_karriere .textblock{background-color: #f2f2f2; padding: 50px; position: relative;}
.flx_karriere .textblock .titel{font-weight: 500; font-size: 100%; position: relative; color: var(--dark); padding-bottom: 10px;}
.flx_karriere .textblock .titel .wmd{font-weight: 300; font-size: 80%; position: relative;display:inline-block;}
.flx_karriere .textblock .beschreibung{padding-bottom: 20px;}
.flx_karriere .stelleneinleitung{background: white;}
.flx_karriere .textblock .stellenbutton{position: absolute; right: 50px; bottom: 50px;}
.flx_karriere .textblock .stellenlink{color: var(--red); font-weight: 600; transition: all 0.3s ease;}
.flx_karriere .textblock .stellenlink:hover{color: var(--red-hover);}
.flx_karriere .textblock .stellenlink::before{content: ''; display: block; position: absolute; left: -45px; background: url('media/button_arrow.png'); background-repeat: no-repeat; background-size: contain; height: 30px; width: 30px; transition: all 0.3s ease;}
.flx_karriere .textblock .stellenlink:hover::before{left: -35px;}

/*-------------------------------Blog-Einträge--------------------------------------------*/
#phpsingle{padding: 150px 0 50px;}
#phpsingle .widebtn{margin-bottom: 50px; display: block;}
#phpsingle .content{ padding-right: 25px;}
#phpsingle .content h1{color: var(--dark); font-size: 2.5rem;}
#phpsingle .content p{color: var(--dark);}
#phpsingle .content h2{margin: 50px 0 30px;}
/*-------------------------------Karriere-Single--------------------------------------------*/
.flx_karrieresingle{overflow: hidden;}


.karriere-header {background-size: cover; position: relative; background-position: center; width: 100%; padding: 600px 0 100px;}
.karriere-header::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; 
    background: linear-gradient(0deg,rgba(0, 0, 0, 0.6) 0%, rgba(255, 255, 255, 0) 100%);; z-index: 1;}
.karriere-header-content {position: relative;z-index: 2;}
.karriere-header .headline {color: #fff;font-size: 3rem;}
.karriere-header .headline small {font-size: 1rem; margin-left: 10px;}


#phpsingle-karriere .ansprechpartner{padding-top: 100px;}
#phpsingle-karriere .ansprechpartnerheadline{padding-bottom: 30px;}
#phpsingle-karriere .kontaktinformation{font-weight: 500;}
#phpsingle-karriere .ansprechbild{width: 400px; margin: 50px 0 0 250px;}
#phpsingle-karriere a{color: var(--dark);}
#phpsingle-karriere .content{padding: 20px 0px 20px 0px; font-weight: 600; font-size: 120%;}
#phpsingle-karriere .headline{padding-bottom: 20px; font-size: 300%;width: max-content;max-width: 100%;}
#phpsingle-karriere h4{padding: 0; font-size: 180%; color: var(--black);font-weight: 600;}
#phpsingle-karriere .bewerbungstelle{font-weight: 500;background-color: var(--dark);color: var(--white);width: max-content;padding: 10px 30px;border-radius: 10px;margin: 30px 0;font-weight: 500;}
#phpsingle-karriere .bewerbung{padding: 50px; margin-top: -75px; background-color: var(--lightgrey); color: var(--black);}
#phpsingle-karriere .bewerbung p{margin-bottom: 0;}
#phpsingle-karriere .whatsapp{width: 50px; height: 50px;}
#phpsingle-karriere h2{padding-bottom: 30px;}
#phpsingle-karriere label{width: 100%; font-size: 80%; color: var(--dark); font-weight: 600; margin-bottom: 15px;}
#phpsingle-karriere select{width: 100%; background-color: white; border: none; border-radius: 5px; padding: 10px; color: var(--dark);}
#phpsingle-karriere input, #phpsingle-karriere textarea{width: 100%; border: none; border-radius: 5px; padding: 5px 10px;}
#phpsingle-karriere textarea{height: 200px;}
#phpsingle-karriere input[type="checkbox"]{width: fit-content;}
#phpsingle-karriere .wpcf7-form-control-wrap{width: 100%; display: block;margin-top: 5px;}
#phpsingle-karriere .wpcf7-list-item{margin: 0;}
#phpsingle-karriere div[data-id="firmenname-group"] p{margin-bottom: 0;}
#phpsingle-karriere .pflicht{text-align: end; margin-bottom: 15px; font-size: 80%;}
#phpsingle-karriere .wpcf7-form-control-wrap[data-name="Zustimmung"]{margin-bottom: 15px;}
#phpsingle-karriere .wpcf7-acceptance .wpcf7-list-item-label{font-size: 100%;}
#phpsingle-karriere .wpcf7-submit{width: fit-content; padding:10px 30px;font-size:100%;font-weight:600;background:var(--green);color:#fff;transition:all .3s ease;line-height:1.2;text-align:center; border-radius: 10px;}
#phpsingle-karriere .wpcf7-submit:hover{background-color: var(--green-hover); color: var(--white);}
#phpsingle-karriere .einleitung{padding: 100px 0 100px 0;}
#phpsingle-karriere .bildheadline{width: 55%;}
#phpsingle-karriere .einleitungKarriere{padding: 20px 0}
#phpsingle-karriere .einleitungKarriere p{font-size: 90%; font-weight: 400;}
#phpsingle-karriere ul{list-style: none; padding: 25px 0 50px;}
#phpsingle-karriere li{padding-bottom: 15px; padding-left: 25px; font-weight: 400;}
#phpsingle-karriere li::before{background: none; content: '●'; top: 0;}
/* #phpsingle-karriere li::before{content: ''; background-repeat: no-repeat; height: 25px; width: 25px; display: block; position: absolute; left: -5px; top: 5px;background-size: contain;} */
#phpsingle-karriere .bildwrapper::after{content: ''; width: 50%; background: linear-gradient(90deg, rgba(33,33,38,1) 0%, rgba(255,255,255,0) 100%); height: 100%;position: absolute; top: 0; left: 0; z-index: 0;}


/*-----------------------------------Benefits---------------------------------------------*/    
.flx_benefits{padding-bottom: 100px;}
.flx_benefits .inner{padding: 30px; text-align: center;}
.flx_benefits .benefit{font-weight: 600;}
.flx_benefits .benefitrow{text-align: center; margin-right: auto; margin-left: auto;}
.flx_benefits .benefitbeschreibung{padding-top: 20px; font-weight: 200;}
.flx_benefits .icon{margin-bottom: 15px; height: 60px; display: block; align-content: end;}
.flx_benefits .icon .benefitlogo{width: 60px; height: auto;}
.flx_benefits .headline{width: fit-content; padding-top: 10px;}
.flx_benefits .subline{padding-top: 20px; padding-bottom: 30px; text-align: center; font-size: 280%; font-weight: 700;}
.flx_benefits .headerbtn{margin-top: 50px;}


/*-----------------------------------Image Label---------------------------------------------*/    
.img-number-wrap {position: relative; display: inline-block; line-height: 0;}
.img-number-wrap::after {content: attr(data-img-number); position: absolute; top: 6px; left: 6px; font: 600 12px/1 'Encode Sans'; padding: 4px 6px; border-radius: 999px;
  background: rgba(0,0,0,0.65); color: white; pointer-events: none; z-index: 999;}



/*-------------------------------------------------------------------------------------------*/
@media (min-width:1630px){
    .container{max-width: 1600px;}


    

    .flx_kachelblock .kachel .link::before{display: block;}
}

@media (max-width:1629px){
    #page-header .burgerbutton{display: block;}

    #page-header .container { max-width: 100%; }
    #page-header .row { align-items: center; position: relative;}
    #page-header .logo { position: relative; z-index: 1002; display: block; }
    #page-header .logo img { display: block; width: 100%; max-width: 220px; height: auto; }

    #page-header #toppermenu { position: fixed; top: 0; right: 0; z-index: 1000; width: min(420px, 100%); height: 100dvh; padding: 110px 30px 40px; overflow-y: auto; background: var(--white); box-shadow: -5px 0 20px rgba(0, 0, 0, 0.15); visibility: hidden; opacity: 0; pointer-events: none; transform: translateX(100%); transition: transform .4s ease, opacity .4s ease, visibility 0s linear .4s; }
    #page-header #toppermenu.active { visibility: visible; opacity: 1; pointer-events: auto; transform: translateX(0); transition: transform .4s ease, opacity .4s ease, visibility 0s; }
    #page-header #toppermenu .menu { margin: 0; padding: 0; text-align: left; }
    #page-header #toppermenu .menu li { display: block; margin: 0; padding: 0; border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
    #page-header #toppermenu .menu li::before { display: none; }
    #page-header #toppermenu .menu li a { display: block; width: fit-content; padding: 18px 0; font-size: 1.2rem; font-weight: 500; line-height: 1.3; color: var(--black); text-decoration: none; }
    #page-header #toppermenu .menu li a::before { bottom: 12px; }
    #page-header #toppermenu .menu li.current-menu-item a { color: var(--red); }
    #page-header #toppermenu .menu li:last-child { margin-top: 25px; padding: 0; border-bottom: 0; }
    #page-header #toppermenu .menu li:last-child a { display: block; padding: 14px 25px; color: var(--white) !important; text-align: center; background: var(--red); border: 2px solid var(--red); }
    #page-header #toppermenu .menu li:last-child a:hover { color: var(--white); background: var(--red-hover); border-color: var(--red-hover); }

    #page-header .burgerbutton { display: block; position: absolute; top: 50%; right: 15px; z-index: 1002; width: 40px; height: 30px; padding: 0; margin: 0; transform: translateY(-50%); }
    #page-header .burgerbutton span { display: block; width: 100%; height: 3px; margin: 8px 0; background: var(--black); border-radius: 20px; transition: transform 0.3s ease, opacity 0.3s ease; }
    #page-header .burgerbutton span:nth-child(1) { margin-top: 0; }
    #page-header .burgerbutton.active span:nth-child(1) { margin-top: 4px; transform: rotate(45deg); }
    #page-header .burgerbutton.active span:nth-child(2) { opacity: 0; }
    #page-header .burgerbutton.active span:nth-child(3) { margin-top: -22px; transform: rotate(-45deg); }


    .flx_headerblock h1{width: 90%;}
    .flx_headerblock .content p{max-width: 90%;}
}

/*-------------------------------------------------------------------------------------------*/
@media (max-width:1480px){
    #page-header #toppermenu .menu li{padding-left: 15px;}

    #page-footer .rechtliches{width:100%; flex:0 0 100%; max-width:100%; order:1; text-align:center; padding-top:100px; padding-bottom:30px; padding-left: 0;}
    #page-footer .copyright{width:100%; flex:0 0 100%; max-width:100%; order:2; padding-top:0; text-align: center;}
    
    .flx_headerblock h1{font-size: 280%;}

    .flx_slider .btn{right: 25px;}
    .flx_slider .slider .item{min-height:490px;}

    .flx_referenzen .headline.top{width: 85%;}
    .flx_kachelblock .kachel .headline{font-size: 105%;}

    .flx_karriere .jobbild{height: 250px!important;}
    .flx_karriere .item{width: 100%; height: 500px;}
    .flx_karriere .owl-prev{top : 0px; right: 170px;}
    .flx_karriere .owl-next{top : 0px; right: 100px;} 
    .flx_karriere .scrollText{bottom: 100px;}  
    .flx_karriere .scrollButtons{bottom: 50px;}
    .textbild.bildpadding{padding: 50px;}
    .flx_karriere .einleitung{padding: 50px;}
}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:1199px){
    .headline{width: 100%;}
    
    
    #page-header .infos{display: none;}
    .inhaltsbloecke{margin-top: 100px;}

    .flx_slider .slider .item{min-height:570px;}

    .flx_kontakt .bild::before{display: none;}
    .flx_kontakt .bild::after{display: none;}

    .flx_kachelblock .headline{width: 100%;}

    .flx_textblock.mitleistungen .leistungen{order: 2; padding-top: 50px;}

    .flx_leistungsbereiche .row{align-items: center;}
    .flx_leistungsbereiche .fixbild img{height: max-content;}
}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:991px) {

    /* #page-footer .kontakt .instagram{right: 15px;} */

    header{height: 80px;}
    .inhaltsbloecke{margin-top: 80px;}

    h2{font-size: 200%;}
    .headline{width: 100%; font-size: 200%;}

    .container, .container-md, .container-sm{max-width: 100%;}

    #page-header{position:fixed; padding:12px 0;}
    #page-header .container > .row{align-items:center;}
    #page-header .logo img{height:55px;}
    #page-header .col-md-10{position:static;}
    body.menu-open{overflow:hidden;}
    body.menu-open::before{content:''; position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:1000;}
    
    
    .flx_headerblock h1{font-size: 180%; width: 100%;}
    .flx_headerblock .content p{width: 100%;font-size: 100%; margin-bottom: 30px;}
    .flx_headerblock::before{background: linear-gradient(0deg,rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.6) 60%, rgba(51, 51, 51, 0) 100%);}
    /* .flx_textblock.mitslider .slider .button{left: 250px;} */
    .flx_headerblock.mitvideo video{aspect-ratio: 4/3; object-fit: cover;}

    .flx_teaser{padding: 10px 0;}
    .flx_teaser .item{padding: 10px 0;}
    .flx_teaser .item .text{align-content: center;}

    .flx_textblock .text ul{border: none;}
    .flx_textblock.mitslider .kontakt{display: flex;gap: 20px;flex-wrap: wrap;}

    .flx_slider .slider .item{min-height:380px;}
    .flx_slider .btn{top: unset; bottom: -60px;}

    .flx_kontakt .text{padding-bottom: 50px;}

    .flx_produktteaser > .container > .headline{width: 100%;}

    .flx_karriere .einleitung{padding: 10px;}
    .flx_karriere .jobbild{height: 300px!important;}

    .flx_karriere .karrieretitel{padding: 100px 0 20px 20px;}
    .flx_karriere .sliderKarriere{padding-top: 30px;}
    .flx_karriere .item{height: 360px;}
    .flx_karriere .owl-prev{top : -50px; right: 170px;}
    .flx_karriere .owl-next{top : -50px; right: 100px;} 
    .textbild.bildpadding{margin-top: 20px; padding: 20px;}
    .flx_karriere .headline{padding-top: 50px;}

    .flx_kachelblock .kachel{padding-bottom: 50px;}

    .flx_referenzen .slide .bild{display: none;}

    .flx_produktteaser .headline{width: 100%; font-size: 200%;}

    .flx_leistungsbereiche{padding: 70px 0;}

}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:767px) {
    #page-footer .anfahrt{margin-bottom: 1.5rem;}
    #page-footer .anfahrt .headline{padding-bottom: 5px;}
    #page-footer .kontakt{margin-bottom: 1.5rem;}
    #page-footer .kontakt .headline{padding-bottom: 5px;}
    #page-footer .kontakt .instagram{top: 50px;}
    #page-footer .kontakt .facebook{top: 0;}
    #page-footer .logo img{margin-bottom: 2rem;}

    #page-footer .rechtliches{order: 1;}
    #page-footer .copyright{order: 2;}
    #page-footer .copyright, #page-footer .rechtliches{padding-top: 20px; text-align: center; font-size: 80%; justify-content: center;}
    #page-footer .rechtliches a:first-child{padding-left: 0;}

    .topline{margin-top: 25px;}
    h2{font-size: 150%;}

    #page-header .menu-mobile{width: 100vw;}
    #page-header .logo img{width: 150px;}
    .flx_kontakt .bild{display: none;}
    .flx_headerblock .content p{max-width: 100%;}


    .flx_textblock.mitslider .slider{margin-top: 50px;}
    /* .flx_textblock.mitslider .slider .button{left: 320px;} */
    .flx_textblock.mitbildlinks .text{order: 1; padding-bottom: 30px;}
    .flx_textblock.mitbildlinks .bild{order: 2;}
    .flx_textblock.mitbildrechts .text{order: 1; padding-bottom: 30px;}
    .flx_textblock.mitbildrechts .bild{order: 2;}

    .flx_slider .slider .item{min-height:400px;}
    .flx_referenzen .slide{padding: 25px;}

    .flx_timeline .timeline-wrapper { gap: 1rem; }
    .flx_timeline .timeline-text { max-width: 95%; font-size: 0.95rem; }
    .flx_timeline .timeline-headline { font-size: 1rem; }
    .flx_timeline .inhalt { padding-bottom: 70px; }

    .flx_referenzen .stacked-slider .button{right: 115px;top: 150px;}
    .flx_referenzen .stacked-slider{height: 500px;}

    .flx_leistungen button.nav-link.active::before{display: none;}
    .flx_leistungen button.nav-link{margin-bottom: 25px;}
    .flx_leistungen ul{padding-bottom: 25px;}
    /* .flx_leistungen .btn{bottom: -35px;} */

    .flx_kontakt .formular{padding: 0 50px;}

    .flx_leistungsbereiche .fixbild{text-align: center;}
    
    .flx_karriere .kachel{margin-bottom: 30px;}
}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:600px) {

    div[class^="flx_"], div[class*="flx_"]{padding: 30px 0;}

    body,html,*{font-size:16px;}
    li::before{top: 3px;}

    .headline{padding-bottom: 30px;}

    #page-header .menu-mobile .menu li a{font-size: 120%;}

    .topline{padding-left: 70px;}
    .topline::before{top: 11px;}

    .flx_textblock.mitslider .kontakt img{width: 30px;height: 30px;}

    .flx_leistungen img{max-width: 320px;}

    #page-header .fixed_kontakt{display: none;}

    /* #page-footer .kontakt .instagram{top: 0;} */

    .flx_headerblock::before{display: none;}
    .flx_headerblock .content{max-width: 100%;}
    .flx_headerblock.mitvideo .content{padding: 0;}
    .flx_headerblock h1{margin-bottom: 0;}
    .flx_headerblock.mitvideo .headerbtn{margin-bottom: 0;}
    .flx_headerblock.mitvideo{max-height: none; padding-bottom: 30px!important;}
    .flx_headerblock.mitvideo .overlay{display: block; position: relative; background-color: transparent;}
    .flx_headerblock.mitvideo .overlay *{color: var(--black);}
    .flx_headerblock.mitvideo .topline::before{background-color: var(--black);}
    .flx_headerblock.mitvideo .overlay .container{position: relative; top: 0; transform: none;}
    .flx_headerblock.mitvideo .headerbtn{margin-bottom: 25px; color: var(--white);}

    .flx_headerblock.mitbild{padding:0 0 30px!important; overflow:visible; background:var(--white);}
    .flx_headerblock.mitbild .headerbild{position:relative; inset:auto; width:100%; height:auto;}
    .flx_headerblock.mitbild .headerbild img{width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; object-position:center; display:block;}
    .flx_headerblock.mitbild .container{position:relative; height:auto; z-index:2; align-content:initial;}
    .flx_headerblock.mitbild .content{max-width:100%; padding:0; background:transparent;}
    .flx_headerblock.mitbild .content *{color:var(--black);}
    .flx_headerblock.mitbild .headline{color:var(--black);}
    .flx_headerblock.mitbild .headerbtn{color:var(--white);}

    .flx_timeline .inhalt { padding-bottom: 50px; }
    .flx_timeline .timeline-wrapper { flex-direction: column; flex-wrap: nowrap; align-items: stretch !important; gap: 0; }
    .flx_timeline .timeline-item { width: 100%; flex: none; display: grid; grid-template-columns: var(--timeline-circle-size) 1fr; column-gap: 1.5rem; position: relative; padding-bottom: 3rem; }
    .flx_timeline .timeline-circle { grid-column: 1; grid-row: 1 / span 2; margin-bottom: 0 !important; }
    .flx_timeline .timeline-headline { grid-column: 2; margin-top: 0; margin-bottom: 0.5rem; padding-top: 0.25rem; }
    .flx_timeline .timeline-text { grid-column: 2; margin-bottom: 0; max-width: 100%; }
    .flx_timeline .timeline-item:not(:last-child)::after { top: calc(var(--timeline-circle-size) / 2); left: calc(var(--timeline-circle-size) / 2); width: var(--timeline-line-height); height: calc(100% + var(--timeline-circle-size) / 2); transform: translateX(-50%); background-color: var(--timeline-line-color); z-index: 1; }
    .flx_timeline .timeline-item:last-child { padding-bottom: 0; }

    .flx_karriere .stellenangebot{padding: 20px 30px 20px 30px;}
    .flx_karriere .karrieretitel{padding: 50px 0 20px 20px;}
    .flx_karriere .item{height: 350px;}
    .flx_karriere .owl-prev{right: 100px;}
    .flx_karriere .owl-next{right: 30px;} 
    .flx_karriere .scrollText{bottom: 80px; font-size: 100%;}  
    .flx_karriere .scrollButtons{bottom: 40px;}
    .flx_karriere .textblock{padding: 30px;}
    .flx_karriere .textblock .stellenbutton{bottom: 30px; right: 30px;}
    .textbild.bildpadding{margin-top: 20px; padding: 0;}

    .flx_textblock.mitslider .slide img{width: 280px;height: 480px;}
    .flx_textblock.mitslider .stacked-slider{height: 500px;}
    .flx_textblock.mitslider .slider .button{display: none;}

    .flx_slider .slider .item{min-height:280px;padding: 30px;}
    .flx_slider .slider .owl-nav{width: 30%;margin-top: 20px;}

    .flx_kachelblock .kachel{padding: 30px;}

    .flx_referenzen .stacked-slider .button{right: 65px;}

    .flx_kontakt .formular{padding: 0 15px;}
    .flx_kontakt .ansprechpartner img{margin-bottom: 30px; max-width: 200px;}

    .flx_kundenstimmen .headline{padding-bottom: 30px;}
}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:400px) {
    #page-header .menu-mobile .menu li a{font-size: 100%;}

    #page-footer .kontakt .facebook,
    #page-footer .kontakt .instagram{right: 15px;}

}
