Center single employee on smaller screens/facts stacked

Hello!
I am using page builder to put my single employee on the left, and a call to action on the right of one row on my front page.

When viewed on my laptop, the employee is centred within the left column over top of the button linking to more detail. however, when on a medium screen/browser window (wider than the width of one widget but not full width), the photo does not remain centered but rather aligns left. however, the button below within the same widget stays centered in the box.

I have clicked the center (use for 1 or 2 employees) box and under design have said content should be aligned centered.

I’m new to web design so prefer if this can be fixed using the commands built into the theme rather than css, but if css is necessary (as it seems it may be from reading through the threads), is it the case that putting the code in the boxes provided in page builder (“Attributes”) will only work until the theme is updated? also, what goes in the “widget class” field? I am lost on concepts like child themes that people keep referring to in the forum. So new to it all!

While I’m here, I have also added the “facts” widget with 4 facts running across the row (like the demo). However, on smaller screens every individual fact stacks. I notice this happens on the demo site as well. Is it possible to have them stack at least in pairs so it doesn’t look so silly on a smaller screen?

Thanks for helping. my website is growthcounsel.ca
S.

Hello @sjennor,

Can you please create a separate topic for each of your questions in order to make it easier to help you?

Kind Regards, Roman.

Thanks, Roman, I started three new topics.
Appreciate the suggestion.
S.

Great, thank you!

Kind Regards, Roman.