Move header image to img tag

website/thaliawebsite/static/css/base.scss

@@ -98,13 +98,13 @@
 #page-header {
     height: 360px;
     overflow: hidden;
+    display: flex;
+    justify-content: center;
 
     .image {
-        width: 100%;
+        width: auto;
         height: 100%;
-        background-size: cover;
-        background-repeat: no-repeat;
-        background-position: center center;
+        max-width: none;
     }
 }
 

website/thaliawebsite/templates/base.html

@@ -104,11 +104,7 @@
 
 <header id="page-header">
     {% block header_image_container %}
-        <div
-            class="image"
-            style="background-image: url('{% block header_image %}{% pick_header_image %}{% endblock header_image %}')"
-        >
-        </div>
+        <img src="{% block header_image %}{% pick_header_image %}{% endblock header_image %}" class="image" />
     {% endblock header_image_container %}
 </header>