@import url("//hello.myfonts.net/count/3bc010");
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

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

table {
  border-collapse: collapse;
  border-spacing: 0;
}

.clearfix:after {
  content: "";
  display: block;
  clear: both;
}

img {
  width: 100%;
  max-width: 100%;
}

@font-face {
  font-family: "NeueHaasUnica";
  src: url("webfonts/NeueHaasUnica-Medium.woff2") format("woff2"), url("webfonts/NeueHaasUnica-Medium.woff") format("woff");
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "NeueHaasUnica";
  src: url("webfonts/NeueHaasUnica-Regular.woff2") format("woff2"), url("webfonts/NeueHaasUnica-Regular.woff") format("woff");
  font-weight: 400;
  font-display: swap;
}
:root {
  --mainColor: black;
  --backgroundColor: white;
  --secondaryColor: rgb(180, 180, 180);
  --secondaryColorAlt: rgb(235, 235, 235);
}

body[data-mode=night] {
  --mainColor: white;
  --backgroundColor: black;
  --secondaryColor: rgb(125, 125, 125);
  --secondaryColorAlt: rgb(75, 75, 75);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

html.noScroll,
html.noScroll body {
  overflow: hidden;
}

img {
  height: auto;
}

.scrollAnchor {
  scroll-margin-block-start: calc(12.1vw + 2rem);
}

.pt230 {
  font-size: 12.1vw;
  text-transform: uppercase;
  line-height: 1;
  font-weight: 400;
  letter-spacing: -0.065em;
}
@media screen and (max-width: 699px) {
  .pt230 {
    font-size: 11vw;
    letter-spacing: -0.045em;
  }
}

.pt52 {
  font-size: 2.55vw;
  letter-spacing: -0.05vw;
  font-weight: 400;
  line-height: 1.06;
}
@media screen and (max-width: 1023px) {
  .pt52 {
    font-size: 3.5vw;
  }
}
@media screen and (max-width: 699px) {
  .pt52 {
    font-size: 5.6vw;
    line-height: 1.2;
  }
}

.pt14 {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
}
@media screen and (max-width: 699px) {
  .pt14 {
    font-size: 12px;
  }
}

@media screen and (max-width: 699px) {
  .smartphonePt52 {
    font-size: 5.6vw;
    letter-spacing: -0.05vw;
    font-weight: 400;
    line-height: 1.2;
  }
}

@media screen and (max-width: 699px) {
  .smartphonePt14 {
    font-size: 12px;
    letter-spacing: 0;
    font-weight: 500;
    line-height: 1.214;
  }
}

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

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: "NeueHaasUnica", Arial, sans-serif;
  font-size: 14px;
  -webkit-text-size-adjust: none;
  line-height: 1.214;
  letter-spacing: 0;
  font-weight: 500;
  background-color: var(--backgroundColor);
  color: var(--mainColor);
}
@media screen and (max-width: 699px) {
  body {
    font-size: 12px;
  }
}

a {
  transition: color 0.2s ease-in-out;
}
a:link, a:visited {
  color: inherit;
  text-decoration: none;
}
a:hover, a:active {
  color: var(--secondaryColor);
  text-decoration: none;
}

#main-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 5;
  pointer-events: none;
}

.wrapper {
  padding: 0 1.9vw;
}
@media screen and (max-width: 699px) {
  .wrapper {
    padding: 0 4vw;
  }
}
.wrapper.topPadding {
  padding-top: 1.9vw;
}
@media screen and (max-width: 699px) {
  .wrapper.topPadding {
    padding-top: 4vw;
  }
}
.wrapper.bottomPadding {
  padding-bottom: 1.9vw;
}
@media screen and (max-width: 699px) {
  .wrapper.bottomPadding {
    padding-bottom: 4vw;
  }
}
.wrapper.allSides {
  padding: 1.9vw;
}
@media screen and (max-width: 699px) {
  .wrapper.allSides {
    padding: 4vw;
  }
}

.headline {
  margin-top: -0.2em;
  margin-left: -0.09em;
}

.grid {
  --cols: 12;
  display: grid;
  grid-template-columns: repeat(var(--cols), minmax(0, 1fr));
  grid-gap: 4px;
}
.grid#projects {
  --cols: 24;
}
@media screen and (max-width: 699px) {
  .grid {
    --cols: 6;
  }
  .grid.smartphoneBlock {
    display: block;
  }
  .grid.smartphoneFlex {
    display: flex;
  }
}
.grid.clientsList {
  margin-top: 1.9vw;
  grid-template-columns: minmax(0, 1fr) minmax(0, 11fr);
}
@media screen and (max-width: 699px) {
  .grid.clientsList {
    margin-top: 4vw;
    grid-template-columns: 1fr;
  }
  .grid.clientsList h2 {
    margin-bottom: 1em;
  }
  .grid.clientsList ul {
    column-count: 2;
    column-gap: 4px;
  }
}
.grid.clientsList li {
  display: inline;
}
@media screen and (max-width: 699px) {
  .grid.clientsList li {
    display: block;
    break-inside: avoid;
  }
}
.grid.filterList {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 10fr);
}
@media screen and (max-width: 699px) {
  .grid.filterList {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas: "resetButton toggleButton" "empty filter";
  }
  .grid.filterList #resetFilter {
    grid-area: resetButton;
  }
  .grid.filterList #toggleFilter {
    grid-area: toggleButton;
  }
  .grid.filterList .filter {
    grid-area: filter;
  }
}
.grid#publicationList, .grid#printList {
  grid-template-columns: repeat(4, minmax(0, 3fr));
}
@media screen and (max-width: 699px) {
  .grid#publicationList, .grid#printList {
    grid-template-columns: minmax(0, 1fr);
    margin-left: -4vw;
    margin-right: -4vw;
  }
  .grid#publicationList article, .grid#printList article {
    padding: 0 4vw;
  }
}
.grid.contactGrid {
  grid-template-columns: repeat(2, 1fr);
}
.grid.footerGrid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 4fr) minmax(0, 6fr);
}
@media screen and (max-width: 699px) {
  .grid.footerGrid {
    grid-template-columns: auto auto minmax(0, 1fr);
  }
  .grid.footerGrid .link {
    text-align: right;
  }
}

.flex {
  display: flex;
}
.flex.column {
  flex-direction: column;
}
.flex.justify-between {
  justify-content: space-between;
}
.flex.align-center {
  align-items: center;
}
@media screen and (max-width: 699px) {
  .flex.smartphoneBlock {
    display: block;
  }
}

#desktopNav {
  pointer-events: auto;
}
#desktopNav li {
  margin-right: 1rem;
}
#desktopNav li.shiftRight {
  margin-left: auto;
}
#desktopNav li:last-child {
  margin-right: 0;
}
@media screen and (max-width: 699px) {
  #desktopNav {
    display: none;
  }
}

#mobileNav {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 100vh;
  z-index: 6;
  transition: max-height 0.6s cubic-bezier(0.2, 0, 0.2, 1);
  max-height: 0;
  overflow: hidden;
  background: var(--backgroundColor);
}
#mobileNav section > ul {
  margin-top: 0.6em;
  margin-bottom: 0.8em;
}
#mobileNav ul ul li {
  padding-left: 1em;
}
@media screen and (max-width: 699px) {
  #mobileNav {
    display: block;
  }
  .openNav #mobileNav {
    max-height: 100vh;
  }
}

#navButton {
  position: fixed;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 50%;
  border: none;
  height: 50px;
  width: 50px;
  padding: 13px;
  background: white;
  cursor: pointer;
  z-index: 11;
  box-shadow: 0 0 39px -3px rgba(0, 0, 0, 0.23);
  display: none;
}
@media screen and (max-width: 699px) {
  #navButton {
    display: block;
  }
}
#navButton:focus {
  outline: none;
}
#navButton .bar {
  width: 25px;
  height: 1px;
  display: block;
  background: black;
  transform-origin: 56% 50%;
  transition: transform 0.2s ease-in-out 0.2s, opacity 0.1s ease-in-out 0.2s;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
#navButton .bar.topBar {
  transform-origin: 0 1px;
}
#navButton .bar.middleBar {
  margin: 8px 0;
  position: relative;
  transition: transform 0.2s ease-in-out 0.2s, background 0.2s ease-in-out 0.2s;
}
#navButton .bar.middleBar .inside {
  background: black;
  transition: transform 0.2s ease-in-out;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
#navButton .bar.bottomBar {
  transform-origin: 0 180%;
}
.openNav #navButton .bar, #navButton.changeState .bar {
  transition: transform 0.2s ease-in-out, opacity 0.1s linear 0.2s;
}
.openNav #navButton .topBar, #navButton.changeState .topBar {
  transform: translateY(7px);
  opacity: 0;
}
.openNav #navButton .bottomBar, #navButton.changeState .bottomBar {
  transform: translateY(-7px);
  opacity: 0;
}
.openNav #navButton .middleBar, #navButton.changeState .middleBar {
  background: transparent !important;
  transition: transform 0.2s ease-in-out 0.2s;
}
.openNav #navButton .middleBar .inside, #navButton.changeState .middleBar .inside {
  transition: transform 0.2s ease-in-out 0.2s;
  transform: rotate(45deg);
}
.openNav #navButton .middleBar .inside:last-child, #navButton.changeState .middleBar .inside:last-child {
  transform: rotate(-45deg);
}

section {
  position: relative;
}
section header {
  position: sticky;
  top: 0;
  z-index: 5;
  pointer-events: none;
}
section .distance {
  height: 98px;
}
@media screen and (max-width: 699px) {
  section .distance {
    height: 70px;
  }
}

.intro {
  min-height: calc(100vh - 12.1vw - 2.85vw);
  padding-top: 56px;
  justify-content: flex-end;
}
@media screen and (max-width: 699px) {
  .intro {
    min-height: calc(100vh - 11vw - 8vw);
  }
}

.invisible {
  color: transparent;
}
.invisible::selection {
  background: transparent;
  color: transparent;
}

.project img {
  display: block;
  cursor: pointer;
}
.project .caption .client, .project .caption .artist, .project .caption .galleryIndex {
  flex: 1 1 33.3%;
  max-width: 33.3%;
}
.project .caption .artist {
  opacity: 0;
  transition: opacity 0.4s ease-in-out;
}
@media screen and (pointer: coarse) {
  .project .caption .artist {
    opacity: 1;
  }
}
.project .caption .client, .project .caption .artist {
  padding-right: 4px;
}
.project .caption .galleryIndex {
  text-align: right;
}
@media screen and (min-width: 700px) and (max-width: 1300px) {
  .project .caption .client {
    flex: 1 1 66.66%;
    max-width: 66.6%;
  }
  .project .caption .artist {
    display: none;
  }
}
.project:hover .artist {
  opacity: 1;
}

.projects[data-show="1"] article:nth-child(n+10) {
  display: none;
}
.projects[data-show="2"] article:nth-child(n+19) {
  display: none;
}
.projects[data-show="3"] article:nth-child(n+28) {
  display: none;
}
.projects[data-show="4"] article:nth-child(n+37) {
  display: none;
}
.projects[data-show="5"] article:nth-child(n+46) {
  display: none;
}
.projects[data-show="6"] article:nth-child(n+55) {
  display: none;
}
.projects[data-show="7"] article:nth-child(n+64) {
  display: none;
}
.projects[data-show="7"] article:nth-child(n+73) {
  display: none;
}
.projects article {
  margin-top: 98px;
  --column: 1 / 1;
  grid-column: var(--column);
}
@media screen and (max-width: 699px) {
  .projects article {
    margin-top: 35px;
  }
}
@media (width <= 75rem) {
  .projects article:nth-child(odd) {
    --column: 1 / span 5;
  }
  .projects article:nth-child(odd).landscape.next-landscape {
    --column: 1 / span 5;
  }
  .projects article:nth-child(odd).landscape.next-landscape + .landscape {
    --column: 7 / span 6;
  }
  .projects article:nth-child(odd).landscape.next-landscape + .landscape + .landscape.next-landscape {
    --column: 1 / span 6;
  }
  .projects article:nth-child(odd).landscape.next-landscape + .landscape + .landscape.next-landscape + .landscape {
    --column: 8 / span 5;
  }
  .projects article:nth-child(odd).landscape.next-portrait {
    --column: 1 / span 6;
  }
  .projects article:nth-child(odd).landscape.next-portrait + .portrait {
    --column: 8 / span 3;
  }
  .projects article:nth-child(odd).landscape.next-portrait + .portrait + .landscape.next-portrait {
    --column: 2 / span 6;
  }
  .projects article:nth-child(odd).landscape.next-portrait + .portrait + .landscape.next-portrait + .portrait {
    --column: 9 / span 3;
  }
  .projects article:nth-child(odd).portrait.next-portrait {
    --column: 2 / span 4;
  }
  .projects article:nth-child(odd).portrait.next-portrait + .portrait {
    --column: 8 / span 4;
  }
  .projects article:nth-child(odd).portrait.next-portrait + .portrait + .portrait.next-portrait {
    --column: 1 / span 4;
  }
  .projects article:nth-child(odd).portrait.next-portrait + .portrait + .portrait.next-portrait + .portrait {
    --column: 7 / span 4;
  }
  .projects article:nth-child(odd).portrait.next-landscape {
    --column: 1 / span 3;
  }
  .projects article:nth-child(odd).portrait.next-landscape + .landscape {
    --column: 6 / span 6;
  }
  .projects article:nth-child(odd).portrait.next-landscape + .landscape + .portrait.next-landscape {
    --column: 1 / span 4;
  }
  .projects article:nth-child(odd).portrait.next-landscape + .landscape + .portrait.next-landscape + .landscape {
    --column: 7 / span 5;
  }
}
.projects article img {
  display: none;
}
.projects.show article img {
  display: block;
}
@media (width > 75rem) {
  .projects article:nth-child(3n+1).landscape.last {
    --column: 1 / span 12;
  }
  .projects article:nth-child(3n+1).portrait.last {
    --column: 1 / span 7;
  }
  .projects article:nth-child(3n+1).landscape.next-landscape.next-last {
    --column: 1 / span 10;
  }
  .projects article:nth-child(3n+1).landscape.next-landscape.next-last + article {
    --column: 14 / span 10;
  }
  .projects article:nth-child(3n+1).landscape.next-portrait.next-last {
    --column: 1 / span 10;
  }
  .projects article:nth-child(3n+1).landscape.next-portrait.next-last + article {
    --column: 14 / span 7;
  }
  .projects article:nth-child(3n+1).portrait.next-landscape.next-last {
    --column: 1 / span 7;
  }
  .projects article:nth-child(3n+1).portrait.next-landscape.next-last + article {
    --column: 11 / span 10;
  }
  .projects article:nth-child(3n+1).portrait.next-portrait.next-last {
    --column: 1 / span 7;
  }
  .projects article:nth-child(3n+1).portrait.next-portrait.next-last + article {
    --column: 12 / span 6;
  }
  .projects article:nth-child(3n+1).landscape.next-landscape.next-next-landscape {
    --column: 1 / span 8;
  }
  .projects article:nth-child(3n+1).landscape.next-landscape.next-next-landscape + article {
    --column: 10 / span 6;
  }
  .projects article:nth-child(3n+1).landscape.next-landscape.next-next-landscape + article + article {
    --column: 17 / span 7;
  }
  .projects article:nth-child(3n+1).landscape.next-landscape.next-next-portrait {
    --column: 1 / span 9;
  }
  .projects article:nth-child(3n+1).landscape.next-landscape.next-next-portrait + article {
    --column: 11 / span 8;
  }
  .projects article:nth-child(3n+1).landscape.next-landscape.next-next-portrait + article + article {
    --column: 20 / span 5;
  }
  .projects article:nth-child(3n+1).landscape.next-portrait.next-landscape {
    --column: 1 / span 8;
  }
  .projects article:nth-child(3n+1).landscape.next-portrait.next-landscape + article {
    --column: 10 / span 5;
  }
  .projects article:nth-child(3n+1).landscape.next-portrait.next-landscape + article + article {
    --column: 17 / span 7;
  }
  .projects article:nth-child(3n+1).landscape.next-portrait.next-portrait {
    --column: 1 / span 9;
  }
  .projects article:nth-child(3n+1).landscape.next-portrait.next-portrait + article {
    --column: 11 / span 6;
  }
  .projects article:nth-child(3n+1).landscape.next-portrait.next-portrait + article + article {
    --column: 19 / span 6;
  }
  .projects article:nth-child(3n+1).portrait.next-landscape.next-next-landscape {
    --column: 1 / span 6;
  }
  .projects article:nth-child(3n+1).portrait.next-landscape.next-next-landscape + article {
    --column: 8 / span 8;
  }
  .projects article:nth-child(3n+1).portrait.next-landscape.next-next-landscape + article + article {
    --column: 17 / span 9;
  }
  .projects article:nth-child(3n+1).portrait.next-landscape.next-next-portrait {
    --column: 1 / span 6;
  }
  .projects article:nth-child(3n+1).portrait.next-landscape.next-next-portrait + article {
    --column: 8 / span 8;
  }
  .projects article:nth-child(3n+1).portrait.next-landscape.next-next-portrait + article + article {
    --column: 18 / span 6;
  }
  .projects article:nth-child(3n+1).portrait.next-portrait.next-next-landscape {
    --column: 1 / span 6;
  }
  .projects article:nth-child(3n+1).portrait.next-portrait.next-next-landscape + article {
    --column: 9 / span 6;
  }
  .projects article:nth-child(3n+1).portrait.next-portrait.next-next-landscape + article + article {
    --column: 16 / span 9;
  }
  .projects article:nth-child(3n+1).portrait.next-portrait.next-next-portrait {
    --column: 1 / span 7;
  }
  .projects article:nth-child(3n+1).portrait.next-portrait.next-next-portrait + article {
    --column: 10 / span 6;
  }
  .projects article:nth-child(3n+1).portrait.next-portrait.next-next-portrait + article + article {
    --column: 18 / span 7;
  }
  .projects article:nth-child(3n+1).portrait.next-portrait.next-next-portrait + article.portrait.next-portrait.next-next-portrait + article.portrait.next-portrait.next-next-portrait + article {
    --column: 1 / span 6;
  }
  .projects article:nth-child(3n+1).portrait.next-portrait.next-next-portrait + article.portrait.next-portrait.next-next-portrait + article.portrait.next-portrait.next-next-portrait + article + article {
    --column: 9 / span 7;
  }
  .projects article:nth-child(3n+1).portrait.next-portrait.next-next-portrait + article.portrait.next-portrait.next-next-portrait + article.portrait.next-portrait.next-next-portrait + article + article + article {
    --column: 18 / span 6;
  }
}

@media screen and (max-width: 699px) {
  #projectsSlider {
    display: block;
  }
}
#projectsSlider {
  scroll-margin-top: 15vw;
  margin-top: 35px;
}
#projectsSlider article {
  padding: 0 4vw;
}
#projectsSlider article.portrait .imgWrapper {
  width: 60%;
  margin: 0 auto;
}

.archive h2 {
  margin-bottom: 1em;
}
.archive .agency {
  grid-column-end: span 3;
}
.archive .client {
  grid-column-end: span 3;
}
.archive .year {
  grid-column-end: span 1;
}
.archive #archiveProjectList {
  transition: color 0.2s ease-in-out;
}
.archive #archiveProjectList:hover {
  color: var(--secondaryColor);
}
.archive #archiveProjectList {
  /*
  @media screen and (max-width: 699px){
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.6s ease-in-out;

    li:first-child{
      margin-top: 1em;
    }

    &.show{
      max-height: 200vh;
    }
  }
  */
}
.archive .archiveProject {
  cursor: pointer;
}
.archive .archiveProject:hover {
  color: var(--mainColor);
}
@media screen and (max-width: 699px) {
  .archive .archiveProject .agency, .archive .archiveProject .client {
    display: inline-block;
  }
}

@media screen and (max-width: 699px) {
  .filterList {
    margin-bottom: 4vw;
  }
}
.filterList .filter {
  color: var(--secondaryColor);
}
.filterList .filter button.active, .filterList .filter button:hover {
  color: var(--mainColor);
}
.filterList .filter {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.4s ease-in-out;
}
.filterList .filter.show {
  opacity: 1;
  pointer-events: auto;
}
@media screen and (max-width: 699px) {
  .filterList .filter {
    max-height: 0;
    opacity: 1;
    overflow: hidden;
    transition: max-height 0.4s ease-in-out;
  }
  .filterList .filter.show {
    max-height: 50vh;
  }
  .filterList .filter ul {
    padding: 4vw 0 4px;
  }
}

button {
  font: inherit;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: none;
  cursor: pointer;
  width: auto;
  display: inline-block;
  text-align: left;
  transition: color 0.2s ease-in-out;
  color: inherit;
  letter-spacing: inherit;
}
button:hover {
  color: var(--secondaryColor);
}
button:focus {
  color: inherit;
  outline: none;
}
button.pt52 {
  line-height: 1.25;
}

#artistsList {
  column-count: 4;
  column-gap: 4px;
  transition: color 0.2s ease-in-out;
}
#artistsList li {
  break-inside: avoid;
}
#artistsList li a {
  width: 100%;
}
@media screen and (max-width: 699px) {
  #artistsList {
    column-count: 2;
  }
}
#artistsList li.inactive, #artistsList:hover a {
  color: var(--secondaryColorAlt);
}
#artistsList a:hover {
  color: var(--mainColor);
}

#artistsPreviews.hide {
  display: none;
}
#artistsPreviews article img {
  display: none;
}
#artistsPreviews.show article img {
  display: block;
}

#filteredArtistPreviews article {
  animation-name: fadeInFilteredPreview;
  animation-duration: 0.8s;
  animation-fill-mode: forwards;
}

@keyframes fadeInFilteredPreview {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.artistsGrid {
  align-items: center;
}
.artistsGrid article {
  grid-column-end: span 3;
  margin-top: 98px;
  opacity: 1;
  max-height: 100vw;
  max-width: 100%;
  transition: opacity 0.4s ease-in-out, max-height 0.01s ease-in-out, max-width 0.01s ease-in-out, margin-bottom 0.4s ease-in-out;
}
@media screen and (max-width: 699px) {
  .artistsGrid article {
    margin-top: 35px;
  }
}
.artistsGrid article.inactive {
  opacity: 0;
  max-height: 0;
  max-width: 0;
  transition: opacity 0.4s ease-in-out, max-height 0.01s ease-in-out 0.4s, max-width 0.01s ease-in-out 0.4s, margin-bottom 0.4s ease-in-out;
  margin-bottom: 0;
  pointer-events: none;
}
.artistsGrid article .details {
  opacity: 0;
  transition: opacity 0.4s ease-in-out;
}
.artistsGrid article .details .flex {
  width: 100%;
}
@media screen and (pointer: coarse) {
  .artistsGrid article .details {
    opacity: 1;
  }
}
.artistsGrid article:hover .details {
  opacity: 1;
}
@media screen and (min-width: 700px) {
  .artistsGrid article:nth-of-type(3n+1).landscape.singleInRow {
    grid-column: 1/span 4;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.singleInRow {
    grid-column: 1/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).landscape.twoInRow.next-landscape {
    grid-column: 1/span 4;
  }
  .artistsGrid article:nth-of-type(3n+1).landscape.twoInRow.next-landscape + article {
    grid-column: 6/span 4;
  }
  .artistsGrid article:nth-of-type(3n+1).landscape.twoInRow.next-portrait {
    grid-column: 1/span 4;
  }
  .artistsGrid article:nth-of-type(3n+1).landscape.twoInRow.next-portrait + article {
    grid-column: 6/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).landscape.twoInRow.next-portrait + article + article {
    grid-column: 10/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.twoInRow.next-landscape {
    grid-column: 1/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.twoInRow.next-landscape + article {
    grid-column: 5/span 4;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.twoInRow.next-landscape + article + article {
    grid-column: 1/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.twoInRow.next-portrait {
    grid-column: 1/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.twoInRow.next-portrait + article {
    grid-column: 5/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.twoInRow.next-portrait + article + article {
    grid-column: 9/span 4;
  }
  .artistsGrid article:nth-of-type(3n+1).landscape.next-landscape.next-next-landscape {
    grid-column: 1/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).landscape.next-landscape.next-next-landscape + article {
    grid-column: 5/span 4;
  }
  .artistsGrid article:nth-of-type(3n+1).landscape.next-landscape.next-next-landscape + article + article {
    grid-column: 1/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).landscape.next-landscape.next-next-portrait {
    grid-column: 1/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).landscape.next-landscape.next-next-portrait + article {
    grid-column: 5/span 4;
  }
  .artistsGrid article:nth-of-type(3n+1).landscape.next-landscape.next-next-portrait + article + article {
    grid-column: 1/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).landscape.next-portrait.next-next-landscape {
    grid-column: 1/span 4;
  }
  .artistsGrid article:nth-of-type(3n+1).landscape.next-portrait.next-next-landscape + article {
    grid-column: 6/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).landscape.next-portrait.next-next-landscape + article + article {
    grid-column: 10/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).landscape.next-portrait.next-next-portrait {
    grid-column: 1/span 4;
  }
  .artistsGrid article:nth-of-type(3n+1).landscape.next-portrait.next-next-portrait + article {
    grid-column: 6/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).landscape.next-portrait.next-next-portrait + article + article {
    grid-column: 10/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.next-landscape.next-next-portrait {
    grid-column: 1/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.next-landscape.next-next-portrait + article {
    grid-column: 5/span 4;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.next-landscape.next-next-portrait + article + article {
    grid-column: 1/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.next-landscape.next-next-landscape {
    grid-column: 1/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.next-landscape.next-next-landscape + article {
    grid-column: 5/span 4;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.next-landscape.next-next-landscape + article + article {
    grid-column: 1/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.next-portrait.next-next-portrait {
    grid-column: 1/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.next-portrait.next-next-portrait + article {
    grid-column: 5/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.next-portrait.next-next-portrait + article + article {
    grid-column: 9/span 4;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.next-portrait.next-next-landscape {
    grid-column: 1/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.next-portrait.next-next-landscape + article {
    grid-column: 5/span 3;
  }
  .artistsGrid article:nth-of-type(3n+1).portrait.next-portrait.next-next-landscape + article + article {
    grid-column: 9/span 4;
  }
}
@media screen and (max-width: 699px) {
  .artistsGrid article:nth-of-type(4n+1) {
    grid-column: 1/span 2;
  }
  .artistsGrid article:nth-of-type(4n+1) + article {
    grid-column: 4/span 3;
  }
  .artistsGrid article:nth-of-type(4n+3) {
    grid-column: 1/span 3;
  }
  .artistsGrid article:nth-of-type(4n+3) + article {
    grid-column: 5/span 2;
  }
}
.artistsGrid img {
  display: block;
}

#artistDetails {
  transition: max-height 0.4s ease-in-out;
}

.artistDetail {
  overflow: hidden;
  transition: transform 0.4s ease-in-out, opacity 0.4s ease-in-out;
}
.artistDetail .links {
  margin-top: 1em;
}
.artistDetail .links a {
  margin-right: 0.5em;
}
.artistDetail .images {
  align-items: center;
}
@media screen and (max-width: 699px) {
  .artistDetail .images {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.artistDetail .images img {
  display: block;
  cursor: pointer;
  transform: none;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(1) img {
  transition-delay: 0.05s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(2) img {
  transition-delay: 0.1s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(3) img {
  transition-delay: 0.15s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(4) img {
  transition-delay: 0.2s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(5) img {
  transition-delay: 0.25s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(6) img {
  transition-delay: 0.3s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(7) img {
  transition-delay: 0.35s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(8) img {
  transition-delay: 0.4s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(9) img {
  transition-delay: 0.45s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(10) img {
  transition-delay: 0.5s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(11) img {
  transition-delay: 0.55s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(12) img {
  transition-delay: 0.6s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(13) img {
  transition-delay: 0.65s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(14) img {
  transition-delay: 0.7s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(15) img {
  transition-delay: 0.75s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(16) img {
  transition-delay: 0.8s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(17) img {
  transition-delay: 0.85s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(18) img {
  transition-delay: 0.9s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(19) img {
  transition-delay: 0.95s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(20) img {
  transition-delay: 1s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(21) img {
  transition-delay: 1.05s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(22) img {
  transition-delay: 1.1s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(23) img {
  transition-delay: 1.15s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(24) img {
  transition-delay: 1.2s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(25) img {
  transition-delay: 1.25s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(26) img {
  transition-delay: 1.3s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(27) img {
  transition-delay: 1.35s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(28) img {
  transition-delay: 1.4s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(29) img {
  transition-delay: 1.45s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(30) img {
  transition-delay: 1.5s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(31) img {
  transition-delay: 1.55s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(32) img {
  transition-delay: 1.6s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(33) img {
  transition-delay: 1.65s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(34) img {
  transition-delay: 1.7s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(35) img {
  transition-delay: 1.75s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(36) img {
  transition-delay: 1.8s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(37) img {
  transition-delay: 1.85s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(38) img {
  transition-delay: 1.9s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(39) img {
  transition-delay: 1.95s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(40) img {
  transition-delay: 2s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(41) img {
  transition-delay: 2.05s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(42) img {
  transition-delay: 2.1s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(43) img {
  transition-delay: 2.15s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(44) img {
  transition-delay: 2.2s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(45) img {
  transition-delay: 2.25s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(46) img {
  transition-delay: 2.3s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(47) img {
  transition-delay: 2.35s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(48) img {
  transition-delay: 2.4s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(49) img {
  transition-delay: 2.45s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(50) img {
  transition-delay: 2.5s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(51) img {
  transition-delay: 2.55s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(52) img {
  transition-delay: 2.6s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(53) img {
  transition-delay: 2.65s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(54) img {
  transition-delay: 2.7s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(55) img {
  transition-delay: 2.75s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(56) img {
  transition-delay: 2.8s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(57) img {
  transition-delay: 2.85s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(58) img {
  transition-delay: 2.9s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(59) img {
  transition-delay: 2.95s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(60) img {
  transition-delay: 3s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(61) img {
  transition-delay: 3.05s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(62) img {
  transition-delay: 3.1s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(63) img {
  transition-delay: 3.15s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(64) img {
  transition-delay: 3.2s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(65) img {
  transition-delay: 3.25s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(66) img {
  transition-delay: 3.3s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(67) img {
  transition-delay: 3.35s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(68) img {
  transition-delay: 3.4s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(69) img {
  transition-delay: 3.45s;
}
.artistDetail .images .imgWrapper-fixedRatio:nth-child(70) img {
  transition-delay: 3.5s;
}
.artistDetail.show .images img {
  opacity: 1;
}

.caption {
  margin-top: 0.5em;
}

#newsletterOverlay {
  padding: 1.5rem 2rem;
  border-radius: 4px;
  background-color: var(--secondaryColorAlt);
  position: fixed;
  z-index: 2;
  right: 1.9vw;
  bottom: 1.9vw;
  width: calc((100vw - 3.8vw) / 4 - 2px);
  transition: opacity 0.3s ease-in-out, transform 0.4s ease-in-out;
}
#newsletterOverlay a.flex {
  flex: 1 1 auto;
}
@media screen and (max-width: 1300px) {
  #newsletterOverlay {
    width: calc((100vw - 3.8vw) / 3 - 2px);
  }
}
@media screen and (max-width: 1023px) {
  #newsletterOverlay {
    width: calc((100vw - 3.8vw) / 2.4 - 2px);
  }
}
@media screen and (max-width: 699px) {
  #newsletterOverlay {
    display: none;
  }
}
#newsletterOverlay button {
  padding: 3px;
  transform: scale(1.6);
  margin-left: 1rem;
  line-height: 0.4;
}
#newsletterOverlay.hidden {
  transform: translateY(100%);
}
#newsletterOverlay.hidden, #newsletterOverlay.fadeAway {
  opacity: 0 !important;
  pointer-events: none;
}
#newsletterOverlay {
  transform: translateX(100%);
  opacity: 0;
  animation-name: moveIn;
  animation-delay: 7s;
  animation-duration: 2s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

@keyframes bounce {
  0% {
    transform: translateY(0) scale(1, 1);
  }
  15% {
    transform: translateY(2px) scale(1, 1);
  }
  35% {
    transform: translateY(-20px);
  }
  50% {
    transform: translateY(20px);
  }
  55% {
    transform: translateY(0);
  }
  70% {
    transform: translateY(-5px) scale(1.02, 0.94);
  }
  80% {
    transform: translateY(2px) scale(1);
  }
  92% {
    transform: translateY(-1px) scale(1.01, 0.99);
  }
  100% {
    transform: translateY(0) scale(1, 1);
  }
}
@keyframes moveIn {
  0% {
    transform: translateX(100%);
    opacity: 0;
  }
  50%, 100% {
    transform: translateX(0%);
    opacity: 1;
  }
}
.objectFitContain {
  display: block;
  object-fit: contain;
  height: 100%;
  width: 100%;
}

#publications, #prints {
  margin-bottom: 49px;
}
@media screen and (max-width: 699px) {
  #publications, #prints {
    margin-bottom: 35px;
  }
}
#publications h2, #prints h2 {
  margin-bottom: 1em;
}
@media screen and (max-width: 699px) {
  #publications article, #prints article {
    margin-bottom: 0;
  }
}
#publications article.hide, #prints article.hide {
  display: none;
}
#publications article .cover, #prints article .cover {
  background-color: var(--secondaryColorAlt);
  padding: 1rem;
  height: calc((100vw - 3.8vw) / 4 / 1.5);
  margin-bottom: 1em;
  opacity: 0;
  transition: opacity 0.5s ease-in-out;
}
@media screen and (max-width: 699px) {
  #publications article .cover, #prints article .cover {
    height: calc((100vw - 8vw) / 1.5);
  }
}
#publications article .cover img.small, #prints article .cover img.small {
  transform: scale(0.6);
}
#publications article .cover img.medium, #prints article .cover img.medium {
  transform: scale(0.8);
}
#publications article:nth-child(1) .cover, #prints article:nth-child(1) .cover {
  transition-delay: 0.3s;
}
#publications article:nth-child(2) .cover, #prints article:nth-child(2) .cover {
  transition-delay: 0.6s;
}
#publications article:nth-child(3) .cover, #prints article:nth-child(3) .cover {
  transition-delay: 0.9s;
}
#publications article:nth-child(4) .cover, #prints article:nth-child(4) .cover {
  transition-delay: 1.2s;
}
#publications article:nth-child(5) .cover, #prints article:nth-child(5) .cover {
  transition-delay: 1.5s;
}
#publications article:nth-child(6) .cover, #prints article:nth-child(6) .cover {
  transition-delay: 1.8s;
}
#publications article:nth-child(7) .cover, #prints article:nth-child(7) .cover {
  transition-delay: 2.1s;
}
#publications article:nth-child(8) .cover, #prints article:nth-child(8) .cover {
  transition-delay: 2.4s;
}
#publications article:nth-child(9) .cover, #prints article:nth-child(9) .cover {
  transition-delay: 2.7s;
}
#publications article:nth-child(10) .cover, #prints article:nth-child(10) .cover {
  transition-delay: 3s;
}
#publications article:nth-child(11) .cover, #prints article:nth-child(11) .cover {
  transition-delay: 3.3s;
}
#publications article:nth-child(12) .cover, #prints article:nth-child(12) .cover {
  transition-delay: 3.6s;
}
#publications article:nth-child(13) .cover, #prints article:nth-child(13) .cover {
  transition-delay: 3.9s;
}
#publications article:nth-child(14) .cover, #prints article:nth-child(14) .cover {
  transition-delay: 4.2s;
}
#publications article:nth-child(15) .cover, #prints article:nth-child(15) .cover {
  transition-delay: 4.5s;
}
#publications article:nth-child(16) .cover, #prints article:nth-child(16) .cover {
  transition-delay: 4.8s;
}
#publications article:nth-child(17) .cover, #prints article:nth-child(17) .cover {
  transition-delay: 5.1s;
}
#publications article:nth-child(18) .cover, #prints article:nth-child(18) .cover {
  transition-delay: 5.4s;
}
#publications article:nth-child(19) .cover, #prints article:nth-child(19) .cover {
  transition-delay: 5.7s;
}
#publications article:nth-child(20) .cover, #prints article:nth-child(20) .cover {
  transition-delay: 6s;
}
#publications article:nth-child(21) .cover, #prints article:nth-child(21) .cover {
  transition-delay: 6.3s;
}
#publications article:nth-child(22) .cover, #prints article:nth-child(22) .cover {
  transition-delay: 6.6s;
}
#publications article:nth-child(23) .cover, #prints article:nth-child(23) .cover {
  transition-delay: 6.9s;
}
#publications article:nth-child(24) .cover, #prints article:nth-child(24) .cover {
  transition-delay: 7.2s;
}
#publications article:nth-child(25) .cover, #prints article:nth-child(25) .cover {
  transition-delay: 7.5s;
}
#publications article:nth-child(26) .cover, #prints article:nth-child(26) .cover {
  transition-delay: 7.8s;
}
#publications article:nth-child(27) .cover, #prints article:nth-child(27) .cover {
  transition-delay: 8.1s;
}
#publications article:nth-child(28) .cover, #prints article:nth-child(28) .cover {
  transition-delay: 8.4s;
}
#publications article:nth-child(29) .cover, #prints article:nth-child(29) .cover {
  transition-delay: 8.7s;
}
#publications article:nth-child(30) .cover, #prints article:nth-child(30) .cover {
  transition-delay: 9s;
}
#publications .isSlider article, #prints .isSlider article {
  padding-right: 4px;
}
#publications .isSlider article:nth-child(4n), #prints .isSlider article:nth-child(4n) {
  padding-right: 0;
}
@media screen and (max-width: 699px) {
  #publications .isSlider article, #prints .isSlider article {
    padding-right: 0;
  }
}
#publications.show article .cover, #prints.show article .cover {
  opacity: 1;
}
#publications .flex .left, #publications .flex .right, #prints .flex .left, #prints .flex .right {
  flex: 0 0 50%;
  padding-right: 10px;
}
#publications .publisherWrapper, #prints .publisherWrapper {
  margin-top: 1em;
  padding-right: 10px;
}
#publications .publisherWrapper .publisher, #prints .publisherWrapper .publisher {
  text-transform: uppercase;
}
#publications .externalArrow, #prints .externalArrow {
  display: inline-block;
  height: 0.7em;
  width: auto;
  margin-right: 2px;
}

#exhibitions h2 {
  margin-bottom: 0.5em;
}
#exhibitions .place, #exhibitions .date {
  color: var(--secondaryColor);
}
@media screen and (max-width: 699px) {
  #exhibitions li {
    margin: 1rem 0;
  }
}

#contact .contactInfos {
  padding-right: 1rem;
}
@media screen and (max-width: 699px) {
  #contact .contactInfos {
    padding-right: 0;
  }
}
@media screen and (max-width: 699px) {
  #contact .contactInfos h2 {
    opacity: 0;
  }
}
@media screen and (max-width: 699px) {
  #contact #newsletterForm {
    margin-top: 28px;
    background-color: var(--secondaryColor);
    border-radius: 4px;
    padding: 1em 1em 1.3em;
  }
  #contact #newsletterForm h2 {
    margin-bottom: 0;
  }
  #contact #newsletterForm .smartphoneGrid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    margin-top: 0.5rem;
    align-items: start;
  }
  #contact #newsletterForm .smartphoneGrid button {
    text-align: right;
  }
}

.modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 5;
  background-color: var(--backgroundColor);
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.4s ease-in-out;
}
.modal.show {
  opacity: 1;
  pointer-events: auto;
}
@media screen and (max-width: 699px) {
  .modal #closeImprint {
    margin-top: 1em;
  }
}
.modal .infos {
  position: absolute;
  top: 1.9vw;
  left: 1.9vw;
  right: 1.9vw;
  z-index: 2;
  mix-blend-mode: difference;
  color: white;
}
.modal .infos div:first-child {
  grid-column-start: 1;
  grid-column-end: span 2;
}
.modal .infos div:nth-child(2) {
  grid-column-end: span 2;
}
.modal .infos .slideIndicator {
  grid-column-start: 11;
}
.modal .infos .close {
  grid-column-start: 12;
}
.modal .infos .credits span {
  display: block;
}
@media screen and (max-width: 699px) {
  .modal .infos {
    top: 4vw;
    left: 4vw;
    right: 4vw;
    grid-template-areas: "credits credits credits credits credits indicator" "artist artist artist artist artist indicator";
  }
  .modal .infos .artist {
    grid-area: artist !important;
    margin-top: 0.5em;
  }
  .modal .infos .credits {
    grid-area: credits;
  }
  .modal .infos .slideIndicator {
    grid-area: indicator;
  }
  .modal .infos .close {
    display: none;
  }
}
.modal.artistSlider .infos .artist {
  grid-column-start: 1;
  grid-row-start: 1;
}
.modal.artistSlider .infos .credits {
  grid-column-start: 3;
}
@media screen and (max-width: 699px) {
  .modal.artistSlider .infos {
    grid-template-areas: "artist artist artist artist artist indicator" "credits credits credits credits credits indicator";
  }
  .modal.artistSlider .infos .artist {
    margin-top: 0;
  }
  .modal.artistSlider .infos .credits {
    margin-top: 0.5em;
    grid-column-start: 1;
    grid-column-end: span 4;
  }
}
.modal .imageContainer {
  height: 100%;
  width: 100%;
}
.modal .imageContainer .slide {
  padding: 1.9vw;
}
@media screen and (max-width: 699px) {
  .modal .imageContainer .slide {
    padding: 4vw;
  }
}
.modal .siema,
.modal .siema div {
  height: 100%;
}
.modal .siema > div > div {
  transform: translateZ(0);
}

#lightbox article {
  height: 100%;
  display: none;
}
#lightbox article.show {
  display: block;
}

#intro {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: var(--backgroundColor);
  z-index: 101;
  animation-name: intro;
  animation-duration: 4s;
  animation-fill-mode: forwards;
  pointer-events: none;
}
#intro .headline {
  animation-fill-mode: forwards;
}
#intro .headline:first-child {
  animation: pulse ease-out 1.5s -0.5s 4, shiftPast 4s;
}
#intro .headline:nth-child(2) {
  animation: pulse ease-out 1.5s 0s 2, shiftPresent 4s;
}
#intro .headline:nth-child(3) {
  animation: pulse ease-out 1.5s 0.5s 4, shiftFuture 4s;
}
@media screen and (max-width: 699px) {
  #intro .headline {
    margin-bottom: 4px;
  }
}

@keyframes intro {
  0% {
    opacity: 1;
  }
  95% {
    opacity: 1;
  }
  100% {
    pointer-events: none;
    opacity: 0;
  }
}
@keyframes pulse {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.01;
  }
  100% {
    opacity: 1;
  }
}
@keyframes shiftPast {
  0% {
    transform: translateY(0%);
  }
  60% {
    transform: translateY(0%);
  }
  100% {
    transform: translateY(-150%);
  }
}
@keyframes shiftPresent {
  0% {
    transform: translateY(0%);
  }
  60% {
    transform: translateY(0%);
  }
  100% {
    transform: translateY(-9.7vw);
  }
}
@keyframes shiftFuture {
  0% {
    transform: translateY(0%);
  }
  60% {
    transform: translateY(0%);
  }
  100% {
    transform: translateY(100vh);
  }
}
.fadeIn {
  opacity: 0;
  transform: translateY(6%);
  transition: opacity 0.7s ease-out 0.2s, transform 0.7s ease-out 0.2s;
}
.fadeIn.show {
  opacity: 1;
  transform: translateY(0);
}

.hidden {
  display: none;
}

@media screen and (max-width: 699px) {
  .hideOnSmartphone {
    display: none;
  }
}

.smartphoneOnly {
  display: none;
}
@media screen and (max-width: 699px) {
  .smartphoneOnly {
    display: initial;
  }
}

.imgWrapper-fixedRatio {
  position: relative;
  display: block;
  aspect-ratio: var(--ratio, 1);
}
.imgWrapper-fixedRatio img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.imgWrapper-fixedRatio .playButton {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 80%;
  width: 80%;
  max-width: 50px;
  max-height: 50px;
  display: block;
  pointer-events: none;
}

.mt-1 {
  margin-top: 98px;
}
@media screen and (max-width: 699px) {
  .mt-1 {
    margin-top: 35px;
  }
}

.mt-2 {
  margin-top: 49px;
}
@media screen and (max-width: 699px) {
  .mt-2 {
    margin-top: 28px;
  }
}

.mt-3 {
  margin-top: 24.5px;
}
@media screen and (max-width: 699px) {
  .mt-3 {
    margin-top: 21px;
  }
}

.mt-4 {
  margin-top: 1.9vw;
}
@media screen and (max-width: 699px) {
  .mt-4 {
    margin-top: 4vw;
  }
}

.mb-4 {
  margin-bottom: calc(1.9vw - 0.5vw);
}
@media screen and (max-width: 699px) {
  .mb-4 {
    margin-bottom: 4vw;
  }
}

#imprintOverlay header {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
}
#imprintOverlay article {
  padding-top: calc(12.1vw + 3.8vw);
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
#imprintOverlay article h1, #imprintOverlay article h2, #imprintOverlay article h3, #imprintOverlay article h4, #imprintOverlay article p {
  margin-bottom: 1em;
}
#imprintOverlay article .section {
  padding-right: 1em;
  max-width: calc(100vw - 3.8vw);
}
@media screen and (max-width: 699px) {
  #imprintOverlay article {
    padding-top: 30vw;
    grid-template-columns: 1fr;
  }
  #imprintOverlay article .section {
    padding-right: 0;
    max-width: calc(100vw - 8vw);
  }
}

input {
  font: inherit;
  border: none;
  border-radius: 0;
  background: none;
  margin: 0;
  padding: 0;
  color: inherit;
  line-height: 1.06;
  letter-spacing: inherit;
}
input[type=email] {
  width: 100%;
  font-family: Arial, sans-serif;
}
@media screen and (max-width: 699px) {
  input[type=email] {
    padding-top: 2rem;
    margin-bottom: 0;
  }
}
input[type=checkbox] {
  opacity: 0;
  position: absolute;
  left: -1em;
}
input[type=checkbox]:checked + .labelText {
  color: var(--mainColor);
}
input[type=checkbox]:checked + .labelText .minus {
  display: none;
}
input[type=checkbox]:checked + .labelText .plus {
  display: inline;
}
@media screen and (max-width: 699px) {
  input {
    line-height: 1.2;
  }
}

.emailInputWrapper {
  height: 1em;
  overflow: visible;
}
@media screen and (max-width: 699px) {
  .emailInputWrapper {
    height: 3em;
  }
}

fieldset {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 1.06em;
  position: relative;
}
@media screen and (max-width: 699px) {
  fieldset {
    display: block;
    height: auto;
  }
}
fieldset label {
  position: relative;
  cursor: pointer;
  transition: color 0.2s ease-in-out;
  color: var(--secondaryColor);
}
@media screen and (max-width: 699px) {
  fieldset label {
    color: var(--mainColor);
  }
}
fieldset label:hover {
  color: var(--mainColor);
}
fieldset label .indicator {
  display: inline-block;
  width: 8px;
  margin-right: 4px;
}
fieldset label .indicator .plus {
  display: none;
}

::placeholder {
  color: var(--secondaryColor);
  opacity: 1;
  line-height: normal;
}
@media screen and (max-width: 699px) {
  ::placeholder {
    color: black;
  }
}

.pointer {
  cursor: pointer;
}

#future header h1 {
  font-kerning: none;
}

#printList.show .paypal-button {
  display: block;
}
#printList .paypal-button {
  display: none;
  margin-top: 7px;
}
#printList .print-preview {
  cursor: pointer;
}

.inline-form {
  display: inline-block;
}

#publicationList article, #printList article {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}
#publicationList article.show, #printList article.show {
  max-height: 30rem;
  opacity: 1;
  margin-bottom: 3rem;
}
@media screen and (max-width: 699px) {
  #publicationList article.show, #printList article.show {
    margin-bottom: 2rem;
  }
}
#publicationList article.show:nth-last-child(-n+4), #printList article.show:nth-last-child(-n+4) {
  margin-bottom: 0;
}
@media screen and (max-width: 699px) {
  #publicationList article.show:nth-last-child(-n+4), #printList article.show:nth-last-child(-n+4) {
    margin-bottom: 2rem;
  }
}

#loadMorePublications, #loadMorePrints {
  margin-top: -2.2rem;
}
@media screen and (max-width: 699px) {
  #loadMorePublications, #loadMorePrints {
    margin-top: 0;
  }
}
#loadMorePublications.hide-filtered, #loadMorePrints.hide-filtered {
  display: none;
}

/*# sourceMappingURL=pp-new.css.map */