body {
    background-color: #0f1116;
    color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin: 20px;
}

.error {
  background-color: #730000;
  color: #ffffff;
  padding: 0.4rem;
  border-radius: 0.3rem;
  margin-bottom: 10px;
}

#login {
  width: 360px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 50px;
  background-color: #1e222d;
  color: #ffffff;
  padding: 20px;
  border-radius: 10px;
}

#login>h4 {
  margin: 0px 0px 20px 0px;
}

#login input {
  border: none;
  border-bottom: 1px white solid;
  background-color: transparent;
  color: #ffffff;
  transition: border-bottom-color 0.2s ease;
  outline: none;
  display: block;
  padding: 0px 0px 5px 0px;
  width: 100%;
  font-size: medium;
}

#login input:focus {
  border-bottom-color: #6d85c6;
}

#login button {
  cursor: pointer;
  font-weight: 600;
  line-height: 1.2;
  border-radius: 99rem;
  border-width: 2px;
  padding: 0.8rem 3rem;
  background-color: transparent;
  color: #ffffff;
  transition: border-bottom-color 0.2s ease;
  display: block;
  margin: 20px auto 0px auto;
  width: 50%;
}

#login button:hover {
  color: #999;
}

#login button:active {
  color: #444;
}