diff --git a/assets/css/gamecard.css b/assets/css/gamecard.css
new file mode 100644
index 0000000000..e491e0f5a6
--- /dev/null
+++ b/assets/css/gamecard.css
@@ -0,0 +1,11 @@
+.project-item-icon-box .gameTitle{
+    font-size: 0.5rem;
+    font-weight: 600;
+    margin-bottom: 0.5rem;
+    color: #fff;
+    text-align: center;
+    text-transform: uppercase;
+    letter-spacing: 0.1rem;
+    font-family: 'Montserrat', sans-serif;
+    text-shadow: 0 0 10px rgba(0,0,0,0.5);
+}
\ No newline at end of file
diff --git a/assets/css/navbar.css b/assets/css/navbar.css
new file mode 100644
index 0000000000..2c694363af
--- /dev/null
+++ b/assets/css/navbar.css
@@ -0,0 +1,41 @@
+.navbar-new {
+    width: 100%;
+    margin: 0;
+    padding: 0;
+    display: flex;
+    justify-content: space-between;
+    align-items: baseline;
+    justify-items: center;
+}
+
+.navbar-new .logo {
+    font-size: 2rem;
+    font-weight: 600;
+    color: #fff;
+    text-decoration: none;
+    display: flex;
+}
+
+.navbar-new .search-box {
+    width: 100%;
+    margin: 0;
+    padding: 0;
+    height: 100%;
+}
+
+@media screen and (max-width: 920px) {
+    .navbar-new {
+        flex-direction: column;
+        align-items: center;
+        gap: 1rem;
+        justify-content: center;
+        margin-top: 50px;
+    }
+    .navbar-new .logo {
+        font-size: 2rem;
+        font-weight: 600;
+        color: #fff;
+        text-decoration: none;
+        display: flex;
+    }
+}
\ No newline at end of file
diff --git a/assets/css/style.css b/assets/css/style.css
index 3be36f9d67..37bce8d475 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -1388,6 +1388,8 @@ main {
   transform: translate(-50%, -50%) scale(var(--scale));
   font-size: 15px;
   text-align: center;
+  font-size: 15px;
+  text-align: center;
   padding: 18px;
   border-radius: 12px;
   opacity: 0;
diff --git a/assets/js/index.js b/assets/js/index.js
index 1df924823b..ba44704a6c 100644
--- a/assets/js/index.js
+++ b/assets/js/index.js
@@ -15,6 +15,7 @@ const generateLiTags = (gamesData) => {
                 <div class="project-item-icon-box">
                   <img id="joystick" src="https://raw.githubusercontent.com/Tarikul-Islam-Anik/Animated-Fluent-Emojis/master/Emojis/Activities/Video%20Game.png" alt="Eye" width="3" />
                   <p class="gameTitle">${gameTitle}</p>
+                  <p class="gameTitle">${gameTitle}</p>
                 </div>
                 <img src="./assets/images/${thumbnailUrl}" alt="${gameTitle}" loading="lazy">
               </figure>
diff --git a/index.html b/index.html
index 922721a489..433fb1bb3b 100644
--- a/index.html
+++ b/index.html
@@ -47,6 +47,8 @@
   <link rel="stylesheet" href="./assets/css/contributors.css">
   <link rel="stylesheet" href="./assets/css/navbar.css">
   <link rel="stylesheet" href="./assets/css/gameCard.css">
+  <link rel="stylesheet" href="./assets/css/navbar.css">
+  <link rel="stylesheet" href="./assets/css/gameCard.css">
 
   <!--
     - google font link
@@ -116,6 +118,8 @@
         </div>
 
 
+
+
         <br>
 
         <!-- Games -->
@@ -170,6 +174,7 @@ <h1>Our Valuable Contributors</h1>
 
 
 
+
     <footer class="page-footer font-small unique-color-dark pt-4">
       <div class="container1">
         <div class="list-unstyled list-inline text-center py-2 text-black">