:root {
    --bs-primary: #1967d2;
    --bs-primary-rgb: 25, 103, 210;
    --bs-primary-hover: #003260;
    --bs-primary-focus-ring: rgba(18, 154, 251, .4);
}

.dropdown-menu { --bs-dropdown-link-active-bg: var(--bs-primary); }
.pagination { --bs-pagination-active-bg: var(--bs-primary); }
.alert { border: 0; }

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

a { text-decoration: none; }
    a:hover, a:active { color: var(--bs-primary); text-decoration: none; }
    a:focus { outline-width: 1px; outline-style: dotted; outline-color: inherit; color: var(--bs-primary); text-decoration: none; }

/*table td:not(.ck-editor__editable) { background-color: #eeeeee !important; }*/
table thead th:not(.ck-editor__editable) { background-color: var(--bs-tertiary-bg) !important; }
table.dataTable thead th { color: var(--bs-secondary-color) !important; }
thead th { border-top-width:1px; }
td.auto-width { white-space: nowrap; width: 1%; }
.smaller { font-size: .775em }
table.dataTable td { padding: 0.4rem; }
.table-responsive .dropdown-menu {
    position: fixed;
}
table.dataTable > tbody > tr.selected .dropdown-menu a { color: var(--bs-dropdown-link-color) !important; }
table.dataTable > tbody > tr.selected .dropdown-menu a:hover,
table.dataTable > tbody > tr.selected .dropdown-menu a:focus { color: var(--bs-dropdown-link-hover-color) !important; }
.course-assign-packages-menu.show:empty { display: none; }
.z-dropdown { z-index: 1080; }
/*table-grouping tr.odd td:first-child, .table-grouping tr.even td:first-child { padding-left: 1.1em; }*/
/*.table.dataTable td.dt-control:before { border: none !important; }
table.dataTable tr.dt-hasChild td.dt-control:before { background-color: gray !important; }*/
table.dataTable span.dt-column-order:before { line-height: 0.7rem !important; }  /* the space between the sort arrow icons for tables */
table.dataTable th:before { line-height: 0.8rem !important; } /* datatable 1.3 the space between the sort arrow icons for tables */

hr { border-top: 1px solid #c2c2c2; margin-top: 15px; margin-bottom: 15px; }
mark { padding: 0; background: orange; color: black; }
label { font-weight: bold; }

.table thead th:first-child { border-top-left-radius: 0.375rem; border-left-width: 1px; }
.table thead th:last-child { border-top-right-radius: 0.375rem; border-right-width:1px; }
table.dataTable tbody tr.selected > * { box-shadow: inset 0 0 0 9999px whitesmoke !important; color: #000 !important; }
.hover-row-table tbody tr:hover td { background-color: whitesmoke; cursor: pointer; }
.no-row-cursor tbody tr:hover td { cursor: default; }
.table-row-hover-actions { opacity: 0; visibility: hidden; }
.table-row-clickable:hover .table-row-hover-actions,
.table-row-clickable:focus-within .table-row-hover-actions { opacity: 1; visibility: visible; }
.table-row-hover-spacer { min-width: 140px; width: 140px; }
.table-description-ellipsis { display: block; width: 100%; max-width: 340px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.table-description-tooltip .tooltip-inner { max-width: 420px; white-space: normal; }
.customer-notes-tooltip .tooltip-inner { white-space: pre-line; text-align: left; }
.breadcrumb .breadcrumb-text { max-width: clamp(10rem, 32vw, 34rem); }

.px-2-5 { padding-left: 0.75rem !important; padding-right: 0.75rem !important; }
.navbar-nav .nav-link.active { font-weight: 600; color: var(--bs-primary) !important; }
.app-navbar .navbar-brand.active .bi-house { color: var(--bs-primary) !important; }

/* Underline the active top-nav link flush with the navbar's own bottom border, not just under the text */
@media (min-width: 992px) {
    .app-navbar .navbar-collapse { align-self: stretch; align-items: stretch; }
    .app-navbar .navbar-nav .nav-link { height: 100%; display: flex; align-items: center; position: relative; }
    .app-navbar .navbar-nav .nav-link.active::after {
        content: '';
        position: absolute;
        left: 0.1rem;
        right: 0.1rem;
        bottom: calc(-1 * var(--bs-navbar-padding-y));
        height: 2px;
        background-color: var(--bs-primary);
    }
}
.nav-underline { border-bottom: 1px solid var(--bs-border-color);}
    .nav-underline .nav-link { padding-left: 16px;padding-right: 16px;color: rgba(var(--bs-body-color-rgb),var(--bs-text-opacity)) !important; }
        .nav-underline .nav-link.active { font-weight: 400; color: var(--bs-primary) !important; border-bottom: 3px solid var(--bs-primary) !important; }
        .nav-underline .nav-link:hover { font-weight: 400; color: var(--bs-primary) !important; border-bottom: 0; }

    .accordion-button { background-color: #f5f5f5; }
    .accordion-button:not(.collapsed) { color: #212529; background-color: #f5f5f5; }
    .accordion-button:focus { box-shadow: 0 0 0 0.25rem rgba(0, 0, 0, 0.125); }

@media (max-width: 992px) {
    /*.row-flex, .row-flex > div[class*='col-'] { display: block; flex: none; }*/
    .navbar-collapse .navbar-nav > .vr { display: none; }
    .breadcrumb .breadcrumb-text { max-width: clamp(8rem, 60vw, 16rem); }
}

@media (min-width: 992px) and (max-width: 1200px) {
    .navbar.sticky-lg-top .navbar-brand { display: none !important; }
    .user-menu-text > .text-truncate { max-width: clamp(96px, 12vw, 210px); }
}

div.dataTables_processing > div:last-child > div { background-color: var(--bs-primary) !important; }

.hidden-input-control { visibility: hidden; width: 0; height: 0; }

::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #c2c2c2; font-style: italic; }
::-moz-placeholder { /* Firefox 19+ */ color: #c2c2c2; font-style: italic; }
:-ms-input-placeholder { /* IE 10+ */ color: #c2c2c2; font-style: italic; }
:-moz-placeholder { /* Firefox 18- */ color: #c2c2c2; font-style: italic; }

.bi ~ span { vertical-align: middle; display: inline-block; }

/* buttons */
.btn, button { color: #ffffff; --bs-btn-disabled-opacity:0.30; }
    .btn:active, button:active { transform: translateY(2px); }
    .btn.btn-default, button { background-color: var(--bs-primary); }
        .btn.btn-default:hover { background-color: var(--bs-primary-hover); color: #ffffff; }
        button:focus { box-shadow: 0px 0px 0px 2px rgba(0,0,0,0.4) !important; color: #ffffff; }
    .btn.btn-danger:focus { box-shadow: 0px 0px 0px 4px rgba(225, 83, 97,0.4); color: #ffffff; }
    .btn.btn-default:focus { box-shadow: 0px 0px 0px 4px var(--bs-primary-focus-ring); color: #ffffff; background-color: var(--bs-primary-hover); }
    .btn.btn-lg { width: 100%; }

    button:disabled, button[disabled], 
    .btn:disabled, .btn[disabled], .btn.disabled { background-color: #E4E4E4;border-color: #E4E4E4;color: #6c757d;opacity: 1; }

.menu_icon { background-repeat: no-repeat; display: block; padding: 0 25px !important; height: 100%; text-indent: -9999px; height: 70px; background-position: center; }
#app-dropdown-menu { max-height: calc(100vh - 56px); overflow: auto; overflow-x: hidden; }

.vr > .navbar-brand .navbar-toggler.collapsed { display: none; }

/* Footer*/
.footer { padding: 21px 0; font-size: 13px; font-weight: 500; border-color: #129afb !important; }
    .footer a { text-decoration: underline; }
.modal-footer { border-top: 0 none; }

/* Dashboard */
.border-sm-right { border-right: 1px solid var(--bs-border-color); }
.dashboard-widget-card { height: 23rem; min-height: 0; }
.dashboard-widget-body { min-height: 0; }
.recent-activity-row-grid { grid-template-columns: 1.25rem minmax(0, 1.25fr) minmax(8.5rem, auto); column-gap: .375rem; }
.recent-activity-icon-cell { height: 1.5rem; }
.recent-activity-person,
.recent-activity-activity,
.recent-activity-details { min-width: 0; }
.recent-activity-details { grid-column: 2 / 4; }

.dropdown-toggle.user-dropdown-link:after { margin-left: 0; }
.dropdown-hover:hover .dropdown-menu { display: block; margin-top: 0; }
.ui-datepicker .ui-datepicker-current {
    opacity: 1 !important;
    font-weight: bold !important;
}

@media (max-width: 991px) {
    .carousel-caption h2 { margin: 0; padding: 0; font-size: 24px; }
}

@media (max-width: 575.98px) {
    .border-sm-right { border-right: 0; }
}

/* Login */
#loginForm { background-color: transparent; }
#loginForm .validation-summary-errors ul { padding-left: 0; list-style-position: inside; }
.login, .login body { height: 100%; }
    .login .login_screen { background: var(--bs-body-bg); }
    .login .login_panel { max-width: 32rem; }
    .login .login_logo { max-width: min(14rem, 65%); }
    .login .login_footer { padding: 1rem 0; border-color: var(--bs-border-color) !important; }

    /* Borderless / flush form */
    .login h1, .login h2 { font-size: 1.5rem; font-weight: 600; line-height: 1.3; }
    .login .form-control, .login-form .form-control { border: 1px solid var(--bs-border-color); border-radius: .625rem; background-color: var(--bs-body-bg); }
    .login .form-control:-webkit-autofill, .login-form .form-control:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px var(--bs-body-bg) inset; -webkit-text-fill-color: var(--bs-body-color); }
    .login .btn.btn-default, .login-form .btn.btn-default { border: 0; border-radius: .625rem; padding: .85rem 1rem; font-weight: 600; box-shadow: none; }

.oktaLogin { background-color: #444444; }

.fade-anchor { color: black; text-decoration: underline; }

.steps-progressbar { counter-reset: step; }
    .steps-progressbar li { list-style-type: none; width: 50%; float: left; position: relative; text-align: center; color: #7d7d7d; }
        .steps-progressbar li:before { width: 30px; height: 30px; content: counter(step); counter-increment: step; border: 2px solid #7d7d7d; display: block; text-align: center; margin: 0 auto 10px auto; border-radius: 50%; background-color: var(--bs-body-bg); }
        .steps-progressbar li:after { width: 100%; height: 2px; content: ''; position: absolute; background-color: #7d7d7d; top: 15px; left: -50%; z-index: -1; }
        .steps-progressbar li:first-child:after { content: none; }
        .steps-progressbar li.active { color: green; }
            .steps-progressbar li.active:before { border-color: #55b776; }
            .steps-progressbar li.active + li:after { background-color: #55b776; }

/* MyProfile Welcome */
.myprofile-welcome-hero-text h4 { margin: 0; font-size: 1.15rem; font-weight: 600; }

.myprofile-welcome-steps p { font-size: 1rem; margin-bottom: 1.5rem; }
.myprofile-welcome-steps ol { counter-reset: myprofile-step; list-style: none; margin: 0; padding: 0; }
    .myprofile-welcome-steps ol li { position: relative; padding: 0 0 1.5rem 2.75rem; margin: 0; }
        .myprofile-welcome-steps ol li:last-child { padding-bottom: 0; }
        .myprofile-welcome-steps ol li:before { width: 1.85rem; height: 1.85rem; line-height: 1.85rem; content: counter(myprofile-step); counter-increment: myprofile-step; position: absolute; left: 0; top: 0; text-align: center; border-radius: 50%; background-color: var(--bs-primary); color: #ffffff; font-weight: 600; font-size: .85rem; }

.form-top { overflow: hidden; padding: 0 25px 0px 25px; background: var(--bs-body-bg); -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0; text-align: left; }
.form-top-left { float: left; width: 75%; padding-top: 25px; }
    .form-top-left h3 { margin-top: 0; }
.form-top-right { float: left; width: 25%; padding-top: 5px; font-size: 66px; color: var(--bs-border-color); line-height: 100px; text-align: right; }
.form-bottom { padding: 25px 25px 30px 25px; background: var(--bs-secondary-bg); -moz-border-radius: 0 0 4px 4px; -webkit-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px; text-align: left; }
    .form-bottom form textarea { height: 100px; }
    .form-bottom form button.btn { width: 100%; }
    .form-bottom form .input-error { border-color: #19b9e7; }

.form-check-input { border-width: 2px !important; width: 1.15rem; height: 1.15rem; }

.middle-border { margin-top: 25px; }
.middle-line { position: absolute; z-index: -1; min-height: 320px; width: 25px; border-right: 1px solid var(--bs-border-color); }
.middle-or { margin-top: 140px; width: 50px; background-color: var(--bs-body-bg); color: var(--bs-body-color); padding: 5px; border: 1px solid var(--bs-border-color); }

@media only screen and (max-width:480px) {
    /* expand the "Manage Account" menu in thin mode (email: a few UI improvements for e-LearningCourses Thu 8/30/2018 8:34 AM */
    /*.dropdown-menu { display: block; border: 0 none; box-shadow: none; margin-top: 0; position: static; width: 100%; }*/

    #app-dropdown-menu { max-height: none; white-space: normal; }
        #app-dropdown-menu li a { white-space: normal; }
}

@media (max-width: 767px) {
    .middle-border { margin: 15px; }
    .middle-line { border-right: 0; left: 0px; min-height: 22px; margin-top: 0px; width: 100%; border-bottom: 1px solid var(--bs-border-color); }
    .middle-or { margin-top: 0px; margin-left: 42%; }
}