/**
 * app.css
 *
 * The entry point for the css.
 *
 */

/**
 * Here we add custom component classes; stuff we want loaded
 * *before* the utilities so that the utilities can still
 * override them.
 *
 */

.glide {
  position: relative;
  width: 100%;
  box-sizing: border-box;
}

.glide * {
  box-sizing: inherit;
}

.glide__track {
  overflow: hidden;
}

.glide__slides {
  position: relative;
  width: 100%;
  list-style: none;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  transform-style: preserve-3d;
  touch-action: pan-Y;
  overflow: hidden;
  margin: 0;
  padding: 0;
  white-space: nowrap;
  display: flex;
  flex-wrap: nowrap;
  will-change: transform;
}

.glide__slides--dragging {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.glide__slide {
  width: 100%;
  height: 100%;
  flex-shrink: 0;
  white-space: normal;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
}

.glide__slide a {
  -webkit-user-select: none;
          user-select: none;
  -webkit-user-drag: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

.glide__arrows {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.glide__bullets {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.glide--rtl {
  direction: rtl;
}

.glide__arrow {
  position: absolute;
  display: block;
  top: 50%;
  z-index: 2;
  color: white;
  text-transform: uppercase;
  padding: 9px 12px;
  background-color: transparent;
  border: 2px solid rgba(255, 255, 255, 0.5);
  border-radius: 4px;
  box-shadow: 0 0.25em 0.5em 0 rgba(0, 0, 0, 0.1);
  text-shadow: 0 0.25em 0.5em rgba(0, 0, 0, 0.1);
  opacity: 1;
  cursor: pointer;
  transition: opacity 150ms ease, border 300ms ease-in-out;
  transform: translateY(-50%);
  line-height: 1;
}

.glide__arrow:focus {
  outline: none;
}

.glide__arrow:hover {
  border-color: white;
}

.glide__arrow--left {
  left: 2em;
}

.glide__arrow--right {
  right: 2em;
}

.glide__arrow--disabled {
  opacity: 0.33;
}

.glide__bullets {
  position: absolute;
  z-index: 2;
  bottom: 2em;
  left: 50%;
  display: inline-flex;
  list-style: none;
  transform: translateX(-50%);
}

.glide__bullet {
  background-color: rgba(255, 255, 255, 0.5);
  width: 9px;
  height: 9px;
  padding: 0;
  border-radius: 50%;
  border: 2px solid transparent;
  transition: all 300ms ease-in-out;
  cursor: pointer;
  line-height: 0;
  box-shadow: 0 0.25em 0.5em 0 rgba(0, 0, 0, 0.1);
  margin: 0 0.25em;
}

.glide__bullet:focus {
  outline: none;
}

.glide__bullet:hover, .glide__bullet:focus {
  border: 2px solid white;
  background-color: rgba(255, 255, 255, 0.5);
}

.glide__bullet--active {
  background-color: white;
}

.glide--swipeable {
  cursor: grab;
  cursor: -webkit-grab;
}

.glide--dragging {
  cursor: grabbing;
  cursor: -webkit-grabbing;
}

/*!
 * Hamburgers
 * @description Tasty CSS-animated hamburgers
 * @author Jonathan Suh @jonsuh
 * @site https://jonsuh.com/hamburgers
 * @link https://github.com/jonsuh/hamburgers
 */

.hamburger {
  padding: 15px 15px;
  display: inline-block;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  overflow: visible;
}

.hamburger:hover {
  opacity: 0.7;
}

.hamburger.is-active:hover {
  opacity: 0.7;
}

.hamburger.is-active .hamburger-inner,
.hamburger.is-active .hamburger-inner::before,
.hamburger.is-active .hamburger-inner::after {
  background-color: #000;
}

.hamburger-box {
  width: 40px;
  height: 24px;
  display: inline-block;
  position: relative;
}

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -2px;
}

.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
  width: 40px;
  height: 4px;
  background-color: #000;
  border-radius: 4px;
  position: absolute;
  transition-property: transform;
  transition-duration: 0.15s;
  transition-timing-function: ease;
}

.hamburger-inner::before, .hamburger-inner::after {
  content: "";
  display: block;
}

.hamburger-inner::before {
  top: -10px;
}

.hamburger-inner::after {
  bottom: -10px;
}

/*
 * 3DX
 */

.hamburger--3dx .hamburger-box {
  perspective: 80px;
}

.hamburger--3dx .hamburger-inner {
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dx .hamburger-inner::before, .hamburger--3dx .hamburger-inner::after {
  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dx.is-active .hamburger-inner {
  background-color: transparent !important;
  transform: rotateY(180deg);
}

.hamburger--3dx.is-active .hamburger-inner::before {
  transform: translate3d(0, 10px, 0) rotate(45deg);
}

.hamburger--3dx.is-active .hamburger-inner::after {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
}

/*
 * 3DX Reverse
 */

.hamburger--3dx-r .hamburger-box {
  perspective: 80px;
}

.hamburger--3dx-r .hamburger-inner {
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dx-r .hamburger-inner::before, .hamburger--3dx-r .hamburger-inner::after {
  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dx-r.is-active .hamburger-inner {
  background-color: transparent !important;
  transform: rotateY(-180deg);
}

.hamburger--3dx-r.is-active .hamburger-inner::before {
  transform: translate3d(0, 10px, 0) rotate(45deg);
}

.hamburger--3dx-r.is-active .hamburger-inner::after {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
}

/*
 * 3DY
 */

.hamburger--3dy .hamburger-box {
  perspective: 80px;
}

.hamburger--3dy .hamburger-inner {
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dy .hamburger-inner::before, .hamburger--3dy .hamburger-inner::after {
  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dy.is-active .hamburger-inner {
  background-color: transparent !important;
  transform: rotateX(-180deg);
}

.hamburger--3dy.is-active .hamburger-inner::before {
  transform: translate3d(0, 10px, 0) rotate(45deg);
}

.hamburger--3dy.is-active .hamburger-inner::after {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
}

/*
 * 3DY Reverse
 */

.hamburger--3dy-r .hamburger-box {
  perspective: 80px;
}

.hamburger--3dy-r .hamburger-inner {
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dy-r .hamburger-inner::before, .hamburger--3dy-r .hamburger-inner::after {
  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dy-r.is-active .hamburger-inner {
  background-color: transparent !important;
  transform: rotateX(180deg);
}

.hamburger--3dy-r.is-active .hamburger-inner::before {
  transform: translate3d(0, 10px, 0) rotate(45deg);
}

.hamburger--3dy-r.is-active .hamburger-inner::after {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
}

/*
 * 3DXY
 */

.hamburger--3dxy .hamburger-box {
  perspective: 80px;
}

.hamburger--3dxy .hamburger-inner {
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dxy .hamburger-inner::before, .hamburger--3dxy .hamburger-inner::after {
  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dxy.is-active .hamburger-inner {
  background-color: transparent !important;
  transform: rotateX(180deg) rotateY(180deg);
}

.hamburger--3dxy.is-active .hamburger-inner::before {
  transform: translate3d(0, 10px, 0) rotate(45deg);
}

.hamburger--3dxy.is-active .hamburger-inner::after {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
}

/*
 * 3DXY Reverse
 */

.hamburger--3dxy-r .hamburger-box {
  perspective: 80px;
}

.hamburger--3dxy-r .hamburger-inner {
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dxy-r .hamburger-inner::before, .hamburger--3dxy-r .hamburger-inner::after {
  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.hamburger--3dxy-r.is-active .hamburger-inner {
  background-color: transparent !important;
  transform: rotateX(180deg) rotateY(180deg) rotateZ(-180deg);
}

.hamburger--3dxy-r.is-active .hamburger-inner::before {
  transform: translate3d(0, 10px, 0) rotate(45deg);
}

.hamburger--3dxy-r.is-active .hamburger-inner::after {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
}

/*
 * Arrow
 */

.hamburger--arrow.is-active .hamburger-inner::before {
  transform: translate3d(-8px, 0, 0) rotate(-45deg) scale(0.7, 1);
}

.hamburger--arrow.is-active .hamburger-inner::after {
  transform: translate3d(-8px, 0, 0) rotate(45deg) scale(0.7, 1);
}

/*
 * Arrow Right
 */

.hamburger--arrow-r.is-active .hamburger-inner::before {
  transform: translate3d(8px, 0, 0) rotate(45deg) scale(0.7, 1);
}

.hamburger--arrow-r.is-active .hamburger-inner::after {
  transform: translate3d(8px, 0, 0) rotate(-45deg) scale(0.7, 1);
}

/*
 * Arrow Alt
 */

.hamburger--arrowalt .hamburger-inner::before {
  transition: top 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.hamburger--arrowalt .hamburger-inner::after {
  transition: bottom 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.hamburger--arrowalt.is-active .hamburger-inner::before {
  top: 0;
  transform: translate3d(-8px, -10px, 0) rotate(-45deg) scale(0.7, 1);
  transition: top 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
}

.hamburger--arrowalt.is-active .hamburger-inner::after {
  bottom: 0;
  transform: translate3d(-8px, 10px, 0) rotate(45deg) scale(0.7, 1);
  transition: bottom 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
}

/*
 * Arrow Alt Right
 */

.hamburger--arrowalt-r .hamburger-inner::before {
  transition: top 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.hamburger--arrowalt-r .hamburger-inner::after {
  transition: bottom 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.hamburger--arrowalt-r.is-active .hamburger-inner::before {
  top: 0;
  transform: translate3d(8px, -10px, 0) rotate(45deg) scale(0.7, 1);
  transition: top 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
}

.hamburger--arrowalt-r.is-active .hamburger-inner::after {
  bottom: 0;
  transform: translate3d(8px, 10px, 0) rotate(-45deg) scale(0.7, 1);
  transition: bottom 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
}

/*
 * Arrow Turn
 */

.hamburger--arrowturn.is-active .hamburger-inner {
  transform: rotate(-180deg);
}

.hamburger--arrowturn.is-active .hamburger-inner::before {
  transform: translate3d(8px, 0, 0) rotate(45deg) scale(0.7, 1);
}

.hamburger--arrowturn.is-active .hamburger-inner::after {
  transform: translate3d(8px, 0, 0) rotate(-45deg) scale(0.7, 1);
}

/*
 * Arrow Turn Right
 */

.hamburger--arrowturn-r.is-active .hamburger-inner {
  transform: rotate(-180deg);
}

.hamburger--arrowturn-r.is-active .hamburger-inner::before {
  transform: translate3d(-8px, 0, 0) rotate(-45deg) scale(0.7, 1);
}

.hamburger--arrowturn-r.is-active .hamburger-inner::after {
  transform: translate3d(-8px, 0, 0) rotate(45deg) scale(0.7, 1);
}

/*
 * Boring
 */

.hamburger--boring .hamburger-inner, .hamburger--boring .hamburger-inner::before, .hamburger--boring .hamburger-inner::after {
  transition-property: none;
}

.hamburger--boring.is-active .hamburger-inner {
  transform: rotate(45deg);
}

.hamburger--boring.is-active .hamburger-inner::before {
  top: 0;
  opacity: 0;
}

.hamburger--boring.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(-90deg);
}

/*
 * Collapse
 */

.hamburger--collapse .hamburger-inner {
  top: auto;
  bottom: 0;
  transition-duration: 0.13s;
  transition-delay: 0.13s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--collapse .hamburger-inner::after {
  top: -20px;
  transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear;
}

.hamburger--collapse .hamburger-inner::before {
  transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--collapse.is-active .hamburger-inner {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
  transition-delay: 0.22s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

.hamburger--collapse.is-active .hamburger-inner::after {
  top: 0;
  opacity: 0;
  transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear;
}

.hamburger--collapse.is-active .hamburger-inner::before {
  top: 0;
  transform: rotate(-90deg);
  transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/*
 * Collapse Reverse
 */

.hamburger--collapse-r .hamburger-inner {
  top: auto;
  bottom: 0;
  transition-duration: 0.13s;
  transition-delay: 0.13s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--collapse-r .hamburger-inner::after {
  top: -20px;
  transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear;
}

.hamburger--collapse-r .hamburger-inner::before {
  transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--collapse-r.is-active .hamburger-inner {
  transform: translate3d(0, -10px, 0) rotate(45deg);
  transition-delay: 0.22s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

.hamburger--collapse-r.is-active .hamburger-inner::after {
  top: 0;
  opacity: 0;
  transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear;
}

.hamburger--collapse-r.is-active .hamburger-inner::before {
  top: 0;
  transform: rotate(90deg);
  transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/*
 * Elastic
 */

.hamburger--elastic .hamburger-inner {
  top: 2px;
  transition-duration: 0.275s;
  transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.hamburger--elastic .hamburger-inner::before {
  top: 10px;
  transition: opacity 0.125s 0.275s ease;
}

.hamburger--elastic .hamburger-inner::after {
  top: 20px;
  transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.hamburger--elastic.is-active .hamburger-inner {
  transform: translate3d(0, 10px, 0) rotate(135deg);
  transition-delay: 0.075s;
}

.hamburger--elastic.is-active .hamburger-inner::before {
  transition-delay: 0s;
  opacity: 0;
}

.hamburger--elastic.is-active .hamburger-inner::after {
  transform: translate3d(0, -20px, 0) rotate(-270deg);
  transition-delay: 0.075s;
}

/*
 * Elastic Reverse
 */

.hamburger--elastic-r .hamburger-inner {
  top: 2px;
  transition-duration: 0.275s;
  transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.hamburger--elastic-r .hamburger-inner::before {
  top: 10px;
  transition: opacity 0.125s 0.275s ease;
}

.hamburger--elastic-r .hamburger-inner::after {
  top: 20px;
  transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.hamburger--elastic-r.is-active .hamburger-inner {
  transform: translate3d(0, 10px, 0) rotate(-135deg);
  transition-delay: 0.075s;
}

.hamburger--elastic-r.is-active .hamburger-inner::before {
  transition-delay: 0s;
  opacity: 0;
}

.hamburger--elastic-r.is-active .hamburger-inner::after {
  transform: translate3d(0, -20px, 0) rotate(270deg);
  transition-delay: 0.075s;
}

/*
 * Emphatic
 */

.hamburger--emphatic {
  overflow: hidden;
}

.hamburger--emphatic .hamburger-inner {
  transition: background-color 0.125s 0.175s ease-in;
}

.hamburger--emphatic .hamburger-inner::before {
  left: 0;
  transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, left 0.125s 0.175s ease-in;
}

.hamburger--emphatic .hamburger-inner::after {
  top: 10px;
  right: 0;
  transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, right 0.125s 0.175s ease-in;
}

.hamburger--emphatic.is-active .hamburger-inner {
  transition-delay: 0s;
  transition-timing-function: ease-out;
  background-color: transparent !important;
}

.hamburger--emphatic.is-active .hamburger-inner::before {
  left: -80px;
  top: -80px;
  transform: translate3d(80px, 80px, 0) rotate(45deg);
  transition: left 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.hamburger--emphatic.is-active .hamburger-inner::after {
  right: -80px;
  top: -80px;
  transform: translate3d(-80px, 80px, 0) rotate(-45deg);
  transition: right 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
}

/*
 * Emphatic Reverse
 */

.hamburger--emphatic-r {
  overflow: hidden;
}

.hamburger--emphatic-r .hamburger-inner {
  transition: background-color 0.125s 0.175s ease-in;
}

.hamburger--emphatic-r .hamburger-inner::before {
  left: 0;
  transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, left 0.125s 0.175s ease-in;
}

.hamburger--emphatic-r .hamburger-inner::after {
  top: 10px;
  right: 0;
  transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, right 0.125s 0.175s ease-in;
}

.hamburger--emphatic-r.is-active .hamburger-inner {
  transition-delay: 0s;
  transition-timing-function: ease-out;
  background-color: transparent !important;
}

.hamburger--emphatic-r.is-active .hamburger-inner::before {
  left: -80px;
  top: 80px;
  transform: translate3d(80px, -80px, 0) rotate(-45deg);
  transition: left 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.hamburger--emphatic-r.is-active .hamburger-inner::after {
  right: -80px;
  top: 80px;
  transform: translate3d(-80px, -80px, 0) rotate(45deg);
  transition: right 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
}

/*
 * Minus
 */

.hamburger--minus .hamburger-inner::before, .hamburger--minus .hamburger-inner::after {
  transition: bottom 0.08s 0s ease-out, top 0.08s 0s ease-out, opacity 0s linear;
}

.hamburger--minus.is-active .hamburger-inner::before, .hamburger--minus.is-active .hamburger-inner::after {
  opacity: 0;
  transition: bottom 0.08s ease-out, top 0.08s ease-out, opacity 0s 0.08s linear;
}

.hamburger--minus.is-active .hamburger-inner::before {
  top: 0;
}

.hamburger--minus.is-active .hamburger-inner::after {
  bottom: 0;
}

/*
 * Slider
 */

.hamburger--slider .hamburger-inner {
  top: 2px;
}

.hamburger--slider .hamburger-inner::before {
  top: 10px;
  transition-property: transform, opacity;
  transition-timing-function: ease;
  transition-duration: 0.15s;
}

.hamburger--slider .hamburger-inner::after {
  top: 20px;
}

.hamburger--slider.is-active .hamburger-inner {
  transform: translate3d(0, 10px, 0) rotate(45deg);
}

.hamburger--slider.is-active .hamburger-inner::before {
  transform: rotate(-45deg) translate3d(-5.7142857143px, -6px, 0);
  opacity: 0;
}

.hamburger--slider.is-active .hamburger-inner::after {
  transform: translate3d(0, -20px, 0) rotate(-90deg);
}

/*
 * Slider Reverse
 */

.hamburger--slider-r .hamburger-inner {
  top: 2px;
}

.hamburger--slider-r .hamburger-inner::before {
  top: 10px;
  transition-property: transform, opacity;
  transition-timing-function: ease;
  transition-duration: 0.15s;
}

.hamburger--slider-r .hamburger-inner::after {
  top: 20px;
}

.hamburger--slider-r.is-active .hamburger-inner {
  transform: translate3d(0, 10px, 0) rotate(-45deg);
}

.hamburger--slider-r.is-active .hamburger-inner::before {
  transform: rotate(45deg) translate3d(5.7142857143px, -6px, 0);
  opacity: 0;
}

.hamburger--slider-r.is-active .hamburger-inner::after {
  transform: translate3d(0, -20px, 0) rotate(90deg);
}

/*
 * Spin
 */

.hamburger--spin .hamburger-inner {
  transition-duration: 0.22s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spin .hamburger-inner::before {
  transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in;
}

.hamburger--spin .hamburger-inner::after {
  transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spin.is-active .hamburger-inner {
  transform: rotate(225deg);
  transition-delay: 0.12s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

.hamburger--spin.is-active .hamburger-inner::before {
  top: 0;
  opacity: 0;
  transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out;
}

.hamburger--spin.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(-90deg);
  transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/*
 * Spin Reverse
 */

.hamburger--spin-r .hamburger-inner {
  transition-duration: 0.22s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spin-r .hamburger-inner::before {
  transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in;
}

.hamburger--spin-r .hamburger-inner::after {
  transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spin-r.is-active .hamburger-inner {
  transform: rotate(-225deg);
  transition-delay: 0.12s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

.hamburger--spin-r.is-active .hamburger-inner::before {
  top: 0;
  opacity: 0;
  transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out;
}

.hamburger--spin-r.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(90deg);
  transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/*
 * Spring
 */

.hamburger--spring .hamburger-inner {
  top: 2px;
  transition: background-color 0s 0.13s linear;
}

.hamburger--spring .hamburger-inner::before {
  top: 10px;
  transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spring .hamburger-inner::after {
  top: 20px;
  transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spring.is-active .hamburger-inner {
  transition-delay: 0.22s;
  background-color: transparent !important;
}

.hamburger--spring.is-active .hamburger-inner::before {
  top: 0;
  transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
  transform: translate3d(0, 10px, 0) rotate(45deg);
}

.hamburger--spring.is-active .hamburger-inner::after {
  top: 0;
  transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
  transform: translate3d(0, 10px, 0) rotate(-45deg);
}

/*
 * Spring Reverse
 */

.hamburger--spring-r .hamburger-inner {
  top: auto;
  bottom: 0;
  transition-duration: 0.13s;
  transition-delay: 0s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spring-r .hamburger-inner::after {
  top: -20px;
  transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0s linear;
}

.hamburger--spring-r .hamburger-inner::before {
  transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--spring-r.is-active .hamburger-inner {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
  transition-delay: 0.22s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

.hamburger--spring-r.is-active .hamburger-inner::after {
  top: 0;
  opacity: 0;
  transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0s 0.22s linear;
}

.hamburger--spring-r.is-active .hamburger-inner::before {
  top: 0;
  transform: rotate(90deg);
  transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/*
 * Stand
 */

.hamburger--stand .hamburger-inner {
  transition: transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19), background-color 0s 0.075s linear;
}

.hamburger--stand .hamburger-inner::before {
  transition: top 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--stand .hamburger-inner::after {
  transition: bottom 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--stand.is-active .hamburger-inner {
  transform: rotate(90deg);
  background-color: transparent !important;
  transition: transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1), background-color 0s 0.15s linear;
}

.hamburger--stand.is-active .hamburger-inner::before {
  top: 0;
  transform: rotate(-45deg);
  transition: top 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.hamburger--stand.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(45deg);
  transition: bottom 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/*
 * Stand Reverse
 */

.hamburger--stand-r .hamburger-inner {
  transition: transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19), background-color 0s 0.075s linear;
}

.hamburger--stand-r .hamburger-inner::before {
  transition: top 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--stand-r .hamburger-inner::after {
  transition: bottom 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--stand-r.is-active .hamburger-inner {
  transform: rotate(-90deg);
  background-color: transparent !important;
  transition: transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1), background-color 0s 0.15s linear;
}

.hamburger--stand-r.is-active .hamburger-inner::before {
  top: 0;
  transform: rotate(-45deg);
  transition: top 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.hamburger--stand-r.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(45deg);
  transition: bottom 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/*
 * Squeeze
 */

.hamburger--squeeze .hamburger-inner {
  transition-duration: 0.075s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--squeeze .hamburger-inner::before {
  transition: top 0.075s 0.12s ease, opacity 0.075s ease;
}

.hamburger--squeeze .hamburger-inner::after {
  transition: bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--squeeze.is-active .hamburger-inner {
  transform: rotate(45deg);
  transition-delay: 0.12s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

.hamburger--squeeze.is-active .hamburger-inner::before {
  top: 0;
  opacity: 0;
  transition: top 0.075s ease, opacity 0.075s 0.12s ease;
}

.hamburger--squeeze.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(-90deg);
  transition: bottom 0.075s ease, transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/*
 * Vortex
 */

.hamburger--vortex .hamburger-inner {
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}

.hamburger--vortex .hamburger-inner::before, .hamburger--vortex .hamburger-inner::after {
  transition-duration: 0s;
  transition-delay: 0.1s;
  transition-timing-function: linear;
}

.hamburger--vortex .hamburger-inner::before {
  transition-property: top, opacity;
}

.hamburger--vortex .hamburger-inner::after {
  transition-property: bottom, transform;
}

.hamburger--vortex.is-active .hamburger-inner {
  transform: rotate(765deg);
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}

.hamburger--vortex.is-active .hamburger-inner::before, .hamburger--vortex.is-active .hamburger-inner::after {
  transition-delay: 0s;
}

.hamburger--vortex.is-active .hamburger-inner::before {
  top: 0;
  opacity: 0;
}

.hamburger--vortex.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(90deg);
}

/*
 * Vortex Reverse
 */

.hamburger--vortex-r .hamburger-inner {
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}

.hamburger--vortex-r .hamburger-inner::before, .hamburger--vortex-r .hamburger-inner::after {
  transition-duration: 0s;
  transition-delay: 0.1s;
  transition-timing-function: linear;
}

.hamburger--vortex-r .hamburger-inner::before {
  transition-property: top, opacity;
}

.hamburger--vortex-r .hamburger-inner::after {
  transition-property: bottom, transform;
}

.hamburger--vortex-r.is-active .hamburger-inner {
  transform: rotate(-765deg);
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}

.hamburger--vortex-r.is-active .hamburger-inner::before, .hamburger--vortex-r.is-active .hamburger-inner::after {
  transition-delay: 0s;
}

.hamburger--vortex-r.is-active .hamburger-inner::before {
  top: 0;
  opacity: 0;
}

.hamburger--vortex-r.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(-90deg);
}

.pretty * {
  box-sizing: border-box;
}

.pretty input:not([type=checkbox]):not([type=radio]) {
  display: none;
}

.pretty {
  position: relative;
  display: inline-block;
  margin-right: 1em;
  white-space: nowrap;
  line-height: 1;
}

.pretty input {
  position: absolute;
  left: 0;
  top: 0;
  min-width: 1em;
  width: 100%;
  height: 100%;
  z-index: 2;
  opacity: 0;
  margin: 0;
  padding: 0;
  cursor: pointer;
}

.pretty .state label {
  position: initial;
  display: inline-block;
  font-weight: normal;
  margin: 0;
  text-indent: 1.5em;
  min-width: calc(1em + 2px);
}

.pretty .state label:before, .pretty .state label:after {
  content: "";
  width: calc(1em + 2px);
  height: calc(1em + 2px);
  display: block;
  box-sizing: border-box;
  border-radius: 0;
  border: 1px solid transparent;
  z-index: 0;
  position: absolute;
  left: 0;
  top: calc((0% - (100% - 1em)) - 8%);
  background-color: transparent;
}

.pretty .state label:before {
  border-color: #bdc3c7;
}

.pretty .state.p-is-hover, .pretty .state.p-is-indeterminate {
  display: none;
}

@keyframes zoom {
  0% {
    opacity: 0;
    transform: scale(0);
  }
}

@keyframes tada {
  0% {
    animation-timing-function: ease-in;
    opacity: 0;
    transform: scale(7);
  }

  38% {
    animation-timing-function: ease-out;
    opacity: 1;
    transform: scale(1);
  }

  55% {
    animation-timing-function: ease-in;
    transform: scale(1.5);
  }

  72% {
    animation-timing-function: ease-out;
    transform: scale(1);
  }

  81% {
    animation-timing-function: ease-in;
    transform: scale(1.24);
  }

  89% {
    animation-timing-function: ease-out;
    transform: scale(1);
  }

  95% {
    animation-timing-function: ease-in;
    transform: scale(1.04);
  }

  100% {
    animation-timing-function: ease-out;
    transform: scale(1);
  }
}

@keyframes jelly {
  0% {
    transform: scale3d(1, 1, 1);
  }

  30% {
    transform: scale3d(0.75, 1.25, 1);
  }

  40% {
    transform: scale3d(1.25, 0.75, 1);
  }

  50% {
    transform: scale3d(0.85, 1.15, 1);
  }

  65% {
    transform: scale3d(1.05, 0.95, 1);
  }

  75% {
    transform: scale3d(0.95, 1.05, 1);
  }

  100% {
    transform: scale3d(1, 1, 1);
  }
}

@keyframes rotate {
  0% {
    opacity: 0;
    transform: translateZ(-200px) rotate(-45deg);
  }

  100% {
    opacity: 1;
    transform: translateZ(0) rotate(0);
  }
}

@keyframes pulse {
  0% {
    box-shadow: 0px 0px 0px 0px #bdc3c7;
  }

  100% {
    box-shadow: 0px 0px 0px 1.5em rgba(189, 195, 199, 0);
  }
}

.pretty.p-default.p-fill .state label:after {
  transform: scale(1);
}

.pretty.p-default .state label:after {
  transform: scale(0.6);
}

.pretty.p-default input:checked ~ .state label:after {
  background-color: #bdc3c7 !important;
}

.pretty.p-default.p-thick .state label:before, .pretty.p-default.p-thick .state label:after {
  border-width: 0.1428571429em;
}

.pretty.p-default.p-thick .state label:after {
  transform: scale(0.4) !important;
}

.pretty.p-icon .state .icon {
  position: absolute;
  font-size: 1em;
  width: calc(1em + 2px);
  height: calc(1em + 2px);
  left: 0;
  z-index: 1;
  text-align: center;
  line-height: normal;
  top: calc((0% - (100% - 1em)) - 8%);
  border: 1px solid transparent;
  opacity: 0;
}

.pretty.p-icon .state .icon:before {
  margin: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  display: flex;
  flex: 1;
  justify-content: center;
  align-items: center;
  line-height: 1;
}

.pretty.p-icon input:checked ~ .state .icon {
  opacity: 1;
}

.pretty.p-icon input:checked ~ .state label:before {
  border-color: #5a656b;
}

.pretty.p-svg .state .svg {
  position: absolute;
  font-size: 1em;
  width: calc(1em + 2px);
  height: calc(1em + 2px);
  left: 0;
  z-index: 1;
  text-align: center;
  line-height: normal;
  top: calc((0% - (100% - 1em)) - 8%);
  border: 1px solid transparent;
  opacity: 0;
}

.pretty.p-svg .state svg {
  margin: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  display: flex;
  flex: 1;
  justify-content: center;
  align-items: center;
  line-height: 1;
}

.pretty.p-svg input:checked ~ .state .svg {
  opacity: 1;
}

.pretty.p-image .state img {
  opacity: 0;
  position: absolute;
  width: calc(1em + 2px);
  height: calc(1em + 2px);
  top: 0;
  top: calc((0% - (100% - 1em)) - 8%);
  left: 0;
  z-index: 0;
  text-align: center;
  line-height: normal;
  transform: scale(0.8);
}

.pretty.p-image input:checked ~ .state img {
  opacity: 1;
}

.pretty.p-switch input {
  min-width: 2em;
}

.pretty.p-switch .state {
  position: relative;
}

.pretty.p-switch .state:before {
  content: "";
  border: 1px solid #bdc3c7;
  border-radius: 60px;
  width: 2em;
  box-sizing: unset;
  height: calc(1em + 2px);
  position: absolute;
  top: 0;
  top: calc((0% - (100% - 1em)) - 16%);
  z-index: 0;
  transition: all 0.5s ease;
}

.pretty.p-switch .state label {
  text-indent: 2.5em;
}

.pretty.p-switch .state label:before, .pretty.p-switch .state label:after {
  transition: all 0.5s ease;
  border-radius: 100%;
  left: 0;
  border-color: transparent;
  transform: scale(0.8);
}

.pretty.p-switch .state label:after {
  background-color: #bdc3c7 !important;
}

.pretty.p-switch input:checked ~ .state:before {
  border-color: #5a656b;
}

.pretty.p-switch input:checked ~ .state label:before {
  opacity: 0;
}

.pretty.p-switch input:checked ~ .state label:after {
  background-color: #5a656b !important;
  left: 1em;
}

.pretty.p-switch.p-fill input:checked ~ .state:before {
  border-color: #5a656b;
  background-color: #5a656b !important;
}

.pretty.p-switch.p-fill input:checked ~ .state label:before {
  opacity: 0;
}

.pretty.p-switch.p-fill input:checked ~ .state label:after {
  background-color: #fff !important;
  left: 1em;
}

.pretty.p-switch.p-slim .state:before {
  height: 0.1em;
  background: #bdc3c7 !important;
  top: calc(50% - 0.1em);
}

.pretty.p-switch.p-slim input:checked ~ .state:before {
  border-color: #5a656b;
  background-color: #5a656b !important;
}

.pretty.p-has-hover input:hover ~ .state:not(.p-is-hover) {
  display: none;
}

.pretty.p-has-hover input:hover ~ .state.p-is-hover {
  display: block;
}

.pretty.p-has-hover input:hover ~ .state.p-is-hover .icon {
  display: block;
}

.pretty.p-has-focus input:focus ~ .state label:before {
  box-shadow: 0px 0px 3px 0px rgb(189, 195, 199);
}

.pretty.p-has-indeterminate input[type=checkbox]:indeterminate ~ .state:not(.p-is-indeterminate) {
  display: none;
}

.pretty.p-has-indeterminate input[type=checkbox]:indeterminate ~ .state.p-is-indeterminate {
  display: block;
}

.pretty.p-has-indeterminate input[type=checkbox]:indeterminate ~ .state.p-is-indeterminate .icon {
  display: block;
  opacity: 1;
}

.pretty.p-toggle .state.p-on {
  opacity: 0;
  display: none;
}

.pretty.p-toggle .state.p-off,
.pretty.p-toggle .state .icon,
.pretty.p-toggle .state .svg,
.pretty.p-toggle .state img {
  opacity: 1;
  display: inherit;
}

.pretty.p-toggle .state.p-off .icon {
  color: #bdc3c7;
}

.pretty.p-toggle input:checked ~ .state.p-on {
  opacity: 1;
  display: inherit;
}

.pretty.p-toggle input:checked ~ .state.p-off {
  opacity: 0;
  display: none;
}

.pretty.p-plain input:checked ~ .state label:before, .pretty.p-plain.p-toggle .state label:before {
  content: none;
}

.pretty.p-plain.p-plain .icon {
  transform: scale(1.1);
}

.pretty.p-round .state label:before, .pretty.p-round .state label:after {
  border-radius: 100%;
}

.pretty.p-round.p-icon .state .icon {
  border-radius: 100%;
  overflow: hidden;
}

.pretty.p-round.p-icon .state .icon:before {
  transform: scale(0.8);
}

.pretty.p-curve .state label:before, .pretty.p-curve .state label:after {
  border-radius: 20%;
}

.pretty.p-smooth label:before,
.pretty.p-smooth label:after,
.pretty.p-smooth .icon,
.pretty.p-smooth .svg {
  transition: all 0.5s ease;
}

.pretty.p-smooth input:checked + .state label:after {
  transition: all 0.3s ease;
}

.pretty.p-smooth input:checked + .state .icon,
.pretty.p-smooth input:checked + .state .svg,
.pretty.p-smooth input:checked + .state img {
  animation: zoom 0.2s ease;
}

.pretty.p-smooth.p-default input:checked + .state label:after {
  animation: zoom 0.2s ease;
}

.pretty.p-smooth.p-plain input:checked + .state label:before {
  content: "";
  transform: scale(0);
  transition: all 0.5s ease;
}

.pretty.p-tada:not(.p-default) input:checked + .state .icon,
.pretty.p-tada:not(.p-default) input:checked + .state .svg,
.pretty.p-tada:not(.p-default) input:checked + .state img,
.pretty.p-tada:not(.p-default) input:checked + .state label:before,
.pretty.p-tada:not(.p-default) input:checked + .state label:after {
  animation: tada 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1 alternate;
  opacity: 1;
}

.pretty.p-jelly:not(.p-default) input:checked + .state .icon,
.pretty.p-jelly:not(.p-default) input:checked + .state .svg,
.pretty.p-jelly:not(.p-default) input:checked + .state img,
.pretty.p-jelly:not(.p-default) input:checked + .state label:before,
.pretty.p-jelly:not(.p-default) input:checked + .state label:after {
  animation: jelly 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  opacity: 1;
}

.pretty.p-jelly:not(.p-default) input:checked + .state label:before {
  border-color: transparent;
}

.pretty.p-rotate:not(.p-default) input:checked ~ .state .icon,
.pretty.p-rotate:not(.p-default) input:checked ~ .state .svg,
.pretty.p-rotate:not(.p-default) input:checked ~ .state img,
.pretty.p-rotate:not(.p-default) input:checked ~ .state label:before,
.pretty.p-rotate:not(.p-default) input:checked ~ .state label:after {
  animation: rotate 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  opacity: 1;
}

.pretty.p-rotate:not(.p-default) input:checked ~ .state label:before {
  border-color: transparent;
}

.pretty.p-pulse:not(.p-switch) input:checked ~ .state label:before {
  animation: pulse 1s;
}

.pretty input[disabled] {
  cursor: not-allowed;
  display: none;
}

.pretty input[disabled] ~ * {
  opacity: 0.5;
}

.pretty.p-locked input {
  display: none;
  cursor: not-allowed;
}

.pretty input:checked ~ .state.p-primary label:after, .pretty.p-toggle .state.p-primary label:after {
  background-color: #428bca !important;
}

.pretty input:checked ~ .state.p-primary .icon,
.pretty input:checked ~ .state.p-primary .svg, .pretty.p-toggle .state.p-primary .icon,
.pretty.p-toggle .state.p-primary .svg {
  color: #fff;
  stroke: #fff;
}

.pretty input:checked ~ .state.p-primary-o label:before, .pretty.p-toggle .state.p-primary-o label:before {
  border-color: #428bca;
}

.pretty input:checked ~ .state.p-primary-o label:after, .pretty.p-toggle .state.p-primary-o label:after {
  background-color: transparent;
}

.pretty input:checked ~ .state.p-primary-o .icon,
.pretty input:checked ~ .state.p-primary-o .svg,
.pretty input:checked ~ .state.p-primary-o svg, .pretty.p-toggle .state.p-primary-o .icon,
.pretty.p-toggle .state.p-primary-o .svg,
.pretty.p-toggle .state.p-primary-o svg {
  color: #428bca;
  stroke: #428bca;
}

.pretty.p-default:not(.p-fill) input:checked ~ .state.p-primary-o label:after {
  background-color: #428bca !important;
}

.pretty.p-switch input:checked ~ .state.p-primary:before {
  border-color: #428bca;
}

.pretty.p-switch.p-fill input:checked ~ .state.p-primary:before {
  background-color: #428bca !important;
}

.pretty.p-switch.p-slim input:checked ~ .state.p-primary:before {
  border-color: #245682;
  background-color: #245682 !important;
}

.pretty input:checked ~ .state.p-info label:after, .pretty.p-toggle .state.p-info label:after {
  background-color: #5bc0de !important;
}

.pretty input:checked ~ .state.p-info .icon,
.pretty input:checked ~ .state.p-info .svg, .pretty.p-toggle .state.p-info .icon,
.pretty.p-toggle .state.p-info .svg {
  color: #fff;
  stroke: #fff;
}

.pretty input:checked ~ .state.p-info-o label:before, .pretty.p-toggle .state.p-info-o label:before {
  border-color: #5bc0de;
}

.pretty input:checked ~ .state.p-info-o label:after, .pretty.p-toggle .state.p-info-o label:after {
  background-color: transparent;
}

.pretty input:checked ~ .state.p-info-o .icon,
.pretty input:checked ~ .state.p-info-o .svg,
.pretty input:checked ~ .state.p-info-o svg, .pretty.p-toggle .state.p-info-o .icon,
.pretty.p-toggle .state.p-info-o .svg,
.pretty.p-toggle .state.p-info-o svg {
  color: #5bc0de;
  stroke: #5bc0de;
}

.pretty.p-default:not(.p-fill) input:checked ~ .state.p-info-o label:after {
  background-color: #5bc0de !important;
}

.pretty.p-switch input:checked ~ .state.p-info:before {
  border-color: #5bc0de;
}

.pretty.p-switch.p-fill input:checked ~ .state.p-info:before {
  background-color: #5bc0de !important;
}

.pretty.p-switch.p-slim input:checked ~ .state.p-info:before {
  border-color: #2390b0;
  background-color: #2390b0 !important;
}

.pretty input:checked ~ .state.p-success label:after, .pretty.p-toggle .state.p-success label:after {
  background-color: #5cb85c !important;
}

.pretty input:checked ~ .state.p-success .icon,
.pretty input:checked ~ .state.p-success .svg, .pretty.p-toggle .state.p-success .icon,
.pretty.p-toggle .state.p-success .svg {
  color: #fff;
  stroke: #fff;
}

.pretty input:checked ~ .state.p-success-o label:before, .pretty.p-toggle .state.p-success-o label:before {
  border-color: #5cb85c;
}

.pretty input:checked ~ .state.p-success-o label:after, .pretty.p-toggle .state.p-success-o label:after {
  background-color: transparent;
}

.pretty input:checked ~ .state.p-success-o .icon,
.pretty input:checked ~ .state.p-success-o .svg,
.pretty input:checked ~ .state.p-success-o svg, .pretty.p-toggle .state.p-success-o .icon,
.pretty.p-toggle .state.p-success-o .svg,
.pretty.p-toggle .state.p-success-o svg {
  color: #5cb85c;
  stroke: #5cb85c;
}

.pretty.p-default:not(.p-fill) input:checked ~ .state.p-success-o label:after {
  background-color: #5cb85c !important;
}

.pretty.p-switch input:checked ~ .state.p-success:before {
  border-color: #5cb85c;
}

.pretty.p-switch.p-fill input:checked ~ .state.p-success:before {
  background-color: #5cb85c !important;
}

.pretty.p-switch.p-slim input:checked ~ .state.p-success:before {
  border-color: #357935;
  background-color: #357935 !important;
}

.pretty input:checked ~ .state.p-warning label:after, .pretty.p-toggle .state.p-warning label:after {
  background-color: #f0ad4e !important;
}

.pretty input:checked ~ .state.p-warning .icon,
.pretty input:checked ~ .state.p-warning .svg, .pretty.p-toggle .state.p-warning .icon,
.pretty.p-toggle .state.p-warning .svg {
  color: #fff;
  stroke: #fff;
}

.pretty input:checked ~ .state.p-warning-o label:before, .pretty.p-toggle .state.p-warning-o label:before {
  border-color: #f0ad4e;
}

.pretty input:checked ~ .state.p-warning-o label:after, .pretty.p-toggle .state.p-warning-o label:after {
  background-color: transparent;
}

.pretty input:checked ~ .state.p-warning-o .icon,
.pretty input:checked ~ .state.p-warning-o .svg,
.pretty input:checked ~ .state.p-warning-o svg, .pretty.p-toggle .state.p-warning-o .icon,
.pretty.p-toggle .state.p-warning-o .svg,
.pretty.p-toggle .state.p-warning-o svg {
  color: #f0ad4e;
  stroke: #f0ad4e;
}

.pretty.p-default:not(.p-fill) input:checked ~ .state.p-warning-o label:after {
  background-color: #f0ad4e !important;
}

.pretty.p-switch input:checked ~ .state.p-warning:before {
  border-color: #f0ad4e;
}

.pretty.p-switch.p-fill input:checked ~ .state.p-warning:before {
  background-color: #f0ad4e !important;
}

.pretty.p-switch.p-slim input:checked ~ .state.p-warning:before {
  border-color: #c77c11;
  background-color: #c77c11 !important;
}

.pretty input:checked ~ .state.p-danger label:after, .pretty.p-toggle .state.p-danger label:after {
  background-color: #d9534f !important;
}

.pretty input:checked ~ .state.p-danger .icon,
.pretty input:checked ~ .state.p-danger .svg, .pretty.p-toggle .state.p-danger .icon,
.pretty.p-toggle .state.p-danger .svg {
  color: #fff;
  stroke: #fff;
}

.pretty input:checked ~ .state.p-danger-o label:before, .pretty.p-toggle .state.p-danger-o label:before {
  border-color: #d9534f;
}

.pretty input:checked ~ .state.p-danger-o label:after, .pretty.p-toggle .state.p-danger-o label:after {
  background-color: transparent;
}

.pretty input:checked ~ .state.p-danger-o .icon,
.pretty input:checked ~ .state.p-danger-o .svg,
.pretty input:checked ~ .state.p-danger-o svg, .pretty.p-toggle .state.p-danger-o .icon,
.pretty.p-toggle .state.p-danger-o .svg,
.pretty.p-toggle .state.p-danger-o svg {
  color: #d9534f;
  stroke: #d9534f;
}

.pretty.p-default:not(.p-fill) input:checked ~ .state.p-danger-o label:after {
  background-color: #d9534f !important;
}

.pretty.p-switch input:checked ~ .state.p-danger:before {
  border-color: #d9534f;
}

.pretty.p-switch.p-fill input:checked ~ .state.p-danger:before {
  background-color: #d9534f !important;
}

.pretty.p-switch.p-slim input:checked ~ .state.p-danger:before {
  border-color: #a02622;
  background-color: #a02622 !important;
}

.pretty.p-bigger label:before,
.pretty.p-bigger label:after,
.pretty.p-bigger .icon,
.pretty.p-bigger .svg,
.pretty.p-bigger .img {
  font-size: 1.2em !important;
  top: calc(0% - (100% - 1em) - 35%) !important;
}

.pretty.p-bigger label {
  text-indent: 1.7em;
}

@media print {
  .pretty .state:before,
  .pretty .state label:before,
  .pretty .state label:after,
  .pretty .state .icon {
    /* stylelint-disable */
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

/*______ Fonts ______*/

/* @font-face { } */

/*______ VARS ______*/

/* colors */

/*______ BREAKING POINTS ______*/

/**
 * components/typography.css
 *
 * Typography rules.
 *
 */

@font-face {
  font-family: "Maax Regular";

  src: url("/dist/fonts/maax-regular.eot"); /* IE9 Compat Modes */

  src: url("/dist//fonts/maax-regular.eot?#iefix") format("embedded-opentype"), url("/dist//fonts/maax-regular.woff2") format("woff2"), url("/dist//fonts/maax-regular.woff") format("woff"), url("/dist//fonts/maax-regular.ttf") format("ttf"), url("/dist//fonts/maax-regular.otf") format("otf");
}

@font-face {
  font-family: "Maax Medium";

  src: url("/dist/fonts/maax-medium.eot"); /* IE9 Compat Modes */

  src: url("/dist//fonts/maax-medium.eot?#iefix") format("embedded-opentype"), url("/dist//fonts/maax-medium.woff2") format("woff2"), url("/dist//fonts/maax-medium.woff") format("woff"), url("/dist//fonts/maax-medium.ttf") format("ttf"), url("/dist//fonts/maax-medium.otf") format("otf");
}

@font-face {
  font-family: "Maax Bold";

  src: url("/dist/fonts/maax-bold.eot"); /* IE9 Compat Modes */

  src: url("/dist//fonts/maax-bold.eot?#iefix") format("embedded-opentype"), url("/dist//fonts/maax-bold.woff2") format("woff2"), url("/dist//fonts/maax-bold.woff") format("woff"), url("/dist//fonts/maax-bold.ttf") format("ttf"), url("/dist//fonts/maax-bold.otf") format("otf");
}

@font-face {
  font-family: "Maax Black";

  src: url("/dist/fonts/maax-black.eot"); /* IE9 Compat Modes */

  src: url("/dist//fonts/maax-black.eot?#iefix") format("embedded-opentype"), url("/dist//fonts/maax-black.woff2") format("woff2"), url("/dist//fonts/maax-black.woff") format("woff"), url("/dist//fonts/maax-black.ttf") format("ttf"), url("/dist//fonts/maax-black.otf") format("otf");
}

h1 {
  font-family: "Maax Bold";
}

h2 {
  font-family: "Maax Medium";
}

h3 {
  font-family: "Maax Medium";
}

p {
  margin: 0 0 0.5em 0;
}

strong {
  font-family: "Maax Bold";
}

ul {
  list-style: outside !important;
  margin: 0.5em 0 1em 1em !important;
}

@media only screen and (max-width: 1024px) {
  .mobile-bold-32 {
    font-family: "Maax Bold";
    font-size: 32px;
    line-height: 38px;
  }

  .mobile-bold-28 {
    font-family: "Maax Bold";
    font-size: 28px;
    line-height: 32px;
  }

  .mobile-bold-25 {
    font-family: "Maax Bold";
    font-size: 25px;
    line-height: 32px;
  }

  .mobile-bold-18 {
    font-family: "Maax Bold";
    font-size: 18px;
    line-height: 21px;
  }

  .mobile-bold-14 {
    font-family: "Maax Bold";
    font-size: 14px;
    line-height: 20px;
  }

  .mobile-medium-25 {
    font-family: "Maax Medium";
    font-size: 25px;
    line-height: 32px;
  }

  .mobile-medium-22, .btn {
    font-family: "Maax Medium";
    font-size: 22px;
    line-height: 28px;
  }

  .mobile-medium-20 {
    font-family: "Maax Medium";
    font-size: 20px;
    line-height: 27px;
  }

  .mobile-medium-18, .btn-black, .btn-white {
    font-family: "Maax Medium";
    font-size: 18px;
    line-height: 26px;
  }

  .mobile-medium-16 {
    font-family: "Maax Medium";
    font-size: 16px;
    line-height: 23px;
  }

  .mobile-regular-20 {
    font-family: "Maax Regular";
    font-size: 20px;
    line-height: 27px;
  }

  .mobile-regular-18, body {
    font-family: "Maax Regular";
    font-size: 18px;
    line-height: 26px;
  }

  .mobile-medium-14 {
    font-family: "Maax Medium";
    font-size: 14px;
    line-height: 18px;
  }

  .mobile-regular-12 {
    font-family: "Maax Regular";
    font-size: 12px;
    line-height: 12px;
  }

  .mobile-medium-12 {
    font-family: "Maax Medium";
    font-size: 12px;
    line-height: 15px;
  }

  .mobile-medium-10 {
    font-family: "Maax Medium";
    font-size: 10px;
    line-height: 12px;
  }

  .desktop-between-12 {
    font-family: "Maax Bold";
    font-size: 12px;
    line-height: 15px;
  }
}

@media only screen and (min-width: 1024px) {
  .desktop-black-110 {
    font-family: "Maax Black";
    font-size: 110px;
    line-height: 110px;
  }

  .desktop-black-80 {
    font-family: "Maax Black";
    font-size: 80px;
    line-height: 80px;
  }

  .desktop-black-50 {
    font-family: "Maax Black";
    font-size: 50px;
    line-height: 58px;
  }

  .desktop-bold-80 {
    font-family: "Maax Bold";
    font-size: 80px;
    line-height: 80px;
  }

  .desktop-bold-50 {
    font-family: "Maax Bold";
    font-size: 50px;
    line-height: 58px;
  }

  .desktop-medium-40 {
    font-family: "Maax Medium";
    font-size: 40px;
    line-height: 50px;
  }

  .desktop-medium-30, .btn {
    font-family: "Maax Medium";
    font-size: 30px;
    line-height: 36px;
  }

  .desktop-bold-40 {
    font-family: "Maax Bold";
    font-size: 40px;
    line-height: 42px;
  }

  .desktop-bold-30 {
    font-family: "Maax Bold";
    font-size: 30px;
    line-height: 36px;
  }

  .desktop-bold-20 {
    font-family: "Maax Bold";
    font-size: 20px;
    line-height: 27px;
  }

  .desktop-medium-20, .btn-black, .btn-white {
    font-family: "Maax Medium";
    font-size: 20px;
    line-height: 27px;
  }

  .desktop-medium-24 {
    font-family: "Maax Medium";
    font-size: 24px;
    line-height: 30px;
  }

  .desktop-regular-20, body {
    font-family: "Maax Regular";
    font-size: 20px;
    line-height: 27px;
  }

  .desktop-bold-18 {
    font-family: "Maax Bold";
    font-size: 18px;
    line-height: 22px;
  }

  .desktop-medium-18 {
    font-family: "Maax Medium";
    font-size: 18px;
    line-height: 22px;
  }

  .desktop-black-16 {
    font-family: "Maax Black";
    font-size: 16px;
    line-height: 23px;
  }

  .desktop-bold-16 {
    font-family: "Maax Bold";
    font-size: 16px;
    line-height: 23px;
  }

  .desktop-regular-16 {
    font-family: "Maax Bold";
    font-size: 16px;
    line-height: 20px;
  }

  .desktop-bold-12 {
    font-family: "Maax Bold";
    font-size: 12px;
    line-height: 15px;
  }

  .desktop-medium-16 {
    font-family: "Maax Medium";
    font-size: 16px;
    line-height: 23px;
  }

  .desktop-medium-14 {
    font-family: "Maax Medium";
    font-size: 14px;
    line-height: 18px;
  }

  .desktop-medium-12 {
    font-family: "Maax Medium";
    font-size: 12px;
    line-height: 23px;
  }
}

@media only screen and (min-width: 1600px) {
  .widescreen-medium-40 {
    font-family: "Maax Medium";
    font-size: 40px;
    line-height: 50px;
  }
}

body div#frame header {
  margin: 0 auto;
}

body div#frame main.content {
  margin: 0 auto;
}

body div#frame main.content ul li {
  padding: 1em 0;
}

body div#frame main.content form {
  margin: 2em 0;
}

body div#frame footer {
  margin: 0 auto;
}

/* VUE.JS */

[v-cloak] {
  display: none;
}

.staggered {
  opacity: 0;
  animation-name: animateIn;
  animation-duration: 350ms;
  animation-delay: calc(var(--animation-order) * 50ms);
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}

.staggered-quick {
  opacity: 0;
  animation-name: animateIn;
  animation-duration: 100ms;
  animation-delay: calc(var(--animation-order) * 0ms);
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}

.staggered-slow {
  opacity: 0;
  animation-name: animateIn;
  animation-duration: 350ms;
  animation-delay: calc(var(--animation-order) * 150ms);
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}

@keyframes animateIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.2s;
}

.fade-enter, .fade-leave-to {
  opacity: 0;
}

/* CITY SELECTOR */

#city-selector-wrapper {
  color: #000000;
}

#city-selector-wrapper .drop-down-icon {
  bottom: 0px;
  padding: 30px;
  background: #FFF03C;
  z-index: 9999;
}

#city-selector-wrapper .drop-down-icon svg * {
  stroke: #000000;
}

#city-selector {
  overflow: auto;
  height: 100vh;
  padding-bottom: 400px;
}

#city-selector ul {
  list-style-type: none !important;
}

#city-selector .city-selector-item {
  padding-bottom: 15px;
  text-align: center;
}

#city-selector .city-selector-item a:hover {
  color: #ffffff;
}

#city-selector .city-selector-item:last-of-type {
  padding-bottom: 200px;
}

.slide-left-enter-active,
.slide-left-leave-active {
  transition: opacity calc(var(--i) * 0.2s);
}

.slide-left-enter,
.slide-left-leave-to {
  opacity: 0;
}

/* VUE SCROLL PICKER */

.vue-scroll-picker {
  position: relative;
  margin: 15px auto 15px;
  width: 100%;
  height: 135px;
  overflow: auto;
  width: 95%;
  cursor: pointer;
}

.vue-scroll-picker a {
  display: block;
  opacity: 1;
  transition: none;
}

.vue-scroll-picker a:hover {
  transition: none;
  opacity: 1;
}

.vue-scroll-picker .top {
  height: 41px;
}

.vue-scroll-picker .bottom {
  height: 65px;
}

@media only screen and (min-width: 768px) {
  .vue-scroll-picker {
    width: 50%;
    position: relative;
    margin: 20px auto 30px;
  }
}

@media only screen and (min-height: 415px) {
  .vue-scroll-picker {
    height: 268px;
    margin: 25px auto 40px;
  }

  .vue-scroll-picker .top {
    height: 96px;
  }

  .vue-scroll-picker .bottom {
    height: 141px;
  }
}

@media only screen and (min-height: 640px) {
  .vue-scroll-picker {
    height: 361px;
  }

  .vue-scroll-picker .top {
    height: 136px;
  }

  .vue-scroll-picker .bottom {
    height: 194px;
  }
}

@media only screen and (min-height: 767px) {
  .vue-scroll-picker {
    height: 361px;
  }

  .vue-scroll-picker .top {
    height: 133px;
  }

  .vue-scroll-picker .bottom {
    height: 198px;
  }
}

@media only screen and (min-height: 1024px) {
  .vue-scroll-picker {
    height: 361px;
  }

  .vue-scroll-picker .top {
    height: 133px;
  }

  .vue-scroll-picker .bottom {
    height: 201px;
  }
}

.vue-scroll-picker-list {
  z-index: 2;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

.vue-scroll-picker-list-rotator {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  padding-top: 150px;
}

.vue-scroll-picker-list-rotator.-transition {
  transition: top ease 200ms;
}

.vue-scroll-picker-item {
  font-family: "Maax Medium";
  text-align: center;
  vertical-align: middle;
  line-height: 38px;
  height: 35px;
  font-size: 18px;
  transition: font-size 200ms;
  transition-timing-function: ease-in-out;
}

.vue-scroll-picker-item.-selected {
  color: #fff;
}

.vue-scroll-picker-item.-placeholder {
  color: #aaa;
}

.vue-scroll-picker-layer {
  z-index: 3;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

.vue-scroll-picker-layer .top,
.vue-scroll-picker-layer .middle,
.vue-scroll-picker-layer .bottom {
  position: absolute;
  width: 100%;
}

.vue-scroll-picker-layer .top {
  box-sizing: border-box;
  border-bottom: 3px solid #ffffff;
  top: 0;
  left: 0;
  right: 0;
  cursor: pointer;
}

.vue-scroll-picker-layer .middle {
  top: 40%;
  left: 0;
  right: 0;
  bottom: 27vh;
}

.vue-scroll-picker-layer .bottom {
  border-top: 3px solid #ffffff;
  bottom: 0;
  left: 0;
  right: 0;
  cursor: pointer;
}

.vue-scroll-picker-group.flex {
  display: flex;
}

.vue-scroll-picker-group:after {
  clear: both;
  display: table;
  content: "";
}

.vue-scroll-picker-group > .vue-scroll-picker-1 {
  float: left;
  width: 8.33333%;
}

.vue-scroll-picker-group > .vue-scroll-picker-2 {
  float: left;
  width: 16.66667%;
}

.vue-scroll-picker-group > .vue-scroll-picker-3 {
  float: left;
  width: 25%;
}

.vue-scroll-picker-group > .vue-scroll-picker-4 {
  float: left;
  width: 33.33333%;
}

.vue-scroll-picker-group > .vue-scroll-picker-5 {
  float: left;
  width: 41.66667%;
}

.vue-scroll-picker-group > .vue-scroll-picker-6 {
  float: left;
  width: 50%;
}

.vue-scroll-picker-group > .vue-scroll-picker-7 {
  float: left;
  width: 58.33333%;
}

.vue-scroll-picker-group > .vue-scroll-picker-8 {
  float: left;
  width: 66.66667%;
}

.vue-scroll-picker-group > .vue-scroll-picker-9 {
  float: left;
  width: 75%;
}

.vue-scroll-picker-group > .vue-scroll-picker-10 {
  float: left;
  width: 83.33333%;
}

.vue-scroll-picker-group > .vue-scroll-picker-11 {
  float: left;
  width: 91.66667%;
}

.vue-scroll-picker-group > .vue-scroll-picker-12 {
  float: left;
  width: 100%;
}

/* PROGRAM FILTER */

.overlay {
  z-index: 3;
  -webkit-backdrop-filter: blur(3px);
          backdrop-filter: blur(3px);
  background-color: rgba(255, 255, 255, 0.8);
}

.opacity-low {
  opacity: 0.2;
}

.reset-filter {
  color: #0000e1;
  background-color: #F3F2F3;
  padding: 7px 20px 7px;
}

@media only screen and (min-width: 1024px) {
  .reset-filter {
    padding: 1rem 0;
  }
}

/*
#filter-bar {
  background-color: $tfgrey;
  padding: 41px 15px 41px;
  z-index: 3;

  @media only screen and (min-width: $lg) {
    padding: 41px 35px 41px;
  }

  .filter-options-container {
    color: currentColor;
    max-height: 500px;

    @media only screen and (min-width: $lg) {
      min-width: 390px;
    }

    .filter-options-wrapper {
      overflow-y: scroll;
      height: 415px;

      @media only screen and (min-width: $lg) {
        height: 395px;
      }
    }
  }

  .filter-group {
    position: relative;
    transition: background-color 300ms, color 300ms;

    @media only screen and (min-width: $lg) {
      margin: 0 10px 0 0;
    }
    @media only screen and (min-width: 1070px) {
      margin: 0 30px 0 0;
    }

    .filter-item {
      margin: 0 1rem 0;
      & * {
        stroke: currentColor !important;
      }

      @media only screen and (min-width: $lg) {
        margin: 0 1rem 0 0;
      }

      button {
        height: 33px;
        color: currentColor;
        border: 2px solid currentColor;

        &.filter-active {
          background-color: currentColor;

          .button-title {
            color: #ffffff !important;
          }

          & * {
            stroke: #ffffff;
          }
        }
      }

      // Pretty Checkboxes
      .pretty.p-default input:checked ~ .state label:after {
        background-color: currentColor !important;
      }
    }

    .filter-options-container {
      border: 2px solid currentColor;
      color: currentColor;
      z-index: 1;
      top: 50px;
      padding: 20px 20px 0;
      background-color: #ffffff;
      position: absolute;
      min-width: 400px;
      left: -20px;
      right: -20px;
      margin: 0 10px;

      @media only screen and (min-width: $lg) {
        position: absolute;
        top: 55px;
        left: -10px;
        padding: 40px;
        border-radius: 0;
      }
      .filter-option {
        padding-bottom: 10px;
        cursor: pointer;
        @media only screen and (min-width: $lg) {
          padding-bottom: 20px;
        }
        .pretty {
          margin-right: 0.5em;
        }

        label {

        }
      }

      .apply-filter {
        text-align: center;
        text-align: -webkit-center;
        button {
          border-radius: 21px;
          padding: 4px 10px 6px;
          line-height: 0.2;
          height: 38px;
          margin: 10px;
        }
      }

      .toggle-favorites {
        margin-right: 1rem;
      }
    }

    .filter-mobile {
      position: absolute;
      top: 85px;
      left: 0;
      width: 100%;
      background-color: #ffffff;
      border: 2px solid $tfblue;
      padding: 20px;

      & * {
        stroke: currentColor !important;
      }

      .filter-toggle {
        border: 2px solid currentColor;
        width: 100%;
        margin: 10px 0 0 0;
        cursor: pointer;

        &__title,
        .favorites {
          padding: 0 20px;
          svg {
            height: 1rem;
          }
        }

        .favorites svg {
          margin-right: -8px;
        }
      }

      .filter-options-container {
        position: relative;
        top: 0;
        left: 0;
        background: unset;
        border: unset;
        width: 100%;
      }
    }

    .filter-menu {
      margin: 20px 0 40px 0;
      @media only screen and (min-width: $lg) {
        margin: 0;
      }
    }
    .filter-menu + .filter-menu {
      margin: 20px 0 0 0;
      @media only screen and (min-width: $lg) {
        margin: 0;
      }
    }

    .filter-toggle {
      padding: 11px 12px 13px;
      border-radius: 17.5px;
      font-size: 18px;
      line-height: 0;

      .filter-chevron {
        margin-left: 16px;
        margin-bottom: -4px;
        transition: 200ms ease-in-out;
        svg {
          width: 13px;
          fill: none;
          stroke-width: 2px;
        }
      }

      &.filter-active {
        .filter-chevron {
          transform: rotate(180deg);
          transition: 200ms ease-in-out;
        }
        .filter-active {
          .filter-chevron {
            transform: rotate(0deg);
            transition: 200ms ease-in-out;
          }
        }
      }

      &.maintoggle {
        margin: 0 10px 0 0;
        &:last-of-type {
          margin: 0 0 0 0;
        }

        @media only screen and (min-width: $lg) {
          margin: 0 30px 0 0;
        }
      }

      &.filter-favorites {
        padding: 7px 12px;
        svg {
          height: 1rem;
        }
      }
    }

    &.filter-deactivated {
      .filter-toggle {
        color: rgb(191, 203, 217);
        border: 2px solid rgb(191, 203, 217) !important;
        & * {
          stroke: rgb(191, 203, 217);
        }

        &.filter-inactive {
          .filter-chevron {
            transform: rotate(0deg);
            transition: 200ms ease-in-out;
          }
        }
      }
    }
  }
}
*/

/**
 *  Project-wide styles
 */

/*	-------------------------------------------------
	HTML / CSS
	Studio Roth&Maerchy AG
	https://rothmaerchy.com
	-------------------------------------------------  */

body.body-no-scroll {
  overflow: hidden;
}

/*  SVG */

svg.fill-black * {
  fill: #000000;
}

svg.fill-white * {
  fill: #ffffff !important;
}

svg.stroke-black * {
  stroke: #000000;
}

svg.stroke-white * {
  stroke: #ffffff;
}

svg.fill-blue * {
  fill: #0000E1;
}

/*  BURGER  */

@media only screen and (min-width: 1024px) {
  .hamburger svg {
    width: 60px;
    height: 60px;
  }
}

.hamburger rect {
  transition-duration: 200ms;
}

.hamburger circle {
  transition-duration: 200ms;
}

.hamburger.is-active {
  z-index: 51 !important;
}

.hamburger.is-active circle {
  fill: none;
  transition-duration: 200ms;
}

.hamburger.is-active rect {
  fill: #ffffff;
  transition-duration: 200ms;
}

.hamburger.is-active rect#rect-top {
  transform-origin: 53% 50%;
  transform: translate(2px, 3px) rotate(-45deg);
}

.hamburger.is-active rect#rect-bottom {
  transform-origin: 50% 50%;
  transform: translate(2px, -3px) rotate(45deg);
}

.hamburger.is-active rect.fill-black {
  fill: #000000;
}

.grid,
.masonry {
  gap: 17px;
  -moz-column-gap: 17px;
       column-gap: 17px;
}

@media only screen and (min-width: 1024px) {
  .grid,
  .masonry {
    gap: 40px;
    -moz-column-gap: 40px;
         column-gap: 40px;
  }
}

.grid-wrap .grid-item-wrap {
  padding: 0;
}

.grid-wrap .grid-item-wrap .grid-title {
  margin: 100px 0 0 0;
}

.grid-wrap .grid-item-wrap .grid-item {
  position: relative;
  padding: 20px;
}

.grid-wrap .grid-item-wrap .grid-item img {
  max-width: 250px;
}

.grid-wrap .grid-item-wrap .grid-item .grid-item-title {
  color: white;
  position: absolute;
  left: 22px;
  bottom: 22px;
  margin: 40px 0 0 0;
}

.grid-wrap .grid-item-wrap .grid-item .grid-item-overlay {
  color: #000000;
  background-color: #F3F2F3;
  opacity: 0;
  padding: 22px;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
  transition: opacity 50ms ease-in-out;
}

@media only screen and (min-width: 768px) {
  .grid-wrap .grid-item-wrap .grid-item:hover .grid-item-overlay {
    opacity: 1;
  }
}

/* Slider */

/* video embeds responsivity fix */

.embed-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
}

.embed-container body {
  height: 0 !important;
}

.embed-container iframe,
.embed-container object,
.embed-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

article section#schedule .schedule-cta {
  padding: 0 20px;
}

@media only screen and (min-width: 1024px) {
  article section#schedule .schedule-cta {
    padding: 0 38px;
  }
}

article section#schedule .schedule-cta .toggle-favorites-teaser {
  animation: colorAnimation 2s ease-in-out 200ms infinite normal forwards;
  margin-right: 20px;
}

article section#schedule .schedule-cta .toggle-favorites-teaser svg * {
  stroke: #e00072;
  fill: #e00072;
}

article section#schedule .schedule-cta .text {
  line-height: 1.2;
}

@keyframes colorAnimation {
  0% {
    transform: scale(0.8);
  }

  5% {
    transform: scale(0.9);
  }

  10% {
    transform: scale(0.8);
  }

  15% {
    transform: scale(1);
  }

  50% {
    transform: scale(0.8);
  }

  100% {
    transform: scale(0.8);
  }
}

@media only screen and (min-width: 1024px) {
  article section#schedule .toggle-favorites {
    margin-right: 4px;
    margin-left: 0;
  }
}

article section#schedule .favorites-filter {
  margin-top: 12px;
  margin-left: 4px;
  height: 43px;
  margin-bottom: 10px;
  z-index: 2;
}

article section#schedule .empty-favorites {
  align-items: center;
  justify-content: center;
  display: flex;
  max-width: 100%;
  height: 50vh;
  text-align: center;
}

article section#schedule .event-day {
  padding: 0 20px;
}

@media only screen and (min-width: 768px) {
  article section#schedule .event-day {
    padding: 0;
  }
}

article section#schedule .event-day .sticky-date {
  padding: 7px 0px;
  background: #ffffff;
  top: 75px;
  margin-bottom: 10px;
  z-index: 3;
  margin-right: -20px;
}

@media only screen and (min-width: 768px) {
  article section#schedule .event-day .sticky-date {
    padding: 6px 35px 10px;
    margin-right: -35px;
  }
}

article section#schedule .event-day .event {
  padding: 15px 0px;
  border-bottom: 2px solid rgba(216, 216, 216, 0.5);
  transition: all 200ms ease-in-out;
}

@media only screen and (min-width: 768px) {
  article section#schedule .event-day .event {
    padding: 15px 35px;
  }
}

article section#schedule .event-day .event:first-child {
  border-top: 2px solid rgba(216, 216, 216, 0.5);
}

article section#schedule .event-day .event:last-child {
  border-bottom: 0;
}

article section#schedule .event-day .event .event-content {
  transition: background-color 100ms ease-in-out;
  z-index: 1;
}

@media only screen and (min-width: 768px) {
  article section#schedule .event-day .event:hover {
    transition: all 200ms ease-in-out;
    background-color: #F3F2F3;
  }
}

@media only screen and (min-width: 768px) {
  article section#schedule .event-day .event:hover .thumbnail img {
    transform: scale(1.1);
  }
}

article section#schedule .event-day .event .event-content .np-badge {
  background: #FF0069;
  color: #ffffff;
  padding: 1px 4px 3px;
  text-align: center;
  opacity: 1;
  transition: opacity 200ms ease-in-out;
  margin-top: 7px;
}

@media only screen and (min-width: 768px) {
  article section#schedule .event-day .event .event-content .np-badge {
    padding: 2px 10px 4px;
    line-height: 19px;
  }
}

@media only screen and (min-width: 768px) {
  article section#schedule .event-day .event .event-content .np-badge:hover {
    transition: opacity 200ms ease-in-out;
    opacity: 0.8;
  }
}

article section#schedule .event-day .event .event-content .np-badge-shortinfo {
  background: #bf7903;
  color: #ffffff;
  padding: 1px 4px 3px;
  text-align: center;
  opacity: 1;
  transition: opacity 200ms ease-in-out;
  margin-top: 7px;
}

@media only screen and (min-width: 768px) {
  article section#schedule .event-day .event .event-content .np-badge-shortinfo {
    padding: 2px 10px 4px;
    line-height: 19px;
  }
}

@media only screen and (min-width: 768px) {
  article section#schedule .event-day .event .event-content .np-badge-shortinfo:hover {
    transition: opacity 200ms ease-in-out;
    opacity: 0.8;
  }
}

article section#schedule .event-day .event .event-content .event-time {
  width: auto;
}

@media only screen and (min-width: 768px) {
  article section#schedule .event-day .event .event-content .event-time {
    width: 230px;
  }
}

article section#schedule .event-day .event .event-content .thumbnail {
  width: 80px;
  overflow: hidden;
}

@media only screen and (min-width: 768px) {
  article section#schedule .event-day .event .event-content .thumbnail {
    width: 200px;
  }
}

article section#schedule .event-day .event .event-content .thumbnail img {
  transform-origin: 50% 50%;
  transition: transform 0.25s, visibility 0.25s ease-in;
}

article section#schedule .event-day .event .event-content .event-primary-info {
  flex-grow: 1;
  padding: 0 0 0 14px;
}

@media only screen and (min-width: 768px) {
  article section#schedule .event-day .event .event-content .event-primary-info {
    padding: 0 14px;
  }
}

article section#schedule .event-day .event .event-content .event-primary-info .event-type .type-course {
  color: #9013FE;
}

article section#schedule .event-day .event .event-content .event-primary-info .event-type .type-event {
  color: #02B0A7;
}

article section#schedule .event-day .event .event-content .event-secondary-info {
  width: 210px;
  flex-direction: column;
}

article section#schedule .event-day .event .event-content .event-secondary-info .event-secondary-upper {
  flex-grow: 1;
}

article section#schedule .event-day .event .event-content .event-secondary-info .event-secondary-upper ul {
  list-style-type: none !important;
}

article section#schedule .event-day .event .event-content .event-secondary-info .event-secondary-lower {
  flex-grow: 0;
}

.accordion-wrapper .date {
  width: 20%;
  flex-grow: 0;
  flex-shrink: 0;
}

.accordion-wrapper .panel {
  display: none;
}

.accordion-wrapper .image {
  width: 100px;
}

.accordion-wrapper .image img {
  width: 100%;
}

.accordion-wrapper.active .image {
  width: 200px;
}

.accordion-wrapper.active .panel {
  display: block;
}

.btn {
  outline: none;
  padding: 8px 21px 11px 21px;
  border-radius: 39px;
  text-align: center;
}

@media only screen and (min-width: 768px) {
  .btn {
    padding: 12px 45px 12px 45px;
  }
}

.btn-blue {
  background-color: #0000E1;
  color: #ffffff;
}

.btn-green {
  background-color: #01eb88;
  color: #ffffff;
}

.btn-yellow {
  background-color: #FFF03C;
  color: #000000;
}

.btn-cockpit {
  padding: 8px 21px 11px 21px !important;
  font-size: 18px !important;
}

@media only screen and (min-width: 768px) {
  .btn-cockpit:hover {
    color: #fff;
    filter: brightness(120%);
  }
}

.btn-white {
  background-color: #ffffff;
  color: #000000;
}

.btn-black {
  background-color: #000000;
  color: #ffffff;
}

*:focus {
  outline: none !important;
}

.required:after {
  content: "*";
  color: #FF0069;
}

.credits {
  bottom: 3%;
  left: 2%;
  background: rgba(0, 0, 0, 0.5);
  color: #ffffff;
  padding: 1px 4px 3px;
  float: left;
  text-align: center;
}

@media only screen and (min-width: 768px) {
  .credits {
    padding: 0 6px 5px;
  }
}

/*______ Fonts ______*/

/* @font-face { } */

/*______ VARS ______*/

/* colors */

/*______ BREAKING POINTS ______*/

/*______ Basic links ______*/

a {
  text-transform: none;
  text-decoration: none;
  transition: opacity 200ms ease-in-out;
}

a .arrow-icon {
  transform: translateY(-1px);
}

a .arrow-icon,
a .text {
  transition: 200ms ease-in-out;
}

a .download-icon {
  transition: 200ms ease-in-out;
}

@media only screen and (min-width: 768px) {
  a:hover {
    text-decoration: none;
    color: inherit;
    transition: 200ms ease-in-out;
  }
}

@media only screen and (min-width: 768px) {
  a:hover .text {
    transform: translateX(10px);
  }
}

a:hover .arrow-icon {
  transform: translate(10px, -1px);
}

a:hover .download-icon {
  transition: 200ms ease-in-out;
}

a.animated {
  position: relative;
  text-decoration: none;
}

@media only screen and (min-width: 768px) {
  a.animated:hover {
    color: inherited;
  }
}

a.animated:after {
  content: "";
  height: 0.17em;
  position: absolute;
  bottom: -0.25em;
  left: 0;
  width: 0;
  background: #ffffff;
  transition: 0.2s;
}

a.animated.active:after {
  width: 100%;
  left: 0;
}

@media only screen and (min-width: 768px) {
  a.animated:hover:after {
    width: 100%;
    left: 0;
  }
}

a.underline, main.content .news-list .news-item p a {
  text-decoration: none;
  border-bottom: 2px solid currentColor;
}

/*______ Basics, Body & Menu ______*/

html {
  box-sizing: border-box;
  height: 100%;
}

body {
  height: 100%;
  width: 100%;
  min-height: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  background-attachment: fixed;
  overflow-x: hidden;
}

body.modal-open {
  overflow: hidden;
}

div.frame {
  min-height: 100%;
}

#buorg {
  z-index: 1111111 !important;
  position: absolute !important;
}

.buorg {
  z-index: 1111111 !important;
  position: absolute !important;
  width: 100%;
  padding: 1em 4em;
  top: 0px;
  left: 0px;
  border-bottom: 1px solid #a29330;
  background: #fdf2ab no-repeat 13px center url(//browser-update.org/img/small/c.gif);
  text-align: left;
  cursor: pointer;
  font-family: "Maax Regular", Arial, Helvetica, sans-serif !important;
  color: #000;
  font-size: 12px;
}

.buorg #buorgclose {
  float: right;
}

.buorg a {
  border-bottom: 1px solid #666;
}

/*______ Content ______*/

.gutter {
  padding-left: 15px !important;
  padding-right: 15px !important;
  margin: 0 auto;
  clear: both;
}

@media only screen and (min-width: 768px) {
  .gutter {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}

.neg-margin {
  margin: 0 -20px;
}

.neg-margin-venues {
  margin: 0;
}

@media only screen and (min-width: 640px) {
  .neg-margin-venues {
    margin: 0 -20px;
  }
}

.no-border {
  border: 0 !important;
}

nav#navigation #nav-wrapper {
  width: 100%;
  height: 100%;
  padding: 22px;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 50;
  background-color: #ffffff;
  overflow: auto;
}

nav#navigation #nav-wrapper.regional {
  color: #ffffff;
  background-color: #0000E1;
}

nav#navigation #nav-wrapper.regional .lang-switch {
  margin-bottom: 30px;
}

nav#navigation #nav-wrapper.regional .lang-switch .lang-switch-item {
  margin: 0 13px;
}

nav#navigation #nav-wrapper.regional .lang-switch .lang-switch-item a {
  color: #fff;
}

nav#navigation #nav-wrapper.regional .lang-switch .lang-switch-item a.active {
  border-bottom: 2px solid #fff;
}

@media only screen and (min-width: 768px) {
  nav#navigation #nav-wrapper.regional .lang-switch {
    margin-bottom: 30px;
  }
}

nav#navigation #nav-wrapper .nav-logo img,
nav#navigation #nav-wrapper .nav-logo svg {
  max-width: 105px;
  height: auto;
}

@media only screen and (min-width: 1024px) {
  nav#navigation #nav-wrapper .nav-logo img,
  nav#navigation #nav-wrapper .nav-logo svg {
    max-width: 270px;
    height: auto;
  }
}

nav#navigation #nav-wrapper .lang-switch {
  margin-bottom: 30px;
}

nav#navigation #nav-wrapper .lang-switch .lang-switch-item {
  margin: 0 13px;
}

nav#navigation #nav-wrapper .lang-switch .lang-switch-item a {
  color: #000;
}

nav#navigation #nav-wrapper .lang-switch .lang-switch-item a.active {
  border-bottom: 2px solid #000;
}

@media only screen and (min-width: 768px) {
  nav#navigation #nav-wrapper .lang-switch {
    margin-bottom: 30px;
  }
}

nav#navigation #nav-wrapper .nav-list {
  margin-top: 0;
}

@media only screen and (min-width: 1024px) {
  nav#navigation #nav-wrapper .nav-list {
    height: 80vh;
  }
}

nav#navigation #nav-wrapper .nav-items {
  margin-bottom: 20px;
}

nav#navigation #nav-wrapper .nav-items .nav-item {
  max-height: 50px;
  margin-bottom: 22px;
}

nav#navigation #nav-wrapper .nav-items .nav-item a:hover {
  font-family: "Maax Bold";
  transition: all 200ms linear;
}

nav#navigation #nav-wrapper #social-items {
  margin-top: 45px;
}

nav#navigation #nav-wrapper #social-items .social-item {
  margin-right: 24px;
}

nav#navigation #nav-wrapper #social-items .social-item:last-child {
  margin-right: 0;
}

nav#navigation #nav-wrapper #social-items .social-item g {
  fill: #ffffff;
}

nav#navigation #nav-wrapper .national #social-items .social-item g {
  fill: black;
}

nav#navigation #nav-wrapper .btn-green {
  margin-top: 30px;
}

nav#navigation #nav-wrapper .mainmenu {
  padding: 56px 0 0 0;
}

@media only screen and (min-width: 1280px) {
  nav#navigation #nav-wrapper .mainmenu {
    padding: 85px 0 0 0;
  }
}

nav#navigation #nav-wrapper .mainmenu.national {
  padding: 0;
}

nav#navigation #nav-wrapper .national-site {
  text-align: left;
  width: 100%;
  padding: 0;
}

nav#navigation #nav-wrapper .national-site a {
  margin: 0;
}

nav#navigation #nav-wrapper .national-site a svg {
  padding: 5px 0 0;
}

nav#navigation #nav-wrapper .national-site img,
nav#navigation #nav-wrapper .national-site svg {
  max-width: 105px;
  height: auto;
}

@media only screen and (min-width: 1024px) {
  nav#navigation #nav-wrapper .national-site {
    text-align: center;
    padding: 0 0 10px;
  }

  nav#navigation #nav-wrapper .national-site img,
  nav#navigation #nav-wrapper .national-site svg {
    max-width: 270px;
    height: auto;
  }
}

nav#navigation #city-selector-wrapper {
  background-color: #FFF03C;
  z-index: 64;
}

nav#navigation #city-selector-wrapper .drop-down-icon {
  margin-top: 20px;
}

nav#navigation #city-selector-wrapper #controls {
  padding: 15px 15px;
  height: 30px;
}

nav#navigation #city-selector-wrapper #controls #city-selector-button > button {
  background-color: #ffffff;
  padding: 20px 62px;
}

@media only screen and (min-height: 321px) {
  nav#navigation #city-selector-wrapper #controls {
    padding: 15px 15px;
  }
}

nav#users ul,
nav#users li {
  list-style: none !important;
}

nav#users li span {
  color: #000000;
}

header.site {
  margin: 0;
  width: 100%;
  height: auto;
  padding: 15px;
}

@media only screen and (min-width: 1024px) {
  header.site {
    margin: 0 auto;
  }
}

header.site #header-wrapper {
  padding: 15px;
}

header.site.header-program {
  height: 300px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

header.site .logo {
  z-index: 8;
  max-width: 250px;
}

@media only screen and (min-height: 415px) {
  header.site .logo {
    max-width: unset;
  }
}

header.site .logo img,
header.site .logo svg {
  width: 100%;
  min-width: 87px;
  max-width: 125px;
  height: auto;
  /*float: left;*/
}

header.site .logo img.logo-home,
header.site .logo svg.logo-home {
  max-width: 550px;
}

header.site .logo img #Text,
header.site .logo svg #Text {
  display: none;
}

header.site #meta-wrapper {
  z-index: 12;
  position: relative;
  top: 0;
  right: 35px;
  padding: 0;
  /*#lang-switch {

  		.lang-switch-item {
  			font-family: "Maax Bold";
  			font-size: 18px;
  			margin-left: 15px;
  			&:first-child {
  				margin-left: 28px;
  			}

  			a { position: relative;
  				text-decoration: none;

  				&:hover {
  					color: $black;
  				}

  				&:after {
  					content: '';
  					height: 3px;
  					position: absolute;
  					bottom: 0;
  					left: 0;
  					width: 0;
  					background: $black;
  					transition: 0.2s;
  				  }

  				  &.active:after {
  					background: #000000;
  					width: 100%;
  					left: 0;
  				  }

  				  &.nav-active {
  					color: #ffffff;
  				  }

  				  &.nav-active:after {
  					color: #ffffff;
  					background: #ffffff;
  				  }


  				  &:hover:after {
  					color: #ffffff;
  					background: #ffffff;
  					width: 100%;
  					left: 0;
  				  }

  				  &.nav-active:hover:after {
  					background: #ffffff;
  				  }




  			}
  		}

  	}*/
}

@media only screen and (min-width: 640px) {
  header.site #meta-wrapper {
    position: absolute;
    top: 23px;
    right: 40px;
    padding: 0 55px 0 0;
  }
}

@media only screen and (min-width: 1024px) {
  header.site #meta-wrapper {
    position: relative;
    top: 0;
  }
}

header.site #meta-wrapper.nav-active {
  color: #ffffff;
}

header.site #meta-wrapper #meta .meta-item {
  padding: 0 10px;
}

@media only screen and (min-width: 1024px) {
  header.site #meta-wrapper #meta .meta-item {
    padding: 0;
    margin-left: 32px;
  }
}

header.site button.hamburger {
  padding: 0;
  display: flex;
  z-index: 12;
  position: fixed;
  top: 15px;
  right: 15px;
}

@media only screen and (min-width: 1024px) {
  header.site button.hamburger {
    position: fixed;
    transform: translateY(0);
    transition: transform 200ms ease-in-out;
  }
}

header.site button.hamburger.burger--hidden {
  transform: translateY(-100px);
  position: fixed;
  transition: transform 200ms ease-in-out;
}

header.site button.hamburger.burger-program {
  position: static !important;
}

header.site button.tickets {
  padding: 0;
  display: flex;
  z-index: 9 !important;
  position: fixed;
  top: 15px;
  right: 164px !important;
  transform: translateY(0);
  transition: transform 200ms ease-in-out;
}

header.site button.tickets:hover {
  color: #ffffff;
}

header.site button.tickets.fr {
  right: 182px !important;
}

@media only screen and (min-width: 768px) {
  header.site button.tickets {
    /*
    position: fixed;
    top: 15px;
    right: 210px;
    transform: translateY(0);
    transition: transform 200ms ease-in-out;

     */
  }
}

@media only screen and (min-width: 1024px) {
  header.site button.tickets {
    position: fixed;
    top: 15px;
    right: 280px !important;
    transform: translateY(0);
    transition: transform 200ms ease-in-out;
  }

  header.site button.tickets.fr {
    right: 314px !important;
  }
}

header.site button.tickets.burger--hidden {
  transform: translateY(-100px);
  position: fixed;
  transition: transform 200ms ease-in-out;
}

header.site button.tickets.tickets-program {
  position: static !important;
  margin-right: 110px !important;
}

header.site button.tickets.tickets-program.fr {
  margin-right: 128px !important;
}

@media only screen and (min-width: 1024px) {
  header.site button.tickets.tickets-program {
    margin-right: 205px !important;
  }

  header.site button.tickets.tickets-program.fr {
    margin-right: 239px !important;
  }
}

header.site button.tickets a {
  font-size: 16px;
  line-height: 16px;
  padding: 12px 24px 12px 24px;
}

@media only screen and (min-width: 768px) {
  header.site button.tickets a {
    font-size: 16px;
    line-height: 16px;
  }
}

@media only screen and (min-width: 1024px) {
  header.site button.tickets a {
    font-size: 30px;
    line-height: 36px;
    padding: 12px 45px 12px 45px;
  }
}

header.site ul#meta {
  text-align: left;
  float: left;
  display: none;
}

@media only screen and (min-width: 1024px) {
  header.site ul#meta {
    display: block;
    float: right;
    width: auto;
    text-align: right;
    top: 0;
  }
}

header.site ul#meta li {
  float: left;
  display: inline;
  padding: 0 0.3em;
  position: relative;
}

@media only screen and (min-width: 1024px) {
  header.site ul#meta li {
    width: auto;
    float: left;
  }
}

header.site ul#meta li a {
  float: left;
  width: auto;
  margin: 0;
  padding: 0.2em 0 0.15em 0;
  letter-spacing: 0.05em;
}

@media only screen and (min-width: 1024px) {
  header.site ul#meta li a.img {
    padding: 0.05em 0 0.15em 0;
    margin: 0 0.3em;
  }
}

.content-wrap {
  width: 100%;
}

.content-frame {
  width: 100%;
  margin: 0 auto;
}

main.content {
  float: none;
  max-width: 100%;
  margin: 0 auto;
  text-align: left;
  z-index: 0;
  min-height: 600px;
}

main.content > *:last-child {
  padding-bottom: 125px;
}

main.content .visual-container .visual-wrapper {
  background-size: cover;
  height: 90vh;
  width: 100vw;
  background-size: cover;
  background-position: center;
  top: 0;
}

main.content .visual-container .visual-wrapper video {
  width: 100%;
  height: 100vh;
  -o-object-fit: cover;
  object-fit: cover;
}

main.content .visual-container .visual-wrapper a {
  bottom: 7vh;
  color: #ffffff;
}

@media only screen and (min-width: 768px) {
  main.content .visual-container .visual-wrapper a {
    bottom: 8vh;
  }
}

main.content .visual-container .visual-wrapper.regional {
  height: auto;
}

main.content .visual-wrapper {
  display: flex;
  justify-content: center;
}

main.content .visual-wrapper .select-region-wrapper {
  position: fixed;
  bottom: 40px;
  z-index: 9;
}

main.content .impressions {
  margin: 0 auto 50px;
}

main.content .national-projects {
  margin-bottom: 0px;
}

@media only screen and (min-width: 768px) {
  main.content .national-projects {
    margin-bottom: 135px;
  }
}

main.content .national-projects a {
  text-decoration: none;
}

main.content .national-projects h2 {
  margin: 73px 0 41px;
}

@media only screen and (min-width: 768px) {
  main.content .national-projects h2 {
    margin: 0 0 50px;
  }
}

main.content .national-projects .national-projects-container .national-project {
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
}

@media only screen and (min-width: 768px) {
  main.content .national-projects .national-projects-container .national-project:hover .arrow-icon {
    transform: translateX(10px);
  }
}

main.content .national-projects .national-projects-container .national-project:hover .national-project-image img {
  transform: scale(1.1);
}

main.content .national-projects .national-projects-container .national-project .national-project-image {
  overflow: hidden;
}

main.content .national-projects .national-projects-container .national-project .national-project-image img {
  transform-origin: 50% 50%;
  transition: transform 0.25s, visibility 0.25s ease-in;
}

main.content .national-projects .national-projects-container .national-project .text-container {
  flex-grow: 1;
  padding: 32px 17px 90px;
  color: #ffffff;
  background-color: #FF4626;
}

@media only screen and (min-width: 768px) {
  main.content .national-projects .national-projects-container .national-project .text-container {
    padding: 55px 35px 85px;
  }
}

main.content .national-projects .national-projects-container .national-project .text-container h3 {
  margin: 0 0 15px;
}

main.content .national-projects .national-projects-container .national-project .text-container div {
  padding-bottom: 30px;
}

main.content .national-projects .national-projects-container .national-project .text-container .arrow-icon {
  position: absolute;
  bottom: 27px;
}

main.content .news-list .news-item {
  padding-bottom: 115px;
}

main.content .news-list .news-item h2 {
  margin: 10px 0 15px;
}

main.content .ads {
  padding: 52px 0;
}

@media only screen and (min-width: 768px) {
  main.content .ads {
    padding: 75px 0;
  }
}

main.content .ads h2 {
  margin-bottom: 42px;
}

@media only screen and (min-width: 768px) {
  main.content .ads h2 {
    margin-bottom: 45px;
  }
}

main.content .ads .ads-wrapper {
  margin: 0 -10px;
}

main.content .ads .ads-wrapper .ad {
  padding: 0 10px;
  margin-bottom: 34px;
}

@media only screen and (min-width: 768px) {
  main.content .ads .ads-wrapper .ad {
    margin-bottom: 20px;
  }
}

main.content .supporters,
main.content .partners {
  padding-top: 118px;
}

@media only screen and (min-width: 768px) {
  main.content .supporters,
  main.content .partners {
    padding-top: 145px;
    padding-bottom: 90px;
  }
}

main.content .supporters h2,
main.content .partners h2 {
  padding-bottom: 0;
  margin-bottom: 50px;
}

main.content .supporters a,
main.content .partners a {
  width: 100%;
}

main.content .supporters a img,
main.content .partners a img {
  width: 100%;
  height: auto;
  padding-bottom: 0;
}

main.content .supporters a img.portrait,
main.content .partners a img.portrait {
  max-width: 150px;
  height: auto;
}

main.content .supporters a img.landscape,
main.content .partners a img.landscape {
  max-width: 200px;
}

main.content .supporters a img.square,
main.content .partners a img.square {
  max-width: 200px;
  height: auto;
}

main.content .newsletter {
  padding: 75px 0;
  background-color: #0000E1;
  text-align: center;
  color: #ffffff;
}

@media only screen and (min-width: 768px) {
  main.content .newsletter .nl-wrap {
    width: 66.6666%;
    margin: 0 auto;
  }
}

main.content .newsletter .form-nl {
  padding: 40px 0 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

main.content .newsletter .form-nl input {
  padding: 30px 10px 30px 0;
  border-top-width: 0px;
  border-left-width: 0px;
  border-right-width: 0px;
  border-bottom: 3px solid #ffffff;
  height: 25px;
  background-color: inherit;
  color: #ffffff;
}

main.content .newsletter .form-nl input::-moz-placeholder {
  vertical-align: baseline;
  color: rgba(255, 255, 255, 0.7);
}

main.content .newsletter .form-nl input::placeholder {
  vertical-align: baseline;
  color: rgba(255, 255, 255, 0.7);
}

main.content .newsletter .form-nl input:focus {
  outline: none;
}

main.content .newsletter .form-nl input:-internal-autofill-selected {
  background-color: inherit;
}

main.content .news {
  padding: 52px 0;
  background-color: #FFF03C;
}

main.content .news #news-wrapper {
  margin: 0 -20px;
}

main.content .news #news-wrapper h2 {
  padding: 0 20px 34px;
}

main.content .news #news-wrapper .news-item {
  padding: 0 20px;
  margin-bottom: 58px;
}

main.content .news #news-wrapper .news-item:last-child {
  margin-bottom: 0;
}

main.content .news #news-wrapper .news-item .arrow-wrapper {
  margin-top: 7px;
}

main.content .news #news-wrapper .news-item .arrow-wrapper .arrow-icon {
  width: 19px;
}

main.content .news #news-wrapper .news-item .news-date {
  padding-bottom: 10px;
}

@media only screen and (min-width: 768px) {
  main.content .news {
    padding: 75px 0;
  }

  main.content .news #news-wrapper {
    margin: 0 -20px;
  }

  main.content .news #news-wrapper h2 {
    padding: 0 20px 75px;
  }

  main.content .news #news-wrapper .news-item {
    padding: 0 20px;
  }

  main.content .news #news-wrapper .news-item .arrow-wrapper {
    margin-top: 7px;
  }

  main.content .news #news-wrapper .news-item .arrow-wrapper .arrow-icon {
    width: 32px;
  }

  main.content .news #news-wrapper .news-item .news-date {
    padding-bottom: 10px;
  }
}

main.content .highlights {
  padding: 75px 0;
}

main.content .highlights h2 {
  padding: 0 0 75px;
}

main.content .claim {
  padding: 108px 20px 0;
  text-align: center;
}

@media only screen and (min-width: 1024px) {
  main.content .claim {
    padding: 210px 100px 200px 100px;
  }
}

main.content .claim a {
  text-decoration: none;
}

@media only screen and (min-width: 768px) {
  main.content .claim a:hover {
    color: #000000;
  }
}

main.content .claim .arrow-icon {
  margin-top: 10px;
}

main.content article header.entry {
  height: auto;
  line-height: normal;
  margin-bottom: 20px;
  padding-top: 20px;
}

@media only screen and (min-width: 768px) {
  main.content article header.entry {
    padding-top: 40px;
    margin-bottom: 40px;
  }
}

main.content article header.entry h1 {
  margin: 19px 0 11px;
}

@media only screen and (min-width: 768px) {
  main.content article header.entry h1 {
    margin: 10px 0 20px;
  }
}

main.content article header.entry .subtitle {
  margin: 10px 0 20px;
}

main.content article .event-detail-content aside a {
  border-bottom: 1px solid #000;
}

@media only screen and (min-width: 768px) {
  main.content article .event-detail-content aside a:hover {
    color: #0000E1;
    border-bottom: 1px solid #0000E1;
    opacity: 1;
  }
}

main.content article section .text-container {
  padding: 30px 0 0 0;
}

@media only screen and (min-width: 768px) {
  main.content article section .text-container {
    padding: 45px 0 0 0;
  }
}

main.content article section .text-container h2 {
  padding: 20px 0 18px;
}

@media only screen and (min-width: 768px) {
  main.content article section .text-container h2 {
    padding: 20px 0 10px;
  }
}

main.content article section .text-container a {
  border-bottom: 1px solid #000;
}

@media only screen and (min-width: 768px) {
  main.content article section .text-container a:hover {
    color: #0000E1;
    border-bottom: 1px solid #0000E1;
    opacity: 1;
  }
}

main.content article section.articletext a {
  border-bottom: 1px solid #000;
}

@media only screen and (min-width: 768px) {
  main.content article section.articletext a:hover {
    color: #0000E1;
    border-bottom: 1px solid #0000E1;
    opacity: 1;
  }
}

main.content article section.articletext .badge {
  width: 200px;
  padding: 30px 0 100px;
}

main.content article.national-projects-overview a {
  text-decoration: none;
}

main.content article.national-projects-overview section.national-project {
  margin-bottom: 20px;
}

@media only screen and (min-width: 768px) {
  main.content article.national-projects-overview section.national-project {
    margin-bottom: 65px;
  }
}

@media only screen and (min-width: 768px) {
  main.content article.national-projects-overview section.national-project:hover .national-project-image img {
    transform: scale(1.1);
  }
}

main.content article.national-projects-overview section.national-project .national-project-image {
  overflow: hidden;
}

main.content article.national-projects-overview section.national-project .national-project-image img {
  transform-origin: 50% 50%;
  transition: transform 0.25s, visibility 0.25s ease-in;
}

main.content article.national-projects-overview section.national-project .text-container {
  padding: 20px;
  color: #fff;
  background-color: #FF4626;
}

@media only screen and (min-width: 768px) {
  main.content article.national-projects-overview section.national-project .text-container {
    padding: 55px 35px 85px;
  }
}

main.content article.national-projects-overview section.national-project .text-container div {
  padding-bottom: 30px;
}

main.content article.national-projects-overview section.national-project .text-container .arrow-icon {
  position: absolute;
  bottom: 20px;
  left: 20px;
}

@media only screen and (min-width: 768px) {
  main.content article.national-projects-overview section.national-project .text-container .arrow-icon {
    bottom: 27px;
    left: 38px;
  }
}

main.content article.national-projects-overview section.national-project .text-container a {
  border-bottom: 1px solid #000;
}

@media only screen and (min-width: 768px) {
  main.content article.national-projects-overview section.national-project .text-container a:hover {
    color: #0000E1;
    border-bottom: 1px solid #0000E1;
    opacity: 1;
  }
}

main.content article.national-project-detail header {
  top: 0;
}

@media only screen and (min-width: 1024px) {
  main.content article.national-project-detail header {
    top: -127px;
  }
}

main.content article.national-project-detail header .text-container {
  color: #fff;
  background-color: #FF4626;
  padding: 20px;
}

@media only screen and (min-width: 1024px) {
  main.content article.national-project-detail header .text-container {
    min-height: 800px;
    padding: 150px 90px 60px;
  }
}

main.content article.national-project-detail header .text-container h1 {
  padding: 0 0 10px;
}

main.content article.national-project-detail header .image-desktop {
  background-repeat: no-repeat;
  background-size: cover;
}

main.content article.national-project-detail section .text-container {
  padding: 30px 0 0 0;
}

@media only screen and (min-width: 768px) {
  main.content article.national-project-detail section .text-container {
    padding: 45px 0 0 0;
  }
}

main.content article.national-project-detail section .text-container h2 {
  padding: 0 0 10px;
}

@media only screen and (min-width: 768px) {
  main.content article.national-project-detail section .text-container h2 {
    padding: 0 0 10px;
  }
}

main.content article.national-project-detail section .text-container a {
  border-bottom: 1px solid #000;
}

@media only screen and (min-width: 768px) {
  main.content article.national-project-detail section .text-container a:hover {
    color: #0000E1;
    border-bottom: 1px solid #0000E1;
    opacity: 1;
  }
}

main.content article.schedule-detail header {
  margin-bottom: 0;
}

main.content article.schedule-detail header h1 {
  margin-bottom: 0;
}

main.content article.schedule-detail .event-detail-content {
  padding-top: 36px;
}

@media only screen and (min-width: 1024px) {
  main.content article.schedule-detail .event-detail-content {
    padding-top: 46px;
  }
}

main.content article.schedule-detail .event-detail-content aside p strong {
  font-family: "Maax Medium";
  font-weight: normal;
}

main.content article.schedule-detail .event-image {
  margin: 0 0 27px 0;
}

@media only screen and (min-width: 1024px) {
  main.content article.schedule-detail .event-image {
    margin: 0 0 53px 0;
  }
}

main.content article.schedule-detail .mobiledates {
  margin: 5px 0 22px 0;
}

main.content article.schedule-detail .np-badge {
  background: #FF0069;
  color: #ffffff;
  padding: 1px 4px 3px;
  float: left;
  text-align: center;
  margin-top: 1rem;
  transition: opacity 200ms ease-in-out;
}

@media only screen and (min-width: 768px) {
  main.content article.schedule-detail .np-badge {
    padding: 2px 21px 6px;
  }
}

@media only screen and (min-width: 768px) {
  main.content article.schedule-detail .np-badge:hover {
    transition: opacity 200ms ease-in-out;
    opacity: 0.8;
  }
}

main.content article.schedule-detail .np-badge-shortinfo {
  background: #bf7903;
  color: #ffffff;
  padding: 1px 4px 3px;
  float: left;
  text-align: center;
  margin-top: 1rem;
  transition: opacity 200ms ease-in-out;
}

@media only screen and (min-width: 768px) {
  main.content article.schedule-detail .np-badge-shortinfo {
    padding: 2px 21px 6px;
  }
}

@media only screen and (min-width: 768px) {
  main.content article.schedule-detail .np-badge-shortinfo:hover {
    transition: opacity 200ms ease-in-out;
    opacity: 0.8;
  }
}

main.content article.schedule-detail .lead {
  margin-bottom: 25px;
}

main.content article.schedule-detail .map-icon {
  width: 25px;
  height: 25px;
  float: left;
  margin: 1px 2px 0 -7px;
}

main.content article.schedule-detail aside {
  margin-top: 64px;
}

@media only screen and (min-width: 768px) {
  main.content article.schedule-detail aside {
    margin-top: -8px;
  }
}

main.content article.schedule-detail aside p {
  margin: 0 0 1.5em 0;
}

main.content article.schedule-detail aside h2 {
  margin: 0 0 13px 0;
}

main.content article.schedule-detail aside h3 {
  margin: 1em 0 0 0;
}

main.content article.schedule-detail aside ul {
  margin: 0 !important;
  list-style-position: inside !important;
}

@media only screen and (min-width: 768px) {
  main.content article.schedule-detail aside a:hover {
    opacity: 1;
  }
}

main.content article.national-contacts {
  background-color: #F3F2F3;
  padding: 30px 0;
}

@media only screen and (min-width: 768px) {
  main.content article.national-contacts {
    padding: 67px 0;
  }
}

main.content article.national-contacts h2 {
  margin-bottom: 25px;
}

@media only screen and (min-width: 768px) {
  main.content article.national-contacts h2 {
    margin-bottom: 45px;
  }
}

main.content article.national-contacts .contact-member-national {
  margin-bottom: 33px;
}

main.content article.regional-contacts {
  background-color: #FFF03C;
  padding: 30px 0;
}

@media only screen and (min-width: 768px) {
  main.content article.regional-contacts {
    padding: 67px 0;
  }
}

main.content article.contacts {
  padding: 30px 0;
  padding-top: 30px;
}

main.content article.contacts:not(.regional-contacts) + .contacts:not(.regional-contacts) {
  padding-top: 0;
}

@media only screen and (min-width: 768px) {
  main.content article.contacts {
    padding: 67px 0;
  }
}

@media only screen and (min-width: 768px) {
  main.content article.contacts a:hover {
    color: #0000E1;
    border-bottom: 1px solid #0000E1;
    opacity: 1;
  }
}

main.content article.contacts h2 {
  margin-bottom: 25px;
}

@media only screen and (min-width: 768px) {
  main.content article.contacts h2 {
    margin-bottom: 45px;
  }
}

main.content article.contacts .contact-wrapper {
  position: relative;
  -moz-column-count: 1;
       column-count: 1;
}

@media only screen and (min-width: 768px) {
  main.content article.contacts .contact-wrapper {
    -moz-column-count: 2;
         column-count: 2;
  }
}

@media only screen and (min-width: 1024px) {
  main.content article.contacts .contact-wrapper {
    -moz-column-count: 3;
         column-count: 3;
  }
}

main.content article.contacts .contact-wrapper .contact-national {
  margin-bottom: 50px;
}

main.content article.contacts .contact-wrapper .contact-national p {
  margin: 0 0 1em 0;
}

main.content article.contacts .contact-wrapper .contact-region { /* Chrome, Safari, Opera */
  page-break-inside: avoid; /* Firefox */
  -moz-column-break-inside: avoid;
       break-inside: avoid;
  position: relative;
  margin-bottom: 50px;
}

main.content article.contacts .contact-wrapper .contact-region .contact-member {
  margin-bottom: 1em;
}

main.content article.contacts .contact-wrapper .contact-region .contact-member:last-child {
  margin-bottom: 0;
}

@media only screen and (min-width: 768px) {
  main.content article.contacts .contact-wrapper .all-contacts-link {
    margin-top: 70px;
  }
}

main.content article.contacts .contact-wrapper .all-contacts-link svg {
  margin: 0em 0.5em 0 0;
  width: 19px;
  height: 26px;
}

@media only screen and (min-width: 768px) {
  main.content article.contacts .contact-wrapper .all-contacts-link svg {
    width: 32px;
    height: 26px;
  }
}

@media only screen and (min-width: 768px) {
  main.content article.contacts .contact-wrapper .all-contacts-link a:hover {
    color: #0000E1;
  }
}

main.content article aside {
  margin: 65px 0 0 0;
}

@media only screen and (min-width: 1024px) {
  main.content article aside {
    margin: 0;
  }
}

main.content section.slider-companies {
  margin-bottom: 20px;
}

@media only screen and (min-width: 768px) {
  main.content section.slider-companies {
    margin-bottom: 60px;
  }
}

main.content section.slider-companies img {
  width: 100%;
}

main.content section.video-embed {
  margin: 40px auto 0px;
}

@media only screen and (min-width: 768px) {
  main.content section.video-embed {
    margin: 110px auto 20px;
  }
}

main.content section.gallery-testimonial {
  margin: 80px auto;
}

@media only screen and (min-width: 768px) {
  main.content section.gallery-testimonial {
    margin: 165px auto;
  }
}

main.content section.gallery-testimonial > div {
  margin: 50px auto;
}

@media only screen and (min-width: 768px) {
  main.content section.gallery-testimonial > div {
    margin: 95px auto;
  }
}

main.content section.gallery-testimonial > div:first-child {
  margin: 0 auto;
}

main.content section.tickettypes {
  background-color: #FFF03C;
  padding: 30px 0;
}

@media only screen and (min-width: 1024px) {
  main.content section.tickettypes {
    padding: 80px 15px;
  }
}

main.content section.tickettypes .ticket {
  margin: 0 0 50px;
}

main.content section.ticketagencies {
  padding: 30px 15px;
}

@media only screen and (min-width: 1024px) {
  main.content section.ticketagencies {
    padding: 80px 15px;
  }
}

main.content section.ticketagencies .grid-item {
  padding-top: 50px;
}

main.content section.ticketagencies .grid-item .grid-item-title {
  padding: 0 0 15px;
}

@media only screen and (min-width: 768px) {
  main.content section.ticketagencies .grid-item a:hover {
    color: #0000E1;
    border-bottom: 1px solid #0000E1;
    opacity: 1;
  }
}

main.content section.ticketshop-embed {
  padding-top: 80px;
  padding-bottom: 80px;
}

main.content section.ticketshop-embed iframe.embed {
  min-height: 500px;
  width: 100%;
  overflow: auto;
}

main.content section .testimonial {
  margin: 0 -40px;
  padding: 30px;
}

main.content section .testimonial.rtl {
  direction: rtl;
}

main.content section .testimonial.rtl .testimonial-text .testimonial-quote {
  direction: ltr;
}

main.content section .testimonial .testimonial-text .testimonial-quote {
  margin-bottom: 30px;
}

main.content section .testimonial .testimonial-text .left {
  text-align: center;
}

@media only screen and (min-width: 768px) {
  main.content section .testimonial .testimonial-text .left {
    padding: 80px 80px 80px 0;
    text-align: left;
  }
}

main.content section .testimonial .testimonial-text .right {
  text-align: center;
}

@media only screen and (min-width: 768px) {
  main.content section .testimonial .testimonial-text .right {
    padding: 80px;
    text-align: left;
  }
}

main.content section .testimonial .testimonial-image-text {
  padding-top: 20px;
}

@media only screen and (min-width: 768px) {
  main.content section .testimonial .testimonial-image-text {
    padding-top: 0;
  }
}

@media only screen and (min-width: 768px) {
  main.content section .testimonial .testimonial-quoter {
    padding: 0;
  }
}

main.content section.media-dossiers {
  background-color: #CFBCF8;
  padding: 60px 0px;
  margin-top: 60px;
}

main.content section.press-contacts {
  padding: 30px 0;
}

@media only screen and (min-width: 768px) {
  main.content section.press-contacts {
    padding: 67px 0;
  }
}

main.content section.press-contacts .press-contact-item:not(:first-child) {
  margin-top: 25px;
}

@media only screen and (min-width: 768px) {
  main.content section.press-contacts .press-contact-item:not(:first-child) {
    margin-top: 0;
  }
}

main.content section.press-contacts .press-contact-item:not(:first-child) a {
  border-bottom: 1px solid #000;
}

@media only screen and (min-width: 768px) {
  main.content section.press-contacts .press-contact-item:not(:first-child) a:hover {
    color: #0000E1;
    border-bottom: 1px solid #0000E1;
    opacity: 1;
  }
}

main.content section.press-releases, main.content section.press-downloads {
  background-color: #F3F2F3;
  padding: 30px 0;
}

@media only screen and (min-width: 768px) {
  main.content section.press-releases, main.content section.press-downloads {
    padding: 67px 0;
  }
}

main.content section.press-releases .download-item:not(:first-child), main.content section.press-downloads .download-item:not(:first-child) {
  margin-top: 40px;
}

main.content section.press-releases .download-file, main.content section.press-downloads .download-file {
  padding: 10px 0 5px 0;
}

main.content section.press-releases .download-file svg, main.content section.press-downloads .download-file svg {
  margin: 0 10px 0 0;
}

@media only screen and (min-width: 768px) {
  main.content section.press-releases a:hover, main.content section.press-downloads a:hover {
    color: #0000E1;
    opacity: 1;
  }
}

main.content section.press-images {
  background-color: #F3F2F3;
  padding-top: 60px;
}

main.content section.press-images h2 {
  padding: 0 0 40px 0;
}

main.content section.press-images .masonry {
  /* Masonry container */
}

@media only screen and (min-width: 768px) {
  main.content section.press-images .masonry {
    -moz-column-count: 3;
         column-count: 3;
  }
}

main.content section.press-images .masonry .masonry-item {
  /* Masonry bricks or child elements */
  display: inline-block;
  margin: 0 0 38px;
  width: 100%;
}

main.content section.press-images .press-image {
  position: relative;
}

@media only screen and (min-width: 768px) {
  main.content section.press-images .press-image:hover .press-image-container img {
    transform: scale(1.1);
  }
}

main.content section.press-images .press-image span {
  float: left;
}

main.content section.press-images .press-image .press-image-container {
  overflow: hidden;
}

main.content section.press-images .press-image .press-image-container img {
  transform-origin: 50% 50%;
  transition: transform 0.25s, visibility 0.25s ease-in;
}

main.content section.press-images .press-image .press-image-caption {
  margin-top: 4px;
}

main.content section.press-images .press-image .download-overlay {
  opacity: 0;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  position: absolute;
  transition: opacity 200ms ease-in-out;
}

@media only screen and (min-width: 768px) {
  main.content section.press-images .press-image .download-overlay:hover {
    opacity: 1;
    transition: opacity 200ms ease-in-out;
  }
}

main.content section.press-images .press-image .download-overlay img {
  width: 50px;
}

main.content section.press-kits {
  margin-top: 40px;
}

main.content section.press-kits h2 {
  padding: 0 0 10px 0;
}

@media only screen and (min-width: 768px) {
  main.content section.press-kits h2 {
    padding: 0 0 20px 0;
  }
}

main.content section.press-kits .press-kit {
  position: relative;
}

main.content section.press-kits .press-kit .download-overlay {
  opacity: 1;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: flex;
  justify-content: bewtween;
  position: absolute;
  transition: opacity 200ms ease-in-out;
  transition: transform 200ms ease-in-out;
  padding: 20px;
}

main.content section.venues {
  padding-bottom: 65px;
}

@media only screen and (min-width: 640px) {
  main.content section.venues {
    padding-bottom: 100px;
  }
}

main.content section.venues .venue .venue-text {
  padding: 20px 0;
}

main.content section.venues .venue a {
  border-bottom: 0;
}

main.content section.venues .venue a .icon {
  margin-right: 10px;
}

main.content section.venues .venue a .icon:before {
  content: url('data:image/svg+xml; utf8, <svg width="24px" height="16px" viewBox="0 0 24 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <g id="Desktop" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="04_Desktop_National_Projekt_Detail_2-(1)-Copy" transform="translate(-954.000000, -1199.000000)" stroke="#000000" stroke-width="1.2"> <g id="Link_nachAussen-Copy-3" transform="translate(955.000000, 1193.000000)"> <g id="Pfeil_p" transform="translate(0.000000, 6.000000)"> <polyline id="Path-3-Copy" transform="translate(17.500000, 8.000000) rotate(-90.000000) translate(-17.500000, -8.000000) " points="10 4 17.5 12 25 4"></polyline> <line x1="2.84147705e-14" y1="8" x2="20" y2="8" id="Line" stroke-linecap="square"></line> </g> </g> </g> </g></svg>');
  width: 22px;
  height: 16;
}

@media only screen and (min-width: 768px) {
  main.content section.venues .venue a:hover {
    color: #0000E1;
    border-bottom: 1px solid #0000E1;
    opacity: 1;
  }
}

main.content section.venues .venue .map-icon {
  display: inline;
  width: 25px;
  height: 25px;
  margin: 1px 2px 0 -7px;
}

main.content aside.companies h2 {
  margin: 50px 0 20px;
}

@media only screen and (min-width: 768px) {
  main.content aside.companies h2 {
    margin: 80px 0 50px;
  }
}

main.content aside.companies .company-container .company {
  /*
  	a {
  		transition: opacity 200ms;
  		&:hover {
  			> * {
  				opacity: 1;
  				transition: opacity 200ms;
  			}
  		}
  	}
  	*/
}

main.content aside.companies .company-container .company .title-wrapper {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  width: auto;
  background: linear-gradient(to bottom, transparent, black);
}

main.content aside.companies .company-container .company .title-wrapper h3 {
  color: #fff;
  padding: 10px 20px;
}

@media only screen and (min-width: 768px) {
  main.content aside.companies .company-container .company:hover .company-content img {
    transform: scale(1.1);
  }
}

main.content aside.companies .company-container .company .company-content {
  overflow: hidden;
}

main.content aside.companies .company-container .company .company-content img {
  transform-origin: 50% 50%;
  transition: transform 0.25s, visibility 0.25s ease-in;
}

main.content aside.sharing {
  padding: 94px 15px;
}

@media only screen and (min-width: 768px) {
  main.content aside.sharing {
    padding: 125px 0;
  }
}

main.content aside.sharing .sharing-buttons {
  padding: 30px 0 0;
}

main.content aside.sharing .sharing-buttons .sharing-button {
  padding: 0 15px;
}

main.content aside.teaser-bar {
  margin: 40px 0;
}

@media only screen and (min-width: 768px) {
  main.content aside.teaser-bar {
    margin: 70px 0;
  }
}

main.content aside.teaser-bar h2 {
  margin: 0 0 15px;
}

@media only screen and (min-width: 768px) {
  main.content aside.teaser-bar h2 {
    margin: 0 0 25px;
  }
}

main.content aside.teaser-bar .event {
  display: flex;
  flex-direction: column;
}

@media only screen and (min-width: 768px) {
  main.content aside.teaser-bar .event:nth-child(3) {
    display: none;
  }
}

@media only screen and (min-width: 1024px) {
  main.content aside.teaser-bar .event:nth-child(3) {
    display: flex;
  }
}

main.content aside.teaser-bar .event .event-text {
  background-color: #F3F2F3;
  padding: 12px 17px 57px;
  flex-grow: 1;
}

main.content aside.teaser-bar .event .event-text .event-type {
  padding-bottom: 10px;
}

main.content aside.teaser-bar .event .event-text .event-type .type-course {
  color: #9013FE;
}

main.content aside.teaser-bar .event .event-text .event-type .type-event {
  color: #02B0A7;
}

main.content aside.teaser-bar .event .event-text .event-title {
  padding-bottom: 1px;
}

@media only screen and (min-width: 768px) {
  main.content aside.teaser-bar .event:hover .thumbnail img {
    transform: scale(1.1);
  }
}

main.content aside.teaser-bar .event .thumbnail {
  overflow: hidden;
}

main.content aside.teaser-bar .event .thumbnail img {
  transform-origin: 50% 50%;
  transition: transform 0.25s, visibility 0.25s ease-in;
}

/*______ Footer ______*/

footer {
  color: #ffffff;
  height: 132px;
  width: 100%;
  overflow: hidden;
  padding: 20px;
}

footer.regional {
  background-color: #000000;
}

footer.national {
  background-color: #000000;
}

footer .footer-logo {
  width: 50%;
}

footer .footer-logo svg {
  width: 100%;
  max-width: 105px;
  height: auto;
}

@media only screen and (min-width: 768px) {
  footer {
    height: 200px;
    right: 0;
    bottom: 0;
    left: 0;
  }

  footer .footer-logo {
    width: 125px;
  }

  footer .footer-logo svg {
    width: 100%;
    max-width: 125px;
  }
}

footer #city-selector-button {
  padding: 10px 16px;
}

footer section {
  padding: 20px;
}

footer #footer-navigation #footer-navigation-item {
  margin-left: 58px;
}

.footerwrap {
  display: block;
  margin: 0 auto;
  overflow: hidden;
}

@media only screen and (min-width: 768px) {
  .footerwrap {
    font-size: 1em;
  }
}

/*______ Tables ______*/

/*______ Forms ______*/

.form-wrap {
  border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}

.delete-form,
.col-control {
  width: 90px;
  padding: 5px 0 0 10px;
  position: absolute;
  right: 25px;
}

@media only screen and (min-width: 768px) {
  .delete-form,
  .col-control {
    float: right;
  }
}

.teachers p.error {
  color: #FF0069;
}

.teachers ul.errors {
  margin: 0;
  list-style-position: inside !important;
}

.teachers ul.errors li {
  color: #FF0069;
}

.cockpit {
  padding: 5px 15px;
}

.cockpit label {
  font-size: 0.6em;
  margin: 0;
  float: left;
  width: 100%;
  margin-top: 10px;
  margin-bottom: 2px;
}

.cockpit input[type=text] {
  padding: 0.375rem 0.75rem;
}

.cockpit .submit {
  padding-top: 22px;
}

.cockpit .form-group {
  padding: 0;
  margin: 0 10px !important;
}

.cockpit .event-title-cockpit {
  padding-right: 20px;
}

.cockpit-checkbox {
  width: 100%;
  margin: 15px auto;
  position: relative;
  display: block;
}

.cockpit-checkbox input[type=checkbox] {
  width: auto;
  opacity: 0.00000001;
  position: absolute;
  left: 0;
  margin-left: -20px;
}

.cockpit-checkbox label {
  position: relative;
}

.cockpit-checkbox label:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  margin: 4px;
  width: 22px;
  height: 22px;
  transition: transform 0.28s ease;
  border-radius: 3px;
  border: 2px solid #0000E1;
}

.cockpit-checkbox label:after {
  content: "";
  display: block;
  width: 10px;
  height: 5px;
  border-bottom: 2px solid #0000E1;
  border-left: 2px solid #0000E1;
  transform: rotate(-45deg) scale(0);
  transition: transform ease 0.25s;
  will-change: transform;
  position: absolute;
  top: 12px;
  left: 10px;
}

.cockpit-checkbox input[type=checkbox]:checked ~ label::before {
  color: #0000E1;
}

.cockpit-checkbox input[type=checkbox]:checked ~ label::after {
  transform: rotate(-45deg) scale(1);
}

.cockpit-checkbox label {
  min-height: 34px;
  display: block;
  padding-left: 40px;
  margin-bottom: 0;
  font-weight: normal;
  cursor: pointer;
  vertical-align: sub;
}

.cockpit-checkbox label span {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.cockpit-checkbox input[type=checkbox]:focus + label::before {
  outline: 0;
}

.popup-favorites {
  z-index: 20;
}

.popup-favorites .popup-favorites__pinkbox {
  max-width: 620px;
  margin-left: 34px;
  margin-right: 34px;
  background-color: #FFA4CF;
  color: #000000;
}

.popup-favorites .popup-favorites__pinkbox .popup-favorites__content {
  max-width: 620px;
  padding: 22px 24px;
}

@media screen and (min-width: 768px) {
  .popup-favorites .popup-favorites__pinkbox .popup-favorites__content {
    padding: 80px 60px;
  }
}

.popup-favorites .popup-favorites__pinkbox .popup-favorites__content p {
  font-size: 19px;
  line-height: 26px;
}

@media screen and (min-width: 768px) {
  .popup-favorites .popup-favorites__pinkbox .popup-favorites__content {
    font-size: 22px;
    line-height: 28px;
  }
}

.popup-favorites .popup-favorites__pinkbox .popup-favorites__content .popup-favorites__heart svg {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 40px;
  width: 24px;
}

@media screen and (min-width: 768px) {
  .popup-favorites .popup-favorites__pinkbox .popup-favorites__content .popup-favorites__heart svg {
    width: 63px;
  }
}

.popup-favorites .popup-favorites__pinkbox .close-favorites {
  width: 16px;
}

.np-badge-shortinfo-span {
  display: inline-flex;
  background: #bf7903;
  color: #ffffff;
  padding: 1px 4px 3px;
  text-align: center;
  opacity: 1;
  transition: opacity 200ms ease-in-out;
  margin-top: 7px;
}

@media only screen and (min-width: 768px) {
  .np-badge-shortinfo-span {
    padding: 2px 10px 4px;
    line-height: 19px;
  }
}

.search-results {
  padding: 0px 20px;
}

@media only screen and (min-width: 768px) {
  .search-results {
    padding: 0 35px 10px;
  }
}

.filter-item {
  /*
  &#textsearch {
    color: #000000;

    .toggle-button {
      min-width: 200px;

      .filter-lens {
        margin-left: 16px;
        margin-bottom: -4px;
        transition: 200ms ease-in-out;
        transform: translateY(-3px);
        svg {
          width: 13px;
          fill: black;
          stroke-width: 2px;

        }
      }


    }
  }

   */
}

.filter-item#date {
  color: #0000E1;
}

.filter-item#venues {
  color: #39C073;
}

.filter-item#courses {
  color: #9013FE;
}

.filter-item#events {
  color: #02B0A7;
}

.filter-item#age {
  color: #00B8DB;
}

.filter-item#accessibility {
  color: #144D79;
}

.filter-item#textsearch {
  color: #000000;
  position: relative;
  display: inline-block;
}

.filter-item#textsearch input[type=text] {
  background-color: transparent;
  /*font-family: "neutraface-display-titling";*/
  font-size: 0.733rem;
  height: 33px;
  color: #000000;
  border: 2px solid #000000;
  margin-bottom: 0 !important;
  padding: 16px 12px 13px !important;
}

.filter-item#textsearch input[type=text]:focus {
  outline: none;
}

.filter-item#textsearch input[type=text]::-moz-placeholder {
  color: #000000;
  /*font-family: "neutraface-display-titling";*/
}

.filter-item#textsearch input[type=text]::placeholder {
  color: #000000;
  /*font-family: "neutraface-display-titling";*/
}

.filter-item#textsearch input[type=text]:focus::-moz-placeholder {
  color: #777777;
}

.filter-item#textsearch input[type=text]:focus::placeholder {
  color: #777777;
}

.filter-item#textsearch input[type=text]:focus + .search-button .search-icon {
  display: none;
}

.filter-item#textsearch .search-button {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 20px;
  background-color: transparent;
  border: none !important;
  cursor: pointer;
  margin-right: 12px;
}

.filter-item#textsearch .search-button:focus {
  outline: none;
}

.filter-item#textsearch .search-button .search-icon {
  fill: gray;
  width: 16px;
  height: 16px;
  margin: 0 auto;
  display: block;
}

.filter-item#textsearch .search-reset-button {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 20px;
  background-color: transparent;
  border: none !important;
  cursor: pointer;
  margin-right: 38px;
}

.filter-item#textsearch .search-reset-button:focus {
  outline: none;
}

.filter-item#textsearch .search-reset-button .search-icon {
  fill: gray;
  width: 16px;
  height: 16px;
  margin: 0 auto;
  display: block;
}

.filter-item#favorites {
  color: #E00072;
}

#schedule .overlay {
  z-index: 3;
  -webkit-backdrop-filter: none !important;
          backdrop-filter: none !important;
  background-color: rgba(255, 255, 255, 0) !important;
}

#schedule .reset-filter {
  color: #000000;
  background-color: #F3F2F3;
  padding: 0;
  /*margin-top: -6px;*/
  line-height: 0;
  font-size: 14px;
  cursor: pointer;
}

#schedule .reset-filter span {
  padding-top: 18px;
}

#schedule .delete-favorites-bottom {
  color: #FF0069;
  background-color: transparent;
  padding: 0 0 1rem 0;
  margin-top: -6px;
  text-align: center;
}

#schedule .delete-favorites-bottom span {
  padding-top: 18px;
}

#filter-bar {
  background-color: #F3F2F3;
  padding: 0 15px 18px 15px;
  z-index: 12;
  /*margin-top:18px;*/
}

@media only screen and (min-width: 1024px) {
  #filter-bar {
    z-index: 4;
    padding: 0 35px 18px;
  }

  #filter-bar .filter-toggle__container {
    /*padding-bottom:18px;*/
  }
}

#filter-bar #textsearch-field {
  width: 172px;
}

#filter-bar .filter-toggle__container {
  /*padding-bottom:17px;*/
}

#filter-bar .filter-toggle__container .filter-item {
  margin: 0;
}

@media only screen and (min-width: 1024px) {
  #filter-bar .filter-toggle__container .filter-item {
    margin: 18px 1rem 6px 0;
  }
}

#filter-bar .filter-toggle__container .actions {
  margin-top: 18px;
  row-gap: 4px;
  -moz-column-gap: 0px;
       column-gap: 0px;
  min-width: 190px;
  max-width: 300px;
}

@media only screen and (min-width: 1024px) {
  #filter-bar .filter-toggle__container .actions {
    min-width: 270px;
    max-width: 360px;
  }
}

#filter-bar .filter-toggle__container .actions button {
  font-family: "Maax Regular";
  font-size: 0.6rem;
  font-weight: normal;
  color: #000000;
  background-color: transparent;
  border: none;
  padding: 0;
  border-radius: 0 !important;
  border: none !important;
}

#filter-bar .first-row {
  padding-top: 17px;
}

@media only screen and (min-width: 1024px) {
  #filter-bar .first-row {
    padding-top: 18px;
  }
}

#filter-bar #filter-toggle {
  color: #000000;
  margin-top: 18px;
}

#filter-bar #filter-toggle.open {
  color: #0000E1;
}

#filter-bar #filter-toggle button {
  font-size: 0.733rem;
  height: 33px;
  color: #000000;
  background-color: transparent;
  border: 2px solid currentColor;
  border-radius: 21px;
  padding: 6px 10px 6px;
}

#filter-bar #filter-toggle button .button-title {
  color: #000000;
  font-family: "Maax Medium";
  margin-bottom: 2px;
}

@media only screen and (min-width: 1024px) {
  #filter-bar #filter-toggle button .button-title {
    margin-bottom: -2px;
  }
}

#filter-bar #filter-toggle.open {
  color: #0000E1;
}

#filter-bar #filter-toggle.open button {
  color: #0000E1;
  background-color: #0000E1;
}

#filter-bar #filter-toggle.open button .button-title {
  color: #ffffff;
}

#filter-bar #filter-toggle.mobile .button-title {
  font-size: 18px;
}

#filter-bar .filter-group {
  position: relative;
  transition: background-color 300ms, color 300ms;
}

@media only screen and (min-width: 1024px) {
  #filter-bar .filter-group {
    margin: 0 10px 0 0;
  }
}

@media only screen and (min-width: 1070px) {
  #filter-bar .filter-group {
    margin: 0;
  }
}

#filter-bar .filter-group #textsearch-field {
  font-family: "Maax Medium";
  font-size: 20px;
  line-height: 0;
  margin-bottom: 5px;
  border-radius: 55px;
  background-color: transparent;
  margin-bottom: 0 !important;
  padding-top: 10px !important;
}

#filter-bar .filter-group #textsearch-field::-moz-placeholder {
  font-family: "Maax Medium";
  font-size: 20px;
  line-height: 0;
  margin-bottom: 5px;
}

#filter-bar .filter-group #textsearch-field::placeholder {
  font-family: "Maax Medium";
  font-size: 20px;
  line-height: 0;
  margin-bottom: 5px;
}

#filter-bar .filter-group button.toggle-button {
  padding: 16px 12px 13px;
  border-radius: 55px;
}

#filter-bar .filter-group button.toggle-button .button-title {
  font-family: "Maax Medium";
  font-size: 20px;
  line-height: 0;
  margin-bottom: 5px;
}

#filter-bar .filter-group button.toggle-button .filter-chevron {
  margin-left: 16px;
  margin-bottom: -4px;
  transition: 200ms ease-in-out;
  transform: translateY(-3px);
}

#filter-bar .filter-group button.toggle-button .filter-chevron svg {
  width: 13px;
  fill: none;
  stroke-width: 2px;
}

#filter-bar .filter-group .filter-item {
  margin: 0;
}

#filter-bar .filter-group .filter-item#filter-toggle {
  margin: 0;
}

#filter-bar .filter-group .filter-item * {
  stroke: currentColor !important;
}

@media only screen and (min-width: 1024px) {
  #filter-bar .filter-group .filter-item {
    margin: 0 1rem 6px 0;
  }
}

#filter-bar .filter-group .filter-item button {
  font-size: 0.733rem;
  height: 33px;
  color: currentColor;
  border: 2px solid currentColor;
}

#filter-bar .filter-group .filter-item button .filter-chevron {
  transition: transform 200ms ease-in-out;
}

#filter-bar .filter-group .filter-item button.filter-active {
  background-color: currentColor;
}

#filter-bar .filter-group .filter-item button.filter-active .filter-chevron {
  color: #ffffff;
}

#filter-bar .filter-group .filter-item button.filter-active .filter-chevron svg {
  transform: rotate(180deg);
  transition: transform 200ms ease-in-out;
}

#filter-bar .filter-group .filter-item button.filter-active .button-title {
  color: #ffffff !important;
}

#filter-bar .filter-group .filter-item button.filter-active * {
  stroke: #ffffff;
}

#filter-bar .filter-group .filter-item .pretty.p-default input:checked ~ .state label:after {
  background-color: currentColor !important;
}

#filter-bar .filter-group .filter-options-container {
  overflow-y: auto;
  border: 2px solid currentColor;
  color: currentColor;
  z-index: 1;
  top: 50px;
  padding: 0 20px 0;
  background-color: #ffffff;
  position: absolute;
  left: -20px;
  right: -20px;
  margin: 0 10px;
}

@media only screen and (min-width: 1024px) {
  #filter-bar .filter-group .filter-options-container {
    max-height: 70vh;
    min-width: 390px;
    position: absolute;
    top: 55px;
    left: -10px;
    padding: 40px;
    border-radius: 20px;
  }
}

#filter-bar .filter-group .filter-options-container .filter-option {
  cursor: pointer;
  padding-bottom: 20px;
}

#filter-bar .filter-group .filter-options-container .filter-option:first-child {
  margin-top: 2px;
}

#filter-bar .filter-group .filter-options-container .filter-option .pretty {
  margin-right: 0.5em;
  font-size: 20px;
  white-space: inherit;
  width: 100%;
}

#filter-bar .filter-group .filter-options-container .filter-option .pretty .state label {
  text-indent: 0;
  padding-left: 2.2rem;
  line-height: 20px;
}

#filter-bar .filter-group .filter-options-container .filter-option .pretty .state label div {
  margin-top: 0;
}

#filter-bar .filter-group .filter-options-container .filter-option .pretty .state label:after,
#filter-bar .filter-group .filter-options-container .filter-option .pretty .state label:before {
  top: 0;
}

#filter-bar .filter-group .filter-options-container .apply-filter {
  text-align: center;
  text-align: -webkit-center;
}

#filter-bar .filter-group .filter-options-container .apply-filter button {
  border-radius: 21px;
  padding: 6px 10px 6px;
  line-height: 0.2;
  height: 38px;
  margin: 10px;
}

#filter-bar .filter-group .filter-options-container .toggle-favorites {
  margin-right: 1rem;
}

#filter-bar .filter-group .filter-options-container .filter-options-wrapper {
  overflow-y: scroll;
}

#filter-bar .filter-group .filter-mobile {
  position: absolute;
  top: 85px;
  left: 0;
  width: calc(100vw - 30px);
  background-color: #ffffff;
  border: 2px solid #0000E1;
  padding: 20px;
  overflow: scroll;
  height: 60vh;
}

#filter-bar .filter-group .filter-mobile * {
  stroke: currentColor !important;
}

#filter-bar .filter-group .filter-mobile #textsearch.filter-item {
  margin-bottom: 0 !important;
  margin: 0;
}

#filter-bar .filter-group .filter-mobile #textsearch.filter-item #textsearch-field-mobile {
  padding: 18px 19px 17px !important;
}

#filter-bar .filter-group .filter-mobile #textsearch.filter-item .search-button,
#filter-bar .filter-group .filter-mobile #textsearch.filter-item .search-reset-button {
  top: 12px;
}

#filter-bar .filter-group .filter-mobile .filter-toggle {
  border: 2px solid currentColor;
  width: 100%;
  margin: 10px 0 0 0;
  cursor: pointer;
}

#filter-bar .filter-group .filter-mobile .filter-toggle__title,
#filter-bar .filter-group .filter-mobile .filter-toggle .favorites {
  /*font-family: 'neutraface-display-titling';*/
  padding: 5px 20px;
}

#filter-bar .filter-group .filter-mobile .filter-toggle__title svg,
#filter-bar .filter-group .filter-mobile .filter-toggle .favorites svg {
  height: 1rem;
}

#filter-bar .filter-group .filter-mobile .filter-toggle .favorites svg {
  margin-right: -8px;
}

#filter-bar .filter-group .filter-mobile .filter-options-container {
  position: relative;
  top: 0;
  left: 0;
  background: unset;
  border: unset;
  width: 100%;
}

#filter-bar .filter-group .filter-menu {
  margin: 20px 0 40px 0;
}

@media only screen and (min-width: 1024px) {
  #filter-bar .filter-group .filter-menu {
    margin: 0;
  }
}

#filter-bar .filter-group .filter-menu + .filter-menu {
  margin: 20px 0 0 0;
}

@media only screen and (min-width: 1024px) {
  #filter-bar .filter-group .filter-menu + .filter-menu {
    margin: 0;
  }
}

#filter-bar .filter-group .filter-toggle {
  border-radius: 30px;
  font-size: 0.733rem;
  line-height: 0;
}

#filter-bar .filter-group .filter-toggle.filter-active {
  padding-bottom: 13px;
}

#filter-bar .filter-group .filter-toggle.filter-active .filter-chevron {
  transform: rotate(180deg);
  transition: 200ms ease-in-out;
  transform-origin: center center;
}

@media only screen and (min-width: 1024px) {
  #filter-bar .filter-group .filter-toggle.filter-active .filter-chevron {
    color: #ffffff;
    transform-origin: 50% 31%;
  }
}

#filter-bar .filter-group .filter-toggle.maintoggle {
  margin: 0 10px 0 0;
}

#filter-bar .filter-group .filter-toggle.maintoggle:last-of-type {
  margin: 0 0 0 0;
}

@media only screen and (min-width: 1024px) {
  #filter-bar .filter-group .filter-toggle.maintoggle {
    margin: 0 30px 0 0;
  }
}

#filter-bar .filter-group .filter-toggle.filter-favorites svg {
  height: 1rem;
}

#filter-bar .filter-group.filter-deactivated .filter-toggle {
  color: rgb(191, 203, 217);
  border: 2px solid rgb(191, 203, 217) !important;
}

#filter-bar .filter-group.filter-deactivated .filter-toggle * {
  stroke: rgb(191, 203, 217);
}

#filter-bar .filter-group.filter-deactivated .filter-toggle.filter-inactive .filter-chevron {
  transform: rotate(0deg);
  transition: 200ms ease-in-out;
}

#filter-bar .filter-group #what .filter-option.events {
  color: #02B0A7;
}

#filter-bar .filter-group #what .filter-option.courses {
  color: #9013FE;
}

#filter-bar .filter-group #what .filter-options-container {
  padding: 0;
  border: none;
  max-height: none;
  overflow: hidden;
}

#filter-bar .filter-group #what .gradient-border-container {
  position: relative;
  padding: 1px;
}

#filter-bar .filter-group #what .gradient-border-container:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: linear-gradient(to right, #9013FE, #02B0A7);
  z-index: -1;
  border-radius: inherit;
}

#filter-bar .filter-group #what .gradient-border-container .filter-options-container--content {
  background: #fff;
  position: relative;
  background-clip: padding-box;
  border: solid 1px transparent;
  padding: 20px;
  max-height: 70vh;
  overflow-y: auto;
}

@media only screen and (min-width: 1024px) {
  #filter-bar .filter-group #what .gradient-border-container .filter-options-container--content {
    padding: 40px;
    border-radius: 20px;
  }
}

#filter-bar .filter-group #what.filter-item .toggle-button {
  font-size: 0.733rem;
  height: 33px;
  padding: 16px 12px 13px;
  position: relative;
  box-sizing: border-box;
  color: #9013FE;
  background: #f3f2f3;
  background-clip: padding-box;
  border: solid 2px transparent;
  border-radius: 55px;
}

#filter-bar .filter-group #what.filter-item .toggle-button.closefilter-button {
  background-color: transparent;
  border-color: #9013FE;
}

#filter-bar .filter-group #what.filter-item .toggle-button .filter-chevron svg {
  color: #02B0A7 !important;
  stroke: #02B0A7 !important;
}

#filter-bar .filter-group #what.filter-item .toggle-button:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  margin: -2px;
  border-radius: inherit;
  background: linear-gradient(to right, #9013FE, #02B0A7);
}

#filter-bar .filter-group #what.filter-item .toggle-button.filter-active {
  border: none;
  padding: 16px 14px 13px;
  background: linear-gradient(to right, #9013FE, #02B0A7);
}

#filter-bar .filter-group #what.filter-item .toggle-button.filter-active:before {
  margin: 0;
}

#filter-bar .filter-group #what.filter-item .toggle-button.filter-active .filter-chevron svg {
  color: #fff !important;
  stroke: #fff !important;
}

#filter-bar .active-filters-group--single-filter {
  margin-bottom: 6px;
  cursor: pointer;
  background-color: transparent;
  margin-right: 6px;
  border-radius: 21px;
  padding: 2px 6px;
}

#filter-bar .active-filters-group--single-filter.events, #filter-bar .active-filters-group--single-filter.formats {
  border: 2px solid #02B0A7;
}

#filter-bar .active-filters-group--single-filter.events span, #filter-bar .active-filters-group--single-filter.formats span {
  color: #02B0A7;
}

#filter-bar .active-filters-group--single-filter.events button, #filter-bar .active-filters-group--single-filter.formats button {
  fill: #02B0A7;
}

#filter-bar .active-filters-group--single-filter.courses, #filter-bar .active-filters-group--single-filter.styles {
  border: 2px solid #9013FE;
}

#filter-bar .active-filters-group--single-filter.courses span, #filter-bar .active-filters-group--single-filter.styles span {
  color: #9013FE;
}

#filter-bar .active-filters-group--single-filter.courses button, #filter-bar .active-filters-group--single-filter.styles button {
  fill: #9013FE;
}

#filter-bar .active-filters-group--single-filter.dates {
  border: 2px solid #0000E1;
}

#filter-bar .active-filters-group--single-filter.dates span {
  color: #0000E1;
}

#filter-bar .active-filters-group--single-filter.dates button {
  fill: #0000E1;
}

#filter-bar .active-filters-group--single-filter.venues {
  border: 2px solid #39C073;
}

#filter-bar .active-filters-group--single-filter.venues span {
  color: #39C073;
}

#filter-bar .active-filters-group--single-filter.venues button {
  fill: #39C073;
}

#filter-bar .active-filters-group--single-filter.agegroups {
  border: 2px solid #00B8DB;
}

#filter-bar .active-filters-group--single-filter.agegroups span {
  color: #00B8DB;
}

#filter-bar .active-filters-group--single-filter.agegroups button {
  fill: #00B8DB;
}

#filter-bar .active-filters-group--single-filter.accessibility {
  border: 2px solid #144D79;
}

#filter-bar .active-filters-group--single-filter.accessibility span {
  color: #144D79;
}

#filter-bar .active-filters-group--single-filter.accessibility button {
  fill: #144D79;
}

#filter-bar .active-filters-group--single-filter span {
  font-size: 0.8rem;
  line-height: 0.8rem;
}

#filter-bar .active-filters-group--single-filter button {
  width: 0.7rem;
  margin-left: 6px;
}

#filter-bar #mobile-filter-overlay {
  padding: 18px;
  overflow-y: scroll;
}

#filter-bar #mobile-filter-overlay #filter-close,
#filter-bar #mobile-filter-overlay #filter-close-mobile {
  color: #0000E1;
}

#filter-bar #mobile-filter-overlay #filter-close button,
#filter-bar #mobile-filter-overlay #filter-close-mobile button {
  color: #0000E1;
  background-color: #0000E1;
  font-size: 18px;
  height: 33px;
  border: 2px solid #0000E1;
  border-radius: 21px;
  padding: 6px 10px 6px;
}

#filter-bar #mobile-filter-overlay #filter-close button .button-title,
#filter-bar #mobile-filter-overlay #filter-close-mobile button .button-title {
  color: #ffffff;
  margin-bottom: 2px;
}

#filter-bar #mobile-filter-overlay #filter-close-mobile {
  margin-top: 20px;
  text-align: center;
}

#filter-bar #mobile-filter-overlay #textsearchMobile {
  margin-top: 12px;
  width: 166px;
  color: #000000;
  position: relative;
  display: inline-block;
}

#filter-bar #mobile-filter-overlay #textsearchMobile input[type=text] {
  background-color: transparent;
  font-family: "Maax Medium";
  font-size: 18px;
  height: 33px;
  color: #000000;
  border: 2px solid #000000;
  margin-bottom: 2px !important;
  border-radius: 20px;
  padding: 15px 12px 16px !important;
}

#filter-bar #mobile-filter-overlay #textsearchMobile input[type=text]:focus {
  outline: none;
}

#filter-bar #mobile-filter-overlay #textsearchMobile input[type=text]::-moz-placeholder {
  color: #000000;
  /*font-family: "neutraface-display-titling";*/
}

#filter-bar #mobile-filter-overlay #textsearchMobile input[type=text]::placeholder {
  color: #000000;
  /*font-family: "neutraface-display-titling";*/
}

#filter-bar #mobile-filter-overlay #textsearchMobile input[type=text]:focus::-moz-placeholder {
  color: #777777;
}

#filter-bar #mobile-filter-overlay #textsearchMobile input[type=text]:focus::placeholder {
  color: #777777;
}

#filter-bar #mobile-filter-overlay #textsearchMobile input[type=text]:focus + .search-button .search-icon {
  display: none;
}

#filter-bar #mobile-filter-overlay #textsearchMobile .search-button {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 20px;
  background-color: transparent;
  border: none !important;
  cursor: pointer;
  margin-right: 12px;
}

#filter-bar #mobile-filter-overlay #textsearchMobile .search-button:focus {
  outline: none;
}

#filter-bar #mobile-filter-overlay #textsearchMobile .search-button .search-icon {
  fill: gray;
  width: 16px;
  height: 16px;
  margin: 0 auto;
  display: block;
}

#filter-bar #mobile-filter-overlay #textsearchMobile .search-reset-button {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 20px;
  background-color: transparent;
  border: none !important;
  cursor: pointer;
  margin-right: 38px;
}

#filter-bar #mobile-filter-overlay #textsearchMobile .search-reset-button:focus {
  outline: none;
}

#filter-bar #mobile-filter-overlay #textsearchMobile .search-reset-button .search-icon {
  fill: gray;
  width: 16px;
  height: 16px;
  margin: 0 auto;
  display: block;
}

#filter-bar #mobile-filter-overlay .reset-filter {
  color: #000000;
  background-color: transparent;
  padding: 0;
  text-align: center;
  margin: 20px 20px 0 20px;
  font-size: 14px;
}

#filter-bar #mobile-filter-overlay .filter-mobile {
  /*
  position: absolute;
  top: 85px;
  left: 0;
  width: calc(100vw - 30px);
  background-color: #ffffff;
  padding: 18px;
  height: 60vh;
  */
  overflow: scroll;
}

#filter-bar #mobile-filter-overlay .filter-mobile * {
  stroke: currentColor !important;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-item#what {
  color: #9013FE;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-toggle {
  border: 2px solid currentColor;
  width: 100%;
  margin: 10px 0 0 0;
  cursor: pointer;
  border-radius: 20px;
  font-size: 18px;
  line-height: 0;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-toggle.filter-active {
  padding-bottom: 13px;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-toggle.filter-active .filter-chevron {
  transform: rotate(180deg);
  transition: 200ms ease-in-out;
  transform-origin: center center;
}

@media only screen and (min-width: 1024px) {
  #filter-bar #mobile-filter-overlay .filter-mobile .filter-toggle.filter-active .filter-chevron {
    color: #ffffff;
    transform-origin: 50% 31%;
  }
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-toggle__title,
#filter-bar #mobile-filter-overlay .filter-mobile .filter-toggle .favorites {
  /* font-family: 'neutraface-display-titling';*/
  padding: 4px 20px;
  min-height: 30px;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-toggle__title svg,
#filter-bar #mobile-filter-overlay .filter-mobile .filter-toggle .favorites svg {
  height: 1rem;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-toggle .favorites svg {
  margin-right: -8px;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-toggle .button-title {
  margin-bottom: 2px;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-options-container {
  overflow-y: scroll;
  /*border: 2px solid currentColor;*/
  color: currentColor;
  z-index: 1;
  /*top: 50px;*/
  padding: 0 20px 0;
  /*background-color: #ffffff;*/
  /*position: absolute;*/
  position: relative;
  left: 0;
  right: -20px;
  margin: 0 20px;
}

@media only screen and (min-width: 1024px) {
  #filter-bar #mobile-filter-overlay .filter-mobile .filter-options-container {
    max-height: 70vh;
    min-width: 390px;
    position: absolute;
    top: 55px;
    left: -10px;
    padding: 40px;
    border-radius: 0;
  }
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-options-container .filter-option {
  cursor: pointer;
  /*padding-bottom: 20px;*/
  padding-bottom: 14px;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-options-container .filter-option.events {
  color: #02B0A7;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-options-container .filter-option.courses {
  color: #9013FE;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-options-container .filter-option.subfilter {
  margin-left: 1rem;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-options-container .filter-option:first-child {
  margin-top: 2px;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-options-container .filter-option .pretty {
  margin-right: 0.5em;
  font-size: 16px;
  white-space: inherit;
  width: 100%;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-options-container .filter-option .pretty .state label {
  text-indent: 0;
  padding-left: 2rem;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-options-container .filter-option .pretty .state label div {
  /*margin-top: 3px;*/
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-options-container .filter-option .pretty .state label:after,
#filter-bar #mobile-filter-overlay .filter-mobile .filter-options-container .filter-option .pretty .state label:before {
  top: 0;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-options-container .apply-filter {
  text-align: center;
  text-align: -webkit-center;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-options-container .apply-filter button {
  border-radius: 21px;
  padding: 6px 10px 6px;
  line-height: 0.2;
  height: 38px;
  margin: 10px;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-options-container .toggle-favorites {
  margin-right: 1rem;
}

#filter-bar #mobile-filter-overlay .filter-mobile .filter-options-container .filter-options-wrapper {
  overflow-y: scroll;
}

#filter-bar #mobile-filter-overlay .button-title .button-title--text {
  line-height: 1rem;
  margin-bottom: -2px;
}

#filter-bar #mobile-filter-overlay .pill-counter {
  margin-top: 0;
  margin-bottom: -2px;
}

#filter-bar .pill-counter {
  min-width: 21px;
  text-align: center;
  /*font-family: 'neutraface-text-book';*/
  padding: 11px 7px;
  font-size: 13px;
  margin-left: 6px;
  margin-top: -2px;
  line-height: 0;
}

#filter-bar .pill-counter.pill-counter-what {
  background-color: #9013FE;
}

#filter-bar .pill-counter.pill-counter-total, #filter-bar .pill-counter.pill-counter-dates {
  background-color: #0000E1;
}

#filter-bar .pill-counter.pill-counter-venues {
  background-color: #39C073;
}

#filter-bar .pill-counter.pill-counter-age {
  background-color: #00B8DB;
}

#filter-bar .pill-counter.pill-counter-accessibility {
  background-color: #144D79;
}

article.media-highlights section.highlights-wrapper {
  margin-top: 71px;
}

article.media-highlights section.highlights-wrapper .highlight {
  padding-top: 60px;
  padding-bottom: 60px;
}

article.media-highlights section.highlights-wrapper .highlight .highlight-container .highlights {
  margin-top: 11px;
  padding: unset;
}

article.media-highlights section.highlights-wrapper .highlight figcaption {
  margin-bottom: 5px;
  margin-top: 5px;
}

@media screen and (min-width: 768px) {
  article.media-highlights section.highlights-wrapper .highlight figcaption {
    margin-top: 13px;
  }
}

article.media-highlights section.highlights-wrapper .highlight .programm-link {
  margin-top: 60px;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(1) {
  background-color: #5deb90;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(2) {
  background-color: #b7c8f6;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(3) {
  background-color: #eeabab;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(4) {
  background-color: #f6ecb7;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(5) {
  background-color: #b7ddf6;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(6) {
  background-color: #eeabec;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(7) {
  background-color: #e7eeab;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(8) {
  background-color: #b7f6eb;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(8) {
  background-color: #cdbbf4;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(9) {
  background-color: #eca0b0;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(10) {
  background-color: #5deb90;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(11) {
  background-color: #b7c8f6;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(12) {
  background-color: #eeabab;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(13) {
  background-color: #f6ecb7;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(14) {
  background-color: #b7ddf6;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(15) {
  background-color: #eeabec;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(16) {
  background-color: #e7eeab;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(17) {
  background-color: #b7f6eb;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(18) {
  background-color: #cdbbf4;
}

article.media-highlights section.highlights-wrapper .highlight:nth-child(19) {
  background-color: #eca0b0;
}

section.teachers {
  padding-top: 100px;
}

section.teachers .region {
  padding-top: 0;
}

section.teachers .region .city {
  padding: 0;
}

section.teachers .region .city .course {
  padding: 5px 0;
  border-top: 1px solid #ccc;
  border-bottom: 0 solid #ccc;
}

section.teachers .form-group {
  margin-bottom: 3rem;
}

section.teachers .form-group label {
  font-size: 0.9em;
  font-weight: bold;
  margin: 0;
}

section.teachers .form-group ul.errors {
  margin: 0;
  list-style-position: inside !important;
}

section.teachers .form-group ul.errors li {
  color: #FF0069;
}

section.teachers .form-group .chars-left {
  margin: -24px 7px 0 0;
  float: right;
  position: relative;
  color: #b9bfc6;
  font-size: 0.8em;
}

.c-event-timetable-list {
  font-family: "Maax Medium";
  overflow: auto;
  padding-top: 15px;
  margin-left: -20px;
  margin-right: -20px;
  margin-bottom: 15px;
}

@media only screen and (min-width: 768px) {
  .c-event-timetable-list {
    margin-left: 0;
    margin-right: 0;
  }
}

@media only screen and (min-width: 1024px) {
  .c-event-timetable-list {
    line-height: 15px;
  }
}

.c-event-timetable-list .timetable {
  min-width: 1920px;
  padding-right: 20px;
  position: relative;
}

@media only screen and (min-width: 1024px) {
  .c-event-timetable-list .timetable {
    width: 100%;
    min-width: 1920px;
    padding-right: 35px;
  }
}

.c-event-timetable-list .venue-col {
  width: calc((100% - 20px) / 16 + 20px);
  position: sticky;
  left: 0;
  padding-left: 20px;
  background-color: #fff;
  z-index: 1;
}

@media only screen and (min-width: 1024px) {
  .c-event-timetable-list .venue-col {
    width: calc((100% - 35px) / 16 + 35px);
    padding-left: 35px;
  }
}

.c-event-timetable-list .timetable-row {
  width: 100%;
  display: flex;
}

.c-event-timetable-list .timeline-col {
  flex-grow: 1;
}

.c-event-timetable-list .timetable-grid-row {
  height: 100%;
  position: absolute;
  left: 0;
  right: 20px;
  width: auto;
}

@media only screen and (min-width: 1024px) {
  .c-event-timetable-list .timetable-grid-row {
    right: 35px;
  }
}

.c-event-timetable-list .timetable-grid-row .timeline-grid-col {
  flex-grow: 1;
}

.c-event-timetable-list .timetable-grid-row .timeline-grid-col:nth-child(odd) {
  background-color: #f3f2f3;
}

.c-event-timetable-list .time-table-header-row {
  transition: top 10ms linear;
  z-index: 2;
}

@media only print {
  .c-event-timetable-list .time-table-header-row {
    position: static !important;
    top: 0 !important;
  }
}

@media only screen {
  .c-event-timetable-list .time-table-header-row[style]:before {
    content: "";
    width: 100%;
    height: 50px;
    background-color: #FFF;
    position: absolute;
    top: -50px;
  }
}

.c-event-timetable-list .time-table-header-row .venue-col,
.c-event-timetable-list .time-table-header-row .timeline-col .hour {
  padding-top: 8px;
  padding-bottom: 8px;
  font-size: 12px;
  line-height: 15px;
}

.c-event-timetable-list .time-table-header-row .timeline-col {
  position: relative;
}

.c-event-timetable-list .time-table-header-row .timeline-col .hour {
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
}

.c-event-timetable-list .time-table-header-row .timeline-col .hour:nth-child(odd) {
  background-color: #F3F2F3;
}

.c-event-timetable-list .time-table-header-row .timeline-col .hour:nth-child(even) {
  background-color: #FFF;
}

.c-event-timetable-list .venue-timetable-row {
  position: relative;
  width: 100%;
}

.c-event-timetable-list .venue-timetable-row .venue-col {
  display: flex;
  flex-direction: column;
  justify-content: start;
  padding-bottom: 5px;
}

.c-event-timetable-list .venue-timetable-row .venue-col .venue {
  font-size: 12px;
  line-height: 15px;
  /*font-family: "neutraface-text-book";*/
  text-transform: none;
  padding-top: 10px;
  max-height: 46px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  padding-right: 10px;
}

.c-event-timetable-list .venue-timetable-row .venue-col .venue.rowspan-2 {
  max-height: 70px;
  -webkit-line-clamp: 4;
}

.c-event-timetable-list .venue-timetable-row .venue-col .venue.rowspan-3 {
  max-height: 100px;
  -webkit-line-clamp: 6;
}

.c-event-timetable-list .venue-timetable-row .venue-col .venue.rowspan-4 {
  max-height: 130px;
  -webkit-line-clamp: 8;
}

@media only screen and (max-width: 1024px) {
  .c-event-timetable-list .venue-timetable-row .venue-col .venue {
    /*max-height: 2 * $mobile-line-height + 16px;*/
    max-height: none;
  }

  .c-event-timetable-list .venue-timetable-row .venue-col .venue.rowspan-2 {
    /*max-height: 4 * $mobile-line-height + 16px;*/
    max-height: none;
  }

  .c-event-timetable-list .venue-timetable-row .venue-col .venue.rowspan-3 {
    /*max-height: 6 * $mobile-line-height + 16px;*/
    max-height: none;
  }

  .c-event-timetable-list .venue-timetable-row .venue-col .venue.rowspan-4 {
    /*max-height: 8 * $mobile-line-height + 16px;*/
    max-height: none;
  }
}

.c-event-timetable-list .venue-timetable-row:last-child .venue-col {
  padding-bottom: 25px;
}

.c-event-timetable-list .venue-timetable-row:last-child .timeline-col {
  padding-bottom: 20px;
}

.c-event-timetable-list .venue-timetable-row .timeline-col .timeline {
  position: relative;
  height: 55px;
  padding-bottom: 5px;
}

@media only screen and (max-width: 1024px) {
  .c-event-timetable-list .venue-timetable-row .timeline-col .timeline {
    height: 49px;
  }
}

.c-event-timetable-list .venue-timetable-row .timeline-col .timeline .timeline-item {
  position: absolute;
  padding-left: 1px;
  padding-right: 1px;
  height: 50px;
}

@media only screen and (max-width: 1024px) {
  .c-event-timetable-list .venue-timetable-row .timeline-col .timeline .timeline-item {
    height: 44px;
  }
}

.c-event-timetable-list .venue-timetable-row .timeline-col .timeline .timeline-item-inner {
  display: flex;
  align-items: center;
  border-radius: 10px;
  height: 100%;
  overflow: hidden;
  width: 100%;
  padding: 10px 6px;
  background-color: #000000;
  color: #fff;
}

.c-event-timetable-list .venue-timetable-row .timeline-col .timeline .timeline-item.item-type-events .timeline-item-inner, .c-event-timetable-list .venue-timetable-row .timeline-col .timeline .timeline-item.item-type-metaEvent .timeline-item-inner {
  background-color: #02B0A7;
}

.c-event-timetable-list .venue-timetable-row .timeline-col .timeline .timeline-item.item-type-courses .timeline-item-inner {
  background-color: #9013FE;
}

.c-event-timetable-list .venue-timetable-row .timeline-col .timeline .timeline-item-text {
  font-size: 12px;
  line-height: 15px;
  margin-bottom: 0;
  display: -webkit-box;
  /*font-family: 'neutraface-text-bold';*/
  text-transform: none;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-hyphens: auto;
          hyphens: auto;
  max-height: 30px;
  margin-right: 0.15rem;
}

@media only screen and (max-width: 1024px) {
  .c-event-timetable-list .venue-timetable-row .timeline-col .timeline .timeline-item-text {
    /*max-height: 2 * $mobile-line-height;*/
    max-height: none;
  }
}

.c-event-timetable-list .venue-timetable-row .timeline-col .timeline .timeline-item .save-favorites {
  height: 12px;
  margin-bottom: auto;
}

@media only screen and (max-width: 1024px) {
  .c-event-timetable-list .venue-timetable-row .timeline-col .timeline .timeline-item .save-favorites {
    height: 12px;
  }
}

.c-event-timetable-list .venue-timetable-row .timeline-col .timeline .timeline-item .save-favorites svg {
  height: 100%;
  width: auto;
}

.c-event-timetable-list .venue-timetable-row .timeline-col .timeline .timeline-item .save-favorites svg path {
  stroke: #fff;
}

.c-event-timetable-list .venue-timetable-row .timeline-col .timeline .timeline-item .save-favorites.active svg path {
  fill: #fff;
}

@media print {
  .c-event-timetable-list {
    margin-right: 0;
    margin-left: 0;
    page-break-inside: allowed;
  }

  .c-event-timetable-list,
  .c-event-timetable-list * {
    font-size: 7pt;
    line-height: 8.75pt;
  }

  .c-event-timetable-list .timetable {
    padding-right: 0;
    min-width: 0;
    width: 100%;
  }

  .c-event-timetable-list .venue-col {
    padding-left: 0;
    min-width: 25mm;
    width: 25mm;
  }

  .c-event-timetable-list .timetable-row {
    page-break-before: auto;
    page-break-after: auto;
    page-break-inside: avoid;
  }

  .c-event-timetable-list .timetable-grid-row {
    height: 100%;
    width: 100%;
    position: absolute;
  }

  .c-event-timetable-list .timetable-grid-row .timeline-grid-col {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  .c-event-timetable-list .time-table-header-row {
    page-break-after: avoid;
  }

  .c-event-timetable-list .venue-timetable-row .venue-col {
    padding-top: 2.5pt;
    padding-bottom: 2.5pt !important;
    position: static;
  }

  .c-event-timetable-list .venue-timetable-row .venue-col .venue {
    padding-top: 6pt;
    max-height: 23.5pt;
  }

  .c-event-timetable-list .venue-timetable-row .venue-col .venue.rowspan-2 {
    max-height: 41pt;
  }

  .c-event-timetable-list .venue-timetable-row .venue-col .venue.rowspan-3 {
    max-height: 58.5pt;
  }

  .c-event-timetable-list .venue-timetable-row .venue-col .venue.rowspan-4 {
    max-height: 76pt;
  }

  .c-event-timetable-list .venue-timetable-row .timeline-col {
    position: relative;
    flex-grow: 1;
    flex-shrink: 0;
    min-width: 210mm;
    background-image: none !important;
  }

  .c-event-timetable-list .venue-timetable-row .timeline-col .timeline {
    position: relative;
    height: 29.5pt;
    padding-top: 2pt;
    padding-bottom: 2pt;
  }

  .c-event-timetable-list .venue-timetable-row .timeline-col .timeline .timeline-item {
    height: 25.5pt;
    padding-left: 1pt;
    padding-right: 1pt;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  .c-event-timetable-list .venue-timetable-row .timeline-col .timeline .timeline-item-inner {
    border-radius: 10pt;
    padding: 6pt 6pt;
  }

  .c-event-timetable-list .venue-timetable-row .timeline-col .timeline .timeline-item-text {
    max-height: 17.5pt;
    margin-right: 0 !important;
  }
}

.related-cities-sticker {
  border-radius: 50%;
  width: 133px;
  height: 133px;
  background-color: #9013FE;
  color: #ffffff;
  transform: rotate(15deg);
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  right: 1rem;
  bottom: 1rem;
}

@media screen and (min-width: 1024px) {
  .related-cities-sticker {
    width: 179px;
    height: 179px;
    right: 5rem;
    bottom: 2rem;
  }
}

.related-cities-sticker .related-cities-sticker-content {
  padding: 0 1rem;
  text-align: center;
}

#toggle-past-events {
  /*font-family: "neutraface-text-book";*/
  color: #adadad;
  margin-top: 14px;
}

.toggle-events {
  cursor: pointer;
  font-size: 0.8rem;
  line-height: 1rem;
}

@media screen and (min-width: 768px) {
  .toggle-events {
    font-size: 0.8rem;
    line-height: 1rem;
  }
}

.bluebox {
  align-items: center;
  justify-content: center;
  display: flex;
  max-width: 100%;
  text-align: center;
  background-color: #0000EB;
  color: #fff;
  font-family: "Maax Medium";
  /*font-family: "neutraface-text-bold";*/
  font-size: 1.2rem;
  line-height: 1.4rem;
  padding: 40px;
}

.bluebox .bluebox__text {
  max-width: 600px;
  text-align: left;
}

.bluebox .bluebox__circleButton {
  /*font-family: neutraface-text-book;*/
  margin-top: 50px;
}

.bluebox .bluebox__circleButton div {
  color: #000;
  width: 180px;
  height: 180px;
  transform: rotate(10deg);
}

.bluebox .bluebox__circleButton div p {
  font-size: 0.675rem;
}

@media only screen and (min-width: 1024px) {
  .bluebox {
    font-size: 1.8rem;
    line-height: 2rem;
    padding: 50px;
  }

  .bluebox .bluebox__text {
    max-width: 600px;
  }

  .bluebox .bluebox__text_sm {
    font-size: 1.4rem;
  }

  .bluebox .bluebox__circleButton {
    margin-top: 50px;
  }

  .bluebox .bluebox__circleButton div {
    width: 240px;
    height: 240px;
    transform: rotate(10deg);
  }

  .bluebox .bluebox__circleButton div p {
    font-size: 0.875rem;
  }
}

#app .schedule .past-event {
  color: #848484 !important;
}

.rotate-0 {
  transform: rotate(0deg);
}

.rotate-90 {
  transform: rotate(90deg);
}

.rotate-180 {
  transform: rotate(180deg);
}

.rotate-270 {
  transform: rotate(270deg);
}