{{ define "main" }}

  <div id="page-header">
    <h1>{{ .Title }}</h1>
    {{ if .Params.subtitle }}
      <span class="subtitle">{{ .Params.subtitle }}</span>
    {{ end }}
  </div>

  <section>
  {{ .Content }}
  </section>

  {{ $pages := shuffle (where site.RegularPages "Section" "tools") | first 20 }}
  <section>
    <h2>Try Something New</h2>
    <p>This list shows a selection of 20 random tools, refreshed every time this site is updated.</p>
    {{ range $pages }}
      <article class="tool-card">
        <h3>
          {{ .Title }}
          {{ if .Params.subtitle }}
            <span class="subtitle">{{ .Params.subtitle }}</span>
          {{ end }}
        </h3>
        <p>{{ .Content | plainify | truncate 125 }}</p>
        <a href="{{ .RelPermalink }}" style="position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;text-indent:-9999px;overflow:hidden;">{{ .Title }}</a>
      </article>
    {{ end }}
  </section>
{{ end }}