/*
Theme Name: Understrap Child
Theme URI: https://understrap.com
Template: understrap
Author: Howard Development & Consulting
Author URI: https://howarddc.com
Description: The renowned WordPress starter theme framework that combined Underscores and Bootstrap. Trusted by more than 100,000 developers for building handcrafted, custom WordPress sites.
Tags: one-column,two-columns,three-columns,left-sidebar,right-sidebar,custom-background,custom-logo,custom-menu,featured-images,footer-widgets,full-width-template,theme-options,translation-ready,block-styles,wide-blocks,editor-style,threaded-comments,accessibility-ready
Version: 1.2.4.1766739068
Updated: 2025-12-26 09:51:08

*/



@font-face {
  font-family: 'Outfit';
  src: url('fonts/Outfit-Bold.woff2') format('woff2'),
      url('fonts/Outfit-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Outfit';
  src: url('fonts/Outfit-ExtraBold.woff2') format('woff2'),
      url('fonts/Outfit-ExtraBold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Outfit';
  src: url('fonts/Outfit-ExtraLight.woff2') format('woff2'),
      url('fonts/Outfit-ExtraLight.woff') format('woff');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Outfit';
  src: url('fonts/Outfit-Regular.woff2') format('woff2'),
      url('fonts/Outfit-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Outfit';
  src: url('fonts/Outfit-SemiBold.woff2') format('woff2'),
      url('fonts/Outfit-SemiBold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

body{position:relative;margin:0 !important;padding:0 !important;scroll-behavior:smooth;font-family:"Outfit",sans-serif !important;font-optical-sizing:auto;font-weight:400;font-style:normal;color:#2d3445;font-size:14px !important;background:#f2f2f2;overflow-x:hidden !important;}
body.modal-open{overflow-y:visible !important;padding-right:0 !important;}

#page-wrapper, #content{max-width:100%; width:100%;}
#primary{padding:0 !important; margin:0 !important;}
#page-wrapper #content div.row{margin: 0;}
.entry-title{display:none;}
#page-wrapper #content{margin: 0 !important; padding: 0 !important;}

[data-aos] {
  will-change: transform;
  /* Optional: den Container overflow verstecken */
  max-width: 100%;
}
a{color:#2d3445 !important;text-decoration:none !important;}
button{border:none;}
.ht-btn-red{font-size: 14px;
  padding: 10px 28px;
  border-radius: 30px;
  color: #fff;
  margin-top: 20px;
  background: #e1141c !important;}
.modal-content{overflow: hidden; position:relative;}
.ht-modal-close-btn{background: transparent;
  position: absolute;
  top: 10px;
  right: 10px;
  width: 34px;
  opacity: .3;}
.ht-btn{border-radius:20px;padding:4px 20px;font-size:13px;transition:background 0.3s ease,color 0.3s ease;}
.ht-btn-green{background:#b4b4b4;color:#fff;}
.ht-btn-green:hover{background:#399844;color:#fff;}

.ht-btn-green-ol{background:transparent; border:1px solid #b4b4b4;color:#fff; color:#b4b4b4;}
.ht-btn-green-ol:hover{background:#399844;color:#fff; border:1px solid #399844;}

h1,h2,h3, h4{color:#21396f !important; font-weight:700 !important;}
h2{font-size:48px !important;}

@media (max-width: 576px) {
  .h2-long {
    font-size: 30px !important;
  }
}

@media (max-width:576px){h2{font-size:36px !important;}}
.clearfix::after{content:"";clear:both;display:table;}
.ht-wk-konzept-box{position:relative;background:#fff;border-radius:10px;margin:20px 0;min-height:187px;transition:transform 0.3s ease,box-shadow 0.4s ease;}
.ht-wk-konzept-box:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,0.1);}
.anim-up{transition:transform 0.3s ease;}
.anim-up:hover{transform:translateY(-3px);}
.anim-boxshad{transition:box-shadow 0.4s ease;}
.anim-boxshad:hover{box-shadow:0 8px 20px rgba(0,0,0,0.1);}
.ht-oeffnungszeiten span{display:block;margin-bottom:10px;font-size:16px;}
.ht-open{width:8px;height:8px;background:#4caf50;border-radius:50%;display:inline-block;animation:ht-pulse-open 1.2s infinite ease-in-out;margin-left:8px;}
@keyframes ht-pulse-open{0%{transform:scale(0.9);opacity:0.7;}50%{transform:scale(1);opacity:1;}100%{transform:scale(0.9);opacity:0.7;}}
.ht-closed{width:8px;height:8px;background:#e53935;border-radius:50%;display:inline-block;animation:ht-pulse-closed 1.2s infinite ease-in-out;margin-left:8px;}
@keyframes ht-pulse-closed{0%{transform:scale(1);opacity:0.5;}50%{transform:scale(0.7);opacity:1;}100%{transform:scale(1);opacity:0.5;}}
.tblock{text-align:justify;text-justify:inter-word;hyphens:auto;-webkit-hyphens:auto;-ms-hyphens:auto;-moz-hyphens:auto;line-height:1.5;widows:2;orphans:2;margin-bottom:1rem;text-align-last:left;}
.ht-overlay-dotted{position:absolute;width:100%;height:100%;background-image:radial-gradient(rgba(255,255,255,.2) .8px,transparent 0);background-size:20px 20px;background-position:-15px -15px;top:0;left:0;}





header{position:fixed;top:10px;left:0;width:100%;background-color:rgba(255,255,255,0);/*transition:background-color 0.5s ease;box-shadow:none;*/z-index:1000;}
header.scrolled{/*background-color:rgba(255,255,255,1);box-shadow:0 2px 5px rgba(0,0,0,0.1);*/}
header,header a{color:#fff !important;}
header .ht-header-inner{box-shadow: 0px 4px 20px rgba(0,0,0,.1); backdrop-filter: blur(10px);background-color:rgba(255,255,255,0);transition:background-color 0.5s ease;box-shadow:none;padding: 10px 30px;border-radius: 10px;}
header.scrolled .ht-header-inner{background-color:rgba(255,255,255,1);box-shadow:0 2px 5px rgba(0,0,0,0.1);}
.ht-screener{height:100vh;position:relative;background:#000;background-image:url(images/img-screener.webp);background-size:cover;}
.ht-screener .ht-screener-title{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;text-align:center; z-index: 10;}
.ht-screener .ht-screener-title span{font-weight:800;letter-spacing:-2px;font-size:80px;}
header .ht-main-header{position:relative;height:80px;}
header .ht-header-logo{background-image:url(images/logo-1.svg);width:342px;height:40px;background-repeat:no-repeat;background-size:auto 40px;position:absolute;top:50%;left:0;transform:translateY(-50%);}
header .ht-header-logo a{position:absolute;width:100%;height:100%;}
header.scrolled .ht-header-logo{background-image:url(images/logo-2.svg);}
header.scrolled button,header.scrolled a,header.scrolled{color:#000 !important;}
header button{outline:none;border:none;background:transparent;padding:0;color:#fff;font-size:12px;margin-right:5px;}

header .ht-topbar button, header .ht-topbar-main .ht-topbar-kunde button{outline:none;border:none;background:transparent;padding:0;color:#fff;font-size:12px;margin-right:5px; border: 1px solid rgba(255,255,255,.2); padding: 3px 14px; border-radius: 20px;}
header.scrolled .ht-topbar button, header.scrolled .ht-topbar-kunde button{border: 1px solid rgba(0,0,0,.08);}

header .ht-topbar-main .ht-topbar-kunde{float:right; margin-left:14px;}

header nav button{margin-right:0;font-size:14px;}
header.scrolled button{color:#000;}
header .ht-topbar-main{padding:10px 0;border-bottom: 1px solid rgba(255,255,255,.1);font-size:12px;}
header.scrolled .ht-topbar-main{border-bottom:1px solid rgba(0,0,0,.05) !important;}
header nav{position:absolute;right:0;top:50%;transform:translateY(-50%);}
header nav a,header nav button{margin-left:20px;}
header .ht-topbar{float:left;}
header .ht-topbar-contact{float:right; padding:4px 0 4px 24px; background-image:url(images/ico-mail-white.svg); background-size:16px; background-position:left center; background-repeat:no-repeat;}
header.scrolled .ht-topbar-contact{background-image:url(images/ico-mail-black.svg);}
.ht-nav-link.active{color:#e20a17 !important;}
header nav button.ht-kontakt-btn{font-size: 12px;padding: 6px 28px; border-radius: 30px;color: #fff !important; background: #e1141c;}
.ht-menu{display:none;}


@media (max-width:1200px){
.ht-topbar-main, .ht-header-nav{display:none;}
.ht-header-inner{padding: 10px 15px !important;}
header .ht-main-header{height:60px !important;}
.ht-header-logo{width: 100% !important; height: 28px !important; background-size: auto 26px !important;}
.ht-menu{position: absolute; right: 0px; top: 50%; transform: translateY(-50%); display: block;}
.ht-menu img{width: 22px;}
}

@media (min-width:1200px) and (max-width:1400px){
header .ht-header-logo{width: 300px; background-size: auto 35px;}

}




.ht-mobile-menu{padding: 0;
  margin: 0;
  width: 100% !important;
  position: relative; padding: 0 !important;
  margin: 0 !important;
}

.ht-mobile-menu .modal-content{border-radius: 0;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  width: 88%;}

  .ht-mobile-menu nav{}

.ht-mobile-menu a, .ht-mobile-menu button{display:block;display: block; background:transparent; padding:0;
  font-size: 16px;
  font-weight: 200; margin-bottom:20px;}

.ht-menu-title{background: #21396F;
  background: linear-gradient(27deg,rgba(33, 57, 111, 1) 0%, rgba(63, 94, 250, 1) 100%);
  position: absolute;
  left: 0;
  top: 0;
  width: 50px;
  height: 100%;}

  .ht-menu-title img {position: absolute;
    top: 50%;
    left: 50%;
    max-width: 14px;
    transform: translate(-50%, -50%);}

    .ht-menu-inner{padding:30px 30px 30px 70px;}

    .ht-menu-inner  .ht-btn-red{text-align: left;
      padding: 10px 20px;
      border-radius: 40px;
      color: #fff !important;
      font-size: 14px;}



footer{background:rgba(0,0,0,.05);}
.ht-ft-st{position:relative;padding:0 0 40px 0;}
.ht-ft-st-container{background:#fff;border-radius:10px !important;overflow:hidden;box-shadow:0 0 5px rgba(0,0,0,0);transition:transform 0.3s ease,box-shadow 0.4s ease;}
.ht-ft-st-container:hover{box-shadow:0 8px 20px rgba(0,0,0,0.1);transform:translateY(-3px);}
.ht-ft-st-container .ht-ft-st-img{position:relative;width:100%;height:200px;background-size:cover; background-position:center center;}
.ht-ft-st-img-info{position:absolute;right:10px;top:10px;border-radius:4px;background:#e20a17;padding:4px 10px;color:#fff;font-size:12px;font-weight:600;}
.ht-ft-st-img-bochum{background-image:url(images/st-bo.webp);}
.ht-ft-st-img-essen{background-image:url(images/st-e.webp);}
.ht-ft-st-img-dortmund{background-image:url(images/st-do.webp);}
.ht-ft-st-img-soest{background-image:url(images/st-so.webp);}
.ht-ft-st-img-hoexter{background-image:url(images/st-hx.webp);}
.ht-ft-st-content{padding:20px;}
.ht-ft-st-content span:nth-child(1){font-weight:700;display:block;}
.ht-ft-st-content span:nth-child(2){font-size:12px;display:block;}
.ht-standort{font-size:12px;margin:20px 0;background:rgba(0,0,0,.06);padding:6px 4px;border-radius:10px;}
.ht-ft-st-tel{font-size:12px;margin-top:4px;background-image:url(images/ico-phone.svg);background-size:18px;background-repeat:no-repeat;height:18px;padding-left:26px;}
.ht-standort span{display:inline-block !important;}
.ht-standort .ht-zeiten{display:block !important;font-size:11px;margin-left:22px;}
.ht-standort .ht-status{margin-left:4px;font-weight:700;}
.ht-standort .ht-ausnahme-hinweis{padding:0 10px !important; font-size:11px;}
.ht-gmap-link{display:block;margin-top:4px;}
.ht-main-footer{padding:40px 0 20px 0;text-align:center;font-size:11px;}
.ht-main-footer img{width:200px;opacity:.7;margin-bottom:10px;}
.ht-main-footer a{margin-top:10px;display:inline-block;margin-right:10px;}
.ht-main-footer a:last-child{margin-right:0;}


@media (max-width:576px){
.ht-ft-st .col{display:block; flex:auto; margin-bottom:20px;}
.ht-main-footer{padding:0 0 20px 0;}
}

@media (max-width:1400px){
  .ht-ft-st-content span:nth-child(2){font-size:10px;}
}


.ht-1{}
.ht-1 span{display:block;padding:0 10px;}
.ht-top-title{text-align:center;padding:120px 0;}
.ht-top-title h2{font-size:60px;font-weight:700;color:#21396f;}
.ht-top-title span{letter-spacing:10px;text-transform:uppercase;font-size:22px;color:#a1a1a1;}
.ht-1 .col div{text-align:center;}
.ht-1 .col .ht-about-ico{text-align:center; margin-bottom:12px;}
.ht-1 .col .ht-about-ico img{max-width:120px;}


@media (max-width:576px){
  .ht-1 .ht-top-title{padding:40px 0;}
  .ht-1  .col{display:block !important; flex:auto !important; margin-bottom:40px;}
  .ht-1  .col:nth-child(3){ margin-bottom:10px;}

  .ht-1 .ht-top-title h2{font-size:26px !important;}
  .ht-1 .ht-top-infobox button{opacity:1 !important;}

  }

.ht-2{margin-top:40px}
.ht-2 .col {background: rgba(0,0,0,0.03);
  margin: 5px;
    margin-top: 5px;
  border-radius: 6px; font-size:12px; padding: 0 20px 40px 20px; margin-bottom:40px;}

.ht-top-infobox{text-align:center;}
.ht-top-infobox img{max-width:100px;display:inline-block;margin-bottom:10px;}
.ht-top-infobox span{font-size:18px;font-weight:600;color:#21396f;display:block;}
.ht-top-infobox button{transition:opacity 0.5s ease,background 0.3s ease,color 0.3s ease,transform 0.3s ease,border-color 0.3s ease;opacity:0;margin-top:20px;border:1px solid rgba(0,0,0,0.1);background:transparent;padding:8px 16px;border-radius:20px;font-size:14px;animation:fadeIn 1.5s ease forwards;}
.ht-top-infobox button:hover{background:#21396f;color:#fff;transform:translateY(-3px);border:1px solid #21396f;}
.ht-top-infobox:hover button{opacity:1;}
.ht-content-right .ht-big-section-image{max-width:40%;}

@media (max-width:576px){
  .ht-2 .col { margin-bottom:10px;}
}

.ht-3,.ht-4{position:relative; padding:100px 0;}
.ht-3 .container,.ht-4 .container{position:relative; width:100%; max-width:100% !important;}
.ht-3 .container .col,.ht-4 .container .col{margin:0; padding:0; position:relative;}

.ht-3 .container .content-col, .ht-4 .container .content-col{padding:0 60px;}

.ht-3 .container .img-col,.ht-4 .container .img-col{flex: 0 0 40% !important;}
@media (max-width:576px){
  .ht-3,.ht-4{position:relative; padding:40px 0;}

  .ht-3 .container .content-col, .ht-4 .container .content-col{padding:0 15px;}
  .ht-3 .container .img-col,.ht-4 .container .img-col{display:none !important;}

}
.ht-big-sec-numbers{padding:10px 0;display:inline-block;margin-top:10px;}
.ht-big-sec-numbers-item span{font-size:36px;color:#21396f; display:inline-block; font-weight:800;}
.ht-big-sec-numbers-item  div{color: #a1a1a1; font-size: 12px;}
.ht-content-main button{padding:10px 20px;border-radius:25px;margin-top:20px;}
.ht-big-sec-numbers-item{float:left;width:160px;border:1px solid rgba(0,0,0,.07);padding:10px;border-radius:10px;margin-right:10px;text-align:center;}
.ht-content-main h4{color:#a1a1a1 !important;font-size:20px; font-weight:400 !important;}
.ht-content-right .ht-content-main{position:absolute;left:calc(40% + 40px);top:50%;transform:translateY(-50%);padding-right:300px;}

.ht-content-left{text-align:right;}
.ht-content-left .ht-content-main{position:absolute;left:0;top:50%;transform:translateY(-50%);padding-left:300px;text-align:left;width:calc(60% - 60px);}




.ht-5{padding: 100px 0 10px 0;margin-top:100px;background:rgba(0,0,0,.05);}
.ht-5 button{padding:10px 20px;border-radius:25px;margin-top:20px;}
.ht-wk-konzept-box{position:relative;background:#fff;border-radius:10px;margin:20px 0;min-height:187px;transition:transform 0.3s ease,box-shadow 0.4s ease;}
.ht-wk-konzept-box:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,0.1);}
.ht-wk-konzept-box img{position:absolute;top:50%;left:20px;transform:translateY(-50%);max-width:160px;}

.ht-wk-konzept-box-content{padding:20px 20px 20px 200px;}

@media (max-width:1440px){
  .ht-content-right .ht-content-main{left:calc(35% + 40px); padding-right:60px;}
  .ht-content-left .ht-content-main{padding-left:60px; max-width:35%;}
  }

  @media (max-width:576px){
    .ht-2{margin-top:0 !important;}
    .ht-big-sec-numbers{width:100%;}
    .ht-big-sec-numbers-item{font-size: 11px; line-height: 12px;}
    .ht-3 .ht-big-sec-numbers-item{width:calc(33% - 10px);}
    .ht-4 .ht-big-sec-numbers-item{width:calc(50% - 10px);}
    .ht-big-sec-numbers-item:last-child{margin-right:0;}
    .ht-big-sec-numbers-item span{font-size:20px; margin-bottom:10px;}
    .ht-5{padding:40px 0; margin-top:0;}
    .ht-5 .col{margin-bottom:0;}
    .ht-wk-konzept-box{text-align: center;}
    .ht-wk-konzept-box img{top:20px; left:50%; transform: translate(-50%, 0);}
    .ht-wk-konzept-box-content{padding: 140px 20px 20px 20px;}
    .ht-5  .col{display:block !important; flex:auto !important; margin-bottom:10px;}

  }


.individ-video-background{position:relative;height:100vh;overflow:hidden;background:#000;}
.individ-video-background video{position:absolute;top:50%;left:50%;min-width:100%;min-height:100%;width:auto;height:auto;transform:translate(-50%,-50%);}
.individ-video-background-content{position:absolute;z-index:3;color:#fff;text-align:center;top:50%;left:50%;transform:translate(-50%,-100%);width:35vw;}
.individ-video-background .ht-screener-title{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;text-align:center;z-index:10 !important; text-align: center;}
.individ-video-background .ht-screener-title span{font-weight:800;letter-spacing:-2px;font-size:80px;}
.individ-video-background .ht-screener-title div{font-size:22px;}
.ht-screener-overlay{background-image:url(images/screener-overlay.webp);background-size:cover;z-index:5;position:absolute;top:0;left:0;width:100%;height:100%;}

.individ-video-background-site{max-height:1000px;}
.individ-video-background-site .ht-screener-title{width: 100%;}
.individ-video-background-site .ht-screener-title img.ht-zitat-d{max-width: 60%; height: 400px; display:inline-block;}
.individ-video-background-site .ht-screener-title img.ht-zitat-m{display:none;}


@media (max-width:576px){
  .individ-video-background-site .ht-screener-title img.ht-zitat-d{display:none;}
  .individ-video-background-site .ht-screener-title img.ht-zitat-m{max-width: 90%; height: 400px; display:inline-block;}


  .individ-video-background{height:70vh;}
.individ-video-background .ht-screener-title{width:calc(100% - 40px);}
.individ-video-background .ht-screener-title span{font-size:60px; line-height:60px;}
.individ-video-background .ht-screener-title div{font-size: 14px; margin-top: 20px;}
}

@keyframes slide{from{transform:translateX(0);}to{transform:translateX(-100%);}}
.ht-logo-slider{background:#f2f2f2;}
.logos{overflow:hidden;padding:20px 0;background:#f2f2f2;white-space:nowrap;position:relative;}
.logos:before,.logos:after{position:absolute;top:0;width:250px;height:100%;content:"";z-index:2;}
.logos:before{left:0;background:linear-gradient(to left,rgba(0,0,0,0),#f2f2f2);}
.logos:after{right:0;background:linear-gradient(to right,rgba(0,0,0,0),#f2f2f2);}
.logos:hover .logos-slide{animation-play-state:paused;}
.logos-slide{display:inline-block;animation:80s slide infinite linear;}
.logos-slide img{height: 85px;
  margin: 0 5px;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.6;
  max-width: 250px !important;
  background: #fff;
  padding: 10px 30px;
  border-radius: 5px;}
.logos-slide img:hover{-webkit-filter:grayscale(0%);filter:grayscale(0%);opacity:1;}
.individ-brand-container .logos{background:transparent !important;}
.individ-brand-container .logos:before{left:0;background:transparent !important;}
.individ-brand-container .logos:after{right:0;background:transparent !important;}
.arrow-container{position:absolute;bottom:40px;left:50%;transform:translateX(-50%);z-index:10;}
.arrow{animation:float 2s ease-in-out infinite;width:30px;}
@keyframes float{0%{transform:translateY(0);}50%{transform:translateY(-10px);}100%{transform:translateY(0);}}
.modal-content{border:none !important;}
.ap-card{width:360px !important;text-align:center;}
.ap-content{padding:40px;}
.ap-img-container{position:relative;}
.ap-img{width:170px;display:inline-block;}
.ap-img-dec{position:absolute;left:50%; transform: translateX(30px);bottom:10px;width:70px;}
.ap-qr{width:100px;margin-top:20px;}
.ap-name{display:block;margin-top:10px;font-size:24px;font-weight:700;line-height:24px;}
.ap-name-sub{display:block;font-size:12px;opacity:.5;}
.ap-phone{margin-top:10px;display:block;}
.ap-mail{display:block;margin-top:10px;}
.ap-phone span,.ap-mail span{font-size:12px;opacity:.5;display:block;}

.ht-modal-wimg{width:80% !important;max-width:100vw !important;min-height:500px;}
.ht-wimg-img{background-image:url(images/modal-placeholder-bg.webp);background-size:cover;width:500px;position:absolute;left:0;top:0;height:100%;}
.ht-wimg-content{padding:40px 40px 40px 540px;}
.ht-modal-wimg .modal-content{min-height:600px;}

@media (max-width:1440px){
  .ht-modal-wimg{width:80% !important;}
  .ht-wimg-img{width:500px;}
  .ht-wimg-content{padding:40px 40px 40px 540px;}
  }

.ht-jobs-item{background: rgba(0,0,0,0.05); border-radius: 10px; padding: 10px 10px 10px 80px; background-image:url(images/ico-job.svg); background-position: 20px center; background-size: 40px; background-repeat: no-repeat; margin-top:10px;}
.ht-jobs-item span{font-size: 10px; text-transform: uppercase; font-weight: 600; background: red; padding: 3px 14px; border-radius: 20px; color: #fff; display: inline-block; margin-bottom: 4px;}
.ht-jobs-item .ht-job-bezeichnung{font-size: 16px; font-weight: 600;}
.ht-jobs-item .ht-job-ort{font-size: 12px; opacity: .7;}

.ht-md-standort-left{position: absolute; left: 0; bottom: 0; padding: 30px; color: #fff; width:100%; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);}
.ht-md-standort-left h2{color:#fff !important; margin-bottom:0; line-height:48px;}
.ht-md-standort-left .ht-standort{margin:6px 0 10px 0; background: rgba(255,255,255,.15); padding: 6px 0; font-size:14px !important;}
.ht-md-standort-left .ht-standort .ht-zeiten{font-size:14px; margin-left:10px; display:inline-block !important;}
.ht-md-standort-left .ht-gallery-title{font-size: 18px;}
.ht-md-count{float: left;width: 160px;border: 1px solid rgba(0,0,0,.07);padding: 10px;border-radius: 10px;margin-right: 10px;text-align: center;}
.ht-md-count-container{margin:20px 0;}
.ht-md-count .count-up{font-size:22px; color:#21396f; font-weight:800;}
.ht-md-count div{color: #a1a1a1; font-size: 12px;}

.ht-md-ozt-l{float:left;}
.ht-md-ozt-r{float:left; margin-left:50px;}


.ht-topbar .ht-standort{display:inline-block !important; margin: 0 10px 0 0 !important; padding:0; background: rgba(0,0,0,.0) !important;}
.ht-topbar .ht-standort .ht-open{margin-left: 0 !important;}
.ht-topbar .ht-standort .ht-status, .ht-topbar .ht-standort .ht-zeiten, .ht-topbar .ht-standort .ht-ausnahme-hinweis{display:none !important;}























  /* Galerie Grid */
  .gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    gap: 10px;
  }

  .gallery img {
    width: 100%;
    cursor: pointer;
    border-radius: 4px;
    transition: transform 0.2s;
  }

  .gallery img:hover {
    transform: scale(1.05);
  }

  /* Lightbox Overlay */
  .lightbox {
    display: none;
    position: fixed;
    top:0; left:0;
    width:100%; height:100%;
    background: rgba(0,0,0,0.8);
    justify-content: center;
    align-items: center;
    z-index: 10000;
    flex-direction: column;
  }

  .lightbox img {
    max-width: 90%;
    max-height: 80%;
    border-radius: 8px;
  }

  .lightbox .controls {
    margin-top: 10px;
    display: flex;
    gap: 20px;
  }

  .lightbox button {
    padding: 10px 20px;
    font-size: 1rem;
    border: none;
    border-radius: 5px;
    cursor: pointer;
  }

  .lightbox .close {
    position: absolute;
    top: 20px;
    right: 30px;
    background: transparent;
    color: white;
    font-size: 2rem;
    border: none;
    cursor: pointer;
  }



  @media (max-width:576px){

    .modal-dialog{width:auto !important;}
    .ht-wimg-img{width:100%; position: relative; height:200px;}
    .ht-wimg-content{padding:20px;}
    .ht-modal-wimg .ht-md-count-container{font-size:11px; line-height:12px;}
    .ht-modal-wimg .ht-md-count-container .ht-md-count{width:calc(33% - 10px);}
    .ht-modal-wimg .ht-md-count-container span{font-size:20px; margin-bottom:10px;}

  }



  .ht-screener-event{background-image:url(images/img-eventbg.webp);}
  .ht-screener-event img{width:50vw; display:block;}
  .ht-screener-event .ht-countdown-container{position: absolute;bottom: 10%;left: 50%;transform: translateX(-50%); color:#fff; text-align:center; z-index: 10;}
  .ht-screener-event .ht-countdown .ht-countdown-item{display:inline-block; min-width:122px; text-align:center; background:rgba(0,0,0,0.3); padding:20px 30px; border-radius:10px; margin-bottom:10px;}
  .ht-screener-event .ht-countdown .ht-countdown-item span{font-size:48px; line-height:48px; display:inline-block;}
  .ht-screener-title button{font-size: 14px; padding: 10px 28px; border-radius: 30px; color: #fff; margin-top: 20px; background: #e1141c;}
  .ht-top-title-event img{max-width: 30vw;}

  .ht-countdown-container .ht-event-screener-location{font-size:12px;}

.ht-event-footer{position: fixed;bottom: 0;left: 0;width: 100vw; display: flex; justify-content: center; padding: 20px 0; background: linear-gradient(to top, rgba(255,255,255,1), rgba(255,255,255,0)); opacity: 0; visibility: hidden; transition: opacity 0.5s ease, visibility 0.5s ease;pointer-events: none; z-index: 999; }
    
.ht-event-footer.show {opacity: 1;visibility: visible; pointer-events: auto; /* Klicks aktivieren, wenn sichtbar */}

.ht-event-gallery{ border-radius:10px; margin-top:40px;}

.ht-event-adress{background: rgba(0,0,0,0.04); border-radius: 10px;
  padding: 20px 20px 20px 90px;
  margin-top: 10px;
  margin-bottom: 20px;
  position: relative;
  text-align: left !important;
  background-image: url(images/ico-map.webp);
  background-repeat: no-repeat;
  background-position: 13px center;
  background-size: 60px;}

  .ht-event-adress:hover{background: rgba(0,0,0,0.06); background-image: url(images/ico-map.webp); background-repeat: no-repeat;
    background-position: 13px center;
    background-size: 60px;}

  .ht-event-adress img{position: absolute;
    top: 50%;
    right: 26px;
    width: 8px;
    transform: translateY(-50%);
  }

  .ht-event-adress span{padding: 0;
    font-size: 16px;
    font-weight: 600; display:block;}

.ht-md-event-logo{position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); max-width:80%; width:80%;z-index:10;}

.ht-event-agenda-table{text-align:left !important; text-align: left; border-collapse: separate !important; border-spacing: 4px; border: transparent !important;}
.ht-event-agenda-table td:nth-child(1){width:30%;}
.ht-event-agenda-table td:nth-child(2){width:70%;}
.ht-event-agenda-table td{border-radius: 6px;}

.ht-event-content{padding:40px 0;}

@media (max-width:576px){
  .ht-screener .ht-screener-title{transform: translate(-50%,-80%);}
  .ht-screener-event{height:70vh;}
  .ht-screener-event img{width:80vw;}
  .ht-screener-event .ht-countdown-container{width:100%;}
  .ht-screener-event .ht-countdown .ht-countdown-item{min-width: 70px; padding: 20px 10px;font-size: 10px;}
  .ht-screener-event .ht-countdown .ht-countdown-item span{font-size: 18px;line-height: 18px;}

  .ht-top-title-event img{max-width: 80vw;}
  .ht-top-title-event{padding:60px 0;}

  .ht-event-content .col{display:block; flex:auto;}
  .ht-event-content .col:nth-child(2){margin-top:40px;}
  .ht-event-gallery{background:rgba(0,0,0,0); padding:0;}

  }
    

  .ht-event-registration-container{position: relative; margin-bottom: 14px;}
  .ht-event-registration-kdnummer{position: absolute; left: 0; top: 0; width: 20%;}
  .ht-event-registration-name{padding-left: calc(20% + 10px);}
  .ht-event-registration textarea{width: 100%; border-radius: 10px;}
  .ht-event-registration .ht-event-registration-container input{width:100%; border-radius:30px;padding:5px 10px;}
  .ht-event-registration .ht-event-registration-container input, .ht-event-registration textarea{border:1px solid rgba(0,0,0,0.1); padding:10px;}
  .ht-event-registration label{font-size:13px;}
  .ht-event-registration input.ht-btn-red{border:none; margin-top:0;}

  .ht-event-noti{height: 100vh; position: relative; background-image:url(images/img-eventbg.webp); background-size:cover;}
  .ht-event-noti-content{position: absolute;
    z-index: 10;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 10px;
    padding: 40px;
    text-align: center;}
    .ht-event-noti-content img{width: 80px;
      margin-bottom: 20px;}
    .ht-event-noti-content span{font-size:11px; opacity:.5; display:block;}

      .ht-event-noti-content .ht-btn-red{display:inline-block !important; color:#fff !important;}

  .entry-content p:first-child{display:none !important;}
    
  @media (max-width:576px){
    .ht-modal-wimg-event .ht-wimg-img{height:200px;}
    .ht-event-registration-kdnummer{ width: 30%;}
    .ht-event-registration-name{padding-left: calc(30% + 10px);}
    .ht-event-registration label{font-size:11px;}
    .ht-event-noti-content{width:80%;}

    }



















  /* =============================================================================
   HTML5 CSS Reset Minified - Eric Meyer
   ========================================================================== */


canvas{
  display:block;
  vertical-align:bottom;
}


/* ---- stats.js ---- */

.count-particles{
  background: #000022;
  position: absolute;
  top: 48px;
  left: 0;
  width: 80px;
  color: #13E8E9;
  font-size: .8em;
  text-align: left;
  text-indent: 4px;
  line-height: 14px;
  padding-bottom: 2px;
  font-family: Helvetica, Arial, sans-serif;
  font-weight: bold;
}

.js-count-particles{
  font-size: 1.1em;
}

#stats,
.count-particles{
  -webkit-user-select: none;
  margin-top: 5px;
  margin-left: 5px;
}

#stats{
  border-radius: 3px 3px 0 0;
  overflow: hidden;
}

.count-particles{
  border-radius: 0 0 3px 3px;
}


/* ---- particles.js container ---- */

#particles-js{
  width: 100%;
  height: 100%;
  background-image: url('');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}



.ht-landingpage-screener, .ht-landingpage-screener .container{position: relative; height:100vh;}
.ht-landingpage-screener{background-size: cover;}
.ht-landingpage-screener-kundewerden {background-image: url(images/img-kundewerden.webp);}
.ht-landingpage-screener-newsletter {background-image: url(images/img-newsletter.webp);}

.ht-landingpage-screener-title{position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); border-radius:6px;font-size:48px; font-weight:800; z-index: 10; background: #21396f !important; color: #fff; padding: 10px 30px;}
.ht-landingpage-screener-content{position: absolute; z-index: 10; bottom: 30px; left: 0; width: 100%;}


  .ht-landingpage-screener-content .col, .ht-kd-mobile .col{background: #fff; padding: 20px 20px 20px 90px !important; border-radius: 6px; margin: 5px; font-size:12px; background-image:url(images/ico-arrow-right.svg); background-size: 20px; background-repeat: no-repeat; background-position: 40px center;}

    .ht-landingpage-screener-newsletter .col:nth-child(3){background: transparent !important; position:relative;}
    .ht-landingpage-screener-newsletter img{position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); max-height: 70vh; z-index: 10; max-width: 90%;}


  .ht-landingpage-screener-content .col span{font-size:16px; line-height:16px; font-weight:700; display:block; margin-bottom:4px; color:#21396f !important;}
.landingpage-content{padding:100px 0;}

.ht-subpage-screener{position: relative; background-size:cover !important;}
.ht-subpage-screener .container{height: 580px !important; position:relative;}
.ht-subpage-screener .container h1{position:absolute; z-index:10; color:#fff !important; bottom:30px; left:0;}

@media (max-width:1200px){
  .ht-subpage-screener .container{height: 400px !important;}
  .ht-subpage-screener .container h1{left:10px;}
  }

  .ht-subpage-container{padding:40px 0;}
  @media (max-width:1200px){
    .ht-subpage-container{padding:20px 0;}
    }

    .ht-subpage-container h2{font-size:28px !important;}




.ht-form-style{border-radius: 6px; background: rgba(0,0,0,0.04); padding: 20px;}
.ht-form-style input{border: 1px solid rgba(0,0,0,0.1); padding: 10px; border-radius: 30px !important;}
.ht-form-style textarea{border: 1px solid rgba(0,0,0,0.1); padding: 10px; border-radius: 6px !important;}

.ht-form-style input[type="submit"] {
  font-size: 14px;
  padding: 10px 28px;
  border-radius: 30px;
  color: #fff;
  margin-top: 20px;
  background: #e1141c !important;
}

.ht-form-style input[type="text"], .ht-form-style textarea, .ht-form-style input[type="file"], .ht-form-style input[type="email"], .ht-form-style label {width:100%;}

.ht-form-style label{font-size:13px !important;}

.ht-cr-inputs label{display:block;}
.ht-cr-inputs input{max-width:100%; width:100%; margin-bottom:10px;}
.ht-cr-kd, .ht-cr-andrede{float:left; width:20%; margin-right:10px;}
.ht-cr-mail, .ht-cr-name{float:left; width:calc(80% - 10px);}


@media (max-width:576px){

  .ht-landingpage-screener-kundewerden, .ht-landingpage-screener-kundewerden .container{height:50vh !important;}
  .ht-form-style label{font-size:11px !important;}

  .ht-landingpage-screener, .ht-landingpage-screener .container{position: relative; height:60vh;}
  .landingpage-content{padding:20px 0;}
  .ht-cr-kd{float:left; width:100%; margin-right:0; margin-bottom:6px;}
.ht-cr-mail{float:left; width:100%; margin-bottom:6px;}

.ht-landingpage-screener-title{padding: 10px 20px;
  width: max-content; font-size:30px;}

.ht-kd-mobile .col{background-color: rgba(0,0,0,0.02); padding: 20px 20px 20px 40px !important;  background-size: 10px; background-repeat: no-repeat; background-position: 15px center;}


  }


  .ht-nws-item{border: 1px solid rgba(0,0,0,0.07); border-radius: 6px; padding:20px 20px 20px 70px; margin-bottom:10px; background-image:url(images/ico-plus.svg); background-repeat:no-repeat; background-position:20px center; background-size:30px;}
  .ht-nws-item span{font-size: 16px;
    line-height: 16px;
    font-weight: 700;
    display: block;
    margin-bottom: 4px;
    color: #21396f !important;}

#md-kontakt .ht-form-style{background: rgba(0,0,0,0);
  padding: 0px;}
  #md-kontakt .ht-form-style textarea{height:100px !important;}

.lp_kundewerden .ht-wk-konzept-box{border: 1px solid rgba(0,0,0,0.07); min-height: 120px;}
.lp_kundewerden .ht-wk-konzept-box h3{font-size: 18px;}

.lp_kundewerden .ht-wk-konzept-box span{font-size: 12px; line-height: 14px; display: block;}



.ht-nws-img-mobile{display:none;}
.ht-nws-img-desk{display:block;}

@media (max-width:576px){
.ht-landingpage-newsletter .landingpage-content{padding: 210px 0 20px 0 !important;}
.ht-nws-img-mobile{position: absolute;
bottom: -200px !important;
width: 80vw;
left: 50%;
transform: translateX(-50%); display:block;}

.ht-landingpage-newsletter .ht-landingpage-screener, .ht-landingpage-screener .container{height:40vh;}
.ht-nws-img-desk{display:none;}

.ht-nws-item {font-size:12px;}
.ht-nws-item span {font-size:16px;}
.ht-landingpage-newsletter .row .col:nth-child(2){margin-top:40px;}
}


  .ht-mobile-only{display:none;}
  .ht-desk-only{display:block;}

  @media (max-width:576px){
    .ht-mobile-only{display:block;}
    .ht-desk-only{display:none;}
  }
  



  .ht-3 .ht-content-main, .ht-4 .ht-content-main{max-width:70%;}
 

  .ht-form-wrapper {
    display: none;
}

.ht-form-wrapper.active {
    display: block;
}

.ht-btn-nwslt{background: rgba(0,0,0,0.1);
  padding: 4px 10px;
  font-size: 13px;
  border-radius: 4px;
  margin-right: 6px;}
.ht-nwslt-buttons button{opacity:.5;}
.ht-nwslt-buttons button.active{opacity:1; background: #21396f; color:#fff; font-weight:bold;}

.ht-nwslt-title{font-size: 13px;
  margin-bottom: 20px;
  display: block;
  border-bottom: 1px solid rgba(0,0,0,0.07);
  padding-bottom: 20px;}







    .leihartikel{
        background: rgba(0,0,0,0.03);
        border-radius: 10px;
        padding: 20px;
        margin-bottom:20px;
        box-shadow:0 2px 5px rgba(0,0,0,0.1);
    }
    .ht-leihartikel-img{
        width:100%;
        height:300px;
        background-size:cover;
        background-position:center center;
        position:relative;
        margin-bottom:10px;
        border-radius:5px;
    }
    .ht-leihartikel-title{
        font-size:22px;
        font-weight:600;
        margin-bottom:5px;
    }
    .ht-leihartikel-desc{
        margin-bottom:10px;
    }
    .ht-leihartikel-form{
        padding-top:10px;
        margin-top:10px;
        border-top:1px solid rgba(0,0,0,0.09);
        font-size:12px;
    }
    .ht-leihartikel-form input, .ht-leihartikel-form textarea{
        display:block;
        width:100%;
        border:1px solid rgba(0,0,0,0.2);
        padding:10px;
        border-radius:10px;
        margin-bottom:10px;
    }
    .ht-leihartikel-form input{
        border-radius:20px;
    }
    .ht-leihartikel-last{margin-top: 10px; font-size: 10px; opacity: .6;}
    .ht-leihartikel-form textarea{height:200px;}
    .badge-success{
        background-color:#28a745;
        color:#fff;
        padding:3px 8px;
        border-radius:12px;
        font-size:0.85em;
        display:inline-block;
        margin-bottom:5px;
    }
    .badge-danger{
        background-color:#dc3545;
        color:#fff;
        padding:3px 8px;
        border-radius:12px;
        font-size:0.85em;
        display:inline-block;
        margin-bottom:5px;
    }
    .hersteller-logo img{
        max-height:50px;
        margin-bottom:10px;
        display:block;
        margin-left:auto;
        margin-right:auto;
    }


.ht-leihartikel-manulogo img{max-height:50px; max-width:200px; padding:20px 0 0 30px;}
.ht-leihartikel-title{margin-bottom: 0;}
.ht-leihartikel-manu{opacity: .5;font-size: 12px;}

.ht-leihartikel-li{padding:10px !important;}

.ht-leihartikel-kname{font-size: 13px;
  font-weight: bold; display: block;}
.ht-leihartikel-kdate{display: block;
  font-size: 11px; opacity:.6;}


.ht-leihartikel-li button{opacity:0;}
.ht-leihartikel-li:hover button{opacity:1;}

.ht-leihartikel-button{width:100%; font-size:11px; font-weight:bold;}



    .ht-leihartikel-login{height: 100vh;
      background: url(https://www.autoteile-klostermann.de/wp-content/uploads/2025/12/img-eventbg.webp);
      background-size:cover;
      position: relative;}
.ht-leihartikel-login-content{position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  padding: 30px;
  border-radius: 10px;}




  .frontend-dashboard{padding:40px 0 0 0;}
  .frontend-dashboard-header{height: 400px;
    background: #000;
    position: relative;
    background: url(https://www.autoteile-klostermann.de/wp-content/uploads/2025/12/img-eventbg.webp);
      background-size: auto;
    background-size: cover;}

    .frontend-dashboard-header-top{position: relative; height: 400px;}
    .frontend-dashboard-title{position: absolute; bottom: 20px; left: 0;}
    .frontend-dashboard-title img{max-width: 400px; height: 80px;}

    .frontend-dashboard-user{position: absolute;
      bottom: 20px;
      right: 0;
    color:#fff;}





/* TEMPORAER BIS MAIL FUNKTIONIERT*/
 header .ht-topbar-kunde button{display:none !important;}
 header .ht-kontakt-btn{display:none !important;}
.ht-mobile-menu .ht-kontakt-btn{display:none !important;}


 /*Standorte Gallerie deaktiviert*/
 .ht-gallery-title, .gallery{display:none !important;}

 .ht-wimg-content .ht-md-count-container{display:none !important;}

 /*QR Code bis erstellt deaktiviert*/
 .modal-content .ap-qr{display:none !important;}


 /*Cookiebot*/
 #CybotCookiebotDialog .CybotCookiebotDialogBodyContentHeading, #CybotCookiebotDialogBodyContentText, #CybotCookiebotDialogBodyLevelButtonsSelectPane .CybotCookiebotDialogBodyLevelButtonDescription, .CybotCookiebotDialogGpcText, #CybotCookiebotDialogFooter .CybotCookiebotDialogBodyButton, #CybotCookiebotDialogBodyEdgeMoreDetailsLink{font-family: "Outfit",sans-serif !important;}
 #CybotCookiebotDialog *, #CybotCookiebotDialogBodyUnderlay *{font-size:12px !important;}
 #CybotCookiebotDialogBodyContentTitle{font-size:14px !important;}
 #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyEdgeMoreDetails a, #CybotCookiebotDialogFooter .CybotCookiebotDialogBodyButton{color:#fff !important;}
 #CybotCookiebotDialogFooter .CybotCookiebotDialogBodyButton, #CybotCookiebotDialog input:checked + .CybotCookiebotDialogBodyLevelButtonSlider{background-color:#2038bc !important;}
 #CybotCookiebotDialogFooter .CybotCookiebotDialogBodyButton{border:none !important;}