The site header includes a full width banner image, a floating navigation bar and a headline. The responsive navigation uses the checkbox hack to toggle the visibility of the navigation bar.
The navigation bar background opacity reveals the headline when the navigation bar is visible.
Normally this would not be a problem if the navigation bar background was a solid color. However the background opacity reveals the headline diluting the emphasis of the navigation bar menu items.
How can I hide the headline when the responsive navigation bar is visible?
In other words when the navbar toggle check box reveals the menu items the headline disappears, when the menu bar is hidden the headline displays.
Please let me know if the explanation is clear. Please see the test link with a viewport of max 980px.
test link: http://photoshopace.com/transfer/PS/translucent-navbar/partials/template-header1.html