How do I add a different background to each of these custom content sections?

[sailorweeb97]

How do I add a different background to each of these custom content sections? Thank you very much.

Note: I added the green line to the image so that I could separate the two images for the sake of this question. It's not actually on the site. 

[KetanKumar]

@sailorweeb97 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

[suyash1]

@sailorweeb97 - both sections need separate css code to add background, can you please share website link?

[sailorweeb97]

https://true-tot-tower.myshopify.com/?key=4d1c6d10df888ed2e9a026888fcbfd74b738b3a2b28b6114a36407b776... 

Hello Suyash1, Here's the website link. Thank you so much. 

[KetanKumar]

@sailorweeb97 

thanks for it please add this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

#shopify-section-16201465810ebeeb55 {
    background: #87cefa; /* change color as you like */
    padding: 40px 0px;
    margin: 0;
}
#shopify-section-162014468955bb93f5 {
    background: #000000; /* change color as you like */
    padding: 50px 0px;
    margin: 0;
}

[sailorweeb97]

@KetanKumar do you also know know  by chance how to make my looping hero video fully extend to the sides and meet the other sections?

[KetanKumar]

@sailorweeb97 

do you mean like this?

[sailorweeb97]

Yes Thank you 

[sailorweeb97]

Would you mind telling me what code I need to insert and where I need to insert it?

[NerdCurator]

@sailorweeb97 You need to add this code in the theme files. For which you need to go to Online Store > Actions (Active theme) > Edit Code > Assets, under assets add the code at the bottom of theme.scss.css file.

.custom-hero video{object-fit: cover; }

[KetanKumar]

@sailorweeb97 

Yes, please this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.hero_video {object-fit: cover;}