How do i edit overlay css on specific slideshow

Store Design
1

I would like to have a darker overlay on just one slideshow section on my homepage. I tried adding this to the bottom of the theme.css file, but it didn’t work:

div#shopify-section-162445333596e5e839 .hero__overlay::before {
background-color: black;
opacity: 20;
}

Screenshot 2021-06-24 at 10.12.07.png
Screenshot 2021-06-24 at 10.12.07.png2880×1308 601 KB

https://alfaoutdoor.se/

2

@max78

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

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

i have check at home but i can’t see this section can you please show me
I will check out the issue and provide you a solution here.

3

The section should be visible now

4

@max78

great thanks for visible can you 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-162445333596e5e839 .hero__image-wrapper:before, .hero__media:before {
background-color: #000000;
    opacity: 0.2;
}