Footer should be fixed on mobile

The festival should now display the right part of the image on desktop and mobile.
Makefile superfluous entried removed.

src/app/(static)/festival/page.tsx

@@ -20,7 +20,7 @@ export default function FestivalPage() {
           <AnimatedImage
             src={bannerPic}
             alt='Praline'
-            className='w-full h-full object-cover object-[-8rem]'
+            className='w-full h-full object-cover object-[-8rem] md:object-center'
             sizes='100vw'
           />
           <a

src/components/footer.module.css

@@ -1,7 +1,8 @@
   .grid {
     display: grid;
     gap: 2rem /* 32px */;
-    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
+    /* grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); */
+    grid-template-columns: repeat(4, 1fr); /* 4 columns */
 
     padding-top: 3rem /* 48px */;
     padding-bottom: 3rem /* 48px */;
@@ -14,8 +15,8 @@
     background-color: hsl(20, 18%, 97%);
   }
 
-  @media screen and (width >= 768px) {
-    .productImage {
-      display: none;
+  @media (max-width: 768px) {
+    .grid {
+      grid-template-columns: repeat(2, 1fr); /* Still 4 columns */
+    }
     }
-  }