It works to push it down on first load but when you scroll down the page. The sticky nav doesn’t move to the top but leaves an empty space where the top widgetized area is.

https://www.dropbox.com/s/dzi3dhsaetb8vh4/Screen%20Shot%202019-06-19%20at%2011.00.31%20AM.png?dl=0

I made the change and it did not work. Still looking the same. Any help will be appreciate it.

I do not want the top widgetized area to show but to dissapear cause it takes too much space on the top as you scroll down.

I was able to accomplish it with the following code:

@media(max-width: 320px){

.header_wrapper.transparent.header_1.background–light {
top: 20px!important;}

.sticky_header .header_wrapper.transparent.header_1.background–light {

padding-top: 0px!important;
opacity: .8;
top:0!important;
}
}

@media (max-width: 979px){

.header_wrapper.transparent.header_1.background–light {
padding-top: 80px!important;

}

.sticky_header .header_wrapper.transparent.header_1.background–light {                  padding-top: 0px!important;
opacity: .8;<span style=”white-space: pre;”>
</span>}
}