/* ----- CSS Reset ----- */

/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}

body, html {
    margin: 0;
    padding: 0;
    width: 100%;
}
/* Prevent font size inflation */
html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

/* Google Font Chrome Bug fix */
body {
    -webkit-animation-delay: 0.1s;
    -webkit-animation-name: fontfix;
    -webkit-animation-duration: 0.1s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
}

@-webkit-keyframes fontfix {
    from { opacity: 1; }
    to   { opacity: 1; }
}
/* Remove default margin in favour of better control in authored CSS */
body, h1, h2, h3, h4, p,
figure, blockquote, dl, dd {
  margin-block-end: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role='list'],
ol[role='list'] {
  list-style: none;
}

/* Set core body defaults */
body {
  min-height: 100vh;
  line-height: 1.3;
}

/* Set shorter line heights on headings and interactive elements */
h1, h2, h3, h4,
button, input, label {
  line-height: 1.1;
}

/* Balance text wrapping on headings */
h1, h2,
h3, h4 {
  text-wrap: balance;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
  text-decoration-skip-ink: auto;
  color: currentColor;
}

/* Inherit fonts for inputs and buttons */
input, button,
textarea, select {
  font-family: inherit;
  font-size: inherit;
}

/* Make sure textareas without a rows attribute are not tiny */
textarea:not([rows]) {
  min-height: 10em;
}

/* Anything that has been anchored to should have extra scroll margin */
:target {
  scroll-margin-block: 5ex;
}

/* remove annoying highlight on tap */
*{
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}


/* ----- */

/* ----- root variables ----- */

:root {
  /* main colors */
  --color-main-light: #F9F9F9;
  --color-main-area: #F1F1F1;
  --color-main-dark: #262325;
  --color-main-action: #FFD814;
  --color-main-alert: #D20000;
  --color-main-border: #D9D9D9;
  --color-main-overlay: rgba(0,0,0,0.4);
  --color-main-medium: #A4A4A4;

  /* home colors */
  --color-home-area: #E4EDF1;
  --color-home-area-txt: #637A85;
  --color-home-accent: #009DE1;

  /* water colors */
  --color-water-area: #E4EDF1;
  --color-water-area-txt: #637A85;
  --color-water-accent: #009DE1;
  --color-water-overlay: rgba(0,157,224,0.5);

  /* soil colors */
  --color-soil-area: #EBF2F0;
  --color-soil-area-txt: #73978C;
  --color-soil-accent: #357C6F;
  --color-soil-overlay: rgba(77,128,134,0.5);

  /* mould colors */
  --color-mould-area: #F5F5F6;
  --color-mould-area-txt: #7D7D87;
  --color-mould-accent: #979EA3;
  --color-mould-overlay: rgba(164,164,164,0.5);

  /* asbestos colors */
  --color-asbestos-area: #FDEFED;
  --color-asbestos-area-txt: #73534F;
  --color-asbestos-accent: #EE6F4F;
  --color-asbestos-overlay: rgba(237,110,77,0.5);

  /* styles */
  --gap-default: 20px;

	--error: #ff0000;

}

/* ----- */

/* ----- fonts ----- */

/* implement fonts locally at a later point */

@font-face {
  src: url('fonts/Outfit-Light.ttf');
  font-family:'Outfit';
  font-style: normal;
  font-weight: 300;
}
@font-face {
  src: url('fonts/Outfit-Regular.ttf');
  font-family:'Outfit';
  font-style: normal;
  font-weight: 400;
}
@font-face {
  src: url('fonts/Outfit-SemiBold.ttf');
  font-family:'Outfit';
  font-style: normal;
  font-weight: 600;
}
@font-face {
  src: url('fonts/Outfit-Bold.ttf');
  font-family:'Outfit';
  font-style: normal;
  font-weight: 700;
}

/* ----- */

/* ----- main styles ----- */



body{
  font-size: 16px;
  font-weight: 300;
  font-family: 'Outfit', sans-serif;
  color: var(--color-main-dark);
  background: var(--color-main-light);
}
.content{
  padding: 0 10px;
	margin: 0 !important;
}
h1{
  font-size: 26px;
  font-weight: 700;
  margin-bottom: 15px;
}
h2{
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 10px;
}
.subline{
  font-size: 18px;
  font-weight: 400;
  margin-bottom: 10px;
  display: inline-block;
}
.small-txt{
  font-size: 10px;
  font-weight: 400;
}
a{
  cursor: pointer;
}
.container-padding{
  padding: 0 10px;
}
.break {
  flex-basis: 100%;
  height: 0;
}
section{
  margin-bottom: 50px;
}
section:has(.container) h2{
  background: var(--color-main-border);
  border-radius: 10px 10px 0 0;
  margin: 0;
  padding: 15px;
  text-align: center;
}
.category section:has(.container) h2{
  color: var(--color-main-light);
  font-weight: 400;
}
.water section:has(.container) h2{
  background: var(--color-water-accent);
}
.mould section:has(.container) h2{
  background: var(--color-mould-accent);
}
.soil section:has(.container) h2{
  background: var(--color-soil-accent);
}
.asbestos section:has(.container) h2{
  background: var(--color-asbestos-accent);
}
section.process h2{
  background: var(--color-water-accent);
  color: var(--color-main-light);
  font-weight: 600;
}

section .container{
  background: #EFEFEF;
  border-radius:  0 0 10px 10px;
  padding: 20px;
}
section p{
  margin-bottom: 15px;
	text-align: justify;
    hyphens: auto;
}
.read-more-container,
.read-less-container{
    display: flex;
  border-radius: 10px;
  text-decoration: underline;
  color: #262325;
}
.read-more-link,
.read-less-link{
    font-size: 16px;
  font-weight: 400;
  text-decoration: none;
  color: #262325;
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: flex-end;
  align-items: center;
}
.textmarker{
  position: relative;
  z-index: 0;
}
.textmarker::after{
  position: absolute;
  width: calc(100% + 8px);
  height: 100%;
  background: var(--color-main-action);
  content: '';
  display: none; /* Standardmäßig ausblenden */
  left: -4px;
  top: 0;
  z-index: -1;
}
.textmarker:not(:empty)::after {
  display: block; /* Anzeigen, wenn nicht leer */
}
.productOldPrice, .vorher{
	color: var(--color-main-dark);
}
div#intelliSearchResult {
    width: 210px;
    background-color: #ffffff;
    margin: 20px 0 0 0;
    z-index: -1;
    padding: 20px;
    border: 1px solid var(--color-main-border);
    border-radius: 10px;
}
div#intelliSearchResult a {
    padding: 5px 0;
    font-size: 14px;
    color: var(--color-main-dark);
	display: block;
    cursor: pointer;
    text-decoration: none;
}
div#intelliSearchResult strong {
    background: var(--color-main-action);
}


/* ----- */

/* ----- buttons ----- */

.btn{
  padding: 10px 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 400;
  width: fit-content;
  text-decoration: none;
font-size: 16px;
cursor: pointer;
}
.btn-prio1{
  background: var(--color-main-action);
  color: var(--color-main-dark);
  border-radius: 20px;
  font-weight: 700;
  box-shadow: 0 2px 5px rgba(200,200,200,0.5)
}
.btn-prio1:hover{
  box-shadow: inset 0px 2px 5px rgba(200, 200, 200, 0.5);
  transition: all ease 0.3s;
}
.btn-prio2{
  color: var(--color-main-light);
  border-radius: 10px;
  padding: 10px 20px;
}
.home .btn-prio2{
  background: var(--color-home-accent);
}
.water .btn-prio2{
  background: var(--color-water-accent);
}
.soil .btn-prio2{
  background: var(--color-soil-accent);
}
.mould .btn-prio2{
  background: var(--color-mould-accent);
}
.asbestos .btn-prio2{
  background: var(--color-asbestos-accent);
}
.bb-color2 {
    background: #2e5f7b;
    background: none;
    box-shadow: none;
}
/* ----- */

/* ----- caousel ----- */

.carousel-container{
  width: 100%;
  overflow: hidden;
  position: relative;
}
.carousel{
  display: flex;
  width: 100%;
  height: 100%;
  transition: transform 0.5s ease-out;
}
.carousel-item {
    min-width: 100%;
    height: 100%;
    flex-shrink: 0;
}

/* ----- */

/* ----- top header carousel ----- */

.top-header-carousel {
    height: 30px;
}

.top-header-content {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    color: var(--color-main-dark);
    background: #DBDBDB;
	font-size: 14px;
}
.top-header-content img{
  height: calc(100% - 5px);
	width: auto;
}
@media (min-width: 769px){
	.top-header-carousel.carousel-container::after {
    display: block;
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: linear-gradient(90deg, #d9d9d9 0%, transparent 20%, transparent 80%, #d9d9d9 100%);
	}
	.top-header-content {
	font-size: 18px;
	}
}



/* ----- */


/* ----- nav ----- */

body:has(#nav-burger.open){
  position: fixed;
}
.nav{
  padding: 20px 10px;
}
.nav-top{
  display: flex;
  justify-content: flex-end;
  align-items: center;
  position: relative;
  gap: 20px;
	z-index: 9999;
}

.nav-bottom{
  position: fixed;
  right: -100%;
  width: 100%;
  height: 100%;
  top: 200px;
  transition: 0.3s ease;
  padding: 10px;
  opacity: 0;
  margin: 0 0 0 -10px;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
}
.logo-container{
  position: absolute;
  left: 0;
  top: calc(50% - 20px);
}
.search-container{
  position: fixed;
  right: -100%;
  transition: 0.3s ease;
  top: 100px;
  z-index: 1;
  display: flex;
  width: 100%;
  opacity: 0;
  padding: 20px 10px;
}
.search-container input{
  width: 100%;
  border-radius: 20px;
  border: 1px solid var(--color-main-dark);
  height: 40px;
  font-size: 14px;
  padding: 0 30px 0 20px;
}
.search-img-container{
  background: var(--color-main-dark);
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: -5px 0 0 -30px;
}
.search-img-container img{
  width: 50%;
  height: auto;
}
.nav:has(#nav-burger.open) .nav-bottom,
.nav:has(#nav-burger.open) .search-container{
  right: 0;
  background: var(--color-main-light);
  opacity: 1;
  z-index: 999;
}

#menu,
#menu ul {
  list-style-type: none;
  margin: 0;
}
#menu{
  overflow-y: auto;
  height: calc(100dvh - 180px);
}
#menu ul {
  padding: 0;
}
#menu li ul {
  display: none;
}
#menu li[aria-expanded="true"] > ul {
  display: block;
  width: calc(100% + 50px);
  margin-left: -10px;
  padding: 10px;
  background: var(--color-main-area);
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-color: #C4C4C4;
}
#menu li[aria-expanded="true"] > ul > li[aria-expanded="true"] > ul{
  background: #D4D4D4;
}
#menu li{
  position: relative;
  font-size: 20px;
  font-weight: 700;
}
#menu li ul li{
  position: relative;
  font-size: 16px;
  font-weight: 400;
}
#menu li a{
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  padding: 15px 0;
  text-align: right;
}
#menu li:has(ul){
  padding-right: 30px;
}
#menu li:has(ul)::after{
  content: '';
  width: 16px;
  height: 16px;
  display: block;
  position: absolute;
  right: 0;
  top: 18px;
  background-image: url('img/2024/menu-arrow.png');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  transform: rotate(180deg);
  transition: all ease 0.3s;
}
#menu li[aria-expanded="true"]:has(ul)::after {
  transform: rotate(0deg);
}
.nav-account img,
.nav-cart img{
  height: 30px;
  width: auto;
}
.nav-icon{
  height: 20px;
  width: auto;
}


/* Burger-Button */


#nav-burger {
  display: block;
  width: 40px;
  height: 24px;
  position: relative;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

#nav-burger span{
  display: block;
  position: absolute;
  height: 4px;
  width: 100%;
  background: var(--color-main-dark);
  border-radius: 10px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

#nav-burger span:nth-child(1) {
  top: 0px;
}

#nav-burger span:nth-child(2) {
  top: 9px;
}

#nav-burger span:nth-child(3) {
  top: 18px;
}

#nav-burger.open span:nth-child(1) {
  top: 10px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}

#nav-burger.open span:nth-child(2) {
  opacity: 0;
  left: -60px;
}

#nav-burger.open span:nth-child(3) {
  top: 10px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
}
.logo{
  max-width: 120px;
  height: auto;
}
#navtrail{
height: auto;
line-height: 1;
color: #262325;
font-size: 12px;
}
#navtrail a {
    color: #262325;
}
.nav-cart{
position: relative;
}

.nav-cart span{
position: absolute;
top: -10px;
right: -8px;
color: var(--color-main-dark);
font-weight: 600;
background: var(--color-main-action);
width: 24px;
height: 24px;
border-radius: 12px;
display: flex;
justify-content: center;
align-items: center;
}

/* ----- */

/* ---- Hero Section */
.hero{
  width: calc(100% + 20px);
  margin-left: -10px;
}
.hero img{
  width: 100%;
height: auto;
}
.hero-txt{
  position: relative;
  padding-top: 80px;
}
.hero .divider-container{
  width: 100%;
  padding: 0px 10px;
  position: absolute;
  top: -10px;
}
.hero .divider{
  color: var(--color-main-light);
  display: flex;
  /*justify-content: center;*/
  /*align-items: center;*/
  height: 60px;
	border: none;
}
.hero .divider-perk{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}
.hero .divider-perk img{
  height: 30px;
  width: auto;
}
.home .hero .divider,
.home .hero .divider-perk,
.home .hero .divider-container{
  background: var(--color-home-accent);
}

.water .hero .divider,
.water .hero .divider-perk,
.water .hero .divider-container{
  background: var(--color-water-accent);
}
.soil .hero .divider,
.soil .hero .divider-perk,
.soil .hero .divider-container{
  background: var(--color-soil-accent);
}
.mould .hero .divider,
.mould .hero .divider-perk,
.mould .hero .divider-container{
  background: var(--color-mould-accent);
}
.asbestos .hero .divider,
.asbestos .hero .divider-perk,
.asbestos .hero .divider-container{
  background: var(--color-asbestos-accent);
}
.hero .divider img{
  width: auto;
}



/* ----- */


/* ----- Recommend ----- */

section.rcmnd h2{

}
.rcmnd-btn{
  width: 100%;
	margin-bottom: 60px;
}
.rcmnd-text{
  flex-shrink: 1;
}
.rcmnd .bigBox{
  flex-shrink: 0;
  max-width: 100%;
}


/* ----- */



/* ----- lilBox ----- */

.rcmnd-lilBoxes .bigBox{
  position: relative;
}



.rcmnd-lilBoxes .bigBox-item-container{
  width: calc(100% + 10px);
  overflow-x: scroll;
  display: flex;
  gap: 20px;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* Internet Explorer 10+ */
}
.rcmnd-lilBoxes .bigBox-item-container::-webkit-scrollbar { /* WebKit */
    width: 0;
    height: 0;
}

.rcmnd-lilBoxes .bigBox-item{
  min-width: 60vw;
  max-width: 60vw;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: stretch;
  scroll-snap-align: start
}

.rcmnd-lilBoxes .bigBox-item a{
  text-decoration: none;
}
.rcmnd-lilBoxes .bigBox-item-container .bigBox-item:nth-last-child(1){
  margin-right: 50%;
}
.rcmnd-lilBoxes .bigBox-item-img{
  width: 100%;
}
.rcmnd-lilBoxes .bigBox-item-img img{
  max-width: 100%;
}
.lilBox-head{
  font-size: 14px;
  font-weight: bold;
  display: flex;
  align-items: center;
  gap: 15px;
}
.lilBox-head span{
  flex-shrink: 0;
}
.lilBox-head .line{
  width: 100%;
  height: 1px;
  background: var(--color-main-border);
  flex-grow: 1;
}
.rcmnd-lilBoxes .bigBox-item-name{
  padding: 10px 0 0;
  line-height: 1.2;
  min-height: 55px;
  font-weight: 700;
}
.rcmnd-lilBoxes .bigBox-item-sub{
  font-size: 14px;
}
.home rcmnd-lilBoxes .bigBox-item-sub{
  color: var(--color-home-accent);
}
.water rcmnd-lilBoxes .bigBox-item-sub{
  color: var(--color-water-accent);
}
.asbestos rcmnd-lilBoxes .bigBox-item-sub{
  color: var(--color-asbestos-accent);
}
.mould rcmnd-lilBoxes .bigBox-item-sub{
  color: var(--color-mould-accent);
}
.soil rcmnd-lilBoxes .bigBox-item-sub{
  color: var(--color-soil-accent);
}
.stars2024,
.pco_stars-container{
  display: flex;
  align-items: center;
}
.stars2024{
  justify-content: flex-start;
}
.pco_stars-container{
  justify-content: center;
}
.pco_star-full,
.pco_star-half {
  width: 20px;
  height: 20px;
  background: #F4B23D;
}
.pco_star-full {
  clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
}

.pco_star-half {
  clip-path: polygon(50% 0%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
}
.rcmnd-lilBoxes .bigBox .pco_star-full,
.rcmnd-lilBoxes .bigBox .pco_star-half {
  width: 15px;
  height: 15px;
}
.rcmnd-lilBoxes .bigBox .pco5{
margin-top: 0;
}
.rcmnd-lilBoxes .bigBox .pco5_1{
  font-size: 14px;
    background: none;
    padding: 0;
    text-align: left;
    width: auto;
    height: auto;
}
.rcmnd-lilBoxes .bigBox .btn{
  text-decoration: none;
  margin: 10px 0;
}
.rcmnd-lilBoxes .bigBox .taxship1{
  min-height: 55px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.rcmnd-lilBoxes .bigBox .gradPrice{
  font-weight: 700;
  font-size: 26px;
color: var(--color-main-dark);
}
.bigBox .gradPrice{
  font-weight: 700;
  font-size: 26px;
color: var(--color-main-dark);
}
.rcmnd-lilBoxes .bigBox .productOldPrice{
  font-size: 16px;
  text-align: left;
  margin: 0;
}

.rcmnd-lilBoxes .bigBox .productOldPrice del{
  font-size: 16px;
  text-align: left;
  margin: 0;
}
.rcmnd-lilBoxes .bigBox .productOldPrice + .gradPrice{
  color: var(--color-main-alert);
}
.bigBox .productOldPrice + .gradPrice{
  color: var(--color-main-alert);
}

.vergleich .taxandshippinginfoN{
	display: none;
}
.vergleich .bigBox-item-name{
	padding: 0;
}
.vergleich .bigBox-item{
	padding-bottom: 0;
	border: none;
}
.vergleich .bigBox-item img{
	border-radius: 10px;
}
.vergleich .bigBox-content{
	display: none;
}
.vergleich .bigBox-btns a:first-child{
	display: none;
}
.vergleich .bigBox-bottom{
	flex-direction: column-reverse;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 10px;
	position: relative;
	padding: 0;
}
.vergleich .bigBox-item-sub-container{
	flex-direction: column-reverse;
    justify-content: flex-start;
    align-items: flex-start;
	gap: 5px;
	border: none;
	margin: 0px;
}
.vergleich .pco4L,
.vergleich .pco4L27{
	margin: 0;
}
.vergleich .bigBox-btns{
	width: 100%;
}
.vergleich .bigBox-btns a{
	width: 100%;
    border-radius: 20px;
    font-weight: 700;
}
.vergleich .bigBox .gradPrice{
	font-size: 26px;
	font-weight: 700;
}

/* Arrows */
.rcmnd-lilBoxes .bigBox-navigation{
  display: flex;
  align-items: baseline;
  justify-content: center;
}
.rcmnd-lilBoxes .bigBox-prev,
.rcmnd-lilBoxes .bigBox-next {
  background: none;
  color: var(--color-main-border);
  border: none;
  padding: 10px;
  cursor: pointer;
  z-index: 10;
  display: none;
}

.rcmnd-lilBoxes .bigBox-prev {
  left: 10px;
}

.rcmnd-lilBoxes .bigBox-next {
  right: 10px;
}

.lilBox.show-controls .lilBox-prev,
.lilBox.show-controls .lilBox-next {
  display: block;
}

/* Dots */
.rcmnd-lilBoxes .bigBox-dots {
  display: flex;
  justify-content: center;
  margin-top: 10px;
}

.rcmnd-lilBoxes .bigBox-dots .dot {
  width: 10px;
  height: 10px;
  margin: 0 5px;
  border-radius: 50%;
  background-color: #ccc;
  cursor: pointer;
}

.rcmnd-lilBoxes .bigBox-dots .dot.active {
  background-color: #333;
}


/* ----- */



/* ----- bigBox ----- */

.bigBox{
  overflow: hidden;
  position: relative;
  max-width: 100%;
}

.bigBox-item-container{
  width: 100%;
  overflow-x: scroll;
  display: flex;
  gap: 20px;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.sr_suche .bigBox-item-container{
    overflow-x: auto;
    flex-wrap: wrap;
}
.sr_suche .bigBox-navigation{
	display: none;
}


.bigBox-item a{
  text-decoration: none;
}



.bigBox-item{
  min-width: calc(100vw - 40px);
  max-width: calc(100vw - 40px);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  border: 1px solid var(--color-main-border);
  border-radius: 10px;
  overflow: hidden;
  scroll-snap-align: start;
position: relative;
padding-bottom: 100px;
flex: 1 1 0px;
}
.bigBox-item-img{
  width: 100%;
  margin-bottom: 10px;
}
.bigBox-item-img img{
  width: 100%;
	height: auto;
}
.bigBox-item-sub-container{
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--color-main-border);
  margin: 0 20px;
  padding: 5px 0;
}
.bigBox .pco_star-full,
.bigBox .pco_star-half {
  width: 17px;
  height: 17px;
}
.bigBox .pco5_1{
  font-size: 14px;
  background: none;
    padding: 0;
    text-align: left;
    width: auto;
    height: auto;
}
.bigBox-item-name{
  padding: 10px 0;
  font-size: 24px;
  font-weight: 700;
  padding: 0 20px;
    min-height: 50px;
}
.bigBox-item-sub{
  font-weight: 500;
  font-size: 14px;
}
.bigBox-content{
  font-size: 14px;
  line-height: 1.3;
  margin-bottom: 20px;
  padding: 10px 20px;
}
.bigBox ul{
  padding-left: 20px;
  list-style-type: none;
}
.bigBox li{
  margin-bottom: 10px;
position: relative;
}
.bigBox li::after{
    position: absolute;
    display: block;
    content: '';
    width: 8px;
    height: 13px;
    left: -20px;
    top: 2px;
    border-bottom: 2px solid;
    border-right: 2px solid;
    border-color: var(--color-water-accent);
    transform: rotate(71deg) skew(36deg, 0deg) translateZ(0);
    outline: 1px solid transparent;
    -webkit-backface-visibility: hidden;
    will-change: transform;
    -webkit-perspective: 1000;
}
.bigBox .taxandshippinginfoN,
.bigBox .zzgl{
  font-size: 12px;
}

.rcmnd-lilBoxes .bigBox-content{
	display: none;
}


.home .bigBox-item-sub{
  color: var(--color-home-accent);
}
.water .bigBox-item-sub{
  color: var(--color-water-accent);
}
.asbestos .bigBox-item-sub{
  color: var(--color-asbestos-accent);
}
.mould .bigBox-item-sub{
  color: var(--color-mould-accent);
}
.soil .bigBox-item-sub{
  color: var(--color-soil-accent);
}
.bigBox-bottom{
  display: flex;
  justify-content: space-between;
  align-items: self-end;
  padding: 0 20px 20px;
	position: absolute;
    bottom: 0;
	width: 100%;
}
.bigBox-btns{
  width: auto;
  flex-grow: 0;
  display: flex;
  gap: 15px;
}
.bigBox-btns a{
  border-radius: 5px;
  text-decoration: none;
  font-weight: 500;
  padding: 10px 15px;
}
.bigBox .add-to-cart img{
  width: 25px;
  height: auto;
}
.bigBox .productOldPrice{
  text-align: left;
  margin: 0;
}
.bigBox .productOldPrice del{
  font-size: 16px;
  font-weight: 400;
}
.bigBox .gradPrice{
  font-size: 24px;
  font-weight: 500;
}
.bigBox-bottom:has(.productOldPrice>del) .gradPrice{
  color: var(--color-main-alert);
}
.stars2024,
.pco_stars-container{
  display: flex;
  align-items: center;
}
.stars2024{
  justify-content: flex-start;
	font-size: 14px;
margin: 0 !important;
	height: 20px;
}
.pco_stars-container{
  justify-content: center;
}
.pco_star-full,
.pco_star-half {
  width: 20px;
  height: 20px;
  background: #F4B23D;
}
.pco_star-full {
    clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
}

.pco_star-half {
    clip-path: polygon(50% 0%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
}
/* Arrows */
.bigBox-navigation{
  display: flex;
  align-items: baseline;
  justify-content: center;
}
.bigBox-prev,
.bigBox-next {
  background: none;
  color: var(--color-main-border);
  border: none;
  padding: 10px;
  cursor: pointer;
  z-index: 10;
}


.bigBox.show-controls .bigBox-prev,
.bigBox.show-controls .bigBox-next {
  display: block;
}

/* Dots */
.bigBox-dots {
  display: flex;
  justify-content: center;
  margin-top: 10px;
}

.bigBox-dots .dot {
  width: 10px;
  height: 10px;
  margin: 0 5px;
  border-radius: 50%;
  background-color: #ccc;
  cursor: pointer;
}

.bigBox-dots .dot.active {
  background-color: #333;
}

.bigBox .liste_ff57{
	margin: 0;
	font-size: 14px;
	padding: 20px;
	border-top: 1px solid var(--color-main-border);
	height: auto !important;
}
.bigBox .liste_ff57a{
	display: none;
}
.bigBox .liste_ff57b{
	display: none;
}
.category.asbestos .bigBox-content{
	margin-bottom: 0;
}
@media (max-width: 768px){
	.category.asbestos .bigBox-item-container{
		align-items: flex-start;
	}
}

/* ----- */

/* ----- lilBox Fix for bigBox HTML in rcmnd Section ----- */

.rcmnd-lilBoxes .bigBox-item{
	border: none;
}

.rcmnd-lilBoxes .bigBox-item-img img{
	border-radius: 10px;
}
.rcmnd-lilBoxes .bigBox-item-name{
	padding: 0;
}
.rcmnd-lilBoxes .bigBox-item-sub-container{
	flex-direction: column;
    align-items: flex-start;
    margin: 0 0 5px 0;
    border: none;
    padding: 0;
}
.rcmnd-lilBoxes .bigBox-bottom{
	flex-direction: column-reverse;
    position: relative;
    align-items: flex-start;
    gap: 10px;
    padding: 0;
}
.rcmnd-lilBoxes .taxship1{
	width: auto;
    margin: 0;
}
.rcmnd-lilBoxes .gradPrice{
	font-weight: 700;
}
.rcmnd-lilBoxes .taxandshippinginfoN{
	display: none;
}
.rcmnd-lilBoxes .add-to-cart{
	display: none;
}
.rcmnd-lilBoxes .bigBox-btns a{
	border-radius: 20px;
    font-weight: 700;
    padding: 10px 40px;
}
.rcmnd-lilBoxes .pco5{
	padding: 0 !important;
}
.rcmnd .liste_ff57{
	display: none;
}
@media (min-width: 768px){
	.rcmnd-lilBoxes .pco5{
		min-height:18px;
	}
}



/* ----- */


/* ----- BigBox Fix in Crosselling Section ----- */

@media (max-width: 767px){
	.tpl_cross_selling{
		border: none;
    	margin: 0;
	}
	.pbu_head_wrapper{
		background: none;
    	padding: 0;
	}
	.pbu_head{
		color: var(--color-main-dark);
    	font-size: 22px;
	}
	.teaser-txt h3{
		margin-bottom: 10px;
	}
	.teaser-txt ul{
		list-style: disc;
			margin: 20px;
	}
	.teaser-txt li{
		margin-bottom: 5px;
	}
}


/* ----- */




/* ----- intro ----- */

.intro h2{
	font-size: 26px;
	font-weight: 600;
}
.intro-img-container{
  background-image: url('img/2024/intro-img.jpg');
  background-size: cover;
  border-radius: 10px;
  overflow: hidden;
  text-align: center;
}
.intro-img-container-inner{
  padding: 80px 40px;
  width: 100%;
  height: 100%;
	hyphens: none;
}
.intro-img-container-outer{
  display: flex;
  gap: 50px;
  flex-direction: column;
  margin: 25px 0;
}
.intro-img-container-inner{
  background: var(--color-main-overlay);
  color: var(--color-main-light);
}
.intro-img-container-head,
.intro-img-container-sub{
  font-weight: 600;
  display: block;
  line-height: 1.2;
  margin-bottom: 20px;
}
.intro-img-container-head{
  font-size: 30px;
}
.intro-img-container-sub{
  font-size: 22px;
}
@media (min-width: 769px){
	.intro-img-container-head{
	  font-size: 42px;
	}
	.intro-img-container-sub{
	  font-size: 30px;
	}
}

.intro-hinweis-inner{
  display: flex;
  flex-direction: column;
  gap: 50px;
}
.intro-hinweis-box{
  background: #fff;
  border: 1px solid;
  border-radius: 10px;
  padding: 20px;
}
.water .intro-hinweis-box{
  border-color: var(--color-water-accent);
}
.soil .intro-hinweis-box{
  border-color: var(--color-soil-accent);
}
.asbestos .intro-hinweis-box{
  border-color: var(--color-asbestos-accent);
}
.mould .intro-hinweis-box{
  border-color: var(--color-mould-accent);
}

/* ----- */



/* ----- info ----- */

.info{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: #fff;
  padding: 20px 40px;
  text-align: center;
  border-radius: 10px;
  box-shadow: 0 2px 5px #c6c6c685;
  gap: 15px;
}
.info h2{
  font-weight: 400;
  font-size: 30px;
  margin: 0;
}
.info p{
  margin: 0;
}

/* ----- */


/* ----- process ----- */

.process-detail{
  background: var(--color-main-light);
  border-radius: 10px;
  padding: 15px 15px;
  width: calc(100% + 20px);
  margin-left: -10px;
  margin-bottom: 60px;
}
.process-detail-steps{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 30px;
  margin: 50px 0;
}

.process-detail-step{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  gap: 50px;
}

.process-detail-step > div{
  width: 50%;
}
.process-video h3{
  text-align: center;
  margin-bottom: 20px;
}
.process-video video{
  width: 100%;
  height: auto;
  border-radius: 10px;
}
.process-icon{
  display: flex;
  justify-content: flex-end;
}
.process-icon img{
  height: 70px;
  width: auto;
}
.process-detail h3{
  color: var(--color-main-medium);
  font-size: 18px;
}
.process-detail h3 span{
  color: var(--color-main-dark);
  display: block;
  margin: 20px 0;
  font-size: 24px;
}
.process-icon-txt{
  display: flex;
  flex-direction: column;
}
.process-icon-txt-1{
  font-weight: 700;
}
.process-detail .read-more,
.accordion-content:has(.process-detail-steps) .read-more{
  color: var(--color-main-dark);
  font-size: 18px;
  font-weight: 700;
  position: relative;
  text-align: right;
  padding-right: 20px;
  display: block;
display: none;
}
.process-detail .read-more::after,
.accordion-content:has(.process-detail-steps) .read-more::after{
  position: absolute;
  display: block;
  content: '';
  width: 10px;
  height: 10px;
  border-bottom: 2px solid var(--color-main-dark);
  border-right: 2px solid var(--color-main-dark);
  transform: rotate(-45deg);
  top: calc(50% - 5px);
  right: 0;
}
/* bis auf Weiteres ausgeblendet */
.process-detail .read-more{
	display: none;
}

/* ----- */

.btnMusterbericht{
	display: none;
}


/* ----- categories ----- */

.categories-slider-container {
    overflow: hidden;
    position: relative;
    max-width: calc(100% + 40px);
    width: calc(100% + 40px);
    margin-left: -20px;
    height: 200px;
}

.categories-slider {
    display: flex;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none;  /* Internet Explorer 10+ */
    gap: 20px;
}

.categories-slider::-webkit-scrollbar { /* WebKit */
    width: 0;
    height: 0;
}

.categories-slider-item {
    min-width: 70%;
    flex: 0 0 70%;
    color: var(--color-main-light);
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    scroll-snap-align: start;
    aspect-ratio: 3/2;
    border-radius: 10px;
    overflow: hidden;
}
.categories-slider-inner,
.categories-slider-inner a{
  width: 100%;
  height: 100%;
}
.categories-slider-inner a{
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  gap: 5px;
	font-weight: 600;
	font-size: 20px;
}
.categories-slider-inner a span{
  background: var(--color-main-light);
  display: inline-block;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.asbestos .categories-slider-inner a span{
  color: var(--color-asbestos-accent);
}
.mould .categories-slider-inner a span{
  color: var(--color-mould-accent);
}
.soil .categories-slider-inner a span{
  color: var(--color-soil-accent);
}
.water .categories-slider-inner a span{
  color: var(--color-water-accent);
}
.categories-slider-inner a:hover{
  gap: 10px;
  transition: all ease 0.3s;
  background: var(--color-main-overlay);
}





.water .categories-slider-inner{
  background: var(--color-water-overlay);
}
.asbestos .categories-slider-inner{
  background: var(--color-asbestos-overlay);
}
.mould .categories-slider-inner{
  background: var(--color-mould-overlay);
}
.soil .categories-slider-inner{
  background: var(--color-soil-overlay);
}

.categories-slider-item.water {
    background: url('img/2024/categories-water.jpg') center/cover;
}

.categories-slider-item.asbestos {
    background: url('img/2024/categories-asbest.jpg') center/cover;
}

.categories-slider-item.mould {
    background: url('img/2024/categories-mould.jpg') center/cover;
}

.categories-slider-item.soil {
    background: url('img/2024/categories-soil.jpg') center/cover;
}


.categories-dots {
    text-align: center;
    padding: 10px;
}

.dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 0 5px;
    background-color: #bbb;
    border-radius: 50%;
    cursor: pointer;
}

.dot.active {
    background-color: #333;
}

/* ----- */

/* Google Reviews */
#reviews-slider-container {
    overflow: hidden;
    position: relative;
    max-width: 100%;
}

#reviews-slider {
    display: flex;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* Internet Explorer 10+ */
}

#reviews-slider::-webkit-scrollbar { /* WebKit */
    width: 0;
    height: 0;
}

.review-item {
    min-width: 100%;
    flex: 0 0 100%;
    padding: 5px;
    scroll-snap-align: start;
    cursor: pointer;
}
.review-container-inner {
    min-width: 100%;
    flex: 0 0 100%;
    padding: 15px;
    background-color: var(--color-main-light);
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 15px;
    position: relative;
}
.review-read{
      display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}
.review-item h3 {
    font-size: 14px;
    font-weight: normal;
    margin: 0;
}
.google-reviews .google-logo{
  width: 20px;
  height: 20px;
  position: absolute;
  top: 10px;
  right: 10px;
}
.review-head img{
      width: 40px;
    height: 40px;
}
.review-item p {
    font-size: 12px;
    line-height: 1.3;
    margin: 0;
}
.review-middle p{
  line-height: 1;
}
.review-head,
.review-middle{
  display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
}
.review-rating {
    color: #f4b23d;
    font-size: 12px;
}
.review-bottom .read-more-btn{
    color: #3878ba;
    margin-left: 5px;
    font-size: 12px;
}
#reviews-dots {
    text-align: center;
    padding: 10px;
}

.dot {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin: 5px;
    background-color: #bbb;
    border-radius: 50%;
    cursor: pointer;
}

.dot.active {
    background-color: var(--color-home-accent);
}
.google-reviews-more{
  font-size: 12px;
  color: var(--color-main-dark);
  text-decoration: none;
  display: flex;
  justify-content: center;
  margin-top: 10px;
}

.review-modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.5);
    justify-content: center;
    align-items: center;
}

.review-modal-content {
    background-color: var(--color-main-light);
    margin: 20px;
    padding: 20px;
    width: calc(100% - 40px);
    max-width: 600px;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
}

.review-modal-close {
    color: var(--color-main-border);
    font-size: 28px;
    font-weight: bold;
    position: absolute;
    top: 5px;
    right: 15px;
    z-index: 1;
}

.review-modal-close:hover,
.review-modal-close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}
.review-modal .review-container-inner{
  box-shadow: none;
}
.review-modal p{
  font-size: 14px;
  margin: 0;
}
.review-modal h3{
  font-size: 16px;
  line-height: 1;
  margin: 0;
}
.review-modal .google-logo{
  top:  auto;
  bottom: -30px;
  right: -30px;
  width: 100px;
  height: 100px;
  opacity: 0.2;
}


/* ----- Slider ----- */


.slider {
    overflow: hidden;
    position: relative;
    max-width: 100%;
    width: 100%;
    height: auto;
}

.slider-container {
    display: flex;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none;  /* Internet Explorer 10+ */
    gap: 20px;
}

.slider::-webkit-scrollbar { /* WebKit */
    width: 0;
    height: 0;
}

.slider-item {
    flex: 0 0 100%;
    color: var(--color-main-light);
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    scroll-snap-align: start;
    overflow: hidden;
}
.slider-navigation{
  width: 100%;
  display: flex;
  align-items: baseline;
  justify-content: center;
}


/* ----- */

/* ----- Partner ----- */

.partner .slider-item img{
  width:  70%;
}


/* ----- */


/* ----- Ueber IVARIO ----- */

.ueber-ivario{
  background: var(--color-home-area);
  color: var(--color-home-area-txt);
  border-radius: 10px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  hyphens: auto;
}
.ueber-ivario-img img{
  width: 100%;
}
.ueber-ivario-txt{
  padding: 20px;
}
.ueber-ivario-txt ul{
  list-style: none;
  padding: 0;
}
.ueber-ivario-txt ul li{
  position: relative;
  padding-left: 40px;
  margin-bottom: 10px;
}
.ueber-ivario-txt ul li::before{
  position: absolute;
  top: 5px;
  left: 0;
  display: block;
  content: '';
  width: 20px;
  height: 10px;
  border-left: 2px solid;
  border-bottom: 2px solid;
  border-color: var(--color-home-area-txt);
  transform: rotate(-45deg);
  transform-origin: center center;
}


/* ----- */

/* ----- teaser ----- */

.teaser .container{
  display: flex;
  flex-direction: column;
}
.teaser-img img{
  max-width: 100%;
	height: auto;
}
.teaser .btn{
  width: 100%;
}
section.teaser:has(.container) h2{
  color: var(--color-main-light);
  font-weight: 400;
}
section.mould:has(.container) h2{
  background: var(--color-mould-accent);
}
section.asbestos:has(.container) h2{
  background: var(--color-asbestos-accent);
}
section.water:has(.container) h2{
  background: var(--color-water-accent);
}
section.soil:has(.container) h2{
  background: var(--color-soil-accent);
}
.teaser-img img{
  border-radius: 10px;
}


/* ----- */

/* ----- TXT-Content ----- */

.txt-content{
  border-radius: 10px;
  overflow: hidden;
}
.txt-content-img img{
  max-width: 100%;
  border-radius: 10px;
min-width: 100%;
height: auto;
}
.txt-content .container{
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.txt-content h3{
  margin: 0;
}

/* ----- */


/* ----- IMG-Trenner ----- */

.img-trenner-container{
  background-image: url('img/2024/intro-img.jpg');
  background-size: cover;
  border-radius: 10px;
  overflow: hidden;
  text-align: center;
}
.img-trenner-container-inner{
  padding: 80px 40px;
  width: 100%;
  height: 100%;
}
.img-trenner-container-outer{
  display: flex;
  gap: 50px;
  flex-direction: column;
  margin: 25px 0;
}
.img-trenner-container-inner{
  background: var(--color-main-overlay);
  color: var(--color-main-light);
}
.img-trenner-container-head,
.img-trenner-container-sub{
  font-weight: 700;
  display: block;
  line-height: 1.2;
  margin-bottom: 20px;
}
.img-trenner-container-head{
  font-size: 26px;
}
.img-trenner-container-sub{
  font-size: 18px;
  font-weight: 400;
}


/* ----- */


/* ----- FAQ ----- */

.faq .iva_art_faq {
    margin: 0 auto;
    border-radius: 4px;
    position: relative;
    margin: 50px 0;
	padding: 15px;
}

.faq .iva_art_faq_head {
    text-align: center;
    border-radius: 10px 10px 0 0;
    font-weight: 700;
    font-size: 24px;
    line-height: 1.2;
    padding: 15px;
    margin: 0
}

.faq .iva_art_faq_h {
    font-weight: 600;
    margin: 0;
    padding: 25px 60px 22px 20px;
	color: var(--color-main-dark);
}

.faq .iva_art_faq_answer {
    max-height: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: max-height .5s,-webkit-max-height .5s
}

.faq .iva_art_faq_answer p,.iva_art_faq_answer b,.iva_art_faq_answer strong,.iva_art_faq_answer a {
    line-height: 1.6
}

.faq .iva_art_faq label {
    display: block;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    padding-top: 1px;
    margin: 0;
    border-bottom: 2px solid #d1d1d1;
}


.faq .iva_art_faq input[type=checkbox] {
    display: none
}

.faq .iva_art_faq .faq-arrow {
    width: 16px;
    height: 16px;
    transition: transform .5s,-webkit-transform .5s;
    border-bottom: 2px solid var(--color-main-dark);
    position: absolute;
    top: 23px;
    right: 27px;
    transform-origin: 50% 100%
}

.faq .iva_art_faq .faq-arrow::after {
    content: '';
    position: absolute;
    top: 8px;
    right: -7px;
    width: 16px;
    height: 16px;
    transition: transform .5s,-webkit-transform .5s;
    transition: opacity .2s,-webkit-opacity .2s;
    opacity: 1;
    transform-origin: 0% 50%;
    border-left: 2px solid var(--color-main-dark);
}

.faq .iva_art_faq input[type=checkbox]:checked+label>.faq-arrow {
    transition: transform .5s,-webkit-transform .5s;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.faq .iva_art_faq input[type=checkbox]:checked+label>.faq-arrow::after {
    transition: transform .5s,-webkit-transform .5s;
    transition: opacity .2s,-webkit-opacity .2s;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0
}

.faq .iva_art_faq input[type=checkbox]:checked+label .iva_art_faq_answer {
    display: block;
    transition: max-height .5s,-webkit-max-height .5s;
    max-height: 100vh
}

.faq .iva_art_faq input[type=checkbox]:not(:checked)+label {
    display: block;
    transition: height .3s
}



.faq .iva_art_faq label:last-of-type {
    border-bottom: none;
    border-radius: 0 0 10px 10px
}

/* ----- */

.partner{
	margin: 20px 0;
}

/* ----- Perks ----- */

.perks{
  display: flex;
  padding: 30px 0;
  justify-content: center;
  align-items: flex-start;
  gap: 20px;
  flex-wrap: wrap;
}
.solution .perks{
  display: none;
}
.perk{
  width: 40%;
  display: flex;
  gap: 20px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.perk-icon img{
  max-width: 100%;
}
.perk-txt{
  text-align: center;
}


/* ----- */

/* ----- product-main ----- */

.product-main{
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .product-main{
    flex-direction: row;
    gap: 50px;
  }
}

.product-gallery,
.product-info{
  width: 100%;
}
@media (min-width: 768px) {
  .product-gallery,
  .product-info{
    width: 50%;
  }
}


.product-gallery{
  display: flex;
  flex-direction: column;
}


@media (min-width: 768px) {
  .product-gallery {
    flex-direction: row-reverse;
    align-items: flex-start;
    position: relative;

  }
}

/* Big Image Slider */
.big-image-slider {
  position: relative;
  overflow: hidden;
  width: 100%;
}

.big-image-container {
  display: flex;
  scroll-snap-type: x mandatory;
  overflow-x: auto;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* Internet Explorer 10+ */
}

@media (min-width: 768px) {
  .big-image-container {
    flex-direction: row;
    height: 500px;
    scroll-snap-type: x mandatory;
    overflow-x: auto;
	overflow-y: hidden;
  }
}

.big-image-item {
  scroll-snap-align: start;
  flex: 0 0 100%;
  text-align: center;
}

.big-image-item img {
  width: 100%;
  object-fit: cover;
}

/* Thumbnail slider */
.thumbnail-slider {
  margin-top: 10px;
  overflow: hidden;
  display: flex;
  justify-content: center;
  width: 100%;
}

.thumbnail-container {
  display: flex;
  scroll-snap-type: x mandatory;
  width: 100%;
  overflow-x: auto;
  scroll-behavior: smooth;

}

@media (min-width: 768px) {
  .thumbnail-slider {
    margin-top: 0;
    width: 150px;
    overflow-y: auto;
    height: 500px;
    scroll-snap-type: y mandatory;
  }

  .thumbnail-container {
    flex-direction: column;
    align-items: center;
  }
}

.thumbnail-item {
  flex: 0 0 auto;
  margin: 5px;
  cursor: pointer;
  scroll-snap-align: start;
}

.thumbnail-item img {
  width: 50px;
  height: 50px;
  object-fit: cover;
  border: 2px solid transparent;
  transition: border-color 0.3s;
}

.thumbnail-item.active img {
  border-color: #007bff; /* Highlight current active thumbnail */
}

.water .product-info .subline{
  color: var(--color-water-accent);
}
.soil .product-info .subline{
  color: var(--color-soil-accent);
}
.asbestos .product-info .subline{
  color: var(--color-asbestos-accent);
}
.mould .product-info .subline{
  color: var(--color-mould-accent);
}
.product-info .taxship1{
  min-height: 55px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.product-info .gradPrice{
  font-weight: 700;
  font-size: 26px;
	color: var(--color-main-dark);
}
.product-info .productOldPrice{
  font-size: 16px;
	font-weight: 300;
    color: var(--color-main-dark);
    margin: 0px;
}
.product-info .productOldPrice + .gradPrice{
  color: var(--color-main-alert);
}
.product-info .zzgl-container{
  display: flex;
  gap: 10px;
  font-size: 12px;
}
.product-info .taxandshippinginfoN,
.product-info .taxandshippinginfoN + a{
	float: left;
    margin: 0;
    font-size: 12px;
    font-weight: 300;
    margin-right: 10px;
    color: var(--color-main-dark);
}
.product-info .delivery{
  font-size: 12px;
}
.product-main-info{
  padding: 20px;
  border-radius: 10px;
  margin:  20px 0;
}
.product-main-info ul{
  margin: 0;
  margin-bottom: 20px;
  list-style: none;
  padding: 0;
}
.product-main-info li{
  margin-bottom: 10px;
  position: relative;
  padding-left: 30px;
}
.product-main-info li::before{
  position: absolute;
  top: 7px;
  left: 0;
  display: block;
  content: '';
  width: 15px;
  height: 7px;
  border-left: 2px solid;
  border-bottom: 2px solid;
  transform: rotate(-45deg);
  transform-origin: center center;
}
.water .product-main-info li::before{
  border-color: var(--color-water-area-txt);
}
.asbestos .product-main-info li::before{
  border-color: var(--color-asbestos-area-txt);
}
.mould .product-main-info li::before{
  border-color: var(--color-mould-area-txt);
}
.soil .product-main-info li::before{
  border-color: var(--color-soil-area-txt);
}
.water .product-main-info{
  background: var(--color-water-area);
  color: var(--color-water-area-txt);
}
.soil .product-main-info{
  background: var(--color-soil-area);
  color: var(--color-soil-area-txt);
}
.mould .product-main-info{
  background: var(--color-mould-area);
  color: var(--color-mould-area-txt);
}
.asbestos .product-main-info{
  background: var(--color-asbestos-area);
  color: var(--color-asbestos-area-txt);
}

.quantity{
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 20px;
  margin-bottom: 10px;
}
.qty-picker{
  display: flex;
    border: 1px solid var(--color-main-border);
    border-radius: 20px;
    padding: 5px 10px;
    background: none;
    height: auto;
    line-height: 1;
    align-items: center;
}
.qty-picker-dec,
.qty-picker-inc{
  border: none;
  background: none;
}
#products_qty{
  background: none;
  border: none;
  text-align: center;
  width: 50px;
}
#products_qty,
#products_qty2{
	padding: 0;
line-height: 1;
}
.po_name{
  margin-bottom: 10px;
}
.product_options{
      display: block !important;
    font-size: inherit !important;
    margin: 0 0 30px 0 !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
    color: inherit !important;
}
.product_options select{
  padding: 10px 15px;
  border-radius: 10px;
  border: 1px solid var(--color-main-border);
  background: var(--color-main-area);
  font-size: 14px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}
.mengenrabatt{
  text-align: right;
  font-size: 12px;
  margin-bottom: 20px;
}
.graduateprice{
	margin: 0;
    font-size: inherit;
    letter-spacing: 0;
}
.product-info .btn-prio1{
  width: 100%;
}
.product_options .po-radios{
  display: none;
}
.product-info .pco5 {
padding: 0;
margin:0;
}

/* ----- Product Accordion ----- */

.product-top-accordion .accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, padding 0.3s ease;
}

.product-top-accordion .accordion-item.active .accordion-content {
    max-height: none;
    padding: 10px 0;
}
.accordion-container{
    background: var(--color-main-area);
    overflow: hidden;
    padding: 20px;
    height: 100%;
}


.accordion-header {
    cursor: pointer;
    color: var(--color-main-dark);
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 10px;
    border-bottom: 1px solid var(--color-main-dark);
    position: relative;
    padding-right: 20px;
}
.accordion-header::after {
    position: absolute;
    top: calc(50% - 12px);
    right: 0;
    content: '+';
    font-size: 20px;
}
.accordion-item.active .accordion-header {
    color: var(--color-main-medium);
    border: none;
}
.accordion-item.active .accordion-header::after {
    content: '-';
}
.product-top-content{
	margin-bottom: 20px;
}
.product-top-content-img-inner{
  width: calc(100% + 40px);
  margin-left: -20px;
  margin-top: -20px;
  overflow: hidden;
  border-radius: 10px 10px 0 0;
  margin-bottom: 20px;
}
.product-top-content-img{
    display: none;
  }

.product-top-content-img-inner img{
  max-width: 100%;
  width: 100%;
}
.product-top-accordion .accordion-item:nth-child(1){
  border-radius: 10px 10px 0 0;
}
.product-top-accordion .accordion-item:nth-last-child(1){
  border-radius: 0 0 10px 10px;
	overflow: hidden;
}
.accordion-content .process-detail-steps {
    gap: 40px;
}
.accordion-content .process-detail-step{
  flex-direction: column;
  gap: 20px;
}
.accordion-content .process-detail-step > div {
    width: 50%;
    justify-content: center;
    align-items: center;
}
.accordion-content .process-icon img {
    height: 100px;
}
section.accordion-item{
  margin: 0;
}
.solution .accordion-item#accordion-2,
.mould .accordion-item#accordion-2,
.asbestos .accordion-item#accordion-2,
.bundle .accordion-item#accordion-2{
	display: none;
}
.solution .accordion-item#accordion-4{
display: none;
}
.pl_lp_9{
	display: none;
}
@media (min-width: 768px) {
	.solution .accordion-item#accordion-1,
	.mould .accordion-item#accordion-1,
	.asbestos .accordion-item#accordion-1,
.bundle .accordion-item#accordion-1{
		min-width: 100%;
		max-width: 100%;
		min-height: 300px;
	}
	.solution .accordion-item#accordion-3{
		min-width: 100%;
		max-width: 100%;
		min-height: 300px;
	}

}


/* ----- Parameter ----- */

.accordion-item .tab input {
  position: absolute;
  opacity: 0;
  z-index: -1;
}
.accordion-item .tab-content {
  position: fixed;
  top: 0;
  right: -100%;
  overflow: hidden;
  transition: all 0.35s;
  z-index: 99999;
  width: 100vw;
  height: 100dvh;
}
.accordion-item .tab-content-inner {
  background: var(--color-main-area);
  z-index: 20;
  position: relative;
  padding: 20px;
  width: calc(100vw - 50px);
  height: 100dvh;
  right: -50px;
  overflow-y: scroll;
	font-weight: 600;
}
.accordion-item .tab input:checked ~ .tab-content > label{
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100vw;
  height: 100vh;
  display: block;
  position: fixed;
  z-index: 15;
}
.accordion-item .tab input:checked ~ .tab-content {
  right: 0;
}
.accordion-item .tab input:checked ~ .tab-content::after {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100vw;
  height: 100vh;
  background: var(--color-main-overlay);
  transition: all 0.35s;
  z-index: 10;
}
.accordion-item .tab-content .close-btn{
  width: 100%;
  display: flex;
  justify-content: right;
}
.accordion-item .tab-content .close-btn label{
  border-radius: 50%;
  line-height: 1;
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--color-main-light);
  font-weight: 600;
  font-size: 22px;
}
.accordion-content h2{
  margin-top: 0;
}
.water .accordion-item .tab-content .close-btn label{
  background: var(--color-water-accent);
}
.soil .accordion-item .tab-content .close-btn label{
  background: var(--color-soil-accent);
}
.asbestos .accordion-item .tab-content .close-btn label{
  background: var(--color-asbestos-accent);
}
.mould .accordion-item .tab-content .close-btn label{
  background: var(--color-mould-accent);
}
.par-preview,
.par-detail{
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 0;
}
.par-preview li,
.par-detail li{
  padding: 5px 15px;
  background: var(--color-main-light);
  border: 1px solid #fff;
  border-radius: 10px;
  flex-grow: 0;
  flex-shrink: 0;
  line-height: 1.3;
	font-weight: 300;
}
#par-label ~ .btn{
  font-weight: 400;
  padding: 5px 15px;
  border-radius: 10px;
  line-height: 1.3;
}


/* ----- */


/* ----- Product Bottom Content ----- */

.product-bottom-content{
  padding: 20px;
  border-radius: 10px;
  background: var(--color-main-area);
}
.product-bottom-content h2{
  font-size: 18px;
  color: var(--color-main-medium);
  font-weight: 600;
}
.product-bottom-content h2 span{
  display: block;
  font-size: 24px;
  color: var(--color-main-dark);
  margin-top: 20px;
}
.product-bottom-content h3{
  font-size: 18px;
  font-weight: 600;
	margin-bottom: 10px;
}
.water .product-bottom-content h3{
  color: var(--color-water-accent);
}
.asbestos .product-bottom-content h3{
  color: var(--color-asbestos-accent);
}
.soil .product-bottom-content h3{
  color: var(--color-soil-accent);
}
.mould .product-bottom-content h3{
  color: var(--color-mould-accent);
}
.product-bottom-content .tab input {
  position: absolute;
  opacity: 0;
  z-index: -1;
}
.product-bottom-content .tab-content {
  max-height: 0;
  overflow: hidden;
  transition: all 0.35s;
}
.product-bottom-content .tab-content p:nth-child(1) {
  margin-top: 0;
}
.product-bottom-content .tab input:checked ~ .tab-content {
  max-height: none;
}
.product-bottom-content .tab-label{
  cursor: pointer;
  color: var(--color-main-dark);
  font-size: 18px;
  font-weight: 600;
  margin-top: 10px;
  border-bottom: 1px solid var(--color-main-dark);
  position: relative;
  padding-right: 20px;
  display: block;
}
.product-bottom-content .tab-label::after {
  position: absolute;
  top: calc(50% - 12px);
  right: 0;
  content: '+';
  font-size: 20px;
}
.product-bottom-content input:checked ~ .tab-label::after {
    content: '-';
}
.product-bottom-content input:checked ~ .tab-label {
    border: none;
}

/* ----- Feintuning auf Unterseiten ----- */
.hinweisbox_ff22{
	display: none;
}

#account .h1box, .account_edit_address .h1box, .sr_address_book .h1box, .sr_address_book_process .h1box, .sr_account_password .h1box, .sr_account_history_info .h1box, .sr_account_laboranalyses .h1box, .sr_login .h1box {
  text-shadow: none;
    font-weight: 500;
    margin: 0 !important;
    padding: 10px 20px;
    text-transform: capitalize;
    background: var(--color-main-medium);
    color: var(--color-main-light);
    border-radius: 10px 10px 0 0;
}
.sr_login .h1box{
	background: var(--color-home-accent);
	line-height: 1;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 10px;
	margin-top: 10px;
}
#account > .h1bcont{
	background: none;
    color: var(--color-main-dark);
    font-size: 14px;
    padding: 10px 0 !important;
    text-transform: capitalize;
	text-align: left;
	border: none;
}
.accVers_3 .acc_1_0_0 {
    margin: 10px 0;
    border-radius: 10px;
}
.account_analyse_1,
.account_laboranalyses #contentBox .innerBox{
	border: 2px solid var(--color-main-area);
    border-radius: 0 0 10px 10px;
    margin: 0 0 10px;
    padding: 20px;
	background: var(--color-main-area);
}
.account_analyse_1 .pus_btn3{
	width: 100%;
}
.account_analyse_1 .pus_btn3 a{
	width: 100%;
    font-size: 20px;
    font-weight: 500;
}
.atfb_btn,
.accFiltBtnBox{
	font-size: 14px;
}
.acc_tests_filerbox .checked {
    background: var(--color-main-medium) !important;
    color: var(--color-main-light) !important;
}
.accSortBtn {
    border-radius: 10px;
    color: var(--color-main-light) !important;
    background: var(--color-home-accent) !important;
}
.acc_1_0_1 .acc_3 .acc_3_1,
.acc_1_0_1 .acc_3 .acc_3_2 {
    padding: 0;
    background: none;
}
#account .acc_ph_cnt{
	margin-left: 0;
}
#account_edit > div:has(.pus_btn3){
	width: 100%;
}
#account_edit .pus_btn3{
	width: 100%;
margin: 10px 0;
}
#account_edit .pus_btn3.pus_mode_1 a{
	background: none;
	border:none;
}
#account_edit .pus_btn3.pus_mode_1:has(a){
	background: var(--color-main-light);
	border: 1px solid var(--color-main-dark);
}
.account_edit_address {
    padding: 0;
}
#account_edit {
    padding: 20px 0;
}
.acc_padding_20{
	padding: 0;
}
.bena_1{
	font-size: 14px;
}
.mainbox {
    background: none;
    border-radius: 0;
    border: none;
    margin: 0;
    padding: 0;
    overflow: unset;
}

.mainbox .info {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    background: none;
    padding: 10px;
    text-align: left;
    border-radius: 0;
    box-shadow: none;
    gap: 0;
}
.mainbox .subtitle{
	margin: 0 !important;
}
.mainbox .artikel .small a{
	color: var(--color-home-accent) !important;
}
.cartinfo select{
	width: 50px;
    height: 36px;
    text-align: center;
    border-radius: 5px;
    border: 1px solid var(--color-main-medium);
    background: #fff;
    font-size: 16px;
}
.warenkorbfooter{
	background: none;
	border: none;
	display: flex;
	flex-direction: column-reverse;
}
.warenkorbfooter .bb-color1,
.warenkorbfooter .bb-color2{
	padding: 10px 40px !important;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    font-size: 16px;
    border-radius: 20px;
    font-weight: 700;
    box-shadow: 0 2px 5px rgba(200, 200, 200, 0.5);
    width: 100%;
    color: var(--color-main-dark) !important;
    margin: 10px 0;
}
.warenkorbfooter .bb-color1{
    background: var(--color-main-light);
	border: 1px solid var(--color-main-medium);
}
.warenkorbfooter .bb-color2{
	background: var(--color-main-action);
}
.warenkorbfooter .bb-color2:hover{
	background: #ffe76c;
}
.tpl_co_1 .artikel{
	margin-bottom: 20px;
    border-bottom: 1px solid var(--color-main-border);
    padding-bottom: 20px;
}
.tpl_co_1 .wksc1{
	height: auto;
}
.tpl_co_1 .wksc2 {
    width: 80%;
}
#cart_quantity h2, #registrierung h2, #checkout_confirmation h2 {
    margin: 5px 0 10px 0px;
}
.ia1_v2_1 .h2_1{
	border-bottom:none !important;
}
.tpl_co_1 .infobox{
	background: none;
    border: none;
    margin: 0;
    padding: 20px 0;
}
.tpl_co_1 .artikel h3{
    margin-top: 10px;
    font-size: 18px;
}
.newHint2024 {
    font-size: 14px;
    margin: 10px;
}
.tpl_co_1 #checkbox{
	margin: 10px !important;
}
.tpl_co_1 #submitArea .btnClass2 {
	border: none;
}
.tpl_co_1 #submitArea a {
	line-height: 1;
    font-size: 18px;
    height: auto;
    padding: 13px;
    width: 100%;
}
ia1_v2_1{
	font-size: 16px;
}
.ia1_v2_1 .ia6st input[type="tel"],
.ia1_v2_1 .ia6st input[type="text"],
.ia1_v2_1 .ia3st input[type="text"],
.ia3st input[type=password],
.ia3st input[type=text],
.ia6st input[type=text],
.ia6st input[type=tel],
.teg132 input{
        border-radius: 10px !important;
    }
#kukoPwd{
	padding: 10px;
}
.tpl_co_1 #login .pus_btn3{
	padding: 0;
    overflow: hidden;
    width: 100%;
    margin: 20px 0;
}
.tpl_co_1 .input > input + span {
    top: 16px;
}
.tpl_co_1 .input > input:focus + span,
.tpl_co_1 .input > input:not(:placeholder-shown) + span {
    top: -10px !important;
}
.tpl_co_1 .select-list {
	margin: 10px 0 !important;
}
.ia6stsdfasdgfdsgsdfgasdgsdg,
.ia6stsdfasdgfdsgsdfgasdgsdg a {
    font-size: 14px !important;
}
.tpl_co_1 .divider{
	display: none;
}
.tpl_co_1 .infobox ul{
	padding-left: 30px;
    list-style-type: none;
}
.tpl_co_1 .infobox ul span{
	display: none;
}
.ia1_v2_1 #iagenderbox_a {
    margin: 10px 0 !important;
}
.tpl_co_1 .infobox li{
	position: relative;
	margin-bottom: 10px;
}
.tpl_co_1 .infobox li::after {
    position: absolute;
    display: block;
    content: '';
    width: 8px;
    height: 13px;
    left: -20px;
    top: 2px;
    border-bottom: 2px solid;
    border-right: 2px solid;
    border-color: var(--color-water-accent);
    transform: rotate(71deg) skew(36deg, 0deg) translateZ(0);
    outline: 1px solid transparent;
    -webkit-backface-visibility: hidden;
    will-change: transform;
    -webkit-perspective: 1000;
}
.tpl_co_1 .blueBar{
	display: none;
}
#country{
  width: 100%;
  border-radius: 10px;
  border: 1px solid #cccccc;
}
.variation4 .btnCntctcStyle input{
  width: 100% !important;
  border-radius: 10px !important;
  border: 1px solid #cccccc;
}
#login .iagenderbox{
  margin-left: 0;
}
.f1_iagenderbox{
  border: none;
    padding: 0;
}
.v4_formcontainer p{
  margin: 10px 0;
}
.lgn_1_1 {
    width: 100%;
    float: left;
    display: flex;
    justify-content: center;
}
.lgn_1_2{
  width: 100%;
    float: left;
    display: flex;
    justify-content: center;
}
.lgn_1_1_3,
.lgn_1_2_1{
    display: block;

}
.tab_color_inactive {
    color: #8c8c8c;
    background: #e8e8e8;
}
.lgn_border_bottom {
    border-bottom: 2px solid #cecece;
}
.lgn_border_top {
    border-top: 2px solid #cecece;
    box-shadow: 0px -10px 10px rgba(0, 0, 0, 0.05);
}
.lgn_1 {

}
.sr_create_guest_account .input > input + span {
    top: 16px;
}
.sr_create_guest_account .input > input:not(:placeholder-shown) + span {
    top: -10px;
}
.sr_create_guest_account .ia1_v2_1 {
    margin-bottom: 60px;
}
.lgn_1_3 {
    width: 50%;
    border-right: 2px solid #cecece;
    padding-left: var(--paddingwidth);
}
.lgn_1_4 {
    width: 50%;
    padding: 0 0 0 20px;
}
.lgn_1_5 {
    text-align: center;
}
.pus_btn3,
.bbllink2{
  padding: 10px 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 400;
  width: fit-content;
  text-decoration: none;
	color: var(--color-main-light);
  border-radius: 10px;
	background: var(--color-home-accent);
	min-width: 200px;
}

.btnClass2,
.btnClass3{
	padding:0;
	width: auto;
	height: auto;
	font-size: inherit;
}

.bb-color3 a{
	color: var(--color-main-dark);
background: var(--color-main-action);
}

#iBJH1 a.bbfz2 div,
a.bbfz2 span,
a.bbfz2 span b {
	font-size: inherit;
	font-weight: inherit;
    color: inherit;
}

.lgn_1_1_1{
margin: 0;
display: flex;
justify-content: flex-end;
}
lgn_1_1_2{
  margin: 0 0 5px;
  text-align: left;
}
.v4_formcontainer .pus_btn3 a{
  padding: 0;
}
.co2{
	display: none;
}
.co4{
	background: var(--color-home-accent);
}
#reviews-slider_ad{
	display: flex;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
	gap: 40px;
}
#reviews-slider_ad .review-wrapper {
    min-width: 100%;
    flex: 0 0 100%;
    padding: 5px;
    scroll-snap-align: start;
    cursor: pointer;
}
#reviews-slider_ad .review-container-inner{
	background: #fff;
    gap: 0;
    padding: 20px;
}
#reviews-slider_ad .review-middle{
	flex-direction: column;
    align-items: flex-start;
}
.container:has(#reviews-slider_ad){
	margin: 40px 0;
}
.container:has(#reviews-slider_ad) + .bb-color2C{
	background: var(--color-home-accent);
    border-radius: 30px;
    padding: 10px 20px;
}
.container:has(#reviews-slider_ad) + .bb-color2C span{
	color: var(--color-main-light);
}
.tpl_co_0 .btn-cta{
width: 100%;
white-space: unset;
	background: var(--color-main-action);
	color: var(--color-main-dark) !important;
	border-radius: 20px;
	font-weight: 700;
	box-shadow: 0 2px 5px rgba(200, 200, 200, 0.5);
}
.tpl_co_0 .btnClass2{
	border: none;
}
.tpl_co_0 .btnClass2 a{
	width: 100%;
	background: var(--color-main-action);
	color: var(--color-main-dark);
	border-radius: 20px;
	font-weight: 700;
	box-shadow: 0 2px 5px rgba(200, 200, 200, 0.5);
}
.bbllink23,
.bbllink23var1{
	background: var(--color-main-action);
	color: var(--color-main-dark) !important;
	border: none;
	border-radius: 20px !important;
	font-weight: 700;
	box-shadow: 0 2px 5px rgba(200, 200, 200, 0.5) !important;
    display: flex !important;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-shadow: none !important;

}
.sfu8 {
    padding: 30px 0 !important;
    height: auto !important;
}
a.bbfz23 div, a.bbfz23 span, a.bbfz23 span b, a.bbafbtn{
	color: var(--color-main-dark) !important;
	margin: 0;
	width: 100%;
}
.bb-color2:hover{
	background: unset;
}
.teg3,
.teg 17,
.teg17 > div,
.teg 18{
	width: 100% !important;
}
.teg 17{
	padding: 30px !important;
}
.co57ldel{
	text-align: right !important;
	font-size: 12px !important;
}
.co81R3 {
    font-size: 12px !important;
}
.conbrhack{
    font-size: 12px !important;
}
.co_conf_xfl_6 {
    width: calc(100% - 70px);
}
.beliebt-checkmark {
    right: 0px;
}
.cc6 .bb-color3 {
    background: none;
    box-shadow: none;
}
.ia91L,
.ia91R {
    width: 50%;
}
#checkout_confirmation h3{
	font-size: 16px;
}
#checkout_confirmation h2{
	margin-top: 20px;
}
#otopL_versand--servicepauschale,
#otopR_versand--servicepauschale,
#otopL_inkl19-mehrwertsteuer,
#otopR_inkl19-mehrwertsteuer{
	font-size: 14px;
}
#otopL_bestellwert,
#otopR_bestellwert{
	font-size: 18px;
}
#gutscheinintro > div{
	width: 100%;
}
.co51 img{
	width: auto;
	height: auto;
}
@media (max-width: 767px){
	.warenkorbfooter .ia91R {
    width: 100%;
	}
}



@media (min-width: 768px){

	.co52{
	width: calc(100% - 595px);
	}
	.cc1L,
	.cc1R,
	.cc2L,
	.cc2R{
		width: 50%;
	}

	.cc2R #comments{
		width: 100%;
        max-width: 100%;
        background: #fff;
        border: 1px solid var(--color-main-border);
        border-radius: 10px;
	}
	.cc3{
		height: auto;
    	padding: 20px 40px;
	}
	.cc4L,
	.cc4R{
		width: 50%;
	}
	.cc4R .tb1{
		width: 100%;
        border-radius: 10px;
        padding: 20px;
	}
	.cc4R .tb1 > div{
		width: 50%;
	}
	#gv_redeem_code {
		background: #fff;
		border: 1px solid var(--color-main-border);
		border-radius: 10px;
	}

	#reviews-slider_ad .review-wrapper {
		min-width: calc(100% / 3 - (40px * 2 / 3));
        flex: 0 0 calc(100% / 3 - (40px * 2 / 3));
	}
	#navtrail{
	margin: 10px 0;
	}
	.lgn_1_3,
	.lgn_1_4{
		width: 50% !important;
	}
	#login .lgn_1_1,
	#login .lgn_1_2{
		width: 100%;
	}
	.lgn_1_1_3,
	.lgn_1_2_1{
		padding: 50px 0;
		width: 40%;
	}
	#login .lgn_1_1_1{
		margin: 20px 0;
	}
	#login .lgn_1_1_1 > div{
		width: 100%;
	}
	#login #country{
		width: 100%;
	}
	#login .f1_iagenderbox{
		padding: 10px 0;
	}
	.ctBox2{
		display: flex;
		justify-content: center;
		flex-direction: column;
	}
	.cm59 .ctBox2{
		align-items: center;
	}
	.hero-txt .btn-prio2{
		box-shadow: 0 2px 5px rgb(38 35 37 / 30%);
	}
	.h1box {
		background: var(--color-home-accent);
		border: none;
		text-shadow: none !important;
		border-radius: 10px;
	}

}



/* -- */



@media (max-width: 768px){
  .lgn_1_1_3, .lgn_1_2_1 {
      max-width: 100%;
      min-width: 100%;
  }
  .lgn_1_5 {
      padding-left: 0;
      font-size: 16px;
  }
  .lgn_1_1 v4_formcontainer{
  padding-left: 0;
  }
  .btnCntctcStyle input {
    width: 100% !important;
	background: var(--color-main-area);
  }
  .lgn_1_1{
  padding: 0;
  }
  .lgn_1_2_1{
  padding: 0;
  }
  #iagenderbox a #herr, #iagenderbox a #frau {
    margin-left: 10px;
  }
  .lgn_1_6{
  padding: 0;
  }
	.h1box {
	border: none;
	background: #009de1;
	border-radius: 10px;
	line-height: 1;
	color: #fff;
	text-shadow: none;
	}
	#header{
	width: calc(100% + 40px);
	margin-left: -20px;
  }
}

/* ----- */

@media (min-width: 769px) {
  .product-info .picker-wrapper{
    display: flex;
    position: relative;
    align-items: baseline;
    gap: 15px;
  }
  .product-info .qty-text{
    display: none;
  }
  .mengenrabatt{
    position: absolute;
    bottom: -40px;
  }
  .product-info .qty-picker{
    border: none;
  }
  .product-info #products_qty{
    width: 30px;
  }
  .product-info .btn-prio1{
    width: fit-content;
  }
  .product_options select {
    width: fit-content;
  }
  .product_options .radiowrapper input {
    visibility: hidden;
    width:0;
    margin: 0;
  }
  .product_options select{
	background: var(--color-main-area);
	border: 1px solid var(--color-main-border) !important;
	border-radius: 10px;
	padding: 10px 15px !important;
  }
  .po-radios{
    display: flex;
    margin: 20px 0 40px;
    font-size: 14px;
    gap: 5px;
  }
  .product_options .radiowrapper input + label{
    background: var(--color-main-area);
    border: 1px solid var(--color-main-border);
    border-radius: 10px;
    padding: 10px 15px;
  }
  .product_options .radiowrapper input:checked + label{
    border: 2px solid  var(--color-main-action);
  }
}


@media screen only an (max-width: 768px){
	.search-container form{
		width: calc(100% + 30px);
	}
	.search-container .input-group{
		width: 100%;
		display: flex;
	}
	.search-container .btn{
		background: var(--color-main-dark);
		color: var(--color-main-light);
		border-radius: 0 20px 20px 0;
		padding: 0 30px;
		margin-left: -1px;
		border: 1px solid var(--color-main-dark);
	}
}
/* ----- */


/* ----- Footer ----- */

footer{
  font-size: 14px;
	margin-top: 30px;
}
footer a{
  text-decoration: none;
}
.legal-notice{
  padding: 30px 20px;
  border:  2px solid var(--color-main-action);
  border-radius: 10px;
  hyphens: auto;
}
.legal-notice h3{
  margin: 0 0 10px;
}
.footer-top{
  margin-bottom: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.footer-logo{
  margin: 0 20px;
}
.footer-logo img{
  max-height: 40px;
}
.footer-line{
  display: block;
  width: auto;
  height: 1px;
  background: var(--color-main-dark);
  flex-grow: 1;
}
.footer-bottom{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 20px;
  padding: 30px 20px;
  background: var(--color-main-area);
  width: calc(100% + 40px);
  margin-left: -20px;

}
.footer-bottom-column{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: calc(50% - 10px);
}
.footer-bottom-column a{
  margin-bottom: 5px;
}

.tpl_co_0 .themenUeberschrift{
	border-radius: 5px;
}
.tpl_co_0 #contentBox{
	width: calc(100% + 30px);
    margin-left: -15px;
}
.teg3{
	margin: 30px 0px;
}
.t_cnt2021_d{
	font-size: 14px;
}
.test-container:has(.t_cnt2021_a){
	border-radius: 10px;
    margin: 10px 0;
    padding: 10px;
}
.test-container:has(.t_cnt2021_b .test-value-green){
    border: 2px solid #0ecd01;
}
.test-container:has(.t_cnt2021_b .test-value-red){
    border: 2px solid red;
}
.schimm_cont .teg3{
	margin: 0;
}
.schimmel_v3_2_1{
	text-align: left !important;
}
.schimmel_v3_2_1_1{
	height: auto !important;
}
.footer-bottom-column a,
.footer-bottom-column a:visited{
	color: var(--color-main-dark);
}
.boden_cont .teg1,
.boden_cont .teg2,
.boden_cont .teg3{
	text-shadow: none;
	background: none;
    color: #333333;
}
.boden_v4_1{
	text-shadow: none;
}
.boden_empf {
    color: #333333;
    text-shadow: none;
}
.boden_erklaer h2{
	font-size: 18px;
	margin-top: 20px;
}
.boden_cont .teg1 b {
	color: #333333;
}
.boden_cont .schimmel_v3_2_1_2 ul {
    list-style: none;
}
.boden_cont .teg19 > .btnClass2 {
    background: none;
}
.teg12{
	background: none;
}
.teg11{
	background: #f1f1f1;
	padding: 20px;
    margin: 20px 0;
}
.teg132 input{
	box-shadow: none;
    border: 1px solid var(--color-main-border);
    background: #fff;
	font-size: 16px;
}
.teg11 #testergebnis{
	margin: 10px 0;
}
.teg11 #testergebnis .btnClass2 {
	max-width: none;
}
.wspd1,
.wspd2{
	border-radius: 10px;
}
body:has(.dbg_si__cP__wa__suche) .bigBox-dots .dot{
	margin: 0 2px;
}
.schimmel_v3_10 {
    min-height: 45px;
    height: auto !important;
}
#errorContainerd .wrap{
	width: 100%;
}
.ia_errormessage,
.ia_errormessage2{

}

.ui-overlay-a,
.ui-page-theme-a,
.ui-page-theme-a
.ui-panel-wrapper{
	text-shadow: none;
}
#account .account {
	width: 100%;
	margin-left: 0;
	padding: 0;
}
#account .mb10{
	display: none;
}
.acc_3{
	border-radius: 10px;
}
.acc_bg {
    background: var(--color-main-area) !important;
}
.dhl-return-labels .dhl-return-labels--position-button{
	background: var(--color-main-action) !important;
    color: var(--color-main-dark) !important;
	width: 100% !important;
}
.dhl-return-labels .dhl-return-labels--status{
	background: none !important;
    border: none !important;
    font-weight: normal !important;
    color: green !important;
	padding: 0 !important;
}
.dhl-return-notiz-txt{
	font-weight: bold !important;
}
.acc_1_0{
	border-radius: 10px !important;
}
.dhl-return-notiz-txt{
	min-height: 40px !important;
}
.ff28a img{
	width: 100%;
	height: auto;
}

/* ----- */


/* ----- responsive desktop styles ----- */

@media only screen and (min-width: 375px) {
 body,
.btn{
    font-size: 18px;
  }
  .content{
    padding: 0 20px;
  }

  .nav{
    padding: 20px 20px 0;
  }
	.nav-top{
	margin-bottom: 20px;
}
  .nav-bottom{
    padding-left: 20px;
    padding-right: 20px;
    margin: 0 0 0 -20px;
  }
  #menu li[aria-expanded="true"] > ul {
    width: calc(100% + 70px);
    margin-left: -20px;
    padding: 20px;
  }
  #menu li ul li{
    font-size: 18px;
  }
  .search-container{
    padding: 20px;
  }
  .hero .divider-container{
    width: 100%;
    padding: 0 20px;
  }
  .hero{
    width: calc(100% + 40px);
    margin-left: -20px;
  }
  .container-padding{
    padding: 0 20px;
  }
}

@media only screen and (min-width: 768px) {
  body {
    font-size: 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
.top-header-carousel {
border-radius: 0 0 12px 12px;
}
  h1{
    font-size: 42px;
  }
  h2{
    font-size: 26px;
  }
  .subline{
    font-size: 26px;
  }
  .small-txt{
    font-size: 14px;
  }

  header,
  .content{
    max-width: 1300px;
    width: 90%;
  }
  #nav-burger{
    display: none;
  }
  .nav-bottom,
  .search-container{
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 1;
    padding: 0;
    width: 100%;
  }
  .search-container input{
    height: 30px;
    font-size: 14px;
    padding: 0 30px 0 20px;
  }
  .nav-bottom {
    box-shadow: none;
    /*border-bottom: 1px solid var(--color-main-border);*/
  }
  .search-container{
    max-width: 300px;
  }

  .logo{
    max-width: none;
    height: 40px;
  }
  #menu{
    justify-content: space-between;
    height: auto;
    overflow: visible;
  }
  #menu,
  #menu ul{
    display: flex;
    padding: 0;
  }
  #menu,
  .nav-bottom-right ul{
    gap: 30px;
  }

  .nav-bottom-left ul{
    margin-right: 30px;
    flex-wrap: wrap;
  }
  .nav-bottom-left > ul > li{
    margin-right: 30px;
  }
  #menu li{
    font-size: 16px;
    cursor: pointer;
    flex-shrink: 0;
  }
	.naviContainer_V_german_5 .sub-menu-caption{
	display: none;
}
  #menu li:has(ul)::after{
    width: 12px;
    height: 12px;
    top: 20px;
  }
  #menu li ul{
    position: absolute;
  }
  #menu li ul ul{
    left: 100%;
    top: 0;
  }
   #menu li li{
    position: relative;
  }
  #menu li a{
    text-align: left;
  }

  #menu li li a{
    justify-content: flex-start;
    padding: 15px 20px;
  }
  #menu li li:has(ul)::after{
    right: 20px;
  }
  #menu li:hover::after{
    transform: rotate(0deg);
  }

  #menu li li:hover::after{
    transform: rotate(90deg);
  }
  #menu li:hover > ul{
    display: block;
    margin-left: 0;
    padding: 0;
    border: 1px solid var(--color-main-border);
    border-top: none;
    background: var(--color-main-light);
    width: 300px;
    z-index: 3;
  }
  #menu li li:hover > ul{
    border: 1px solid var(--color-main-border);
    border-left: none;
  }
  #menu .nav-bottom-right li:hover > ul{
    right: 0;
  }
  #menu li li:hover{
    background: var(--color-main-area);
  }
  .hero .divider-container{
    bottom: 0;
    top: auto;
    border-radius: 10px;
  }
  .hero .divider-perk{
    min-width: 0;
    gap: 20px;
  }
  .hero{
    position: relative;
    min-height: 666px;
    overflow: hidden;
	border-radius: 12px;
  }
  .hero img{
    position: absolute;
    height: 100%;
    width: auto;
    right: -150px;
  }
  .hero .divider img {
    width: auto;
    position: relative;
    height: auto;
    top: 0;
    right: 0;
  }
  .hero .divider{
    justify-content: space-around;
  }
  .hero-txt{
    min-height: 666px;
    padding-top: 0;
  }
  .hero .subline{
    font-size: 18px;
	margin-bottom: 20px;
  }
  .hero-txt h1{
    width: 80%;
  }
  .hero-txt .subline{
    width: 60%;
  }
  .rcmnd{
    display: flex;
    gap: 50px;
    flex-wrap: wrap;
    margin-bottom: 90px;
  }
  .rcmnd-lilBoxes .bigBox{
    /*overflow: hidden;*/
  }
  .rcmnd-lilBoxes .bigBox-item-container{
    width: auto;
  }
  .rcmnd-lilBoxes .bigBox-item{
    min-width: 200px;
    max-width: 200px;
  }
  .bigBox-item-container{
    flex-basis: content;
    flex-shrink: 0;
    width: auto;
  }
	.bigBox-item{
		min-width: calc(100% / 2 - (20px * 1 / 2));
    	max-width: calc(100% / 2 - (20px * 1 / 2));
	}
	.bigBox-item-img img {
		width: 100%;
	}
.rcmnd-text{
	flex: 1 0 350px;
}
.rcmnd-lilBoxes{
	width: auto;
	overflow: hidden;
}
.rcmnd-lilBoxes .bigBox-item{
	padding-bottom: 0;
}
.rcmnd-lilBoxes .bigBox-navigation{
	margin: 10px 0;
}
.rcmnd-lilBoxes .bigBox-navigation{
	display: none;
}

  .intro-img-container{
    flex-grow: 1;
    flex-basis: 0;
  }
  .intro-img-container-outer{
    flex-direction: row;
	width: 100%;
  }
  .intro-img-container-outer > p{
    flex-grow: 1;
    flex-basis: 0;
  }
  .intro-img-container-inner{
    padding: 100px 50px;
  }

  .info{
    flex-direction: row;
    text-align: left;
    gap: 30px;
  }
  .process .container{
    display: flex;
    gap: 50px;
  }
  .process-detail,
  .process-video{
    width: 50%;
    margin: 0;
  }
  .process-detail-steps{
    flex-direction: row;
	margin: auto;
  }

  .process-detail-step{
    flex-direction: column;
    gap: 15px;
  }
  .process-icon{
    height: 100px;
    width: auto !important;
	align-items: flex-end;
  }
	.process-icon-txt {
	width: auto !important;
	text-align: center;
	}
  .process-video{
    flex-grow: 1;
  }
  .process-video h3{
    display: none;
  }
  .categories-slider-item {
    min-width: 35%;
    flex: 0 0 35%;
  }
  .review-item {
      min-width: 25%;
      flex: 0 0 25%;
  }
  .categories-slider-container {
    max-width: 100%;
    width: 100%;
    margin-left: 0;
  }
  .footer-bottom{
    flex-wrap: nowrap;
    border-radius: 10px 10px 0 0;
    width: 100%;
    margin-left: 0;
  }
  .footer-bottom-column a{
    margin-bottom: 10px;
  }
  .search-img-container{
    width: 40px;
    height: 40px;
  }
  .rcmnd-lilBoxes .bigBox-item-container .bigBox-item:nth-last-child(1){
    margin-right: 0;
  }
  .slider-container{
    justify-content: center;
  }
  .slider-item {
    flex: 0 0 20%;
  }

  .teaser .container{
    gap: 50px;
    padding: 50px 20px;
    flex-direction: row;
  }
  .teaser .container > div{
    width: 50%;
  }
  .teaser .btn{
    width: fit-content;
    margin: 30px 0;
  }
  .txt-content .container{
    flex-direction: row;
	flex-wrap: wrap;
  }
  .txt-content-left .container{
    flex-direction: row-reverse;
  }
  .txt-content-img{
    min-width: 35%;
    max-width: 35%;
  }
	.txt-content:has(.txt-content-img) .txt-content-txt{
	min-width: calc(65% - 30px);
    max-width: calc(65% - 30px);
}
  .topseller h2.hide-mobile{
    border-bottom: 3px solid var(--color-main-dark);
    padding-bottom: 10px;
    margin-bottom: 30px;
    display: inline-block;
  }
  .rcmnd-btn{
    width: fit-content;
    float: right;
    position: relative;
    top: -60px;
  }
  .img-trenner-container{
    background-position: center;

  }
  .img-trenner-container-inner{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    min-height: 400px;
  }
  .img-trenner-container-head,
  .img-trenner-container-sub{
    max-width: 500px;
  }
  .img-trenner-container-head{
    font-size: 42px;
  }
  .img-trenner-container-sub{
    font-size: 30px;
    font-weight: 400;
  }
  .intro-hinweis-inner{
    flex-direction: row;
    width: 100%;
  }
   .intro-hinweis-inner > div{
    width: 50%;
  }
  .intro-hinweis-box{
    padding: 30px;
  }


  /* ----- Perks ----- */


  .perk{
    width: 20%;
  }
  .perk-icon img{
    max-width: 120px;
  }
  .product .perk-txt{
    font-weight: 600;
  }
  /* ----- */

  /* ----- Product Accordion ----- */

  .product-top-accordion .accordion-content {
      max-height: none;
      padding: 10px 20px !important;
  }
  .product-top-accordion .accordion-header {
      cursor: default;
      padding: 20px;
  }
  .product-top-content-img{
    display: none;
  }
  .product-top-content-img-inner{
    display: block;
    width: 100%;
    max-width: 377px;
    left: 0;
    position: absolute;
    border-radius: 10px 0 0 10px;
    top: 0;
    height: 100%;
    margin: 0;
  }
  .product-top-content-img-inner img{
    object-fit: cover;
    object-position: 50% 50%;
    width: 100%;
    height: 100%;
  }




  .product-top-accordion{
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
  }
  .accordion-item{
    min-width: calc(50% - 10px);
    max-width: calc(50% - 10px);
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: stretch;
  }
  .accordion-item:has(.vergleich){
    justify-content: flex-start;
    gap: 30px;
  }
  .accordion-item:has(.vergleich) .accordion-container{
    height: auto;
  }
  .accordion-container{
    border-radius: 10px;
  }
  .accordion-item#accordion-1{
    min-width: calc(65% - 10px);
    max-width: calc(65% - 10px);
  }
  #accordion-1 .accordion-container{
    padding-left: 397px;
  }
  .accordion-item#accordion-2{
    min-width: calc(35% - 10px);
    max-width: calc(35% - 10px);
  }
  .accordion-item .tab-content-inner {
    width: 30vw;
    right: calc(-100% + 30vw);
  }
  .accordion-header::after{
    display: none;
  }
/* ----- */

/* ----- product-bottom-content ----- */


	.product-bottom-content .tab-content {
	  max-height: none;
	  display: inline;
	}
	.product-bottom-content .tab-label{
	  border: none;
	  display: inline;
	  float: left;
	  padding: 0;
	  margin: 2px 10px 0 0;
	  position: relative;
	}
	.product-bottom-content .tab-label::before {
	  content: ':';
	  position: absolute;
	  right: -5px;
	  top: 0;
	  display: block;
	}
	.product-bottom-content .tab-label::after {
	  display: none;
	}
	.product-bottom-content h3 {
	  clear: left;
	}

	/* ----- */

	/* ----- Testergebnisse ----- */

	.sr_testergebnis_resultat .h1box{
		background: #234e65;
		text-shadow: none;
		border-radius: 10px;
	}
	.teg3{
		width: 100%;
	}
	.t_cnt2021_a{
		border-radius: 10px;
	}
	.teg8{
		width: 100% !important;
	}
	.teg17{
		width: 100% !important;
        margin-left: 0 !important;
	}
	.sr_testergebnis_resultat .teg16{
		margin-left: 0 !important;
		width: 100% !important;
	}
	.schimm_wrapper {
		width: 100% !important;
		margin-left: 0 !important;
		position: relative;
	}
	.schimmel_v3_3{
		height: auto !important;
	}
	.schimmel_v3_6{
		height: auto !important;
		border-radius: 10px;
	}
	.schimmel_v3_4 {
		width: 100%;
		border-radius: 10px 10px 0 0;
	}
	.schimmel_v3_2 {
		border-radius: 10px;
	}
	.akbeiR {
		width: calc(100% - 430px) !important;
	}
	.schimmel_v3_5 {
		border: none !important;
		border-radius: 0 0 10px 10px
	}
	.sr_create_guest_account .input > input + span {
		font-size: 16px;
	}
	.sr_create_guest_account .input > input:not(:placeholder-shown) + span {
		font-size: 14px;
	}
	.ia3st{
		height: auto !important;
	}
	#sc_layerpopupcnt{
		position: relative !important;
		right: auto !important;
		top: 10px !important;
		font-size:14px !important;
	}
	.abweichende_box{
	    display: flex;
    	flex-direction: column;
	}
	.input > input:focus + span{
		top: -10px !important;
	}
	.ia1_v2{
		font-size: 16px;
	}
	.ia1_v2 #checkbox{
		margin: 10px;
	}
	.container .checkmark:after {
		top: 4px !important;
		left: 4px !important;
	}
	.accVers_3 .acc_1_0_0{
		width: 100% !important;
		height: 300px !important;
		min-height: 300px !important;
	}
	.accVers_3 .h1bcont{
		height: 60px !important;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 10px;
	}
	.accVers_3{
		display: grid;
		grid-template-columns: calc(50% - 10px) calc(50% - 10px);
		grid-template-rows: auto 60px 350px auto;
		grid-template-areas:
		"header header"
		"analysen aktivieren-header"
		"analysen aktivieren"
		"analysen account-features";
		gap: 20px;
	}
	.accVers_3 .acc_1_0_0{
		width: 100%;
		height: 300px;
		min-height: 300px;
		grid-area: header;
	}
	.accVers_3 > .h1bcont{
    	grid-area: aktivieren-header;
	}
	.acc_tests_filerbox{
		width: 100% !important;
		display: grid;
		grid-template-columns: calc(50% - 10px) calc(50% - 10px);
		grid-template-rows: auto;
		grid-template-areas:
		"filter-1 filter-2"
		"analysen aktivieren-header"
		"analysen aktivieren"
		"analysen account-features"
		"analysen .";
		gap: 20px;
	}
	.atfb_btn_orderby{
		grid-area: filter-1;
	}
	.atfb_btn_filter1{
		grid-area: filter-2;
	}
	.atfb_btn {
		padding: 0 !important;
	}
	.acc_1_0_2{
		grid-area: account-features;
	}
	.account_laboranalyses{
		grid-area: analysen;
	}
	.account_analyse_1{
		grid-area: aktivieren;
		margin-top: -20px;
	}
	.dhl-return-labels--position{
		display: flex;
		gap: 20px;
	}
	.dhl-return-labels--position-content{
		float: none;
		width: calc(60% - 10px);
	}
	.dhl-return-labels--position-details{
	    margin-bottom: 20px;
	}
	.dhl-return-labels--status{
		font-weight: normal;
		width: 100%;
	}
	.dhl-return-notiz-txt{
		font-size: 14px;
		width: 100% !important;
		max-width: 100% !important;
	}
	.dhl-return-labels--position-actions{
		float: none;
		min-height: 0;
		width: calc(40% - 10px);
	}
	.ret-lab-pos-3{
		font-size: 14px;
	}
	.ret-lab-pos-7{
		width: 100%;
	}
	.ret-lab-pos-7 a{
		width: 100% !important;
	}
	.account .pus_mode_2 a:hover,
	#account_password .pus_mode_2 a:hover,
	#addressbook .pus_mode_2 a:hover,
	.account_edit_address .pus_mode_2 a:hover {
		box-shadow: none !important;
	}
	#mlAjCode,
	#mlAjNotiz{
		width: 100%;
		height: 60px;
		font-size: 24px;
	}
	.acc_1_0_1 .acc_3 .acc_3_1, .acc_1_0_1 .acc_3 .acc_3_2 {
		width: 100% !important;
	}
	.account_analyse_1,
	.account_laboranalyses #contentBox .innerBox{
		border: none !important;
	}
	.atfb_btn, .accFiltBtnBox {
		width: 100% !important;
	}
	.schimmel_v3_4_1{
		height: 140px !important;
	}
	.teg25{
		margin: 0 !important;
		border-radius: 10px;
	}
	.akbe{
		border-radius: 10px;
	}
	.asbest_v3_9_1 {
		width: calc(100% - 450px) !important;
	}

}


@media only screen and (min-width: 768px) and (max-width: 1240px){
	.bigBox .gradPrice{
	font-size: 20px;
	}
}

@media only screen and (min-width: 1024px) {
  .categories-slider-item {
    min-width: calc((100% - 3 * var(--gap-default)) / 4);
    flex: 0 0 calc((100% - 3 * var(--gap-default)) / 4);
  }
   .categories-dots {
      display: none;
  }

  /* Show dots if more than 4 slides */
  .categories-slider.more-than-four ~ .categories-dots {
      display: block;
  }

  .reviews-dots {
      display: none;
  }

  .reviews-slider.more-than-four ~ .reviews-dots {
      display: block;
  }
	.bigBox-item{
		min-width: calc(100% / 3 - (20px * 2 / 3));
    	max-width: calc(100% / 3 - (20px * 2 / 3));
	}
	.bigBox-item-img img {
		width: 100%;
	}
	  .ueber-ivario{
    flex-direction: row;
    gap: 50px;
  }
  .ueber-ivario-img{
    width: 40%;
    overflow: hidden;
    min-width: 40%;
    position: relative;
  }
  .ueber-ivario-img img{
    min-height: 100%;
    width: auto;
    position: absolute;
    height: 100%;
  }
  .ueber-ivario-txt{
    padding: 20px;
  }
}

@media only screen and (min-width: 1340px) {
  header,
  .content{
    width: 1300px;
  }
  .hero-txt{
    background: none;
    padding-top: 80px;
  }
  .hero-txt h1 {
    width: 60%;
  }
  .hero-txt .subline{
    width: 50%;
  }
  .hero img{
    right: 0;
    top: 0;
  }
  .rcmnd {
    flex-wrap: nowrap;
  }
	.bigBox-item{
    	min-width: 300px;
    	max-width: 400px;
  }
}

/* ----- CHECKOUT FIX 04.12.2024 ----- */

@media (min-width: 768px){

	.co4{
		display: flex;
	}
	.co41,
	.co42,
	.co43,
	.co44{
		padding: 0;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		height: 100%;
		float: none;
		width: auto;
	}
	.co41{
		padding-left: 10px;
		flex: 1 0 0px;
		min-width: 0;
	}
	.co42{
		flex: 0 0 100px;
	}
	.co43{
		justify-content: center;
		flex: 0 0 200px;
	}
	.co44{
		flex: 0 0 160px;
		margin: 0;
	}
	.co5{
		display: flex;
		flex-wrap: wrap;
	}
	.co5 .clear{
		clear: both;
		width: 100%;
		height: 1px;
	}
	.co51,
	.co53all,
	.co54{
		margin-bottom: 0;
	}
	.co51,
	.co52,
	.co53,
	.co54,
	.co55,
	.co56,
	.co57{
		padding: 0;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		height: 80px;
		float: none;
		margin: 0;
	}
	.co51{
		flex: 0 0 100px;
		padding-left: 10px;
	}
	.co51 img{
		width: auto;
		height: auto;
	}
	.co52{
		flex: 1 0 0px;
		flex-direction: row;
	}
	.co53{
		flex: 0 0 100px;
	}
	.co54{
		justify-content: flex-end;
		flex: 0 0 50px;
	}
	.co54minus,
	.co54plus{
		margin: 0;
	}
	.co55{
		flex: 0 0 100px;
		flex-direction: column;
        justify-content: center;
	}
	.co55 .conbrhack{
		width: auto;
		left: auto;
		top: auto;
		position: relative;
	}
	.co56{
		flex: 0 0 50px;
	}
	.co57{
		flex: 0 0 160px;
	}
	.co57ldel{
		padding: 0 10px;
		height: auto;
		margin: 0;
	}
	.co8_wrapper{
	    justify-content: space-between;
	}
	.co81L {
		width: auto;
		flex: 1 0 0px;
	}
	.co811R{
		display: none;
	}
		.co81R{
		background: none;
		margin-right: 40px;
		width: 350px;
	}
		.co81R3{
		width: 180px;
	}
	.co81R4{
		width: 120px;
	}
	.co9{
	    width: 100%;
    	display: flex;
	}
	.co91L{
		width: auto;
		flex: 1 0 0px;
	}
	.co91L > div{
		height: 100%;
	}
	.co91R {
		width: auto;
		margin-right: 25px;
	}
	.verups_opt3_aus, .co41_status1_1, .co41_status2_1, .co41_status1_2, .co41_status3_2, .co41_status2_0, .co41_status3_0{
	display: none;
	}
	.co2 + #errorContainer{
	    margin-top: 150px;
	}
	.co2 + #errorContainer .wrap{
	    width: 100%;
	}
	#abdecker{
		opacity: 0.3 !important;;
	}
	.tpl_co_1 #theLayer_t{
		top: 30%;
	}
}
/* ----- */

/* ----- Weihnachtshinweis ----- */

@media only screen and (max-width: 767px) {
.accVers_3 .stoerer{
	padding: 20px;
	border: 3px solid red;
	border-radius: 10px;
	margin: 10px 0;
	background: #fff0ef;
	}
}
@media only screen and (min-width: 768px) {

	.accVers_3 {
		grid-template-rows: auto auto 60px 350px auto;
		grid-template-areas:
		"header header"
		"stoerer stoerer"
		"analysen aktivieren-header"
		"analysen aktivieren"
		"analysen account-features";
	}
	}
	.accVers_3 .stoerer{
		grid-area: stoerer;
		padding: 20px;
		border: 5px solid red;
		border-radius: 10px;
		margin: 20px 0;
		background: #fff0ef;
	}
	.account_analyse_1 {
		margin-top: 0;
	}

}

.rcmnd-lilBoxes .bigBox-item{
	min-width: 200px;
	max-width: 200px;
}

.rcmnd-lilBoxes .bigBox-item-name{
	font-size: 16px;
}

.icw_filter_buttons_box{
	display: none;
}

/* ----- 3/4 Slider Fix ----- */

.lilBox-navigation{
	display: none;
}

@media (max-width: 767px){
	.rcmnd-lilBoxes{
		width: calc(100% + 40px);
		margin-left: -20px;
	}
	.rcmnd-lilBoxes .bigBox-item-container{
		scroll-padding-inline-start: 20px;
    	padding-left: 20px;
	}
}

/* ----- UX Optimierungen Februar 2025 ----- */

.bigBox li::after{
    transform: rotate(68deg) skew(28deg, -12deg) translateZ(0);
}

.rcmnd-lilBoxes .bigBox-content{
    display: block;
    padding: 0;
    flex-grow: 1;
    margin-bottom: 5px;
    font-size: 14px;
}
.rcmnd-lilBoxes .bigBox-content ul{
    padding-left: 23px;
    margin: 5px 0;
}
.rcmnd-lilBoxes .bigBox-content li::after{
    left: -15px;
    width: 6px;
    height: 11px;
}
.bigBox-item{
    padding-bottom: 80px;
}
.rcmnd-lilBoxes .bigBox-item{
    padding-top: 10px;
    padding-bottom: 30px;
}
.stars2024{
    padding-right: 0;
}

.bigBox-prev,
.bigBox-next{
    position: absolute;
    top: 50%;
    color: var(--color-main-dark);
    font-size: 20px;
}
.bigBox-prev{
    left: -25px;
    transform: rotate(180deg);
}
.bigBox-next{
    right: -25px;
}
.bigBox{
    overflow: visible;
}
.iva_art_faq p{
	text-align: left;
}
.address_book .ab_entry_buttons .pus_btn3,
.address_book .ab_entry_buttons .bbllink2{
	display: none;
}


/* ----- Safari Fix */


@supports (-webkit-touch-callout: none){
   /* CSS specific to iOS devices */

    .bigBox-prev,
    .bigBox-next{
        color: #ffffff00;
    }
    .bigBox-prev::after,
    .bigBox-next::after{
        position: absolute;
        display: block;
        content: '';
        border: solid black;
        border-width: 0 3px 3px 0;
        padding: 3px;
        top: calc(50% - 5px);
    }
    .bigBox-prev::after{
        transform: rotate(-45deg);
      -webkit-transform: rotate(-45deg);
    }
    .bigBox-next::after{
        transform: rotate(-45deg);
      -webkit-transform: rotate(-45deg);
    }
}

@supports (hanging-punctuation: first) and (font: -apple-system-body) and (-webkit-appearance: none) {
   /* CSS specific to Safari*/

    .bigBox-prev,
    .bigBox-next{
        color: #ffffff00;
    }
    .bigBox-prev::after,
    .bigBox-next::after{
        position: absolute;
        display: block;
        content: '';
        border: solid black;
        border-width: 0 3px 3px 0;
        padding: 3px;
        top: calc(50% - 5px);
    }
    .bigBox-prev::after{
        transform: rotate(-45deg);
      -webkit-transform: rotate(-45deg);
    }
    .bigBox-next::after{
        transform: rotate(-45deg);
      -webkit-transform: rotate(-45deg);
    }
    .bigBox-item-container::-webkit-scrollbar {
        display:none;
    }
}


/* ----- Als letzte Anweisung stehen lassen ----- */

@media (max-width: 768px){
  .hide-mobile {
    display: none;
  }
}

@media (min-width: 769px){
  .hide-desktop {
    display: none;
  }
}

.dnone{
	display: none;
}



/* ----- vorrbergehend ----- */

.perks{
	display: none;
}
.product-top-content {
    margin-bottom: 50px;
}





/*


2024
-----

>>> main styles ends here >>>

-----
2024

*/










/* Button Loading Animation */

.btnActive2023 span {
    opacity: 0;
}

.btnActive2023 a::after {
    content: "loading";
    font-size: 20px;
    position: absolute;
    left: calc(50% - 30px);
    top: calc(50% - 24px);
    color: white;
}
@media screen and (max-width: 760px){
  .btnActive2023 a::after {
    left: calc(50% - 36px);
    top: calc(50% - 10px);
    font-weight: normal;
    line-height: 1;
  }

  .anmeldung .btnGrp{
    display: flex;
    flex-direction: column-reverse;
    margin-bottom: 10px;
  }
  .anmeldung .ia91L{
    height: 35px;
    width: calc(100% - 30px) !important;
    margin: 5px 15px 16px 15px;
  }
  .anmeldung .ia91L a{
    color: grey;
  }
  .anmeldung .ia91M{
    display: none !important;
  }
  .anmeldung .ia91R{
    height: 35px;
    width: calc(100% - 30px) !important;
    margin: 5px 15px 16px 15px;
  }
  .warenkorbfooter .col-xs-4,
  .warenkorbfooter .col-xs-5,
  .warenkorbfooter .col-xs-6{
    width: 100%;
    padding: 0;
  }
}

.btnActive2023 a::before {
    content: "";
    position: absolute;
    width: 200px;
    height: 200px;
    left: -200px;
    top: -100px;
    background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 10%, rgba(255,255,255,48%) 53%, rgba(255,255,255,0) 90%, rgba(255,255,255,0) 100%);
    background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 10%,rgba(255,255,255,48%) 53%,rgba(255,255,255,0) 90%,rgba(255,255,255,0) 100%);
    background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 10%,rgb(255 255 255 / 48%) 53%,rgba(255,255,255,0) 90%,rgba(255,255,255,0) 100%);
    animation: loading 1.5s infinite alternate ease-in-out;
}

.btnActive2023 a{
    position: relative;
    overflow: hidden;
    box-shadow: none;
}

.btnActive2023{
    pointer-events: none;
}

@keyframes loading {
  from { transform: translatex(0) }
  to   { transform: translatex(400px) }
}

#TopShop,
#Sofort-Tuev,
#bestWeb{
  display:none !important;
}


.cssm_pad_70057 #pi111 h1{
  font-size: 24px !important;
}

iframe[name=google_conversion_frame]{
  height:0!important;
  width:0!important;
  line-height:0!important;
  font-size:0!important;
  margin-top:-13px;
  float:left
}


div#intelliSearchResult {
	position:absolute;
	z-index: 4001;
	margin: 30px 0 0;
	padding: 10px;
	border: none;
	display:none;
	visibility:hidden;
}



div#intelliSearchResult a:hover {
	text-decoration: underline;
}

/* ----- Search Bar Mobile ----- */

@media (max-width: 768px){
	.navbar-form{
		width: 100%;
		margin: 0;
		padding: 0;
	}
	.navbar-form > .input-group{
		display: flex;
		width: 100%;
		justify-content: center;
		align-items: center;
	}
	.navbar-form input{
		flex-grow: 1;
	}
	.navbar-form button{
		background: var(--color-main-dark);
		width: 60px;
		height: 60px;
		padding: 0;
		display: flex;
		justify-content: center;
		align-items: center;
		color: var(--color-main-light);
		border-radius: 50%;
		flex-shrink: 0;
		margin-left: -20px;
		z-index: 2;
	}
	div#intelliSearchResult {
		top: 60px;
		left: 20px;
		width: calc(100% - 40px);
		box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.1);
	}
}

/* ----- Neue Icons / Perks 12.12.2024 ----- */

/* ----- */
/* Bitte im CSS weit unten einfgen */
/* ----- */


:root{
  --color-main-action-light: #FFE755;
}

.perks{
  width: calc(100% + 40px);
  margin-left: -20px;
  display: block;
}
.perks h2{
  background: none !important;
  text-align: left !important;
}
.perks .container{
  background: none;
  width: 100%;
  padding: 20px 0;
}
.perks .slider{

}
.perks .slider-container{
  padding: 0 20px;
  scroll-padding-inline-start: 20px;
  align-items: stretch;
  margin-bottom: 20px;
}
.perks .slider-item{
  position: relative;
  padding: 40px 0 0 0;
  max-width: 80%;
  display: flex;
  flex-direction: column;
}
.perks-icon-container{
  position: absolute;
  width: 100px;
  height: 70px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  border: 1px solid;
  background:  #fff;
  top: 0;
}
.home .perks-icon-container{
  border-color: var(--color-home-area);
}
.water .perks-icon-container{
  border-color: var(--color-water-area);
}
.soil .perks-icon-container{
  border-color: var(--color-soil-area);
}
.asbestos .perks-icon-container{
  border-color: var(--color-asbestos-area);
}
.mould .perks-icon-container{
  border-color: var(--color-mould-area);
}
.perks-txt{
  padding: 40px 30px 30px;
  font-size: 13px;
  border-radius: 10px;
  flex: 1 0 0px;
}
.home .perks-txt{
  color: var(--color-home-area-txt);
  background: var(--color-home-area);
}
.water .perks-txt{
  color: var(--color-water-area-txt);
  background: var(--color-water-area);
}
.soil .perks-txt{
  color: var(--color-soil-area-txt);
  background: var(--color-soil-area);
}
.asbestos .perks-txt{
  color: var(--color-asbestos-area-txt);
  background: var(--color-asbestos-area);
}
.mould .perks-txt{
  color: var(--color-mould-area-txt);
  background: var(--color-mould-area);
}
.perks-txt b{
  color: var(--color-main-dark);
  font-size:  16px;
  font-weight: 700;
  display: block;
  line-height: 1.5;
  margin-bottom: 10px;
}
.perks-icon{
  width: 45px;
  height: 45px;
}
.perks-icon:has(svg){
  height: 50px;
  width: 90px;
}
.perks-icon img{
  width: 100%;
  height: auto;
}
.perks-icon svg{
  font-size: 50px;
  font-weight: 700;
  font-family: Arial, Helvetica, sans-serif;
  width: 70px;
  height: 54px;
}

.perks-icon text{
  fill: var(--color-main-action-light);
  stroke: var(--color-main-dark);
  stroke-width: 1px;
  stroke-linejoin: miter;
  text-anchor: middle;
  dominant-baseline: middle;
}
.perks .slider{
	background: inherit;
}
.perks .slider-item p{
	text-align:center;
}

@media (min-width:768px){
  .perks .slider-container {
    justify-content: space-between;
    gap: 60px;
  }
  .perks .slider-item {
    max-width: 100%;
    flex: 1 0 20%;
  }
}

.sr_checkout_confirmation .co4{
	display: none;
}