#myCarousel .item img {
    width: 100%;
    height: auto;
    display: block;
}

#homeCarousel .item {
    height: 160px;
    overflow: hidden; /* hide the cropped parts of the image */
}

#homeCarousel {
	margin-bottom:8px !important;
}
/* Make the image fill that fixed height */
#homeCarousel .item img {
	width: 100%;
	height:100%;
	object-fit:contain;
}

@media (max-width: 767px) {
    #homeCarousel .item {
        height: auto;        /* no fixed height on mobile */
    }

    #homeCarousel .item img {
        width: 100%;
        height: auto;        /* keep aspect ratio */
        object-fit: contain; /* or remove this line if you prefer */
    }

    /* Optional: keep caption inside nicely */
    #homeCarousel .carousel-caption {
        bottom: 10px;
        padding-bottom: 5px;
    }
}