@media screen and (max-width: 1024px) {
  body {
    padding: 25px 0px 0px;
    background-image: url("../assets/images/pattern-lines.svg"),
      url("../assets/images/pattern-squiggly-line-bottom.svg"),
      url("../assets/images/pattern-squiggly-line-top.svg"),
      url("../assets/images/pattern-circle.svg"),
      url("../assets/images/pattern-circle.svg"),
      url("../assets/images/background-tablet.png");
    background-position: top center, bottom left, top right, 120% center,
      1% -10%, center center;
    background-repeat: no-repeat;
    background-size: cover, contain, 300px, 150px, 150px, cover;
  }
}

@media screen and (max-width: 500px) {
  body {
    background-image: url("../assets/images/pattern-lines.svg"),
      url("../assets/images/pattern-squiggly-line-bottom.svg"),
      url("../assets/images/pattern-squiggly-line-top.svg"),
      url("../assets/images/pattern-circle.svg"),
      url("../assets/images/pattern-circle.svg"),
      url("../assets/images/background-mobile.png");
    background-position: top center, bottom left, top right, 120% center,
      1% -10%, center center;
    background-repeat: no-repeat;
    background-size: cover, contain, 150px, 150px, 150px, cover;
  }

  main {
    margin: 0px 15px;
  }

  #message-info {
    font-size: 0.65em;
  }

  footer {
    flex-direction: column;
  }
}