diff --git a/src/server/admin/ui/2fa.html b/src/server/admin/ui/2fa.html
new file mode 100644
index 0000000..e69de29
diff --git a/src/server/admin/ui/auth.html b/src/server/admin/ui/auth.html
new file mode 100644
index 0000000..e69de29
diff --git a/src/server/admin/ui/login.html b/src/server/admin/ui/login.html
index ad8ef4e..de4f0e8 100644
--- a/src/server/admin/ui/login.html
+++ b/src/server/admin/ui/login.html
@@ -4,15 +4,79 @@
         <meta charset="UTF-8">
         <meta http-equiv="X-UA-Compatible" content="IE=edge">
         <meta name="viewport" content="width=device-width, initial-scale=1.0">
-        <title>login :: myevent - admin panel</title>
+        <title>Login :: myevent - admin panel</title>
+        <style>
+            body {
+                background-color: rgb(202, 223, 255);
+                font-family: sans-serif;
+                font-size: calc(12pt + 0.35vw);
+            }
+
+            .content {
+                display: flex;
+                flex-direction: column;
+                justify-content: center;
+                align-items: center;
+            }
+
+            .login-app {
+                border-radius: 50px;
+                margin-top: 2%;
+                background-color: white;
+                width: 60%;
+                display: flex;
+                flex-direction: column;
+                justify-content: center;
+                align-items: center;
+            }
+
+            .form {
+                width: 80%;
+                display: flex;
+                flex-direction: column;
+                justify-content: center;
+                align-items: center;
+                margin-top: 4%;
+                margin-bottom: 4%;
+            }
+
+            .button {
+                text-decoration: none;
+                color: white;
+                background-color: blue;
+                padding: 15px;
+                border-radius: 30px;
+                transition: 1s;
+                cursor: pointer;
+            }
+
+            .button:hover {
+                transition: ease-in-out 0.2s;
+                background-color: darkblue;
+                border-radius: 5px;
+            }
+
+            .input {
+                padding: 1%;
+                width: 80%;
+                margin-bottom: 3%;
+                border-radius: 10px;
+            }
+        </style>
     </head>
     <body>
         <div class="content">
-            <img src="/assets/logo.png" alt="myevent-logo" class="logo">
-            <div class="lang" id="en">
-                <h1>Welcome to myevent!</h1>
-                <p>Thank you for installing and using myevent! Let's get started by setting it up! First plan of action is to log in to the admin panel where you can replace this page here with your own landing page!</p>
-                <a href="/admin/login" class="button">To the admin panel</a>
+            <a href="https://myevent.janishutz.com"><img src="/assets/logo.png" alt="myevent-logo" style="height: 35vh;"></a>
+            <div class="login-app">
+                <h1>Login</h1>
+                <footer>myevent - admin panel</footer>
+                <form action="/admin/auth" method="post" class="form">
+                    <label for="mail">Email address</label><br>
+                    <input type="email" id="mail" name="mail" required class="input"><br>
+                    <label for="pwd">Password</label><br>
+                    <input type="password" id="pwd" name="pwd" required class="input"><br>
+                    <input type="submit" value="Log in" class="button">
+                </form>
             </div>
         </div>
     </body>
diff --git a/src/server/ui/html/en/errorResponses/403.html b/src/server/ui/html/en/errorResponses/403.html
new file mode 100644
index 0000000..de73275
--- /dev/null
+++ b/src/server/ui/html/en/errorResponses/403.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>403 - Forbidden</title>
+        <link rel="stylesheet" href="/css/errorstyle.css">
+    </head>
+    <body>
+        <div class="content">
+            <h1 class="code">403</h1>
+            <h2 class="message">You are currently not allowed to visit this page!</h2>
+            <a href="/" class="button">Back to the homepage</a>
+        </div>
+    </body>
+</html>
\ No newline at end of file
diff --git a/src/server/ui/html/en/errorResponses/500.html b/src/server/ui/html/en/errorResponses/500.html
new file mode 100644
index 0000000..4c50d95
--- /dev/null
+++ b/src/server/ui/html/en/errorResponses/500.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>500 - Internal Server Error</title>
+        <link rel="stylesheet" href="/css/errorstyle.css">
+    </head>
+    <body>
+        <div class="content">
+            <h1 class="code">500</h1>
+            <h2 class="message">The server encountered a problem whilst processing your request!</h2>
+            <a href="/" class="button">Back to the homepage</a>
+        </div>
+    </body>
+</html>
\ No newline at end of file
diff --git a/src/server/ui/html/index.html b/src/server/ui/html/index.html
index 4560cfd..cde03c7 100644
--- a/src/server/ui/html/index.html
+++ b/src/server/ui/html/index.html
@@ -25,6 +25,7 @@
             }
 
             .lang {
+                display: none;
                 background-color: white;
                 padding: 2%;
                 margin: 3%;
@@ -33,12 +34,13 @@
             }
 
             .button {
+                cursor: pointer;
                 text-decoration: none;
                 color: white;
                 background-color: blue;
                 padding: 30px;
                 border-radius: 30px;
-                transition: 0.4s;
+                transition: 1s;
             }
 
             .button:hover {
@@ -46,16 +48,30 @@
                 background-color: darkblue;
                 border-radius: 5px;
             }
+
+            .presented {
+                display: flex;
+            }
         </style>
     </head>
     <body>
         <div class="content">
             <img src="/assets/logo.png" alt="myevent-logo" class="logo">
-            <div class="lang" id="en">
+            <div class="lang presented" id="en">
                 <h1>Welcome to myevent!</h1>
                 <p>Thank you for installing and using myevent! Let's get started by setting it up! First plan of action is to log in to the admin panel where you can replace this page here with your own landing page!</p>
                 <a href="/admin/login" class="button">To the admin panel</a>
             </div>
+            <div class="lang" id="de">
+                <h1>Willkommen zu myevent!</h1>
+                <p>Vielen Dank für die Installation und Nutzung von myevent! Beginnen wir mit dem Aufsetzen! Der erste Schritt ist, sich ins Admin-Panel einzuloggen um die Seite hier mit deiner eigenen Seite zu ersetzen!</p>
+                <a href="/admin/login" class="button">Zum Admin-Panel</a>
+            </div>
         </div>
+        <script>
+            function switchPresented ( n ) {
+                
+            }
+        </script>
     </body>
 </html>
\ No newline at end of file
