.title {
  color: var(--purple-2);
  font-size: 48px;
  position: relative;
  bottom: -160px;
}

.headings {
  color: var(--blue-2);
  font-size: 24px;
  margin-top: 5rem;
}

.headings li {
  font-size: 16px;
  color: black;
}

.text {
  font-size: 16px;
  color: black;
}

.title,
.bubble > * {
  margin: 2rem auto;
  max-width: calc(806rem / 16);
}

.bubble {
  padding: calc(36rem / 16) 0;
  margin: calc(16rem / 16) 0;
  /* border-radius: 20rem; */
}

/*box-sizing: border box*/
.bubble:nth-child(odd) {
  background-color: #e1eefa;
}

.codey {
  transform: rotate(1.91deg);
  position: relative;
  left: calc(1020rem / 16);
  margin-bottom: -280px;
  z-index: -1;
}

.mailingList {
  margin: 4rem auto;
  max-width: calc(806rem / 16);
  padding: 0 calc(60rem / 16);
}

.mailingList form > * {
  margin: 0.5rem auto;
}

.mailingList form input {
  border-radius: 16px;
  padding: calc(8rem / 16) 0;
}

.mailingList form input[type="text"] {
  /*temporary hard coding of font*/
  font-family: Poppins;
  font-style: normal;
  padding: 0 calc(8rem / 16);
}

.mailingList h2 {
  color: var(--blue-2);
}

@media only screen and (max-width: calc(768rem / 16)) {
  .bubble:nth-child(odd) {
    background-color: #e1eefa;
  }

  .title {
    color: var(--purple-2);
    font-size: 48px;
    display: flex;
    justify-content: center;
  }

  .codey {
    transform: rotate(1.91deg);
    position: relative;
    right: calc(1020rem / 16);
    margin-bottom: -280px;
    z-index: -1;
  }
}