@charset "UTF-8";
/**
* Die get-map Funktion ermöglicht das einfache auslesen von
* verschachtelten SCSS Maps.
*
* map-deep-get($MAPNAME, MAPKEY, MAPVALUE);
*/
/**
 *
 * mq() ist ein Sass Mixin der hilft, media queries zu generieren.
 * Aus Pixelwerten werden em-based media queries und es gibt einen
 * Fallback für ältere Browser.
 *
 * Dokumentation:         https://github.com/sass-mq/sass-mq
 *
 */
/**
 * Aus den Einträgen aus der theme.json werden SASS Maps erstellt, die für
 * weitere Funktionen zur Verfügung stehen.
 */
/**
 * Diese Variablen können überall als Shortcut eingesetzt werden, sind
 * aber auch dazu da, die default UIKit Variablen zu überschreiben.
 *
 * [1]  Die Funktion palette übergibt ein Attribut, welches einer Farbe aus
 *      der theme.json color palette entsprechen muss.
 *
 * [2]  Für jedes Object in der Palette wird eine Abfrage gestartet.
 *
 * [3]  Das übergebene Attribut wird mit dem slug in der laufenden Abfrage
 *      verglichen.
 *
 * [4]  Wenn die beiden Werte übereinstimmen wird der entsprechende Farbwert
 *      übergeben.
 */
/**
 * Verwendet für Abstände wird die vr() Funktion von Typi. Diese generiert
 * aus dem Null key in der base font-map den vertikalen Rhythmus.
 * Angegeben wird der Wert asl vr(x) wobei 1x einer Baseline entspricht.
 *
 * 1 Baseline = Null Wert * Line Height Null Wert (Bsp.: 18px * 1.4)
 *
 * Dokumentation:     https://github.com/zellwk/typi
 */
/**
 *
 * [1]  Die Funktion font übergibt ein Attribut, welches einer Schriftart
 *      aus der theme.json entsprechen muss.
 *
 * [2]  Für jedes Object in der Map wird eine Abfrage gestartet.
 *
 * [3]  Das übergebene Attribut wird mit dem slug in der laufenden Abfrage
 *      verglichen.
 *
 * [4]  Wenn die beiden Werte übereinstimmen wird der entsprechende Font
 *      übergeben.
 */
/**
 * Das pseudo Mixin erlaubt das einfache erstellen von pseudo-Elementen.
 * Es kann mittels @include in Elemente eingebunden werden und akzeptiert
 * folgende Paramter:
 *    - $loc      = location (before [default] oder after)
 *    - $content  = content der mittels CSS generiert werden soll
 *    - $pos      = position (absolute [default] oder relative)
 *
 * Bsp.: @include pseudo($loc: after, $content: 'hallo', $pos: relative) { background: red; }
 *
 * Das Mixin kann durch eigene erweiternde Eigenschaften ergänzt werden.
 */
/**
 * Das paddingPage Mixin erzeugt einheitliche Innenabstände. Dabei werden
 * aus der theme.json des Child Themes Werte geholt.
 */
/**
 * Das reset Mixin entfernt default styles von Elementen.
 */
/**
 * Die svgColor Funktion wandelt Hex Farben so um, dass sie in bg-img
 * SVGs als Fill oder Stroke genutzt werden können.
 */
/**
 *
 * Typi ist eine SCSS Funktion, die Schriftgrößen sehr einfach
 * responsiv macht.
 * Typi greift auf die Breakpoints zurück, die in der
 * ../variables/breakpoints.scss $breakpoints map definiert wurden.
 *
 * Dokumentation:         https://github.com/zellwk
 * Typescale Generator:   https://www.modularscale.com
 *
 */
/**
 *
 * Um die Werte aus Adobe XD nutzen zu können, sind Mixins
 * notwendig. Diese rechnen die statischen in dynamische
 * Werte um.
 *
 */
/**
 * Das margin-bottom Mixin erzeugt automatisch einen margin-bottom Wert
 * auf Basis der typi Definitionen. Dieser Wert wird in em angegeben, um
 * sich dynamisch mit der Schriftgröße zu verändern.
 *
 * Als Argument muss der $typi Selector der gewünschten Schriftgröße
 * übergeben werden.
 *
 * [1]  Die $baseline ist das Produkt aus der base font-size und line-height.
 *      Sie ist die Grundlage für alle errechneten Abstände.
 *
 * [2]  Die $size ist die Schriftgröße aus der $typi Map des übergebenen
 *      $selector.
 *
 * [3]  Für jeden Media Query in der $breakpoints Map (breakpoints.scss)
 *      wird der entsprechende Wert aus der $typi Map verwendet.
 *
 * [4]  Ab dem medium Breakpoint werden dessen Werte als Baseline genutzt.
 */
@media (max-width: 59.99em) {
  .jed-block .uk-marker {
    display: none;
  }
}

.jed-drop__content {
  background-color: #FFFFFF;
  padding: 1rem 1.5rem;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.16);
  color: #464646;
  font-size: .9rem;
}

.uk-marker + .uk-drop .jed-drop__content {
  transform: translate(20px, -20px);
}

/* ========================================================================
   Component: Marker
 ========================================================================== */
/*
 * Addopts `uk-icon`
 */
.uk-marker {
  padding: 5px;
  background: #1F3460;
  color: #ffffff;
  transition: background-color .3s ease-in-out;
  width: 44px;
  height: 44px;
  box-sizing: border-box;
  text-align: center;
  font-size: 2.5rem;
  line-height: 35px;
  padding: 0 0 0 1px;
  border-radius: 50px;
}

.uk-marker.jed-marker__blue {
  background-color: #1F3460;
}

.uk-marker.jed-marker--yellow {
  background: #FFCB04;
}

/* Hover + Focus */
.uk-marker:hover,
.uk-marker:focus {
  color: #ffffff;
  outline: none;
  background-color: #007CBD;
  text-decoration: none;
}

/* ========================================================================
   Component: Drop
 ========================================================================== */
/*
 * 1. Hide by default
 * 2. Set position
 * 3. Set a default width
 */
.uk-drop {
  /* 1 */
  display: none;
  /* 2 */
  position: absolute;
  z-index: 1020;
  /* 3 */
  box-sizing: border-box;
  width: 300px;
}

/* Show */
.uk-drop.uk-open {
  display: block;
}

/* Direction / Alignment modifiers
 ========================================================================== */
/* Direction */
[class*='uk-drop-top'] {
  margin-top: -20px;
}

[class*='uk-drop-bottom'] {
  margin-top: 20px;
}

[class*='uk-drop-left'] {
  margin-left: -20px;
}

[class*='uk-drop-right'] {
  margin-left: 20px;
}

/* Grid modifiers
 ========================================================================== */
.uk-drop-stack .uk-drop-grid > * {
  width: 100% !important;
}