@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: 99.99em) {
  .jed-overlayGrid {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

@media (max-width: 59.99em) {
  .jed-overlayGrid {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

.jed-overlayGrid__item.uk-active .uk-overlay {
  opacity: 1;
}

.jed-overlayGrid__item.uk-active .jed-overlayTeaser__title {
  opacity: 0;
}

.jed-overlayGrid__item.uk-active .jed-overlayTeaser__toggle {
  background-color: #FFFFFF;
  color: #007CBD;
}

.jed-overlayGrid__item.uk-active .jed-overlayTeaser__toggle::before {
  background-image: url("data:image/svg+xml;charset=utf8,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'><path fill='%23007CBD' d='M25.3,16H4.7c-0.6,0-1-0.4-1-1s0.4-1,1-1h20.5c0.6,0,1,0.4,1,1S25.8,16,25.3,16z'/></svg>");
}

.jed-overlayGrid__image {
  object-fit: cover;
  object-position: center center;
  width: 100%;
}

.jed-overlayGrid picture {
  display: flex;
  width: 100%;
  flex-shrink: 0;
}

.jed-overlayGrid picture img {
  object-fit: cover;
  object-position: center center;
  width: 100%;
}

.jed-overlayGrid .jed-overlayTeaser__title {
  display: block;
  position: absolute;
  top: 1.5rem;
  left: 2rem;
  z-index: 1;
  color: #1F3460;
}

@media screen and (max-width: 960px), screen and (pointer: coarse) {
  .jed-overlayGrid .jed-overlayTeaser__title {
    margin: 0;
    display: none;
  }
}

.jed-overlayGrid .jed-overlayTeaser__toggle.uk-position-bottom-center {
  bottom: 2rem;
  background-color: rgba(255, 255, 255, 0.33);
}

.jed-overlayGrid .jed-overlayTeaser__content {
  position: relative;
  max-width: 100%;
  display: flex;
}

@media (max-width: 59.99em) {
  .jed-overlayGrid .jed-overlayTeaser__content {
    flex-basis: 100%;
  }
}

@media screen and (max-width: 960px), (pointer: coarse) {
  .jed-overlayGrid .jed-overlayTeaser__content {
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.16);
  }
}

@media (min-width: 75em) {
  .jed-overlayGrid .jed-overlayTeaser__content.has-responsive-image > picture:first-of-type {
    display: none;
  }
}

@media (max-width: 74.99em) {
  .jed-overlayGrid .jed-overlayTeaser__content.has-responsive-image > picture:last-of-type {
    display: none;
  }
}

.jed-overlayGrid:not([class*="uk-child-width"]) {
  flex-flow: column wrap;
}

@media (min-width: 40em) {
  .jed-overlayGrid:not([class*="uk-child-width"]) {
    flex-flow: row wrap;
  }
}

.jed-overlayGrid:not([class*="uk-child-width"]) .jed-overlayGrid__item {
  box-sizing: border-box;
}

@media (max-width: 74.99em) {
  .jed-overlayGrid:not([class*="uk-child-width"]) .jed-overlayGrid__item {
    width: 50% !important;
  }
}

@media (max-width: 39.99em) {
  .jed-overlayGrid:not([class*="uk-child-width"]) .jed-overlayGrid__item {
    width: 100% !important;
  }
}

@media screen and (max-width: 960px), screen and (pointer: coarse) {
  .jed-overlayGrid.jed-overlayGrid__responsive--accordion .jed-overlayGrid__toggle {
    display: none;
  }
}

.jed-overlayGrid .uk-accordion {
  background-color: #1F3460;
  color: #ffffff;
  padding: 1rem 1.5rem;
  display: none;
}

@media screen and (max-width: 960px), screen and (pointer: coarse) {
  .jed-overlayGrid .uk-accordion {
    display: block;
  }
}

.jed-overlayGrid .uk-accordion-title {
  font-weight: 600;
  color: #ffffff;
  position: relative;
}

.jed-overlayGrid .uk-accordion-title::after {
  content: "";
  position: absolute;
  display: block;
  width: 8px;
  height: 22px;
  top: 3px;
  right: 0;
  background-image: url("data:image/svg+xml;charset=utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='22' viewBox='0 0 8 22'><path fill='%23ffffff' d='M0.8,22c-0.1,0-0.3,0-0.4-0.1c-0.4-0.2-0.5-0.7-0.2-1l6.1-10L0.2,1.2C0,0.8,0.1,0.4,0.4,0.2c0.4-0.2,0.8-0.1,1,0.2l6.4,10c0.2,0.2,0.2,0.5,0,0.8L1.5,21.6C1.3,21.9,1.1,22,0.8,22z'/></svg>");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center right;
  transition: transform .3s ease-out;
}

.jed-overlayGrid .uk-accordion-title:hover, .jed-overlayGrid .uk-accordion-title:focus {
  color: #ffffff;
}

.jed-overlayGrid .uk-accordion .uk-open .uk-accordion-title::after {
  transform: rotate(90deg);
  background-position: top center;
}

.jed-overlayGrid__modal .uk-modal-title {
  padding-right: 80px;
}

[id*="modal"].uk-open {
  display: flex;
}

.uk-overlay-secondary {
  background-color: #007CBD;
}

.wp-block-post-template .jed-overlayTeaser picture {
  aspect-ratio: 16 / 11;
}

.jed-overlayTeaser__content picture {
  display: flex;
}

.jed-overlayTeaser__content picture img {
  object-fit: cover;
}

.jed-overlayTeaser__content .uk-overlay-secondary {
  padding: 70px 28px 70px 1.5rem;
}

.jed-overlayTeaser__content.uk-transition-toggle:hover .jed-overlayTeaser__toggle {
  background-color: #FFFFFF;
}

.jed-overlayTeaser__content.uk-transition-toggle:hover .jed-overlayTeaser__toggle::before {
  background-image: url("data:image/svg+xml;charset=utf8,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'><path fill='%23007CBD' d='M15.1,30c-0.4,0-0.7-0.3-0.7-0.7V0.7c0-0.4,0.3-0.7,0.7-0.7s0.7,0.3,0.7,0.7v28.6C15.8,29.7,15.3,30,15.1,30z'/><path fill='%23007CBD' d='M29.3,15.8H0.7c-0.4,0-0.7-0.4-0.7-0.7c0-0.3,0.3-0.7,0.7-0.7h28.6c0.4,0,0.7,0.3,0.7,0.7S29.7,15.8,29.3,15.8z'/></svg>");
  transform: rotate(180deg);
}

.jed-overlayTeaser__toggle {
  z-index: 4;
  overflow: hidden;
  display: block;
  width: 60px;
  height: 60px;
  background-color: #007CBD;
}

.jed-overlayTeaser__toggle::before {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  aspect-ratio: 1;
  background-image: url("data:image/svg+xml;charset=utf8,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'><path fill='%23ffffff' d='M15.1,30c-0.4,0-0.7-0.3-0.7-0.7V0.7c0-0.4,0.3-0.7,0.7-0.7s0.7,0.3,0.7,0.7v28.6C15.8,29.7,15.3,30,15.1,30z'/><path fill='%23ffffff' d='M29.3,15.8H0.7c-0.4,0-0.7-0.4-0.7-0.7c0-0.3,0.3-0.7,0.7-0.7h28.6c0.4,0,0.7,0.3,0.7,0.7S29.7,15.8,29.3,15.8z'/></svg>");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: center center;
  transition: transform .3s ease-out;
}

.jed-overlayTeaser__toggle:hover {
  cursor: pointer;
}

.jed-overlayTeaser__toggle:hover::before {
  transform: rotate(180deg);
}

.jed-overlayTeaser__text {
  max-height: 100%;
  padding-right: 1.5rem;
  color: #ffffff;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow-x: hidden;
  overflow-y: auto;
}

.jed-overlayTeaser__text::-webkit-scrollbar {
  width: 4px;
}

.jed-overlayTeaser__text::-webkit-scrollbar-track {
  background-color: rgba(0, 0, 0, 0.5);
}

.jed-overlayTeaser__text::-webkit-scrollbar-thumb {
  background-color: #FFFFFF;
}

.jed-overlayTeaser__crop {
  width: 100%;
  padding-top: 56.25%;
  display: flex;
  position: relative;
  overflow: hidden;
}

.jed-overlayTeaser__crop > * {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

/* ========================================================================
   Component: Accordion
 ========================================================================== */
.uk-accordion {
  padding: 0;
  list-style: none;
}

/* Item
 ========================================================================== */
.uk-accordion > :nth-child(n+2) {
  margin-top: 20px;
}

/* Title
 ========================================================================== */
.uk-accordion-title {
  display: block;
  font-size: 1.25rem;
  line-height: 1.4;
  color: #333;
}

/* Hover + Focus */
.uk-accordion-title:hover,
.uk-accordion-title:focus {
  color: #464646;
  text-decoration: none;
  outline: none;
}

/* Content
 ========================================================================== */
.uk-accordion-content {
  display: flow-root;
  margin-top: 20px;
}

/*
 * Remove margin from the last-child
 */
.uk-accordion-content > :last-child {
  margin-bottom: 0;
}

/* ========================================================================
   Component: Modal
 ========================================================================== */
/*
 * 1. Hide by default
 * 2. Set position
 * 3. Allow scrolling for the modal dialog
 * 4. Horizontal padding
 * 5. Mask the background page
 * 6. Fade-in transition
 */
.uk-modal {
  /* 1 */
  display: none;
  /* 2 */
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1010;
  /* 3 */
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  /* 4 */
  padding: 15px 15px;
  /* 5 */
  background: rgba(0, 0, 0, 0.6);
  /* 6 */
  opacity: 0;
  transition: opacity 0.15s linear;
}

/* Phone landscape and bigger */
@media (min-width: 640px) {
  .uk-modal {
    padding: 50px 30px;
  }
}

/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-modal {
    padding-left: 40px;
    padding-right: 40px;
  }
}

/*
 * Open
 */
.uk-modal.uk-open {
  opacity: 1;
}

/* Page
 ========================================================================== */
/*
 * Prevent scrollbars
 */
.uk-modal-page {
  overflow: hidden;
}

/* Dialog
 ========================================================================== */
/*
 * 1. Create position context for spinner and close button
 * 2. Dimensions
 * 3. Fix `max-width: 100%` not working in combination with flex and responsive images in IE11
 *    `!important` needed to overwrite `uk-width-auto`. See `#modal-media-image` in tests
 * 4. Style
 * 5. Slide-in transition
 */
.uk-modal-dialog {
  /* 1 */
  position: relative;
  /* 2 */
  box-sizing: border-box;
  margin: 0 auto;
  width: 600px;
  /* 3 */
  max-width: calc(100% - 0.01px) !important;
  /* 4 */
  background: #FFFFFF;
  /* 5 */
  opacity: 0;
  transform: translateY(-100px);
  transition: 0.3s linear;
  transition-property: opacity, transform;
  background: #007CBD;
  color: #ffffff;
  padding: 1.5rem;
}

/*
 * Open
 */
.uk-open > .uk-modal-dialog {
  opacity: 1;
  transform: translateY(0);
}

/* Size modifier
 ========================================================================== */
/*
 * Container size
 * Take the same size as the Container component
 */
.uk-modal-container .uk-modal-dialog {
  width: 1200px;
}

/*
 * Full size
 * 1. Remove padding and background from modal
 * 2. Reset all default declarations from modal dialog
 */
/* 1 */
.uk-modal-full {
  padding: 0;
  background: none;
}

/* 2 */
.uk-modal-full .uk-modal-dialog {
  margin: 0;
  width: 100%;
  max-width: 100%;
  transform: translateY(0);
}

/* Sections
 ========================================================================== */
.uk-modal-body {
  display: flow-root;
  padding: 30px 30px;
}

.uk-modal-header {
  display: flow-root;
  padding: 15px 30px;
  background: #F7F7F7;
}

.uk-modal-footer {
  display: flow-root;
  padding: 15px 30px;
  background: #F7F7F7;
}

/*
 * Remove margin from the last-child
 */
.uk-modal-body > :last-child,
.uk-modal-header > :last-child,
.uk-modal-footer > :last-child {
  margin-bottom: 0;
}

/* Title
 ========================================================================== */
.uk-modal-title {
  font-size: 2rem;
  line-height: 1.3;
  color: #ffffff;
}

/* Close
 * Adopts `uk-close`
 ========================================================================== */
[class*='uk-modal-close-'] {
  position: absolute;
  z-index: 1010;
  top: 10px;
  right: 10px;
  padding: 5px;
  background-color: #FFFFFF;
  border: none;
  width: 60px;
  height: 60px;
  top: 0;
  right: 0;
}

[class*='uk-modal-close-']::before {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  aspect-ratio: 1;
  background-image: url("data:image/svg+xml;charset=utf8,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'><path fill='%23007CBD' d='M25.3,16H4.7c-0.6,0-1-0.4-1-1s0.4-1,1-1h20.5c0.6,0,1,0.4,1,1S25.8,16,25.3,16z'/></svg>");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: center center;
  transition: transform .3s ease-out;
  top: 0;
  left: 0;
}

@supports not (aspect-ratio: 1/1) {
  [class*='uk-modal-close-']::before {
    height: 60px;
  }
}

/*
 * Remove margin from adjacent element
 */
[class*='uk-modal-close-']:first-child + * {
  margin-top: 0;
}

/*
 * Hover
 */
[class*='uk-modal-close-']:hover {
  cursor: pointer;
  background-color: #FFFFFF;
}

[class*='uk-modal-close-']:hover::before {
  transform: rotate(180deg);
}

/*
 * Default
 */
/*
 * Outside
 * 1. Prevent scrollbar on small devices
 */
.uk-modal-close-outside {
  top: 0;
  /* 1 */
  right: -5px;
  transform: translate(0, -100%);
  color: white;
}

.uk-modal-close-outside:hover {
  color: #ffffff;
}

/* Tablet landscape and bigger */
@media (min-width: 960px) {
  /* 1 */
  .uk-modal-close-outside {
    right: 0;
    transform: translate(100%, -100%);
  }
}

/*
 * Full
 */
/* ========================================================================
   Component: Overlay
 ========================================================================== */
.uk-overlay {
  padding: 30px 30px;
}

/*
 * Remove margin from the last-child
 */
.uk-overlay > :last-child {
  margin-bottom: 0;
}

/* Icon
 ========================================================================== */
/* Style modifiers
 ========================================================================== */
/*
 * Default
 */
.uk-overlay-default {
  background: rgba(255, 255, 255, 0.8);
  background: rgba(255, 255, 255, 0.7);
}

/*
 * Primary
 */
.uk-overlay-primary {
  background: rgba(0, 124, 189, 0.8);
}

