/* Intro */
.bg-responsive .bg-image-container-desktop { font-size: inherite }

#intro.eline.bg-image > .bg-image-container-desktop{ background-position: center bottom; } 

/* Produktnavigator */
.product-registration-list h2 { color: #1B2327 }
.product-registration.step-by-step div.product-registration-filter-bar > div {
  margin-right: 10px;
  margin-bottom: 10px;
}

div.product-registration.step-by-step button.product-registration-filter-tag-button {
  border: 1px solid #F60;
  height: auto;
  width: 230px;
  font-size: 20px;
  font-weight: normal;
  border-radius: 0;
  background-color: transparent;
}

/*
 * Allgemein 
 */
h1, .q4-2022 .sxOnePageTitle h1, .q4-2022  .h2-wie-h1 .sxOnePageTitle h2 { font-size: 54px; line-height: 60px; background: transparent;}
.q4-2022 h2, .q4-2022 .sxOnePageTitle h2, .q4-2022 .h3-wie-h2 .sxOnePageTitle h3 { font-size: 40px; line-height: 45px;}
.q4-2022 h3, .q4-2022 .sxOnePageTitle h3, .q4-2022 .h4-wie-h3 .sxOnePageTitle h4 { font-size: 26px; line-height: 30px;}
.q4-2022 *, .q4-2022 p , .q4-2022 .container .textFragment p {font-family: "Barlow", Helvetica, sans-serif;}
.q4-2022 p , .q4-2022 .container .textFragment p { font-size: 20px; line-height: 24px; font-family: "Barlow", Helvetica, sans-serif;}
.q4-2022 .eline-lasche .container .textFragment p {font-size: 14px;}
.q4-2022 h1, .fahne-blanko .container .textFragment p {font-family: "Source Serif Pro", "Times New Roman", serif;}
.q4-2022 .serifen-titel h2, .q4-2022 .serifen-titel h3 {font-family: "Source Serif Pro", "Times New Roman", serif;}
.q4-2022 h2-wie-h1, .q4-2022 .serifen-titel h3 {font-family: "Source Serif Pro", "Times New Roman", serif;}

.sxOpenMenu ul li a.defaultButtonColor:hover a i {
   padding-left: 16px;
}
sxOpenMenu > ul > li div.btn-ci-orange > a.defaultButtonColor:hover {
   padding-right: 10px
}
.q4-2022 #intro .sxOnePageTitle {margin: 0; padding:0;}
.q4-2022 .linie-orange {border-bottom: 1px solid #ff6600;}

.q4-2022 .fahne-blanko.bg-image {position: absolute; right: 8%; z-index: 5;}
.q4-2022 .fahne-blanko.bg-image > .bg-image-container-desktop {position: relative; width: 132px; height: 161px;}
.q4-2022 .fahne-blanko.bg-image .sxModule {
  position:absolute; 
  top: 46%; 
  left: 50%; 
  transform: translate(-50%, -50%);
  text-align: center; 
  width: 140px; 
  color: #fff;
}

.hintergrund-fond-beige, .hintergrund-fond-beige > .defaultBackground, .hintergrund-fond-beige h1, .hintergrund-fond-beige h2, .hintergrund-fond-beige h3, .hintergrund-fond-beige h4, .hintergrund-fond-beige h5, .hintergrund-fond-beige h6 { background: #EAE3D5 !important;}
.hintergrund-typo-beige, .hintergrund-typo-beige > .defaultBackground, .hintergrund-typo-beige h1, .hintergrund-typo-beige h2, .hintergrund-typo-beige h3, .hintergrund-typo-beige h4, .hintergrund-typo-beige h5, .hintergrund-typo-beige h6 { background: #D6CDBB !important;}
.hintergrund-fond-blauschwarz, .hintergrund-fond-blauschwarz > .defaultBackground, .hintergrund-fond-blauschwarz > h1, .hintergrund-fond-blauschwarz > h2, .hintergrund-fond-blauschwarz > h3, .hintergrund-fond-blauschwarz > h4, .hintergrund-fond-blauschwarz > h5, .hintergrund-fond-blauschwarz > h6 { background: #3A525E;}
.hintergrund-typo-blauschwarz, .hintergrund-typo-blauschwarz > .defaultBackground, .hintergrund-typo-blauschwarz > h1, .hintergrund-typo-blauschwarz > h2, .hintergrund-typo-blauschwarz > h3, .hintergrund-typo-blauschwarz > h4, .hintergrund-typo-blauschwarz > h5, .hintergrund-typo-blauschwarz > h6 { background: #1B2327;}

 /*
  * Text-Farben
  */
.text-fond-beige, .text-fond-beige p, .text-fond-beige h1, .text-fond-beige h2, .text-fond-beige h3, .text-fond-beige h4, .text-fond-beige h5, .text-fond-beige h6 { color: #EAE3D5 !important; }
.text-typo-blauschwarz, .text-fond-blauschwarz p, .text-typo-blauschwarz h1, .text-typo-blauschwarz h2, .text-typo-blauschwarz h3, .text-typo-blauschwarz h4, .text-typo-blauschwarz h5, .text-typo-blauschwarz h6 { color: #D6CDBB !important; }
.text-fond-beige, .text-fond-beige p, .text-fond-beige h1, .text-fond-beige h2, .text-fond-beige h3, .text-fond-beige h4, .text-fond-beige h5, .text-fond-beige h6 { color: #3A525E !important; }
.text-typo-blauschwarz, .text-fond-blauschwarz p, .text-typo-blauschwarz h1, .text-typo-blauschwarz h2, .text-typo-blauschwarz h3, .text-typo-blauschwarz h4, .text-typo-blauschwarz h5, .text-typo-blauschwarz h6 { color: #1B2327 !important; }

 /*
  * Buttons
  */
.q4-2022 .horizontale-buttons ul {display: flex;}
.q4-2022 .horizontale-buttons ul li {width: auto; margin-right: 24px;}
.q4-2022 .horizontale-buttons ul li a {min-width: auto; padding:15px 15px;}

 /*
  * Slider-Pfeile
  */
.q4-2022 .quote-slider.sxModuleMainSlider .owl-nav .owl-prev, .quote-slider.sxModuleMainSlider .owl-nav .owl-prev, .quote-slider.sxModuleMainSlider .owl-nav .owl-next {width: 25px; height: 50px;}
.q4-2022 .quote-slider.sxModuleMainSlider .owl-nav .owl-prev {
  background: url(/__STATIC__/themen/rehm-eline/rehm-eline-q4-2022/icons/self/hjr-icn-arrow-left.png) no-repeat;
  background-position: center;
  background-size: cover;
  margin-top: -100px;
  height: 80px;
  width:40px;
}

.q4-2022 .quote-slider.sxModuleMainSlider .owl-nav .owl-next {
  background: url('/__STATIC__/themen/rehm-eline/rehm-eline-q4-2022/icons/self/hjr-icn-arrow-right.png') no-repeat;
  background-position: center;
  background-size: cover;
  margin-top: -100px;
  height: 80px;
  width:40px;
}

.sxSideContact a,.sxSideContactOpen {
    color: #1B2327 !important

}
.sxSideContactOpen .sxclose {
    background: #1B2327 !important

}
.sxSideContactOpen {
    background: #D6CDBB !important

}

.q4-2022 ~ .sxSideContact a img {background: #1B2327;}
.q4-2022 ~ .sxSideContact a {background: #fff; border: 1px solid #1B2327; border-radius: 0px;}
.q4-2022 ~ .sxSideContact a span {color: #ff6600 !important;}

.q4-2022 .bg-image .breite-drittel {position: relative;}

.q4-2022 .eline2020-3Box-img-size .border {border: 1px solid #ff6600; padding: 15px 15px 0 15px;}
.q4-2022 .eline2020-3Box-img-size .sxOpenMenu ul {margin: 0;}
.q4-2022 .eline2020-3Box-img-size .sxOpenMenu ul li {margin: 0; line-height: initial; height: auto; width: 100%;}

.q4-2022 .eline2020-3Box-img-size div.bild-mitte {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 170px;
}
.q4-2022 .eline2020-3Box-img-size div.bild-mitte.icon-webinar-eline img {width: 135px; height: 150px;}
.q4-2022 .eline2020-3Box-img-size div.bild-mitte.icon-e-zuhause img {width: 120px; height: 130px;}
.q4-2022 .eline2020-3Box-img-size div.bild-mitte.icon-loseblattwerk img {width: 125px; height: 105px;}

.q4-2022 #vorteilboxen .box {height: 100px !important; padding-bottom: 15px !important;}
.q4-2022 #vorteilboxen .textFragment p {padding-bottom: unset; margin-bottom: unset;}
.q4-2022 #vorteilboxen .border {border: 1px solid #ff6600; padding: 15px 15px 0 15px;}
.q4-2022 #vorteilboxen .vorteilbox .textFragment {padding:0 !important;}


.q4-2022 .product-registration.step-by-step .product-registration-filter-reset {background-color: #ff6600;}
.q4-2022 .product-registration.step-by-step .product-registration-filter-back {color: #1B2327;}
.q4-2022 .product-registration.step-by-step .product-registration-filter-bar {margin-right: unset;}

.sxOpenMenu ul li a div{font-weight: 200;}

.form-horizontal .form-group label.control-label { padding: 0 0 4px 3px;}

/*
 * Media-Queries
 */

@media (max-width: 1170px) {
 .q4-2022 .desktop-element{display:none;}
 .q4-2022 .fahne-blanko.bg-image {display: none;}
 .q4-2022 .sxOpenMenu ul li {width: auto;}

 .q4-2022 #vorteilboxen .box {height: 83px !important;}
 .q4-2022 .eline2020-3Box-img-size .border {margin-bottom: 50px;}
 .q4-2022 #intro, .q4-2022 #intro h1, .q4-2022 #intro h2, .q4-2022 #intro h3 {color: white !important;}

}
@media (min-width: 1170px) {
 .q4-2022 .eline-lasche {display: none;}
 .q4-2022 .horizontale-buttons ul li {margin-right: auto;}
 .q4-2022 .freigestelltes-bild .sxModule {display: flex;}
 .q4-2022 .freigestelltes-bild .sxModule .freigestelltes-bildelement {position: absolute; right:0;}
 .q4-2022 .freigestelltes-bild .sxModule .freigestelltes-bildelement.bottom {bottom:0;}
 .q4-2022 .freigestelltes-bild .sxModule .freigestelltes-bildelement:not(.kompass) img {height: 100%; max-width: none;}
 .q4-2022 .freigestelltes-bild .sxModule .freigestelltes-bildelement.kompass {right:45px; width: 100%;}
}

@media (min-width: 768px) {
 .q4-2022 .hintergrund-abrundung {border-bottom-right-radius: 25% 44%;}
 .q4-2022 .rehm-eline-icon-orange {float: left;}
}

@media (max-width: 768px) {
 .q4-2022 .sxOnePageTitle h1, .q4-2022 .h2-wie-h1 .sxOnePageTitle h2 {font-size: 27px; line-height: 32px; padding-bottom: 15px;}
 .q4-2022 .sxOnePageTitle h2, .q4-2022 .h3-wie-h2 .sxOnePageTitle h3 {font-size: 24px; line-height: 29px;}
 .q4-2022 .sxOnePageTitle h3, .q4-2022 .h4-wie-h3 .sxOnePageTitle h4 {font-size: 22px; line-height: 26px;}
 .q4-2022 .container .textFragment {padding: 0;}

 .q4-2022 .product-registration.step-by-step .product-registration-filter-bar {text-align: center;}
 .q4-2022 .product-registration.step-by-step .product-registration-filter-bar h3 {text-align: left;}

 .q4-2022 .horizontale-buttons ul {flex-direction: column; align-items: flex-start;}
 .q4-2022 .hintergrund-abrundung {clip-path: ellipse(250% 100% at 20% 0%);}
 .q4-2022 #intro {clip-path: unset !important;}

 .q4-2022 .eline-lasche .container .textFragment {padding: 0;}
 .q4-2022 .rehm-eline-icon-orange ~ div .button-orange {text-align: left;}

 .sxOpenMenu ul li {
    margin-bottom: 3px;
    height: 55px;
    line-height: 50px;
 }
 .q4-2022 .horizontale-buttons ul li a { padding: 10px 15px; }
}