diff --git a/frontend/src/components/AppBar/AppBar.css b/frontend/src/components/AppBar/AppBar.css
index 8b33b936..f5522753 100644
--- a/frontend/src/components/AppBar/AppBar.css
+++ b/frontend/src/components/AppBar/AppBar.css
@@ -6,7 +6,7 @@
   top: 0;
   left: 0;
   height: 120px;
-  width: 100vw;
+  width: 98vw;
   padding: 1rem 3rem 1rem 2rem;
   justify-content: space-between;
   align-items: center;
@@ -46,16 +46,16 @@
   box-shadow: 0px 0px 10px #e3e8f2;
 }
 
-.filter-button {
+.app-bar-filter-button {
   display: flex;
   height: 40px;
   flex-direction: row;
   justify-content: center;
   align-items: center;
-  color: #2F3C50 !important;
-  background-color: #FBFCFE !important;
+  color: #2F3C50;
+  background-color: #FBFCFE;
   box-shadow: 0px 0px 10px #e3e8f2;
-  border-radius: 20px !important;
+  border-radius: 20px;
   gap: 10px;
 }
 
diff --git a/frontend/src/components/AppBar/AppBar.jsx b/frontend/src/components/AppBar/AppBar.jsx
index d534d98e..11ec72cf 100644
--- a/frontend/src/components/AppBar/AppBar.jsx
+++ b/frontend/src/components/AppBar/AppBar.jsx
@@ -13,7 +13,7 @@ export const AppBar = () => {
         <img src={Logo} className="logo" />
         <div className="search-filter-container">
           <input type="text" className="search-input" name="search" placeholder="Search..." />
-          <button className="filter-button">
+          <button className="app-bar-filter-button">
             <AdjustmentsHorizontalIcon className="app-bar-icon" />
             <p>Filter</p>
           </button>
diff --git a/frontend/src/components/Buttons/HomeButton.jsx b/frontend/src/components/Buttons/HomeButton.jsx
deleted file mode 100644
index f7a8e407..00000000
--- a/frontend/src/components/Buttons/HomeButton.jsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import { useNavigate } from "react-router-dom";
-
-export default function HomeButton() {
-  const navigate = useNavigate();
-
-  const handleHomeClick = () => {
-    navigate("/dashboard");
-  };
-
-  return <button onClick={handleHomeClick}>Home</button>;
-}
diff --git a/frontend/src/components/Buttons/SignInButton.css b/frontend/src/components/Buttons/SignInButton.css
deleted file mode 100644
index 3caa433d..00000000
--- a/frontend/src/components/Buttons/SignInButton.css
+++ /dev/null
@@ -1,10 +0,0 @@
-.sign-in-button-container {
-    display: flex;
-    gap: 9px;
-  }
-  
-.login-icon {
-    margin-left: 8px;
-    font-size: 1.2rem;
-    vertical-align: middle;
-}
\ No newline at end of file
diff --git a/frontend/src/components/Buttons/SignInButton.jsx b/frontend/src/components/Buttons/SignInButton.jsx
deleted file mode 100644
index 5ddb730a..00000000
--- a/frontend/src/components/Buttons/SignInButton.jsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import { useNavigate } from "react-router-dom";
-import LoginIcon from "@mui/icons-material/Login";
-import "./SignInButton.css";
-
-export default function SignInButton() {
-  const navigate = useNavigate();
-
-  const handleSignInClick = () => {
-    navigate("/login");
-  };
-
-  return (
-    <div className="sign-in-button-container">
-      <button onClick={handleSignInClick}>
-        Sign In
-        <LoginIcon className="login-icon" />
-      </button>
-    </div>
-  );
-}
diff --git a/frontend/src/components/Buttons/SignOutButton.css b/frontend/src/components/Buttons/SignOutButton.css
deleted file mode 100644
index 6f6a4b22..00000000
--- a/frontend/src/components/Buttons/SignOutButton.css
+++ /dev/null
@@ -1,10 +0,0 @@
-.sign-out-button-container {
-    display: flex;
-    gap: 9px;
-  }
-  
-.sign-out-icon {
-    margin-left: 8px;
-    font-size: 1.2rem;
-    vertical-align: middle;
-}
\ No newline at end of file
diff --git a/frontend/src/components/Buttons/SignOutButton.jsx b/frontend/src/components/Buttons/SignOutButton.jsx
deleted file mode 100644
index 65cd7b9b..00000000
--- a/frontend/src/components/Buttons/SignOutButton.jsx
+++ /dev/null
@@ -1,24 +0,0 @@
-import { useAuth } from "../../contexts/AuthContext";
-import LogoutIcon from "@mui/icons-material/Logout";
-import "./SignOutButton.css";
-
-export default function SignOutButton() {
-  const { logout } = useAuth();
-
-  const handleSignOutClick = async () => {
-    try {
-      await logout();
-    } catch {
-      console.log("Failed to logout");
-    }
-  };
-
-  return (
-    <div className="sign-out-button-container">
-      <button onClick={handleSignOutClick}>
-        Sign Out
-        <LogoutIcon className="sign-out-icon" />
-      </button>
-    </div>
-  );
-}
diff --git a/frontend/src/components/Navbar/Navbar.css b/frontend/src/components/Navbar/Navbar.css
index 9a013523..36aae5d0 100644
--- a/frontend/src/components/Navbar/Navbar.css
+++ b/frontend/src/components/Navbar/Navbar.css
@@ -41,20 +41,14 @@
     background-color: #CDD8F0;
 }
 
-.nav-button-icon-container-selected {
-    height: 60px;
-    width: 60px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    border-radius: 40px;
-    color: #F7FAFF;
+.nav-button.active .nav-button-icon-container {
+    color: #F7FAFF; 
     background-color: #244B94;
 }
 
 .nav-button-icon-container:hover {
+    color: #F7FAFF;
     background-color: #244B94;
-    color: white;
 }
 
 .nav-button-text {
@@ -62,8 +56,7 @@
     color: #666B6F;
 }
 
-.nav-button-text-selected {
-    margin-top: 4px;
+.nav-button.active .nav-button-text {
     color: #244B94;
     font-weight: bold;
 }
diff --git a/frontend/src/components/Navbar/Navbar.jsx b/frontend/src/components/Navbar/Navbar.jsx
index 6649469e..d63663b1 100644
--- a/frontend/src/components/Navbar/Navbar.jsx
+++ b/frontend/src/components/Navbar/Navbar.jsx
@@ -16,10 +16,10 @@ export const Navbar = () => {
     <nav className="nav-bar">
       <div className="nav-button-container">
         <NavLink className="nav-button" to="/dashboard">
-          <div className="nav-button-icon-container-selected">
+          <div className="nav-button-icon-container">
             <HomeIcon className="nav-icon"/>
           </div>
-          <p className="nav-button-text-selected">Home</p>
+          <p className="nav-button-text">Home</p>
         </NavLink>
         <NavLink className="nav-button" to="/newLog">
           <div className="nav-button-icon-container">
diff --git a/frontend/src/pages/styles/UploadPhoto.css b/frontend/src/pages/styles/UploadPhoto.css
index 3eaf9b45..ee903d1e 100644
--- a/frontend/src/pages/styles/UploadPhoto.css
+++ b/frontend/src/pages/styles/UploadPhoto.css
@@ -56,7 +56,7 @@
   
 .page-container {
     display: flex;
-    height: 100vh;
+    height: 98vh;
 }
   
 .main-content {