diff --git a/index.html b/index.html
index 4f00ab55e77..a931b420111 100644
--- a/index.html
+++ b/index.html
@@ -9,12 +9,16 @@
 
   <div class="recent">
 
-    <a class="post-title" href="{{ site.baseurl }}/post">
+    <!-- <a class="post-title" href="{{ site.baseurl }}/post">
       <p class = "single-post-in-category">
           <div>
             <h2 class="without-underbar">Recent Posts</h2>
           </div>
       </p>
+    </a> -->
+
+    <a class="post-title index-page-recent-post" href="{{ site.baseurl }}/post">
+      <h1 class="without-underbar">Recent Posts</h1>
     </a>
 
     <ul class="related-posts">
@@ -25,9 +29,7 @@ <h3>
               <small>{{ post.categories[-1] }}</small>
               <div>
               <a href="{{ site.baseurl }}{{ post.url }}">
-                <small>{{post.keyword}}</small>
-                {{ post.title }}
-              <small style="font-size: 17.4px;">{{post.subtitle}}</small>
+                <small>{{post.keyword}}</small> {{ post.title }}
               </a>
               </div>
             </h3>
@@ -36,8 +38,8 @@ <h3>
       {% endfor %}
     </ul>
 
-    <a class="post-title index-button-keep-reading" href="{{ site.baseurl }}/post">
-      <h2 class="without-underbar">There are {{ site.posts | size }} more posts beyond this page</h2>
+    <a class="post-title index-page-keep-reading" href="{{ site.baseurl }}/post">
+      <h2 class="without-underbar">🚀 There are {{ site.posts | size }} more posts beyond this page 🚀</h2>
     </a>
 
   <div style="height : 6.5em"></div>
diff --git a/public/css/custom.css b/public/css/custom.css
index 833cf48efb6..cd0d03f6825 100644
--- a/public/css/custom.css
+++ b/public/css/custom.css
@@ -1,4 +1,4 @@
-.index-button-keep-reading {
+.index-page-recent-post {
     display: block;
     width: 100%;
     text-align: center;
@@ -7,38 +7,43 @@
     text-decoration: none;
     margin: 0;
   }
+
+.index-page-recent-post h1 {
+    margin: 0;
+    font-size: 1.5em; /* Increase font size */
+    font-weight: bold; /* Make text bold */
+    letter-spacing: 1px; /* Slightly increase letter spacing */
+    text-transform: uppercase; /* Uppercase letters */
+    font-family: 'Montserrat', sans-serif;
+    color: #333; /* Adjust text color */
+  }
+
+.index-page-keep-reading {
+    display: block;
+    width: 100%;
+    text-align: center;
+    padding: 10px;
+    color: #000; /* Adjust text color as needed */
+    text-decoration: none;
+    margin-top: 2em;
+  }
   
-  .index-button-keep-reading:hover {
+  .index-page-keep-reading:hover {
     background-color: #f0f0f0; /* Slightly grey background on hover */
   }
-  
 
-  .index-button-keep-reading h2 {
+  .index-page-keep-reading h2 {
     margin: 0;
-    font-size: 1em; /* Increase font size */
+    font-size: 1.1em; /* Increase font size */
     font-weight: bold; /* Make text bold */
     letter-spacing: 1px; /* Slightly increase letter spacing */
     text-transform: uppercase; /* Uppercase letters */
-    font-family: 'Montserrat', sans-serif; /* Use a stylish font */
+    font-family: 'Montserrat', sans-serif;
     color: #333; /* Adjust text color */
-  
-    /* Add a gradient to the text */
-    /* background: linear-gradient(45deg, #ff6b6b, #f94d6a); */
-    /* -webkit-background-clip: text;
-    -webkit-text-fill-color: transparent; */
-  
-    /* Add text shadow for depth */
-    /* text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1); */
   }
   
-  .index-button-keep-reading h2:hover {
-    /* Change gradient on hover */
-    /* background: linear-gradient(45deg, #f94d6a, #ff6b6b);
-    -webkit-background-clip: text;
-    -webkit-text-fill-color: transparent;
-  } */
-  }
+  .index-page-keep-reading h2:hover {}
 
   .without-underbar {
     margin: 0;
-  }
\ No newline at end of file
+  }