@charset "UTF-8";

/* lato-300 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/lato-v22-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/lato-v22-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/lato-v22-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/lato-v22-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/lato-v22-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/lato-v22-latin-300.svg#Lato') format('svg'); /* Legacy iOS */
       font-display:swap;
}
/* lato-regular - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/lato-v22-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/lato-v22-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/lato-v22-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/lato-v22-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/lato-v22-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/lato-v22-latin-regular.svg#Lato') format('svg'); /* Legacy iOS */
       font-display:swap;
}

/* pt-sans-regular - latin */
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/pt-sans-v12-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/pt-sans-v12-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/pt-sans-v12-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/pt-sans-v12-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/pt-sans-v12-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/pt-sans-v12-latin-regular.svg#PTSans') format('svg'); /* Legacy iOS */
       font-display:swap;
}
/* pt-sans-700 - latin */
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/pt-sans-v12-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/pt-sans-v12-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/pt-sans-v12-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/pt-sans-v12-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/pt-sans-v12-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/pt-sans-v12-latin-700.svg#PTSans') format('svg'); /* Legacy iOS */
       font-display:swap;
}
/* pt-sans-italic - latin */
@font-face {
  font-family: 'PT Sans';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/pt-sans-v12-latin-italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/pt-sans-v12-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/pt-sans-v12-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/pt-sans-v12-latin-italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/pt-sans-v12-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/pt-sans-v12-latin-italic.svg#PTSans') format('svg'); /* Legacy iOS */
       font-display:swap;
}

 

:root {scroll-behavior: smooth;}

* {box-sizing:border-box; text-size-adjust:none; -webkit-text-size-adjust: none;}

body {margin:0; padding:0; font-family:"PT Sans", sans-serif; line-height:1.3; width:100%; overflow-x:hidden; position:relative;}
img {max-width:100%; height:auto;}
a {color:inherit; text-decoration:none;}
ol, ul, li {list-style:none; margin:0; padding:0; line-height:1.8;}
h1 {color:#014851; font-weight:normal;}
h2 {
  color: #014851;
  font-weight: 400;
  position: relative;
  margin-top: 10px;
  padding-bottom: 15px;
  margin-bottom: 30px;
  display: inline-block;
}
h2::after {
  content:"";
  background-color: #014851;
  height: 1px;
  display: block;
  position: absolute;
  right: 0;
  bottom: 0;
  width: calc(100% + 40px);
}
h3 {
  color: #014851;
}
h4 {
  color: #014851;
  font-family: "PT Serif", serif;
  font-size: 20px;
}
p {
  color: #01515B;
  line-height: 1.8;
  font-size: 16px;
  margin-bottom: 30px;
}

.skip-link {position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; background:#fff; color:#000; z-index:10000; border:2px solid #000; padding:8px 16px; text-decoration:none; transition:left 0.2s, top 0.2s;}
.skip-link:focus, .skip-link:active {left:0px; top:0px; width:100%; height:auto; font-size:1.125em; outline:none; color:#000; text-align:center;}
#skipcontent {scroll-margin-top: 200px;}

.prefooter-faqs {padding:20px;}
.footer-nav {display:flex; flex-direction:row; flex-wrap:wrap; gap:10px;}



/*==== TABS =======*/
.tab-nav {display:flex; border-bottom:2px solid #44b0ad; gap:1rem; background:#fff; padding-top:1rem;}
.main-content-tab-desktop {cursor:pointer; padding:0.75rem 1.5rem; border: 0; background:none; font-size:1.1rem; color:#237080; border-bottom:4px solid transparent; transition:border-color 0.2s, color 0.2s; outline:none;}
.main-content-tab-desktop[aria-selected="true"], .main-content-tab-desktop.main-content-tab-desktop-active {font-weight:bold; color:#0190a1; border-bottom:4px solid #0190a1; background:#f7fcfb;}
.main-content-c {background-color:#fff; padding:20px; display:none; outline:none; opacity:0; border:solid 1px #f5f5f5;}
.main-content-c.active {display:block; animation:fadeIn 0.2s; opacity:1;}
.main-content-tab {font-size:20px; background-color:#f7fcfb; padding:20px;}

@media (max-width: 1199px) {
    .tab-nav {flex-direction:column; border-bottom:none; gap:0;}
    .main-content-tab-desktop, .main-content-tab-desktop[aria-selected="true"] {border-bottom:none; border-left:4px solid transparent; border-radius:0; margin-bottom:0.5rem;}
    .main-content-tab-desktop[aria-selected="true"], .main-content-tab-desktop.main-content-tab-desktop-active {border-left:4px solid #44b0ad; background:#f7fcfb;}}
    .main-content-c {padding:0;}
    .main-content-tab {padding: 10px 20px; font-size:18px;}
    #main-content .win-6 h2 {padding:0 0 0 0; font-size: 20px;}
    @keyframes fadeIn {from { opacity: 0;} to { opacity: 1;}}
/*======== TABS ENDE =========*/






.button {
  border: 1px solid #0190A1;
  color: #0190A1;
  padding: 20px 50px;
  display: inline-block;
  font-size: 16px;
}
.button-blue {background-color:#0190a1; color:#fff;}
.button-blue:hover, .button-blue a:hover {background-color:#fff !important; color:#0190a1 !important;}
.button-grey {background-color:#CD6B16; color:#fff;}
.button-grey:hover, .button-grey a:hover {background-color:#fff !important; color:#ababab !important;}

.button-white {
  border-color: #fff;
}
.scroll-down-button {
  display:none;
  width: 40px;
  height: 40px;
  position: relative;
  left:50%;
  margin-left: -20px;
  margin-top: 20px;
}

/*------------------ FAQ's -------------*/
.faq {background-color:#F0F0F1; padding:20px 20px 20px 20px; max-width:800px;}
.faq-frage {font-size:20px; font-weight:bold;}
.faq-antwort {font-size:18px; border-bottom:solid 1px #c2c2c2;}



.menufrage {background-color:#E5F4F5; margin-bottom:10px; padding:3px 10px 3px 15px; line-height:20px; position:relative; min-height:50px; transition: all ease .5s;}
.menufrage a {font-size:15px;}
.menufrage::before {
    content: "";
    width: 3px;
    height: calc(100% - 20px);
    position: absolute;
    left: 0;
    top: 5px;
    background-color: #CD6B16;
    transition: all ease .4s;
}


.menufrage:hover {
    background-color:#d5f1f3;  
}
.menufrage:hover::before {
    height: calc(100% - 10px);
}


.h_field {display:none;}

.f_frage {
    background-color: #E5F4F5; 
    padding:20px; 
    border-left:solid 7px #CD6B16;
    color: #014851;
    font-family: "PT Serif", serif;
    font-size:24px;
    font-weight:bold;
}
.f_antwort {
    margin:40px 0;
    border: 1px solid #0190A1;
    color: #0190A1;
    padding: 20px 50px;
}

.f_antwort b {font-size:20px;}

.info-box {
  background: #0190A1;
  background: linear-gradient(135deg, #014851 0%, #0190A1 100%);
  color: #fff;
  border-left: 7px solid #CD6B16;
  font-size: 16px;
  padding: 15px 25px;
}
.info-box.move-in {
  transform:translateX(250px);
  -webkit-transform:translateX(250px);
  opacity: 0;
  transition: all ease 0.8s;
}

.info-box.move-in-visible {
  opacity: 1;
  transform:translateX(0);
  -webkit-transform:translateX(0);
}

.container {
  padding: 60px 40px;
}

#skip-to-main-content-link {
  position: absolute;
  top: -200px;
  left: -200px;
}

header {
  position: relative;
}

header #logo {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  top: 0;
}

.header-left {
  height: 100vh;
  position: relative;
  padding-top: 25vh;
  color: #fff;
}
.header-left p, .header-left .button {
  color: #fff;
}
.header-left .container {
  position: relative;
  z-index: 1;
}
.header-left::before {
  content:"";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgb(2,0,36);
  background: linear-gradient(135deg, #014851 0%, #0190A1 100%);
  opacity: 0.9;
}
.header-left-img {
  position: absolute;
  bottom: 0;
  z-index: -1;
  left: 0;
  width: 100%;
}
.header-left p {
  margin-top: 0;
}

.header-title {
  font-family: "PT Serif", serif;
  font-weight: bold;
  font-size: 30px;
  display: inline-block;
  margin-bottom: 50px;
}
.header-text-right {
  text-align: right;
  margin: 50px 0 50px;
  display: block;
}
.header-left .button {
  display: inline-block;
  margin-top: 10px;
}

.nav-btn {
  position: absolute;
  top: 30px;
  right: 25px;
}
.nav-bar {
  width: 15px;
  height: 3px;
  margin-bottom: 7px;
  display: block;
  background-color: #fff;
}

#header-lang-btn {
  position: absolute;
  top: 30px;
  right: 60px;
  width: 15px;
  height: auto;
  display: block;
}

.header-right-top {
  display: none;
}

body.nav-fixed #nav-c {
  position: fixed;
  top: 0;
  min-height: 96px;
}



header #logo {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  top: 0;
  width: 220px;
}


#nav-c {
  background-color: #F0F0F1;
  position: fixed;
  top: -1px;
  left: 0;
  width: 100%;
  height: 0;
  z-index: 99;
  overflow:hidden;
  transition: height ease .4s, top ease .4s, min-height ease .4s;
  min-height: 0;
  -webkit-box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.07);
  -moz-box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.07);
  box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.07);
  border-bottom: 1px solid #2d747b;
}
#nav-c .nav-btn {
  z-index: 51;
  top: 45px;
}
.nav-c-content {
  background-color: #f7f7f7;
  padding: 0 20px;
  display: flex;
  height: 50px;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
#nav-layer {
  position: fixed;
  z-index:199;
  left: 0;
  top: 0;
  background-color:#000;
  width: 100vw;
  height: 100vh;
  display: none;
  opacity: 0;
  transition: opacity ease .4s;
}
#nav-kontakt {
  background-color: #014851;
  color: #fff;
  padding: 2px 25px;
  text-align: right;
}
#nav-logo {
  height: 72px;
  width: 100%;
  box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.27058823529411763);
  position: relative;
  z-index: 5;
  background-color: #0190A1;
}
#nav-logo img {
  height: 100%;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
}
#nav-lang {
  padding: 5px 25px;
  background-color: #014851;
}
#nav-lang a {
  display: inline-block;
  margin-right: 20px;
}
#nav-lang a:last-child {
  margin-right: 0;
}

#nav-lang-c {
  position: fixed;
  display: none;
  top: 0;
  right: 0;
  height: 100vh;
  background-color: #014851;
  z-index:200;
  box-shadow: -1px 1px 4px rgba(0,0,0,0.2);
  transition: all ease .5s;
  opacity: 0;
  transform: translateX(100%);
  -webkit-transform: translateX(100%);
}
#nav-lang-c.nav-lang-c-visible {
  opacity: 1;
  transform: translateX(0);
  -webkit-transform: translateX(0);
}
#nav-lang-c .container {
  min-width: 20vw;
  width: 100%;
  padding: 160px 50px 100px;
  transition: padding ease .4s;
}
#nav-lang-c ul {
  width: 100%;
}
#nav-lang-c ul li {
  width: 100%;
  margin-bottom: 25px;
}
#nav-lang-c ul li a {
  width: 100%;
  padding: 10px 25px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  color: inherit;
  background-color: #F0F0F1;
  transition: all ease .25s;
}
#nav-lang-c ul li a::after, #nav-lang ul li a::after {
  content: "";
  display: inline-block;
  flex-basis: 30px;
  width: 30px;
  height: 18px;
  background-repeat: no-repeat;
  background-size: contain;
}
#nav-lang ul li {
  display: inline-block;
  margin-right: 20px;
}
#nav-lang ul li a {
  font-size: 0;
  padding-top: 10px;
  background-repeat: no-repeat;
}
#nav-lang-c ul li a.en::after, #nav-lang ul li a.en::after {
  background-image: url(../../assets/img/lang-en.jpg)
}
#nav-lang-c ul li a.de::after, #nav-lang ul li a.de::after {
  background-image: url(../../assets/img/lang-de.jpg)
}
#nav-lang-c ul li a:hover {
  background-color: #0190A1;
  color: white;
}
#nav-lang-c ul li a img {
  height: auto;
}
#nav-lang #nav-lang-trigger {
  display:none;
}
#nav-lang #nav-lang-trigger img {
    width: 25px;
}
#menu {
  position: relative;
  width: 100%;
  transition: height ease .4s;
}
#menu ul {
  position: absolute;
  background-color: #F0F0F1;
  top: 0;
  width: 100%;
  z-index: 1;
  overflow: hidden;
  color: #01515B;
  text-transform: uppercase;
  /*font-weight: bold;*/
}

#menu ul li {
  padding: 10px 25px 10px 25px;
  border-bottom: 1px solid #2e747b;
}
#menu ul li a {
  display: inline-block;
  width: calc(100% - 50px);
}
#menu ul li .arrow {
  position: absolute;
  right: 20px;
  margin-top: 20px;
  display: inline-block;
  width: 40px;
  text-align: right;
  font-size: 0;
}
#menu ul li .arrow::before, #menu ul li ul .arrow:before {
  content: "";
  position: absolute;
  right: 0px;
  top: -12px;
  width: 15px;
  height: 15px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 9px;
  border-color: transparent transparent transparent #01515B;
}
#menu ul ul li:hover .arrow::before {
  border-color: transparent transparent transparent #01515B;
}
#menu ul li.nav-zurueck {
  position: relative;
  padding-left: 50px;
}
#menu ul li.nav-zurueck::before {
  content: "";
  position: absolute;
  left: 20px;
  top: 22px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 9px 6px 0;
  border-color: transparent #01515B transparent transparent;
}

#menu ul ul {
  top: 0;
  width: calc(100% - 20px);
  background-color: #dadada;
  left: 0;
  transform: translateX(100vw);
  -webkit-transform: translateX(100vw);
  transition: transform ease .4s;
  z-index: 2;
  text-transform: none;
}

#menu ul ul.nav-ul-active {
  transform: translateX(20px);
  -webkit-transform: translateX(20px);
}

#menu ul ul ul.nav-ul-active {
  transform: translateX(20px);
  -webkit-transform: translateX(20px);
}

#menu ul ul ul {
  z-index: 3;
  background-color: #ccc;
}

#menu ul ul ul ul {
  background-color: #003035;
  z-index: 4;
}
#menu ul ul li.nav-preview-container {
  display:none;
}




#sortiment {
  width: 100%;
  overflow: hidden;
}
#sortiment article {
  margin: 20px 0 100px;
  position: relative;
}
#sortiment article:last-child {
  margin-bottom: 0;
}
.sortiment-logo {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 60px;
}
.sortiment-img {
  position: relative;
}
.sortiment-img img {
  display: block;
}
.sortiment-img::before, .sortiment-img::after {
  content:"";
  height: 100%;
  opacity: .9;
  position: absolute;
  top: 0;
}
.sortiment-img::before {
  background-color: #0190A1;
  left: 0;
  width: 6px;
}
.sortiment-img::after {
  background: #0190A1;
  background: linear-gradient(135deg, #014851 0%, #0190A1 100%);
  left: 6px;
  width: 14px;
}



#vorteile {
  position: relative;
  padding-bottom: 20px;
  overflow: hidden;
}
#vorteile h1, #vorteile h2, #vorteile h3, #vorteile h4, #vorteile h5, #vorteile p, #vorteile ul, #vorteile .button {color:#fff; border-color:#fff;}
#vorteile h2::after {background-color: #fff;}
.vorteile-img {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: -1;
  width: 60vw;
  display: block;
}
#vorteile::before {
  content:"";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: block;
  background: #0190A1;
  background: linear-gradient(135deg, #014851 0%, #0190A1 100%);
  opacity: .9;
}
#vorteile .container {
  position: relative;
  z-index: 1;
}

#vorteile-list {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
}
#vorteile-list li {
  flex-basis: 100%;
  position: relative;
  padding: 20px 0 20px 60px;
  transition: all ease .5s;
  transform: translateY(50px);
  -webkit-transform: translateY(50px);
  opacity: 0;
}
#vorteile-list li:nth-of-type(1) {
  transition: all ease .4s .1s;
}
#vorteile-list li:nth-of-type(2) {
  transition: all ease .4s .2s;
}
#vorteile-list li:nth-of-type(3) {
  transition: all ease .4s .3s;
}
#vorteile-list li:nth-of-type(4) {
  transition: all ease .4s .4s;
}
#vorteile-list li:nth-of-type(5) {
  transition: all ease .4s .5s;
}
#vorteile.move-in-visible #vorteile-list li {
  transform: translateY(0);
  -webkit-transform: translateY(0);
  opacity: 1;
}
#vorteile-list li::before {
  content:"";
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  width: 30px;
  height: 30px;
  margin-top: -15px;
  background-image: url(../img/check.svg);
}
#vorteile .button {
  width: 100%;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}




#fragen {
}
.fragen-boxen-wrapper:first-of-type {
  margin-bottom: 80px;
}
.fragen-box h3 {color:#014851; font-family: "PT Serif", serif; font-size:23px;}
.fragen-box {
  background-color: #E5F4F5;
  padding: 15px 25px 25px;
  margin-bottom: 80px;
  position: relative;
  cursor: pointer;
}
.fragen-box:last-child {
  margin-bottom: 0;
}
.fragen-box::before {
  content:"";
  width: 7px;
  height: calc(100% - 70px);
  position: absolute;
  left: 0;
  top: 20px;
  background-color: #CD6B16;
  transition: all ease .4s;
}
.fragen-box:hover::before {
  height: calc(100% - 50px);
}
.fragen-box.fragen-box-active::before {
  height: 100%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
.fragen-box-c {
  height: 0;
  overflow: hidden;
  transition: all ease .4s;
  margin-bottom: 0;
}
.fragen-box-c p {
  margin: 0;
}
.fragen-box .button {
  position: absolute;
  bottom: -40px;
}
.fragen-box-active




#further {}
.further-box {
  position: relative;
  display: inline-block;
  margin-bottom: 20px;
}
.further-box:last-child {
  margin-bottom: 0;
}
.further-box p {
  position: absolute;
  top: 0;
  left: 0;
  padding: 15px 25px;
  z-index: 1;
  color: #fff;
  margin: 0;
}
.further-box img {
  display: block;
  width: 100%;
}
.further-box::before {
  content:"";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: block;
  background: #0190A1;
  background: linear-gradient(135deg, #014851 0%, #0190A1 100%);
  opacity: .8;
  transition: all .4s ease;
}


#preft {
  background-color: #F0F0F1;
  font-family: "PT Serif", serif;
  position: relative;
}
#preft a {
  text-decoration: underline;
}
#preft::before, #preft::after {
  content: "";
  width: 50%;
  height: calc(100% - 90px);
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  position: absolute;
  display: block;
  background: #0190A1;
  background: linear-gradient(180deg, #014851 0%, #0190A1 100%);
  opacity: .95;
  z-index: 10;
  transition: all ease-out 1s;
}
#preft.move-in-visible::before, #preft.move-in-visible::after {
  width: 15px;
}
#preft::before {
  left: 0;
}
#preft::after {
  right: 0;

}
#preft h2 {
  font-family: "PT Serif", serif;
  font-weight: bold;
  color: #014851;
  padding: 0;
  margin-top: 0;
}
#preft h2::after {
  display: none;
}
#preft p:last-child {
  margin-bottom: 0;
}


#ft {
  position: relative;
  color:#fff;
}
#ft .container {
  position: relative;
  z-index: 1;
}
#ft::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #0190A1;
  background: linear-gradient(135deg, #014851 0%, #0190A1 100%);
  opacity: 0.9;
}
#ft h2, #ft h3, #ft h4, #ft p {color:#fff;}
.ft-img {position:absolute; bottom:0; left:0; z-index:-1;}
.ft-part {margin-bottom:50px;}
.ft-part:last-child {margin-bottom:0;}
.ft-right p {margin-bottom:10px;}
#ft a, #subft a {text-decoration:underline;}


#subft {background:#0190A1; background:linear-gradient(135deg, #014851 0%, #0190A1 100%);}
#subft h2, #subft h3, #subft h4, #subft p, #subft a, #subft .button {color: #fff; margin: 5px 0;}
#subft .container {padding-top:20px; padding-bottom:20px;}
#subft div {display:inline-block;}
#subft .win-1 {margin-right:30px;}
#subft .win-1 a {text-decoration:none; margin-right:5px;}



/* Folgeseite */
.breadcrumb {display:none;}
.breadcrumb-item {display:inline-block; margin-right:10px;}
.breadcrumb-item, .breadcrumb-item a {color:#014851;}
.breadcrumb-item a {padding-bottom:2px; border-bottom:1px solid #014851;}
.breadcrumb-item::after {content:" >> "; margin-left:10px;}
.breadcrumb-item:last-of-type::after {display:none;}

.folgeseite .header-left, .folgeseite .header-right {height:auto; padding-top:0; background-color:transparent; position:static;}
.folgeseite .header-left::before {display:none;}
.folgeseite header #logo {transform: translateX(-50%); -webkit-transform: translateX(-50%); width:170px;}
.folgeseite header {background-color:#0190A1;}
.folgeseite .nav-btn {top:45px;}
.folgeseite #nav-c .nav-btn {top:46px;}

.social-list {display:flex; flex-direction:row; flex-wrap:wrap; gap:5px;}

#produkt .container {align-items:flex-start; display:flex; flex-wrap:wrap; flex-direction:row; justify-content:space-between; width:100%;}
#produkt .win-4, #produkt .win-2 {flex-basis:100%; flex-shrink:0; margin-bottom:50px;}
#produkt .produkt-content {order:1;}
#produkt-galerie-c {order: 2; max-width: 100%;}
#produkt .win-2 {order: 3;}
#produkt .button {width:100%; text-align:center; margin-bottom:20px;}
#produkt-galerie-small {position:relative; margin:0 35px;}
#produkt-galerie-small ul {white-space:nowrap; overflow:hidden;}
#produkt-galerie-small ul li {display:inline-block; width:calc( ( 100vw - 165px ) / 3); padding:0; transition:transform ease .4s; transform: translateX(0); -webkit-transform: translateX(0);}
#produkt-galerie-small ul li img {transition:border-color ease .4s; margin-left: 4px; width:calc(100% - 8px); border:5px solid transparent;}
#produkt-galerie-small ul li.small-galerie-active img {border-color:#0190A1;}
#produkt-galerie-small ul li:first-of-type {}
#produkt-galerie-small ul li img {display:block;}
#produkt-galerie-small-left, #produkt-galerie-small-right {position:absolute; display:block; width:25px; height:25px; background-repeat:no-repeat; background-size:17px; top:8px;}
#produkt-galerie-small-left {background-image:url(../img/arrow-left.svg); background-position:left center; left:-35px;}
#produkt-galerie-small-right {background-image:url(../img/arrow-right.svg); background-position:right center; right:-35px;}
#produkt-galerie-large img {width:100%;}

/*------------------- Anfrage -----------------------*/
 .an-wrapper {display:flex;background-color:#e3f3f5;padding:0px;flex-direction:column;flex-wrap:wrap;justify-content: space-between;}
 .an-wrapper a {color:#fff;}
 .an-wrapper h4 {font-family: "Lato"; font-size: 22px;color: #000; font-weight: 400; margin-top: 10px; margin-bottom:18px;}
 .an-wrapper p {font-family: "Lato"; font-size: 12px;font-weight: 400;color: #000;line-height: 12px; margin: 12px 0px 8px 0px;}
 .an-left {margin:5px 20px;padding-bottom:20px;}
 .an-left-headline {font-size:22px; color:#000; font-weight:400; margin-top:10px; margin-bottom:18px; font-family: "Lato";}
 .an-left-subline {font-family:"Lato"; font-size:20px; font-weight:400; color:#fff; border-bottom:solid 1px; border-bottom-color:#fff; padding-bottom:8px; margin:8px 0px 20px 0px;}
 .anfrage-button {background-color:#cb5e0c;padding: 15px;margin-top:20px; text-align:center;}
 .an-wrapper .anfrage-button {font-size:20px;}
 .content-1 .wrapper .anfrage-button a{font-family: "Lato"; color:#fff;font-size:20px;text-align:center;font-weight:400;display: flex;justify-content: center;}
 .an-right {background-color:#0291a1; text-align: center; position: relative;display: inline-block; padding:20px 20px 10px 20px;}
 .an-right h5{font-family: "Lato"; font-size: 20px;font-weight:400;color: #fff; border-bottom:solid 1px; border-bottom-color:#fff; padding-bottom:8px; margin: 8px 0px 20px 0px;}
 .an-right p {font-family: "Lato"; font-size: 14px;font-weight:300;color: #fff;line-height:22px;margin-top: 15px;}
 .an-right::before {content: "€"; border: solid 1px #0291a1; border-radius: 35px; width: 35px; height: 35px; background-color: #e3f3f5; padding: 2px 3px 2px 1px; color: #0291a1; box-sizing: border-box; font-weight: 600; font-size: 24px; position: absolute; z-index: 100; top: -17.5px; left: calc(50% - 17.5px);}
 .an-wrapper .an-price {color:#cb5e0c; font-size:30px; font-weight:800;margin: 5px 0px 10px 0px;}
 .fracht {font-family: "Lato"; font-size:14px;color:#0291a1;}
/*---------------------- Anfrage ----------------------*/

.image-headline {width:100%; position:absolute; bottom:40px; font-size:20px; color:#fff; padding:10px 0; text-align:center; background:rgba(1, 144, 161, 0.78);}

.win-2-headline {
  border-bottom: 2px solid #014851;
  padding-bottom: 10px;
  margin-top:0px;
  font-size:22px;
  font-weight:bold;
  margin-bottom:10px;
  color:#014851;
}
#produkt .win-2 a {
  color: #014851;
}


section#main-content {
  background-color: #fff;
  transition: height ease .4s;
}
#main-content h2::after {
  display: none;
}
#main-content h2 {margin-bottom:0; padding:10px 40px;}

#main-content #product_headline {
    padding:50px 40px 0 40px;
    ;
}

.main-content-content {background-color:#fff; padding: 10px 15px;}

.main-content-content li, #sortiment li {
    background-image: url(/assets/img/linkclass.png);
    background-repeat: no-repeat;
    background-position: left 10px;
    padding-left: 25px;
}

.main-content-content img {border:solid 3px #c2c2c2; padding:5px; border-style:dotted;}

#sub-content #galerie {
  float: none;
  padding: 0 35px;
  overflow: hidden;
}
.galerie-headline {text-align:center; font-weight:normal; margin:0 0 0 0; font-size:25px; color:#014851; margin-bottom:20px;}
#sub-content {
  position: relative;
  background-color:#F0F0F1;
}
#sub-content .container ul li {
    background-image: url(/assets/img/linkclass.png);
    background-repeat: no-repeat;
    background-position: left 10px;
    
}

#galerie ul li {background-image:none !important;}

#galerie-thumbs {
  overflow: hidden;
  max-width: 100%;
}
#sub-content #galerie-thumbs {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  width: 200vw;
}
#sub-content #galerie-thumbs li {
  width: calc( 100vw / 3  );
  max-width: none;
  flex-basis: calc( 100vw / 2 - 75px );
  height: auto;
  flex-shrink: 0;
  padding-right: 20px;
  transform: translateX(0);
  -webkit-transform: translateX(0);
  transition: transform ease .4s;
  border: none;
}
.galerie-thumb-c {
  height: 220px;
  position: relative;
}
#sub-content #galerie-thumbs li img {
  display: block;
  height: auto;
  cursor: pointer;
  position: relative;
  top: 40%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
}
#sub-content-galerie-left,
#sub-content-galerie-right {
  position: absolute;
  display: block;
  width: 25px;
  height: 25px;
  background-repeat: no-repeat;
  background-size: 17px;
  top: 50%;
  margin-top: -12px;
}
#sub-content-galerie-left {
  background-image: url(../img/arrow-left.svg);
  background-position: left center;
  left: 30px;
}
#sub-content-galerie-right {
  background-image: url(../img/arrow-right.svg);
  background-position: right center;
  right: 30px;
}

/*@media screen and (max-height: 490px) {
.galerie-thumb-c {height: 180px;}
}*/


#produktuebersicht {
}
.produkte-eintrag {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 80px 0;
}
.produkte-eintrag:last-child {
  margin-bottom: 20px;
}
.produkte-eintrag .win-2 {
  flex-basis: 50%;
}
.produkte-eintrag .win-8 {
  flex-basis: 100%;
}



input, textarea {padding: 10px 20px;font-size: 16px;color: #333;border: 1px solid #e0e0e0;margin-bottom: 20px;width: 700px;max-width: 100%;}
.errorbox, .errorbox ul, .errorbox ul li a, #content .errorbox ul li, #content .errorbox ul li a::before {color: #b71c1c;border: 0;padding: 0;content: "";}
.abschicken {cursor: pointer;}


/*--- Inhaltsverzeichnis ---*/
#sortiment .user-sitemap ul {background-image: none;}
#sortiment .user-sitemap ul ul {border-left: 3px solid #cd6b16;}
#sortiment .user-sitemap ul li {background-position: left 9px; background-image: none; padding-left: 20px; margin-left: 0;}
#sortiment .user-sitemap ul  {margin: 10px 0 50px; padding: 0px 0;}
#sortiment .user-sitemap > ul > li > a {font-weight:bold;}


@media screen and (max-height: 450px) {
  #menu ul li {
    padding: 8px 25px 8px 25px;
  }
  #menu ul li.nav-zurueck::before {
      top: 16px;
  }
  #nav-logo {
    height: 50px;
  }
  body.nav-fixed #nav-c {
    min-height: 74px;
  }
  .nav-btn {
    top: 13px;
  }
}

@media screen and (max-height: 520px) {
  .header-left-img {
    bottom: 50%;
    transform: translateY(50%);
    -webkit-transform: translateY(50%);
  }
  header #logo {
    width: 120px;
  }
  .header-title {
    font-size: 24px;
    margin-bottom: 10px;
  }
  .header-text-right {
    margin-bottom: 10px;
  }
}





@media screen and (min-width: 600px) {
    
    .sortiment-logo {position:absolute; bottom:0; left:0; width:100px;}
    .image-headline {display:none;}
    
    #sortiment article {
    margin: 20px 0 100px;
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }
  #sortiment h3 {
    margin-top: 0;
  }
  .win-4 {
    flex-basis: 30%;
    flex-shrink: 0;
    height: fit-content;
  }
  .win-8 {
    flex-basis: 70%;
    flex-shrink: 1;
    padding-left: 60px;
  }
  .sortiment-logo {
    top: auto;
    bottom: 0;
  }

  #video-info .win-8 {
    padding: calc(50vw * 0.5675) 0 0;
    width: auto;
    max-width: 50vw;
    max-height: calc(50vw * 0.5675);
    position: relative;
    margin-top: 50px;
  }
  #video-info .win-8 .iframe {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
  }


  #vorteile h2 {
    text-align: center;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    margin-bottom: 50px;
  }
  #vorteile h2::after {
    right: auto;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    width: calc(100% - 40px);
  }
  #vorteile-list {
    align-items: center;
  }
  #vorteile-list li {
    flex-basis: 100%;
    position: relative;
    padding: 25px 0 45px;
  }
  #vorteile p {
    text-align: center;
  }
  #vorteile .button {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    width: auto;
    padding: 20px 70px;
  }
  #vorteile-list li::before {
    left: 50%;
    top: 0;
    margin-left: -15px;
  }
  .produkte-eintrag .win-8 {
    padding-left: 0;
  }
  #ft .container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;

  }
  .ft-top, .ft-left {
    flex-basis: 100%;
  }
  .ft-right {
    flex-basis: 50%;
  }
  .ft-right:first-of-type {
    padding-right: 50px;
  }
  .ft-right:last-of-type {
  }
  #subft .win-3 {
    text-align: right;
  }

}


@media screen and (min-width: 800px) {
    #main-content h2 {margin-bottom:0; padding:10px 100px;}
    .an-wrapper {display:flex;flex-direction:row;flex-wrap:nowrap;justify-content: space-between;}
    .an-wrapper .an-price {margin: 25px 0px 12px 0px;}
    .an-right {padding:20px; width:340px;}
    .an-right::before {left:-17.5px;top: calc(50% - 17.5px);}
    .an-right p{margin-top:25px;}
    .anfrage-button {margin-top:30px;}
    .an-left {padding:20px 30px 20px 20px;  margin:0;}
    .an-bg {background-image:url(/assets/img/anfrage.svg); background-repeat:no-repeat; background-size:25%; background-position:center right 10px;}
    
    
    #main-content #product_headline {
        padding: 50px 100px 0 100px;
    }
    
  .header-title {
    margin-left: 100px;
    font-weight: 400;
    margin-bottom: 30px;
    font-size: 38px;
  }
  .header-text-right {
    display: none;
  }
  .header-left .button {
    margin-left: 100px;
  }
  .container, #menu ul li.nav-zurueck {
    padding-left: 100px;
    padding-right: 100px;
  }
  #nav-lang, #nav-kontakt, #menu ul li {
    padding-left: 50px;
    padding-right: 50px;
  }
  .nav-btn, #menu ul li .arrow {
    right: 50px;
  }
  #menu ul li.nav-zurueck::before {
    left: 50px;
  }
  h2::after {
    width: calc(100% + 100px);
  }

  #sub-content-galerie-left, #sub-content-galerie-right {
    width: 30px;
    height: 30px;
    background-size: 25px;
    margin-top: -15px;
  }
  #sub-content-galerie-left {
    left: 100px;
  }
  #sub-content-galerie-right {
    right: 100px;
  }
  #sub-content #galerie {
    padding: 0 75px;
  }

  #sub-content #galerie-thumbs li {
    flex-basis: calc( 100vw / 4 - 45px );
  }

  #produkt-galerie-small ul li {
    width: calc(( 100% - 15px ) / 3);
  }

  .produkte-eintrag .win-2, .produkte-eintrag .win-8 {
    flex-basis: calc(50% - (100% / 12 * 0.5) );
  }
  .produkte-eintrag .win-2 {

  }
  .produkte-eintrag .win-8 {

  }
  .produkte-eintrag .win-8 h3 {
    margin-top: 0;
  }
}

@media screen and (min-width: 960px) {
    .sortiment-logo {bottom:0; right:0;}
}

@media screen and (min-width: 1000px) {
    
    .an-bg {background-image:url(/assets/img/anfrage.svg); background-repeat:no-repeat; background-size:18%; background-position:center right 10px;}
    
  header {
    display: flex;
    flex-direction: row;
  }
  header h1, header h2 {
    margin-bottom: 10px;
  }
  .header-left, .header-right {
    flex-basis: 50%;
    flex-shrink: 1;
    flex-grow: 1;
    width: 50%;
    height: 100vh;
  }
  .header-right {
    border-left: 5px solid #014851;
  }
  .header-left .button, .header-title {
    margin-left: 0;
  }
  .header-right .container {
    padding-bottom: 0;
  }
  header #logo {
    left: 100px;
    transform: none;
    -webkit-transform: none;
  }
  .folgeseite header #logo {
    transform: none;
    -webkit-transform: none;
  }
  .folgeseite .header-right {
    border: none;
  }
  body.folgeseite.nav-sticked .nav-btn {
    top: 20px;
  }
  body.folgeseite.nav-sticked .nav-bar {
    background-color: white;
  }
  body.nav-sticked #menu {
    position: absolute;
  }
  .nav-bar {
    background-color: #014851;
  }
  #nav-c .nav-bar {
    background-color: #fff;
  }
  .scroll-down-button {
    display: block;
  }

  #vorteile-list {
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
  }
  #vorteile-list li {
    flex-basis: calc(20% - 10px);
    text-align: center;
  }

  .produkte-eintrag .win-2 {
    flex-basis: calc(40% - (100% / 12 * 0.5) );
  }
  .produkte-eintrag .win-8 {
    flex-basis: calc(60% - (100% / 12 * 0.5) );
  }
  .produkte-eintrag .win-8 h3 {
    margin-top: 0;
  }

  @media screen and (max-height: 700px) {
    .header-right-content {
      overflow-y: scroll;
      height: 100vh;
      position: absolute;
      padding-right: 100px;
      top: 0;
      padding: 50px 100px 65px 0;
    }
  }
}


@media screen and (min-width: 1150px) {
    
 .an-wrapper {display:flex;background-color:#e3f3f5;padding:0px;flex-direction:column;flex-wrap:wrap;justify-content: space-between;}
 .an-wrapper h4 {font-size: 22px;color: #000; font-weight: 400;margin-top: 10px; margin-bottom:18px;}
 .an-wrapper p {font-size: 12px;font-weight: 400;color: #000;line-height: 12px; margin: 12px 0px 8px 0px;}
 .anfrage-button {background-color:#cb5e0c;padding: 15px;margin-top:20px; text-align:center;}
 .info-box, .button, .anfrage-button a{font-size:20px;}
 .content-1 .wrapper .anfrage-button a{color:#fff;font-size:20px;text-align:center;font-weight:400;display: flex;justify-content: center;}
 .an-right {width:100%; background-color:#0291a1; text-align: center; position: relative;display: inline-block; padding:20px 20px 10px 20px;}
 .an-right h5{font-size: 20px;font-weight:400;color: #fff; border-bottom:solid 1px; border-bottom-color:#fff; padding-bottom:8px; margin: 8px 0px 20px 0px;}
 .an-right p {font-size: 14px;font-weight:300;color: #fff;line-height:22px;margin-top: 15px;}
 .an-right::before {content: "€"; border: solid 1px #0291a1; border-radius: 35px; width: 35px; height: 35px; background-color: #e3f3f5; padding: 2px 3px 2px 1px; color: #0291a1; box-sizing: border-box; font-weight: 600; font-size: 24px; position: absolute; z-index: 100; top: -17.5px; left: calc(50% - 17.5px);}
 .an-bg {background-image:none;}

.image-headline {display:block; font-size: 24px;}

h1 {font-size:30px;}
h2 {font-size:28px;}
h3 {font-size:25px;}
h4 {font-size:23px;}
p, ul, .info-box, .button, a {font-size:18px;}
  
  

  .button {
    transition: all ease .25s;
    box-shadow: 1px 1px 4px rgba(0,0,0,0);
  }
  .button:hover {
    background-color: #0190A1;
    color: #fff;
    box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
  }

  .win-4 {
    flex-basis: calc(100% / 12 * 4);
  }
  .win-8 {
    flex-basis: calc(100% / 12 * 8);
    padding-left: calc(100% / 12 * 1);
  }

  .folgeseite-crumbs {
    display: block;
    margin: 40px 0 40px;
    width: 100%;
    flex-basis: 100%;
  }
  .breadcrumb {
    display: block;
  }
  #produkt .win-4 {
    flex-basis: calc(50% - ( 100% / 12 * 0.5 ) );
    width: calc(50% - ( 100% / 12 * 0.5 ) );
  }
  #produkt-galerie-c {
    order: 1;
  }
  .produkt-content {
    order: 2;
    border: 1px solid #014851;
    padding: 20px 35px;
  }

  #sortiment article {
    margin-bottom: calc(100% / 12 * 1);
  }
  #sortiment h3, #preft h2 {
    position: relative;
    padding-bottom: 30px;
  }
  .sortiment-content p {
    padding-right: calc(100% / 12 * 1);
  }
  #sortiment h3::after, #preft h2::after {
    content:"";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 145px;
    height: 2px;
    background-color: #0190A1;
    display: block;
  }
  .sortiment-img img {
    width: 100%;
  }

  .fragen-boxen-wrapper {
    width: calc(50% - 4px);
    display: inline-flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
  }
  .fragen-boxen-wrapper:first-of-type .fragen-box {
    margin-right: 20px;
  }
  .fragen-boxen-wrapper:last-of-type .fragen-box {
    margin-left: 20px;
  }
  .fragen-box {
    flex-basis: 100%;
    height: fit-content;
  }
  .further-boxen-c {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    gap:30px
  }
  .further-box {
    flex-basis: calc(33.333% - 30px);
    height: 100%;
  }
  .ft-top {
    margin-bottom: 50px;
  }
  .ft-left {
    flex-basis: calc(100% / 12 * 5);
  }
  .ft-right {
    flex-basis: calc(100% / 12 * 6);
  }

  #sub-content #galerie-thumbs li {
    flex-basis: calc( 100vw / 5 - 45px );
  }

  .produkte-eintrag .win-2 {
    flex-basis: calc(33.333% - (100% / 12 * 0.5) );
  }
  .produkte-eintrag .win-8 {
    flex-basis: calc(66.666% - (100% / 12 * 0.5) );
  }

}

@media screen and (min-width: 1300px) {
    .sortiment-logo {left: auto;}
}

@media screen and (min-width: 1350px) {
    
    .main-content-c .main-content-content {padding:20px;}
    
    #main-content h2 {padding:10px 0px;}
    .level3 {display:none !important;}
    #main-content #product_headline {padding:0 0 50px 0; margin-top:0;}
    .sortiment-logo {width:125px; bottom:auto;}
    .header-right {border-bottom: 1px solid #014851;}
    .header-right .container {position:relative; padding-top:100px;}
    #nav-c {position:absolute; height:auto; overflow:visible; border-bottom:none;}
    .nav-btn, .nav-btn, #menu ul li .arrow, #menu ul li.nav-zurueck {display: none;}
  nav, body #menu, nav#menu {
    position: absolute;
    top: 30px;
    padding: 0 100px;
  }
  #nav-lang, #nav-kontakt {
    height: 25px;
  }
  #nav-kontakt {
    background-color: transparent;
    color: #014851;
    position: absolute;
    right: 115px;
    z-index: 55;
    margin-right: 50px;
  }
  #nav-kontakt a {
    font-size: 16px;
  }
  #nav-lang {
    position: absolute;
    background-color: #F0F0F1;
    width: 100%;
    top: 0;
    text-align: right;
    z-index: 52;
    padding-right: 100px;
    right: 0;
  }
  #nav-lang #nav-lang-trigger {
    cursor: pointer;
    display: block;
  }
  #nav-lang-mobil {
    display: none;
  }
  #nav-lang {
    padding-top: 2px;
  }
  #nav-lang-c {
    display: block;
  }
  body.nav-fixed #nav-lang a {
      position: relative;
      top: 0;
  }
  body.nav-fixed #nav-lang img {
    height: 13px;
  }
  body.nav-sticked #nav-logo {
    transform: translateY(-200px);
    -webkit-transform: translateY(-200px);
  }
  #nav-logo {
    position: absolute;
    width: auto;
    box-shadow: none;
    top: 30px;
    left: 100px;
    height: 90px;
    transition: all ease .4s;
    transform: translateY(0);
    -webkit-transform: translateY(0);
  }
  .folgeseite.nav-sticked header #logo {
    width: 500px;
  }
  #menu ul {
    width: auto;
    position: absolute;
    background-color: transparent;
    border-bottom: none;
    overflow: visible;
  }
  #menu ul li {
    width: auto;
    position: relative;
    display: inline-block;
    border-bottom: 0;
    padding: 12px 9px 10px 9px;
  }
  #menu ul li:first-of-type {
    /*padding-left: 0;*/
  }
  #menu ul li:last-of-type {
    padding-right: 0;
  }
  #menu ul li a {
    color: #014851;
    display: inline;
    padding-bottom: 3px;
    transition: all ease .4s;
  }
  #menu:hover ul li a {
    color: #999;
  }
  #menu:hover ul li:hover a {
    color: #0190A1;
  }
  #menu:hover ul li:hover ul li a {
  }
  #menu ul li ul {
    background-color: #F0F0F1;
    position: absolute;
    top: 100%;
    left: 10px;
    display: none;
    z-index: 20;
    width: auto;
    transform: none;
    -webkit-transform: none;
    box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
  }
  #menu ul li:hover ul {
    display: block;
  }
  #menu ul li ul li {
    padding: 0;
    white-space: nowrap;
    width: 100%;
    background-color: #F0F0F1;
    transition: all ease .4s;
  }
  #menu ul li ul li a:hover {
    background-color: #dadada;
    /*border-bottom: 1px solid #0190A1;*/
  }
  #menu:hover ul li:hover ul li a {
    color: #014851;
  }
  #menu ul li ul li a {
    display: block;
    padding: 10px 25px;
    width: 100%;
    transition: all ease .4s;
    font-weight: 400;
    font-size: 16px;
  }
  #menu ul ul ul, #menu ul li:hover ul ul, .folgeseite.nav-sticked #menu ul ul ul, .folgeseite.nav-fixed #menu ul ul li:hover ul {
    display: none;
    left: 100%;
    right: auto;
    top: 0;
  }
  #menu ul ul li:hover ul, .folgeseite.nav-sticked #menu ul ul li:hover ul, .folgeseite.nav-fixed #menu ul ul li:hover ul {
    display: block;
  }

  .startseite #menu .active {background-image: url(/assets/img/activemenu-bg-g.png); background-repeat: no-repeat; background-position: center 41px;}  
  .folgeseite #menu .active {background-image: url(/assets/img/activemenu-bg.png); background-repeat: no-repeat; background-position: center 41px;}
  .folgeseite #menu ul li .active a {background-color:#cae5e8;}


  body.nav-fixed #nav-c {
    background-color: #0190A1;
  }
  body.nav-fixed #menu {
    top: 35px;
  }
  body.nav-fixed #menu ul li {
    padding-bottom: 21px;
  }
  body.nav-fixed #menu ul {
    right: 100px;
  }
  body.nav-fixed #menu ul ul {
    right: auto;
  }
  body.nav-fixed #menu ul li ul li {
    padding-bottom: 0;
  }
  body.nav-fixed #menu ul li a {
    color: #fff;
    padding-bottom: 3px;
    /*border-bottom: 2px solid #fff;*/
    transition: all ease .4s;
  }
  body.nav-fixed #menu:hover ul li a {
    color: #87bdc3;
    /*border-bottom: 2px solid #87bdc3;*/
  }
  body.nav-fixed #menu:hover ul li:hover a {
    color: white;
    /*border-bottom: 2px solid white;*/
  }
  body.nav-fixed #menu:hover ul li:hover ul li a {
    color: #014851;
    border-bottom: 1px solid #014851;
  }

  .folgeseite header {
    flex-wrap: wrap;
    height: 100px;
  }
  .folgeseite header #logo {
    top: 25px;
    z-index:100;
  }
  .folgeseite.nav-sticked #menu {
    background: #0190A1;
    top: 25px;
    height: 120px;
  }
  .folgeseite.nav-sticked #menu ul {
    right: 100px;
    top: 40px;
  }
  .folgeseite #menu ul {
    right: 100px;
  }
  .folgeseite #menu ul ul, .folgeseite.nav-sticked #menu ul ul {
    right: auto;
  }
  .folgeseite.nav-sticked #nav-lang-c .container {
    padding-top: 200px;
  }
  .folgeseite #menu:hover ul li a {
    color: #87bdc3;
    border-color: #87bdc3;
  }
  .folgeseite #menu ul li a, .folgeseite #menu ul li a:hover, .folgeseite #menu:hover ul li a:hover, .folgeseite #menu:hover ul li:hover a {
    color: white;
    border-color: white;
  }
  .folgeseite #menu:hover ul li:hover ul li a {
    color: #014851;
    border-color: #0190A1;
  }
  .folgeseite .header-left, .folgeseite .header-right {
    flex-basis: 100%;
    flex-shrink: 0;
  }


  #produkt .win-4 {
    flex-basis: calc( 100% / 12 * 4 );
    width: calc( 100% / 12 * 4 );
  }
  #produkt .win-2 {
    flex-basis: calc( 100% / 12 * 2 );
    width: calc( 100% / 12 * 2 );
  }

  #main-content {
    padding: 70px 100px 60px;
  }
  #main-content .container {
    position: relative;
    padding: 0;
  }
  .main-content-content {
    padding-left: 0;
    padding-right: 0;
    padding-top: 40px;
  }
  .main-content-content {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
  }
  .main-content-content .win-6 {
    flex-basis: calc(50% - (100% /12 * 0.5) );
    flex-shrink: 1;
    flex-grow: 0;
  }

  .produkte-eintrag {
    padding-right: calc(100% / 12 * 2);
  }
  .produkte-eintrag .win-2 {
    flex-basis: calc(100% / 12 * 2.5);
  }
  .produkte-eintrag .win-2 img {
    width: 100%;
  }
  .produkte-eintrag .win-8 {
    flex-basis: calc((100% / 12 * 9));
  }


  .vorteile-img {
    width: 60vh;
  }
  .fragen-box {
    padding: 35px 65px 55px;
  }
  .fragen-box-c {
    padding-left: 50px;
  }
  .further-box {
    overflow: hidden;
  }
  .further-box img {
    position: relative;
    z-index: -1;
    transform: scale(1);
    transition: transform ease .7s;
  }
  .further-box:hover img {
    transform: scale(1.1);
  }
  .further-box:hover::before {opacity:.1;}

  #sub-content #galerie-thumbs li {
    flex-basis: calc( 100vw / 6 - 45px );
  }

  #preft.move-in-visible::before, #preft.move-in-visible::after {
    width: 100px;
  }
  #preft::before, #preft::after {
    height: calc(100% - 120px);
  }
  #preft .container {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
  }
  #preft .win-2, #preft .win-4 {
    margin-left: calc(100% / 12 * 2);
  }

  #ft .container, #subft .container {
    padding-left: calc(( 100% - 260px ) / 12 * 1 + 130px);
    padding-right: calc(( 100% - 260px ) / 12 * 1 + 130px);
  }
  #subft .container {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
  }
  #subft .win-1 {
    text-align: left;
    flex-basis: calc(100% / 12 * 1);
    flex-grow: 0;
    flex-shrink: 0;
  }
  #subft .win-3 {
    flex-basis: calc(100% / 12 * 4);
    flex-grow: 0;
    text-align: left;
  }
  #subft .ft-right.win-3 {
    flex-basis: calc(100% / 12 * 7);
    text-align: right;
  }

}




@media screen and (min-width: 1550px) {
  h1 {font-size:34px;}
  h2 {font-size:30px; margin-bottom:80px;}
  #sortiment h2, #video-info h2, #preft h2 {margin-bottom:40px;}
  h3 {font-size:25px;}
  h2::after {width:calc(100% + 130px);}
  .container, #menu ul li.nav-zurueck, nav, body.nav-sticked #menu, nav#menu, #main-content {
    padding-left: 130px;
    padding-right: 130px;
  }
  .container, #main-content {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  #main-content {
    padding-top: 70px;
  }
  body.nav-sticked nav#menu {
    top: 60px;
  }
  body.nav-fixed #nav-c {
    min-height: 120px;
  }
  #nav-logo {
    left: 130px;
    height: 90px;
  }
  body.nav-fixed #menu ul, .folgeseite.nav-sticked #menu ul {
    right: 130px;
  }
  .folgeseite.nav-sticked #menu ul ul {
    right: auto;
  }
  .folgeseite header #logo {
    left: 130px;
  }
  #menu ul li a {
    font-size: 17px;
  }
  #nav-lang, #nav-kontakt {
    padding-right: 130px;
  }
  body.nav-fixed #menu {
    top: 55px;
  }



  .header-title {
    margin-left: 130px;
  }
  .header-left .button {
    margin-left: 130px;
  }
  .header-left .container, .header-right .container {
    padding-top: 0;
  }
  .header-right .container {
    position: static;
  }
  .header-left, .header-right {
    padding-top: 50vh;
    position: relative;
  }
  .header-left-content, .header-right-content {
    position: relative;
    padding-top:80px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
  }
  .header-right-content img {
    width: 100%;
  }

  .info-box {
    padding: 25px 50px;
    margin-bottom: 40px;
  }

  #vorteile-list {
    margin: 50px 0;
  }
  #vorteile-list li {
    flex-basis: calc(20% - 60px);
    font-size: 20px;
  }

  #video-info .container {
    display: flex;
    width: 100%;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  #video-info .win-8 {
    padding: calc( 50% * 0.5675) 0 0;
    padding-left: calc(100% / 12 * 1);
    max-width: calc(100% / 12 * 11);
    margin-top: 20px;
  }
  #video-info .win-8 .iframe {
    width: calc(100% / 12 * 10);
    right: 0;
  }

  .fragen-boxen-wrapper:first-of-type .fragen-box {
    margin-right: calc(100% / 12 * 1);
  }
  .fragen-boxen-wrapper:last-of-type .fragen-box {
    margin-left: calc(100% / 12 * 1);
  }
  .fragen-box {
    margin-bottom: calc(100% / 12 * 2);
  }
  .fragen-box:last-of-type {
    margin-bottom: 0;
  }


  #sub-content-galerie-left {
    left: 130px;
  }
  #sub-content-galerie-right {
    right: 130px;
  }
  #sub-content #galerie {
    padding: 0 100px;
  }


  #preft::after, #preft::before {
    height: calc(100% - 90px);
  }
  #preft.move-in-visible::before, #preft.move-in-visible::after {
    width: 130px;
  }
}




@media screen and (min-width: 1800px) {
    
    .image-headline {font-size:24px; bottom:20px; padding:3px 0;}
    
  h2::after {
    width: calc(100% + 180px);
  }
  .container, #menu ul li.nav-zurueck, nav, body.nav-sticked #menu, nav#menu, #main-content {
    padding-left: 180px;
    padding-right: 180px;
  }
  #nav-lang, #nav-kontakt {
    padding-left: 50px;
    padding-right: 50px;
  }
  .header-title {
    margin-left: 180px;
  }
  .header-left .button {
    margin-left: 180px;
  }
  #nav-logo {
    left: 180px;
  }
  .folgeseite.nav-sticked #menu ul {
    right: 180px;
  }
  .folgeseite.nav-sticked #menu ul ul {
    right: auto;
  }
  .folgeseite header #logo {
    left: 180px;
  }
  body.nav-fixed #menu ul {
    right: 180px;
  }
  .info-box {
    padding: 30px 55px;
    font-size: 20px;
    margin-bottom: 40px;
  }
  #sub-content-galerie-left {
    left: 180px;
  }
  #sub-content-galerie-right {
    right: 180px;
  }
  #sub-content #galerie-thumbs li {
    flex-basis: calc( 100vw / 6 - 50px );
  }
}


@media screen and (min-width: 2100px) {
  h2::after {
    width: calc(100% + 250px);
  }
  .container, #menu ul li.nav-zurueck, nav, body.nav-sticked #menu, nav#menu, #main-content {
    padding-left: 250px;
    padding-right: 250px;
  }
  #nav-lang, #nav-kontakt {
    padding-left: 50px;
    padding-right: 50px;
  }
  .header-title {
    margin-left: 250px;
  }
  .header-left .button {
    margin-left: 250px;
  }
  #nav-logo {
    left: 250px;
  }
  .folgeseite.nav-sticked #menu ul {
    right: 250px;
  }
  .folgeseite.nav-sticked #menu ul ul {
    right: auto;
  }
  .folgeseite header #logo {
    left: 250px;
  }
  body.nav-fixed #menu ul {
    right: 250px;
  }
  #sub-content-galerie-left {
    left: 250px;
  }
  #sub-content-galerie-right {
    right: 250px;
  }
  #sub-content #galerie-thumbs li {
    flex-basis: calc( 100vw / 8 - 50px );
  }
}




/*-------------- Referenzen -----------------*/

/*vorgegebenes css für das jquery plugin start*/table.dataTable {
    border: solid 1px #0390a1;
    width: 100%;
    margin: 0 auto;
    clear: both;
    border-collapse: separate;
    border-spacing: 0
}
table.dataTable thead th,
table.dataTable tfoot th {
    font-weight: bold
}
table.dataTable thead th,
table.dataTable thead td {
    padding: 10px 18px;
    border-bottom: 1px solid #111
}
table.dataTable thead th:active,
table.dataTable thead td:active {
    outline: none
}
table.dataTable thead th:nth-child(3){border-right:1px solid #0390a1;}
table.dataTable tfoot th,
table.dataTable tfoot td {
    padding: 10px 18px 6px 18px;
    border-top: 1px solid #111
}
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
    cursor: pointer;
    *cursor: hand;
    background-repeat: no-repeat;
    background-position: center right
}
table.dataTable thead .sorting {background-image: url("/assets/img/referenzen/sort_both.png"); border-right: solid 1px #fff; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
table.dataTable thead .sorting_asc {background-image: url("/assets/img/referenzen/sort_asc.png"); border-right: solid 1px #fff; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
table.dataTable thead .sorting_desc {background-image: url("/assets/img/referenzen/sort_desc.png"); box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
table.dataTable thead .sorting_asc_disabled {background-image: url("/assets/img/referenzen/sort_asc_disabled.png"); box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
table.dataTable thead .sorting_desc_disabled {background-image: url("/assets/img/referenzen/sort_desc_disabled.png"); box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
table.dataTable tbody tr {
    background-color: #ffffff
}
table.dataTable tbody tr.selected {
    background-color: #B0BED9
}
table.dataTable tbody th,
table.dataTable tbody td {
    padding: 8px 10px
}
table.dataTable.row-border tbody th,
table.dataTable.row-border tbody td,
table.dataTable.display tbody th,
table.dataTable.display tbody td {
    border-top: 1px solid #ddd
}
table.dataTable.row-border tbody tr:first-child th,
table.dataTable.row-border tbody tr:first-child td,
table.dataTable.display tbody tr:first-child th,
table.dataTable.display tbody tr:first-child td {
    border-top: none
}
table.dataTable.cell-border tbody th,
table.dataTable.cell-border tbody td {
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd
}
table.dataTable.cell-border tbody tr th:first-child,
table.dataTable.cell-border tbody tr td:first-child {
    border-left: 1px solid #ddd
}
table.dataTable.cell-border tbody tr:first-child th,
table.dataTable.cell-border tbody tr:first-child td {
    border-top: none
}
table.dataTable.stripe tbody tr.odd,
table.dataTable.display tbody tr.odd {
    background-color: #f9f9f9
}
table.dataTable.stripe tbody tr.odd.selected,
table.dataTable.display tbody tr.odd.selected {
    background-color: #acbad4
}
table.dataTable.hover tbody tr:hover,
table.dataTable.display tbody tr:hover {
    background-color: #f6f6f6
}
table.dataTable.hover tbody tr:hover.selected,
table.dataTable.display tbody tr:hover.selected {
    background-color: #aab7d1
}
table.dataTable.order-column tbody tr>.sorting_1,
table.dataTable.order-column tbody tr>.sorting_2,
table.dataTable.order-column tbody tr>.sorting_3,
table.dataTable.display tbody tr>.sorting_1,
table.dataTable.display tbody tr>.sorting_2,
table.dataTable.display tbody tr>.sorting_3 {
    background-color: #fafafa
}
table.dataTable.order-column tbody tr.selected>.sorting_1,
table.dataTable.order-column tbody tr.selected>.sorting_2,
table.dataTable.order-column tbody tr.selected>.sorting_3,
table.dataTable.display tbody tr.selected>.sorting_1,
table.dataTable.display tbody tr.selected>.sorting_2,
table.dataTable.display tbody tr.selected>.sorting_3 {
    background-color: #acbad5
}
table.dataTable.display tbody tr.odd>.sorting_1,
table.dataTable.order-column.stripe tbody tr.odd>.sorting_1 {
    background-color: #f1f1f1
}
table.dataTable.display tbody tr.odd>.sorting_2,
table.dataTable.order-column.stripe tbody tr.odd>.sorting_2 {
    background-color: #f3f3f3
}
table.dataTable.display tbody tr.odd>.sorting_3,
table.dataTable.order-column.stripe tbody tr.odd>.sorting_3 {
    background-color: whitesmoke
}
table.dataTable.display tbody tr.odd.selected>.sorting_1,
table.dataTable.order-column.stripe tbody tr.odd.selected>.sorting_1 {
    background-color: #a6b4cd
}
table.dataTable.display tbody tr.odd.selected>.sorting_2,
table.dataTable.order-column.stripe tbody tr.odd.selected>.sorting_2 {
    background-color: #a8b5cf
}
table.dataTable.display tbody tr.odd.selected>.sorting_3,
table.dataTable.order-column.stripe tbody tr.odd.selected>.sorting_3 {
    background-color: #a9b7d1
}
table.dataTable.display tbody tr.even>.sorting_1,
table.dataTable.order-column.stripe tbody tr.even>.sorting_1 {
    background-color: #fafafa
}
table.dataTable.display tbody tr.even>.sorting_2,
table.dataTable.order-column.stripe tbody tr.even>.sorting_2 {
    background-color: #fcfcfc
}
table.dataTable.display tbody tr.even>.sorting_3,
table.dataTable.order-column.stripe tbody tr.even>.sorting_3 {
    background-color: #fefefe
}
table.dataTable.display tbody tr.even.selected>.sorting_1,
table.dataTable.order-column.stripe tbody tr.even.selected>.sorting_1 {
    background-color: #acbad5
}
table.dataTable.display tbody tr.even.selected>.sorting_2,
table.dataTable.order-column.stripe tbody tr.even.selected>.sorting_2 {
    background-color: #aebcd6
}
table.dataTable.display tbody tr.even.selected>.sorting_3,
table.dataTable.order-column.stripe tbody tr.even.selected>.sorting_3 {
    background-color: #afbdd8
}
table.dataTable.display tbody tr:hover>.sorting_1,
table.dataTable.order-column.hover tbody tr:hover>.sorting_1 {
    background-color: #eaeaea
}
table.dataTable.display tbody tr:hover>.sorting_2,
table.dataTable.order-column.hover tbody tr:hover>.sorting_2 {
    background-color: #ececec
}
table.dataTable.display tbody tr:hover>.sorting_3,
table.dataTable.order-column.hover tbody tr:hover>.sorting_3 {
    background-color: #efefef
}
table.dataTable.display tbody tr:hover.selected>.sorting_1,
table.dataTable.order-column.hover tbody tr:hover.selected>.sorting_1 {
    background-color: #a2aec7
}
table.dataTable.display tbody tr:hover.selected>.sorting_2,
table.dataTable.order-column.hover tbody tr:hover.selected>.sorting_2 {
    background-color: #a3b0c9
}
table.dataTable.display tbody tr:hover.selected>.sorting_3,
table.dataTable.order-column.hover tbody tr:hover.selected>.sorting_3 {
    background-color: #a5b2cb
}
table.dataTable.no-footer {
    border-bottom: 1px solid #111
}
table.dataTable.nowrap th,
table.dataTable.nowrap td {
    white-space: nowrap
}
table.dataTable.compact thead th,
table.dataTable.compact thead td {
    padding: 4px 17px 4px 4px
}
table.dataTable.compact tfoot th,
table.dataTable.compact tfoot td {
    padding: 4px
}
table.dataTable.compact tbody th,
table.dataTable.compact tbody td {
    padding: 4px
}
table.dataTable th.dt-left,
table.dataTable td.dt-left {
    text-align: left
}
table.dataTable th.dt-center,
table.dataTable td.dt-center,
table.dataTable td.dataTables_empty {
    text-align: center
}
table.dataTable th.dt-right,
table.dataTable td.dt-right {
    text-align: right
}
table.dataTable th.dt-justify,
table.dataTable td.dt-justify {
    text-align: justify
}
table.dataTable th.dt-nowrap,
table.dataTable td.dt-nowrap {
    white-space: nowrap
}
table.dataTable thead th.dt-head-left,
table.dataTable thead td.dt-head-left,
table.dataTable tfoot th.dt-head-left,
table.dataTable tfoot td.dt-head-left {
    text-align: left
}
table.dataTable thead th.dt-head-center,
table.dataTable thead td.dt-head-center,
table.dataTable tfoot th.dt-head-center,
table.dataTable tfoot td.dt-head-center {
    text-align: center
}
table.dataTable thead th.dt-head-right,
table.dataTable thead td.dt-head-right,
table.dataTable tfoot th.dt-head-right,
table.dataTable tfoot td.dt-head-right {
    text-align: right
}
table.dataTable thead th.dt-head-justify,
table.dataTable thead td.dt-head-justify,
table.dataTable tfoot th.dt-head-justify,
table.dataTable tfoot td.dt-head-justify {
    text-align: justify
}
table.dataTable thead th.dt-head-nowrap,
table.dataTable thead td.dt-head-nowrap,
table.dataTable tfoot th.dt-head-nowrap,
table.dataTable tfoot td.dt-head-nowrap {
    white-space: nowrap
}
table.dataTable tbody th.dt-body-left,
table.dataTable tbody td.dt-body-left {
    text-align: left
}
table.dataTable tbody th.dt-body-center,
table.dataTable tbody td.dt-body-center {
    text-align: center
}
table.dataTable tbody th.dt-body-right,
table.dataTable tbody td.dt-body-right {
    text-align: right
}
table.dataTable tbody th.dt-body-justify,
table.dataTable tbody td.dt-body-justify {
    text-align: justify
}
table.dataTable tbody th.dt-body-nowrap,
table.dataTable tbody td.dt-body-nowrap {
    white-space: nowrap
}
table.dataTable,
table.dataTable th,
table.dataTable td {
    box-sizing: content-box
}
.dataTables_wrapper {
    position: relative;
    clear: both;
    *zoom: 1;
    zoom: 1
}
.dataTables_wrapper .dataTables_length {
    float: left
}
.dataTables_wrapper .dataTables_filter {
    float: right;
    text-align: right
}
.dataTables_wrapper .dataTables_filter input {
    margin-left: 0.5em;
    font-size:18px;
}
.dataTables_wrapper .dataTables_info {
    clear: both;
    float: left;
    padding-top: 0.755em
}
.dataTables_wrapper .dataTables_paginate {
    float: right;
    text-align: right;
    padding-top: 0.25em
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
    box-sizing: border-box;
    display: inline-block;
    min-width: 1.5em;
    padding: 0.5em 1em;
    margin-left: 2px;
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    *cursor: hand;
    color: #333 !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    color: #0390A1 !important;
    text-decoration:underline !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
    cursor: default;
    color: #666 !important;
    border: 1px solid transparent;
    background: transparent;
    box-shadow: none
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    color:#0390A1 !important;
}
.dataTables_wrapper .dataTables_paginate .ellipsis {
    padding: 0 1em
}
.dataTables_wrapper .dataTables_processing {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 40px;
    margin-left: -50%;
    margin-top: -25px;
    padding-top: 20px;
    text-align: center;
    font-size: 1.2em;
    background-color: white;
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(25%, rgba(255, 255, 255, 0.9)), color-stop(75%, rgba(255, 255, 255, 0.9)), color-stop(100%, rgba(255, 255, 255, 0)));
    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
    background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
    background: -ms-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
    background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%)
}
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_processing,
.dataTables_wrapper .dataTables_paginate {
    color: #333
}
.dataTables_wrapper .dataTables_scroll {
    clear: both
}
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody {
    *margin-top: -1px;
    -webkit-overflow-scrolling: touch
}
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody>table>thead>tr>th,
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody>table>thead>tr>td,
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody>table>tbody>tr>th,
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody>table>tbody>tr>td {
    vertical-align: middle
}
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody>table>thead>tr>th>div.dataTables_sizing,
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody>table>thead>tr>td>div.dataTables_sizing,
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody>table>tbody>tr>th>div.dataTables_sizing,
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody>table>tbody>tr>td>div.dataTables_sizing {
    height: 0;
    overflow: hidden;
    margin: 0 !important;
    padding: 0 !important
}
.dataTables_wrapper.no-footer .dataTables_scrollBody {
    border-bottom: 1px solid #111
}
.dataTables_wrapper.no-footer div.dataTables_scrollHead table.dataTable,
.dataTables_wrapper.no-footer div.dataTables_scrollBody>table {
    border-bottom: none
}
.dataTables_wrapper:after {
    visibility: hidden;
    display: block;
    content: "";
    clear: both;
    height: 0
}
@media screen and (max-width: 767px) {
    .liveticker {font-size:16px !important;}
    .dataTables_wrapper .dataTables_info,
    .dataTables_wrapper .dataTables_paginate {
        float: none;
        text-align: center
    }
    .dataTables_wrapper .dataTables_paginate {
        margin-top: 0.5em
    }
}
@media screen and (max-width: 640px) {
    .dataTables_wrapper .dataTables_length,
    .dataTables_wrapper .dataTables_filter {
        float: none;
        text-align: center
    }
    .dataTables_wrapper .dataTables_filter {
        margin-top: 0.5em
    }
}/*vorgegebenes css für das jquery plugin ende*/

.reflist {margin:50px 0px; width:100%;}
#table_id {margin:20px 0; float:left;}
#table_id_info {display:none;}
#table_id_filter {padding-left:30px; background-image:url(/assets/img/referenzen/search.png); background-repeat:no-repeat; background-position:left center;}
.dataTables_length {padding-left:40px; background-image:url(/assets/img/referenzen/pagelist.png); background-repeat:no-repeat; background-position:left center;}
.sorting_asc, .sorting {background-color:#0390a1; color:#fff;}
.paginate_button {height:40px; width:40px; padding:5px; margin-bottom: -15px;}
.previous {background-image:url(/assets/img/referenzen/prev.png); background-repeat:no-repeat; background-position:left center;
    background-color:transparent;}
.next {background-image:url(/assets/img/referenzen/next.png); background-repeat:no-repeat; background-position:right center;
    background-color:transparent;}
#table_id_wrapper select{font-size: 18px;padding: 5px 10px;}

@media screen and (max-width: 640px) {
#table_id_wrapper select, #table_id_filter label input{width:100%;margin: 0;padding:3px 1%;font-size: 18px;border:1px solid #555;}
.dataTables_length, #table_id_filter {padding-left:40px;}
}

@media screen and (max-width: 415px) {
 
/*aussehen verschönern*/ 
.dataTables_wrapper .dataTables_paginate .paginate_button, .dataTables_wrapper .dataTables_paginate .ellipsis{width:10%;margin:0;padding:0;}
.paginate_button{margin-bottom:-15px !important;}
#table_id_wrapper select, #table_id_filter label input{width:100%;margin: 0;padding:5px 1%;font-size: 18px;}
    
/* tabellenstruktur auflösen */
td, tr{padding:0;margin:0;}
tbody, td, tr, table{width:98%;float:left;}
table.dataTable tbody tr, table.dataTable tbody td, .sorting_1 {padding: 5px 2%;}
table.dataTable tbody tr{border-bottom:2px solid #333;}
table.dataTable.display tbody td{border-bottom:none;}

/* text before */
.reflist td::before{font-weight: 600;}
.reflist td:nth-child(1)::before{content: 'Name: '}
.reflist td:nth-child(2)::before{content: 'PLZ: '}
.reflist td:nth-child(3)::before{content: 'Stadt: '}

/* thead */
table.dataTable thead th {width: 33.3333% !important;margin: 0;display: -webkit-inline-box;padding: 10px 2%;}
#table_id thead tr{width:100%;}
thead{margin:10px 0;}	

#table_id_wrapper{margin:20px 0;}
	
	}
/* [Uebernahme 21.07.2026] Neues quadratisches EQUITECH-Logo ragt tiefer in den
   Content als das alte flache Logo: Unterseiten-Inhalt bekommt mehr Abstand zum Header. */
.folgeseite main {
  padding-top: 70px;
}