﻿/*@font-face {
    font-family: 'OPTIMA';
    src: url('../fonts/OPTIMA.TTF') format('truetype'), url('../fonts/OPTIMA_B.ttf') format('truetype'), url('../fonts/Optima-Bold.ttf') format('truetype');
}
*/
:root {
    /*Main Colors*/
    --bodyTextColor: #676a6c;
    --mainColor: #0E508B;
    --secondaryColor: #F6921E;
    --pageHeaderTextColor: #0E508B;
    --textWhiteColor: #ffffff;
    --textBlackColor: #00000;
    --textColorWhite: #ffffff;
    --pageECourseHeaderInsideTitle: #000000;
    --courseCardTitleText: #000000;
    --corseCardSubTitle: #676A6C;
    --courseCardAshtext: #808080;
    --buttonMainColor: #5C0F8B;
    --cardTitle: #9c9c9c;
    --cardHeadingColor: #ffffff;
    --buttonText: #fff;
    --dropDownHoverColor: #000000;
    /*Common*/
    --BreadcrumbColor: #000000;
    --textColorBlack: #000000;
    /*Tab Navigation*/
    --tabNavigationFirstColor: #000000;
    --tabNavigationBackgroundColor: none;
    /*Cards*/
    --cardCourseFee: #337ab7;
    /*Publicity Details*/
    --freeTextColor: #2f2f2f;
    /*Course Details*/
    --pageMainTitle: #2e3942;
    --courseBorderHText: #2f4050;
    --courseBorderSpanText: #5d5a5a;
    --courseBorderFreeText: #293846;
    /*Course Tab Details*/
    --courseTabBorderBottom: #2982da;
    --courseTabTitle: #8c939e;
    --courseTabTitleActive: #656d78;
    --courseTabTitleHover: #191818;
    --accordionFirstText: #204056;
    --accordionFirstComponent: #4e6c89;
    --accordionSecondText: #4e5d67;
    --accordionSecondComponent: #5dabd0;
    --paymentDetailsPropertyTitle: #555;
    --paymentDetailsProperty: #656d78;
    --paymentDetailsLink: #337ab7;
    --headerIconColorFixing: #999c9e;
    /*Public collection Details*/
    --publicCollectionPText: #30455C;
    /*Catelog Management - Categories*/
    --btnDisabledBackground: #6f6f6f;
    --btnDisabledBorder: #ccd1d9;
    --tableRowColor: #f3f1f1;
    --tableLinkColor: #337ab7;
    /*Categories - edit modal*/
    --btnEditColor: #5C0F8B;
    --buttonEditText: #fff;
    --modalCancelText: #000;
    --modalCancelBorder: #e7eaec;
    --modalCancelBack: #fff;
    /*Top bar*/
    --topBarText: #fff;
    --topBarBackground: #0E508B;
    --btnBlueBackground: #034da1;
    --btnNormalColor: #999c9e;
    --dropdownText: #4c4848;
    --dropdownLanguageText: #000;
    --dropdownLanguageBackground: #fff;
    --dropdownLanguageBackgroundSelected: #007bff;
    --appSearchBorder: #ccd1d9;
    --progressBarBackgroundColor: #3cc480;
    /*Label notification*/
    --emailNotification: #f8ac59;
    --emailNotificationText: #FFFFFF;
    /*Notification icon label*/
    --labelColor: #4665ff;
    /*footer*/
    --footerBack: #0E508B;
    --footerBackBorder: #F6921E;
    --footerTextColor: #F6921E;
    /*sidenav*/
    --sidenavBack: #0E508B;
    --sideNavBarBackgroundColor: #0E508B;
    --sidenavColor: #ffffff;
    --sidenavHover: #F6921E;
    --sidenavHoverLeftborder: #9578d3;
    --sideNavBarHoverColor: #F6921E;
    --sidenavActive: #354052;
    --myAccountDetailsBackgroundColor: #F6921E;
    --sideNavBarIconColor: brightness(0) saturate(100%) invert(53%) sepia(16%) saturate(28%) hue-rotate(338deg) brightness(91%) contrast(79%);
    --sideNavBarHoverNavigateActiveColor: #e8e8e8;
    --mainColorIcon: invert(14%) sepia(98%) saturate(3481%) hue-rotate(197deg) brightness(83%) contrast(89%);
    --headerIconFilter: #444444;
    --pageLoarderFilter: brightness(72%) contrast(300%) hue-rotate(26deg) saturate(64%);
    /*--sideNavBarHoverColor: #F6921E;
    --sideNavBarSecondMenuBackgroundColor: #354052;
    --sideNavBarSecondMenuHoverBackgroundColor: #F6921E;*/
    --iconWhite: brightness(0) invert(100%);
}


body {
    color: var(--bodyTextColor) !important;
    /*font-family: "OPTIMA" !important;*/
}

/*.pagemaintitle, .nav-label1, .page-name {
    font-family: "OPTIMA" !important;
}*/

/*.signinFooterContainerResponsive span, .footer-top a {
    font-family: "OPTIMA" !important;
}*/

/*Header (top bar)*/

.progbar {
    background-color: var(--myAccountDetailsBackgroundColor);
    background-image: none !important;
}

.btn-primary, .btn-default {
    color: var(--topBarText) !important;
    background-color: var(--topBarBackground) !important;
    border-color: var(--topBarBackground) !important;
}

ul.nav.navbar-top-links.navbar-right li.dropdown:hover {
    background-color: var(--buttonText) !important;
}

#insidemvcHEADER .nav > li > a.support-link:hover {
    background-color: var(--btnBlueBackground) !important;
    color: var(--topBarText) !important;
}

#insidemvcHEADER .nav > li > a.support-link {
    color: var(--btnNormalColor) !important;
}

#insidemvcHEADER .nav.navbar-right > li > a {
    color: var(--headerIconColorFixing) !important;
}

/*#insidemvcHEADER .nav.navbar-right > li.dropdown > a:hover {
    color: var(--headerIconColorFixing) !important;
}
*/
/*.dropdown-menu li > a {
    color: var(--dropdownText) !important;
}*/

.language-bar ul li a {
    color: var(--dropdownLanguageText) !important;
}

.language-bar ul li {
    background: var(--dropdownLanguageBackground) !important;
}

.language-bar li.selected {
    background-color: var(--dropdownLanguageBackgroundSelected) !important;
    color: var(--topBarText) !important;
}

.language-bar li.selected a {
    color: var(--topBarText) !important;
}

.language-bar .bootstrap-select.btn-group .dropdown-menu li:hover {
    background-color: var(--dropdownLanguageBackgroundSelected) !important;
    color: var(--topBarText) !important;
}

.language-bar .bootstrap-select.btn-group .dropdown-menu li:hover a {
    /*color: var(--topBarText) !important;*/
    color: var(--dropDownHoverColor) !important;
}

#app-search {
    border: 1px solid var(--appSearchBorder) !important;
}

.label-warning, .badge-warning {
    background-color: var(--emailNotification) !important;
    color: var(--emailNotificationText) !important;
}

.label-primary, .badge-primary {
    background-color: var(--labelColor) !important;
    color: var(--emailNotificationText) !important;
}

/*common*/

.nav-label1 {
    color: var(--BreadcrumbColor) !important;
}

.nav-tabs > li.active > a {
    background: var(--tabNavigationBackgroundColor) !important;
    border-bottom: 6px solid var(--mainColor) !important;
    color: var(--tabNavigationFirstColor) !important;
}

.nav-tabs > li > a {
    color: var(--tabNavigationFirstColor) !important;
}

.nav-tabs > li.active > a:hover {
    color: var(--tabNavigationFirstColor) !important;
}


/*e-course and public collection tab section*/
.ecourse_page_tab .nav-tabs > li.active > a {
    background: var(--tabNavigationBackgroundColor) !important;
    border-bottom: 6px solid var(--mainColor) !important;
    color: var(--tabNavigationFirstColor) !important;
}

.ecourse_page_tab .nav-tabs > li > a {
    color: var(--tabNavigationFirstColor);
}

.ecourse_page_tab .nav-tabs > li.active > a:hover {
    color: var(--tabNavigationFirstColor) !important;
}

/*e-courses tab*/
.pagemaintitle {
    color: var(--pageHeaderTextColor) !important;
}

.pagemaintitle.course_header_pagetitle {
    color: var(--pageECourseHeaderInsideTitle) !important;
}

.catalog-nav-bar-search-btn {
    background: var(--mainColor) !important;
    border-color: var(--mainColor) !important;
    color: var(--textColorWhite) !important;
}

.theh4 {
    color: var(--courseCardTitleText) !important;
}

.theh4 a {
    color: var(--courseCardTitleText) !important;
}

.ashspan span {
    color: var(--courseCardAshtext) !important;
}

.freelablediv {
    background: var(--mainColor) !important;
    color: var(--cardHeadingColor) !important;
}

.course-description, .collection-description {
    color: var(--corseCardSubTitle) !important;
}

/*detailed view of e-courses*/
.borders h4 {
    color: var(--courseBorderHText) !important;
}

.borders span {
    color: var(--courseBorderSpanText) !important;
}

.course_header .btn-default, .btn-primary {
    color: var(--buttonText) !important;
    background-color: var(--mainColor) !important;
    border-color: var(--mainColor) !important;
}

.responsive-tabs .dropdown-menu > li > a {
    color: var(--courseTabTitle) !important;
}

.coursetab_dropdown .no-touch .dropdown-menu li > a:hover, .no-touch .dropdown-menu li > a:focus, .no-touch .dropdown-menu li > a:active {
    color: var(--courseTabTitleHover) !important;
}

.responsive-tabs .dropdown-menu > li.active > a {
    color: var(--courseTabTitleActive) !important;
}

.coursetab_dropdown .dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {
    border-bottom: 2px solid var(--courseTabBorderBottom) !important;
}

.progreeslvl, .progreespoint {
    color: var(--textBlackColor);
}

#page-header {
    color: var(--courseBorderFreeText) !important;
}

#course-outline .course-title-link {
    color: var(--accordionFirstText) !important;
}

#course-outline .course-title-link:hover {
    background-color: var(--accordionFirstComponent) !important;
}

._1IZuIq_3UdGonCYbFCY_3Z {
    color: var(--accordionSecondText) !important;
}

.course-item li:hover {
    background-color: var(--accordionSecondComponent) !important;
}

.display-properties .property {
    color: var(--paymentDetailsProperty) !important;
}

.display-properties .property-title {
    color: var(--paymentDetailsPropertyTitle) !important;
}

.course_detail_multiple_payment a {
    color: var(--paymentDetailsLink) !important;
}


/*enroll now btn modal*/
.modal-footer .btn-primary {
    color: var(--buttonText) !important;
    background-color: var(--mainColor) !important;
    border-color: var(--mainColor) !important;
}

.course_layout_cancelbtn {
    color: var(--modalCancelText) !important;
    background: var(--modalCancelBack) !important;
    border: 1px solid var(--modalCancelBorder) !important;
}


/*Catelog Management - Categories*/
.btn-default.disabled, .btn-default[disabled] {
    background: var(--btnDisabledBackground) !important;
    border-color: var(--btnDisabledBorder) !important;
}

.table-striped > tbody > tr:nth-child(odd) > td, .table-striped > tbody > tr:nth-child(odd) > th {
    background-color: var(--tableRowColor) !important;
}

.index_table a {
    color: var(--tableLinkColor) !important;
}

.language-bar .no-touch .btn-default.course_layout_cancelbtn:hover, .no-touch .btn-default.course_layout_cancelbtn:focus {
    color: var(--textBlackColor) !important;
}

/*Categories edit modal*/
/*.modal-body .btn-default, .btn-primary {
    color: var(--buttonEditText) !important;
    background-color: var(--btnEditColor) !important;
    border-color: var(--btnEditColor) !important;
}*/

/*footer*/
#contactUS {
    background: var(--footerBack) !important;
    border-top: 5px solid var(--footerBackBorder) !important;
}

#copyright {
    background: var(--footerBack) !important;
    color: var(--buttonText) !important;
}

.footer-top a {
    color: var(--footerTextColor) !important;
}

/*sidenav*/
/*.navbar-default .nav > li > a:active {
    border-left: 4px solid var(--sideNavBarHoverColor) !important;
}*/
/*
.metismenu a {
    background-color: var(--buttonText) !important;
}*/

.fixed-nav #wrapper {
    background-color: var(--sidenavBack) !important;
}

#pullTOPmenu .nav > li > a {
    color: var(--sideBarNavIconColor) !important;
}

#pullTOPmenu .nav > li.active {
    border-left: 0px !important;
   /* background: var(--sidenavActive) !important;*/
}

#pullTOPmenu .navbar-default .nav > li > a:hover, .navbar-default .nav > li > a:active, .navbar-default .nav > li > a:focus {
    background-color: var(--buttonText) !important;
    color: var(--buttonText) !important;
}

/*.navbar-default {
    background-image: linear-gradient(to bottom, var(--sideNavBarBackgroundColor) 0%, var(--sideNavBarBackgroundColor) 100%) !important;
}*/

#mainNAVNAV .metismenu {
    background-color: #ffffff !important;
}

#pullTOPmenu .nav > li.active > a {
    /*color: var(--mainColor) !important;*/
    /*background-color: var(--mainColor) !important;*/
}

#pullTOPmenu .nav > li > a {
    border-top: 0px solid var(--sidenavBack) !important;
}

/*sidenav and header*/
.metismenu .fa.arrow:before {
    color: var(--textColorWhite) !important;
}

/*#pullTOPmenu .nav > li > a:hover {
    background-color: var(--sideNavBarHoverNavigateActiveColor) !important;
}*/

/*.nav.metismenu > li:active {
    border-left: 4px solid var(--sideNavBarHoverColor) !important;
}*/

#pullTOPmenu .nav > li > ul > li > a {
    background: radial-gradient(var(--sideNavBarSecondMenuBackgroundColor), var(--sideNavBarSecondMenuBackgroundColor)) !important;
    background-color: var(--sideNavBarSecondMenuBackgroundColor) !important;
    /*background: #354052;*/
}

#pullTOPmenu .nav > li > ul > li > a:active {
    background: radial-gradient(var(--sideNavBarSecondMenuHoverBackgroundColor), var(--sideNavBarSecondMenuHoverBackgroundColor)) !important;
    background-color: var(--sideNavBarSecondMenuHoverBackgroundColor) !important;
}


@media only screen and (max-width:768px) {
    .srch-inputbar {
        display: none !important;
    }
}

.breadcrumb > li a {
    color: var(--BreadcrumbColor) !important;
}

/*sidenav*/
.sidenav_bottom_sec {
    background-color: #ffffff !important;
}

.language-bar .bootstrap-select button.btn {
    background-color: transparent !important;
}

.sidenav_bottom_sec a {
    background-color: transparent !important;
    color: #a7b1c2 !important;
}

.progress-bar {
    color: var(--buttonText) !important;
}

.sidenav_bottom_sec a {
    background-color: transparent !important;
    color: #ffffff !important;
}

.myacc_font a {
    color: #343a3b !important;
}

.mainlogo {
    padding: 18px 5px;
    float: left;
    padding-left: 10px;
    max-width: 238px;
    max-height: 81px !important;
}

.language-bar .bootstrap-select button.btn {
    color: #fff !important;
}

.modal-header .close {
    font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

.select2-results::-webkit-scrollbar-thumb {
    /*background-color: #F65A5B;*/
    background-color: var(--mainColor) !important;
}

.progress-bar-info {
    background: var(--myAccountDetailsBackgroundColor) !important;
}

.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple {
    border-color: #0E508B !important;
}

.table > thead:first-child > tr:first-child > th {
    background-color: var(--mainColor);
    color: white;
}

.select2-results::-webkit-scrollbar-thumb {
    background-color: var(--mainColor) !important;
}

#app-breadcrumb {
    font-size: 13px !important;
}

.borders .fa {
    color: var(--mainColor) !important;
}

.navbar-default {
    background-color: #ffffff !important;
    border-color: #FFFFFF !important;
}

/*.metismenu a {
    background-color: #ffffff !important;
}*/

#side-menu img {
    filter: var(--sideNavBarIconColor);
}

/*.navbar-default .nav > li > a:hover, .navbar-default .nav > li > a:focus {
    background-color: var(--sideNavBarHoverNavigateActiveColor) !important;
}*/

.navbar-default .nav > li > a:hover, .navbar-default .nav > li > a:focus {
    color: var(--mainColor) !important;
}

/*.metismenu a:focus img {
    filter: var(--mainColorIcon) !important;
}*/

.metismenu a:hover img {
    filter: var(--mainColorIcon) !important;
}

#side-menu.active img {
    filter: var(--mainColorIcon) !important;
}

#pullTOPmenu .nav > li > a:hover {
    color: var(--mainColor) !important;
}

#pullTOPmenu .nav > li > a:active {
    color: var(--mainColor) !important;
}

ul.nav-second-level {
    background: #ffffff !important;
}

/*.metismenu li.active > a::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 7px;
    height: 50px;
    background-color: var(--mainColor) !important;
    border-radius: 0px 10px 10px 0px;
}

.metismenu li:focus > a::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 7px;
    height: 50px;
    background-color: var(--mainColor) !important;
    border-radius: 0px 10px 10px 0px;
}*/



#mainNAVNAV #pullTOPmenu .nav > li:focus > a::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 7px;
    height: 40px;
    background-color: var(--mainColor) !important;
    border-radius: 0px 10px 10px 0px;
}

#pullTOPmenu #side-menu.active img {
    filter: var(--mainColorIcon) !important;
}

/*.sidenav_bottom_sec .count-info:focus {
    color: var(--mainColor) !important;
}*/

/*.sidenav_bottom_sec .count-info:focus .nav-icon-images {
    filter: var(--mainColorIcon) !important;
}

.sidenav_bottom_sec .count-info:focus .nav-toggle-images {
    filter: var(--mainColorIcon) !important;
}*/

.sidenav_bottom_sec .count-info:hover {
    color: var(--mainColor) !important;
}

/*#mainNAVNAV #pullTOPmenu .nav > li > a:focus {
    color: var(--mainColor) !important;
}*/

#mainNAVNAV #pullTOPmenu .nav > li > a.active {
    color: var(--mainColor) !important;
}

#mainNAVNAV #pullTOPmenu .nav > li > a:hover {
    color: var(--mainColor) !important;
}

.sidenav_bottom_sec .supportLink:hover .support-link {
    color: var(--mainColor) !important;
}

.sidenav_bottom_sec .supportLink:focus .support-link {
    color: var(--mainColor) !important;
}

.sidenav_bottom_sec .supportLink.active .support-link {
    color: var(--mainColor) !important;
}

.sidenav_bottom_sec .supportLink:hover .nav-icon-images {
    filter: var(--mainColorIcon) !important;
}

.sidenav_bottom_sec .supportLink:focus .nav-icon-images {
    filter: var(--mainColorIcon) !important;
}

.sidenav_bottom_sec .supportLink.active .nav-icon-images {
    filter: var(--mainColorIcon) !important;
}

@media only screen and (min-device-width: 1024px) and (min-device-width: 1280px) and (max-device-width: 1536px) {
    span.nav-label {
        font-size: 0.8rem !important;
    }
}

@media only screen and (min-width: 768px) {
    /*side nav bar nav item padding - 2nd level*/
    .nav-second-level li a {
        font-size: 0.8rem !important;
    }
}

@media only screen and (min-device-width: 1024px) and (min-width: 1920px), only screen and (min-device-width: 1024px) and (min-width: 2560px) {

    /*side nav bar nav font size*/
    span.nav-label {
        font-size: 0.9rem !important;
    }
}

.sidenav_bottom_sec .logout-container {
    color: var(--mainColor) !important;
}

    .sidenav_bottom_sec .logout-container img {
        filter: var(--mainColorIcon) !important;
    }

    .sidenav_bottom_sec .logout-container:hover img {
        filter: var(--mainColorIcon) !important;
    }

.sidenav_bottom_sec .myprofiletext:focus img {
    filter: var(--mainColorIcon) !important;
}

    .sidenav_bottom_sec .logout-container.active img {
        filter: var(--mainColorIcon) !important;
    }

.helpContainer:hover {
    color: var(--mainColor) !important;
}

#insidemvcHEADER #TotalNotificationCount,
#insidemvcHEADER .total-message-count,
#insidemvcHEADER #UnreadTaskNotificationCount {
    background-color: var(--mainColor) !important;
}

/*.sidenav_bottom_sec li:hover {
    color: var(--mainColor) !important;
}*/

    .sidenav_bottom_sec li:hover a {
        color: var(--mainColor) !important;
    }

    .sidenav_bottom_sec li:hover img {
        filter: var(--mainColorIcon) !important;
    }

@media only screen and (max-width: 767px) {
    #mainNAVNAV #progressStats .progreeslvl {
        color: var(--mainColor) !important;
        font-size: 10.08px !important;
        font-weight: 300 !important;
    }
}

#mainNAVNAV .progpresenatge .progbar {
    background-color: var(--mainColor) !important;
}

.progpresenatge .progbar {
    background-color: var(--progressBarBackgroundColor) !important;
}

.header-icons {
    filter: var(--headerIconFilter);
}

.notification-icon:hover  .header-icons {
    filter: var(--mainColorIcon) !important;
}

.msg:hover .message-icon {
    filter: var(--mainColorIcon) !important;
}

#progressStats .progreeslvl {
    color: var(--mainColor) !important;
    font-size: 12px;
    font-weight: 300;
}

.navbar-top-links.navbar-right .dropdown.open .header_icon_notification {
    filter: var(--mainColorIcon) !important;
}

#insidemvcHEADER .progpresenatge .progbar {
    background-color: var(--mainColor) !important;
}

#angularModal .close_icon {
    color: var(--mainColor) !important;
}

#angularModal .learner-header h3 {
    color: var(--mainColor) !important;
}

/*Page-loader color*/

/*.se-pre-con .img {
    filter: var(--pageLoarderFilter) !important;
}*/

.dot-pulse span {
    background-color: var(--mainColor) !important;
}

.learning_course_crown {
    color: var(--mainColor);
}

.learning_courses_title {
    color: var(--mainColor);
}

.learning_courses_items {
    color: var(--mainColor);
}

/*Learning Catalogue - Filter*/
.catalog-filter input[type="checkbox"] {
    accent-color: var(--mainColor) !important;
}

.slider-selection {
    background: var(--mainColor) !important;
}

.catalog-filter .apply-filter-btn {
    background: var(--mainColor) !important;
    color: var(--textColorWhite) !important;
}

.learning_courses_items img {
    filter: var(--mainColorIcon);
}

.sortby_btn img {
    filter: var(--mainColorIcon);
}

.sortby_btn {
    border: 1px solid var(--mainColor);
    color: var(--mainColor) !important;
}

.catalog_search_icon {
    filter: var(--mainColorIcon);
}

.catalog-filter .reset-filter-btn {
    color: var(--mainColor) !important;
}

.catalog-filter .reset-filter-btn {
    color: var(--mainColor) !important;
}

#SortFilter ul li:hover {
    background-color: var(--mainColor);
    color: #fff !important;
}

#SortFilter ul li:hover a {
    color: #fff !important;
}

.catalog-filter .collapse-dash {
    color: var(--mainColor) !important;
}

.catalog_close_icon {
    filter: var(--mainColorIcon);
}


.header_menu {
    color: var(--textColorBlack) !important;
}

.pagination > li.active > a, .pagination > li.active > span {
    background: var(--mainColor) !important;
    border: 1px solid var(--mainColor) !important;
    color: #fff;
}

.create_category_visibility_options .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary,
.create_category_visibility_options .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary {
    color: var(--mainColor) !important;
}


.create_category_visibility_options .bootstrap-switch-on {
    background: var(--mainColor) !important;
    border: 2px solid var(--mainColor) !important;
}

#form-category-details .modal-footer .course_layout_cancelbtn {
    border: 1px solid var(--mainColor) !important;
    color: var(--mainColor) !important;
}

.category-thumbnail-uploader-section .create_category_upload_image_section .btn {
    min-width: 136px;
    height: 33.98px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    color: var(--mainColor) !important;
    border: 1px solid var(--mainColor) !important;
}


.edit_category_visibility_options .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary,
.edit_category_visibility_options .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary {
    color: var(--mainColor) !important;
}


.edit_category_visibility_options .bootstrap-switch-on {
    background: var(--mainColor) !important;
    border: 2px solid var(--mainColor) !important;
}

#form-category-details .modal-footer .course_layout_cancelbtn {
    border: 1px solid var(--mainColor) !important;
    color: var(--mainColor) !important;
}


.category-image-uploader-full-container .create_category_upload_image_section .btn {
    min-width: 136px;
    height: 33.98px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    color: var(--mainColor) !important;
    border: 1px solid var(--mainColor) !important;
}

.catagories_index_table .catagory_management_table input[type="checkbox"] {
    accent-color: var(--mainColor) !important;
}

.create_category_visibility_options input[type="checkbox"] {
    accent-color: var(--mainColor) !important;
    width: 16px;
    height: 16px;
}

.edit_category_visibility_options input[type="checkbox"] {
    accent-color: var(--mainColor) !important;
    width: 16px;
    height: 16px;
}

.language_dropdown_arrow ul li:hover {
    color: var(--mainColor) !important;
    background-color: transparent;
}

#mainNAVNAV #pullTOPmenu .nav > li.currentpg > a::before {
    background-color: var(--mainColor) !important;
}

#pullTOPmenu .nav > li.currentpg > a {
    color: var(--mainColor) !important;
}

    #pullTOPmenu .nav > li.currentpg > a .nav-icon-images {
        filter: var(--mainColorIcon) !important;
    }

    #pullTOPmenu .nav > li.currentpg > a .nav-toggle-images {
        filter: var(--mainColorIcon) !important;
    }

.modal-footer .btn.btn-default.confirmation-btn-cancel {
    background: var(--textColorWhite) !important;
    color: var(--mainColor) !important;
    border-color: var(--mainColor) !important;
}

.catalog-filter .learning-catalog-filter-icon {
    filter: var(--mainColorIcon) !important;
}

.learning_Catalog_search_reset .learning_catalog_filterby_btn {
    background: var(--mainColor) !important;
    color: var(--textColorWhite) !important;
}

.learning_Catalog_search_reset .learning_catalog_filterby_btn .filter_by_btn {
    filter: var(--iconWhite) !important;
}

.notification-bell-icon {
    filter: var(--mainColorIcon) !important;
}

.notification-dropdown-wrapper .mark-all-read {
    color: var(--mainColor) !important;
}

.notification-dropdown-wrapper .notif-item:hover {
    color: var(--mainColor) !important;
}

.notification-dropdown-wrapper .notif-item:hover .notif-time {
    color: var(--mainColor) !important;
}

.mark-read-btn.mark-read-hover-btn:hover {
    color: var(--mainColor) !important;
}

.mark-read-btn.mark-read-hover-btn {
    color: var(--mainColor) !important;
}

#session-expire-warning-modal .modal-footer #btnLogoutNow {
    border: 1px solid var(--mainColor) !important;
    color: var(--mainColor) !important;
    background: var(--textColorWhite) !important;
}