<!DOCTYPE html>
<html lang="{{ Culture.Name }}">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

  <title>{% page_title Site.SiteName, position: "before", separator: " - " %}</title>

  {% resources type: "Meta" %}

  {% link type: "image/x-icon", rel: "shortcut icon", href: "~/BenRameyTheme/assets/favicon.ico" %}

  {% style name: "benrameytheme" %}

  {% resources type: "HeadLink" %}
  {% resources type: "Stylesheet" %}
  {% resources type: "HeadScript" %}
</head>

<body dir="{{ Culture.Dir }}">
  <header>
    <div class="container">
      <div class="d-flex justify-content-between align-item-center">
        <a href="/" class="d-flex justify-content-start align-items-center me-2 text-decoration-none" title="Home">
          <img src="https://en.gravatar.com/userimage/738990/32d8e61848233a67f5e02dcc43be0ff8.jpeg" alt="Gravatar"
            width="40" height="40" />
          <span class="ms-2">{{ Site.SiteName }}</span>
        </a>
        <div class="d-none d-sm-flex flex-column justify-content-around ms-2">
          <small>{{ Site.Tagline }}</small>
        </div>
      </div>
    </div>
  </header>

  {% shape "menu", alias: "alias:main-menu", cache_id: "main-menu", cache_fixed_duration: "00:05:00", cache_tag:
  "alias:main-menu" %}

  <main>

    <div class="container">
      {% render_body %}
    </div>
  </main>

  <footer class="footer">
    <div class="container">
      <hr />
      <small>
        &copy;
        {% assign year = "now" | date: "%Y" %}
        <time dateTime="{{ year }}">{{ year }}</time>
        All rights reserved.
      </small>
    </div>
  </footer>

  {% resources type: "FootScript" %}
</body>
</head>

</html>