diff --git a/src/components/activity.rs b/src/components/activity.rs
index 10e6ccd..47fc4f9 100644
--- a/src/components/activity.rs
+++ b/src/components/activity.rs
@@ -33,17 +33,17 @@ pub fn Activity(cx: Scope) -> Element {
             class: "relative flex flex-col h-64 w-full mt-24",
             img {
                 src: "{spam_gang}",
-                class: "absolute bottom-24 left-0 md:left-8 lg:left-8 w-128 h-48 md:w-128 md:h-48",
-            
+                class: "absolute bottom-24 left-0 w-64 h-32 md:left-8 md:w-128 md:h-48",  // Smaller size for small screens, original size for medium and up
             }
+            
             img {
                 src: "{go}",
-                class: "absolute bottom-24 left-72 w-32 h-16 md:w-32 md:h-16 animate-jump_right hidden md:inline-block",  // Hidden on small screens, shown as inline-block on medium and up
-            }
+                class: "absolute bottom-24 left-72 w-16 h-16 md:w-32 md:h-16 animate-jump_right",  // Hidden on small screens, shown as inline-block on medium and up
+            }            
             
             img {
                 src: "{back}",
-                class: "absolute bottom-24 left-72 w-32 h-20 md:w-32 md:h-20 animate-move_left",
+                class: "absolute bottom-24 left-72 w-24 h-20 md:w-32 md:h-20 animate-move_left",
             }
         }
     }
diff --git a/src/components/navbar.rs b/src/components/navbar.rs
index 8d5cdcb..3134775 100644
--- a/src/components/navbar.rs
+++ b/src/components/navbar.rs
@@ -50,21 +50,21 @@ pub fn Navbar(cx: Scope) -> Element {
                             class: "w-5 h-5 sm:w-6 sm:h-6 my-auto"  // Smaller logo on small screens
                         }
                         p {
-                            class: "text-lg sm:text-2xl font-semibold my-auto text-gray-300 dark:text-gray-700 hover:text-black dark:hover:text-white",  // Smaller text on small screens
+                            class: "text-lg sm:text-2xl font-semibold my-auto text-gray-300 dark:text-gray-700 hover:text-black dark:hover:text-white", 
                             "SPAM"
                         }
                     }
                     div {
-                        class: "flex flex-row gap-1 sm:gap-2 md:gap-4 lg:gap-10 flex-wrap sm:flex-nowrap",  // Reduced gap for smaller screens
+                        class: "flex flex-row gap-1 sm:gap-2 md:gap-4 lg:gap-10 flex-wrap sm:flex-nowrap", 
                         Link {
                             class: "transition-colors flex flex-col sm:flex-row items-center gap-1 sm:gap-1 md:gap-2 lg:gap-3 px-2 sm:px-0 py-2 rounded-full text-gray-300 dark:text-gray-700 hover:text-black dark:hover:text-white",  // Reduced padding
                             to: Route::Home {},
                             span {
-                                class: "w-5 h-5 sm:w-6 sm:h-6 my-auto",  // Smaller icon on small screens
+                                class: "w-5 h-5 sm:w-6 sm:h-6 my-auto",  
                                 "⛏️"
                             }
                             span {
-                                class: "text-xs sm:text-base md:text-lg",  // Smaller text on small screens
+                                class: "text-xs sm:text-base md:text-lg",  
                                 "Mine"
                             }
                         }
@@ -73,7 +73,7 @@ pub fn Navbar(cx: Scope) -> Element {
                             to: Route::Stats {},
                             StatsIcon {}
                             span {
-                                class: "text-xs sm:text-base md:text-lg",  // Smaller text on small screens
+                                class: "text-xs sm:text-base md:text-lg",  
                                 "Stats"
                             }
                         }
@@ -81,11 +81,11 @@ pub fn Navbar(cx: Scope) -> Element {
                             class: "transition-colors flex flex-col items-center sm:flex-row gap-1 sm:gap-1 md:gap-2 lg:gap-3 px-2 sm:px-0 py-2 rounded-full text-black dark:text-gray-700 hover:text-gray-600 dark:hover:text-white",  // Reduced padding
                             to: Route::Apps {},
                             span {
-                                class: "w-5 h-5",  // Smaller icon on small screens
+                                class: "w-5 h-5", 
                                 "📦"
                             }
                             span {
-                                class: "text-xs sm:text-base md:text-lg",  // Smaller text on small screens
+                                class: "text-xs sm:text-base md:text-lg",  
                                 "Apps"
                             }
                         }
@@ -94,7 +94,7 @@ pub fn Navbar(cx: Scope) -> Element {
                             to: Route::Settings {},
                             MyPageIcon {}
                             span {
-                                class: "text-xs sm:text-base md:text-lg",  // Smaller text on small screens
+                                class: "text-xs sm:text-base md:text-lg", 
                                 "My Page"
                             }
                         }
@@ -102,7 +102,7 @@ pub fn Navbar(cx: Scope) -> Element {
                 }
             }
             div { 
-                class: "flex flex-col h-full py-4 px-4 sm:px-8 grow w-full max-w-[96rem] mx-auto",
+                class: "flex flex-col h-full py-4 px-4 sm:px-8 grow w-full max-w-[96rem] mx-auto", 
                 Outlet::<Route> {}
             }
             Footer {
diff --git a/src/components/tutorial.rs b/src/components/tutorial.rs
index 5e6fb1e..30413c2 100644
--- a/src/components/tutorial.rs
+++ b/src/components/tutorial.rs
@@ -7,23 +7,24 @@ pub fn Tutorial(cx: Scope) -> Element {
     let tool = asset_path("Tool1.png");
     render! {
         div {
-            class: "absolute right-4 sm:right-8 bottom-20 px-2 py-2 animate-bounce text-teal-500 rounded flex items-center space-x-2", // Change background to border
+            class: "absolute right-4 sm:right-8 bottom-20 px-2 py-2 animate-bounce text-teal-500 rounded flex items-center space-x-2", // No changes here
             img {
                 src: "{tool}",
-                class: "w-32 h-36", // Larger image size and reduce padding
+                class: "w-24 h-28 md:w-32 md:h-36", // Smaller image for small screens and original size for medium screens and up
                 alt: "Tool"
             }
             div {
-                class: "flex flex-col mr-4", // Increase padding on the right side of the text
+                class: "flex flex-col mr-2 md:mr-4", // Smaller right margin for small screens and larger for medium screens
                 p {
-                    class: "font-bold text-lg", // Make text bigger
+                    class: "font-bold text-sm md:text-lg", // Smaller text for small screens, larger for medium screens
                     "Start"
                 }
                 p {
-                    class: "font-bold text-lg", // Make text bigger
+                    class: "font-bold text-sm md:text-lg", // Same adjustment for the second line of text
                     "Spamming"
                 }
             }
         }
+        
     }
 }