Global Page Elements

There are two distinct versions of the site header — one that incorporates a hero unit, and one that does not. Pages without a hero unit have a fixed position header by default. For pages with a hero unit, the header switches between fixed and static postion, depending on scroll location.

Header with hero unit:

Fixed header:
<header class="ce-siteHeader" role="banner">
    ...
</header>

The site footer is consitent across all pages

<footer class="ce-siteFooter">
    ...
</footer>

The main navigation is a part of the site header. The size and postion of the navigation changes depending on whether the header is static or fixed.

Main navigation in it's "open" state when hero unit is present and visible:

Main navigation in it's "open" state when header is fixed:
<div class="ce-mainNavigation">
    ...
</div>