html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, input, select {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  vertical-align: baseline;
}

/* remember to define focus styles! */
:focus {
  outline: 0;
}

body {
  line-height: 1;
  color: black;
  background: white;
}

ol, ul {
  list-style: none;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
  border-collapse: separate;
  border-spacing: 0;
}

caption, th, td {
  text-align: left;
  font-weight: normal;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
}

blockquote, q {
  quotes: "" "";
}

@font-face {
  font-family: montserrat;
  src: url(../fonts/Montserrat-Medium.ttf);
  font-weight: normal;
}
@font-face {
  font-family: montserrat;
  src: url(../fonts/Montserrat-Bold.ttf);
  font-weight: bold;
}
@font-face {
  font-family: montserrat;
  src: url(../fonts/Montserrat-Italic.ttf);
  font-style: italic;
}
@font-face {
  font-family: montserrat;
  src: url(../fonts/Montserrat-BoldItalic.ttf);
  font-weight: bold;
  font-style: italic;
}
/*******************************************/
/*
/*  Mixins
*/
.shadow-inset {
  box-shadow: inset 0px 1px 4px rgba(0, 0, 0, 0.25);
}

:root {
  --c-bg: #29104D;
  --c-bg-transparent: rgba(41, 16, 77, 0.9);
  --c-copy: #29104D ;
  --c-white: #ffffff ;
  --c-red: #F06C88;
  --c-green: #33C38E;
  --c-violet: #7900FF;
  --c-corporate: var(--c-red);
  --c-accent: #98989B;
  --c-hellgrau: #eeeeee;
  --c-akzent: var(--accent);
  --c-head: var(--c-corporate);
  --c-correct: var(--c-green);
  --c-wrong: var(--c-red);
  --ff-copy: "montserrat",sans-serif;
  --ff-head: "lores-9-narrow",sans-serif;
  --ff-fixed: "montserrat",sans-serif;
  --fs-copy: 1rem;
  --fs-medium: var(--fs-copy);
  --fs-large: 1.25rem;
  --fs-hl-small: 1.25rem;
  --fs-hl-medium: 1.5rem;
  --fs-hl-large: 2rem;
  --max-width: calc(100vw - 4rem);
  --width-margin: 2rem;
  --article-width: var(--max-width);
  --width-margin-article: calc(50vw - var(--article-width) * 0.5);
  --gap: 1rem;
  --m-vert: 4rem;
  --m-vert-slim: 2rem;
  --m-vert-2x: calc(2 * var(--m-vert));
  --gap-15x: calc(1.5 * var(--gap));
  --gap-2x: calc(2 * var(--gap));
  --gap-3x: calc(3 * var(--gap));
  --gap-4x: calc(4 * var(--gap));
  --gap-6x: calc(6 * var(--gap));
  --gap-7x: calc(7 * var(--gap));
  --gap-8x: calc(8 * var(--gap));
  --radius: 0.25rem;
  --shadow: 0px 25px 40px 0px rgba(0, 0, 0, 0.05);
  --shadow-flat: 0px 2px 10px rgba(0, 0, 0, 0.15);
}
@media (min-width: 1024px) {
  :root {
    --max-width: 960px;
    --width-margin: calc(50vw - var(--max-width) * 0.5);
  }
}
@media (min-width: 1280px) {
  :root {
    --max-width: 60rem;
  }
}
@media (min-width: 1440px) {
  :root {
    --max-width: 72rem;
  }
}
@media (min-width: 1280px) {
  :root {
    --article-width: 55rem;
  }
}
@media (min-width: 1440px) {
  :root {
    --article-width: 1124px;
  }
}
@media (min-width: 768px) {
  :root {
    --gap: 1rem;
  }
}
@media (min-width: 1024px) {
  :root {
    --m-vert: 7.3125rem;
    --m-vert-slim: 5.375rem;
  }
}

div.gap {
  width: var(--gap);
}

div.gap2x {
  width: var(--gap-2x);
}

div.gap4x {
  width: var(--gap-4x);
}

div.m-vert {
  width: var(--m-vert);
}

div.m-vert-slim {
  width: var(--m-vert-slim);
}

div.width-margin {
  width: var(--width-margin);
}

div.article-width {
  width: var(--article-margin);
}

.debug {
  position: fixed;
  z-index: 2015;
  left: 50%;
  bottom: 1em;
  transform: translateX(-50%);
}

.bug.button {
  background: black;
  padding: 0.3em;
  border: solid 2px #00ff00;
}
.bug.button svg {
  margin: 0;
}
.bug.button:hover {
  background: #00ff00 !important;
}
.bug.button:hover svg path {
  fill: black !important;
}

.jump-pad {
  background: rgba(0, 0, 0, 0.8);
  position: fixed;
  z-index: 2015;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  padding: var(--gap-2x);
}
.jump-pad .bug {
  position: fixed;
  z-index: 2015;
  right: 1em;
  top: 1em;
}
.jump-pad .quests {
  margin-top: 2em;
}
.jump-pad .quests p {
  text-transform: uppercase;
  font-weight: bold;
  font-size: var(--fs-large);
}
.jump-pad > div > div {
  cursor: pointer;
  margin-top: 0.5em;
  padding: 0.6em;
  border-radius: var(--radius);
  font-size: 0.8em;
  background-color: #555555;
}
.jump-pad > div > div:hover {
  background: white;
  color: var(--c-corporate);
}
.jump-pad > div > div:not(.RESULT):not(.INFO).answered {
  color: white;
  background-color: var(--c-green);
}
.jump-pad > div > div.RESULT, .jump-pad > div > div.INFO {
  color: white;
  background-color: var(--c-violet);
}

.maxAttributes {
  font-size: 1em;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.5em;
}

#app {
  background: black;
  color: white;
  width: 100vw;
  max-width: 424px;
  height: 100vh;
  max-height: 768px;
  overflow: hidden;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
@media (min-width: 400px) {
  #app {
    border-radius: 0.5em;
  }
}
#app.loaded {
  opacity: 1;
}
#app .screen {
  position: absolute;
  left: 24000px;
  top: var(--gap-2x);
  width: calc(100% - var(--gap-4x));
  height: calc(100% - var(--gap-7x));
  background: var(--c-bg);
  opacity: 0;
  box-shadow: var(--shadow);
  border-radius: var(--radius);
}
#app .screen.show {
  opacity: 1;
  left: var(--gap-2x);
}
#app .screen p.copy {
  color: white;
}
#app .screen .swiper-container {
  overflow: hidden;
}
#app .screen .quests-container {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: var(--radius);
  display: flex;
  flex-direction: column;
}
#app .screen .quests-container .head {
  width: 100%;
  padding-bottom: 40%;
  position: relative;
}
#app .screen .quests-container .head span {
  display: block;
  width: 100%;
  background: var(--c-green);
}
#app .screen .quests-container .head img {
  width: 100%;
  display: flex;
  position: absolute;
  left: 0;
  bottom: 0;
}
#app .screen .quests-container .head > img {
  margin-top: -2%;
}
#app .screen .quests-container .head svg {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
}
#app .screen .quests-container .head .figure {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 86%;
}
#app .screen .quests-container .head .figure .hero__figure {
  display: block;
  left: 50%;
  top: 40%;
  height: 100%;
  transform: none;
}
#app .screen .quests-container .head .figure .glow {
  left: 50%;
  transform: translate(-50%, 0);
  width: 50%;
  height: 20%;
  mix-blend-mode: multiply;
  animation: pulseWidth 1s infinite;
}
#app .screen .quests-container h2 {
  margin: 0.5em 0;
  font-size: var(--fs-large);
}
#app .screen .quests-container:has(.swiper-slide-active._VIDEO) .head, #app .screen .quests-container:has(.swiper-slide-active.RESULT) .head, #app .screen .quests-container:has(.swiper-slide-active.BREAKDOWN) .head {
  display: none;
}
#app .screen .quests-container .quests {
  flex-grow: 1;
  width: 100%;
}
#app .screen .quests-container .quests .quest:not(.VIDEO) {
  padding: var(--gap) var(--gap) calc(6 * var(--gap));
  overflow-y: auto;
}
#app .screen .quests-container .quests:has(.swiper-slide-active.VIDEO) {
  top: 0;
  height: 100%;
}
#app .screen .quests-container:has(video.playing) .OFFnav {
  display: none;
}
#app .screen .quests-container .swiper-pagination {
  position: absolute;
  z-index: 1987;
  bottom: -0.5em;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
#app .screen .quests-container .swiper-pagination span {
  display: block;
  width: 0.5em;
  height: 0.5em;
  border-radius: 50%;
  background: var(--c-green);
  margin: 0.2em;
}
#app .screen .quests-container .swiper-pagination span.swiper-pagination-bullet-active {
  background: var(--c-white);
}
#app .screen .quests-container .swiper-pagination span.RESULT {
  background: var(--c-red);
}
#app .screen .screen-footer {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  padding: var(--gap-2x) var(--gap) var(--gap);
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 50%);
  color: var(--c-white);
}
#app .nav {
  position: fixed;
  z-index: 1986;
  bottom: calc(1 * var(--gap));
  left: var(--gap);
  width: calc(100% - var(--gap-2x));
  display: flex;
  justify-content: space-between;
}
#app .nav .swiper-button-disabled {
  opacity: 0;
  pointer-events: none;
}

.modules__wrapper {
  height: 100%;
  width: 100%;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}
.modules__map {
  width: 100%;
  height: 100%;
  min-height: 100%;
  max-height: 100vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.modules__map_top {
  position: relative;
  z-index: 200;
  padding: var(--gap-4x) var(--gap-2x) var(--gap-2x);
  background: url(../images/mapmask.png) center top;
  background-size: 100% 100%;
  text-align: center;
}
.modules__map_top .title {
  top: 0 !important;
  left: var(--gap) !important;
  width: calc(100% - 2 * var(--gap)) !important;
}
.modules__map_top p {
  margin-bottom: 0.5em !important;
  color: var(--c-red);
}
.modules__map_top h2 {
  margin-top: 0 !important;
  color: var(--c-red);
  height: 2.4em;
}
.modules__map .hero__figure {
  width: 48px;
}
.modules__map_modules {
  position: relative;
  flex-grow: 1;
  overflow-y: auto;
  margin-top: -50px;
}
.modules__map_modules > div {
  position: relative;
  padding-top: 200px;
  width: 100%;
  background: url(../images/mapbg.jpg) no-repeat center 0;
  background-size: 100%;
}
.modules__map_module {
  margin: var(--gap-4x) 0;
  position: relative;
  height: 54px;
}
.modules__map_module.missing {
  opacity: 1;
  cursor: default;
}
.modules__map_module > div {
  position: absolute;
  left: 50%;
  top: 0;
  height: 100%;
}
.modules__map_module > div svg {
  width: 60px;
}
.modules__map_module > div.current svg path.dark {
  fill: #9417cf;
}
.modules__map_module > div.current svg path.light {
  fill: #c269de;
}
.modules__map_module > div.finished:hover svg, .modules__map_module > div.current:hover svg {
  transform: scale(1.1);
  transition: transform 0.3s;
}
.modules__map_module > div.current {
  cursor: pointer;
}
.modules__map_module > div.current svg {
  position: relative;
  animation: pulseUp 1s infinite;
}
.modules__map_module > div.finished:not(.current) {
  cursor: pointer;
}
.modules__map_module > div.finished:not(.current) svg path.dark {
  fill: #005940;
}
.modules__map_module > div.finished:not(.current) svg path.light {
  fill: #00bd86;
}
.modules__map_module:nth-child(2) > div {
  top: 0%;
  left: 55%;
}
.modules__map_module:nth-child(3) > div {
  top: 10%;
  left: 60%;
  transform: translateX(-50%);
}
.modules__map_module:nth-child(4) > div {
  top: 10%;
  left: 50%;
}
.modules__map_module:nth-child(5) > div {
  top: 0%;
  left: 40%;
}
.modules__map_module:nth-child(6) > div {
  left: 42%;
  top: 50%;
}
.modules__map_module:nth-child(7) > div {
  left: 50%;
  top: 50%;
}
.modules__map_module:nth-child(8) > div {
  top: 90%;
}
.modules__map_module:nth-child(9) > div {
  top: 90%;
  left: 45%;
}
.modules__map_module:nth-child(10) > div {
  top: 50%;
}
.modules__map_module:nth-child(11) > div {
  left: 40%;
}
.modules__map_module:nth-child(12) > div {
  left: 30%;
}
.modules__map_module:nth-child(13) > div {
  transform: translateX(-50%);
}
.modules__map_module:nth-child(14) > div {
  transform: translateX(-50%);
}

.home {
  display: flex;
  flex-direction: column;
  padding: var(--gap-4x) var(--gap-2x);
  align-items: center;
  justify-content: space-between;
  height: 100%;
}
.home .visual {
  display: flex;
  align-items: center;
  flex-direction: column;
  text-align: center;
}
.home .visual p {
  margin-top: var(--gap);
  color: var(--c-green);
  font-size: var(--fs-large);
  position: relative;
  z-index: 3;
}
.home .visual .hero__figure {
  position: relative;
  display: block;
  left: 0;
  top: 0;
  transform: none;
  width: 86px;
}
.home div.logo {
  width: 86%;
  position: relative;
}
.home div.logo img {
  width: 100%;
}
.home div.logo .glow {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 200%;
  max-width: none;
}
.home div.logo .logo {
  position: relative;
  z-index: 4;
}

#character.screen {
  z-index: 2015;
}
#character.screen.show {
  top: var(--gap-4x);
  height: calc(100% - 2 * var(--gap-4x));
  padding: var(--gap-2x);
}

#badges {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  bottom: 0;
  background: rgba(0, 0, 0, 0.8);
  z-index: 2015;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  transform: scale(0.7);
  transition: opacity 0.3s, transform 0.3s;
  transition-delay: 0.3s, 0;
}
#badges.show {
  opacity: 1;
  pointer-events: all;
  transform: scale(1);
  transition: opacity 0.3s, transform 0.6s;
}
#badges .screen.show {
  top: var(--gap-4x);
  height: calc(100% - 2 * var(--gap-4x));
  padding: var(--gap);
}
#badges .screen .inner {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  padding: var(--gap-2x) var(--gap-2x) var(--gap-4x) var(--gap-2x);
}
#badges .screen .badges-container {
  display: grid;
  gap: 1em;
  grid-template-columns: repeat(3, 1fr);
  padding-bottom: var(--gap-2x);
  font-size: 0.8em;
  text-align: center;
}
#badges .screen .badges-container p {
  margin: 0.5em 0 0;
  font-family: var(--ff-head);
  text-transform: uppercase;
  line-height: 1.4;
}

#newbadge {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  z-index: 2015;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  opacity: 0;
  pointer-events: none;
  transform: scale(0.7);
  transition: opacity 0.3s, transform 0.3s;
  transition-delay: 0.3s, 0;
}
#newbadge.show {
  opacity: 1;
  pointer-events: all;
  transform: scale(1);
  transition: opacity 0.3s, transform 0.6s;
}
#newbadge.show.animate .icon {
  animation: newBadgeRotateYAndZoom 3s forwards;
}
#newbadge.show.animate .inner h2 {
  opacity: 1;
  transition: opacity 1s;
  transition-delay: 1s;
}
#newbadge.show.animate .inner p.description {
  opacity: 1;
  transition: opacity 1s;
  transition-delay: 2s;
}
#newbadge.show.animate .inner p.action {
  opacity: 1;
  transition: opacity 0.4s;
  transition-delay: 3.3s;
}
#newbadge .inner {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 0 var(--gap-4x);
  text-align: center;
}
#newbadge .inner h2 {
  margin-bottom: 0.5em;
}
#newbadge .inner .icon {
  transform: scale(0.3);
}
#newbadge .inner img {
  width: 100%;
  max-width: 124px;
  margin-bottom: var(--gap);
  animation: newBadgePuls 1s infinite;
}
#newbadge .inner h2,
#newbadge .inner p {
  opacity: 0;
}

@keyframes newBadgePuls {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes newBadgeRotateYAndZoom {
  0% {
    transform: rotateY(0) scale(0.3);
  }
  100% {
    transform: rotateY(1440deg) scale(1);
  }
}
@keyframes answered {
  0% {
    background-color: transparent;
    color: white;
  }
  100% {
    color: black;
    background-color: white;
  }
}
@keyframes wrong {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: var(--c-wrong);
  }
}
@keyframes correct {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: var(--c-correct);
  }
}
.swiper-slide.MC p.description {
  display: none;
}
.swiper-slide.MC:has(.answered) .button {
  pointer-events: none;
}
.swiper-slide.MC:has(.answered):has(.description) p.copy {
  display: none;
}
.swiper-slide.MC:has(.answered):has(.description) .multipleChoice {
  margin-top: var(--gap);
}
.swiper-slide.MC:has(.answered):has(.description) .button:not(.wrong):not(.correct) {
  display: none;
}
.swiper-slide.MC:has(.answered):has(.description) p.description {
  display: block;
  margin-top: var(--gap);
}

.multipleChoice .button.quiz {
  flex-direction: column;
}
.multipleChoice .button.quiz .description {
  margin-top: 0.8em;
  padding-top: 0.8em;
  border-top: solid 2px white;
  text-align: left;
  display: none;
}
.multipleChoice .button.quiz.active .description {
  display: block;
}
.multipleChoice .button.quiz:not(:last-child) {
  margin-bottom: var(--gap);
}
.multipleChoice .button.quiz.active, .multipleChoice .button.quiz.correct {
  animation: correct 800ms forwards;
}
.multipleChoice .button.quiz.active:hover, .multipleChoice .button.quiz.correct:hover {
  color: white;
}
.multipleChoice .button.quiz.wrong {
  animation: wrong 800ms forwards;
}

.quest .audio:has(.playing) .audioProgress {
  animation: pulseAudioProgress 1s infinite alternate;
}
.quest .audio .play {
  background: none;
}
.quest .audioProgress {
  width: 72%;
  height: 0.4em;
  background: rgba(255, 255, 255, 0.5);
  position: relative;
  margin: var(--gap-4x) auto 0;
}
.quest .audioProgress .progress {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background: var(--c-green);
}
.quest .time {
  margin-top: var(--gap);
  display: flex;
  justify-content: center;
}

@keyframes pulsePlayButton {
  0% {
    background: rgba(255, 255, 255, 0.5);
  }
  100% {
    background: rgba(255, 255, 255, 0.1);
  }
}
.video__fullscreen {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: calc(100% - 2.4em - var(--gap));
  padding: var(--gap);
  z-index: 2086;
  -webkit-backdrop-filter: blur(0.2em);
          backdrop-filter: blur(0.2em);
  background: rgba(0, 0, 0, 0.5);
}
.video__fullscreen video {
  width: 100%;
  height: 100%;
}
.video__fullscreen .play {
  padding-top: var(--gap-2x);
}
.video__fullscreen:has(.playing) .play {
  opacity: 0;
  pointer-events: none;
}

.audio {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 86%;
  transform: translate(-50%, -50%);
  z-index: 1905;
}
.audio:has(video.playing) .play {
  opacity: 0;
  pointer-events: none;
}

.play {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.2);
  opacity: 1;
  transition: opacity 0.5s;
  cursor: pointer;
}
.play img {
  width: 24%;
}

.quest .range .answer {
  border-radius: var(--radius);
  background: var(--c-violet);
  padding: var(--gap);
}
.quest .range .answer .range-wrapper {
  position: relative;
}
.quest .range .answer input[type=range] {
  width: 100%;
  -webkit-appearance: none;
  background: transparent;
}
.quest .range .answer input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  height: var(--gap-15x);
  width: var(--gap-15x);
  transform: translateY(calc(-0.25 * var(--gap-15x)));
  border-radius: var(--radius);
  background: var(--c-red);
  cursor: pointer;
}
.quest .range .answer input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: var(--gap);
  background: rgba(0, 0, 0, 0.24);
}
.quest .range .answer p {
  display: flex;
  align-items: center;
  position: relative;
}
.quest .range .answer p .copy {
  flex-grow: 1;
}
.quest .range .answer p .value {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  opacity: 0.24;
  font-size: 3em;
}
.quest .range .answer + .answer {
  margin-top: var(--gap);
}

#character,
.swiper-slide.RESULT,
.swiper-slide.BREAKDOWN {
  display: flex;
  align-items: center;
  justify-content: center;
}
#character .inner,
.swiper-slide.RESULT .inner,
.swiper-slide.BREAKDOWN .inner {
  background: var(--c-green);
  padding: var(--gap-2x);
  border-radius: var(--radius);
  text-align: center;
}
#character .inner h2,
.swiper-slide.RESULT .inner h2,
.swiper-slide.BREAKDOWN .inner h2 {
  font-weight: bold;
  margin: 0;
}
#character .inner .score,
.swiper-slide.RESULT .inner .score,
.swiper-slide.BREAKDOWN .inner .score {
  color: var(--c-red);
  font-weight: bold;
  font-size: var(--fs-hl-medium);
}
#character .inner .more,
.swiper-slide.RESULT .inner .more,
.swiper-slide.BREAKDOWN .inner .more {
  font-size: var(--fs-large);
}
#character .pillars p,
.swiper-slide.RESULT .pillars p,
.swiper-slide.BREAKDOWN .pillars p {
  margin: 1em 0 0.5em 0;
}
#character .bar,
.swiper-slide.RESULT .bar,
.swiper-slide.BREAKDOWN .bar {
  display: block;
  width: 100%;
  height: 0.5em;
  background: rgba(0, 0, 0, 0.24);
}
#character .bar .fill,
.swiper-slide.RESULT .bar .fill,
.swiper-slide.BREAKDOWN .bar .fill {
  height: 100%;
  background: var(--c-red);
}

.modules {
  height: 100%;
  opacity: 1;
  transition: opacity 0.4s;
}
.modules:not(:has(.swiper-slide-active)):not(:has(.modules__map)) {
  opacity: 0;
}
.modules .footer,
.modules .title {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 1989;
  padding: 0;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
}
.modules .footer > div, .modules .footer > span,
.modules .title > div,
.modules .title > span {
  display: flex;
  align-items: center;
}
.modules .footer .score,
.modules .title .score {
  width: 86px;
}
.modules .footer .score span,
.modules .title .score span {
  padding: 0.3em 0;
  text-align: center;
}
.modules .footer .level,
.modules .title .level {
  padding: 0.3em 0.6em;
  flex-grow: 0;
  margin-right: var(--gap);
}
.modules .footer .level,
.modules .footer .score,
.modules .title .level,
.modules .title .score {
  background: var(--c-copy);
  border: solid 2px var(--c-violet);
  color: var(--c-green);
  font-weight: bold;
  border-radius: var(--radius);
}
.modules .footer .score,
.modules .title .score {
  cursor: pointer;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.modules .title {
  cursor: pointer;
  top: -0.8em;
}
.modules .title img {
  margin-right: 0.4em;
}
.modules .footer {
  z-index: 1972;
  bottom: 0;
  padding: var(--gap) var(--gap-2x);
  width: 100%;
}
.modules .footer img {
  cursor: pointer;
}

.hero__figure {
  position: absolute;
  z-index: 100;
  left: 0;
  width: 64px;
  display: none;
  transform: translate(-50%, calc(-100% + 24px));
  transition: all 1s;
}
.hero__figure svg {
  position: relative;
  animation: pulseUp 1s infinite;
}
.hero__figure svg.jump {
  animation: jump 1s forwards ease-in-out;
}

@keyframes pulseWidth {
  0% {
    width: 60%;
  }
  50% {
    width: 50%;
  }
  100% {
    width: 60%;
  }
}
@keyframes pulseUp {
  0% {
    top: 0;
  }
  50% {
    top: -5px;
  }
  100% {
    top: 0;
  }
}
@keyframes jump {
  0% {
    top: 0;
  }
  20% {
    top: -32px;
  }
  100% {
    top: 0;
  }
}
.glow {
  position: absolute;
  left: 0;
  width: 100%;
  height: auto;
  z-index: 2;
}

.ty b,
.ty strong,
.typography b,
.typography strong {
  font-weight: bold;
}
.ty i,
.ty em,
.typography i,
.typography em {
  font-style: italic;
}
.ty blockquote,
.ty pre,
.typography blockquote,
.typography pre {
  padding: 1rem 0;
}
.ty .wp-block-quote,
.ty blockquote,
.typography .wp-block-quote,
.typography blockquote {
  padding: 0;
  font-size: var(--fs-large);
  margin: var(--gap-2x) 0;
  border: none;
}
.ty .wp-block-quote p:last-child,
.ty blockquote p:last-child,
.typography .wp-block-quote p:last-child,
.typography blockquote p:last-child {
  margin-bottom: 0;
}
.ty .wp-block-pullquote,
.typography .wp-block-pullquote {
  padding: var(--gap-2x);
  background: var(--c-copy);
  color: white;
  border: none;
  text-align: left;
  font-size: 1em;
}
@media (min-width: 1280px) {
  .ty .wp-block-pullquote,
  .typography .wp-block-pullquote {
    transform: translateX(-4em);
    width: 86%;
  }
}
.ty .wp-block-pullquote blockquote,
.typography .wp-block-pullquote blockquote {
  font-size: 1em;
  margin: 0;
}
.ty pre,
.typography pre {
  font-family: var(--ff-fixed);
  line-height: 1.5;
  background: black;
  color: white;
}
.ty .p,
.typography .p {
  font-size: 1em;
}
.ty .p,
.ty dd,
.ty dt,
.ty ul,
.ty ol,
.ty p,
.typography .p,
.typography dd,
.typography dt,
.typography ul,
.typography ol,
.typography p {
  margin: 0 0 1em 0;
  line-height: 1.5;
}
.ty .small,
.typography .small {
  font-size: 0.75em;
}
.ty .abstract,
.typography .abstract {
  font-weight: bold;
}
@media (min-width: 560px) {
  .ty .abstract,
  .typography .abstract {
    font-size: var(--fs-large);
  }
}
.ty p:last-child,
.typography p:last-child {
  margin-bottom: 0;
}
.ty ul:not(:first-child),
.typography ul:not(:first-child) {
  margin-top: var(--gap-2x);
}
.ty ul:not(:last-child),
.typography ul:not(:last-child) {
  margin-bottom: var(--gap-2x);
}
.ty ul li:not([class]),
.ty ul li.wp-block-list-item,
.typography ul li:not([class]),
.typography ul li.wp-block-list-item {
  padding: 0 0 0 1.2em;
  margin-left: 0;
  background: url("../images/Bullet.svg") no-repeat 0 0.4em;
}
.ty ul li:not([class]):not(:first-child),
.ty ul li.wp-block-list-item:not(:first-child),
.typography ul li:not([class]):not(:first-child),
.typography ul li.wp-block-list-item:not(:first-child) {
  margin-top: 1em;
}
.ty ul ul,
.typography ul ul {
  margin-left: 1em;
}
.ty ul li,
.typography ul li {
  list-style-type: none;
}
.ty ol li,
.typography ol li {
  list-style-type: decimal;
  margin-left: 1em;
  margin-bottom: 1em;
}
.ty ul,
.ty ol,
.typography ul,
.typography ol {
  margin: 1em 0;
  line-height: 1.4;
}
.ty caption,
.ty .h1,
.ty h1,
.ty h2,
.ty h3,
.ty h4,
.ty h5,
.typography caption,
.typography .h1,
.typography h1,
.typography h2,
.typography h3,
.typography h4,
.typography h5 {
  margin-top: 1em;
  margin-bottom: 1em;
  line-height: 1.2;
  font-family: var(--ff-head);
  font-weight: normal;
}
.ty caption a,
.ty .h1 a,
.ty h1 a,
.ty h2 a,
.ty h3 a,
.ty h4 a,
.ty h5 a,
.typography caption a,
.typography .h1 a,
.typography h1 a,
.typography h2 a,
.typography h3 a,
.typography h4 a,
.typography h5 a {
  text-decoration: none;
}
.ty caption:first-child,
.ty .h1:first-child,
.ty h1:first-child,
.ty h2:first-child,
.ty h3:first-child,
.ty h4:first-child,
.ty h5:first-child,
.typography caption:first-child,
.typography .h1:first-child,
.typography h1:first-child,
.typography h2:first-child,
.typography h3:first-child,
.typography h4:first-child,
.typography h5:first-child {
  margin-top: 0;
}
.ty .h1, .ty h1,
.typography .h1,
.typography h1 {
  font-family: var(--ff-head);
  font-size: var(--fs-hl-large);
  text-transform: uppercase;
}
.ty .h2,
.ty h2,
.typography .h2,
.typography h2 {
  font-size: var(--fs-hl-medium);
  text-transform: uppercase;
}
.ty caption,
.ty .h3,
.ty h3,
.typography caption,
.typography .h3,
.typography h3 {
  font-size: var(--fs-hl-small);
}
.ty .h4,
.ty .h5,
.ty h4,
.ty h5,
.typography .h4,
.typography .h5,
.typography h4,
.typography h5 {
  font-size: 1.2em;
}
.ty h1 + *,
.ty h2 + *,
.ty h3 + *,
.ty .coltop + h1,
.ty .coltop + h2,
.ty .coltop + h3,
.ty .coltop + h4,
.ty .coltop + h5,
.ty a[name=copytop] + h1,
.ty a[name=copytop] + h2,
.ty a[name=copytop] + h3,
.ty a[name=copytop] + h4,
.ty a[name=copytop] + h5,
.typography h1 + *,
.typography h2 + *,
.typography h3 + *,
.typography .coltop + h1,
.typography .coltop + h2,
.typography .coltop + h3,
.typography .coltop + h4,
.typography .coltop + h5,
.typography a[name=copytop] + h1,
.typography a[name=copytop] + h2,
.typography a[name=copytop] + h3,
.typography a[name=copytop] + h4,
.typography a[name=copytop] + h5 {
  margin-top: 0;
}
.ty a:not([class]),
.typography a:not([class]) {
  color: var(--c-rot);
  text-decoration: underline;
}
.ty a:not([class]):hover,
.typography a:not([class]):hover {
  text-decoration: none;
}
.ty .wp-caption p,
.typography .wp-caption p {
  font-size: 0.8em;
  margin: 0.5em 0 1em 0;
}

html {
  zoom: 100%;
  box-sizing: border-box;
}
html * {
  box-sizing: border-box;
}

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

body {
  font-family: var(--ff-copy);
  font-size: var(--fs-copy);
  -webkit-font-smoothing: antialiased;
  color: var(--c-copy);
}
body.scroll-lock {
  overflow: hidden;
}
@media (min-height: 640px) {
  body {
    overflow: hidden;
  }
}
body.app {
  background: var(--c-bg);
}

.wrap {
  width: var(--max-width);
  margin: 0 auto;
  position: relative;
}

#wrapall {
  margin: 0 auto;
}

header#header {
  display: flex;
  flex-direction: column-reverse;
}
header#header a {
  text-decoration: none;
  color: var(--ff-copy);
}
header#header > div {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
header#header nav {
  width: 100%;
}
header#header nav > ul {
  display: flex;
  justify-content: flex-end;
}
header#header nav > ul > li {
  position: relative;
}
header#header nav > ul > li > ul {
  position: absolute;
  left: 0;
  top: 1em;
  display: none;
}
header#header nav > ul > li:hover > ul {
  display: block;
}
header#header #mobile_menu {
  position: fixed;
  background-color: white;
  z-index: 2086;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  padding: var(--gap-3x);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  font-size: 1.4em;
  transform: translateY(-100%);
  transition: transform 800ms;
  overflow: auto;
}
@media (min-width: 768px) {
  header#header #mobile_menu {
    display: none;
  }
}
header#header #mobile_menu.open {
  transition: transform 800ms;
  transform: translateY(0);
}
header#header #mobile_menu > div {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
}
header#header #mobile_menu > div > div > ul > li, header#header #mobile_menu > div > ul > li {
  margin: 1em 0;
}
header#header #mobile_menu > div > div > ul > li.kontakt, header#header #mobile_menu > div > div > ul > li.contact, header#header #mobile_menu > div > ul > li.kontakt, header#header #mobile_menu > div > ul > li.contact {
  font-weight: bold;
}
header#header #mobile_menu > div .footer {
  font-size: 0.86em;
}
header#header #trigger {
  cursor: pointer;
  position: fixed;
  right: var(--gap);
  top: var(--gap);
  z-index: 2089;
  width: 36px;
  height: 26px;
}
@media (min-width: 768px) {
  header#header #trigger {
    display: none;
  }
}
header#header #trigger > span {
  display: block;
  width: 100%;
  height: 2px;
  background-color: black;
  position: absolute;
  left: 0;
}
header#header #trigger > span.ff1 {
  top: 0;
}
header#header #trigger > span.ff2 {
  top: 50%;
  transform: translateY(-1px);
}
header#header #trigger > span.ff3 {
  bottom: 0;
}
header#header #trigger.open > span.ff1 {
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
}
header#header #trigger.open > span.ff2 {
  opacity: 0;
}
header#header #trigger.open > span.ff3 {
  top: 50%;
  transform: translateY(-50%) rotate(-45deg);
}

table {
  width: 100%;
  background: white;
}

td, th {
  border-top: solid 1px #dddddd;
  border-left: solid 1px #dddddd;
  padding: 0.5em 0.7em;
}

th {
  background: #474747;
  color: white;
  font-family: var(--ff-head);
}

th:first-child,
td:first-child {
  border-left: none;
}

tbody tr:nth-child(odd) td {
  background-color: #eeeeee;
}

form p {
  margin: 0;
}

label {
  display: block;
  margin-bottom: var(--gap);
  font-weight: bold;
}

textarea,
input[type=email],
input[type=search],
input[type=text] {
  font-family: var(--ff-copy);
  padding: 0.8em;
  background: #eee;
  margin: 0;
  width: 100%;
  border: none;
  font-size: 1em;
  border-radius: var(--radius-small);
}

input[type=checkbox],
input[type=radio],
input[type=submit],
input[type=button],
select {
  cursor: pointer;
}

.form-row {
  margin-bottom: var(--gap);
}
.form-row label {
  display: block;
}

.gform_wrapper {
  margin-bottom: var(--m-vert);
}
.gform_wrapper .gform_fields {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  gap: var(--gap);
}
.gform_wrapper .gform_fields > * {
  grid-column: span 6;
}
.gform_wrapper .gform_fields .gfield--width-half {
  grid-column: span 3;
}
.gform_wrapper .gform_fields .gfield--width-third {
  grid-column: span 2;
}
.gform_wrapper .ginput_container {
  margin: 0;
}
.gform_wrapper .gfield_label {
  margin: 0.5em 0;
}
.gform_wrapper .gform_fields .gfield {
  margin: 0 0 1em;
}
.gform_wrapper .hidden_label label {
  display: none;
}
.gform_wrapper .hidden_label input {
  margin-top: 0;
}

a.button,
.button {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--ff-head);
  font-size: 1em;
  padding: 0.8em 1em 0.6em 1em;
  background: var(--c-corporate);
  color: white;
  text-decoration: none;
  text-align: center;
  border-radius: var(--radius);
  text-transform: uppercase;
  font-weight: bold;
}
a.button svg,
.button svg {
  margin-right: 0.5em;
}
a.button.block,
.button.block {
  display: flex;
  width: 100%;
}
a.button.active,
.button.active {
  background: var(--c-green);
}
a.button.large,
.button.large {
  font-size: var(--fs-large);
}
a.button:not(.disabled):hover,
.button:not(.disabled):hover {
  background: white;
  color: var(--c-corporate);
  cursor: pointer;
}
a.button.primary,
.button.primary {
  background: var(--c-green);
}
a.button.primary:hover,
.button.primary:hover {
  background: white;
  color: var(--c-green);
  cursor: pointer;
}
a.button.outline,
.button.outline {
  background: transparent;
  color: white;
  border: solid 2px white;
}
a.button.outline:hover,
.button.outline:hover {
  background: var(--c-corporate);
  color: white;
}
a.button.outline.active,
.button.outline.active {
  background: white;
  color: var(--c-corporate);
}
a.button.quiz,
.button.quiz {
  background: var(--c-violet);
  color: white;
  border: solid 2px var(--c-violet);
  text-transform: none;
}
a.button.quiz:hover,
.button.quiz:hover {
  border-color: var(--c-white);
  cursor: pointer;
}
a.button.quiz.answered,
.button.quiz.answered {
  background: transparent;
  color: var(--c-white);
}
a.button.quiz.answered.correct,
.button.quiz.answered.correct {
  background: var(--c-correct);
  border-color: var(--c-correct);
  color: var(--c-white);
}
a.button.quiz.answered.wrong,
.button.quiz.answered.wrong {
  background: var(--c-wrong);
  border-color: var(--c-wrong);
  color: var(--c-white);
}
a.button.disabled, a.button.swiper-button-disabled,
.button.disabled,
.button.swiper-button-disabled {
  opacity: 0.5;
  cursor: default;
}

.hit__importer {
  padding: var(--gap-2x);
}
.hit__importer select {
  padding: 0.5em;
  border: solid 1px #242424;
}

footer {
  padding: 2em 0;
  display: flex;
  justify-content: center;
}
footer a {
  color: var(--c-copy);
  text-decoration: none;
}
footer nav ul {
  display: flex;
  justify-content: center;
}
footer nav ul li {
  margin: 0 1em;
}

.pr {
  position: relative;
}
.pr.pa1 {
  width: 100%;
  padding-bottom: 100%;
}
.pr.pa1.wide {
  padding-bottom: 56%;
}

.pa {
  position: absolute;
}
.pa.l0 {
  left: 0;
}
.pa.t0 {
  top: 0;
}
.pa.r0 {
  right: 0;
}
.pa.b0 {
  bottom: 0;
}

.pa1 {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.pa1.of {
  -o-object-fit: cover;
     object-fit: cover;
}

.fxc {
  display: flex;
  justify-content: center;
  align-items: center;
}

.fxsb {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.fxsb.afs {
  align-items: flex-start;
}
.fxsb.afe {
  align-items: flex-end;
}

.txc {
  text-align: center;
}

.hideMove {
  position: fixed;
  top: -5000px;
}

.clear {
  clear: both;
}

.printonly {
  display: none;
}

.wp-caption,
img {
  max-width: 100%;
  height: auto;
}

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

.blur-50 {
  filter: url("#sharpBlur");
}

.hideSvgSoThatItSupportsFirefox {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

/*# sourceMappingURL=app.css.map*/