using row-reverse and column-reverse on mobile view only

I would like to create a media query for "mobile view only" for a content page that has a checkered layout for the content.

I've pasted the page link below.

On mobile view the content displays the following in a column: Text/Image/Image/Text/Text/Image/Image/Text (because of how it is layed out on desktop)

On the desktop view the layout is as follows:

Text / Image - ROW 1
Image / Text - ROW 2
Text / Image - ROW 3
Image / Text - ROW 4

I would like to reverse Row 2 Image/Text and Row 4 Image/Text on mobile view only.

I'm just not sure which element to edit in CSS when creating the media query so that it is only applied in mobile view......and do I use flex-direction: row-reverse OR flex-direction:column-reverse?

Thank you