.modal-content #elearning-add-course-unit .col-md-9 {width: 100%;}
.modal-content #elearning-add-course-unit h3 {margin-top: 0px}
.modal-content #elearning-add-course-lesson .col-md-9 {width: 100%;}
.modal-content #elearning-add-course-lesson h3 {margin-top: 0px}

/***************************************
 * Course Contents
 **************************************/
#course-overview-title {margin-top: 0;}
#course-contents-alert {padding: 15px;}
.course-completion-summary p {color: #3c763d;}
.course-overview .course-contents-unit {
  border: 1px solid grey;
  border-radius: 5px;
  margin-bottom: 20px;
  padding: 15px;
}
.course-overview .course-contents-unit > .course-contents-lesson:last-of-type {margin-bottom: 0px;}
.course-overview .course-contents-unit .course-contents-unit-title ~ .course-contents-lesson:last-of-type {margin-bottom: 15px;}
.course-overview .course-contents-unit-title {margin-bottom: 15px;font-size: 1.667em;}
.course-overview .course-contents-lesson {margin-left: 25px;margin-bottom: 15px;display:flex;}
.course-overview .course-contents-item-completeness {
  height: 25px;
  width: 25px;
  border-radius: 50%;
  display: inline-block;
  vertical-align: middle;
  flex-shrink:0;
}
.course-overview .course-contents-item-completeness .bi-check-lg {display: none;}
.course-overview .course-contents-item-incomplete {border: 1px solid grey;}
.course-overview .course-contents-item-complete {background-color: #003da5;color: #fff;}
.course-overview .course-contents-item-complete .bi-check-lg {display: block;margin-left: 5px;line-height: 25px;}
.course-overview .course-contents-item-info {margin-left: 15px;}
.course-overview .course-contents-item-name {vertical-align: middle;display: block;}
span.course-contents-item-name {display: flex !important; align-items: center; gap: 16px;}
.course-overview span.course-contents-item-name .course-contents-item-complete .bi-check-lg {font-size: 14px;margin-left:0px;}

/**********************************************
 * Course Contents: Shortcode
 *********************************************/
.course-overview h2 {margin-top: 40px;margin-bottom: 20px;}
.course-shortcode-summary {
  background-color: #e9eaeb;
  text-align: center;
  padding: 5px 0px;
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}
.course-shortcode-summary:after {clear: both;}
.course-shortcode-summary .course-shortcode-summary-section {
  border-left: solid 1px #bbb;
  padding-top: 30px;
  padding-bottom: 30px;
}
.course-shortcode-summary .course-shortcode-summary-section:first-child {border-left: none;}
.course-shortcode-summary .course-shortcode-summary-section *:last-child {margin-bottom: 0px;}
.course-shortcode-summary .course-shortcode-summary-section h4 {margin-top: 0px; margin-bottom: 10px;font-weight: bold;}
.course-shortcode-summary .course-length, .course-shortcode-summary .course-status {font-weight: bold;}

@media (max-width:767px) {
    .course-shortcode-summary {display: block;padding: 5px 25px;}
    .course-shortcode-summary .course-shortcode-summary-section {
      border-left: none;
      border-top: 1px solid #333;
    }
    .course-shortcode-summary .course-shortcode-summary-section:first-child {
      border-top: none;
    }
}

/****************************************
 * Single Course
 ***************************************/
.course-container {height: 100vh;width: 100% !important;}
.course-header {min-height: 75px;border-bottom: solid 1px black;display: flex;}
.course-return-to {display: flex;align-items: center;}
.course-return-to-text {font-size: 16px;line-height: 1;font-weight: bold;}
.course-return-to-text a {color: #333;}
.course-title {display: flex; justify-content: space-between; align-items: center;}
.course-title h1 {
  display: inline-block;
  font-size: 24px;
  margin: 0;
  padding-right: 15px;
}
.course-body {display: flex; min-height: calc(100% - 75px);}
.course-nav {padding: 0 !important;background-color: #e9eaeb;}
.course-nav .course-contents-unit {border-bottom: 1px solid #000;}
.course-contents-unit-title {padding: 0;display: flex; justify-content: space-between; align-items: center; width: 100%; border: none;background:none;}
.course-nav .course-contents-unit-title {padding: 15px 15px;font-size: 18px;font-weight: bold;}
.course-nav .course-contents-unit a {color: #333;text-decoration: none;}
.course-nav .course-contents-lesson {padding: 20px 15px;font-size: 16px;display: flex;}
.course-nav .course-contents-unit-title ~ a .course-contents-lesson, .course-nav .course-contents-lesson.lesson-blocked {padding: 12px 35px;font-size: 12px;}
.course-nav #single-course-nav .course-contents-unit {padding-bottom: 20px;}
.course-nav .course-contents-item-completeness {
    width: 18px;
    height: 18px;
    display: inline-block;
    border-radius: 50%;
    vertical-align: middle;
    float: left;
    margin-top: 2px;
    flex-shrink: 0;
}
.course-nav .course-contents-unit-title ~ a .course-contents-item-completeness {margin-top: 0px;}
.course-nav .course-contents-item-completeness .bi-check-lg{display: none;}
.course-nav .course-contents-item-info {padding-left: 25px;}
.course-nav .course-contents-item-name {display: block;}
.course-nav .course-contents-item-name .completion-time-estimate {font-size: 10px;}
.course-nav .course-contents-unit-title .course-contents-item-name {padding-left: 0px;}
.course-nav .course-contents-item-incomplete {border: 2px solid #bbb;}
.course-nav .course-contents-item-complete {border: none;background-color: #003da5;}
.course-nav .course-contents-item-complete .bi-check-lg {
    display: block;
    font-size: 10px;
    margin-top: 2px;
    display: block;
    margin-left: 4px;
    color: #fff;
}
.course-nav span.course-contents-item-name .course-contents-item-complete .bi-check-lg {font-size:10px;margin-left:0px;}
.course-nav .course-contents-lesson.lesson-blocked .bi-lock-fill {
  margin-left: 3px;
}
.course-nav .course-lesson-selected {background-color: #003da5;color: #fff;}
.course-nav .course-lesson-selected .course-contents-item-incomplete {border: 2px solid #fff;}
.course-nav .course-lesson-selected .course-contents-item-complete {background-color: #fff;border: none;}
.course-nav .course-lesson-selected .course-contents-item-complete .bi-check-lg {color: #003da5;}
.course-nav .course-lesson-selected .text-muted {color: #fff;}
.course-content-body #course-lesson-title {display: inline-block;}
.completion-time-estimate {font-style: italic;}
.course-content-body .completion-time-estimate {margin-left: 1em;}
.course-content-body {border-bottom: 1px solid #000;margin-bottom: 30px;padding-bottom: 75px;}
.course-content-footer {margin-top: 30px;}
.ch-container-elearning-course {max-width: 100% !important;width: 100% !important;}

.ch-course-unit-closed.course-contents-unit {padding-bottom:0px !important;}
.ch-course-unit-closed .course-contents-unit-title i.bi-chevron-up {transform: rotate(180deg);}
.ch-course-unit-closed a, .ch-course-unit-closed .course-contents-lesson {display:none;}

/* .course-title, .course-content {
  border-left: solid 1px black;
} */

#course-completeness {
  display: inline-block;
  width: 35%;
  min-width: 200px;
  margin: 0;
  text-transform: uppercase;
  font-size: 12px;
}
#course-completeness-count {margin-left: 25px;}
#course-progress-bar {
  height: 10px;
  box-shadow: none;
  background:#eaeaea;
  margin-bottom: 0px;
  margin-top: 2px;
}
#course-progress-bar .progress-bar{background-image: linear-gradient(to bottom,#003da5 0,#003da5 100%);}
#course-btn-previous {
    border-color: transparent !important;
    background-color: transparent !important;
    color: #333 !important;
    text-transform: none;
}
#course-btn-previous:active {box-shadow: none;-webkit-box-shadow: none;}
#course-btn-mark-complete {float:right;}
@media (min-width: 768px) {
    .course-header {position: fixed; width: 100%; z-index: 1; background: #fff;}
    .course-body {margin-top:75px;}
    .course-nav {position: fixed !important;}
    #single-course-nav {height: calc(100vh - 75px);overflow: scroll;}
    .course-title {padding-left: 50px !important;}
    .course-title .mobile-nav-toggle {display: none;}
    .course-content {padding: 20px 50px !important;margin-left: 25%;}
}

@media (max-width: 767px) {
    .course-header {display: block; min-height: 60px;}
    .course-header > .course-return-to {display: none;}
    .course-title h1 {font-size: 18px; margin-top: 11px; padding-right: 15px;}
    .course-title #course-completeness {
        display: none;
        position: absolute;
        width: 100%;
        top: 60px;
        margin-left: -15px;
        padding: 20px 15px 15px;
        background: #fff;
        z-index: 2;
    }
    .course-title .mobile-nav-toggle {font-size: 30px; margin-top: 9px;cursor: pointer;}
    .course-nav {
        display: none;
        margin-top: 0px;
        background: #fff;
        position: absolute !important;
        z-index: 2;
        width: 100%;
    }
    .logged-in .course-nav {margin-top: 51px;}
    .course-nav .course-return-to-text {
        padding: 20px 15px;
        border-bottom: 1px solid #000;
    }
    .course-content .course-return-to-text {font-size: 14px;padding: 20px 0px 0px;}
    .course-body {display: block;}
    #course-lesson-title {margin-bottom: 0px;}
    .course-content .completion-time-estimate {display: block;margin-left: 0px !important;margin-bottom: 20px;}

    /* collapsible menu styling */
    .course-container.menu-open .course-nav{display: block;}
    .course-container.menu-open .course-title #course-completeness {display: block;}
}

/*******************************
* Course Directory
*******************************/
.elearning-directory-title {margin-bottom: 25px;}
.ch-elearning-courses .search-sort-by {float: right;}
.ch-elearning-courses .search-container + .text-muted {margin-top: 20px;}
.course-list-default .media {border-bottom: 1px solid #b3b3b3;padding: 30px 0px;}
.course-list-default .media .media-left {max-width: 120px;}
.course-list-default .media .media-content {color: #333;}
@media (max-width: 767px) {
    .ch-elearning-courses .search-sort-by {width: 100%; margin-top: 16px;}
    .ch-elearning-courses .search-sort-by select {width: 100%;}
}
@media (max-width: 600px) {
    .course-list-default .media .media-content p{font-size: 16px;}
}

/*******************************
* Course Enrollment Overview
*******************************/
.course-enrollment.course-overview .course-contents-unit {
  border-radius: 4px;
  border: 1px solid #ddd;
  margin-bottom: 20px;
  padding: 15px;
}