.btn-sidebar-toggle {
    float: left;
    background: none;
    border: none;
    cursor: pointer;
    padding: 11px;
    margin: 0;
    color: #818181;
    font-size: 16px;
    line-height: 1;
}

.btn-sidebar-toggle:hover {
    color: #e26729;
}

.btn-sidebar-toggle svg {
    width: 1em;
    height: 1em;
    vertical-align: middle;
}

/* Collapsed state — desktop only so responsive.css always wins on mobile */
@media screen and (min-width: 769px) {
    html.sidebar-collapsed #box_l {
        display: none;
    }

    html.sidebar-collapsed #content {
        width: 100%;
    }

    /* Without the sidebar the SVG would grow to full content width, making it
       too large to read without scrolling. Constrain it and center it. */
    html.sidebar-collapsed #svgcontainer > svg{
        display: block;
        margin: 0 auto;
        width: 75%;
    }
}

/* Hide on mobile — responsive.css handles the layout there */
@media screen and (max-width: 768px) {
    .btn-sidebar-toggle {
        display: none;
    }
}
