diff --git a/net/web/src/App.js b/net/web/src/App.js
index 803d57f4..deb7a11b 100644
--- a/net/web/src/App.js
+++ b/net/web/src/App.js
@@ -15,7 +15,7 @@ import { ViewportContextProvider } from 'context/ViewportContext';
 
 import { AppWrapper } from 'App.styled';
 import { Root } from './root/Root';
-import { Login } from './login/Login';
+import { Access } from './access/Access';
 
 function App() {
 
@@ -34,7 +34,8 @@ function App() {
                           <Router>
                             <Routes>
                               <Route path="/" element={ <Root /> } />
-                              <Route path="/login" element={ <Login /> } />
+                              <Route path="/login" element={ <Access mode="login" /> } />
+                              <Route path="/create" element={ <Access mode="create" /> } />
                             </Routes>
                           </Router>
                         </AppWrapper>
diff --git a/net/web/src/login/Login.jsx b/net/web/src/access/Access.jsx
similarity index 84%
rename from net/web/src/login/Login.jsx
rename to net/web/src/access/Access.jsx
index 3110df8f..bbed5b1f 100644
--- a/net/web/src/login/Login.jsx
+++ b/net/web/src/access/Access.jsx
@@ -2,11 +2,11 @@ import React, { useContext, useEffect } from 'react';
 import { useNavigate } from "react-router-dom";
 import { AppContext } from 'context/AppContext';
 import { ViewportContext } from 'context/ViewportContext';
-import { LoginWrapper } from './Login.styled';
+import { AccessWrapper } from './Access.styled';
 
 import login from 'images/login.png'
 
-export function Login() {
+export function Access({ mode }) {
 
   const navigate = useNavigate();
   const app = useContext(AppContext);
@@ -21,13 +21,13 @@ export function Login() {
   }, [app]);
 
   return (
-    <LoginWrapper>
+    <AccessWrapper>
       { (viewport.state.display === 'large' || viewport.state.display === 'xlarge') && (
         <div class="split-layout">
           <div class="left">
             <img class="splash" src={login} alt={login} />
           </div>
-          <div class="right">RIGHT</div>
+          <div class="right">{ mode }</div>
         </div>
       )}
       { (viewport.state.display === 'medium' || viewport.state.display === 'small') && (
@@ -35,7 +35,7 @@ export function Login() {
           <div class="center"></div>
         </div>
       )}
-    </LoginWrapper>
+    </AccessWrapper>
   );
 }
 
diff --git a/net/web/src/login/Login.styled.js b/net/web/src/access/Access.styled.js
similarity index 94%
rename from net/web/src/login/Login.styled.js
rename to net/web/src/access/Access.styled.js
index 84839621..e07928d9 100644
--- a/net/web/src/login/Login.styled.js
+++ b/net/web/src/access/Access.styled.js
@@ -1,7 +1,7 @@
 import styled from 'styled-components';
 import Colors from 'constants/Colors';
 
-export const LoginWrapper = styled.div`
+export const AccessWrapper = styled.div`
   height: 100%;
 
   .full-layout {