@import url('https://fonts.googleapis.com/css2?family=Baloo+Paaji+2:wght@400;500;600;700&display=swap');

body {
    font-family: 'Baloo Paaji 2', sans-serif;
}

.innerPage {
    background: #ffffff;
}

.clear {
    clear: both;
    display: block;
    width: 100%;
}

.padding5 {
    padding: 5px;
}

.padding10 {
    padding: 10px;
}

.padding20 {
    padding: 20px;
}

.padding30 {
    padding: 30px;
}

sup {
    vertical-align: 0;
    position: relative;
    top: -0.25em;
}

.wrapper {
    width: 100%;
    overflow: hidden;
    z-index: 0;
}

.commonLink {
    color: #eb3b95;
    font-weight: 700;
    text-decoration: none;
}

ul.numList {
    list-style: decimal;
    color: #503191;
    margin-left: 25px;
}

    ul.numList.white {
        color: #ffffff;
    }

    ul.numList li {
        padding: 5px;
        font-size: 13px;
        line-height: 18px;
        color: #212330;
    }

.showPrint {
    display: none;
}

.backTopBtn {
    background: url(../images/back-to-top-btn.png) no-repeat;
    background-position: center center;
    background-size: 100% 100%;
    position: fixed;
    bottom: -150px;
    right: 35px;
    width: 100px;
    height: 49px;
    z-index: 2;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    cursor: pointer;
}

.dateTimeStamp {
    text-align: right;
    font-size: 11px;
    line-height: 11px;
    margin: 5px;
    color: #606163 !important;
    text-transform: none;
    font-weight: 400;
    font-style: italic;
}

.versionUpdate {
    position: absolute;
    top: 25px;
    right: 25px;
    font-size: 13px;
    line-height: 18px;
    color: #212330;
    font-style: italic;
}

    .versionUpdate.relative {
        position: relative;
        top: 0;
        right: 0;
        text-align: right;
        margin-right: 25px;
    }

.successMsg {
    width: calc(100% - 22px);
    border-radius: 5px;
    color: #009b98;
    font-size: 13px;
    line-height: 18px;
    padding: 10px;
    margin: 20px 0;
    background: #e5f5f4;
    border: 1px solid #009b98;
}

    .successMsg span {
        background: url(../images/success-icon.png) no-repeat left center;
        padding-left: 25px;
        display: block;
    }

.errorMsg {
    width: calc(100% - 22px);
    border-radius: 5px;
    color: #cd0a0a;
    font-size: 13px;
    line-height: 18px;
    padding: 10px;
    margin: 20px 0;
    background: #fae6e6;
    border: 1px solid #cd0a0a;
}

    .errorMsg span {
        background: url(../images/error-icon.png) no-repeat left center;
        padding-left: 25px;
        display: block;
    }
/******Form Fields******/
/**Error msg**/
label.error {
    font-size: 10px !important;
    line-height: 12px !important;
    color: #c63c3c !important;
    margin: 5px !important;
    display: block;
    text-transform: none !important;
    font-weight: 400 !important;
    text-align: left;
}
/**Input text field**/
input[type="text"], input[type="password"] {
    font-family: 'Baloo Paaji 2', sans-serif;
    color: #6c757d !important;
    font-size: 14px !important;
    border-radius: 5px;
    border: 1px solid #e9edf3;
    padding: 6px 25px 4px 10px;
    background: #ffffff; /*margin:5px 0;*/
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 100%;
    -webkit-appearance: none;
    margin: 0 !important;
}

.formPage input[type="text"] {
    background: #ffffff;
    border: 1px solid #f1f1f1;
}

.modal input[type="text"] {
    background: #ffffff;
    border: 1px solid #f1f1f1;
}

input[type="text"].usernameIcon {
    background-image: url("../images/login-username.png");
    background-position: 98% center;
    background-repeat: no-repeat;
    padding-right: 30px !important;
}

input[type="password"].pwdIcon {
    background-image: url("../images/login-pwd.png");
    background-position: 98% center;
    background-repeat: no-repeat;
    padding-right: 30px !important;
}

input[type="text"].calendar {
    background-image: url(../images/calendar-icon.png);
    background-position: 98% center;
    background-repeat: no-repeat;
    padding-right: 30px;
}

input[type="text"].time {
    background-image: url(../images/clock-icon.png);
    background-position: 98% center;
    background-repeat: no-repeat;
    padding-right: 30px;
}

input[type="text"].dollar {
    background-image: url("../images/dollar-icon.png") !important;
    background-position: 10px center !important;
    background-repeat: no-repeat !important;
    padding-left: 30px !important;
}

input[type="text"]:disabled, input[type="password"]:disabled {
    background: #f5f7fa;
    border: 1px solid #e9edf3;
    -webkit-text-fill-color: #6c757d;
    opacity: 1; /* required on iOS */
}

input[type="text"].calendar:disabled {
    background: #f5f7fa url(../images/calendar-icon.png);
    background-position: 98% center;
    background-repeat: no-repeat;
    -webkit-text-fill-color: #6c757d;
    opacity: 1; /* required on iOS */
}

input[type="text"].time:disabled {
    background: #f5f7fa url(../images/time-icon.png);
    background-position: 98% center;
    background-repeat: no-repeat;
    -webkit-text-fill-color: #6c757d;
    opacity: 1; /* required on iOS */
}

input[type="text"].dollar:disabled {
    background: #f5f7fa url(../images/dollar-icon.png);
    background-position: 10px center;
    background-repeat: no-repeat;
    -webkit-text-fill-color: #6c757d;
    opacity: 1; /* required on iOS */
}

::-webkit-input-placeholder {
    color: #6c757d;
    opacity: 0.5;
}

:-ms-input-placeholder {
    color: #6c757d;
    opacity: 0.5;
}

::placeholder {
    color: #6c757d;
    opacity: 0.5;
}
/**TextArea**/
textarea {
    font-family: 'Baloo Paaji 2', sans-serif;
    color: #6c757d;
    font-size: 14px;
    border-radius: 5px;
    border: none;
    padding: 10px;
    background: #fffff;
    border: 1px solid #e9edf3; /*margin:5px 0;*/
    height: 100px;
    resize: none;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 100%;
    -webkit-appearance: none;
}

    textarea:disabled {
        background: #f5f7fa;
        border: 1px solid #e9edf3;
        -webkit-text-fill-color: #6c757d;
        opacity: 1; /* required on iOS */
    }
/**Input select field**/
select {
    font-family: 'Baloo Paaji 2', sans-serif;
    color: #6c757d;
    font-size: 14px;
    border-radius: 5px;
    border: none;
    padding: 6px 25px 4px 10px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: url(../images/drop-down.png) 97% no-repeat #ffffff; /*margin:5px 0;*/
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    border: 1px solid #e9edf3;
    width: 100%;
}

    select::-ms-expand {
        display: none; /* remove default arrow on ie10 and ie11 */
    }

    select option {
        background: #ffffff;
        border: none;
        color: #6c757d;
        font-family: 'Baloo Paaji 2', sans-serif;
        padding: 7.5px 0;
        font-size: 14px;
    }

        select option:disabled {
            background: #f5f7fa;
            color: #7e7e7e;
        }

    select:disabled {
        background: url(../images/drop-down.png) 97% no-repeat #f5f7fa;
        -webkit-text-fill-color: #6c757d;
        opacity: 1; /* required on iOS */
    }

@media screen and (min-width:0\0) {
    select {
        background: none\9;
        padding: 5px\9;
    }
}
/**Input checkbox**/
.checkBoxStyle {
    display: block;
    position: relative;
    padding-left: 20px !important; /*margin:0 0 5px 0 !important;*/
    cursor: pointer;
    font-size: 14px;
    line-height: 18px;
    color: #6c757d;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    text-align: left !important;
}

.priorityOption .checkBoxStyle {
    font-size: 13px;
    line-height: 13px;
}

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

.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 13px;
    width: 13px !important;
    border-radius: 5px;
    background-color: #ffffff;
    border: 1px solid #bbbbbb;

}

.checkBoxStyle:hover input ~ .checkmark {
    background-color: #ffffff;
    border: 1px solid #bbbbbb;

}

.checkBoxStyle input:checked ~ .checkmark {
    background-color: #00aeef;
    border: 1px solid #00aeef;
}

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

.checkBoxStyle input:checked ~ .checkmark:after {
    display: block;
}

.checkBoxStyle .checkmark:after {
    left: 4px;
    top: 2px;
    width: 3px;
    height: 6px;
    border: solid white;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
/*Input radio*/
[type="radio"]:checked, [type="radio"]:not(:checked) {
    position: absolute;
    left: -9999px;
}

    [type="radio"]:checked + label,
    [type="radio"]:not(:checked) + label {
        position: relative;
        padding-left: 20px;
        cursor: pointer;
        line-height: 15px;
        display: inline-block;
        color: #6c757d;
        font-size: 14px;
        font-weight: 400;
    }

        [type="radio"]:checked + label:before,
        [type="radio"]:not(:checked) + label:before {
            content: '';
            position: absolute;
            left: 0;
            top: 0;
            width: 12px;
            height: 12px;
            border: 1px solid #e9edf3;
            border-radius: 100%;
            background: #ffffff;
        }

        [type="radio"]:checked + label:after,
        [type="radio"]:not(:checked) + label:after {
            content: '';
            width: 5px;
            height: 5px;
            border: 5px solid #00aeef;
            background #ffffff;
            position: absolute;
            top: 0;
            left: 0;
            border-radius: 100%;
            -webkit-transition: all 0.2s ease;
            transition: all 0.2s ease;
        }

        [type="radio"]:not(:checked) + label:after {
            opacity: 0;
            -webkit-transform: scale(0);
            transform: scale(0);
        }

        [type="radio"]:checked + label:after {
            opacity: 1;
            -webkit-transform: scale(1);
            transform: scale(1);
        }
/**Submit Button**/
input[type=submit], input[type=button], input[type=reset] {
    cursor: pointer;
    -webkit-appearance: none;
    border-radius: 5px;
    width: auto;
    border: none;
    font-family: 'Baloo Paaji 2', sans-serif;
}
/**Note msg**/
.note {
    font-size: 10px;
    line-height: 12px !important;
    color: #ffffff;
    margin: 0 5px 5px 5px;
    display: block;
}
/**Buttons style**/
.loginBtn {
    background: #00aeef;
    color: #ffffff;
    text-align: center;
    font-size: 14px;
    line-height: 14px;
    padding: 11px 0 9px 0;
    display: block;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 600;
    margin-bottom: 5px;
    width: 100% !important;
}

    .loginBtn.grey {
        background: #6c757d;
        color: #ffffff;
    }

.searchFilterBtn {
    background: #2e3192;
    color: #ffffff;
    text-align: center;
    font-size: 14px;
    line-height: 14px;
    padding: 12px 20px 9px 20px;
    display: block;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 400;
    width: auto;
}

    .searchFilterBtn.grey {
        color: #6c757d;
        margin-left: 5px;
        background: url("../images/filter-icon.png") #e9edf3;
        background-position: 10px center;
        background-repeat: no-repeat;
        padding-left: 35px !important;
    }

.submitBtn {
    background: #2e3192;
    color: #ffffff;
    text-align: center;
    font-size: 14px;
    line-height: 14px;
    padding: 11px 20px 9px 20px;
    display: inline-block;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 400;
    width: auto;
}

    .submitBtn.clearFilter {
        margin: 20px 10px;
    }

.backBtn {
    background: #6c757d;
    color: #ffffff;
    text-align: center;
    font-size: 14px;
    line-height: 14px;
    padding: 11px 20px 9px 20px;
    display: inline-block;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 400;
    width: auto;
}

.submitBtn.blue {
    background: #00aeef;
    color: #ffffff;
}

.submitBtn.grey {
    background: #e9edf3;
    color: #6c757d;
}

.serviceFeeRefund .submitBtn, .serviceFeeRefund .backBtn {
    margin-left: 0 !important;
    margin-right: 7.5px !important;
    margin-bottom: 10px;
}

.commonBtn {
    background: #e9edf3;
    color: #6c757d;
    text-align: center;
    font-size: 14px;
    line-height: 14px;
    padding: 11px 12px 9px 10px;
    display: block;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 400;
    width: auto;
}

    .commonBtn.purple {
        background: #2e3192;
        color: #ffffff;
    }

    .commonBtn.blue {
        background: #00aeef;
        color: #ffffff;
    }

    .commonBtn.darkGrey {
        background: #6c757d;
        color: #ffffff;
    }

    .commonBtn.green {
        background: #20b799;
        color: #ffffff;
    }

    .commonBtn.fullWidth {
        width: 100%;
    }

    .commonBtn.createNew {
        background-image: url("../images/createNew-icon.png");
        background-position: 10px center;
        background-repeat: no-repeat;
        padding-left: 35px !important;
        display: inline-block;
    }

    .commonBtn.viewBtn {
        background-image: url("../images/view-btn.png");
        background-position: 10px center;
        background-repeat: no-repeat;
        padding-left: 35px !important;
        display: inline-block;
    }

    .commonBtn.uploadReceipt {
        background-image: url("../images/upload-icon.png");
        background-position: 10px center;
        background-repeat: no-repeat;
        padding-left: 35px !important;
        display: inline-block;
        margin-left: 5px;
    }

    .commonBtn.priority {
        background-image: url("../images/priority-icon.png");
        background-position: 10px center;
        background-repeat: no-repeat;
        padding-left: 35px !important;
    }

    .commonBtn.assignTo {
        background-image: url("../images/assignTo-icon.png");
        background-position: 10px center;
        background-repeat: no-repeat;
        padding-left: 35px !important;
    }

    .commonBtn.attachFile {
        background-image: url("../images/attach-icon.png");
        background-position: 10px center;
        background-repeat: no-repeat;
        padding-left: 35px !important;
    }

    .commonBtn.popOut {
        background-image: url("../images/popup-icon.png");
        background-position: 10px center;
        background-repeat: no-repeat;
        padding-left: 35px !important;
    }

    .commonBtn.createFolder {
        background-image: url("../images/folder-icon.png");
        background-position: 10px center;
        background-repeat: no-repeat;
        padding-left: 35px !important;
    }

    .commonBtn.uploadDoc {
        background-image: url("../images/upload-icon.png");
        background-position: 10px center;
        background-repeat: no-repeat;
        padding-left: 35px !important;
    }

    .commonBtn.downloadDoc {
        background-image: url("../images/download-icon.png");
        background-position: 10px center;
        background-repeat: no-repeat;
        padding-left: 35px !important;
    }

.contractProfile .commonBtn.uploadDoc {
    background-image: none;
    padding-left: 0 !important;
}

    .contractProfile .commonBtn.uploadDoc::before {
        content: url("../images/upload-icon.png");
        margin-right: 10px;
    }

.commonBtn.delFile {
    background-image: url("../images/del-btn.png");
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 35px !important;
}

.commonBtn.crop {
    background-image: url("../images/crop.png");
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 30px !important;
}

.commonBtn.edit {
    background-image: url("../images/edit-btn.png");
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 30px !important;
}

.commonBtn.send {
    background-image: url("../images/send-icon.png");
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 30px !important;
}

.commonBtn.acknowledge {
    background-image: url("../images/acknowledge-btn.png");
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 35px !important;
}

.commonBtn.view {
    width: auto !important
}

    .commonBtn.view span:before {
        content: "";
        background-image: url("../images/view-btn.png");
        background-position: 0 center;
        background-repeat: no-repeat;
        padding-left: 20px !important;
    }

.commonBtn.bulkApprove {
    background: #20b799;
    background-image: url("../images/approve-icon.png");
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 35px !important;
    color: #ffffff;
}

.commonBtn.bulkReject {
    background: #fa5944;
    background-image: url("../images/reject-icon.png");
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 35px !important;
    color: #ffffff;
}

.commonBtn.print {
    background-image: url("../images/print-btn.png");
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 35px !important;
}

.commonBtn.export {
    background-image: url("../images/export-icon.png");
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 35px !important;
}

.gridBtn {
    background: #ffffff url("../images/grid-icon.png");
    color: #00aeef;
    text-align: center;
    font-size: 14px;
    line-height: 14px;
    padding: 10px 12px 8px 10px;
    display: block;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 400;
    width: auto;
    border: 1px solid #00aeef !important;
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 30px !important;
}

    .gridBtn.active {
        background: #00aeef url("../images/grid-icon-active.png");
        color: #ffffff;
        background-position: 10px center;
        background-repeat: no-repeat;
        padding-left: 30px !important;
    }

.listBtn {
    background: #ffffff url("../images/list-icon.png");
    color: #00aeef;
    text-align: center;
    font-size: 14px;
    line-height: 14px;
    padding: 10px 12px 8px 10px;
    display: block;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 400;
    width: auto;
    border: 1px solid #00aeef !important;
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 30px !important;
}

    .listBtn.active {
        background: #00aeef url("../images/list-icon-active.png");
        color: #ffffff;
        background-position: 10px center;
        background-repeat: no-repeat;
        padding-left: 30px !important;
    }

.emailBtn {
    background: #2e3192 url("../images/email-icon-white.png");
    color: #ffffff;
    text-align: center;
    font-size: 14px;
    line-height: 14px;
    padding: 11px 0 9px 0;
    display: block;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 400;
    margin-bottom: 5px;
    width: 100% !important;
    background-position: 40px center;
    background-repeat: no-repeat;
    padding-left: 0;
}

.whatsappBtn {
    background: #20b799 url("../images/whatsapp-icon.png");
    color: #ffffff;
    text-align: center;
    font-size: 14px;
    line-height: 14px;
    padding: 11px 0 9px 0;
    display: block;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 400;
    margin-bottom: 5px;
    width: 100% !important;
    background-position: 30px center;
    background-repeat: no-repeat;
    padding-left: 0;
}

.upload {
    width: 100%;
    position: relative;
    overflow: hidden;
    font-size: 0;
}

    .upload input[type=file] {
        width: 133px !important;
        padding: 10px 0;
        position: absolute;
        left: 0;
        top: 0;
        opacity: 0;
        cursor: pointer;
        background: none !important;
    }

.CONTRACTS .upload input[type=file] {
    width: 100% !important;
}

.uploadedFiles {
    margin-top: 5px;
    margin-left: 5px;
    margin-bottom: 10px;
}

    .uploadedFiles li {
        font-size: 14px;
        line-height: 18px;
        padding: 2.5px;
        background-image: url("../images/attach-icon.png");
        background-position: left center;
        background-repeat: no-repeat;
        padding-left: 20px;
    }

        .uploadedFiles li a {
            color: #00aeef;
            text-decoration: none;
            word-wrap: break-word;
        }

            .uploadedFiles li a img {
                display: inline-block;
                margin-left: 5px;
            }

.upload.pathName {
    font-size: 0;
    width: 100%;
}

    .upload.pathName .commonBtn {
        display: inline-block;
        vertical-align: middle;
    }

    .upload.pathName label {
        display: inline-block;
        font-size: 14px;
        line-height: 18px;
        color: #000000;
        vertical-align: middle;
        width: calc(100% - 100px);
    }

.upload.attachImg label {
    width: calc(100% - 133px);
}

.upload.pathName label input[type=text] {
    background: #f5f7fa;
    border: none;
}

.uploadIcon {
    width: 16px;
    position: relative;
    overflow: hidden;
    font-size: 0;
    display: inline-block;
    vertical-align: middle;
}

    .uploadIcon input[type=file] {
        width: 16px !important;
        padding: 0;
        position: absolute;
        left: 0;
        top: 0;
        opacity: 0;
        cursor: pointer;
        background: none !important;
    }
/**Header**/
.header {
    width: 100%;
    height: auto;
    background: #ffffff;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2;
}

    .header .topHeader {
        width: 100%;
        height: auto;
        background: #ffffff;
    }

        .header .topHeader .container {
            width: 95%;
            max-width: 1600px;
            margin: 0 auto;
            padding: 15px 0;
            font-size: 0;
            text-align: right;
        }

            .header .topHeader .container .logo {
                display: inline-block;
                vertical-align: middle;
                width: 123px;
            }

                .header .topHeader .container .logo img {
                    width: 100%;
                    display: block;
                }

            .header .topHeader .container .rgtNav {
                display: inline-block;
                vertical-align: middle;
                width: calc(100% - 123px);
            }

                .header .topHeader .container .rgtNav span {
                    display: inline-block;
                    vertical-align: middle;
                }

                .header .topHeader .container .rgtNav .searchBtn {
                    margin-right: 20px;
                    cursor: pointer;
                    position: relative;
                }

                    .header .topHeader .container .rgtNav .searchBtn .searchField {
                        position: absolute;
                        z-index: 99;
                        top: 46px;
                        right: 0;
                        width: 280px;
                        border-radius: 5px;
                        border-top-left-radius: 0;
                        border-top-right-radius: 0;
                        background: #ffffff;
                        text-align: left;
                        -webkit-box-shadow: 0px 2px 5px 0px rgba(215,215,215,1);
                        -moz-box-shadow: 0px languageBtn 5px 0px rgba(215,215,215,1);
                        box-shadow: 0px 2px 5px 0px rgba(215,215,215,1);
                        padding: 10px;
                        display: none;
                    }

                        .header .topHeader .container .rgtNav .searchBtn .searchField .btn {
                            position: absolute;
                            right: 12.5px; /*top:21.5px;*/
                            top: 17.5px;
                        }

                        .header .topHeader .container .rgtNav .searchBtn .searchField input[type=text] {
                            width: 100%;
                            padding: 5px 35px 5px 10px;
                        }

                .header .topHeader .container .rgtNav .languageBtn {
                    margin-right: 10px;
                    cursor: pointer;
                    position: relative;
                }

                    .header .topHeader .container .rgtNav .languageBtn ul {
                    }

                        .header .topHeader .container .rgtNav .languageBtn ul li {
                            display: inline-block;
                            vertical-align: middle;
                            font-size: 14px;
                            line-height: 18px;
                            color: #6c757d;
                            margin-right: 5px;
                        }

                            .header .topHeader .container .rgtNav .languageBtn ul li img {
                                display: block;
                            }

                    .header .topHeader .container .rgtNav .languageBtn > .subMenu {
                        width: 100px;
                        height: auto;
                        top: 21px;
                        right: 0;
                        padding: 25px 0 0 0;
                        position: absolute;
                        z-index: 99;
                        display: none;
                        opacity: 0;
                        -webkit-transition: all 0.5s ease;
                        -moz-transition: all 0.5s ease;
                        -o-transition: all 0.5s ease;
                        transition: all 0.5s ease;
                    }

                    .header .topHeader .container .rgtNav .languageBtn:hover > .subMenu {
                        display: block;
                        opacity: 1;
                    }

                    .header .topHeader .container .rgtNav .languageBtn > .subMenu > ul {
                        width: 100%;
                        border-radius: 5px;
                        border-top-left-radius: 0;
                        border-top-right-radius: 0;
                        background: #ffffff;
                        text-align: left;
                        -webkit-box-shadow: 0px 2px 5px 0px rgba(215,215,215,1);
                        -moz-box-shadow: 0px languageBtn 5px 0px rgba(215,215,215,1);
                        box-shadow: 0px 2px 5px 0px rgba(215,215,215,1);
                        padding: 10px 0;
                    }

                        .header .topHeader .container .rgtNav .languageBtn > .subMenu > ul > li {
                            display: block;
                            padding: 0;
                            border: none;
                            margin-right: 0;
                        }

                            .header .topHeader .container .rgtNav .languageBtn > .subMenu > ul > li > a {
                                display: block;
                                background: #ffffff;
                                color: #6c757d;
                                text-decoration: none;
                                font-size: 14px;
                                line-height: 18px;
                                font-weight: 400;
                                -webkit-transition: all 0.5s ease;
                                -moz-transition: all 0.5s ease;
                                -o-transition: all 0.5s ease;
                                transition: all 0.5s ease;
                                padding: 10px;
                                background: none;
                                width: calc(100% - 20px) !important;
                            }

                                .header .topHeader .container .rgtNav .languageBtn > .subMenu > ul > li > a:hover {
                                    background: #f1f1f1;
                                }

                .header .topHeader .container .rgtNav .notificationBtn {
                    margin-right: 25px;
                    cursor: pointer;
                    position: relative;
                }

                    .header .topHeader .container .rgtNav .notificationBtn .status {
                        position: absolute;
                        width: 17px;
                        height: 13px;
                        border-radius: 17px;
                        background: #fa5944;
                        border: 1px solid #ffffff;
                        top: 0;
                        right: -12px;
                        z-index: 2;
                        font-size: 11px;
                        line-height: 11px;
                        color: #ffffff;
                        text-align: center;
                        padding-top: 4px;
                    }

                    .header .topHeader .container .rgtNav .notificationBtn .notificationList {
                        position: absolute;
                        z-index: 99;
                        top: 46px;
                        right: 0;
                        width: 280px;
                        border-radius: 5px;
                        border-top-left-radius: 0;
                        border-top-right-radius: 0;
                        background: #ffffff;
                        text-align: left;
                        -webkit-box-shadow: 0px 2px 5px 0px rgba(215,215,215,1);
                        -moz-box-shadow: 0px languageBtn 5px 0px rgba(215,215,215,1);
                        box-shadow: 0px 2px 5px 0px rgba(215,215,215,1);
                        padding: 10px;
                        display: none;
                        max-height: 300px;
                    }

                        .header .topHeader .container .rgtNav .notificationBtn .notificationList .title {
                            font-weight: 600;
                            color: #6c757d;
                            position: relative;
                            width: 100%;
                            font-size: 14px;
                            line-height: 18px;
                            margin-bottom: 7.5px;
                        }

                            .header .topHeader .container .rgtNav .notificationBtn .notificationList .title a {
                                position: absolute;
                                right: 0;
                                top: 2.5px;
                                color: #00aeef;
                                text-decoration: none;
                                font-size: 12px;
                                line-height: 12px;
                                font-weight: 400;
                            }

                        .header .topHeader .container .rgtNav .notificationBtn .notificationList ul {
                            width: 100%;
                            max-height: 215px;
                            overflow-y: auto;
                        }

                            .header .topHeader .container .rgtNav .notificationBtn .notificationList ul li {
                                width: 100%;
                                margin: 0 0 10px 0;
                            }

                                .header .topHeader .container .rgtNav .notificationBtn .notificationList ul li a {
                                    display: block;
                                    width: calc(100% - 20px);
                                    padding: 5px 10px;
                                    font-size: 0;
                                }

                                .header .topHeader .container .rgtNav .notificationBtn .notificationList ul li:hover {
                                    background: #f1f1f1;
                                }

                                .header .topHeader .container .rgtNav .notificationBtn .notificationList ul li a .photo {
                                    display: inline-block;
                                    vertical-align: top;
                                    width: 36px;
                                    height: 36px;
                                    border-radius: 36px;
                                    overflow: hidden;
                                    background: #f5f7fa;
                                    border: 2px solid #e9edf3;
                                }

                                    .header .topHeader .container .rgtNav .notificationBtn .notificationList ul li a .photo img {
                                        width: 100%;
                                        display: block;
                                    }

                                    .header .topHeader .container .rgtNav .notificationBtn .notificationList ul li a .photo strong {
                                        font-size: 24px;
                                        line-height: 24px;
                                        text-align: center;
                                        color: #cccccc;
                                        display: block;
                                        font-weight: 600;
                                        padding: 6px 0;
                                    }

                                .header .topHeader .container .rgtNav .notificationBtn .notificationList ul li a .text {
                                    display: inline-block;
                                    vertical-align: middle;
                                    width: calc(100% - 55px);
                                    margin-left: 15px;
                                }

                                    .header .topHeader .container .rgtNav .notificationBtn .notificationList ul li a .text p {
                                        font-size: 14px;
                                        line-height: 18px;
                                        color: #6c757d;
                                    }

                                        .header .topHeader .container .rgtNav .notificationBtn .notificationList ul li a .text p strong {
                                            font-weight: 600;
                                        }

                                        .header .topHeader .container .rgtNav .notificationBtn .notificationList ul li a .text p.dateTime {
                                            font-size: 12px;
                                            line-height: 14px;
                                            color: #00aeef;
                                            margin-top: 5px;
                                        }

                .header .topHeader .container .rgtNav .userAccountBtn {
                    cursor: pointer;
                    position: relative;
                }

                    .header .topHeader .container .rgtNav .userAccountBtn ul {
                    }

                        .header .topHeader .container .rgtNav .userAccountBtn ul li {
                            display: inline-block;
                            vertical-align: middle;
                            font-size: 14px;
                            line-height: 18px;
                            color: #6c757d;
                            margin-right: 5px;
                        }

                        .header .topHeader .container .rgtNav .userAccountBtn ul .userPhoto {
                            width: 36px;
                            height: 36px;
                            border-radius: 36px;
                            border: 2px solid #6c757d;
                            overflow: hidden;
                        }

                            .header .topHeader .container .rgtNav .userAccountBtn ul .userPhoto img {
                                width: 100%;
                                display: block;
                            }

                    .header .topHeader .container .rgtNav .userAccountBtn > .subMenu {
                        width: 120px;
                        height: auto;
                        top: 34px;
                        right: 0;
                        padding: 20px 0 0 0;
                        position: absolute;
                        z-index: 99;
                        display: none;
                        opacity: 0;
                        -webkit-transition: all 0.5s ease;
                        -moz-transition: all 0.5s ease;
                        -o-transition: all 0.5s ease;
                        transition: all 0.5s ease;
                    }

                    .header .topHeader .container .rgtNav .userAccountBtn:hover > .subMenu {
                        display: block;
                        opacity: 1;
                    }

                    .header .topHeader .container .rgtNav .userAccountBtn > .subMenu > ul {
                        width: 100%;
                        border-radius: 5px;
                        border-top-left-radius: 0;
                        border-top-right-radius: 0;
                        background: #ffffff;
                        text-align: left;
                        -webkit-box-shadow: 0px 2px 5px 0px rgba(215,215,215,1);
                        -moz-box-shadow: 0px 2px 5px 0px rgba(215,215,215,1);
                        box-shadow: 0px 2px 5px 0px rgba(215,215,215,1);
                        padding: 10px 0;
                    }

                        .header .topHeader .container .rgtNav .userAccountBtn > .subMenu > ul > li {
                            display: block;
                            padding: 0;
                            border: none;
                            margin-right: 0;
                        }

                            .header .topHeader .container .rgtNav .userAccountBtn > .subMenu > ul > li > a {
                                display: block;
                                background: #ffffff;
                                color: #6c757d;
                                text-decoration: none;
                                font-size: 14px;
                                line-height: 18px;
                                font-weight: 400;
                                -webkit-transition: all 0.5s ease;
                                -moz-transition: all 0.5s ease;
                                -o-transition: all 0.5s ease;
                                transition: all 0.5s ease;
                                padding: 10px;
                                background: none;
                                width: calc(100% - 20px) !important;
                            }

                                .header .topHeader .container .rgtNav .userAccountBtn > .subMenu > ul > li > a:hover {
                                    background: #f1f1f1;
                                }

    .header .mainMenu {
        width: 100%;
        height: auto;
        background: #f5f7fa;
        border-bottom: 1px solid #e9edf3;
    }

        .header .mainMenu .container {
            width: 95%;
            max-width: 1600px;
            margin: 0 auto; /*padding:20px 0;*/
            font-size: 0;
            text-align: left;
        }

            .header .mainMenu .container ul {
                width: 100%;
                font-size: 0;
            }

                .header .mainMenu .container ul li {
                    display: inline-block;
                    vertical-align: middle;
                    position: relative;
                    margin-right: 25px;
                    cursor: pointer;
                }

                    .header .mainMenu .container ul li:last-child {
                        margin-right: 0;
                    }

                    .header .mainMenu .container ul li a {
                        font-size: 15px;
                        line-height: 15px;
                        color: #6c757d;
                        display: block;
                        text-decoration: none;
                        -webkit-transition: all 0.25s ease;
                        -moz-transition: all 0.25s ease;
                        -o-transition: all 0.25s ease;
                        transition: all 0.25s ease;
                        padding: 20px 0;
                        background: #434343;
                    }

    .header > .mainMenu > .container > ul > li:hover > a {
        color: #00aeef;
    }

    .header .mainMenu .container ul li.menuDashboard a {
        background: url("../images/menu-dashboard.png")no-repeat left center;
        padding-left: 25px;
        padding-top: 24px;
    }

    .DASHBOARD .header .mainMenu .container ul li.menuDashboard a,
    .header .mainMenu .container ul li.menuDashboard:hover a {
        background: url("../images/menu-dashboard-mo.png")no-repeat left center;
        color: #00aeef;
    }

    .header .mainMenu .container ul li.menuMaids a {
        background: url("../images/menu-maids.png")no-repeat left center;
        padding-left: 25px;
        padding-top: 24px;
    }

    .MAIDS .header .mainMenu .container ul li.menuMaids a,
    .header > .mainMenu > .container > ul > li.menuMaids:hover > a {
        background: url("../images/menu-maids-mo.png")no-repeat left center;
        color: #00aeef;
    }

    .header .mainMenu .container ul li.menuCustomers a {
        background: url("../images/menu-customers.png")no-repeat left center;
        padding-left: 25px;
        padding-top: 24px;
    }

    .CUSTOMERS .header .mainMenu .container ul li.menuCustomers a,
    .header > .mainMenu > .container > ul > li.menuCustomers:hover > a {
        background: url("../images/menu-customers-mo.png")no-repeat left center;
        color: #00aeef;
    }

    .header .mainMenu .container ul li.menuLeads a {
        background: url("../images/menu-leads.png")no-repeat left center;
        padding-left: 25px;
        padding-top: 24px;
    }

    .LEADS .header .mainMenu .container ul li.menuLeads a,
    .header > .mainMenu > .container > ul > li.menuLeads:hover > a {
        background: url("../images/menu-leads-mo.png")no-repeat left center;
        color: #00aeef;
    }

    .header .mainMenu .container ul li.menuContracts a {
        background: url("../images/menu-contracts.png")no-repeat left center;
        padding-left: 25px;
        padding-top: 24px;
    }

    .CONTRACTS .header .mainMenu .container ul li.menuContracts a,
    .header > .mainMenu > .container > ul > li.menuContracts:hover > a {
        background: url("../images/menu-contracts-mo.png")no-repeat left center;
        color: #00aeef;
    }

    .header .mainMenu .container ul li.menuTransport a {
        background: url("../images/menu-transport.png")no-repeat left center;
        padding-left: 25px;
        padding-top: 24px;
    }

    .TRANSPORT .header .mainMenu .container ul li.menuTransport a,
    .header > .mainMenu > .container > ul > li.menuTransport:hover > a {
        background: url("../images/menu-transport-mo.png")no-repeat left center;
        color: #00aeef;
    }

    .header .mainMenu .container ul li.menuCMS a {
        background: url("../images/menu-cms.png")no-repeat left center;
        padding-left: 25px;
        padding-top: 24px;
    }

    .CMS .header .mainMenu .container ul li.menuCMS a,
    .header > .mainMenu > .container > ul > li.menuCMS:hover > a {
        background: url("../images/menu-cms-mo.png")no-repeat left center;
        color: #00aeef;
    }

    .header .mainMenu .container ul li.menuHR a {
        background: url("../images/menu-hr.png")no-repeat left center;
        padding-left: 25px;
        padding-top: 24px;
    }

    .HR .header .mainMenu .container ul li.menuHR a,
    .header > .mainMenu > .container > ul > li.menuHR:hover > a {
        background: url("../images/menu-hr-mo.png")no-repeat left center;
        color: #00aeef;
    }

    .header .mainMenu .container ul li.menuUsers a {
        background: url("../images/menu-users.png")no-repeat left center;
        padding-left: 25px;
        padding-top: 24px;
    }

    .USERS .header .mainMenu .container ul li.menuUsers a,
    .header > .mainMenu > .container > ul > li.menuUsers:hover > a {
        background: url("../images/menu-users-mo.png")no-repeat left center;
        color: #00aeef;
    }

    .header .mainMenu .container ul li.menuReports a {
        background: url("../images/menu-reports.png")no-repeat left center;
        padding-left: 25px;
        padding-top: 24px;
    }

    .REPORTS .header .mainMenu .container ul li.menuReports a,
    .header > .mainMenu > .container > ul > li.menuReports:hover > a {
        background: url("../images/menu-reports-mo.png")no-repeat left center;
        color: #00aeef;
    }

    .header .mainMenu .container ul li.menuReceipts a {
        background: url("../images/menu-receipts.png")no-repeat left center;
        padding-left: 25px;
        padding-top: 24px;
    }

    .RECEIPTS .header .mainMenu .container ul li.menuReceipts a,
    .header > .mainMenu > .container > ul > li.menuReceipts:hover > a {
        background: url("../images/menu-receipts-mo.png")no-repeat left center;
        color: #00aeef;
    }

    .header .mainMenu .container ul li.menuMedia a {
        background: url("../images/menu-media.png")no-repeat left center;
        padding-left: 25px;
        padding-top: 24px;
    }

    .MEDIA .header .mainMenu .container ul li.menuMedia a,
    .header > .mainMenu > .container > ul > li.menuMedia:hover > a {
        background: url("../images/menu-media-mo.png")no-repeat left center;
        color: #00aeef;
    }

    .header .mainMenu .container ul li.dd {
        background: url(../images/dropdown-arrow.png)no-repeat 95% center;
        padding-right: 20px;
    }

    .header > .mainMenu > .container > ul > li.dd:hover,
    .MAIDS .header .mainMenu .container ul li.menuMaids,
    .CUSTOMERS .header .mainMenu .container ul li.menuCustomers,
    .LEADS .header .mainMenu .container ul li.menuLeads,
    .CONTRACTS .header .mainMenu .container ul li.menuContracts,
    .TRANSPORT .header .mainMenu .container ul li.menuTransport,
    .CMS .header .mainMenu .container ul li.menuCMS,
    .HR .header .mainMenu .container ul li.menuHR,
    .USERS .header .mainMenu .container ul li.menuUsers,
    .REPORTS .header .mainMenu .container ul li.menuReports,
    .RECEIPTS .header .mainMenu .container ul li.menuReceipts {
        background: url(../images/dropdown-arrow-mo.png)no-repeat 95% center;
    }

    .header > .mainMenu > .container > ul > li.dd > .subMenu {
        width: 200px;
        height: auto;
        top: 40px;
        left: -20px;
        padding: 20px 0 0 0;
        position: absolute;
        z-index: 99;
        display: none;
        opacity: 0;
    }

    .header > .mainMenu > .container > ul > li.dd:hover > .subMenu {
        display: block;
        opacity: 1;
    }

    .header > .mainMenu > .container > ul > li.dd > .subMenu > ul {
        width: 100%;
        border-radius: 5px;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        background: #ffffff;
        text-align: left;
        -webkit-box-shadow: 0px 2px 5px 0px rgba(215,215,215,1);
        -moz-box-shadow: 0px 2px 5px 0px rgba(215,215,215,1);
        box-shadow: 0px 2px 5px 0px rgba(215,215,215,1);
        padding: 10px 0;
    }

        .header > .mainMenu > .container > ul > li.dd > .subMenu > ul > li {
            display: block;
            padding: 0;
            border: none;
            margin-right: 0;
        }

            .header > .mainMenu > .container > ul > li.dd > .subMenu > ul > li > a {
                display: block;
                background: #ffffff;
                color: #6c757d;
                text-decoration: none;
                font-size: 14px;
                line-height: 18px;
                font-weight: 400;
                -webkit-transition: all 0.5s ease;
                -moz-transition: all 0.5s ease;
                -o-transition: all 0.5s ease;
                transition: all 0.5s ease;
                padding: 10px;
                background: none;
                width: calc(100% - 20px) !important;
            }

            .header > .mainMenu > .container > ul > li.dd > .subMenu > ul > li:hover > a {
                background: #f1f1f1;
            }

    .header > .mainMenu > .container > ul > li > .subMenu > ul > li.dd {
        background: none;
    }

        .header > .mainMenu > .container > ul > li > .subMenu > ul > li.dd > a {
            background: url(../images/step-arrow.png)no-repeat 95% center;
        }

        .header > .mainMenu > .container > ul > li > .subMenu > ul > li.dd:hover > a {
            background: #f1f1f1 url(../images/step-arrow.png)no-repeat 95% center;
            ;
        }

        .header > .mainMenu > .container > ul > li > .subMenu > ul > li.dd > .subSubMenu {
            width: 200px;
            height: auto;
            top: 0;
            left: 200px;
            position: absolute;
            z-index: 99;
            display: none;
            opacity: 0;
        }

        .header > .mainMenu > .container > ul > li > .subMenu > ul > li.dd:hover > .subSubMenu {
            display: block;
            opacity: 1;
        }

        .header > .mainMenu > .container > ul > li > .subMenu > ul > li.dd > .subSubMenu > ul {
            width: 100%;
            border-radius: 5px;
            border-top-left-radius: 0;
            border-bottom-left-radius: 0;
            background: #ffffff;
            text-align: left;
            -webkit-box-shadow: 0px 2px 5px 0px rgba(215,215,215,1);
            -moz-box-shadow: 0px 2px 5px 0px rgba(215,215,215,1);
            box-shadow: 0px 2px 5px 0px rgba(215,215,215,1);
        }

            .header > .mainMenu > .container > ul > li > .subMenu > ul > li.dd > .subSubMenu > ul > li {
                display: block;
                padding: 0;
                border: none;
                margin-right: 0;
            }

                .header > .mainMenu > .container > ul > li > .subMenu > ul > li.dd > .subSubMenu > ul > li > a {
                    display: block;
                    background: #ffffff;
                    color: #6c757d;
                    text-decoration: none;
                    font-size: 14px;
                    line-height: 18px;
                    font-weight: 400;
                    -webkit-transition: all 0.5s ease;
                    -moz-transition: all 0.5s ease;
                    -o-transition: all 0.5s ease;
                    transition: all 0.5s ease;
                    padding: 10px;
                    background: none;
                    width: calc(100% - 20px) !important;
                }

                .header > .mainMenu > .container > ul > li > .subMenu > ul > li.dd > .subSubMenu > ul > li:hover > a {
                    background: #f1f1f1;
                }

    .header .topHeader .container .rgtNav .mobileMainMenu {
        display: none;
    }

        .header .topHeader .container .rgtNav .mobileMainMenu .mobileMenuBtn {
            cursor: pointer;
            -webkit-transform: rotate(0deg);
            -moz-transform: rotate(0deg);
            -o-transform: rotate(0deg);
            transform: rotate(0deg);
            -webkit-transition: .5s ease-in-out;
            -moz-transition: .5s ease-in-out;
            -o-transition: .5s ease-in-out;
            transition: .5s ease-in-out;
            width: 24px;
            height: 17px;
            z-index: 2;
        }

            .header .topHeader .container .rgtNav .mobileMainMenu .mobileMenuBtn span {
                display: block;
                position: absolute;
                height: 3px;
                width: 100%;
                background: #00aeef !important;
                border-radius: 3px;
                opacity: 1;
                left: 0;
                -webkit-transform: rotate(0deg);
                -moz-transform: rotate(0deg);
                -o-transform: rotate(0deg);
                transform: rotate(0deg);
                -webkit-transition: .25s ease-in-out;
                -moz-transition: .25s ease-in-out;
                -o-transition: .25s ease-in-out;
                transition: .25s ease-in-out;
            }

                .header .topHeader .container .rgtNav .mobileMainMenu .mobileMenuBtn span:nth-child(1) {
                    top: 0px;
                    -webkit-transform-origin: left center;
                    -moz-transform-origin: left center;
                    -o-transform-origin: left center;
                    transform-origin: left center;
                }

                .header .topHeader .container .rgtNav .mobileMainMenu .mobileMenuBtn span:nth-child(2) {
                    top: 9px;
                    -webkit-transform-origin: left center;
                    -moz-transform-origin: left center;
                    -o-transform-origin: left center;
                    transform-origin: left center;
                }

                .header .topHeader .container .rgtNav .mobileMainMenu .mobileMenuBtn span:nth-child(3) {
                    top: 18px;
                    -webkit-transform-origin: left center;
                    -moz-transform-origin: left center;
                    -o-transform-origin: left center;
                    transform-origin: left center;
                }

            .header .topHeader .container .rgtNav .mobileMainMenu .mobileMenuBtn.open span:nth-child(1) {
                -webkit-transform: rotate(45deg);
                -o-transform: rotate(45deg);
                transform: rotate(45deg);
                top: 0;
                left: 0;
            }

            .header .topHeader .container .rgtNav .mobileMainMenu .mobileMenuBtn.open span:nth-child(2) {
                width: 0;
                opacity: 0;
            }

            .header .topHeader .container .rgtNav .mobileMainMenu .mobileMenuBtn.open span:nth-child(3) {
                -webkit-transform: rotate(-45deg);
                -moz-transform: rotate(-45deg);
                -o-transform: rotate(-45deg);
                transform: rotate(-45deg);
                top: 17px;
                left: 0;
            }

.mobileMenu {
    width: 100%;
    height: auto;
    background: #f5f7fa;
    border-bottom: 1px solid #e9edf3;
    display: none;
}

    .mobileMenu ul {
        width: 95%;
        max-width: 1600px;
        margin: 0 auto;
        padding: 10px 0;
        font-size: 0;
        text-align: left;
    }

        .mobileMenu ul li {
            display: block;
            vertical-align: middle;
            position: relative;
        }

            .mobileMenu ul li a {
                font-size: 15px;
                line-height: 15px;
                color: #6c757d;
                display: block;
                text-decoration: none;
                padding: 15px 0;
                width: 100%;
            }

            .mobileMenu ul li.menuDashboard a {
                background: url("../images/menu-dashboard.png")no-repeat left center;
                padding-left: 25px;
            }

            .mobileMenu ul li.menuMaids a {
                background: url("../images/menu-maids.png")no-repeat left center;
                padding-left: 25px;
            }

                .mobileMenu ul li.menuMaids a.active {
                    background: url("../images/menu-maids-mo.png")no-repeat left center;
                    color: #00aeef;
                }

            .mobileMenu ul li.menuCustomers a {
                background: url("../images/menu-customers.png")no-repeat left center;
                padding-left: 25px;
            }

                .mobileMenu ul li.menuCustomers a.active {
                    background: url("../images/menu-customers-mo.png")no-repeat left center;
                    color: #00aeef;
                }

            .mobileMenu ul li.menuLeads a {
                background: url("../images/menu-leads.png")no-repeat left center;
                padding-left: 25px;
            }

                .mobileMenu ul li.menuLeads a.active {
                    background: url("../images/menu-leads-mo.png")no-repeat left center;
                    color: #00aeef;
                }

            .mobileMenu ul li.menuContracts a {
                background: url("../images/menu-contracts.png")no-repeat left center;
                padding-left: 25px;
            }

                .mobileMenu ul li.menuContracts a.active {
                    background: url("../images/menu-contracts-mo.png")no-repeat left center;
                    color: #00aeef;
                }

            .mobileMenu ul li.menuTransport a {
                background: url("../images/menu-transport.png")no-repeat left center;
                padding-left: 25px;
            }

                .mobileMenu ul li.menuTransport a.active {
                    background: url("../images/menu-transport-mo.png")no-repeat left center;
                    color: #00aeef;
                }

            .mobileMenu ul li.menuCMS a {
                background: url("../images/menu-cms.png")no-repeat left center;
                padding-left: 25px;
            }

                .mobileMenu ul li.menuCMS a.active {
                    background: url("../images/menu-cms-mo.png")no-repeat left center;
                    color: #00aeef;
                }

            .mobileMenu ul li.menuHR a {
                background: url("../images/menu-hr.png")no-repeat left center;
                padding-left: 25px;
            }

                .mobileMenu ul li.menuHR a.active {
                    background: url("../images/menu-hr-mo.png")no-repeat left center;
                    color: #00aeef;
                }

            .mobileMenu ul li.menuUsers a {
                background: url("../images/menu-users.png")no-repeat left center;
                padding-left: 25px;
            }

                .mobileMenu ul li.menuUsers a.active {
                    background: url("../images/menu-users-mo.png")no-repeat left center;
                    color: #00aeef;
                }

            .mobileMenu ul li.menuReports a {
                background: url("../images/menu-reports.png")no-repeat left center;
                padding-left: 25px;
            }

                .mobileMenu ul li.menuReports a.active {
                    background: url("../images/menu-reports-mo.png")no-repeat left center;
                    color: #00aeef;
                }

            .mobileMenu ul li.menuReceipts a {
                background: url("../images/menu-receipts.png")no-repeat left center;
                padding-left: 25px;
            }

                .mobileMenu ul li.menuReceipts a.active {
                    background: url("../images/menu-receipts-mo.png")no-repeat left center;
                    color: #00aeef;
                }

            .mobileMenu ul li.menuMedia a {
                background: url("../images/menu-media.png")no-repeat left center;
                padding-left: 25px;
            }

            .mobileMenu ul li a span.dd {
                background: url(../images/dropdown-arrow.png)no-repeat right center;
                padding-right: 25px;
            }

            .mobileMenu ul li a span.active {
                background: url(../images/dropdown-arrow-mo.png)no-repeat right center;
            }

            .mobileMenu ul li ul {
                padding: 0 !important;
                margin-left: 22px;
            }

                .mobileMenu ul li ul ul {
                    margin-left: 12px;
                }

                .mobileMenu ul li ul li {
                    background: none !important;
                }

                    .mobileMenu ul li ul li a {
                        padding: 10px 0 10px 4px !important;
                        background: none !important;
                    }

            .mobileMenu ul li.menuAcct span {
                display: inline-block;
                vertical-align: middle;
                font-weight: 600;
            }

                .mobileMenu ul li.menuAcct span.userPhoto {
                    width: 36px;
                    height: 36px;
                    border-radius: 36px;
                    border: 2px solid #6c757d;
                    overflow: hidden;
                    margin-right: 10px;
                }

                    .mobileMenu ul li.menuAcct span.userPhoto img {
                        width: 100%;
                        display: block;
                    }

    .mobileMenu .logout {
        background: #6c757d;
        width: 100%;
    }

        .mobileMenu .logout a {
            width: 95%;
            max-width: 1600px;
            margin: 0 auto;
            display: block;
            font-size: 15px;
            line-height: 15px;
            color: #ffffff;
            text-decoration: none;
            padding: 15px 0;
        }

    .mobileMenu .searchFieldMobile {
        width: 95%;
        max-width: 1600px;
        margin: 0 auto;
        position: relative;
        padding-top: 10px
    }

        .mobileMenu .searchFieldMobile .btn {
            position: absolute;
            right: 5px;
            top: 17px;
        }

        .mobileMenu .searchFieldMobile input[type=text] {
            width: 100%;
            padding: 5px 35px 5px 10px;
        }
/**Footer**/
.footer {
    font-size: 14px;
    line-height: 14px;
    color: #6c757d;
    border-top: 1px solid #e9edf3;
    width: 100%;
    text-align: left;
    padding: 15px 0;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
    padding: 25px 0;
    background: #ffffff;
}

    .footer .container {
        width: 95%;
        max-width: 1600px;
        margin: 0 auto;
    }

.innerPage .footer {
    position: fixed;
    z-index: 1;
}

/**Popup**/
@-webkit-keyframes popupAnim {
    from {
        opacity: 0;
        margin-top: -200px;
    }

    to {
        opacity: 1;
    }
}

@-moz-keyframes popupAnim {
    from {
        opacity: 0;
        margin-top: -200px;
    }

    to {
        opacity: 1;
    }
}

@keyframes popupAnim {
    from {
        opacity: 0;
        margin-top: -200px;
    }

    to {
        opacity: 1;
    }
}

.modal-open {
    overflow: hidden;
}

.modal {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 3000;
    display: none;
    overflow: auto;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    outline: 0;
    -webkit-animation: popupAnim 2s;
    -moz-animation: popupAnim
}

.modal-dialog:target {
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    transition: all 1s;
    opacity: 0;
    visibility: hidden;
}

.modal.fade .modal-dialog {
    -webkit-transition: -webkit-transform .3s ease-out;
    -moz-transition: -moz-transform .3s ease-out;
    -o-transition: -o-transform .3s ease-out;
    transition: transform .3s ease-out;
    -webkit-transform: translate(0, -25%);
    -ms-transform: translate(0, -25%);
    transform: translate(0, -25%);
}

.modal.in .modal-dialog {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
}

.modal-dialog {
    position: relative;
    width: auto;
    margin: 12.5% 0;
}

#popOutEmail .modal-dialog, #fileDetails .modal-dialog, #fileDetails_Doc .modal-dialog, #addService .modal-dialog {
    margin: 10% 0;
}

#generateQuotation .modal-dialog {
    margin: 2.5% 0;
}

#cropTool .modal-dialog, #addReceipt .modal-dialog, #ipaApproval .modal-dialog, #arrivalDocuments .modal-dialog, #workPermitRenewal .modal-dialog, #purchaseInsurance .modal-dialog, #purchaseAirTicket .modal-dialog, #medicalReport .modal-dialog, #updateStatus .modal-dialog {
    margin: 5% 0;
}

.modal-content {
    position: relative;
    background-color: #f5f7fa;
    background-clip: padding-box;
    width: 95%;
    max-width: 475px;
    height: auto;
    margin: 0 auto;
    border-radius: 5px;
    outline: none;
    z-index: 2998;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
}

#fileDetails .modal-content, #fileDetails_Doc .modal-content {
    max-width: 1000px;
}

#popOutEmail .modal-content, #generateQuotation .modal-content, #addService .modal-content {
    max-width: 800px;
}

#cropTool .modal-content {
    max-width: 600px;
}

.modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2999;
    background-color: #000;
}

    .modal-backdrop.fade {
        filter: alpha(opacity=0);
        opacity: 0;
    }

    .modal-backdrop.in {
        filter: alpha(opacity=80);
        opacity: .8;
    }

.modal-body {
    position: relative;
    width: 100%;
    padding: 20px 0;
}

.closePopUpBtn {
    display: block;
    position: absolute;
    top: 24px;
    right: 20px;
}

.modal-body .container {
    width: 95%;
    margin: 0 auto;
    color: #212330;
    font-size: 13px;
    line-height: 18px;
}

    .modal-body .container h1 {
        color: #495057;
        font-size: 18px;
        line-height: 24px;
        font-weight: 600;
        border-bottom: 1px solid #e9edf3;
        padding-bottom: 14px;
        margin-bottom: 14px;
        margin-top: 0;
        text-align: left;
    }

    .modal-body .container h2 {
        color: #212330;
        font-size: 16px;
        line-height: 22px;
        margin: 15px 0 15px 0;
        text-align: center;
        font-weight: 600;
    }

    .modal-body .container label {
        color: #6c757d;
        font-weight: 600;
        margin: 5px 0 2.5px 0;
        padding: 0;
        font-size: 14px;
        line-height: 18px;
        display: block;
        text-align: left;
    }

    .modal-body .container p {
        margin: 0 0 10px 0;
        color: #6c757d;
        font-size: 14px;
        line-height: 18px;
        text-align: left;
    }

        .modal-body .container p.center {
            text-align: center;
        }

    .modal-body .container .contents {
        font-size: 0;
        width: 100%;
        margin-bottom: 0;
    }

    .modal-body .container .groupBtn {
        font-size: 0;
    }

        .modal-body .container .groupBtn .col {
            display: inline-block;
            width: 49.5%;
            vertical-align: top;
            margin-bottom: 10px;
            margin-right: 0.5%;
        }

            .modal-body .container .groupBtn .col:nth-of-type(even) {
                margin-left: 0.5%;
                margin-right: 0;
            }

.modal-body textarea {
    width: 100%;
    height: 200px;
}

.modal-body input[type="text"], .modal-body select {
    width: 100%;
}

.modal-body .submitBtn {
    margin-left: 0;
}

.modal-body table {
    width: 100%;
}

    .modal-body table tr td {
        width: calc(50% - 20px);
        padding: 0 10px;
    }

.modal-body .uploadContainer {
    width: calc(100% - 44px);
    padding: 20px;
    border: 2px dashed #6c757d;
    margin-top: 20px;
    text-align: center;
}

    .modal-body .uploadContainer .upload {
        width: 115px;
        display: inline-block;
    }

    .modal-body .uploadContainer p {
        margin: 0;
    }

.modal-body .uploadedFiles li {
    text-align: left;
}

#loginTrouble .modal-body, #delete .modal-body, #deleteFolder .modal-body, #deleteMaid .modal-body, #confirmMaid .modal-body, #cancelBooking .modal-body {
    padding: 5% 0;
}

    #loginTrouble .modal-body .container, #delete .modal-body .container, #deleteFolder .modal-body .container, #deleteMaid .modal-body .container, #confirmMaid .modal-body .container, #cancelBooking .modal-body .container {
        text-align: center;
    }

        #loginTrouble .modal-body .container h1, #delete .modal-body .container h1, #deleteFolder .modal-body .container h1, #deleteMaid .modal-body .container h1, #confirmMaid .modal-body .container h1, #cancelBooking .modal-body .container h1 {
            border-bottom: none;
            padding-bottom: 0;
            margin: 15px 0 30px 0;
            text-align: center;
        }

#fileDetails .container, #fileDetails_Doc .container {
    font-size: 0;
}

#fileDetails .detailCol2 {
    width: calc(50% - 10px);
    display: inline-block;
    vertical-align: top;
    margin-right: 10px;
    text-align: center;
}

    #fileDetails .detailCol2.last {
        margin-right: 0;
        margin-left: 10px;
        text-align: left;
    }

    #fileDetails .detailCol2 .imgThumb, #fileDetails_Doc .detailCol2 .imgThumb {
        width: 100%;
        border-radius: 5px;
        overflow: hidden;
        margin: 5px 0 10px 0;
    }

        #fileDetails .detailCol2 .imgThumb img, #fileDetails_Doc .detailCol2 .imgThumb img {
            width: 100%;
            display: block;
        }

    #fileDetails .detailCol2.last p strong, #fileDetails_Doc .detailCol2.last p strong {
        font-weight: 600;
    }

#fileDetails .fields, #fileDetails_Doc .fields {
    border-top: 1px solid #e9edf3;
    padding-top: 20px;
    margin-top: 20px;
}

#fileDetails_Doc .detailCol2 {
    width: 240px;
    display: inline-block;
    vertical-align: top;
    margin-right: 10px;
    text-align: center;
}

    #fileDetails_Doc .detailCol2.last {
        width: calc(100% - 262px);
        margin-right: 0;
        margin-left: 10px;
        text-align: left;
    }

#cropTool .btnGrp {
    text-align: center;
}

#cropTool .commonBtn {
    display: inline-block;
}

#cropTool .submitBtn {
    margin-left: 5px;
}

.modal-body .cropImg {
    width: 100%;
    height: 400px;
    margin: 0 auto;
}

    .modal-body .cropImg.cropped {
        width: 305px;
        height: 305px;
    }

.modal-body .others {
    width: 100%;
}

    .modal-body .others li {
        border-bottom: 1px solid #e9edf3;
        margin-bottom: 10px;
    }

        .modal-body .others li:last-child {
            border-bottom: none;
        }

.modal-body .col4 {
    width: 100%;
    font-size: 0;
}

    .modal-body .col4 li {
        width: calc(25% - 10px);
        display: inline-block;
        vertical-align: top;
        margin-right: 10px;
        border-bottom: none;
    }

.modal-body .col2 {
    width: 100%;
    font-size: 0;
}

    .modal-body .col2 li {
        width: calc(50% - 10px);
        display: inline-block;
        vertical-align: top;
        margin-right: 10px;
        border-bottom: none;
    }

.CONTRACTS .modal-body .col2 li {
    width: calc(50% - 5px);
    margin-right: 5px;
}

    .CONTRACTS .modal-body .col2 li:nth-child(even) {
        margin-left: 5px;
        margin-right: 0;
    }

.modal-body [type="radio"]:checked + label, [type="radio"]:not(:checked) + label {
    padding-left: 20px;
}

.modal-body .fromToDate {
    width: 100%;
}

    .modal-body .fromToDate tr td {
        text-align: center;
        font-size: 14px;
        line-height: 18px;
        padding: 0;
        color: #6c757d;
    }
/**Tooltip**/
#tooltip {
    text-align: left;
    color: #848790;
    background: #ffffff;
    position: absolute;
    z-index: 3001;
    padding: 15px;
    font-size: 12px;
    line-height: 14px;
    font-weight: 600;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(85,85,85,0.75);
    -moz-box-shadow: 0px 0px 10px 0px rgba(85,85,85,0.75);
    box-shadow: 0px 0px 10px 0px rgba(85,85,85,0.75);
}

    #tooltip:after /* triangle decoration */ {
        width: 0;
        height: 0;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid #ffffff;
        content: '';
        position: absolute;
        left: 50%;
        bottom: -10px;
        margin-left: -10px;
    }

    #tooltip.top:after {
        border-top-color: transparent;
        border-bottom: 10px solid #ffffff;
        top: -20px;
        bottom: auto;
    }

    #tooltip.left:after {
        left: 10px;
        margin: 0;
    }

    #tooltip.right:after {
        right: 10px;
        left: auto;
        margin: 0;
    }

    #tooltip strong {
        color: #212330;
    }

    #tooltip table {
        width: 250px !important;
    }

        #tooltip table tr td {
            padding: 2.5px;
            vertical-align: middle;
        }

            #tooltip table tr td.right {
                text-align: right;
            }

        #tooltip table tr.topLine {
            border-top: 1px solid #d7d7d7;
        }
/**Price Range**/
.price-range-slider {
    width: 100%;
}

    .price-range-slider .range-value {
        margin: 0;
    }

        .price-range-slider .range-value input {
            width: 100%;
            background: none;
            color: #6c757d;
            font-size: 14px;
            font-weight: #400;
            box-shadow: none;
            border: none;
            margin: 10px 0;
            padding: 0 !important;
        }

    .price-range-slider .range-bar {
        border: none;
        background: #e9edf3;
        height: 4px;
        width: calc(100% - 15px);
        position: relative;
    }

        .price-range-slider .range-bar .ui-slider-range {
            background: #00aeef;
        }

        .price-range-slider .range-bar .ui-slider-handle {
            border: none;
            border-radius: 10px;
            background: #ffffff;
            border: 1px solid #00aeef;
            height: 10px !important;
            width: 10px !important;
            top: -4px !important;
            cursor: pointer;
            position: absolute;
        }

.ui-widget.ui-widget-content {
    border: none !important;
}


#tooltip {
    text-align: left;
    color: #848790;
    background: #ffffff;
    position: absolute;
    z-index: 3001;
    padding: 15px;
    font-size: 12px;
    line-height: 14px;
    font-weight: 600;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(85,85,85,0.75);
    -moz-box-shadow: 0px 0px 10px 0px rgba(85,85,85,0.75);
    box-shadow: 0px 0px 10px 0px rgba(85,85,85,0.75);
    border-radius: 5px;
}

    #tooltip:after /* triangle decoration */ {
        width: 0;
        height: 0;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid #ffffff;
        content: '';
        position: absolute;
        left: 50%;
        bottom: -10px;
        margin-left: -10px;
    }

    #tooltip.top:after {
        border-top-color: transparent;
        border-bottom: 10px solid #ffffff;
        top: -20px;
        bottom: auto;
    }

    #tooltip.left:after {
        left: 10px;
        margin: 0;
    }

    #tooltip.right:after {
        right: 10px;
        left: auto;
        margin: 0;
    }

    #tooltip strong {
        color: #212330;
    }

    #tooltip table {
        width: 250px !important;
    }

        #tooltip table tr td {
            padding: 2.5px;
            vertical-align: middle;
        }

            #tooltip table tr td.right {
                text-align: right;
            }

        #tooltip table tr.topLine {
            border-top: 1px solid #d7d7d7;
        }

.headerLogo {
    width: 100%;
    height: auto;
    background: #ffffff;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2;
    border-bottom: 1px solid #e9edf3;
}

    .headerLogo .container {
        width: 95%;
        max-width: 1600px;
        margin: 0 auto;
        padding: 15px 0;
        font-size: 0;
    }

        .headerLogo .container .logo {
            display: block;
            width: 123px;
            margin: auto;
        }

            .headerLogo .container .logo img {
                width: 100%;
                display: block;
            }

/**UPDATE:12/01/2022**/
.commonBtn.createNew.blue {
    background-image: url("../images/createNew-icon-white.png");
    background-color: #00aeef;
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 35px !important;
    display: inline-block;
    color: #ffffff;
}

.commonBtn.editBtn {
    background-image: url("../images/edit-btn.png");
    background-color: #e9edf3;
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 35px !important;
    display: inline-block;
    color: #6c757d;
}
/**LATEST update on 22/11/2021**/
.headerLogo {
    width: 100%;
    height: auto;
    background: #ffffff;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2;
    border-bottom: 1px solid #e9edf3;
}

    .headerLogo .container {
        width: 95%;
        max-width: 1600px;
        margin: 0 auto;
        padding: 15px 0;
        font-size: 0;
    }

        .headerLogo .container .logo {
            display: block;
            width: 123px;
            margin: auto;
        }

            .headerLogo .container .logo img {
                width: 100%;
                display: block;
            }
/**UPDATE:12/01/2022**/
.commonBtn.createNew.blue {
    background-image: url("../images/createNew-icon-white.png");
    background-color: #00aeef;
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 35px !important;
    display: inline-block;
    color: #ffffff;
}

.commonBtn.editBtn {
    background-image: url("../images/edit-btn.png");
    background-color: #e9edf3;
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 35px !important;
    display: inline-block;
    color: #6c757d;
}

.CMS #approve .modal-body, .CMS #reject .modal-body {
    padding: 5% 0;
}

.CMS #viewMsg .modal-dialog {
    margin: 2.5% 0;
}

.CMS #approve .modal-body .container, .CMS #reject .modal-body .container {
    text-align: center;
}

    .CMS #approve .modal-body .container h1, .CMS #reject .modal-body .container h1 {
        border-bottom: none;
        padding-bottom: 0;
        margin: 15px 0 30px 0;
        text-align: center;
    }

.header .topHeader .container .rgtNav .userAccountBtn ul li strong {
    font-weight: 600;
}

.header .topHeader .container .rgtNav .userAccountBtn ul li .userRole {
    color: #00aeef;
}

.header .topHeader .mobileMenu ul li.menuAcct .userRole {
    color: #00aeef;
    font-size: 14px;
}
.commonBtn.send02 {
    background-image: url("../images/send-icon-02.png");
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 30px !important;
}

.approveReject .modal-body {
    padding: 5% 0;
}

    .approveReject .modal-body .container {
        text-align: center;
    }

        .approveReject .modal-body .container h1 {
            border-bottom: none;
            padding-bottom: 0;
            margin: 15px 0 30px 0;
            text-align: center;
        }