#design-pages {
  display: flex;
  flex-direction: row;
  position: absolute;
  left: 0;
  right: 0;
  overflow-x: scroll;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
}

.design-page {
  position: relative;
  flex: 0 0 100%;
  margin-bottom: 100px;
}

.design-page-top {
  position: relative;
  height: 100vh;
  scroll-snap-align: start;
}

.design-splash-img {
  margin: auto;
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  max-height: 70%;
  max-width: 70% !important;
}

.design-page-controls {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  pointer-events: none;
}

.design-page-controls .container {
  position: relative;
  height: 100%;
}

.design-control-link {
  user-select: none;
  pointer-events: auto;
}

.design-control-link.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.design-control-arrow {
  z-index: 100;
  position: absolute;
  transition: all 0.3s;
  opacity: 0.65;
  color: black;
}

.design-control-arrow:hover {
  opacity: 0.8;
}

.design-control-arrow:active {
  transform: scale(1.1);
}

.design-control-arrow img {
  width: 128px;
}
@media (max-width: 575px) {
  .design-control-arrow img {
    width: 64px;
  }
}

.design-control-next {
  top: 50%;
  right: 10px;
}

.design-control-prev {
  top: 50%;
  left: 10px;
}

.design-control-scroll-down {
  bottom: 3.5%;
  right: 10px;
}

.design-control-text {
  font-family: "Unica One", sans-serif;
  text-transform: uppercase;
  font-size: 26px;
}
@media (max-width: 575px) {
  .design-control-text {
    font-size: 13px;
  }
}

.design-control-next .design-control-text {
  position: absolute;
  top: 40px;
  right: 10px;
}
@media (max-width: 575px) {
  .design-control-next .design-control-text {
    top: 20px;
  }
}

.design-control-prev .design-control-text {
  position: absolute;
  top: -20px;
  left: 10px;
}
@media (max-width: 575px) {
  .design-control-prev .design-control-text {
    top: -10px;
  }
}

.design-control-scroll-down img {
  margin-top: 20px;
  width: 100px;
}
@media (max-width: 575px) {
  .design-control-scroll-down img {
    width: 50px;
  }
}

.design-control-scroll-down .design-control-text {
  position: absolute;
  left: -310px;
  width: 300px;
  top: 22px;
  text-align: right;
}

.back-button {
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s;
}

.design-page.scrolled-down .back-button {
  display: initial;
  opacity: 1;
  pointer-events: auto;
}

.design-control-back {
  position: fixed;
  top: 10%;
}

.design-control-back .design-control-text {
  position: absolute;
  left: 0;
  width: 100px;
  top: 20px;
  text-align: center;
}
@media (max-width: 575px) {
  .design-control-back .design-control-text {
    width: 50px;
    top: 20px;
  }
}

.design-page h1, .design-page h2, .design-page h3, .design-page h4 {
  text-align: center;
  margin: 0 auto 100px;
  font-family: "Roboto", sans-serif;
  font-weight: 300;
}

.design-page h1 {
  color: white;
  font-size: 200px;
}

.design-page p {
  text-align: center;
  max-width: 800px;
  margin: 0 auto 100px;
  font-weight: 300;
  font-size: 20px;
}

.design-page img {
  margin-bottom: 100px;
  max-width: 100%;
}

.design-page p:has(> img) + p:has(> img) img {
  /* select images following images (wrapped in <p> because that's what our markdown produces) */
  margin-top: -100px;
}

.full-width-img {
  width: 100vw;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw);
  text-align: center;
  display: block;
}

.full-img {
  width: 100%;
  text-align: center;
  display: block;
}

.fit-screen-img-container {
  display: flex;
  justify-content: center; /* horizontal */
  align-items: center; /* vertical */
  height: 100vh; /* full screen */
}

.fit-screen-img {
  max-height: 70%;
  max-width: 70% !important;
}

.btn-project-pdf {
  border-radius: 200px;
  border: 1px solid black !important;
  text-transform: lowercase;
}

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