Removing Banner Background image for mobile

Site URL: https://sprout-lime-ldyy.squarespace.com/home

Would anyone be able to help me figure out how to remove the background image on the second section of the following page on mobile? Thanks so much!

https://sprout-lime-ldyy.squarespace.com/home

Password BRP+D2020

Add to Home > Design > Custom CSS

@media screen and (max-width:767px) {
#page section:nth-child(3) .section-background img {
    visibility: hidden;
}
}

Thank you so very much! That worked

Since you were so helpful with that last one... If I needed to do the same thing on the page below what would I need to adjust in the code you posted above?

https://sprout-lime-ldyy.squarespace.com/about-elena

Password BRP+D2020

14 hours ago, becciravera said:

Since you were so helpful with that last one... If I needed to do the same thing on the page below what would I need to adjust in the code you posted above?

https://sprout-lime-ldyy.squarespace.com/about-elena

Password BRP+D2020

 

Which section?

Hi @tuanphan,

I have the same issue. I'd like to remove the bg image for the 2nd section of my homepage for mobile. Its the one with the flower motif. on red background. 

Possible to help me with this? Thank you!

Site Name: www.auntyhong.sg

Password:payinghomage123

On 12/29/2020 at 1:44 PM, Sherman said:

Hi @tuanphan,

 

I have the same issue. I'd like to remove the bg image for the 2nd section of my homepage for mobile. Its the one with the flower motif. on red background. 

Possible to help me with this? Thank you!

Site Name: www.auntyhong.sg

Password:payinghomage123

 

 

You mean this section? Gift the best to your loved ones.

Add to Home > Design > Custom CSS

/* remove 2nd section img mobile */
@media screen and (max-width:767px) {
body.homepage #page section:nth-child(2) .section-background img {
    visibility: hidden;
}
}

On 12/30/2020 at 9:34 PM, tuanphan said:

You mean this section? Gift the best to your loved ones.

Add to Home > Design > Custom CSS

/* remove 2nd section img mobile */
@media screen and (max-width:767px) {
body.homepage #page section:nth-child(2) .section-background img {
    visibility: hidden;
}
}

Thanks for this @tuanphan,

Yes, thats the correct section, but now, it has a weird coloured bg as per the screenshot below. Even if i change it to my "Dark Minimal" Colour Palette, where the bg is red, the bg remains as per the screenshot.

Is there a way for it to follow my "Dark Minimal" Colour Palette where the bg is red? (Added a screenshot of the colour palette below too.

18 hours ago, Sherman said:

 

 

Hi. What is this??

18 hours ago, tuanphan said:

Hi. What is this??

Hi @tuanphan,

When i apply the code, it has a weird coloured bg as per the screenshot. Even if i change it to my "Dark Minimal" Colour Palette, where the bg is red, the bg remains as per the screenshot.

Is there a way for it to follow my "Dark Minimal" Colour Palette where the bg is red?

On 1/3/2021 at 12:22 AM, Sherman said:

Hi @tuanphan,

When i apply the code, it has a weird coloured bg as per the screenshot. Even if i change it to my "Dark Minimal" Colour Palette, where the bg is red, the bg remains as per the screenshot.

Is there a way for it to follow my "Dark Minimal" Colour Palette where the bg is red?

Try this new code

/* remove 2nd section img mobile */
@media screen and (max-width:767px) {
body.homepage #page section:nth-child(2) .section-background img {
    visibility: hidden;
}
body.homepage #page section:nth-child(2) .section-background {
    background: red !important;
}
}

thank you! it worked!