.carousel.ThemeCarouselDefault {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 1;
  font-size: 1rem;
  padding: var(--sizeL);
  box-sizing: border-box;
}
.carousel.ThemeCarouselDefault > .carouselSlides {
  display: flex;
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
  box-sizing: border-box;
}
.carousel.ThemeCarouselDefault > .carouselSlides > .carouselSlide {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: relative !important;
  left: 0%;
  top: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 100%;
  transition: 0.3s transform ease;
  animation-duration: var(--speedFF, 200ms);
  animation-fill-mode: both;
}
.carousel.ThemeCarouselDefault > .carouselSlides > .carouselSlide + .carouselSlide {
  left: -100% !important;
}
.carousel.ThemeCarouselDefault > .carouselSlides > .carouselSlide > * {
  max-height: 100%;
  max-width: 100%;
}
.carousel.ThemeCarouselDefault > .carouselSlides > .carouselSlide[data-animation=in] {
  animation-name: slideInRight;
}
.carousel.ThemeCarouselDefault > .carouselSlides > .carouselSlide[data-animation=out] {
  animation-name: slideOutLeft;
}
.carousel.ThemeCarouselDefault > .carouselSlides > .carouselSlide[data-animation=inr] {
  animation-name: slideInLeft;
}
.carousel.ThemeCarouselDefault > .carouselSlides > .carouselSlide[data-animation=outr] {
  animation-name: slideOutRight;
}
.carousel.ThemeCarouselDefault > .carouselControls {
  height: fit-content;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  margin-top: var(--sizeL);
}
.carousel.ThemeCarouselDefault > .carouselControls:empty {
  display: none;
}
.carousel.ThemeCarouselDefault > .carouselControls > .carouselInfo {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
  padding: var(--sizeS);
}
.carousel.ThemeCarouselDefault > .carouselControls > .carouselPositions {
  display: grid;
  overflow-x: auto;
  scroll-snap-type: x proximity;
  grid-auto-columns: max-content;
  grid-auto-flow: column;
  grid-gap: var(--sizeS);
  scroll-behavior: smooth;
}
.carousel.ThemeCarouselDefault > .carouselControls > .carouselPositions::-webkit-scrollbar {
  height: var(--sizeXS);
}
.carousel.ThemeCarouselDefault > .carouselControls > .carouselPositions::-webkit-scrollbar-thumb {
  background-color: var(--colorPrimary);
}
.carousel.ThemeCarouselDefault > .carouselControls > .carouselPositions > .carouselPosition {
  display: inline-block;
  cursor: pointer;
  min-height: var(--sizeM);
  min-width: var(--sizeM);
  transition: var(--speedFF) all ease;
  opacity: 0.3;
  background-color: var(--colorShadow);
  font-size: var(--fontS);
  max-height: var(--sizeXL);
  max-width: var(--sizeXL);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow-y: hidden;
}
.carousel.ThemeCarouselDefault > .carouselControls > .carouselPositions > .carouselPosition > * {
  object-fit: cover;
}
.carousel.ThemeCarouselDefault > .carouselControls > .carouselPositions > .carouselPosition > span {
  padding: var(--sizeXS) var(--sizeS);
}
.carousel.ThemeCarouselDefault > .carouselControls > .carouselPositions > .carouselPosition:hover, .carousel.ThemeCarouselDefault > .carouselControls > .carouselPositions > .carouselPosition[data-active] {
  opacity: 1;
  background-color: var(--colorPrimary);
  color: var(--colorPrimaryAlt);
}
.carousel.ThemeCarouselDefault > .carouselControls > .carouselPositions > .carouselPosition {
  font-size: var(--fontXL);
}
.carousel.ThemeCarouselDefault > .carouselControls > .carouselPositions > .carouselPosition > :not(img) {
  padding: var(--sizeM);
}
.carousel.ThemeCarouselDefault > .carouselControls > .carouselPositions > .carouselPosition > img {
  height: 100%;
  width: 100%;
}
.carousel.ThemeCarouselDefault > .carouselSlides > .carouselPrev, .carousel.ThemeCarouselDefault > .carouselSlides > .carouselNext {
  opacity: 0;
  color: var(--colorNeutral);
  font-size: 2rem;
  display: block;
  cursor: pointer;
  height: fit-content;
  transition: var(--speedFF) color ease, var(--speedFF) opacity ease;
  z-index: 1;
}
.carousel.ThemeCarouselDefault > .carouselSlides > .carouselPrev:hover, .carousel.ThemeCarouselDefault > .carouselSlides > .carouselNext:hover {
  color: var(--colorPrimary);
}
.carousel.ThemeCarouselDefault > .carouselSlides > .carouselPrev, .carousel.ThemeCarouselDefault > .carouselSlides > .carouselNext {
  top: 50%;
  position: absolute;
  transform: translateY(-50%);
  font-size: var(--fontXXL);
}
.carousel.ThemeCarouselDefault > .carouselSlides > .carouselPrev {
  left: var(--sizeL);
  margin-right: auto;
}
.carousel.ThemeCarouselDefault > .carouselSlides > .carouselNext {
  right: var(--sizeL);
  margin-left: auto;
}
.carousel.ThemeCarouselDefault > .carouselSlides > .carouselPlay {
  opacity: 0;
  color: var(--colorNeutral);
  cursor: pointer;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: var(--fontXXL);
  transform: translate(-50%, -50%);
}
.carousel.ThemeCarouselDefault > .carouselSlides > .carouselPlay:hover {
  color: var(--colorPrimary);
}
.carousel.ThemeCarouselDefault > .carouselSlides:hover > .carouselPlay, .carousel.ThemeCarouselDefault > .carouselSlides:hover > .carouselPrev, .carousel.ThemeCarouselDefault > .carouselSlides:hover > .carouselNext {
  opacity: 1;
}
