@charset "UTF-8";
/*------------------------------------*\
  #BASIC
\*------------------------------------*/
:root {
  --scroll-margin-top: 300px;
}

/**
 * Final main CSS file composed of separated Sass files. New created Sass files
 * need to be added here to have any effect.
 *
 * The order of the import directives is important. Changing the file order
 * within an import directive however should do no harm in most cases.
 *
 * We’re using the CSS Guidelines (https://cssguidelin.es/) in all CSS files for
 * “writing sane, manageable, scalable CSS”. For cases, that are not covered in
 * the CSS Guidelines, please consult the Sass Guidelines
 * (https://sass-guidelin.es/).
 *
 * The architecture stems from ITCSS (https://itcss.io/). Each layer is
 * documented below. The following article gives you a detailed explanation to
 * this approach:
 *
 * https://www.creativebloq.com/web-design/manage-large-css-projects-itcss-101517528
 */
/*! Flickity v2.2.2
https://flickity.metafizzy.co
---------------------------------------------- */
.flickity-enabled {
  position: relative;
}

.flickity-enabled:focus {
  outline: none;
}

.flickity-viewport {
  overflow: hidden;
  position: relative;
  height: 100%;
}

.flickity-slider {
  position: absolute;
  width: 100%;
  height: 100%;
}

/* draggable */
.flickity-enabled.is-draggable {
  -webkit-tap-highlight-color: transparent;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.flickity-enabled.is-draggable .flickity-viewport {
  cursor: move;
  cursor: -webkit-grab;
  cursor: grab;
}

.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

/* ---- flickity-button ---- */
.flickity-button {
  position: absolute;
  background: hsla(0, 0%, 100%, 0.75);
  border: none;
  color: #333;
}

.flickity-button:hover {
  background: white;
  cursor: pointer;
}

.flickity-button:focus {
  outline: none;
  box-shadow: 0 0 0 5px #19F;
}

.flickity-button:active {
  opacity: 0.6;
}

.flickity-button:disabled {
  opacity: 0.3;
  cursor: auto;
  /* prevent disabled button from capturing pointer up event. #716 */
  pointer-events: none;
}

.flickity-button-icon {
  fill: currentColor;
}

/* ---- previous/next buttons ---- */
.flickity-prev-next-button {
  top: 50%;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  /* vertically center */
  transform: translateY(-50%);
}

.flickity-prev-next-button.previous {
  left: 10px;
}

.flickity-prev-next-button.next {
  right: 10px;
}

/* right to left */
.flickity-rtl .flickity-prev-next-button.previous {
  left: auto;
  right: 10px;
}

.flickity-rtl .flickity-prev-next-button.next {
  right: auto;
  left: 10px;
}

.flickity-prev-next-button .flickity-button-icon {
  position: absolute;
  left: 20%;
  top: 20%;
  width: 60%;
  height: 60%;
}

/* ---- page dots ---- */
.flickity-page-dots {
  position: absolute;
  width: 100%;
  bottom: -25px;
  padding: 0;
  margin: 0;
  list-style: none;
  text-align: center;
  line-height: 1;
}

.flickity-rtl .flickity-page-dots {
  direction: rtl;
}

.flickity-page-dots .dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 0 8px;
  background: #333;
  border-radius: 50%;
  opacity: 0.25;
  cursor: pointer;
}

.flickity-page-dots .dot.is-selected {
  opacity: 1;
}

.tippy-box[data-animation=fade][data-state=hidden] {
  opacity: 0;
}

[data-tippy-root] {
  max-width: calc(100vw - 10px);
}

.tippy-box {
  position: relative;
  background-color: #333;
  color: #fff;
  border-radius: 4px;
  font-size: 14px;
  line-height: 1.4;
  outline: 0;
  transition-property: transform, visibility, opacity;
}

.tippy-box[data-placement^=top] > .tippy-arrow {
  bottom: 0;
}

.tippy-box[data-placement^=top] > .tippy-arrow:before {
  bottom: -7px;
  left: 0;
  border-width: 8px 8px 0;
  border-top-color: initial;
  transform-origin: center top;
}

.tippy-box[data-placement^=bottom] > .tippy-arrow {
  top: 0;
}

.tippy-box[data-placement^=bottom] > .tippy-arrow:before {
  top: -7px;
  left: 0;
  border-width: 0 8px 8px;
  border-bottom-color: initial;
  transform-origin: center bottom;
}

.tippy-box[data-placement^=left] > .tippy-arrow {
  right: 0;
}

.tippy-box[data-placement^=left] > .tippy-arrow:before {
  border-width: 8px 0 8px 8px;
  border-left-color: initial;
  right: -7px;
  transform-origin: center left;
}

.tippy-box[data-placement^=right] > .tippy-arrow {
  left: 0;
}

.tippy-box[data-placement^=right] > .tippy-arrow:before {
  left: -7px;
  border-width: 8px 8px 8px 0;
  border-right-color: initial;
  transform-origin: center right;
}

.tippy-box[data-inertia][data-state=visible] {
  transition-timing-function: cubic-bezier(0.54, 1.5, 0.38, 1.11);
}

.tippy-arrow {
  width: 16px;
  height: 16px;
  color: #333;
}

.tippy-arrow:before {
  content: "";
  position: absolute;
  border-color: transparent;
  border-style: solid;
}

.tippy-content {
  position: relative;
  padding: 5px 9px;
  z-index: 1;
}

.tippy-box[data-theme~=light] {
  color: #26323d;
  box-shadow: 0 0 20px 4px rgba(154, 161, 177, 0.15), 0 4px 80px -8px rgba(36, 40, 47, 0.25), 0 4px 4px -2px rgba(91, 94, 105, 0.15);
  background-color: #fff;
}

.tippy-box[data-theme~=light][data-placement^=top] > .tippy-arrow:before {
  border-top-color: #fff;
}

.tippy-box[data-theme~=light][data-placement^=bottom] > .tippy-arrow:before {
  border-bottom-color: #fff;
}

.tippy-box[data-theme~=light][data-placement^=left] > .tippy-arrow:before {
  border-left-color: #fff;
}

.tippy-box[data-theme~=light][data-placement^=right] > .tippy-arrow:before {
  border-right-color: #fff;
}

.tippy-box[data-theme~=light] > .tippy-backdrop {
  background-color: #fff;
}

.tippy-box[data-theme~=light] > .tippy-svg-arrow {
  fill: #fff;
}

.tippy-box[data-animation=scale][data-placement^=top] {
  transform-origin: bottom;
}

.tippy-box[data-animation=scale][data-placement^=bottom] {
  transform-origin: top;
}

.tippy-box[data-animation=scale][data-placement^=left] {
  transform-origin: right;
}

.tippy-box[data-animation=scale][data-placement^=right] {
  transform-origin: left;
}

.tippy-box[data-animation=scale][data-state=hidden] {
  transform: scale(0.5);
  opacity: 0;
}

/**
 * Gibki
 *
 * @author Benjamin de Oostfrees
 * @version 2.1.0
 * @url https://github.com/deoostfrees/Gibki
 *
 * MIT License
 */
.container {
  -webkit-margin-start: auto;
          margin-inline-start: auto;
  -webkit-margin-end: auto;
          margin-inline-end: auto;
  max-width: 66.667rem;
  -webkit-padding-start: 10px;
          padding-inline-start: 10px;
  -webkit-padding-end: 10px;
          padding-inline-end: 10px;
  width: 100%;
}
.container--small {
  max-width: 34rem;
}
.container .container {
  -webkit-padding-start: 0;
          padding-inline-start: 0;
  -webkit-padding-end: 0;
          padding-inline-end: 0;
}

.flex {
  align-items: stretch;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
}

.flex:not(.flex--no-gutters):not(.flex--no-horizontal-gutters) {
  -webkit-margin-start: -10px;
          margin-inline-start: -10px;
  -webkit-margin-end: -10px;
          margin-inline-end: -10px;
}
.flex:not(.flex--no-gutters):not(.flex--no-horizontal-gutters) > [class*=flex__] {
  -webkit-padding-start: 10px;
          padding-inline-start: 10px;
  -webkit-padding-end: 10px;
          padding-inline-end: 10px;
}

.flex:not(.flex--no-gutters):not(.flex--no-vertical-gutters) {
  row-gap: 20px;
}

.flex--row-reverse {
  flex-direction: row-reverse;
}
.flex--column {
  flex-direction: column;
}
.flex--column-reverse {
  flex-direction: column-reverse;
}
.flex--wrap-reverse {
  flex-wrap: wrap-reverse;
}
.flex--nowrap {
  flex-wrap: nowrap;
}
.flex--center {
  justify-content: center;
}
.flex--right {
  justify-content: flex-end;
}
.flex--space-between {
  justify-content: space-between;
}
.flex--space-around {
  justify-content: space-around;
}
.flex > .flex--stretch {
  align-self: stretch;
}
.flex--top {
  align-items: flex-start;
}
.flex > .flex--top {
  align-self: flex-start;
}
.flex--bottom {
  align-items: flex-end;
}
.flex > .flex--bottom {
  align-self: flex-end;
}
.flex--middle {
  align-items: center;
}
.flex > .flex--middle {
  align-self: center;
}
.flex--baseline {
  align-items: baseline;
}
.flex > .flex--baseline {
  align-self: baseline;
}

[class*=flex__] {
  box-sizing: border-box;
  width: 100%;
}

.flex__auto {
  flex: 1;
}

.flex__1 {
  width: 8.3333333333%;
}

.flex__2 {
  width: 16.6666666667%;
}

.flex__3 {
  width: 25%;
}

.flex__4 {
  width: 33.3333333333%;
}

.flex__5 {
  width: 41.6666666667%;
}

.flex__6 {
  width: 50%;
}

.flex__7 {
  width: 58.3333333333%;
}

.flex__8 {
  width: 66.6666666667%;
}

.flex__9 {
  width: 75%;
}

.flex__10 {
  width: 83.3333333333%;
}

.flex__11 {
  width: 91.6666666667%;
}

.flex__12 {
  width: 100%;
}

.flex--order-1 {
  order: 1;
}

.flex--order-2 {
  order: 2;
}

.flex--order-3 {
  order: 3;
}

.flex--order-4 {
  order: 4;
}

.flex--order-5 {
  order: 5;
}

.flex--order-6 {
  order: 6;
}

.flex--order-7 {
  order: 7;
}

.flex--order-8 {
  order: 8;
}

.flex--order-9 {
  order: 9;
}

.flex--order-10 {
  order: 10;
}

.flex--order-11 {
  order: 11;
}

.flex--order-12 {
  order: 12;
}

.flex--offset-1 {
  -webkit-margin-start: 8.3333333333%;
          margin-inline-start: 8.3333333333%;
}

.flex--offset-2 {
  -webkit-margin-start: 16.6666666667%;
          margin-inline-start: 16.6666666667%;
}

.flex--offset-3 {
  -webkit-margin-start: 25%;
          margin-inline-start: 25%;
}

.flex--offset-4 {
  -webkit-margin-start: 33.3333333333%;
          margin-inline-start: 33.3333333333%;
}

.flex--offset-5 {
  -webkit-margin-start: 41.6666666667%;
          margin-inline-start: 41.6666666667%;
}

.flex--offset-6 {
  -webkit-margin-start: 50%;
          margin-inline-start: 50%;
}

.flex--offset-7 {
  -webkit-margin-start: 58.3333333333%;
          margin-inline-start: 58.3333333333%;
}

.flex--offset-8 {
  -webkit-margin-start: 66.6666666667%;
          margin-inline-start: 66.6666666667%;
}

.flex--offset-9 {
  -webkit-margin-start: 75%;
          margin-inline-start: 75%;
}

.flex--offset-10 {
  -webkit-margin-start: 83.3333333333%;
          margin-inline-start: 83.3333333333%;
}

.flex--offset-11 {
  -webkit-margin-start: 91.6666666667%;
          margin-inline-start: 91.6666666667%;
}

.flex--offset-12 {
  -webkit-margin-start: 100%;
          margin-inline-start: 100%;
}

@media screen and (min-width: 480px) {
  .flex__sm-1 {
    width: 8.3333333333%;
  }

  .flex__sm-2 {
    width: 16.6666666667%;
  }

  .flex__sm-3 {
    width: 25%;
  }

  .flex__sm-4 {
    width: 33.3333333333%;
  }

  .flex__sm-5 {
    width: 41.6666666667%;
  }

  .flex__sm-6 {
    width: 50%;
  }

  .flex__sm-7 {
    width: 58.3333333333%;
  }

  .flex__sm-8 {
    width: 66.6666666667%;
  }

  .flex__sm-9 {
    width: 75%;
  }

  .flex__sm-10 {
    width: 83.3333333333%;
  }

  .flex__sm-11 {
    width: 91.6666666667%;
  }

  .flex__sm-12 {
    width: 100%;
  }

  .flex--offset-sm-1 {
    -webkit-margin-start: 8.3333333333%;
            margin-inline-start: 8.3333333333%;
  }

  .flex--offset-sm-2 {
    -webkit-margin-start: 16.6666666667%;
            margin-inline-start: 16.6666666667%;
  }

  .flex--offset-sm-3 {
    -webkit-margin-start: 25%;
            margin-inline-start: 25%;
  }

  .flex--offset-sm-4 {
    -webkit-margin-start: 33.3333333333%;
            margin-inline-start: 33.3333333333%;
  }

  .flex--offset-sm-5 {
    -webkit-margin-start: 41.6666666667%;
            margin-inline-start: 41.6666666667%;
  }

  .flex--offset-sm-6 {
    -webkit-margin-start: 50%;
            margin-inline-start: 50%;
  }

  .flex--offset-sm-7 {
    -webkit-margin-start: 58.3333333333%;
            margin-inline-start: 58.3333333333%;
  }

  .flex--offset-sm-8 {
    -webkit-margin-start: 66.6666666667%;
            margin-inline-start: 66.6666666667%;
  }

  .flex--offset-sm-9 {
    -webkit-margin-start: 75%;
            margin-inline-start: 75%;
  }

  .flex--offset-sm-10 {
    -webkit-margin-start: 83.3333333333%;
            margin-inline-start: 83.3333333333%;
  }

  .flex--offset-sm-11 {
    -webkit-margin-start: 91.6666666667%;
            margin-inline-start: 91.6666666667%;
  }

  .flex--offset-sm-12 {
    -webkit-margin-start: 100%;
            margin-inline-start: 100%;
  }

  .flex--order-sm-1 {
    order: 1;
  }

  .flex--order-sm-2 {
    order: 2;
  }

  .flex--order-sm-3 {
    order: 3;
  }

  .flex--order-sm-4 {
    order: 4;
  }

  .flex--order-sm-5 {
    order: 5;
  }

  .flex--order-sm-6 {
    order: 6;
  }

  .flex--order-sm-7 {
    order: 7;
  }

  .flex--order-sm-8 {
    order: 8;
  }

  .flex--order-sm-9 {
    order: 9;
  }

  .flex--order-sm-10 {
    order: 10;
  }

  .flex--order-sm-11 {
    order: 11;
  }

  .flex--order-sm-12 {
    order: 12;
  }
}
@media screen and (min-width: 768px) {
  .flex__md-1 {
    width: 8.3333333333%;
  }

  .flex__md-2 {
    width: 16.6666666667%;
  }

  .flex__md-3 {
    width: 25%;
  }

  .flex__md-4 {
    width: 33.3333333333%;
  }

  .flex__md-5 {
    width: 41.6666666667%;
  }

  .flex__md-6 {
    width: 50%;
  }

  .flex__md-7 {
    width: 58.3333333333%;
  }

  .flex__md-8 {
    width: 66.6666666667%;
  }

  .flex__md-9 {
    width: 75%;
  }

  .flex__md-10 {
    width: 83.3333333333%;
  }

  .flex__md-11 {
    width: 91.6666666667%;
  }

  .flex__md-12 {
    width: 100%;
  }

  .flex--offset-md-1 {
    -webkit-margin-start: 8.3333333333%;
            margin-inline-start: 8.3333333333%;
  }

  .flex--offset-md-2 {
    -webkit-margin-start: 16.6666666667%;
            margin-inline-start: 16.6666666667%;
  }

  .flex--offset-md-3 {
    -webkit-margin-start: 25%;
            margin-inline-start: 25%;
  }

  .flex--offset-md-4 {
    -webkit-margin-start: 33.3333333333%;
            margin-inline-start: 33.3333333333%;
  }

  .flex--offset-md-5 {
    -webkit-margin-start: 41.6666666667%;
            margin-inline-start: 41.6666666667%;
  }

  .flex--offset-md-6 {
    -webkit-margin-start: 50%;
            margin-inline-start: 50%;
  }

  .flex--offset-md-7 {
    -webkit-margin-start: 58.3333333333%;
            margin-inline-start: 58.3333333333%;
  }

  .flex--offset-md-8 {
    -webkit-margin-start: 66.6666666667%;
            margin-inline-start: 66.6666666667%;
  }

  .flex--offset-md-9 {
    -webkit-margin-start: 75%;
            margin-inline-start: 75%;
  }

  .flex--offset-md-10 {
    -webkit-margin-start: 83.3333333333%;
            margin-inline-start: 83.3333333333%;
  }

  .flex--offset-md-11 {
    -webkit-margin-start: 91.6666666667%;
            margin-inline-start: 91.6666666667%;
  }

  .flex--offset-md-12 {
    -webkit-margin-start: 100%;
            margin-inline-start: 100%;
  }

  .flex--order-md-1 {
    order: 1;
  }

  .flex--order-md-2 {
    order: 2;
  }

  .flex--order-md-3 {
    order: 3;
  }

  .flex--order-md-4 {
    order: 4;
  }

  .flex--order-md-5 {
    order: 5;
  }

  .flex--order-md-6 {
    order: 6;
  }

  .flex--order-md-7 {
    order: 7;
  }

  .flex--order-md-8 {
    order: 8;
  }

  .flex--order-md-9 {
    order: 9;
  }

  .flex--order-md-10 {
    order: 10;
  }

  .flex--order-md-11 {
    order: 11;
  }

  .flex--order-md-12 {
    order: 12;
  }
}
@media screen and (min-width: 992px) {
  .flex__lg-1 {
    width: 8.3333333333%;
  }

  .flex__lg-2 {
    width: 16.6666666667%;
  }

  .flex__lg-3 {
    width: 25%;
  }

  .flex__lg-4 {
    width: 33.3333333333%;
  }

  .flex__lg-5 {
    width: 41.6666666667%;
  }

  .flex__lg-6 {
    width: 50%;
  }

  .flex__lg-7 {
    width: 58.3333333333%;
  }

  .flex__lg-8 {
    width: 66.6666666667%;
  }

  .flex__lg-9 {
    width: 75%;
  }

  .flex__lg-10 {
    width: 83.3333333333%;
  }

  .flex__lg-11 {
    width: 91.6666666667%;
  }

  .flex__lg-12 {
    width: 100%;
  }

  .flex--offset-lg-1 {
    -webkit-margin-start: 8.3333333333%;
            margin-inline-start: 8.3333333333%;
  }

  .flex--offset-lg-2 {
    -webkit-margin-start: 16.6666666667%;
            margin-inline-start: 16.6666666667%;
  }

  .flex--offset-lg-3 {
    -webkit-margin-start: 25%;
            margin-inline-start: 25%;
  }

  .flex--offset-lg-4 {
    -webkit-margin-start: 33.3333333333%;
            margin-inline-start: 33.3333333333%;
  }

  .flex--offset-lg-5 {
    -webkit-margin-start: 41.6666666667%;
            margin-inline-start: 41.6666666667%;
  }

  .flex--offset-lg-6 {
    -webkit-margin-start: 50%;
            margin-inline-start: 50%;
  }

  .flex--offset-lg-7 {
    -webkit-margin-start: 58.3333333333%;
            margin-inline-start: 58.3333333333%;
  }

  .flex--offset-lg-8 {
    -webkit-margin-start: 66.6666666667%;
            margin-inline-start: 66.6666666667%;
  }

  .flex--offset-lg-9 {
    -webkit-margin-start: 75%;
            margin-inline-start: 75%;
  }

  .flex--offset-lg-10 {
    -webkit-margin-start: 83.3333333333%;
            margin-inline-start: 83.3333333333%;
  }

  .flex--offset-lg-11 {
    -webkit-margin-start: 91.6666666667%;
            margin-inline-start: 91.6666666667%;
  }

  .flex--offset-lg-12 {
    -webkit-margin-start: 100%;
            margin-inline-start: 100%;
  }

  .flex--order-lg-1 {
    order: 1;
  }

  .flex--order-lg-2 {
    order: 2;
  }

  .flex--order-lg-3 {
    order: 3;
  }

  .flex--order-lg-4 {
    order: 4;
  }

  .flex--order-lg-5 {
    order: 5;
  }

  .flex--order-lg-6 {
    order: 6;
  }

  .flex--order-lg-7 {
    order: 7;
  }

  .flex--order-lg-8 {
    order: 8;
  }

  .flex--order-lg-9 {
    order: 9;
  }

  .flex--order-lg-10 {
    order: 10;
  }

  .flex--order-lg-11 {
    order: 11;
  }

  .flex--order-lg-12 {
    order: 12;
  }
}
@media screen and (min-width: 1220px) {
  .flex__xl-1 {
    width: 8.3333333333%;
  }

  .flex__xl-2 {
    width: 16.6666666667%;
  }

  .flex__xl-3 {
    width: 25%;
  }

  .flex__xl-4 {
    width: 33.3333333333%;
  }

  .flex__xl-5 {
    width: 41.6666666667%;
  }

  .flex__xl-6 {
    width: 50%;
  }

  .flex__xl-7 {
    width: 58.3333333333%;
  }

  .flex__xl-8 {
    width: 66.6666666667%;
  }

  .flex__xl-9 {
    width: 75%;
  }

  .flex__xl-10 {
    width: 83.3333333333%;
  }

  .flex__xl-11 {
    width: 91.6666666667%;
  }

  .flex__xl-12 {
    width: 100%;
  }

  .flex--offset-xl-1 {
    -webkit-margin-start: 8.3333333333%;
            margin-inline-start: 8.3333333333%;
  }

  .flex--offset-xl-2 {
    -webkit-margin-start: 16.6666666667%;
            margin-inline-start: 16.6666666667%;
  }

  .flex--offset-xl-3 {
    -webkit-margin-start: 25%;
            margin-inline-start: 25%;
  }

  .flex--offset-xl-4 {
    -webkit-margin-start: 33.3333333333%;
            margin-inline-start: 33.3333333333%;
  }

  .flex--offset-xl-5 {
    -webkit-margin-start: 41.6666666667%;
            margin-inline-start: 41.6666666667%;
  }

  .flex--offset-xl-6 {
    -webkit-margin-start: 50%;
            margin-inline-start: 50%;
  }

  .flex--offset-xl-7 {
    -webkit-margin-start: 58.3333333333%;
            margin-inline-start: 58.3333333333%;
  }

  .flex--offset-xl-8 {
    -webkit-margin-start: 66.6666666667%;
            margin-inline-start: 66.6666666667%;
  }

  .flex--offset-xl-9 {
    -webkit-margin-start: 75%;
            margin-inline-start: 75%;
  }

  .flex--offset-xl-10 {
    -webkit-margin-start: 83.3333333333%;
            margin-inline-start: 83.3333333333%;
  }

  .flex--offset-xl-11 {
    -webkit-margin-start: 91.6666666667%;
            margin-inline-start: 91.6666666667%;
  }

  .flex--offset-xl-12 {
    -webkit-margin-start: 100%;
            margin-inline-start: 100%;
  }

  .flex--order-xl-1 {
    order: 1;
  }

  .flex--order-xl-2 {
    order: 2;
  }

  .flex--order-xl-3 {
    order: 3;
  }

  .flex--order-xl-4 {
    order: 4;
  }

  .flex--order-xl-5 {
    order: 5;
  }

  .flex--order-xl-6 {
    order: 6;
  }

  .flex--order-xl-7 {
    order: 7;
  }

  .flex--order-xl-8 {
    order: 8;
  }

  .flex--order-xl-9 {
    order: 9;
  }

  .flex--order-xl-10 {
    order: 10;
  }

  .flex--order-xl-11 {
    order: 11;
  }

  .flex--order-xl-12 {
    order: 12;
  }
}
/*------------------------------------*\
  #SETTINGS
\*------------------------------------*/
/**
 * “This layer should only house settings that need to be accessed from
 * anywhere. Settings like $heading-size-1 should be defined in the Headings
 * partial. This ensures this layer stays nice and slim, and means that most
 * settings can be found alongside the code that uses them, making finding
 * things far simpler.
 *
 * Examples of global settings might be things like the base font size, colour
 * palettes, config (for example, $environment: dev;) and so on.”
 *
 * (Source: see link at the top)
 */
/*
Settings

Styleguide 1.0
*/
/*------------------------------------*\
  #COLORS
\*------------------------------------*/
/*
Colors

Colors:
$black: #000000
$white: #FFFFFF
$text: #333
$verylightgrey: #CCCCCC
$quanternary: #F7F7F7
$iftBlue: #005C95
$highlightBlue: #008FE8
$lightBlue: #7ECEFF
$red: #F77874
$primary: #474747
$secondary: #A3A3A3
$tertiary: #E3E3E3
$quanternary: #F7F7F7
$disabled: #585858

Styleguide 1.1
*/
:root {
  --iftBlue: #005C95;
  --highlightBlue: #008FE8;
  --highlightBlueDarker: #0070b5;
  --lightBlue: #7ECEFF;
}

:root body.ift-contecde {
  --iftBlue: #97BF0D;
  --highlightBlue: #97BF0D;
  --highlightBlueDarker: #718f0a;
  --lightBlue: #97BF0D;
}

/*------------------------------------*\
  #FONTS
\*------------------------------------*/
/**
 * 1. Use relative values like rem, em or %. Otherwise text zoom of IE won't
 *    work, which is an accessibility issue
 *    (http://testen.bitv-test.de/index.php?a=di&iid=52&s=n). Using rem has the
 *    benefit that the value is always equivalent to 16px and not depending on
 *    the location.
 */
/*
Fonts

Markup: templates/output/01-settings/fonts.html

Styleguide 1.2
*/
@font-face {
  font-display: swap;
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300;
  src: local(""), url("../Fonts/open-sans-v23-latin-300.woff2") format("woff2");
}
@font-face {
  font-display: swap;
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 300;
  src: local(""), url("../Fonts/open-sans-v23-latin-300italic.woff2") format("woff2");
}
@font-face {
  font-display: swap;
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  src: local(""), url("../Fonts/open-sans-v23-latin-regular.woff2") format("woff2");
}
@font-face {
  font-display: swap;
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 400;
  src: local(""), url("../Fonts/open-sans-v23-latin-italic.woff2") format("woff2");
}
@font-face {
  font-display: swap;
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 600;
  src: local(""), url("../Fonts/open-sans-v23-latin-600.woff2") format("woff2");
}
@font-face {
  font-display: swap;
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 600;
  src: local(""), url("../Fonts/open-sans-v23-latin-600italic.woff2") format("woff2");
}
@font-face {
  font-display: swap;
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  src: local(""), url("../Fonts/open-sans-v23-latin-700.woff2") format("woff2");
}
@font-face {
  font-display: swap;
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 700;
  src: local(""), url("../Fonts/open-sans-v23-latin-700italic.woff2") format("woff2");
}
/* [1] */
/*------------------------------------*\
  #SYMBOLS
\*------------------------------------*/
/**
 * 1. Use relative values like rem, em or %. Otherwise text zoom of IE won't
 *    work, which is an accessibility issue
 *    (http://testen.bitv-test.de/index.php?a=di&iid=52&s=n). Using rem has the
 *    benefit that the value is always equivalent to 16px and not depending on
 *    the location.
 */
/*
Symbols

Markup: templates/output/01-settings/symbols.html

Styleguide 1.3
*/
/*------------------------------------*\
  #TOOLS
\*------------------------------------*/
/**
 * “[…] globally available tooling – namely mixins and functions. Any mixin or
 * function that does not need accessing globally should belong in the partial
 * to which it relates. The Tools layer comes after the Settings layer because a
 * mixin may require one of the global settings as a default parameter. Examples
 * of global tools might be gradient mixins, font-sizing mixins and so on.”
 *
 * (Source: see link at the top)
 */
/**
 * Resolve relative path to images, fonts or icons.
 * By default the path points to "../Images/".
 *
 * Example usage(s)
 *
 * For images use this in your scss:
 * in2-get-local-file-path("{IMAGE_FOLDER}/{IMAGE_NAME}.{IMAGE_EXTENSION}")
 *
 * For fonts use this in your scss:
 * in2-get-local-file-path("{FONT_FOLDER}/{FONT_NAME}.{FONT_EXTENSION}", font)
 *
 * For icons use this in your scss:
 * in2-get-local-file-path("{ICON_FOLDER}/{ICON_NAME}.{ICON_EXTENSION}", icon)
 *
 */
/**
 * Convert px value to rem
 *
 * This function converts pixel values to rem.
 *
 * $pixelValue: The value in pixels
 * $base: Root Element initial size
 *
 * Example usage
 * padding: in2-convert-px-to-rem(24);
 */
/*------------------------------------*\
  #MIXINS
\*------------------------------------*/
/**
 * Convert font size from px to rem including optional line height
 *
 * Example usage:
 * @include in2-fontsize(18, 24);
 *
 */
/**
 * Wrap long words to prevent content overlapping
 *
 * Provides an easy way to change the `word-wrap` property.
 *
 * @url: https://github.com/thoughtbot/scss-workshop/blob/master/bourbon/addons/_word-wrap.scss
 *
 * @param {String} $wrap [break-word]
 * Value for the `word-break` property.
 *
 * @example scss - Usage
 * .wrapper {
 *   @include word-wrap(break-word);
 * }
 *
 * @example css - CSS Output
 * .wrapper {
 *   overflow-wrap: break-word;
 *   word-break: break-all;
 *   word-wrap: break-word;
 * }
**/
/*------------------------------------*\
  #GENERIC
\*------------------------------------*/
/**
 * “The Generic layer is the first one that actually produces any CSS. It houses
 * very high-level, far reaching styles. This layer is seldom modified, and is
 * usually the same across any projects you work on. It contains things like
 * Normalize.css, global box-sizing rules, CSS resets and so on. The Generic
 * layer affects a lot of the DOM, hence it being nice and wide in the Triangle
 * model, and occurring very early on.”
 *
 * (Source: see link at the top)
 */
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/* Text-level semantics
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
  /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
  border-style: none;
}

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type=checkbox],
[type=radio] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type=search] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/* Misc
   ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none;
}

/*------------------------------------*\
  #BOX-SIZING
\*------------------------------------*/
/**
 * More sensible default box-sizing:
 * https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/.
 */
html {
  box-sizing: border-box;
}

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

.visually-hidden {
  display: block;
  margin: 0;
  border: 0;
  -webkit-clip-path: inset(1px);
          clip-path: inset(1px);
  height: 1px;
  left: 0;
  overflow: hidden;
  padding: 0;
  position: absolute;
  top: 0;
  white-space: nowrap;
  width: 1px;
}

/*------------------------------------*\
  #ELEMENTS
\*------------------------------------*/
/**
 * “These are bare, unclassed HTML elements. What does an h1 look like without a
 * class on it? What does an a look like without a class on it? The Elements
 * layer binds onto bare HTML element (or 'type') selectors only. It is slightly
 * more explicit than the previous layer in that we are now saying 'make every
 * h1 this big', or 'make every a be a certain colour'. It is still a very
 * low-specificity layer, but affects slightly less of the DOM, and is slightly
 * more opinionated, hence its location in the Triangle.
 *
 * The Elements layer is typically the last one in which we'd find bare,
 * element-based selectors, and is very rarely added to or changed after initial
 * setup. Once we have defined element-level styles, all additions and
 * deviations should be implemented using classes.”
 *
 * (Source: see link at the top)
 */
/*
Elements

Styleguide 2.0
*/
/*
Buttons

Markup: templates/output/04-elements/buttons.html

Styleguide 2.2
*/
.buttons__arround {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: space-around;
  border: 0;
}
.buttons__arround .button__holder {
  margin: 0 1em 1.5em;
}

.button__ghost {
  display: inline-flex;
  margin-bottom: 10px;
  text-transform: uppercase;
  font-size: 12px;
  line-height: 1.25;
  text-align: center;
  position: relative;
  padding: 0;
  color: var(--highlightBlue);
  background: transparent;
  border: 0;
  cursor: pointer;
  transition: color 0.25s;
}
.button__ghost:hover {
  text-decoration: none;
}
.button__ghost--primary {
  color: var(--highlightBlue);
}
.button__ghost--primary:hover {
  color: #333;
}
.button__ghost--secondary {
  color: #474747;
}
.button__ghost--secondary:hover {
  color: var(--highlightBlue);
}
.button__ghost--disabled {
  color: #E3E3E3;
  cursor: not-allowed;
}
.button__ghost--disabled:hover {
  color: #E3E3E3;
}
.button__ghost--negative {
  color: #FFFFFF;
}
.button__ghost--negative:hover {
  color: var(--highlightBlue);
}
.button__ghost--negative.button__ghost--disabled {
  color: #585858;
}
.button__ghost--negative.button__ghost--disabled:hover {
  color: #585858;
}
.button__ghost:hover::before, .button__ghost:hover::after {
  height: 75%;
}
.button__ghost:hover .button__ghost__inner::before, .button__ghost:hover .button__ghost__inner::after {
  width: 100%;
}
.button__ghost::before, .button__ghost::after {
  position: absolute;
  width: 1px;
  height: 100%;
  background: currentcolor;
  transition: height 0.25s;
  content: "";
}
.button__ghost::before {
  top: 0;
  left: 0;
}
.button__ghost::after {
  bottom: 0;
  right: 0;
}

.button__ghost__inner {
  position: relative;
  padding: 15px 30px;
}
.button__ghost__inner::before, .button__ghost__inner::after {
  position: absolute;
  width: 90%;
  height: 1px;
  background: currentcolor;
  transition: width 0.25s;
  content: "";
}
.button__ghost__inner::before {
  top: 0;
  left: 0;
}
.button__ghost__inner::after {
  bottom: 0;
  right: 0;
}

.button__round {
  display: inline-flex;
  font-size: 14px;
  line-height: 1.25;
  text-align: center;
  position: relative;
  padding: 10px 20px;
  color: var(--iftBlue);
  background: transparent;
  border: 1px solid;
  border-radius: 3em;
  cursor: pointer;
  transition: 0.25s;
}
.button__round:hover {
  text-decoration: none;
  color: var(--highlightBlue);
}
.button__round--filter {
  color: #333;
}
.button__round--filter.button__round--active {
  color: var(--highlightBlue);
  background: #FFFFFF;
  border-color: var(--highlightBlue);
}
.button__round--filter.button__round--active:hover {
  color: var(--iftBlue);
  background: #FFFFFF;
  border-color: var(--iftBlue);
}
.button__round--active {
  color: #FFFFFF;
  background: var(--iftBlue);
}
.button__round--active:hover {
  color: #FFFFFF;
  background: var(--highlightBlue);
}
.button__round--disabled {
  color: #E3E3E3;
  cursor: not-allowed;
}
.button__round--disabled:hover, .button__round--disabled:active {
  color: #E3E3E3;
  background: transparent;
}
.button__round--disabled.button__round--active {
  color: #333;
  background: #E3E3E3;
  border-color: #E3E3E3;
}

.button__round__icon {
  margin-left: 10px;
  vertical-align: bottom;
}

.button__link {
  display: inline-flex;
  flex-flow: row nowrap;
  align-items: center;
  font-size: 12px;
  text-decoration: none;
  text-transform: uppercase;
  position: relative;
  color: #333;
  border: 0;
  transition: color 0.25s;
  cursor: pointer;
}
.button__link:hover {
  text-decoration: none;
}
.button__link:not(.button__link__icon):not(.button__link__icon__right)::before {
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 1px;
  background: currentColor;
  content: "";
}
.button__link:hover {
  color: var(--highlightBlue);
}
.button__link--disabled {
  color: #E3E3E3;
}
.button__link--disabled:hover {
  color: #E3E3E3;
  cursor: not-allowed;
}
.button__link--negative {
  color: #FFFFFF;
}
.button__link--negative.button__link--disabled {
  color: #585858;
}
.button__link--negative.button__link--disabled:hover {
  color: #585858;
}
.button__link.button__link__icon::before {
  content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='currentcolor' stroke-width='1'><path d='M2 16L12 8 22 16' transform='rotate(-180 12 12)'></path></svg>");
  height: 18px;
  width: 18px;
  margin-right: 10px;
}
.button__link.button__link__icon::after {
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 1px;
  background: currentColor;
  content: "";
}
.button__link.button__link__icon__right::after {
  content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='currentcolor' stroke-width='1'><path d='M2 16L12 8 22 16' transform='rotate(-180 12 12)'></path></svg>");
  height: 18px;
  width: 18px;
  margin-left: 10px;
}
.button__link.button__link__icon__right::before {
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 1px;
  background: currentColor;
  content: "";
}

.to__top {
  display: none;
  color: var(--highlightBlue);
  background: #FFFFFF;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.4);
  cursor: pointer;
  position: fixed;
  right: 40px;
  bottom: 40px;
}
@media (min-width: 1220px) {
  .to__top.mightvisible.visible {
    display: inline-block;
  }
}

.to__top__icon {
  display: block;
  margin: 9px;
  transform: rotate(-90deg);
}

/*------------------------------------*\
  #BODY
\*------------------------------------*/
html {
  font-size: 1rem;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  -moz-osx-font-smoothing: grayscale;
}
@media screen and (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
}

body {
  margin: 0;
  color: #333;
  line-height: 1.5;
  font-family: "Open Sans", sans-serif;
  -webkit-text-size-adjust: 100%;
  letter-spacing: 0.8px;
  font-size: 16px;
}
@media (max-width: 768px) {
  body {
    font-size: 14px;
  }
}

:target {
  scroll-margin-top: var(--scroll-margin-top);
}

/*------------------------------------*\
  #FORMS
\*------------------------------------*/
/*
Forms

Form elements for complete forms

Markup: templates/output/04-elements/forms/demoform.html

Styleguide 2.3
*/
input[type=date]::-webkit-inner-spin-button,
input[type=date]::-webkit-calendar-picker-indicator {
  display: none;
  -webkit-appearance: none;
}

.form {
  font-size: 12px;
  text-align: center;
}
.form a {
  text-decoration: underline;
  color: #474747;
}
.form .form__button {
  margin-top: 30px;
}

.fieldset {
  padding: 0;
  border: 0;
}

.form__header {
  margin-bottom: 60px;
  font-size: 14px;
}

.form__el {
  display: block;
  position: relative;
  text-align: left;
  margin-bottom: 12px;
}
.form__el--negative input,
.form__el--negative textarea {
  color: #FFFFFF;
  background: transparent;
  border-color: #FFFFFF;
}
.form__el--negative input:focus,
.form__el--negative textarea:focus {
  box-shadow: 0 0 0 2px #FFFFFF;
}
.form__el--negative input:not(:-moz-placeholder-shown), .form__el--negative textarea:not(:-moz-placeholder-shown) {
  border-color: #FFFFFF;
}
.form__el--negative input:not(:-ms-input-placeholder), .form__el--negative textarea:not(:-ms-input-placeholder) {
  border-color: #FFFFFF;
}
.form__el--negative input:not(:placeholder-shown),
.form__el--negative textarea:not(:placeholder-shown) {
  border-color: #FFFFFF;
}
.form__el--negative select {
  color: #FFFFFF;
  background: transparent;
  border-color: #FFFFFF;
}
.form__el--negative select:focus {
  box-shadow: 0 0 0 2px #FFFFFF;
}
.form__el--negative select:not(:-moz-placeholder-shown) {
  border-color: #FFFFFF;
}
.form__el--negative select:not(:-ms-input-placeholder) {
  border-color: #FFFFFF;
}
.form__el--negative select:not(:placeholder-shown) {
  border-color: #FFFFFF;
}
.form__el--negative select ~ .form__placeholder {
  font-size: 10px;
  top: 5px;
  left: 14px;
  transform: translateY(0);
}
.form__el--negative .form__checkbox .form__checkmark {
  background: transparent;
  border-color: #FFFFFF;
}
.form__el--disabled .form__checkbox input {
  cursor: not-allowed;
}
.form__el--disabled .form__checkbox .form__checkmark {
  background: #A3A3A3 !important;
  border-color: #A3A3A3 !important;
}
.form__el--file::before {
  position: absolute;
  top: 5px;
  right: 5px;
  bottom: 5px;
  left: 5px;
  border: 1px dashed #474747;
  border-radius: 8px;
  pointer-events: none;
  content: "";
}
.form__el--file input {
  padding: 12px 34px 12px 14px;
  cursor: pointer;
}
.form__el--file input::file-selector-button, .form__el--file input::-webkit-file-upload-button {
  display: none;
}
.form__el--file .forminput-icon {
  position: absolute;
  top: 50%;
  right: 14px;
  transform: translateY(-50%);
}
.form__el--select {
  position: relative;
}
.form__el--select select {
  padding: 18px 40px 6px 14px;
  -webkit-appearance: none;
  -moz-appearance: none;
  text-indent: 1px;
  text-overflow: "";
}
.form__el--select select ::-ms-expand {
  display: none;
}
.form__el--select .form__el__icon {
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
}
.form__el--select .form__placeholder {
  font-size: 10px;
  top: 5px !important;
  left: 14px;
  transform: translateY(0) !important;
}
.form__el--search {
  position: relative;
  cursor: pointer;
}
.form__el--search input {
  padding: 18px 40px 6px 14px;
  -webkit-appearance: none;
  -moz-appearance: none;
  text-indent: 1px;
  text-overflow: "";
}
.form__el--search input ::-ms-expand {
  display: none;
}
.form__el--search .form__el__icon {
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
}
.form__el .form__placeholder {
  top: 50%;
  transform: translateY(-50%);
}
.form__el textarea ~ .form__placeholder {
  top: 12px;
  left: 14px;
  transform: translateY(0);
}
.form__el--tooltip input,
.form__el--tooltip textarea,
.form__el--tooltip select {
  padding-right: 40px;
  letter-spacing: 0.8px;
}
.form__el--tooltip .tooltip__trigger {
  display: block;
  position: absolute;
  top: 50%;
  right: 14px;
  width: 24px;
  height: 24px;
  transform: translateY(-50%);
  color: #A3A3A3;
  z-index: 9;
}
.form__el--locked input,
.form__el--locked select,
.form__el--locked textarea {
  background: #F7F7F7;
  cursor: not-allowed;
}
.form__el--error.tooltip__trigger {
  color: #F77874;
}
.form__el--error.tooltip__trigger::after {
  color: #F77874;
}
.form__el--error input,
.form__el--error textarea,
.form__el--error select {
  color: #F77874;
  border-color: transparent;
  box-shadow: 0 0 0 2px #F77874;
}
.form__el--error input::-webkit-input-placeholder,
.form__el--error textarea::-webkit-input-placeholder,
.form__el--error select::-webkit-input-placeholder {
  color: #F77874;
}
.form__el--error input::-moz-placeholder,
.form__el--error textarea::-moz-placeholder,
.form__el--error select::-moz-placeholder {
  color: #F77874;
}
.form__el--error input:-ms-input-placeholder,
.form__el--error textarea:-ms-input-placeholder,
.form__el--error select:-ms-input-placeholder {
  color: #F77874;
}
.form__el--error input:-moz-placeholder,
.form__el--error textarea:-moz-placeholder,
.form__el--error select:-moz-placeholder {
  color: #F77874;
}
.form__el--error input:focus,
.form__el--error textarea:focus,
.form__el--error select:focus {
  box-shadow: 0 0 0 2px #F77874;
}
.form__el--error textarea {
  resize: vertical;
}

input,
textarea,
select {
  display: block;
  width: 100%;
  font-size: 14px;
  padding: 18px 14px 6px;
  border: 1px solid #474747;
  border-radius: 8px;
  line-height: 1.5;
  font-family: "Open Sans", sans-serif;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder,
select::-webkit-input-placeholder {
  color: #474747;
}
input::-moz-placeholder,
textarea::-moz-placeholder,
select::-moz-placeholder {
  color: #474747;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder,
select:-ms-input-placeholder {
  color: #474747;
}
input:-moz-placeholder,
textarea:-moz-placeholder,
select:-moz-placeholder {
  color: #474747;
}
input:focus,
textarea:focus,
select:focus {
  outline: none;
  border-color: transparent;
  box-shadow: 0 0 0 2px var(--highlightBlue);
}

::-moz-placeholder {
  opacity: 0;
  -moz-transition: inherit;
  transition: inherit;
}

:-ms-input-placeholder {
  opacity: 0;
  -ms-transition: inherit;
  transition: inherit;
}

::placeholder {
  opacity: 0;
  transition: inherit;
}

input:not(:-moz-placeholder-shown) ~ .form__placeholder, textarea:not(:-moz-placeholder-shown) ~ .form__placeholder {
  font-size: 10px;
  top: 5px;
  left: 14px;
  transform: translateY(0);
}

input:not(:-ms-input-placeholder) ~ .form__placeholder, textarea:not(:-ms-input-placeholder) ~ .form__placeholder {
  font-size: 10px;
  top: 5px;
  left: 14px;
  transform: translateY(0);
}

input:focus ~ .form__placeholder, input:not(:placeholder-shown) ~ .form__placeholder,
textarea:focus ~ .form__placeholder,
textarea:not(:placeholder-shown) ~ .form__placeholder {
  font-size: 10px;
  top: 5px;
  left: 14px;
  transform: translateY(0);
}

.form__placeholder {
  position: absolute;
  left: 18px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  pointer-events: none;
  transition: 0.25s;
}

.form__el__icon {
  display: block;
  position: absolute;
  top: 50%;
  right: 14px;
  width: 24px;
  height: 24px;
  transform: translateY(-50%);
  color: #A3A3A3;
  z-index: 9;
}
.form__el__icon--datepicker {
  right: calc(50% + 20px);
}

/* Customize the label (the container) */
.form__checkbox {
  display: block;
  position: relative;
  padding-left: 35px;
  font-size: 12px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.form__checkbox span:not(.mandatory) {
  display: block;
  padding-top: 3px;
  cursor: default;
}
.form__checkbox span:not(.mandatory) a {
  text-decoration: underline;
  color: inherit;
}
.form__checkbox span:not(.mandatory) a:hover {
  text-decoration: none;
}
.form__checkbox input {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 25px;
  opacity: 0;
  cursor: pointer;
}
.form__checkbox input:checked ~ .form__checkmark {
  background: var(--highlightBlue);
  border-color: var(--highlightBlue);
}
.form__checkbox input:checked ~ .form__checkmark::after {
  display: block;
}
.form__checkbox + .form__checkbox {
  margin-top: 8px;
}

.form__radio {
  display: block;
  position: relative;
  padding-left: 35px;
  font-size: 12px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.form__radio span {
  display: block;
  padding-top: 3px;
  cursor: default;
}
.form__radio span a {
  text-decoration: underline;
  color: inherit;
}
.form__radio span a:hover {
  text-decoration: none;
}
.form__radio input {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 25px;
  opacity: 0;
  cursor: pointer;
}
.form__radio input:checked ~ .form__checkmark {
  background: var(--highlightBlue);
  border-color: var(--highlightBlue);
}
.form__radio input:checked ~ .form__checkmark::after {
  display: block;
}
.form__radio + .form__radio {
  margin-top: 8px;
}

.form__checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 24px;
  width: 24px;
  background: #FFFFFF;
  border: 1px solid #474747;
  border-radius: 4px;
  pointer-events: none;
}
.form__radio .form__checkmark {
  border-radius: 100%;
}
.form__checkmark::after {
  display: none;
  position: absolute;
  top: 4px;
  left: 8px;
  width: 6px;
  height: 11px;
  border: solid #FFFFFF;
  border-width: 0 1px 1px 0;
  transform: rotate(45deg);
  content: "";
}

/*
Textarea

Markup: templates/output/04-elements/forms/textarea.html

Styleguide 2.3.1
*/
textarea {
  height: 284px;
}

/*
Field: Checkbox

Markup: templates/output/04-elements/forms/input/checkbox.html

Styleguide 2.3.2
*/
/*
Field: Radio

Markup: templates/output/04-elements/forms/input/radio.html

Styleguide 2.3.3
*/
/*
Input

List all input fields

Styleguide 2.3.4
*/
/*
Field: text

Markup: templates/output/04-elements/forms/input/text.html

Styleguide 2.3.4.1
*/
/*
Field: search

Markup: templates/output/04-elements/forms/input/search.html

Styleguide 2.3.4.2
*/
/*
Field: text required

Markup: templates/output/04-elements/forms/input/text-required.html

Styleguide 2.3.4.3
*/
* + .enforceLabel {
  margin-top: 32px;
}

.enforce-label {
  font-size: 14px;
}

/*------------------------------------*\
  #HEADINGS
\*------------------------------------*/
/*
Headings

Hier sind die zu verwendeten Überschriften zu sehen. Wenn neue hinzu kommen
sollen, muss dies hier getan werden.

Markup: templates/output/04-elements/headings.html

Styleguide 2.4
*/
h1,
h2,
h3,
h4,
.h1,
.h2,
.h3,
.h4 {
  margin: 0 0 0.5em;
  font-weight: 400;
  -webkit-hyphens: auto;
      -ms-hyphens: auto;
          hyphens: auto;
}

h1,
.h1 {
  font-size: 60px;
  line-height: normal;
  letter-spacing: 3.75px;
}
@media (max-width: 768px) {
  h1,
.h1 {
    font-size: 24px;
    line-height: normal;
    letter-spacing: 1.1px;
  }
}
h1.alt,
.h1.alt {
  font-size: 80px;
  line-height: 1;
  letter-spacing: 5px;
}
@media (max-width: 768px) {
  h1.alt,
.h1.alt {
    font-size: 32px;
    line-height: 1.34;
    letter-spacing: 1.83px;
  }
}

h2,
.h2 {
  font-size: 48px;
  line-height: 1.33;
  letter-spacing: 2.75px;
}
@media (max-width: 768px) {
  h2,
.h2 {
    font-size: 18px;
    line-height: 1.33;
    letter-spacing: 0.9px;
  }
}
h2.centered,
.h2.centered {
  text-align: center;
}

h3,
.h3 {
  font-size: 32px;
  line-height: 1.34;
  letter-spacing: 1.83px;
}
@media (max-width: 768px) {
  h3,
.h3 {
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0.8px;
  }
}

h4,
.h4 {
  font-size: 24px;
  line-height: normal;
  letter-spacing: 1.1px;
}
@media (max-width: 768px) {
  h4,
.h4 {
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0.8px;
  }
}

header.header--centered {
  text-align: center;
}

/*
Heading h1

Markup: templates/output/04-elements/heading-h1.html

Styleguide 2.4.1
*/
/*
Heading h2

Markup: templates/output/04-elements/heading-h2.html

Styleguide 2.4.2
*/
/*
Heading h3

Markup: templates/output/04-elements/heading-h3.html

Styleguide 2.4.3
*/
/*
Heading h4

Markup: templates/output/04-elements/heading-h4.html

Styleguide 2.4.4
*/
/*------------------------------------*\
  #HR
\*------------------------------------*/
/*
Hr

Markup: templates/output/04-elements/horizontalRule.html

Styleguide 2.5
*/
hr {
  margin: 3em 0;
  border-top: 0;
  border-bottom: 1px solid #E3E3E3;
}
hr.no-margin {
  margin: 0 0 1rem 0;
}

/*------------------------------------*\
  #IMAGES
\*------------------------------------*/
/*
Images

Styling der Bilder

Styleguide 2.6
*/
/**
 * Set some elements responsive.
 */
img,
object,
embed,
video {
  max-width: 100%;
  height: auto;
}

/*
Image

Markup: templates/output/04-elements/images/image.html

Styleguide 2.6.1
*/
img {
  border-style: none;
}

/*
Image Responsive

Markup: templates/output/03-patterns/images/rwd-image.html

Styleguide 2.6.2
*/
/*
Picture Attribute

Markup: templates/output/03-patterns/images/rwd-picture.html

Styleguide 2.6.3
*/
/*
Image with figcaption

Markup: templates/output/04-elements/images/figure.html

Styleguide 2.6.4
*/
figure {
  margin: 0;
}

figcaption {
  font-style: normal;
}
figcaption a {
  color: var(--highlightBlue);
}

/*------------------------------------*\
  #INLINEELEMENTS
\*------------------------------------*/
/*
Inline Elements

Markup: templates/output/04-elements/inlineElements.html

Styleguide 2.7
*/
a {
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}
a.event-link {
  color: var(--highlightBlue);
}

.persons__desc a,
.timeline__box-desc a,
.frame-type-textmedia a:not(.button__ghost):not(.button__link):not(.link--blue),
.frame-type-text a:not(.button__ghost):not(.button__link):not(.link--blue),
.news-bodytext a:not(.button__ghost):not(.button__link):not(.link--blue),
.contractualbase--text a:not(.button__ghost):not(.button__link):not(.link--blue),
.special__link {
  color: inherit;
  text-decoration: none;
  background: linear-gradient(var(--lightBlue), var(--lightBlue)) left bottom no-repeat;
  background-size: 100% 5px;
  transition: 0.25s;
}
.persons__desc a:hover,
.timeline__box-desc a:hover,
.frame-type-textmedia a:not(.button__ghost):not(.button__link):not(.link--blue):hover,
.frame-type-text a:not(.button__ghost):not(.button__link):not(.link--blue):hover,
.news-bodytext a:not(.button__ghost):not(.button__link):not(.link--blue):hover,
.contractualbase--text a:not(.button__ghost):not(.button__link):not(.link--blue):hover,
.special__link:hover {
  text-decoration: none;
  background-size: 100% 1.25em;
}

.link--blue {
  color: var(--highlightBlue);
}

/*
Lists

Markup: templates/output/04-elements/lists.html

Styleguide 2.12
*/
ol {
  margin-top: 0;
  padding-left: 18px;
}
.o-container--centered ol:not([class]) {
  display: flex;
  flex-direction: column;
  align-items: center;
}

ul:not([class]) {
  margin-top: 0;
  padding: 0;
  list-style: none;
}
ul:not([class]) > li {
  position: relative;
  padding-left: 18px;
  padding-top: 5px;
  padding-bottom: 5px;
}
ul:not([class]) > li::before {
  position: absolute;
  top: 21px;
  left: 0;
  width: 10px;
  height: 1px;
  background: var(--iftBlue);
  content: "";
}
@media (max-width: 768px) {
  ul:not([class]) > li::before {
    top: 10px;
  }
}
.o-container--centered ul:not([class]) {
  display: flex;
  flex-direction: column;
  align-items: center;
}

ol:not([class]) > li {
  position: relative;
  padding-top: 5px;
  padding-bottom: 5px;
}

.files,
.files__to-upload {
  margin: 0;
  padding: 0;
  list-style: none;
}

.files__item {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  padding: 10px 15px;
  color: #333;
  background: #FFFFFF;
  border: 1px solid #E3E3E3;
  border-radius: 8px;
}
.files__item:not(:last-child) {
  margin-bottom: 16px;
}

.files__icon {
  margin-right: 10px;
}
.files__icon--remove {
  margin: 0 0 0 10px;
}

.files__content {
  display: flex;
  flex-flow: column nowrap;
  flex: 1;
}

.files__name {
  font-weight: 700;
}

.files__meta {
  font-size: 12px;
}

.files__remove {
  color: #474747;
}

.downloads {
  margin: 0 0 40px;
  padding: 0;
  list-style: none;
}
.downloads--noborder .downloads__item {
  margin: 0;
  padding: 0;
}
.downloads--noborder .downloads__item--marginbottom {
  margin-bottom: 8px;
}
.downloads--noborder .downloads__item:not(:last-child) {
  margin-bottom: 8px;
  border: 0;
}
.downloads--inline {
  display: flex;
  margin: 20px -12px 40px;
  flex-flow: row wrap;
}
.downloads--inline li {
  margin-bottom: 24px;
  max-width: 33.33334%;
  flex: 0 0 33.33334%;
  padding: 0 24px 0 12px;
}
@media (max-width: 768px) {
  .downloads--inline li {
    margin: 12px 12px 0;
    padding: 0 0 12px;
    max-width: calc(100% - 24px);
    flex-basis: calc(100% - 24px);
  }
}
@media (min-width: 769px) {
  .downloads--inline li:not(:last-child) {
    border: 0;
  }
}

.downloads__item {
  display: block;
  padding: 12px 0;
}
.downloads__item:not(:last-child) {
  border-bottom: 1px solid #E3E3E3;
}

.downloads__link {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  color: var(--iftBlue);
  border-left: 1px solid;
}
.downloads__link:hover {
  text-decoration: none;
}

.downloads__meta {
  padding-left: 20px;
  color: #333;
}

.downloads__title {
  font-size: 16px;
  font-weight: 700;
  word-wrap: anywhere;
}

.downloads__filename {
  display: block;
  font-size: 12px;
  margin-top: 3px;
}

.downloads__icon {
  display: inline-flex;
  margin-left: 20px;
  flex: 0 0 32px;
  color: var(--iftBlue);
}

ol.checklist {
  margin: 0 0 40px;
  padding: 0;
  list-style: none;
}
ol.checklist > li {
  display: block;
  padding-bottom: 5px;
  padding-left: 42px;
  padding-top: 5px;
  position: relative;
}
ol.checklist > li::before {
  display: inline-block;
  height: 32px;
  left: 0;
  top: 5px;
  bottom: 5px;
  position: absolute;
  width: 32px;
}
ol.checklist--brace {
  counter-reset: counterNumber;
}
ol.checklist--brace > li::before {
  counter-increment: counterNumber;
  content: "[" counter(counterNumber) "]";
}
.o-container--centered ol.checklist {
  display: flex;
  flex-direction: column;
  align-items: center;
}

ul.checklist {
  margin: 0 0 40px;
  padding: 0;
  list-style: none;
}
ul.checklist > li {
  display: block;
  padding-bottom: 5px;
  padding-left: 42px;
  padding-top: 5px;
  position: relative;
}
ul.checklist > li::before {
  display: inline-block;
  height: 32px;
  left: 0;
  position: absolute;
  top: 0;
  width: 32px;
}
ul.checklist--plus > li::before {
  content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' fill='none' stroke='%23333333' stroke-width='1'><path d='M3.5 12.5L19.5 12.5M11.5 20.5L11.5 4.5' stroke-linecap='square'></path></svg>");
}
ul.checklist--check > li::before {
  content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' fill='none' stroke='currentcolor' stroke-width='1'><path d='M0 5.257L3.846 9 13.091 0' transform='translate(5 8)'></path></svg>");
}
ul.checklist--hint > li::before {
  content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' fill='none' stroke='currentcolor' stroke-width='1'><path d='M18 9c0 4.97-4.03 9-9 9s-9-4.03-9-9 4.03-9 9-9 9 4.03 9 9z' transform='translate(3 3)'></path><path stroke-width='1.5' d='M9 3.351L9 11.792M9 12.732L9 14.232' transform='translate(3 3)'></path></svg>");
}
ul.checklist--duplicate > li::before {
  content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' fill='none' stroke='currentcolor' stroke-width='1'><path d='M3.141 18L15 18 15 17.967 15 2.981 3.141 2.981 3.141 17.967z' transform='translate(5 3)'></path><path d='M11.859 2.981L11.859 0 0 0 0 14.986 0 15.019 3.141 15.019' transform='translate(5 3)'></path></svg>");
}
.o-container--centered ul.checklist--plus, .o-container--centered ul.checklist--check, .o-container--centered ul.checklist--hint, .o-container--centered ul.checklist--duplicate {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.checklist__item {
  display: block;
  padding: 5px 0;
}
.checklist__item a:hover {
  text-decoration: none;
}
.checklist__item a:hover .checklist__title {
  text-decoration: none;
  color: var(--highlightBlue);
}

.checklist__link {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  color: #333;
  transition: color 0.25s;
}

.checklist__icon {
  margin-right: 10px;
  flex: 0 0 32px;
}

.checklist__title {
  transition: color 0.25s;
}

.datelist {
  margin: 0;
  padding: 0;
  list-style: none;
}
.datelist--columns {
  -moz-columns: 300px 2;
       columns: 300px 2;
  -moz-column-gap: 20px;
       column-gap: 20px;
}
.datelist li {
  display: block;
  margin-bottom: 30px;
  padding-bottom: 30px;
  text-align: left;
  border-bottom: 1px solid #E3E3E3;
}
.datelist li a,
.datelist li > span {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  position: relative;
  color: #333;
}
.datelist li a:hover,
.datelist li > span:hover {
  text-decoration: none;
}
.datelist li [class^=button] {
  margin-right: 25px;
}
@media (max-width: 768px) {
  .datelist li [class^=button] {
    display: none;
  }
}
.datelist li time {
  display: flex;
  font-size: 12px;
  margin-right: 20px;
  line-height: 1.2;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  word-wrap: break-word;
  text-align: center;
  width: 51px;
  height: 51px;
  flex: 0 0 51px;
  color: #FFFFFF;
  background: var(--highlightBlue);
  border-radius: 50%;
}

.datelist__content {
  flex: 1;
  padding-right: 15px;
}

.datelist__title {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
}

.datelist__desc {
  font-size: 12px;
  letter-spacing: 0;
}

.datelist__icon {
  color: var(--iftBlue);
}

/*
Lists ul

Markup: templates/output/04-elements/lists-ul.html

Styleguide 2.12.1
*/
/*
Lists ol

Markup: templates/output/04-elements/lists-ol.html

Styleguide 2.12.2
*/
/*
Lists Download

Markup: templates/output/04-elements/lists-download.html

Styleguide 2.12.3
*/
/*
Lists Download Alt

Markup: templates/output/04-elements/lists-download-alt.html

Styleguide 2.12.4
*/
/*
Lists Check

Markup: templates/output/04-elements/lists-check.html

Styleguide 2.12.5
*/
/*
Lists with date

Markup: templates/output/04-elements/lists-with-date.html

Styleguide 2.12.6
*/
/*
Lists with date with columns

Markup: templates/output/04-elements/lists-with-date-with-columns.html

Styleguide 2.12.6
*/
/*------------------------------------*\
  #PARAGRAPH
\*------------------------------------*/
/*
Paragraph

Styleguide 2.9
*/
p {
  margin: 0 0 1em;
}
p .small, p.small {
  font-size: 14px;
}
p .smaller, p.smaller {
  font-size: 12px;
}
p .narrow, p.narrow {
  margin: 0 auto;
  width: 100%;
  max-width: 580px;
}
p.subheadline {
  margin: 0;
}
p span.secondary--color {
  color: #A3A3A3;
}

/*
Paragraph regular

Markup: templates/output/04-elements/paragraph.html

Styleguide 2.9.1
*/
/*
Paragraph small

Markup: templates/output/04-elements/paragraph-small.html

Styleguide 2.9.2
*/
/*
Paragraph small

Markup: templates/output/04-elements/paragraph-smaller.html

Styleguide 2.9.3
*/
/*
Paragraph narrow

Markup: templates/output/04-elements/paragraph-narrow.html

Styleguide 2.9.4
*/
/*------------------------------------*\
  #PRE
\*------------------------------------*/
/*
Preformatted text

Markup: templates/output/04-elements/preformattedText.html

Styleguide 2.10
*/
/*------------------------------------*\
  #TABLE
\*------------------------------------*/
/*
Table

Styling der Tabellen

Markup: templates/output/04-elements/table.html

Styleguide 2.11
*/
th,
td {
  vertical-align: top;
}

.contenttable {
  border-collapse: separate;
  border-spacing: 0;
  border: 0;
}
.contenttable thead th {
  background: #F7F7F7;
  border: none;
  white-space: nowrap;
}
.contenttable tbody td {
  border-bottom: 1px solid #E3E3E3;
}
.contenttable th,
.contenttable td {
  font-size: 14px;
  font-weight: 400;
  color: #333;
  padding: 15px;
}
.contenttable p {
  margin-bottom: 0;
}

/*
Lists

Markup: templates/output/04-elements/lists.html

Styleguide 2.12
*/
ol {
  margin-top: 0;
  padding-left: 18px;
}
.o-container--centered ol:not([class]) {
  display: flex;
  flex-direction: column;
  align-items: center;
}

ul:not([class]) {
  margin-top: 0;
  padding: 0;
  list-style: none;
}
ul:not([class]) > li {
  position: relative;
  padding-left: 18px;
  padding-top: 5px;
  padding-bottom: 5px;
}
ul:not([class]) > li::before {
  position: absolute;
  top: 21px;
  left: 0;
  width: 10px;
  height: 1px;
  background: var(--iftBlue);
  content: "";
}
@media (max-width: 768px) {
  ul:not([class]) > li::before {
    top: 10px;
  }
}
.o-container--centered ul:not([class]) {
  display: flex;
  flex-direction: column;
  align-items: center;
}

ol:not([class]) > li {
  position: relative;
  padding-top: 5px;
  padding-bottom: 5px;
}

.files,
.files__to-upload {
  margin: 0;
  padding: 0;
  list-style: none;
}

.files__item {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  padding: 10px 15px;
  color: #333;
  background: #FFFFFF;
  border: 1px solid #E3E3E3;
  border-radius: 8px;
}
.files__item:not(:last-child) {
  margin-bottom: 16px;
}

.files__icon {
  margin-right: 10px;
}
.files__icon--remove {
  margin: 0 0 0 10px;
}

.files__content {
  display: flex;
  flex-flow: column nowrap;
  flex: 1;
}

.files__name {
  font-weight: 700;
}

.files__meta {
  font-size: 12px;
}

.files__remove {
  color: #474747;
}

.downloads {
  margin: 0 0 40px;
  padding: 0;
  list-style: none;
}
.downloads--noborder .downloads__item {
  margin: 0;
  padding: 0;
}
.downloads--noborder .downloads__item--marginbottom {
  margin-bottom: 8px;
}
.downloads--noborder .downloads__item:not(:last-child) {
  margin-bottom: 8px;
  border: 0;
}
.downloads--inline {
  display: flex;
  margin: 20px -12px 40px;
  flex-flow: row wrap;
}
.downloads--inline li {
  margin-bottom: 24px;
  max-width: 33.33334%;
  flex: 0 0 33.33334%;
  padding: 0 24px 0 12px;
}
@media (max-width: 768px) {
  .downloads--inline li {
    margin: 12px 12px 0;
    padding: 0 0 12px;
    max-width: calc(100% - 24px);
    flex-basis: calc(100% - 24px);
  }
}
@media (min-width: 769px) {
  .downloads--inline li:not(:last-child) {
    border: 0;
  }
}

.downloads__item {
  display: block;
  padding: 12px 0;
}
.downloads__item:not(:last-child) {
  border-bottom: 1px solid #E3E3E3;
}

.downloads__link {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  color: var(--iftBlue);
  border-left: 1px solid;
}
.downloads__link:hover {
  text-decoration: none;
}

.downloads__meta {
  padding-left: 20px;
  color: #333;
}

.downloads__title {
  font-size: 16px;
  font-weight: 700;
  word-wrap: anywhere;
}

.downloads__filename {
  display: block;
  font-size: 12px;
  margin-top: 3px;
}

.downloads__icon {
  display: inline-flex;
  margin-left: 20px;
  flex: 0 0 32px;
  color: var(--iftBlue);
}

ol.checklist {
  margin: 0 0 40px;
  padding: 0;
  list-style: none;
}
ol.checklist > li {
  display: block;
  padding-bottom: 5px;
  padding-left: 42px;
  padding-top: 5px;
  position: relative;
}
ol.checklist > li::before {
  display: inline-block;
  height: 32px;
  left: 0;
  top: 5px;
  bottom: 5px;
  position: absolute;
  width: 32px;
}
ol.checklist--brace {
  counter-reset: counterNumber;
}
ol.checklist--brace > li::before {
  counter-increment: counterNumber;
  content: "[" counter(counterNumber) "]";
}
.o-container--centered ol.checklist {
  display: flex;
  flex-direction: column;
  align-items: center;
}

ul.checklist {
  margin: 0 0 40px;
  padding: 0;
  list-style: none;
}
ul.checklist > li {
  display: block;
  padding-bottom: 5px;
  padding-left: 42px;
  padding-top: 5px;
  position: relative;
}
ul.checklist > li::before {
  display: inline-block;
  height: 32px;
  left: 0;
  position: absolute;
  top: 0;
  width: 32px;
}
ul.checklist--plus > li::before {
  content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' fill='none' stroke='%23333333' stroke-width='1'><path d='M3.5 12.5L19.5 12.5M11.5 20.5L11.5 4.5' stroke-linecap='square'></path></svg>");
}
ul.checklist--check > li::before {
  content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' fill='none' stroke='currentcolor' stroke-width='1'><path d='M0 5.257L3.846 9 13.091 0' transform='translate(5 8)'></path></svg>");
}
ul.checklist--hint > li::before {
  content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' fill='none' stroke='currentcolor' stroke-width='1'><path d='M18 9c0 4.97-4.03 9-9 9s-9-4.03-9-9 4.03-9 9-9 9 4.03 9 9z' transform='translate(3 3)'></path><path stroke-width='1.5' d='M9 3.351L9 11.792M9 12.732L9 14.232' transform='translate(3 3)'></path></svg>");
}
ul.checklist--duplicate > li::before {
  content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' fill='none' stroke='currentcolor' stroke-width='1'><path d='M3.141 18L15 18 15 17.967 15 2.981 3.141 2.981 3.141 17.967z' transform='translate(5 3)'></path><path d='M11.859 2.981L11.859 0 0 0 0 14.986 0 15.019 3.141 15.019' transform='translate(5 3)'></path></svg>");
}
.o-container--centered ul.checklist--plus, .o-container--centered ul.checklist--check, .o-container--centered ul.checklist--hint, .o-container--centered ul.checklist--duplicate {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.checklist__item {
  display: block;
  padding: 5px 0;
}
.checklist__item a:hover {
  text-decoration: none;
}
.checklist__item a:hover .checklist__title {
  text-decoration: none;
  color: var(--highlightBlue);
}

.checklist__link {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  color: #333;
  transition: color 0.25s;
}

.checklist__icon {
  margin-right: 10px;
  flex: 0 0 32px;
}

.checklist__title {
  transition: color 0.25s;
}

.datelist {
  margin: 0;
  padding: 0;
  list-style: none;
}
.datelist--columns {
  -moz-columns: 300px 2;
       columns: 300px 2;
  -moz-column-gap: 20px;
       column-gap: 20px;
}
.datelist li {
  display: block;
  margin-bottom: 30px;
  padding-bottom: 30px;
  text-align: left;
  border-bottom: 1px solid #E3E3E3;
}
.datelist li a,
.datelist li > span {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  position: relative;
  color: #333;
}
.datelist li a:hover,
.datelist li > span:hover {
  text-decoration: none;
}
.datelist li [class^=button] {
  margin-right: 25px;
}
@media (max-width: 768px) {
  .datelist li [class^=button] {
    display: none;
  }
}
.datelist li time {
  display: flex;
  font-size: 12px;
  margin-right: 20px;
  line-height: 1.2;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  word-wrap: break-word;
  text-align: center;
  width: 51px;
  height: 51px;
  flex: 0 0 51px;
  color: #FFFFFF;
  background: var(--highlightBlue);
  border-radius: 50%;
}

.datelist__content {
  flex: 1;
  padding-right: 15px;
}

.datelist__title {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
}

.datelist__desc {
  font-size: 12px;
  letter-spacing: 0;
}

.datelist__icon {
  color: var(--iftBlue);
}

/*
Lists ul

Markup: templates/output/04-elements/lists-ul.html

Styleguide 2.12.1
*/
/*
Lists ol

Markup: templates/output/04-elements/lists-ol.html

Styleguide 2.12.2
*/
/*
Lists Download

Markup: templates/output/04-elements/lists-download.html

Styleguide 2.12.3
*/
/*
Lists Download Alt

Markup: templates/output/04-elements/lists-download-alt.html

Styleguide 2.12.4
*/
/*
Lists Check

Markup: templates/output/04-elements/lists-check.html

Styleguide 2.12.5
*/
/*
Lists with date

Markup: templates/output/04-elements/lists-with-date.html

Styleguide 2.12.6
*/
/*
Lists with date with columns

Markup: templates/output/04-elements/lists-with-date-with-columns.html

Styleguide 2.12.6
*/
/*
Alerts

Markup: templates/output/04-elements/alerts.html

Styleguide 2.13
*/
.alert {
  display: flex;
  font-size: 12px;
  margin-bottom: 15px;
  padding: 10px 13px;
  color: #FFFFFF;
  box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.2);
  flex-flow: row nowrap;
  align-items: center;
}
.alert--danger {
  background: #F77874;
}
.alert--warning {
  background: #F7B274;
}
.alert--success {
  background: #7DE5A1;
}
.alert--info {
  background: #7ECEFF;
}
.alert span {
  text-align: left;
}

.alert-icon {
  margin-right: 8px;
}

/*------------------------------------*\
  #OBJECTS
\*------------------------------------*/
/**
 * “Users of OOCSS will be familiar with the concept of objects. This is the
 * first layer in which we find class-based selectors. These are concerned with
 * styling non-cosmetic design patterns, or 'objects'. Objects can range from
 * something as simple as a .wrapper element, to layout systems, through to
 * things like the OOCSS poster child – the Media Object. This layer affects
 * less of the DOM than the last layer, has a higher specificity, and is
 * slightly more explicit in that we are now targeting sections of the DOM with
 * classes.”
 *
 * (Source: see link at the top)
 */
/*
Objects

Styleguide 3.0
*/
/*------------------------------------*\
  #TABLE-RWD
\*------------------------------------*/
/*
Responsive table

Markup: templates/output/05-objects/table-rwd.html

Styleguide 3.2
*/
.table-rwd {
  position: relative;
}
.table-rwd::after {
  display: none;
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 50px;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.5), #FFFFFF);
  transition: opacity 0.3s ease 0s;
}
.table-rwd:hover::after {
  opacity: 0;
}
.table-rwd__overflow {
  margin: 0 0 1em;
  width: 100%;
  overflow-x: auto;
}
.table-rwd__overflow::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 14px;
  height: 14px;
}
.table-rwd__overflow::-webkit-scrollbar-thumb {
  border-radius: 8px;
  border: 3px solid #FFFFFF;
  background-color: rgba(0, 0, 0, 0.3);
}

/*------------------------------------*\
  #FLEX-LINE
\*------------------------------------*/
/*
Flex line

normal - analog zu Start
start - Elemente linksbündig
between - Elemente mit gleichem Abstand zueinander
center - Elemente zentriert
around - Elemente mit gleichem Abstand herum
end - Elemente rechtsbündig
row-reverse - Elemente in umgekehrter Reihenfolge

Markup: templates/output/05-objects/flex-line.html

Styleguide 3.1
*/
.o-flex-line {
  display: flex;
  flex-wrap: wrap;
}
.o-flex-line--between {
  justify-content: space-between;
}
.o-flex-line--center {
  justify-content: center;
}
.o-flex-line--around {
  justify-content: space-around;
}
.o-flex-line--end {
  justify-content: flex-end;
}
.o-flex-line--items-end {
  align-items: flex-end;
}
.o-flex-line--row-reverse {
  flex-direction: row-reverse;
}
.o-flex-line--column {
  flex-direction: column;
}

/*------------------------------------*\
  #FLAG-OBJECT
\*------------------------------------*/
/*
Flag

Simple object to place media elements and text beside each other. It’s like
Nicole Sullivans famous media object, but comes with the ability to change it’s
alignments. You may read more about it at
<a href="https://csswizardry.com/2013/05/the-flag-object/" title="Visit Harry Roberts blog post">
Harry Roberts blog</a>.

top - Align media element at the top edge.
middle - Align media element in the middle of the text.
bottom - Align media element at the bottom edge.
reverse - Swap media element and text.
middle-body-only - Align the text centered to the media element if it’s larger.

Markup: templates/output/05-objects/flag.html

Styleguide 3.3
*/
.o-flag {
  display: flex;
}
.o-flag--top {
  align-items: flex-start;
}
.o-flag--middle {
  align-items: center;
}
.o-flag--bottom {
  align-items: flex-end;
}
.o-flag--reverse {
  flex-direction: row-reverse;
}
.o-flag__media {
  padding-right: 1em;
}
.o-flag--reverse .o-flag__media {
  padding-left: 1em;
  padding-right: 0;
}
.o-flag__body {
  width: 100%;
}
.o-flag--middle-body-only .o-flag__body {
  align-self: center;
}

/*------------------------------------*\
  #LIST-BARE
\*------------------------------------*/
/*
List bare/unstyled

Markup: templates/output/05-objects/list-bare.html

Styleguide 3.4
*/
.o-list-bare {
  list-style: none;
  padding-left: 0;
}

/*------------------------------------*\
  #LIST-INLINE
\*------------------------------------*/
/*
List inline

Markup: templates/output/05-objects/list-inline.html

Styleguide 3.5
*/
.o-list-inline {
  padding-left: 0;
  list-style: none;
}
.o-list-inline__item {
  display: inline-block;
}

/*
Container

o-container--fullwidth - full width container
o-container--nospacing - no padding
o-container--spacing-y - top and bottom padding
o-container--outside-spacing-y - top and bottom margin

Markup: templates/output/05-objects/container.html

Styleguide 3.6
*/
.o-container {
  margin: 0 auto;
  padding: 0 20px;
  position: relative;
}
@media screen and (min-width: 768px) {
  .o-container {
    max-width: 1220px;
  }
}
.o-container > .o-container {
  padding-left: 0;
  padding-right: 0;
}
.o-container .o-container {
  padding-left: 0;
  padding-right: 0;
}
.o-container--small {
  max-width: 580px;
}
.o-container--fullwidth {
  padding: 0;
  max-width: 100% !important;
}
.o-container .o-container--fullwidth {
  position: relative;
}
.o-container .o-container--fullwidth::after {
  content: "";
  position: absolute;
  margin-left: -50vw;
  margin-right: -50vw;
  right: 50%;
  left: 50%;
  height: 100%;
  top: 0;
  z-index: -1;
  background-color: inherit;
}
.o-container--centered {
  text-align: center;
}
.o-container--nospacing {
  padding: 0;
}
.o-container--spacing-y {
  padding-top: 20px;
  padding-bottom: 20px;
}
.o-container--outside-spacing-y {
  margin-top: 20px;
  margin-bottom: 20px;
}
.o-container.event-before-sharebar .mb-3 {
  margin-bottom: 0 !important;
}

/*
Grid

Markup: templates/output/05-objects/grid.html

Styleguide 3.7
*/
.o-container__row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-right: -10px;
  margin-left: -10px;
}
@media (max-width: 768px) {
  .o-container__row {
    margin-right: -8px;
    margin-left: -8px;
  }
}
.o-container__row--vertical-center {
  align-items: center;
}
.o-container__row.demo {
  margin-bottom: 52px;
}

.col__1,
.col__2,
.col__3,
.col__4,
.col__5,
.col__6,
.col__7,
.col__8,
.col__9,
.col__10,
.col__11,
.col__12 {
  position: relative;
  width: 100%;
  min-height: 1px;
  padding-right: 10px;
  padding-left: 10px;
}
@media (max-width: 768px) {
  .col__1,
.col__2,
.col__3,
.col__4,
.col__5,
.col__6,
.col__7,
.col__8,
.col__9,
.col__10,
.col__11,
.col__12 {
    padding-right: 8px;
    padding-left: 8px;
  }
}
.col__1 .demo,
.col__2 .demo,
.col__3 .demo,
.col__4 .demo,
.col__5 .demo,
.col__6 .demo,
.col__7 .demo,
.col__8 .demo,
.col__9 .demo,
.col__10 .demo,
.col__11 .demo,
.col__12 .demo {
  height: 184px;
  background: #EBEBEB;
}

.col__1 {
  flex: 0 0 8.333333%;
  max-width: 8.333333%;
}
@media (max-width: 768px) {
  .col__1 {
    max-width: 100%;
    flex-basis: 100%;
  }
}

.col__2 {
  flex: 0 0 16.666667%;
  max-width: 16.666667%;
}
@media (max-width: 768px) {
  .col__2 {
    max-width: 100%;
    flex-basis: 100%;
  }
}

.col__3 {
  flex: 0 0 25%;
  max-width: 25%;
}
@media (max-width: 768px) {
  .col__3 {
    max-width: 100%;
    flex-basis: 100%;
  }
}

.col__4 {
  flex: 0 0 33.33334%;
  max-width: 33.33334%;
}
@media (max-width: 768px) {
  .col__4 {
    max-width: 100%;
    flex-basis: 100%;
  }
}

.col__5 {
  flex: 0 0 41.666667%;
  max-width: 41.666667%;
}
@media (max-width: 768px) {
  .col__5 {
    max-width: 100%;
    flex-basis: 100%;
  }
}

.col__6 {
  flex: 0 0 50%;
  max-width: 50%;
}
@media (max-width: 768px) {
  .col__6 {
    max-width: 100%;
    flex-basis: 100%;
  }
}

.col__7 {
  flex: 0 0 58.333333%;
  max-width: 58.333333%;
}
@media (max-width: 768px) {
  .col__7 {
    max-width: 100%;
    flex-basis: 100%;
  }
}

.col__8 {
  flex: 0 0 66.666667%;
  max-width: 66.666667%;
}
@media (max-width: 768px) {
  .col__8 {
    max-width: 100%;
    flex-basis: 100%;
  }
}

.col__9 {
  flex: 0 0 75%;
  max-width: 75%;
}
@media (max-width: 768px) {
  .col__9 {
    max-width: 100%;
    flex-basis: 100%;
  }
}

.col__10 {
  flex: 0 0 83.333333%;
  max-width: 83.333333%;
}
@media (max-width: 768px) {
  .col__10 {
    max-width: 100%;
    flex-basis: 100%;
  }
}

.col__11 {
  flex: 0 0 91.666667%;
  max-width: 91.666667%;
}
@media (max-width: 768px) {
  .col__11 {
    max-width: 100%;
    flex-basis: 100%;
  }
}

.col__12 {
  flex: 0 0 100%;
  max-width: 100%;
}
@media (max-width: 768px) {
  .col__12 {
    max-width: 100%;
    flex-basis: 100%;
  }
}

/*------------------------------------*\
  #COMPONENTS
\*------------------------------------*/
/**
 * “The Components layer is where we begin to style recognisable pieces of UI.
 * We're still binding onto classes here, so our specificity hasn't yet
 * increased. However, this layer is more explicit than the last one in that we
 * are now styling explicit, designed pieces of the DOM.
 *
 * We shouldn't find any selectors with a lower specificity than one class in
 * this layer. This is where the majority of your work will happen after initial
 * project set-up. Adding new components and features usually makes up the vast
 * majority of development.”
 *
 * (Source: see link at the top)
 */
/*
Components

Styleguide 4.0
*/
/*
Image-tiles

Styleguide 4.1
*/
.image-tiles__container {
  -moz-column-count: 2;
       column-count: 2;
}
@media (max-width: 992px) {
  .image-tiles__container {
    -moz-column-count: 1;
         column-count: 1;
  }
}
.image-tiles__container [class^=button] {
  color: #FFFFFF;
}
.image-tiles__container .image-tiles__item {
  display: inline-grid;
  position: relative;
  width: 100%;
  margin-bottom: 10px;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  transition: 0.25s ease;
}
.image-tiles__container .image-tiles__item::before {
  position: absolute;
  bottom: 0;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), #333);
  content: "";
  height: 190px;
  width: 100%;
  transition: 0.25s ease 0s;
}
@media (max-width: 768px) {
  .image-tiles__container .image-tiles__item {
    margin-bottom: 15px;
  }
}
@media (max-width: 480px) {
  .image-tiles__container .image-tiles__item {
    height: 300px;
  }
}
@media (min-width: 768px) {
  .image-tiles__container .image-tiles__item:hover {
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.3);
  }
  .image-tiles__container .image-tiles__item:hover:before {
    height: 100%;
    z-index: 11;
  }
  .image-tiles__container .image-tiles__item:hover .image-tiles__description {
    max-height: 100%;
    opacity: 1;
    margin-bottom: 12px;
  }
}

.image-tiles__text {
  position: absolute;
  width: 100%;
  padding: 25px;
  bottom: 0;
  color: #FFFFFF;
  z-index: 12;
}

.image-tiles__subheadline {
  font-size: 12px;
  font-weight: bold;
  margin-bottom: 12px;
}

.image-tiles__headline {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 12px;
}

@media (max-width: 480px) {
  .image-tiles__subheadline,
.image-tiles__headline {
    margin-bottom: 8px;
  }
}
.image-tiles__playicon {
  color: #FFFFFF;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.image-tiles__category {
  font-size: 14px;
}

.image-tiles__description {
  font-size: 16px;
  max-height: 0;
  opacity: 0;
  padding-bottom: 2px;
  overflow: hidden;
}

.image-tiles__item--small {
  height: 380px;
}
.image-tiles__item--large {
  height: 485px;
}
.image-tiles__item--video {
  height: 380px;
  overflow: hidden;
  cursor: pointer;
}
@media (max-width: 768px) {
  .image-tiles__item--video {
    height: auto !important;
  }
}
.image-tiles__item--video .image-tiles__subheadline {
  margin-bottom: 5px;
  font-weight: 400;
}
.image-tiles__item--video .image-tiles__headline {
  margin-bottom: 0;
}
.image-tiles__item--video .image-tiles__description {
  margin-top: 10px;
}
@media (max-width: 768px) {
  .image-tiles__item--video .image-tiles__description {
    display: block;
    max-height: initial;
    opacity: 1;
  }
}
@media (min-width: 769px) {
  .image-tiles__item--video .image-tiles__text {
    padding-bottom: 15px;
  }
}
@media (max-width: 768px) {
  .image-tiles__item--video .image-tiles__text {
    position: relative;
    bottom: auto;
    background: #333;
  }
}

.image-tiles__thumb {
  display: none;
}
@media (max-width: 768px) {
  .image-tiles__thumb {
    display: block;
    width: 100%;
  }
}

.image-tiles__item--alternative {
  display: inline-grid;
  position: relative;
  width: 100%;
  height: 360px;
  margin-bottom: 75px;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  transition: 0.25s ease;
  align-items: flex-end;
}
@media (max-width: 480px) {
  .image-tiles__item--alternative {
    height: 300px;
  }
}
@media (min-width: 768px) {
  .image-tiles__item--alternative:hover {
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.3);
  }
}
.image-tiles__item--alternative .image-tiles__subheadline {
  color: var(--highlightBlue);
  font-size: 12px;
  font-weight: bold;
  margin-bottom: 8px;
}
.image-tiles__item--alternative .image-tiles__headline {
  color: #333;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 12px;
}
.image-tiles__item--alternative .image-tiles__category {
  color: #333;
  font-size: 14px;
}
.image-tiles__item--alternative .image-tiles__text {
  display: flex;
  position: absolute;
  left: 40px;
  transform: translateY(40%);
  width: 340px;
  min-height: 153px;
  padding: 25px;
  background: #FFFFFF;
  border-radius: 8px;
  box-shadow: 0 0 20px 0 rgba(71, 71, 71, 0.2);
  flex-flow: column nowrap;
  justify-content: flex-end;
}
@media (max-width: 992px) {
  .image-tiles__item--alternative .image-tiles__text {
    margin-top: -50px;
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
    position: relative;
    top: auto;
    right: auto;
    left: auto;
    transform: translateY(20%);
    min-width: initial;
    width: 80%;
    max-width: 350px;
    min-height: 153px;
    height: -webkit-min-content;
    height: -moz-min-content;
    height: min-content;
  }
}
@media (max-width: 480px) {
  .image-tiles__item--alternative .image-tiles__text {
    max-width: initial;
  }
}

.image-tiles__item--reverse {
  margin-top: 85px;
  margin-bottom: 0;
}
.image-tiles__item--reverse .image-tiles__text {
  right: 40px;
  left: auto;
}
@media (max-width: 992px) {
  .image-tiles__item--reverse .image-tiles__text {
    margin-left: auto;
    margin-right: auto;
    right: auto;
    left: auto;
  }
}
@media (max-width: 992px) {
  .image-tiles__item--reverse {
    margin-bottom: 85px;
    margin-top: 0;
    flex-flow: column nowrap;
  }
}

/*
4 Tiles

Markup: templates/output/06-components/image-tiles-four.html

Styleguide 4.1.1
*/
/*
8 Tiles

Markup: templates/output/06-components/image-tiles-eight.html

Styleguide 4.1.2
*/
/*
Alternative

Markup: templates/output/06-components/image-tiles-alternative.html

Styleguide 4.1.3
*/
/*
Videos

Markup: templates/output/06-components/image-tiles-videos.html

Styleguide 4.1.4
*/
.video__container {
  display: none;
  align-items: center;
  justify-content: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 20px;
  z-index: 14;
}

.video__container__overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(71, 71, 71, 0.1);
}
.video__container__overlay:before {
  position: absolute;
  top: -40px;
  right: -40px;
  bottom: -40px;
  left: -40px;
  background: #FFFFFF;
  content: "";
  filter: blur(20px);
  opacity: 0.75;
}

@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) {
  .video__container__overlay {
    -webkit-backdrop-filter: blur(6px);
            backdrop-filter: blur(6px);
  }
  .video__container__overlay:before {
    display: none;
  }
}
.video__container__inner {
  position: relative;
  width: 100%;
  max-width: 980px;
  background: #474747;
  -webkit-clip-path: inset(1px 1px);
          clip-path: inset(1px 1px);
  z-index: 11;
}

.video__container__embed {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
}
.video__container__embed iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.video__container__close {
  position: fixed;
  top: 20px;
  right: 20px;
  color: var(--highlightBlue);
  z-index: 11;
  cursor: pointer;
}

/*
Share

Styleguide 4.2
*/
.share__list {
  margin: 0;
  position: absolute;
  top: 0;
  left: 120px;
  min-height: 280px;
  padding: 0;
  list-style: none;
  opacity: 1;
}
@media (max-width: 768px) {
  .share__list {
    display: none;
  }
}
.share__list--hidden {
  opacity: 0;
}
.share__list li {
  display: block;
}
.share__list li:not(:last-child) {
  margin-bottom: 8px;
}
.share__list a {
  display: block;
  color: #A3A3A3;
  transition: color 0.25s;
}
.share__list a:hover {
  color: var(--highlightBlue);
}
.share__list svg {
  display: block;
}

.share__bar {
  margin-top: -40px;
  width: 100%;
  background: #F7F7F7;
  position: sticky;
  top: 0;
  opacity: 0;
  z-index: 1336;
}
.share__bar::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -9999px;
  right: 0;
  border-left: 9999px solid #F7F7F7;
  box-shadow: 9999px 0 0 #F7F7F7;
  content: "";
}
.share__bar--visible {
  opacity: 1;
  position: fixed;
  margin-top: 0;
}
.share__bar li {
  display: block;
  margin: 0 8px;
  font-size: 12px;
}
.share__bar:not(.no-share) li:nth-child(2) {
  position: relative;
  margin-right: 20px;
}
.share__bar:not(.no-share) li:nth-child(2)::after {
  position: absolute;
  top: 0;
  right: -16px;
  bottom: 0;
  width: 1px;
  background: #A3A3A3;
  content: "";
}
.share__bar a {
  display: block;
  color: #A3A3A3;
  transition: color 0.25s;
}
.share__bar a:hover {
  color: var(--highlightBlue);
}
.share__bar svg {
  display: block;
}

.share__bar__inner {
  display: flex;
  margin: 0;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
  position: sticky;
  top: 0;
  padding: 8px;
  list-style: none;
  text-align: center;
}

.share__modal {
  display: none;
  align-items: center;
  justify-content: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
  background-color: rgba(71, 71, 71, 0.1);
  z-index: 10;
}

.share__modal__inner {
  width: 100%;
  max-width: 680px;
  padding: 60px 100px 40px;
  background: #FFFFFF;
  text-align: center;
}
@media (max-width: 768px) {
  .share__modal__inner {
    padding: 40px 20px;
  }
}

.share__modal__link {
  margin: 30px 0;
  font-size: 12px;
  text-align: left;
  padding: 12px 18px;
  color: #A3A3A3;
  background: #FFFFFF;
  border: 1px solid var(--highlightBlue);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.share__modal__list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.share__modal__list br {
  display: none;
}
@media (max-width: 768px) {
  .share__modal__list br {
    display: block;
  }
}
.share__modal__list li {
  display: inline-block;
  margin: 0 10px 20px;
}
.share__modal__list a {
  display: block;
  color: var(--highlightBlue);
  border: 1px solid #E3E3E3;
  border-radius: 50%;
  padding: 5px;
}
.share__modal__list svg {
  display: block;
}

.share__circles {
  margin: 60px 0;
  position: relative;
  padding: 0;
  list-style: none;
  text-align: center;
}
@media (max-width: 768px) {
  .share__circles {
    margin: 30px 0;
  }
}
.share__circles::before {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 1px;
  background: #C6C7C9;
  transform: translateY(-50%);
  z-index: -1;
  content: "";
}
.share__circles li {
  display: inline;
  margin: 0 7px 14px;
}
.share__circles a {
  display: inline-block;
  padding: 8px;
  color: var(--iftBlue);
  background: #FFFFFF;
  border: 1px solid #C6C7C9;
  border-radius: 50%;
}
.share__circles a:hover {
  border-color: var(--highlightBlue);
}
.share__circles svg {
  display: block;
}

.share__sidebar {
  position: absolute;
  top: 0;
  right: 0;
  width: 180px;
}
@media (max-width: 768px) {
  .share__sidebar {
    margin-bottom: 30px;
    padding: 0 8px;
    position: relative;
    top: auto;
    right: auto;
    width: 100%;
  }
}
.share__sidebar p {
  margin-bottom: 20px;
}
@media (max-width: 768px) {
  .share__sidebar p {
    display: inline-block;
    margin-right: 20px;
  }
  .share__sidebar p:last-child {
    margin-right: 0;
  }
}
.share__sidebar a {
  color: var(--highlightBlue);
  text-decoration: none;
}
.share__sidebar a:hover, .share__sidebar a:focus {
  color: #474747;
}

.share__sidebar__thumb {
  width: 50px;
  height: 50px;
  margin-bottom: 10px;
  border-radius: 50%;
  background-color: #F7F7F7;
  overflow: hidden;
}
.share__sidebar__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.knowledgefinder-author-pictures {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
}
.knowledgefinder-author-pictures .share__sidebar__thumb {
  margin-bottom: 0;
}

/*
Share

Markup: templates/output/06-components/share.html

Styleguide 4.2.1
*/
/*
Share-with-sidebar

Markup: templates/output/06-components/share-with-sidebar.html

Styleguide 4.2.2
*/
/*
Solution finder

Markup: templates/output/06-components/filters.html

Styleguide 4.3
*/
.filters {
  text-align: center;
}

.filters__header {
  display: flex;
  flex-flow: row nowrap;
  align-items: flex-start;
  justify-content: space-between;
  padding: 32px 0 20px;
  border-bottom: 1px solid #E3E3E3;
}
@media (max-width: 768px) {
  .filters__header {
    display: block;
    padding-bottom: 10px;
  }
}

.filters__selected {
  display: flex;
  flex-flow: row nowrap;
  align-items: flex-start;
}
@media (max-width: 768px) {
  .filters__selected {
    flex-flow: column nowrap;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #E3E3E3;
  }
}
.filters__selected--notempty .filters__selected__text {
  display: none;
}
.filters__selected--notempty .filters__selected__text--hidden {
  display: inline-block;
}
.filters__selected--notempty .filters__selected__item {
  display: inline-flex;
}
.filters__selected--notempty .filters__selected__item--divider {
  display: none;
}
@media (max-width: 768px) {
  .filters__selected--notempty .filters__selected__item--divider {
    display: inline-flex;
  }
}

.filters__selected__text {
  margin: 0 0 7px;
  padding: 7px 20px 7px 0;
  white-space: nowrap;
}
.filters__selected__text--hidden {
  display: none;
}

.filters__selected__list {
  display: flex;
  margin: 0;
  padding: 0;
  flex-flow: row wrap;
  text-align: left;
  list-style: none;
  width: 100%;
}

.filters__selected__item {
  margin-bottom: 12px;
}
.filters__selected__item:not(:last-child) {
  margin-right: 12px;
}
.filters__selected__item--divider {
  display: none;
}
@media (max-width: 768px) {
  .filters__selected__item--divider {
    display: inline-flex;
    margin: 10px 0 0;
    padding: 20px 0 0;
    border: 0;
    max-width: 100%;
    flex: 0 0 100%;
    border-top: 1px solid #E3E3E3;
    border-radius: 0;
  }
}
.filters__selected__item--remove {
  position: relative;
  margin-right: 0;
  margin-left: 24px;
  order: 9;
  color: var(--highlightBlue);
}
@media (max-width: 768px) {
  .filters__selected__item--remove {
    margin-left: 0;
  }
}

.filters__selected__icon {
  margin-left: 10px;
  vertical-align: bottom;
}

.filters__trigger {
  display: flex;
  padding: 7px 0 7px 20px;
  line-height: 1.5;
  letter-spacing: 0.8px;
  color: var(--highlightBlue);
  flex-flow: row nowrap;
  align-items: center;
  cursor: pointer;
  white-space: nowrap;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  transition: color 0.25s;
}
@media (max-width: 768px) {
  .filters__trigger {
    padding-left: 0;
    justify-content: space-between;
  }
}
.filters__trigger .icon-open,
.filters__trigger .icon-close {
  margin-left: 10px;
  transform: translateX(6px);
}
.filters__trigger .icon-close {
  display: none;
}
.filters__trigger--opened .filter__trigger__text {
  display: none;
}
.filters__trigger--opened .filter__trigger__text--hidden {
  display: block;
}
.filters__trigger--opened .icon-open {
  display: none;
}
.filters__trigger--opened .icon-close {
  display: block;
}

.filter__trigger__text--hidden {
  display: none;
}

.filters__options {
  display: none;
  letter-spacing: 0.8px;
}
.filters__options--filtered {
  display: block;
}

.filters__columns {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  position: relative;
}
.filters__columns::after {
  position: absolute;
  bottom: 50px;
  left: 0;
  right: 0;
  height: 1px;
  background: #E3E3E3;
}
@media (min-width: 769px) {
  .filters__columns {
    padding-bottom: 100px;
  }
  .filters__columns::after {
    content: "";
  }
}
@media (max-width: 768px) {
  .filters__columns {
    flex-flow: column nowrap;
  }
}

.filters__column {
  text-align: left;
}
@media (min-width: 769px) {
  .filters__column {
    max-width: 30%;
    flex: 0 0 30%;
  }
  .filters__column:not(:last-child) {
    padding-right: 5%;
  }
}
@media (max-width: 768px) {
  .filters__column:not(:last-child) {
    margin-bottom: 15px;
  }
}

.filters__column__title {
  display: flex;
  margin-bottom: 12px;
  font-weight: 700;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
}
@media (max-width: 768px) {
  .filters__column__title {
    font-size: 14px;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid #E3E3E3;
    cursor: pointer;
  }
}
.filters__column__title--opened .filters__column__icon {
  transform: rotate(180deg);
}

.filters__column__icon {
  transition: transform 0.25s;
}
@media (min-width: 769px) {
  .filters__column__icon {
    display: none;
  }
}

.filters__column__content {
  display: none;
}
@media (min-width: 769px) {
  .filters__column__content {
    display: block !important;
  }
}
@media (max-width: 768px) {
  .filters__column__content {
    margin-bottom: 40px;
  }
}

.filters__column__list {
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
}

.filters__column__item {
  display: block;
  font-size: 14px;
}
.filters__column__item:not(:last-child) {
  padding-bottom: 10px;
}
.filters__column__item--hidden {
  display: none;
}

.filters__option {
  display: flex;
  position: relative;
  padding-right: 20px;
  text-decoration: none;
  color: #333;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  transition: color 0.25s;
}
.filters__option:hover {
  text-decoration: none;
}
.filters__option--selected {
  color: var(--highlightBlue);
}
.filters__option--selected .filters__option__icon {
  display: block;
}
.filters__option--disabled {
  color: #A3A3A3;
  cursor: not-allowed;
}
.filters__option--disabled:hover {
  color: #A3A3A3;
}
.filters__option--disabled .tooltip__trigger {
  display: inline-block;
  width: 16px;
  height: 16px;
  cursor: default;
}

.filters__option__icon {
  display: none;
  position: absolute;
  top: 1px;
  right: 0;
}

.filters__more {
  display: none;
}
.filters__more--opened .filters__more__text {
  display: none;
}
.filters__more--opened .filters__more__text--hidden {
  display: inline-block;
}
.filters__more--opened .filters__more__icon {
  transform: rotate(180deg);
}

.filters__more__text--hidden {
  display: none;
}

.filters__more__icon {
  margin-left: 10px;
  padding: 4px;
  transition: transform 0.25s;
  vertical-align: bottom;
}

.filters__button {
  margin: 25px auto 40px;
}
@media (min-width: 769px) {
  .filters__button {
    display: none;
  }
}

/*
Tiles

Styleguide 4.4
*/
.tiles__header {
  display: flex;
  font-size: 14px;
  padding-bottom: 15px;
  max-width: 100%;
  flex-basis: 100%;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
@media (max-width: 768px) {
  .tiles__header {
    padding-bottom: 15px;
    flex-flow: column-reverse nowrap;
    align-items: flex-start;
  }
}
.tiles__header > * {
  margin-bottom: 10px;
}
.tiles__header [class^=button] {
  display: block;
}

.tiles__select {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  position: relative;
  font-size: 14px;
}
@media (max-width: 768px) {
  .tiles__select {
    width: 100%;
  }
}
.tiles__select select {
  font-size: 14px;
  font-weight: 700;
  flex: 1;
  min-width: 150px;
  margin-left: 5px;
  padding: 0 1rem 0 0;
  color: #333;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  cursor: pointer;
}
.tiles__select select::-ms-expand {
  display: none;
}
.tiles__select option {
  color: #333;
}

.tiles__select__icon {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  pointer-events: none;
}

.tiles__list--masonry {
  margin-right: -20px;
}
.tiles__list--masonry .tile-sizer, .tiles__list--masonry .tile {
  width: calc(100% - 20px);
}
@media screen and (min-width: 700px) {
  .tiles__list--masonry .tile-sizer, .tiles__list--masonry .tile {
    width: calc(50% - 20px);
  }
}
@media screen and (min-width: 1000px) {
  .tiles__list--masonry .tile-sizer, .tiles__list--masonry .tile {
    width: calc(33.333% - 20px);
  }
}
.tiles__list--masonry .tile {
  display: block;
}
.tiles__list--wmasonry.image-tiles__container {
  -moz-column-count: unset;
       column-count: unset;
  margin-right: -20px;
}
.tiles__list--wmasonry.image-tiles__container .tile-sizer, .tiles__list--wmasonry.image-tiles__container .tile {
  width: calc(100% - 20px);
}
@media screen and (min-width: 700px) {
  .tiles__list--wmasonry.image-tiles__container .tile-sizer, .tiles__list--wmasonry.image-tiles__container .tile {
    width: calc(50% - 20px);
  }
}
.tiles__list--wmasonry.image-tiles__container .tile {
  display: block;
}
.tiles__list--wmasonry.image-tiles__container .tile:nth-child(4n+3) .image-tiles__item {
  height: 485px;
}
.tiles__list--wmasonry.image-tiles__container .tile:nth-child(4n+3) + .tile .image-tiles__item {
  height: 485px;
}
.tiles__list--wmasonry.image-tiles__container .image-tiles__item {
  display: block;
  margin-bottom: 0;
}
.tiles__list--finder {
  display: flex;
  flex-flow: row wrap;
  -moz-column-count: 1;
       column-count: 1;
  -moz-column-gap: 0;
       column-gap: 0;
}
.tiles__list--finder .tile {
  max-width: 50%;
  flex: 0 0 50%;
  padding: 0 10px;
}
@media (max-width: 768px) {
  .tiles__list--finder .tile {
    max-width: 100%;
    flex-basis: 100%;
  }
}
.tiles__list--knowledge .tile {
  max-width: 50%;
  flex: 0 0 50%;
  padding: 0 10px;
}
@media (max-width: 768px) {
  .tiles__list--knowledge .tile {
    max-width: 100%;
    flex-basis: 100%;
  }
}
.tiles__list--same-height {
  display: flex;
  margin: 0 -10px;
  flex-flow: row wrap;
  -moz-column-count: 1;
       column-count: 1;
  -moz-column-gap: 0;
       column-gap: 0;
}
.tiles__list--same-height .tile {
  max-width: 33.33334%;
  flex: 0 0 33.33334%;
  padding: 0 10px;
}
@media (max-width: 768px) {
  .tiles__list--same-height .tile {
    max-width: 100%;
    flex-basis: 100%;
  }
}
.tiles__list--same-height .tile__inner {
  height: 100%;
}
.tiles__list--same-height .tile__categories {
  font-size: 14px;
}
.tiles__list--same-height .tile__pretitle {
  margin-bottom: 5px;
  font-size: 18px;
}
.tiles__list--same-height .tile__title {
  font-size: 18px;
  font-weight: 700;
}
.tiles__list--same-height .tile__desc {
  margin: 0;
  font-size: 14px;
}

.tile {
  display: table;
  color: #333;
  text-decoration: none;
  page-break-inside: avoid;
  -moz-column-break-inside: avoid;
       break-inside: avoid-column;
  margin-bottom: 20px;
}
.tile:hover {
  text-decoration: none;
}
.tile:hover .tile__inner {
  box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.15);
}
.tile--highlight {
  display: block;
  max-width: 100%;
  flex-basis: 100%;
}
.tile--highlight .image-tiles__item:before {
  position: absolute;
  bottom: 0;
  background: linear-gradient(0deg, #474747 0%, rgba(255, 255, 255, 0) 100%);
  content: "";
  height: 190px;
  width: 100%;
  transition: 0.25s ease 0s;
}
@media (min-width: 768px) {
  .tile--highlight .image-tiles__item:hover {
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.3);
  }
  .tile--highlight .image-tiles__item:hover:before {
    height: 100%;
    z-index: 11;
  }
  .tile--highlight .image-tiles__item:hover .image-tiles__description {
    max-height: 100%;
    opacity: 1;
    margin-bottom: 12px;
  }
}
.tile--highlight .image-tiles__item.image-tiles__item--small {
  height: 500px;
}
.tile--highlight .tile__content {
  max-width: 750px;
  padding: 60px 27px;
}

.tile__inner {
  position: relative;
  background: #FFFFFF;
  border: solid 1px #E3E3E3;
  box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0);
  transition: box-shadow 0.25s;
}

.tile__badge {
  font-size: 14px;
  font-weight: 700;
  font-style: italic;
  line-height: 1.5;
  letter-spacing: 0.8px;
  text-align: center;
  position: absolute;
  top: -8px;
  left: 20px;
  color: #FFFFFF;
  padding: 3px 15px 3px 14px;
  background-color: var(--highlightBlue);
  box-shadow: 0 1px 2px 0 rgba(9, 5, 5, 0.25);
}
.tile__badge::before, .tile__badge::after {
  position: absolute;
  top: 0;
  width: 0;
  height: 0;
  border-style: solid;
  content: "";
}
.tile__badge::before {
  left: -8px;
  border-width: 0 0 8px 8px;
  border-color: transparent transparent var(--highlightBlueDarker) transparent;
}
.tile__badge::after {
  right: -8px;
  border-width: 8px 0 0 8px;
  border-color: transparent transparent transparent var(--highlightBlueDarker);
}

.tile__thumb {
  display: block;
  width: 100%;
  overflow: hidden;
}

.tile__img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.tile__img * {
  display: block;
  width: 100%;
}

.tile__content {
  margin: 0 auto;
  width: 100%;
  padding: 40px 27px;
}
@media (max-width: 576px) {
  .tile__content {
    padding: 25px 20px;
  }
}

.tile__content__header {
  display: flex;
  margin: -20px 0 20px;
  flex-flow: row wrap;
}
@media (max-width: 768px) {
  .tile__content__header {
    margin-top: 0;
  }
}
.tile__content__header > * {
  margin-bottom: 8px;
}
.tile__content__header > *:not(:last-child) {
  margin-right: 15px;
}

.tile__location,
.tile__date {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  font-size: 14px;
}

.tile__date__icon {
  margin-right: 5px;
}

.tile__categories {
  display: block;
  margin: 0 0 10px;
  padding: 0;
  list-style: none;
  overflow: hidden;
}
.tile__categories li {
  display: inline-block;
  color: var(--highlightBlue);
  float: left;
}
.tile__categories li:not(:last-child) {
  margin-right: 5px;
}
.tile__categories li:not(:last-child)::after {
  content: ", ";
}

.tile__title {
  font-size: 24px;
  line-height: 1.1;
  font-weight: 500;
  letter-spacing: 1.1px;
  margin-top: 0;
  color: #333;
}
.tile__title--strong {
  font-weight: 700;
}

.tile__desc {
  display: block;
  margin-top: 15px;
}

/*
Tiles with header

Markup: templates/output/06-components/tiles-with-header.html

Styleguide 4.4.1
*/
/*
Tiles without header

Markup: templates/output/06-components/tiles-without-header.html

Styleguide 4.4.2
*/
/*
Tiles highlighted

Markup: templates/output/06-components/tiles-highlighted.html

Styleguide 4.4.3
*/
/*
Tiles with header for News

Markup: templates/output/06-components/tiles-with-header-for-news.html

Styleguide 4.4.4
*/
/*
Tiles without header for News

Markup: templates/output/06-components/tiles-without-header-for-news.html

Styleguide 4.4.5
*/
/*
Tiles highlighted for News

Markup: templates/output/06-components/tiles-highlighted-for-news.html

Styleguide 4.4.6
*/
/*
Tiles alone

Markup: templates/output/06-components/tiles-alone.html

Styleguide 4.4.7
*/
/*
Tiles same-height

Markup: templates/output/06-components/tiles-same-height.html

Styleguide 4.4.8
*/
/*
Tiles highlighted for Events

Markup: templates/output/06-components/tiles-highlighted-for-events.html

Styleguide 4.4.6
*/
/*
Tiles header

Markup: templates/output/06-components/tiles-header.html

Styleguide 4.4.7
*/
/*
Text-Media

Styleguide 4.5
*/
.textmedia {
  margin-bottom: 40px;
}
.textmedia [class^=col] {
  margin-bottom: 24px;
}
@media (max-width: 768px) {
  .textmedia [class^=col]:last-child {
    margin-bottom: 0;
  }
}
@media (min-width: 769px) {
  .textmedia .textmedia__content {
    padding-left: 30px;
  }
}
@media (min-width: 769px) {
  .textmedia--reverse [class^=col]:first-child {
    order: 2;
  }
  .textmedia--reverse [class^=col] .textmedia__content {
    padding-right: 30px;
    padding-left: 0;
  }
}

.embed-video {
  margin: 0 auto;
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
}
.embed-video.showConsent {
  min-height: 308px;
}
.embed-video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.embed-image {
  display: block;
  margin: 0 auto;
}

.embed-caption {
  display: block;
  margin-top: 10px;
  font-size: 12px;
  color: #474747;
}
.embed-caption a {
  color: var(--highlightBlue);
}

iframe {
  border: 0;
}

/*
Text-media video left

Markup: templates/output/06-components/text-media-video-left.html

Styleguide 4.5.1
*/
/*
Text-media video right

Markup: templates/output/06-components/text-media-video-right.html

Styleguide 4.5.2
*/
/*
Text-media image left

Markup: templates/output/06-components/text-media-image-left.html

Styleguide 4.5.3
*/
/*
Text-media image right

Markup: templates/output/06-components/text-media-image-right.html

Styleguide 4.5.4
*/
/*
Pagination

Markup: templates/output/06-components/pagination.html

Styleguide 4.6
*/
.pagination {
  border-top: 1px solid #E3E3E3;
  text-align: center;
}

.pagination__list {
  margin: 0 0 35px;
  padding: 30px 0 0;
  list-style: none;
}

.pagination__item {
  display: inline;
}
@media (max-width: 768px) {
  .pagination__item {
    font-size: 12px;
  }
}
.pagination__item a {
  display: inline-block;
  text-decoration: none;
  color: #333;
  padding: 0 10px;
}
.pagination__item a:hover {
  text-decoration: underline;
}
.pagination__item a:focus {
  outline: 1px solid #CCCCCC;
  outline-offset: 2px;
  outline-style: dashed;
}
.pagination__item--active {
  font-weight: 700;
  padding: 0 10px;
}
.pagination__item--prev a, .pagination__item--next a {
  padding: 6px 18px;
  border: 1px solid #333;
  border-radius: 30px;
}
.pagination__item--prev a:hover, .pagination__item--next a:hover {
  background: #F7F7F7;
}

.pagination__button {
  margin-top: 25px;
}

/*
Footer

Markup: templates/output/06-components/footer.html

Styleguide 4.7
*/
.footer {
  display: block;
  background-color: #F7F7F7;
  margin-top: 150px;
  padding: 60px 0;
}
@media (max-width: 768px) {
  .footer {
    margin-top: 100px;
    padding: 38px 0 91px;
  }
}
.footer--no-margin {
  margin-top: 0;
}

.loginreg .footer {
  color: #333;
}

.footer__inner {
  display: flex;
  flex-direction: row;
}
@media (max-width: 768px) {
  .footer__inner {
    flex-flow: column;
    text-align: center;
  }
}

@media (max-width: 768px) {
  .footer__column {
    max-width: 100%;
    text-align: center;
  }
  .footer__column:not(:last-child) {
    border-bottom: 1px solid #E3E3E3;
    margin-bottom: 28px;
    padding-bottom: 28px;
  }
}

.footer__content {
  display: flex;
  flex-direction: column;
}
@media (min-width: 769px) {
  .footer__content + .footer__content {
    margin-top: 40px;
  }
}

.footer__content--margin {
  margin-bottom: 64px;
}
@media (max-width: 768px) {
  .footer__content--margin {
    margin-bottom: 28px;
  }
}

.footer__title {
  margin-bottom: 18px;
}

.footer__item {
  color: #333;
  font-size: 14px;
}
.footer__item:not(:last-child) {
  margin-bottom: 22px;
}
.footer__item:hover {
  color: var(--highlightBlue);
  text-decoration: none;
}
@media (max-width: 768px) {
  .footer__item:hover {
    color: #333;
  }
}

/*
Footer without distance

Markup: templates/output/06-components/footer-without-distance.html

Styleguide 4.7.1
*/
/*
Quote

Markup: templates/output/06-components/quote.html

Styleguide 4.8
*/
.quote {
  text-align: center;
}

.quote__icon {
  display: inline-block;
  color: var(--iftBlue);
  margin-bottom: 20px;
}

.quote__text {
  font-style: italic;
  padding: 0;
  background: transparent;
  border: 0;
}

.quote__author {
  font-size: 12px;
  color: var(--iftBlue);
}

/*
Teasers

Markup: templates/output/06-components/teasers.html

Styleguide 4.9
*/
.teaser {
  display: flex;
  position: relative;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: flex-end;
}
@media (max-width: 768px) {
  .teaser {
    flex-flow: column nowrap;
    justify-content: center;
  }
}
.teaser--reverse {
  justify-content: flex-start;
}
@media (max-width: 768px) {
  .teaser--reverse {
    justify-content: center;
  }
}
.teaser--reverse .teaser__content {
  right: 0;
  left: auto;
}

@media (max-width: 992px) {
  .teaser__thumb {
    width: 90%;
  }
}
@media (max-width: 768px) {
  .teaser__thumb {
    width: 100%;
  }
}
.teaser__thumb * {
  display: block;
  margin: 0 auto;
}

.teaser__content {
  display: flex;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 380px;
  min-height: 256px;
  padding: 25px;
  background: #FFFFFF;
  border-radius: 8px;
  box-shadow: 0 0 20px 0 rgba(71, 71, 71, 0.2);
  flex-flow: column nowrap;
  justify-content: flex-end;
}
@media (max-width: 768px) {
  .teaser__content {
    margin-top: -50px;
    align-items: center;
    justify-content: center;
    position: relative;
    top: auto;
    right: auto;
    left: auto;
    transform: translateY(0);
    min-width: initial;
    width: 80%;
    max-width: 350px;
    min-height: auto;
    text-align: center;
  }
}
@media (max-width: 576px) {
  .teaser__content {
    max-width: initial;
  }
}
.teaser__content .button__ghost {
  margin-top: 20px;
  align-self: baseline;
}
@media (max-width: 768px) {
  .teaser__content .button__ghost {
    margin-top: 10px;
    align-self: center;
  }
}

.teaser__category {
  margin-bottom: 10px;
  font-style: italic;
}
@media (max-width: 768px) {
  .teaser__category {
    font-size: 14px;
  }
}

.teaser__title {
  margin: 0;
}
@media (max-width: 768px) {
  .teaser__title {
    font-size: 18px;
  }
}

/*
Accordions

Styleguide 4.10
*/
.accordions {
  margin-bottom: 40px;
}
.accordions--narrow .accordions__header {
  padding: 20px 65px 20px 30px;
}
@media (max-width: 768px) {
  .accordions--narrow .accordions__header {
    padding: 10px 55px 10px 20px;
  }
}
.accordions--narrow .accordions__header .icon-open,
.accordions--narrow .accordions__header .icon-close {
  right: 28px;
}
@media (max-width: 768px) {
  .accordions--narrow .accordions__header .icon-open,
.accordions--narrow .accordions__header .icon-close {
    right: 18px;
  }
}
.accordions--narrow .accordions__content {
  padding: 25px 30px 15px;
}
@media (max-width: 768px) {
  .accordions--narrow .accordions__content {
    padding: 15px 20px 10px;
  }
}
.accordions--narrow .accordions__content::before {
  left: 30px;
  right: 30px;
}
@media (max-width: 768px) {
  .accordions--narrow .accordions__content::before {
    right: 20px;
    left: 20px;
  }
}

.accordions__item {
  border: 1px solid #E3E3E3;
  border-radius: 8px;
}
@media (max-width: 768px) {
  .accordions__item {
    font-size: 14px;
  }
}
.accordions__item:not(:last-child) {
  margin-bottom: 20px;
}
@media (max-width: 768px) {
  .accordions__item:not(:last-child) {
    margin-bottom: 12px;
  }
}
.accordions__item .accordions__content .o-container__row.hidden {
  display: none;
}
.accordions__item.hidden {
  display: none;
}

@media (min-width: 769px) {
  .accordions__desktop-only {
    display: block !important;
  }
}
@media (max-width: 768px) {
  .accordions__desktop-only {
    display: none;
  }
}

@media (max-width: 768px) {
  .accordions__image {
    margin-bottom: 15px;
  }
}
.accordions__image--shadow {
  box-shadow: -2px 0 6px 0 rgba(0, 0, 0, 0.3);
}

.accordions__more {
  display: none;
  margin-bottom: 15px;
}
@media (max-width: 768px) {
  .accordions__more {
    display: inline-flex;
  }
}
.accordions__more--clicked .button__link__icon {
  transform: rotate(180deg);
}

.accordions__header {
  position: relative;
  padding: 20px 75px 20px 40px;
  cursor: pointer;
}
@media (max-width: 768px) {
  .accordions__header {
    padding: 10px 55px 10px 20px;
  }
}
.accordions__header .icon-open,
.accordions__header .icon-close {
  position: absolute;
  top: 50%;
  right: 38px;
  transform: translateY(-50%);
  color: var(--highlightBlue);
}
@media (max-width: 768px) {
  .accordions__header .icon-open,
.accordions__header .icon-close {
    right: 18px;
  }
}
.accordions__header .icon-close {
  display: none;
}
.accordions__header--clicked {
  font-weight: 700;
}
.accordions__header--clicked .icon-open {
  display: none;
}
.accordions__header--clicked .icon-close {
  display: block;
}

.accordions__title {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: flex-start;
}
@media (max-width: 768px) {
  .accordions__title {
    flex-flow: column nowrap;
    align-items: flex-start;
  }
}
.accordions__title p {
  margin: 0;
}
.accordions__title span {
  font-size: 12px;
}
@media (min-width: 769px) {
  .accordions__title *:not(:last-child) {
    margin-right: 20px;
  }
}
@media (max-width: 768px) {
  .accordions__title *:not(:last-child) {
    margin-bottom: 5px;
  }
}

.accordions__title__link {
  font-size: 12px;
  color: var(--highlightBlue);
}

.accordions__content__link {
  color: var(--highlightBlue);
}

.accordions__content {
  display: none;
  position: relative;
  padding: 25px 40px 15px;
}
@media (max-width: 768px) {
  .accordions__content {
    padding: 15px 20px 10px;
  }
}
.accordions__content .downloads {
  margin-bottom: 0;
}
.accordions__content .col__3 {
  font-size: 14px;
}
.accordions__content::before {
  position: absolute;
  top: 0;
  left: 40px;
  right: 40px;
  height: 1px;
  background: #E3E3E3;
  content: "";
}
@media (max-width: 768px) {
  .accordions__content::before {
    top: 3px;
    right: 20px;
    left: 20px;
  }
}
.accordions__content .o-container__row--certifcate:nth-child(n+3) {
  margin-top: 1.5rem;
}

.downloadlist .button__round.hide {
  display: none;
}
.downloadlist .accordions .accordions__item.hide {
  display: none;
}

/*
Accordions regular

Markup: templates/output/06-components/accordions-regular.html

Styleguide 4.10.1
*/
/*
Accordions self-closing

Markup: templates/output/06-components/accordions-selfclosing.html

Styleguide 4.10.2
*/
/*
Accordions columns

Markup: templates/output/06-components/accordions-columns.html

Styleguide 4.10.3
*/
/*
Accordions columns

Markup: templates/output/06-components/accordions-multititle.html

Styleguide 4.10.3
*/
/*
Accordions narrow

Markup: templates/output/06-components/accordions-narrow.html

Styleguide 4.10.4
*/
/*
Accordions MyIFT Reports

Markup: templates/output/06-components/accordions-myift-reports.html

Styleguide 4.10.5
*/
/*
Icon - Text

Markup: templates/output/06-components/icon-text.html

Styleguide 4.11

*/
.icon__text {
  text-align: center;
}

.icon__text__title {
  margin-bottom: 70px;
}
@media (max-width: 768px) {
  .icon__text__title {
    margin-bottom: 40px;
  }
}

.icon__text__slider {
  display: flex;
  margin: 0 -20px;
  flex-flow: row wrap;
  justify-content: center;
}
.icon__text__slider .navigation-row {
  display: none;
}
@media (max-width: 768px) {
  .icon__text__slider .navigation-row {
    display: flex;
  }
}
.icon__text__slider.flickity-enabled .icon__text__slide {
  margin-bottom: 0;
}
@media (max-width: 768px) {
  .icon__text__slider {
    display: block;
  }
  .icon__text__slider::after {
    display: none;
    content: "flickity";
  }
}
.icon__text__slider ~ [class^=button] {
  margin-top: 60px;
}
@media (max-width: 768px) {
  .icon__text__slider ~ [class^=button] {
    margin-top: 40px;
  }
}

.icon__text__slide {
  margin-bottom: 100px;
  max-width: 33.33334%;
  flex: 0 0 33.33334%;
  padding: 0 20px;
}
@media (min-width: 769px) {
  .icon__text__slide {
    display: flex;
    flex-flow: column nowrap;
    align-items: center;
  }
}
@media (max-width: 768px) {
  .icon__text__slide {
    width: 100%;
    max-width: 100%;
    padding: 0 30px;
  }
}
.icon__text__slide * {
  margin: 0 0 0.25rem;
}
.icon__text__slide svg g {
  stroke: var(--highlightBlue);
}
.icon__text__slide svg g.color-fill {
  stroke: none;
  fill: var(--highlightBlue);
}
.icon__text__slide.tooltip__trigger:hover .icon__text__content {
  color: var(--highlightBlue);
}

.icon__text__icon {
  max-width: 64px;
}
@media (max-width: 768px) {
  .icon__text__icon {
    margin-bottom: 25px;
  }
}

.icon__text__slide__title {
  color: var(--highlightBlue);
}
@media (max-width: 768px) {
  .icon__text__slide__title {
    font-size: 24px;
  }
}

.icon__text__icon {
  color: var(--highlightBlue);
}

.icon__text__content {
  transition: color 0.25s;
}

/*
Persons

Styleguide 4.12
*/
.persons__slider {
  display: flex;
  margin: 0 -20px;
  flex-flow: row wrap;
  justify-content: center;
}
@media (max-width: 768px) {
  .persons__slider {
    display: block;
  }
  .persons__slider::after {
    display: none;
    content: "flickity";
  }
}
.persons__slider .navigation-row {
  display: none;
}
.persons__slider.flickity-enabled {
  margin-bottom: 120px;
}
.persons__slider.flickity-enabled .persons__slide {
  margin-bottom: 0;
}
@media (max-width: 768px) {
  .persons__slider.flickity-enabled .navigation-row {
    display: flex;
  }
}
.persons__slider ~ [class^=button] {
  margin-top: 60px;
}
@media (max-width: 768px) {
  .persons__slider ~ [class^=button] {
    margin-top: 40px;
  }
}

.persons__slide {
  margin-bottom: 40px;
  padding: 0 20px;
  flex: 0 0 33.33334%;
  max-width: 33.33334%;
}
@media (max-width: 992px) {
  .persons__slide {
    max-width: 40%;
    flex-basis: 40%;
  }
}
@media (max-width: 768px) {
  .persons__slide {
    flex-basis: 85%;
    padding: 0 10px;
    width: 85%;
    max-width: 340px;
  }
}
.persons__slide--big {
  flex: 0 0 83.333333%;
  max-width: 83.333333%;
}
@media (max-width: 992px) {
  .persons__slide--big {
    max-width: 100%;
    flex-basis: 100%;
  }
}
@media (max-width: 768px) {
  .persons__slide--big {
    width: 85%;
    max-width: 340px;
  }
}
.persons__slide--big .persons__slide__inner {
  display: flex;
  flex-flow: row nowrap;
}
@media (max-width: 768px) {
  .persons__slide--big .persons__slide__inner {
    flex-flow: column nowrap;
  }
}
.persons__slide--big .persons__slide__inner img {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center center;
     object-position: center center;
}
@media (min-width: 769px) {
  .persons__slide--big .persons__thumb {
    width: 280px;
  }
}
@media (min-width: 769px) {
  .persons__slide--big .persons__links {
    display: flex;
    flex-flow: row wrap;
  }
  .persons__slide--big .persons__links li:not(:last-child) {
    margin-right: 40px;
  }
}

.persons__slide__inner {
  border: 1px solid #E3E3E3;
}
@media (max-width: 768px) {
  .persons__slide__inner {
    margin: 0 auto;
    width: 100%;
  }
}

.persons__thumb {
  display: block;
  margin: 0 auto;
  -o-object-fit: cover;
     object-fit: cover;
}

.persons__content {
  width: 100%;
  padding: 25px 20px;
}

.persons__pretitle {
  font-size: 12px;
}

@media (max-width: 768px) {
  .persons__posttitle {
    font-size: 12px;
  }
}

.persons__name {
  margin: 0 0 2px;
  font-size: 24px;
}

.persons__desc {
  margin: 1.5em 0;
}
@media (max-width: 768px) {
  .persons__desc {
    display: none;
  }
}

.persons__links {
  margin: 35px 0 0;
  padding: 0;
  list-style: none;
}
@media (max-width: 768px) {
  .persons__links {
    margin-top: 50px;
  }
}
.persons__links li {
  display: block;
}
@media (max-width: 768px) {
  .persons__links li {
    font-size: 14px;
  }
}
.persons__links li:not(:last-child) {
  margin-bottom: 10px;
}
.persons__links a {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  color: #474747;
}
.persons__links a:hover {
  text-decoration: none;
}
.persons__links span {
  color: var(--highlightBlue);
}

.persons__icon {
  margin-right: 10px;
  min-width: 24px;
}

/*
Persons highlighted

Markup: templates/output/06-components/text-media-video-left.html

Styleguide 4.12.1
*/
/*
Persons regular

Markup: templates/output/06-components/text-media-video-right.html

Styleguide 4.12.2
*/
/*
Timeline

Markup: templates/output/06-components/timeline.html

Styleguide 4.13
*/
.timeline {
  position: relative;
}
.timeline .navigation-row {
  position: static;
  margin-top: 40px;
  transform: none;
}

.timeline__slider-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  -moz-column-gap: 20px;
       column-gap: 20px;
  margin-bottom: 20px;
}
.timeline__slider-nav button {
  display: inline-block;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: #F7F7F7;
  border-radius: 20px;
  background-image: none;
  border: 2px solid #FFFFFF;
  cursor: pointer;
  font: inherit;
  padding: 15px;
  text-align: left;
  position: relative;
}
.timeline__slider-nav button.btn1, .timeline__slider-nav button.btn4 {
  display: none;
  text-align: center;
  width: calc(10% - 10px);
}
@media screen and (min-width: 1000px) {
  .timeline__slider-nav button.btn1, .timeline__slider-nav button.btn4 {
    display: block;
  }
}
.timeline__slider-nav button.btn1 .timeline__box-headline, .timeline__slider-nav button.btn1 .timeline__box-desc, .timeline__slider-nav button.btn4 .timeline__box-headline, .timeline__slider-nav button.btn4 .timeline__box-desc {
  display: none;
}
.timeline__slider-nav button.btn2, .timeline__slider-nav button.btn3 {
  display: none;
  width: calc(30% - 10px);
}
@media screen and (min-width: 700px) {
  .timeline__slider-nav button.btn2, .timeline__slider-nav button.btn3 {
    display: block;
  }
}
@media screen and (min-width: 1000px) {
  .timeline__slider-nav button.btn2, .timeline__slider-nav button.btn3 {
    width: calc(20% - 10px);
  }
}
.timeline__slider-nav button .timeline__box-headline {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.timeline__slider-nav button .timeline__box-desc {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.timeline__slider-nav button .timeline__box-year {
  display: -webkit-box;
  font-size: 16px;
  line-height: 1.5;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.timeline__slider-nav button .timeline__box-headline {
  font-size: 18px;
  line-height: 1.33;
  margin-top: 10px;
}
.timeline__slider-nav button .timeline__box-desc {
  font-size: 14px;
  line-height: 1.5;
  margin-top: 10px;
}
.timeline__slider-nav .box__image {
  background-color: #F7F7F7;
  border: 2px solid #FFFFFF;
  position: relative;
}
@media screen and (min-width: 700px) {
  .timeline__slider-nav button:not(:first-of-type)::before, .timeline__slider-nav .box__image::before {
    background-color: #A3A3A3;
    content: "";
    height: 1px;
    position: absolute;
    width: 20px;
    z-index: -1;
    left: -20px;
    top: 50%;
  }
  .timeline__slider-nav button[aria-hidden] + button:not([aria-hidden])::before, .timeline__slider-nav button[aria-hidden] + .box__image::before {
    display: none;
  }
}
@media screen and (min-width: 700px) and (max-width: 1000px) {
  .timeline__slider-nav button:nth-child(2)::before {
    display: none;
  }
}

.timeline__slide {
  width: 100%;
}

.timeline__slider {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}
@media screen and (min-width: 1000px) {
  .timeline__slider {
    width: calc(80% - 20px);
  }
}

.timeline__content {
  background: #F7F7F7;
  border-radius: 20px;
  overflow: hidden;
}

.timeline__header {
  display: none;
}

.timeline__content {
  text-align: center;
}
.timeline__content .timeline__box {
  padding: 40px;
}
@media (max-width: 768px) {
  .timeline__content .timeline__box {
    padding: 20px;
  }
}
.timeline__content .timeline__box-headline {
  margin-top: 10px;
}
.timeline__content .timeline__box-desc {
  margin-top: 10px;
}
.timeline__content .timeline__box-desc ul:not([class]), .timeline__content .timeline__box-desc ol:not([class]), .timeline__content .timeline__box-desc .checklist--brace, .timeline__content .timeline__box-desc .checklist--plus, .timeline__content .timeline__box-desc .checklist--check, .timeline__content .timeline__box-desc .checklist--hint, .timeline__content .timeline__box-desc .checklist--duplicate {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.box__image {
  display: block;
  position: relative;
  width: calc(100% - 20px);
  height: 280px;
  background-color: #F7F7F7;
  border-radius: 20px;
}
@media screen and (min-width: 700px) {
  .box__image {
    width: calc(40% - 20px);
  }
}
.box__image > div {
  height: 100%;
  border-radius: 20px;
  overflow: hidden;
}
.box__image img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center center;
     object-position: center center;
  width: 100%;
}

.timeline__box-year {
  color: var(--highlightBlue);
  font-weight: 700;
}

/*
Slideshow

Markup: templates/output/06-components/slideshow.html

Styleguide 4.14
*/
.slideshow {
  text-align: center;
}

.slideshow__slider {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: center;
}
.slideshow__slider ~ [class^=button] {
  margin-top: 60px;
}
@media (max-width: 768px) {
  .slideshow__slider ~ [class^=button] {
    margin-top: 40px;
  }
}
.slideshow__slider.flickity-enabled {
  display: block;
}
.slideshow__slider.flickity-enabled .slideshow__content {
  opacity: 0;
}
.slideshow__slider.flickity-enabled .slideshow__bar {
  transform: translateY(100%);
}
.slideshow__slider.flickity-enabled .slideshow__slide.is-selected .slideshow__content {
  opacity: 1;
}
.slideshow__slider.flickity-enabled .slideshow__slide.is-selected .slideshow__bar {
  transform: translateY(0);
}

.slideshow__slide {
  margin: 0 10px;
  color: #FFFFFF;
  position: relative;
  max-width: 780px;
  width: 85%;
}
@media (max-width: 768px) {
  .slideshow__slide {
    margin: 0 5px;
  }
}

.slideshow__image {
  display: block;
  position: relative;
  border: 1px solid #A3A3A3;
}
.slideshow__image * {
  display: block;
}
@media screen and (max-width: 600px) {
  .slideshow__image img {
    height: 300px;
    -o-object-fit: cover;
       object-fit: cover;
  }
}
.frame-type-in2template_content-slider .slideshow__image:after {
  content: "";
  background-color: #000;
  opacity: 0.3;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.slideshow__content {
  text-align: left;
  position: absolute;
  bottom: 56px;
  left: 75px;
  padding-right: 20px;
  transition: opacity 0.25s;
}
@media (max-width: 992px) {
  .slideshow__content {
    bottom: 43px;
    left: 50px;
  }
}
@media (max-width: 768px) {
  .slideshow__content {
    bottom: 30px;
    left: 25px;
  }
}

.slideshow__text {
  font-weight: 700;
  margin-bottom: 35px;
}
@media (max-width: 768px) {
  .slideshow__text {
    margin-bottom: 29px;
  }
}

.slideshow__bar {
  text-align: center;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 20px;
  background: rgba(0, 0, 0, 0.7);
  transition: transform 0.25s;
}
@media (max-width: 768px) {
  .slideshow__bar {
    font-size: 12px;
  }
}

/*
Slideshow without bar

Markup: templates/output/06-components/slideshow-without-bar.html

Styleguide 4.14.1
*/
/*
Slideshow with bar

Markup: templates/output/06-components/slideshow-with-bar.html

Styleguide 4.14.2
*/
/*
Slideshow without bar no button

Markup: templates/output/06-components/slideshow-without-bar-no-button.html

Styleguide 4.14.3
*/
/*
Slideshow with bar no button

Markup: templates/output/06-components/slideshow-with-bar-no-button.html

Styleguide 4.14.4
*/
/*
Products

Markup: templates/output/06-components/products.html

Styleguide 4.15
*/
.products {
  text-align: center;
}
@media (max-width: 1220px) {
  .products {
    padding-right: 0;
    padding-left: 0;
  }
}

.products__slider {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: center;
}
.products__slider ~ [class^=button] {
  margin-top: 60px;
}
@media (max-width: 768px) {
  .products__slider ~ [class^=button] {
    margin-top: 40px;
  }
}
.products__slider.flickity-enabled {
  display: block;
}
.products__slider.flickity-enabled .products__slide {
  transform: scale(0.7);
}
@media (max-width: 768px) {
  .products__slider.flickity-enabled .products__slide {
    transform: scale(0.9);
  }
}
.products__slider.flickity-enabled .products__slide.is-selected {
  transform: scale(1);
}
.products__slider .flickity-button.previous {
  left: 20px;
}
@media (max-width: 1220px) {
  .products__slider .flickity-button.previous {
    left: 40px;
  }
}
.products__slider .flickity-button.next {
  right: 20px;
}
@media (max-width: 1220px) {
  .products__slider .flickity-button.next {
    right: 40px;
  }
}

.products__slide {
  display: flex;
  margin: 0 10px;
  position: relative;
  max-width: 450px;
  width: 50%;
  transition: transform 0.25s;
  flex-flow: row nowrap;
  align-items: flex-end;
  justify-content: flex-end;
}
@media (max-width: 768px) {
  .products__slide {
    margin: 0 5px;
    flex-flow: column nowrap;
    align-items: center;
    justify-content: space-between;
    width: 80%;
  }
}

.products__thumb {
  mix-blend-mode: darken;
  position: relative;
  pointer-events: none;
  z-index: 2;
}
@media (min-width: 992px) {
  .products__thumb {
    transform: translateX(30%);
  }
}
@media (min-width: 768px) {
  .products__thumb {
    transform: translateX(15%);
  }
}
@media (max-width: 992px) {
  .products__thumb {
    width: 300px;
  }
}

.products__content {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 320px;
  padding: 50px 45px 40px;
  border-radius: 30px;
  background: #F7F7F7;
}
@media (max-width: 768px) {
  .products__content {
    margin-top: -50px;
    padding-top: 75px;
    position: relative;
    bottom: auto;
    left: auto;
  }
}
@media (max-width: 768px) {
  .products__content {
    width: 100%;
  }
}

.products__content__inner {
  position: relative;
  text-align: left;
  z-index: 3;
}

.products__pretitle {
  font-style: italic;
  margin-bottom: 0.5em;
}

.products__title {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 20px;
}

/*
Companies

Markup: templates/output/06-components/companies.html

Styleguide 4.16
*/
.companies.o-container {
  padding: 0;
}

.companies__slider {
  display: block;
  margin: 0 0 0 -20px;
}
.companies__slider.flickity-enabled {
  display: block;
  margin-left: 0;
}
.companies__slider.flickity-enabled .products__slide {
  transform: scale(0.7);
}
.companies__slider.flickity-enabled .products__slide.is-selected {
  transform: scale(1);
}
.companies__slider .flickity-button.previous {
  left: 60px;
}
.companies__slider .flickity-button.next {
  right: 40px;
}

.companies__slide {
  width: 25%;
}
@media (max-width: 992px) {
  .companies__slide {
    width: 33.33334%;
  }
}
@media (max-width: 768px) {
  .companies__slide {
    width: 50%;
  }
}
@media (max-width: 576px) {
  .companies__slide {
    width: 80%;
  }
}

.companies__slide__inner {
  margin: 0 10px;
  border-radius: 8px;
  border: solid 1px #E3E3E3;
}

.companies__thumb {
  border-bottom: 1px solid #E3E3E3;
}

.companies__img {
  display: block;
  margin: 10px auto;
}

.companies__content {
  padding: 30px 20px;
}
.companies__content .button__ghost,
.companies__content .button__link,
.companies__content .button__round {
  margin-top: 10px;
}

.companies__pretitle {
  margin-bottom: 5px;
  color: #A3A3A3;
}

.companies__title {
  margin-bottom: 5px;
  font-size: 16px;
}

/*
Header

Markup: templates/output/06-components/header.html

Styleguide 4.17
*/
.header {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-end;
  color: #FFFFFF;
  position: relative;
  min-height: 60vh;
}
.header__home {
  min-height: 80vh;
}
.header > * {
  width: 100%;
}

.header__img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
}
.header__img::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.3);
  content: "";
}

.header__img__src {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: var(--iftBlue);
}
.header__img__src img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center center;
     object-position: center center;
  width: 100%;
}
.header__img__src.is-blurred {
  filter: blur(7px);
}

@media (max-width: 992px) {
  .header__top__container {
    z-index: 9;
  }
  .header__top__container.is-dark {
    color: #474747;
  }
  .header__top__container.is-dark .header__mobile {
    border-color: #E3E3E3;
  }
  .header__top__container.is-dark .logo__regular {
    display: none;
  }
  .header__top__container.is-dark .logo__dark {
    display: inline-block;
  }
}

.header__top {
  display: flex;
  align-items: center;
  border-bottom: 1px solid currentColor;
  flex-flow: row nowrap;
  justify-content: space-between;
  padding-left: 130px;
  position: relative;
  transition: border-color 0.3s linear;
}
@media (max-width: 992px) {
  .header__top {
    display: none;
  }
}
.nav-wrapper--is-sticky .header__top {
  border-color: #E3E3E3;
}

.header__bottom {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  padding-top: 20px;
  padding-left: 130px;
}
@media (max-width: 992px) {
  .header__bottom {
    display: none;
  }
}

.header__mobile {
  display: none;
  padding: 10px 0;
  border-bottom: 1px solid #FFFFFF;
}
@media (max-width: 992px) {
  .header__mobile {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: space-between;
  }
}

.header__mobile__triggers {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  margin-right: -8px;
}

.header__mobile__trigger {
  display: flex;
  justify-content: center;
  align-items: center;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: transparent;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 0;
  color: inherit;
  cursor: pointer;
  font: inherit;
  padding: 8px;
}
.header__mobile__trigger .header__link__icon {
  margin-left: 0;
}
.header__mobile__trigger .icon__close {
  display: none;
}
.header__mobile__trigger.is-clicked .icon__open {
  display: none;
}
.header__mobile__trigger.is-clicked .icon__close {
  display: inline-block;
}

.search__trigger .icon__close {
  display: none;
}
.search__trigger.is-clicked .icon__open {
  display: none;
}
.search__trigger.is-clicked .icon__close {
  display: inline-block;
}

.header__logo {
  display: inline-block;
  position: absolute;
  top: 63px;
  left: 0;
  width: 60px;
  height: 60px;
  color: inherit;
}
@media (max-width: 992px) {
  .header__logo {
    position: relative;
    top: auto;
    left: auto;
    width: 38px;
    height: 45px;
  }
  .header__logo svg {
    width: 38px;
    height: 45px;
  }
}
.header__logo .logo__dark {
  display: none;
}

.header__top__right {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
}
.header__top__right > *:not(:last-child) {
  margin-right: 30px;
}
.header__top__right .header__link {
  text-transform: uppercase;
}
.header__top__right a {
  margin-top: 10px;
  margin-bottom: 10px;
}

.header__bottom__right {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  padding-bottom: 20px;
}
.header__bottom__right > *:not(:last-child) {
  margin-right: 30px;
}
.header__bottom__right .header__link {
  font-size: 16px;
  font-weight: 600;
  margin-right: 30px;
}
.header__bottom__right .search__trigger {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: transparent;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 0;
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-weight: 600;
  padding: 0;
}

.header__top__menu {
  margin: 0;
  padding: 0;
  list-style: none;
}
.header__top__menu li {
  display: inline-block;
  font-size: 12px;
  letter-spacing: 0.69px;
}
.header__top__menu li:not(:last-child) {
  margin-right: 10px;
}
.header__top__menu a {
  display: block;
  color: #FFFFFF;
  padding: 10px 15px;
  position: relative;
  text-decoration: none;
}
.nav-wrapper--is-sticky .header__top__menu a {
  color: #474747;
}
.header__top__menu a::after {
  background-color: currentColor;
  bottom: 10px;
  content: "";
  height: 2px;
  left: 15px;
  opacity: 0.6;
  position: absolute;
  transition: width 0.25s;
  width: 0;
}
.header__top__menu a:hover {
  text-decoration: none;
}
.header__top__menu a:hover::after {
  width: calc(100% - 30px);
}

.dnavigation {
  margin: 0;
  padding: 0;
  list-style: none;
}

.dnavigation__item {
  display: inline-block;
  font-weight: 600;
  letter-spacing: 1px;
  padding-bottom: 20px;
}
.dnavigation__item:not(:last-child) {
  margin-right: 40px;
}
.dnavigation__item.is-hovered .dnavigation__link::before {
  content: "";
}

.dnavigation__link {
  display: block;
  position: relative;
  color: #FFFFFF;
  padding: 20px 15px;
}
.dnavigation__link::before {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 8px 10px 8px;
  border-color: transparent transparent #FFFFFF;
  filter: drop-shadow(1px -4px 3px rgba(0, 0, 0, 0.1));
  z-index: 9999;
}
.dnavigation__link::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 4px;
  background-color: currentColor;
  transition: width 0.25s;
  content: "";
}
.nav-wrapper--is-sticky .dnavigation__link::after {
  background-color: #E3E3E3;
}
.nav-wrapper--is-sticky .dnavigation__link {
  color: #474747;
}
.dnavigation__link:hover {
  text-decoration: none;
}
.dnavigation__link:hover::after {
  width: 100%;
}

.dnavigation__submenu {
  display: none;
  margin: 0;
  position: absolute;
  top: 100%;
  left: 20px;
  width: calc(33.33334% - 14px);
  padding: 20px 0;
  list-style: none;
  z-index: 20;
  min-height: 635px;
}
.dnavigation__submenu::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 200%;
  background: #FFFFFF;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  z-index: -1;
  transition: 0.25s;
  content: "";
}
.dnavigation__submenu--larger::after {
  width: 200%;
}
.dnavigation__submenu--largest::after {
  width: 300%;
}
.dnavigation__submenu li {
  display: block;
  font-weight: 400;
}
.dnavigation__submenu li a {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  padding: 7px 30px;
  color: #474747;
}
.dnavigation__submenu li a.is-hovered {
  color: var(--iftBlue);
}
.dnavigation__submenu li a.is-hovered svg {
  transform: translateX(20px);
}
.dnavigation__submenu li a:hover {
  text-decoration: none;
  color: var(--iftBlue);
}
.dnavigation__submenu svg {
  transition: 0.25s;
}
.dnavigation__submenu ul {
  display: none;
  margin: 0;
  list-style: none;
  position: absolute;
  top: 0;
  left: 100%;
  width: 100%;
  height: 100%;
  padding: 20px 0;
}
.dnavigation__submenu ul::before {
  position: absolute;
  top: 30px;
  bottom: 30px;
  left: 0;
  width: 1px;
  background: #E3E3E3;
  content: "";
}

.mnavigation__container {
  display: none;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100vh;
  padding-top: 50px;
  background: #FFFFFF;
  overflow-y: auto;
  z-index: 2;
}
@media (min-width: 993px) {
  .mnavigation__container {
    display: none !important;
  }
}

.mnavigation {
  color: #474747;
  overflow: hidden;
  transform: translateZ(0);
  transition: 0.3s;
}
.mnavigation > ul {
  position: relative;
  left: 0;
  transform: translateZ(0);
  transition: 0.3s;
}
.mnavigation ul {
  width: 100%;
}
.mnavigation li {
  font-size: 16px;
  line-height: 1;
  padding-right: 30px;
  padding-left: 30px;
}
.mnavigation li:last-child {
  padding-bottom: 20px;
}
.mnavigation li:last-child a {
  border-bottom: 0;
}
.mnavigation li a {
  padding: 18px 0;
}
.mnavigation li a.mnavigation__back {
  padding: 45px 0 0;
  border: 0;
}
.mnavigation li a.mnavigation__back .mnavigation__arrow__icon {
  margin-left: 0;
}
.mnavigation li ul {
  display: none;
  position: absolute;
  top: 0;
  left: 100%;
}
.mnavigation ul,
.mnavigation li {
  margin: 0;
  list-style: none;
}
.mnavigation a {
  display: flex;
  color: inherit;
  text-decoration: none;
  align-items: center;
}
.mnavigation a span {
  flex: 1;
}

.mnavigation__list {
  padding: 0;
}

.mnavigation__title {
  position: relative;
  padding-top: 45px;
  padding-bottom: 18px;
}
.mnavigation__title::before {
  position: absolute;
  right: 30px;
  bottom: 0;
  left: 30px;
  height: 1px;
  background: #E3E3E3;
  content: "";
}

.mnavigation__item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #E3E3E3;
}
.mnavigation__item > a {
  flex: 1;
}
.mnavigation__item-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: transparent;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 0;
  color: inherit;
  cursor: pointer;
  font: inherit;
  padding: 12px;
}
.mnavigation__item-btn.mnavigation__back {
  padding: 0;
  padding-top: 45px;
  width: 100%;
  justify-content: flex-start;
}
.mnavigation__item-btn:not(.mnavigation__back) {
  margin-right: -12px;
}

.mnavigation__divider {
  padding-top: 15px;
  padding-bottom: 15px;
}

.mnavigation__link__icon {
  margin-right: 8px;
  cursor: pointer;
}

.mnavigation__arrow__icon {
  margin-left: 8px;
}

.header__link {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  font-size: 12px;
  color: inherit;
}
.header__link:hover {
  text-decoration: none;
}

.header__link__icon {
  margin-left: 8px;
  cursor: pointer;
}

.header__content {
  display: block;
  margin: 0 auto 60px;
  color: inherit;
  text-align: center;
}
.header__content p {
  max-width: 72ch;
  margin-left: auto;
  margin-right: auto;
}

.header__contentnews {
  max-width: inherit;
}
@media screen and (min-width: 769px) {
  .header__contentnews h1 {
    font-size: 60px;
  }
}

.header__title {
  line-height: 1;
  letter-spacing: 5px;
}

.header__desc {
  font-weight: 700;
}
@media (max-width: 768px) {
  .header__desc {
    font-size: 12px;
  }
}

.header__scroll {
  display: flex;
  align-items: center;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: #FFFFFF;
  border-radius: 50%;
  border: 1px solid transparent;
  bottom: 0;
  color: #333;
  cursor: pointer;
  font: inherit;
  height: 50px;
  justify-content: center;
  left: 50%;
  position: absolute;
  text-align: center;
  text-decoration: none;
  transform: translate(-50%, 50%);
  width: 50px;
}

.header__scroll__icon {
  display: block;
}

/*
Header home

Markup: templates/output/06-components/header-home.html

Styleguide 4.17.1
*/
/*
Header regular

Markup: templates/output/06-components/header-regular.html

Styleguide 4.17.2
*/
.search__container {
  display: none;
  position: absolute;
  top: 92px;
  right: 0;
  left: 0;
  height: 100px;
  z-index: 2;
}
@media (min-width: 992px) {
  .search__container {
    top: 100%;
  }
}

.search__box {
  background: #FFFFFF;
  border-radius: 8px;
  position: relative;
}
.search__box::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  background: #FFFFFF;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  z-index: -1;
  transition: 0.25s;
  content: "";
}

.search__form {
  position: relative;
}
.search__form::after {
  position: absolute;
  top: -10px;
  right: 47px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 8px 10px 8px;
  border-color: transparent transparent #FFFFFF;
  content: "";
  filter: drop-shadow(1px -4px 3px rgba(0, 0, 0, 0.1));
}
@media (min-width: 992px) {
  .search__form::after {
    right: 190px;
  }
}
.search__form--border .search__field {
  border: 1px solid #C6C7C9;
  border-radius: 8px;
}
@media (max-width: 768px) {
  .search__form--border .search__field {
    padding-right: 45px;
    padding-left: 20px;
  }
}
.search__form--border .search__field__icon {
  left: 25px;
}
@media (max-width: 768px) {
  .search__form--border .search__field__icon {
    display: none;
  }
}

.search__field {
  display: block;
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.9px;
  width: 100%;
  padding: 25px 25px 25px 70px;
  background: #FFFFFF;
  border: 0;
  border-bottom: 1px solid transparent;
  border-radius: 8px;
}
.search__field:not(:-moz-placeholder-shown) {
  border-color: #C6C7C9;
}
.search__field:not(:-ms-input-placeholder) {
  border-color: #C6C7C9;
}
.search__field:not(:placeholder-shown) {
  border-color: #C6C7C9;
}
.search__field::-webkit-input-placeholder {
  color: #474747;
  opacity: 1;
}
.search__field::-moz-placeholder {
  color: #474747;
  opacity: 1;
}
.search__field:-ms-input-placeholder {
  color: #474747;
  opacity: 1;
}
.search__field:-moz-placeholder {
  color: #474747;
  opacity: 1;
}
.search__field:focus {
  box-shadow: none;
  outline: 0;
}

.search__field__icon {
  color: #474747;
  position: absolute;
  top: 50%;
  left: 35px;
  transform: translateY(-50%);
}

.search__field__submit {
  margin: 0;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  color: #474747;
  background: transparent;
  border: 0;
}

.search__proposals {
  padding: 20px 80px 0;
  color: #474747;
  background: #FFFFFF;
  height: auto;
  overflow-x: hidden;
  overflow-y: auto;
}
@media (max-width: 768px) {
  .search__proposals {
    padding: 20px 20px 0;
  }
}

.search__proposals__title {
  font-size: 12px;
  margin-bottom: 10px;
}

.search__proposals__list {
  margin: 0 0 30px;
  padding: 0;
  list-style: none;
}
.search__proposals__list li {
  display: block;
}
.search__proposals__list li:not(:last-child) {
  margin-bottom: 10px;
}
.search__proposals__list a {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  font-weight: 600;
  color: #A3A3A3;
}
.search__proposals__list a span {
  color: #474747;
}
.search__proposals__list a svg {
  color: #474747;
  margin-right: 15px;
}

.search__categories__list {
  margin: 0;
  padding: 0 0 15px;
  list-style: none;
}
.search__categories__list li {
  display: block;
}
@media (max-width: 768px) {
  .search__categories__list li:not(:last-child) a {
    border-bottom: 1px solid #E3E3E3;
  }
}
.search__categories__list a {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  position: relative;
  padding: 10px 0;
  color: #474747;
}
@media (max-width: 768px) {
  .search__categories__list a {
    flex-flow: column nowrap;
    align-items: flex-start;
    padding-top: 15px;
  }
}
.search__categories__list a::before {
  position: absolute;
  top: 0;
  right: -30px;
  bottom: 0;
  left: -30px;
  background: transparent;
  border-radius: 8px;
  content: "";
}
.search__categories__list a > * {
  position: relative;
}
.search__categories__list a:hover {
  text-decoration: none;
  color: #474747;
}
.search__categories__list a:hover::before {
  background: #F7F7F7;
}
.search__categories__list span {
  padding-right: 10px;
  flex: 1;
}
.search__categories__list [class^=button] {
  margin-right: 25px;
  padding: 5px 15px;
}
@media (max-width: 768px) {
  .search__categories__list [class^=button] {
    margin-bottom: 8px;
  }
}

@media (max-width: 768px) {
  .search__categories__list__arrow {
    position: absolute !important;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
  }
}

.search__proposals__all {
  display: block;
  padding: 15px;
  position: relative;
  text-align: center;
  color: #474747;
  background: #FFFFFF;
  border-top: 1px solid #C6C7C9;
  border-radius: 0 0 8px 8px;
}

.js-language__trigger {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: transparent;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 0;
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-transform: uppercase;
  padding: 0;
}
@media (min-width: 768px) {
  .js-language__trigger {
    font-size: 12px;
  }
}

.language__container {
  display: none;
  position: absolute;
  top: 92px;
  right: 59px;
  z-index: 2;
  max-width: 200px;
  width: 100%;
}
@media (min-width: 993px) {
  .language__container {
    top: 55px;
    right: 0;
  }
}

.language__box {
  background: #FFFFFF;
  border: 1px solid #C6C7C9;
  border-radius: 8px;
  padding: 4px 8px;
  color: #333;
}

.language__box-inner {
  position: relative;
}
.language__box-inner::after {
  position: absolute;
  top: -14px;
  right: 21px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 8px 10px 8px;
  border-color: transparent transparent #FFFFFF;
  content: "";
  filter: drop-shadow(1px -4px 3px rgba(0, 0, 0, 0.1));
}
@media (min-width: 768px) {
  .language__box-inner::after {
    right: 12px;
  }
}
.language__box-inner .header__link {
  text-transform: capitalize;
}

.nav-wrapper {
  background-color: transparent;
  color: #FFFFFF;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  transition: background-color 0.3s linear, color 0.3s linear, border-color 0.3s linear;
  z-index: 1337;
  border-bottom: 1px solid transparent;
}
.nav-wrapper--is-sticky {
  background-color: #FFFFFF;
  border-color: #E3E3E3;
  color: #333333;
}
.nav-wrapper--is-sticky .logo__regular {
  display: none;
}
.nav-wrapper--is-sticky .logo__dark {
  display: inline-block;
}

/*
Logo-bar

Markup: templates/output/06-components/logo-bar.html

Styleguide 4.18
*/
.logo-bar__text {
  text-align: center;
}

.logo-bar__subheadline {
  font-size: 16px;
  margin-bottom: 8px;
}

.logo-bar__image-container {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: center;
}

.logo-bar__image {
  position: relative;
  margin-bottom: 30px;
  min-height: 1px;
}

.logo-bar__link {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 25%;
  flex: 0 0 25%;
}
@media (max-width: 576px) {
  .logo-bar__link {
    max-width: 50%;
    flex: 0 0 50%;
  }
}
.logo-bar__link > * {
  padding: 20px;
}
@media (max-width: 480px) {
  .logo-bar__link > * {
    padding: 10px;
  }
}
@media (min-width: 768px) {
  .logo-bar__link:hover .logo-bar__image {
    filter: grayscale(0);
  }
}

@media (min-width: 768px) {
  .logo-bar__image {
    filter: grayscale(1);
    transition: 0.25s;
  }
}

/*
Breadcrumbs

Styleguide 4.19
*/
.breadcrumbs {
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: center;
}
.breadcrumbs li {
  display: inline-block;
  margin-bottom: 4px;
  position: relative;
  font-size: 12px;
  color: #474747;
}
.breadcrumbs li:not(:last-child) {
  margin-right: 10px;
  padding-right: 25px;
}
.breadcrumbs a {
  display: inline-block;
  color: #A3A3A3;
}
.breadcrumbs a[aria-current] {
  color: inherit;
}
.breadcrumbs svg {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}
@media (max-width: 768px) {
  .breadcrumbs span span {
    display: none;
  }
}

/*
Breadcrumbs-small

Markup: templates/output/06-components/breadcrumbs-small.html

Styleguide 4.19.1
*/
/*
Breadcrumbs-medium

Markup: templates/output/06-components/breadcrumbs-medium.html

Styleguide 4.19.2
*/
/*
Breadcrumbs-large

Markup: templates/output/06-components/breadcrumbs-large.html

Styleguide 4.19.3
*/
/*
Popular

Styleguide 4.20
*/
.popular {
  text-align: center;
  margin-top: 100px;
}
.popular > h4 {
  text-align: left;
}
.popular > h4.center {
  text-align: center;
}
.popular--alt {
  text-align: left;
}
.popular--alt .popular__list {
  margin-top: 20px;
  text-align: left;
}
.popular--alt .popular__list a {
  margin: 0 8px 12px 0;
}

.popular__more__text--hidden {
  display: none;
}

.popular__more__icon {
  transition: transform 0.25s;
}

.popular__title {
  margin-bottom: 20px;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 700;
}

.popular__list {
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: center;
}
.popular__list a {
  margin: 0 4px 12px;
}
.popular__list a:hover {
  color: #FFFFFF;
  background: var(--highlightBlue);
  border-color: var(--highlightBlue);
}

.popular__more {
  display: none;
  margin-top: 10px;
}
.popular__more--clicked .popular__more__text {
  display: none;
}
.popular__more--clicked .popular__more__text--hidden {
  display: inline-block;
}
.popular__more--clicked .popular__more__icon {
  transform: rotate(180deg);
}

/*
Popular regular

Markup: templates/output/06-components/popular-regular.html

Styleguide 4.20.1
*/
/*
Popular alternative

Markup: templates/output/06-components/popular-alternative.html

Styleguide 4.20.2
*/
/*
Contribution

Styleguide 4.21
*/
.contribution {
  text-align: center;
  padding: 110px 0;
  background: #F7F7F7;
}
@media (max-width: 992px) {
  .contribution {
    padding: 65px 0;
  }
}
.contribution .col__5,
.contribution .col__4,
.contribution .col__3 {
  padding-top: 110px;
  padding-bottom: 110px;
}
@media (max-width: 992px) {
  .contribution .col__5,
.contribution .col__4,
.contribution .col__3 {
    max-width: 100%;
    flex-basis: 100%;
    padding-top: 65px;
    padding-bottom: 65px;
  }
}
.contribution .col__5.contribution__image,
.contribution .col__4.contribution__image,
.contribution .col__3.contribution__image {
  padding-bottom: 0;
}
@media (max-width: 992px) {
  .contribution .col__5 {
    padding-top: 0;
  }
}
@media (max-width: 992px) {
  .contribution .col__4 {
    padding-bottom: 0;
  }
}
@media (max-width: 992px) {
  .contribution .col__3 {
    padding: 0;
  }
}
.contribution--blue {
  padding: 0;
  color: #FFFFFF;
  background-image: linear-gradient(130deg, #0075BD 33%, #059CF9 76%);
}
@media (max-width: 992px) {
  .contribution--blue {
    background-image: linear-gradient(172deg, #0075BD 15%, #059CF9 106%);
  }
}
.contribution--blue .contribution__content h1,
.contribution--blue .contribution__content h2,
.contribution--blue .contribution__content h3,
.contribution--blue .contribution__content h4 {
  color: #FFFFFF;
}
.contribution--blue .contribution__content .contribution__button {
  margin-top: 30px;
}
.contribution--blue .contribution__content .contribution__button:hover {
  color: #FFFFFF;
}

.contribution__content * {
  margin: 0;
}
.contribution__content h1,
.contribution__content h2,
.contribution__content h3,
.contribution__content h4 {
  margin: 0.1em 0;
  color: var(--highlightBlue);
}

.contribution__text {
  text-align: left;
}
@media (max-width: 992px) {
  .contribution__text {
    margin-top: 30px;
    text-align: center;
  }
}

.contribution__image {
  align-self: end;
}
@media (max-width: 992px) {
  .contribution__image {
    margin-top: 30px;
    order: 1;
  }
}
.contribution__image img {
  display: block;
  margin: 0 auto;
}
@media (min-width: 993px) {
  .contribution__image img {
    margin-left: auto;
  }
}

.contribution__button {
  margin-top: 60px;
}
@media (max-width: 992px) {
  .contribution__button {
    margin-top: 30px;
  }
}

/*
Contribution

Markup: templates/output/06-components/contribution.html

Styleguide 4.21.1
*/
/*
Contribution blue

Markup: templates/output/06-components/contribution-blue.html

Styleguide 4.21.2
*/
/*
Team

Markup: templates/output/06-components/team.html

Styleguide 4.22
*/
.team__list {
  display: flex;
  margin: 0 -10px;
  padding: 0;
  list-style: none;
  flex-flow: row wrap;
}

.team__item {
  margin-bottom: 20px;
  padding: 0 10px;
  max-width: 33.33334%;
  flex: 0 0 33.33334%;
}
@media (max-width: 768px) {
  .team__item {
    max-width: 100%;
    flex-basis: 100%;
  }
}

.team__member {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 100%;
  overflow: hidden;
  color: #FFFFFF;
  background-color: #E3E3E3;
  background-position: center center;
  background-size: cover;
}
.team__member::after {
  position: absolute;
  top: 50%;
  right: 0;
  bottom: 0;
  left: 0;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), #333);
  content: "";
}

.team__content {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 1;
}

@media (min-width: 769px) {
  .team__desc {
    margin: 30px;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    transition: 0.25s;
  }
}
@media (max-width: 992px) {
  .team__desc {
    margin: 15px;
  }
}

.team__function {
  font-size: 12px;
}

.team__name {
  font-size: 18px;
  font-weight: 700;
}

@media (min-width: 769px) {
  .team__contact {
    transform: translateY(100%);
    opacity: 0;
    padding: 30px;
    transition: 0.25s;
  }
}
@media (max-width: 992px) {
  .team__contact {
    padding: 15px;
  }
}
@media (max-width: 768px) {
  .team__contact {
    transform: translateY(0) !important;
    opacity: 1 !important;
  }
}

.team__contact__option {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  color: #FFFFFF;
}
@media (max-width: 992px) {
  .team__contact__option {
    font-size: 14px;
  }
}
.team__contact__option:not(:last-child) {
  margin-bottom: 8px;
}
.team__contact__option svg {
  margin-right: 10px;
  min-width: 26px;
}

/*
Map

Markup: templates/output/06-components/map.html

Styleguide 4.23
*/
.map {
  position: relative;
  color: #FFFFFF;
  background: var(--highlightBlue);
}

.map__content {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  justify-content: center;
  width: 50%;
  padding: 30px 30px 30px 0;
  min-height: 470px;
}
@media (max-width: 768px) {
  .map__content {
    width: 100%;
    padding: 30px 60px;
    min-height: initial;
  }
}
.map__content p {
  margin-bottom: 0.5em;
}
.map__content .button__ghost:hover {
  color: #FFFFFF;
}

.map__content__inner > *:not(:last-child) {
  margin-bottom: 20px;
}

.map__embed {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 50%;
  z-index: 3;
}
@media (max-width: 768px) {
  .map__embed {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    height: 0;
    padding-bottom: 100%;
  }
}
.map__embed .map__embed__map {
  height: 100%;
}
@media (max-width: 768px) {
  .map__embed .map__embed__map {
    padding-top: 100%;
  }
}
.map__embed iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.map__contact {
  margin: 30px 0 30px;
}

.map__contact__option {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  color: #FFFFFF;
}
.map__contact__option:not(:last-child) {
  margin-bottom: 8px;
}
.map__contact__option svg {
  margin-right: 10px;
}

.gm-style .gm-style-iw-c {
  color: #474747;
  padding: 10px 20px;
  border-radius: 0;
}
.gm-style .gm-style-iw-c button {
  display: none !important;
}

.gm-style-iw-d {
  padding: 0;
}

/*
Filter header

Markup: templates/output/06-components/filter-header.html

Styleguide 4.24
*/
.filter__header {
  margin-bottom: 20px;
}
.filter__header hr {
  margin: 2em 0;
}

.filter__header__meta {
  margin-bottom: 35px;
}
.filter__header__meta .didyoumean {
  color: #333;
}

.filter__header__letters {
  margin: 0 0 40px;
  padding: 0;
  list-style: none;
  text-align: center;
}
.filter__header__letters::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  background: red;
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, white 100%);
  width: 100px;
  pointer-events: none;
  content: "";
}
@media (min-width: 769px) {
  .filter__header__letters::after {
    content: "";
  }
}
@media (max-width: 768px) {
  .filter__header__letters {
    width: 100%;
    overflow: auto;
    white-space: nowrap;
  }
}
.filter__header__letters li {
  display: inline-block;
  margin: 10px -12px;
  text-transform: uppercase;
}
@media (max-width: 768px) {
  .filter__header__letters li {
    margin: 10px 10px 10px 0;
  }
}
@media (max-width: 768px) {
  .filter__header__letters li:last-child {
    margin-right: 60px;
  }
}
.filter__header__letters li.active, .filter__header__letters li:hover {
  margin: 9px 10px 9px 0;
}
@media (min-width: 769px) {
  .filter__header__letters li.active, .filter__header__letters li:hover {
    margin: -1px -12px;
    position: relative;
    z-index: 2;
  }
}
.filter__header__letters li.active a, .filter__header__letters li:hover a {
  text-decoration: none;
  color: var(--highlightBlue);
  border: 2px solid var(--highlightBlue);
}
@media (min-width: 769px) {
  .filter__header__letters li.active a, .filter__header__letters li:hover a {
    width: 60px;
    height: 60px;
    line-height: 58px;
  }
}
.filter__header__letters a {
  display: inline-block;
  text-align: center;
  line-height: 38px;
  width: 40px;
  height: 40px;
  color: #474747;
  background: #FFFFFF;
  border: 1px solid #474747;
  border-radius: 50%;
}

@media (min-width: 769px) {
  .filter__header__buttons {
    display: flex;
    justify-content: flex-end;
  }
}

.filter__header__pills [class^=button] {
  margin: 0 15px 15px 0;
}
.filter__header__pills [class^=button].button__round--disabled {
  color: #AFAFAF;
}

/*
Filter header with letters

Markup: templates/output/06-components/filter-header-letters.html

Styleguide 4.24.1
*/
/*
Filter header for search

Markup: templates/output/06-components/filter-header-search.html

Styleguide 4.24.2
*/
/*
Filter header with letters / less fields

Markup: templates/output/06-components/filter-header-letters-less-fields.html

Styleguide 4.24.3
*/
/*
Filter header for video

Markup: templates/output/06-components/filter-header-video.html

Styleguide 4.24.4
*/
/*
Newsletter

Styleguide 4.25
*/
.newsletter input {
  border-color: #E3E3E3;
}

.newsletter--img {
  background-position: center center;
  background-size: cover;
}
.newsletter--img p,
.newsletter--img .newsletter__header {
  color: #FFFFFF;
}

.newsletter__header {
  margin-bottom: 80px;
  text-align: center;
}
@media (max-width: 768px) {
  .newsletter__header {
    margin-bottom: 40px;
  }
}
.newsletter__header * {
  margin: 0;
}
.newsletter__header h1,
.newsletter__header h2,
.newsletter__header h3,
.newsletter__header h4 {
  margin: 0.1em 0;
}

.newsletter__dropdown {
  display: block;
  position: relative;
  width: 100%;
  font-size: 14px;
  margin-bottom: 30px;
  background: #FFFFFF;
  border: 1px solid #A3A3A3;
  border-radius: 8px;
  line-height: 1.5;
  cursor: pointer;
  font-family: "Open Sans", sans-serif;
}

.newsletter__dropdown__header {
  padding: 12px 14px;
}
.newsletter__dropdown__header .icon-open,
.newsletter__dropdown__header .icon-close {
  position: absolute;
  top: 10px;
  right: 10px;
  color: var(--highlightBlue);
}
.newsletter__dropdown__header .icon-close {
  display: none;
}
.newsletter__dropdown__header--clicked .icon-open {
  display: none;
}
.newsletter__dropdown__header--clicked .icon-close {
  display: block;
}

.newsletter__dropdown__content {
  display: none;
  position: relative;
  padding: 24px 14px 12px;
}
.newsletter__dropdown__content * {
  margin-bottom: 1.25em;
}
.newsletter__dropdown__content::before {
  position: absolute;
  top: 0;
  left: 8px;
  right: 8px;
  height: 1px;
  background: #E3E3E3;
  content: "";
}
@media (max-width: 768px) {
  .newsletter__dropdown__content::before {
    top: 3px;
    right: 20px;
    left: 20px;
  }
}

.newsletter__footer {
  margin-top: 30px;
}

/*
Newsletter with distance

Markup: templates/output/06-components/newsletter.html

Styleguide 4.25.1
*/
/*
Newsletter without distance

Markup: templates/output/06-components/newsletter-without-distance.html

Styleguide 4.25.2
*/
/*
Newsletter with image without distance

Markup: templates/output/06-components/newsletter-with-image.html

Styleguide 4.25.3
*/
/*
Newsletter without image without distance

Markup: templates/output/06-components/newsletter-with-image-without-distance.html

Styleguide 4.25.4
*/
/*
Certification detail

Markup: templates/output/06-components/certification-detail.html

Styleguide 4.26
*/
.certdetail__header {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
}
@media (max-width: 768px) {
  .certdetail__header {
    flex-flow: column nowrap;
  }
}

@media (min-width: 769px) {
  .certdetail__header__logo {
    width: 300px;
  }
}
@media (max-width: 768px) {
  .certdetail__header__logo {
    margin-bottom: 30px;
  }
}

@media (max-width: 768px) {
  .certdetail__header__title {
    font-size: 18px;
  }
}

.certdetail__header__option {
  display: flex;
  margin-bottom: 15px;
  flex-flow: row nowrap;
  align-items: flex-start;
}
.certdetail__header__option svg {
  flex: 0 0 32px;
  margin-right: 15px;
}
.certdetail__header__option a {
  color: #333;
}

.certdetail__table {
  text-align: center;
}

.certdetail__table__header {
  font-size: 14px;
  text-align: left;
  padding: 15px 20px;
  background: #F7F7F7;
}
@media (max-width: 768px) {
  .certdetail__table__header {
    display: none;
  }
}

.certdetail__table__list {
  text-align: left;
}

.certdetail__table__item {
  padding: 20px;
  border-bottom: 1px solid #E3E3E3;
}
@media (max-width: 768px) {
  .certdetail__table__item {
    border: 1px solid #E3E3E3;
    border-radius: 4px;
  }
  .certdetail__table__item:not(:last-child) {
    margin-bottom: 15px;
  }
}
@media (max-width: 768px) {
  .certdetail__table__item [class^=col]:not(:last-child) {
    margin-bottom: 12px;
  }
}
.certdetail__table__item p {
  margin: 0;
}
.certdetail__table__item strong {
  color: var(--highlightBlue);
}
.certdetail__table__item .downloads .downloads__item {
  font-size: 14px;
}

.certdetail__table__desc {
  display: none;
  margin-bottom: 8px;
}
@media (max-width: 768px) {
  .certdetail__table__desc {
    display: block;
  }
}

/*
Search List

Markup: templates/output/06-components/search-list.html

Styleguide 4.27
*/
.search__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.search__list__item {
  display: block;
}
.search__list__item:not(:last-child) {
  margin-bottom: 40px;
  padding-bottom: 40px;
  border-bottom: 1px solid #E3E3E3;
}

@media (max-width: 768px) {
  .search__list__title {
    font-size: 24px;
  }
}
.search__list__title a {
  color: #474747;
}

@media (max-width: 768px) {
  .search__list__thumb {
    margin-bottom: 20px;
    width: 100%;
  }
}

.search__list__content {
  margin-top: 20px;
}
.search__list__content [class^=button__round] {
  margin-bottom: 15px;
  padding: 5px 15px;
  cursor: inherit;
}
.search__list__content [class^=button__round]:hover {
  color: var(--iftBlue);
}

/*
My IFT

Styleguide 4.28
*/
/*
MyIFT Login

Markup: templates/output/06-components/myift/login.html

Styleguide 4.28.1
*/
/*
MyIFT Register

Markup: templates/output/06-components/myift/register.html

Styleguide 4.28.2
*/
.loginreg {
  position: relative;
  color: #FFFFFF;
  background-image: linear-gradient(152deg, #0075BD 25%, #059CF9 90%);
  overflow: hidden;
}
.loginreg a.underline {
  text-decoration: underline;
  color: #FFFFFF;
}

.loginreg__bg {
  position: absolute;
  top: 0;
  right: 0;
  width: 100vh;
  height: 100vh;
  color: var(--highlightBlue);
  transform: translate(50%, -50%);
  pointer-events: none;
}
@media (max-width: 768px) {
  .loginreg__bg {
    width: 50vh;
    height: 100vh;
    transform: translate(50%, -25%);
  }
}

.loginreg__form {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  text-align: center;
  padding-right: 50px;
}
@media (max-width: 992px) {
  .loginreg__form {
    padding-right: 25px;
  }
}
@media (max-width: 768px) {
  .loginreg__form {
    padding-right: 0;
  }
}
.loginreg__form select option {
  color: #333;
}
.loginreg__form a {
  font-size: 14px;
  color: inherit;
  margin-top: 10px;
}
.loginreg__form a.loginreg__underline {
  margin-top: 60px;
  text-decoration: underline;
}
.loginreg__form a.loginreg__underline:hover {
  text-decoration: none;
}
.loginreg__form [class^=button] {
  color: #FFFFFF;
}
.loginreg__form [class^=button]:hover {
  color: #FFFFFF;
}

@media (max-width: 768px) {
  .loginreg__title {
    font-size: 24px;
  }
}

.loginreg__fields {
  margin-bottom: 20px;
  width: 100%;
}
.loginreg__fields .form__el {
  margin-bottom: 15px;
}
.loginreg__fields .form__placeholder {
  font-size: 14px;
}

.loginreg__columns {
  padding: 50px 0 100px;
}

.loginreg__box {
  margin-left: 50px;
  font-size: 14px;
  color: #474747;
  background: #FFFFFF;
  border-radius: 8px;
  padding: 45px;
}
@media (max-width: 992px) {
  .loginreg__box {
    margin-left: 25px;
    padding: 25px;
  }
}
@media (max-width: 768px) {
  .loginreg__box {
    margin: 100px 0 0;
  }
}
.loginreg__box ul {
  padding-left: 0.75rem;
}

/*
MyIFT Meta

Markup: templates/output/06-components/myift/meta.html

Styleguide 4.28.3
*/
.myift__meta {
  display: flex;
  margin-right: -8px;
  margin-left: -8px;
  padding: 15px 0;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
}
@media (min-width: 993px) {
  .myift__meta {
    display: none;
  }
}

.myift__meta__trigger {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  cursor: pointer;
}
.myift__meta__trigger .icon-open {
  display: inline-flex;
}
.myift__meta__trigger .icon-close {
  display: none;
}
.myift__meta__trigger.is-clicked .icon-open {
  display: none;
}
.myift__meta__trigger.is-clicked .icon-close {
  display: inline-flex;
}
.myift__meta__trigger.is-clicked .myift__meta__text {
  display: none;
}
.myift__meta__trigger.is-clicked .myift__meta__text--hidden {
  display: inline-flex;
}

.myift__meta__text--hidden {
  display: none;
}

.myift__meta__icon {
  margin: 0 8px;
}

/*
MyIFT Menu

Markup: templates/output/06-components/myift/menu.html

Styleguide 4.28.4
*/
.myift__header {
  color: #474747;
}
.myift__header .header__top,
.myift__header .header__mobile {
  border-color: #E3E3E3;
}

@media (min-width: 993px) {
  .myift__content {
    padding-top: 50px;
  }
}

.myift__columns {
  display: flex;
  flex-flow: row nowrap;
}
@media (max-width: 992px) {
  .myift__columns {
    flex-flow: column nowrap;
  }
}

.myift__main {
  padding-left: 100px;
}
@media (min-width: 993px) {
  .myift__main {
    width: 75%;
  }
}
@media (max-width: 1220px) {
  .myift__main {
    padding-left: 20px;
  }
}
@media (max-width: 992px) {
  .myift__main {
    width: 100%;
    padding-left: 0;
  }
}
.myift__main .form__el {
  margin-bottom: 20px;
}
.myift__main input,
.myift__main select,
.myift__main textarea {
  border-color: #E3E3E3;
}
.myift__main .form__checkbox .form__checkmark {
  border-color: #E3E3E3;
}
.myift__main hr {
  margin: 1em 0;
}

@media (min-width: 993px) {
  .myiftmenu {
    display: block !important;
    width: 25%;
  }
}
@media (max-width: 992px) {
  .myiftmenu {
    display: none;
    width: 100%;
  }
}

.myiftmenu__list {
  margin: 0;
  padding: 0 0 25px 0;
  list-style: none;
  height: 100%;
}
@media (min-width: 993px) {
  .myiftmenu__list {
    padding-right: 20px;
    border-right: 1px solid #E3E3E3;
  }
}
.myiftmenu__list > .myiftmenu__item {
  margin-bottom: 25px;
}

.myiftmenu__item {
  display: block;
  flex-flow: row nowrap;
  font-size: 16px;
}
.myiftmenu__item--no__subsubs .myiftmenu__submenu {
  padding-left: 0;
}

.myiftmenu__link {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  color: #474747;
  padding: 5px 0;
}
.myiftmenu__link:hover, .myiftmenu__link.is-clicked {
  text-decoration: none;
  color: var(--highlightBlue);
}
.myiftmenu__link span {
  flex: 1;
  padding-right: 10px;
}

.myiftmenu__item__title {
  font-size: 10px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.myiftmenu__icon {
  margin-right: 5px;
  flex: 0 0 24px;
}

.myiftmenu__arrow {
  margin-left: 5px;
  flex: 0 0 12px;
}

.myiftmenu__submenu {
  display: none;
  margin: 0;
  padding: 0 0 20px 25px;
  list-style: none;
}
.myiftmenu__submenu .myiftmenu__item__title ~ .myiftmenu__submenu {
  padding-left: 0;
}
.is-active + .myiftmenu__submenu {
  display: block;
}

.myiftmenu__subsubmenu {
  margin: 0;
  padding: 0 0 25px 50px;
  list-style: none;
}

/*
MyIFT Welcome

Markup: templates/output/06-components/myift/welcome.html

Styleguide 4.28.5
*/
@media (max-width: 768px) {
  .welcome__title {
    font-size: 24px;
  }
}

/*
MyIFT Lists

Styleguide 4.28.6
*/
@media (max-width: 768px) {
  .myift__list__title {
    font-size: 24px;
  }
}

.myift__list__container {
  border: 1px solid #E3E3E3;
  border-radius: 8px;
}
.myift__list__container--articles {
  padding: 20px 40px;
}
@media (max-width: 768px) {
  .myift__list__container--articles {
    padding: 5px 10px;
  }
}
.myift__list__container--articles .downloads {
  margin-bottom: 0;
}
.myift__list__container--events {
  padding: 30px 40px;
}
@media (max-width: 768px) {
  .myift__list__container--events {
    padding: 0;
    border: 0;
  }
}
.myift__list__container--events .datelist {
  margin-bottom: 0;
}
@media (min-width: 769px) {
  .myift__list__container--events li:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
  }
}

/*
MyIFT Services

Markup: templates/output/06-components/myift/services.html

Styleguide 4.28.7
*/
@media (max-width: 768px) {
  .myift__services__title {
    font-size: 24px;
  }
}

.myift__services__list {
  display: flex;
  margin: 0 -10px;
  padding: 0;
  list-style: none;
  flex-flow: row wrap;
}
@media (max-width: 768px) {
  .myift__services__list {
    flex-flow: column nowrap;
  }
}

.myift__services__item {
  display: flex;
  position: relative;
  max-width: 25%;
  flex: 0 0 25%;
  margin-bottom: 20px;
  padding: 0 10px;
}
@media (max-width: 768px) {
  .myift__services__item {
    max-width: initial;
    flex-basis: auto;
    justify-content: center;
  }
}
.myift__services__item--disabled:after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(255, 255, 255, 0.5);
  content: "";
}

.myift__services__link {
  display: flex;
  width: 100%;
  flex-flow: column nowrap;
  align-items: center;
  padding: 30px;
  position: relative;
  color: #474747;
  background: #FFFFFF;
  border: 1px solid #E3E3E3;
  border-radius: 8px;
  overflow: hidden;
}
@media (max-width: 768px) {
  .myift__services__link {
    width: 180px;
  }
}
.myift__services__link:hover {
  text-decoration: none;
}
.myift__services__link:hover .myift__services__overlay {
  opacity: 1;
}

.myift__services__overlay {
  display: flex;
  align-items: center;
  font-size: 12px;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 15px;
  color: #FFFFFF;
  background: var(--highlightBlue);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s;
}

.myift__services__img__holder {
  position: relative;
  margin-bottom: 5px;
}

.myift__services__thumb {
  width: 90px;
}

.myift__services__name {
  font-weight: 600;
  text-align: center;
}

.myift__services__status {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 46px;
  height: 46px;
  color: #474747;
  background: #FFFFFF;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  z-index: 1;
  cursor: pointer;
}

/*
MyIFT Details

Markup: templates/output/06-components/myift/details.html

Styleguide 4.28.8
*/
.myift__details__items {
  margin: 0 -10px;
  overflow: hidden;
}

.myift__details__item {
  padding: 0 10px;
}
@media (min-width: 769px) {
  .myift__details__item {
    display: inline-block;
    float: left;
    width: 50%;
  }
}
.myift__details__item--full {
  width: 100%;
  float: none;
}
.myift__details__item--full > [class^=button] {
  width: calc(50% - 10px);
}
@media (max-width: 768px) {
  .myift__details__item--full > [class^=button] {
    width: 100%;
  }
}
.myift__details__item--full > [class^=button] * {
  width: 100%;
}

/*
MyIFT Reports

Markup: templates/output/06-components/myift/reports.html

Styleguide 4.28.9
*/
.myift__reports .headerdownload .downloads,
.myift__orders .headerdownload .downloads,
.myift__offers .headerdownload .downloads {
  margin-top: 13px;
  margin-bottom: 0;
}
@media (max-width: 768px) {
  .myift__reports .headerdownload .downloads,
.myift__orders .headerdownload .downloads,
.myift__offers .headerdownload .downloads {
    margin-top: 0;
    margin-bottom: 1rem;
  }
}
.myift__reports .headerdownload .downloads .downloads__item .downloads__link,
.myift__orders .headerdownload .downloads .downloads__item .downloads__link,
.myift__offers .headerdownload .downloads .downloads__item .downloads__link {
  border-left: 0 transparent;
  justify-content: flex-end;
}
.myift__reports .headerdownload .downloads .downloads__item .downloads__link .downloads__meta,
.myift__orders .headerdownload .downloads .downloads__item .downloads__link .downloads__meta,
.myift__offers .headerdownload .downloads .downloads__item .downloads__link .downloads__meta {
  padding-left: 0;
  font-weight: 700;
}
.myift__reports .form__el--datepicker,
.myift__orders .form__el--datepicker,
.myift__offers .form__el--datepicker {
  text-align: right;
}
.myift__reports .form__el--datepicker input,
.myift__orders .form__el--datepicker input,
.myift__offers .form__el--datepicker input {
  width: 47.7%;
}
.myift__reports .form__el--datepicker input.form__el--datepicker-from,
.myift__orders .form__el--datepicker input.form__el--datepicker-from,
.myift__offers .form__el--datepicker input.form__el--datepicker-from {
  float: left;
}
.myift__reports .form__el--datepicker span.divider,
.myift__orders .form__el--datepicker span.divider,
.myift__offers .form__el--datepicker span.divider {
  display: block;
  margin: 0 1%;
  float: left;
  height: 100%;
  line-height: 1.5;
  padding: 12px 0 6px;
}

/*
MyIFT Table

Markup: templates/output/06-components/myift/table.html

Styleguide 4.28.10
*/
.myift__table [class^=button] {
  display: block;
}
.myift__table th [class^=button] {
  display: inline-flex;
}

.myift__table__wrapper {
  position: relative;
}
.myift__table__wrapper:after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 120px;
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, white 100%);
  opacity: 1;
  transition: opacity 0.25s;
  pointer-events: none;
  content: "";
}
.myift__table__wrapper.not-overflowing:after {
  opacity: 0;
}

.myift__table__scroller {
  overflow-x: scroll;
  overflow-y: scroll;
  padding-bottom: 5px;
  width: 100%;
  max-height: 50vh;
}

.myift__table__body {
  border-collapse: separate;
  border-spacing: 0;
  border: 0;
  table-layout: fixed;
}
.myift__table__body.is-pinned:before {
  opacity: 1;
}
.myift__table__body thead {
  background: #F7F7F7;
  position: sticky;
  top: 0;
}
.myift__table__body thead th {
  background: #F7F7F7;
  border: none;
}
.myift__table__body tbody td {
  border-bottom: 1px solid #E3E3E3;
}
.myift__table__body th,
.myift__table__body td {
  font-size: 14px;
  font-weight: 400;
  color: #333;
  padding: 15px;
  white-space: nowrap;
}

.myift__table__sticky {
  text-align: center;
  position: absolute;
  top: auto;
  left: 0;
  width: 150px;
  background: #FFFFFF;
  border: 0;
  z-index: 2;
}

tbody .myift__table__sticky {
  position: relative;
}
tbody .myift__table__sticky span {
  display: inline-block;
  line-height: 1;
  color: #FFFFFF;
  background: var(--highlightBlue);
  border-radius: 8px;
  padding: 3px 20px;
}

/*
MyIFT Roles

Markup: templates/output/06-components/myift/roles.html

Styleguide 4.28.11
*/
/*
MyIFT Project

Markup: templates/output/06-components/myift/project.html

Styleguide 4.28.12
*/
.myift__project__specimen {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
}
.myift__project__specimen > div:not(:last-child) {
  margin-right: 8px;
}

.myift__project__specimen__control {
  border: 1px solid #E3E3E3;
  border-radius: 8px;
  cursor: pointer;
}
.myift__project__specimen__control:hover {
  box-shadow: 0 0 2px var(--highlightBlue);
}

.myift__project__specimen__control__icon {
  display: block;
  margin: 9px;
  color: var(--iftBlue);
}

.myift__project__specimen__value {
  position: relative;
  text-align: center;
  height: 47px;
}

.myift__project__specimen__desc {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  pointer-events: none;
  font-size: 10px;
  line-height: 20px;
  letter-spacing: 0.5px;
}

.myift__project__specimen__current {
  text-align: center;
  width: 90px;
}

.myift__project__uploads {
  display: flex;
  margin-bottom: 30px;
  flex-flow: column nowrap;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 80px 40px 40px;
  border: 1px dashed #E3E3E3;
  border-radius: 8px;
}

.myift__project__uploads__icon {
  color: var(--highlightBlue);
}

.myift__project__uploads__desc {
  pointer-events: none;
  margin-top: 20px;
}
.myift__project__uploads__desc em {
  display: block;
  margin-bottom: 10px;
}

.myift__project__files .files__item {
  color: #CCCCCC;
}
.myift__project__files .files__item.dz-processing {
  color: #CCCCCC;
}
.myift__project__files .files__item.dz-complete {
  color: #333;
}
.myift__project__files .files__item.dz-error {
  color: #F77874;
}

.myift__project__rtf p {
  margin-bottom: 0;
}

.myift__project__price {
  margin: 30px 0;
  text-align: right;
}

.myift__project__buttons {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
}
@media (max-width: 768px) {
  .myift__project__buttons {
    flex-flow: column nowrap;
  }
  .myift__project__buttons > [class^=button]:first-child {
    margin-bottom: 30px;
  }
}

/*
MyIFT Add User

Markup: templates/output/06-components/myift/add-user.html

Styleguide 4.28.13
*/
.myift__adduser {
  display: none;
  align-items: center;
  justify-content: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 20px;
  z-index: 1338;
}

.myift__adduser__overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
  background-color: rgba(71, 71, 71, 0.1);
  z-index: 10;
}

.myift__adduser__inner {
  width: 100%;
  max-width: 580px;
  padding: 60px 100px;
  background: #FFFFFF;
  border-radius: 8px;
  z-index: 11;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.myift__adduser__inner .icon-close {
  position: absolute;
  top: 2rem;
  right: 2rem;
  cursor: pointer;
}
@media (max-width: 768px) {
  .myift__adduser__inner {
    padding: 60px 20px;
  }
}

.myift__orders .accordions__item .downloads--inline li {
  max-width: 50%;
  flex: 0 0 50%;
}
.myift__orders .accordions__item .project--header {
  font-size: 1em;
  margin-top: 2em;
}
.myift__orders .accordions__item hr {
  margin: 1em 0 2em;
}

/*
Teaser MyIFT Login

Markup: templates/output/06-components/myift/teaser-login.html

Styleguide 4.28.14
*/
.teaser-myift-login__header {
  margin-bottom: 3.75rem;
  text-align: center;
}
.teaser-myift-login__header > p {
  margin: 0;
}
.teaser-myift-login__header p span {
  display: block;
}
.teaser-myift-login__header p span.seperator {
  display: none;
}
@media (min-width: 768px) {
  .teaser-myift-login__header p span {
    display: inline;
  }
  .teaser-myift-login__header p span.seperator {
    display: inline;
    margin: 0 0.5rem;
  }
}
.teaser-myift-login__header h2 {
  margin: 0;
  font-size: 3.75rem;
  color: var(--highlightBlue);
}

/*
Teaser MyIFT Registration

Markup: templates/output/06-components/myift/teaser-registration.html

Styleguide 4.28.15
*/
.teaser-myift-registration {
  background-image: linear-gradient(152deg, #0075BD 25%, #059CF9 90%);
  color: #FFFFFF;
}
.teaser-myift-registration .teaser-myift-registration--smartphone {
  background: url("../Images/Icons/Iphone_ausschnitt.svg");
  width: 100%;
  height: 315px;
  position: absolute;
  bottom: 0;
  left: 0;
  background-size: 600px 315px;
  background-repeat: no-repeat;
  background-position: bottom center;
}
@media (min-width: 768px) {
  .teaser-myift-registration .teaser-myift-registration--smartphone {
    display: none;
  }
}
@media (min-width: 992px) {
  .teaser-myift-registration .teaser-myift-registration--smartphone {
    display: block;
    background-position: bottom left;
  }
}
.teaser-myift-registration .col__4 {
  padding: 2rem 0 1.5rem;
}
@media (min-width: 992px) {
  .teaser-myift-registration .col__4 {
    padding: 5rem 0 4rem;
  }
}
.teaser-myift-registration .col__last {
  padding-bottom: 20rem;
}
@media (min-width: 768px) {
  .teaser-myift-registration .col__last {
    padding-bottom: 1.5rem;
  }
}
.teaser-myift-registration .o-container__row .col__4:first-child {
  display: none;
}
@media (min-width: 992px) {
  .teaser-myift-registration .o-container__row .col__4:first-child {
    display: block;
  }
}
.teaser-myift-registration .teaser-myift-registration__header > p {
  margin: 0;
}
.teaser-myift-registration__content--centered {
  text-align: center;
}
.teaser-myift-registration__content--centered h2 {
  font-size: 3.75rem;
}
.teaser-myift-registration__content--centered .button__ghost--negative:hover {
  color: #FFFFFF;
}

.datepicker {
  width: -moz-min-content;
  width: -webkit-min-content;
  width: min-content;
}

.datepicker:not(.active) {
  display: none;
}

.datepicker-dropdown {
  position: absolute;
  z-index: 20;
  padding-top: 4px;
}

.datepicker-dropdown.datepicker-orient-top {
  padding-top: 0;
  padding-bottom: 4px;
}

.datepicker-picker {
  display: flex;
  flex-direction: column;
  border-radius: 4px;
  background-color: white;
}

.datepicker-dropdown .datepicker-picker {
  box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
}

.datepicker-main {
  flex: auto;
  padding: 2px;
}

.datepicker-footer {
  box-shadow: inset 0 1px 1px rgba(10, 10, 10, 0.1);
  background-color: whitesmoke;
}

.datepicker-title {
  box-shadow: inset 0 -1px 1px rgba(10, 10, 10, 0.1);
  background-color: whitesmoke;
  padding: 0.375rem 0.75rem;
  text-align: center;
  font-weight: 700;
}

.datepicker-controls {
  display: flex;
}

.datepicker-header .datepicker-controls {
  padding: 2px 2px 0;
}

.datepicker-controls .button {
  display: inline-flex;
  margin: 0;
  position: relative;
  align-items: center;
  justify-content: center;
  border: 1px solid gainsboro;
  border-radius: 4px;
  box-shadow: none;
  background-color: white;
  cursor: pointer;
  padding: calc(0.375em - 1px) 0.75em;
  height: 2.25em;
  vertical-align: top;
  text-align: center;
  line-height: 1.5;
  white-space: nowrap;
  color: #363636;
  font-size: 1rem;
}

.datepicker-controls .button:focus,
.datepicker-controls .button:active {
  outline: none;
}

.datepicker-controls .button:hover {
  border-color: #B8B8B8;
  color: #363636;
}

.datepicker-controls .button:focus {
  border-color: #3273dc;
  color: #363636;
}

.datepicker-controls .button:focus:not(:active) {
  box-shadow: 0 0 0 0.125em rgba(50, 115, 220, 0.25);
}

.datepicker-controls .button:active {
  border-color: #474747;
  color: #363636;
}

.datepicker-controls .button[disabled] {
  cursor: not-allowed;
}

.datepicker-header .datepicker-controls .button {
  border-color: transparent;
  font-weight: bold;
}

.datepicker-header .datepicker-controls .button:hover {
  background-color: #F9F9F9;
}

.datepicker-header .datepicker-controls .button:active {
  background-color: #F2F2F2;
}

.datepicker-footer .datepicker-controls .button {
  margin: calc(0.375rem - 1px) 0.375rem;
  flex: auto;
  border-radius: 2px;
  font-size: 0.75rem;
}

.datepicker-controls .view-switch {
  flex: auto;
}

.datepicker-controls .prev-button,
.datepicker-controls .next-button {
  padding-right: 0.375rem;
  padding-left: 0.375rem;
  flex: 0 0 14.2857142857%;
}

.datepicker-controls .prev-button.disabled,
.datepicker-controls .next-button.disabled {
  visibility: hidden;
}

.datepicker-view,
.datepicker-grid {
  display: flex;
}

.datepicker-view {
  align-items: stretch;
  width: 15.75rem;
}

.datepicker-grid {
  flex-wrap: wrap;
  flex: auto;
}

.datepicker .days {
  display: flex;
  flex-direction: column;
  flex: auto;
}

.datepicker .days-of-week {
  display: flex;
}

.datepicker .week-numbers {
  display: flex;
  flex-direction: column;
  flex: 0 0 9.6774193548%;
}

.datepicker .weeks {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  flex: auto;
}

.datepicker span {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  cursor: default;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
      user-select: none;
}

.datepicker .dow {
  height: 1.5rem;
  font-size: 0.875rem;
  font-weight: 700;
}

.datepicker .week {
  flex: auto;
  color: #B8B8B8;
  font-size: 0.75rem;
}

.datepicker-cell,
.datepicker .days .dow {
  flex-basis: 14.2857142857%;
}

.datepicker-cell {
  height: 2.25rem;
}

.datepicker-cell:not(.day) {
  flex-basis: 25%;
  height: 4.5rem;
}

.datepicker-cell:not(.disabled):hover {
  background-color: #F9F9F9;
  cursor: pointer;
}

.datepicker-cell.focused:not(.selected) {
  background-color: #E9E9E9;
}

.datepicker-cell.selected,
.datepicker-cell.selected:hover {
  background-color: #3273dc;
  color: #FFFFFF;
  font-weight: 600;
}

.datepicker-cell.disabled {
  color: gainsboro;
}

.datepicker-cell.prev:not(.disabled),
.datepicker-cell.next:not(.disabled) {
  color: #7a7a7a;
}

.datepicker-cell.prev.selected,
.datepicker-cell.next.selected {
  color: #E6E6E6;
}

.datepicker-cell.highlighted:not(.selected):not(.range):not(.today) {
  border-radius: 0;
  background-color: whitesmoke;
}

.datepicker-cell.highlighted:not(.selected):not(.range):not(.today):not(.disabled):hover {
  background-color: #EFEFEF;
}

.datepicker-cell.highlighted:not(.selected):not(.range):not(.today).focused {
  background-color: #E9E9E9;
}

.datepicker-cell.today:not(.selected) {
  background-color: #00d1b2;
}

.datepicker-cell.today:not(.selected):not(.disabled) {
  color: #FFFFFF;
}

.datepicker-cell.today.focused:not(.selected) {
  background-color: #00CCAD;
}

.datepicker-cell.range-end:not(.selected),
.datepicker-cell.range-start:not(.selected) {
  background-color: #B8B8B8;
  color: #FFFFFF;
}

.datepicker-cell.range-end.focused:not(.selected),
.datepicker-cell.range-start.focused:not(.selected) {
  background-color: #B3B3B3;
}

.datepicker-cell.range-start:not(.range-end) {
  border-radius: 4px 0 0 4px;
}

.datepicker-cell.range-end:not(.range-start) {
  border-radius: 0 4px 4px 0;
}

.datepicker-cell.range {
  border-radius: 0;
  background-color: gainsboro;
}

.datepicker-cell.range:not(.disabled):not(.focused):not(.today):hover {
  background-color: #D7D7D7;
}

.datepicker-cell.range.disabled {
  color: #C6C6C6;
}

.datepicker-cell.range.focused {
  background-color: #D1D1D1;
}

.datepicker-input.in-edit {
  border-color: #276BDA;
}

.datepicker-input.in-edit:focus,
.datepicker-input.in-edit:active {
  box-shadow: 0 0 0.25em 0.25em rgba(39, 107, 218, 0.2);
}

.button--full > [class^=button] {
  width: 100%;
}
@media (max-width: 768px) {
  .button--full > [class^=button] {
    width: 100%;
  }
}
.button--full > [class^=button] * {
  width: 100%;
}

.myift__certifications .downloads__title {
  -webkit-hyphens: auto;
      -ms-hyphens: auto;
          hyphens: auto;
}

.myift__calibration .downloads__item:not(:last-child) {
  border-bottom: 0 solid #FFFFFF;
}

.cmppreviewroot {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

body > .cmppreviewroot {
  display: none;
}

/**
 * https://github.com/electerious/basicLightbox/
 * Version 4.0.0
 */
.basicLightbox {
  display: flex;
  position: fixed;
  justify-content: center;
  align-items: center;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.8);
  opacity: 0.01;
  transition: opacity 0.4s ease;
  z-index: 1338;
  will-change: opacity;
}
.basicLightbox--visible {
  opacity: 1;
}
.basicLightbox__placeholder {
  max-width: 100%;
  transform: scale(0.9);
  transition: transform 0.4s ease;
  z-index: 1;
  will-change: transform;
}
.basicLightbox__placeholder > img:first-child:last-child,
.basicLightbox__placeholder > video:first-child:last-child,
.basicLightbox__placeholder > iframe:first-child:last-child {
  display: block;
  margin: auto;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  max-width: 95%;
  max-height: 95%;
}
.basicLightbox__placeholder > img:first-child:last-child,
.basicLightbox__placeholder > video:first-child:last-child {
  width: auto;
  height: auto;
}
.basicLightbox__placeholder > [data-basicLightbox] {
  display: block;
}
.basicLightbox--img .basicLightbox__placeholder, .basicLightbox--video .basicLightbox__placeholder, .basicLightbox--iframe .basicLightbox__placeholder {
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.basicLightbox--visible .basicLightbox__placeholder {
  transform: scale(1);
}

[data-basicLightbox] {
  display: none;
}

.lux_waiting {
  cursor: progress;
}

.lux_container_email4link {
  display: none;
}

.lux_lightbox_container {
  background: white;
  padding: 50px;
  max-width: 800px;
}
.lux_lightbox_container form {
  text-align: center;
}

.lux_smalltext {
  font-size: 0.8em;
  padding-top: 10px;
}

.lux_poweredby {
  font-size: 0.8em;
  color: var(--highlightBlue);
  position: absolute;
  right: 50px;
  bottom: 30px;
  text-decoration: none;
}
.lux_poweredby > img {
  vertical-align: middle;
}

.basicLightbox--iframe .basicLightbox__placeholder {
  pointer-events: all;
}
.basicLightbox__close {
  border: none;
  background: none;
  position: absolute;
  top: 20px;
  right: 20px;
  width: 32px;
  height: 32px;
  opacity: 0.3;
  font-size: 0;
}
.basicLightbox__close:hover {
  opacity: 1;
}
.basicLightbox__close:before, .basicLightbox__close:after {
  position: absolute;
  left: 15px;
  content: " ";
  height: 33px;
  width: 2px;
  background-color: #333;
  top: 0;
}
.basicLightbox__close:before {
  transform: rotate(45deg);
}
.basicLightbox__close:after {
  transform: rotate(-45deg);
}
.basicLightbox iframe {
  background-color: #FFFFFF;
}

/*------------------------------------*\
  #TRUMPS
\*------------------------------------*/
/**
 * “This layer beats – or 'trumps' – all other layers, and has the power to
 * override anything at all that has gone before it. It is inelegant and
 * heavy-handed, and contains utility and helper classes, hacks and overrides.
 *
 * A lot of the declarations in this layer will carry !important (e.g.
 * .text-center { text-align: centre !important; }). This is the highest
 * specificity layer – it includes the most explicit types of rule, with the
 * most narrow focus. This layer forms the point of the Triangle.”
 *
 * (Source: see link at the top)
 */
/*------------------------------------*\
  #CLEARFIX
\*------------------------------------*/
.clearfix::before, .clearfix::after {
  display: table;
  content: " ";
}
.clearfix::after {
  clear: both;
}

/*------------------------------------*\
  #UTILITIES
\*------------------------------------*/
/*------------------------------------*\
  #GTM fix
\*------------------------------------*/
.iframe-hide {
  display: none;
  visibility: hidden;
}

/*------------------------------------*\
  #VISIBILITY
\*------------------------------------*/
.u-hide {
  display: none !important;
}

.u-block {
  display: block;
}

.u-none {
  display: none;
}

.align--right {
  text-align: right;
}

/*------------------------------------*\
  #SHAME
\*------------------------------------*/
/**
 * “The idea of shame.css is that you have a totally new stylesheet reserved
 * just for your hacky code. The code you have to write to get the release out
 * on time, but the code that makes you ashamed.” (Harry Roberts,
 * http://csswizardry.com/2013/04/shame-css/)
 */
/*------------------------------------*\
  #FULLPAGE
\*------------------------------------*/
/*
Fullpage

Styleguide 10
*/
.flickity-viewport {
  transition: height 0.25s;
}

.flickity-page-dots {
  pointer-events: none;
  opacity: 0;
  bottom: 3.3em;
}

.tippy-box {
  font-size: 12px;
  padding: 10px;
  color: #474747;
}

.background__grey {
  padding-top: 60px;
  padding-bottom: 60px;
  background-color: #F7F7F7;
}
.background__grey.icon__text {
  padding: 100px 0 0;
}
@media (max-width: 768px) {
  .background__grey.icon__text {
    padding: 40px 0;
  }
}

.background__gradient {
  background: linear-gradient(0deg, #f7f7f7 0%, white 100%);
}
.background__gradient.logo-bar {
  padding: 45px 0;
}

.flickity-page-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 60px 0 0;
  bottom: auto !important;
}
@media (max-width: 768px) {
  .flickity-page-dots {
    padding: 40px 0 0;
  }
}

.mb-0 {
  margin-bottom: 0 !important;
}

.mb-1 {
  margin-bottom: 20px !important;
}

.mb-2 {
  margin-bottom: 40px !important;
}

.mb-3 {
  margin-bottom: 60px !important;
}

.mb-4 {
  margin-bottom: 80px !important;
}

.mb-5 {
  margin-bottom: 100px !important;
}

.mb-6 {
  margin-bottom: 120px !important;
}

.mb-7 {
  margin-bottom: 140px !important;
}

.mb-8 {
  margin-bottom: 160px !important;
}

.mb-9 {
  margin-bottom: 180px !important;
}

.mb-10 {
  margin-bottom: 200px !important;
}

@media (min-width: 577px) {
  .mb-sm-0 {
    margin-bottom: 0 !important;
  }

  .mb-sm-1 {
    margin-bottom: 20px !important;
  }

  .mb-sm-2 {
    margin-bottom: 40px !important;
  }

  .mb-sm-3 {
    margin-bottom: 60px !important;
  }

  .mb-sm-4 {
    margin-bottom: 80px !important;
  }

  .mb-sm-5 {
    margin-bottom: 100px !important;
  }

  .mb-sm-6 {
    margin-bottom: 120px !important;
  }

  .mb-sm-7 {
    margin-bottom: 140px !important;
  }

  .mb-sm-8 {
    margin-bottom: 160px !important;
  }

  .mb-sm-9 {
    margin-bottom: 180px !important;
  }

  .mb-sm-10 {
    margin-bottom: 200px !important;
  }
}
@media (min-width: 769px) {
  .mb-md-0 {
    margin-bottom: 0 !important;
  }

  .mb-md-1 {
    margin-bottom: 20px !important;
  }

  .mb-md-2 {
    margin-bottom: 40px !important;
  }

  .mb-md-3 {
    margin-bottom: 60px !important;
  }

  .mb-md-4 {
    margin-bottom: 80px !important;
  }

  .mb-md-5 {
    margin-bottom: 100px !important;
  }

  .mb-md-6 {
    margin-bottom: 120px !important;
  }

  .mb-md-7 {
    margin-bottom: 140px !important;
  }

  .mb-md-8 {
    margin-bottom: 160px !important;
  }

  .mb-md-9 {
    margin-bottom: 180px !important;
  }

  .mb-md-10 {
    margin-bottom: 200px !important;
  }
}
@media (min-width: 993px) {
  .mb-lg-0 {
    margin-bottom: 0 !important;
  }

  .mb-lg-1 {
    margin-bottom: 20px !important;
  }

  .mb-lg-2 {
    margin-bottom: 40px !important;
  }

  .mb-lg-3 {
    margin-bottom: 60px !important;
  }

  .mb-lg-4 {
    margin-bottom: 80px !important;
  }

  .mb-lg-5 {
    margin-bottom: 100px !important;
  }

  .mb-lg-6 {
    margin-bottom: 120px !important;
  }

  .mb-lg-7 {
    margin-bottom: 140px !important;
  }

  .mb-lg-8 {
    margin-bottom: 160px !important;
  }

  .mb-lg-9 {
    margin-bottom: 180px !important;
  }

  .mb-lg-10 {
    margin-bottom: 200px !important;
  }
}
@media (min-width: 1221px) {
  .mb-xl-0 {
    margin-bottom: 0 !important;
  }

  .mb-xl-1 {
    margin-bottom: 20px !important;
  }

  .mb-xl-2 {
    margin-bottom: 40px !important;
  }

  .mb-xl-3 {
    margin-bottom: 60px !important;
  }

  .mb-xl-4 {
    margin-bottom: 80px !important;
  }

  .mb-xl-5 {
    margin-bottom: 100px !important;
  }

  .mb-xl-6 {
    margin-bottom: 120px !important;
  }

  .mb-xl-7 {
    margin-bottom: 140px !important;
  }

  .mb-xl-8 {
    margin-bottom: 160px !important;
  }

  .mb-xl-9 {
    margin-bottom: 180px !important;
  }

  .mb-xl-10 {
    margin-bottom: 200px !important;
  }
}
.navigation-row {
  display: flex;
  margin-top: 60px;
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
  transform: translateY(50%);
}
.navigation-row .navigation--previous,
.navigation-row .navigation--next {
  display: flex;
  margin: 0;
  align-items: center;
  justify-content: center;
  padding: 0;
  width: 44px;
  height: 44px;
  background: transparent;
  border: 0;
  cursor: pointer;
}

.navigation-group {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  width: 200px;
}

.navigation-button {
  margin: 4px;
  padding: 0;
  text-indent: -999em;
  max-width: 8px;
  height: 1px;
  background: #474747;
  border-radius: 0;
  transition: 0.25s;
  border: 0;
  cursor: pointer;
  width: 100%;
}
.navigation-button--selected {
  max-width: 24px;
  height: 2px;
  background: var(--highlightBlue);
}

/*------------------------------------*\
  #CKEditor
\*------------------------------------*/
.cke_editable {
  padding: 1rem;
}