/**Login Contents**/
.login .wrapper {
    height: 100%;
    background: #ffffff;
}

.loginContents {
    width: 95%;
    max-width: 415px;
    height: 100%;
    margin: 0 auto;
    position: relative;
    z-index: 1;
    display: table;
}

.loginFields {
    display: table-cell;
    vertical-align: middle;
    width: 100%;
}

    .loginFields .logo {
        width: 246px;
        margin: 0 auto 40px auto;
    }

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

    .loginFields .loginForm {
        background: #f5f7fa;
        border-radius: 10px;
        width: calc(100% - 42px);
        padding: 20px;
        border: 1px solid #e9edf3;
        margin-bottom: 30px;
    }

        .loginFields .loginForm h1 {
            font-weight: 600;
            color: #495057;
            font-size: 16px;
            line-height: 18px;
        }

    .loginFields label {
        color: #6c757d;
        font-weight: 600;
        margin: 20px 0 0 0;
        padding: 0;
        font-size: 14px;
        line-height: 18px;
        display: block;
    }

    .loginFields p {
        font-size: 13px;
        line-height: 18px;
        color: #8b1212;
        width: 100%;
        margin: 0 0 10px 0;
    }

        .loginFields p strong {
            color: #8b1212;
            font-size: 14px;
            line-height: 20px;
            text-transform: none;
        }

    .loginFields input[type=text], .loginFields input[type=password] {
        width: 100%;
        display: block;
        margin: 5px 0 0 0;
        padding: 6px 25px 4px 10px;
    }

    .loginFields table {
        width: 100%;
        margin: 10px 0 0 0;
    }

        .loginFields table tr td {
            width: 50%
        }

            .loginFields table tr td:last-child {
                text-align: right;
            }

                .loginFields table tr td:last-child a {
                    color: #6c757d;
                    font-size: 14px;
                    line-height: 18px;
                    text-decoration: none;
                }

    .loginFields .checkBoxStyle {
        color: #6c757d;
        font-weight: 400;
        text-transform: none;
    }
/**Main Contents**/
.innerPage .wrapper {
    width: 100%; /*height:auto;*/
  /*  height: 100%;*/
    background: #ffffff;
    position: relative;
    overflow-y: auto;
}

.mainContents {
    width: 100%;
    margin: 0 auto;
    position: relative;
    padding-top: 130px;
}

.innerPage .mainContents {
    height: auto;
    overflow: auto;
    overflow-x: hidden;
}

.mainContents .container {
    width: 95%;
    max-width: 1600px;
    margin: 0 auto;
    padding: 0;
    position: relative;
    z-index: 1;
}

    .mainContents .container h1 {
        font-size: 18px;
        line-height: 24px;
        color: #495057;
        margin: 20px 0;
        font-weight: 600;
    }

        .mainContents .container h1.center {
            text-align: center;
            width: 100%;
        }

    .mainContents .container h2 {
        font-size: 16px;
        line-height: 18px;
        color: #495057;
        margin: 0 0 20px 0;
        font-weight: 600;
    }

    .mainContents .container .headerTitle {
        width: 100%;
        font-size: 0;
    }

        .mainContents .container .headerTitle .title {
            display: inline-block;
            vertical-align: middle;
            width: 50%;
        }

        .mainContents .container .headerTitle .breadcrumb {
            display: inline-block;
            vertical-align: middle;
            width: 50%;
            text-align: right;
            font-size: 14px;
            line-height: 14px;
            color: #495057;
        }

            .mainContents .container .headerTitle .breadcrumb span {
                display: inline-block;
                vertical-align: middle;
                padding: 0 5px;
            }

            .mainContents .container .headerTitle .breadcrumb a {
                display: inline-block;
                vertical-align: bottom;
                color: #6c757d;
                text-decoration: none;
            }

                .mainContents .container .headerTitle .breadcrumb a img {
                    display: block;
                }

        .mainContents .container .headerTitle .backToBtn {
            display: inline-block;
            vertical-align: middle;
            width: 50%;
            margin: 30px 0;
        }

            .mainContents .container .headerTitle .backToBtn a {
                background-image: url("../images/back-btn.png");
                background-position: left center;
                background-repeat: no-repeat;
                padding-left: 15px;
                font-size: 14px;
                line-height: 14px;
                color: #00aeef;
                text-decoration: none;
            }

        .mainContents .container .headerTitle .triggerBtn {
            display: inline-block;
            vertical-align: middle;
            width: 50%;
            text-align: right;
        }

            .mainContents .container .headerTitle .triggerBtn .commonBtn {
                display: inline-block;
            }
/**Search**/
.searchFilter {
    width: 100%; /*margin-bottom:10px;*/
    font-size: 0;
}

    .searchFilter span {
        display: inline-block;
        vertical-align: middle;
        margin-right: 5px;
    }

    .searchFilter input[type=text], .searchFilter select {
        width: 100%;
    }

.groupFilter {
    width: 100%;
    font-size: 0;
    margin-bottom: -10px;
}

    .groupFilter .col2 {
        width: 50%;
        vertical-align: middle;
        display: inline-block;
    }

        .groupFilter .col2.last {
            text-align: right;
        }

    .groupFilter ul {
        font-size: 0;
    }

        .groupFilter ul li {
            display: inline-block;
            vertical-align: middle;
            margin-right: 5px;
            margin-bottom: 10px;
            color: #6c757d;
            font-size: 14px;
        }

            .groupFilter ul li select {
                width: 200px;
            }

            .groupFilter ul li:last-child {
                margin-right: 0;
            }

.uploadMedia {
    width: calc(100% - 2px);
    height: 200px;
    margin: 20px 0;
    border: 2px dashed #e9edf3;
    border-radius: 10px;
    text-align: center;
    position: relative;
}

    .uploadMedia .uploadMediaBtn {
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        transform: translateY(-50%);
    }

        .uploadMedia .uploadMediaBtn p {
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
            margin-bottom: 10px;
        }

            .uploadMedia .uploadMediaBtn p strong {
                display: block;
                font-weight: 600;
            }

        .uploadMedia .uploadMediaBtn img {
            display: inline-block;
            margin-bottom: 10px;
        }

        .uploadMedia .uploadMediaBtn .commonBtn {
            display: inline-block !important;
        }

        .uploadMedia .uploadMediaBtn .upload {
            width: 133px;
            margin: 0 auto;
        }

.LEADS .searchFilter {
    max-width: 1070px;
    margin-bottom: 10px;
}

    .LEADS .searchFilter span {
        width: calc(100% - 702px);
    }

    .LEADS .searchFilter .selectField {
        width: 200px;
    }

    .LEADS .searchFilter .btn {
        width: 82px;
        margin-right: 0;
    }

.LEADS .createLeadFilter {
    max-width: 100%;
    margin-bottom: 20px;
    font-size: 0;
}

    .LEADS .createLeadFilter .filterLeft {
        display: inline-block;
        vertical-align: middle;
        width: 50%;
    }

        .LEADS .createLeadFilter .filterLeft .container {
            max-width: 450px;
            margin: 0;
            font-size: 0;
        }

        .LEADS .createLeadFilter .filterLeft span {
            width: calc(100% - 87px);
        }

        .LEADS .createLeadFilter .filterLeft .btn {
            width: 82px;
            margin-right: 0;
        }

    .LEADS .createLeadFilter .filterRgt {
        display: inline-block;
        vertical-align: middle;
        text-align: right;
        width: 50%
    }
/*
.LEADS .createLeadFilter span{width:calc(100% - 702px);}
.LEADS .createLeadFilter .selectField{width:200px;}
.LEADS .createLeadFilter .btn{width:82px;margin-right:0;}
*/
.MEDIA .searchFilter, .CUSTOMERS .searchFilter {
    max-width: 660px;
    margin-bottom: 10px;
}

    .MEDIA .searchFilter span, .CUSTOMERS .searchFilter span {
        width: calc(100% - 297px);
    }

    .MEDIA .searchFilter .selectField, .CUSTOMERS .searchFilter .selectField {
        width: 200px;
    }

    .MEDIA .searchFilter .btn, .CUSTOMERS .searchFilter .btn {
        width: 82px;
        margin-right: 0;
    }

.RECEIPTS .searchFilter {
    max-width: 715px;
    margin-bottom: 10px;
}

    .RECEIPTS .searchFilter .selectField {
        width: 200px;
    }

    .RECEIPTS .searchFilter .btn {
        width: 82px;
        margin-right: 0;
    }

    .RECEIPTS .searchFilter .date {
        display: inline-block;
        vertical-align: middle;
        width: calc(100% - 292px);
    }

        .RECEIPTS .searchFilter .date ul li {
            display: inline-block;
            vertical-align: middle;
            font-size: 14px;
            line-height: 18px;
            color: #6c757d;
            width: calc(50% - 12px);
        }

            .RECEIPTS .searchFilter .date ul li:nth-child(2) {
                width: 24px;
            }

.RECEIPTS .insuranceRefundTable .searchFilter span {
    width: calc(100% - 292px);
}

.RECEIPTS .insuranceRefundTable .searchFilter .selectField {
    width: 200px;
}

.RECEIPTS .insuranceRefundTable .searchFilter .btn {
    width: 82px;
    margin-right: 0;
}

.CONTRACTS .searchFilter {
    max-width: 1070px;
    margin-bottom: 10px;
}

    .CONTRACTS .searchFilter span {
        width: calc(100% - 702px);
    }

    .CONTRACTS .searchFilter .selectField {
        width: 200px;
    }

    .CONTRACTS .searchFilter .btn {
        width: 82px;
        margin-right: 0;
    }
/**Page Number**/
.paginations {
    width: 100%;
    margin-bottom: 10px;
    font-size: 0;
}

    .paginations .page {
        display: inline-block;
        vertical-align: middle;
        text-align: left;
        color: #6c757d;
        font-size: 14px;
        line-height: 18px;
        width: calc(100% - 280px);
    }

    .paginations .pagination {
        display: inline-block;
        vertical-align: middle;
        text-align: right;
        width: 280px;
        font-size: 14px;
        line-height: 18px;
    }

.pagination ul {
    list-style: none;
    text-align: right;
}

    .pagination ul li {
        display: inline-block;
        vertical-align: middle;
    }

        .pagination ul li span {
            display: block;
            border-radius: 5px;
            background: #ffffff;
            color: #6c757d;
            font-size: 14px;
            width: 30px;
            height: 19px;
            padding: 6px 0 5px 0;
            text-align: center;
            text-decoration: none;
            border: 1px solid #e9edf3;
            margin: 0 1.5px;
        }

        .pagination ul li a {
            display: block;
            border-radius: 5px;
            background: #ffffff;
            color: #6c757d;
            font-size: 14px;
            width: 30px;
            height: 19px;
            padding: 6px 0 5px 0;
            text-align: center;
            text-decoration: none;
            border: 1px solid #e9edf3;
            margin: 0 1.5px;
        }

            .pagination ul li a:hover {
                background: #6c757d;
                color: #ffffff;
                font-weight: 600;
            }

        .pagination ul li.active .current {
            color: #ffffff;
            background: #6c757d;
            font-weight: 600;
        }
/*
.pagination{width:100%;margin-bottom:10px;font-size:0;}
.pagination .page{display:inline-block;vertical-align:middle;text-align:left;color:#6c757d;font-size:14px;line-height:18px;width:calc(100% - 280px);}
.pagination .pageNum{display:inline-block;vertical-align:middle;text-align:right;width:280px;}
.pagination .pageNum ul{list-style:none;}
.pagination .pageNum ul li{display:inline-block;vertical-align:middle;}
.pagination .pageNum ul li a{display:block;border-radius:5px;background:#ffffff;color:#6c757d;font-size:14px;width:30px;height:20px;padding:5px 0;text-align:center;text-decoration:none;border:1px solid #e9edf3;margin:0 1.5px;}
.pagination .pageNum ul li a:hover,.pagination .pageNum ul li a.selected{background:#6c757d;color:#ffffff;font-weight:600;border:1px solid #6c757d;}
.pagination .pageNum ul li a img{display:block;width:10px;margin:5px auto 0 auto;}
.pagination .pageNum ul .previousBtn a .hover{display:none;}
.pagination .pageNum ul .previousBtn a:hover .hover{display:block;}
.pagination .pageNum ul .previousBtn a:hover .normal{display:none;}
.pagination .pageNum ul .nextBtn a .hover{display:none;}
.pagination .pageNum ul .nextBtn a:hover .hover{display:block;}
.pagination .pageNum ul .nextBtn a:hover .normal{display:none;}
*/
/*Responsive Table*/
.responsiveTable {
    width: 100%;
    margin: 20px 0 10px 0;
    padding: 0 0 10px 0;
}

    .responsiveTable table {
        width: 100%;
        border-collapse: separate;
    }

        .responsiveTable table thead tr th {
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
            font-weight: 600;
            text-align: left;
            padding: 6px 10px 3.5px 10px;
            vertical-align: top;
            text-transform: uppercase;
            border-top: 1px solid #aaaaaa;
        }

        .responsiveTable table tbody tr td {
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
            font-weight: 400;
            text-align: left;
            padding: 6px 10px 6px 10px;
            border-top: 1px solid #e9edf3;
            vertical-align: middle;
        }

        .responsiveTable table tr .snum {
            padding: 7.5px 5px 3.5px 5px;
        }

        .responsiveTable table tr .check {
            padding: 7.5px 0 3.5px 0;
        }

        .responsiveTable table tr .priority {
            padding: 7.5px 0 3.5px 0;
        }

.dashboardLeft .dashPending .responsiveTable table thead tr th {
    padding: 7.5px 10px;
}

.dashboardLeft .dashPending .responsiveTable table tr .snum {
    padding: 5px;
}

.dashboardLeft .dashPending .responsiveTable table tr .priority {
    padding: 5px 0;
}

.dashboardLeft .dashPending .responsiveTable table tbody tr td {
    padding: 7.5px 10px;
}

/*.responsiveTable table tbody tr:first-child td {
    border-top: 1px solid #aaaaaa;
}*/

.responsiveTable table tbody tr:last-child td {
    border-bottom: 1px solid #e9edf3;
}

.responsiveTable table tbody tr td.email {
    word-wrap: break-word;
}

.responsiveTable table tbody tr td img {
    display: inline-block;
    vertical-align: top;
    margin: 0 5px 0 0;
}

.responsiveTable table tbody tr td input[type="text"] {
    border: none;
    padding: 5px;
}

.responsiveTable table tbody tr td select {
    border: none;
    padding: 5px;
}

.responsiveTable table tbody tr td strong {
    font-weight: 700;
    color: #212330;
}

.responsiveTable table tbody tr td a {
    color: #4897d8;
    text-decoration: none;
    font-size: 14px;
    line-height: 18px;
}

.responsiveTable .checkBoxStyle {
    width: 15px;
    height: 15px;
    text-align: right !important;
    display: inline-block;
    padding-left: 0 !important;
}

.contracts-table {
    position: relative;
}

    .contracts-table .responsiveTable {
        overflow-y: auto;
    }

        .contracts-table .responsiveTable table {
            width: 2500px;
        }

            .contracts-table .responsiveTable table tbody tr th {
                color: #6c757d;
                font-size: 14px;
                line-height: 18px;
                font-weight: 400;
                text-align: left;
                padding: 6px 10px 6px 10px;
                vertical-align: middle;
            }

                .contracts-table .responsiveTable table tbody tr th a {
                    font-size: 14px;
                    line-height: 18px;
                    color: #00aeef;
                    text-decoration: none;
                }

.clone {
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
}

    .clone td {
        opacity: 0
    }

    .clone th {
        visibility: hidden;
        border-color: transparent;
    }

    .clone thead th {
        color: #6c757d;
        font-size: 14px;
        line-height: 18px;
        font-weight: 600;
        text-align: left;
        padding: 6px 10px 3.5px 10px;
        vertical-align: top;
        text-transform: uppercase;
        border-top: 1px solid #e9edf3;
    }

    .clone tbody th {
        color: #6c757d;
        font-size: 14px;
        line-height: 18px;
        font-weight: 400;
        text-align: left;
        padding: 6px 10px 6px 10px;
        border-top: 1px solid #e9edf3;
        vertical-align: middle;
    }

    .clone tbody tr:first-child th {
        border-top: 1px solid #aaaaaa;
    }

    .clone thead th:nth-child(1), .clone thead th:nth-child(2), .clone thead th:nth-child(3), .clone tbody th {
        visibility: visible;
    }

    .clone .fixed-side { /*border-bottom:1px solid #e9edf3;*/
        background: #f5f7fa;
    }

@-moz-document url-prefix() {
    /*.contracts-table tbody th{padding:7.5px 10px;}*/
}

.leadQuality {
    display: inline-block;
    padding: 6px 0 4px 0;
    color: #ffffff;
    font-size: 11px;
    line-height: 11px;
    font-weight: 700;
    border-radius: 3px;
    text-transform: uppercase;
    text-align: center;
    width: 47.5px;
}

    .leadQuality.hot {
        background: #20b799;
    }

    .leadQuality.cold {
        background: #00aeef;
    }

    .leadQuality.lost {
        background: #fa5944;
    }

    .leadQuality.closed {
        background: #6c757d;
    }

.priorityIcon {
    opacity: 0;
    margin: 0 0 0 5px !important;
}

    .priorityIcon.active {
        opacity: 1;
    }
/*Normal Table*/
.tableStyle {
    width: 100%;
    margin: 20px 0 0 0;
    padding: 0 0 0 0;
}

    .tableStyle table {
        width: 100%;
        border-collapse: separate;
    }

        .tableStyle table thead tr th {
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
            font-weight: 600;
            text-align: left;
            padding: 6px 10px 3.5px 10px;
            vertical-align: middle;
            text-transform: uppercase;
            border-top: 1px solid #e9edf3;
        }

        .tableStyle table tbody tr td {
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
            font-weight: 400;
            text-align: left;
            padding: 6px 10px 6px 10px;
            border-top: 1px solid #e9edf3;
            vertical-align: middle;
        }

            .tableStyle table tbody tr td img {
                display: inline-block;
            }

.leadServices .tableStyle table thead tr th, .leadServices .tableStyle table tbody tr td {
    padding-left: 0;
}
/**Form**/
form {
    width: 100%;
}

.formPage {
    margin-bottom: 50px;
}

    .formPage .contents {
        margin-bottom: 20px;
    }

    .formPage h2 {
        margin: 0 0 15px 0 !important;
        font-size: 16px !important;
        line-height: 18px !important;
    }
/*.formPage h2{font-size:16px !important;line-height:18px !important;background:#00aeef;color:#ffffff !important;padding:15px;width:calc(100% - 30px);border-top-left-radius:10px;border-top-right-radius:10px;}*/
.formFields {
    display: flex;
    flex-wrap: wrap;
    width: calc(100% + 20px);
}

    .formFields .fieldName {
        width: 100%;
        display: block;
        color: #6c757d;
        font-size: 14px;
        line-height: 18px;
        margin: 5px 0;
        font-weight: 600;
    }

    .formFields .field {
        width: 100%;
        display: block;
    }

    .formFields p {
        color: #6c757d;
        font-size: 14px;
        line-height: 18px;
    }

    .formFields.borderBottom {
        margin-bottom: 10px;
        padding-bottom: 10px;
        border-bottom: 1px solid #e9edf3;
    }

    .formFields .formColFull {
        display: block;
        width: calc(100% - 20px);
        margin-bottom: 10px;
    }

        .formFields .formColFull.woMarginBtm {
            margin-bottom: 0;
        }

    .formFields .uploadDocument table {
        width: 100%;
    }

        .formFields .uploadDocument table tr td {
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
            vertical-align: middle;
            padding: 5px 0;
        }

            .formFields .uploadDocument table tr td:nth-child(odd) {
                width: 175px;
            }

            .formFields .uploadDocument table tr td a {
                color: #00aeef;
                text-decoration: none;
            }

    .formFields .formCol2 {
        display: inline-block;
        vertical-align: top;
        width: calc(50% - 20px);
        padding-right: 20px;
        margin-bottom: 10px;
    }

    .formFields .formCol3 {
        display: inline-block;
        vertical-align: top;
        width: calc(33.3333% - 20px);
        padding-right: 20px;
        margin-bottom: 10px;
    }

    .formFields .formCol4 {
        display: inline-block;
        vertical-align: top;
        width: calc(25% - 20px);
        padding-right: 20px;
        margin-bottom: 10px;
    }

        .formFields .formCol4.merge {
            width: calc(50% - 20px);
            font-size: 0;
        }

            .formFields .formCol4.merge .left {
                display: inline-block;
                vertical-align: middle;
                margin-right: 5px;
            }

            .formFields .formCol4.merge .rgt {
                display: inline-block;
                vertical-align: middle;
            }

        .formFields .formCol4 .restDayField {
            width: calc(100% - 140px);
        }

        .formFields .formCol4 .restDay {
            width: 130px;
            margin-left: 5px;
            font-size: 14px;
            line-height: 14px;
            color: #6c757d;
        }

        .formFields .formCol4 span.radioSelectField {
            display: inline-block;
            vertical-align: middle;
            width: calc(100% - 100px);
        }

        .formFields .formCol4 span.radio {
            display: inline-block;
            vertical-align: middle;
            width: 100px;
        }

        .formFields .formCol4 .left {
            display: inline-block;
            vertical-align: middle;
            margin-right: 5px;
        }

        .formFields .formCol4 .rgt {
            display: inline-block;
            vertical-align: middle;
        }

    .formFields .submitBtn {
        margin-left: 5px;
    }

    .formFields .backBtn {
        margin-right: 5px;
    }

    .formFields .radioFields {
        width: 100%;
        font-size: 0;
    }

        .formFields .radioFields li {
            display: inline-block;
            vertical-align: middle;
            margin-right: 25px;
        }

            .formFields .radioFields li:last-child {
                margin-right: 0;
            }

            .formFields .radioFields li input[type="text"] {
                margin-left: 10px;
                width: 170px;
            }

    .formFields .weight_heightFields {
        width: 100%;
        font-size: 0;
    }

        .formFields .weight_heightFields li {
            display: inline-block;
            vertical-align: middle;
            font-size: 14px;
            line-height: 14px;
            color: #6c757d;
            width: 50%;
        }

            .formFields .weight_heightFields li input[type="text"] {
                display: inline-block;
                vertical-align: middle;
                width: calc(100% - 30px);
            }

            .formFields .weight_heightFields li .text {
                display: inline-block;
                vertical-align: middle;
                text-align: center;
                width: 30px;
                margin-bottom: 0 !important;
            }

    .formFields .yesNoQuestion {
        width: 100%;
        font-size: 0;
        margin: 20px 0 0 0;
    }

        .formFields .yesNoQuestion li {
            width: 25%;
            display: inline-block;
            vertical-align: middle;
            font-size: 0;
            margin-bottom: 15px;
        }

            .formFields .yesNoQuestion li .left {
                width: 175px;
                display: inline-block;
                vertical-align: middle;
                color: #6c757d;
                font-size: 14px;
                line-height: 14px;
            }

            .formFields .yesNoQuestion li .rgt {
                width: calc(100% - 175px);
                display: inline-block;
                vertical-align: middle;
                color: #6c757d;
                font-size: 14px;
                line-height: 14px;
            }

                .formFields .yesNoQuestion li .rgt span {
                    display: inline-block;
                    vertical-align: middle;
                    margin-right: 20px;
                    margin-bottom: 0 !important;
                    width: auto;
                }

    .formFields .checkList {
        width: 100%;
        font-size: 0;
    }

        .formFields .checkList li {
            display: inline-block;
            vertical-align: middle;
            color: #6c757d;
            font-size: 14px;
            line-height: 14px;
            margin-right: 20px;
        }

    .formFields .rowField {
        margin: 5px 0;
    }

    .formFields .fee_salary {
        width: 100%;
        font-size: 0;
    }

        .formFields .fee_salary li {
            display: inline-block;
            vertical-align: middle;
            font-size: 14px;
            line-height: 14px;
            color: #6c757d;
            width: calc(50% - 2.5px);
            margin-right: 2.5px;
        }

            .formFields .fee_salary li.last {
                margin-right: 0;
                margin-left: 2.5px;
            }

            .formFields .fee_salary li input[type="text"] {
                display: inline-block;
                vertical-align: middle;
                width: 100%;
            }

.addFamilyMember {
    width: 100%;
}

    .addFamilyMember li {
        width: 100%;
        border-top: 1px solid #e9edf3;
        margin-top: 5px;
        padding-top: 15px;
    }

        .addFamilyMember li:first-child {
            margin-top: 0;
            padding-top: 0;
            border-top: none;
        }

        .addFamilyMember li .fieldName {
            display: none;
        }

        .addFamilyMember li:first-child .fieldName {
            display: block;
        }

.submissionBtn {
    width: 100%;
}

    .submissionBtn .submitBtn {
        margin-left: 5px;
    }

    .submissionBtn .backBtn {
        margin-right: 5px;
    }

.stepStatus {
    display: inline-block;
    vertical-align: top;
    font-size: 14px;
    line-height: 14px;
    color: #6c757d;
    margin: 12.5px 0 0 10px;
}

.grpChecks {
    width: calc(100% - 20px);
    margin-left: 20px;
}

.CONTRACTS .sponsor {
    display: none;
}
/**Leads**/
.leadsContent {
    font-size: 0;
}
    /*.leadsContent .formPage{display:flex;flex-wrap:wrap;}*/
    .leadsContent .contentCol2 {
        width: calc(50% - 10px);
        margin-right: 10px;
        display: inline-block;
        vertical-align: top;
    }

        .leadsContent .contentCol2.last {
            margin-right: 0;
            margin-left: 10px;
        }

    .leadsContent .contents {
        width: 100%;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
    }

        .leadsContent .contents.leadsTable {
            margin-bottom: 50px;
        }

        .leadsContent .contents .innerContainer {
            padding: 20px;
            width: calc(100% - 40px);
            font-size: 0;
        }

.leadProfile {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    font-size: 0;
    margin-bottom: 50px;
}

    .leadProfile .leadDetail {
        display: inline-block;
        vertical-align: top;
        width: 385px;
        margin-right: 20px;
    }

.leadDetail .leadName {
    width: 100%;
    font-size: 0;
    border-bottom: 1px solid #e9edf3;
    margin-bottom: 20px;
    padding-bottom: 20px;
}

    .leadDetail .leadName .icon {
        display: inline-block;
        vertical-align: top;
        width: 24px;
        margin-right: 15px;
    }

        .leadDetail .leadName .icon img {
            width: 100%;
            display: block;
        }

    .leadDetail .leadName .name {
        display: inline-block;
        vertical-align: middle;
        font-size: 18px;
        line-height: 24px;
        color: #495057;
        font-weight: 600;
        width: calc(100% - 39px);
        cursor: pointer;
    }

        .leadDetail .leadName .name span {
            margin-right: 6px;
        }

    .leadDetail .leadName .leadQuality {
        vertical-align: middle;
        margin-right: 0;
    }

    .leadDetail .leadName .leadType, .leadDetail .leadName .contractExpiring, .leadDetail .leadName .contractBal {
        width: 100%;
        font-size: 0;
        margin-top: 5px;
        display: block;
        font-size: 14px;
        line-height: 18px;
        color: #6c757d;
        font-weight: 400;
        margin-right: 0;
    }

.leadDetail .leadContact {
    width: 100%;
    font-size: 0;
    border-bottom: 1px solid #e9edf3;
    margin-bottom: 20px;
    padding-bottom: 5px;
    display: flex;
    flex-wrap: wrap;
}

    .leadDetail .leadContact span {
        display: inline-block;
        vertical-align: middle;
        width: calc(100% - 39px);
        font-size: 14px;
        line-height: 18px;
        color: #6c757d;
    }

    .leadDetail .leadContact .space {
        width: 39px;
    }

    .leadDetail .leadContact h2 {
        margin-bottom: 15px;
    }

    .leadDetail .leadContact p {
        font-size: 14px;
        line-height: 18px;
        color: #6c757d;
        margin-bottom: 15px;
    }

        .leadDetail .leadContact p strong {
            font-weight: 600;
            display: block;
            margin-bottom: 2.5px;
        }

    .leadDetail .leadContact.assignTo {
        border-bottom: none;
        margin-bottom: 10px;
    }

.leadProfile .leadActivity {
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 812px);
    height: 750px;
    margin-right: 20px;
    background: #f5f7fa;
    border-radius: 10px;
    position: relative;
    border: 1px solid #e9edf3;
}

    .leadProfile .leadActivity .activityContent {
        width: calc(100% - 40px);
        padding: 20px;
    }

        .leadProfile .leadActivity .activityContent h1 {
            margin: 0 0 20px 0;
        }

        .leadProfile .leadActivity .activityContent .activitySearch {
            width: 100%;
            font-size: 0;
        }

.activityContent .activitySearch .date {
    display: inline-block;
    vertical-align: middle;
    width: 422px;
    margin-right: 5px;
}

    .activityContent .activitySearch .date ul li {
        display: inline-block;
        vertical-align: middle;
        font-size: 14px;
        line-height: 18px;
        color: #6c757d;
        width: calc(50% - 12px);
    }

        .activityContent .activitySearch .date ul li:nth-child(2) {
            width: 24px;
        }

.activityContent .activitySearch .activityType {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 514px);
    margin-right: 5px;
}

.activityContent .activitySearch .btn {
    display: inline-block;
    vertical-align: middle;
    width: 82px;
}

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

.activityContent .activityLog {
    width: 100%; /*max-height:35vw;*/
    max-height: 600px;
    overflow-y: auto;
    overflow-x: hidden;
    margin-top: 20px;
}

    .activityContent .activityLog .date {
        font-size: 16px;
        line-height: 18px;
        color: #495057;
        margin-bottom: 10px;
        font-weight: 600;
    }

.activityLog .logStatus {
    background: #ffffff;
    border-radius: 10px;
    border: 1px solid #e9edf3;
    width: calc(100% - 20px);
    padding: 10px;
    margin-bottom: 10px;
}

    .activityLog .logStatus .accordion {
        cursor: pointer;
        width: 100%;
        background-image: url("../images/pg-right.png");
        background-position: 98% center;
        background-repeat: no-repeat;
        font-size: 0;
    }

        .activityLog .logStatus .accordion.active {
            background-image: url("../images/dropdown-arrow.png");
            background-position: 98% center;
            background-repeat: no-repeat;
        }

        .activityLog .logStatus .accordion .logTitle {
            font-size: 14px;
            line-height: 18px;
            color: #6c757d;
            display: inline-block;
            vertical-align: middle;
            width: calc(100% - 194px);
        }

            .activityLog .logStatus .accordion .logTitle p strong {
                font-size: 16px; /*line-height:18px;*/
                color: #495057;
                margin-bottom: 2.5px;
                font-weight: 600;
                display: block
            }

        .activityLog .logStatus .accordion.appointment .logTitle {
            background-image: url("../images/appointment-icon.png");
            background-position: left center;
            background-repeat: no-repeat;
            padding-left: 44px;
        }

        .activityLog .logStatus .accordion.call .logTitle {
            background-image: url("../images/call-icon.png");
            background-position: left center;
            background-repeat: no-repeat;
            padding-left: 44px;
        }

        .activityLog .logStatus .accordion.email .logTitle {
            background-image: url("../images/email-icon.png");
            background-position: left center;
            background-repeat: no-repeat;
            padding-left: 44px;
        }

        .activityLog .logStatus .accordion .logDate {
            display: inline-block;
            vertical-align: middle;
            width: 120px;
            text-align: right;
            font-size: 14px;
            line-height: 18px;
            color: #00aeef;
            padding-right: 30px;
        }

    .activityLog .logStatus .accordionContent {
        border-top: 1px solid #e9edf3;
        padding-top: 15px;
        margin-top: 10px;
        margin-bottom: -8px;
    }

        .activityLog .logStatus .accordionContent p {
            font-size: 14px;
            line-height: 18px;
            color: #6c757d;
            margin-bottom: 10px;
        }

.CONTRACTS .leadProfile .leadActivity {
    height: 800px;
}

.CONTRACTS .activityContent .activityLog {
    max-height: 650px;
}

.leadProfile .leadAction {
    display: inline-block;
    vertical-align: top;
    width: 385px;
}

.leadAction .actionBtns {
    width: 100%;
    font-size: 0;
}

    .leadAction .actionBtns li {
        display: inline-block;
        vertical-align: top;
    }

        .leadAction .actionBtns li a {
            display: block;
            padding: 10px 20px 7px 20px;
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
            text-decoration: none;
            backgroun: none;
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
            margin-right: 2.5px;
            -webkit-transition: all 0.5s ease;
            -moz-transition: all 0.5s ease;
            -o-transition: all 0.5s ease;
            transition: all 0.5s ease;
        }

            .leadAction .actionBtns li a:hover, .leadAction .actionBtns li a.active {
                background: #00aeef;
                color: #ffffff;
                font-weight: 600;
            }

.actionContent {
    width: calc(100% - 40px);
    padding: 20px;
    background: #f5f7fa;
    border-radius: 10px;
    border-top-left-radius: 0;
    position: relative;
    border: 1px solid #e9edf3;
    margin-bottom: 15px;
    font-size: 0;
}

.actionFields .fieldName {
    color: #6c757d;
    font-size: 14px;
    line-height: 18px;
    margin-bottom: 0px !important;
    font-weight: 600;
}

.actionFields span {
    width: 100%;
    display: block;
    margin-bottom: 10px
}

.actionFields .col2 {
    display: inline-block;
    vertical-align: top;
    width: calc(50% - 5px);
    margin-right: 5px;
}

    .actionFields .col2.last {
        margin-right: 0;
        margin-left: 5px;
    }

.actionFields select, .actionFields input[type="text"], .actionFields textarea {
    width: 100%;
}

.actionContent .btnLeft {
    display: inline-block;
    vertical-align: middle;
    width: 50%;
}

.actionContent .btnRight {
    display: inline-block;
    vertical-align: middle;
    width: 50%;
    text-align: right !important;
}

    .actionContent .btnRight .commonBtn {
        display: inline-block;
    }

.actionContent .contractDocs {
    width: 100%;
    font-size: 0;
}

    .actionContent .contractDocs ol {
        width: 100%;
    }

        .actionContent .contractDocs ol li {
            margin-bottom: 10px;
            font-size: 0;
        }

            .actionContent .contractDocs ol li:last-child {
                margin-bottom: 0;
            }

            .actionContent .contractDocs ol li span {
                display: inline-block;
                vertical-align: middle;
                font-size: 14px;
                line-height: 18px;
                color: #6c757d;
                width: calc(100% - 82px);
            }

            .actionContent .contractDocs ol li .btn {
                width: 72px;
                margin-left: 10px;
            }

.leadAction .groupBtn {
    width: 100%;
    font-size: 0;
}

    .leadAction .groupBtn li {
        display: inline-block;
        vertical-align: middle;
        width: calc(50% - 5px);
        margin-right: 5px;
        margin-bottom: 10px;
    }

        .leadAction .groupBtn li:nth-child(even) {
            margin-left: 5px;
            margin-right: 0;
        }

        .leadAction .groupBtn li .commonBtn {
            display: block;
            width: 100%;
            font-weight: 600;
        }

.maidReserve {
    width: 100%;
    margin-bottom: 15px;
}

    .maidReserve li {
        width: calc(100% - 40px);
        padding: 5px 20px;
        background: #f5f7fa;
        border-radius: 10px;
        position: relative;
        border: 1px solid #e9edf3;
        font-size: 0;
        margin-top: 15px;
    }

        .maidReserve li.acknowledge {
            display: flex;
            flex-wrap: wrap;
        }

        .maidReserve li .left {
            border-right: 1px solid #e9edf3;
            margin-right: 10px;
            padding: 20px 20px 20px 0;
            font-size: 0;
            display: inline-block;
            vertical-align: middle;
            width: calc(100% - 51px);
        }

        .maidReserve li .rgt {
            display: inline-block;
            vertical-align: middle;
            width: 20px;
        }

        .maidReserve li .fullWidth {
            display: block;
            width: 100%;
            font-size: 0;
            padding: 20px 0;
        }

    .maidReserve .photo {
        display: inline-block;
        vertical-align: middle;
        position: relative;
        width: 80px;
        margin-right: 10px;
    }

        .maidReserve .photo .imgContainer {
            width: 60px;
            height: 60px;
            border-radius: 60px;
            overflow: hidden;
        }

            .maidReserve .photo .imgContainer img {
                width: 100%;
                display: block;
            }

        .maidReserve .photo .country {
            position: absolute;
            right: 0;
            bottom: 0;
            width: 30px;
            height: 30px;
            border-radius: 30px;
            -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
            -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
            box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
        }

            .maidReserve .photo .country img {
                display: block;
                width: 30px;
                height: 30px;
            }

    .maidReserve .name {
        display: inline-block;
        vertical-align: middle;
        width: calc(100% - 170px);
        margin-right: 10px;
    }

    .maidReserve li .fullWidth .name {
        width: calc(100% - 90px);
        margin-right: 0;
    }

    .maidReserve .name p {
        color: #6c757d;
        font-size: 14px;
        line-height: 18px;
    }

        .maidReserve .name p strong {
            color: #495057;
            font-size: 16px;
            line-height: 18px;
            font-weight: 600;
            display: block;
            margin-bottom: 2.5px;
        }

    .maidReserve .queue {
        display: inline-block;
        vertical-align: middle;
        width: 70px;
        text-align: right !important;
    }

        .maidReserve .queue .circle {
            width: 35px;
            height: 25px;
            border-radius: 35px;
            background: #6c757d;
            color: #ffffff;
            font-size: 16px;
            line-height: 16px;
            text-align: center;
            font-weight: 600;
            padding-top: 10px;
            display: inline-block;
        }

            .maidReserve .queue .circle.blue {
                background: #00aeef;
            }

        .maidReserve .queue p {
            color: #00aeef;
            font-size: 14px;
            line-height: 18px;
            display: inline-block;
            margin-top: 5px;
        }

    .maidReserve .action {
        display: block;
        width: 100%;
        text-align: right !important;
    }

        .maidReserve .action a {
            display: block;
            margin: 10px 0;
        }

.leadServices {
    width: calc(100% - 40px);
    padding: 20px;
    background: #f5f7fa;
    border-radius: 10px;
    position: relative;
    border: 1px solid #e9edf3;
    margin-bottom: 15px;
    font-size: 0;
    margin-top: 15px;
}
/**Dashboard**/
.dashboardContent {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    font-size: 0;
}

    .dashboardContent .dashboardLeft {
        width: calc(100% - 387px);
        display: inline-block;
        vertical-align: top;
        margin-bottom: 50px;
    }

    .dashboardContent .dashboardRgt {
        display: inline-block;
        vertical-align: top;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
        width: 385px;
        margin-bottom: 50px;
    }

    .dashboardContent .innerContainer {
        padding: 20px;
        width: calc(100% - 40px);
        font-size: 0;
        position: relative;
    }

.dashboardLeft .dashCol3 {
    width: calc(33.3333% - 22px);
    display: inline-block;
    vertical-align: top;
    margin-right: 20px;
    background: #f5f7fa;
    border-radius: 10px;
    padding: 0;
    position: relative;
    border: 1px solid #e9edf3;
    margin-bottom: 20px;
}

    .dashboardLeft .dashCol3 .icon {
        position: absolute;
        top: 20px;
        right: 20px;
    }

    .dashboardLeft .dashCol3 h2 {
        font-size: 14px;
        line-height: 18px;
        margin: 0 0 20px 0;
        color: #6c757d;
        font-weight: 600;
        text-transform: uppercase;
    }

    .dashboardLeft .dashCol3 .amount {
        font-size: 25px;
        line-height: 25px;
        margin-bottom: 20px;
        color: #495057;
        font-weight: 600;
    }

    .dashboardLeft .dashCol3 .status {
        font-size: 0;
    }

        .dashboardLeft .dashCol3 .status span {
            font-size: 14px;
            line-height: 18px;
            color: #6c757d;
            display: inline-block;
            vertical-align: middle;
        }

        .dashboardLeft .dashCol3 .status .percentage {
            margin-right: 5px;
            display: inline-block;
            padding: 6px 7px 4px 7px;
            color: #ffffff;
            font-size: 11px;
            line-height: 11px;
            font-weight: 700;
            border-radius: 3px;
        }

        .dashboardLeft .dashCol3 .status .positive {
            background: #20b799;
        }

        .dashboardLeft .dashCol3 .status .negative {
            background: #fa5944;
        }

        .dashboardLeft .dashCol3 .status .zero {
            background: #efb540;
        }

.dashboardLeft .dashCol2 {
    width: calc(50% - 22px);
    display: inline-block;
    vertical-align: top;
    margin-right: 20px;
    background: #f5f7fa;
    border-radius: 10px;
    padding: 0;
    position: relative;
    border: 1px solid #e9edf3;
    margin-bottom: 20px;
}

    .dashboardLeft .dashCol2 h2 {
        font-size: 16px;
        line-height: 18px;
        margin: 0 0 20px 0;
        color: #495057;
        font-weight: 600;
    }

    .dashboardLeft .dashCol2 .chart {
        width: 100%;
    }

        .dashboardLeft .dashCol2 .chart img {
            width: 100%;
            display: block;
        }

.dashboardLeft .dashPending {
    width: calc(100% - 22px);
    display: block;
    margin-right: 20px;
    background: #f5f7fa;
    border-radius: 10px;
    padding: 0;
    position: relative;
    border: 1px solid #e9edf3;
}

    .dashboardLeft .dashPending h2 {
        font-size: 16px;
        line-height: 18px;
        margin: 0 0 20px 0;
        color: #495057;
        font-weight: 600;
    }

    .dashboardLeft .dashPending .filter {
        position: absolute;
        top: 10px;
        right: 20px;
        font-size: 0;
    }

        .dashboardLeft .dashPending .filter li {
            display: inline-block;
            vertical-align: middle;
            margin-bottom: 10px;
            color: #6c757d;
            font-size: 14px;
        }

            .dashboardLeft .dashPending .filter li select {
                width: 200px;
                margin-left: 5px;
            }

.dashboardContent .dashboardRgt .calendar {
    width: 100%;
}

    .dashboardContent .dashboardRgt .calendar img {
        width: 100%;
        display: block
    }

.dashboardContent .dashboardRgt .appointment {
    width: 100%;
    margin: 20px 0 0 0;
    font-display: 0;
}

    .dashboardContent .dashboardRgt .appointment h2 {
        margin-bottom: 0;
    }

    .dashboardContent .dashboardRgt .appointment .left {
        width: 50%;
        display: inline-block;
        vertical-align: middle;
    }

    .dashboardContent .dashboardRgt .appointment .rgt {
        width: 50%;
        display: inline-block;
        vertical-align: middle;
        text-align: right;
    }

.dashboardRgt .appointment .rgt .commonBtn {
    display: inline-block;
}

.dashboardRgt .appointment ul {
    width: 100%;
    max-height: 36vw;
    overflow-y: auto;
    overflow-x: hidden;
}

    .dashboardRgt .appointment ul li {
        width: calc(100% - 2px);
        font-size: 0;
        margin-bottom: 10px;
        border-radius: 10px;
        border: 1px solid #e9edf3;
        background: #ffffff;
    }

        .dashboardRgt .appointment ul li .container {
            width: calc(100% - 54px);
            padding: 10px;
            background-image: url("../images/appointment-icon.png");
            background-position: 10px center;
            background-repeat: no-repeat;
            padding-left: 44px;
        }

        .dashboardRgt .appointment ul li .title {
            width: 50%;
            display: inline-block;
            vertical-align: middle;
        }

            .dashboardRgt .appointment ul li .title p {
                color: #6c757d;
                font-size: 14px;
                line-height: 18px;
            }

                .dashboardRgt .appointment ul li .title p strong {
                    color: #495057;
                    font-size: 16px;
                    line-height: 18px;
                    font-weight: 600;
                    display: block;
                    margin-bottom: 2.5px;
                }

        .dashboardRgt .appointment ul li .date {
            width: 50%;
            display: inline-block;
            vertical-align: middle;
            text-align: right;
        }

            .dashboardRgt .appointment ul li .date p {
                color: #6c757d;
                font-size: 14px;
                line-height: 18px;
            }

                .dashboardRgt .appointment ul li .date p strong {
                    font-weight: 400;
                    color: #00aeef;
                    display: block;
                }
/**Media Library**/
.mediaContent {
    font-size: 0;
}

    .mediaContent .contentCol2 {
        width: calc(50% - 10px);
        margin-right: 10px;
        display: inline-block;
        vertical-align: top;
    }

        .mediaContent .contentCol2.last {
            margin-right: 0;
            margin-left: 10px;
        }

    .mediaContent .contents {
        width: 100%;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
        margin-bottom: 50px;
    }

        .mediaContent .contents .innerContainer {
            padding: 20px;
            width: calc(100% - 40px);
            font-size: 0;
        }

.mediaFolders {
    margin-top: 20px;
    width: 100%;
}

    .mediaFolders h2 {
        margin-bottom: 10px !important;
    }

    .mediaFolders ul {
        width: 100%;
        font-size: 0;
        display: flex;
        flex-wrap: wrap;
        width: calc(100% + 20px);
    }

        .mediaFolders ul li {
            width: calc(16.6666% - 22px);
            margin: 0 20px 20px 0;
            display: inline-block;
            vertical-align: top;
            border-radius: 10px;
            border: 1px solid #e9edf3;
            background: #ffffff;
        }

            .mediaFolders ul li a {
                text-decoration: none;
            }

            .mediaFolders ul li .container {
                width: calc(100% - 54px);
                padding: 10px;
                background-image: url("../images/folder-img.png");
                background-position: 10px center;
                background-repeat: no-repeat;
                padding-left: 44px;
            }

                .mediaFolders ul li .container .folderName {
                    color: #495057;
                    font-size: 16px;
                    line-height: 18px;
                    font-weight: 600;
                    display: block;
                    margin-bottom: 2.5px;
                }

                .mediaFolders ul li .container .numFiles {
                    color: #6c757d;
                    font-size: 14px;
                    line-height: 18px;
                    display: block;
                }

.mediaFiles {
    margin-top: 10px;
}

    .mediaFiles ul {
        width: 100%;
        font-size: 0;
        display: flex;
        flex-wrap: wrap;
        width: calc(100% + 20px);
    }

        .mediaFiles ul li {
            width: calc(16.6666% - 22px);
            margin: 0 20px 20px 0;
            display: inline-block;
            vertical-align: top;
            border-radius: 10px;
            border: 1px solid #e9edf3;
            background: #ffffff;
        }

            .mediaFiles ul li .container {
                width: calc(100% - 20px);
                padding: 10px;
                position: relative;
            }

                .mediaFiles ul li .container a {
                    text-decoration: none;
                    display: block;
                }

                .mediaFiles ul li .container .fileImg {
                    width: 100%;
                    height: 150px;
                    margin-bottom: 5px;
                    display: block;
                    overflow: hidden;
                    border-radius: 5px;
                    background: #f5f7fa;
                    word-break: break-all;
                }

                    .mediaFiles ul li .container .fileImg img { /*height:150px;*/
                        width: 100%;
                        display: block;
                        margin: 0 auto;
                    }

                .mediaFiles ul li .container .fileName {
                    color: #495057;
                    font-size: 16px;
                    line-height: 18px;
                    font-weight: 600;
                    display: block;
                    word-wrap: break-word;
                    margin-bottom: 2.5px;
                }

                .mediaFiles ul li .container .uploadBy, .mediaFiles ul li .container .fileSize {
                    color: #6c757d;
                    font-size: 14px;
                    line-height: 18px;
                    display: block;
                }

                .mediaFiles ul li .container .checkBox {
                    position: absolute;
                    left: 17.5px;
                    top: 17.5px;
                }

    .mediaFiles h2 span {
        color: #00aeef !important;
    }
/**Maids**/
.maidsContent {
    width: 100%;
    font-size: 0;
}

    .maidsContent .innerContainer {
        padding: 20px;
        width: calc(100% - 40px);
        font-size: 0;
        position: relative;
    }

.createMaidSteps {
    width: 100%;
    margin: 10px 0 30px 0;
}

    .createMaidSteps ul {
        width: 100%;
        font-size: 0;
    }

        .createMaidSteps ul li {
            display: inline-block;
            vertical-align: middle;
            background-image: url("../images/step-arrow.png");
            background-position: right center;
            background-repeat: no-repeat;
            padding-right: 20px;
            margin-right: 15px;
            margin-bottom: 10px;
        }

    .createMaidSteps.viewSteps ul li {
        cursor: pointer;
    }

    .createMaidSteps ul li.active {
        background-image: url("../images/step-arrow-active.png");
    }

    .createMaidSteps ul li.step01 {
        width: 115px;
    }

    .createMaidSteps ul li.step02 {
        width: 150px;
    }

    .createMaidSteps ul li.step03 {
        width: 200px;
    }

    .createMaidSteps ul li.step04 {
        width: 230px;
        background-image: none;
        padding-right: 0;
        margin-right: 0;
    }

    .createMaidSteps ul li span {
        display: inline-block;
        vertical-align: middle;
    }

    .createMaidSteps ul li .step {
        width: 35px;
        height: 26px;
        border-radius: 35px;
        background: #e9edf3;
        font-size: 16px;
        line-height: 16px;
        color: #6c757d;
        text-align: center;
        padding-top: 9px;
        margin-right: 10px;
    }

    .createMaidSteps ul li.active .step {
        background: #00aeef;
        color: #ffffff;
        font-weight: 600;
    }

    .createMaidSteps ul li .text {
        font-size: 14px;
        line-height: 18px;
        color: #6c757d;
        width: calc(100% - 45px);
    }

    .createMaidSteps ul li.active .text {
        font-weight: 600;
    }

.createNewMaid {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 50px;
}

    .createNewMaid .uploadPhoto {
        display: inline-block;
        vertical-align: top;
        width: 384px;
        margin-right: 10px;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
        margin-bottom: 20px;
    }

        .createNewMaid .uploadPhoto .uploadFrame {
            width: calc(100% - 4px);
            height: 452px;
            border: 2px dashed #e9edf3;
            border-radius: 10px;
            text-align: center;
            position: relative;
        }

            .createNewMaid .uploadPhoto .uploadFrame .uploadPhotoBtn {
                position: absolute;
                top: 50%;
                left: 0;
                right: 0;
                transform: translateY(-50%);
            }

.uploadFrame .uploadPhotoBtn p {
    color: #6c757d;
    font-size: 14px;
    line-height: 18px;
    margin-bottom: 10px;
}

    .uploadFrame .uploadPhotoBtn p strong {
        display: block;
        font-weight: 600;
    }

.uploadFrame .uploadPhotoBtn img {
    display: inline-block;
    margin-bottom: 10px;
}

.uploadFrame .uploadPhotoBtn .commonBtn {
    display: inline-block !important;
}

.uploadFrame .uploadPhotoBtn .upload {
    width: 133px;
    margin: 0 auto;
}

.photoPlaceholder {
    width: 100%;
}

    .photoPlaceholder img {
        width: 100%;
        display: block;
        border-radius: 10px;
    }

    .photoPlaceholder .upload {
        width: 133px;
        margin: 10px auto 0 auto;
    }

        .photoPlaceholder .upload .commonBtn {
            width: 133px;
            display: inline-block !important;
        }

.createNewMaid .personalInfo {
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 408px);
    margin-left: 10px;
    background: #f5f7fa;
    border-radius: 10px;
    padding: 0;
    position: relative;
    border: 1px solid #e9edf3;
    margin-bottom: 20px;
}

.createNewMaid .medical {
    display: block;
    width: calc(100% - 2px);
    background: #f5f7fa;
    border-radius: 10px;
    padding: 0;
    position: relative;
    border: 1px solid #e9edf3;
    margin-bottom: 20px;
}

.createNewMaid .others {
    display: block;
    width: calc(100% - 2px);
    background: #f5f7fa;
    border-radius: 10px;
    padding: 0;
    position: relative;
    border: 1px solid #e9edf3;
    margin-bottom: 20px;
}

.createNewMaid .interview {
    display: block;
    width: calc(100% - 2px);
    background: #f5f7fa;
    border-radius: 10px;
    padding: 0;
    position: relative;
    border: 1px solid #e9edf3;
    margin-bottom: 20px;
}

    .createNewMaid .interview p {
        color: #6c757d;
        font-size: 14px;
        line-height: 18px;
    }

        .createNewMaid .interview p strong {
            font-weight: 600;
        }

    .createNewMaid .interview .uploadVideo {
        width: calc(100% - 22px);
        height: 200px;
        margin: 20px 0;
        border: 2px dashed #e9edf3;
        border-radius: 10px;
        text-align: center;
        position: relative;
    }

        .createNewMaid .interview .uploadVideo .uploadVideoBtn {
            position: absolute;
            top: 50%;
            left: 0;
            right: 0;
            transform: translateY(-50%);
        }

.interview .uploadVideo .uploadVideoBtn p {
    color: #6c757d;
    font-size: 14px;
    line-height: 18px;
    margin-bottom: 10px;
}

    .interview .uploadVideo .uploadVideoBtn p strong {
        display: block;
        font-weight: 600;
    }

.interview .uploadVideo .uploadVideoBtn img {
    display: inline-block;
    margin-bottom: 10px;
}

.interview .uploadVideo .uploadVideoBtn .commonBtn {
    display: inline-block !important;
}

.interview .uploadVideo .uploadVideoBtn .upload {
    width: 133px;
    margin: 0 auto;
}

.question_answer {
    width: 100%;
}

    .question_answer li {
        width: 100%;
        font-size: 0;
        border-bottom: 1px solid #e9edf3;
        margin-bottom: 15px;
        padding-bottom: 15px;
    }

        .question_answer li:last-child {
            border-bottom: none;
            margin-bottom: 0;
            padding-bottom: 0;
        }

        .question_answer li .question {
            display: inline-block;
            vertical-align: top;
            width: 400px;
            margin-right: 80px;
            font-size: 0;
        }

       
        .question_answer li .question .qNo {
            display: inline-block;
            vertical-align: top;
            width: 20px;
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
            text-transform: uppercase;
            font-weight: 600;
        }

        .question_answer li .question .qText {
            display: inline-block;
            vertical-align: top;
            width: calc(100% - 20px);
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
        }

            .question_answer li .question .qText p {
                text-transform: uppercase;
                font-weight: 600;
                margin-bottom: 5px;
            }

        .question_answer li .answer {
            display: inline-block;
            vertical-align: bottom;
            width: calc(100% - 480px);
        }

            .question_answer li .answer .ansCol {
                display: inline-block;
                vertical-align: top;
            }

                .question_answer li .answer .ansCol:nth-child(1) {
                    width: 130px;
                    margin-right: 50px;
                }

                .question_answer li .answer .ansCol:nth-child(2) {
                    width: 240px;
                    margin-right: 50px;
                }

                .question_answer li .answer .ansCol:nth-child(3) {
                    width: calc(100% - 470px);
                }

                .question_answer li .answer .ansCol .ansHeader {
                    margin-bottom: 15px;
                    display: none;
                }

        .question_answer li:nth-child(1) .answer .ansCol .ansHeader {
            display: block;
        }

        .question_answer li .answer .ansCol p {
            font-size: 14px;
            line-height: 18px;
            color: #6c757d;
        }

            .question_answer li .answer .ansCol p strong {
                font-weight: 600;
                display: block;
            }

        .question_answer li .answer .ansCol .ansField {
        }

            .question_answer li .answer .ansCol .ansField span {
                display: inline-block;
                vertical-align: middle;
                margin-right: 20px;
            }

            .question_answer li .answer .ansCol .ansField .ansInput {
                margin-top: 5px;
            }

.createNewMaid .history {
    display: block;
    width: calc(100% - 2px);
    background: #f5f7fa;
    border-radius: 10px;
    padding: 0;
    position: relative;
    border: 1px solid #e9edf3;
    margin-bottom: 20px;
}

.createNewMaid .historyCol2 {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    font-size: 0;
}

    .createNewMaid .historyCol2 .left {
        width: calc(50% - 12px);
        margin-right: 10px;
        display: inline-block;
        vertical-align: top;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
        margin-bottom: 20px;
    }

    .createNewMaid .historyCol2 .rgt {
        width: calc(50% - 12px);
        margin-left: 10px;
        display: inline-block;
        vertical-align: top;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
        margin-bottom: 20px;
    }

    .createNewMaid .historyCol2 .left .leftField {
        display: inline-block;
        vertical-align: top;
        width: calc(100% - 170px);
        margin-right: 50px;
    }

        .createNewMaid .historyCol2 .left .leftField p, .createNewMaid .historyCol2 .left .rightField p {
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
        }

            .createNewMaid .historyCol2 .left .leftField p strong {
                display: block;
                margin-bottom: 15px;
            }

    .createNewMaid .historyCol2 .left .rightField {
        display: inline-block;
        vertical-align: top;
        text-align: right;
        width: 120px;
    }

        .createNewMaid .historyCol2 .left .rightField span {
            margin: 0 5px;
        }

    .createNewMaid .historyCol2 .rgt .leftField {
        display: inline-block;
        vertical-align: middle;
        width: 100px;
        color: #6c757d;
        font-size: 14px;
        line-height: 18px;
    }

    .createNewMaid .historyCol2 .rgt .rightField {
        display: inline-block;
        vertical-align: middle;
        width: calc(100% - 100px);
        color: #6c757d;
        font-size: 14px;
        line-height: 18px;
    }

.overseasHistory {
    width: 100%;
}

    .overseasHistory li {
        width: 100%;
        font-size: 0;
        border-bottom: 1px solid #e9edf3;
        margin-bottom: 15px;
        padding-bottom: 15px;
    }

        .overseasHistory li:last-child {
            border-bottom: none;
            margin-bottom: 10px;
            padding-bottom: 10px;
        }

        .overseasHistory li span {
            display: inline-block;
            vertical-align: middle;
        }

            .overseasHistory li span .fieldHeader {
                color: #6c757d;
                font-size: 14px;
                line-height: 18px;
                font-weight: 600;
                margin-bottom: 5px;
                display: none;
            }

        .overseasHistory li:nth-child(1) span .fieldHeader {
            display: block;
        }

        .overseasHistory li span .field {
        }

            .overseasHistory li span .field span {
                width: calc(50% - 10px);
            }

            .overseasHistory li span .field .text {
                color: #6c757d;
                font-size: 14px;
                line-height: 18px;
                text-align: center;
                width: 20px;
            }

        .overseasHistory li .serialNo {
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
            width: 20px;
            text-align: center;
        }

        .overseasHistory li:nth-child(1) .serialNo {
            margin-top: 20px;
        }

        .overseasHistory li .date {
            margin-right: 10px;
            width: 330px;
        }

        .overseasHistory li .country {
            margin-right: 10px;
            width: calc(25% - 100px);
        }

        .overseasHistory li .employer {
            margin-right: 10px;
            width: calc(25% - 100px);
        }

        .overseasHistory li .workDuties {
            margin-right: 10px;
            width: calc(25% - 100px);
        }

        .overseasHistory li .remarks {
            width: calc(25% - 90px);
        }

        .overseasHistory li p {
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
        }

.maidsOverview {
    width: 100%;
    font-size: 0;
    margin-bottom: 50px;
    position: relative;
}

.maidProfile {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    font-size: 0;
    margin-bottom: 50px;
}

    .maidProfile .maidDetail {
        display: inline-block;
        vertical-align: top;
        width: 385px;
        margin-right: 20px;
    }

.maidDetail .maidName {
    width: 100%;
    font-size: 0;
    border-bottom: 1px solid #e9edf3;
    margin-bottom: 20px;
    padding-bottom: 20px;
}

    .maidDetail .maidName .photo {
        display: inline-block;
        vertical-align: middle;
        width: 110px;
        margin-right: 20px;
        position: relative;
    }

        .maidDetail .maidName .photo .imgContainer {
            width: 85px;
            height: 85px;
            border-radius: 85px;
            overflow: hidden;
        }

            .maidDetail .maidName .photo .imgContainer img {
                width: 100%;
                display: block;
            }

        .maidDetail .maidName .photo .country {
            position: absolute;
            bottom: 0;
            right: 10px;
            width: 35px;
            height: 35px;
            border-radius: 35px;
            -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
            -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
            box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
        }

            .maidDetail .maidName .photo .country img {
                display: block;
                width: 100%;
            }

    .maidDetail .maidName .name {
        display: inline-block;
        vertical-align: middle;
        width: calc(100% - 130px);
        font-size: 18px;
        line-height: 24px;
        color: #495057;
        font-weight: 600;
    }

        .maidDetail .maidName .name span {
            margin-right: 10px;
        }

        .maidDetail .maidName .name .status {
            vertical-align: middle;
            margin-right: 0;
            display: inline-block;
            padding: 6px 7px 4px 7px;
            color: #ffffff;
            font-size: 11px;
            line-height: 11px;
            font-weight: 700;
            border-radius: 3px;
            text-transform: uppercase;
            cursor: pointer;
        }

.maidName .status.available {
    background: #20b799;
}

.maidName .status.reserved {
    background: #efb540;
}

.maidName .status.contracted {
    background: #00aeef;
}

.maidName .status.notAvailable {
    background: #fa5944;
}

.maidDetail .maidName .name .country {
    width: 100%;
    font-size: 0;
    display: block;
    font-size: 14px;
    line-height: 18px;
    color: #6c757d;
    font-weight: 400;
    margin-right: 0;
}

.maidDetail .maidContact {
    width: 100%;
    border-bottom: 1px solid #e9edf3;
    margin-bottom: 20px;
    padding-bottom: 5px;
}

    .maidDetail .maidContact h2 {
        margin-bottom: 15px;
    }

    .maidDetail .maidContact ul {
        width: 100%;
        font-size: 0;
    }

        .maidDetail .maidContact ul li {
            display: inline-block;
            vertical-align: top;
            width: calc(50% - 10px);
            margin-right: 10px;
        }

            .maidDetail .maidContact ul li:nth-child(even) {
                margin-right: 0;
                margin-left: 10px;
            }

            .maidDetail .maidContact ul li.fullBlock {
                display: block;
                width: 100%;
                margin-right: 0;
            }

    .maidDetail .maidContact p {
        font-size: 14px;
        line-height: 18px;
        color: #6c757d;
        margin-bottom: 15px;
    }

        .maidDetail .maidContact p strong {
            font-weight: 600;
            display: block;
            margin-bottom: 2.5px;
        }

    .maidDetail .maidContact.jobInfo {
        border-bottom: none;
        margin-bottom: 10px;
    }

    .maidDetail .maidContact span {
        width: 32px;
        height: 32px;
        display: inline-block;
        vertical-align: middle;
        margin: 0 2.5px
    }

    .maidDetail .maidContact .baby {
        background-image: url("../images/icon-take-care-baby.png");
    }

    .maidDetail .maidContact .children {
        background-image: url("../images/icon-take-care-children.png");
    }

    .maidDetail .maidContact .elderly {
        background-image: url("../images/icon-take-care-elderly.png");
    }

    .maidDetail .maidContact .cooking {
        background-image: url("../images/icon-cooking.png");
    }

    .maidDetail .maidContact .cleaning {
        background-image: url("../images/icon-cleaning.png");
    }

.maidProfile .maidActivity {
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 812px);
    height: auto;
    margin-right: 20px;
    background: #f5f7fa;
    border-radius: 10px;
    position: relative;
    border: 1px solid #e9edf3;
}

    .maidProfile .maidActivity .activityContent {
        width: calc(100% - 40px);
        padding: 20px;
    }

        .maidProfile .maidActivity .activityContent h1 {
            margin: 0 0 20px 0;
        }

        .maidProfile .maidActivity .activityContent .activitySearch {
            width: 100%;
            font-size: 0;
        }

.maidActivity .activityContent .activityLog {
    width: 100%;
    max-height: 35vw;
    overflow-y: auto;
    overflow-x: hidden;
    margin-top: 20px;
}

    .maidActivity .activityContent .activityLog .date {
        font-size: 16px;
        line-height: 18px;
        color: #495057;
        margin-bottom: 10px;
        font-weight: 600;
    }

.maidActivity .activityLog .logStatus {
    background: #ffffff;
    border-radius: 10px;
    border: 1px solid #e9edf3;
    width: calc(100% - 30px);
    padding: 15px;
    margin-bottom: 10px;
}

    .maidActivity .activityLog .logStatus .accordion {
        cursor: default;
        background-image: none;
        font-size: 0;
    }

        .maidActivity .activityLog .logStatus .accordion .logDate {
            padding-right: 0;
        }

        .maidActivity .activityLog .logStatus .accordion .logTitle {
            width: calc(100% - 120px);
        }

.maidProfile .maidAction {
    display: inline-block;
    vertical-align: top;
    width: 385px;
}

.maidAction .document {
    width: calc(100% - 40px);
    padding: 20px;
    background: #f5f7fa;
    border-radius: 10px;
    position: relative;
    border: 1px solid #e9edf3;
    margin-bottom: 20px;
    font-size: 0;
}

    .maidAction .document ol {
        width: 100%;
    }

        .maidAction .document ol li {
            margin-bottom: 10px;
            font-size: 0;
        }

            .maidAction .document ol li:last-child {
                margin-bottom: 0;
            }

            .maidAction .document ol li span {
                display: inline-block;
                vertical-align: middle;
                font-size: 14px;
                line-height: 18px;
                color: #6c757d;
                width: calc(100% - 140px);
            }

            .maidAction .document ol li .btn {
                width: 130px;
                margin-left: 10px;
            }

                .maidAction .document ol li .btn a {
                    display: block;
                    width: 100%;
                }

                .maidAction .document ol li .btn input {
                    display: block;
                    width: 100%;
                }

                .maidAction .document ol li .btn .commonBtn.attachFile {
                    background-position: 20px center;
                }
                /*
.maidAction .document ol li .btn .commonBtn{padding: 9px 0 7px 0;display:block;}
.maidAction .document ol li .btn .commonBtn.attachFile{background-image:none;padding-left:0 !important;}
.maidAction .document ol li .btn .commonBtn.attachFile:before{content:url("../images/attach-icon.png");padding: 0 5px 0 0;vertical-align:-30%;}
*/
                .maidAction .document ol li .btn .commonBtn.sendRequest {
                    padding: 8px 0 4px 0;
                }

                    .maidAction .document ol li .btn .commonBtn.sendRequest:before {
                        content: url("../images/send-request-icon.png");
                        padding: 0 5px 0 0;
                        vertical-align: -40%;
                    }
.commonBtn.send {
    margin-left: 10px;
}
                .maidAction .document ol li .btn .commonBtn.download {
                    padding: 8px 0 4px 0;
                    background: #2e3192;
                    color: #ffffff;
                }

                    .maidAction .document ol li .btn .commonBtn.download:before {
                        content: url("../images/download-icon.png");
                        padding: 0 5px 0 0;
                        vertical-align: -40%;
                    }

.maidAction .reservation {
    width: calc(100% - 40px);
    padding: 20px;
    background: #f5f7fa;
    border-radius: 10px;
    position: relative;
    border: 1px solid #e9edf3;
    margin-bottom: 20px;
    font-size: 0;
}

    .maidAction .reservation ol {
        list-style: decimal;
        margin: 0;
        padding: 0;
        width: 100%;
    }

        .maidAction .reservation ol li {
            list-style-position: inside;
            padding-bottom: 10px;
            margin-bottom: 10px;
            border-bottom: 1px solid #e9edf3;
            font-size: 14px;
            line-height: 18px;
            color: #6c757d;
        }

            .maidAction .reservation ol li:last-child {
                padding-bottom: 0;
                margin-bottom: 0;
                border-bottom: none;
            }

            .maidAction .reservation ol li.alert {
                font-weight: 600;
            }

            .maidAction .reservation ol li span {
                display: inline-block;
                vertical-align: middle;
                margin-left: 15px;
                width: calc(95% - 95px);
            }

            .maidAction .reservation ol li .dayLeft {
                width: 80px;
                text-align: right;
                margin-left: 0;
                font-weight: 400 !important;
                color: #00aeef;
            }

.maidAction .employerName {
    width: calc(100% - 40px);
    padding: 20px;
    background: #f5f7fa;
    border-radius: 10px;
    position: relative;
    border: 1px solid #e9edf3;
    margin-bottom: 20px;
    font-size: 0;
}

    .maidAction .employerName .icon {
        width: 24px;
        margin-right: 25px;
        display: inline-block;
        vertical-align: middle;
    }

        .maidAction .employerName .icon img {
            display: block;
            width: 100%;
        }

    .maidAction .employerName .name {
        display: inline-block;
        vertical-align: middle;
        width: calc(100% - 49px);
    }

        .maidAction .employerName .name p {
            font-size: 14px;
            line-height: 18px;
            color: #6c757d;
        }

            .maidAction .employerName .name p strong {
                font-size: 16px;
                line-height: 20px;
            }

.maidAction .actionBtns {
    width: 100%;
    font-size: 0;
}

    .maidAction .actionBtns li {
        display: inline-block;
        vertical-align: top;
    }

        .maidAction .actionBtns li a {
            display: block;
            padding: 10px 20px 7px 20px;
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
            text-decoration: none;
            backgroun: none;
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
            margin-right: 2.5px;
            -webkit-transition: all 0.5s ease;
            -moz-transition: all 0.5s ease;
            -o-transition: all 0.5s ease;
            transition: all 0.5s ease;
        }

            .maidAction .actionBtns li a:hover, .maidAction .actionBtns li a.active {
                background: #00aeef;
                color: #ffffff;
                font-weight: 600;
            }

.actionContent {
    width: calc(100% - 40px);
    padding: 20px;
    background: #f5f7fa;
    border-radius: 10px;
    border-top-left-radius: 0;
    position: relative;
    border: 1px solid #e9edf3;
    margin-bottom: 15px;
    font-size: 0;
}
/**Customers**/
.customersContent {
    font-size: 0;
}

    .customersContent .contents {
        width: 100%;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
    }

        .customersContent .contents.customersTable {
            margin-bottom: 50px;
        }

        .customersContent .contents .innerContainer {
            padding: 20px;
            width: calc(100% - 40px);
            font-size: 0;
        }

.customerProfile {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    font-size: 0;
    margin-bottom: 50px;
}

    .customerProfile .customerDetail {
        display: inline-block;
        vertical-align: top;
        width: 385px;
        margin-right: 20px;
    }

.customerDetail .customerName {
    width: 100%;
    font-size: 0;
    border-bottom: 1px solid #e9edf3;
    margin-bottom: 20px;
    padding-bottom: 20px;
    cursor: pointer;
}

    .customerDetail .customerName .icon {
        display: inline-block;
        vertical-align: top;
        width: 24px;
        margin-right: 15px;
    }

        .customerDetail .customerName .icon img {
            width: 100%;
            display: block;
        }

    .customerDetail .customerName .name {
        display: inline-block;
        vertical-align: middle;
        font-size: 18px;
        line-height: 24px;
        color: #495057;
        font-weight: 600;
        width: calc(100% - 39px);
    }

        .customerDetail .customerName .name span {
            margin-right: 6px;
        }

.customerDetail .customerContact {
    width: 100%;
    font-size: 0;
    margin-bottom: 20px;
    padding-bottom: 5px;
    display: flex;
    flex-wrap: wrap;
    border-bottom: 1px solid #e9edf3;
}

    .customerDetail .customerContact span {
        display: inline-block;
        vertical-align: middle;
        width: calc(100% - 39px);
        font-size: 14px;
        line-height: 18px;
        color: #6c757d;
    }

    .customerDetail .customerContact .space {
        width: 39px;
    }

    .customerDetail .customerContact h2 {
        margin-bottom: 15px;
    }

    .customerDetail .customerContact p {
        font-size: 14px;
        line-height: 18px;
        color: #6c757d;
        margin-bottom: 15px;
    }

        .customerDetail .customerContact p strong {
            font-weight: 600;
            display: block;
            margin-bottom: 2.5px;
        }

    .customerDetail .customerContact.assignTo {
        border-bottom: none;
        margin-bottom: 10px;
    }

.customerProfile .customerActivity {
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 812px);
    height: 750px;
    margin-right: 20px;
    background: #f5f7fa;
    border-radius: 10px;
    position: relative;
    border: 1px solid #e9edf3;
}

    .customerProfile .customerActivity .activityContent {
        width: calc(100% - 40px);
        padding: 20px;
    }

        .customerProfile .customerActivity .activityContent h1 {
            margin: 0 0 20px 0;
        }

        .customerProfile .customerActivity .activityContent .activitySearch {
            width: 100%;
            font-size: 0;
        }

.customerActivity .activityContent .activitySearch .date {
    display: inline-block;
    vertical-align: middle;
    width: 422px;
    margin-right: 5px;
}

    .customerActivity .activityContent .activitySearch .date ul li {
        display: inline-block;
        vertical-align: middle;
        font-size: 14px;
        line-height: 18px;
        color: #6c757d;
        width: calc(50% - 12px);
    }

        .customerActivity .activityContent .activitySearch .date ul li:nth-child(2) {
            width: 24px;
        }

.customerActivity .activityContent .activitySearch .activityType {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 514px);
    margin-right: 5px;
}

.customerActivity .activityContent .activitySearch .btn {
    display: inline-block;
    vertical-align: middle;
    width: 82px;
}

.customerActivity .activityContent select, .activityContent input[type="text"] {
    width: 100%;
}

.customerActivity .activityContent .activityLog {
    width: 100%; /*max-height:35vw;*/
    max-height: 600px;
    overflow-y: auto;
    overflow-x: hidden;
    margin-top: 20px;
}

    .customerActivity .activityContent .activityLog .date {
        font-size: 16px;
        line-height: 18px;
        color: #495057;
        margin-bottom: 10px;
        font-weight: 600;
    }

.customerActivity .activityLog .logStatus {
    background: #ffffff;
    border-radius: 10px;
    border: 1px solid #e9edf3;
    width: calc(100% - 20px);
    padding: 10px;
    margin-bottom: 10px;
}

    .customerActivity .activityLog .logStatus .accordion {
        cursor: pointer;
        width: 100%;
        background-image: url("../images/pg-right.png");
        background-position: 98% center;
        background-repeat: no-repeat;
        font-size: 0;
    }

        .customerActivity .activityLog .logStatus .accordion.active {
            background-image: url("../images/dropdown-arrow.png");
            background-position: 98% center;
            background-repeat: no-repeat;
        }

        .customerActivity .activityLog .logStatus .accordion .logTitle {
            font-size: 14px;
            line-height: 18px;
            color: #6c757d;
            display: inline-block;
            vertical-align: middle;
            width: calc(100% - 194px);
        }

            .customerActivity .activityLog .logStatus .accordion .logTitle p strong {
                font-size: 16px; /*line-height:22px;*/
                color: #495057;
                margin-bottom: 2.5px;
                font-weight: 600;
                display: block
            }

        .customerActivity .activityLog .logStatus .accordion.appointment .logTitle {
            background-image: url("../images/appointment-icon.png");
            background-position: left center;
            background-repeat: no-repeat;
            padding-left: 44px;
        }

        .customerActivity .activityLog .logStatus .accordion.call .logTitle {
            background-image: url("../images/call-icon.png");
            background-position: left center;
            background-repeat: no-repeat;
            padding-left: 44px;
        }

        .customerActivity .activityLog .logStatus .accordion.email .logTitle {
            background-image: url("../images/email-icon.png");
            background-position: left center;
            background-repeat: no-repeat;
            padding-left: 44px;
        }

        .customerActivity .activityLog .logStatus .accordion .logDate {
            display: inline-block;
            vertical-align: middle;
            width: 120px;
            text-align: right;
            font-size: 14px;
            line-height: 18px;
            color: #00aeef;
            padding-right: 30px;
        }

    .customerActivity .activityLog .logStatus .accordionContent {
        border-top: 1px solid #e9edf3;
        padding-top: 15px;
        margin-top: 10px;
        margin-bottom: -8px;
    }

        .customerActivity .activityLog .logStatus .accordionContent p {
            font-size: 14px;
            line-height: 18px;
            color: #6c757d;
            margin-bottom: 10px;
        }

.customerProfile .customerOthers {
    display: inline-block;
    vertical-align: top;
    width: 385px;
}

.customerMaid {
    width: calc(100% - 40px);
    padding: 20px;
    background: #f5f7fa;
    border-radius: 10px;
    position: relative;
    border: 1px solid #e9edf3;
    margin-bottom: 15px;
    font-size: 0;
    margin-bottom: 20px;
}

    .customerMaid .photo {
        display: inline-block;
        vertical-align: middle;
        width: 80px;
        margin-right: 20px;
        position: relative;
    }

        .customerMaid .photo .imgContainer {
            width: 60px;
            height: 60px;
            border-radius: 60px;
            overflow: hidden;
        }

            .customerMaid .photo .imgContainer img {
                width: 100%;
                display: block;
            }

        .customerMaid .photo .country {
            position: absolute;
            bottom: 0;
            right: 0;
            width: 30px;
            height: 30px;
            border-radius: 30px;
            -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
            -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
            box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
        }

            .customerMaid .photo .country img {
                width: 100%;
                display: block;
            }

    .customerMaid .name {
        display: inline-block;
        vertical-align: middle;
        width: calc(100% - 100px);
        font-size: 18px;
        line-height: 24px;
        color: #495057;
        font-weight: 600;
    }

        .customerMaid .name p {
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
        }

            .customerMaid .name p strong {
                color: #495057;
                font-size: 16px;
                line-height: 18px;
                font-weight: 600;
                display: block;
                margin-bottom: 2.5px;
            }

    .customerMaid .otherInfo {
        width: 100%;
        padding-top: 20px;
        margin-top: 20px;
        border-top: 1px solid #e9edf3;
    }

        .customerMaid .otherInfo ul {
            font-size: 0;
        }

            .customerMaid .otherInfo ul li {
                display: inline-block;
                vertical-align: top;
                width: calc(50% - 10px);
                margin-right: 10px;
                margin-bottom: 10px;
            }

                .customerMaid .otherInfo ul li:nth-child(even) {
                    margin-right: 0;
                    margin-left: 10px;
                }

                .customerMaid .otherInfo ul li p {
                    color: #6c757d;
                    font-size: 14px;
                    line-height: 18px;
                }

                    .customerMaid .otherInfo ul li p strong {
                        font-weight: 600;
                        display: block;
                    }

.activeLeads {
    width: calc(100% - 40px);
    padding: 20px;
    background: #f5f7fa;
    border-radius: 10px;
    position: relative;
    border: 1px solid #e9edf3;
    margin-bottom: 15px;
    font-size: 0;
}

    .activeLeads ol {
        list-style: decimal;
        margin: 0;
        padding: 0;
        width: 100%;
    }

        .activeLeads ol li {
            list-style-position: inside;
            padding-bottom: 10px;
            margin-bottom: 10px;
            border-bottom: 1px solid #e9edf3;
            font-size: 14px;
            line-height: 18px;
            color: #6c757d;
        }

            .activeLeads ol li:last-child {
                padding-bottom: 0;
                margin-bottom: 0;
                border-bottom: none;
            }

            .activeLeads ol li span {
                display: inline-block;
                vertical-align: top;
                margin-right: 15px;
                margin-left: 15px;
                width: calc(95% - 70px);
            }

                .activeLeads ol li span strong {
                    display: block;
                    font-weight: 600;
                }

            .activeLeads ol li .leadQuality {
                width: 40px;
                margin-right: 0;
                margin-left: 0;
            }

.maidsOverview .leftFilters {
    display: inline-block;
    vertical-align: top;
    width: 250px;
    margin-right: 40px;
    border: 1px solid #e9edf3;
    background: #ffffff;
    border-radius: 10px;
    overflow: hidden; /*position:fixed;*/
}

    .maidsOverview .leftFilters .container {
        width: 100%; /*width:210px;max-height:37.5vw;padding:20px;overflow-y:auto;overflow-x:hidden;*/
    }

        .maidsOverview .leftFilters .container .filterTitle {
            background: #e9edf3 url("../images/filter-icon.png") no-repeat 10px center;
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
            width: calc(100% - 40px);
            padding: 10px 10px 10px 30px;
        }

.filterCloseMobile {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    font-weight: 600;
    display: none;
}

.maidsOverview .leftFilters .container .filterList {
    width: 100%;
}

    .maidsOverview .leftFilters .container .filterList .level01 {
        width: calc(100% - 20px);
        margin: 0 10px;
        padding: 15px 0;
        border-bottom: 1px solid #e9edf3;
    }

        .maidsOverview .leftFilters .container .filterList .level01 a {
            width: 100%;
            display: block;
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
            font-weight: 600;
            text-decoration: none;
            background: url("../images/step-arrow.png")no-repeat right center;
        }

            .maidsOverview .leftFilters .container .filterList .level01 a.active {
                background: url("../images/dropdown-arrow.png")no-repeat right center;
            }

    .maidsOverview .leftFilters .container .filterList .level02 {
        width: 100%
    }

        .maidsOverview .leftFilters .container .filterList .level02 li {
            padding: 5px 0;
        }

            .maidsOverview .leftFilters .container .filterList .level02 li:last-child {
                padding-bottom: 0;
            }

        .maidsOverview .leftFilters .container .filterList .level02 input {
            margin-top: 5px;
        }

.maidsOverview .leftFilters .container .groupBtn {
    width: calc(100% - 20px);
    margin: 20px 10px 10px 10px;
    font-size: 0;
}

    .maidsOverview .leftFilters .container .groupBtn li {
        display: inline-block;
        vertical-align: middle;
        width: calc(50% - 5px);
        margin: 0 5px 10px 0;
        border: none;
    }

        .maidsOverview .leftFilters .container .groupBtn li.last {
            margin: 0 0 10px 5px;
        }

        .maidsOverview .leftFilters .container .groupBtn li .commonBtn {
            display: block;
            width: 100%;
        }

.maidsOverview .rightResults {
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 292px); /*margin-left:292px;*/
}

.maidFilter {
    width: 100%;
    margin-bottom: 20px;
}

    .maidFilter .filterLeft {
        width: 50%;
        display: inline-block;
        vertical-align: middle;
    }

        .maidFilter .filterLeft .container {
            max-width: 450px;
            margin: 0;
            font-size: 0;
        }

        .maidFilter .filterLeft span {
            width: calc(100% - 87px);
            margin-right: 5px;
            display: inline-block;
            vertical-align: middle;
        }

        .maidFilter .filterLeft .btn {
            width: 82px;
            margin-right: 0;
        }

            .maidFilter .filterLeft .btn.filterBtnMobile {
                display: none;
            }

    .maidFilter .filterRgt {
        width: 50%;
        display: inline-block;
        vertical-align: middle;
        text-align: right;
    }

.maidLegend {
    width: 100%;
    font-size: 0;
    margin-bottom: 20px;
}

    .maidLegend .legend {
        width: calc(100% - 164px);
        display: inline-block;
        vertical-align: middle;
        font-size: 0;
    }

        .maidLegend .legend li {
            font-size: 14px;
            line-height: 18px;
            color: #6c757d;
            display: inline-block;
            vertical-align: middle;
            padding: 0 15px 0 0;
        }

            .maidLegend .legend li strong {
                font-weight: 600;
            }

            .maidLegend .legend li span {
                display: inline-block;
                vertical-align: middle;
            }

    .maidLegend .btn {
        width: 164px;
        display: inline-block;
        vertical-align: middle;
        text-align: right;
    }

.maidView {
    width: 100%;
    font-size: 0;
    display: flex;
    flex-wrap: wrap;
    width: calc(100% + 20px);
}

    .maidView li {
        width: calc(25% - 22px);
        margin: 0 20px 20px 0;
        display: inline-block;
        vertical-align: top;
        border-radius: 10px;
        border: 1px solid #e9edf3;
        background: #ffffff;
    }

        .maidView li .container {
            width: calc(100% - 30px);
            margin: 15px;
            position: relative;
        }

            .maidView li .container .checkBoxStyle {
                position: absolute;
                top: -5px;
                right: -10px;
            }

            .maidView li .container span {
                width: 100%;
                display: block;
            }

            .maidView li .container .detail {
                width: 100%;
            }

                .maidView li .container .detail .photo {
                    display: inline-block;
                    vertical-align: middle;
                    width: 85px;
                    padding-right: 20px;
                    position: relative;
                }

                    .maidView li .container .detail .photo .imgContainer {
                        width: 85px;
                        height: 85px;
                        border-radius: 85px;
                        overflow: hidden;
                    }

                        .maidView li .container .detail .photo .imgContainer img {
                            width: 100%;
                            display: block;
                        }

                    .maidView li .container .detail .photo .country {
                        position: absolute;
                        bottom: 0;
                        right: 0;
                        background: none;
                        width: 35px;
                        height: 35px;
                        border-radius: 35px;
                        -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
                        -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
                        box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
                    }

                        .maidView li .container .detail .photo .country img {
                            display: block;
                            width: 100%;
                        }

                .maidView li .container .detail .maidName {
                    display: inline-block;
                    vertical-align: middle;
                    width: calc(100% - 120px);
                    margin-left: 15px;
                    font-size: 16px;
                    line-height: 18px;
                    color: #495057;
                    font-weight: 600;
                }

                    .maidView li .container .detail .maidName span {
                        margin-bottom: 2.5px;
                    }

                    .maidView li .container .detail .maidName .country {
                        color: #6c757d;
                        font-size: 14px;
                        line-height: 18px;
                        font-weight: 400;
                    }

                    .maidView li .container .detail .maidName .status {
                        vertical-align: middle;
                        margin-right: 0;
                        display: inline-block !important;
                        padding: 6px 7px 4px 7px;
                        color: #ffffff;
                        font-size: 11px;
                        line-height: 11px;
                        font-weight: 700;
                        border-radius: 3px;
                        text-transform: uppercase;
                        cursor: pointer;
                        width: auto !important;
                    }

            .maidView li .container .experience {
                border-top: 1px solid #e9edf3;
                width: 100%;
                margin-top: 10px;
            }

                .maidView li .container .experience .content {
                    width: calc(100% - 20px);
                    padding: 15px 10px 0 10px;
                    font-size: 0;
                }

                .maidView li .container .experience span {
                    display: inline-block;
                    vertical-align: middle;
                    font-size: 14px;
                    line-height: 18px;
                    font-weight: 400;
                    color: #6c757d;
                    width: 50%;
                    margin-top: 5px;
                }

                .maidView li .container .experience .title {
                    font-weight: 600;
                }

            .maidView li .container .training {
                width: calc(100% - 20px);
                margin-top: 10px;
                padding: 4px 10px 6px 10px;
                background: #00aeef;
                font-size: 0;
                border-radius: 5px;
            }

                .maidView li .container .training span {
                    display: inline-block;
                    vertical-align: middle;
                    font-size: 14px;
                    line-height: 18px;
                    font-weight: 400;
                    color: #ffffff;
                    width: 50%;
                    margin-top: 5px;
                }

                .maidView li .container .training .title {
                    font-weight: 600;
                }

            .maidView li .container .skill {
                width: calc(100% - 20px);
                margin-top: 15px;
                padding: 15px 10px 0 10px;
                border-top: 1px solid #e9edf3;
                font-size: 0;
            }

                .maidView li .container .skill p {
                    font-size: 14px;
                    line-height: 18px;
                    font-weight: 600;
                    color: #6c757d;
                    margin-bottom: 15px;
                }

                .maidView li .container .skill ol {
                }

                    .maidView li .container .skill ol li {
                        display: inline-block;
                        vertical-align: middle;
                        width: auto;
                        margin: 0 3.5px;
                        border-radius: 0;
                        border: none;
                        background: none;
                    }

                        .maidView li .container .skill ol li img {
                            display: block;
                        }

            .maidView li .container .btn {
                width: 100%;
                margin-top: 15px;
            }

                .maidView li .container .btn .groupBtn {
                    width: 100%;
                    font-size: 0;
                }

                    .maidView li .container .btn .groupBtn li {
                        display: inline-block;
                        vertical-align: middle;
                        width: calc(50% - 5px);
                        margin: 0 5px 10px 0;
                        border: none;
                    }

                        .maidView li .container .btn .groupBtn li.last {
                            margin: 0 0 10px 5px;
                        }

                        .maidView li .container .btn .groupBtn li .commonBtn {
                            display: block;
                            width: 100%;
                        }
    /*List View*/
    .maidView.list {
        width: 100%;
        font-size: 0;
        display: flex;
        flex-wrap: wrap;
    }

        .maidView.list li {
            width: calc(100% - 2px);
            margin: 0 0 20px 0;
        }

            .maidView.list li .container {
                font-size: 0;
            }

                .maidView.list li .container .detail {
                    width: calc(30% - 15px);
                    display: inline-block;
                    vertical-align: top;
                    margin-right: 15px;
                }

                .maidView.list li .container .experience {
                    width: calc(30% - 15px);
                    display: inline-block;
                    vertical-align: top;
                    border-top: none;
                    margin-top: 0;
                    margin-right: 15px;
                }

                    .maidView.list li .container .experience .content {
                        padding: 0;
                    }

                .maidView.list li .container .skill {
                    width: calc(40% - 167px);
                    display: inline-block;
                    vertical-align: top;
                    border-top: none;
                    margin-top: 0;
                    padding: 0;
                    margin-right: 15px;
                }

                .maidView.list li .container .btn {
                    width: 152px;
                    display: inline-block;
                    vertical-align: top;
                    margin-top: 25px;
                    text-align: right;
                }

                    .maidView.list li .container .btn .groupBtn li {
                        width: 100%;
                        margin: 0 0 10px 0;
                    }

                        .maidView.list li .container .btn .groupBtn li.last {
                            margin: 0 0 10px 0;
                        }

                .maidView.list li .container .checkBoxStyle {
                    top: 0;
                    right: 0;
                }
/*Table View (updated: 31/05/2021)*/
.leadsTable .responsiveTable table input[type="text"] {
    border: 1px solid #e9edf3 !important;
}

.maidsOverview .rightResults .tableView {
    width: 100%;
}

    .maidsOverview .rightResults .tableView .responsiveTable {
        width: calc(100% - 40px);
        padding: 20px;
        overflow-x: auto;
        background: #f5f7fa;
        border-radius: 10px;
        border: 1px solid #e9edf3;
    }

        .maidsOverview .rightResults .tableView .responsiveTable table {
            width: 1500px;
        }

            .maidsOverview .rightResults .tableView .responsiveTable table input[type="text"] {
                border: 1px solid #e9edf3 !important;
            }

    .maidsOverview .rightResults .tableView ol {
    }

        .maidsOverview .rightResults .tableView ol li {
            display: inline-block;
            vertical-align: middle;
            width: auto;
            margin: 0 3.5px;
            border-radius: 0;
            border: none;
            background: none;
        }

            .maidsOverview .rightResults .tableView ol li img {
                display: block;
            }
/**Notification**/
.notifications {
    font-size: 0;
}

.notificationMsg {
    width: calc(100% - 40px); /*max-width:1160px;*/
    height: 750px;
    margin: 0 auto 50px auto;
    font-size: 0;
    background: #f5f7fa;
    border-radius: 10px;
    position: relative;
    border: 1px solid #e9edf3;
    padding: 20px;
}

    .notificationMsg .msgContainer {
        max-height: 735px;
        overflow-y: auto;
    }

    .notificationMsg .notificationLog {
        width: 100%; /*max-height:35vw;*/
        max-height: 600px;
        overflow-y: auto;
        overflow-x: hidden;
        margin-top: 20px;
        margin-bottom: 10px;
    }

    .notificationMsg .date {
        font-size: 16px;
        line-height: 18px;
        color: #495057;
        margin-bottom: 10px;
        font-weight: 600;
    }

.notificationLog .logStatus {
    background: #ffffff;
    border-radius: 10px;
    border: 1px solid #e9edf3;
    width: calc(100% - 40px);
    padding: 10px 20px;
    margin-bottom: 10px;
}

    .notificationLog .logStatus .accordion {
        cursor: pointer;
        width: 100%;
        background-image: url("../images/pg-right.png");
        background-position: right center;
        background-repeat: no-repeat;
        font-size: 0;
        position: relative;
    }

        .notificationLog .logStatus .accordion.active {
            background-image: url("../images/dropdown-arrow.png");
            background-position: right center;
            background-repeat: no-repeat;
        }

        .notificationLog .logStatus .accordion .userPhoto {
            width: 36px;
            height: 36px;
            border-radius: 36px;
            overflow: hidden;
            background: #f5f7fa;
            margin-right: 15px;
            display: inline-block;
            vertical-align: middle;
            border: 2px solid #e9edf3;
        }

            .notificationLog .logStatus .accordion .userPhoto img {
                width: 100%;
                display: block;
            }

            .notificationLog .logStatus .accordion .userPhoto strong {
                font-size: 24px;
                line-height: 24px;
                text-align: center;
                color: #cccccc;
                display: block;
                font-weight: 600;
                padding: 6px 0;
            }

        .notificationLog .logStatus .accordion .logTitle {
            font-size: 14px;
            line-height: 18px;
            color: #6c757d;
            display: inline-block;
            vertical-align: middle;
            width: calc(100% - 198px);
        }

            .notificationLog .logStatus .accordion .logTitle p strong {
                font-weight: 600;
            }

        .notificationLog .logStatus .accordion .logDate {
            display: inline-block;
            vertical-align: middle;
            width: 100px;
            text-align: right;
            font-size: 14px;
            line-height: 18px;
            color: #00aeef; /*padding-right: 30px;*/
        }

    .notificationLog .logStatus .accordionContent {
        border-top: 1px solid #e9edf3;
        padding-top: 15px;
        margin-top: 10px;
        margin-bottom: -8px;
    }

        .notificationLog .logStatus .accordionContent p {
            font-size: 14px;
            line-height: 18px;
            color: #6c757d;
            margin-bottom: 10px;
        }

        .notificationLog .logStatus .accordionContent a {
            text-decoration: none;
            color: #00aeef;
        }

        .notificationLog .logStatus .accordionContent .commonBtn {
            display: inline-block;
            margin-right: 5px;
        }

    .notificationLog .logStatus .notificationStatus {
        vertical-align: middle;
        display: inline-block;
        width: 10px;
        height: 10px;
        border-radius: 10px;
        margin-right: 15px; /*position:absolute;background:#20b799;top:30px;left:30px;*/
    }

        .notificationLog .logStatus .notificationStatus.unread {
            background: #20b799;
        }

        .notificationLog .logStatus .notificationStatus.read {
            background: #ffffff;
        }
/**Receipts**/
.receiptsContent {
    font-size: 0;
}

    .receiptsContent .contents {
        width: 100%;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
    }

        .receiptsContent .contents.receiptsTable {
            margin-bottom: 50px;
        }

        .receiptsContent .contents .innerContainer {
            padding: 20px;
            width: calc(100% - 40px);
            font-size: 0;
        }

        .receiptsContent .contents.insuranceRefundTable {
            margin-bottom: 50px;
        }

.insuranceRefundStatus {
    display: inline-block;
    padding: 6px 0 4px 0;
    color: #ffffff;
    font-size: 11px;
    line-height: 11px;
    font-weight: 700;
    border-radius: 3px;
    text-transform: uppercase;
    text-align: center;
    width: 60px;
}

    .insuranceRefundStatus.pending {
        background: #efb540;
    }

    .insuranceRefundStatus.issued {
        background: #6c757d;
    }
/**Contracts**/
.contractsContent {
    font-size: 0;
}

    .contractsContent .contentCol2 {
        width: calc(50% - 10px);
        margin-right: 10px;
        display: inline-block;
        vertical-align: top;
    }

        .contractsContent .contentCol2.last {
            margin-right: 0;
            margin-left: 10px;
        }

    .contractsContent .contents {
        width: 100%;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
    }

        .contractsContent .contents.contractsTable, .contractsContent .contents.otherServicesTable {
            margin-bottom: 50px;
        }

        .contractsContent .contents .innerContainer {
            padding: 20px;
            width: calc(100% - 40px);
            font-size: 0;
        }

.contractStatus {
    display: inline-block;
    padding: 6px 0 4px 0;
    color: #ffffff;
    font-size: 11px;
    line-height: 11px;
    font-weight: 700;
    border-radius: 3px;
    text-transform: uppercase;
    text-align: center;
    width: 85px;
}

    .contractStatus.contract {
        background: #00aeef;
    }

    .contractStatus.contractNo {
        background: #00aeef;
        width: 55px
    }

    .contractStatus.application {
        background: #2e3192;
    }

    .contractStatus.approval {
        background: #20b799;
    }

    .contractStatus.insurance {
        background: #006970;
    }

    .contractStatus.arrival {
        background: #efb540;
    }

    .contractStatus.medical {
        background: #e97b10;
    }

    .contractStatus.sip {
        background: #7f3f01;
    }

    .contractStatus.tip {
        background: #86c400;
    }

    .contractStatus.eissue {
        background: #af32ff;
    }

    .contractStatus.thumbprint {
        background: #6a00ae;
    }

    .contractStatus.handover {
        background: #ae0093;
    }

    .contractStatus.followup {
        background: #ff00b4;
    }

    .contractStatus.ospayment {
        background: #fa5944;
    }

    .contractStatus.completed {
        background: #6c757d;
    }

.contractsContent .contents .docStatus {
}

    .contractsContent .contents .docStatus:before {
        content: "\A";
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: #efb540;
        display: inline-block;
        margin: 0 5px;
    }

    .contractsContent .contents .docStatus.appeal:before {
        background: #efb540;
    }

    .contractsContent .contents .docStatus.approved:before {
        background: #20b799;
    }

    .contractsContent .contents .docStatus.rejected:before {
        background: #fa5944;
    }

.createContractSteps {
    width: 100%;
    margin: 10px 0 30px 0;
}

    .createContractSteps ul {
        width: 100%;
        font-size: 0;
    }

        .createContractSteps ul li {
            display: inline-block;
            vertical-align: middle;
            background-image: url("../images/step-arrow.png");
            background-position: right center;
            background-repeat: no-repeat;
            padding-right: 20px;
            margin-right: 15px;
            margin-bottom: 10px;
        }

    .createContractSteps.viewSteps ul li {
        cursor: pointer;
    }

    .createContractSteps ul li.active {
        background-image: url("../images/step-arrow-active.png");
    }

    .createContractSteps ul li.step01 {
        width: 125px;
    }

    .createContractSteps ul li.step02 {
        width: 100px;
    }

    .createContractSteps ul li.step03 {
        width: 160px;
        background-image: none;
        padding-right: 0;
        margin-right: 0;
    }

    .createContractSteps ul li span {
        display: inline-block;
        vertical-align: middle;
    }

    .createContractSteps ul li .step {
        width: 35px;
        height: 26px;
        border-radius: 35px;
        background: #e9edf3;
        font-size: 16px;
        line-height: 16px;
        color: #6c757d;
        text-align: center;
        padding-top: 9px;
        margin-right: 10px;
    }

    .createContractSteps ul li.active .step {
        background: #00aeef;
        color: #ffffff;
        font-weight: 600;
    }

    .createContractSteps ul li .text {
        font-size: 14px;
        line-height: 18px;
        color: #6c757d;
        width: calc(100% - 45px);
    }

    .createContractSteps ul li.active .text {
        font-weight: 600;
    }

.serviceFee {
    width: 100%;
    max-width: 800px;
}

    .serviceFee li {
        width: 100%;
        font-size: 0;
        border-bottom: 1px solid #e9edf3;
        margin-bottom: 10px;
        padding-bottom: 10px;
    }

        .serviceFee li:last-child {
            border-bottom: none;
            margin-bottom: 10px;
            padding-bottom: 10px;
        }

        .serviceFee li span {
            display: inline-block;
            vertical-align: middle;
        }

            .serviceFee li span .fieldHeader {
                color: #6c757d;
                font-size: 14px;
                line-height: 18px;
                font-weight: 600;
                margin-bottom: 5px;
                display: none;
            }

        .serviceFee li:nth-child(1) span .fieldHeader {
            display: block;
        }

        .serviceFee li span .field {
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
        }

            .serviceFee li span .field span {
                width: calc(50% - 10px);
            }

        .serviceFee li .serialNo {
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
            width: 30px;
        }

        .serviceFee li:nth-child(1) .serialNo {
            margin-top: 20px;
        }

        .serviceFee li .description {
            margin-right: 10px;
            width: calc(50% - 25px);
        }

        .serviceFee li .amount {
            margin-left: 10px;
            width: calc(50% - 25px);
        }

        .serviceFee li p {
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
        }

.totalServiceFee li {
    border-top: 1px solid #e9edf3;
    margin-top: 20px;
    padding-top: 10px;
}

.otherServiceStatus {
    display: inline-block;
    padding: 6px 0 4px 0;
    color: #ffffff;
    font-size: 11px;
    line-height: 11px;
    font-weight: 700;
    border-radius: 3px;
    text-transform: uppercase;
    text-align: center;
    width: 85px;
}

    .otherServiceStatus.inprogress {
        background: #efb540;
    }

    .otherServiceStatus.completed {
        background: #6c757d;
    }

.serviceFeeRefund ul {
    width: 100%;
}

    .serviceFeeRefund ul li {
        width: 100%;
        font-size: 0;
        border-bottom: 1px solid #e9edf3;
        margin-bottom: 10px;
        padding-bottom: 10px;
    }

        .serviceFeeRefund ul li:last-child {
            border-bottom: none;
            margin-bottom: 10px;
            padding-bottom: 10px;
        }

        .serviceFeeRefund ul li span {
            display: inline-block;
            vertical-align: top;
        }

            .serviceFeeRefund ul li span .fieldHeader {
                color: #6c757d;
                font-size: 14px;
                line-height: 18px;
                font-weight: 600;
                margin-bottom: 5px;
                display: none;
            }

        .serviceFeeRefund ul li:nth-child(1) span .fieldHeader {
            display: block;
        }

        .serviceFeeRefund ul li span .field {
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
        }

            .serviceFeeRefund ul li span .field span {
                width: calc(50% - 10px);
            }

        .serviceFeeRefund ul li .serialNo {
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
            width: 30px;
            margin-top: 15px
        }

        .serviceFeeRefund ul li:nth-child(1) .serialNo {
            margin-top: 35px;
        }

        .serviceFeeRefund ul li .description {
            width: 420px;
        }

            .serviceFeeRefund ul li .description .field {
                margin-top: 15px;
            }

        .serviceFeeRefund ul li .amountInvoice {
            margin-left: 10px;
            width: calc(25% - 122.5px);
        }

            .serviceFeeRefund ul li .amountInvoice .field {
                margin-top: 15px;
            }

        .serviceFeeRefund ul li .amountReceived {
            margin-left: 10px;
            width: calc(25% - 122.5px);
        }

            .serviceFeeRefund ul li .amountReceived .field {
                margin-top: 15px;
            }

        .serviceFeeRefund ul li .amountBalance {
            margin-left: 10px;
            width: calc(25% - 122.5px);
        }

            .serviceFeeRefund ul li .amountBalance .field {
                margin-top: 15px;
            }

        .serviceFeeRefund ul li .amountRefund {
            margin-left: 10px;
            width: calc(25% - 122.5px);
        }

.serviceFeeRefund li p {
    color: #6c757d;
    font-size: 14px;
    line-height: 18px;
}

.serviceFeeRefund .totalServiceFeeRefund li:nth-child(1) span .fieldHeader {
    display: none;
    font-weight: 400;
}

.serviceFeeRefund .totalServiceFeeRefund li {
    border-top: 1px solid #e9edf3;
    padding-top: 10px;
}
/**UPDATED ON 12/07/21**/
/**Users**/
.USERS .searchFilter {
    max-width: 1070px;
    margin-bottom: 10px;
}

    .USERS .searchFilter span {
        width: calc(100% - 702px);
    }

    .USERS .searchFilter .selectField {
        width: 200px;
    }

    .USERS .searchFilter .btn {
        width: 82px;
        margin-right: 0;
    }

.usersContent {
    font-size: 0;
}

    .usersContent .contents {
        width: 100%;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
    }

        .usersContent .contents.usersTable {
            margin-bottom: 50px;
        }

        .usersContent .contents .innerContainer {
            padding: 20px;
            width: calc(100% - 40px);
            font-size: 0;
        }

.usersStatus {
    display: inline-block;
    padding: 6px 0 4px 0;
    color: #ffffff;
    font-size: 11px;
    line-height: 11px;
    font-weight: 700;
    border-radius: 3px;
    text-transform: uppercase;
    text-align: center;
    width: 65px;
}

    .usersStatus.active {
        background: #20b799;
    }

    .usersStatus.inactive {
        background: #fa5944;
    }
/**Transport**/
.TRANSPORT .searchFilter {
    max-width: 1200px;
    margin-bottom: 10px;
}

    .TRANSPORT .searchFilter span {
        width: calc(100% - 862px);
    }

    .TRANSPORT .searchFilter .selectField {
        width: 200px;
    }

    .TRANSPORT .searchFilter .btn {
        width: 82px;
        margin-right: 0;
    }

.transportContent {
    font-size: 0;
}

    .transportContent .contents {
        width: 100%;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
    }

        .transportContent .contents.transportTable {
            margin-bottom: 50px;
        }

        .transportContent .contents .innerContainer {
            padding: 20px;
            width: calc(100% - 40px);
            font-size: 0;
        }

.transportStatus {
    display: inline-block;
    padding: 6px 0 4px 0;
    color: #ffffff;
    font-size: 11px;
    line-height: 11px;
    font-weight: 700;
    border-radius: 3px;
    text-transform: uppercase;
    text-align: center;
    width: 75px;
}

    .transportStatus.completed {
        background: #20b799;
    }

    .transportStatus.pending {
        background: #efb540;
    }

    .transportStatus.inprogress {
        background: #00aeef;
    }

.imgPlaceholder {
    width: 100%;
    max-width: 280px;
}

    .imgPlaceholder img {
        width: 100%;
        display: block;
    }

.transport-table {
    position: relative;
}

    .transport-table .responsiveTable {
        overflow-y: auto;
    }

        .transport-table .responsiveTable table {
            width: 2000px;
        }

            .transport-table .responsiveTable table tbody tr th {
                color: #6c757d;
                font-size: 14px;
                line-height: 18px;
                font-weight: 400;
                text-align: left;
                padding: 6px 10px 6px 10px;
                vertical-align: middle;
            }

                .transport-table .responsiveTable table tbody tr th a {
                    font-size: 14px;
                    line-height: 18px;
                    color: #00aeef;
                    text-decoration: none;
                }

.searchFilter .date {
    display: inline-block;
    vertical-align: middle;
    width: 380px;
    text-align: center;
}

    .searchFilter .date ul li {
        display: inline-block;
        vertical-align: middle;
        font-size: 14px;
        line-height: 18px;
        color: #212330;
        width: calc(50% - 12px);
    }

        .searchFilter .date ul li:nth-child(2) {
            width: 24px;
        }
/**UPDATED ON 22/07/21**/
/**Hostel**/
.TRANSPORT .hostelOverview .searchFilter {
    max-width: auto;
    width: calc(100% + 5px);
    margin-bottom: 10px;
}

    .TRANSPORT .hostelOverview .searchFilter span {
        width: calc(50% - 5px);
        margin-bottom: 5px;
    }

    .TRANSPORT .hostelOverview .searchFilter .date {
        display: inline-block;
        vertical-align: middle;
        width: calc(50% - 5px);
        text-align: center;
    }

    .TRANSPORT .hostelOverview .searchFilter .selectField {
        width: calc(33.3333% - 5px);
    }

    .TRANSPORT .hostelOverview .searchFilter .btn {
        width: 82px;
        margin-right: 0;
    }

.hostelContent {
    width: 100%;
}

.hostelDash {
    width: calc(100% + 20px);
    font-size: 0
}

    .hostelDash .dashCol4 {
        width: calc(25% - 22px);
        display: inline-block;
        vertical-align: top;
        margin-right: 20px;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
        margin-bottom: 20px;
        cursor: pointer;
    }

        .hostelDash .dashCol4.bedok {
            background: rgba(239,181,64,0.1);
            border: 1px solid #efb540;
        }

        .hostelDash .dashCol4.tampang {
            background: rgba(0,174,239,0.1);
            border: 1px solid #00aeef;
        }

        .hostelDash .dashCol4.tiongbahru {
            background: rgba(32,183,153,0.1);
            border: 1px solid #20b799;
        }

        .hostelDash .dashCol4.racecourse {
            background: rgba(255,0,180,0.1);
            border: 1px solid #ff00b4;
        }

        .hostelDash .dashCol4 .icon {
            position: absolute;
            top: 20px;
            right: 20px;
        }

        .hostelDash .dashCol4 h2 {
            font-size: 14px;
            line-height: 18px;
            margin: 0 0 20px 0;
            color: #6c757d;
            font-weight: 600;
            text-transform: uppercase;
        }

        .hostelDash .dashCol4.bedok h2 {
            color: #efb540;
        }

        .hostelDash .dashCol4.tampang h2 {
            color: #00aeef;
        }

        .hostelDash .dashCol4.tiongbahru h2 {
            color: #20b799;
        }

        .hostelDash .dashCol4.racecourse h2 {
            color: #ff00b4;
        }

        .hostelDash .dashCol4 .status {
            font-size: 25px;
            line-height: 25px;
            margin-bottom: 20px;
            color: #495057;
            font-weight: 600;
        }

            .hostelDash .dashCol4 .status.available {
                color: #006970;
            }

            .hostelDash .dashCol4 .status.unavailable {
                color: #fa5944;
            }

            .hostelDash .dashCol4 .status span {
                font-size: 14px;
                line-height: 18px;
                font-weight: 400 !important;
            }

        .hostelDash .dashCol4 .total {
            font-size: 14px;
            line-height: 18px;
            color: #495057;
        }

.hostelContent .innerContainer {
    padding: 20px;
    width: calc(100% - 40px);
    font-size: 0;
}

.hostelOverview {
    width: calc(100% + 20px);
    display: flex;
    flex-wrap: wrap;
    font-size: 0;
}

    .hostelOverview .hostelLeft {
        width: calc(75% - 22px);
        display: inline-block;
        vertical-align: top;
        ;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
        margin-bottom: 50px;
        margin-right: 20px;
    }

    .hostelOverview .hostelRgt {
        display: inline-block;
        vertical-align: top;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
        width: calc(25% - 22px);
        margin-bottom: 50px;
        margin-right: 20px;
    }

    .hostelOverview .contents {
        width: 100%;
        padding: 0;
        position: relative;
    }

.hostelLocation {
    display: inline-block;
    padding: 6px 0 4px 0;
    color: #6c757d;
    font-size: 11px;
    line-height: 11px;
    font-weight: 700;
    border-radius: 3px;
    text-transform: uppercase;
    text-align: center;
    width: 85px;
}

.hostelRgt .hostelLocation {
    width: auto;
    padding: 6px 5px 4px 5px;
}

.hostelLocation.bedok {
    background: rgba(239,181,64,0.1);
    border: 1px solid #efb540;
}

.hostelLocation.tampang {
    background: rgba(0,174,239,0.1);
    border: 1px solid #00aeef;
}

.hostelLocation.tiongbahru {
    background: rgba(32,183,153,0.1);
    border: 1px solid #20b799;
}

.hostelLocation.racecourse {
    background: rgba(255,0,180,0.1);
    border: 1px solid #ff00b4;
}

.hostelStatus {
    display: inline-block;
    padding: 6px 0 4px 0;
    color: #ffffff;
    font-size: 11px;
    line-height: 11px;
    font-weight: 700;
    border-radius: 3px;
    text-transform: uppercase;
    text-align: center;
    width: 75px;
}

    .hostelStatus.booked {
        background: #efb540;
    }

    .hostelStatus.checkin {
        background: #00aeef;
    }

    .hostelStatus.checkout {
        background: #20b799;
    }

    .hostelStatus.cancelled {
        background: #6c757d;
    }

.hostelRgt ul {
    width: 100%;
    max-height: 810px;
    overflow-y: auto;
    overflow-x: hidden;
}

    .hostelRgt ul li {
        width: calc(100% - 2px);
        font-size: 0;
        margin-bottom: 10px;
        border-radius: 10px;
        border: 1px solid #e9edf3;
        background: #ffffff;
    }

        .hostelRgt ul li a {
            text-decoration: none;
        }

        .hostelRgt ul li .container {
            width: calc(100% - 54px);
            padding: 10px;
            background-image: url("../images/appointment-icon.png");
            background-position: 10px 10px;
            background-repeat: no-repeat;
            padding-left: 44px;
        }

        .hostelRgt ul li .title {
            width: 100%;
            display: inline-block;
            vertical-align: middle;
            margin-bottom: 5px;
        }

            .hostelRgt ul li .title p {
                color: #6c757d;
                font-size: 14px;
                line-height: 18px;
            }

                .hostelRgt ul li .title p strong {
                    color: #495057;
                    font-size: 16px;
                    line-height: 18px;
                    font-weight: 600;
                    display: block;
                    margin-bottom: 2.5px;
                }

        .hostelRgt ul li .date {
            width: 100%;
            display: inline-block;
            vertical-align: middle;
            text-align: left;
            margin-bottom: 5px;
        }

            .hostelRgt ul li .date p {
                color: #6c757d;
                font-size: 14px;
                line-height: 18px;
            }

                .hostelRgt ul li .date p strong {
                    font-weight: 400;
                    color: #00aeef;
                    display: block;
                }

.hostelRgt .submissionBtn .submitBtn {
    margin-left: 0;
    margin-right: 5px;
    margin-bottom: 5px;
}

.hostelContent .formPage .contents, .hostelContent .contents.hostelTable {
    background: #f5f7fa;
    border-radius: 10px;
    position: relative;
    border: 1px solid #e9edf3;
}

.hostelContent .contents.hostelTable {
    margin-bottom: 20px;
}

.responsiveTable table tbody .total .title {
    text-align: right;
}

.transportRequire {
    width: 100%;
    display: none;
}

#OVERVIEW_TABLE::before {
    content: '';
    display: block;
    height: 140px;
    margin-top: -140px;
    visibility: hidden;
}

.serviceType {
    display: inline-block;
    padding: 6px 3px 4px 3px;
    color: #6c757d;
    font-size: 11px;
    line-height: 11px;
    font-weight: 700;
    border-radius: 3px;
    text-transform: uppercase;
    text-align: left;
    width: auto;
    background: rgba(0,174,239,0.1);
    border: 1px solid #00aeef;
    margin: 2.5px 0;
}


.leadDash {
    width: calc(100% + 20px);
    font-size: 0
}

    .leadDash .dashCol4 {
        width: calc(33.3333% - 22px);
        display: inline-block;
        vertical-align: top;
        margin-right: 20px;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
        margin-bottom: 20px;
        cursor: pointer;
    }

        .leadDash .dashCol4 .innerContainer {
            padding: 20px;
            width: calc(100% - 40px);
            font-size: 0;
            position: relative;
        }

        .leadDash .dashCol4 .icon {
            position: absolute;
            top: 20px;
            right: 20px;
        }

        .leadDash .dashCol4 h2 {
            font-size: 14px;
            line-height: 18px;
            margin: 0 0 20px 0;
            color: #6c757d;
            font-weight: 600;
            text-transform: uppercase;
        }

        .leadDash .dashCol4 .amount {
            font-size: 25px;
            line-height: 25px;
            margin-bottom: 20px;
            color: #495057;
            font-weight: 600;
        }

        .leadDash .dashCol4 .status {
            font-size: 0;
        }

            .leadDash .dashCol4 .status span {
                font-size: 14px;
                line-height: 18px;
                color: #6c757d;
                display: inline-block;
                vertical-align: middle;
            }

            .leadDash .dashCol4 .status .percentage {
                margin-right: 5px;
                display: inline-block;
                padding: 6px 7px 4px 7px;
                color: #ffffff;
                font-size: 11px;
                line-height: 11px;
                font-weight: 700;
                border-radius: 3px;
            }

            .leadDash .dashCol4 .status .positive {
                background: #20b799;
            }

            .leadDash .dashCol4 .status .negative {
                background: #fa5944;
            }

            .leadDash .dashCol4 .status .zero {
                background: #efb540;
            }

.contractDash {
    width: calc(100% + 20px);
    font-size: 0
}

    .contractDash .dashCol {
        width: calc(16.6667% - 22px);
        display: inline-block;
        vertical-align: top;
        margin-right: 20px;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
        margin-bottom: 20px;
        cursor: pointer;
    }

        .contractDash .dashCol .innerContainer {
            padding: 20px;
            width: calc(100% - 40px);
            font-size: 0;
            position: relative;
        }

        .contractDash .dashCol h2 {
            font-size: 14px;
            line-height: 18px;
            margin: 0 0 20px 0;
            color: #6c757d;
            font-weight: 600;
            text-transform: uppercase;
        }

        .contractDash .dashCol .amount {
            font-size: 25px;
            line-height: 25px;
            color: #495057;
            font-weight: 600;
        }

/**UPDATED ON 18/08/21**/
/**HRM**/
.HR .leavesTable .searchFilter {
    max-width: 1200px;
    margin-bottom: 10px;
}

    .HR .leavesTable .searchFilter span {
        width: calc(100% - 862px);
    }

    .HR .leavesTable .searchFilter .selectField {
        width: 200px;
    }

    .HR .leavesTable .searchFilter .btn {
        width: 82px;
        margin-right: 0;
    }

.HR .claimsTable .searchFilter {
    max-width: 1200px;
    margin-bottom: 10px;
}

    .HR .claimsTable .searchFilter span {
        width: calc(100% - 862px);
    }

    .HR .claimsTable .searchFilter .selectField {
        width: 200px;
    }

    .HR .claimsTable .searchFilter .btn {
        width: 82px;
        margin-right: 0;
    }

.HR .pollsTable .searchFilter {
    max-width: 1200px;
    margin-bottom: 10px;
}

    .HR .pollsTable .searchFilter span {
        width: calc(100% - 862px);
    }

    .HR .pollsTable .searchFilter .selectField {
        width: 200px;
    }

    .HR .pollsTable .searchFilter .btn {
        width: 82px;
        margin-right: 0;
    }

.hrmContent {
    font-size: 0;
}

    .hrmContent .contents {
        width: 100%;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
    }

        .hrmContent .contents.leavesTable, .hrmContent .contents.claimsTable {
            margin-bottom: 50px;
        }

        .hrmContent .contents .innerContainer {
            padding: 20px;
            width: calc(100% - 40px);
            font-size: 0;
        }
.hrmStatus {
    display: inline-block;
    padding: 6px 0 4px 0;
    color: #ffffff;
    font-size: 11px;
    line-height: 11px;
    font-weight: 700;
    border-radius: 3px;
    text-transform: uppercase;
    text-align: center;
    width: 65px;
}

    .hrmStatus.approved, .hrmStatus.active, .hrmStatus.awarded {
        background: #20b799;
    }

    .hrmStatus.pending {
        background: #efb540;
    }

    .hrmStatus.rejected, .hrmStatus.inactive, .hrmStatus.redeemed {
        background: #fa5944;
    }
.responsiveTable table tbody tr:first-child td {
    border-top: 1px solid #aaaaaa;
}
.pollResult{width:100%;}
.pollResult li{width:100%;border-bottom:1px solid #e9edf3;margin-bottom:20px;padding-bottom:20px;}
.pollResult li:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0;}
.pollResult .qna{width:100%;max-width:600px;}
.pollResult .qna h3{color:#00aeef;font-size:14px;line-height:18px;font-weight:400;margin-bottom:5px;}
.pollResult .qna p{color:#6c757d;font-size:14px;line-height:18px;}
.pollResult .qna p strong{font-weight:700;}
.pollResult .qna .result{width:100%;margin-top:20px;font-size:0;}
.pollResult .qna .result .left{width:170px;margin-right:40px;display:inline-block;vertical-align:middle;}
.pollResult .qna .result .left imh{display:block;width:100%;}
.pollResult .qna .result .rgt{display:inline-block;vertical-align:middle;width:calc(100% - 210px);}
.pollResult .qna .result .rgt ul{width:100%;}
.pollResult .qna .result .rgt ul li{width:100%;font-size:0;border-bottom:0;margin-bottom:7.5px;padding-bottom:7.5px;}
.pollResult .qna .result .rgt ul li:last-child{margin-bottom:0;padding-bottom:0;}
.pollResult .qna .result .rgt span{display:inline-block;vertical-align:top;font-size:14px;line-height:18px;color:#6c757d;width:calc(100% - 30px);}
.pollResult .qna .result .rgt .colourCode{width:15px;height:15px;border-radius:5px;margin-right:15px;}
.pollResult .qna .result .rgt .colourCode.A1{background:#2e3192;}
.pollResult .qna .result .rgt .colourCode.A2{background:#00aeef;}
.pollResult .qna .result .rgt .colourCode.A3{background:#6c757d;}
.pollResult .qna .result .rgt .colourCode.A4{background:#d4d7dc;}
.ansQues{width:100%;}
.ansQues li{width:100%;border-bottom:1px solid #e9edf3;margin-bottom:20px;padding-bottom:20px;}
.ansQues li:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0;}
.ansQues .qna{width:100%;}
.ansQues .qna h3{color:#00aeef;font-size:14px;line-height:18px;font-weight:400;margin-bottom:5px;}
.ansQues .qna p{color:#6c757d;font-size:14px;line-height:18px;}
.ansQues .qna p strong{font-weight:700;}
.ansSelection{width:100%;margin-top:20px;}
/*Input radio*/
$white: #fff;
$green: #007e90;
.ansSelection input[type="radio"]{display: none;}
.ansSelection input[type="radio"]:checked + .box{background-color:#00aeef;}
.ansSelection input[type="radio"]:checked + .box span{color:#ffffff;}
.ansSelection input[type="radio"]:not(:checked) + .box{background-color:#ffffff;}
.ansSelection input[type="radio"]:not(:checked) + .box span{color:#6c757d;}
.ansSelection .box{width:calc(100% - 22px);border:1px solid #e9edf3;padding:10px;border-radius:5px;cursor:pointer;}
.ansSelection .box span{font-size:14px;line-height:18px;}
.HR .reward .searchFilter{max-width:1200px;margin-bottom:30px;}
.HR .reward .searchFilter span{width:calc(100% - 862px);}
.HR .reward .searchFilter .selectField{width:200px;}
.HR .reward .searchFilter .btn{width:82px;margin-right:0;}
.HR .pointsTable .searchFilter{max-width:1200px;margin-bottom:10px;}
.HR .pointsTable .searchFilter span{width:calc(100% - 862px);}
.HR .pointsTable .searchFilter .selectField{width:200px;}
.HR .pointsTable .searchFilter .btn{width:82px;margin-right:0;}
.hrmContent .contents.reward, .hrmContent .contents.pointsTable{margin-bottom:50px;}
.rewardDash{width:calc(100% + 20px);font-size:0;}
.rewardDash .dashCol{width:calc(25% - 22px);display:inline-block;vertical-align:top;margin-right:20px;background:#f5f7fa;border-radius:10px;padding:0;position:relative;border:1px solid #e9edf3;margin-bottom:20px;cursor:pointer;} 
.rewardDash .dashCol .innerContainer{padding:20px;width:calc(100% - 40px);font-size:0;position:relative;}
.rewardDash .dashCol .icon{position:absolute;top:20px;right:20px;}
.rewardDash .dashCol h2{font-size:14px;line-height:18px;margin:0 0 20px 0;color:#6c757d;font-weight:600;text-transform:uppercase;}
.rewardDash .dashCol .amount{font-size:25px;line-height:25px;color:#495057;font-weight:600;margin:0 0 20px 0;}
.rewardDash .dashCol a{display:block;color:#00aeef !important;text-decoration:none;font-size:14px;line-height:14px;}
.rewardsContainer{width:100%;}
.rewardsContainer ul{width:100%;display:flex;flex-wrap:wrap;width:calc(100% + 20px);}
.rewardsContainer ul li {width:calc(16.6666% - 22px);margin:0 20px 20px 0;display:inline-block;vertical-align:top;border-radius:10px;border:1px solid #e9edf3;background:#ffffff;position:relative;}
.rewardsContainer ul li .container{width:calc(100% - 20px);padding:10px;height:100%;}
.rewardsContainer ul li .imgThumb{width:100%;margin-bottom:15px;position:relative;}
.rewardsContainer ul li .imgThumb img{width:100%;border-radius:10px;display:block;}
.rewardsContainer ul li .imgThumb .categoryType{position:absolute;top:10px;left:10px;padding:5px;font-size:11px;line-height:11px;color:#ffffff;font-weight:700;border-radius:5px;text-transform:uppercase;}
.categoryType.green{background:#20b799;}
.categoryType.yellow{background:#efb540;}
.categoryType.red{background:#fa5944;}
.categoryType.blue{background:#00aeef;}
.rewardsContainer ul li h3{font-size:16px;line-height:18px;color:#495057;margin-bottom:10px;}
.rewardsContainer ul li .points{font-size:14px;line-height:18px;color:#6c757d;padding-bottom:50px;}
.rewardsContainer ul li .points strong{color:#00aeef;font-size:16px;line-height:18px;}
.rewardsContainer ul li .redeemBtn{background:#00aeef;color:#ffffff;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:calc(100% - 40px);position:absolute;bottom:30px;left:0;right:0;margin:0 auto;}
.responsiveTable .plus{color:#20b799;}
.responsiveTable .minus{color:#fa5944;}
.question_answer li:nth-child(1) .question {
  
    padding-top: 51px;
}
.responsiveTable .minus{color:#fa5944;}


/**Updates (21/09/21)**/
.createNewMaid .centreInfo {
    display: block;
    width: calc(100% - 2px);
    background: #f5f7fa;
    border-radius: 10px;
    padding: 0;
    position: relative;
    border: 1px solid #e9edf3;
    margin-bottom: 20px;
}


.RECEIPTS .searchFilter {
    max-width: 1000px !important;
}

    .RECEIPTS .searchFilter span {
        width: calc(100% - 720px);
    }

    .RECEIPTS .searchFilter .date {
        width: 423px;
    }

.serviceFeeRefund ul li {
    margin-bottom: 5px;
    padding-bottom: 5px;
}

    .serviceFeeRefund ul li:last-child {
        margin-bottom: 0;
        padding-bottom: 5px;
    }

    .serviceFeeRefund ul li span {
        vertical-align: middle;
    }

    .serviceFeeRefund ul li:first-child span {
        vertical-align: top !important;
    }

    .serviceFeeRefund ul li span .fieldHeader {
        color: #6c757d;
        font-size: 14px;
        line-height: 18px;
        font-weight: 600;
        margin-bottom: 5px;
        display: none;
    }

    .serviceFeeRefund ul li .serialNo {
        margin-top: 0;
    }

    .serviceFeeRefund ul li .description .field {
        margin-top: 0;
    }

    .serviceFeeRefund ul li .amountInvoice .field {
        margin-top: 0;
    }

    .serviceFeeRefund ul li .amountReceived .field {
        margin-top: 0;
    }

    .serviceFeeRefund ul li .amountBalance .field {
        margin-top: 0;
    }

    .serviceFeeRefund ul li:first-child .serialNo {
        margin-top: 34px;
    }

    .serviceFeeRefund ul li:first-child .description .field {
        margin-top: 15px;
    }

    .serviceFeeRefund ul li:first-child .amountInvoice .field {
        margin-top: 15px;
    }

    .serviceFeeRefund ul li:first-child .amountReceived .field {
        margin-top: 15px;
    }

    .serviceFeeRefund ul li:first-child .amountBalance .field {
        margin-top: 15px;
    }

.serviceFeeRefund .totalServiceFeeRefund li:first-child .serialNo {
    margin-top: 0;
}

.serviceFeeRefund .totalServiceFeeRefund li:first-child .description .field {
    margin-top: 0;
}

.serviceFeeRefund .totalServiceFeeRefund li:first-child .amountInvoice .field {
    margin-top: 0;
}

.serviceFeeRefund .totalServiceFeeRefund li:first-child .amountReceived .field {
    margin-top: 0;
}

.serviceFeeRefund .totalServiceFeeRefund li:first-child .amountBalance .field {
    margin-top: 0;
}

.paymentSummary ul li .amountInvoice {
    width: calc(33.3333% - 160px);
}

.paymentSummary ul li .amountReceived {
    width: calc(33.3333% - 160px);
}

.paymentSummary ul li .amountBalance {
    width: calc(33.3333% - 160px);
}

.paymentSummary ul li .description .field {
    margin: 5px 0;
}

.paymentSummary ul li .amountInvoice .field {
    margin: 5px 0;
}

.paymentSummary ul li .amountReceived .field {
    margin: 5px 0;
}

.paymentSummary ul li .amountBalance .field {
    margin: 5px 0;
}

.userPhoto {
    width: 100px;
}

    .userPhoto img {
        width: 100%;
        display: block;
        border-radius: 100%;
    }

.payroll-table {
    position: relative;
}

.payroll {
    display: inline-block;
    padding: 6px 0 4px 0;
    color: #ffffff;
    font-size: 11px;
    line-height: 11px;
    font-weight: 700;
    border-radius: 3px;
    text-transform: uppercase;
    text-align: center;
    width: 65px;
}

    .payroll.pending {
        background: #efb540;
    }

    .payroll.paid {
        background: #20b799;
    }

.payroll-table .responsiveTable {
    overflow-y: auto;
}

    .payroll-table .responsiveTable table {
        width: 2000px;
    }
.HR .payrollSummary .searchFilter {
    max-width: 1200px;
    margin-bottom: 10px;
}

    .HR .payrollSummary .searchFilter span {
        width: calc(100% - 862px);
    }

    .HR .payrollSummary .searchFilter .selectField {
        width: 200px;
    }

.HR .cpfSummary .searchFilter {
    max-width: 1400px;
    margin-bottom: 10px;
}

    .HR .cpfSummary .searchFilter span {
        width: calc(100% - 1062px);
    }

    .HR .cpfSummary .searchFilter .selectField {
        width: 200px;
    }

.HR .commissionSummary .searchFilter {
    max-width: 1200px;
    margin-bottom: 10px;
}

    .HR .commissionSummary .searchFilter span {
        width: calc(100% - 862px);
    }

    .HR .commissionSummary .searchFilter .selectField {
        width: 200px;
    }

.hrmContent .contents.payrollSummary, .hrmContent .contents.cpfSummary, .hrmContent .contents.commissionSummary {
    margin-bottom: 50px;
}

.customersContent {
    font-size: 0;
}

    .customersContent .contents {
        width: 100%;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
    }

        .customersContent .contents.customersTable {
            margin-bottom: 50px;
        }

        .customersContent .contents .innerContainer {
            padding: 20px;
            width: calc(100% - 40px);
            font-size: 0;
        }

.CUSTOMERVERIFICATION .mainContents {
    padding-top: 80px;
}

.signwrapper {
    resize: none;
    width: 100%;
    margin: 0 auto;
    height: 150px;
    border: 1px solid #d7d7d7;
    overflow: hidden;
    background: #ffffff;
}

.SUPPLIER .searchFilter {
    max-width: 660px;
    margin-bottom: 10px;
}

    .SUPPLIER .searchFilter span {
        width: calc(100% - 297px);
    }

    .SUPPLIER .searchFilter .selectField {
        width: 200px;
    }

    .SUPPLIER .searchFilter .btn {
        width: 82px;
        margin-right: 0;
    }

.supplierContent {
    font-size: 0;
}

    .supplierContent .contents {
        width: 100%;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
    }

        .supplierContent .contents.supplierTable {
            margin-bottom: 50px;
        }

        .supplierContent .contents .innerContainer {
            padding: 20px;
            width: calc(100% - 40px);
            font-size: 0;
        }

/**UPDATE:12/01/2022**/
.maidDetail .maidContact {
    border-bottom: none;
    margin-bottom: 10px;
    padding-bottom: 5px;
}

    .maidDetail .maidContact.jobInfo {
        border-bottom: 1px solid #e9edf3;
        margin-bottom: 20px;
    }

.actionContent .contractDocs ol li strong {
    font-weight: 600;
}

.actionContent .contractDocs .docStatus {
    text-indent: 0;
    padding-left: 20px;
    position: relative;
}

    .actionContent .contractDocs .docStatus:before {
        content: "\A";
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: #efb540;
        left: 0;
        top: 4px;
        position: absolute;
    }
.contractStatus.contractNo {
    background: #00aeef;
    width: 55px
}
    .actionContent .contractDocs .docStatus.pending:before {
        background: #efb540;
    }

    .actionContent .contractDocs .docStatus.complete:before {
        background: #20b799;
    }

    .actionContent .contractDocs .docStatus.new:before {
        background: #e9edf3;
    }

.notificationLog .logStatus.cancelContract {
    background: rgba(255,0,180,0.1);
    border: 1px solid #ff00b4;
}

.notificationLog .logStatus.noDetail .accordion {
    cursor: default;
    background-image: none !important;
}

.notificationLog .logStatus.noDetail .accordionContent {
    display: none !important;
}
/**CMS Portal**/
.cmsContent {
    font-size: 0;
}

    .cmsContent .contents {
        width: 100%;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
    }

        .cmsContent .contents.cmsTable {
            margin-bottom: 50px;
        }

        .cmsContent .contents .innerContainer {
            padding: 20px;
            width: calc(100% - 40px);
            font-size: 0;
        }
/**UPDATE:12/01/2022**/
.maidDetail .maidContact {
    border-bottom: none;
    margin-bottom: 10px;
    padding-bottom: 5px;
}

    .maidDetail .maidContact.jobInfo {
        border-bottom: 1px solid #e9edf3;
        margin-bottom: 20px;
    }

.actionContent .contractDocs ol li strong {
    font-weight: 600;
}

.actionContent .contractDocs .docStatus {
    text-indent: 0;
    padding-left: 20px;
    position: relative;
}

    .actionContent .contractDocs .docStatus:before {
        content: "";
        background: url("../images/incomplete.png");
        background-size: 12px 12px;
        height: 12px;
        width: 12px;
        left: 0;
        top: 0;
        position: absolute;
    }

    .actionContent .contractDocs .docStatus.complete:before {
        background: url("../images/completed.png");
    }

.notificationLog .logStatus.cancelContract {
    background: rgba(255,0,180,0.1);
    border: 1px solid #ff00b4;
}

.notificationLog .logStatus.noDetail .accordion {
    cursor: default;
    background-image: none !important;
}

.notificationLog .logStatus.noDetail .accordionContent {
    display: none !important;
}

.btnCol2 {
    margin-bottom: 20px;
}

    .btnCol2.tabBtn {
        border-bottom: 1px solid #e9edf3;
    }

    .btnCol2 span {
        display: inline-block;
        vertical-align: top;
        margin-right: 10px;
    }

    .btnCol2.tabBtn .commonBtn {
        font-size: 18px;
        line-height: 18px;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
        background: rgba(0,174,239,0);
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
    }

        .btnCol2.tabBtn .commonBtn:hover, .btnCol2.tabBtn .commonBtn.active {
            background: rgba(0,174,239,1.0);
            color: #ffffff;
            font-weight: 600;
        }

    .btnCol2.floatRgt {
        text-align: right;
    }

        .btnCol2.floatRgt span {
            margin-right: 0;
            margin-left: 10px;
        }

.sendAction {
    width: calc(100% - 40px);
    padding: 20px;
    background: #f5f7fa;
    border-radius: 10px;
    position: relative;
    border: 1px solid #e9edf3;
    margin-bottom: 15px;
    font-size: 0;
}

    .sendAction ol {
        width: 100%;
    }

        .sendAction ol li {
            margin-bottom: 10px;
        }

            .sendAction ol li:last-child {
                margin-bottom: 0;
            }

            .sendAction ol li .docStatus {
                text-indent: 0;
                padding-left: 20px;
                position: relative;
                font-size: 14px;
                line-height: 18px;
                font-weight: 600;
                color: #6c757d;
            }

                .sendAction ol li .docStatus:before {
                    content: "";
                    background: url("../images/incomplete.png");
                    background-size: 12px 12px;
                    height: 12px;
                    width: 12px;
                    left: 0;
                    top: 0;
                    position: absolute;
                }

                .sendAction ol li .docStatus.complete:before {
                    background: url("../images/completed.png");
                }

.responsiveTable table thead tr th .sorting {
    color: #00aeef;
    text-decoration: none;
}

.CUSTOMERVERIFICATION .mainContents p {
    font-size: 14px;
    line-height: 18px;
    color: #6c757d;
    margin-bottom: 15px;
}

    .CUSTOMERVERIFICATION .mainContents p strong {
        font-weight: 600;
    }

.responsiveTable table tr .center {
    text-align: center;
}
/**CMS Portal**/
.cmsContent {
    font-size: 0;
}

    .cmsContent .contents {
        width: 100%;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
    }

        .cmsContent .contents.cmsTable {
            margin-bottom: 50px;
        }

        .cmsContent .contents .innerContainer {
            padding: 20px;
            width: calc(100% - 40px);
            font-size: 0;
        }

.supplierTable .responsiveTable {
    overflow-x: auto;
}

    .supplierTable .responsiveTable table {
        width: 2500px;
    }


.serviceFeeRefund ul li .amountInvoice {
    margin-left: 10px;
    width: calc(20% - 100px);
}

.serviceFeeRefund ul li .amountReceived {
    margin-left: 10px;
    width: calc(20% - 100px);
}

.serviceFeeRefund ul li .amountBalance {
    margin-left: 10px;
    width: calc(20% - 100px);
}

.serviceFeeRefund ul li .amountRefund {
    margin-left: 10px;
    width: calc(20% - 100px);
}

.serviceFeeRefund ul li .amountRefunded {
    margin-left: 10px;
    width: calc(20% - 100px);
}

.serviceFeeRefund ul li:first-child .amountRefunded .field {
    margin-top: 15px;
}

.serviceFeeRefund .totalServiceFeeRefund li:first-child .amountRefunded .field {
    margin-top: 0;
}

.statusReceipt {
    background: #20b799 !important;
}
.statusReceipt td {
    color: #ffffff !important;
}

.statusRefund {
    /*color: #6c757d;*/
    background: rgba(250, 89, 68, 0.3) !important;
}

/**UPDATES - 07042022**/
.hostelDash .dashCol4.lpdickson {
    background: rgba(175,50,255,0.1);
    border: 1px solid #af32ff;
}

    .hostelDash .dashCol4.lpdickson h2 {
        color: #af32ff;
    }

.hostelLocation.lpdickson {
    background: rgba(175,50,255,0.1);
    border: 1px solid #af32ff;
}

.hostelDash .dashCol4.lpraffles {
    background: rgba(127,63,1,0.1);
    border: 1px solid #7f3f01;
}

    .hostelDash .dashCol4.lpraffles h2 {
        color: #7f3f01;
    }

.hostelLocation.lpraffles {
    background: rgba(127,63,1,0.1);
    border: 1px solid #7f3f01;
}

.hostelDash .dashCol4.clover {
    background: rgba(250,89,68,0.1);
    border: 1px solid #fa5944;
}

    .hostelDash .dashCol4.clover h2 {
        color: #fa5944;
    }

.hostelLocation.clover {
    background: rgba(250,89,68,0.1);
    border: 1px solid #fa5944;
}

.responsiveTable table tbody tr td a {
    color: #00aeef;
    text-decoration: none;
    font-size: 14px;
    line-height: 18px;
}

.serviceFee {
    max-width: 900px;
}

    .serviceFee li .amount {
        width: calc(25% - 25px);
    }

    .serviceFee li .gstAmount {
        margin-left: 10px;
        width: calc(25% - 25px);
    }

    .serviceFee li .addAmount {
        width: calc(50% - 25px);
    }

        .serviceFee li .addAmount span {
           /* margin-left: 0 !important;*/
            width: calc(50% - 25px);
        }

        .serviceFee li .addAmount .gstAmount .field input {
            width: calc(100% - 25px);
            display: inline-block;
            vertical-align: middle;
        }

.deletelink {
    display: inline-block;
    vertical-align: middle;
    width: 18px;
}

.totalServiceFee .descriptionGST {
    display: none;
    margin-right: 10px;
    width: calc(50% - 25px);
}

@media screen and (max-width:699px) {
    .serviceFee li .gstAmount {
        margin-left: 0;
        width: 100%;
        margin-bottom: 10px;
    }

    .serviceFee li .addAmount {
        margin-left: 0;
        width: 100%;
        margin-bottom: 10px;
    }

        .serviceFee li .addAmount span {
            margin-left: 0;
            width: 100% !important;
            margin-bottom: 10px;
        }

        .serviceFee li .addAmount .gstAmount {
            display: block;
        }

    .totalServiceFee .descriptionGST {
        display: inline-block;
        margin-right: 10px;
        width: calc(50% - 10px);
    }

    .totalServiceFee li .gstAmount {
        margin-left: 10px;
        width: calc(50% - 10px);
        text-align: right;
    }
      .totalServiceFee li .gstAmount {
        margin-left: 10px;
        width: calc(50% - 10px);
        text-align: right;
    }

    .serviceFee li .addAmount .gstAmount .field input {
        width: calc(100% - 25px);
        display: inline-block;
        vertical-align: middle;
    }
}

/**CMS Portal**/
.cmsContent {
    font-size: 0;
}

    .cmsContent .contents {
        width: 100%;
        background: #f5f7fa;
        border-radius: 10px;
        padding: 0;
        position: relative;
        border: 1px solid #e9edf3;
    }

        .cmsContent .contents.cmsTable {
            margin-bottom: 50px;
        }

        .cmsContent .contents .innerContainer {
            padding: 20px;
            width: calc(100% - 40px);
            font-size: 0;
        }

.CMS.REVIEWS .searchFilter {
    max-width: 500px;
    margin-bottom: 10px;
}

    .CMS.REVIEWS .searchFilter .selectField {
        width: 200px;
    }

    .CMS.REVIEWS .searchFilter .btn {
        width: 82px;
        margin-right: 0;
    }

.CMS.GALLERY .searchFilter {
    max-width: 600px;
    margin-bottom: 10px;
}

    .CMS.GALLERY .searchFilter span {
        width: calc(100% - 300px);
    }

    .CMS.GALLERY .searchFilter .selectField {
        width: 200px;
    }

    .CMS.GALLERY .searchFilter .btn {
        width: 82px;
        margin-right: 0;
    }

.CMS.ARTICLES .searchFilter {
    max-width: 1200px;
    margin-bottom: 10px;
}

    .CMS.ARTICLES .searchFilter span {
        width: calc(100% - 950px);
    }

    .CMS.ARTICLES .searchFilter .selectField {
        width: 200px;
    }

    .CMS.ARTICLES .searchFilter .btn {
        width: 82px;
        margin-right: 0;
    }

.CMS.SERVICES .searchFilter {
    max-width: 800px;
    margin-bottom: 10px;
}

    .CMS.SERVICES .searchFilter span {
        width: calc(100% - 550px);
    }

    .CMS.SERVICES .searchFilter .selectField {
        width: 200px;
    }

    .CMS.SERVICES .searchFilter .btn {
        width: 82px;
        margin-right: 0;
    }

.tableImg {
    width: 75px;
    border: 1px solid #e9edf3;
}

    .tableImg img {
        width: 100%;
        display: block;
        background: url("../images/blank-img.png")repeat;
    }

.responsiveTable table tbody .noRecords td {
    text-align: center !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
}

    .responsiveTable table tbody .noRecords td span {
        display: block;
        width: 100% !important;
    }

.CMS .responsiveTable table tr .field input[type="text"], .CMS .responsiveTable table tr .field select {
    border: 1px solid #f1f1f1;
}

.ckEditor {
    width: calc(100% - 22px);
    border: 1px solid #f1f1f1;
    border-radius: 5px;
    overflow: hidden;
    position: relative;
}

    .ckEditor img {
        width: 100%;
        display: block;
    }

    .ckEditor .dummyText {
        position: absolute;
        font-size: 14px;
        width: calc(100% - 30px);
        top: 25%;
        left: 15px;
    }

.cmsImgPlaceholder {
    width: 100%;
    max-width: 100px;
}

    .cmsImgPlaceholder img {
        width: 100%;
        display: block;
        border: 1px solid #f1f1f1;
        background: url("../images/blank-img.png")repeat;
    }

.CMS .modal-dialog {
    margin: 5% 0;
}

@media screen and (max-width:1199px) {
    .responsiveTable table .noRecords td::before {
        content: '';
        float: none;
    }

    .CMS .responsiveTable table tr .field {
        display: block;
    }

    .CMS.ARTICLES .searchFilter {
        max-width: 100%;
        margin-bottom: 10px;
    }

        .CMS.ARTICLES .searchFilter span {
            width: 100%;
            margin-bottom: 10px;
        }

        .CMS.ARTICLES .searchFilter .selectField {
            width: 100%;
            display: inline-block;
            margin-right: 5px;
            margin-bottom: 10px;
        }

        .CMS.ARTICLES .searchFilter .btn {
            width: 82px;
            margin-right: 0;
            display: block;
        }
}

@media screen and (max-width:899px) {
    .CMS.SERVICES .searchFilter {
        max-width: 100%;
        margin-bottom: 10px;
    }

        .CMS.SERVICES .searchFilter span {
            width: 100%;
            margin-bottom: 10px;
        }

        .CMS.SERVICES .searchFilter .selectField {
            width: 100%;
            display: inline-block;
            margin-right: 5px;
            margin-bottom: 10px;
        }

        .CMS.SERVICES .searchFilter .btn {
            width: 82px;
            margin-right: 0;
            display: block;
        }
}

@media screen and (max-width:800px) {
    .CMS.REVIEWS .searchFilter {
        max-width: 100%;
        margin-bottom: 10px;
    }

        .CMS.REVIEWS .searchFilter .selectField {
            width: 100%;
            display: inline-block;
            margin-right: 5px;
            margin-bottom: 10px;
        }

        .CMS.REVIEWS .searchFilter .btn {
            width: 82px;
            margin-right: 0;
            display: block;
        }

    .CMS.GALLERY .searchFilter {
        max-width: 100%;
        margin-bottom: 10px;
    }

        .CMS.GALLERY .searchFilter span {
            width: 100%;
            margin-bottom: 10px;
        }

        .CMS.GALLERY .searchFilter .selectField {
            width: 100%;
            display: inline-block;
            margin-right: 5px;
            margin-bottom: 10px;
        }

        .CMS.GALLERY .searchFilter .btn {
            width: 82px;
            margin-right: 0;
            display: block;
        }
}

@media screen and (max-width:699px) {
    .ckEditor {
        width: calc(100% - 2px);
    }
}
/**UPDATES - 07042022**/
.hostelDash .dashCol4.lpDickson {
    background: rgba(175,50,255,0.1);
    border: 1px solid #af32ff;
}

    .hostelDash .dashCol4.lpDickson h2 {
        color: #af32ff;
    }

.hostelLocation.lpDickson {
    background: rgba(175,50,255,0.1);
    border: 1px solid #af32ff;
}

.hostelDash .dashCol4.lpRaffles {
    background: rgba(127,63,1,0.1);
    border: 1px solid #7f3f01;
}

    .hostelDash .dashCol4.lpRaffles h2 {
        color: #7f3f01;
    }

.hostelLocation.lpRaffles {
    background: rgba(127,63,1,0.1);
    border: 1px solid #7f3f01;
}

.hostelDash .dashCol4.clover {
    background: rgba(250,89,68,0.1);
    border: 1px solid #fa5944;
}

    .hostelDash .dashCol4.clover h2 {
        color: #fa5944;
    }

.hostelLocation.clover {
    background: rgba(250,89,68,0.1);
    border: 1px solid #fa5944;
}
/**UPDATES - 11042022**/
.popTableScroll {
    width: 100%;
    overflow-x: auto;
}

    .popTableScroll table {
        width: 700px;
    }

form {
    height: auto !important;
}

button {
    cursor: pointer;
    -webkit-appearance: none;
    border-radius: 5px;
    width: auto;
    border: none;
    font-family: 'Baloo Paaji 2', sans-serif;
}

.upload.pathName .contractuploadDoc {
    width: 100%;
}

    .upload.pathName .contractuploadDoc span::before {
        content: '';
        background: url("../Content/images/upload-icon.png");
        background-size: 16px;
        width: 16px;
        height: 16px;
        display: inline-block;
        vertical-align: middle;
        margin-right: 10px;
    }

.upload.pathName label {
    width: 100%;
}
/**UPDATES: 19/05/2022**/
.msgBlock {
    display: block;
    width: 100%;
    text-align: left;
    float: left;
    margin-bottom: 5px;
    overflow-wrap: anywhere;
}


#sortable {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 100%;
}

    #sortable li {
        margin: 5px 0;
        padding: 10px;
        font-size: 14px;
        height: 18px;
        font-weight: 700;
        background: #00aeef;
        border-radius: 5px;
        cursor: move;
        color: #ffff;
    }

        #sortable li span {
            position: absolute;
            margin-left: 0;
            background: url(../images/drag-cursor.png)no-repeat 10px center;
            padding-left: 35px;
        }


.supplierTable .responsiveTable table {
    width: 2500px !important;
}

.dashboardRgt .appointment ul li .actionBtns {
    width: calc(100% - 20px);
    padding: 10px;
    text-align: right;
    border-top: 1px solid #e9edf3;
}

.dashboardRgt .appointment ul li .container {
}
/*
@media screen and (max-width: 699px) {
    .createNewMaid .uploadPhoto {
        height: auto;
    }
}
*/
/**UPDATES: 29/07/2022 / 17082022 / 02/09/2022**/
.maidLegend .legend {
    width: calc(100% - 410px);
}

.maidLegend .btn {
    width: 410px;
}

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

.commonBtn.clearSel {
    margin-left: 10px;
}

.maidLegend .btn .commonBtn {
    display: inline-block;
}

@media screen and (max-width:1469px) {
    .maidLegend .legend {
        width: 100%;
        display: block;
        margin-bottom: 10px;
    }

    .maidLegend .btn {
        width: 100%;
        display: block;
        text-align: right;
    }

        .maidLegend .btn .commonBtn {
            margin-bottom: 10px;
        }
}

.createNewMaid .history .overseasCol2 {
    width: calc(50% - 30px);
}

    .createNewMaid .history .overseasCol2 .leftField {
        display: inline-block;
        vertical-align: top;
        width: calc(100% - 170px);
        margin-right: 50px;
    }

        .createNewMaid .history .overseasCol2 .leftField p, .createNewMaid .history .overseasCol2 .rightField p {
            color: #6c757d;
            font-size: 14px;
            line-height: 18px;
        }

            .createNewMaid .history .overseasCol2 .leftField p strong {
                display: block;
                margin-bottom: 15px;
            }

    .createNewMaid .history .overseasCol2 .rightField {
        display: inline-block;
        vertical-align: top;
        text-align: right;
        width: 120px;
    }

        .createNewMaid .history .overseasCol2 .rightField span {
            margin: 0 5px;
        }

@media screen and (max-width:1199px) {
    .createNewMaid .history .overseasCol2 {
        width: 100%;
    }
}

.notificationMsg .searchFilter {
    max-width: 1070px;
    margin-bottom: 10px;
    font-size: 0;
}

    .notificationMsg .searchFilter span {
        width: calc(100% - 750px);
        display: inline-block;
        vertical-align: top;
    }

    .notificationMsg .searchFilter .selectField {
        width: 200px;
    }

    .notificationMsg .searchFilter .btn {
        width: 82px;
        margin-right: 0;
    }

    .notificationMsg .searchFilter .date {
        width: 423px;
    }

        .notificationMsg .searchFilter .date ul {
            width: 100%;
            font-size: 0;
        }

            .notificationMsg .searchFilter .date ul li {
                display: inline-block;
                vertical-align: middle;
                font-size: 14px;
                line-height: 18px;
                color: #6c757d;
                width: calc(50% - 12px);
            }

                .notificationMsg .searchFilter .date ul li:nth-child(2) {
                    width: 24px;
                }

@media screen and (max-width:1099px) {
    .notificationMsg .searchFilter {
        max-width: 100%;
        margin-bottom: 10px;
    }

        .notificationMsg .searchFilter span {
            width: 100%;
            display: block;
            margin-right: 0;
            margin-bottom: 10px;
        }

        .notificationMsg .searchFilter .date {
            display: inline-block;
            vertical-align: middle;
            width: 100%;
            text-align: center;
        }

        .notificationMsg .searchFilter .selectField {
            width: 100%;
        }

        .notificationMsg .searchFilter .btn {
            margin: 5px 0 20px 0;
        }
}

.dashboardRgt .appointment ul li .actionBtns {
    width: calc(100% - 20px);
    padding: 10px;
    text-align: right;
    border-top: 1px solid #e9edf3;
}

.dashboardRgt .appointment ul li .container {
}

.dashboardRgt .appointment ul li .actionBtns a {
    display: inline-block;
    vertical-align: middle;
    margin-left: 5px;
}

    .dashboardRgt .appointment ul li .actionBtns a img {
        display: block;
        width: 18px;
    }

/**UPDATE: 220928**/
.maidsOverview .rightResults .tableView .responsiveTable {
    overflow-x: none;
}

    .maidsOverview .rightResults .tableView .responsiveTable .tableScroll {
        width: 100%;
        overflow-x: auto;
    }

    .maidsOverview .rightResults .tableView .responsiveTable table {
        width: 1550px;
    }

.maidsOverview .rightResults .tableView th:nth-child(1),
.maidsOverview .rightResults .tableView td:nth-child(1),
.maidsOverview .rightResults .tableView th:nth-child(2),
.maidsOverview .rightResults .tableView td:nth-child(2),
.maidsOverview .rightResults .tableView th:nth-child(3),
.maidsOverview .rightResults .tableView td:nth-child(3) {
    position: sticky;
    left: 0;
    background: #f5f7fa;
}

.maidsOverview .rightResults .tableView th:nth-child(1),
.maidsOverview .rightResults .tableView td:nth-child(1) {
    width: 40px;
    min-width: 40px;
}

.maidsOverview .rightResults .tableView th:nth-child(2),
.maidsOverview .rightResults .tableView td:nth-child(2) {
    left: 50px;
    width: 40px;
    min-width: 40px;
}

.maidsOverview .rightResults .tableView th:nth-child(3),
.maidsOverview .rightResults .tableView td:nth-child(3) {
    left: 90px;
    width: 150px;
    min-width: 150px;
}

@media screen and (max-width:1199px) {
    .maidsOverview .rightResults .tableView th:nth-child(1),
    .maidsOverview .rightResults .tableView td:nth-child(1),
    .maidsOverview .rightResults .tableView th:nth-child(2),
    .maidsOverview .rightResults .tableView td:nth-child(2),
    .maidsOverview .rightResults .tableView th:nth-child(3),
    .maidsOverview .rightResults .tableView td:nth-child(3) {
        position: relative;
        background: none;
    }

    .maidsOverview .rightResults .tableView th:nth-child(1),
    .maidsOverview .rightResults .tableView td:nth-child(1) {
        width: auto;
        min-width: inherit;
    }

    .maidsOverview .rightResults .tableView th:nth-child(2),
    .maidsOverview .rightResults .tableView td:nth-child(2) {
        left: auto;
        width: auto;
        min-width: inherit;
    }

    .maidsOverview .rightResults .tableView th:nth-child(3),
    .maidsOverview .rightResults .tableView td:nth-child(3) {
        left: auto;
        width: auto;
        min-width: inherit;
    }

    .maidsOverview .rightResults .tableView .responsiveTable .tableScroll {
        overflow-x: none;
    }
}

input[type="text"].keyIcon,
input[type="password"].keyIcon {
    background-image: url("../images/login-verification.svg");
    background-size: 28px;
    background-position: right center;
    background-repeat: no-repeat;
    padding-right: 30px !important;
    padding-right: 25px;
}

.btnAlign {
    width: calc(100% + 10px);
    font-size: 0;
}

    .btnAlign span {
        display: inline-block;
        width: calc(50% - 10px);
        margin-right: 10px;
    }

        .btnAlign span .loginBtn {
            width: 100%;
        }

.loginForm .hyperlink {
    color: #333333;
    text-align: center !important;
    font-size: 14px;
    line-height: 18px;
    display: block;
}

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

    .verifyQRCode span {
        display: inline-block;
        vertical-align: top;
        font-size: 14px;
        line-height: 18px;
        width: calc(100% - 125px);
    }

        .verifyQRCode span h1 {
            margin-bottom: 5px;
        }

    .verifyQRCode .qrPlaceholder {
        width: 100px;
        margin-left: 25px;
    }

        .verifyQRCode .qrPlaceholder img {
            width: 100%;
            display: block;
        }

@media screen and (max-width:399px) {
    .verifyQRCode span {
        display: block;
        width: 100%;
    }

    .verifyQRCode .qrPlaceholder {
        margin: 20px auto 0 auto;
    }
}

/**UPDATES- 06/12/2022**/
.leadCheckbox {
    position: absolute;
    top: 22.5px;
    right: 20px;
}