How lock flex images while still making it responsive?

Thank you for your help!
I apologize if I’m not saying this correctly. When I minimize my preview the setup looks fine but when it gets big, there is text that moves up.
I want to lock the four pictures but still make it “responsive” to the screen.
I left my comments in, so you can see my thought process, which is probably why its causing problems lol.
My CSS code…

.pic1, .pic2, .pic3, .pic4{
  width: 50%;
  height: auto;
}

.row {
  display: flex;
  flex-wrap: wrap;
  padding: 0 4px;
}
  
.column { 
  display: flex;
  flex: 50%;
  padding: 0 4px;
}

I’m assuming this is an issue with my CSS code?

You should probably post the link - that would be better.

I took away the display: flex from .row and it seemed to work.

Here you go anyways,

Thank you!