:root {
  /* METRICS */
  --height: 80vh;
  --width: calc(var(--height) / 2.122);
  --top-margin: 10vh;
  /* COLORS */
  --lighter-orange: rgb(252, 100, 3, 0.9);
  --orange: rgb(227, 88, 3, 0.9);
  --script-orange: #fc924c;
  --lighter-script-orange: #ffc9a6;
  --background: #181818;
  --font-color: #fff;
  /* TEXT */
  --font-size: 20px;
  --line-height: 28px;
}

html {
  scroll-behavior: smooth;
}

.link,
a {
  padding: 1px 2px;
  color: lime;
}

em {
  font-style: italic;
}

body {
  min-height: 100vh;
  padding: var(--top-margin) 0 0 calc((100% - var(--width)) / 2);
  background: var(--background);
  color: var(--font-color);
  font-size: var(--font-size);
  line-height: var(--line-height);
  font-family: "Arial", "arial", "Helvetica", "helvetica", sans-serif;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body.transforming {
  overflow: hidden;
}

header {
  position: fixed;
  z-index: 9999;
  padding: calc(var(--line-height) / 2);
  display: flex;
  flex-wrap: wrap;
  top: 0;
  left: 0;
}
header h1 {
  margin-right: var(--line-height);
}
header nav {
  display: flex;
}

.flyers {
  transform: scale(1);
  transition: transform 1s;
  transform-style: preserve-3d;
}

.flyer {
  position: absolute;
  display: block;
  filter: drop-shadow(0 0 10px black);
  transform-origin: calc(var(--width) / 2) calc(var(--height) / 2);
  transition: transform 1s;
}
.flyer .paper {
  height: var(--height);
  width: var(--width);
  display: inline-block;
  perspective: calc(var(--height) * 2);
  position: absolute;
}
.flyer .paper .content {
  background: var(--orange);
  height: var(--height);
  text-align: center;
  transition: transform 1s;
  transform-style: preserve-3d;
  transform-origin: top left;
}
.flyer .paper .content picture,
.flyer .paper .content img {
  mix-blend-mode: multiply;
}
.flyer .paper .content img {
  max-width: 100%;
  display: block;
  position: absolute;
  left: 0;
  opacity: 0.8;
}
.flyer .paper img.face2,
.flyer .paper img.face4,
.flyer .paper img.face5 {
  transform: scale(-1, 1);
}
.flyer .paper img.face5,
.flyer .paper img.face6 {
  opacity: 0.05;
}
.flyer .paper2 .content {
  background: var(--lighter-orange);
}

#program {
  padding: calc(var(--line-height) / 2);
}
#program h2 {
  color: var(--script-orange);
  width: 100%;
}
#program .date {
  color: var(--lighter-script-orange);
}
#program .date,
#program .event,
#program ul,
#program h2,
#program p {
  margin-bottom: var(--line-height);
}
#program ul,
#program p {
  max-width: calc(var(--line-height) * 18);
}
#program .text p:last-of-type {
  margin-bottom: 0;
}

#logo a, #logo img {
  display: block;
  width: 100%;
}

#credits {
  font-size: calc(var(--font-size) * 0.6);
  line-height: calc(var(--line-height) * 0.6);
}

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