
body {
/*  background-color: var(--bs-tertiary-bg);*/
  background-color: #f2e0b4;
}

.anchor {
    scroll-margin-top: 76px;
}

.icon {
  border-radius: 5px;
  width: 40px;
/*  box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.25);*/
}

.small-icon {
  border-radius: 5px;
  width: 20px;
}

.label {
  display: flex;
  align-items: center;
  gap: 10px;
}

.navbar {
  background-color: rgba(var(--bs-tertiary-bg-rgb), 0.5) !important;
  backdrop-filter: blur(30px);
  -webkit-backdrop-filter: blur(30px);
  /* offset-x | offset-y | blur-radius | color */
  box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15);
}

#screenshotsCarousel {
  width: 300px;
  margin: auto;
}

#screenshotsCarousel img {
  border-radius: 38px;
}

.screenshot {
  border-radius: 5px;
  margin: auto;
  display: block;
  width: auto;
  max-width: 100%;
  min-width: 100px;
}
@media (min-width: 414px) {
  .screenshot {
    max-width: 390px;
  }
}

/* iPhone 13 Pro */
.iphone_container {
  width: 350px;
  height: 675px;
  margin: auto;
  position: relative;
}

.iphone_blending_background {
  position: absolute;
  top: 20px;
  left: 28px;
  border-radius: 35px;
  width: 293px;
  height: 633px;
  background-color: white;
}

.iphone_image {
  width: 99.8%;
  height: 99.8%;
  background-image: url("/img/iPhone13Pro.webp");
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
}

.iphone_contents {
  position: absolute;
  top: 20px;
  left: 28px;
  border-radius: 35px;
  width: 293px;
  mix-blend-mode: multiply;
}

/* iPhone 17 */
.iphone17_container {
  width: 338px;
  height: 690px;
  margin: auto;
  position: relative;
}

.iphone17_blending_background {
  position: absolute;
  top: 16.5px;
  left: 18px;
  border-radius: 35px;
  width: 302px;
  height: 656px;
  background-color: white;
}

.iphone17_image {
  width: 99.8%;
  height: 99.8%;
  background-image: url("/img/iPhone17.webp");
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
}

.iphone17_contents {
  position: absolute;
  top: 16.5px;
  left: 18px;
  border-radius: 35px;
  width: 302px;
  mix-blend-mode: multiply;
}

.caption {
  font-style: italic;
  color: var(--bs-secondary-color);
  padding: 10px 0px;
}

.centered {
  text-align: center;
}

footer {
  text-align: center;
  color: var(--bs-secondary-color);
  padding: 10px 0px;
  font-size: 11pt;
}
