add pig pattern to footer

web/src/components/layout/Footer.tsx

@@ -36,6 +36,7 @@ async function OpeningHoursTable() {
 
 export const Footer = () => {
   return (
+    <>
     <footer className={styles.footer}>
       <div className={styles.social}>
         <h2 className="suphead">Følg oss</h2>
@@ -124,5 +125,8 @@ export const Footer = () => {
         <ToTop />
       </div>
     </footer>
+    <div className={styles.pigPattern}>
+      </div>
+      </>
   );
 };

web/src/components/layout/footer.module.scss

@@ -115,6 +115,32 @@
   }
 }
 
+.pigPattern {
+  background-color: var(--color-background);
+  background-image: url("/assets/graphics/grisemonster.png");
+  background-size: 100% auto;
+  background-position: 0 100%;
+  background-attachment: fixed;
+  background-repeat: no-repeat;
+  width: 100%;
+  height: 50vh;
+  position: relative;
+  z-index: 700;
+
+  @media (orientation: landscape) {
+    background-size: 100% auto;
+  }
+
+  @media (orientation: portrait) {
+    background-size: auto 50%;
+  }
+
+  @media (hover: none) {
+    background-attachment: initial;
+    background-size: cover;
+ }
+}
+
 @media (max-width: 900px) {
   .social,
   .contact,