Dawn - Trouble making home page transparent

[spacetimerider]

My site: etherealoasis.co

My theme: Dawn

I’m having trouble with the middle section of the main landing page, with the welcome text and featured products. Trying to make it transparent.

Thanks for everyone’s help so far!

[Ujjaval]

@spacetimerider
put below css into base.css file

.gradient {
    background: transparent !important;
}

[spacetimerider]

Thank you for replying. I tried that and it made the main section transparent, but it also changed the black background on the drop down navigation menus, making them hard to read.

[Ujjaval]

@spacetimerider
add below css

.header__submenu .header__menu-item {
    background-color: black !important;
}

[GemPages]

Hello @spacetimerider

Let’s try adding the below code :

.section-header.shopify-section-header-sticky{
background:black !important;
}

I hope the above is useful to you.
Best regards,
GemPages Support Team

[spacetimerider]

Both of those lines of code fix part of the problem, but not the full problem.

@Ujjaval 's line of code fixes the black background of the entire header when you scroll down and it pops out, but it still leaves the menu items in the navigation drop down transparent.

@GemPages 's line of code fixes the black boxes in the menu drop down, but it still leaves a transparent space between the navigation text and the dropdown text. (Almost like there is another container that that part sits in)

Is there another line of code to replace this code:

.gradient {
    background: transparent !important;
}

…with something more targeted for just the main page background?

[Ujjaval]

@spacetimerider
you want some thing like this ?

.header__submenu.list-menu {
    padding: 0px !important;
}
nav.header__inline-menu {
    background-color: black;
}

[spacetimerider]

Thanks to everyone for trying to help out. I got it to work by adding the following code to base.css

.color-background-1{
      background:transparent !important;
}