.DnnModule {
  min-width: 0;
}
#libcal-calendars {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#libcal-calendars h2 {
  width: fit-content;
  position: relative;
  background-color: white;
}
#libcal-calendars h2::before {
  content: "";
  position: absolute;
  width: 4rem;
  height: 100%;
  left: -4rem;
  background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1));
}
#libcal-calendars h2::after {
  content: "";
  position: absolute;
  width: 4rem;
  height: 100%;
  right: -4rem;
  background: linear-gradient(to left, rgba(255,255,255,0), rgba(255,255,255,1));
}
.calendars.swiper {
  padding-bottom: 8rem;
  padding-inline: 1rem;
}
.calendars.swiper .swiper-wrapper {
  align-items: stretch;
}

.calendars .swiper-slide {
  gap: 1rem;
  color: white;
  text-decoration: none;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  background: linear-gradient(to bottom, #062140, #37608E);
  align-self: stretch;
  height: unset;
  margin-block: 1rem;
  transition: transform 0.25s ease-in-out, filter .25s ease-in-out;
  text-align: center;
}

.calendars .swiper-slide img {
  aspect-ratio: 1 / 1;
  width: 80%;
}
.calendars .swiper-slide span {
  width: 100%;
}

.calendars .swiper-slide:hover,
.calendars .swiper-slide:focus-visible {
  color: white;
  text-decoration: underline;
  transform: scale(1.1);
}

.calendars .swiper-slide:nth-child(1):hover,
.calendars .swiper-slide:nth-child(1):focus-visible {
  filter: hue-rotate(130deg) saturate(200%);
}

.calendars .swiper-slide:nth-child(2):hover,
.calendars .swiper-slide:nth-child(2):focus-visible {
  filter: hue-rotate(0) saturate(200%);
}

.calendars .swiper-slide:nth-child(3):hover,
.calendars .swiper-slide:nth-child(3):focus-visible {
  filter: hue-rotate(-120deg) saturate(200%);
}

.calendars .swiper-slide:nth-child(4):hover,
.calendars .swiper-slide:nth-child(4):focus-visible {
  filter: hue-rotate(-160deg) saturate(200%);
}