#side-navigation {
    min-width: fit-content;
}

.side-nav-container {
    position: sticky;
    top: 1em;
    align-self: flex-start;
    min-width: 20%;
    font-weight: 600;
}

.side-nav-children {
    list-style-type: none;
    padding-inline-start: 20px;
}

    .side-nav-children li {
        margin: 0.5em 0;
    }

.side-nav-list > .side-nav-children {
    padding-bottom: 1px;
    padding-left: 0;
}

.side-nav-list > .current-tree {
    border-bottom: 1px solid #b1b1b1;
    margin-bottom: 1.25em;
    padding-bottom: 0.5em;
}

.side-nav-list > .current-tree--members-area {
    border-bottom: 1px solid #b1b1b1 !important;
    margin-bottom: 1.25em;
    padding-bottom: 0.5em;
}

.side-nav-list > .side-nav-children:last-child {
    border-bottom: none;
}

.side-nav .side-nav-children:first-child > li {
    margin-top: 0;
}

@media(max-width: 850px) {
    #side-navigation {
        padding-left: 0 !important;
        padding-right: 0 !important;
        padding-top: 0 !important;
    }

    .side-nav-container {
        padding-top: 0;
        padding-left: 0;
        text-align: center;
        margin: 0 auto !important;
    }

    .side-nav-children {
        padding-left: 0;
    }

    #content-container {
        display: flex;
        flex-direction: column-reverse !important; /*So that the side nav now shows at bottom of screen*/
    }

    .side-nav-container--members-area {
        display: none;
    }
}

@media(max-width: 750px) {
    .side-nav-container {
        padding-bottom: 7px;
    }

    .side-nav-children {
        padding: 0;
    }

    .side-nav-list > .current-tree {
        padding-bottom: 0;
    }
}

@media(min-width: 1350px) {
    .side-nav-container {
        min-width: 17%;
    }
}

@media(min-width: 1440px) {
    .side-nav-container {
        padding-left: 0 !important;
    }
}

@media(max-width: 1440px) {
    #side-navigation {
        margin: 0 auto !important;
    }
}