/* Minification failed. Returning unminified contents.
(3,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(4,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(5,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(8,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(10,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(11,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(12,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(13,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(14,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(15,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(16,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(18,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(20,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(21,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(22,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(24,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(25,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(27,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(28,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(29,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(31,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(32,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(33,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(34,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(75,28): run-time error CSS1039: Token not allowed after unary operator: '-formbackgroundcolor'
(95,23): run-time error CSS1039: Token not allowed after unary operator: '-row-details-height'
(103,28): run-time error CSS1039: Token not allowed after unary operator: '-btnprimarybackgroundcolor'
(106,32): run-time error CSS1039: Token not allowed after unary operator: '-btnprimarybackgroundcolor'
(109,32): run-time error CSS1039: Token not allowed after unary operator: '-btnprimarybackgroundcolor'
(112,32): run-time error CSS1039: Token not allowed after unary operator: '-btnprimarybackgroundcolor'
(129,24): run-time error CSS1039: Token not allowed after unary operator: '-tbordercolor'
(135,28): run-time error CSS1039: Token not allowed after unary operator: '-tbodybackgroundcolor'
(136,24): run-time error CSS1039: Token not allowed after unary operator: '-tdbordercolor'
(139,32): run-time error CSS1039: Token not allowed after unary operator: '-tbodyhoverbackgroundcolor'
(140,28): run-time error CSS1039: Token not allowed after unary operator: '-tdbordercolor'
(144,28): run-time error CSS1039: Token not allowed after unary operator: '-theaderbackgroundcolor'
(145,24): run-time error CSS1039: Token not allowed after unary operator: '-tdbordercolor'
(150,17): run-time error CSS1039: Token not allowed after unary operator: '-tabletextcolor'
(158,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(159,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(160,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(161,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(162,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(163,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(164,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(171,17): run-time error CSS1039: Token not allowed after unary operator: '-tabletextcolor'
(175,21): run-time error CSS1039: Token not allowed after unary operator: '-tabletextcolor'
(180,17): run-time error CSS1039: Token not allowed after unary operator: '-tabletextcolor'
(195,17): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(200,17): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(201,24): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(210,17): run-time error CSS1039: Token not allowed after unary operator: '-buttontextcolor'
(211,24): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(219,28): run-time error CSS1039: Token not allowed after unary operator: '-btndangerbackgroundcolor'
(226,28): run-time error CSS1039: Token not allowed after unary operator: '-btnprimarybackgroundcolor'
(263,17): run-time error CSS1039: Token not allowed after unary operator: '-formtextcolor'
(268,17): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(272,17): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(274,28): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(275,31): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(291,21): run-time error CSS1039: Token not allowed after unary operator: '-navtextcolor'
(295,25): run-time error CSS1039: Token not allowed after unary operator: '-navhovertextcolor'
(299,17): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(306,28): run-time error CSS1039: Token not allowed after unary operator: '-formbackgroundcolor'
(321,28): run-time error CSS1039: Token not allowed after unary operator: '-cardfieldcolor'
(322,24): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(323,17): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(332,28): run-time error CSS1039: Token not allowed after unary operator: '-navbackgroundcolor'
(341,28): run-time error CSS1039: Token not allowed after unary operator: '-navbackgroundcolor'
(356,28): run-time error CSS1039: Token not allowed after unary operator: '-formbackgroundcolor'
(366,28): run-time error CSS1039: Token not allowed after unary operator: '-footerbackgroundcolor'
(372,17): run-time error CSS1039: Token not allowed after unary operator: '-footertextcolor'
(375,21): run-time error CSS1039: Token not allowed after unary operator: '-footertextcolor'
(392,28): run-time error CSS1039: Token not allowed after unary operator: '-ddhbackgroundcolor'
(393,17): run-time error CSS1039: Token not allowed after unary operator: '-ddhtextcolor'
(398,17): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(402,28): run-time error CSS1039: Token not allowed after unary operator: '-ddhhovercolor'
(403,17): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(407,28): run-time error CSS1039: Token not allowed after unary operator: '-ddhhovercolor'
(408,17): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(430,28): run-time error CSS1039: Token not allowed after unary operator: '-formbackgroundcolor'
(437,32): run-time error CSS1039: Token not allowed after unary operator: '-formbackgroundcolor'
(458,28): run-time error CSS1039: Token not allowed after unary operator: '-formbackgroundcolor'
(459,17): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(475,17): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(482,39): run-time error CSS1039: Token not allowed after unary operator: '-formbackgroundcolor'
(496,17): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(514,17): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(515,24): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(516,28): run-time error CSS1039: Token not allowed after unary operator: '-formbackgroundcolor'
(519,32): run-time error CSS1039: Token not allowed after unary operator: '-theaderbackgroundcolor'
(520,28): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(521,21): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(524,32): run-time error CSS1039: Token not allowed after unary operator: '-formbackgroundcolor'
(525,28): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(526,21): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(534,17): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(554,17): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(590,28): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(593,17): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(594,28): run-time error CSS1039: Token not allowed after unary operator: '-cardfieldcolor'
(601,21): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(660,8): run-time error CSS1030: Expected identifier, found '.'
(660,12): run-time error CSS1031: Expected selector, found ')'
(660,12): run-time error CSS1025: Expected comma or open brace, found ')'
(666,34): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(667,33): run-time error CSS1039: Token not allowed after unary operator: '-icon-color'
(671,28): run-time error CSS1039: Token not allowed after unary operator: '-ddhbackgroundcolor'
(685,17): run-time error CSS1039: Token not allowed after unary operator: '-tabletextcolor'
(697,28): run-time error CSS1039: Token not allowed after unary operator: '-cardbackgroundcolor'
(698,38): run-time error CSS1039: Token not allowed after unary operator: '-cardshadowcolor'
(699,17): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(702,32): run-time error CSS1039: Token not allowed after unary operator: '-cardfieldcolor'
(705,32): run-time error CSS1039: Token not allowed after unary operator: '-cardfieldcolor'
(710,28): run-time error CSS1039: Token not allowed after unary operator: '-cardbackgroundcolor'
(711,38): run-time error CSS1039: Token not allowed after unary operator: '-cardshadowcolor'
(712,17): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(715,32): run-time error CSS1039: Token not allowed after unary operator: '-cardbackgroundcolor'
(716,21): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
(719,32): run-time error CSS1039: Token not allowed after unary operator: '-cardbackgroundcolor'
(720,21): run-time error CSS1039: Token not allowed after unary operator: '-cardtextcolor'
 */
:root {
    /*Nav*/
    --navbackgroundcolor: #000000;
    --navtextcolor: #FBF7F4;
    --navhovertextcolor: #f1f1f1;
    /*Body*/
    --formbackgroundcolor: #40576E !important;
    --formtextcolor: #FBF7F4 !important;
    /*Table*/
    --theaderbackgroundcolor: #AFCED4;
    --tbodybackgroundcolor: #FBF7F4;
    --tbodyhoverbackgroundcolor: #AFCED4;
    --tbordercolor: #0C0C0C;
    --tdbordercolor: #FBF7F4;
    --row-details-height: 1.5rem;
    --tabletextcolor: #0C0C0C;
    /*Icons*/
    --icon-color: #FBF7F4;
    /*Buttons*/
    --buttontextcolor: #FBF7F4;
    --btnprimarybackgroundcolor: #40576E;
    --btndangerbackgroundcolor: #0C0C0C;
    /*Footer*/
    --footerbackgroundcolor: #000000;
    --footertextcolor: #FBF7F4;
    /*Dropdowns*/
    --ddhbackgroundcolor: #AFCED4;
    --ddhhovercolor: #578DA3;
    --ddhtextcolor: #0C0C0C;
    /*Card*/
    --cardbackgroundcolor: #578DA3;
    --cardtextcolor: #0C0C0C;
    --cardfieldcolor: #AFCED4;
    --cardshadowcolor: #578DA3;
}

@font-face {
    font-family: Apercu-Pro-Regular; /*a name to be used later*/
    src: url("/Content/COP/Desktop/Fonts/Apercu-Font-Family/Apercu-Pro-Regular.ttf"); /*URL to font*/
}

/* Set the size, colour, font properties for the blinking text */
.blinking {
    animation: blinkingText 0.8s 5 normal;
    color: pink;
    border-color: red;
}

/* Specifies the animation and transparency for the blinking text */
@keyframes blinkingText {
    0% {
        opacity: .2;
    }

    50% {
        opacity: .6;
    }

    100% {
        opacity: 1;
    }
}

.infoRight {
    text-align: right;
}

input::-ms-reveal,
input::-ms-clear {
    display: none;
}

/*Modal*/
.modal-content {
    background-color: var(--formbackgroundcolor);
    
}

/*Containers*/
.container-left {
    float: left;
    width: 70%;
}

.container-right {
    float: right;
    width: 30%;
}

.bordered {
    border: 5px solid black;
}

.col-height {
    padding-top: var(--row-details-height);
}

.container {
    background-color: #40576E;
}

.btn-primary {
    background-color: var(--btnprimarybackgroundcolor)
}
    .btn-primary:hover {
        background-color: var(--btnprimarybackgroundcolor)
    }
    .btn-primary:active {
        background-color: var(--btnprimarybackgroundcolor)
    }
    .btn-primary:focus {
        background-color: var(--btnprimarybackgroundcolor)
    }

/*Tables*/
.table-normal {
    width: 60%;
}

.table-lg {
    width: 80%;
}

.table-xl {
    width: 100%;
}

table {
    border-color: var(--tbordercolor) !important;
    border: 2px solid;
    margin: 0px !important;
}

tbody tr {
    background-color: var(--tbodybackgroundcolor) !important;
    border-color: var(--tdbordercolor) !important;
}
    tbody tr:hover {
        background-color: var(--tbodyhoverbackgroundcolor) !important;
        border-color: var(--tdbordercolor) !important;
    }

thead tr {
    background-color: var(--theaderbackgroundcolor) !important;
    border-color: var(--tdbordercolor) !important;
}

td {
    text-align: left !important;
    color: var(--tabletextcolor) !important;
}

th {
    font-size: 1.02rem !important;
}

.thead-dark {
    --bs-table-bg: #AFCED4;
    --bs-table-striped-bg: #AFCED4;
    --bs-table-striped-color: #FBF7F4;
    --bs-table-active-bg: #AFCED4;
    --bs-table-active-color: #FBF7F4;
    --bs-table-hover-bg: #AFCED4;
    --bs-table-hover-color: #FBF7F4;
    color: #0C0C0C;
    border-color: #0C0C0C;
}

/*Tabs*/
.text-tab-color {
    color: var(--tabletextcolor) !important;
    border: 1px solid black !important;
}
    .text-tab-color:hover {
        color: var(--tabletextcolor) !important;
        border: 1px solid black !important;
    }

.tablinks {
    color: var(--tabletextcolor) !important;
    border: 1px solid black !important;
}

/*Icons*/
.fa-angle-up,
.fa-angle-down,
.fa-plus,
.fa-save,
.fa-times,
.fa-edit,
.fa-map-marker-alt,
.far fa-handshake,
.fa-eraser,
.fa-file-signature {
    color: var(--icon-color);
}

.fa fa-filter {
    font-size: 24px !important;
    color: var(--icon-color) !important;
    border-color: var(--icon-color) !important;
    border-width: 1px !important;
}

/*Buttons*/
.btn,
.btn:hover,
.btn:active,
.btn-focus {
    color: var(--buttontextcolor) !important;
    border-color: var(--icon-color) !important;
    border-width: 1px !important;
}

.btn-danger,
.btn-danger:hover,
.btn-danger:active,
.btn-danger:focus {
    background-color: var(--btndangerbackgroundcolor);
}

.btn-success,
.btn-success:hover,
.btn-success:active,
.btn-success:focus {
    background-color: var(--btnprimarybackgroundcolor);
}

.btnback, .btnback:hover {
    color: black !important;
    background-color: dimgrey;
}

#buttonsection {
    width: 100% !important;
    padding-left: .4rem !important;
    padding-right: .4rem !important;
}

a.btn {
    max-width: 280px;
}

div.dropdown {
    padding: 0px !important;
}

/*Text*/
.uppercase {
    text-transform: uppercase;
}

h1,
h2,
h3,
h4,
h5,
p,
dt,
.jumbotron,
.errortext,
.displaycolor {
    color: var(--formtextcolor) !important;
}

.control-label,
td {
    color: var(--cardtextcolor);
}

.navheaders {
    color: var(--icon-color);
    font-weight: bold;
    border-top-color: var(--icon-color);
    border-bottom-color: var(--icon-color);
    display: block;
    border-top: 1px solid;
    border-bottom: 1px solid;
}

/*NavBar*/
.sidenav {
    z-index: 1;
    overflow-x: hidden;
    text-align: center;
    height: 100%
}
    .sidenav a {
        padding: 6px;
        text-decoration: none;
        color: var(--navtextcolor);
        display: block;
    }
        .sidenav a:hover {
            color: var(--navhovertextcolor);
        }

.navcollapseicon {
    color: var(--icon-color);
    text-align: center;
}

/*Body*/
body {
    padding-bottom: 20px;
    background-color: var(--formbackgroundcolor);
    height: 100%;
    font-family: Apercu-Pro-Regular;
}
    body b {
        font-family: Apercu-Pro-Regular;
    }

.body-content {
    margin-top: 25px !important;
}

.form-control,
.form-control:focus,
.jumbotron {
    background-color: var(--cardfieldcolor) !important;
    border-color: var(--icon-color) !important;
    color: var(--cardtextcolor);
}

.navlocation {
    position: fixed;
    top: 0rem;
    left: 0rem;
    width: 20rem;
    height: 100%;
    background-color: var(--navbackgroundcolor);
}

.buttonlocation {
    position: fixed;
    top: 0rem;
    right: 0rem;
    width: 7rem;
    height: 100%;
    background-color: var(--navbackgroundcolor);
}
    .buttonlocation .center:before {
        margin: 0px;
    }

.mainlocation {
    position: fixed;
    top: 1rem;
    left: 22rem;
    right: 9rem;
    bottom: 2.5rem;
    padding-bottom: 1rem;
    padding-right: 1rem;
    overflow: auto;
    background-color: var(--formbackgroundcolor);
}

.maincontainer {
    margin: 2rem;
    height: 100%;
}

/*Footer*/
.footerlocation {
    background-color: var(--footerbackgroundcolor);
    position: fixed;
    bottom: 0rem;
    left: 20rem;
    right: 7rem;
    text-align: center;
    color: var(--footertextcolor);
}
    .footerlocation p {
        color: var(--footertextcolor);
    }

/*ComboBox*/
.dropdown-toggle[role=combobox]:focus {
    outline: none !important;
    text-align: left !important;
}

/*Dropdown Menus*/
.dropdown-menu,
.dropdown-toggle,
.dropdown-toggle.bs-placeholder,
.dropdown-toggle.bs-placeholder:hover,
.dropdown-toggle.bs-placeholder:active,
.dropdown-toggle.bs-placeholder:focus,
.filter-option {
    background-color: var(--ddhbackgroundcolor) !important;
    color: var(--ddhtextcolor) !important;
}

.dropdown-item {
    text-align: center;
    color: var(--cardtextcolor);
}

.dropdown-item:active, .dropdown-item.active {
    background-color: var(--ddhhovercolor) !important;
    color: var(--cardtextcolor) !important;
}

.dropdown-item:hover {
    background-color: var(--ddhhovercolor) !important;
    color: var(--cardtextcolor) !important;
}

.dropdown-header {
    display: block;
    padding: 0.1rem 1rem !important;
    font-weight: bold;
    text-decoration: underline;
    margin-bottom: 0;
    white-space: nowrap;
}

a[role=option] {
    text-align: left !important;
}

.icononly {
    width: 50px;
    max-width: 50px;
}

button[role=combobox] {
    background-color: var(--formbackgroundcolor);
    border: 1px solid #ced4da;
}
    button[role=combobox]:focus {
        outline: none !important;
        text-align: left !important;
        color: #212529;
        background-color: var(--formbackgroundcolor);
        border-color: #86b7fe;
        box-shadow: 0 0 0 .25rem rgba(13,110,253,.25);
    }

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

/*TextAreas*/
textarea {
    background-color: var(--formbackgroundcolor);
    color: var(--cardtextcolor);
    /*calculate a text area using: font height * line height * number of desired lines*/
    height: calc(1em * 1.55 * 5) !important;
}

/*Sets all control labels to bold*/
.control-label {
    font-weight: bold;
    padding-right: 10px;
}

/*Styling for all page seperators*/
.separator {
    display: flex;
    align-items: center;
    text-align: center;
    color: var(--cardtextcolor);
    font-weight: bold;
    font-size: 20px;
}
    .separator::before, .separator::after {
        content: '';
        flex: 1;
        border-bottom: 1px solid var(--formbackgroundcolor);
    }
    .separator::before {
        margin-right: .25em;
    }
    .separator::after {
        margin-left: .25em;
    }

/*Styling for all page seperators*/
.separator {
    display: flex;
    align-items: center;
    text-align: center;
    color: var(--cardtextcolor);
    font-weight: bold;
    font-size: 20px;
}
    .separator::before, .separator::after {
        content: '';
        flex: 1;
        border-bottom: 1px solid #b2b2b2;
    }
    .separator::before {
        margin-right: .25em;
    }
    .separator::after {
        margin-left: .25em;
    }

/*Pagination*/
.pagination {
    color: var(--cardtextcolor) !important;
    border-color: var(--icon-color) !important;
    background-color: var(--formbackgroundcolor) !important;
}
    .pagination .active a {
        background-color: var(--theaderbackgroundcolor) !important;
        border-color: var(--icon-color) !important;
        color: var(--cardtextcolor) !important;
    }
    .pagination .disabled a {
        background-color: var(--formbackgroundcolor) !important;
        border-color: var(--icon-color) !important;
        color: var(--cardtextcolor) !important;
    }

/*Center Element*/
.center {
    display: flex;
    align-items: center;
    text-align: left;
    color: var(--cardtextcolor);
    font-weight: normal;
}
    .center::before, .center::after {
        content: '';
        flex: 1;
        border-bottom: 1px;
    }
    .center::before {
        margin-right: .25em;
    }
    .center::after {
        margin-left: .25em;
    }

/*Left Element*/
.left {
    display: flex;
    align-items: start;
    text-align: start;
    color: var(--cardtextcolor);
    font-weight: normal;
}

/*Set Element Width*/
.width-sm {
    width: 120px;
    max-width: 120px;
}

width-md {
    width: 201px;
    max-width: 201px;
}

.standardwidth {
    width: 282px;
    max-width: 282px;
}

.width-lg {
    width: 350px !important;
    max-width: 350px !important;
}

.width-xl {
    width: 500px !important;
    max-width: 500px !important;
}

/*Checkboxes*/
input[type=checkbox] {
    -webkit-appearance: initial;
    appearance: initial;
    width: 26px;
    height: 26px;
    border: 1px solid var(--icon-color);
    border-radius: .375rem;
    position: relative;
    color: var(--cardtextcolor);
    background-color: var(--cardfieldcolor);
    display: block;
}
    input[type=checkbox]:checked:after {
        content: "✓";
        font-weight: bold;
        font-family: Courier New, monospace;
        color: var(--cardtextcolor);
        position: absolute;
        font-size: 24px;
        left: 50%;
        top: 62%;
        -webkit-transform: translate(-50%,-50%);
        -moz-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%);
    }

/*Button Groups*/
.btn-group {
    white-space: normal;
}

/*Sticky Buttons*/
.btn-nav-sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 72px;
    background-color: transparent;
    /*z-index: 1;*/
}

.container-btn-nav {
    padding-top: 10px;
    padding-bottom: 10px;
}

/*Form Control*/
.form-control {
    padding: 0px 3px 0px 3px !important;
}

button[role="combobox"] {
    padding: 0px 3px 0px 3px !important;
}

th {
    font-size: 0.7rem;
}

td {
    font-size: 0.7rem;
}

.search-area .col {
    line-height: 20px !important;
    max-height: 50px !important;
}

.form-container {
    max-width: 50%;
    background-color: white;
    border: 3px solid black;
    padding-bottom: 1rem;
}

a:has(a.btn) {
    max-width: 280px;
}

/*Nav Buttons*/
.nav-btn {
    border-right: 2px solid var(--icon-color);
    border-left: 2px solid var(--icon-color);
}

.navbar, .footer {
    background-color: var(--ddhbackgroundcolor) !important;
}

.nav-color, .footer {
    color: black;
    font-size: 20px;
}
    .nav-color:hover {
        color: dimgray;
    }

.nav-link {
    display: block;
    padding: 0.1rem .5rem !important;
    color: var(--tabletextcolor);
    text-decoration: none;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}

a {
    color: #0000ee;
    text-decoration: underline;
}

.container-card {
    padding: 10px 10px 10px 10px !important;
    background-color: var(--cardbackgroundcolor) !important;
    box-shadow: 1px 1px 2px 3px var(--cardshadowcolor) !important;
    color: var(--cardtextcolor) !important;
}
    .container-card.form-control {
        background-color: var(--cardfieldcolor) !important;
    }
    .container-card.control-label {
        background-color: var(--cardfieldcolor) !important;
    }

.pagination {
    padding: 10px 10px 10px 10px !important;
    background-color: var(--cardbackgroundcolor) !important;
    box-shadow: 1px 1px 2px 3px var(--cardshadowcolor) !important;
    color: var(--cardtextcolor) !important;
}
    .pagination .disabled a {
        background-color: var(--cardbackgroundcolor) !important;
        color: var(--cardtextcolor) !important;
    }
    .pagination li a {
        background-color: var(--cardbackgroundcolor) !important;
        color: var(--cardtextcolor) !important;
    }

.spacer-min {
    margin: 1rem;
}

.spacer {
    margin: 3rem;
}

.spacer-max {
    margin: 5rem;
}


.cardbackground {
    background-color: #578DA3;
    border: 4px solid black;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}