Header background color change on mobile

How can I change the color of the background of the header on mobile? It looks great on Desktop and when I browse my website on mobile device, my logo (which is black) cannot be seen on the black background.

Looks like it has black overlay on the header when it comes to mobile

Mine is doing the same thing. What is wrong?

I got the same problem as well!! How to change the color?

Sorry for the delay guys,

please try the following code:

.site-header.float-header {
  background-color: #fff !important;

Use white or any else color you want. Is this already the solution or do you want to change the unscrolled background from your navigation?


I want to change the menu background of all other pages. If you open this link http://www.promentors.us.com/program/ with a phone, you will see the background of the menu is black, which I want to change to light blue, (same as the home page).

What’s the CSS code for that?


@media only screen and (max-width: 1024px) {
  .site-header {
   background-color: #fff !important;

This should do the job.