From 145d3499c39cdeef70516bb4f3c8ecd7f6b493ec Mon Sep 17 00:00:00 2001
From: Fred Boniface <fred@fjla.uk>
Date: Wed, 19 Oct 2022 14:11:11 +0100
Subject: [PATCH] Add sticky header image

---
 style/new_style.css | 25 +++++++++++++++----------
 1 file changed, 15 insertions(+), 10 deletions(-)

diff --git a/style/new_style.css b/style/new_style.css
index 30949ef..1098e1f 100644
--- a/style/new_style.css
+++ b/style/new_style.css
@@ -3,31 +3,36 @@ html {
 }
 
 body {
-
+    height: 100%;
+    width: 100%;
+    margin: auto;
 }
 
 .header-image-home {
     background-color: rgb(29,49,49);
-    background-image: url("https://via.placeholder.com/375x335.webp");
+    background-image: url("https://via.placeholder.com/1200x400.webp");
     background-repeat: no-repeat;
     background-position: center;
-    min-height: 40%;
-    max-height: 45%;
-    width: 100%;
-    position: fixed; /* Try setting this to relative and .page-title to absolute */
-    top: 40px;
-    left: 0;
+    height: 275px;
+    min-width: 100%;
+    max-width: 100%;
+    margin: auto;
+    position: sticky;
+    top: -190px;
 }
 
 .page-title { /* This needs to be bottom center of header-image-home/header-image */
     font-family: sans-serif;
     font-size: 4vw;
     text-align: center;
-    position: absloute;
+    position: absolute;
+    bottom: -10px;
     box-shadow: 3px;
     color: azure;
 }
 
 .content {
-    margin-top: 95%;
+    margin: auto;
+    margin-top: 10px;
+    width: 90%;
 }
\ No newline at end of file