:root {
  --blue: #0572C5;
  --negro: #090e1ff8;
  --sobre: #107eea;
  --naranja: rgb(255, 145, 0);
  --suave: #7ca3f177;
  --verde: rgba(47, 155, 25, 0.842);
  --verdesobre: rgb(24, 207, 0);
}


.login {
  min-height: 100vh;
}

.bg-image {
  background-image: url("../images/urba2.jpg");
  background-size: cover;
  background-position: center;
}

.login-heading {
  font-weight: 500;
}

.btn-login {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 1px;
  padding: 12px 38px;
  border-radius: 4px;
  border: 1px solid;
  border-color: var(--blue);
  color: #fff;
  background-color: var(--blue);
  align-items: center;
  box-shadow: none;
  outline: none;
}

.btn-login:hover {
  background-color: var(--sobre);
  border-color: var(--sobre);
  box-shadow: none;
}

.btn-registro{
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-size: 14px;
  text-decoration:none;
  letter-spacing: 1px;
  padding: 8px 30px;
  border-radius: 4px;
  border: 1px solid;
  border-color: var(--verde);
  color: #fff;
  background-color: var(--verde);
  align-items: center;
  box-shadow: none;
  outline: none;
}
.btn-registro:hover{
  background-color:var(--verdesobre);
  border-color: var(--verde);
  color: #fff;
}

.logo{
  width: 200px;
  height: 150px;
}

.bg-blue {
  color: rgb(0, 0, 0);
  background-color: var(--suave);
  font-weight: 400;
}

.contra{
  color: var(--blue);
}

.contra:hover{
  color: var(--sobre)
}