diff --git a/index.html b/index.html
index 01559da..a1d17d0 100644
--- a/index.html
+++ b/index.html
@@ -87,8 +87,8 @@
             </div>
         </div>
     </div>
-    <div class="container min-h-screen px-2 py-6 overflow-hidden text-white scroll-mt-14 md:scroll-mt-20" id="section_about">
-        <h1 class="mt-16 mb-12 text-4xl font-bold text-center md:mt-24 sm:text-6xl">ABOUT ME</h1>
+    <div class="container min-h-screen px-2 py-6 overflow-hidden text-white scroll-mt-20 lg:scroll-mt-8 xl:scroll-mt-20" id="section_about">
+        <h1 class="mb-12 text-4xl font-bold text-center mt-28 sm:mt-32 md:mt-28 2xl:mt-20 sm:text-6xl">ABOUT ME</h1>
         <div class="flex flex-wrap gap-8 mx-auto sm:justify-center w-fit">
             <div class="flex flex-col w-[344px] sm:w-[416px]">
                 <div class="relative w-[344px] sm:w-[416px] h-[100px] sm:h-[120px] flex justify-center items-center bg-bg-gray">
@@ -144,8 +144,8 @@
             </div>
         </div>
     </div>
-    <div class="container min-h-screen py-6 overflow-hidden text-white scroll-mt-14 md:scroll-mt-20" id="section_links">
-        <h1 class="mt-16 mb-12 text-4xl font-bold text-center md:mt-24 sm:text-6xl">LINKS</h1>
+    <div class="container min-h-screen py-6 overflow-hidden text-white scroll-mt-20 lg:scroll-mt-8 xl:scroll-mt-20" id="section_links">
+        <h1 class="mb-12 text-4xl font-bold text-center mt-28 sm:mt-32 md:mt-28 2xl:mt-20 sm:text-6xl">LINKS</h1>
         <div class="flex flex-wrap justify-center gap-8 mx-auto w-fit">
             <!-- Photo Links -->
             <div class="flex flex-col w-[344px] sm:w-[416px] gap-1 sm:gap-4">
diff --git a/static/tailwind.css b/static/tailwind.css
index 35bd4ae..3d2c29c 100644
--- a/static/tailwind.css
+++ b/static/tailwind.css
@@ -686,6 +686,18 @@ video {
   margin-top: 4rem;
 }
 
+.mt-24 {
+  margin-top: 6rem;
+}
+
+.mt-32 {
+  margin-top: 8rem;
+}
+
+.mt-28 {
+  margin-top: 7rem;
+}
+
 .block {
   display: block;
 }
@@ -828,6 +840,30 @@ video {
   scroll-margin-top: 3.5rem;
 }
 
+.scroll-mt-16 {
+  scroll-margin-top: 4rem;
+}
+
+.scroll-mt-20 {
+  scroll-margin-top: 5rem;
+}
+
+.scroll-mt-4 {
+  scroll-margin-top: 1rem;
+}
+
+.scroll-mt-8 {
+  scroll-margin-top: 2rem;
+}
+
+.scroll-mt-12 {
+  scroll-margin-top: 3rem;
+}
+
+.scroll-mt-24 {
+  scroll-margin-top: 6rem;
+}
+
 .flex-col {
   flex-direction: column;
 }
@@ -1260,6 +1296,14 @@ body {
     top: -6rem;
   }
 
+  .sm\:mt-16 {
+    margin-top: 4rem;
+  }
+
+  .sm\:mt-32 {
+    margin-top: 8rem;
+  }
+
   .sm\:block {
     display: block;
   }
@@ -1302,6 +1346,18 @@ body {
     transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
   }
 
+  .sm\:scroll-mt-16 {
+    scroll-margin-top: 4rem;
+  }
+
+  .sm\:scroll-mt-24 {
+    scroll-margin-top: 6rem;
+  }
+
+  .sm\:scroll-mt-32 {
+    scroll-margin-top: 8rem;
+  }
+
   .sm\:flex-row {
     flex-direction: row;
   }
@@ -1421,6 +1477,10 @@ body {
     margin-top: 6rem;
   }
 
+  .md\:mt-28 {
+    margin-top: 7rem;
+  }
+
   .md\:inline {
     display: inline;
   }
@@ -1459,6 +1519,10 @@ body {
     max-width: 53.75%;
   }
 
+  .xl\:scroll-mt-20 {
+    scroll-margin-top: 5rem;
+  }
+
   .xl\:flex-col {
     flex-direction: column;
   }
@@ -1501,6 +1565,22 @@ body {
     width: 64px;
   }
 
+  .lg\:scroll-mt-20 {
+    scroll-margin-top: 5rem;
+  }
+
+  .lg\:scroll-mt-10 {
+    scroll-margin-top: 2.5rem;
+  }
+
+  .lg\:scroll-mt-8 {
+    scroll-margin-top: 2rem;
+  }
+
+  .lg\:scroll-mt-12 {
+    scroll-margin-top: 3rem;
+  }
+
   .lg\:gap-4 {
     gap: 1rem;
   }
@@ -1530,6 +1610,10 @@ body {
     margin-top: -0px;
   }
 
+  .\32xl\:mt-20 {
+    margin-top: 5rem;
+  }
+
   .\32xl\:h-screen {
     height: 100vh;
   }