diff --git a/src/components/main/MainActivity.vue b/src/components/main/MainActivity.vue
index ccd3759..691c16f 100644
--- a/src/components/main/MainActivity.vue
+++ b/src/components/main/MainActivity.vue
@@ -15,7 +15,7 @@ useIntervalFn(async () => await refresh(), 5000)
 </script>
 
 <template>
-  <UCard class="mx-8 md:mx-0 f-auto flex flex-col justify-between" :ui="CardUi">
+  <UCard class="mx-4 md:mx-0 f-auto flex flex-col justify-between" :ui="CardUi">
     <div v-if="activity && activity.data.activities" class="flex items-center gap-x-4">
       <p
         class="uppercase tracking-widest text-sm"
diff --git a/src/components/main/MainStats.vue b/src/components/main/MainStats.vue
index 4ce4966..ecce753 100644
--- a/src/components/main/MainStats.vue
+++ b/src/components/main/MainStats.vue
@@ -8,7 +8,7 @@ const CardUi = {
 </script>
 
 <template>
-  <UCard class="mx-8 md:mx-0 flex flex-col justify-between" :ui="CardUi">
+  <UCard class="mx-4 md:mx-0 flex flex-col justify-between" :ui="CardUi">
     <div class="flex items-center gap-x-4 h-full">
       <p
         class="uppercase tracking-widest text-sm"
diff --git a/src/pages/index.vue b/src/pages/index.vue
index ac6067c..0ea283a 100644
--- a/src/pages/index.vue
+++ b/src/pages/index.vue
@@ -8,7 +8,7 @@ useHead({
   <section>
     <Announcement />
     <MainBanner />
-    <div class="px-4 lg:px-44 md:px-16 sm:px-8 w-full my-16 grid grid-cols-1 md:grid-cols-2 md:gap-x-16 gap-y-8 md:gap-y-16">
+    <div class="px-4 lg:px-44 md:px-16 sm:px-8 w-full my-16 grid grid-cols-1 md:grid-cols-2 md:gap-x-16 gap-y-4 md:gap-y-16">
       <MainActivity />
       <MainStats />
     </div>