@import url("https://fonts.googleapis.com/css?family=Raleway:100,300,400,500,700,900|Roboto:100,300,400,500,700,900|Poppins:100,300,400,500,600,700,900|Josefin+Sans:100,300,400,600,700&display=swap");
    @import url('https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css');

    html, body {
        font-family: 'Roboto', sans-serif;
        font-weight: 300;
        font-size: 1em;
    }

    body.grey
    {
        background-color: #f3f3f3;
    }

    input[readonly], input[disabled], textarea[readonly], textarea[disabled], select[readonly], select[disabled] {

        background-color: #fbfbfb;
        opacity: 1;
    }

    .custom-tooltip {
        --bs-tooltip-bg: #fbfbfb !important
    }

    .btn
    {
        font-size: inherit;
    }

    .form-control
    {
        font-size: 1em;
    }

    input.form-control-plaintext
    {
        background-color: inherit;
        padding-left: 12px;
    }

    .hidden
    {
        display: none;
    }

    .disable-interaction {
        pointer-events: none;
    }


    ul.pagination .page-link {
        color: black;
    }

    ul.pagination .page-item.active .page-link {
        color: #eee;
        background-color:#333;
        border-color:#333;
    }


    a[active="true"]
    {
        color: #0a58ca;
    }

    solar[display=inline]
    {
        display: block;
        min-height: 100px;
    }

    solar table, table
    {
        font-size: 0.9em;
    }

    solar table td
    {
        white-space: nowrap;
    }

    solar table colgroup col.order
    {
        background-color: #f7f7f7;
    }

    solar table thead th {

    font-size: 0.9em;
    text-align: center;
    white-space: nowrap !important;
    font-weight: 500;
    }

    solar table input[type=checkbox]
    {
        font-size: 14px !important;
    }

    solar table tr th, solar table tr td
    {
        padding: 0.7rem 1.5rem !important;
    }

    solar table tr:hover
    {
        border-left: solid 2px #1A73E8;
    }

    solar table tr td a, table {

    color: inherit;
    text-decoration: none;
    }


    solar table thead th {

        position: relative;
    }

    solar table thead th a span {

        margin-left: 0.9em;
        position: absolute;
        top: 30%;
        right: 10%;
    }

    solar table thead th a span.dir {

        margin-left: 1.5em;
    }

    solar table thead th a span.dir:before {

        content: "\2193";
        font-size: 0.9em;
        opacity: 0.4;
    }

    solar table thead th a span.dir:after {

        content: "\2191";
        font-size: 0.9em;
        opacity: 0.4;
    }

    solar table thead th[order="desc"] a span.dir:before {

        opacity: 1;
    }
    solar table thead th[order="asc"] a span.dir:after {

        opacity: 1;
    }

    solar table a.overflow
    {
        outline: none;
        text-decoration: none;
        font-size: 0.8em;
    }

    solar div.control button.active
    {
        color: #0d6efd;
    }

    /* solar div.control button.active::after
    {
        content: 'Filtered';
        font-size: 0.8em;
        padding-left: 10px;
    }
    */

    .table-striped>tbody>tr:nth-of-type(odd) {
        --bs-table-accent-bg: rgb(0 0 0 / 3%);
    }

    solar nav ul.pagination li a
    {
        font-size: 0.85em !important;
    }

    solar nav ul.pagination li a
    {
        white-space: nowrap;
        box-shadow: none;
    }

    .date-icon {
        background-image: url(../img/datetime.png);
        background-repeat: no-repeat;
        background-position: right 8px center;
    }

    form.solar
    {
        scroll-margin-top: 100px;
    }
    

    form.solar div.title p.description
    {
        font-size: 0.8em;
        font-weight: 200;
        margin: 0;
    }

    form.solar input:not([type='checkbox']):not([type='radio']):not([type='button']), form.solar textarea, form.solar select
    {
        border-bottom-color: #eeeeee !important;
        border-top-color: #ccc;
    }

    form.solar input:focus:not([type='checkbox']):not([type='radio']):not([type='button']), form.solar textarea:focus, form.solar select:focus
    {
        box-shadow: none;
        border-color: #ced3db; 
        border-left: solid 2px #0D6EFD;
        outline: none;
    }

    form.solar div.input-group button:last-of-type
    {
        border-radius: 0 0.375rem 0.375rem 0 !important;
        border-color: #ccc;
    }
    
    solar .table-filter button:last-of-type
    {
        border-radius: 0 0.375rem 0.375rem 0 !important;
    }

    solar div.form-control
    {
        padding: 0px;
        border: none;
    }

    solar .table-filter div.form-control.filter input
    {
        border-radius: 0px;
        padding-left: 40px !important;
        border: solid 1px #dee2e6 !important;
    }

    solar .table-filter div.form-control.filter button, solar .table-filter div.form-control.filter button:hover
    {   
        position: absolute;
        border: none;
        z-index: 10;
        color: #6C757D;
        height: 100%;
    }
    
    solar .table-filter div.form-control.filter ul
    {
       font-size: 0.90em;
       padding: 0px;
       margin: 0px;
    }
    
    solar .table-filter div.form-control.filter ul li
    {
       padding: 0px;
       border-bottom: solid 1px #eee;
    }

    solar .table-filter div.form-control.filter ul li.active
    {
       border-left: solid 2px #0D6EFD;
    }

    solar .table-filter div.form-control.filter ul li a
    {
       padding: 10px 20px;
    }

    form.solar textarea, div.solar textarea
    {
        min-height: 80px;
    }

    form.solar i.required
    {
        color:red;

        padding-right: 4px;
    }
    
/*     form.solar .comment--- {
        position: relative;
        color: #333;
        font-weight: 300;
        background-color: #f6f6f6;        
        width: 100%;
        display: inline-block;
        top: 0px;
        border-radius:6px;
        padding: 12px 14px;
        margin-top: 6px;
        box-shadow: 1px 2px #eee;
    }
     */
    form.solar .comment, div.solar .comment {

        color: #10527c; /* 10527c #005d98 989898, 00448b */
        margin-top: 10px;
        font-size: 0.85em;
        display: inline-block;
        font-weight: 300;
        padding-left: 4px;
    }


    form.solar .comment i.icon, div.solar .comment i.icon
    {
        content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iY3VycmVudENvbG9yIiBjbGFzcz0iYmkgYmktYXJyb3ctcmlnaHQtc2hvcnQiIHZpZXdCb3g9IjAgMCAxNiAxNiI+DQogIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTQgOGEuNS41IDAgMCAxIC41LS41aDUuNzkzTDguMTQ2IDUuMzU0YS41LjUgMCAxIDEgLjcwOC0uNzA4bDMgM2EuNS41IDAgMCAxIDAgLjcwOGwtMyAzYS41LjUgMCAwIDEtLjcwOC0uNzA4TDEwLjI5MyA4LjVINC41QS41LjUgMCAwIDEgNCA4eiIvPg0KPC9zdmc+");
        position: relative;
        top: 3px;
    }

    form.solar .comment:empty, div.solar .comment:empty
    {
        display: none;
    }

    button.btn-close
    {
        font-size: 0.7em;
    }

    /****************/


    solar render
    {
        display: none;
    }

    .form-control:disabled, .form-control[readonly], .form-select:disabled {
        background-color: #fefefe;
        opacity: 1;
    }

    /* Solar Headers */

    
    div.solar.header
    {
        font-family: inherit;
    }

    div.solar.header .title
    {
        font-size: 1.1em;
        line-height: 1;
        margin: 0;
        font-weight: 500;
    }

    form.solar .label
    {
        font-size: 0.95em;
        font-weight: 300;
    }


    div.solar.header .label
    {
        font-size: 0.9em;
        font-weight: 300;
        margin-top: 0.5em !important;
        margin: 0;
    }

    div.solar.header .title:empty, div.solar.header .label:empty
    {
        display: none;
    }

    form input:not([type='checkbox']):not([type='radio']):not([type='button']), form textarea, form select
    {
        font-size: 0.95em !important;
        padding: 12px; /* keep for non-floating forms but /w !important */
    }
    
    form > div.form-floating, form > div.form-check-inline, form > div.input-group, form > p.label
    {
        margin-bottom: 1.5rem!important;
    }

    form > div.input-group.model button
    {
        width: 48px;
    }

    .form-floating input, .form-floating textarea, .form-floating  select
    {
        padding: 30px 12px 10px 12px !important;
    }

    .form-floating>label {
        font-size: 0.9em;
    }

    input::-webkit-input-placeholder { /* Edge */
        font-size: 0.95em !important;
        color: #999 !important;
    }
    input::-moz-placeholder { /* Firefox 19+ */
        font-size: 0.95em !important;
        color: #999 !important;
    }
    input:-moz-placeholder { /* Firefox 19+ */
        font-size: 0.95em !important;
        color: #999 !important;
    }
    input:-ms-input-placeholder { /* Internet Explorer 10-11 */
        font-size: 0.95em !important;
        color: #999 !important;
    }
    input::placeholder {
        font-size: 0.95em !important;
        color: #999 !important;
    }

    textarea::-webkit-input-placeholder { /* Edge */
        font-size: 0.95em !important;
        color: #999 !important;
    }
    textarea::-moz-placeholder { /* Firefox 19+ */
        font-size: 0.95em !important;
        color: #999 !important;
    }
    textarea:-moz-placeholder { /* Firefox 19+ */
        font-size: 0.95em !important;
        color: #999 !important;
    }
    textarea:-ms-input-placeholder { /* Internet Explorer 10-11 */
        font-size: 0.95em !important;
        color: #999 !important;
    }
    textarea::placeholder {
        font-size: 0.95em !important;
        color: #999 !important;
    }

    /* Modal reports */

    div.solar.report
    {
        font-size: 1em;
    }

    div.solar.report .content .label, div.solar.report .content .value, div.solar.report .content .comment
    {
        width: 100%;
        display: inline-block;
        padding: .3rem 0.9rem;
        margin: 0px;
    }

    div.solar.report .content .label
    {
        padding: .6rem 0.9rem;
    }

    div.solar.report .content .label
    {
        color: #333;
        background-color: #f6f6f6;
        border-radius: .2rem;
    }

    div.solar.report .content .value
    {
        max-height: 100px;
        overflow-y: auto;
    }

    div.solar.report .content .comment:empty
    {
        display: none;
    }

    div.solar.report .content .value:empty::after
    {
        content: "- -";
    } 


    solar .dropdown-divider {

        border-top: 1px solid #bbb!important;
    }


    /*********************************
    Datepicker plugin
    **********************************/


    div.daterangepicker {
        padding: 10px;
        padding-top: 10px;
        box-shadow: 0 .25rem 0.5rem rgba(0,0,0,.175) !important;
        font-family: 'Poppins', sans-serif !important;
    }

    .daterangepicker th.month {
        font-weight: 600;
        word-spacing: 3px;
    }

    div.daterangepicker table tr:nth-child(2) th {
        padding-top: 10px;
        font-weight: 400;
    }

    div.daterangepicker select {

        border-color: #d4d4d4;
        padding-left: 4px !important;
        border-radius: .25rem !important;
    }

    div.daterangepicker button.cancelBtn, div.daterangepicker button.applyBtn
    {
        font-weight: 300 !important;
        border: solid 1px #ccc;
    }

    div.daterangepicker button.cancelBtn
    {
        border-bottom: solid 2px red;
        font-size: 0.8em;
    }

    div.daterangepicker button.applyBtn
    {
        border-bottom: solid 2px #0d6efd;
    }

    div.daterangepicker button.cancelBtn:hover, div.daterangepicker button.applyBtn:hover
    {
        border-bottom: solid 2px #333;
    }

    .daterangepicker.show-calendar .drp-buttons {

        padding-top: 14px;
    }

    .daterangepicker .drp-selected {
        font-size: 0.85em;
        font-weight:300;
        font-family: 'Poppins', sans-serif !important;
        float: left;
        padding-top: 12px;
        padding-left: 10px;
        letter-spacing: 1px;
    }

    .daterangepicker .drp-selected::before
    {
        content: '-';
        font-weight: 200;
        padding-right: 10px;
    }
    .daterangepicker .drp-selected::after
    {
        content: '-';
        font-weight: 200;
        padding-left: 10px;
    }

    .daterangepicker td.in-range {
        background-color: #f2f7ff;
        color: #000;
    }

    .daterangepicker td.active, .daterangepicker td.active:hover {
        background-color: #0d6efd;
        color: #fff;
    }

    .daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.secondselect, .daterangepicker select.ampmselect {

        background: #f8f8f8;
        color: #333;
    }

    .daterangepicker select.monthselect, .daterangepicker select.yearselect
    {
        border: none;
    }

    .daterangepicker .calendar-table .next span, .daterangepicker .calendar-table .prev span {

        border-width: 0 1px 1px 0;
    }

    .daterangepicker table thead tr:first-child th
    {
        padding-top: 6px;
        padding-bottom: 6px;
    }

    .daterangepicker .drp-buttons {

        border-top: 1px dashed #ddd;
    }

    .daterangepicker .calendar-time {

        padding-bottom: 4px;
    }


    /*div.daterangepicker div.drp-calendar.left
    {
        margin-right: 4px;
    }*/


    input[pl-search] {

        background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iY3VycmVudENvbG9yIiBjbGFzcz0iYmkgYmktZmlsdGVyIiB2aWV3Qm94PSIwIDAgMTYgMTYiPg0KICA8cGF0aCBkPSJNNiAxMC41YS41LjUgMCAwIDEgLjUtLjVoM2EuNS41IDAgMCAxIDAgMWgtM2EuNS41IDAgMCAxLS41LS41em0tMi0zYS41LjUgMCAwIDEgLjUtLjVoN2EuNS41IDAgMCAxIDAgMWgtN2EuNS41IDAgMCAxLS41LS41em0tMi0zYS41LjUgMCAwIDEgLjUtLjVoMTFhLjUuNSAwIDAgMSAwIDFoLTExYS41LjUgMCAwIDEtLjUtLjV6Ii8+DQo8L3N2Zz4=");
        background-repeat: no-repeat;
        background-position: right 8px center;
    }

   input[pl-datepicker] {
        background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iY3VycmVudENvbG9yIiBjbGFzcz0iYmkgYmktY2FsZW5kYXItZGF0ZSIgdmlld0JveD0iMCAwIDE2IDE2Ij4NCiAgPHBhdGggZD0iTTYuNDQ1IDExLjY4OFY2LjM1NGgtLjYzM0ExMi42IDEyLjYgMCAwIDAgNC41IDcuMTZ2LjY5NWMuMzc1LS4yNTcuOTY5LS42MiAxLjI1OC0uNzc3aC4wMTJ2NC42MWguNjc1em0xLjE4OC0xLjMwNWMuMDQ3LjY0LjU5NCAxLjQwNiAxLjcwMyAxLjQwNiAxLjI1OCAwIDItMS4wNjYgMi0yLjg3MSAwLTEuOTM0LS43ODEtMi42NjgtMS45NTMtMi42NjgtLjkyNiAwLTEuNzk3LjY3Mi0xLjc5NyAxLjgwOSAwIDEuMTYuODI0IDEuNzcgMS42NzYgMS43Ny43NDYgMCAxLjIzLS4zNzYgMS4zODMtLjc5aC4wMjdjLS4wMDQgMS4zMTYtLjQ2MSAyLjE2NC0xLjMwNSAyLjE2NC0uNjY0IDAtMS4wMDgtLjQ1LTEuMDUtLjgyaC0uNjg0em0yLjk1My0yLjMxN2MwIC42OTYtLjU1OSAxLjE4LTEuMTg0IDEuMTgtLjYwMSAwLTEuMTQ0LS4zODMtMS4xNDQtMS4yIDAtLjgyMy41ODItMS4yMSAxLjE2OC0xLjIxLjYzMyAwIDEuMTYuMzk4IDEuMTYgMS4yM3oiLz4NCiAgPHBhdGggZD0iTTMuNSAwYS41LjUgMCAwIDEgLjUuNVYxaDhWLjVhLjUuNSAwIDAgMSAxIDBWMWgxYTIgMiAwIDAgMSAyIDJ2MTFhMiAyIDAgMCAxLTIgMkgyYTIgMiAwIDAgMS0yLTJWM2EyIDIgMCAwIDEgMi0yaDFWLjVhLjUuNSAwIDAgMSAuNS0uNXpNMSA0djEwYTEgMSAwIDAgMCAxIDFoMTJhMSAxIDAgMCAwIDEtMVY0SDF6Ii8+DQo8L3N2Zz4=");
        background-repeat: no-repeat;
        background-position: right 8px center;
    }

    input[pl-datepicker=range] {
        background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iY3VycmVudENvbG9yIiBjbGFzcz0iYmkgYmktY2xvY2siIHZpZXdCb3g9IjAgMCAxNiAxNiI+DQogIDxwYXRoIGQ9Ik04IDMuNWEuNS41IDAgMCAwLTEgMFY5YS41LjUgMCAwIDAgLjI1Mi40MzRsMy41IDJhLjUuNSAwIDAgMCAuNDk2LS44NjhMOCA4LjcxVjMuNXoiLz4NCiAgPHBhdGggZD0iTTggMTZBOCA4IDAgMSAwIDggMGE4IDggMCAwIDAgMCAxNnptNy04QTcgNyAwIDEgMSAxIDhhNyA3IDAgMCAxIDE0IDB6Ii8+DQo8L3N2Zz4=");
        background-repeat: no-repeat;
        background-position: right 8px center;
    }


    solar .table>:not(:first-child) {
        border-top: 2px solid currentColor;
        border-top: none;
    }

    solar .table thead tr
    {
        border-top: solid 0px #f2f2f2;
    }


    /*****  DESIGN STYLE ---*/

    /* side menu */

    .btn-toggle-nav a:hover, .btn-toggle-nav a:focus {
        background-color: #f3f3f3 !important;
    }
    .btn-toggle:hover, .btn-toggle:focus {
        background-color: #f3f3f3 !important;
    }
    .btn-check:focus+.btn, .btn:focus {
        outline: 0;
        box-shadow: none !important;
    }

    a[disabled]
    {
        pointer-events: none;
    }

    nav.solar div.express span.badge
    {
        padding: 0.6rem!important;
        margin-top: 0px;
        color: #111;
        font-weight: 300;
        letter-spacing: 0.06rem;
        margin-right: 10px;
        font-size: 0.78rem;
    }

    nav.solar div.express span.badge, nav.solar ul.pagination .disabled a, .table-striped>tbody>tr:nth-of-type(odd)>*
    {
        background-color: #f6f6f6 !important;
        --bs-table-accent-bg: none;
    }

    nav.solar div.express span.badge
    {
        border: solid 1px #DEE2E6;
        padding: 9px 12px !important;
    }

    table.solar .badge
    {
        border-radius: 0.25rem;
    }

    [v-cloak] {
        display: none;
    }

    div.toast
    {
        z-index: 100 !important;
    }

    
    /* Theme sytles  ----------------------- */


    .bg-white {
        background: #fff !important;
    }

    @media (min-width: 1200px) {

        /* Gives a narrow feel to the containers @ 960 pixels */
        body.compact .container {
            max-width: 960px;
        }
    }

    img.p, .bi.p, .dropdown-menu.mega .bi
    {
        margin-right: 0.8em;
        color:#444;
    }

    a {
        color: #0764c8;
    }

    h1, h2, h3, h4, h5, h6
    {
        font-family: 'Poppins', sans-serif;
        font-weight: 500;
        padding-bottom: 0.4em;
    }

    hr
    {
        opacity: 0.1 !important;
    }

    hr.dropdown-divider
    {
        opacity: 0.3 !important;
    }

    hr.bold{
        border-top: 2px solid rgba(0,0,0,.1);
    }

    hr.bolder {
        border-top: 4px solid rgba(0,0,0,.1);
    }

    hr.boldest {
        border-top: 8px solid rgba(0,0,0,.1);
    }

    .text-pipe:before
    {
        content: "|";
        padding: 0 1.2em;
        color: #d3d3d3;
        font-weight: normal;
    }

    /*
    Border radius
    */

    .br-0
    {
        border-radius: 0px;
    }

    .font-roboto
    {
        font-family: 'Roboto', sans-serif !important;
        font-size: inherit;
    }

    .font-poppins
    {
        font-family: 'Poppins', sans-serif !important;
        font-size: inherit;
    }

    .font-josefin
    {
        font-family: 'Josefin Sans', sans-serif !important;
        font-size: inherit;
    }

    .font-raleway
    {
        font-family: 'Raleway', sans-serif !important;
        font-size: inherit;
    }

    .fw-600
    {
        font-weight: 600!important;
    }

    .fw-500
    {
        font-weight: 500!important;
    }

    .fw-400
    {
        font-weight: 400!important;
    }

    .fw-300
    {
        font-weight: 300!important;
    }

    .fw-200
    {
        font-weight: 200!important;
    }

    .fw-100
    {
        font-weight: 100!important;
    }


    .fs-0x0 { font-size: 0em !important; }
    .fs-0x1 { font-size: 0.1em !important; }
    .fs-0x2 { font-size: 0.2em !important; }
    .fs-0x3 { font-size: 0.3em !important; }
    .fs-0x4 { font-size: 0.4em !important; }
    .fs-0x5 { font-size: 0.5em !important; }
    .fs-0x6 { font-size: 0.6em !important; }
    .fs-0x7 { font-size: 0.7em !important; }
    .fs-0x8 { font-size: 0.8em !important; }
    .fs-0x9 { font-size: 0.9em !important; }

    .fs-1x0 { font-size: 1em !important; }
    .fs-1x1 { font-size: 1.1em !important; }
    .fs-1x2 { font-size: 1.2em !important; }
    .fs-1x3 { font-size: 1.3em !important; }
    .fs-1x4 { font-size: 1.4em !important; }
    .fs-1x5 { font-size: 1.5em !important; }
    .fs-1x6 { font-size: 1.6em !important; }
    .fs-1x7 { font-size: 1.7em !important; }
    .fs-1x8 { font-size: 1.8em !important; }
    .fs-1x9 { font-size: 1.9em !important; }

    .fs-2x0 { font-size: 2em !important; }
    .fs-2x1 { font-size: 2.1em !important; }
    .fs-2x2 { font-size: 2.2em !important; }
    .fs-2x3 { font-size: 2.3em !important; }
    .fs-2x4 { font-size: 2.4em !important; }
    .fs-2x5 { font-size: 2.5em !important; }
    .fs-2x6 { font-size: 2.6em !important; }
    .fs-2x7 { font-size: 2.7em !important; }
    .fs-2x8 { font-size: 2.8em !important; }
    .fs-2x9 { font-size: 2.9em !important; }

    .fs-3 { font-size: 3em !important; }
    .fs-4 { font-size: 4em !important; }
    .fs-5 { font-size: 5em !important; }
    .fs-6 { font-size: 6em !important; }
    .fs-7 { font-size: 7em !important; }
    .fs-8 { font-size: 8em !important; }
    .fs-9 { font-size: 9em !important; }


    .is-1 { width: 1em !important; }
    .is-2 { width: 2em !important; }
    .is-3 { width: 3em !important; }
    .is-4 { width: 4em !important; }
    .is-5 { width: 5em !important; }
    .is-6 { width: 6em !important; }
    .is-7 { width: 7em !important; }
    .is-8 { width: 8em !important; }
    .is-9 { width: 9em !important; }


    .navbar-toggler {
        border: none!important;
        outline: none !important;
    }

    .navbar-toggler:focus {
        outline: 0;
        box-shadow: none;
    }

    .nav-link, .dropdown-item, .navbar-text, .navbar-nav, .navbar-brand {
        font-family: 'Raleway', sans-serif;
        letter-spacing: 1.6px;
        font-weight: 500;
    }

    .menu-text
    {
        font-family: 'Raleway', sans-serif;
        font-size: 1em;
    }

    .menu-text .nav-link, .menu-text .navbar-text
    {
        font-size: 0.85em;
    }

    .nav-link, .navbar-text {
        color: #333;
    }

    .navbar-dark .nav-link, .navbar-dark .navbar-text {
        color: #eaeaea;
    }

    .navbar-brand {
        font-size: 1.2em;
    }

    .navbar .nav-link.p {
        margin-left: 1em;
        margin-right: 1em;
    }

    .dropdown-divider {
        height: 0;
        margin: .5rem 0;
        overflow: hidden;
        border-top: 1px solid #eaeaea!important;
    }

    .dropdown-item
    {
        font-size: 0.85em;
    }


    table .dropdown-item
    {
        font-size: 0.75em;
    }

    .dropdown-menu.mega
    {
        min-width: 350px;
        min-height: 100px;
        padding: 40px 30px;
        border:none;
        box-shadow: 0 .25rem 0.5rem rgba(0,0,0,.175)!important;
    }

    .dropdown-menu.mega .dropdown-divider
    {
        margin: 30px 0;
    }

    .dropdown-menu.mega a.nav-link
    {
        text-decoration: none;
        color:#444;
        letter-spacing: 1px;
        padding: 0px;
    }

    .dropdown-menu.mega nav a.nav-link
    {
        margin: 1em 0px !important;
    }

    .shadow {
        box-shadow: 0 .25rem 0.5rem rgba(0,0,0,.175)!important;
    }


    .cover {
        height: 50vh;
        background: #F4F4F4;
        min-height: 500px;
        background-repeat: repeat;
    }

    footer .nav-link {
        padding: .5rem 0rem;
    }

    .copyright
    {
        border-top: 1px solid #dee2e6!important;
    }


    /*********************************
    Access forms ( login and signup )
    **********************************/

    body.grey
    {
        background-color: #f5f5f5 !important;
    }

    main.access-ls
    {
        height: 100vh;
    }

    main.access-ls form
    {
        background-color: white;
        min-height: 200px;
        max-width: 350px;
        width: 100%;
        margin: auto;
        padding: 40px;
    }

    main.access-ls.wide form
    {
        max-width: 400px;
    }


    /*********************************
    Client/Customer/Admin Panel
    **********************************/

    @media ( min-width: 768px)
    {
        nav.sidebar--- {
            position: fixed !important;
            height: 100vh;
        }
    }

    nav.sidebar
    {
        z-index: 1000;
    }

    nav.sidebar div > a:after {
        content: "\21CC";
        color: #4D73DE;
        float: right;
    }

    nav a.active
    {
        color: #0a58ca;
    }



    /*********************************
    Introduce theme colors:

    color-p, color-s, bcolor-p, bcolor-s, color-bc-p, color-bc-s

    1. color-p    = primary text color
    2. color-s    = secondary text color
    3. bcolor-p   = primary background color
    4. bcolor-s   = secondary background color
    5. color-bc-p = primary text color of bcolor-p
    6. color-bc-s = secondary text color of bcolor-s

    **********************************/

    a:hover
    {
        color: teal;
    }

    .color-p
    {
        color: #0a58ca;
    }

    button.active
    {
        border-bottom: solid 2px #0e6efd !important;
        color: inherit !important;
        background-color: inherit !important;
    }

    /*********************************
    File upload
    **********************************/

    button.file
    {
        position: relative;
        overflow: hidden;
    }

    button input[type=file]
    {
        position: absolute;
        opacity: 0;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }


    .menu-plus > div > div
    {
        border-left: solid 3px #ddd;
    }

    .menu-plus > div > div:hover
    {
        border-left: solid 3px cornflowerblue;
    }

    .dropdown-toggle.no-icon:after {
        display: none;
    }



    /*********************************
    Menu Style 1
    **********************************/


    .dropdown-toggle { outline: 0; }

    .nav-flush .nav-link {
    border-radius: 0;
    }

    .btn-toggle {
    display: inline-flex;
    align-items: center;
    padding: .25rem .5rem;
    font-weight: 600;
    color: rgba(0, 0, 0, .65);
    background-color: transparent;
    border: 0;
    width: 100%;
    }
    .btn-toggle:hover,
    .btn-toggle:focus {
    color: rgba(0, 0, 0, .85);
    background-color: #d2f4ea;
    }

    .btn-toggle::before {
    width: 1.25em;
    line-height: 0;
    content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%280,0,0,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
    transition: transform .35s ease;
    transform-origin: .5em 50%;
    }

    .btn-toggle[aria-expanded="true"] {
    color: rgba(0, 0, 0, .85);
    margin-top: 8px;
    font-size: inherit;
    }
    .btn-toggle[aria-expanded="true"]::before {
    transform: rotate(90deg);
    }

    .btn-toggle-nav {
    width: 100%;
    }

    .btn-toggle-nav a {
    display: inline-flex;
    padding: .1875rem .5rem;
    margin-top: .125rem;
    margin-left: 1.25rem;
    text-decoration: none;
    width: 100%;
    }
    .btn-toggle-nav a:hover,
    .btn-toggle-nav a:focus {
    background-color: #d2f4ea;
    }

    .scrollarea {
    overflow-y: auto;
    }

    .fw-semibold { font-weight: 600; }
    .lh-tight { line-height: 1.25; }

/*     .table-striped>tbody>tr:nth-of-type(odd)>* {
        --bs-table-accent-bg: #F8F9FA;
        color: var(--bs-table-striped-color);
    } */