Header Logo Info

The full width, responsive header incorporates a logo with optional link function, an h1 heading for the website name. an optional h2 heading for the page name and an info box.
Header
The header can have a solid or gradient background color. The gradient angle and the background opacity are adjustable. There is an optional bottom border with adjustable width and color to provide separation of the header from the content area when both have the same or similar background colors.
Logo
The optional logo has controls for setting the size and its position in relation to the top and left or right.
The logo can be created as a hyperlink to an internal page. There is an option to add a hover box shadow to the logo to give visitors using computers a clue that it is a link.
There is a checkbox for making the box shadow fit a round image correctly.
Headings
The h1 heading for the website name is centered by default with an adjustment for vertical position. It can also be align left and its distance from the left set. The heading shares the same font as the navigation menu which can be either web safe or non web safe with a web safe fallback font.
The heading has controls for setting the font color, style, weight and letter spacing. A text shadow can be applied to the heading if required.
The optional h2 heading has similar controls but without the text shadow option.
Info Box
The info box can have up to two text items plus an email link and an internal link.
The box can be positioned left or right and its position in relation to the header top and browser edge adjusted.
The box has controls for adjusting the top/bottom and left/right padding and the items can be vertically spaced using the line height control.
The background color and its opacity can be set and there are controls for adding border and/or a box shadow.
Sticky Header
The header can be fixed in position by checking the "Fixed Position" box in the Metrics inspector. In this case, the widget should be set to "Always On Top".