/*
 Theme Name:   Firmament Theme
 Description:  Firmament WordPress Theme
 Author:	   Vanderlicht
 Author URI:   https://vanderlicht.de
 Version:      1.0.0
 Text Domain:  firmament

*/
/**	____________________________________________________________
 *
 *	INHALTE
 *
 *
 *	01 — BASICS
 *	02 — TYPO
 *	03 — GRID
 *	04 — HEADER, FOOTER & MENÜS
 *	05 — UX ELEMENTE
 *	06 — SEITEN
 *	07 — BLÖCKE
 *	08 — RESPONSIVE
 *
 *	____________________________________________________________
*/

/**
 *	00 — TMP
 *	Temporäre Settings
 *	____________________________________________________________
*/

body {
  color: var(--cl-weiss-1);
  background-color: var(--cl-gruen-1);
}
.page-id-3 h2,
.page-id-3 h3,
.page-id-3 p,
.page-id-3 ul,
.page-id-28 h2,
.page-id-28 h3,
.page-id-28 p,
.page-id-28 ul {
  max-width: 1024px;
}
.home-link {
  margin-bottom: var(--6em);
  text-decoration: underline;
}
p + h2,
p + h3 {
  margin-top: 2em;
}

.page-id-3 .main-content,
.page-id-28 .main-content {
  padding: var(--6em);
}

/* STÖRER */

.stoerer {
  position: fixed;
  bottom: 0px;
  right: 0px;
  z-index: 4;
  display: flex;
  cursor: pointer;
  background-color: var(--cl-rosa-1);
  transition: transform 0.3s;
}
.stoerer-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--6em);
  height: var(--6em);
  background-color: rgba(0, 0, 0, 0.1);
}
.stoerer-text {
  display: flex;
  align-items: center;
  padding: 0px var(--1em);
  color: var(--cl-schwarz-1);
}
.stoerer.scrolling {
  transform: translateX(calc(100% - var(--6em)));
}

/**
 *	01 — BASICS
 *	Basiselemente
 *	____________________________________________________________
*/

*,
:before,
:after {
  box-sizing: border-box;
}
html {
  font-family: sans-serif;
  line-height: 1;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  scroll-snap-type: y mandatory;
  scroll-behavior: smooth;
}
body {
  position: relative;
  margin: 0;
  line-height: 1;
  -webkit-text-size-adjust: 100%;
  overflow-x: hidden;
}
a {
  color: inherit;
  text-decoration: none;
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
}
a,
a:active,
a:hover {
  text-decoration: none;
  outline: 0;
  outline-width: 0;
}
p a {
  text-decoration: underline;
}
:focus {
  outline: none;
}
svg {
  transform: translate(0, 0);
  line-height: 1em;
}
img,
svg,
video {
  display: block;
  border: 0 none;
  max-width: 100%;
  height: auto;
}
/* Safari Fix */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  _::-webkit-full-page-media,
  _:future,
  :root,
  img {
    align-self: center;
  }
}
::-moz-selection {
  color: var(--cl-weiss-1);
  background: var(--cl-schwarz-1);
}
::selection {
  color: var(--cl-weiss-1);
  background: var(--cl-schwarz-1);
}

/**
 *	02 — TYPO, COLORS & ICONS
 *	Schrift- und Farbsettings
 *	____________________________________________________________
*/

/*--- FARBEN ---*/

/* CD Farben */

:root {
  /* Std. */
  --cl-schwarz-1: rgb(0, 0, 0);
  --cl-weiss-1: rgb(255, 255, 255);

  /* Corporate */
  --cl-gruen-1: rgb(123, 119, 77);
  --cl-gruen-2: rgb(179, 167, 92);
  --cl-taupe-1: rgb(130, 99, 100);
  --cl-taupe-2: rgb(180, 160, 162);
  --cl-beige-1: rgb(236, 231, 219);
  --cl-rosa-1: rgb(252, 226, 228);
}

/* Background Farben */

.opt-bg-cl-schwarz-1 {
  background-color: var(--cl-schwarz-1);
}
.opt-bg-cl-weiss-1 {
  background-color: var(--cl-weiss-1);
}
.opt-bg-cl-gruen-1 {
  background-color: var(--cl-gruen-1);
}
.opt-bg-cl-gruen-2 {
  background-color: var(--cl-gruen-2);
}
.opt-bg-cl-taupe-1 {
  background-color: var(--cl-taupe-1);
}
.opt-bg-cl-beige-1 {
  background-color: var(--cl-beige-1);
}

/* Text Farben */

.f-cl-schwarz-1 {
  color: var(--cl-schwarz-1);
}
.f-cl-weiss-1 {
  color: var(--cl-weiss-1);
}
.f-cl-gruen-1 {
  color: var(--cl-gruen-1);
}

/*  SVG */

/* SVG Farben */

svg.fill {
  fill: var(--cl-schwarz-1);
}

.fill.opt-color-weiss {
  fill: var(--cl-weiss-1);
}
.fill.opt-color-schwarz {
  fill: var(--cl-schwarz-1);
}
.fill.opt-color-gruen {
  fill: var(--cl-gruen-1);
}

.stroke.opt-color-weiss {
  stroke: var(--cl-weiss-1);
}
.stroke.opt-color-schwarz {
  stroke: var(--cl-schwarz-1);
}

/* SVG Formen */

.stroke {
  fill: none;
  stroke-miterlimit: 0;
  stroke-width: 1px;
}

/* SCHRIFT */

@font-face {
  font-family: "roboto-flex";
  font-style: normal;
  font-display: swap;
  font-weight: 100 1000;
  src: url("fonts/roboto-flex_5.0.12_latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
    U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "ppeiko";
  font-style: normal;
  font-weight: 500;
  src: url("fonts/ppeiko-medium.woff2") format("woff2");
}

body {
  font-family: "roboto-flex";
  font-weight: 350;
  line-height: 1.2em;
  letter-spacing: 0.04em;
}

/* Size Settings */

:root {
  --body-l: 20; /* px */
  --body-s: 16;

  --h1-l: 3; /* em */
  --h1-s: 1.5;

  --h1: 3;
  --h2: 2;
  --h3: 1.667;
  --h4: 1.25;
  --h5: 1.125;

  --rate: calc(
    (var(--h1-l) - 1) / (var(--h1-s) - 1)
  ); /* Vorgegeben durch H1-Verhältnis: Desktop (H1l) 6em, Mobile (H1s) 3em -> Bei H1l wird der Bodytext um 5em vergrößert, Mobile um 2em -> Daraus Verhältnis 5/2 */
}

:root {
  --v-bd: calc(
    1px * var(--body-s) + (var(--body-l) - var(--body-s)) *
      ((100vw - 320px) / 1120)
  );
  --v-h1: calc(
    ((1 + ((var(--h1) - 1) / var(--rate))) * var(--body-s) * 1px) +
      (
        var(--h1) * var(--body-l) -
          ((1 + ((var(--h1) - 1) / var(--rate))) * var(--body-s))
      ) * ((100vw - 320px) / 1120)
  );
  --v-h2: calc(
    ((1 + ((var(--h2) - 1) / var(--rate))) * var(--body-s) * 1px) +
      (
        var(--h2) * var(--body-l) -
          ((1 + ((var(--h2) - 1) / var(--rate))) * var(--body-s))
      ) * ((100vw - 320px) / 1120)
  );
  --v-h3: calc(
    ((1 + ((var(--h3) - 1) / var(--rate))) * var(--body-s) * 1px) +
      (
        var(--h3) * var(--body-l) -
          ((1 + ((var(--h3) - 1) / var(--rate))) * var(--body-s))
      ) * ((100vw - 320px) / 1120)
  );
}
body {
  font-size: var(--v-bd);
}

@media screen and (min-width: 1440px) {
  :root {
    --v-bd: calc(var(--body-l) * 1px);
    --v-h1: calc(var(--h1) * 1em);
    --v-h2: calc(var(--h2) * 1em);
    --v-h3: calc(var(--h3) * 1em);
  }
}

h1,
.f-h1 {
  font-size: var(--v-h1);
}
h2,
.f-h2 {
  font-size: var(--v-h2);
}
h3,
.f-h3 {
  font-size: var(--v-h3);
}

/* Heading Settings */

h0,
h1,
h2,
h3,
h4,
h5,
.f-h0,
.f-h1,
.f-h2,
.f-h3,
.f-h4,
.f-h5 {
  margin: 0.5em 0em 0.667em 0em;
  font-weight: 350;
  line-height: 1.2333em;
}
h0:first-child,
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
.f-h0:first-child,
.f-h1:first-child,
.f-h2:first-child,
.f-h3:first-child,
.f-h4:first-child {
  margin-top: 0;
}
h0:first-child,
h1:last-child,
h2:last-child,
h3:last-child,
h4:last-child,
.f-h0:first-child,
.f-h1:last-child,
.f-h2:last-child,
.f-h3:last-child,
.f-h4:last-child {
  margin-bottom: 0;
}

/* Individual Settings */

h1,
.f-h1 {
  text-transform: uppercase;
}
h2,
.f-h2 {
}
h3,
.f-h3 {
}
h4,
.f-h4 {
}
h5,
.f-h5 {
}

/* Paragraphs */

p {
  margin: 0 0 1.333em;
}

/* Styles */

.f-std {
  font-size: 1em;
  line-height: 1.333em;
}
.f-s1 {
  text-transform: uppercase;
}
.f-s2 {
  font-size: 1.667em;
  line-height: 1.12em;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
.f-s3 {
}
.f-s4,
.f-s5,
.f-s6,
.f-s7 {
  font-family: "ppeiko";
  font-weight: 500;
  letter-spacing: 0;
}
.f-s5 {
  font-size: 2em;
  line-height: 1em;
}
.f-s4 {
  text-transform: lowercase;
}
.f-s6 {
  font-size: 4em;
  line-height: 1em;
  text-transform: lowercase;
}
.f-s7 {
  font-size: 6em;
  line-height: 1em;
  text-transform: lowercase;
}
.marker {
  display: inline-block;
  background-color: var(--cl-rosa-1);
  color: var(--cl-schwarz-1);
  padding: 0.125em 0.25em;
}

/* Sonstiges */

p:last-child,
ul:last-child,
li:last-child,
ol:last-child {
  margin-bottom: 0;
}

b,
strong {
  font-weight: 600;
}
i {
  font-style: normal;
  font-family: "fragment-serif", serif;
}
ul,
ol {
  margin: 0 0 2.1em;
  padding: 0;
  list-style: none;
}
ul:not(.list-clear):not(.list):not(.menu) li {
  position: relative;
  padding: 0px 0px 1.2em 1.8em;
}
ul:not(.list-clear):not(.list):not(.menu) li:after {
  content: "•";
  position: absolute;
  left: 0px;
  top: 0.05em;
  font-weight: 600;
  font-size: 1.5em;
}

/* BUTTONS & LINKS */

/*-- Browser Fix --*/

a,
.button:focus,
button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus {
  outline: none;
}
button {
  font-family: "roboto-flex";
  font-size: inherit;
  font-weight: 600;
  background-color: transparent;
  border: none;
  cursor: pointer;
}
button::-moz-focus-inner {
  border: 0;
  outline: none;
}

/*-- Std. --*/

.btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: calc(var(--6em) * 2);
  height: var(--3em);
  padding: var(--0-5em) var(--2em);
  font-weight: 600;
  overflow: hidden;
  cursor: pointer;
}

/*-- Colors --*/

.btn.btn-cl-taupe-1 {
  background-color: var(--cl-taupe-1);
  color: var(--cl-weiss-1);
}
.btn.btn-cl-taupe-2 {
  background-color: var(--cl-taupe-2);
  color: var(--cl-weiss-1);
}

/*-- Hover --*/

.btn:hover {
  opacity: 0.9;
}

/*-- Grid --*/

.btn-wrapper {
  display: flex;
  align-items: center;
}
.btn-wrapper .btn {
  flex: 1 1 auto;
}
.btn-wrapper .btn:not(:last-child) {
  margin-right: var(--1em);
}

/* ICONS */

.icon-plus,
.icon-x {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--3em);
  height: var(--3em);
}
.icon-plus div,
.icon-x div {
  position: absolute;
  width: 100%;
  height: 0%;
}
.icon-plus div,
.icon-x div {
  border-top: 2px solid var(--cl-schwarz-safe);
}
.icon-plus div:nth-child(2),
.icon-x div:nth-child(2) {
  transform: rotate(90deg);
}
.icon-x {
  transform: rotate(45deg);
}

/**
 *	03 — GRID
 *	Flexbox, Abstände
 *	____________________________________________________________
*/

/*-- Units --*/

:root {
  /* Std. Einheit */
  --1em: 10px;
  --0-25em: calc(var(--1em) * 0.25);
  --0-5em: calc(var(--1em) * 0.5);
  --1-5em: calc(var(--1em) * 1.5);
  --2em: calc(var(--1em) * 2);
  --3em: calc(var(--1em) * 3);
  --4em: calc(var(--1em) * 4);
  --5em: calc(var(--1em) * 5);
  --6em: calc(var(--1em) * 6);
  --8em: calc(var(--1em) * 8);
  --9em: calc(var(--1em) * 9);
  --12em: calc(var(--1em) * 12);
  --18em: calc(var(--1em) * 18);
}

@media screen and (min-width: 1024px) {
  :root {
    /* Std. Einheit */
    --1em: 0.977vw;
  }
}
@media screen and (min-width: 2048px) {
  :root {
    /* Std. Einheit */
    --1em: 20px;
  }
}

/*-- Sections --*/

/*-- Gaps --*/

body {
}

.main-header,
.main-nav,
.block,
.main-footer {
  padding-left: var(--3em);
  padding-right: var(--3em);
}

.opt-gap-top-0 {
  padding-top: 0px;
}
.opt-gap-top-1 {
  padding-top: var(--1-5em);
}
.opt-gap-top-2 {
  padding-top: var(--3em);
}
.opt-gap-top-3 {
  padding-top: var(--6em);
}
.opt-gap-bottom-0 {
  padding-bottom: 0px;
}
.opt-gap-bottom-1 {
  padding-bottom: var(--1-5em);
}
.opt-gap-bottom-2 {
  padding-bottom: var(--3em);
}
.opt-gap-bottom-3 {
  padding-bottom: var(--6em);
}

.block-fw,
.block-fw-gap {
  width: calc(100% + var(--6em));
  margin-left: calc(var(--1em) * -3);
}
.block-fw-gap {
  padding-left: var(--3em);
  padding-right: var(--3em);
}

/* Wrapper */

.wrapper {
  width: 100%;
  margin: 0 auto;
}

.wrapper-2048 {
  max-width: 2048px;
}
.wrapper-1536 {
  max-width: 1536px;
}
.wrapper-1024 {
  max-width: 1024px;
}
.wrapper-512 {
  max-width: 512px;
}

.wrapper-p50 {
  max-width: 50%;
}

/* Image Crop */

.crop-el img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.crop-el.crop-top img {
  object-position: top;
}
.crop-2-3 {
  aspect-ratio: 2 / 3;
}
.crop-3-4 {
  aspect-ratio: 3 / 4;
}
.crop-1-1 {
  aspect-ratio: 1 / 1;
}
.crop-3-2 {
  aspect-ratio: 3 / 2;
}
.crop-16-9 {
  aspect-ratio: 16 / 9;
}
.crop-2-1 {
  aspect-ratio: 2 / 1;
}
.crop-3-1 {
  aspect-ratio: 3 / 1;
}

/* Image Hov Zoom */

.img-hov-e {
  overflow: hidden;
}
.img-hov-e img {
  transform: scale(1);
  transform-origin: center;
  transition: transform 0.3s;
}
.img-hov:hover .img-hov-e img {
  transform: scale(1.025);
}

/**
 *	04 — HEADER, FOOTER & NAVI
 *	Header, Footer, Layer, Meüs, etc.
 *	____________________________________________________________
*/

/* HEADER */

.main-header {
  z-index: 2;
  width: 100%;
}

.logo-bar {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: var(--2em) 0px var(--0-5em);
}
.main-nav {
  position: sticky;
  top: -1px;
  z-index: 3;
  margin-bottom: calc(var(--0-5em) * -1);
  padding-bottom: var(--0-5em);
  background-color: var(--cl-gruen-1);
  transform: translateY(0%);
  transition: transform 0.2s;
}
.main-nav.up {
  background-color: var(--cl-gruen-1);
  transform: translateY(-100%);
}
.nav-bar {
  display: flex;
  justify-content: center;
  width: 100%;
  border-top: 1px solid var(--cl-weiss-1);
  border-bottom: 1px solid var(--cl-weiss-1);
}

.menu-wrapper-1 {
  display: flex;
}
.menu-wrapper-1 li:not(:last-child) {
  margin-right: var(--3em);
}
/*.menu-item:hover,
.current-menu-item,
.menu-wrapper-1:hover .menu-item:hover,
.link:hover {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: .1em;
}*/
.menu-wrapper-1:hover .current-menu-item {
  text-decoration: none;
}
.menu-wrapper-2 li:not(:last-child) {
  margin-bottom: 0.25em;
}
.menu-wrapper-1 a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: var(--3em);
  padding: var(--0-5em);
  transition: color 0.2s, background-color 0.2s;
}
.menu-wrapper-1 a:hover {
  color: var(--cl-schwarz-1);
  background-color: var(--cl-rosa-1);
}
.opener,
.closer {
  cursor: pointer;
}

.menu-button {
  display: none;
}
/* LAYER */

.moving-layer {
  position: fixed;
  top: 0px;
  right: 0px;
  z-index: 4;
  width: 100%;
  padding: var(--1em);
  background-color: var(--cl-gruen-1);
  color: var(--cl-weiss-1);
  pointer-events: none;
  transform: translateY(-100%);
  transition: transform 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  height: 100%;
}
.moving-layer.active {
  pointer-events: auto;
  transform: translateY(0%);
}
.moving-layer-wrapper {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
}
.moving-layer-header,
.moving-layer-footer {
  flex: 1 1 auto;
  display: flex;
}
.moving-layer-content {
  flex: 1 1 100%;
  padding: var(--6em) 0px var(--1em);
  display: flex;
}
.moving-layer-header .slot {
  flex: 1 1 33.333%;
  display: flex;
  align-items: center;
}
.moving-layer-header .slot-1 {
  justify-content: flex-start;
}
.moving-layer-header .slot-2 {
  justify-content: center;
}
.moving-layer-header .slot-3 {
  justify-content: flex-end;
}
.moving-layer-footer {
  margin-top: auto;
  justify-content: center;
}
#menue-mobile li {
  font-size: 22px;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: var(--3em);
}
.menu-hauptmenue-container {
  margin: auto;
}
/* FOOTER */

.main-footer {
  color: var(--cl-weiss-1);
}
.footer-wrapper .row-1 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: var(--9em);
  padding: var(--1em) 0px;
}
.footer-wrapper .row-1 .col-1,
.footer-wrapper .row-1 .col-3 {
  flex: 0 0 25%;
}
.footer-wrapper .row-1 .col-2 {
  flex: 0 0 50%;
  text-align: center;
}

/**
 *	05 — UX ELEMENTE
 *	Layer, Popups und weitere UX Elemente
 *	____________________________________________________________
*/

/* LOGO */

/* LIST */

/* Style 01: Std. */

.list.st-01 li {
  display: flex;
  align-items: center;
  min-height: var(--3em);
  padding: var(--0-5em) 0px;
  border-top: 2px solid var(--cl-schwarz-1);
}
.list.st-01 li:last-child {
  border-bottom: 2px solid var(--cl-schwarz-1);
}
.list.st-01 li > span:first-child {
  text-align: left;
  margin-right: auto;
}
.list.st-01 li > span:last-child {
  text-align: right;
}

/* Style 02: Erweitert (2 Spalten) */

.list.st-02 li {
  display: flex;
  padding: 10px 0px;
  border-top: 2px solid var(--ux-gray-02);
}
.list.st-02 li span {
  flex: 0 0 50%;
}

/**
 *	06 — SECTIONS & SEITEN
 *	Startseite, Unterseiten, Blog, Singles
 *	____________________________________________________________
*/

/* HOME */

/* BLOG */

/**
 *	07 — BLÖCKE
 *	Module, bzw. WordPress Blöcke
 *	____________________________________________________________
*/

/* ALLG. */

/* Block Wrapper */

.block {
  position: relative;
  min-width: 100%;
}
.block-header {
  margin-bottom: var(--1-5em);
  padding-bottom: var(--0-5em);
  border-bottom: 1px solid var(--cl-weiss-1);
}
.block.f-cl-schwarz-1 .block-header {
  border-bottom: 1px solid var(--cl-schwarz-1);
}

/* INTRO */

.intro-wrapper {
}

/* Main */

.intro-1-wrapper .row-1 {
  display: flex;
  align-items: stretch;
}
.intro-1-wrapper .row-1 img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.intro-1-wrapper .row-1 .col-1 {
  flex: 1 1 calc(100% * 3 / 8);
  margin-right: var(--1-5em);
  padding-right: var(--1-5em);
  border-right: 1px solid var(--cl-weiss-1);
}
.intro-1-wrapper .row-1 .col-2 {
  flex: 1 1 calc(100% * 5 / 8);
}
.intro-1-wrapper .row-2 {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: var(--1-5em) 0px;
  margin: var(--1-5em) 0px;
  border-top: 1px solid var(--cl-weiss-1);
  border-bottom: 1px solid var(--cl-weiss-1);
}

/* Std. */

.intro-std-wrapper {
  margin-top: var(--6em);
}

/* Splash */

.splash-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: calc(100vh - var(--6em));
  color: var(--cl-weiss-1);
  background-color: var(--cl-gruen-1);
}
.splash-logo {
  width: 100%;
  max-width: 380px;
}
.splash-headline {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: calc(var(--1em) * 72);
  min-height: 6em;
  margin: var(--3em) auto var(--6em);
  padding: 0.5em 0em;
  text-align: center;
  border-top: 1px solid var(--cl-weiss-1);
  border-bottom: 1px solid var(--cl-weiss-1);
}

/* TEXT (STD.) */

.text-1-wrapper {
  padding: var(--3em) 0px;
  border-bottom: 1px solid var(--cl-weiss-1);
}
.block-header + .text-1-wrapper {
  margin-top: calc(var(--1-5em) * -1);
}
.block.f-cl-schwarz-1 .text-1-wrapper {
  border-bottom: 1px solid var(--cl-schwarz-1);
}
.text-1-wrapper .txt {
  max-width: 50%;
  margin: 0 auto;
}

/* TEXT (SPALTEN) */

.text-2-wrapper {
}
.txt-cols {
  display: flex;
}
.txt-cols .col {
  flex: 1 1 100%;
}
.txt-cols .col:not(:last-child) {
  margin-right: var(--1-5em);
  padding-right: var(--1-5em);
  border-right: 1px solid var(--cl-weiss-1);
}
.block.f-cl-schwarz-1 .txt-cols .col:not(:last-child) {
  border-right: 1px solid var(--cl-schwarz-1);
}

/* BILD 01 (FULL) */

.bild-1-wrapper {
}

/* BILDBANNER */

.block-bildbanner {
  position: relative;
  z-index: 1;
  width: 100%;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}
.bildbanner-wrapper {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  height: calc(var(--1em) * 42);
}
.bildbanner-textbox {
  padding: var(--3em) var(--1-5em);
  margin-bottom: calc(var(--1em) * -3);
  background-color: var(--cl-rosa-1);
  text-align: center;
  color: var(--cl-schwarz-1);
}
.bildbanner-header {
  padding: var(--3em) 0px;
  text-align: center;
}

/* BILD & TEXT 1 (STD.) */

.bt-1-wrapper {
  display: flex;
  padding-bottom: var(--1-5em);
  border-bottom: 1px solid var(--cl-weiss-1);
}
.bt-1-wrapper:first-child {
  padding-top: var(--1-5em);
  border-top: 1px solid var(--cl-weiss-1);
}
.block.f-cl-schwarz-1 .bt-1-wrapper {
  border-bottom: 1px solid var(--cl-schwarz-1);
}
.block.f-cl-schwarz-1 .bt-1-wrapper:first-child {
  border-top: 1px solid var(--cl-schwarz-1);
}
.bt-1-wrapper .col-1 {
  flex: 1 1 auto;
}
.bt-1-wrapper .col-1 {
  position: relative;
  flex: 1 1 calc(100% * 5 / 8);
  padding-top: var(--6em);
  padding-left: var(--6em);
}
.bt-1-wrapper img:first-child {
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: 0;
  width: calc(100% - var(--6em));
  height: calc(100% - var(--6em));
  object-fit: cover;
}
.bt-1-wrapper img:last-child {
  position: relative;
  z-index: 1;
  margin-left: auto;
}
.bt-1-wrapper .col-2 {
  flex: 1 1 calc(100% * 3 / 8);
  margin-left: var(--1-5em);
  padding-left: var(--1-5em);
  border-left: 1px solid var(--cl-weiss-1);
}
.block.f-cl-schwarz-1 .bt-1-wrapper .col-2 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-left: 1px solid var(--cl-schwarz-1);
}

/* BILD & TEXT 2 (SPALTEN) */

.bt-2-wrapper {
  display: flex;
}
.bt-2-wrapper .col-1 {
  flex: 0 0 calc(100% * 3 / 8);
}
.bt-2-wrapper .col-2 {
  flex: 0 0 calc(100% * 6 / 8);
  display: flex;
  margin-left: calc(calc(100% * 1 / 8) * -1);
  padding-top: var(--6em);
}
.bt-2-wrapper .col-2 .text-wrapper,
.bt-2-wrapper .col-2 .bild-wrapper {
  flex: 0 0 50%;
}
.bt-2-wrapper .col-2 .text-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--3em);
  color: var(--cl-schwarz-1);
  background-color: rgba(255, 255, 255, 0.9);
}
.bt-2-wrapper .col-2 .text-wrapper h2 {
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--cl-schwarz-1);
}

/* BILD & TEXT 3 (LISTE) */

.bt-3-wrapper {
  display: flex;
  padding-bottom: var(--1-5em);
  border-bottom: 1px solid var(--cl-weiss-1);
}
.bt-3-wrapper:first-child {
  padding-top: var(--1-5em);
  border-top: 1px solid var(--cl-weiss-1);
}
.block.f-cl-schwarz-1 .bt-3-wrapper {
  border-bottom: 1px solid var(--cl-schwarz-1);
}
.block.f-cl-schwarz-1 .bt-3-wrapper:first-child {
  border-top: 1px solid var(--cl-schwarz-1);
}
.bt-3-wrapper .col-1 {
  flex: 1 1 auto;
}
.bt-3-wrapper .col-1 {
  position: relative;
  flex: 1 1 calc(100% * 5 / 8);
  padding-bottom: var(--6em);
  padding-left: var(--6em);
}
.bt-3-wrapper img:first-child {
  position: absolute;
  left: 0px;
  bottom: 0px;
  z-index: 0;
  width: calc(100% - var(--6em));
  height: calc(100% - var(--6em));
  object-fit: cover;
}
.bt-3-wrapper img:last-child {
  position: relative;
  z-index: 1;
  margin-left: auto;
}
.bt-3-wrapper .col-2 {
  flex: 1 1 calc(100% * 3 / 8);
  display: flex;
  flex-direction: column;
  margin-left: var(--1-5em);
  padding-left: var(--1-5em);
  border-left: 1px solid var(--cl-weiss-1);
}
.block.f-cl-schwarz-1 .bt-3-wrapper .col-2 {
  border-left: 1px solid var(--cl-schwarz-1);
}
.liste-1-entries {
  margin-top: auto;
}
.liste-1-entry {
  margin-top: var(--1em);
  padding-top: var(--1em);
  border-top: 1px solid var(--cl-weiss-1);
}
.block.f-cl-schwarz-1 .liste-1-entry {
  border-top: 1px solid var(--cl-schwarz-1);
}

/* LAGEKARTE */

.lagekarte-wrapper .row-1,
.lagekarte-wrapper .row-2 {
  display: flex;
}
.lagekarte-wrapper .row-1 {
  align-items: center;
  margin-bottom: var(--1-5em);
  padding-bottom: var(--1-5em);
  border-bottom: 1px solid var(--cl-weiss-1);
}
.block.f-cl-schwarz-1 .lagekarte-wrapper .row-1 {
  border-bottom: 1px solid var(--cl-schwarz-1);
}
.lagekarte-wrapper .row-1 .col-1,
.lagekarte-wrapper .row-2 .col-1 {
  flex: 0 0 calc(100% * 6 / 8);
  padding-right: var(--1-5em);
}
.lagekarte-wrapper .row-1 .col-2,
.lagekarte-wrapper .row-2 .col-2 {
  flex: 0 0 calc(100% * 2 / 8);
  padding-left: var(--1-5em);
}
.lagekarte-wrapper .row-2 .col-1 {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.lagekarte-wrapper .map-inner {
  width: 100%;
  aspect-ratio: 16/9;
  background-color: rgba(255, 255, 255, 0.333);
}
.acf-map {
  aspect-ratio: 16/9;
}
.lagekarte-wrapper .map-location {
  display: flex;
  align-items: center;
}
.lagekarte-wrapper .map-location svg {
  width: 14px;
  margin-right: var(--0-5em);
}
.map-location a {
  text-decoration: underline;
}
.entfernungstabelle-entry {
  display: flex;
  align-items: center;
  margin-top: var(--1em);
  padding-top: var(--1em);
  border-top: 1px solid var(--cl-weiss-1);
}
.block.f-cl-schwarz-1 .entfernungstabelle-entry {
  border-top: 1px solid var(--cl-schwarz-1);
}
.block.f-cl-schwarz-1 .entfernungstabelle-entry img {
  width: var(--3em);
  margin-right: var(--0-5em);
}

/* TABELLE */

.tabelle-1-wrapper {
  position: relative;
}
.tabelle-1-bild {
  position: absolute;
  top: 50%;
  right: 0px;
  transform: translateY(-50%);
  opacity: 0.25;
  width: calc(100% * 1 / 8);
}
.tabelle-1-entries {
  display: flex;
  flex-wrap: wrap;
  padding: var(--3em) 0px;
}
.tabelle-1-entry {
  flex: 0 0 33.333%;
  padding: var(--3em) 0px;
  border-bottom: 1px solid var(--cl-weiss-1);
}
.tabelle-1-entry .titel {
  position: relative;
  margin-bottom: var(--0-5em);
  padding-bottom: var(--1em);
}
.tabelle-1-entry .titel:after {
  content: "";
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: var(--6em);
  max-width: 100%;
  height: 0px;
  border-bottom: 1px solid var(--cl-weiss-1);
}
.block.f-cl-schwarz-1 .tabelle-1-entry {
  border-bottom: 1px solid var(--cl-schwarz-1);
}
.tabelle-1-entry:nth-last-child(-n + 3) {
  border-bottom: none;
}
.tabelle-1-subline {
  border-top: 1px solid var(--cl-weiss-1);
  padding-top: var(--1em);
  text-align: center;
}

/* KONTAKTDATEN */

.kontaktdaten-wrapper img {
  max-width: calc(var(--1em) * 9);
}
.bottom-line {
  margin-top: var(--1-5em);
  border-top: 1px solid var(--cl-weiss-1);
}
.block.f-cl-schwarz-1 .bottom-line {
  border-top: 1px solid var(--cl-schwarz-1);
}

/* SLIDER */

.slider-1-wrapper {
  display: flex;
}
.slider-1-wrapper .col {
  overflow: hidden;
}
.slider-1-wrapper .col-1 {
  flex: 0 0 calc(100% * 5 / 8);
  padding-right: var(--1-5em);
  border-right: 1px solid var(--cl-weiss-1);
}
.block.f-cl-schwarz-1 .slider-1-wrapper .col-1 {
  border-right: 1px solid var(--cl-schwarz-1);
}
.slider-1-wrapper .col-2 {
  flex: 0 0 calc(100% * 3 / 8);
  display: flex;
  flex-direction: column;
  padding-left: var(--1-5em);
}
.slider-1-wrapper .col-2 .text-wrapper {
  margin-bottom: auto;
}
.slider-1-wrapper .col-2 .slider-nav {
  margin: var(--1-5em) 0px;
}

.slider-1-subline {
  border-top: 1px solid var(--cl-schwarz-1);
  margin-top: var(--1em);
  padding-top: var(--1em);
  text-align: center;
}

/* SWIPER */

.slider-nav {
  display: flex;
  pointer-events: none;
}
.swiper-nav-element {
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(var(--1em) * 4);
  height: calc(var(--1em) * 4);
  cursor: pointer;
  pointer-events: all;
  border-radius: 50%;
  border: 1px solid var(--cl-weiss-1);
}
.block.f-cl-schwarz-1 .swiper-nav-element {
  border: 1px solid var(--cl-schwarz-1);
}

.swiper-container.reached-start .swiper-prev,
.swiper-container.reached-end .swiper-next {
  opacity: 0.25;
  pointer-events: none;
}

.swiper-prev {
  /* display: none; */
  margin-right: var(--3em);
}
.swiper-prev,
.swiper-next {
  opacity: 1;
  transition: opacity 0.4s;
}
.swiper.no-loop.reached-start .swiper-prev,
.swiper.no-loop.reached-end .swiper-next {
  opacity: 0.25;
  cursor: default;
}

/*.slider-1-wrapper .col-2 .bild-wrapper .swiper-wrapper {
	display: flex;
	align-items: stretch;
}
.slider-1-wrapper .col-2 .bild-wrapper .swiper-slide {
	height: auto;
	align-self: stretch;
}
.slider-1-wrapper .col-2 .bild-wrapper .swiper-slide img {
	min-height: 100%;
	object-fit: cover;
}*/

/* Style 01 */

.swiper-nav.st-01 {
  bottom: var(--2em);
  right: var(--2em);
  overflow: hidden;
  border-radius: var(--3em);
}
.block-slider-text-2-1 .swiper-nav.st-01,
.block-bild-text-slider-2-1 .swiper-nav.st-01 {
  left: var(--2em);
  right: unset;
}
.block-slider-text-2-1.opt-order-02 .swiper-nav.st-01,
.block-bild-text-slider-2-1.opt-order-02 .swiper-nav.st-01 {
  left: unset;
  right: var(--2em);
}

/* Style 02 */

.swiper-nav.st-02 {
  bottom: 50%;
  right: calc(var(--1em) * -1.5);
  transform: translateY(50%);
  width: calc(100% + var(--3em));
  border-radius: var(--3em);
}
.swiper-nav.st-02 .swiper-nav-element {
  border-radius: var(--3em);
}

.swiper-nav-element:hover svg {
  opacity: 0.5;
}

/* For Parallax */

.swiper-slide {
  overflow: hidden;
}

/**
 *	08 — RESPONSIVE
 *	Anpassung des Layouts für mobile Geräte
 *	____________________________________________________________
*/
@media (pointer: coarse) {
  .block-bildbanner {
    background-attachment: unset;
  }
}

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

@media screen and (max-width: 1440px) {
}

@media screen and (max-width: 1080px) {
  .bt-2-wrapper .col-1 {
    flex: 0 0 calc(100% * 1 / 4);
  }
  .bt-2-wrapper .col-2 {
    margin: 0px;
  }
  .bt-2-wrapper .col-2 .bild-wrapper {
    flex: 0 0 30%;
  }
  .bt-2-wrapper .col-2 .text-wrapper {
    flex: 0 0 70%;
  }
  .lagekarte-wrapper .row-1,
  .lagekarte-wrapper .row-2 {
    display: block;
  }
  .lagekarte-wrapper .row-1 .col-2,
  .lagekarte-wrapper .row-2 .col-2 {
    padding-left: 0px;
    padding-top: var(--3em);
  }
  .lagekarte-wrapper .row-1 .col-1,
  .lagekarte-wrapper .row-2 .col-1 {
    flex: 0 0 calc(100% * 6 / 8);
    padding-right: 0px;
  }
  .lagekarte-wrapper .map-location svg {
    width: 14px;
    margin-right: var(--0-5em);
    min-width: 14px;
  }
  .text-1-wrapper .txt {
    max-width: 75%;
  }
}

@media screen and (max-width: 960px) {
  .main-header,
  .main-nav,
  .block,
  .main-footer {
    padding-left: var(--1-5em);
    padding-right: var(--1-5em);
  }
  .tabelle-1-entry {
    flex: 0 0 50%;
  }
  .tabelle-1-entry:nth-last-child(-n + 2) {
    border-bottom: none !important;
  }
  .tabelle-1-entry:nth-last-child(-n + 3) {
    border-bottom: 1px solid var(--cl-weiss-1);
  }
  .tabelle-1-bild {
    width: calc(100% * 1 / 3);
  }
  .bt-3-wrapper .col-1,
  .bt-3-wrapper .col-2 {
    flex: 1 1 50%;
  }
  .bt-3-wrapper .col-1 {
    padding-left: var(--3em);
  }
}

@media screen and (max-width: 760px) {
  .main-nav {
    display: none;
  }
  .logo-bar {
    justify-content: flex-start;
    width: fit-content;
  }
  .main-header .wrapper {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }
  /* Menü Button */
  .menu-button {
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: 1;
    transform: translateY(0%);
    transition: transform 0s 0s, opacity 0.3s;
    position: fixed;
    right: var(--1-5em);
    z-index: 10;
    top: var(--1-5em);
    display: flex;
    background: #7b774d;
    height: 60px;
    width: 60px;
  }
  .menu-button rect {
    fill: #ffffff;
  }

  .menu-button .move {
    transform-origin: center center;
  }
  .menu-button .hide-01 {
    transform-origin: center left;
  }
  .menu-button .hide-02 {
    transform-origin: center right;
  }
  .menu-button .move,
  .menu-button.active .hide {
    transition: transform 0.3s;
  }
  .menu-button .hide,
  .menu-button.active .move {
    transition: transform 0.3s 0.3s;
  }
  .menu-button.active .hide {
    transform: scaleX(0);
  }
  .menu-button.active .move-01 {
    transform: rotate(135deg);
  }
  .menu-button.active .move-02 {
    transform: rotate(225deg);
  }
  .menu-button.hide {
    opacity: 0;
    transform: translateY(-100%);
    transition: transform 0s 0.3s, opacity 0.3s;
  }

  .bt-2-wrapper {
    display: block;
  }
  .slider-1-wrapper {
    display: block;
  }
  .slider-1-wrapper .col-1 {
    padding-right: 0px;
    border-right: 0px;
  }
  .slider-1-wrapper .col-2 {
    flex: 0 0 calc(100% * 3 / 8);
    display: flex;
    flex-direction: column;
    padding-left: 0px;
    padding-top: var(--2em);
  }
  .sw-multi-master {
    max-width: 480px;
    margin-left: 0px;
  }
  .sw-multi-slave img {
    max-width: 50%;
    margin-top: var(--1em);
  }
  .text-1-wrapper .txt {
    max-width: 100%;
  }

  .kontaktdaten-wrapper img {
    max-width: 50%;
  }
  .footer-wrapper .row-1 .col-2 {
    flex: 0 0 75%;
    text-align: right;
    padding-right: var(--1-5em);
  }
  .footer-wrapper .row-1 .col-3 {
    flex: 0 0 0%;
  }
  .footer-wrapper h1 {
    font-size: 9vw;
  }
}
@media screen and (max-width: 640px) {
  .bt-1-wrapper {
    display: block;
  }
  .col.col-2.bild-text {
    display: block;
  }
  .f-s7 {
    font-size: 16vw;
  }
  .bt-1-wrapper .col-2 {
    border-left: none !important;
    margin-left: 0px;
    padding-left: 0px;
    margin-top: var(--4em);
  }

  .btn-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: unset;
  }
  .btn-wrapper .btn:not(:last-child) {
    margin-right: 0px;
    margin-bottom: var(--1em);
  }
  .bt-3-wrapper {
    display: block;
    padding-bottom: var(--1-5em);
    border-bottom: 1px solid var(--cl-weiss-1);
  }
  .bt-3-wrapper .col-1 {
    padding-left: var(--6em);
  }
  .bt-3-wrapper .col-2 {
    margin-left: 0px;
    padding-left: 0px;
    border: none !important;
    margin-top: var(--2em);
  }
}
@media screen and (max-width: 540px) {
  .text-1-wrapper .txt {
    max-width: 100%;
    display: block;
  }
  .txt-cols .col:not(:last-child) {
    margin-right: 0px;
    padding-right: 0px;
    border-right: none;
    margin-bottom: var(--5em);
  }
}
@media screen and (max-width: 480px) {
  .tabelle-1-entry {
    flex: 0 0 100%;
  }
  .tabelle-1-entry:nth-last-child(-n + 2) {
    border-bottom: 1px solid var(--cl-weiss-1) !important;
  }
  .tabelle-1-entry:nth-last-child(-n + 3) {
    border-bottom: 1px solid var(--cl-weiss-1);
  }
  .tabelle-1-entry:last-child {
    border-bottom: none !important;
  }
  .tabelle-1-bild {
    width: calc(100% * 1 / 2);
  }
}

/** IE FIXES **/
@media screen\0, screen\9 {
  h1,
  h2,
  h3,
  p {
    width: 100%;
  }
  img {
    flex-shrink: 0;
  }
}
