{{ define "main" }} {{ partial "page-header" . }}

<!-- {{ partial "page-header" . }} -->

<!-- Features -->
{{ range $i, $e:= .Params.features }}
<section class="section-sm"  style="background-color: #eeeeee;">
  <div class="container">
    <div class="row flex-row-reverse items-center justify-between">
      <div
        class="mb:md-0 {{ if not (modBool $i 2) }}
              md:order-2
            {{ end }} md:col-5 mb-6"
      >
        {{ partial "image" (dict "Src" .image "Alt" "feature image" "DisplayXL"
        "520x" "DisplayLG" "425x" "DisplayMD" "360x") }}
      </div>
      <div
        class="{{ if not (modBool $i 2) }}
              md:order-1
            {{ end }} md:col-7 lg:col-6"
      >
        <h2 class="mb-4">{{ .title | markdownify }}</h2>
        <p class="mb-8 text-lg">{{ .content | markdownify }}</p>
        <ul> 
          {{ range .bulletpoints }}
          <li class="relative mb-4 pl-6">
            <i class="fa fa-check absolute left-0 top-1.5"></i>
            {{ . | markdownify }}
          </li>
          {{ end }}
        </ul>

      </div>
    </div>
  </div>
</section>
{{ end }}
<!-- /Features -->


<!--doublecolumn-->
<div class="containerdoublecolumn pt-14 pb-14">
  <div class="grid-containerdoublecolumn">
    {{ range $i, $e := .Params.doublecolumn }}
    <div class="grid-itemdoublecolun">
        <h3 class="">{{ .title | markdownify }}</h4>
          <br>
      <p class="">{{ .content | markdownify }}
      </p>
    </div>
    {{ end }}
  </div>
</div>
<!--/doublecolumn-->


<section class="section-sm">
  <div class="container">
    <div class="row justify-center">
      <div class="lg:col-10">
        <div class="content">{{ .Content }}</div>
      </div>
    </div>
  </div>
</section>
{{ end }}