*, ::before, ::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}/*
! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com
*//*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: currentColor; /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/

html,
:host {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
     tab-size: 4; /* 3 */
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
  font-feature-settings: normal; /* 5 */
  font-variation-settings: normal; /* 6 */
  -webkit-tap-highlight-color: transparent; /* 7 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

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

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
  font-feature-settings: normal; /* 2 */
  font-variation-settings: normal; /* 3 */
  font-size: 1em; /* 4 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-feature-settings: inherit; /* 1 */
  font-variation-settings: inherit; /* 1 */
  font-size: 100%; /* 1 */
  font-weight: inherit; /* 1 */
  line-height: inherit; /* 1 */
  letter-spacing: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/
dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/
:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

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

/* Make elements with the HTML hidden attribute stay hidden by default */
[hidden]:where(:not([hidden="until-found"])) {
  display: none;
}
.\!container {
  width: 100% !important;
}
.container {
  width: 100%;
}
@media (min-width: 640px) {

  .\!container {
    max-width: 640px !important;
  }

  .container {
    max-width: 640px;
  }
}
@media (min-width: 768px) {

  .\!container {
    max-width: 768px !important;
  }

  .container {
    max-width: 768px;
  }
}
@media (min-width: 1024px) {

  .\!container {
    max-width: 1024px !important;
  }

  .container {
    max-width: 1024px;
  }
}
@media (min-width: 1280px) {

  .\!container {
    max-width: 1280px !important;
  }

  .container {
    max-width: 1280px;
  }
}
@media (min-width: 1536px) {

  .\!container {
    max-width: 1536px !important;
  }

  .container {
    max-width: 1536px;
  }
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}
.\!visible {
  visibility: visible !important;
}
.visible {
  visibility: visible;
}
.static {
  position: static;
}
.absolute {
  position: absolute;
}
.relative {
  position: relative;
}
.block {
  display: block;
}
.inline {
  display: inline;
}
.flex {
  display: flex;
}
.hidden {
  display: none;
}
.transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.resize {
  resize: both;
}
.blur {
  --tw-blur: blur(8px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.filter {
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.transition {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
@font-face {
    font-family: 'Material Symbols Rounded';
    font-style: normal;
    font-weight: 400;
    src: url(../font/google_icon_font.woff2) format('woff2');
}
@font-face {
    font-family: 'PT Serif';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(../font/PTSerif-400.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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'PT Serif';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(../font/PTSerif-700.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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Darker Grotesque';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(../font/Darker-Grotesque-Variable.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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
.jss-icon {
    font-family: 'Material Symbols Rounded';
    font-weight: normal;
    font-style: normal;
    font-size: 1em;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    vertical-align: middle;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}
.jss-icon.xl{
        font-size: 200%;
    }
.jss-icon.rund{
        aspect-ratio: 1/1;
        padding: 0.5em;
        border-radius: 2em;
        position: relative;
        overflow: hidden;
    }
.jss-icon.rund:after{
            position: absolute;
            left: 0;
            top: 0;
            content: '■';
            opacity: 0.12;
            transform: scale(10);
        }
.jss-icon.fett{
        font-weight: bolder;
    }
html.dark, 
.has-brand-1-background-color, 
.has-brand-2-background-color,
.has-brand-1-2-gradient-background,
.has-brand-2-1-gradient-background,
.has-brand-2-3-gradient-background,
.has-brand-3-2-gradient-background,
.has-brand-1-3-gradient-background,
.has-brand-3-1-gradient-background{
    
    --bg-secondary: rgba(var(--weiss),0.1);

    --text: rgba(var(--weiss),1);
    --text-secondary: rgba(var(--weiss),0.65);
    --text-primary: rgba(var(--weiss),1);

    --link: rgba(var(--weiss),1);
    --link-decoration: rgba(var(--weiss), 0.5);
    --link-hover: rgba(var(--weiss),0.8);
    --focus: rgba(var(--weiss),1);

    background: var(--bg);
    color: var(--text);
}
html.dark{
    --bg: #07131D;

    --link: rgba(var(--brand-2),1);
    --link-decoration: rgba(var(--brand-2), 0.5);
    --link-hover: rgba(var(--brand-2),1);

    --link-secondary: rgba(var(--weiss),0.7);
    --link-secondary-decoration: rgba(var(--weiss),0.4);
    --link-secondary-hover: rgba(var(--weiss),1);
}
html.dark .is-style-secondary-background{
        --bg-secondary: #07131D;
        --bg: rgba(var(--weiss),0.1);
    }
.has-secondary-background-color{
    background-color: var(--bg-secondary);
}
.has-brand-1-background-color{
    --bg: rgba(var(--brand-1),1);
    --link-hover: rgba(var(--brand-3),1);
}
.has-brand-2-background-color{
    --bg: rgba(var(--brand-2),1);
}
.has-brand-3-background-color{
    --bg: rgba(var(--brand-3),1);
}
.has-brand-1-2-gradient-background{
    background: linear-gradient(45deg, rgba(var(--brand-1),1), rgba(var(--brand-2),1)) !important;
}
.has-brand-2-1-gradient-background{
    background: linear-gradient(45deg, rgba(var(--brand-2),1), rgba(var(--brand-1),1)) !important;
}
.has-brand-2-3-gradient-background{
    background: linear-gradient(45deg, rgba(var(--brand-2),1), rgba(var(--brand-3),1)) !important;
}
.has-brand-3-2-gradient-background{
    background: linear-gradient(45deg, rgba(var(--brand-3),1), rgba(var(--brand-2),1)) !important;
}
.has-brand-1-3-gradient-background{
    background: linear-gradient(45deg, rgba(var(--brand-1),1), rgba(var(--brand-3),1)) !important;
}
.has-brand-3-1-gradient-background{
    background: linear-gradient(45deg, rgba(var(--brand-3),1), rgba(var(--brand-1),1)) !important;
}
/* FARBEN */
@media screen and (max-width: 380px){
    *{
        hyphens: auto;
        -webkit-hyphens: auto;
    }    
}
:root{
    --schwarz: 0, 0, 0;
    --weiss: 255, 255, 255;
    --brand-1: 36, 98, 149;
    --brand-2: 38, 128, 145;
    --brand-3: 231, 131, 69;

    /* --brand-1: 45, 125, 190;
    --brand-2: 45, 170, 190;
    --brand-3: 231, 131, 69; */

    --color-brand-1: rgb(var(--brand-1));
    --color-brand-1-on-it: rgb(var(--weiss));
    --color-brand-2: rgb(var(--brand-2));
    --color-brand-3: rgb(var(--brand-3));
    --color-brand-2-on-it: rgb(var(--weiss));

    

    --bg: #ffffff;
    /* --bg-secondary: rgba(var(--weiss),1); */
    --bg-secondary: #E9EFF4;
    --bg-secondary: rgba(var(--brand-1), 0.1);
    --bg-secondary--full: linear-gradient(0deg,var(--bg-secondary),var(--bg-secondary)),var(--bg);

    --primary: rgba(var(--brand-1),1);
    --primary-on-it: rgba(var(--weiss),1);

    --secondary:;
    --secondary-on-it:;

    --text: rgba(0,0,0,1);
    --text-secondary: rgba(0,0,0,0.65);
    --text-primary: rgba(var(--brand-1),1);

    --border: var(--primary);
    --border-secondary: rgba(var(--brand-1),0.25);

    --link: rgba(var(--brand-1),1);
    --link-decoration: rgba(var(--brand-1), 0.5);
    --link-hover: rgba(var(--brand-1),1);

    --link-secondary: rgba(var(--brand-1),0.7);
    --link-secondary-decoration: rgba(var(--brand-1),0.4);
    --link-secondary-hover: rgba(var(--brand-1),1);

    --focus: rgba(var(--brand-1),1);

    --wp--preset--color--brand-1: var(--color-brand-1);
    --wp--preset--color--brand-2: var(--color-brand-2);
    --wp--preset--color--brand-3: var(--color-brand-3);
    @desktop: 1024px;
    @desktop-xl: 1600px;
    --desktop: @desktop;
    --desktop-xl: @desktop-xl;

    --max-width: 50rem;
    --border-radius: 0.75rem;
    --border-radius-button: 0.75rem;
    
    --text-smaller: 0.875rem;
    --text-small: 1rem;
    --text: 1.125rem;
    --text-medium: 1.25rem;
    --text-large: 1.375rem;
    --text-xlarge: 1.5rem;
    --text-2xlarge: 1.75rem;
    --wp--preset--font-size--small: var(--text-small);
    --wp--preset--font-size--medium: var(--text);
    --wp--preset--font-size--large: var(--text-large);
    --wp--preset--font-size--x-large: var(--text-xlarge);
    
    --height-side-header: 4.5rem;
   
    --abstand-xsmall: 0.25rem;
    --abstand-small: 0.5rem;
    --abstand: 1rem;
    --abstand-large: 2rem;
    --abstand-xlarge: 4rem;
    --abstand-2xlarge: 8rem;
}
html{
    font-size: 16px;
}
@media screen and (min-width: 1400px) {
html{
        font-size: 20px
}
    }
body{
    background-color: var(--bg);
    color: var(--text);
    
    font-family: 'SF Pro Text', ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-size: var(--text);
    /* font-size: clamp(1.25rem, 1.25rem + 0vw, 1.25rem); */
    line-height: 1.5;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    display: flex;
    flex-direction: column;
    align-items: center;
}
*:focus-visible{
    outline: 2px solid var(--focus);
    outline-offset: 2px;
}
a{
    color: var(--link);
    text-decoration-color: var(--link-decoration);

    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
}
a:hover{
        color: var(--link-hover);
        text-decoration-color: var(--link-hover);
        text-decoration-thickness: 1px;
        text-underline-offset: 4px;
    }
p:not(.wp-block){
    color: var(--text);
}
p:not(.wp-block):empty{
        display: none;
    }
/* * + h2{
    margin-top: var(--abstand-xlarge);
} */
.entry-header + h2{
    margin-top: 0;
}
h1, h2{
    font-size: var(--text-2xlarge);
    /* font-size: clamp(2.125rem, 1.7658rem + 1.5534vw, 2.3rem); */
    font-weight: 800;
    line-height: 1.4;
    font-family: 'SF Pro Text', ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    color: var(--text-primary);
    hyphens: auto;
    -webkit-hyphens: auto;
}
h1{
    font-size: var(--text-2xlarge);
    /* font-size: clamp(2.3rem, 2.051rem + 1.9417vw, 2.8rem); */
    line-height: 1.2;
}
@media screen and (min-width: 840px){
h1{
        /* font-size: 3rem; */
}
    }
/* * + h3{
    margin-top: var(--abstand);
} */
h3{
    font-size: var(--text-medium);
    /* font-size: clamp(1.625rem, 1.3107rem + 1.3592vw, 2.125rem); */
    font-weight: 800;
    font-family: 'SF Pro Text', ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    color: var(--text-primary);
    hyphens: auto;
    -webkit-hyphens: auto;
}
h4, h5, h6{
    font-size: var(--text-medium);
    /* font-size: clamp(1.375rem, 1.1505rem + 0.9709vw, 1.625rem); */
    font-weight: 800;
    font-family: 'SF Pro Text', ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    color: var(--text);
    hyphens: auto;
    -webkit-hyphens: auto;
}
article > * + h2{
        margin-top: var(--abstand-xlarge);
    }
article > * + h3{
        margin-top: var(--abstand);
    }
small{
    /* font-size: var(--text-small); */
}
.text-secondary{
    color: var(--text-secondary);
}
/* display: flex; */
@media screen AND (max-width: 1024px) {
.is-layout-flex{
        flex-direction: column;
        align-items: stretch
}
    }
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal !important;
}
.screen-reader-text:focus {
        background-color: var(--primary);
        clip: auto !important;
        clip-path: none;
        color: var(--primary-on-it);
        display: block;
        font-size: 1em;
        height: auto;
        left: 5px;
        line-height: normal;
        padding: 15px 23px 14px;
        text-decoration: none;
        top: 5px;
        width: auto;
        z-index: 100000;
    }
.wp-block-separator{
    margin: var(--abstand-xlarge) 0;
    border-color: var(--bg-secondary);
    border-width: 2px;
}
.wp-block-details{
    background-color: var(--bg-secondary);
}
.wp-block-details[open] summary:after{
                transform: rotate(45deg);
            }
.wp-block-details summary{
        padding: var(--abstand);
        color: var(--primary);
        font-weight: 500;
        /* display: grid;
        grid-template-columns: 1fr 2rem;
        justify-content: space-between; */
        display: flex;
        
        gap: var(--abstand-large);
        cursor: pointer;
    }
.wp-block-details summary:focus-visible, .wp-block-details summary:focus{
            outline-offset: 2px;
        }
.wp-block-details summary:after{
            content: '+';
            display: grid;
            place-content: center;
            place-items: center;
            transition: all 300ms ease-in-out;
            width: 2rem;
            height: 2rem;
            font-size: 1.5rem;
            margin-left: auto;
        }
.wp-block-details .details-content{
        padding: var(--abstand);
    }
.is-style-text-on-image{
    display: grid;
    grid-template-columns: 1fr 1fr !important;
}
.is-style-text-on-image .wp-block-media-text__media{
        grid-row: 1 !important;
        grid-column: 1/-1 !important;
    }
.is-style-text-on-image .wp-block-media-text__content{
        grid-row: 1 !important;
        grid-column: 2/-1 !important;
        z-index: 5;
    }
.is-style-text-on-image.has-media-on-the-right .wp-block-media-text__content{
            grid-column: 1/2 !important;
        }
/* ##### HEADER ##### */
/* ##### HEADER ##### */
/* ##### core/button #### */
.btn{
    border-radius: 10rem;
    background: var(--primary);
    color: var(--primary-on-it);
    text-decoration: none;
    display: inline-block;
    padding: 0.5em 1.5em;
    text-align: center;
    cursor: pointer;
}
.btn:hover{
        outline: 2px solid var(--primary);
        color: var(--primary-on-it);
        outline-offset: 2px;
        cursor: pointer;
    }
.btn.active{
        background: var(--primary);
        color: var(--primary-on-it);
    }
.btn-secondary{
    background: var(--bg-secondary);
    color: var(--primary);
}
.btn-secondary:hover{
        color: var(--primary);
    }
.wp-block-button__link{
    border-radius: 10rem;
    background: var(--primary);
    color: var(--primary-on-it);
    text-decoration: none;
    display: inline-block;
    padding: 0.5em 1.5em;
    text-align: center;
    cursor: pointer;
}
.wp-block-button__link:hover{
        outline: 2px solid var(--primary);
        color: var(--primary-on-it);
        outline-offset: 2px;
        cursor: pointer;
    }
.wp-block-button__link.has-brand-1-background-color{
        outline-color: var(--color-brand-1);
        color: var(--color-brand-1-on-it);
    }
.wp-block-button__link.has-brand-2-background-color{
        outline-color: var(--color-brand-2);
        color: var(--color-brand-2-on-it);
    }
.wp-block-button__link.has-brand-3-background-color{
        outline-color: var(--color-brand-3);
        color: var(--color-brand-3-on-it);
    }
.wp-block-button__link.btn-subnav{
        background: var(--bg-secondary);
        color: var(--primary);
        font-size: var(--text-small);
        white-space: nowrap;
    }
.wp-block-button__link.btn-subnav.current-page{
            background: var(--primary);
            color: var(--primary-on-it);
        }
.wp-block-button__link.btn-subnav.btn-subnav--parent{
            margin-right: var(--abstand);
        }
.dark .btn-subnav{
        color: var(--primary-on-it);
    }
.dark .btn-subnav.current-page{
        }
.button-circle{
    border-radius: 100vw;
    align-content: center;
    padding: 0;
}
.jss-grid > .subnav-container{
    display: flex;
    gap: var(--abstand-small);
    overflow: auto;
    padding: var(--abstand) 1.5rem;
    grid-column: 1/-1;
}
@media screen and (min-width: 840px){
.jss-grid > .subnav-container{
        grid-column: 3/4;
        padding-left: 0;
        padding-right: 0
}
    }
div.is-root-container{
    display: grid;
}
main{
    width: 100%;
    max-width: 100vw;
}
main > article, .is-root-container, .jss-grid, main > article .wp-block-group.alignfull{
    display: grid;
    grid-template-columns: 1fr 1.5rem minmax(auto, var(--max-width)) 1.5rem 1fr;
    justify-content: center;
    gap: var(--abstand) 0;
    width: 100%;
    max-width: 100vw;
}
main > article > *,.is-root-container > *,.jss-grid > *,main > article .wp-block-group.alignfull > *{
        width: 100%;
        max-width: 100vw;
        grid-column: 3/4;
        margin-left: 0;
        margin-right: 0;
    }
main > article .alignfull,.is-root-container .alignfull,.jss-grid .alignfull,main > article .wp-block-group.alignfull .alignfull{
        grid-column: 1/-1;
    }
main{
    margin-bottom: var(--abstand-xlarge);
}
.wp-block-group.has-background{
        padding: 1rem;
        display: flex;
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
        
    }
.wp-block-group.has-background > *{
            margin-block-start: 0;
            margin-block-end: 0;
            margin: 0 !important;
        }
.wp-block-group.has-background > *:first-child.wp-block-image{
                margin-left: -1rem !important;
                margin-right: -1rem !important;
                margin-top: -1rem !important;
            }
.wp-block-group.has-background > *:last-child.wp-block-image{
                margin-top: auto !important;
                margin-left: -1rem !important;
                margin-right: -1rem !important;
                margin-bottom: -1rem !important;
            }
.wp-block-group.has-background > *:last-child.wp-block-buttons{
                margin-top: auto !important;
            }
@media screen AND (min-width: 1024px){
.wp-block-group.has-background{
            padding: 1.5rem
        
    }
                .wp-block-group.has-background > *:first-child.wp-block-image{
                    margin-left: -1.5rem !important;
                    margin-right: -1.5rem !important;
                    margin-top: -1.5rem !important;
                }
                .wp-block-group.has-background > *:last-child.wp-block-image{
                    margin-top: auto !important;
                    margin-left: -1.5rem !important;
                    margin-right: -1.5rem !important;
                    margin-bottom: -1.5rem !important;
                }
        }
@media screen AND (min-width: 1600px){
.wp-block-group.has-background{
            padding: 2rem
        
    }
                .wp-block-group.has-background > *:first-child.wp-block-image{
                    margin-left: -2rem !important;
                    margin-right: -2rem !important;
                    margin-top: -2rem !important;
                }
                .wp-block-group.has-background > *:last-child.wp-block-image{
                    margin-top: auto !important;
                    margin-left: -2rem !important;
                    margin-right: -2rem !important;
                    margin-bottom: -2rem !important;
                }
            
        }
/*
.wp-block-group{
    gap: var(--abstand);
    flex-wrap: wrap !important;
    & > h2, & > h3{
        width: 100%;
        max-width: 100vw;
    }
    &.has-background{
        padding-top: var(--abstand-large);
        padding-bottom: var(--abstand-large);
    }
    &.is-layout-constrained{
        display: flex;
        flex-direction: column;
    }
    &.is-vertical{
        & > *{
            width: 100%;
            max-width: 100vw;
        }
    }

    &.is-style-secondary-background{
        background: var(--bg-secondary);
        padding: var(--abstand-large);
    }
    &.is-style-brand-1{
        border: 4px solid rgb(var(--brand-1));
        padding: var(--abstand-large);
    }
    &.is-style-brand-2{
        border: 4px solid rgb(var(--brand-2));
        padding: var(--abstand-large);
    }
    &.is-style-brand-3{
        border: 4px solid rgb(var(--brand-3));
        padding: var(--abstand-large);
    }
    
}

.wp-block-media-text{
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--abstand);
    align-items: center;
    @media screen and (max-width: 839px){
        grid-template-columns: 1fr !important;
    }
    @media screen and (min-width: 840px){
        grid-template-columns: 1fr 1fr;
        gap: var(--abstand-large);
    }
    &.is-vertically-aligned-top{
        align-items: start;
    }
    &.is-vertically-aligned-bottom{
        align-items: end;
    }
}
.wp-block-media-text__content{
    display: flex;
    flex-direction: column;
    gap: var(--abstand);
}
*/
.wp-block-list li{
        padding-left: 1.5em;
        position: relative;
    }
.wp-block-list li + li{
            margin-top: 0.5em;
        }
.wp-block-list li:before{
            width: 1.25em;
            height: 1em;
            position: absolute;
            left: 0px;
            top: 0px;
            display: block;
        }
.wp-block-list.icon-liste li{
            padding-left: 3em;
        }
.wp-block-list.icon-liste li:before{
                display: none;
            }
.wp-block-list.icon-liste li > .jss-icon.rund{
                position: absolute;
                left: 0;
                top: 0;
            }
.wp-block-list .wp-block-list{
        margin-top: 0.5em;
        margin-bottom: 1em;
    }
.wp-block-list.schritte > li{
            padding-top: 0.25rem;
            padding-bottom: 0.25rem;
            margin-top: 0;
        }
.wp-block-list.schritte > li:before{
                width: 1em;
                height: 1em;
                background: var(--primary);
                border: 4px solid var(--bg);
                border-radius: 1em;
                left: calc( 1.5rem / 2 - 0.5em );
                top: 0.5em;
                z-index: 5;
                content: '';
            }
.wp-block-list.schritte > li:after{
                content: '';
                display: block;
                position: absolute;
                left: calc( 1.5rem / 2 - 2px );
                width: 4px;
                border-radius: 2px;
                top: -0.1em;
                bottom: -0.1em;
                background: var(--primary);
            }
.wp-block-list.schritte > li:first-child:after{
                    top: 0.75em;
                }
.wp-block-list.schritte > li:last-child:after{
                    bottom: calc(100% - 1em);
                }
ul.wp-block-list li:before{
            content: '•';
            font-weight: bold;
        }
ol.wp-block-list{
    counter-reset: section;
}
ol.wp-block-list > li{
        counter-increment: section;
    }
ol.wp-block-list > li:before{
            font-weight: bold;
            content: counter(section) '.';
        }
ol.wp-block-list > li > ul.wp-block-list li:before{
                content: '•';
                font-weight: bold;
            }
.wp-block-table td,.wp-block-table th{
        padding: 0.5rem 1rem;
        border: 1px solid var(--border-secondary);
    }
.wp-block-table th{
        text-align: left;
        background: var(--bg-secondary);
    }
details{
    color: var(--text);
    list-style-type:none;
}
details summary{
        list-style-type:none;
    }
details summary::-webkit-details-marker{
            display: none;
            list-style: none;
        }
details > div {
        overflow: hidden;
        display: grid;
        animation-duration: 0.4s;
    }
details > .animation {
        animation-name: grid-expand;
        animation-timing-function: ease-out;
    }
details > .collapsing {
        animation-direction: reverse;
        animation-timing-function: ease-in;
    }
details > div > div {
        min-height: 0;
    }
@keyframes grid-expand {
    0% {
        grid-template-rows: 0fr;
    }
    100% {
        grid-template-rows: 1fr;
    }
}
.badge{
    background: var(--primary);
    color: var(--primary-on-it);
    padding: 0.125em 0.5em;
    border-radius: 4px;
}
.header-short-links{
    display: flex;
    justify-content: space-evenly;
    gap: var(--abstand);
    text-align: center;
    font-size: var(--text-small);
}
.header-short-links a{
        text-decoration: none;
    }
.header-short-links a:hover{
            color: var(--link-hover);
            text-decoration-color: var(--link-hover);
            text-decoration: underline;
        }
.header-short-links a .jss-icon{
            color: rgb(var(--brand-2));
            font-size: var(--text-medium);
        }
.entry-header{
    width: 100%;
    max-width: 100vw;
    padding-bottom: var(--abstand);
    grid-column: 1/-1;
    display: grid;
    grid-template-columns: 1.5rem 1fr 1.5rem;
    justify-content: center;
}
.entry-header.entry-header--image .post-thumbnail{
            grid-column: 1/-1;
            justify-self: center;
        }
.entry-header.entry-header--image .post-thumbnail img{
                width: 100%;
                max-width: 1000px;
                /* max-height: 50vh; */
                -o-object-fit: cover;
                   object-fit: cover;
                -o-object-position: center center;
                   object-position: center center;
            }
.entry-header.entry-header--image .post-thumbnail +  .entry-header--headline{
                margin-top: calc(var(--abstand-large) * -1);
            }
.entry-header .entry-header--headline{
        grid-column: 1/3;
        padding: 1rem 2.5rem 1rem 1.5rem;
        background: var(--primary);
        color: var(--primary-on-it);
        width: -moz-fit-content;
        width: fit-content;
        position: relative;
    }
.entry-header .entry-header--headline:after{
            content: '';
            display: block;
            background: var(--primary);
        }
.entry-header .entry-header--headline a{
            color: var(--primary-on-it);
        }
.entry-header .entry-header--headline h1, .entry-header .entry-header--headline h2{
            color: var(--primary-on-it);
        }
.entry-header .posted-on time{
            display: none;
        }
.entry-header .posted-on time.updated{
                display: inline;
            }
#breadcrumbs{
    font-size: 0.85rem;
    color: var(--text-secondary);
    padding: 0 1.5rem 0.5rem;
}
@media screen AND (min-width: 840px){
#breadcrumbs{
        padding-top: 0
}
    }
#breadcrumbs > span{
        /* display: flex;
        gap: 0.25rem;
        align-items: center; */
        
    }
#breadcrumbs span{
        vertical-align: middle;
    }
#breadcrumbs a{
        color: var(--text-secondary);
        text-decoration: none;
    }
#breadcrumbs a:hover{
            color: var(--primary);
            text-decoration: underline;
        }
#breadcrumbs .jss-icon{
        vertical-align: middle;
    }
#footer{
    width: 100%;
    max-width: 100vw;
    background: var(--bg-secondary);
    padding: var(--abstand-xlarge) 0;
}
.footer-menu{
    padding-top: var(--abstand-xlarge);
    padding-bottom: var(--abstand-large);
}
.footer-daten-schule{
    /* padding-bottom: var(--abstand-2xlarge); */
}
.footer-scroll-top{
    /* padding: var(--abstand-xlarge) var(--abstand); */
    text-align: center;
    font-size: var(--text-2xlarge);
    font-weight: 200;
}
.footer-scroll-top a{
        text-decoration: none;
    }
.footer-scroll-top a:hover{
            text-decoration: underline;
            text-decoration-thickness: 2px;
            text-underline-offset: 4px;
        }
.menu-footer-menu-container{
    font-size: var(--text-small);
    padding-top: var(--abstand-large);
}
.menu-footer-menu-container .menu{
        display: flex;
        flex-wrap: wrap;
        gap: var(--abstand-small) var(--abstand);
    }
.menu-footer-menu-container a{
        text-decoration: none;
    }
.menu-footer-menu-container a:hover{
            text-decoration: underline;
            text-decoration-thickness: 1px;
            text-underline-offset: 4px;
        }
/* #### CF7 Form #### */
input[type="text"],
    input[type="email"]{
        border: 1px solid var(--border);
        padding: var(--abstand-small) var(--abstand);
        border-radius: var(--border-radius);
        background: var(--bg-secondary--full);
    }
textarea{
    border: 1px solid var(--border);
    padding: var(--abstand-small) var(--abstand);
    border-radius: var(--border-radius);
    background: var(--bg-secondary--full);
}
.wpcf7-form{
    display: flex;
    flex-direction: column;
    gap: var(--abstand);
}
.wpcf7-form label{
        display: flex;
        flex-direction: column;
        padding-top: var(--abstand-small);
    }
.wpcf7-form input, .wpcf7-form textarea, .wpcf7-form select{
        width: 100%;
        max-width: 100vw;
    }
.wpcf7-select{
    border: 1px solid var(--border);
    padding: var(--abstand-small) var(--abstand);
    border-radius: var(--border-radius);
    background: var(--bg-secondary--full);
}
.wpcf7-acceptance .wpcf7-list-item{
        margin-left: 0;
    }
.wpcf7-acceptance label{
        border: 1px solid var(--border);
        background: var(--bg-secondary);
        padding: var(--abstand-small) var(--abstand);
        border-radius: var(--border-radius);
        display: grid;
        grid-template-columns: 2rem 1fr;
        align-items: center;
        gap: var(--abstand);
    }
.wpcf7-radio_{
    display: flex;
    flex-direction: column;
    background-color: var(--bg-secondary);
    border-radius: var(--border-radius);
    padding: var(--abstand-small);
}
.wpcf7-radio_ input{
        display: hidden;
    }
.wpcf7-radio_ .wpcf7-list-item{
        margin-left: 0;
    }
.wpcf7-radio_ label{
        /* border: 2px solid var(--border);
        padding: var(--abstand-small) var(--abstand);
        border-radius: var(--border-radius);
        background: var(--bg-secondary--full);
        display: block; */
        display: grid;
        grid-template-columns: var(--abstand-small) 2rem 1fr;
        cursor: pointer;
        align-items: center;
    }
.wpcf7-radio_ label input{
            grid-column: 2/3;
            grid-row: 1;
            z-index: 5;
        }
.wpcf7-radio_ label input:checked + span{
                    border:1px solid var(--border);
                    background: var(--bg);
                }
.wpcf7-radio_ label span{
            grid-column: 1/-1;
            grid-row: 1;
            z-index: 0;
            border: 1px solid transparent;
            padding: var(--abstand-small) var(--abstand);
            border-radius: var(--border-radius);
            padding-left: 3rem;
        }
/* #### Splide #### */
/*
button.splide__pagination__page{
    background: var(--link-secondary);
    &.is-active{
        background: var(--link);
    }
}
.splide{
    grid-column: 1/-1;
    display: flex;
    flex-direction: column;
    background: var(--primary);
    color: var(--primary-on-it);
    @media screen and (min-width: 840px){
    }
    .splide__slide{
       
        padding: 0;
        margin: 0;
        img{
            @media screen and (min-width: 840px){
            }
        }
        .wp-block-image{
            position: relative;
        }
        .wp-element-caption{
            background-color: var(--primary);
            color: var(--primary-on-it);
            padding: var(--abstand-small) var(--abstand) 0  var(--abstand);
            @media screen and (min-width: 840px){
                position: absolute;
                bottom: 0;
                left: 0;
            }
        }
    }
    .splide__arrows-wrapper{
        display: flex;
        justify-content: center;
        height: 4rem;
        .splide__arrows{
            position: relative;
            background-color: var(--primary);
            color: var(--primary-on-it);
            display: flex;
            gap: 1rem;
            align-items: center;
            padding: 0 var(--abstand-small);
            border-radius: 2rem;
            .splide__arrow{
                position: relative;
                aspect-ratio: 1/1;
                height: 2rem;
                width: 2rem;
                transform: none;
                left: auto;
                right: auto;
                top: auto;
                background: transparent;
                font-size: 1.5rem;
            }
        }
    }
}*/
.f-carousel{
    display: grid;
}
.f-carousel .f-button{
        --f-button-width: 38px;
        --f-button-height: 38px;
        --f-button-svg-width: 16px;
        --f-button-svg-height: 16px;
        --f-button-svg-stroke-width: 2.5;
        --f-button-color: var(--text);
        --f-button-border-radius: 50%;
        --f-button-shadow: 0 6px 12px -2px rgb(50 50 93 / 25%), 0 3px 7px -3px rgb(0 0 0 / 30%);
        --f-button-bg: var(--bg);
        --f-button-hover-bg: var(--bg-secondary--full);
        --f-button-active-bg: var(--bg-secondary--full);
        --f-button-next-pos: -1rem;
        --f-button-prev-pos: -1rem;
    }
.f-carousel .f-button:focus-visible{
            outline: 2px solid var(--focus);
            outline-offset: 2px;
        }
.f-carousel .f-button:hover:not([disabled]){
        background: var(--bg-secondary--full);
    }
.f-carousel .f-button[disabled]{
        opacity: 0;
    }
.f-carousel .f-carousel__dots li{
        color: var(--primary);
    }
.f-carousel__slide{
    --f-carousel-slide-height: max-content;
    --f-carousel-slide-width: 100%;
}
@media screen AND (min-width: 1024px) {
.f-carousel-desktop-2 .f-carousel__slide{
            --f-carousel-spacing: 1rem;
            --f-carousel-slide-width: calc((100% - 1rem) / 2);
            --f-carousel-slide-height: 100%
    }
        }
@media screen AND (max-width: 1024px) {
.f-carousel-mobile-none{
        gap: 1rem
}
    }
figure.wp-block-gallery{
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr 1fr;
}
@media screen and (min-width: 840px){
figure.wp-block-gallery{
        grid-template-columns: 1fr 1fr
}
    }
figure.wp-block-gallery.has-nested-images{
        align-items: flex-start;
    }
a[data-fancybox]{
    position: relative;
}
a[data-fancybox] img{
        z-index: 0;
    }
a[data-fancybox]:before{
        font-family: 'Material Symbols Rounded';
        font-weight: normal;
        font-style: normal;
        font-size: 1.25rem;
        line-height: 1;
        letter-spacing: normal;
        text-transform: none;
        display: inline-block;
        white-space: nowrap;
        word-wrap: normal;
        direction: ltr;
        -webkit-font-feature-settings: 'liga';
        -webkit-font-smoothing: antialiased;
        content: '\e8ff';
        transition: all 300ms ease-in-out;
        width: 2rem;
        height: 2rem;
        background-color: rgba(0,0,0,0.5);
        color: #fff;
        position: absolute;
        right: 0.5rem;
        top: 0.5rem;
        border-radius: 2rem;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 5;
    }
a[data-fancybox] figcaption{
        font-size: var(--text-smaller);
    }
a[data-fancybox="person"]{
    border-radius: 20rem;
    overflow: hidden;
}
a[data-fancybox="person"]:before{
        display: none;
        top: unset;
        bottom: 0.5rem;
    }
a[data-fancybox="person"] img{
        transition: all 150ms ease-in-out;
    }
a[data-fancybox="person"]:hover:before,a[data-fancybox="person"]:focus-visible:before{
            display: flex;
            bottom: 0.5rem;
            right: calc(50% - 1em);
        }
a[data-fancybox="person"]:hover img,a[data-fancybox="person"]:focus-visible img{
            transform: scale(1.05);
        }
/* #### CARD #### */
.jss-tag{
    font-size: 0.7em;
    color: var(--color-brand-2);
    font-style: italic;
}
.jss-cards--schulleben{    
    
}
.jss-card--schulleben{
    background: var(--bg-secondary);
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    width: calc(100vw - (var(--abstand) * 7));
    max-width: calc(var(--max-width) / 2);
    text-decoration: none;
}
@media screen and (min-width: 840px){
.jss-card--schulleben{
        max-width: auto;
        width: auto
}
    }
.jss-card--schulleben > .wp-post-image{
        aspect-ratio: 16 / 9;
        -o-object-fit: cover;
           object-fit: cover;
    }
.jss-card--schulleben:hover .jss-card--title{
            text-decoration: underline;
            text-decoration-thickness: 1px;
        }
.jss-card--download{
}
.jss-card--downloads{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--abstand-small);
    -webkit-hyphens: auto;
            hyphens: auto;
    align-items: start;
}
@media screen and (min-width: 1024px){
.jss-card--downloads{
        grid-template-columns: 1fr 1fr 1fr
}
        
    }
.jss-card--downloads .jss-download{
        background-color: var(--bg-secondary);
        padding: var(--abstand-small);
        border-radius: 4px;
        text-decoration: none;
        display: grid;
        grid-template-columns: 1fr;
        gap: 0.5rem;
        align-items: start;
    }
.jss-card--downloads .jss-download details summary{
                color: var(--primary);
            }
.jss-card--downloads .jss-download details summary:hover{
                    cursor: pointer;
                }
.jss-card--downloads .jss-download--description{
        font-size: var(--text-small);
        color: var(--text-secondary);
        hyphens: auto;
        -webkit-hyphens: auto;
    }
.jss-card--downloads .jss-download--thumb{
        background-color: var(--primary);
        display: grid;
        grid-template-columns: 1fr;
        justify-content: center;
        align-items: center;
        justify-items: center;
        align-content: center;
    }
.jss-card--downloads .jss-download--thumb img{
            display: block;
            margin: 0;
            padding: 0;
        }
.jss-card--downloads .jss-download--thumb > *{
            grid-row: 1;
            grid-column: 1/-1;
        }
.jss-card--downloads .button-circle{
        width: 3rem;
        height: 3rem;
        font-size: var(--text-large);
        display: grid;
        aspect-ratio: 1 / 1;
    }
.jss-personen--liste{
    display: flex;
    flex-direction: column;
    gap: var(--abstand);
}
.jss-personen--liste > ul{
        display: flex;
        flex-direction: column;
        gap: var(--abstand);
    }
@media screen and (min-width: 1024px){
.jss-personen--liste > ul{
            display: grid;
            grid-template-columns: 1fr 1fr
    }            
        }
.jss-card--person{
    background: var(--bg-secondary);
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--abstand);
    padding: var(--abstand);
    text-align: center;
    justify-items: center;
    justify-content: center;
}
.jss-card--person.jss-card--person-image{
        grid-template-columns: 1fr;
        align-items: center
    }
.jss-card--person small{
        color: var(--text-secondary);
    }
.jss-card--person > div{
        display: flex;
        flex-direction: column;
        gap: var(--abstand-small);
    }
.jss-card--person .wp-post-image{
        border-radius: 10rem;
        max-width: 12rem;
    }
.jss-card--person .kuerzel-thumb{
        aspect-ratio: 1 / 1;
        border-radius: 10rem;
        background-color: var(--bg-secondary);
        display: flex;
        align-items: center;
        justify-content: center;
    }
.jss-card--title{
    padding: 1rem 1.5rem;
}
.jss-card--list-teaser{
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}
@media screen and (min-width: 600px){
.jss-card--list-teaser{
        grid-template-columns: 1fr 1fr
}
    }
/* & + li{
            margin-top: calc(var(--abstand) * -1);
        } */
/* &:last-child{
            & > a{
                padding: var(--abstand);
                border-radius: var(--border-radius);
            }
        } */
.jss-card--list-teaser > li > a{
            display: flex;
            padding: 0.5rem 1rem;
            background: var(--bg-secondary--full);
            /* border-radius: var(--border-radius) var(--border-radius) 0 0; */
            /* border: 2px solid var(--bg); */
            text-decoration: none;
            font-weight: bold;
            justify-content: flex-start;
            align-items: center;
            gap: 0.5rem;
        }
.jss-card--list-teaser > li > a:after{
                content: '\e5c8';
                font-family: 'Material Symbols Rounded';
                font-weight: normal;
                font-style: normal;
                font-size: 1.5rem;
                line-height: 1;
                letter-spacing: normal;
                text-transform: none;
                display: inline-block;
                white-space: nowrap;
                word-wrap: normal;
                direction: ltr;
                -webkit-font-feature-settings: 'liga';
                -webkit-font-smoothing: antialiased;
                margin-left: auto;
            }
.jss-card--list-teaser > li > a > span{
                display: flex;
                flex-direction: column;
            }
.jss-card--list-teaser > li > a small{
                font-weight: normal;
                color: var(--text-secondary);
            }
.jss-card--list-teaser .fach-emoji{
        height: 2em;
        width: 2em;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: var(--bg);
        border-radius: 20rem;
        font-size: 1.5rem;;
    }
.termin-liste{
    display: flex;
    flex-direction: column;
    gap: var(--abstand-small);
}
.termin-liste--monat{
    display: flex;
    flex-direction: column;
    gap: var(--abstand);
}
.termin-liste--termin{
    background-color: var(--bg-secondary);
    padding: 1rem;
}
.termin-liste--termin:first-child{
        border-top-left-radius: 4px;
        border-top-right-radius: 4px;
    }
.termin-liste--termin:last-child{
        border-bottom-right-radius: 4px;
        border-bottom-left-radius: 4px
    }
.termin-liste--termin summary div{
        display: flex;
        justify-content: space-between;
        align-content: center;
        align-items: center;
    }
.termin-liste--termin summary:hover{
        color: var(--primary);
        cursor: pointer;
    }
.termin-liste--tag{
    display: grid;
    grid-template-columns: 3rem 1fr;
    gap: var(--abstand);
}
.termin-liste--tag + .termin-liste--monat{
        margin-top: var(--abstand-large);
    }
.termin-liste--tag-badge{
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: var(--text-small);
    height: -moz-max-content;
    height: max-content;
    position: sticky;
    left: 0;
    top: 7.5rem;
    z-index: 0;
}
@media screen AND (min-width: 840px){
.termin-liste--tag-badge{
        top: 2rem
}
    }
.termin-liste--tag-badge strong{
        font-size: var(--text-medium);
    }
.termin-liste--monat-header{
    background-color: var(--bg);
    padding: var(--abstand-xsmall) var(--abstand);
    position: sticky;
    left: 0;
    top: var(--height-side-header);
    z-index: 10;
}
@media screen AND (min-width: 840px){
.termin-liste--monat-header{
        top: 0
}
    }
.termin-liste--termine{
    display: flex;
    flex-direction: column;
    gap: 2px;
    align-self: center;
}
.termin-liste--termine li{
        display: flex;
        flex-direction: column;
    }
.termin-liste--termine li small{
            color: var(--text-secondary);
        }
.wp-pagenavi{
    background-color: var(--bg-secondary);
    padding: 4px 1rem;
    display: flex;
    gap: 0.25em;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    border-radius: 1rem;
    margin-left: 1rem;
    margin-right: 1rem;
}
.wp-pagenavi .pages{
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border-width: 0;
    }
.wp-pagenavi a{
        padding: 0.25rem 0.5rem;
        border-radius: 2rem;
        display: grid;
        min-width: 2.5rem;
        min-height: 2rem;
        align-items: center;
        justify-items: center;
        justify-content: center;
        align-content: center;
    }
.wp-pagenavi a:hover{
            background-color: var(--bg);
        }
.wp-pagenavi .current{
        padding: 0.25rem 0.5rem;
        border-radius: 2rem;
        background-color: var(--primary);
        color: var(--primary-on-it);
        display: grid;
        min-width: 2.5rem;
        min-height: 2rem;
        align-items: center;
        justify-items: center;
        justify-content: center;
        align-content: center;
    }
.jss-page-navigation{
    grid-column: 3 / 4;
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--abstand);
    padding-bottom: 3rem;

}
@media screen and (min-width: 1024px){
.jss-page-navigation{
        grid-template-columns: 1fr 1fr

}
    }
.jss-page-navigation .link_upward{
        grid-column: 1/-1;
    }
.jss-page-navigation .link_back, .jss-page-navigation .link_forward{
        display: grid;
        grid-template-columns: 1fr 1fr;
        background-color: var(--primary);
        align-items: end;
    }
.jss-page-navigation .link_back img,.jss-page-navigation .link_forward img{
            grid-row: 1;
            grid-column: 1 / -1;
            z-index: 0;
            align-self: stretch;
            -o-object-fit: cover;
               object-fit: cover;
        }
.jss-page-navigation .link_back .link_text,.jss-page-navigation .link_forward .link_text{
            grid-row: 1;
            grid-column: 1 / -1;
            z-index: 5;
            background-color: var(--primary);
            color: var(--primary-on-it);
            padding: 0.5rem 1rem;
            max-width: -moz-max-content;
            max-width: max-content;
        }
.jss-page-navigation .link_forward{
        justify-items: end;
    }
/* #### LAST #### */
/*
.is-style-card-slider{    
    gap: var(--abstand);
    @media screen and (max-width: 840px){
        flex-wrap: nowrap !important;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        overscroll-behavior-x: contain;
        display: flex;
    }
    @media screen and (min-width: 840px){
        display: grid;
        grid-template-columns: 1fr;
    }

    & > .wp-block-group{ 
        text-decoration: none;
            display: flex;
            flex-direction: column;
            flex-shrink: 0;
            gap: var(--abstand);
        & > .wp-block-buttons{
            margin-top: auto;
        }
        @media screen and (max-width: 839px){   
            width: calc(100vw - (var(--abstand) * 7));
            max-width: calc(var(--max-width) / 2);
            height: 100%;
        }
        @media screen and (min-width: 840px){
            max-width: 100vw;
            width: 100%;
        }
    }
}
.is-style-card{
    padding: var(--abstand);
    background: var(--bg-secondary);
}
*/
.has-brand-1-background-color{
    --bg: var(--color-brand-1);
    --text: rgb(var(--weiss));
    background: var(--bg);
    color: var(--text);
}
.has-brand-2-background-color{
    --bg: var(--color-brand-2);
    --text: rgb(var(--weiss));
    background: var(--bg);
    color: var(--text);
}
.has-brand-3-background-color{
    --bg: var(--color-brand-3);
    --text: rgb(var(--weiss));
    background: var(--bg);
    color: var(--text);
}
.has-secondary-background-color{
    background: var(--color-brand-3);
    color: var(--color-brand-3-on-it);
}
/* #### Wordpress Editor #### */
.toggleModeButton{
    color: var(--text);
}
.toggleModeButton .jss-icon--light_mode{
        display: none;
    }
.dark .toggleModeButton .jss-icon--light_mode{
        display: block;
    }
.dark .toggleModeButton .jss-icon--dark_mode{
        display: none;
    }
.menu-hauptmenu-container{
    width: 100%;
    max-width: 100vw;
}
/* #menu-hauptmenu{ */
/* display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem 1rem; */
.menu-hauptmenu-container > .menu-item:not(.menu-icon-einzeln){
        /* grid-column: 1/-1; */
    }
.menu-hauptmenu-container a{
        text-decoration: none;
        color: var(--text);
    }
.menu-hauptmenu-container details summary{
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0.25em 0;
        }
.menu-hauptmenu-container details summary:after{
                font-family: 'Material Symbols Rounded';
                font-weight: normal;
                font-style: normal;
                font-size: 1em;
                line-height: 1;
                letter-spacing: normal;
                text-transform: none;
                display: inline-block;
                white-space: nowrap;
                word-wrap: normal;
                direction: ltr;
                -webkit-font-feature-settings: 'liga';
                -webkit-font-smoothing: antialiased;
                content: '\e313';
                color: var(--text-secondary);
                transition: all 300ms ease-in-out;
                width: 1em;
                height: 1em;
            }
/* font-weight: bold; */
.menu-hauptmenu-container details[open] summary:after{
                    transform: rotate(180deg);
                }
.menu-hauptmenu-container details > ul{
            padding-bottom: 1rem;
        }
.menu-hauptmenu-container ul ul{
        padding: 0 0 0 1rem;
    }
.menu-hauptmenu-container ul ul > li > a{
                display: block;
                padding: 0.25em 0;
            }
.menu-hauptmenu-container .current_page_item > a,.menu-hauptmenu-container .current-page-ancestor > a,.menu-hauptmenu-container .current-menu-parent > a,.menu-hauptmenu-container .current-menu-item > a{
            font-weight: bold;
        }
.menu-hauptmenu-container .current_page_item > details > summary,.menu-hauptmenu-container .current-page-ancestor > details > summary,.menu-hauptmenu-container .current-menu-parent > details > summary,.menu-hauptmenu-container .current-menu-item > details > summary{
                font-weight: bold;
            }
.menu-hauptmenu-container .menu-item:not(.menu-icon-einzeln) + .menu-icon-einzeln{
        margin-top: var(--abstand-large);
    }
.menu-hauptmenu-container .menu-icon-einzeln{
        font-size: 80%;
    }
/* font-size: 14px; */
/* width: fit-content;
        text-align: center;
        justify-self: center; */
/* display: none; */
.menu-hauptmenu-container .menu-icon-einzeln a{
            color: var(--text-secondary);
            padding: var(--abstand-xsmall) 0;
            display: flex;
            gap: var(--abstand-small);
            align-items: center;
            /* display: flex;
            flex-direction: column;
            align-items: center; */
        }
.menu-hauptmenu-container .jss-edit-text{
        display: inline;
    }
.sr-only{
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}
.jss-search-group{
    background-color: var(--bg-secondary);
    border-radius: 4rem;
    padding: 0.5rem 1rem;
    display: flex;
    gap: 1rem;
    align-items: center;
}
.jss-search-group label{
        display: flex;
        align-items: center;
        gap: 0.1em;
    }
.jss-search-group input[type="search"]{
        border: 2px solid var(--border);
        border-radius: 4rem;
        padding: 0.25rem 1rem;
        color: var(--text);
        display: block;
        width: 100%;
        background: var(--bg);
    }
.jss-sort-controls-container{
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
@media screen and (min-width: 1024px){
.jss-sort-controls-container{
        flex-direction: row;
        align-items: center;
        justify-content: space-between
}
    }
.jss-sort-controls{
    display: flex;
    gap: 0.5rem;
}
.jss-sort-controls button{
        background-color: var(--bg-secondary);
        border-radius: 2rem;
        padding: 0.25rem 0.75rem;
        display: flex;
        align-items: center;
        font-size: 1rem;
    }
.jss-sort-controls button[aria-checked="true"]{
            background-color: var(--primary);
            color: var(--primary-on-it);
        }
.jss-sort-controls button[aria-checked="true"][data-sort-order="asc"]::after {
            content: "\e5c5";
            font-family: 'Material Symbols Rounded';
            font-weight: normal;
            font-style: normal;
            font-size: 1em;
            line-height: 1;
            letter-spacing: normal;
            text-transform: none;
            display: inline-block;
            white-space: nowrap;
            word-wrap: normal;
            direction: ltr;
            -webkit-font-feature-settings: 'liga';
            -webkit-font-smoothing: antialiased;
            transition: all 300ms ease-in-out;
            width: 1em;
            height: 1em;
        }
.jss-sort-controls button[aria-checked="true"][data-sort-order="desc"]::after {
            content: "\e5c7";
            font-family: 'Material Symbols Rounded';
            font-weight: normal;
            font-style: normal;
            font-size: 1em;
            line-height: 1;
            letter-spacing: normal;
            text-transform: none;
            display: inline-block;
            white-space: nowrap;
            word-wrap: normal;
            direction: ltr;
            -webkit-font-feature-settings: 'liga';
            -webkit-font-smoothing: antialiased;
            transition: all 300ms ease-in-out;
            width: 1em;
            height: 1em;
        }
.filter-group + .filter-status{
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}
.button-group-radio{
    background-color: var(--bg-secondary);
    border-radius: 1rem;
    padding: 0.5rem 1rem;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    width: 100%;
    align-items: center;
    justify-content: flex-start;
}
@media screen and (min-width: 840px){
.button-group-radio{
        width: -moz-fit-content;
        width: fit-content
}
    }
.button-group-radio button{
        border-radius: 1rem;
        padding: 0px 16px;
        color: var(--primary);
        cursor: pointer;
        display: flex;
        align-items: center;
        width: -moz-max-content;
        width: max-content;
        gap: 0.25rem;
    }
.button-group-radio button:hover{
            background-color: var(--primary-on-it);
        }
.button-group-radio button:before{
            font-family: 'Material Symbols Rounded';
            font-weight: normal;
            font-style: normal;
            font-size: 1em;
            line-height: 1;
            letter-spacing: normal;
            text-transform: none;
            display: inline-block;
            white-space: nowrap;
            word-wrap: normal;
            direction: ltr;
            -webkit-font-feature-settings: 'liga';
            -webkit-font-smoothing: antialiased;
            content: '\e836';
            transition: all 300ms ease-in-out;
            width: 1em;
            height: 1em;
        }
.button-group-radio button[aria-pressed="true"]{
        background-color: var(--primary);
        color: var(--primary-on-it);
    }
.button-group-radio button[aria-pressed="true"]:before{
            content: '\e837';
        }
.filter-details-button-bar{
    background-color: var(--bg-secondary);
    border-radius: 1rem;
    padding: 0.5rem 1rem;
}
.filter-details-button-bar:open{
        display: grid;
        grid-template-columns: 1fr;
        align-items: start;
    }
@media screen and (min-width: 1024px){
.filter-details-button-bar:open{
            grid-template-columns: 1fr 5fr
    }
        }
.filter-details-button-bar:open summary{
            justify-content: flex-start;
            gap: 0.5rem;
        }
.filter-details-button-bar:open summary:after{
                content: '\e5cd';
            }
.filter-details-button-bar:open summary:hover:after{
                    content: '\e5c9';
                }
.filter-details-button-bar + .filter-details-button-bar{
        margin-top: 0.5rem;
    }
.filter-details-button-bar summary{
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
.filter-details-button-bar summary:hover{
            cursor: pointer;
            color: var(--primary);
        }
.filter-details-button-bar summary:after{
            font-family: 'Material Symbols Rounded';
            font-weight: normal;
            font-style: normal;
            font-size: 1em;
            line-height: 1;
            letter-spacing: normal;
            text-transform: none;
            display: inline-block;
            white-space: nowrap;
            word-wrap: normal;
            direction: ltr;
            -webkit-font-feature-settings: 'liga';
            -webkit-font-smoothing: antialiased;
            content: '\e313';
            transition: all 300ms ease-in-out;
            width: 1em;
            height: 1em;
        }
.filter-details-button-bar fieldset{
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }
.filter-details-button-bar input + label{
            border-radius: 1rem;
            padding: 0px 16px;
            color: var(--primary);
            cursor: pointer;
            display: flex;
            align-items: center;
            width: -moz-max-content;
            width: max-content;
            gap: 0.25rem;
        }
.filter-details-button-bar input + label:hover{
                background-color: var(--primary-on-it);
            }
.filter-details-button-bar input + label:before{
                font-family: 'Material Symbols Rounded';
                font-weight: normal;
                font-style: normal;
                font-size: 1em;
                line-height: 1;
                letter-spacing: normal;
                text-transform: none;
                display: inline-block;
                white-space: nowrap;
                word-wrap: normal;
                direction: ltr;
                -webkit-font-feature-settings: 'liga';
                -webkit-font-smoothing: antialiased;
                content: '\e836';
                transition: all 300ms ease-in-out;
                width: 1em;
                height: 1em;
            }
.filter-details-button-bar input:checked + label{
                background-color: var(--primary);
                color: var(--primary-on-it);
            }
.filter-details-button-bar input:checked + label:before{
                    content: '\e837';
                }
.filter-details-button-bar input:focus + label{
                outline: 2px solid var(--primary);
                outline-offset: 2px;
            }
.jss-footer-navigation{
    padding: 1rem;
}
@media screen and (max-width: 1023px){
    #menu{
        --animation-slide-in-left: slide-in-left .5s cubic-bezier(.25, 0, .3, 1);

        background: var(--bg);
        width: 100vw;
        /* height: 100vh;     */
        max-width: calc(var(--max-width) / 3 * 2);
        max-height: 100vh;
        margin: 0 0 0 auto;
        padding: var(--abstand-large);
    }

        #menu[open]{
            animation: var(--animation-slide-in-left) forwards;
        }

            #menu[open] .site-header--button{
                flex-direction: row-reverse;
            }
    dialog::backdrop {
        -webkit-backdrop-filter: blur(0.25rem);
                backdrop-filter: blur(0.25rem);
    }

    .jss-backend, .jss-edit{
        display: none;
    }

    #masthead{
        width: 100%;
        max-width: 100vw;
        position: sticky;
        left: 0;
        top: 0;
        background: var(--bg);
        z-index: 10;
    }
    .site-header--wrapper{
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: var(--abstand);
        padding: var(--abstand) var(--abstand-large);
        height: var(--height-side-header);
    }
    .site-header--button{
        display: flex;
        gap: var(--abstand);
    }
    .home-logo svg{
        width: 6rem;
        height: auto;
    }
    .showMainMenu{
        display: flex;
        align-items: center;
        gap: 0.5rem;
        color: var(--primary);
    }
    .hideMainMenu{
        aspect-ratio: 1/1;
        background: var(--primary);
        color: var(--primary-on-it);
        padding: var(--abstand);
        border-radius: var(--abstand-large);
    }
    .menu-header--wrapper{
        display: flex;
        flex-direction: row-reverse;
        justify-content: space-between;
        align-items: center;
        padding-bottom: var(--abstand-large);
    }
}
@keyframes slide-in-left {
    from { transform: translateX(100%) }
}
@media screen and (min-width: 1024px){

    body{
        display: grid;
        grid-template-columns: 1px 16rem auto 1px;
        align-items: start;
        gap: 0 2rem;
    }
    #masthead{
        grid-column: 2/3;
        height: 100%;
    }
    #hauptinhalt{
        grid-column: 3/4;
        padding-top: 1.5rem;
    }
    #footer, .jss-footer-navigation{
        grid-column: 1/-1;
    }
    .showMainMenu{
        display: none;
    }

    .site-header--button{
        display: none;
    }

    #menu{
        border: 0;
        display: flex;
        background: 0;
        position: relative;
        margin: 0;
        padding: 0;
        width: 100%;
        max-width: 100vw;
    }
        #menu .menu-header{
            display: none;
        }

    .site-header--wrapper{
        position: sticky;
        left: 0;
        top: 0;

        display: flex;
        flex-direction: column;
        gap: 1rem;

        padding-top: 2rem;
        padding-bottom: 2rem;

        max-height: 100vh;
        overflow: auto;
    }
    #site-navigation{
        width: 100%;
        max-width: 100vw;
    }

    .home-logo svg{
        width: 9rem;
        height: auto;
    }

    .jss-edit-text{
        display: none;
    }
        footer .menu-hauptmenu-container{
            display: none;
        }

}
@media screen and (min-width: 1600px){
    body{
        display: grid;
        grid-template-columns: 1fr 16rem minmax(auto, 50rem) 1fr;
        align-items: start;
        gap: 0 2rem;
    }
}
/* Grundstruktur */
.scroller {
  position: relative;
  display: flex;
  align-items: center;
  grid-column: 1 / -1;
}
.scroller .btn:hover, .scroller .btn:focus-visible{
        outline-offset: -2px;
    }
/* Buttons sind standardmäßig nicht sichtbar */
.scroller-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  background: #eee;
  border: none;
  border-radius: 999px;
  padding: 0.5rem;
  cursor: pointer;
  pointer-events: auto;
  display: none;
}
.scroller.can-scroll-prev .scroller-btn.prev,
.scroller.can-scroll-next .scroller-btn.next {
  display: inline-block;
}
.scroller-btn.prev {
  left: 0;
}
.scroller-btn.next {
  right: 0;
}
.scroller-track {
  display: flex;
  overflow-x: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
  gap: 0.5rem;
  flex: 1 1 auto;
  padding: 0 var(--abstand);
}
.scroller-track::-webkit-scrollbar {
  display: none;
}
.scroller-item {
  flex: 0 0 auto;
}