@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap");
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css");
* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
header,
section {
  overflow-x: hidden;
}
:root {
  --bodyFont: "Poppins", sans-serif;
  --dark-blue: #010a4b;
  --ocean-blue: #043ea7;
  --light-blue: #e1f1fd;
  --page-bg: #f3faff;
}
body {
  background-color: var(--page-bg);
  font-family: var(--bodyFont);
}
.login {
  background-color: var(--dark-blue);
  color: white;
  margin: 100px auto;
  width: 600px;
  border: 20px solid var(--dark-blue);
  border-radius: 0.5rem;
}
.login button,
.login input {
  padding: 10px;
  margin: 10px;
  font-size: 18.5px;
  border: 0.5px solid var(--ocean-blue);
}
.login input {
  width: 450px;
  background-color: var(--light-blue);
}
.login button {
  width: 12rem;
  border-radius: 0.5rem;
  height: auto;
  background-color: var(--ocean-blue);
  cursor: pointer;
  margin-top: 1rem;
}
.login img {
  width: 6.5rem;
}
.sign-in-form {
  text-align: center;
}
.userDiv {
  border: 0.05rem solid white;
  width: 92%;
  margin: 1rem 0 1rem;
}
a {
  color: yellow;
}
a:hover {
  color: yellow;
}
small {
  font-size: 0.75rem;
}