diff --git a/ui/src/app/login/login.scss b/ui/src/app/login/login.scss
index 35e04603f..136c18220 100644
--- a/ui/src/app/login/login.scss
+++ b/ui/src/app/login/login.scss
@@ -53,4 +53,20 @@ md-input-container.md-themeDark-theme > md-icon {
 
 md-input-container.md-themeBlue-theme > md-icon {
   color: white !important;
+}
+
+md-input-container.md-themeDark-theme label, md-input-container.md-themeDark-theme .md-placeholder {
+  color: rgba(255,255,255,0.5)!important;
+}
+
+md-input-container.md-themeDark-theme:not(.md-input-invalid).md-input-has-value label {
+  color: rgba(255,255,255,0.5)!important;
+}
+
+md-input-container.md-themeBlue-theme label, md-input-container.md-themeBlue-theme .md-placeholder {
+  color: rgba(255,255,255,0.5)!important;
+}
+
+md-input-container.md-themeBlue-theme:not(.md-input-invalid).md-input-has-value label {
+  color: rgba(255,255,255,0.5)!important;
 }
\ No newline at end of file
diff --git a/ui/src/app/login/login.tpl.html b/ui/src/app/login/login.tpl.html
index dfd04e2be..df3183a46 100644
--- a/ui/src/app/login/login.tpl.html
+++ b/ui/src/app/login/login.tpl.html
@@ -15,10 +15,7 @@
     limitations under the License.
 
 -->
-<md-content layout="row" layout-align="center center" class="hm-background-{{theme}}" style="
-    padding-left: 32%;
-    padding-top: 2%;
-">
+<md-content layout="row" layout-align="center center" class="hm-background-{{theme}} layout-align-center-center layout-row">
     <md-card style="background: transparent;" flex="initial" class="tb-login-card">
         <md-card-title>
             <md-card-title-text>