html {
scroll-behavior: smooth;
}
section.padded {
padding-top: 4rem;
padding-bottom: 4rem;
}
body.page-template-page-fullwidth #main {
padding-top: 4rem;
}
.site-header .header-aside i {
color: inherit;
}
.woocommerce-terms-and-conditions-wrapper #gh_marketing_consent_field {
display: none;
}
header#masthead .header-divider {
border-left: none;
}
header .user-link img {
max-width: 54px;
border: solid 3px #e0607e;
}
#site-logo .site-title .bb-logo img, #site-logo .site-title img.bb-logo, .buddypanel .site-title img {
width: inherit!important;
max-height: 82px!important;
}
.site-header {
box-shadow: none!important;
border-bottom: solid 4px #e0607e;
padding-bottom: .25rem;
}
.smexpert-header-icon {
height: 1.75rem;
}
.bb-template-v2 .site-header .user-wrap.menu-item-has-children .user-link .user-name {
font-size: 1.1em;
font-family: "Shadows Into Light Two";
}
.bb-template-v2 .site-header .user-wrap.menu-item-has-children .user-link .user-name:after {
content: "\e826";
font-family: "bb-icons";
color: #e0607e;
font-weight: 400;
font-size: 1.4em;
margin: 0 0.35rem;
}
hr {
background-color: #e0607e;
}
.bb-template-v2 .site-header .user-wrap.menu-item-has-children .sub-menu .user-link .user-name:after {
display: none;
}
.course-index-banner {
background-color: #627C7B;
color: #FFF;
background-size: cover;
margin-bottom: 0;
background-repeat: no-repeat;
}
.course-index-banner .container {
padding: 2rem 0;
}
.course-index-banner h1 {
font-size: 3em;
color: #fff5e9;
border-bottom: 4px solid;
padding-bottom: .75rem;
border-image: linear-gradient(to right, #e8d65c 12%, transparent 12%) 100% 4;
}
.button, button {
font-family: "Shadows Into Light Two";
font-size: 1.15em;
}
.button.large {
font-size: 1.15em;
}
.uo-tclr-open-content-button.uo-tclr-open-content-button--large {
padding: 32px 65px;
font-size: 1.8em;
}
.uo-tclr-open-content-button {
font-family: "Shadows Into Light Two";
font-size: 1.3em;
background-color: #e8d65c;
color: #627C7B;
border: none;
}
.uo-tclr-open-content-button:hover {
background-color: #d6c652;
}
.footer-logo-wrap {
margin-bottom: 0;
}
footer.footer-bottom {
background-color: #4B5C63;
border-top: solid 6px #e0607e;
color: #FFF;
}
#main h2.course-index-section-title, .main-title, h1.entry-title, #content div.product div.summary h1.product_title, .course-index-section-subtitle {
border-bottom: 4px solid;
padding-bottom: .75rem;
border-image: linear-gradient(to right, #e0607e 45%, transparent 45%) 100% 4;
display: inline-block;
font-size: 2em;
line-height: 1.3;
}
.course-index-section-subtitle {
display: inline-block;
margin-top: 2rem;
margin-bottom: 2rem;
font-size: 1.5em;
color: #e8d65c;
}
.single-resource-or-template-container {
padding: 2rem;
background-color: #FFF;
border-radius: 1rem;
}
.course-type-template .bb-learndash-content-wrap {
max-width: 1000px;
margin: auto;
}
#learndash-content .learndash_content_wrap a {
color: #e0607e;
font-weight: bold;
text-decoration: underline;
}
#learndash-content .learndash_content_wrap a:hover {
color: #c65671;
}
#subfooter {
background-color: #627C7B;
}
.bb-footer .footer-socials i {
font-size: 30px;
font-weight: 300;
}
/**
* WooCommerce Single Product Page Customization
*/
.single-product .summary.entry-summary {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
width: 100%;
}
.smexpert-product-summary-left {
flex: 0 0 53%;
max-width: 53%;
}
.smexpert-product-summary-right {
flex: 0 0 43%;
max-width: 43%;
padding: 0 2rem;
border-radius: 8px;
text-align: center;
display: flex;
flex-direction: column;
justify-content: center;
}
.woocommerce div.product form.cart .button {
float: none;
}
@media (max-width: 768px) {
.smexpert-product-summary-left,
.smexpert-product-summary-right {
flex: 0 0 100%;
max-width: 100%;
}
.smexpert-product-summary-right {
margin-top: 20px;
}
}
.bb-footer .footer-socials a {
color: #FFF;
border: solid 1px #FFF;
padding: .5rem;
background-color: transparent;
}
.bb-footer .footer-socials a:hover {
color: #EEE;
}
.smexpert-course-item-top {
height: 320px;
}
.smexpert-course-item-top a:hover img {
opacity: 1;
}
.smexpert-course-item-top img {
width: 65%;
height: auto;
position: absolute;
top: 10%;
left: 2%;
opacity: 1;
}
.smexpert-course-item .smexpert-course-item-top {
background-color: #627C7B;
}
.smexpert-course-item-top .ld-status {
top: 2rem;
background-color: #FFF;
padding: .75rem 1.5rem .75rem 4.5rem;
color: #627C7B;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
text-transform: inherit;
font-size: 1em;
font-weight: bold;
background-size: 43px;
background-repeat: no-repeat;
background-position: .8rem center;
}
.smexpert-course-item-top .ld-status.ld-status-progress {
background-image: url('../images/course-in-progress-icon.png');
}
.smexpert-course-item-top .ld-status.ld-status-not-started {
background-image: url('../images/course-not-started-icon.png');
}
.smexpert-course-item-top .ld-status.ld-status-complete {
background-image: url('../images/course-complete-icon.png');
background-size: 25px;
background-position: 1.1rem center;
}
.smexpert-course-item-bottom, .smexpert-course-item-top .ld-status {
background-color: #4B5C63;
color: #FFF;
}
.smexpert-course-item-bottom-left {
width: 50%;
box-sizing: border-box;
padding-left: 1rem;
}
.smexpert-course-item-bottom-right {
box-sizing: border-box;
padding-right: 1rem;
}
.smexpert-course-item-bottom-left a.button {
width: auto;
padding: 1rem 4rem 1rem 1rem;
background-image: url("../images/button-arrow.png");
background-repeat: no-repeat;
background-position: 90% center;
background-size: 35px auto;
}
.smexpert-course-item-bottom-left h3 {
font-weight: bold;
color: #4b5c63;
font-size: 1.5em;
margin-bottom: 1rem;
}
.smexpert-course-item-top h2 {
border-bottom: 4px solid;
padding-bottom: .75rem;
border-image: linear-gradient(to right, #e8d65c 12%, transparent 12%) 100% 4;
}
.ld-progress-bar {
height: 12px;
background: transparent;
border: solid 2px #FFF;
border-radius: 5px;
}
.ld-progress-bar .ld-progress-bar-percentage.ld-secondary-background {
background: #e0607e!important;
height: 9px;
}
.sfwd-course-expire i {
font-size: 1.2em;
color: #e0607e;
}
.bb-ld-sticky-sidebar .sfwd-course-expire {
font-size: 1.1em;
margin-top: 1rem;
}
.smexpert-course-item-bottom-right .course-lesson-count {
color: #FFF;
font-weight: 600;
}
.smexpert-course-item-bottom-right .ld-progress-stats {
color: #FFF;
}
.smexpert-course-item-bottom-right .ld-progress-stats .course-completion-rate {
font-weight: 600;
}
.smexpert-course-item, .widget {
border: none!important;
box-shadow: 1px 1px 3px rgba(0,0,0,.25);
}
section.course-index-section {
padding: 3rem 0;
}
.bg-lightgrey {
background-color: #EEEDEF;
}
.smexpert-course-item.smexpert-short-course-item .smexpert-course-item-bottom-left {
width: 100%;
}
.smexpert-short-courses .smexpert-course-item-top {
height: 245px;
}
.smexpert-short-course-item .smexpert-course-item-bottom-left .button, .ld-course-navigation .button, .sales-page-apply .button, .sales-page-callout-contents.sales-page-future-dates button, .page-template-salespage-on-demand header .button {
background-color: #627C7B;
border-color: #627C7B;
font-weight: bold;
}
.smexpert-short-course-item .smexpert-course-item-bottom-left .button:hover, .ld-course-navigation .button:hover, .sales-page-apply .button:hover, .sales-page-callout-contents.sales-page-future-dates button:hover, .page-template-salespage-on-demand header .button:hover {
background-color: #4b5c63;
border-color: #4b5c63;
}
#course-index-section-resources-container {
background-color: #627c7b;
color: #FFF;
}
#course-index-section-resources-container h2.course-index-section-title {
color: #FFF;
border-bottom: 4px solid;
padding-bottom: .75rem;
border-image: linear-gradient(to right, #e8d65c 45%, transparent 45%) 100% 4;
}
.resource-details {
position: absolute;
bottom: 0;
width: 100%;
text-align: center;
padding-bottom: 2rem;
background-color: #4b5c63;
padding-top: 1rem;
min-height: 170px;
}
.smexpert-course-item.smexpert-resource-item .smexpert-course-item-top {
background-color: #4B5C63;
}
.smexpert-course-item.smexpert-resource-item:hover .smexpert-course-item-top {
background-color: #3b484e;
}
.smexpert-course-item.smexpert-resource-item .smexpert-course-item-top img {
max-width: inherit;
top: 0;
left: 0;
width: 100%;
height: auto;
}
.smexpert-course-item.smexpert-resource-item .smexpert-course-item-top {
height: 190px;
}
.smexpert-course-item.smexpert-resource-item .smexpert-course-item-top h3 {
color: #FFF;
}
.smexpert-course-item.smexpert-resource-item .smexpert-course-item-top .button {
background-color: #FFF;
color: #627C7B;
border: none;
}
.smexpert-course-item.smexpert-resource-item .smexpert-course-item-top .button:hover {
background-color: #EEE;
}
.smexpert-resources a.smexpert-course-item {
display: block;
background-color: #FFF5E9;
color: #4B5C63;
}
.smexpert-resources a.smexpert-course-item h2 {
color: #4B5C63;
}
.smexpert-resources a.smexpert-course-item:hover {
background-color: #eaddd1;
}
.smexpert-resources .nhs-resource a.smexpert-course-item {
display: block;
background-color: #4B5C63;
color: #e8d65c;
}
.smexpert-resources a.smexpert-course-item .smexpert-course-item-bottom {
background-color: transparent;
}
.smexpert-resources .nhs-resource a.smexpert-course-item:hover {
background-color: #3b484e;
}
.smexpert-resources .nhs-resource a.smexpert-course-item h2 {
color: #e8d65c;
}
.smexpert-course-item.smexpert-resource-item .smexpert-course-item-bottom h2 {
margin-bottom: 0.5rem;
}
.smexpert-resource-excerpt {
font-size: 0.9em;
padding: 0 1rem 1rem;
line-height: 1.4;
color: #3b484e;
}
.nhs-resource .smexpert-resource-excerpt {
font-size: 0.9em;
padding: 0 1rem 1rem;
line-height: 1.4;
color: #FFF;
}
.smexpert-resource-excerpt p {
margin-bottom: 0;
}
#course-index-section-templates-container {
background-color: #4A5C6E;
color: #FFF;
}
#course-index-section-templates-container h2.course-index-section-title {
color: #FFF;
border-bottom: 4px solid;
padding-bottom: .75rem;
border-image: linear-gradient(to right, #e0607e 45%, transparent 45%) 100% 4;
}
.smexpert-course-item.smexpert-template-item {
position: relative;
padding-bottom: 4rem;
display: block;
overflow: hidden;
background-color: #627C7B;
}
.smexpert-course-item.smexpert-template-item:hover {
background-color: #506564;
}
.smexpert-course-item.smexpert-template-item .smexpert-course-item-top {
background-color: transparent;
height: 250px;
}
.smexpert-course-item.smexpert-template-item .smexpert-course-item-bottom {
position: absolute;
bottom: 1rem;
left: 5%;
width: 90%;
background-color: #e8d65c;
}
.smexpert-course-item.smexpert-template-item .smexpert-course-item-bottom h2 {
margin-bottom: 0;
}
.smexpert-course-item.smexpert-template-item .smexpert-course-item-top img {
width: auto;
height: 60%;
position: absolute;
top: 40%;
left: 50%;
opacity: 1;
transform: translate(-50%,-50%);
}
.bb-template-v2 .widget {
border-radius: 0;
}
.widget.smexpert-my-groups-widget {
background-color: #4b5c63;
color: #FFF;
margin-top: 2.05rem;
}
.smexpert-groups-items, .smexpert-notifications-items, .smexpert-cohort-items {
border-left: none;
padding: 0;
}
#main .widget.smexpert-my-groups-widget h2, #main .widget.smexpert-my-groups-widget a {
color: #FFF;
}
.widget.smexpert-my-groups-widget a:hover {
color: #EEE;
}
#main .widget.smexpert-my-groups-widget .round {
border-radius: 0;
}
.widget.lined-title .widget-title {
width: 100%;
position: relative;
}
.widget.lined-title .widget-title:after {
content: "";
border: solid 2px #627C7B;
display: block;
width: 100%;
margin-top: -1.2rem;
height: 2px;
}
.widget.lined-title .widget-title img {
float: right;
padding-left: 1rem;
margin-right: 0;
margin-top: 0.25rem;
}
.widget.lined-title .widget-title .widget-title-text {
padding-right: 1rem;
}
#main .widget.smexpert-my-groups-widget .widget-title img, .widget.smexpert-my-groups-widget .widget-title .widget-title-text, .widget.smexpert-cohort-participants-widget .widget-title .widget-title-text {
background-color: #4b5c63;
}
#main .widget.smexpert-my-notifications-widget .widget-title img, .widget.smexpert-my-notifications-widget .widget-title .widget-title-text, #main .widget.smexpert-cohort-participants-widget .widget-title img, .widget.smexpert-cohort-participants-widget .widget-title .widget-title-text {
background-color: #FFF;
}
.bb-ld-sticky-sidebar .bb-course-preview-wrap img {
min-height: inherit;
min-width: inherit;
width: 90%;
height: auto;
}
.bb-single-course-sidebar .bb-button-wrap .learndash_join_button {
margin-top: -3rem;
z-index: 10;
position: relative;
}
.bb-ld-sticky-sidebar, .bb-course-preview-wrap {
border-radius: 0!important;
}
.bb-ld-sticky-sidebar .thumbnail-container {
background-color: #627C7B
}
.bb-single-course-sidebar .thumbnail-container {
padding-bottom: 72.5%;
}
.bb-single-course-sidebar .bb-button-wrap .learndash_join_button .button.full, .button#smexpert-course-sidebar-back-to-course {
background-color: #e0607e;
color: #FFF;
border: none;
border-bottom: none!important;
font-size: 1.5em;
padding: 1rem;
background-image: url("../images/button-arrow-white.png");
background-repeat: no-repeat;
background-position: 90% center;
background-size: 35px auto;
}
.bb-single-course-sidebar .bb-button-wrap .learndash_join_button .button.full:hover, .button#smexpert-course-sidebar-back-to-course:hover {
background-color: #c65671;
color: #FFF;
}
.button#smexpert-course-sidebar-back-to-course {
background-image: url("../images/button-arrow-white-left.png");
background-position: 10% center;
}
.learndash-wrapper a.button.secondary:not(.outline), .learndash-wrapper a.button.secondary:not(.outline):hover {
border-bottom: inherit!important;
}
.bb-single-course-sidebar .widget {
background-color: #FFF;
}
.bb-single-course-sidebar .widget.smexpert-cohort-participants-widget {
background-color: #FFF;
}
.lms-lessions-list .lms-lesson-item.current,.lms-lesson-item:not(.lms-lesson-turnover) {
background-color: #FFF;
}
.lms-lessions-list .lms-lesson-item .bb-lesson-head {
background-color: #4B5C63;
color: #FFF!important;
}
.lms-lessions-list .lms-lesson-item.current .bb-lesson-head {
background-color: #627C7B
}
.lms-lessions-list .lms-lesson-item .bb-lesson-head .bb-lesson-topics-count {
display: none;
}
#learndash-course-header .ld-breadcrumbs {
font-size: 1.1em;
font-weight: normal!important;
}
.learndash-wrapper .ld-breadcrumbs .ld-breadcrumbs-segments a {
color: #4B5C63!important;
font-weight: normal!important;
}
.learndash-wrapper .ld-breadcrumbs .ld-breadcrumbs-segments li:last-child a {
font-weight: bold!important;
}
.learndash-wrapper .button.smexpert-sidebar-course-action-button {
border: none!important;;
border-bottom: none!important;
font-size: 1.5em;
padding: 1rem;
}
.learndash-wrapper .button#smexpert-additional-course-actions-my-certificate {
background-color: #4A5C6E;
color: #FFF;
}
.learndash-wrapper .button#smexpert-additional-course-actions-my-certificate:hover {
background-color: #3d4c5a;
}
#learndash-content .widget.smexpert-cohort-participants-widget {
box-shadow: none;
}
.course-progress-wrap h4 {
font-family: "Shadows Into Light Two", sans-serif;
}
#sidebar-client-dashboard, #sidebar-manage-groups {
padding: 0;
border: none;
overflow: hidden;
background-color: #e0607e;
font-size: 1.5em;
margin-bottom: 1rem;
}
#sidebar-client-dashboard:hover, #sidebar-manage-groups:hover {
background-color: #c65671;
}
#sidebar-client-dashboard .icon-container, #sidebar-manage-groups .icon-container {
padding: .75rem .75rem 0.75rem 1.25rem;
background-color: #4B5C63;
}
#sidebar-client-dashboard:hover .icon-container, #sidebar-manage-groups:hover .icon-container {
background-color: #415057;
}
#sidebar-client-dashboard img, #sidebar-manage-groups img {
height: 2.5rem;
margin-right: 0;
}
.learndash-wrapper .ld-item-list.ld-lesson-list .ld-item-list-actions {
display: none;
}
.learndash-wrapper .ld-item-list.ld-lesson-list .ld-section-heading h2 {
font-size: 2em!important;
border-bottom: 4px solid;
padding-bottom: .75rem;
border-image: linear-gradient(to right, #e0607e 25%, transparent 25%) 100% 4;
margin-bottom: 1.5rem;
}
.ld-item-list-item-preview .ld-item-component {
display: none;
}
.learndash-wrapper .ld-status-icon.ld-status-complete.ld-secondary-background {
background-color: #60E071!important;
}
.learndash-wrapper .bb-learndash-content-wrap .ld-item-list .ld-item-list-item .ld-item-list-item-preview:hover a.ld-item-name .ld-item-title {
color: inherit!important;
}
.ld-item-list-item-expanded {
background-color: #FFF;
}
.learndash-wrapper .ld-item-list.ld-lesson-list .ld-topic-list .ld-table-list-header {
display: none;
}
#mhs-promo-panel {
background-color: #4A5C6E;
color: #FFF;
border-radius: 1.5rem;
margin-top: 1rem;
}
.no-courses-message {
background-color: #4A5C6E;
color: #FFF;
border-radius: 1.5rem;
padding: 2rem 2rem 1rem;
max-width: 1000px;
margin: auto;
}
.no-courses-message a {
color: #FFF;
font-weight: bold;
}
.no-courses-message h2 {
color: #FFF;
}
.no-courses-message a:hover {
color: #e8d65c;
}
#mhs-promo-panel .mhs-promo-panel-inner {
padding: 1.5rem 1.5rem .5rem;
}
#mhs-promo-panel .mhs-promo-panel-inner h2 {
color: #FFF;
font-size: 2em;
border-bottom: 4px solid;
padding-bottom: .75rem;
border-image: linear-gradient(to right, #e0607e 12%, transparent 12%) 100% 4;
}
#sales-page-contactform-intro .sales-page-callout {
background-color: #FFF;
border-color: #e0607e;
border-radius: 1rem;
}
.smexpert-notifications-shortcode-item-container img, .smexpert-groups-item img {
width: 42px;
}
.bb-course-banner-inner .smexpert-course-header-type {
color: #e8d65c;
font-size: 1.1em;
font-weight: bold;
}
.bb-single-course-sidebar {
padding-top: 2.9rem;
}
.smexpert-tab-content {
border: solid 2px #627C7B;
border-radius: 0;
background-color: #FFF;
}
section.sales-page-section.padded .container, footer.sales-page-section.padded .container {
padding-top: 0;
padding-bottom: 0;
}
ul#smexpert-tabs-nav li {
border-radius: 0;
clip-path: polygon(0 0, 80% 0%, 100% 100%, 0% 100%);
padding: 0.75rem 4rem 1.75rem 3rem;
margin-right: -3rem;
background: rgb(15,5,27);
background: linear-gradient(56deg, rgba(15,5,27,1) 0%, rgba(65,24,116,1) 36%, rgba(65,24,116,1) 100%);
border: none;
}
ul#smexpert-tabs-nav li.active {
background: #627C7B;
}
.bb-single-course-sidebar .bb-course-volume-list {
padding: 0;
}
.learndash-wrapper .ld-item-list .ld-item-list-item .ld-item-list-item-preview {
background: #4b5c63;
border-radius: 0;
}
.learndash-wrapper .ld-item-list .ld-item-list-item.ld-expanded .ld-item-list-item-preview {
background: #627C7B;
}
.learndash-wrapper .ld-item-list .ld-item-list-item .ld-item-list-item-preview:hover a.ld-item-name .ld-item-title, .learndash-wrapper .ld-item-list .ld-item-list-item a.ld-item-name, .learndash-wrapper .ld-item-list-item.ld-item-lesson-item .ld-item-list-item-preview .ld-icon-arrow-down, .learndash-wrapper .ld-item-list-item.ld-item-lesson-item .ld-item-name .ld-item-title .ld-item-components span {
color: #FFF;
}
.learndash-wrapper .ld-status-icon.ld-status-complete {
background-color: #39B54A;
}
.learndash-wrapper .ld-lesson-list.ld-item-list .ld-item-list-item .ld-table-list {
margin: 2rem;
}
.learndash-wrapper .ld-expand-button.ld-expanded .ld-icon {
transform: rotate(90deg) !important;
}
.learndash-wrapper .ld-lesson-list.ld-item-list .ld-item-list-item .ld-table-list {
border-left: solid 2px #4A5C6E;
}
.learndash-wrapper .ld-table-list .ld-table-list-header .ld-table-list-lesson-details {
color: #000;
}
.learndash-wrapper .ld-item-list .ld-section-heading .ld-expand-button, .learndash-wrapper .ld-item-list .ld-section-heading .ld-expand-button:hover {
background-color: transparent;
color: #000;
border: none;
font-size: .9em;
}
.learndash-wrapper .ld-item-list .ld-section-heading .ld-expand-button .ld-icon {
order: 1 !important;
color: #000 !important;
}
.lms-topic-sidebar-course-navigation .ld-course-navigation {
border-radius: 0;
}
.learndash-theme.single-sfwd-courses .ld-progress.ld-progress-inline .ld-progress-bar, .single-item.groups.courses .ld-progress.ld-progress-inline .ld-progress-bar, .learndash-wrapper .ld-progress .ld-progress-bar {
height: 10px;
}
.learndash-theme.single-sfwd-courses .ld-progress .ld-progress-bar .ld-progress-bar-percentage, .single-item.groups.courses .ld-progress .ld-progress-bar .ld-progress-bar-percentage, .learndash-wrapper .ld-progress .ld-progress-bar .ld-progress-bar-percentage {
height: 8px;
background-color: #39B54A;
}
.lms-topic-sidebar-course-navigation .ld-course-navigation {
background-color: transparent;
margin: 0;
}
.lms-topic-sidebar-progress .course-progress-wrap {
margin: 0;
}
.lms-topic-sidebar-progress .course-completion-rate {
margin-top: 0;
}
.lms-topic-sidebar-wrapper .lms-topic-sidebar-data {
padding-top: 0;
}
.lms-topic-sidebar-course-navigation-image {
background-color: #627C7B;
padding: 4rem 2rem;
}
.learndash-wrapper .bb-ld-info-bar .ld-breadcrumbs .ld-breadcrumbs-segments span::after {
font-weight: 300;
}
.learndash-wrapper .ld-status {
border-radius: 0;
background-color: #627c7b!important;
}
body .learndash-wrapper .ld-alert-warning {
color: #000!important
}
.learndash-wrapper .bb-ld-status .ld-status.ld-status-progress {
padding: 0 1rem;
}
#learndash-page-content .sfwd-course-nav .learndash_next_prev_link a {
background-color: #707070;
}
#learndash-page-content .sfwd-course-nav .learndash_next_prev_link a.next-link {
background-color: #E0607E;
border-top-right-radius: 1.5rem;
border-bottom-right-radius: 1.5rem;
}
#learndash-page-content .sfwd-course-nav .learndash_next_prev_link a.next-link:hover {
background-color: #c65671!important;
}
#learndash-page-content .sfwd-course-nav .learndash_next_prev_link a.prev-link, #learndash-page-content .sfwd-course-nav .prev-link.empty-post {
border-top-left-radius: 1.5rem;
border-bottom-left-radius: 1.5rem;
}
.learndash-footer-nav.bb-lms-header {
border-top: solid 2px #E0607E;
padding-top: 1.5rem;
}
#learndash-page-content .sfwd-course-nav .learndash_next_prev_link a:hover {
background-color: #4b5c63!important;
}
.learndash_next_prev_link a.prev-link::before {
content: "\e85f";
}
.learndash_next_prev_link a.next-link::after {
content: "\e860";
}
#learndash-page-content .sfwd-course-nav .learndash_next_prev_link a.prev-link, #learndash-page-content .sfwd-course-nav .learndash_next_prev_link span.empty-post, #learndash-page-content .sfwd-course-nav .learndash_next_prev_link a.next-link {
padding: 0.3rem 2rem;
}
.learndash-wrapper .bb-ld-info-bar .ld-breadcrumbs {
border-bottom: 2px solid #e0607e;
}
.learndash-wrapper .bb-ld-status .ld-status.ld-status-complete {
background-color: #E8D65C!important;
color: #4B5C63!important;
font-family: "Shadows Into Light Two", cursive;
}
.smexpert-content-style {
background-color: #F4F4F4;
}
.smexpert-content-style-icon .smexpert-content-style-icon-container {
background-color: #4b5c63;
}
.comment-respond {
background: #F4F4F4;
border-radius: 0;
border: solid 2px #627C7B;
}
input, select, textarea {
border-radius: 0;
}
.learndash-wrapper .learndash-footer-nav .button.smexpert-popup-button {
background-color: #4A5C6E!important;
border: none!important;
color: #FFF!important;
border-bottom: none!important;
font-size: 1.5em;
padding: .75rem 4rem .75rem 1rem;
background-image: url("../images/notebook-white-small.png");
background-repeat: no-repeat;
background-position: 90% center;
background-size: 35px auto;
}
.learndash-wrapper .learndash-footer-nav .button.smexpert-popup-button:hover {
background-color: #3c4c59 !important;
}
.learndash-footer-nav .button.smexpert-popup-button img {
display: none;
}
li.comment .comment-body .comment-content-wrap {
background-color: #F4F4F4;
}
li.comment .comment-body .comment-content-wrap::after {
box-shadow: none;
border-color: transparent transparent #F4F4F4 #F4F4F4;
}
.comment-list {
padding: 2rem;
border: solid 2px #EEE;
}
.comment-footer {
color: #000;
}
.comment-footer a:not(.bb-bookmark) {
color: #627C7B;
}
.comment-footer a:not(.bb-bookmark):hover {
color: #4b5c63;
}
section.sales-page-section {
border-bottom: none;
}
.sales-page-apply {
background-color: #FFF;
padding: 2rem;
border-bottom-left-radius: 35px;
border-top-right-radius: 35px;
}
#sales-page-usps .sales-page-icon-box {
padding: 0;
background-color: #FFF;
color: #000;
margin: 0 .5rem;
}
#sales-page-usps .sales-page-icon-box .sales-page-usp-header {
background-color: #e0607e;
color: #FFF;
padding-top: 2rem;
padding-bottom: .5rem;
}
#sales-page-usps .sales-page-icon-box .sales-page-usp-details {
padding: 2rem;
}
#sales-page-usps .sales-page-icon-box .sales-page-icon-container {
height: 180px;
width: auto;
}
#author-images {
box-shadow: -2rem 2rem 0 #e0607e;
}
.enrolment-option-description .enrolment-option-button-container {
padding-top: 0;
margin-top: -1rem;
}
#sales-page-usps .sales-page-icon-box h3 {
color: #FFF;
}
.gh-form-wrapper .gh-form-fields .gh-input[type='text'], .gh-form-wrapper .gh-form-fields .gh-input[type='email'], .gh-form-wrapper .gh-form-fields textarea.gh-input, .gh-form-wrapper .gh-form-fields select.gh-input {
padding: .5rem;
}
#sales-page-usps .site-content-grid {
padding-top: 1rem;
padding-bottom: 2rem;
}
#sales-page-usps .below-usps {
margin-bottom: 2rem;
margin-top: 2rem;
}
.sales-page-apply h3 {
font-size: 2em;
font-weight: bold;
color: #4b5c63;
}
.sales-page-section#sales-page-overview .sales-page-callout {
border: none;
}
.sales-page-apply .button-price {
color: #4b5c63;
font-size: 1.5em;
}
.sales-page-callout.sales-page-booking-box .medium-title {
font-weight: bold;
font-size: 1.5em
}
.sales-page-callout.sales-page-booking-box .bb-icon-star {
-webkit-text-stroke: 2px #FFF; /* width and color */
text-stroke: 2px #FFF;
}
.sales-page-callout.sales-page-booking-box .button {
background-color: #FFF;
color: #4b5c63;
border-color: #FFF;
font-weight: 600;
}
.sales-page-callout.sales-page-booking-box .button:hover {
background-color: #333;
color: #FFF;
border-color: #333;
}
.sales-page-callout-contents.sales-page-future-dates {
background-color: #F4F4F4;
}
.sales-page-callout-contents.sales-page-future-dates strong {
color: #4b5c63;
}
.sales-page-callout-contents.sales-page-future-dates input {
border: solid 2px #627C7B;
}
.sales-page-callout-contents.sales-page-future-dates button {
margin-top: 1rem!important;
}
.sales-page-callout-contents.sales-page-your-team {
background-color: #4b5c63;
color: #FFF;
}
.sales-page-callout-contents.sales-page-your-team a:hover {
text-decoration: none;
}
.sales-page-callout-contents.sales-page-your-team a {
color: #FFF;
text-decoration: underline;
}
.sales-page-callout-contents.sales-page-your-team p {
margin-bottom: 0;
}
p.big-title, h2.big-title {
font-size: 3em;
line-height: 1.2em;
font-weight: bold;
}
p.small-title, h2.small-title {
font-size: 1.2em;
margin-bottom: 1rem;
}
#sales-page-who.sales-page-section {
background-color: #eeeef0;
}
#sales-page-who .sales-page-callout {
background-color: #FFF;
}
#sales-page-who .big-title {
color: #627C7B;
}
#sales-page-who .big-title {
color: #627C7B;
}
#sales-page-who h3 {
color: #4b5c63;
font-size: 1.75em;
font-weight: bold;
}
.purple-heading-container {
background-color: #627C7B;
padding: 4rem 0;
}
.purple-heading-container h2 {
color: #FFF!important;
max-width: 800px;
margin: auto;
}
.sales-page-section#sales-page-how .sales-page-callout {
border: none;
}
.single-product .ldgr_group_courses, .single-product .product_meta {
display: none;
}
.single-product .single_add_to_cart_button {
margin-top: 1rem!important;
font-size: 1.25em!important;
height: 48px!important;
}
.woocommerce section.woocommerce-customer-details .woocommerce-customer-details--billwrap .woocommerce-customer-details--maincolumn {
min-width: 50%;
}
.woocommerce-breadcrumb {
font-weight: 600;
}
.woocommerce-breadcrumb a {
font-weight: normal;
}
.woocommerce-cart .woocommerce {
border-radius: 1rem!important;
}
.woocommerce-cart .shop_table_responsive th {
font-weight: 600!important
}
.single-product .quantity {
margin-top: 1rem!important;
}
.single-product .bs-quantity .qty-nav {
height: 46px;
}
.single-product form.cart div.ldgr_group_name {
clear: both;
}
.ldgr_group_name_switch strong {
vertical-align: middle;
}
.mhs-tooltip {
display: inline-block;
margin-left: 5px;
cursor: help;
color: #4b5c63;
vertical-align: middle;
font-size: 16px;
}
#smexpert-thanks-details .ldgr-goto-dashboard-div {
display: none;
}
.ldgr-cal {
background-color: #FFF5E9!important;
box-shadow: none;
border-top: solid 4px #e0607e;
}
.usp-item-content {
background-color: #F4F4F4;
padding: 2rem;
}
.usp-item-content h3 {
color: #4b5c63;
font-size: 2em;
}
.bb-grid.usp-item {
margin: 4rem 0;
padding: 0;
}
.sales-page-section#sales-page-testimonials, .sales-page-section#sales-page-programme {
background-color: #4b5c63;
color: #FFF;
}
.sales-page-section#sales-page-testimonials .big-title, .sales-page-section#sales-page-programme .big-title {
color: #FFF;
}
.sales-page-section#sales-page-testimonials .sales-page-quote {
border: none;
}
.sales-page-section#sales-page-testimonials .sales-page-quote blockquote {
color: #FFF;
font-style: normal;
font-weight: 600;
font-size: 1.4em;
line-height: inherit;
}
.sales-page-quote cite .salespage-quote-author {
font-size: 1em;
line-height: 1.2em;
font-style: normal;
}
.sales-page-quote .sales-page-author-container img {
border-radius: 50%;
border: solid 2px #FFF;
}
.sales-page-quote:before {
content: "";
background-image: url('../images/open-quotes.png');
width: 80px;
height: 80px;
display: block;
margin-bottom: 1rem;
background-size: contain;
background-repeat: no-repeat;
}
.sales-page-icon-container {
background-color: transparent;
}
.sales-page-icon-container img {
width: 100%;
}
.sales-page-section#sales-page-usps h3 {
font-size: 1.5em
}
#sales-page-programme .sales-page-callout {
border: none;
}
#sales-page-programme .programme-highlight {
background-color: #FFF;
}
#sales-page-programme .programme-highlight .bb-icon-f {
color: #4b5c63;
font-size: 1.25em;
}
#sales-page-programme .programme-highlight {
background-color: #FFF;
}
#sales-page-programme .programme-highlight .bb-icon-f {
color: #4b5c63;
font-size: 1.25em;
}
#sales-page-programme .programme-time {
background-color: #4b5c63;
color: #FFF;
}
#sales-page-programme .programme-time .bb-icon-f {
color: #FFF;
font-size: 1.25em;
}
.sales-page-accordion {
background-color: #4b5c63;
color: #FFF;
}
.sales-page-accordion:hover, .sales-page-accordion.active {
background-color: #627C7B;
}
.sales-page-accordion::after {
color: #FFF;
}
.sales-page-section#sales-page-book .sales-page-callout {
border: none;
}
body.my-messages, body.notifications, body.my-profile, body.my-account, body.page-template-page-fullwidth {
background-color: #F4F4F4;
}
.bb-template-v2 #message-threads .bp-message-link, .notification-list.list-view li.bs-item-wrap:last-child, .bs-item-list.list-view li.bs-item-wrap:first-child {
border-radius: 0;
}
.bb-template-v2 #message-threads .current > a, .bs-item-list.list-view li.bs-item-wrap:first-child {
background: #4b5c63;
}
.bb-template-v2 #message-threads .current > a:hover {
background: #333;
}
.bb-template-v2 #message-threads .current > a .thread-to, .bb-template-v2 #message-threads .current > a .thread-subject, .bs-item-list.list-view li.bs-item-wrap:first-child .bb-sort-by-date {
color: #FFF;
}
.bb-template-v2 #cover-image-container, .bp-profile-wrapper.need-separator .group-separator-block, .bb-template-v2 #buddypress .bb-bp-settings-content, .bs-item-list.list-view .bs-item-wrap, .messages-wrapper {
border-radius: 0;
border: none;
box-shadow: 1px 1px 3px rgba(0,0,0,.25);
}
.bb-template-v2 .buddypress-wrap .bp-settings-container .bp-navs a {
border-radius: 0;
}
#main.course-index-main {
position: relative;
}
.course-index-widgets {
position: absolute;
top: 4.9rem;
right: 0;
width: 100%;
left: 0;
z-index: 0;
}
section.course-index-section .container .course-index-section-courses {
position: relative;
z-index: 1
}
#sales-page-intro .beacon-programme-application {
background-color: rgba(0,0,0,.25);
padding: 3rem;
}
#sales-page-intro .mhs-intro-photograph {
padding-top: 2rem
}
#sales-page-intro2 h2.big-title {
font-size: 1.8em
}
#sales-page-intro .beacon-programme-application .gh-form-wrapper > .gh-success, #sales-page-intro .beacon-programme-application .gh-form-wrapper > .gh-errors, .waitinglist .gh-form-wrapper > .gh-success, .waitinglist .gh-form-wrapper > .gh-errors {
background: #4b5c63;
color: #FFF;
}
#sales-page-intro .mhs-intro-photograph {
background-color: #627c7b;
color: #FFF;
}
.woocommerce .woocommerce-error, .woocommerce .woocommerce-info, .woocommerce .woocommerce-message {
background-color: #4b5c63!important;
border: none!important;
color: #FFF;
}
#sales-page-intro2 {
background: #4b5c63;
color: #FFF;
}
#sales-page-intro2 h2 {
color: #FFF;
}
body.woocommerce-cart .button {
font-size: 1.25em!important;
}
.woocommerce .wc-proceed-to-checkout a.button.checkout-button {
height: 48px!important;
}
.bb-wc-col #customer_details, .bb-wc-col .bb-order-review {
border-radius: 1rem!important;
}
.waitinglist h3 {
margin-bottom: .5rem;
}
.smexpert-webinar-page h4 {
color: #FFF;
}
.woocommerce-cart .woocommerce {
border-radius: 1rem!important;
}
.smexpert-webinar-page .sales-page-overview-quote {
background-color: #F4F4F4;
box-shadow: 4px 4px 4px rgba(0,0,0,.5);
}
.smexpert-webinar-page .sales-page-section#sales-page-intro .sales-page-overview-quote h2 {
color: #627C7B;
}
.smexpert-webinar-page .sales-page-section#sales-page-intro .sales-page-overview-quote form label {
color: #000;
}
.smexpert-webinar-date {
background-color: #627C7B;
}
.sales-page-book-box ul.ticks li:before {
color: #627C7B;
font-weight: 300;
}
.sales-page-book-box ul.ticks li {
margin-bottom: 0.5rem;
}
#sales-page-book ul.ticks {
display: flex;
flex-wrap: wrap;
list-style-type: none;
padding: 0;
margin: 0;
}
#sales-page-book ul.ticks li {
width: 50%; /* 50% width for two columns */
}
.sales-page-book-box ul.ticks {
margin: 2rem 1rem;
font-size: 0.9em;
}
.sales-page-book-box ul.ticks li:before {
color: #FFF;
}
.smexpert-webinar-page #sales-page-intro .sm-grid-2-3:first-of-type {
padding-right: 4rem;
}
.salespage-under-button a {
color: #FFF;
text-decoration: underline;
}
.salespage-under-button a:hover {
color: #EEE;
}
header.site-header.force-fixed {
border-bottom: solid 1px #EEE;
}
.events-tickets .tribe-tickets__attendee-tickets-item--has-focus {
border-left-color: #4b5c63;
}
body.woocommerce-page, body.page-template-group-dashboard {
background-color: #EEEDEF
}
.woocommerce-checkout .bb-wc-co #customer_details, .woocommerce-checkout .bb-wc-co .bb-order-review, .woocommerce-cart .woocommerce {
border-radius: 0;
border: none;
padding: 2rem;
}
body.page-template-group-dashboard h2:not(.main-title) {
font-size: 1em;
font-family: Sukar, sans-serif!important;
font-weight: 400;
}
.woocommerce-page input[type=text], .woocommerce-page .select2-selection, .woocommerce-page textarea, .woocommerce-page input[type=email], .woocommerce-page input[type=tel] {
border: solid 1px #627C7B!important;
}
#payment div.payment_box a {
color: inherit;
font-weight: bold;
}
.smexpert-content-style.smexpert-content-style-reflection, .smexpert-content-style.smexpert-content-style-courseleader, .smexpert-content-style.smexpert-content-style-notepad {
background-color: #4b5c63;
color: #FFF;
}
.smexpert-content-style.smexpert-content-style-reflection .smexpert-content-style-icon .smexpert-content-style-icon-container, .smexpert-content-style.smexpert-content-style-courseleader .smexpert-content-style-icon .smexpert-content-style-icon-container, .smexpert-content-style.smexpert-content-style-notepad .smexpert-content-style-icon .smexpert-content-style-icon-container {
background-color: #627C7B
}
.smexpert-content-style.smexpert-content-style-notepad .smexpert-reflective-field {
margin-top: -1rem;
}
.smexpert-content-style.smexpert-content-style-notepad .smexpert-reflective-field textarea {
height: 12rem
}
.smexpert-content-style-courseleader .smexpert-content-style-icon-container {
overflow: hidden;
position: relative;
padding: 0
}
.smexpert-content-style.smexpert-content-style-notepad .smexpert-reflective-field {
background-color: transparent;
padding: 0;
margin-bottom: 0;
}
.smexpert-content-style.smexpert-content-style-notepad p:empty {
display: none;
}
.smexpert-content-style-courseleader .smexpert-content-style-content {
position: relative;
padding: .5rem 2rem .5rem 3rem;
}
.smexpert-content-style.smexpert-content-style-courseleader {
padding: 2rem;
}
.smexpert-content-style-courseleader .smexpert-content-style-content::before {
background-image: url("../images/quote-start.png");
background-repeat: no-repeat;
background-size: 2rem;
background-position: center center;
display: block;
content: "";
width: 2rem;
height: 2rem;
top: 0rem;
position: absolute;
left: 0rem;
}
.smexpert-content-style-courseleader .smexpert-content-style-content::after {
background-image: url("../images/quote-end.png");
background-repeat: no-repeat;
background-size: 2rem;
background-position: center center;
display: block;
content: "";
width: 2rem;
height: 2rem;
bottom: 0rem;
position: absolute;
right: 0rem;
}
.woocommerce-order-details .woocommerce-table.order_details_items {
background-color: #627c7b;
color: #FFF;
border-radius: 1rem!important;
}
.woocommerce-checkout .woocommerce-order-over h2.woocommerce-heading--success {
font-size: 2.5em;
margin-bottom: 2rem!important;
}
#smexpert-thanks-details {
padding: 2rem;
background: #FFF;
border: none;
border-radius: 1rem;
}
.smexpert-actions-lesson-opener h2 {
padding-top: 0.25rem;
border: none;
color: #FFF;
}
.smexpert-actions-lesson-opener {
background: #4b5c63;
border-radius: 0;
color: #FFF;
}
.smexpert-actions-lesson.expanded .smexpert-actions-lesson-opener {
background: #627C7B;
}
.smexpert-actions-lesson-opener .smexpert-action-count, .smexpert-actions-lesson-non-opener .smexpert-action-count {
font-size: 0.7em;
}
.smexpert-action-status-selector .bb-icon-check, .smexpert-action-status-selector .bb-icon-spinner {
color: #627C7B;
}
.smexpert-certificate-link .smexpert-cert-icon {
height: 4.5rem;
background-color: transparent;
border: none;
border-radius: 0;
}
.smexpert-certificate-link .smexpert-cert-icon img {
width: 100%;
position: relative;
}
.learndash-wrapper .ld-alert.ld-alert-certificate.ld-alert-success {
color: #333;
background-color: #C2EFC7;
font-size: 1.1em;
}
.learndash-wrapper .ld-alert.ld-alert-certificate.ld-alert-success .ld-button .bb-icon-l {
display: none;
}
.salespage-intro-paragaph-image {
border-radius: 15px;
box-shadow: 5px 5px 5px rgba(0,0,0,.2)
}
#sales-page-intro2 .mhs-intro-photograph {
margin-right: 2rem;
}
.sales-page-usp-items .sales-page-callout {
position: relative;
overflow: hidden;
}
.sales-page-usp-items .sales-page-callout img {
height: 100%;
width: auto;
max-width: inherit;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
#sales-page-intro .big-title {
font-size: 2.9em;
margin-bottom: 1rem;
}
.smexpert-content-style.smexpert-content-style-extras {
background-color: #d8e4e8;
}
.smexpert-content-style.smexpert-content-style-extras .smexpert-content-style-icon-container {
background-color: #487c93;
}
#sales-page-who .sales-page-callout h3 {
background-color: #627C7B;
color: #FFF;
font-size: 1.3em;
padding: 1rem 2.5rem;
margin: -2rem -2rem 1rem;
text-align: center;
}
#sales-page-who .sales-page-callout-contents {
padding-bottom: 0.1rem;
}
.sales-page-panel {
border: solid 1px #DDD;
margin-top: -1rem;
margin-bottom: 1rem;
}
.sales-page-section#sales-page-intro p.small-title {
margin: 0 0 2rem 0;
}
.sales-page-section#sales-page-intro ul.smexpert-custom-icons {
padding: .5rem 0 .1rem;
}
.smexpert-webinar-page .sales-page-section#sales-page-intro {
background: #4b5c63;
}
#sales-page-programme h3 {
color: #627C7B;
}
input.gh-checkbox-input {
width: inherit!important;
}
.page-template-templateswebinar-registration-php .smexpert-webinar-page .sales-page-section#sales-page-intro {
min-height: 85vh
}
.gh-form-wrapper .gh-form-fields textarea.gh-input {
height: 8rem;
}
.page-template-application-form .gh-form .gh-form-column {
margin-bottom: 1.5rem;
}
#sales-page-book .sales-page-callout-contents.sales-page-book-box {
display: flex;
}
#sales-page-book .sales-page-callout-contents.sales-page-book-box .sales-book-left-equalizer {
width: 100%;
}
.smexpert-actions-lesson-actions .smexpert-action:last-of-type {
margin-bottom: 0;
}
.sales-page-overview-right-hand-image-container {
margin-top: 3rem;
}
.learndash-content-body .smexpert-actions-lesson-actions {
background-color: #627C7B;
color: #FFF;
margin: 0
}
.smexpert-content-style .quickfielddisplay {
background-color: #DDD;
color: #000;
}
.page-template-application-form .sales-page-section#sales-page-intro {
min-height: 90vh;
}
ul#smexpert-tabs-nav li:nth-child(1).active {
z-index: 10;
}
ul#smexpert-tabs-nav li:nth-child(2).active {
z-index: 9;
}
ul#smexpert-tabs-nav li:nth-child(3).active {
z-index: 8;
}
ul#smexpert-tabs-nav li:nth-child(4).active {
z-index: 7;
}
body.page-template-pbm-webinar-registration .smexpert-webinar-page .sales-page-section#sales-page-intro {
background-color: #2c0959;
}
.smexpert-content-style.smexpert-reflective-field .button.disabled, button.disabled {
background-color: #000;
color: #333;
opacity: 0.5;
}
.smexpert-content-style.smexpert-reflective-field .reflectai_form .button.disabled {
background-color: #000;
color: inherit;
opacity: inherit;
}
.immerseai-copilot-panel-toggle, .immerseai-copilot-panel {
background-color: #000;
}
.smexpert-content-style.smexpert-content-style-instructionsocial, .smexpert-content-style.smexpert-content-style-guidance {
background-color: #627C7B;
color: #FFF;
}
.smexpert-content-style.smexpert-content-style-instructionsocial a, .smexpert-content-style.smexpert-content-style-guidance a {
color: #EEE;
font-weight: bold;
}
.smexpert-content-style.smexpert-content-style-survey {
background-color: #627c7b;
color: #FFF;
}
.smexpert-content-style.smexpert-content-style-survey label {
color: #FFF;
}
.smexpert-content-style.smexpert-content-style-survey label:has(input:disabled),
.smexpert-content-style.smexpert-content-style-survey label:has(input[readonly]) {
color: rgba(255, 255, 255, 0.4);
}
.survey .callout.formmessage {
display: block;
background-color: #4B5C63;
color: #FFF;
padding: 1rem;
}
.quickcheckbox-multiple {
list-style: none;
margin-top: 1rem;
}
.quickcheckbox-multiple input {
vertical-align: baseline;
margin-right: 1rem;
}
.survey fieldset .small {
color: #a5afb1;
}
.smexpert-content-style.smexpert-content-style-survey .quickscale ul li label {
background: #4B5C63;
}
.smexpert-content-style.smexpert-content-style-survey .quickscale ul li:nth-child(2n) label {
background: #333e43
}
.smexpert-content-style.smexpert-content-style-survey .quickscale input[type="radio"]:checked + label {
background: #e0607e!important;
}
.smexpert-content-style-reflection .ai_reflection_field {
border-bottom: solid 1px #7047a5;
padding-bottom: 2rem;
}
.smexpert-content-style-reflection .ai_reflection_field:last-of-type {
border-bottom: none;
padding-bottom: 0;
}
.ai_reflection_field {
padding: 0;
background: transparent;
}
.ai_reflection_field .ai_reflection_question {
margin-bottom: 1rem
}
.ai_reflection_success_message {
padding: 0.5rem;
background-color: #627C7B;
text-align: center;
margin-bottom: 1rem;
}
.smexpert-content-style.smexpert-reflective-field .ai_reflection_suggest_button {
margin-bottom: 1rem;
}
.smexpert-rate > label {
margin-right: 0.5rem;
}
.smexpert-content-style-rating .smexpert-rate:not(:checked) > label::before {
display: inline-block;
margin-top: 0.5rem;
font-weight: 500!important;
}
.smexpert-content-style-rating .smexpert-rate > input:checked ~ label:before, .smexpert-rate:not(:checked) > label:hover:before {
font-weight: 600!important;
}
.smexpert-content-style-rating .smexpert-rate:checked > label::before {
display: inline-block;
margin-top: 0.5rem;
font-weight: 600!important;
}
.smexpert-content-style-rating {
background-color: #f5eafa;
}
.smexpert-content-style-rating form {
margin-bottom: 0;
}
.smexpert-content-style-rating .smexpert-rate:not(:checked) > label {
color: #2b0b52;
}
.smexpert-rate:not(:checked) > label:hover, .smexpert-rate:not(:checked) > label:hover ~ label {
color: #627C7B;
font-weight: 600!important;
}
.smexpert-rate:not(:checked) > label:hover:before, .smexpert-rate:not(:checked) > label:hover ~ label:before {
font-weight: 600!important;
}
.smexpert-rate > input:checked + label:hover, .smexpert-rate > input:checked + label:hover ~ label, .smexpert-rate > input:checked ~ label:hover, .smexpert-rate > input:checked ~ label:hover ~ label, .smexpert-rate > label:hover ~ input:checked ~ label, .smexpert-rate > input:checked ~ label {
color: #627C7B!important;
}
.smexpert-custom-icons li {
margin-bottom: 1rem;
margin-left: 1rem;
}
.sales-page-book-button .button-text:after {
content: ">";
position: absolute;
right: -1rem;
top: 50%;
font-size: 3rem;
transform: translate(-50%,-50%);
}
.sales-page-book-button .button-text {
position: relative;
}
#sales-page-book .sales-page-callout.sales-page-booking-box .button br {
display: none;
}
.wdm-tabs-wrapper .tab-content, .wdm-tab-content {
background-color: transparent!important;
}
#ldgr-edit-group-popup .ldgr-edit-gicon {
display: none !important;
}
.ldgrs-title-wrap .ldgr-curr-icon,
.ldgrs-title-wrap img {
display: none !important;
}
#wdm_groups_tab .wdm-tabs-inner-links .tabs li {
display: none;
}
.wdm-tabs-wrapper#wdm_groups_tab ul.tabs {
border-bottom: none;
}
#wdm_groups_tab .tab-content {
padding-top: 2rem;
}
#wdm_group_wrapper #wdm_group_filter label::before {
display: none;
}
.wdm-tabs-wrapper#wdm_groups_tab {
margin-top: 5rem;
clear: both;
}
section.padded .ldgr-group-single .ldgr-top-banner {
background-color: #627C7B;
color: #FFF;
}
section.padded .ldgr-group-single .ldgr-top-banner .ldgrs-title-wrap h1, section.padded .ldgr-group-single .ldgr-top-banner .ldgrs-title-wrap .ldgr-u-left {
color: #FFF;
}
section.padded .ldgr-right-button-container .ldgr-edit-groups-css {
color: #FFF!important;
font-weight: bold;
}
.ldgr-popup-content .ldgr-bg-color {
background-color: #e0607e!important;
color: #FFF!important;
}
.ldgr-popup-content .ldgr-bg-color:hover {
background-color: #c3546e!important;
}
section.padded input#bulk_remove {
border-radius: 0;
background-color: #4A5C6E;
color: #FFF;
border: none;
}
section.padded input#bulk_remove:hover {
background-color: #394855;
}
section.padded #wdm_group thead {
background-color: #627C7B!important;
color: #FFF;
}
section.padded #wdm_group th {
color: #FFF;
background-color: #627C7B
}
section.padded table.dataTable thead .sorting, section.padded table.dataTable thead .sorting_asc, section.padded table.dataTable thead .sorting_desc {
background-image: none!important;
}
.ldgr-goto-dashboard-div .ldgr-goto-dashboard-link, .ldgr-btn {
border-radius: 0!important;
font-family: "Shadows Into Light Two";
font-size: 1.25em;
background-color: #e8d65c!important;
color: #4B5C63!important;
border: none!important;
}
.wdm-tabs-inner-links .ldgr-bg-color, section.padded .wdm_remove.button, section.padded .dataTables_wrapper .dataTables_paginate .paginate_button.current, section.padded .dataTables_wrapper .dataTables_paginate .paginate_button.current {
background-color: #e8d65c!important;
border-radius: 0!important;
border: none!important;
color: #4B5C63!important;
}
.wdm-tabs-inner-links .ldgr-goto-dashboard-div .ldgr-goto-dashboard-link:hover, .ldgr-btn:hover,.ldgr-bg-color:hover, section.padded .wdm_remove.button:hover, section.padded .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover, section.padded .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
background-color: #ccbd50!important;
}
.b2bdash-client-dashboard {
padding: 2rem;
background-color: #FFF;
border-radius: 1rem;
overflow: hidden;
}
.b2bdash-client-dashboard.b2b-client-dashboard-index h4, .b2bdash-client-dashboard > h3 {
background-color: #627C7B;
color: #FFF;
padding: 2rem;
margin: -2rem -2rem 2rem;
font-family: Sukar;
font-weight: 600;
font-size: 18px;
}
.b2bdash-client-dashboard form {
margin-top: 0;
float: none;
width: 100%;
}
.ldgr-edit-group {
cursor: pointer;
}
.wdm-tabs-inner-links .ldgr-bg-color.enroll-new-user {
background-color: #e0607e!important;
color: #FFF!important;
font-weight: 400;
}
.wdm-tabs-inner-links .ldgr-bg-color.enroll-new-user:hover {
background-color: #c3546e!important;
}
section.padded .ldgr-right-button-container .ldgr-edit-groups-css:hover {
color: #e8d65c!important;
}
.smexpert-before-user-search {
width: 50%;
float: left;
}
.b2bdash-client-dashboard form button:before {
content: "\ef10";
font-family: "bb-icons";
font-weight: 400;
margin-right: .5rem;
}
.smexpert-group-survey-items h5 {
margin-top: 1.5rem;
margin-bottom: .75rem;
}
.b2b-dashboard-group-action-button {
margin-bottom: 0.5rem;
}
.b2bdash-client-dashboard form label {
display: block;
}
.buddypress-wrap .profile.edit .editfield.field_nickname {
display: none;
}
#content div.product div.summary {
min-width: 100%;
border: none;
border-radius: 1rem !important;
margin-top: 2rem;
}
.single-product form.cart div.ldgr_group_name {
text-align: left;
}
#wdm_enroll_help_btn {
display: none;
}
.cart .wdm_group_registration {
display: none;
}
.single-product form.cart div.ldgr_group_name {
margin: 0!important;
}
.ldgr-group-items.list .ldgr-group-item {
background-color: #4B5C63;
color: #FFF;
border: none;
margin-bottom: 0.5rem!important;
}
.ldgr-group-items.list .ldgr-group-item .ldgr-group-image {
display: none;
}
.ldgr-group-listing .ldgr-group-items.list .ldgr-group-item .gr-title, .ldgr-group-listing .ldgr-group-items.list .ldgr-group-item .gr-left {
color: #FFF;
}
.ldgr-group-listing .ldgr-group-items.list .ldgr-group-item .ldgr-icon-Edit {
display: inherit;
color: #FFF;
}
.ldgr-group-listing .ldgr-group-items.list .ldgr-group-item button {
border: none;
}
.ldgr-group-listing .ldgr-group-items.list .gr-edit {
top: 23px;
}
.ldgr-group-single .ldgr-back-to-groups {
margin-top: 1rem;
}
.b2bdash-client-dashboard .b2bdash-learner {
background-color: #4B5C63;
color: #FFF;
border: none;
}
.ldgr-enroll-user-content .ldgr-tabs {
display: none;
}
.sh_group_discount {
display: none;
padding: 0.5rem;
background-color: #627C7B;
color: #FFF;
margin-bottom: 1rem;
}
.sh_group_discount p {
margin-bottom: 0;
}
body.wp-child-theme-buddyboss-child .learndash-wrapper .ld-progress-stats .ld-progress-percentage.ld-secondary-color {
color: #000!important;
}
.mhs-intro-text img {
height: 2.5rem;
margin-right: .5rem;
}
.enrolment-option-container {
background-color: #FFF;
padding: 1rem;
}
.enrolment-option-container ul.ticks {
margin: -1rem 1rem 2rem;
}
.enrolment-option-container h3 {
border-bottom: solid 2px #4b5363;
padding-bottom: 1rem;
}
.enrolment-option-description,
.enrolment-option-includes,
.enrolment-option-best-for {
border-bottom: solid 1px #eee;
padding: 1rem 0;
}
.enrolment-option-price {
display: flex;
flex-direction: column;
text-align: center;
font-weight: bold;
padding-top: 1rem;
}
.enrolment-option-price p {
margin-bottom: -1rem;
font-size: 1.5em;
color: #4b5363;
}
.enrolment-option-button-container {
padding-top: 1.5rem;
}
.mhs-contact-item {
margin-right: 1rem;
}
.callout.enquire-container {
background-color: #4b5c63;
display: block;
overflow: hidden;
padding: 2rem;
margin-right: 2rem;
color: #FFF;
}
.callout.enquire-container h2, .callout.enquire-container label {
color: #FFF;
}
.single-product .cart .wdm-enroll-me-div, .woocommerce div.product form.cart div.quantity {
display: none!important;
}
body.selection-teams .single-product .cart .wdm-enroll-me-div, body.selection-teams.woocommerce div.product form.cart div.quantity {
display: block!important;
}
.woocommerce-order-details .woocommerce-table--order-details.order_details_items {
display: none;
}
.gh-form-wrapper > .gh-success {
background-color: #627C7B!important;
color: #FFF!important;
}
.gh-form-wrapper > .gh-errors {
background-color: #7c6262 !important;
color: #FFF!important;
}
body .learndash-wrapper .learndash_content_wrap .learndash_mark_complete_button, body .learndash-wrapper:not(.ld-registration__outer-wrapper, body .learndash-wrapper--modern) .learndash_content_wrap .learndash_mark_complete_button {
background-color: #e0607e!important;
color: #FFF;
font-family: "Shadows Into Light Two";
font-size: 1.15em;
border: none;
}
body .learndash-wrapper .learndash_content_wrap .learndash_mark_complete_button:hover, body .learndash-wrapper:not(.ld-registration__outer-wrapper:hover, body .learndash-wrapper--modern) .learndash_content_wrap .learndash_mark_complete_button:hover {
background-color: #c3546e!important;
color: #FFF;
}
a.downloadable-file {
display: block;
background-color: #e0607e;
color: #FFF!important;;
margin-bottom: 1rem;
font-size: 1.4em;
}
a.downloadable-file:hover {
background-color: #c65671;
color: #FFF;
}
a.downloadable-file.summary-download .download-icon {
width: 100%;
margin-top: 0
}
a.downloadable-file img {
width: 100%;
}
a.downloadable-file .downloadable-file-details {
padding: 1rem;
}
a.downloadable-file .row {
margin-left: -1rem;
margin-right: -1rem;
}
a.downloadable-file .row .columns {
padding-left: 1rem;
padding-right: 1rem;
}
a.downloadable-file .downloadable-file-details span {
font-size: 0.8em;
display: block;
}
a.downloadable-file .download-icon {
width: 50%;
margin-top: .25rem;
}
#main.sales-page-v2 #sales-page-who img {
height: 200px;
margin: auto;
display: block;
}
#main.sales-page-v2 section.padded {
padding-top: 2rem;
padding-bottom: 2rem;
}
#main.sales-page-v2 #sales-page-testimonials .container, #sales-page-programme .container {
padding-top: 1rem;
padding-bottom: 1rem;
}
#main.sales-page-v2 .sales-page-quote {
padding: 0;
}
#main.sales-page-v2 .enrolment-option-container h3 {
margin-bottom: 1rem;
padding-bottom: .5rem;
}
#main.sales-page-v2 .enrolment-option-container h4 {
margin-bottom: .75rem;
font-size: 1em;
}
#main.sales-page-v2 .enrolment-option-container p:last-of-type {
margin-bottom: 0;
}
#main.sales-page-v2 .enrolment-option-container ul.ticks li {
margin-bottom: 0.1rem;
}
#main.sales-page-v2 .enrolment-option-description, #main.sales-page-v2 .enrolment-option-includes, #main.sales-page-v2 .enrolment-option-best-for {
padding: 0.5rem 0;
}
#main.sales-page-v2 .enrolment-option-container ul.ticks {
margin: 0 0 1rem;
}
#main.sales-page-v2 p.volume-discounts-title {
margin-bottom: 0;
}
#main.sales-page-v2 p.volume-discounts-quantities {
font-size: .8em;
padding: 0.25rem 1rem 0.1rem;
background-color: #FFF5E9;
margin-top: 2rem;
font-weight: normal;
}
#main.sales-page-v2 ul.ticks {
font-size: 1em;
line-height: 1.2;
}
#main.sales-page-v2 ul.ticks li:before {
font-size: .9em;
}
#main.sales-page-v2 .enrolment-option-description {
padding-top: 0;
}
/* Backgrounds */
#course-index-section-courses-container {
background-image: url("../images/bg-course-index-courses.png");
background-size: cover;
background-repeat: no-repeat;
}
/* Hide CSV Upload option in LearnDash Group Registration */
#ldgr-enroll-users-popup .ldgr-tabs li.ldgr-upload-csv,
#ldgr-enroll-users-popup .ldgr-tabs-content div.ldgr-upload-csv,
.wdm-adduser-tabs li[data-tab="tab-upload-csv"],
#tab-upload-csv.wdm-tab-content {
display: none !important;
}
#course-index-section-resources-container {
background-image: url("../images/bg-course-index-resources.png");
background-size: contain;
background-repeat: no-repeat;
}
#course-index-section-templates-container {
background-image: url("../images/bg-course-index-templates.png");
background-size: cover;
background-repeat: no-repeat;
background-position: bottom;
}
body.sfwd-courses-template-default #content {
background-image: url("../images/bg-course-homepage.png");
background-size: cover;
background-repeat: no-repeat;
}
/* End of Backgrounds */
@media screen and (min-width: 800px) {
.widget-area:not(.widget-area-secondary) {
-ms-flex: 0 0 400px;
flex: 0 0 400px;
max-width: 400px;
}
}
@media screen and (max-width: 1100px) {
.course-index-banner {
padding: 1rem;
}
.course-index-banner .container {
padding: 2rem 0;
}
.course-index-section-courses {
padding: 0 3rem !important;
}
}
@media screen and (max-width: 543px) {
.course-index-banner h1 {
font-size: 2em;
}
.course-index-widgets {
position: relative;
top: 0;
margin-bottom: 2rem;
}
.smexpert-course-item-top {
height: 9rem;
}
.smexpert-short-courses .smexpert-course-item-top {
height: 10rem;
}
ul#smexpert-tabs-nav li {
border-bottom-left-radius: 0 !important;
border-bottom-right-radius: 0 !important;
margin: 0 !important;
clip-path: none !important;
width: 100%;
}
.sales-page-apply {
margin-bottom: 2rem;
text-align: center;
}
.sales-page-apply .button {
margin-top: 1.5rem;
}
p.big-title, h2.big-title {
font-size: 2em;
}
.sales-page-book-box img {
max-width: 50px;
margin-bottom: 1rem;
}
#sales-page-who .sales-page-callout-contents {
margin-top: 0;
}
.sales-page-usp-items .bb-grid-cell {
padding: 0;
}
.bb-grid.usp-item {
margin: 0;
}
.usp-item-content h3 {
font-size: 1.5em;
}
#sales-page-who .sales-page-callout-contents h3, #sales-page-who h3 {
max-width: inherit;
}
.sales-page-quote {
padding: 0;
}
.sales-page-quote::before {
width: auto;
height: 20px;
background-size: 25px;
background-repeat: no-repeat;
}
#sales-page-programme .sales-page-callout-contents {
padding: 0;
}
#sales-page-programme .sales-page-callout {
margin: 0;
}
#sales-page-intro h1 {
font-size: 2em;
}
#sales-page-intro .beacon-programme-application {
padding: 2rem;
}
.sales-page-section#sales-page-intro {
background-size: cover;
}
.smexpert-webinar-page #sales-page-intro .sm-grid-2-3:first-of-type {
padding-right: inherit;
}
.smexpert-webinar-speaker .smexpert-speaker-photo {
max-width: 100px;
margin-bottom: 1rem;
}
.sales-page-usp-items .sales-page-callout img {
width: 100%;
height: auto;
position: relative;
transform: none;
top: 0;
left: 0;
}
.sales-page-section#sales-page-how .sales-page-callout {
height: auto!important;
}
#sales-page-book ul.ticks li {
width: 100%; /* 50% width for two columns */
}
.mhs-intro-photograph {
display: none;
}
.sales-page-how-item-image img {
max-width: 80%;
margin: 0 auto 4rem;
display: block;
}
#testimonial-slider .testimonial-slide, #testimonial-slider .sales-page-quote {
padding: 0!important;
}
.sales-page-quote:before {
height: 30px;
}
#sales-page-usps .sales-page-icon-box {
margin-bottom: 1rem;
}
#author-images {
max-width: 50%;
margin: 0 auto 2rem;
display: block;
}
.enrolment-option-container {
margin-bottom: 2rem;
}
.callout.enquire-container {
margin-right: 0;
margin-bottom: 2rem;
}
footer.sales-page-section.padded .container {
margin: 1rem 1rem 0;
}
}
#testimonial-slider {
max-width: 800px;
margin: auto;
}
/* Testimonial Slider Styles */
#testimonial-slider .testimonial-slide {
padding: 0 15px;
}
#testimonial-slider .sales-page-quote {
height: 100%;
padding: 0 1rem;
}
/* Slick Arrows */
#testimonial-slider .slick-prev,
#testimonial-slider .slick-next {
z-index: 1;
width: 40px;
height: 40px;
font-size: 0;
line-height: 0;
color: transparent;
}
#testimonial-slider .slick-prev {
left: -50px;
}
#testimonial-slider .slick-next {
right: -50px;
left: inherit;
}
#testimonial-slider .slick-prev:before,
#testimonial-slider .slick-next:before {
font-family: "bb-icons";
font-size: 30px;
color: #FFF;
opacity: 1;
font-weight: 400;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
#testimonial-slider .slick-prev:before {
content: "\e85f"; /* Left arrow icon */
}
#testimonial-slider .slick-next:before {
content: "\e860"; /* Right arrow icon */
}
@media screen and (max-width: 1200px) {
#testimonial-slider {
margin-left: 40px;
margin-right: 40px;
}
#testimonial-slider .slick-prev {
left: -40px;
}
#testimonial-slider .slick-next {
right: -40px;
}
}
/* Ensure images don't stretch */
#testimonial-slider .sales-page-quote img {
width: auto;
display: inline-block;
}
/* ==========================
MHS Rating Block (Sales Page)
Moved from inline styles in templates/salespage-b2b.php
========================== */
.mhs-rating-block {
margin-top: 2rem;
padding: 1rem;
text-align: left;
}
.mhs-rating-row {
align-items: center;
gap: 14px;
text-align: center;
}
.mhs-stars-wrap {
position: relative;
display: inline-block;
line-height: 1;
}
.mhs-stars-base,
.mhs-stars-fill {
letter-spacing: 2px;
font-size: 40px;
}
.mhs-stars-base { color: #d9d9d9; }
.mhs-stars-fill {
color: #f5b301;
position: absolute;
left: 0;
top: 0;
white-space: nowrap;
overflow: hidden;
}
.mhs-rating-label { font-size: 16px; color: #FFF; }
.mhs-rating-stats { font-size: 14px; color: #FFF; margin-top: 6px; }
.mhs-rating-stats p { margin: 2px 0; }
@media (max-width: 600px) {
.mhs-rating-row { flex-wrap: wrap; gap: 8px; }
.mhs-rating-label { font-size: 15px; }
.mhs-stars-base, .mhs-stars-fill { font-size: 24px; }
#sales-page-intro2 .mhs-intro-photograph {
margin-right: 0;
}
}
/* Profile Edit Notice Callout */
.mhs-profile-edit-notice {
background-color: #f8f9fa;
border-left: 5px solid #e0607e;
padding: 1.25rem;
margin-bottom: 2rem;
border-radius: 4px;
line-height: 1.5;
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.mhs-profile-edit-notice a {
color: #e0607e;
text-decoration: underline;
font-weight: 600;
}
.mhs-profile-edit-notice a:hover {
color: #c0405e;
}
/* Free resource action panel (capture / download) */
.mhs-resource-action {
border: 1px solid #e3e3e3;
border-radius: 8px;
padding: 24px;
margin: 0 0 32px;
background: #fff;
}
.mhs-resource-action__title {
margin-top: 0;
}
.mhs-resource-action__copy {
color: #555;
}
.mhs-resource-form__field input[type="text"],
.mhs-resource-form__field input[type="email"] {
width: 100%;
max-width: 420px;
}
.mhs-resource-form__optin label {
display: flex;
gap: 8px;
align-items: flex-start;
font-size: 0.9em;
color: #555;
}
.mhs-resource-form__message:empty,
.mhs-resource-resend__message:empty {
display: none;
}
.mhs-resource-form__message,
.mhs-resource-resend__message {
margin-top: 12px;
font-weight: 600;
color: #b3261e;
}
/* Prominent, on-brand "Sending…" state: green pill + spinner. */
.mhs-resource-form__message.is-loading,
.mhs-resource-resend__message.is-loading {
display: inline-flex;
align-items: center;
gap: 10px;
color: #fff;
background: #627C7B;
border-radius: 100px;
padding: 9px 20px;
font-size: 1.05em;
}
.mhs-resource-form__message.is-loading::before,
.mhs-resource-resend__message.is-loading::before {
content: "";
flex: 0 0 auto;
width: 18px;
height: 18px;
border: 3px solid rgba(255, 255, 255, 0.4);
border-top-color: #e8d65c;
border-radius: 50%;
animation: mhs-spin 0.7s linear infinite;
}
@keyframes mhs-spin {
to {
transform: rotate(360deg);
}
}
/* Premium resource purchase state */
.mhs-resource-action__price {
font-size: 1.8em;
font-weight: 700;
color: #4b5c63;
margin: 8px 0 16px;
}
.mhs-resource-action__price del {
color: #999;
font-weight: 400;
font-size: 0.7em;
margin-right: 6px;
}
/* Logged-in homepage: team dashboard links */
/* Logged-in homepage: team-dashboard buttons (right 1/3) — restored pink + icon
style. The pink background, dark icon panel and image sizing come from the
global #sidebar-manage-groups / #sidebar-client-dashboard rules; here we just
make them full-width with white labels in the homepage context. */
.mhs-team-dashboards #sidebar-manage-groups,
.mhs-team-dashboards #sidebar-client-dashboard {
display: block;
width: 100%;
color: #fff;
text-align: left;
}
.mhs-team-dashboards #sidebar-manage-groups .bb-grid,
.mhs-team-dashboards #sidebar-client-dashboard .bb-grid {
flex-wrap: nowrap;
align-items: center;
}
.mhs-team-dashboards #sidebar-manage-groups .icon-container,
.mhs-team-dashboards #sidebar-client-dashboard .icon-container {
flex: 0 0 auto;
}
/* Reporting dashboard */
.mhs-reporting {
padding: 48px 0;
background: #f4efe6;
}
.mhs-reporting__title {
color: #4b5c63;
display: inline-block;
padding-bottom: 0.5rem;
border-bottom: 4px solid;
border-image: linear-gradient(to right, #e0607e 45%, transparent 45%) 100% 4;
margin-bottom: 24px;
}
.mhs-report-filter {
display: flex;
flex-wrap: wrap;
gap: 16px;
align-items: flex-end;
background: #FFF5E9;
padding: 20px;
border-radius: 10px;
margin-bottom: 32px;
}
.mhs-report-block {
background: #fffdf8;
border: 1px solid #ece5d8;
border-radius: 12px;
padding: 26px 30px;
margin-bottom: 26px;
box-shadow: 0 4px 18px rgba(0, 0, 0, 0.05);
}
.mhs-report-block h2 {
margin-top: 0;
color: #4b5c63;
border-bottom: 2px solid #e8d65c;
padding-bottom: 8px;
}
.mhs-report-block h3 {
color: #4b5c63;
margin: 28px 0 12px;
}
.mhs-report-table {
width: 100%;
max-width: 480px;
border-collapse: collapse;
}
.mhs-report-table th,
.mhs-report-table td {
text-align: left;
padding: 10px 12px;
border-bottom: 1px solid #e3e3e3;
}
.mhs-report-table td {
text-align: right;
font-weight: 700;
color: #4b5c63;
width: 120px;
}
.mhs-report-table--list td {
font-weight: 600;
}
.mhs-report-note {
color: #777;
font-size: 0.85em;
}
/* ---------------------------------------------------------------------------
Homepage (Systems Hub front-end project)
Brand: teal #627C7B, dark #4b5c63, pink #e0607e, yellow #e8d65c, cream #FFF5E9
--------------------------------------------------------------------------- */
.mhs-section {
padding: 64px 0;
}
/* Brand "lined" section title (matches course-index / salespage treatment). */
.mhs-section__title {
display: inline-block;
margin: 0 0 28px;
color: #4b5c63;
font-size: 2em;
line-height: 1.3;
padding-bottom: 0.6rem;
border-bottom: 4px solid;
border-image: linear-gradient(to right, #e0607e 45%, transparent 45%) 100% 4;
}
/* On coloured/!centred banners the lined underline is dropped. */
.mhs-cta--account .mhs-section__title {
border-image: none;
border-bottom: 0;
padding-bottom: 0;
}
/* Hero — green brand banner (matches .course-index-banner) */
.mhs-hero {
background: #627C7B;
color: #fff;
padding: 72px 0;
}
.mhs-hero__title {
display: inline-block;
color: #fff;
margin-top: 0;
font-size: 2.8em;
line-height: 1.15;
font-weight: 700;
padding-bottom: 0.75rem;
border-bottom: 4px solid;
border-image: linear-gradient(to right, #e8d65c 12%, transparent 12%) 100% 4;
}
.mhs-hero__subtitle {
color: #fff;
font-size: 1.15em;
max-width: 36em;
}
/* Hero signup — contained in a panel so it sits as a deliberate block. */
.mhs-hero__signup {
margin-top: 2rem;
max-width: 46em;
background: rgba(255, 255, 255, 0.12);
border: 1px solid rgba(255, 255, 255, 0.25);
border-radius: 10px;
padding: 22px 24px;
}
.mhs-hero__signup form {
margin-bottom: 0;
}
.mhs-hero__signup-label {
margin-top: 0;
color: #fff;
}
.mhs-hero__card {
background: #4b5c63;
color: #fff;
border-radius: 10px;
padding: 28px;
text-align: center;
}
.mhs-hero__card strong {
color: #fff;
}
/* Bigger text with the two lines kept close together. */
.mhs-hero__card p {
font-size: 1.3em;
line-height: 1.3;
margin: 0;
}
.mhs-hero__card p + p {
margin-top: 2px;
}
/* Hero text that sits on the green background */
.mhs-hero .mhs-mailing-form__privacy {
color: #fff;
}
.mhs-hero .mhs-hero__person-name {
color: #fff;
}
.mhs-hero .mhs-hero__person-role {
color: #e9eeee;
}
/* Mailing-list / About hero person card (also uses .mhs-hero) */
.mhs-hero .mhs-about__person {
color: #fff;
}
.mhs-hero .mhs-about__person strong {
color: #fff;
}
/* Logged-in hero: brand person banner (Lauren) */
.mhs-hero__person {
margin: 0;
text-align: center;
}
.mhs-hero__person-img {
display: block;
width: 160px;
height: 160px;
margin: 0 auto 14px;
border-radius: 50%;
object-fit: cover;
}
.mhs-hero__person-img--placeholder {
background: #dfe6e6;
}
.mhs-hero__person-name {
display: block;
font-weight: 700;
color: #4b5c63;
}
.mhs-hero__person-role {
display: block;
font-size: 0.9em;
color: #6b7a80;
}
/* Coming-soon capture panel (empty category, wf-p2) */
.mhs-coming-soon {
background: #fff;
border: 1px solid #e4e9e9;
border-radius: 10px;
padding: 28px;
}
.mhs-coming-soon__title {
margin-top: 0;
color: #4b5c63;
}
.mhs-coming-soon__copy {
color: #555;
margin-bottom: 18px;
}
/* Mailing-list form */
.mhs-mailing-form__fields {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.mhs-mailing-form__fields input[type="text"],
.mhs-mailing-form__fields input[type="email"] {
flex: 1 1 180px;
min-width: 0;
}
.mhs-mailing-form__privacy {
font-size: 0.85em;
color: #666;
margin-top: 8px;
}
.mhs-mailing-form__message:empty {
display: none;
}
.mhs-mailing-form__message.is-success {
display: inline-block;
color: #4b5c63;
background: #fff;
border-left: 5px solid #e8d65c;
border-radius: 8px;
padding: 12px 16px;
box-shadow: 0 8px 20px rgba(75, 92, 99, 0.14);
font-weight: 600;
}
.mhs-mailing-form__message.is-error {
color: #b3261e;
background: #fff;
border-left: 5px solid #b3261e;
border-radius: 8px;
padding: 12px 16px;
font-weight: 600;
}
/* Card grids */
.mhs-resources-grid,
.mhs-insights-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
gap: 24px;
}
.mhs-resources__nav {
display: flex;
flex-direction: column;
gap: 4px;
}
.mhs-resources__tab {
display: block;
width: 100%;
text-align: left;
padding: 10px 14px;
border-radius: 6px;
border: 0;
cursor: pointer;
font: inherit;
color: #4b5c63;
background: #f4f4f4;
}
.mhs-resources__tab:hover {
background: #e6ebeb;
}
.mhs-resources__tab.is-active {
background: #627C7B;
color: #fff;
}
.mhs-resources__panel[hidden] {
display: none;
}
.mhs-resources__empty {
color: #777;
}
.mhs-resources__viewall {
margin-top: 28px;
}
/* Resource / insight cards */
.mhs-card,
.mhs-insight-card {
border: 1px solid #e3e3e3;
border-radius: 10px;
overflow: hidden;
background: #fff;
transition: box-shadow 0.15s ease, transform 0.15s ease;
}
.mhs-card:hover,
.mhs-insight-card:hover {
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
transform: translateY(-2px);
}
.mhs-card__link,
.mhs-insight-card a {
display: block;
color: inherit;
text-decoration: none;
}
.mhs-card__media,
.mhs-insight-card__media {
position: relative;
aspect-ratio: 16 / 9;
background: #eef1f1;
overflow: hidden;
}
.mhs-card__media .mhs-card__image,
.mhs-insight-card__media img {
width: 100%;
height: 100%;
object-fit: cover;
}
/* Format icon (top-left) + premium star (top-right), overlaid on the media. */
.mhs-card__format,
.mhs-card__star {
position: absolute;
top: 10px;
width: 30px;
height: 30px;
display: inline-flex;
align-items: center;
justify-content: center;
background: #fff;
border-radius: 50%;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
}
.mhs-card__format {
left: 10px;
color: #4b5c63;
}
.mhs-card__star {
right: 10px;
color: #c79a00;
font-size: 1em;
line-height: 1;
}
/* Type/status badge: centred, below the image and above the title. */
.mhs-card__badge {
display: inline-block;
margin: 0 auto 8px;
background: #eef1f1;
color: #4b5c63;
border-radius: 100px;
padding: 3px 12px;
font-size: 0.72em;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.04em;
}
.mhs-card__badge--premium {
background: #e8d65c;
color: #4b5c63;
}
.mhs-card__badge--purchased {
background: #2f7d62;
color: #fff;
}
.mhs-card__body,
.mhs-insight-card__body {
padding: 18px;
}
.mhs-card__body {
text-align: center;
}
.mhs-card__excerpt {
text-align: left;
}
.mhs-card__title,
.mhs-insight-card__title {
font-size: 1.1em;
margin: 0 0 8px;
color: #4b5c63;
}
.mhs-card__excerpt,
.mhs-insight-card__excerpt {
color: #555;
font-size: 0.92em;
}
.mhs-card__more {
color: #e0607e;
font-weight: 600;
}
.mhs-card__downloads {
display: inline-flex;
align-items: center;
gap: 0.3em;
margin: 0 0 0.5em;
color: #5a6b7b;
font-size: 0.8em;
font-weight: 600;
}
.mhs-card__downloads-icon {
color: #7a8a9a;
font-weight: 700;
}
.mhs-insight-card__date {
display: block;
color: #888;
font-size: 0.8em;
margin-bottom: 6px;
}
/* Promo / credibility media placeholders */
.mhs-course-promo__media,
.mhs-credibility__media {
aspect-ratio: 4 / 3;
background: #eef1f1;
border-radius: 10px;
}
/* Homepage section rhythm — alternating brand backgrounds break up the page.
hero(cream) → resources(white) → course-promo(grey) → insights(white)
→ credibility(grey) → create-account(teal banner). */
.mhs-course-promo,
.mhs-homepage .mhs-credibility {
background: #EEEDEF;
}
.mhs-course-promo__media {
overflow: hidden;
}
.mhs-course-promo__img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 10px;
}
.mhs-credibility__list {
padding-left: 1.1em;
}
.mhs-credibility__list li {
margin-bottom: 6px;
}
/* CTAs */
.mhs-cta {
background: #FFF5E9;
}
.mhs-cta__panel {
background: #fff;
border-radius: 10px;
padding: 28px;
height: 100%;
}
/* Full-width "Create account" banner (wf-p1 §6) */
.mhs-cta--account .mhs-cta__banner {
background: #627C7B;
color: #fff;
border-radius: 10px;
padding: 40px;
text-align: center;
}
.mhs-cta--account .mhs-section__title,
.mhs-cta--account .mhs-cta__banner a:not(.button) {
color: #fff;
}
.mhs-cta__login a {
text-decoration: underline;
}
@media (max-width: 600px) {
.mhs-hero,
.mhs-homepage .mhs-section {
padding: 36px 0;
}
}
/* ---------------------------------------------------------------------------
Resource category archive
--------------------------------------------------------------------------- */
.mhs-category-archive .mhs-section {
padding: 48px 0;
}
.mhs-category-header {
background: #627C7B;
color: #fff;
padding: 56px 0;
}
.mhs-category-header__eyebrow {
text-transform: uppercase;
letter-spacing: 0.06em;
font-size: 0.8em;
color: #e8d65c;
font-weight: 700;
margin: 0 0 6px;
}
.mhs-category-header__title {
display: inline-block;
margin: 0 0 12px;
color: #fff;
font-size: 2.4em;
line-height: 1.2;
font-weight: 700;
padding-bottom: 0.6rem;
border-bottom: 4px solid;
border-image: linear-gradient(to right, #e8d65c 12%, transparent 12%) 100% 4;
}
.mhs-category-header__desc {
max-width: 44em;
color: rgba(255, 255, 255, 0.92);
}
.mhs-category-header .mhs-blog-tabs {
margin-top: 28px;
}
.mhs-category-header__prompt {
font-size: 0.95em;
color: #fff;
}
.mhs-category-header__prompt a {
color: #fff5e9;
font-weight: 600;
text-decoration: underline;
}
/* Pagination */
.mhs-pagination {
margin-top: 36px;
}
.mhs-pagination ul {
list-style: none;
display: flex;
flex-wrap: wrap;
gap: 6px;
padding: 0;
margin: 0;
}
.mhs-pagination a,
.mhs-pagination span {
display: inline-block;
padding: 8px 14px;
border-radius: 6px;
background: #f4f4f4;
color: #4b5c63;
text-decoration: none;
}
.mhs-pagination span.current {
background: #627C7B;
color: #fff;
}
.mhs-pagination a:hover {
background: #627C7B;
color: #fff;
}
/* Resource request panel */
.mhs-resource-request__panel {
background: #4B5C63;
color: #fff;
border-radius: 10px;
padding: 32px 40px;
}
.mhs-resource-request__panel .mhs-section__title {
color: #fff;
}
.mhs-resource-request__panel p {
color: rgba(255, 255, 255, 0.9);
margin-bottom: 0;
}
.mhs-resource-request__panel .mhs-request-form__message {
color: #fff;
}
/* Right column: "Let us know" button, right-aligned and vertically centred. */
.mhs-resource-request__action {
display: flex;
align-items: center;
justify-content: flex-end;
}
@media (max-width: 800px) {
.mhs-resource-request__action {
justify-content: flex-start;
margin-top: 16px;
}
}
.mhs-request-form__fields {
display: flex;
flex-direction: column;
gap: 10px;
max-width: 520px;
}
.mhs-request-form__message:empty {
display: none;
}
.mhs-request-form__message.is-success {
color: #2e7d32;
font-weight: 600;
}
.mhs-request-form__message.is-error {
color: #b3261e;
}
/* ---------------------------------------------------------------------------
Search results
--------------------------------------------------------------------------- */
.mhs-search-header {
background: #627C7B;
color: #fff;
padding: 48px 0;
}
.mhs-search-header__title {
display: inline-block;
margin: 0 0 16px;
color: #fff;
font-size: 2.4em;
line-height: 1.2;
font-weight: 700;
padding-bottom: 0.6rem;
border-bottom: 4px solid;
border-image: linear-gradient(to right, #e8d65c 12%, transparent 12%) 100% 4;
}
.mhs-search-form {
display: flex;
gap: 10px;
max-width: 560px;
}
.mhs-search-form input[type="search"] {
flex: 1 1 auto;
min-width: 0;
}
.mhs-search-header__count {
margin: 16px 0 0;
color: rgba(255, 255, 255, 0.92);
}
.mhs-search-empty {
font-size: 1.05em;
color: #555;
}
/* Single-list search results (wf-p16) */
.mhs-search-results {
display: flex;
flex-direction: column;
gap: 16px;
margin-bottom: 32px;
}
.mhs-search-result {
border: 1px solid #e4e9e9;
border-radius: 10px;
overflow: hidden;
transition: box-shadow 0.15s ease;
}
.mhs-search-result:hover {
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}
.mhs-search-result__link {
display: flex;
gap: 20px;
color: inherit;
text-decoration: none;
}
.mhs-search-result__media {
position: relative;
flex: 0 0 200px;
aspect-ratio: 16 / 9;
background: #eef1f1;
overflow: hidden;
}
.mhs-search-result__image,
.mhs-search-result__media img {
width: 100%;
height: 100%;
object-fit: cover;
}
.mhs-search-result__body {
flex: 1 1 auto;
padding: 18px 18px 18px 0;
}
.mhs-search-result__title {
color: #4b5c63;
font-size: 1.15em;
margin: 0 0 6px;
}
.mhs-search-result__excerpt {
color: #555;
font-size: 0.92em;
margin: 0 0 12px;
}
.mhs-search-result__meta {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
}
.mhs-search-result__type {
font-size: 0.72em;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.04em;
border-radius: 100px;
padding: 3px 12px;
background: #eef1f1;
color: #4b5c63;
}
.mhs-search-result__type--premium { background: #e8d65c; }
.mhs-search-result__type--purchased { background: #2f7d62; color: #fff; }
.mhs-search-result__type--course { background: #627C7B; color: #fff; }
.mhs-search-result__type--article { background: #dfe6e6; }
.mhs-search-result__tag {
font-size: 0.78em;
color: #5a6b7b;
background: #f4f6f6;
border-radius: 100px;
padding: 3px 10px;
}
@media (max-width: 600px) {
.mhs-search-result__link {
flex-direction: column;
gap: 0;
}
.mhs-search-result__media {
flex-basis: auto;
}
.mhs-search-result__body {
padding: 18px;
}
}
/* ---------------------------------------------------------------------------
Related resources ("more like this")
--------------------------------------------------------------------------- */
.mhs-related {
margin-top: 48px;
padding-top: 32px;
border-top: 1px solid #e3e3e3;
}
.mhs-related__title {
display: inline-block;
color: #4b5c63;
margin-bottom: 24px;
padding-bottom: 0.6rem;
border-bottom: 4px solid;
border-image: linear-gradient(to right, #e0607e 45%, transparent 45%) 100% 4;
}
.mhs-related__subtitle {
color: #627C7B;
font-size: 1.05em;
margin-bottom: 16px;
}
.mhs-related .mhs-resources-grid {
grid-template-columns: repeat(2, 1fr);
gap: 16px;
}
.mhs-related__all {
margin-top: 16px;
}
/* Resource single (wf-p5–p9): clean image + panel + body layout.
Widen the resource column to the full content width (the LearnDash course
column is otherwise narrow), full-bleed the green banner edge-to-edge, and
centre the content block. */
.mhs-resource-fullwidth {
overflow-x: hidden; /* guard against the 100vw banner full-bleed causing scroll */
}
/* Resources render no sidebar, so collapse the *page-level* content grid to a
single full-width column — otherwise the reserved sidebar column pushes the
content off-centre. Scoped to the direct child of #content so the inner
`site-content-grid` grids (hero 2-col, related columns) are unaffected. */
.mhs-resource-fullwidth #content > .container > .site-content-grid {
display: block;
max-width: none;
width: 100%;
}
.mhs-resource-fullwidth #primary.content-area {
max-width: none;
width: 100%;
margin-left: 0;
margin-right: 0;
}
/* Banner spans the full viewport. */
.course-type-resource .mhs-resource-banner {
width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
}
.course-type-resource .bb-learndash-content-wrap {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
max-width: none;
/* LearnDash adds padding-right:8% at >=800px, which throws off centring. */
padding-left: 0;
padding-right: 0;
}
/* The green-header content, the white content box and the account CTA all share
one centred width so they line up and the content has room to breathe. */
.course-type-resource .mhs-resource-banner .container,
.course-type-resource .single-resource-or-template-container,
.course-type-resource .mhs-cta .container {
width: 100%;
max-width: 1240px;
margin-left: auto;
margin-right: auto;
}
.course-type-resource .mhs-resource-banner .container,
.course-type-resource .mhs-cta .container {
padding-left: 20px;
padding-right: 20px;
}
.mhs-resource-banner {
margin-bottom: 2rem;
padding-bottom: 64px;
}
/* Header hero: thumbnail + action panel inside the green banner (wf-p5–p9). */
.mhs-resource-hero {
margin-top: 28px;
}
.mhs-resource-hero__media img,
.mhs-resource-hero__media .mhs-card__media-placeholder {
display: block;
width: 100%;
border-radius: 10px;
}
.mhs-resource-hero__media .mhs-card__media-placeholder {
aspect-ratio: 16 / 9;
background: rgba(255, 255, 255, 0.18);
}
/* Action panel reads as a white card on the green. */
.mhs-resource-hero__panel .mhs-resource-action {
margin: 0;
background: #fff;
border-radius: 10px;
padding: 28px;
color: #4b5c63;
}
/* Body sits centred in the white content area below the header. */
.mhs-resource-single {
background: #fff;
border: 1px solid rgba(75, 92, 99, 0.08);
box-shadow: 0 14px 40px rgba(75, 92, 99, 0.08);
}
.mhs-resource-single__body {
max-width: 46em;
margin: 0 auto;
}
.mhs-resource-single__body > p:first-child {
font-size: 1.08em;
color: #4b5c63;
}
.mhs-resource-single__body h2,
.mhs-resource-single__body h3 {
color: #4b5c63;
}
.mhs-resource-single__body h2 {
display: inline-block;
margin-top: 2rem;
padding-bottom: 0.45rem;
border-bottom: 3px solid;
border-image: linear-gradient(to right, #e0607e 45%, transparent 45%) 100% 3;
}
.mhs-resource-single__body h3 {
margin-top: 1.5rem;
}
.mhs-resource-single__body ul,
.mhs-resource-single__body ol {
border-left: 3px solid #e8d65c;
padding-left: 1.7rem;
}
.mhs-resource-single__bodycta {
margin-top: 28px;
}
/* Resend ("send to another email address") inline form */
.mhs-resource-resend__form {
margin-top: 12px;
}
/* Blog video indicator */
.mhs-insight-card__video {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 48px;
height: 48px;
border-radius: 50%;
background: rgba(75, 92, 99, 0.85);
color: #fff;
display: flex;
align-items: center;
justify-content: center;
font-size: 18px;
padding-left: 3px;
}
/* ---------------------------------------------------------------------------
Blog index + article
--------------------------------------------------------------------------- */
.mhs-blog-header {
background: #627C7B;
color: #fff;
padding: 56px 0;
text-align: center;
}
.mhs-blog-header__title {
color: #fff;
margin: 0 0 8px;
font-size: 2.6em;
line-height: 1.15;
font-weight: 700;
}
.mhs-blog-header__subtitle {
color: rgba(255, 255, 255, 0.92);
margin: 0 0 24px;
}
.mhs-blog-tabs {
display: flex;
flex-wrap: wrap;
gap: 8px;
justify-content: center;
}
/* Left-aligned variant (resources index header) */
.mhs-blog-tabs--left {
justify-content: flex-start;
margin-top: 20px;
}
.mhs-blog-tabs__item {
display: inline-block;
padding: 8px 16px;
border-radius: 100px;
background: #fff;
color: #4b5c63;
text-decoration: none;
border: 1px solid #e3e3e3;
font-size: 0.92em;
}
.mhs-blog-tabs__item:hover,
.mhs-blog-tabs__item.is-active {
background: #4b5c63;
color: #fff;
border-color: #4b5c63;
}
/* Article (single post) */
.mhs-article {
padding: 56px 0;
}
.mhs-article__inner {
max-width: 900px;
margin: 0 auto;
}
/* Top bar: back link (left) + author card (right) */
.mhs-article__topbar {
display: flex;
justify-content: space-between;
align-items: center;
gap: 16px;
margin-bottom: 28px;
}
.mhs-article__back {
color: #627C7B;
font-weight: 600;
text-decoration: none;
white-space: nowrap;
}
.mhs-article__author {
display: flex;
align-items: center;
gap: 12px;
text-align: right;
}
.mhs-article__author-img {
width: 48px;
height: 48px;
border-radius: 50%;
flex: 0 0 auto;
}
.mhs-article__author-name {
display: block;
font-weight: 700;
color: #4b5c63;
line-height: 1.2;
}
.mhs-article__author-role {
display: block;
font-size: 0.85em;
color: #6b7a80;
}
/* Title + meta */
.mhs-article__head {
margin-bottom: 28px;
}
.mhs-article__title {
color: #4b5c63;
font-size: 2.4em;
line-height: 1.15;
font-weight: 700;
margin: 0 0 14px;
}
.mhs-article__meta {
display: flex;
flex-wrap: wrap;
gap: 14px;
align-items: center;
color: #777;
font-size: 0.9em;
}
.mhs-article__cat {
color: #e0607e;
font-weight: 600;
text-decoration: none;
}
.mhs-article__videotag {
background: #4b5c63;
color: #fff;
border-radius: 100px;
padding: 2px 10px;
font-size: 0.85em;
}
/* Featured image / placeholder */
.mhs-article__media {
margin: 0 0 32px;
}
.mhs-article__media img,
.mhs-article__media-placeholder {
display: block;
width: 100%;
border-radius: 12px;
}
.mhs-article__media-placeholder {
aspect-ratio: 16 / 9;
background: linear-gradient(135deg, #e7ecec, #d2dede);
}
/* Body */
.mhs-article__body {
font-size: 1.05em;
line-height: 1.7;
color: #3f4d54;
}
.mhs-article__body p {
margin-bottom: 1.2em;
}
.mhs-article__share {
margin-top: 36px;
padding-top: 24px;
border-top: 3px solid #e0607e;
display: flex;
gap: 14px;
align-items: center;
}
.mhs-article__share a {
color: #627C7B;
font-weight: 600;
text-decoration: none;
}
/* ---------------------------------------------------------------------------
About / Mailing-list / Contact pages
--------------------------------------------------------------------------- */
.mhs-about__grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 24px;
}
.mhs-about__feature {
background: #fff;
border: 1px solid #e3e3e3;
border-radius: 10px;
padding: 24px;
}
.mhs-about__feature h3 {
margin-top: 0;
color: #627C7B;
}
/* About section rhythm: green hero → white built-by → grey features →
white audience → grey partner → teal account banner. */
.mhs-about__features,
.mhs-about__partner {
background: #EEEDEF;
}
.mhs-about__audience {
background: #fff;
}
.mhs-about__statement {
font-size: 1.2em;
color: #4b5c63;
font-weight: 600;
margin-top: 28px;
text-align: center;
}
.mhs-about__avatar,
.mhs-about__logo {
aspect-ratio: 1 / 1;
max-width: 220px;
background: #eef1f1;
border-radius: 10px;
margin-bottom: 12px;
}
.mhs-about__person {
color: #4b5c63;
}
/* Contact */
.mhs-contact-header {
background: #627C7B;
color: #fff;
padding: 56px 0;
text-align: center;
}
.mhs-contact-header__title {
color: #fff;
margin: 0 0 8px;
font-size: 2.6em;
line-height: 1.15;
font-weight: 700;
}
.mhs-contact-header__intro {
color: rgba(255, 255, 255, 0.92);
}
.mhs-contact__subtitle {
color: #4b5c63;
margin-top: 0;
}
.mhs-contact__details a {
color: #e0607e;
font-weight: 600;
}
.mhs-contact__form {
background: #fff;
border: 1px solid #e3e3e3;
border-radius: 10px;
padding: 28px;
}
/* ---------------------------------------------------------------------------
Off-canvas (hamburger) drawer — right-hand panel, push style
--------------------------------------------------------------------------- */
:root {
--mhs-oc-w: 320px;
}
/* Hamburger toggle injected into the BuddyBoss header */
.mhs-oc-toggle {
border: 0;
background: transparent;
cursor: pointer;
width: 34px;
height: 30px;
padding: 5px;
margin-left: 6px;
display: inline-flex;
flex-direction: column;
justify-content: space-between;
align-self: center;
}
.mhs-oc-toggle span {
display: block;
height: 3px;
border-radius: 2px;
background: currentColor;
color: #4b5c63;
}
/* The page wrapper slides left when the drawer is open */
#page {
transition: transform 0.3s ease;
}
body.mhs-oc-open {
overflow-x: hidden;
}
body.mhs-oc-open #page {
transform: translateX(calc(-1 * var(--mhs-oc-w)));
}
/* Overlay */
.mhs-oc-overlay {
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.4);
opacity: 0;
visibility: hidden;
transition: opacity 0.3s ease, visibility 0.3s ease;
z-index: 9998;
}
body.mhs-oc-open .mhs-oc-overlay {
opacity: 1;
visibility: visible;
}
/* Panel */
.mhs-offcanvas {
position: fixed;
top: 0;
right: 0;
height: 100%;
width: var(--mhs-oc-w);
max-width: 90vw;
background: #fff;
box-shadow: -6px 0 24px rgba(0, 0, 0, 0.15);
transform: translateX(100%);
transition: transform 0.3s ease;
z-index: 9999;
padding: 28px 24px;
overflow-y: auto;
}
body.mhs-oc-open .mhs-offcanvas {
transform: translateX(0);
}
.mhs-oc-close {
position: absolute;
top: 10px;
right: 16px;
border: 0;
background: none;
font-size: 1.9em;
line-height: 1;
cursor: pointer;
color: #4b5c63;
}
.mhs-oc-menu {
list-style: none;
margin: 36px 0 0;
padding: 0;
}
.mhs-oc-menu li {
margin-bottom: 2px;
}
.mhs-oc-menu a {
display: block;
padding: 10px 8px;
color: #4b5c63;
text-decoration: none;
border-radius: 6px;
font-weight: 600;
}
.mhs-oc-menu a:hover {
background: #f4f4f4;
color: #e0607e;
}
.mhs-oc-actions {
margin-top: 24px;
}
@media (max-width: 480px) {
:root {
--mhs-oc-w: 85vw;
}
}
/* ---------------------------------------------------------------------------
Create account (custom registration)
--------------------------------------------------------------------------- */
.mhs-register__title {
display: inline-block;
color: #4b5c63;
margin-top: 0;
font-size: 2.2em;
line-height: 1.2;
font-weight: 700;
padding-bottom: 0.6rem;
border-bottom: 4px solid;
border-image: linear-gradient(to right, #e0607e 45%, transparent 45%) 100% 4;
}
.mhs-register__benefits {
padding-left: 1.1em;
}
.mhs-register__benefits li {
margin-bottom: 8px;
}
.mhs-register__formwrap {
background: #fff;
border: 1px solid #e3e3e3;
border-radius: 10px;
padding: 28px;
}
.mhs-register__badges {
display: flex;
flex-wrap: wrap;
gap: 16px;
margin: 16px 4px 0;
font-size: 0.85em;
font-weight: 600;
color: #5a6b7b;
}
.mhs-register__login {
text-align: right;
margin-top: 0;
font-size: 0.95em;
}
.mhs-form-row {
margin-bottom: 16px;
}
.mhs-form-row--split {
display: flex;
gap: 14px;
flex-wrap: wrap;
}
.mhs-form-row--split > label {
flex: 1 1 180px;
}
.mhs-register-form label {
font-weight: 600;
color: #4b5c63;
font-size: 0.92em;
}
.mhs-register-form input[type="text"],
.mhs-register-form input[type="email"],
.mhs-register-form input[type="password"],
.mhs-register-form select {
width: 100%;
font-weight: 400;
}
.mhs-register__optin {
display: flex;
gap: 8px;
align-items: flex-start;
font-weight: 400;
font-size: 0.9em;
color: #555;
}
.mhs-register-form__message:empty {
display: none;
}
.mhs-register-form__message.is-error {
color: #b3261e;
margin-top: 10px;
}
/* Honeypot — visually hidden from real users */
.mhs-hp {
position: absolute !important;
left: -9999px;
width: 1px;
height: 1px;
overflow: hidden;
}
/* =========================================================================
Wireframe amends (v1.1.0) — see wireframe-amends.md
========================================================================= */
/* Tick lists (wf-p1/p11/p18): replace bullets with pink ticks. */
.mhs-ticks {
list-style: none;
margin-left: 0;
padding-left: 0;
}
.mhs-ticks li {
position: relative;
padding-left: 2rem;
margin-bottom: 0.6rem;
}
.mhs-ticks li::before {
content: "\2713";
position: absolute;
left: 0;
top: 0;
font-weight: 700;
color: #e0607e;
}
.mhs-ticks--light li::before {
color: #fff;
}
/* Bolden the credibility note (wf-p1). */
.mhs-credibility__note {
font-weight: 700;
}
/* Bigger, bolder hero subtitle (wf-p1). */
.mhs-hero__subtitle {
font-size: 1.3em;
font-weight: 600;
}
/* Hero signup: prompt (label + curved arrow) to the left of the form (wf-p1). */
.mhs-hero__signup--arrow {
display: flex;
align-items: center;
gap: 16px;
flex-wrap: wrap;
}
.mhs-hero__signup-prompt {
display: flex;
align-items: center;
gap: 6px;
color: #fff;
max-width: 15em;
}
.mhs-hero__signup-arrow svg {
width: 70px;
height: 46px;
color: #e0607e;
}
.mhs-hero__signup--arrow .mhs-mailing-form {
flex: 1 1 260px;
}
.mhs-mailing-form--email-only .mhs-mailing-form__fields {
flex-wrap: wrap;
}
/* Account CTA optional image on the left (wf-p1/p10). */
.mhs-cta__banner--has-image {
display: flex;
align-items: center;
gap: 32px;
text-align: left;
}
.mhs-cta__banner--has-image .mhs-cta__media {
flex: 0 0 34%;
max-width: 34%;
}
.mhs-cta__banner--has-image .mhs-cta__img {
display: block;
width: 100%;
height: auto;
border-radius: 10px;
}
.mhs-cta__banner--has-image .mhs-cta__content {
flex: 1 1 auto;
}
@media (max-width: 800px) {
.mhs-cta__banner--has-image {
flex-direction: column;
text-align: center;
}
.mhs-cta__banner--has-image .mhs-cta__media {
flex-basis: auto;
max-width: 220px;
}
}
/* "Everything you need" subtitle, intro + per-box image (wf-p11/p18). */
.mhs-about__features-subtitle {
text-align: center;
font-size: 1.15em;
color: #4b5c63;
max-width: 40em;
margin: 0 auto 12px;
}
.mhs-about__features-intro {
text-align: center;
max-width: 46em;
margin: 0 auto 28px;
color: #555;
}
.mhs-about__feature-media {
margin-bottom: 14px;
}
.mhs-about__feature-img {
display: block;
width: 100%;
max-height: 140px;
object-fit: cover;
border-radius: 8px;
}
/* Course promo star rating under the image (wf-p1). */
.mhs-course-promo__rating {
margin-top: 12px;
text-align: center;
}
.mhs-course-promo__stars {
color: #f5a623;
letter-spacing: 2px;
font-size: 1.15em;
display: block;
}
.mhs-course-promo__rating-text {
font-size: 0.9em;
color: #555;
}
/* Section header row with a right-aligned action button (wf-p1 insights). */
.mhs-section__head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
flex-wrap: wrap;
margin-bottom: 20px;
}
.mhs-section__head .mhs-section__title {
margin-bottom: 0;
}
.mhs-section__more {
flex: 0 0 auto;
}
/* Premium resources wider than free ones in the resource panels + category
archive (cross-page), but equal-sized in the "related" columns (wf-p5). */
.mhs-resources__panel .mhs-resources-grid .mhs-card--premium,
.mhs-resources__panel .mhs-resources-grid .mhs-card--purchased,
.mhs-category-archive .mhs-resources-grid .mhs-card--premium,
.mhs-category-archive .mhs-resources-grid .mhs-card--purchased {
grid-column: span 2;
}
@media (max-width: 700px) {
.mhs-resources__panel .mhs-resources-grid .mhs-card--premium,
.mhs-resources__panel .mhs-resources-grid .mhs-card--purchased,
.mhs-category-archive .mhs-resources-grid .mhs-card--premium,
.mhs-category-archive .mhs-resources-grid .mhs-card--purchased {
grid-column: auto;
}
}
/* Related resources: pink divider between the two columns; equal card sizing. */
.mhs-related .mhs-resources-grid .mhs-card--premium,
.mhs-related .mhs-resources-grid .mhs-card--purchased {
grid-column: auto;
}
@media (min-width: 801px) {
.mhs-related .mhs-related__col + .mhs-related__col {
border-left: 2px solid #e0607e;
padding-left: 32px;
}
}
/* Premium purchase panel: instruction line + centred price/button (wf-p7/p8). */
.mhs-resource-action__instruction {
color: #555;
margin-bottom: 12px;
}
.mhs-resource-action__purchase {
text-align: center;
}
.mhs-resource-action__purchase .mhs-resource-action__price {
font-size: 1.4em;
font-weight: 700;
color: #4b5c63;
}
/* Resource "sent" confirmation state (wf-p10): single centred column, no body. */
/* Centre the (inline-block) title and drop its left underline. */
.mhs-resource-banner.is-confirmed .container {
text-align: center;
}
.mhs-resource-banner.is-confirmed .mhs-category-header__title {
display: inline-block;
text-align: center;
border-bottom: 0;
}
.mhs-resource-banner.is-confirmed .mhs-resource-hero {
display: block;
max-width: 560px;
margin: 0 auto;
text-align: center;
}
/* Reset the two grid cells to a single full-width centred column. */
.mhs-resource-banner.is-confirmed .mhs-resource-hero__media,
.mhs-resource-banner.is-confirmed .mhs-resource-hero__panel {
display: block;
width: 100%;
max-width: 100%;
flex: none;
padding: 0;
margin: 0;
text-align: center;
}
.mhs-resource-banner.is-confirmed .mhs-resource-hero__media {
margin: 0 auto 24px;
}
.mhs-resource-banner.is-confirmed .mhs-resource-hero__media img {
height: auto;
object-fit: contain;
}
/* No white card/border behind the confirmation text — it sits on the green
banner, matched to the image width. */
.mhs-resource-banner.is-confirmed .mhs-resource-hero__panel .mhs-resource-action,
.mhs-resource-banner.is-confirmed .mhs-resource-hero__panel .mhs-resource-action h3 {
color: #fff;
}
.mhs-resource-banner.is-confirmed .mhs-resource-hero__panel .mhs-resource-action {
background: transparent;
border: 0;
box-shadow: none;
padding: 0;
margin: 0 auto;
max-width: 100%;
}
.mhs-resource-banner.is-confirmed .mhs-resource-hero__panel .mhs-resource-action a {
color: #fff;
text-decoration: underline;
}
/* "Send to another email address" toggle — make it clearly a link. */
.mhs-resource-resend__toggle {
display: inline-block;
margin-top: 8px;
color: #fff;
font-weight: 600;
text-decoration: underline;
text-underline-offset: 3px;
cursor: pointer;
}
.mhs-resource-resend__toggle:hover {
color: #e8d65c;
}
/* Resend form: keep labels readable on the green banner. */
.mhs-resource-banner.is-confirmed .mhs-resource-action label,
.mhs-resource-resend__form label {
color: #fff;
}
/* On the "sent" view the related block is the top of the white box, so it no
longer needs its top divider/spacing. */
body.mhs-resource-sent .mhs-related {
border-top: 0;
margin-top: 0;
padding-top: 0;
}
/* Create-account: dark-green intro panel (wf-p11). */
.mhs-register__intro--dark {
background: #627C7B;
color: #fff;
padding: 36px;
border-radius: 12px;
}
.mhs-register__intro--dark a {
color: #fff;
text-decoration: underline;
}
/* Mailing-list page (wf-p12): button on its own centred line; centre Lauren. */
.mhs-mailing-page .mhs-mailing-form__fields {
flex-wrap: wrap;
}
.mhs-mailing-page .mhs-mailing-form__submit {
flex: 0 0 100%;
margin: 12px auto 0;
max-width: 320px;
}
.mhs-mailing-page .bb-grid-cell.sm-grid-1-3 {
text-align: center;
}
.mhs-mailing-page .mhs-about__avatar {
margin-left: auto;
margin-right: auto;
}
/* Blog "More" load-more button (wf-p13). */
.mhs-blog-more {
text-align: center;
margin-top: 32px;
}
.mhs-blog-more__btn.is-loading {
opacity: 0.7;
pointer-events: none;
}
/* Single blog share: icon links, centred (wf-p14). */
.mhs-article__share--center {
display: flex;
align-items: center;
justify-content: center;
gap: 14px;
}
.mhs-article__share-link {
display: inline-flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
border-radius: 50%;
background: #627C7B;
color: #fff;
font-size: 1.1em;
}
.mhs-article__share-link:hover {
background: #e0607e;
color: #fff;
}
/* Pink divider (wf-p14). */
.mhs-divider--pink {
border: 0;
border-top: 4px solid;
border-image: linear-gradient(to right, #e0607e 45%, transparent 45%) 100% 4;
margin: 40px 0 0;
}
/* Contact details: icons (wf-p15). */
.mhs-contact__item {
display: flex;
align-items: flex-start;
gap: 10px;
}
.mhs-contact__icon {
color: #627C7B;
margin-top: 3px;
flex: 0 0 auto;
}
.mhs-contact__social a {
display: inline-flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
border-radius: 50%;
background: #627C7B;
color: #fff;
font-size: 1.1em;
}
.mhs-contact__social a:hover {
background: #e0607e;
}
/* Search results (wf-p16): white boxes, thinner column, right-aligned meta. */
.mhs-search .container {
max-width: 1000px;
}
.mhs-search-result {
background: #fff;
border: 1px solid #e3e3e3;
border-radius: 10px;
}
.mhs-search-result__cats {
text-align: right;
padding: 0 16px 14px;
}
.mhs-search-result__cats .mhs-search-result__tag {
display: inline-block;
margin-left: 6px;
}
.mhs-search .mhs-pagination {
text-align: right;
justify-content: flex-end;
}
/* Category archive: header image (wf-p17). */
.mhs-category-header__media {
margin: 16px 0;
}
.mhs-category-header__img {
max-width: 100%;
height: auto;
border-radius: 10px;
}
/* About: hero image, lead statement, persona icons, partner image (wf-p18). */
.mhs-hero__media-img {
display: block;
width: 100%;
height: auto;
border-radius: 12px;
}
.mhs-about__statement--lead {
font-weight: 700;
font-size: 1.35em;
text-align: center;
max-width: 40em;
margin: 28px auto 0;
color: #4b5c63;
}
.mhs-about__audience-subtitle,
.mhs-about__partner-subtitle {
color: #555;
max-width: 46em;
margin-bottom: 20px;
}
.mhs-about__feature--persona .mhs-about__persona-icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
border-radius: 50%;
background: #eef2f2;
color: #627C7B;
font-size: 1.2em;
margin-bottom: 12px;
}
.mhs-about__logo-img {
display: block;
width: 100%;
height: auto;
}
/* Editable-image placeholder (swapped out via ACF). */
.mhs-placeholder-img {
display: block;
width: 100%;
height: auto;
border-radius: 10px;
background: #eef2f2;
}
/* Inline header search (replaces the BuddyBoss search dropdown toggle). */
.mhs-header-search {
display: inline-flex;
align-items: center;
align-self: center;
background: #fff;
border: 1px solid #d5dede;
border-radius: 999px;
height: 40px;
max-width: 345px;
overflow: hidden;
vertical-align: middle;
margin: auto 0;
}
.mhs-header-search .mhs-header-search__input,
.mhs-header-search .mhs-header-search__input:focus,
.mhs-header-search .mhs-header-search__input:active {
flex: 1 1 auto;
min-width: 0;
width: 235px;
height: 100%;
font-size: 0.9em;
color: #2b3a3a;
/* Override the parent theme's input[type=search] styling (magnifier
background image, focus border/box-shadow) which wins on specificity. */
background: transparent none !important;
background-image: none !important;
border: 0 !important;
outline: 0 !important;
box-shadow: none !important;
padding: 0 6px 0 16px !important;
-webkit-appearance: none;
appearance: none;
}
.mhs-header-search__input::placeholder {
color: #8aa0a0;
}
/* Remove the browser's native search-field icon/decorations. */
.mhs-header-search__input::-webkit-search-decoration,
.mhs-header-search__input::-webkit-search-cancel-button,
.mhs-header-search__input::-webkit-search-results-button {
-webkit-appearance: none;
appearance: none;
display: none;
}
.mhs-header-search__submit {
flex: 0 0 auto;
border: 0;
background: transparent;
color: #627C7B;
padding: 0 14px 0 6px;
height: 100%;
display: inline-flex;
align-items: center;
cursor: pointer;
font-size: 1.15em;
line-height: 1;
}
.mhs-header-search__submit:hover,
.mhs-header-search__submit:focus {
color: #e0607e;
}
@media (max-width: 1200px) {
.mhs-header-search {
max-width: 260px;
}
.mhs-header-search__input {
width: 175px;
}
}
/* =========================================================================
Wireframe amends round 2 — see wireframe-amends-round2.md
========================================================================= */
/* wf-p1: hero signup — prompt + arrow top-left, fields stacked on the right. */
.mhs-hero__signup--arrow {
flex-wrap: nowrap;
align-items: flex-start;
}
.mhs-hero__signup-prompt {
flex: 0 0 auto;
margin-top: 4px;
}
/* Trim trailing space so the box hugs its content (no gap at the bottom). */
.mhs-hero__signup--arrow .mhs-mailing-form__privacy {
margin-bottom: 0;
}
.mhs-hero__signup--arrow .mhs-mailing-form__message:empty {
display: none;
margin: 0;
}
.mhs-hero__signup--arrow .mhs-mailing-form {
flex: 1 1 auto;
}
.mhs-hero__signup--arrow .mhs-mailing-form__fields {
flex-direction: column;
align-items: stretch;
}
/* Stop the email input growing to fill the column height (its flex-basis is on
the vertical axis once stacked). */
.mhs-hero__signup--arrow .mhs-mailing-form__fields input[type="text"],
.mhs-hero__signup--arrow .mhs-mailing-form__fields input[type="email"] {
flex: 0 0 auto;
height: 46px;
}
.mhs-hero__signup--arrow .mhs-mailing-form__submit {
width: 100%;
}
@media (max-width: 720px) {
.mhs-hero__signup--arrow {
flex-wrap: wrap;
}
}
/* wf-p1: course-promo rating — larger + bolder. */
.mhs-course-promo__rating-text {
font-size: 1.05em;
font-weight: 600;
color: #4b5c63;
}
/* wf-p1: "More News" button — pink background. */
.mhs-section__more.button.outline,
.mhs-section__more.button {
background: #e0607e;
border-color: #e0607e;
color: #fff;
}
.mhs-section__more.button.outline:hover,
.mhs-section__more.button:hover {
background: #c94e6c;
border-color: #c94e6c;
color: #fff;
}
/* wf-p1: gutter between the course-promo text and image. */
@media (min-width: 801px) {
.mhs-course-promo .site-content-grid .bb-grid-cell.sm-grid-1-3 {
padding-left: 32px;
}
}
/* wf-p1: create-account CTA text left-aligned. */
.mhs-cta__banner--has-image .mhs-cta__content,
.mhs-cta__banner--has-image .mhs-cta__content .mhs-section__title {
text-align: left;
}
/* wf-p1 / cross: premium resource cards — shorter featured image so the
double-width card doesn't tower over the adjacent single card. */
.mhs-resources__panel .mhs-resources-grid .mhs-card--premium .mhs-card__media,
.mhs-resources__panel .mhs-resources-grid .mhs-card--purchased .mhs-card__media,
.mhs-category-archive .mhs-resources-grid .mhs-card--premium .mhs-card__media,
.mhs-category-archive .mhs-resources-grid .mhs-card--purchased .mhs-card__media {
aspect-ratio: auto;
height: 190px;
}
/* wf-p5/p7: equalise the resource image + white panel heights. */
.mhs-resource-hero.align-items-top {
align-items: stretch;
}
.mhs-resource-hero__media {
display: flex;
}
.mhs-resource-hero__media img {
height: 100%;
object-fit: cover;
}
/* wf-p5: capture-form checkboxes — centre with the label, closer together. */
.mhs-resource-form__optin {
margin: 6px 0;
}
.mhs-resource-form__optin label {
display: flex;
align-items: center;
gap: 8px;
}
.mhs-resource-form__optin input[type="checkbox"] {
margin: 0;
flex: 0 0 auto;
}
/* wf-p5: editable intro line under the download title. */
.mhs-resource-action__formintro {
color: #555;
margin-bottom: 14px;
}
/* wf-p5: breathe out the pink divider between related columns — padding only
(no gap/margin, which pushed the columns past 100% and wrapped the second one).
The bb-grid cells are border-box, so this stays within each 50% column. */
@media (min-width: 801px) {
.mhs-related .mhs-related__col + .mhs-related__col {
border-left: 2px solid #e0607e;
padding-left: 36px;
}
.mhs-related .mhs-related__col:first-child {
padding-right: 36px;
}
}
/* wf-p7: larger price in the purchase box. */
.mhs-resource-action__price,
.mhs-resource-action__purchase .mhs-resource-action__price {
font-size: 1.7em;
}
/* wf-p11: green hero section, white heading. */
.mhs-register__hero {
background: #627C7B;
color: #fff;
padding-top: 50px;
padding-bottom: 50px;
}
.mhs-register__hero .mhs-register__title,
.mhs-register__hero .mhs-register__intro,
.mhs-register__hero .mhs-register__intro p {
color: #fff;
}
.mhs-register__hero .mhs-register__intro a {
color: #fff;
text-decoration: underline;
}
/* The form stays on a white card. */
.mhs-register__hero .mhs-register__formwrap {
background: #fff;
color: #2b3a3a;
padding: 28px;
border-radius: 12px;
}
.mhs-register__hero .mhs-register__formwrap .mhs-register__login {
color: #4b5c63;
}
/* wf-p12: mailing-list form — two fields on one row, button on its own row. */
.mhs-mailing-page .mhs-mailing-form__fields {
display: flex;
flex-wrap: wrap;
gap: 12px;
}
.mhs-mailing-page .mhs-mailing-form__fields input {
flex: 1 1 calc(50% - 6px);
min-width: 0;
}
.mhs-mailing-page .mhs-mailing-form__submit {
flex: 0 0 100%;
margin: 4px auto 0;
max-width: 320px;
}
/* wf-p14: share icons — white glyphs, larger. */
.mhs-article__share-link {
width: 54px;
height: 54px;
font-size: 1.75em;
}
.mhs-article__share-link,
.mhs-article__share-link i {
color: #fff;
}
.mhs-article__share-link:hover,
.mhs-article__share-link:hover i {
color: #fff;
}
/* wf-p16: badge + categories on one row; images fill the row height. */
.mhs-search-result__footer {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
flex-wrap: wrap;
padding: 0 16px 14px;
}
.mhs-search-result__footer .mhs-search-result__cats {
padding: 0;
text-align: right;
}
.mhs-search-result__link {
align-items: stretch;
}
.mhs-search-result__media {
display: flex;
aspect-ratio: auto;
align-self: stretch;
min-height: 130px;
}
.mhs-search-result__media .mhs-search-result__image,
.mhs-search-result__media img {
height: 100%;
width: 100%;
object-fit: cover;
}
/* wf-p17: category header — text 2/3 left, image 1/3 right. */
.mhs-category-header__grid {
display: flex;
align-items: center;
gap: 32px;
}
.mhs-category-header__grid .mhs-category-header__main {
flex: 1 1 66%;
}
.mhs-category-header__grid .mhs-category-header__media {
flex: 0 0 33%;
margin: 0;
}
@media (max-width: 800px) {
.mhs-category-header__grid {
flex-direction: column;
align-items: stretch;
}
}
@media (max-width: 600px) {
.mhs-hero,
.mhs-category-header,
.mhs-blog-header,
.mhs-contact-header,
.mhs-search-header,
.mhs-register__hero {
padding-top: 44px;
padding-bottom: 44px;
}
.mhs-hero .container,
.mhs-category-header .container,
.mhs-blog-header .container,
.mhs-contact-header .container,
.mhs-search-header .container,
.mhs-register__hero .container,
.course-type-resource .mhs-resource-banner .container {
padding-left: 28px;
padding-right: 28px;
}
.mhs-hero__title,
.mhs-category-header__title,
.mhs-blog-header__title,
.mhs-contact-header__title,
.mhs-search-header__title,
.mhs-register__title {
font-size: 2.1em;
line-height: 1.12;
}
.mhs-category-header__desc,
.mhs-category-header__prompt,
.mhs-hero__subtitle {
font-size: 0.98em;
}
.course-type-resource .mhs-resource-banner .mhs-category-header__title {
margin-left: 12px;
max-width: calc(100% - 12px);
}
}
/* wf-p18: "Everything you need" subtitle + intro left-aligned. */
.mhs-about__features-subtitle,
.mhs-about__features-intro {
text-align: left;
max-width: none;
margin-left: 0;
margin-right: 0;
}
/* Site footer (cross-page). */
/* Custom Systems Hub footer (.mhs-footer): three columns — logo | registered
address | contact (email + policy links), per the wireframe. */
.mhs-footer .mhs-footer__grid {
display: grid;
grid-template-columns: 2fr 1fr 1fr;
align-items: start;
gap: 40px;
padding: 22px 0 12px;
}
.mhs-footer__col {
color: #fff;
font-size: 1.05em;
}
.mhs-footer__logo {
display: inline-block;
}
.mhs-footer__logo img {
max-width: 210px;
height: auto;
}
.mhs-footer-address__heading {
font-weight: 700;
color: #fff;
margin: 0 0 10px;
}
.mhs-footer-address address {
font-style: normal;
line-height: 1.7;
color: rgba(255, 255, 255, 0.85);
}
/* Contact column is right-aligned. */
.mhs-footer__contact {
display: flex;
flex-direction: column;
align-items: flex-end;
text-align: right;
gap: 10px;
}
.mhs-footer__email {
color: #fff;
text-decoration: underline;
}
.mhs-footer__email:hover {
color: #e0607e;
}
.mhs-footer__links {
list-style: none;
margin: 0;
padding: 0;
}
.mhs-footer__links li {
margin-bottom: 2px;
}
/* Override the theme's .bb-footer li a (dark grey, 13px) which out-specifies a
single-class rule — force white, readable links. */
.mhs-footer .mhs-footer__links a {
color: #fff;
font-size: 1em;
letter-spacing: normal;
text-decoration: underline;
line-height: 1.5;
}
.mhs-footer .mhs-footer__links a:hover {
color: #e0607e;
}
.mhs-footer__socials {
display: flex;
gap: 10px;
list-style: none;
margin: 12px 0 0;
padding: 0;
}
.mhs-footer__socials li {
margin: 0;
}
.mhs-footer__socials a {
display: inline-flex;
align-items: center;
justify-content: center;
width: 46px;
height: 46px;
border-radius: 50%;
border: 1px solid rgba(255, 255, 255, 0.45);
background: transparent;
color: #fff;
line-height: 1;
}
.mhs-footer__socials a i {
color: #fff;
font-size: 22px;
}
.mhs-footer__socials a:hover {
background: #e0607e;
border-color: #e0607e;
}
@media (max-width: 782px) {
.mhs-footer .mhs-footer__grid {
grid-template-columns: 1fr;
gap: 28px;
}
.mhs-footer__contact {
align-items: flex-start;
text-align: left;
}
}
/* wf-p1: full-width image in the logged-out hero card. */
.mhs-hero__card-media {
margin-bottom: 14px;
}
.mhs-hero__card-img {
display: block;
width: 100%;
height: auto;
border-radius: 10px;
}
/* ---------------------------------------------------------------------------
Section definition + background-image "lift" (matches the course-index /
sales-page treatment): give adjacent sections distinct backgrounds so they
read as clearly separated blocks, with decorative background images on some.
The bg-*.png files are duplicated placeholders — swap them for bespoke section
artwork in wp-content/themes/buddyboss-child/assets/images/.
--------------------------------------------------------------------------- */
/* Homepage */
.mhs-homepage .mhs-resources {
background-color: #f4efe6;
background-image: url("../images/bg-homepage-resources.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.mhs-homepage .mhs-course-promo {
background-color: #fbf6ee;
}
.mhs-homepage .mhs-insights {
background-color: #f4efe6;
background-image: url("../images/bg-homepage-insights.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
/* About + Create-account "Everything you need" block (shared component) */
.mhs-about__features {
background-color: #f4efe6;
background-image: url("../images/bg-features.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
/* About */
.mhs-about__audience {
background-color: #fbf6ee;
background-image: url("../images/bg-about-audience.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.mhs-about__partner {
background-color: #f4efe6;
background-image: url("../images/bg-about-partner.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
/* Resources index + content-category pages — same section treatment (tints +
swappable bg images, no pure white). */
.mhs-category-archive .mhs-category-resources {
background-color: #f4efe6;
background-image: url("../images/bg-resources.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.mhs-category-archive .mhs-resource-request {
background-color: #fbf6ee;
}
.mhs-category-archive .mhs-category-blogs {
background-color: #f4efe6;
background-image: url("../images/bg-category-blogs.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
/* Blog index + single post — same section treatment (tints + swappable bg
images, no pure white). */
.mhs-blog .mhs-blog-listings {
background-color: #f4efe6;
background-image: url("../images/bg-blog.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
/* Single post: textured tinted section with the article as a soft-cream reading
card (keeps long-form text on a clean surface, no pure white). */
.mhs-article {
background-color: #f4efe6;
background-image: url("../images/bg-single-post.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.mhs-article__inner {
background: #FFF;
padding: 40px;
border-radius: 12px;
box-shadow: 0 6px 22px rgba(0, 0, 0, 0.06);
}
@media (max-width: 600px) {
.mhs-article__inner {
padding: 24px;
}
}
.mhs-homepage .mhs-hero {
background-color: #627C7B;
background-image: url("../images/bg-homepage-hero.png");
background-size: cover;
background-repeat: no-repeat;
background-position: right bottom;
}
/* Yellow (primary) buttons always use dark text — white is hard to read on the
brand yellow, and coloured-banner link-colour rules must not override it. The
:not() guards leave pink (.outline) and green (.secondary) buttons untouched. */
a.button:not(.outline):not(.secondary),
button.button:not(.outline):not(.secondary),
.mhs-cta__banner a.button {
color: #4B5C63;
}
/* ---------------------------------------------------------------------------
Mobile / smartphone refinements
--------------------------------------------------------------------------- */
/* The footer sits outside .site-content (which provides the page side gutter),
so give its containers their own horizontal padding — otherwise the content
hugs the screen edge on narrow viewports. */
.mhs-footer .container,
#subfooter .container {
padding-left: 24px;
padding-right: 24px;
}
/* Smartphone: drop the decorative section background images (they can crowd or
obscure text on narrow screens). The tint background-colour is retained. */
@media (max-width: 782px) {
.mhs-homepage .mhs-hero,
.mhs-homepage .mhs-resources,
.mhs-homepage .mhs-insights,
.mhs-about__features,
.mhs-about__audience,
.mhs-about__partner,
.mhs-category-archive .mhs-category-resources,
.mhs-category-archive .mhs-category-blogs,
.mhs-blog .mhs-blog-listings,
.mhs-article {
background-image: none !important;
}
}
/* Partner ("Specialists in healthcare human factors") image: wider, no grey
backing, rounded — overrides the shared square avatar/logo styling, and only
affects the partner logo (not Lauren's avatar). */
.mhs-about__partner .mhs-about__logo {
aspect-ratio: auto;
max-width: 100%;
background: none;
border-radius: 12px;
overflow: hidden;
}
.mhs-about__partner .mhs-about__logo-img {
border-radius: 12px;
}
/* Reporting tables — polish inside the block cards. */
.mhs-report-filter {
background: #fffdf8;
border: 1px solid #ece5d8;
}
/* All report tables share one style: same reduced width + alternating rows. */
.mhs-report-table tr:last-child th,
.mhs-report-table tr:last-child td {
border-bottom: 0;
}
.mhs-report-table tr:nth-child(even) th,
.mhs-report-table tr:nth-child(even) td {
background: #faf5ec;
}
.mhs-report-table th a {
color: #627C7B;
font-weight: 600;
}
.mhs-report-table th a:hover {
color: #e0607e;
}
/* Search results: the article is the flex row (media | body). The image fills the
full box height, and the type badge + linked categories sit at the bottom of the
body (right column) — no full-width footer below. */
.mhs-search-result {
display: flex;
gap: 20px;
align-items: stretch;
}
.mhs-search-result__media {
flex: 0 0 200px;
align-self: stretch;
aspect-ratio: auto;
position: relative;
overflow: hidden;
display: block;
}
.mhs-search-result__media .mhs-search-result__image,
.mhs-search-result__media img,
.mhs-search-result__media .mhs-card__media-placeholder {
width: 100%;
height: 100%;
object-fit: cover;
}
.mhs-search-result__body {
flex: 1 1 auto;
display: flex;
flex-direction: column;
padding: 18px 18px 18px 0;
}
.mhs-search-result__title {
margin-top: 0;
}
.mhs-search-result__title a {
color: #4b5c63;
}
.mhs-search-result__title a:hover {
color: #e0607e;
}
.mhs-search-result__meta {
margin-top: auto;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
flex-wrap: wrap;
padding-top: 14px;
}
.mhs-search-result__meta .mhs-search-result__cats {
padding: 0;
text-align: right;
}
@media (max-width: 600px) {
.mhs-search-result {
flex-direction: column;
gap: 0;
}
.mhs-search-result__media {
flex-basis: auto;
min-height: 170px;
}
.mhs-search-result__body {
padding: 18px;
}
}