{{ define "title" }}{{ .Site.Title }}{{ end}}
{{ define "header_css" }}{{ end }}
{{ define "body_classes" }}page-home{{ end }}
{{ define "header_classes" }}header-transparent{{ end }}

{{ define "meta_tags" }}
<meta name="description" content="{{ .Site.Params.homepage_meta_tags.meta_description }}" />
<meta property="og:title" content="{{ .Site.Params.homepage_meta_tags.meta_og_title }}" />
<meta property="og:type" content="{{ .Site.Params.homepage_meta_tags.meta_og_type }}" />
<meta property="og:url" content="{{ .Site.Params.homepage_meta_tags.meta_og_url }}" />
<meta property="og:image" content="{{ .Site.Params.homepage_meta_tags.meta_og_image }}" />
<meta property="og:description" content="{{ .Site.Params.homepage_meta_tags.meta_og_description }}" />
<meta name="twitter:card" content="{{ .Site.Params.homepage_meta_tags.meta_twitter_card }}" />
<meta name="twitter:site" content="{{ .Site.Params.homepage_meta_tags.meta_twitter_site }}" />
<meta name="twitter:creator" content="{{ .Site.Params.homepage_meta_tags.meta_twitter_creator }}" />
{{ end }}

{{ define "main" }}

{{ partial "hero-image-setheight.html" (dict "background" .Params.heroBackground "heading" .Params.heroHeading "subheading" .Params.heroSubHeading "content" .)}}
{{ if .Content }}
<div class="container pt-6 pt-md-10">
  <div class="row">
    <div class="col-12">
      <div class="page-intro">
        {{ .Content }}
      </div>
    </div>
  </div>
</div>
{{ end }}

{{ $headless := .Site.GetPage "/homepage" }}
{{ $reusablePages := $headless.Resources.ByType "page" }}
{{ $reusablePages := sort $reusablePages ".Params.weight" }}
{{ range first 1 $reusablePages }}
<div id="home" class="strip bg-cover bg-position-top bg-overlay" style="background-image: url('{{ .Params.background | relURL }}');">
  <div class=" pt-16 pb-16">
    <div class="row">
      <div class="col-12 col-md-10 offset-md-1">
        <h2 class=" text-capitalize text-center">{{ .Title }}</h2>
        <p>{{ .Content }}</p>
      </div>
    </div>
  </div>
</div>
{{ end }}

{{ range first 1 (after 1 $reusablePages) }}
<div id="home" class="strip  bg-cover bg-position-top bg-overlay bg-light" style='background-image: url("{{ .Params.background | relURL }}");'>
  <div class=" pt-8 pb-8 pb-md-12 pt-md-12">
    <div class="row justify-content-center">
      <div class="col-12 col-md-8 text-center text-black">
        <h2>{{ .Title }}</h2>
        {{ .Content }}
      </div>
    </div>
  </div>
</div>
{{ end }}
{{ range first 1 (after 2 $reusablePages) }}
<div id="home" class="strip  bg-cover bg-position-top bg-overlay " style='background-image: url("{{ .Params.background | relURL }}");'>
  <div class="pt-8 pb-8 pb-md-12 pt-md-12">
    <div class="row justify-content-center">
      <div class="col-12 col-md-8 text-center text-black ">
        <h2>{{ .Title }}</h2>
        {{ .Content }}
       </div>
    </div>
  </div>
</div>
{{ end }}

{{ end }}

{{ define "footer_js" }}
{{ end }}