diff --git a/web/public/assets/graphics/grisemonster.png b/web/public/assets/graphics/grisemonster.png
new file mode 100644
index 0000000..3d0eed1
Binary files /dev/null and b/web/public/assets/graphics/grisemonster.png differ
diff --git a/web/src/components/layout/Footer.tsx b/web/src/components/layout/Footer.tsx
index ea56e73..67ba0fb 100644
--- a/web/src/components/layout/Footer.tsx
+++ b/web/src/components/layout/Footer.tsx
@@ -36,6 +36,7 @@ async function OpeningHoursTable() {
export const Footer = () => {
return (
+ <>
+
+
+ >
);
};
diff --git a/web/src/components/layout/footer.module.scss b/web/src/components/layout/footer.module.scss
index 74d8196..a84f042 100644
--- a/web/src/components/layout/footer.module.scss
+++ b/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,