<!DOCTYPE html>
{% load i18n %}
<html {% if LANGUAGE_CODE %}lang="{{ LANGUAGE_CODE }}"{% endif %} {% if LANGUAGE_BIDI %}dir="rtl"{% endif %}>
  <head>
    <meta charset="UTF-8"><!-- 🔥 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{% firstof global_title "Compte Citoyen" %}</title>
  </head>
  <body>
    <main>
      <h1>{% firstof global_title "Compte Citoyen" %}</h1>
      <p><strong>{% trans "This site is currently unavailable." %}</strong></p>
      <p>{{ maintenance_message|default:"" }}</p>
    </main>
  </body>
  <style>
    html, body {
      margin: 0;
      padding: 0;
      font-family: sans-serif;
      background: #eee;
      color: black;
      font-size: 100%;
    }

    body {
      width: 100%;
      height: 100vh;
      display: flex;
      justify-content: center;
    }

    main {
      border: 5px solid {% firstof theme_color black %};
      margin: auto auto;
      padding: 1em;
      max-width: 70ex;
      flex: 1;
      background: white;
    }

    h1 {
      margin-top: 0;
      border-bottom: 2px solid {% firstof theme_color black %};
      font-size: 200%;
    }

    p {
      font-size: 120%;
    }
  </style>
</html>
