Having trouble with responsive images in css!

hi,

sorry if this is a really simple question, but i want to make it so my row of images in the ‘member’ section of my webpage resizes down as i make my browser window smaller, before becoming a single column of images when the browser is small enough. instead, my images shrink as a row, getting smaller and smaller and smaller… you can see in the screenshot that the row of images is super tiny - i want to make it so they go from a row of pictures to one column when my browser is a certain width.

here’s my html code, my css and here’s what my webpage looks like:

many thanks!