#background {
  filter: blur(4px);
  left: -16px; top: -16px;
  width: calc(100% + 32px);
  height: calc(100% + 32px);
}

main {
  max-width: none; margin: 0; padding: 0;
  position: absolute;
  left: 0; top: 0; width: 100%; height: 100%;
  background-color: transparent;
  box-shadow: none;
  text-shadow: 0px 1px 8px black,
               0px 1px 4px black,
               0px 1px 2px black;
  color: white;
}

main > .container {
  display: flex; flex-direction: column;
  width: 100%; max-width: 900px;
  height: 100%;
  margin: 0 auto;
}

.container > .spacer { flex-grow: 1; }

.jumbotron h1, .jumbotron h2 { text-align: center; }

#index-nav ul { list-style: none; padding-left: 0; }

#index-nav ul > li { padding-left: 0; }

#index-nav a {
    color: white;
    text-decoration: none;
}

#index-nav h2 {
    text-align: center;
}

@media (min-width: 662px) {
    #index-nav {
        text-align: center;
        margin-top: 4em;
    }
    #index-nav a {
        display: block;
        margin-top: 1em;
        margin-bottom: 2em;
    }
    #index-nav ul {
        display: flex; flex-direction: row;
        justify-content: space-evenly;
        flex-wrap: wrap;
    }
    #index-nav .nav-icon {
        display: block;
        margin: 0 auto 0.5em auto;
    }
}

@media (max-width: 661px) {
    #index-nav {
        margin-top: 2em;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-evenly;
    }
    #index-nav a {
        display: block;
        max-width: none;
        margin: 0 auto;
    }
    #index-nav ul { text-align: center; }
    #index-nav ul > li { display: block; margin: 1em; }
    #index-nav .nav-icon { display: none; } /* for now */
}

#about {
    max-width: 300px;
    text-align: center;
    text-shadow: none;
}
@media (min-width: 662px) {
    #about {
        position: fixed;
        right: 2em;
        bottom: 2em;
    }
}
@media (max-width: 661px) {
    #about {
        display: block;
        margin: 0 auto 2em auto;
    }
}


/* Special: Beta ribbon */
/*
@media (min-width: 662px) {
#index-nav ul > *:nth-child(2)::after {
    content: "";
    position: relative;
    top: -9em;
    left: 66px;
    display: block;
    width: 48px; height: 48px;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCI+PHBvbHlnb24gcG9pbnRzPSIyMCAwIDM2IDAgNDggMTIgNDggMjgiIGZpbGw9IiNhMDAiIC8+PHRleHQgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzYsLTIpIHJvdGF0ZSg0NSkiIHg9IjAiIHk9IjEwIiBmb250LXNpemU9IjgiIGZvbnQtZmFtaWx5PSJzYW5zLXNlcmlmIiBmb250LXdlaWdodD0iYm9sZCIgZmlsbD0iI2ZmZiI+QkVUQTwvdGV4dD48L3N2Zz4K");
}
}
@media (max-width: 661px) {
    #index-nav ul > *:nth-child(2)::after {
    }
}
*/