html {
  background-image: url("../pics/bg-web3.gif");
  background-repeat: revert;
  color: white;
}

div#scroll-banner {
  overflow: hidden;
  border: 3px double white;
}

div#scroll-text {
  text-align: right;
  white-space: nowrap;

  animation: marquee 8s linear infinite;
}

div#scroll-banner > div#scroll-text > * {
  font-size: 200%;
  margin: 0;
}

@keyframes marquee {
  from {
    transform: translateX(100%);
  }

  to {
    transform: translateX(-140%);
  }
}

@media only screen and (max-width: 850px) {
  /* Mobile display */
  div#scroll-text {
    animation: marquee 9s linear infinite;
  }

  @keyframes marquee {
    from {
      transform: translateX(100%);
    }

    to {
      transform: translateX(-210%);
    }
  }
}

h1 {
  font-size: 250%;
}

.pre {
  font-family: monospace;
}

p,
a {
  font-size: 125%;
}

a {
  color: rgb(147, 107, 255);
}

li > a {
  color: mediumvioletred;
  font-size: 100%;
}

img {
  vertical-align: middle;
}

footer {
  text-align: center;
}