/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

 .EmailWall { position: relative; }
 .EmailWall.EmailWall--open {
     max-height: 100vh;
     overflow: hidden;
 }

 .EmailWall .EmailWall__form { 
     display: none;
     max-width: 400px; 
     width: 70vw; 
     padding: 15px; 
     position: absolute; 
     top: 40px; 
     left: 50%; 
     transform: translateX(-50%);
     background-color: #fff;
     z-index: 2900;
     font-size: 1.2em;
     border-radius: 4px;
 }

 .EmailWall .EmailWall__input {
     display: flex;
     margin: 20px 0;
     align-items: center;
     justify-content: space-between;
 }

.EmailWall .EmailWall__input input {
    flex-grow: 1;
    max-width: 70%;
}

.EmailWall .EmailWall__input label {
    margin-right: 15px;
    font-weight: normal;
}

 .EmailWall .EmailWall__form button {
     border: none;
     font-size: 15px;
     background-color: #1e73be;
     color: white;
     padding: 10px;
     min-width: 200px;
 }

 .EmailWall::after {
     content: '';
     position: absolute;
     display: none;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     z-index: 2899;
     background-color: rgba(0,0,0,.7);
     -webkit-backdrop-filter: blur(10px);
     backdrop-filter: blur(10px);
     border-radius: 4px;
 }

 .EmailWall__error {
    display: none;
    border: solid 1px rgba(255, 0, 0, .5);
    background-color: rgba(255, 0, 0, .3);
    padding: 15px;
    margin-bottom: 20px;
    border-radius: 4px;
}
 
 .EmailWall--open .EmailWall__form,
 .EmailWall--open::after,
 .EmailWall--error-validation .EmailWall__error--validation,
 .EmailWall--error-server .EmailWall__error--server {
    display: block;
 }