@charset "UTF-8";

@font-face {
  font-family: "Rauschen-BMedium";
  src: url("../fonts/Rauschen-BMedium-Web.woff2") format("woff2"), url("../fonts/Rauschen-BMedium-Web.woff") format("woff");
}

@font-face {
  font-family: "Rauschen-BMedium-Italic";
  src: url("../fonts/Rauschen-BMedium-Italic-Web.woff2") format("woff2"), url("../fonts/Rauschen-BMedium-Italic-Web.woff") format("woff");
}

:root {
  --black: rgb(0, 0, 0);
  --white: rgb(255, 255, 255);

  --microEdge: 5px;
  --miniEdge: 7px;
  --smallEdge: 10px;
  --mainEdge: 15px;
  --normalEdge: 20px;
  --biggerEdge: 25px;
  --bigEdge: 30px;
  --betweenEdge: 40px;
  --hugeEdge: 50px;
  --giantEdge: 80px;
  --enormousEdge: 100px;

  --fontSize1: 16px;
  --fontSize2: 19px;
  --fontSize3: 30px;
  --fontSize6: 40px;
  --fontSize4: 50px;
  --fontSize5: 80px;

  --line: 1px;
  --line-height-2: 1.3;
  --line-height-3: 1.2;
  --line-height-4: 1.4;

  --regular: "Rauschen-BMedium", sans-serif;
  --mono: "Azeret Mono", sans-serif;

  --underline-thickness: var(--line);
  --underline-offset: 2px;

  --letter-spacing-xs: -0.3rem;
  --letter-spacing-s: 0.3rem;
  --letter-spacing-sm: 0.6rem;
  --letter-spacing-m: 1rem;
  --letter-spacing-l: 1.5rem;
  --letter-spacing-xl: 2rem;
  --letter-spacing-xxl: 2.5rem;

  --letter-spacing-factor: 0.2;
}

* {
  margin: 0;
  padding: 0;
  list-style: none;
  box-sizing: border-box;
}

body {
  font-family: var(--regular);
  font-size: var(--fontSize1);
  line-height: 1.1;
  font-weight: 400;
  background-color: var(--white);
  color: var(--black);
  -webkit-font-smoothing: antialiased;
  margin: 0;
  overflow-x: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

body::-webkit-scrollbar {
  display: none;
}

*::-webkit-scrollbar {
  display: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: unset;
  font-weight: 400;
}

h1 {
  line-height: 1;
}

h1:not(.logo, .nav-logo) {
  font-size: var(--fontSize5);
  letter-spacing: -0.03em;
  line-height: 0.9;
}

h2 {
  font-size: var(--fontSize4);
  letter-spacing: -0.05em;
  line-height: 1;
}

h3 {
  font-size: var(--fontSize3);
  letter-spacing: -0.03em;
  line-height: 0.95;
}

a {
  text-decoration: none;
  color: var(--black);
}

a:hover,
a:active {
  color: rgb(0, 0, 0, 0.3);
}

.line {
  height: var(--line);
  background: rgb(0, 0, 0, 0.3)
}

.underline {
  text-decoration: underline;
  text-decoration-thickness: var(--underline-thickness);
  text-underline-offset: var(--underline-offset);
}

.alert {
  display: none;
  width: max-content;
}

a:hover .alert {
  color: var(--black);
}

/* NAV */
.transition {
  position: fixed;
  width: 100vw;
  height: 100vh;
  z-index: 100;
  background: var(--white);
  pointer-events: none;
}

.loading {
  font-family: var(--mono);
  font-size: var(--fontSize1);
  font-style: italic;
  padding: var(--mainEdge);
  color: var(--black);
}

.loading:after {
  content: "...";
  overflow: hidden;
  display: inline-block;
  vertical-align: bottom;
  animation: ellipsis-dot 1s infinite .3s;
  animation-fill-mode: forwards;
}

.no-cursor {
  pointer-events: none;
}

@keyframes ellipsis-dot {
  25% {
    content: "";
  }

  50% {
    content: ".";
  }

  75% {
    content: "..";
  }

  100% {
    content: "...";
  }
}

.nav {
  position: fixed;
  width: 100%;
  pointer-events: none;
  z-index: 101;
  transition: all 0.5s ease;
}

.nav-grid {
  display: grid;
  gap: 0 var(--mainEdge);
  width: 100%;
  direction: rtl;
  grid-template-columns: repeat(12, 1fr);
}

.nav-width {
  grid-column: 1/-1;
  margin: 0 var(--normalEdge);
}

.nav-width-shrink {
  grid-column: 1;
  margin: 0 var(--normalEdge);
}

.nav-width-ext {
  grid-column: 1/-1;
  margin: 0 var(--normalEdge);
}

.nav-flex {
  display: flex;
  justify-content: end;
  padding: calc(var(--mainEdge) + var(--normalEdge));
}

.nav-content {
  display: none;
  position: relative;
  pointer-events: all;
  height: max-content;
  width: 0;
  width: var(--nav-width);
  overflow: hidden;
  white-space: nowrap;
  transition: width 0.5s ease;
}

.open {
  position: absolute;
  width: 100%;
  height: 100%;
  cursor: pointer;
  z-index: 100;
}

.nav-content .layout-grid {
  opacity: 0;
  position: relative;
  padding: var(--mainEdge) var(--miniEdge);
  z-index: 1;
}

.nav-main {
  grid-column: 1/12;
}

.main-nav-grid {
  display: grid;
  grid-template-columns: repeat(11, 1fr);
  gap: calc(var(--hugeEdge) + var(--mainEdge)) var(--mainEdge);
  direction: ltr;
}

.nav-logo {
  font-size: var(--fontSize4);
  letter-spacing: -0.03em;
  grid-column: 1/7;
}

.nav-date {
  grid-column: 7/-1;
}

.nav-block:first-of-type {
  grid-column: 1/4;
}

.nav-block:nth-of-type(2) {
  grid-column: 4/7;
}

.nav-block:nth-of-type(3) {
  grid-column: 7/10;
}

.nav-block:nth-of-type(4) {
  grid-column: 10/-1;
}

.mobile-grid {
  display: block;
}

.nav-link {
  font-size: var(--fontSize3);
  letter-spacing: -0.05em;
  line-height: 1.1;
  display: block;
  text-wrap: nowrap;
}

.nav-link.low-prio {
  font-size: var(--fontSize2);
}

.current-nav-link {
  color: rgb(0, 0, 0, 0.3);
}

.nav-aside {
  display: flex;
  align-items: end;
  justify-content: space-between;
  flex-direction: column;
  height: 100%;
  grid-column: 12/-1;
  font-size: var(--fontSize1);
}

.language-switch {
  display: flex;
  gap: calc(var(--fontSize1) * 0.25);
}

.close {
  width: var(--fontSize2);
  margin: 4px;
  cursor: pointer;
}

.nav-bg-img {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right;
  z-index: 0;
}

#container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  pointer-events: none;
}

#container canvas {
  width: 200vw !important;
  height: 200vh !important;
}

#container:after {
  content: "";
  background-image: url(../images/grain.jpg);
  opacity: 0.12;
  height: 100%;
  width: 100%;
  mix-blend-mode: overlay;
  position: absolute;
  top: 0;
  left: 0;
}

.heatmap {
  position: relative;
  overflow: hidden;
  height: 100%;
  width: 100%;
}

.heatmap canvas {
  position: absolute;
  top: 0;
  left: 0;
  filter: blur (20px);
  mix-blend-mode: hard-light;
}



/* MAIN SITE ELEMENTS AND FORMS */
button,
input,
optgroup,
select,
textarea {
  font-family: var(--mono);
  font-size: 100%;
  /* line-height: var(--lineHeightStandard); */
  margin: 0;
  border: none;
  background: none;
  /* color: var(--darkgreen); */
}

button,
input {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

button {
  position: relative;
  cursor: pointer;
  text-align: left;
  /* z-index: 1; */
}

button,
button a {
  text-decoration: none;
}

button,
button::after {
  transition: 150ms;
  transition-timing-function: ease-in-out;
}

.button-style1 {
  background-color: var(--black);
  color: var(--white);
  /* width: 100%; */
  padding: 10px;
  /* border-radius: 5px; */
  cursor: pointer;
  border-radius: 10px;
  font-size: var(--fontSize1);
  line-height: 1.1;
  padding: calc(var(--smallEdge) / 2) var(--smallEdge);
  border: var(--line) solid var(--black);
  border-radius: 20px;
}

input {
  border: 1px solid var(--black);
  line-height: 1.1;
  padding: calc(var(--smallEdge) / 2) var(--smallEdge);
}


/* HOME */
#home {
  height: 100vh;
}

header {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.header-content-container {
  /* display: none; */
}

.home-section:first-of-type {
  margin-top: var(--hugeEdge);
}

.home-section:not(:last-of-type) {
  margin-bottom: calc(var(--enormousEdge) * 1.5);
}

section {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.logo {
  font-family: var(--regular);
  font-size: var(--fontSize3);
  letter-spacing: -0.03em;
  line-height: 0.9;
}

.cls-1 {
  letter-spacing: -.06em;
}

.cls-2 {
  letter-spacing: -.08em;
}

.cls-3 {
  letter-spacing: -.05em;
}

.cls-4 {
  letter-spacing: .2em;
}

.cls-5 {
  letter-spacing: .04em;
}

.invert {
  color: var(--white);
}

.header-content {
  position: relative;
  width: 100%;
  height: 100vh;
  padding: var(--mainEdge);
}

.section-content {
  position: relative;
  width: 100%;
  padding: 0 var(--mainEdge);
}

.content {
  position: relative;
  width: 100%;
  padding: var(--mainEdge);
  padding-bottom: unset;
}

.background-container {
  position: absolute;
  width: 100%;
  height: 100vh;
  z-index: -1;
}

.background-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.api-text {
  position: absolute;
  bottom: var(--mainEdge);
}

.two-column {
  display: flex;
  gap: var(--bigEdge);
}

.calendar {
  width: 50%;
}

.list-heading {
  display: flex;
  align-items: baseline;
  gap: var(--mainEdge);
}

.program-link,
.project-link,
.faq-link,
.link-to,
.artist-link,
.all-events-button,
.layout-link a,
.share-button,
.ticket-link,
.question {
  display: inline-block;
  font-family: var(--mono);
  font-size: var(--fontSize1);
  line-height: 1;
}

.program-link span,
.project-link span,
.faq-link span,
.link-to span,
.artist-link span,
.all-events-button,
.layout-link a span,
.ticket-link span,
.share-button span {
  text-decoration: underline;
  text-decoration-thickness: var(--underline-thickness);
  text-underline-offset: var(--underline-offset);
}

.arrow {
  width: var(--smallEdge);
}

.list {
  position: relative;
  margin-top: var(--biggerEdge);
}

.event:first-of-type:not(.mobile-limit .event:first-of-type) {
  border-top: var(--line) solid rgb(0, 0, 0, 0.3);
}

.event {
  display: list-item;
  padding: var(--mainEdge) var(--smallEdge);
  border-bottom: var(--line) solid rgb(0, 0, 0, 0.3);
}

.event-info {
  font-family: var(--mono);
  font-size: var(--fontSize1);
  line-height: 1.1;
  height: var(--smallEdge);
  display: flex;
  align-items: center;
}

.event-title {
  margin-top: var(--smallEdge);
  white-space: initial;
  letter-spacing: -0.02em;
}

.list-blur {
  position: absolute;
  z-index: 2;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background: linear-gradient(0deg, rgba(255, 255, 255) 0%, rgba(255, 255, 255, 0) 50%);
}

.read-more {
  font-family: var(--mono);
  font-size: var(--fontSize2);
  width: max-content;
  margin: var(--biggerEdge) auto 0;
  text-decoration: underline;
  text-decoration-thickness: var(--underline-thickness);
  text-underline-offset: var(--underline-offset);
  cursor: pointer;
}

.less {
  display: none;
}

.project-slider .event-title {
  pointer-events: all;
}

.project-slider .event-title a {
  line-height: 1.5;
}

.image-container {
  position: relative;
}

.project-image {
  display: block;
  width: 100%;
  aspect-ratio: 100/52;
  object-fit: cover;
}

.photo-credits {
  position: absolute;
  left: var(--smallEdge);
  bottom: var(--smallEdge);
  font-family: var(--mono);
  font-size: var(--fontSize1);
  line-height: 1;
}

.project-content {
  margin-top: var(--mainEdge);
}

.ticket-cta-content {
  margin-top: calc(var(--enormousEdge) * 1.5);
}

.column-10 {
  grid-column: 1/6;
}

.column-40 {
  grid-column: 1/6;
}

.column-60 {
  grid-column: 6/-1;
}

.column-40-reverse {
  grid-column: 7/-1;
}

.column-60-reverse {
  grid-column: 1/7;
}

.column p:not(.column p:empty, .project-info-text, :last-of-type) {
  margin-bottom: var(--mainEdge);
}

.project-date {
  width: max-content;
}

.exhibition-date {
  width: max-content;
  margin-left: var(--mainEdge);
}

.project-info {
  margin-top: var(--biggerEdge);
}

.project-info-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: var(--biggerEdge) var(--mainEdge);
}

.project-info-grid .project-info-text,
.project-info-grid .project-info-list-container {
  grid-column: 1/7;
}

.project-info-text,
.artist-link-list,
.project-team-list {
  font-family: var(--mono);
  font-size: var(--fontSize1);
  line-height: var(--line-height-4);
}

.project-info-text span:first-of-type {
  text-decoration: underline;
  text-decoration-thickness: var(--underline-thickness);
  text-underline-offset: var(--underline-offset);
}

.project-link-container {
  margin-top: var(--hugeEdge);
}

.ticket-element {
  display: flex;
  position: relative;
  width: 30vw;
  height: 30vw;
  border-radius: 50%;
  margin: auto;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  transform: translateZ(0);
  isolation: isolate;
  border: calc(var(--line) * 2) solid var(--black);
}

.ticket-element-text {
  width: 50%;
  text-align: center;
  font-size: var(--fontSize4);
  line-height: 0.9;
}

.cta-content {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}

.cta-content-white {
  background-color: var(--white);
  color: var(--black);
  animation: cta-animation1 4s infinite ease;
}

.cta-content-black {
  background-color: var(--black);
  color: var(--white);
  animation: cta-animation1 4s infinite ease;
  animation-delay: 2s;
}

.cta-content-black a {
  color: var(--white);
}

@keyframes cta-animation1 {
  0% {
    left: 0;
    z-index: 1;
    filter: blur(0px);
  }

  20% {
    left: 150%;
    z-index: 1;
    filter: blur(0px);
  }

  30% {
    left: 150%;
    z-index: 0;
    filter: blur(0px);
  }

  50% {
    left: 0;
    z-index: 0;
    filter: blur(10px);
  }

  70% {
    left: 0;
    z-index: 0;
    filter: blur(0px);
  }

  80% {
    left: 0;
    z-index: 1;
    filter: blur(0px);
  }

  100% {
    left: 0;
    z-index: 1;
    filter: blur(0px);
  }
}

.project-slider-holder {
  position: relative;
}

.project-slider-container {
  position: relative;
  margin-top: var(--bigEdge);
  -ms-overflow-style: none;
  scrollbar-width: none;
  overflow-y: hidden;
  overscroll-behavior-x: none;
}

.slider-blur {
  position: absolute;
  z-index: 2;
  top: 50%;
  width: 100%;
  height: 103%;
  pointer-events: none;
  transform: translateY(-50%);
  background: linear-gradient(270deg, rgba(255, 255, 255) 0%, rgba(255, 255, 255, 0) 10%);
  /* mask-image: linear-gradient(90deg, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.0) 80%, rgba(0,0,0,0.5) 90%, rgba(0,0,0,1.0) 100%); */
}

.project-slider {
  position: relative;
  display: flex;
  width: max-content;
  align-items: flex-start;
  gap: var(--smallEdge);
  pointer-events: none;
  white-space: nowrap;
}

.project-slider-project {
  position: relative;
  width: 40vw;
}

.project-slider-image {
  display: block;
  width: 100%;
  aspect-ratio: 100/114;
  object-fit: cover;
}

.project-slider-info {
  margin-top: var(--smallEdge);
}

.faq-list {
  margin-top: var(--biggerEdge);
}

.faq:first-of-type {
  border-top: var(--line) solid rgb(0, 0, 0, 0.3);
}

.faq {
  font-family: var(--regular);
  font-size: var(--fontSize2);
  line-height: var(--line-height-2);
  padding: var(--mainEdge) 0;
  border-bottom: var(--line) solid rgb(0, 0, 0, 0.3);
}

.faq .answer-content {
  display: none;
  margin-top: var(--mainEdge);
}

.faq .answer {
  grid-column: 2/12;
}

#shop {
  background: rgb(0, 0, 0, 0.1);
}

#shop .section-content {
  padding: var(--bigEdge) var(--mainEdge);
}

.product-list-container {
  position: relative;
  margin-top: var(--bigEdge);
  -ms-overflow-style: none;
  scrollbar-width: none;
  overscroll-behavior-x: none;
}

.product-list {
  position: relative;
  display: flex;
  width: max-content;
  align-items: flex-start;
  gap: var(--bigEdge);
  pointer-events: none;
  white-space: nowrap;
}

.product {
  position: relative;
  width: calc(33.3vw - var(--mainEdge) *2);
}

.product-image {
  width: 100%;
  aspect-ratio: 100/117;
  object-fit: cover;
}

.product-info-container {
  white-space: normal;
  margin-top: var(--smallEdge);
}

.product-info {
  font-family: var(--mono);
  font-size: var(--fontSize1);
  line-height: 1.1;
}

.product-link-container {
  margin-top: var(--bigEdge);
}

.product .project-link {
  pointer-events: all;
}

/* PROGRAM */

.program-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  direction: ltr;
}

.program-main-content {
  display: flex;
}

.program-content {
  position: relative;
  width: 100%;
  padding: var(--bigEdge) var(--mainEdge) 0 var(--mainEdge);
}

.condensed-map {
  grid-column: 9/-1;
}

.expanded-map {
  grid-column: 1/9;
}

main {
  width: var(--map-width-ext);
  min-height: var(--doc-height);
}

aside {
  position: relative;
  right: 0;
  width: var(--map-width);
  height: 100vh;
}

.map-container {
  position: relative;
  right: 0;
  width: 100%;
  height: 100vh;
}

#map {
  position: relative;
  width: 100%;
  height: 100%;
}

.map-blur {
  position: fixed;
  z-index: 2;
  top: 50%;
  width: 100%;
  height: 105%;
  pointer-events: none;
  transform: translateY(-50%);
  background: linear-gradient(90deg, rgba(255, 255, 255) 0%, rgba(255, 255, 255, 0) 5%);
}

.marker {
  position: relative;
  display: none;
  align-items: center;
  justify-content: center;
  font-family: var(--regular);
  font-size: var(--fontSize2);
  line-height: 1;
  width: 30px;
  height: 30px;
  color: var(--black);
  background: var(--white);
  border: var(--line) solid var(--black);
  border-radius: 50%;
  z-index: 1;
}

.marker img {
  display: none;
  position: absolute;
  width: 200%;
  z-index: -1;
}

/* .marker.both{
  background: radial-gradient(rgba(130, 210, 190, 0.5) 7.76%, rgba(110, 140, 240, 0.5) 32.28%, rgba(245, 40, 120, 0.5) 51.55%, rgba(250, 80, 10, 0.5) 80.75%, rgba(255, 210, 0, 0.5) 95.34%);
}
.marker.blue{
  background: radial-gradient(rgba(130, 210, 190, 0.5) 7.76%, rgba(130, 210, 190, 0.5) 51.55%, rgba(110, 140, 240, 0.5) 95.34%);
}
.marker.red{
  background: radial-gradient(rgba(255, 210, 0, 0.5) 6.21%, rgba(250, 80, 10, 0.5) 94.18%);
} */
.marker.active {
  color: var(--white);
  background: var(--black);
  z-index: 2;
}

.marker.selected {
  color: var(--black);
  z-index: 3;
}

.marker.selected img {
  display: block;
}

.calendar {
  width: 100%;
}

.month-container>* ::selection {
  background: none;
}

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

.month:not(.curr-month) {
  display: none;
}

.month-content:not(.curr-month) {
  display: none;
}

.current-month-container {
  text-align: center;
}

.days,
.month-content {
  -ms-overflow-style: none;
  scrollbar-width: none;
  overscroll-behavior-x: none;
}

.arrow-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 50%;
  margin-left: auto;
}

.arrow-container {
  display: flex;
  gap: var(--mainEdge);
  transform: translateX(-50%);
}

.calendar-arrow {
  display: none;
  width: var(--mainEdge);
  cursor: pointer;
}

.calendar-arrow.inactive {
  cursor: auto;
  opacity: 0.3;
}

.today-button.link {
  cursor: pointer;
}

.today-button:hover {
  color: var(--white);
  background: var(--black);
}

.today-button.active {
  color: var(--white);
  background: var(--black);
}

.global-day-month-container {
  position: relative;
  margin-top: var(--normalEdge);
}

.day-blur {
  display: none;
  position: absolute;
  z-index: 2;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background: linear-gradient(270deg, rgba(255, 255, 255) 0%, rgba(255, 255, 255, 0) 30%);
}

.days {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--microEdge);
  white-space: nowrap;
  pointer-events: none;
  /* width: max-content; */
}

.day {
  font-family: var(--mono);
  font-size: var(--fontSize1);
  cursor: pointer;
  border-radius: 50%;
  padding: 0.4em 0.3em;
}

.weekend {
  background: rgb(0, 0, 0, 0.05);
}

.selected:not(.program-event.selected) {
  color: var(--white);
  background: var(--black);
}

.filter-container {
  margin-top: var(--normalEdge);
  padding: var(--normalEdge) 0;
  border-top: var(--line) solid rgb(0, 0, 0, 0.3);
  border-bottom: var(--line) solid rgb(0, 0, 0, 0.3);
}

.filter-content {
  padding: var(--microEdge);
}

.filter-heading-container {
  display: flex;
  justify-content: center;
}

.faq .arrow,
.filter-heading-container .arrow,
.event-list-arrow {
  transition: all 0.5s ease;
}

.filter-heading {
  display: flex;
  font-family: var(--mono);
  font-size: var(--fontSize2);
  line-height: 1;
  text-transform: uppercase;
  text-decoration: underline;
  text-decoration-thickness: var(--underline-thickness);
  text-underline-offset: var(--underline-offset);
  gap: var(--microEdge);
  cursor: pointer;
}

.filter-tag-container {
  display: none;
  padding: var(--normalEdge) 0;
}

.filter-tag-container .tag-container:not(:first-of-type) {
  margin-top: var(--bigEdge);
}

.spacer {
  display: block;
  width: 100%;
}

.tag {
  cursor: pointer;
}

.tag:hover {
  color: var(--white);
  background: var(--black);
}

.tag.active {
  color: var(--white);
  background: var(--black);
}

.event-container {
  padding-top: var(--hugeEdge);
}

.day-heading {}

.selected-filter-container {
  display: flex;
  gap: var(--smallEdge);
  flex-wrap: wrap;
}

.selected-filter-container.active {
  margin-top: var(--normalEdge);
}

.selected-tag {
  display: none;
  font-family: var(--mono);
  font-size: var(--fontSize1);
  line-height: 1.1;
  color: var(--white);
  background: var(--black);
  padding: calc(var(--smallEdge) / 2) var(--smallEdge);
  border: var(--line) solid var(--black);
  border-radius: 20px;
  cursor: pointer;
}

.filter-reset {
  display: none;
  font-family: var(--mono);
  font-size: var(--fontSize1);
  line-height: 1.1;
  color: rgb(0, 0, 0, 0.3);
  padding: calc(var(--smallEdge) / 2) var(--smallEdge);
  border: var(--line) solid var(--white);
  border-radius: 20px;
  cursor: pointer;
}

.filter-reset .filter-flex span {
  text-decoration: underline;
  text-decoration-thickness: var(--underline-thickness);
  text-underline-offset: var(--underline-offset);
}

.filter-flex {
  display: flex;
  gap: var(--smallEdge);
  align-items: center;
}

.filter-x {
  width: var(--miniEdge);
}

.event-list {
  margin-top: var(--normalEdge);
  border-top: var(--line) solid rgb(0, 0, 0, 0.3);
}

.program-event {
  padding: var(--normalEdge) 0 var(--bigEdge);
  padding-right: var(--mainEdge);
  border-bottom: var(--line) solid rgb(0, 0, 0, 0.3);
}

.program-event:not(.active) {
  cursor: pointer;
}

.program-event-grid {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: var(--mainEdge);
}

.program-event.permanent {
  background: rgb(0, 0, 0, 0.05);
  margin-left: calc(var(--mainEdge) * -1);
  padding-left: var(--mainEdge);
}

.program-date-container {
  display: flex;
  flex-direction: column;
  grid-column: 1/3;
}

.program-date-container .closing-days,
.opening-hours .closing-days {
  margin-top: var(--mainEdge);
}

.event-list-arrow {
  cursor: pointer;
}

.event-date-time,
.event-time {
  font-family: var(--mono);
  font-size: var(--fontSize1);
}

.event-time {
  margin-top: var(--biggerEdge);
}

.program-info-container {
  grid-column: 3/-1;
}

.program-info-flex {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--mainEdge);
}

.program-event-title {
  margin-top: var(--normalEdge);
}

.event-address {
  font-family: var(--mono);
  font-size: var(--fontSize1);
  line-height: 1.17;
  margin-top: var(--normalEdge);
}

.program-info-container .event-address {
  display: flex;
  gap: var(--normalEdge);
}

.program-info-container .event-address .location-number {
  text-decoration: underline;
  text-decoration-thickness: var(--underline-thickness);
  text-underline-offset: var(--underline-offset);
}

.event-address span {
  text-decoration: underline;
  text-decoration-thickness: var(--underline-thickness);
  text-underline-offset: var(--underline-offset);
}

.program-info-add-content {
  display: none;
  margin-top: var(--biggerEdge);
}

.program-info-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: var(--mainEdge);
}

.event-info-image {
  display: block;
  grid-column: 1/6;
  width: 100%;
  margin-bottom: var(--mainEdge);
}

.program-info-container .description {
  margin-right: var(--bigEdge);
}

.additional-info {
  margin-top: var(--biggerEdge);
}

.program-info-grid .opening-hours,
.program-info-grid .location-address,
.program-info-grid .link-container {
  grid-column: span 2;
}

.program-info-grid .link-container .project-link,
.program-info-grid .link-container .ticket-link {
  margin-bottom: var(--mainEdge);
}

.barrier-desktop-container {
  flex: 1;
}

.barrier-container {
  display: flex;
  align-items: end;
  height: 100%;
}

.barrier-free {
  width: var(--normalEdge);
}

/* EXHIBITION */
.exhibition-section,
.location-section:not(:last-of-type) {
  margin-bottom: var(--enormousEdge);
}

.location-main-section {
  min-height: calc(100vh - var(--nav-height));
}

.project-section-margin {
  margin-top: var(--bigEdge);
}

.header-bar-content {
  position: relative;
  width: 100%;
  padding: var(--mainEdge);
  padding-bottom: unset;
  padding-right: unset;
}

.header-flex-content {
  position: relative;
  display: block;
  width: 100%;
  height: calc(100vh - var(--nav-height));
  padding: var(--mainEdge);
  padding-top: unset;
}

.header-info {
  position: relative;
  width: 100%;
}

.header-bar-title {
  display: inline-block;
  font-family: var(--mono);
  font-style: italic;
  font-size: var(--fontSize1);
  line-height: 1.17;
  cursor: pointer;
}

.header-bar-holder {
  position: relative;
}

.hover-bar {
  position: absolute;
  display: flex;
  width: calc(100% - var(--mainEdge));
  height: 100%;
  justify-content: space-between;
  pointer-events: none;
}

.hover-left,
.hover-right {
  width: 100px;
  height: 100%;
  pointer-events: all;
  z-index: 10;
}

.header-bar-container {
  position: relative;
  padding: var(--mainEdge) 0;
  -ms-overflow-style: none;
  scrollbar-width: none;
  overscroll-behavior-x: none;
  transition: opacity 0.5s ease;
}

.header-bar-blur {
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  width: var(--mainEdge);
  /* width: 100%; */
  height: 100%;
  pointer-events: none;
  background: linear-gradient(270deg, rgba(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
  /* background: linear-gradient(270deg, rgba(255, 255, 255) 0%, rgba(255, 255, 255, 0) 10%); */
}

.header-bar {
  display: flex;
  gap: var(--betweenEdge);
  white-space: nowrap;
  pointer-events: none;
  width: max-content;
  padding-right: calc(var(--mainEdge) * 2 + var(--normalEdge) + var(--nav-width));
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-overflow-style: none;
  scrollbar-width: none;
  overscroll-behavior-x: none;
}

.exhibition-link {
  display: block;
  color: rgb(0, 0, 0, 0.3);
  letter-spacing: -0.02em;
  line-height: 1.5;
}

.exhibition-link:active {
  color: var(--black);
}

.current-exhibition-link {
  display: block;
  color: var(--black);
  letter-spacing: -0.02em;
  line-height: 1.5;
}

.header-flex-content .image-container {
  width: 100%;
  height: 100%;
}

.exhibition-header-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.layout-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--mainEdge);
  direction: ltr;
  margin-bottom: var(--miniEdge);
}

.exhibition-info-column {
  margin-left: 25%;
}

.cooperation-container {
  margin-top: var(--hugeEdge);
}

.cooperation-logo-container {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: var(--biggerEdge);
  margin-top: var(--mainEdge);
}

.cooperation-logo {
  width: 150px;
}

.matrix-grid {
  margin-top: var(--enormousEdge);
}

.layout-grid .description {
  grid-column: 2 / 8;
}

.description {
  font-size: var(--fontSize2);
  line-height: var(--line-height-2);
}

.layout-block {
  position: relative;
}

.img-mid,
.text-mid-long {
  grid-column: 5/11;
}

.img-left,
.text-left-long {
  grid-column: 1/7;
}

.text-mid {
  grid-column: 6/12;
}

.text-left {
  grid-column: 1/7;
}

.slider {
  grid-column: 6/-1;
}

.slider-desc {
  grid-column: 7/-1;
}

.slider-arrows {
  grid-column: 6/7;
  display: flex;
  align-items: center;
  gap: var(--mainEdge);
}

.slider-arrow {
  width: var(--fontSize2);
  cursor: pointer;
}

.layout-slider-container {
  position: relative;
  width: 100%;
  height: 100%;
}

.layout-img {
  display: block;
  width: 100%;
}

.slider-img {
  object-fit: cover;
  display: block;
  width: 100%;
  height: 100%;
}

.slider-img:not(:first-of-type) {
  position: absolute;
  top: 0;
  visibility: hidden;
}

.layout-img-desc,
.layout-img-desc-2 {
  font-family: var(--mono);
  font-size: var(--fontSize1);
  line-height: 1.1;
  margin-top: var(--mainEdge);
}

.layout-slider-desc {
  font-family: var(--mono);
  font-size: var(--fontSize1);
  line-height: 1.1;
}

.layout-link-text,
.layout-link {
  font-family: var(--mono);
  font-size: var(--fontSize1);
  line-height: var(--line-height-4);
}

.layout-link {
  margin-top: var(--mainEdge);
}

.layout-img-desc-2 {
  /* margin-left: var(--mainEdge); */
}

.layout-text {
  font-family: var(--regular);
  font-size: var(--fontSize2);
  line-height: var(--line-height-2);
}

.description p:not(:empty, :last-of-type),
.layout-link-text p:not(:empty, :last-of-type),
.layout-text p:not(:empty, :last-of-type) {
  margin-bottom: var(--mainEdge);
}

.layout-text strong {
  font-weight: 700;
}

.layout-text a {
  text-decoration: underline;
  text-decoration-thickness: var(--underline-thickness);
  text-underline-offset: var(--underline-offset);
}

.layout-text a {
  font-style: italic;
}

.layout-text h2,
.layout-text h3 {
  margin-bottom: var(--mainEdge);
}

.left-container {
  /* margin-left: var(--mainEdge); */
}

.location-content {
  margin-top: var(--biggerEdge);
}

.tag-container {
  display: flex;
  gap: var(--smallEdge);
  flex-wrap: wrap;
}

.event-tag,
.location-tag,
.filter-tag,
.today-button {
  font-family: var(--mono);
  background: var(--white);
  font-size: var(--fontSize1);
  line-height: 1.1;
  padding: calc(var(--smallEdge) / 2) var(--smallEdge);
  border: var(--line) solid var(--black);
  border-radius: 20px;
}

.location-1 {
  background: linear-gradient(92.72deg, rgba(130, 210, 190, 0.5) 7.76%, rgba(110, 140, 240, 0.5) 32.28%, rgba(245, 40, 120, 0.5) 51.55%, rgba(250, 80, 10, 0.5) 80.75%, rgba(255, 210, 0, 0.5) 95.34%);
  border: unset;
}

.location-2 {
  background: linear-gradient(92.72deg, rgba(130, 210, 190, 0.5) 7.76%, rgba(130, 210, 190, 0.5) 51.55%, rgba(110, 140, 240, 0.5) 95.34%);
  border: unset;
}

.location-3 {
  background: linear-gradient(92.71deg, rgba(255, 210, 0, 0.5) 6.21%, rgba(250, 80, 10, 0.5) 94.18%);
  border: unset;
}

.filter-tag {
  background: rgb(0, 0, 0, 0.1);
  border: unset;
}

.duration {
  grid-column: span 2;
}

.opening-hours {
  grid-column: span 3;
}

.location-content .layout-grid {
  margin-top: var(--biggerEdge);
}

.opening-hours,
.location-address {
  font-family: var(--mono);
  font-size: var(--fontSize1);
  line-height: 1.1;
}

.opening-hours-overview {
  margin-top: var(--mainEdge);
}

.location-subheading {
  text-decoration: underline;
  text-decoration-thickness: var(--underline-thickness);
  text-underline-offset: var(--underline-offset);
}

.location-address {
  grid-column: span 3;
}

.location-address .location-subheading:not(:first-of-type) {
  margin-top: calc(var(--fontSize1) * 1.1);
}

.maps-link {
  font-family: var(--mono);
  font-size: var(--fontSize1);
  display: block;
  margin-top: var(--biggerEdge);
}

.maps-link span {
  text-decoration: underline;
  text-decoration-thickness: var(--underline-thickness);
  text-underline-offset: var(--underline-offset);
}

.link-container {
  grid-column: span 3;
}

.link-container>* {
  display: list-item;
}

.share-button {
  position: relative;
  cursor: pointer;
}

.partner-link-container {
  margin-top: var(--giantEdge);
}

.partner-link-container .project-link:not(:first-of-type) {
  margin-top: var(--mainEdge);
}

.related-events {
  display: grid;
  gap: 0 var(--hugeEdge);
  grid-template-columns: repeat(2, 1fr);
  margin-top: var(--hugeEdge);
}

.related-events .event:nth-child(2) {
  border-top: var(--line) solid rgb(0, 0, 0, 0.3);
}

.event-flex {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: var(--mainEdge);
}

.event-flex .project-link span {
  width: max-content;
}

/* ARTISTS */

nav {
  position: sticky;
  top: calc((var(--mainEdge) + var(--fontSize2) * 1.17) * -1);
  background: linear-gradient(180deg, rgba(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
  z-index: 99;
}

.header-background-blur {
  position: absolute;
  top: 0;
  width: 100%;
  height: var(--nav-height);
  background: rgba(217, 217, 217, 0.05);
  backdrop-filter: blur(30px);
  mask-image: linear-gradient(rgb(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
  /* mask-image: linear-gradient(rgb(0, 0, 0) 55%, rgba(0, 0, 0, 0.8) 70%, rgba(0, 0, 0, 0) 100%); */
}

.letter {
  cursor: pointer;
  color: rgb(0, 0, 0, 0.3);
}

.letter.active {
  cursor: default;
  color: var(--black);
}

.letter-container .artist-container {
  padding-top: var(--mainEdge);
}

.letter-container:first-of-type .artist-container:first-of-type {
  padding-top: unset;
}

.letter-container {
  color: rgb(0, 0, 0, 0.3);
}

.letter-container.active {
  color: var(--black);
}

.artist-section {
  margin-top: var(--bigEdge);
}

.artist-section .section-content {
  padding-bottom: var(--mainEdge);
}

.artist-container.active {
  color: var(--black);
}

.artist-container h1 {
  display: inline-block;
}

.artist-name {
  cursor: pointer;
}

.artist-name:hover,
.artist-name:focus,
.artist-name:active {
  color: var(--black);
}

.artist-content {
  display: none;
  margin: var(--bigEdge) 0;
}

.artist-content-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--mainEdge);
}

.artist-image-container {
  position: relative;
  grid-column: 2/5;
}

.artist-image {
  display: block;
  width: 100%;
  aspect-ratio: 10/12;
  object-fit: cover;
}

.artist-info-container {
  position: relative;
  grid-column: 6/10;
}

.artist-info-margin {
  margin-top: calc(var(--betweenEdge));
}

.artist-desc,
.location-desc {
  font-family: var(--regular);
  font-size: var(--fontSize2);
  line-height: var(--line-height-2);
}

.artist-links {
  font-family: var(--mono);
  font-size: var(--fontSize1);
  line-height: 1;
  margin-top: var(--biggerEdge);
}

.artist-links .artist-link {
  display: block;
  width: max-content;
}

.artist-link:first-of-type {
  margin-top: var(--miniEdge);
}

/* VENUE */

.main-venue {
  margin-bottom: calc(var(--enormousEdge) * 2);
}

.main-venue.first-venue .location-image-container,
.main-venue.even-venue .location-image-container {
  position: relative;
  grid-column: 1/11;
}

.main-venue.odd-venue .location-image-container {
  position: relative;
  grid-column: 2/12;
}

.location-image {
  display: block;
  width: 100%;
  aspect-ratio: 100/59;
  object-fit: cover;
}

.main-venue .layout-grid:not(:first-of-type) {
  margin-top: var(--biggerEdge);
}

.main-venue.first-venue .layout-grid .column:first-of-type,
.main-venue.even-venue .layout-grid .column:first-of-type {
  grid-column: 1/4;
}

.main-venue.odd-venue .layout-grid .column:first-of-type {
  grid-column: 2/5;
}

.main-venue.first-venue .layout-grid .column:nth-child(2),
.main-venue.even-venue .layout-grid .column:nth-child(2) {
  grid-column: 5/11;
}

.main-venue.odd-venue .layout-grid .column:nth-child(2) {
  grid-column: 6/12;
}

.location-desc,
.all-events-button,
.all-events-list {
  margin-top: var(--hugeEdge);
}

.partner-locations {
  width: 100%;
  margin-top: var(--hugeEdge);
}

.partner-location:first-of-type {
  border-top: var(--line) solid rgb(0, 0, 0, 0.3);
}

.partner-location {
  width: 100%;
  padding: var(--mainEdge) 0;
  align-items: center;
  border-bottom: var(--line) solid rgb(0, 0, 0, 0.3);
}

.partner-location-title {
  letter-spacing: -0.02em;
  grid-column: 1/6;
}

.partner-location-address {
  display: flex;
  gap: var(--biggerEdge);
  grid-column: 6/10;
  margin-left: var(--bigEdge);
}

.partner-location-link {
  grid-column: 10/12;
  margin-left: auto;
}

.partner-location-address,
.partner-location-link {
  font-family: var(--mono);
  font-size: var(--fontSize1);
  line-height: 1.1;
}

/* ABOUT */

.about-content {
  padding: 0 var(--mainEdge);
}

.about-section:first-of-type {
  margin-top: var(--bigEdge);
}

.about-section {
  margin-bottom: calc(var(--enormousEdge) * 3);
}

.about-section-title,
.team-member-task {
  font-family: var(--mono);
  font-size: var(--fontSize1);
  line-height: 1.1;
}

.about-section-title {
  margin-top: var(--biggerEdge);
}

.mission-container:not(:first-of-type) {
  margin-top: calc(var(--enormousEdge) * 1.5);
}

.mission-container:first-of-type h1 {
  grid-column: 1/6;
}

.mission-container:nth-of-type(2) h1 {
  grid-column: 4/11;
}

.mission-container:nth-of-type(3) h1 {
  grid-column: 2/-2;
  padding: 0 var(--hugeEdge);
}

.mission-container:first-of-type .mission-desc {
  grid-column: 1/-4;
}

.mission-container:nth-of-type(2) .mission-desc {
  grid-column: 4/12;
}

.mission-container:nth-of-type(3) .mission-desc {
  grid-column: 2/-2;
  padding: 0 var(--hugeEdge);
}

.mission-desc,
.press-text {
  font-family: var(--regular);
  font-size: var(--fontSize3);
  line-height: var(--line-height-3);
  letter-spacing: -0.02em;
  margin-top: var(--biggerEdge);
}

.mission-desc p:not(:first-of-type) {
  margin-top: var(--fontSize3);
}

.about-section:nth-of-type(2) .about-section-title,
.team-image-container {
  grid-column: 2/12;
}

.team-image-container {
  margin-top: var(--mainEdge);
}

.team-image {
  width: 100%;
}

.team-member-content {
  margin-top: var(--enormousEdge);
}

.main-member:not(:first-of-type) {
  margin-top: var(--hugeEdge);
}

.team-member-name {
  margin-top: var(--smallEdge);
}

.team-member-content:nth-of-type(2) {
  margin-top: calc(var(--enormousEdge) + var(--hugeEdge));
}

.main-member .layout-grid {
  margin-top: var(--normalEdge);
}

.member-image-container {
  grid-column: 2/5;
}

.member-image {
  display: block;
  width: 100%;
  aspect-ratio: 100/131;
  object-fit: cover;
}

.member-desc-container {
  grid-column: 6/12;
  padding-right: var(--hugeEdge);
}

.member-desc {
  font-size: var(--fontSize2);
  line-height: var(--line-height-2);
  margin-top: var(--hugeEdge);
}

.member-mail {
  font-family: var(--mono);
  font-size: var(--fontSize1);
  margin-top: var(--smallEdge);
  line-height: 1.17;
}

.main-member .member-mail {
  margin-top: var(--biggerEdge);
}

.member-desc p:not(:first-of-type) {
  margin-top: calc(var(--fontSize2) * 1.1);
}

.member-grid {
  grid-column: 1/12;
  display: grid;
  padding-right: var(--hugeEdge);
  gap: var(--enormousEdge);
  grid-template-rows: auto 1fr;
  grid-template-columns: repeat(3, 1fr);
}

/* .member:first-of-type{
  grid-column: 1/4;
}
.member:nth-of-type(2){
  grid-column: 5/8;
}
.member:nth-of-type(3){
  grid-column: 9/12;
} */
.member .team-member-name {
  line-height: 1;
  letter-spacing: -0.05em;
  font-size: var(--fontSize6);
}

.member .member-image {
  margin-top: var(--mainEdge);
}

.press-text {
  grid-column: 1/10;
}

.press-contact-container {
  margin-top: var(--giantEdge);
}

.layout-grid .contact {
  grid-column: span 4;
}

/* .layout-grid .contact:first-of-type{
  grid-column: 1/4;
} */
/* .layout-grid .contact:nth-child(2){
  grid-column: 5/8;
} */
/* .layout-grid .contact:nth-child(3){
  grid-column: 9/12;
} */
.contact .link-to {
  font-family: var(--mono);
  font-size: var(--fontSize1);
  line-height: 1.1;
}

.about-section:nth-of-type(4) .about-section-title {
  grid-column: 1/12;
}

.contact-container {
  margin-top: var(--hugeEdge);
}

/* GLOSSAR */

.glossar-main-section {
  margin-top: var(--bigEdge);
}

#glossar .section-content {
  padding-bottom: unset;
}

.glossar-section {
  grid-column: 1/12;
}

.glossar-grid {
  display: block;
  padding-top: var(--hugeEdge);
  /* gap: calc(var(--enormousEdge) + var(--hugeEdge)) var(--hugeEdge);
  grid-template-columns: repeat(3, 1fr); */
}

.glossar-section:first-of-type .glossar-grid:first-of-type {
  padding-top: unset;
}

.glossar-section:not(:first-of-type) .glossar-grid {
  border-top: var(--line) solid rgb(0, 0, 0, 0.3);
}

.glossar-section:not(:first-of-type) {
  margin-top: var(--hugeEdge);
  /* margin-top: calc(var(--enormousEdge) * 2); */
}

.glossar-block {
  width: calc(33.3% - var(--hugeEdge) / 1.5);
  margin-bottom: calc(var(--enormousEdge) + var(--hugeEdge));
}

.gutter-sizer {
  width: var(--hugeEdge);
}

.glossar-desc {
  font-family: var(--regular);
  font-size: var(--fontSize1);
  line-height: 1.1;
  width: 100%;
  margin-top: var(--biggerEdge);
}

.glossar-desc p:not(:first-of-type) {
  margin-top: calc(var(--fontSize1) * 1.1);
}

.glossar-block .artist-links .artist-link {
  display: block;
  width: max-content;
  margin-top: var(--miniEdge);
}

.glossar-img {
  display: block;
  width: 100%;
  margin-top: var(--biggerEdge);
}

/* SPONSORS */
.sponsor-site-heading {
  grid-column: 1/11;
  line-height: 1 !important;
}

.sponsor-desc {
  grid-column: 1/11;
  font-family: var(--regular);
  font-size: var(--fontSize3);
  line-height: var(--line-height-3);
  letter-spacing: -0.02em;
  margin-top: var(--biggerEdge);
}

.sponsor-section {
  margin-top: calc(var(--enormousEdge) * 3);
}

.sponsor-content {
  position: relative;
  width: 100%;
}

.sponsor-container {
  display: grid;
  gap: calc(var(--enormousEdge) + var(--hugeEdge)) var(--mainEdge);
  grid-template-columns: repeat(2, 1fr);
  margin-top: var(--biggerEdge);
}

.sponsor-matrix {
  display: block;
  padding-top: var(--biggerEdge);
  border-top: var(--line) solid rgb(0, 0, 0, 0.3);
}

.sponsor-matrix .sponsor-logo {
  width: 33%;
}

.sponsor-matrix .sponsor-logo img {
  display: block;
  width: 100%;
}

.sponsor-matrix .sponsor-grid {
  display: grid;
  gap: var(--mainEdge);
  grid-template-columns: repeat(6, 1fr);
  margin-top: var(--hugeEdge);
}

.sponsor-matrix .sponsor-description {
  grid-column: 1/6;
  font-family: var(--regular);
  font-size: var(--fontSize2);
  line-height: var(--line-height-2);
}

.sponsor-matrix .partner-link-container {
  margin-top: var(--hugeEdge);
  margin-right: var(--hugeEdge);
}

/* FAQ */

#faq {
  min-height: 100vh;
}

.faq-site-heading,
.press-site-heading,
.sponsor-site-heading {
  margin-top: var(--bigEdge);
}

.faq-grid {
  margin-top: var(--hugeEdge);
}

#faq .faq-list {
  margin-top: unset;
  grid-column: 1/12;
}

#faq .question {
  width: 100%;
  justify-content: space-between;
}

.question {
  cursor: pointer;
}

/* PRESS */

.press-section:not(:first-of-type) {
  margin-top: calc(var(--enormousEdge) * 2);
}

.press-element {
  margin-top: var(--biggerEdge);
}

.press-element .press-grid-element {
  grid-column: 1/7;
}

.press-element-2,
.press-element-3 {
  margin-top: calc(var(--enormousEdge) * 1.5);
}

.press-element-2 .press-grid-element {
  grid-column: 6/12;
}

.press-element-3 .press-grid-element {
  grid-column: 3/9;
}

.press-element-desc,
.imprint-element-desc {
  font-size: var(--fontSize3);
  line-height: var(--line-height-3);
  letter-spacing: -0.02em;
}

.press-grid-element .link-to {
  line-height: 1.3;
}

.press-grid-element .link-to:first-of-type {
  margin-top: var(--bigEdge);
}

.press-contact {
  margin-top: var(--hugeEdge);
}

.press-section .event-flex {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: var(--mainEdge);
}

.press-section .event-title {
  grid-column: 1/5;
}

.press-section .ticket-link {
  grid-column: 6/-1;
}

/* WORKSHOPS */
.workshop-element {
  margin-top: var(--biggerEdge);
}

.workshop-element-2,
.workshop-element-3 {
  margin-top: calc(var(--enormousEdge) * 1.5);
}

.workshop-element .workshop-grid-element {
  grid-column: 1/-4;
}

.workshop-element-2 .workshop-grid-element {
  grid-column: 4/12;
}

.workshop-element-3 .workshop-grid-element {
  grid-column: 2/-2;
}

.workshop-grid-element .link-to:first-of-type {
  margin-top: var(--bigEdge);
}

#workshops .press-element-desc {
  margin-top: var(--biggerEdge);
}

#workshops .press-element-desc p:not(:first-of-type) {
  margin-top: var(--fontSize3);
}

.workshop-section {
  margin-top: calc(var(--enormousEdge) * 2);
}

.all-events-list .event {
  padding: var(--mainEdge)0;
}

/* IMPRINT */
.imprint-section:not(:first-of-type) {
  margin-top: calc(var(--enormousEdge) * 2);
}

.imprint-grid-element {
  grid-column: 1/12;
}

.imprint-element-desc p:not(:first-of-type) {
  margin-top: var(--fontSize3);
}


/* 404 */

#not-found {
  height: 100vh;
  height: var(--doc-height);
}

.not-found-flex {
  position: relative;
  display: flex;
  width: 100%;
  height: 100%;
  flex-direction: column;
  justify-content: space-between;
  padding: var(--mainEdge);
}

#not-found .nav-flex {
  padding-top: var(--biggerEdge);
}

#not-found .nav-content {
  position: fixed;
  right: calc(var(--enormousEdge) + var(--smallEdge));
  transform: rotate(-15deg);
  transform-origin: right top;
}


/* FOOTER */

footer {
  position: relative;
  color: var(--white);
  background: var(--black);
  font-family: var(--mono);
  font-size: var(--fontSize1);
  line-height: 1.17;
  z-index: 99;
}

footer a,
footer a:hover,
footer a:active {
  color: var(--white);
}

.footer-margin {
  margin-top: calc(var(--enormousEdge) * 3);
}

.glossar-footer-margin {
  margin-top: calc(var(--enormousEdge) * 1.5);
}

.footer-content {
  position: relative;
  width: 100%;
  padding: var(--mainEdge) var(--mainEdge) var(--hugeEdge) var(--mainEdge);
}

.footer-grid {
  display: grid;
  width: 100%;
  gap: var(--mainEdge);
  grid-template-columns: 1fr 1fr 1fr 1fr;
}

.footer-logo {
  width: 60%;
}

.footer-container-flex {
  display: flex;
  gap: var(--mainEdge);
}

.footer-container-flex>* {
  position: relative;
  width: 40%;
}

.footer-container-grid {
  display: grid;
  grid-template-columns: auto auto;
  grid-template-rows: auto auto;
  gap: var(--giantEdge) var(--mainEdge);
  align-items: center;
  justify-content: flex-start;
}

.sponsor-logo {
  width: 100px;
}


/* ANIMATED LOGO */

@keyframes title-animation-1 {
  0% {
    letter-spacing: calc(var(--letter-spacing-l)*var(--letter-spacing-factor));
    padding-right: 1%;
  }

  20% {
    letter-spacing: 0rem;
    padding-right: 0%;
  }

  40% {
    letter-spacing: 0rem;
    padding-right: 0%;
  }

  60% {
    letter-spacing: calc(var(--letter-spacing-l)*var(--letter-spacing-factor));
    padding-right: 0%;
  }

  80% {
    letter-spacing: calc(var(--letter-spacing-s)*var(--letter-spacing-factor));
    padding-right: 0%;
  }

  100% {
    letter-spacing: calc(var(--letter-spacing-l)*var(--letter-spacing-factor));
    padding-right: 1%;
  }
}

@keyframes title-animation-2 {
  0% {
    letter-spacing: calc(var(--letter-spacing-s)*var(--letter-spacing-factor));
    padding-right: 2%;
  }

  20% {
    letter-spacing: calc(var(--letter-spacing-m)*var(--letter-spacing-factor));
    padding-right: 1%;
  }

  40% {
    letter-spacing: calc(var(--letter-spacing-l)*var(--letter-spacing-factor));
    padding-right: 1%;
  }

  60% {
    letter-spacing: calc(var(--letter-spacing-xs)*var(--letter-spacing-factor));
    padding-right: 0%;
  }

  80% {
    letter-spacing: calc(var(--letter-spacing-xs)*var(--letter-spacing-factor));
    padding-right: 0%;
  }

  100% {
    letter-spacing: calc(var(--letter-spacing-s)*var(--letter-spacing-factor));
    padding-right: 2%;
  }
}

@keyframes title-animation-3 {
  0% {
    letter-spacing: calc(var(--letter-spacing-s)*var(--letter-spacing-factor));
  }

  20% {
    letter-spacing: 0rem;
  }

  40% {
    letter-spacing: 0rem;
  }

  60% {
    letter-spacing: calc(var(--letter-spacing-l)*var(--letter-spacing-factor));
  }

  80% {
    letter-spacing: calc(var(--letter-spacing-xs)*var(--letter-spacing-factor));
  }

  100% {
    letter-spacing: calc(var(--letter-spacing-s)*var(--letter-spacing-factor));
  }
}

.animated-title-1 {
  animation: title-animation-1 4s infinite ease;
}

.animated-title-2 {
  animation: title-animation-2 4s infinite ease;
}

.animated-title-3 {
  animation: title-animation-3 4s infinite ease;
}

.desktop {
  display: block;
}

.mobile {
  display: none;
}


@media only screen and (max-width: 1600px) {
  :root {
    --fontSize4: 40px;
    --fontSize5: 64px;
  }

  .days {
    width: max-content;
  }
}

@media only screen and (max-width: 1400px) {
  :root {
    --fontSize3: 28px;
    --fontSize6: 32px;
    --fontSize4: 36px;
    --fontSize5: 58px;
  }

  .member-grid {
    gap: var(--hugeEdge);
    padding-right: unset;
  }
}


@media only screen and (max-width: 1200px) {
  :root {
    --fontSize3: 26px;
    --fontSize6: 38px;
    --fontSize4: 32px;
    --fontSize5: 52px;
  }

  .member-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--enormousEdge);
    padding-right: var(--hugeEdge);
  }
}

@media only screen and (max-width: 1000px) {
  .desktop {
    display: none;
  }

  .mobile {
    display: block;
  }

  /* NAV */
  .nav-content {
    transition: unset;
    width: 65px;
    height: 260px;
  }

  .nav-content .layout-grid {
    padding: var(--mainEdge);
  }

  .nav-flex {
    padding: var(--mainEdge);
  }

  .main-nav-grid {
    display: block;
  }

  .close {
    width: var(--biggerEdge);
  }

  .nav-block {
    margin-top: var(--betweenEdge);
  }

  .nav-link:not(.low-prio) {
    line-height: 1;
  }

  .nav-block:not(.mobile-grid) .nav-link:not(:first-child) {
    margin-top: var(--miniEdge);
  }

  .mobile-grid {
    display: grid;
    grid-template-rows: 1fr 1fr;
    gap: var(--miniEdge);
  }

  .nav-grid-grid {
    grid-template-columns: 1fr 1fr;
  }

  .nav-link.low-prio {
    line-height: 1;
  }

  #container canvas {
    width: 300vw !important;
    height: 300vh !important;
  }

  /* HOME */
  .header-content-container {
    display: block;
  }

  .api-text span:not(#location, #time) {
    display: block;
  }

  .two-column,
  .list-heading {
    display: block;
  }

  .list-heading .faq-link-container:first-of-type {
    margin-top: var(--mainEdge);
  }

  .list-heading .program-link,
  .list-heading .project-link:first-of-type {
    margin-top: var(--mainEdge);
  }

  .list {
    margin-top: var(--biggerEdge);
  }

  .mobile-limit {
    display: none;
  }

  .calendar:not(:first-of-type) {
    margin-top: var(--hugeEdge);
  }

  .column-10,
  .column-60,
  .column-40,
  .column-60-reverse,
  .column-40-reverse {
    grid-column: 1/-1;
  }

  .exhibition-date {
    margin-left: unset;
  }

  .exhibition-date br,
  .project-date br {
    display: none;
  }

  .project-link-container {
    margin-top: var(--biggerEdge);
  }

  .ticket-cta-container {
    margin-top: var(--enormousEdge);
  }

  .ticket-element {
    width: 75vw;
    height: 75vw;
  }

  .ticket-element-text {
    width: 60%;
    font-size: var(--fontSize5);
  }

  .question {
    justify-content: space-between;
    width: unset;
  }

  .project-slider-project {
    width: 75vw;
  }

  .product-list {
    gap: var(--smallEdge);
  }

  .product {
    width: 75vw;
  }

  /* ABOUT */
  .about-section {
    margin-bottom: var(--enormousEdge);
  }

  .mission-container .layout-grid {
    display: block;
  }

  .mission-container:not(:first-of-type) {
    margin-top: calc(var(--hugeEdge) + var(--mainEdge));
  }

  .mission-container h1,
  .mission-container .mission-desc {
    padding: unset !important;
  }

  .team-image-container {
    grid-column: 1/-1;
  }

  .main-member .layout-grid {
    display: block;
  }

  .member-desc-container {
    padding: unset;
  }

  .member-desc {
    margin-top: var(--biggerEdge);
  }

  .main-member:not(:first-of-type),
  .member:not(:first-of-type) {
    margin-top: var(--enormousEdge);
  }

  .team-member-content .layout-grid {
    display: block;
  }

  .member-grid {
    display: block;
    padding: unset;
  }

  #press-section .layout-grid,
  #contact-section .layout-grid {
    display: block;
  }

  .contact:not(:first-of-type) {
    margin-top: var(--hugeEdge);
  }

  /* VENUES */
  .main-venue {
    margin-bottom: var(--enormousEdge);
  }

  .main-venue .layout-grid {
    display: flex;
    flex-direction: column;
    gap: var(--biggerEdge);
  }

  .location-overview-section .main-venue .layout-grid {
    flex-direction: column-reverse;
  }

  .location-desc,
  .all-events-button,
  .all-events-list {
    margin-top: var(--biggerEdge);
  }

  .partner-locations {
    margin-top: var(--biggerEdge);
  }

  .partner-locations .layout-grid {
    display: block;
  }

  .partner-location-address {
    display: block;
    margin-left: unset;
  }

  .partner-location-address .barrier-contaier {
    margin-top: var(--mainEdge);
  }

  .partner-location-address,
  .partner-location-link {
    margin-top: var(--normalEdge);
  }

  .partner-location-address .barrier-free {
    margin-top: var(--mainEdge);
  }

  /* EXHIBITIONS */
  .exhibition-section:first-of-type {
    margin-bottom: var(--hugeEdge);
  }

  .header-flex-content {
    height: unset;
  }

  .project-image,
  .exhibition-header-image {
    aspect-ratio: 100/75;
  }

  .exhibition-section-content {
    padding: 0 var(--mainEdge);
  }

  .project-info-grid {
    display: block;
  }

  .project-info-list-container {
    margin-top: var(--biggerEdge);
  }

  .exhibition-section-content h3 br {
    display: none;
  }

  .cooperation-container {
    margin-top: var(--biggerEdge);
  }

  .cooperation-logo-container {
    flex-direction: column;
  }

  #grid-section .layout-grid {
    display: block;
  }

  .layout-img-desc-2 {
    margin-left: unset;
  }

  .location-content .layout-grid {
    margin-top: var(--betweenEdge);
    display: block;
  }

  .location-content .location-address,
  .location-content .maps-link {
    margin-top: var(--biggerEdge);
  }

  .location-content .link-container {
    margin-top: var(--betweenEdge);
  }

  .location-content .partner-link-container {
    margin-top: var(--betweenEdge);
  }

  .related-events {
    display: block;
    margin-top: var(--biggerEdge);
  }

  .event {
    padding: var(--mainEdge) 0;
  }

  .related-events .event:nth-child(2) {
    border-top: unset;
  }

  .event-flex {
    display: block;
  }

  .event-flex .project-link {
    margin-top: var(--normalEdge);
  }

  .event-flex .ticket-link {
    margin-top: var(--normalEdge);
  }

  .slider-arrows,
  .slider-desc {
    margin-top: var(--mainEdge);
  }

  /* PROGRAM */
  .program-grid {
    grid-template-columns: repeat(6, 1fr);
  }

  .condensed-map {
    grid-column: 6/-1;
  }

  .expanded-map {
    grid-column: 1/6;
  }

  .program-event {
    padding: var(--mainEdge) 0 var(--biggerEdge);
    padding-right: var(--mainEdge);
  }

  .program-event-grid {
    display: block;
  }

  .date-time-container {
    display: flex;
    justify-content: space-between;
  }

  .program-info-container {
    margin-top: var(--biggerEdge);
  }

  .program-event-title {
    margin-top: var(--biggerEdge);
  }

  .program-event .program-info-grid {
    display: flex;
    flex-direction: column;
  }

  .program-info-container .description,
  .program-info-container .additional-info {
    margin-right: unset;
  }

  /* ARTISTS */
  .artist-content-grid {
    grid-template-columns: repeat(6, 1fr);
    gap: var(--betweenEdge);
  }

  .artist-image-container {
    grid-column: 2/-1;
  }

  .artist-info-container {
    grid-column: 1/-1;
    margin-top: unset;
  }

  /* WORKSHOP */
  .workshop-element-2,
  .workshop-element-3 {
    margin-top: var(--hugeEdge);
  }

  .workshop-element .layout-grid,
  .workshop-element-2 .layout-grid,
  .workshop-element-3 .layout-grid {
    display: block;
  }

  .workshop-section {
    margin-top: var(--enormousEdge);
  }

  /* PRESS */
  .press-section:not(:first-of-type) {
    margin-top: var(--enormousEdge);
  }

  .press-element .layout-grid,
  .press-element-2 .layout-grid,
  .press-element-3 .layout-grid {
    display: block;
  }

  .press-element-2,
  .press-element-3 {
    margin-top: var(--hugeEdge);
  }

  .press-grid-element .link-to {
    margin-top: var(--normalEdge);
  }

  .press-contact .layout-grid {
    display: block;
  }

  .press-contact,
  .press-element {
    margin-top: var(--biggerEdge);
  }

  .press-section .event-flex {
    display: block;
  }

  /* FAQ */
  .faq-grid {
    display: block;
  }

  .faq-list .layout-grid {
    display: block;
  }

  /* GLOSSAR */
  #glossar .layout-grid {
    display: block;
  }

  .glossar-section:not(:first-of-type) {
    margin-top: var(--enormousEdge);
  }

  .glossar-grid {
    display: block;
  }

  /* .glossar-block:not(:first-of-type){
    margin-top: var(--hugeEdge);
  } */
  .glossar-block {
    width: 100%;
    margin-bottom: var(--enormousEdge);
  }

  .glossar-section .glossar-block:last-of-type {
    margin-bottom: unset;
  }

  /* SPONSORS */
  .sponsor-desc {
    grid-column: 1/-1;
  }

  .sponsor-section {
    margin-top: var(--enormousEdge);
  }

  .sponsor-container {
    display: block;
  }

  .sponsor-matrix:not(:first-of-type) {
    margin-top: var(--hugeEdge);
  }

  .sponsor-matrix .sponsor-grid {
    display: block;
    margin-top: var(--biggerEdge);
  }

  /* IMPRINT */
  .imprint-section:not(:first-of-type) {
    margin-top: var(--enormousEdge);
  }


  /* FOOTER */
  .footer-margin {
    margin-top: calc(var(--enormousEdge) * 2);
  }

  .footer-content {
    padding: var(--mainEdge) var(--mainEdge) var(--bigEdge) var(--mainEdge)
  }

  .footer-grid {
    display: block;
  }

  .footer-container:nth-of-type(2),
  .footer-container:nth-of-type(4),
  .footer-container-grid {
    margin-top: var(--hugeEdge);
  }

  .footer-container:nth-of-type(3) {
    margin-top: var(--biggerEdge);
  }

  .footer-container-grid {
    width: 100%;
    gap: var(--hugeEdge);
    justify-content: unset;
  }

  .footer-container-grid>* {
    width: 50%;
  }
}

@media only screen and (max-width: 800px) {
  :root {
    --fontSize1: 14px;
    --fontSize2: 17px;
    --fontSize3: 26px;
    --fontSize6: 28px;
    --fontSize4: 28px;
    --fontSize5: 46px;
  }

  .ticket-element {
    width: calc(100vw - var(--bigEdge) * 2);
    height: calc(100vw - var(--bigEdge) * 2);
  }
}

@media only screen and (max-width: 600px) {
  :root {
    --fontSize1: 12px;
    --fontSize2: 15px;
    --fontSize3: 24px;
    --fontSize6: 26px;
    --fontSize4: 26px;
    --fontSize5: 42px;
  }
}

@media only screen and (max-width: 400px) {
  :root {
    --fontSize3: 20px;
    --fontSize6: 22px;
    --fontSize4: 22px;
    --fontSize5: 34px;
  }
}

@media only screen and (max-width: 350px) {
  :root {
    --fontSize3: 18px;
    --fontSize6: 20px;
    --fontSize4: 20px;
    --fontSize5: 30px;
  }
}


/* WRAPUP TITLE */
.wrapup-title-container {
  width: 70%;

  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;

  position: absolute;
  bottom: var(--mainEdge);

  pointer-events: none;
}

.wrapup-title-container h1 {
  font-size: 5.3em;
  display: inline-block;
  text-align: center;

  color: var(--white);
}

.wrapup-title-container h1:last-child {
  margin-left: 2em;
  flex-grow: 1;
  text-align: end;
  white-space: nowrap;
}

.wrapup-title-container h1:last-child .col-2 {
  white-space: nowrap;
}

.wrapup-title-container h1:last-child span:last-child {
  margin-right: -2em;
}

@media only screen and (max-width: 1080px) {
  .wrapup-title-container h1:last-child {
    white-space: unset;
  }
}

@media only screen and (max-width: 768px) {
  .wrapup-title-container h1 {
    font-size: 6.8em;
  }

  .wrapup-title-container {
    top: 50%;
    transform: translate(0%, -50%);
    gap: 3rem;
    align-items: center;
    height: 60%;
    width: 69%;
  }


  .wrapup-title-container h1:last-child {
    text-align: center;
    margin-left: unset;
  }

  .wrapup-title-container h1:last-child span:last-child {
    margin-right: -2em;
    display: inline-block;
    margin-top: 3rem;
  }

  .wrapup-title-container h1:last-child .col-2 {
    display: block;
    width: 100%;
  }
}