.carousel-container {
    overflow: hidden;
}

.carousel-wrapper {
    height: 500rem;
    display: flex;
    gap: 20px; /* Always in px */
    transition-property: transform;
}

.carousel-wrapper.sliding-transition {
    transition: transform 0.7s ease-in-out;
}

.carousel-arrows {
    width: 100%;
}

.slide {
    flex-shrink: 0;
    transition-property: transform;
}

@media (max-width: 834px) {
    .carousel-wrapper {
        height: 300rem;
    }
}

@media (max-width: 500px) {
    .carousel-wrapper {
        height: 170rem;
    }
}