#home {
  z-index: 1;
  padding: 6.2rem var(--page-padding) 2.4rem;
}

#home .flexbox {
  position: relative;
  display: block;
  width: 100%;
  visibility: hidden;
  opacity: 0;
  transition: opacity 1s ease;
}

#home.is-ready .flexbox {
  visibility: visible;
  opacity: 1;
}

#home .grid-sizer {
  width: 100%;
}

#home li {
  display: flex;
  width: 100%;
  margin: 0;
  padding: 0 0 2.2rem;
  flex-flow: column wrap;
  justify-content: center;
  opacity: 1;
  contain: layout paint;
}

#home li:nth-of-type(2n) {
  padding-bottom: 2rem;
}

#home li:nth-of-type(3n) {
  padding-bottom: 3rem;
}

#home li:nth-of-type(4n) {
  padding-top: 1.2rem;
}

#home li:nth-of-type(5n) {
  padding-left: 6vw;
}

#home li:nth-of-type(6n) {
  padding-right: 7vw;
}

#home figure {
  display: block;
  width: 88%;
}

#home li:nth-of-type(4n) figure {
  width: 78%;
}

#home li:nth-of-type(5n) figure {
  width: 96%;
}

#home li:nth-of-type(7n) figure {
  width: 74%;
}

#home li:nth-of-type(2n) figure,
#home li:nth-of-type(5n) figure,
#home li:nth-of-type(8n) figure {
  margin-right: auto;
  margin-left: 0;
}

#home li:nth-of-type(3n) figure,
#home li:nth-of-type(7n) figure,
#home li:nth-of-type(9n) figure {
  margin-right: 0;
  margin-left: auto;
}

#home .image-container {
  background: var(--soft);
}

#home .image-container.is-loaded {
  background: transparent;
}

@media screen and (min-width: 65rem) {
  #home {
    padding-top: 3.4rem;
  }

  #home .grid-sizer {
    width: 50%;
  }

  #home li {
    width: 50%;
    margin: 0;
    padding: 0 4vw 4.4rem;
  }

  #home li.home-rhythm-0,
  #home li.home-rhythm-5 {
    width: 100%;
    padding-right: 28vw;
    padding-left: 28vw;
  }

  #home li.home-rhythm-0 figure,
  #home li.home-rhythm-5 figure {
    width: 100%;
    max-width: 34rem;
    margin-right: auto;
    margin-left: auto;
    transform: none;
  }

  #home li.hochformat {
    width: 50%;
  }

  #home li.querformat {
    width: 50%;
  }

  #home li:nth-of-type(odd) {
    padding-right: 4.4vw;
    padding-left: 3vw;
  }

  #home li:nth-of-type(2n) {
    padding-top: 8vh;
    padding-right: 3vw;
    padding-left: 4.4vw;
  }

  #home li:nth-of-type(3n) {
    padding-bottom: 6.6rem;
  }

  #home li:nth-of-type(4n) {
    padding-top: 17vh;
  }

  #home li:nth-of-type(5n) {
    padding-bottom: 3.2rem;
  }

  #home li:nth-of-type(6n) {
    padding-top: 4vh;
  }

  #home li:nth-of-type(7n) {
    padding-top: 12vh;
    padding-bottom: 7.4rem;
  }

  #home li:nth-of-type(8n) {
    padding-top: 2vh;
    padding-bottom: 5rem;
  }

  #home figure {
    width: 94%;
    max-width: 38rem;
  }

  #home li:nth-of-type(odd) figure {
    margin-right: 0;
    margin-left: auto;
  }

  #home li:nth-of-type(2n) figure {
    margin-right: auto;
    margin-left: 0;
  }

  #home li.querformat figure {
    width: 100%;
    max-width: 41rem;
  }

  #home li.hochformat figure {
    width: 80%;
    max-width: 30rem;
  }

  #home li:nth-of-type(3n) figure {
    width: 96%;
  }

  #home li:nth-of-type(4n + 1) figure {
    width: 100%;
    transform: translateX(-2vw);
  }

  #home li:nth-of-type(4n + 2) figure {
    width: 82%;
    transform: translateX(3vw);
  }

  #home li:nth-of-type(4n + 3) figure {
    width: 68%;
    transform: translateX(-4vw);
  }

  #home li:nth-of-type(4n + 4) figure {
    width: 100%;
    transform: translateX(1vw);
  }

  #home li:nth-of-type(9n) figure {
    width: 78%;
    transform: translateX(4vw);
  }

  #home li.home-rhythm-1 {
    padding-top: 14vh;
    padding-bottom: 2.8rem;
  }

  #home li.home-rhythm-2 {
    padding-top: 2vh;
    padding-bottom: 6.8rem;
  }

  #home li.home-rhythm-3 {
    padding-top: 12vh;
    padding-right: 8vw;
  }

  #home li.home-rhythm-4 {
    padding-top: 1vh;
    padding-left: 8vw;
  }

  #home li.home-rhythm-6 {
    padding-top: 18vh;
    padding-right: 3vw;
    padding-left: 8vw;
  }

  #home li.home-rhythm-7 {
    padding-top: 4vh;
    padding-bottom: 7.8rem;
  }

  #home li.home-rhythm-8 {
    padding-top: 12vh;
    padding-right: 8vw;
  }

  #home li.home-rhythm-9 {
    padding-top: 1vh;
    padding-left: 6vw;
  }

  #home li.home-rhythm-10 {
    padding-top: 15vh;
    padding-bottom: 4rem;
  }

  #home li.home-rhythm-11 {
    padding-top: 6vh;
    padding-right: 6vw;
    padding-left: 4vw;
  }

  #home li.home-rhythm-1 figure,
  #home li.home-rhythm-4 figure,
  #home li.home-rhythm-8 figure {
    margin-right: auto;
    margin-left: 0;
  }

  #home li.home-rhythm-2 figure,
  #home li.home-rhythm-3 figure,
  #home li.home-rhythm-7 figure,
  #home li.home-rhythm-10 figure {
    margin-right: 0;
    margin-left: auto;
  }

  #home li.home-rhythm-6 figure {
    width: 74%;
    transform: translateX(-3vw);
  }

  #home li.home-rhythm-8 figure {
    width: 84%;
    transform: translateX(2vw);
  }

  #home li.home-rhythm-11 figure {
    width: 98%;
    transform: translateX(-1vw);
  }

  #home li.home-rhythm-0,
  #home li.home-rhythm-5,
  #home li.home-rhythm-0.hochformat,
  #home li.home-rhythm-0.querformat,
  #home li.home-rhythm-5.hochformat,
  #home li.home-rhythm-5.querformat {
    width: 100%;
    padding-right: 28vw;
    padding-left: 28vw;
  }

  #home li.home-rhythm-0 figure,
  #home li.home-rhythm-5 figure,
  #home li.home-rhythm-0.hochformat figure,
  #home li.home-rhythm-0.querformat figure,
  #home li.home-rhythm-5.hochformat figure,
  #home li.home-rhythm-5.querformat figure {
    width: 100%;
    max-width: 34rem;
    margin-right: auto;
    margin-left: auto;
    transform: none;
  }
}
