Oh no, I meant it is still not fixed one still placed on top of the other :) Sorry for that, could you please check again?

Awesome, done, thank you so much!

That’s the problem (see my code above), I already have “background: rgba(255,255,255,0);” instead of transparent.

Any other idea?

Thank you, Yigit, done! May I bother you with 2 last questions?

On my website http://goo.gl/pIKt4s, I wanted to have a transparent header, so I added the following codes to my customer.css:

#header_main .container, .main_menu ul:first-child > li a {
height: 60px !important;
line-height: 60px !important;
}
.logo, .logo a, .logo img { max-height: 60px!important; }

#header_main {
border-bottom-style:none;
}

.fixed_header #main {
padding-top:60px;
}

.avia-menu-fx { display: none; }

.header_bg {
background: rgba(255, 255, 255, 0) !important;
}
#main {
padding-top: 0 !important;
}

My first question is whether all I did is correct and enough? Or shall I also go to avia.js and add “el_height = $60”???

Second question: now that I have the header transparent in landing form, all I want is to add a bit of background color to this header once the user scrolls down. SExactly like on http://squarespace.com/about/company

How can I control this header properties when user scrolls down?

Thank you very much!
Ali

Oh yes! Thank you so much, Yigit! you rock as always!
Ali

I added. Still doesn’t work :(

Awesome as always, done!
Thank you!
Ali

Thank you, Yigit! You fixed it perfectly in one shot!

All the best!
Ali