:root {
  --gold: #ca9718;
  --hgelb: #f4cd5a;
  --hhell: #f4efd6;
  --htext: #282828;
  --hellgrau: #f3f3f3;
}

body {
  color: var(--htext);
  font-family: 'Inter', sans-serif;
}

h1, h2, h3, h4, h5 {
  color: var(--gold);
}

.bghell {
  background-color: var(--hellgrau);
}

.hellgrau {
  background-color: var(--hellgrau);
}

.bggelb {
  background-color: var(--hgelb);
}

.bggold {
  background-color: var(--gold);
}

.textgelb {
  color: var(--hgelb);
}

.logobild {height: 70px; width: 152px;}
.logobild_default {height: 70px; width: 152px;}

.icon-box {

  width: 100%;
}
.icon-box.large > h3 {
 text-align: center;
  font-size: 18px;
  font-weight: 300;
  text-transform: uppercase;
}

#page-title {height: 500px}

.icon-box.clean .icon i {
  background-color: none;
  color: var(--gold);
  font-size: 50px;
}

.icon-box h3 {
  text-align: center;
   font-size: 18px;
   font-weight: 300;
   text-transform: uppercase;
 }

 .footer-content .icon-box h3 {
  text-align: left;
   font-size: 18px;
   font-weight: 300;
   text-transform: uppercase;
 }

#mainMenu nav > ul > li > a {
  position: relative;
  font-family: 'Inter', sans-serif;
  padding: 10px 12px;
  text-transform: uppercase;
  font-size: 16px;
  font-weight: 300;
  letter-spacing: 0.6px;
  color: var(--htext);
  border-radius: 0;
  border-width: 0;
  border-style: solid;
  border-color: transparent;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
  line-height: normal;
}
.dark #mainMenu nav > ul > li.hover-active > a, .dark #mainMenu nav > ul > li.hover-active > span, .dark #mainMenu nav > ul > li.current > a, .dark #mainMenu nav > ul > li.current > span, .dark #mainMenu nav > ul > li:hover > a, .dark #mainMenu nav > ul > li:hover > span, .dark #mainMenu nav > ul > li:focus > a, .dark #mainMenu nav > ul > li:focus > span, #mainMenu.dark nav > ul > li.hover-active > a, #mainMenu.dark nav > ul > li.hover-active > span, #mainMenu.dark nav > ul > li.current > a, #mainMenu.dark nav > ul > li.current > span, #mainMenu.dark nav > ul > li:hover > a, #mainMenu.dark nav > ul > li:hover > span, #mainMenu.dark nav > ul > li:focus > a, #mainMenu.dark nav > ul > li:focus > span {
  color: var(--gold);
}


.testimonial.testimonial-single .testimonial-item p {
  font-size: 20px;
  line-height: 28px;
  padding: 0 30px;
}


.bg-overlay2 {
  background: rgba(0, 0, 0, 0.79);
  opacity: .8;
}


.heading-text2 h3 {
  font-size: 34px;
  margin-bottom: 30px;
  letter-spacing: -.7px;
  line-height: 40px;

}

.list-icon {padding-top: 10px;}

b, strong {
  font-weight: 300;
}


.inspiro-slider .slide .slide-captions h1 {
  font-size: 40px;
  font-weight: 600;
  line-height: 50px;
  margin-bottom: 30px;
  color: #fff;
  text-transform: uppercase;
}

.inspiro-slider .slide .slide-captions .strong {
  color: #fff;
  font-size: 16px !important;
  font-weight: 300;
  letter-spacing: 0px;
  line-height: 22px;
  text-transform: uppercase;
}

#footer {
  font-size: 16px;
  line-height: 32px;
  font-weight: 400;
  font-family: inherit;
}
.icon-box.small > p {
  margin: 0 0 20px 60px;
  line-height: 1.6;
  font-size: 16px;

}

.unterseiten h1 {
  font-size: 30px;
  line-height: 38px;
  margin-bottom: 0px;
  text-transform: uppercase;
  letter-spacing: 0px;
}

.heading-text.heading-section h2 {
  font-size: 30px;
  line-height: 38px;
  margin-bottom: 0px;
}

.heading-text.heading-section p {
  font-size: 16px;
  font-weight: 300;
}

.heading-text p {
  font-size: 18px;
  margin-bottom: 20px;
 padding-top: 20px;
}

h2, .h2 {
  font-weight: 400;
  text-transform: uppercase;
}

.heading-text h2 {
  letter-spacing: 0px;
}
.lead {
  font-weight: 300;
  line-height: 1.7;
  font-size: 18px;
  color: #000;
}

.list-icon {font-weight: 300; font-size: 18px; color: #000;}
.list-icon li::before {color: #373737;}

.testimonial.testimonial-single .testimonial-item {
  padding: 30px 30px;
}

.copyright-text {font-weight: 300; color: #fff}

h3, .h3 {
  font-size: 22px;
}

button.btn:hover, button.btn:focus, button.btn:not(:disabled):not(.disabled):active, button.btn:not(:disabled):not(.disabled).active, .btn:not(.close):not(.mfp-close):hover, .btn:not(.close):not(.mfp-close):focus, .btn:not(.close):not(.mfp-close):not(:disabled):not(.disabled):active, .btn:not(.close):not(.mfp-close):not(:disabled):not(.disabled).active, a.btn:not([href]):not([tabindex]):hover, a.btn:not([href]):not([tabindex]):focus, a.btn:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, a.btn:not([href]):not([tabindex]):not(:disabled):not(.disabled).active {
  background-color: var(--hgelb);
  border-color: var(--hgelb);
  color: var(--htext);
  text-decoration: none;
}

button.btn, .btn:not(.close):not(.mfp-close), a.btn:not([href]):not([tabindex]) {
  background-color: var(--gold);
  border-color: var(--gold);
}

button.btn.btn-md, .btn:not(.close):not(.mfp-close).btn-md, a.btn:not([href]):not([tabindex]).btn-md { font-size: 13px; font-weight: 300;   height: 36px; line-height: 32px; padding: 0 14px; }

address {font-weight: 300; font-size: 18px; line-height: 1.7}

address a {color: var(--gold);}
address a:hover {color: var(--htext) !important;}
.padding-rechts {padding-right: 60px;}


.bg-overlay-dark {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  content: ' ';
  z-index: 0;
  background: rgba(0, 0, 0, 0.7);
  opacity: .8;
}


.table {
  width: 100%;
  margin-bottom: 1rem;
  color: var(--htext);
  vertical-align: middle;
  border-color: var(--hhell);
}

small, .small {
  font-size: 16px;
}

.table-hover > tbody > tr:hover {
  --bs-table-accent-bg: var(--hhell);
  color: var(--htext);
}

.footer_pad {padding-top: 40px;}
.footer_pad2 {padding-top: 50px;}

.zitat {
  font-style: italic;
  font-size: 18px;
  line-height: 32px;
  padding: 30px 10px;
  color: var(--gold);
}

.uns .text-box{
  background: var(--hellgrau);
}

.uns .text-box:hover {
  background: #fff;
}

.uns-para h2 {
  text-transform: none;
}

.text-box:hover {
  background: var(--hhell);
}

.text-box.hover-effect i {
  color: var(--gold) !important;
}


.accordion .ac-item {
  margin-bottom: 10px;
  padding: 4px 0px;
  border-radius: 5px;
  border: 0px solid #e4e6ef;
}


.accordion .ac-item .ac-title::before {
  font-size: 18px;
  content: "\e9be";
  font-family: "inspiro-icons";
  right: 0;
  position: absolute;

}


.leistungen_subline {
  padding-top: 20px;
  font-size: 20px;
  line-height: 28px;
  color: var(--gold)
}

.leistungen_strong {font-weight: 600;}

.ac-item h3:hover {color: var(--htext)}

.hinweis-sm {font-size: 13px;  }

@media (max-width: 991.98px) {
.heading-text.heading-section h2 {
  font-size: 24px;
  line-height: 32px;
}
.inspiro-slider .slide .slide-captions h1, .inspiro-slider .slide .slide-captions h2 {
  font-size: 28px;
  line-height: 32px;
  margin-bottom: 14px;
}
section {
  padding: 40px 0;

  position: relative;
  width: 100%;
  overflow: hidden;
  z-index: 1;
  background-color: #fff;
}
h3, .h3 {
  font-size: 20px;
  line-height: 24px;
}
}

.mobile {display: none;}
.desktop {display: inline;}

@media (max-width: 991.98px) {
  .mobile {display: inline;}
  .desktop {display: none;}

  .unterseiten h1 {
    font-size: 24px;
    line-height: 32px;
  margin-bottom: 0px;
  text-transform: uppercase;
  letter-spacing: 0px;
  }

  .text-box.hover-effect i { margin: 10px 0 20px; }

  .text-box.hover-effect p { opacity: 1; }

  .text-box.hover-effect:hover i { margin: 10px 0 20px; }

  .text-box.hover-effect:hover p { opacity: 1; }

  .testimonial.testimonial-single .testimonial-item {
    padding: 10px 30px;
  }
  .testimonial.testimonial-single .testimonial-item p {
    font-size: 14px;
    line-height: 18px;
    padding: 0 30px;
  }

  .footer_pad, .footer_pad2 {padding-top: 5px;}
}

.text-content a {color: var(--gold)}
.text-content a:hover {color: var(--htext)}

.text-content p {padding-bottom: 20px;}
.text-content h2 {font-size: 24px;}


.gallerie img {
  aspect-ratio: 570 / 433;
  width: 100%;
  height: auto;
}

.post-image img {
  aspect-ratio: 550 / 366;
  width: 100%;
  height: auto;
}

.footer-siegel img {
  aspect-ratio: 300 / 302;
  width: 100%;
  height: auto;
}

.icon-box  img {
  aspect-ratio: 400 / 240;
  width: 100%;
  height: auto;
}

.teambild img {
  aspect-ratio: 600 / 783;
  width: 100%;
  height: auto;
}

.shbild img {
  aspect-ratio: 580 / 387;
  width: 100%; 
  height: auto;
}

.shop img {
  aspect-ratio: 550 / 361;
  width: 100%; 
  height: auto;
}

.lieferanten_logo {padding: 0 15%}
.lieferanten_logo img {width: 90%;}
hr {color: #b7b7b7;}

.service_widget {padding: 0 15px;}
.service_widget h3 {color: #fff;}
.service_widget p {color: #fff;}