/* ********************************************************************** */
/* COLORS */



/* ********************************************************************** */
/* FONTS */



/* ********************************************************************** */
/* OTHER CONFIG */

/**
 * Sidebar layout:
 * - outer or inner
 * - left or right
 */

/* This currenly supports only one outer sidebar */

.sidebar.outer {
    /* padding-top must be > #header height */
    padding:5em 0 2em 0;
    height:calc(100vh - 7em);
    position:fixed;
    top:0;
    /* z-index must be < #header z-index */
    z-index:90;
    overflow-x:scroll;
}

.sidebar.outer {
    /**
     * - width must correspond to #after-fixed width and margin
     * - margin, padding, border must be 0
     * - must not set font-size, so em is top level em and same as #after-fixed
     */
    width:20em;
}

#after-fixed.outer-left-sidebar,
#after-fixed.outer-right-sidebar {
    width:calc(100vw - 20em);
}

#after-fixed.outer-left-sidebar {
    margin:0 0 0 20em;
}

#after-fixed.outer-right-sidebar {
    margin:0 20em 0 0;
}

@media all and (max-width:1198.68px){
    
    .sidebar.outer {
        display:none;
    }
    
    #after-fixed.outer-left-sidebar,
    #after-fixed.outer-right-sidebar {
        width:100%;
        margin:0;
    }
}

#main {
    /*margin-left:420px;*/
    /*max-width:1600px;*/
}



/* ********************************************************************** */
/* CONSTANTS */

#main {
    display:block;
    clear:both;
    width:100%;
    font-size:100%;
}

#after-fixed.no-outer-sidebar {
    width:100%;
    display:block;
    clear:both;
}

#main.no-inner-sidebar {
    margin:0 auto;
}

#main img {
    max-width:100%;
}



/* ********************************************************************** */
/* END */