:root {
  --bds_blue: rgb(7,62,142);
  --bds_green: rgb(100,174,37);
}

@keyframes fade_in {
  from {opacity: 0;}
  to {opacity: 1;}
}

h1, .login_form {
  animation: fade_in 1s;
}

h1 {
  color: white;
  text-align: center;
  margin-top: 5%;
}

button {
  background-color: rgba(0,0,0,0) !important;
  color: white !important;
  font-size: 120% !important;
  border-radius: 0px !important;
}

button:hover {
  background-color: var(--bds_green) !important;
}

.error {
  color: red;
  text-align: center;
  font-size: 120%;
}

@media (min-width: 1301px) {
  /* desktop */
  .login_form {
    width: 40%;
    margin-left: 30%;
    color: white;
  }
}

@media (max-width: 1300px) {
  /* mobile */
  .login_form {
    width: 80%;
    margin-left: 10%;
    color: white;
  }
}