diff --git a/ereuse_devicehub/templates/ereuse_devicehub/user_login.html b/ereuse_devicehub/templates/ereuse_devicehub/user_login.html
index 400ef355..b234927c 100644
--- a/ereuse_devicehub/templates/ereuse_devicehub/user_login.html
+++ b/ereuse_devicehub/templates/ereuse_devicehub/user_login.html
@@ -5,47 +5,50 @@
 {% block body %}
 <main>
   <div class="container">
-    <div class="row justify-content-center">
-      <div class="d-flex max-vh-100 flex-column align-items-center" style="max-width: 400px;">
 
-        <div class="d-flex justify-content-center py-4">
-          <a href="{{ url_for('core.login') }}" class="logo d-flex align-items-center w-auto">
-            <img src="{{ url_for('static', filename='img/usody-logo-black.svg') }}" alt="">
-          </a>
-        </div><!-- End Logo -->
+    <section class="section register min-vh-100 d-flex flex-column align-items-center justify-content-center py-4">
+      <div class="container">
+        <div class="row justify-content-center">
+          <div class="col-lg-4 col-md-6 d-flex flex-column align-items-center justify-content-center">
 
-        <div class="card mb-3">
+            <div class="d-flex justify-content-center py-4">
+              <a href="{{ url_for('core.login') }}" class="logo d-flex align-items-center w-auto">
+                <img src="{{ url_for('static', filename='img/usody-logo-black.svg') }}" alt="">
+              </a>
+            </div><!-- End Logo -->
 
-          <div class="card-body">
+            <div class="card mb-3">
 
-            <div class="pt-4 pb-2">
-              <h5 class="card-title text-center pb-0 fs-4">Login to Your Account</h5>
-              <p class="text-center small">Enter your username & password to login</p>
-              {% if form.form_errors %}
-              <p class="text-danger">
-                {% for error in form.form_errors %}
-                {{ error }}<br/>
-                {% endfor %}
-              </p>
-              {% endif %}
-            </div>
+              <div class="card-body">
 
-            <form method="post" class="row g-3 needs-validation" novalidate>
-              {{ form.csrf_token }}
+                <div class="pt-4 pb-2">
+                  <h5 class="card-title text-center pb-0 fs-4">Login to Your Account</h5>
+                  <p class="text-center small">Enter your username & password to login</p>
+                  {% if form.form_errors %}
+                  <p class="text-danger">
+                    {% for error in form.form_errors %}
+                      {{ error }}<br/>
+                    {% endfor %}
+                  </p>
+                  {% endif %}
+                </div>
 
-              <div class="col-12">
-                <label for="yourEmail" class="form-label">Email</label>
-                <input type="email" name="email" class="form-control" id="yourEmail" required value="{{ form.email.data|default('', true) }}">
-                <div class="invalid-feedback">Please enter your email.</div>
-              </div>
+                <form method="post" class="row g-3 needs-validation" novalidate>
+                  {{ form.csrf_token }}
 
-              <div class="col-12">
-                <label for="yourPassword" class="form-label">Password</label>
-                <input type="password" name="password" class="form-control" id="yourPassword" required>
-                <div class="invalid-feedback">Please enter your password!</div>
-              </div>
+                  <div class="col-12">
+                    <label for="yourEmail" class="form-label">Email</label>
+                    <input type="email" name="email" class="form-control" id="yourEmail" required value="{{ form.email.data|default('', true) }}">
+                    <div class="invalid-feedback">Please enter your email.</div>
+                  </div>
 
-              <!-- TODO(@slamora): hidde until it is implemented
+                  <div class="col-12">
+                    <label for="yourPassword" class="form-label">Password</label>
+                    <input type="password" name="password" class="form-control" id="yourPassword" required>
+                    <div class="invalid-feedback">Please enter your password!</div>
+                  </div>
+
+                  <!-- TODO(@slamora): hidde until it is implemented
                   <div class="col-12">
                     <div class="form-check">
                       <input class="form-check-input" type="checkbox" name="remember" {% if form.remember.data %}checked{% endif %} id="rememberMe">
@@ -53,27 +56,31 @@
                     </div>
                   </div>
                   -->
-              <div class="col-12">
-                <button class="btn btn-primary w-100" type="submit">Login</button>
+                  <div class="col-12">
+                    <button class="btn btn-primary w-100" type="submit">Login</button>
+                  </div>
+                  <div class="col-12">
+                    <p class="small mb-0">Don't have account? <a href="#TODO">Create an account</a></p>
+                  </div>
+                </form>
+
               </div>
-              <div class="col-12">
-                <p class="small mb-0">Don't have account? <a href="#TODO">Create an account</a></p>
-              </div>
-            </form>
+            </div>
+
+            <div class="credits">
+              <!-- All the links in the footer should remain intact. -->
+              <!-- You can delete the links only if you purchased the pro version. -->
+              <!-- Licensing information: https://bootstrapmade.com/license/ -->
+              <!-- Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/nice-admin-bootstrap-admin-html-template/ -->
+              Designed by <a href="https://bootstrapmade.com/">BootstrapMade</a>
+            </div>
 
           </div>
         </div>
-
-        <div class="credits">
-          <!-- All the links in the footer should remain intact. -->
-          <!-- You can delete the links only if you purchased the pro version. -->
-          <!-- Licensing information: https://bootstrapmade.com/license/ -->
-          <!-- Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/nice-admin-bootstrap-admin-html-template/ -->
-          Designed by <a href="https://bootstrapmade.com/">BootstrapMade</a>
-        </div>
-
       </div>
-    </div>
+
+    </section>
+
   </div>
 </main><!-- End #main -->
-{% endblock body %}
\ No newline at end of file
+{% endblock body %}