hero.html

{% if page.banner_image and page.banner_image != "" %}
	<header id="banner" style="background-image: url('{{ page.banner_image | absolute_url }}');">
		<div class="container pure-g">
			<div class="pure-u-1 pure-u-md-1">
				<header class="call-to-action">
					<h1>{{ page.heading | default: page.title }}</h1>
					{% if page.sub_heading and page.sub_heading != "" %}
						<h2>{{ page.sub_heading }}</h2>
					{% endif %}
					{% if page.hero_button %}
					<div>
						<a href="{{ page.hero_button.href | absolute_url }}" class="pure-button button-success button-xlarge" title="{{ page.hero_button.text }}">
							{{ page.hero_button.text }}&nbsp;<i class="fa fa-chevron-right"></i>
						</a>
					</div>
					{% endif %}
				</div>
			</header>
		</div>
	</header>
	{% if page.textline %}
	<section class="main-message">
		<div class="container pure-g">
			<div class="pure-u-1 pure-u-md-1">
				<div class="content content-narrow">
					<p>{{ page.textline }}</p>
				</div>
			</div>
		</div>
	</section>
	{% endif %}
{% else %}
	<header class="plain-header">
		<div class="container pure-g">
			<div class="pure-u-1 pure-u-md-1">
				<div class="content content-narrow">
				{% if page.collection == 'people' and page.thumbnail and page.thumbnail != "" %}
					<div class="profile-photo">
					<img src="{{ page.thumbnail | absolute_url }}" alt="{{ page.title }}">
					</div>
				{% endif %}
					<h2>{{ page.title }}</h2>
					{% if page.sub_heading and page.sub_heading != "" %}
					<h3>{{ page.sub_heading }}</h3>
				{% endif %}
				</div>
			</div>
		</div>
	</header>
{% endif %}