responsive menu links not aligned in box

I moved the menu on my site up and made the header smaller. Now the links are up higher and out of place when in responsive size.
Is there a way to move the navigation down when in responsive size.
It seems to inherit the .nav styles and I have tried a number of ways to correct this but just can’t seem to get it working.
I’m also having problems with the background color in responsive size. I can change it but then there is a colored bar on the navigation when in desktop size.
I’m using a background image for the header and it overlaps this.
Is there a way to change the background color of the navigation for responsive size only.
link to my site
Any help would be appreciated.
Thank you