In Bootstrap, this is called a carousel, it's basically a slide show. My trick is going to be getting the captions off the picture to below.
This is a column to the left of the slide's picture. In narrower viewports such as a smartphone, it stacks to above the picture.
This is a column to the right of the slide's picture. In narrower viewports such as a smartphone, it stacks to below the picture.

This sort of worked. If you compare pages, the picture remained the same size, but the 3 columns dropped down longer to accomodate the caption text.

Actually, all it took was changing the position in the css for the div tag "carousel-caption2" from nothing to static.

There's an inline style in the outermost div for the carousel that's background="gray" that you'll want to take out, and you'll be good to go. I left it in for this page, because I think the technique is easier understand, but it admittedly looks bad. You'll also want to move the indicators or take them out. Below, I've inserted screen prints of the relevant html and css

Placeholder image
the css