/* --- FONTS ------------------------ */

@font-face {
  font-family: 'OpenSans Light'; /* 300 */
  src: local(''), url('../fonts/OpenSans-Light.ttf') format('truetype');
}

@font-face {
  font-family: 'OpenSans Regular'; /* 400 */
  src: local(''), url('../fonts/OpenSans-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'OpenSans Medium'; /* 500 */
  src: local(''), url('../fonts/OpenSans-Medium.ttf') format('truetype');
}

@font-face {
  font-family: 'OpenSans SemiBold'; /* 600 */
  src: local(''), url('../fonts/OpenSans-SemiBold.ttf') format('truetype');
}

@font-face {
  font-family: 'OpenSans Bold'; /* 700 */
  src: local(''), url('../fonts/OpenSans-Bold.ttf') format('truetype');
}

@font-face {
  font-family: 'Font Awesome 6 Solid';
  font-style: normal;
  font-weight: 900;
  src: local(''), url('/libraries/fontawesome/webfonts/fa-solid-900.woff2') format('woff2');
}

:root {
  --font-text: OpenSans Regular, Arial, sans-serif;
  --font-teaser: OpenSans SemiBold, Arial, sans-serif;
  --font-header: OpenSans Bold,Arial, sans-serif;
}

:root {
  --font-size-text: 12pt; /* 16px */
  --font-size-teaser: 13.5pt; /* 18px */
  --font-size-h1: 30pt; /*40px */
  --font-size-h2: 24pt; /*32px */
  --font-size-h3: 18pt; /*24px */
  --font-size-h4: 14pt; /*24px */
}

@media (min-width: 0px) and (max-width: 640px) {
  :root {
    --font-size-text: 11pt;
    --font-size-teaser: 11pt; 
    --font-size-h1: 27pt; 
    --font-size-h2: 21pt; 
    --font-size-h3: 15pt;
    --font-size-h4: 11pt;
  }
}

/* --- COLOR ------------------------ */

:root {
  --color-red: #DE152C; /* rgba(222, 21, 44, 1) */
  --color-darkred: #B015DE; /* rgba(176, 21, 222, 1) */
  --color-dark: #121212; /* rgba(18, 18, 18, 1) */
  --color-white: #FFFFFF;
  --color-lightblue: #E2F4F7; /* rgba(226, 244, 247, 1) */
  --color-mediumblue: #83C1FF; /* rgba(131, 193, 255, 1) */

  --color-lightblue-0-25: rgba(226, 244, 247, 0.25);
  --color-mediumblue-0-25: rgba(131, 193, 255, 0.25);
  --color-lightblue-0-75: rgba(226, 244, 247, 0.75);
  --color-mediumblue-0-75: rgba(131, 193, 255, 0.75);
}

/* --- BASE SETTINGS -------- */

*, ::before, ::after {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}

body {
}

strong {
  font-family: OpenSans Bold; Arial; sans-serif;
}

.kippdata-invisible {
  display: none !important;
}

.kippdata-body {
  font-family: var(--font-text);
  font-size: var(--font-size-text);
  color: var(--color-dark);
  max-width: 1000px;
  width: calc(100vw - 50px);
  margin: auto;
  line-height: 1.4;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  X-letter-spacing: 0px;
}

.kippdata-body h1 {
  font-family: var(--font-header);
  font-size: var(--font-size-h1);
  letter-spacing: 0.8px;
}

.kippdata-body h2 {
  font-family: var(--font-header);
  font-size: var(--font-size-h2);
  letter-spacing: 0.8px;
}

.kippdata-body .kippdata-main h2 {
  margin-bottom: 20px;
}

.kippdata-body h3 {
  font-family: var(--font-header);
  font-size: var(--font-size-h3);
}

.kippdata-body .kippdata-main h3 {
  X-margin-bottom: 10px;
}

.kippdata-body h4 {
  font-family: var(--font-header);
  font-size: var(--font-size-h4);
}

.kippdata-body h5 {
  font-family: var(--font-regular);
  font-size: 12pt;
}

.kippdata-body p {
  font-family: var(--font-text);
  font-size: var(--font-size-text);
}

.kippdata-body .kippdata-main p {
  X-margin-bottom: 10px;
}

img, video {
  display: block;
  max-width: 100%;
  height: auto;
}

.kippdata-debug {
  background-color: red;
  font-size: 15pt;
}

.kippdata-main ul {
  list-style-type: none;
  margin-left: 10px;
}

.kippdata-main ul li {
  text-indent: -10px;
}

.kippdata-main ul li:before {
  content: "-";
  padding-right: 6px;
}

@media (min-width: 0px) and (max-width: 640px) {
  .kippdata-body {
    width: calc(100vw - 26px);
  }
  html, body {
    overflow-x: hidden;
  }
  /*
  .kippdata-header-language-mobile ul.links li a[hreflang="en"] {
    font-size: 0pt;
  }

  .kippdata-header-language-mobile ul.links li a[hreflang="de"] {
    font-size: 0pt;
  }
  */
}

/* ---- BUTTONS -------- */

.kippdata-button-primary {
  text-align: center;
  color: var(--color-white);
  background: var(--color-red);
  border-radius: 4px;
  padding-top: 8px;
  padding-bottom: 8px;
  padding-left:32px;
  padding-right:32px;
  text-decoration: none;
  line-height: 5;
  inline-size: fit-content;
}

.kippdata-button-primary a {
  color: var(--color-white);
}

.kippdata-button-secondary {
  text-align: center;
  color: var(--color-red);
  background: var(--color-white);
  border-radius: 4px;
  border: 1px solid var(--color-red);
  padding-top: 8px;
  padding-bottom: 8px;
  padding-left:32px;
  padding-right:32px;
  text-decoration: none;
}

.kippdata-button-secondary a {
  color: var(--color-red);
}

.kippdata-button-primary a, .kippdata-button-secondary a, .kippdata-button-text a {
  text-decoration: none;
}

/* ---- HEADER -------- */

header {
  max-width: 1100px;
  width: 100%;
  height: 79px;
  max-height: 79px;
  position: fixed;
  background: var(--color-white);
  z-index: 10;
}

.kippdata-header-left {
  float: left;
}

.kippdata-header-right {
  float: right;
  right: 10%;
  position: absolute;
}

.kippdata-header-entry {
  padding-top: 30px;
  float: left;
}

.kippdata-header-logo {
  padding-top: 25px;
}

.kippdata-header-logo img {
  height: 45px;
  width: auto;
}

.kippdata-header-navigation,.kippdata-header-navigation-mobile {
  line-height: 0.7;
}

.kippdata-header-navigation .menu-item, .kippdata-header-navigation-mobile .menu-item {
  display: block;
  padding-top: unset;
  float: left;
  margin-left: 30px;
}

.kippdata-header-navigation ul.menu > li > ul.menu, .kippdata-header-navigation-mobile ul.menu > li > ul.menu {
  position: absolute;
  display: none;
  flex-direction: row;
  flex-wrap: wrap;
  box-shadow: 0px 0px 3px grey;
  background-color: #FFF;
  margin-left: -30px;
  margin-top: 4px;
  padding-bottom: 4px;
  max-width: 500px;
}

.kippdata-header-navigation ul.menu li ul.menu li a, .kippdata-header-navigation-mobile ul.menu li ul.menu li a {
  color: var(--color-dark);
}

.kippdata-header-navigation .menu-item > ul, .kippdata-header-navigation-mobile .menu-item > ul {
  margin-left: 0px;
}

.kippdata-header-navigation ul li ul li.menu-item, .kippdata-header-navigation-mobile ul li ul li.menu-item {
  flex: 40%;
  padding-top: 5px;
  padding-bottom: 5px;
}

.kippdata-header-language {
  margin-right:70px;
  line-height: 0.9;
}

.kippdata-header-language-mobile {
  margin-left:120px;
  line-height: 0.6;
}

.kippdata-header-language ul, .kippdata-header-language-mobile ul {
  list-style-type: none
}

.kippdata-header-language li, .kippdata-header-language-mobile li {
  color: lightgrey;
  float: left;
  padding-left: 5px;
}

.kippdata-header-language ul.links li a, .kippdata-header-language-mobile ul.links li a {
  font-family: var(--font-medium);
  font-size: 10.5pt;
  text-decoration: unset;
  color: lightgrey;
}

.kippdata-header-language ul.links li:nth-child(1):after, .kippdata-header-language-mobile ul.links li:nth-child(1):after {
  content:"|";
  padding-left: 5px;
}

[data-lang=de] [hreflang=de] a,
[data-lang=en] [hreflang=en] a,
.kippdata-header-language ul.links li.is-active a,
.kippdata-header-language-mobile ul.links li.is-active a {
  color: var(--color-dark);
}

.kippdata-header-nav2 {
  margin-right:70px;
}

.kippdata-header-nav3 {
  margin-right: 10px;
}

.kippdata-header-menuright,
.kippdata-header-menumobile {
  display: none;
  cursor: pointer;
}

.kippdata-header-language-mobile {
  display: none;
  cursor: pointer;
}

.kippdata-header-navigation-mobile {
  display: none;
}

/* .kippdata-button1, */
.kippdata-button1 a {
  background-color: var(--color-lightgreen);
  border-radius: 20px;
  padding-top: 6px;
  padding-bottom: 6px;
  padding-left: 20px;
  padding-right: 20px;
  margin: 0;
  line-height: 0;
}


.kippdata-link-button a {
  background-color: var(--color-lightgreen);
  border-radius: 20px;
  padding-top: 6px;
  padding-bottom: 6px;
  padding-left: 20px;
  padding-right: 20px;
  margin: 0;
  line-height: 0;
  text-decoration: none;
  color: var(--color-dark);
  font-family: var(--font-semibold);
}

.kippdata-header-navigation .menu-item span, .kippdata-header-navigation-mobile .menu-item span,
.kippdata-header-navigation a,.kippdata-header-navigation-mobile a,.kippdata-header-nav2 a, .kippdata-header-nav3 a {
  font-family: var(--font-medium);
  font-size: 10.5pt;
  color: var(--color-dark);
  text-decoration: unset;
}

.kippdata-headerelement {
  padding-right: 10px;
}

/*
@media (min-width: 641px) and (max-width: 1024px) {
  .kippdata-header-right {
    position: absolute;
    right: 0;
    margin-top: 35px;
    margin-right: 10px;
    display: none;
    box-shadow: 0px 0px 3px grey;
    background-color: #FFF;
    margin-left: -30px;
    max-width: 500px;
    padding-bottom: 10px;
  }
  .kippdata-header-left .kippdata-header-navigation-mobile {
    right: 0;
  }
  .kippdata-header-logo {
    padding-left: 20px;
  }
  .kippdata-header-navigation .menu-item {
    margin-left: 20px;
  }
  .kippdata-header-language {
    margin-right:40px;
  }
  .kippdata-header-nav2 {
    margin-right:40px;
  }
  .kippdata-header-language ul {
    padding-left: 20px;
  }
  .kippdata-header-nav3 {
    margin-right: 20px;
  }
  .kippdata-header-menuright {
    font: var(--fa-font-solid);
    position: absolute;
    right: 32px;
    padding-top: 40px;
    display: block;
  }
}
*/

@media (min-width: 0px) and (max-width: 640px){
  .kippdata-header-right {
    position: absolute;
    right: 0;
    margin-top: 35px;
    display: none;
    box-shadow: 0px 0px 3px grey;
    background-color: #FFF;
    margin-left: -30px;
    max-width: 500px;
  }
  .kippdata-header-left .kippdata-header-navigation-mobile {
    background: transparent linear-gradient(158deg, var(--color-lightblue) 0%, var(--color-mediumblue) 100%) 0% 0% no-repeat padding-box;
    position: absolute;
    width: 100vh;
    display: none;
    box-shadow: -2px 2px 5px grey;
    padding-right: 20px;
    padding-bottom: 30px;
    margin-top: 79px;
    margin-right: 10px;
    margin-left: -13px;
    height: calc(100vh - 79px);
  }
  .kippdata-header-left .kippdata-header-navigation-mobile ul a {
    font-size: 13pt;
    line-height: 1.8em;
    display: block;
    width; 100%;
  }
  .kippdata-header-left .kippdata-header-navigation-mobile ul.menu {
	  margin: unset;
  }
  .kippdata-header-left .kippdata-header-navigation-mobile ul li {
	  border: 1px solid lightgrey;
	  padding-left: 10px;
	  font-family: var(--font-text);
	  font-size: var(--font-size-text);
  }
  .kippdata-header-left .kippdata-header-navigation-mobile ul li a:after {
    content: ">";
    right:10px;
    position: fixed;
  }
  .kippdata-header-navigation-mobile .menu-item {
  display: block;
  padding-top: unset;
  float: left;
  padding: unset;
  margin: unset;
}

  .kippdata-header-logo {
    padding-left: 24px;
  }
  .kippdata-header-logo img {
    height: 40px;
  }
  .kippdata-header-navigation-mobile {
    display: unset;
  }
  .kippdata-header-navigation {
    display: none;
  }
  .kippdata-header-navigation-mobile .menu-item {
    float: unset;
  }
  .kippdata-header-menumobile {
    font: var(--fa-font-solid);
    position: absolute;
    right: 40px;
    padding-top: 31px;
    display: block;
    font-size: 16pt;
  }
  .kippdata-header-language-mobile {
    display: block;
  }
}


/* ---- CONTENT ---- */

section.kippdata-main {
  padding-top: 80px;
  padding-bottom: 20px;
}

section.kippdata-main .layout {
  X-padding-left: 80px;
}

@media (min-width: 0px) and (max-width: 640px) {
  section.kippdata-main .layout {
    padding-left: 14px;
    padding-right: 14px;
  }
  section.kippdata-main .layout.kippdata-shop-tab {
    padding-left: 20px;
    padding-right: 20px;
  }
}

/*
@media (min-width: 641px) and (max-width: 1024px) {
  section.kippdata-main .layout {
    padding-left: 43px;
    padding-right: 33px;
  }
}
*/

/* ---- SUB CONTENT ---- */
/* Call To Action */

.kippdata-subcontent .region {
  background: transparent linear-gradient(158deg, var(--color-lightblue-0-75) 0%, var(--color-mediumblue-0-75) 100%) 0% 0% no-repeat padding-box;
  padding-top: 81px;
  padding-bottom: 94px;
  padding-left: 150px;
  padding-right: 150px;
  text-align: center;
  border-radius: 8px;
  margin-bottom: 30px;
  position: relative;
}

.kippdata-subcontent .field__item::before {
  right: 100px;
  top: 180px;
  content: url('../images/decor/kontakt.png');
  position: absolute;
  opacity: 0.9;
}

.kippdata-subcontent p {
  text-align: left;
  padding-left: 100px;
  max-width: 300px;
  line-height: 1.8;
}

.kippdata-subcontent p:nth-child(1) {
  text-align: center;
  padding-left: unset;
  max-width: unset;
}

.kippdata-subcontent p:nth-last-child(-n+2) {
}

.kippdata-subcontent h2 {
  padding-bottom: 50px;
}

#block-kippdata-kontakt {
  scroll-margin-top: 200px;
}

@media (min-width: 640px) and (max-width: 910px) {
  .kippdata-subcontent {
    padding-top: 61px;
    padding-bottom: 74px;
    padding-left: 50px;
    padding-right: 50px;
  }
  .kippdata-subcontent .field__item::before {
    transform: scale(.75);
    right: 0px;
    top: unset;
    bottom: 0px;
    }
  }

@media (min-width: 0px) and (max-width: 640px) {
  .kippdata-subcontent .region {
    padding-top: 41px;
    padding-bottom: 34px;
    padding-left: 15px;
    padding-right: 15px;
  }
  .kippdata-subcontent .field__item::before {
    transform: scale(.5);
    right: -40px;
    top: unset;
    bottom: -40px;
  }
  .kippdata-subcontent a {
  }
  .kippdata-subcontent p {
    padding-left: 30px;
  }
  .kippdata-subcontent h2 {
  }
  .kippdata-subcontent p:first-child {
  }
}


/* ---- SUB CONTENT ---- */

/*---- FOOTER ---------- */

footer.kippdata-footer {
  font-size: 12pt;
  color: #ffffff;
  font-family: var(--font-text); 
  font-size: var(--font-size-text); 
  border-radius: 10px; 
  padding-top: 45px;
  padding-bottom: 45px;
  padding-left: 63px;
  background: transparent linear-gradient(329deg, #de142d 0%, #d2145c 100%) 0% 0% no-repeat padding-box;
}

footer.kippdata-footer p {
  font-family: var(--font-text); 
  font-family: OpenSans Light;Arial;sans-serif;
  font-size: var(--font-size-text); 
  padding-bottom: 5px;
  line-height: 1.5;
  X-font: normal normal normal 16px/26px OpenSans Regular;
}

footer a {
  X-color: var(--color-lightgreen);
  text-decoration: unset;
}

.kippdata-footer-address, .kippdata-footer-socialmedia {
  float: left;
  width: 66%;
}

.kippdata-footer-socialmedia {
  font-size: 20pt;
}

.kippdata-footer-socialmedia svg {
  padding-right: 26px;
}

.kippdata-footer-socialmedia svg.ext {
  display: none;
}

.kippdata-footer-menu ul {
	padding-left: 10px;
}

.kippdata-footer-menu li {
  float: right;
}

.kippdata-footer-menu li {
  display: inline;
  margin: 0px;
  margin-right: 20px;
}
.kippdata-footer-menu li:first-child {
  margin-right: 40px;
}

.kippdata-footer-menu ul.menu a.is-active,.kippdata-footer-menu ul.menu a {
  color: var(--color-white);
  font-family: OpenSans Bold; Arial; sans-serif;
}

.kippdata-spacebottom {
  height: 50px;
  background-color: var(--color-background);
}


/*
@media (min-width: 641px) and (max-width: 1024px) {
  footer.kippdata-footer {
    padding-left: 100px;
  }
  .kippdata-footer-address1, .kippdata-footer-socialmedia {
    width: 50%;
  }
}
*/

@media (min-width: 0px) and (max-width: 640px) {
  footer.kippdata-footer {
    margin-bottom:10px;
    padding-left: 20px;
    padding-top: 12px;
    padding-bottom: 12px;
  }
  footer.kippdata-footer p {
    line-height: 1.2;
  }
  .kippdata-footer-address1, .kippdata-footer-socialmedia {
    width: 100%;
    float: unset;
  }
  .kippdata-footer-line1 {
    padding-top: 38px;
  }
  .kippdata-footer-line2 p {
    font-size: var(--font-size-text-small);
  }
  .kippdata-footer-line3 {
    padding-top: 20px;
    padding-bottom: 30px;
  }
  .kippdata-footer-menu li {
  }
  .kippdata-footer-menu ul.menu {
    margin-left: 0px;
    margin-top: 20px;
    padding-left: unset;
  }
  .kippdata-footer-menu ul.menu li {
    margin-left: 0px;
    padding-right: 10px;
    font-size: 0.8em;
	  float: unset;
  }
  .kippdata-spacebottom {
    height: 0px;
  }
  .kippdata-footer-address1 .region-footer-address1 {
	  padding-bottom: 10px;
  }
}


/* Pager */

nav.pager {
  font-family: var(--font-text);
  font-size: var(--font-size-text-normal);
  font-weight: bold;
}

nav.pager li.is-active a {
  text-decoration: underline;
}


nav.pager a {
  color: var(--color-dark);
  text-decoration: none;
}

@media (min-width: 0px) and (max-width: 640px) {
  nav.pager {
    font-size: var(--font-size-text-small);
  }
  nav.pager li.pager__item--first, nav.pager li.pager__item--previous, nav.pager li.pager__item--next, nav.pager li.pager__item--last {
    font-size: 0pt;
  }
  nav.pager li.pager__item--first a::before {
    font-size: var(--font-size-text-small);
    content: "<<";
    padding-right: 5px;
    padding-left: 5px;
  }
  nav.pager li.pager__item--previous a::before {
    font-size: var(--font-size-text-small);
    content: "<";
    padding-right: 5px;
    padding-left: 5px;
  }
  nav.pager li.pager__item--next a::before {
    font-size: var(--font-size-text-small);
    content: ">";
    padding-right: 5px;
    padding-left: 5px;
  }
  nav.pager li.pager__item--last a::before {
    font-size: var(--font-size-text-small);
    content: ">>";
    padding-right: 5px;
    padding-left: 5px;
  }
}

.kippdata-header-language ul.links li a[hreflang="en"] {
  font-size: 0pt;
}

.kippdata-header-language ul.links li a[hreflang="de"] {
  font-size: 0pt;
}

.language-link[hreflang="en"]:after {
  font-size: 10.5pt;
  content: "EN";
}

.language-link[hreflang="de"]:after {
  font-size: 10.5pt;
  content: "DE";
}

/* MENU */

#block-kippdata-hauptnavigation ul.menu a.is-active {
  text-decoration: underline;
  text-decoration-color: var(--color-red);
  text-decoration-thickness: 2px;
  text-underline-offset: 8px;;
}

#block-kippdata-hauptnavigation ul.menu li {
  padding-top: 8px;
  padding-bottom: 8px;
}

#block-kippdata-hauptnavigation ul.menu li:last-child {
  text-align: center;
  background: var(--color-white);
  border-radius: 4px;
  border: 1px solid var(--color-red);
  padding-left:32px;
  padding-right:32px;
  text-decoration: none;
}
#block-kippdata-hauptnavigation ul.menu li:last-child a {
  color: var(--color-red);
}

/* special editor styles */

em.kippdata-redtext {
  color: var(--color-red);
  font-style: normal;
  font-family: OpenSans Bold, Arial, sans-serif;
}