diff --git a/Workly/src/apps/iapply/Iapply.css b/Workly/src/apps/iapply/Iapply.css
index 4bc110c97ec29005bedb603fed4e60546cfe47bf..b5a234d23342ac17cf0ef3e2a6468389dded4dab 100644
--- a/Workly/src/apps/iapply/Iapply.css
+++ b/Workly/src/apps/iapply/Iapply.css
@@ -1,9 +1,10 @@
 .iapply-navbar {
   position: fixed;
-  left: 0;
-  top: 0;
-  height: 100vh;
-  width: 250px;
+  flex: 0 1 auto;
+  left: 0.5rem;
+  top: 0.5rem;
+  bottom: 0.5rem;
+  width: 14rem;
   border-radius: 20px;
   background-color: rgb(0, 0, 0);
   color: rgb(255, 255, 255);
@@ -12,6 +13,7 @@
   padding-top: 20px;
   box-shadow: 3px 0 10px rgba(0, 0, 0, 0.3);
   border-right: 0.01rem solid rgba(0, 0, 0, 0.2);
+  padding:1rem;
 }
 
 .iapply-navbar .Title {
diff --git a/Workly/src/apps/iapply/components/IapplyNavbar.tsx b/Workly/src/apps/iapply/components/IapplyNavbar.tsx
index d16a7a677dfd39573ec392c330a0b76030b3eddd..4c2d4b6b5dd6fa5787ad6ab3c1a79144c1307d7f 100644
--- a/Workly/src/apps/iapply/components/IapplyNavbar.tsx
+++ b/Workly/src/apps/iapply/components/IapplyNavbar.tsx
@@ -7,23 +7,23 @@ const IapplyNavbar = () => {
 
   return (
     <nav className="iapply-navbar">
-      <a href="/" className='Title'>IAPPLY</a>
+      <a href="/iapply" className='Title'>IAPPLY</a>
       <ul>
         {isAuthenticated ? (
           // If user is signed in
           <>
-            <li><Link to="/dashboard">Dashboard</Link></li>
-            <li><Link to="/discover">Discover</Link></li>
-            <li><Link to="/profile">Profile</Link></li>
-            <li><Link to="/settings">Settings</Link></li>
+            <li><Link to="/iapply/dashboard">Dashboard</Link></li>
+            <li><Link to="/iapply/discover">Discover</Link></li>
+            <li><Link to="/iapply/profile">Profile</Link></li>
+            <li><Link to="/iapply/settings">Settings</Link></li>
             <li><button onClick={() => setIsAuthenticated(false)}>Sign Out</button></li>
           </>
         ) : (
           // If user is signed out
           <>
-            <li><Link to="/signin">Sign In</Link></li>
-            <li><Link to="/discover">Discover</Link></li>
-            <li><Link to="/help">Help</Link></li>
+            <li><Link to="/iapply/signin">Sign in</Link></li>
+            <li><Link to="/iapply/discover">Discover</Link></li>
+            <li><Link to="/iapply/help">Help</Link></li>
           </>
         )}
       </ul>
diff --git a/Workly/src/apps/iapply/pages/SignIn/SignIn.Modules.css b/Workly/src/apps/iapply/pages/SignIn/SignIn.Modules.css
new file mode 100644
index 0000000000000000000000000000000000000000..f29991633e19615370271a7fd92b5fa477bce24e
--- /dev/null
+++ b/Workly/src/apps/iapply/pages/SignIn/SignIn.Modules.css
@@ -0,0 +1,14 @@
+.page
+{
+    display: flex;
+    width: 100%;
+    height: auto;
+    margin-left: 17rem;
+    background-color: red;
+
+}
+
+.form-container{
+    display: grid;
+    background-color: blue;
+}
\ No newline at end of file
diff --git a/Workly/src/apps/iapply/pages/SignIn/SignIn.tsx b/Workly/src/apps/iapply/pages/SignIn/SignIn.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..578001eb5a915d306fa8ffd601a37ff2f96b85df
--- /dev/null
+++ b/Workly/src/apps/iapply/pages/SignIn/SignIn.tsx
@@ -0,0 +1,20 @@
+import "./SignIn.Modules.css"
+import RegisterForm from "./components/UserForms"
+
+
+const SignIn = () => {
+    
+
+    return (
+        <>
+        <div className={"page"}>
+            <div className={"form-container"}>
+                <RegisterForm/>
+                {/* <SignInForm/> */}
+            </div>
+        </div>
+        </>
+    );
+};
+
+export default SignIn;
\ No newline at end of file
diff --git a/Workly/src/apps/iapply/pages/SignIn/components/UserForms.Modules.css b/Workly/src/apps/iapply/pages/SignIn/components/UserForms.Modules.css
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/Workly/src/apps/iapply/pages/SignIn/components/UserForms.tsx b/Workly/src/apps/iapply/pages/SignIn/components/UserForms.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..713686d5f4ef43e1a10b361355258c64eded3943
--- /dev/null
+++ b/Workly/src/apps/iapply/pages/SignIn/components/UserForms.tsx
@@ -0,0 +1,16 @@
+
+
+
+const RegisterForm = () => {
+
+    return (
+        <>
+            <form>
+                <h1>WELCOME TO NEW <strong>OPPORTUNITIES</strong></h1>
+
+            </form>
+        </>
+    );
+};
+
+export default RegisterForm;
\ No newline at end of file
diff --git a/Workly/src/apps/iapply/routes/IapplyRoutes.tsx b/Workly/src/apps/iapply/routes/IapplyRoutes.tsx
index 72eb04e43b1a6969411c21100338db210ef592b3..e5faeb31ed7b41785cd3d57bc81d785ad6ee7fcc 100644
--- a/Workly/src/apps/iapply/routes/IapplyRoutes.tsx
+++ b/Workly/src/apps/iapply/routes/IapplyRoutes.tsx
@@ -1,10 +1,12 @@
 import { Routes, Route } from 'react-router-dom';
 import Home from '../pages/Home/Home';
+import SignIn from "../pages/SignIn/SignIn"
 
 function App() {
   return (
-    <Routes>
-      <Route path="/" element={<Home />} />
+    <Routes> {/* REMEMBER ROUTES HAVE PREFIX /iapply */}
+      <Route path="/iapply" element={<Home />} />
+      <Route path="/signin" element={<SignIn />} />
     </Routes>
   );
 }