Help Needed!!! Banner and Background images wont resize for mobile!?!?!?!

Peace and blessings! The problem I am currently having is my banner images and background images for section blocks do NOT resize for mobile view. (and / or vice versa)

Website Address is as follows: https://www.goodsocietyworld.com/

I have sized the images to be standard 2:1 wide. This works perfectly for mobile (when I size the block section to small). But when I go to mobile the image is distorted. OR whenever I make the block section perfect sized for desktop, it ends up distorted for mobile.

I've seen codes that allow the TOP banner to stay congruent amongst both desktop and mobile, but the remaining banners in the lower blocks do not stay congruent. 

Hopefully the attached screenshots help out. Greatly appreciate any advice or help anyone has! Thanks!

Sincerely,

GoodSociety

Background images are designed to fill a space, so not the best if you want to keep them sized, you might do better to use an image block instead and drag it to the left/right margins, set to fit, and the section height set to fill screen, then on mobile it shouldn't crop (it also won't crop on desktop, which is another benefit!)