:root {
  --accent-color: #0181c8;
  --accent-dk-color: #0067a0;
  --secondary-color: #5ad7c9;
  --secondary-lg-color: #eefbf9;
  --secondary-md-color: #cce5f4;
  --tertiary-color: #ff0000;
  --background-btn-lg-color: #f0f0f0;
  --text-color: #050b0a;
  --step--2: clamp(0.7813rem, 0.7747rem + 0.0326vw, 0.8rem);
  --step--1: clamp(0.9375rem, 0.9158rem + 0.1087vw, 1rem);
  --step-0: clamp(1.125rem, 1.0815rem + 0.2174vw, 1.25rem);
  --step-1: clamp(1.35rem, 1.2761rem + 0.3696vw, 1.5625rem);
  --step-2: clamp(1.62rem, 1.5041rem + 0.5793vw, 1.9531rem);
  --step-3: clamp(1.944rem, 1.771rem + 0.8651vw, 2.4414rem);
  --step-4: clamp(2.3328rem, 2.0827rem + 1.2504vw, 3.0518rem);
  --step-5: clamp(2.7994rem, 2.4462rem + 1.7658vw, 3.8147rem);
}
/* Fonts */
body {
  font-size: calc(15px + 0.5vw);
  line-height: calc(22px + 0.7vw);
  overflow-x: hidden;
}
@font-face {
  font-family: "Comfortaa Var";
  src: url("/assets/fonts/Comfortaa/Comfortaa-VariableFont_wght.ttf")
    format("truetype");
}
@font-face {
  font-family: "Comfortaa Regular";
  src: url("/assets/fonts/Comfortaa/Comfortaa-Regular.ttf") format("truetype");
}
@font-face {
  font-family: "OpenSans Regular";
  src: url("/assets/fonts/OpenSans/OpenSans-Regular.ttf") format("truetype");
}
@font-face {
  font-family: "OpenSans Bold";
  src: url("/assets/fonts/OpenSans/OpenSans-Bold.ttf") format("truetype");
}
h1 {
  font-family: Comfortaa Regular, sans-serif;
  font-size: 3rem;
  line-height: 3.2rem;
  color: var(--headline-color);
  text-align: left;
}
h2 {
  font-family: Comfortaa Regular, sans-serif;
  font-size: 2.6rem;
  line-height: 2.8rem;
  color: var(--headline-color);
  text-align: left;
}
h3 {
  font-family: Comfortaa Regular, sans-serif;
  font-size: 1.8rem;
  line-height: 2.2rem;
  color: var(--headline-color);
}
h3.cs-blurb-h3 {
  font-family: Comfortaa Var, sans-serif;
  text-align: center;
  font-weight: 700;
  font-size: 1.3rem;
  color: var(--text-color);
}
@media all and (max-width: 767px) {
  h1,
  h2 {
    font-size: 1.6rem;
    line-height: 1.9rem;
  }
  h3 {
    font-size: 1.2rem;
    line-height: 1.4rem;
  }
}

h4 {
  font-family: Comfortaa Var, sans-serif;
  font-size: 1.25rem;
  line-height: 1.8rem;
  font-weight: 700;
  color: var(--headline-color);
  text-align: left !important;
}
h4.et_pb_module_header {
  font-family: Comfortaa Var, sans-serif;
  font-weight: 700;
  font-size: 1.3rem;
  color: var(--text-color);
}
p,
a,
li {
  font-family: OpenSans Regular, sans-serif;
  font-size: 1.1rem;
  line-height: 1.65rem;
  color: var(--text-color);
  text-align: left;
}
a.cs-footer-menu {
  font-family: OpenSans Regular, sans-serif;
  font-size: 0.9rem;
  line-height: 1.65rem;
  color: var(--text-color) !important;
  text-align: left;
}
a.cs-footer-menu:hover {
  font-family: OpenSans Regular, sans-serif;
  font-size: 0.9rem;
  line-height: 1.65rem;
  color: var(--accent-color) !important;
  text-align: left;
}
.cs-kicker p {
  font-family: OpenSans Medium, sans-serif;
  font-size: 1.25rem;
  line-height: 1.85rem;
  color: var(--accent-dk-color);
}
.cs-listing p,
.cs-listing li {
  text-align: left;
}
/* Buttons */
.cs-cta-main {
  font-family: OpenSans Regular, sans-serif;
  color: white;
  background: var(--accent-color);
  border: 1px solid var(--accent-color);
  border-radius: 100px;
}
.cs-cta-secondary {
  font-family: OpenSans Regular, sans-serif;
  color: var(--text-color);
  background: white;
  border: 1px solid #4da6d8;
  border-radius: 100px;
}
.cs-cta-aid {
  font-family: OpenSans Regular, sans-serif;
  color: white;
  background: var(--tertiary-color);
  border: 1px solid var(--secondary-md-color);
  border-radius: 100px;
}
.cs-cta-main:hover {
  background: var(--secondary-color) !important;
  border: 1px solid var(--accent-color) !important;
}
.cs-cta-secondary:hover {
  background: var(--secondary-md-color) !important;
  border: 1px solid var(--secondary-md-color) !important;
}
.cs-cta-aid:hover {
  background: var(--accent-color) !important;
  border: 1px solid var(--accent-color) !important;
}
a.cs-cta-main,
a.cs-cta-secondary,
a.cs-cta-aid {
  font-size: 1rem;
  padding: 10px 24px;
}
a.cs-cta-main:hover,
a.cs-cta-secondary:hover,
a.cs-cta-aid:hover {
  font-size: 1rem;
  padding: 10px 24px !important;
  /* border: 0 !important; */
}
.cs-cta-main:after,
.cs-cta-secondary:after,
.cs-cta-aid:after {
  display: none !important;
}

/* End Buttons */
/* Footer */
.cs-footer-top {
  display: flex;
  justify-content: space-between;
  gap: 30px;
}
.cs-flex-4 {
  display: flex;
  justify-content: space-between;
}
@media all and (min-width: 768px) and (max-width: 980px) {
  .cs-footer-top {
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 4%;
  }
  .cs-footer-top-b1,
  .cs-footer-top-b2,
  .cs-footer-top-b3,
  .cs-footer-top-b4 {
    flex: 0 0 48%;
  }
  .cs-flex-4 {
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 4%;
  }
  .cs-flex-4-b1,
  .cs-flex-4-b2,
  .cs-flex-4-b3,
  .cs-flex-4-b4 {
    flex: 0 0 48%;
  }
}
@media all and (max-width: 767px) {
  .cs-footer-top {
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  .cs-footer-top-b1,
  .cs-footer-top-b2,
  .cs-footer-top-b3,
  .cs-footer-top-b4 {
    flex: 0 0 100%;
  }
  .cs-flex-4 {
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 40px;
  }
  .cs-flex-4-b1,
  .cs-flex-4-b2,
  .cs-flex-4-b3,
  .cs-flex-4-b4 {
    flex: 0 0 100%;
  }
}
.cs-footer-top h2 {
  font-family: OpenSans Bold, sans-serif;
  font-size: 1rem;
  line-height: 1.5rem;
  color: var(--accent-color);
  text-align: left;
  text-transform: uppercase;
  padding-bottom: 1rem;
}
.cs-footer-top p,
.cs-footer-top a {
  font-family: OpenSans Regular, sans-serif;
  font-size: 0.9rem;
  line-height: 1.35rem;
  color: var(--text-color);
  text-align: left;
}
.cs-footer-bottom-line p,
.cs-footer-bottom-line a {
  font-size: inherit !important;
  color: var(--text-color);
}
/* End Footer */
/* Tabstop */
.day1 {
  grid-area: day1;
  color: var(--tertiary-color);
}
.day2 {
  grid-area: day2;
  color: var(--tertiary-color);
}
.day3 {
  grid-area: day3;
  color: var(--tertiary-color);
}
.day4 {
  grid-area: day4;
  color: var(--tertiary-color);
}
.day5 {
  grid-area: day5;
  color: var(--tertiary-color);
}
.d1t1 {
  grid-area: d1t1;
}
.d1t2 {
  grid-area: d1t2;
}
.d2t1 {
  grid-area: d2t1;
}
.d2t2 {
  grid-area: d2t2;
}
.d3t1 {
  grid-area: d3t1;
}
.d4t1 {
  grid-area: d4t1;
}
.d4t2 {
  grid-area: d4t2;
}
.d5t1 {
  grid-area: d5t1;
}
.opening-hours {
  display: grid;
  grid-template-columns: 30px 1fr 1fr;
  gap: 0.9rem 12px;
  grid-template-areas:
    "day1 d1t1 d1t2"
    "day2 d2t1 ."
    "day3 d3t1 ."
    "day4 d4t1 d4t2"
    "day5 d5t1 .";
  font-family: OpenSans Regular, sans-serif;
  font-size: 0.9rem;
  line-height: 1.35rem;
  color: var(--text-color);
  text-align: left;
}

@media (max-width: 600px) {
  .times {
    grid-template-columns: 1fr;
  }
}
/* End Tabstop */
/* Benefits */
.cs-benefits1 {
  grid-area: cs-benefits1;
}
.cs-benefits2 {
  grid-area: cs-benefits2;
}
.cs-benefits3 {
  grid-area: cs-benefits3;
}
.cs-benefits1 h3,
.cs-benefits2 h3,
.cs-benefits3 h3 {
  font-family: OpenSans Medium, sans-serif;
  font-size: 1.25rem;
  line-height: 1.85rem;
  color: var(--text-color);
}
.cs-benefits1 p,
.cs-benefits2 p,
.cs-benefits3 p {
  padding-bottom: 0;
}
.cs-benefits1 img,
.cs-benefits2 img,
.cs-benefits3 img {
  width: 48px;
}
.cs-benefits-wrapper-1 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.9rem 25px;
  grid-template-areas: "cs-benefits1 .";
  margin-top: 20px;
}
.cs-benefits-wrapper-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.9rem 25px;
  grid-template-areas: "cs-benefits1 cs-benefits2";
  margin-top: 20px;
}
.cs-benefits-wrapper-3 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.9rem 25px;
  grid-template-areas:
    "cs-benefits1 cs-benefits2"
    "cs-benefits3 .";
  margin-top: 20px;
}
/* End Benefits */
/* Infobox */
.cs-infobox-wrapper img {
  width: 6rem !important;
}
@media (max-width: 980px) {
  .cs-infobox-wrapper img {
    width: 3rem !important;
  }
}
.cs-infobox-wrapper span.et_pb_image_wrap.et_pb_only_image_mode_wrap {
  text-align: left;
}
.cs-infobox-wrapper h4.et_pb_module_header span {
  font-family: Comfortaa Regular, sans-serif;
  font-size: 2rem;
  color: white;
}
.cs-infobox-wrapper div.et_pb_blurb_description p,
.cs-infobox-wrapper div.et_pb_blurb_description a {
  font-family: OpenSans Regular, sans-serif;
  font-size: 1.1rem;
  color: white;
}
.cs-infobox-wrapper {
  width: calc(100% / 4);
}
div.cs-infobox-wrapper {
  margin-bottom: 0 !important;
}
/* End Infobox */
/* Textausrichtung */
.cs-center p,
.cs-center h2,
.cs-center h3,
.cs-center h4.et_pb_module_header,
.cs-center h4.et_pb_module_header span {
  text-align: center !important;
}
/* End Textausrichtung */
/* Bilder */
.cs-border img {
  border-radius: 16px;
}
/* End Bilder */
/* Flex Spalten */
.cs-flex-column {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}
.cs-blurb-content-pd .et_pb_blurb_container {
  padding-left: 15px;
  padding-right: 15px;
}
/* End Flex Spalten */
/* Flex Reverse */
@media all and (max-width: 980px) {
  .cs-m-flexr {
    display: flex;
    flex-direction: column-reverse;
    row-gap: 30px;
  }
}
/* End Flex Reverse */
/* To Top Button */
/* Default button appearance */
.et_pb_scroll_top::before {
  content: url("../../wp-content/uploads/2025/05/up-arrow-alt.svg");
  display: block;
  width: 26px;
  padding: 2px 4px;
}
.et_pb_scroll_top.et-pb-icon {
  right: 30px; /* space from right */
  bottom: 30px; /* space from bottom */
  padding: 8px; /*padding size*/
  border-radius: 12px; /* make the circle */
  border: 1px solid var(--accent-color); /* border */
  background: white /* button color */;
  font-size: 32px; /* icon size */
  transition: all 0.1s ease-in-out; /* add transition */
}
/* Button Appearance on Mouseover */
.et_pb_scroll_top.et-pb-icon:hover {
  bottom: 32px /* space from bottom */;
  background: var(--primary-color) /*button hover color*/;
  transition: all 0.1s ease-in-out; /*add transition*/
  box-shadow: 0 10px 15px #162c4e4a; /*box shadow on hover*/
}
/* Animation tweaks */
.et_pb_scroll_top.et-visible {
  -webkit-animation: fadeInBottom 1s 1 cubic-bezier(0.5, 0, 0.16, 1);
  -moz-animation: fadeInBottom 2s 1 cubic-bezier(0.5, 0, 0.16, 1);
  -o-animation: fadeInBottom 1s 1 cubic-bezier(0.5, 0, 0.16, 1);
  animation: fadeInBottom 1s 1 cubic-bezier(0.5, 0, 0.16, 1);
}
.et_pb_scroll_top.et-hidden {
  opacity: 0;
  -webkit-animation: fadeOutBottom 1s 1 cubic-bezier(0.77, 0, 0.175, 1);
  -moz-animation: fadeOutBottom 1s 1 cubic-bezier(0.77, 0, 0.175, 1);
  -o-animation: fadeOutBottom 1s 1 cubic-bezier(0.77, 0, 0.175, 1);
  animation: fadeOutBottom 1s 1 cubic-bezier(0.77, 0, 0.175, 1);
}
/* End To Top Button */
/* Formular Kontakt */
/* Allgemeines Layout */
.cf7-form-wrapper {
  max-width: 100%;
  margin: 0 auto;
  font-family: sans-serif;
}
.cf7-flex-2 > p {
  display: flex;
  justify-content: space-between;
  gap: 20px;
}
@media (max-width: 980px) {
  .cf7-flex-2 > p {
    flex-direction: column !important;
  }
  div.cs-flex-col-2 {
    flex-direction: column !important;
    gap: 0 !important;
  }
  div.custom-upload-wrapper {
    flex-direction: column !important;
    gap: 0 !important;
  }
}
.row.cs-flex-col-2 .column {
  width: 100%;
}
select.wpcf7-form-control {
  background: var(--secondary-lg-color);
  border: 1px solid var(--accent-color);
  border-radius: 6px;
  padding-left: 8px;
  height: 40px;
  width: 100%;
}
.cf7-label {
  font-family: OpenSans Regular, sans-serif;
  font-size: 1rem;
  text-align: left;
  display: block;
  font-weight: bold;
  color: var(--text-color);
  margin-top: 20px;
  margin-bottom: -12px;
  padding-bottom: 0;
}

.cf7-row {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  margin-bottom: 15px;
}

.cf7-half {
  flex: 1 1 48%;
}

.cf7-full {
  flex: 1 1 100%;
}
.cf7-form-wrapper input {
  font-family: OpenSans Regular, sans-serif;
  font-size: 1rem;
  background: var(--secondary-lg-color);
  border: 1px solid var(--accent-color);
  border-radius: 6px;
  padding-left: 8px;
  height: 40px;
  width: 100%;
}
span.wpcf7-form-control-wrap,
.custom-upload-wrapper p {
  width: 100%;
}
.cf7-row > p {
  width: 100%;
}
.cf7-input,
.cf7-textarea,
.wpcf7-select,
.wpcf7-file,
.wpcf7-date,
.wpcf7-email {
  width: 100%;
  padding: 10px;
  border: 1px solid var(--accent-color);
  border-radius: 6px;
  color: var(--accent-color);
  background: var(--secondary-lg-color);
  font-size: 16px;
  box-sizing: border-box;
  padding-top: 2px;
  padding-bottom: 2px;
}

.cf7-input::placeholder,
.cf7-textarea::placeholder {
  color: var(--accent-color);
  background: var(--secondary-lg-color);
  opacity: 1;
}
input.wpcf7-file {
  color: var(--accent-color);
  padding-top: 8px;
}
.cf7-textarea {
  height: 150px;
  resize: vertical;
}

.cf7-icon-row {
  position: relative;
}

.cf7-icon-envelope {
  position: absolute;
  left: 10px;
  top: 50%;
  font-size: 18px;
  color: var(--accent-color);
  z-index: 9;
  pointer-events: none;
}
.cf7-icon-phone {
  position: absolute;
  left: 10px;
  top: 50%;
  font-size: 18px;
  color: var(--accent-color);
  z-index: 9;
  pointer-events: none;
}

.cf7-icon-row .cf7-input {
  padding-left: 30px;
}

.cf7-rechtstext {
  font-size: 1rem;
  color: var(--text-color);
  margin: 20px 0 10px;
}

.cf7-button-wrapper > p {
  text-align: center;
}

input.cf7-submit {
  font-family: OpenSans Regular, sans-serif;
  font-size: 1rem;
  color: white;
  background: var(--accent-color);
  border: 1px solid var(--accent-color);
  border-radius: 100px;
  padding: 10px 24px;
  cursor: pointer;
  width: auto;
  height: auto;
  transition: background-color 0.2s ease;
}
p.cf7-rechtstext {
  text-align: left;
}
.cf7-submit:hover {
  background: var(--secondary-color) !important;
  border: 1px solid var(--accent-color) !important;
}
div.cs-flex-col-2 {
  display: flex;
  justify-content: space-between;
  gap: 40px;
}
/*** Upload ***/
.custom-upload-wrapper {
  display: flex;
  gap: 40px;
  width: 100%;
}

.upload-field {
  position: relative;
  width: 100%;
  padding: 10px;
  border: 2px dashed #ccc;
  border-radius: 6px;
  background-color: #f9f9f9;
  color: #555;
  text-align: left;
  font-size: 14px;
  cursor: pointer;
  box-sizing: border-box;
}

.upload-field::after {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  width: 20px;
  height: 20px;
  transform: translateY(-50%);
  background-image: url("/wp-content/uploads/2025/06/upload.svg"); /* <– Pfad ggf. anpassen */
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
}

.wpcf7 input[type="file"].upload-field::file-selector-button {
  display: none; /* versteckt den Standard-Button */
}

.wpcf7 input[type="file"].upload-field {
  padding-right: 40px; /* Platz für das Icon */
}
/*** End Upload ***/
/* End Formular Kontakt */
/* Bilder anzeigen bei aktivem OpenStreetMap Plugin */
.et-waypoint:not(.et_pb_counters) {
  opacity: 1 !important;
}
/* End Bilder anzeigen bei aktivem OpenStreetMap Plugin */
/* Banner Startseite */
h2.cs-banner {
  color: white;
  text-transform: uppercase;
}
p.cs-banner,
p.cs-banner a {
  color: white;
}
p.cs-banner span,
p.cs-banner span a {
  font-size: 1.5rem;
}
div.cs-banner > div {
  color: white;
}
/* End Banner Startseite */
/* Mobiles Menu */
/*changing the Divi hamburger menu to X*/
.mobile_nav.opened .mobile_menu_bar:before {
  content: "\4d";
}
/*rotating the Divi Menu icon*/

.mobile_menu_bar:before {
  transition: all 0.4s ease;
  transform: rotate(0deg);
  display: block;
}

/*rotate the Divi Menu icon on click*/

.mobile_nav.opened .mobile_menu_bar::before {
  transition: all 0.4s ease;
  transform: rotate(90deg);
  display: block;
}

/* Remove the top line in the mobile menu*/
.et_mobile_menu {
  border-top: 0;
}

/*making the Divi Menu full width*/
.et_pb_menu .et_mobile_menu {
  min-width: 105vw;
  padding-top: 5% !important;
  margin-left: -85vw;
  margin-top: 25px;
}

/*removing the line from the menu items and adding line height*/

.et_mobile_menu li a {
  padding: 10px 20px !important;
  border-bottom: 1px solid var(--secondary-color) !important;
}

/*removing padding of the social media icons*/
.et_mobile_menu li li {
  padding-left: 0% !important;
}
#mobile_menu2 > li:nth-child(odd) > a {
  background: var(--quaternary-color);
}
@media (max-width: 980px) {
  .et_pb_menu .et_mobile_menu,
  .et_pb_menu .et_mobile_menu ul {
    text-align: center;
  }
}
/* End Mobiles Menu */
/* Popup */
.pum-theme-841,
.pum-theme-content-only {
  background-color: rgba(238, 251, 249, 0.9);
}
.pum-theme-861,
.pum-theme-content-only {
  background-color: rgba(238, 251, 249, 0.9);
}
.pum-theme-841 .pum-content + .pum-close,
.pum-theme-content-only .pum-content + .pum-close {
  position: absolute;
  height: 25px;
  width: 25px;
  font-size: 40px;
}
.pum-theme-861 .pum-content + .pum-close,
.pum-theme-content-only .pum-content + .pum-close {
  position: absolute;
  height: 25px;
  width: 25px;
  font-size: 40px;
}

/* End Popup */