BOXIT-47: style LoginScreen

deploy/localDev/boxit/keycloak/theme/login/resources/css/boxit.css

@@ -1,12 +1,22 @@
 .login-pf body {
-    background-image: url('../img/darkGray.jpg');
+    background-image: url('../assets/darkGray.jpg');
     background-repeat: repeat;
     background-size: auto;
 }
 
+@font-face {
+    font-family: "Remachine";
+    src: url("../assets/Remachine.ttf");
+}
+
+.login-pf-page {
+    padding-top: 0 !important;
+}
+
 .card-pf {
     box-shadow: 10px 10px 12px #353535;
     border-radius: 0.25rem !important;
+    border: 0;
 }
 
 #kc-header {
@@ -23,23 +33,50 @@
     text-align: left;
     padding: 8px 0px 8px 16px;
     line-height: 40px;
-    font-size: 20px;
     text-transform: none;
-    letter-spacing: 0px;
-    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
-    font-weight: 400;
-}
 
-.btn-block {
-    width: 100px !important;
-    display: inline !important;
+    font-size: 2.5rem;
+    flex-grow: 0;
+    font-family: Remachine;
 }
 
 #kc-form-buttons {
-    text-align: center;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.pf-c-button.pf-m-block {
+    width: unset;
+    min-width: 100px;
+}
+
+.pf-c-button.pf-m-primary {
+    background-color: #ff9800;
+    border-radius: 0.25rem;
 }
 
 #kc-page-title {
     font-size: 20px;
     font-weight: bolder;
 }
+
+.pf-c-form-control {
+    border-color: #DEDEDE;
+}
+
+.pf-c-form-control:hover, .pf-c-form-control:focus {
+    border-bottom-color: #ff9800;
+    border-bottom-width: 1px;
+}
+
+.pf-c-form-control.pf-m-focus, .pf-c-form-control:focus {
+    border-bottom-width: 1px;
+}
+
+input:focus,
+select:focus,
+textarea:focus,
+button:focus {
+    outline: none;
+}