diff --git a/app/globals.css b/app/globals.css
index 94f27b1..49b1358 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -143,9 +143,16 @@ body {
   background: rgba(110, 231, 183, 0.25);
   color: var(--fg);
 }
-
+.footer {
+    flex-direction: row;
+    height: 28;
+  }
 @media (max-width: 640px) {
   h1 {
     font-size: 32px !important;
   }
+  .footer {
+    flex-direction: column;
+    height: 36;
+  }
 }
\ No newline at end of file
diff --git a/components/Footer.tsx b/components/Footer.tsx
index 8cfcd67..1cdd4b9 100644
--- a/components/Footer.tsx
+++ b/components/Footer.tsx
@@ -4,12 +4,12 @@ import { SITE } from "@/data/content";
 export default function Footer() {
   return (
     <div
+      className="footer"
       style={{
         position: "fixed",
         bottom: 0,
         left: 0,
         right: 0,
-        height: 28,
         background: "var(--surface)",
         borderTop: "1px solid var(--border)",
         display: "flex",