/* Mobile-first approach */
@media only screen and (max-width: 768px) {
  body {
    background-color: #333; /* fallback color for mobile */
    background-image: none;
  }
}

/* Desktop-friendly styles */
@media only screen and (min-width: 769px) {
  body {
    background-image: linear-gradient(
      45deg,
      #333 0%,
      #444 25%,
      #333 51%,
      #444 75%,
      #333 100%
    );
  }
}

table {
  border-radius: 11px;
  border: thick double #666363;
  background-color: #707070;
  width: 80%; /* adjust this value to fit your content */
  margin: 20px auto; /* center the table on mobile devices */
}
h1 {
  font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans",
    "DejaVu Sans", Verdana, sans-serif;
  text-align: center;
  color: #434343;
  text-shadow: 0 0 5px #8087f0, 0 0 10px #e8e8e8, 0 0 15px #272751,
    0 0 20px #46494a, 0 0 30px #121c24, 0 0 40px #575757, 0 0 55px #03101a,
    0 0 75px #0b0c0d;
}
h2 {
  font-family: Baskerville, "Palatino Linotype", Palatino,
    "Century Schoolbook L", "Times New Roman", serif;
  text-align: center;
  color: #212121;
  text-shadow: 0 0 5px #8087f0, 0 0 10px #e8e8e8, 0 0 15px #272751,
    0 0 20px #46494a, 0 0 30px #121c24, 0 0 40px #575757, 0 0 55px #03101a,
    0 0 75px #0b0c0d;
}
h3 {
  font-family: Baskerville, "Palatino Linotype", Palatino,
    "Century Schoolbook L", "Times New Roman", serif;
  text-align: center;
}

th {
  font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans",
    "DejaVu Sans", Verdana, sans-serif;
  text-shadow: 3px 3px 6px rgba(54, 13, 200, 0.49);
  padding-left: 50px;
  padding-right: 50px;
}

p {
  text-align: center;
}