:root {
  --glider-spacing: 1rem;
  --glider-top-padding: 0.5rem;
  --glider-right-padding: calc((100% - 80rem) / 2 + 7.75rem);
  --glider-bottom-padding: 0.5rem;
  --glider-left-padding: 0;
  --glider-peek: 0.5;
  --glider-spacing: 1rem;
}

.glider {
  position: relative;
}
.glider .glider-grid {
  display: grid;
  grid-auto-columns: calc(100% / (2 + var(--glider-peek)) - var(--glider-spacing));
  gap: var(--glider-spacing);
  grid-auto-flow: column;
  overflow-x: scroll;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  padding: 0.5rem;
}
.glider .glider-grid-item {
  height: auto;
  scroll-snap-align: start;
  aspect-ratio: 9/16;
}

@media (min-width: 576px) {
  .glider-mq .glider-grid {
    grid-auto-columns: 25.5263157895%;
  }
}
@media (min-width: 768px) {
  .glider-mq .glider-grid {
    grid-auto-columns: 32.3333333333%;
  }
}
@media (min-width: 992px) {
  .glider-mq .glider-grid {
    grid-auto-columns: 24%;
  }
}
@media (min-width: 1200px) {
  .glider-mq .glider-grid {
    grid-auto-columns: 15.6666666667%;
  }
}
@media (min-width: 992px) {
  .glider-mq .glider-grid.glider-grid-6-cols {
    grid-auto-columns: 32%;
  }
}

.glider-pager {
  display: flex;
  gap: 0.5rem;
  justify-content: center;
  align-items: center;
  margin: 0.5rem 0;
}
.glider-pager-item {
  border: none;
  width: 1rem;
  height: 1rem;
  background-color: #d3d3d3;
  border-radius: 50%;
  cursor: pointer;
}
.glider-pager-item:hover, .glider-pager-item:focus {
  outline: 2px solid #7d7d7d;
}
.glider-pager-item.active {
  background-color: #a9a9a9;
}

@supports (container-type: inline-size) {
  .glider-cq {
    container-type: inline-size;
    container-name: glider-cq;
  }
  @container glider-cq (min-width: 510px) {
    .glider-cq .glider-grid {
      grid-auto-columns: 32%;
    }
  }
  @container glider-cq (min-width: 690px) {
    .glider-cq .glider-grid {
      grid-auto-columns: 32%;
    }
  }
  @container glider-cq (min-width: 930px) {
    .glider-cq .glider-grid {
      grid-auto-columns: 24%;
    }
  }
  @container glider-cq (min-width: 1080px) {
    .glider-cq .glider-grid {
      grid-auto-columns: 15.7%;
    }
  }
}

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