:where(html){--gray-0:#f8f9fa;--gray-1:#f1f3f5;--gray-2:#e9ecef;--gray-3:#dee2e6;--gray-4:#ced4da;--gray-5:#adb5bd;--gray-6:#868e96;--gray-7:#495057;--gray-8:#343a40;--gray-9:#212529;--gray-10:#16191d;--gray-11:#0d0f12;--gray-12:#030507;--stone-0:#f8fafb;--stone-1:#f2f4f6;--stone-2:#ebedef;--stone-3:#e0e4e5;--stone-4:#d1d6d8;--stone-5:#b1b6b9;--stone-6:#979b9d;--stone-7:#7e8282;--stone-8:#666968;--stone-9:#50514f;--stone-10:#3a3a37;--stone-11:#252521;--stone-12:#121210;--red-0:#fff5f5;--red-1:#ffe3e3;--red-2:#ffc9c9;--red-3:#ffa8a8;--red-4:#ff8787;--red-5:#ff6b6b;--red-6:#fa5252;--red-7:#f03e3e;--red-8:#e03131;--red-9:#c92a2a;--red-10:#b02525;--red-11:#962020;--red-12:#7d1a1a;--pink-0:#fff0f6;--pink-1:#ffdeeb;--pink-2:#fcc2d7;--pink-3:#faa2c1;--pink-4:#f783ac;--pink-5:#f06595;--pink-6:#e64980;--pink-7:#d6336c;--pink-8:#c2255c;--pink-9:#a61e4d;--pink-10:#8c1941;--pink-11:#731536;--pink-12:#59102a;--purple-0:#f8f0fc;--purple-1:#f3d9fa;--purple-2:#eebefa;--purple-3:#e599f7;--purple-4:#da77f2;--purple-5:#cc5de8;--purple-6:#be4bdb;--purple-7:#ae3ec9;--purple-8:#9c36b5;--purple-9:#862e9c;--purple-10:#702682;--purple-11:#5a1e69;--purple-12:#44174f;--violet-0:#f3f0ff;--violet-1:#e5dbff;--violet-2:#d0bfff;--violet-3:#b197fc;--violet-4:#9775fa;--violet-5:#845ef7;--violet-6:#7950f2;--violet-7:#7048e8;--violet-8:#6741d9;--violet-9:#5f3dc4;--violet-10:#5235ab;--violet-11:#462d91;--violet-12:#3a2578;--indigo-0:#edf2ff;--indigo-1:#dbe4ff;--indigo-2:#bac8ff;--indigo-3:#91a7ff;--indigo-4:#748ffc;--indigo-5:#5c7cfa;--indigo-6:#4c6ef5;--indigo-7:#4263eb;--indigo-8:#3b5bdb;--indigo-9:#364fc7;--indigo-10:#2f44ad;--indigo-11:#283a94;--indigo-12:#21307a;--blue-0:#e7f5ff;--blue-1:#d0ebff;--blue-2:#a5d8ff;--blue-3:#74c0fc;--blue-4:#4dabf7;--blue-5:#339af0;--blue-6:#228be6;--blue-7:#1c7ed6;--blue-8:#1971c2;--blue-9:#1864ab;--blue-10:#145591;--blue-11:#114678;--blue-12:#0d375e;--cyan-0:#e3fafc;--cyan-1:#c5f6fa;--cyan-2:#99e9f2;--cyan-3:#66d9e8;--cyan-4:#3bc9db;--cyan-5:#22b8cf;--cyan-6:#15aabf;--cyan-7:#1098ad;--cyan-8:#0c8599;--cyan-9:#0b7285;--cyan-10:#095c6b;--cyan-11:#074652;--cyan-12:#053038;--teal-0:#e6fcf5;--teal-1:#c3fae8;--teal-2:#96f2d7;--teal-3:#63e6be;--teal-4:#38d9a9;--teal-5:#20c997;--teal-6:#12b886;--teal-7:#0ca678;--teal-8:#099268;--teal-9:#087f5b;--teal-10:#066649;--teal-11:#054d37;--teal-12:#033325;--green-0:#ebfbee;--green-1:#d3f9d8;--green-2:#b2f2bb;--green-3:#8ce99a;--green-4:#69db7c;--green-5:#51cf66;--green-6:#40c057;--green-7:#37b24d;--green-8:#2f9e44;--green-9:#2b8a3e;--green-10:#237032;--green-11:#1b5727;--green-12:#133d1b;--lime-0:#f4fce3;--lime-1:#e9fac8;--lime-2:#d8f5a2;--lime-3:#c0eb75;--lime-4:#a9e34b;--lime-5:#94d82d;--lime-6:#82c91e;--lime-7:#74b816;--lime-8:#66a80f;--lime-9:#5c940d;--lime-10:#4c7a0b;--lime-11:#3c6109;--lime-12:#2c4706;--yellow-0:#fff9db;--yellow-1:#fff3bf;--yellow-2:#ffec99;--yellow-3:#ffe066;--yellow-4:#ffd43b;--yellow-5:#fcc419;--yellow-6:#fab005;--yellow-7:#f59f00;--yellow-8:#f08c00;--yellow-9:#e67700;--yellow-10:#b35c00;--yellow-11:#804200;--yellow-12:#663500;--orange-0:#fff4e6;--orange-1:#ffe8cc;--orange-2:#ffd8a8;--orange-3:#ffc078;--orange-4:#ffa94d;--orange-5:#ff922b;--orange-6:#fd7e14;--orange-7:#f76707;--orange-8:#e8590c;--orange-9:#d9480f;--orange-10:#bf400d;--orange-11:#99330b;--orange-12:#802b09;--choco-0:#fff8dc;--choco-1:#fce1bc;--choco-2:#f7ca9e;--choco-3:#f1b280;--choco-4:#e99b62;--choco-5:#df8545;--choco-6:#d46e25;--choco-7:#bd5f1b;--choco-8:#a45117;--choco-9:#8a4513;--choco-10:#703a13;--choco-11:#572f12;--choco-12:#3d210d;--brown-0:#faf4eb;--brown-1:#ede0d1;--brown-2:#e0cab7;--brown-3:#d3b79e;--brown-4:#c5a285;--brown-5:#b78f6d;--brown-6:#a87c56;--brown-7:#956b47;--brown-8:#825b3a;--brown-9:#6f4b2d;--brown-10:#5e3a21;--brown-11:#4e2b15;--brown-12:#422412;--sand-0:#f8fafb;--sand-1:#e6e4dc;--sand-2:#d5cfbd;--sand-3:#c2b9a0;--sand-4:#aea58c;--sand-5:#9a9178;--sand-6:#867c65;--sand-7:#736a53;--sand-8:#5f5746;--sand-9:#4b4639;--sand-10:#38352d;--sand-11:#252521;--sand-12:#121210;--camo-0:#f9fbe7;--camo-1:#e8ed9c;--camo-2:#d2df4e;--camo-3:#c2ce34;--camo-4:#b5bb2e;--camo-5:#a7a827;--camo-6:#999621;--camo-7:#8c851c;--camo-8:#7e7416;--camo-9:#6d6414;--camo-10:#5d5411;--camo-11:#4d460e;--camo-12:#36300a;--jungle-0:#ecfeb0;--jungle-1:#def39a;--jungle-2:#d0e884;--jungle-3:#c2dd6e;--jungle-4:#b5d15b;--jungle-5:#a8c648;--jungle-6:#9bbb36;--jungle-7:#8fb024;--jungle-8:#84a513;--jungle-9:#7a9908;--jungle-10:#658006;--jungle-11:#516605;--jungle-12:#3d4d04}

:root { --clr-accent-light: var(--lime-6); --clr-text-1-light: var(--sand-12); --clr-text-2-light: var(--sand-9); --clr-surface-1-light: var(--sand-0); --clr-surface-2-light: var(--sand-1); --clr-surface-3-light: var(--sand-2); --clr-surface-4-light: var(--sand-3); --clr-surface-1: var(--clr-surface-1-dark); --clr-text-1: var(--clr-text-1-dark); --ff-base: var(--ff-sans-serif); --fs-base: var(--step-0, 1.1rem); --font-lineheight-3: 1.5; --font-lineheight-0: 1.1; --clr-headings: var(--clr-text-1); --step-5: clamp(3.4332rem, 3.1679rem + 1.3269vw, 4.1962rem); --step-4: clamp(2.7466rem, 2.5343rem + 1.0615vw, 3.3569rem); --step-3: clamp(2.1973rem, 2.0274rem + 0.8492vw, 2.6855rem); --step-2: clamp(1.7578rem, 1.6219rem + 0.6793vw, 2.1484rem); --step-1: clamp(1.4063rem, 1.2976rem + 0.5435vw, 1.7188rem); --flow-space: 1em; --flow-space-l: calc(var(--flow-space) * 2); --font-weight-3: 300; --clr-link: var(--clr-accent); --clr-link-hover: var(--clr-text-1); --gap: var(--space-s); --clr-accent: var(--clr-accent-dark); --article-max-width: 90ch; --space-s-m: clamp(1.125rem, 0.7989rem + 1.6304vw, 2.0625rem); --article-space: var(--space-l-xl, 5rem); --link-underline-thickness: .75rem; --link-underline-offset: -.25rem; --lime-6: #82c91e; --sand-12: #121210; --sand-9: #4b4639; --sand-0: #f8fafb; --sand-1: #e6e4dc; --sand-2: #d5cfbd; --sand-3: #c2b9a0; --clr-surface-1-dark: var(--sand-12); --clr-text-1-dark: var(--sand-0); --ff-sans-serif: var(--font-industrial); --step-0: clamp(1.125rem, 1.038rem + 0.4348vw, 1.375rem); --space-s: clamp(1.125rem, 1.038rem + 0.4348vw, 1.375rem); --clr-accent-dark: var(--lime-6); --space-l-xl: clamp(2.25rem, 1.5978rem + 3.2609vw, 4.125rem); --font-industrial: Bahnschrift,DIN Alternate,Franklin Gothic Medium,Nimbus Sans Narrow,sans-serif-condensed,sans-serif; --ease-2: cubic-bezier(.25,0,.4,1); --animation-fade-in: fade-in .5s var(--ease-3); --ease-elastic-in-2: cubic-bezier(.5,-0.50,.75,1); --ease-3: cubic-bezier(.25,0,.3,1); }
/* 1. abstracts */
/* do not import the custom-properties.css - open-jit-props does its work for this file */
/* but optional: put all wanted extra props in here (Maybe some at the end?) */
/* for readable media queries, check the docs */
/* @import "open-props/postcss/extra/buttons.css"; */
/* 2. base */
/* Import reset/normalize and some general styles */
/* @import 'base/fonts.css'; */
/*  ---------------------------------------------------------------  */
/*   My personal normalize.css                                       */
/*   A mixture of                                                    */
/*                                                                   */
/*   A (more)) Modern CSS reset by Andy Bell                         */
/*   https://andy-bell.co.uk/a-more-modern-css-reset/                */
/*                                                                   */
/*   and                                                             */
/*   the normalize.css of Open Props                                 */
/*  ---------------------------------------------------------------  */
/* Box sizing rules */
*, *::before, *::after { box-sizing: border-box; }
:not(dialog) {
  margin: 0;
}
/* Color scheme */
:root {
  --csstools-color-scheme--light: initial;
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
:root {
  --csstools-color-scheme--light:  ;
} }
@media (prefers-color-scheme: light) {
  :root {
  /* color-scheme: light; */
  --clr-accent: var(--clr-accent-light);
  --clr-text-1: var(--clr-text-1-light);
  --clr-text-2: var(--clr-text-2-light);
  --clr-surface-1: var(--clr-surface-1-light);
  --clr-surface-2: var(--clr-surface-2-light);
  --clr-surface-3: var(--clr-surface-3-light);
  --clr-surface-4: var(--clr-surface-4-light);
  }
}
/* Remove default margins */
html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none; /* https://kilianvalkhof.com/2022/css-html/your-css-reset-needs-text-size-adjust-probably/ */

  @media (prefers-reduced-motion: no-preference) {
    scroll-behavior: smooth;
  }
}
@media (prefers-reduced-motion: no-preference) {
  :where(:focus-visible) {
    transition: outline-offset 145ms var(--ease-2);
  }
  :where(:not(:active):focus-visible) {
    transition-duration: .25s;
  }
}
:not(:active):focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 5px;
}
body {
  min-height: 100vh;
  background: var(--clr-surface-1);
  color: var(--clr-text-1);
  font-family: var(--ff-base);
  font-size: var(--fs-base);
  line-height: var(--font-lineheight-3);
}
/* Set shorter line heights on headings and interactive elements */
h1, h2, h3, h4, h5, h6,
button, input, label {
    line-height: var(--font-lineheight-0);
    color: var(--clr-headings);
}
h1, h2, h3, h4, h5 {
  text-wrap: balance;
}
h1 { font-size: var(--step-5) }
h2 { font-size: var(--step-4) }
h3 { font-size: var(--step-3) }
h4 { font-size: var(--step-2) }
h5 { font-size: var(--step-1) }
/* Vertikaler Rhythmus */
/* vertikaler Rhythmus von Inhaltselementen */
[class*="content-"]:where(:not(:first-child)), 
:is([class*="content-"], .rte) > * + * {
  margin-block-start: var(--flow-space);
}
[class*="content-"]:has(h2, h3, h4, h5, h6) {
  margin-block-start: var(--flow-space-l);
}
p, ul, ol, dl, h6, .website-title {
  font-weight: var(--font-weight-3);
}
/* Make text more readable (add more elements, if needed */
p, li, figcaption {
  text-wrap: pretty;
}
/* :where(:not(fieldset, progress, meter)) {
  border-width: 0;
  border-style: solid;
  background-origin: border-box;
  background-repeat: no-repeat;
} */
/*
:where(a, u, ins, abbr) {
  text-underline-offset: 1px;

  @supports (-moz-appearance: none) {
    text-underline-offset: 2px;
  }
}

:where(a[href], area, button, input:not([type="text"], [type="email"], [type="number"], [type="password"], [type=""], [type="tel"], [type="url"]), label[for], select, summary, [tabindex]:not([tabindex*="-"],pre)) {
  cursor: pointer;
}

:where(a[href], area, button, input, label[for], select, summary, textarea, [tabindex]:not([tabindex*="-"])) {
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
*/
a {
  color: var(--clr-link);
  text-decoration-color: var(--clr-link-hover);
  transition: all 0.25s ease-in;

  &:where(:visited) {
      text-decoration-color: var(--clr-link-hover);
  }

  &:where(:not(:hover)) {
      text-decoration: inherit;
  }
}
/*
:where(img, svg, video, canvas, audio, iframe, embed, object) {
  display: block;
}

:where(img, svg, video) {
  max-inline-size: 100%;
  block-size: auto;
} */
/* Make images and videos easier to work with */
img, picture, video {
  max-width: 100%;
  display: block;
  height: auto;
}
input, button, textarea, select,
input[type="file"]::-webkit-file-upload-button {
  font: inherit;
  /* font-size: inherit; */
  /* color: inherit; */
  /* letter-spacing: inherit; */
}
/*
::placeholder {
  color: var(--gray-7);
  opacity: .75;
}

:where(input:not([type="range"]), textarea) {
  padding-inline: var(--size-2);
  padding-block: var(--size-1);
}

:where(select) {
  padding-inline: var(--size-relative-4) 0;
  padding-block: .75ch;
  field-sizing: content;
}

:where(textarea, select, input:not([type="button"],[type="submit"],[type="reset"])) {
  background-color: var(--surface-2);
  border-radius: var(--radius-2);
}

:where(textarea) {
  resize: block;
  field-sizing: content;
  min-inline-size: var(--size-content-1);
  min-block-size: 2lh;
}

:where(input[type="checkbox"], input[type="radio"]) {
  block-size: var(--size-3);
  inline-size: var(--size-3);
}

:where(svg:not([width])) {
  inline-size: var(--size-10);
}

:where(code, kbd, samp, pre) { font-family: var(--ff-monospace), monospace; }
:where(:not(pre) > code, kbd) { white-space: nowrap }

:where(pre) {
  white-space: pre;
  min-inline-size: 0;
  max-inline-size: max-content;
  writing-mode: lr;
  direction: ltr;
}

:where(:not(pre) > code) {
  padding: var(--size-1) var(--size-2);
  background: var(--surface-2);
  border-radius: var(--radius-2);
  writing-mode: lr;
}

:where(kbd, var) {
  padding: var(--size-1) var(--size-2);
  border-width: var(--border-size-1);
  border-color: var(--surface-4);
  border-radius: var(--radius-2);
}

:where(mark) {
  border-radius: var(--radius-2);
  padding-inline: var(--size-1);
}

:where(ol, ul) { padding-inline-start: var(--size-8) }
:where(li) { padding-inline-start: var(--size-2) }
:where(li, dd, figcaption) { max-inline-size: var(--size-content-2) }
:where(p) { max-inline-size: var(--size-content-3); text-wrap: pretty; }
:where(dt, summary) { font-weight: var(--font-weight-7) }

:where(dt:not(:first-of-type)) {
  margin-block-start: var(--size-5);
}

:where(small) {
  font-size: max(.5em, var(--font-size-0));
  max-inline-size: var(--size-content-1);
}

:where(hr) {
  margin-block: var(--size-fluid-5);
  height: var(--border-size-2);
  background-color: var(--surface-3);
}

:where(figure) {
  display: grid;
  gap: var(--size-2);
  place-items: center;

  & > :where(figcaption) {
    font-size: var(--font-size-1);
    text-wrap: balance;
  }
}

:where(blockquote, :not(blockquote) > cite) {
  border-inline-start-width: var(--border-size-3);
}

:where(blockquote) {
  display: grid;
  gap: var(--size-3);
  padding-block: var(--size-3);
  padding-inline: var(--size-4);
  max-inline-size: var(--size-content-2);
}

:where(:not(blockquote) > cite) {
  padding-inline-start: var(--size-2);
}

:where(summary) {
  background: var(--surface-3);
  padding: var(--size-2) var(--size-3);
  margin: calc(var(--size-2) * -1) calc(var(--size-3) * -1);
  border-radius: var(--radius-2);
}

:where(details) {
  padding-inline: var(--size-3);
  padding-block: var(--size-2);
  background: var(--surface-2);
  border-radius: var(--radius-2);
}

:where(details[open] > summary) {
  margin-bottom: var(--size-2);
  border-end-start-radius: 0;
  border-end-end-radius: 0;
}

:where(fieldset) {
  border-radius: var(--radius-2);
  border: var(--border-size-1) solid var(--surface-4);
}

:where(del) {
  background: var(--red-9);
  color: var(--red-2);
}

:where(ins) {
  background: var(--green-9);
  color: var(--green-1);
}

:where(abbr) {
  text-decoration-color: var(--blue-5);
}

:where(dialog) {
  background-color: var(--surface-1);
  color: inherit;
  border-radius: var(--radius-3);
  box-shadow: var(--shadow-6);
}

:where(menu) {
  padding-inline-start: 0;
  display: flex;
  gap: var(--size-3);
}

:where(sup) {
  font-size: .5em;
}

:where(table) {
  width: fit-content;
  border: 1px solid var(--surface-2);
  background: var(--surface-2);
  border-radius: var(--radius-3);

  --nice-inner-radius: calc(var(--radius-3) - 2px);
}

:where(table:not(:has(tfoot)) tr:last-child td:first-child) {
  border-end-start-radius: var(--nice-inner-radius);
}

:where(table:not(:has(tfoot)) tr:last-child td:last-child) {
  border-end-end-radius: var(--nice-inner-radius);
}

:where(table thead tr:first-child th:first-child) {
  border-start-start-radius: var(--nice-inner-radius);
}

:where(table thead tr:first-child th:last-child) {
  border-start-end-radius: var(--nice-inner-radius);
}

:where(tfoot tr:last-child :is(th,td):first-of-type) {
  border-end-start-radius: var(--nice-inner-radius);
}

:where(tfoot tr:last-child :is(th,td):last-of-type) {
  border-end-end-radius: var(--nice-inner-radius);
}

:where(th) {
  color: var(--text-1);
  background-color: var(--surface-2);
}

:where(table :is(a, button, [contenteditable]):is(:focus-visible)) {
  outline-offset: -2px;
}

:where(td) {
  background: var(--surface-1);
  max-inline-size: var(--size-content-2);
  text-wrap: pretty;
}

:where(td,th) {
  text-align: left;
  padding: var(--size-2);
}

:where(:is(td,th):not([align])) {
	text-align: center;
}

:where(thead) {
  border-collapse: collapse;
}

:where(table tr:hover td),
:where(tbody tr:nth-child(even):hover td) {
  background-color: var(--surface-3);
}

:where(table > caption) {
  margin: var(--size-3);
}

:where(tfoot button) {
  padding-block: var(--size-1);
  padding-inline: var(--size-3);
} */
/* @import 'base/reset.css'; */
/* @import 'base/general.css'; */
/* ------------------- */
/* Utility classes     */
/* ------------------- */
/* general */
.flex {
    display: flex;
    gap: 1rem;
    gap: var(--gap, 1rem);
}
.grid {
    display: grid;
    grid-gap: 1rem;
    grid-gap: var(--gap, 1rem);
    gap: 1rem;
    gap: var(--gap, 1rem);
}
.invisible:not(:focus-visible) {
  position: absolute; 
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px; 
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
  }
/*

.skip-to-content {
  position: absolute;
  z-index: 9999;
  background: hsl( var(--clr-white) );
  color: hsl( var(--clr-dark) ); 
  padding: .5em 1em;
  margin-inline: auto;
  transform: translateY(-100%);
  transition: transform 250ms ease-in;
}

.skip-to-content:focus {
  transform: translateY(0);
}
*/
.accent {
  background: var(--clr-accent);
}
/* .grey {
  --clr-headings: var(--clr-white);
  color: var(--clr-white);
  background: var(--gradient-grey);
} */
/* 3. layout */
/* Contao container classes */
/* General structure

body
  |--#wrapper
        |--header
            |--.inside
        |--#container
            |--main
                |--.inside
                    |--.mod_article
                        |--.content-...
        |--footer
            |--.inside

/* Keep the footer at bottom of the page */
/* adjust the template rows according to the direct child elements */
#wrapper {
    min-height: 100vh;
    min-height: 100dvh;
    display: grid;
    grid-template-rows: auto 1fr auto; /* header #container footer */

    @media (prefers-reduced-motion: no-preference) {
        opacity: 0;
        animation: var(--animation-fade-in) forwards;
        animation-timing-function: var(--ease-elastic-in-2);
        animation-delay: .05s;
        animation-duration: .25s;
    }
}
/* width and centering for the inside container - classic approach */
:is(header, .mod_article, footer) > .inside {
    width: 100%;
    max-width: min(100vw - 3rem, 70rem);
    max-width: min(100vw - 3rem, var(--article-max-width, 70rem));
    margin-inline: auto;
}
header, footer {
    padding-block: var(--space-s-m);
}
header {
    & .inside {
        display: grid;
        grid-template-columns: 1fr 1fr;

        & :is(.sitename, .nav) {
            font-size: var(--step-2);  
        }

        @media (max-width: 767px) {
            grid-template-columns: 1fr;
            justify-items: center;
          }
    }
}
.mod_article {
    & .inside {
        --article-max-width: 70ch;
    }
    &.wide .inside {
        --article-max-width: 90ch;
    }
    &.full-width .inside {
        --article-max-width: 100vw;
    }
}
/* Abstand zwischen Header, main und Footer */
/* Abstand zwischen Artikeln im Bereich Main content */
/* Bei Custom Layoutbereichen muss dieID des Layoutbereichs muss mit custom- beginnen */
main .mod_article {
    padding-block: var(--article-space);
}
/* main .mod_article:first-child {
    padding-block-end: var(--article-space);
} */
/* @import 'layout/container_grid-solution.css'; */
/* @import 'layout/hero.css'; */
/* @import 'layout/hero_grid-solution.css'; */
/* @import 'layout/header.css'; */
/* @import 'layout/header_grid-solution.css'; */
/* @import 'layout/company-links.css'; */
/* @import 'layout/footer.css'; */
/* @import 'layout/footer_grid-solution.css'; */
/* 4. components & modules */
/* @import 'components/ce_text.css'; */
/* @import 'components/alerts.css'; */
/* e.g. error messages) */
/* @import 'components/ce_table.css'; */
/* @import 'components/ce_code.css'; */
/* @import 'components/ce_markdown.css'; */
/* @import 'components/media.css'; */
/* @import 'components/ce_gallery.css'; */
/* @import 'modules/navigation-temp.css'; */
/* In Contao give the main navigation the class nav--primary */
/* make the nav horizontal & move main nav to the right */
.nav--primary {
  inline-size: 100%;
  & ul {
    list-style-type: none;
    display: flex;
    flex-wrap: wrap;
    gap: var(--flow-space);
    justify-content: end;
    padding-inline-start: 0;
  }

  & :is(a, strong) {
    color: var(--clr-accent);
    -webkit-text-decoration: underline;
    text-decoration: underline;
    text-decoration-color: transparent;
    text-decoration-thickness: var(--link-underline-thickness);
    text-underline-offset: var(--link-underline-offset);
    -webkit-text-decoration-skip-ink: none;
            text-decoration-skip-ink: none;
    transition: all 0.25s ease-in;

    &:is(:hover, :focus, .active) {
      text-decoration-color: var(--clr-link-hover);
    }
  }
}
.sitename {
  & a {
    color: var(--clr-accent);
    -webkit-text-decoration: none;
    text-decoration: none;
  }
}
/* @import 'modules/breadcrumb.css'; */
/* @import 'modules/faq.css'; */
/* @import 'modules/news.css'; */
/* @import "components/events.css"; */
/* @import 'components/card.css'; */
/* @import 'components/buttons.css'; */
/* @import 'components/akkordeon.css'; */
/* @import 'components/downloads.css'; */
/* @import 'modules/newsletter.css'; */
/* 5. pages */
/* Special styles for specific pages (is this needed?) */
/* 6. themes */
/* Custom styles for this project */
/* @import 'themes/custom.css'; */
@keyframes fade-in {
    to { opacity: 1 }
  }
/*
  @keyframes fade-in-bloom {
    0% { opacity: 0; filter: brightness(1) blur(20px) }
   10% { opacity: 1; filter: brightness(2) blur(10px) }
  100% { opacity: 1; filter: brightness(1) blur(0) }
  }
  @keyframes fade-out {
    to { opacity: 0 }
  }
  @keyframes fade-out-bloom {
  100% { opacity: 0; filter: brightness(1) blur(20px) }
   10% { opacity: 1; filter: brightness(2) blur(10px) }
    0% { opacity: 1; filter: brightness(1) blur(0) }
  }
  @keyframes scale-up {
    to { transform: scale(1.25) }
  }
  @keyframes scale-down {
    to { transform: scale(.75) }
  }
  @keyframes slide-out-up {
    to { transform: translateY(-100%) }
  }
  @keyframes slide-out-down {
    to { transform: translateY(100%) }
  }
  @keyframes slide-out-right {
    to { transform: translateX(100%) }
  }
  @keyframes slide-out-left {
    to { transform: translateX(-100%) }
  }
  @keyframes slide-in-up {
    from { transform: translateY(100%) }
  }
*/
@keyframes slide-in-down {
    from { transform: translateY(-100%) }
  }
@keyframes slide-in-right {
    from { transform: translateX(-100%) }
  }
@keyframes slide-in-left {
    from { transform: translateX(100%) }
  }
/*
  @keyframes shake-x {
    0%, 100% { transform: translateX(0%) }
    20% { transform: translateX(-5%) }
    40% { transform: translateX(5%) }
    60% { transform: translateX(-5%) }
    80% { transform: translateX(5%) }
  }
  @keyframes shake-y {
    0%, 100% { transform: translateY(0%) }
    20% { transform: translateY(-5%) }
    40% { transform: translateY(5%) }
    60% { transform: translateY(-5%) }
    80% { transform: translateY(5%) }
  }
*/
@keyframes shake-z {
    0%, 100% { transform: rotate(0deg) }
    20% { transform: rotate(-2deg) }
    40% { transform: rotate(2deg) }
    60% { transform: rotate(-2deg) }
    80% { transform: rotate(2deg) }
  }
/*
  @keyframes spin {
    to { transform: rotate(1turn) }
  }
  @keyframes ping {
    90%, 100% {
      transform: scale(2);
      opacity: 0;
    }
  }
  @keyframes blink {
    0%, 100% {
      opacity: 1
    }
    50% {
      opacity: .5
    }
  }
  @keyframes float {
    50% { transform: translateY(-25%) }
  }
  @keyframes bounce {
    25% { transform: translateY(-20%) }
    40% { transform: translateY(-3%) }
    0%, 60%, 100% { transform: translateY(0) }
  }
  @keyframes pulse {
    50% { transform: scale(.9,.9) }
  }
  @media (--OSdark) {
    @keyframes fade-in-bloom {
      0% { opacity: 0; filter: brightness(1) blur(20px) }
     10% { opacity: 1; filter: brightness(0.5) blur(10px) }
    100% { opacity: 1; filter: brightness(1) blur(0) }
    }
  }
  @media (--OSdark) {
    @keyframes fade-out-bloom {
    100% { opacity: 0; filter: brightness(1) blur(20px) }
     10% { opacity: 1; filter: brightness(0.5) blur(10px) }
      0% { opacity: 1; filter: brightness(1) blur(0) }
    }
  }
*/