@media (hover: hover) {
  #modes > span:not(.current):hover,
#index td:hover,
#fast-forward:hover {
    cursor: pointer;
  }
  .has-hover-text:hover {
    cursor: pointer;
  }
  .has-hover-text:hover .text-still {
    display: none;
  }
  .has-hover-text:hover .text-hover {
    display: block;
  }
  .has-hover-text:hover .text-hover::before {
    content: "(";
  }
  .has-hover-text:hover .text-hover::after {
    content: ")";
  }
  #index tr:hover {
    cursor: pointer;
    color: darkgrey;
  }
}
@media (hover: none) {
  #hover {
    font-size: 10px;
  }
  .directions {
    display: none;
  }
}
@media (max-aspect-ratio: 7/5) or (hover: none) {
  .slider .media.fit,
.slider .media.rotate {
    max-width: 100vw;
  }
  .slider .media.fit img, .slider .media.fit video,
.slider .media.rotate img,
.slider .media.rotate video {
    object-fit: contain;
    object-position: center;
    width: 100%;
  }
}
@media (max-aspect-ratio: 5/6) or (hover: none) {
  body {
    overflow: hidden;
  }
  .slider .swiper-slide {
    max-width: unset;
    width: 100%;
    overflow: hidden;
  }
  .slider img,
.slider video {
    width: 100%;
  }
  .slider .media.fit,
.slider .media.rotate {
    max-width: unset;
  }
  @media (max-aspect-ratio: 5/6) {
    .media.rotate {
      transform-origin: center;
    }
    .media.rotate video,
.media.rotate picture {
      transform: rotate(-90deg);
      transform-origin: center;
      display: inline-block;
    }
    .media.rotate img, .media.rotate video {
      overflow: visible;
      width: 100%;
    }
  }
}
@media (max-width: 1920px) {
  :root {
    --font-size: 18px;
  }
}
@media (max-width: 1200px) {
  #copyright-display {
    transform: rotate(-90deg);
    transform-origin: left;
    margin-left: var(--line-height);
    padding: 0;
  }
  #about #credits {
    transform: rotate(270deg);
    transform-origin: left;
    width: 0;
    white-space: nowrap;
    margin-right: var(--line-height);
  }
}
@media (max-width: 790px) {
  :root {
    --font-size: 2.3vw;
  }
}
@media (min-width: 700px) {
  .caption {
    position: fixed;
  }
  .media.is-video picture {
    display: none;
  }
}
@media (max-width: 700px) {
  :root {
    --font-size: 16px;
  }
  .captions {
    position: fixed;
    width: calc(100% - var(--line-height) * 2);
    left: calc(var(--padding-left) - var(--comfort-button-padding));
    top: calc(var(--padding-top) - var(--comfort-button-padding));
    color: #FFF;
    mix-blend-mode: difference;
    z-index: 9;
    padding: var(--comfort-button-padding);
    width: calc(100% - var(--line-height) * 4);
  }
  .captions .caption {
    width: unset;
    padding: 0;
    text-align: left;
  }
  .captions .caption.bottom > *:not(.partner) {
    display: inline;
  }
  #index table td.place,
#index table td.date {
    display: inline;
  }
  .place::after {
    content: ", ";
  }
  #index table td.date {
    display: none;
  }
  .place-date .date::before {
    content: "";
  }
  #modes,
#fast-forward {
    --width: 8em;
    text-align: right;
    width: var(--width);
  }
  #index table,
#index tr {
    display: block;
  }
  #index table {
    --leading-space: calc(var(--font-size) * 5);
    padding-left: var(--leading-space);
  }
  #index table tr {
    margin-bottom: var(--line-height);
  }
  #index table td {
    display: inline;
    white-space: unset;
  }
  #index table td:not(:last-child) {
    padding-right: 0;
  }
  #index table td:not(.place-date, .index-counter, .empty)::after {
    content: ",";
  }
  #index table td.index-counter {
    display: inline-block;
    position: absolute;
    left: var(--line-height);
  }
  #index table td.place-date .date {
    display: inline;
  }
  #index table td.index-counter,
#index table td.project-person,
#index table td.project-name,
#index table td.place-date,
#index table td.date {
    width: unset;
  }
  .media.is-video video,
.media.is-video.rotate video {
    display: none;
  }
}
@media (max-height: 980px) or (max-width: 700px) {
  body.has-about header,
body.has-index #modes {
    padding: var(--line-height);
    padding-bottom: var(--line-height);
    width: 100%;
    background: #000;
    left: 0;
    top: 0;
  }
  body.has-index:not(.has-animation) #modes,
body.has-about:not(.has-animation) header {
    mix-blend-mode: normal;
  }
  #modes {
    text-align: right;
  }
  header {
    transition: top var(--transition-time);
  }
  #about {
    padding-top: calc(var(--line-height) * 3);
  }
}
@media (max-height: 680px) or (max-width: 700px) {
  #about .top-about {
    min-height: calc(100dvh - var(--extra-smaller-line-height) - var(--line-height) * 4);
  }
  #about .about-contact {
    width: unset;
    position: static;
    columns: 1;
    margin-bottom: calc(var(--line-height) * 2);
  }
  #about .about-contact p {
    margin-bottom: var(--line-height);
  }
  #about #credits {
    position: static;
    text-align: right;
    transform: rotate(0);
    width: unset;
    white-space: wrap;
    margin-right: 0;
  }
}

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