@media (min-width: 2000px) {
  header {
    width: 1800px;
  }

  main {
    width: 1000px;
  }

  footer {
    width: 1100px;
  }
}

@media (max-width: 1500px) {
  header > nav {
    width: 80%;
  }

  main {
    width: 80%;
  }

  footer {
    width: 80%;
  }

  .tabAbout > .blurContainer > .colorBlur {
    left: 50%;
  }

  .tagLine > img {
    width: 350px;
  }
  
  .tagLine > img:nth-child(5) {
    left: -20%;
  }
  
  .tagLine > img:last-child {
    right: -20%;
  }
}

@media (max-width: 1100px) {
  header > nav {
    width: 90%;
  }

  main {
    width: 90%;
  }

  footer {
    width: 90%;
  }

  .tabAbout > .blurContainer > .colorBlur {
    left: 40%;
  }

  .colorBlur {
    width: 40vmin;
    height: 40vmin;
  }

  .users > .blurContainer > .colorBlur {
    left: 20%;
  }

  .tagLine .colorBlur:last-child {
    width: 500px;
    height: 300px;
  }

  .tagLine > img:nth-child(5) {
    left: -20%;
    position: relative;
    transform: rotate(-10deg);
  }

  .tagLine > img:last-child {
    right: 10%;
    position: absolute;
    top: 550px;
    transform: rotate(10deg);
  }

}

@media (max-width: 850px) {
  .tagLine > img:nth-child(5) {
    left: -12%;
    position: relative;
    transform: rotate(-10deg);
  }

  .tagLine > img:last-child {
    right: 8%;
    position: absolute;
    top: 550px;
    transform: rotate(10deg);
  }
}

@media (min-width: 651px) {
  .burgerMenu {
    display: none;
  }

  .mainNavigation {
    max-height: 500px !important;
    position: static !important;
  }
}

@media (max-width: 650px) {
  .burgerMenu {
    display: flex;
  }

  .mainNavigation {
    max-height: 0;
    overflow: hidden;
    position: absolute;
    margin: auto;
    flex-direction: column;
  }

  header > nav {
    flex-wrap: wrap;
    gap: 20px;
    width: 50%;
  }

  header {
    position: relative;
  }

  .tagLine > img {
    width: 80vmin;
  }

  .tagLine > img:nth-child(1n + 5) {
    left: 0;
    right: 0;
    top: 0;
    position: relative;
  }
}

@media (max-width: 550px) {
  .blurContainer {
    display: none;
  }

  .colorBlur {
    display: none;
  }

  .tagLine {
    font-size: 2em;
  }

  .getStarted {
    font-size: 0.8em;
  }

  .users {
    font-size: 0.9em;
  }

  .tabAbout {
    font-size: 0.9em;
  }

  .plansComparison {
    font-size: 0.8em;
  }

  footer {
    font-size: 0.9em;
    flex-direction: column;
  }

  header > nav {
    width: 60%;
  }

  .plansComparison > section > section {
    width: 90%;
  }
}

@media (max-width: 400px) {
  header > nav {
    width: 80%;
  }

  footer > nav {
    flex-direction: column;
  }

  main > section {
    box-sizing: border-box;
  }
}
