diff --git a/dist/treebird.css b/dist/treebird.css
index 11beeab..5b74488 100644
--- a/dist/treebird.css
+++ b/dist/treebird.css
@@ -13,6 +13,18 @@
     --account-overlay-gradient-bottom: #dadada;
 }
 
+
+*
+{
+    transition: .1s box-shadow;
+}
+
+*:focus
+{
+    outline: 1px solid #aa0000;
+    box-shadow: 0px 0px 6px #aa00006f;
+}
+
 *
 {
     margin: 0;
@@ -119,7 +131,7 @@ table.ui-table td
 
 #navbar
 {
-    background: linear-gradient(#fbfbfb 40%, #efefef 50%, #e4e4e9);
+    background: linear-gradient(#fbfbfb 40%, #f5f5f5 50%, #efefef);
     width: 1000px;
     border-bottom: 2px solid #bfbfc4;
     z-index: 999;
@@ -159,6 +171,26 @@ table.ui-table td
     margin: 6px 0px 6px 18px;
 }
 
+#navbar a,
+#navbar a:focus
+{
+    box-shadow: 0px 0px 0px #00000000 !important;
+    outline: 0 !important;
+}
+
+#navbar a img
+{
+    transition: .4s transform, .4s filter;
+}
+
+#navbar a:focus img
+{
+    box-shadow: 0px 0px rgba(0, 0, 0, 0.2);
+    box-shadow: 0 !important;
+    transform: rotateZ(360deg);
+    filter: drop-shadow(0px 0px 3px #aa00006f);
+}
+
 #navbar span.info
 {
     vertical-align: middle;
@@ -273,7 +305,20 @@ table.ui-table td
 
 #searchbox
 {
+    padding-top: unset;
+    padding-bottom: unset;
+    height: 26px;
+    border-right: unset;
     padding-left: 27px;
+    transition: width .1s ease;
+    width: 180px;
+}
+
+#searchbox:focus
+{
+    box-shadow: 0;
+    outline: 0;
+    width: 300px;
 }
 
 .results-header
@@ -338,6 +383,14 @@ table.ui-table td
     font-weight: bold;
 }
 
+input[type=text],
+input[type=url],
+input[type=email],
+input[type=password]
+{
+    padding: 2px;
+    border: 1px solid #d3d3d3;
+}
 
 .menu.menu-compact .btn-menu,
 .status-compact .menu-container .menu .btn-menu
@@ -1352,6 +1405,22 @@ input[type=checkbox].hidden:not(:checked) + .sidebar-submenu
     border-bottom-right-radius: 5px;
 }
 
+.text-gap-hairline
+{
+    display: inline-block;
+    width: 64px;
+    text-align: center;
+    height: 1px;
+    background-color: #d3d3d3;
+    margin: 2px;
+}
+
+.text-gap-hairline + h6
+{
+    display: inline;
+    font-variant: small-caps;
+}
+
 /*************************
  *     Config            *
  ************************/
@@ -1986,6 +2055,14 @@ input[type=radio].hidden:not(:checked) + .emoji-picker-emojos
     display: block;
 }
 
+.form-group label
+{
+    display: inline-block;
+    min-width: 70px;
+    font-size: 0.9rem;
+    text-align: middle;
+}
+
 /* Simple page layout */
 .simple-page
 {
diff --git a/perl/login.pm b/perl/login.pm
index dbdfcfd..315a684 100644
--- a/perl/login.pm
+++ b/perl/login.pm
@@ -6,6 +6,7 @@ use Exporter 'import';
 
 our @EXPORT = qw( content_login );
 
+use l10n 'lang';
 use template_helpers 'to_template';
 
 sub content_login
@@ -14,6 +15,7 @@ sub content_login
 
     my %vars = (
         error => $error,
+        lang => \&lang,
         );
     
     to_template(\%vars, \$data->{'login.tt'});
diff --git a/templates/login.tt b/templates/login.tt
index ee04092..6b0cadb 100644
--- a/templates/login.tt
+++ b/templates/login.tt
@@ -1,29 +1,33 @@
 <div class="simple-page">
-    <h1>{{%s:login_header}}</h1>
-    
-    {{%s:error}}
+    <h1>[% lang('LOGIN') %]</h1>
+
+    [% IF error %]
+        <span class="e-error error-pad">
+            $error
+        </span>
+    [% END %]
 
     <form action="/login" method="post">
         <div class="form-group">
-            <label for="login-username">{{%s:username}}: </label>
+            <label for="login-username">[% lang('LOGIN') %]: </label>
             <input type="text" id="login-username" name="username">
         </div>
         <div class="form-group">
-            <label for="login-password">{{%s:password}}: </label>
+            <label for="login-password">[% lang('PASSWORD') %]: </label>
             <input type="password" id="login-password" name="password"><br>
         </div>
         <div class="form-group">
-            <input class="btn" type="submit" value="{{%s:login_submit}}">
+            <input class="btn" type="submit" value="[% lang('LOGIN_BTN') %]">
         </div>
     </form>
 
-    <h6>{{%s:instance_text}}</h6>
+    <div class="text-gap-hairline"></div><h6> OR </h6><div class="text-gap-hairline"></div>
 
     <form action="/login/oauth" method="post">
         <div class="form-group">
             <label for="instance-url">{{%s:instance_url}}: </label>
             <input type="url" id="instance-url" name="instance">
-            <input class="btn" type="submit" value="{{%s:instance_submit}}">
+            <input class="btn btn-single" type="submit" value="{{%s:instance_submit}}">
         </div>
     </form>
 </div>