.toc-container {
    display: grid;
    grid-template-columns: 25% 50% 25%;
}

#documentation {
    max-width: 48em;
    grid-column: 2;
    justify-self: center;

}

#toc a,
#toc a:visited {
    color: black;
}

#toc a:hover {
    color: #0e1f56;
    text-decoration: underline;
}

#toc {
    font-size: small;
    margin: 0 1em 0 0;
    background: none;
    max-width: 20em;
    position: -webkit-sticky;
    position: sticky;
    top: 2%;
    grid-column: 1;
    justify-self: end;
    align-self: flex-start;

}

#toc-right {

}

/* Ocultamos header */

#toc > li:first-child,
a[href="#toc0"] {
    display: none;
}

#toc > li {
    padding: 0.1em 0 0 0.5em;
}

#toc .h1 {
    /* margin-left: 1em; */
    font-weight: bold;
}

#toc .h2 {
    margin-left: 1em;
}

#toc .h3 {
    margin-left: 2em;
}

#toc .h4 {
    margin-left: 2.5em;
}

#toc .h5 {
    margin-left: 3em;
}

#toc .h6 {
    margin-left: 3.5em;
}

/** Media Queries **/

@media (max-width: 1560px) {
    .toc-container {
        grid-template-columns: 20% 80%;
        margin: 0 0.5em 0 0;
    }

    #documentation {
        max-width: initial;
        grid-column: 2;
        justify-self: start;
    }

    #toc .h3,
    #toc .h4,
    #toc .h5,
    #toc .h6 {
        display: none;
    }
}

@media (max-width: 767px) {
    .toc-container {
        align-self: initial;
        display: initial;
        margin: 0 0.5em;

    }

    #toc {
        max-width: none;
        position: initial;
        font-size: initial;
        justify-self: center;
    }

    #documentation {
        position: initial;
        max-width: none;
    }
}