diff --git a/MySQL_conf_pbx/test1/mariadb_data/aria_log.00000001 b/MySQL_conf_pbx/test1/mariadb_data/aria_log.00000001
index 7ad1ad9..8da1046 100644
Binary files a/MySQL_conf_pbx/test1/mariadb_data/aria_log.00000001 and b/MySQL_conf_pbx/test1/mariadb_data/aria_log.00000001 differ
diff --git a/MySQL_conf_pbx/test1/mariadb_data/aria_log_control b/MySQL_conf_pbx/test1/mariadb_data/aria_log_control
index f676f1f..c183af7 100644
Binary files a/MySQL_conf_pbx/test1/mariadb_data/aria_log_control and b/MySQL_conf_pbx/test1/mariadb_data/aria_log_control differ
diff --git a/MySQL_conf_pbx/test1/reactcezenpbx/src/App.jsx b/MySQL_conf_pbx/test1/reactcezenpbx/src/App.jsx
index 8f7132e..ed20237 100755
--- a/MySQL_conf_pbx/test1/reactcezenpbx/src/App.jsx
+++ b/MySQL_conf_pbx/test1/reactcezenpbx/src/App.jsx
@@ -5,6 +5,9 @@ import SignInUp from "./components/login-logout/signInup";
 import LandingPage from "./components/landing-page/homePage.jsx";
 import SignUp from "./components/login-logout/signUp.jsx";
 import LogIn from "./components/login-logout/logIn.jsx";
+import EndPoints from "./components/operations/endPoint.jsx";
+import Features from "./components/operations/features.jsx";
+import EditProfile from "./components/profile/editProfile.jsx";
 
 import "./App.css";
 
@@ -12,7 +15,15 @@ import "./App.css";
 import { createBrowserRouter, RouterProvider } from "react-router-dom";
 
 const router = createBrowserRouter([
-  { path: "/", element: <LandingPage /> },
+  {
+    path: "/",
+    element: <LandingPage />,
+    children: [
+      { path: "/end-points", element: <EndPoints /> },
+      { path: "/features", element: <Features /> },
+      { path: "/edit-profile", element: <EditProfile /> },
+    ],
+  },
   {
     path: "/",
     element: <SignInUp />,
@@ -24,10 +35,20 @@ const router = createBrowserRouter([
 ]);
 
 function App() {
-  const [count, setCount] = useState(0);
+  const [resetNave, navResetFunction] = useState(false);
+
+  const outerUpdate = () => {
+    console.log("Update");
+    navResetFunction((val) => (val = false));
+  };
 
   return (
-    <div className="containment">
+    <div
+      className="containment"
+      onClick={() => {
+        outerUpdate();
+      }}
+    >
       <RouterProvider router={router} />
       {/* <SignInUp /> */}
     </div>
diff --git a/MySQL_conf_pbx/test1/reactcezenpbx/src/components/Lift/reset-cont.jsx b/MySQL_conf_pbx/test1/reactcezenpbx/src/components/Lift/reset-cont.jsx
new file mode 100644
index 0000000..1c54a03
--- /dev/null
+++ b/MySQL_conf_pbx/test1/reactcezenpbx/src/components/Lift/reset-cont.jsx
@@ -0,0 +1,3 @@
+import { createContext } from "react";
+
+export const ResetNavFromHomeScreen = createContext();
diff --git a/MySQL_conf_pbx/test1/reactcezenpbx/src/components/landing-page/homePage.jsx b/MySQL_conf_pbx/test1/reactcezenpbx/src/components/landing-page/homePage.jsx
index f2dee33..5de0d5a 100755
--- a/MySQL_conf_pbx/test1/reactcezenpbx/src/components/landing-page/homePage.jsx
+++ b/MySQL_conf_pbx/test1/reactcezenpbx/src/components/landing-page/homePage.jsx
@@ -1,10 +1,13 @@
 import NavBar from "./navBar";
 import "./home-page.css";
 
+import { Outlet } from "react-router-dom";
+
 export default function LandingPage() {
   return (
     <>
       <NavBar />
+      <Outlet />
       <article className="landing_screen">
         <p>Welcome to the landing page !</p>
       </article>
diff --git a/MySQL_conf_pbx/test1/reactcezenpbx/src/components/landing-page/navBar.jsx b/MySQL_conf_pbx/test1/reactcezenpbx/src/components/landing-page/navBar.jsx
index f13bccb..5d5a5a1 100755
--- a/MySQL_conf_pbx/test1/reactcezenpbx/src/components/landing-page/navBar.jsx
+++ b/MySQL_conf_pbx/test1/reactcezenpbx/src/components/landing-page/navBar.jsx
@@ -5,47 +5,85 @@ import profileLogo from "../../assets/profile-circle-svgrepo-com.svg";
 import NavBarDropDown from "./drop_down/navBarDropDown";
 
 import { useNavigate } from "react-router-dom";
+import { useState } from "react";
 
 export default function NavBar() {
   const navTo = useNavigate();
 
+  // useState for boolean trigger... when inverted
+  // it should display the associated drop down message
+  const [operations, operationsInverter] = useState(false);
+  const [profile, profileInverter] = useState(false);
+
+  const truthInverter = () => {
+    profileInverter((prev) => (prev = false));
+    operationsInverter((prev) => (prev = !prev));
+  };
+
+  const profInverter = () => {
+    operationsInverter((prev) => (prev = false));
+    profileInverter((prev) => (prev = !prev));
+  };
+
   return (
     <nav className="navigation">
       <div>
         <CezenBanner className="cezen_banner_top" />
       </div>
       <div className="RHS_nav">
-        <div className="RHS_nav_pill">
+        <div className="RHS_nav_pill" onClick={truthInverter}>
           <img src={operationsLogo} />
           operations
         </div>
-        <div className="drop-down pos_operations">
-          <NavBarDropDown>
-            {/* css is defined in the NavBarDropDown.css folder*/}
-            <li>End-Points</li>
-            <li>Features</li>
-            <li>Groups</li>
-          </NavBarDropDown>
-        </div>
-        <div className="RHS_nav_pill">
+        {operations && (
+          <div className="drop-down pos_operations">
+            <NavBarDropDown>
+              {/* css is defined in the NavBarDropDown.css folder*/}
+              <li
+                onClick={() => {
+                  navTo("/end-points");
+                }}
+              >
+                End-Points
+              </li>
+              <li
+                onClick={() => {
+                  navTo("/features");
+                }}
+              >
+                Features
+              </li>
+              <li>Groups</li>
+            </NavBarDropDown>
+          </div>
+        )}
+        <div className="RHS_nav_pill" onClick={profInverter}>
           <img src={profileLogo} />
           profile
         </div>
-        <div className="drop-down pos_profile">
-          <NavBarDropDown>
-            {/* css is defined in the NavBarDropDown.css folder*/}
-            <li>Edit Profile</li>
-            <li
-              className="log-out"
-              onClick={() => {
-                console.log("logout");
-                navTo("/log-in");
-              }}
-            >
-              Log-Out
-            </li>
-          </NavBarDropDown>
-        </div>
+        {profile && (
+          <div className="drop-down pos_profile">
+            <NavBarDropDown>
+              {/* css is defined in the NavBarDropDown.css folder*/}
+              <li
+                onClick={() => {
+                  navTo("/edit-profile");
+                }}
+              >
+                Edit Profile
+              </li>
+              <li
+                className="log-out"
+                onClick={() => {
+                  console.log("logout");
+                  navTo("/log-in");
+                }}
+              >
+                Log-Out
+              </li>
+            </NavBarDropDown>
+          </div>
+        )}
       </div>
     </nav>
   );
diff --git a/MySQL_conf_pbx/test1/reactcezenpbx/src/components/operations/endPoint.jsx b/MySQL_conf_pbx/test1/reactcezenpbx/src/components/operations/endPoint.jsx
new file mode 100644
index 0000000..514cc52
--- /dev/null
+++ b/MySQL_conf_pbx/test1/reactcezenpbx/src/components/operations/endPoint.jsx
@@ -0,0 +1,3 @@
+export default function EndPoints() {
+  return <div>Welcome to the End-Point page !</div>;
+}
diff --git a/MySQL_conf_pbx/test1/reactcezenpbx/src/components/operations/features.jsx b/MySQL_conf_pbx/test1/reactcezenpbx/src/components/operations/features.jsx
new file mode 100644
index 0000000..0544ced
--- /dev/null
+++ b/MySQL_conf_pbx/test1/reactcezenpbx/src/components/operations/features.jsx
@@ -0,0 +1,3 @@
+export default function Features() {
+  return <div>Welcome to the Features page !</div>;
+}
diff --git a/MySQL_conf_pbx/test1/reactcezenpbx/src/components/profile/editProfile.jsx b/MySQL_conf_pbx/test1/reactcezenpbx/src/components/profile/editProfile.jsx
new file mode 100644
index 0000000..f979592
--- /dev/null
+++ b/MySQL_conf_pbx/test1/reactcezenpbx/src/components/profile/editProfile.jsx
@@ -0,0 +1,3 @@
+export default function EditProfile() {
+  return <div>Welcome to the Edit Profile page !</div>;
+}