<!DOCTYPE html>
<html lang="{{ language }}">
  <head>
    <meta charset="utf-8" />
    <title>{{ title | title | safe }}</title>

    <link rel="shortcut icon" href="/favicon.png" />

    <meta name="theme-color" content="{{ themeColor }}" id="theme-color" />
    <meta name="description" content="MiOM Kreativraum is a creative space in Cologne, Germany">

    <meta id="viewport" name="viewport" content="width=device-width, initial-scale=1.0">

    <link rel="stylesheet" type="text/css" href="/styles.css{{ cssCacheBust }}" media="all" />
    <link rel="stylesheet" type="text/css" href="/raleway.css{{ cssCacheBust }}" media="all" />

    {% if extraStylesheets %}
      {% for extraStylesheet in extraStylesheets %}
        <link rel="stylesheet" type="text/css" href="{{ extraStylesheet }}{{ cssCacheBust }}" media="all" />
      {% endfor %}
    {% endif %}
  </head>
  <body class="mi-page">

    <div class="mi-border" aria-hidden="true">
      <div class="mi-border--top"></div>
      <div class="mi-border--left"></div>
      <div class="mi-border--right"></div>
      <div class="mi-border--bottom"></div>
    </div>

    {% block navigation %}
      {% include "navigation.njk" %}
    {% endblock %}

    {% block main %}
      <main class="mi-main mi-main_content">
        <h1>{{ title }}</h1>

        {{ text | md | safe }}
      </main>
    {% endblock %}
  </body>
</html>
