Controlling image display sizes on mobile

Site URL: https://www.leahchandler.ca

Hello,

I'm having issues with image sizes when my site is viewed on mobile. Apparently spacers don't work for mobile views . For example, the image "Leah" at the end of my welcome message is massive on the phone, but normal size on desktop. Same with the image of me standing.

As well, when viewing on mobile I noticed there is padding in the text box in the first image on my site, but the sunset image quote doesn't have the same padding on each side. I've attached images to show what I mean.

Thanks so much for anyone that's able to assist. I appreciate it!

With padding, you used this CSS, it affects all devices

#block-yui_3_17_2_13_1457552603071_12467 {
    background: rgba(255,255,255,.6);
    max-width: 80%;
}

you can add this CSS under to override width on mobile

@media screen and (max-width:640px) {
#block-yui_3_17_2_13_1457552603071_12467 {
    max-width: 95% !important;
}
}