body{ font:20px Arial, Helvetica, sans-serif; width:100%; margin: 0 auto; display: flex; justify-content: center; align-items: center; background: url(images/mercury-1.jpg) no-repeat center; background-size: cover; height: 100vh; }
a { color: #000}
h1 {font-size:2em; font-weight:normal }
h2 {font-size:1.5em; font-weight:normal }
.banner { width: 100%; text-align:center; background:
    linear-gradient(
      to bottom,
      rgba(0,0,0,0.25) 0%,
      rgba(0,0,0,0.10) 18%,
      rgba(0,0,0,0.00) 40%
    ),
    linear-gradient(
      to top,
      rgba(0,0,0,0.30) 0%,
      rgba(0,0,0,0.12) 22%,
      rgba(0,0,0,0.00) 45%
    ),
    linear-gradient(
      to right,
      rgba(225,225,225,0.75) 0%,
      rgba(245,245,245,0.75) 30%,
      rgba(255,255,255,0.75) 50%,
      rgba(245,245,245,0.75) 70%,
      rgba(215,215,215,0.75) 100%
    );
}
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

@media screen and (max-width: 400px) {
h1 {font-size:2em; }
h2 {font-size:1.75em; }
.site-title img { max-width: 250px}
}