﻿/********************** CSS Variables: Color Theme ******************/

/*:root {
    --aba-page-bg: #fffaf0;
    --aba-page-text: #00011e;
    --aba-page-link: #000000;
    --aba-header-bg: #1e0e00;
    --aba-sidebar-bg: #1e0e00;
    --aba-breadcrumb-bg: #eadacc;
    --aba-breadcrumb-text: #000;
    --aba-breadcrumb-leaf: #008752;
    --aba-vendor-breadcrumb-bg: #ccbda9;
    --aba-vendor-breadcrumb-text: #000;
    --aba-gate-breadcrumb-bg: #ccbda9;
    --aba-gate-breadcrumb-text: #000;
    --aba-panel-bg: #fcf4f0;
    --aba-panel-text: #00101e;
    --aba-panel-border: #00101e;
    --aba-form-bg: #c09166;
    --aba-form-text: black;
    --aba-form-border: #fffaf0;
    --aba-details-bg: #eadacc;
    --aba-details-text: black;
    --aba-details-border: #fffaf0;
    --aba-section-bar-bg: #369;
    --aba-section-bar-text: #DDD;
    --aba-section-bar-border: black;
    --aba-table-header-text: #DDD;
    --aba-table-header-bg: #5a2b00;
    --aba-table-highlight-text: #FFF;
    --aba-table-highlight-bg: #c09166;
    --aba-dragable-bg: #369;
    --aba-dragable-text: #DDD;
    --aba-portal-card-header-bg: #5a0002;
    --aba-portal-card-header-text: #eaeacc;
    --aba-training-card-header-bg: #2b005a;
    --aba-training-card-header-text: #eaeacc;
    --aba-reports-card-header-bg: #5a5900;
    --aba-reports-card-header-text: #eaeacc;
    --aba-vendor-card-header-bg: #2b005a;
    --aba-vendor-card-header-text: #eaeacc;
    --aba-superadmin-card-header-bg: #003300;
    --aba-superadmin-card-header-text: #ffffff;
    --aba-gatekeeper-bg: #FFF;
    --aba-gatekeeper-text: #000;
    --aba-gatekeeper-border: #000;
    --aba-fail-validation-msg-text: #A00000;
}*/

/*:root {
    --aba-page-bg: #f0f0f0;
    --aba-page-text: #000;
    --aba-page-link: #000;
    --aba-header-bg: #000;
    --aba-sidebar-bg: #000;
    --aba-breadcrumb-bg: #eadacc;
    --aba-breadcrumb-text: #000;
    --aba-breadcrumb-leaf: #008752;
    --aba-vendor-breadcrumb-bg: #ccbda9;
    --aba-vendor-breadcrumb-text: #000;
    --aba-gate-breadcrumb-bg: #ccbda9;
    --aba-gate-breadcrumb-text: #000;
    --aba-panel-bg: #fcf4f0;
    --aba-panel-text: #00101e;
    --aba-panel-border: #00101e;
    --aba-form-bg: #c09166;
    --aba-form-text: black;
    --aba-form-border: #fffaf0;
    --aba-details-bg: #eadacc;
    --aba-details-text: black;
    --aba-details-border: #fffaf0;
    --aba-section-bar-bg: #369;
    --aba-section-bar-text: #DDD;
    --aba-section-bar-border: black;
    --aba-table-header-text: #DDD;
    --aba-table-header-bg: #5a2b00;
    --aba-table-highlight-text: #FFF;
    --aba-table-highlight-bg: #c09166;
    --aba-dragable-bg: #369;
    --aba-dragable-text: #DDD;
    --aba-portal-card-header-bg: #5a0002;
    --aba-portal-card-header-text: #eaeacc;
    --aba-training-card-header-bg: #2b005a;
    --aba-training-card-header-text: #eaeacc;
    --aba-reports-card-header-bg: #5a5900;
    --aba-reports-card-header-text: #eaeacc;
    --aba-vendor-card-header-bg: #2b005a;
    --aba-vendor-card-header-text: #eaeacc;
    --aba-superadmin-card-header-bg: #003300;
    --aba-superadmin-card-header-text: #ffffff;
    --aba-gatekeeper-bg: #FFF;
    --aba-gatekeeper-text: #000;
    --aba-gatekeeper-border: #000;
    --aba-fail-validation-msg-text: #A00000;
}*/


:root {
    /*--aba-page-bg: #fffaf0;*/
    --aba-page-bg: #fff;
    --aba-page-text: #00011e;
    --aba-page-link: #000000;
    --aba-header-bg: #000;
    --aba-sidebar-bg: #000;
    --aba-breadcrumb-bg: #d5ebcc;
    --aba-breadcrumb-text: #000;
    --aba-breadcrumb-leaf: #008752;
    --aba-vendor-breadcrumb-bg: #ccbda9;
    --aba-vendor-breadcrumb-text: #000;
    --aba-gate-breadcrumb-bg: #ccbda9;
    --aba-gate-breadcrumb-text: #000;
    --aba-panel-bg: #fcf4f0;
    --aba-panel-text: #00101e;
    --aba-panel-border: #00101e;
    --aba-form-bg: #e6e6e6;
    --aba-form-text: black;
    --aba-form-border: #fff;
    --aba-details-bg: #e6e6e6;
    --aba-details-text: black;
    --aba-details-border: #fff;
    --aba-section-bar-bg: #2d4623;
    --aba-section-bar-text: #DDD;
    --aba-section-bar-border: black;
    --aba-table-header-text: #DDD;
    --aba-table-header-bg: #3c7d22;
    --aba-table-highlight-text: #000;
    --aba-table-highlight-bg: #c0e2b2;
    --aba-dragable-bg: #369;
    --aba-dragable-text: #DDD;
    --aba-portal-card-header-bg: #5a0002;
    --aba-portal-card-header-text: #eaeacc;
    --aba-training-card-header-bg: #2b005a;
    --aba-training-card-header-text: #eaeacc;
    --aba-reports-card-header-bg: #5a5900;
    --aba-reports-card-header-text: #eaeacc;
    --aba-vendor-card-header-bg: #2b005a;
    --aba-vendor-card-header-text: #eaeacc;
    --aba-superadmin-card-header-bg: #003300;
    --aba-superadmin-card-header-text: #ffffff;
    --aba-gatekeeper-bg: #FFF;
    --aba-gatekeeper-text: #000;
    --aba-gatekeeper-border: #000;
    --aba-fail-validation-msg-text: #A00000;
}

html {
    background-color: var(--aba-page-bg);
    color: var(--aba-page-text);
}

body {
    padding-top: 50px;
    padding-bottom: 20px;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12pt !important;
    /*background-color: var(--aba-page-bg);*/
    background-color: transparent;
    color: var(--aba-page-text);
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
    background-color: var(--aba-page-bg) !important;
}

/* 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;
}

/*    input[type=checkbox][disabled] {
        outline: 1px solid black;
        filter: invert(100%) sepia(79%) saturate(469%) hue-rotate(140deg) brightness(104%) contrast(93%);
    }
*/
/************************ Header / Navbar ***************************/
.aba-navbar {
    background-color: var(--aba-header-bg) !important;
    border: 0px none transparent;
    box-shadow: 0 2px 5px 5px rgba(0, 0, 0, 0.4);
}

.aba-navbar-brand {
    font-family: Futura;
    padding-right: 10px;
    font-size: 1.5em;
    text-transform: uppercase;
}

.aba-menu-background {
    position: absolute;
    top: 70px;
    padding-left: 15px;
    padding-right: 15px;
    background-color: var(--aba-header-bg) !important;
}

.aba-menu-button {
    position: absolute;
    right: 7px;
    bottom: 14px;
    width: 32px !important;
    height: 32px !important;
    padding: 0;
    border: 2px solid var(--aba-form-bg) !important;
}

.aba-toggler {
    width: 1.1rem;
    height: 1.1rem;
}

.aba-training-menu-bar-left {
    font-size: 1.1rem;
}

.aba-training-menu-bar-right {
    font-size: 1.1rem;
    font-weight: normal !important;
}

.aba-trainee-name {
    position: absolute;
    top: 5px;
    right: 10px;
    color: black;
}

.aba-nav-logo-strip {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background-image: linear-gradient(to right, rgba(255, 254, 255, 1), rgba(210, 217, 235, 1));
    width: 100%;
    height: 70px;
    clear: both;
    padding-left: 5px;
    padding-right: 10px;
}

.aba-site-title {
    position: absolute;
    top: 40px;
    right: 10px;
    color: black;
    font-size: 1.5rem;
    /*    color: var(--harmac-blue);
*/
}

a.aba-nav-link {
    color: #6c757d !important;
}

a.aba-menu-item {
    background-color: #DDD;
    color: #369;
}

    a.aba-menu-item:hover {
        background-color: #369;
        color: #DDD;
    }


/**************************** Admin Dashboard ********************/

.aba-card-title {
    font-size: 12pt;
}

.aba-portal-card-header {
    background-color: var(--aba-portal-card-header-bg);
    color: var(--aba-portal-card-header-text);
    height: 2.5rem;
}

.aba-training-card-header {
    background-color: var(--aba-training-card-header-bg);
    color: var(--aba-training-card-header-text);
    height: 2.5rem;
}

.aba-reports-card-header {
    background-color: var(--aba-reports-card-header-bg);
    color: var(--aba-reports-card-header-text);
    height: 2.5rem;
}

.aba-vendor-card-header {
    background-color: var(--aba-vendor-card-header-bg);
    color: var(--aba-vendor-card-header-text);
    height: 2.5rem;
}

.aba-superadmin-card-header {
    background-color: var(--aba-superadmin-card-header-bg);
    color: var(--aba-superadmin-card-header-text);
    height: 2.5rem;
}



/**************************** Content Area ***********************/
.aba-container {
    margin-top: 135px;
    margin-bottom: 120px;
    padding: 3px 7px 7px 7px;
    background-color: var(--aba-panel-bg) !important;
    color: var(--aba-panel-text) !important;
    border: 1px solid var(--aba-panel-border);
    box-shadow: 0 5px 5px 3px rgba(0, 0, 0, 0.4);
    border-radius: 3px;
}

.aba-training-container {
    margin-top: 30px;
    margin-bottom: 10px;
    padding-bottom: 15px;
    /*padding: 3px 7px 7px 7px;*/
    background-color: var(--aba-panel-bg) !important;
    color: var(--aba-panel-text) !important;
    border: 1px solid var(--aba-panel-border);
    box-shadow: 0 5px 5px 3px rgba(0, 0, 0, 0.4);
    border-radius: 3px;
}

.aba-scorm-container {
    margin-top: 150px;
    padding: 3px 7px 7px 7px;
    background-color: var(--aba-panel-bg) !important;
    box-shadow: 0 5px 5px 3px rgba(0, 0, 0, 0.4);
    border-radius: 3px;
    border: 1px solid var(--aba-panel-border);
}

.aba-gatekeeper-container {
    margin-top: 20px;
    /*margin-bottom: 50px !important;*/
    padding: 3px 7px 7px 7px;
    background-color: var(--aba-gatekeeper-bg) !important;
    color: var(--aba-gatekeeper-text) !important;
    border: 1px solid var(--aba-gatekeeper-border);
    box-shadow: 0 5px 5px 3px rgba(0, 0, 0, 0.4);
    border-radius: 3px;
}

/*********************************** UI *****************************************/
/*.dataTables_filter input[type="search"] {
    width: 10rem !important;
    //float: right;
}
*/
/*.dataTables_filter {
    width: 50%;
    float: right;
    text-align: right;
}
*/
.aba-container {
    background-color: transparent !important;
}

.bg-header {
    background-color: var(--aba-header-bg) !important;
}

.aba-bg-error-header {
    background-color: maroon;
}

.downloadAssetIcon {
    position: absolute;
    top: 8px;
    right: 48px;
    width: 24px;
    height: 24px;
    cursor: pointer;
}


/***************************** Glowing pulsating button animation ***************/
@keyframes glowing {
    0% {
        background-color: #2ba805;
        box-shadow: 0 0 3px #2ba805;
    }

    50% {
        background-color: #49e819;
        box-shadow: 0 0 10px #49e819;
    }

    100% {
        background-color: #2ba805;
        box-shadow: 0 0 3px #2ba805;
    }
}

.module-complete-blink {
    animation: glowing 1300ms infinite;
}

.aba-launch-button {
    background-color: #01619e !important;
}

.aba-required {
    /*    font-size: larger;*/
    /*color: #fcb558;*/
    color: maroon;
}

.aba-fail-validation-msg {
    /*color: maroon;*/
    color: var(--aba-fail-validation-msg-text);
    font-weight: bold;
    font-size: smaller;
}

.aba-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    padding: 0.2rem 1rem;
    margin-bottom: 1rem;
    list-style: none;
    background-color: var(--aba-breadcrumb-bg);
    color: var(--aba-breadcrumb-text);
    border-radius: 0.25rem;
    margin-top: -20px;
    text-decoration: none;
}

    /*.aba-breadcrumb:hover {
        text-decoration: underline;
    }*/

.aba-vendor-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    padding: 0.2rem 1rem;
    margin-bottom: 1rem;
    list-style: none;
    background-color: var(--aba-vendor-breadcrumb-bg);
    color: var(--aba-vendor-breadcrumb-text);
    border-radius: 0.25rem;
    margin-top: -20px;
    text-decoration: none;
}

    /*.aba-vendor-breadcrumb:hover {
        text-decoration: underline;
    }*/

.aba-gate-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    padding: 0.2rem 1rem;
    margin-bottom: 1rem;
    list-style: none;
    background-color: var(--aba-gate-breadcrumb-bg);
    color: var(--aba-gate-breadcrumb-text);
    border-radius: 0.25rem;
    margin-top: -20px;
    text-decoration: none;
}

    /*.aba-gate-breadcrumb:hover {
        text-decoration: underline;
    }*/

a.aba-breadcrumb-link {
    color: var(--aba-breadcrumb-text);
    font-weight: bold;
    text-decoration: none;
}

    a.aba-breadcrumb-link:hover {
        text-decoration: underline;
    }

.aba-breadcrumb-leaf {
    color: var(--aba-breadcrumb-leaf);
    font-weight: bold;
    text-decoration: none;
}

/*********************************** Dashboard *************************************/
.aba-splash {
    background: url(/images/splash.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-color: antiquewhite;
}

.training-dashboard {
    background-color: var(--aba-panel-bg) !important;
    color: var(--aba-panel-text) !important;
}

.comingSoon {
    background-color: #FFFFFF;
    background-color: #191E53;
    background-color: #01619e;
    color: maroon;
    color: white;
    font-size: 20pt;
    padding: 20px;
    border: 1px solid black;
    margin: 5px;
    text-align: center;
    font-weight: bold;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    opacity: 0.93;
    box-shadow: rgba(0,0,0,0.4) 3px 3px 3px 1px;
    border-radius: 2px 15px 2px 15px;
}

/*********************** Certificate ****************************/
.certificateTrainingHistory {
    display: none;
}

@media print {
    .certificateToPrint {
        background-color: white;
        height: 100%;
        width: 100%;
        position: fixed;
        top: 0;
        left: 0;
        margin: 0;
        padding: 15px;
        font-size: 14px;
        line-height: 18px;
        z-index: 65535;
        font-size: 20pt;
    }

    .certificateTrainingHistory {
        display: block;
    }
}

/*********************** File Browser ***************************/
.abaFileBrowserGalleryItem {
}

.abaFileBrowserGalleryFileItem {
    font-size: 12pt;
    font-weight: bold;
    cursor: pointer;

}

/***********************************************************/

.aba-location-picker-card {
    width: 9rem;
    /*height: 9rem;*/
    min-width: 18rem;
    margin: 5px;
    box-shadow: rgba(0,0,0,0.4) 2px 2px 3px 3px;
    cursor: pointer;
    font-size: smaller;
}

    .aba-location-picker-card:hover {
        top: 1px;
        left: 1px;
        box-shadow: rgba(0,0,0,0.4) 1px 1px 2px 2px;
    }

.aba-location-picker-img {
    max-width: 10rem;
    height: 100px;
}

@media only screen and (max-width: 600px) {
    .aba-location-picker-card {
        font-size: smaller;
    }
}


.dragDropContainer {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 10px;
}

    .dragDropContainer.over {
        border: 3px dotted #666;
    }

.slideInfo {
    font-size: larger;
}

.moduleIncomplete {
    list-style-type: square;
}

.moduleComplete {
    list-style-type: circle;
}


.aba-role-icon {
    width: 1.2rem;
    height: 1.2rem;
    /*filter: invert(33%) sepia(23%) saturate(3098%) hue-rotate(317deg) brightness(97%) contrast(114%);*/
    filter: invert(0%) sepia(42%) saturate(2085%) hue-rotate(237deg) brightness(106%) contrast(95%);
    margin-left: 5px;
}

.aba-card {
    width: 9rem;
    height: 9rem;
    margin: 5px;
    box-shadow: rgba(0,0,0,0.4) 2px 2px 3px 3px;
}

    .aba-card:hover {
        top: 1px;
        left: 1px;
        box-shadow: rgba(0,0,0,0.4) 1px 1px 2px 2px;
    }

.aba-report-card {
    width: 14rem;
    margin: 7px;
    box-shadow: rgba(0,0,0,0.4) 2px 2px 3px 3px;
}

    .aba-report-card:hover {
        top: 1px;
        left: 1px;
        box-shadow: rgba(0,0,0,0.4) 1px 1px 2px 2px;
    }


.aba-button {
    width: 7rem;
}

aba-button-tiny {
    width: 3rem;
    height: 1.0rem;
}

.aba-tiny-font {
    font-size: 6pt;
}

.aba-small-font {
    font-size: 7pt;
}

.aba-mini-font {
    font-size: 8pt;
}

.aba-medium-font {
    font-size: 9pt;
}

.aba-large-font {
    font-size: 12pt;
}

.aba-menu-button {
    width: 25rem;
    height: 3rem;
}

.aba-section-bar {
    background-color: var(--aba-section-bar-bg);
    color: var(--aba-section-bar-text);
    padding: 3px 0 0 0;
    border-radius: 5px;
    border: 1px solid var(--aba-section-bar-border);
    width: 100%;
}

.aba-section-bar-title {
    color: var(--aba-section-bar-text);
    font-weight: bold;
    /*font-size: 1.0rem;*/
}

.aba-section-area {
    background-color: var(--aba-section-area-bg);
    color: var(--aba-section-area-text);
    width: 100%;
    padding: 0 4px 0 4px;
    margin-bottom: 7px;
    margin-top: 0;
}

.aba-form-background {
    background-color: var(--aba-form-bg);
    color: var(--aba-form-text);
    border: 1px solid var(--aba-form-border);
    padding: 2px;
    border-radius: 5px;
}

.aba-details-background {
    background-color: var(--aba-details-bg);
    color: var(--aba-details-text);
    border: 1px solid var(--aba-details-border);
    padding: 1px 1px 1px 5px;
    border-radius: 5px;
}

.aba-register-form-background {
    background-color: lightgray;
    color: black;
    border: 1px solid gray;
    padding: 2px;
    border-radius: 5px;
}



.aba-dragables {
    cursor: grab;
    background-color: var(--aba-dragable-bg);
    color: var(--aba-dragable-text);
    width: 100%;
    margin: 3px;
    padding: 5px;
    border-radius: 3px;
}

    .aba-dragables:active {
        cursor: grabbing;
    }

.aba-dragdrop-container {
    list-style-type: none;
    margin: 0;
    padding: 0;
    border: 1px solid #ccc;
    min-height: 350px;
    /* width: 300px; */
    width: 100%;
    background-color: #f9f9f9;
}

.aba-dragdrop-item {
    margin: 5px 10px 5px 10px;
    padding: 10px;
    border: 2px solid black;
    background-color: #369;
    color: #DDD;
    cursor: move;
    border-radius: 3px;
}

.aba-dragdrop-icon {
    width: 1.0rem;
    height: 1.0rem;
    filter: invert(98%) sepia(87%) saturate(414%) hue-rotate(179deg) brightness(104%) contrast(96%);
}

.aba-header-icon {
    width: 1.5rem;
    height: 1.5rem;
    filter: invert(98%) sepia(87%) saturate(414%) hue-rotate(179deg) brightness(104%) contrast(96%);
}

.aba-tooltip {
    margin-top: -4px;
    margin-left: 6px;
    filter: invert(10%) sepia(6%) saturate(1389%) hue-rotate(169deg) brightness(93%) contrast(87%);
}

.aba-tooltip-table-header {
    margin-top: -4px;
    margin-left: 6px;
    filter: invert(98%) sepia(87%) saturate(414%) hue-rotate(179deg) brightness(104%) contrast(96%);
}

.aba-form-label {
    font-weight: 600;
    margin: 0 0 0 5px;
    padding: 0;
}

.aba-details-label {
    font-weight: 600;
    margin: 0;
    padding: 0;
}

.aba-form-control {
    max-width: inherit;
}

.aba-form-image {
    max-width: 240px;
    max-height: 240px;
}

.aba-row-clickable {
    cursor: pointer;
}

    .aba-row-clickable:hover {
        background-color: var(--aba-table-highlight-bg) !important;
        color: var(--aba-table-highlight-text) !important;
    }

.aba-row-highlight {
    cursor: auto;
}

    .aba-row-highlight:hover {
        background-color: var(--aba-table-highlight-bg) !important;
        color: var(--aba-table-highlight-text) !important;
    }


.aba-overlay-icon {
    position: absolute;
    display: block;
    top: 0;
    right: 15px;
    width: 1.8em;
    height: 1.8em;
    border: 1px solid black;
    background-color: white;
    padding-top: 2px;
    padding-left: 2px;
    box-shadow: rgba(0,0,0,0.3) 1px 1px 2px 2px;
    cursor: pointer;
}

.aba-toolbar {
    display: inline-block;
    width: 4em;
    height: 1.8em;
    border: 1px solid black;
    background-color: white;
    padding-top: 2px;
    padding-left: 2px;
    box-shadow: rgba(0,0,0,0.3) 1px 1px 2px 2px;
}

.aba-overlay-toolbar {
    position: absolute;
    display: block;
    top: 0;
    right: 15px;
    width: 4em;
    height: 1.8em;
    border: 1px solid black;
    background-color: white;
    padding-top: 2px;
    padding-left: 2px;
    box-shadow: rgba(0,0,0,0.3) 1px 1px 2px 2px;
}

.aba-overlay-toolbar-single {
    position: absolute;
    display: block;
    top: 0;
    right: 10px;
    width: 2em;
    height: 1.8em;
    border: 1px solid black;
    background-color: white;
    padding-top: 1px;
    text-align: center;
    box-shadow: rgba(0,0,0,0.3) 1px 1px 2px 2px;
}

.aba-toolbar-single {
    position: relative;
    display: block;
    width: 2em;
    height: 1.8em;
    border: 1px solid black;
    background-color: white;
    padding-top: 1px;
    text-align: center;
    box-shadow: rgba(0,0,0,0.3) 1px 1px 2px 2px;
}

.aba-checkbox {
    width: 1.4rem;
    height: 1.4rem;
    cursor: pointer;
}

.aba-checkbox-disabled {
    width: 1.4rem;
    height: 1.4rem;
    cursor: pointer;
    /*    filter: invert(0%) sepia(99%) saturate(40%) hue-rotate(140deg) brightness(66%) contrast(93%); */
}

.aba-checkbox-look {
}


.aba-checkbox-label {
    cursor: pointer;
    font-weight: bold;
}

.aba-textarea {
    height: 400px;
}


.aba-countdown-container {
    text-align: right;
}

.aba-countdown-label {
    font-weight: bold;
}

.aba-countdown-timer {
    font-family: monospace, "Lucida Console", "Courier New";
    font-weight: bold;
}

.aba-select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    /*background-image: url('data:image/svg+xml;charset=US-ASCII,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4 5"><path fill="none" stroke="%23333" stroke-width="1" d="M2 0L0 2h4z"/></svg>');*/
    background-image: url(/images/caret-down-fill.svg);
    background-repeat: no-repeat;
    background-position: right 0.25rem center;
    background-size: 12px 12px;
    background-color: white;
    padding-right: 0;
}



.isDisabled {
    pointer-events: none;
    color: currentColor;
    cursor: not-allowed;
    text-decoration: none;
}

.svgAddNewIcon {
    width: 1.5rem;
    height: 1.5rem;
    filter: invert(52%) sepia(11%) saturate(2650%) hue-rotate(81deg) brightness(97%) contrast(98%);
}

.svgCommandIcon {
    width: 1.4em;
    height: 1.4em;
    filter: invert(29%) sepia(86%) saturate(1869%) hue-rotate(199deg) brightness(103%) contrast(110%);
}

.svgViewIcon {
    width: 1.4em;
    height: 1.4em;
    filter: invert(52%) sepia(11%) saturate(2650%) hue-rotate(81deg) brightness(97%) contrast(98%);
}

.svgEditIcon {
    width: 1.4em;
    height: 1.4em;
    filter: invert(29%) sepia(86%) saturate(1869%) hue-rotate(199deg) brightness(103%) contrast(110%);
}

.svgModuleIcon {
    width: 1.4em;
    height: 1.4em;
    filter: invert(43%) sepia(79%) saturate(469%) hue-rotate(140deg) brightness(104%) contrast(93%);
}

.svgDeleteIcon {
    width: 1.4em;
    height: 1.4em;
    filter: invert(33%) sepia(23%) saturate(3098%) hue-rotate(317deg) brightness(97%) contrast(114%);
}

.svgButtonIcon {
    width: 1.4em;
    height: 1.4em;
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(151deg) brightness(115%) contrast(102%);
}

.svgDisabledCommandIcon {
    width: 1.4em;
    height: 1.4em;
    filter: invert(77%) sepia(7%) saturate(8%) hue-rotate(346deg) brightness(89%) contrast(85%);
}

.svgIcon {
    width: 36px;
    height: 36px;
}

.svgCertificateIcon {
    width: 48px;
    height: 48px;
}


.svgDashboard {
    width: 100%;
    height: 100%;
    filter: invert(23%) sepia(0%) saturate(0%) hue-rotate(188deg) brightness(90%) contrast(87%);
}

.svgDashboardPortal {
    width: 100%;
    height: 100%;
    filter: invert(23%) sepia(0%) saturate(0%) hue-rotate(188deg) brightness(90%) contrast(87%);
    width: 4.5rem;
    height: 4.5rem;
}

.svgDashboardTraining {
    width: 100%;
    height: 100%;
    filter: invert(23%) sepia(0%) saturate(0%) hue-rotate(188deg) brightness(90%) contrast(87%);
}

.svgDashboardReports {
    width: 100%;
    height: 100%;
}

.svgBlueRibbon {
    width: 32px;
    height: 32px;
    filter: invert(43%) sepia(79%) saturate(469%) hue-rotate(140deg) brightness(104%) contrast(93%);
}

.svgBlueRibbonIcon {
    width: 64px;
    height: 64px;
    filter: invert(43%) sepia(79%) saturate(469%) hue-rotate(140deg) brightness(104%) contrast(93%);
}

.svgSectionBar {
    width: 1.4em;
    height: 1.4em;
    filter: invert(98%) sepia(87%) saturate(414%) hue-rotate(179deg) brightness(104%) contrast(96%);
}

.svgDefault {
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(151deg) brightness(115%) contrast(102%);
}

.svgDark {
    filter: invert(10%) sepia(6%) saturate(1389%) hue-rotate(169deg) brightness(93%) contrast(87%);
}

.svgLight {
    filter: invert(98%) sepia(87%) saturate(414%) hue-rotate(179deg) brightness(104%) contrast(96%);
}

.svgInfo {
    filter: invert(43%) sepia(79%) saturate(469%) hue-rotate(140deg) brightness(104%) contrast(93%);
}

.svgPrimary {
    filter: invert(38%) sepia(82%) saturate(5679%) hue-rotate(203deg) brightness(109%) contrast(102%);
}

.svgSuccess {
    filter: invert(52%) sepia(11%) saturate(2650%) hue-rotate(81deg) brightness(97%) contrast(98%);
}

.svgSecondary {
    filter: invert(47%) sepia(3%) saturate(1233%) hue-rotate(167deg) brightness(95%) contrast(87%);
}

.svgWarning {
    filter: invert(79%) sepia(71%) saturate(1738%) hue-rotate(349deg) brightness(99%) contrast(106%);
}

.svgDanger {
    filter: invert(33%) sepia(23%) saturate(3098%) hue-rotate(317deg) brightness(97%) contrast(114%);
}

.svgWhite {
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(151deg) brightness(115%) contrast(102%);
}

.svgBlack {
    filter: invert(0%) sepia(42%) saturate(2085%) hue-rotate(237deg) brightness(106%) contrast(95%);
}

a.linkDashboard {
    color: black;
    text-decoration: none;
}

/********************************* Help ****************************************/

.helpImage {
    width: 100%;
    max-width: 1076px;
    border: 1px solid black;
}

.aba-help-button {
    width: 2.3rem;
    height: 2.3rem;
    margin: 1px 10px 1px 10px;
    filter: invert(38%) sepia(82%) saturate(5679%) hue-rotate(203deg) brightness(109%) contrast(102%);
    cursor: pointer;
}

/* Default size for large screens */
@media (min-width: 1200px) {
    #modalVideo .modal-dialog {
        max-width: 960px;
    }

    #modalVideo videoPlayer {
        width: 960px;
        height: 540px;
    }
}

/* Medium screens */
@media (min-width: 768px) and (max-width: 1199px) {
    #modalVideo .modal-dialog {
        max-width: 720px;
    }

    #modalVideo videoPlayer {
        width: 720px;
        height: 405px;
    }
}

/* Small screens */
@media (max-width: 767px) {
    #modalVideo .modal-dialog {
        max-width: 100%;
        margin: 0 15px;
    }

    #modalVideo videoPlayer {
        width: 100%;
        height: auto;
    }
}




/******************************** Reports ****************************************/
.svgReportIcon {
    width: 1.5rem;
    height: 1.5rem;
}

.reportExpiryDate {
    font-size: x-small;
}

.aba-table {
    width: 100%;
}

.aba-table-label {
    margin: 0;
    padding: 0;
}


.aba-cell-success {
    background-color: #5a8f39 !important;
    color: black;
}

.aba-cell-warning {
    background-color: #ffc107 !important;
    color: black;
}

.aba-cell-danger {
    background-color: #dc3545 !important;
    color: black;
}

.aba-cell-incomplete {
    background-color: lightcoral !important;
    color: black;
}


.aba-table-header {
    background-color: var(--aba-table-header-bg);
    color: var(--aba-table-header-text);
}

.aba-table-header-cell {
    padding: 5px 5px 2px 5px !important;
}

.aba-table-header-label {
    padding: 5px 10px 3px 10px;
    margin: 0;
}

.aba-table-subheader {
    font-weight: bold;
}

.aba-table-group-header {
    background-color: #23272B !important;
    color: #F8F9FA !important;
    font-size: medium !important;
}

.aba-table-group-subheader {
    background-color: #cccccc !important;
    color: #222222 !important;
    font-size: medium !important;
}

aba-table-row-sererator {
}

.aba-report-label {
    font-weight: 600;
}


.aba-pass {
    /*    background-color: green;
    color: white;
*/
}

.aba-inTraining {
    background-color: orange !important;
    color: black;
}

.aba-fail {
    background-color: darkred !important;
    color: white;
}


/******************************** Articulate Player ******************************/
.iframe-wrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
}

.articulateFrameAdmin {
    position: relative;
    width: 100%;
    height: calc(100% - 180px);
    height: 680px;
    max-height: 680px;
    border: 0;
    background-color: var(--aba-page-bg);
}

.articulateFrame {
    display: block;
    position: absolute;
    top: 68px;
    left: 0;
    width: 100%;
    height: calc(100% - 125px);
    border: 0;
    /*    position: fixed;
    z-index: 65534;
    background: #000;
    border: none;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--aba-panel-bg) !important;
*/
}
