:root {
    /*Main Colors*/
    --mainColor: #F65A5B;
    --pageHeaderTextColor: #000000;
    --buttonText: #fff;
    /*Tab navigation*/
    --tabBorderBottom: #2982da;
    --tabBackgroundColor: transparent;
    --tabTextColor: #2f4050;
    --personalDetailPropertyTitle: #555;
    --personalDetailProperty: #656d78;
    /*Blue button*/
    --blueButtonColor: #034da1;
    --blueButtonText: #fff;
    /*Change password modal*/
    --inputTextColor: #676a6c;
    /*Domain signin*/
    --signinTextColor: #F65A5B;
    --domainTextColor: #444;
    --domainPara: #848484;
    --signinBackgroundCard: #fff;
    --forgotPassword: #828282;
    --colorInputLabelblack: #676a6c;
    --signinBtnColor: #F65A5B;
    --signinBtnColorHoverBackgroundColor: #fffff;
    --signinBtnTextColor: #fff;
    --signinLanguageText: #2f4050;
    --signinRightsideBackground: #F65A5B;
    /*reset password*/
    --resetBtnColor: #F65A5B;
    --resetBtnTextColor: #fff;
    /*domain signin - language dropdown*/
    --languageDropdownSelectedBackground: #007bff;
    --languageDropdownSelectedText: #fff;
    --languageDropdownBackground: #fff;
    --languageDropdownText: #000;
    /*footer*/
    --footerBack: #212529;
    /*sidenav*/
    --sidenavBack: #000;
    --sidenavColor: #a7b1c2;
    --sidenavHover: #2f3949;
    --sidenavHoverLeftborder: #f82f30;
    --sidenavActive: #354052;
    /*Top bar*/
    --topBarText: #fff;
    --topBarBackground: #f65a5b;
    --btnBlueBackground: #034da1;
    --btnNormalColor: #999c9e;
    --dropdownText: #4c4848;
    --dropdownLanguageText: #000;
    --dropdownLanguageBackground: #fff;
    --dropdownLanguageBackgroundSelected: #007bff;
    --appSearchBorder: #ccd1d9;
    /*Label notification*/
    --emailNotification: #f8ac59;
    --emailNotificationText: #FFFFFF;
    /*Notification icon label*/
    --labelColor: #4665ff;
    /*landing page*/
    --HeroTitle: #444444;
    --landingSearchBack: #a8d4fb;
}



/*My profile*/

.btn-default, .btn-primary {
    color: var(--buttonText) !important;
    background-color: var(--mainColor) !important;
    border-color: var(--mainColor) !important;
}

.profile-name-role .user-name, .profile-name-role .user-role {
    color: var(--pageHeaderTextColor) !important;
}

.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {
    border-bottom: 2px solid var(--tabBorderBottom) !important;
    background-color: var(--tabBackgroundColor) !important;
    color: var(--tabTextColor) !important
}

.display-properties .property-title {
    color: var(--personalDetailPropertyTitle) !important;
}

.display-properties .property {
    color: var(--personalDetailProperty) !important;
}

.section-actions .btn-primary {
    color: var(--blueButtonText) !important;
    background-color: var(--mainColor) !important;
    border-color: var(--mainColor) !important;
}

/*change password modal, edit modal*/
.modal-dialog .modal-content .modal-body {
    color: var(--inputTextColor) !important;
}

/*Domain signIn*/
#form-control1, .form-control1 {
    color: var(--signinTextColor) !important;
}

#designationDropdown {
    color: var(--colorInputLabelblack) !important;
}

.sign-in-title.selected {
    border-bottom: 2px solid var(--signinBtnColor) !important;
    color: var(--signinBtnColor) !important;
}

.non-profile-page .language-bar .bootstrap-select.btn-group .dropdown-toggle .filter-option {
    font-family: Roboto, Helvetica Neue, Helvetica, Arial, sans-serif;
}

.wel1 {
    color: var(--signinTextColor) !important;
}

.wel {
    color: var(--domainTextColor) !important;
}

.para {
    color: var(--domainPara) !important;
}

.wrapper1 {
    background-color: var(--signinBackgroundCard) !important;
    color: var(--colorInputLabelblack) !important;
}

.forgot {
    color: var(--forgotPassword) !important;
}

.input-control .input-submit {
    background-color: var(--signinBtnColor) !important;
    color: var(--signinBtnTextColor) !important;
    /*border-radius: 40px !important;*/
}

.input-control .input-submit:hover {
    background-color: var(--signinBtnColorHoverBackgroundColor) !important;
    color: var(--signinBtnColor) !important;
    /*border-radius: 40px !important;*/    
    border: 1px solid var(--signinBtnColor) !important;
}

#edit-user-details .input-control .input-submit:hover {
    background-color: transparent !important;
}

#btn-help {
    color: var(--pageHeaderTextColor) !important;
    /*display: contents !important;*/
}

.sidenav_bottom_sec #btn-help {
    color: var(--sidenavColor) !important;
}

#page-wrapper.non-profile-page .language-bar .bootstrap-select button.btn {
    color: var(--signinLanguageText) !important;
    background-color: transparent !important;
}

.language-bar .bootstrap-select button.btn {
    background-color: var(--signinLanguageText) !important;
    background: var(--signinLanguageText) !important;
    border-color: var(--signinLanguageText) !important;
    color: var(--signinLanguageText) !important;
}

.rightimg {
    background: var(--signinRightsideBackground) !important;
}

.domain_signin_background {
    background-color: var(--signinRightsideBackground) !important;
}

.language-barnew-container {
    background-color: var(--signinRightsideBackground) !important;
}

#login_form .form-control:focus, .single-line:focus {
    border-color: var(--mainColor) !important;
}


/*reset password*/
.loginbtn {
    background: var(--resetBtnColor) !important;
    color: var(--resetBtnTextColor) !important;
}

/*domain signin - language dropdown*/
.language-bar li.selected {
    background-color: var(--languageDropdownSelectedBackground) !important;
}

.language-bar li.selected a {
    color: var(--languageDropdownSelectedText) !important;
}

.language-bar ul li a {
    color: var(--languageDropdownText) !important;
}

.language-bar ul li {
    background: var(--languageDropdownBackground) !important;
}

.language-bar .bootstrap-select.btn-group .dropdown-menu li:hover {
    background-color: var(--languageDropdownSelectedBackground) !important;
    color: var(--languageDropdownSelectedText) !important;
}



/*footer*/
#contactUS {
    background: var(--footerBack) !important;
    border-top: 5px solid var(--mainColor) !important;
}

#copyright {
    background: var(--footerBack) !important;
    color: var(--buttonText) !important;
}

/*sidenav*/
.metismenu a {
    background-color: var(--sidenavBack) !important;
}

.fixed-nav #wrapper {
    background-color: var(--sidenavBack) !important;
}

#pullTOPmenu .nav > li.active {
    border-left: 4px solid var(--sidenavHoverLeftborder) !important;
    background: var(--sidenavActive) !important;
}

#pullTOPmenu .navbar-default .nav > li > a:hover, .navbar-default .nav > li > a:focus {
    background-color: var(--sidenavHover) !important;
    color: var(--buttonText) !important;
}

#pullTOPmenu .nav > li.active > a {
    color: var(--buttonText) !important;
    background-color: var(--mainColor) !important;
}

#pullTOPmenu .nav > li > a {
    border-top: 0px solid var(--sidenavBack) !important;
}

/*Header (top bar)*/
.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(--topBarBackground) !important;
}

#insidemvcHEADER .nav > li > a.support-link:hover {
    background-color: var(--mainColor) !important;
    color: var(--topBarText) !important;
}

#insidemvcHEADER .nav > li > a.support-link {
    color: var(--btnNormalColor) !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;
}

#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;
}



/*gelp sidenav*/

.project_login_btn, .project_login_btn:hover, .project_login_btn:active, .project_login_btn:focus {
    background-color: var(--mainColor) !important;
    color: var(--buttonText) !important;
}

/*landing page*/
.watsan_gelp_hero_title {
    color: var(--HeroTitle) !important;
}

.watsan_gelp_hero_subtitle {
    color: var(--HeroTitle) !important;
}

.hero_watsan_gelp_proj_des {
    background-color: var(--mainColor) !important;
}

.course_cat_blacktext {
    color: var(--pageHeaderTextColor) !important;
}

.course_cat_projtext {
    color: var(--mainColor) !important;
}

.LandingPageCourseSearch {
    background-color: var(--landingSearchBack) !important;
    color: var(--mainColor) !important;
}

.PageColordCardBg {
    background-color: var(--mainColor) !important;
}

.LandingPageColordCardNo {
    color: var(--mainColor) !important;
}

.partnership_projectname {
    color: var(--mainColor) !important;
}

.partnership_project_info {
    color: var(--HeroTitle) !important;
}

.form-control {
    color: var(--mainColor) !important;
}

/*Gelp Responsive*/

.manageTenantResources-lableOr {
    color: #6b6b6b;
    font-size: 14px;
}

#designationDropdown {
    border-bottom: 2px solid #c1c1c1;
    border-radius: 0;
    margin-bottom: 12px;
    padding-left: 0px;
    appearance: auto;
}

#Email-error {
    color: #ff0000 !important;
}


/*Header icons position*/

.progbar {
    background-color: var(--mainColor) !important;
    background-image:none !important;
}

/*sidenav*/
.sidenav_bottom_sec {
    background-color: #2f4050 !important;
}

#page-wrapper.non-profile-page .language-bar .bootstrap-select button.btn {
    background-color: white !important;
}

#page-wrapper.profile-page .language-bar .bootstrap-select button.btn {
    background-color: transparent !important;
}

.sidenav_bottom_sec .dropdown-menu > li > a {
    /* background-color: #C1C7CD; */
    background-color: transparent !important;
}

.no-touch .dropdown-menu li > a:hover, 
.no-touch .dropdown-menu li > a:focus, 
.no-touch .dropdown-menu li > a:active {
    color: #262626 !important;
    background-color: #f5f5f5 !important;
}

.sidenav_bottom_sec a {
    background-color: transparent !important;
    color: #a7b1c2 !important;
}

#mainNAVNAV .metismenu {
    background-color: black;
}

.myacc_font a {
    color: #343a3b !important;
}

.progress-bar {
    color: var(--buttonText) !important;
}


/*Header*/
#insidemvcHEADER .nav.navbar-top-links a {
    color: #999c9e !important;
}


/*Media Queries for top Header*/
.domain_signin_background_container .sign-in-left-side-container .image-conatiner {
    /*height: 60px;*/
    height: 54px !important;
    aspect-ratio: 142 / 27 !important;
    width: 284px !important;
}

.navbar-default {
    background-image: linear-gradient(to bottom, #000 0%, #000 100%) !important;
}

.navbar-default .nav > li > a:hover, .navbar-default .nav > li > a:focus {
    background-color: #2f3949 !important;
    color: white !important;
}

.non-profile-page #copyright {
    border-top: 5px solid var(--mainColor) !important;
}

.sign-in-with-efass:hover {
    border: 1px solid var(--mainColor) !important;
}

.sign-in-with-efass {
    border-radius: 5px;
}

@media only screen and (min-width:760px) and (max-device-width: 770px) {
    #insidemvcHEADER .navbar-right {
        left: 41% !important;
    }
}

.loginbtn:hover {
    border: 1px solid var(--mainColor) !important;
    color: var(--mainColor) !important;
}

.landing_page_aboutus {
    padding-top: 17px !important;
}

.non-profile-page .nav-bar a:hover {
    background-color: var(--mainColor) !important;
}