.form-popup {
  display: none;
  position: fixed;
  top: 0;
  left: 0px;
  width: 100vw;
  height: 100vh;
  z-index: 9;
  background-color: #ffffff00;
}

/* Add styles to the form container */
.form-container {
  width: 60vw;
  position: absolute;
  padding: 50px;
  padding-top: 100px;
  padding-bottom: 100px;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #ffffff;
  box-shadow: 0px 0.5vw 1vw 0px rgba(0,0,0,0.2);
}

/* Full-width input fields */
.form-container input[type=email] {
  width: 96%;
  padding: 2%;
  padding-top: 15px;
  padding-bottom: 15px;
  margin-top: 10px;
  margin-bottom: 10px;
  border: none;
  background: #f1f1f1;
}

/* When the inputs get focus, do something */
.form-container input[type=email]:focus {
  background-color: #ddd;
  outline: none;
}

.cancel {
  background-color: #ccc;
}
.cancel:hover {
  background-color: #777;
}