<!DOCTYPE html>
<html lang="fr">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="icon" type="image/x-icon" href="{{base}}/assets/favicon.ico"/>
    <title>Erreur</title>
      <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
      <meta name="description" content="" />
      <meta name="author" content="" />
      <link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
      <!-- Font Awesome icons (free version)-->
      <script src="https://use.fontawesome.com/releases/v6.3.0/js/all.js" crossorigin="anonymous"></script>
      <!-- Google fonts-->
      <link href="https://fonts.googleapis.com/css?family=Varela+Round" rel="stylesheet" />
      <link
              href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i"
              rel="stylesheet" />
      <!-- Core theme CSS (includes Bootstrap)-->
      <link href="{{base}}/css/styles.css" rel="stylesheet" />
    </head>
  <style>

    body{
      margin-top: 5vh;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 100vh;
      background-color: #7464a1;
      background-image: url("{{base}}/assets/img/nnyc.jpeg");
      flex-direction: column;
      background-size: cover; /* Ajuster la taille de l'image pour couvrir tout le corps */
      background-position: center;
      overflow: hidden;
    }
    .err{
      justify-content:center;
      color:white;
      text-shadow: 0 0 50px black;
    }
    h1{
      display: flex;
    justify-content: center;
      font-size: 100px;
    }

    p{
      display: flex;
      justify-content: center;
      font-size: 50px;

    }

  </style>

  <body>
  {% include 'navBar.twig' %}
  <div class="err content">
    <h1> ERREUR</h1>
    {% if dVueEreur is defined %}
      {% for value in dVueEreur %}
        <p>{{value}}</p>
      {% endfor %}
    {% endif %}
  </div>
  </body>
</html>
