/*!
 * Typo3 11 0.13.1
 * https://www.loolab.de/
 *
 * Copyright 2020-2023 loolab
 *
 * Released on September 23, 2023
 * 
 * Author: loolab
 * Contributor: Tobias Garz <tobias.garz@loolab.de>
 */
@charset "UTF-8";
/* @docs
label: Core Remedies
version: 0.1.0-beta.2

note: |
  These remedies are recommended
  as a starter for any project.

category: file
*/
/* @docs
label: Box Sizing

note: |
  Use border-box by default, globally.

category: global
*/
*, ::before, ::after {
  box-sizing: border-box;
}

/* @docs
label: Line Sizing

note: |
  Consistent line-spacing,
  even when inline elements have different line-heights.

links:
  - https://drafts.csswg.org/css-inline-3/#line-sizing-property

category: global
*/
html {
  line-sizing: normal;
}

/* @docs
label: Body Margins

note: |
  Remove the tiny space around the edge of the page.

category: global
*/
body {
  margin: 0;
}

/* @docs
label: Heading Sizes

note: |
  Switch to rem units for headings

category: typography
*/
h1 {
  font-size: 2rem;
}

h2 {
  font-size: 1.5rem;
}

h3 {
  font-size: 1.17rem;
}

h4 {
  font-size: 1rem;
}

h5 {
  font-size: 0.83rem;
}

h6 {
  font-size: 0.67rem;
}

/* @docs
label: H1 Margins

note: |
  Keep h1 margins consistent, even when nested.

category: typography
*/
h1 {
  margin: 0.67em 0;
}

/* @docs
label: Pre Wrapping

note: |
  Overflow by default is bad...

category: typography
*/
pre {
  white-space: pre-wrap;
}

/* @docs
label: Horizontal Rule

note: |
  1. Solid, thin horizontal rules
  2. Remove Firefox `color: gray`
  3. Remove default `1px` height, and common `overflow: hidden`

category: typography
*/
hr {
  border-style: solid;
  border-width: 1px 0 0;
  color: inherit;
  height: 0;
  overflow: visible;
}

/* @docs
label: Responsive Embeds

note: |
  1. Block display is usually what we want
  2. Remove strange space-below when inline
  3. Responsive by default

category: embedded elements
*/
img, svg, video, canvas, audio, iframe, embed, object {
  display: block;
  vertical-align: middle;
  max-width: 100%;
}

/* @docs
label: Aspect Ratios

note: |
  Maintain intrinsic aspect ratios when `max-width` is applied.
  `iframe`, `embed`, and `object` are also embedded,
  but have no intrinsic ratio,
  so their `height` needs to be set explicitly.

category: embedded elements
*/
img, svg, video, canvas {
  height: auto;
}

/* @docs
label: Audio Width

note: |
  There is no good reason elements default to 300px,
  and audio files are unlikely to come with a width attribute.

category: embedded elements
*/
audio {
  width: 100%;
}

/* @docs
label: Image Borders

note: |
  Remove the border on images inside links in IE 10 and earlier.

category: legacy browsers
*/
img {
  border-style: none;
}

/* @docs
label: SVG Overflow

note: |
  Hide the overflow in IE 10 and earlier.

category: legacy browsers
*/
svg {
  overflow: hidden;
}

/* @docs
label: HTML5 Elements

note: |
  Default block display on HTML5 elements

category: legacy browsers
*/
article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
  display: block;
}

/* @docs
label: Checkbox & Radio Inputs

note: |
  1. Add the correct box sizing in IE 10
  2. Remove the padding in IE 10

category: legacy browsers
*/
[type=checkbox],
[type=radio] {
  box-sizing: border-box;
  padding: 0;
}

/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
.row {
  --bs-gutter-x: var(--loo-grid-gap-x);
  --bs-gutter-y: var(--loo-grid-gap-y);
}
.row:not(:last-child) {
  margin-bottom: var(--bs-gutter-y);
}

.modal-backdrop {
  --bs-backdrop-bg: var(--loo-backdrop-color);
  --bs-backdrop-opacity: var(--loo-backdrop-opacity);
  -webkit-backdrop-filter: var(--loo-backdrop-filter);
          backdrop-filter: var(--loo-backdrop-filter);
}

.sc-cookie {
  --sccookie-border-radius: var(--loo-border-radius);
  --sccookie-font-size: var(--loo-font-size-s);
  --sccookie-box-shadow: 0;
  --sccookie-duration-multiplier: var(--global-duration-multiplier);
  --sccookie-color-black-h: var(--loo-color-black-h);
  --sccookie-color-black-s: var(--loo-color-black-s);
  --sccookie-color-black-l: var(--loo-color-black-l);
  --sccookie-color-error-h: var(--loo-color-danger-h);
  --sccookie-color-error-s: var(--loo-color-danger-s);
  --sccookie-color-error-l: var(--loo-color-danger-l);
  --sccookie-color-primary-h: var(--loo-color-primary-h);
  --sccookie-color-primary-s: var(--loo-color-primary-s);
  --sccookie-color-primary-l: var(--loo-color-primary-l);
  --sccookie-color-success-h: var(--loo-color-success-h);
  --sccookie-color-success-s: var(--loo-color-success-s);
  --sccookie-color-success-l: var(--loo-color-success-l);
  --sccookie-focus-ring-alpha: 0;
  --sccookie-focus-ring-width: 0px; /* stylelint-disable-line length-zero-no-unit */
}
.sc-cookie-btn {
  --sccookie-button-background-color: var(--loolabsh-input-background-color);
  --sccookie-button-border-color: var(--loolabsh-input-border-color);
  --sccookie-button-border-width: var(--loolabsh-input-border-width);
  --sccookie-button-color: var(--loolabsh-input-color);
}
.sc-cookie-btn:focus:not([disabled]), .sc-cookie-btn:hover:not([disabled]) {
  --sccookie-button-background-color: var(--loolabsh-input-background-color);
  --sccookie-button-border-color: var(--loolabsh-input-border-color);
  --sccookie-button-color: var(--loolabsh-input-color);
}
.sc-cookie-btn.-edit, .sc-cookie-btn.-essential {
  --sccookie-button-border-color: var(--loolabsh-input-border-color);
}
.sc-cookie__controls {
  display: grid;
  grid-gap: var(--sccookie-spacing);
}
.sc-cookie__footer {
  --sccookie-footer-background-color: var(--sccookie-color-white);
  --sccookie-footer-color: var(--sccookie-color-black);
}
.sc-cookie-banner {
  border: 1px solid var(--loolabsh-color-border);
}
.sc-cookie-banner .sc-cookie-btn.-accept {
  margin-bottom: 0;
}
.sc-cookie-preferences {
  border: 1px solid var(--loolabsh-color-border);
}
.sc-cookie-preferences .sc-cookie-btn.-close {
  background-color: transparent;
  border: 0 none;
  padding: var(--loo-spacing-s);
  right: var(--sccookie-scrollbar-size);
  top: var(--sccookie-scrollbar-size);
  width: auto;
}

button.sc-cookie-trigger {
  --sccookie-position-offset: var(--loo-spacing-s);
  --sccookie-trigger-color: var(--loo-color-primary);
  --sccookie-trigger-color-hover: var(--loo-color-primary);
}
.page-footer-in-view button.sc-cookie-trigger {
  --sccookie-trigger-color: var(--loo-color-white);
  --sccookie-trigger-color-hover: var(--loo-color-white);
}

.fancybox-custom {
  --loo-fancybox-backdrop-color: var(--loo-backdrop-color);
  --loo-fancybox-backdrop-opacity: var(--loo-backdrop-opacity);
  --loo-fancybox-toolbar-button-size: 1.5em;
  --loo-fancybox-toolbar-padding-x: var(--loo-spacing-s);
  --loo-fancybox-toolbar-padding-y: var(--loo-spacing-s);
  --loo-fancybox-caption-max-width: var(--loo-page-max-width);
  --loo-fancybox-caption-offset-top: var(--loo-spacing);
  -webkit-backdrop-filter: var(--loo-backdrop-filter);
          backdrop-filter: var(--loo-backdrop-filter);
  color: var(--loo-color-black);
}

.fancybox-custom.fancybox__container {
  --carousel-button-height: var(--loo-fancybox-toolbar-button-size);
  --carousel-button-width: var(--loo-fancybox-toolbar-button-size);
  --carousel-button-svg-width: 80%;
  --carousel-button-svg-height: 80%;
  --carousel-button-svg-stroke-width: 2;
  --carousel-button-svg-filter: none;
}
body:not(.is-using-mouse) .fancybox-custom.fancybox__container :focus {
  box-shadow: none;
}

.fancybox-custom .fancybox__backdrop {
  animation-name: none !important; /* stylelint-disable-line declaration-no-important */
  background-color: var(--loo-fancybox-backdrop-color);
  opacity: 0;
  transition: opacity 0.35s ease-in-out;
}
.fancybox-custom.is-animated .fancybox__backdrop {
  opacity: var(--loo-fancybox-backdrop-opacity);
}

.fancybox-custom .fancybox__caption {
  max-width: var(--loo-fancybox-caption-max-width);
  padding-top: var(--loo-fancybox-caption-offset-top);
  transition: opacity 0.35s ease-in-out;
}
.fancybox-custom .fancybox__caption > * {
  display: inline;
  margin: 0;
}
.fancybox-custom .fancybox__caption > * + *::before {
  content: " "; /* stylelint-disable-line string-quotes */
}

.fancybox-custom .carousel__button {
  --carousel-button-shadow: none;
  font-size: 1rem;
}
.fancybox-custom .carousel__button:focus {
  outline: var(--loo-focus-outline-width) var(--loo-focus-outline-style) var(--loo-focus-outline-color);
  outline-offset: var(--loo-focus-outline-offset);
}

.fancybox-custom .fancybox__toolbar {
  --carousel-button-svg-width: 80%;
  --carousel-button-svg-height: 80%;
  background: none;
  padding: var(--loo-fancybox-toolbar-padding-y) var(--loo-fancybox-toolbar-padding-x);
  text-shadow: none;
}
.fancybox-custom .fancybox__toolbar .fancybox__button--zoom, .fancybox-custom .fancybox__toolbar .fancybox__button--fullscreen, .fancybox-custom .fancybox__toolbar .fancybox__button--slideshow {
  display: none;
}

.fancybox-custom .fancybox__slide {
  padding: calc(var(--loo-fancybox-toolbar-padding-x) * 2 + var(--loo-fancybox-toolbar-button-size)) var(--loo-spacing) var(--loo-spacing);
}

@font-face {
  font-weight: 400;
  font-display: swap;
  font-family: Bellota; /* stylelint-disable-line string-quotes */
  src: url('../default/media/fonts/Bellota/Bellota-Regular.woff2') format('woff2'), url('../default/media/fonts/Bellota/Bellota-Regular.woff') format('woff');
}
@font-face {
  font-weight: 700;
  font-display: swap;
  font-family: Bellota; /* stylelint-disable-line string-quotes */
  src: url('../default/media/fonts/Bellota/Bellota-700.woff2') format('woff2'), url('../default/media/fonts/Bellota/Bellota-700.woff') format('woff');
}
@font-face {
  font-weight: 300;
  font-display: swap;
  font-family: Ubuntu; /* stylelint-disable-line string-quotes */
  src: url('../default/media/fonts/Ubuntu/Ubuntu-300.woff2') format('woff2'), url('../default/media/fonts/Ubuntu/Ubuntu-300.woff') format('woff');
}
@font-face {
  font-weight: 400;
  font-display: swap;
  font-family: Ubuntu; /* stylelint-disable-line string-quotes */
  src: url('../default/media/fonts/Ubuntu/Ubuntu-Regular.woff2') format('woff2'), url('../default/media/fonts/Ubuntu/Ubuntu-Regular.woff') format('woff');
}
@font-face {
  font-weight: 500;
  font-display: swap;
  font-family: Ubuntu; /* stylelint-disable-line string-quotes */
  src: url('../default/media/fonts/Ubuntu/Ubuntu-500.woff2') format('woff2'), url('../default/media/fonts/Ubuntu/Ubuntu-500.woff') format('woff');
}
@font-face {
  font-weight: 700;
  font-display: swap;
  font-family: Ubuntu; /* stylelint-disable-line string-quotes */
  src: url('../default/media/fonts/Ubuntu/Ubuntu-700.woff2') format('woff2'), url('../default/media/fonts/Ubuntu/Ubuntu-700.woff') format('woff');
}
@font-face {
  font-weight: 300;
  font-display: swap;
  font-family: Raleway; /* stylelint-disable-line string-quotes */
  src: url('../default/media/fonts/Raleway/Raleway-300.woff2') format('woff2'), url('../default/media/fonts/Raleway/Raleway-300.woff') format('woff');
}
@font-face {
  font-weight: 400;
  font-display: swap;
  font-family: Raleway; /* stylelint-disable-line string-quotes */
  src: url('../default/media/fonts/Raleway/Raleway-Regular.woff2') format('woff2'), url('../default/media/fonts/Raleway/Raleway-Regular.woff') format('woff');
}
@font-face {
  font-weight: 500;
  font-display: swap;
  font-family: Raleway; /* stylelint-disable-line string-quotes */
  src: url('../default/media/fonts/Raleway/Raleway-500.woff2') format('woff2'), url('../default/media/fonts/Raleway/Raleway-500.woff') format('woff');
}
@font-face {
  font-weight: 700;
  font-display: swap;
  font-family: Raleway; /* stylelint-disable-line string-quotes */
  src: url('../default/media/fonts/Raleway/Raleway-700.woff2') format('woff2'), url('../default/media/fonts/Raleway/Raleway-700.woff') format('woff');
}
@font-face {
  font-weight: 900;
  font-display: swap;
  font-family: Raleway; /* stylelint-disable-line string-quotes */
  src: url('../default/media/fonts/Raleway/Raleway-900.woff2') format('woff2'), url('../default/media/fonts/Raleway/Raleway-900.woff') format('woff');
}
:root {
  --global-rootvar-prefix: loo-;
  --global-duration-multiplier: 1;
  --global-scroll-top-offset: 0px; /* stylelint-disable-line length-zero-no-unit */
  --loo-color-black-h: 0;
  --loo-color-black-s: 0%;
  --loo-color-black-l: 0%;
  --loo-color-black: hsl(var(--loo-color-black-h), var(--loo-color-black-s), var(--loo-color-black-l));
  --loo-color-black-lighten-h: var(--loo-color-black-h);
  --loo-color-black-lighten-s: var(--loo-color-black-s);
  --loo-color-black-lighten-l: 97%;
  --loo-color-black-lighten: hsl(var(--loo-color-black-lighten-h), var(--loo-color-black-lighten-s), var(--loo-color-black-lighten-l));
  --loo-color-white-h: 0;
  --loo-color-white-s: 0%;
  --loo-color-white-l: 100%;
  --loo-color-white: hsl(var(--loo-color-white-h), var(--loo-color-white-s), var(--loo-color-white-l));
  --loo-color-coral-h: 0;
  --loo-color-coral-s: 4%;
  --loo-color-coral-l: 25%;
  --loo-color-coral: hsl(var(--loo-color-coral-h), var(--loo-color-coral-s), var(--loo-color-coral-l));
  --loo-color-beige-h: 28;
  --loo-color-beige-s: 21%;
  --loo-color-beige-l: 86%;
  --loo-color-beige: hsl(var(--loo-color-beige-h), var(--loo-color-beige-s), var(--loo-color-beige-l));
  --loo-color-text-h: 0;
  --loo-color-text-s: 4%;
  --loo-color-text-l: 25%;
  --loo-color-text: hsl(var(--loo-color-text-h), var(--loo-color-text-s), var(--loo-color-text-l));
  --loo-color-primary-h: 5;
  --loo-color-primary-s: 49%;
  --loo-color-primary-l: 62%;
  --loo-color-primary: hsl(var(--loo-color-primary-h), var(--loo-color-primary-s), var(--loo-color-primary-l));
  --loo-color-primary-lighten-h: var(--loo-color-primary-h);
  --loo-color-primary-lighten-s: var(--loo-color-primary-s);
  --loo-color-primary-lighten-l: 90%;
  --loo-color-primary-lighten: hsl(var(--loo-color-primary-lighten-h), var(--loo-color-primary-lighten-s), var(--loo-color-primary-lighten-l));
  --loo-color-primary-contrast-h: 0;
  --loo-color-primary-contrast-s: 0%;
  --loo-color-primary-contrast-l: 100%;
  --loo-color-primary-contrast: hsl(var(--loo-color-primary-contrast-h), var(--loo-color-primary-contrast-s), var(--loo-color-primary-contrast-l));
  --loo-color-secondary-h: 148;
  --loo-color-secondary-s: 6%;
  --loo-color-secondary-l: 46%;
  --loo-color-secondary: hsl(var(--loo-color-secondary-h), var(--loo-color-secondary-s), var(--loo-color-secondary-l));
  --loo-color-secondary-lighten-h: var(--loo-color-secondary-h);
  --loo-color-secondary-lighten-s: var(--loo-color-secondary-s);
  --loo-color-secondary-lighten-l: 90%;
  --loo-color-secondary-lighten: hsl(var(--loo-color-secondary-lighten-h), var(--loo-color-secondary-lighten-s), var(--loo-color-secondary-lighten-l));
  --loo-color-secondary-contrast-h: 0;
  --loo-color-secondary-contrast-s: 0%;
  --loo-color-secondary-contrast-l: 100%;
  --loo-color-secondary-contrast: hsl(var(--loo-color-secondary-contrast-h), var(--loo-color-secondary-contrast-s), var(--loo-color-secondary-contrast-l));
  --loo-color-tertiary-h: 30;
  --loo-color-tertiary-s: 77%;
  --loo-color-tertiary-l: 66%;
  --loo-color-tertiary: hsl(var(--loo-color-tertiary-h), var(--loo-color-tertiary-s), var(--loo-color-tertiary-l));
  --loo-color-tertiary-lighten-h: var(--loo-color-tertiary-h);
  --loo-color-tertiary-lighten-s: var(--loo-color-tertiary-s);
  --loo-color-tertiary-lighten-l: 90%;
  --loo-color-tertiary-lighten: hsl(var(--loo-color-tertiary-lighten-h), var(--loo-color-tertiary-lighten-s), var(--loo-color-tertiary-lighten-l));
  --loo-color-tertiary-contrast-h: 0;
  --loo-color-tertiary-contrast-s: 0%;
  --loo-color-tertiary-contrast-l: 0%;
  --loo-color-tertiary-contrast: hsl(var(--loo-color-tertiary-contrast-h), var(--loo-color-tertiary-contrast-s), var(--loo-color-tertiary-contrast-l));
  --loo-color-lemon-h: 47;
  --loo-color-lemon-s: 100%;
  --loo-color-lemon-l: 96%;
  --loo-color-lemon: hsl(var(--loo-color-lemon-h), var(--loo-color-lemon-s), var(--loo-color-lemon-l));
  --loo-color-lemon-contrast-h: 0;
  --loo-color-lemon-contrast-s: 0%;
  --loo-color-lemon-contrast-l: 0%;
  --loo-color-lemon-contrast: hsl(var(--loo-color-lemon-contrast-h), var(--loo-color-lemon-contrast-s), var(--loo-color-lemon-contrast-l));
  --loo-color-danger-h: 355;
  --loo-color-danger-s: 55%;
  --loo-color-danger-l: 59%;
  --loo-color-danger: hsl(var(--loo-color-danger-h), var(--loo-color-danger-s), var(--loo-color-danger-l));
  --loo-color-danger-contrast-h: 0;
  --loo-color-danger-contrast-s: 0%;
  --loo-color-danger-contrast-l: 100%;
  --loo-color-danger-contrast: hsl(var(--loo-color-danger-contrast-h), var(--loo-color-danger-contrast-s), var(--loo-color-danger-contrast-l));
  --loo-color-success-h: 158;
  --loo-color-success-s: 41%;
  --loo-color-success-l: 46%;
  --loo-color-success: hsl(var(--loo-color-success-h), var(--loo-color-success-s), var(--loo-color-success-l));
  --loo-color-success-contrast-h: 0;
  --loo-color-success-contrast-s: 0%;
  --loo-color-success-contrast-l: 100%;
  --loo-color-success-contrast: hsl(var(--loo-color-success-contrast-h), var(--loo-color-success-contrast-s), var(--loo-color-success-contrast-l));
  --loo-color-warning-h: 37;
  --loo-color-warning-s: 81%;
  --loo-color-warning-l: 58%;
  --loo-color-warning: hsl(var(--loo-color-warning-h), var(--loo-color-warning-s), var(--loo-color-warning-l));
  --loo-color-warning-contrast-h: 0;
  --loo-color-warning-contrast-s: 0%;
  --loo-color-warning-contrast-l: 0%;
  --loo-color-warning-contrast: hsl(var(--loo-color-warning-contrast-h), var(--loo-color-warning-contrast-s), var(--loo-color-warning-contrast-l));
  --loo-color-info-h: 189;
  --loo-color-info-s: 31%;
  --loo-color-info-l: 51%;
  --loo-color-info: hsl(var(--loo-color-info-h), var(--loo-color-info-s), var(--loo-color-info-l));
  --loo-color-info-contrast-h: 0;
  --loo-color-info-contrast-s: 0%;
  --loo-color-info-contrast-l: 0%;
  --loo-color-info-contrast: hsl(var(--loo-color-info-contrast-h), var(--loo-color-info-contrast-s), var(--loo-color-info-contrast-l));
  --loo-font-family-sans: 'Raleway', 'Ubuntu', Arial, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
  --loo-font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
  --loo-font-family-heading: 'Bellota', 'Courier New', monospace;
  --loo-font-family-logo: 'Bellota', 'Courier New', monospace;
  --loo-root-font-size: 16px;
  --loo-font-size-xxs: calc(var(--loo-root-font-size) - 4px);
  --loo-font-size-xs: calc(var(--loo-root-font-size) - 3px);
  --loo-font-size-s: calc(var(--loo-root-font-size) - 2px);
  --loo-font-size-l: calc(var(--loo-root-font-size) + 4px);
  --loo-font-size-xl: calc(var(--loo-root-font-size) + 8px);
  --loo-h1-font-size: calc(var(--loo-root-font-size) + 32px);
  --loo-h2-font-size: calc(var(--loo-root-font-size) + 24px);
  --loo-h3-font-size: calc(var(--loo-root-font-size) + 16px);
  --loo-h4-font-size: calc(var(--loo-root-font-size) + 8px);
  --loo-h5-font-size: calc(var(--loo-root-font-size) + 4px);
  --loo-h1-font-size-mobile: calc(var(--loo-root-font-size) + 20px);
  --loo-h2-font-size-mobile: calc(var(--loo-root-font-size) + 16px);
  --loo-h3-font-size-mobile: calc(var(--loo-root-font-size) + 12px);
  --loo-h4-font-size-mobile: calc(var(--loo-root-font-size) + 6px);
  --loo-h5-font-size-mobile: calc(var(--loo-root-font-size) + 2px);
  /*
   TODO: dynamisches Berechnen der korrekten Zeilenhöhe
   	anhand der angegebenen Schriftgröße
  */
  --loo-font-weight-light: 300;
  --loo-font-weight-regular: 400;
  --loo-font-weight-medium: 500;
  --loo-font-weight-bold: 700;
  --loo-font-weight-bolder: 900;
  --loo-heading-font-family: var(--loo-font-family-heading);
  --loo-spacing: 16px;
  --loo-spacing-xxs: calc(16px / 8);
  --loo-spacing-xs: calc(16px / 4);
  --loo-spacing-s: calc(16px / 2);
  --loo-spacing-l: calc(16px * 2);
  --loo-spacing-xl: calc(16px * 4);
  --loo-spacing-xxl: calc(16px * 8);
  --loo-grid-gap-x: var(--loo-spacing);
  --loo-grid-gap-y: var(--loo-spacing);
  --loo-breakpoint-xs: 0;
  --loo-breakpoint-s: 576px;
  --loo-breakpoint-m: 768px;
  --loo-breakpoint-l: 992px;
  --loo-breakpoint-xl: 1200px;
  --loo-breakpoint-xxl: 1400px;
  --loo-zindex-page-header: 20;
  --loo-zindex-page-search: 15;
  --loo-zindex-page-scroll-top: 50;
  --loo-zindex-page-menu: 100;
  --loo-zindex-page-footer: 10;
  --loo-zindex-page-loader: 9000;
  --loo-zindex-scroll-progress: 90;
  --loo-body-background-color: var(--loo-color-lemon);
  --loo-body-color: var(--loo-color-text);
  --loo-body-font-family: var(--loo-font-family-sans);
  --loo-body-font-size: 1rem;
  --loo-body-font-weight: 400;
  --loo-body-line-height: 1.4;
  --loo-page-max-width: 1400px;
  --loo-page-offset: 1rem;
  --loo-content-element-margin: var(--loo-spacing-l);
  --loo-block-element-margin: var(--loo-spacing);
  --loo-link-color: currentColor;
  --loo-link-color-hover: var(--loo-color-primary);
  --loo-selection-background-color: var(--loo-color-secondary);
  --loo-selection-color: var(--loo-color-secondary-contrast);
  --loo-backdrop-color-h: var(--loo-color-white-h);
  --loo-backdrop-color-s: var(--loo-color-white-s);
  --loo-backdrop-color-l: var(--loo-color-white-l);
  --loo-backdrop-color: hsl(var(--loo-color-white-h), var(--loo-color-white-s), var(--loo-color-white-l));
  --loo-backdrop-filter: none;
  --loo-backdrop-opacity: 0.75;
  --loo-focus-ring-h: var(--loo-color-secondary-h);
  --loo-focus-ring-s: var(--loo-color-secondary-s);
  --loo-focus-ring-l: var(--loo-color-secondary-l);
  --loo-focus-ring-alpha: 0.25;
  --loo-focus-ring-width: 3px;
  --loo-focus-ring-box-shadow: 0 0 0 var(--loo-focus-ring-width) hsla(var(--loo-focus-ring-h), var(--loo-focus-ring-s), var(--loo-focus-ring-l), var(--loo-focus-ring-alpha));
  --loo-focus-ring-box-shadow-inset: inset 0 0 0 var(--loo-focus-ring-width) hsla(var(--loo-focus-ring-h), var(--loo-focus-ring-s), var(--loo-focus-ring-l), var(--loo-focus-ring-alpha));
  --loo-focus-outline-color: currentColor;
  --loo-focus-outline-offset: 2px;
  --loo-focus-outline-style: dotted;
  --loo-focus-outline-width: 1px;
  --loo-ratio-16x9: calc(9 / 16 * 100%);
  --loo-ratio-4x3: calc(3 / 4 * 100%);
  --loo-ratio-3x4: calc(4 / 3 * 100%);
  --loo-ratio-3x2: calc(2 / 3 * 100%);
  --loo-ratio-2x3: calc(3 / 2 * 100%);
  --loo-ratio-1x1: calc(1 / 1 * 100%);
  --loo-border-width: 2px;
  --loo-border-radius-xs: 2px;
  --loo-border-radius-s: 4px;
  --loo-border-radius-m: 8px;
  --loo-border-radius-l: 16px;
  --loo-border-radius: 0;
  --loo-transition-average: calc(var(--global-duration-multiplier, 1) * 0.25s);
  --loo-transition-complex: calc(var(--global-duration-multiplier, 1) * 0.5s);
  --loo-transition-check: calc(var(--global-duration-multiplier, 1) * 0.15s);
  --loo-transition-expand: calc(var(--global-duration-multiplier, 1) * 0.3s);
  --loo-transition-collape: calc(var(--global-duration-multiplier, 1) * 0.25s);
  --loo-transition-open: calc(var(--global-duration-multiplier, 1) * 0.25s);
  --loo-transition-close: calc(var(--global-duration-multiplier, 1) * 0.2s);
  --loo-transition: 0.2s;
  --loo-scrollbar-size: 6px;
  --loo-scrollbar-color: var(--loo-color-black);
  --loo-scrollbar-track-color: var(--loo-color-white);
}

@media (min-width: 992px) {
  :root {
    --loo-root-font-size: 18px;
    --loo-grid-gap-x: var(--loo-spacing-l);
    --loo-grid-gap-y: var(--loo-spacing-l);
    --loo-page-offset: calc(1rem * 2);
    --loo-content-element-margin: var(--loo-spacing-xl);
    --loo-block-element-margin: calc(var(--loo-spacing) * 3);
  }
}
@media (prefers-reduced-motion: reduce) {
  :root {
    --global-duration-multiplier: 0.0; /* stylelint-disable-line number-no-trailing-zeros */
  }
}
:root {
  font-size: var(--loo-root-font-size);
}
@media (prefers-reduced-motion: no-preference) {
  :root {
    scroll-behavior: smooth;
  }
}

html {
  background-color: var(--loo-body-background-color);
  box-sizing: border-box;
  min-height: 100%;
  scroll-behavior: smooth;
  -webkit-scroll-snap-type: y mandatory;
          scroll-snap-type: y mandatory;
}
html.browser-not-supported {
  background-color: #fff !important; /* stylelint-disable-line declaration-no-important */
}
html.browser-not-supported .browser-not-supported__info {
  background-color: #000;
  color: #fff;
  display: block;
  left: 50%;
  max-width: 32rem;
  padding: 16px 32px;
  position: fixed;
  text-align: center;
  top: 1rem;
  transform: translateX(-50%);
  width: 90%;
}

body {
  background-color: var(--loo-body-background-color);
  color: var(--loo-body-color);
  font-family: var(--loo-body-font-family);
  font-size: var(--loo-body-font-size);
  font-style: normal;
  font-variant: normal;
  font-weight: var(--loo-body-font-weight);
  line-height: var(--loo-body-line-height);
  min-height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
  position: relative;
}
body.page-layout-homepage .page-loader .logo.-default {
  display: none;
}
body.page-layout-homepage .page-loader .logo.-animated {
  display: block;
}
@media (min-width: 1200px) {
  body {
    background-attachment: fixed;
    background-image: url(./media/elements/blob_white.svg), url(./media/elements/blob_white.svg);
    background-position: left -100px center, right -100px center;
    background-repeat: no-repeat, no-repeat;
    background-size: 350px, 400px;
  }
}
body .page-loader {
  align-items: center;
  background: var(--loo-color-lemon);
  color: var(--loo-color-black);
  display: flex;
  font-size: 64px;
  height: 100%;
  justify-content: center;
  left: 0;
  opacity: 0;
  position: fixed;
  top: 0;
  transition: all 0.5s ease-in-out;
  transform: scale(0);
  width: 100%;
  z-index: -1;
}
body .page-loader .page-logo {
  --page-logo-height: 8rem;
  --page-logo-dot-color: var(--loo-color-black);
  --page-logo-leftarc-color: var(--loo-color-black);
  --page-logo-rightarc-color: var(--loo-color-black);
}
@media (min-width: 1200px) {
  body .page-loader .page-logo {
    --page-logo-height: 16rem;
  }
}
body .page-loader .page-logo.-animated {
  display: none;
}
body .page-loader .page-logo.-default {
  display: block;
}
body._loading .page-loader {
  opacity: 1;
  transform: scale(1);
  z-index: 9999;
}
body::-webkit-scrollbar {
  height: var(--loo-scrollbar-size, 6px);
  width: var(--loo-scrollbar-size, 6px);
}
body::-webkit-scrollbar-thumb {
  background: var(--loo-scrollbar-color, #000);
}
body::-webkit-scrollbar-track {
  background: var(--loo-scrollbar-track-color, #fff);
}
body {
  scrollbar-face-color: var(--loo-scrollbar-color, #000);
  scrollbar-track-color: var(--loo-scrollbar-track-color, #fff);
}
.page-complete body {
  overflow-y: auto;
  pointer-events: all;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

::-moz-selection {
  background-color: var(--loo-selection-background-color);
  color: var(--loo-selection-color);
}

::selection {
  background-color: var(--loo-selection-background-color);
  color: var(--loo-selection-color);
}

svg:not(:root) {
  overflow: hidden;
}

:focus-visible {
  outline: var(--loo-focus-outline-width) var(--loo-focus-outline-style) var(--focus-outline-color, var(--loo-focus-outline-color));
  outline-offset: var(--loo-focus-outline-offset);
}

/* stylelint-disable string-quotes */
a:focus,
button:focus,
[type=submit]:focus,
[type=button]:focus {
  box-shadow: none;
  outline: none;
}
a._focus-visible:focus, a.focus-visible:focus, a:focus-visible:focus,
button._focus-visible:focus,
button.focus-visible:focus,
button:focus-visible:focus,
[type=submit]._focus-visible:focus,
[type=submit].focus-visible:focus,
[type=submit]:focus-visible:focus,
[type=button]._focus-visible:focus,
[type=button].focus-visible:focus,
[type=button]:focus-visible:focus {
  outline: var(--loo-focus-outline-width) var(--loo-focus-outline-style) var(--focus-outline-color, var(--loo-focus-outline-color));
  outline-offset: var(--loo-focus-outline-offset);
}

/* stylelint-enable string-quotes */
a {
  text-decoration: none;
}

:-webkit-any-link {
  --loo-link-color: currentColor;
  --loo-link-color-hover: var(--loo-link-color);
  --loo-link-icon-color: var(--loo-link-color);
  --loo-link-icon-color-hover: var(--loo-link-color-hover);
  --loo-link-text-decoration-line: underline;
  --loo-link-text-decoration-hover: var(--loo-link-text-decoration);
  --loo-focus-outline-color: currentColor;
  --_link-icon-color: var(--loo-link-icon-color);
  --_link-duration: calc(var(--global-duration-multiplier, 1) * var(--loo-transition));
  color: var(--loo-link-color);
  font-weight: var(--loo-link-font-weight, inherit);
  -webkit-transition: color var(--_link-duration), background-color var(--loo-transition), border-color var(--loo-transition);
  transition: color var(--_link-duration), background-color var(--loo-transition), border-color var(--loo-transition);
}

:-moz-any-link {
  --loo-link-color: currentColor;
  --loo-link-color-hover: var(--loo-link-color);
  --loo-link-icon-color: var(--loo-link-color);
  --loo-link-icon-color-hover: var(--loo-link-color-hover);
  --loo-link-text-decoration-line: underline;
  --loo-link-text-decoration-hover: var(--loo-link-text-decoration);
  --loo-focus-outline-color: currentColor;
  --_link-icon-color: var(--loo-link-icon-color);
  --_link-duration: calc(var(--global-duration-multiplier, 1) * var(--loo-transition));
  color: var(--loo-link-color);
  font-weight: var(--loo-link-font-weight, inherit);
  -moz-transition: color var(--_link-duration), background-color var(--loo-transition), border-color var(--loo-transition);
  transition: color var(--_link-duration), background-color var(--loo-transition), border-color var(--loo-transition);
}

:any-link {
  --loo-link-color: currentColor;
  --loo-link-color-hover: var(--loo-link-color);
  --loo-link-icon-color: var(--loo-link-color);
  --loo-link-icon-color-hover: var(--loo-link-color-hover);
  --loo-link-text-decoration-line: underline;
  --loo-link-text-decoration-hover: var(--loo-link-text-decoration);
  --loo-focus-outline-color: currentColor;
  --_link-icon-color: var(--loo-link-icon-color);
  --_link-duration: calc(var(--global-duration-multiplier, 1) * var(--loo-transition));
  color: var(--loo-link-color);
  font-weight: var(--loo-link-font-weight, inherit);
  transition: color var(--_link-duration), background-color var(--loo-transition), border-color var(--loo-transition);
}
:-webkit-any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo) {
  --loo-link-text-decoration-color: var(--loo-color-primary);
  --loo-link-text-decoration-hover: var(--loo-color-primary);
  --loo-link-text-decoration-thickness: 1px;
  position: relative;
  text-decoration: none;
}
:-moz-any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo) {
  --loo-link-text-decoration-color: var(--loo-color-primary);
  --loo-link-text-decoration-hover: var(--loo-color-primary);
  --loo-link-text-decoration-thickness: 1px;
  position: relative;
  text-decoration: none;
}
:any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo) {
  --loo-link-text-decoration-color: var(--loo-color-primary);
  --loo-link-text-decoration-hover: var(--loo-color-primary);
  --loo-link-text-decoration-thickness: 1px;
  position: relative;
  text-decoration: none;
}
:-webkit-any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo)::before, :-webkit-any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo)::after {
  bottom: 0;
  content: "";
  display: block;
  height: var(--loo-link-text-decoration-thickness);
  left: 0;
  position: absolute;
  -webkit-transition: max-width 0.5s ease-in-out;
  transition: max-width 0.5s ease-in-out;
  width: 100%;
}
:-moz-any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo)::before, :-moz-any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo)::after {
  bottom: 0;
  content: "";
  display: block;
  height: var(--loo-link-text-decoration-thickness);
  left: 0;
  position: absolute;
  -moz-transition: max-width 0.5s ease-in-out;
  transition: max-width 0.5s ease-in-out;
  width: 100%;
}
:any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo)::before, :any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo)::after {
  bottom: 0;
  content: "";
  display: block;
  height: var(--loo-link-text-decoration-thickness);
  left: 0;
  position: absolute;
  transition: max-width 0.5s ease-in-out;
  width: 100%;
}
:-webkit-any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo)::before {
  background: var(--loo-link-text-decoration-color);
  max-width: 0;
  z-index: 1;
}
:-moz-any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo)::before {
  background: var(--loo-link-text-decoration-color);
  max-width: 0;
  z-index: 1;
}
:any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo)::before {
  background: var(--loo-link-text-decoration-color);
  max-width: 0;
  z-index: 1;
}
:-webkit-any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo)::after {
  background: var(--loo-link-color);
  z-index: 0;
}
:-moz-any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo)::after {
  background: var(--loo-link-color);
  z-index: 0;
}
:any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo)::after {
  background: var(--loo-link-color);
  z-index: 0;
}
:-webkit-any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo):focus::before, :-webkit-any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo):hover::before {
  max-width: 500px;
}
:-moz-any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo):focus::before, :-moz-any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo):hover::before {
  max-width: 500px;
}
:any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo):focus::before, :any-link:not(.nav-link):not(.button):not(.icon-link):not(.-no-deco):not(.page-logo):hover::before {
  max-width: 500px;
}
:-webkit-any-link > i {
  color: var(--_link-icon-color);
  margin-right: var(--loo-spacing-s);
}
:-moz-any-link > i {
  color: var(--_link-icon-color);
  margin-right: var(--loo-spacing-s);
}
:any-link > i {
  color: var(--_link-icon-color);
  margin-right: var(--loo-spacing-s);
}
:-webkit-any-link[href*="tel:"] { /* stylelint-disable-line string-quotes */
  color: inherit;
  text-decoration: none;
}
:-moz-any-link[href*="tel:"] { /* stylelint-disable-line string-quotes */
  color: inherit;
  text-decoration: none;
}
:any-link[href*="tel:"] { /* stylelint-disable-line string-quotes */
  color: inherit;
  text-decoration: none;
}
:-webkit-any-link:hover, :-webkit-any-link:active, :-webkit-any-link:focus, :-webkit-any-link:focus-visible {
  --_link-icon-color: var(--loo-link-icon-color-hover);
  color: var(--loo-link-color-hover);
  -webkit-text-decoration-color: var(--loo-link-text-decoration-hover);
          text-decoration-color: var(--loo-link-text-decoration-hover);
}
:-moz-any-link:hover, :-moz-any-link:active, :-moz-any-link:focus, :-moz-any-link:focus-visible {
  --_link-icon-color: var(--loo-link-icon-color-hover);
  color: var(--loo-link-color-hover);
  text-decoration-color: var(--loo-link-text-decoration-hover);
}
:any-link:hover, :any-link:active, :any-link:focus, :any-link:focus-visible {
  --_link-icon-color: var(--loo-link-icon-color-hover);
  color: var(--loo-link-color-hover);
  -webkit-text-decoration-color: var(--loo-link-text-decoration-hover);
          text-decoration-color: var(--loo-link-text-decoration-hover);
}
:-webkit-any-link:hover, :-webkit-any-link:focus {
  cursor: pointer;
}
:-moz-any-link:hover, :-moz-any-link:focus {
  cursor: pointer;
}
:any-link:hover, :any-link:focus {
  cursor: pointer;
}
:-webkit-any-link._disabled {
  --loo-link-text-decoration-style: line-through;
  color: var(--loo-link-color);
  pointer-events: none;
}
:-moz-any-link._disabled {
  --loo-link-text-decoration-style: line-through;
  color: var(--loo-link-color);
  pointer-events: none;
}
:any-link._disabled {
  --loo-link-text-decoration-style: line-through;
  color: var(--loo-link-color);
  pointer-events: none;
}
:-webkit-any-link._disabled * {
  pointer-events: none;
}
:-moz-any-link._disabled * {
  pointer-events: none;
}
:any-link._disabled * {
  pointer-events: none;
}

hr {
  background-color: currentColor;
  border: 0;
  color: var(--loo-color-black);
  margin: var(--loo-spacing) 0;
}
hr:not([size]) {
  height: 1px;
}

p {
  margin: 0 0 var(--loo-paragraph-margin, var(--loo-block-element-margin));
}

blockquote {
  margin: 0 0 var(--loo-blockquote-margin, var(--loo-block-element-margin));
}

table {
  width: 100%;
}

iframe {
  border: 0 none;
  min-width: 100%;
}

figure,
.figure,
picture,
.picture {
  background-color: transparent;
  border: 0 none;
  border-radius: 0;
  display: block;
  padding: 0;
  position: relative;
  width: 100%;
}

img {
  border: 0;
  display: block;
  height: auto;
  max-width: 100%;
}

.time__time {
  display: none;
}
.time__time::before {
  content: ', ';
}

.application-context-bar {
  display: none;
  background-color: var(--loo-color-warning);
  bottom: 0;
  color: var(--loo-color-warning-contrast);
  font-size: 12px;
  left: 50%;
  padding: 0.125rem 0.25rem;
  pointer-events: none;
  position: fixed;
  text-align: center;
  transform: translateX(-50%);
  z-index: 9999;
}
.application-context-bar > span {
  text-transform: uppercase;
}
.application-context-bar.-staging {
  width: 100%;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
  color: var(--loo-heading-color, var(--loo-color-body-text));
  display: block;
  font-family: var(--loo-heading-font-family, var(--loo-font-family-sans));
  font-size: var(--loo-heading-font-size, 1rem);
  font-weight: var(--loo-heading-font-weight, var(--loo-font-weight-bold));
  -webkit-hyphens: manual;
  hyphens: manual;
  line-height: var(--loo-heading-line-height, 1.2);
  margin: 0 0 var(--loo-heading-margin, 1.125rem);
  overflow-wrap: break-word;
  width: 100%;
  word-wrap: break-word;
}
h1 > *, .h1 > *, h2 > *, .h2 > *, h3 > *, .h3 > *, h4 > *, .h4 > *, h5 > *, .h5 > *, h6 > *, .h6 > * {
  line-height: inherit !important;
}
h1 > a, .h1 > a, h2 > a, .h2 > a, h3 > a, .h3 > a, h4 > a, .h4 > a, h5 > a, .h5 > a, h6 > a, .h6 > a {
  color: inherit;
}
h1:first-child, .h1:first-child, h2:first-child, .h2:first-child, h3:first-child, .h3:first-child, h4:first-child, .h4:first-child, h5:first-child, .h5:first-child, h6:first-child, .h6:first-child {
  margin-top: 0;
}
h1:last-child, .h1:last-child, h2:last-child, .h2:last-child, h3:last-child, .h3:last-child, h4:last-child, .h4:last-child, h5:last-child, .h5:last-child, h6:last-child, .h6:last-child {
  margin-bottom: 0;
}

h1,
.h1 {
  --loo-heading-font-size: var(--loo-h1-font-size-mobile);
}
@media (min-width: 768px) {
  h1,
  .h1 {
    --loo-heading-font-size: var(--loo-h1-font-size);
  }
}

h2,
.h2 {
  --loo-heading-font-size: var(--loo-h2-font-size-mobile);
}
@media (min-width: 768px) {
  h2,
  .h2 {
    --loo-heading-font-size: var(--loo-h2-font-size);
  }
}

h3,
.h3 {
  --loo-heading-font-size: var(--loo-h3-font-size-mobile);
}
@media (min-width: 768px) {
  h3,
  .h3 {
    --loo-heading-font-size: var(--loo-h3-font-size);
  }
}

h4,
.h4 {
  --loo-heading-font-size: var(--loo-h4-font-size-mobile);
}
@media (min-width: 768px) {
  h4,
  .h4 {
    --loo-heading-font-size: var(--loo-h4-font-size);
  }
}

h5,
.h5 {
  --loo-heading-font-size: var(--loo-h5-font-size-mobile);
}
@media (min-width: 768px) {
  h5,
  .h5 {
    --loo-heading-font-size: var(--loo-h5-font-size);
  }
}

h1,
.h1 {
  --loo-heading-line-height: var(--loo-h1-line-height-mobile);
}
@media (min-width: 768px) {
  h1,
  .h1 {
    --loo-heading-line-height: var(--loo-h1-line-height);
  }
}

h2,
.h2 {
  --loo-heading-line-height: var(--loo-h2-line-height-mobile);
}
@media (min-width: 768px) {
  h2,
  .h2 {
    --loo-heading-line-height: var(--loo-h2-line-height);
  }
}

h3,
.h3 {
  --loo-heading-line-height: var(--loo-h3-line-height-mobile);
}
@media (min-width: 768px) {
  h3,
  .h3 {
    --loo-heading-line-height: var(--loo-h3-line-height);
  }
}

h4,
.h4 {
  --loo-heading-line-height: var(--loo-h4-line-height-mobile);
}
@media (min-width: 768px) {
  h4,
  .h4 {
    --loo-heading-line-height: var(--loo-h4-line-height);
  }
}

h5,
.h5 {
  --loo-heading-line-height: var(--loo-h5-line-height-mobile);
}
@media (min-width: 768px) {
  h5,
  .h5 {
    --loo-heading-line-height: var(--loo-h5-line-height);
  }
}

em,
.em {
  font-style: italic;
}

small,
.small,
.text-small {
  font-size: var(--loo-font-size-s);
}

mark,
.mark {
  background-color: var(--loo-mark-background-color, var(--loo-color-secondary));
  color: var(--loo-mark-color, var(--loo-color-secondary-contrast));
  padding: 0 var(--loo-spacing-xs);
}

del,
s {
  -webkit-text-decoration-line: line-through;
          text-decoration-line: line-through;
}

del {
  color: var(--loo-del-color, hsl(var(--loo-color-black-h), var(--loo-color-black-s), 70%));
}

b,
strong,
.strong {
  font-weight: var(--loo-font-weight-bold);
}

.text-color-primary {
  color: var(--loo-color-primary);
}
.text-color-primary a:not(.button) {
  --loo-link-color: currentColor;
}
.text-color-secondary {
  color: var(--loo-color-secondary);
}
.text-color-secondary a:not(.button) {
  --loo-link-color: currentColor;
}
.text-color-danger {
  color: var(--loo-color-danger);
}
.text-color-danger a:not(.button) {
  --loo-link-color: currentColor;
}
.text-color-success {
  color: var(--loo-color-success);
}
.text-color-success a:not(.button) {
  --loo-link-color: currentColor;
}
.text-color-warning {
  color: var(--loo-color-warning);
}
.text-color-warning a:not(.button) {
  --loo-link-color: currentColor;
}
.text-color-info {
  color: var(--loo-color-info);
}
.text-color-info a:not(.button) {
  --loo-link-color: currentColor;
}
.text-color- {
  color: var(--loo-color-);
}
.text-color- a:not(.button) {
  --loo-link-color: currentColor;
}
.text-align-left {
  text-align: left;
}
.text-align-right {
  text-align: right;
}
.text-align-center {
  text-align: center;
}
.text-align-justify {
  text-align: justify;
}
.text-size-xxs {
  font-size: var(--loo-font-size-xxs);
}
.text-size-xs {
  font-size: var(--loo-font-size-xs);
}
.text-size-s {
  font-size: var(--loo-font-size-s);
}
.text-size-l {
  font-size: var(--loo-font-size-l);
}
.text-size-xl {
  font-size: var(--loo-font-size-xl);
}

.subtitle::before {
  content: "( "; /* stylelint-disable-line string-quotes */
  padding-right: 0.125em;
}
.subtitle::after {
  content: ")"; /* stylelint-disable-line string-quotes */
  padding-left: 0.125em;
}

/* stylelint-disable-line length-zero-no-unit */
:root {
  --loolabsh-color-black-h: 0;
  --loolabsh-color-black-s: 0%;
  --loolabsh-color-black-l: 0%;
  --loolabsh-color-black: hsl(var(--loolabsh-color-black-h), var(--loolabsh-color-black-s), var(--loolabsh-color-black-l));
  --loolabsh-color-white-h: 0;
  --loolabsh-color-white-s: 0%;
  --loolabsh-color-white-l: 100%;
  --loolabsh-color-white: hsl(var(--loolabsh-color-white-h), var(--loolabsh-color-white-s), var(--loolabsh-color-white-l));
  --loolabsh-color-grey-h: 0;
  --loolabsh-color-grey-s: 0%;
  --loolabsh-color-grey-l: 91%;
  --loolabsh-color-grey: hsl(var(--loolabsh-color-grey-h), var(--loolabsh-color-grey-s), var(--loolabsh-color-grey-l));
  --loolabsh-color-grey-light-h: 0;
  --loolabsh-color-grey-light-s: 0%;
  --loolabsh-color-grey-light-l: 95%;
  --loolabsh-color-grey-light: hsl(var(--loolabsh-color-grey-light-h), var(--loolabsh-color-grey-light-s), var(--loolabsh-color-grey-light-l));
  --loolabsh-color-border-h: 0;
  --loolabsh-color-border-s: 0%;
  --loolabsh-color-border-l: 58%;
  --loolabsh-color-border: hsl(var(--loolabsh-color-border-h), var(--loolabsh-color-border-s), var(--loolabsh-color-border-l));
  --loolabsh-color-placeholder-h: 0;
  --loolabsh-color-placeholder-s: 0%;
  --loolabsh-color-placeholder-l: 58%;
  --loolabsh-color-placeholder: hsl(var(--loolabsh-color-placeholder-h), var(--loolabsh-color-placeholder-s), var(--loolabsh-color-placeholder-l));
  --loolabsh-color-text-h: 0;
  --loolabsh-color-text-s: 0%;
  --loolabsh-color-text-l: 24%;
  --loolabsh-color-text: hsl(var(--loolabsh-color-text-h), var(--loolabsh-color-text-s), var(--loolabsh-color-text-l));
  --loolabsh-color-ui-h: 5;
  --loolabsh-color-ui-s: 49%;
  --loolabsh-color-ui-l: 62%;
  --loolabsh-color-ui: hsl(var(--loolabsh-color-ui-h), var(--loolabsh-color-ui-s), var(--loolabsh-color-ui-l));
  --loolabsh-color-ui-contrast-h: 0;
  --loolabsh-color-ui-contrast-s: 0%;
  --loolabsh-color-ui-contrast-l: 100%;
  --loolabsh-color-ui-contrast: hsl(var(--loolabsh-color-ui-contrast-h), var(--loolabsh-color-ui-contrast-s), var(--loolabsh-color-ui-contrast-l));
  --loolabsh-color-danger-h: 355;
  --loolabsh-color-danger-s: 96%;
  --loolabsh-color-danger-l: 61%;
  --loolabsh-color-danger: hsl(var(--loolabsh-color-danger-h), var(--loolabsh-color-danger-s), var(--loolabsh-color-danger-l));
  --loolabsh-color-danger-contrast-h: 0;
  --loolabsh-color-danger-contrast-s: 0%;
  --loolabsh-color-danger-contrast-l: 100%;
  --loolabsh-color-danger-contrast: hsl(var(--loolabsh-color-danger-contrast-h), var(--loolabsh-color-danger-contrast-s), var(--loolabsh-color-danger-contrast-l));
  --loolabsh-color-success-h: 158;
  --loolabsh-color-success-s: 80%;
  --loolabsh-color-success-l: 42%;
  --loolabsh-color-success: hsl(var(--loolabsh-color-success-h), var(--loolabsh-color-success-s), var(--loolabsh-color-success-l));
  --loolabsh-color-success-contrast-h: 0;
  --loolabsh-color-success-contrast-s: 0%;
  --loolabsh-color-success-contrast-l: 100%;
  --loolabsh-color-success-contrast: hsl(var(--loolabsh-color-success-contrast-h), var(--loolabsh-color-success-contrast-s), var(--loolabsh-color-success-contrast-l));
  --loolabsh-color-warning-h: 37;
  --loolabsh-color-warning-s: 98%;
  --loolabsh-color-warning-l: 53%;
  --loolabsh-color-warning: hsl(var(--loolabsh-color-warning-h), var(--loolabsh-color-warning-s), var(--loolabsh-color-warning-l));
  --loolabsh-color-warning-contrast-h: 0;
  --loolabsh-color-warning-contrast-s: 0%;
  --loolabsh-color-warning-contrast-l: 0%;
  --loolabsh-color-warning-contrast: hsl(var(--loolabsh-color-warning-contrast-h), var(--loolabsh-color-warning-contrast-s), var(--loolabsh-color-warning-contrast-l));
  --loolabsh-color-info-h: 189;
  --loolabsh-color-info-s: 64%;
  --loolabsh-color-info-l: 49%;
  --loolabsh-color-info: hsl(var(--loolabsh-color-info-h), var(--loolabsh-color-info-s), var(--loolabsh-color-info-l));
  --loolabsh-color-info-contrast-h: 0;
  --loolabsh-color-info-contrast-s: 0%;
  --loolabsh-color-info-contrast-l: 0%;
  --loolabsh-color-info-contrast: hsl(var(--loolabsh-color-info-contrast-h), var(--loolabsh-color-info-contrast-s), var(--loolabsh-color-info-contrast-l));
  --loolabsh-focus-outline-width: 1px;
  --loolabsh-focus-outline-style: dotted;
  --loolabsh-focus-outline-color: currentColor;
  --loolabsh-focus-outline-offset: 2px;
  --loolabsh-backdrop-color: var(--loolabsh-color-black);
  --loolabsh-backdrop-filter: none;
  --loolabsh-backdrop-opacity: 0.5;
  --loolabsh-font-size: 1rem;
  --loolabsh-font-size-xs: 0.5rem;
  --loolabsh-font-size-s: 0.75rem;
  --loolabsh-font-size-l: 1.25rem;
  --loolabsh-spacing: 1rem;
  --loolabsh-spacing-xxs: 0.125rem;
  --loolabsh-spacing-xs: 0.25rem;
  --loolabsh-spacing-s: 0.5rem;
  --loolabsh-spacing-l: 1.25rem;
  --loolabsh-breakpoint-xs: 0;
  --loolabsh-breakpoint-s: 576px;
  --loolabsh-breakpoint-m: 768px;
  --loolabsh-breakpoint-l: 992px;
  --loolabsh-breakpoint-xl: 1200px;
  --loolabsh-border-radius: 0px;
  --loolabsh-border-width: 1px;
  --loolabsh-input-background-color: var(--loolabsh-color-white);
  --loolabsh-input-color: var(--loolabsh-color-black);
  --loolabsh-input-border-color: var(--loolabsh-color-border);
  --loolabsh-input-border-width: var(--loolabsh-border-width);
  --loolabsh-input-disabled-background-color: var(--loolabsh-color-white);
  --loolabsh-input-disabled-opacity: var(--loolabsh-disabled-opacity, 0.4);
  --loolabsh-input-readonly-background-color: var(--loolabsh-color-grey-light);
  --loolabsh-input-readonly-opacity: var(--loolabsh-readonly-opacity, 1);
  --loolabsh-input-height: 40px;
  --loolabsh-input-height-s: 30px;
  --loolabsh-input-height-l: 50px;
}

:root {
  --loolabsh-color-border-h: var(--loo-color-black-h);
  --loolabsh-color-border-s: var(--loo-color-black-s);
  --loolabsh-color-border-l: 85%;
  --loolabsh-color-text-h: var(--loo-color-text-h);
  --loolabsh-color-text-s: var(--loo-color-text-s);
  --loolabsh-color-text-l: var(--loo-color-text-l);
  --loolabsh-color-ui-h: var(--loo-color-primary-h);
  --loolabsh-color-ui-s: var(--loo-color-primary-s);
  --loolabsh-color-ui-l: var(--loo-color-primary-l);
  --loolabsh-color-ui-contrast-h: var(--loo-color-primary-contrast-h);
  --loolabsh-color-ui-contrast-s: var(--loo-color-primary-contrast-s);
  --loolabsh-color-ui-contrast-l: var(--loo-color-primary-contrast-l);
  --loolabsh-color-danger-h: var(--loo-color-danger-h);
  --loolabsh-color-danger-s: var(--loo-color-danger-s);
  --loolabsh-color-danger-l: var(--loo-color-danger-l);
  --loolabsh-color-danger-contrast-h: var(--loo-color-danger-contrast-h);
  --loolabsh-color-danger-contrast-s: var(--loo-color-danger-contrast-s);
  --loolabsh-color-danger-contrast-l: var(--loo-color-danger-contrast-l);
  --loolabsh-color-success-h: var(--loo-color-success-h);
  --loolabsh-color-success-s: var(--loo-color-success-s);
  --loolabsh-color-success-l: var(--loo-color-success-l);
  --loolabsh-color-success-contrast-h: var(--loo-color-success-contrast-h);
  --loolabsh-color-success-contrast-s: var(--loo-color-success-contrast-s);
  --loolabsh-color-success-contrast-l: var(--loo-color-success-contrast-l);
  --loolabsh-color-warning-h: var(--loo-color-warning-h);
  --loolabsh-color-warning-s: var(--loo-color-warning-s);
  --loolabsh-color-warning-l: var(--loo-color-warning-l);
  --loolabsh-color-warning-contrast-h: var(--loo-color-warning-contrast-h);
  --loolabsh-color-warning-contrast-s: var(--loo-color-warning-contrast-s);
  --loolabsh-color-warning-contrast-l: var(--loo-color-warning-contrast-l);
  --loolabsh-color-info-h: var(--loo-color-info-h);
  --loolabsh-color-info-s: var(--loo-color-info-s);
  --loolabsh-color-info-l: var(--loo-color-info-l);
  --loolabsh-color-info-contrast-h: var(--loo-color-info-contrast-h);
  --loolabsh-color-info-contrast-s: var(--loo-color-info-contrast-s);
  --loolabsh-color-info-contrast-l: var(--loo-color-info-contrast-l);
  --loolabsh-focus-outline-width: var(--loo-focus-outline-width);
  --loolabsh-focus-outline-style: var(--loo-focus-outline-style);
  --loolabsh-focus-outline-color: var(--loo-focus-outline-color);
  --loolabsh-focus-outline-offset: var(--loo-focus-outline-offset);
  --loolabsh-backdrop-color: var(--loo-backdrop-color);
  --loolabsh-backdrop-filter: var(--loo-backdrop-filter);
  --loolabsh-backdrop-opacity: var(--loo-backdrop-opacity);
  --loolabsh-font-size-xs: var(--loo-font-size-xs);
  --loolabsh-font-size-s: var(--loo-font-size-s);
  --loolabsh-font-size-l: var(--loo-font-size-l);
  --loolabsh-spacing: var(--loo-spacing);
  --loolabsh-spacing-xxs: var(--loo-spacing-xxs);
  --loolabsh-spacing-xs: var(--loo-spacing-xs);
  --loolabsh-spacing-s: var(--loo-spacing-s);
  --loolabsh-spacing-l: var(--loo-spacing-l);
  --loolabsh-border-radius: var(--loo-border-radius);
  --loolabsh-border-width: var(--loo-border-width);
  --loolabsh-scroll-progress-zindex: var(--loo-zindex-scroll-progress);
}

.alert {
  --loolabsh-alert-border-radius: var(--loolabsh-border-radius, 0px);
  --loolabsh-alert-border-width: var(--loolabsh-border-width, 1px);
  --loolabsh-alert-color: var(--loolabsh-color-text, #3e3e3e);
  --loolabsh-alert-font-size: var(--loolabsh-font-size-s, 0.75rem);
  --loolabsh-alert-icon-font-size: var(--loolabsh-alert-font-size);
  --loolabsh-alert-padding-x: var(--loolabsh-spacing, 1rem);
  --loolabsh-alert-padding-y: var(--loolabsh-spacing, 1rem);
  --loolabsh-alert-duration: var(--loolabsh-duration, 0.15s);
  --loolabsh-alert-accent-color: var(--loolabsh-alert-color);
  --_al-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-alert-duration));
  align-items: stretch;
  background-color: var(--loolabsh-alert-background-color, transparent);
  border: var(--loolabsh-alert-border-width) solid var(--loolabsh-alert-border-color, var(--loolabsh-border-color, #959595));
  border-radius: var(--loolabsh-alert-border-radius);
  color: var(--loolabsh-alert-color);
  display: flex;
  padding: 0;
  position: relative;
  transition: all var(--_al-duration) ease-in-out;
}
.alert::before {
  --_al-offset: 0;
  background-color: var(--loolabsh-alert-accent-color);
  border-top-left-radius: var(--loolabsh-alert-border-radius);
  border-top-right-radius: var(--loolabsh-alert-border-radius);
  content: ""; /* stylelint-disable-line string-quotes */
  display: block;
  height: var(--loolabsh-alert-accent-size, calc(var(--loolabsh-alert-border-width) * 2));
  left: var(--_al-offset);
  position: absolute;
  right: var(--_al-offset);
  top: var(--_al-offset);
  z-index: 3;
}
.alert__message {
  flex: 1 1 auto;
  font-size: var(--loolabsh-alert-font-size);
  order: 2;
  overflow: hidden;
  padding: var(--loolabsh-alert-padding-y) var(--loolabsh-alert-padding-x);
}
.alert__icon {
  align-items: center;
  color: var(--loolabsh-alert-accent-color);
  display: flex;
  flex: 0 0 auto;
  font-size: var(--loolabsh-alert-icon-font-size);
  margin-left: var(--loolabsh-alert-padding-x);
  order: 1;
}
.alert__close {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  font-size: var(--loolabsh-alert-icon-font-size);
  order: 3;
  padding-right: calc(var(--loolabsh-alert-padding-x) / 2);
}
.alert__close > .icon-button {
  --loolabsh-icon-button-color-hover: var(--loolabsh-alert-color);
}
[dir=rtl] .alert { /* stylelint-disable-line string-quotes */ }
[dir=rtl] .alert__message {
  text-align: right;
}
[dir=rtl] .alert__icon {
  margin-left: 0;
  margin-right: var(--loolabsh-alert-padding-x);
}

.alert.-primary {
  --loolabsh-alert-accent-color: var(--loolabsh-color-ui, #ce776f);
}

.alert.-info {
  --loolabsh-alert-accent-color: var(--loolabsh-color-info, #2db5cd);
}

.alert.-success {
  --loolabsh-alert-accent-color: var(--loolabsh-color-success, #15c182);
}

.alert.-warning {
  --loolabsh-alert-accent-color: var(--loolabsh-color-warning, #fca311);
}

.alert.-danger {
  --loolabsh-alert-accent-color: var(--loolabsh-color-danger, #fb3e4e);
}

.alert {
  --loolabsh-alert-border-radius: var(--loo-spacing-s);
  --loolabsh-alert-border-color: var(--loo-color-text);
  --loolabsh-alert-icon-font-size: var(--loo-font-size-l);
}
.alert__icon, .alert__close {
  border-radius: 50%;
  background-color: var(--loo-color-coral);
  color: var(--loo-color-white);
  display: flex;
  height: var(--loo-spacing-l);
  justify-content: center;
  margin: 0;
  padding: var(--loo-spacing-xs);
  position: absolute;
  top: 0;
  width: var(--loo-spacing-l);
  z-index: 3;
}
.alert__icon {
  left: 0;
  transform: translate(-50%, -50%);
}
.alert__close {
  right: 0;
  transform: translate(50%, -50%);
}
.alert.-primary {
  --loolabsh-alert-border-color: var(--loo-color-primary, #ce7870);
}
.alert.-primary .alert__icon,
.alert.-primary .alert__close {
  background-color: var(--loo-color-primary, #ce7870);
  color: var(--loo-color-primary-contrast, #fff);
}
.alert.-secondary {
  --loolabsh-alert-border-color: var(--loo-color-secondary, #6e7d75);
}
.alert.-secondary .alert__icon,
.alert.-secondary .alert__close {
  background-color: var(--loo-color-secondary, #6e7d75);
  color: var(--loo-color-secondary-contrast, #fff);
}
.alert.-tertiary {
  --loolabsh-alert-border-color: var(--loo-color-tertiary, #eba966);
}
.alert.-tertiary .alert__icon,
.alert.-tertiary .alert__close {
  background-color: var(--loo-color-tertiary, #eba966);
  color: var(--loo-color-tertiary-contrast, #000);
}
.alert.-info {
  --loolabsh-alert-border-color: var(--loo-color-info, #5c9da9);
}
.alert.-info .alert__icon,
.alert.-info .alert__close {
  background-color: var(--loo-color-info, #5c9da9);
  color: var(--loo-color-info-contrast, #000);
}
.alert.-success {
  --loolabsh-alert-border-color: var(--loo-color-success, #46a783);
}
.alert.-success .alert__icon,
.alert.-success .alert__close {
  background-color: var(--loo-color-success, #46a783);
  color: var(--loo-color-success-contrast, #fff);
}
.alert.-warning {
  --loolabsh-alert-border-color: var(--loo-color-warning, #eba83c);
}
.alert.-warning .alert__icon,
.alert.-warning .alert__close {
  background-color: var(--loo-color-warning, #eba83c);
  color: var(--loo-color-warning-contrast, #000);
}
.alert.-danger {
  --loolabsh-alert-border-color: var(--loo-color-danger, #cf5c66);
}
.alert.-danger .alert__icon,
.alert.-danger .alert__close {
  background-color: var(--loo-color-danger, #cf5c66);
  color: var(--loo-color-danger-contrast, #fff);
}

.badge {
  align-items: center;
  background-color: var(--loolabsh-badge-background-color, transparent);
  border: var(--loolabsh-badge-border-width, var(--loolabsh-border-width, 1px)) solid var(--loolabsh-badge-border-color, var(--loolabsh-badge-background-color));
  border-radius: var(--loolabsh-badge-border-radius, var(--loolabsh-border-radius, 0px));
  color: var(--loolabsh-badge-color, inherit);
  cursor: inherit;
  display: inline-flex;
  font-size: var(--loolabsh-badge-font-size, var(--loolabsh-font-size-s, 0.75rem));
  font-weight: var(--loolabsh-badge-font-weight, normal);
  justify-content: center;
  line-height: 1;
  padding: var(--loolabsh-badge-padding-y, var(--loolabsh-spacing-xs, 0.25rem)) var(--loolabsh-badge-padding-x, var(--loolabsh-spacing-s, 0.5rem));
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  white-space: nowrap;
}
a.badge {
  pointer-events: all;
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
}
a.badge:link, a.badge:visited, a.badge:hover, a.badge:focus, a.badge:active {
  color: var(--loolabsh-badge-color);
}
a.badge:focus {
  box-shadow: none;
  outline: none;
}

.badge.-default {
  --loolabsh-badge-background-color: var(--loolabsh-color-grey, #e8e8e8);
  --loolabsh-badge-color: var(--loolabsh-color-text, #3e3e3e);
}

.badge.-primary {
  --loolabsh-badge-background-color: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-badge-color: var(--loolabsh-color-ui-contrast, #fff);
}

.badge.-danger {
  --loolabsh-badge-background-color: var(--loolabsh-color-danger, #fb3e4e);
  --loolabsh-badge-color: var(--loolabsh-color-danger-contrast, #fff);
}

.badge.-info {
  --loolabsh-badge-background-color: var(--loolabsh-color-info, #2db5cd);
  --loolabsh-badge-color: var(--loolabsh-color-info-contrast, #000);
}

.badge.-success {
  --loolabsh-badge-background-color: var(--loolabsh-color-success, #15c182);
  --loolabsh-badge-color: var(--loolabsh-color-success-contrast, #fff);
}

.badge.-warning {
  --loolabsh-badge-background-color: var(--loolabsh-color-warning, #fca311);
  --loolabsh-badge-color: var(--loolabsh-color-warning-contrast, #000);
}

.badge.-pill {
  --loolabsh-badge-border-radius: 10rem;
}

.badge.-outline {
  --loolabsh-badge-background-color: transparent;
}
.badge.-outline:not(.-default) {
  --loolabsh-badge-color: var(--loolabsh-badge-background-color);
}

@keyframes badge-pulse {
  0% {
    box-shadow: 0 0 0 0 var(--_badge-pulse-color);
  }
  70% {
    box-shadow: 0 0 0 var(--_badge-pulse-size) transparent;
  }
  100% {
    box-shadow: 0 0 0 0 transparent;
  }
}
.badge.-pulse {
  --_badge-pulse-color: var(--loolabsh-badge-pulse-color, var(--loolabsh-badge-background-color));
  --_badge-pulse-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-badge-pulse-duration, 1.5s));
  --_badge-pulse-size: var(--loolabsh-badge-pulse-size, 0.5em);
  animation: badge-pulse var(--_badge-pulse-duration) infinite;
}

.badge-group {
  align-content: flex-start;
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--loolabsh-badge-group-gap, var(--loolabsh-spacing-s, 0.5rem));
}
.badge-group .badge {
  align-self: flex-start;
}

.badge {
  --loolabsh-badge-border-radius: var(--loo-spacing-xs);
  --loolabsh-badge-border-width: 2px;
}

.badge.-primary {
  --loolabsh-badge-border-color: var(--loo-color-primary, #ce7870);
}
.badge.-primary:not(.-outline) {
  --loolabsh-badge-background-color: var(--loo-color-primary, #ce7870);
  --loolabsh-badge-color: var(--loo-color-primary-contrast, #fff);
}
.badge.-primary.-outline {
  --loolabsh-badge-background-color: var(--loo-color-white);
  --loolabsh-badge-color: var(--loo-color-black);
}

a.badge.-primary:not(.-outline):hover, a.badge.-primary:not(.-outline):focus {
  --loolabsh-badge-background-color: hsla(var(--loo-color-primary-h), var(--loo-color-primary-s), var(--loo-color-primary-l), 85%);
}
a.badge.-primary.-outline:hover, a.badge.-primary.-outline:focus {
  --loolabsh-badge-background-color: var(--loo-color-primary, #ce7870);
  --loolabsh-badge-color: var(--loo-color-primary-contrast, #fff);
}

.badge.-secondary {
  --loolabsh-badge-border-color: var(--loo-color-secondary, #6e7d75);
}
.badge.-secondary:not(.-outline) {
  --loolabsh-badge-background-color: var(--loo-color-secondary, #6e7d75);
  --loolabsh-badge-color: var(--loo-color-secondary-contrast, #fff);
}
.badge.-secondary.-outline {
  --loolabsh-badge-background-color: var(--loo-color-white);
  --loolabsh-badge-color: var(--loo-color-black);
}

a.badge.-secondary:not(.-outline):hover, a.badge.-secondary:not(.-outline):focus {
  --loolabsh-badge-background-color: hsla(var(--loo-color-secondary-h), var(--loo-color-secondary-s), var(--loo-color-secondary-l), 85%);
}
a.badge.-secondary.-outline:hover, a.badge.-secondary.-outline:focus {
  --loolabsh-badge-background-color: var(--loo-color-secondary, #6e7d75);
  --loolabsh-badge-color: var(--loo-color-secondary-contrast, #fff);
}

.badge.-tertiary {
  --loolabsh-badge-border-color: var(--loo-color-tertiary, #eba966);
}
.badge.-tertiary:not(.-outline) {
  --loolabsh-badge-background-color: var(--loo-color-tertiary, #eba966);
  --loolabsh-badge-color: var(--loo-color-tertiary-contrast, #000);
}
.badge.-tertiary.-outline {
  --loolabsh-badge-background-color: var(--loo-color-white);
  --loolabsh-badge-color: var(--loo-color-black);
}

a.badge.-tertiary:not(.-outline):hover, a.badge.-tertiary:not(.-outline):focus {
  --loolabsh-badge-background-color: hsla(var(--loo-color-tertiary-h), var(--loo-color-tertiary-s), var(--loo-color-tertiary-l), 85%);
}
a.badge.-tertiary.-outline:hover, a.badge.-tertiary.-outline:focus {
  --loolabsh-badge-background-color: var(--loo-color-tertiary, #eba966);
  --loolabsh-badge-color: var(--loo-color-tertiary-contrast, #000);
}

.badge.-info {
  --loolabsh-badge-border-color: var(--loo-color-info, #5c9da9);
}
.badge.-info:not(.-outline) {
  --loolabsh-badge-background-color: var(--loo-color-info, #5c9da9);
  --loolabsh-badge-color: var(--loo-color-info-contrast, #000);
}
.badge.-info.-outline {
  --loolabsh-badge-background-color: var(--loo-color-white);
  --loolabsh-badge-color: var(--loo-color-black);
}

a.badge.-info:not(.-outline):hover, a.badge.-info:not(.-outline):focus {
  --loolabsh-badge-background-color: hsla(var(--loo-color-info-h), var(--loo-color-info-s), var(--loo-color-info-l), 85%);
}
a.badge.-info.-outline:hover, a.badge.-info.-outline:focus {
  --loolabsh-badge-background-color: var(--loo-color-info, #5c9da9);
  --loolabsh-badge-color: var(--loo-color-info-contrast, #000);
}

.badge.-success {
  --loolabsh-badge-border-color: var(--loo-color-success, #46a783);
}
.badge.-success:not(.-outline) {
  --loolabsh-badge-background-color: var(--loo-color-success, #46a783);
  --loolabsh-badge-color: var(--loo-color-success-contrast, #fff);
}
.badge.-success.-outline {
  --loolabsh-badge-background-color: var(--loo-color-white);
  --loolabsh-badge-color: var(--loo-color-black);
}

a.badge.-success:not(.-outline):hover, a.badge.-success:not(.-outline):focus {
  --loolabsh-badge-background-color: hsla(var(--loo-color-success-h), var(--loo-color-success-s), var(--loo-color-success-l), 85%);
}
a.badge.-success.-outline:hover, a.badge.-success.-outline:focus {
  --loolabsh-badge-background-color: var(--loo-color-success, #46a783);
  --loolabsh-badge-color: var(--loo-color-success-contrast, #fff);
}

.badge.-warning {
  --loolabsh-badge-border-color: var(--loo-color-warning, #eba83c);
}
.badge.-warning:not(.-outline) {
  --loolabsh-badge-background-color: var(--loo-color-warning, #eba83c);
  --loolabsh-badge-color: var(--loo-color-warning-contrast, #000);
}
.badge.-warning.-outline {
  --loolabsh-badge-background-color: var(--loo-color-white);
  --loolabsh-badge-color: var(--loo-color-black);
}

a.badge.-warning:not(.-outline):hover, a.badge.-warning:not(.-outline):focus {
  --loolabsh-badge-background-color: hsla(var(--loo-color-warning-h), var(--loo-color-warning-s), var(--loo-color-warning-l), 85%);
}
a.badge.-warning.-outline:hover, a.badge.-warning.-outline:focus {
  --loolabsh-badge-background-color: var(--loo-color-warning, #eba83c);
  --loolabsh-badge-color: var(--loo-color-warning-contrast, #000);
}

.badge.-danger {
  --loolabsh-badge-border-color: var(--loo-color-danger, #cf5c66);
}
.badge.-danger:not(.-outline) {
  --loolabsh-badge-background-color: var(--loo-color-danger, #cf5c66);
  --loolabsh-badge-color: var(--loo-color-danger-contrast, #fff);
}
.badge.-danger.-outline {
  --loolabsh-badge-background-color: var(--loo-color-white);
  --loolabsh-badge-color: var(--loo-color-black);
}

a.badge.-danger:not(.-outline):hover, a.badge.-danger:not(.-outline):focus {
  --loolabsh-badge-background-color: hsla(var(--loo-color-danger-h), var(--loo-color-danger-s), var(--loo-color-danger-l), 85%);
}
a.badge.-danger.-outline:hover, a.badge.-danger.-outline:focus {
  --loolabsh-badge-background-color: var(--loo-color-danger, #cf5c66);
  --loolabsh-badge-color: var(--loo-color-danger-contrast, #fff);
}

.breadcrumb {
  --loolabsh-breadcrumb-color: currentColor;
  --loolabsh-breadcrumb-font-weight: normal;
  --loolabsh-breadcrumb-gap-x: var(--loolabsh-spacing, 1rem);
  --loolabsh-breadcrumb-gap-y: calc(var(--loolabsh-breadcrumb-gap-x) / 2);
  --loolabsh-breadcrumb-prefix-suffix-gap: var(--loolabsh-spacing-s, 0.5rem);
  --loolabsh-breadcrumb-prefix-suffix-font-size: var(--loolabsh-font-size-s, 0.75rem);
  --_brcr-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-breadcrumb-duration, 0.15s));
  background-color: var(--loolabsh-breadcrumb-background-color, transparent);
  color: var(--loolabsh-breadcrumb-color);
  display: block;
  font-size: var(--loolabsh-breadcrumb-font-size, var(--loolabsh-font-size, 1rem));
  font-weight: var(--loolabsh-breadcrumb-font-weight);
  margin: 0;
  padding: var(--loolabsh-breadcrumb-padding-y, 0) var(--loolabsh-breadcrumb-padding-x, 0);
}
.breadcrumb-list {
  align-items: center;
  -moz-column-gap: var(--loolabsh-breadcrumb-gap-x);
       column-gap: var(--loolabsh-breadcrumb-gap-x);
  display: flex;
  flex-wrap: wrap;
  justify-content: var(--loolabsh-breadrumb-align, center);
  row-gap: var(--loolabsh-breadcrumb-gap-y);
}
.breadcrumb-item {
  align-items: center;
  display: inline-flex;
  white-space: nowrap;
}
.breadcrumb-item i,
.breadcrumb-item .icon {
  pointer-events: none;
  position: relative;
}
.breadcrumb-item__prefix, .breadcrumb-item__suffix {
  align-items: center;
  color: var(--loolabsh-breadcrumb-prefix-suffix-color, currentColor);
  display: flex;
  flex: 0 0 auto;
  font-size: var(--loolabsh-breadcrumb-prefix-suffix-font-size);
}
.breadcrumb-item__prefix:empty, .breadcrumb-item__suffix:empty {
  display: none;
}
.breadcrumb-item__prefix {
  margin-right: var(--loolabsh-breadcrumb-prefix-suffix-gap);
  order: 1;
}
.breadcrumb-item__suffix {
  margin-left: var(--loolabsh-breadcrumb-prefix-suffix-gap);
  order: 3;
}
.breadcrumb-item__label {
  order: 3;
}
a.breadcrumb-item__label {
  background: none;
  border: none;
  color: currentColor;
  cursor: pointer;
  display: inline-block;
  font-family: inherit;
  font-size: inherit;
  font-weight: var(--loolabsh-breadcrumb-font-weight);
  line-height: inherit;
  margin: 0;
  padding: 0;
  text-decoration: none;
  transition-duration: var(--_brcr-duration);
  transition-property: color;
  transition-timing-function: ease-in-out;
}
a.breadcrumb-item__label:not([aria-current=page]):hover { /* stylelint-disable-line string-quotes */
  color: var(--loolabsh-breadcrumb-color-hover, var(--loolabsh-breadcrumb-color));
}
a.breadcrumb-item__label:focus {
  box-shadow: none;
}
a.breadcrumb-item__label[aria-current=page] { /* stylelint-disable-line string-quotes */
  color: var(--loolabsh-breadcrumb-color-active, var(--loolabsh-color-ui, #ce776f));
}

.breadcrumb-item__separator {
  align-items: center;
  color: var(--loolabsh-breadcrumb-separator-color, currentColor);
  display: inline-flex;
  font-size: var(--loolabsh-breadcrumb-separator-font-size, var(--loolabsh-breadcrumb-prefix-suffix-font-size));
  margin: 0 0 0 var(--loolabsh-breadcrumb-gap-x);
  order: 4;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.breadcrumb-item__separator:empty::before {
  content: var(--loolabsh-breadcrumb-separator, "·"); /* stylelint-disable-line string-quotes */
}
.breadcrumb-item:last-of-type .breadcrumb-item__separator {
  display: none;
}
.breadcrumb-item::before {
  display: none;
}
.breadcrumb-item + .breadcrumb-item {
  padding: 0;
}

.button {
  --loolabsh-button-background-color: var(--loolabsh-input-background-color, #fff);
  --loolabsh-button-background-color-hover: var(--loolabsh-button-background-color);
  --loolabsh-button-border-color: var(--loolabsh-input-border-color, #959595);
  --loolabsh-button-border-color-hover: var(--loolabsh-button-border-color);
  --loolabsh-button-border-width: var(--loolabsh-input-border-width, var(--loolabsh-border-width, 1px));
  --loolabsh-button-color: var(--loolabsh-input-color, #000);
  --loolabsh-button-color-hover: var(--loolabsh-button-color);
  --loolabsh-button-duration: var(--loolabsh-duration, 0.15s);
  --loolabsh-button-font-size: var(--loolabsh-input-font-size, var(--loolabsh-font-size, 1rem));
  --loolabsh-button-height: var(--loolabsh-input-height, 40px);
  --loolabsh-button-prefix-suffix-gap: calc(var(--loolabsh-button-font-size) / 2);
  --_btn-background-color: var(--loolabsh-button-background-color);
  --_btn-border-color: var(--loolabsh-button-border-color);
  --_btn-color: var(--loolabsh-button-color);
  --_btn-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-button-duration));
  --focus-outline-color: var(--_btn-border-color);
  align-items: center;
  background-color: var(--_btn-background-color);
  border: var(--loolabsh-button-border-width) solid var(--_btn-border-color);
  border-radius: var(--loolabsh-button-border-radius, var(--loolabsh-input-border-radius, var(--loolabsh-border-radius, 0px)));
  color: var(--_btn-color) !important; /* stylelint-disable-line declaration-no-important */
  display: inline-flex;
  font-size: var(--loolabsh-button-font-size);
  font-style: var(--loolabsh-button-font-style, normal);
  font-weight: var(--loolabsh-button-font-weight, normal);
  gap: var(--loolabsh-button-prefix-suffix-gap);
  height: var(--loolabsh-button-height);
  justify-content: center;
  line-height: calc(var(--loolabsh-button-height) - var(--loolabsh-button-border-width) * 2);
  max-width: 100%;
  min-width: var(--loolabsh-button-height);
  overflow: hidden;
  padding: 0 var(--loolabsh-button-padding, var(--loolabsh-input-padding, var(--loolabsh-spacing, 1rem)));
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
  text-transform: var(--loolabsh-button-text-transform, var(--loolabsh-input-text-transform, none));
  transition-duration: var(--_btn-duration);
  transition-property: background-color, border-color, color;
  transition-timing-function: ease-in-out;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  vertical-align: middle;
  white-space: nowrap;
  width: auto;
}
.button > i:first-child {
  margin-right: 0;
}
.button > i:last-child {
  margin-right: 0;
}
.button i,
.button .icon,
.button svg {
  pointer-events: none;
  position: relative;
}
.button i:not(.far):not(.fa):not(.fas):not(.fab):not(.fal):not(.fa-regular):not(.fa-solid):not(.fa-brand):not(.fa-light),
.button .icon:not(.far):not(.fa):not(.fas):not(.fab):not(.fal):not(.fa-regular):not(.fa-solid):not(.fa-brand):not(.fa-light),
.button svg:not(.far):not(.fa):not(.fas):not(.fab):not(.fal):not(.fa-regular):not(.fa-solid):not(.fa-brand):not(.fa-light) {
  font-weight: normal;
}
.button__label {
  align-items: center;
  order: 2;
  overflow: hidden;
  text-overflow: ellipsis;
}
.button__prefix, .button__suffix, .button__caret {
  align-items: center;
  color: var(--loolabsh-button-prefix-suffix-color, currentColor);
  display: flex;
  flex: 0 0 auto;
}
.button__prefix {
  order: 1;
}
.button__suffix {
  order: 3;
}
.button__caret {
  order: 4;
}
.button:focus {
  box-shadow: none;
  outline: none;
}
.button:hover, .button:focus {
  cursor: pointer;
}
.button:hover:not(.-text), .button:focus:not(.-text) {
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
}
.button._focus-visible:focus, .button:focus-visible:focus {
  outline: var(--loolabsh-focus-outline-width, 1px) var(--loolabsh-focus-outline-style, dotted) var(--focus-outline-color);
  outline-offset: var(--loolabsh-focus-outline-offset, 2px);
}
.button:disabled, .button[disabled], .button._disabled {
  cursor: not-allowed !important; /* stylelint-disable-line declaration-no-important */
  opacity: var(--loolabsh-button-disabled-opacity, var(--loolabsh-input-disabled-opacity, var(--0.4disabled-opacity, 0.4))) !important; /* stylelint-disable-line declaration-no-important */
}
.button:disabled *, .button[disabled] *, .button._disabled * {
  pointer-events: none;
}

.button.-default, .button {
  --loolabsh-button-border-color: var(--loolabsh-color-grey);
  --focus-outline-color: var(--loolabsh-button-color);
}
.button.-default:not(.-outline), .button:not(.-outline) {
  --loolabsh-button-background-color: var(--loolabsh-color-grey);
  --loolabsh-button-color: var(--loolabsh-color-black);
}
.button.-default:not(.-outline):hover, .button:not(.-outline):hover, .button.-default:not(.-outline):focus, .button:not(.-outline):focus {
  --loolabsh-button-background-color: hsla(var(--loolabsh-color-grey-h), var(--loolabsh-color-grey-s), var(--loolabsh-color-grey-l), 85%);
}
.button.-default.-outline, .button.-outline {
  --loolabsh-button-background-color: var(--loolabsh-color-white);
  --loolabsh-button-color: var(--loolabsh-color-black);
}
.button.-default.-outline:hover, .button.-outline:hover, .button.-default.-outline:focus, .button.-outline:focus {
  --loolabsh-button-background-color: var(--loolabsh-color-grey);
}

.button.-primary {
  --loolabsh-button-background-color: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-button-border-color: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-button-color: var(--loolabsh-color-ui-contrast, #fff);
}
.button.-primary:not(.-outline) {
  --loolabsh-button-background-color: var(--loolabsh-color-ui, #ce776f);
}
.button.-primary:not(.-outline):hover, .button.-primary:not(.-outline):focus {
  --loolabsh-button-background-color: hsla(var(--loolabsh-color-ui-h), var(--loolabsh-color-ui-s), var(--loolabsh-color-ui-l), 85%);
}
.button.-primary.-outline {
  --loolabsh-button-background-color: var(--loolabsh-color-white);
  --loolabsh-button-color: var(--loolabsh-color-ui, #ce776f);
}
.button.-primary.-outline:hover, .button.-primary.-outline:focus {
  --loolabsh-button-background-color: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-button-color: var(--loolabsh-color-ui-contrast, #fff);
}

.button.-info {
  --loolabsh-button-background-color: var(--loolabsh-color-info, #2db5cd);
  --loolabsh-button-border-color: var(--loolabsh-color-info, #2db5cd);
  --loolabsh-button-color: var(--loolabsh-color-info-contrast, #000);
}
.button.-info:not(.-outline) {
  --loolabsh-button-background-color: var(--loolabsh-color-info, #2db5cd);
}
.button.-info:not(.-outline):hover, .button.-info:not(.-outline):focus {
  --loolabsh-button-background-color: hsla(var(--loolabsh-color-info-h), var(--loolabsh-color-info-s), var(--loolabsh-color-info-l), 85%);
}
.button.-info.-outline {
  --loolabsh-button-background-color: var(--loolabsh-color-white);
  --loolabsh-button-color: var(--loolabsh-color-info, #2db5cd);
}
.button.-info.-outline:hover, .button.-info.-outline:focus {
  --loolabsh-button-background-color: var(--loolabsh-color-info, #2db5cd);
  --loolabsh-button-color: var(--loolabsh-color-info-contrast, #000);
}

.button.-success {
  --loolabsh-button-background-color: var(--loolabsh-color-success, #15c182);
  --loolabsh-button-border-color: var(--loolabsh-color-success, #15c182);
  --loolabsh-button-color: var(--loolabsh-color-success-contrast, #fff);
}
.button.-success:not(.-outline) {
  --loolabsh-button-background-color: var(--loolabsh-color-success, #15c182);
}
.button.-success:not(.-outline):hover, .button.-success:not(.-outline):focus {
  --loolabsh-button-background-color: hsla(var(--loolabsh-color-success-h), var(--loolabsh-color-success-s), var(--loolabsh-color-success-l), 85%);
}
.button.-success.-outline {
  --loolabsh-button-background-color: var(--loolabsh-color-white);
  --loolabsh-button-color: var(--loolabsh-color-success, #15c182);
}
.button.-success.-outline:hover, .button.-success.-outline:focus {
  --loolabsh-button-background-color: var(--loolabsh-color-success, #15c182);
  --loolabsh-button-color: var(--loolabsh-color-success-contrast, #fff);
}

.button.-warning {
  --loolabsh-button-background-color: var(--loolabsh-color-warning, #fca311);
  --loolabsh-button-border-color: var(--loolabsh-color-warning, #fca311);
  --loolabsh-button-color: var(--loolabsh-color-warning-contrast, #000);
}
.button.-warning:not(.-outline) {
  --loolabsh-button-background-color: var(--loolabsh-color-warning, #fca311);
}
.button.-warning:not(.-outline):hover, .button.-warning:not(.-outline):focus {
  --loolabsh-button-background-color: hsla(var(--loolabsh-color-warning-h), var(--loolabsh-color-warning-s), var(--loolabsh-color-warning-l), 85%);
}
.button.-warning.-outline {
  --loolabsh-button-background-color: var(--loolabsh-color-white);
  --loolabsh-button-color: var(--loolabsh-color-warning, #fca311);
}
.button.-warning.-outline:hover, .button.-warning.-outline:focus {
  --loolabsh-button-background-color: var(--loolabsh-color-warning, #fca311);
  --loolabsh-button-color: var(--loolabsh-color-warning-contrast, #000);
}

.button.-danger {
  --loolabsh-button-background-color: var(--loolabsh-color-danger, #fb3e4e);
  --loolabsh-button-border-color: var(--loolabsh-color-danger, #fb3e4e);
  --loolabsh-button-color: var(--loolabsh-color-danger-contrast, #fff);
}
.button.-danger:not(.-outline) {
  --loolabsh-button-background-color: var(--loolabsh-color-danger, #fb3e4e);
}
.button.-danger:not(.-outline):hover, .button.-danger:not(.-outline):focus {
  --loolabsh-button-background-color: hsla(var(--loolabsh-color-danger-h), var(--loolabsh-color-danger-s), var(--loolabsh-color-danger-l), 85%);
}
.button.-danger.-outline {
  --loolabsh-button-background-color: var(--loolabsh-color-white);
  --loolabsh-button-color: var(--loolabsh-color-danger, #fb3e4e);
}
.button.-danger.-outline:hover, .button.-danger.-outline:focus {
  --loolabsh-button-background-color: var(--loolabsh-color-danger, #fb3e4e);
  --loolabsh-button-color: var(--loolabsh-color-danger-contrast, #fff);
}

.button.-l {
  --loolabsh-button-font-size: var(--loolabsh-input-font-size-l, var(--loolabsh-font-size-l, 1.25rem));
  --loolabsh-button-height: var(--loolabsh-input-height-l, 50px);
  --loolabsh-button-padding: var(--loolabsh-input-padding-l, var(--loolabsh-spacing-l, 1.25rem));
}

.button.-s {
  --loolabsh-button-font-size: var(--loolabsh-input-font-size-s, var(--loolabsh-font-size-s, 0.75rem));
  --loolabsh-button-height: var(--loolabsh-input-height-s, 30px);
  --loolabsh-button-padding: var(--loolabsh-input-padding-s, var(--loolabsh-spacing-s, 0.5rem));
}

.button.-pill {
  border-radius: var(--loolabsh-button-height);
}

.button.-outline {
  --focus-outline-color: var(--_btn-color);
}

.button.-circle {
  --loolabsh-button-padding: 0;
  border-radius: 50%;
  width: var(--loolabsh-button-height);
}
.button.-circle .button__prefix, .button.-circle .button__suffix {
  display: none;
}
.button.-text {
  --_btn-background-color: transparent;
  --_btn-border-color: transparent;
  --_btn-color: inherit;
  --focus-outline-color: var(--_btn-color);
}
.button.-text:not(:disabled):hover, .button.-text:not(:disabled)._hover, .button.-text:not(:disabled):focus, .button.-text:not(:disabled)._focus, .button.-text:not(._disabled):hover, .button.-text:not(._disabled)._hover, .button.-text:not(._disabled):focus, .button.-text:not(._disabled)._focus {
  --_btn-color: inherit;
}

.button[data-caret] {
  --_btn-caret-size: var(--loolabsh-button-caret-size, 1em);
}
.button[data-caret] .button__suffix {
  display: none;
}
.button[data-caret] .button__caret svg {
  height: var(--_btn-caret-size);
  width: var(--_btn-caret-size);
}

.button[data-loading] {
  cursor: wait;
  pointer-events: none;
  position: relative;
}
.button > .spinner {
  display: none;
}

.button[data-loading] .button__label, .button[data-loading] .button__prefix, .button[data-loading] .button__suffix {
  visibility: hidden;
}
.button[data-loading] > .spinner {
  --_sp-pos: calc(50% - var(--loolabsh-spinner-size) / 2);
  display: inline-block;
  left: var(--_sp-pos);
  position: absolute;
  top: var(--_sp-pos);
  z-index: 5;
}

.button {
  --loolabsh-button-border-width: 2px;
  --loolabsh-button-border-radius: 32px;
  --loolabsh-button-font-weight: var(--loo-font-weight-medium);
  --loolabsh-button-height: 52px;
  --loolabsh-button-padding: calc(var(--loo-spacing-s) * 3);
}

.button:not(.-default):not(.-primary):not(.-info):not(.-success):not(.-warning):not(.-danger) {
  --loolabsh-button-border-color-hover: hsl(var(--loo-color-black-h), var(--loo-color-black-s), 70%);
}

.button.-primary {
  --loolabsh-button-border-color: var(--loo-color-primary, #ce7870);
}
.button.-primary:not(.-outline) {
  --loolabsh-button-background-color: var(--loo-color-primary, #ce7870);
  --loolabsh-button-color: var(--loo-color-primary-contrast, #fff);
}
.button.-primary:not(.-outline):hover, .button.-primary:not(.-outline):focus {
  --loolabsh-button-background-color: hsla(var(--loo-color-primary-h), var(--loo-color-primary-s), var(--loo-color-primary-l), 85%);
}
.button.-primary.-outline {
  --loolabsh-button-background-color: var(--loo-color-white);
  --loolabsh-button-color: var(--loo-color-primary, #ce7870);
}
.button.-primary.-outline:hover, .button.-primary.-outline:focus {
  --loolabsh-button-background-color: var(--loo-color-primary, #ce7870);
  --loolabsh-button-color: var(--loo-color-primary-contrast, #fff);
}

.button.-secondary {
  --loolabsh-button-border-color: var(--loo-color-secondary, #6e7d75);
}
.button.-secondary:not(.-outline) {
  --loolabsh-button-background-color: var(--loo-color-secondary, #6e7d75);
  --loolabsh-button-color: var(--loo-color-secondary-contrast, #fff);
}
.button.-secondary:not(.-outline):hover, .button.-secondary:not(.-outline):focus {
  --loolabsh-button-background-color: hsla(var(--loo-color-secondary-h), var(--loo-color-secondary-s), var(--loo-color-secondary-l), 85%);
}
.button.-secondary.-outline {
  --loolabsh-button-background-color: var(--loo-color-white);
  --loolabsh-button-color: var(--loo-color-secondary, #6e7d75);
}
.button.-secondary.-outline:hover, .button.-secondary.-outline:focus {
  --loolabsh-button-background-color: var(--loo-color-secondary, #6e7d75);
  --loolabsh-button-color: var(--loo-color-secondary-contrast, #fff);
}

.button.-tertiary {
  --loolabsh-button-border-color: var(--loo-color-tertiary, #eba966);
}
.button.-tertiary:not(.-outline) {
  --loolabsh-button-background-color: var(--loo-color-tertiary, #eba966);
  --loolabsh-button-color: var(--loo-color-tertiary-contrast, #000);
}
.button.-tertiary:not(.-outline):hover, .button.-tertiary:not(.-outline):focus {
  --loolabsh-button-background-color: hsla(var(--loo-color-tertiary-h), var(--loo-color-tertiary-s), var(--loo-color-tertiary-l), 85%);
}
.button.-tertiary.-outline {
  --loolabsh-button-background-color: var(--loo-color-white);
  --loolabsh-button-color: var(--loo-color-tertiary, #eba966);
}
.button.-tertiary.-outline:hover, .button.-tertiary.-outline:focus {
  --loolabsh-button-background-color: var(--loo-color-tertiary, #eba966);
  --loolabsh-button-color: var(--loo-color-tertiary-contrast, #000);
}

.button.-info {
  --loolabsh-button-border-color: var(--loo-color-info, #5c9da9);
}
.button.-info:not(.-outline) {
  --loolabsh-button-background-color: var(--loo-color-info, #5c9da9);
  --loolabsh-button-color: var(--loo-color-info-contrast, #000);
}
.button.-info:not(.-outline):hover, .button.-info:not(.-outline):focus {
  --loolabsh-button-background-color: hsla(var(--loo-color-info-h), var(--loo-color-info-s), var(--loo-color-info-l), 85%);
}
.button.-info.-outline {
  --loolabsh-button-background-color: var(--loo-color-white);
  --loolabsh-button-color: var(--loo-color-info, #5c9da9);
}
.button.-info.-outline:hover, .button.-info.-outline:focus {
  --loolabsh-button-background-color: var(--loo-color-info, #5c9da9);
  --loolabsh-button-color: var(--loo-color-info-contrast, #000);
}

.button.-success {
  --loolabsh-button-border-color: var(--loo-color-success, #46a783);
}
.button.-success:not(.-outline) {
  --loolabsh-button-background-color: var(--loo-color-success, #46a783);
  --loolabsh-button-color: var(--loo-color-success-contrast, #fff);
}
.button.-success:not(.-outline):hover, .button.-success:not(.-outline):focus {
  --loolabsh-button-background-color: hsla(var(--loo-color-success-h), var(--loo-color-success-s), var(--loo-color-success-l), 85%);
}
.button.-success.-outline {
  --loolabsh-button-background-color: var(--loo-color-white);
  --loolabsh-button-color: var(--loo-color-success, #46a783);
}
.button.-success.-outline:hover, .button.-success.-outline:focus {
  --loolabsh-button-background-color: var(--loo-color-success, #46a783);
  --loolabsh-button-color: var(--loo-color-success-contrast, #fff);
}

.button.-warning {
  --loolabsh-button-border-color: var(--loo-color-warning, #eba83c);
}
.button.-warning:not(.-outline) {
  --loolabsh-button-background-color: var(--loo-color-warning, #eba83c);
  --loolabsh-button-color: var(--loo-color-warning-contrast, #000);
}
.button.-warning:not(.-outline):hover, .button.-warning:not(.-outline):focus {
  --loolabsh-button-background-color: hsla(var(--loo-color-warning-h), var(--loo-color-warning-s), var(--loo-color-warning-l), 85%);
}
.button.-warning.-outline {
  --loolabsh-button-background-color: var(--loo-color-white);
  --loolabsh-button-color: var(--loo-color-warning, #eba83c);
}
.button.-warning.-outline:hover, .button.-warning.-outline:focus {
  --loolabsh-button-background-color: var(--loo-color-warning, #eba83c);
  --loolabsh-button-color: var(--loo-color-warning-contrast, #000);
}

.button.-danger {
  --loolabsh-button-border-color: var(--loo-color-danger, #cf5c66);
}
.button.-danger:not(.-outline) {
  --loolabsh-button-background-color: var(--loo-color-danger, #cf5c66);
  --loolabsh-button-color: var(--loo-color-danger-contrast, #fff);
}
.button.-danger:not(.-outline):hover, .button.-danger:not(.-outline):focus {
  --loolabsh-button-background-color: hsla(var(--loo-color-danger-h), var(--loo-color-danger-s), var(--loo-color-danger-l), 85%);
}
.button.-danger.-outline {
  --loolabsh-button-background-color: var(--loo-color-white);
  --loolabsh-button-color: var(--loo-color-danger, #cf5c66);
}
.button.-danger.-outline:hover, .button.-danger.-outline:focus {
  --loolabsh-button-background-color: var(--loo-color-danger, #cf5c66);
  --loolabsh-button-color: var(--loo-color-danger-contrast, #fff);
}

.list {
  --loolabsh-list-marker-color: var(--loolabsh-color-text, #3e3e3e);
  --loolabsh-list-marker-font-size: 1em;
  --loolabsh-list-marker-gap: var(--loolabsh-spacing-xs, 0.25rem);
  --loolabsh-list-item-margin: var(--loolabsh-spacing-s, 0.5rem);
  --loolabsh-list-nested-margin: var(--loolabsh-spacing-s, 0.5rem);
}
.list,
.list ul,
.list ol {
  padding: 0;
}
.list li {
  list-style-type: none;
  margin: var(--loolabsh-list-item-margin) 0;
  position: relative;
}
.list li:first-child {
  margin-top: 0;
}
.list li:last-child {
  margin-bottom: 0;
}
.list li ul,
.list li ol {
  margin: var(--loolabsh-list-nested-margin) 0;
}

ul.list {
  --loolabsh-ul-marker-color: var(--loolabsh-list-marker-color);
  --loolabsh-ul-marker-font-size: var(--loolabsh-list-marker-font-size);
  --loolabsh-ul-marker-gap: var(--loolabsh-list-marker-gap);
  --loolabsh-ul-marker-icon: "•"; /* stylelint-disable-line string-quotes */
  --loolabsh-ul-nested-marker-font-size: var(--loolabsh-ul-marker-font-size);
  --loolabsh-ul-nested-marker-gap: var(--loolabsh-ul-marker-gap);
}
ul.list > li,
ul.list ul > li {
  --_ul-marker-gap: calc(var(--loolabsh-ul-marker-font-size) + var(--loolabsh-ul-marker-gap));
  padding-left: var(--_ul-marker-gap);
}
ul.list > li::before,
ul.list ul > li::before {
  color: var(--_ul-marker-color, var(--loolabsh-ul-marker-color));
  content: var(--_ul-marker-icon, var(--loolabsh-ul-marker-icon));
  display: block;
  font-size: var(--_ul-marker-font-size, var(--loolabsh-ul-marker-font-size));
  left: 0;
  overflow: hidden;
  position: absolute;
}
ul.list ul > li {
  --_ul-marker-color: var(--loolabsh-ul-nested-marker-color, var(--loolabsh-ul-marker-color));
  --_ul-marker-font-size: var(--loolabsh-ul-nested-marker-font-size, var(--loolabsh-ul-marker-font-size));
  --_ul-marker-icon: var(--loolabsh-ul-nested-marker-icon, var(--loolabsh-ul-marker-icon));
  --_ul-marker-gap: calc(var(--loolabsh-ul-nested-marker-font-size) + var(--loolabsh-ul-nested-marker-gap));
}

ol.list {
  --loolabsh-ol-marker-color: var(--loolabsh-list-marker-color);
  --loolabsh-ol-marker-font-size: var(--loolabsh-list-marker-font-size);
  --loolabsh-ol-marker-gap: var(--loolabsh-list-marker-gap);
  --_ol-nested-index: 0.0; /* stylelint-disable-line number-no-trailing-zeros */
  --_ol-nested-index-add: 0.0; /* stylelint-disable-line number-no-trailing-zeros */
}
ol.list,
ol.list ol {
  counter-reset: count-ol;
}
ol.list > li,
ol.list ol > li {
  counter-increment: count-ol;
  display: flex;
  flex-wrap: nowrap;
  gap: var(--loolabsh-ol-marker-gap);
  justify-content: flex-start;
}
ol.list > li::before,
ol.list ol > li::before {
  color: var(--_ol-marker-color, var(--loolabsh-ol-marker-color));
  content: counters(count-ol, ".") ". "; /* stylelint-disable-line string-quotes */
  display: flex;
  flex: 0 0 auto;
  font-size: var(--_ol-marker-font-size, var(--loolabsh-ol-marker-font-size));
  text-align: left;
}
ol.list ol > li {
  --_ol-marker-color: var(--loolabsh-ol-nested-marker-color, var(--loolabsh-ol-marker-color));
  --_ol-marker-font-size: var(--loolabsh-ol-nested-marker-font-size, var(--loolabsh-ol-marker-font-size));
}

ul.list {
  --loolabsh-ul-marker-icon: "";
  --loolabsh-ul-marker-gap: var(--loo-spacing-xs);
  --loolabsh-ul-marker-font-size: var(--loo-font-size-s);
  /* stylelint-disable string-quotes, font-family-no-missing-generic-family-keyword */
  /* stylelint-enable */
}
ul.list li::before {
  font-family: "Font Awesome 6 Pro";
  top: 0.0625rem;
}

.deck {
  --loolabsh-deck-border-color: transparent;
  --loolabsh-deck-border-radius: var(--loolabsh-border-radius, 0px);
  --loolabsh-deck-border-width: 0px; /* stylelint-disable-line length-zero-no-unit */
  --loolabsh-deck-gap-column: var(--loolabsh-deck-gap, var(--loolabsh-spacing, 1rem));
  --loolabsh-deck-gap-row: var(--loolabsh-deck-gap-column);
  background-color: var(--loolabsh-deck-background-color, transparent);
  border: var(--loolabsh-deck-border-width) solid var(--loolabsh-deck-border-color);
  border-radius: var(--loolabsh-deck-border-radius);
  padding: var(--loolabsh-deck-padding-y, 0) var(--loolabsh-deck-padding-x, 0);
}
.deck__container {
  display: grid;
  grid-gap: var(--loolabsh-deck-gap-row) var(--loolabsh-deck-gap-column);
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto;
}
.deck__container > * {
  margin: 0 !important; /* stylelint-disable-line declaration-no-important */
  width: 100%;
}
.deck__container > * + * {
  margin: 0;
}
@media (min-width: 768px) {
  .deck {
    /* stylelint-disable string-quotes */
    /* stylelint-enable string-quotes */
  }
  .deck[data-columns="2"] .deck__container, .deck[data-columns="3"] .deck__container, .deck[data-columns="4"] .deck__container {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
}
@media (min-width: 992px) {
  .deck {
    /* stylelint-disable string-quotes */
    /* stylelint-enable string-quotes */
  }
  .deck[data-columns="3"] .deck__container {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  }
  .deck[data-columns="4"] .deck__container {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  }
}

.deck {
  --loolabsh-deck-gap-column: var(--loo-grid-gap-x);
  --loolabsh-deck-gap-row: var(--loo-grid-gap-y);
}

.details {
  --loolabsh-details-background-color: transparent;
  --loolabsh-details-border-color: var(--loolabsh-color-border, #959595);
  --loolabsh-details-border-color-active: var(--loolabsh-color-border, #959595);
  --loolabsh-details-border-radius: var(--loolabsh-border-radius, 0px);
  --loolabsh-details-border-width: var(--loolabsh-border-width, 1px);
  --loolabsh-details-padding-x: var(--loolabsh-spacing, 1rem);
  --loolabsh-details-padding-y: var(--loolabsh-spacing, 1rem);
  --loolabsh-details-duration: var(--loolabsh-duration, 0.15s);
  --loolabsh-details-toggle-color: var(--loolabsh-color-text, #3e3e3e);
  --loolabsh-details-toggle-color-active: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-details-toggle-padding-x: var(--loolabsh-details-padding-x);
  --loolabsh-details-toggle-padding-y: var(--loolabsh-details-padding-y);
  --_de-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-details-duration));
  background-color: var(--loolabsh-details-background-color);
  border: var(--loolabsh-details-border-width) solid var(--loolabsh-details-border-color);
  border-radius: var(--loolabsh-details-border-radius);
  overflow-anchor: auto;
}
.details._active {
  border-color: var(--loolabsh-details-border-color-active);
}

.details__header {
  align-items: center;
  background-color: transparent;
  border: 0 none;
  border-radius: inherit;
  color: var(--loolabsh-details-toggle-color-active);
  cursor: pointer;
  display: flex;
  font-size: var(--loolabsh-details-toggle-font-size, 1rem);
  font-weight: var(--loolabsh-details-toggle-font-weight, 300);
  gap: var(--loolabsh-details-toggle-gap, 1em);
  height: auto;
  line-height: normal;
  padding: var(--loolabsh-details-toggle-padding-y, var(--loolabsh-details-padding-y)) var(--loolabsh-details-toggle-padding-x, var(--loolabsh-details-padding-x));
  text-align: left;
  transition: all var(--_de-duration) ease-in-out;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  width: 100%;
}
.details__header-summary {
  align-items: center;
  flex: 1 1 auto;
}
.details__header-icon {
  align-items: center;
  color: var(--loolabsh-details-toggle-icon-color-active, var(--loolabsh-details-toggle-color-active));
  display: flex;
  flex: 0 0 auto;
  font-size: var(--loolabsh-details-toggle-icon-size, 0.5em);
  height: 1em;
  position: relative;
  transform: rotate(135deg);
  transition: all var(--_de-duration) ease-in-out;
  width: 1em;
}
.details__header-icon::before {
  border: var(--loolabsh-details-toggle-icon-stroke, 1px) solid currentColor;
  border-bottom: 0;
  border-left: 0;
  content: ""; /* stylelint-disable-line string-quotes */
  height: 1em;
  width: 1em;
}
.details__header[aria-expanded=false] {
  color: var(--loolabsh-details-toggle-color);
}
.details__header[aria-expanded=false] .details__header-icon {
  color: var(--loolabsh-details-toggle-icon-color, var(--loolabsh-details-toggle-color));
  transform: rotate(45deg);
}
.details__header:focus {
  box-shadow: none;
  outline: none;
}
[dir=rtl] .details__header {
  text-align: right;
}
[dir=rtl] .details__header[aria-expanded=false] .details__header-icon {
  transform: rotate(225deg);
}

.details__body {
  overflow: hidden;
}
.details__body.collapse {
  display: none;
}
.details__body.collapse.show {
  display: block;
}
.details__body.collapsing {
  height: 0;
  overflow: hidden;
  position: relative;
  transition: height var(--_de-duration) ease-in-out;
}
.details__body.show {
  display: block;
}

.details__content {
  padding: var(--loolabsh-details-panel-padding-y, var(--loolabsh-details-padding-y)) var(--loolabsh-details-panel-padding-x, var(--loolabsh-details-padding-x));
}
.details__content > *:first-child:not(div) {
  margin-top: 0;
}
.details__content > *:last-child:not(div) {
  margin-bottom: 0;
}

.details-group {
  --loolabsh-details-group-gap: var(--loolabsh-spacing-s, 0.5rem);
}
.details-group .details + .details {
  margin-top: var(--loolabsh-details-group-gap);
}

.details {
  --loolabsh-details-background-color: transparent;
  --loolabsh-details-border-color: var(--loo-color-coral);
  --loolabsh-details-border-color-active: var(--loo-color-primary);
  --loolabsh-details-border-radius: var(--loo-spacing-s);
  --loolabsh-details-border-width: 2px;
  --loolabsh-details-toggle-color-active: var(--loo-color-primary);
  --loolabsh-details-toggle-font-size: var(--loo-h5-font-size);
  --loolabsh-details-toggle-font-weight: var(--loo-font-weight-medium);
  --loolabsh-details-toggle-icon-color: var(--loo-color-coral);
  --loolabsh-details-toggle-icon-color-active: var(--loo-color-primary);
  --loolabsh-details-toggle-icon-size: 1em;
  --loo-details-toggle-fa-icon: "";
  --loo-details-toggle-fa-icon-font-weight: var(--loo-font-weight-medium);
}
.details__header-icon {
  transform: rotate(-90deg);
}
.details__header-icon::before {
  border: none;
  content: var(--loo-details-toggle-fa-icon);
  font-family: "Font Awesome 6 Pro";
  font-weight: var(--loo-details-toggle-fa-icon-font-weight);
  height: auto;
  width: auto;
}
.details__header[aria-expanded=false] .details__header-icon {
  transform: rotate(90deg);
}

.card {
  --loolabsh-card-border-color: var(--loolabsh-color-border, #959595);
  --loolabsh-card-border-radius: var(--loolabsh-border-radius, 0px);
  --loolabsh-card-border-width: var(--loolabsh-border-width, 1px);
  --loolabsh-card-padding: var(--loolabsh-spacing, 1rem);
  --loolabsh-card-duration: var(--loolabsh-duration, 0.15s);
  background-color: var(--loolabsh-card-background-color, transparent);
  border: var(--loolabsh-card-border-width) solid var(--loolabsh-card-border-color);
  border-radius: var(--loolabsh-card-border-radius);
  display: flex;
  flex-direction: column;
  transition-duration: var(--loolabsh-card-duration);
  transition-property: border-color, box-shadow;
  transition-timing-function: ease-in-out;
}
.card .card-title { /* stylelint-disable-line string-quotes */
  font-weight: var(--loolabsh-card-title-font-weight, bold);
  -webkit-hyphens: manual;
  hyphens: manual;
  margin: 0;
  overflow-wrap: break-word;
}
.card__media {
  border-top-left-radius: var(--loolabsh-card-border-radius);
  border-top-right-radius: var(--loolabsh-card-border-radius);
  margin: calc(var(--loolabsh-card-border-width) * -1);
  overflow: hidden;
}
.card__media .figure__caption {
  display: none;
}
.card__media > * {
  display: block;
  margin: 0;
  width: 100%;
}
.card__header, .card__body, .card__footer {
  transition-duration: var(--loolabsh-card-duration);
  transition-property: border-color;
  transition-timing-function: ease-in-out;
}
.card__header, .card__footer {
  align-items: center;
  display: flex;
  justify-content: space-between;
}
.card__header {
  border-bottom: var(--loolabsh-card-border-width) solid var(--loolabsh-card-border-color);
  flex-wrap: wrap;
  gap: calc(var(--loolabsh-card-padding) / 2);
  padding: var(--loolabsh-card-padding);
}
.card__body {
  flex-grow: 1;
  padding: var(--loolabsh-card-padding);
}
.card__body > * {
  margin: 0;
}
.card__body > * + * {
  margin-top: var(--loolabsh-card-content-gap, var(--loolabsh-spacing-s, 0.5rem));
}
.card__body > :first-child {
  margin-top: 0;
}
.card__body > :last-child {
  margin-bottom: 0;
}
.card__footer {
  border-top: var(--loolabsh-card-border-width) solid var(--loolabsh-card-border-color);
  padding: var(--loolabsh-card-padding);
}

.card {
  --loolabsh-card-background-color: var(--loo-color-white);
  --loolabsh-card-border-color: var(--loolabsh-card-background-color);
  --loolabsh-card-border-radius: var(--loo-spacing-l);
  --loolabsh-card-border-width: 0;
  --loolabsh-card-padding: var(--loo-spacing-l);
  overflow: hidden;
}
.card__media {
  position: relative;
}
.card__media .figure {
  --loo-figure-img-border-radius: 0;
}
.card__media + .card__meta {
  bottom: 0;
  position: absolute;
  right: 0;
}
.card__header {
  border-bottom: 2px solid var(--loo-color-secondary);
}
.card__meta {
  display: flex;
  justify-content: flex-end;
}
.card__meta .button.-read-more {
  --loolabsh-button-border-radius: 0;
  border-top-left-radius: var(--loo-spacing-l);
}

.icon-button {
  --loolabsh-icon-button-background-color: transparent;
  --loolabsh-icon-button-background-color-hover: var(--loolabsh-icon-button-background-color);
  --loolabsh-icon-button-color: inherit;
  --loolabsh-icon-button-color-hover: var(--loolabsh-icon-button-color);
  --loolabsh-icon-button-color-active: var(--loolabsh-icon-button-color-hover);
  --loolabsh-icon-button-duration: var(--loolabsh-duration, 0.15s);
  --loolabsh-icon-button-padding: var(--loolabsh-spacing-s, 0.5rem);
  --_ibtn-background-color: var(--loolabsh-icon-button-background-color);
  --_ibtn-color: var(--loolabsh-icon-button-color);
  --_ibtn-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-icon-button-duration));
  align-items: center;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  background-color: var(--_ibtn-background-color);
  border: none;
  border-radius: 0;
  color: var(--_ibtn-color) !important; /* stylelint-disable-line declaration-no-important */
  display: inline-flex;
  flex: 0 0 auto;
  font-size: var(--loolabsh-icon-button-font-size, inherit);
  height: auto;
  justify-content: center;
  line-height: 1;
  padding: var(--loolabsh-icon-button-padding);
  position: relative;
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
  transition-duration: var(--_ibtn-duration);
  transition-property: background-color, border-color, color, opacity;
  transition-timing-function: ease-in-out;
}
.icon-button__icon {
  align-items: center;
  display: flex;
  height: 1em;
  justify-content: center;
  width: 1em;
}
.icon-button:focus:not(:focus-visible), .icon-button:focus:not(._focus-visible) {
  box-shadow: none;
  outline: none;
}
.icon-button:not(:disabled):focus, .icon-button:not(:disabled):hover, .icon-button:not(:disabled):active, .icon-button:not(.-disabled):focus, .icon-button:not(.-disabled):hover, .icon-button:not(.-disabled):active {
  --_ibtn-background-color: var(--loolabsh-icon-button-background-color-hover);
  --_ibtn-color: var(--loolabsh-icon-button-color-hover);
  cursor: pointer;
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
}
.icon-button:not(:disabled):active, .icon-button:not(.-disabled):active {
  --_ibtn-color: var(--loolabsh-icon-button-color-active);
}
.icon-button:disabled, .icon-button[disabled], .icon-button._disabled {
  box-shadow: none;
  cursor: not-allowed;
  opacity: var(--loolabsh-icon-button-disabled-opacity, 0.4);
  outline: none;
  pointer-events: none;
}

.icon-button[data-is-loading] {
  cursor: wait;
  pointer-events: none;
}
.icon-button > .spinner {
  display: none;
}

.icon-button[data-is-loading] .icon-button__icon {
  visibility: hidden;
}
.icon-button[data-is-loading] > .spinner {
  --_sp-pos: calc(50% - var(--loolabsh-spinner-size) / 2);
  display: inline-block;
  left: var(--_sp-pos);
  position: absolute;
  top: var(--_sp-pos);
  z-index: 5;
}

.swiper {
  --swiper-theme-color: var(--loolabsh-slider-theme-color);
  --swiper-preloader-color: var(--loolabsh-slider-preloader-color, var(--loolabsh-slider-theme-color));
  opacity: 0;
  transition-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-slider-init-duration, 0.25s));
  transition-property: opacity;
}
.swiper.swiper-initialized {
  opacity: 1;
}
.swiper-lazy-preloader {
  border-width: 0.125em;
  font-size: var(--loolabsh-slider-preloader-size, 1rem);
  height: 1em;
  margin-left: -0.5em;
  margin-top: -0.5em;
  width: 1em;
}
.swiper-button-lock {
  display: none;
  pointer-events: none;
}
.swiper-button-next, .swiper-button-prev {
  --loolabsh-icon-button-color: var(--loolabsh-slider-button-color);
  font-size: var(--loolabsh-slider-button-font-size);
  margin: 0;
  opacity: var(--loolabsh-slider-button-opacity, 1);
  position: absolute;
  transform: translateY(-50%);
  width: auto;
}
.swiper-button-next[aria-disabled=true], .swiper-button-prev[aria-disabled=true] { /* stylelint-disable-line string-quotes */
  opacity: var(--loolabsh-slider-button-disabled-opacity, 0);
}
.swiper-button-next::after, .swiper-button-prev::after {
  display: none;
}
.swiper-button-next {
  right: 0;
}
.swiper-button-prev {
  left: 0;
}
.swiper-pagination {
  --swiper-pagination-color: var(--loolabsh-slider-theme-color);
  background-color: var(--loolabsh-slider-pagination-background-color);
  -moz-column-gap: var(--loolabsh-slider-pagination-column-gap);
       column-gap: var(--loolabsh-slider-pagination-column-gap);
  display: inline-flex;
  flex-wrap: wrap;
  padding: var(--loolabsh-slider-pagination-padding);
  row-gap: var(--loolabsh-slider-pagination-row-gap);
}
.swiper-pagination-bullet {
  --swiper-pagination-bullet-color: var(--loolabsh-slider-pagination-item-color-active);
  --swiper-pagination-bullet-height: var(--loolabsh-slider-pagination-item-height);
  --swiper-pagination-bullet-inactive-color: var(--loolabsh-slider-pagination-item-color);
  --swiper-pagination-bullet-inactive-opacity: var(--loolabsh-slider-pagination-item-opacity, 1);
  --swiper-pagination-bullet-opacity: var(--loolabsh-slider-pagination-item-opacity-active, 1);
  --swiper-pagination-bullet-width: var(--loolabsh-slider-pagination-item-width);
  --swiper-pagination-bullet-horizontal-gap: 0;
  --swiper-pagination-bullet-vertival-gap: 0;
  border-radius: var(--loolabsh-slider-pagination-item-border-radius, 0);
}
.swiper-pagination-bullet:focus {
  box-shadow: none;
  outline: none;
}
.swiper-pagination-bullet._focus-visible:focus, .swiper-pagination-bullet:focus-visible:focus {
  outline: var(--loolabsh-focus-outline-width, 1px) var(--loolabsh-focus-outline-style, dotted) var(--loolabsh-focus-outline-color, currentColor);
  outline-offset: var(--loolabsh-focus-outline-offset, 2px);
}
.swiper-pagination.swiper-pagination-lock {
  display: none;
  pointer-events: none;
}
.swiper-pagination.swiper-pagination-horizontal {
  bottom: auto;
  justify-content: flex-end;
  left: auto;
  line-height: 1;
  max-width: 100%;
  right: var(--loolabsh-slider-pagination-offset);
  top: var(--loolabsh-slider-pagination-offset);
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}

.slider {
  --loolabsh-slider-theme-color: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-slider-button-color: var(--loolabsh-slider-theme-color);
  --loolabsh-slider-button-font-size: var(--loolabsh-font-size, 1rem);
  --loolabsh-slider-pagination-item-height: var(--loolabsh-slider-pagination-item-size, var(--loolabsh-spacing-xxs, 0.125rem));
  --loolabsh-slider-pagination-item-width: var(--loolabsh-slider-pagination-item-size, var(--loolabsh-spacing-l, 1.25rem));
  --loolabsh-slider-pagination-item-color: var(--loolabsh-color-white, #fff);
  --loolabsh-slider-pagination-item-color-active: var(--loolabsh-slider-theme-color);
  --loolabsh-slider-pagination-background-color: transparent;
  --loolabsh-slider-pagination-column-gap: var(--loolabsh-slider-pagination-gap, var(--loolabsh-spacing-s, 0.5rem));
  --loolabsh-slider-pagination-row-gap: var(--loolabsh-slider-pagination-gap, var(--loolabsh-spacing-s, 0.5rem));
  --loolabsh-slider-pagination-offset: 0;
  --loolabsh-slider-pagination-padding: var(--loolabsh-spacing-s, 0.5rem);
  position: relative;
}
.slider-item__inner {
  position: relative;
}
.slider-item__inner > *:not(.swiper-lazy-preloader) {
  margin: 0;
}

.card-gallery {
  --loolabsh-card-gallery-gap-column: var(--loolabsh-card-gallery-gap, var(--loolabsh-spacing, 1rem));
  --loolabsh-card-gallery-gap-row: var(--loolabsh-card-gallery-gap-column);
}
@media (min-width: 768px) {
  .card-gallery {
    /* stylelint-disable string-quotes */
    /* stylelint-enable string-quotes */
  }
  .card-gallery[data-columns="2"].-grid .card-gallery__inner, .card-gallery[data-columns="3"].-grid .card-gallery__inner, .card-gallery[data-columns="4"].-grid .card-gallery__inner {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .card-gallery[data-columns="2"].-slider .slider-item, .card-gallery[data-columns="3"].-slider .slider-item, .card-gallery[data-columns="4"].-slider .slider-item {
    width: 50%;
  }
}
@media (min-width: 992px) {
  .card-gallery {
    /* stylelint-disable string-quotes */
    /* stylelint-enable string-quotes */
  }
  .card-gallery[data-columns="3"].-grid .card-gallery__inner {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  }
  .card-gallery[data-columns="3"].-slider .slider-item {
    width: 33.3333333333%;
  }
  .card-gallery[data-columns="4"].-grid .card-gallery__inner {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  }
  .card-gallery[data-columns="4"].-slider .slider-item {
    width: 25%;
  }
}
.card-gallery .card {
  height: 100%;
}

.card-gallery.-grid .card-gallery__inner {
  display: grid;
  grid-gap: var(--loolabsh-card-gallery-gap-row) var(--loolabsh-card-gallery-gap-column);
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto;
}
.card-gallery.-grid .card-gallery__inner > * {
  margin: 0 !important; /* stylelint-disable-line declaration-no-important */
  width: 100%;
}
.card-gallery.-grid .card-gallery__inner > * + * {
  margin: 0;
}

.card-gallery.-slider {
  --_mgal-gap: calc(var(--loolabsh-card-gallery-gap-column) / 2);
  --loolabsh-slider-pagination-item-height: var(--loolabsh-slider-pagination-item-width);
  --loolabsh-slider-pagination-item-width: var(--loolabsh-font-size-l);
}
.card-gallery.-slider .slider {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.card-gallery.-slider .slider-container {
  margin-left: calc(var(--_mgal-gap) * -1);
  margin-right: calc(var(--_mgal-gap) * -1);
}
.card-gallery.-slider .slider-item {
  height: auto;
}
.card-gallery.-slider .slider-item__inner {
  height: 100%;
  padding-left: var(--_mgal-gap);
  padding-right: var(--_mgal-gap);
}
.card-gallery.-slider .swiper-pagination {
  justify-content: center;
  position: relative;
  transform: none;
  width: 100%;
}
.card-gallery.-slider .swiper-pagination-bullet::before {
  content: "\f111";
}
.card-gallery.-slider .swiper-button-prev, .card-gallery.-slider .swiper-button-next {
  left: auto;
  position: relative;
  right: auto;
  top: 0;
  transform: none;
}

.card-gallery.-slider .slider {
  --loolabsh-slider-button-disabled-opacity: 0.5;
  justify-content: center;
}
.card-gallery.-slider .swiper-button-prev, .card-gallery.-slider .swiper-button-next {
  background: var(--loo-color-white);
  border-radius: 50%;
  transform: translateY(-50%);
}

/**
 * Inhalte visuell ausblenden aber für unterstützende Technologien zugänglich
 * halten.
 */
/**
 * Zeige Inhalt nur wenn er fokussiert wird/wurde.
 */
.drawer {
  --loolabsh-drawer-size: 100%;
  --loolabsh-drawer-padding-x: var(--loolabsh-drawer-padding, var(--loolabsh-spacing-xl, 1rem));
  --loolabsh-drawer-padding-y: var(--loolabsh-drawer-padding-x);
  --loolabsh-drawer-border-color: var(--loolabsh-color-border, #959595);
  --loolabsh-drawer-border-width: var(--loolabsh-border-width, 1px);
  --loolabsh-drawer-duration: 0.5s;
  --_dr-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-drawer-duration));
  -webkit-backdrop-filter: var(--loolabsh-drawer-backdrop-filter, var(--loolabsh-backdrop-filter, none));
          backdrop-filter: var(--loolabsh-drawer-backdrop-filter, var(--loolabsh-backdrop-filter, none));
  display: none;
  height: 100%;
  left: 0;
  overflow: hidden;
  pointer-events: none;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: var(--loolabsh-drawer-zindex, 500);
}
.drawer__panel {
  background-color: var(--loolabsh-drawer-background-color, var(--loolabsh-color-white, #fff));
  border: 0 solid var(--loolabsh-drawer-border-color);
  display: flex;
  flex-direction: column;
  left: 0;
  height: 100%;
  overflow: hidden;
  pointer-events: all;
  position: absolute;
  top: 0;
  transition: var(--loolabsh-drawer-duration) all ease-in-out;
  transition-delay: var(--loolabsh-drawer-duration);
  width: 100%;
  z-index: 2;
}
.drawer__panel:focus {
  outline: none;
}
.drawer__title {
  font-size: var(--loolabsh-drawer-title-font-size, inherit);
  -webkit-hyphens: manual;
  hyphens: manual;
  margin: 0;
  overflow-wrap: break-word;
  word-wrap: break-word;
}
.drawer__controls .drawer__close {
  --loolabsh-icon-button-font-size: var(--loolabsh-drawer-close-font-size, inherit);
}
.drawer__header {
  align-items: center;
  border-bottom: var(--loolabsh-drawer-border-width) solid var(--loolabsh-drawer-border-color);
  color: var(--loolabsh-drawer-header-color, currentColor);
  display: flex;
  font-size: var(--loolabsh-drawer-header-font-size, inherit);
  padding: 0;
}
.drawer__header .drawer__controls {
  -webkit-margin-start: auto;
          margin-inline-start: auto;
}
.drawer__body, .drawer__footer {
  opacity: 0;
  transition: all var(--loolabsh-drawer-duration) ease-in-out;
}
.drawer__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: none;
  padding: var(--loolabsh-drawer-padding-y) var(--loolabsh-drawer-padding-x);
  position: relative;
}
.drawer__footer {
  align-items: center;
  border-top: var(--loolabsh-drawer-border-width) solid var(--loolabsh-drawer-border-color);
  color: var(--loolabsh-drawer-footer-color, currentColor);
  display: flex;
  flex-direction: column;
  font-size: var(--loolabsh-drawer-footer-font-size, inherit);
  justify-content: center;
  padding: var(--loolabsh-drawer-padding-y) var(--loolabsh-drawer-padding-x);
}
.drawer__overlay {
  background-color: var(--loolabsh-drawer-backdrop-color, var(--loolabsh-backdrop-color, #000));
  bottom: 0;
  display: block;
  left: 0;
  opacity: 1;
  pointer-events: none;
  position: fixed;
  right: 0;
  top: 0;
  transition: var(--loolabsh-drawer-duration) all ease-in-out;
}
.drawer.-open .drawer__overlay {
  opacity: var(--loolabsh-drawer-backdrop-opacity, var(--loolabsh-backdrop-opacity, 0.5));
  pointer-events: all;
}

.drawer.-initialized {
  display: block;
}

.drawer.-contained {
  position: absolute;
  z-index: initial;
}
.drawer.-contained .drawer__overlay {
  position: absolute;
}

.contains-drawer {
  position: relative;
}

.drawer[data-placement=top] .drawer__panel { /* stylelint-disable-line string-quotes */
  border-bottom-width: var(--loolabsh-drawer-border-width);
  bottom: auto;
  height: var(--loolabsh-drawer-size);
  left: 0;
  right: auto;
  top: 0;
  transform: translate(0, -100%);
  width: 100%;
}

.drawer[data-placement=bottom] .drawer__panel { /* stylelint-disable-line string-quotes */
  border-top-width: var(--loolabsh-drawer-border-width);
  bottom: 0;
  height: var(--loolabsh-drawer-size);
  left: 0;
  right: auto;
  top: auto;
  transform: translate(0, 100%);
  width: 100%;
}

.drawer[data-placement=start] .drawer__panel { /* stylelint-disable-line string-quotes */
  border-right-width: var(--loolabsh-drawer-border-width);
  bottom: auto;
  height: 100%;
  left: 0;
  right: auto;
  top: 0;
  transform: translate(-100%, 0);
  width: var(--loolabsh-drawer-size);
}

.drawer[data-placement=end] .drawer__panel { /* stylelint-disable-line string-quotes */
  border-left-width: var(--loolabsh-drawer-border-width);
  bottom: auto;
  height: 100%;
  left: auto;
  right: 0;
  top: 0;
  transform: translate(100%, 0);
  width: var(--loolabsh-drawer-size);
}

.drawer[data-placement=mid] .drawer__panel { /* stylelint-disable-line string-quotes */
  border-left-width: var(--loolabsh-drawer-border-width);
  bottom: 50%;
  height: 100%;
  left: 50%;
  right: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: var(--loolabsh-drawer-size);
}

.drawer.-open .drawer__overlay {
  opacity: 1;
}
.drawer.-open .drawer__body,
.drawer.-open .drawer__footer {
  opacity: 1;
}
.drawer.-open .drawer__panel {
  opacity: 1;
  transform: translate(0, 0);
  transition: all var(--loolabsh-drawer-duration) ease-in-out;
}

.drawer {
  --loolabsh-drawer-backdrop-color: var(--loo-color-tertiary);
  --loolabsh-drawer-background-color: transparent;
  --loolabsh-drawer-border-color: hsl(var(--loo-color-black-h), var(--loo-color-black-s), 90%);
  --loolabsh-drawer-border-width: 0;
  --loolabsh-drawer-title-font-size: var(--loo-font-size-l);
  --loolabsh-drawer-close-font-size: var(--loo-h2-font-size);
  --loolabsh-drawer-duration: 1s;
}
@media (min-width: 992px) {
  .drawer {
    --loolabsh-drawer-duration: 0.5s;
  }
}
.drawer-title {
  font-family: var(--loo-font-family-logo);
  font-size: var(--loo-h1-font-size);
  margin-left: var(--loolabsh-drawer-padding-x);
}
.drawer__header .page-logo {
  --page-logo-height: var(--loo-page-header-logo-height);
  margin: var(--loo-spacing-s) 0 0 var(--loo-spacing-s);
}
@media (min-width: 992px) {
  .drawer__header .page-logo {
    margin: var(--loo-spacing) 0 0 var(--loo-spacing);
  }
}
.drawer__body, .drawer__footer {
  align-items: center;
  display: flex;
  flex-direction: column;
}
.drawer__body {
  --loo-scrollbar-track-color: transparent;
}
.drawer__body > :first-child:not(.row) {
  margin-top: 0;
}
.drawer__body > :last-child:not(.row) {
  margin-bottom: 0;
}
.drawer__body::-webkit-scrollbar {
  height: var(--loo-scrollbar-size, 6px);
  width: var(--loo-scrollbar-size, 6px);
}
.drawer__body::-webkit-scrollbar-thumb {
  background: var(--loo-scrollbar-color, #000);
}
.drawer__body::-webkit-scrollbar-track {
  background: var(--loo-scrollbar-track-color, #fff);
}
.drawer__body {
  scrollbar-face-color: var(--loo-scrollbar-color, #000);
  scrollbar-track-color: var(--loo-scrollbar-track-color, #fff);
}
.drawer__controls {
  background-image: url(./media/elements/blob_tertiary.svg);
  background-position: center right -20px;
  background-repeat: no-repeat;
  background-size: contain;
  display: flex;
  height: 120px;
  justify-content: flex-end;
  padding-right: var(--loo-spacing);
  margin-left: auto;
  width: 120px;
}
.drawer__controls .icon-button {
  --_ibtn-color: var(--loo-color-white) !important;
}
.drawer__controls .icon-button:hover {
  --_ibtn-color: var(--loo-color-text) !important;
}
.drawer[data-placement=custom] .drawer__overlay, .drawer[data-placement=custom] .drawer__overlay::before {
  border-radius: 50%;
  bottom: 50%;
  height: 0;
  left: 50%;
  opacity: 1;
  padding-top: 250vh;
  right: 50%;
  top: 50%;
  transform: translate(100%, -150%) scale(0);
  width: 250vh;
}
.drawer[data-placement=custom] .drawer__overlay {
  transition-delay: var(--loolabsh-drawer-duration);
}
.drawer[data-placement=custom] .drawer__overlay::before {
  background: var(--loo-color-lemon);
  content: "";
  display: block;
  transition: var(--loolabsh-drawer-duration) all ease-in-out;
}
.drawer[data-placement=custom] .drawer__body,
.drawer[data-placement=custom] .drawer__footer {
  transform: translateX(50px);
  transition-delay: 0s;
}
.drawer.-open[data-placement=custom] .drawer__overlay {
  transition-delay: 0s;
  transform: translate(-50%, -50%) scale(1);
}
.drawer.-open[data-placement=custom] .drawer__overlay::before {
  transition-delay: calc(var(--loolabsh-drawer-duration) * 0.5);
  transform: translate(5%, -113%) scale(1);
}
.drawer.-open[data-placement=custom] .drawer__body,
.drawer.-open[data-placement=custom] .drawer__footer {
  transform: translateX(0);
  transition-delay: var(--loolabsh-drawer-duration);
}

.file {
  --loolabsh-file-color: var(--loolabsh-color-text, #3e3e3e);
  --loolabsh-file-color-hover: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-file-background-color: transparent;
  --loolabsh-file-background-color-hover: var(--loolabsh-file-background-color);
  --loolabsh-file-border-color: var(--loolabsh-color-border, #959595);
  --loolabsh-file-border-color-hover: var(--loolabsh-file-border-color);
  --loolabsh-file-border-radius: var(--loolabsh-border-radius, 0px);
  --loolabsh-file-border-width: var(--loolabsh-border-width, 1px);
  --loolabsh-file-gap: var(--loolabsh-spacing, 1rem);
  --loolabsh-file-padding-x: var(--loolabsh-spacing, 1rem);
  --loolabsh-file-padding-y: var(--loolabsh-spacing, 1rem);
  --loolabsh-file-duration: var(--loolabsh-duration, 0.15s);
  --_file-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-file-duration));
  --_file-color: var(--loolabsh-file-color);
  --_file-bg-color: var(--loolabsh-file-background-color);
  --_file-border-color: var(--loolabsh-file-border-color);
  --_file-desc-color: var(--loolabsh-file-description-color, var(--loolabsh-file-color));
  --_file-prefix-color: var(--loolabsh-file-prefix-color, var(--loolabsh-file-color));
  --_file-suffix-color: var(--loolabsh-file-suffix-color, var(--loolabsh-file-color));
  align-items: center;
  background-color: var(--_file-bg-color);
  border: var(--loolabsh-file-border-width) solid var(--_file-border-color);
  border-radius: var(--loolabsh-file-border-radius);
  color: var(--_file-color);
  display: flex;
  font-size: var(--loolabsh-file-font-size, 1rem);
  gap: var(--loolabsh-file-gap);
  justify-content: flex-start;
  line-height: 1;
  list-style: none;
  overflow: hidden;
  padding: var(--loolabsh-file-padding-y) var(--loolabsh-file-padding-x);
  pointer-events: none;
  position: relative;
  transition: all var(--_file-duration) ease-in-out;
}
.file i,
.file .icon {
  pointer-events: none;
  position: relative;
}
.file i:not(.far):not(.fa):not(.fas):not(.fab):not(.fal),
.file .icon:not(.far):not(.fa):not(.fas):not(.fab):not(.fal) {
  font-weight: normal;
}
.file:hover {
  --_file-color: var(--loolabsh-file-color-hover);
  --_file-bg-color: var(--loolabsh-file-background-color-hover);
  --_file-border-color: var(--loolabsh-file-border-color-hover);
  --_file-prefix-color: var(--loolabsh-file-prefix-color-hover, var(--loolabsh-file-color));
  --_file-desc-color: var(--loolabsh-file-description-color-hover, var(--loolabsh-file-color));
  --_file-suffix-color: var(--loolabsh-file-suffix-color-hover, var(--loolabsh-file-color));
}
.file__label {
  align-self: center;
  color: currentColor;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: none;
  white-space: nowrap;
  z-index: 2;
}
.file__label .title {
  display: block;
  line-height: normal;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.file__label .description {
  color: var(--_file-desc-color);
  display: block;
  font-size: var(--loolabsh-file-description-font-size, var(--loolabsh-font-size-xs, 0.5rem));
  line-height: normal;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
a.file__label {
  color: inherit;
  pointer-events: auto;
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
}
a.file__label::after {
  content: ""; /* stylelint-disable-line string-quotes */
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.file__prefix, .file__suffix {
  align-items: center;
  align-self: center;
  display: flex;
  flex: 0 0 auto;
}
.file__prefix {
  color: var(--_file-prefix-color);
  font-size: var(--loolabsh-file-prefix-font-size, 1em);
  letter-spacing: normal;
  text-transform: none;
  white-space: nowrap;
  z-index: 1;
}
.file__prefix > i::before {
  content: "\f15b"; /* stylelint-disable-line string-quotes */
}
.file__suffix {
  color: var(--_file-suffix-color);
  font-size: var(--loolabsh-file-suffix-font-size, var(--loolabsh-font-size-xs, 0.5rem));
  margin-left: auto;
  text-transform: uppercase;
  white-space: nowrap;
  z-index: 3;
}
.file__suffix > * + *::before {
  content: ", "; /* stylelint-disable-line string-quotes */
}
.file:focus-within {
  outline: var(--loolabsh-focus-outline-width) var(--loolabsh-focus-outline-style) var(--focus-outline-color, var(--loolabsh-focus-outline-color));
  outline-offset: var(--loolabsh-focus-outline-offset);
}
.file:focus-within a.file__label, .file:focus-within a.file__label:focus {
  box-shadow: none;
  outline: none;
}

.file.-compact {
  --loolabsh-file-compact-gap: calc(var(--loolabsh-file-gap) / 2);
  --loolabsh-file-compact-padding-x: calc(var(--loolabsh-file-padding-x) / 2);
  --loolabsh-file-compact-padding-y: calc(var(--loolabsh-file-padding-y) / 2);
  gap: var(--loolabsh-file-compact-gap);
  padding: var(--loolabsh-file-compact-padding-y) var(--loolabsh-file-compact-padding-x);
}
.file.-compact .file__label .description {
  /* stylelint-disable declaration-no-important */
  border: 0 !important;
  clip: rect(0, 0, 0, 0) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  white-space: nowrap !important;
  width: 1px !important;
  /* stylelint-enable declaration-no-important */
}

.file-group {
  --loolabsh-file-group-gap: var(--loolabsh-spacing-s, 0.5rem);
}
.file-group .file + .file {
  margin-top: var(--loolabsh-file-group-gap);
}

.file-group.-stacked {
  --loolabsh-file-group-gap: 0;
}
.file-group.-stacked .file {
  z-index: 1;
}
.file-group.-stacked .file:hover {
  z-index: 2;
}
.file-group.-stacked .file:first-child:not(:last-child) {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.file-group.-stacked .file:last-child:not(:first-child) {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.file-group.-stacked .file:not(:first-child):not(:last-child) {
  border-radius: 0;
}
.file-group.-stacked .file:not(:first-child) {
  margin-top: calc(var(--loolabsh-file-border-width) * -1);
}

.file {
  --loolabsh-file-border-color: var(--loo-color-coral);
  --loolabsh-file-border-color-hover: var(--loo-color-primary);
  --loolabsh-file-border-radius: var(--loo-spacing);
  --loolabsh-file-border-width: 2px;
}
.file:hover .file__prefix > i {
  transform: scale(1.3) rotate(-15deg);
}
.file:hover .file__prefix > i::before {
  content: "\f56d";
}
.file__label .title {
  font-family: var(--loo-font-family-logo);
}
.file__prefix > i {
  /* stylelint-disable string-quotes */
  transform: scale(1) rotate(0);
  transition: all 0.5s ease-in-out;
  /* stylelint-enable string-quotes */
}
.file__prefix > i.-pdf::before {
  content: "\f1c1";
}
.file__prefix > i.-csv::before {
  content: "\f6dd";
}
.file__prefix > i.-txt::before {
  content: "\f15c";
}
.file__prefix > i[class*=-doc]::before, .file__prefix > i[class*=-dot]::before, .file__prefix > i.-odt::before {
  content: "\f1c2";
}
.file__prefix > i[class*=-xls]::before, .file__prefix > i[class*=-xlt]::before {
  content: "\f1c3";
}
.file__prefix > i[class*=-ppt]::before {
  content: "\f1c4";
}
.file__prefix > i[class*=-jp]::before, .file__prefix > i.-png::before, .file__prefix > i.-gif::before {
  content: "\f1c5";
}
.file__prefix > i.-vimeo::before, .file__prefix > i.-youtube::before, .file__prefix > i.-mp4::before {
  content: "\f1c8";
}
.file__prefix > i.-mp3::before, .file__prefix > i.-ogg::before, .file__prefix > i.-wav::before {
  content: "\f1c7";
}
.file__prefix > i.-ace::before, .file__prefix > i.-bin::before, .file__prefix > i.-cab::before, .file__prefix > i.-zip::before, .file__prefix > i.-rar::before {
  content: "\f1c6";
}
.file__suffix .ext {
  font-weight: var(--loo-font-weight-bold);
}
.file-group {
  --loolabsh-file-group-gap: var(--loo-spacing);
}

/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
/* stylelint-disable-line length-zero-no-unit */
.form {
  --loolabsh-form-control-background-color: var(--loolabsh-input-background-color, #fff);
  --loolabsh-form-control-background-color-hover: var(--loolabsh-form-control-background-color);
  --loolabsh-form-control-background-color-focus: var(--loolabsh-form-control-background-color);
  --loolabsh-form-control-border-color: var(--loolabsh-input-border-color, #959595);
  --loolabsh-form-control-border-color-hover: var(--loolabsh-form-control-border-color);
  --loolabsh-form-control-border-color-focus: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-form-control-border-width: var(--loolabsh-input-border-width, var(--loolabsh-border-width, 1px));
  --loolabsh-form-control-border-radius: var(--loolabsh-input-border-radius, var(--loolabsh-border-radius, 0px));
  --loolabsh-form-control-color: var(--loolabsh-input-color, #000);
  --loolabsh-form-control-color-hover: var(--loolabsh-form-control-color);
  --loolabsh-form-control-color-focus: var(--loolabsh-form-control-color);
  --loolabsh-form-control-font-size: var(--loolabsh-input-font-size, 1rem);
  --loolabsh-form-control-font-style: var(--loolabsh-input-font-style, normal);
  --loolabsh-form-control-font-weight: var(--loolabsh-input-font-weight, normal);
  --loolabsh-form-control-height: var(--loolabsh-input-height, var(--loolabsh-font-size, 40px));
  --loolabsh-form-control-padding: var(--loolabsh-input-padding, var(--loolabsh-spacing, 1rem));
  --loolabsh-form-control-duration: var(--loolabsh-input-duration, var(--loolabsh-duration, 0.15s));
  --loolabsh-form-control-disabled-background-color: var(--loolabsh-input-disabled-background-color, #fff);
  --loolabsh-form-control-disabled-opacity: var(--loolabsh-input-disabled-opacity, var(--loolabsh-disabled-opacity, 0.4));
  --loolabsh-form-control-readonly-background-color: var(--loolabsh-input-readonly-background-color, #f1f1f1);
  --loolabsh-form-control-readonly-opacity: var(--loolabsh-input-readonly-opacity, var(--loolabsh-readonly-opacity, 1));
  --loolabsh-form-invalid-border-color: var(--loolabsh-color-invalid, #fb3e4e);
  --loolabsh-form-invalid-label-color: var(--loolabsh-color-invalid, #fb3e4e);
  --loolabsh-form-label-color: var(--loolabsh-color-text, #3e3e3e);
  --loolabsh-form-label-font-size: var(--loolabsh-font-size-s, 0.75rem);
  --loolabsh-form-label-font-style: normal;
  --loolabsh-form-label-font-weight: normal;
  --loolabsh-form-label-margin: var(--loolabsh-spacing-s, 0.5rem);
  --loolabsh-form-text-color: var(--loolabsh-color-text, #3e3e3e);
  --loolabsh-form-text-font-size: var(--loolabsh-font-size-xs, 0.5rem);
  --loolabsh-form-text-font-style: normal;
  --loolabsh-form-text-font-weight: normal;
  --loolabsh-form-text-margin: var(--loolabsh-spacing-s, 0.5rem);
}

.form-control, .form-select {
  --_foco-background-color: var(--loolabsh-form-control-background-color);
  --_foco-border-color: var(--loolabsh-form-control-border-color);
  --_foco-color: var(--loolabsh-form-control-color);
  --_foco-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-form-control-duration));
  --_foco-line-height: calc(var(--loolabsh-form-control-height) - var(--loolabsh-form-control-border-width) * 2);
  --_poco-padding-left: var(--loolabsh-form-control-padding-left, var(--loolabsh-form-control-padding));
  --_poco-padding-right: var(--loolabsh-form-control-padding-right, var(--loolabsh-form-control-padding));
  background-color: var(--_foco-background-color) !important; /* stylelint-disable-line declaration-no-important */
  border: var(--loolabsh-form-control-border-width) solid var(--_foco-border-color) !important; /* stylelint-disable-line declaration-no-important */
  border-radius: var(--loolabsh-form-control-border-radius);
  color: var(--_foco-color) !important; /* stylelint-disable-line declaration-no-important */
  font-size: var(--loolabsh-form-control-font-size);
  font-style: var(--loolabsh-form-control-font-style);
  font-weight: var(--loolabsh-form-control-font-weight);
  line-height: var(--_foco-line-height);
  padding-bottom: 0;
  padding-left: var(--_poco-padding-left) !important; /* stylelint-disable-line declaration-no-important */
  padding-right: var(--_poco-padding-right) !important; /* stylelint-disable-line declaration-no-important */
  padding-top: 0; /* stylelint-disable-line declaration-block-no-redundant-longhand-properties */
  text-transform: var(--loolabsh-form-control-text-transform, var(--loolabsh-input-text-transform, none));
  transition-duration: var(--_foco-duration);
  transition-property: all;
  transition-timing-function: ease-in-out;
}

.form-control:hover:not(:disabled), .form-control:hover:not([disabled]), .form-control:hover:not(._disabled), .form-select:hover:not(:disabled), .form-select:hover:not([disabled]), .form-select:hover:not(._disabled) {
  --_foco-background-color: var(--loolabsh-form-control-background-color-hover);
  --_foco-border-color: var(--loolabsh-form-control-border-color-hover);
  --_foco-color: var(--loolabsh-form-control-color-hover);
  box-shadow: none;
}

.form-control:focus, .form-select:focus {
  outline: none;
}

.form-control:focus:not(:disabled), .form-control:focus:not([disabled]), .form-control:focus:not(._disabled), .form-select:focus:not(:disabled), .form-select:focus:not([disabled]), .form-select:focus:not(._disabled) {
  --_foco-background-color: var(--loolabsh-form-control-background-color-focus);
  --_foco-border-color: var(--loolabsh-form-control-border-color-focus);
  --_foco-color: var(--loolabsh-form-control-color-focus);
  box-shadow: none;
}

.form-control._focus-visible:focus, .form-control:focus-visible:focus, .form-select._focus-visible:focus, .form-select:focus-visible:focus {
  outline: var(--loolabsh-focus-outline-width, 1px) var(--loolabsh-focus-outline-style, dotted) var(--loolabsh-focus-outline-color, currentColor);
  outline-offset: var(--loolabsh-focus-outline-offset, 2px);
}

.form-control:disabled, .form-control[disabled], .form-control._disabled, .form-select:disabled, .form-select[disabled], .form-select._disabled {
  --_foco-background-color: var(--loolabsh-form-control-disabled-background-color);
  opacity: var(--loolabsh-form-control-disabled-opacity);
  pointer-events: none;
}

.form-control:-moz-read-only[readonly], .form-select:-moz-read-only[readonly] {
  --_foco-background-color: var(--loolabsh-form-control-readonly-background-color);
  opacity: var(--loolabsh-form-control-readonly-opacity);
}

.form-control:read-only[readonly], .form-control[readonly], .form-control._readonly, .form-select:read-only[readonly], .form-select[readonly], .form-select._readonly {
  --_foco-background-color: var(--loolabsh-form-control-readonly-background-color);
  opacity: var(--loolabsh-form-control-readonly-opacity);
}

.form-control.-s,
.form-select.-s,
[class*=form-control-sm] { /* stylelint-disable-line string-quotes */
  --loolabsh-form-control-height: var(--loolabsh-input-height-s, 30px);
  --loolabsh-form-control-font-size: var(--loolabsh-input-font-size-s, var(--loolabsh-font-size-s, 0.75rem));
  --loolabsh-form-control-padding: var(--loolabsh-input-padding-s, var(--loolabsh-spacing-s, 0.5rem));
}

.form-control.-l,
.form-select.-l,
[class*=form-control-lg] { /* stylelint-disable-line string-quotes */
  --loolabsh-form-control-height: var(--loolabsh-input-height-l, 50px);
  --loolabsh-form-control-font-size: var(--loolabsh-input-font-size-l, var(--loolabsh-font-size-l, 1.25rem));
  --loolabsh-form-control-padding: var(--loolabsh-input-padding-l, var(--loolabsh-spacing-l, 1.25rem));
}

/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
/* stylelint-disable-line length-zero-no-unit */
.form-text {
  color: var(--loolabsh-form-text-color);
  font-size: var(--loolabsh-form-text-font-size);
  font-style: var(--loolabsh-form-text-font-style);
  font-weight: var(--loolabsh-form-text-font-weight);
  margin-top: var(--loolabsh-form-text-margin);
}

/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
/* stylelint-disable-line length-zero-no-unit */
.form-fieldset {
  margin: 0;
}

.form-fieldset ~ fieldset {
  margin-top: var(--loolabsh-form-fieldset-margin, var(--loolabsh-spacing, 1rem));
}

.form-legend {
  color: var(--loolabsh-form-legend-color, var(--loolabsh-color-text, #3e3e3e));
  float: none;
  font-size: var(--loolabsh-form-legend-font-size, var(--loolabsh-font-size, 1rem));
  font-weight: var(--loolabsh-form-legend-font-weight, normal);
}

.form-legend:not(:last-child) {
  margin-bottom: var(--loolabsh-form-legend-margin, var(--loolabsh-spacing, 1rem));
}

/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
/* stylelint-disable-line length-zero-no-unit */
.form-label {
  color: var(--loolabsh-form-label-color);
  font-size: var(--loolabsh-form-label-font-size);
  font-style: var(--loolabsh-form-label-font-style);
  font-weight: var(--loolabsh-form-label-font-weight);
  margin-bottom: var(--loolabsh-form-label-margin);
}

.form-label__required {
  color: var(--loolabsh-form-label-required-color, currentColor);
  padding-left: var(--loolabsh-form-label-required-margin, var(--loolabsh-spacing-xxs, 0.125rem));
}

.form-label.-match-form-control,
[class*=col-form-label] { /* stylelint-disable-line string-quotes */
  --_lbl-height: var(--loolabsh-form-input-height, 40px);
  align-items: center;
  display: inline-flex;
  line-height: normal;
  margin-bottom: 0;
  min-height: var(--_lbl-height);
  padding-bottom: 0;
  padding-top: 0;
}

.form-label.-match-form-control.-l,
[class*=col-form-label-lg] { /* stylelint-disable-line string-quotes */
  --_lbl-height: var(--loolabsh-form-input-height-l, 50px);
}

.form-label.-match-form-control.-s,
[class*=col-form-label-sm] { /* stylelint-disable-line string-quotes */
  --_lbl-height: var(--loolabsh-form-input-height-s, 30px);
}

.form-label.-s,
[class*=col-form-label-sm] { /* stylelint-disable-line string-quotes */
  --loolabsh-form-label-font-size: var(--loolabsh-input-font-size-s, var(--loolabsh-font-size-s, 0.75rem));
}

.form-label.-l,
[class*=col-form-label-lg] { /* stylelint-disable-line string-quotes */
  --loolabsh-form-label-font-size: var(--loolabsh-input-font-size-l, var(--loolabsh-font-size-l, 1.25rem));
}

/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
/* stylelint-disable-line length-zero-no-unit */
.form-control {
  height: var(--loolabsh-form-control-height);
}

.form-control::-webkit-input-placeholder {
  color: var(--loolabsh-form-control-placeholder-color, var(--loolabsh-color-placeholder, #959595));
}

.form-control::-moz-placeholder {
  color: var(--loolabsh-form-control-placeholder-color, var(--loolabsh-color-placeholder, #959595));
}

.form-control::placeholder {
  color: var(--loolabsh-form-control-placeholder-color, var(--loolabsh-color-placeholder, #959595));
}

.form-control.-plaintext {
  --loolabsh-form-control-padding: var(--loolabsh-form-control-plaintext-padding, 0);
}

.form-control.-plaintext, .form-control.-plaintext:hover {
  --_foco-background-color: transparent;
  --_foco-border-color: transparent;
  padding: 0;
}

/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
/* stylelint-disable-line length-zero-no-unit */
.form-select {
  --loolabsh-form-select-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'  viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='black' stroke-linecap='square' stroke-linejoin='miter' stroke-width='3' d='M2 5l6 6 6-6'/%3E%3C/svg%3E");
  --loolabsh-form-select-multiple-padding-y: calc(var(--loolabsh-form-control-padding) / 2);
  background-image: var(--loolabsh-form-select-icon) !important; /* stylelint-disable-line declaration-no-important */
}

.form-select:not([multiple]) {
  --loolabsh-form-control-padding-right: calc(var(--loolabsh-form-control-padding) * var(--loolabsh-form-select-icon-gap-factor, 2.5));
}

.form-select option {
  padding: var(--loolabsh-form-option-pading-y, var(--loolabsh-spacing-xxs, 0.125rem)) var(--loolabsh-form-option-pading-x, 0);
}

.form-select[multiple], .form-select[size]:not([size="1"]) { /* stylelint-disable-line string-quotes */
  background-image: none !important; /* stylelint-disable-line declaration-no-important */
  height: var(--loolabsh-form-select-height, "auto");
  min-height: var(--loolabsh-form-control-height);
  padding-bottom: var(--loolabsh-form-select-multiple-padding-y);
  padding-top: var(--loolabsh-form-select-multiple-padding-y);
}

.form-select:-moz-focusring {
  text-shadow: none;
}

/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
/* stylelint-disable-line length-zero-no-unit */
textarea.form-control {
  --loolabsh-form-textarea-padding-y: calc(var(--loolabsh-form-control-padding) / 2);
  height: var(--loolabsh-form-textarea-height, calc(var(--loolabsh-form-control-height) * 2));
  line-height: inherit;
  min-height: var(--loolabsh-form-textarea-min-height, var(--loolabsh-form-control-height)) !important; /* stylelint-disable-line declaration-no-important */
  padding-bottom: var(--loolabsh-form-textarea-padding-y);
  padding-top: var(--loolabsh-form-textarea-padding-y);
}

/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
/* stylelint-disable-line length-zero-no-unit */
.form-control {
  --_foup-button-offset: calc(var(--loolabsh-form-control-padding) * -1);
}

.form-control::-webkit-file-upload-button {
  background-color: var(--loolabsh-form-upload-button-background-color, var(--loolabsh-color-grey-light, #f1f1f1));
  border-inline-end-width: var(--loolabsh-form-control-border-width);
  color: var(--loolabsh-form-upload-button-border-color, var(--loolabsh-form-control-color));
  line-height: var(--_foco-line-height);
  margin: 0 var(--_foup-button-offset);
  -webkit-margin-end: var(--loolabsh-form-control-padding);
          margin-inline-end: var(--loolabsh-form-control-padding);
  padding: 0 var(--loolabsh-form-control-padding);
  transition-duration: var(--_foco-duration);
  -webkit-transition-property: all;
  transition-property: all;
  transition-timing-function: ease-in-out;
}

.form-control::file-selector-button {
  background-color: var(--loolabsh-form-upload-button-background-color, var(--loolabsh-color-grey-light, #f1f1f1));
  border-inline-end-width: var(--loolabsh-form-control-border-width);
  color: var(--loolabsh-form-upload-button-border-color, var(--loolabsh-form-control-color));
  line-height: var(--_foco-line-height);
  margin: 0 var(--_foup-button-offset);
  -webkit-margin-end: var(--loolabsh-form-control-padding);
          margin-inline-end: var(--loolabsh-form-control-padding);
  padding: 0 var(--loolabsh-form-control-padding);
  transition-duration: var(--_foco-duration);
  transition-property: all;
  transition-timing-function: ease-in-out;
}

.form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button {
  background-color: var(--loolabsh-form-upload-button-background-color-hover, var(--loolabsh-color-grey, #e8e8e8));
  color: var(--loolabsh-form-upload-button-border-color-hover, var(--loolabsh-form-control-color-hover));
}

.form-control:hover:not(:disabled):not([readonly])::file-selector-button {
  background-color: var(--loolabsh-form-upload-button-background-color-hover, var(--loolabsh-color-grey, #e8e8e8));
  color: var(--loolabsh-form-upload-button-border-color-hover, var(--loolabsh-form-control-color-hover));
}

.form-control:focus:not(:disabled):not([readonly])::-webkit-file-upload-button {
  background-color: var(--loolabsh-form-upload-button-background-color-focus, var(--loolabsh-color-grey, #e8e8e8));
  color: var(--loolabsh-form-upload-button-color-focus, var(--loolabsh-form-control-color-focus));
}

.form-control:focus:not(:disabled):not([readonly])::file-selector-button {
  background-color: var(--loolabsh-form-upload-button-background-color-focus, var(--loolabsh-color-grey, #e8e8e8));
  color: var(--loolabsh-form-upload-button-color-focus, var(--loolabsh-form-control-color-focus));
}

/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
/* stylelint-disable-line length-zero-no-unit */
.form-check {
  --loolabsh-form-check-accent-color: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-form-check-accent-color-contrast: var(--loolabsh-color-ui-contrast, #fff);
  --loolabsh-form-check-background-color: var(--loolabsh-form-control-background-color);
  --loolabsh-form-check-border-color: var(--loolabsh-form-control-border-color);
  --loolabsh-form-check-border-radius: var(--loolabsh-form-control-border-radius);
  --loolabsh-form-check-border-width: var(--loolabsh-form-control-border-width);
  --loolabsh-form-check-label-color: var(--loolabsh-form-label-color);
  --loolabsh-form-check-control-gap: var(--loolabsh-spacing-s, 0.5rem);
  --loolabsh-form-check-gap: var(--loolabsh-spacing-s, 0.5rem);
  --loolabsh-form-check-gap-inline: var(--loolabsh-spacing, 1rem);
  --loolabsh-form-check-padding: 0;
  --loolabsh-form-check-size: 20px;
  --loolabsh-form-check-duration: 0.15s;
  --loolabsh-form-check-icon-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'  viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23fff' stroke-linecap='square' stroke-linejoin='miter' stroke-width='3' d='M6 10l3 3l6-6'/%3E%3C/svg%3E");
  --loolabsh-form-check-icon-check-indeterminate: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'  viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23fff' stroke-linecap='square' stroke-linejoin='miter' stroke-width='3' d='M6 10h8'/%3E%3C/svg%3E");
  --loolabsh-form-check-icon-radio: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'  viewBox='-10 -10 20 20'%3E%3Ccircle r='4' fill='%23fff'/%3E%3C/svg%3E");
  --_foch-label-color: var(--loolabsh-form-check-label-color);
  --_foch-border-color: var(--loolabsh-form-check-border-color);
  --_foch-background-color: var(--loolabsh-form-check-background-color);
  --_foch-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-form-check-duration));
  align-items: center;
  display: flex;
  gap: var(--loolabsh-form-check-control-gap);
  margin: 0;
  min-height: auto;
  padding: var(--loolabsh-form-check-padding);
}

.form-check-label {
  color: var(--_foch-label-color) !important; /* stylelint-disable-line declaration-no-important */
  cursor: pointer;
}

.form-check + .form-check {
  margin-top: var(--loolabsh-form-check-gap);
}

.form-check-inline {
  display: inline-flex;
  margin: 0 var(--loolabsh-form-check-gap) var(--loolabsh-form-check-gap) 0;
}

.form-check .form-check-input {
  background-color: var(--_foch-background-color) !important; /* stylelint-disable-line declaration-no-important */
  border-color: var(--_foch-border-color) !important; /* stylelint-disable-line declaration-no-important */
  border-style: solid;
  border-width: var(--loolabsh-form-check-border-width);
  flex-shrink: 0;
  float: none;
  height: var(--loolabsh-form-check-size);
  margin: 0;
  transition: all var(--_foch-duration) ease-in-out;
  width: var(--loolabsh-form-check-size);
}

.form-check .form-check-input[type=checkbox] { /* stylelint-disable-line string-quotes */
  border-radius: var(--loolabsh-form-check-border-radius);
}

.form-check .form-check-input[type=radio] { /* stylelint-disable-line string-quotes */
  border-radius: 100%;
}

.form-check .form-check-input:active {
  filter: none;
}

.form-check .form-check-input:focus {
  --_foch-border-color: var(--loolabsh-form-check-accent-color);
  box-shadow: none;
}

.form-check .form-check-input._focus-visible:focus, .form-check .form-check-input:focus-visible:focus {
  outline: var(--loolabsh-focus-outline-width, 1px) var(--loolabsh-focus-outline-style, dotted) var(--loolabsh-focus-outline-color, currentColor);
  outline-offset: var(--loolabsh-focus-outline-offset, 2px);
}

.form-check .form-check-input:checked {
  --_foch-background-color: var(--loolabsh-form-check-accent-color);
  --_foch-border-color: var(--loolabsh-form-check-accent-color);
}

.form-check .form-check-input:checked[type=checkbox] { /* stylelint-disable-line string-quotes */
  background-image: var(--loolabsh-form-check-icon-check);
}

.form-check .form-check-input:checked[type=radio] { /* stylelint-disable-line string-quotes */
  background-image: var(--loolabsh-form-check-icon-radio);
}

.form-check .form-check-input[type=checkbox]:indeterminate { /* stylelint-disable-line string-quotes */
  --_foch-background-color: var(--loolabsh-form-check-accent-color);
  --_foch-border-color: var(--loolabsh-form-check-accent-color);
  background-image: var(--loolabsh-form-check-icon-check-indeterminate);
}

.form-check .form-check-input:disabled, .form-check .form-check-input[disabled], .form-check .form-check-input._disabled {
  opacity: var(--loolabsh-form-check-disabled-opacity, var(--loolabsh-input-disabled-opacity, 0.4));
  pointer-events: none;
}

.form-check .form-check-input:disabled ~ .form-check-label, .form-check .form-check-input[disabled] ~ .form-check-label, .form-check .form-check-input._disabled ~ .form-check-label {
  opacity: var(--loolabsh-form-check-disabled-opacity, var(--loolabsh-input-disabled-opacity, 0.4));
  pointer-events: none;
}

.form-check.form-switch {
  --loolabsh-form-check-icon-switch-off: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'  viewBox='-10 -10 20 20'%3E%3Ccircle r='8' fill='%23000'/%3E%3C/svg%3E");
  --loolabsh-form-check-icon-switch-on: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'  viewBox='-10 -10 20 20'%3E%3Ccircle r='8' fill='%23fff'/%3E%3C/svg%3E");
}

.form-check.form-switch .form-check-input {
  background-image: var(--loolabsh-form-check-icon-switch-off);
  border-radius: var(--loolabsh-form-check-size);
  cursor: pointer;
  margin-left: 0;
  transition: all var(--_foch-duration) ease-in-out;
  width: calc(var(--loolabsh-form-check-size) * 2);
}

.form-check.form-switch .form-check-input[disabled=disabled] {
  cursor: not-allowed !important;
}

.form-check.form-switch .form-check-input:focus {
  background-image: var(--loolabsh-form-check-icon-switch-off);
}

.form-check.form-switch .form-check-input:checked {
  background-image: var(--loolabsh-form-check-icon-switch-on);
}

.form-check-group {
  display: flex;
  flex-flow: column wrap;
  gap: var(--loolabsh-form-check-group-gap, var(--loolabsh-spacing-s, 0.5rem));
}

.form-check-group > .form-check {
  margin: 0;
}

.form-check-group.-inline {
  flex-direction: row;
  gap: var(--loolabsh-form-check-group-gap-inline, var(--loolabsh-spacing, 1rem));
}

/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
/* stylelint-disable-line length-zero-no-unit */
.form-control-color {
  --loolabsh-form-color-swatch-size: 1em;
  padding: 0 var(--loolabsh-form-color-padding, 0);
  width: var(--loolabsh-form-color-width, var(--loolabsh-form-control-height));
}

.form-control-color::-moz-color-swatch {
  border: 0 none;
  border-radius: var(--loolabsh-form-control-border-radius);
  height: var(--loolabsh-form-color-swatch-size);
  width: var(--loolabsh-form-color-swatch-size);
}

.form-control-color::-webkit-color-swatch-wrapper {
  position: relative;
}

.form-control-color::-webkit-color-swatch {
  border: 0 none;
  border-radius: var(--loolabsh-form-control-border-radius);
  height: var(--loolabsh-form-color-swatch-size);
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
  width: var(--loolabsh-form-color-swatch-size);
}

/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
/* stylelint-disable-line length-zero-no-unit */
.input-group > *:not(label):not(:first-child) {
  margin-left: calc(var(--loolabsh-form-control-border-width) * -1) !important; /* stylelint-disable-line declaration-no-important */
}

.input-group > *:not(label):hover, .input-group > *:not(label):focus {
  z-index: 2;
}

.input-group-text {
  --loolabsh-form-input-group-text-border-width: var(--loolabsh-form-control-border-width);
  --loolabsh-form-input-group-text-border-color: var(--loolabsh-form-control-border-color);
  --loolabsh-form-input-group-text-color: var(--loolabsh-form-label-color);
  background-color: var(--loolabsh-form-input-group-text-background-color, var(--loolabsh-color-grey-light, #f1f1f1));
  border: var(--loolabsh-form-input-group-text-border-width) solid var(--loolabsh-form-input-group-text-border-color);
  border-radius: var(--loolabsh-form-input-group-text-border-radius, var(--loolabsh-form-control-border-radius));
  color: var(--loolabsh-form-input-group-text-color);
  font-size: var(--loolabsh-form-input-group-text-font-size, var(--loolabsh-form-label-font-size));
  padding: 0 var(--loolabsh-form-input-group-text-padding, var(--loolabsh-form-control-padding));
}

.input-group-text:not(:first-child):not(:last-child) {
  border-left: 0 none;
  border-right: 0 none;
}

/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
/* stylelint-disable-line length-zero-no-unit */
.button-group {
  gap: var(--loolabsh-button-group-gap, 0);
}

.button-group, .button-group-toolbar {
  display: flex;
  flex-wrap: wrap;
}

.button-group > * {
  margin: 0;
}

.button-group > *:first-child:not(:last-child) {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
}

.button-group > *:last-child:not(:first-child) {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}

.button-group > *:not(:first-child):not(:last-child) {
  border-radius: 0;
}

.button-group-toolbar {
  gap: var(--loolabsh-button-group-toolbar-gap, var(--loolabsh-spacing, 1rem));
}

.form-navigation {
  --loolabsh-form-navigation-gap: var(--loolabsh-spacing) var(--loolabsh-spacing-l);
  --loolabsh-form-navigation-button-gap: var(--loolabsh-spacing, 1rem);
  --loolabsh-form-navigation-margin: var(--loolabsh-spacing-l, 1.25rem);
  display: flex;
  flex-wrap: wrap;
  gap: var(--loolabsh-form-navigation-gap);
  justify-content: space-between;
}

.form-navigation:not(:first-child) {
  margin-top: var(--loolabsh-form-navigation-margin);
}

.form-navigation .button-group {
  --loolabsh-button-group-gap: var(--loolabsh-form-navigation-button-gap);
}

.form-navigation > .button,
.form-navigation .button-group > .button {
  flex: 1 0 auto;
}

.form-navigation > .button:last-child,
.form-navigation .button-group > .button:last-child {
  margin-left: auto;
}

/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
/* stylelint-disable-line length-zero-no-unit */
.was-validated .form-control:invalid, .form-control.is-invalid {
  --_foco-background-color: var(--loolabsh-form-invalid-background-color, var(--loolabsh-form-control-background-color));
  --_foco-border-color: var(--loolabsh-form-invalid-border-color, var(--loolabsh-form-control-border-color));
  --_foco-color: var(--loolabsh-form-invalid-color, var(--loolabsh-form-control-color));
  background-image: none;
  padding-right: var(--loolabsh-form-control-padding);
}

.was-validated .form-control:invalid:focus, .form-control.is-invalid:focus {
  box-shadow: none;
}

.was-validated textarea.form-control:invalid, textarea.form-control.is-invalid {
  padding-right: var(--loolabsh-form-control-padding);
}

.was-validated .form-select:invalid, .form-select.is-invalid {
  --_foco-background-color: var(--loolabsh-form-invalid-background-color, var(--loolabsh-form-control-background-color));
  --_foco-border-color: var(--loolabsh-form-invalid-border-color, var(--loolabsh-form-control-border-color));
  --_foco-color: var(--loolabsh-form-invalid-color, var(--loolabsh-form-control-color));
}

.was-validated .form-select:invalid:not([multiple]):not([size]), .was-validated .form-select:invalid:not([multiple])[size="1"], .form-select.is-invalid:not([multiple]):not([size]), .form-select.is-invalid:not([multiple])[size="1"] {
  padding-right: var(--loolabsh-form-control-padding);
}

.was-validated .form-select:invalid:focus, .form-select.is-invalid:focus {
  box-shadow: none;
}

.was-validated .form-check-input:invalid, .form-check-input.is-invalid {
  --_foch-background-color: var(--loolabsh-form-invalid-background-color, var(--loolabsh-form-check-background-color));
  --_foch-border-color: var(--loolabsh-form-invalid-border-color, var(--loolabsh-form-check-border-color));
}

.was-validated .form-check-input:invalid:checked, .form-check-input.is-invalid:checked {
  --_foch-background-color: var(--loolabsh-form-invalid-background-color, var(--loolabsh-form-check-accent-color));
  --_foch-border-color: var(--loolabsh-form-invalid-border-color, var(--loolabsh-form-check-accent-color));
}

.was-validated .form-check-input:invalid:focus, .form-check-input.is-invalid:focus {
  box-shadow: none;
}

.was-validated .form-check-input:invalid ~ .form-check-label, .form-check-input.is-invalid ~ .form-check-label {
  --_foch-label-color: var(--loolabsh-form-invalid-label-color, var(--loolabsh-form-check-label-color));
}

.was-validated .form-control:valid, .form-control.is-valid {
  background-image: none;
  padding-right: var(--loolabsh-form-control-padding);
}

.was-validated .form-control:valid:focus, .form-control.is-valid:focus {
  box-shadow: none;
}

.was-validated textarea.form-control:valid, textarea.form-control.is-valid {
  padding-right: var(--loolabsh-form-control-padding);
}

.was-validated .form-select:valid:not([multiple]):not([size]), .was-validated .form-select:valid:not([multiple])[size="1"], .form-select.is-valid:not([multiple]):not([size]), .form-select.is-valid:not([multiple])[size="1"] {
  padding-right: var(--loolabsh-form-control-padding);
}

.was-validated .form-select:valid:focus, .form-select.is-valid:focus {
  box-shadow: none;
}

.was-validated .form-check-input:valid:focus, .form-check-input.is-valid:focus {
  box-shadow: none;
}

.form {
  --loolabsh-form-control-border-color: var(--loo-color-coral);
  --loolabsh-form-control-border-color-hover: var(--loo-color-primary);
  --loolabsh-form-control-border-color-focus: var(--loo-color-primary);
  --loolabsh-form-control-border-radius: var(--loo-spacing-s);
  --loolabsh-form-control-border-width: 2px;
  --loolabsh-form-control-height: 50px;
  --loolabsh-form-label-font-size: var(--loo-body-font-size);
  --loolabsh-form-label-font-weight: var(--loo-font-weight-bold);
  --loolabsh-form-upload-button-background-color: var(--loolabsh-form-control-border-color);
  --loolabsh-form-upload-button-background-color-hover: var(--loolabsh-form-control-border-color-hover);
  --loolabsh-form-upload-button-border-color: var(--loo-color-white);
  --loolabsh-form-upload-button-border-color-hover: var(--loo-color-white);
  --loolabsh-form-invalid-border-color: var(--loo-color-danger);
  --loolabsh-form-invalid-label-color: var(--loo-color-danger);
}

.gmap {
  --loolabsh-gmap-border-color: var(--loolabsh-color-border, #959595);
  --loolabsh-gmap-border-width: var(--loolabsh-border-width, 1px);
  --loolabsh-gmap-marker-gap: var(--loolabsh-spacing-s);
  background-color: var(--loolabsh-gmap-background-color, var(--loolabsh-color-grey-light, #f1f1f1));
  border: var(--loolabsh-gmap-border-width) solid var(--loolabsh-gmap-border-color);
  border-radius: var(--loolabsh-gmap-border-radius, var(--loolabsh-border-radius, 0px));
  display: block;
  max-height: var(--loolabsh-gmap-max-height, 100vh);
  overflow: hidden;
  padding: 0;
  position: relative;
  width: 100%;
}
.gmap::before {
  content: ""; /* stylelint-disable-line string-quotes */
  display: block;
  padding-bottom: var(--loolabsh-gmap-ratio, calc((9 / 16) * 100%));
}
.gmap-card {
  border-radius: var(--loolabsh-gmap-border-radius);
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
.gmap-marker {
  display: flex;
  flex-flow: column nowrap;
  font-size: var(--loolabsh-gmap-marker-font-size, var(--loolabsh-font-size-xs, 0.5rem));
  gap: var(--loolabsh-gmap-marker-gap);
  line-height: var(--loolabsh-gmap-marker-line-height, 1.375);
}
.gmap-marker > [role=heading] { /* stylelint-disable-line string-quotes */
  font-weight: var(--loolabsh-gmap-marker-title-font-weight, bold);
}
.gmap-marker > [role=heading]:not(:first-child) {
  margin-top: var(--loolabsh-gmap-marker-gap);
}
.gmap-marker > * {
  margin-bottom: 0;
  margin-top: 0;
}
.gmap > .privacy-info {
  display: none;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 10;
}
.gmap[data-privacy] > .privacy-info {
  display: block;
  z-index: 2;
}

.figure {
  margin: 0;
}
.figure img {
  max-width: none;
  width: 100%;
}
.figure > a {
  display: block;
  position: relative;
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
  width: 100%;
}
.figure__caption {
  background-color: var(--loolabsh-figure-caption-background-color, transparent);
  color: var(--loolabsh-figure-caption-color, inherit);
  font-size: var(--loolabsh-figure-caption-font-size, var(--loolabsh-font-size-s, 0.75rem));
  margin: var(--loolabsh-figure-caption-margin, var(--loolabsh-spacing-s, 0.5rem)) 0 0;
  padding: var(--loolabsh-figure-caption-padding, 0);
}
.figure__caption > * {
  display: inline;
  margin: 0;
}
.figure__caption > * + * {
  margin-left: var(--loolabsh-figure-caption-copyright-gap, var(--loolabsh-spacing-s, 0.5rem));
}
.figure__caption > .copyright::before {
  content: "("; /* stylelint-disable-line string-quotes */
}
.figure__caption > .copyright::after {
  content: ")"; /* stylelint-disable-line string-quotes */
}

.figure {
  --loo-figure-img-border-radius: var(--loo-spacing);
}
.figure:not(:first-child:last-child) {
  margin: 0 0 var(--loo-figure-margin, var(--loo-block-element-margin));
}
.figure > a::before {
  content: "";
  color: var(--loo-color-white);
  display: block;
  padding: 0;
}
.figure .picture > img {
  border-radius: var(--loo-figure-img-border-radius);
}
.figure__caption {
  --loolabsh-figure-caption-background-color: var(--loo-color-white);
  --loolabsh-figure-caption-color: var(--loo-body-color);
  --loolabsh-figure-caption-padding: var(--loo-spacing-s);
  border-radius: var(--loo-spacing-xs);
  font-weight: var(--loo-font-weight-bold);
  margin: calc(var(--loolabsh-figure-caption-padding) * -1) auto var(--loo-spacing) auto;
  position: relative;
  width: calc(100% - var(--loo-spacing-l));
  z-index: 2;
}

.jumplist {
  --loolabsh-jumplist-link-background-color: transparent;
  --loolabsh-jumplist-link-background-color-hover: transparent;
  --loolabsh-jumplist-link-background-color-active: var(--loolabsh-jumplist-link-background-color-hover);
  --loolabsh-jumplist-link-color: var(--loolabsh-color-text, #3e3e3e);
  --loolabsh-jumplist-link-color-hover: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-jumplist-link-color-active: var(--loolabsh-jumplist-link-color-hover);
  --loolabsh-jumplist-duration: var(--loolabsh-duration, 0.15s);
  --_jpl-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-jumplist-duration));
  background-color: var(--loolabsh-jumplist-background-color, transparent);
  font-size: var(--loolabsh-jumplist-font-size, var(--loolabsh-font-size, 1rem));
  overflow-x: auto;
  padding: var(--loolabsh-jumplist-padding-y, 0) var(--loolabsh-jumplist-padding-x, 0);
}
.jumplist.-refresh {
  pointer-events: none;
}

.jumplist-menu {
  display: flex;
  flex-flow: column nowrap;
  gap: var(--loolabsh-jumplist-menu-gap, 0);
}
.jumplist-menu .jumplist-menu__link {
  --_jpl-link-background-color: var(--loolabsh-jumplist-link-background-color);
  --_jpl-link-color: var(--loolabsh-jumplist-link-color);
  background-color: var(--_jpl-link-background-color);
  color: var(--_jpl-link-color);
  display: block;
  font-weight: var(--loolabsh-jumplist-link-font-weight, normal);
  padding: var(--loolabsh-jumplist-link-padding-y, 0) var(--loolabsh-jumplist-link-padding-x, 0);
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
  transition-duration: var(--_jpl-duration);
  transition-property: all;
  transition-timing-function: ease-in-out;
  white-space: nowrap;
}
.jumplist-menu .jumplist-menu__link__text {
  display: block;
}
.jumplist-menu .jumplist-menu__link * {
  color: currentColor;
}
.jumplist-menu .jumplist-menu__link:focus, .jumplist-menu .jumplist-menu__link:active {
  --_jpl-link-background-color: var(--loolabsh-jumplist-link-background-color);
  --_jpl-link-color: var(--loolabsh-jumplist-link-color);
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
}
.jumplist-menu .jumplist-menu__link:hover {
  --_jpl-link-background-color: var(--loolabsh-jumplist-link-background-color-hover);
  --_jpl-link-color: var(--loolabsh-jumplist-link-color-hover);
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
}
.jumplist-menu .jumplist-menu__link._active {
  --_jpl-link-background-color: var(--loolabsh-jumplist-link-background-color-active);
  --_jpl-link-color: var(--loolabsh-jumplist-link-color-active);
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
}
.jumplist-menu:empty {
  display: none;
}

.page-jumplist {
  --global-scroll-top-offset: 0;
  --loolabsh-jumplist-background-color: var(--loo-color-white) !important;
  --loolabsh-jumplist-link-font-weight: var(--loo-font-weight-bold);
  border-bottom-left-radius: var(--loo-spacing);
  border-bottom-right-radius: var(--loo-spacing);
  border-color: var(--loolabsh-jumplist-background-color) !important;
}

.jumplist-menu__link-text::before {
  content: "\f111";
  display: inline-block;
  font-family: "Font Awesome 6 Pro";
  font-weight: var(--loo-font-weight-bold);
  margin-right: var(--loo-spacing-xs);
}
.jumplist-menu__link._active .jumplist-menu__link-text::before {
  content: "\f058";
}

.language-picker {
  --loolabsh-language-picker-duration: var(--loolabsh-duration, 0.15s);
  --loolabsh-language-picker-background-color: transparent;
  --loolabsh-language-picker-background-color-hover: transparent;
  --loolabsh-language-picker-background-color-active: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-language-picker-color: inherit;
  --loolabsh-language-picker-color-hover: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-language-picker-color-active: var(--loolabsh-color-ui-contrast, #fff);
  --loolabsh-language-picker-item-gap: 0;
  --loolabsh-language-picker-padding-x: var(--loolabsh-spacing-s, 0.5rem);
  --loolabsh-language-picker-padding-y: var(--loolabsh-spacing-xxs, 0.125rem);
  --loolabsh-language-picker-toggle-background-color: transparent;
  --loolabsh-language-picker-toggle-background-color-hover: transparent;
  --loolabsh-language-picker-toggle-color: inherit;
  --loolabsh-language-picker-toggle-color-hover: var(--loolabsh-language-picker-toggle-color);
  --loolabsh-language-picker-toggle-duration: var(--loolabsh-language-picker-duration);
  --loolabsh-language-picker-menu-background-color: var(--loolabsh-color-white, #fff);
  --loolabsh-language-picker-menu-border-color: var(--loolabsh-color-grey, #e8e8e8);
  --loolabsh-language-picker-menu-border-radius: var(--loolabsh-border-radius, 0px);
  --loolabsh-language-picker-menu-border-width: var(--loolabsh-border-width, 1px);
  --_lnpi-menu-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-language-picker-duration));
  display: inline-block;
  position: relative;
}
.language-picker__desc {
  /* stylelint-disable declaration-no-important */
  border: 0 !important;
  clip: rect(0, 0, 0, 0) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  white-space: nowrap !important;
  width: 1px !important;
  /* stylelint-enable declaration-no-important */
}

.language-picker-toggle {
  --_lnpi-toggle-background-color: var(--loolabsh-language-picker-toggle-background-color, transparent);
  --_lnpi-toggle-color: var(--loolabsh-language-picker-toggle-color, inherit);
  --_lnpi-toggle-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-language-picker-toggle-duration));
  align-items: center;
  -webkit-appearance: none;
  background-color: var(--_lnpi-toggle-background-color);
  border: none;
  border-radius: 0;
  color: var(--_lnpi-toggle-color);
  display: inline-flex;
  flex: 0 0 auto;
  font-size: inherit;
  height: auto;
  justify-content: center;
  line-height: 1;
  padding: var(--loolabsh-language-picker-toggle-padding, var(--loolabsh-spacing-s, 0.5rem));
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
  transition: all var(--_lnpi-toggle-duration) ease-in-out;
}
.language-picker-toggle:focus:not(:focus-visible), .language-picker-toggle:focus:not(._focus-visible) {
  box-shadow: none;
  outline: none;
}
.language-picker-toggle:not(:disabled):hover, .language-picker-toggle:not(:disabled):active, .language-picker-toggle:not(:disabled)[aria-expanded=true], .language-picker-toggle:not(.-disabled):hover, .language-picker-toggle:not(.-disabled):active, .language-picker-toggle:not(.-disabled)[aria-expanded=true] { /* stylelint-disable-line string-quotes */
  --_lnpi-toggle-background-color: var(--loolabsh-language-picker-toggle-background-color-hover, transparent);
  --_lnpi-toggle-color: var(--loolabsh-language-picker-toggle-color-hover, inherit);
  cursor: pointer;
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
}
.language-picker-toggle:not(:disabled)[aria-expanded=true] + .language-picker-menu, .language-picker-toggle:not(.-disabled)[aria-expanded=true] + .language-picker-menu { /* stylelint-disable-line string-quotes */
  opacity: 1;
  pointer-events: all;
  transition: visibility 0s, opacity var(--_lnpi-menu-duration) ease-in-out;
  visibility: visible;
}

.language-picker-menu {
  background-color: var(--loolabsh-language-picker-menu-background-color);
  border: var(--loolabsh-language-picker-menu-border-width) solid var(--loolabsh-language-picker-menu-border-color);
  border-radius: var(--loolabsh-language-picker-menu-border-radius);
  color: var(--loolabsh-language-picker-color);
  display: block;
  opacity: 0;
  padding: var(--loolabsh-language-picker-padding-y) 0;
  pointer-events: none;
  transition: visibility 0s ease-in-out var(--_lnpi-menu-duration), opacity var(--_lnpi-menu-duration) ease-in-out;
  visibility: hidden;
}

.language-picker-lang {
  color: currentColor;
  display: block;
  padding: var(--loolabsh-language-picker-padding-y) var(--loolabsh-language-picker-padding-x);
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
}
.language-picker-lang__label {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.language-picker-lang:focus, .language-picker-lang:hover, .language-picker-lang:active {
  background-color: var(--loolabsh-language-picker-background-color-hover);
  color: var(--loolabsh-language-picker-color-hover);
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
}
.language-picker-lang[aria-checked=true] { /* stylelint-disable-line string-quotes */
  background-color: var(--loolabsh-language-picker-background-color-active);
  color: var(--loolabsh-language-picker-color-active);
}

.language-picker.-list {
  display: flex;
  gap: var(--loolabsh-language-picker-item-gap);
}

.media-gallery {
  --loolabsh-media-gallery-gap-column: var(--loolabsh-media-gallery-gap, var(--loolabsh-spacing, 1rem));
  --loolabsh-media-gallery-gap-row: var(--loolabsh-media-gallery-gap-column);
}
@media (min-width: 768px) {
  .media-gallery {
    /* stylelint-disable string-quotes */
    /* stylelint-enable string-quotes */
  }
  .media-gallery[data-columns="2"].-grid .media-gallery__inner, .media-gallery[data-columns="3"].-grid .media-gallery__inner, .media-gallery[data-columns="4"].-grid .media-gallery__inner {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .media-gallery[data-columns="2"].-slider .slider-item, .media-gallery[data-columns="3"].-slider .slider-item, .media-gallery[data-columns="4"].-slider .slider-item {
    width: 50%;
  }
}
@media (min-width: 992px) {
  .media-gallery {
    /* stylelint-disable string-quotes */
    /* stylelint-enable string-quotes */
  }
  .media-gallery[data-columns="3"].-grid .media-gallery__inner {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  }
  .media-gallery[data-columns="3"].-slider .slider-item {
    width: 33.3333333333%;
  }
  .media-gallery[data-columns="4"].-grid .media-gallery__inner {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  }
  .media-gallery[data-columns="4"].-slider .slider-item {
    width: 25%;
  }
}

.media-gallery.-grid .media-gallery__inner {
  display: grid;
  grid-gap: var(--loolabsh-media-gallery-gap-row) var(--loolabsh-media-gallery-gap-column);
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto;
}
.media-gallery.-grid .media-gallery__inner > * {
  margin: 0 !important; /* stylelint-disable-line declaration-no-important */
  width: 100%;
}
.media-gallery.-grid .media-gallery__inner > * + * {
  margin: 0;
}

.media-gallery.-slider {
  --_mgal-gap: calc(var(--loolabsh-media-gallery-gap-column) / 2);
}
.media-gallery.-slider .slider-container {
  margin-left: calc(var(--_mgal-gap) * -1);
  margin-right: calc(var(--_mgal-gap) * -1);
}
.media-gallery.-slider .slider-item__inner {
  padding-left: var(--_mgal-gap);
  padding-right: var(--_mgal-gap);
}

.media-gallery {
  --loolabsh-media-gallery-gap-column: var(--loo-grid-gap-x);
  --loolabsh-media-gallery-gap-row: var(--loo-grid-gap-y);
}
.media-gallery.-slider .figure__caption {
  display: none;
}

.media-placeholder {
  --loolabsh-media-placeholder-background-color: var(--loolabsh-color-grey-light, #f1f1f1);
  --loolabsh-media-placeholder-border-radius: var(--loolabsh-border-radius, 0px);
  --loolabsh-media-placeholder-color: var(--loolabsh-color-grey, #e8e8e8);
  --loolabsh-media-placeholder-size: 3rem;
  align-items: center;
  background-color: var(--loolabsh-media-placeholder-background-color);
  border-radius: var(--loolabsh-media-placeholder-border-radius);
  color: var(--loolabsh-media-placeholder-color);
  display: flex;
  font-size: var(--loolabsh-media-placeholder-size);
  height: 1em;
  justify-content: center;
  overflow: hidden;
  pointer-events: none;
  width: 1em;
}
img.media-placeholder__image {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
}

svg.media-placeholder__image {
  --placeholder-color: var(--loolabsh-media-placeholder-color);
  max-height: 100%;
  max-width: 100%;
}

.media-placeholder__text {
  color: var(--loolabsh-media-placeholder-text-color, var(--loolabsh-color-placeholder, #959595));
  font-size: var(--loolabsh-media-placeholder-text-font-size, var(--loolabsh-font-size-s, 0.75rem));
}

.nav {
  --loolabsh-nav-font-size: var(--loolabsh-font-size, 1rem);
  --loolabsh-nav-duration: var(--loolabsh-duration, 0.15s);
  --loolabsh-nav-list-gap-x: var(--loolabsh-nav-gap, 0);
  --loolabsh-nav-list-gap-y: var(--loolabsh-nav-gap, var(--loolabsh-spacing-s, 0.5rem));
  --loolabsh-nav-link-background-color: transparent;
  --loolabsh-nav-link-background-color-hover: transparent;
  --loolabsh-nav-link-background-color-active: var(--loolabsh-nav-link-background-color-hover);
  --loolabsh-nav-link-color: var(--loolabsh-color-text, #3e3e3e);
  --loolabsh-nav-link-color-hover: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-nav-link-color-active: var(--loolabsh-nav-link-color-hover);
  --loolabsh-nav-link-padding-x: var(--loolabsh-nav-link-padding, var(--loolabsh-spacing, 1rem));
  --loolabsh-nav-link-padding-y: var(--loolabsh-nav-link-padding, var(--loolabsh-spacing-xs, 0.25rem));
  --loolabsh-nav-link-prefix-suffix-gap: calc(var(--loolabsh-nav-font-size) / 2);
  --_nv-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-nav-duration));
  background-color: var(--loolabsh-nav-background-color, transparent);
  flex-wrap: nowrap;
  font-size: var(--loolabsh-nav-font-size);
  gap: var(--loolabsh-nav-gap, var(--loolabsh-spacing-s, 0.5rem));
}
.nav-list, .nav-item, .nav-link {
  list-style: none;
  margin: 0;
  padding: 0;
}
.nav-desc {
  /* stylelint-disable declaration-no-important */
  border: 0 !important;
  clip: rect(0, 0, 0, 0) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  white-space: nowrap !important;
  width: 1px !important;
  /* stylelint-enable declaration-no-important */
}
.nav-link {
  --_nvli-background-color: var(--loolabsh-nav-link-background-color);
  --_nvli-color: var(--loolabsh-nav-link-color);
  align-items: stretch;
  background-color: var(--_nvli-background-color) !important; /* stylelint-disable-line declaration-no-important */
  border: 0 none;
  color: var(--_nvli-color) !important; /* stylelint-disable-line declaration-no-important */
  display: inline-flex;
  line-height: var(--loolabsh-nav-link-line-height, inherit);
  gap: var(--loolabsh-nav-link-prefix-suffix-gap);
  padding: var(--loolabsh-nav-link-padding-y) var(--loolabsh-nav-link-padding-x);
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
  transition: all var(--_nv-duration) ease-in-out;
  vertical-align: middle;
}
.nav-link i,
.nav-link .icon,
.nav-link svg {
  pointer-events: none;
  position: relative;
}
.nav-link i:not(.far):not(.fa):not(.fas):not(.fab):not(.fal):not(.fa-regular):not(.fa-solid):not(.fa-brand):not(.fa-light),
.nav-link .icon:not(.far):not(.fa):not(.fas):not(.fab):not(.fal):not(.fa-regular):not(.fa-solid):not(.fa-brand):not(.fa-light),
.nav-link svg:not(.far):not(.fa):not(.fas):not(.fab):not(.fal):not(.fa-regular):not(.fa-solid):not(.fa-brand):not(.fa-light) {
  font-weight: normal;
}
.nav-link__label {
  align-items: center;
  font-weight: var(--loolabsh-nav-font-weight, normal);
  order: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nav-link__prefix, .nav-link__suffix {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
}
.nav-link__prefix {
  color: var(--loolabsh-nav-link-prefix-color, currentColor);
  order: 1;
}
.nav-link__suffix {
  color: var(--loolabsh-nav-link-suffix-color, currentColor);
  order: 3;
}
.nav-link:hover {
  --_nvli-background-color: var(--loolabsh-nav-link-background-color-hover);
  --_nvli-color: var(--loolabsh-nav-link-color-hover);
}
.nav-item {
  position: relative;
}
.nav-item.-active > .nav-link {
  --_nvli-background-color: var(--loolabsh-nav-link-background-color-hover);
  --_nvli-color: var(--loolabsh-nav-link-color-hover);
}
.nav-list, .nav-container {
  transition: all var(--_nv-duration) ease-in-out;
}
.nav-list .nav-item > .nav-container,
.nav-list .nav-item > .nav-list {
  background-color: var(--loolabsh-nav-list-background-color, var(--loolabsh-color-white, #fff));
  left: 0;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: 100%;
  transition: all var(--_nv-duration) ease-in-out;
  visibility: hidden;
}
.nav-list .nav-item > .nav-container[aria-hidden=false],
.nav-list .nav-item > .nav-list[aria-hidden=false] { /* stylelint-disable-line string-quotes */
  opacity: 1;
  pointer-events: all;
  visibility: visible;
}
.nav-list .nav-item > .nav-container.-right,
.nav-list .nav-item > .nav-list.-right {
  left: auto;
  right: 0;
}
.nav-list .nav-list .nav-item:not(:first-child) {
  margin-top: var(--loolabsh-nav-list-gap-y);
}
.nav > .nav-list {
  -moz-column-gap: var(--loolabsh-nav-list-gap-x);
       column-gap: var(--loolabsh-nav-list-gap-x);
  display: flex;
  justify-content: stretch;
  row-gap: var(--loolabsh-nav-list-gap-y);
}
.nav.no-js .nav-item:hover > .nav-contrainer,
.nav.no-js .nav-item:hover > .nav-list, .nav.no-js .nav-item:focus-within > .nav-contrainer,
.nav.no-js .nav-item:focus-within > .nav-list {
  opacity: 1;
  pointer-events: all;
  visibility: visible;
}
.nav.no-js .nav-item:focus-within > .nav-link {
  --_nvli-background-color: var(--loolabsh-nav-link-background-color-hover);
  --_nvli-color: var(--loolabsh-nav-link-color-hover);
}

.nav {
  --loolabsh-nav-font-weight: var(--loo-font-weight-bold);
  --loolabsh-nav-link-line-height: 1.8;
}

.pagination {
  --loolabsh-pagination-background-color: transparent;
  --loolabsh-pagination-background-color-hover: var(--loolabsh-pagination-background-color);
  --loolabsh-pagination-background-color-active: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-pagination-color: var(--loolabsh-color-text, #3e3e3e);
  --loolabsh-pagination-color-hover: var(--loolabsh-pagination-color);
  --loolabsh-pagination-color-active: var(--loolabsh-color-white, #fff);
  --loolabsh-pagination-border-color: var(--loolabsh-color-border, #959595);
  --loolabsh-pagination-border-color-hover: var(--loolabsh-pagination-border-color);
  --loolabsh-pagination-border-color-active: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-pagination-border-radius: var(--loolabsh-border-radius, 0px);
  --loolabsh-pagination-border-width: var(--loolabsh-border-width, 1px);
  --loolabsh-pagination-font-size: var(--loolabsh-font-size, 1rem);
  --loolabsh-pagination-gap: var(--loolabsh-spacing-s, 0.5rem);
  --loolabsh-pagination-height: var(--loolabsh-input-height, 40px);
  --loolabsh-pagination-padding: var(--loolabsh-spacing-s, 0.5rem);
  --loolabsh-pagination-duration: var(--loolabsh-duration, 0.15s);
  --_pagi-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-pagination-duration));
  background-color: transparent;
  color: var(--loolabsh-pagination-color);
  display: flex;
  flex-flow: row nowrap;
  font-size: var(--loolabsh-pagination-font-size);
  gap: var(--loolabsh-pagination-gap);
  justify-content: var(--loolabsh-pagination-align, center);
  padding: 0;
}
.pagination-list {
  display: inline-flex;
  flex-flow: row wrap;
  gap: var(--loolabsh-pagination-gap);
  justify-content: center;
  list-style: none;
  margin: 0;
  order: 3;
  padding: 0;
  z-index: 1;
}
.pagination-list > li {
  align-self: center;
  line-height: 1;
  margin: 0;
  padding: 0;
  z-index: 1;
}
.pagination-list > li::after, .pagination-list > li::before {
  display: none;
}
.pagination-list > li:hover, .pagination-list > li:focus-within {
  z-index: 2;
}
.pagination-list > li.pagination-list__delimiter .pagination-item {
  --_pagi-border-color: var(--loolabsh-pagination-info-border-color, transparent);
}
.pagination-item {
  --_pg-background-color: var(--loolabsh-pagination-background-color);
  --_pg-border-color: var(--loolabsh-pagination-border-color);
  --_pg-color: var(--loolabsh-pagination-color);
  align-items: stretch;
  background-color: var(--_pg-background-color);
  border: solid var(--loolabsh-pagination-border-width) var(--_pg-border-color);
  border-radius: var(--loolabsh-pagination-border-radius);
  color: var(--_pg-color);
  display: inline-flex;
  gap: var(--loolabsh-pagination-icon-margin, calc(var(--loolabsh-pagination-font-size) / 2));
  height: var(--loolabsh-pagination-height);
  justify-content: center;
  line-height: calc(var(--loolabsh-pagination-height) - var(--loolabsh-pagination-border-width) * 2);
  min-width: var(--loolabsh-pagination-height);
  padding: 0 var(--loolabsh-pagination-padding);
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
}
.pagination-item__label {
  align-items: center;
}
.pagination-item.-prev {
  order: 1;
}
.pagination-item.-prev::before {
  content: var(--loolabsh-pagination-icon-prev, "❮");
}
.pagination-item.-next {
  order: 4;
}
.pagination-item.-next::after {
  content: var(--loolabsh-pagination-icon-next, "❯");
}
.pagination-item.-info {
  --_pagi-border-color: var(--loolabsh-pagination-info-border-color, transparent);
  display: none;
  order: 2;
}
.pagination-item:not([aria-disabled]) {
  transition: all var(--_pg-duration) ease-in-out;
}
.pagination-item:not([aria-disabled]):hover, .pagination-item:not([aria-disabled]):active {
  --_pg-background-color: var(--loolabsh-pagination-background-color-hover);
  --_pg-border-color: var(--loolabsh-pagination-border-color-hover);
  --_pg-color: var(--loolabsh-pagination-color-hover);
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
  z-index: 2;
}
.pagination-item:not([aria-disabled]):focus:not(:focus-visible), .pagination-item:not([aria-disabled]):focus:not(._focus-visible) {
  box-shadow: none;
  outline: none;
}
.pagination-item[aria-current=true] { /* stylelint-disable-line string-quotes */ }
.pagination-item[aria-current=true], .pagination-item[aria-current=true]:hover, .pagination-item[aria-current=true]:active {
  --_pg-background-color: var(--loolabsh-pagination-background-color-active);
  --_pg-border-color: var(--loolabsh-pagination-border-color-active);
  --_pg-color: var(--loolabsh-pagination-color-active);
}
.pagination-item[aria-disabled] {
  opacity: var(--loolabsh-pagination-disabled-opacity, var(--loolabsh-disabled-opacity, 0.4));
  pointer-events: none;
}

.pagination.-l {
  --loolabsh-pagination-font-size: var(--loolabsh-input-font-size-l, var(--loolabsh-font-size-l, 1.25rem));
  --loolabsh-pagination-height: var(--loolabsh-input-height-l, 50px);
}

.pagination.-s {
  --loolabsh-pagination-font-size: var(--loolabsh-input-font-size-s, var(--loolabsh-font-size-s, 0.75rem));
  --loolabsh-pagination-height: var(--loolabsh-input-height-s, 30px);
}

.pagination.-compact .pagination-item.-prev .pagination-item__label, .pagination.-compact .pagination-item.-next .pagination-item__label,
.pagination.-minimal .pagination-item.-prev .pagination-item__label,
.pagination.-minimal .pagination-item.-next .pagination-item__label {
  display: none;
}

.pagination.-compact {
  --loolabsh-pagination-gap: 0;
}
.pagination.-compact > .pagination-item:not(:first-child),
.pagination.-compact .pagination-list,
.pagination.-compact .pagination-list > li:not(:first-child) {
  margin-left: calc(var(--loolabsh-pagination-border-width) * -1);
}
.pagination.-compact .pagination-item:not(.-prev):not(.-next) {
  border-radius: 0;
}
.pagination.-compact .pagination-item.-prev {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
}
.pagination.-compact .pagination-item.-next {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}

.pagination.-minimal .pagination-list {
  display: none;
}
.pagination.-minimal .pagination-item.-info {
  display: list-item;
}

.privacy-info {
  --loolabsh-privacy-info-background-color: var(--loolabsh-color-grey, #e8e8e8);
  --loolabsh-privacy-info-color: var(--loolabsh-color-text, #3e3e3e);
  --loolabsh-privacy-info-font-size: var(--loolabsh-font-size-s, 0.75rem);
  --loolabsh-privacy-info-gap: var(--loolabsh-spacing-s, 0.5rem);
  --loolabsh-privacy-info-padding: var(--loolabsh-spacing, 1rem);
  align-items: center;
  display: flex;
  justify-content: center;
}
.privacy-info__container {
  align-items: center;
  background-color: var(--loolabsh-privacy-info-background-color);
  color: var(--loolabsh-privacy-info-color);
  display: flex;
  flex-direction: column;
  gap: var(--loolabsh-privacy-info-gap);
  max-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  padding: var(--loolabsh-privacy-info-padding);
  text-align: center;
}
.privacy-info__text {
  font-size: var(--loolabsh-privacy-info-font-size);
}
.privacy-info__text, .privacy-info__text a {
  color: currentColor;
  margin: 0;
}

.player .plyr {
  --plyr-color-main: var(--loolabsh-player-theme-color);
  --plyr-control-radius: var(--loolabsh-player-control-border-radius);
  --plyr-control-icon-size: var(--loolabsh-player-control-icon-size);
  --plyr-control-spacing: var(--loolabsh-player-control-gap);
  --plyr-progress-loading-size: var(--loolabsh-player-progress-loading-size);
  --plyr-range-thumb-height: var(--loolabsh-player-range-thumb-height);
  --plyr-range-thumb-shadow: none;
  --plyr-range-track-height: var(--loolabsh-player-range-track-height);
  --plyr-audio-controls-background: var(--loolabsh-player-audio-background-color);
  --plyr-audio-control-color: var(--loolabsh-player-audio-control-color);
  --plyr-video-background: var(--loolabsh-player-video-background-color);
  --plyr-video-controls-background: var(--loolabsh-player-video-controls-background-color);
  --plyr-video-control-color: var(--loolabsh-player-video-control-color);
  --plyr-video-control-color-hover: var(--loolabsh-player-video-control-color-hover);
  --plyr-video-control-background-hover: var(--loolabsh-player-video-control-background-color-hover);
}
.player .plyr__controls {
  gap: var(--plyr-control-spacing);
}
.player .plyr__controls__item {
  flex-grow: 0;
  margin-left: 0;
  margin-right: 0;
  padding: 0 var(--loolabsh-player-control-padding);
}
.player .plyr__controls__item.plyr__volume {
  max-width: none;
  min-width: 0;
  position: relative;
  width: auto;
}
.player .plyr__controls__item.plyr__progress__container {
  flex-grow: 1;
  padding: 0 var(--loolabsh-player-control-padding);
}
.player .plyr__controls__item.plyr__time {
  padding: 0 var(--loolabsh-player-control-padding);
}
.player .plyr__controls .plyr__control {
  font-size: var(--loolabsh-player-control-font-size);
  padding: var(--loolabsh-player-control-padding);
}
.player .plyr__progress__buffer::-webkit-progress-value {
  border-radius: var(--loolabsh-player-range-border-radius);
}
.player .plyr--full-ui input[type=range] { /* stylelint-disable-line string-quotes */ }
.player .plyr--full-ui input[type=range]::-webkit-slider-runnable-track {
  border-radius: var(--loolabsh-player-range-border-radius);
}
.player .plyr--full-ui input[type=range]::-webkit-slider-thumb {
  border-radius: var(--loolabsh-player-range-thumb-border-radius);
}
.player .plyr--full-ui input[type=range].plyr__tab-focus::-webkit-slider-runnable-track {
  outline: var(--loolabsh-focus-outline-width, 1px) var(--loolabsh-focus-outline-style, dotted) var(--loolabsh-focus-outline-color, currentColor);
  outline-offset: var(--loolabsh-focus-outline-offset, 2px);
}
.player .plyr--audio {
  --plyr-range-thumb-background: var(--plyr-audio-control-color);
}
.player .plyr--audio .plyr__controls {
  border: var(--loolabsh-player-audio-border-width) solid var(--loolabsh-player-audio-border-color);
  padding: var(--loolabsh-player-audio-controls-padding);
}
.player .plyr--audio .plyr__controls__item.plyr__progress__container {
  padding: 0 var(--loolabsh-player-control-padding);
}
.player .plyr--video {
  --plyr-range-thumb-background: var(--plyr-video-control-color);
}
.player .plyr--video .plyr__controls {
  padding: var(--loolabsh-player-video-controls-padding);
}
.player .plyr--video .plyr__controls__item.plyr__time {
  text-shadow: 0 0 0.25em #000;
}

.player {
  --loolabsh-player-theme-color: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-player-controls-padding: var(--loolabsh-spacing-s, 0.5rem);
  --loolabsh-player-control-border-radius: 0px;
  --loolabsh-player-control-font-size: 1rem;
  --loolabsh-player-control-gap: 0;
  --loolabsh-player-control-icon-size: 1em;
  --loolabsh-player-control-padding: var(--loolabsh-spacing-s, 0.5rem);
  --loolabsh-player-progress-loading-size: 1rem;
  --loolabsh-player-range-border-radius: var(--loolabsh-player-control-border-radius);
  --loolabsh-player-range-thumb-border-radius: var(--loolabsh-player-control-border-radius);
  --loolabsh-player-range-thumb-height: 0.5rem;
  --loolabsh-player-range-track-height: 0.5rem;
  --loolabsh-player-audio-background-color: transparent;
  --loolabsh-player-audio-border-color: var(--loolabsh-color-border, #959595);
  --loolabsh-player-audio-border-width: var(--loolabsh-border-width, 1px);
  --loolabsh-player-audio-controls-padding: var(--loolabsh-player-controls-padding);
  --loolabsh-player-audio-control-color: var(--loolabsh-color-black, #000);
  --loolabsh-player-audio-control-color-hover: var(--loolabsh-player-audio-control-color);
  --loolabsh-player-audio-control-background-color-hover: var(--loolabsh-player-theme-color);
  --loolabsh-player-video-background-color: transparent;
  --loolabsh-player-video-controls-padding: var(--loolabsh-player-controls-padding);
  --loolabsh-player-video-controls-background-color: transparent;
  --loolabsh-player-video-control-color: var(--loolabsh-color-white, #fff);
  --loolabsh-player-video-control-color-hover: var(--loolabsh-player-video-control-color);
  --loolabsh-player-video-control-background-color-hover: var(--loolabsh-player-theme-color);
}
.player-caption {
  background-color: var(--loolabsh-player-caption-background-color, transparent);
  color: var(--loolabsh-player-caption-color, inherit);
  font-size: var(--loolabsh-player-caption-font-size, var(--loolabsh-font-size-s, 0.75rem));
  margin: var(--loolabsh-player-caption-margin, var(--loolabsh-spacing-s, 0.5rem)) 0 0;
  padding: var(--loolabsh-player-caption-padding, 0);
}
.player-caption > * {
  display: inline;
  margin: 0;
}
.player-caption > * + * {
  margin-left: var(--loolabsh-player-caption-copyright-gap, var(--loolabsh-spacing-s, 0.5rem));
}
.player-caption > .copyright::before {
  content: "("; /* stylelint-disable-line string-quotes */
}
.player-caption > .copyright::after {
  content: ")"; /* stylelint-disable-line string-quotes */
}

.player-video {
  --_plvi-poster-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-player-video-poster-duration, 0.15s));
}
.player-video .player-media {
  display: block;
  overflow: hidden;
  padding: 0;
  position: relative;
  width: 100%;
}
.player-video .player-media::before {
  content: ""; /* stylelint-disable-line string-quotes */
  display: block;
  padding-top: var(--loolabsh-player-video-ratio, calc((9 / 16) * 100%));
}
.player-video .player-media [data-player-media], .player-video .player-media__poster, .player-video .player-media__player {
  height: 100%;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
  z-index: 1;
}
.player-video .player-media__player > iframe {
  height: 100%;
}
.player-video .player-media__player > .plyr {
  height: 100%;
  width: 100%;
}
.player-video .player-media__poster {
  background-color: var(--loolabsh-player-video-background-color);
  opacity: 1;
  transition: var(--_plvi-poster-duration) opacity var(--_plvi-poster-duration) ease-in-out;
  z-index: 2;
}
.player-video .player-media__poster > *:not(.player-media__play) {
  height: 100%;
  width: 100%;
}
.player-video .player-media__poster > img {
  -o-object-fit: cover;
     object-fit: cover;
}
.player-video .player-media__play {
  --loolabsh-icon-button-color: var(--loolabsh-player-video-control-color);
  --loolabsh-icon-button-color-hover: var(--loolabsh-player-video-control-color-hover);
  font-size: var(--loolabsh-player-control-font-size);
  left: 50%;
  opacity: 1;
  position: absolute;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
  z-index: 2;
}
.player-video .player-media__play::after {
  --_offset: calc(var(--loolabsh-player-control-font-size) * -1);
  --_size: calc(100% + var(--loolabsh-player-control-font-size) * 2);
  content: ""; /* stylelint-disable-line string-quotes */
  display: block;
  height: var(--_size);
  left: var(--_offset);
  position: absolute;
  top: var(--_offset);
  width: var(--_size);
}
.player-video .player-media__play:focus {
  box-shadow: none;
  outline: none;
}
.player-video .player-media__play:focus, .player-video .player-media__play:hover {
  background-color: var(--loolabsh-player-video-control-background-color-hover);
}
.player-video .player-media__play._focus-visible:focus, .player-video .player-media__play:focus-visible:focus {
  outline: var(--loolabsh-focus-outline-width, 1px) var(--loolabsh-focus-outline-style, dotted) var(--loolabsh-focus-outline-color, currentColor);
  outline-offset: var(--loolabsh-focus-outline-offset, 2px);
}
.player-video .player-media > .privacy-info {
  bottom: 0;
  display: none;
  left: 0;
  pointer-events: none;
  position: absolute;
  z-index: 5;
}
.player-video[data-privacy] .player-media__play {
  display: none;
  pointer-events: none;
}
.player-video[data-privacy] .player-media > .privacy-info {
  display: block;
  pointer-events: all;
}
.player-video.-initialized .player-media__poster {
  opacity: 0;
  pointer-events: none;
}
.player-video.-initialized .player-media .plyr__control--overlaid[data-plyr=play] { /* stylelint-disable-line string-quotes */
  display: none;
}

.player-caption {
  --loolabsh-player-caption-background-color: var(--loo-color-white);
  --loolabsh-player-caption-color: var(--loo-body-color);
  --loolabsh-player-caption-padding: var(--loo-spacing-s);
  border-radius: var(--loo-spacing-xs);
  font-weight: var(--loo-font-weight-bold);
  margin: calc(var(--loolabsh-player-caption-padding) * -1) auto var(--loo-spacing) auto;
  position: relative;
  width: calc(100% - var(--loo-spacing-l));
  z-index: 2;
}
.player-media {
  border-radius: var(--loo-spacing);
  position: relative;
  z-index: 1;
}
.player-media__play {
  border-radius: 50%;
}
.player-media__poster img {
  background: var(--loo-color-primary);
  -o-object-fit: contain !important;
     object-fit: contain !important;
}
.player[data-c=video] {
  --loolabsh-player-control-font-size: 2rem;
}
.player[data-c=audio] .plyr {
  --plyr-color-main: var(--loo-color-white);
  --loolabsh-player-audio-background-color: var(--loo-color-primary);
  --loolabsh-player-audio-border-color: var(--loo-color-primary);
  --loolabsh-player-audio-control-color: var(--loo-color-white);
  --loo-player-audio-border-radius: var(--loo-spacing-s);
}
.player[data-c=audio] .plyr__controls {
  border-radius: var(--loo-player-audio-border-radius);
}
.player[data-c=audio] .plyr__control {
  background: transparent;
  border-radius: var(--loo-player-audio-border-radius);
}
.player[data-c=audio] .plyr__control:hover {
  background: var(--loo-color-white);
  color: var(--loo-color-primary);
}

.player-video .player-media__play {
  --loolabsh-icon-button-background-color-hover: var(--loo-color-primary);
  --loolabsh-icon-button-color: var(--loo-color-primary);
  --loolabsh-icon-button-color-hover: var(--loo-color-white);
}

.progress-bar {
  --loolabsh-progress-bar-border-radius: var(--loolabsh-border-radius, 0px);
  --loolabsh-progress-bar-height: var(--height, 1rem);
  --loolabsh-progress-bar-duration: 0.35s;
  --_prba-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-progress-bar-duration, var(--loolabsh-duration, 0.15s)));
  background-color: var(--loolabsh-progress-bar-track-color, var(--loolabsh-color-grey-light, #f1f1f1));
  border-radius: var(--loolabsh-progress-bar-border-radius);
  display: block;
  height: var(--loolabsh-progress-bar-height);
  overflow: hidden;
  position: relative;
}
.progress-bar__indicator {
  background-color: var(--loolabsh-progress-bar-color, var(--loolabsh-color-ui, #ce776f));
  border-radius: var(--loolabsh-progress-bar-border-radius);
  color: var(--loolabsh-progress-bar-label-color, var(--loolabsh-color-ui-contrast, #fff));
  font-size: var(--loolabsh-progress-bar-label-font-size, var(--loolabsh-font-size-xs, 0.5rem));
  height: 100%;
  line-height: var(--loolabsh-progress-bar-height);
  overflow: hidden;
  text-align: center;
  transition-duration: var(--_prba-duration);
  transition-property: background-color, color, width;
  transition-timing-function: cubic-bezier(0.36, 0.9, 0.35, 1);
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  white-space: nowrap;
}

.progress-bar[data-indeterminate] .progress-bar__indicator {
  animation: progress-bar-indeterminate var(--loolabsh-progress-bar-indeterminate-duration, 2s) infinite linear;
  position: absolute;
}
.progress-bar[data-indeterminate] .progress-bar__label {
  display: none;
}

@keyframes progress-bar-indeterminate {
  0% {
    inset-inline-start: -50%;
    width: 50%;
  }
  75%, 100% {
    inset-inline-start: 100%;
    width: 50%;
  }
}
.progress-list {
  --loolabsh-progress-list-gap: var(--loolabsh-spacing-l);
  --loolabsh-progress-list-danger-color: var(--loolabsh-color-danger);
  --loolabsh-progress-list-success-color: var(--loolabsh-color-success);
  --loolabsh-progress-list-current-color: var(--loolabsh-color-info);
  --loolabsh-progress-list-item-color: var(--loolabsh-progress-list-default-color, #000);
  --loolabsh-progress-list-item-gap: var(--loolabsh-spacing-s);
  background: var(--loolabsh-progress-list-background, transparent);
  border: var(--loolabsh-progress-list-border-width, 0) solid var(--loolabsh-progress-list-border-color, transparent);
  border-radius: var(--loolabsh-progress-list-border-radius, transparent);
  display: flex;
  flex: 100% 1;
  gap: var(--loolabsh-progress-list-gap);
  justify-content: space-between !important;
  margin: var(--loolabsh-progress-list-margin, 0);
  overflow-x: auto;
  padding: var(--loolabsh-progress-list-padding, 0);
}
.progress-list .progress-item {
  align-items: center;
  color: var(--loolabsh-progress-list-item-color);
  display: flex;
  flex: 1 0 auto;
  font-weight: var(--loolabsh-progress-list-item-font-weight, 700);
  gap: var(--loolabsh-progress-list-item-gap);
  list-style-type: none;
}
.progress-list .progress-item.-success {
  --loolabsh-progress-list-item-color: var(--loolabsh-progress-list-success-color);
}
.progress-list .progress-item.-danger {
  --loolabsh-progress-list-item-color: var(--loolabsh-progress-list-danger-color);
}
.progress-list .progress-item.-current {
  --loolabsh-progress-list-item-color: var(--loolabsh-progress-list-current-color);
}

.progress-list {
  --loolabsh-progress-list-background: var(--loo-color-white);
  --loolabsh-progress-list-border-color: var(--loo-color-text);
  --loolabsh-progress-list-success-color: var(--loo-color-success);
  --loolabsh-progress-list-danger-color: var(--loo-color-danger);
  --loolabsh-progress-list-current-color: var(--loo-color-primary);
  --loolabsh-progress-list-border-radius: var(--loo-spacing-s);
  --loolabsh-progress-list-border-width: 2px;
  --loolabsh-progress-list-margin: 0 0 var(--loo-spacing-l) 0;
  --loolabsh-progress-list-padding: var(--loo-spacing);
}

.progress-ring {
  --loolabsh-progress-ring-size: var(--size, 8rem);
  --loolabsh-progress-ring-track-width: 0.5rem;
  --_prri-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-progress-ring-duration, 0.35s));
  align-items: center;
  display: flex;
  height: var(--loolabsh-progress-ring-size);
  justify-content: center;
  position: relative;
  width: var(--loolabsh-progress-ring-size);
}
.progress-ring__image {
  height: 100%;
  transform: rotate(-90deg);
  transform-origin: 50% 50%;
  width: 100%;
}
.progress-ring__track, .progress-ring__indicator {
  --_prri-radius: calc(var(--loolabsh-progress-ring-size) / 2 - var(--loolabsh-progress-ring-track-width) * 0.5);
  --_prri-circumference: calc(var(--_prri-radius) * 2 * 3.141592654); /* stylelint-disable-line number-max-precision */
  cx: calc(var(--loolabsh-progress-ring-size) / 2);
  cy: calc(var(--loolabsh-progress-ring-size) / 2);
  fill: none;
  r: var(--_prri-radius);
  stroke-width: var(--loolabsh-progress-ring-track-width);
}
.progress-ring__track {
  stroke: var(--loolabsh-progress-ring-track-color, var(--loolabsh-color-grey-light, #f1f1f1));
}
.progress-ring__indicator {
  stroke: var(--loolabsh-progress-ring-color, var(--loolabsh-color-ui, #ce776f));
  stroke-dasharray: var(--_prri-circumference) var(--_prri-circumference);
  stroke-dashoffset: calc(var(--_prri-circumference) - var(--percentage) * var(--_prri-circumference));
  stroke-linecap: var(--loolabsh-progress-ring-linecap, square);
  transition-duration: var(--_prri-duration);
  transition-property: stroke-dashoffset;
  transition-timing-function: cubic-bezier(0.36, 0.9, 0.35, 1);
}
.progress-ring__label {
  align-items: center;
  color: var(--loolabsh-progress-ring-label-color, currentColor);
  display: flex;
  font-size: var(--loolabsh-progress-ring-label-font-size, var(--loolabsh-font-size-s, 0.75rem));
  height: 100%;
  justify-content: center;
  left: 0;
  position: absolute;
  text-align: center;
  top: 0;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  width: 100%;
}

.reveal-password {
  --loolabsh-reveal-password-background-color: transparent;
  --loolabsh-reveal-password-background-color-active: var(--loolabsh-reveal-password-background-color);
  --loolabsh-reveal-password-color: var(--loolabsh-form-control-color, var(--loolabsh-input-color, #000));
  --loolabsh-reveal-password-color-active: var(--loolabsh-reveal-password-color);
  --loolabsh-reveal-password-font-size: var(--loolabsh-font-size-s);
  --loolabsh-reveal-password-offset: var(--loolabsh-input-padding, var(--loolabsh-spacing, 1rem));
  --loolabsh-reveal-password-opacity: 0.5;
  --loolabsh-reveal-password-opacity-active: 1;
  --_repa-background-color: var(--loolabsh-reveal-password-background-color);
  --_repa-color: var(--loolabsh-reveal-password-color);
  --_repa-opacity: var(--loolabsh-reveal-password-opacity);
  display: block;
  position: relative;
  width: 100%;
}
.reveal-password .form-control {
  padding-right: calc(var(--loolabsh-reveal-password-offset) * 2 + var(--loolabsh-reveal-password-font-size)) !important; /* stylelint-disable-line declaration-no-important */
}
.reveal-password .icon-button {
  --loolabsh-icon-button-background-color: var(--loolabsh-reveal-password-background-color);
  --loolabsh-icon-button-color: var(--loolabsh-reveal-password-color);
  --loolabsh-icon-button-font-size: var(--loolabsh-reveal-password-font-size);
  opacity: var(--_repa-opacity);
  position: absolute;
  right: calc(var(--loolabsh-reveal-password-offset) - var(--loolabsh-icon-button-padding));
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  /* stylelint-disable string-quotes */
  /* stylelint-enable string-quotes */
}
.reveal-password .icon-button i::before {
  content: "\f070";
}
.reveal-password .icon-button[aria-pressed=true] {
  --_repa-background-color: var(--loolabsh-reveal-password-background-color-active);
  --_repa-color: var(--loolabsh-reveal-password-color-active);
  --_repa-opacity: var(--loolabsh-reveal-password-opacity-active);
}
.reveal-password .icon-button[aria-pressed=true] i::before {
  content: "\f06e";
}
.input-group > .reveal-password {
  flex: 1 1 auto;
  min-width: 0;
  width: 1%;
}

.scroll-progress {
  background-color: var(--loolabsh-scroll-progress-track-color, transparent);
  display: block;
  height: var(--loolabsh-scroll-progress-height, 1px);
  left: 0;
  overflow: hidden;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: var(--loolabsh-scroll-progress-zindex, 50);
}
.scroll-progress > span {
  --_scpr-calc-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-scroll-progress-duration, 0.15s));
  background: var(--loolabsh-scroll-progress-color, var(--loolabsh-color-ui, #ce776f));
  display: block;
  height: 100%;
  transform: scaleX(0);
  transform-origin: 0 0 0;
  transition: transform var(--_scpr-calc-duration) ease;
  width: 100%;
}

.skip-to {
  --loolabsh-skip-to-background-color: var(--loolabsh-color-black, #000);
  --loolabsh-skip-to-border-radius: var(--loolabsh-border-radius, 0px);
  --loolabsh-skip-to-color: var(--loolabsh-color-white, #fff);
  --loolabsh-skip-to-duration: var(--loolabsh-duration, 0.15s);
  --loolabsh-skip-to-font-size: var(--loolabsh-font-size, 1rem);
  --loolabsh-skip-to-opacity: 0.75;
  --loolabsh-skip-to-padding-x: var(--loolabsh-spacing, 1rem);
  --loolabsh-skip-to-padding-y: var(--loolabsh-spacing-s, 0.5rem);
  --_skto-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-skipt-to-duration));
  background-color: var(--loolabsh-skip-to-background-color);
  border-radius: var(--loolabsh-skip-to-border-radius);
  color: var(--loolabsh-skip-to-color);
  left: 0;
  opacity: 0;
  overflow: hidden;
  position: fixed;
  text-align: center;
  top: 0;
  transform: translate3d(-50%, -50%, 0);
  transition: var(--_skto-duration) opacity ease-in-out;
  z-index: var(--loolabsh-skip-to-zindex, 510);
}
.skip-to, .skip-to__link {
  clip: rect(0, 0, 0, 0);
  height: 1px;
  line-height: 1;
  width: 1px;
}
.skip-to__link {
  color: inherit;
  position: absolute;
}
.skip-to__link:focus {
  clip: auto;
  color: inherit;
  display: inline-block;
  height: auto;
  padding: var(--loolabsh-skip-to-padding-y) var(--loolabsh-skip-to-padding-x);
  position: relative;
  text-decoration: none;
  width: auto;
}
.skip-to:focus-within {
  clip: auto;
  height: auto;
  left: 50%;
  opacity: var(--loolabsh-skip-to-opacity);
  top: 50%;
  white-space: normal;
  width: auto;
}

.swiper-button-prev {
  left: var(--loo-spacing-s);
}
.swiper-button-next {
  right: var(--loo-spacing-s);
}
.swiper-pagination-bullet {
  --swiper-pagination-bullet-inactive-color: var(--loo-color-black);
  background-color: transparent;
}
.swiper-pagination-bullet::before {
  color: var(--swiper-pagination-bullet-inactive-color);
  content: "\f7ff";
  display: block;
  font-family: "Font Awesome 6 Pro";
  font-size: var(--loolabsh-slider-pagination-item-width);
  font-weight: var(--loo-font-weight-bold);
}
.swiper-pagination-bullet-active::before {
  color: var(--swiper-pagination-bullet-color);
}
.swiper-pagination-bullet:hover::before, .swiper-pagination-bullet:focus::before {
  color: var(--swiper-pagination-bullet-color);
  opacity: 0.7;
}
.swiper-pagination.swiper-pagination-horizontal {
  border-radius: var(--loo-spacing-l);
  left: 50%;
  padding: var(--loo-spacing-s) var(--loo-spacing);
  right: auto;
  transform: translate3d(-50%, 50%, 0);
}

.slider {
  --loolabsh-slider-pagination-background-color: var(--loo-color-white);
  --loolabsh-slider-pagination-column-gap: var(--loo-spacing);
  --loolabsh-slider-pagination-item-height: var(--loo-font-size-s);
  --loolabsh-slider-pagination-item-width: var(--loo-font-size-s);
  --loolabsh-slider-pagination-padding: 0;
  --loolabsh-slider-theme-color: var(--loo-color-primary);
}

.spinner {
  --loolabsh-spinner-color: currentColor;
  --loolabsh-spinner-size: 1em;
  animation: 1s linear infinite spin;
  border: var(--loolabsh-spinner-stroke-width, 2px) solid var(--loolabsh-spinner-track-color, transparent);
  border-radius: 50%;
  border-right-color: var(--loolabsh-spinner-color);
  border-top-color: var(--loolabsh-spinner-color);
  display: inline-block;
  height: var(--loolabsh-spinner-size);
  width: var(--loolabsh-spinner-size);
}
p .spinner {
  vertical-align: middle;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.stack {
  --loolabsh-stack-background-color: transparent;
  --loolabsh-stack-border-color: var(--loolabsh-color-border, #959595);
  --loolabsh-stack-border-width: var(--loolabsh-border-width, 1px);
  --loolabsh-stack-border-radius: var(--loolabsh-border-radius, 0px);
  --loolabsh-stack-gap: var(--loolabsh-spacing, 1rem);
  --loolabsh-stack-padding: var(--loolabsh-stack-gap);
  background-color: var(--loolabsh-stack-background-color);
}
.stack__container {
  border: var(--loolabsh-stack-border-width) solid var(--loolabsh-stack-border-color);
  border-radius: var(--loolabsh-stack-border-radius);
  padding: var(--loolabsh-stack-padding);
}
.stack__container > * {
  border-radius: 0;
  margin: 0;
  max-width: none;
  width: 100%;
}
.stack__container > * + * {
  margin-top: var(--loolabsh-stack-gap);
}
.stack__container > * + *::before {
  background-color: var(--loolabsh-stack-border-color);
  content: ""; /* stylelint-disable-line string-quotes */
  display: block;
  height: var(--loolabsh-stack-border-width);
  margin-bottom: var(--loolabsh-stack-gap);
  margin-left: calc(var(--loolabsh-stack-gap) * -1);
  margin-right: calc(var(--loolabsh-stack-gap) * -1);
  overflow: hidden;
}
.stack__container > :first-child {
  border-top-left-radius: var(--loolabsh-stack-border-radius);
  border-top-right-radius: var(--loolabsh-stack-border-radius);
}
.stack__container > :last-child {
  border-bottom-left-radius: var(--loolabsh-stack-border-radius);
  border-bottom-right-radius: var(--loolabsh-stack-border-radius);
}

.stack {
  --loolabsh-stack-border-color: var(--loo-color-tertiary);
  --loolabsh-stack-border-radius: var(--loo-spacing-xl);
}

.tag {
  --loolabsh-tag-background-color-alpha: 0.1;
  --loolabsh-tag-background-color: hsla(var(--loolabsh-color-black-h), var(--loolabsh-color-black-s), var(--loolabsh-color-black-l), var(--loolabsh-tag-background-color-alpha));
  --loolabsh-tag-border-color: var(--loolabsh-color-border, #959595);
  --loolabsh-tag-border-radius: var(--loolabsh-border-radius, 0px);
  --loolabsh-tag-border-width: var(--loolabsh-border-width, 1px);
  --loolabsh-tag-color: var(--loolabsh-color-text, #3e3e3e);
  --loolabsh-tag-font-size: var(--loolabsh-font-size-s, 0.75rem);
  --loolabsh-tag-font-weight: normal;
  --loolabsh-tag-gap: var(--loolabsh-spacing-s, 0.5rem);
  --loolabsh-tag-height: calc(var(--loolabsh-input-height, 40px) * 0.8);
  --loolabsh-tag-padding: var(--loolabsh-spacing, 1rem);
  --loolabsh-tag-duration: 0.125s;
  --_tag-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-tag-duration));
  align-items: center;
  background-color: var(--loolabsh-tag-background-color);
  border: var(--loolabsh-tag-border-width) solid var(--loolabsh-tag-border-color);
  border-radius: var(--loolabsh-tag-border-radius);
  color: var(--loolabsh-tag-color);
  cursor: default;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: var(--loolabsh-tag-font-size);
  gap: var(--loolabsh-tag-gap);
  height: var(--loolabsh-tag-height);
  line-height: calc(var(--loolabsh-tag-height) - var(--loolabsh-tag-border-width) * 2);
  overflow: hidden;
  padding: 0 var(--loolabsh-tag-padding);
  transition-duration: var(--_tag-duration);
  transition-property: background-color, border, color, opacity;
  transition-timing-function: ease-in-out;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  white-space: nowrap;
}
.tag:focus-within, .tag.focus-visible:focus {
  outline: var(--loolabsh-focus-outline-width) var(--loolabsh-focus-outline-style) var(--focus-outline-color, var(--loolabsh-focus-outline-color));
  outline-offset: var(--loolabsh-focus-outline-offset);
  pointer-events: auto;
}
.tag__label {
  order: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}
.tag > .icon-button {
  --loolabsh-icon-button-color: var(--loolabsh-tag-button-color, inherit);
  --loolabsh-icon-button-color-hover: var(--loolabsh-tag-button-color-hover, inherit);
  --loolabsh-icon-button-padding: 0;
  order: 2;
}
.tag > .icon-button:focus, .tag > .icon-button._focus-visible {
  outline: none;
}
.tag > .icon-button::after {
  content: ""; /* stylelint-disable-line string-quotes */
  height: var(--loolabsh-tag-height);
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
  width: var(--loolabsh-tag-height);
}
.tag.-remove {
  opacity: 0;
}

.tag.-primary {
  --loolabsh-tag-background-color: hsla(var(--loolabsh-color-ui-h), var(--loolabsh-color-ui-s), var(--loolabsh-color-ui-l), var(--loolabsh-tag-background-color-alpha));
  --loolabsh-tag-border-color: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-tag-color: var(--loolabsh-color-ui, #ce776f);
}

.tag.-success {
  --loolabsh-tag-background-color: hsla(var(--loolabsh-color-success-h), var(--loolabsh-color-success-s), var(--loolabsh-color-success-l), var(--loolabsh-tag-background-color-alpha));
  --loolabsh-tag-border-color: var(--loolabsh-color-success, #15c182);
  --loolabsh-tag-color: var(--loolabsh-color-success, #15c182);
}

.tag.-info {
  --loolabsh-tag-background-color: hsla(var(--loolabsh-color-info-h), var(--loolabsh-color-info-s), var(--loolabsh-color-info-l), var(--loolabsh-tag-background-color-alpha));
  --loolabsh-tag-border-color: var(--loolabsh-color-info, #2db5cd);
  --loolabsh-tag-color: var(--loolabsh-color-info, #2db5cd);
}

.tag.-warning {
  --loolabsh-tag-background-color: hsla(var(--loolabsh-color-warning-h), var(--loolabsh-color-warning-s), var(--loolabsh-color-warning-l), var(--loolabsh-tag-background-color-alpha));
  --loolabsh-tag-border-color: var(--loolabsh-color-warning, #fca311);
  --loolabsh-tag-color: var(--loolabsh-color-warning, #fca311);
}

.tag.-danger {
  --loolabsh-tag-background-color: hsla(var(--loolabsh-color-danger-h), var(--loolabsh-color-danger-s), var(--loolabsh-color-danger-l), var(--loolabsh-tag-background-color-alpha));
  --loolabsh-tag-border-color: var(--loolabsh-color-danger, #fb3e4e);
  --loolabsh-tag-color: var(--loolabsh-color-danger, #fb3e4e);
}

.tag.-l {
  --loolabsh-tag-font-size: var(--loolabsh-font-size, 1rem);
  --loolabsh-tag-height: calc(var(--loolabsh-input-height-l) * 0.8);
  --loolabsh-tag-padding: calc(var(--loolabsh-spacing, 1rem) * 1.25);
}

.tag.-s {
  --loolabsh-tag-font-size: var(--loolabsh-font-size-xs, 0.5rem);
  --loolabsh-tag-height: calc(var(--loolabsh-input-height-s, 30px) * 0.8);
  --loolabsh-tag-padding: var(--loolabsh-spacing-s, 0.5rem);
}

.tag.-pill {
  --loolabsh-tag-border-radius: 10rem;
}

.tag-group {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: var(--loolabsh-tag-group-gap, var(--loolabsh-spacing-s, 0.5rem));
}

.table {
  --loolabsh-table-border-color: var(--loolabsh-color-border, #959595);
  --loolabsh-table-border-style: solid;
  --loolabsh-table-border-width: var(--loolabsh-border-width, 1px);
  --loolabsh-table-color: currentColor;
  --loolabsh-table-header-border-width: calc(var(--loolabsh-table-border-width) * 2);
  --loolabsh-table-cell-padding-x: var(--loolabsh-spacing, 1rem);
  --loolabsh-table-cell-padding-y: var(--loolabsh-spacing, 1rem);
  --loolabsh-table-striped-background-color: var(--loolabsh-color-grey-light, #f1f1f1);
  --loolabsh-table-striped-color: var(--loolabsh-table-color);
  border-collapse: collapse;
  border-color: var(--loolabsh-table-border-color);
  caption-side: bottom;
  color: var(--loolabsh-table-color);
  width: 100%;
}
.table > :not(:first-child) {
  border-top: initial;
}
.table > :not(caption) > * > * {
  background-color: var(--loolabsh-table-accent-background-color, transparent);
  box-shadow: none;
  color: var(--loolabsh-table-accent-color, currentColor);
}
.table tr {
  border-color: var(--loolabsh-table-border-color);
}
.table th,
.table td {
  padding: var(--_tbl-cell-padding-y, var(--loolabsh-table-cell-padding-y)) var(--_tbl-cell-padding-x, var(--loolabsh-table-cell-padding-x));
}
.table > caption {
  font-size: var(--loolabsh-table-caption-font-size, var(--loolabsh-font-size-s, 0.75rem));
  padding: var(--loolabsh-table-caption-padding-y, var(--loolabsh-table-cell-padding-y)) var(--loolabsh-table-caption-padding-x, var(--loolabsh-table-cell-padding-x));
  text-align: center;
}
.table > thead > tr > * {
  background-color: var(--loolabsh-table-header-background-color, transparent);
  color: var(--loolabsh-table-header-color, var(--loolabsh-color-ui, #ce776f));
  font-size: var(--loolabsh-table-header-font-size, 1rem);
  font-weight: var(--loolabsh-table-header-font-weight, normal);
}
.table > thead > tr:last-child {
  border-bottom-color: var(--loolabsh-table-header-border-color, var(--loolabsh-color-ui, #ce776f));
  border-bottom-style: var(--loolabsh-table-header-border-style, var(--loolabsh-table-border-style));
  border-bottom-width: var(--loolabsh-table-header-border-width); /* stylelint-disable-line */
}
.table > tfoot > tr > * {
  background-color: var(--loolabsh-table-footer-background-color, transparent);
  color: var(--loolabsh-table-footer-color, var(--loolabsh-table-color));
  font-size: var(--loolabsh-table-footer-font-size, 1rem);
  font-weight: var(--loolabsh-table-footer-font-weight, normal);
}
.table > tfoot > tr:first-child {
  border-top-color: var(--loolabsh-table-footer-border-color, var(--loolabsh-color-ui, #ce776f));
  border-top-style: var(--loolabsh-table-footer-border-style, var(--loolabsh-table-border-style));
  border-top-width: var(--loolabsh-table-footer-border-width, var(--loolabsh-table-header-border-width)); /* stylelint-disable-line */
}

.table.-s {
  --_tbl-cell-padding-x: calc(var(--loolabsh-table-cell-padding-x) / 2);
  --_tbl-cell-padding-y: calc(var(--loolabsh-table-cell-padding-y) / 2);
}

.table:not(.-bordered) thead th,
.table:not(.-bordered) thead td {
  border-top: none;
}

.table.-bordered > :not(caption) > * {
  border-width: var(--loolabsh-table-border-width) 0;
}
.table.-bordered > :not(caption) > * > * {
  border-width: 0 1px;
}

.table.-striped > tbody > tr:nth-of-type(odd) > * {
  --loolabsh-table-accent-background-color: var(--loolabsh-table-striped-background-color);
  color: var(--loolabsh-table-striped-color);
}

.table-container {
  overflow-x: auto;
  scrollbar-width: none;
}
.table-container > table {
  margin: 0;
}

.table-container {
  --loo-scrollbar-track-color: transparent;
}
.table-container::-webkit-scrollbar {
  height: var(--loo-scrollbar-size, 6px);
  width: var(--loo-scrollbar-size, 6px);
}
.table-container::-webkit-scrollbar-thumb {
  background: var(--loo-scrollbar-color, #000);
}
.table-container::-webkit-scrollbar-track {
  background: var(--loo-scrollbar-track-color, #fff);
}
.table-container {
  scrollbar-face-color: var(--loo-scrollbar-color, #000);
  scrollbar-track-color: var(--loo-scrollbar-track-color, #fff);
}

.table {
  --loolabsh-table-border-color: var(--loo-color-coral);
  --loolabsh-table-border-width: 2px;
  --loolabsh-table-striped-background-color: hsla(var(--loo-color-primary-h), var(--loo-color-primary-s), var(--loo-color-primary-l), 0.3);
}
.table th,
.table td {
  border-width: 2px 0;
}
.table:not(.-bordered) thead {
  --loolabsh-table-header-color: var(--loo-color-white);
  background: var(--loo-color-primary);
}
.table.-bordered th,
.table.-bordered td {
  border-width: 2px 2px;
}
.table.-striped > tbody > tr:nth-of-type(odd) > * {
  --loolabsh-table-accent-background-color: transparent;
  color: var(--loo-color-coral);
}
.table.-striped > tbody > tr:nth-of-type(even) > * {
  --loolabsh-table-accent-background-color: var(--loolabsh-table-striped-background-color);
  color: var(--loolabsh-table-striped-color);
}

.tab-group {
  --loolabsh-tabgroup-background-color: transparent;
  --loolabsh-tabgroup-border-color: var(--loolabsh-color-border, #959595);
  --loolabsh-tabgroup-border-radius: var(--loolabsh-border-radius, 0px);
  --loolabsh-tabgroup-border-width: var(--loolabsh-border-width, 1px);
  --loolabsh-tabgroup-padding-x: var(--loolabsh-spacing, 1rem);
  --loolabsh-tabgroup-padding-y: var(--loolabsh-spacing, 1rem);
  --loolabsh-tabgroup-duration: var(--loolabsh-duration, 0.15s);
  --loolabsh-tabgroup-tab-background-color: transparent;
  --loolabsh-tabgroup-tab-background-color-active: transparent;
  --loolabsh-tabgroup-tab-color: var(--loolabsh-color-text, #3e3e3e);
  --loolabsh-tabgroup-tab-color-active: var(--loolabsh-color-ui, #ce776f);
  --loolabsh-tabgroup-tab-font-size: var(--loolabsh-font-size, 1rem);
  --loolabsh-tabgroup-tab-gap: var(--loolabsh-spacing-s, 0.5rem);
  --_tabg-duration: calc(var(--global-duration-multiplier, 1) * var(--loolabsh-tabgroup-duration));
  background-color: var(--loolabsh-tabgroup-background-color);
  display: flex;
  flex-direction: column;
}
.tab-group__nav {
  display: flex;
  overflow-x: scroll;
  scrollbar-width: none;
}
.tab-group__nav::-webkit-scrollbar {
  height: 0;
  width: 0;
}
.tab-group__nav-container {
  order: 1;
}
.tab-group__body {
  border: solid var(--loolabsh-tabgroup-border-width) var(--loolabsh-tabgroup-border-color);
  border-radius: var(--loolabsh-tabgroup-border-radius);
  order: 2;
}
.tab-group__tabs {
  display: flex;
  flex: 1 1 auto;
  flex-flow: row nowrap;
  font-size: var(--loolabsh-tabgroup-tab-font-size);
  gap: var(--loolabsh-tabgroup-tab-gap);
  position: relative;
}
.tab-group__tabs.nav {
  --loolabsh-nav-gap: var(--loolabsh-tabgroup-tab-gap);
}
.tab-group__indicator {
  position: absolute;
  transition: var(--_tabg-duration) transform ease-in-out, var(--_tabg-duration) width ease-in-out;
}

.tab-group .tab {
  align-items: center;
  background-color: var(--loolabsh-tabgroup-tab-background-color);
  border: 0 none;
  border-radius: var(--loolabsh-tabgroup-border-radius);
  color: var(--loolabsh-tabgroup-tab-color);
  cursor: pointer;
  display: inline-flex;
  font-size: var(--loolabsh-tabgroup-tab-font-size);
  height: auto;
  line-height: normal;
  padding: var(--loolabsh-tabgroup-tab-padding-y, var(--loolabsh-tabgroup-padding-y)) var(--loolabsh-tabgroup-tab-padding-x, var(--loolabsh-tabgroup-padding-x));
  transition: all var(--_tabg-duration) ease-in-out;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  white-space: nowrap;
}
.tab-group .tab[aria-selected=true] { /* stylelint-disable-line string-quotes */
  background-color: var(--loolabsh-tabgroup-tab-background-color-active);
  color: var(--loolabsh-tabgroup-tab-color-active);
}
.tab-group .tab:focus {
  box-shadow: none;
  outline: none;
}

.tab-group .tab-panel {
  transition: opacity var(--_tabg-duration) ease-in-out;
}
.tab-group .tab-panel__content {
  padding: var(--loolabsh-tabgroup-panel-padding-y, var(--loolabsh-tabgroup-padding-y)) var(--loolabsh-tabgroup-panel-padding-x, var(--loolabsh-tabgroup-padding-x));
}
.tab-group .tab-panel__content > :first-child:not(.row) {
  margin-top: 0;
}
.tab-group .tab-panel__content > :last-child:not(.row) {
  margin-bottom: 0;
}

.tab-group.-tabs-top .tab-group__indicator, .tab-group.-tabs-bottom .tab-group__indicator {
  left: 0;
  width: 0;
}
.tab-group.-tabs-top .tab {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.tab-group.-tabs-top .tab-group__nav-container {
  order: 1;
}
.tab-group.-tabs-top .tab-group__body {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-top-width: 0;
  order: 2;
}
.tab-group.-tabs-top .tab-group__tabs {
  border-bottom: var(--loolabsh-tabgroup-border-width) solid var(--loolabsh-tabgroup-border-color);
}
.tab-group.-tabs-top .tab-group__indicator {
  border-bottom: var(--loolabsh-tabgroup-tab-indicator-width, var(--loolabsh-tabgroup-border-width)) solid var(--loolabsh-tabgroup-tab-indicator-color-active, var(--loolabsh-tabgroup-tab-color-active));
  bottom: calc(var(--loolabsh-tabgroup-border-width) * -1);
}
.tab-group.-tabs-bottom .tab {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.tab-group.-tabs-bottom .tab-group__nav-container {
  order: 2;
}
.tab-group.-tabs-bottom .tab-group__body {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-width: 0;
  order: 1;
}
.tab-group.-tabs-bottom .tab-group__tabs {
  border-top: var(--loolabsh-tabgroup-border-width) solid var(--loolabsh-tabgroup-border-color);
}
.tab-group.-tabs-bottom .tab-group__indicator {
  border-top: var(--loolabsh-tabgroup-tab-indicator-width, var(--loolabsh-tabgroup-border-width)) solid var(--loolabsh-tabgroup-tab-indicator-color-active, var(--loolabsh-tabgroup-tab-color-active));
  top: calc(var(--loolabsh-tabgroup-border-width) * -1);
}
.tab-group.-tabs-left, .tab-group.-tabs-right {
  flex-direction: row;
}
.tab-group.-tabs-left .tab-group__nav, .tab-group.-tabs-right .tab-group__nav {
  min-height: 100%;
  overflow-x: auto;
}
.tab-group.-tabs-left .tab-group__body, .tab-group.-tabs-right .tab-group__body {
  flex: 1 1 auto;
}
.tab-group.-tabs-left .tab-group__indicator, .tab-group.-tabs-right .tab-group__indicator {
  height: 0;
  top: 0;
}
.tab-group.-tabs-left .tab-group__tabs, .tab-group.-tabs-right .tab-group__tabs {
  border: 0 none;
  flex: 0 0 auto;
  flex-direction: column;
}
.tab-group.-tabs-left .tab {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
}
.tab-group.-tabs-left .tab-group__nav-container {
  order: 1;
}
.tab-group.-tabs-left .tab-group__body {
  border-bottom-left-radius: 0;
  border-left-width: 0;
  border-top-left-radius: 0;
  order: 2;
}
.tab-group.-tabs-left .tab-group__tabs {
  border-right: var(--loolabsh-tabgroup-border-width) solid var(--loolabsh-tabgroup-border-color);
}
.tab-group.-tabs-left .tab-group__indicator {
  border-right: var(--loolabsh-tabgroup-tab-indicator-width, var(--loolabsh-tabgroup-border-width)) solid var(--loolabsh-tabgroup-tab-indicator-color-active, var(--loolabsh-tabgroup-tab-color-active));
  right: calc(var(--loolabsh-tabgroup-border-width) * -1);
}
.tab-group.-tabs-right .tab {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}
.tab-group.-tabs-right .tab-group__nav-container {
  order: 2;
}
.tab-group.-tabs-right .tab-group__body {
  border-bottom-right-radius: 0;
  border-right-width: 0;
  border-top-right-radius: 0;
  order: 1;
}
.tab-group.-tabs-right .tab-group__tabs {
  border-left: var(--loolabsh-tabgroup-border-width) solid var(--loolabsh-tabgroup-border-color);
}
.tab-group.-tabs-right .tab-group__indicator {
  border-left: var(--loolabsh-tabgroup-tab-indicator-width, var(--loolabsh-tabgroup-border-width)) solid var(--loolabsh-tabgroup-tab-indicator-color-active, var(--loolabsh-tabgroup-tab-color-active));
  left: calc(var(--loolabsh-tabgroup-border-width) * -1);
}

.tab-group {
  --loolabsh-tabgroup-background-color: transparent;
  --loolabsh-tabgroup-border-color: var(--loo-color-coral);
  --loolabsh-tabgroup-border-color-active: var(--loo-color-primary);
  --loolabsh-tabgroup-border-radius: var(--loo-spacing-s);
  --loolabsh-tabgroup-border-width: 2px;
  --loolabsh-tabgroup-tab-background-color: var(--loo-color-coral);
  --loolabsh-tabgroup-tab-background-color-active: var(--loo-color-coral);
  --loolabsh-tabgroup-tab-border-radius: var(--loo-spacing-s);
  --loolabsh-tabgroup-tab-color: var(--loo-color-white);
  --loolabsh-tabgroup-tab-color-active: var(--loo-color-white);
  --loolabsh-tabgroup-tab-font-weight: var(--loo-font-weight-bold);
  --loolabsh-tabgroup-tab-indicator-color-active: var(--loo-color-primary);
  --loolabsh-tabgroup-tab-indicator-width: 5px;
}

.text-block {
  --loolabsh-text-block-gap: var(--loolabsh-spacing, 1rem);
  --loolabsh-text-block-column-media-size: 50%;
  background-color: var(--loolabsh-text-block-background-color, transparent);
  padding: var(--loolabsh-text-block-padding, 0);
  position: relative;
}
.text-block-text {
  -webkit-hyphens: manual;
          hyphens: manual;
  order: 2;
  overflow-wrap: break-word;
  word-wrap: break-word;
}
.text-block-text > :first-child {
  margin-top: 0;
}
.text-block-text > :last-child {
  margin-bottom: 0;
}
.text-block-media {
  order: 1;
}
.text-block-media > * {
  display: block;
  margin: 0 auto;
  width: 100%;
}
@media (min-width: 768px) {
  .text-block {
    --loolabsh-text-block-column-media-size: 50%;
  }
}

.text-block[class*=-media] { /* stylelint-disable-line string-quotes */ }
.text-block[class*=-media] > .text-block__inner {
  align-items: var(--loolabsh-text-block-align-items, flex-start);
  display: flex;
  flex-wrap: wrap;
  gap: var(--loolabsh-text-block-gap);
}

/* stylelint-disable string-quotes */
.text-block[class*=-media-left] .text-block-text, .text-block[class*=-media-left] .text-block-media,
.text-block[class*=-media-right] .text-block-text,
.text-block[class*=-media-right] .text-block-media {
  flex-grow: 1;
  flex-shrink: 0;
}
.text-block[class*=-media-left] .text-block-text,
.text-block[class*=-media-right] .text-block-text {
  flex-basis: calc(100% - var(--loolabsh-text-block-column-media-size) - var(--loolabsh-text-block-gap));
}
.text-block[class*=-media-left] .text-block-media,
.text-block[class*=-media-right] .text-block-media {
  flex-basis: calc(var(--loolabsh-text-block-column-media-size) - var(--loolabsh-text-block-gap));
  min-width: var(--loolabsh-text-block-column-media-min-width, 0);
}

/* stylelint-enable string-quotes */
/* stylelint-disable string-quotes */
.text-block[class*=-media-above] > .text-block__inner,
.text-block[class*=-media-below] > .text-block__inner {
  flex-direction: column;
}
.text-block[class*=-media-above] .text-block-text, .text-block[class*=-media-above] .text-block-media,
.text-block[class*=-media-below] .text-block-text,
.text-block[class*=-media-below] .text-block-media {
  width: 100%;
}
.text-block[class*=-media-above] .text-block-media > *,
.text-block[class*=-media-below] .text-block-media > * {
  max-width: var(--loolabsh-text-block-vertical-media-max-width, none);
}

/* stylelint-enable string-quotes */
/* stylelint-disable string-quotes */
.text-block[class*=-media-right] .text-block-text,
.text-block[class*=-media-below] .text-block-text {
  order: 1;
}
.text-block[class*=-media-right] .text-block-media,
.text-block[class*=-media-below] .text-block-media {
  order: 2;
}

/* stylelint-enable string-quotes */
.text-block {
  --loolabsh-text-block-align-items: center;
  --loolabsh-text-block-gap: var(--loo-block-element-margin);
  --loolabsh-text-block-column-media-size: 100%;
}
@media (min-width: 768px) {
  .text-block {
    --loolabsh-text-block-column-media-size: 40%;
    --loolabsh-text-block-gap: calc(var(--loo-block-element-margin) * 2);
  }
}
.text-block .swiper-button-prev, .text-block .swiper-button-next {
  display: none;
}
.text-block-media > .figure {
  position: relative;
}
.text-block-media > .figure img {
  animation-name: border-morphing;
  animation-duration: 10s;
  animation-iteration-count: infinite;
  position: relative;
  z-index: 1;
}
.text-block-media > .figure::after {
  animation-name: border-morphing;
  animation-duration: 10s;
  animation-iteration-count: infinite;
  animation-delay: -2s;
  background: var(--loo-color-secondary);
  content: "";
  display: block;
  height: 100%;
  left: 0;
  opacity: 0.5;
  position: absolute;
  top: 0;
  transform: translate(calc(var(--loo-spacing) * -1), calc(var(--loo-spacing) * -1));
  width: 100%;
  z-index: 0;
}

.badge {
  --loolabsh-badge-font-size: var(--loo-font-size-xxs);
}

.details-group {
  --loolabsh-details-group-gap: var(--loo-spacing);
}

.icon-button.-active {
  --loolabsh-icon-button-color: var(--loo-color-primary);
}

.pagination {
  --loolabsh-pagination-border-color-hover: hsl(var(--loo-color-black-h), var(--loo-color-black-s), 70%);
}

.stack {
  --loolabsh-stack-gap: var(--loo-block-element-margin);
}

.header {
  --loo-header-margin: var(--loo-spacing-l);
  color: var(--loo-header-color, currentColor);
  display: flex;
  flex-direction: column;
  font-size: var(--loo-header-font-size, 1rem);
  gap: var(--loo-header-gap, var(--loo-spacing-xs));
}
.header > time {
  color: var(--loo-header-time-color, currentColor);
  display: none;
  font-size: var(--loo-header-time-font-size, inherit);
  order: 3;
}
.header__title {
  margin: 0;
  order: 1;
}
.header__subtext {
  color: var(--loo-header-subtext-color, currentColor);
  font-size: var(--loo-header-subtext-font-size, inherit);
  margin: 0;
  order: 2;
}
.header:not(:first-child) {
  margin-top: var(--loo-header-margin);
}
.header:not(:last-child) {
  margin-bottom: var(--loo-header-margin);
}

.audio-content .player {
  margin-bottom: var(--loo-block-element-margin);
}
.audio-content > :last-child {
  margin-bottom: 0;
}

.video {
  --loo-video-content-max-width: 36rem;
}
.video-media, .video-body {
  margin-left: auto;
  margin-right: auto;
  max-width: var(--loo-video-content-max-width);
}
.video-body {
  padding-top: var(--loo-spacing-xl);
}
.video-body > :last-child {
  margin-bottom: 0;
}
.video-media .player-video .player-media {
  --_video-ply-width: var(--_video-ply-width-overwrite, 100vw);
  left: 50%;
  margin-left: calc(var(--_video-ply-width) / 2 * -1);
  position: relative;
  width: var(--_video-ply-width);
}
.video-media .player-video .plyr__controls {
  margin: 0 auto;
  max-width: var(--loo-video-content-max-width);
  padding: var(--loo-spacing) 0;
  width: calc(100% - var(--loo-page-offset) * 2);
}

.section.-video {
  --fs-section-background-color: var(--loo-color-primary);
  color: var(--loo-color-primary-contrast);
  padding-bottom: var(--loo-spacing-xl);
  padding-top: 0;
}
.section.-video::before {
  display: none;
}

.article {
  --loo-article-gap: var(--loo-spacing-l);
  --loo-article-sidebar-gap: var(--loo-spacing-l);
  --loo-article-sidebar-sidebar-width: 33%;
  display: flex;
  flex-direction: column;
  gap: var(--loo-article-gap);
  position: relative;
}
.article-header {
  display: flex;
  flex-direction: column;
  gap: var(--loo-article-header-gap, var(--loo-spacing));
}
.article-header > * {
  margin: 0;
}
.article-body {
  display: flex;
  flex-wrap: wrap;
  gap: var(--loo-article-sidebar-gap);
}
.article-body > .content {
  flex-basis: 100%;
  flex-grow: 666;
  min-width: 100%;
  order: 1;
}
.article-body > .sidebar {
  flex-basis: 100%;
  flex-grow: 1;
  min-width: 0;
  order: 2;
  width: 100%;
}
@media (min-width: 768px) {
  .article-body {
    --_article-sidebar-width: calc(var(--loo-article-sidebar-sidebar-width) + var(--loo-article-sidebar-gap));
    align-items: flex-start;
    flex-wrap: nowrap;
  }
  .article-body > .content,
  .article-body > .sidebar {
    position: -webkit-sticky;
    position: sticky;
    top: var(--global-scroll-top-offset);
  }
  .article-body > .content {
    flex-basis: calc(100% - var(--_article-sidebar-width));
    min-width: calc(100% - var(--_article-sidebar-width));
  }
  .article-body > .sidebar {
    flex-basis: var(--_article-sidebar-width);
    width: var(--_article-sidebar-width);
  }
}
.article-footer {
  align-items: center;
  display: flex;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .article {
    --loo-article-header-gap: var(--loo-spacing-l);
    --loo-article-teaser-padding: var(--loo-spacing-l);
  }
}
@media (min-width: 992px) {
  .article {
    --loo-article-gap: var(--loo-spacing-xl);
    --loo-article-sidebar-gap: var(--loo-spacing-xl);
  }
}

.article-header__teaser {
  background-color: var(--loo-color-black-lighten);
  padding: var(--loo-article-teaser-padding, var(--loo-spacing));
}
.article-header__meta {
  align-items: center;
  color: hsl(var(--loo-color-black-h), var(--loo-color-black-s), 50%);
  display: flex;
  font-size: var(--loo-font-size-s);
  justify-content: space-between;
}
.article-header__meta .time__time {
  display: none;
}
.article-header__meta .article-category + .time {
  margin-right: auto;
}
.article-header__meta .article-category + .time::before {
  content: "·"; /* stylelint-disable-line string-quotes */
  margin: 0 var(--loo-spacing-s);
}

.article-section > * {
  margin-bottom: 0;
  margin-top: 0;
}
.article-section > *:not(:first-child) {
  margin-top: var(--loo-block-element-margin);
}
.article-section > .ce:not(:first-child) {
  margin-top: var(--loo-content-element-margin);
}
.article-section + .article-section {
  border-top: 1px solid hsl(var(--loo-color-black-h), var(--loo-color-black-s), 90%);
  padding-top: var(--loo-article-gap);
}

.section-hero > .hero {
  align-items: flex-end;
  display: flex;
  height: 100%;
  position: relative;
  width: 100%;
}
@media (min-width: 1400px) {
  .section-hero > .hero {
    position: absolute;
  }
}

.hero {
  --loo-hero-figure-dim: 65%;
}
.hero__inner {
  display: grid;
  grid-template: "media media" "heading heading";
  grid-template-columns: 1fr;
  gap: var(--loo-spacing);
  height: 100%;
  padding: var(--loo-section-gap);
  width: 100%;
}
@media (min-width: 1200px) {
  .hero__inner {
    grid-template: "heading media" "heading media";
    grid-template-columns: 1fr 1fr;
    padding: 0;
  }
}
.hero__inner > * {
  height: 100%;
}
.hero-text {
  align-items: center;
  display: flex;
  grid-area: heading;
  justify-content: center;
  position: relative;
  z-index: 2;
}
@media (min-width: 1200px) {
  .hero-text {
    padding: var(--loo-spacing-l);
  }
}
.hero-text__body {
  background: var(--loo-color-white);
  border-radius: var(--loo-spacing-l);
  max-width: 100%;
  padding: var(--loo-spacing-l);
  z-index: 1;
}
@media (min-width: 992px) {
  .hero-text__body {
    box-shadow: 10px 10px 0 var(--loo-color-text);
  }
}
.hero-text__body > *:first-child {
  margin-top: 0;
}
.hero-text__body > *:last-child {
  margin-bottom: 0;
}
.hero-text h1 {
  display: flex;
  flex-direction: column;
  gap: var(--loo-spacing-s);
}
@media (min-width: 1200px) {
  .hero-text::before {
    animation-name: border-morphing;
    animation-duration: 15s;
    animation-iteration-count: infinite;
    animation-delay: 0.25s;
    background: var(--loo-color-primary);
    border-radius: 70% 30% 40% 20%;
    content: "";
    display: block;
    height: 50%;
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
  }
  .hero-text::after {
    animation-name: border-morphing;
    animation-duration: 15s;
    animation-delay: 1s;
    animation-iteration-count: infinite;
    background: var(--loo-color-secondary);
    border-radius: 70% 30% 40% 20%;
    content: "";
    bottom: 0;
    display: block;
    height: 100%;
    left: -40%;
    position: absolute;
    width: 100%;
  }
}
.hero-media {
  grid-area: media;
  position: relative;
  z-index: 1;
}
@media (min-width: 1200px) {
  .hero-media {
    --loo-hero-figure-dim: 100%;
  }
  .hero-media .figure {
    margin: 0 auto !important;
  }
}
@media (min-width: 1400px) {
  .hero-media {
    --loo-hero-figure-dim: 75%;
  }
}
.hero-media::before {
  animation-name: border-morphing;
  animation-duration: 15s;
  animation-iteration-count: infinite;
  background: var(--loo-color-tertiary);
  content: "";
  opacity: 0.5;
  display: block;
  height: var(--loo-hero-figure-dim);
  left: 0;
  position: absolute;
  top: 0;
  width: var(--loo-hero-figure-dim);
}
@media (min-width: 1200px) {
  .hero-media::before {
    right: 75px;
    top: 100px;
  }
}
.hero-media .figure,
.hero-media .picture,
.hero-media img {
  height: 100%;
}
.hero-media .figure {
  height: 0;
  margin: 0 0 0 auto;
  padding-top: var(--loo-hero-figure-dim);
  position: relative;
  width: var(--loo-hero-figure-dim);
}
.hero-media .figure .picture {
  /* align-items: center; */
  display: flex;
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  transform: translateY(calc((100% - var(--loo-hero-figure-dim)) / 2));
  width: 100%;
}
.hero-media .figure .picture img {
  border-radius: 70% 30% 40% 20%;
  -o-object-fit: cover;
     object-fit: cover;
  animation-name: border-morphing;
  animation-duration: 10s;
  animation-iteration-count: infinite;
}
@keyframes border-morphing {
  0% {
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
  20% {
    border-radius: 67% 33% 71% 29%/37% 65% 35% 63%;
  }
  40% {
    border-radius: 41% 59% 74% 26%/56% 22% 78% 44%;
  }
  60% {
    border-radius: 68% 32% 50% 50%/43% 43% 57% 57%;
  }
  80% {
    border-radius: 44% 56% 38% 62%/58% 67% 33% 42%;
  }
  100% {
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
}

/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
.page {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.page:focus-visible {
  outline: none;
}
.page-header {
  padding-left: var(--loo-page-offset);
  padding-right: var(--loo-page-offset);
}
.page-header:focus-visible {
  outline: none;
}
.page-main {
  flex: 1 0 auto;
  scroll-margin-top: var(--global-scroll-top-offset);
}
.page-main:focus-visible {
  outline: none;
}
.page-main > .section {
  scroll-margin-top: var(--global-scroll-top-offset);
}
.page-main > .section:first-of-type {
  border-top: 0 none;
}
.page-main > .section-hero {
  padding: 0;
}
@media (min-width: 1200px) {
  .page-main > .section-hero {
    min-height: 80vh;
  }
}
@media (min-width: 1400px) {
  .page-main > .section-hero {
    min-height: 100vh;
  }
}
.page-main > .section:first-child:not(.section-hero) {
  margin-top: var(--loo-spacing-l);
}
@media (min-width: 1400px) {
  .page-main > .section:first-child:not(.section-hero) {
    margin-top: 0;
  }
}
.page-footer {
  padding-left: var(--loo-page-offset);
  padding-right: var(--loo-page-offset);
}
.page-footer:focus-visible {
  outline: none;
}

[data-global-button] {
  --loolabsh-icon-button-background-color: var(--loo-color-primary);
  --loolabsh-icon-button-color: var(--loo-color-white);
  --loolabsh-icon-button-padding: var(--loo-spacing);
  --loolabsh-icon-button-font-size: 1.5rem;
  --loo-global-button-zindex: 9;
  border-radius: 50%;
  bottom: var(--loo-spacing-s);
  opacity: 0;
  pointer-events: none;
  position: fixed;
  transition-duration: calc(var(--global-duration-multiplier, 1) * var(--loo-transition-close));
  transition-property: all;
  transition-timing-function: ease-in;
  z-index: var(--loo-global-button-zindex);
}
[data-global-button].-is-shown {
  opacity: 1;
  pointer-events: all;
  transition-duration: calc(var(--global-duration-multiplier, 1) * var(--loo-transition-open));
  transition-timing-function: ease-out;
}
[data-global-button]:hover {
  transform: scale(1.1);
}
.page-footer-in-view [data-global-button] {
  --loolabsh-icon-button-color: var(--loo-color-primary);
  --loolabsh-icon-button-background-color: var(--loo-color-white);
}

[data-global-button][data-cookieconsent] {
  left: var(--loo-spacing-s);
}
[data-global-button][data-scroll-page-top=global] {
  right: var(--loo-spacing-s);
}
[data-global-button][data-scroll-page-top=global] i {
  transform: rotate(135deg);
}

/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
.main-nav > .nav-list {
  align-items: stretch;
  flex-direction: column;
  overflow: hidden;
  width: 100%;
}
.main-nav .nav-list .nav-item > .nav-list,
.main-nav .nav-list .nav-item > .nav-container {
  padding: var(--loolabsh-nav-list-gap-y) var(--loo-spacing-l);
}
.main-nav .nav-list .nav-item > .nav-list.-will-hide, .main-nav .nav-list .nav-item > .nav-list[aria-hidden=false],
.main-nav .nav-list .nav-item > .nav-container.-will-hide,
.main-nav .nav-list .nav-item > .nav-container[aria-hidden=false] { /* stylelint-disable-line string-quotes */
  flex: 0 0 auto;
  left: auto;
  position: static;
  right: auto;
  top: auto;
  width: 100%;
}
@media (min-width: 992px) {
  .main-nav .nav-list .nav-item > .nav-list,
  .main-nav .nav-list .nav-item > .nav-container > .nav-list {
    -moz-column-count: unset;
         column-count: unset;
  }
}

.page-menu.drawer {
  --loolabsh-drawer-size: 100%;
  --loolabsh-drawer-z-index: var(--loo-zindex-page-menu);
}
.page-menu .drawer__header {
  height: var(--loo-page-header-height);
  min-height: var(--loo-page-header-height);
  padding-bottom: 0;
  padding-top: 0;
}
.page-menu .drawer__header .page-logo {
  --page-logo-height: var(--loo-page-header-logo-height);
}
@media (min-width: 992px) {
  .page-menu {
    --loolabsh-drawer-size: 30rem;
  }
}
@media (min-width: 1200px) {
  .page-menu {
    --loolabsh-drawer-size: 35rem;
  }
}
.page-menu .nav {
  font-family: var(--loo-font-family-logo);
}
.page-menu .nav-link__label {
  --loolabsh-nav-font-weight: var(--loo-font-weight-bold);
}
.page-menu .nav.main-nav {
  font-size: var(--loo-h4-font-size);
  height: 100%;
  text-align: center;
  width: 100%;
}
@media (min-width: 992px) {
  .page-menu .nav.main-nav {
    font-size: var(--loo-h2-font-size);
  }
}
.page-menu .nav.main-nav > .nav-list {
  position: relative;
}
.page-menu .nav.main-nav > .nav-list .nav-link {
  transform: translateX(0);
  transition: opacity 0.5s ease-in-out, transform 0.75s ease-in-out;
}
.page-menu .nav.main-nav > .nav-list._hide .nav-link {
  transform: translateX(-100%);
  transition: opacity 0.5s ease-in-out, transform 0.75s ease-in-out;
}
.page-menu .nav.main-nav > .nav-list:not(._hide) > .nav-item .nav-list .nav-link {
  transform: translateX(100%);
}
.page-menu .nav.main-nav > .nav-list .nav-list {
  background: transparent;
  padding: 0;
  position: absolute;
  top: 0;
}
.page-menu .nav.main-nav > .nav-list .nav-list .nav-link {
  transform: translateX(-100%);
}
.page-menu .nav.main-nav > .nav-list .nav-list[aria-hidden=false] .nav-link {
  transform: translateX(0);
}
.page-menu .nav.main-nav > .nav-list .nav-list[aria-hidden=false] .nav-list .nav-link {
  transform: translateX(100%);
}
.page-menu .nav.main-nav .nav-list {
  max-height: 100%;
  overflow: hidden auto;
}
.page-menu .nav.main-nav .nav-list::-webkit-scrollbar {
  height: var(--loo-scrollbar-size, 6px);
  width: var(--loo-scrollbar-size, 6px);
}
.page-menu .nav.main-nav .nav-list::-webkit-scrollbar-thumb {
  background: var(--loo-scrollbar-color, #000);
}
.page-menu .nav.main-nav .nav-list::-webkit-scrollbar-track {
  background: var(--loo-scrollbar-track-color, #fff);
}
.page-menu .nav.main-nav .nav-list {
  scrollbar-face-color: var(--loo-scrollbar-color, #000);
  scrollbar-track-color: var(--loo-scrollbar-track-color, #fff);
}
.page-menu .nav.main-nav .nav-list._hide > .nav-item > .nav-link {
  opacity: 0;
}
.page-menu .nav.main-nav .nav-item {
  position: static;
}
.page-menu .nav.meta-nav, .page-menu .nav.social-nav {
  display: none;
}
@media (min-width: 768px) {
  .page-menu .nav.meta-nav, .page-menu .nav.social-nav {
    display: flex;
  }
}
.page-menu .nav.meta-nav .nav-link, .page-menu .nav.social-nav .nav-link {
  --bs-nav-link-font-size: var(--loo-font-size-l);
}

.page-header button[aria-controls=page-menu-drawer] { /* stylelint-disable-line string-quotes */
  --loolabsh-icon-button-color: var(--loo-color-white);
  --loolabsh-icon-button-color-hover: var(--loo-color-text);
  --_pmd-calc-duration: calc(var(--global-duration-multiplier, 1) * var(--loo-transition));
  font-size: var(--loo-h2-font-size);
}
.page-header button[aria-controls=page-menu-drawer] .icon-button__icon {
  position: relative;
}
.page-header button[aria-controls=page-menu-drawer] [data-off],
.page-header button[aria-controls=page-menu-drawer] [data-on] {
  left: 50%;
  position: absolute;
  top: 50%;
  transform-origin: center;
  transition: all var(--_pmd-calc-duration);
}
.page-header button[aria-controls=page-menu-drawer] [data-off] {
  opacity: 1;
  transform: translate3d(-50%, -50%, 0) scale(1);
  transition: all var(--_pmd-calc-duration) ease-in-out calc(var(--_pmd-calc-duration) / 2);
}
.page-header button[aria-controls=page-menu-drawer] [data-on] {
  opacity: 0;
  transform: translate3d(-50%, -50%, 0) scale(0.5);
  transition: all var(--_pmd-calc-duration);
}
.page-header button[aria-controls=page-menu-drawer].-active [data-on] {
  opacity: 1;
  transform: translate3d(-50%, -50%, 0) scale(1);
  transition: all var(--_pmd-calc-duration) ease-in-out calc(var(--_pmd-calc-duration) / 2);
}
.page-header button[aria-controls=page-menu-drawer].-active [data-off] {
  opacity: 0;
  transform: translate3d(-50%, -50%, 0) scale(0.5);
  transition: all var(--_pmd-calc-duration);
}
.page-header button[aria-controls=page-menu-drawer]:hover {
  --_ibtn-color: var(--loo-color-primary) !important;
}

/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
.page-footer {
  --loo-page-footer-padding-y: var(--loo-spacing-l);
  background-color: var(--loo-color-tertiary);
  color: var(--loo-color-secondary-contrast);
  margin-top: 200px;
  padding-bottom: calc(var(--loo-spacing-s) * 10);
  padding-top: var(--loo-page-footer-padding-y);
  position: relative;
}
.page-footer::before {
  background-image: url(./media/elements/footer-top.svg);
  background-position: bottom center;
  background-repeat: repeat no-repeat;
  background-size: contain;
  content: "";
  display: block;
  height: 243px;
  left: 0;
  position: absolute;
  top: 0;
  transform: translateY(-99%);
  width: 100%;
}
.page-footer__inner {
  margin-left: auto;
  margin-right: auto;
  max-width: var(--loo-page-max-width);
  width: 100%;
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: var(--loo-spacing-l);
  justify-content: center;
}
@media (min-width: 768px) {
  .page-footer__inner {
    flex-direction: row;
    justify-content: space-between;
  }
}
.page-footer__inner > * {
  margin: 0;
}
.page-footer .nav {
  --loolabsh-nav-link-background-color: transparent;
  --loolabsh-nav-link-background-color-hover: transparent;
  --loolabsh-nav-link-background-color-active: transparent;
  --loolabsh-nav-link-color: inherit;
  --loolabsh-nav-link-color-hover: var(--loo-color-white);
  --loolabsh-nav-link-color-active: inherit;
  --loolabsh-nav-link-padding: 0;
  --loolabsh-nav-gap: var(--loo-spacing);
}
.page-footer .nav-list {
  flex-direction: column;
}
@media (min-width: 768px) {
  .page-footer .nav-list {
    flex-direction: row;
    flex-wrap: wrap;
  }
}
.page-footer .nav-link {
  --bs-nav-link-font-size: var(--loo-font-size-xl);
}
.page-footer .nav-link:hover, .page-footer .nav-link:focus {
  --_nvli-color: var(--loo-color-coral);
}
.page-footer .nav.meta-nav {
  --loolabsh-nav-gap: var(--loo-spacing-l);
  font-family: var(--loo-heading-font-family);
}
.page-footer .language-picker {
  --loolabsh-language-picker-color-hover: currentColor;
  --loolabsh-language-picker-color-active: currentColor;
  --loolabsh-language-picker-item-gap: var(--loo-spacing);
  --loolabsh-language-picker-padding: 0;
}

/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
.section {
  --loo-section-gap: var(--loo-page-offset);
  --_sect-duration: calc(var(--global-duration-multiplier, 1) * var(--loo-transition-complex));
  background-color: transparent;
  margin: 0;
  padding: var(--loo-section-padding, var(--loo-section-gap));
  position: relative;
}

.section-pagetitle .header {
  --loo-header-color: var(--loo-color-tertiary);
  --loo-header-border-width: var(--loo-spacing-s);
}

.section-pagetitle .header h1 {
  --loo-heading-color: var(--loo-body-color);
  align-items: center;
  display: flex;
  justify-content: center;
  gap: var(--loo-spacing-l);
}

.section-pagetitle .header h1 > span {
  border-bottom: var(--loo-header-border-width) solid var(--loo-header-color);
  margin-bottom: var(--loo-spacing-l);
}

@media (min-width: 992px) {
  .section-pagetitle .header h1 > span {
    border: var(--loo-header-border-width) solid var(--loo-header-color);
    border-radius: var(--loo-spacing-xl);
    margin-bottom: 0;
    padding: var(--loo-spacing-s) var(--loo-spacing-l);
  }
}
.section-pagetitle .header h1::before, .section-pagetitle .header h1::after {
  background: var(--loo-header-color);
  border-radius: 16px;
  content: "";
  display: none;
  flex: 1 1;
  height: var(--loo-header-border-width);
  max-width: 1800px;
  transition: max-width 2.5s ease-in-out;
  width: 100%;
}

@media (min-width: 992px) {
  .section-pagetitle .header h1::before, .section-pagetitle .header h1::after {
    display: inline-block;
  }
}
.section-header, .section-body {
  margin-left: auto;
  margin-right: auto;
  max-width: var(--loo-page-max-width);
  width: 100%;
}

.section-header {
  color: hsl(var(--loo-color-black-h), var(--loo-color-black-s), 55%);
  font-size: var(--loo-font-size-xs);
  margin-bottom: var(--loo-section-gap);
  text-align: center;
}

.section-header > .title {
  --loo-heading-font-size: var(--loo-font-size-xl);
  --loo-heading-margin: var(--loo-spacing-xs);
  --loo-heading-color: var(--loo-color-primary);
}

.section-header > .subtext {
  font-style: italic;
}

.section-header > :last-child {
  margin-bottom: 0;
}

.section-body + .section-footer {
  margin-top: calc(var(--loo-section-gap) / 2);
  text-align: center;
}

.section-body__inner > * {
  margin-bottom: 0;
  margin-top: 0;
}

.section-body__inner > * + * {
  margin-top: var(--loo-content-element-margin);
}

.section.-primary {
  margin: var(--loo-page-offset) 0;
  padding-bottom: var(--loo-content-element-margin);
  padding-top: var(--loo-content-element-margin);
}

.section.-primary::before {
  background: var(--loo-color-primary, #ce7870);
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

.section.-primary:not(.-off-bot):not(.-off-top) {
  color: var(--loo-color-primary-contrast, #fff);
}

.section.-primary.-off-top::before, .section.-primary.-off-bot::before {
  height: calc(100% - var(--loo-spacing-xxl));
}

.section.-primary.-off-top::before {
  bottom: 0;
  top: auto;
}

.section.-secondary {
  margin: var(--loo-page-offset) 0;
  padding-bottom: var(--loo-content-element-margin);
  padding-top: var(--loo-content-element-margin);
}

.section.-secondary::before {
  background: var(--loo-color-secondary, #6e7d75);
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

.section.-secondary:not(.-off-bot):not(.-off-top) {
  color: var(--loo-color-secondary-contrast, #fff);
}

.section.-secondary.-off-top::before, .section.-secondary.-off-bot::before {
  height: calc(100% - var(--loo-spacing-xxl));
}

.section.-secondary.-off-top::before {
  bottom: 0;
  top: auto;
}

.section.-tertiary {
  margin: var(--loo-page-offset) 0;
  padding-bottom: var(--loo-content-element-margin);
  padding-top: var(--loo-content-element-margin);
}

.section.-tertiary::before {
  background: var(--loo-color-tertiary, #eba966);
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

.section.-tertiary:not(.-off-bot):not(.-off-top) {
  color: var(--loo-color-tertiary-contrast, #000);
}

.section.-tertiary.-off-top::before, .section.-tertiary.-off-bot::before {
  height: calc(100% - var(--loo-spacing-xxl));
}

.section.-tertiary.-off-top::before {
  bottom: 0;
  top: auto;
}

.section.-info {
  margin: var(--loo-page-offset) 0;
  padding-bottom: var(--loo-content-element-margin);
  padding-top: var(--loo-content-element-margin);
}

.section.-info::before {
  background: var(--loo-color-info, #5c9da9);
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

.section.-info:not(.-off-bot):not(.-off-top) {
  color: var(--loo-color-info-contrast, #000);
}

.section.-info.-off-top::before, .section.-info.-off-bot::before {
  height: calc(100% - var(--loo-spacing-xxl));
}

.section.-info.-off-top::before {
  bottom: 0;
  top: auto;
}

.section.-success {
  margin: var(--loo-page-offset) 0;
  padding-bottom: var(--loo-content-element-margin);
  padding-top: var(--loo-content-element-margin);
}

.section.-success::before {
  background: var(--loo-color-success, #46a783);
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

.section.-success:not(.-off-bot):not(.-off-top) {
  color: var(--loo-color-success-contrast, #fff);
}

.section.-success.-off-top::before, .section.-success.-off-bot::before {
  height: calc(100% - var(--loo-spacing-xxl));
}

.section.-success.-off-top::before {
  bottom: 0;
  top: auto;
}

.section.-warning {
  margin: var(--loo-page-offset) 0;
  padding-bottom: var(--loo-content-element-margin);
  padding-top: var(--loo-content-element-margin);
}

.section.-warning::before {
  background: var(--loo-color-warning, #eba83c);
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

.section.-warning:not(.-off-bot):not(.-off-top) {
  color: var(--loo-color-warning-contrast, #000);
}

.section.-warning.-off-top::before, .section.-warning.-off-bot::before {
  height: calc(100% - var(--loo-spacing-xxl));
}

.section.-warning.-off-top::before {
  bottom: 0;
  top: auto;
}

.section.-danger {
  margin: var(--loo-page-offset) 0;
  padding-bottom: var(--loo-content-element-margin);
  padding-top: var(--loo-content-element-margin);
}

.section.-danger::before {
  background: var(--loo-color-danger, #cf5c66);
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

.section.-danger:not(.-off-bot):not(.-off-top) {
  color: var(--loo-color-danger-contrast, #fff);
}

.section.-danger.-off-top::before, .section.-danger.-off-bot::before {
  height: calc(100% - var(--loo-spacing-xxl));
}

.section.-danger.-off-top::before {
  bottom: 0;
  top: auto;
}

body._loading .section-pagetitle h1::before, body._loading .section-pagetitle h1::after {
  max-width: 0;
}

.section-columns {
  display: flex;
  flex-wrap: wrap;
  gap: var(--loo-section-columns-gap, var(--loo-spacing));
}

.section-columns__column {
  --_sccl-width: 100%;
  flex-basis: var(--_sccl-width);
  width: var(--_sccl-width);
}

.section-columns__column > * {
  margin-bottom: 0;
  margin-top: 0;
}

.section-columns__column > * + * {
  margin-top: var(--loo-content-element-margin);
}

@media (min-width: 768px) {
  .section-columns {
    --loo-section-columns-gap: var(--loo-spacing-l);
    flex-wrap: nowrap;
  }
  .section-columns[data-columns="2"] .section-columns__column { /* stylelint-disable-line string-quotes */
    --_sccl-width: calc(50% - var(--loo-section-columns-gap) / 2);
  }
}
@media (min-width: 992px) {
  .section-columns {
    --loo-section-columns-gap: var(--loo-spacing-xl);
  }
}
.content > * {
  margin-bottom: 0;
  margin-top: 0;
}

.content > *:not(:first-child) {
  margin-top: var(--loo-block-element-margin);
}

.content > section:not(:first-child),
.content > .ce:not(:first-child) {
  margin-top: var(--loo-content-element-margin);
}

.sidebar {
  --loo-sidebar-gap: var(--loo-block-element-margin);
}

.sidebar:empty {
  display: none;
}

.sidebar-item {
  background-color: var(--loo-color-black-lighten);
  padding: var(--loo-sidebar-item-padding, var(--loo-spacing));
}

@media (min-width: 992px) {
  .sidebar-item {
    --loo-sidebar-item-padding: var(--loo-spacing-l);
  }
}
.sidebar-item > * {
  margin: 0;
}

.sidebar-item + .sidebar-item {
  margin-top: var(--loo-sidebar-gap);
}

.section-sidebar {
  --loo-section-sidebar-gap: var(--loo-spacing);
  --loo-section-sidebar-sidebar-width: 33%;
  display: flex;
  flex-wrap: wrap;
  gap: var(--loo-section-sidebar-gap);
}

.section-sidebar > .content {
  flex-basis: 100%;
  flex-grow: 666;
  min-width: 100%;
  order: 1;
}

.section-sidebar > .sidebar {
  flex-basis: 100%;
  flex-grow: 1;
  min-width: 0;
  order: 2;
  width: 100%;
}

@media (min-width: 768px) {
  .section-sidebar {
    --loo-section-sidebar-gap: var(--loo-spacing-l);
    --_section-sidebar-width: calc(var(--loo-section-sidebar-sidebar-width) + var(--loo-section-sidebar-gap));
    align-items: flex-start;
    flex-wrap: nowrap;
  }
  .section-sidebar > .content,
  .section-sidebar > .sidebar {
    position: -webkit-sticky;
    position: sticky;
    top: var(--global-scroll-top-offset);
  }
  .section-sidebar > .content {
    flex-basis: calc(100% - var(--_section-sidebar-width));
    min-width: calc(100% - var(--_section-sidebar-width));
  }
  .section-sidebar > .sidebar {
    flex-basis: var(--_section-sidebar-width);
    width: var(--_section-sidebar-width);
  }
}
@media (min-width: 992px) {
  .section-sidebar {
    --loo-section-sidebar-gap: var(--loo-spacing-xl);
  }
}
.page-jumplist {
  --loolabsh-jumplist-background-color: hsl(var(--loo-color-black-h), var(--loo-color-black-s), 97%);
  --loolabsh-jumplist-padding-x: var(--loo-page-offset);
  --loolabsh-jumplist-link-background-color-hover: hsl(var(--loo-color-black-h), var(--loo-color-black-s), 95%);
  --loolabsh-jumplist-link-background-color-active: transparent;
  --loolabsh-jumplist-link-color-hover: var(--loo-body-color);
  --loolabsh-jumplist-link-color-active: var(--loo-color-primary);
  --loolabsh-jumplist-link-padding-x: var(--loo-spacing-s);
  --loolabsh-jumplist-link-padding-y: 0;
  border-bottom: 1px solid hsl(var(--loo-color-black-h), var(--loo-color-black-s), 90%);
  height: 2.5rem;
  position: -webkit-sticky;
  position: sticky;
  top: var(--global-scroll-top-offset, 0);
  z-index: calc(var(--loo-zindex-page-footer) - 1);
}
.page-jumplist .jumplist__container {
  height: 100%;
  text-align: center;
}
.page-jumplist .jumplist-menu {
  display: flex;
  flex-direction: row;
  height: 100%;
  justify-content: center;
}
.page-jumplist .jumplist-menu__link {
  display: inline-flex;
}
.page-jumplist .jumplist-menu__link > * {
  align-self: center;
}
.page-jumplist:not(:empty) {
  --loo-scrollbar-track-color: transparent;
  --loo-scrollbar-size: 1px;
}
.page-jumplist:not(:empty)::-webkit-scrollbar {
  height: var(--loo-scrollbar-size, 6px);
  width: var(--loo-scrollbar-size, 6px);
}
.page-jumplist:not(:empty)::-webkit-scrollbar-thumb {
  background: var(--loo-scrollbar-color, #000);
}
.page-jumplist:not(:empty)::-webkit-scrollbar-track {
  background: var(--loo-scrollbar-track-color, #fff);
}
.page-jumplist:not(:empty) {
  scrollbar-face-color: var(--loo-scrollbar-color, #000);
  scrollbar-track-color: var(--loo-scrollbar-track-color, #fff);
}
.page-jumplist:not(:empty) + .section {
  border-top: 0 none;
}
@media (min-width: 992px) {
  .page-jumplist {
    --loolabsh-jumplist-menu-gap: var(--loo-spacing-s);
    height: 3.5rem;
  }
}

.page-main > .breadcrumb {
  --loolabsh-breadcrumb-color: hsl(var(--loo-color-black-h), var(--loo-color-black-s), 60%);
  --loolabsh-breadcrumb-color-hover: var(--loo-color-black);
  --loolabsh-breadcrumb-font-size: var(--loo-font-size-xxs);
  --loolabsh-breadcrumb-gap-x: 1em;
  --loolabsh-breadcrumb-padding-x: var(--loo-page-offset);
  --loolabsh-breadcrumb-padding-y: var(--loo-spacing-s);
}
@media (max-width: 1199px) {
  .page-main > .breadcrumb {
    display: none;
  }
}

/**
 * Überschriftselektoren zusammenstellen<br/>
 *
 * @example scss
 *   $var : heading-selectors();
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(1, 6, false);
 *   // = h1, h2, h3, h4, h5, h6
 *
 *   $var : heading-selectors(3, 4);
 *   // = h3, .h3, h4, .h4
 *
 *   // Abfangen von nicht korrekten Angaben (`< 1`, `> 6`).
 *   $var : heading-selectors(0, 0);
 *   $var : heading-selectors(-1, 0);
 *   $var : heading-selectors(7, -15);
 *   // = h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6
 *
 *   $var : heading-selectors(0, 2);
 *   // = h1, .h1, h2, .h2
 *
 *   // Vertauschte Werte.
 *   $var : heading-selectors(3, 1);
 *   // = h3, .h3, h4, .h4, h5, .h5, h6, .h6
 */
/**
 * Replace `$search` with `$replace` in `$string`
 */
/**
 * SVG-XML-String kodieren
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : strip-unit(16px);
 *   // = 16
 */
/**
 * Einheit eines Wertes entfernen.
 *
 * @example
 *   $var : get-unit(16px);
 *   // = px
 */
/**
 * Prüft ob `$val` null ist.
 *
 * @example scss
 *   $var : is-null(null);
 *   // = true
 *
 *   $var : is-null(0);
 *   // = false
 */
/**
 * Prüft ob `$val` leer ist.
 *
 * @example scss
 *   $var : is-empty();
 *   // = true
 *
 *   $var : is-empty('');
 *   // = true
 *
 *   $var : is-empty('foo');
 *   // = false
 */
/**
 * Prüft ob `$val` numerisch ist.
 *
 * @example scss
 *   $var : is-numeric(1);
 *   // = true
 *
 *   $var : is-numeric('2');
 *   // = false
 *
 *   $var : is-numeric(3rem);
 *   // = false
 */
/**
 * Prüft ob `$val` boolean ist.
 *
 * @example scss
 *   $var : is-bool(true);
 *   // = true
 *
 *   $var : is-bool(false);
 *   // = false
 *
 *   $var : is-bool(1);
 *   // = true
 *
 *   $var : is-bool(0);
 *   // = false
 *
 *   $var : is-bool(null);
 *   // = false
 */
/**
 * Prüft ob `$val` ein String ist.
 *
 * @example scss
 *   $var : is-string(foo);
 *   // = true
 *
 *   $var : is-string('bar');
 *   // = true
 *
 *   $var : is-string(0);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Liste ist.
 *
 * @example scss
 *   $var : is-list(a b c d);
 *   // = true
 *
 *   $var : is-list(lorem, ipsum);
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Prüft ob `$val` eine Map ist.
 *
 * @example scss
 *   $var : is-map((a: b));
 *   // = true
 *
 *   $var : is-list(foo);
 *   // = false
 */
/**
 * Farbton (Hue) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-hue(#ce776f);
 *   // = 232
 */
/**
 * Sättigung (Saturation) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-saturation(#ce776f);
 *   // = 100%
 */
/**
 * Helligkeit (Lightness) eines Hexwertes zurückgeben.
 *
 * @example
 *   get-lightness(#ce776f);
 *   // = 69%
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsl()` zu einer realen
 * `hsl()`-Angabe.
 *
 * @example
 *   hsl(232, 100%, 69%);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(232, 100, 69);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(#ce776f);
 *   // = hsl(232, 100%, 69%)
 *
 *   hsl(var(--color-hue), 100%, 69%);
 *   // = hsl(var(--color-hue), 100%, 69%)
 *
 *   hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsl(var(--color-hue), var(--color-saturation), var(--color-lightness))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `hsla()` zu einer realen
 * `hsla()`-Angabe.
 *
 * @example
 *   hsla(232, 100%, 69%, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(232, 100, 69, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f, 0.75);
 *   // = hsla(232, 100%, 69%, 0.75)
 *
 *   hsla(#ce776f);
 *   // = hsla(232, 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), 100%, 69%);
 *   // = hsla(var(--color-hue), 100%, 69%, 1)
 *
 *   hsla(var(--color-hue), var(--color-saturation), var(--color-lightness));
 *   // = hsla(var(--color-hue), var(--color-saturation), var(--color-lightness), 1)
 *
 *   hsla(#ce776f, var(--opacity));
 *   // = hsla(232, 100%, 69%, var(--opacity))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgb()` zu einer realen
 * `rgb()`-Angabe.
 *
 * @example
 *   rgb(97, 118, 255);
 *   // = rgb(97, 118, 255)
 *
 *   rgb(#ce776f);
 *   // = rgb(97, 118, 255)
 *
 *   // `--color : 97, 118, 255;`
 *   rgb(var(--color));
 *   // = rgb(var(--color))
 */
/**
 * Überschreiben der SCSS-Konvertierungsfunktion `rgba()` zu einer realen
 * `rgba()`-Angabe.
 *
 * @example
 *   rgba(97, 118, 255, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(97, 118, 255);
 *   // = rgba(97, 118, 255, 1)
 *
 *   rgba(#ce776f, 0.75);
 *   // = rgba(97, 118, 255, 0.75)
 *
 *   rgba(#ce776f);
 *   // = rgba(97, 118, 255, 1)
 *
 *   // `--color : 97, 118, 255;`
 *   rgba(var(--color));
 *   // = rgba(var(--color), 1)
 *
 *   // `--color : 97, 118, 255;`
 *   // `--opcity : 0.75;`
 *   rgba(var(--color), var(--opacity));
 *   // = rgba(var(--color), var(--opacity))
 */
/**
 * Minimale Breakpointweite.<br/>
 * <small>_Null für den kleinsten (ersten) Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-min('xs');
 *   // = 420px
 */
/**
 * Maximale Breakpointweite.<br/>
 * <small>_Null für den größten (letzten) Breakpoint. Der Maximalwert wird als Minimum des nächsten Breakpointwertes minus 1px berechnet._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-max('xs');
 *   // = 575px
 */
/**
 * Name des nächsten Breakpoints.<br/>
 * <small>_Null für den letzten Breakpoint._</small>
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   $var : breakpoint-next('xs');
 *   // = s
 *
 *   $var : breakpoint-next('s');
 *   // = m
 */
/**
 * Anwendung von Definitionen (`@content`) ab dem Breakpoint `$name` und höher
 * (mobile first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-up('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) ab der Maximalbreite des Breakpoint
 * `$name` und kleiner (desktop first).
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-down('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Shortcut-Funktion für `media-breakpoint-up()` und `media-breakpoint-down()`.
 */
/**
 * Anwendung von Definitionen (`@content`) zwischen Minimumbreite `$lower` und
 * Maximumbreite `$upper`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-between('xs', 'm') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width : 420px) and (max-width : 991px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Anwendung von Definitionen (`@content`) nur innerhalb der Minimum- und
 * Maxiamlbreite des Breakpoints `$name`.
 *
 * @example scss
 *   $breakpoints : (
 *     'xxs' : 0,
 *     'xs'  : 420px,
 *     's'   : 576px,
 *     'm'   : 768px,
 *     'l'   : 992px
 *   );
 *
 *   .container {
 *     background : #fff;
 *
 *     @include media-breakpoint-only('s') {
 *       background : #ccc;
 *     }
 *   }
 *
 * @example css - Result
 *   .container {
 *     background : #fff;
 *   }
 *
 *   @media (min-width: 576px) and (max-width: 767px) {
 *     .container {
 *       background : #ccc;
 *     }
 *   }
 */
/**
 * Webfonts mit `@font-face` integrieren.
 *
 * Bzgl. moderner Browser (Stand Anfang 2019) wird normalerweise nur `woff2` und
 * `woff` benötigt. Eine Prüfung auf das Schriftformat bzgl. einer Erweiterung
 * der URL wird nur für `eot` und `ttf` durchgeführt!
 *
 * `woff2` moderne Browser
 * `woff` IE 11
 * `eot` IE6-IE8
 * `ttf` Safari, Android, iOS
 *
 * @example scss
 *   @include font-face(
 *     'Example-Regular',
 *     'example/',
 *     (
 *       woff2 : 'example-regular.woff2',
 *       woff  : 'example-regular.woff',
 *       eot   : 'example-regular.eot',
 *       ttf   : 'example-regular.ttf'
 *     )
 *   );
 *
 * @example css - Result
 *   @font-face {
 *     font-family : 'Example-Regular';
 *     font-display: swap;
 *     src         : url('../example/example-regular.woff2') format('woff2'),
 *                   url('../example/example-regular.woff') format('woff'),
 *                   url('../example/example-regular.eot?#iefix') format('embedded-opentype'),
 *                   url('../example/example-regular.ttf') format('truetype');
 *   }
 */
/**
 * Generieren von Selektoren bzgl. Validierungsstatus
 */
/* stylelint-disable-line scss/dollar-variable-pattern */
.page-search {
  --_pase-duration: calc(var(--global-duration-multiplier, 1) * var(--loo-transition-expand));
  background-color: var(--loo-color-secondary);
  display: block;
  padding: 0;
  pointer-events: none;
  position: fixed;
  top: var(--global-scroll-top-offset);
  transform: translateY(-100%);
  transition-duration: var(--_pase-duration);
  transition-property: transform;
  transition-timing-function: ease-in;
  width: 100%;
  z-index: var(--loo-zindex-page-search);
}
.page-search .search-box {
  margin: 0 auto;
  width: 100%;
}
.page-search .search-box__form {
  --loolabsh-input-height: 3rem;
}
.page-search .search-box__input {
  --_accent-color: hsl(var(--loo-color-white-h), 85%, 0%);
  --loolabsh-form-control-background-color: transparent;
  --loolabsh-form-control-background-color-hover: var(--_accent-color);
  --loolabsh-form-control-background-color-focus: var(--_accent-color);
  --loolabsh-form-control-border-color: transparent;
  --loolabsh-form-control-border-color-hover: transparent;
  --loolabsh-form-control-border-color-focus: transparent;
  --loolabsh-form-control-color: var(--loo-color-white);
  --loolabsh-form-control-color-hover: var(--loo-color-white);
  --loolabsh-form-control-color-focus: var(--loo-color-white);
  --loolabsh-form-control-placeholder-color: hsl(var(--loo-color-white-h), var(--loo-color-white-s), 35%);
  --loolabsh-form-control-padding-color: var(--loo-page-offset);
  text-align: center;
}
.page-search .search-box__submit {
  display: none;
}
.page-search .was-validated .search-box__input:invalid {
  --_foco-border-color: transparent;
}
.-page-search-open .page-search {
  pointer-events: all;
  transform: translateY(0%);
  transition-timing-function: ease-out;
}

/* stylelint-disable-line scss/dollar-variable-pattern */
[data-ratio]:not([data-ratio=""]) {
  display: block;
  overflow: hidden;
  padding: 0;
  position: relative;
  width: 100%;
}
[data-ratio]:not([data-ratio=""])::before {
  content: ""; /* stylelint-disable-line string-quotes */
  display: block;
  padding-top: var(--ratio, 100%);
}
[data-ratio]:not([data-ratio=""]) > * {
  border: 0;
  height: auto;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
}
[data-ratio]:not([data-ratio=""]) > img {
  height: 100%;
  max-width: none;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
}
[data-ratio]:not([data-ratio=""]) > video,
[data-ratio]:not([data-ratio=""]) > iframe,
[data-ratio]:not([data-ratio=""]) > div {
  height: 100%;
}

[data-ratio="16x9"] {
  --ratio: var(--loo-ratio-16x9, calc(9 / 16 * 100%));
}

[data-ratio="4x3"] {
  --ratio: var(--loo-ratio-4x3, calc(3 / 4 * 100%));
}

[data-ratio="3x4"] {
  --ratio: var(--loo-ratio-3x4, calc(4 / 3 * 100%));
}

[data-ratio="3x2"] {
  --ratio: var(--loo-ratio-3x2, calc(2 / 3 * 100%));
}

[data-ratio="2x3"] {
  --ratio: var(--loo-ratio-2x3, calc(3 / 2 * 100%));
}

[data-ratio="1x1"] {
  --ratio: var(--loo-ratio-1x1, calc(1 / 1 * 100%));
}

._clearfix::after {
  clear: both;
  content: ""; /* stylelint-disable-line string-quotes */
  display: block;
}

._hidden {
  display: none !important; /* stylelint-disable-line declaration-no-important */
}

._scroll-lock {
  overflow: hidden !important; /* stylelint-disable-line declaration-no-important */
}

._selectable-all {
  -webkit-user-select: all;
     -moz-user-select: all;
          user-select: all;
}

._selectable-none {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

._stretched-link::after {
  content: ""; /* stylelint-disable-line string-quotes */
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

._visually-hidden,
._visually-hidden-focusable:not(:focus):not(:focus-within) {
  /* stylelint-disable declaration-no-important */
  border: 0 !important;
  clip: rect(0, 0, 0, 0) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  white-space: nowrap !important;
  width: 1px !important;
  /* stylelint-enable declaration-no-important */
}
/*# sourceMappingURL=main.css.map */