diff --git a/luser/templates/changepassword.html b/luser/templates/changepassword.html
index 756d061..0be8445 100644
--- a/luser/templates/changepassword.html
+++ b/luser/templates/changepassword.html
@@ -1,27 +1,92 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link rel="stylesheet" href="/styles/reset.css">
-    <link rel="stylesheet" href="/styles/style.css">
-    <link rel="stylesheet" href="/styles/account.css">
-    <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon">
-    <title>User password change in LDAP system</title>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <!-- <link rel="stylesheet" href="/styles/reset.css"> -->
+  <!-- <link rel="stylesheet" href="/styles/style.css"> -->
+  <!-- <link rel="stylesheet" href="/styles/account.css"> -->
+  <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon">
+  <title>User password change in LDAP system</title>
+
+  <style>
+    html {
+      background-color: #181715;
+      color: #fff;
+    }
+
+    form {
+      display: flex;
+      flex-direction: column;
+      gap: 16px;
+      max-width: 360px;
+      margin: 50px auto;
+    }
+
+    button {
+      height: 30px;
+      margin-top: 30px;
+      background-color: #262a2b;
+      border: 1px solid #7b7265;
+      color: #a1998d;
+      border-radius: 5px;
+      text-transform: uppercase;
+      letter-spacing: 2px;
+    }
+
+    button:hover {
+      opacity: 0.9;
+      cursor: pointer;
+    }
+
+    button:active {
+      opacity: 0.7;
+    }
+
+    input {
+      height: 25px;
+      padding: 2px 8px;
+      border: 1px solid #303436;
+      border-radius: 5px;
+      color: #7b7265;
+      background-color: #262a2b;
+      outline: none;
+    }
+
+    .container {
+      margin: 50px auto;
+    }
+
+    .form-input {
+      display: flex;
+      flex: 1;
+      justify-content: space-between;
+      align-items: center;
+    }
+  </style>
 </head>
+
 <body>
-   <main class="container">
-        <h1 style="text-align:center;">Change password</h1>
-        <form action="/account/changepassword/" method="POST" style="text-align:center;">
-            <label for="username">username</label>
-            <input type="text" name="username" id="username" placeholder="username" required>
-            <label for="oldpassword">oldpassword</label>
-            <input type="password" name="oldpassword" id="oldpassword" placeholder="oldpassword" required>
-            <label for="newpassword">newpassword</label>
-            <input type="password" name="newpassword" id="newpassword" placeholder="newpassword" required>
-            <br>
-            <button>Change Password</button>
-        </form>
-   </main> 
+  <main class="container">
+    <h1 style="text-align:center;">Change password</h1>
+    <form action="/account/changepassword/" method="POST">
+      <div class="form-input">
+        <label for="username">Username:</label>
+        <input type="text" name="username" id="username" placeholder="Username" required>
+      </div>
+      <div class="form-input">
+        <label for="oldpassword">Old password:</label>
+        <input type="password" name="oldpassword" id="oldpassword" placeholder="Old password" required>
+      </div>
+      <div class="form-input">
+        <label for="newpassword">New password:</label>
+        <input type="password" name="newpassword" id="newpassword" placeholder="New password" required>
+      </div>
+      <br />
+      <button>Change Password</button>
+    </form>
+  </main>
 </body>
+
 </html>
diff --git a/luser/templates/register.html b/luser/templates/register.html
index c9f6e8f..ebe8cde 100644
--- a/luser/templates/register.html
+++ b/luser/templates/register.html
@@ -1,33 +1,121 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link rel="stylesheet" href="/styles/reset.css">
-    <link rel="stylesheet" href="/styles/style.css">
-    <link rel="stylesheet" href="/styles/account.css">
-    <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon">
-    <title>User registration to LDAP system</title>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon">
+  <title>User registration to LDAP system</title>
+
+  <style>
+    html {
+      background-color: #181715;
+      color: #fff;
+    }
+
+    form {
+      display: flex;
+      flex-direction: column;
+      gap: 16px;
+      max-width: 360px;
+      margin: 50px auto;
+    }
+
+    button {
+      height: 30px;
+      margin-top: 30px;
+      background-color: #262a2b;
+      border: 1px solid #7b7265;
+      color: #a1998d;
+      border-radius: 5px;
+      text-transform: uppercase;
+      letter-spacing: 2px;
+    }
+
+    button:hover {
+      opacity: 0.9;
+      cursor: pointer;
+    }
+
+    button:active {
+      opacity: 0.7;
+    }
+
+    input {
+      height: 25px;
+      padding: 2px 8px;
+      border: 1px solid #303436;
+      border-radius: 5px;
+      color: #7b7265;
+      background-color: #262a2b;
+      outline: none;
+    }
+
+    .container {
+      margin: 50px auto;
+    }
+
+    .form-input {
+      display: flex;
+      flex: 1;
+      justify-content: space-between;
+      align-items: center;
+    }
+
+    .captcha {
+      width: 200px;
+      margin: 10px auto;
+      text-align: center;
+    }
+
+    .captcha img {
+      width: 100%;
+      height: auto;
+    }
+
+    .hint {
+      letter-spacing: 2px;
+      text-transform: uppercase;
+      font-size: 10px;
+      text-align: center;
+      font-weight: 500px;
+    }
+
+    .danger {
+      color: #bb3131;
+    }
+  </style>
 </head>
+
 <body>
-   <main class="container">
-        <h1 style="text-align:center;">Register</h1>
-        <form action="/account/register/" method="POST" style="text-align:center;">
-            <label for="username">username</label>
-            <input type="text" name="username" id="username" placeholder="username" required>
-            <label for="password">password</label>
-            <input type="password" name="password" id="password" placeholder="password" required>
-            <label for="confirmpassword">confirmpassword</label>
-            <input type="password" name="confirmpassword" id="confirmpassword" placeholder="confirmpassword" required>
-            <p>password must be at least 8 characters long<p>
-            <br>
-            <img src=/account/static/register/captcha_img/{{ imgsrc }} alt="{{ captchahash }}" style="width:200;margin:auto;">
-            <p>
-            <label for="captcha answer">captcha answer</label>
-            <input type="text" name="captchaa" id="captchaa" placeholder="captcha answer" required>
-            <input type="hidden" name="captchaq" id="captchaq"  value="{{ imgsrc }}">
-            <button>Register</button>
-        </form>
-   </main> 
+  <main class="container">
+    <h1 style="text-align:center;">Register</h1>
+    <form action="/account/register/" method="POST">
+      <div class="form-input">
+        <label for="username">Username:</label>
+        <input type="text" name="username" id="username" placeholder="Username" required>
+      </div>
+      <div class="form-input">
+        <label for="password">Password:</label>
+        <input type="password" name="password" id="password" placeholder="Password" required>
+      </div>
+      <div class="form-input">
+        <label for="confirmpassword">Confirm password:</label>
+        <input type="password" name="confirmpassword" id="confirmpassword" placeholder="Confirm Password" required>
+      </div>
+      <p class="hint danger">Password must be at least 8 characters long </p>
+      <br />
+      <div class="captcha">
+        <img src=/account/static/register/captcha_img/{{ imgsrc }} alt="{{ captchahash }}" />
+      </div>
+      <div class="form-input">
+        <label for="captchaa">Captcha answer:</label>
+        <input type="text" name="captchaa" id="captchaa" placeholder="Captcha answer" required>
+      </div>
+      <input type="hidden" name="captchaq" id="captchaq" value="{{ imgsrc }}">
+      <button>Register</button>
+    </form>
+  </main>
 </body>
+
 </html>
diff --git a/luser/templates/unregister.html b/luser/templates/unregister.html
index 07dce7a..c0ccd50 100644
--- a/luser/templates/unregister.html
+++ b/luser/templates/unregister.html
@@ -1,25 +1,88 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link rel="stylesheet" href="/styles/reset.css">
-    <link rel="stylesheet" href="/styles/style.css">
-    <link rel="stylesheet" href="/styles/account.css">
-    <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon">
-    <title>User unregistration to LDAP system</title>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <!-- <link rel="stylesheet" href="/styles/reset.css"> -->
+  <!-- <link rel="stylesheet" href="/styles/style.css"> -->
+  <!-- <link rel="stylesheet" href="/styles/account.css"> -->
+  <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon">
+  <title>User unregistration to LDAP system</title>
+
+  <style>
+    html {
+      background-color: #181715;
+      color: #fff;
+    }
+
+    form {
+      display: flex;
+      flex-direction: column;
+      gap: 16px;
+      max-width: 360px;
+      margin: 50px auto;
+    }
+
+    button {
+      height: 30px;
+      margin-top: 30px;
+      background-color: #262a2b;
+      border: 1px solid #7b7265;
+      color: #a1998d;
+      border-radius: 5px;
+      text-transform: uppercase;
+      letter-spacing: 2px;
+    }
+
+    button:hover {
+      opacity: 0.9;
+      cursor: pointer;
+    }
+
+    button:active {
+      opacity: 0.7;
+    }
+
+    input {
+      height: 25px;
+      padding: 2px 8px;
+      border: 1px solid #303436;
+      border-radius: 5px;
+      color: #7b7265;
+      background-color: #262a2b;
+      outline: none;
+    }
+
+    .container {
+      margin: 50px auto;
+    }
+
+    .form-input {
+      display: flex;
+      flex: 1;
+      justify-content: space-between;
+      align-items: center;
+    }
+  </style>
 </head>
+
 <body>
-   <main class="container">
-        <h1 style="text-align:center;">Unregister</h1>
-        <form action="/account/unregister/" method="POST" style="text-align:center;">
-            <label for="username">username</label>
-            <input type="text" name="username" id="username" placeholder="username" required>
-            <label for="password">password</label>
-            <input type="password" name="password" id="password" placeholder="password" required>
-            <br>
-            <button>Unregister</button>
-        </form>
-   </main> 
+  <main class="container">
+    <h1 style="text-align:center;">Unregister</h1>
+    <form action="/account/unregister/" method="POST">
+      <div class="form-input">
+        <label for="username">Username:</label>
+        <input type="text" name="username" id="username" placeholder="Username" required>
+      </div>
+      <div class="form-input">
+        <label for="password">Password:</label>
+        <input type="password" name="password" id="password" placeholder="Password" required>
+      </div>
+      <br>
+      <button>Unregister</button>
+    </form>
+  </main>
 </body>
+
 </html>
