diff --git a/projects/style.css b/projects/style.css
index da5f30b..1c21c81 100644
--- a/projects/style.css
+++ b/projects/style.css
@@ -105,7 +105,7 @@ h2 {
 }
 
 .project-div *,
-.futureproject-div *  {
+.futureproject-div * {
     color: white;
 }
 
@@ -159,30 +159,110 @@ h2 {
 }
 
 @media (max-width: 768px) {
+    body {
+        font-size: 0.9rem;
+    }
+
     .main {
         width: 95%;
+        margin-top: 40px;
+        margin-bottom: 40px;
     }
 
     h2 {
         font-size: 1.5rem;
+        margin-bottom: 30px;
     }
 
-    .project-div {
+    .projects h2 {
         font-size: 0.9rem;
     }
+
+    .project-div,
+    .futureproject-div {
+        width: 100%;
+        max-width: none;
+        font-size: 0.9rem;
+        padding: 15px;
+    }
+
+    .project-div h1,
+    .futureproject-div h1 {
+        font-size: 1.1rem;
+    }
+
+    .project-desc,
+    .futureproject-desc {
+        font-size: 0.75rem;
+    }
+
+    .project-div .visit-project,
+    .futureproject-div .visit-futureproject {
+        font-size: 0.9rem;
+        padding: 8px 16px;
+    }
+
+    div.header-main {
+        padding: 10px;
+    }
+
+    img[class="img_header"] {
+        height: 2.5rem;
+        margin-top: 10px;
+        margin-right: 15px;
+    }
 }
 
 @media (max-width: 480px) {
     body {
-        font-size: 0.9rem;
+        font-size: 0.85rem;
+    }
+
+    .main {
+        width: 100%;
+        margin-top: 30px;
+        margin-bottom: 30px;
     }
 
     h2 {
         font-size: 1.2rem;
+        margin-bottom: 20px;
     }
 
-    .project-div {
-        padding: 15px;
-        font-size: 0.85rem;
+    .projects h2 {
+        font-size: 0.8rem;
     }
-}
+
+    .project-div,
+    .futureproject-div {
+        width: 100%;
+        font-size: 0.8rem;
+        padding: 10px;
+    }
+
+    .project-div h1,
+    .futureproject-div h1 {
+        font-size: 1rem;
+    }
+
+    .project-desc,
+    .futureproject-desc {
+        font-size: 0.7rem;
+    }
+
+    .project-div .visit-project,
+    .futureproject-div .visit-futureproject {
+        font-size: 0.85rem;
+        padding: 6px 12px;
+    }
+
+    div.header-main {
+        padding: 8px;
+    }
+
+    img[class="img_header"] {
+        height: 2rem;
+        margin-top: 5px;
+        margin-right: 10px;
+    }
+}
\ No newline at end of file
diff --git a/style.css b/style.css
index e6afeb3..c5b6162 100644
--- a/style.css
+++ b/style.css
@@ -156,30 +156,66 @@ html {
 }
 
 @media (max-width: 768px) {
-    .main {
-        width: 95%;
+    .tools-main {
+        max-width: 100%;
+        gap: 1.5vw;
     }
 
-    h2 {
-        font-size: 1.5rem;
-    }
-
-    .project-div {
+    .tool-div {
+        width: 100%;
+        scale: 1;
+        margin-bottom: 20px;
         font-size: 0.9rem;
     }
+
+    .tool-header {
+        font-size: 1.2rem;
+    }
+
+    .tool-desc {
+        font-size: 0.8rem;
+    }
+
+    .visit-tool {
+        font-size: 0.9rem;
+        padding: 8px 16px;
+    }
+
+    .welcome {
+        font-size: 0.9rem;
+        width: 90vw;
+        padding-top: 40px;
+    }
 }
 
 @media (max-width: 480px) {
-    body {
-        font-size: 0.9rem;
+    .tools-main {
+        max-width: 100%;
     }
 
-    h2 {
-        font-size: 1.2rem;
+    .tool-div {
+        width: 100%;
+        scale: 1;
+        margin-bottom: 20px;
+        font-size: 0.8rem;
     }
 
-    .project-div {
-        padding: 15px;
+    .tool-header {
+        font-size: 1rem;
+    }
+
+    .tool-desc {
+        font-size: 0.75rem;
+    }
+
+    .visit-tool {
         font-size: 0.85rem;
+        padding: 6px 12px;
+    }
+
+    .welcome {
+        font-size: 0.8rem;
+        width: 100%;
+        padding-top: 30px;
     }
 }
\ No newline at end of file