html, body {
    height: 100vh;
}

body {
    font-size: 14px;
    font-family: 'Lato', sans-serif;
}

.div {
    height: 90vh;
}

input, select, option, textarea, .btn {
    border-radius: 0 !important;
}

.btn:not(.btn-link) {
    font-size: .75rem;
}

select:not([multiple]) {
    -webkit-appearance: none;
    -moz-appearance: none;
    background-position: right 50%;
    background-repeat: no-repeat;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAMCAYAAABSgIzaAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDZFNDEwNjlGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDZFNDEwNkFGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0NkU0MTA2N0Y3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0NkU0MTA2OEY3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PuGsgwQAAAA5SURBVHjaYvz//z8DOYCJgUxAf42MQIzTk0D/M+KzkRGPoQSdykiKJrBGpOhgJFYTWNEIiEeAAAMAzNENEOH+do8AAAAASUVORK5CYII=);
    padding: .5em;
    padding-right: 1.5em
}

a.active {
    font-weight: 700;
}

.box {
    box-shadow: 2px 2px 10px #eee;
    background: #fff;
    padding: 1.5rem;
}

.box-login {
    background: #e60105;
    color: #fff;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .navbar-brand, .menu-header, thead, .btn {
    font-family: 'Montserrat', sans-serif;
}

.hidden {
    display: none;
}

/*
LAYOUT
 */

#sidebar {
    width: 50%;
    min-height: 100vh;
    transition: all 300ms;
    padding: 10px 0;
    margin-left: -50%;
    position: fixed;
    z-index: 100;
}

#sidebar a {
    color: #b8c7ce;
}

#sidebarCollapse {
    transition: all 300ms;
}

#sidebarCollapse.active {
    margin-left: 50%;
}

.sidebar-header {
    margin-bottom: 1rem;
}

#sidebar.active {
    margin-left: 0;
}

#sidebar .nav-link.active {
    color: #fff;
}

#content {
    transition: all 300ms;
}

.menu-header {
    background: rgba(0,0,0,0.2);
    color: #4b646f;
}

.modal-header, .modal-footer, .modal-content {
    border-radius: 0;
}

.showPassword {
    cursor: pointer;
}

form *[required] {
    border: 1px solid #000;
}

.top-header {
    background: #f8f9fa;
}

td[contenteditable="true"] {
    cursor: pointer;
    position: relative;
}

td[contenteditable="true"]:hover, td[contenteditable="true"]:focus {
    background-color: rgba(255,255,255,1);
}

td[contenteditable="true"]:not(:focus):hover {
    outline: 1px solid #b3d7ff;
}

td[contenteditable="true"]:after {
    font-family: 'Font Awesome\ 5 Free';
    content: "\f044";
    position: absolute;
    right: 5px;
    top: 0;
    font-weight: 900;
    color: #e0e0e0;
    font-size: 10px;
}

td[contenteditable="true"]:hover:after, td[contenteditable="true"]:focus:after {
    color: #007bff;
}

@media (min-width: 768px) {
    #sidebar {
        width: 250px;
        margin-left: 0;
    }
    #sidebar.active {
        margin-left: -250px;
    }
    #sidebarCollapse.active {
        margin-left: 0;
    }
    #content {
        margin-left: 250px;
    }
    #sidebar.active + #content {
        margin-left: 0;
    }
}

@media (min-width: 1600px) {
    .col-2xl {
        -ms-flex-preferred-size: 0;
        flex-basis: 0;
        -ms-flex-positive: 1;
        flex-grow: 1;
        max-width: 100%;
    }
    .col-2xl-auto {
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: auto;
        max-width: 100%;
    }
    .col-2xl-1 {
        -ms-flex: 0 0 8.333333%;
        flex: 0 0 8.333333%;
        max-width: 8.333333%;
    }
    .col-2xl-2 {
        -ms-flex: 0 0 16.666667%;
        flex: 0 0 16.666667%;
        max-width: 16.666667%;
    }
    .col-2xl-3 {
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }
    .col-2xl-4 {
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }
    .col-2xl-5 {
        -ms-flex: 0 0 41.666667%;
        flex: 0 0 41.666667%;
        max-width: 41.666667%;
    }
    .col-2xl-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
    .col-2xl-7 {
        -ms-flex: 0 0 58.333333%;
        flex: 0 0 58.333333%;
        max-width: 58.333333%;
    }
    .col-2xl-8 {
        -ms-flex: 0 0 66.666667%;
        flex: 0 0 66.666667%;
        max-width: 66.666667%;
    }
    .col-2xl-9 {
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%;
    }
    .col-2xl-10 {
        -ms-flex: 0 0 83.333333%;
        flex: 0 0 83.333333%;
        max-width: 83.333333%;
    }
    .col-2xl-11 {
        -ms-flex: 0 0 91.666667%;
        flex: 0 0 91.666667%;
        max-width: 91.666667%;
    }
    .col-2xl-12 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .order-2xl-first {
        -ms-flex-order: -1;
        order: -1;
    }
    .order-lg-last {
        -ms-flex-order: 13;
        order: 13;
    }
    .order-lg-0 {
        -ms-flex-order: 0;
        order: 0;
    }
    .order-lg-1 {
        -ms-flex-order: 1;
        order: 1;
    }
    .order-lg-2 {
        -ms-flex-order: 2;
        order: 2;
    }
    .order-lg-3 {
        -ms-flex-order: 3;
        order: 3;
    }
    .order-lg-4 {
        -ms-flex-order: 4;
        order: 4;
    }
    .order-lg-5 {
        -ms-flex-order: 5;
        order: 5;
    }
    .order-lg-6 {
        -ms-flex-order: 6;
        order: 6;
    }
    .order-lg-7 {
        -ms-flex-order: 7;
        order: 7;
    }
    .order-lg-8 {
        -ms-flex-order: 8;
        order: 8;
    }
    .order-lg-9 {
        -ms-flex-order: 9;
        order: 9;
    }
    .order-lg-10 {
        -ms-flex-order: 10;
        order: 10;
    }
    .order-lg-11 {
        -ms-flex-order: 11;
        order: 11;
    }
    .order-lg-12 {
        -ms-flex-order: 12;
        order: 12;
    }
    .offset-2xl-0 {
        margin-left: 0;
    }
    .offset-2xl-1 {
        margin-left: 8.333333%;
    }
    .offset-2xl-2 {
        margin-left: 16.666667%;
    }
    .offset-2xl-3 {
        margin-left: 25%;
    }
    .offset-2xl-4 {
        margin-left: 33.333333%;
    }
    .offset-2xl-5 {
        margin-left: 41.666667%;
    }
    .offset-2xl-6 {
        margin-left: 50%;
    }
    .offset-2xl-7 {
        margin-left: 58.333333%;
    }
    .offset-2xl-8 {
        margin-left: 66.666667%;
    }
    .offset-2xl-9 {
        margin-left: 75%;
    }
    .offset-2xl-10 {
        margin-left: 83.333333%;
    }
    .offset-2xl-11 {
        margin-left: 91.666667%;
    }
}