diff --git a/web/src/components/photos/carousel.astro b/web/src/components/photos/carousel.astro
index 1dda105..d1e537e 100644
--- a/web/src/components/photos/carousel.astro
+++ b/web/src/components/photos/carousel.astro
@@ -70,4 +70,4 @@ const getImageLink = async (record: any) => {
 <!-- Hidden element to pass server data to client -->
     <div class="hidden" id="carousel-data">{JSON.stringify(photos)}</div>
     
-    <img id="carousel-img" class="rounded-lg w-full h-[calc(100vh-7rem)] object-contain" src={ pb.files.getURL(photos[0], photos[0].image) } />
\ No newline at end of file
+    <img id="carousel-img" class="w-full md:h-[calc(100vh-7rem)] object-contain" src={ pb.files.getURL(photos[0], photos[0].image) } />
\ No newline at end of file
diff --git a/web/src/layout/Base.astro b/web/src/layout/Base.astro
index 6cf2c35..44b0bfd 100644
--- a/web/src/layout/Base.astro
+++ b/web/src/layout/Base.astro
@@ -12,18 +12,24 @@ import Footer from "@components/footer"
 </head>
 
 <body>
-    <main id="main" class="flex flex-row">
-        <div class="w-[32%] sticky top-0 py-14 h-screen text-center flex flex-col">
+    <main id="main" class="flex flex-col md:flex-row">
+        <div class="w-full md:w-[32%] md:sticky md:top-0 pt-8 md:py-14 md:h-screen text-center flex flex-col px-6 md:px-0">
             <Sidebar>
                 <slot name="sidebar" />
             </Sidebar>
             
-            <Footer/>
+            <div class="hidden md:block md:mt-auto">
+                <Footer/>
+            </div>
         </div>
         
         <div class="content-panel">
             <slot name="content"/>
         </div>
+        
+        <div class="block md:hidden px-6 pb-8 text-center">
+            <Footer/>
+        </div>
 
     </main>
 </body>
diff --git a/web/src/styles/global.css b/web/src/styles/global.css
index 72bbb23..5fb233d 100644
--- a/web/src/styles/global.css
+++ b/web/src/styles/global.css
@@ -28,7 +28,7 @@
   
   html body {
     @apply font-[Georgia];
-    @apply w-[68%] mx-auto h-full;
+    @apply w-full md:w-[68%] mx-auto h-full;
     @apply bg-(--bg-light);
   }
   
@@ -48,7 +48,7 @@
 }
 
 .content-panel {
-  @apply w-[68%] py-14 pl-10;
+  @apply w-full md:w-[68%] py-8 md:py-14 px-6 md:pl-10 md:pr-0;
 }
 
 @tailwind utilities;
\ No newline at end of file
