/* Document */
body {
    font-family: Nunito;
    background-color: #f6f9ff;
    color: #444444;
}

/* Header */
header {
    position: fixed;
    top: 0;
    left: 0;

    height: 50px;
    width: 100%;

    background-color: #f8f9fa;

    z-index: 100;

    padding: 6px;

    box-shadow: rgba(0, 0, 0, 0.15) 0px 8px 16px 0px
}

/* Side menu global */
aside {
    position: fixed;
    top: 0;
    left: 0;

    padding: 60px 10px 10px 10px;    /* 60 = height header + 10 */

    height: 100%;
    width: 200px;

    background-color: #ffffff;

    z-index: 90;

    box-shadow: rgba(1, 41, 112, 0.1) 0px 0px 20px 0px
    
}

/* Main (fixed) content windows */
main {
    position: fixed;
    top: 0;
    left: 0;

    padding: 50px 0px 0px 200px;    /* 50 = header, 200 = aside */

    width: 100%;
    height: 100%;

    z-index: 80;
}

div.content-menu {
    position:fixed;
    top: 0;
    left: 0;

    padding: 60px 10px 10px 210px;    /* 60 = header + 10, 210 = aside + 10 */

    width: 100%;
    height: 101px; /* header 51px */

    z-index: 70;
}

div.content {
    position:fixed;
    top: 0;
    left: 0;

    padding: 110px 10px 20px 210px;

    width: 100%;
    height: 100%;

    z-index: 60;
}

/* Content top */
div.card-top {
    width: 100%;
    height: 50%;

    z-index: 50;

    padding: 10px;
}

div.content-top {
    width: 100%;
    height: 100%;

    overflow-y: auto;
}

/* Content bottom */
div.card-bottom {
    width: 100%;
    height: 50%;

    z-index: 50;

    padding: 10px;
    margin-top: 10px;
}

div.content-bottom {
    width: 100%;
    height: 100%;   

    overflow-y: auto;
}

div.item-menu {
    position: fixed;
    background-color: #ffffff;
}

div.item-content {
    margin-top: 50px;
}

div.btn-group {
    margin-bottom: 10px;
}

/* Menu lists */
aside > ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

aside > ul > li {
    font-size: 12pt;
    font-weight: bold;
    padding: 5px;
}

aside > ul > li.active {
    background-color: #F6F9FF;
}

/* Active Tables */
.fixedTable { /* Overflow on div... */
    background-color: #ffffff; 
}

.fixedTable thead th { 
    position: sticky;
    top: 0; 
    background-color: #ffffff;
}

.fixedTable td {
    cursor: pointer;
}

.fixedTable tr.active {
    background-color: #209cee;
}

.fixedTable tr.active td {
    color: #ffffff;
}