body {
  margin: 58px auto;
  color: #707073;
  background: #cecece url("../img/background.jpg") no-repeat 50% 0;
}

header h1 {
  width: 457px;
  height: 91px;
  margin: 0 auto;
  white-space: nowrap;
  text-indent: -9999px;
  background: url("../img/logostyled.png") no-repeat 0 0;
}

@media (min-resolution: 1.5dppx),
  (min-resolution: 144dpi),
  (-webkit-min-device-pixel-ratio: 1.5) {
  header h1 {
    background-image: url("../img/logostyled@2x.png");
    background-size: 457px 91px;
  }
}

footer {
  margin-top: 40px;
  text-align: center;
}

.icon-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #3f3f3f;
  text-decoration: none;
  transition:
    transform 160ms ease,
    color 160ms ease;
}

.icon-link:hover {
  transform: translateY(-1px);
  color: #1f1f1f;
}

.icon-link:focus-visible {
  outline: 2px solid #3b6ea5;
  outline-offset: 3px;
}

.icon-link .icon {
  width: 40px;
  height: 40px;
  display: block;
  filter: drop-shadow(0 6px 12px rgba(0, 0, 0, 0.12));
}

.eof {
  margin: 28px auto 44px;
  text-align: center;
  font-family: "Courier New", Courier, monospace;
  font-size: 13px;
  letter-spacing: 3px;
  color: #4f4f4f;
  text-transform: uppercase;
  opacity: 0.95;
}