<!DOCTYPE html>
<html lang="en">

<head>
<style>
html {
  position: relative;
  height: 100%;
}
body {
    position: relative;
    height: 100%;
    margin: 0;
    padding: 0;
    {% load static %}
    background-image: url({% static 'grid-background.webp' %});
}

.header {
    width: 100%;
    height: 100px;
    background-color: #09395D;
    opacity: .8;
    border-style: solid; 
    border-radius: 0 0 20px 20px;
    border-width: 0 0 5px 0;
    border-color: grey;
}
.header h1 {
    color: whitesmoke;
    text-align: center;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 50px;
    padding: 20px 0;
}


.footer {
  width: 100%;
  position: fixed;
  bottom: 0;
  height: 100px;
  clear: both;
  background-color: #09395D;
  opacity: .7;
  border-style: solid; 
  border-radius: 20px 20px 0 0;
  border-width: 5px 0 0 0;
  border-color: grey;
}
.footer p {
  color: white;
  font-weight: bold;
  text-align: center;
  margin: 0;
  padding: 0;
}

</style>
  <title>
    Hands-on Security Exercises
  </title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  {% load static %}
  <link rel="shortcut icon" href="{% static 'lock.png' %}" />
  {% load static %}
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
  <!-- Add additional CSS in static file -->
  {% load static %}
  <link rel="stylesheet" type="text/css" href="{% static 'base_generic.css' %}">
</head>
<body>

<div class="header">
  <h1> {% block header %} {% endblock %}</h1>
</div>

{% block body %}
{% endblock %}

<div class="footer">
  <p> Instructor: </p>
  <p> Instructor Email: </p>
  <p> Learn more about Security Lab Manager on <a href="https://github.com/so87/Security-Lab-Manager">Github</a></p>
  <p> <a href="https://github.com/so87/Security-Lab-Manager/blob/dev/documentation/LICENSE">License</a></p>
</div>

</body>
</html>