.page-container{
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url(/images/login-bg.png);
  background-size: cover;
}
.login-container, .reset-container{
  background-color: rgba(22, 60, 87, 0.8);
  padding: 3.5rem;
  border-radius: 15px;
  width: 700px;
}
.reset-container{
  display: none;
}
.login-title{
  font-size: 25px;
  font-weight: 800;
  color: #fff;
  margin-bottom: max(20px, 3rem);
  text-align: center;
  font-family: sans-serif;
} 
.form-control{
  min-height: 50px;
  font-size: 16px;
}
.form-group + .form-group{
  margin-top: max(16px, 2rem);
}
.input-group{
  margin-top: max(16px, 2rem);
}
#sendCodeBtn{
  color: #fff;
  border-color: var(--bs-danger);
  font-size: 16px;
  cursor: pointer;
}
.forget-password, .toLogin{
  margin: 10px 0 0 10px;
  color: #fff;
  text-decoration: underline;
  cursor: pointer;
}

.btn{
  margin-top: 35px;
  padding: 10px;
  width: 100%;
  font-size: 16px;
}

@media screen and (max-width:768px){
  .login-container, .reset-container{
    width: 94%;
  }
}