:root {
    --pale-lime: rgb(195, 231, 165);
    --light-lime: rgb(144, 191, 107);
    --medium-lime: rgb(116, 159, 82);
    --dark-lime: rgb(88, 124, 60);
    --deep-lime: rgb(49, 81, 24);
    /*******************************/
    --shallow-sage: rgb(212, 242, 227);
    --pale-sage: rgb(177, 231, 204);
    --light-sage: rgb(119, 194, 156);
    --medium-sage: rgb(89, 152, 121);
    --dark-sage: rgb(66, 125, 95);
    --deep-sage: rgb(18, 83, 50);
    /*******************************/
    --shallow-nigella: rgb(226, 241, 243);
    --pale-nigella: rgb(173, 231, 239);
    --light-nigella: rgb(98, 199, 214);
    --medium-nigella: rgb(51, 160, 175);
    --dark-nigella: rgb(14, 126, 142);
    --deep-nigella: rgb(0, 83, 95);
    /*******************************/
    --shallow-cornflower: rgb(230, 242, 255);
    --pale-cornflower: rgb(199, 224, 250);
    --light-cornflower: rgb(119, 177, 238);
    --medium-cornflower: rgb(90, 150, 215);
    --dark-cornflower: rgb(57, 118, 184);
    --deep-cornflower: rgb(43, 77, 138);
    /*******************************/
    --pale-lavender: rgb(215, 208, 255);
    --light-lavender: rgb(167, 154, 246);
    --medium-lavender: rgb(134, 118, 227);
    --dark-lavender: rgb(105, 89, 197);
    --deep-lavender: rgb(60, 45, 144);
    /*******************************/
    --pale-lilac: rgb(237, 201, 255);
    --light-lilac: rgb(193, 129, 226);
    --medium-lilac: rgb(175, 110, 209);
    --dark-lilac: rgb(155, 87, 191);
    --deep-lilac: rgb(94, 23, 131);
    /*******************************/
    --pale-fuchsia: rgb(255, 197, 225);
    --light-fuchsia: rgb(246, 120, 180);
    --medium-fuchsia: rgb(229, 83, 154);
    --dark-fuchsia: rgb(202, 42, 119);
    --deep-fuchsia: rgb(134, 4, 67);
    /*******************************/
    --pale-rose: rgb(255, 205, 202);
    --light-rose: rgb(255, 135, 128);
    --medium-rose: rgb(241, 102, 94);
    --dark-rose: rgb(213, 65, 57);
    --deep-rose: rgb(141, 0, 18);
    /*******************************/
    --pale-tangerine: rgb(255, 207, 165);
    --light-tangerine: rgb(255, 148, 54);
    --medium-tangerine: rgb(234, 116, 13);
    --dark-tangerine: rgb(189, 88, 0);
    --deep-tangerine: rgb(123, 59, 0);
    /*******************************/
    --pale-saffron: rgb(255, 229, 151);
    --light-saffron: rgb(255, 201, 43);
    --medium-saffron: rgb(189, 141, 0);
    --dark-saffron: rgb(150, 112, 0);
    --deep-saffron: rgb(89, 66, 0);
    /*******************************/
    --black: rgb(0,0,0);
    --white: rgb(255,255,255);
    --grey: rgb(240,240,240);
}

body {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 14px;
}

a, a:hover {
    color: var(--deep-sage);
}


div#header {
    background-color: var(--deep-sage);
}

    div#header h1 {
        color: var(--white);
    }

    div#header a.LogoutLnk {
        color: var(--white);
    }

div#topNav {
    background-color: var(--dark-sage);
    border-bottom-color: var(--black);
    border-top-color: var(--black);
}

    div#topNav > ul li a {
        color: var(--white);
    }


    div#topNav > ul li:hover {
        background-color: var(--medium-sage);
    }


ul[id$="LeftNavList"] > li#selected > a {
    background-color: var(--dark-sage);
    color: var(--white);
}

ul[id$="LeftNavList"] > li > a:hover {
    background-color: var(--medium-sage);
    color: var(--white);
}

div#footer {
    border-top: 1px solid var(--black);
}


.DetailsVw {
    border-color: var(--deep-nigella);
}

.DetailsVwHdr {
    background-color: var(--dark-nigella);
    color: var(--white);
}

.DetailsVwArw {
    background-color: var(--shallow-nigella);
}

.DetailsVwFtr {
    background-color: var(--medium-nigella);
    color: var(--white);
}


.DetailsHdr {
    background-color: var(--light-nigella) !important;
    color: var(--black) !important;
    font-weight: normal;
}

.DetailsFldName {
    width: 20%;
    vertical-align: top;
}

.DetailsData {
    width: 55%
}








.card-primary {
    border-color: var(--deep-sage);
}

.card-primary .card-header {
    background-color: var(--deep-sage);
    color: var(--white);
}
    .card-primary .card-footer {
        background-color: var(--dark-sage);
        color: var(--white);
    }


.card-secondary {
    border-color: var(--deep-nigella);
}

    .card-secondary .card-header {
        background-color: var(--dark-nigella);
        color: var(--white);
    }

    .card-secondary .card-footer {
        background-color: var(--medium-nigella);
        color: var(--white);
    }

.card-info {
    border-color: var(--deep-cornflower);
}

    .card-info > .card-header {
        background-color: var(--pale-cornflower);
        color: var(--deep-cornflower);
    }

    .card-info > .card-footer {
        background-color: var(--pale-cornflower);
        color: var(--deep-cornflower);
    }

.card-danger {
    border-color: var(--deep-rose);
}

    .card-danger > .card-header {
        background-color: var(--pale-rose);
        color: var(--deep-rose);
    }

    .card-danger >.card-footer {
        background-color: var(--pale-rose);
        color: var(--deep-rose);
    }

.card-warning {
    border-color: var(--deep-saffron);
}

    .card-warning > .card-header {
        background-color: var(--pale-saffron);
        color: var(--deep-saffron);
    }

    .card-warning > .card-footer {
        background-color: var(--pale-saffron);
        color: var(--deep-saffron);
    }

.card-success {
    border-color: var(--deep-lime);
}

    .card-success > .card-header {
        background-color: var(--pale-lime);
        color: var(--deep-lime);
    }

    .card-success > .card-footer {
        background-color: var(--pale-lime);
        color: var(--deep-lime);
    }


.btn-primary {
    background-color: var(--dark-sage);
    border-color: var(--deep-sage);
}

    .btn-primary:hover {
        background-color: var(--deep-sage);
        border-color: var(--deep-sage);
    }

    .btn-primary:disabled {
        background-color: var(--medium-sage);
        border-color: var(--deep-sage);
    }

.btn-secondary {
    background-color: var(--dark-nigella);
    border-color: var(--deep-nigella);
}

    .btn-secondary:hover {
        background-color: var(--deep-nigella);
        border-color: var(--deep-nigella);
    }

.btn-tertiary {
    background-color: var(--dark-lavender);
    border-color: var(--deep-lavender);
    color: var(--white);
}

    .btn-tertiary:hover {
        background-color: var(--deep-lavender);
        border-color: var(--deep-lavender);
        color: var(--white);
    }

.btn-danger {
    background-color: var(--dark-rose);
    border-color: var(--deep-rose);
    color: var(--white);
}

    .btn-danger:hover {
        background-color: var(--deep-rose);
    }

.btn-success {
    background-color: var(--dark-lime);
    border-color: var(--deep-lime);
    color:var(--white);
}

    .btn-success:hover {
        background-color: var(--deep-lime);
    }

.btn-outline-primary {
    background-color: var(--white);
    border-color: var(--deep-sage);
    color: var(--deep-sage);
}

    .btn-outline-primary:hover {
        background-color: var(--deep-sage);
        border-color: var(--deep-sage);
    }

.btn-outline-secondary {
    background-color: var(--white);
    border-color: var(--deep-nigella);
    color: var(--deep-nigella);
}

    .btn-outline-secondary:hover {
        background-color: var(--deep-nigella);
        border-color: var(--deep-nigella);
    }

    .btn-outline-secondary:disabled {
        background-color: var(--white);
        border-color: var(--deep-nigella);
        color: var(--light-nigella);
    }

.btn-outline-tertiary {
    background-color: var(--white);
    border-color: var(--deep-lavender);
    color: var(--deep-lavender);
}

    .btn-outline-tertiary:hover {
        background-color: var(--deep-lavender);
        border-color: var(--deep-lavender);
        color: var(--white);
    }

    .btn-outline-tertiary:disabled {
        background-color: var(--white);
        border-color: var(--deep-lavender);
        color: var(--light-lavender);
    }

.btn-outline-danger {
    background-color: var(--white);
    border-color: var(--deep-rose);
    color: var(--deep-rose);
}

    .btn-outline-danger:hover {
        background-color: var(--deep-rose);
        border-color: var(--deep-rose);
        color: var(--white);
    }

    .btn-outline-danger:disabled {
        background-color: var(--white);
        border-color: var(--deep-rose);
        color: var(--light-rose);
    }



.alert.alert-primary {
    color: var(--deep-sage);
    background-color: var(--pale-sage);
    border-color: var(--deep-sage);
}
.alert.alert-info {
    color: var(--deep-cornflower);
    background-color: var(--pale-cornflower);
}
.alert.alert-warning {
    color: var(--deep-saffron);
    background-color: var(--pale-saffron);
    border-color: var(--deep-saffron);
}
.alert.alert-danger {
    color: var(--deep-rose);
    background-color: var(--pale-rose);
    border-color: var(--deep-rose);
}

.table-primary th, .table-primary thead th {
    border-color: var(--deep-sage);
}

.table-primary th {
    border-top-color: var(--deep-sage);
    background-color: var(--dark-sage);
    color: var(--white);
}

.table-primary th a {
    color: var(--white);
}

.table-primary td {
        border-color: var(--medium-sage)
    }

.table-primary.table-striped tr:nth-child(odd) td {
    background-color: var(--white);
    --bs-table-bg-type: var(--white);
}

.table-primary.table-striped tr:nth-child(even) td {
    background-color: var(--shallow-sage);
    --bs-table-bg-type: var(--shallow-sage);
}

.table-primary.table-hover tr:hover td {
    background-color: var(--pale-sage);
}

.table-primary.table-layout > tfoot > tr > td {
    background-color: var(--pale-sage) !important;
}

.table-secondary th {
    border-top-color: var(--deep-nigella);
    background-color: var(--dark-nigella);
    color: var(--white);
}

.table-secondary td {
    background-color: var(--white);
}

    .table-secondary th a {
        color: var(--white);
    }

.table-secondary td {
    border-color: var(--medium-nigella)
}

.table-secondary.table-striped tbody tr:nth-child(odd) td {
    background-color: var(--white);
    --bs-table-bg-type: var(--white);
}

.table-secondary.table-striped tbody tr:nth-child(even) td {
    background-color: var(--shallow-nigella);
    --bs-table-bg-type: var(--shallow-nigella);
}

.table-secondary.table-hover tbody tr:hover td {
    background-color: var(--light-nigella);
}

.table-secondary tfoot tr td {
    background-color:var(--medium-nigella);
}

.table-tertiary th {
    border-top-color: var(--deep-cornflower);
    background-color: var(--dark-cornflower);
    color: var(--white);
}

    .table-tertiary th a {
        color: var(--white);
    }

.table-tertiary td {
    border-color: var(--medium-cornflower)
}

.table-tertiary.table-striped tbody tr:nth-child(odd) td {
    background-color: var(--white);
    --bs-table-bg-type: var(--white);
}

.table-tertiary.table-striped tbody tr:nth-child(even) td {
    background-color: var(--shallow-cornflower);
    --bs-table-bg-type: var(--shallow-cornflower);
}

.table-tertiary.table-hover tbody tr:hover td {
    background-color: var(--pale-cornflower);
}

.table-tertiary tr.pager td, .table-tertiary tr.pager:hover > td, .table-tertiary tr.footer > td {
    background-color: var(--dark-cornflower);
}

.table-tertiary tr.pager table tr td  {
    background-color: var(--pale-cornflower);
}
.table-tertiary tr.pager table tr td:hover {
    background-color: var(--medium-cornflower);
}

.modal-dialog.modal-dialog-secondary .modal-header {
    background-color: var(--dark-nigella);
    color: var(--white);
}

.modal-dialog.modal-dialog-secondary .modal-footer {
    background-color: var(--medium-nigella);
    color: var(--white);
}

.modal-header-danger {
    background-color:var(--dark-rose);
}

.bg-danger {
    background-color:var(--dark-rose) !important;
}

.page-item {
    border-color: var(--deep-sage);
}

    .page-item.active .page-link {
        background-color: var(--dark-sage);
        border-color: var(--deep-sage);
    }

.page-link {
    color: var(--dark-sage);
}

.page-link:hover {
    color: var(--deep-sage);
}

.DetailsTbl > tbody > tr >td {
    padding:6px 5px 6px 5px ;
}

.DetailsTbl > tbody > tr {
    border-top: 1px solid var(--pale-nigella);
    border-bottom: 1px solid var(--pale-nigella);
}
.DetailsTbl > tbody > tr:nth-child(even) > td {
    background-color: var(--shallow-nigella);
}

    .DetailsTbl > tbody > tr.section {
        border-top:2px solid var(--medium-nigella);
    }