.news-letter
{
  display: flex;
  flex-direction: row;
  align-items: center;
  text-align: center;

  background-color: white;
  width:100%;
  border: 1px solid #8A0085;
  overflow: hidden;
  margin: 8px 0px;
  font-size: 12px;
  height: 25px;
}

.news-letter button {
  font-family: 'helvetican-vp';

}

.news-letter button:disabled {
  background-color: gray;
  cursor: not-allowed;
}

.news-letter-container{
    width: 100%;
    background-image: url('../images/newsletter-banner.jpeg');
    padding-bottom: 220px;
}

.news-letter-input
{
  font-size: 12px;
  padding: 10px;
  padding-left: 12px;
  width: 100%;
  filter: none;
  outline: none;
  border: none;
  color: var(--dark-grey-font)
}

.news-letter-button
{
  font-size: 12px;
  width: 100%;
  filter: none;
  outline: none;
  border: none;
  background-color: #8A0085;
  height: 40px;
  letter-spacing: 1.1px;
  color: white;
}
.error 
{
    background-color: rgba(255, 0, 0, 0.819);
}


.news-letter-button:hover
{
  background-color: rgba(166, 59, 180, 0.356);
  cursor: pointer;
}

.news-letter-input input {
  color:var(--dark-grey-font);
}

.news-letter-header{
    font-size:16px;
}

.news-letter-card{
    background-color: white;
    width: 330px;
    padding: 12px;
    left: 0; 
    right: 0; 
    margin-left: auto; 
    margin-right: auto; 
    margin-top: -35px;
    position: absolute;
}

.purple-bar{
    position:relative;
    width: 100%;
    height: 50px;
    background: linear-gradient(0.25turn, #8A0085, #c902c2);
}