#form-page{
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  position: absolute;
  align-items: center;
}
#cardsform{
  position: relative;
  top: 6%;
  display: flex;
  flex-direction: column;
  width: 100%;
  justify-content: center;
  align-items: center;
}
#emailcardsform{
  position: relative;
  top: 20%;
  display: flex;
  flex-direction: column;
  width: 100%;
  justify-content: center;
  align-items: center;
}
label{
    color: white;
    width: 70vw;
    font-family: Poppins-Medium;
    font-size: 2vw;
    margin-bottom: 0.5vw;
}
input{
    width: 66vw;
    height: 4vw;
    font-family: Poppins-Medium;
    color: black;
    font-size: 3vw;
    padding-left: 2vw;
    padding-right: 2vw;
    margin-bottom: 3vw;
}
.zip-input{
    width: 22vw;
    align-self: flex-start;
    margin-left: 15vw;
}

.checkbox-wrapper {
    display: flex;
    align-items: center;
    width: 70%;
    text-align: left;
  }
  
  #consentCheckbox {
    width: 3vw;
    height: 2.8vw;
    margin-top: -5%;
    /* margin-left: -10%; */
    appearance: none; /* Hide the default checkbox */
    position: relative;
    border-radius: 2px;
    border: 2px solid #FFFFFF; /* Set the border color to yellow */
    outline: none;
    background-color: #FFFFFF; /* Set the background color to yellow */
    cursor: pointer;
    padding: 0;
  }
  
  #consentCheckbox:checked {
    background-color: #FFFFFF; /* Set the background color to yellow when checked */
  }
  
  #consentCheckbox:checked::after {
    content: '×'; /* Cross mark */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(3);
    font-size: 2vw; /* Adjust font size as needed */
    color: #000000; /* Set the color of the cross */
    transition: transform 0.3s ease;
  }
  
  

  
  
  .checkbox-wrapper label {
    /* display: flex; */
    align-items: center;
    font-family: Poppins-Regular;
    font-size: 1.55vw;
    font-weight: 100;
    color: #ffffff;
    text-align: left;
    
  }
  
  .checkbox-wrapper input[type="checkbox"] {
    margin-right: 3%;
    background-color: #FFF;
  }
  
  .checkbox-wrapper input[type="checkbox"]:checked {
    background-color: #FFF;
  }

#submit-button{
  position: relative;
  /* margin-top: 10vw; */
  left: 50%;
  transform: translateX(-50%);
  padding: 0;
  background-color: white;
  width: 39vw;
  height: 8vw;
  border-radius: 25vw;
  font-family: Teko-Bold;
  color: black;
  font-size: 4.5vw;
  padding-bottom: 0vw;
  align-self: start;
  transition: opacity 0.3s ease-in;
  line-height: 1.9;
}
#email-form-page{
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#loading-email-form-page{
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#thanks-email-form-page{
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}