@media (0px <= width <= 150px) {
  button {
      padding: 0.5em 0em;
  }
  select {
      padding: 0.45em 0;
  }
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p {
      word-break: break-all;
  }
}

@media (0px <= width <= 50px) {
  body {
      font-size: 0.15em;
  }
}
@media (51px <= width <= 100px) {
  body {
      font-size: 0.15em;
  }
}
@media (101px <= width <= 150px) {
  body {
      font-size: 0.15em;
  }
}
@media (151px <= width <= 160px) {
  body {
      font-size: 0.2em;
  }
}
@media (161px <= width <= 180px) {
  body {
      font-size: 0.25em;
  }
}
@media (181px <= width <= 200px) {
  body {
      font-size: 0.3em;
  }
}
@media (201px <= width <= 250px) {
  body {
      font-size: 0.35em;
  }
}
@media (251px <= width <= 300px) {
  body {
      font-size: 0.4em;
  }
}
@media (301px <= width <= 350px) {
  body {
      font-size: 0.5em;
  }
}
@media (351px <= width <= 400px) {
  body {
      font-size: 0.6em;
  }
}
@media (401px <= width <= 450px) {
  body {
      font-size: 0.7em;
  }
}
@media (451px <= width <= 500px) {
  body {
      font-size: 0.8em;
  }
}
@media (501px <= width <= 540px) {
  body {
      font-size: 0.86em;
  }
}
@media (541px <= width <= 650px) {
  body {
      font-size: 0.9em;
  }
}