fixed css for mobile

styles/global.css

@@ -421,7 +421,8 @@ em {
 @media screen and (max-width: 1100px) {
 
     body {
-        font-size: 30px;
+        font-size: 20px;
+        padding-top: 0em;
     }
 
     #logo {
@@ -525,11 +526,10 @@ em {
 
     #homepage .card {
         flex-direction: column-reverse;
-        padding-block: 80px;
         gap: 70px;
-        width: fit-content;
         padding: 80px;
         margin-top: 0;
+        max-width: 65%;;
     }
 
     .card::after {
@@ -543,8 +543,8 @@ em {
     }
 
     #homepage-img {
-        width: 300px;
-        height: 300px;
+        width: 14em;
+        height: 14em;
     }
 
     #hi {
@@ -568,6 +568,10 @@ em {
         flex-direction: column;
     }
 
+    .project-description {
+        max-width: 100%;
+    }
+
     .project img {
         width: calc(100vw - 192px);
         height: auto;
@@ -577,18 +581,13 @@ em {
         padding-bottom: 1em;
     }
 
-    #homepage-img {
-        width: 500px;
-        height: 500px;
-    }
-
     #aboutme {
         padding-top: 70px;
     }
 
     #aboutme h1 {
         transform: translateY(170px);
-        top: -150px;
+        top: -3em;
     }
 }