:root {
  --white: #fff;
  --black: #000;
  --green: #0f0;
  --grey: #aaa;
  --margin: .9rem;
  --075: .75;
  --075: 1;
}

.colorblack {
  color: var(--black) !important;
}

@font-face {
  font-family: Trainer;
  src: url("TrainerGrotesk-Regular.8455e1fe.woff2") format("woff2"), url("TrainerGrotesk-Regular.fce27dd7.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: Trainer;
  src: url("TrainerGrotesk-RegularItalic.8d0cf80d.woff2") format("woff2"), url("TrainerGrotesk-RegularItalic.e943e316.woff") format("woff");
  font-weight: normal;
  font-style: italic;
}

*, :after, :before {
  color: inherit;
  box-sizing: inherit;
  vertical-align: baseline;
  text-underline-offset: 3px;
  font: inherit;
  font-size: inherit;
  line-height: inherit;
  margin: 0;
  padding: 0;
}

::-moz-selection {
  color: var(--white);
  background-color: rgba(0, 0, 0, .99);
}

::selection {
  color: var(--white);
  background-color: rgba(0, 0, 0, .99);
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 7rem;
  font-family: Trainer, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Open Sans, Helvetica Neue, sans-serif;
  font-size: 10px;
}

@media only screen and (max-width: 93.75em) {
  html {
    font-size: 8px;
  }
}

@media only screen and (max-width: 65.5em) {
  html {
    font-size: 10px;
  }
}

@media only screen and (max-width: 23.4375em) {
  html {
    font-size: 8px;
  }
}

body {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

a, a:link, a:visited {
  text-decoration: none;
}

img {
  width: 100%;
  height: auto;
  display: block;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-smooth: subpixel-antialiased;
}

:root {
  --base-font-size: 2.3rem;
  --baseline-grid: 3.6rem;
  --base-letter-spacing: .046rem;
  --s-font-size: 0;
}

@media only screen and (max-width: 65.5em) {
  :root {
    --base-font-size: 1.5rem;
    --baseline-grid: 2.3rem;
    --base-letter-spacing: .06rem;
  }
}

.text {
  font: normal normal normal var(--base-font-size) / var(--baseline-grid) "Trainer";
  letter-spacing: var(--base-letter-spacing);
  -ms-hyphens: auto;
  hyphens: auto;
}

.text h1, .text h2, .text h3, .text h4, .text h5, .text h6 {
  font-weight: normal;
}

.text h1 {
  letter-spacing: .146rem;
  max-width: 115rem;
  margin-bottom: var(--baseline-grid);
  margin-bottom: calc(.5 * var(--baseline-grid) );
  font-size: 7.3rem;
  line-height: 7.8rem;
  position: relative;
  left: -.4rem;
}

@media only screen and (max-width: 65.5em) {
  .text h1 {
    letter-spacing: 2.28px;
    letter-spacing: 1.4px;
    word-break: break-word;
    font-size: 3.5rem;
    line-height: 4.6rem;
  }
}

.text h2 {
  text-transform: uppercase;
  letter-spacing: .23rem;
}

@media only screen and (max-width: 65.5em) {
  .text h2 {
    letter-spacing: 1.5px;
  }
}

.text h3 {
  font-style: italic;
}

.text h4 {
  text-transform: uppercase;
  letter-spacing: .16rem;
  font-size: 1.6rem;
}

.text--meta {
  letter-spacing: .064rem;
  font-size: 1.6rem;
  line-height: 2.5rem;
}

@media only screen and (max-width: 65.5em) {
  .text--meta {
    font-size: var(--base-font-size);
    line-height: var(--baseline-grid);
    letter-spacing: var(--base-letter-spacing);
  }
}

.text--meta h4 {
  letter-spacing: .12rem;
  font-size: 1.2rem;
}

@media only screen and (max-width: 65.5em) {
  .text--meta h4 {
    letter-spacing: .1rem;
    font-size: 1rem;
    line-height: 2.3rem;
  }
}

.text em {
  font-style: italic;
}

@media only screen and (max-width: 65.5em) {
  .text p, .text ul, .text ol {
    max-width: 80ch;
  }
}

.text-container {
  max-width: 95rem;
}

.text-container div:last-child {
  margin-bottom: 0 !important;
}

.text-container h3 {
  font-size: inherit;
  text-transform: uppercase;
  letter-spacing: .23rem;
  font-style: normal;
}

@media only screen and (max-width: 65.5em) {
  .text-container h3 {
    letter-spacing: .15rem;
  }
}

.text-container__list {
  margin-bottom: var(--baseline-grid);
}

.text-container__list ol {
  counter-reset: item;
  list-style-type: none;
}

.text-container__list ol, .text-container__list ul, .text-container__list li {
  display: block;
}

.text-container__list ol li:before {
  content: counter(item) "  ";
  counter-increment: item;
  font-feature-settings: "ss03" 3;
}

.text-container__list ul {
  list-style-type: circle;
}

.text-container__list ul > li:before {
  content: "●";
  padding-right: 5px;
  position: relative;
}

.text-container p:not(:last-child) {
  margin-bottom: var(--baseline-grid);
}

@media only screen and (max-width: 65.5em) {
  .text-container p, .text-container ul, .text-container ol {
    max-width: 80ch;
  }
}

.text-container figcaption {
  max-width: 30rem;
  letter-spacing: .64px;
  color: var(--grey);
  margin-left: calc(2 * var(--baseline-grid) );
  margin-bottom: var(--baseline-grid);
  cursor: pointer;
  -ms-hyphens: auto;
  hyphens: auto;
  font-size: 1.6rem;
  line-height: 2.5rem;
}

.text-container figcaption:before {
  content: "↗";
  padding-right: .25rem;
}

@media only screen and (max-width: 65.5em) {
  .text-container figcaption:before {
    content: "";
    all: unset;
  }
}

@media only screen and (max-width: 65.5em) {
  .text-container figcaption {
    letter-spacing: .04rem;
    max-width: 50%;
    margin-left: 0;
    margin-top: calc(.5 * var(--baseline-grid) );
    font-size: 1rem;
    line-height: 1.4rem;
  }
}

.text-container figcaption:hover {
  color: var(--black);
}

@media only screen and (max-width: 65.5em) {
  .text-container figcaption:hover {
    color: var(--grey);
    cursor: auto;
  }
}

.text-container .footnote {
  color: var(--green);
}

.text-container .footnote a:before {
  content: "";
}

.text-container sup {
  vertical-align: baseline;
  padding-left: .25rem;
  font-size: 1.6rem;
  position: relative;
  top: -.8rem;
}

@media only screen and (max-width: 65.5em) {
  .text-container sup {
    font-size: 1.1rem;
  }
}

.text-container__authorship {
  letter-spacing: .12rem;
  font-size: 1.2rem;
  line-height: 1.8rem;
}

@media only screen and (max-width: 65.5em) {
  .text-container__authorship {
    letter-spacing: .08rem;
    font-size: 1rem;
  }
}

.footnotes-list {
  margin-top: calc(2 * var(--baseline-grid) );
  letter-spacing: .64px;
  max-width: 95rem;
  word-break: break-word;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 2.5rem;
  font: 1.6rem / 2.5rem Trainer;
  list-style: none;
  display: grid;
}

@media only screen and (max-width: 65.5em) {
  .footnotes-list {
    grid-template-columns: 1fr;
    font-size: 1.2rem;
    line-height: 1.8rem;
  }
}

.footnotes-list h4 {
  color: var(--green);
  font-size: inherit;
}

.footnotereverse {
  -webkit-transition: color .1s ease-in;
  transition: color .1s ease-in;
}

.footnotereverse:hover {
  color: var(--green);
}

.aarow a {
  background-image: linear-gradient(var(--green), var(--green) );
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 0% .2rem;
  padding-bottom: .3rem;
  -webkit-transition: background-size .2s, background-position 0s .3s;
  transition: background-size .2s, background-position 0s .3s;
  display: inline;
}

.aarow a:hover {
  background-position: 100% 100%;
  background-size: 100% .2rem;
}

@media only screen and (max-width: 65.5em) {
  .aarow a:hover {
    background-position: 0 100%;
    background-size: 0% .2rem;
  }
}

.aarow a:before {
  content: "↗";
  padding-right: .35rem;
}

.noaarow a {
  all: unset;
  cursor: pointer;
}

.noaarow a:before {
  content: "";
  padding-right: 0;
}

.noaarow a:after {
  all: unset;
}

.nowrap {
  white-space: nowrap;
}

@media only screen and (max-width: 65.5em) {
  .nowrap {
    white-space: unset;
    word-break: break-word;
  }
}

.paragraph-spacing p:not(:last-child) {
  margin-bottom: var(--baseline-grid);
}

@media only screen and (max-width: 65.5em) {
  .m-small {
    letter-spacing: 1px !important;
    font-size: 1rem !important;
    line-height: 2.3rem !important;
  }
}

.window {
  width: 100vw;
  height: 100vh;
  padding: .9rem;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

@media only screen and (max-width: 65.5em) {
  .window {
    bottom: unset;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
  }
}

.subpage {
  grid-template-rows: 11.6rem 1fr;
  gap: .9rem;
  display: grid;
}

@media only screen and (max-width: 65.5em) {
  .subpage {
    grid-template-rows: 6.9rem auto;
  }
}

@media only screen and (max-width: 65.5em) {
  .subpage--info {
    row-gap: 0;
  }
}

@media only screen and (max-width: 65.5em) {
  .subpage--post {
    grid-template-rows: auto;
  }
}

.meta-page {
  background-color: var(--green);
}

.meta-page--about {
  grid-template-columns: 1fr 1fr;
}

@media only screen and (max-width: 65.5em) {
  .meta-page--about {
    grid-template-columns: 1fr;
  }
}

.meta-page--info {
  grid-template-columns: 1fr 1fr 1fr;
}

@media only screen and (max-width: 65.5em) {
  .meta-page--info {
    grid-template-columns: 1fr;
  }
}

.post {
  background-color: var(--black);
  grid-template-columns: 66.666% 1fr;
}

@media only screen and (max-width: 65.5em) {
  .post {
    grid-template-columns: 1fr;
  }
}

.subnav {
  grid-column: 1 / -1;
  grid-template-columns: 1fr max-content 1fr;
  display: grid;
}

@media only screen and (max-width: 65.5em) {
  .subnav--post {
    background-color: var(--black);
    width: calc(100vw - .9rem);
    z-index: 100;
    padding: .9rem 0;
    -webkit-transition: -moz-transform .185s, -webkit-transform .185s, transform .185s;
    transition: -moz-transform .185s, -webkit-transform .185s, transform .185s;
    position: fixed;
    top: 0;
  }
}

.subnav__x {
  width: 4.4rem;
  height: 4.4rem;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  display: grid;
  position: relative;
  top: 2.7rem;
  left: 1.5rem;
}

@media only screen and (max-width: 65.5em) {
  .subnav__x {
    width: 2.1rem;
    height: 2.1rem;
    top: .9rem;
    left: 0;
  }
}

.subnav__x__button {
  background-color: var(--green);
}

.subnav__x__button--meta {
  background-color: var(--black);
}

.subnav__x__button:before, .subnav__x__button:after {
  content: "";
  background-color: inherit;
  height: .8rem;
  height: .4rem;
  width: 6.2rem;
  position: absolute;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
}

@media only screen and (max-width: 65.5em) {
  .subnav__x__button:before, .subnav__x__button:after {
    height: .3rem;
    width: 2.9rem;
  }
}

.subnav__x__button:after {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.subnav__meta {
  color: var(--green);
  text-align: center;
  justify-self: center;
  margin-top: 2.7rem;
  line-height: 3rem;
}

@media only screen and (max-width: 65.5em) {
  .subnav__meta--post {
    margin-top: 10rem;
    line-height: 1.9rem;
  }
}

.subnav__lang {
  color: var(--white);
  text-align: right;
  letter-spacing: .92px;
  margin-top: 2.7rem;
  padding-right: 1rem;
  position: absolute;
  right: 2.7rem;
}

.subnav__lang--meta {
  color: var(--black);
}

@media only screen and (max-width: 65.5em) {
  .subnav__lang {
    margin-top: .9rem;
    padding-right: .9rem;
    right: 0;
  }
}

.scroll-down .subnav--post {
  -webkit-transform: translate3d(0, -100%, 0);
  -moz-transform: translate3d(0, -100%, 0);
  transform: translate3d(0, -100%, 0);
}

.container {
  background-color: var(--white);
  scroll-behavior: smooth;
  -ms-overflow-style: none;
  scrollbar-width: none;
  max-height: 100%;
  -webkit-border-radius: 4rem;
  -moz-border-radius: 4rem;
  border-radius: 4rem;
  padding: 7rem;
  scroll-padding-top: 7rem;
  overflow-y: scroll;
}

@media only screen and (max-width: 65.5em) {
  .container {
    -webkit-border-radius: 3rem;
    -moz-border-radius: 3rem;
    border-radius: 3rem;
    padding: 2.4rem;
  }
}

.container::-webkit-scrollbar {
  display: none;
}

@media only screen and (max-width: 65.5em) {
  .container--info {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
  }
}

@media only screen and (max-width: 65.5em) {
  .container--info__1 {
    -webkit-border-radius: 3rem 3rem 0 0;
    -moz-border-radius: 3rem 3rem 0 0;
    border-radius: 3rem 3rem 0 0;
    margin-top: .9rem;
  }
}

@media only screen and (max-width: 65.5em) {
  .container--info__3 {
    -webkit-border-radius: 0 0 3rem 3rem;
    -moz-border-radius: 0 0 3rem 3rem;
    border-radius: 0 0 3rem 3rem;
  }
}

.mbot-2-notlast:not(:last-child) {
  margin-bottom: 6.9rem;
}

.mbot-3-notlast:not(:last-child) {
  margin-bottom: 7.2rem;
}

.mtop-1 {
  margin-top: 3.6rem;
}

.blocks__image--active {
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  z-index: 1;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  justify-items: center;
  display: grid;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

@media only screen and (max-width: 65.5em) {
  .blocks__image--active {
    all: unset;
  }
}

.blocks__image--active > img {
  max-width: 66.66vw;
  max-height: 66.66vh;
  max-width: 80vw;
  max-height: 80vh;
  height: auto;
  width: auto;
  position: relative;
  top: -2.5rem;
  -webkit-box-shadow: -5px -5px 20px rgba(0, 0, 0, .16);
  -moz-box-shadow: -5px -5px 20px rgba(0, 0, 0, .16);
  box-shadow: -5px -5px 20px rgba(0, 0, 0, .16);
  display: block !important;
}

@media only screen and (max-width: 65.5em) {
  .blocks__image--active > img {
    all: unset;
  }
}

.blocks__image img {
  display: none;
}

@media only screen and (max-width: 65.5em) {
  .blocks__image img {
    width: calc(100% + 4.8rem);
    margin: 0 -2.4rem;
    display: block;
  }
}

.blocks__video--active {
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  z-index: 1;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  justify-items: center;
  display: grid;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

@media only screen and (max-width: 65.5em) {
  .blocks__video--active {
    all: unset;
  }
}

.blocks__video--active > iframe {
  pointer-events: all;
  max-width: 66.66vw;
  max-height: 66.66vh;
  aspect-ratio: 16 / 8.9;
  width: 52vw;
  width: 66.66vw;
  height: auto;
  position: relative;
  top: -2.5rem;
  -webkit-box-shadow: -5px -5px 20px rgba(0, 0, 0, .16);
  -moz-box-shadow: -5px -5px 20px rgba(0, 0, 0, .16);
  box-shadow: -5px -5px 20px rgba(0, 0, 0, .16);
  display: block !important;
}

@supports not (aspect-ratio: 16/9) {
  .blocks__video--active > iframe {
    height: 29.25vw;
    height: 28.6vw;
    height: 36.663vw;
  }
}

@media only screen and (max-width: 65.5em) {
  .blocks__video--active > iframe {
    all: unset;
  }
}

.blocks__video--active--lock {
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  justify-items: center;
  display: grid;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

@media only screen and (max-width: 65.5em) {
  .blocks__video--active--lock {
    all: unset;
  }
}

.blocks__video--active--lock > iframe {
  pointer-events: all;
  max-width: 66.66vw;
  max-height: 66.66vh;
  aspect-ratio: 16 / 8.9;
  width: 52vw;
  width: 66.66vw;
  height: auto;
  position: relative;
  top: -2.5rem;
  -webkit-box-shadow: -5px -5px 20px rgba(0, 0, 0, .16);
  -moz-box-shadow: -5px -5px 20px rgba(0, 0, 0, .16);
  box-shadow: -5px -5px 20px rgba(0, 0, 0, .16);
  display: block !important;
}

@supports not (aspect-ratio: 16/8.9) {
  .blocks__video--active--lock > iframe {
    height: 29.25vw;
    height: 36.663vw;
  }
}

@media only screen and (max-width: 65.5em) {
  .blocks__video--active--lock > iframe {
    all: unset;
  }
}

.blocks__video iframe {
  display: none;
}

@media only screen and (max-width: 65.5em) {
  .blocks__video iframe {
    width: calc(100% + 4.8rem);
    aspect-ratio: 16 / 8.9;
    height: auto;
    margin: 0 -2.4rem;
    display: block;
  }

  @supports not (aspect-ratio: 16/9) {
    .blocks__video iframe {
      height: calc(56.25vw - 1.0125rem);
      height: calc(50.25vw - .9045rem);
    }
  }
}

.onlymobile {
  display: none;
}

@media only screen and (max-width: 65.5em) {
  .onlymobile {
    display: block;
  }
}

.onlydesktop {
  display: block;
}

@media only screen and (max-width: 65.5em) {
  .onlydesktop {
    display: none;
  }
}

@media only screen and (max-width: 65.5em) {
  .slider__meta {
    grid-template-columns: 50% auto;
    gap: 1rem;
    padding: 0 2.4rem;
    display: grid;
    max-width: 100% !important;
  }

  .slider__meta__bullets {
    justify-self: end;
    list-style-type: none;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: flex;
  }

  .slider-bullet {
    padding-right: .5rem;
  }

  .slider-bullet--active {
    color: var(--black);
  }

  .swipe {
    visibility: hidden;
    position: relative;
    overflow: hidden;
  }
}

@media only screen and (max-width: 65.5em) and (max-width: 65.5em) {
  .swipe {
    width: calc(100% + 4.8rem);
    margin: 0 -2.4rem;
  }
}

@media only screen and (max-width: 65.5em) {
  .swipe-wrap {
    -webkit-box-align: center;
    -moz-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: flex;
    position: relative;
    overflow: hidden;
  }
}

@media only screen and (max-width: 65.5em) {
  .swipe-wrap > div {
    float: left;
    width: 100%;
    position: relative;
    overflow: hidden;
  }
}

@media only screen and (max-width: 65.5em) {
  .bullet--active {
    color: #000;
  }
}

@media only screen and (max-width: 65.5em) {
  .slider-meta {
    grid-template-columns: repeat(10, 1fr);
    gap: .1rem;
    list-style-type: none;
    display: grid;
  }
}

@media only screen and (max-width: 65.5em) {
  .grid {
    width: 100%;
    grid-template-columns: 50% auto;
    display: grid;
  }
}

.debug {
  width: 500px;
}

.filter {
  color: var(--white);
  grid-template-columns: repeat(3, max-content);
  gap: 9rem;
  margin-bottom: 2.7rem;
  display: grid;
}

@media only screen and (max-width: 65.5em) {
  .filter {
    gap: 1.5rem;
  }
}

.filter .checkbox {
  grid-template-columns: max-content auto;
  gap: .8rem;
  display: grid;
}

@media only screen and (max-width: 65.5em) {
  .filter {
    width: 200vw;
    margin-top: 20rem;
  }
}

.filter [type="checkbox"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  width: 2.6rem;
  height: 2.6rem;
  border: .3rem solid var(--white);
  background-color: rgba(0, 0, 0, 0);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -webkit-align-content: center;
  align-content: center;
  -webkit-justify-content: center;
  justify-content: center;
  margin: 0;
  display: grid;
  -webkit-transform: translateY(-.2rem);
  -moz-transform: translateY(-.2rem);
  transform: translateY(-.2rem);
}

@media only screen and (max-width: 65.5em) {
  .filter [type="checkbox"] {
    width: 1.8em;
    height: 1.8em;
    border: .2rem solid var(--white);
  }
}

.filter input[type="checkbox"] + label {
  letter-spacing: .092rem;
  cursor: pointer;
  font: 2.3rem / 2.6rem Trainer;
}

@media only screen and (max-width: 65.5em) {
  .filter input[type="checkbox"] + label {
    letter-spacing: .09rem;
    font-size: 1.5rem;
    line-height: 1.6rem;
  }
}

.filter input[type="checkbox"]:before {
  content: "";
  width: 1.2rem;
  height: 1.2rem;
  background-color: var(--white);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -webkit-transition: -moz-transform .2s, -webkit-transform .2s, transform .2s;
  transition: -moz-transform .2s, -webkit-transform .2s, transform .2s;
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  transform: scale(0);
}

@media only screen and (max-width: 65.5em) {
  .filter input[type="checkbox"]:before {
    width: .8rem;
    height: .8rem;
  }
}

.filter input[type="checkbox"]:checked:before {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  transform: scale(1);
}

.filter--1 {
  margin-left: 4.6rem;
}

@media only screen and (max-width: 65.5em) {
  .filter--1 {
    margin-left: 2.1rem;
  }
}

.index {
  background-color: var(--black);
  grid-template-columns: minmax(23.125%, min-content) auto;
  padding: 0;
  display: grid;
}

@media only screen and (max-width: 65.5em) {
  .index {
    grid-template-columns: 1fr;
  }
}

.index__container {
  border-right: .8rem solid var(--green);
  -ms-overflow-style: none;
  scrollbar-width: none;
  padding: 3.6rem;
  overflow-y: scroll;
}

.index__container::-webkit-scrollbar {
  display: none;
}

@media only screen and (max-width: 65.5em) {
  .index__container {
    border: none;
    padding: .9rem;
    overflow-x: hidden;
  }
}

.index__container--events {
  color: var(--white);
}

@media only screen and (max-width: 65.5em) {
  .index__container--events {
    height: 100vh;
    width: 100vw;
    width: 90vw;
    border-left: .6rem solid var(--green);
    background-color: var(--black);
    z-index: 100;
    padding-top: 2rem;
    padding-left: 2.6rem;
    -webkit-transition: left .2s;
    transition: left .2s;
    position: fixed;
    top: 0;
    left: 85vw;
    overflow-y: scroll;
  }

  .index__container--events .event {
    pointer-events: none;
  }
}

.index__container--events--active {
  word-break: break-word;
  left: 10vw;
}

.index__container--events--active .event {
  pointer-events: all;
}

.index__container--events h3 {
  font: normal normal normal calc(var(--075) * 2.3rem) / calc(var(--075) * 2.5rem) "Trainer";
  letter-spacing: .23rem;
  text-transform: uppercase;
  margin-bottom: var(--baseline-grid);
  padding-left: 6.1rem;
}

@media only screen and (max-width: 65.5em) {
  .index__container--events h3 {
    letter-spacing: .16rem;
    padding-left: 5.2rem;
    font-size: 1.6rem;
    line-height: 2.5rem;
  }
}

.index__container--events .event {
  margin-bottom: var(--baseline-grid);
  -webkit-transition: color .1s;
  transition: color .1s;
}

.index__container--events .event:hover {
  color: var(--green);
}

@media only screen and (max-width: 65.5em) {
  .index__container--events .event:hover {
    color: var(--white);
  }
}

.index__container--events .event time {
  font: normal normal normal calc(var(--075) * 2.3rem) / calc(var(--075) * 2.8rem) "Trainer";
  letter-spacing: .92px;
}

@media only screen and (max-width: 65.5em) {
  .index__container--events .event time {
    letter-spacing: .064rem;
    font-size: 1.6rem;
  }
}

.index__container--events .event__meta {
  font-size: calc(var(--075) * 7.3rem);
  line-height: calc(var(--075) * 7.8rem);
  letter-spacing: .146rem;
}

@media only screen and (max-width: 65.5em) {
  .index__container--events .event__meta {
    letter-spacing: .228rem;
    font-size: 5.7rem;
    line-height: 6.1rem;
  }
}

.index__container--events .event__meta--category {
  font-style: italic;
}

.index__container .header {
  grid-template-columns: minmax(min-content, 55rem) minmax(40rem, auto);
  display: grid;
}

@media only screen and (max-width: 65.5em) {
  .index__container .header {
    grid-template-columns: 50% 1fr;
  }
}

.index__container .header__dimensions-logo {
  max-width: 55rem;
  padding-left: 2rem;
}

@media only screen and (max-width: 65.5em) {
  .index__container .header__dimensions-logo {
    max-width: 19rem;
    padding-top: 1.8rem;
    padding-left: 1.6rem;
  }
}

.index__container .project {
  width: 100%;
  height: 11.3rem;
  background-color: #fff;
  -webkit-border-radius: 4rem;
  -moz-border-radius: 4rem;
  border-radius: 4rem;
  grid-template-columns: 66.6666% 33.3333%;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  column-gap: 1ch;
  margin-bottom: .9rem;
  padding: 0 3.3rem;
  -webkit-transition: color .1s;
  transition: color .1s;
  display: grid;
}

@media only screen and (max-width: 65.5em) {
  .index__container .project {
    height: 7rem;
    -webkit-border-radius: 3rem;
    -moz-border-radius: 3rem;
    border-radius: 3rem;
    margin-bottom: .6rem;
    padding: 0 2.2rem;
  }
}

.index__container .project--active {
  color: var(--green);
}

@media only screen and (max-width: 65.5em) {
  .index__container .project--active {
    color: var(--black);
  }
}

.index__container .project--hidden {
  display: none;
}

.index__container .project:hover {
  color: var(--green);
}

@media only screen and (max-width: 65.5em) {
  .index__container .project:hover {
    color: var(--black);
  }
}

.index__container .project__title {
  letter-spacing: .038rem;
  -webkit-line-clamp: 2;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  font: 3.8rem / 4.5rem Trainer;
  display: -webkit-box;
  overflow: hidden;
}

@media only screen and (max-width: 65.5em) {
  .index__container .project__title {
    letter-spacing: .038rem;
    font-size: 1.9rem;
    line-height: 2.4rem;
  }
}

.index__container .project__keyword {
  text-align: right;
  letter-spacing: .092rem;
  -webkit-line-clamp: 3;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  font: 2.3rem / 2.5rem Trainer;
  display: -webkit-box;
  overflow: hidden;
}

@media only screen and (max-width: 65.5em) {
  .index__container .project__keyword {
    letter-spacing: .024rem;
    -o-text-overflow: clip;
    text-overflow: clip;
    padding-right: 10vw;
    font-size: 1.2rem;
    line-height: 1.7rem;
    top: -.3rem;
  }
}

@media only screen and (max-width: 31.25em) {
  .index__container .project__keyword {
    padding-right: 8vw;
  }
}

.nav {
  justify-self: end;
}

@media only screen and (max-width: 65.5em) {
  .nav {
    padding-top: 1.6rem;
  }
}

.nav__khb-logo {
  width: 17.7rem;
  opacity: 1;
  -webkit-transition: opacity .2s;
  transition: opacity .2s;
  position: relative;
  -webkit-transform: translateX(-65%)translateY(-5.5rem);
  -moz-transform: translateX(-65%)translateY(-5.5rem);
  transform: translateX(-65%)translateY(-5.5rem);
}

@media only screen and (max-width: 65.5em) {
  .nav__khb-logo {
    width: 10.9rem;
    position: absolute;
    top: 7.2rem;
    left: 2.8rem;
    -webkit-transform: translateX(0)translateY(0);
    -moz-transform: translateX(0)translateY(0);
    transform: translateX(0)translateY(0);
  }
}

.nav__nav__checkbox {
  display: none;
}

.nav__nav__checkbox:checked ~ .nav__khb-logo {
  opacity: 0;
}

@media only screen and (max-width: 65.5em) {
  .nav__nav__checkbox:checked ~ .nav__khb-logo {
    opacity: 1;
  }
}

.nav__nav__button {
  cursor: pointer;
  height: 5.5rem;
  width: 5.5rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  display: grid;
  position: relative;
  right: -12.7rem;
}

@media only screen and (max-width: 65.5em) {
  .nav__nav__button {
    width: 2.9rem;
    height: 2.2rem;
    position: absolute;
    right: 20vw !important;
  }
}

.nav__nav__icon, .nav__nav__icon:before, .nav__nav__icon:after {
  background-color: var(--white);
  height: .8rem;
  height: .4rem;
  width: 5.5rem;
  -webkit-transition: -moz-transform .1s, -webkit-transform .1s, transform .1s;
  transition: -moz-transform .1s, -webkit-transform .1s, transform .1s;
}

@media only screen and (max-width: 65.5em) {
  .nav__nav__icon, .nav__nav__icon:before, .nav__nav__icon:after {
    height: .3rem;
    width: 2.9rem;
  }
}

.nav__nav__icon:before, .nav__nav__icon:after {
  content: "";
  -webkit-transform-origin: 0%;
  -moz-transform-origin: 0%;
  transform-origin: 0%;
  display: block;
  position: absolute;
}

.nav__nav__icon:before {
  margin-top: -2rem;
}

@media only screen and (max-width: 65.5em) {
  .nav__nav__icon:before {
    margin-top: -1.1rem;
  }
}

.nav__nav__icon:after {
  margin-top: 2em;
}

@media only screen and (max-width: 65.5em) {
  .nav__nav__icon:after {
    margin-top: 1.1rem;
  }
}

.nav__nav__checkbox:checked + .nav__nav__button .nav__nav__icon {
  background-color: rgba(0, 0, 0, 0);
}

.nav__nav__checkbox:checked + .nav__nav__button .nav__nav__icon:before {
  width: 6.2rem;
  margin-top: -2.2rem;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
}

@media only screen and (max-width: 65.5em) {
  .nav__nav__checkbox:checked + .nav__nav__button .nav__nav__icon:before {
    width: 2.9rem;
    margin-top: -1rem;
  }
}

.nav__nav__checkbox:checked + .nav__nav__button .nav__nav__icon:after {
  width: 6.2rem;
  margin-top: 2.2rem;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

@media only screen and (max-width: 65.5em) {
  .nav__nav__checkbox:checked + .nav__nav__button .nav__nav__icon:after {
    width: 2.9rem;
    margin-top: 1rem;
  }
}

.nav__nav__nav {
  visibility: hidden;
  text-align: right;
  text-transform: uppercase;
  color: var(--white);
  letter-spacing: .23rem;
  font: 2.3rem / 2.5rem Trainer;
  position: relative;
  top: -5rem;
  right: 1.25rem;
}

@media only screen and (max-width: 65.5em) {
  .nav__nav__nav {
    letter-spacing: .076rem;
    text-transform: none;
    text-align: left;
    background-color: var(--black);
    width: 60vw;
    padding-left: 1.2rem;
    font-size: 1.9rem;
    line-height: 2.5rem;
    position: absolute;
    top: 0;
    left: 2rem;
  }
}

.nav__nav__checkbox:checked ~ .nav__nav__nav {
  visibility: visible;
}

@media only screen and (max-width: 65.5em) {
  .nav__nav__checkbox:checked ~ .nav__nav__nav {
    display: hidden;
  }
}

.nav__nav__checkbox:checked ~ .nav__nav__nav .nav__nav__link {
  -webkit-animation: navFadeIn .1s ease-in forwards;
  animation: navFadeIn .1s ease-in forwards;
  -webkit-animation-delay: calc(var(--order) * 20ms);
  animation-delay: calc(var(--order) * 20ms);
}

.nav__nav__list {
  list-style: none;
}

.nav__nav__list li {
  margin-top: 2.5rem;
}

.nav__nav__link {
  opacity: 0;
}

@-webkit-keyframes navFadeIn {
  from {
    opacity: 0;
    -webkit-transform: translateY(-.5rem);
    -moz-transform: translateY(-.5rem);
    transform: translateY(-.5rem);
  }

  to {
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes navFadeIn {
  from {
    opacity: 0;
    -webkit-transform: translateY(-.5rem);
    -moz-transform: translateY(-.5rem);
    transform: translateY(-.5rem);
  }

  to {
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    transform: translateY(0);
  }
}

.info__support {
  max-width: 80%;
  margin-top: calc(.85 * var(--baseline-grid) );
}

@media only screen and (max-width: 65.5em) {
  .info__support {
    margin-top: calc(.5 * var(--baseline-grid) );
    max-width: 25rem;
  }
}

.info__support img, .nodrag {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
}

@media only screen and (max-width: 65.5em) {
  .metainfo {
    column-width: 40vw;
    column-width: 38vw;
    column-gap: var(--baseline-grid);
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    padding-top: var(--baseline-grid);
    padding-right: var(--baseline-grid);
    padding-left: var(--baseline-grid);
    grid-row-start: 1;
    margin-top: 13rem;
    padding-bottom: 0;
    position: relative;
  }
}

.metainfo__element {
  break-inside: avoid;
  padding-bottom: var(--baseline-grid);
}

.metainfo__element ul, .metainfo__element ol, .metainfo__element li {
  list-style: none;
}

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