Lining images side by side for mobile site

Site URL: https://becoming30.riverlife.org.sg/thebeholdalbum

Hi,

I have placed four images on one of the pages of my site.

On desktop, the images are side by side, but when it switches over to mobile, the images form a vertical line. (have attached an example).

Is there a code that will enable them to be side by side like the desktop version?

Appreciate any help. Thank you.

Regards,

Sherman

Add to Design > Custom CSS

/* Social icons side by side */
@media screen and (max-width:767px) {
div#block-yui_3_17_2_1_1625153495373_3799+.row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100% !important;
}
div#block-yui_3_17_2_1_1625153495373_3799+.row .image-block {
    width: 100% !important;
}
}