html {
    scroll-behavior: smooth;
}

.scrollbutton {width:40px; height:40px;}

h1.imbild {
    color: #fff;
    text-transform: uppercase;
    font-family: sans-serif;
    letter-spacing: 10px;
    line-height: 3;
    font-size: 20px;
    margin: 10px 0px 10px 0;
    width:518px;
    transition: all .35s ease-out;
}

h1.imbild:hover {
    color: #fff;
    letter-spacing: 15px;
    width:600px;
    transition: all .35s ease-out;
}

.bildpadding {padding:10px;}
::-webkit-scrollbar {height: 10px; width:0;  background-color:rgba(0,0,0,.05);}
::-webkit-scrollbar-track {height: auto; box-shadow: inset 0 0 5px rgba(0,0,0,.1); border-radius:4px;}
::-webkit-scrollbar-thumb {height:20px; background:rgba(0,0,0,.1);}
::-webkit-scrollbar-thumb:hover { background:rgba(0,0,0,.6);}

.plist133 #product_listing_kattexte h2 {letter-spacing: 2px;}
#slide2 .flex {max-width: 280px;}


#slide1 .container-flex-special {height:642px; background:url(/images/Badewanne.jpg) center center no-repeat; background-size:cover;align-items: end;}
@media screen and (max-width:1000px) {
#slide1 .container-flex-special {height:400px; background:url(/images/Badewanne_small.jpg) center center no-repeat; background-size:cover;align-items: end;}
}
@media screen and (max-width:700px) {
#slide1 .container-flex-special {height:300px;}
}
#slide1 .display {padding:0 10px;}
#slide1 .flex {text-align: left; margin-bottom: 50px; background:rgb(56 56 56)}

#slide2 {max-width: 1493px;margin:0 auto;position:relative; transition: all .3s ease-out;}
#slide2 .container-flex-special {align-items: unset; width:1880px; flex-wrap: nowrap; overflow-x:auto;}

#slide2 .display {max-width: 1482px; overflow-x: auto; margin:0; scroll-behavior: smooth; scroll-snap-type: x mandatory;}


#slide2 .flex {background: #646466; margin: 0 10px 20px; flex: 1 1 220px; text-align:center;}
#slide2 h4 {font-size: 1rem; margin-bottom: 0; background: #e0e0e0; line-height: 20px; padding: 17px 5px;}


.scroll_left {position:absolute; top:130px; left:50px; opacity: 0; transition: all .3s ease-out;}
.scroll_right {position:absolute; top:130px; right:50px; opacity: 0; transition: all .3s ease-out;}


#slide2:hover .scroll_left, #slide2:hover .scroll_right {opacity: 1; transition: all .3s ease-out;}
@media screen and (max-width:1490px) {
#slide2 .display {margin:0 20px;}
}
@media screen and (max-width:991px) {
#slide2 .display {margin:0 10px;}
h1.imbild {width: unset; padding: 0 27px; font-size: 16px; letter-spacing: 14px;}
#slide2 .container-flex-special {align-items: unset; width:1700px;}
#slide5 .flex {flex:1 1 185px;}
}




#slide3 {padding:10px 0 30px; color:#76726b;}
#slide3 .flex-item {padding:30px; text-align: justify;}
#slide3 .display {max-width: 1440px;}
#slide3 h2 {text-transform: uppercase; letter-spacing: 3px; font-size:14px;}



p.big {font-size: 26px;}
p.tel {font-size: 20px; margin-bottom: 0; margin-top: 30px;}

#slide4 .container-flex-special {height:642px; background:#646466 url(/images/Duschboard.jpg) center center no-repeat; background-size:cover; align-items: end;}
@media screen and (max-width:1000px) {
#slide4 .container-flex-special {height:400px; background:#646466 url(/images/Duschboard_small.jpg) center center no-repeat; background-size:cover; align-items: end;}
}
@media screen and (max-width:700px) {
#slide4 .container-flex-special {height:300px;}
}
#slide4 .display {padding:0 10px;}
#slide4 .flex {text-align: left; margin-bottom: 50px; background:rgb(56 56 56)}
#slide4 h1.imbild {letter-spacing: 6px; font-size:17px;}

#slide5 {max-width: 1493px;margin:0 auto;position:relative; transition: all .3s ease-out;}
#slide5 .container-flex-special {align-items: unset; width: 2653px; flex-wrap: nowrap;}
#slide5 .display {max-width: 1482px; overflow-x: auto; margin:0; scroll-behavior: smooth; scroll-snap-type: x mandatory;}
#slide5 .flex {background: #646466; margin: 0 10px 20px; flex: 1 1 220px; text-align:center;}
#slide5 h4 {font-size: 1rem; margin-bottom: 0; background: #e0e0e0; line-height: 20px; padding: 17px 5px;}
#slide5 :-webkit-scrollbar {height:2px; width:4px; border:1px solid #5d5d5d;}
#slide5:hover .scroll_left, #slide5:hover .scroll_right {opacity: 1; transition: all .3s ease-out;}
@media screen and (max-width:1490px) {
#slide5 .display {margin:0 20px;}
}
@media screen and (max-width:991px) {
#slide5 .display {margin:0 10px;}
h1.imbild {width: unset; padding: 0 27px; font-size: 16px; letter-spacing: 14px;}
#slide5 .container-flex-special {align-items: unset; width:2100px;}
#slide5 .flex {flex:1 1 185px;}
}

#slide6 {padding:10px 0 30px; color:#76726b;}
#slide6 .flex-item {padding:30px; text-align: justify;}
#slide6 .display {max-width: 1450px;}
#slide6 h2 {text-transform: uppercase; letter-spacing: 2px; font-size:14px;}



#slide7 .container-flex-special {height:642px; background:#646466 url(/images/duschabtrennungen.jpg) center center no-repeat; background-size:cover; align-items: end;}
@media screen and (max-width:1000px) {
#slide7 .container-flex-special {height:400px; background:#646466 url(/images/duschabtrennungen_small.jpg) center center no-repeat; background-size:cover; align-items: end;}
}
@media screen and (max-width:700px) {
#slide7 .container-flex-special {height:300px;}
}
#slide7 .display {padding:0 10px;}
#slide7 .flex {text-align: left; margin-bottom: 50px; background:rgb(56 56 56)}
#slide7 h1.imbild {letter-spacing: 6px; font-size:17px;}

#slide8 {max-width: 1493px;margin:0 auto;position:relative; transition: all .3s ease-out;}
#slide8 .container-flex-special {align-items: unset; width:1800px;}
#slide8 .display {max-width: 1482px; overflow-x: auto; margin:0; scroll-behavior: smooth; scroll-snap-type: x mandatory;}
#slide8 .flex {background: #646466; margin: 0 10px 20px; flex: 1 1 220px; text-align:center;}
#slide8 h4 {font-size: 1rem; margin-bottom: 0; background: #e0e0e0; line-height: 20px; padding: 17px 5px;}
#slide8 :-webkit-scrollbar {height:2px; width:4px; border:1px solid #5d5d5d;}
#slide8:hover .scroll_left, #slide8:hover .scroll_right {opacity: 1; transition: all .3s ease-out;}
@media screen and (max-width:1490px) {
#slide8 .display {margin:0 20px;}
}
@media screen and (max-width:991px) {
#slide8 .display {margin:0 10px;}
h1.imbild {width: unset; padding: 0 27px; font-size: 16px; letter-spacing: 14px;}
#slide8 .container-flex-special {align-items: unset; width:2100px; flex-wrap: nowrap;}
#slide8 .flex {flex:1 1 185px;}
}

#slide9 {padding:10px 0 30px; color:#76726b;}
#slide9 .flex-item {padding:30px; text-align: justify;}
#slide9 .display {max-width: 1440px;}
#slide9 h2 {text-transform: uppercase; letter-spacing: 3px; font-size:14px;}


#slide10 .container-flex-special {height:642px; background:#646466 url(/images/duschrueckwaende.jpg) center center no-repeat; background-size:cover; align-items: end;}
@media screen and (max-width:1000px) {
#slide10 .container-flex-special {height:400px; background:#646466 url(/images/duschrueckwaende_small.jpg) center center no-repeat; background-size:cover; align-items: end;}
}
@media screen and (max-width:700px) {
#slide10 .container-flex-special {height:300px;}
}
#slide10 .display {padding:0 10px;}
#slide10 .flex {text-align: left; margin-bottom: 50px; background:rgb(56 56 56)}
#slide10 h1.imbild {letter-spacing: 10px; font-size:17px;}

#slide11 {padding:50px 0 60px; color:#76726b;}
#slide11 .flex-item {padding:30px; text-align: justify;}
#slide11 .display {max-width: 1440px;}
#slide11 h2 {text-transform: uppercase; letter-spacing: 3px; font-size:14px;}

#slide12 {padding:50px 0;}
#slide12 .flex {text-align: center;}

#slide13 .container-flex-special {height:642px; background:#646466 url(/images/badmoebel.jpg) center center no-repeat; background-size:cover; align-items: end;margin-bottom: 100px;}
@media screen and (max-width:1000px) {
#slide13 .container-flex-special {height:400px; background:#646466 url(/images/badmoebel_small.jpg) center center no-repeat; background-size:cover; align-items: end;}
}
@media screen and (max-width:700px) {
#slide13 .container-flex-special {height:300px;}
}
#slide13 .display {padding:0 10px;}
#slide13 .flex {text-align: left; margin-bottom: 50px; background:rgb(56 56 56)}
#slide13 h1.imbild {letter-spacing: 10px; font-size:17px;}


#slide15 {padding:60px 0;}
#slide15 .highlights {letter-spacing: 10px; font-size: 17px; text-align: center; text-transform: uppercase; margin-bottom: 60px;}
#slide15 .flex {flex: 1 1 350px; max-width: 350px; margin: 5px; background:#f5f5f5;}
#slide15 .highlighttext {text-align: center; padding: 20px; text-transform: uppercase; letter-spacing: 2px; font-weight: 400;}
#slide15 span.normal {font-weight: 100; font-size: 12px;}


#slide16 {padding: 75px 50px 50px 50px; background: #f2f2f2; max-width: 1430px; margin: 0 auto 70px; line-height: 22px;}
#slide16 .highlights {letter-spacing: 4px; font-size: 24px; text-align: center; text-transform: uppercase; margin-bottom: 81px;line-height: 30px;}
#slide16 .img-fluid {max-width: 75px; height:auto;}
#slide16 h3 {font-size:1rem;}
#slide16 .container-flex-second {flex-wrap: nowrap;}
#slide16 .faq_icon {margin: 10px 20px; width: 80px;}
#slide16 .container-flex-second {margin-bottom: 30px;}
#slide16 .text {flex:1 1 465px; text-align: left;}
#slide16 .highlighttext {text-align: center; padding: 20px; text-transform: uppercase; letter-spacing: 2px; font-weight: 400;}
#slide16 .big {font-size:20px; line-height:32px; text-align: center; font-weight: 500; padding:30px 0;border-top:1px solid #ddd; color:#978f8a;}
#slide16 .big .container-flex-second { margin: 0 auto 0 0; margin-right: auto;}
@media screen and (max-width:700px) {
    #slide16 {padding: 50px 15px 20px 15px}
    #slide16 .container-flex-second {flex-wrap: wrap;}
    #slide16 .text {text-align: center;}
    #slide16 .highlights {margin-bottom: 20px; letter-spacing: 2px; font-size: 20px;}
}

#beratung {
    position: absolute; top: 164px; left: -195px; background:#646466; margin-bottom: 8px; width: 275px; height: 80px; transition: all 0.3s ease-in-out; text-align: center; color:#fff;  font-size: 18px;
    font-weight:500; display: flex; align-items: center; box-shadow: 6px 5px 10px rgba(0,0,0,.1); 
    & img {display: block; height: 60px; width: 60px;}
    & div:nth-child(1) {width:195px; height:80px; text-align: center; margin-left: 20px;    padding-top: 12px;}
    & div:nth-child(2) {height: 80px; width: 80px; padding: 10px;}
    & .animation_tel {animation-name: ring; animation-duration: 3s; animation-iteration-count: 5; animation-direction: linear; animation-delay: 2s;}
  }

@keyframes ring {
    0% {transform: rotateZ(0deg);}
    20% {transform: rotateZ(0deg);}
    22% {transform: rotateZ(18deg);}
    24% {transform: rotateZ(0deg);}
    26% {transform: rotateZ(18deg);}
    28% {transform: rotateZ(0deg);}
    100% {transform: rotateZ(0deg);}
}


span.bera {font-size: 25px; line-height: 31px;  text-transform: uppercase;  font-weight: 900;  letter-spacing: 3px; display: block;}
#beratung:hover {left:0px; transition: all 0.3s ease-in-out;}
@media screen and (max-width:1199px) {
    #beratung {display:none;}
}


#product_id_2114 #properties_selection_container .container-flex:nth-child(1) .flex:nth-child(1) {position:relative;}
#product_id_2114 #properties_selection_container .container-flex:nth-child(1) .flex:nth-child(1)::after {
    content:'(Infos unten)';
    position:absolute; 
    right: -90px;
    width:100px;
}