.body {
  grid-column-gap: 5vh;
  grid-row-gap: 5vh;
  color: #fdfefe;
  background-image: linear-gradient(135deg, #5862b2, #56a5cb);
  flex-flow: column;
  justify-content: center;
  align-items: center;
  font-family: Outfit Wght, Arial, sans-serif;
  font-weight: 300;
  display: flex;
}

.text-block {
  text-align: center;
  font-size: 10vh;
  font-weight: 700;
  line-height: 12vh;
}

.text-block-copy {
  text-align: center;
  width: 75vw;
  font-size: 5vh;
  font-weight: 400;
  line-height: 6vh;
}

@media screen and (max-width: 991px) {
  .body {
    grid-column-gap: 5vw;
    grid-row-gap: 5vw;
  }

  .text-block {
    font-size: 15vw;
    line-height: 18vw;
  }

  .text-block-copy {
    width: 90vw;
    font-size: 5vw;
    line-height: 6vw;
  }
}

@media screen and (max-width: 767px) {
  .body {
    grid-column-gap: 5vh;
    grid-row-gap: 5vh;
  }

  .text-block {
    font-size: 10vh;
    line-height: 12vh;
  }

  .text-block-copy {
    font-size: 5vh;
    line-height: 6vh;
  }
}

@media screen and (max-width: 479px) {
  .body {
    grid-column-gap: 5vw;
    grid-row-gap: 5vw;
  }

  .text-block {
    font-size: 15vw;
    line-height: 18vw;
  }

  .text-block-copy {
    font-size: 5vw;
    line-height: 6vw;
  }
}


@font-face {
  font-family: 'Outfit Wght';
  src: url('../fonts/Outfitwght.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}