.login-container {
  min-height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgb(229, 214, 231);
}

.login-container {
  background: url('https://static.vecteezy.com/system/resources/previews/058/170/767/large_2x/smooth-blue-and-purple-smoke-waves-flowing-gracefully-on-a-transparent-background-blue-purple-smooth-smoke-wave-isolated-on-transparent-background-free-png.png') center/cover no-repeat;
  color: white
}

.login-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
  text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
}

.login-title {
  color: white;
  font-size: 5rem;
  margin-bottom: 20px;
  font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif
}

.login-form {
  width: 300px;
  height: 300px;
  padding: 16px;
  border: 1px solid #ffffff;
  background: #ecdcec;
  display: flex;
  flex-direction: column;
  gap: 8px;
  box-shadow: 33px 19px 21px -5px rgba(0, 0, 0, 0.15);
border-radius: 12px;
}

.login-form h2 {
  margin: 0 0 8px 0;
  font-size: 22px;
}

.login-form h5 {
  margin: 0 04% 0;
}

.login-input {
  width: 100%;
  padding: 8px;
  border: 1px solid #777;
  background: #fff;
  font-size: 14px;
  
}

.login-button {
  padding: 8px;
  border: 1px solid #ecdcec;
  background: #cebcd6;
  color: #111;
  cursor: pointer;
}

.login-switch {
  padding: 6px;
  border: 1px solid #ecdcec;
  background: #ecdcec;
  color: #111;
  cursor: pointer;
  font-size: 13px;
  text-decoration-line: underline;
  text-decoration-style: solid;
}


.login-error {
  color: #b00020;
  font-size: 13px;
  margin: 0;
}
