/*--------------------------------------------------------------
This is your custom stylesheet.

Add your own styles here to make theme updates easier.
To override any styles from other stylesheets, simply copy them into here and edit away.

Make sure to respect the media queries! Otherwise you may
accidentally add desktop styles to the mobile layout.
https://www.w3schools.com/css/css_rwd_mediaqueries.asp
--------------------------------------------------------------*/

html{
    background: #fafbfd;
}

/* Sidebar menu */
ul#buddypanel-menu {
    gap: 10px;
}
.bb-template-v2 .buddypanel .side-panel-menu li.menu-item>a {
border-radius: 25px;
}

/* Top search */
.bb-template-v2 .header-search-wrap .search-field-top, .bb-template-v2 .header-search-wrap input.search-field {
border-radius: 25px;
}
/* Select */
select {
    /* background: #b3b3b6; */
    background-position: right 0.5rem center;
    color: #252528;
    height: 54px!important;
    padding-top: 20px;
    padding-right: 26px;
}
 


.grid-filters.active {
    height: 47px;
}


/* Single Course */
.bb-vw-container.bb-learndash-banner::before {
    background: #102D1A;
    opacity: 0;
}
.bb-learndash-banner {
    background: url(../img/course-bg.jpeg);
    background-size: cover;
}

img.banner-img.wp-post-image {
    display: none;
}
/* User profile */
a.user-link,a.user-link::before {
	border-radius:25px;
	height:50px;
	width:100%;
	padding:0 20px;
    background: #F5F5F5!important;
    border: 1px solid #E7D5DF;
}
a.user-link:hover {
 background: #082B14!important;
}

a.user-link:hover span {
color:#ffffff!important;
}
.bb-template-v2 .site-header .user-wrap.menu-item-has-children.selected>.user-link:before, .bb-template-v2 .site-header .user-wrap.menu-item-has-children>.user-link:hover:before{
left:0!important;
}

/* Course right-sidebar stick */
.widget.bb-enroll-widget {
    border: 5px solid #ffffff;
}

/* Course Archive */
.ld-progress-stats {
    display: flex!important;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

a.view-course-custom {
    text-align: center;
    margin-top: 13px;
    background: #F2F3F2;
    padding: 14px;
    border-radius: 5px;
    color: #111111;
    font-size: 14px;
	    width: 100%;
    display: block;
}

.bb-card-course-details .bb-course-meta {
    display: none;
}
.course-progress-wrap .ld-progress-stats {
    display: none!important;
}


.help_center{
	position:relative;
	margin-top:50px;
}
.help_center:before {
    content: "";
    position: absolute;
    height: 100%;
    width: 100%;
	top:-30px;
	border-top:1px solid;
}
.grid-filters {
    display: none!important;
}
.ld-progress-stats {
    display: flex!important;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

a.view-course-custom {
    text-align: center;
    margin-top: 13px;
    background: #F2F3F2;
    padding: 14px;
    border-radius: 5px;
    color: #111111;
    font-size: 14px;
	    width: 100%;
    display: block;
}

.bb-card-course-details .bb-course-meta {
    display: none;
}
.course-progress-wrap .ld-progress-stats {
    display: none!important;
}

.bb-course-items .bb-cover-list-item.bb-course-paid {
    padding-bottom: 0;
}

.bb-card-course-details .ld-progress-bar {
    /* display: none; */
}

.custom_price{
    margin: 17px 0;
    font-size: 26px;
    font-weight: 700;
    line-height: 26px;
    letter-spacing: -0.01em;
    text-align: left;

}

.bb-cover-list-item .bb-course-cover .bb-cover-wrap .ld-status{
    /* display:none; */
}

.help_center{
	position:relative;
	margin-top:50px;
}
.help_center:before {
    content: "";
    position: absolute;
    height: 100%;
    width: 100%;
	top:-30px;
	border-top:1px solid;
}



/* Learner Dashboard */

@media(max-width:480px){
    .learner-dashboard-container h3 {
        min-height: 0;
    }
}

.learner-dashboard-recommended-header h3 , .learner-dashboard-popular-header h4{
    color: #0F0F0F;
    font-weight: 700;
    font-size: 26px!important;
}
.learner-dashboard-recommended-header h3{
padding: 12px;
}
.learner-dashboard-popular-header {
    display: flex;
    justify-content: space-between;
    margin-top: 50px;
}


.learner-dashboard{
    height: 100%;
    width:100%;
    display: flex;
    align-items: center;
    justify-content: center;
        /* padding-bottom: 100px; */
}

.learner-dashboard-container{
    height: 100%;
    width: 100%;
    /* background: #e7e6e694; */
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 2%;
}
.learner-dashboard-container h3{
    margin:0;
    font-size: 18px;
    min-height: 56px;
}
.all-course-nav svg {
    margin-bottom: -6px;
}

.course-featured-img {
    background-image: url("../img/featured.png");
    height: 150px;
    border-radius: 5px 5px 0 0;
    background-position: center !important;;
    background-size: cover !important;;
}

.learner-dashboard-container-left{
    width:70%;  
    height: 100%;
    /* background-color: rgb(204, 204, 204); */
    row-gap: 30px;
    /* display: flex;
    align-items: center;
    justify-content: space-between; */
}

@media(max-width:768px){

    .learner-dashboard-container{
        flex-direction: column;
    }
    .learner-dashboard-container-right{
        width: 100% !important;;  
    }
    .learner-dashboard-container-left{
        width:100%;  
    }

    .learner-dashboard-container h3 {
        margin: 0;
        font-size: 15px;
    }

    .learner-dashboard-recommended-header h3, .learner-dashboard-popular-header h4 {
        font-size: 17px!important;
    }
    
 
    .learner-dashboard-popular .learner-course-cards {
        display: grid;
        grid-template-columns: repeat(1,1fr);
    }


}

.learner-dashboard-container h2 {
    margin: 10px 0;
}

.learner-dashboard-recommended-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-top: 38px;
    /* margin-bottom: 30px; */
    background: white;
    padding: 20px;
    border-radius: 6px 6px 0 0;
}

.learner-dashboard-container-right{
    width:28%;  
    height: 100%;
    padding: 69px 20px 20px  20px;
    background-color: rgb(255, 255, 255);

    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 200px;
}

 .learner-dashboard-forum-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}


/* Course Cards */

.learner-course-cards{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    justify-content: space-between;
    grid-gap: 20px;
}


.learner-course-card{
 background-color: #ffffff;
 border-radius: 5px;

}

.learner-course-card-content{
    padding: 20px;
    border: 1px solid #e6e6e6 !important;
    border-radius: 0 0 6px 6px;
   }
.course-permalink  {
    color: #078D42C7;
}
.course-permalink {
    text-align: center;
    border: 1px solid #078D42C7;
    border-radius: 5px;
    padding: 5px;
}

.learner-course-card-ongoing {
    display: grid;
    grid-template-columns: 40% 60%;
    background: #F7F8F7;
    margin-bottom: 30px;
    border-radius: 10px;
}

.float.percentage {
    position: absolute;
    z-index: 99;
    right: 0;
    top: -41px;
}
.learner-course-card-ongoing .course-progress-wrap {
    position: relative;
    margin: 16px 0;
}
.learner-course-card-ongoing .ld-progress-bar {
    border-radius: 28px;
    height: 7px;
}

.learner-course-card-ongoing .ld-progress-bar .ld-progress-bar-percentage {
    background: #02B192;
    height: 7px;
    border-radius: 25px;
}

.learner-course-card-ongoing .course-featured-img {
    height: auto;
}
.learner-course-cards-ongoing {
    padding: 20px;
    background: #ffffff;
    overflow-y: auto;
    max-height: 400px;
    min-height: 200px;
    border-radius: 0 0 6px 6px;
}

.learner-dashboard-resources {
    text-align: center;
    margin-bottom: 50px;
}

.btn-bg {
    background: #1C6F3D;
    padding: 8px;
    width: 250px;
    margin: 0 auto;
    color: #ffffff;
    border-radius: 5px;
    display: block;
}
.btn-bg:hover {
color:#fff;
}

.empty-state {
    text-align: center;
    background: white;
    border-radius: 5px;
    padding: 70px 0;
}


/* Explorre courses */
.filter-tabs {
    display: flex;
    justify-content: space-between;
    align-items: center;

}
.tab-courses,.div-tabs {
    display: flex;
    gap: 20px;
    justify-content: space-between;
    align-items: center;
}
.tab-courses div.active {
    color: black;
    font-weight: 500;
    border-bottom: 2px solid orange;
}

.div-tabs div.active {
    color: black;
    font-weight: 500;
    border-bottom: 2px solid #DE4997;
}

.filter-courses {
    display: flex;
    gap: 20px;
}
.all-levels-parent ,.all-topics-parent {
    position: relative;
}
.all-levels-parent {
    position: relative;
}
span.top_title {
    position: absolute;
    left: 14px;
    top: 0px;
    font-size: 12px;
}

.notification-filter {
    margin: 23px 0;
}

.learner-explore-container .learner-course-cards {
    grid-template-columns: repeat(4, 1fr);
}


@media(max-width:480px){

    .learner-dashboard-container-right{
        margin-top: 50px;
    }
 
    .learner-course-cards {
        grid-template-columns: repeat(1, 1fr)!important;
    }

    .learner-course-card{
        width: 100%!important;
    }
    .filter-tabs {
        flex-direction: column;
        gap: 20px;
        align-items: flex-start;
    }
}

@media(min-width:481px) and (max-width:668px){
    .learner-explore-container .learner-course-cards {
        grid-template-columns: repeat(2, 1fr)!important;
    }
    .filter-tabs {
        flex-direction: column;
        gap: 20px;
        align-items: flex-start;
    }

    .learner-course-cards{
        grid-template-columns: repeat(2,1fr)!important;
    }
}

@media(min-width:669px) and (max-width:900px){
    .learner-explore-container .learner-course-cards {
        grid-template-columns: repeat(3, 1fr);
    }
    .learner-course-cards{
        grid-template-columns: repeat(3,1fr)!important;
    }
    
}

.tab-courses div , .div-tabs div{
    cursor: pointer;
}

span#topics, span#course_type {
    font-weight: 600;
    color: black;
}

.ld-item-list-item-preview {
    background: #F4F5F5!important;
    border: 1px solid #d7d7d7;
}
.learndash-wrapper .ld-item-list .ld-item-list-item{
    margin:5px 0!important;
}
.ld-item-list-item-preview { background: #F4F5F5!important; }


.learner-onboarding-header-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    border-bottom: 1px solid #80808017;
}

.learner-onboarding {
    display: flex;
    align-items: center;
    justify-content: center;
}
.learner-onboarding-container {
    padding: 50px 0px;
    width: 467px;
}

@media(max-width:480px){
    .learner-onboarding-container {
        width: auto;
        padding: 20px;
    }
    
}

.user-fields-section p ,.user-fields-section h2{
    margin: 0;
}
.user-fields-section .heading{
    padding: 20px 0;
}

.userfield,.userfield div {
    display: flex;
    flex-direction: column;
    background: #F4F5F5;
    padding: 3px 5px;
    border-radius: 10px;
}
.userfield {
    margin-bottom: 15px;
}

.userfield input , .userfield div input {
    background: #F4F5F5;
    border: 0;
    height: 25px;
}

.userfield label {
    padding: 10px 12px;
    color: #302c2f;
    margin: -8px 0;
    font-size: 15px;
}


.user-fields-section input[type="submit"]:hover ,
.user-fields-section input[type="button"]:hover {
    background: #028D74;
    color :white;
}

.user-fields-section input[type="submit"] ,
.user-fields-section input[type="button"] {
    background: #02B192;
    border: 0;
    width: 100%;
    height: 55px;
    margin-top: 26px;
    border-radius: 7px !important;
}

/* .user-fields-section input[type="submit"]:hover{
    background: #04b796;
} */

.userfield svg {
    position: absolute;
    right: 11px;
    top: 37px;
}
.userfield{
    position: relative;
}

.heading p {
    /* font-weight: 800; */
    margin-top: 10px;
}

.userfieldradio, .userfieldcheckbox {
    border-radius: 5px;
    border: 1px solid #eef0f3;
    padding: 20px 10px;
    margin-bottom: 10px;
    display: flex;
    gap: 10px;
    align-items: center;
position: relative;
}


input[type="radio"] {
    height: 20px;
    width: 20px;
}
input[type="radio"]:checked {
    border: 7px solid #019e7c;
    appearance: none;
    height: 20px;
    width: 20px!important;
    border-radius: 25px;
    /* background: #019e7c; */
    outline: 0;
}

.userfieldcheckbox {
    padding: 10px;
    margin: 0px;
}

.userfieldradio label {

    position: absolute;
    left: 37px;
    line-height: 22px;
}

.userfields .flex-wrap {
    display: flex;
    gap: 20px;
    align-items: center;
    margin-top: 10px;
}


.userfieldcheckbox  input[type="checkbox"]::before ,.userfieldradio input[type="radio"]::before {
    width: 100%;
    height: 100%;
    /* background: #ff000017; */
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9999;
}

.userfieldradio input[type="radio"]:checked::before,
.userfieldcheckbox  input[type="checkbox"]:checked::before {
    /* background: #EDFCF8; */
    border: 1px solid #019e7c80;
}

.userfieldcheckbox  input[type=checkbox] {
    width: 18px;
    height: 18px;
    appearance: none;
    /* position: relative; */
}

.userfieldcheckbox  input[type="checkbox"]:checked {
background: #019e7c;
}
.userfieldcheckbox  input[type="checkbox"]:checked::after {
    position: absolute;
    top: 19px;
    left: 14px;
    border-right: 3px solid #fff;
    border-bottom: 3px solid #fff;
    width: 9px;
    height: 10px;
    z-index: 99999;
    content: "";
    transform: rotate(45deg);
}

.error_field {
    color: red;
    font-size: 15px;
}

div.previous {
    margin-top: 20px;
}
div.previous:hover {
cursor: pointer;}

a.btn-advance.ld-primary-background,a.btn-advance.ld-primary-background:hover {
    background: #02B192;
    border: 0!important;
    border-radius: 12px;
    color: #FAFAFA;
    padding: 16px;
}

 
svg#password_error rect {
    fill: red;
    color: red;
}

.password_error rect{
    fill: #02B192!important;
    color: #02B192!important;
}
body, html {
    /* font-family: 'Work Sans'!important; */
}



input#btn-join {
    background: #02b192!important;
    border: 0 solid red!important;
    border-bottom: 0 solid red!important;
    color: #FAFAFA!important;
    border-radius: 13px !important;
    padding: 12px!important;
    font-weight: 500!important;
    font-size: 20px;
    font-family: 'Work Sans';
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.ld-status.ld-status-incomplete.ld-third-background {
    background: white!important;
    color: #122b46 !important;
}

#btn-join, .bb-single-course-sidebar #btn-join, .bb-single-course-sidebar .btn-join, .bb-single-course-sidebar a.btn-advance, .btn-join, .learndash-wrapper a.button:not(.outline) {
    border-bottom: 0 solid red!important;
    font-family: 'Work Sans';
    font-size: 20px;
    height: 64px;
}
.bb-single-course-sidebar a.btn-advance{
    font-size: 20px!important;
    font-weight: 500!important;
    height: 64px;

}

.bb-single-course-sidebar .bb-course-status-wrap .bb-course-status-content .ld-status {
    background-color:transparent!important;
    background:transparent!important;
    
    color: #2C302F!important;
    border-radius: 13px !important;
    padding: 12px!important;
    font-weight: 500!important;
    font-size: 20px!important;
    font-family: 'Work Sans';
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
}

span.bb-course-type.bb-course-type-paynow{
    color: #2C302F!important;
    font-weight: 500!important;
    font-size: 20px!important;
    font-family: 'Work Sans';
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 13px !important;
    /* background: #f5f5f5; */
    width: 100%;
}


span.ld-status {
    background-color: transparent !important;
    margin: 0;
    display: flex !important;
    align-items: center;
    justify-content: center;
}
a.ld-login-text{
    border-radius: 13px !important;
    padding: 12px!important;
    font-weight: 500!important;
    font-size: 20px!important;
    font-family: 'Work Sans';
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lms-topic-sidebar-wrapper {
    display: none;
}

/* My account page  */

.my-account {
    display: flex;
    justify-content: center;
}

.my-account-container {
    width: 500px;
    padding-top: 50px;

}
.my-account-container > div{
    background: #ffffff;
    margin-bottom: 40px;
    padding: 20px;


}

.profile-section {
}
.my-account-container h6{
    margin: 0 0 10px 0;
    color: #919eab;
    font-size: 13px;
}

.change-password-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.change-password-section .heading {
    display: flex;
    align-items: center;
    gap: 10px;
}

.change-password-section .heading span{
    color : #101211
}

.rotate{
    transform: rotate(90deg);
}

.my-account-container .userfields{
    margin-top: -40px;

}

.profile-section .avarta {
    height: 60px;
    width: 60px;
    background: #F49F0A;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 125px;
    font-weight: bolder;
    font-size: 28px;

}
.email-name {
    margin-top: 20px;
}
.email-name {
    margin-top: 20px;
    color: #101211;
}

.bb-template-v2 .buddypanel .side-panel-menu li.current-menu-item>a,
.bb-template-v2 .buddypanel .side-panel-menu li:not(.current-menu-item) a:hover{
    background-color: #0A3318!important;
    color: var(--bb-sidenav-text-active);
}
.lesson-count-label,.float.percentage {
    color: black;
}

input#btn-join {
    padding: 18px!important;
}


/* Google Login*/

div.nsl-container.nsl-container-block .nsl-container-buttons {
    width: 100%;
}

.nsl-button.nsl-button-default.nsl-button-google {
    height: 68px;
    box-shadow: none !important;
    border: 1px solid #ddd;
    align-items: center;
    justify-content: center;
    border-radius: 6px!important;
}


div.nsl-container .nsl-button-default div.nsl-button-label-container{
    
    flex:none!important;
   
}


.noty_theme__learndash.noty_bar .noty_body .message {
    border-radius: 5px;
    background: #02b192;
    padding-bottom: 0;
    margin-bottom: 0;
    color: #ffffff!important;
    padding: 0!important;
  
}


.noty_bar .text .title {
    font-size: 18px;
    font-weight: 400;
    margin-bottom: 10px;
    color: white;
}

.noty_theme__learndash.noty_bar {

    border-radius: 2px;

    border-radius: 10px;
    background: #02b192 !important;
    box-shadow: none!important;
}

.badges-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #11111114;
    padding: 10px 20px;
    margin-bottom: 10px;
    border-radius: 4px;
}
@media(max-width:480px){
    .badges-card {
        flex-direction: column;
        align-items: start;
        gap: 12px;
    }
}

.badges-card>div {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
.badge-heading-top {
    font-weight: 600;
    color: black;
}
.badge-heading-bottom {
    font-weight: 300;
    color: #2C302F;
}
.badges-wrapper {
    margin-top: -40px;
    padding: 0 20px 20px !important;
}

.profile-section .badges-wrapper {
    margin-top: 10px;
    padding: 0!important;
}
.profile-section .badge-heading-bottom {
    display: none;
}
.profile-section .badges-card {
    padding: 10px 0;
    border: 0;
    justify-content: flex-start;
    gap: 10px;
}
.profile-section .badges-card>div {
    border: 1px solid #1111111F;
    padding: 5px 17px;
    border-radius: 4px;
    height: 54px;
}

a.all-course-nav {
    color: #2C302F;
    width: 125px;
    text-align: right;
}

.class-card {
    background: #F1F3F2;
    font-size: 16px;
    padding: 15px;
    border-radius: 6px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}
@media(max-width:480px){

    .class-card {
        flex-direction: column;
        gap:20px;
    }
    .class-host, .class-course {
        font-size: 12px;
    }
    .class-topic {
        font-size: 18px;
    }
}

.the-date div {
    color: #2C302F;
}

a.rsvp {
    background: #11111114;
    font-size: 18px;
    color: #2C302F;
    border-radius: 6px;
    padding: 5px 10px;
}

.the-date {
    padding: 5px;
    font-size: 14px;
    background: #F7AF31;
    width: 72px;
    text-align: center;
    border-radius: 6px;
}

.the-date div {
    font-size: 20px;
    line-height: 12px;
}
.class-topic {
    font-size: 20px;
    color: #101211;
}

input[name="class-switch"]::before {
    content: "";
    /* background: red; */
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

div.class-switch {
    padding: 30px 0 ;
}
.class-switch label {
    color: #11111147;
}
.class-switch-type.active label {
    color: #2C302F;
}

h3.the-course-title {
    min-height: 56px;
}



@media(max-width:480px){
    p.no-live {
    display: flex;
}
}


.course-permalink a {
    width: 100%;
    display: block;
}

.learner-dashboard-container-left .learner-dashboard-popular {
    margin-bottom: 38px;
}