body {
    background-color:white;
}

.img-footer {
    height:0.975rem;
    padding-bottom:0.2rem;
}

.ApplicationName {
    margin-top: auto;
    margin-bottom: auto;
    padding: 0rem 1.2rem 0rem 0rem;
}

/***Media Queries***/
@media only screen and (min-width: 576px) and (max-width: 850px) {
    .SectionContent {
        padding-top: var(--header-height, 9.8rem);
        padding-bottom: var(--header-height, 8.2rem);
    }

    /*.Section-Content-Home {
        padding: 6.2rem 0rem 6.2rem 0rem !important;
    }*/

    .nrSectionContent {
        padding: 5rem 0rem 5rem 0rem !important;
    }
}

@media only screen and (max-width : 576px) {
    .SectionContent {
        padding-top: var(--header-height, 13rem);
        padding-bottom: var(--header-height, 13rem);
    }

    /*.Section-Content-Home {
        padding: 10rem 0rem 10rem 0rem !important;
    }*/

    .nrSectionContent {
        padding: 9rem 0rem 9rem 0rem !important;
    }

    .hideWhenExtraSmall{
        display: none;
    }
}

@media only screen and (min-width : 850px) {
    .SectionContent {
        padding-top: var(--header-height, 9.8rem);
        padding-bottom: var(--header-height, 9.8rem);
    }

    /*.Section-Content-Home {
        padding: 5rem 0rem 5rem 0rem !important;
    }*/

    .nrSectionContent {
        padding: 5rem 0rem 5rem 0rem !important;
    }
}
/******/

/* #region Loader */
#uprogBusyIndicator {
    position: fixed;
    z-index: 1500;
    width: 100%;
    height: 100%;
    color: white;
    background-color: Black;
    opacity: .8;
    font-family: Calibri;
    font-size: 1.275rem;
    text-align: center;
    padding: 18rem 0;
}

/* #endregion */


.SignInSectionContent {
    padding: 8rem 0rem 8rem 0rem !important;
}

.CompanyLogo {
    max-height: 4rem;
    width: auto;
}

.SofcomCompanyLogo {
    height: 2.52rem;
}

.ProfilePicture {
    height: 7.52rem;
}

/*** (Start) Progress Bar ***/
.PBmodal {
    position: fixed;
    z-index: 1080;
    background-color: Black;
    filter: alpha(opacity=60);
    opacity: 0.8;
}

.PBcenter {
    z-index: 1000;
    margin: 300px auto;
    filter: alpha(opacity=100);
}
/*** (End) Progress Bar ***/

/***For Menu***/
.Menu {
    background-image: linear-gradient(to left, #0575e6, #021b79);
}

.MenuFontSize {
    font-size: 14px;
}

.ImgBtnMenu {
    height: 1.5rem;
    width: 1.5rem;
}
/******/

/***For Grid View***/
.GridMain {
    width: 100%;
    border: solid 1px Black;
    background-color: white;
}

.GridHeaderStyle {
    border: solid 1px Black;
    background-color: #6a93cb;
    /*background-image: linear-gradient(315deg, #a4bfef 0%, #6a93cb 74%);*/
    color: White;
    text-align: left;
}

    .GridHeaderStyle a {
        color: white !important;
    }

    .GridHeaderStyle th {
        padding:0.5rem 0.5rem 0.5rem 0.5rem;
        font-size:0.895rem;
        font-weight:600;
    }

.InnerDocGridHeaderStyle {
    border: solid 1px Black;
    background-color: peachpuff;
    color: black;
    text-align: left;
}

.GridRowStyle {
    /*border: solid 1px Black;*/
    color: Black;
    text-align: left;
}

    .GridRowStyle td {
        padding: 0.5rem 0.5rem 0.5rem 0.5rem;
    }

.GridAlternateRowStyle {
    /*border: solid 1px Black;*/
    background: rgb(242,242,242);
    color: Black;
    text-align: left;
}

    .GridAlternateRowStyle td {
        padding: 0.5rem 0.5rem 0.5rem 0.5rem;
    }

.GridFooterStyle {
    background-color: Transparent;
    color: black;
    text-align: left;
}

.GridPagerStyle {
    height: 25px;
    background-color: Transparent;
    color: black;
    border-style: hidden;
    border-color: transparent;
    /*border-top: black;*/
}

    .GridPagerStyle tr {
        border-style: hidden;
    }

    .GridPagerStyle td {
        padding: 7px;
        /*padding-left: 7px;*/
    }

    .GridPagerStyle a {
        display: inline-block;
        font-weight: 400;
        text-align: center;
        vertical-align: middle;
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        background-color: #007bff;
        border: 1px solid #007bff;
        padding: 0.375rem 0.75rem;
        font-size: 1rem;
        line-height: 1.5;
        border-radius: 0.25rem;
        transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
        color: #fff;
        background-color: #007bff;
        border-color: #007bff;
        width: 5.4rem;
    }

.GridControlStyle /* --- For the Select, Delete, Update or Edit button in a grid's column --- */ {
    text-align: left;
}

.GridSelectedRowStyle {
    background-color: cornsilk;
}

.GridRowHighlight {
    background-color: peachpuff;
}

.GridTextFormatting {
    white-space: pre-line;
}

.GridHeaderStyleFormated {
    border: solid 1px Black;
    background-color: #6a93cb;
    /*background-image: linear-gradient(315deg, #a4bfef 0%, #6a93cb 74%);*/
    color: White;
    text-align: left;
}

    .GridHeaderStyleFormated tr {
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
    }

    .GridHeaderStyleFormated a {
        color: white !important;
    }

    .GridHeaderStyleFormated th {
        padding: 0.4rem 0.4rem;
        font-size: 0.75rem;
        font-weight: 600;
    }

.GridRowStyleFormated {
    border: solid 1px Black;
    color: Black;
    text-align: left;
    /*padding:0.2rem 0.2rem;
    padding-left: 0.5rem;*/
}

    .GridRowStyleFormated tr {
        padding-top: 0.25rem;
        padding-bottom: 0.25rem;
    }

    .GridRowStyleFormated td {
        padding: 0.4rem 0.4rem;
        font-size: 0.75rem;
    }

.GridImage {
    height: 3rem;
    width: 4rem;
}
/******/

/***For Buttons***/
.Button{
    width:5rem;
}

.AR-Button {
    width: 6rem;
}

.CalendarButton {
    height: 1.756rem;
}
/******/

/***Form Headings***/
#DFrmHeading {
    background-color: #6a93cb;
    background-image: linear-gradient(315deg, #a4bfef 0%, #6a93cb 74%);
    color: white;
}
/******/

/***For Qualification Headind in Profile***/
.hQualification {
    background-color: #aecad6;
    background-image: linear-gradient(315deg, #aecad6 0%, #b8d3fe 74%);
    color: black;
}
/******/

/***For Home Page***/
.card-home {
    border-width: 0px;
    border-style: none;
}

.card-body-home {
    border: 1px solid #6a93cb;
    border-radius:  1rem;
    background-color: #6a93cb;
    background-image: linear-gradient(315deg, #a4bfef 0%, #6a93cb 74%);
    padding: 0.255rem;
}

.p-home{
    margin: 0rem;
    font-size: 1rem;
    font-weight: 600;
    color: white;
}

.cHome {
    border-radius: 2rem;
    border-width: 1px;
    border-style: solid;
    margin-bottom: 0.25rem !important;
}

.chHome {
    border-radius: 2rem 2rem 0rem 0rem !important;
    border-width: 1px;
    border-style: solid;
    background-color: #6a93cb;
    background-image: linear-gradient(315deg, #a4bfef 0%, #6a93cb 74%);
    color: white;
    padding: 0.3rem !important;
}

.cbHome {
    border-radius: 0rem 0rem 2rem 2rem !important;
    border-width: 1px;
    border-style: solid;
    padding: 0.3rem !important;
}

.PersonalInfo {
    background-color: #6a93cb;
    background-image: linear-gradient(315deg, #a4bfef 0%, #6a93cb 74%);
    border-color: #6a93cb;
}
/******/

/***For Multiline Textbox***/
.remarksTextbox {
    min-height: calc(1.6rem + 2px) !important;
    padding-top: 0.4rem !important;
    padding-bottom: 0.4rem !important;
}
/******/

/***For Label or Caption***/
.label-caption {
    padding-top: calc(0.375rem + 1px);
    padding-bottom: calc(0.375rem + 1px);
    margin-bottom: 0;
    font-size: 0.823rem;
    font-weight:500;
    line-height: 1.5;
}
/******/

/***For Checkbox***/
.checkbox input {
    margin-top: 0.3rem;
}

.checkbox Label {
    margin-left: 0.5rem;
    margin-right: 0.75rem;
    margin-bottom: 0rem !important;
}

.checkbox-address input {
    margin-top: 0.3rem;
}

.checkbox-address Label {
    margin-left: 0.2rem;
    margin-right: 0.2rem;
    margin-bottom: 0rem !important;
    font-size: 0.723rem;
}
/******/

/***For Multiline Textbox***/
.remarksTextbox {
    min-height: calc(1.6rem + 2px) !important;
    padding-top: 0.4rem !important;
    padding-bottom: 0.4rem !important;
}
/******/

/***For Picture Upload***/
.pic-upload {
    width:19.5rem;
}
/******/

/***For control's height***/
.control-height {
    height: 1.756rem;
}
/******/

/***For verification page sign in***/
.link-btn-verification {
    font-size: 1.234rem;
    font-weight: 630;
}
/******/

/***For Error Modal***/
.modal-header-Error {
    background-image: linear-gradient(to right, rgb(181, 0, 0),rgb(243, 195, 195));
}

.btnWidth {
    width: 4rem;
}

.btnSofcom {
    color: black !important;
    border: 1px solid transparent !important;
    padding: .25rem .5rem !important;
    font-size: 0.75rem !important;
    font-weight: 500;
    border-radius: .2rem !important;
    border-color: #D1D6DB !important;
    background-color: #D1D6DB !important;
    background-image: linear-gradient(to bottom,#FBFBFB,#FBFBFB,#D1D6DB) !important;
    /*display: inline-block;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    line-height: 1.5;
    -webkit-appearance: button;
    overflow: visible;
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;*/
}

    .btnSofcom:hover:not(:disabled) {
        cursor: pointer !important;
        background-image: linear-gradient(to bottom,#FBFBFB,#FBFBFB,#ACCCE7) !important;
        border-color: #D1D6DB !important;
        /*color: black !important;
        background-color: #ACCCE7;*/
    }

    .btnSofcom:focus, .btnSofcom.focus {
        box-shadow: 0 0 0 0.2rem #ACCCE7 !important;
        outline: 0px;
    }

    .btnSofcom.disabled, .btnSofcom:disabled {
        color: #6c757d !important;
        border-color: #FBFBFB !important;
        /*background-color: #FBFBFB !important;
        background-image: linear-gradient(to bottom,#FBFBFB,#FBFBFB);*/
    }

    .btnSofcom:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active {
        color: #fff !important;
        border-color: #005cbf;
        /*background-color: #0062cc !important;
        background-image: linear-gradient(to bottom,#FBFBFB,#D1D6DB);*/
    }

        .btnSofcom:not(:disabled):not(.disabled):active:focus, .btnSofcom:not(:disabled):not(.disabled).active:focus {
            box-shadow: 0 0 0 0.2rem #D1D6DB !important;
        }

.Pre-Line {
    white-space: pre-line;
}

#Verified {
    height: 6.575rem;
    width: 6.575rem;
}

.btn-Upload {
    background-color: darkgrey;
    color: white;
}

/* Remarks Textbox Minimum Height */

.remarksTextbox-minHeight {
    padding-top: 0.4rem !important;
    padding-bottom: 0.4rem !important;
}

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

.btn-SignIn {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
    font-family: Calibri;
    font-size: 20px;
}

.btn-Filter-sm {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
    font-family: Calibri;
    font-size: 16px;
}

    .btn-SignIn:hover, .btn-Filter-sm:hover {
        color: #fff;
        background-color: #0069d9;
        border-color: #0062cc;
    }

    .btn-SignIn:focus, .btn-SignIn.focus, .btn-Filter-sm:focus, .btn-Filter-sm.focus {
        color: #fff;
        background-color: #007bff;
        border-color: #007bff;
        box-shadow: 0 0 0 0.2rem rgba(255, 175, 60, 0.5);
    }

    .btn-SignIn.disabled, .btn-SignIn:disabled, .btn-Filter-sm.disabled, .btn-Filter-sm:disabled {
        color: #fff;
        background-color: #007bff;
        border-color: #007bff;
    }

    .btn-SignIn:not(:disabled):not(.disabled):active, .btn-SignIn:not(:disabled):not(.disabled).active,
    .show > .btn-SignIn.dropdown-toggle,
    .btn-Filter-sm:not(:disabled):not(.disabled):active, .btn-Filter-sm:not(:disabled):not(.disabled).active,
    .show > .btn-Filter-sm.dropdown-toggle {
        color: #fff;
        background-color: #007bff;
        border-color: #007bff;
    }


/* Remarks Textbox Minimum Height */

.remarksTextbox-minHeight {
    padding-top: 0.4rem !important;
    padding-bottom: 0.4rem !important;
}

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

.text-area-default-height {
    height: calc(1.5em + 0.5rem + 2px) !important;
}

.checkbox-caption {
    font-size: 0.823rem;
    font-weight: 500;
    line-height: 1.5;
}

.datepicker {
    width: 5.3rem;
}

.ui-datepicker-trigger {
    padding-bottom: 2px;
    width: 1.875rem !important;
    height: 2rem !important;
    margin-left: 2px;
    cursor: pointer;
    vertical-align: middle !important;
}

/************* Date Picker Style *************/

/* datepicker css */

.ui-datepicker {
    text-align: center;
}

.ui-datepicker-trigger {
    margin: 0 0 0 5px;
    vertical-align: text-top;
}

.ui-datepicker {
    font-family: Open Sans, Arial, sans-serif;
    margin-top: 2px;
    padding: 0 !important;
    border-color: #c9f0f5 !important;
}

.ui-datepicker {
    width: 256px;
}

.openemr-calendar .ui-datepicker {
    width: 191px;
}

.ui-datepicker table {
    width: 256px;
    table-layout: fixed;
}

.openemr-calendar .ui-datepicker table {
    width: 191px;
    table-layout: fixed;
}

.ui-datepicker-header {
    background-color: #3e9aba !important;
    background-image: none !important;
    border-radius: 0;
}

.openemr-calendar .ui-datepicker-header {
    background-color: #e6f7f9 !important;
    border-width: 1px;
    border-color: #c9f0f5;
    border-style: solid;
}

.ui-datepicker-title {
    line-height: 35px !important;
    margin: 0 10px !important;
}

.openemr-calendar .ui-datepicker-title {
    line-height: 20px !important;
}

.ui-datepicker-prev span {
    display: none !important;
}

.ui-datepicker-next {
    text-align: center;
}

    .ui-datepicker-next span {
        display: none !important;
    }

.ui-datepicker-prev {
    background-color: transparent !important;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAMCAYAAACulacQAAAAUklEQVQYlXWPwQnAMAwDj9IBOlpH8CjdJLNksuujFIJjC/w6WUioFBcqJ7sGEAD5Y/hpqLRghRv4YQlUjqXI3Kql2MixraGbEhVcDXcFUR/1egEHNuTBpFW0NgAAAABJRU5ErkJggg==') !important;
    height: 12px !important;
    width: 7px !important;
    margin: 14px 12px;
    display: inline-block;
    left: 0 !important;
    top: 0 !important;
}

.openemr-calendar .ui-datepicker-prev {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAOCAYAAAD9lDaoAAAAuUlEQVQokXXRsUtCYRAA8J8pDQ1CVIgIgtBU2NDiZIuDS4uLf6WDS1O0tLREEE8icBNKS3lTs8/B78XHw3dwcHA/juOuqjzucYJVrQQMcYctvo4OgEFIeMK6iPphCjzjEWLUC3vACx7yRo5uMUIFr5gii1EL41AvMIkBVPGH04DrSLEsIvjEOZq4wi9+iijDR0ANXOMbmxjlcIY2LtANO6YxymGCDs5wg/ciYv+KBJeY4+2A+Y9j4Y47RtUkrNXeDxUAAAAASUVORK5CYII=') !important;
    height: 14px !important;
    width: 9px !important;
    margin: 5px !important;
}

.ui-datepicker-next {
    cursor: pointer;
}

.ui-datepicker-prev {
    cursor: pointer;
}

.ui-datepicker-next {
    background-color: transparent !important;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAMCAYAAABfnvydAAAAVUlEQVQYlXWQ0Q3AIAhEL07gKI7kKN2kI3Wk1w9to3KQEELucQEECOizhhTQGHFnwOdgobWx0GkZILfYBhXl0STVbPoBarbkL7ozN/F8VBBXh8uJgF5r2hrI4GHUkAAAAABJRU5ErkJggg==') !important;
    height: 12px !important;
    width: 8px !important;
    margin: 14px 12px;
    display: inline-block;
    right: 0 !important;
    top: 0 !important;
}

.openemr-calendar .ui-datepicker-next {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAOCAYAAAASVl2WAAAAtElEQVQYlXXQsUpCcRQH4I97EQyHa1pgIEE0hBGYL+BjNLRFjxXh4rM4F21BS4S4FAgqQioOngt/RM/6+zi/w4EanlA4MDkecYsO3vG/D8a4Rx03eMMqBQt8oodTXAdalwBm+IpNDVxG3aYEMMU3ujjDBT5SAH9R2cE58mwPFOgneJSCGp7RjLoXTEtQjbCFOV7xCxkqdp9sYxnhpFyb4QFXdh8c4Cc9Ko++OwzjFwfn5FiwBVeuI/K2UCkSAAAAAElFTkSuQmCC') !important;
    height: 14px !important;
    width: 8px !important;
    margin: 5px;
}

.ui-datepicker-month {
    border-radius: 2px;
    background-color: #3985a0;
    width: 110px !important;
    height: 22px;
    font-family: Open Sans !important;
    color: #fff;
    font-size: 14px !important;
    font-weight: 600;
    text-align: left;
    border: none !important;
    margin-right: 17px !important;
    vertical-align: text-top;
}

.openemr-calendar .ui-datepicker-month {
    font-family: Open Sans, Arial, sans-serif;
    color: rgba(34, 34, 34, 0.87);
    font-size: 12px !important;
    font-weight: 700;
    text-align: center;
    transform: scaleX(1.0029)
}

.ui-datepicker-year {
    border-radius: 2px;
    background-color: #3985a0;
    width: 61px !important;
    height: 22px;
    border: none !important;
    font-family: Open Sans !important;
    color: #fff;
    font-size: 14px !important;
    font-weight: 600;
    text-align: left;
    vertical-align: text-top;
}

.openemr-calendar .ui-datepicker-year {
    font-family: Open Sans, Arial, sans-serif;
    color: rgba(34, 34, 34, 0.87);
    font-size: 12px !important;
    font-weight: 700;
    text-align: center;
    transform: scaleX(1.0029)
}

.ui-datepicker-month option,
.ui-datepicker-year option {
    color: #3985a0 !important;
    background-color: #fff !important;
    font-family: Open Sans !important;
    font-size: 14px !important;
    font-weight: 600;
}

    .ui-datepicker-month option[selected],
    .ui-datepicker-year option[selected] {
        background-color: #e5edf0 !important;
    }

.ui-datepicker .ui-state-hover {
    /*background: none !important;*/
    border: 0 !important;
}

.ui-datepicker td {
    vertical-align: top;
}

.ui-datepicker .ui-state-default {
    border-radius: 2px;
    border-color: #edebeb !important;
    /*     background: white !important; */
    width: 24px;
    height: 24px;
    padding: 0 !important;
    line-height: 24px;
    text-align: center !important;
    font-family: Open Sans, Arial, sans-serif;
    color: #707070;
    font-size: 13px;
    font-weight: 400 !important;
    margin: 7px 0 0 4px;
}

    .ui-datepicker .ui-state-default.ui-state-highlight {
        border-color: #dcdcdc;
        background-color: #cff3f8 !important;
        color: #3e9aba !important;
    }

.openemr-calendar .ui-state-default {
    font-size: 10px;
    margin: 0;
}

.ui-datepicker td {
    width: 33px;
}

.openemr-calendar .ui-datepicker td {
    width: 26px;
}

.openemr-calendar .ui-state-default {
    width: 26px;
    height: 20px;
    line-height: 20px;
}

.ui-state-default.ui-state-hover {
    border-color: #dcdcdc;
    background-color: #cff3f8 !important;
}

.ui-datepicker .ui-state-active {
    border-color: #dcdcdc;
    background-color: #cff3f8 !important;
    color: #3e9aba !important;
}

.ui-datepicker-calendar thead tr th {
    font-family: Open Sans, Arial, sans-serif;
    color: #549fa8;
    font-size: 12px;
    font-weight: 400;
    padding: 0.45em 0.3em !important;
    /*   width: 15px !important; */
}

.openemr-calendar .ui-datepicker-calendar thead tr th {
    font-size: 10px;
}

.ui-datepicker-close {
    display: none;
}

.ui-datepicker thead {
    background-color: #f5f5f5;
}

.openemr-calendar .ui-datepicker thead {
    background: none;
}

.ui-state-default.ui-datepicker-current {
    float: none !important;
    font-family: Open Sans, Arial, sans-serif;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    text-align: left;
    border-width: 0 !important;
    border: none;
    vertical-align: top;
    margin: 0 !important;
    background-color: transparent !important;
}

.ui-datepicker-buttonpane.ui-widget-content {
    text-align: center;
    background-color: #3e9aba;
    margin: 0 !important;
    height: 28px;
    padding: 0 !important;
}

.openemr-calendar .ui-datepicker-year {
    background-color: transparent;
}

.openemr-calendar .ui-datepicker-month {
    background-color: transparent;
}

.openemr-calendar .ui-state-default {
    border: 0 !important;
}

.openemr-calendar .ui-datepicker-month {
    margin-right: 10px !important;
}

/************* Date Picker Style *************/

/************ Sub Section Heading *************/

.sub-heading {
    color: white;
    background: #00c6ff; /* fallback for old browsers */
    background: -webkit-linear-gradient(to left, #00c6ff, #0072ff); /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to left, #00c6ff, #0072ff); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    border-radius: 0.25rem !important;
}

.sub-Panel {
    color: white;
    background: #2C3E50; /* fallback for old browsers */
    background: -webkit-linear-gradient(to left, #4CA1AF, #2C3E50); /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to left, #4CA1AF, #2C3E50); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    border-radius: 0.25rem !important;
}

/************ Sub Section Heading *************/


/************ Progress Bar CSS ************/

#progressbar {
    margin-bottom: 30px;
    overflow-y: hidden;
    overflow-x: auto;
    color: #929292;
}

    #progressbar .active {
        color: #673AB7
    }

    #progressbar li {
        list-style-type: none;
        font-size: 15px;
        width: 15rem;
        float: left;
        position: relative;
        font-weight: 400
    }

        /*#progressbar #account:before {
        content: "\f13e"
    }

    #progressbar #personal:before {
        content: "\f007"
    }

    #progressbar li:before {
        content: "\f030"
    }*/

        #progressbar li:before {
            width: 50px;
            height: 50px;
            line-height: 45px;
            display: block;
            font-family: FontAwesome;
            font-size: 20px;
            color: #ffffff;
            background: #929292;
            border-radius: 50%;
            margin: 0 auto 10px auto;
            padding: 2px
        }

        #progressbar li:before {
            content: "\f00c";
        }

        #progressbar li:after {
            content: '';
            width: 100%;
            height: 2px;
            background: #929292;
            position: absolute;
            left: 0;
            top: 25px;
            z-index: -1
        }

        #progressbar li.requisition-task-completed {
            color: #38a73b;
        }

            #progressbar li.requisition-task-completed:before,
            #progressbar li.requisition-task-completed:after {
                background: #38a73b;
            }

            #progressbar li.requisition-task-completed:before {
                content: "\f00c";
                font-family: "Font Awesome 5 Free";
                font-style: normal;
                font-weight: normal;
                font-size: 40px;
                color: white;
            }

        #progressbar li.requisition-task-in-process {
            color: #03a9f4;
        }

            #progressbar li.requisition-task-in-process:before,
            #progressbar li.requisition-task-in-process:after {
                background: #03a9f4;
            }

            #progressbar li.requisition-task-in-process:before {
                content: "\f00d";
            }

/************ Progress Bar CSS ************/


/* Table Cell BG Colors */

.tbl-cell-bg-success {
    background-color: #5ccc76 !important;
    color: #fff;
}

.tbl-cell-bg-danger {
    background-color: #e85e6b !important;
    color: #fff;
}

/* Table Cell BG Colors */

/* Error Window Modal */

.ErrorWindowHeader {
    background: #ED213A; /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #93291E, #ED213A); /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #93291E, #ED213A); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

/* Error Window Modal */

.menuButton {
    flex: 1 1 auto;
    padding: 0.5rem 2rem;
    text-align: center;
    transition: 0.5s;
    background-size: 200% auto;
    color: white;
    /* text-shadow: 0px 0px 10px rgba(0,0,0,0.2);*/
    box-shadow: 0 0 20px #eee;
    border-radius: 5px;
    width: 100%;
}

    .menuButton:hover {
        color: #ffffff;
        text-decoration: none;
        background-position: right center;
    }

.menuButtonBlue {
    color: #ffffff;
    text-decoration: none;
    /*background: #0575E6;*/ /* fallback for old browsers */
    /*background: -webkit-linear-gradient(to top, #021B79, #0575E6);*/ /* Chrome 10-25, Safari 5.1-6 */
    /*background: linear-gradient(to top, #021B79, #0575E6);*/ /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    /*background: #00c6ff;*/ /* fallback for old browsers */
    /*background: -webkit-linear-gradient(to top, #0072ff, #00c6ff);*/ /* Chrome 10-25, Safari 5.1-6 */
    /*background: linear-gradient(to top, #0072ff, #00c6ff);*/ /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    /*background: #0052D4;*/ /* fallback for old browsers */
    /*background: -webkit-linear-gradient(to right, #6FB1FC, #4364F7, #0052D4);*/ /* Chrome 10-25, Safari 5.1-6 */
    background-image: linear-gradient(to left, #6FB1FC, #4364F7, #0052D4); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

    .menuButtonBlue:active {
        background-image: linear-gradient(to left, #0052D4, #0052D4, #0052D4);
        color: #ffffff;
        text-decoration: none;
    }

.menuButtonOrange {
    color: #ffffff;
    text-decoration: none;
    /*background: #f12711;*/ /* fallback for old browsers */
    /*background: -webkit-linear-gradient(to right, #f5af19, #f12711);*/ /* Chrome 10-25, Safari 5.1-6 */
    background-image: linear-gradient(to right, #f12711, #f5af19); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

    .menuButtonOrange:active {
        background-image: linear-gradient(to left, #f12711, #f12711);
        color: #ffffff;
        text-decoration: none;
    }

.menuButtonRed {
    color: #ffffff;
    text-decoration: none;
    /*background: #f12711;*/ /* fallback for old browsers */
    /*background: -webkit-linear-gradient(to right, #f5af19, #f12711);*/ /* Chrome 10-25, Safari 5.1-6 */
    background-image: linear-gradient(to right, #b31217, #e52d27); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

    .menuButtonRed:active {
        background-image: linear-gradient(to left, #b31217, #e52d27);
        color: #ffffff;
        text-decoration: none;
    }

.menuButtonGreen {
    color: #ffffff;
    text-decoration: none;
    /*background: #56ab2f;*/ /* fallback for old browsers */
    /*background: -webkit-linear-gradient(to right, #a8e063, #56ab2f);*/ /* Chrome 10-25, Safari 5.1-6 */
    background-image: linear-gradient(to right, #56ab2f, #a8e063); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

    .menuButtonGreen:active {
        background-image: linear-gradient(to left, #56ab2f, #a8e063);
        color: #ffffff;
        text-decoration: none;
    }

.translucentIcon {
    opacity: 0.50;
}

.menuButtonHeading{
    font-weight: 500 !important;
}

.menuButtonHeight{
    height: 100px;
}


/************ Job Card Styles *************/

.jobCardShadow {
    filter: drop-shadow(5px 5px 4px #dbd5d5);
}

.jobCardLink p{
    text-decoration: none;
}

.jobCardLink:hover p{
    text-decoration: none;
}

/************ Job Card Styles *************/

/************ Circle Button ************/

.btn-circle {
    border-radius: 50px;
}

/************ Circle Button ************/

input.btn-link, button.btn-link:focus{
    outline: none;
}

/******** Small Text Box ********/

.smallTextBoxWidth {
    width: 3.1rem !important;
}

/******** Small Text Box ********/

/***** Table Row Strike Through *****/

tr.strikethrough {
    text-decoration: line-through;
}

/***** Table Row Strike Through *****/

/***** Password Hiding functionality *****/
.password-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}

    .password-wrapper input {
        width: 100%;
        padding-right: 40px; /* Make space for the custom img */
    }

        /* Hide default password visibility toggle in Edge */
        .password-wrapper input::-ms-reveal {
            display: none; /* Edge */
        }

        /* Hide default password visibility toggle in Webkit browsers (Chrome, Safari) */
        .password-wrapper input::-webkit-textfield-decoration-container {
            display: none; /* Chrome, Safari */
        }

    .password-wrapper img.toggle-password-img {
        position: absolute;
        top: 50%;
        right: 10px;
        transform: translateY(-50%);
        width: 22px;
        cursor: pointer;
    }

        .password-wrapper img.toggle-password-img:hover {
            opacity: 0.7; /* Add hover effect */
        }