Background image is cover by menu in parallax section

I have a problem with photo in parallax section.
I set my my image as a background full image position and top of my photo is covering by menu.
Is there any option to make menu smaller or to move my background image to down from menu?

Hey there,

I hope you are well today and thank you for your question.

Can you provide the URL to your website so we can have a look at the issue?

Best regards,

Thank for quick answer.
Right now I get my page on local environment.
There is any option to solve my problem in that situation or we need to wait for my deployment to production environment?


Hi there

Working on actual website is always best, but let’s try, please add this CSS in appearance> customize > additional CSS:

/*decrease navigation height*/
.main-navigation {
padding: 0px;

Let me know if it worked

Colorlib Support Team

Hello Noda,
I add this code into my custom css file and problem still occurs.


Good evening @markopopelko

In this case, i have to debug it online :frowning: when can I except the live version of your website?

Hi Noda!

My project is already on the server and issue with background image still occurs.
I tried to add css from your previous comment but it didn’t help.
Could you help me now?
Address to my site:

hey there

Please try this css:

.main-navigation {
padding: 0px 0 !important;

actually, this “effect” is necessary for parallax section, this small coverage is created by parallax effect, the image here not added as a background image, its tied in the html markup and javascript controls image appearance
one easy hack is to add 86 px transparent space above the image :wink: i mean, edit your image, add space at the top and it will work