diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
index 67f490c..e71a481 100644
--- a/src/components/Navbar.tsx
+++ b/src/components/Navbar.tsx
@@ -10,20 +10,20 @@ export default function Navbar({ activePage = "" }: NavbarProps) {
       <div className={cn("flex flex-row justify-between pb-8 pl-4 pr-4 pt-8")}>
         <div>
           <strong className={cn("sm:text-2xl md:text-4xl")}>
-            <a 
-                className={cn(
-                  activePage === "Home" && "border-b-2 border-black-500",
-                )}
-            href="/">Resist Tech Monopolies</a>
+            <a
+              className={cn(
+                activePage === "Home" && "border-b-2 border-black-500",
+              )}
+              href="/">Resist Tech Monopolies</a>
           </strong>
         </div>
         <strong className={cn("sm:text-1xl flex gap-10 md:text-4xl")}>
-       
+
           <a
             href="/PointsOfUnity/"
             className={cn(
-              "text-green-500",
-              activePage === "PointsOfUnity" && "border-b-2 border-green-500",
+              "rounded-full bg-gray-800 px-6 py-2 text-green-400 transition-colors hover:bg-gray-700",
+              activePage === "PointsOfUnity" && "ring-2 ring-green-500 ring-offset-2",
             )}
           >
             Points of Unity
@@ -31,11 +31,11 @@ export default function Navbar({ activePage = "" }: NavbarProps) {
           <a
             href="/WhatWereWorkingOn/"
             className={cn(
-              "text-red-500",
-              activePage === "WhatWereWorkingOn" && "border-b-2 border-red-500",
+              "rounded-full bg-gray-800 px-6 py-2 text-red-400 transition-colors hover:bg-gray-700",
+              activePage === "WhatWereWorkingOn" && "ring-2 ring-red-500 ring-offset-2",
             )}
           >
-            What We're Working On
+            Our Projects
           </a>
         </strong>
       </div>
@@ -44,11 +44,11 @@ export default function Navbar({ activePage = "" }: NavbarProps) {
         <div className="w-full grid grid-flow-col">
           {Array.from({ length: 12 }).map((_, index) => (
             <div key={index} className="flex justify-center">
-              <img 
-                src={index % 2 === 0 ? "/assets/computer.png" : "/assets/people.png"} 
-                alt={index % 2 === 0 ? "computer icon" : "people icon"} 
-                width="30" 
-                height="30" 
+              <img
+                src={index % 2 === 0 ? "/assets/computer.png" : "/assets/people.png"}
+                alt={index % 2 === 0 ? "computer icon" : "people icon"}
+                width="30"
+                height="30"
               />
             </div>
           ))}