/*
@theme_gradient: linear-gradient(to right, #009fff, #ec2f4b);
@theme_gradient: linear-gradient(to right, #f5af19, #f12711);
@theme_gradient: linear-gradient(to right, #fdc830, #f37335);
@theme_gradient: linear-gradient(to right, #8a2387, #e94057, #f27121);
@theme_gradient: linear-gradient(to right, #659999, #f4791f);
*/
#login {
  height: 100%;
  background: #eee;
}
#login .header {
  background: linear-gradient(to right, #3e5151, #decba4);
  width: 100%;
  padding: 16px;
  text-align: center;
  color: #fff;
}
#login .header h1 {
  margin-bottom: 0px;
}
#login .fields {
  display: grid;
  justify-items: center;
  padding: 32px;
}
#login .fields input {
  margin-bottom: 32px;
  border: 0px;
  border: 1px solid #444;
  padding: 8px;
  width: 100%;
  font-size: 1.25em;
  background-color: #fff;
}
#login .fields input:focus {
  outline: none;
}
#login .fields button {
  border: 1px solid #666;
  background: #fff;
  color: #444;
  padding: 12px 24px;
  font-size: 1.25em;
  align-self: center;
}
#login .fields button:hover {
  background: #ddd;
}
#login .fields .auth-failed {
  margin-top: 32px;
  color: #a00;
  background: #fff;
  padding: 16px;
  border-radius: 8px;
}