diff --git a/src/App.vue b/src/App.vue
index 49b919d..8d0ec15 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -7,23 +7,25 @@ const route = useRoute();
 </script>
 
 <template>
-  <TopBar />
-  <RouterView v-slot="{ Component }">
-    <template v-if="Component">
-      <Transition name="page" mode="out-in" appear>
-        <div :key="route.fullPath">          
-          <Suspense >
-            <template #default >
-              <component :is="Component" />
-            </template>
-            <template #fallback>
-              <div class="flex w-full h-full justify-center items-center">
-                <SpinnerComponent :width="'16'" :height="'16'" />
-              </div>
-            </template>
-          </Suspense>        
-        </div>
-      </Transition>      
-    </template>
-  </RouterView>
+  <div class="p-3 sm:p-4 md:p-8">    
+    <TopBar />
+    <RouterView v-slot="{ Component }">
+      <template v-if="Component">
+        <Transition name="page" mode="out-in" appear>
+          <div :key="route.fullPath">          
+            <Suspense >
+              <template #default >
+                <component :is="Component" />
+              </template>
+              <template #fallback>
+                <div class="flex w-full h-full justify-center items-center">
+                  <SpinnerComponent :width="'16'" :height="'16'" />
+                </div>
+              </template>
+            </Suspense>        
+          </div>
+        </Transition>      
+      </template>
+    </RouterView>
+  </div>
 </template>
diff --git a/src/assets/main.css b/src/assets/main.css
index bed2f2c..3e1fbc9 100644
--- a/src/assets/main.css
+++ b/src/assets/main.css
@@ -6,7 +6,6 @@
 #app {
   width: 100%;
   margin: 0 auto;
-  padding: 2rem;
   height: fit-content;
   min-height: 100vh;
   background: radial-gradient(ellipse at 50% -50%, rgba(49, 46, 129, 1) 60%, rgba(24, 30, 42, 1) 80%);
@@ -27,5 +26,5 @@ a,
 }
 
 .main-container {
-  @apply flex w-full max-w-xs md:max-w-lg flex-col justify-center items-center px-8 py-6 gap-4 rounded-lg border border-gray-500 backdrop-blur-md drop-shadow-lg shadow-lg mt-10;
+  @apply flex w-full md:max-w-lg flex-col justify-center items-center px-4 sm:px-8 py-4 sm:py-6 gap-4 rounded-lg border border-gray-500 backdrop-blur-md drop-shadow-lg shadow-lg mt-10;
 }