html.root {
  animation-name: toGrayscale;
  animation-delay: 2s;
  animation-duration: 28s;
  animation-fill-mode: forwards;
}

body {
  font-family: sans-serif;
  font-size: 10pt;
  color: #bbbbbb;
  background-color: #0101af;
  margin: auto;
  max-width: 800px;
}

main {
  margin: 0 4%;
}

a:link {
  text-decoration: none;
  color: #ccddff;
}
a:visited {
  text-decoration: none;
  color: #ccddff;
}
a:active {
  text-decoration: none;
  color: #ccddff;
}
a:hover {
  text-decoration: underline;
  color: #239eeb;
}

img.logo-big {
  width: 731px;
  max-height: 250px;
  max-width: 100%;
}

@keyframes toGrayscale {
  from {
    filter: grayscale(0);
  }
  to {
    filter: grayscale(1);
  }
}
