Customizing header

I want to add a shadow to the top bar. But adding this adds a shadow to the text too…

header {
-webkit-box-shadow: 0px 5px 5px -1px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 5px 5px -1px rgba(0,0,0,0.2);
box-shadow: 0px 5px 5px -1px rgba(0,0,0,0.2);
}

https://dl.dropboxusercontent.com/u/28289808/Capture.PNG

i tried accessing it with “header #masthead {}” but it didn’t work.
how do i access only that top bar?

also i want to remove the transparency from it when i scroll down
but adding this to child themes css does nothing .site-header { background-color:rgba(255,255,255,1);}
is there a way to override the theme customizer?

Hello @aivaras,

Can you please provide a link to your website in order to let me check it?

Kind Regards, Roman.

It’s still on localhost… seems like the page title has heading attribute
https://dl.dropboxusercontent.com/u/28289808/1.PNG

I can’t find a way to overthrow the customizer css to remove the opacity
https://dl.dropboxusercontent.com/u/28289808/2.PNG

Hello @aivaras,

I don’t think that I can provide you with accurate solution without ability to check the code. Can you please let me know when your website is live?

Kind Regards, Roman.