/* TODO:
There should be a JS-less way of seeing at least some of
the hidden boxes (TOC and Themes).
*/

.box, #toc, #themes, #nota_red, #objects {
    display: none;

    position: fixed;
    @include size(left, $W_MENU);
    top: 0;
    right: 0;

    box-sizing: border-box;
    max-height: 100%;
    @include size(max-width, 400px);
    @include size(padding, 10px 10px 30px 10px);
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    z-index: 100;

    color: black;
    background: #fff;
    box-shadow: 2px 2px 2px #444;

    @include size(border-width, 0 1px 1px 0);
    border-style: solid;
    border-color: #444;

    @include size(font-size, 14px);
    line-height: 1.2em;

    h2 {
        margin-top: 0;
    }
}



#box-underlay {
    display: none;
    position: fixed;
    @include size(left, $W_MENU);
    top: 0;
    bottom: 0;
    right: 0;
    background:#000;
    opacity: .5;
    z-index: 99;
}