/* Ensures carousel items are full width */
.carousel-inner {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    height: auto;
}

/* Ensures cards take full width of the carousel item */
.carousel-item {
    flex: 0 0 100%;
    max-width: 100%;
}

/* Make sure images are responsive */
.carousel-item img {
    width: 100%;
    height: auto;    
}

/* Ensure the control buttons are responsive and visible */
.carousel-control-prev, .carousel-control-next {
    width: 5%;
}

@media (max-width: 767.98px) {
    .carousel-control-prev, .carousel-control-next {
        width: 10%;
    }
}
@media (max-width: 500px) {
   /* Ensures carousel items are full width */
.carousel-inner {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    height: auto;
}
}