{% unless page.header.navigation == 'fancy' %} {% include navigation.html %} {% endunless %}

{% if page.header.layout == 'hero' %} <header class=“flex flex-column cover w-100 {% if page.header.vh %}{{ page.header.vh }}{% else %}vh-75-l{% endif %} bg-left bg-center-l {% if page.header.class %}{{ page.header.class }}{% endif %}” {% if page.header.image %}style=“background-image: url({{ page.header.image | absolute_url }})”{% endif %}>

{% if page.header.navigation == 'fancy' %}
{% include navigation.html %}
{% endif %}
<div class="flex flex-auto flex-column justify-center">
  <div class="flex flex-column items-start items-center-l mw9 mw7-m center w-100 pv5 pv0-l pa3 ph4-ns">
    <h1 class="f2 f1-l fw6 lh-title white mv0">{{ page.title }}</h1>
    {% if page.subtitle %}
    <h2 class="f3 f2-l fw4 lh-title white mt3 mb3">{{ page.subtitle }}</h2>
    {% endif %}
    {% if page.paragraph %}
    <p class="f5 f4-l fw3 lh-copy white-90 mt3 mb3">{{ page.paragraph }}</p>
    {% endif %}

    {% if page.header.cta.url contains "://" %}
    <a class="f5 f4-ns lh-copy {{ page.header.cta.class | join: ' ' | prepend: ' ' }}" href="{{ page.header.cta.url }}" target="_blank" rel="nofollow">{{ page.header.cta.text }}</a>
    {% elsif page.header.cta.url %}
    <a class="f5 f4-ns lh-copy {{ page.header.cta.class | join: ' ' | prepend: ' ' }}" href="{{ page.header.cta.url | absolute_url }}">{{ page.header.cta.text }}</a>
    {% endif %}
  </div>
</div>

</header>

{% elsif page.header.layout == 'header' %} <header class=“flex flex-column cover w-100 {% if page.header.vh %}{{ page.header.vh }}{% else %}vh-50 vh-75-l{% endif %} bg-left bg-center-l” {% if page.header.image %}style=“background-image: url({{ page.header.image | absolute_url }})”{% endif %}> {% if page.header.navigation == 'fancy' %} {% include navigation.html %} {% endif %} </header> {% endif %}

{% if page.header.caption %} <span class=“flex flex-row justify-center f6 fw3 silver pv2 ph3”>{{ site.data.theme.text.caption }}&colon;&nbsp; {{ page.header.caption | markdownify | remove: “<p>” | remove: “</p>” }}</span> {% endif %}