/*
Theme Name: tenics 2026
Author: tenics
Version: 1.0
License: Keine Weitergabe oder Nutzung von Dritten ohne vorherige Absprache erlaubt.
License URI: license.txt
*/

@charset "UTF-8";


@font-face {
  font-family: 'Abel';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/abel-v18-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/abel-v18-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/abel-v18-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/abel-v18-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/abel-v18-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/abel-v18-latin-regular.svg#Abel') format('svg'); /* Legacy iOS */
}
/* space-grotesk-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/space-grotesk-v22-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* space-grotesk-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/space-grotesk-v22-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* space-grotesk-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/space-grotesk-v22-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* space-grotesk-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/space-grotesk-v22-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* space-grotesk-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/space-grotesk-v22-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}




:root {
  --color: #ffffff;
  --padding-x: 100px;
  --padding-y: 150px;
}

html, body {
  margin:0 !important;
  padding: 0;
  line-height: 1.6;
}

body {
  font-family: "Space Grotesk", sans-serif;
  font-size: 15px;
  color: #1C1C1B;
}

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

img {
  max-width: 100%;
}

ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.content-field ul li {
  position: relative;
  padding-left: calc(16px + 0.6vw);
  margin-bottom: 8px;
}
.content-field ul li::before {
  content:"+ ";
  font-weight: 700;
  position: absolute;
  left:0;
}

a {
  text-decoration: none;
  color: inherit;
}

.h0 {
  font-family: "Abel", sans-serif;
  font-size: 20px;
  text-transform: uppercase;
  line-height: 1.1;
  color: #F7A600;
  margin-top:0;
  margin-bottom: 25px;
  font-weight: 400;
  text-shadow: 2px 2px 5px #00000055;
}

h1, .h1 {
  font-family: "Space Grotesk", sans-serif;
  font-weight: 400;
  font-size: 40px;
  line-height: 1.3;
  color: #fff;
  margin:0;
}

h2, .h2 {
  font-family: "Space Grotesk", sans-serif;
  font-weight: 400;
  font-size: 30px;
  line-height: 1.3;
}

h3, .h3 {
  font-family: "Space Grotesk", sans-serif;
  font-weight: 500;
  font-size: 22px;
  line-height: 1.3;
}

p {
  margin: 15px 0 25px;
}

.tuerkis {
  color: #008974;
}

footer p a, section p a {
  color: #F7A600;
  text-decoration: underline;
  text-decoration-thickness: 0.1em;
  text-underline-offset: 0.13em;
}

.button {
  display: inline-block;
  background-color: #F7A600;
  color: #2E2E2C;
  border-radius: 8px;
  padding: 10px 14px;
  text-decoration: none;
}
.button a {
  color: #2E2E2C;
  text-decoration: none;
}
.button.button-grey {
  background-color: #bdbdbd;
}
.button-arrow {
  display: inline-block;
  position: relative;
  font-size: 18px;
  font-weight: 500;
  color: #F7A600;
  margin: 5px 0;
  text-decoration: none;
  border:none !important;
}
.button-arrow::after {
  content:"";
  display: inline-block;
  width:13px;
  height:13px;
  position: relative;
  right: 0;
  margin-left: 10px;
  background-image: url("img/button-arrow-top-right.svg");
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

.open-calender {
  cursor:pointer;
}


header, nav, main, section, footer {
  width: 100%;
}
footer, section {
  position: relative;
  padding-top: 30px;
  padding-bottom: 30px;
}
.container, .container-wide {
  padding: 0 25px;
}


#banner {
  position: relative;
  width:100%;
  height: 100vh;
}
#banner h1, #banner .h1 {
  text-shadow: 2px 2px 5px #00000055;
}
.standardseite #banner {
  height: 60vh;
}
.banner-img {
  display: block;
  position: relative;
  width:100%;
  height:100%;
  object-fit: cover;
  object-position: center;
  z-index: 1;
}
#banner::before {
  content:"";
  position: absolute;
  z-index: 2;
  width:100%;
  height:100%;
  left:0;
  top:0;
  background: #004D41;
  background: linear-gradient(180deg, rgba(0, 77, 65, 1) 0%, rgba(0, 39, 33, 0.95) 100%);
  opacity: 0.8;
}
#banner::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 20px;
  z-index: 2;
  left:50%;
  width: 15px;
  height: 15px;
  background-image: url("img/icon-arrow-fold.svg");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  transform: translateX(-50%) rotate(180deg);
}
#banner-nav {
  display: none;
}
.arrow-the-right {
  position: relative;
  display: inline-block;
  width:55px;
  height:13px;
  margin: 0 5px;
  background-image: url("img/arrow-to-the-right.svg");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}


#nav-layer {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 18;
  cursor: pointer;
  background-color: #12211f99;
  display: none;
  opacity: 0;
  transition: opacity ease .5s;
}
#nav-bar {
  position: fixed;
  left: 0;
  top: 0;
  width:100%;
  z-index: 100;
  background-color: #006262;
  padding-top: 18px;
  padding-bottom: 18px;

  display: flex;
  justify-content: space-between;
  align-items: center;
}


.nav-logo, .nav-c-logo {
  display: block;
  width:100px;
  height:30px;
  background-image: url("img/tenics_logo_white.svg");
  background-size: contain;
  background-repeat: no-repeat;
  position: relative;
  top: -5px;
}
.nav-c-logo {
  display: none;
}

.nav-bar-right-c {
  display: flex;
}

.nav-bar-lang-switch-ling {
  display: block;
  margin-right: 20px;
  color: #fff;
}

#nav-btn-c {
  cursor:pointer;
}
.nav-btn-bar {
  width: 36px;
  height:3px;
  display: block;
  border-radius: 5px;
  background-color: #fff;
  margin-bottom: 7px;
  transform: translateY(0) rotate(0deg);
  transition: all ease .4s;
  opacity: 1;
}
.nav-btn-bar:last-of-type {
  margin-bottom: 0;
}

.nav-visible .nav-btn-bar:nth-of-type(1) {
  transform: translateY(10px) rotate(45deg);
}
.nav-visible .nav-btn-bar:nth-of-type(2) {
  opacity: 0;
}
.nav-visible .nav-btn-bar:nth-of-type(3) {
  transform: translateY(-10px) rotate(-45deg);
}

#nav-c {
  background-color: #002721fa;
  color: #fff;
  position: fixed;
  top: 66px;
  width: 100%;
  z-index: 19;
  height: 0;
  overflow: hidden;
  transition: all ease .4s;
}
.nav-inner-c {
  padding-top: 20px;
  padding-bottom: 20px;
}
menu {
  padding: 0;
  margin: 0;
}
.top-nav {
  padding: 10px 0 30px;
}
.top-nav li {
  margin-left: 30px;
  position: relative;
}
.nav-kontakt-c, .sub-nav {
  padding-bottom: 10px;
}
.nav-kontakt a {
  border-bottom: 1px solid #fff;
}
.top-nav {
  counter-reset: top-nav-number;
}
.top-nav li a {
  display: inline-flex;
  justify-content: flex-start;
  align-items: center;
  position: relative;
}
.top-nav li {
  font-weight: bold;
  font-size: 20px;
  position: relative;
}
.top-nav > ul > li {
  counter-increment: top-nav-number;
}
.top-nav li::before {
  content: "0" counter(top-nav-number);
  position: absolute;
  left: -30px;
  top:16px;
  transform: translateY(-50%);
  font-family: "Abel", monospace;
  font-size: 14px;
  font-weight: normal;
  display: inline-block;
  margin-right: 10px;
}
.nav-kontakt span {
  color: #F7A600;
  display: inline-block;
  width: calc(40px + 3vw);
}

.top-nav li ul {
  font-size: 12px;
  padding: 5px 0;
}
.top-nav li ul li {
  margin:0;
}
.top-nav li ul li a {
  font-weight: 400;
  font-size: 16px;
  padding: 3px 0 3px 20px;
  position: relative;
}
.top-nav li ul li a:before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  width: 15px;
  height: 15px;
  background-image: url("img/icon-arrow-fold.svg");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  left: 0;
  transform: translateY(-50%) rotate(90deg);
}
.top-nav li ul li::before {
  display: none;
}

.sub-nav ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.sub-nav li {
  margin-right: 20px;
}
.nav-sub-c {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}
.socialmedia-btn {
display: inline-block;
width:45px;
height:45px;
border-radius: 60px;
border:1px solid #707070;
background-position: center;
background-repeat: no-repeat;
background-size: 30%;
}
.linkedin-btn {
  background-image: url("img/icon-linkedin-logo.svg");
}
.xing-btn {
  background-image: url("img/icon-xing-logo.svg");
}

ul.sub-nav-socialmedia {
  display: flex;
  margin-top: 5px;
}
ul.sub-nav-socialmedia li {
  margin-right: 10px;
}
.num {
  position: absolute;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
  width: 23px;
  height: 23px;
  font-size: 14px;
  transform: translateY(-50%);
  right: -25px;
  top: 12px;
  width: 21px;
  height: 21px;
  background-color: #F7A600;
  color: #191919;
}
.sidenav-c {
  display: none;
}



#banner-content {
  position: absolute;
  width: 100%;
  top:calc(50% + 66px);
  transform: translateY(-50%);
  z-index: 2;
  text-align: center;
}





.section-dark {
  background-color: #191919;
  color: #fff;
}

.section-gradient::before {
  content:"";
  position: absolute;
  z-index: 2;
  width:100%;
  height:100%;
  left:0;
  top:0;
  background: #004D41;
  background: linear-gradient(180deg, rgba(0, 39, 33, 0.898) 0%, rgba(0, 70, 60, 0.956) 100%);
  opacity: 1;  
}

.section-background {
  position: absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  object-fit: cover;
  object-position: center;
}

.section-dark .container {
  position: relative;
  z-index: 5;
}

.quote-container {
  margin-top: 70px;
  margin-bottom: -130px;
  position: relative;
  background-color: #fff;
  color: #2E2E2C;
  box-shadow: 0 4px 4px #00000055;
  border-radius: 20px;
  padding: 65px 30px 15px;
}
.quote-container::before {
  content: "\"";
  font-size: 283px;
  color: #008974;
  opacity: 0.75;
  text-shadow: 0 4px 4px #00000055;
  position: absolute;
  top: -20px;
  left: 50%;
  transform: translateX(-50%);
  display: block;
  line-height: 211px;
  height: 75px;  
  margin-left: -5px;
}


#expertise .section-background {
  object-position: 25%;
}

#unsere-leistungen {
  background-color: #2E2E2C;
  color:#fff;
  padding-top: 150px;
}
#unsere-leistungen h2 {
  text-align: center;
}
.unsere-leistungen-outer-c {
  margin-top:50px;
}
.leistung-item-c {
  background-color: #008974;
  background: linear-gradient(0deg, rgba(0, 63, 63, 1) 0%, rgba(0, 137, 116, 1) 100%);
  border-radius: 20px;
  overflow: hidden;
  color: #fff;
  margin: 30px 0;
}
.leistung-item-c img {
  display: block;
  width: 100%;
  height: 75%;
  object-fit: cover;
  max-height: 350px;
}
.leistung-item-inner-c {
  padding: 25px;
}
.leistung-item-inner-c p, .leistung-item-inner-c h3 {
  width:100%;
}
.leistung-item-inner-c h3 {
  margin-top:0;
}
.leistung-item-inner-c p:last-child {
  margin-bottom:0;
}


#unsere-kunden {
  padding-bottom: 0;
}
.kunden-intro-mobil h2 {
  margin-top:0;
}
.kunden-intro-desktop, .desktop-only {
  display: none !important; 
}
.kunden-mosaic-outer-c {
  /*
  scrollbar-width: thin;
  scrollbar-color: #f7a600 #00000f;
  max-width: 100vw;
  */
  -ms-overflow-style: none;  /* Internet Explorer 10+ */
  scrollbar-width: none;  /* Firefox, Safari 18.2+, Chromium 121+ */
  overflow-x: scroll;
  padding: 30px 0 40px;
}
.kunden-mosaic-outer-c::-webkit-scrollbar { 
    display: none;  /* Older Safari and Chromium */
}
.kunden-mosaic-inner-c {
  display: flex;
}
.kunden-mosaic-row {
  flex-basis: calc(100vw - 60px);
  max-width: 400px;
  flex-shrink: 0;
  background-color: #1C1C1B;
  padding: 25px;
  border-radius: 25px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 200px;
  margin-right: 15px;
  position: relative;
  color: #fff;
}
.kunden-mosaic-head h3 {
  font-weight: 500;
  font-size: 18px;
  margin-top: 30px;
  margin-bottom:30px;
}
.kunden-mosaic-icon {
  width:50px;
  height:50px;
  object-fit: contain;
  object-position: center;
  position: relative;
  left:50%;
  transform: translateX(-50%);
}
.kunden-mosaic-content {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
}
.kunden-mosaic-content p:first-child {
  margin-top:0;
}

.kunden-mosaic-bottom-nav-c {
  display: flex;
  justify-content: center;
  margin-top: 10px;
}
.kunden-mosaic-bottom-nav-dot {
  width: 10px;
  height:10px;
  border-radius: 10px;
  margin: 0 5px;
  background-color: #d9d9d9;
  transition: background-color ease .4s;
}
.kunden-mosaic-bottom-nav-dot.kunden-mosaic-bottom-nav-dot-active {
  background-color: #F7A600;
}


#logos-static {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;  
}
.logo-row {
  flex-basis: calc(50% - 20px);
  margin: 40px 0 0;
  display: flex;
  justify-content: center;
  align-content: center;  
}
.logo-row img {
  max-width: 28vw;
  max-height: 15vw;
  object-fit: contain;
}


#about-tenics {
  padding-bottom: 0;
  text-align: center;
}
.section-background-bottom {
  position: absolute;
  display: block;
  bottom:0;
  left:0;
  width:100vw;
  height: 60vw;
  object-fit: cover;
  object-position: center;
  z-index: 1;  
}
.section-background-bottom-c {
  position: relative;
  display: block;
  width:100vw;
  height: 60vw;
  margin-top:-12vw;
}
.section-background-bottom-c::before {
  content:"";
  display: block;
  background: #ffffff;
  background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
  position: absolute;
  z-index: 2;
  top:0;
  left:0;
  width:100%;
  height:15vw;
}
#about-tenics .container {
  position: relative;
  z-index: 3;
}




#bis-gleich {
  background-color: #2E2E2C;
  color:#fff;
  text-align: center;
}
ol {
  list-style: none;
  counter-reset: item;
  margin:0;
  padding:0;
}
ol > li {
  counter-increment: item;
  padding-top: 60px;
  position: relative;
  margin: 50px 0;
}
ol > li:before {
  content: counter(item);
  display:flex;
  justify-content: center;
  align-items: center;
  display: inline-block;
  color:#F7A600;
  border: 1px solid #fff;
  border-radius: 100%;
  width: 40px;
  height: 40px;
  font-size: 25px;
  position: absolute;
  left:50%;
  top:0;
  transform: translateX(-50%);
}
ol > li .button-arrow {
  margin:0;
}
ol > li:last-child {
  margin-bottom: 0;
}



#faq {
  background-color: #EFEFEF;
}
.faq-inner-c {
  height: auto;
  overflow:hidden;
  transition: height ease .4s;
}
.faq-item {
  padding: 30px;
  background-color: #fff;
  color: #2E2E2C;
  border: 1px solid #2E2E2C;
  border-radius: 8px;
  margin-bottom: 15px;
  transition: background-color ease .4s, color ease .4s;
}
.faq-item.faq-item-active {
  background-color: #2E2E2C;
  color: #fff;
}
.faq-item:last-of-type {
  margin-bottom: 0;
}
.faq-inner-c {
  position: relative;
}
.faq-fold-button {
  position: absolute;
  right:-10px;
  top:50%;
  transform: translateY(-50%) rotate(180deg);
  width:15px;
  height:15px;
  padding: 20px;
  background-image: url("img/icon-arrow-fold.svg");
  background-size: 20px;
  background-position: center;
  background-repeat: no-repeat;
  transition: transform ease .4s;
}
.faq-item.faq-item-active .faq-fold-button {
  transform: translateY(-50%) rotate(0);
}
.faq-question {
  position: relative;
  font-weight: 500;
  padding-right: 40px;
  min-height: 42px;
  display: flex;
  align-items: center;  
}
.faq-question p:first-child, .faq-answer p:first-child {
  margin-top:0;
}
.faq-question p:last-child, .faq-question p:first-child, .faq-answer p:last-child {
  margin-bottom:0;
}
.faq-answer {
  padding-top: 20px;
}




.kontakt-item {
  display: block;
  margin-bottom: 20px;
  background-color: #2E2E2C;
  border-radius: 20px;
  color:#fff;
  padding: 50px 30px;
  box-shadow: 0 4px 4px #0005;
  text-align: center;
}
.kontakt-item span:last-of-type {  
  margin-bottom: 0;
}
.icon {
  display: block;
  width: 60px;
  height: 50px;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat; 
  margin: 0 auto 30px;
}
.icon-termin {
  background-image: url("img/calendar-yellow.svg");
}
.icon-email {
  width: 50px;;
  background-image: url("img/icon-envelope.svg");
}
.icon-phone {
  background-image: url("img/icon-phone.svg");
}






#karriere-willkommen .button {
  margin: 10px 20px;
}



#karriere-gruende {
  background-color: #EFEFEF;
}
.karriere-box-gruen {
  display: flex;
  flex-direction: column;
}
.karriere-box-portrait-round-c {
  position: relative;
  margin: 0 auto;
}
.karriere-box-portrait-round {
  border-radius: 100%;
  width: 50vw;
  height: 50vw;
  object-fit: cover;
  position: relative;
  margin: 10px auto;
}
.karriere-box-portrait-round-c::before {
  content: "\"";
  font-size: 283px;
  color: #fff;
  opacity: 0.75;
  z-index: 4;
  text-shadow: 0 4px 4px #00000055;
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  line-height: 211px;
  width: 125px;
  height: 75px;
  margin-left: -15px;
}
.karriere-box-gruen-ending-content {
  text-align: center;
}


.arrow-process-list {
  counter-reset: item 0;
  padding: 50px 40px 0;
}
.arrow-list-item {
  display: block;
  position: relative;
  counter-increment: item 1;
  padding-left:35%;
  margin-bottom: 30px;
  min-height: 70px;
  font-weight: 700;
  flex-grow: 1;
}
.arrow-list-num::before {
  content: counter(item);
  justify-content: center;
  align-items: center;
  display: inline-block;
  background-color: #2E2E2C;
  text-align: center;
  color: rgb(247, 166, 0);
  border-radius: 100%;
  width: 40px;
  height: 40px;
  font-size: 25px;
  font-weight: 400;
  position: absolute;
  left:calc(35% - 70px);
  top:0;
}
.arrow-list-arrow {
  display: block;
  height: calc(100% - 22px);
  width:3px;
  border-radius: 1.5px;
  background-color: #F7A600;
  position: absolute;
  left:calc(35% - 50px);
  top:45px;
}
.arrow-list-arrow::before, .arrow-list-arrow::after {
  content:"";
  display: block;
  height: 3px;
  width:10px;
  border-radius: 1.5px;
  background-color: #F7A600;
  position: absolute;
  bottom:0;
  left:-3.5px;
}
.arrow-list-arrow::before {
  transform: translateX(25%) rotate(-45deg);
}
.arrow-list-arrow::after {
  transform: translateX(-25%) rotate(45deg);
}
.arrow-list-item:last-of-type .arrow-list-arrow {
  display: none;
}




#karriere-bis-gleich .container {
  position: relative;
  z-index: 2;
}
.icon-space-startups {
  margin: 0 0 20px;
  background-image: url("img/icon-space-startups.svg");
}
#karriere-bis-gleich .section-background {
  object-position: 70%;
}
#karriere-bis-gleich h2 {
  text-align: left !important;
}


#leistung-vorteile {
  background-color: #EFEFEF;
}
.vorteile-slider-item {
  position: relative;
  color:#fff;
  background-color: #2E2E2C;
  border-radius: 20px;
  padding: 30px 30px 0;
  box-shadow: 0 4px 4px #0003;
  margin-bottom: 20px;
}
.vorteile-slider-item::before {
  content:"";
  display: block;
  position: absolute;
  z-index: 1;
  left:0;
  top:0;
  width:100%;
  height:100%;
  background: linear-gradient(-140deg, rgba(0, 39, 33, 0.898) 0%, rgba(0, 70, 60, 0.956) 100%);
  opacity:0;
  transition: opacity ease 0.4s;
  border-radius: 20px;
}
.vorteile-slider-item-wrapper {
  position: relative;
  z-index: 1;
  height:0;
  overflow: hidden;
  transition: height ease .4s;
}
.vorteile-slider-item-active::before {
  opacity: 1;
}
.vorteile-slider-icon {
  display: none;
}
.vorteile-slider-item .h3 {
  margin-top:0;
}
.vorteile-slider-item p:last-child {
  margin-bottom: 0;
}
.vorteile-slider-fold-btn {
  width: 100%;
  height: 50px;
  position: relative;
  z-index: 1;
}
.vorteile-slider-fold-btn::before {
  content:"";
  display: block;
  position: absolute;
  left:50%;
  top:50%;
  transform: translate(-50%,-50%) rotate(180deg);
  width: 20px;
  height:20px;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat; 
  background-image: url("img/icon-arrow-fold.svg");  
  transition: transform ease .4s;
}
.vorteile-slider-item-active .vorteile-slider-fold-btn::before {
  transform: translate(-50%,-50%) rotate(0);
}



#services-tools .col-6:last-of-type {
  margin-top: 50px;
}



#insights .kunden-mosaic-head {
  position: relative;
  height: 200px;
  left:-25px;
  top: -25px;
  width: calc(100% + 50px);
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  overflow: hidden;
  display: flex;
  align-items: center;
  padding:30px;
}
#insights .mosaic-background-image {
  display: block;
  position: absolute;
  height:100%;
  width:100%;
  top:0;
  left:0;
  z-index: 1;
  object-fit: cover;
  opacity: 0.7;
}
#insights .kunden-mosaic-head h3 {
  position: relative;
  z-index: 2;
  text-shadow: 0 4px 4px #0005;
}

#insights .kunden-mosaic-row.kunden-mosaic-ending-cta {
  max-width: 245px;
  background-color: transparent;
  padding-top:0;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-right: 0;
}



#leistung-kontakt {
  background-color: #2E2E2C;
  color:#fff;
  padding-top: 50vw;
}
#leistung-kontakt.section-gradient::before {
  opacity: 0.5;
}
#leistung-kontakt .container {
  position: static;
}
#leistung-kontakt h2, #leistung-kontakt .container-inner-c {
  position: relative;
  z-index: 2;
  text-align: center;
}
.leistung-kontakt-portrait {
  position: absolute;
  left:0;
  top:0;
  z-index: 1;
  width:100%;
  height:100%;
  object-fit: cover;
  object-position: center;
}
#leistung-kontakt .linked-in-icon {
  display:none;
}
#leistung-kontakt .button {
  margin:0;
}





#kalender-bg-layer {
  display:none;
  opacity: 0;
  transition: opacity .4s ease;
  position: fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background-color: #F1F3F6DD;
  z-index: 199;
}
#kalender {
  background-color: #fff;
  width: calc(100% - 40px);
  left: 20px;
  top: 30px;
  position: fixed;
  z-index: 200;
  max-height: calc(100vh - 60px);
  border-radius: 5px;
  box-shadow: 0 0 10px #00000011;  
  display:none;
  opacity: 0;
  transition: opacity .4s ease;
  padding: 5px 60px 5px 20px;
}



.blog-overview-post-inner-c {
  width:100%;
  position: relative;
}
.blog-overview-header {
  margin-bottom:50px;
}

.blog-overview-post-item {
  position: relative;
  background-color: #2E2E2C;
  color:#fff;
  border-radius: 20px;
  overflow: hidden;
  padding: 120px 30px 20px;
  margin-bottom:30px;
  width:100%;
}
.blog-overview-post-img {
  display: block;
  position: absolute;
  left:0;
  top:0;
  width: 100%;
  height:100%;
  object-fit: cover;
  object-position: center;
  z-index: 0;
}
.blog-overview-post-item::before {
  content: "";
  position: absolute;
  z-index: 2;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: #004D41;
  background: linear-gradient(56deg, rgb(0, 39, 33) 0%, rgba(30, 100, 90, 0.6) 100%);
  opacity: 0.9;  
}
.blog-overview-post-content {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  justify-content: stretch;
}
.blog-overview-post-content p:last-child {
  justify-self: flex-end;
  margin-top:auto;
  margin-bottom:0;
}
.blog-overview-post-title {
  margin-bottom: 5px;
}
.blog-overview-post-author {
  margin-top: 0;
}
.blog-overview-post-content p:last-child {
  margin-bottom:0;
}




.banner-tags {
  color:#fff;
  text-align: center;
}
.blog-overview-tags.blog-overview-tags-selected .tag {
  color: #ccc;
}
.tag {
  display: inline-block;
  margin: 0 10px;
  font-weight: 600;
}
.blog-overview-tags .tag {
  color: #393838;
  transition: color ease .4s;
  cursor:pointer;  
}
.blog-overview-tags .tag.tag-active {
  color: #f7a600;
}
.tag::before {
  content:"#";
}

.blogpost-nav-previous {
  display: flex;
  justify-content: flex-end;
}
.blogpost-nav-next {
  display: flex;
  justify-content: flex-start;
}
.blogpost-nav-c {
  margin-top:50px;
  display: flex;
  flex-wrap: wrap;
}
.blogpost-nav-previous, .blogpost-nav-next, .blogpost-overview {
  flex-basis:100%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top:20px;
}
.blogpost-next-button, .blogpost-prev-button, .blogpost-all-button {
  position: relative;
  color: #F7A600;
  text-decoration: underline;
}
.blogpost-prev-button {
}
.blogpost-next-button {
}
.blogpost-all-button {
  display: inline-block;
}

.blogpost-next-button::before, .blogpost-prev-button::before {
  content:"";
  display:block;
  position: absolute;
  top:50%;
  width: 15px;
  height: 15px;
  background-image: url("img/icon-arrow-fold.svg");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.blogpost-next-button::before {
  right: -30px;
  transform: translateY(-50%) rotate(90deg);  
}
.blogpost-prev-button::before {
  left: -30px;
  transform: translateY(-50%) rotate(-90deg);
}


.reduced-single-page {
  padding-top: 70px;
}





footer {
  position: relative;
  background-color: #2E2E2C;
  color: #fff;
  text-align: center;
  padding-bottom: 30px;
  font-size: 18px;
}
footer > .container {
  position: relative;
  padding-top: calc(50px + 42px);
}
footer .col-4 {
  flex-basis:100%;
  margin-bottom: 40px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
footer .col-4 > p {
  flex-basis:100%;
  margin: 5px 0;
}
footer p:first-child {
  margin-top:0;
}
footer p:last-child, footer .ft-bottom-row .col-4:last-of-type {
  margin-bottom:0;
}


.ft-top-row {
  display: flex;
  flex-wrap: wrap;
}
.ft-top-row-1, .ft-top-row-2, .ft-top-row-3 {
  flex-basis:100%;
}
.ft-top-row-1 {
  order:2;
}
.ft-top-row-2, .ft-top-row-3 {
  order:1;
}
footer .ft-top-row-3 .col-4 {
  margin: 0;
}

.ft-logo {
  position: absolute;
  top: 0;
  left:50%;
  transform: translateX(-50%);
  display: block;
  width: 130px;
  margin: 0 auto;
}
.ft-icon-link {
  position: relative;
  display: inline-block;
  margin: 0 10px;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  width:60px;
  height:60px;
  border:none !important;
}
.linked-in-icon {
  background-image: url("img/linked-in-logo.svg");
}
.calendar-icon {
  background-image: url("img/calendar-logo.svg");
}

.ft-address {
  position: relative;
  padding-top: 38px;
}
.ft-address::before {
  content:"";
  display:block;
  position: absolute;
  top:0;
  left:50%;
  transform: translateX(-50%);
  width:19px;
  height:28px;
  background-image: url("img/icon-location.svg");
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}



.ft-bottom-row .col-4:last-of-type ul {
  font-size: 18px;
  font-weight: 500;
  display: flex;
  justify-content: center;
}
.ft-bottom-row .col-4:last-of-type ul li {
  margin: 0 10px;
}



#sub-ft {
  background-color: #2E2E2C;
  text-align: center;
  padding: 10px 0;
  border-top: 1px solid #ffffff56;
  color: #ffffff56;
}
#sub-ft p {
  margin:0;
}

@media screen and (max-height: 500px) {
}

@media screen and (min-width: 500px) {
  .blogpost-nav-c {
    justify-content: space-between;
  }
  .blogpost-nav-previous, .blogpost-nav-next {
    flex-basis: calc(50% - 20px);
  }
  .blogpost-nav-previous {
    justify-content: flex-end;
  }
  .blogpost-nav-next {
    justify-content: flex-start;
  }    
}


@media screen and (min-width: 700px) {
  .container, .container-wide {
    padding-left: 13vw;
    padding-right: 13vw;
  }
  .kunden-mosaic-row:last-of-type {
    margin-right: 13vw;
  }
}


@media screen and (min-width: 800px) {
  #logos-static {
    justify-content: space-evenly;
    gap: 0 50px;
    padding-top: 2vw;
  }
  .logo-row {
    flex-basis: calc(33.333% - 40px);
  }  
  .logo-row img {
    max-width: 15vw;
    max-height: 9vw;
    margin: 0 auto;
  }
}


@media screen and (min-width: 1000px) {
  .container-tight {
    padding-left: 15vw;
    padding-right: 15vw;
  }
  .container-wide {
    padding-left: 9vw;
  }
  .container-flex {
    display: flex;
    justify-content: space-between;
  }
  .col-1 {
    flex-basis: calc(100% / 12 - 20px);
  }
  .col-2 {
    flex-basis: calc(100% / 12 * 2 - 20px);
  }
  .col-3 {
    flex-basis: calc(25% - 20px);
  }
  .col-4 {
    flex-basis: calc(100% / 12 * 4 - 20px);
  }
  .col-5 {
    flex-basis: calc(100% / 12 * 5 - 20px);
  }
  .col-6 {
    flex-basis: calc(50% - 20px);
  }
  .col-7 {
    flex-basis: calc(100% / 12 * 7 - 20px);
  }
  .col-8 {
    flex-basis: calc(100% / 12 * 8 - 20px);
  }    
  .col-9 {
    flex-basis: calc(100% / 12 * 9 - 20px);
  }
  .col-10 {
    flex-basis: calc(100% / 12 * 10 - 20px);
  }
  .col-11 {
    flex-basis: calc(100% / 12 * 11 - 20px);
  }
  .col-12 {
    flex-basis:100%;
  }

  .desktop-only {
    display: block !important;
  }
  .mobile-only {
    display: none !important;  
  }

  .button {
    transition: background-color ease .4s;
    margin-top: 20px;
  }
  .button:hover {
    background-color: #d28c00;
  }

  .nav-logo {
    display: none;
  }
  .nav-c-logo {
    display: block;
    width: 10vw;
    max-width:120px;
    height:4vw;
    max-height: 48px;
  }
  #nav-bar {
    width:70px;
    height: 100vh;
    padding: 0;
    background-color: #00626288;
    transition: background-color ease .4s;
  }
  #nav-bar:hover {
    background-color: #00494988;
  }
  .nav-bar-right-c {
    width: 100%;
    height:100%;
  }
  #nav-btn-c {
    width:100%;
    height:100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #nav-c {
    top:0;
    background-color: #002721f0;
    height: 100vh !important;
    transform: translateX( calc( -100% - 50px ));
    -webkit-transform: translateX( calc( -100% - 50px ));
    width: 50vw;
    transition: transform ease .7s;
    box-shadow: 0 0 25px #0004;
  }
  .nav-visible #nav-c {
    transform: translateX(0);
    -webkit-transform: translateX(0);
  }
  .nav-inner-c {
    padding-top: 3vw;
    height: 100%;
  }
  menu {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: calc(100% - 7vw);
    margin-top: 3vw;
  }
  #nav-c menu li {
    margin-bottom: 1vw;
  }
  #nav-c menu .top-nav li a, .banner-nav-left ul li a, .lang-link, footer p a, footer a, section p a, .sub-nav a {
    border-bottom: 2px solid transparent;
    transition: all ease .4s;
    text-decoration: none;
    color:inherit;
  }
  #nav-c menu .top-nav li.current-menu-item a,
  .banner-nav-left ul .current-menu-item a,
  .sub-nav .current-menu-item a,
  footer .current-menu-item a,
  #nav-c menu .top-nav li a:hover, .banner-nav-left ul li a:hover, .lang-link:hover, footer a:hover, section p a:hover, .sub-nav a:hover {
    border-bottom: 2px solid #F7A600;
  }
  .banner-nav-left ul li a[href*="#"],.banner-nav-left ul li a[href*="#"]:hover,
  #banner-nav li a[href*="#"], #nav-c menu .top-nav li a[href*="#"]:hover {
    cursor: default
  }
  section p a:has(> .button), section p a:has(> .button-arrow),
  .button a, .button a:hover,
  #nav-c menu .top-nav li a[href*="#"], #nav-c menu .top-nav li a[href*="#"]:hover,
  .banner-nav-left ul li a[href*="#"],.banner-nav-left ul li a[href*="#"]:hover {
    border: none;
  }
  .nav-kontakt-c {
    margin: auto 0 3vw;
    display: flex;
    flex-wrap: wrap;
  }
  #nav-c menu li ul li {
    margin-bottom: 0;
  }
  #nav-c menu li ul li a {
    font-size: calc(9px + 0.6vw);
  }
  .nav-kontakt {
    margin-right: 50px;
  }
  .nav-kontakt:last-of-type {
    margin-right: 0;
  }
  .nav-kontakt-c, .sub-nav {
    padding:0;
  }
  .sub-nav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }
  .sub-nav li {
    margin-right: 20px;
  }
  .nav-sub-c {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
  }

  #banner::after {
    width: 30px;
    height: 30px;
  }


  #banner-nav {
    display: flex;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    color: #fff;
    justify-content: space-between;
    align-items: center;
    padding-top:4vw;
  }
  .banner-logo {
    display: block;
    width: 7vw;
    height: 4vw;
    background-image: url("img/tenics_logo_white.svg");
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    top: -0.41vw;
    margin-right: 4vw;
  }
  .banner-nav-left, .banner-nav-left ul {
    font-size: 1.4vw;
    font-weight: 400;
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  .banner-nav-left ul li {
    margin-right: 2vw;
  }
  .banner-nav-right {
    font-weight: 400;
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  .banner-nav-right  li {
    display: block;
    margin-left: 2vw;
  }
  #banner-nav ul li {
    position: relative;
  }
  #banner-nav ul li ul {
    display: none;
    position: absolute;
    bottom:0;
    left:-25px;
    transform: translateY(100%);
    flex-wrap:wrap;
    justify-content: flex-start;
    min-width: 27vw;
    padding: 25px;
  }
  #banner-nav ul li:hover ul {
    display:flex;
  }
  #banner-nav ul li ul li {
    display:block;
    flex-basis:100%;
    word-break: keep-all;
    margin-bottom: 5px;
  }
  #banner-nav ul li ul li a {
    position: relative;
    padding-left:20px;
  }
  #banner-nav ul li ul li a::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    width: 15px;
    height: 15px;
    background-image: url("img/icon-arrow-fold.svg");
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    left: 0;
    transform: translateY(-50%) rotate(90deg);    
  }
  #banner-nav .button {
    padding: 8px 10px;
    margin:0;
  }

  .calendar-button {
    display: block;
    width: 4vw;
    height: 4vw;
    background-image: url("img/calendar-yellow.svg");
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;    
  }

  #banner-content {
    text-align: left;
  }





  .sidenav-c {
    display: block;
    pointer-events: none;
    position: absolute;
    left:0;
    top:0;
    width: 70px;
    height:100%;
  }
  .sidenav-inner-c {
    padding: 35px 0;
    font-family: "Abel", sans-serif;
    font-size: calc(16.5px + 0.8vw);
    text-align: right;
    color: #fff;
    z-index: 100;
    text-transform: uppercase;
    position: sticky;
    top: 0;
    left: 0px;
    width: 70px;
    writing-mode: sideways-lr;
    text-orientation: sideways-right;
    display: flex;
    align-items: center;
  }

  .quote-container {
    max-width: 50vw;
    left:50%;
    transform: translateX(-50%);
    margin-top: 8vw;
    margin-bottom: -12vw;
    padding: 75px 50px 20px;
  }
  .quote-container::before {
    left:33px;
    transform: none;
  }

  .col-4.leistung-item-c, .leistung-item-inner-c {
    display: flex;
    flex-direction: column;
  }
  .leistung-item-inner-c {
    flex-basis: auto;
    flex-grow: 1;
    align-items: flex-start;
    padding: 2.3vw;
  }
  .leistung-item-inner-c .stick-to-bottom, .leistung-item-inner-c .button {
    margin-top:auto;
  }
  .leistung-item-c img {
    display: block;
    width: 100%;
    height: 15vw;
  }


  #bis-gleich .col-6 {
    text-align: left;
  }
  #bis-gleich .container-flex {
    margin-top: 5vw
  }
  ol > li:first-child {
    margin-top:0;
  }
  ol > li {
    padding-top: 0;
    padding-left: 60px;
  }
  ol > li::before {
    left:0;
    top:0;
    transform: none;
    text-align: center;
  }
  .col-6 p:first-of-type {
    margin-top:0;
  }

  #services-tools .col-6:last-of-type {
    margin-top: 0;
  }

  .faq-fold-button {
    cursor:pointer;
    right:0;
  }
  .faq-question {
    position: relative;
    min-height: 42px;
    display: flex;
    align-items: center;
    padding-right: 60px;
  }
  .faq-question::before {
    content: "";
    display: block;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    z-index: 0;
    margin-top:-1px;
    background-color: transparent;
    border-radius: 100%;
    transition: background-color ease .4s;
  }
  .faq-item:hover .faq-question::before {
    background-color: #2E2E2C;
  }
  .faq-item.faq-item-active .faq-question::before {
    background-color: transparent;
  }


  .kontakt-item {
    margin-top: 2.5vw;
    transform: translateY(0);
    transition: transform ease .4s, box-shadow ease .4s;
  }
  .kontakt-item:hover {
    transform: translateY(-8px);
    box-shadow: 0 14px 10px #0002;
  }




  .karriere-box-gruen {
    position: relative;
    text-align: left !important;
    color: #fff;
    width: calc(100% / 12 * 10 - 20px);
    margin-left:auto;
    background: #003F3F;
    background: linear-gradient(42deg, rgba(0, 63, 63, 1) 0%, rgba(0, 137, 116, 1) 100%);
    border-radius: 20px;
    padding-top: 5vw;
    padding-bottom: 4vw;
    padding-right: 50px;
    padding-left: calc(12.3vw + 40px);
  }
  .karriere-box-gruen .tuerkies {
    color: #fff;
  }
  .karriere-box-gruen h2:first-child {
    margin-top:0;
  }
  .karriere-box-portrait-round {
    position: absolute;
    width: 24.6vw;
    height: 24.6vw;
    max-width: 400px;
    max-height: 400px;
    left: 0;
    top:50%;
    transform: translate(-50%, -50%);
  }
  .karriere-box-portrait-round-c {
    position: static;
  }
  .karriere-box-portrait-round-c::before {
    display: none;
  }
  .karriere-box-gruen::before {
    content: "\"";
    font-size: 283px;
    color: #fff;
    opacity: 0.75;
    z-index: 4;
    text-shadow: 0 4px 4px #00000055;
    position: absolute;
    top: 50%;
    left: 0;
    /*display: block;*/
    display: none;
    line-height: 211px;
    width:125px;
    height: 75px;
    margin-left: -15px;
    transform: translate(calc(12.3vw - 100%), -12.3vw);
  }
  .karriere-box-gruen-ending-content {
    text-align: left;
  }

  #onboard-software .p-tall {
    text-align: center;
  }


  #karriere-profil p:first-of-type {
    margin-top:0;
  }


  #karriere-bis-gleich .container > h2 {
    text-align: center !important;
    margin-bottom: 5vw;
  }
  #karriere-bis-gleich .col-6:first-of-type {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  #karriere-bis-gleich .col-6:first-of-type strong {
    font-size: calc(15px + 1vw);
    font-weight: 400;
  }



  .arrow-process-list {
    margin-bottom: 2vw;
  }
  .arrow-list-item {
    text-align: center;
    padding: 60px 8px 0;
    margin-bottom:0;
    flex-basis: calc(25% - 20px);
  }
  .arrow-list-num::before {
    left:50%;
    transform: translateX(-50%);
  }
  .arrow-list-arrow {
    left:50%;
    margin-left: 28px;
    top: 18.5px;
    height:3px;
    width: calc(100% - 56px );
    z-index: 2;
  }
  .arrow-list-arrow::before, .arrow-list-arrow::after {
    width: 13px;
  }
  .arrow-list-arrow::before {
    bottom: auto;
    left: auto;
    top: 4px;
    right: -1px;
    margin: unset;
    transform: rotate(-45deg);
  }
  .arrow-list-arrow::after {
    bottom: auto;
    left: auto;
    top: -4px;
    right: -1px;
    margin: unset;
    transform: rotate(45deg);
  }


  .vorteile-slider-outer-c {
    position: relative;
    margin-top:50px;
  }
  .vorteile-slider-viewport {
    overflow: hidden;
  }
  .vorteile-slider-inner-c {
    transform: translateX(0);
    transition: transform ease .6s;
  }

  .vorteile-slider-btn-left, .vorteile-slider-btn-right {
    position: absolute;
    top:0;
    height: 100%;
    width: 50px;
    cursor:pointer;
  }
  .vorteile-slider-btn-left {
    left: -50px;
  }
  .vorteile-slider-btn-right {
    right:-50px;
  }
  .vorteile-slider-btn-left::before, .vorteile-slider-btn-right::before {
    content: "";
    display:block;
    width:20px;
    height:20px;
    position: absolute;
    top:50%;
    left:50%;
    background-image: url("img/icon-arrow-fold.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: transform ease .3s;
  }
  .vorteile-slider-btn-left::before { transform: translate(-50%,-50%) rotate(-90deg); }
  .vorteile-slider-btn-left:hover::before { transform: translate(calc( -50% - 5px ),-50%) rotate(-90deg); }
  .vorteile-slider-btn-right::before { transform: translate(-50%,-50%) rotate(90deg); }
  .vorteile-slider-btn-right:hover::before { transform: translate(calc(-50% + 5px),-50%) rotate(90deg); }
  .vorteile-slider-item-wrapper {
    height:auto !important;
  }
  .vorteile-slider-fold-btn {
    display: none;
  }
  .vorteile-slider-item.vorteile-slider-item-active::before {
    display:none;
  }
  .vorteile-slider-item {
    flex-shrink:0;
    flex-basis:calc(100% / 12 * 4 - 15px);
    margin-right: 20px;
    padding-bottom: 30px;
    padding-top:40px;
  }
  .vorteile-slider-icon {
    display: block;
    width: 60px;
    height: 60px;
    object-fit: contain;
    object-position: center;
    margin: 0 auto 40px;
  }
  .vorteile-slider-item h3, .vorteile-slider-item .h3 {
    font-size: calc(11px + 0.7vw);
    margin-bottom: 30px !important;
  }



  #insights .kunden-mosaic-row {
    align-items: stretch;
  }
  #insights .kunden-mosaic-head {
    top:0;
    left:0;
    width:100%;
    border-top-right-radius: 0;
    height: auto;
    align-items: flex-start;
    justify-content: center;
  }
  #insights .kunden-mosaic-head h3, #insights .kunden-mosaic-head .h3 {
    font-weight: 400;
    font-size: calc(15px + 1vw);
  }
  #insights .kunden-mosaic-row:nth-of-type(2n+1) .kunden-mosaic-head {
    flex-basis: calc(100% / 12 * 4 - 20px);
    order: 1;
  }
  #insights .kunden-mosaic-row:nth-of-type(2n+1) .kunden-mosaic-content {
    flex-basis: calc(100% / 12 * 8 - 20px);
    order: 2;
  }
  #insights .kunden-mosaic-row:nth-of-type(2n+2) .kunden-mosaic-head {
    flex-basis: calc(100% / 12 * 4 - 20px);
    order:2;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
  }
  #insights .kunden-mosaic-row:nth-of-type(2n+2) .kunden-mosaic-content {
    flex-basis: calc(100% / 12 * 8 - 20px);
    order:1;
  }
  #insights .kunden-mosaic-row.kunden-mosaic-ending-cta {
    display: none;
  }
  #insights .mosaic-element-show-all {
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    margin-right: 20px;
  }
  #insights .mosaic-element-show-all .button-arrow {
    padding-right:0;
    padding-bottom: 40px;
  }
  #insights .mosaic-element-show-all .button-arrow::after {
    top: auto;
    left:0;
    bottom: 0;
  }
  .kunden-mosaic-end, .kunden-mosaic-bottom-nav-c {
    display: none;
  }




  #leistung-kontakt {
    padding-top: 6vw;
  }
  #leistung-kontakt .container {
    position: relative;
  }
  #leistung-kontakt .container h2 {
    margin-bottom: 4vw;
  }
  #leistung-kontakt.section-gradient::before {
    display: none;
  }
  .leistung-kontakt-portrait {
    width: calc(130px + 6vw);
    height: calc(130px + 6vw);
    border-radius: 100%;
    left: calc(50% - 20px);
    top:50%;
    transform: translate(-100%, -50%);
  }
  #leistung-kontakt .container-inner-c {
    text-align: left;
  }
  .leistung-kontakt-tel-links-c {
    display: flex !important;
    align-items: center;
    margin-top:-20px;
  }
  .leistung-kontakt-tel-links-c p {
    margin-right: 20px;
    margin-bottom: 0;
  }
  #leistung-kontakt .linked-in-icon {
    display: inline-block;
  }



  .banner-tags {
    text-align: left;
  }
  .tag:first-of-type {
    margin-left:0;
  }




  .blog-overview-post-inner-c {
    position: relative;
    width:calc(100% + 20px);
    left: -20px;
  }

  .blog-overview-post-item {
    width: calc(33.33% - 20px);
    margin-left:20px;
    margin-bottom:20px;
    padding-top:30px;
  }
  .blog-overview-post-item::before {
    display:none;
  }
  .blog-overview-post-content {
    min-height: 24vw;
  }

  .blog-overview-post-img {
    position: relative;
    top: -30px;
    left: -30px;
    width: calc(100% + 60px);
    max-width:none;
    height: 13vw;
  }



  .reduced-single-page {
    padding-top: calc(8vw + 20px);
  }
  .reduced-single-page::before {
    content:"";
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height: calc(8vw + 20px);
    display: block;
    background-color: #003F3F;
  }
  .reduced-single-page #banner-nav ul li ul {
    background-color: #003F3F;
  }


  footer {
    text-align: left;
  }
  footer .col-4 {
    flex-basis: calc(100% / 12 * 4 - 20px);
    justify-content: flex-start;
  }
  .ft-top-row, .ft-bottom-row, .ft-top-row-1, .ft-top-row-2, .ft-top-row-3 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
  }
  .ft-top-row-1 {
    order: 1;
  }
  .ft-logo {
    position: relative;
    left:auto;
    top:-1vw;
    width: 13vw;
    height: auto;
    margin:0;
    transform:none;
  }
  .ft-address {
    padding-top:0;
  }
  .ft-address::before {
    top:0;
    left:-30px;
  }
  .ft-top-row-2 {
    justify-content: flex-end;
  }
  .ft-icon-link:first-child {
    margin-left:0;
  }
  .ft-bottom-row {
    margin-top:5vw;
  }
  .ft-bottom-row li {
    margin-bottom: 10px;
  }
  .ft-bottom-row .col-4:last-of-type ul {
    display: block;
    width: 100%;
  }
  .ft-bottom-row .col-4:last-of-type ul li {
    margin: 0;
    margin-bottom: 10px;
  }


  #sub-ft {
    border:none;
    text-align: right;
  }


}

@media screen and (min-width: 1100px) {

  body {
    font-size: calc(9px + 0.6vw);
  }
  .h0 {
    font-size: calc(17.5px + 1vw);
  }
  .arrow-the-right {
    width: 4vw;
    transform: translateY(calc(-50% + 0.6vw - 3px));
    height: 1.1vw;
  }
  h1, .h1 {
    font-size: calc(20px + 2.5vw);
  }
  h2, .h2 {
    font-size: calc(20px + 1.33vw);
    font-weight: 500;
    margin-bottom: calc(15px + 2vw);
  }
  h3, .h3, .p-tall, .kunden-mosaic-head h3 {
    font-size: calc(15px + 1vw);
    font-weight: 400;
  }
  .p-tall {
    margin-bottom: 4vw;
  }
  .p-author {
    font-size: calc(12px + 0.8vw);
  }

  .button-arrow {
    font-size: calc(10px + 1vw);
    cursor:pointer;
  }
  footer p .button-arrow, footer p .button-arrow:hover {
    border:none;
  }
  .button-arrow::after {
    margin-left: calc(4px + 1vw);
    width:calc(8px + 0.8vw);
    height:calc(8px + 0.8vw);
    transition: transform ease 0.4s;
    transform: translate(0,0);
  }
  .button-arrow:hover::after {
    transform: translate(10px, -10px);
  }

  footer, section {
    padding-top: 6vw;
    padding-bottom: 6vw;
  }



  .kunden-intro-desktop {
    display: block !important;
  }
  .kunden-intro-mobil {
    display: none;
  }
  .kunden-mosaic-outer-c {
    overflow:hidden;
    padding:0;
    margin-top: 6vw;
  }
  .kunden-mosaic-inner-c {
    flex-wrap: wrap;
  }
  .kunden-mosaic-row {
    padding:0;
    display: flex;
    justify-content: space-between;
    flex-direction: row;
    max-width: none;
    flex-basis: 100%;
    margin-bottom: 15px;
    background-color: transparent;
  }
  .kunden-mosaic-head , .kunden-mosaic-content {
    box-shadow: 0 4px 4px #0004;
    border-radius: 20px;
    padding: 3vw;
  }
  .kunden-mosaic-row:nth-of-type(2n+1) .kunden-mosaic-head, .kunden-mosaic-row:nth-of-type(2n) .kunden-mosaic-content {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }
  .kunden-mosaic-row:nth-of-type(2n) .kunden-mosaic-head, .kunden-mosaic-row:nth-of-type(2n+1) .kunden-mosaic-content {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }  
  .kunden-mosaic-row:nth-of-type(2n) .kunden-mosaic-head {
    order:2;
    margin-right: 0;
    margin-left:15px;
  }
  .kunden-mosaic-head {
    background: #214942;
    background: linear-gradient(0deg, rgba(33, 73, 66, 1) 0%, rgba(33, 43, 40, 1) 100%);
    flex-basis: calc(100% / 12 * 4 - 15px);
    margin-right: 15px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .kunden-mosaic-head h3, .kunden-mosaic-content .button-arrow {
    margin:0;
  }
  .kunden-mosaic-icon {
    width: 4.3vw;
    height: 4.3vw;
    left:0;
    transform:none;
  }
  .kunden-mosaic-content {
    flex-basis: calc(100% / 12 * 8 - 15px);
    background-color: #2E2E2C;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
  }
  .kunden-mosaic-content p {
    margin-top:0;
    margin-bottom: 3vw;
  }
  .kunden-mosaic-content p:last-child {
    margin-bottom:0;
  }
}


@media screen and (min-width: 1200px) {
  #kalender {
    width: 50vw;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 200;
  }  

}

@media screen and (min-width: 1300px) {
  .blog-overview-post-inner-c {
    position: relative;
    width:calc(100% + 50px);
    left: -50px;
  }

  .blog-overview-post-item {
    width: calc(33.33% - 50px);
    margin-left:50px;
    margin-bottom:50px;
  }  

  .blog-overview-post-content {
    min-height: 22vw;
  }
}

@media screen and (min-width: 1400px) {
  .blog-overview-post-content {
    min-height: 21vw;
  }
}

@media screen and (min-width: 1600px) {
  .blog-overview-post-content {
    min-height: 18vw;
  }
}

@media screen and (min-width: 1800px) {
  .blog-overview-post-content {
    min-height: 16vw;
  }
}

@media screen and (min-width: 2000px) {
  .blog-overview-post-content {
    min-height: 14vw;
  }
}


@media screen and (min-width: 1920px) {
}
























/* Cookiebar + Cookiepanel CSS */
#cookiebar-pop-up {
  position: fixed;
  display: none;
  z-index: 101;
  opacity: 0;
  bottom: 0;
  left:0;
  width: 100%;
  padding: 30px;
  box-shadow: 0 -5px 15px #0000001c;
  background: rgb(240,244,246);
  background: linear-gradient(175deg, rgba(240,244,246,1) 0%, rgba(213,216,219,1) 100%);
  transition: opacity ease .4s;
}
.cookiebar-pop-up-c {
  display: flex;
  justify-content: space-between;
  flex-wrap:wrap;
  width: 100%;
}
.cookiebar-pop-up-description {
  margin-bottom: 20px;
}
.cookiebar-pop-up-description p {
  margin:0;
}
.cookiebar-pop-up-button-c {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 20px;
}
.cookiebar-pop-up-button-c .button {
  margin: 0;
}
.cookiebar-finish {
  padding: 5px 0 0;
  display: flex;
  gap: 15px;
}
.cookiebar-finish .button {
  margin-right: 5px;
  margin-top: 5px;
}
.cookiebar-pop-up-button {
  cursor: pointer;
}


#cookiebar-options {
  display: none;
  position: fixed;
  left:20px;
  top: 20px;
  width: calc(100% - 40px);
  max-height: calc(100vh - 40px);
  overflow: scroll;
  opacity: 0;
  transition: opacity ease .4s;
  padding: 15px;
  border-radius: 5px;
  box-shadow: 0 -5px 15px #0000001c;
  background: rgb(240,244,246);
  background: linear-gradient(175deg, rgba(240,244,246,1) 0%, rgba(213,216,219,1) 100%);
  z-index: 101;
}

.cookiebar-title {
  margin-top: 0;
  padding-right: 40px;
  width: 100%;
  font-weight: bold;
}


.cookiebar-cookiegroup {
  background-color: #fff9;
  border-radius: 5px;
  padding: 15px 15px;
  margin-bottom: 10px;
  display: flex;
  flex-wrap:wrap;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 10px 20px;
}
.cookiebar-cookiegroup:last-of-type {
  margin-bottom: 0;
}
.cookiebar-cookie-title, .cookiebar-cookie-description {
  margin: 0;
}

.cookiebar-cookie-option-btn {
  width: 35px;
  height: 18px;
  border: 1px solid #555;
  border-radius: 20px;
  position: relative;
  margin-top: 4px;
}
.cookiebar-cookie-option-btn.cookiebar-cookie-option-btn-optional {
  cursor: pointer;
  border: 1px solid #000;
}
.cookiebar-cookie-option-btn::before {
  content:"";
  position: absolute;
  left: 2px;
  top: 2px;
  display: block;
  width: 12px;
  height: 12px;
  border-radius: 10px;
  transform: translateX(0);
  -webkit-transform: translateX(0);
  transition: all ease .4s;
}
.cookiebar-cookie-option-btn.cookiebar-cookie-option-btn-not-optional::before {
  background-color: #555;
  transform: translateX(17px);
  -webkit-transform: translateX(17px);
}
.cookiebar-cookie-option-btn.cookiebar-cookie-option-btn-optional::before {
  background-color: #a00;
}
.cookiebar-cookie-option-btn.cookiebar-cookie-option-btn-optional.cookiebar-cookie-option-accepted::before {
  transform: translateX(17px);
  -webkit-transform: translateX(17px);
  background-color: #5a5;
}

.cookiebar-options-cls {
  cursor:pointer;
}

#cookiebar-options-cls-btn, #kalender-cls-btn {
  display: block;
  position: fixed;
  top: 35px;
  right: 35px;
  width: 30px;
  height: 30px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 20px;
  background-color: #222;
  border-radius: 50px;
  border: 1px solid #393838;
  cursor: pointer;
  overflow:hidden;
}
#cookiebar-options-cls-btn::before, #cookiebar-options-cls-btn::after,
#kalender-cls-btn:before, #kalender-cls-btn:after {
  content:"";
  display: block;
  width: 10px;
  height: 2px;
  background-color: #ccc;
  position: absolute;
  left:50%;
  top:50%;
}
#cookiebar-options-cls-btn::before,
#kalender-cls-btn::before {
  transform: translate(-50%, -50%)  rotate(45deg);
  -webkit-transform: translate(-50%, -50%)  rotate(45deg);
}
#cookiebar-options-cls-btn::after,
#kalender-cls-btn::after {
  transform: translate(-50%, -50%) rotate(-45deg);
  -webkit-transform: translate(-50%, -50%)  rotate(-45deg);
}
.accept-cookie {
  cursor:pointer;
}


@media screen and (min-width: 700px) {
  .cookiebar-pop-up-button-c {
    flex-direction: row;
    gap: 20px;
  }  
  #cookiebar-options-cls-btn {
    display: block;
    position: fixed;
    top: -30px;
    right: 0px;
    width: 20px;
    height: 20px;
  }
}
@media screen and (min-width: 1100px) {
  #cookiebar-options {
    position: fixed;
    left:50%;
    top:50%;
    height: auto;
    width:70vw;
    overflow: visible;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
  }
}