How do I get a drop down menu in my navigation bar and my header in general to stop overlapping with the rest of my page?

Site URL: https://www.physio4u.co/

I've tried this 

#header {
    position: fixed;
    z-index: 1;
    background-color: #fff;
    padding-top: 30px;
    width: 75%;
    padding-bottom: 0px;
    transform: translateX(-50%);
    left: 50%;
}

but it doesn't seem to be responding to the custom code

Hi. Can you describe in detail your problem? We can help easier

My header (you can have a look at Physio4u.co) overlaps with the text in my body. when you scroll upward it just overlays the top of the page. same fo the menu items in my drop down list on the nav bar for the same.... when you click on Our services you'll see what I mean. I'd rather have a fixed header position with a background to my drop down list, but it doesn't seem to be responding to custom css. 

On 4/22/2021 at 3:09 PM, Physio4u said:

My header (you can have a look at Physio4u.co) overlaps with the text in my body. when you scroll upward it just overlays the top of the page. same fo the menu items in my drop down list on the nav bar for the same.... when you click on Our services you'll see what I mean. I'd rather have a fixed header position with a background to my drop down list, but it doesn't seem to be responding to custom css. 

Services page looks fine?