body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  margin: 0;
  background: radial-gradient(
      1200px 800px at 10% 10%,
      rgba(244, 200, 180, 0.55),
      rgba(230, 210, 235, 0.45),
      rgba(205, 220, 245, 0.35),
      rgba(215, 235, 225, 0.3),
      rgba(235, 240, 220, 0.25),
      rgba(255, 255, 255, 0) 70%
    ),
    linear-gradient(135deg, #f4c8b4 0%, #d7c7e6 25%, #c9d6f2 50%, #d7ebe1 75%, #eef1d9 100%);
  background-repeat: no-repeat;
  background-attachment: fixed;
  padding: 5rem;
}

.outer-container {
  display: flex;
  flex-direction: column;
  max-width: 600px;
  align-items: center;
  justify-content: center;
}

img {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 50%;
  margin-top: 10%;
  margin-bottom: 10%;
}

.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  justify-content: center;
  background: #fff;
  padding: 1rem;
  border-radius: 8px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
}

h1 {
  margin-top: 0;
}

input,
button {
  padding: 0.75rem;
  margin: 0.75rem;
  font-size: 1rem;
  width: 60%;
}

button {
  width: 100%;
  background: #d92d20;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  margin: 0.75rem;
  padding: 0.75rem;
  font-size: 1rem;
  margin-top: 2rem;
}

button:hover {
  background: #b42318;
}

small {
  display: block;
  margin-top: 1rem;
  color: #555;
}

h2 {
  display: flex;
  flex-direction: row;
  justify-content: center;
}

.button-container {
  display: flex;
  width: 100%;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

form {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
}