/* This stylesheet contains the standard formatting for our public applications */

/**********************************************************************************************************************/
/* BOOTSTRAP COLOR SCHEME OVERRIDES */

:root {
    /***************************/
    /* Labor color scheme vars */
    /***************************/
    --labor-text: #16202b;
    --labor-black: #16202b;
    --labor-white: #fff;
    --labor-blue: #1877aa;
    --labor-darkblue: #165578;
    --labor-green: #50841f;
    --labor-darkgreen: #395e14;
    --labor-yellow: #fec906;
    --labor-darkyellow: #d6aa05;
    /***************************/
    /*** bootstrap overrides ***/
    /***************************/
    --bs-blue: var(--labor-blue);
    --bs-blue-dark: var(--labor-darkblue);
    --bs-blue-light: #bce1f5;
    --bs-blue-lightest: #e9f5fc;
    /*--bs-indigo: #6610f2;*/
    /*--bs-purple: #6f42c1;*/
    /*--bs-pink: #d63384;*/
    /*--bs-red: #dc3545;*/
    /*--bs-orange: #fd7e14;*/
    --bs-yellow: var(--labor-yellow);
    --bs-yellow-dark: var(--labor-darkyellow);
    --bs-green: var(--labor-green);
    --bs-green-dark: var(--labor-darkgreen);
    /*--bs-teal: #20c997;*/
    /*--bs-cyan: #0dcaf0;*/
    --bs-black: #141b25; /* bg footer bottom */
    --bs-white: white;
    --bs-gray: #e5e5e7; /* body */
    --bs-gray-100: #f5f5f7; /* body */
    --bs-gray-200: #dbdbdd;
    --bs-gray-300: #c2c2c4;
    --bs-gray-400: #a8a8aa;
    --bs-gray-500: #979799;
    --bs-gray-600: #7d7d7f;
    --bs-gray-700: #646466;
    --bs-gray-800: #4a4a4c; /* employer card */
    --bs-gray-900: #2b3747; /* social */
    --bs-gray-darkest: #333333;
    --bs-gray-dark: var(--bs-gray-800);
    --bs-gray-light: var(--bs-gray-200);
    --bs-gray-lightest: var(--bs-gray-100);
    --bs-primary: var(--bs-blue);
    /*--bs-secondary: #6c757d;*/
    --bs-success: var(--bs-green);
    /*--bs-info: #0dcaf0;*/
    --bs-warning: var(--bs-yellow);
    /*--bs-danger: #dc3545;*/
    /*--bs-light: #f8f9fa;*/
    /*--bs-dark: #212529;*/
    --bs-primary-rgb: 4, 119, 170;
    /*--bs-secondary-rgb: 108, 117, 125;*/
    --bs-success-rgb: 80, 132, 31;
    /*--bs-info-rgb: 13, 202, 240;*/
    --bs-warning-rgb: 254, 201, 6;
    /*--bs-danger-rgb: 220, 53, 69;*/
    /*--bs-light-rgb: 248, 249, 250;*/
    /*--bs-dark-rgb: 33, 37, 41;*/
    --bs-primary-text-emphasis: var(--bs-blue-dark);
    /*--bs-secondary-text-emphasis: #2b2f32;*/
    --bs-success-text-emphasis: var(--bs-green-dark);
    /*--bs-info-text-emphasis: #055160;*/
    --bs-warning-text-emphasis: var(--bs-yellow-dark);
    --bs-danger-text-emphasis: #58151c;
    /*--bs-light-text-emphasis: #495057;*/
    /*--bs-dark-text-emphasis: #495057;*/
    --bs-primary-bg-subtle: #cfe2ff;
    /*--bs-secondary-bg-subtle: #e2e3e5;*/
    --bs-success-bg-subtle: #d1e7dd;
    /*--bs-info-bg-subtle: #cff4fc;*/
    --bs-warning-bg-subtle: #fff3cd;
    --bs-danger-bg-subtle: #f8d7da;
    /*--bs-light-bg-subtle: #fcfcfd;*/
    /*--bs-dark-bg-subtle: #ced4da;*/
    --bs-primary-border-subtle: #9ec5fe;
    /*--bs-secondary-border-subtle: #c4c8cb;*/
    --bs-success-border-subtle: #a3cfbb;
    /*--bs-info-border-subtle: #9eeaf9;*/
    --bs-warning-border-subtle: #ffe69c;
    /*--bs-danger-border-subtle: #f1aeb5;*/
    /*--bs-light-border-subtle: #e9ecef;*/
    /*--bs-dark-border-subtle: #adb5bd;*/
    /*--bs-white-rgb: 255, 255, 255;*/
    /*--bs-black-rgb: 0, 0, 0;*/
    --bs-font-sans-serif: "Roboto", 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: 16px;
    /*--bs-body-font-weight: 400;*/
    /*--bs-body-line-height: 1.5;*/
    --bs-body-color: #16202a; /* text default, bg footer top */
    /*--bs-body-color-rgb: 33, 37, 41;*/
    --bs-body-bg: var(--bs-white);
    /*--bs-body-bg-rgb: 255, 255, 255;*/
    /*--bs-emphasis-color: #000;*/
    /*--bs-emphasis-color-rgb: 0, 0, 0;*/
    /*--bs-secondary-color: rgba(33, 37, 41, 0.75);*/
    /*--bs-secondary-color-rgb: 33, 37, 41;*/
    /*--bs-secondary-bg: #e9ecef;*/
    /*--bs-secondary-bg-rgb: 233, 236, 239;*/
    /*--bs-tertiary-color: rgba(33, 37, 41, 0.5);*/
    /*--bs-tertiary-color-rgb: 33, 37, 41;*/
    /*--bs-tertiary-bg: #f8f9fa;*/
    /*--bs-tertiary-bg-rgb: 248, 249, 250;*/
    /*--bs-heading-color: inherit;*/
    --bs-link-color: var(--bs-blue);
    /*--bs-link-color-rgb: 13, 110, 253;*/
    /*--bs-link-decoration: underline;*/
    /*--bs-link-hover-color: #0a58ca;*/
    /*--bs-link-hover-color-rgb: 10, 88, 202;*/
    /*--bs-code-color: #d63384;*/
    /*--bs-highlight-color: #212529;*/
    /*--bs-highlight-bg: #fff3cd;*/
    /*--bs-border-width: 1px;*/
    /*--bs-border-style: solid;*/
    /*--bs-border-color: #dee2e6;*/
    /*--bs-border-color-translucent: rgba(0, 0, 0, 0.175);*/
    /*--bs-border-radius: 0.375rem;*/
    /*--bs-border-radius-sm: 0.25rem;*/
    /*--bs-border-radius-lg: 0.5rem;*/
    /*--bs-border-radius-xl: 1rem;*/
    /*--bs-border-radius-xxl: 2rem;*/
    /*--bs-border-radius-2xl: var(--bs-border-radius-xxl);*/
    /*--bs-border-radius-pill: 50rem;*/
    /*--bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);*/
    /*--bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);*/
    /*--bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);*/
    /*--bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);*/
    /*--bs-focus-ring-width: 0.25rem;*/
    /*--bs-focus-ring-opacity: 0.25;*/
    /*--bs-focus-ring-color: rgba(13, 110, 253, 0.25);*/
    --bs-form-valid-color: var(--bs-success);
    --bs-form-valid-border-color: var(--bs-success);
    --bs-form-invalid-color: #dc3545;
    --bs-form-invalid-border-color: #dc3545;
}

.bg-dark {
    background-color: var(--labor-text) !important;
    color: var(--labor-white) !important;
}

/**********************************************************************************************************************/
/* BOILER PLATE STYLING */

body {
    color: var(--labor-text);
    background-color: var(--bs-gray);
    display: flex;
    flex-direction: column;
    margin: 0;
    min-height: 100vh;
    letter-spacing: .5px;
}

a {
    color: var(--bs-blue-dark);
}

.card {
    border: none;
    border-radius: 0;
    border-bottom: 10px solid var(--bs-blue);
    padding: 32px 43px;
    position: relative;
    top: 0;
    box-shadow: 0 8px 40px 0 rgba(0, 0, 0, 0.12);
}

.card {
    border: solid whitesmoke thin;
    border-radius: 15px;
    /*box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);*/
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}
/* IMPORTANT: Never use an header tag for sizing of the text. Headings must follow a logical hierarchy. Instead, use the .h2-.h6 classes for that. */
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    font-family: 'Work Sans', sans-serif;
}

label, .label {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.5rem;
    display: inline;
}

/* Page Header */
.pg-hdr-labor {
    font-family: sans-serif;
    color: var(--bs-blue);
    font-size: 2.2em;
    letter-spacing: 0.5px;
    border-top: 2px solid var(--bs-gray-light);
    border-bottom: 2px solid var(--bs-gray-light);
    padding-top: 5px;
    padding-bottom: 5px;
    margin-bottom: 20px;
    text-align: center;
}


/**********************************************************************************************************************/
/* SITE HEADER */

header {
    z-index: 1;
}

/*----------------------------------------------------------*/
/* TOP BAR */
.env-none {
    background-color: var(--bs-danger);
}

.env-developer {
    background-color: var(--bs-white);
}

.env-dev {
    background-color: lightgreen;
}

.env-test {
    background-color: rosybrown;
}

.env-staging {
    background-color: orange;
}

.env-production {
    background-color: var(--bs-white);
}

#divTopBar {
    z-index: 1;
}

.top-nav, .top-nav > li {
    display: flex;
}

.top-nav {
    height: 3.75rem;
    padding: 0px 0px 0px 0px;
}

#google_translate_element {
    display: flex;
    align-content: center;
    flex-wrap: wrap;
}

#btnSignOut {
    color: var(--bs-blue) !important;
    text-decoration: none;
}

#side-menu > button.btn-link {
    color: var(--bs-blue) !important;
    padding: 0;
}

#side-menu > button:after {
    display: none;
}

.offcanvas-backdrop {
    opacity: .25;
}

#primary-menu {
    --menu-padding-x: 2rem;
    --menu-padding-y: 2rem;
    padding: var(--menu-padding-y) var(--menu-padding-x);
    padding-left: calc(var(--menu-padding-x) - 1rem);
}

#primary-menu .btn-close {
    margin-top: .75rem;
    position: absolute;
    right: var(--menu-padding-x);
    top: var(--menu-padding-y);
    z-index: 10;
}

#primary-menu .btn-close:hover {
    color: #1877aa !important;
    background-position: .25rem .25rem;
    border: none;
    outline: none;
}

.offcanvas ul {
    visibility: visible;
}

.offcanvas-body .list-group-item {
    padding: .5rem 0;
    border: none;
    font-weight: 500;
    margin-left: 1rem
}

.offcanvas-body .list-group-item a {
    text-decoration: none;
}

.offcanvas-body .list-group-item a:not(.btn) {
    color: var(--bs-blue);
}

.offcanvas-body .list-group-item .btn {
    margin-bottom: 0 !important;
    font-weight: 700 !important;
    margin-left: -1rem;
}

.offcanvas-body > .list-group > .list-group-item {
    font-weight: 700;
    color: var(--bs-body-color);
}

.offcanvas-body > .list-group > .list-group-item .list-group-item a:not(.btn):before {
    font-family: "Font Awesome 6 Free";
    font-weight: 600;
    font-size: .75rem;
    content: '\f054';
    position: absolute;
    left: -0.875rem;
    top: .6875rem;
}

#masthead {
    --navbar-height: 3.75rem;
    --banner-height: 18.75rem;
    max-height: calc( --navbar-height + --banner-height );
}

.site-header h1,
.site-header-none h1,
.site-header-development h1,
.site-header-dev h1,
.site-header-test h1,
.site-header-staging h1,
.site-header-production h1 {
    font-family: "Work Sans", sans-serif;
    font-size: 3.125rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    line-height: 60.1412px;
}

.site-header-none h1 {
    color: var(--bs-danger);
}

.site-header-developer h1 {
    color: var(--bs-white);
}

.site-header-dev h1 {
    color: lightgreen;
}

.site-header-test h1 {
    color: rosybrown;
}

.site-header-staging h1 {
    color: orange;
}

.site-header-production h1 {
    color: var(--bs-white);
}

.site-header-alt h1 {
    color: var(--bs-black);
    font-family: "Work Sans", sans-serif;
}

.site-header-image {
    height: 300px;
    display: flex;
    flex-direction: column;
    justify-content: end;
    padding: 60px;
    color: var(--bs-white);
    text-shadow: -1px 3px 10px rgba(0, 0, 0, .75);
    background-image: linear-gradient( 25deg, rgba(28, 28, 29, 0.9) 17%, rgba(28, 28, 29, 0.6) 33%, rgba(28, 28, 29, 0) 50%), url('../img/backdrop-short-jobseeker.jpg');
    background-size: cover;
    background-position: 40% 50%;
}

#int-banner {
    position: relative;
    width: 100%;
    height: var(--banner-height);
    overflow: hidden;
    z-index: 0;
}

#int-banner #int-header-blur {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: 50%;
    filter: blur(20px) brightness(0.75);
}

#int-banner #banner-img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 25%;
    z-index: 0;
    top: 0;
    left: 0;
}

#int-banner #banner-gradient {
    background-image: linear-gradient( 25deg, rgba(28, 28, 29, 0.9) 17%, rgba(28, 28, 29, 0.6) 33%, rgba(28, 28, 29, 0) 50%);
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
}

@media (min-width: 1921px) {
    #int-banner #banner-img {
        position: absolute;
        left: calc(50% - (960px));
        top: calc(55% - (200px));
        width: 1920px;
        height: auto;
        object-fit: unset;
        z-index: 0;
        mask-image: linear-gradient(to left, transparent, black calc((100% - 1224px) / 2), black calc(((100% - 1224px) / 2) + 1224px), transparent);
    }
}

#title-container {
    min-height: var(--banner-height);
    padding-top: 6rem;
    padding-bottom: 3.25rem;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: end;
}

#title-container h1 {
    color: var(--labor-white);
    max-width: 75%;
}

#imgChevron {
    height: 70px;
    width: 97px;
}

#logo {
    z-index: 2000;
}

#AppName1 {
    display: block;
    text-align: center;
}

#AppName2 {
    display: none;
}

#hdrAppName1 {
    color: var(--bs-black);
    font-size: 25pt;
    letter-spacing: 1px;
    margin-top: 9px;
}

#spanAppUser1 {
    display: block;
    padding-top: 7px;
}

#divMobileIdentityArea {
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    text-align: right;
    display: none;
}

#btnHamburgerMenuButton {
    font-size: 20pt;
}

#spnHamburgerMenuButton {
    opacity: 1;
    color: var(--bs-blue);
    background-color: var(--bs-white);
}

/**********************************************************************************************************************/
/* Main Content area */

main {
    flex: 1; /*Fills remaining space*/
    overflow-y: auto;
    min-height: 100%;
    padding: 1rem;
}

#content {
    min-height: 90vh;
    margin-bottom 2rem;
    background-color: rgba(255, 255, 255, 0.96);
    webkit-box-shadow: 0 8px 40px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 8px 40px 0 rgba(0, 0, 0, 0.12);
    z-index: 2;
}

#content hr {
    height: 2px;
    padding: 0;
    border: 0;
    opacity: 1;
    margin: 2rem 0 !important;
    background-color: #16202b;
}

#frmMain > .container {
    padding: 0;
}

/**********************************************************************************************************************/
/* THANK YOU PAGE CONTENT */
.alert-light {
    border-color: var(--bs-gray-300);
    background-color: var(--bs-gray-100);
    webkit-box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.12);
}

/**********************************************************************************************************************/
/* SITE FOOTER */
.tri-footer-top {
    width: 10%;
    height: 50px;
    border-bottom: 25vh solid #1877AA;
    border-right: 99vw solid transparent;
    margin-top: -25vh;
}

#social-links, #social-links a {
    color: var(--bs-white);
    background-color: var(--bs-gray-900);
}

#social-links .col {
    display: flex;
    flex-direction: row;
    justify-content: center;
    column-gap: 1rem;
}

#site-footer {
    color: var(--bs-white);
    background-color: var(--bs-body-color);
}

#top-footer-row {
    padding-top: 3rem;
    background-color: var(--labor-text)
}

#top-footer-row .footer-col {
    margin-bottom: 1rem;
}

#top-footer-row ul {
    list-style: none;
    padding: 0;
}

#top-footer-row h4,
#top-footer-row a {
    display: block;
    color: var(--bs-white);
    font-size: .875rem;
    padding: .25rem 0;
    text-decoration: none;
}

#top-footer-row .footer-col:last-of-type h4 {
    margin-bottom: .125rem;
}

#top-footer-row li:first-child a > h4 {
    padding: 0 !important;
}

#top-footer-row .footer-menus:not(:first-child) > div:last-child a {
    padding-bottom: 0;
}

#top-footer-row .footer-menus:not(:first-child) > div:last-child a:not(:first-child) {
    padding-top: 0;
}

#bottom-footer-row {
    color: var(--labor-white);
    background-color: var(--bs-black);
}

#bottom-footer-row a {
    position: relative;
    color: var(--bs-white);
}

#bottom-footer-row .footer-links a {
    margin-right: 1rem;
}

#bottom-footer-row .footer-links a:after {
    position: absolute;
    right: -.75rem;
    content: "|";
    display: inline-block
}

#bottom-footer-row .footer-links a:last-of-type:after {
    display: none;
}

.footer-links, .eoe, .ajc {
    margin-bottom: .75rem;
}

.ajc-logo {
    width: 12rem;
    max-width: 100%;
    height: auto;
    margin: -.625rem .25rem 0;
}

.navbar .nav-item {
    margin: 0 0 0 1.5rem;
}

.nav-item.translate form {
    display: flex;
    align-items: center;
    height: 100%;
}

.nav-item.translate select.form-control {
    margin-bottom: 0;
    margin-left: .5rem;
    min-width: max-content;
}

/**********************************************************************************************************************/
/* DATA TABLE/GRID STYLING */
/* Filter Box */
.filter-box {
    background-color: var(--bs-gray-lightest);
    border: 1px solid var(--bs-blue-dark);
    border-radius: 10px;
    font-size: 0.9rem;
    padding-top: 15px;
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: 0rem;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
}

.filter-box h2 {
    color: var(--bs-blue-dark);
    margin-bottom: 1rem;
}

/* Form styling reused from previous setup */
.filter-box input[type="text"] {
    margin-right: 0.75rem;
    padding: 0.4rem 0.4rem 0.4rem 0.4rem;
    border: 1px solid var(--bs-gray-300);
    border-radius: 5px;
}

/* Table */
.styled-table {
    width: 100%;
    border-color: var(--bs-black);
    border-collapse: collapse;
    font-family: 'Work Sans', sans-serif;
    font-size: 0.9rem;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
}

.styled-table thead {
    background-color: var(--bs-gray-light);
    font-size: 1rem;
    color: var(--bs-black);
}

.styled-table th, .styled-table td {
    border: none;
    padding: 0.75rem;
    text-align: left;
}

.styled-table th a {
    color: var(--bs-black);
    text-decoration: none;
}

.styled-table th a:hover {
    text-decoration: underline;
    color: var(--bs-black);
}

#gridAddRow {
    display: block;
    width: 100%;
    text-align: center;
    color: var(--bs-white);
    font-weight: 100;
    text-decoration: none;
}

#thead-columns th {
    border: 1px solid var(--bs-gray-400);
}

.styled-table tbody tr {
    background-color: var(--bs-blue-lightest);
}

.styled-table-striped tbody tr:nth-child(even) {
    background-color: var(--bs-white);
}

.styled-table-striped tbody tr:nth-child(odd) {
    background-color: var(--bs-blue-lightest);
}

.styled-table tbody tr:hover {
    background-color: var(--bs-blue-light);
    transition: background-color 0.3s ease;
}

.styled-table tbody td {
    border: 1px solid var(--bs-gray-400);
}

.styled-table tbody a {
    color: var(--bs-white);
    text-decoration: none;
}

/* Full-width Select button for all screen sizes */
.styled-table tbody td:first-child a.btn-datarow-select {
    display: block;
    width: 100%;
    text-align: center;
}

.styled-table tfoot {
    line-height: 1;
}

/* Reduce tfoot row padding */
.styled-table tfoot td {
    padding: 0.25rem 0.5rem;
    vertical-align: top; /* Ensures content aligns nicely without stretching */
}

/* Sticky headers & footers */
.table-frozenheader thead th {
    position: sticky;
    top: 0;
    z-index: 1;
}

.table-frozenheader tfoot {
    position: sticky;
    bottom: 0;
    background-color: var(--bs-gray-light);
    color: var(--bs-white);
    z-index: 1;
}

/* Style the page links */
.styled-table tfoot .page-link {
    color: #007bff;
    background-color: #fff;
    border: 1px solid #dee2e6;
    padding: 6px 12px;
    text-decoration: none;
    border-radius: 4px;
    transition: background-color 0.3s ease;
}

/* Hover effect */
.styled-table tfoot .page-link:hover {
    background-color: #e9ecef;
    color: #0056b3;
}

/* Active page styling */
.styled-table tfoot .page-item.active .page-link {
    background-color: #007bff;
    color: white;
    border-color: #007bff;
}

/* Count of total results */
.results-count {
    color: var(--bs-blue-dark);
    font-weight: bold;
    margin-bottom: 0.75rem;
}

/* Pagination */
.styled-table tfoot .pagination .page-item .page-link {
    color: var(--bs-white);
    background-color: var(--bs-blue-dark);
    border: 1px solid var(--bs-blue-dark);
    border-radius: 4px;
    margin-right: 5px;
    text-decoration: none;
}

/* Hover effect override */
.styled-table tfoot .pagination .page-item .page-link:hover {
    background-color: var(--bs-blue);
    color: white;
}

/* Active page override */
.styled-table tfoot .pagination .page-item.active .page-link {
    background-color: var(--bs-white);
    border-color: var(--bs-blue);
    color: var(--bs-black);
}

/**********************************************************************************************************************/
/* BUTTONS */

.btn-default {
    background-color: var(--bs-blue-dark);
    color: var(--bs-white);
    text-transform: capitalize;
}

.btn-default:hover,
.btn-default:focus {
    background-color: var(--bs-blue);
    color: var(--bs-white);
}

.btn-datarow {
    background-color: var(--bs-blue-dark);
    color: var(--bs-white);
    min-width: 70px;
    text-transform: capitalize;
}

.btn-datarow:hover {
    background-color: var(--bs-blue-dark);
    color: var(--bs-white);
    text-transform: capitalize;
}

.btn-form {
    min-width: 70px;
}

.btn-primary {
    --bs-btn-color: var(--bs-white);
    --bs-btn-bg: var(--bs-blue);
    --bs-btn-border-color: var(--bs-blue);
    --bs-btn-hover-color: var(--bs-white);
    --bs-btn-hover-bg: var(--bs-blue);
    --bs-btn-active-color: var(--bs-white);
    --bs-btn-active-bg: var(--bs-blue);
    --bs-btn-active-bg: var(--bs-blue);
    background-color: #165578 !important;
    border: none;
    box-shadow: rgb(12 50 73) 0 .1875rem;
    transform: translateY(0);
    transition: background .25s ease-in-out, transform .25s ease-in-out, box-shadow .25s ease-in-out !important;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: #1877aa !important;
    box-shadow: #165578 0 .25rem !important;
    transform: translateY(-.0625rem);
    transition: transform .25s ease-in-out, box-shadow .25s ease-in-out;
}

.btn-secondary {
    background-color: var(--bs-gray-700);
}

.btn-secondary:hover {
    background-color: var(--bs-gray-600) !important;
}

.btn-warning {
    --bs-btn-color: var(--bs-black);
    --bs-btn-bg: var(--bs-yellow);
    --bs-btn-border-color: var(--bs-yellow);
    --bs-btn-hover-color: var(--bs-black);
    --bs-btn-hover-bg: var(--bs-yellow);
    --bs-btn-active-color: var(--bs-black);
    --bs-btn-disabled-color: var(--bs-black);
    --bs-btn-disabled-bg: var(--bs-yellow);
    --bs-btn-disabled-border-color: var(--bs-yellow);
    background-color: #fec906 !important;
    border: none;
    box-shadow: #d6aa05 0 .1875rem;
    transform: translateY(0);
    transition: background .25s ease-in-out, transform .25s ease-in-out, box-shadow .25s ease-in-out !important;
}

.btn-warning:hover,
.btn-warning:focus {
    background-color: #ffdd61 !important;
    box-shadow: #d6aa05 0 .25rem !important;
    transform: translateY(-.0625rem);
    transition: transform .25s ease-in-out, box-shadow .25s ease-in-out;
}

.btn-success {
    --bs-btn-color: var(--bs-white);
    --bs-btn-bg: var(--bs-green) !important;
    --bs-btn-border-color: var(--bs-green);
    --bs-btn-hover-color: var(--bs-white);
    --bs-btn-hover-bg: var(--bs-green);
    --bs-btn-active-color: var(--bs-white);
    --bs-btn-disabled-color: var(--bs-white);
    --bs-btn-disabled-bg: var(--bs-green);
    --bs-btn-disabled-border-color: var(--bs-green);
    color: #fff;
    background-color: #395e14 !important;
    border: none;
    box-shadow: #243b0d 0 .1875rem;
    transform: translateY(0);
    transition: background .25s ease-in-out, transform .25s ease-in-out, box-shadow .25s ease-in-out !important;
}

.btn-success:hover,
.btn-success:focus {
    background-color: #50841f !important;
    box-shadow: #395e14 0 .25rem !important;
    transform: translateY(-.0625rem);
    transition: transform .25s ease-in-out, box-shadow .25s ease-in-out;
}

/*.btn:not(#dropZone):not(.btn-link) {
    border: none;
    position: relative;
    top: -2px;
    transition: .25s box-shadow ease-in-out, .25s top ease-in-out;
}

    .btn:not(#dropZone):not(.btn-link):hover {
        top: -4px;
        transition: .25s box-shadow ease-in-out, .25s top ease-in-out;
    }*/
.btn:active {
    background-color: var(--bs-blue-dark);
}

/*.btn.btn-primary {
    background-color: var(--bs-btn-bg) !important;
    box-shadow: 0 4px 0 var(--bs-blue);
}

.btn.btn-success {
    background-color: var(--bs-green) !important;
    box-shadow: 0 4px 0 var(--bs-green-dark) !important;
    color: var(--bs-white);
}

.btn.btn-warning {
    box-shadow: 0 4px 0 var(--bs-yellow-dark);
    color: var(--bs-body-color);
}
*/


/**********************************************************************************************************************/
/* FORMS */

.form-start {
    margin-top: 2rem;
    margin-bottom: 1rem;
}

.form-start > section {
    margin-top: 1rem;
}

.left-col {
    padding-right: 2rem;
    padding-bottom: 1.5rem;
    margin-bottom: 0;
}

.right-col {
    padding-left: 2rem;
    padding-bottom: 1.5rem;
    margin-bottom: 0;
}

.form-control {
    border-color: var(--bs-gray-300);
}

#q5 input, #q10 input {
    margin-bottom: 0;
}

#q11 {
    margin: 2rem 0 1rem;
}

.right-col {
    padding-left: 0
}

@media all and ( min-width: 992px ) {

    .left-col-section {
        padding-right: 0;
    }

    .left-col {
        border-right: 2px solid #ddd;
        border-bottom: 2px solid #ddd;
        padding-right: 1rem;
    }

    .right-col-section {
        padding-left: 1rem;
    }

    .right-col {
        padding-left: 0;
        border-bottom: 2px solid #ddd;
    }
}

@media all and ( min-width: 1400px ) {

    .left-col-section {
        padding-right: 0;
    }

    .left-col {
        padding-right: 2rem;
        padding-bottom: 2rem;
    }

    .right-col-section {
        padding-left: 2rem;
    }

    .right-col {
        padding-left: 0rem;
        padding-bottom: 2rem;
    }
}

.sig-section .card {
    border-radius: .5rem !important;
}

.sig-section .i-certify {
    max-width: 11.25rem;
}
.sig-section .signed {
    max-width: 5.25rem;
}

.col-max {
    max-width: max-content;
}

.input-group label.btn, 
.input-group .form-control {
    height: 40px;
    box-shadow: none;
    align-content: center;
}

.alert p:last-child {
    margin: 0;
}

.text-danger.field-validation-valid {
    display: none;
}

.was-validated .form-group:has(.form-control:invalid) .text-danger.field-validation-valid {
    display: block;
}

.form-control.is-valid, .was-validated .form-control:valid {
    border-color: var(--bs-gray-300);
    background-image: none;
}
.form-control.is-valid:focus, .was-validated .form-control:valid:focus {
    0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb
}

.div-invalid-box {
    background-color: var( --bs-danger-bg-subtle);
    color: var(--bs-black);
    border-radius: 15px;
    margin: 0px 0px 10px 0px;
    padding: 15px 5px 5px 5px;
}

.div-invalid-box label {
    color: var(--bs-danger-text-emphasis);
    padding-left: 10px;
    }

form.card-form {
    background: var(--bs-white);
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    padding: 2rem;
    transition: box-shadow 0.3s ease;
}

form.card-form:hover {
    box-shadow: 0 6px 30px rgba(0, 0, 0, 0.15);
}

form.card-form input:not([type="submit"]),
form.card-form select,
form.card-form textarea {
    width: 100%;
    padding: 0.75rem;
    margin-top: 0.5rem;
    margin-bottom: 1rem;
    border: 1px solid var(--bs-gray-300);
    border-radius: 8px;
    font-size: 1rem;
    box-sizing: border-box;
}

form.card-form button {
    border-radius: 8px;
    /*cursor: pointer;*/
    transition: background-color 0.3s ease;
}

.form-group-alignC {
    text-align: center;
}

.form-group-alignL {
    text-align: left;
}

.form-group-alignR {
    text-align: right;
}


.form-group {
    margin-bottom: 1rem;
}

fieldset {
    background-color: var(--bs-blue-lightest);
    border: 1px solid var(--bs-gray-600) !important;
    margin-bottom: 1em !important;
    padding: 15px !important;
}

legend {
    float: none;
    font-size: 12pt;
    font-weight: bold;
    padding: 0px 0px 0px 0px !important;
    width: auto;
}

.text-danger {
    color: var(--bs-danger-text-emphasis) !important;
}


/**********************************************************************************************************************/
/* SPECIALTY ITEMS */
ul.progression-bar {
    padding: 10px 16px;
    list-style: none;
}

ul.progression-bar li {
    display: inline;
    font-size: 18px;
}

ul.progression-bar li + li:before {
    padding: 8px;
    color: var(--bs-black);
    content: "-";
}

ul.progression-bar li a {
    color: var(--bs-blue);
    text-decoration: none;
}

ul.progression-bar li a:hover {
    color: var(--bs-blue-dark);
    text-decoration: underline;
}


#divSystemAlert {
    padding: 10px 10px 10px 10px;
    background-color: lightgoldenrodyellow;
    font-weight: bold;
    border: solid 2pt var(--bs-black);
}

.div-header-box {
    background-color: var(--bs-gray-lightest);
    border-radius: 10px;
    font-size: 16pt;
    font-weight: bold;
    padding-left: 10px;
    /*padding-bottom: 2px;
    margin-bottom: 5px;*/
}

/*-------------------------------------------------*/
/* Breadcrumbs */

#breadcrumbs {
    background-color: var(--labor-text);
}

.breadcrumb {
    margin-bottom: 0;
    padding: 1rem 1rem 1rem calc(1rem - 10px);
}

li.breadcrumb-item {
    display: inline-block;
}

ol.breadcrumb > li.breadcrumb-item {
    color: var(--bs-white);
    font-weight: 500;
}
.breadcrumb-item + .breadcrumb-item::before {
    color: var(--bs-gray-500);
    padding: 0 .5rem 0 .25rem;
}
.breadcrumb-item + .breadcrumb-item::before {
    float: left;
    content: "/";
    font-weight: 600;
}

ol.breadcrumb > li.breadcrumb-item > a {
    color: var(--bs-warning);
    text-decoration: none;
    transition: all .25s ease-in-out;
}
    ol.breadcrumb > li.breadcrumb-item > a:hover,
    ol.breadcrumb > li.breadcrumb-item > a:focus {
        color: var(--bs-warning-border-subtle);
        text-decoration: underline;
    }
ol.breadcrumb > li.breadcrumb-item:first-child > a:before {
    content: "\f015";
    font-family: "Font Awesome 6 Free";
    font-weight: 600;
    font-size: small;
    margin: 0 .25rem 0 0;
    position: relative;
    top: -1px;

}

/* Badge */
#divBadge {
    border: 1px solid var(--bs-black);
    background: var(--bs-gray);
    padding: 10px;
    list-style: none;
    margin-bottom: 10px;
    margin-top: 0px;
}

#divBadge .label {
    padding-right: 10px;
}

#divBadge .data {
    font-weight: bold;
}


/*--------------------------------------------------------*/
/* Home Page Links */
.home-menu {
    margin-top: 50px;
    margin-bottom: 30px;
}

.home-menu-link {
    background-color: transparent;
    border: none;
    box-shadow: none;
    color: var(--bs-blue-dark);
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    padding: 0px 0px 20px 0px;
}

.home-menu-link i {
    float: left;
    font-size: 32px;
    height: 100%;
    margin-top: -5px;
    padding-right: 20px
}

a.home-menu-link.equalHeight {
    display: flex
}

home-menu li {
    margin-bottom: 150px;
}

.match-height {
    list-style-type: none;
    padding: 0px 0px 0px 0px;
}

.equalHeight {
    display: flex
}

#HomePageLinks {
}

#HomePageLinks ul {
    list-style: none;
}

#HomePageLinks li {
    background: none;
    padding: 0px 0px 0px 0px;
    width: 150px;
    display: inline-block;
    text-align: center;
    margin: 10px 0;
}

/**********************************************************************************************************************/
/* MEDIA TAGS - Adjustments for mobile rendering */

@media screen and ( max-width: 1399px ) {
    .address-row .control-label {
        height: 3rem;
        align-content: end;
    }
}

@media screen and ( max-width: 991px ) {
    .address-row .control-label {
        height: 3rem;
        align-content: end;
    }
}

@media screen and ( max-width: 767px ) {

    #login-menu .login-card {
        max-width: 540px;
        right: -3.5rem;
        top: 3rem;
    }

    .address-row .control-label {
        height: auto;
    }

    .site-header,
    .site-header-none,
    .site-header-development,
    .site-header-dev,
    .site-header-test,
    .site-header-staging,
    .site-header-production {
        background-position: 42% 50%;
    }

    #bottom-footer-row .footer-navigation > div {
        margin-bottom: 2rem;
    }

    #spanAppUser1 {
        display: none;
    }

    #divMobileIdentityArea {
        display: block;
    }

    #AppName1 {
        display: none;
    }

    #AppName2 {
        display: block;
    }

    #hdrAppName1 {
        margin-top: 0px;
    }

    .styled-table,
    .styled-table thead,
    .styled-table tbody,
    .styled-table tfoot,
    .styled-table th,
    .styled-table td,
    .styled-table tr {
        display: block;
    }

    .styled-table thead .thead-column {
        display: none;
    }

    #gridAddRow {
        display: block;
    }

    .styled-table th {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .styled-table td {
        position: relative;
        padding-left: 50%;
        border: none;
        border-bottom: 1px solid #eee;
    }

    .styled-table td::before {
        content: attr(data-label);
        position: absolute;
        left: 10px;
        width: 45%;
        font-weight: bold;
        white-space: nowrap;
        transform: translateY(-50%);
        top: 50%;
    }

    /* Fully expand Select button across entire row */
    .styled-table td:first-child {
        width: 100%;
        display: block;
        padding: 0.5rem 0;
    }

    .styled-table td:first-child a.btn-datarow-select {
        width: 100%;
        display: block;
        text-align: center;
    }

    .filter-box input, .btn-datarow {
        display: block;
        margin-bottom: 0.5rem;
        width: 100%; /* Make btn-datarow full-width on mobile */
    }
}

@media screen and ( max-width: 575px ) {
    #login-menu .card {
        position: absolute;
        width: calc(100vw - 15px);
        right: -3px;
        margin-left: 0;
        margin-right: 0;
    }
}

@media print {
    .top-nav.container-xl {
        max-width: 100% !important;
    }

    #int-banner {
        background-color: #fff;
        height: auto;
    }

    #int-banner #banner-gradient,
    #int-banner #int-header-blur,
    #int-banner #banner-img {
        display: none;
    }

    #title-container {
        min-height: 20rem;
    }

    #title-container h1,
    #title-container h1 span {
        color: #000;
        background: none;
        box-shadow: none;
        text-shadow: none;
    }

    body {
        font-size: 14px !important;
        background-color: #fff;
    }

    .container {
        max-width: 100% !important;
    }

    .top-nav {
        height: 0;
    }

    main, #content {
        box-shadow: none;
        padding: 1rem 0;
    }

    .col-print-1 {
        width: 8.33333333%;
    }

    .col-print-2 {
        width: 16.66666667%;
    }

    .col-print-3 {
        width: 25%;
    }

    .col-print-4 {
        width: 33.33333333%;
    }

    .col-print-5 {
        width: 41.66666667%;
    }

    .col-print-6 {
        width: 50%;
    }

    .col-print-7 {
        width: 58.33333333%;
    }

    .col-print-8 {
        width: 66.66666667%;
    }

    .col-print-9 {
        width: 75%;
    }

    .col-print-10 {
        width: 83.33333333%;
    }

    .col-print-11 {
        width: 91.66666667%;
    }

    .col-print-12 {
        width: 100%;
    }
}