diff --git a/front-end/src/App.tsx b/front-end/src/App.tsx
index 53b613d..9ddecf0 100644
--- a/front-end/src/App.tsx
+++ b/front-end/src/App.tsx
@@ -15,6 +15,7 @@ import {
 } from "react-router-dom";
 import { AuthContextProvider } from './context/AuthContext';
 import Explore from './Pages/Explore/Explore';
+import AboutPage from './Pages/AboutPage/AboutPage';
 
 const AppLayout = () => (
   <div>
@@ -39,7 +40,7 @@ const router = createBrowserRouter([
   },
   {
     path: "/about",
-    element: <div>about</div>,
+    element: <AboutPage/>,
     errorElement: <ErrorPage/>
   },
   {
diff --git a/front-end/src/Pages/AboutPage/AboutPage.css b/front-end/src/Pages/AboutPage/AboutPage.css
new file mode 100644
index 0000000..e69de29
diff --git a/front-end/src/Pages/AboutPage/AboutPage.tsx b/front-end/src/Pages/AboutPage/AboutPage.tsx
new file mode 100644
index 0000000..23d8e57
--- /dev/null
+++ b/front-end/src/Pages/AboutPage/AboutPage.tsx
@@ -0,0 +1,13 @@
+import React, { useEffect, useState } from 'react';
+import './AboutPage.css';
+
+const AboutPage: React.FC = () => {
+
+  return(
+    <div>
+        <h1>about this project</h1>
+    </div>
+  );
+}
+
+export default AboutPage;
\ No newline at end of file
diff --git a/front-end/src/Pages/NavBar/Components/buttons.css b/front-end/src/Pages/NavBar/Components/buttons.css
index 9987227..df786ab 100644
--- a/front-end/src/Pages/NavBar/Components/buttons.css
+++ b/front-end/src/Pages/NavBar/Components/buttons.css
@@ -1,6 +1,8 @@
 #logInButton{
+    font-family: 'Helvetica';
+    font-style: normal;
     font-weight: 700;
-    font-size: 22px;
+    font-size: 18px;
     line-height: 33px;
     color: #4646D7;
     background-color: white;
@@ -14,14 +16,16 @@
 }
 
 #sign-up-button {
+    font-family: 'Helvetica';
     font-style: normal;
     font-weight: 700;
-    font-size: 22px;
+    font-size: 18px;
     line-height: 33px;
     color: white;
     background-color: #4646D7;
     border: 2px solid blue;
     border-radius: 10px;
+    padding: 0px 15px 0px 15px;
 }
 
 #sign-up-button:hover {
diff --git a/front-end/src/Pages/NavBar/NavBar.css b/front-end/src/Pages/NavBar/NavBar.css
index 31160b3..dc9e2de 100644
--- a/front-end/src/Pages/NavBar/NavBar.css
+++ b/front-end/src/Pages/NavBar/NavBar.css
@@ -11,7 +11,9 @@
     flex-direction: row;
     justify-content: space-between;
     align-items: center;
-    width: 30%;
+    width: 40%;
+    font-size: 18px;
+    font-family: Helvetica;
 }
 
 #left-nav-items > .NavLink {
@@ -38,6 +40,7 @@
     font-size: 40px;
     line-height: 60px;
     color: #4646D7;
+    font-family: Helvetica;
 }
 
 .svg-cont-prof {
diff --git a/front-end/src/Pages/NavBar/NavBar.tsx b/front-end/src/Pages/NavBar/NavBar.tsx
index 253c045..05a165e 100644
--- a/front-end/src/Pages/NavBar/NavBar.tsx
+++ b/front-end/src/Pages/NavBar/NavBar.tsx
@@ -20,7 +20,6 @@ const NavBar: React.FC = () => {
                 </nav>
                     <NavBarButton text="Explore" pathToPage="/explore"/>
                     <NavBarButton text="About" pathToPage=""/>
-                    <NavBarButton text="Other" pathToPage=""/>
             </div>
             {!loggedIn ?
                 <div id="right-nav-items">