@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&display=swap');

:root {
    --bs-blue: #0d6efd;
    --bs-indigo: #6610f2;
    --bs-purple: #6f42c1;
    --bs-pink: #d63384;
    --bs-red: #dc3545;
    --bs-orange: #fd7e14;
    --bs-yellow: #ffc107;
    --bs-green: #198754;
    --bs-teal: #20c997;
    --bs-cyan: #0dcaf0;
    --bs-white: #fff;
    --bs-gray: #6c757d;
    --bs-gray-dark: #343a40;
    --bs-gray-100: #f8f9fa;
    --bs-gray-200: #e9ecef;
    --bs-gray-300: #dee2e6;
    --bs-gray-400: #ced4da;
    --bs-gray-500: #adb5bd;
    --bs-gray-600: #6c757d;
    --bs-gray-700: #495057;
    --bs-gray-800: #343a40;
    --bs-gray-900: #212529;
    --bs-primary: #0d6efd;
    --bs-secondary: #6c757d;
    --bs-success: #198754;
    --bs-info: #0dcaf0;
    --bs-warning: #ffc107;
    --bs-danger: #dc3545;
    --bs-light: #f8f9fa;
    --bs-dark: #212529;
    --bs-primary-rgb: 13, 110, 253;
    --bs-secondary-rgb: 108, 117, 125;
    --bs-success-rgb: 25, 135, 84;
    --bs-info-rgb: 13, 202, 240;
    --bs-warning-rgb: 255, 193, 7;
    --bs-danger-rgb: 220, 53, 69;
    --bs-light-rgb: 248, 249, 250;
    --bs-dark-rgb: 33, 37, 41;
    --bs-white-rgb: 255, 255, 255;
    --bs-black-rgb: 0, 0, 0;
    --bs-body-rgb: 33, 37, 41;
    --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
    --bs-body-font-family: var(--bs-font-sans-serif);
    --bs-body-font-size: .8rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1rem;
    --bs-body-color: #212529;
    --bs-body-bg: #fff;
}

html {
    font-size: 14px;
    font-family: "Instrument Sans", sans-serif;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
    font-family: "Instrument Sans", sans-serif;
}

/** Custom Implementation of Bootstrap Settings Below **/

.table > :not(caption) > * > * {
    padding: 0.2rem 0.2rem;
    background-color: var(--bs-table-bg);
    border-bottom-width: 1px;
    box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg);
}

.form-control {
    display: block;
    width: 100%;
    padding: 0.25rem 0.25rem;
    font-size: .8rem;
    font-weight: 400;
    line-height: 1;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.full-width {
    width: 100%;
}

h1, h2, h3, h4, h5, h6 {
    color: #0d2753;
    font-family: "Plus Jakarta Sans", sans-serif;
}

select {
    height: 22px;
    border-radius: 0.25rem;
}

textarea {
    border-radius: 0.25rem;
}

a {
    text-decoration: none;
}

    a:hover {
        text-decoration: underline;
    }

.table-striped > tbody td {
    border-color: inherit;
    border-style: solid;
    border-width: 1px;
}

.control-label {
    padding-top: .45rem;
    color: #0d2753;
    font-weight: bold;
}
/** Custom classes below **/
.blueText {
    color: #0d2753;
}

th.thSort {
    cursor: pointer;
    /*background-color: #003466;*/
    padding: 0.4rem 0.4rem;
    background-color: #10564f;
    color: #ffffff;
    border: 1px #ffffff solid;
    text-align: center;
}

th.thNoSort {
    /*background-color: #003466;*/
    padding: 0.4rem 0.4rem;
    background-color: silver;
    color: black;
    border: 1px black solid;
    text-align:center;
}

/*tr:first-child th:first-child {
    border-top-left-radius: 5px;
}

tr:first-child th:last-child {
    border-top-right-radius: 5px;
}
*/
thead th {
    /*background-color: #003466;
    color: white;*/
    color: #0d2753;
    font-weight: bolder;
    padding: 0.4rem 0.4rem;
}

thead tr {
    border-radius: .25rem
}

.hidden {
    display: none;
}

.disabled {
    color: #6c757d;
    pointer-events: none;
    cursor: default;
}

.tableHeader {
    /*background-color: #003466;*/
    padding: 0.4rem 0.4rem;
    background-color: lightgray;
    border: 1px #0d2753 solid;
    text-align: center;
    font-size: 1.5em;
}

/***Navbar Background Color, Border Removed ,Border Radius Sqaure***/
.navbar.navbar-custom.actionbar .navbar-nav > li > a {
    color: white;
    padding-left: .75rem;
    padding-right: .75rem;
}

    .navbar.navbar-custom.actionbar .navbar-nav > li > a:hover {
        color: white;
        text-decoration: none;
    }

.navbar.navbar-custom.actionbar .navbar-nav > li > input {
    color: white;
    padding: .5rem .75rem .5rem .75rem;
}

.actionbar.navbar.navbar-custom .navbar-nav > li > a {
    font-size: .8rem;
}

.navbar.actionbar.nomargin {
    margin-top: 0px;
    margin-bottom: 0px;
}

input.nav-link {
    background-color: transparent;
    color: white;
    border: none;
    padding-top: 0px;
    padding-bottom: 0px;
}

.navbar.actionbar {
    padding: 0px;
    margin-top: 2px;
    margin-bottom: 2px;
    width: 701px;
}

.navbar.navbar-custom {
    background: #0d2753;
    border: none;
    /*border-radius: 0;*/
    color: white;
}

div.actionbar {
    padding: 0px;
}

.actionbar {
    border-radius: 5px;
}

.headerbar {
    background: #0d2753;
    border: none;
    border-radius: 0;
    color: white;
    width: 701px;
    padding: 8px;
}

.nav-item.left-border {
    border-left: 1px white solid;
}

.nav-item.right-border {
    border-right: 1px white solid;
}

span.nav-link {
    color: white;
}

    span.nav-link:hover {
        color: white;
    }

/***Link Color***/

.navbar.navbar-custom .navbar-nav > li > a {
    color: #0d2753;
    font-size: 1rem;
}
    /***Link Color Hover State***/

    .navbar.navbar-custom .navbar-nav > li > a:hover {
        color: #0d2753;
    }
/***Link Background and Color Active State***/

.navbar.navbar-custom .navbar-nav > .active,
.navbar.navbar-custom .navbar-nav > .active > a,
.navbar.navbar-custom .navbar-nav > .active > a:hover,
.navbar.navbar-custom .navbar-nav > .active > a:focus {
    background: #0d2753;
    color: #fff;
}
/***Navbar Brand Link Color***/

.navbar.navbar-custom .navbar-brand {
    color: #fff;
}
    /***Navbar Brand Link Color Hover State***/

    .navbar.navbar-custom .navbar-brand:hover {
        color: #fff;
    }
/***Dropdown Background Active State***/

.navbar.navbar-custom .nav li.dropdown.open > .dropdown-toggle,
.navbar.navbar-custom .nav li.dropdown.active > .dropdown-toggle,
.navbar.navbar-custom .nav li.dropdown.open.active > .dropdown-toggle {
    background: #0d2753;
    color: #fff;
}
/***Dropdown-menu Background Color***/

.navbar.navbar-custom .dropdown-menu {
    background: #0d2753;
    border: none;
}
    /***Dropdown-menu Color***/

    .navbar.navbar-custom .dropdown-menu > li > a {
        color: #fff;
    }
        /***Dropdown-menu Color Hover and Focus State***/

        .navbar.navbar-custom .dropdown-menu > li > a:hover,
        .navbar.navbar-custom .dropdown-menu > li > a:focus {
            color: #0d2753;
            background: #fff;
        }
/***Toggle Button***/

.navbar.navbar-custom .navbar-header .navbar-toggle {
    border-color: #fff;
}
    /***Toggle Button Hover and Focus State***/

    .navbar.navbar-custom .navbar-header .navbar-toggle:hover,
    .navbar.navbar-custom .navbar-header .navbar-toggle:focus {
        background: #fff;
        border: #0d2753;
    }
/***Collapse Borders***/

.navbar.navbar-custom .navbar-collapse {
    border: none;
}


@media (max-width: 767px) {
    .navbar.navbar-custom li.dropdown .dropdown-menu > li > a {
        color: #fff;
    }
        /***Dropdown-menu Color Hover and Focus State***/
        .navbar.navbar-custom li.dropdown .dropdown-menu > li > a:hover,
        .navbar.navbar-custom li.dropdown .dropdown-menu > li > a:focus {
            color: #fff;
            background: #0d2753;
        }
}


/*** overlay classes ***/
/* The Overlay (background) */
.overlay {
    /* Height & width depends on how you want to reveal the overlay (see JS below) */
    height: 100%;
    width: 100%;
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    background-color: rgb(31,31,31);
    background-color: rgba(31,31,31, 0.9); /* Black w/opacity */
    overflow-x: hidden; /* Disable horizontal scroll */
    transition: 0.000001s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
}

/* Position the content inside the overlay */
.overlay-content {
    position: relative;
    top: 25%; /* 25% from the top */
    width: 100%; /* 100% width */
    text-align: center; /* Centered text/links */
    margin-top: 30px; /* 30px top margin to avoid conflict with the close button on smaller screens */
    color: whitesmoke;
    font-size: x-large;
    font-weight: bold;
}

/* The navigation links inside the overlay */
.overlay a {
    padding: 8px;
    text-decoration: none;
    font-size: 36px;
    color: #FFFFFF;
    display: block; /* Display block instead of inline */
    transition: 0.3s; /* Transition effects on hover (color) */
}

    /* When you mouse over the navigation links, change their color */
    .overlay a:hover, .overlay a:focus {
        color: #f1f1f1;
    }

/* Position the close button (top right corner) */
.overlay .closebtn {
    position: absolute;
    top: 20px;
    right: 45px;
    font-size: 60px;
}

/* Pagination Classes */

.pagination {
    display: flex;
    padding-left: 0;
    list-style: none;
    border-radius: 0.25rem;
}

.paginate_button {
    padding-left: 5px;
    padding-right: 5px;
}

.page-link {
    position: relative;
    display: block;
    padding: 0.5rem 0.75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #007bff;
    background-color: #fff;
    border: 1px solid #dee2e6;
}

    .page-link:hover {
        z-index: 2;
        color: #0056b3;
        text-decoration: none;
        background-color: #e9ecef;
        border-color: #dee2e6;
    }

    .page-link:focus {
        z-index: 2;
        outline: 0;
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
    }

.page-item:first-child .page-link {
    margin-left: 0;
    border-top-left-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
}

.page-item:last-child .page-link {
    border-top-right-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
}

.page-item.active .page-link {
    z-index: 1;
    color: #fff;
    background-color: #007bff;
    border-color: #007bff;
}

.page-item.disabled .page-link {
    color: #6c757d;
    pointer-events: none;
    cursor: auto;
    background-color: #fff;
    border-color: #dee2e6;
}

.pagination-lg .page-link {
    padding: 0.75rem 1.5rem;
    font-size: 1.25rem;
    line-height: 1.5;
}

.pagination-lg .page-item:first-child .page-link {
    border-top-left-radius: 0.3rem;
    border-bottom-left-radius: 0.3rem;
}

.pagination-lg .page-item:last-child .page-link {
    border-top-right-radius: 0.3rem;
    border-bottom-right-radius: 0.3rem;
}

.pagination-sm .page-link {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    line-height: 1.5;
}

.pagination-sm .page-item:first-child .page-link {
    border-top-left-radius: 0.2rem;
    border-bottom-left-radius: 0.2rem;
}

.pagination-sm .page-item:last-child .page-link {
    border-top-right-radius: 0.2rem;
    border-bottom-right-radius: 0.2rem;
}

/* End Pagination Classes */


/* Table Display Classes */
.formlabel {
    padding: 5px 15px 5px 5px;
    font-size: .75rem;
    width: 200px;
    font-weight: bold;
    border: 1px solid #d8d8d8;
    color: #0d2753;
    text-align: right;
    vertical-align: middle;
}

    .formlabel.noborder {
        border: none;
    }

    .formlabel.top {
        vertical-align: top;
    }

.formbody {
    padding: 5px 5px 5px 5px;
    font-size: .75rem;
    width: 500px;
    border: 1px solid #0d2753;
    background-color: #eceff7;
    text-align:left;
    /*background-color: #bad3e4;*/
}

    .formbody.noborder {
        border: none;
    }

/* Table Display Classes */


.form-control-table {
    width: 250px;
    border-radius: 0.25rem;
}

.form-control-table-smaller {
    width: 100px;
    border-radius: 0.25rem;
}

.form-control-table-small {
    width: 150px;
    border-radius: 0.25rem;
}

.form-control-table-large {
    width: 350px;
    border-radius: 0.25rem;
}

.form-control-table-partial {
    width: 100px;
    border-radius: 0.25rem;
}

.form-control-table-date {
    width: 100px;
    border-radius: 0.25rem;
}
/* jQuery UI classes */

.ui-autocomplete-loading {
    background: white url("/images/ajax-loader-small.gif") right center no-repeat;
}

/* End jQuery UI classes */

/* Overwritten Modal Class */

.modal-title {
    line-height: 1.0;
}

.modal-header {
    padding: .5rem .5rem
}

/* End Overwritten Modal Class */

.close {
    border: 1px black solid;
}

.radio-button-list-checkbox {
    margin: 3px;
}

.radio-button-list-label {
    margin: 3px;
}

.align-center {
    text-align: center;
}

.vertical-align-middle {
    vertical-align: middle;
}

input[type='radio'] {
    accent-color: #953d96;
}

.ui-draggable, .ui-droppable {
    background-position: top;
}

/* Begin Classes Used for Merge Pages */

.mergeUnmerged {
    border: 2px yellow solid;
}

.mergeUsed {
    border: 2px green solid;
}

.mergeNotUsed {
    border-color: red;
    border-width: 2px;
    border-style: solid;
}

.mergeTDKeep {
    padding-top: 5px;
    padding-left: 5px;
    padding-right: 5px;
    font-size: .75rem;
    width: 50px;
    border: 1px solid #d8d8d8;
    color: #0d2753;
    text-align: center;
    vertical-align: top;
    background-color: #eceff7
}

/* End Classes Used for Merge Pages */

.noWrap {
    white-space: nowrap
}

.required {
    color: red;
    font-weight: bold;
    font-size: larger;
}

.btn-tile {
    background-color: #0d2753; /*#E1DEDA !important;*/
    color: #ffffff;
    /*text-transform: uppercase;*/
    /*font-weight: 600;*/
    /*width: 80%;*/
    /*border-color: #d3a518;*/
    padding: 4px 50px;
    background-origin: border-box;
    background-repeat: no-repeat;
    background-size: 30px;
    border-radius: .375rem;
}

    .btn-tile:hover {
        /*color: #0d2753;*/ /*#E1DEDA !important;*/
        /*background-color: #d3a518;*/
        /* border-color: #d3a518;*/
        font-weight: 600;
        color: #ffffff;
        padding: 4px 49px;
    }

.btn-tile-inverse {
    color: #0d2753; /*#E1DEDA !important;*/
    background-color: #d3a518;
    border-color: #0d2753;
    text-transform: uppercase;
    font-weight: 600;
    width: 80%;
    padding: 4px 10px;
    background-origin: border-box;
    background-repeat: no-repeat;
    background-size: 30px;
}

    .btn-tile-inverse:hover {
        background-color: #0d2753; /*#E1DEDA !important;*/
        color: #d3a518;
        border-color: #d3a518;
    }

.hover-zoom:hover {
    transform: scale(1.05);
    backface-visibility: hidden;
    -webkit-filter: blur(0);
}

.link-button {
    color: white;
    width: 75%;
    margin-bottom: 10px;
}