Black space above the header

Hello, I have a problem that when I view my site on a mobile I can see a black space above the header?! So, how do I get rid of that? I thank you in advance!

Best regards / Anders

Hello Anders,

Can you please provide a link to your website and some explanatory screenshots?

Kind Regards, Roman.

Hello Roman.
Of course, sorry for not doing that in the earlier post.
My homepage is www.barmagi.se, look at it thru your phone and you will see the problem.

Best regards, Anders

Hello Anders,

That’s because of this additional CSS code, please try to disable it:

.site-title,
.site-description {
    text-indent: -9999px;
}

Kind Regards, Roman.

Thank you for your answer, how do I do to disable it?

Best regards
/Anders

Hello Anders,

It’s in your Simple Custom CSS and JS plugin, so you can just try to temporarily deactivate it.

Kind Regards, Roman.

Hello Roman.
Now I have deactivated the CSS code it but instead of taking away the black space it’s still there with site-title and site-description of the homepage. What am I doing wrong?
I Just want to take away space above the header, not add anything :frowning:

Kind Regards. Anders

Hello Anders, try to use the following CSS code.

You can add CSS code in Customize → Additional CSS section.

@media (max-width: 767px) {
    #masthead .col-md-4.col-sm-8.col-xs-12 {
        display: none;
    }

    #masthead .btn-menu {
        margin-top: 0;
        line-height: 1;
    }
}

Please feel free to ask any other questions that you might have.

Kind Regards, Roman.