@charset "UTF-8";

/* Load Spinner Home */
#loadSpinnerHomePage {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgb(255,255,255);
  display: flex;
  z-index: 1000;
  justify-content: center;
  align-items: center;
}

.lds-Spinner {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}

.lds-Spinner div {
  animation: lds-Spinner 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  transform-origin: 40px 40px;
}

.lds-Spinner div:after {
  content: " ";
  display: block;
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #04cef4;
  margin: -4px 0 0 -4px;
}

.lds-Spinner div:nth-child(1) {
  animation-delay: -0.036s;
}

.lds-Spinner div:nth-child(1):after {
  top: 63px;
  left: 63px;
}

.lds-Spinner div:nth-child(2) {
  animation-delay: -0.072s;
}

.lds-Spinner div:nth-child(2):after {
  top: 68px;
  left: 56px;
}

.lds-Spinner div:nth-child(3) {
  animation-delay: -0.108s;
}

.lds-Spinner div:nth-child(3):after {
  top: 71px;
  left: 48px;
}

.lds-Spinner div:nth-child(4) {
  animation-delay: -0.144s;
}

.lds-Spinner div:nth-child(4):after {
  top: 72px;
  left: 40px;
}

.lds-Spinner div:nth-child(5) {
  animation-delay: -0.18s;
}

.lds-Spinner div:nth-child(5):after {
  top: 71px;
  left: 32px;
}

.lds-Spinner div:nth-child(6) {
  animation-delay: -0.216s;
}

.lds-Spinner div:nth-child(6):after {
  top: 68px;
  left: 24px;
}

.lds-Spinner div:nth-child(7) {
  animation-delay: -0.252s;
}

.lds-Spinner div:nth-child(7):after {
  top: 63px;
  left: 17px;
}

.lds-Spinner div:nth-child(8) {
  animation-delay: -0.288s;
}

.lds-Spinner div:nth-child(8):after {
  top: 56px;
  left: 12px;
}

@keyframes lds-Spinner {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

/* Imperssum, agb und privacy */
.datenschutz .tile .inside .content .tile-text, .impressum .tile .inside .content .tile-text{
  margin-top: 100px;
  hyphens: auto;
}
@media(width <= 768px){
  .datenschutz .tile .inside .content .tile-text, .impressum .tile .inside .content .tile-text{
     padding: 0px 30px;
  }
}
.agb .tile.center .inside .content .tile-text{
  padding-left: 20px !important;
}
@media(width >= 1300px){
  .agb #container .tile.center.tile--4.noimage > .inside > .content{
    padding-left: 10px;
  }
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin: 0;
}

h2,
.h2,
h2 a,
h2 a.hover-underline-animation,
.readmorelink h2 a {
  font-family: "Conneqt";
  color: var(--sabo-lightblue);
  font-size: 35px;
  line-height: 38px;
  margin-bottom: 20px;
}
@media (min-width: 1024px) {
  h2,
.h2,
h2 a,
h2 a.hover-underline-animation,
.readmorelink h2 a {
    font-size: 40px;
    line-height: 43px;
    margin-bottom: 25px;
  }
}
@media (min-width: 1300px) {
  h2,
.h2,
h2 a,
h2 a.hover-underline-animation,
.readmorelink h2 a {
    font-size: 60px;
    line-height: 63px;
    margin-bottom: 30px;
  }
}
@media (min-width: 1300px) {
  .flexswipe h2,
.flexswipe .h2,
.flexswipe h2 a,
.flexswipe h2 a.hover-underline-animation,
.flexswipe .readmorelink h2 a {
    font-size: 40px;
    line-height: 43px;
    margin-bottom: 25px;
  }
}
.flex-d--50 h2,
.flex-d--50 .h2,
.flex-d--50 h2 a,
.flex-d--50 h2 a.hover-underline-animation,
.flex-d--50 .readmorelink h2 a {
  margin-bottom: 15px;
}
@media (min-width: 1024px) {
  .flex-d--50 h2,
.flex-d--50 .h2,
.flex-d--50 h2 a,
.flex-d--50 h2 a.hover-underline-animation,
.flex-d--50 .readmorelink h2 a {
    margin-bottom: 15px;
  }
}
@media (min-width: 1300px) {
  .flex-d--50 h2,
.flex-d--50 .h2,
.flex-d--50 h2 a,
.flex-d--50 h2 a.hover-underline-animation,
.flex-d--50 .readmorelink h2 a {
    margin-bottom: 20px;
  }
}
.ce_sliderStart > h2,
.ce_sliderStart > .h2,
.ce_sliderStart > h2 a,
.ce_sliderStart > h2 a.hover-underline-animation,
.ce_sliderStart > .readmorelink h2 a {
  text-align: center;
  margin: 0 auto;
  padding-bottom: 130px;
  hyphens: auto;
  -webkit-hyphens: auto;
}
@media (min-width: 1024px) {
  .ce_sliderStart > h2,
.ce_sliderStart > .h2,
.ce_sliderStart > h2 a,
.ce_sliderStart > h2 a.hover-underline-animation,
.ce_sliderStart > .readmorelink h2 a {
    width: 60%;
    padding-bottom: 110px;
  }
}

.readmorelink h2 {
  margin-bottom: -25px !important;
}
@media (min-width: 1300px) {
  .readmorelink h2 {
    margin-bottom: -15px !important;
  }
}

.readmorelink h2 a {
  position: static;
  line-height: 1;
  transform: translateX(-50px);
}

h3 {
  font-family: "Conneqt";
  font-size: 35px;
  line-height: 1;
}

p,
li {
  color: var(--sabo-darkgrey);
  font-size: 16px;
  line-height: 20px;
  margin-bottom: 10px;
}
@media (min-width: 1024px) {
  p,
li {
    font-size: 18px;
    line-height: 23px;
    margin-bottom: 15px;
  }
}
@media (min-width: 1300px) {
  p,
li {
    font-size: 20px;
    line-height: 26px;
    margin-bottom: 20px;
  }
}

.flex-d--50 p {
  font-size: 16px;
  line-height: 22px;
  margin-bottom: 30px;
}
@media (min-width: 500px) {
  .flex-d--50 p {
    font-size: 16px;
    line-height: 22px;
    margin-bottom: 30px;
  }
}
@media (min-width: 1300px) {
  .flex-d--50 p {
    font-size: 20px;
    line-height: 26px;
    margin-bottom: 30px;
  }
}
footer p {
  font-size: 16px;
  line-height: 20px;
}
@media (min-width: 1280px) {
  footer p {
    font-size: 20px;
    line-height: 26px;
  }
}

@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-Light.eot");
  src: local("Zilla Slab Light"), local("ZillaSlab-Light"), url("/files/assets/fonts/ZillaSlab-Light.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-Light.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-Light.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-Light.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-Light.svg#ZillaSlab-Light") format("svg");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-Bold.eot");
  src: local("Zilla Slab Bold"), local("ZillaSlab-Bold"), url("/files/assets/fonts/ZillaSlab-Bold.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-Bold.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-Bold.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-Bold.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-Bold.svg#ZillaSlab-Bold") format("svg");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-BoldItalic.eot");
  src: local("Zilla Slab Bold Italic"), local("ZillaSlab-BoldItalic"), url("/files/assets/fonts/ZillaSlab-BoldItalic.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-BoldItalic.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-BoldItalic.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-BoldItalic.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-BoldItalic.svg#ZillaSlab-BoldItalic") format("svg");
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-SemiBold.eot");
  src: local("Zilla Slab SemiBold"), local("ZillaSlab-SemiBold"), url("/files/assets/fonts/ZillaSlab-SemiBold.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-SemiBold.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-SemiBold.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-SemiBold.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-SemiBold.svg#ZillaSlab-SemiBold") format("svg");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-Medium.eot");
  src: local("Zilla Slab Medium"), local("ZillaSlab-Medium"), url("/files/assets/fonts/ZillaSlab-Medium.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-Medium.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-Medium.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-Medium.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-Medium.svg#ZillaSlab-Medium") format("svg");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-Regular.eot");
  src: local("Zilla Slab"), local("ZillaSlab-Regular"), url("/files/assets/fonts/ZillaSlab-Regular.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-Regular.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-Regular.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-Regular.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-Regular.svg#ZillaSlab-Regular") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-LightItalic.eot");
  src: local("Zilla Slab Light Italic"), local("ZillaSlab-LightItalic"), url("/files/assets/fonts/ZillaSlab-LightItalic.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-LightItalic.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-LightItalic.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-LightItalic.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-LightItalic.svg#ZillaSlab-LightItalic") format("svg");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-SemiBoldItalic.eot");
  src: local("Zilla Slab SemiBold Italic"), local("ZillaSlab-SemiBoldItalic"), url("/files/assets/fonts/ZillaSlab-SemiBoldItalic.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-SemiBoldItalic.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-SemiBoldItalic.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-SemiBoldItalic.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-SemiBoldItalic.svg#ZillaSlab-SemiBoldItalic") format("svg");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-Italic.eot");
  src: local("Zilla Slab Italic"), local("ZillaSlab-Italic"), url("/files/assets/fonts/ZillaSlab-Italic.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-Italic.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-Italic.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-Italic.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-Italic.svg#ZillaSlab-Italic") format("svg");
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-MediumItalic.eot");
  src: local("Zilla Slab Medium Italic"), local("ZillaSlab-MediumItalic"), url("/files/assets/fonts/ZillaSlab-MediumItalic.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-MediumItalic.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-MediumItalic.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-MediumItalic.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-MediumItalic.svg#ZillaSlab-MediumItalic") format("svg");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-Italic_1.eot");
  src: local("Zilla Slab Italic"), local("ZillaSlab-Italic"), url("/files/assets/fonts/ZillaSlab-Italic_1.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-Italic_1.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-Italic_1.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-Italic_1.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-Italic_1.svg#ZillaSlab-Italic") format("svg");
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-SemiBold_1.eot");
  src: local("Zilla Slab SemiBold"), local("ZillaSlab-SemiBold"), url("/files/assets/fonts/ZillaSlab-SemiBold_1.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-SemiBold_1.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-SemiBold_1.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-SemiBold_1.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-SemiBold_1.svg#ZillaSlab-SemiBold") format("svg");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-Light_1.eot");
  src: local("Zilla Slab Light"), local("ZillaSlab-Light"), url("/files/assets/fonts/ZillaSlab-Light_1.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-Light_1.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-Light_1.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-Light_1.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-Light_1.svg#ZillaSlab-Light") format("svg");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-SemiBoldItalic_1.eot");
  src: local("Zilla Slab SemiBold Italic"), local("ZillaSlab-SemiBoldItalic"), url("/files/assets/fonts/ZillaSlab-SemiBoldItalic_1.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-SemiBoldItalic_1.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-SemiBoldItalic_1.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-SemiBoldItalic_1.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-SemiBoldItalic_1.svg#ZillaSlab-SemiBoldItalic") format("svg");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-Bold_1.eot");
  src: local("Zilla Slab Bold"), local("ZillaSlab-Bold"), url("/files/assets/fonts/ZillaSlab-Bold_1.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-Bold_1.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-Bold_1.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-Bold_1.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-Bold_1.svg#ZillaSlab-Bold") format("svg");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-BoldItalic_1.eot");
  src: local("Zilla Slab Bold Italic"), local("ZillaSlab-BoldItalic"), url("/files/assets/fonts/ZillaSlab-BoldItalic_1.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-BoldItalic_1.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-BoldItalic_1.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-BoldItalic_1.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-BoldItalic_1.svg#ZillaSlab-BoldItalic") format("svg");
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-MediumItalic_1.eot");
  src: local("Zilla Slab Medium Italic"), local("ZillaSlab-MediumItalic"), url("/files/assets/fonts/ZillaSlab-MediumItalic_1.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-MediumItalic_1.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-MediumItalic_1.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-MediumItalic_1.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-MediumItalic_1.svg#ZillaSlab-MediumItalic") format("svg");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-Medium_1.eot");
  src: local("Zilla Slab Medium"), local("ZillaSlab-Medium"), url("/files/assets/fonts/ZillaSlab-Medium_1.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-Medium_1.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-Medium_1.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-Medium_1.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-Medium_1.svg#ZillaSlab-Medium") format("svg");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-LightItalic_1.eot");
  src: local("Zilla Slab Light Italic"), local("ZillaSlab-LightItalic"), url("/files/assets/fonts/ZillaSlab-LightItalic_1.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-LightItalic_1.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-LightItalic_1.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-LightItalic_1.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-LightItalic_1.svg#ZillaSlab-LightItalic") format("svg");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab";
  src: url("/files/assets/fonts/ZillaSlab-Regular_1.eot");
  src: local("Zilla Slab"), local("ZillaSlab-Regular"), url("/files/assets/fonts/ZillaSlab-Regular_1.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ZillaSlab-Regular_1.woff2") format("woff2"), url("/files/assets/fonts/ZillaSlab-Regular_1.woff") format("woff"), url("/files/assets/fonts/ZillaSlab-Regular_1.ttf") format("truetype"), url("/files/assets/fonts/ZillaSlab-Regular_1.svg#ZillaSlab-Regular") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Conneqt";
  src: url("/files/assets/fonts/ConneqtBold.eot");
  src: local("Conneqt Bold"), local("ConneqtBold"), url("/files/assets/fonts/ConneqtBold.eot?#iefix") format("embedded-opentype"), url("/files/assets/fonts/ConneqtBold.woff2") format("woff2"), url("/files/assets/fonts/ConneqtBold.woff") format("woff"), url("/files/assets/fonts/ConneqtBold.ttf") format("truetype"), url("/files/assets/fonts/ConneqtBold.svg#ConneqtBold") format("svg");
  font-weight: 100 1000;
  font-style: normal;
  font-display: swap;
}
:root {
  --sabo-black: #151B21;
  --sabo-orange: #FF6200;
  --sabo-red: #E60047;
  --sabo-lightblue: #04CEF4;
  --sabo-darkblue: #1E6CA0;
  --sabo-lightgrey: #EEEEEE;
  --sabo-lightgrey-table: #F0F0F0;
  --sabo-lightgrey-bg: #FAFAFA;
  --sabo-white: #FFF;
  --sabo-grey: #F3F4F4;
  --sabo-grey-ligthen: #F9F9F9;
  --sabo-label-grey: #AFB6BD;
  --sabo-pagination-grey: #A1A7AD;
  --sabo-label-blue: #1E6CA0;
  --sabo-darkgrey: #25303B;
  --gradient-one: transparent linear-gradient(22deg, #EBEBEB 0%, #AFB6BD 100%) 0% 0% no-repeat padding-box;
  --gradient-one: transparent linear-gradient(22deg, #00DBFF 0%, #00BDEA 100%) 0% 0% no-repeat padding-box;
  --gradient-three: transparent linear-gradient(22deg, #1D86CC 0%, #1E6CA0 100%) 0% 0% no-repeat padding-box;
  --gradient-four: transparent linear-gradient(22deg, #FF8F4A 0%, #F55E00 100%) 0% 0% no-repeat padding-box;
  --gradient-five: transparent linear-gradient(22deg, #1E6CA0 0%, #00DBFF 100%) 0% 0% no-repeat padding-box;
  --gradient-six: transparent linear-gradient(22deg, #F55E00 0%, #FF8F4A 100%) 0% 0% no-repeat padding-box;
  --gradient-one: transparent linear-gradient(22deg, #151B21 0%, #25303B 100%) 0% 0% no-repeat padding-box;
  --gradient-one: transparent linear-gradient(22deg, #FF842B 0%, #1E6CA0 100%) 0% 0% no-repeat padding-box;
  --gradient-one: transparent linear-gradient(22deg, #FF8F4A 0%, #1E6CA0 100%) 0% 0% no-repeat padding-box;
  --gradient-one: transparent linear-gradient(22deg, #E60047 0%, #F55E00 100%) 0% 0% no-repeat padding-box;
  --gradient-one: transparent linear-gradient(22deg, #00D895 0%, #1E6CA0 100%) 0% 0% no-repeat padding-box;
  --gradient-one: transparent linear-gradient(22deg, #00DBFF 0%, #1E6CA0 100%) 0% 0% no-repeat padding-box;
  --gradient-one: transparent linear-gradient(22deg, #00D895 0%, #1E6CA0 100%) 0% 0% no-repeat padding-box;
  --gradient-one: transparent linear-gradient(22deg, #00D895 0%, #1E6CA0 100%) 0% 0% no-repeat padding-box;
  --gradient-one: transparent linear-gradient(22deg, #FF8F4A 0%, #F55E00 100%) 0% 0% no-repeat padding-box;
  --responsive-margin-bottom: 400px;
  --responsive-padding: 60px;
  --responsive-inner-padding: 20px;
  --box-shadow: 0px 20px 30px 0 rgb(0 0 0 / 7%);
  --resonsive-max-width: 100vw;
  --responsive-margin-bottom: 300px;
  --responsive-margin-bottom: 70px;
  --responsive-inner-padding: 40px;
  --responsive-padding: 60px;
  --resonsive-max-width: calc(100vw);
  --responsive-margin-bottom: 200px;
}

@media (min-width: 769px) {
  :root {
    --responsive-margin-bottom: 70px;
    --responsive-inner-padding: 40px;
    --responsive-padding: 0px;
    --resonsive-max-width: calc(100vw);
    --responsive-margin-bottom: 300px;
  }
}
@media (min-width: 820px) {
  :root {
    --responsive-margin-bottom: 70px;
    --responsive-inner-padding: 40px;
    --responsive-padding: 60px;
    --resonsive-max-width: calc(100vw);
    --responsive-margin-bottom: 300px;
  }
}
@media (min-width: 1024px) {
  :root {
    --responsive-margin-bottom: 70px;
    --responsive-inner-padding: 40px;
    --responsive-padding: 60px;
    --resonsive-max-width: calc(100vw - 64px);
    --responsive-margin-bottom: 300px;
  }
}
@media (min-width: 1580px) {
  :root {
    --responsive-margin-bottom: 70px;
    --responsive-inner-padding: 40px;
    --responsive-padding: 80px;
    --resonsive-max-width: 1580px;
    --responsive-margin-bottom: 400px;
  }
}
img {
  max-width: 100%;
  height: auto;
  position: relative;
}

a {
  cursor: pointer;
}

*:not([class^=ce_]) ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

body {
  margin: 0;
}

* {
  outline: 0;
  box-sizing: border-box;
}

fieldset {
  border: 0;
}

.mod_navigation {
  display: block;
  position: relative;
}
.mod_navigation form fieldset {
  margin-bottom: -20px;
}
.mod_navigation > .inside {
  background-color: var(--sabo-white);
}
.mod_navigation > .inside > .mod_navigation {
  width: 60px;
  position: fixed;
  right: 0px;
  z-index: 100;
}
@media (min-width: 820px) {
  .mod_navigation > .inside > .mod_navigation {
    right: -60px;
    position: absolute;
  }
}
.mod_navigation > .inside > .mod_navigation ul {
  margin-bottom: 0px;
  display: flex;
  flex-direction: column;
  flex-basis: 60px;
  row-gap: 20px;
  position: fixed;
  width: 60px;
}
.mod_navigation > .inside > .mod_navigation ul li {
  background-color: rgba(238, 238, 238, 0.8);
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.mod_navigation > .inside > .mod_navigation ul li svg {
  width: 22.5px;
  height: 24px;
  opacity: 1;
  transition: opacity 0.5s ease-in-out;
}
body.quicksearch-open .mod_navigation .quicksearch svg{
  opacity: 0 !important;
  width: 0px !important;
  height: 0px !important;
}
body.quicksearch-open .mod_navigation .quicksearch svg{
  opacity: 0 !important;
  width: 0px !important;
  height: 0px !important;
}
.mod_navigation > .inside > .mod_navigation ul li:hover {
  background-color: var(--sabo-orange);
  cursor: pointer;
}
.mod_navigation > .inside > .mod_navigation ul li:hover .hamburger #hamburger ~ span, body.quicksearch-open .mod_navigation > .inside > .mod_navigation ul li:hover .quicksearch-close #quicksearch-close-input ~ span {
  background-color: var(--sabo-white);
}
.mod_navigation > .inside > .mod_navigation ul li:hover path {
  fill: var(--sabo-white) !important;
}
.mod_navigation > .inside > .mod_navigation .hamburger, body.quicksearch-open .mod_navigation > .inside > .mod_navigation .quicksearch-close{
  width: 25px;
  height: 25px;
  pointer-events: none;
}
.mod_navigation > .inside > .mod_navigation .hamburger #hamburger ~ span, body.quicksearch-open .mod_navigation > .inside > .mod_navigation .quicksearch-close #quicksearch-close-input ~ span {
  display: block;
  width: 100%;
  background-color: var(--sabo-orange);
  height: 3px;
  margin: 5px 0;
  pointer-events: none;
  transition: 0.5s transform ease-in-out, 0.5s opacity ease-in-out;
}
.mod_navigation > .inside > .mod_navigation .hamburger #hamburger ~ span:nth-child(2), body.quicksearch-open .mod_navigation > .inside > .mod_navigation .quicksearch-close #quicksearch-close-input ~ span:nth-child(2){
  margin-top: 0;
}
.mod_navigation > .inside > .mod_navigation .hamburger #hamburger ~ span:nth-child(4) {
  margin-bottom: 0;
}
.mod_navigation > .inside > .mod_navigation ~ ul.level_1 {
  display: flex;
  opacity: 0;
  gap: 60px;
  justify-content: flex-end;
  right: 53px;
  position: relative;
  top: 10px;
  padding: 15px;
}
@media (min-width: 1024px) {
  .mod_navigation > .inside > .mod_navigation ~ ul.level_1 {
    opacity: 1;
    width: 100%;
  }
}
.mod_navigation > .inside > .mod_navigation ~ ul.level_1 li {
  padding-bottom: 6px;
  margin-bottom: 0;
}
.mod_navigation > .inside > .mod_navigation ~ ul.level_1 li a {
  font-weight: 600;
}
.mod_navigation > .inside > .mod_navigation ~ ul.level_1 li:hover > a:after,
.mod_navigation > .inside > .mod_navigation ~ ul.level_1 li.active > a:after {
  transform: scaleX(1);
  width: 100%;
}
.mod_navigation > .inside > .mod_navigation ~ ul.level_1 li {
  padding: 0;
  padding-bottom: 3px;
}
.mod_navigation > .inside > .mod_navigation ~ ul.level_1 li > strong {
  font-weight: normal;
  color: inherit;
  width: 100%;
}
.mod_navigation > .inside > .mod_navigation ~ ul.level_1 li a:visited, .mod_navigation > .inside > .mod_navigation ~ ul.level_1 li a:link, .mod_navigation > .inside > .mod_navigation ~ ul.level_1 li a:active {
  color: inherit;
  width: 100%;
  width: auto;
}
.mod_navigation .bookmarks a {
  margin-top: 5px;
  width: 100%;
  display: flex;
  height: 100%;
  justify-content: center;
  align-items: center;
}
.mod_navigation .logo {
  position: absolute;
  z-index: 124;
  left: calc(50% - 79px);
  right: calc(50% - 79px);
  top: 15px;
  text-align: center;
}
body.nav-open .mod_navigation .logo, body.js-has-login-active .mod_navigation .logo {
  z-index: 111;
  top: 15px;
}
body.nav-open .mod_navigation .logo svg path.cls-1, body.js-has-login-active .mod_navigation .logo svg path.cls-1 {
  display: none;
}
@media (min-width: 1024px) {
  .mod_navigation .logo {
    top: 20px;
  }
  body.startseite .mod_navigation .logo, body.qs .mod_navigation .logo {
    top: 30px !important;
  }
}
@media (min-width: 1024px) and (min-width: 1300px) {
  body.nav-open .mod_navigation .logo {
    top: 20px;
    z-index: 111;
  }
}
.mod_navigation .logo svg {
  height: 35px;
}
@media (min-width: 1580px) {
  body.startseite .mod_navigation .logo svg, body.qs .mod_navigation .logo svg {
    height: 55px;
  }
}
.mod_navigation > .inside > .overlay {
  display: block;
  position: fixed;
  top: -100vh;
  overflow: hidden;
  overflow-y: scroll;
  height: 100vh;
  z-index: 100;
  background: var(--sabo-lightgrey-bg);
  background: var(--sabo-lightgrey-bg) linear-gradient(180deg, var(--sabo-lightgrey-bg) 0%, var(--sabo-lightgrey-bg) 100%) 0% 0% no-repeat padding-box;
  width: 100%;
  left: 0;
  right: 0;
  padding-top: 100px;
  padding-top: 90px;
  transition: top 0.75s ease-out 0s, opacity 0.75s ease-out 0s !important;
}
.mod_navigation > .inside > .overlay .mod_search .hover-underline-animation,
.mod_navigation > .inside > .overlay .mod_login .hover-underline-animation {
  display: inline-flex;
  align-items: center;
  position: relative;
  text-decoration: none;
  margin: 0px;
  color: var(--sabo-orange);
  font-weight: 600;
  padding-right: 25px;
}
.mod_navigation > .inside > .overlay .mod_search .hover-underline-animation > img.arrow,
.mod_navigation > .inside > .overlay .mod_login .hover-underline-animation > img.arrow {
  transition: left 0.25s ease-in-out;
  left: 10px;
}
.mod_navigation > .inside > .overlay .mod_search .hover-underline-animation:hover > img.arrow,
.mod_navigation > .inside > .overlay .mod_login .hover-underline-animation:hover > img.arrow {
  left: 15px;
}
.mod_navigation > .inside > .overlay .footer-bg {
  top: 0;
}
@media screen and (max-width: 819px) {
  .mod_navigation > .inside > .overlay .footer-bg {
    bottom: -100vh;
  }
}
@media (min-width: 820px) {
  .mod_navigation > .inside > .overlay .footer-bg {
    top: 0px;
    right: 20px;
    left: 65px;
  }
}
@media (min-width: 1024px) {
  .mod_navigation > .inside > .overlay .footer-bg {
    right: 0px;
    top: 10px;
  }
}
@media (min-width: 1300px) {
  .mod_navigation > .inside > .overlay .footer-bg {
    left: 80px;
  }
}
.mod_navigation > .inside > .overlay .mod_search,
.mod_navigation > .inside > .overlay .mod_login {
  min-height: 100%;
}
@media (min-width: 500px) {
  .mod_navigation > .inside > .overlay .mod_search h3,
.mod_navigation > .inside > .overlay .mod_login h3 {
    font-size: 25px;
    line-height: 28px;
    margin-bottom: 15px;
  }
}
body.nav-open .mod_navigation > .inside > .overlay {
  top: 0;
}
body.quicksearch-open .mod_navigation > .inside > .overlay {
  top: 0;
}
.mod_navigation > .inside > .overlay > ul {
  flex-direction: row;
  top: -100vh;
  top: 0;
  opacity: 1;
  height: 100%;
  transition: left 0.75s ease-out 0s, opacity 0.75s ease-out 0s !important;
}
@media (min-width: 768px) {
  .mod_navigation > .inside > .overlay > ul {
    width: 50% !important;
  }
}
body.nav-open .mod_navigation > .inside > .overlay > ul {
  opacity: 1;
}
@media (min-width: 1024px) {
  .mod_navigation > .inside > .overlay {
    left: unset;
    right: unset;
    width: calc(var(--resonsive-max-width) - var(--responsive-padding) * 2);
    max-width: calc(var(--resonsive-max-width) - var(--responsive-padding) * 2);
  }
}
@media (min-width: 1580px) {
  .mod_navigation > .inside > .overlay {
    width: calc(var(--resonsive-max-width) - var(--responsive-padding) * 2);
    max-width: calc(var(--resonsive-max-width) - var(--responsive-padding) * 2);
    margin: 0 auto;
    padding-top: 100px;
  }
}
.mod_navigation > .inside > .overlay .tile.tile--5 {
  display: none;
}
.mod_navigation > .inside > .overlay .tile.tile--5 .content .tile-bg img {
  width: 500px;
}
.mod_navigation > .inside > .overlay .tile.tile--5 a {
  top: 100px;
  right: -50px;
}
.mod_navigation > .inside > .overlay > section.tile {
  position: absolute;
  top: 200px;
  right: 0px;
  padding: 50px;
}
.mod_navigation > .inside > .overlay ul {
  flex-direction: row;
  background: var(--sabo-lightgrey-bg);
  background: transparent linear-gradient(180deg, var(--sabo-lightgrey-bg) 0%, var(--sabo-lightgrey-bg) 100%) 0% 0% no-repeat padding-box;
  background: var(--sabo-lightgrey-bg);
  min-height: calc(110vh - 14px);
  min-height: 100%;
  z-index: 3;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  padding-right: 40px;
  padding-top: 25px;
  column-gap: var(--responsive-inner-padding);
  position: absolute;
}
@media (min-width: 1024px) {
  .mod_navigation > .inside > .overlay ul {
    min-height: 100%;
  }
}
@media (min-width: 1024px) {
  .mod_navigation > .inside > .overlay ul {
    padding-top: 28px;
    width: 25%;
  }
}
.mod_navigation > .inside > .overlay ul > li > a, .mod_navigation > .inside > .overlay ul > li > strong {
  font-weight: 600 !important;
}
.mod_navigation > .inside > .overlay ul li {
  padding: 0;
  padding-bottom: 3px;
}
.mod_navigation > .inside > .overlay ul li > strong {
  font-weight: normal;
  color: inherit;
  width: auto;
}
.mod_navigation > .inside > .overlay ul li a:visited, .mod_navigation > .inside > .overlay ul li a:link, .mod_navigation > .inside > .overlay ul li a:active {
  color: inherit;
  width: 100%;
  width: auto;
}
.mod_navigation > .inside > .overlay ul.level_1 {
  z-index: 1;
  left: 0% !important;
  width: 100vw;
}
@media (min-width: 768px) {
  .mod_navigation > .inside > .overlay ul.level_1 {
    z-index: 3;
    width: 50% !important;
    transition: 0.5s left ease-in-out;
  }
}
@media (min-width: 1300px) {
  .mod_navigation > .inside > .overlay ul.level_1 {
    width: 33% !important;
  }
}
.mod_navigation > .inside > .overlay ul.level_2 {
  left: 100vw !important;
  width: 100vw;
}
@media (min-width: 1024px) {
  .mod_navigation > .inside > .overlay ul.level_2 > li:nth-child(1) {
    display: none;
  }
}
@media (min-width: 768px) {
  .mod_navigation > .inside > .overlay ul.level_2 {
    z-index: 2;
    left: 0% !important;
    transition: 0.5s left ease-in-out;
    width: 50% !important;
  }
  .mod_navigation > .inside > .overlay ul.level_2.open {
    padding-left: 60px;
    padding-right: 45px;
    opacity: 1;
    left: 50% !important;
  }
}
@media (min-width: 820px) {
  .mod_navigation > .inside > .overlay ul.level_2.open {
    padding-right: 45px;
  }
}
@media (min-width: 1024px) {
  .mod_navigation > .inside > .overlay ul.level_2.open {
    padding-right: 0px;
  }
}
@media (min-width: 1300px) {
  .mod_navigation > .inside > .overlay ul.level_2 {
    width: 33% !important;
  }
  .mod_navigation > .inside > .overlay ul.level_2.open {
    left: 33% !important;
  }
}
.mod_navigation > .inside > .overlay ul.level_3 {
  opacity: 1;
  left: 300% !important;
  width: 100vw;
}
.mod_navigation > .inside > .overlay ul.level_3.open {
  left: 200% !important;
}
@media (min-width: 768px) {
  .mod_navigation > .inside > .overlay ul.level_3 {
    opacity: 0;
    z-index: 2;
    left: 100% !important;
    transition: 0.5s left ease-in-out;
    width: 50% !important;
  }
  .mod_navigation > .inside > .overlay ul.level_3.open {
    padding-left: 60px;
    opacity: 1;
    left: 50% !important;
  }
}
@media (min-width: 1300px) {
  .mod_navigation > .inside > .overlay ul.level_3 {
    z-index: 1;
    width: 33% !important;
    left: 0% !important;
  }
}
@media (min-width: 1300px) and (min-width: 768px) {
  .mod_navigation > .inside > .overlay ul.level_3 > li:nth-child(1) {
    display: none;
  }
}
@media (min-width: 1300px) {
  .mod_navigation > .inside > .overlay ul.level_3.open {
    left: 67% !important;
  }
}
.mod_navigation > .inside > .overlay ul li.submenu > img.arrow {
  max-height: 0.8em;
  margin-top: 0.25em;
  position: absolute;
  right: 80px;
  left: auto;
  pointer-events: none;
  height: 14px;
}
@media (min-width: 768px) {
  .mod_navigation > .inside > .overlay ul li.submenu > img.arrow {
    right: 30px;
  }
}
@media (min-width: 1300px) {
  .mod_navigation > .inside > .overlay ul li.submenu > img.arrow {
    right: 60px;
  }
}
@media (min-width: 1300px) {
  .mod_navigation > .inside > .overlay ul li.submenu > img.arrow {
    max-height: 1em;
    margin-top: 0.35em;
    height: 14px;
  }
}
.mod_navigation > .inside > .overlay ul li.submenu:after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: url(https://sabo.de/files/assets/images/icons/arrow.svg);
  background-size: contain;
}
@media (min-width: 1024px) {
  .mod_navigation > .inside > .overlay ul li a,
.mod_navigation > .inside > .overlay ul li strong {
    font-size: 20px;
    line-height: 26px;
  }
}
.mod_navigation > .inside > .overlay ul {
  transition: 0.5s top ease-in-out;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  left: 0;
  font-size: 16px;
  line-height: 20px;
  padding: 0;
  padding-left: 30px;
  padding-top: 50px;
  width: 100%;
  transform-style: preserve-3d;
}
@media (min-width: 1300px) {
  .mod_navigation > .inside > .overlay ul {
    top: 0%;
  }
}
.mod_navigation > .inside > .overlay ul.open {
  left: 0%;
  top: 0;
}
@media (min-width: 1300px) {
  .mod_navigation > .inside > .overlay ul.open {
    top: 0;
  }
}
@media (min-width: 768px) {
  .mod_navigation > .inside > .overlay ul {
    box-shadow: 0px 20px 30px 0 rgba(0, 0, 0, 0.07);
    box-shadow: 10px 20px 20px 0 rgba(0, 0, 0, 0.07);
    box-shadow: 10px 100px 20px 0 rgba(0, 0, 0, 0.07);
  }
}
@media (min-width: 1300px) {
  .mod_navigation > .inside > .overlay ul {
    position: absolute;
    padding-top: 40px;
    padding-left: 90px;
    width: calc(25% + 90px);
    min-height: 100vh;
  }
}
@media (min-width: 1580px) {
  .mod_navigation > .inside > .overlay ul {
    font-size: 20px;
    line-height: 26px;
  }
}
.mod_navigation > .inside > .overlay ul > li > a, .mod_navigation > .inside > .overlay ul > li > strong {
  font-weight: 500;
}
.mod_navigation > .inside > .overlay ul li {
  width: 100%;
  /* min-height: 40px; */
  min-height: 30px;
  position: relative;
}
.mod_navigation > .inside > .overlay ul li.active > a:after, .mod_navigation > .inside > .overlay ul li.active > strong:after, .mod_navigation > .inside > .overlay ul li.trail > a:after, .mod_navigation > .inside > .overlay ul li.trail > strong:after {
  transform: scaleX(1) !important;
}
.mod_navigation > .inside > .overlay ul li.trail > a + ul, .mod_navigation > .inside > .overlay ul li.active > a + ul, .mod_navigation > .inside > .overlay ul li:active > a + ul, .mod_navigation > .inside > .overlay ul li.trail > strong + ul, .mod_navigation > .inside > .overlay ul li.active > strong + ul, .mod_navigation > .inside > .overlay ul li:active > strong + ul {
  display: block;
}
.mod_navigation > .inside > .overlay ul li.trail > a + ul li > a:after, .mod_navigation > .inside > .overlay ul li.trail > a + ul li.active > a:after, .mod_navigation > .inside > .overlay ul li.trail > a + ul li.trail > a:after,
.mod_navigation > .inside > .overlay ul li.trail > a + ul a.active:after,
.mod_navigation > .inside > .overlay ul li.trail > a + ul a.trail:after, .mod_navigation > .inside > .overlay ul li.active > a + ul li > a:after, .mod_navigation > .inside > .overlay ul li.active > a + ul li.active > a:after, .mod_navigation > .inside > .overlay ul li.active > a + ul li.trail > a:after,
.mod_navigation > .inside > .overlay ul li.active > a + ul a.active:after,
.mod_navigation > .inside > .overlay ul li.active > a + ul a.trail:after, .mod_navigation > .inside > .overlay ul li:active > a + ul li > a:after, .mod_navigation > .inside > .overlay ul li:active > a + ul li.active > a:after, .mod_navigation > .inside > .overlay ul li:active > a + ul li.trail > a:after,
.mod_navigation > .inside > .overlay ul li:active > a + ul a.active:after,
.mod_navigation > .inside > .overlay ul li:active > a + ul a.trail:after, .mod_navigation > .inside > .overlay ul li.trail > strong + ul li > a:after, .mod_navigation > .inside > .overlay ul li.trail > strong + ul li.active > a:after, .mod_navigation > .inside > .overlay ul li.trail > strong + ul li.trail > a:after,
.mod_navigation > .inside > .overlay ul li.trail > strong + ul a.active:after,
.mod_navigation > .inside > .overlay ul li.trail > strong + ul a.trail:after, .mod_navigation > .inside > .overlay ul li.active > strong + ul li > a:after, .mod_navigation > .inside > .overlay ul li.active > strong + ul li.active > a:after, .mod_navigation > .inside > .overlay ul li.active > strong + ul li.trail > a:after,
.mod_navigation > .inside > .overlay ul li.active > strong + ul a.active:after,
.mod_navigation > .inside > .overlay ul li.active > strong + ul a.trail:after, .mod_navigation > .inside > .overlay ul li:active > strong + ul li > a:after, .mod_navigation > .inside > .overlay ul li:active > strong + ul li.active > a:after, .mod_navigation > .inside > .overlay ul li:active > strong + ul li.trail > a:after,
.mod_navigation > .inside > .overlay ul li:active > strong + ul a.active:after,
.mod_navigation > .inside > .overlay ul li:active > strong + ul a.trail:after {
  transform: scaleX(0);
}
.mod_navigation > .inside > .overlay ul li strong,
.mod_navigation > .inside > .overlay ul li a {
  display: inline-block;
}
.mod_navigation > .inside > .overlay ul li strong img.arrow,
.mod_navigation > .inside > .overlay ul li a img.arrow {
  position: absolute;
  right: 60px;
  top: 0.25em;
}
.mod_navigation > .inside > .overlay ul li strong:after,
.mod_navigation > .inside > .overlay ul li a:after {
  width: 100%;
}
.mod_navigation > .inside > .overlay li ul {
  position: absolute;
}
.mod_navigation > .inside > .overlay li.open {
  left: 0;
}
.mod_navigation .subnav_menue {
  position: absolute;
  left: 30px;
  right: 30px;
  top: 110px;
}
@media (max-width: 819px) {
  .mod_navigation .subnav_menue{
    top: 70px;
  }
}

@media (max-width: 373px) {
  .mod_navigation .subnav_menue > div{
    flex-direction: column;
  }
}

body.quicksearch-open .mod_navigation .subnav_menue, body.js-has-login-active .mod_navigation .subnav_menue {
  opacity: 0;
}
@media (min-width: 820px) {
  .mod_navigation .subnav_menue {
    top: 20px;
  }
}
@media (min-width: 1024px) {
  .mod_navigation .subnav_menue {
    left: unset;
    right: 60px;
    padding-top: 10px;
  }
}
.mod_navigation .subnav_menue > div {
  display: none;
  display: flex;
  justify-content: flex-start;
  padding-right: 40px;
  flex-direction: row;
  column-gap: 20px;
}
.mod_navigation .subnav_menue > div:nth-child(1) {
  z-index: 5;
  position: relative;
  padding-right: 70px;
}
@media (min-width: 1024px) {
  .mod_navigation .subnav_menue > div:nth-child(1) {
    padding-right: 0px;
  }
}
body.nav-open .mod_navigation .subnav_menue > div {
  display: flex;
}
@media (min-width: 768px) {
  .mod_navigation .subnav_menue > div {
    justify-content: flex-end;
  }
}
.mod_navigation .subnav_menue > div > div:nth-child(1) {
  font-family: "Conneqt";
  font-weight: 600;
  text-transform: uppercase;
  font-size: 12px;
  line-height: 20px;
}
@media (min-width: 1024px) {
  .mod_navigation .subnav_menue > div > div:nth-child(1) {
    font-size: 16px;
    line-height: 26px;
  }
}
.mod_navigation .subnav_menue > div a.hover-underline-animation {
  text-decoration: none;
  color: var(--sabo-orange);
  font-weight: 600;
  font-size: 16px;
  line-height: 20px;
}
@media (min-width: 1024px) {
  .mod_navigation .subnav_menue > div a.hover-underline-animation {
    font-size: 20px;
    line-height: 26px;
  }
}
.mod_navigation .subnav_menue > div a.hover-underline-animation:after {
  width: 100%;
}
.mod_navigation .subnav_menue > div a.inactive {
  line-height: 20px;
  left: 60px;
  opacity: 1;
  margin-top: 40px;
  color: var(--sabo-label-grey);
  height: 1.2em;
}
.mod_navigation .subnav_menue > div a.inactive:after {
  transform-origin: bottom right;
}
.mod_navigation .subnav_menue > div a.inactive:hover > .arrow {
  left: -60px;
}
.mod_navigation .subnav_menue > div a.inactive > .arrow {
  left: -55px;
  height: 40px;
  position: absolute;
  right: unset;
  transform: rotate(180deg);
  transition: left 0.25s ease-in-out;
  height: 0.9em;
  bottom: 0.15em;
  position: absolute;
}
.mod_navigation .subnav_menue > div:nth-child(2) {
  margin-top: 20px;
  opacity: 0;
  text-align: left;
  justify-content: flex-start;
}
@media (min-width: 769px) {
  .mod_navigation .subnav_menue > div:nth-child(2) {
    margin-top: -20px;
  }
}
body.js-has-submenu-active .mod_navigation .subnav_menue > div:nth-child(2) {
  opacity: 1 !important;
}
@media (min-width: 1024px) {
  body.js-has-submenu-active .mod_navigation .subnav_menue > div:nth-child(2) {
    opacity: 0 !important;
  }
}
@media (min-width: 1024px) {
  .mod_navigation .subnav_menue > div:nth-child(2) {
    display: none !important;
    opacity: 0 !important;
  }
}
.mod_navigation a.inactive {
  line-height: 20px;
  left: 60px;
  color: var(--sabo-label-grey) !important;
  height: 1.2em;
}
.mod_navigation a.inactive:after {
  transform-origin: bottom right;
}
.mod_navigation a.inactive:hover > .arrow {
  left: -60px;
}
.mod_navigation a.inactive > .arrow {
  left: -55px;
  height: 40px;
  position: absolute;
  right: unset;
  transform: rotate(180deg);
  transition: left 0.25s ease-in-out;
  height: 0.9em;
  bottom: 0.15em;
  position: absolute;
}
.mod_navigation .mod_search {
  z-index: 4;
  position: absolute;
  margin: 0;
  right: unset;
  padding: 40px 0;
  padding-left: 20px;
  top: calc(-200vh - 14px);
  transition: top 0.75s ease-out 0s;
  background: transparent linear-gradient(180deg, #fff 0%, var(--sabo-lightgrey-bg) 100%) 0% 0% no-repeat padding-box;
  padding-top: 14px;
  min-height: 100vh;
}
@media (min-width: 1024px) {
  .mod_navigation .mod_search {
    padding: 0px 40px 40px 0px;
  }
}
body.quicksearch-open .mod_navigation .mod_search {
  padding-top: 54px;
  top: 0;
}
.mod_navigation .mod_search > div {
  display: flex;
  flex-direction: column-reverse;
  gap: 100px;
  padding: 60px;
  min-height: calc(100vh - 60px);
}
@media (min-width: 820px) {
  .mod_navigation .mod_search > div {
    gap: 0px;
    padding: 0px;
  }
}
@media screen and (max-width: 1023px) {
  .mod_navigation .mod_search > div {
    padding-right: 50px;
    padding-left: 0px;
  }
}
@media (min-width: 820px) {
  .mod_navigation .mod_search > div {
    column-gap: 30px;
    display: flex;
    justify-content: space-between;
    flex-direction: row;
  }
}
@media (min-width: 820px) and (min-width: 1300px) {
  .mod_navigation .mod_search > div {
    column-gap: 60px;
  }
}
.mod_navigation .mod_search > div > div {
  flex: 1;
  padding: 20px;
}
@media (min-width: 1024px) {
  .mod_navigation .mod_search > div > div {
    padding: 40px;
  }
}
@media (min-width: 1300px) {
  .mod_navigation .mod_search > div > div {
    padding: 60px;
  }
  .mod_navigation .mod_search > div > div h2:nth-child(1) {
    font-size: 35px;
  }
  .mod_navigation .mod_search > div > div h3 {
    font-size: 20px;
  }
}
.mod_navigation .mod_search .mod_search_right {
  flex: 8;
  position: relative;
  padding-left: 0;
}
.mod_navigation .mod_search .mod_search_right form input {
  height: 50px;
  line-height: 50px;
  padding-top: 0;
  padding-right: 50px;
}
.mod_navigation .mod_search .mod_search_right .widget {
  position: relative;
}
.mod_navigation .mod_search .mod_search_right .widget::before {
  right: 0;
  top: 0;
  height: 50px;
  content: " ";
  width: 50px;
  position: absolute;
  background: var(--sabo-lightblue);
}
.mod_navigation .mod_search .mod_search_right .widget:after {
  right: 0;
  top: 0;
  height: 50px;
  content: " ";
  width: 50px;
  position: absolute;
  background: var(--sabo-lightblue);
  background: url(https://sabo.de/files/assets/images/icons/lupe-input.svg) no-repeat center center;
  background-size: contain;
}
@media screen and (max-width: 819px) {
  .mod_navigation .mod_search .mod_search_right .widget.widget-text,
.mod_navigation .mod_search .mod_search_right .widget.widget-checkbox,
.mod_navigation .mod_search .mod_search_right .widget.widget-password,
.mod_navigation .mod_search .mod_search_right .widget.widget-radio {
    min-width: unset;
    width: auto;
  }
}
@media (min-width: 1024px) {
  .mod_navigation .mod_search .mod_search_right {
    padding-right: 0;
  }
}
@media (min-width: 1300px) {
  .mod_navigation .mod_search .mod_search_right {
    flex: 12;
    min-height: calc(100vh - 50px);
  }
}
.mod_navigation .mod_search .mod_search_left {
  text-align: center;
  flex: 6;
  padding-bottom: 60px;
  background: #fff;
  box-shadow: 0px 20px 30px 0 rgba(0, 0, 0, 0.07);
}
@media (min-width: 1300px) {
  .mod_navigation .mod_search .mod_search_left {
    min-height: calc(100vh - 50px);
  }
  .mod_navigation .mod_search .mod_search_left .mod_search_left-tel{
    font-size: 44px;
  }
}
@media (max-width: 493px) {
  .mod_navigation .mod_search .mod_search_left .mod_search_left-tel {
    font-size: 22px;
  }
}
.mod_navigation .mod_search .mod_search_left h2 {
  margin-bottom: 45px;
}
.mod_navigation .mod_search .mod_search_left a.btn {
  margin-bottom: 50px;
}
.mod_navigation .mod_search .formbody > div.widget {
  min-width: 100%;
  width: 100%;
}
.mod_navigation .mod_search .formbody > div.widget.widget-submit button:after {
  background: url(/files/assets/images/icons/lupe.svg) no-repeat center center;
}
.mod_navigation .slide-container {
  position: relative;
  min-height: 100%;
}
@media screen and (max-width: 767px) {
  .mod_navigation .slide-container {
    transition: 0.5s transform cubic-bezier(0.42, 0, 0, 0.92);
  }
  .mod_navigation .slide-container[data-index="1"] {
    transform: translateX(-100vw);
  }
  .mod_navigation .slide-container[data-index="2"] {
    transform: translateX(-200vw);
  }
}
.mod_navigation .slide-container ul {
  top: 0;
  bottom: 0;
  overflow-y: scroll;
}

#dma-app a.hover-underline-animation {
  color: var(--sabo-orange);
  font-weight: 600;
  font-size: 16px;
  line-height: 20px;
}
@media (min-width: 1024px) {
  #dma-app a.hover-underline-animation {
    font-size: 20px;
    line-height: 26px;
  }
}
#dma-app .product a.hover-underline-animation.inactive:after{
  width: 100%;
}
#dma-app .product .content a.hover-underline-animation.wishlist:after{
  width: calc(100% - 7px) !important;
}
#dma-app a.trash.hover-underline-animation:after{
  width: calc(100% - 97px) !important;
}
#dma-app a.inactive {
  line-height: 20px;
  left: 60px;
  color: var(--sabo-label-grey);
  height: 1.2em;
}
#dma-app a.inactive:after {
  transform-origin: bottom right;
}
#dma-app a.inactive:hover > .arrow {
  left: -75px;
}
#dma-app a.inactive > .arrow {
  left: -65px;
  height: 40px;
  position: absolute;
  right: unset;
  transform: rotate(180deg);
  transition: left 0.25s ease-in-out;
  height: 0.9em;
  bottom: 0.15em;
  position: absolute;
}

#dma-app .productsearch a.hover-underline-animation:after {
  width: calc(100% - 35px);
}

header.header_sabo {
  background: url(/files/assets/images/2_content/Alpha-2600-Teaserhintergrund.svg) center center no-repeat;
  position: relative;
  margin-bottom: 100px !important;
  margin-top: 60px;
}
@media (min-width: 768px) {
  header.header_sabo {
    min-height: unset;
  }
}
header.header_sabo.noimage {
  background: unset;
}
header.header_sabo.noimage:not(.is_highlight) .tile-headline > h1, header.header_sabo.noimage:not(.is_highlight) .tile-headline > span {
  padding-top: 20px !important;
}
header.header_sabo.header_startseite, body.qs header.header_sabo {
  margin-top: 0px;
}
header.header_sabo.withservice {
  margin-bottom: 285px !important;
}
@media (min-width: 820px) {
  header.header_sabo.withservice {
    margin-bottom: 245px !important;
  }
}
@media (min-width: 1024px) {
  header.header_sabo.withservice {
    margin-top: 0px;
    margin-bottom: 300px !important;
  }
}
@media (min-width: 1300px) {
  header.header_sabo.withservice {
    margin-bottom: 260px !important;
  }
}
@media (min-width: 1300px) {
  header.header_sabo {
    margin-bottom: 160px !important;
  }
}
header.header_sabo.noimage:not(.withlink) {
  margin-top: 0;
}
header.header_sabo.withlink {
  margin-bottom: 200px !important;
}
@media (min-width: 820px) {
  header.header_sabo.withlink {
    margin-bottom: 210px !important;
  }
}
@media (min-width: 1024px) {
  header.header_sabo.withlink {
    margin-top: 0px;
    margin-bottom: 210px !important;
  }
}
@media (min-width: 1300px) {
  header.header_sabo.withlink {
    margin-bottom: 260px !important;
  }
}
@media (min-width: 1580px) {
  header.header_sabo.withlink {
    margin-bottom: 310px !important;
  }
}
header.header_sabo.header_startseite.withlink {
  margin-bottom: 160px !important;
}
header.header_sabo > .inside {
  box-shadow: 0px 20px 30px 0 rgba(0, 0, 0, 0.07);
  background: #fff;
}
header.header_sabo > .inside > picture {
  bottom: -4px;
  bottom: 0px;
  position: relative;
  display: flex;
  overflow: visible;
}
header.header_sabo > .inside > picture > img {
  top: 0px;
  width: 100%;
}
@media (min-width: 1580px) {
  header.header_sabo > .inside > picture > img {
    width: unset;
    height: 100%;
  }
}
header .claim {
  position: absolute;
  top: unset;
  left: 0px;
  bottom: -5px;
  right: 0px;
  left: 20px;
  bottom: 15px;
  right: 20px;
  top: 318px;
  text-align: right;
}
@media (max-width: 374px) {
  header .claim {
    top: 232px;
    right: 11px !important;
  }
}
@media (min-width: 820px) {
  header .claim {
    left: 60px;
    bottom: 0px;
    right: 60px;
  }
}
@media (min-width: 1024px) {
  header .claim {
    top: 60px;
    left: calc(50% - 180px);
    right: 67px;
  }
}
@media (min-width: 1300px) {
  header .claim {
    left: calc(50% - 120px);
    top: 80px;
  }
}
@media (min-width: 1580px) {
  header .claim {
    left: calc(50% - 120px);
  }
}
@media (min-width: 769px) {
  header .claim.noclaim {
    top: 40px;
  }
}
header .claim h1 {
  right: 87px;
}
@media (min-width: 1580px) {
  header .claim h1 {
    right: 100px;
  }
}
header .claim img {
  width: 100%;
}
header .claim > img {
  width: 266px;
}
@media (min-width: 500px) {
  header .claim > img {
    width: 369px;
  }
}
@media (min-width: 1300px) {
  header .claim > img {
    width: 593px;
  }
}
header .claim ul.buzzwords {
  position: relative;
  bottom: 0px;
  right: 0px;
  left: 0;
  list-style: none;
  padding: 0;
  margin: 0;
  top: 15px;
}
@media (min-width: 1300px) {
  header .claim ul.buzzwords {
    top: 35px;
  }
}
header .claim ul.buzzwords li {
  text-align: right;
  position: absolute;
  font-family: "Conneqt";
  top: 0;
  left: 0;
  font-size: 34px;
  right: 16px;
}
@media (min-width: 500px) {
  header .claim ul.buzzwords li {
    font-size: 44px;
    right: 30px;
    right: 20px;
  }
}
@media (min-width: 768px) {
  header .claim ul.buzzwords li {
    font-size: 44px;
    right: 25px;
  }
}
@media (min-width: 769px) {
  header .claim ul.buzzwords li {
    right: 25px;
  }
}
@media (min-width: 1300px) {
  header .claim ul.buzzwords li {
    font-size: 80px;
    right: 35px;
  }
}
header .claim ul.buzzwords + hr {
  border: none;
  border-top: 3px solid var(--sabo-lightblue);
  right: -10px;
  top: 115px;
  width: 95px;
  position: absolute;
  margin: 0 30px 0;
}
@media (min-width: 500px) {
  header .claim ul.buzzwords + hr {
    width: 280px;
    right: -10px;
    top: 160px;
  }
}
@media (min-width: 530px) {
  header .claim ul.buzzwords + hr {
    top: 160px;
  }
}
@media (min-width: 768px) {
  header .claim ul.buzzwords + hr {
    top: 160px;
    right: 0px;
  }
}
@media (min-width: 1300px) {
  header .claim ul.buzzwords + hr {
    top: 250px;
    right: 12px;
  }
}
@media (min-width: 1450px) {
  header .claim ul.buzzwords + hr {
    top: 260px;
  }
}
header .claim ul.buzzwords + hr + p {
  position: relative;
  top: 55px;
  padding-right: 20px;
  display: inline-block;
  left: auto;
  font-weight: 600;
}
@media (min-width: 500px) {
  header .claim ul.buzzwords + hr + p {
    top: 90px;
    right: 20px;
    padding-right: 0;
    padding-left: 20px;
  }
}
@media (min-width: 768px) {
  header .claim ul.buzzwords + hr + p {
    top: 80px;
    right: 30px;
    right: 20px;
    width: 70%;
  }
}
@media (min-width: 820px) {
  header .claim ul.buzzwords + hr + p {
    bottom: 0px;
    right: 30px;
  }
}
@media (min-width: 1024px) {
  header .claim ul.buzzwords + hr + p {
    left: unset;
    width: auto;
  }
}
@media (min-width: 1300px) {
  header .claim ul.buzzwords + hr + p {
    top: 130px;
    right: 42px;
  }
}
header .claim {
  left: 20px;
  right: 20px;
}
@media (min-width: 500px) {
  header .claim {
    right: 20px;
    left: 20px;
    top: 400px;
  }
}
@media (min-width: 600px) {
  header .claim {
    top: 500px;
  }
}
@media (min-width: 670px) {
  header .claim {
    top: 600px;
  }
}
@media (min-width: 768px) {
  header .claim {
    top: 160px;
    right: 63px;
  }
  header .claim.noclaim {
    top: 40px;
  }
}
@media (min-width: 820px) {
  header .claim.noclaim {
    top: 20px;
  }
  header .claim.noclaim {
    left: 45%;
  }
}
@media (min-width: 1024px) {
  header .claim {
    left: 50%;
    top: 240px;
  }
  header .claim.noclaim {
    top: 40px;
  }
}
@media (min-width: 1280px) {
  header .claim {
    top: 330px;
  }
}
@media (min-width: 1580px) {
  header .claim {
    left: 40%;
    top: 450px;
  }
}
header .claim .tile-headline {
  position: relative;
  display: inline-block;
}
header .claim .tile-headline h1 {
  display: inline-block;
  padding: 20px 20px 30px 20px;
  color: var(--sabo-lightblue);
  font-family: "Conneqt";
  color: transparent;
  display: inline-block;
}
header .claim .tile-headline h1 + span {
  font-family: "Conneqt";
  position: absolute;
  top: 20px;
  padding-top: 20px;
  right: 0px;
  left: 0;
  text-align: right;
}
header.is_highlight {
  background: none;
}
@media (width <= 499px){
  header.header_sabo.noimage .inside .claim .tile-headline h1, header.header_sabo.noimage .inside .claim .tile-headline > span {
    font-size: 34px;
  }
}
@media (width <= 397px){
  header.header_sabo.noimage .inside .claim .tile-headline h1, header.header_sabo.noimage .inside .claim .tile-headline > span {
    font-size: 26px;
    line-height: 30px;
    hyphens: auto;
  }
  header.header_sabo.noimage .inside .claim{
    bottom: 0px;
  }
}
@media (width <= 349px){
  header.header_sabo.noimage .inside .claim{
    left: 0px;
  }
  header.header_sabo.noimage .inside .claim .tile-headline > span{
    left: -10px;
  }
}
@media (width <= 362px){
  header.header_sabo.noimage .inside .claim .tile-headline h1, header.header_sabo.noimage .inside .claim .tile-headline > span {
    padding-top: 0px !important;
  }
}
@media (min-width: 1580px) {
  header.is_highlight > .inside > picture > img {
    width: 100%;
    height: 100%;
  }
}
header.is_highlight .claim {
  top: unset;
  left: 0px;
  bottom: -5px;
  right: 0px;
  left: 20px;
  bottom: 20px;
  right: 20px;
}
@media (min-width: 500px) {
  header.is_highlight .claim {
    bottom: 35px;
  }
}
@media (min-width: 769px) {
  header.is_highlight .claim {
    top: 40px;
  }
}
@media (min-width: 820px) {
  header.is_highlight .claim {
    left: 60px;
    bottom: 0px;
    right: 60px;
  }
}
@media (min-width: 1024px) {
  header.is_highlight .claim {
    top: 60px;
    left: calc(50% - 180px);
    right: 67px;
  }
}
@media (min-width: 1300px) {
  header.is_highlight .claim {
    left: calc(50% - 120px);
    top: 80px;
  }
}
@media (min-width: 1580px) {
  header.is_highlight .claim {
    left: calc(50% - 120px);
  }
}
header.is_highlight .claim .tile-headline {
  position: relative;
  display: inline-block;
}
header.is_highlight .claim .tile-headline h1 {
  display: inline-block;
  color: transparent;
  display: inline-block;
}
@media (min-width: 820px) {
  header.is_highlight .claim .tile-headline h1 {
    margin-bottom: 30px;
  }
}
header.is_highlight .claim .tile-headline h1 + span {
  font-family: "Conneqt";
  position: absolute;
  top: 20px;
  right: 20px;
  left: 0;
  color: #fff;
  text-align: right;
}
header.is_highlight div.contact {
  justify-content: flex-end;
  position: relative;
  bottom: 0;
  right: 0;
  left: 0;
  display: flex;
  position: absolute;
  bottom: -185px;
  background: #fff;
  box-shadow: 0px 10px 15px 0 rgba(0, 0, 0, 0.07);
}
@media (min-width: 500px) {
  header.is_highlight div.contact {
    background: none;
    box-shadow: none;
  }
}
@media (min-width: 820px) {
  header.is_highlight div.contact {
    background: unset;
    bottom: -147px;
    left: unset;
  }
}
@media (min-width: 1300px) {
  header.is_highlight div.contact {
    bottom: -97px;
  }
}
header.is_highlight div.contact .teamviewer {
  border-left: 2px solid var(--sabo-lightgrey);
  background: #fff;
  position: relative;
  padding: 50px 10px;
  width: 100%;
  height: 100%;
}
@media (min-width: 500px) {
  header.is_highlight div.contact .teamviewer {
    background: #fff;
    box-shadow: 0px 10px 15px 0 rgba(0, 0, 0, 0.07);
  }
}
@media (min-width: 820px) {
  header.is_highlight div.contact .teamviewer {
    padding: 50px 30px;
  }
}
header.is_highlight div.contact .teamviewer a {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  text-indent: -100vw;
  color: transparent;
}
header.is_highlight div.contact .teamviewer.mobile-only {
  display: none;
  margin: 40px 20px;
  width: calc(100% - 40px);
  position: relative;
  padding: 6px 20px;
  background: #fff;
  position: relative;
  text-align: left;
  margin-top: 90px;
}
@media (min-width: 768px) {
  header.is_highlight div.contact .teamviewer.mobile-only {
    margin: 40px 60px;
    margin-top: 80px;
    width: calc(100% - 110px);
  }
}
@media (min-width: 820px) {
  header.is_highlight div.contact .teamviewer.mobile-only {
    margin: 40px 20px;
    padding: 6px 40px;
    width: calc(100% - 80px);
    box-shadow: 0px 10px 15px 0 rgba(0, 0, 0, 0.07);
  }
}
header.is_highlight div.contact .teamviewer.mobile-only a {
  position: absolute;
  bottom: 0px;
  left: unset;
  right: 0;
  width: 50px;
}
@media (min-width: 820px) {
  header.is_highlight div.contact .teamviewer.mobile-only a {
    right: 20px;
  }
}
header.is_highlight div.contact .teamviewer.mobile-only > img {
  top: 2px;
  left: 0px;
}
header.is_highlight div.contact .teamviewer.no-mobile {
  display: flex !important;
}
@media (min-width: 820px) {
  header.is_highlight div.contact .teamviewer.no-mobile {
    min-width: 200px;
    display: flex !important;
    justify-content: center;
    align-items: center;
    padding-top: 0;
  }
}
header.is_highlight div.contact > div.contact--adress {
  padding-right: 30px;
  min-height: 185px;
  flex: unset;
}
@media (min-width: 500px) {
  header.is_highlight div.contact > div.contact--adress {
    background: #fff;
    box-shadow: 0px 10px 15px 0 rgba(0, 0, 0, 0.07);
  }
}
header.is_highlight div.contact > div.contact--adress h3 a {
  color: var(--sabo-lightblue);
  margin-top: 50px;
  margin-top: 10px;
  padding: 0;
  margin-bottom: 20px;
  font-size: 25px;
  line-height: 28px;
  display: block;
  letter-spacing: 0px;
  position: relative;
  bottom: -10px;
  text-decoration: none;
}
@media screen and (min-width: 350px) {
  header.is_highlight div.contact > div.contact--adress {
    min-width: 273px;
  }
}
header.is_highlight div.contact > div.contact--adress > h3 {
  margin-top: 30px;
  line-height: 55px;
}
@media (min-width: 769px) {
  header.is_highlight div.contact > div.contact--adress > h3 a {
    font-size: 35px;
    margin-top: 35px;
  }
}
header.is_highlight div.contact > div:nth-child(1) {
  padding-bottom: 30px;
  padding-bottom: 57px;
  padding-left: 10px;
  padding-right: 10px;
  background: #fff;
  z-index: 1;
  text-align: right;
}
@media (min-width: 500px) {
  header.is_highlight div.contact > div:nth-child(1) {
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 30px;
  }
}
@media (min-width: 820px) {
  header.is_highlight div.contact > div:nth-child(1) {
    padding-right: 30px;
    padding-bottom: unset;
  }
}
header.is_highlight div.contact > div.contact--image-and-download {
  min-width: 150px;
  display: flex !important;
  justify-content: center;
  align-items: center;
  padding-top: 0;
}
@media (min-width: 500px) {
  header.is_highlight div.contact > div.contact--image-and-download {
    min-width: 200px;
  }
}

.readmore {
  position: absolute;
  left: 0;
  overflow: visible;
  bottom: -16px;
  width: 330px;
}
@media (min-width: 500px) {
  .readmore {
    bottom: 0px;
    width: 100%;
  }
}
@media (min-width: 769px) {
  .readmore {
    bottom: -30px;
    bottom: -20px;
    left: 70px;
  }
}
@media (min-width: 820px) {
  .readmore {
    bottom: -10px;
    left: 0px;
  }
}
@media (min-width: 1300px) {
  .readmore {
    bottom: -10px;
  }
}
.readmore .readmoreimg {
  width: 120px;
  transform: translateX(10px) translateY(61px);
}
@media (min-width: 500px) {
  .readmore .readmoreimg {
    width: 150px;
  }
}
@media (min-width: 769px) {
  .readmore .readmoreimg {
    transform: translateX(-50px) translateY(47px);
  }
}
.readmore a {
  width: 71%;
  color: var(--sabo-orange);
  font-weight: 600;
  font-size: 16px;
  line-height: 20px;
  text-decoration: none;
  transform: translateX(50px) translateY(-22px);
  display: inline-block;
  padding-right: 61px;
  position: relative;
}
@media (max-width: 356px) {
  .readmore a {
    transform: translateX(24px) translateY(-22px);
  }
  .readmore a .arrow {
    right: 8px !important;
  }
  .readmore a:hover > .arrow {
    right: 0px !important;
  }
}
@media (max-width: 417px) {
  .readmore a {
    width: auto;
  }
}
@media (min-width: 500px) {
  .readmore a {
    width: auto;
    font-size: 20px;
    line-height: 26px;
    transform: translateX(-68px) translateY(-10px);
  }
}
@media (min-width: 769px) {
  .readmore a {
    transform: translateX(-132px) translateY(-23px);
  }
}
.readmore a > .arrow {
  transition: right 0.25s ease-in-out;
  position: absolute;
  height: 15px;
  right: 0px;
  bottom: 0.15em;
}
@media (min-width: 500px) {
  .readmore a > .arrow {
    right: 0px;
    height: auto;
    bottom: 2px;
  }
}
.readmore a:hover > .arrow {
  right: -10px;
}
/* header.linkposition_right .readmore {
  left: unset;
  width: auto;
  right: 10px;
  left: 10px;
  bottom: -70px;
  bottom: -100px;
}
header.linkposition_right .readmore a > .arrow {
  position: relative;
  right: -15px;
  top: 0.2em;
}
@media (min-width: 500px) {
  header.linkposition_right .readmore {
    left: 10px;
    right: 10px;
    text-align: left;
    bottom: -100px;
  }
  header.linkposition_right .readmore a {
    transform: translateX(55px) translateY(-35px);
  }
  header.linkposition_right .readmore a > .arrow {
    top: unset;
    right: 15px;
    position: absolute;
  }
}
@media (min-width: 539px) {
  header.linkposition_right .readmore {
    bottom: -80px;
  }
  header.linkposition_right .readmore a {
    transform: translateX(-68px) translateY(-13px);
  }
}
@media (min-width: 620px) {
  header.linkposition_right .readmore {
    bottom: -70px;
  }
}
@media (min-width: 769px) {
  header.linkposition_right .readmore {
    left: unset;
    right: -120px;
    text-align: right;
    bottom: -70px;
  }
  header.linkposition_right .readmore a {
    transform: translateX(-125px) translateY(-30px);
  }
}
@media (min-width: 802px) {
  header.linkposition_right .readmore {
    right: -130px;
  }
} */
@media (max-width: 417px){
  header.linkposition_right .readmore {
    width: 330px;
  }
}
/* @media (min-width: 418px) and (max-width: 499px){
  header.linkposition_right .readmore .hover-underline-animation{
    width: 68%;
  }
} */
@media (max-width: 819px){
  header.linkposition_right .readmore {
    bottom: -79px;
  }
}
@media (min-width: 820px) and (max-width: 1099px){
  header.linkposition_right .readmore {
    bottom: -65px;
    left: 20px;
  }
}
.readmorelink {
  left: 0;
  bottom: 0;
  width: 100%;
  overflow: visible;
  display: flex;
  justify-content: center;
  align-items: center;
}
.readmorelink .readmoreimg {
  width: 150px;
}
.readmorelink a {
  position: relative;
  top: 0.75em;
  color: var(--sabo-orange);
  font-weight: 600;
  font-size: 20px;
  text-decoration: none;
  line-height: 1;
  display: inline-block;
  padding-right: 61px;
  position: relative;
  left: -75px;
  top: -0.6em;
}
.readmorelink a:not(.h2) {
  font-family: "Zilla Slab";
  line-height: 1;
}
.tile .readmorelink a.hover-underline-animation > .arrow {
  top: 50%;
  transform: translateY(-39%);
}
.readmorelink a:hover > .arrow {
  right: 10px;
}
.contact.tile .readmorelink h2 {
  padding-bottom: 0;
  text-align: left;
}

.sf-toolbar {
  display: none !important;
}

footer {
  background: var(--sabo-lightgrey-bg);
  overflow: hidden;
}
footer .inside {
  margin: 0 auto;
}
@media (min-width: 820px) {
  footer .inside {
    max-width: calc(var(--resonsive-max-width) - 2 * var(--responsive-padding));
  }
}
footer h3.form_success {
  text-align: center;
  margin-top: 60px;
  margin-bottom: 400px;
}
footer > .inside > div {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
}
@media (min-width: 820px) {
  footer > .inside > div {
    flex-direction: row;
  }
}
footer > .inside > div.mod_subscribe {
  padding: 0 30px;
}
footer > .inside > div.mod_subscribe h3 {
  text-align: left;
  font-size: 16px;
  line-height: 20px;
}
@media (min-width: 768px) {
  footer > .inside > div.mod_subscribe h3 {
    padding: 0 60px;
    width: calc(100vw - 120px);
    min-width: calc(100vw - 120px);
  }
}
@media (min-width: 820px) {
  footer > .inside > div.mod_subscribe h3 {
    margin-bottom: unset;
    padding-top: 6px;
    text-align: right;
  }
}
@media (min-width: 1024px) {
  footer > .inside > div.mod_subscribe h3 {
    padding-top: 0px;
    padding-left: 0px;
    font-size: 20px;
    line-height: 30px;
    min-width: unset;
    width: unset;
    margin-bottom: unset;
  }
}
@media screen and (min-width: 820px) and (max-width: 1199px) {
  footer > .inside > div.mod_subscribe h3 {
    flex: unset;
    width: 100%;
    text-align: center;
    font-size: 16px;
    margin-bottom: 15px;
  }
  footer > .inside > div.mod_subscribe h3 + form {
    max-width: 50%;
    margin: 0 auto;
  }
}
@media (min-width: 1199px) {
  footer > .inside > div.mod_subscribe h3 {
    font-size: 16px;
    line-height: 60px;
  }
}
@media (min-width: 1580px) {
  footer > .inside > div.mod_subscribe h3 {
    padding-left: 0px;
    font-size: 20px;
    line-height: 30px;
    text-indent: 40%;
  }
}
@media (min-width: 1580px) {
  footer > .inside > div.mod_subscribe h3 {
    text-indent: 0%;
    line-height: 60px;
  }
}
footer > .inside > div.mod_subscribe > form > .formbody > div.widget.widget-text {
  margin-bottom: 0;
  width: calc(100vw - 40px);
  min-width: calc(100vw - 40px);
  width: calc(100vw - 60px);
  min-width: calc(100vw - 60px);
}
@media (min-width: 768px) {
  footer > .inside > div.mod_subscribe > form > .formbody > div.widget.widget-text {
    padding: 0 30px;
    width: calc(100vw - 100px);
    min-width: calc(100vw - 100px);
  }
}
@media (min-width: 820px) {
  footer > .inside > div.mod_subscribe {
    padding: 0;
  }
  footer > .inside > div.mod_subscribe > form > .formbody > div.widget.widget-text {
    width: 66%;
    min-width: 66%;
  }
}
@media screen and (min-width: 820px) and (min-width: 820px) and (max-width: 1199px) {
  footer > .inside > div.mod_subscribe > form > .formbody > div.widget.widget-text {
    width: 100%;
    min-width: 100%;
    padding: 0;
  }
}
@media screen and (min-width: 820px) and (min-width: 1200px) and (max-width: 1279px) {
  footer > .inside > div.mod_subscribe > form > .formbody > div.widget.widget-text {
    width: 80%;
    min-width: 80%;
  }
}
footer > .inside > div > div {
  flex: 1;
}
footer > .inside > div > div:nth-child(1) {
  flex: 2;
}
footer > .inside > div > .contact {
  position: relative;
  flex: 3;
  display: flex;
  flex-direction: row;
  margin-left: 10px;
  overflow-x: visible;
  overflow-y: visible;
  width: 100%;
  max-width: calc(100vw - 20px);
  justify-content: flex-start;
  align-items: flex-start;
  opacity: 1;
  z-index: 2;
}
@media (min-width: 820px) {
  footer > .inside > div > .contact {
    flex-wrap: wrap;
    flex-direction: row;
  }
}
@media (min-width: 820px) {
  footer > .inside > div > .contact {
    margin-left: unset;
    max-width: unset;
    overflow: initial;
    box-shadow: 0px 10px 15px 0 rgba(0, 0, 0, 0.07);
  }
}
@media (min-width: 850px) {
  footer > .inside > div > .contact {
    box-shadow: none;
  }
}
@media (min-width: 1199px) {
  footer > .inside > div > .contact {
    max-width: 731px;
    width: 731px;
  }
}
footer > .inside > div > .contact a {
  position: absolute;
  bottom: -20px;
  z-index: 900;
  padding: 0.75em 2em;
  letter-spacing: 1px;
}
footer > .inside > div > .contact a.btn {
  letter-spacing: 2px;
  left: 10px;
}
@media screen and (min-width: 350px) {
  footer > .inside > div > .contact a {
    font-size: 14px;
    letter-spacing: 1px;
  }
  footer > .inside > div > .contact a.btn {
    left: 20px;
  }
}
@media (min-width: 820px) {
  footer > .inside > div > .contact a {
    bottom: -90px;
    padding: 0.75em 3em;
  }
  footer > .inside > div > .contact a.btn {
    left: 0px;
  }
}
footer > .inside > div > .contact h3 a {
  color: var(--sabo-lightblue);
  margin-top: 50px;
  margin-top: 10px;
  padding: 0;
  margin-bottom: 20px;
  line-height: 38px;
  font-size: 30px;
  font-size: 30px;
  display: block;
  letter-spacing: 0px;
  position: relative;
  bottom: -10px;
  text-decoration: none;
}
footer > .inside > div > .contact > div.contact--adress {
  background: #fff;
  padding-right: 30px;
  min-height: 185px;
  flex: unset;
}
@media screen and (max-width: 499px) {
  footer > .inside > div > .contact > div.contact--adress {
    width: 100%;
    padding-left: 0px !important;
  }
}
@media screen and (min-width: 350px) {
  footer > .inside > div > .contact > div.contact--adress {
    min-width: 273px;
  }
}
footer > .inside > div > .contact > div.contact--adress > h3 {
  margin-top: 30px;
  line-height: 55px;
}
@media (min-width: 769px) {
  footer > .inside > div > .contact > div.contact--adress > h3 {
    font-size: 35px;
    margin-top: 35px;
  }
}
footer > .inside > div > .contact > div:nth-child(1) {
  padding-bottom: 30px;
  padding-bottom: 57px;
  padding-left: 20px;
  padding-right: 20px;
  background: #fff;
  z-index: 1;
  text-align: right;
}
@media (min-width: 500px) {
  footer > .inside > div > .contact > div:nth-child(1) {
    padding-bottom: 30px;
  }
}
@media (min-width: 820px) {
  footer > .inside > div > .contact > div:nth-child(1) {
    padding-right: 30px;
    padding-bottom: unset;
  }
}
footer > .inside > div > .contact > div.contact--image-and-download {
  background: #fff;
  position: relative;
  display: none;
}
@media (max-width: 499px) { 
  footer > .inside > div > .contact > div.contact--image-and-download .contact--image { 
    height: 233px !important;
  } 
  footer > .inside > div > .contact > div.contact--image-and-download .contact--image img{ 
    left: -134px !important;
  } 
}
@media (max-width: 688px) and (min-width: 500px) { 
  footer > .inside > div > .contact > div.contact--image-and-download .contact--image { 
    height: 206px !important;
  } 
}
@media screen and (min-width: 350px) {
  footer > .inside > div > .contact > div.contact--image-and-download {
    display: grid;
    width: calc(100vw - 293px);
  }
}
@media (min-width: 500px) {
  footer > .inside > div > .contact > div.contact--image-and-download {
    width: unset;
  }
}
@media (min-width: 820px) {
  footer > .inside > div > .contact > div.contact--image-and-download {
    flex: 2;
    max-width: 450px;
  }
}
footer > .inside > div > .contact > div.contact--image-and-download > div {
  flex: 1;
  grid-column: 2/2;
}
footer > .inside > div > .contact > div.contact--image-and-download > div:nth-child(1) {
  flex: 2;
  grid-column: 1/2;
  text-align: right;
  height: 185px;
  overflow: hidden;
}
@media (min-width: 820px) {
  footer > .inside > div > .contact > div.contact--image-and-download > div:nth-child(1) {
    max-width: 249px;
  }
}
@media (min-width: 1024px) {
  footer > .inside > div > .contact > div.contact--image-and-download > div:nth-child(1) {
    text-align: left;
  }
}
footer > .inside > div > .contact > div.contact--image-and-download > div:nth-child(1) img {
  left: -80px;
  height: 100%;
  max-width: unset;
  width: auto;
}
@media (min-width: 500px) {
  footer > .inside > div > .contact > div.contact--image-and-download > div:nth-child(1) img {
    left: 0px;
  }
}
@media (min-width: 820px) {
  footer > .inside > div > .contact > div.contact--image-and-download > div:nth-child(1) img {
    left: -60px;
    min-height: 185px;
  }
}
footer > .inside > div > .contact > a {
  font-size: 14px;
  padding: 0.75em 2em;
}
@media (min-width: 820px) {
  footer > .inside > div > .contact > a {
    font-size: 14px;
    left: 0;
    padding: 12xp 50px;
    line-height: 26px;
    bottom: -80px;
    border-radius: 50px;
  }
}
@media (min-width: 1024px) {
  footer > .inside > div > .contact > a {
    margin-left: 30px;
    margin-left: auto;
  }
}
footer > .inside > div .teamviewer {
  position: relative;
  padding: 50px 30px;
}
footer > .inside > div .teamviewer a {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
footer > .inside > div .teamviewer.mobile-only {
  margin: 40px 20px;
  width: calc(100% - 40px);
  position: relative;
  padding: 6px 20px;
  background: #fff;
  position: relative;
  text-align: left;
  margin-top: 90px;
  box-shadow: 0px 10px 15px 0 rgba(0, 0, 0, 0.07);
}
@media (min-width: 768px) {
  footer > .inside > div .teamviewer.mobile-only {
    margin: 40px 60px;
    margin-top: 80px;
    width: calc(100% - 110px);
  }
}
@media (min-width: 820px) {
  footer > .inside > div .teamviewer.mobile-only {
    margin: 40px 20px;
    padding: 6px 40px;
    width: calc(100% - 80px);
  }
}
footer > .inside > div .teamviewer.mobile-only a {
  position: absolute;
  bottom: 0px;
  left: unset;
  right: 0;
  width: 50px;
}
@media (min-width: 820px) {
  footer > .inside > div .teamviewer.mobile-only a {
    right: 20px;
  }
}
footer > .inside > div .teamviewer.mobile-only > img {
  top: 2px;
  left: 0px;
}
@media (min-width: 820px) {
  footer > .inside > div .teamviewer.no-mobile {
    min-width: 200px;
    display: flex !important;
    justify-content: center;
    align-items: center;
    padding-top: 0;
  }
}
footer > .inside > div .teamviewer .contact--image {
  width: 150px;
}
footer > .inside > div .imprint {
  flex: 2;
  text-align: right;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  margin-bottom: 60px;
}
@media (min-width: 1200px) {
  footer > .inside > div .imprint {
    flex: 1;
  }
}
footer > .inside > div .imprint > div {
  width: 220px;
}
footer > .inside > div .imprint > div.companylogo {
  padding: 30px 60px 20px 0px;
}
footer > .inside > div .imprint > div.companyadress {
  padding: 60px 60px 0px 0px;
  padding: 25px 60px 0px 0px;
}
footer > .inside > div .imprint > div.companysocial {
  padding: 30px 60px 0px 0px;
  display: flex;
  justify-content: flex-end;
}
footer > .inside > div .imprint > div.companysocial a {
  flex: 1;
  margin-left: 30px;
}
footer > .inside > div .imprint > div.companyimprint {
  padding: 30px 60px 0px 0px;
}
footer > .inside > div .imprint > div.companyimprint a {
  display: block;
  color: var(--sabo-label-grey);
  font-family: "Conneqt";
  font-size: 12px;
  line-height: 18px;
  margin-bottom: 5px;
  letter-spacing: 0.5px;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none;
  text-decoration: none;
}
footer > .inside > div .imprint > div.companyimprint a:active, footer > .inside > div .imprint > div.companyimprint a:hover {
  text-decoration: underline;
}
footer > .inside > div .imprint.mobile-only {
  align-items: flex-end;
  margin-bottom: 10px;
  margin-bottom: 40px;
  justify-content: space-between;
  width: 100%;
  flex-basis: 100%;
  flex-direction: row;
  flex-wrap: wrap;
}
@media (min-width: 768px) {
  footer > .inside > div .imprint.mobile-only {
    margin-left: 60px;
    margin-right: 60px;
    width: calc(100% - 120px) !important;
    flex-basis: calc(100% - 120px);
  }
}
@media (min-width: 820px) {
  footer > .inside > div .imprint.mobile-only {
    width: 100% !important;
    flex-basis: 100%;
    margin: 0 20px;
    margin-bottom: 40px;
  }
}
footer > .inside > div .imprint.mobile-only > div.companylogo {
  text-align: left;
}
footer > .inside > div .imprint.mobile-only > div.companylogo svg {
  max-height: 50px;
  min-height: 50px;
  max-height: 35px;
  max-width: 110px;
  min-height: 35px;
}
@media (min-width: 1024px) {
  footer > .inside > div .imprint.mobile-only > div.companylogo svg {
    max-height: 60px;
    min-height: 60px;
    max-width: 187.555px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1199px) {
  footer > .inside > div .imprint.mobile-only.companylogo {
    padding: 30px 60px 20px 0px;
  }
  footer > .inside > div .imprint.mobile-only.companyadress {
    padding: 25px 60px 0px 0px;
  }
  footer > .inside > div .imprint.mobile-only.companysocial {
    padding: 30px 60px 0px 0px;
  }
  footer > .inside > div .imprint.mobile-only.companyimprint {
    padding: 30px 60px 0px 0px;
  }
}
@media screen and (min-width: 820px) and (max-width: 1199px) {
  footer > .inside > div .imprint.mobile-only {
    display: flex !important;
    padding-top: 120px !important;
  }
}
footer > .inside > div .imprint.mobile-only > div {
  width: 50%;
}
footer > .inside > div .imprint.mobile-only > div.companyadress {
  text-align: left;
  padding: 30px 0px 0px 0px;
}
footer > .inside > div .imprint.mobile-only > div.companyimprint {
  text-align: right;
  padding: 30px 0px 0px 0px;
}
footer > .inside > div .imprint.mobile-only > div.companylogo {
  padding: 0px 60px 0 0;
}
footer > .inside > div .imprint.mobile-only > div.companysocial {
  padding: 0px 0px 5px 0px;
}
footer > .inside > div .imprint.mobile-only > div.companysocial a {
  flex: unset;
}
@media (max-width: 499px) {
  footer > .inside > div .imprint.mobile-only > div.companylogo{
    width: 100%;
    padding-right: 0px;
    display: flex;
    justify-content: flex-start;
  }
  footer > .inside > div .imprint.mobile-only > div.companyadress p{
    margin-bottom: 5px;
  }
  footer > .inside > div .imprint.mobile-only > div.companysocial{
    width: 100%;
    padding-top: 20px;
    justify-content: flex-start;
  }
  footer > .inside > div .imprint.mobile-only > div.companysocial .social{
    margin-left: 0;
    margin-right: 30px;
  }
}
@media (min-width: 1024px) {
  footer > .inside > div .imprint.no-mobile {
    display: none !important;
  }
}
@media (min-width: 1199px) {
  footer > .inside > div .imprint.no-mobile {
    display: flex !important;
  }
}

.footer-bg {
  background: var(--sabo-black);
  top: 100px;
  pointer-events: none;
  opacity: 0.05;
  flex: unset;
  position: absolute;
  bottom: 0;
  left: 0px;
  right: 0;
}
@media (min-width: 820px) {
  .footer-bg {
    left: 20px;
    right: 20px;
  }
}
@media (min-width: 1300px) {
  .footer-bg {
    left: 90px;
    top: 90px;
  }
}

#container section.tile.center.remove_bottom_spacing.flex-d--100 {
  /*
  .tile-headline {
      margin-bottom: 50px;
  }*/
}
#container .tile {
  position: relative;
}
#container .tile .content {
  position: relative;
  z-index: 1;
}
@media (min-width: 1300px) {
  #container .tile {
    /*Reemove
    h3 {
        line-height: 38px;
    }*/
  }
}
#container .tile .tile-headline h2 {
  max-width: 100%;
  hyphens: auto;
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
#container .tile.center .tile-headline h2 {
  text-align: center;
}
#container .tile.left .tile-headline h2 {
  text-align: left;
}
#container .tile.right .tile-headline h2 {
  text-align: right;
}
#container .tile.tile.tile--4.helper > .inside {
  padding: 0 !important;
}
#container .tile ul {
  padding-top: 10px;
  padding-left: 0px;
  list-style: none;
}
#container .tile ul li {
  padding-left: 1.5em;
  padding-left: 20px;
  margin-bottom: 15px;
  position: relative;
}
@media (min-width: 769px) {
  #container .tile ul li {
    padding-left: 25px;
  }
}
#container .tile ul li::before {
  width: 1em;
  content: "";
  height: 1em;
  width: 10px;
  height: 10px;
  top: 5px;
  top: 7px;
  position: absolute;
  left: 0;
  background: url(/files/assets/images/icons/aufzaelungspunkt.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media (min-width: 769px) {
  #container .tile ul li::before {
    width: 12px;
    height: 12px;
    top: 8px;
  }
}
#container header .tile-text a,
#container .tile a.hover-underline-animation {
  padding-right: 61px;
}
#container header .tile-text a,
#container .tile a, #container .tile a.hover-underline-animation {
  transform: translateX(-125px) translateY(-25px);
  display: inline-block;
  color: var(--sabo-orange);
  text-decoration: none;
  transform: translateX(0) translateY(0);
  position: relative;
  width: auto;
  font-weight: 600;
  text-decoration: none;
  display: inline-block;
  position: relative;
}
#container .tile a.inactive,#container .tile a.hover-underline-animation.inactive {
  padding-left: 80px;
  padding-right: 0px;
  color: var(--sabo-label-grey);
}
#container .tile a.inactive:after, #container .tile a.hover-underline-animation.inactive:after {
  width: calc(100% - 80px);
  width: calc(100% - 75px);
  transform-origin: bottom right;
  left: 80px;
}
#container .tile a > .arrow, #container .tile a.hover-underline-animation > .arrow {
  left: unset;
}
#container .tile a.inactive:hover > .arrow, #container .tile a.hover-underline-animation.inactive:hover > .arrow {
  left: 0;
}
#container header .tile-text a > .arrow {
  left: unset;
}
#container header .tile-text a > .arrow {
  left: 0;
}

#container .tile a.inactive > .arrow, #container .tile a.hover-underline-animation.inactive > .arrow {
  right: unset;
  left: 15px;
  transform: rotate(180deg);
  transition: left 0.25s ease-in-out;
}
#container header .tile-text a > .arrow,
#container .tile a > .arrow, #container .tile a.hover-underline-animation > .arrow {
  transition: right 0.25s ease-in-out;
  position: absolute;
  /* top: 0.2em; */
  right: 0px;
  width: 50px;
  transition: right 0.25s ease-in-out;
  position: absolute;
  height: 15px;
  left: unset;
  bottom: 1px;
}
#container header .tile-text a:hover > .arrow,
#container .tile a:hover > .arrow, #container .tile a.hover-underline-animation:hover > .arrow {
  right: -10px;
}
#container .tile a.btn {
  display: inline-block;
  background: var(--gradient-five);
  color: var(--sabo-white);
  font-family: "Conneqt";
  font-weight: 300;
  text-decoration: none;
}
#container .tile a.btn.tag-pill {
  color: var(--sabo-label-grey);
  background: var(--sabo-grey);
}
#container .tile a.btn:hover {
  color: var(--sabo-white);
  background: var(--gradient-six);
}
#container .tile img {
  width: 100%;
}
#container .tile.tile--1.contact {
  padding: 0 20px;
}
@media (min-width: 820px) {
  #container .tile.tile--1.contact {
    padding: 0;
  }
}
#container .tile.tile--1.contact .inside {
  padding-top: 40px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 60px;
}
@media (min-width: 500px) {
  #container .tile.tile--1.contact .inside {
    padding-left: 50px;
    padding-right: 50px;
  }
}
@media (min-width: 600px) {
  #container .tile.tile--1.contact .inside {
    padding-left: 100px;
    padding-right: 100px;
  }
}
@media (min-width: 820px) {
  #container .tile.tile--1.contact .inside {
    padding-left: 50px;
    padding-right: 50px;
  }
}
#container .tile.tile--1.contact .inside .content {
  padding: 0;
}
@media (min-width: 768px) {
  #container .tile.tile--1.contact .inside .content {
    max-width: 500px;
    margin: 0 auto;
  }
}
@media (min-width: 820px) {
  #container .tile.tile--1.contact .inside .content {
    max-width: unset;
  }
}
@media (min-width: 769px) {
  #container .tile.tile--1 {
    padding: 0 40px;
  }
}
@media (min-width: 1024px) {
  #container .tile.noimage.tile--1 .tile-text{
    max-width: 1024px;
  }
}
#container .tile.tile--1 .inside {
  padding: 0 20px;
}
@media screen and (max-width: 766px) {
  #container .tile.tile--1 .inside h2 {
    padding-bottom: 0;
  }
}
@media (min-width: 500px) {
  #container .tile.tile--1 .inside {
    padding: 0 70px;
  }
}
@media (min-width: 769px) {
  #container .tile.tile--1 .inside {
    padding-right: 0px;
    padding-left: 0px;
  }
}
@media (min-width: 1024px) {
  #container .tile.tile--1 .inside {
    font-size: 40px;
    line-height: 43px;
  }
}
@media (min-width: 1300px) {
  #container .tile.tile--1 .inside {
    font-size: 50px;
    line-height: 55px;
  }
}
#container .tile.tile--1 > .inside .content {
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 0px;
}
#container .tile.tile--1 > .inside .content .tile-labels,
#container .tile.tile--1 > .inside .content .readmorelink {
  display: none;
}
@media (min-width: 820px) {
  #container .tile.tile--1 > .inside .content {
    padding-left: 70px;
    padding-right: 70px;
  }
  #container .tile.tile--1 > .inside .content .tile-labels,
#container .tile.tile--1 > .inside .content .readmorelink {
    display: flex;
  }
  #container .tile.tile--1 > .inside .content .selectlabel,
#container .tile.tile--1 > .inside .content .selectlabelhint {
    display: none;
  }
}
#container .tile.tile--1.boxed:not(.noimage) > .inside {
  background: #fff;
  padding: 20px;
}
@media (min-width: 769px) {
  #container .tile.tile--1.boxed:not(.noimage) > .inside {
    padding-left: 0;
  }
}
@media (min-width: 820px) {
  #container .tile.tile--1.boxed:not(.noimage) > .inside {
    padding: 160px 60px;
  }
}
@media (min-width: 1024px) {
  #container .tile.tile--1.boxed:not(.noimage) > .inside {
    padding: 100px 60px;
  }
}
@media (min-width: 1300px) {
  #container .tile.tile--1.boxed:not(.noimage) > .inside {
    padding: 100px;
  }
}
@media (min-width: 820px) {
  #container .tile.tile--1.boxed:not(.noimage) {
    background: url(/files/assets/images/2_content/Alpha-2600-Teaserhintergrund.svg) center center no-repeat;
    background-size: 160%;
  }
}
@media (min-width: 1024px) {
  #container .tile.tile--1.boxed:not(.noimage) {
    background-size: 140%;
  }
}
@media (min-width: 1580px) {
  #container .tile.tile--1.boxed:not(.noimage) {
    background-size: 100%;
  }
}
@media (min-width: 2600px) {
  #container .tile.tile--1.boxed:not(.noimage) {
    background-size: 70%;
  }
}
@media (min-width: 3600px) {
  #container .tile.tile--1.boxed:not(.noimage) {
    background-size: 65%;
  }
}
#container .tile.tile--1 > .inside {
  display: block;
  flex-direction: row-reverse;
  padding-left: 110px;
  padding: 0 20px;
  column-gap: 30px;
}
@media (min-width: 1024px) {
  #container .tile.tile--1 > .inside.querformat {
    display: flex !important;
  }
}
@media (min-width: 768px) {
  #container .tile.tile--1 > .inside.hochformat {
    display: flex !important;
  }
}
@media (min-width: 820px) {
  #container .tile.tile--1 > .inside {
    padding-right: 0px;
    padding-left: 0px;
    column-gap: 60px;
  }
}
#container .tile.tile--1 > .inside .content {
  padding-top: 30px;
  padding-left: 10px;
  padding-right: 10px;
  line-height: 20px;
}
@media (min-width: 1580px) {
  #container .tile.tile--1 > .inside .content {
    padding-top: 60px;
  }
}
@media (min-width: 768px) {
  #container .tile.tile--1 > .inside .content {
    padding-left: 20px;
    padding-right: 0px;
  }
}
@media (min-width: 820px) {
  #container .tile.tile--1 > .inside .content {
    padding-right: 20px;
  }
  #container .tile.tile--1 > .inside .content .tile-text {
    padding-right: 60px;
  }
}
@media (min-width: 1024px) {
  #container .tile.tile--1 > .inside .content {
    padding-left: 0px;
  }
  #container .tile.tile--1 > .inside .content .tile-text {
    padding-right: 0px;
  }
  #container .tile.section-codesys.tile--1 > .inside .content {
    padding-top: 0px;
    margin-top: -9px;
  }
}
@media (min-width: 1300px) {
  #container .tile.tile--1 > .inside .content {
    padding-left: 90px;
  }
}
@media (min-width: 820px) {
  #container .tile.tile--1 > .inside .content p {
    font-size: 18px;
    line-height: 23px;
  }
}
@media (min-width: 1580px) {
  #container .tile.tile--1 > .inside .content p {
    font-size: 20px;
    line-height: 26px;
  }
}
#container .tile.tile--1 > .inside > div {
  flex: 1;
}
#container .tile.tile--1 > .inside > div.tile-bg {
  padding-right: 0px;
  z-index: 1;
  justify-content: flex-end;
  align-items: flex-end;
}
@media (min-width: 1580px) {
  #container .tile.tile--1 > .inside > div.tile-bg {
    min-width: 670px;
  }
}
#container .tile.tile--1 > .inside > div.tile-bg .bg {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  mix-blend-mode: multiply;
  opacity: 15%;
  background: #000;
  z-index: 0;
}
#container .tile.tile--1 > .inside > div.tile-bg img {
  width: 100%;
  top: 0;
  left: -1px;
  mix-blend-mode: multiply 15%;
}
#container .tile.tile--2 {
  padding: 0 20px;
}
@media (min-width: 769px) {
  #container .tile.tile--2 {
    padding: 0 60px;
  }
}
@media (min-width: 769px) {
  #container .tile.tile--2 > .inside {
    max-width: 600px;
  }
}
@media (min-width: 820px) {
  #container .tile.tile--2 {
    padding: 0;
  }
}
#container .tile.tile--2.small .tile-bg picture {
  display: flex;
  justify-content: center;
  align-items: center;
}
#container .tile.tile--2.small .tile-bg img {
  width: auto;
  margin: 0 auto;
  max-height: 200px;
}
@media (min-width: 820px) {
  #container .tile.tile--2.small .tile-bg img {
    max-height: 150px;
  }
}
@media (min-width: 1024px) {
  #container .tile.tile--2.small .tile-bg img {
    max-height: 200px;
  }
}
@media (min-width: 1300px) {
  #container .tile.tile--2.small .tile-bg img {
    max-height: 300px;
  }
}
@media screen and (max-width: 1023px) {
  #container .tile.tile--3.flex-d--50 {
    padding-left: 40px;
    padding-right: 60px;
  }
  #container .tile.tile--3.flex-d--50 + .flex-d--50 {
    margin-top: calc(var(--responsive-margin-bottom) / 2);
  }
}
#container .tile.tile--2.small .inside {
  border: 0px solid var(--sabo-label-grey);
  margin-top: 0px;
  padding: 0;
}
#container .tile.tile--2.small .inside .tile-image {
  box-shadow: none;
  top: 0px;
  background: unset;
  padding: 0;
  margin: 0;
  background: #fff;
  box-shadow: rgba(0, 0, 0, 0.08) 0 10px 15px;
}
#container .tile.tile--2.small .inside .tile-image img {
  max-width: 100%;
  z-index: 10;
}
#container .tile.tile--2.small .inside .content {
  padding: 0;
  top: 0px;
  text-align: right;
  padding-top: 27px;
  padding-top: 0px;
}
#container .tile.tile--2.small .inside .content .tile-bg {
  padding: 20px 40px;
}
#container .tile.tile--2 > .inside {
  height: 100%;
  padding: 0 20px;
  /*Reemove

  .tile-headline {


      h2 {
          margin-bottom: 20px;
          @include breakpoint ('xxl') {
              font-size: 50px;
              ;
              line-height: 53px;
          }
      }
  }*/
}
@media (min-width: 769px) {
  #container .tile.tile--2 > .inside {
    padding: 0px 30px;
  }
}
#dma-app .tile.tile--2>.inside .tile-image img{
  max-width: 95% !important;
}
#container .tile.tile--2 > .inside .tile-image,
#container .tile.tile--2 > .inside .tile-bg {
  box-shadow: 0px 20px 30px 0 rgba(0, 0, 0, 0.07);
  padding: 0px 35px;
  z-index: 1;
  padding: 20px 20px;
  margin: 0 29px;
  margin: 0px;
  position: relative;
  background: var(--sabo-white);
}
@media (min-width: 820px) {
  #container .tile.tile--2 > .inside .tile-image,
#container .tile.tile--2 > .inside .tile-bg {
    text-align: center;
  }
}
#container .tile.tile--2 > .inside .tile-image img,
#container .tile.tile--2 > .inside .tile-bg img {
  max-width: 300px;
  max-height: 200px;
  margin: 0 auto;
  z-index: 10;
}
@media (min-width: 1024px) {
  #container .tile.tile--2 > .inside .tile-image img,
#container .tile.tile--2 > .inside .tile-bg img {
    max-width: 450px;
    max-height: 220px;
    margin: 0 auto;
  }
}
#container .tile.tile--2 > .inside .tile-image {
  text-align: center;
  height: 240px;
  display: flex;
  justify-content: center;
  align-items: center;
}
#container .tile.tile--2 > .inside .content {
  position: relative;
  padding: 40px 0 60px 0;
}
#container .tile.tile--2 > .inside .tile-label h3 {
  text-align: right;
  color: var(--sabo-label-grey);
}
#container .tile.tile--2 > .inside h2 {
  text-align: right;
  /*Reemove
  margin-bottom: 0;
  */
}
#container .tile.tile--2 > .inside .tile-subheadline {
  text-align: right;
  font-family: "Conneqt";
  color: var(--sabo-label-blue);
  /*Reemove
      h3{
      margin-bottom: 30px;

      @include breakpoint ('xxl') {
          margin-bottom: 50px;
      }
  }*/
  /*Reemove h3,*/
}
#container .tile.tile--2 > .inside .tile-subheadline p {
  line-height: 23px;
  font-size: 18px;
}
@media (min-width: 500px) {
  #container .tile.tile--2 > .inside .tile-subheadline p {
    line-height: 26px;
    font-size: 20px;
  }
}
@media (min-width: 769px) {
  #container .tile.tile--2 > .inside .tile-subheadline p {
    line-height: 28px;
    font-size: 25px;
  }
}
#container .tile.tile--2 > .inside .tile-text {
  margin-bottom: 40px;
}
@media (min-width: 500px) {
  #container .tile.tile--2 > .inside .tile-text {
    margin-bottom: 60px;
  }
}
@media (min-width: 820px) {
  #container .tile.tile--2 > .inside .tile-text p {
    font-size: 16px;
    line-height: 20px;
  }
}
@media (min-width: 1024px) {
  #container .tile.tile--2 > .inside .tile-text p {
    font-size: 20px;
    line-height: 26px;
  }
}
#container .tile.tile--2 > .inside .tile-button {
  margin: 0;
}
@media (min-width: 500px) {
  #container .tile.tile--2 > .inside .tile-button {
    margin: 0;
  }
}
#container .tile.tile--2 > .inside .tile-button a.btn {
  width: 100%;
  text-align: center;
}
@media (min-width: 1024px) {
  #container .tile.tile--2 > .inside .tile-button a.btn {
    width: auto;
  }
}
#container .tile.tile--2 > .inside .hover-underline-animation {
  padding-top: 30px;
  /* width: 15px; */
  /* padding-right: 70px; */
}
@media (min-width: 1024px) {
  #container .tile.tile--2 > .inside .hover-underline-animation {
    font-size: 20px;
    line-height: 26px;
  }
  #container .tile.tile--2 > .inside .hover-underline-animation .arrow {
    height: 23px;
  }
}
#container .tile.tile--2 > .inside .hover-underline-animation img {
  left: unset;
}
#container .tile.tile--2 > .inside .tile-button + .tile-link {
  margin-top: 0px;
}
#container .tile.tile--3 > .inside.center h2 {
  text-align: center;
}
.productslist #container .tile.tile--2 img {
  max-width: 200px;
  max-height: 200px;
}

@media (min-width: 769px) {
  #container .tile.tile--4 {
      padding: 0 40px;
  }
}
#container .tile.tile--4 .trust-bg {
  position: absolute;
  bottom: 0px;
  right: 30px;
  z-index: 10;
  max-height: 120px;
}
@media (min-width: 768px) {
  #container .tile.tile--4 .trust-bg {
    right: 100px;
  }
}
@media (min-width: 820px) {
  #container .tile.tile--4 .trust-bg {
    right: 30px;
  }
}
#container .tile.tile--4 .trust-bg img,
#container .tile.tile--4 .trust-bg picture {
  width: auto;
  max-height: 100px;
}
#container .tile.tile--4 > .inside {
  display: flex;
  flex-direction: row-reverse;
  padding-bottom: 20px;
  padding-left: 30px;
  padding-right: 20px;
}
@media (min-width: 768px) {
  #container .tile.tile--4 > .inside {
    padding-right: 60px;
    padding-left: 20px;
  }
}
@media (min-width: 1024px) {
  #container .tile.tile--4 > .inside {
    padding-right: 0px;
    padding-left: 0px;
    flex-direction: row;
  }
}
@media (min-width: 1300px) {
  #container .tile.tile--4 > .inside {
    flex-direction: row-reverse;
    padding-left: 0px;
    padding-right: unset;
  }
}
#container .tile.tile--4 > .inside > div {
  flex: 1;
  z-index: 1;
}
#container .tile.tile--4 > .inside .content {
  /*Reemove
  .tile-headline {
      h2{
      margin-top: 25px;
  }
  }*/
}
#container .tile.tile--4 > .inside .content .tile-headline,
#container .tile.tile--4 > .inside .content .tile-text,
#container .tile.tile--4 > .inside .content .tile-subheadline,
#container .tile.tile--4 > .inside .content .tile-link {
  /* padding-left: 10px; */
  padding-right: 20px;
}
#container .tile.tile--4 > .inside .content .tile-text {
  margin-bottom: 40px;
}
@media (min-width: 1024px) {
  #container .tile.tile--4 > .inside .content .tile-headline,
#container .tile.tile--4 > .inside .content .tile-text,
#container .tile.tile--4 > .inside .content .tile-subheadline,
#container .tile.tile--4 > .inside .content .tile-link {
    padding-left: 0px;
    padding-right: 20px;
  }
  #container .tile.tile--4 > .inside .content .tile-text {
    margin-bottom: 60px;
  }
}
#container .tile.tile--4 > .inside .content .tile-text > p:first-child > strong {
  font-size: 20px;
  line-height: 26px;
  margin-bottom: 10px;
  display: block;
}
@media (min-width: 820px) {
  #container .tile.tile--4 > .inside .content .tile-text > p:first-child > strong {
    font-size: 25px;
    line-height: 28px;
  }
}
#container .tile.tile--4 > .inside .content .tile-text ul {
  margin-top: 20px;
  margin-left: 20px;
}
@media (min-width: 500px) {
  #container .tile.tile--4 > .inside .content .tile-image {
    width: 65%;
  }
}
@media (min-width: 1024px) {
  #container .tile.tile--4 > .inside .content .tile-image {
    width: 133%;
  }
}
@media (min-width: 1400px) {
  #container .tile.tile--4 > .inside .content .tile-image {
    width: 120%;
  }
}
@media (min-width: 1300px) {
  #container .tile.tile--4 > .inside .content .tile-image {
    margin-left: calc(var(--responsive-inner-padding) * -1 * 0.75);
  }
}
@media (min-width: 768px) and (max-width:819px) {
  #container .tile.tile--4 > .inside .content {
      padding-left: 20px;
  }
} 
@media (min-width: 1024px) {
  #container .tile.tile--4 > .inside .content {
    width: 50%;
    max-width: 50%;
  }
}
@media (min-width: 1300px) {
  #container .tile.tile--4 > .inside .content {
    padding-left: 90px;
  }
}
#container .tile.tile--4 > .inside .tile-bg {
  position: absolute;
  width: 50%;
  right: 0;
  left: 50%;
}
@media (min-width: 1300px) {
  #container .tile.tile--4 > .inside .tile-bg {
    position: relative;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: auto;
  }
}
#container .tile.tile--4 > .inside .tile-bg img {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  max-width: 100%;
  right: auto;
  position: absolute;
  top: -20px;
  left: 0px;
  width: 100%;
  max-width: 100%;
  right: auto;
}
#container .tile.tile--4.noimage > .inside > .content {
  width: 100%;
  max-width: 100%;
}
@media (min-width: 1300px) {
  #container .tile.tile--4.noimage > .inside > .content {
    padding-left: 50px;
  }
}
#container .tile.tile--5 {
  padding: 0 20px;
}
@media (min-width: 820px) {
  #container .tile.tile--5 {
    background: url(/files/assets/images/2_content/Alpha-2600-Teaserhintergrund.svg) center center no-repeat;
    background-size: 160%;
  }
}
@media (min-width: 1024px) {
  #container .tile.tile--5 {
    background-size: 140%;
  }
}
@media (min-width: 1580px) {
  #container .tile.tile--5 {
    background-size: 100%;
  }
}
@media (min-width: 2600px) {
  #container .tile.tile--5 {
    background-size: 70%;
  }
}
@media (min-width: 3600px) {
  #container .tile.tile--5 {
    background-size: 65%;
  }
}
#container .tile.tile--5 > .inside {
  background: white;
  padding: 20px;
  background-size: 190%;
  box-shadow: 0px 20px 30px 0 rgba(0, 0, 0, 0.07);
}
#container .tile.tile--5 > .inside.compare {
  padding: 0;
  background: none;
}
@media (min-width: 820px) {
  #container .tile.tile--5 > .inside.compare {
    background: white;
    padding: 20px;
  }
  #container .tile.tile--5 > .inside.flexbox > .content {
    margin: 0;
    max-width: 100%;
    width: 100%;
  }
  #container .tile.tile--5 > .inside.flexbox > .content > div {
    min-width: auto;
  }
  #container .tile.tile--5 > .inside.flexbox > .content .tile-text {
    display: flex;
    /*Reemove
    h3 {
        margin-bottom: 20px;
        @include breakpoint('lg') {
        margin-bottom: 40px;}
        @include breakpoint('lg') {
        margin-bottom: 40px;}
    }*/
    column-gap: 50px;
  }
  #container .tile.tile--5 > .inside.flexbox > .content .tile-text > div {
    flex: 1;
    flex-basis: calc(50% - 25px);
    min-width: calc(50% - 25px);
  }
}
#container .tile.tile--5 > .inside.compare {
  box-shadow: none;
  margin-right: -20px;
}
@media (min-width: 500px) {
  #container .tile.tile--5 > .inside {
    padding: 40px;
    /*Reemove
    .tile-headline  h2{
        margin-bottom: 30px;
    } */
  }
  #container .tile.tile--5 > .inside.compare {
    padding: 60px 20px;
  }
}
@media (min-width: 820px) {
  #container .tile.tile--5 > .inside {
    padding: 60px;
  }
  #container .tile.tile--5 > .inside.compare {
    margin-right: auto;
    box-shadow: 0px 20px 30px 0 rgba(0, 0, 0, 0.07);
  }
}
@media (min-width: 1024px) {
  #container .tile.tile--5 > .inside {
    padding: 100px;
  }
  #container .tile.tile--5 > .inside.compare {
    padding: 100px 60px;
  }
}
#container .tile.tile--5 > .inside .content {
  position: relative;
  margin: 0 auto;
  padding-top: 160px;
  margin-top: 100px;
}
@media (min-width: 1300px) {
  #container .tile.tile--5 > .inside .content {
    width: 720px;
  }
}
@media (min-width: 500px) {
  #container .tile.tile--5 > .inside .content {
    padding-top: 42vw;
  }
}
@media (min-width: 820px) {
  #container .tile.tile--5 > .inside .content {
    max-width: 500px;
    margin: 0 auto;
    padding-top: 237px;
  }
}
@media (min-width: 1300px) {
  #container .tile.tile--5 > .inside .content {
    max-width: 600px;
    padding-top: 285px;
  }
}
#container .tile.tile--5 > .inside .content div {
  min-width: 100%;
  z-index: 0;
  position: relative;
}
#container .tile.tile--5 > .inside .content div h2 {
  display: flex;
  align-self: flex-end;
}
@media screen and (max-width: 819px) {
  #container .tile.tile--5 > .inside .content div.tile-text-2 {
    margin-top: 60px;
  }
}
#container .tile.tile--5 > .inside .content .tile-bg {
  z-index: 0;
  position: absolute;
}
#container .tile.tile--5 > .inside .content .tile-bg img {
  width: 100%;
  position: absolute;
  top: 0;
}
@media (min-width: 1300px) {
  #container .tile.tile--5 > .inside .content .tile-bg img {
    width: 600px;
  }
}
#container .tile.tile--5 > .inside .content .trust-bg {
  position: absolute;
  top: -80px;
  left: 0px;
  z-index: 10;
}
@media (min-width: 500px) {
  #container .tile.tile--5 > .inside .content .trust-bg {
    top: -90px;
    left: 0;
  }
}
#container .tile.tile--5 > .inside .content .trust-bg img,
#container .tile.tile--5 > .inside .content .trust-bg picture {
  max-height: 100px;
  width: auto;
}
@media (min-width: 500px) {
  #container .tile.tile--5 > .inside .content .trust-bg img,
#container .tile.tile--5 > .inside .content .trust-bg picture {
    max-height: 120px;
    width: auto;
  }
}
#container .tile.tile--5 > .inside .tile-link {
  margin-top: 30px;
  margin-top: 60px;
  margin-bottom: 60px;
  width: 284px;
  position: relative;
  z-index: 2;
}
@media (min-width: 768px) {
  #container .tile.tile--5 > .inside .tile-link {
    width: auto;
  }
}
@media (min-width: 820px) {
  #container .tile.tile--5 > .inside .tile-link {
    width: auto;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media (min-width: 1300px) {
  #container .tile.tile--5 > .inside .tile-link {
    max-width: 600px;
    margin-top: 60px;
    text-align: left;
  }
}
#container .tile.tile--5 > .inside .tile-link .arrow {
  position: relative;
  right: unset;
  left: 15px;
  top: 0.2em;
  height: 1em;
}
#container .tile.tile--5 > .inside .tile-link:has( > .hover-underline-animation), .readmore:has( > .hover-underline-animation){
  font-size: 20px;
  line-height: 26px;
  width: auto;
}
#container .tile.tile--5 > .inside .tile-link .hover-underline-animation .arrow {
  position: absolute;
  right: 0px;
  top: unset;
  left: unset;
  height: auto;
  bottom: 2px;
} 
#container .tile.tile--5 > .inside .tile-link .hover-underline-animation:hover > .arrow {
  right: -10px;
}
@media (max-width: 541px){
  #container .tile.tile--5 > .inside .tile-link .hover-underline-animation ,.readmore .hover-underline-animation{
    font-size: 16px;
  }
  #container .tile.tile--5 > .inside .tile-link .hover-underline-animation .arrow ,.readmore .hover-underline-animation .arrow{
    height: 16px;
  }
  #container .tile.tile--5 > .inside .tile-link .hover-underline-animation .arrow{
    bottom: 4px;
  }
}
@media (max-width: 541px) and (min-width: 500px){
  .readmore .hover-underline-animation .arrow{
    bottom: 4px;
  }
}
#container .tile.tile--5 .tile-bg {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: -1;
}
#container .tile.tile--5 .tile-bg picture {
  flex: 1;
}
#container .tile.tile--5.noimage > .inside > .content {
  padding-top: 0;
  margin-top: 0;
}
#container .tile.tile--5.noimage:not(.boxed) > .inside {
  padding-top: 0px;
  padding-bottom: 0;
}
#container .tile.tile--5.noimage.nobox.hasTrust:not(.boxed) > .inside > .content {
  padding-top: 60px;
}
#container .tile.tile--5.nobox {
  background: none;
}
#container .tile.tile--5.nobox > .inside {
  padding-top: 0;
  padding-bottom: 0;
  background: none;
  box-shadow: none;
}
@media (min-width: 820px) {
  #container .tile.tile--5.boxed:not(.noimage) > .inside {
    padding-top: 100px;
    padding-top: 200px;
  }
}
@media (min-width: 1024px) {
  #container .tile.tile--5.boxed:not(.noimage) > .inside {
    padding-top: 100px;
    padding-top: 200px;
  }
}
#container .tile.tile--6 {
  padding: 0 0px;
  flex-wrap: wrap;
}
@media (min-width: 820px) {
  #container .tile.tile--6 {
    padding: 0 0px !important;
    display: flex;
    flex-direction: row;
    max-width: 100%;
  }
  #container .tile.tile--6 > div {
    flex: 1 !important;
    align-items: flex-start !important;
  }
  #container .tile.tile--6 > div.content {
    padding: 0;
    padding-right: 20px;
  }
  #container .tile.tile--6 > div.content .tile-text {
    padding-left: 80px;
  }
  #container .tile.tile--6 > div.tile-bg img {
    max-width: calc(100% + 60px);
    height: auto;
    max-height: unset;
    /* max-width: unset; */
    width: auto;
    max-height: unset;
    padding-top: 0 !important;
  }
}
@media (width: 768px) {
  #container .tile.tile--6 > div.content {
    padding-right: 30px;
  }
}
@media (max-width: 819px) and (min-width: 769px) {
  #container .tile.tile--6 > div.content {
    padding-right: 80px;
    padding-left: 50px;
  }
}
@media (min-width: 1300px) {
  #container .tile.tile--6 > div.content {
    padding-right: 10px;
  }
}
#container .tile.tile--6:not(li) {
  padding-top: 60px;
  padding-right: 50px;
  padding-left: 50px;
}
@media (min-width: 1024px) {
  #container .tile.tile--6 > div {
    flex: 1;
    width: 50%;
    min-width: 50%;
    max-width: 50%;
  }
}
#container .tile.tile--6 .tile-bg {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: -1;
  flex: 1;
  margin-bottom: 20px;
  padding: 20px 0;
}
@media (min-width: 820px) {
  #container .tile.tile--6 .tile-bg {
    padding-top: 0;
  }
}
@media (max-width: 819px) {
  #container .tile.tile--6 .tile-bg {
    margin-bottom: 0;
    padding-bottom: 0;
  }
}
#container .tile.tile--6 .tile-bg img {
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 300px;
}
@media (min-width: 500px) {
  #container .tile.tile--6 .tile-bg img {
    max-height: 400px;
  }
}
#container .tile.tile--6.querformat .tile-bg {
  justify-content: flex-start;
}
@media (min-width: 500px) {
  #container .tile.tile--6.querformat .tile-bg {
    justify-content: center;
  }
}
#container .tile.tile--6.querformat .tile-bg img {
  max-height: unset;
}
@media (min-width: 500px) {
  #container .tile.tile--6.querformat .tile-bg img {
    max-height: unset;
  }
}
@media (min-width: 1024px) {
  #container .tile.tile--6.hochformat .tile-bg img {
    max-height: 500px;
  }
}
#container .tile.tile--6 .trust-bg {
  margin-bottom: 30px;
}
#container .tile.tile--6 .trust-bg img,
#container .tile.tile--6 .trust-bg picture {
  width: auto;
}
#container .tile.tile--6 .tile-label h3 {
  color: var(--sabo-label-grey);
}
#container .tile.tile--6 .tile-headline {
  /*Reemove
                  h2{
                  margin-bottom: 20px;
              }
  */
}
@media (min-width: 1024px) {
  #container .tile.tile--6 .tile-headline {
    overflow: hidden;
    margin-left: -20%;
  }
}
#container .tile.tile--6 .tile-subheadline h3 {
  color: var(--sabo-label-blue);
  /*Reemove
  font-size: 20px;
  line-height: 26px;

  margin-bottom: 30px;

  @include breakpoint('lg') {
      margin-bottom: 50px;
  }*/
}
@media (min-width: 820px) {
  #container .tile.tile--6 .tile-subheadline h3 {
    max-width: 90%;
    margin: auto;
    margin-right: 0;
    margin-bottom: 20px;
  }
}
#container .tile.tile--6 > .content {
  text-align: right;
}
/* @media (max-width: 343px) {
  #container .tile.tile--6 > .content {
    padding-left: 5px;
  }
} */
@media (max-width: 768px) {
  #container .tile.tile--6 > .content {
    padding: 0 20px;
  }
}
@media (min-width: 769px) {
  #container .tile.tile--6 > .content {
    padding: 0 40px;
  }
}
@media (min-width: 500px) and (max-width: 819px) {
  #container .tile.tile--6 > .content {
    margin-top: -20px;
  }
}
#container .tile.tile--6 > .content .tile-text {
  text-align: left;
  margin-bottom: 60px;
}
#container .tile.tile--6 > .content .tile-button {
  margin-top: 30px;
}
#container .tile.tile--7 .inside {
  padding: 0;
}
#container .tile.tile--7 .content {
  position: relative;
  margin: 0 20px;
}
@media (min-width: 820px) {
  #container .tile.tile--7 .content {
    margin: 0;
  }
}
#container .tile.tile--7 .tile-image picture {
  display: flex;
  min-height: 100vh;
}
#container .tile.tile--7 .tile-image img {
  width: auto;
  object-fit: cover;
  min-height: 100vh;
  /* min-width: 100vw; */
  left: 100%;
  transform: translateX(-100%);
}
#container .tile.tile--7 .tile-image picture:after {
  position: absolute;
  top: 0px;
  left: 0;
  right: 0;
  bottom: 0px;
  display: block;
  content: " ";
  opacity: 0.4;
  mix-blend-mode: multiply;
  /* z-index: 99999999; */
  background: #002A53;
}
#container .tile.tile--7 .tile-headline {
  /*Reemove
  h2{
  margin-bottom:0;
  }*/
  position: absolute;
  bottom: 100px;
  right: 20px;
  z-index: 2;
  text-align: right;
}
@media (min-width: 769px) {
  #container .tile.tile--7 .tile-headline {
    right: 60px;
  }
}
@media (min-width: 1280px) {
  #container .tile.tile--7 .tile-headline {
    right: 90px;
  }
}
@media (min-width: 1580px) {
  #container .tile.tile--7 .tile-headline {
    bottom: 100px;
  }
}
#container .tile.tile--7 .tile-headline h2 {
  margin-bottom: 20px;
  font-size: 35px;
  line-height: 35px;
}
@media (min-width: 500px) {
  #container .tile.tile--7 .tile-headline h2 {
    font-size: 40px;
    line-height: 40px;
  }
}
@media (min-width: 1024px) {
  #container .tile.tile--7 .tile-headline h2 {
    font-size: 60px;
    line-height: 60px;
  }
}
@media (min-width: 1580px) {
  #container .tile.tile--7 .tile-headline h2 {
    font-size: 100px;
    line-height: 100px;
  }
}
#container .tile.tile--7 .tile-headline h2,
#container .tile.tile--7 .tile-headline h3 {
  position: relative;
  left: 10%;
  color: #fff;
  max-width: 90%;
}
#container .tile.tile--7 .tile-headline h3 {
  /*Reemove
  font-size:20px;
  line-height:20px;
  */
  left: 0px;
  max-width: 100%;
  /*Reemove
  @include breakpoint('sm') {
      font-size:30px;
      line-height:30px;

      // max-width: 50%;

  }
  */
  /*Reemove
  @include breakpoint('xxl') {
      font-size:60px;
      line-height:60px;
  }*/
}
@media (min-width: 769px) {
  #container .tile.tile--7 .tile-headline h3 {
    left: calc(100% - 550px);
    max-width: 550px;
  }
}
@media (min-width: 820px) {
  #container .tile.tile--7 .tile-headline h3 {
    left: calc(100% - 500px);
    max-width: 500px;
  }
}
@media (min-width: 1024px) {
  #container .tile.tile--7 .tile-headline h3 {
    /*Reemovefont-size:40px;
    line-height:40px;*/
    left: calc(100% - 650px);
    max-width: 650px;
  }
}
#container .slider {
  padding: 0 10px;
  overflow: hidden;
}
@media (min-width: 820px) {
  #container .slider {
    padding: 0 0px !important;
  }
}
@media (min-width: 500px) {
  #container .slider .ce_sliderStart > h2 {
    max-width: 75%;
  }
}
@media (min-width: 690px) {
  #container .slider .ce_sliderStart > h2 {
    max-width: 55%;
  }
}
@media (min-width: 1024px) {
  #container .slider .ce_sliderStart > h2 {
    max-width: 50%;
  }
}
@media (min-width: 1300px) {
  #container .slider .ce_sliderStart > h2 {
    max-width: 660px;
  }
}
@media (min-width: 820px) {
  #container .splide__list {
    padding-top: 15px !important;
  }
}
@media (min-width: 1024px) {
  #container .splide__list {
    padding-top: 45px !important;
  }
}
#container .splide__pagination {
  bottom: unset;
  top: 187px;
  width: calc(100% - 100px);
  left: 30px;
  border-bottom: 2px solid var(--sabo-pagination-grey);
}
@media (max-width: 374px) {
  #container .splide__pagination {
    top: 197px;
  }
}
@media (max-width: 768px) {
  #container .splide__pagination {
    width: calc(100% - 40px);
    left: 20px;
  }
}
@media (min-width: 769px) {
  #container .splide__pagination {
    top: 167px;
    left: 156px;
    width: calc(100% - 376px);
  }
}
@media (min-width: 820px) {
  #container .splide__pagination {
    left: 97px;
    width: calc(100% - 257px);
  }
}
@media (min-width: 1024px) {
  #container .splide__pagination {
    left: -80px;
    margin: 0 auto !important;
    top: 240px;
    /* right: 150px; */
    width: calc(100% - 270px);
  }
}
#container .splide__pagination li[role=indicator] {
  position: absolute;
  border: 4px solid var(--sabo-pagination-grey);
  border: none;
  border-top: 2px solid var(--sabo-label-blue);
  border-bottom: 2px solid var(--sabo-label-blue);
  top: -1px;
  height: 0px;
  transition: 0.5s left ease-in-out;
}
#container .splide__pagination li[role=presentation] {
  flex: 1;
}
#container .splide__pagination li[role=presentation] button {
  display: none;
}
#container .splide__pagination:after {
  content: attr(data-active);
  width: 40px;
  height: 40px;
  border: 0px solid var(--sabo-lightblue);
  color: var(--sabo-lightblue);
  font-size: 60px;
  font-family: "Conneqt";
  font-weight: 300;
  line-height: 1;
  position: absolute;
  right: -100px;
  top: -45px;
  right: -150px;
  top: -70px;
  left: 0px;
}
@media (max-width: 768px) {
  #container .splide__pagination:after {
    left: -3px;
  }
}
@media (min-width: 769px) {
  #container .splide__pagination:after {
    left: -99px;
    top: -50px;
  }
}
@media (min-width: 820px) {
  #container .splide__pagination:after {
    right: unset;
    width: auto;
  }
}
@media (min-width: 1024px) {
  #container .splide__pagination:after {
    left: -60px;
    right: unset;
    left: -98px;
    height: 60px;
    top: -52px;
  }
}
#container .splide__pagination.withyear {
  width: calc(100% - 100px);
  left: 30px;
}
@media (min-width: 769px) {
  #container .splide__pagination.withyear {
    left: 145px;
    width: calc(100% - 375px);
  }
}
@media (min-width: 820px) {
  #container .splide__pagination.withyear {
    width: calc(100% - 285px);
    left: 115px;
  }
}
@media (min-width: 1024px) {
  #container .splide__pagination.withyear {
    left: 0px;
    width: calc(100% - 340px);
  }
}
#container .splide__pagination.withyear:after {
  left: 0px;
}
@media (min-width: 769px) {
  #container .splide__pagination.withyear:after {
    left: -120px;
  }
}
@media (min-width: 820px) {
  #container .splide__pagination.withyear:after {
    left: -120px;
    right: unset;
    width: auto;
  }
}
@media (min-width: 1024px) {
  #container .splide__pagination.withyear:after {
    left: -174px;
  }
}
#container .slider .splide__arrows {
  position: absolute;
  right: 20px;
  top: 140px;
  width: 140px;
  display: flex;
  column-gap: 20px;
}
@media (max-width: 374px) {
  #container .slider .splide__arrows {
    top: 150px;
  }
}
@media (min-width: 769px) {
  #container .slider .splide__arrows {
    right: 60px;
  }
}
@media (min-width: 820px) {
  #container .slider .splide__arrows {
    left: calc(100% - 140px);
  }
}
@media (min-width: 1024px) {
  #container .slider .splide__arrows {
    right: unset;
    position: relative;
    right: unset;
    top: 212px;
  }
}
@media (min-width: 1300px) {
  #container .slider .splide__arrows {
    left: calc(100% - 150px);
  }
}
#container .splide__arrow {
  width: 60px;
  height: 60px;
  background: var(--sabo-lightblue);
  border-radius: 0;
  left: 0;
  right: 0;
  opacity: 1;
  position: relative;
  display: inline-block;
  display: flex;
  justify-content: center;
  align-items: center;
  outline: 0;
}
#container .splide__arrow:not(:disabled):hover, #container .splide__arrow:not(:disabled):active {
  background: var(--sabo-orange);
}
#container .splide__arrow:disabled {
  background: var(--sabo-lightgrey);
}
#container .splide__arrow svg {
  height: 38px;
  width: 38px;
}
@media (min-width: 1024px) {
  #container .splide__slide {
    padding-top: 60px;
  }
}
#container .ripple {
  cursor: pointer;
  overflow: hidden;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
#container .ripple:before {
  content: "";
  display: block;
  position: absolute;
  pointer-events: none;
  transform-origin: center;
  top: calc(var(--y) * 1px);
  left: calc(var(--x) * 1px);
  width: calc(var(--d) * 1px);
  height: calc(var(--d) * 1px);
  background: var(--ripple-background, white);
  transform: translate(-50%, -50%) scale(var(--s, 1));
  opacity: calc(var(--o, 1) * var(--ripple-opacity, 0.3));
  transition: calc(var(--t, 0) * var(--ripple-duration, 600ms)) var(--ripple-easing, linear);
}
#container .tile-bg-border {
  position: absolute;
  top: 170px;
  border: 2px solid var(--sabo-label-grey);
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
}
@media (min-width: 769px) {
  #container .tile-bg-border {
    top: 19vw;
  }
}
@media (min-width: 820px) {
  #container .tile-bg-border {
    top: 12.5vw;
  }
}
@media (min-width: 1024px) {
  #container .tile-bg-border {
    top: 11vw;
  }
}
@media (min-width: 1580px) {
  #container .tile-bg-border {
    top: 170px;
  }
}
#container .flexswipe {
  display: flex;
  flex-direction: row;
  column-gap: 30px;
  justify-content: space-around;
  width: calc(160vw + 30px);
  /*Reemove
  .tile-headline {

      h2{
      margin-bottom: 10px !important;
      }
      @include breakpoint(820) {
          h2{
          margin-bottom: 30px !important;
          }
      }
  }*/
}
@media (min-width: 820px) {
  #container .flexswipe {
    width: 100%;
  }
}
#container .flexswipe .c1 {
  display: none;
}
@media (min-width: 1300px) {
  #container .flexswipe .c1 {
    display: block;
  }
}
#container .flexswipe .c1 .tile-headline h2,
#container .flexswipe .c1 .tile-bg img {
  visibility: hidden;
}
#container .flexswipe .c1 .tile-labels {
  width: calc(100% + 70px);
  text-align: left;
  padding-left: 0;
  margin-left: -20px;
}
#container .flexswipe .c1 .tile-labels div {
  font-family: "Conneqt";
  color: var(--sabo-lightblue);
  padding-left: 25px;
}
#container .flexswipe .c2 .tile-labels,
#container .flexswipe .c3 .tile-labels {
  position: relative;
  left: -20px;
  text-align: center;
  width: calc(80vw + 15px);
  padding-left: 0;
  padding-right: 0;
  text-indent: -15px;
}
@media (min-width: 820px) {
  #container .flexswipe .c2 .tile-labels,
#container .flexswipe .c3 .tile-labels {
    width: calc(100% + 70px);
    left: -20px;
    text-indent: -30px;
  }
}
@media (min-width: 1300px) {
  #container .flexswipe .c2 .tile-labels,
#container .flexswipe .c3 .tile-labels {
    width: calc(100% + 130px);
    left: -60px;
    text-indent: -10px;
  }
}
@media (min-width: 820px) {
  #container .flexswipe .c2 .tile-labels div,
#container .flexswipe .c3 .tile-labels div {
    padding-left: 0px;
  }
}
#container .flexswipe .c2 .tile-labels div:after,
#container .flexswipe .c3 .tile-labels div:after {
  position: absolute;
  top: 0;
  content: attr(data-headline);
  text-indent: -15px;
  display: block;
  width: 100%;
  font-family: "Conneqt";
  color: var(--sabo-lightblue);
  margin-bottom: 0;
  line-height: 26px;
  padding-top: 20px;
  padding-bottom: 20px;
  line-height: 22px;
  padding-top: 18px;
  padding-bottom: 18px;
  background-color: var(--sabo-lightgrey-table);
}
@media (min-width: 1300px) {
  #container .flexswipe .c2 .tile-labels div:after,
#container .flexswipe .c3 .tile-labels div:after {
    content: unset;
  }
}
#container .flexswipe .c2 .tile-bg,
#container .flexswipe .c3 .tile-bg {
  box-shadow: 0px 20px 30px 0 rgba(0, 0, 0, 0.07);
}
#container .flexswipe .c3 .tile-labels {
  position: relative;
  left: -35px;
  text-align: center;
  width: calc(80vw + 15px);
  text-indent: 15px;
}
#container .flexswipe .c3 .tile-labels > div:after {
  text-indent: 15px;
}
@media (min-width: 820px) {
  #container .flexswipe .c3 .tile-labels {
    width: calc(100% + 50px);
    text-indent: 0px;
    left: -30px;
  }
  #container .flexswipe .c3 .tile-labels > div:after {
    text-indent: 7.5px;
  }
}
#container .flexswipe > div {
  transform: translateX(0);
  transition: 0.5s transform ease-in-out;
}
#container .flexswipe[data-active="1"] > div {
  transform: translateX(-80vw);
}
@media (min-width: 820px) {
  #container .flexswipe > div {
    transform: unset;
  }
  #container .flexswipe[data-active="1"] > div {
    transform: unset;
  }
}
#container .flexswipe > div {
  flex: 1;
  width: 80vw;
  min-width: 80vw;
  position: relative;
  padding: 0px 20px;
}
@media (min-width: 820px) {
  #container .flexswipe > div {
    min-width: calc(50% - 20px);
    max-width: calc(50% - 20px);
  }
}
@media (min-width: 1300px) {
  #container .flexswipe > div {
    min-width: 30%;
    max-width: 30%;
  }
}
#container .flexswipe > div .tile-link {
  text-align: center !important;
  width: 100% !important;
}
#container .flexswipe > div .tile-link a.btn {
  width: 100%;
}
@media (min-width: 1024px) {
  #container .flexswipe > div .tile-link a.btn {
    width: auto;
    min-width: 150px;
  }
}
#container .flexswipe > div .tile-bg {
  position: relative;
  background: #fff;
  z-index: 1 !important;
  margin-bottom: 18px;
  padding: 20px;
}
#container .flexswipe > div .tile-bg picture {
  display: flex;
  height: 180px;
  justify-content: center;
  align-items: center;
}
#container .flexswipe > div .tile-bg picture img {
  width: auto;
  height: auto;
  max-height: 180px;
  max-width: 100%;
}
#container .flexswipe > div .tile-labels {
  width: 100%;
  display: block;
  margin-bottom: 0px;
  padding-bottom: 0px;
}
#container .flexswipe > div .tile-labels div {
  padding-top: 60px;
  line-height: 55px;
  font-size: 20px;
  position: relative;
  background-color: var(--sabo-grey-ligthen);
}
@media (min-width: 1300px) {
  #container .flexswipe > div .tile-labels div {
    padding-top: 0px;
  }
}
@media (min-width: 1300px) {
  #container .flexswipe > div .tile-labels div:nth-child(odd) {
    background-color: var(--sabo-lightgrey-table);
  }
  #container .flexswipe > div .tile-labels div:nth-child(even) {
    background-color: var(--sabo-grey-ligthen);
  }
}
#container .flexswipe .tile-headline h2 {
  /*Reemove
  font-size: 34px;
  line-height: 38px;*/
  padding-bottom: 0 !important;
}
@media (min-width: 1300px) {
  #container .flexswipe .tile-headline h2 {
    /*Reemove
    font-size: 35px;
    line-height: 38px;
    */
  }
}
@media (min-width: 1580px) {
  #container .flexswipe .tile-headline h2 {
    /*Reemove
    font-size: 40px;
    line-height: 46px;
    */
  }
}
#container .flexswipe .tile-bg-border {
  top: 170px;
}
@media (min-width: 769px) {
  #container .flexswipe .tile-bg-border {
    top: 19vw;
  }
}
@media (min-width: 820px) {
  #container .flexswipe .tile-bg-border {
    top: 12.5vw;
  }
}
@media (min-width: 1024px) {
  #container .flexswipe .tile-bg-border {
    top: 90px;
  }
}
@media (min-width: 1580px) {
  #container .flexswipe .tile-bg-border {
    top: 90px;
  }
}

#container .contact.tile > .inside {
  background: white;
  box-shadow: 0px 20px 30px 0 rgba(0, 0, 0, 0.07);
  padding-top: 100px;
  padding-bottom: 60px;
}
#container .contact.tile > .inside h2 {
  text-align: center;
  padding-bottom: 50px;
}
#container .contact.tile > .inside .content .tile-headline h2 {
  text-align: center;
  padding-bottom: 0;
  padding-top: 40px;
}
#container .contact.tile > .inside .readmorelink a {
  transform: translateX(-95px) translateY(30px);
  transform: translateX(-155px) translateY(30px);
}
@media (min-width: 820px) {
  #container .contact.tile > .inside .readmorelink a.h2 {
    transform: translateX(35px) translateY(-13px);
  }
}
@media (min-width: 821px) {
  #container .contact.tile > .inside .readmorelink a.h2 {
    transform: translateX(-50px) translateY(7px);
  }
}
@media (min-width: 820px) {
  #container .contact.tile > .inside .readmorelink a.hover-underline-animation {
    font-size: 20px;
    line-height: 26px;
    transform: translateX(-150px) translateY(34px);
  }
}
@media (min-width: 897px) {
  #container .contact.tile > .inside .readmorelink a.hover-underline-animation {
    transform: translateX(0) translateY(9px);
  }
}
@media (min-width: 1024px) {
  #container .contact.tile > .inside .readmorelink a.hover-underline-animation {
    font-size: 20px;
    line-height: 26px;
    transform: translateX(0) translateY(9px);
  }
}
@media (min-width: 1300px) {
  #container .contact.tile > .inside .readmorelink a.hover-underline-animation {
    transform: translateX(0) translateY(10px);
  }
}
@media (min-width: 1580px) {
  #container .contact.tile > .inside .readmorelink a.hover-underline-animation {
    top: -0.4em;
    transform: translateX(0) translateY(5px);
  }
}
#container .contact.tile > .inside .readmorelink a.hover-underline-animation + a.h2 {
  transform: translateX(-50px) translateY(7px);
  color: var(--sabo-lightblue);
  
}
@media (min-width: 820px) {
  #container .contact.tile > .inside .readmorelink a.hover-underline-animation + a.h2 {
    transform: translateX(180px) translateY(-10px);
  }
}
@media (min-width: 897px) {
  #container .contact.tile > .inside .readmorelink a.hover-underline-animation + a.h2 {
    transform: translateX(-10px) translateY(19px);
    font-size: 31px;
    padding-right: 4px;
  }
}
@media (min-width: 1300px) {
  #container .contact.tile > .inside .readmorelink a.hover-underline-animation + a.h2 {
    transform: translateX(-10px) translateY(47px);
    font-size: 59px;
  }
}
#container .contact.tile > .inside .readmorelink h2 {
  text-align: center;
  padding-bottom: 10px;
}
#container .contact.tile > .inside .readmorelink .readmoreimg {
  max-width: 120px;
  top: 2px;
}
@media (min-width: 1024px) {
  #container .contact.tile > .inside .readmorelink .readmoreimg {
    max-width: 150px;
  }
}

form .widget {
  margin-bottom: 40px;
}
form input {
  padding: 0 0 0 30px;
  width: 480px;
  height: 50px;
}
form input[type=search] {
  padding-left: 20px;
}
form input[type=search], form input[type=password], form input[type=text] {
  padding-left: 30px;
}
form .widget > label {
  display: none;
}
.conversoft-select, button.btn.submit {
  cursor: pointer;
}
form input,
form textarea,
form .conversoft-select {
  width: 100%;
  height: 50px;
  padding: 0em 0 0 0px;
  position: relative;
  color: var(--sabo-darkgrey);
  border: 2px solid var(--sabo-lightblue);
}
form input.hasTooltip,
form textarea.hasTooltip,
form .conversoft-select.hasTooltip {
  width: 480px;
}
form input > span,
form textarea > span,
form .conversoft-select > span {
  content: "";
  width: 50px;
  top: 0;
  bottom: 0;
  right: 0px;
  background: var(--sabo-lightblue);
  color: transparent;
  appearance: unset;
  position: absolute;
  transform: rotate(0);
  transition: transform 0.2s ease-in-out;
}
@media (min-width: 1024px) {
  form input > span,
form textarea > span,
form .conversoft-select > span {
    width: 60px;
  }
}
form input:after,
form textarea:after,
form .conversoft-select:after {
  content: "";
  width: 50px;
  top: 0;
  bottom: 0;
  right: 0px;
  color: transparent;
  appearance: unset;
  position: absolute;
  background: url(/files/assets/images/icons/arrowdropdown.svg) no-repeat center center;
  transform: rotate(0);
  transition: transform 0.3s ease-in-out;
}
@media (min-width: 1024px) {
  form input:after,
form textarea:after,
form .conversoft-select:after {
    width: 60px;
  }
}
form input.open:after,
form textarea.open:after,
form .conversoft-select.open:after {
  background: url(/files/assets/images/icons/arrowdropdown.svg) no-repeat center center;
  transform: rotate(-180deg);
}
form input:before,
form textarea:before,
form .conversoft-select:before {
  content: attr(data-value);
  font-family: "Zilla Slab";
  color: var(--sabo-label-grey);
  font-size: inherit;
  
  line-height: 50px;
  position: absolute;
  top: -2px;
  left: 30px;
  right: 0;
}
.callback_formular .form-confirmation,.callback_formular .form-confirmation p,.callback_formular .form-confirmation h1,.callback_formular .form-confirmation h2,.callback_formular .form-confirmation h3 {
  color:var(--sabo-white)
}
@media (min-width: 1024px) {
  form input:before,
form textarea:before,
form .conversoft-select:before {
  font-size: 20px;
}
}
@media (min-width: 1024px) {
  form input:before,
form textarea:before,
form .conversoft-select:before {
    line-height: 60px;
    
  }
}
form input.selected:before,
form textarea.selected:before,
form .conversoft-select.selected:before {
  color: var(--sabo-darkgrey);
}
form input.open > ul,
form textarea.open > ul,
form .conversoft-select.open > ul {
  pointer-events: none;
  height: auto;
  overflow: hidden;
  opacity: 1;
  z-index: 10;
}
form input > ul,
form textarea > ul,
form .conversoft-select > ul {
  pointer-events: none;
  position: absolute;
  top: 50px;
  left: 0;
  right: 0;
  height: 0px;
  overflow: hidden;
  padding-left: 2px;
  padding-right: 2px;
  box-shadow: 0px 20px 30px 0 rgba(0, 0, 0, 0.07);
  opacity: 0;
  transition: 0.25s opacity ease-in;
}
@media (min-width: 1024px) {
  form input > ul,
form textarea > ul,
form .conversoft-select > ul {
    top: 60px;
  }
}
form input > ul li,
form textarea > ul li,
form .conversoft-select > ul li {
  pointer-events: all;
  padding-left: 30px;
  line-height: 50px;
}
@media (min-width: 1024px) {
  form input > ul li,
form textarea > ul li,
form .conversoft-select > ul li {
    line-height: 60px;
  }
}
form input > ul li.active,
form textarea > ul li.active,
form .conversoft-select > ul li.active {
  font-weight: 600;
}
form input > ul li:nth-child(even),
form textarea > ul li:nth-child(even),
form .conversoft-select > ul li:nth-child(even) {
  background: var(--sabo-lightgrey-bg);
}
form input > ul li:nth-child(odd),
form textarea > ul li:nth-child(odd),
form .conversoft-select > ul li:nth-child(odd) {
  background: var(--sabo-white);
}
form input > ul li:hover, form input > ul li:active,
form textarea > ul li:hover,
form textarea > ul li:active,
form .conversoft-select > ul li:hover,
form .conversoft-select > ul li:active {
  font-weight: 600;
}
form input > ul li:active,
form textarea > ul li:active,
form .conversoft-select > ul li:active {
  color: var(--sabo-orange);
}
form input > ul li span:after,
form textarea > ul li span:after,
form .conversoft-select > ul li span:after {
  bottom: 10px;
}
form textarea {
  padding: 10px 30px 10px 30px;
  min-height: 5em;
  line-height: 30px;
}
form select:after {
  background: url(/files/assets/images/icons/arrowdropdown.svg) no-repeat center center;
}
form fieldset {
  padding: 0;
  margin-bottom: 25px;
}
form .checkbox_container span {
  margin-bottom: 20px;
}
form .checkbox_container span,
form .checkbox_container label {
  display: inline-block;
  line-height: 1.25;
}
form .checkbox_container legend {
  margin-bottom: 20px;
  display: block;
}
form .checkbox_container input {
  display: none;
}
form .checkbox_container label {
  padding-top: 0.5em;
  padding-left: 50px;
  position: relative;
  pointer-events: all;
  z-index: 1;
  font-size: 18px;
  line-height: 23px;
  cursor: pointer;
}
form .checkbox_container label:after {
  background-color: #fff;
  pointer-events: none;
  z-index: 0;
  position: absolute;
  left: 0;
  top: 5px;
  content: "";
  width: 30px;
  height: 30px;
  width: 25px;
  height: 25px;
  border: 2px solid var(--sabo-lightblue);
}
form .radio_container {
  gap: 30px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
}
form .radio_container span {
  flex: 1;
  margin-bottom: 0px;
}
form .radio_container span,
form .radio_container label {
  display: inline-block;
  line-height: 1.25;
}
form .radio_container legend {
  margin-bottom: 20px;
  display: block;
}
form .radio_container input:checked + label:after {
  background: url(/files/assets/images/icons/radiochecked.svg) no-repeat center center;
}
form .radio_container input {
  display: none;
}
form .radio_container label {
  padding-top: 0.5em;
  padding-left: 50px;
  position: relative;
  pointer-events: all;
  z-index: 1;
}
form .radio_container label:after {
  pointer-events: none;
  z-index: 0;
  position: absolute;
  left: 0;
  top: 0px;
  content: "";
  width: 30px;
  height: 30px;
  border: 2px solid var(--sabo-lightblue);
  background: url(/files/assets/images/icons/radiounchecked.svg) no-repeat center center;
}

textarea,
::placeholder,
input {
  font-family: "Zilla Slab";
  color: var(--sabo-label-grey);
  font-size: 16px;
  line-height: 50px;
}
@media (min-width: 1024px) {
  textarea,
::placeholder,
input {
    font-size: 20px;
    line-height: 60px;
  }
  footer textarea,
footer ::placeholder,
footer input {
    font-size: 16px;
  }
}
@media (min-width: 1024px) and (min-width: 1280px) {
  footer textarea,
footer ::placeholder,
footer input {
    font-size: 20px;
    line-height: 26px;
  }
}

.conversoft-select {
  width: 100%;
  height: 50px;
  padding: 0.25em 0 0 0px;
  position: relative;
  color: var(--sabo-darkgrey);
  border: 2px solid var(--sabo-lightblue);
}
@media (min-width: 1024px) {
  .conversoft-select {
    height: 60px;
  }
}
.conversoft-select li.active .hover-underline-animation:after,
.conversoft-select li.active .active.hover-underline-animation:after,
.conversoft-select li.active .active.hover-underline-animation:after,
.conversoft-select li:hover .hover-underline-animation:after,
.conversoft-select li:hover .active.hover-underline-animation:after,
.conversoft-select li:hover .active.hover-underline-animation:after,
.conversoft-select .hover-underline-animation:hover:after,
.conversoft-select .active.hover-underline-animation:after,
.conversoft-select .active.hover-underline-animation:hover:after {
  width: 100%;
}
.conversoft-select.hasTooltip {
  width: 480px;
}
.conversoft-select > span {
  content: "";
  width: 50px;
  top: 0;
  bottom: 0;
  right: 0px;
  background: var(--sabo-lightblue);
  color: transparent;
  appearance: unset;
  position: absolute;
  transform: rotate(0);
  transition: transform 0.2s ease-in-out;
}
@media (min-width: 1024px) {
  .conversoft-select > span {
    width: 60px;
  }
}
.conversoft-select:after {
  content: "";
  width: 50px;
  top: 0;
  bottom: 0;
  right: 0px;
  color: transparent;
  appearance: unset;
  position: absolute;
  background: url(/files/assets/images/icons/arrowdropdown.svg) no-repeat center center;
  transform: rotate(0);
  transition: transform 0.3s ease-in-out;
}
@media (min-width: 1024px) {
  .conversoft-select:after {
    width: 60px;
  }
}
.conversoft-select.open:after {
  background: url(/files/assets/images/icons/arrowdropdown.svg) no-repeat center center;
  transform: rotate(-180deg);
}
.conversoft-select:before {
  content: attr(data-value);
  font-family: "Zilla Slab";
  color: var(--sabo-label-grey);
  font-size: 20px;
  line-height: 50px;
  position: absolute;
  top: -2px;
  left: 30px;
  right: 0;
}
@media (min-width: 1024px) {
  .conversoft-select:before {
    line-height: 60px;
  }
}
.conversoft-select.selected:before {
  color: var(--sabo-darkgrey);
}
.conversoft-select.open > ul {
  pointer-events: none;
  height: auto;
  overflow: hidden;
  opacity: 1;
  z-index: 10;
  background: #fff;
}
.conversoft-select > ul {
  pointer-events: none;
  position: absolute;
  top: 50px;
  left: 0;
  right: 0;
  height: 0px;
  overflow: hidden;
  padding-left: 2px;
  padding-right: 2px;
  box-shadow: 0px 20px 30px 0 rgba(0, 0, 0, 0.07);
  opacity: 0;
  transition: 0.25s opacity ease-in;
}
@media (min-width: 1024px) {
  .conversoft-select > ul {
    top: 60px;
  }
}
.conversoft-select > ul li {
  pointer-events: all;
  padding-left: 30px;
  line-height: 50px;
}
@media (min-width: 1024px) {
  .conversoft-select > ul li {
    line-height: 60px;
  }
}
.conversoft-select > ul li.active {
  font-weight: 600;
}
.conversoft-select > ul li:nth-child(even) {
  background: var(--sabo-lightgrey-bg);
}
.conversoft-select > ul li:nth-child(odd) {
  background: var(--sabo-white);
}
.conversoft-select > ul li:hover, .conversoft-select > ul li:active {
  font-weight: 600;
}
.conversoft-select > ul li:active {
  color: var(--sabo-orange);
}
.conversoft-select > ul li span:after {
  bottom: 0px;
}

.invisible {
  display: none;
}

h1 .header_sabo .tile-headline h1 + span {
  max-width: 100%;
  hyphens: auto;
  -webkit-hyphens:auto;
}
/* PORNO !! */
.hover-underline-animation {
  display: inline-block;
  position: relative;
  text-decoration: none;
  margin: 0px;
}

.active.hover-underline-animation,
.hover-underline-animation:hover {
  text-decoration: none !important;
}

li .inactive.hover-underline-animation:after,
li .inactive.active.hover-underline-animation:after,
.inactive.hover-underline-animation:after,
.inactive.active.hover-underline-animation:after {
  background-color: var(--sabo-label-grey);
}

li .hover-underline-animation:after,
li .active.hover-underline-animation:after,
.hover-underline-animation:after,
.active.hover-underline-animation:after {
  content: "";
  position: absolute;
  width: 100%;
  transform: scaleX(0);
  width: calc(100% - 80px);
  width: calc(100% - 61px);
  height: 2px;
  bottom: -2px;
  left: 0;
  background-color: var(--sabo-orange);
  transform-origin: bottom right;
  transition: transform 0.25s ease-out;
}
header li .hover-underline-animation:after,
header li .active.hover-underline-animation:after,
header .hover-underline-animation:after,
header .active.hover-underline-animation:after {
  width: unset;
  right: 61px;
}

li.active .hover-underline-animation:after,
li.active .active.hover-underline-animation:after,
li.active .active.hover-underline-animation:after,
.hover-underline-animation:hover:after,
.active.hover-underline-animation:after,
.active.hover-underline-animation:hover:after {
  transform: scaleX(1);
  transform-origin: bottom left;
  width: calc(100% - 61px);
}
.mod_search_right .hover-underline-animation:hover:after, .mod_search_right .active.hover-underline-animation:hover:after {
  width: calc(100% - 75px);
}
body {
  position: relative;
  overflow-x: hidden;
  font-family: "Zilla Slab";
  margin: 0;
  background-color: var(--sabo-lightgrey-bg);
}
body.nav-open {
  background: transparent linear-gradient(180deg, #fff 0%, var(--sabo-lightgrey-bg) 100%) 0% 0% no-repeat padding-box;
}
body.nav-open {
  overflow: hidden;
}
body.nav-open #hamburger ~ span:nth-child(2), body.quicksearch-open #quicksearch-close-input ~ span:nth-child(2){
  transform: translateY(10px) rotate(-45deg);
}
body.nav-open #hamburger ~ span:nth-child(3) {
  opacity: 0;
}
body.quicksearch-open #quicksearch-close-input ~ span:nth-child(3) {
  opacity: 0;
  transition: 0s opacity ease-in-out !important;
}
body.nav-open #hamburger ~ span:nth-child(4), body.quicksearch-open #quicksearch-close-input ~ span:nth-child(4) {
  transform: translateY(-6px) rotate(45deg);
}
body:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  z-index: 0;
  height: 1500px;
  background: transparent linear-gradient(180deg, #fff 0%, var(--sabo-lightgrey-bg) 100%) 0% 0% no-repeat padding-box;
}
body .fixedbg {
  position: absolute;
  top: 0;
  mix-blend-mode: luminosity;
  left: 0;
  right: 0;
  opacity: 0;
  bottom: 0;
  background-image: url(/files/assets/images/logo_und_siegel/Alpha-HG-grau.svg);
  top: 0px;
  position: fixed;
  background-position: -880px -790px;
  max-width: 250%;
  margin: 0 auto;
  background-size: 190%;
  filter: grayscale(1);
  background-size: 100%;
  background-repeat: repeat-y;
  background-size: unset;
  background-position: center -938px;
  max-width: unset;
  z-index: -1;
  z-index: 0;
  background-size: 320%;
  background-position: top center;
}
@media (min-width: 1024px) {
  body .fixedbg {
    opacity: 1;
  }
}
body #wrapper {
  width: 100%;
  max-width: 100vw;
  overflow: hidden;
}
body #wrapper:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  z-index: -1;
  z-index: 0;
  height: 1030px;
  background: transparent linear-gradient(180deg, #fff 0%, var(--sabo-lightgrey-bg) 100%) 0% 0% no-repeat padding-box;
  box-shadow: 0px 2px 20px 0px #fafafa;
  box-shadow: 0px 50px 50px 50px #fafafa;
}
body #container {
  position: relative;
  min-height: 100vh;
}
@media screen and (max-width: 819px) {
  body #container {
    overflow: hidden;
  }
}
body #container nav {
  height: 60px;
  padding: 0 var(--responsive-padding);
  z-index: 100;
}
body #container nav .inside {
  position: relative;
  max-width: var(--resonsive-max-width);
  margin: 0 auto;
}
@media (min-width: 820px) {
  body #container nav .inside {
    max-width: calc(var(--resonsive-max-width) - 2 * var(--responsive-padding));
  }
}
body #container .mod_article > section .inside, body #container .mod_article > section.slider, body #container .mod_article > header .inside, body #container .mod_article > header.slider {
  position: relative;
  max-width: var(--resonsive-max-width);
}
@media (min-width: 769px) {
  body #container .mod_article > section .inside, body #container .mod_article > section.slider, body #container .mod_article > header .inside, body #container .mod_article > header.slider {
    max-width: calc(var(--resonsive-max-width) - 2 * var(--responsive-padding));
    margin: 0 auto;
    padding-left: var(--responsive-padding);
    padding-right: var(--responsive-padding);
  }
}
@media (min-width: 820px) {
  body #container .mod_article > section .inside, body #container .mod_article > section.slider, body #container .mod_article > header .inside, body #container .mod_article > header.slider {
    max-width: calc(var(--resonsive-max-width) - 2 * var(--responsive-padding));
    margin: 0 auto;
    padding-left: var(--responsive-padding);
    padding-right: var(--responsive-padding);
  }
}
@media (min-width: 1300px) {
  body #container .mod_article > section > .inside.slider, body #container .mod_article > header > .inside.slider {
    max-width: calc(var(--resonsive-max-width) - 2 * var(--responsive-padding) - 180px);
  }
}
body #container .mod_article > header .inside {
  padding: 0;
}
@media (max-width: 500px) {
  body #container .mod_article > header .inside {
    min-height: 160px;
  }
}
body #container .mod_article {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  column-gap: var(--responsive-inner-padding);
  justify-content: center;
  column-gap: 30px;
  flex-direction: row;
  flex-basis: 100%;
}
@media (min-width: 1300px) {
  body #container .mod_article {
    column-gap: 60px;
  }
}
body #container .mod_article > header {
  flex-basis: 100%;
}
body #container .mod_article > header + section:nth-child(2) {
  margin-top: 0px;
}
/* body #container .mod_article > section:nth-child(1) {
  margin-top: 60px;
}
@media (min-width: 1024px) {
  body #container .mod_article > section:nth-child(1) {
    margin-top: 80px;
  }
} */
body #container .mod_article.flex-d--50 > .inside .content {
  padding-left: 0;
  padding-right: 0;
}
body #container .mod_article.slider {
  padding-left: 0;
  padding-right: 0;
}
body #container .mod_article.flex-d--50 > .inside {
  margin-left: calc(var(--responsive-padding) / 2);
  flex-basis: calc(50% - var(--responsive-inner-padding) * 2);
  max-width: calc(50% - var(--responsive-inner-padding) * 2);
  min-width: calc(50% - var(--responsive-inner-padding) * 2);
  width: calc(50% - var(--responsive-inner-padding) * 2);
  margin-left: unset;
  margin-right: unset;
  flex-basis: unset;
  width: unset;
  flex: 1;
}
body #container > .inside > header {
  margin-bottom: 160px;
}
body #container section:not(.remove_bottom_spacing):not(.js-remove_bottom_spacing):not(.half_bottom_spacing) {
  margin-bottom: var(--responsive-margin-bottom);
}
body #container section:not(.remove_bottom_spacing):not(.js-remove_bottom_spacing):not(.half_bottom_spacing).logolist {
  margin-bottom: 100px !important;
}
@media (min-width: 1300px) {
  body #container section:not(.remove_bottom_spacing):not(.js-remove_bottom_spacing):not(.half_bottom_spacing).logolist {
    margin-bottom: 160px !important;
  }
}
body #container section:not(.remove_bottom_spacing):not(.js-remove_bottom_spacing):not(.half_bottom_spacing).flex-d--50.tile--2 {
  margin-bottom: 100px;
}
body #container section:not(.remove_bottom_spacing):not(.js-remove_bottom_spacing):not(.half_bottom_spacing).flex-d--50.tile--2 + .tile--2.flex-d--50 {
  margin-bottom: var(--responsive-margin-bottom);
}
@media (min-width: 769px) {
  body #container section:not(.remove_bottom_spacing):not(.js-remove_bottom_spacing):not(.half_bottom_spacing).flex-d--50.tile--2 + .tile--2.flex-d--50 {
    margin-bottom: var(--responsive-margin-bottom);
  }
}
@media (min-width: 820px) {
  body #container section:not(.remove_bottom_spacing):not(.js-remove_bottom_spacing):not(.half_bottom_spacing).flex-d--50.tile--2 + .tile--2.flex-d--50 {
    margin-bottom: 100px;
  }
}
body #container section.half_bottom_spacing {
  margin-bottom: calc(var(--responsive-margin-bottom) / 2);
}
@media screen and (min-width: 500px) {
  body #container section:last-of-type.downloads_sabo {
    margin-bottom: 0 !important;
    flex-basis: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    width: 100% !important;
  }
}
body #container .mod_article .logolist {
  width: 100%;
  padding: 0 20px;
}
body #container .mod_article .logolist .inside {
  background: #fff;
  box-shadow: 0px 20px 30px 0 rgba(0, 0, 0, 0.07);
}
body #container .mod_article .logolist .inside img {
  width: 100%;
}
body .tile-labels {
  padding: 0.75em 20px;
  margin: 0 auto;
  gap: 20px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  padding-bottom: 60px;
}
@media (min-width: 769px) {
  body .tile-labels {
    padding: 0.75em 3em;
  }
}
@media (min-width: 769px) {
  body .tile-labels {
    padding: 0.75em 3em;
    margin-bottom: 60px;
  }
}
@media (min-width: 1024px) {
  body .tile-labels {
    padding: 0 1em;
    max-width: 800px;
    margin-bottom: 100px;
  }
}
@media (min-width: 1300px) {
  body .tile-labels {
    width: 974px;
    max-width: unset;
  }
}
body .tile-labels.flex-d--100 .inside,
body .downloads_sabo.flex-d--100 .inside {
  border-top: 2px solid rgba(0, 0, 0, 0.1);
  width: calc(100% - 20px);
  left: 10px;
  padding-top: 50px;
}
body .tile-labels.flex-d--50 ul,
body .downloads_sabo.flex-d--50 ul {
  align-items: flex-end;
  flex-direction: column;
}
body .tile-labels.flex-d--50 li .conversoft-select,
body .downloads_sabo.flex-d--50 li .conversoft-select {
  width: max-content;
  max-width: 100%;
  padding-right: 0px;
}
body .tile-labels h3,
body .downloads_sabo h3 {
  font-size: 16px;
  line-height: 28px;
  text-align: center;
  margin-bottom: 21px;
  letter-spacing: 1px;
}
body .downloads_sabo.flex-d--50 {
  margin-bottom: calc(var(--responsive-margin-bottom) / 2);
}
body .downloads_sabo.flex-d--50 + body .downloads_sabo.flex-d--50 {
  margin-bottom: calc(var(--responsive-margin-bottom));
}
@media (min-width: 768px) {
  body .downloads_sabo.flex-d--50 {
    margin-bottom: calc(var(--responsive-margin-bottom));
  }
}
body .downloads_sabo.flex-d--50 ul.downloads {
  align-items: flex-end;
  flex-direction: column;
  margin: 0;
  padding: 0 60px;
}
@media (min-width: 820px) {
  body .downloads_sabo.flex-d--50 ul.downloads {
    padding: 0;
  }
}
body .downloads_sabo.flex-d--50 li {
  min-width: 100%;
}
body .downloads_sabo.flex-d--50 li .conversoft-select {
  width: 100%;
}
body .downloads_sabo h3 {
  font-size: 16px;
  line-height: 28px;
  text-align: center;
  margin-bottom: 21px;
  letter-spacing: 1px;
}
body .downloads {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  justify-content: center;
  margin-bottom: 100px;
  margin-bottom: 60px;
  padding: 0 var(--responsive-inner-padding);
}
body .downloads > a {
  letter-spacing: 1px;
}
body .downloads li {
  min-width: 100%;
  max-width: 100%;
}
@media (min-width: 500px) {
  body .downloads li {
    min-width: 20%;
  }
}
body .downloads li .conversoft-select {
  padding: 0;
  font-family: "Conneqt";
  letter-spacing: 1px;
  height: 50px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  background: none;
}
body .downloads li .conversoft-select:after {
  background: url(/files/assets/images/icons/download.svg) no-repeat center center;
}
body .downloads li .conversoft-select a {
  text-indent: 20px;
  display: block;
  width: 100%;
  height: 100%;
  line-height: 1;
  font-size: 14px;
  padding-right: 70px;
  color: var(--sabo-black);
  text-transform: uppercase;
  font-weight: bold;
  text-decoration: none;
  line-height: 43px;
  line-height: 46px;
  flex: 1;
  letter-spacing: 1px;
  transition: background-position-y 1s ease-in-out;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (min-width: 1024px) {
  body .downloads li .conversoft-select a {
    font-size: 14px;
  }
}
body .downloads li .conversoft-select a:after {
  background-position-y: 0px;
}
body .downloads li .conversoft-select:hover, body .downloads li .conversoft-select:active {
  text-decoration: underline;
  border-color: var(--sabo-orange);
}
body .downloads li .conversoft-select:hover::after, body .downloads li .conversoft-select:active::after {
  background-color: var(--sabo-orange);
  padding-top: 5px;
  background-position-y: -5px;
  background-position-y: 15px;
}
body .downloads li .conversoft-select::before {
  line-height: 50px;
}
body .downloads li .conversoft-select > span, body .downloads li .conversoft-select::after {
  transition: background-position-y 0.3s ease-in-out;
  pointer-events: none;
  width: 50px;
}
body button.btn,
body a.btn {
  border: none;
  display: inline-block;
  background: var(--gradient-five);
  width: auto;
  max-width: 100%;
  letter-spacing: 2px;
  color: var(--sabo-white);
  font-family: "Conneqt";
  font-weight: 300;
  text-decoration: none;
  box-shadow: -2px 1px 4px 0 rgba(0, 0, 0, 0.4);
  font-size: 14px;
  line-height: 18px;
  border-radius: 50px;
  padding: 16px 50px;
  min-width: 150px;
  text-align: center;
}
@media (min-width: 1300px) {
  body button.btn,
body a.btn {
    font-size: 16px;
    line-height: 20px;
    border-radius: 60px;
    padding: 20px 60px;
    min-width: 150px;
  }
}
body button.btn.tag-pill,
body a.btn.tag-pill {
  box-shadow: -1px 2px 4px 0 rgba(0, 0, 0, 0.15), 1px -2px 4px 0 #fff;
  color: var(--sabo-label-grey) !important;
  background: var(--sabo-grey) !important;
}
body button.btn.tag-pill:hover,
body a.btn.tag-pill:hover {
  color: var(--sabo-lightblue) !important;
}
body button.btn.tag-pill:active,
body a.btn.tag-pill:active {
  background: var(--sabo-grey);
  box-shadow: -1px 2px 4px 0 #fff, 1px -2px 4px 0 rgba(0, 0, 0, 0.15);
}
body button.btn:hover,
body a.btn:hover {
  color: var(--sabo-white);
  background: var(--gradient-six);
}
body button.btn-download,
body a.btn-download {
  display: block;
  background-color: var(--sabo-lightblue);
  color: var(--sabo-white);
  text-indent: -100vw;
  position: relative;
  bottom: 0px;
  height: 50px;
}
body button.btn-download:hover, body button.btn-download:active,
body a.btn-download:hover,
body a.btn-download:active {
  background: var(--sabo-orange);
}
body button.btn-download:hover:after, body button.btn-download:active:after,
body a.btn-download:hover:after,
body a.btn-download:active:after {
  top: 5px;
}
body button.btn-download:after,
body a.btn-download:after {
  transition: top 0.5s;
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: url("/files/assets/images/icons/download.svg") no-repeat center center;
}
body button.social,
body a.social {
  color: transparent;
  position: relative;
  bottom: 0px;
  height: 50px;
  width: 50px;
}
body button.social:after,
body a.social:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: url("/files/assets/images/logo_und_siegel/logo-facebook.svg") no-repeat center center;
}
body button.social.instagram:after,
body a.social.instagram:after {
  background: url("/files/assets/images/logo_und_siegel/logo-instagram.svg") no-repeat center center;
}
body .form_success + .mod_subscribe {
  display: none;
}
body .mod_subscribe {
  margin: 60px auto;
  display: flex;
  column-gap: 30px;
}
@media (min-width: 1300px) {
  body .mod_subscribe {
    column-gap: 60px;
  }
}
body .mod_subscribe h3 {
  font-size: 20px;
  margin-bottom: 10px;
}
@media (min-width: 1024px) {
  body .mod_subscribe h3 {
    margin-bottom: 15px;
  }
}
body .mod_subscribe > * {
  flex: 1;
}
body .mod_subscribe .formbody {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  height: 60px;
}
body .mod_subscribe .formbody > div {
  vertical-align: middle;
  display: inline-block;
}
body .mod_subscribe .formbody > div:nth-child(1) {
  width: 535px;
}
body .mod_subscribe .formbody > div.widget {
  margin-bottom: 0;
  width: 66%;
  min-width: 66%;
}
body .mod_subscribe .formbody > div.widget input {
  padding-left: 20px;
  padding-top: 0;
}
body .mod_subscribe .formbody > div.widget-submit {
  position: relative;
}
body .mod_subscribe .formbody > div.widget-submit button {
  position: relative;
  height: 50px;
  width: 50px;
  left: -50px;
  line-height: 50px;
  background-color: var(--sabo-lightblue);
  color: transparent;
  appearance: unset;
  text-indent: -100vw;
  border: 2 px solid var(--sabo-lightblue);
}
@media (min-width: 769px) {
  body .mod_subscribe .formbody > div.widget-submit button {
    left: -30px;
  }
}
body .mod_subscribe .formbody > div.widget-submit button:after {
  content: "";
  display: block;
  background-color: var(--sabo-lightblue);
  color: var(--sabo-white);
  text-indent: -100vw;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0px;
  right: 0;
  background: url(/files/assets/images/icons/submit.svg) no-repeat center center;
}
body .mod_subscribe .formbody > div.widget-submit button:hover, body .mod_subscribe .formbody > div.widget-submit button:active {
  background-color: var(--sabo-orange);
}
body .downloads_sabo.flex-d--50 h3 {
  padding: 0 30px;
}
body .downloads_sabo ul.downloads {
  row-gap: 10px;
  column-gap: 30px;
}
@media screen and (max-width: 767px) {
  body .downloads_sabo ul.downloads {
    padding: 0 30px;
  }
}
body .productslist {
  background: var(--sabo-lightgrey-bg);
  padding: 0;
}
@media (min-width: 1024px) {
  body .productslist {
    column-gap: 30px;
  }
}
body .productslist .tile.tile--2 {
  padding: 0 30px;
  flex: 1;
  height: initial;
}
body .productslist .tile.tile--2 .content {
  padding: 0;
  margin-bottom: -40px;
}
body .productslist .tile.tile--2 .tile-image {
  background: #fff;
  padding: 20px;
}
body .productslist .tile.tile--2 .tile-image img {
  max-width: 100%;
  max-height: 200px;
  z-index: 10;
  width: auto;
}
body .productslist .tile.tile--2 .tile-label h3 {
  margin-bottom: 5px;
}
body .productslist .tile.tile--2 .tile-headline {
  /*Reemove
          margin-bottom: 0px;
  */
}
body .productslist .tile.tile--2 .tile-headline h2 {
  /*Reemove
  margin-bottom: 30px;
  font-size: 35px;
  line-height: 38px;*/
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body .productslist .tile.tile--2 .tile-subheadline h3 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body .productslist .tile.tile--2 .tile-text ul {
  padding-left: 0px;
  list-style-image: none;
}
body .productslist .tile.tile--2 .tile-text ul li {
  padding-left: 20px;
  margin-bottom: 12px;
}
body .productslist .tile.tile--2 .tile-button {
  z-index: 1;
  position: absolute;
  bottom: 40px;
  left: 0;
  right: 0;
}
body.isDesktop .plist {
  margin-bottom: 35px;
}
body .flexbox {
  padding-bottom: 200px;
}
body .flexbox > .productsearch {
  flex: 1;
}
body .flexbox.detailsproduct, body .flexbox > .productsearch {
  padding: 0 !important;
  display: block !important;
}
body .flexbox.detailsproduct > form > div, body .flexbox > .productsearch > form > div {
  width: 100%;
  min-height: 60px;
  overflow: hidden;
}
body .flexbox.detailsproduct > form > div.open, body .flexbox > .productsearch > form > div.open {
  height: auto;
}
body .flexbox.detailsproduct h3, body .flexbox > .productsearch h3 {
  margin-bottom: 0;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-right: 50px;
  background: var(--sabo-white);
  position: relative;
  line-height: 60px;
  border-top: 1px solid var(--sabo-label-grey);
  padding-left: 28px;
}
body .flexbox.detailsproduct h3.noicon:after, body .flexbox > .productsearch h3.noicon:after {
  content: unset;
}
@media screen and (min-width: 500px) {
  body .flexbox.detailsproduct h3, body .flexbox > .productsearch h3 {
    font-size: 18px;
    padding-right: 25% !important;
  }
}
body .flexbox.detailsproduct h3 + ul, body .flexbox > .productsearch h3 + ul {
  max-height: 0;
  overflow: hidden;
  background: var(--sabo-lightgrey-bg);
  padding: 0 30px;
  transition: 0.7s max-height, 0s padding ease-in-out, 0.7s margin-bottom;
}
body .flexbox.detailsproduct h3 + ul li, body .flexbox > .productsearch h3 + ul li {
  color: var(--sabo-lightblue-blue);
  margin-bottom: 20px;
}
body .flexbox.detailsproduct h3 + ul li .widget.widget-checkbox, body .flexbox > .productsearch h3 + ul li .widget.widget-checkbox {
  margin-bottom: 0;
}
body .flexbox.detailsproduct h3 + ul li .checkbox_container span, body .flexbox > .productsearch h3 + ul li .checkbox_container span {
  margin-bottom: 0;
}
body .flexbox.detailsproduct h3 + ul li .checkbox_container label, body .flexbox > .productsearch h3 + ul li .checkbox_container label {
  padding-top: 3px;
  line-height: 30px;
  font-weight: 500;
}
body .flexbox.detailsproduct h3 + ul li fieldset, body .flexbox > .productsearch h3 + ul li fieldset {
  margin-bottom: 0;
}
body .flexbox.detailsproduct h3:after, body .flexbox > .productsearch h3:after {
  position: absolute;
  display: block;
  top: 0;
  right: 0;
  content: " ";
  width: 60px;
  height: 60px;
  background: url(/files/assets/images/icons/plus.svg) no-repeat;
  background-size: 30px;
  background-position: center center;
}
body .flexbox.detailsproduct form div:first-child h3, body .flexbox > .productsearch form div:first-child h3 {
  border-top: 0px solid var(--sabo-label-grey);
}
body .flexbox.detailsproduct .open h3 + ul, body .flexbox > .productsearch .open h3 + ul {
  max-height: 2400px !important;
}
body .flexbox.detailsproduct h3 + ul li:first-child, body .flexbox > .productsearch h3 + ul li:first-child {
  padding-top: 30px;
}
body .product.detail .inside > section > .downloads_sabo {
  margin-bottom: 0 !important;
}
body .product.detail .header_sabo .inside {
  padding: 0 !important;
  padding-top: 60px !important;
  padding-left: 30px !important;
  padding-right: 30px !important;
}
@media screen and (min-width: 820px) {
  body .product.detail .header_sabo .inside {
    padding-left: 60px !important;
    padding-right: 60px !important;
  }
}
@media screen and (min-width: 1300px) {
  body .product.detail .header_sabo .inside {
    padding-left: 60px !important;
    padding-right: 60px !important;
  }
}
body .product.detail h2 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body .product.detail .dl h3 {
  text-align: right;
}
body .product.detail .dl ul {
  list-style: none;
  padding-right: 0;
  padding-left: 0;
  display: block;
  position: relative;
  /* text-align: right; */
  width: 70%;
  left: 30%;
  margin: 0;
}
body .product.detail .dl ul li {
  margin-bottom: 20px;
}
body .product.detail > .inside > .flex-d--100 {
  flex-basis: 100%;
  max-width: 100%;
  min-width: 100%;
  width: 100%;
}
body .product.detail > .inside > .tile.tile--2 > div:nth-child(1), body .product.detail > .inside > .tile.tile--2 > div:nth-child(2) {
  flex: 1;
}
@media screen and (max-width: 1023px) {
  body .product.detail > .inside > .tile.tile--2 > div:nth-child(1), body .product.detail > .inside > .tile.tile--2 > div:nth-child(2) {
    margin-top: 20px;
    margin-bottom: 50px;
  }
}
@media screen and (min-width: 1024px) {
  body .product.detail > .inside > .tile.tile--2 > div:nth-child(1), body .product.detail > .inside > .tile.tile--2 > div:nth-child(2) {
    max-width: 48%;
    width: 48%;
    min-width: 48%;
    flex-basis: 48%;
  }
}
body .product.detail .tile.tile--2,
body .product.detail .content {
  background: #fff;
  padding: 30px 0px;
}
@media screen and (min-width: 1024px) {
  body .product.detail .tile.tile--2,
body .product.detail .content {
    padding: 30px 0px;
  }
}
@media screen and (max-width: 1023px) {
  body .product.detail .tile.tile--2,
body .product.detail .content {
    padding-left: 0;
  }
}
body .product.detail .tile.tile--2 .tile-image img,
body .product.detail .content .tile-image img {
  max-width: 355px;
  max-height: 355px;
  width: auto;
  height: auto;
}
body .product.detail ul:not(.downloads):not(.noicon) {
  padding-left: 20px;
  list-style-image: url(https://sabo.de/files/assets/images/icons/listicon.svg);
}
body .product.detail ul:not(.downloads):not(.noicon) li {
  padding-left: 10px;
  margin-bottom: 12px;
}
body .product.detail > .inside {
  padding: 0;
}
body .product.detail > .inside > * {
  display: flex;
  flex-wrap: wrap;
}
body .product.detail > .inside > *.tile.tile--2 {
  padding: 0;
  border: 0;
  margin-top: 0;
  padding: 90px 50px;
}
body .product.detail > .inside > *.tile.tile--2 .content {
  top: 0;
}
body .product.detail > .inside > *.tile.tile--2 .content .tile-label,
body .product.detail > .inside > *.tile.tile--2 .content .tile-button,
body .product.detail > .inside > *.tile.tile--2 .content .tile-headline,
body .product.detail > .inside > *.tile.tile--2 .content .tile-subheadline {
  width: 100%;
  text-align: right;
}
body .product.detail > .inside > *.tile.tile--2 .tile-image {
  top: 0;
}
body .product.detail > .inside > *.tile.tile--2 h3 {
  margin-bottom: 24px;
}
body .product.detail > .inside > * > .flex-d--50 {
  flex-basis: 100%;
  max-width: 100%;
  min-width: 100%;
  width: 100%;
}
@media (min-width: 1024px) {
  body .product.detail > .inside > * > .flex-d--50 {
    width: 50%;
    min-width: 50%;
    max-width: 50%;
    flex-basis: 50%;
  }
}
body .tile.tile--2 > .detailsproduct h2 {
  margin-top: 200px;
  text-align: left;
}
body .tile.tile--2 > .detailsproduct h3 {
  line-height: 60px !important;
  margin-bottom: 0 !important;
}
body .tile.tile--2 > .detailsproduct .detaillist {
  background: #fff;
  padding: 0;
  padding-right: 0;
  padding-left: 0;
}
body .tile.tile--2 > .detailsproduct .detaillist li {
  display: flex;
  justify-content: space-between;
}
body .tile.tile--2 > .detailsproduct .detaillist li span {
  color: initial;
}
body.isDesktop .support {
  padding-bottom: 400px;
  display: flex;
  gap: 160px 40px;
  flex-wrap: wrap;
}
body.isDesktop .support > section.flex-d--50 h3 {
  line-height: 38px;
  margin-bottom: 20px;
}
body.isDesktop .support > section.flex-d--50 h3 + p {
  margin-bottom: 50px;
}
body.isDesktop .support .flex-d--50 {
  flex-basis: calc(50% - var(--responsive-inner-padding));
  max-width: calc(50% - var(--responsive-inner-padding));
  min-width: calc(50% - var(--responsive-inner-padding));
  width: calc(50% - var(--responsive-inner-padding));
}
body.isDesktop .support .tile.tile--2.noimage {
  border-color: var(--sabo-lightblue);
  padding: 0;
  margin-top: 0px;
}
body.isDesktop .support .tile.tile--2.noimage .content {
  top: 0;
  padding: 30px 50px 60px;
}
body.isDesktop .support .tile.tile--2.noimage .content .tile-subheadline {
  text-align: left;
}
body.isDesktop .support .tile.tile--2.noimage .content h3 {
  color: initial;
}
body.isDesktop .support .center {
  padding-bottom: 0;
}
body.isDesktop .support .center p {
  max-width: 50%;
  margin: 0 auto;
  text-align: center;
}
body.isDesktop .support .detailsproduct > div > div > h3 {
  font-size: 25px;
}
body.isDesktop .support .detailsproduct h3 + ul,
body.isDesktop .support .detailsproduct div.open {
  background: #fff;
}
body.isDesktop .support .detailsproduct .detaillist h3 {
  padding: 0;
  border-bottom: 0;
  color: initial;
}
body.isDesktop .support .detailsproduct .detaillist ul.downloads {
  padding-left: 0;
  flex-direction: column;
}
body.isDesktop .support .detailsproduct .detaillist ul.downloads li {
  display: inline-block;
}
body.isDesktop .support .detailsproduct .detaillist ul.downloads li p {
  margin-bottom: 15px;
}
body .luminosity:not(.tile--6) {
  mix-blend-mode: luminosity;
  filter: grayscale(1);
}
body .luminosity.tile--6 .tile-bg {
  mix-blend-mode: luminosity;
  filter: grayscale(1);
}
body .headlineoverflow h2 {
  z-index: 1;
  position: relative;
}
@media (min-width: 768px) {
  body .headlineoverflow.hochformat h2 {
    min-width: 155%;
  }
}
@media (min-width: 768px) {
  body .headlineoverflow.hochformat .tile-bg {
    /* min-width: 155%; */
    width: 155%;
    position: relative;
  }
  body .headlineoverflow.hochformat .tile-bg picture {
    position: relative;
    display: flex;
  }
  body .headlineoverflow.hochformat .tile-bg picture img {
    height: 100%;
  }
  body .headlineoverflow.hochformat .tile-bg picture:after {
    position: absolute;
    top: 0px;
    left: 0;
    right: 0;
    bottom: 0px;
    display: block;
    content: " ";
    opacity: 0.4;
    /* z-index: 99999999; */
    mix-blend-mode: multiply;
    /* z-index: 99999999; */
    background: #002A53;
  }
}
body .headlineoverflow.querformat h2 {
  width: 100%;
}
@media (min-width: 820px) {
  body .headlineoverflow.querformat h2 {
    width: 100%;
  }
}
@media (min-width: 1024px) {
  body .headlineoverflow.querformat h2 {
    min-width: 155%;
  }
}
@media (min-width: 1024px) {
  body .headlineoverflow.querformat .tile-bg {
    position: relative;
  }

}
body .headlineoverflow.querformat .tile-bg picture {
  position: relative;
  display: flex;
}
body .headlineoverflow.querformat .tile-bg picture:after {
  position: absolute;
  top: 0px;
  left: 0;
  right: 0;
  bottom: 0px;
  display: block;
  content: " ";
  opacity: 0.4;
  mix-blend-mode: multiply;
  /* z-index: 99999999; */
  background: #002A53;
}
.widget-select > select + .selected:before {
  /* font-weight: 600; */
}

#container .selectlabel .conversoft-select ul {
  padding-top: 0px;
  overflow: scroll;
  max-height: 430px;
}
#container .selectlabel .conversoft-select ul li {
  padding-bottom: 12px;
  margin-bottom: unset;
  padding-top: 12px;
}
#container .selectlabel .conversoft-select ul li:before {
  content: unset;
}
#container .selectlabel .conversoft-select ul li span {
  pointer-events: none;
}
#container .selectlabel .conversoft-select:before {
  left: 15px;
}
@media (max-width: 340px) {
  #container .selectlabel .conversoft-select:before {
    left: 7px;
  }
}
#container .selectlabelhint {
  text-align: center;
  padding-top: 50px;
}
#container .selectlabelhint h3 {
  margin-bottom: 16px;
}
#container .selectlabelhint a.btn {
  margin-bottom: 50px;
  margin-left: -16px;
  margin-right: -16px;
  text-decoration: none;
}
#container .selectlabelhint a.ripple {
  margin-bottom: 50px;
  margin-left: -20px;
  margin-right: -20px;
  text-decoration: none;
}
#container .selectlabelhint a.h2 {
  font-size: 40px;
  line-height: 1;
  color: var(--sabo-lightblue);
}
#container .tile.tile--1 .inside .selectlabelhint h2{
  padding-bottom: 0;
}
@media (max-width: 374px){
  #container .selectlabelhint a.h2{
    font-size: 22px;
  }
}
@media (max-width: 469px) and (min-width: 375px) {
  #container .selectlabelhint a.h2{
    font-size: 27px;
  }
}
@media (max-width: 637px) and (min-width: 470px) {
  #container .selectlabelhint a.h2{
    font-size: 36px;
  }
}
.img768max {
  display: block;
}
@media (min-width: 500px) {
  .img768max {
    display: none;
  }
}

.img820max {
  display: none;
}
@media (min-width: 500px) {
  .img820max {
    display: block;
  }
}
@media (min-width: 821px) {
  .img820max {
    display: none;
  }
}

.img1366plus {
  display: none;
}
@media (min-width: 821px) {
  .img1366plus {
    display: block;
  }
}
@media (min-width: 1366px) {
  .img1366plus {
    display: none;
  }
}

.img1920plus {
  display: none;
}
@media (min-width: 1367px) {
  .img1920plus {
    display: block;
  }
}

body:not(.startseite):not(.qs) header:not(.header_startseite) img {
  max-height: 500px;
  object-fit: cover;
}
@media (min-width: 769px) {
  body:not(.startseite):not(.qs) header:not(.header_startseite) img {
    object-fit: contain;
  }
}
@media (min-width: 1580px) {
  body:not(.startseite):not(.qs) header:not(.header_startseite) img {
    object-fit: contain;
    object-fit: unset;
    max-width: 100%;
  }
  body:not(.startseite):not(.qs) header:not(.header_startseite) img:not(.readmoreimg):not(.arrow) {
    width: 100%;
  }
}

#wrapper:before {
  height: 600px;
}

#dma-app .tile img {
  width: auto;
}
#dma-app .tile ul,
#dma-app div:not(.productsearch) > form > div > ul {
  padding-left: 20px;
}
#dma-app .tile ul li,
#dma-app div:not(.productsearch) > form > div > ul li {
  padding-left: 20px;
  margin-bottom: 12px;
}
#dma-app .tile ul li:before,
#dma-app div:not(.productsearch) > form > div > ul li:before {
  top: 7px;
}
#dma-app li.toggle-tags {
  text-align: right;
  position: relative;
  height: 60px;
  line-height: 60px;
}
#dma-app li.toggle-tags a {
  padding-right: 35px;
}
#dma-app li.toggle-tags::after {
  transform: rotate(45deg);
  position: absolute;
  display: block;
  pointer-events: none;
  top: 0;
  right: -20px;
  content: " ";
  width: 60px;
  height: 60px;
  background: url(/files/assets/images/icons/plusorange.svg) no-repeat;
  background-size: 25px;
  background-position: center center;
  color: var(--sabo-orange);
  font-weight: 600;
  font-size: 16px;
  line-height: 20px;
}
@media screen and (min-width: 1024px) {
  #dma-app li.toggle-tags::after {
    font-size: 20px;
    line-height: 26px;
  }
}

.mod_navigation > .inside > .mod_navigation ul li.bookmarks {
  display: none;
}
body.js-has-bookmarks .mod_navigation > .inside > .mod_navigation ul li.bookmarks {
  display: flex;
}

.mod_login {
  z-index: 3;
  position: absolute;
  left: 0;
  right: 0;
  top: calc(-200vh - 14px);
  background: transparent linear-gradient(180deg, #fff 0%, var(--sabo-lightgrey-bg) 100%) 0% 0%;
  padding-top: 70px;
  min-height: 100vh;
  transition: top 0.75s ease-out 0s, opacity 0.75s ease-out 0.5s !important;
}
@media screen and (max-width: 768px) {
  .mod_login .footer-bg {
    top: -10px !important;
  }
}
.mod_login.logout > div > div:nth-child(2) {
  padding: 20px 0;
}
.mod_login.logout > div > div:nth-child(2) .widget.widget-submit {
  left: -20px;
}
.mod_login.logout > div > div:nth-child(2) form {
  margin: 0 20px;
}
@media (min-width: 820px) {
  .mod_login.logout > div > div:nth-child(2) form {
    margin: 10px 50px 0 0;
  }
}
@media (min-width: 1024px) {
  .mod_login.logout > div > div:nth-child(2) form {
    margin: 20px 30px 0 0;
  }
}
.mod_login form .widget {
  margin-bottom: 20px;
}
.mod_login .formbody p {
  margin-bottom: 40px;
}
.mod_login ul {
  margin-top: 25px;
}
.mod_login ul li {
  padding-left: 30px !important;
}
@media (min-width: 500px) {
  .mod_login {
    padding: 20px 60px;
    padding-top: 60px;
  }
}
@media (min-width: 820px) {
  .mod_login {
    padding-top: 60px;
    padding-left: 60px;
    padding-right: 40px;
  }
}
@media (min-width: 1024px) {
  .mod_login {
    padding: 40px 0;
    padding-top: 14px;
    padding-top: 50px;
    padding-left: 30px;
  }
}
@media (min-width: 1580px) {
  .mod_login {
    padding-left: 0px;
  }
}
.mod_login > div {
  display: flex;
  flex-direction: column-reverse;
  min-height: 100vh;
  gap: 200px;
}
@media (min-width: 500px) {
  .mod_login > div {
    gap: 120px;
  }
}
@media (min-width: 820px) {
  .mod_login > div {
    gap: 20px;
    flex-direction: row;
  }
}
@media (min-width: 1024px) {
  .mod_login > div {
    padding-top: 0px;
    gap: 30px;
  }
}
@media (min-width: 1580px) {
  .mod_login > div {
    gap: 60px;
    padding-left: 20%;
  }
}
.mod_login > div > div {
  flex: 1;
}
@media screen and (max-width: 768px) {
  .mod_login > div > div:nth-child(1) {
    padding: 40px 20px;
    margin-bottom: 60px;
    background: #fff;
    z-index: 1;
  }
  .mod_login > div > div:nth-child(1) .bluebox {
    margin: 0;
  }
}
@media (min-width: 820px) {
  .mod_login > div > div:nth-child(1) {
    flex: 15;
  }
}
.mod_login > div > div:nth-child(2) {
  position: relative;
  padding: 20px;
}
@media screen and (max-width: 819px) {
  .mod_login > div > div:nth-child(2) {
    padding: 20px;
  }
}
@media (min-width: 820px) {
  .mod_login > div > div:nth-child(2) {
    flex: 12;
  }
  .mod_login > div > div:nth-child(2) .widget.widget-text,
.mod_login > div > div:nth-child(2) .widget.widget-checkbox,
.mod_login > div > div:nth-child(2) .widget.widget-password,
.mod_login > div > div:nth-child(2) .widget.widget-radio {
    margin-right: 0px;
  }
}
@media (min-width: 1024px) {
  .mod_login > div > div:nth-child(2) {
    padding: 40px;
  }
  .mod_login > div > div:nth-child(2) .widget.widget-text,
.mod_login > div > div:nth-child(2) .widget.widget-checkbox,
.mod_login > div > div:nth-child(2) .widget.widget-password,
.mod_login > div > div:nth-child(2) .widget.widget-radio {
    margin-right: 0px;
  }
}
.mod_login > div > div:nth-child(2) form {
  box-shadow: 0px 20px 30px 0 rgba(0, 0, 0, 0.07);
  padding: 20px;
  background-color: #fff;
  display: block;
  z-index: 2;
  position: relative;
  box-sizing: border-box;
}
@media (min-width: 820px) {
  .mod_login > div > div:nth-child(2) form {
    margin: 40px 30px 0 0;
  }
}
@media (min-width: 1024px) {
  .mod_login > div > div:nth-child(2) form {
    padding: 40px;
    margin: 10px -10px 0 0;
  }
}
@media (min-width: 820px) {
  .mod_login > div > div:nth-child(2) ul {
    margin-bottom: -30px;
  }
}
.mod_login > div > div:nth-child(2) .widget.widget-submit {
  height: 0;
  position: relative;
  top: 70px;
  left: 0px;
}
@media (min-width: 820px) {
  .mod_login > div > div:nth-child(2) .widget.widget-submit {
    left: -20px;
  }
}
@media (min-width: 1024px) {
  .mod_login > div > div:nth-child(2) .widget.widget-submit {
    top: 90px;
    left: -40px;
  }
}
.mod_login .bluebox {
  background: #1E6CA0;
  padding: 20px;
  margin: 0 -20px;
  padding: 20px;
  margin: 20px 20px;
  position: relative;
}
@media (min-width: 500px) {
  .mod_login .bluebox {
    top: -115px;
  }
}
@media (min-width: 820px) {
  .mod_login .bluebox {
    position: static;
    top: unset;
    margin: 0px;
    margin-top: 40px;
  }
}
@media (min-width: 1024px) {
  .mod_login .bluebox {
    margin-top: 50px;
    padding: 40px;
    margin-left: 80px;
  }
}
.mod_login .bluebox h3,
.mod_login .bluebox p,
.mod_login .bluebox a {
  color: #fff;
  text-decoration: none;
}
.mod_login .bluebox .h2 {
  font-weight: 600;
}
@media (min-width: 1024px) {
  .mod_login .bluebox .h2 {
    font-size: 40px;
    line-height: 43px;
  }
}
body.js-has-login-active .mod_login {
  top: 0;
}
body.js-has-login-active .mod_login ul {
  position: static !important;
  background: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  min-height: auto !important;
}
body.js-has-login-active .mod_login ul li {
  padding-left: 20px;
  margin-bottom: 15px;
  position: relative;
  min-height: unset !important;
}
body.js-has-login-active .mod_login ul li:before {
  content: "";
  width: 1em;
  content: "";
  height: 1em;
  width: 10px;
  height: 10px;
  top: 5px;
  top: 7px;
  position: absolute;
  left: 0;
  background: url(/files/assets/images/icons/aufzaelungspunkt.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.mod_navigation > .inside > .overlay .searchbox {
  position: relative;
}
@media (min-width: 1300px) {
  .mod_navigation > .inside > .overlay .searchbox > p {
    font-size: 16px;
    line-height: 20px;
    padding: 20px;
    min-width: 150px;
  }
}
.mod_navigation > .inside > .overlay .searchbox ul {
  position: relative !important;
  left: 0 !important;
  width: 100% !important;
  padding: 20px 0 !important;
  z-index: 0 !important;
  right: 0;
  top: 0px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  min-height: unset !important;
  box-shadow: 0px 20px 30px 0 rgba(0, 0, 0, 0.07) !important;
}
.mod_navigation > .inside > .overlay .searchbox ul li {
  padding-bottom: 0;
  margin-top: 0px;
  margin-bottom: 0px;
  position: relative;
  min-height: 60px !important;
  box-shadow: 0px 10px 15px 2px rgba(0, 0, 0, 0.2);
}
.mod_navigation > .inside > .overlay .searchbox ul li:nth-child(odd) {
  background-color: var(--sabo-lightgrey-table);
}
.mod_navigation > .inside > .overlay .searchbox ul li:nth-child(even) {
  background-color: var(--sabo-grey-ligthen);
}
.mod_navigation > .inside > .overlay .searchbox ul li > a {
  padding-left: 0;
  margin-left: 0px !important;
  font-size: 18px !important;
  line-height: 23px !important;
  display: inline-flex;
  width: 100%;
  font-weight: 400 !important;
  align-items: center;
  color: initial !important;
}
.mod_navigation > .inside > .overlay .searchbox ul li > a:hover {
  color: var(--sabo-orange) !important;
}
.mod_navigation > .inside > .overlay .searchbox ul li > a:hover {
  color: var(--sabo-orange);
}
.mod_navigation > .inside > .overlay .searchbox ul li > a:after {
  content: unset;
}
.mod_navigation > .inside > .overlay .searchbox ul li span {
  display: flex;
  height: 60px;
  width: 80px;
  justify-content: center;
  align-items: center;
}
.mod_navigation > .inside > .overlay .searchbox ul li img {
  max-width: 2em;
  max-height: 2em;
}
@media screen and (max-width: 819px) {
  .checkoutform .widget {
    padding-right: 50px !important;
  }
}

.fixed-i {
  position: absolute;
  right: 0;
  top: 0;
  width: 30px;
  height: 30px;
  background: var(--sabo-lightblue);
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  cursor: pointer;
}
.fixed-i > div {
  cursor: auto;
}
.fixed-i > svg {
  pointer-events: none;
}
.fixed-i p {
  font-size: 16px !important;
  line-height: 20px !important;
}
.fixed-i h2, .fixed-i a {
  font-size: 20px;
  line-height: 26px;
  margin-bottom: 15px;
}
.fixed-i.open > div {
  opacity: 1;
  z-index: 10;
}
.fixed-i > div {
  padding: 15px 0;
  z-index: -1;
  background: #fff;
  transition: 0.1s opacity ease-in;
  opacity: 0;
  position: absolute;
  top: -10px;
  right: 50px;
  width: 300px;
  box-shadow: 0px 20px 30px 0 rgba(0, 0, 0, 0.07);
}
.fixed-i > div:after {
  content: "";
  width: 20px;
  height: 20px;
  background: #fff;
  position: absolute;
  top: 15px;
  right: -10px;
  transform: rotate(45deg);
  box-shadow: 0px 20px 30px 0 rgba(0, 0, 0, 0.07);
}

.stickypart {
  left: auto;
  bottom: 0;
}

body.js-has-login-active .quicksearch,
body.js-has-login-active .bookmarks {
  display: none !important;
}

.liste h3, .liste .checkbox_container label {
  cursor: pointer;
}

@media screen and (max-width: 819px) {
  .mod_navigation > .inside > .overlay ul.level_1 {
    top: 0;
    padding-top: 50px;
  }
}

.sticky {
  z-index: 200 !important;
  cursor: pointer;
}

body.isDesktop #dma-app > .inside {
  max-width: calc(var(--resonsive-max-width) - 2 * var(--responsive-padding));
}
body.isDesktop .flex-d--33 {
  flex-basis: calc(33% - var(--responsive-inner-padding) / 3);
  max-width: calc(33% - var(--responsive-inner-padding) / 3);
  min-width: calc(33% - var(--responsive-inner-padding) / 3);
  width: calc(33% - var(--responsive-inner-padding) / 3);
}
body.isDesktop .flex-d--50 {
  flex-basis: calc(50% - var(--responsive-inner-padding) / 2);
  max-width: calc(50% - var(--responsive-inner-padding) / 2);
  min-width: calc(50% - var(--responsive-inner-padding) / 2);
  width: calc(50% - var(--responsive-inner-padding) / 2);
}
body.isDesktop .flex-d--50.tile--2.product {
  flex-basis: 380px;
  max-width: 380px;
  min-width: 380px;
  width: 380px;
}
@media (min-width: 1144px) {
  body.isDesktop .flex-d--50.tile--2.product {
    flex-basis: 450px;
    max-width: 450px;
    min-width: 450px;
    width: 450px;
  }
}
@media (min-width: 1400px) {
  body.isDesktop .flex-d--50.tile--2.product {
    flex-basis: calc(50% - 15px);
    max-width: calc(50% - 15px);
    min-width: calc(50% - 15px);
    width: calc(50% - 15px);
  }
}
body.isDesktop .flex-d--50.tile--3, body.isDesktop .flex-d--50.tile--2:not(.product), body.isDesktop .flex-d--50.tile--1 {
  margin: 0 20px;
  flex-basis: calc(100% - 40px);
  max-width: calc(100% - 40px);
  min-width: calc(100% - 40px);
  width: calc(100% - 40px);
  margin-left: 0;
  margin-right: 0;
}
@media (min-width: 1024px) {
  body.isDesktop .flex-d--50.tile--3, body.isDesktop .flex-d--50.tile--2:not(.product), body.isDesktop .flex-d--50.tile--1 {
    flex-basis: calc(50% - 110px);
    max-width: calc(50% - 110px);
    min-width: calc(50% - 110px);
    width: calc(50% - 110px);
  }
}
@media (min-width: 1300px) {
  body.isDesktop .flex-d--50.tile--3, body.isDesktop .flex-d--50.tile--2:not(.product), body.isDesktop .flex-d--50.tile--1 {
    flex-basis: calc(50% - 125px);
    max-width: calc(50% - 125px);
    min-width: calc(50% - 125px);
    width: calc(50% - 125px);
  }
}
@media (min-width: 1300px) {
  body.isDesktop .flex-d--50.tile--3, body.isDesktop .flex-d--50.tile--2:not(.product), body.isDesktop .flex-d--50.tile--1 {
    flex-basis: calc(50% - 165px);
    max-width: calc(50% - 165px);
    min-width: calc(50% - 165px);
    width: calc(50% - 165px);
  }
}
@media (min-width: 1580px) {
  body.isDesktop .flex-d--50.tile--3, body.isDesktop .flex-d--50.tile--2:not(.product), body.isDesktop .flex-d--50.tile--1 {
    flex-basis: 635px;
    max-width: 635px;
    min-width: 635px;
    width: 635px;
  }
}
body.isDesktop .flex-d--50.tile--3.small, body.isDesktop .flex-d--50.tile--2:not(.product).small, body.isDesktop .flex-d--50.tile--1.small {
  padding-top: 0px;
}
@media (min-width: 1024px) {
  body.isDesktop .flex-d--50.tile--3.small > .inside, body.isDesktop .flex-d--50.tile--2:not(.product).small > .inside, body.isDesktop .flex-d--50.tile--1.small > .inside {
    padding: 0 0px !important;
  }
}
body.isDesktop .flex-d--50.tile--3:not(.tile--2) > .inside, body.isDesktop .flex-d--50.tile--2:not(.product):not(.tile--2) > .inside, body.isDesktop .flex-d--50.tile--1:not(.tile--2) > .inside {
  margin: 0 !important;
  padding: 0 !important;
}
@media (min-width: 1024px) {
  body.isDesktop .flex-d--50.tile--3 > .inside, body.isDesktop .flex-d--50.tile--2:not(.product) > .inside, body.isDesktop .flex-d--50.tile--1 > .inside {
    padding: 0 40px !important;
  }
}
body.isDesktop .flex-d--50.tile--1 .inside,
body.isDesktop .flex-d--50.tile--1 .content {
  padding: 0 !important;
}
body.isDesktop .flex-d--50.tile--4 {
  margin: 0 20px;
  flex-basis: calc(100% - 40px);
  max-width: calc(100% - 40px);
  min-width: calc(100% - 40px);
  width: calc(100% - 40px);
  margin-left: 0;
  margin-right: 0;
}
@media (min-width: 1024px) {
  body.isDesktop .flex-d--50.tile--4 {
    flex-basis: calc(50% - 110px);
    max-width: calc(50% - 110px);
    min-width: calc(50% - 110px);
    width: calc(50% - 110px);
  }
}
@media (min-width: 1300px) {
  body.isDesktop .flex-d--50.tile--4 {
    flex-basis: calc(50% - 125px);
    max-width: calc(50% - 125px);
    min-width: calc(50% - 125px);
    width: calc(50% - 125px);
  }
}
@media (min-width: 1300px) {
  body.isDesktop .flex-d--50.tile--4 {
    flex-basis: calc(50% - 165px);
    max-width: calc(50% - 165px);
    min-width: calc(50% - 165px);
    width: calc(50% - 165px);
  }
}
@media (min-width: 1580px) {
  body.isDesktop .flex-d--50.tile--4 {
    flex-basis: 635px;
    max-width: 635px;
    min-width: 635px;
    width: 635px;
  }
}
body.isDesktop .flex-d--50.tile--4.small {
  padding-top: 0px;
}
@media (min-width: 1024px) {
  body.isDesktop .flex-d--50.tile--4.small > .inside {
    padding: 0 0px !important;
  }
}
body.isDesktop .flex-d--50.tile--4 > .inside {
  margin: 0 !important;
  padding: 0 !important;
}
@media (min-width: 1024px) {
  body.isDesktop .flex-d--50.tile--4 > .inside {
    padding: 0 40px !important;
  }
}
body.isDesktop .flex-d--50.downloads_sabo, body.isDesktop .flex-d--50.tile--4:not(.noimage) {
  flex-basis: calc(100% - 40px);
  max-width: calc(100% - 40px);
  min-width: calc(100% - 40px);
  width: calc(100% - 40px);
  margin-left: 0;
  margin-right: 0;
}
@media (min-width: 1024px) {
  body.isDesktop .flex-d--50.downloads_sabo, body.isDesktop .flex-d--50.tile--4:not(.noimage) {
    min-height: 100%;
    flex-basis: 630px;
    max-width: 630px;
    min-width: 630px;
    width: 630px;
  }
}
body.isDesktop .flex-d--50.downloads_sabo > .inside, body.isDesktop .flex-d--50.tile--4:not(.noimage) > .inside {
  margin: 0 !important;
  padding: 0 !important;
}
@media (min-width: 1024px) {
  body.isDesktop .flex-d--50.downloads_sabo {
    min-height: 100%;
    flex-basis: calc(50% - 120px);
    max-width: calc(50% - 120px);
    min-width: calc(50% - 120px);
    width: calc(50% - 120px);
  }
}
@media (min-width: 1580px) {
  body.isDesktop .flex-d--50.downloads_sabo {
    min-height: 100%;
    flex-basis: 630px;
    max-width: 630px;
    min-width: 630px;
    width: 630px;
  }
}
body.isDesktop .flex-d--50.downloads_sabo > .inside,
body.isDesktop .flex-d--50.downloads_sabo .downloads {
  margin: 0 !important;
  padding: 0 !important;
}
body.isDesktop .flex-d--50.downloads_sabo > .inside li,
body.isDesktop .flex-d--50.downloads_sabo .downloads li {
  min-width: 100%;
}
body.isDesktop .flex-d--50.downloads_sabo > .inside li .conversoft-select,
body.isDesktop .flex-d--50.downloads_sabo .downloads li .conversoft-select {
  width: 100%;
}
body.isDesktop .flex-d--66 {
  flex-basis: calc(66% - var(--responsive-inner-padding) / 2);
  max-width: calc(66% - var(--responsive-inner-padding) / 2);
  min-width: calc(66% - var(--responsive-inner-padding) / 2);
  width: calc(66% - var(--responsive-inner-padding) / 2);
}
body.isDesktop .flex-d--100,
body.isDesktop .flex-d--100 > .flex100 {
  flex-basis: 100%;
  max-width: 100%;
  min-width: 100%;
  width: 100%;
}

body.isTablet .flex-m--33 {
  flex-basis: 33%;
  max-width: 33%;
  min-width: 33%;
  width: 33%;
}
body.isTablet .flex-m--50 {
  flex-basis: calc(50% - 60px);
  max-width: calc(50% - 60px);
  min-width: calc(50% - 60px);
  width: calc(50% - 60px);
}
body.isTablet .flex-m--50.downloads_sabo {
  flex-basis: 100%;
  max-width: 100%;
  min-width: 100%;
  width: 100%;
}
@media (min-width: 820px) {
  body.isTablet .flex-m--50.downloads_sabo {
    flex-basis: calc(50% - 80px);
    max-width: calc(50% - 80px);
    min-width: calc(50% - 80px);
    width: calc(50% - 80px);
  }
}
@media (min-width: 820px) {
  body.isTablet .flex-m--50.downloads_sabo > .inside {
    padding: 0 !important;
    padding-top: 50px !important;
  }
}
@media (min-width: 1024px) {
  body.isTablet .flex-m--50.downloads_sabo {
    flex-basis: calc(50% - 120px);
    max-width: calc(50% - 120px);
    min-width: calc(50% - 120px);
    width: calc(50% - 120px);
  }
}
@media (min-width: 500px) {
  body.isTablet .flex-m--50.tile--2 {
    flex-basis: 100%;
    max-width: 100%;
    min-width: 100%;
    width: 100%;
  }
}
@media (min-width: 768px) {
  body.isTablet .flex-m--50.tile--2 {
    flex-basis: calc(100% - 80px);
    max-width: calc(100% - 80px);
    min-width: calc(100% - 80px);
    width: calc(100% - 80px);
  }
}
@media (min-width: 820px) {
  body.isTablet .flex-m--50.tile--2 {
    flex-basis: calc(50% - 80px);
    max-width: calc(50% - 80px);
    min-width: calc(50% - 80px);
    width: calc(50% - 80px);
  }
}
@media (min-width: 500px) {
  body.isTablet .flex-m--50.tile--4 {
    flex-basis: 100%;
    max-width: 100%;
    min-width: 100%;
    width: 100%;
    padding: 0 20px;
  }
}
@media (min-width: 768px) {
  body.isTablet .flex-m--50.tile--4 {
    padding: 0;
    flex-basis: calc(100% - 80px);
    max-width: calc(100% - 80px);
    min-width: calc(100% - 80px);
    width: calc(100% - 80px);
  }
}
@media (min-width: 820px) {
  body.isTablet .flex-m--50.tile--4 {
    flex-basis: calc(50% - 80px);
    max-width: calc(50% - 80px);
    min-width: calc(50% - 80px);
    width: calc(50% - 80px);
  }
}
body.isTablet .flex-m--100 {
  flex-basis: 100%;
  max-width: 100%;
  min-width: 100%;
  width: 100%;
}
body.isTablet .flex-m--100.tile.tile--5 {
  flex-basis: calc(100vw - 40px);
  max-width: calc(100vw - 40px);
  min-width: calc(100vw - 40px);
  width: calc(100vw - 40px);
}
@media (min-width: 500px) {
  body.isTablet .flex-m--100.tile.tile--5 {
    flex-basis: 100%;
    max-width: 100%;
    min-width: 100%;
    width: 100%;
  }
}

body.isMobile .flex-m--33 {
  flex-basis: 100%;
  max-width: 100%;
  min-width: 100%;
  width: 100%;
}
body.isMobile .flex-m--50 {
  flex-basis: 100%;
  max-width: 100%;
  min-width: 100%;
  width: 100%;
}
body.isMobile .flex-m--50.tile--4.noimage {
  padding: 0 20px;
}
body.isMobile .flex-m--100 {
  flex-basis: 100%;
  max-width: 100%;
  min-width: 100%;
  width: 100%;
}

@media screen and (max-width: 819px) {
  .no-mobile {
    display: none !important;
  }
}
@media (min-width: 820px) {
  .mobile-only {
    display: none !important;
  }
  .no-mobile {
    display: inherit;
  }
}
@media screen and (max-width: 1023px) {
  .no-tablet {
    display: none !important;
  }
}
@media (min-width: 1024px) {
  .tablet-only {
    display: none !important;
  }
  .no-tablet {
    display: inherit;
  }
}
@keyframes flipOutY {
  0% {
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }
  100% {
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }
}
@keyframes flipInY {
  0% {
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }
  100% {
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }
}
@keyframes flipOutX {
  0% {
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }
  100% {
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }
}
@keyframes flipInX {
  0% {
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }
  100% {
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }
}
.flipOutY {
  -webkit-backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
  backface-visibility: visible !important;
  animation-name: flipOutY;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}

.flipInY {
  -webkit-backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  backface-visibility: visible !important;
  animation-name: flipInY;
  animation-duration: 2s;
  animation-fill-mode: forwards;
  animation-delay: 0.85s;
}

.flipOutX {
  -webkit-animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  animation-name: flipOutX;
  backface-visibility: visible !important;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  backface-visibility: visible !important;
  animation-name: flipInX;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-delay: 0.5s;
}

h1,
h1 + span {
  font-size: 35px;
  line-height: 38px;
  font-family: "Conneqt";
  color: transparent;
}
h1 + span,
h1 + span + span {
  color: var(--sabo-lightblue);
}
@media (min-width: 1024px) {
  h1,
h1 + span {
    font-size: 40px;
    line-height: 43px;
  }
}
@media (min-width: 1580px) {
  h1,
h1 + span {
    font-size: 60px;
    line-height: 63px;
  }
}

.tile-headline h1 {
  padding: 20px 20px 30px 20px;
  padding: 20px 20px 30px 20px !important;
}
.tile-headline h1 > span {
  font-size: 20px;
  line-height: 26px;
  padding-top: 15px;
}
@media (min-width: 1580px) {
  .tile-headline h1 > span {
    font-size: 35px;
    line-height: 38px;
  }
}
.tile-headline h1 + span {
  color: var(--sabo-lightblue);
  display: inline-block;
  padding: 0px 0px 0px 20px !important;
}
.tile-headline h1 + span > span {
  color: initial;
  padding-top: 15px;
  font-size: 20px;
  line-height: 26px;
  display: block;
}
@media (min-width: 1580px) {
  .tile-headline h1 + span > span {
    font-size: 35px;
    line-height: 38px;
  }
}

.is_highlight .tile-headline h1 {
  mix-blend-mode: multiply;
  background: #1E6CA0;
}
.is_highlight .tile-headline h1 + span {
  color: #fff;
}
.is_highlight .tile-headline h1 + span > span {
  color: #fff;
}

@media screen and (max-width: 819px) {
  header.noimage .claim {
    top: unset;
    bottom: 35px;
  }
  header.noimage .claim.nolink {
    bottom: 35px;
  }
}
@media screen and (max-width: 819px) and (max-width: 499px) {
  header.noimage .claim {
    bottom: 20px;
  }
  header.noimage .claim.nolink {
    bottom: 35px;
  }
}
@media screen and (max-width: 819px) {
  header.noimage .tile-headline h1 {
    mix-blend-mode: multiply;
    background: #1E6CA0;
  }
  header.noimage .tile-headline h1 + span {
    color: #fff;
    padding: 0px 20px 0px 20px !important;
  }
  header.noimage .tile-headline h1 + span > span {
    color: #fff;
  }
}
@media screen and (max-width: 819px) {
  header.noimage.is_highlight .tile-headline h1 + span {
    padding: 0px 0px 0px 20px !important;
  }
}
h3 {
  font-size: 20px;
  line-height: 26px;
  margin-bottom: 10px;
}
@media (min-width: 500px) {
  h3 {
    font-size: 25px;
    line-height: 28px;
    margin-bottom: 15px;
  }
}
@media (min-width: 1300px) {
  h3 {
    font-size: 35px;
    line-height: 38px;
    margin-bottom: 20px;
  }
}
.flex-d--50 h3 {
  font-size: 18px;
  line-height: 20px;
  margin-bottom: 30px;
}
@media (min-width: 500px) {
  .flex-d--50 h3 {
    font-size: 20px;
    line-height: 23px;
    margin-bottom: 30px;
  }
}
@media (min-width: 1300px) {
  .flex-d--50 h3 {
    font-size: 25px;
    line-height: 28px;
    margin-bottom: 30px;
  }
}
.tile-label h3 {
  font-size: 14px;
  line-height: 18px;
  margin-bottom: 5px;
}
@media (min-width: 500px) {
  .tile-label h3 {
    font-size: 16px;
    line-height: 20px;
  }
}
@media (min-width: 1300px) {
  .tile-label h3 {
    font-size: 20px;
    line-height: 23px;
  }
}

.flip {
  position: relative;
  -moz-perspective: 500;
  -webkit-perspective: 500;
  perspective: 500;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.buzzwords li {
  font-weight: 600;
  display: block;
  width: auto;
  /* -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; */
  opacity: 0;
  -moz-transform-origin: 0% 0%;
  -ms-transform-origin: 0% 0%;
  -webkit-transform-origin: 0% 0%;
  transform-origin: 0% 0%;
  transform-origin: 0% 0%;
  -moz-transform: rotateX(90deg);
  -ms-transform: rotateX(90deg);
  -webkit-transform: rotateX(90deg);
  transform: rotateX(90deg);
  position: absolute;
  top: -20px;
  left: 0;
}

/* .buzzwords li.set {
  top: 0;
  opacity: 1;
  -moz-transform-origin: 0% 0%;
  -ms-transform-origin: 0% 0%;
  -webkit-transform-origin: 0% 0%;
  transform-origin: 0% 0%;
  -moz-transform: rotateX(0deg);
  -ms-transform: rotateX(0deg);
  -webkit-transform: rotateX(0deg);
  transform: rotateX(0deg);
}

.buzzwords li.down {
  top: 40px;
  opacity: 0;
  -moz-transform-origin: 0% 0%;
  -ms-transform-origin: 0% 0%;
  -webkit-transform-origin: 0% 0%;
  transform-origin: 0% 0%;
  -moz-transform: rotateX(-90deg);
  -ms-transform: rotateX(-90deg);
  -webkit-transform: rotateX(-90deg);
  transform: rotateX(-90deg);
} */

#container .tile ul li::before {
  content: "✓";
  background: unset;
  font-size: 1.75em;
  line-height: 0.5;
  color: var(--sabo-lightblue);
}

#container .tile ul li {
  padding-left: 1.5em;
}

form .checkbox_container input[checked] + label:after,
form .checkbox_container input:checked + label:after {
  background: url(/files/assets/images/icons/checked.svg) no-repeat center center;
}


#container .tile.tile--6 > div.tile-bg.full {
  flex: 1;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
}
@media (min-width: 820px) {
  #container .tile.tile--6 > div.tile-bg.full  img{
    max-width: calc(100% );
  }
}

/* Kachel Wrapper */
.kachel-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.kachel-wrapper .kachel-wrapper-headline {
  width: 100%;
  text-align: center;
  /* margin-bottom: 20px; */
}
.kachel-wrapper > .tailor-made_section-slider {
  margin-bottom: 0 !important;
}
.kachel-wrapper > .tailor-made_section-slider h2 {
  padding-bottom: 40px;
}
.kachel-wrapper > .tailor-made_section-slider .splide__arrows {
  top: 36px !important;
}
.kachel-wrapper > .tailor-made_section-slider .splide__pagination {
  top: 64px !important;
}
.kachel-wrapper .tailor-made_section-text {
  max-height: 520px;
  height: auto;
  display: flex;
  align-items: center;
}
@media (max-width: 500px) {
  .kachel-wrapper > .tailor-made_section-slider .splide__slide .tile-bg picture{
    padding-right: 0.1px;
  }
}
@media (max-width: 1023px) {
  .kachel-wrapper .tailor-made_section-text {
      padding-left: 0 !important;
  }
}
@media (max-width: 819px) and (min-width: 769px) {
  .kachel-wrapper {
      padding: 0 60px;
  }
  .kachel-wrapper > .tailor-made_section-slider .splide__arrows {
      right: 0 !important;
  }
  .kachel-wrapper > .tailor-made_section-slider .splide__pagination {
      left: 96px !important;
      width: calc(100% - 256px) !important;
  }
}
@media (max-width: 819px) {
  .kachel-wrapper .tailor-made_section-text {
      padding-left: 0 !important;
  }
  .kachel-wrapper .tailor-made_section-text .content {
      padding-left: 0 !important;
  }
}
@media (width: 768px) {
  .kachel-wrapper .tailor-made_section-text .content {
      padding-left: 10px !important;
  }
}
@media (max-width: 768px) {
  .kachel-wrapper {
      padding: 0 10px;
  }
  .kachel-wrapper > .tailor-made_section-slider .splide__arrows {
      right: 10px !important;
  }
  .kachel-wrapper > .tailor-made_section-slider .splide__pagination {
      top: 81px !important;
      left: 10px !important;
      width: calc(100% - 20px) !important;
  }
}
@media (min-width: 820px) {
  .kachel-wrapper {
      max-width: calc(var(--resonsive-max-width) - 2* var(--responsive-padding));
  }
  .kachel-wrapper .tailor-made_section-text .content {
      padding-left: 16px !important;
      padding-top: 0 !important;
  }
}
@media (min-width: 1024px) {
  .kachel-wrapper > .tailor-made_section-slider {
      width: 49%;
  }
  .kachel-wrapper > .tailor-made_section-slider h2 {
      display: none;
  }
  .kachel-wrapper > .tailor-made_section-slider .splide__arrows {
      left: calc(100% - 140px) !important;
  }
  .kachel-wrapper > .tailor-made_section-slider .splide__pagination {
      left: -78px !important;
  }
  .kachel-wrapper .tailor-made_section-text {
      text-align: right;
      width: 49% !important;
      max-height: 510px;
      min-width: 49% !important;
      padding-right: 0 !important;
      flex-basis: 49% !important;
  }
}
@media (min-width: 1300px) {
  .kachel-wrapper {
      padding: 0 0 0 40px;
  }
  .kachel-wrapper > .tailor-made_section-slider {
      padding-left: 50px;
  }
  .kachel-wrapper .tailor-made_section-text {
      max-height: 635px;
      max-width: 100% !important;
      width: 100% !important;
      padding-left: 60px !important;
  }
}

/* Kachel Wrapper for Teaser */
.kachel-wrapper:has(.tile--2){
  padding: 0;
  max-width: 100%;
  column-gap: 30px;
  flex-direction: row;
  justify-content: center;

}
@media(width >= 1580px){
  .kachel-wrapper:has(.tile--2){
    max-width: calc(var(--resonsive-max-width) - 2* var(--responsive-padding));
  }
}
@media (min-width: 1300px) {
  .kachel-wrapper:has(.tile--2){
    column-gap: 60px;
  }
}


/* Section Economy and Ecology */
.section-economy_ecology .inside .tile-button{
  padding-bottom: 10px;
}

/* Product Page */
#container #dma-app .wishlist.nohover{
  position: absolute;
  top: 4px !important;
  right: 8px;
  z-index: 10;
  padding-top: 0;
}

/* One Teaser Element */
.one-teaser_specify .tile-image {
  padding: 0 !important;
  height: auto !important;
}
.one-teaser_specify .tile-image picture {
  width: 100%;
  display: flex;
}
.one-teaser_specify .tile-image picture img {
  max-width: 520px !important;
}
.one-teaser_specify .content .tile-headline h2 {
  text-align: left !important;
  font-size: 40px;
  line-height: 43px;
}
.one-teaser_specify .inside .tile-text{
  margin-bottom: 0px !important;
}
.one-teaser_specify .inside .tile-bg-border{
  top: 70px !important;
}

.sabo-interview_codesys-logo .tile-image img{
  max-width: 500px;
}

/* splide Slider for Per page 3 or 2 */
/* #container .slider.splide-slider_omitEnd .splide__pagination li[role="presentation"] button.is-active {
  display: block;
  overflow: hidden;
  transform: scale(1);
  width: 100%;
  border-radius: unset;
  background: var(--sabo-label-blue);
  opacity: 1;
  margin-left: 0;
  height: 4px;
  top: 6px;
}
#container .slider.splide-slider_omitEnd .splide__pagination li[role="indicator"] {
  display: none;
} */

.header_sabo.header_startseite picture{
  overflow: hidden !important;
}

/* Contao Accordion */
section.content-accordion {
  border-bottom:  0 !important;
}
section.content-accordion .handorgel__header{
  box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.07);
}
section.content-accordion .handorgel__header .handorgel__header__button {
  border: 1px solid var(--sabo-lightgrey);
  line-height: 1;
  font-size: 18px;
  font-family: "Conneqt";
  white-space: normal !important;
  padding: 20px 60px 20px 28px;
  cursor: pointer;
  margin-bottom: 0;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: var(--sabo-white);
  position: relative;
  
}
section.content-accordion .handorgel__header .accordion_open_close{
  position: absolute;
  right: 0;
  height: 100%;
  top: 0;
  width: 60px;
}
section.content-accordion .handorgel__header .accordion_open_close:after,
section.content-accordion .handorgel__header .accordion_open_close:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 30px;
  height: 3px;
  background: var(--sabo-lightblue);
}
section.content-accordion .handorgel__header .accordion_open_close:after {
  transform: rotate(90deg);
  transition: transform 0.3s ease-in-out 0s;
}
section.content-accordion .handorgel__header.handorgel__header--opened .accordion_open_close:after {
  transform: rotate(180deg);
}
@media (max-width: 1023px) {
  section.content-accordion .handorgel__header .handorgel__header__button {
    padding-left: 20px;
    hyphens: auto;
  }
}
@media (min-width: 1100px) {
  section.content-accordion .handorgel__header .handorgel__header__button br{
    display: none;
  }
}
section.content-accordion .handorgel__content {
  margin: 0 2px;
  background: var(--sabo-white);
  padding: 0;
  border: 0;
  box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.07);
}
section.content-accordion .handorgel__content .handorgel__content__inner {
  padding: 30px 40px;
}
section.content-accordion .handorgel__content .handorgel__content__inner .content-text{
  margin-bottom: 0 !important;
}
section.content-accordion .handorgel__content .handorgel__content__inner .content-text .inside{
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
section.content-accordion .handorgel__content .handorgel__content__inner .content-text .inside .content{
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
@media (min-width: 1065px) {
  section.content-accordion .handorgel__content .handorgel__content__inner {
    max-width: 1024px;
  }
}
@media (min-width: 1300px) {
  section.content-accordion .handorgel__content .handorgel__content__inner {
      padding: 30px 60px;
  }
}

@media (max-width: 767px) {
  section.content-accordion .handorgel__content .handorgel__content__inner h1,
  section.content-accordion .handorgel__content .handorgel__content__inner h2,
  section.content-accordion .handorgel__content .handorgel__content__inner h3,
  section.content-accordion .handorgel__content .handorgel__content__inner h4,
  section.content-accordion .handorgel__content .handorgel__content__inner h5,
  section.content-accordion .handorgel__content .handorgel__content__inner h6{
    hyphens: auto;
  }
}


/* Section table*/
section.content-table .inside .content{
  overflow-x: auto;
}
section.content-table table {
    width: 100%;
    font-family: "Conneqt";
    background-color: var(--sabo-white);
    border-collapse: collapse;
}
section.content-table table th,
section.content-table table td {
    border: 2px solid var(--sabo-label-grey);
    padding: 15px;
}
section.content-table table thead {
    color: var(--sabo-lightblue);
}
section.content-table table thead th {
    outline: 0;
    border-spacing: 0;
    line-height: 1;
    font-size: 20px;
}
section.content-table table tbody {
    font-family: "Zilla Slab";
}
section.content-table table tbody tr:nth-child(odd) {
    background-color: var(--sabo-lightgrey-table);
}
section.content-table table tbody tr:nth-child(even) {
    background-color: var(--sabo-grey-ligthen);
}
section.content-table table tbody tr td {
    text-align: center;
    line-height: 1;
    font-size: 18px;
}


/* Header Startseite Teaser*/
header.header_startseite_teaser .claim {
  top: 17%;
}
@media (min-width: 600px) {
  header.header_startseite_teaser .claim {
      top: 25%;
  }
}
@media (min-width: 768px) {
  header.header_startseite_teaser .claim {
      top: 90px;
  }
}
@media (min-width: 820px) {
  header.header_startseite_teaser .claim {
      top: 120px;
  }
}
@media (min-width: 1280px) {
  header.header_startseite_teaser .claim {
      top: 135px;
  }
}
@media (min-width: 1580px) {
  header.header_startseite_teaser .claim {
      top: 150px;
  }
}
header.header_startseite_teaser .header-teaser_wrapper {
  background-color: #FAFAFA;
  padding: 20px;
  width: 100%;
}
header.header_startseite_teaser .header-teaser_wrapper .header-teaser_logo {
  text-align: center;
  width: 100%;
  padding-bottom: 20px;
}
header.header_startseite_teaser .header-teaser_wrapper .header-teaser_logo img {
  max-height: 115px;
}
header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content {
  display: flex;
  flex-direction: column;
}
header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_left,
header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_right {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 2px solid var(--sabo-label-grey);
  padding: 30px;
  width: 100%;
}
header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_left h3,
header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_right h3 {
  color: var(--sabo-darkblue);
}
header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_left ul,
header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_right ul {
  list-style: disc;
  padding-left: 22px;
}
header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_left ul li,
header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_right ul li {
  margin-bottom: 10px;
}
header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_left .tile-button,
header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_right .tile-button {
  padding-top: 30px;
}
header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_left .tile-button a,
header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_right .tile-button a {
  padding: 16px 29px;
}
header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_right {
  margin-top: 20px;
}
@media (min-width: 768px) {
  header.header_startseite_teaser .header-teaser_wrapper {
      margin-top: -50px;
  }
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_left,
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_right {
      width: 70%;
  }
}
@media (max-width: 819px) {
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content {
      align-items: center;
  }
}
@media (min-width: 820px) {
  header.header_startseite_teaser .header-teaser_wrapper {
      margin-top: 0;
      padding: 0 15px 15px;
  }
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_logo {
      padding-bottom: 30px;
      width: 50%;
      text-align: right;
      padding-right: 7.5px;
  }
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content {
      flex-direction: row;
  }
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_left,
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_right {
      width: 50%;
      padding: 15px;
  }
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_left {
      margin-right: 7.5px;
  }
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_right {
      margin-top: 0;
      margin-left: 7.5px;
  }
}
@media (min-width: 1024px) {
  header.header_startseite_teaser .header-teaser_wrapper {
      margin-top: -145px;
      padding: 0 30px 30px;
  }
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content {
      flex-direction: row;
  }
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_left,
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_right {
      padding: 20px;
  }
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_left {
      margin-right: 15px;
  }
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_right {
      margin-left: 15px;
  }
}
@media (min-width: 1300px) {
  header.header_startseite_teaser .header-teaser_wrapper {
      padding: 0 90px 90px;
  }
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_logo {
      padding-right: 30px;
  }
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_left {
      margin-right: 30px;
  }
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_right {
      margin-left: 30px;
  }
}
@media (min-width: 1300px) and (max-width: 1420px) {
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_left h2,
  header.header_startseite_teaser .header-teaser_wrapper .header-teaser_content .header-teaser_right h2 {
      font-size: 50px;
  }
}

/* Header Casestudy*/
body #container .mod_article > header .casestudy_inside {
  padding: 40px 0;
}
@media (min-width: 820px) {
  body #container .mod_article > header .casestudy_inside {
      padding: 60px;
  }
}
@media (min-width: 1300px) {
  body #container .mod_article > header .casestudy_inside {
      padding: 100px 90px;
  }
}
@media (min-width: 2400px) {
  body #container .mod_article > header .casestudy_inside {
      padding: 120px 90px;
  }
}
#container header.header_casestudy {
  margin-top: 0;
}
#container header.header_casestudy .casestudy_inside .tile-headline {
  width: 100%;
  max-width: 1064px;
}
#container header.header_casestudy .casestudy_inside .tile-headline h1 {
  max-width: 100%;
  font-family: "Conneqt";
  color: var(--sabo-lightblue);
  font-size: 35px;
  line-height: 38px;
  margin-bottom: 20px;
  display: inline-block;
  padding: 0 !important;
}
@media (min-width: 768px) {
  #container header.header_casestudy .casestudy_inside .tile-headline h1 {
      hyphens: none;
      word-wrap: unset;
      overflow-wrap: unset;
  }
}
@media (min-width: 1024px) {
  #container header.header_casestudy .casestudy_inside .tile-headline h1 {
      font-size: 40px;
      line-height: 43px;
      margin-bottom: 25px;
  }
}
@media (min-width: 1300px) {
  #container header.header_casestudy .casestudy_inside .tile-headline h1 {
      font-size: 60px;
      line-height: 63px;
      margin-bottom: 30px;
  }
}
@media (max-width: 425px) {
  #container header.header_casestudy .casestudy_inside .tile-headline {
      padding: 0 60px 0 30px;
      hyphens: auto;
  }
}
#container header.header_casestudy .casestudy_inside .content {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  margin-top: 30px;
}
#container header.header_casestudy .casestudy_inside .content .tile-text,
#container header.header_casestudy .casestudy_inside .content .tile-img {
  flex: 1;
}
#container header.header_casestudy .casestudy_inside .content .tile-text img,
#container header.header_casestudy .casestudy_inside .content .tile-img img {
  display: block;
  object-fit: cover;
}
#container header.header_casestudy .casestudy_inside .content .tile-text {
  margin-bottom: 0;
}
#container header.header_casestudy .casestudy_inside .content .tile-text .tile-trust_logo,
#container header.header_casestudy .casestudy_inside .content .tile-text .tile-subheadline h3 {
  margin-bottom: 20px;
}
#container header.header_casestudy .casestudy_inside .content .tile-text .tile-trust_logo {
  max-width: 350px;
}
#container header.header_casestudy .casestudy_inside .content .tile-text .tile-trust_logo img {
  width: 100%;
}
#container header.header_casestudy .casestudy_inside .content .tile-text .header_term_description {
  display: inline-flex;
  gap: 15px;
  margin-bottom: 5px;
}
@media (min-width: 960px) {
  #container header.header_casestudy .casestudy_inside .content {
      column-gap: 30px;
  }
}
/* @media (min-width: 1300px) {
  #container header.header_casestudy .casestudy_inside .content {
      column-gap: 60px;
  }
} */
@media (min-width: 1500px) {
  #container header.header_casestudy .casestudy_inside .content {
      align-items: center;
  }
}
@media (max-width: 959px) {
  #container header.header_casestudy .casestudy_inside .tile-headline {
      padding-left: 20px;
  }
  #container header.header_casestudy .casestudy_inside .content {
      flex-direction: column-reverse;
  }
  #container header.header_casestudy .casestudy_inside .content .tile-text {
      padding: 30px 20px 20px;
  }
}
@media (max-width: 819px) {
  #container header.header_casestudy .casestudy_inside .tile-headline,
  #container header.header_casestudy .casestudy_inside .content .tile-text {
      padding-left: 80px;
      padding-right: 80px;
  }
}
@media (max-width: 767px) {
  #container header.header_casestudy .casestudy_inside .tile-headline,
  #container header.header_casestudy .casestudy_inside .content .tile-text {
      padding-left: 30px;
      padding-right: 30px;
  }
}


/* Section => Tile Content */
#container .tile.tile_content.tile--1 > .inside {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
}
#container .tile.tile_content.tile--1 > div.inside img {
  display: block;
  left: 0;
}
#container .tile.tile_content.tile--1 > .inside .content {
  display: flex;
}
#container .tile.tile_content.tile--1 > .inside .content:not(:has(.tile-bg)) {
  flex-direction: column;
}
#container .tile.tile_content.tile--1 > .inside .content .tile-label{
  width: 100%;
}
@media (min-width: 950px) {
  #container .tile.tile_content.tile--1 > .inside .content .tile-label:has(+ .tile-text .tile-text-2) {
      padding-bottom: 10px;
  }
}
#container .tile.tile_content.tile--1 > .inside .content .tile-text {
  width: 100%;
}
#container .tile.tile_content.tile--1 > .inside .content .tile-text strong{
    font-style: italic;
}
#container .tile.tile_content.tile--1 > .inside .content .tile-text p:last-of-type {
  margin-bottom: 0;
}
@media (max-width: 949px) {
  #container .tile.tile_content.tile--1 > .inside .content .tile-text .tile-text-2 {
      margin-top: 20px;
  }
}
@media (min-width: 950px) {
  #container .tile.tile_content.tile--1 > .inside .content .tile-text:has(.tile-text-2) {
      display: flex;
      flex-wrap: wrap;
      max-width: 100% !important;
      column-gap: 30px;
  }
  #container .tile.tile_content.tile--1 > .inside .content .tile-text .tile-text-1,
  #container .tile.tile_content.tile--1 > .inside .content .tile-text .tile-text-2 {
      flex: 1;
  }
}
@media (min-width: 1300px) {
  #container .tile.tile_content.tile--1 > .inside .content .tile-text:has(.tile-text-2) {
      column-gap: 60px;
  }
}
@media (max-width: 767px) {
  #container .tile.tile_content.tile--1 > .inside div.tile-bg img {
      left: 0;
  }
}
@media (min-width: 768px) {
  #container .tile.tile_content.tile--1 > .inside .tile-headline h2 {
      hyphens: none;
      word-wrap: unset;
      overflow-wrap: unset;
  }

}
@media (min-width: 768px) and (max-width: 1023px) {
  /* #container .tile.tile_content.tile--1 > .inside .content:not(:has(.tile-bg)) { */
  #container .tile.tile_content.tile--1 > .inside .content {
    padding-right: 20px;
  }
}
@media (min-width: 820px) {
  #container .tile.tile_content.tile--1 > .inside .content .tile-text {
      padding-right: 0;
  }
}
@media (max-width: 1023px) {
  #container .tile.tile_content.tile--1 > .inside:has(.content + .tile-bg) {
      flex-direction: column-reverse;
  }
}
@media (min-width: 1024px) {
  #container .tile.tile_content.tile--1 > .inside > .content:has(+ .tile-bg) {
      margin-top: -7px;
  }
  #container .tile.tile_content.tile--1 > .inside .content {
      padding: 0;
  }
}
@media (min-width: 1300px) {
  #container .tile.tile_content.tile--1 > .inside .content:not(:has(.tile-bg)).width_66 .tile-text .tile-text-2,
  #container .tile.tile_content.tile--1 > .inside .content:not(:has(.tile-bg)).width_75 .tile-text .tile-text-2 {
      margin-top: 60px;
  }
  #container .tile.tile_content.tile--1 > .inside > .content:has(+ .tile-bg) {
      margin-top: -10px;
  }
  #container .tile.tile_content.tile--1 > .inside > .tile-bg,
  #container .tile.tile_content.tile--1 > .inside .content:has(+ .tile-bg) {
      width: 50%;
      min-width: unset;
  }
}
@media (min-width: 950px) {
  #container .tile.tile_content.tile--1:not(.column_center) .content:not(:has(.tile-bg)).width_50 .tile-text {
      max-width: 66%;
  }
  #container .tile.tile_content.tile--1:not(.column_center) .content:not(:has(.tile-bg)).width_66 .tile-text {
      max-width: 75%;
  }
  #container .tile.tile_content.tile--1:not(.column_center) .content:not(:has(.tile-bg)).width_75 .tile-text {
      max-width: 90%;
  }
}
@media (min-width: 1060px) {
  #container .tile.tile_content.tile--1:not(.column_center) .content:not(:has(.tile-bg)) > div:not(.tile-text) {
      max-width: 1060px;
  }
}
@media (min-width: 1300px) {
  #container .tile.tile_content.tile--1:not(.column_center) .content:not(:has(.tile-bg)).width_50 .tile-text {
      max-width: 50%;
  }
  #container .tile.tile_content.tile--1:not(.column_center) .content:not(:has(.tile-bg)).width_66 .tile-text {
      max-width: 66%;
  }
  #container .tile.tile_content.tile--1:not(.column_center) .content:not(:has(.tile-bg)).width_75 .tile-text {
      max-width: 75%;
  }
}
@media (min-width: 820px) {
  #container .tile.tile_content.tile--1.nobox > .inside {
      padding-right: 60px;
      padding-left: 60px;
  }
}
@media (min-width: 1300px) {
  #container .tile.tile_content.tile--1.nobox > .inside {
      padding-right: 90px;
      padding-left: 90px;
  }
}
#container .tile.tile_content.tile--1.boxed > .inside {
  box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.07);
}
#container .tile.tile_content.tile--1.column_center > .inside {
  align-items: center;
  justify-content: center;
}
@media (min-width: 950px) {
  #container .tile.tile_content.tile--1.column_center > .inside .content:not(:has(.tile-bg)).width_50 {
      max-width: 66%;
  }
  #container .tile.tile_content.tile--1.column_center > .inside .content:not(:has(.tile-bg)).width_66 {
      max-width: 75%;
  }
  #container .tile.tile_content.tile--1.column_center > .inside .content:not(:has(.tile-bg)).width_75 {
      max-width: 90%;
  }
}
@media (min-width: 1300px) {
  #container .tile.tile_content.tile--1.column_center > .inside .content:not(:has(.tile-bg)).width_50 {
      max-width: 50%;
  }
  #container .tile.tile_content.tile--1.column_center > .inside .content:not(:has(.tile-bg)).width_66 {
      max-width: 66%;
  }
  #container .tile.tile_content.tile--1.column_center > .inside .content:not(:has(.tile-bg)).width_75 {
      max-width: 75%;
  }
}
#container .tile.tile_content.tile--1.title_first > .inside {
  flex-direction: column;
}
@media (max-width: 1023px) {
  #container .tile.tile_content.tile--1.title_first > .inside .content {
      flex-direction: column;
  }
}
@media (min-width: 1024px) {
  #container .tile.tile_content.tile--1.title_first > .inside .content {
      flex-wrap: wrap;
      column-gap: 30px;
  }
  #container .tile.tile_content.tile--1.title_first > .inside .content .tile-text,
  #container .tile.tile_content.tile--1.title_first > .inside .content .tile-bg {
      flex: 1;
  }
}
@media (min-width: 1300px) {
  #container .tile.tile_content.tile--1.title_first > .inside .content {
      column-gap: 60px;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  #container .tile.tile_content.tile--1.title_first > .inside > .tile-headline,
  #container .tile.tile_content.tile--1.title_first > .inside > .tile-subheadline {
      padding-right: 20px;
      padding-left: 20px;
  }
}
@media (max-width: 767px) {
  #container .tile.tile_content.tile--1.title_first > .inside > .tile-headline,
  #container .tile.tile_content.tile--1.title_first > .inside > .tile-subheadline {
      padding-right: 10px;
      padding-left: 10px;
  }
}
@media (max-width: 767px) {
  #container .tile.tile_content.tile--1 + .tile:not(.title_first, .citation_block) .inside .tile-bg,
  #container .tile.tile_content.tile--1 + .tile:not(.title_first, .citation_block) .inside .tile-image {
      margin-right: -20px;
      margin-left: -20px;
  }
  #container .tile.tile_content.tile--1 + .tile:not(.title_first) .inside .tile-image picture:after {
      left: -20px;
      right: -20px;
  }
}


/* Citation Block*/
#container .tile.citation_block.tile--1 .inside {
  position: relative;
  display: flex;
  flex-direction: column-reverse;
  /* padding: 60px 20px 20px; */
  padding: 0;
}
#container .tile.citation_block.tile--1 div.inside img {
  display: block;
  left: 0;
}
#container .tile.citation_block.tile--1 .inside .content {
  padding: 30px 40px 60px 40px;
}
#container .tile.citation_block.tile--1 .inside .content .tile-headline h2{
  color: #F55E00;
}
#container .tile.citation_block.tile--1 .inside .content .tile-text {
  margin-bottom: 15px;
}
#container .tile.citation_block.tile--1 .inside .content .tile-text p {
  font-size: 20px;
  line-height: 1.3;
  letter-spacing: 0;
}
#container .tile.citation_block.tile--1 .inside .content .tile-text p strong {
  font-style: italic;
}
#container .tile.citation_block.tile--1 .inside .content .citation_name_description span,
#container .tile.citation_block.tile--1 .inside .content .citation_name_description p {
  font-size: 14px;
  font-style: italic;
  line-height: 1.2;
}
#container .tile.citation_block.tile--1 .inside .content .citation_name_description span {
  font-weight: bold;
}
@media (max-width: 767px) {
  #container .tile.citation_block.tile--1 .inside .tile-bg {
      margin-right: -20px;
      margin-left: -20px;
  }
}
@media (min-width: 820px) {
  #container .tile.citation_block.tile--1 .inside {
      /* padding: 80px 60px; */
      column-gap: 30px;
  }
  #container .tile.citation_block.tile--1 .inside .content .tile-text {
    padding-right: 0;
  }
}
@media (min-width: 900px) {
  #container .tile.citation_block.tile--1 .inside {
    padding: 80px 0px 80px 60px;
    flex-direction: row;
    align-items: flex-start;    
  }
  #container .tile.citation_block.tile--1 .inside .content {
    padding: 0;
    margin-top: -7px;
  }
}
@media (min-width: 1024px) {
  #container .tile.citation_block.tile--1 .inside {
      margin-top: 90px;
      padding-top: 100px;
      padding-bottom: 100px;
  }
  #container .tile.citation_block.tile--1 .inside > .tile-bg,
  #container .tile.citation_block.tile--1 .inside > .content {
      flex: 1;
  }
  #container .tile.citation_block.tile--1 .inside > .tile-bg {
      min-width: unset;
  }
}
@media (min-width: 1300px) {
  #container .tile.citation_block.tile--1 .inside {
      column-gap: 60px;
  }
  #container .tile.citation_block.tile--1 .inside .content .tile-text p {
      font-size: 25px;
  }
  #container .tile.citation_block.tile--1 .inside .content .citation_name_description span,
  #container .tile.citation_block.tile--1 .inside .content .citation_name_description p {
      font-size: 15px;
  }
}
@media (min-width: 1300px) {
  #container .tile.citation_block.tile--1 .inside {
      /*padding-right: 90px;*/
      padding-left: 90px;
  }
}
@media (min-width: 1500px) {
  #container .tile.citation_block.tile--1 .inside {
      align-items: center;
  }
  /* #container .tile.citation_block.tile--1 .inside .content .tile-text p {
      font-size: 35px;
  } */
  /* #container .tile.citation_block.tile--1 .inside .content .citation_name_description p,
  #container .tile.citation_block.tile--1 .inside .content .citation_name_description span {
      font-size: 20px;
  } */
}
#container .tile.citation_block.tile--1 .inside:after {
  content: '';
  background: url("/files/assets/images/2_content/casestudy/zitat_zeichen.svg");
  background-repeat: no-repeat;
  position: absolute;
  left: 30px;
  width: 100%;
  height: 100%;
  top: -63px;
  max-width: 200px;
  max-height: 160px;
  background-size: 70%;
  z-index: 1;
}
@media (min-width: 1024px) {
  #container .tile.citation_block.tile--1 .inside:after {
      background-size: 80%;
      top: -70px;
  }
}
@media (min-width: 1300px) {
  #container .tile.citation_block.tile--1 .inside:after {
      background-size: 90%;
      top: -80px;
  }
}
@media (min-width: 1500px) {
  #container .tile.citation_block.tile--1 .inside:after {
      background-size: 100%;
      top: -90px;
  }
}
#container .tile.citation_block.tile--1 .inside:before {
  content: '';
  position: absolute;
  background: #fff;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-bottom: 4px solid #F55E00;
  box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.07);
}
@media (min-width: 900px) {
  #container .tile.citation_block.tile--1 .inside:before {
      width: 76%;
  }
}

/* Callback Formular*/
#container .tile.callback_formular.tile--1 .inside {
  background: transparent linear-gradient(198deg, #00DBFF 0%, var(--sabo-darkblue) 100%) 0 0 no-repeat padding-box;
  padding: 0;
}
#container .tile.callback_formular.tile--1 .inside img {
  display: block;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .content {
  padding: 0;
}
#container .tile.callback_formular.tile--1 .inside .formular_first_row {
  display: flex;
  flex-direction: column;
}
#container .tile.callback_formular.tile--1 .inside .formular_first_row .tile-text h2,
#container .tile.callback_formular.tile--1 .inside .formular_first_row .tile-text h3,
#container .tile.callback_formular.tile--1 .inside .formular_first_row .tile-text p,
#container .tile.callback_formular.tile--1 .inside .formular_first_row .first_row_title h2,
#container .tile.callback_formular.tile--1 .inside .formular_first_row .first_row_title h3,
#container .tile.callback_formular.tile--1 .inside .formular_first_row .first_row_title p {
  color: var(--sabo-white);
}
#container .tile.callback_formular.tile--1 .inside .formular_first_row .tile-text p strong,
#container .tile.callback_formular.tile--1 .inside .formular_first_row .first_row_title p strong {
  font-style: italic;
  font-weight: 700;
}
#container .tile.callback_formular.tile--1 .inside .formular_first_row > .tile-bg,
#container .tile.callback_formular.tile--1 .inside .formular_first_row > .first_row_title,
#container .tile.callback_formular.tile--1 .inside .formular_first_row > .content {
  width: 100%;
}
#container .tile.callback_formular.tile--1 .inside .formular_first_row .row_img_title {
  position: relative;
}
#container .tile.callback_formular.tile--1 .inside .formular_first_row .row_img_title .first_row_title {
  position: absolute;
  background: #F55E00;
  width: 100%;
  padding: 20px 30px 22px;
  bottom: 0;
  right: 0;
  text-align: right;
  box-shadow: 0 20px 30px #00000029;
}
#container .tile.callback_formular.tile--1 .inside .formular_first_row .row_img_title .first_row_title h2 {
  margin-bottom: 20px;
}
#container .tile.callback_formular.tile--1 .inside .formular_first_row .row_img_title .first_row_title h3 {
    margin-bottom: 0px;
}
@media (max-width: 599px) {
  #container .tile.callback_formular.tile--1 .inside .formular_first_row .row_img_title {
      padding-bottom: 50px;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_first_row .row_img_title .first_row_title h2 {
      font-size: 30px;
      margin-bottom: 10px !important;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_first_row .row_img_title .first_row_title h3 {
      font-size: 20px;
  }
}
@media (max-width: 368px) {
  #container .tile.callback_formular.tile--1 .inside .formular_first_row .row_img_title .first_row_title h2 {
      font-size: 25px;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_first_row .row_img_title .first_row_title h3 {
      font-size: 18px;
  }
}
@media (min-width: 820px) {
  #container .tile.callback_formular.tile--1 .inside .formular_first_row .row_img_title .first_row_title {
      width: 100%;
  }
}
@media (min-width: 1024px) {
  #container .tile.callback_formular.tile--1 .inside .formular_first_row .row_img_title .first_row_title {
      padding: 20px 30px 24px 20px;
      top: 12%;
      width: 60%;
      bottom: unset;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_first_row .row_img_title > .tile-bg {
      width: 55%;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_first_row > .content {
      width: 50%;
      padding-right: 15px;
  }
}
@media (min-width: 1024px) and (max-width: 1080px) {
  #container .tile.callback_formular.tile--1 .inside .formular_first_row .row_img_title .first_row_title h2 {
      font-size: 37px;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_first_row .row_img_title .first_row_title h3 {
      font-size: 23px;
  }
}
@media (min-width: 1300px) and (max-width: 1480px) {
  #container .tile.callback_formular.tile--1 .inside .formular_first_row .row_img_title .first_row_title h2 {
      font-size: 49px;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_first_row .row_img_title .first_row_title h3 {
      font-size: 32px;
  }
}
@media (min-width: 1300px) {
  #container .tile.callback_formular.tile--1 .inside .formular_first_row > .content {
      width: 50%;
      padding-right: 30px;
  }
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row {
  display: flex;
  flex-wrap: wrap;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .formular_content_text h2,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .formular_content_text h2 a,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .widget h2,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .widget h2 a,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .tile-text h2,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .tile-text h2 a,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .formular_content_text h2,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .formular_content_text h2 a,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .widget h2,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .widget h2 a,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .tile-text h2,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .tile-text h2 a {
  color: var(--sabo-white);
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .formular_content_text h2,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .widget h2,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .tile-text h2,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .formular_content_text h2,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .widget h2,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .tile-text h2 {
  font-size: 25px;
  line-height: 1.3;
}
@media (min-width: 1300px) {
  #container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .formular_content_text h2,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .widget h2,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .tile-text h2,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .formular_content_text h2,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .widget h2,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .tile-text h2 {
      font-size: 35px;
      line-height: 1.1;
  }
}
@media (min-width: 1450px) {
  #container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .formular_content_text h2,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .widget h2,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .tile-text h2,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .formular_content_text h2,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .widget h2,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .tile-text h2 {
      font-size: 40px;
      line-height: 1.1;
  }
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .formular_content_text h2 a,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .widget h2 a,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .tile-text h2 a,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .formular_content_text h2 a,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .widget h2 a,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .tile-text h2 a {
  font-size: 25px;
  line-height: 1.3;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .formular_content_text p,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .formular_content_text fieldset,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .widget p,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .widget fieldset,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .tile-text p,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .ce_form.block .tile-text fieldset,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .formular_content_text p,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .formular_content_text fieldset,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .widget p,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .widget fieldset,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .tile-text p,
#container .tile.callback_formular.tile--1 .inside .formular_second_row > .content .tile-text fieldset {
  color: var(--sabo-white);
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block {
  margin-bottom: 0;
  width: 60%;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody {
  width: 100%;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .formular_content_text {
  width: 100%;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .formular_content_text p strong {
  font-style: italic;
  font-weight: 700;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget .select {
  background: var(--sabo-white);
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 10px;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget {
  width: 100%;
  margin-bottom: 10px;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget .select {
  background: var(--sabo-white);
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget input,
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget input[type=tel],
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget input[type=date] {
  padding-left: 10px;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget ul {
  padding-top: 0;
  top: 48px;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget ul li {
  padding-left: 10px;
  margin-bottom: 0;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget ul li:before {
  display: none;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget ul li span {
  line-height: unset;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget fieldset legend {
  display: none;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.widget-checkbox {
  margin-bottom: 10px;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.widget-checkbox fieldset {
  padding-top: 10px;
  margin: 0;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.widget-checkbox fieldset label {
  padding-top: 0;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.widget-checkbox input:checked + label:after {
  background-color: #fff;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.select-anrede .conversoft-select:before,
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.select-wishtime .conversoft-select:before {
  left: 10px;
}
@media (min-width: 1024px) {
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.select-anrede .conversoft-select:after,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.select-anrede .conversoft-select span,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.select-wishtime .conversoft-select:after,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.select-wishtime .conversoft-select span,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.widget-text.callback_form_date input[type=date]:after,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.widget-text.callback_form_date input[type=date] span {
    width: 50px;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.select-anrede .conversoft-select:before,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.select-wishtime .conversoft-select:before {
      top: -7px;
  }
}

@media (min-width: 600px) {
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.select-anrede,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.input-firstname {
      width: 23%;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.input-lastname,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.select-wishtime,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.widget-text.callback_form_date {
      width: 48.5%;
  }
}
@media (min-width: 900px) and (max-width: 1250px) {
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.select-anrede {
      width: 100%;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.input-firstname,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.input-lastname,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.select-wishtime,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.widget-text.callback_form_date {
      width: 48.5%;
      min-width: 48.5%;
  }
}
@media (min-width: 1530px) {
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.select-anrede,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.input-firstname {
      width: 24%;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.input-lastname,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.select-wishtime,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody .widget.widget-text.callback_form_date {
      width: 49%;
  }
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody > .widget-text.callback_form_date input:after {
  display: none !important;
  background: unset !important;
  opacity: 0;
  visibility: hidden;
}
@media (max-width: 599px) {
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody > .widget-text.callback_form_date{
    width: 100%;
    display: block;
  }
   #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody > .widget-text.callback_form_date input{
    width: 100%;
    min-width: 100%;
    display: block;
    max-height: 50px;
  }
}
@media (max-width: 1023px) {
  #container .tile.callback_formular.tile--1 .inside .formular_second_row {
      padding-bottom: 20px;
  }
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .content {
  width: 40%;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .content .tile-text p strong {
  font-weight: 700;
  font-family: "Conneqt";
}
@media (min-width: 1024px) {
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .content .tile-text p strong {
      font-size: 20px;
      line-height: 1.3;
  }
}
@media (max-width: 899px) {
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block {
      width: 100%;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .content {
      display: none;
  }
}
@media (min-width: 900px) {
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block {
      padding-right: 15px;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .content {
      padding-left: 15px;
      padding-right: 0;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .content .tile-text {
      padding-right: 0;
  }
}
@media (min-width: 900px) and (max-width: 903px) {
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .content .tile-text .contact-tel a {
      font-size: 23px;
  }
}
@media (min-width: 1300px) {
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block {
      padding-right: 30px;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .content {
      padding-left: 30px;
  }
}
@media (min-width: 820px) {
  #container .tile.callback_formular.tile--1 .inside {
      padding: 0;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_first_row .content {
      padding: 0;
  }
}
@media (max-width: 1023px) {
  #container .tile.callback_formular.tile--1 .inside .formular_first_row .content,
  #container .tile.callback_formular.tile--1 .inside .formular_second_row {
      padding-right: 30px;
      padding-left: 30px;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_first_row .content {
      padding-top: 30px;
  }
}
@media (min-width: 1024px) {
  #container .tile.callback_formular.tile--1 .inside {
      padding: 60px;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_first_row .content {
      padding-top: 50px;
  }
}
@media (min-width: 900px) and (max-width: 1085px) {
  #container .tile.callback_formular.tile--1 .inside .content .tile-text p strong {
      font-size: 18px !important;
  }
  #container .tile.callback_formular.tile--1 .inside .content .tile-text .contact-tel a {
      font-size: 24px !important;
  }
}
@media (min-width: 1300px) {
  #container .tile.callback_formular.tile--1 .inside {
      padding-right: 90px;
      padding-left: 90px;
  }
}


#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody > .widget-text.callback_form_date {
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    overflow: hidden;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody > .widget-text.callback_form_date:after {
    content: "";
    background: url("/files/assets/images/icons/formularDateIcon.svg") no-repeat center center;
    background-size: 50px 50px;
    pointer-events: none;
    position: absolute;
    cursor: pointer;
    right: 0;
    bottom: 0;
    width: 50px;
    height: 50px;
    background-color: var(--sabo-lightblue);
    z-index: 2;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody > .widget-text.callback_form_date input {
  padding-right: 10px;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody > .widget-text.callback_form_date input[type="date"]::-webkit-calendar-picker-indicator {
  width: 36px;
  height: 44px;
  cursor: pointer;
}
#container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody > .select-wishtime > .conversoft-select.select-wishtime:after {
    background: url("/files/assets/images/icons/formularWishtimeIcon.svg") no-repeat center center;
}
@media (max-width: 599px) {
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody > .widget-text.callback_form_date:after{
    height: 48px;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody > .widget-text.callback_form_date{
    width: 100%;
  }
   #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody > .widget-text.callback_form_date input{
    width: 100%;
    min-width: 94%;
    display: block;
    max-height: 48px;
    padding-left: 10px;
    text-align: left;

  }
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody > .widget-text.callback_form_date input:-webkit-datetime-edit{
    text-align: left;
    text-indent: 0;
  }
  /* Safari IOS*/
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .ce_form.block .formbody > .widget-text.callback_form_date input::-webkit-date-and-time-value{
    text-align: left;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .block.form_style_mobile .formbody .widget.widget-text.callback_form_date input {
      min-width: 94%;
      height: 47px;
  }
}
@media (max-width: 500px) {
  #container header .tile-text a{
    padding-right: 45px;
  }
  #container header .tile-text a.hover-underline-animation{
    padding-right: 61px;
  }
  #container header .tile-text a > .arrow {
    right:-10px
  }
  #container header .tile-text a.hover-underline-animation > .arrow{
    right: 0px;
  }
  #container header .tile-text a.hover-underline-animation:hover > .arrow{
    right: -10px;
  }
  #container .tile.callback_formular.tile--1 .inside .formular_second_row .block.form_style_mobile .formbody > .widget-text.callback_form_date:after{
    height: 52px;
    /*border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;*/
  }
}


/* TL */

body.sps-steuerungen-2 #container .tile.tile--2 > .inside .tile-image ,
body.i-o-module #container .tile.tile--2 > .inside .tile-image ,
body.hmi-bedienterminals #container .tile.tile--2 > .inside .tile-image ,
body.oem-individuelle-sps-loesungen #container .tile.tile--2 > .inside .tile-image {
  height:unset;
  box-sizing: border-box;
    width: 100%;
}

body.sps-steuerungen-2 #container .tile.tile--2 > .inside .tile-image img,
body.i-o-module #container .tile.tile--2 > .inside .tile-image img,
body.hmi-bedienterminals #container .tile.tile--2 > .inside .tile-image img,
body.oem-individuelle-sps-loesungen #container .tile.tile--2 > .inside .tile-image img {
  max-height: unset !important;
          max-width: calc(100% - 0px);
}

.mod_article>section.flex-d--50 + section.flex-d--50 {
    /* background: red; */
}

.mod_article>section.flex-d--50 + section.flex-d--50:after {
    flex-basis: 100%;
    content: "";
        width: 100vw;
    display: block;
    min-width: 100vw;
    max-width: 100vw;
    
}

.mod_article>section:nth-of-type(.flex-d--50) {
  flex-basis: 100%;
}
.mod_article>section.flex-d--50 + section.flex-d--66:before {
    flex-basis: 100%;
    content: " ";
    width: 100vw;
    display: block;
    min-width: 100vw;
    max-width: 100vw;
}



body.sps-steuerungen-2 header:not(.is_highlight) .tile-headline h1,
body.i-o-module header:not(.is_highlight) .tile-headline h1,
body.produkte header:not(.is_highlight) .tile-headline h1 ,
body.hmi-bedienterminals header:not(.is_highlight) .tile-headline h1 ,
body.oem-individuelle-sps-loesungen header:not(.is_highlight) .tile-headline h1 {
  background:none
}
body.sps-steuerungen-2 header:not(.is_highlight) .tile-headline h1 + span > span ,
body.i-o-module header:not(.is_highlight) .tile-headline h1 + span > span ,
body.produkte header:not(.is_highlight) .tile-headline h1 + span > span ,
body.hmi-bedienterminals header:not(.is_highlight) .tile-headline h1 + span > span ,
body.oem-individuelle-sps-loesungen header:not(.is_highlight) .tile-headline h1 + span > span,
body.sps-steuerungen-2 header:not(.is_highlight) .tile-headline h1 + span ,
body.i-o-module header:not(.is_highlight) .tile-headline h1 + span ,
body.produkte header:not(.is_highlight) .tile-headline h1 + span ,
body.hmi-bedienterminals header:not(.is_highlight) .tile-headline h1 + span ,
body.oem-individuelle-sps-loesungen header:not(.is_highlight) .tile-headline h1 + span  {

  color:white;}


  body {
    font-feature-settings: "liga" off;}