How do I make the Header & Menu area have a semi-transparent layer?

How do I make the Header & Menu area have a semi-transparent layer like the rest of the areas? I have used the CSS below with { background-color: rgba(0,0,0,0.15); } to make to body and footer use a transparent layer.

I would also like to do this for the header area, but like the rest, only in the wrapper that’s the width of the sliders. I hope this makes sense.

/* MAIN CONTENT AREA transparency */
#main, .html_stretched #wrap_all { background-color: transparent; }
.main_color, .main_color .site-background, .main_color .first-quote, .main_color .related_image_wrap, .main_color .gravatar img .main_color .hr_content, .main_color .news-thumb, .main_color .post-format-icon, .main_color .ajax_controlls a, .main_color .tweet-text.avatar_no, .main_color .toggler, .main_color .toggler.activeTitle:hover, .main_color #js_sort_items, .main_color.inner-entry, .main_color .grid-entry-title, .main_color .related-format-icon, .grid-entry .main_color .avia-arrow, .main_color .avia-gallery-big, .main_color .avia-gallery-big, .main_color .avia-gallery img, .main_color .grid-content, .main_color .av-share-box ul, #top .main_color .av-related-style-full .related-format-icon, .main_color .related_posts.av-related-style-full a:hover, .main_color.avia-fullwidth-portfolio .pagination .current, .main_color.avia-fullwidth-portfolio .pagination a { background-color: rgba(0,0,0,0.15); }