body {
    font-family: "Segoe UI" , Helvetica !important;
    width: 100%;
    height: auto;
    line-height: 1.2;
    font-size: 20px;
    background: var(--unnamed-color-ffffff) 0% 0% no-repeat padding-box;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    opacity: 1;
}

*, :after, :before {
    box-sizing: border-box;
}
html{
    overflow-x:hidden;
}


.SegoeUI {
    font-family: "Segoe UI" , Helvetica !important;
}
.SegoeUI_Normal {
    font-family: "Segoe UI" , Helvetica !important;
    font-weight: normal !important;
}

.SegoeUIBold {
    font-family: "Segoe UI" , Helvetica !important;
    font-weight: bold !important;
}

.LineHT_1_5{
    line-height: 1.5;
}
.relChild5 > div {
    position: relative;
    margin-bottom: 5px;
}

.relChild10 > div {
    position: relative;
    margin-bottom: 10px;
}

.relChild15 > div {
    position: relative;
    margin-bottom: 15px;
}

.relChild20 > div {
    position: relative;
    margin-bottom: 20px;
}

.relChild25 > div {
    position: relative;
    margin-bottom: 25px;
}

.relChild30 > div {
    position: relative;
    margin-bottom: 30px;
}

.fontSize8 {
    font-size: 8px;
}

.fontSize10 {
    font-size: 10px;
}

.fontSize12 {
    font-size: 12px;
}

.fontSize14 {
    font-size: 14px;
}

.fontSize16 {
    font-size: 16px;
}

.fontSize18 {
    font-size: 18px;
}

.fontSize20 {
    font-size: 20px;
}

.fontSize22 {
    font-size: 22px !important;
}

.fontSize24 {
    font-size: 24px;
}

.fontSize26 {
    font-size: 26px !important;
}

.fontSize28 {
    font-size: 28px;
}

.fontSize30 {
    font-size: 30px !important;
}

.fontSize32 {
    font-size: 32px;
}

.fontSize34 {
    font-size: 34px;
}

.fontSize36 {
    font-size: 36px;
}

.fontSize38 {
    font-size: 38px;
}

.fontSize40 {
    font-size: 40px;
}

.fontSize46 {
    font-size: 46px;
}

.fontSize50 {
    font-size: 50px;
}

.hide {
    display: none;
}

.clear {
    clear: both;
}

.flexContainer {
    display: flex;
}

.VCenter {
    align-items: center;
}

.VTop {
    align-items: flex-start;
}

.AlignRight {
    text-align: right;
}

.AlignLeft {
    text-align: left;
}

.VHCenter {
    justify-content: center;
    align-items: center;
}

.HEnd {
    justify-content: flex-end
}

.HStart {
    justify-content: flex-start
}

.WH100 {
    width: 100%;
    height: 100%;
}

.paddingLR0 {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.paddingL25 {
    padding-left: 25px !important;
}

.paddingR25 {
    padding-right: 25px !important;
}

.paddingB30 {
    padding-bottom: 30px;
}

.paddingB15 {
    padding-bottom: 15px;
}

.paddingT30 {
    padding-top: 25px;
}

.paddingT6 {
    padding-top: 6px;
}





.paddingTB5 {
    padding: 5px 0px;
}

.paddingL10 {
    padding-left: 10px;
}

.paddingR10 {
    padding-right: 10px;
}

.paddingB10 {
    padding-bottom: 10px;
}

.paddingB20 {
    padding-bottom: 20px;
}

.paddingB50 {
    padding-bottom: 50px;
}

.paddingT10 {
    padding-top: 10px;
}

.paddingT5 {
    padding-top: 5px;
}

.paddingT7 {
    padding-top: 7px;
}

.paddingT15 {
    padding-top: 15px;
}

.paddingL5 {
    padding-Left: 5px !important;
}

.paddingR5 {
    padding-right: 5px !important;
}

.paddingB5 {
    padding-bottom: 5px;
}

.paddingL20 {
    padding-Left: 20px;
}

.paddingL15 {
    padding-left: 15px;
}

.paddingL30 {
    padding-Left: 30px;
}

.paddingR15 {
    padding-right: 15px;
}

.paddingR30 {
    padding-right: 30px;
}

.paddingT30 {
    padding-top: 30px;
}

.paddingL45 {
    padding-Left: 50px;
}

.paddingL50 {
    padding-Left: 50px;
}

.paddingR50 {
    padding-right: 50px;
}

.paddingT50 {
    padding-top: 50px;
}

.paddingL100 {
    padding-Left: 100px;
}

.paddingT150 {
    padding-top: 150px;
}


.paddingContainer {
    /*padding: 3%;*/
    padding: 15px 15px 0px 15px;
}





.marginL20 {
    margin-left: 20px;
}

.marginL40 {
    margin-left: 40px;
}

.marginL15 {
    margin-left: 15px;
}

.marginR15 {
    margin-right: 15px;
}

.marginR5 {
    margin-right: 5px;
}

.marginT0 {
    margin-top: 10px;
}

.marginL0 {
    margin-left: 10px;
}

.marginT10 {
    margin-top: 10px;
}

.marginT15 {
    margin-top: 15px;
}

.marginT20 {
    margin-top: 20px;
}

.marginT25 {
    margin-top: 25px;
}

.marginT27 {
    margin-top: 27px;
}


.marginT80 {
    margin-top: 80px;
}

.marginT40 {
    margin-top: 40px;
}

.marginT30 {
    margin-top: 30px;
}

.marginL30 {
    margin-left: 30px;
}

.marginT50 {
    margin-top: 50px;
}

.marginT60 {
    margin-top: 60px;
}
.MmarginT60 {
    margin-top: 60px;
}

.marginT120 {
    margin-top: 120px;
}
 
.marginB10 {
    margin-bottom: 10px;
}

.marginB15 {
    margin-bottom: 10px;
}

.marginB20 {
    margin-bottom: 20px;
}

 

.pinkBG {
    background: #F8D9D9 0% 0% no-repeat padding-box;
}

.whiteBGBG {
    background: #FFF;
}

.pointer {
    cursor: pointer;
}

.default {
    cursor: pointer;
}

.mainHeading50 {
    font-size: clamp(1rem, 0.0893rem + 5.0595vw, 3.125rem);
}

.MaintextColor1 {
    color: rgba(255,255,255,1);
}

.MaintextColor2 {
    color: rgba(255,255,255,0.5);
}

.MaintextColor3 {
    color: #F04943 !important;
}

.MaintextColor4 {
    color: #2B3468 !important;
}

.MaintextColor5 {
    color: #CCCCCC !important;
}

.MaintextColor6 {
    color: #FFFFFF !important;
}

.MaintextColor7 {
    color: #999999 !important;
}

.MaintextColor8 {
    color: #000000 !important;
}

.MaintextColor666 {
    color: #666666 !important;
}

.MaintextColor70 {
    color: #707070 !important;
}

.MaintextColor10 {
    color: #273368 !important;
}


.color_#EFF5F7 {
    color: #EFF5F7 !important;
}

.color_#EFF5F7 {
    color: #EFF5F8 !important;
}
/*.paraText46{font-size: clamp(1.438rem, 0.3602rem + 4.7900vw, 2.875rem) !important;}   
.paraText50{font-size: clamp(0.938rem, -1.5614rem + 3.9054vw, 3.125rem)}   
.paraText40{font-size: clamp(1.25rem, 0.3125rem + 4.1667vw, 2.5rem) !important;}   
.paraText30{font-size: clamp(0.938rem, 0.2352rem + 3.1233vw, 1.875rem) !important;}
.paraText20{font-size: clamp(0.75rem, 0.3750rem + 1.6667vw, 1.25rem) !important;}
.paraText19{font-size: clamp(0.75rem, 0.4215rem + 1.4600vw, 1.188rem) !important;}
.paraText18{font-size: clamp(0.75rem, 0.4688rem + 1.2500vw, 1.125rem) !important;}
.paraText14{font-size: clamp(0.75rem, 0.6563rem + 0.4167vw, 0.875rem) !important;}
.paraText10{font-size: clamp(0.625rem, 0.6250rem + 0.0000vw, 0.625rem) !important;}*/
.paraText150 {
    font-size: clamp(5rem, 0.3138rem + 7.3222vw, 9.375rem) !important;
}

.paraText46 {
    font-size: clamp(1.438rem, -0.2043rem + 2.5661vw, 2.875rem) !important;
}

.paraText40 {
    font-size: clamp(1.25rem, -0.1786rem + 2.2321vw, 2.5rem) !important;
}

.paraText30 {
    font-size: clamp(0.938rem, -0.1329rem + 1.6732vw, 1.875rem) !important;
}

.paraText20 {
    font-size: clamp(0.75rem, 0.1786rem + 0.8929vw, 1.25rem) !important;
}

.paraText24 {
    font-size: clamp(0.75rem, -0.1071rem + 1.3393vw, 1.5rem) !important;
}

.paraText19 {
    font-size: clamp(0.75rem, 0.2494rem + 0.7821vw, 1.188rem) !important;
}

.paraText18 {
    font-size: clamp(0.75rem, 0.3214rem + 0.6696vw, 1.125rem) !important;
}

.paraText14 {
    font-size: clamp(0.75rem, 0.6066rem + 0.2241vw, 0.8755rem) !important;
}

.paraText10 {
    font-size: clamp(0.625rem, 0.6244rem + 0.0009vw, 0.6255rem) !important;
}

.paraTextsmall {
    font-size: clamp(0.55rem, 0.55rem + 0.0004vw, 0.1rem) !important;
}

.paraText12 {
    font-size: clamp(0.75rem, 0.7500rem + 0.0000vw, 0.75rem) !important;
}

.paraText45To55 {
    font-size: clamp(2.813rem, 2.0987rem + 1.1161vw, 3.438rem) !important;
}


.padding80 {
    padding: 3% !important;
}

.OverflowA {
    overflow: auto;
}

.buttonradius {
    border-radius: 25px;
}



#mainLayoutNew {
    position: relative;
    width: 100%;
    height: 100%;
    background-color: #FAFAFB;
}

#templateContainer {
    position: relative;
    width: 100%;
    height: auto;
    /* margin-top: 160px;*/
}

#templateContainerType1 {
    position: relative;
    width: 100%;
    height: auto;
    margin-top: 60px;
}

@media screen and (max-width: 767px) {
    .mbMenu {
        width: 45px;
        height: 45px;
        background-color: indianred;
        padding: 0.455rem 0.75rem;
        line-height: 1.3;
    }
}

#topBar {
    position: fixed;
    width: 100%;
    height: 60px;
    top: 0px;
    left: 0px;
    background-color: #fff;
    z-index: 11;
    box-shadow: 0px 0px 0px #00000029;
    border-bottom: 1px solid #eee;
    border-bottom: 1px solid #eee;
}

#topBar.removeBorder {
    border-bottom: 0px solid #eee;
}
#topBar.LearnerTopBar {
    position: fixed;
    width: 100%;
    height: 60px;
    top: 0px;
    left: 0px;
    background-color: #fff;
    z-index: 11;
    box-shadow: 0px 0px 0px #00000029;
}
    #topBar.loginTopbar {
        box-shadow: 1px 3px 6px #00000029;
        border-bottom: 0px solid #eee;
    }
    #topBar.TopbarLayout1 {
        box-shadow: 1px 3px 6px #00000029;
    }
    #topBar.TopbarLayout3 {
      /*  box-shadow: 1px 3px 6px #00000029;*/
    }
        #topBar.TopbarLayout3.yesSubbarBrd {
            box-shadow: 1px 3px 6px #00000029;
        }
.topbarBtmBrd {
    border: 0px solid #ccc;
    width: 100%;
    position: absolute;
    bottom: 0;
    width: 100%;
    
}
#topBar_1 {
    position: fixed;
    width: 100%;
    min-height: 60px;
    top: 60px;
    left: 0px;
    background-color: #fff;
    z-index: 11;
    z-index: 5; /**  11 to 5  19 feb*/
    box-shadow: 1px 3px 6px #00000029;
}
.forLogoCls {
    width: 100%;
    height: 60px;
    justify-content: space-between;
    gap: 20px;
}
.top-bar-inner {
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
}

#SubBar {
    position: relative;
    width: 100%;
    height: 80px;
    top: 60px;
    left: 0px;
    background-color: #fff;
    z-index: 1;
    /*box-shadow: 0px 3px 6px #00000029;*/
    box-shadow: 0px 0px 0px #00000029;
    opacity: 1;
    border-top: 0px solid #ccc;
    border-bottom: 0px solid #ccc;
}
    #SubBar.LearnerSubBar {
        position: fixed;
        width: 100%;
        max-width:100%;
        height: 60px;
        top: 60px;
        left: 0px;
        background-color: #fff;
        z-index: 2;
        z-index: 11;
        /*box-shadow: 0px 3px 6px #00000029;*/
        box-shadow: 0px 0px 0px #00000029;
        opacity: 1;
        border-top: 0px solid #ccc;
        border-bottom: 0px solid #ccc;
        box-shadow: 1px 3px 6px #00000029;
        left: 50%;
        transform: translateX(-50%);
    }
#SubBar_1 {
    position: relative;
    width: 100%;
    height: 60px;
    top: 0px;
    left: 0px;
    background-color: #fff;
    z-index: 1;
    /*box-shadow: 0px 3px 6px #00000029;*/
    box-shadow: 0px 0px 0px #00000029;
    opacity: 1;
    border-top: 0px solid #ccc;
    border-bottom: 0px solid #ccc;
}
#SubBar_1 {
    position: absolute!important;
    width: 70%;
    height:100%;
    left: 0;
    right: 0;
}
    #SubBar_1.InsideTopBar_W70 {
        position: absolute !important;
        width: 70%;
        height: 100%;
        left: 0;
        right: 0;
    }
    #SubBar_1.InsideTopBar_1_W100 {
        position: absolute !important;
        width: 100%;
        height: 100%; 
    }
/*#topBar.NobrdShadow {
    height: auto !important;
    position: fixed !important;
    box-shadow: 0px 0px 0px #00000029 !important;
}
    #SubBar.brdShadow {
        position: fixed !important;
        box-shadow: 1px 3px 6px #00000029;
    }
.topBTMBorder {
    width: 100%;
    height: 1px;
    margin: 0px 15px;
    border-bottom: 1px solid #CCCCCC;
}
    .emptyDiv1{
    position:relative;height:80px;
    }
*/
/*
#topBar.HT_auto {
    height: auto;
}

.topBTMBorder {
    width: 100%;
    height: 1px;
    margin: 0px 15px;
    border-bottom: 1px solid #CCCCCC;
}

.HT_auto {
    height: auto !important;
}

#SubBar.insideTopBar {
    top: 0 !important;
}
*/
@media screen and (max-width: 767px) {
    #SubBar {
        padding-top: 5px;
    }
}

.assignmentsCls {
    position: relative;
    height: 100%;
    display: flex;
    align-items: center;
}

.title.myWorkPlace {
    position: relative;
    width: 100%;
    padding: 0px 5px 0px 15px;
    display: flex;
    flex-direction: row;
}
    .title.myWorkPlace .topBarTitle {
  
    }

    .title.myWorkPlace a {
        text-decoration: none;
    }

@media only screen and (max-width: 767px) {
    .assignmentsCls {
        position: relative;
        height: 30px;
        display: flex;
        align-items: center;
        padding-left: 0px;
    }

    #SubBar .MpaddingL15 {
        padding-left: 0px;
    }

    #SubBar.assignmentsSubBar {
        min-height: 80px;
        height: auto;
        padding-bottom: 10px;
    }
}

@media screen and (max-width: 991px) and (min-width: 768px) {
    .assignmentsCls {
        position: relative;
        height: 30px;
        display: flex;
        align-items: center;
        padding-left: 0px;
    }

    #SubBar.assignmentsSubBar {
        min-height: 80px;
        padding-bottom: 0px;
    }
}

.SubMenuItem {
    text-align: center;
    width: 100%;
}

    .SubMenuItem > a {
        text-decoration: none !important;
        color: #CCCCCC;
    }

        .SubMenuItem > a:hover {
            color: #F04943;
        }

    .clsMTTopMenu.MaintextColor3.BoldTxt::after {
    content: "";
    position: absolute;
    border-top: 4px solid #F04943;
    box-shadow: 0px 3px 6px #00000029;
    width: 100%;
    height: 4px;
    bottom: 0px;
    left: 0px;
}
/*
#SubBar .clsMTTopMenu.MaintextColor3.BoldTxt::after {
    bottom: -1px;
}
#SubBar_1 .clsMTTopMenu.MaintextColor3.BoldTxt::after {
    bottom: -1px;
}*/
@media only screen and (max-width:767px) {
    .clsMTTopMenu.MaintextColor3.BoldTxt::after {
        width: auto;
    }
}

.SubMenuItem:hover::after {
    content: "";
    position: absolute;
    border-top: 4px solid #F04943;
    box-shadow: 0px 3px 6px #00000029;
    width: 100%;
    height: 4px;
    bottom: 0px;
    left: 0px;
}

.LPO  .SubMenuItem:hover::after {
    width: 100%;
}


/*
#SubBar .SubMenuItem:hover::after {
    bottom: -1px;
}
#SubBar_1 .SubMenuItem:hover::after {
    bottom: -1px;
}*/

.clsMTTopMenu:after {
    border-bottom: 0px solid green;
}

.clsMTTopMenu:before {
    border-bottom: 2px solid blue;
}

.topBarTitle {
    font: normal normal normal 20px/27px "Segoe UI", Helvetica;
    letter-spacing: 0px;
    color: #333333;
}

.topBarLeftMenu {
    position: relative;
    /*width: 100%;*/
    /*padding: 0px 25px;*/
    padding: 0px 5px 0px 15px;
    display: flex;
    flex-direction: row;
    width:40%!important;
}

.topBarRightMenu {
    position: relative;
    /* width: 100%;*/
    width: auto;
    padding: 0px 15px 0px 0px;
    /* padding: 0px 20px;*/
    display: flex;
    flex-direction: row-reverse;
    width: 40% !important;
}
#topBar.container-fluid{
    overflow-y:hidden!important;
}
/*
.topBarLeftMenu {
    position: relative;
    width: 100%; 
    padding: 0px 10px;
    display: flex;
    flex-direction: row;
}

.topBarRightMenu {
    position: relative;
    width: 100%;
    padding: 0px 20px;
    display: flex;
    flex-direction: row-reverse;
}*/
.topBarLeftMenu > div {
    margin-right: 15px;
}

.btnMenu {
    cursor: pointer;
}

.cursorDefault {
    cursor: default !important;
}

.btnSignIn {
    width: 140px;
    line-height: 1.5;
    background: #FDE3D8 0% 0% no-repeat padding-box;
    border-radius: 1.25rem;
    opacity: 1;
    padding: 0.455rem 0.75rem;
    text-align: center;
    cursor: pointer;
    line-height: 1.3;
}
    /*
.btnSignIn {
    width: 140px;
    height: 40px;
    background: #FDE3D8 0% 0% no-repeat padding-box;
    border-radius: 20px;
    opacity: 1;
    padding-top: 10px;
    text-align: center;
    cursor: pointer;
    line-height: 1.3;
}
*/
    .btnSignIn:hover {
        outline: 1px solid #F04943;
    }


.btnGenerateReport {
    /* width: 150px;
     height: 40px;*/
    padding: 0.475rem 1.95rem;
    border-radius: 1.25rem;
    background: #FDE3D8 0% 0% no-repeat padding-box;
    border-radius: 20px;
    opacity: 1;
    /*  padding-top: 10px;*/
    text-align: center;
    cursor: pointer;
    line-height: 1.5;
}

    .btnGenerateReport:hover {
        outline: 1px solid #F04943;
    }

.btnLangSelction {
    width: 80px;
    height: 40px;
    background: #FDE3D8 0% 0% no-repeat padding-box;
    border-radius: 20px;
    opacity: 1;
    padding-top: 8px;
    text-align: center;
}

    .btnLangSelction:hover {
        outline: 1px solid #F04943;
    }

    .btnLangSelction span {
        margin-left: 10px;
    }

.BackGroundSheen {
    position: absolute;
    display: flex;
    width: 100%;
    height: 100vh;
    left: 0px;
    top: 0px;
    background: #00000040 0% 0% no-repeat padding-box;
    z-index: 1;
}

.bannerImg {
    position: absolute;
    display: flex;
    width: 100%;
    height: 100vh;
    left: 0px;
    top: 0px;
    background-image: url(/Images/Generic/LoginPage.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom center;
}

.contentAtLaunch {
    padding: 0 15px 0 15px;
}

.ContactUsBg {
    position: absolute;
    display: flex;
    width: 100%;
    height: 1030px;
    left: 0px;
    top: 0px;
    background-image: url(/Images/Generic/ContactUsBg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 0px 0px;
}



/**** 15-2-2023 ****/

.ContactUsBg {
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}

.ContactUsBg {
    background-position: bottom center;
    min-height: auto !important;
}

.ContactUsText {
    height: auto;
}

._Template_minHT.ContactUs {
    min-height: auto !important;
}



/**********8*/
.cursorPointer {
    cursor: pointer;
}

.bannerText {
    position: relative;
    width: 100%;
    height: auto;
    left: 0px;
    top: 0px;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    padding: 50px 35% 50px 35%;
}

    .bannerText.createAcc {
        padding: 50px 30% 50px 30%;
    }

.ContactUsText {
    position: relative;
    width: 40%;
    height: 1015px;
    left: 0px;
    top: 0px;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    margin-left: 30%;
    padding: 3% 6% 3% 6%;
    background: #AE191B 0% 0% no-repeat padding-box;
    opacity: 0.8;
}

.changePasswordCls {
    margin-top: 60px;
}

    .changePasswordCls .errorSpan {
        margin-left: 0px !important;
    }

    .changePasswordCls #EmailAddress-error, .changePasswordCls #Password-error {
        margin-left: 0px !important;
    }


#adminroot .changePasswordCls {
    margin-top: 0px;
}

.ForgotPasswordDiv {
    position: relative;
    width: 100%;
    height: 85vh;
    left: 0px;
    top: 0px;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    /*padding: 7% 40% 1% 40%;*/
    padding: 7% 35% 1% 35%;
}

.ForgotPasswordImg {
    position: absolute;
    display: flex;
    width: 100%;
    height: 100vh;
    left: 0px;
    top: 0px;
    background-image: url(/Images/Generic/forgotPassword.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 0px 0px;
}

#adminroot .ForgotPasswordImg {
    top: 0px;
}

.bannerText > span {
    font-size: 24px;
}

.bannerInfo {
    position: relative;
    width: 100%;
    height: auto;
    text-align: center;
    padding: 3% 20%;
    color: #fff;
    background-color: #AE191B;
}


/**************************************logn updates         */

/**************************************logn updates         */

.btnReadMore {
    position: relative;
    width: 160px;
    height: 50px;
    /* top: 57%;
        left: 14%;*/
    left: 83px;
    /* margin: auto;*/
    background-color: #FDE3D8;
    margin-top: 25px;
    padding-top: 10px;
    background-size: contain;
    text-align: center;
    letter-spacing: 0px;
    color: #F04943;
    font-size: 18px;
    opacity: 1;
    border-radius: 30px;
}
.noLeft.btnReadMore {
    position: relative;
    width: 160px;
    height: 50px;
    margin: 0 auto;
    left: 0px;
    /* margin: auto;*/
    background-color: #FDE3D8;
    margin-top: 25px;
    padding-top: 10px;
    background-size: contain;
    text-align: center;
    letter-spacing: 0px;
    color: #F04943;
    font-size: 18px;
    opacity: 1;
    border-radius: 30px;
    line-height: 30px;
}
._titleCls0 {
    width: 100%;
    height:20px;
    position: relative;
    text-align: center
}
._titleCls1 {
    width: 100%;
    position: relative;
    text-align: center;
    padding: 20px 40px;
}
._titleCls2 {
    width: 100%;
    position: relative;
    text-align: center;
}
._titleCls3 {
    width: 100%;
    position: relative;
    text-align: center;
}
._titleCls4 {
    width: 100%;
    position: relative;
    text-align: center;
    margin: 0 auto;
    left: 0px;
}
.btnReadMore:hover {
    cursor: pointer;
    transform: scale(1.2);
}

.btnRemove {
    position: absolute;
    width: 160px;
    height: 50px;
    top: 57%;
    left: 14%;
    margin: auto;
    background-color: #FDE3D8;
    margin-top: 25px;
    padding-top: 10px;
    background-size: contain;
    text-align: center;
    letter-spacing: 0px;
    color: #F04943;
    font-size: 18px;
    opacity: 1;
    border-radius: 30px;
}

    .btnRemove:hover {
        cursor: pointer;
        transform: scale(1.2);
    }

.caption {
    position: relative;
    margin: 20px 0px;
}

    .caption > .captionHeading {
        position: relative;
        color: #AE191B;
    }

    .caption > .captionText {
    }


.ImageCaptionText {
    position: absolute;
    top: 0%;
    width: 100%;
    height: 250px;
    padding: 20px;
    line-height: 1.1;
}

.BigImageCaptionText {
    position: relative;
    top: 0%;
    width: 100%;
    height: auto;
    /*padding: 15%;
    padding-top: 25%;*/
    padding: 55px 83px 30px 83px;
    line-height: 1.1;
    text-align:left;
}

.BigIconAndInfoTest {
    position: relative;
    top: 45%;
    /* left: 10%;*/
    left: 63px;
    width: 100%;
    height: 70px;
    padding-left: 90px;
    padding-top: 10px;
    color: #ffffff;
    line-height: 1.1;
}

.IconAndInfoTest {
    position: absolute;
    bottom: 3%;
    width: 100%;
    height: 70px;
    padding-left: 90px;
    padding-top: 10px;
    color: #ffffff;
    line-height: 1.1;
}

.blackColor {
    color: #000000;
}

.singleline {
    padding-top: 20px;
}

.VideoIcon {
    background-image: url("/Images/Generic/Group 3161.svg");
    background-repeat: no-repeat;
    background-position: 20px 0px;
}

.ArticleIcon {
    background-image: url("/Images/Generic/Group 3158.svg");
    background-repeat: no-repeat;
    background-position: 20px 0px;
}

.NewLetterIcon {
    background-image: url("/Images/Generic/Group 3160.svg");
    background-repeat: no-repeat;
    background-position: 20px 0px;
}

.WebinarVideoIcon {
    background-image: url("/Images/Generic/Group 3159.svg");
    background-repeat: no-repeat;
    background-position: 20px 0px;
}

.DocumentIcon {
    background-image: url("/Images/Generic/Group 3162.svg");
    background-repeat: no-repeat;
    background-position: 20px 0px;
}

/* Fixed sidenav, full height */



.BoldTxt {
    font-weight: bold;
}

.MenuTitle1 {
    width: 100%;
    height: 50px;
    background-color: #333333;
    text-align: left;
    padding-left: 25px;
    border: solid 0px #CCCCCC;
    border-bottom: solid 1px #CCCCCC;
}

.MenuTitle2 {
    width: 100%;
    height: 50px;
    background-color: #333333;
    text-align: left;
    padding-left: 25px;
    border: solid 0px #CCCCCC;
}


.menuSheen {
    position: absolute;
    width: 100%;
    min-height: 650px;
    left: 0px;
    top: 0px;
    background: transparent;
    z-index: 3;
}

.sidenav a, .dropdown-btn {
    padding: 6px 8px 6px 25px;
    text-decoration: none;
    display: block;
    border: none;
    background: none;
    width: 100%;
    min-height: 40px;
    text-align: left;
    cursor: pointer;
    outline: none;
    border: solid 0px #CCCCCC;
}

    .sidenav a:hover, .dropdown-btn:hover {
        text-decoration: none;
        color: rgba(255,255,255,1);
    }

.main {
    margin-left: 200px;
    font-size: 20px;
    padding: 0px 10px;
}

.active {
    background-color: #333333;
    color: rgba(255,255,255,1);
    outline: none;
}

.dropdown-container {
    display: none;
    background-color: #333333;
    padding-left: 15px;
}

.fa-caret-down {
    float: right;
    outline: none;
    padding-right: 8px;
}

button:focus {
    outline: none !important;
}


.TitleTextIcon {
    color: #ffffff;
    font-size: 22px;
}

.TextBox {
    color: #ffffff;
    width: 80%;
    margin-left: 15px;
    margin-top: 0px;
    border: transparent;
    background: transparent;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    /*    color:#fff!important;
    transition: background-color 5000s ease-in-out 0s;*/
}

.LoginTextContainer input::-webkit-input-placeholder {
    color: #fff !important;
}

.LoginTextContainer input::-moz-placeholder {
    color: #fff !important;
}

.LoginTextContainer input::-ms-placeholder {
    color: #fff !important;
}

.LoginTextContainer input::placeholder {
    color: #fff !important;
}

.ContactUsText input::-webkit-input-placeholder {
    color: #000 !important;
}

.ContactUsText input::-moz-placeholder {
    color: #000 !important;
}

.ContactUsText input::-ms-placeholder {
    color: #000 !important;
}

.ContactUsText input::placeholder {
    color: #000 !important;
}

.ConatctUSTextContainer {
    display: flex;
    width: 100%;
    /* min-height: 50px;*/
    height: auto;
    background: var(--unnamed-color-ffffff) 0% 0% no-repeat padding-box;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border-radius: 5px;
    opacity: 1;
    padding: 10px 0;
}

.ConatctUSTextBox {
    color: #000000;
    width: 90%;
    margin-left: 15px;
    margin-top: 0px;
    border: transparent;
    background: transparent;
}

input:focus {
    outline: none !important;
}

textarea:focus {
    outline: none !important;
}

textarea {
    width: 100% !important;
    padding-right: 10px !important;
}

.LoginTextContainer {
    display: flex;
    width: 100%;
    height: 60px;
    background: #00000040 0% 0% no-repeat padding-box;
    border-radius: 30px;
    opacity: 1;
}

.LoginButton {
    width: 100%;
    cursor: pointer;
    height: 60px;
    line-height: 55px;
    border: 2px solid #F8F8F880;
    color: #FFFFFF;
    border-radius: 30px;
    background-color: rgba(255,255,255,0.4);
}

    .LoginButton:hover {
        background: var(--unnamed-color-ffffff) 0% 0% no-repeat padding-box;
        background: #FFFFFF 0% 0% no-repeat padding-box;
        border-radius: 30px;
        opacity: 0.5;
        color: #2B3468;
        border: 0px !important solid #FFFFFF;
        line-height: 60px;
    }

.Login_Button {
    width: 100%;
    height: 60px;
    color: #2B3468;
    cursor: pointer;
    border-radius: 30px;
    left: 0px;
    top: 0px;
}
    .Login_Button .Txt1 {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 60px;
        color: #2B3468;
        left: 0px;
        top: 0px;
        cursor: pointer;
        border: 2px solid #F8F8F880;
        border-radius: 30px;
        color: rgba(255,255,255,0.5);
    }

        .Login_Button .Txt1:hover {
            width: 100%;
            height: 60px;
            left: 0px;
            top: 0px;
            color: #fff;
            border-radius: 30px;
            border: 0px solid #F8F8F880!important;
            background-color: rgba(255,255,255,0.4);
        }

.LoginOtherButton {
    width: 300px;
    height: 60px;
    line-height: 56px;
    cursor: pointer;
    border: 2px solid rgba(255,255,255,0.4);
    border-radius: 30px;
    color: rgba(255,255,255,0.5);
}

.ForgotPasswordDiv .LoginOtherButton {
    width: 200px !important;
    height: 45px !important;
    line-height: 40px;
    cursor: pointer;
    border: 2px solid rgba(255,255,255,0.4);
    border-radius: 30px;
}

.LoginOtherButton:hover {
    border: 2px solid rgba(255,255,255,1);
    color: rgba(255,255,255,1);
}

.LoginButtonDiv {
    display: flex;
    width: 100%;
    /*height: 45px;*/
    height: auto;
    justify-content: center;
}

.bannerContainer .wrap {
    width: 100%;
}

/*
@media screen and (orientation:portrait) {
     

    .bannerImg {
        
        height: 100vh;  
    }
}
@media screen and (orientation:landscape) {
   
 
    .bannerImg {
  
        height: 145vh;  
    }
}*/
#dvCaptcha div:first-child {
    width: 100% !important;
    height: 78px;
    display: flex;
    justify-content: center;
}

.rc-anchor-normal {
    height: 74px;
    width: 100% !important;
}

.alignCenter {
    text-align: center;
}

.alignLeft {
    text-align: left;
}

.thumnailBtnImageContainer {
}

.thumnailBtnNoImage {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #FDE3D8;
    left: 0px;
    top: 0px;
}

.dummyImg {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #FDE3D8;
    left: 0px;
    top: 0px;
}

.LoginPageContactUs:hover {
    border: 1px solid #F04943;
}

.LoginPageContactUs {
    width: 200px;
    height: 60px;
    line-height: 60px;
    background: #FDE3D8 0% 0% no-repeat padding-box;
    border-radius: 30px;
    opacity: 1;
    cursor: pointer;
    margin-bottom:0px;
}

.LoginPageSeperator {
    width: 100%;
    height: 1px;
    background-color: #fff;
    opacity: 0.25;
    margin: 35px 0px 22px 0px;
}

.LoginFailedOk:hover {
    transform: scale(1.1)
}

.LoginFailedOk {
    width: 99px;
    height: 43px;
    line-height: 40px;
    background: #FDE3D8 0% 0% no-repeat padding-box;
    box-shadow: 6px 6px 6px #00000040;
    border-radius: 30px;
    opacity: 1;
    cursor: pointer;
}

.LoginFailedBG {
    position: relative;
    width: 100%;
    min-height: 150px;
    height: auto;
    background: #AE191B;
    text-align: center;
    padding: 0% 5% 6% 5%;
    background: var(--unnamed-color-ffffff) 0% 0% no-repeat padding-box;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    opacity: 1;
    z-index: 2;
}

.RedBar {
    border-top: 10px solid #AE191B;
}

.GreenBar {
    border-top: 10px solid #05B7BE;
}

.NotRobotConatctUs {
    width: 100%;
    height: 87px;
    Line-height: 87px;
    background: var(--unnamed-color-ffffff) 0% 0% no-repeat padding-box;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border-radius: 5px;
    opacity: 0.8;
    background-image: url("/Images/Generic/NotRobot.png");
    background-repeat: no-repeat;
    background-position: right center;
}

.NotRobot {
    width: 100%;
    height: 87px;
    Line-height: 87px;
    border: 2px solid var(--unnamed-color-ffffff);
    border: 2px solid rgb(255, 255, 255,0.25);
    border-radius: 29px;
    background-image: url("/Images/Generic/NotRobot.png");
    background-repeat: no-repeat;
    background-position: right center;
}

#RobotCheck {
    width: 17px;
    height: 17px;
}

.fill img {
    width: 100%;
    height: auto;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.cover {
    position: absolute;
    width: 100%;
    top: 50%;
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}


.btnThumbnail {
    position: relative;
    /*    width: 315px;
    height: 183px;*/
    width: 100%;
    height: 100%;
    cursor: pointer;
}
    .btnThumbnail.noCursor {
        cursor: default;
    }

    .btnThumbnail .btnSheenPatch {
        transition: transform .2s; /* Animation */
    }

.btnThumbnailImg:hover .btnSheenPatch {
    transform: scale(0.95);
    background-color: rgba(00,00,00,0.35);
}

.btnThumbnailpatch:hover .btnSheenPatch {
    transform: scale(0.95);
    /*background-color: rgb(174, 25, 27,0.35);*/
    background-color: rgba(00,00,00,0.35);
}


.btnSheenPatch {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(00,00,00,0.0);
}

    .btnSheenPatch.img {
        background-color: rgba(00,00,00,0.35);
    }

.Arrow {
    width: 25px;
    height: 25px;
    margin-left: 10px;
}
.backbtn {
    width: 38px;
    height: 38px;
    background-image: url("/Images/Generic/Admin/backArrowWhite.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    background-position: -7px 3px;
    background-size: contain;
    margin-right: 0px;
}
.backbtn:hover {
    width: 38px;
    height: 38px;
    background-image: url("/Images/Generic/Admin/backArrowWhiteHover.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    background-position: -7px 3px;
    background-size: contain; 
    margin-right: 0px;
}

.backbtn a{
    height:100%;
}
    .disableBackArrow {
    background-image: url("/Images/Generic/Union 271.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

.disableNextArrow {
    background-image: url("/Images/Generic/Union 270.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

.RedDivforPage04 .enableNextArrow {
    background-image: url("/Images/Generic/Union 269.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    cursor: pointer;
}

.RedDivforPage04 .enableBackArrow {
    background-image: url("/Images/Generic/Union 268.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    cursor: pointer;
}


.RedDivforPage04 .fa-angle-left:before {
    cursor: pointer;
    color: rgba(255,255,255,0.5);
    font-size: 30px;
    padding: 0 5px;
}
.RedDivforPage04 .fa-angle-right:before {
    cursor: pointer;
    color: rgba(255,255,255,0.5);
    font-size: 30px;
    padding: 0 5px;
}
.RedDivforPage04 .fa-angle-left:hover:before {
    cursor: pointer;
    color: rgba(255,255,255,1);
    font-size: 30px;
    padding: 0 5px;
}
.RedDivforPage04 .fa-angle-right:hover:before {
    cursor: pointer;
    color: rgba(255,255,255,1);
    font-size: 30px;
    padding: 0 5px;
}

.RedDivforPage04 .Arrow {
    width: 25px;
    height: 25px;
    margin-left: 5px;
}

/***/

.fa-angle-left:before {
    cursor: pointer;
    color: rgba(51, 51, 51, 0.5);
    font-size: 30px;
    padding: 0 5px;
}

.fa-angle-right:before {
    cursor: pointer;
    color: rgba(51, 51, 51, 0.5);
    font-size: 30px;
    padding: 0 5px;
}

.fa-angle-left:hover:before {
    cursor: pointer;
    color: rgba(51, 51, 51, 1);
    font-size: 30px;
    padding: 0 5px;
}

.fa-angle-right:hover:before {
    cursor: pointer;
    color: rgba(51, 51, 51, 1);
    font-size: 30px;
    padding: 0 5px;
}

.Arrow {
    width: 25px;
    height: 25px;
    margin-left: 5px;
    margin-top: -3px;
}

/***/

.enableNextArrow {
   /* background-image: url("/Images/Generic/Union 270.png");*/
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    cursor: pointer;
}

.enableBackArrow {
   /* background-image: url("/Images/Generic/Union 271.png");*/
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    cursor: pointer;
}


#Page02_SubBar {
    position: relative;
    width: 100%;
    height: 120px;
    top: 120px;
    left: 0px;
    background-color: #2B3468;
    z-index: 1;
}
/*
#Page02_TopbarIcon {
    width: 135px;
    height: 50px;
    background-image: url("/Images/Generic/Page02_TopbarIcon.svg");
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: cover;
}
 
*/
#Page02_TopbarIcon.svgImg {
    width: 161px !important;
    height: 60px !important;
    background-image: url("/Images/Generic/Page02_TopbarIcon.svg");
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: cover;
}

#Page03_SubBar #Page02_TopbarIcon {
    background-image: none;
    background-color: #fff;
    border-radius: 0 30px 30px 0;
    padding: 0px 20px 0px 6px;
    width: auto;
    min-width: 55px;
    position: relative;
    margin-left: 21px;
    height: 50px;
    line-height: 50px;
    /* box-shadow: 10px 6px 15px 0px #c73d38;*/
}
.divScoreCls {
    padding-right: 15px!important;
}
#Page03_SubBar #Page02_TopbarIcon:before {
    content: "";
    position: absolute;
    left: -17px;
    top: 0;
    width: 30px;
    height: 50px;
    border-bottom: 50px solid #fff;
    border-left: 17px solid transparent;
    border-right: 26px solid transparent;
    z-index: -1;
}
    #Page03_SubBar #Page02_TopbarIcon.svgImg {
        /*width: 161px !important;
        height: 60px !important;*/
        background-image: url("/Images/Generic/scoreImg.png");
        background-color: transparent;
        border-radius: 0 30px 30px 0;
        padding: 0px 20px 4px 6px;
        width: auto;
        position: relative;
        margin-left: 5px;
        height: 50px;
        line-height: 50px;
        padding-left: 35px;
    }

        #Page03_SubBar #Page02_TopbarIcon.svgImg:before {
            content: "";
            position: absolute;
            left: -17px;
            top: 0;
            width: 30px;
            height: 50px;
            border-bottom: 50px solid transparent;
            border-left: 17px solid transparent;
            border-right: 26px solid transparent;
            z-index: -1;
        }
@media screen and (max-width: 1199px) {

    #Page03_SubBar #Page02_TopbarIcon {
        height: 40px !important;
        line-height: 40px;
        padding-bottom: 0px;
    }

        #Page03_SubBar #Page02_TopbarIcon:before {
            height: 40px;
            border-bottom: 40px solid #fff;
        }
}


@media screen and (max-width: 991px) {
    #Page03_SubBar #Page02_TopbarIcon {
        height: 30px !important;
        line-height: 30px;
        padding-bottom: 2px;
    }

        #Page03_SubBar #Page02_TopbarIcon:before {
            height: 30px;
            border-bottom: 30px solid #fff;
        }
}
#_TopbarIcon {
    width: 40px;
    height: 40px; 
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: cover;
}

#_TopbarIcon.article_TopbarIcon {
     background-image: url("/Images/Generic/KN_Article.png");
 }

#_TopbarIcon.news_TopbarIcon {
     background-image: url("/Images/Generic/KN_Newsletter.png");
 }
#_TopbarIcon.video_TopbarIcon {
     background-image: url("/Images/Generic/KN_Video.png");
 }
.SitePagePreview .P3BackArrow{
	cursor:pointer;
}
.Page02_Badge_Default {
    background-image: url("/Images/Generic/Page02_Badge_default.svg");
}

.Page02_Badge_win {
    background-image: url("/Images/Generic/Page02_Badge_win.png");
}
/*.Page02_Badge_Icon:hover{
	background-image:url("/Images/Generic/Page02_Badge_hover.png");
}*/



.Page02_Badge_Icon1 {
    background-image: url("/Images/Generic/Page02_Badge_Icon1.svg");
}

.Page02_Badge_Icon2 {
    background-image: url("/Images/Generic/Page02_Badge_Icon2.svg");
}

.Page02_Badge_Icon3 {
    background-image: url("/Images/Generic/Page02_Badge_Icon3.svg");
}

.Page02_Badge_Icon4 {
    background-image: url("/Images/Generic/Page02_Badge_Icon4.svg");
}

.Page02_Badge_Icon5 {
    background-image: url("/Images/Generic/Page02_Badge_Icon5.svg");
}

.Page02_Badge_Icon6 {
    background-image: url("/Images/Generic/Page02_Badge_Icon6.svg");
}

.Page02_Badge_Icon {
    width: 60px;
    height: 61px;
    background-repeat: no-repeat;
    background-position: center center;
}

.Page02_Badge {
    width: 60px;
    height: 61px;
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: cover;
}

#Page02_templateContainer {
    position: relative;
    width: 100%;
    height: auto;
    margin-top: 80px;
}

.P2btnThumbnail {
    position: relative;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.P2btnSheenPatch {
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 100%;
    height: 90%;
    cursor: pointer;
}

.P2btnSheenPatchBlue {
    background-color: rgba(00,136,255,0.8);
    height: 20%;
    line-height: 1;
}

.P2btnSheenPatchYellow {
    background-color: rgba(255,212,00,0.8);
    height: 20%;
    line-height: 1;
}

.P2btnSheenPatchDummy {
    height: 20%;
}

.P2btnSheenPatchBlank {
    height: 40%;
    transition: height 1s ease;
}

.P2btnSheenPatchDark {
    background-color: rgba(00,00,00,0.35);
    height: 40%;
    transition: height 1s ease;
}

.P2btnSheenPatch:hover .P2btnSheenPatchBlank {
    height: 10%;
}

.P2btnSheenPatch:hover .P2btnSheenPatchDark {
    height: 70%;
    background-color: rgba(00,00,00,0.70);
}

.P2btnSheenPatch:hover .P2ImageCaptionText {
    bottom: 31%;
}

.P2btnSheenPatch:hover .P2ImageCaptionText1 {
    bottom: 58%;
}
.P2btnSheenPatch:hover .P2ModuleNums {
    visibility: visible;
    opacity: 1;
}

.P2btnSheenPatch:hover .P2ModuleDuration {
    visibility: visible;
    opacity: 1;
}
/*******************************/
 

.P2btnThumbnail:hover .P2btnSheenPatchBlank {
    height: 10%;
}

.P2btnThumbnail:hover .P2btnSheenPatchDark {
    height: 70%;
    background-color: rgba(00,00,00,0.70);
}

.P2btnThumbnail:hover .P2ImageCaptionText {
    bottom: 31%;
}

.P2btnThumbnail:hover .P2ImageCaptionText1 {
    bottom: 58%;
 
}
.P2btnThumbnail:hover .P2ModuleNums {
    visibility: visible;
    opacity: 1;
}

.P2btnThumbnail:hover .P2ModuleDuration {
    visibility: visible;
    opacity: 1;
}
 
/*******************************/
.P2ImageCaptionText {
    position: absolute;
    bottom: 7%;
    width: 100%;
    height: auto;
    padding: 20px;
    padding-top: 0px;
    padding-bottom: 0px;
    line-height: 1.1;
    transition: bottom 1s ease;
}

.P2ImageCaptionText1 {
    position: absolute;
    bottom: 7%;
    width: 100%;
    height: auto;
    padding: 20px;
    padding-top: 0px;
    padding-bottom: 0px;
    line-height: 1.1;
    transition: bottom 1s ease;
    background: #fff;
    bottom: 40%;
    display: flex;
    align-items: center;
    min-height: 50px;
}

.P2ModuleNums {
    position: absolute;
    bottom: 20%;
    background-image: url("/Images/Generic/P2ModuleIcon.png");
    background-repeat: no-repeat;
    background-position: 0px center;
    padding-left: 30px;
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s, opacity 1.2s linear;
}

.P2ModuleDuration {
    position: absolute;
    bottom: 10%;
    background-image: url("/Images/Generic/Time.png");
    background-repeat: no-repeat;
    background-position: 0px center;
    padding-left: 30px;
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s, opacity 1.2s linear;
}

.ModuleTypeConatiner {
    position: absolute;
    top: 5%;
    left: 2%;
}

.SelfEnrolled {
    width: 40px;
    height: 40px;
    margin-left: 10px;
    background-image: url("/Images/Generic/SelfEnrolled.png");
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: contain;
}

.TimeBasedLearning {
    width: 40px;
    height: 40px;
    margin-left: 10px;
    background-image: url("/Images/Generic/TimeBasedLearning.png");
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: contain;
}

.catalog-inner-warpper .TimeBasedLearning {
    margin-left: 0px;
}

.SystemAssigned {
    width: 40px;
    height: 40px;
    margin-left: 10px;
    background-image: url("/Images/Generic/SystemAssigned.png");
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: contain;
}

.Selfpaced {
    width: 40px;
    height: 40px;
    margin-left: 10px;
    background-image: url("/Images/Generic/Selfpaced.png");
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: contain;
}
.LearningSite {
    width: 40px;
    height: 40px;
    margin-left: 10px;
    background-image: url("/Images/Generic/LearnignSite.png");
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: contain;
}
.LinkImg {
    width: 40px;
    height: 40px;
    margin-left: 10px;
    background-image: url("/Images/Generic/LinkImg.png");
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: contain;
}
.Classroom {
    width: 40px;
    height: 40px;
    margin-left: 10px;
    background-image: url("/Images/Generic/Classroom.png");
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: contain;
}
.Selfdeclaration {
    width: 40px;
    height: 40px;
    margin-left: 10px;
    background-image: url("/Images/Generic/Selfdeclaration.png");
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: contain;
}
.AssignedProgram {
    width: 40px;
    height: 40px;
    margin-left: 10px;
    background-image: url("/Images/Generic/AssignedProgram.png");
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: contain;
} 
#Page03_templateContainer {
    position: relative;
    width: 100%;
    height: auto;
    margin-top: 420px;
    z-index: 3;
}

#Page03_SubBar {
    position: relative;
    width: 100%;
    /*height: 219px;
    min-height:120px;*/
    top: 60px;
    left: 0px;
    background: transparent linear-gradient(90deg, var(--unnamed-color-2b3468) 0%, var(--unnamed-color-f04943) 100%) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(90deg, #2B3468 0%, #F04943 100%) 0% 0% no-repeat padding-box;
    z-index: 1;
}

    #Page03_SubBar.Page03_SubBar_HT120 {
        height: 120px;
        /* min-height:120px;*/
        height: auto;
        /* padding-top: 2%;
        padding-bottom: 2%;*/
        padding-top: 10px;
        padding-bottom: 10px;
    }
    #Page03_SubBar.Page03_SubBar_HT60 {
        min-height:60px;
    }
    #Page03_SubBar.SitePagePreview {
        position: relative;
        width: 100%;
        height: 80px;
        top: 120px;
        left: 0px;
        background: transparent linear-gradient(90deg, var(--unnamed-color-2b3468) 0%, var(--unnamed-color-f04943) 100%) 0% 0% no-repeat padding-box;
        background: transparent linear-gradient(90deg, #2B3468 0%, #F04943 100%) 0% 0% no-repeat padding-box;
        z-index: 1;
        padding: 0px 30px 0px 30px;
        height: auto;
        padding-top: 10px;
        padding-bottom: 10px;
    }
        #Page03_SubBar.SitePagePreview .maxWidth {
            max-width:84%;
        }
._gap20{
	gap:20px;
}

.wrapBar{
	
	justify-content:space-between;
}
@media screen and (max-width: 768px) {
		.wrapBar{
			flex-wrap:wrap;
			justify-content:space-between;
			    padding: 15px 0px;
		}
		._mrgB{
			margin-bottom: 15px;
		}
	#Page03_SubBar.SitePagePreview {
	 
		height: auto;
		top: 60px; 
	}
}
#Page03a_SubBar {
}
.flextitleBar {
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap; 
}
#Page03a_SubBar {
    position: relative;
    width: 100%;
    /*    height: 60px;*/
    min-height: 60px; 
    top: 60px;
    left: 0px;
    background: #FAFAFB 0% 0% no-repeat padding-box;
    z-index: 1;
    border-bottom: 1px solid #e0e0e3;
}

    #Page03a_SubBar .row3aSubBar {
        min-height: 60px;
    }

.aboutThisPrg {
    margin-top: 80px;
}

.container-fluid.noScroll {
    overflow: hidden !important;
}

.resumeBtn {
    width: 140px;
    height: 40px;
    background: #FDE3D8 0% 0% no-repeat padding-box;
    border-radius: 20px;
    opacity: 1;
    padding-top: 10px;
    text-align: center;
    cursor: pointer;
    background: #FDE3D8 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    float: none !important;
}

    .resumeBtn:hover {
        text-decoration: none;
        transform: scale(1.05) !important;
    }

    .resumeBtn a:hover {
        text-decoration: none;
        transform: scale(1.12) !important;
    }
.in-progress-right .resumeBtn {
    width: 140px;
    height: 60px;
    background: #FDE3D8 0% 0% no-repeat padding-box;
    border-radius: 30px;
    padding-top: 0px;
    opacity: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    cursor: pointer;
    background: #FDE3D8 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    float: none !important;
}

    .in-progress-right .resumeBtn:hover {
        text-decoration: none;
        transform: scale(1.05) !important;
    }

    .in-progress-right .resumeBtn a:hover {
        text-decoration: none;
        transform: scale(1.12) !important;
    }

#P3mainContainerColor {
    background-color: #FFFFFF !important;
}

.P3GOArrow {
    position: absolute;
    width: 100px;
    height: 100%;
    right: 0px;
    top: 0px;
    background-image: url("/Images/Generic/Page03_ForwardArrow.png");
    background-repeat: no-repeat;
    background-position: center center;
}

.P3DisplayIcon {
    position: absolute;
    width: 80px;
    height: 80px;
    left: 40px;
    top: 45px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

.P3FeedbackIcon {
    background-image: url("/Images/Generic/FeedbackIcon.png");
}

.P3CetificateIcon {
    background-image: url("/Images/Generic/CertificateIcon.png");
}

.P3MessageContainer {
    position: relative;
    min-height: 200px;
    background: #FDE3D8 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 10px;
    opacity: 1;
    padding: 45px 60px 54px 140px;
}

.P3ProgramScoreContainer {
    position: relative;
   /* max-height: 660px;*/
    min-height: 500px;
    background: #EFF5F7 0% 0% no-repeat padding-box;
    border-radius: 10px;
    opacity: 1;
    padding: 40px 40px 54px 40px;
}

.ActiveP3Circle {
    background-image: url("/Images/Generic/Page03_Circle1.png");
}

.DisbaleP3Circle {
    background-image: url("/Images/Generic/Page03_Circle.png");
}

.P3Circle {
    height: 80px;
    width: 80px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

.P3ArtAndCulture {
    background-image: url("/Images/Generic/ArtAndCulture.png");
}

.P3Assigned {
    background-image: url("/Images/Generic/Assigned.png");
}

.P3Completion {
    background-image: url("/Images/Generic/Completion.png");
}

.P3Duration {
    background-image: url("/Images/Generic/Duration.png");
}

.P3SelfPacedlearning {
    background-image: url("/Images/Generic/SelfPacedlearning.png");
}

.P3TimeBasedlearning {
    background-image: url("/Images/Generic/P3TimeBasedlearning1.png");
}

.P3CircleType1 {
    height: 60px;
    width: 60px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

.floatLeft {
    float: left !important;
}



.P4btnSheenPatch {
    position: absolute;
    left: 0px;
    bottom: -1px;
    width: 100%;
    height: 70%;
}

.P4btnSheenPatch {
    cursor: pointer;
}

    .P4btnSheenPatch.noCursor {
        cursor: default;
    }
   .cursorCls {
        cursor: pointer;
    }

.P4btnSheenPatchBlue {
    background-color: #B0E88C;
    height: 20%;
    line-height: 1;
}

.P4btnSheenPatchYellow {
    background-color: #FFD400;
    height: 20%;
    line-height: 1;
}
.P4btnSheenPatchClr.FreeCourseCls {
    background-color: #B0E88C;
    height: 20%;
    line-height: 1;
}
.P4btnSheenPatchClr.FreeCourseCls_1 {
    background-color: #FFD400;
    height: 20%;
    line-height: 1;
}
.P4btnSheenPatchClr.PaidCourseCls {
    background-color: #FFD400;
    height: 20%;
    line-height: 1;
}

.enrollMyTeamOnly.FreeCourseCls {
    background-color: #B0E88C;
    height: 20%;
    line-height: 1;
}

.enrollMyTeamOnly.FreeCourseCls_1 {
    background-color: #FFD400;
    height: 20%;
    line-height: 1;
}

.enrollMyTeamOnly.PaidCourseCls {
    background-color: #FFD400;
    height: 20%;
    line-height: 1;
}
.P4btnSheenPatchWhite {
    background-color: #FFFFFF;
    height: 20%;
    line-height: 1;
}

.P4btnSheenPatchDummy {
    height: 20%;
}

.P4btnSheenPatchBlank {
    height: 40%;
    transition: height 1s ease;
}

.P4btnSheenPatchDark {
    background-color: rgba(00,00,00,0.35);
    height: 40%;
    transition: height 1s ease;
}

.P4ImageCaptionText {
    position: absolute;
    bottom: 27%;
    width: 100%;
    height: auto;
    padding: 20px;
    padding-top: 0px;
    padding-bottom: 0px;
    line-height: 1.1;
    transition: bottom 1s ease;
}


.P4PriceTag {
    width: 25%;
    height: 70%;
    border-right: solid 1px #2B3468;
}
.detailPage .P4PriceTag {
    width: 21%;
    height: 70%;
    border-right: solid 1px #2B3468;
}

.P4AddtoCarttext {
    width: 40%;
    height: 70%;
    line-height: 40%;
}

.P4BuyNow {
    width: 25%;
    height: 70%;
    border-left: solid 1px #2B3468;
}
.detailPage .P4BuyNow {
    width: 21%;
    height: 70%;
    border-left: solid 1px #2B3468;
}

.PaidCourseIcon {
    width: 80px;
    height: 40px;
    margin-left: 10px;
    /* UI Properties */
    background: #FFFFFF;
    border: 1px solid #707070;
    border-radius: 20px;
    opacity: 1;
    color: #666666;
}

.FreeCourseIcon {
    width: 80px;
    height: 40px;
    margin-left: 10px;
    background: #666666;
    border: 1px solid #707070;
    border-radius: 20px;
    opacity: 1;
    color: #FFFFFF;
}

.NewCourseIcon {
    width: 80px;
    height: 45px;
    margin-left: 10px;
    background-size: contain;
    background-image: url("/Images/Generic/NewCourse.png");
    background-repeat: no-repeat;
    background-position: center center;
    line-height:19px;
}

.RatingIcon {
    width: 144px;
    height: 40px;
    margin-left: 10px;
    background: #FFFFFF;
    border: 1px solid #707070;
    border-radius: 20px;
    opacity: 1;
    background-repeat: no-repeat;
    background-size: contain;
}

.OneStar {
    background-image: url("/Images/Generic/1Stars.png");
    background-position: center center;
}

.TwoStar {
    background-image: url("/Images/Generic/2Stars.png");
    background-position: center center;
}

.ThreeStar {
    background-image: url("/Images/Generic/3Stars.png");
    background-position: center center;
}

.FourStar {
    background-image: url("/Images/Generic/4Stars.png");
    background-position: center center;
}

.FiveStar {
    background-image: url("/Images/Generic/5Stars.png");
    background-position: center center;
}

.NumberedDiv {
}

.RedDivforPage04 {
    width: 100%;
    height: auto;
    padding-top: 30px;
    background-color: #F04943
}

#Page04_SubBar {
    /*position: relative;*/
    position: relative;
    width: 100%;
    height: 100px; /*old 100px **/
    height: 60px;
    top: 60px;
    left: 0px;
    background-color: #FAFAFB;
    border: 1px solid #cccccc;
    z-index: 1;
    Padding: 16px 20px 15px 20px; /*old 16px 20px 15px 20px  **/
    Padding: 0px 27px 0px 30px;
}

    #Page04_SubBar.LPCatlog {
        /*position: relative;*/
        position: relative;
        width: 100%;
        height: 100px; /*old 100px **/
        height: 60px;
        top: 0px;
        left: 0px;
        background-color: #FAFAFB;
        border: 1px solid #cccccc;
        z-index: 1;
        Padding: 16px 20px 15px 20px; /*old 16px 20px 15px 20px  **/
        Padding: 0px 27px 0px 30px;
        margin-top: 120px;
    }
#adminroot #Page04_SubBar.LPCatlog {
    /*position: relative;*/
    position: relative;
    width: 100%;
    height: 100px; /*old 100px **/
    height: 60px;
    top: 0px;
    left: 0px;
    background-color: #FAFAFB;
    border: 0px solid #cccccc;
    border-top: 0px solid #cccccc;
    border-bottom: 1px solid #cccccc;
    border-left: 0px solid #cccccc !important;
    border-right: 0px solid #cccccc !important;
    z-index: 1;
    Padding: 16px 20px 15px 20px; /*old 16px 20px 15px 20px  **/
    Padding: 0px 27px 0px 30px;
    margin-top: 0px;
}
    #Page04_SubBar.brdTB {
    border-top: 0px solid #cccccc;
    border-bottom: 1px solid #cccccc;
    border-left: 0px solid #cccccc !important;
    border-right: 0px solid #cccccc !important;
}
.paddingLP2_TB{
    padding:0px 0px;
}

#adminroot #Page04_SubBar {
    top: 0px !important;
}

    #adminroot #Page04_SubBar.LPDetail {
        top: 0px !important;
    }

#adminroot #Page04_MenuContainer {
    margin-top: 0px !important;
}
    #adminroot #Page04_MenuContainer.LPProductDetail {
        margin-top: -60px !important;
    }
.learnerroot #Page04_MenuContainer.LPProductDetail {
    margin-top: 60px !important;
}

    #adminroot #Page04_MenuContainer .forAdminTop50 {
        margin-top: 0px !important;
    }

#Page04_MenuContainer {
    position: relative;
    width: 100%;
    height: 100%;
    /*  margin-top: 200px;*/
    margin-top: 0px;
    background-color: #fff;
}

.P4MenuButtonbig {
    width: 260px;
    height: 40px;
    line-height: 40px;
    /* UI Properties */
    background: #FDE3D8 0% 0% no-repeat padding-box;
    border-radius: 20px;
    opacity: 1;
    background-repeat: no-repeat;
    background-image: url("/Images/Generic/NarrowSearch.png");
    background-position: 25px center;
    cursor: pointer;
}

.P4Cart {
    width: 75px;
    height: 42px;
    background-repeat: no-repeat;
    background-image: url("/Images/Generic/BigCart.png");
    background-position: center center;
}

.P4MenuBg {
    width: 25%;
    position: absolute;
    /*    height: 1055px;
    min-height: 875px;*/

    height: calc( 100vh - 180px );
    top: 0px;
    /*top: -22px;*/
    left: 0;
    background: #FDE3D8 0% 0% no-repeat padding-box;
    box-shadow: 0px 6px 6px #00000040;
    border: 1px solid #CCCCCC;
    opacity: 1;
    z-index: 1;
    overflow-x: hidden;
    overflow-y: auto;
}

.P4StarText {
    width: auto;
    height: 24px;
    line-height: 24px;
    margin-left: 5px;
}

.P4MenuButton {
    width: 100px;
    height: 40px;
    line-height: 40px;
   /* margin-left: 5px;*/
    background: var(--unnamed-color-ffffff) 0% 0% no-repeat padding-box;
    border: 1px solid var(--unnamed-color-f04943);
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #F04943;
    border-radius: 6px;
    opacity: 1;
}

.catLP2.P4MenuButton {
    height: 42px;
    line-height: 42px;
    margin-right: 5px;
}

.p4TextBox {
    color: #F04943;
    width: 85px;
    border: transparent;
    background: transparent;
}


.P4MenuApplyButton {
    width: 220px;
    height: 60px;
    line-height: 60px;
    background: var(--unnamed-color-ffffff) 0% 0% no-repeat padding-box;
    background: #fde3d8 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 38px;
    opacity: 1;
    cursor: pointer;
}

::-webkit-input-placeholder { /* Edge */
    color: #999999;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #999999;
}

::placeholder {
    color: #999999;
}
.ConatctUSTextContainer textarea::placeholder {
    color: #000 !important;
}
.ConatctUSTextContainer textarea::-webkit-input-placeholder {
    color: #000;
}

.ConatctUSTextContainer textarea:-moz-placeholder { /* Firefox 18- */
    color: #000;
}

.ConatctUSTextContainer textarea::-moz-placeholder { /* Firefox 19+ */
    color: #000;
}

.ConatctUSTextContainer textarea:-ms-input-placeholder {
    color: #000;
}
.P4Star {
    width: 25px;
    height: 24px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    margin-left: 5px;
}

.YellowStar {
    background-image: url("/Images/Generic/YellowStar.png");
}

.WhiteStar {
    background-image: url("/Images/Generic/WhiteStar.png");
}

@media screen and (max-width: 375px) {
    .Page02_Badge {
        width: 25px !important;
        height: 26px !important;
        background-size: contain;
    }

    .P3Circle {
        height: 50px;
        width: 50px;
    }

    .P3DisplayIcon {
        width: 60px;
        height: 60px;
        left: 10px;
        top: 45px;
    }

    .P3MessageContainer {
        padding: 45px 60px 54px 80px;
    }

    .P3GOArrow {
        width: 70px;
    }

    .Arrow {
        /*    width: 15px;
        height: 15px;*/

        width: 25px;
        height: 25px;
        margin-left: 5px;
    }

    .MmarginL10 {
        margin-left: 10px;
    }

    .MmarginT60 {
        margin-top: 60px;
    }

    .MmarginT30 {
        margin-top: 30px;
    }

    .MmarginR10 {
        margin-right: 10px;
    }

    .MmarginR15 {
        margin-right: 15px;
    }

    .MpaddingL5 {
        padding-left: 5px;
    }

    .MpaddingL30 {
        padding-left: 30px;
    }

    .MpaddingR30 {
        padding-right: 30px;
    }

    .MpaddingL10 {
        padding-left: 10px;
    }

    .MpaddingT10 {
        padding-top: 10px;
    }

    .MpaddingT15 {
        padding-top: 15px;
    }

    .MpaddingT20 {
        padding-top: 20px;
    }

    .MpaddingT30 {
        padding-top: 30px;
    }

    .MpaddingL15 {
        padding-left: 15px;
    }

    .percircle.small {
        font-size: 24px !important;
    }

    .percircle > span {
        font-size: 15px !important;
    }

    #Page02_TopbarIcon {
        width: 70px;
        height: 18px !important;
        font-size: 15px !important;
        background-size: contain;
    }

    .Page02_Badge_Icon {
        width: 30px;
        height: 31px;
        background-size: contain;
    }

    .Page02_Badge {
        width: 30px;
        height: 31px;
        background-size: contain;
    }
}

@media screen and (max-width: 480px) {

    .MmarginL10 {
        margin-left: 10px;
    }

    .MmarginT60 {
        margin-top: 60px;
    }

    .MmarginT5 {
        margin-top: 5px;
    }

    .MmarginT30 {
        margin-top: 30px;
    }

    .MbmarginT30 {
        margin-top: 30px !important;
    }

    .MmarginR10 {
        margin-right: 10px;
    }

    .MmarginR15 {
        margin-right: 15px;
    }

    .MpaddingL5 {
        padding-left: 5px;
    }

    .MpaddingL30 {
        padding-left: 30px;
    }

    .MpaddingR30 {
        padding-right: 30px;
    }

    .MpaddingL10 {
        padding-left: 10px;
    }

    .MpaddingT10 {
        padding-top: 10px;
    }

    .MpaddingT15 {
        padding-top: 15px;
    }

    .MpaddingT20 {
        padding-top: 20px;
    }

    .MpaddingT30 {
        padding-top: 30px;
    }

    .MpaddingL15 {
        padding-left: 15px;
    }

    .P3Circle {
        height: 50px;
        width: 50px;
    }

    .P3DisplayIcon {
        width: 60px;
        height: 60px;
        left: 10px;
        top: 45px;
    }

    .P3MessageContainer {
        padding: 45px 60px 54px 80px;
    }

    .P3GOArrow {
        width: 70px;
    }

    .Arrow {
        /*width: 15px;
        height: 15px;*/
        width: 25px;
        height: 25px;
        margin-left: 5px;
    }

    .MmarginL10 {
        margin-left: 10px;
    }

    .MpaddingL10 {
        padding-left: 10px;
    }

    .MpaddingL15 {
        padding-left: 15px;
    }

    .percircle.small {
        font-size: 35px !important;
    }

    .percircle > span {
        font-size: 20px !important;
    }

    #Page02_TopbarIcon {
        width: 70px;
        height: 25px;
        background-size: contain;
    }

    .Page02_Badge_Icon {
        width: 30px;
        height: 31px;
        background-size: contain;
    }

    .Page02_Badge {
        width: 30px;
        height: 31px;
        background-size: contain;
    }

    .bannerText {
        padding: 3% 8% !important;
        margin-top: 20px;
    }

    .smHide {
        display: none;
    }

    .btnMenu {
        margin-top: 20px;
    }

    .Clientlogo {
        margin-top: 20px;
    }

    .sidenav {
        width: 100%;
    }

    #SubBar {
        min-height: 100px;
    }
}

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

    .SubMenuItem {
        text-align: left;
        width: auto;
    }

        .SubMenuItem:hover::after {
            content: "";
            position: absolute;
            border-top: 4px solid #F04943;
            width: auto;
            height: 4px;
            bottom: 0px;
            left: 0px;
        }

    .responsiveTopMrg {
        margin-top: 5px;
    }

    .P3Circle {
        height: 50px;
        width: 50px;
    }

    .P3DisplayIcon {
        width: 60px;
        height: 60px;
        left: 10px;
        top: 45px;
    }

    .P3MessageContainer {
        padding: 45px 60px 54px 80px;
    }

    .P3GOArrow {
        width: 80px;
    }

    .bannerText {
        padding: 3% 8% !important;
        margin-top: 20px;
    }

    .smHide {
        display: none;
    }

    .btnMenu {
        margin-top: 20px;
    }

    .Clientlogo {
        margin-top: 20px;
    }

    .sidenav {
        width: 100%;
    }

    #SubBar {
        min-height: 100px;
    }

    #Page02_SubBar {
        /*top: 180px;*/
        top: 80px;
    }

    #Page02_templateContainer {
        /*margin-top: 320px;*/
        margin-top: 80px;
    }

    #Page04_SubBar {
        /*top: 180px;*/
        top: 80px;
    }

        #Page04_MenuContainer {
            /*margin-top: 300px;*/
            margin-top: 80px; 
        }
            #Page04_MenuContainer.catlogLp2 {
                /*margin-top: 300px;*/
                margin-top: 0px;
            }
            #Page04_MenuContainer.catlogLp2ForPop {
                /*margin-top: 300px;*/
                margin-top: 0px;
            }
        .secretesOfCls {
            margin-bottom: 30px !important;
        }
    }

@media screen and (max-width: 760px) {
    #Page03a_SubBar.autoHeight {
        /*margin-top: 300px;*/
        height: auto;
    } 
}
@media screen and (max-width: 768px) {
    #Page03a_SubBar.autoHeight {
        /*margin-top: 300px;*/
        height: auto;
    }
    #Page03_SubBar.autoHeight.Page03_SubBar_HT120 {
        /* margin-top: 300px; */
        height: auto !important;
    }
}
    @media screen and (max-width: 768px) and (min-width: 340px) {

    #SubBar {
        height: auto !important;
        padding-top: 10px;
        padding-bottom: 10px;
    }
}


@media screen and (max-width: 912px) {
    .ContactUsText {
        top: 5px;
        width: 102%;
        margin-left: 0%;
    }

    .LoginFailedBG {
        min-height: 200px;
    }

    .ForgotPasswordDoneBG {
        height: 76vh;
    }

    .P4MenuBg {
        width: 100% !important;
    }

    .RightSidenav {
        left: 0px !important;
        width: 100% !important;
        top: 155px !important;
    }

    .P3Circle {
        height: 50px;
        width: 50px;
    }

    .P3DisplayIcon {
        width: 60px;
        height: 60px;
        left: 10px;
        top: 45px;
    }

    .P3GOArrow {
        width: 80px;
    }

    .P3MessageContainer {
        padding: 45px 60px 54px 80px;
    }

    .bannerText {
        padding: 3% 11% !important;
        margin-top: 20px;
    }

    .ForgotPasswordDiv {
        padding: 3% 11% !important;
        margin-top: 20px;
    }

    .smHide {
        display: none;
    }

    .btnMenu {
        margin-top: 0px;
    }

        .btnMenu img {
            margin-top: 20px;
        }
    /*
    .btnMenu {
        margin-top: 20px;
    }
*/
    .Clientlogo {
        margin-top: 15px;
    }

    .sidenav {
        width: 100%;
    }

    #SubBar {
        min-height: 100px;
        min-height: 80px;
    }

    .storiesTitle {
        padding-top: 40px !important;
    }
}


@media screen and (max-width: 1366px) {
    .P4MenuBg {
        width: 30%;
    }

    .PaidCourseIcon {
        width: 40px;
        height: 20px;
        padding-top: 0px;
        margin-left: 5px;
        font-size: 10px !important;
        line-height: 18px;
    }

    .FreeCourseIcon {
        width: 40px;
        height: 20px;
        padding-top: 0px;
        margin-left: 5px;
        font-size: 10px !important; 
        line-height: 18px;
    }

    .NewCourseIcon {
        width: 35px;
        height: 20px;
        /*padding-top: 2px;*/
        margin-left: 5px;
        font-size: 10px !important;
    }

    .RatingIcon {
        width: 72px;
        height: 20px;
        margin-left: 5px;
    }
 
    .SelfEnrolled {
        width: 20px;
        height: 20px;
    }

    .TimeBasedLearning {
        width: 20px;
        height: 20px;
    }

    .SystemAssigned {
        width: 20px;
        height: 20px;
    }

    .Selfpaced {
        width: 20px;
        height: 20px;
    }


    .LearningSite {
        width: 20px;
        height: 20px;
    }

    .LinkImg {
        width: 20px;
        height: 20px;
    }

    .Classroom {
        width: 20px;
        height: 20px;
    }

    .Selfdeclaration {
        width: 20px;
        height: 20px;
    }

    .AssignedProgram {
        width: 20px;
        height: 20px;
    } 

    .LearningSite {        width: 20px;        height: 20px;    }
    .LinkImg {        width: 20px;        height: 20px;    }
    .Classroom {        width: 20px;        height: 20px;    }
    .Selfdeclaration {        width: 20px;        height: 20px;    }
    .AssignedProgram {        width: 20px;        height: 20px;    } 

    .MenuItem {
        padding: 12px 15px 12px 35px !important;
    }

    .P3Circle {
        height: 50px;
        width: 50px;
    }

    .P3DisplayIcon {
        width: 60px;
        height: 60px;
        left: 10px;
        top: 45px;
    }

    .P3MessageContainer {
        padding: 45px 60px 54px 80px;
    }

    .MmarginL10 {
        margin-left: 10px;
    }

    .MmarginT10 {
        margin-top: 10px;
    }

    .MpaddingR15 {
        padding-right: 15px;
    }

    .MpaddingL10 {
        padding-left: 10px;
    }

    .MpaddingL15 {
        padding-left: 15px;
    }

    .MpaddingT15 {
        padding-top: 15px;
    }

    .MpaddingT10 {
        padding-top: 10px;
    }

    .MpaddingT50 {
        padding-top: 50px;
    }

    .MpaddingL50 {
        padding-left: 50px;
    }

    .MpaddingL150 {
        padding-left: 150px;
    }

    .percircle.small {
        font-size: 35px !important;
    }

    .percircle > span {
        font-size: 20px !important;
    }

    #Page02_TopbarIcon {
        width: 100px;
        height: 35px;
        background-size: contain;
    }


/*    .Page02_Badge_Icon {
        width: 30px;
        height: 31px;
        background-size: contain;
    }
        .Page02_Badge {
            width: 30px;
            height: 31px;
            background-size: contain;
        }*/
    }

    @media screen and (max-width: 1920px) {
        .MpaddingL15 {
            padding-left: 15px;
        }
    }

@media screen and (max-width: 985px) {

/*    #Page02_TopbarIcon {
        width: 100px;
        height: 25px;
        background-size: contain;
    }*/
}
/**** Video Container ***/
.w100 {
    width: 100% !important;
    height: auto;
}

.w30 {
    width: 30%;
}

.w50 {
    width: 50%;
}

.w70 {
    width: 70%;
}

.primaryTextColor-heading {
    color: #F04943 !important;
}

.secondaryTextColor-heading {
    color: #2B3468 !important;
}

.textColor-heading {
    color: #F04943 !important;
}

.VideoTemplatePaddingContainer {
    /* padding: 3% 5% !important;*/
    padding: 2% 0% !important;
}

.ThumbnailPaddingtop {
    /* padding: 3% 0% !important;*/
    padding: 2% 0% !important;
}

.paddingLR10 {
    padding: 0px 10px !important;vidDescssion
}
.paddingL10R115 {
    padding: 0px 10px 0px 15px !important;
    
}
.vidDescssion.paddingL0R15 {
    padding: 0px 0px 0px 15px !important;
}

.paddingLR5 {
    padding: 0px 5px !important;
}

#ThumbnailVideoContainer {
    width: 100%;
    margin-bottom: 10px;
}

.thumbnailVideoHeading {
    color: #F04943;
    font-weight: bold;
}

.thumbnailVideoInfoTxt {
    color: #999999;
}

.mainVideoTitle {
    color: #F04943;
    font-weight: bold;
    margin-top: 20px;
}

.mainVideoInfo {
    color: #999999;
    width: 100%;
    border-bottom: 1px solid #CCCCCC;
    padding-bottom: 15px;
}

.mainVideoInfoTxt {
    color: #2B3468;
    width: 100%;
}

.lineSeperator {
    width: 100%;
    height: 1px;
    background: #CCCCCC;
    margin-top: 40px;
    margin-bottom: 25px;
}

.mainVideototalCommentTxt {
    color: #999999;
}

.ms-2 {
    margin-left: .7rem !important;
}

.mainVideoCommentSection textarea {
    width: 100%;
    border: none;
    color: red;
    background: transparent;
    padding: 0px 10px 2px 0px;
    height: 50%;
    border-radius: 5px 5px 0 0;
    border-bottom: 2px solid #ccc;
    transition: all .5s;
    margin-top: 15px;
    font-size: clamp(0.75rem, 0.3214rem + 0.6696vw, 1.125rem) !important;
}

#ThumbnailVideoContainer.mobile .video {
    width: 40%;
    float: left;
}

#ThumbnailVideoContainer.mobile .info {
    width: 60%;
    float: left;
    padding-left: 10px;
}

#MainThumbnailContainerMobile #ThumbnailVideoContainer.desktop {
    display: none;
}

#MainThumbnailContainer #ThumbnailVideoContainer.mobile {
    display: none;
}
/*Discussion Forum Banner*/
.fontBold {
    font-weight: bold;
}

#divrightitemslayout {
    height: 60px;
    display: flex;
    align-items: center;
}

#discussfrmBanner .bannerTopbar {
    position: relative;
    display: flex;
    align-items: center;
    flex-direction: coulmn;
    width: 100%;
    height: 80px;
    background: transparent linear-gradient(270deg, #2B3468 0%, #F04943 100%) 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    opacity: 1;
    padding: 0% 5%;
}

    #discussfrmBanner .bannerTopbar .bannerMsg {
        color: #FFFFFF;
        text-align: left;
        margin-left: 15px;
    }

.DFtopPanel {
    position: relative;
    display: flex;
    align-items: center;
    flex-direction: coulmn;
    padding: 6% 6% 8% 0%;
}
    .DFtopPanel.AprRej {
        position: relative;
        display: flex;
        align-items: center;
        flex-direction: row;
        padding: 0px;
        margin-bottom: 10px;
    }

#discussfrmLeftPanel .discussfrmcatagPanel {
    padding-Left: 15%;
    padding-Left: 35px;
}

#discussfrmRightPanel {
    border-left: 2px solid #efefef;
}

    #discussfrmRightPanel .discussfrmPanel {
        position: relative;
        padding: 3% 8% 3% 3%;
    }

    #discussfrmRightPanel .discussfrmBodyTxt {
        /*margin: 50px 0px;*/
        margin: 15px 0px ;
    }

        #discussfrmRightPanel .discussfrmBodyTxt.btm {
            /*margin: 50px 0px;*/
            margin: 40px 0px 40px 0px;
        }
 

    #discussfrmRightPanel .discussFrmComments {
        margin: 30px 0px;
    }

.DFtopPanel .form-control {
    display: block;
    max-width: 300px;
    padding: .375rem .75rem;
    border: 1px solid var(--unnamed-color-f04943);
    background: #FDE3D8 0% 0% no-repeat padding-box;
    border: 1px solid #F04943;
    border-radius: 20px;
    font-size: clamp(0.75rem, 0.3214rem + 0.6696vw, 1.125rem) !important;
    line-height: 1.5;
    color: #F04943 !important;
}

    .DFtopPanel .form-control:focus {
        color: #F04943;
        background-color: #FDE3D8 !important;
        border-color: #F04943;
        outline: 0;
        box-shadow: 0 0 0 0.2rem rgb(160 27 9 / 25%);
    }


.discusspnlCatBtn {
    position: relative;
    display: flex;
    align-items: center;
    flex-direction: column;
    padding: 5% 5% 5% 0%;
    border-top: 2px solid #efefef;
}
.discusspnlCatBtn:first-child {
   
    border-top: 0px solid #efefef;
}
    .discusspnlCatBtn._newsLData:first-child {
        border-top: 2px solid #efefef;
    }

._newsWrapper >  .discusspnlCatBtnContainer:first-child > ._newsLData {
    border-top: 0px solid red;
}

.brdBtm.DFtopPanel {
    border-bottom: 2px solid #efefef;
}

    .discusspnlCatBtn.normal {
        cursor: pointer;
    }

    .discusspnlCatBtn div {
        width: 100%;
    }

    .discusspnlCatBtn .DFCat {
        font-weight: bold;
    }

    .discusspnlCatBtn.normal .DFCat {
        color: #2B3468;
    }

    .discusspnlCatBtn.normal:hover .DFCat {
        color: #F04943;
    }

    .discusspnlCatBtn.selected .DFCat {
        color: #F04943;
        cursor: default;
    }

    .discusspnlCatBtn .DFResponse {
        color: #999;
    }

.discusspnlCatBtnContainer:last-child {
    border-bottom: 2px solid #efefef;
}

.minHeightCls {
    min-height: 430px;
}

#discussfrmRightPanel {
    display: block;
}

#discussfrmLeftPanel #discussfrmRightPanel {
    display: none;
}

@media screen and (max-width: 736px) {
    #discussfrmRightPanel {
        border-left: none;
        padding-Left: 0px;
    }

        #discussfrmRightPanel .discussfrmPanel {
            position: relative;
            padding: 3% 3% 3% 5%;
        }

    #discussfrmRightPanel {
        display: none;
    }

    #discussfrmLeftPanel #discussfrmRightPanel {
        display: block;
    }

    #discussfrmLeftPanel .discussfrmcatagPanel {
        padding-Left: 0%;
    }

    .DFtopPanel {
        padding: 6% 6% 8% 5%;
    }

    .discusspnlCatBtn {
        padding: 5% 5% 5% 5%;
    }
}


/*********/
.marginT7 {
    margin-top: 7px;
}

.learningEnrichmentCls {
    background-color: #fff;
    margin-top: 60px;
    padding-bottom: 30px;
}

    .learningEnrichmentCls.lpEnPage {
        min-height:75vh;
    }


    .learningEnrichmentCls .discussfrmPanel {
        position: relative;
        /* padding: 3% 1.6% 3% 1.6%;*/
        padding-top: 3%;
    }

    .learningEnrichmentCls .discussfrmBodyTxt {
        margin: 50px 0px;
    }

    .learningEnrichmentCls .discussFrmComments {
        margin: 30px 0px;
    }

    .learningEnrichmentCls .discussfrmBodyTxt {
        margin: 50px 0px;
    }

    .learningEnrichmentCls .discussFrmComments {
        margin: 30px 0px;
    }

@media screen and (max-width: 736px) {
    .learningEnrichmentCls #discussPanel {
        border-left: none;
        padding-Left: 0px;
    }

    .learningEnrichmentCls .discussfrmPanel {
        position: relative;
        /*  padding: 3% 22px 3% 22px;*/
    }

    .learningEnrichmentCls #discussPanel {
    }

    .learningEnrichmentCls #discussPanel {
    }
}

.learningEnrichmentCls .P3_Circle {
    height: 60px;
    width: 60px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    padding-top: 0;
    border-radius: 50%;
    line-height: 60px;
    color: #fff;
    text-align: center;
}

    .learningEnrichmentCls .P3_Circle.one {
        background-color: #6EEC8B;
    }

.P3_Circle.two {
    background-color: #FF0057;
}

.learningEnrichmentCls .img1 {
    background-image: url('Images/Page03_backArrow.png');
    background-repeat: no-repeat;
    padding: 0px 20px 20px 49px;
}

.P3BackArrow   {
 
    width: 40px;
    height: 40px;
    display: inline-block;
}
.P3BackArrow a {
    background-image: url('Images/Page03_backArrow.png');
    background-repeat: no-repeat;
    width: 40px;
    height: 40px;
    display: inline-block;
}
    .P3BackArrow:hover a {
        background-image: url('Images/Page03_backArrowHover.png');
        background-repeat: no-repeat;
        width: 40px;
        height: 40px;
        display: inline-block;
        background-position: 0 0px;
        
        border-radius: 25px;
    }
.despSeperator {
    width: 100%;
    height: 1px;
    background-color: #e0e0e3;
    margin: 10px 0px 5px 0px;
}
.learningEnrichmentCls .ddd:before {
    background-image: url('Images/Page03_backArrow.png');
    background-repeat: no-repeat;
    padding: 0px 20px 20px 49px;
}

.learningEnrichmentCls .flexbox {
    display: flex;
}

.learningEnrichmentCls .leftBox {
    flex: 0 0 50px;
}

.learningEnrichmentCls .rightBox {
    flex: 1;
}

.learningEnrichmentCls .blue {
    background: #3b66db;
    flex: 1;
}


/**BIG CALENDAR CSS*/
.calHeaderContainer {
    padding: 0px 10px;
    position: absolute;
    right: 0;
    top: 10px;
    float: right;
    z-index: 1
}

.calendarPage {
    padding: 0px 0px;
    position: relative
}

@media only screen and (max-width:768px) {
    .calendarPage {
        padding: 0px 10px 0px 10px !important;
    }
}

.learnerContent {
    width: 100%;
    float: left;
    padding: 15px;
    position: relative;
    margin-top: 80px;
}

.calendarPage .todayList {
    margin-top: 10px;
}

    .calendarPage .todayList .list {
        margin: 0;
        padding: 0;
        list-style: none
    }

.calendarPage .legendscal li {
    display: inline-block;
    vertical-align: middle;
    font-size: 13px;
    color: #000;
    font-family: 'Arial';
    font-weight: bold;
}

.calendarPage .legendsCustom {
    position: absolute;
    left: 98px;
    top: 21px;
    float: left;
}

.calendarPage .eventLegend {
    width: 12px;
    height: 9px;
    background: #45D9CA;
    display: inline-block;
    margin-right: 5px;
}

.calendarPage .webinarLegend {
    width: 12px;
    height: 9px;
    background: #FFD891;
    display: inline-block;
    margin-right: 5px;
}

.calendarPage .courseLegend {
    width: 12px;
    height: 9px;
    background: #8FC7EF;
    display: inline-block;
    margin-right: 5px;
}

.calendarPage .fc-toolbar .fc-left .fc-today-button {
    color: #000;
    font-family: 'Arial';
    font-weight: bold;
    text-transform: capitalize;
    font-size: 15px;
    margin: 0px 25px 0 0;
    display: inline-block;
    vertical-align: middle;
    background: none;
    border: none;
    padding-left: 15px;
    box-shadow: none;
    outline: none
}

.calendarPage .fc-toolbar {
    margin: 15px 0px 10px;
}

.calendarPage .fc-center button, .calendarPage .fc-center h2 {
    display: inline-block;
    height: 27px;
    vertical-align: middle
}

.calendarPage .fc-center button {
    border: none;
    background: none;
    box-shadow: none;
    outline: none
}

    .calendarPage .fc-center button .fc-icon {
        font-size: 16px
    }

.calendarPage .fc-center h2 {
    color: #333333;
    font-size: 20px;
    margin: 0px 25px;
    display: inline-block;
    font-family: 'Arial';
    font-weight: bold;
    vertical-align: middle
}

.calendarPage .checkboxList {
    text-align: right
}

    .calendarPage .checkboxList li {
        display: inline-block;
        vertical-align: middle;
        font-size: 13px;
        color: #000;
    }

.calendarPage .container {
    display: block;
    color: #000;
    position: relative;
    padding-left: 24px;
    margin-top: 12px;
    font-family: 'Arial';
    font-weight: bold;
    cursor: pointer;
    font-size: 12px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.calendarPage .container {
    padding-left: 24px !important;
    width: auto !important;
    line-height: 20px;
}

    .calendarPage .container input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

.calendarPage .checkmark {
    position: absolute;
    top: 2px;
    left: 0;
    height: 16px;
    width: 16px;
    background-color: #fff;
    border: 1px solid #1A1A1A;
    border-radius: 50%;
}

    .calendarPage .checkmark:after {
        content: "";
        position: absolute;
        display: none;
    }

.calendarPage .container input:checked ~ .checkmark:after {
    display: block;
    border: 1px solid #002d66;
}

.calendarPage .container .checkmark:after {
    left: 4px;
    top: 4px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #002d66;
}

.calendarPage .eventCalendartable .calendarTble {
    width: 100%
}

.calendarPage .eventCalendartable table th {
    padding: 6px 10px;
    font-weight: normal;
    text-transform: uppercase;
    text-align: center;
    color: #000;
    font-size: 15px;
    font-family: 'Arial';
    font-weight: bold;
}

    .calendarPage .eventCalendartable table th:last-child {
        border-right: none
    }

.calendarPage .eventCalendartable .fc-day-top {
    text-align: right;
    color: #333333;
    font-size: 15px;
}

.calendarPage .eventCalendartable .eventDate {
    color: #333333
}

.calendarPage .eventCalendartable .fc-event {
    border-radius: 0;
    border: none
}

.calendarPage .eventCalendartable .eventBg {
    background: #45D9CA;
    padding: 1px 6px;
    margin-bottom: 5px
}

.calendarPage .eventCalendartable .fc-title {
    font-size: 11px;
    color: #000;
    font-family: 'Arial';
    font-weight: bold;
    text-align: left
}

.calendarPage .eventCalendartable .eventdate {
    font-size: 12px;
    color: #000;
    text-align: left
}

.calendarPage .eventCalendartable .webinarBg {
    background: #FFD891;
    padding: 1px 6px;
    margin-bottom: 5px
}

.calendarPage .eventCalendartable .courseBg {
    background: #8FC7EF;
    padding: 1px 6px;
    margin-bottom: 5px
}

.calendarPage .eventCalendartable .fc-more {
    color: #002d66;
    font-family: 'Arial';
    font-weight: bold;
    font-size: 12px;
    text-decoration: underline;
    text-align: left;
    display: block
}

    .calendarPage .eventCalendartable .fc-more:hover {
        text-decoration: none
    }

.calendarPage .fc-popover .fc-header {
    padding: 11px 14px;
}

    .calendarPage .fc-popover .fc-header .fc-title {
        font-size: 13px
    }

.calendarPage .fc-unthemed .fc-popover .fc-header .fc-close {
    font-size: 14px !important;
    margin-top: 2px !important;
    color: #000 !important;
}

.calendarPage .filterBody {
    float: left;
    width: 100%;
    padding: 10px 20px;
    max-height: 710px;
}

@media screen and (max-width: 1440px) {
    .calendarPage .filterBody {
        /* max-height: 430px; */
        max-height: 510px;
        overflow: auto;
    }
}

@media screen and (max-width: 1440px) {
    .calendarPage .filterBody {
        overflow: auto;
    }
}

.eventuploadlistCont {
    padding: 0; /*border-bottom:1px solid #E2E2E2;*/
    margin-bottom: 10px
}

.uploadedEvent li {
    width: 49%;
    float: left;
    margin-left: 1%;
    border-bottom: 1px solid #ccc;
    padding: 2px 10px;
    background: #F5F5F5;
}
/*.uploadedEvent li:last-child{border-bottom:none}*/
.linkscolor {
    color: #0A70B9
}

.centerInput .form-check-label input {
    position: relative;
    top: 2px;
    margin-right: 5px;
}

.centerInput .form-check-label {
    margin: 0px 8px 0 0;
}

.centerInput {
    padding-left: 0 !important
}



.sidebarpoup {
    width: 760px;
    right: -760px;
}

.sidebarpoup {
    width: 560px;
    position: fixed;
    top: 0;
    height: 100vh;
    z-index: 999;
    background: #ffffff;
    color: #333333;
    transition: all 0.3s;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
}

    .sidebarpoup.active {
        right: 0;
    }

.sidebarpoup {
    transition: all 0.3s;
}

    .sidebarpoup .filterWrapp .filterInText {
        padding-left: 0px;
        padding-top: 6px;
        float: left;
        font-size: 18px;
        color: #000000;
        font-weight: bold;
        font-family: 'Arial'; /*font-family: 'Conv_Roboto-Bold';*/
    }

    .sidebarpoup .filterWrapp .filterInText {
        padding-left: 0px;
        padding-top: 6px;
        float: left;
        font-size: 18px;
        color: #000000;
        font-weight: bold;
        font-family: 'Arial'; /*font-family: 'Conv_Roboto-Bold';*/
    }

@media screen and (max-width: 700px) {
    .calendarPage .sidebarpoup {
        width: 100%;
    }
}

.paddLTRT {
    padding: 0px 20px !important
}

.filterHeader {
    float: left;
    width: 100%;
    border-bottom: 2px solid #00B4E6;
    padding-bottom: 8px;
    padding-top: 2px
}

.filterInnHead {
    float: left;
    width: 100%;
    border-bottom: 1px solid #00B4E6;
    padding-bottom: 3px;
    font-family: 'Arial';
    color: #464646;
    font-size: 14px;
    font-weight: bold;
}

    .filterInnHead .filterInText {
        padding-left: 10px;
        padding-top: 15px;
        float: left;
        /* font-size: 14px !important;
            font-family: 'Arial';*/
        font-size: clamp(0.75rem, 0.6066rem + 0.2241vw, 0.8755rem) !important; /*paraText14*/
        color: #989898;
        padding-top: 12px !important;
        font-weight: bold;
    }

    .filterInnHead .faIcon {
        float: right;
        padding-top: 5px;
        padding-right: 10px;
    }


/*Bulk Import Page*/
#filterBody .bulkImport {
    width: 560px;
    right: -560px;
}

#filterBody #sidebarFilter.active {
    right: 0px;
}


#dismissAdd, #dismiss {
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    background: #ffffff;
    position: absolute;
    top: 2px;
    right: 10px;
    cursor: pointer;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

    #dismissAdd:hover, #dismiss:hover {
        background: #fff;
        color: #7386D5;
    }

.pos {
    position: relative !important
}

.viewEvent .heading {
    color: #000000;
    font-family: 'Arial';
    font-weight: bold;
    font-size: 14px;
    margin-bottom: 0px
}

.viewEvent .timetext {
    color: #6A6A6A;
}

.viewEvent .disc {
    color: #8E8E8E
}

.viewEvent .locationText {
    color: #6A6A6A;
    font-family: 'Arial';
    font-weight: bold;
}

.viewEvent .linkText {
    color: #0A70B9
}

.viewEvent .icon {
    display: inline-block;
    padding-right: 5px
}

.viewEvent .bdrbottom {
    border-bottom: 1px solid #8E8E8E;
    padding-bottom: 10px;
    margin-bottom: 6px
}

.viewEvent .viewEventlist li {
    margin-bottom: 5px
}

.mb10 {
    margin-bottom: 10px !important
}

.overlay {
    display: none;
    position: fixed;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.7);
    z-index: 998;
    opacity: 0;
    transition: all 0.5s ease-in-out;
    opacity: 1;
    top: 0
}
/**BIG CALENDAR CSS END*/

/**REQUIRED FIELD*/
.field-validation-error {
    padding: 4px 0px;
    float: left;
    width: 100%;
}

.redColor {
    color: #E41F35 !important;
}

    .redColor.italicWhite {
        color: #fff !important;
        font-style:italic;
    }

.field-validation-error, .noRecord {
    color: #E41F35 !important;
    padding: 5px;
}

#EmailAddress-error, #Password-error {
    /*   margin-left: 34px !important;*/
}


.contactUsError {
    font-style:italic;
    color: yellow !important;
}
/**REQUIRED FIELD END*/

.storiesTitle {
    /* margin-top: 80px;*/
}








/* The containerCustomCHK */
.containerCustomCHK {
    display: block;
    position: relative;
    padding-left: 20px;
    margin-bottom: 12px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    /* containerCustomCHK the browser's default checkbox */
    .containerCustomCHK input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
        visibility: hidden;
    }

    /* Create a custom checkbox */
    .containerCustomCHK .checkmark {
        position: absolute;
        top: 0;
        left: 0;
        height: 20px;
        width: 20px;
        background-color: #fff;
    }

    /* On mouse-over, add a grey background color */
    .containerCustomCHK:hover input ~ .checkmark {
        background-color: #FCC7C8;
        background-color: #fff;
        /* border: 1px solid #273368;*/
    }

    /* When the checkbox is checked, add a blue background */
    .containerCustomCHK input:checked ~ .checkmark {
        background-color: #fff;
        /*border: 1px solid #273368;*/
    }

    /* Create the checkmark/indicator (hidden when not checked) */
    .containerCustomCHK .checkmark:after {
        content: "";
        position: absolute;
        display: none;
    }

    /* Show the checkmark when checked */
    .containerCustomCHK input:checked ~ .checkmark:after {
        display: block;
    }

    /* Style the checkmark/indicator */
    .containerCustomCHK .checkmark:after {
        left: 7px;
        top: 4px;
        width: 5px;
        height: 10px;
        border: solid #273368;
        border-width: 0 3px 3px 0;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
    }




/* The containerCustomCHK end */
/* The containerCustomRDO  */

/* Radio Button CSS */
.OptionRadioWrap {
    margin: 0 auto;
    /* position: relative; */
    width: 20px;
    padding: 0px !important;
    height: 20px;
    padding-top: 5px !important;
}

.containerCustomRDO {
    display: block;
    position: relative !important;
    line-height: 1.4;
    /*padding-left: 35px !important;*/
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 250px !important;
}

    .containerCustomRDO._width {
        width: 20px !important;
    }
    /* Hide the browser's default radio button */
    .containerCustomRDO input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
    }

/* Create a custom radio button */
.containerCustomRDO {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #FFFFFF;
    border-radius: 50%;
    display: flex;
    align-items: center;
}

    .containerCustomRDO .checkmark1 {
        position: absolute;
        top: 0;
        left: 0;
        height: 20px;
        width: 20px;
        background-color: #fff;
    }
    /* On mouse-over, add a grey background color */
    .containerCustomRDO:hover input ~ .checkmark1 {
        background-color: #fff;
        border: 1px solid #273368;
    }

    .containerCustomRDO .checkmark1:hover {
        background-color: #fff;
        border: 1px solid #273368;
    }

    /* When the radio button is checked, add a blue background */
    .containerCustomRDO input:checked ~ .checkmark1 {
        background-color: #fff;
        border: 1px solid #273368;
    }

    /* Create the indicator (the dot/circle - hidden when not checked) */
    .containerCustomRDO:after {
        content: "";
        position: absolute;
        display: none;
    }

    /* Show the indicator (dot/circle) when checked */
    .containerCustomRDO input:checked ~ .checkmark1:after {
        display: block;
    }

    /* Style the indicator (dot/circle) */
    .containerCustomRDO .checkmark1:after {
        top: 5px;
        left: 5px;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: #AE191B;
    }

    .containerCustomRDO .checkmark1:after {
        background: #273368;
    }






#sheenCatlog {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
  /*  background: #fff;
    opacity: 0.5;*/
    /* z-index: 1;*/
    z-index: 10; /**  1 to 2 a9 feb*/
    display: none;
    background: rgba(0, 0, 0, 0.5);
}
.P4MenuBg{
  /*  z-index:25!important;*/
    z-index:10!important;
}

.catInput {
    padding: 30px 50px 20px 0px;
}

    .catInput .form-control1.whiteB:focus {
        background-color: #FFF !important;
      /*  background-color: #FCC7C8 !important;*/
    }



.pdfmangmnt{
	    height: 20px;
    margin-top: -10px;
}

.learnerroot {
    position: relative;
    /* min-height: 545px;*/
    min-height: 615px;
    min-height: calc( 100vh - 60px );
    background: #fff;
    padding-bottom: 80px;
    background-color: #fafafb;
    /* admin side css */
}

#adminroot {
    position: relative;
    min-height: 545px;
    min-height: calc( 100vh - 60px );
    padding-bottom: 0px;
    /*margin-bottom: 80px;*/
}
    #adminroot .discussForumWrapper.marginT60 {
        margin-top:0px;
    }
.footBar.learner {
}

.footBar.admin {
}

.footBar {
    background-color: #666666;
    color: #fff;
    height: 60px;
    align-items: center;
    padding: 0 5px;
    position: relative;
    width: 100%;
    bottom: 0px;
    z-index: 4;
    max-width:1920px;
    margin:0 auto;

}

@media screen and (max-width: 766px) {
    #adminroot.MmarginT80 {
        /*     margin-top: 60px;*/
        margin-top: 80px;
    }
    #adminroot.MmarginT80 {
        /*     margin-top: 60px;*/
        margin-top: 120px;
    }
}


/*Knnwoledges nagets*/
.custom-container {
    margin: 0 auto;
    max-width: 1920px;
    width: 100%;
    padding: 0 25px;
}

.BGWraper .knuggests-admin-wrapper.custom-container {
    /*    max-width: 1920px;
    margin: 0 auto;
    width: 100%;
    padding: 0 0px !important;*/
}

.custom-container.knuggests-admin-wrapper {
    padding: 0 30px;
}

.stories-for-columnrow .col-md-6 {
    padding: 0 5px;
}

    .stories-for-columnrow .col-md-6:first-child, .stories-for-columnrow .col-md-6:nth-child(1n) {
        padding-right: 5px;
    }

    .stories-for-columnrow .col-md-6:first-child, .stories-for-columnrow .col-md-6:nth-child(3n) {
        padding-right: 5px;
    }

    .stories-for-columnrow .col-md-6:first-child, .stories-for-columnrow .col-md-6:nth-child(2n) {
        padding-left: 5px;
    }

    .stories-for-columnrow .col-md-6:last-child, .stories-for-columnrow .col-md-6:nth-child(3n) {
        padding-top: 10px;
        padding-left: 5px;
    }

.stories-today-box {
    width: auto;
}


.stories-today-thumb {
    display: block;
}

    .stories-today-thumb img {
        height: 100%;
        /* object-fit: cover;*/
        width: 100%;
        position: absolute;
        left: 0;
        top: 0;
    }

.stories-today-smallthumb {
    height: 100%;
}

    .stories-today-smallthumb img {
        object-fit: cover;
        height: 100%;
        width: 100%;
    }

@media screen and (max-width:991px) {




    #SubBar.custom-container {
        /*  padding-top:15px !important;
            padding-bottom:15px !important;*/
    }

    .custom-container {
        padding: 0 30px !important;
    }

        .custom-container.container-fluid.learnerroot {
            padding: 0 0px !important;
        }
}

@media screen and (max-width: 768px) {
    .subar-lists {
        flex-direction: column;
    }

    #SubBar.assignmentsSubBar, #SubBar {
        padding-top: 15px !important;
        padding-bottom: 15px !important;
    }

    .clsMTTopMenu.MaintextColor3.BoldTxt::after {
        width: auto !important;
    }

    .subar-lists li {
        padding: 0;
    }

    .Admin-ConsoleBG {
        padding: 0 !important;
    }
}

@media screen and (max-width:768px) {
    #SubBar.custom-container {
        padding-top: 15px !important;
        padding-bottom: 15px !important;
    }

    .subar-lists li {
        width: auto !important;
        padding: 0 !important;
    }
}

@media screen and (max-width:767px) {
    .stories-today-box {
        width: 100%;
        margin: 0 0 0px 0 !important;
        padding-right: 0;
        height: auto;
        overflow: hidden;
    }

    .secretesOfCls {
        margin-bottom: 20px !important;
    }

    .stories-for-columnrow .col-md-6:first-child, .stories-for-columnrow .col-md-6:nth-child(3n) {
        padding-left: 0;
    }

    .stories-for-columnrow .col-md-6:last-child, .stories-for-columnrow .col-md-6:nth-child(2n) {
        padding-right: 0;
    }

    .stories-today-thumb img {
        position: relative !important;
    }
}

@media screen and (max-width:574px) {
    .secretesOfCls {
        margin-bottom: 20px !important;
    }

    .stories-for-columnrow .col-md-6 {
        padding: 0 0px !important;
    }

        .stories-for-columnrow .col-md-6:nth-child(3n) {
            padding-right: 0px !important;
            padding-left: 0px !important;
            margin-bottom: 20px;
        }

        .stories-for-columnrow .col-md-6:first-child {
            margin-bottom: 20px;
        }

        .stories-for-columnrow .col-md-6:nth-child(2n) {
            margin-bottom: 20px;
        }

    .secretesOfCls {
        margin-bottom: 20px !important;
    }
}


.learnerroot .KNP_Wrapper {
    position: relative;
    margin-top: 140px!important;
}


@media screen and (max-width: 768px) {
    .learnerroot .KNP_Wrapper {
      
        margin-top: 80px !important;
    }
    }

    #adminroot .KNP_Wrapper {
        position: relative;
        margin-top: 20px !important;
    }

    .divStoriesToday {
        position: relative;
        margin-top: 0px;
    }

    #adminroot .divStoriesToday {
        position: relative;
        margin-top: 0px !important;
    }

    .videoDiscussion {
        position: relative;
        margin-top: 70px;
    }

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

        .videoDiscussion {
            position: relative;
            margin-top: 80px;
        }
    }

    @media screen and (max-width: 968px) {

        .videoDiscussion {
            position: relative;
            margin-top: 70px;
        }
    }
    /*Knnwoledges nagets end*/
    .activeInactiveWrap .tgl-sw + .btn-switch {
        width: 25px !important;
        height: 16px !important;
    }

        .activeInactiveWrap .tgl-sw + .btn-switch:after, .tgl-sw + .btn-switch:before {
            width: 50% !important;
        }

    .activeInactiveWrap .tgl-sw-ios-checked + .btn-switch {
        background: #05B7BE !important;
        /* background: #F04943 !important; */
    }

    .activeInactiveWrap .tgl-sw-ios + .btn-switch {
        border: 0px solid #F0494340;
    }

        .activeInactiveWrap .tgl-sw-ios + .btn-switch:after {
            background: #fff;
        }

    .activeInactiveWrap .switchbutton {
        padding-top: 2px;
    }

    .activeInactiveWrap .inactiveText, .activeInactiveWrap .activeText {
        padding-top: 0px;
    }

    .activeInactiveWrap .lastUpdate1 {
        color: #666;
        margin-top: 0px !important;
        padding-right: 0px !important;
        margin-bottom: 0 !important;
    }

    .activeInactiveWrap .tgl-sw-active + .btn-switch:after {
        left: 50% !important;
        width: 50% !important;
    }


    /*****************************/
    .discusspnlCatBtn .chat-right-icon {
        position: absolute;
        right: 2px;
        top: 0;
        width: auto;
        display: flex;
        align-items: center;
        gap: 10px;
    }

        .discusspnlCatBtn .chat-right-icon .icon-box {
            position: relative;
            width: auto;
        }

    .red-dot {
        position: absolute;
        width: 7px;
        height: 7px;
        background: #F04943;
        border-radius: 100%;
        top: 4px;
        right: 2px;
    }

    .discussFrmComments:nth-child(odd) .user-thumb {
        background: rgba(110, 236, 140, 0.5);
    }

    .discussFrmComments:nth-child(even) .user-thumb {
        background: rgba(255, 0, 85, 0.5);
    }

    .discussFrmComments .user-thumb {
        width: 60px;
        height: 60px;
        display: flex;
        align-items: center;
        min-width: 60px;
        border-radius: 50%;
        justify-content: center;
    }

    .user-thumbTxt {
        background-color: #A1F237;
        text-transform: uppercase;
        color: #fff;
    }

    .discussAddComments .user-thumb {
        width: 60px;
        height: 60px;
        min-width: 60px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .tolltips-right-box {
        position: absolute;
        right: 0;
        top: 0;
        display: flex;
        align-items: center;
    }

    .tooltip_box {
        margin: 0 0 0 7px;
        padding-bottom: 2px;
        border-bottom: 2px solid transparent;
    }

    .tolltips-right-box .tooltip-text {
        visibility: hidden;
        width: auto;
        background: #273368;
        color: #fff;
        text-align: center;
        border-radius: 5px 5px 0px 5px;
        padding: 0px 10px;
        height: 30px;
        line-height: 30px;
        display: flex;
        align-items: center;
        /* Position the tooltip */
        position: absolute;
        z-index: 1;
        bottom: 100%;
        right: 0;
        color: #fff;
        margin-bottom: 1px;
    }

    .tolltips-right-box .approve .tooltip-text {
        right: 30px;
    }

    .tooltip_box:hover {
        border-bottom: 2px solid #273368;
    }

    .tolltips-right-box .tooltip_box:hover .tooltip-text {
        visibility: visible;
    }





    .UserRatingsForAdmin.tolltips-right-box {
        position: absolute;
        left: 0;
        top: 0;
        display: flex;
        align-items: center;
    }

    .UserRatingsForAdmin .tooltip_box {
        margin: 0 0 0 7px;
        padding-bottom: 2px;
        border-bottom: 2px solid transparent;
    }

    .UserRatingsForAdmin.tolltips-right-box .tooltip-text {
        visibility: hidden;
        width: auto;
        background: #273368;
        color: #fff;
        text-align: center;
        border-radius: 5px 5px 0px 5px;
        padding: 0px 10px;
        height: 30px;
        line-height: 30px;
        display: flex;
        align-items: center;
        /* Position the tooltip */
        position: absolute;
        z-index: 1;
        bottom: 100%;
        right: -53px;
        color: #fff;
        margin-bottom: 1px;
    }

    .UserRatingsForAdmin.tolltips-right-box .approve .tooltip-text {
        right: -25px;
    }

    .UserRatingsForAdmin .tooltip_box:hover {
        border-bottom: 2px solid #273368;
    }

    .UserRatingsForAdmin.tolltips-right-box .tooltip_box:hover .tooltip-text {
        visibility: visible;
    }


    .DFtopPanel.white-bg-selectbox .form-control {
        background: transparent;
        border-radius: 5px;
        padding: 5px;
        border: 1px solid #999999;
        color: #666666 !important;
    }

        .DFtopPanel.white-bg-selectbox .form-control:focus {
            color: #F04943 !important;
        }

    .discusspnlCat-titles {
        position: relative;
        max-width: max-content;
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        padding-right: 60px;
    }



    @media screen and (max-width: 767px) {

        .discussAddComments .user-thumb {
            width: 70px !important;
            height: 70px;
            min-width: 70px;
        }

        .discussFrmComments .user-thumb {
            width: 50px;
            height: 50px;
            min-width: 50px;
        }

        .tolltips-right-box .tooltip-text {
            margin-bottom: 3px;
        }
    }
    /*****************************/
    .clsFot1 {
        justify-content: flex-end;
        background: #273368;
        width: 100%;
        height: 60px;
        padding: 0px;
        width: 675px;
    }

    .clsFotHT1 {
        height: 60px;
    }

    .clsFot2 {
        bottom: 0;
        position: absolute;
        display: none
    }

    .w1_100 {
        width: 100%;
    }

    .footerSubmitBG {
        background-color: #273368 !important;
    }

    .footerSubmitBtnPad {
        padding: 0.375rem 0.95rem;
        border-radius: 1.25rem;
    }

    .thiredlevelmenu {
        background: none !important
    }

    .successBoxTextCls1 {
        margin-bottom: 10px !important
    }

    .editAnnouncementsCls1 {
        position: absolute;
        right: 20px;
    }

    .chatHeader {
        padding-right: 10px;
    }

    .foot3 {
        justify-content: flex-end;
        background: #273368;
        width: 100%;
        height: 60px;
        padding: 0px;
        width: 675px;
    }

    .foot3_HT {
        height: 60px;
    }
    /*****************************/
    .bodyScrollHidden {
        overflow-y: hidden !important;
    }

    /*.linkHover img {
    max-width: 100%;
    height: auto;
}*/
    .SmallThumbs {
        width: 20px;
        height: 25px;
        margin-right: 8px;
    }

        .SmallThumbs img {
            width: auto;
            height: auto;
        }

    .custom-container-no-padding {
        max-width: 1920px;
        margin: 0 auto;
        width: 100%;
        padding: 0 0px !important;
    }

    .minHT100vh {
        min-height: calc( 100vh - 60px );
    }
    /*.pageMenuSubBar + .row {
    max-width: 1920px;
    margin: 0 auto;
    width: 100%;
    padding: 0 0px !important;
}*/
    .tblBGWraper custom-container-no-padding {
        max-width: 1920px;
        margin: 0 auto;
        width: 100%;
        padding: 0 0px !important;
    }

    .wrappBG_1920 {
        max-width: 1920px;
        margin: 0 auto;
        width: 100%;
    }

        .wrappBG_1920._pad0 {
            max-width: 1920px;
            padding: 0px !important;
        }

    .wrappBG {
        max-width: 1920px;
        margin: 0 auto;
        width: 100%;
        padding: 0 0px !important;
    }


    /***********************************/

    .subar-lists {
        margin-bottom: 0;
    }

        .subar-lists li {
            width: auto !important;
            padding: 0 5%;
        }

            .subar-lists li.adminTopMenuList {
                width: auto !important;
                padding: 0 25px;
            }

    @media screen and (max-width: 768px) {
        .subar-lists {
            flex-direction: column;
        }

        #SubBar.assignmentsSubBar {
            padding-top: 15px !important;
            padding-bottom: 15px !important;
        }

        .clsMTTopMenu.MaintextColor3.BoldTxt::after {
            width: auto !important;
        }
    }
    /***********************************/
    .validCls1 {
        width: 100%;
        float: left
    }

    .validCls2 {
        width: 100%;
        float: left
    }


    /**************************/


    .layoutCls1 {
        width: 100%;
        height: 60px;
        justify-content: space-between;
        gap: 20px;
    }

    .layoutCls2 {
        width: 100%;
        position: relative;
        top: 80px;
        z-index: 2;
    }

    .layoutCls3 {
        padding: 15px 0;
    }

    .topBarLeftMenu._w {
        width: auto;
    }

    ._w100 {
        width: 100%;
    }

    ._wAuto {
        width: auto;
    }
    /**************************/


    .scpreLineP {
        height: 15px;
        width: 100%;
        border-bottom: 1px solid #CCCCCC;
    }

    .lineHT1_2 {
        line-height: 1.2;
    }

    /*************************************/
    .LPO .padding_L15 {
        padding-left: 15px !important;
    }

    .padding_L25 {
        padding-left: 25px !important;
    }

    /*******************login updates ******************/
    .padding30 {
        padding: 30px;
    }

    #frmLogin, #frmSubmit {
        padding-bottom: 0px;
    }

    .bannerImg .bannerText {
        padding: 40px !important;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        max-width: 500px;
        margin: 0 auto;
    }

    .bannerImg {
        position: relative;
    }

    .bannerContainer {
        position: relative;
    }

    a.footerLink {
        color: #fff !important;
    }

    /*     .footer-copyright {
        position: relative;
         width: 100%;
    } */
    ._Template_minHT {
        /*min-height: 515px;*/
        min-height: calc( 100vh - 60px );
    }

        ._Template_minHT.ContactUs {
            /*min-height: 515px;*/
            min-height: calc( 100vh - 60px );
            min-height: 1030px;
        }

    .footer-copyright {
        position: relative;
        bottom: 0;
        left: 0;
        width: 100%;
    }


    .bannerImg, .ForgotPasswordImg {
        position: relative;
        height: calc(100vh - 58px);
        min-height: 600px;
        min-height: 735px;
        max-height: 100vh;
        padding: 20px 0;
    }



    .LoginTextContainer {
        line-height: 50px;
        align-items: center;
    }

    .LoginPageSeperator {
        height: auto;
        margin-top: 0;
    }


    .ForgotPasswordImg {
        padding-top: 90px;
        position: relative;
    }

        .ForgotPasswordImg .ForgotPasswordDiv {
            position: relative;
            padding: 40px !important;
            margin: 0 auto;
            max-width: 500px;
        }


    .LoginButton {
        border: 2px solid #F8F8F880;
        background: transparent;
        color: #F8F8F880;
    }

        .LoginButton:hover, .LoginButton:focus {
            background: rgba(255,255,255,0.4);
            color: #2B3468;
            border: 0px solid #F8F8F880 !important;
        }

    .LoginPageContactUs {
        cursor: pointer;
    }

    .ContactUsText {
        top: 0;
        max-width: 800px;
        padding: 40px 120px 40px 120px;
        margin: 0 auto;
        width: 100%;
        min-height: 1200px;
    }

    .ContactUsBg {
        height: auto;
        position: relative;
        /*  min-height: 1140px;*/
        min-height: 1030px;
        padding: 20px 0px;
    }




    @media screen and (max-width: 991px) {
        .ForgotPasswordImg {
            padding-top: 0px !important;
        }

            .ForgotPasswordImg .ForgotPasswordDiv {
                display: flex;
                align-items: center;
                justify-content: center;
                flex-direction: column;
                max-width: 500px;
                margin: 0 auto;
                padding: 40px !important;
            }
    }

    @media screen and (max-width: 767px) {
        .LoginTextContainer {
            height: 45px;
            line-height: 45px;
        }

        .LoginOtherButton, .LoginButton {
            height: 45px;
            line-height: 42px !important;
        }

        .ContactUsText {
            padding: 40px 30px 40px 30px;
        }

        .bannerImg .bannerText, .ForgotPasswordImg .ForgotPasswordDiv {
            padding: 30px 15px !important;
        }
    }

    .footerClr {
        background: #666666;
    }

    .BeforeFullwidth {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }
    /*************************************/
    .lineLogin {
        width: 100%;
        height: 1px;
        background-color: #F8F8F880;
        margin-bottom: 15px;
    }


    .menuanchorsubmenuhover {
        background: rgba(255,255,255,0.25) !important;
        color: #ffffff !important;
        transition: 300ms all !important;
    }

    .menuanchormainmenuhover {
        background: rgba(255,255,255,0.25) !important;
        transition: 300ms all !important;
        color: #ffffff !important;
    }

    .minHT_1500 {
        min-height: 1250px;
    }


    .menuHideSheen {
        width: 100%;
        height: 100vh;
        background: transparent;
        left: 0;
        top: 0;
        /* z-index: 2;*/
        z-index: 15; /*  2 to 10  19 feb **/
        height: 100%;
        position: fixed;
        background: rgba(0, 0, 0, 0.5);
        display: none;
    }

    ._menuTitleCls {
        line-height: 1.2;
        color: #666;
        padding-left: 25px;
    }

    .jconfirm-content-pane {
        font-size: clamp(0.75rem, 0.6066rem + 0.2241vw, 0.8755rem) !important;
    }

    .xxxx1 {
        background-color: red;
    }

    /*** tooltip ****/
    .overflowVisible {
        overflow: visible !important;
    }

    .activity .tooltip_txt {
        position: relative;
    }

        .activity .tooltip_txt .top {
            border: 0;
            background: #666;
            color: #fff;
            left: 0;
            margin-left: 29px;
            bottom: 128%;
            min-width: auto;
            text-align: center;
            position: absolute;
            border: 2px solid #fff;
            /* line-height: 26px; */
            height: auto;
            padding: 5px 10px;
            z-index: 1;
            width: max-content;
            max-width: 190px;
            flex: 0 0 auto;
            white-space: normal;
            overflow: visible !important;
            transform: none;
            box-shadow: 0px 2px 4px #999;
            top: auto;
            display: none;
        }

    .activity .ticon-thumb:hover ~ .top {
        display: block;
    }


    .activity .tooltip_txt .top span {
        display: flex;
        width: 100%;
        flex: 0 0 100%;
    }


    .activity .tooltip_txt .top i {
        width: 24px;
        padding-bottom: 0;
        position: absolute;
        border-bottom: 2px solid #fff;
        border-right: 2px solid transparent;
        border-left: 2px solid transparent;
        overflow: hidden;
        left: -22px;
        transform: rotate(-45deg);
        top: -2px;
        z-index: -1;
        height: 46px;
        position: absolute;
        bottom: -15px;
        top: auto;
    }

        .activity .tooltip_txt .top i:after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0px;
            width: 100%;
            height: 100%;
            /* border-top: 2px solid #fff; */
            border-left: 2px solid #fff;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            -webkit-transform-origin: 0 100%;
            -ms-transform-origin: 0 100%;
            transform-origin: 0 100%;
            -webkit-transform: rotate(46deg);
            -ms-transform: rotate(46deg);
            transform: rotate(46deg);
            z-index: -1;
            background: #666;
        }

    .tooltip_txt:hover .top {
        display: block;
    }







    .activity .tooltip_txt .bottom {
        border: 0;
        background: #666;
        color: #fff;
        left: 0;
        margin-left: 24px;
        bottom: auto;
        min-width: auto;
        text-align: left;
        position: absolute;
        border: 2px solid #fff;
        /* line-height: 26px; */
        height: auto;
        padding: 5px 10px;
        z-index: 1;
        width: max-content;
        max-width: 190px;
        max-width: 300px;
        flex: 0 0 auto;
        white-space: normal;
        overflow: visible !important;
        transform: none;
        box-shadow: 0px 2px 4px #999;
        top: 141%;
        display: none;
    }


        .activity .tooltip_txt .bottom.mrg15 {
            margin-left: 15px;
        }

        .activity .tooltip_txt .bottom span {
            display: flex;
            width: 100%;
            flex: 0 0 100%;
        }


        .activity .tooltip_txt .bottom i {
            position: absolute;
            padding-bottom: 0;
            position: absolute;
            border-bottom: 2px solid #fff;
            border-right: 2px solid transparent;
            border-left: 2px solid transparent;
            overflow: hidden;
            left: -1px;
            transform: rotate(-270deg);
            top: -2px;
            z-index: -1;
            /* width: 24px;
        height: 26px;
           bottom: -12px;
        top: -21px;
       */
            width: 20px;
            height: 22px;
            bottom: -12px;
            top: -19px;
        }

            .activity .tooltip_txt .bottom i:after {
                content: '';
                position: absolute;
                bottom: 0;
                left: 0px;
                width: 100%;
                height: 100%;
                /* border-top: 2px solid #fff; */
                border-left: 2px solid #fff;
                -moz-box-sizing: border-box;
                box-sizing: border-box;
                -webkit-transform-origin: 0 100%;
                -ms-transform-origin: 0 100%;
                transform-origin: 0 100%;
                -webkit-transform: rotate(46deg);
                -ms-transform: rotate(46deg);
                transform: rotate(46deg);
                z-index: -1;
                background: #666;
            }

    .activity .tooltip_txt:hover .bottom {
        display: block;
    }



    .activity .tooltip_txt .top::after {
        content: '';
        display: none;
    }


    .activity .tooltip_txt .left {
        border: 0;
        background: #666;
        color: #fff;
        left: 41px;
        margin-left: 17px;
        bottom: auto;
        min-width: auto;
        text-align: center;
        position: absolute;
        border: 2px solid #fff;
        /* line-height: 26px; */
        height: auto;
        padding: 5px 10px;
        z-index: 1;
        width: max-content;
        max-width: 190px;
        flex: 0 0 auto;
        white-space: normal;
        overflow: visible !important;
        transform: none;
        box-shadow: 0px 2px 4px #999;
        top: 50%;
        display: none;
    }

        .activity .tooltip_txt .left span {
            display: flex;
            width: 100%;
            flex: 0 0 100%;
        }


        .activity .tooltip_txt .left i {
            width: 30px;
            padding-bottom: 0;
            position: absolute;
            border-bottom: 2px solid #fff;
            border-right: 2px solid transparent;
            border-left: 2px solid transparent;
            overflow: hidden;
            left: -17px;
            transform: rotate(-315deg);
            top: -2px;
            z-index: -1;
            height: 26px;
            position: absolute;
            bottom: -12px;
            top: -14px;
        }

            .activity .tooltip_txt .left i:after {
                content: '';
                position: absolute;
                bottom: 0;
                left: 0px;
                width: 100%;
                height: 100%;
                /* border-top: 2px solid #fff; */
                border-left: 2px solid #fff;
                -moz-box-sizing: border-box;
                box-sizing: border-box;
                -webkit-transform-origin: 0 100%;
                -ms-transform-origin: 0 100%;
                transform-origin: 0 100%;
                -webkit-transform: rotate(46deg);
                -ms-transform: rotate(46deg);
                transform: rotate(46deg);
                z-index: -1;
                background: #666;
            }

    .activity .tooltip_txt:hover .left {
        display: block;
    }



    /**************************/

    /*** 10-2-23 ***/
    .topBarRightMenu {
        align-items: center;
    }

        .topBarRightMenu .top-right-mainlist ul {
            margin: 0;
            padding: 0;
            list-style: none;
            display: flex;
            align-items: center;
        }

        .topBarRightMenu .top-right-mainlist {
            /* margin-right: 4px;*/
            margin-right: 0px;
        }

            .topBarRightMenu .top-right-mainlist ul li {
                display: inline-block;
                /* margin-right: 8px;*/
                margin-right: 0px;
            }

                .topBarRightMenu .top-right-mainlist ul li a.LO {
                    height: 35px;
                    width: 35px;
                    border-radius: 50%;
                    border: 1px solid transparent;
                    background: #fde3d8;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    text-transform: none;
                    text-decoration: none;
                }

                /*
                .topBarRightMenu .top-right-mainlist ul li a.LO:hover {
                    border: 1px solid #f04943;
                }
*/


                .topBarRightMenu .top-right-mainlist ul li.login-itext a.LO {
                    width: auto;
                    background: transparent;
                    border: 0;
                }

                .topBarRightMenu .top-right-mainlist ul li.help-itext a.LO {
                    width: auto;
                    background: transparent;
                    border: 0;
                }

    .l-icon {
        width: 35px;
        height: 35px;
        border-radius: 50%;
        border: 1px solid transparent;
        background: #fde3d8;
        display: flex;
        align-items: center;
        justify-content: center;
        text-transform: none;
        text-decoration: none;
    }

    .topBarRightMenu .top-right-mainlist ul li.login-itext a.LO:hover .l-icon {
        border: 1px solid #f04943;
    }

    .topBarRightMenu .top-right-mainlist ul li.login-itext a.LO.disabled:hover .l-icon {
        border: 0px solid #f04943;
    }

    .topBarRightMenu .top-right-mainlist ul li.help-itext a.LO:hover .l-icon {
        border: 1px solid #f04943;
    }

    .topBarRightMenu .top-right-mainlist ul li.help-itext a.LO.disabled:hover .l-icon {
        border: 0px solid #f04943;
    }

    .topBarRightMenu .top-right-mainlist ul li.Anouncement-itext a.LO:hover .l-icon {
        border: 1px solid #f04943;
    }

    .topBarRightMenu .top-right-mainlist ul li.Anouncement-itext a.LO.disabled:hover .l-icon {
        border: 0px solid #f04943;
    }
.topBarRightMenu .top-right-mainlist ul li.addCart-itext a.LO:hover .l-icon {
    border: 1px solid #f04943;
}

.topBarRightMenu .top-right-mainlist ul li.addCart-itext a.LO.disabled:hover .l-icon {
    border: 0px solid #f04943;
}
.annReadMore {
    display:inline-block;
}
    #hrefAnnounce {
        display: block;
        position: relative;
    }

    .hrefAnnounceCnt {
        position: absolute;
        top: -3px;
        right: -4px;
        height: 12px;
        width: 12px;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #fff;
        background-image: url('/Images/Generic/New_Announcement.png');
    }

.hrefAddCnt {
    position: absolute;
    top: -4px;
    right: -5px;
    height: 13px;
    width: 13px;
    /*    display: flex;
    justify-content: center;
    align-items: center;*/
    color: #fff;
    border-radius: 25px;
    font-size: 9px;
    background: #f04943;
    text-align: center;
    display: block;
}

.hrefAddCartCls {
    display: block;
    position: relative;
}

.addCart img {
    margin-top: 2px;
    margin-right: 2px;
}
    .relContentWrap {
        position: relative;
        max-width: 1920px;
        margin: 0 auto;
    }

    .absContentWrap {
        position: absolute;
        right: 0;
        width: 500px;
        height: 100%;
    }

    /**************************/
    /*** 13-2-23 ***/
    .narrow-thumb {
        height: 40px;
        width: 40px;
        border: 1px solid transparent;
        border-radius: 50%;
        background: #FDE3D8;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-right: 10px;
    }

    .narrow-search-btn {
        cursor: pointer;
    }

        .narrow-search-btn:hover .narrow-thumb {
            border: 1px solid #F04943;
        }

    /*********/
    .inprog-btn {
        border-radius: 25px;
        background: #ffaa00;
        display: flex;
        align-items: center;
        line-height: 40px;
        height: 40px;
        width: auto;
        align-items: center;
        max-width: max-content;
        padding: 0 30px 0 15px;
        cursor: default;
    }

        .inprog-btn.inProgress {
            background: #ffaa00;
        }

        .inprog-btn.complete {
            background: #08c19b;
        }

        .inprog-btn.tobegin {
            background: #0096ff;
        }

        .inprog-btn.inProgress {
            background: #ffaa00;
        }

        .inprog-btn.complete span {
            background: #08c19b;
        }

        .inprog-btn.tobegin span {
            background: #0096ff;
        }

    .inner-r-circle {
        position: absolute;
        left: 7px;
        height: 27px;
        width: 27px;
        background: #fff;
        border-radius: 50%;
        display: flex;
    }

        .inner-r-circle img {
            width: 100%;
            height: auto;
        }

    .in-progress-right .percircle.big {
        font-size: 145px;
        background: #0096ff;
    }

    .in-progress-right .percircle.big {
        font-size: 145px;
        background: #0096ff;
    }

    .in-progress-right .percircle.big {
        font-size: 145px;
        background: #0096ff;
    }

        .in-progress-right .percircle.big.blue {
            font-size: 145px;
            background: #0096ff;
        }

    .PercentageCircle1 .bar {
        border-color: #08C19B !important;
    }

    .in-progress-right .percircle.big.orange {
        font-size: 145px;
        background: #ffaa00;
    }

    .in-progress-right .percircle.big.green {
        font-size: 145px;
        background: #08c19b;
    }

    .in-progress-main {
        max-width: 285px;
    }

    .in-progress-right .common-btn {
        max-width: max-content;
        padding: 0px 20px;
        height: 35px;
        line-height: 35px;
        border-radius: 20px;
        background: #fde3d8;
        box-shadow: 0px 2px 5px #ccc;
        color: #F04943;
        margin: 0 25px;
        cursor: pointer;
    }


    .in-progress-right .assign-green-circle {
        height: 9px;
        width: 9px;
        border-radius: 50%;
        position: relative;
        top: 4px;
    }

        .in-progress-right .assign-green-circle.blue {
            background: #0096ff;
        }

        .in-progress-right .assign-green-circle.orange {
            background: #ffaa00;
        }

        .in-progress-right .assign-green-circle.green {
            background: #08c19b;
        }

    .in-progress-main .percircle.green .bar, .in-progress-main .percircle.green .fill, .in-progress-main .percircle.green.gt50 .fill {
        border-color: #08c19b;
    }

    .in-progress-main .percircle > span {
        top: 50%;
        height: 100%;
        position: absolute;
        transform: translateY(-50%);
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    /*********/


    .btnleft {
        display: flex;
        align-items: center;
        cursor: pointer;
    }

        .btnleft .back-btn {
            height: 40px;
            width: 40px;
            border: 1px solid #F04943;
            border-radius: 50%;
            background: #fff;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-right: 10px;
        }

    .textDecorationNone {
        text-decoration: none !important;
    }

    .btnleft:hover {
        /*  color: rgb(240, 73, 67);*/
    }

    /*********/

    .announcementMarqee {
        width: 100%;
        position: relative;
        top: 0px;
        z-index: 1;
    }

    /*.btnThumbnailImg:hover .btnSheenPatch {
    transform: scale(0.95);
    background-color: rgba(00,00,00,0.35);
}*/
    .btnThumbnail .btnSheenPatch {
        transition: transform .2s;
    }

    /*  KN page mobile*/
    @media screen and (max-width: 912px) {
        #SubBar.LearnerSubBar {
            min-height: 60px !important;
        }
    }

    /*  admin page mobile*/
    @media screen and (max-width: 912px) {
        #adminroot.marginT120 {
            margin-top: 60px;
        }
    }

    @media only screen and (min-width: 769px) and (max-width: 1024px) {
        #adminroot.marginT120 {
            margin-top: 120px;
        }
    }


    @media screen and (max-width: 768px) {
        #SubBar.LearnerSubBar {
            position: relative;
        }

        .divStoriesToday {
            margin-top: 60px !important;
        }
        /**  for mobile admin side*/
        #topBar_1 {
            position: relative !important;
            min-height: 60px !important;
        }

            #topBar_1 .top-bar-inner {
                position: relative !important;
                min-height: 60px !important;
            }

        #SubBar_1.InsideTopBar_1_W100 {
            position: relative !important;
            min-height: 60px !important;
            padding-top: 15px !important;
            padding-bottom: 15px !important;
            left: -15px;
            right: 0px;
        }
    }

    /*  KN page mobile end*/


    /*** 17-2-23 ***/

    .percircle .bar, .percircle.gt50 .fill, .percircle .pie {
        /* border-width: .09em !important;*/
    }



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

        #Page02_SubBar.LPPage {
            top: 0px !important;
            margin-top: 60px;
        }

        .LP_Wrapper.marginT120 {
            margin-top: 0 !important;
        }

        .LP_Wrapper.marginT120 {
            margin-top: 0 !important;
        }
    }
    /*  Learning program page mobile end*/

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

        .learnerroot .learnerContent.calendarPage {
            margin-top: 60px !important;
        }
    }

    /*  camlender page mobile end*/


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

        #Page04_SubBar.LPCatlog {
            margin-top: 60px !important;
        }

        #Page04_MenuContainer.LPCatlog {
            margin-top: 0 !important;
        }
    }
    /*  Catlog page mobile end*/


    .catlogApplyBtnWrap {
        /*    position: absolute;
    bottom: 0;
    width: 100%;
    height: 115px;
    background: #fff;
    Left: 0px;
    display: flex;
    align-items: center;
    justify-content: center;*/
        position: relative;
        bottom: 0;
        width: 100%;
        height: 117px;
        background: #fff;
        Left: 0px;
        display: flex;
        align-items: center;
        margin-left: 50px;
        margin-top: 0px;
    }

    /************************/


    /*** 21-2-23 menu structer 2 line text***/

    .act_innerbox {
        display: flex;
        width: 100%;
    }


        .act_innerbox img {
            display: inline-block;
        }

        .act_innerbox p {
            margin: 0;
        }

        .act_innerbox .paraText18 {
            line-height: 22px;
        }
    /************************/

    .percentBarHide {
        visibility: hidden;
    }

    .upperCaseText {
        text-transform: uppercase;
    }


    #adminroot .form-control::-webkit-input-placeholder {
        font-size: clamp(0.75rem, 0.6066rem + 0.2241vw, 0.8755rem) !important; /*paraText14*/
        color: #666666 !important;
    }

    #adminroot .form-control:-moz-placeholder {
        font-size: clamp(0.75rem, 0.6066rem + 0.2241vw, 0.8755rem) !important; /*paraText14*/
        color: #666666 !important;
    }

    #adminroot .form-control::-moz-placeholder {
        font-size: clamp(0.75rem, 0.6066rem + 0.2241vw, 0.8755rem) !important; /*paraText14*/
        color: #666666 !important;
    }


    /************/



    /*** 23-3--23 ***/


    .P4btnSheenPatch:hover .P4btnSheenPatchDark {
        height: 70%;
        background-color: rgba(00,00,00,0.70);
    }

    .P4btnSheenPatch:hover .P4ImageCaptionText {
        bottom: 50%;
    }

    .P4btnSheenPatchClr.FreeCourseCls {
        position: absolute;
        left: 0;
        width: 100%;
    }

    .P4btnSheenPatchClr.FreeCourseCls_1 {
        position: absolute;
        left: 0;
        width: 100%;
    }

    .P4btnSheenPatch:hover .P4btnSheenPatchBlank {
        height: 10%;
    }

    .P4btnSheenPatch:hover .P2ModuleNums {
        visibility: visible;
        opacity: 1;
        bottom: 35%;
    }

    .P4btnSheenPatch:hover .P2ModuleDuration {
        visibility: visible;
        opacity: 1;
        bottom: 25%;
    }


    /********/


    .catlogLp2 .P2btnThumbnail:hover .P4btnSheenPatchDark {
        height: 70%;
        background-color: rgba(00,00,00,0.70);
    }

    .P2btnThumbnail:hover .P4ImageCaptionText {
        bottom: 50%;
    }



    .catlogLp2 .P2btnThumbnail:hover .P4btnSheenPatchBlank {
        height: 10%;
    }

    .catlogLp2 .P2btnThumbnail:hover .P2ModuleNums {
        visibility: visible;
        opacity: 1;
        bottom: 35%;
    }

    .catlogLp2 .P2btnThumbnail:hover .P2ModuleDuration {
        visibility: visible;
        opacity: 1;
        bottom: 25%;
    }

    /********/
    ._htActivities {
        line-height: 35px;
    }
    /************/




    /*** 23-3-23 ***/


    .piechart-box {
        width: 100%;
    }

        .piechart-box h2 {
            display: block;
            text-align: center;
            color: #fff;
        }

        .piechart-box .chart {
            position: relative;
            width: 100%;
            height: 160px;
            text-align: center;
            color: #fff;
            margin: 0 auto;
        }

            .piechart-box .chart.small {
                height: 50px;
            }



    .pie-content-box {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
    }

    @media screen and (max-width: 1199px) {

        .piechart-box .chart, .piechart-box canvas {
            width: 120px !important;
            height: 120px !important;
        }


            .piechart-box .chart.small, .piechart-box .small canvas {
                height: 50px !important;
                width: 50px !important;
            }
    }


    /************/



    /*** 24-2-23 ***/







    #Page03a_SubBar .LPO ul {
        margin: 0;
        flex-wrap: wrap;
        display: flex;
        align-items: center;
    }


        #Page03a_SubBar .LPO ul li {
            margin-right: 30px;
            width: auto !important;
            height: 100%;
        }

    /*#Page03a_SubBar {
    display: flex;
    align-items: center;
    justify-content: center;
}*/

    .LPO .SubBar-container {
        margin: 0 9.2%;
        width: 100%;
    }

    .LPO .SubMenuItem {
        position: relative;
    }



        .LPO .SubMenuItem:hover::after {
            content: "";
            position: absolute;
            border-top: 4px solid #F04943;
            box-shadow: 0px 3px 6px #00000029;
            width: 100%;
            height: 4px;
            bottom: 0px;
            left: 0px;
        }

        .LPO .SubMenuItem:hover::after {
            bottom: 0px;
        }

    .LPO .wrapDiv {
        height: 60px;
        display: flex;
        align-items: center;
    }

    @media screen and (max-width: 991px) {
        .LPO .SubBar-container {
            margin: 0;
            width: 100%;
            padding: 0 15px;
        }
    }

    @media screen and (max-width: 768px) {
        #Page03a_SubBar .LPO ul {
            flex-direction: column;
            align-items: flex-start;
            padding: 5px 0;
        }

        .LPO .wrapDiv {
            height: auto;
            display: flex;
            align-items: center;
        }
    }





    .MaintextColor13 {
        color: #98D40A;
    }




    @media screen and (max-width: 1199px) {
    }


    @media screen and (max-width: 767px) {

        .LPO .SubMenuItem:hover::after {
            display: none;
        }
    }







    /**************/

    .catInput input::-webkit-input-placeholder {
        color: #666 !important;
        font-size: clamp(0.75rem, 0.6066rem + 0.2241vw, 0.8755rem) !important;
    }

    .catInput input::-moz-placeholder {
        color: #666 !important;
        font-size: clamp(0.75rem, 0.6066rem + 0.2241vw, 0.8755rem) !important;
    }

    .catInput input::-ms-placeholder {
        color: #666 !important;
        font-size: clamp(0.75rem, 0.6066rem + 0.2241vw, 0.8755rem) !important;
    }







    .redCircleChat {
        width: 15px;
        height: 15px;
        background: #F04943;
        position: absolute;
        border-radius: 50%;
        margin-left: 40px;
    }

    .chatHeader {
        width: 60px;
        height: 80px;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 0px;
    }

    .clickBtn.CoursesCatalogDetails {
        position: absolute;
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
        cursor: pointer;
    }


    #dvCaptcha {
        background: #fff;
        padding: 10px 10px;
        border-radius: 5px;
    }

    .LessonAbs {
        position: absolute;
        left: 0;
        top: 0;
        padding-left: 15px;
    }

    .ActivityAbs {
        position: absolute;
        left: 0;
        top: 0;
        padding-left: 15px;
    }


    .cntUs {
        border: 1px solid #FDE3D8 !important;
    }

        .cntUs:hover {
            border: 1px solid #F04943 !important;
        }

    #spanfeaturename {
        color: #273368 !important;
        font-size: clamp(0.75rem, 0.3214rem + 0.6696vw, 1.125rem) !important; /*paraText18*/
        font-family: "Segoe UI", Helvetica !important;
        font-weight: bold !important;
    }

    .input-group-append {
        height: calc(1.5em + 0.5rem + 4px);
    }



    @media screen and (min-width: 1400px) {
        .input-group-append .input-group-text {
            font-size: clamp(0.75rem, 0.6066rem + 0.2241vw, 0.8755rem) !important;
            padding: 0.97rem 0.5rem !important;
        }
    }

    .minHeightBox {
        max-height: 120px;
    }


    .TopBarMyLearning {
        position: absolute !important;
        width: 40%;
        height: 100%;
        top: 0;
        height: 100%;
        align-items: center;
        display: flex;
        justify-content: center;
        padding: 0;
        margin: 0;
    }

    /***/

    #wrapperAnnounce.mobile-bases {
        background: #484848;
    }

        #wrapperAnnounce.mobile-bases .Announces-top {
            padding: 15px;
        }

        #wrapperAnnounce.mobile-bases .tab {
            display: flex;
            flex: 0 0 86px;
            max-width: 86px;
            flex-direction: column;
        }


        #wrapperAnnounce.mobile-bases .tabcontent {
            padding: 15px;
            width: 100%;
            border-left: none;
            height: 300px;
            display: none;
        }

        #wrapperAnnounce.mobile-bases .tab-list {
            display: flex;
            width: 100%;
        }

        #wrapperAnnounce.mobile-bases .Announces-top {
            background: #333;
            padding: 15px 20px 15px 20px;
            margin-bottom: 2px;
            height: 100%;
            border-bottom: 2px solid #191919;
        }

    #wrapperAnnounce .Announces-circle {
        background: #ffcd00;
        height: 30px;
        width: 30px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #333;
    }
    /***/
    #wrapperAnnounce {
        position: fixed;
        width: 500px;
        height: 100%;
        padding-left: 0;
    }

    @media screen and (max-width: 767px) {

        #wrapperAnnounce {
            position: relative;
            width: 100%;
            height: 100%;
            right: 0;
            padding-left: 0;
        }
    }

    #wrapperAnnounce .header, #wrapperAnnounce .footer {
        height: 60px;
    }

    #wrapperAnnounce .footer {
        height: 0px;
        background: #333;
    }

        #wrapperAnnounce .footer .btmWrap {
            padding: 0 20px;
        }

            #wrapperAnnounce .footer .btmWrap, #wrapperAnnounce .footer .btmWrap a {
                height: 100%;
            }

                #wrapperAnnounce .footer .btmWrap a:hover {
                    text-decoration: none;
                }

    #wrapperAnnounce .content {
        height: calc(100% - 125px);
        overflow: auto;
    }

    #wrapperAnnounce .Announces-accordian {
        display: flex;
        justify-content: space-between;
        /*background: #2d2d2d;*/
        color: #fff;
        height: calc(100% - 0px);
    }

    .sidenavAnnounce {
        height: 100%;
        height: calc(100vh - 60px );
        width: 500px;
        position: fixed;
        /*position: absolute;*/
        z-index: 20;
        top: 60px;
        right: 0;
        /*background-color: #333333; */
        overflow-x: hidden;
        padding-top: 0px;
        right: -500px;
        transition: right 0.2s;
    }

        .sidenavAnnounce.opened {
            right: 0px;
        }

    #sidenavAnnounceSheen {
        position: absolute;
        width: 100%;
        height: 100%;
        background-color: transparent;
        z-index: 3;
    }


    .topBarAnnounce {
        align-items: center;
    }

        .topBarAnnounce .top-right-mainlist ul {
            margin: 0;
            padding: 0;
            list-style: none;
            display: flex;
            align-items: center;
        }

        .topBarAnnounce .top-right-mainlist {
            /* margin-right: 4px;*/
            margin-right: 0px;
        }

            .topBarAnnounce .top-right-mainlist ul li {
                display: inline-block;
                /* margin-right: 8px;*/
                margin-right: 0px;
            }

                .topBarAnnounce .top-right-mainlist ul li a.LO {
                    height: 35px;
                    width: 35px;
                    border-radius: 50%;
                    border: 1px solid transparent;
                    background: #fde3d8;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    text-transform: none;
                    text-decoration: none;
                }

                /*
                .topBarAnnounce .top-right-mainlist ul li a.LO:hover {
                    border: 1px solid #f04943;
                }
*/


                .topBarAnnounce .top-right-mainlist ul li.login-itext a.LO {
                    width: auto;
                    background: transparent;
                    border: 0;
                }

                .topBarAnnounce .top-right-mainlist ul li.help-itext a.LO {
                    width: auto;
                    background: transparent;
                    border: 0;
                }

    .l-icon {
        width: 35px;
        height: 35px;
        border-radius: 50%;
        border: 1px solid transparent;
        background: #fde3d8;
        display: flex;
        align-items: center;
        justify-content: center;
        text-transform: none;
        text-decoration: none;
    }

    .topBarAnnounce .top-right-mainlist ul li.login-itext a.LO:hover .l-icon {
        border: 1px solid #f04943;
    }

    .topBarAnnounce .top-right-mainlist ul li.login-itext a.LO.disabled:hover .l-icon {
        border: 0px solid #f04943;
    }

    .topBarAnnounce .top-right-mainlist ul li.help-itext a.LO:hover .l-icon {
        border: 1px solid #f04943;
    }

    .topBarAnnounce .top-right-mainlist ul li.help-itext a.LO.disabled:hover .l-icon {
        border: 0px solid #f04943;
    }

    .topBarAnnounce .top-right-mainlist ul li.Anouncement-itext a.LO:hover .l-icon {
        border: 1px solid #f04943;
    }

    .topBarAnnounce .top-right-mainlist ul li.Anouncement-itext a.LO.disabled:hover .l-icon {
        border: 0px solid #f04943;
    }

    .announcement-lists > .items .ulList li {
        margin: 15px 30px;
        padding: 0 15px;
        border-bottom: 0px solid #272727;
    }

        .announcement-lists > .items .ulList li.liPad0 {
            padding: 0 0px;
        }

    .l-text {
        width: 35px;
        height: 35px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        text-transform: none;
        text-decoration: none;
    }

    @media screen and (max-width: 767px) {
        .sidenavAnnounce {
            width: 60%;
        }

        .announcement-lists {
            width: 100%;
        }

        .forMobileWrap {
            flex-wrap: wrap;
        }
    }

    @media screen and (min-width: 768px) {
        .sidenavAnnounce {
            width: 500px;
        }
    }

    /*****************/
    .Anouncement-itext {
        /* display: none!important;*/
    }

    .announcement-lists .red-round {
        height: 25px;
        width: 25px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: #f04943;
        border-radius: 50%;
        color: #000;
        font-size: 12px;
    }

    .announcement-lists .items a {
        padding: 0px 0px;
        color: #fff;
        text-decoration: none;
    }

        .announcement-lists .items a:hover {
            background: transparent;
        }

    .announcement-lists  {
        width:100%;
    }
    .announcement-lists > .items {
        background: #484848;
        list-style: none;
        margin: 0;
        padding: 0;
    }

        .announcement-lists > .items li {
            margin: 30px 20px;
            padding: 0 0px;
            border-bottom: 1px solid #272727;
        }
    /*
        .announcement-lists > .items li:nth-last-child(2) {
            border-bottom: 0;
        }*/

    /*   .announcement-lists > .items li:first-child, .announcement-lists > .items li:last-child {
            margin: 0;
            background: #484848;
        }*/


    .announcement-lists .ann-pointlist {
        position: relative;
        padding-left: 0px;
    }

        .announcement-lists .ann-pointlist span {
            display: block;
        }

        .announcement-lists .ann-pointlist::before {
            content: "";
            height: 6px;
            width: 6px;
            border-radius: 50%;
            background: transparent !important;
            left: -15px;
            top: 7px;
            position: absolute;
        }

    .announcement-lists .mark-circle {
        height: 35px;
        width: 35px;
        border-radius: 50%;
        background: #fde3d8;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .mark-circle {
        height: 35px;
        width: 35px;
        border-radius: 50%;
        background: #fde3d8;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .annonceRow {
        margin: 0 auto;
        max-width: 1920px;
        width: 100%;
        height: 100%;
        padding: 0 25px;
        background: red;
    }

    .announce_Container {
        position: absolute;
        width: 100%;
        height: 100%;
        height: 100vh;
        top: 120px;
        left: 0px;
        background: red;
        max-width: 1920px;
        position: relative;
        /* z-index: 2; */
    }

    .announcement-lists > .items li a.light-b {
        border-bottom: 1px solid #999;
    }




    /*****************/
    #badges1_Container {
        position: absolute;
        width: 100%;
        height: 100%;
        height: calc( 100% - 199px);
        top: 120px;
        left: 0px;
        /* z-index: 2; */
    }

    #badges1_MenuBg {
        width: 25%;
        position: absolute;
        /* height: calc( 100% - 120px ); */
        height: 100%;
        top: 0px;
        right: 0;
        background: #2d2d2d;
        box-shadow: 0px 6px 6px #00000040;
        border: 0px solid #CCCCCC;
        opacity: 1;
        z-index: 10 !important;
    }
    /*****************/
    /*
.modal1 {
    position: fixed;
    overflow: scroll;
    display: none;
    top: 0px;
    right: 0;
    width: 100%;
    max-width: 580px;
    height: calc(100vh - 0px);
    margin-left: 0px;
    background: #fff;
    border-radius: 3px;
    z-index: 9999;
    box-shadow: 0 10px 10px rgba(0, 0, 0, 0.25);
}

    .modal1.open {
        display: flex;
        flex-direction: column;
    }

.modal1__content {
    height: 100%;
    overflow-y: auto;
}

.modal1__header, .modal1__footer, .modal1__content {
    padding: 15px;
}

.modal1__header {
    top: 15px;
    border-radius: 3px 3px 0 0;
}

.modal1__footer {
    bottom: 15px;
    border-radius: 0 0 3px 3px;
}

.modal1__backdrop {
    position: fixed;
    display: block;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.5);
    z-index: 999;
}

*/
    /*****************/
    /* to remove bootstrao default btn focus*/
    .btn:focus, .btn.focus {
        outline: 0;
        box-shadow: 0 0 0 0rem rgba(0, 123, 255, 0.25) !important;
    }

 
body.transparentScroll::-webkit-scrollbar-track {
    background: transparent;
}
body.transparentScroll::-webkit-scrollbar-thumb {
    background-color: #fff;
    border-radius: 0px;
    border-color: #fff;
    -webkit-box-shadow: inset 0 0 0px rgba(0, 0, 0, 0.5)!important;
}

.announceBtns .btn_1  {
    margin-right: 4px;
}
 .announceBtns .btn_2 {
    margin-right: 5px;
}
.seperator1 {
    border-bottom: 1px solid #66666680;
    margin-bottom: 5px;
}
.seperator2 {
    border-bottom: 1px solid #66666680;
    margin-bottom: 10px;
}
.readMoreA {
    padding: 10px 0px 0px 0px;
}
.annGreenStatus {
    width: 11px;
    height: 11px;
    background: #50E524;
    border-radius: 50%;
}
.annGrayStatus {
    width: 11px;
    height: 11px;
    background: #CCCCCC;
    border-radius: 50%;
}

.programStartDateIcon {
    width: 14px;
    height: 14px;
    /* UI Properties */
    background: #22FF00 0% 0% no-repeat padding-box;
    opacity: 1;
    line-height: 14px;
    display: inline-block;
    border-radius:25px;
}

.programEndDateIcon {
    width: 14px;
    height: 14px;
    /* UI Properties */
    background: var(--unnamed-color-f04822) 0% 0% no-repeat padding-box;
    background: #F04822 0% 0% no-repeat padding-box;
    opacity: 1;
    line-height: 14px;
    display: inline-block;
    border-radius: 25px;
}

.calendarPage .legendscal li.legends {
    color: #fff !important;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}
.calAlignCls1 {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.calAlignCls2 {
    display: block;
    white-space: normal;
    margin-bottom: 4px;
}

.Act_desp_txt p {
    margin-top: 2px !important;
    margin-bottom: 0px !important;
}
.timepickerBtm {
    margin: 0px 0px 3px 0px !important;
}

.layoutV2BeforLaunchCls .page-login-content.contentAtLaunch {
    padding: 0 !important;
    margin-top: 0 !important;
}

.layoutV2BeforLaunchCls .zerorightpadding {
    padding: 0 !important;
}

/*new radio and checkbox css */
/* 
   
.label {
    display: flex;  
}

input[type="radio"] {
    margin: 0 20px 0 0;
}

input[type="radio"] {
    appearance: none;
    width: 25px;
    height: 25px;
    border: 2px solid #273368;
    border-radius: 50%;
    background-clip: content-box;
    padding: 5px !important;
}

    input[type="radio"]:checked {
        background-color: #273368;
    }


 
input[type="checkbox"] {
    margin: 0 20px 0 0;
}

input[type="checkbox"] {
    appearance: none;
    width: 25px;
    height: 25px;
    border: 2px solid #273368;
    
    background-clip: content-box;
    padding: 5px !important;
}

    input[type="checkbox"]:checked {
        background-color: #273368;
    }

    input[type="checkbox"]:hover {
        border: 2px solid red;
        background-color: #273368;
    }
    */

/*** 24 aug */


 
 
@media screen and (min-width: 1367px) {
    .P4PriceTag.paddingL15 {
        padding-left:20px;
    }
    .profilerow.paddingT10 {
        padding-top: 15px;
    }
    .profilerow .marginB10 {
        margin-bottom:15px;
    }
}

.addShadowClsforOrderPage {
    box-shadow: 1px 3px 6px #00000029 !important;
}
.addShadowClsforProfilePage{
    box-shadow: 1px 3px 6px #00000029 !important;
}
    /*** 24 aug end*/
.strikePriceCls {
    text-decoration: line-through;
}