/* body {
    background: rgb(38, 44, 68);
}

main.container,
#links-wrapper {
    width: fit-content;
    margin: auto;
} */
 
h2,
h3,
h4 {
    padding: 2% 0 1%;
}

html, body {
    height: 100%;
}

body {
    display: flex;
    flex-direction: column;
}

main {
    flex: 1 0 auto;
}

footer {
    flex-shrink: 0;
}

#title {
    font-size: 3.5rem;
    font-weight: 900;
    background: white;
    /* background: linear-gradient(90deg, rgba(228, 3, 3, 1) 0%, rgba(255, 140, 0, 1) 16%, rgba(255, 237, 0, 1) 32%, rgba(0, 128, 38, 1) 48%, rgba(0, 76, 255, 1) 64%, rgba(115, 41, 130, 1) 80%); */
    background: url('/images/pride-rainbow-flag\ -\ Copy.jpg');
    background-size: cover;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.covers {
    width: 20%;
    max-width: 120px;
    margin: 0 2% 1% 0;
    box-shadow: 4px 4px 4px #111;
    border: 1px solid #ccc;
}

#links-wrapper {
   width: 50% !important;
}

@media screen and (max-width: 990px) {
    #toc-wrapper {
        width: 100% !important;
        position: static !important;
    }

    #toc {
        border: none !important;
    }

    #links-wrapper {
        width: 100% !important;
    }
}