diff --git a/templates/login.html b/templates/login.html
index d07c328..c1eb7b4 100644
--- a/templates/login.html
+++ b/templates/login.html
@@ -5,15 +5,19 @@
   <h1>Welcome</h1>
 
   {# Show a username/password login form #}
-  <form method="post" action="/login" id="loginform" accept-charset="UTF-8">
-    <label class="form-label" for="login-username">Username: </label>
-    <input class="form-control" id="login-username" type="text" name="username"/><br/>
-
-    <label class="form-label" for="login-password">Password: </label>
-    <input class="form-control" id="login-password" type="password" name="password"/><br/>
-
-    <input class="btn btn-primary" type="submit" value="Login">
-    <a class="btn btn-secondary" href="/">Cancel</a>
+  <form method="post" action="/login" accept-charset="UTF-8" id="loginform" class="row gy-2 gx-3 align-items-center">
+    <div class="col-auto">
+      <label class="visually-hidden" for="login-username">Username</label>
+      <input class="form-control" id="login-username" type="text" name="username" placeholder="Username" />
+    </div>
+    <div class="col-auto">
+      <label class="visually-hidden" for="login-password">Password</label>
+      <input class="form-control" id="login-password" type="password" name="password" placeholder="Password" />
+    </div>
+    <div class="col-auto">
+      <input class="btn btn-primary" type="submit" value="Login">
+      <a class="btn btn-secondary" href="/">Cancel</a>
+   </div>
   </form>
 
   {{ super() }}
@@ -23,3 +27,4 @@
 {% block eanwebsocket %}
   document.location = "/?ean=" + e.data;
 {% endblock %}
+