.carousel {
    position: relative;
}

.carouselFader-frame {
    position: absolute;
    display: grid;
    object-fit: cover;
    object-position: center right;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.carouselFader-frame-image {
    object-fit: cover;
    object-position: center right;
    width: 100%;
    height: 100%;
}

.xcarouselFader-dots {
    display: grid;
    justify-self: center;
    grid-auto-flow: column;
    grid-gap: 0.5rem;
    padding: 1rem;
    user-select: none;
}

.carouselFader-dots-dot {
    height: 0.8rem;
    aspect-ratio: 1;
    border-radius: 100%;
    opacity: 0.2;
    cursor: pointer;
    transition: all 0.5s ease-in-out;
}

.carouselFader-dots-dot-on {
    opacity: 1;
}

@keyframes fadein {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.fadein {
    animation: fadein 0.5s ease-in-out forwards;
}

.o-1 {
    opacity: 1;
}

.o-0 {
    opacity: 0;
}