In the moving gallery, can I get image slider with images of different sizes and orientations (i.e. different width and height and a portrait and landscape)?

I found this css code and wonder if you can provide something that will work with the Serano theme Moving Gallery to create irregular sizes within the gallery? I am happy to keep the same height of 400 pixels. Just the widths would be irregular. Different lengths for widths only. Thank you in advance.

.slider { 
    position: relative; 
    max-width: 600px; /* Adjust as needed */ 
    margin: auto; 
    overflow: hidden; 
} 
 
.slides { 
    display: flex; 
    transition: transform 0.5s ease; 
} 
 
.slides img { 
    max-width: 100%; 
    max-height: 400px; /* Adjust for height */ 
    margin: auto; /* Center the images */ 
} 
 
button { 
    position: absolute; 
    top: 50%; 
    transform: translateY(-50%); 
    background-color: rgba(255, 255, 255, 0.7); 
    border: none; 
    cursor: pointer; 
    padding: 10px; 
    font-size: 18px; 
} 
 
.prev { 
    left: 10px; 
} 
 
.next { 
    right: 10px; 
} 

My apologies, since I obviously didn't see your reply. Normally, I would get an email notification.

I am attaching a video so you can see how the sizes and spaces in between each image are uneven. I do want to keep all the images at a set height of 400 pixels. Is it possible to achieve a uniform space between each image. Say, a 20 pixel space? I will try your code below. Perhaps we can get the Serano designer to suggest something if you escalate this upward?

Again, please accept my apologies. I didn't see your response.

All best, Paul

I gave up on the moving gallery. I found another solution. Thank you! And again, I apologize for the pert message. I didn't see the response.

Cheers

Thank you! thank you! thank you! The site really looks good.