Announcement bar not showing after adding fixed scroll

Site URL: https://bidie.co

Hey! I just added custom css to fix the header while scrolling. The announcement bar is now hidden on desktop - seems to be fine for mobile.

Please can you help?

Thank you in advance! 

Can you check site url? We can't access.

oops my mistake biddie.co

Thank you!

Add to Home > Design > Custom CSS

header.Header.Header--top {
    top: 35.8px;
}

Thank you, this seems to work to some extent but now when scrolling the top of the header is see through and you can see the content in place of the announcement bar (see image attached) 

Remove code I sent

Next remove your header fixed code

Next add this to Home > Design > Custom CSS to set sticky header

header.Header {
    position: sticky;
    z-index: 9999;
    width: 100%;
    top: 0px;
}

Hi @tuanphan,

When I switched my header from fixed to sticky to enable the announcement bar to show up, a space appeared just below the header. How do I fix this? 

downtoearthadventures.com

pw: downtoshirts

21 hours ago, zala said:

Hi @tuanphan,

When I switched my header from fixed to sticky to enable the announcement bar to show up, a space appeared just below the header. How do I fix this? 

downtoearthadventures.com

pw: downtoshirts

In Custom CSS, remove this code

.Content-outer {
    margin-top: 50px;
}

That worked, thanks!