How can I make the header transparent in Debut theme?

[LuxeDerma]

Hi there,

We're working on updating our store to a new theme and have selected the Debut template to work from. Currently we use Brooklyn for our live site and if the top section of the homepage is a slideshow we're able to make the header transparent so that our logo and nav. menu are overlaid on the slideshow, however I can't seem to figure out how to do it in the Debut theme. Is this possible? Is it something I can do in the online editor or would it require special code?

Thank you!

[paramSoft]

Please provide website url and if your store is password protected then also provide password

[KetanKumar]

@LuxeDerma 

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

[LuxeDerma]

The url is www.luxederma.ca.

Thank you!

[KetanKumar]

@LuxeDerma 

Thanks for url but i need debut theme your store url

[LuxeDerma]

Sorry about that, I forgot it's still in editing mode. Here's the template preview url: https://luxe-derma-partners.myshopify.com/?fts=0&preview_theme_id=81029038124

Thanks!

[KetanKumar · Accepted solution]

@LuxeDerma 

Thanks for update

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

.template-index .site-header {background-color: transparent; position: absolute;}
.template-index .site-header__mobile-nav {background-color: transparent;}

[nicoleram]

How can I make it so that when I scroll down it stays at the top and it has a white background?

Like in this website:

https://fubu.com/

[KetanKumar]

@nicoleram 

Sorry for facing this issue, it's my pleasure to help us.

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

[nicoleram]

@KetanKumar 

https://persempreactive.com/ password leovaw

Thanks!!