/* table of contents
------------------------ */

/*
1.Global Elemnts
2.Specific
3.Headings
4.Line Height
5.Padding
6.Course Details Page
7.Flex Space (Logo & Ad)
8.Header Logo
9.Classroom Chat
10.Circle Number Notification on Catalog
11.Course Type Button
12.Logged In Navigation
13.Navigation Bar Pills (Transcripts/My Account Tabs)
14.Breadcrumbs
15.Side Bar Mini
16.Session Matrix
17.Sessions Tables
18.Loading Overlay
19.Embedding
20.Mobile Queries
21.Plugins
22.User Impersonation
23.Hosted Fields
24.Agreements
25.Guest Registration
*/

/* ------------------------ */

.card.course {
    min-height: 250px;
}



/* 1.GLOBAL */

html {
    font-family: sans-serif;
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -ms-overflow-style: scrollbar;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body {
    margin: 0;
    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
    font-size: 1rem;
    font-weight: 300;
    line-height: 1.5;
    color: #3c4858;
    background-color: #eee;
}

h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    margin-bottom: 0.5rem;
}


p {
    margin-top: 0;
    margin-bottom: 1rem;
}


a {
    color: #2978d5;
    font-weight: 400;
}

footer.footer {
   z-index: -1;
}

/*-------------------------------------*/


/* 2.SPECIFIC */


.hidden {
    display: none;
}


.bkg-tran {
    background-color: #ffffff8a;
}

.summary-container a {
    font-weight: bold;
}

.shadow {
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
}

.shadow-sm {
    box-shadow: 0 .125rem .25rem rgba(0,0,0,.075) !important;
}

.bg-white-trans {
    background-color: #fafafa85;
}

.fs-18 {
    font-size: 18px;
}



.btn.btn-primary:focus {
    color: #fff;
    background-color: #42ac21;
    border-color: #55a735;
}

.btn.btn-primary:hover {
    color: #fff;
    background-color: #42ac21;
    border-color: #55a735;
}



.btn.btn-primary {
    color: #fff;
    background-color: #598ac5;
    border-color: #598ac5;
    box-shadow: none;
}

.btn-primary:hover {
    color: #ffffff;
    background-color: #0c83e2;
    border-color: #0c7cd5;
}


.btn-primary.disabled, .btn-primary:disabled {
    color: #ffffff;
    background-color: #97b1c5;
    border-color: #97b1c5;
    box-shadow: none !important;
    cursor: not-allowed;
}

.btn.btn-primary:disabled:hover {
    background-color: #97b1c5;
    border-color: #97b1c5;
}


.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
    color: #ffffff;
    background-color: #0c7cd5;
    border-color: #0b75c9;
}

.btn-primary:not(:disabled):is:hover, .btn-primary:not(:disabled):not(.disabled).hover,
.show > .btn-primary.dropdown-toggle {
    color: #ffffff;
    background-color: #101111;
    border-color: #0e0f0f;
}


    .btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
    .show > .btn-primary.dropdown-toggle:focus {
        box-shadow: none, 0 0 0 0.2rem rgba(33, 150, 243, 0.5);
    }

.classroom-container a:not([href]):not([tabindex]).btn, .classroom-container a:not([href]):not([tabindex]):focus.btn, .classroom-container a:not([href]):not([tabindex]):hover.btn {
   color: #fff;
}

/*-------------------------------------*/


/* 3.HEADINGS */


h1, .h1 {
    font-size: 3.3125rem;
    line-height: 1.15em;
}

h2, .h2 {
    font-size: 2.25rem;
}

h3, .h3 {
    font-size: 1.5625rem;
    line-height: 1.4em;
    margin: 20px 0 10px;
}

h4, .h4 {
    font-size: 1.125rem;
    line-height: 1.4em;
    font-weight: 300;
}

h5, .h5 {
    font-size: 1.0625rem;
    line-height: 1.4em;
    margin-bottom: 15px;
}

h6, .h6 {
    font-size: 0.75rem;
    text-transform: uppercase;
    font-weight: 500;
}

/*-------------------------------------*/


/* 4.LINE HEIGHT */


.lh-l3 {
    line-height: 1.3;
}

.lh-l6 {
    line-height: 1.6;
}


.lh-l5 {
    line-height: 1.5;
}


/*-------------------------------------*/



/* 5.PADDING*/

.padding-15 {
    padding: 15px;
}

/*-------------------------------------*/





/* 6.COURSE DETAILS PAGE */

.course-page-header {
    min-height: 40vh;
    padding: 30px;
    position: initial;
    width: 100%;
    display: block;
    top: 0;
    left: 0;
    background-size: cover;
    background-position: center center;
    background-image: url('assets/img/register.jpg')
}

@media (min-width:768px) {
    .course-page-header {
        max-height: 50vh;
        height: 100%;
    }
}

.icon-title {
    display: block;
    left: 15px;
    position: absolute;
    font-size: 20px;
    background-color: #fff;
    padding: 9px;
    border-radius: 50%;
    max-width: 38px;
    box-shadow: 0 16px 38px -12px rgba(0,0,0,.56), 0 4px 25px 0 rgba(0,0,0,.12), 0 8px 10px -5px rgba(0,0,0,.2);
}

/*-------------------------------------*/


/* 7.LEX SPACE BETWEEN AD AND LOGO IN HEADER */


.flex {
    display: flex;
    justify-content: space-between;
}


/*-------------------------------------*/


/* 8.HEADER LOGO */

a.simple-text.logo-mini {
    opacity: 0;
    height: 0;
}


@media (min-width: 991px) {
    .sidebar-mini .sidebar .logo a.logo-normal img {
        opacity: 0;
        -webkit-transform: translate3d(-25px,0,0);
        -moz-transform: translate3d(-25px,0,0);
        -o-transform: translate3d(-25px,0,0);
        -ms-transform: translate3d(-25px,0,0);
        transform: translate3d(-25px,0,0);
        height: 0 !important;
    }


    /*-------------------------------------*/




    /* 9.CLASSROOM CHAT */


    p.media-body.card-chat {
        line-height: 26px;
        font-size: 16px;
        border-radius: 1px 18px 18px 18px;
        margin-bottom: 15px;
        width: 90%;
        position: relative;
        margin-top: 10px;
    }

    .message-input .wrap {
        position: relative;
    }

        .message-input .wrap button {
            float: right;
            border: none;
            cursor: pointer;
        }

        .message-input .wrap input {
            border: none;
            width: calc(100% - 90px);
            padding: 8px 20px 8px 20px;
            font-size: 15px;
            color: #383838;
        }


    .row.wrap {
        border: 1px solid #ccc;
        border-radius: 50px;
        padding: 10px;
    }


    /*-------------------------------------*/


    /* 10.CIRCLE NUMBERED NOTIFICATIONs ON CATALOG */


    .cat-notification {
        position: absolute;
        top: 15px;
        right: 14px;
        font-size: 12px;
        background-color: #9cc1eb;
        color: #2978d5;
        min-width: 20px;
        font-weight: bold;
        padding: 0 5px;
        height: 20px;
        border-radius: 10px;
        text-align: center;
        line-height: 19px;
        display: block;
    }

    /*-------------------------------------*/

    /* 11.THIS IS FOR THE COURSE TYPE BUTTONS*/


    a.btn-delivery-type.btn-primary {
        background-color: transparent !important;
    }

    a.btn-delivery-type.btn-primary, a.btn-delivery-type.btn-primary:active, a.btn-delivery-type.btn-primary:focus, a.btn-delivery-type.btn-primary:visited {
        background-color: #ff980033 !important;
        border-radius: 10px;
    }
}

@media (max-width:991px) {
    .cat-notification {
        position: static;
    }

    .btn-delivery-type .btn.btn-fab.btn-lg .material-icons {
        margin-top: 0;
        position: absolute;
        width: 100%;
        transform: none;
        left: 0;
        top: 0;
        height: 100%;
        line-height: 41px;
        font-size: 20px;
    }

    span.btn-label.btn.btn-info.btn-round.btn-fab.btn-lg {
        font-size: 24px;
        height: 41px;
        min-width: 41px;
        width: 41px;
        padding: 0;
        overflow: hidden;
        position: relative;
        line-height: 41px;
    }

    .btn-delivery-type {
        padding: 10px;
    }

        .btn-delivery-type .p.font-weight-bold.text-info {
            font-size: 13px;
        }

    .course-btn-container {
        width: 100% !important;
    }
}


.btn-delivery-type {
    font-size:17px;
    transition: box-shadow .2s cubic-bezier(.4,0,1,1),background-color .2s cubic-bezier(.4,0,.2,1);
    will-change: box-shadow,transform;
    position: relative;
    display: inline-block;
}

.btn-delivery-type:hover, .btn-delivery-type:focus, .btn-delivery-type:active {
    background-color:none!important;
}

.sessions-modal {
    width: 448px;
}


/*-------------------------------------*/






/* 12.LOGGED IN NAVIGATION */


ul.navbar-nav.top-nav.ml-auto.nav-classroom {
    display: -webkit-box;
}


div.dataTables_wrapper div.dataTables_length select {
    width: auto;
}

/*-------------------------------------*/


/* 13.NAV BAR PILLS */


.nav-pills .nav-item .nav-link {
    line-height: 24px;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 500;
    min-width: 100px;
    text-align: center;
    transition: all .3s;
    border-radius: 30px;
    padding: 10px 20px;
}

/*-------------------------------------*/



/* 14.BREADCRUMBS */

.breadcrumb-item + .breadcrumb-item::before {
    content: none;
}

/*-------------------------------------*/

/* 15.SIDEBAR MINI */


.sidebar-mini .sidebar a.simple-text.logo-mini {
    opacity: 100;
    height: 40px;
}

.sidebar .logo .simple-text {
    padding: 15px 0 0 0;
    line-height: 1;
}

.photo .material-icons {
    padding: 4px;
}

.sidebar .user .photo {
    width: 34px;
    height: 34px;
    overflow: hidden;
    float: left;
    z-index: 5;
    margin-right: 14px;
    border-radius: 50%;
    margin-left: 23px;
    box-shadow: 0 16px 38px -12px rgba(0,0,0,.56), 0 4px 25px 0 rgba(0,0,0,.12), 0 8px 10px -5px rgba(0,0,0,.2);
}

.sidebar .logo:after {
    background-color: transparent;
}


@media (min-width:992px) {
    .mobile-nav {
        display: none;
    }
}

/*-------------------------------------*/



/* 16.SESSION MATRIX */

tr.rank-row.my-handle {
    cursor: move;
}

.bk-opaque {
    background-color: #ffffff69;
    color: #ffffff;
}

.custom-select {
    display: inline-block;
    width: 100%;
    height: calc(2.4375rem + 2px);
    padding: .375rem 1.75rem .375rem .75rem;
    line-height: 1.5;
    color: #495057;
    vertical-align: middle;
    background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right .75rem center;
    background-size: 8px 10px;
    border-top: 0px;
    border-right: 0;
    border-left: 0;
    border-radius: 0px;
}

.custom-select-auto {
    display: inline-block;
    width: auto;
    height: calc(2.4375rem + 2px);
    padding: .375rem 1.75rem .375rem .75rem;
    line-height: 1.5;
    color: #495057;
    vertical-align: middle;
    background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right .75rem center;
    background-size: 8px 10px;
    border-top: 0px;
    border-right: 0;
    border-left: 0;
    border-radius: 0px;
}

.custom-select:focus, .custom-select-auto:focus {
    box-shadow: none;
}

/*-------------------------------------*/


/* 17.SESSIONS TABLES*/


.table-sessions > tbody > tr > td {
    padding: 6px
}

.table-sessions td {
    font-size: 12px;
    font-weight: 300;
}

.table-sessions thead tr th {
    font-size: 12px;
}

/*-------------------------------------*/


/* 18.LOADING OVERLAY */


.loading-overlay,
.loading-overlay:before,
.loading-overlay:after {
    border-radius: 50%;
    width: 2.5em;
    height: 2.5em;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation: load7 1.8s infinite ease-in-out;
    animation: load7 1.8s infinite ease-in-out;
}

.loading-overlay {
    color: #53bad1;
    font-size: 10px;
    margin: 80px auto;
    position: relative;
    text-indent: -9999em;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}

.loading-overlay:before,
.loading-overlay:after {
    content: '';
    position: absolute;
    top: 0;
}

.loading-overlay:before {
    left: -3.5em;
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s;
}

.loading-overlay:after {
    left: 3.5em;
}

@-webkit-keyframes load7 {
    0%, 80%, 100% {
        box-shadow: 0 2.5em 0 -1.3em;
    }

    40% {
        box-shadow: 0 2.5em 0 0;
    }
}

@keyframes load7 {
    0%, 80%, 100% {
        box-shadow: 0 2.5em 0 -1.3em;
    }

    40% {
        box-shadow: 0 2.5em 0 0;
    }
}

/*-------------------------------------*/


/* 19.EMBEDDING */


.embed-responsive {
    height: 100%;
}

/*-------------------------------------*/




.nav-pills .nav-item .nav-link {
    line-height: 24px;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 500;
    min-width: 100px;
    text-align: center;
    color: rgb(143, 143, 143);
    transition: all .3s;
    border-radius: 5px;
    padding: 10px 15px;
}

.nav-pills .nav-link.active {
    color: #ffffff;
}

/* 20.MOBILE QUERIES */


@media (min-width: 992px) {
    .hidden-desktop {
        display: none;
    }
}

@media (max-width: 991px) {
    .hidden-mobile {
        display: none;
    }

    a.logo-normal img {
        max-height: 150px;
    }
}

@media (max-width:992px) {
    ol.breadcrumb.p-0.mb-0.bg-transparent.home {
        margin-top: 3rem !important;
    }
}

@media (max-width:729px) {
    #impersonate-collapsible {
        min-height: 300px !important;
        width: 290px !important;
    }
}

@media (min-width:730px) {
    #impersonate-collapsible {
        min-height: 300px !important;
        width: 400px !important;
    }
}

/*-------------------------------------*/



/* 21.PLUGINS*/

.bootstrap-datetimepicker-widget.dropdown-menu {
    opacity: 100 !important;
}

.dropdown-menu.bootstrap-datetimepicker-widget.top {
    transform-origin: inherit !important;
    transition: inherit !important;
    transform: inherit !important;
    margin-top: auto;
    margin-bottom: 10px !important;
    left: 0 !important;
}

/* 22.User Impersonation*/
.user-impersonation {
    z-index: 100000;
    position: fixed;
    bottom: 15px;
    left: 15px;
    background: white;
    border-radius: 5px;
    -moz-box-shadow: 0 0 5px 6px #ccc;
    -webkit-box-shadow: 0 0 5px 6px #ccc;
    box-shadow: 0 0 5px 6px #ccc;
}

.user-impersonation-btn {
    height: 75px;
    width: 75px;
    float: left;
    border-radius: 5px;
    -moz-box-shadow: 0 0 5px 6px #ccc;
    -webkit-box-shadow: 0 0 5px 6px #ccc;
    box-shadow: 0 0 5px 6px #ccc;
    z-index: 1000;
}

    .user-impersonation-btn:hover {
        cursor: pointer;
    }

#impersonate-collapsible {
    background: white;
    /* min-height:300px;
  width:600px; */
    border-radius: 5px;
}

.impersonate-header {
    font-weight: 700;
    color: black;
}

.impersonate-footer {
    color: white;
    background: #9013fe;
    height: 73px;
    z-index: -1;
    bottom: 0;
    position: absolute;
    border-radius: 5px;
    display: table;
    width: 100%;
    padding-left: 75px;
}

.impersonate-as {
    vertical-align: middle;
    display: table-cell;
    color: white;
    font-size: 16px;
    width: 100%;
}

#start-impersonation {
    color: white;
}

.user-row {
    color: black;
}

#selected-person {
    font-weight: 600;
}
/*------------------------------------*/



/*--------------------23.Hosted Fields----------------*/

#cardNumber iframe, #cvv iframe, #cardCvv iframe {
    display: inline-block;
    border: none;
    width: 100%;
    height: 36px;
}

/*--------------------END 23.Hosted Fields------------*/




.off-canvas-sidebar .navbar .navbar-collapse .navbar-nav .nav-item .nav-link {
    color: #000000;
}

/* .card [class*=card-header-] {
  color: #000000;
} */

.marg-top-15 {
    margin-top: 15%;
    padding-left: 5%;
}



/*----------------------------Modal---------------------------*/


@media (min-width: 576px) {
    .modal-dialog {
        max-width: 448px;
    }
}




.modal-body {
    overflow: scroll;
}

.sidebar-modal-header {
    background-color: #2978d5;
}



/*----------------------------------------------------*/


.header-nav {
    font-size: 1.111rem;
    color: #525252;
}


.micpa-nav {
    font-size: 1.111rem;
    color: #000000;
    list-style-type: none;
}

.micpa-header-white {
    background-color: #ffffff;
    border-top: 0;
    border-left-width: 0;
    border-right-width: 0;
    border-bottom: 7px solid #80a942;
    border-image: linear-gradient(to right,#80a942,#17a6ff) 1 stretch;
    padding-left: 0;
    padding-right: 0;
    min-height: 90px;
}


li, a, ul {
    text-decoration: none !important;
    list-style-type: none;
}


.nav-right {
    margin-right: 110px;
    margin-bottom: 20px;
}

/* removes the increment arrows from the <input type="number"/> */
input[type=number].no-increment-arrows::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
    -moz-appearance: textfield; /* Firefox */
}

a.viewCourse {
   align-self: self-end;
}

.myRegistrationButtonContainer {
   display: flex;
   max-width: 400px;
   flex-wrap: wrap-reverse;
}

.myRegistrationButtonContainer > a {
   margin-right: 10px;
}

.myRegistrationButtonContainer .btn {
   min-width: 120px;
}

/* 24.Agreements */
#cart-agreement {
   display: grid;
   grid-template-columns: 10% 90%;
}

   #cart-agreement > div {
      margin: auto;
   }

   #cart-agreement #AgreementAccepted {
      height: 20px;
      width: 20px;
   }

   #cart-agreement > h3 {
      margin-left: 20px;
      margin-top: 10px;
   }

   #cart-agreement > p {
      grid-column: 1/-1;
   }

/* 25.Guest Registration */
.guestRegistrationContainer {
    padding-top: 10px;
}
.productGuestList {
    text-align: left;
    padding-bottom: 8px;
}

.productGuestListNameContainer {
    padding-right: 0px;
}
.productGuestListName {
    font-weight: 600;
}
.productGuestListEmail {
    font-size: smaller;
}
.productGuestListRemoveContainer {
    font-size: small;
    text-align: right;
    padding-left:4px;
    margin-left:-10px;
}
.productGuestListCollapseText {
    font-size: 10px;
    font-weight: 300;
    margin-top: -10px;
}
.productGuestRegistrationTitle {
    font-weight:bold;
}

.collapse-indicator {
   position: relative;
}

   .collapse-indicator::after {
      content: "\f077";
      color: white;
      top: -2px;
      right: 0px;
      position: absolute;
      font-family: "FontAwesome"
   }

   .collapse-indicator.collapsed::after {
      content: "\f078";
   }

.validation-summary-errors {
   color: red;
}

.speaker-modal ul li {
   list-style-type: disc;
}

.speaker-modal strong {
   font-weight: bold;
}