diff --git a/src/app/core/layouts/footer/footer.html b/src/app/core/layouts/footer/footer.html
index e0e7851..068c3d5 100644
--- a/src/app/core/layouts/footer/footer.html
+++ b/src/app/core/layouts/footer/footer.html
@@ -1,6 +1,6 @@
 <footer class="bg-gray-900 text-gray-500 py-4 mt-4 gap-5 text-xs font-bold wrapper">
   <a href="/" class="px-3 py-1 bg-white text-gray-800 font-black font-space">eKart</a>
-  <div class="grid md:grid-cols-4 mt-2">
+  <div class="grid md:grid-cols-4 mt-2 gap-y-4">
     <div class="footer-links">
       <a href="">
         <lucide-angular [img]="MailIcon" class="w-3" />
diff --git a/src/app/features/login/login.html b/src/app/features/login/login.html
index 5fdfba7..f8f4257 100644
--- a/src/app/features/login/login.html
+++ b/src/app/features/login/login.html
@@ -1,7 +1,11 @@
-<section class="my-20 flex justify-center items-center">
-  <article class="card max-w-8/12 grid sm:grid-cols-3 gap-x-4">
-    <div class="col-span-2">
-      <img src="/assets/images/login-page.jpg" alt="" class="rounded-lg" />
+<section class="my-10 sm:my-20 flex justify-center items-center">
+  <article class="card max-w-11/12 sm:max-w-8/12 grid md:grid-cols-2 lg:grid-cols-3 gap-4">
+    <div class="md:col-span-1 lg:col-span-2">
+      <img
+        src="/assets/images/login-page.jpg"
+        alt=""
+        class="rounded-lg object-cover w-full h-full"
+      />
     </div>
 
     <article class="space-y-4">