html,
body {
   overflow-x: unset;
   --dark-mute: #B8B9C0;
   --dark-02: #2F3446;
   --border-dark: #646E7D;
}

/* *********************************** */
/*  HEADER
/* *********************************** */
.homepage-hero-banner .wrapper {
    padding: 0;
    text-align: unset;
}

.homepage-hero-banner .heading-content {
   padding: 0;
}

.heading {
   /*background-image: var(--bg-img);*/
   color: var(--base-emphases);
   background-position: center;
   background-size: cover;
   background-color: #E3EDF1;
}

.heading .wrapper {
   padding-top: 1rem;
   padding-bottom: 1rem;
}

.heading h1 {
   font-size: var(--text-2xl);
   margin-bottom: .25rem;
}

.heading .heading-detail {
   font-size: var(--text-sm);
   color: var(--dark-mute);
   font-weight: 500;
   margin-top: .25rem;
   margin-bottom: .75rem;
}

.heading .heading-intro {
   font-size: var(--text-base);
   padding-top: .5rem;
   margin-bottom: .75rem;
}

.course-progress {
   display: flex;
   flex-wrap: wrap;
   gap: 1rem;
   margin-bottom: .75rem;
   flex-direction: column;
}

.learning-content .learning-overview .course-progress>* {
   flex: 1 0 100%;
}

.learning-content .learning-content-aside .disabled.not-started .progress-incomplete-required {
   background-color: red;
}

.disabled .progress-indicator i:before {
   color: var(--base-01);
}


.disabled .learning-item-details .complete-required i:before {
   content: "\f023";
}

.progress-circle {
   height: 100%;
   border-radius: 2px 0 0 2px;
   height: 8px;
   background-color: var(--info);
}

.active.session {
   display: none;
}

.circle-inner {
   width: 100%;
   height: 8px;
   background-color: rgb(18 32 51 / 50%);
   border-radius: 2px;
   display: flex;
   margin-bottom: 2px;
}

.circle-inner span {
   color: var(--base-01);
   font-size: var(--text-sm);
   font-weight: 500;
   text-align: center;
}

#lesson-id .heading-content {
   background-color: var(--base-04);
   border-top: 1px solid #678598;
   border-bottom: 1px solid #678598;
}

.heading-content .wrapper {
   display: flex;
   flex-direction: column;
   gap: .75rem;

}

.heading .heading-content button,
.heading .heading-content a {
   background-color: transparent;
   width: 100%;
   color: var(--base-emphases);
   border-radius: 4px;
   border: 1px solid var(--dark-01);
   padding: 0.5rem 1.5rem;
   font-size: var(--text-base);
   display: flex;
   flex-grow: 1;
   font-weight: 500;
   justify-content: center;
   align-items: center;
   gap: .5rem;

}

.heading .heading-content .start-btn,
.heading .heading-content .resume-btn {
   display: flex;
   text-decoration: none;
   justify-content: center;
   align-items: center;
   background-color: var(--base-01);
   color: var(--primary);
}

.heading .heading-content .start-btn:hover,
.heading .heading-content .resume-btn:hover {
   background-color: var(--base-05);

}

.heading .heading-content button:hover {
   background-color: var(--dark-01);
   color: var(--dark-content);
}

.heading .heading-content button.active {
   background-color: var(--dark-01);
   color: var(--dark-content);
}

.heading .heading-content button.active:hover {
   background-color: var(--base-03);
}


.heading .heading-content button.active i::before {
   font-weight: 900;
}

.favorite-btn .active,
.favorite-btn.active .inactive {
   display: none;
}

.favorite-btn .inactive,
.favorite-btn.active .active {
   display: unset;
}

.heading .heading-content .resume-btn {
   background-color: var(--base-01);
   color: var(--dark-focus);
   height: 3rem;
   font-size: var(--text-xl);
   width: 100%;
   font-weight: 600;
}

.heading .heading-content .resume-btn i {
   margin-right: .5rem;
}

.heading .heading-content .resume-btn:hover {
   background-color: var(--base-03);
}

.course-preview-video-wrapper {
   position: relative;
   box-shadow: 0 4px 30px rgba(0, 0, 0, 0.66);
   padding: 0.75rem;
   border-radius: 1rem;
   background-color: rgb(208, 229, 237, .1);
   margin-top: 1.5rem;
   margin-bottom: 1.5rem;
}

.course-preview-overlay {
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   background: rgb(34, 38, 72);
   background: linear-gradient(180deg, rgba(34, 38, 72, 0) 25%, rgba(34, 38, 72, 0.99) 100%);
}

.course-preview-video-wrapper .resume,
.course-preview-video-wrapper a {
   position: absolute;
   bottom: 1rem;
   left: 50%;
   transform: translateX(-50%);
   font-size: var(--text-base);
   color: var(--dark-content);
   text-decoration: none;
}

.learning-overview h1 {
   overflow: unset !important;
   display: unset !important;
   -webkit-box-orient: unset !important;
   -webkit-line-clamp: unset !important;
}

.learning-overview .heading .progress-circle {
   display: flex;
}

.learning-overview .course-progress .progress-text {
   display: none;
}

.learning-overview .course-progress-indicator {
   display: flex;
   flex-wrap: nowrap;
   align-items: center;
}

.learning-overview .heading .heading-content .course-progress .favorite-btn {
   flex: 100%;
}

.homepage-hero-banner h1 {
   font-size: var(--text-4xl);
   margin-bottom: 1rem;
   display: block !important;
}

.homepage-hero-banner .badge-row {
   display: flex;
   gap: 0.5rem;
   flex-wrap: wrap;
   margin-bottom: 1rem;
   justify-content: flex-start;
}

.homepage-hero-banner .badge {
   display: inline-block;
   padding: 4px .75rem 1px .75rem;
   font-size: var(--text-sm);
   color: var(--dark-content);
   background-color: #ffffff2b;
   border-radius: .125rem;
   text-decoration: none;
   transition: var(--three);
   border: none;
   font-weight: 500;
}

.homepage-hero-banner .badge:hover,
.homepage-hero-banner .badge:focus {
   background-color: #ffffff43;
}

.homepage-hero-banner .btn-row {
   flex-direction: column;
}

.homepage-hero-banner .btn-row a {
   justify-content: center;
   width: 100%;
   font-size: var(--text-lg);
}

.homepage-hero-banner .btn-primary {
   background-color: var(--base-01);
   color: var(--base-emphasis);
   border: 0px;
}

.homepage-hero-banner .btn-secondary {
   background-color: var(--dark-01);
   color: var(--dark-content);
   border: 1px solid var(--dark-content);
}

.homepage-hero-banner .btn-primary:hover {
   background-color: var(--base-05);
}

.homepage-hero-banner .btn-secondary:hover {
   background-color: var(--dark-focus);
}

.homepage-hero-banner .thumb-img {
   border-radius: .5rem;
   margin: 0 auto;
   max-width: 24rem;
}

/* *********************************** */
/*     LEARNING CONTENT AMENDMENTS     */
/* *********************************** */
.learning-content {
   display: flex;
   position: relative;
}

.learning-video-wrapper:has(.quiz-widget-container) {
  padding: 0;
}

.learning-content.course-contents-reveal {
   display: flex;
   width: 100vw;
   padding: 0 .75rem;
   height: 4rem;
   gap: 0;
}

.learning-content .learning-content-aside {
   display: flex;
   flex-direction: column;
   width: 20rem;
   list-style: none;
   margin: 0;
   background-color: var(--dark-02) !important;
   z-index: 101;
   position: fixed;
   top: 0;
   left: -100%;
   bottom: 0;
   height: 100vh;
   overflow-y: auto;
   overflow-x: hidden;
   padding: 0;
   transition: var(--three);
}

.learning-content .learning-content-aside.active {
   display: flex;
   left: 0;
   transition: var(--three);
}

.learning-content .learning-content-aside h2 {
   background-color: unset;
   color: var(--dark-content);
   padding: 0 .75rem;
   font-size: var(--text-lg);
   font-weight: 500;
   height: 4rem;
   display: flex;
   align-items: center;
   border-bottom: 1px solid var(--border-dark);
}

.learning-content .learning-content-aside h2 i:first-of-type {
   margin-right: 1rem;
}

.learning-content .learning-content-aside h2 i:last-of-type {
   padding: .5rem;
   margin-left: auto;
   color: var(--dark-mute);
   cursor: pointer;
   transition: var(--three);
}

.learning-content .learning-content-aside h2 i:last-of-type:hover {
   color: var(--dark-content);
}

.main-body .course-content-overview {
   color: var(--base-mute);
   font-size: var(--text-sm);
   margin-bottom: 1rem;
}

.main-body .course-content-wrapper {
   border: 1px solid #bbbbbb;
   gap: 0;
   border-radius: .5rem;
   overflow: hidden;
}

.main-body .learning-item {
   display: flex;
   gap: 1rem;
   text-decoration: none;
   margin: 0;
   padding: .75rem;
   border-radius: 0;
   border-bottom: 1px solid #bbbbbb;
   background-color: var(--base-02);
}

.main-body .learning-item:last-of-type {
   border-bottom: none;
}

.learning-content .learning-content-aside .course-content-wrapper {
   background-color: unset;
   border: none;
   margin: 0;
   gap: 0;
}

.learning-content .learning-content-aside .learning-item {
   margin: 0;
   border-bottom: 1px solid var(--border-dark);
   border-radius: 0;
}

.learning-content .learning-content-aside .learning-item:hover {
   background-color: #22262a80;
}

.learning-content .learning-content-aside .learning-item.overview-toggle {
   cursor: pointer;
}

.learning-content .learning-content-aside .learning-item.overview-toggle h3 {
   font-size: var(--text-base);
}

.learning-content .learning-content-aside .learning-item.overview-toggle .progress-indicator i {
   color: var(--dark-content);
}

.learning-content .learning-content-aside .learning-item h3 {
   color: var(--dark-content);
}

.learning-content .learning-content-aside .learning-item .learning-item-details p {
   color: var(--dark-mute);
}

.learning-content .learning-content-aside .learning-item.active {
   background-color: var(--base-content);
   border-left: 5px solid var(--base-02);
   padding-left: calc(.75rem - 5px);
}

.learning-content .learning-content-aside .not-started .progress-indicator {
   background-color: transparent;
   border: 1.5px solid var(--dark-mute);
}

.learning-content .learning-content-aside .certificate .learning-item-details,
.learning-item.ready.certificate-button .learning-item-details {
   width: 100%;
   margin-right: .5rem;
}

.learning-content .learning-content-aside .learning-item.locked.certificate h3 {
   display: flex;
   background-color: rgb(208, 229, 237, .25);
   border-radius: .25rem;
   padding: .675rem .5rem;
   color: var(--primary-content);
   justify-content: center;
   align-items: center;
   width: 100%;
   cursor: not-allowed;
   pointer-events: auto;
}

.learning-content .learning-content-aside .learning-item.ready.certificate-button h3 {
   display: flex;
   background-color: var(--dark-content);
   border-radius: .25rem;
   padding: .675rem .5rem;
   color: var(--dark-focus);
   justify-content: center;
   align-items: center;
   width: 100%;
   font-weight: 600;
}

.learning-item.certificate .learning-item-details .instruction,
.certificate-button .certificate-button-text {
   text-align: center;
   padding-top: .25rem;
}

.learning-content .learning-content-aside .locked .progress-indicator i:before {
   color: var(--dark-mute);
}

.learning-content .body-content {
   width: 100%;
}

.learning-content .heading .wrapper {
   padding-top: 0;
}

.heading button.course-contents-reveal {
   background-color: var(--dark-01);
   color: var(--dark-content);
   font-size: var(--text-base);
   font-weight: 500;
   height: 40px;
   display: flex;
   align-items: center;
   width: 100%;
   border-radius: 4px;
   padding: 0 16px;
}

.heading button.course-contents-reveal:hover {
   background-color: var(--dark-focus);
}

.heading button.course-contents-reveal i {
   margin-right: 1rem;
}

.learning-content-title {
   margin-bottom: .75rem;
}

.learning-content .heading h1 {
   font-size: var(--text-xl);
   overflow: hidden;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
}

.learning-content .heading h2 {
   font-size: var(--text-xl);
   font-weight: 500;
   overflow: hidden;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
}

.learning-content .course-progress {
   align-items: center;
   justify-content: space-between;
}

.learning-content .course-progress>* {
   flex: 1;
}

.learning-content .course-progress .course-progress-indicator {
   font-size: var(--text-sm);
   display: flex;
   flex-direction: column;
   width: 100%;
}

.learning-content .course-progress .progress-text {}

.learning-content .heading .learning-video-wrapper {
   position: relative;
}
.learning-content .heading .learning-video-wrapper .wrapper {
   flex-direction: column;
}

.learning-content .heading .learning-video {
   border-radius: .5rem;
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}

.learning-content .body-content .main-section {
   position: relative;
}

.close-course-contents-text {
   display: none;
}

.resource-container {
   display: flex;
   gap: .5rem;
   border-bottom: 1px solid var(--border-color);
   padding-bottom: 1rem;
   margin-bottom: 1rem;
   align-items: center;
}

.resources-container h4 {
   font-weight: 400;
   flex-grow: 1;
}

.resources-container .btn-secondary {
   justify-content: center;
   flex-shrink: 0;
}

.collapsible-header.no-children {
   pointer-events: none;
}

.collapsible-header.no-children i.arrow-icon {
   visibility: hidden;
   opacity: 0;
}

/* *********************************** */
/*                  TABS               */
/* *********************************** */

.anchor-links {
   position: sticky;
   top: 0;
   z-index: 1;
}

.anchor-link-reveal {
   padding: 0 1.25rem;
   width: 100%;
   height: 3rem;
   border-radius: 0;
   border: none;
   border-bottom: 1px solid var(--border-color);
   background-color: var(--base-01);
   color: var(--primary-focus);
}

.anchor-link-reveal i {
   padding-right: .75rem;
}

.anchor-links:hover .anchor-link-reveal {
   background-color: var(--base-04);
}

.anchor-links:hover .anchor-link-container {
   visibility: visible;
   opacity: 1;
   transform: scale(1) translateY(0);
   transition: var(--three);
}

.anchor-link-container {
   visibility: hidden;
   opacity: 0;
   transform: scale(.99) translateY(1rem);
   display: flex;
   flex-direction: column;
   position: absolute;
   left: .75rem;
   top: calc(100% - .5rem);
   background-color: var(--base-01);
   min-width: fit-content;
   z-index: 1;
   border-radius: 0.5rem;
   padding: 0;
   text-wrap: nowrap;
   border: .5px solid var(--primary);
   box-shadow: 0px 4px 16px -4px rgba(0, 0, 0, 0.2);
   transition: var(--three);
   overflow: hidden;
}

.anchor-link {
   padding: .75rem 1rem;
   white-space: nowrap;
   text-decoration: none;
   display: flex;
   gap: .5rem;
   align-items: center;
   background-color: transparent;
   color: var(--primary);
   font-weight: 500;
   font-size: var(--text-sm);
}

.anchor-link:hover {
   background-color: var(--base-03);
}

/* *********************************** */
/*         FULL-WIDTH SECTIONS         */
/* *********************************** */
.alt-background:nth-of-type(odd) {
   background-color: var(--base-05);
}

.alt-background:nth-of-type(even) {
   background-color: var(--base-02);
}

.alt-background h2 {
   line-height: 1.5;
   font-size: var(--text-2xl);
   font-weight: 600;
   margin-bottom: .5rem;
}

.resources-wrapper {
   margin-top: -0.5rem;
}

.resources-container:first-of-type {
   margin-bottom: .5rem;
}

.resources-container h3 {
   font-size: var(--text-sm);
   color: var(--base-mute);
   font-weight: 500;
   margin-bottom: .5rem;
}

.resources-container ul li {
   display: flex;
   gap: .75rem;
   color: var(--primary);
   margin-bottom: .5rem;
}

.resources-container ul li a {
   text-decoration: none;
   font-weight: 600;
}

.resources-container ul li i {
   position: relative;
   top: .325rem;
}

.resources-container ul li a:hover {
   text-decoration: underline;
   color: var(--primary-focus);
}

.people-container {
   display: flex;
   flex-wrap: wrap;
   gap: 1.25rem;
   margin: .75rem 0;
}

.person {
   width: 100%;
   display: flex;
   align-items: center;
   gap: .75rem;
}

.person a {
   text-decoration: none;
}

.person:hover .person-avatar {
   transform: scale(1.1);
}

.person .person-img-link {
   height: 5rem;
   width: 5rem;
   overflow: hidden;
   border-radius: 100%;
   display: block;
   flex-shrink: 0;
   align-self: center;
   background-color: var(--base-05);
}

.person .person-avatar {
   display: flex;
   width: 100%;
   height: 100%;
   justify-content: center;
   align-items: center;
   text-decoration: none;
   font-size: var(--text-3xl);
   transition: var(--three);
   transform: scale(1);
}

.person.dark-blue .person-avatar {
   background-color: var(--primary);
   color: var(--primary-content);
}

.person.light-blue .person-avatar {
   background-color: #6284C3;
   color: var(--primary-content);
}

.person.purple .person-avatar {
   background-color: #a97eb0;
   color: var(--primary-content);
}

.person.red .person-avatar {
   background-color: #e84360;
   color: var(--primary-content);
}

.person.peach .person-avatar {
   background-color: #f0a693;
   color: var(--base-content);
}

.person.orange .person-avatar {
   background-color: #e87524;
   color: var(--primary-content);
}

.person.yellow .person-avatar {
   background-color: #f3c317;
   color: var(--base-content);
}

.person.green .person-avatar {
   background-color: #56c271;
   color: var(--base-content);
}

.person.aqua .person-avatar {
   background-color: #00b0ad;
   color: var(--base-content);
}

.person.mint .person-avatar {
   background-color: #84c7bc;
   color: var(--base-content);
}

.person h3 {
   line-height: 1.25;
   font-weight: 600;
   font-size: var(--text-base);
   border-bottom: 1px solid transparent;
   width: fit-content;
   transition: var(--three);
   margin-bottom: .5rem;
}

.person h3:hover {
   color: var(--primary);
}

.person button {
   font-size: var(--text-sm);
   border-radius: 2rem;
   border: 1px solid rgba(36, 43, 104, .25);
   padding: 0 1rem;
   color: rgba(36, 43, 104, 1);
   background-color: rgba(36, 43, 104, .15);
   text-wrap: nowrap;
}

.person button.active {
   background-color: rgba(36, 43, 104, 1);
   color: var(--base-01);
}

.person button i {
   margin-right: .325rem;
}

.person button.active i {
   font-weight: 900;
}

.person button:hover {
   background-color: rgba(36, 43, 104, .25);
}

.person button.active:hover {
   background-color: var(--primary-focus);
}

.course-content-wrapper {
   display: flex;
   flex-direction: column;
   gap: 1.75rem;
   margin: .75rem 0;
}

.learning-item {
   display: flex;
   gap: 1rem;
   text-decoration: none;
   margin: -.75rem;
   padding: .75rem;
   border-radius: .25rem;
}

.learning-item:hover {
   background: var(--base-05);
}

.learning-item .progress-indicator {
   width: 1.5rem;
   height: 1.5rem;
   display: flex;
   border-radius: 100%;
   display: flex;
   justify-content: center;
   align-items: center;
   flex-shrink: 0;
}

.learning-item h3 {
   font-weight: 500;
   font-size: var(--text-sm);
   color: var(--base-content);
}

.learning-item .learning-item-details p {
   color: var(--base-mute);
   font-size: var(--text-xs);
   padding-top: 0;
}

.learning-item .learning-item-details p i {
   margin-right: .5rem;
}

.learning-item .learning-item-details .instruction {
   font-style: italic;
}

.complete .progress-indicator {
   background-color: var(--success);
}

.complete .progress-indicator i:before {
   content: "\f00c";
   color: var(--base-01);
}

.in-progress .progress-indicator {
   background-color: var(--base-01);
   border: 1px solid var(--base-content);
}

.in-progress .progress-indicator i:before {
   content: "\f141";
   color: var(--base-content);
}

.not-started .progress-indicator {
   background-color: var(--base-02);
   border: 1px solid var(--base-content);
}

.locked {
   pointer-events: none;
}

.locked .progress-indicator i:before {
   content: "\f023";
   color: var(--base-mute);
   font-size: var(--text-xs);
}

.video .learning-item-details i:before {
   content: "\f03d";
}

.quiz .learning-item-details i:before {
   content: "\f0cb";
}

.course-content-footer.not-started .resume-btn,
.course-content-footer.not-started .certificate-btn,
.course-content-footer.in-progress .start-btn,
.course-content-footer.in-progress .certificate-btn,
.course-content-footer.completed .start-btn,
.course-content-footer.completed .resume-btn {
   display: none;
}

.course-content-footer button {
   background-color: var(--primary);
   height: 2.5em;
   color: var(--dark-content);
   filter: blur();
   border-radius: .25rem;
   border: none;
   width: 100%;
   padding: 0;
   font-size: var(--text-lg);
   display: block;
   margin-bottom: .5rem;
}

.course-content-footer button:hover {
   background-color: var(--primary-focus);
}

.course-content-footer .instruction {
   font-style: italic;
   font-size: var(--text-xs);
   color: var(--base-mute);
   text-align: center;
}

.related-content-wrapper {
   display: flex;
   flex-direction: column;
   gap: 1.75rem;
   margin: .75rem 0;
}

.related-content-wrapper .media {
   width: 100%;
}

.related-content-wrapper .session-img-link {
   display: block;
   width: 100%;
   padding-top: 56.25%;
   position: relative;
   overflow: hidden;
   border-radius: .5rem;
   margin-bottom: .5rem;
}

.related-content-wrapper .thumb-img {
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   object-fit: cover;
   width: 100%;
   height: 100%;
   transition: var(--three);
}

.related-content-wrapper .media:hover .thumb-img {
   transform: scale(1.1);
}

.related-content-wrapper .media a {
   text-decoration: none;
}

.related-content-wrapper .media h3 {
   line-height: 1.5;
   font-weight: 600;
   font-size: var(--text-base);
   transition: var(--three);
   margin-bottom: .5rem;
   text-decoration: none;
   overflow: hidden;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
}

.related-content-wrapper .media .session-description {
   font-size: var(--text-sm);
   overflow: hidden;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
   line-height: 1.5;
   margin-bottom: .5rem;
}

.media button {
   font-size: var(--text-sm);
   border-radius: 2rem;
   border: 1px solid rgba(36, 43, 104, .25);
   padding: 0 1rem;
   color: rgba(36, 43, 104, 1);
   background-color: rgba(36, 43, 104, .15);
   text-wrap: nowrap;
}

.media button.active {
   background-color: rgba(36, 43, 104, 1);
   color: var(--base-01);
}

.media button i {
   margin-right: .325rem;
}

.media button.active i {
   font-weight: 900;
}

.media button:hover {
   background-color: rgba(36, 43, 104, .25);
}

.media button.active:hover {
   background-color: var(--primary-focus);
}

.learning-content .heading .learning-navigation {
   display: flex;
   flex-wrap: wrap;
   gap: .5rem;
   background-color: var(--base-01);
   margin: .75rem -.75rem -.75rem -.75rem;
   border-top: 1px solid #678598;
   border-bottom: 1px solid #678598;
   padding: .75rem;
   justify-content: space-between;
}

.quiz-widget-container + .learning-navigation {
   padding: .75rem !important;
    margin: 0 !important;
}

.learning-content .heading .mark-learning-complete {
   width: 100%;
   display: flex;
   height: 3rem;
   border-radius: .25rem;
   justify-content: center;
   gap: 1rem;
   align-items: center;
   font-size: var(--text-lg);
   background-color: var(--dark-01);
   color: var(--dark-content);
   border: none;
}

.learning-content .heading .mark-learning-incomplete {
   width: 100%;
   display: flex;
   height: 3rem;
   border-radius: .25rem;
   justify-content: center;
   gap: 1rem;
   align-items: center;
   font-size: var(--text-lg);
   background-color: var(--dark-01);
   color: var(--dark-content);
   border: none;
}

.learning-content .heading .mark-learning-complete:hover {
   background-color: var(--dark-focus);
}

.learning-content .heading .mark-learning-incomplete:hover {
   background-color: var(--base-02);
}

.learning-content .heading .prev-learning,
.learning-content .heading .next-learning {
   flex: 1;
   display: flex;
   height: 3rem;
   border-radius: .25rem;
   justify-content: center;
   gap: 1rem;
   align-items: center;
   font-size: var(--text-base);
   background-color: rgb(208, 229, 237, .0);
   color: var(--dark-01);
   padding: 0 .5rem;
   text-decoration: none;
   border: 1px solid var(--dark-01);
}

.learning-content .heading .prev-learning:hover,
.learning-content .heading .next-learning:hover {
   background-color: var(--dark-focus);
   color: var(--dark-content);
}

.learning-content .heading .wrapper {
   padding: 0;
}

.learning-content .main-section .duration {
   color: var(--base-mute);
   font-size: var(--text-xs);
}

.learning-overview-main {
   color: var(--base-content)
}

.btn-row {
   display: flex;
   gap: 1rem;
}

.btn-primary,
.btn-secondary {
   display: flex;
   gap: 1rem;
   text-decoration: none;
   align-items: center;
   height: 3rem;
   padding: 0 1rem;
   font-weight: 500;
   border-radius: .25rem;
   font-size: var(--text-lg);
}

.tab-content>section {
   display: flex;
   flex-direction: column;
   gap: 1.5rem;
}

.tab-content>section p:not(:first-of-type) {
   padding-top: 0px;
}

.tab-content h2 {
   margin-top: .5rem;
   color: var(--base-emphasis);
   font-size: var(--text-3xl);
   margin-bottom: -1.5rem;
}

.tab-content h3 {
   margin-top: .5rem;
   padding-bottom: .25rem;
   color: var(--base-content);
   font-size: var(--text-2xl);
   font-weight: 500;
   border-bottom: 1px solid var(--border-color);
}

.learning-overview-main .btn-primary,
.disclosure-modal .btn-primary {
   background-color: var(--dark-01);
   color: var(--dark-content);
   border: 0px;
   justify-content: center;
}

.learning-overview-main .btn-secondary {
   border: 1px solid var(--dark-01);
   color: var(--dark-01)
}

.description-container {
   display: flex;
   flex-direction: column;
   gap: 1rem;
}

.description-container p:not(:first-of-type) {
   padding-top: 0;
}

.table-header-row,
.table-row {
   display: flex;
}

.sponsors-wrapper {
   display: flex;
   flex-wrap: wrap;
   gap: .5rem;
}

.sponsors-wrapper .sponsor-container {
   width: 100%;
   height: 100px;
   overflow: hidden;
   display: flex;
   justify-content: center;
   align-items: center;
}

.sponsors-wrapper .sponsor-container img {
   max-width: 100%;
   max-height: 100%;
   object-fit: contain
}

.tab-content>section a {
   color: var(--secondary-focus);
   font-weight: 500;
}

.faculty-wrapper {
   display: flex;
   gap: 1.5rem;
   flex-wrap: wrap;
}

.faculty-container {
   display: flex;
   gap: 1rem;
}

.avatar-container {
   flex-shrink: 0;
   width: 4rem;
   height: 4rem;
   overflow: hidden;
   display: flex;
   justify-content: center;
   align-items: center;
   border-radius: 100%;
}

.no-image .avatar-container {
   font-size: var(--text-3xl);
   font-weight: 900;
}

.no-image .avatar-container span {
   position: relative;
   top: 1px;
}

.theme-ocean.no-image .avatar-container {
   background-color: #00588a;
   color: var(--dark-content);
}

.theme-gold.no-image .avatar-container {
   background-color: #faa61a;
   color: var(--base-emphasis);
}

.theme-water.no-image .avatar-container {
   background-color: #abe1fa;
   color: var(--base-emphasis);
}

.theme-avocado.no-image .avatar-container {
   background-color: #67952e;
   color: var(--dark-content);
}

.theme-valencia.no-image .avatar-container {
   background-color: #f58320;
   color: var(--base-emphasis);
}

.faculty-container .afilliation-text {
   overflow: hidden;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
}

.faculty-container h4 {
   color: var(--base-emphasis);
   margin-bottom: .25rem;
}

.overview-list {
   margin-block-start: 0em;
   margin-block-end: 0em;
   padding-inline-start: 1.25rem;
}

.overview-list li:not(:last-of-type) {
   padding-bottom: .5rem;
   line-height: 1.4;
}

.dates-container dl div,
.credit-container dl div {
   display: flex;
   gap: .375rem;
}

.dates-container dt,
.credit-container dt {
   font-weight: bold;
}

.dates-container dd,
.credit-container dd {
   margin: 0;
}

.collapsible-container {
   width: 100%;
   border-radius: 8px;
   border: 1px solid #ccc;
   overflow: hidden;
}

.collapsible-header {
   background-color: #f0f0f0;
   color: white;
   padding: 15px 20px;
   cursor: pointer;
   border-radius: .5rem .5rem 0 0;
   position: relative;
   display: flex;
   flex-direction: row;
   align-items: flex-start;
   border-bottom: 1px solid #ccc;
}

.collapsible-header h2 {
   font-weight: 600;
   font-size: var(--text-lg);
   color: var(--base-emphasis);
   display: flex;
   margin: 0;
}

.collapsible-header p {
   margin: 5px 0 0;
   font-size: 14px;
}

.collapsible-header .header-content {
   display: flex;
   flex-direction: column;
}

.collapsible-header .header-content p {
   color: var(--base-mute);
}

.arrow-icon {
   margin-right: 1rem;
   color: var(--secondary-focus);
   position: relative;
   top: 4px;
   transition: transform 0.3s ease;
}

.collapsible-header.active .arrow-icon {
   transform: rotate(-180deg);
}

.collapsible-content {
   background-color: #fff;
   padding: 15px 20px;
   display: none;
}

.collapsible-content:not(:last-of-type) {
   border-bottom: 1px solid #ccc;
}

.session {
   padding-left: 2.25rem;
}

.session:not(:last-of-type) {
   margin-bottom: 20px;
}

.session h3 {
   margin: 0 0 5px;
   font-size: 16px;
   color: #333;
   border: 0;
   padding: 0;
}

.session p {
   margin: 2px 0;
   font-size: 14px;
   color: #555;
}

.agenda-container>p {
   margin-bottom: -.75rem;
}

.faculty-container .afilliation-text {
   font-size: var(--text-sm);
   line-height: 1.4;
}

.disclosure-button {
   color: var(--secondary-focus);
   border: none;
   background-color: transparent;
   padding: 0;
   margin-top: .25rem;
   text-decoration: underline;
   font-size: var(--text-sm);
}

.disclosure-button:hover {
   color: var(--base-emphasis);
}

.disclosure-modal .faculty-container {
   align-items: center;
}

.disclosure-modal {
   white-space: normal;
}

.disclosure-modal .modal-body p {
   margin-bottom: .5rem;
}

.disclosure-modal .modal-footer {
   display: flex;
   justify-content: flex-end;
}

div[role="table"] {
   display: flex;
   flex-direction: column;
   border: 1px solid #ccc;
   border-radius: 8px;
   overflow-x: auto;
}

/* Create a gradient effect on the right side of the table */
.table-wrapper {
   position: relative;
}

.table-gradient {
   content: '';
   position: absolute;
   top: 1px;
   bottom: 1px;
   right: 0;
   width: 20px;
   height: 100%;
   background: linear-gradient(to left, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
   pointer-events: none;
   visibility: visible;
   /* Initially visible */
   z-index: 10;
   /* Make sure it's above the table content */
}

div[role="rowgroup"]:first-child div[role="row"] {
   background-color: #f9fafb;
   font-weight: bold;
}

div[role="row"] {
   display: flex;
   flex-direction: row;
   background-color: white;
}

div[role="columnheader"],
div[role="rowheader"] {
   background-color: #f0f0f0;
   font-weight: 600;
}

div[role="columnheader"],
div[role="rowheader"],
div[role="cell"] {
   padding: 12px;
   text-align: left;
   border-right: none;
   min-width: 10rem;
}

div[role="cell"] {
   background-color: #fff;
   border-bottom: 1px solid #ddd;
}

div[role="table"] .date-range {
   min-width: 16rem;
}

/* Last column doesn't need a right border */
div[role="columnheader"]:last-child,
div[role="rowheader"]:last-child,
div[role="cell"]:last-child {
   border-right: none;
}

/* Last row shouldn't have a bottom border */
div[role="rowgroup"]:last-child div[role="row"]:last-child div[role="cell"],
div[role="rowgroup"]:last-child div[role="row"]:last-child div[role="rowheader"] {
   border-bottom: none;
}

.learning-overview-wrapper ul {
   padding-inline-start: 1rem;
}

/* *********************************** */
/*                  TABS               */
/* *********************************** */
.navigation-tabs-container {
   position: relative;
}

.navigation-tabs-container::after {
   content: "";
   position: absolute;
   right: 0;
   top: 0;
   bottom: 1px;
   width: 4rem;
   background: linear-gradient(270deg, #ffffff, transparent);
}

.navigation-tabs-wrapper {
   display: flex;
   width: 100%;
   overflow: scroll;
   border-bottom: 1px solid var(--border-color);
   background-color: var(--base-01);
}

.navigation-tabs-wrapper .tab {
   flex-basis: 1 0 0;
   padding: .75rem .75rem .625rem .75rem;
   cursor: pointer;
   background: #fff;
   text-wrap: nowrap;
   border-bottom: 2px solid transparent;
   transition: var(--three);
   color: var(--base-emphasis);
}

.navigation-tabs-wrapper .tab:hover {
   background: var(--base-04);
}

.navigation-tabs-wrapper .tab .sm-hide {
   display: none;
}

.navigation-tabs-wrapper .tab.active {
   color: var(--secondary-focus);
   text-shadow: .5px 0px 0px var(--secondary-focus);
   border-bottom: 2px solid var(--secondary-focus);
}

.tab-content {
   display: none;
   padding: 20px;
   background-color: var(--base-02);
   padding: .75rem;
   width: 100%;
}

.tab-content.active {
   display: flex;
   flex-direction: column;
   gap: 2rem;
}

/* *********************************** */
/* TEXT OBJECT
/* *********************************** */

.text-object h5 {
    font-size: var(--text-lg);
}

.text-object h5:first-of-type {
  margin-top: 0;
}

.text-object ul {
    padding-inline-start: 1rem;
    list-style-position: outside;
}

.text-object a {
    font-weight: 500;
    color: var(--base-emphasis);
}

@media only screen and (min-width: 360px) {

   /* *********************************** */
   /*                 HEADER              */
   /* *********************************** */
   .heading .heading-intro {
      margin-bottom: 1.25rem;
   }

   /* *********************************** */
   /*                  TABS               */
   /* *********************************** */
   /* *********************************** */
   /*         FULL-WIDTH SECTIONS         */
   /* *********************************** */
   .sponsors-wrapper {
      gap: 1rem;
   }

   .sponsors-wrapper .sponsor-container {
      width: calc(50% - .5rem);
      height: 3rem;
   }

   .learning-overview-main .btn-primary {
      width: fit-content;
   }
}

@media only screen and (min-width: 500px) {

   /* *********************************** */
   /*                 HEADER              */
   /* *********************************** */

   .heading-content {
      position: relative;
   }

   .heading-content .wrapper {
      flex-direction: row;
      flex-wrap: nowrap;
      align-items: center;
      width: 100%;
   }

   .heading button.course-contents-reveal {
      display: block;
      height: 3rem;
      width: 3rem;
      align-items: center;
      border-radius: 0 8px 8px 0;
      overflow: hidden;
      /*box-shadow: 0 4px 8px -2px rgba(0, 0, 0, 0.33);*/
      color: var(--dark-content);
      background-color: var(--dark-01);
      transition: var(--three);
      position: absolute;
      left: 0;
      top: 50%;
      transform: translateY(-50%);
   }

   .heading button.course-contents-reveal:hover {
      width: 12.5rem;
   }

   .heading button.course-contents-reveal i {
      position: absolute;
      margin-right: 0;
      padding-right: 0;
      top: 50%;
      transform: translateY(-50%);
      left: 12px;
   }


   .learning-overview .heading button.course-contents-reveal span {
      display: unset;
      position: unset;
      top: unset;
      left: unset;
      transform: unset;
      font-size: var(--text-base);
   }





   .heading button.course-contents-reveal span {
      font-size: var(--text-sm);
      text-wrap: nowrap;
      line-height: 1;
      position: absolute;
      top: 51%;
      left: 40px;
      transform: translateY(-50%);
   }



   .learning-overview .heading button.course-contents-reveal span.close-course-contents-text {
      display: none;
   }

   .learning-content-title,
   .learning-content .heading h1 {
      margin-bottom: 0;
      font-size: .95rem;
      line-height: 1.3;
      font-weight: 600;
   }

   .learning-content-title {
      margin-left: 2rem;
      flex-grow: 1;
   }

   .learning-content .heading h1 {
      font-size: var(--text-base);
   }

   .heading .heading-content button.favorite-btn {
      border-radius: 50%;
      width: 36px;
      height: 36px;
      padding: 0;
      flex: unset;
   }

   .learning-content .course-progress {
      flex-direction: row;
      margin-bottom: 0;
      flex-basis: 180px;
      flex-shrink: 0;
   }

   .learning-content .course-progress .course-progress-indicator {
      width: unset;
   }

   .circle-inner {
      display: none;
   }


   .heading .heading-content button.favorite-btn i {
      font-size: var(--text-xl);

   }

   .heading .heading-content button.favorite-btn span {
      display: none;
   }



   .learning-overview .heading .heading-content .favorite-btn {
      width: fit-content;
      padding: 0 1.25rem;
      flex-grow: unset;
   }

   .learning-content .learning-overview .course-progress>*:nth-child(2),
   .learning-content .learning-overview .course-progress>*:nth-child(3) {
      flex: 0 0 calc(50% - .5rem);
   }

   .learning-content .learning-overview .course-progress .favorite-btn,
   .heading .heading-content a {
      height: 3rem;
   }

   .learning-overview .heading .heading-content .course-progress .favorite-btn {
      flex: 0 0 calc(50% - .5rem);
   }

   .homepage-hero-banner .btn-row {
      flex-direction: row;
   }

   .homepage-hero-banner .btn-row a {
      width: fit-content;
      flex-shrink: 0;
   }

   /* *********************************** */
   /*                  TABS               */
   /* *********************************** */
   /* *********************************** */
   /*         FULL-WIDTH SECTIONS         */
   /* *********************************** */
   .people-container,
   .related-content-wrapper {
      row-gap: 1rem;
      column-gap: 1.5rem;
   }

   .person {
      width: calc((100% - 1.5rem) / 2);
   }

   .related-content-wrapper {
      flex-direction: row;
      flex-wrap: wrap;
      row-gap: 1.5rem;
   }

   .related-content-wrapper .media {
      width: calc((100% - 1.5rem) / 2);
   }

   .course-content-footer button {
      width: fit-content;
      padding: 0 1.5rem;
   }

   .course-content-footer .instruction {
      text-align: unset;
   }
}

@media only screen and (min-width: 640px) {

   /* *********************************** */
   /*                 HEADER              */
   /* *********************************** */

   .heading-content {
      padding: .75rem 1.25rem
   }

   .heading button.course-contents-reveal {
      width: 42px;
      height: 42px;
   }

   .learning-content-title {
      margin-left: 1.5rem;
   }

   .homepage-hero-banner .wrapper {
      flex-wrap: nowrap;
      align-items: center;
   }

   .homepage-hero-banner .thumb-img {
       max-width: 14rem;
   }

   .heading-content .wrapper {
      flex-direction: row;
      flex-wrap: wrap;
      align-items: center;
   }


   .learning-content-title {
      flex-grow: 1;
      margin-bottom: 0;
      flex-basis: calc(100% - 230px);
   }

   .heading h1 {
      margin-bottom: 0;
   }

   .course-progress {
      align-items: flex-end;
      margin-bottom: 0;
   }

   .learning-content .heading .learning-navigation {
      flex-direction: row;
      flex-wrap: nowrap;
      margin: 1.25rem -1.25rem -1.25rem -1.25rem;
      padding: 0.75rem 1.25rem;
   }

.quiz-widget-container + .learning-navigation {
   padding: 0.75rem 1.25rem !important;
}
   .learning-content .heading .learning-navigation > * {
      flex: 0 0 calc((100% - 1rem) / 3);
   }

   /* *********************************** */
   /*                  TABS               */
   /* *********************************** */
   .anchor-link-reveal {
      display: none;
   }

   .anchor-link-container {
      visibility: unset;
      opacity: unset;
      transform: unset;
      display: flex;
      flex-direction: unset;
      position: unset;
      left: unset;
      top: unset;
      background-color: var(--base-01);
      min-width: 100%;
      z-index: 1;
      border-radius: 0;
      padding: .75rem 1.25rem;
      text-wrap: nowrap;
      border-top: none;
      border-left: none;
      border-right: none;
      border-bottom: .5px solid var(--border-color);
      box-shadow: 0px 4px 16px -4px rgba(0, 0, 0, 0.2);
      transition: none;
      overflow: hidden;
      gap: 1rem;
   }

   .anchor-link {
      padding: .5rem .75rem;
      font-size: var(--text-base);
      border-radius: .5rem;
      color: var(--base-mute);
      transition: var(--three);
   }

   .anchor-link:hover {
      background-color: var(--base-02);
   }

   .anchor-link.active {
      background-color: var(--base-02);
      color: var(--base-content);
      position: relative;
      font-weight: 600;
   }

   .anchor-link.active::after {
      content: "";
      position: absolute;
      width: 100%;
      bottom: -.75rem;
      height: 2px;
      background-color: var(--primary);
      left: 0;
      border-radius: 2px;
   }

   /* *********************************** */
   /*         FULL-WIDTH SECTIONS         */
   /* *********************************** */
   .tab-content {
      padding: 1.25rem;
   }

   .faculty-wrapper .faculty-container {
      width: calc(50% - .75rem)
   }
}

@media only screen and (min-width: 768px) {

   /* *********************************** */
   /*                 HEADER              */
   /* *********************************** */
   .heading .heading-content button,
   .heading .heading-content a {
      font-size: var(--text-base);
      font-weight: 500;
   }

   .learning-content .heading-content {
      display: flex;
      flex-wrap: wrap;
      flex-direction: column;
      justify-content: center;
      margin-bottom: 1.5rem;
      row-gap: .5rem;
      align-items: flex-start;
   }

   .heading button.course-contents-reveal span {
      left: 46px
   }

   .learning-content-title {
        flex-basis: calc(100% - 250px);
   }

   .learning-content .learning-overview .heading .heading-content .learning-content-title {
      width: 100%;
   }

   .learning-content .learning-overview .heading .course-progress-indicator {
      gap: .75rem;
   }

    .learning-content .course-progress {
        flex-basis: 200px;
    }

   .learning-content .learning-overview .course-progress .course-progress-indicator .label {
      display: unset;
   }

   .learning-content .learning-overview .course-progress .resume-btn,
   .learning-content .learning-overview .course-progress .start-btn {
      flex: 1 0 auto;
   }

   .learning-content .learning-overview .heading .heading-content .course-progress button.favorite-btn {
      border-radius: .25rem;
      width: fit-content;
      flex: 1 0 auto;
      padding: 0 1rem;
      gap: 1rem;
   }

   /* *********************************** */
   /*                  TABS               */
   /* *********************************** */
   /* *********************************** */
   /*         FULL-WIDTH SECTIONS         */
   /* *********************************** */
   .sponsors-wrapper {
      gap: 1.5rem;
   }

   .sponsors-wrapper .sponsor-container {
      width: calc(33% - 1.5rem);
      height: 5rem;
   }

   .collapsible-header .header-content,
   .collapsible-content .session {
      display: flex;
      flex-direction: row;
      width: 100%;
   }

   .collapsible-header p,
   .collapsible-content .session p {
      min-width: 10rem;
      flex-shrink: 0;
   }

   .collapsible-header h2,
   .collapsible-content .session-details {
      flex-grow: 1;
   }

   .text-object p:not(:first-of-type) {
      padding-top: 0;
   }
}

@media only screen and (min-width: 880px) {}

@media only screen and (min-width: 1024px) {

   /* *********************************** */
   /*                 HEADER              */
   /* *********************************** */
   .heading .wrapper {
      display: flex;
      gap: 2rem;
      align-items: center;
   }

   .learning-content .heading .heading-content .learning-content-title {
      margin-left: 0;
   }

   .homepage-hero-banner .wrapper {
      padding: 2rem 2.5rem;
   }

   .heading .course-preview-video-wrapper {
      order: 1;
   }

    .learning-content-title {
        flex-basis: calc(100% - 270px);
    }

   .learning-overview .heading .heading-content {
      margin-bottom: 0;
      flex: 0 0 57%;
      order: 0;
   }

   .learning-content .heading .learning-navigation {
      width: calc(100% + 5rem);
      margin: 0 -8rem -2rem -8rem;
   }

   .quiz-widget-container + .learning-navigation {
      width: 100% !important;
  }

   .learning-overview .heading .button-row {
      display: flex;
      align-items: center;
      gap: 1rem;
   }


   .course-preview-video-wrapper {
      margin: auto 0;
      flex: 0 1 43%;
   }

   .learning-content .learning-overview .course-progress {
      margin-bottom: 1.25rem;
      flex-wrap: wrap;
      row-gap: 2rem;
      width: unset;
   }

   .learning-overview .heading .heading-content .resume-btn {
      width: fit-content;
      height: 3rem;
   }

   .learning-content .learning-overview .heading .wrapper {
      display: flex;
   }

   .learning-content .learning-overview .heading .heading-content {
      flex-direction: column;
      align-items: start;
   }

   .learning-content .heading .heading-content {
      align-items: center;
      gap: 1rem;
      position: relative;
      flex-wrap: nowrap;
   }




   .learning-content .heading .heading-content .learning-content-title {
      width: auto;
      flex-shrink: 1;
   }

   .learning-content .course-progress {
      flex-wrap: nowrap;
   }

   .learning-content .body-content .main-section aside {
      margin-top: 2rem;
   }

   .learning-content .body-content.learning-overview .main-section .alt-background:nth-of-type(odd) {
      background-color: var(--base-05);
   }

   .learning-content .body-content.learning-overview .main-section .main-body .wrapper {
      padding-right: 26rem;
   }

   .learning-content .body-content.learning-overview .main-section aside {
      position: absolute;
      top: 0;
      right: 0;
   }

   .learning-content .learning-overview .course-progress>*:nth-child(2),
   .learning-content .learning-overview .course-progress>*:nth-child(3),
   .learning-content .learning-overview .course-progress>*:nth-child(4) {
      flex: 1 0 calc((100% - 6rem) / 3);
      width: fit-content;
      flex-wrap: nowrap;
      text-wrap: nowrap;
   }



   .learning-overview .heading .heading-detail {
      margin: 0;
      margin-top: -.5rem;
   }

   /* *********************************** */
   /*        COURSE CONTENTS ASIDE        */
   /* *********************************** */
   .learning-content .learning-content-aside .course-content-wrapper {
      padding: 0;
   }

   /* *********************************** */
   /*                  TABS               */
   /* *********************************** */
   .anchor-link-container {
      padding: .75rem 2.5rem;
      justify-content: flex-start;
      gap: 1.5rem;
      font-size: var(--text-base);
   }

   .anchor-link.course-content {
      display: none;
   }

   /* *********************************** */
   /*         FULL-WIDTH SECTIONS         */
   /* *********************************** */
   .tab-content {
      padding: 2rem 2.5rem;
   }

   .body-content {
      position: relative;
   }

   .main-section .wrapper {
      width: calc(100% - 26rem);
      margin-right: auto;
   }

   .body-content aside {
      position: absolute;
      top: 2.5rem;
      right: 2.5rem;
      background-color: unset !important;
      height: 100%;
      padding: 0 0 4.5rem 0;
      width: 22rem;
   }

   .body-content aside .wrapper {
      position: sticky;
      top: 6rem;
   }

   aside.alt-background h2 {
      border: 1px solid var(--border-color);
      border-top-right-radius: .75rem;
      border-top-left-radius: .75rem;
      padding: .75rem 1.5rem;
      background-color: var(--base-01);
      line-height: 1;
      font-size: var(--text-lg);
      margin-bottom: .5rem;
   }

   aside .course-content-wrapper {
      border: 1px solid var(--border-color);
      padding: 1.5rem 1.5rem;
      background-color: var(--base-01);
      margin-bottom: .5rem;
      margin-top: 0;
   }

   .not-started .progress-indicator {
      border: 1px solid var(--base-mute);
   }

   aside.alt-background .course-content-footer {
      border: 1px solid var(--border-color);
      border-bottom-right-radius: .75rem;
      border-bottom-left-radius: .75rem;
      padding: 1.25rem 1.5rem;
      background-color: var(--base-01);
      line-height: 1;
      font-size: var(--text-lg);
      margin-bottom: .5rem;
   }

   .course-content-footer button {
      width: 100%;
      margin-bottom: 1rem;
   }

   .course-content-footer .instruction {
      text-align: center;
   }

   .learning-content .body-content .main-section {
      display: flex;
   }

   .learning-content .body-content .main-section .alt-background {
      background-color: transparent;
   }

   .learning-content .body-content .main-section .wrapper {
      width: 100%;
      margin-right: 0;
   }

   .learning-content .body-content .main-section aside {
      position: unset;
      flex-shrink: 0;
      margin-right: 2.5rem;
   }

   .resources-container ul li {
      color: var(--primary-focus);
   }

   .learning-content .course-content-wrapper {
      border-bottom-right-radius: .75rem;
      border-bottom-left-radius: .75rem;
   }
}

@media only screen and (min-width: 1280px) {

   /* *********************************** */
   /*                 HEADER              */
   /* *********************************** */
   .heading .wrapper {
      justify-content: space-between;
   }

   .homepage-hero-banner .thumb-img {
      max-width: 18rem;
   }

   .homepage-hero-banner {
      height: unset;
   }

   .heading .heading-content {
      flex: 1 0 42rem;
      max-width: 42rem;
      width: 100%;
   }

    body:not(.cmpl_embeds_v1) .cmpl_iframe_div.cmpl_no_transcript.cmpl_audio_player {
        position: unset !important;
        width: 100%;
    }

    body:not(.cmpl_embeds_v1) .cmpl_iframe_div.cmpl_no_transcript.cmpl_audio_player iframe {
        height: 216px !important;
    }

    .learning-content .heading .learning-navigation {
        width: calc(100%);
        margin-bottom: 0;
    }

   .course-preview-video-wrapper {
      flex: unset;
      margin: auto;
   }

   .course-preview-video {
      max-width: 34rem;
      width: 100%;
   }

   .heading h1 {
      font-size: var(--text-5xl);
   }

   .heading .heading-detail {
      font-size: var(--text-base);
   }

   .course-progress {
      margin-bottom: 2.5rem;
   }

   .learning-content .learning-overview .heading .heading-content .learning-content-title,
   .learning-content .learning-overview .heading .course-progress-indicator,
   .learning-overview .heading .heading-content .resume-btn {
      margin-left: 0;
   }

   .learning-content .heading .learning-video-wrapper {
      box-shadow: unset;
      padding: 0;
      background-color: transparent;
   }

   .learning-content .learning-overview .heading .wrapper {
      padding-top: 3rem;
      padding-bottom: 3rem;
   }

   .learning-overview .heading button.course-contents-reveal {
      justify-content: center;
   }

   /* *********************************** */
   /*        COURSE CONTENTS ASIDE        */
   /* *********************************** */

   .learning-content .learning-content-aside {
      position: relative;
      left: 0;
      display: none;
      flex-shrink: 0;
      position: sticky;
      top: 0;
      transition: none;
   }

   .learning-content .learning-content-aside.active {
      display: flex;
   }

   .learning-content .learning-content-aside .course-content-wrapper {
      padding: 0;
   }

   .learning-content .heading .heading-content {
      max-width: unset;
      gap: 1rem;
      margin-bottom: 0;
   }

   .learning-overview .heading button.course-contents-reveal * {
      font-size: var(--text-sm);
      gap: 0;
   }

   .shorten .course-contents-container {
      display: none;
   }

   .course-contents-container {
      width: 320px;
      position: absolute;
      inset: 0;
      border-right: 1px solid #678598;
   }

   .heading button.course-contents-reveal {
      position: relative;
      top: unset;
      transform: unset;
      color: unset;
      background-color: unset;
      box-shadow: unset;
      border: none;
      width: auto;
      width: 100%;
      height: 100%;
      border-radius: 0;
   }

   .learning-overview.shorten .heading button.course-contents-reveal .close-course-contents-text {
      display: block;
   }

   .learning-overview.shorten .heading button.course-contents-reveal span:nth-of-type(2) {
      display: none;
   }

   .learning-overview.shorten .heading .resume-btn {
      flex: 1 0 100%;
   }

   .learning-content .learning-overview.shorten .course-progress>*:nth-child(3),
   .learning-content .learning-overview.shorten .course-progress>*:nth-child(4) {
      flex: 0 1 calc(50% - .5rem);
      width: fit-content
   }

   .learning-overview .heading button.course-contents-reveal span {
      margin-left: 0;
   }

   .heading button.course-contents-reveal:hover {
      width: 100%;
      background-color: var(--dark-02);
   }

   .heading button.course-contents-reveal>* {
      position: relative;
      top: unset;
      left: unset;
   }

   .heading button.course-contents-reveal i {
      position: relative;
      top: unset;
      left: unset;
      transform: unset;
   }

   .heading button.course-contents-reveal span {
      position: relative;
      top: unset;
      left: unset;
      transform: unset;
      font-size: var(--text-lg);
      margin-left: 1rem;
   }

   .learning-content .shorten .heading .heading-content .learning-content-title {
      margin-left: 0 !important;
   }

   .learning-content .heading .heading-content .learning-content-title {
      margin-left: 320px !important;
         flex: 0 0 calc(100% - 560px);
   }

   /* *********************************** */
   /*                  TABS               */
   /* *********************************** */
   .anchor-resources {
      display: none;
   }

   .learning-overview-main {
      padding: 2rem 2.5rem;
      background-color: var(--base-02);
   }

   .learning-overview-wrapper {
      display: flex;
      flex-direction: row;
      gap: 4rem;
   }

   .navigation-tabs-wrapper {
      width: 16rem;
      flex-direction: column;
      margin-bottom: 0px;
      border: 1px solid var(--border-color);
      border-radius: .5rem;
      overflow: hidden;
      position: sticky;
      top: 2rem;
   }

   .navigation-tabs-wrapper::after,
   .navigation-tabs-container::after {
      display: none;
   }

   .navigation-tabs-wrapper .tab {
      border-bottom: none;
      border-left: 4px solid transparent;
   }

   .navigation-tabs-wrapper .tab:hover {
      background-color: var(--base-03);
   }

   .navigation-tabs-wrapper .tab.active {
      border-bottom: none;
      background-color: var(--base-04);
      border-left: 4px solid var(--secondary-focus);
   }

   /* *********************************** */
   /*         FULL-WIDTH SECTIONS         */
   /* *********************************** */
   .tab-content h2 {
      margin-top: 0rem;
   }

   .tab-content {
      padding: 0rem;
   }

   .navigation-tabs-wrapper .tab .sm-hide {
      display: unset;
   }

   .text-object {
      padding: 2rem 2.5rem;
   }

   .shorten .text-object {
      padding: 0.75rem 1.25rem;
   }
}

@media only screen and (min-width: 1536px) {

   /* *********************************** */
   /*                 HEADER              */
   /* *********************************** */

   .learning-content .heading .heading-content .learning-content-title {
      margin-left: 292px !important;
        flex: 0 0 calc(100% - 620px);
   }

    .learning-content .heading .learning-video-wrapper {
        position: relative;
        padding-bottom: 114px;
    }

    .learning-content .heading .learning-navigation {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0;
    width: 100%;
    }

.quiz-widget-container + .learning-navigation {
   left: 0.75rem;
    right: 0.75rem;
}

   .heading .wrapper {
      gap: 8rem;
   }

   .learning-content .heading .wrapper {
      margin: 0;
   }

   .homepage-hero-banner .wrapper {
      padding: 0px;
      max-width: 90rem;
      margin: 2rem auto;
      align-items: center;
   }

   .homepage-hero-banner {
      height: unset;
   }

.homepage-hero-banner .heading-content {
    flex-basis: 55%;
}

   .homepage-hero-banner h1 {
      font-size: var(--text-7xl);
      margin-bottom: 1rem;
   }



   .learning-content .shorten .heading .wrapper {
      margin: 0 3rem;
   }

   .learning-content .learning-overview.shorten .course-progress>*:nth-child(2),
   .learning-content .learning-overview.shorten .course-progress>*:nth-child(3),
   .learning-content .learning-overview.shorten .course-progress>*:nth-child(4) {
      flex: 0 1 calc(33% - 3rem);
      width: fit-content
   }

   /* *********************************** */
   /*                  TABS               */
   /* *********************************** */

   .anchor-link-container {
      padding-top: .75rem;
      padding-bottom: .75rem;
      padding-left: calc((100vw - 90rem) / 2);
      padding-right: calc((100vw - 90rem) / 2);
   }

   /* *********************************** */
   /*         FULL-WIDTH SECTIONS         */
   /* *********************************** */
   .learning-overview-main {
      max-width: 90rem;
      margin: 0 auto;
      padding: 2rem 0;
   }

   .main-section .wrapper {
      margin-left: calc((100vw - 90rem) / 2);
      width: 64rem;
   }

   .body-content aside {
      right: calc((100vw - 90rem) / 2);
   }

   .learning-content .body-content .main-section {
      margin-left: calc((100vw - 90rem) / 2);
      margin-right: calc((100vw - 90rem) / 2);
      gap: 3rem;
   }

   .learning-content .body-content.shorten .main-section {
      margin-left: 3rem;
      margin-right: 3rem;
   }

   .learning-content .body-content.learning-item-content .main-section aside {
      margin-right: 0 !important;
   }

   .learning-content .body-content.learning-overview .main-section aside {
      margin-right: calc((100vw - 90rem) / 2);
   }

   .learning-content .body-content .main-section .wrapper {
      margin-left: 0;
   }

   .learning-content .body-content.learning-overview .main-section {
      margin-left: 0;
      margin-right: 0;
      display: block;
   }

   .learning-content .body-content.learning-overview .main-section .main-body .wrapper {
      margin-left: calc((100vw - 90rem) / 2);
   }

   .learning-content .body-content.learning-overview.shorten .main-section .main-body .wrapper {
      margin-left: 3rem;
      padding-right: 31rem;
   }

   .learning-content .body-content.learning-overview.shorten .main-section aside {
      margin-right: 3rem;
   }

   .learning-content .body-content.learning-overview.shorten .anchor-link-container {
      padding-left: 3rem;
      padding-right: 3rem;
   }

   .faculty-wrapper {
      gap: 2rem;
   }

   .faculty-wrapper .faculty-container {
      width: calc(33% - 3rem);
   }

   .learning-video-wrapper .wrapper:has(> .text-object)  {
      padding: 0;
      margin: 1rem auto 0;
   }

   .shorten .learning-video-wrapper .wrapper:has(> .text-object)  {
      padding: 0;
      margin: 0;
   }

   .shorten .text-object {
      padding: 0.75rem 1.25rem;
   }
}

@media only screen and (min-width: 1853px) {
   .learning-content .shorten .heading .wrapper {
      max-width: 90rem;
      margin: 0 auto;
   }

   .learning-content .body-content.shorten .main-section {
      max-width: 90rem;
      margin-left: auto;
      margin-right: auto;
   }

   .learning-content .body-content.learning-overview.shorten .main-section {
      margin: 0;
      max-width: unset;
   }

   .learning-content .body-content.learning-overview.shorten .main-section .main-body .wrapper {
      max-width: 90rem;
      margin-left: auto;
      margin-right: auto;
   }

   .learning-content .body-content.learning-overview.shorten .main-section aside {
      margin-right: calc((100vw - 20rem - 90rem) / 2);
   }

   .learning-content .body-content.learning-overview.shorten .anchor-link-container {
      padding-left: calc((100vw - 110rem) / 2);
      padding-right: calc((100vw - 110rem) / 2);
   }
}

.author-avatar {
   font-size: var(--text-xl);
   padding: 2rem;
   font-weight: 600;
   line-height: 1.3;
}

.author-avatar .title {
   overflow: hidden;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 4;
   transition: var(--three);
}


.author-avatar {
   left: 21.875%;
   right: 21.875%;
}

.author-avatar {
   display: flex;
   width: 100%;
   height: 100%;
   justify-content: center;
   align-items: center;
   text-decoration: none;
   transition: var(--three);
}


.author-avatar.dark-blue {
   background-color: var(--primary);
   color: var(--primary-content);
}

.author-avatar.light-blue {
   background-color: #6284C3;
   color: var(--primary-content);
}

.author-avatar.purple {
   background-color: #a97eb0;
   color: var(--primary-content);
}

.author-avatar.red {
   background-color: #e84360;
   color: var(--primary-content);
}

.author-avatar.peach {
   background-color: #f0a693;
   color: var(--base-content);
}

.author-avatar.orange {
   background-color: #e87524;
   color: var(--primary-content);
}

.author-avatar.yellow {
   background-color: #f3c317;
   color: var(--base-content);
}

.author-avatar.green {
   background-color: #56c271;
   color: var(--base-content);
}

.author-avatar.aqua {
   background-color: #00b0ad;
   color: var(--base-content);
}

.author-avatar.mint {
   background-color: #84c7bc;
   color: var(--base-content);
}

#disclosureContainer {
   flex-grow: 1;
}