Banner and Font Sizing/Resizing

Site URL: https://viola-lion-ynnj.squarespace.com/our-story

I'm hoping someone can help me with this! 

I'm using a 7.0 version of the Brine template. The banner images will not resize from desktop to mobile view and the font size looks great on the desktop view and giant in the mobile view. I have tried a few CSS codes from @tuanphan  (listed below) I have found on other posts and none of them worked. I am sure it's user error on my part. My site is supposed to go live on September 1st. Please help!! What am I doing wrong?

@media screen and (max-width:640px) {
.homepage .section-background img {
    width: 100% !important;
    height: auto !important;
}
}

<style>
  @media screen and (max-width:767px) {
  section.has-background {
    min-height: 40vh !important;
}
  }
</style>

Thank you in advance! 

Bailey

What is access password?

rizzo

It looks fine here?

That was as an image block, but here is what it looks like as a banner, also the text looks so big in mobile view. Should I just take the text size down a bit until it looks good in both desktop and mobile view? I thought it would resize on the mobile automatically. 

Lets see what we can do about the banner image. You probably need to change the focal point for image.

Click and drag the focal point to the upper left of the image.

Save the changes.

Be sure you've selected the Our Story Page from Home > Pages.

Go to Home > Design > Site Styles.

Click on the banner image on the page.

The style tweaks list should have narrowed down to just a few options. One being Intro Padding (With Background Image).

Hover over Intro Padding (With Background Image) and use the slider to expose the full height of the image.

Save your changes.

Here is some reading on focal points 

< https://support.squarespace.com/hc/en-us/articles/205826028-Using-focal-points-to-center-images>.

There is a downside to these settings if you turn on Parallax again or add a banner image like you did for Our Story to another page. Unless the image is the same dimensions you will get odd results for the new banner.

Let us know how it goes.

This worked! Thank you so much!!