html.pum-open.pum-open-overlay,
html.pum-open.pum-open-overlay.pum-open-fixed .pum-overlay {
    overflow: hidden;
    position: fixed;
    width: 100%;
}

    html.pum-open.pum-open-overlay.pum-open-scrollable .pum-overlay.pum-active {
        overflow-y: scroll;
        -webkit-overflow-scrolling: touch;
    }

.cls_Before {
    background: #DFADBE;
}
.cls_After {
    background: #B4E4B8;
}
body {
    margin: 0px;
    padding: 0px;
    background-color: #FFFFFF;
}
.cmsboxheader {
    background-color: #FFEF96;
    color: #444;
    display: block;
    padding: 6px;
    position: relative;
}

.mergefield {
    font-size: 12px;
    padding-right: 2px !important;
}
.mergetext {
    font-size: 12px;
    //word-break: break-word;
}


a {
    padding: 0px;
    margin: 0px;
    text-decoration: none;
}

.gallery-inital {
    text-align: center;
    margin-top: 245px;
    color: #d1c6dc;
}
#eventInfoList .x-column-header-inner .x-column-header-text{
    white-space:normal;
}
.wrap .x-grid-cell-inner {
    white-space: normal;
}
.thumb-checkBox {
    position: absolute;
    cursor: pointer;
    width: 18px;
    height: 18px;
    margin-left: 21px;
    margin-top: 22px;
}

.clicked-button{
    filter:grayscale(1);
}
.btnAdd {
    border: none;
    color: white;
    padding: 4px 28px;
    cursor: pointer;
    right: 37px;
}

.zoomin {
    position: fixed;
    margin-top: 81px;
    margin-left: 3px;
    cursor: pointer;
    width: 28px;
    height: 24px;
    font-size: 18px;
}

.zoomout {
    position: fixed;
    margin-top: 130px;
    margin-left: 3px;
    cursor: pointer;
    width: 28px;
    height: 24px;
    font-size: 18px;
}

.auditimageDis {
    position: fixed;
    background-color: whitesmoke;
}
#AddSubContractCustomerForm .x-fieldset-header{
    overflow:unset !important;
}
.deletBtn {
    border: none;
    color: white;
    padding: 4px 28px;
    cursor: pointer;
    right: 187px;
}
.fieldcrewlbl {
    color: black;
    cursor: pointer;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 25px;
    font-weight:bold;
}
.fieldcrewlbl1 {
    color: white;
    cursor: pointer;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 25px;
    font-weight: bold;
}
.success {
    background-color: #2F566D;
}
    /* Green */
    .success:hover {
        background-color: #46a049;
    }

img {
    padding: 0px;
    margin: 0px;
}

    img a {
        border: 0px;
        outline: none;
    }

.topBg {
    width: 100%;
    height: 46px;
    background-image: url(../Images/topBg.jpg);
    background-repeat: repeat-x;
}

.BottomBg {
    width: 100%;
    height: 46px;
    background-image: url(../Images/loginBottomBG.png);
    background-repeat: repeat-x;
    position: absolute;
    bottom: 0px;
}

.no-drop {
    cursor: no-drop;
}


.lockIcon {
    width: 37px;
    height: 46px;
    margin: auto;
    background-image: url(../Images/loginLockIcon.jpg);
    background-repeat: no-repeat;
}

/*.bottomImage{width:650px; height:332px; margin:auto; bottom:46px; background-image:url(../Images/snowRemover.png); background-repeat:no-repeat; position:absolute; left:35%; z-index:-1;} */

.leftImage {
    width: 477px;
    height: 414px;
    position: absolute;
    left: 0px;
    top: 150px;
    background-image: url(../Images/vehicle.png);
    background-repeat: no-repeat;
}

.center {
    width: 290px;
    height: auto;
    overflow: hidden;
    margin: auto;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: bold;
    color: #072E49;
    padding-top: 5px;
    z-index: 1000;
}

    .center a {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px;
        color: #2F566D;
        text-decoration: underline;
    }

        .center a:hover {
            text-decoration: none;
        }

.textBox {
    width: 275px;
    height: 35px;
    padding: 13px;
    background-color: transparent;
    border: 1px solid #9FBCC5;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #333333;
    outline: none;
}

.button {
    width: 83px;
    height: 31px;
    background-image: url(../Images/VerifyButton.png);
    outline: none;
    border: none;
    cursor: pointer;
}
.submit_button {
    width: 83px;
    height: 31px;
    background-image: url(../Images/SubmitButton.png);
    outline: none;
    border: none;
    cursor: pointer;
}

/******************* home *********************/
.banner {
    width: 100%;
    height: 70px;
    border-top: 4px solid #D32323;
    background-color: #C4F0FB;
    background-image: url(../Images/banners.jpg);
    background-position: left top;
    background-repeat: no-repeat;
}

.rightImage {
    width: 219px;
    height: 70px;
    float: right;
    /*background-image: url(../Images/smartLogo.png);*/
}

.menu {
    width: 100%;
    height: 32px;
    background-image: url(../Images/menuBg.jpg);
    background-repeat: repeat-x;
    border-top: 1px solid #FFF;
}

    .menu ul {
        height: 32px;
        display: block;
        liststyle: none;
        margin: 0px;
        float: left;
        padding: 0px;
        padding-left: 5px;
    }

    .menu li {
        display: block;
        list-style: none;
        height: 32px;
        text-transform: uppercase;
        float: left;
    }

        .menu li a{
            display: block;
            list-style: none;
            height: 24px;
            font-family: Tahoma, Geneva, sans-serif;
            font-size: 11px;
            color: #FFF;
            text-transform: uppercase;
            float: left;
            padding-top: 8px;
            padding-right: 25px;
            padding-left: 25px;
            text-decoration: none;
        }

            .menu li a:hover {
                color: #1D5E88;
                background-image: url(../Images/buttonOver.jpg);
                background-repeat: no-repeat;
            }
        .ulsubmenu {
            display: none !important;
        }
.show {
    display: block !important;
}
.ulsubmenu:hover {
    display: block !important;
   
}


        .menu li:hover ul {
            display: block ;
        }

.active {
    color: #1D5E88 !important;
    background-image: url(../Images/buttonOver.jpg);
    background-repeat: no-repeat;
}

.crossline {
    width: 2px;
    height: 32px;
    background-image: url(../Images/crossline.jpg);
    background-repeat: no-repeat;
    float: left;
}

.logout {
    float: right;
}
.taskList {
    float: right;
    width: 37px;
}

/*.home {
    float: left;
}*/

.Content {
    width: 100%;
    height: auto;
    overflow: hidden;
    background-color: #FFFFFF;
}

.copy {
    width: 100%;
    height: 50px;
    background-color: #25475F;
    border-bottom: 2px solid #D32323;
    text-align: center;
    font-family: Tahoma, Geneva, sans-serif;
    font-size: 12px;
    color: #FFF;
    z-index: 10000;
    position: fixed;
    bottom: 0px;
    padding-top: 3px;
}

#welcomeMessage {
    float: right;
    right: auto;
    top: 5px;
}

.ui-widget-content {
    width: 150px;
    font-size: smaller;
}

.welcome {
    height: 24px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: #BDDADF;
    float: right;
    padding-right: 15px;
    text-align: right;
    padding-top: 8px;
}

#validationMessage {
    color: Red;
}

#userName {
    cursor: pointer;
}

/*.status-disabled {
    background: url(../Images/allocateRed.png) 3px 5px no-repeat;
}*/
.x-item-disabled.delete-enabled {
    background: url(../Images/Delete_Stop_disabled.png) !important;
    background-size: 16px 16px !important;
}
.delete-disable {
    background: url(../Images/Delete_Stop_disabled.png) !important;
    background-size: 16px 16px !important;
}
.delete-enabled {
    background: url(../Images/Delete_Stop.png);
    background-size: 16px 16px;
}

.x-item-disabled.status-active {
    background: url(../Images/Ok_Active.png) !important;
    cursor: default;
}

.status-active {
    background: url(../Images/Ok_Active.png) !important;
    cursor: pointer;
}

.status-inactive {
    background: url(../Images/Ok_Active_Grey.png) !important;
    cursor: pointer;
}
.status-expired {
    background: url(../Images/Expired.png) !important;
    cursor: pointer;
}
.status-validation-renewal {
    background: url(../Images/Ok_Active_Orange.png) !important;
    cursor: pointer;
}
.asset-active {
    background: url(../Images/equipment.png) !important;
    cursor: pointer;
}
.employee-active {
    background: url(../Images/Assign.png) !important;
    cursor: pointer;
}

.googleLocation-active {
    background: url(../Images/LocationView.png) !important;
    cursor: pointer;
}
.drawboundaryicon {
    background: url(../Images/polygon.png) !important;
    cursor: pointer;
}
.viewboundaryicon {
    background: url(../Images/view.png) !important;
    cursor: pointer;
}
.hideviewboundaryicon {
pointer-events:none;
}
.drawboundaryiconinactive {
    background: url(../Images/polygon_grey.png) !important;
}
.googleLocation-inactive {
    background: url(../Images/LocationView_Grey.png) !important;
    /*cursor: pointer;*/
}

.status-inactive_orange {
    background: url(../Images/Ok_Active_Orange.png) !important;
    cursor: pointer;
}

.x-item-disabled.status-pending {
    background: url(../Images/inActive_Grey.png) !important;
    cursor: pointer;
}

.cancelPo_visible {
    background: url(../Images/Delete_Stop.png);
    background-size: 16px 16px;
    display:inline-block !important;
}
.cancelPo_hidden {
    background: url(../Images/Delete_Stop.png);
    background-size: 16px 16px;
    display:none !important;
}
.cancelPo_disabled {
    background: url(../Images/Delete_Stop_disabled.png);
    background-size: 16px 16px;
    display: inline-block !important;
}
.status-pending {
    background: url(../Images/inActive.png) !important;
    cursor: pointer;
}
.status-pendingnouttime {
    background: url(../Images/Expired.png) !important;
    cursor: pointer;
}

.status-expired {
    background: url(../Images/Expired.png) !important;
}

.status-enabledDeactivate {
    background: url(../Images/Ok.png);
}


.x-item-disabled.status-enabled {
    background: url(../Images/allocateGreen.png) !important;
}

.status-enabled {
    background: url(../Images/allocateRed.png);
}


.x-item-disabled.modify-enabled {
    background: url(../Images/modify-inactive.png) !important;
    background-size: 16px 16px !important;
}

.modify-enabled {
    background: url(../Images/modify-1.png);
    background-size: 16px 16px;
}
.x-item-disabled.document-modify-enabled {
    background: url(../Images/ModifyGray.png) !important;
    background-size: 16px 16px !important;
}

.document-modify-enabled {
    background: url(../Images/Modify.png);
    background-size: 16px 16px;
}
.delete-enabled {
    background: url(../Images/Delete_Stop.png);
    background-size: 16px 16px;
}
.x-item-disabled.delete-enabled {
    background: url(../Images/Delete_Stop_disabled.png) !important;
    background-size: 16px 16px !important;
}
.contract-delete-enabled {
    background: url(../Images/Delete_Stop.png);
    background-size: 16px 16px;
}

.contract-delete-disbled {
    background: url(../Images/Delete_Stop_disabled.png) !important;
    background-size: 16px 16px !important;
}

.tam-enabled {
    background: url(../Images/tamrate.png);
    background-size: 16px 16px;
}
.tam-disabled {
    background: url(../Images/tamrate_disable.png);
    background-size: 16px 16px;
}
.wrap-text-field {
    height: auto;
    width:435px;
    max-width: 435px; 
    word-wrap: break-word;
}
.auditEvidence-enabled {
    background: url(../Images/evidence.png);
    background-size: 16px 16px;
}

.lock-green {
    background: url(../Images/lockGreen.png);
    background-size: 16px 16px;
}

.lock-red {
    background: url(../Images/lockRed.png);
    background-size: 16px 16px;
}

.x-item-disabled.lock-red {
    background: url(../Images/lockGrey.png) !important;
    background-size: 16px 16px !important;
}

.lock-blue {
    background: url(../Images/lockBlue.png);
    background-size: 16px 16px;
}

.lock-grey {
    background: url(../Images/lockGrey.png);
    background-size: 16px 16px;
}

.x-item-disabled.archiveContract-enabled {
    background: url(../Images/ArchiveGray.png) !important;
    background-size: 16px 16px !important;
}

.archiveContract-enabled {
    margin-left: 10px;
    background: url(../Images/Archive.png);
    background-size: 16px 16px;
}
.invoice-enabled {
    margin-left: 10px;
    background: url(../Images/assetModify.png) !important;
    background-size: 16px 16px;
}
.bill-enabled {
    margin-left: 10px;
    background: url(../Images/pdf.png) !important;
    background-size: 16px 16px;
}
.archiveRestoreContract-enabled {
    background: url(../Images/terminateRestore.png);
    margin-left: 10px;
    height: 19px;
    width: 24px;
}

.archiveRestoreContract-disable {
    background: url(../Images/terminateRestore_disable.png);
    margin-left: 10px;
    height: 19px;
    width: 24px;

}
#contractSearchButton {
    left: 70px !important;
}

#OperationWhiteBoardSearchButton {
    left: 140px !important;
}


#photosSearchButton {
    left: 80px !important;
}

#archivedContractSearchButton {
    left: 120px !important;
}

#InEventAreaSearchButton {
    left: 180px !important;
}
#WeatherInfoSearchButton {
    left: 150px !important;
}
#monthlyWeatherInfoSearchButton {
    left: 200px !important;
}
#UserSearchButton {
    left: 120px !important;
}
#BillsReportSearchButton {
    left: 150px !important;
}
#SCWeatherInfoSearchButton {
    left: 150px !important;
}
#SubContractUserSearchButton {
    left: 150px !important;
}
#TamServicesSearchButton {
    left: 100px !important;
}
#WorkTicketSearchButton {
    left: 100px !important;
}

#SiteVisitSearchButton {
    left: 100px !important;
}

#EventSearchButton {
    left: 100px !important;
}
#ClockInOutSearchButton {
    left: 100px !important;
}
#WorkLogSearchButton {
    left: 100px !important;
}
#AssetWorkLogSearchButton {
    left: 120px !important;
}
#PayrollProcessSearchButton {
    left: 100px !important;
}
#PayrollSearchButton {
    left: 100px !important;
}
#PayrollExportsSearchWindowOpenButton {
    left: 100px !important;
}

#LocationAssignSearchButton {
    left: 100px !important;
}
#MasterAreaRouteSearchButton {
	left: 200px !important;
}
#HSPayrollSearchButton {
    left: 75px !important;
}

.userskill {
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 50px;
    overflow: hidden;
}
.searchCriteria {
    margin: 10px;
    border: 0px;
    padding: 0px;
}

    .searchCriteria .x-panel-body {
        padding: 5px;
        line-height: 18px;
        overflow-y:auto !important;
    }

#contractSearchCriteria {
}

.x-item-disabled.restore-enabled {
    background: url(../Images/restoreGray.png) !important;
    background-size: 16px 16px !important;
}

.restore-enabled {
    background: url(../Images/restore.png);
    background-size: 16px 16px;
}

.documents-enabled {
    background: url(../Images/docs.png);
    background-size: 16px 16px;
}

.x-item-disabled.documents-enabled {
    background: url(../Images/Attach_Grey.png) !important;
    background-size: 16px 16px !important;
}
.attachSitePlan{
    background: url(../Images/siteplans.png);
    background-size: 16px 16px;
}
.x-action-col-cell .x-item-disabled {
    opacity: 1;
}

#container {
    position: relative;
    bottom: 15px;
}

#msgCount,
#notifyimage {
    width: 100%;
    height: 100%;
    position: absolute;
}

#msgCount {
    right: 18.5px;
    /*bottom:2.5px;*/
    z-index: 10;
    color: yellow;
    font-weight: bold;
    font-size: smaller;
}


.x-boundlist-item img.chkCombo {
    background: transparent url(../Images/restoreGray.png);
}

.x-boundlist-selected img.chkCombo {
    background: transparent url(../Images/restoreGray.png);
}

.enabledRow .x-grid-cell {
    background-color: #ffffff;
}

.disabledRow .x-grid-cell {
    background-color: #cccccc;
}

.workticket_blue {
    content: url(../Images/ticket1.png);
    background-size: 16px 16px;
    background-repeat: no-repeat;
}

.workticket_red {
    content: url(../Images/ticket_red.png);
    background-size: 16px 16px;
    background-repeat: no-repeat;
}

.workticket_grey {
    content: url(../Images/ticket_grey.png);
    background-size: 16px 16px;
    background-repeat: no-repeat;
}

.workticket-red_green {
    content: url(../Images/ticket_red_green.png);
    background-size: 16px 16px;
}

.workticket_yellow {
    content: url(../Images/ticket_yellow.png);
    background-size: 16px 16px;
    background-repeat: no-repeat;
}

.workticket-yellow_green {
    content: url(../Images/ticket_yellow_green.png);
    background-size: 16px 16px;
}

.workticket-violet {
    content: url(../Images/ticket_violet.png);
    background-size: 16px 16px;
}

.workticket-black {
    content: url(../Images/ticket_black.png);
    background-size: 16px 16px;
}

.workticket_nw {
    content: url(../Images/ticket_nw.png);
    background-size: 16px 16px;
    background-repeat: no-repeat;
}

.workticket_nw_red {
    content: url(../Images/ticket_nw_red.png);
    background-size: 16px 16px;
    background-repeat: no-repeat;
}

.workticket_green {
    content: url(../Images/ticket_green.png);
    background-size: 16px 16px;
    background-repeat: no-repeat;
}

.workticket_lightblue {
    content: url(../Images/ticket_lightblue.png);
    background-size: 16px 16px;
    background-repeat: no-repeat;
}

.x-item-disabled.workticket-assign {
    background: url(../Images/allocate_grey.png) !important;
    background-size: 16px 16px !important;
}

.workticket-assign {
    background: url(../Images/allocateGreen.png);
    background-size: 16px 16px;
}


.x-item-disabled.workticketHistory-enabled {
    background: url(../Images/HistorynewGrey.png) !important;
    background-size: 16px 16px !important;
}

.workticketHistory-enabled {
    margin-left: 10px;
    background: url(../Images/Historynew.png);
    background-size: 16px 16px;
}

.x-item-disabled.repair-enabled {
    background: url(../Images/repairGrey.png) !important;
    background-size: 16px 16px !important;
}

.repair-enabled {
    background: url(../Images/repair.png);
    background-size: 16px 16px;
}

.repair-green {
    background: url(../Images/repairGreen.png);
    background-size: 16px 16px;
}

.siteVisit-verified {
    background: url(../Images/SiteVisit_Verified.png);
    background-size: 16px 16px;
    background-repeat:no-repeat;
}
.siteVisit-unVerified {
    background: url(../Images/SiteVisit_UnVerified.png);
    background-size: 16px 16px;
    background-repeat:no-repeat;
}
.sitevisit-flagged {
    background: url(../Images/SiteVisit_Flagged.png);
    background-size: 16px 16px;
    background-repeat:no-repeat;
}
.sitevisit-flagged-selected {
    background: url(../Images/SiteVisit_Flagged_Selected.png);
    background-size: 16px 16px;
    background-repeat:no-repeat;
}
.sitevisit-new {
    background: url(../Images/SiteVisit_New.png);
    background-size: 16px 16px;
    background-repeat:no-repeat;
}
.sitevisit-new-selected {
    background: url(../Images/SiteVisit_New_Selected.png);
    background-size: 16px 16px;
    background-repeat:no-repeat;
}
.sitevisit-unverified-selected {
    background: url(../Images/SiteVisit_UnVerified_Selected.png);
    background-size: 16px 16px;
    background-repeat:no-repeat;
}
.sitevisit-verified-selected {
    background: url(../Images/SiteVisit_Verified_Selected.png);
    background-size: 16px 16px;
    background-repeat:no-repeat;
}

.IncludeAttachment-Active {
    background: url(../Images/docs.png);
    background-size: 16px 16px;
    background-repeat: no-repeat;
}




.IncludeAttachment-InActive {
    background: url(../Images/docs_inactive.png);
    background-size: 16px 16px;
    background-repeat: no-repeat;
}
.IncludeAttachment .x-form-checkbox {
    background: url(../Images/docs_inactive.png);
    height: 20px;
    width: 20px;
    background-size: 16px 16px;
    background-repeat: no-repeat;
}
.IncludeAttachmentChecked .x-form-checkbox {
    background: url(../Images/docs.png);
    height: 20px;
    width: 20px;
    background-size: 16px 16px;
    background-repeat: no-repeat;
}
.IncludeTime-Active {
    background: url(../Images/tamrate.png);
    background-size: 16px 16px;
    margin-left: 20px;
    background-repeat: no-repeat;
}


.IncludeTime-InActive {
    background: url(../Images/tamrate_disable.png);
    background-size: 16px 16px;
    margin-left: 20px;
    background-repeat: no-repeat;
}
.IncludeTime .x-form-checkbox {
    background: url(../Images/tamrate_disable.png);
    height: 20px;
    width: 20px;
    background-size: 16px 16px;
    background-repeat: no-repeat;
}
.IncludeTimeChecked .x-form-checkbox {
    background: url(../Images/tamrate.png);
    height: 20px;
    width: 20px;
    background-size: 16px 16px;
    background-repeat: no-repeat;
}
#communicationLogGrid .x-grid-cell-inner, #messageList .x-grid-cell-inner, #EvidencesGrid .x-grid-cell-inner, #gridWorkLogTime .x-grid-cell-inner, #BillingHistorygrid .x-grid-cell-inner {
    white-space: normal;
}

.x-item-disabled.detailsEnabled {
    background: url(../Images/DetailsGrey.png) !important;
    background-size: 16px 16px !important;
}

.detailsEnabled {
    background: url(../Images/Details.png);
    background-size: 16px 16px;
}

.x-item-disabled.detailsView { /*do not display any icon if disabled*/
    background-size: 16px 16px !important;
    background: url(../Images/Detail.png);
}

.detailsView {
    background: url(../Images/Details.png);
    background-size: 16px 16px;
}


.text-wrapper {
    word-break: break-word;
    word-wrap: break-word;
}

#SplInstDetails-inputEl {
    line-height: 1.5;
}

#RemarksDetails-inputEl, #KeyInfo-inputEl {
    line-height: 1.5;
}


tr.grid-row1 td {
    background-color: #F2F2F2;
}

tr.grid-row2 td {
    background-color: #e1e4e8;
}
.zoom_button {
    position: absolute;
    top: 3px; 
    right: 5px; 
    height: 22px;
    width: 22px; 
    border: none;
    background-color: transparent;
    background-image: url(../Images/zoomIcon.png);
    cursor: pointer;
}

    .zoom_button img {
        height: 16px;
        width: 16px;
        margin-right: 5px; 
    }


.user_image_close {
    position: absolute;
    top: 1px;
    left: 167px;
    height: 16px;
    width: 16px;
    border: 0px;
    background-image: url(../Images/delete_1.png);
    cursor: pointer;
}
.user_image_close1 {
    position: absolute;
    top: 1px;
    left: 70px;
    height: 16px;
    width: 16px;
    border: 0px;
    background-image: url(../Images/delete_1.png);
    cursor: pointer;
}

/******************* site image viewer *********************/
.site-imageviewer {
    display: block;
    max-width: 100%;
    min-width: 100%;
    width: 900px;
    height: 90%;
}

.site-imageviewer-content {
    width: 100%;
}

.carousel-btn {
    position: absolute;
    top: 50%;
    height: 50px;
    width: 41px;
}

/******************* home menu *********************/

.OperationalDashboard {
    background-image: url(../Images/dashboard.jpg);
    background-repeat: no-repeat;
}

    .OperationalDashboard a:hover {
        background-image: url(../Images/dashboard_hover.jpg) !important;
    }

    .OperationalDashboard .active {
        background-image: url(../Images/dashboard_hover.jpg) !important;
    }
.rootIcon {
    background-image: url(../Images/rootIcon.jpg);
    background-repeat: no-repeat;
}

    .rootIcon a:hover {
        background-image: url(../Images/rootIcon_hover.jpg) !important;
    }

    .rootIcon .active {
        background-image: url(../Images/rootIcon_hover.jpg) !important;
    }

.MasterList {
    background-image: url(../Images/masterList.jpg);
    background-repeat: no-repeat;
}

    .MasterList a:hover {
        background-image: url(../Images/masterList_hover.jpg) !important;
    }

    .MasterList .active {
        background-image: url(../Images/masterList_hover.jpg) !important;
    }
.BillingMenuIcon {
    background-image: url(../Images/BillingMenuIcon.png);
    background-repeat: no-repeat;
}

    .BillingMenuIcon a:hover {
        background-image: url(../Images/BillingMenuIcon_hover.png) !important;
    }

    .BillingMenuIcon .active {
        background-image: url(../Images/BillingMenuIcon_hover.png) !important;
    }
.InvoiceIcon {
    background-image: url(../Images/InvoiceIcon.png);
    background-repeat: no-repeat;
}

    .InvoiceIcon a:hover {
        background-image: url(../Images/InvoiceIcon_hover.png) !important;
    }

    .InvoiceIcon .active {
        background-image: url(../Images/InvoiceIcons_hover.png) !important;
    }
.DispatchIcon {
    background-image: url(../Images/DispatchIcon.jpg);
    background-repeat: no-repeat;
}

    .DispatchIcon a:hover {
        background-image: url(../Images/DispatchIcon.jpg) !important;
    }

    .DispatchIcon .active {
        background-image: url(../Images/DispatchIcon_hover.jpg) !important;
    }


.home {
    background-image: url(../Images/home.jpg);
    background-repeat: no-repeat;
}

    .home a:hover {
        background-image: url(../Images/home_hover.jpg) !important;
    }

    .home .active {
        background-image: url(../Images/home_hover.jpg) !important;
    }

.UsersIcon {
    background-image: url(../Images/users.jpg);
    background-repeat: no-repeat;
}

    .UsersIcon a:hover {
        background-image: url(../Images/users_hover.jpg) !important;
    }

    .UsersIcon .active {
        background-image: url(../Images/users_hover.jpg) !important;
    }



.MessageCenterIcon {
    background-image: url(../Images/MessageCenter.jpg);
    background-repeat: no-repeat;
}

    .MessageCenterIcon a:hover {
        background-image: url(../Images/MessageCenter_hover.jpg) !important;
    }

    .MessageCenterIcon .active {
        background-image: url(../Images/MessageCenter_hover.jpg) !important;
    }

.ContractsIcon {
    background-image: url(../Images/Contract.jpg);
    background-repeat: no-repeat;
}

.ContractsIcon a:hover {
    background-image: url(../Images/Contract_hover.jpg) !important;
}

.ContractsIcon .active {
    background-image: url(../Images/Contract_hover.jpg) !important;
}

.AreaRoutesIcon {
    background-image: url(../Images/AreaRoute.jpg);
    background-repeat: no-repeat;
}

.AreaRoutesIcon a:hover {
    background-image: url(../Images/AreaRoute_hover.jpg) !important;
}

.AreaRoutesIcon .active {
    background-image: url(../Images/AreaRoute_hover.jpg) !important;
}

.EventsIcon {
    background-image: url(../Images/Events.jpg);
    background-repeat: no-repeat;
}

.EventsIcon a:hover {
    background-image: url(../Images/Events_hover.jpg) !important;
}

.EventsIcon .active {
    background-image: url(../Images/Events_hover.jpg) !important;
}

.ServiceRecordsIcon {
    background-image: url(../Images/ServiceRecords.jpg);
    background-repeat: no-repeat;
}

.ServiceRecordsIcon a:hover {
    background-image: url(../Images/ServiceRecords_hover.jpg) !important;
}

.ServiceRecordsIcon .active {
    background-image: url(../Images/ServiceRecords_hover.jpg) !important;
}

.ReportsIcon {
    background-image: url(../Images/Reports.jpg);
    background-repeat: no-repeat;
}

    .ReportsIcon a:hover {
        background-image: url(../Images/Reports_hover.jpg) !important;
    }

    .ReportsIcon .active {
        background-image: url(../Images/Reports_hover.jpg) !important;
    }

.CsmsIcon {
    background-image: url(../Images/Csms.jpg);
    background-repeat: no-repeat;
}

    .CsmsIcon a:hover {
        background-image: url(../Images/Csms_hover.jpg) !important;
    }

    .CsmsIcon .active {
        background-image: url(../Images/Csms_hover.jpg) !important;
    }
.SubContIcon {
    background-image: url(../Images/subCont.jpg);
    background-repeat: no-repeat;
}

    .SubContIcon a:hover {
        background-image: url(../Images/subCont_hover.jpg) !important;
    }

    .SubContIcon .active {
        background-image: url(../Images/subCont_hover.jpg) !important;
    }



.AssetsIcon {
    background-image: url(../Images/Assets.jpg);
    background-repeat: no-repeat;
}

    .AssetsIcon a:hover {
        background-image: url(../Images/Assets_hover.jpg) !important;
    }

    .AssetsIcon .active {
        background-image: url(../Images/Assets_hover.jpg) !important;
    }

.DeviceIcon {
    background-image: url(../Images/Devices.jpg);
    background-repeat: no-repeat;
}

    .DeviceIcon a:hover {
        background-image: url(../Images/Devices_hover.jpg) !important;
    }

    .DeviceIcon .active {
        background-image: url(../Images/Devices_hover.jpg) !important;
    }

.TimeKeepingIcon {
    background-image: url(../Images/TimeKeeping.jpg);
    background-repeat: no-repeat;
}

    .TimeKeepingIcon a:hover {
        background-image: url(../Images/TimeKeeping_hover.jpg) !important;
    }

    .TimeKeepingIcon .active {
        background-image: url(../Images/TimeKeeping_hover.jpg) !important;
    }

.AuditsIcon {
    background-image: url(../Images/Audits.jpg);
    background-repeat: no-repeat;
}

    .AuditsIcon a:hover {
        background-image: url(../Images/Audits_hover.jpg) !important;
    }

    .AuditsIcon .active {
        background-image: url(../Images/Audits_hover.jpg) !important;
    }

.BillingIcon {
    background-image: url(../Images/Billing.jpg);
    background-repeat: no-repeat;
}

    .BillingIcon a:hover {
        background-image: url(../Images/Billing_hover.jpg) !important;
    }

    .BillingIcon .active {
        background-image: url(../Images/Billing_hover.jpg) !important;
    }
.subtaskIconcls {
    background-image: url(../Images/subtask.png);
    background-repeat: no-repeat;
}
.taskIconcls {
    background-image: url(../Images/task.png);
    background-repeat: no-repeat;
}
.OperationsWhiteBoardIcon {
    background-image: url(../Images/OperationsWhiteBoardIcon.jpg);
    background-repeat: no-repeat;
}
    .OperationsWhiteBoardIcon a:hover {
        background-image: url(../Images/OperationsWhiteBoardIcon_hover.jpg) !important;
    }

    .OperationsWhiteBoardIcon .active {
        background-image: url(../Images/OperationsWhiteBoardIcon_hover.jpg) !important;
    }
.PlanningIcon {
    background-image: url(../Images/recruitPlanning.jpg);
    background-repeat: no-repeat;
}

    .PlanningIcon a:hover {
        background-image: url(../Images/recruitPlanning_over.jpg) !important;
    }

    .PlanningIcon .active {
        background-image: url(../Images/recruitPlanning_over.jpg) !important;
    }

.StaffConfIcon {
    background-image: url(../Images/staffconfirm.png);
    background-repeat: no-repeat;
}

    .StaffConfIcon a:hover {
        background-image: url(../Images/staffconfirm_over.png) !important;
    }

    .StaffConfIcon .active {
        background-image: url(../Images/staffconfirm_over.png) !important;
    }
.RecruitIcon {
    background-image: url(../Images/recruit.png);
    background-repeat: no-repeat;
}

    .RecruitIcon a:hover {
        background-image: url(../Images/recruit_over.png) !important;
    }

    .RecruitIcon .active {
        background-image: url(../Images/recruit_over.png) !important;
    }
.PlanIcon {
    background-image: url(../Images/plan.png);
    background-repeat: no-repeat;
}

    .PlanIcon a:hover {
        background-image: url(../Images/plan_over.png) !important;
    }

    .PlanIcon .active {
        background-image: url(../Images/plan_over.png) !important;
    }
.HourlySubConIcon {
    background-image: url(../Images/HourlySubCon.jpg);
    background-repeat: no-repeat;
}

    .HourlySubConIcon a:hover {
        background-image: url(../Images/HourlySubCon_hover.jpg) !important;
    }

    .HourlySubConIcon .active {
        background-image: url(../Images/HourlySubCon_hover.jpg) !important;
    }
.WorkOrderIcon {
    background-image: url(../Images/WorkOrder.jpg);
    background-repeat: no-repeat;
}

    .WorkOrderIcon a:hover {
        background-image: url(../Images/WorkOrder_hover.jpg) !important;
    }

    .WorkOrderIcon .active {
        background-image: url(../Images/WorkOrder_hover.jpg) !important;
    }
.logout_style {
    width: 50px;
    height: 32px;
}

@media (min-width: 1601px) and (max-width: 1920px) {

    .whiteboardview-box-title{
    display: inline-block;
    font-size: 12px;
    margin: 0;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 250px;
}
}


@media (min-width: 1410px) and (max-width: 1600px) {
   
    .whiteboardview-box-title{
    display: inline-block;
    font-size: 12px;
    margin: 0;
    line-height: 1;
    width: 210px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    }

}

@media (min-width: 1289px) and (max-width: 1409px) {

    .menu li a {
        display: block;
        list-style: none;
        height: 24px;
        font-family: Tahoma, Geneva, sans-serif;
        font-size: 10px;
        color: #FFF;
        text-transform: uppercase;
        float: left;
        padding-top: 8px;
        padding-right: 22px;
        padding-left: 22px;
        text-decoration: none;
    }

    .location-fieldset {
        font-size: 50px;
        background-color: white;
    }

    .site-imageviewer {
        width: 645px;
        height: 426px;
    }
    /*.site-imageviewer {
        display: block;
        max-width: 100%;
        min-width: 100%;
        width: 900px;
        height: 90%;
    }*/

    .site-imageviewer-content {
        width: 645px;
    }

    .carousel-btn {
        position: absolute;
        top: 50%;
        height: 50px;
        width: 41px;
    }

    .whiteboardview-box-title{
    display: inline-block;
    font-size: 12px;
    margin: 0;
    line-height: 1;
    width: 150px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    }
}

@media (min-width: 1192px) and (max-width: 1288px) {

    .menu li a {
        display: block;
        list-style: none;
        height: 24px;
        font-family: Tahoma, Geneva, sans-serif;
        font-size: 10px;
        color: #FFF;
        text-transform: uppercase;
        float: left;
        padding-top: 8px;
        padding-right: 20px;
        padding-left: 18px;
        text-decoration: none;
    }
    .whiteboardview-box-title{
    display: inline-block;
    font-size: 12px;
    margin: 0;
    line-height: 1;
    width: 160px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    }
}

@media (min-width: 984px) and (max-width: 1191px) {

    .menu li a {
        display: block;
        list-style: none;
        height: 20px;
        font-family: Tahoma, Geneva, sans-serif;
        font-size: 8px;
        color: #FFF;
        text-transform: uppercase;
        float: left;
        padding-top: 8px;
        padding-right: 14px;
        padding-left: 14px;
        text-decoration: none;
    }

    .menu {
        width: 100%;
        height: 27px;
        background-image: url(../Images/menuBg.jpg);
        background-repeat: repeat-x;
        border-top: 1px solid #FFF;
    }

    .logout_style {
        width: 35px;
        height: 22px;
    }

    .crossline {
        width: 2px;
        height: 27px;
        background-image: url(../Images/crossline.jpg);
        background-repeat: no-repeat;
        float: left;
    }
    .PlanningIcon {
        background-image: url(../Images/recruitPlanning.jpg);
        background-repeat: no-repeat;
    }

        .PlanningIcon a:hover {
            background-image: url(../Images/recruitPlanning_over.jpg) !important;
        }

        .PlanningIcon .active {
            background-image: url(../Images/recruitPlanning_over.jpg) !important;
        }
    .StaffConfIcon {
        background-image: url(../Images/staffconfirm.png);
        background-repeat: no-repeat;
    }

        .StaffConfIcon a:hover {
            background-image: url(../Images/staffconfirm_over.png) !important;
        }

        .StaffConfIcon .active {
            background-image: url(../Images/staffconfirm_over.png) !important;
        }

    .RecruitIcon {
        background-image: url(../Images/recruit.png);
        background-repeat: no-repeat;
    }

        .RecruitIcon a:hover {
            background-image: url(../Images/recruit_over.png) !important;
        }

        .RecruitIcon .active {
            background-image: url(../Images/recruit_over.png) !important;
        }

    .PlanIcon {
        background-image: url(../Images/plan.png);
        background-repeat: no-repeat;
    }

        .PlanIcon a:hover {
            background-image: url(../Images/plan_over.png) !important;
        }

        .PlanIcon .active {
            background-image: url(../Images/plan_over.png) !important;
        }
    .OperationalDashboard {
        background-image: url(../Images/dashboard_tab.jpg);
        background-repeat: no-repeat;
    }

        .OperationalDashboard a:hover {
            background-image: url(../Images/dashboard_hover_tab.jpg) !important;
        }

        .OperationalDashboard .active {
            background-image: url(../Images/dashboard_hover_tab.jpg) !important;
        }


    .MasterList {
        background-image: url(../Images/masterList_tab.jpg);
        background-repeat: no-repeat;
    }

        .MasterList a:hover {
            background-image: url(../Images/masterList_hover_tab.jpg) !important;
        }

        .MasterList .active {
            background-image: url(../Images/masterList_hover_tab.jpg) !important;
        }


    .home {
        background-image: url(../Images/home_tab.jpg);
        background-repeat: no-repeat;
    }

        .home a:hover {
            background-image: url(../Images/home_hover_tab.jpg) !important;
        }

        .home .active {
            background-image: url(../Images/home_hover_tab.jpg) !important;
        }

    .UsersIcon {
        background-image: url(../Images/users_tab.jpg);
        background-repeat: no-repeat;
    }

        .UsersIcon a:hover {
            background-image: url(../Images/users_hover_tab.jpg) !important;
        }

        .UsersIcon .active {
            background-image: url(../Images/users_hover_tab.jpg) !important;
        }


    .MessageCenterIcon {
        background-image: url(../Images/MessageCenter_tab.jpg);
        background-repeat: no-repeat;
    }

        .MessageCenterIcon a:hover {
            background-image: url(../Images/MessageCenter_hover_tab.jpg) !important;
        }

        .MessageCenterIcon .active {
            background-image: url(../Images/MessageCenter_hover_tab.jpg) !important;
        }

    .ReportsIcon {
        background-image: url(../Images/Reports_tab.jpg);
        background-repeat: no-repeat;
    }

        .ReportsIcon a:hover {
            background-image: url(../Images/Reports_hover_tab.jpg) !important;
        }

        .ReportsIcon .active {
            background-image: url(../Images/Reports_hover_tab.jpg) !important;
        }


    .AssetsIcon {
        background-image: url(../Images/Assets_tab.jpg);
        background-repeat: no-repeat;
    }

        .AssetsIcon a:hover {
            background-image: url(../Images/Assets_hover_tab.jpg) !important;
        }

        .AssetsIcon .active {
            background-image: url(../Images/Assets_hover_tab.jpg) !important;
        }

    .DeviceIcon {
        background-image: url(../Images/Devices_tab.jpg);
        background-repeat: no-repeat;
    }

        .DeviceIcon a:hover {
            background-image: url(../Images/Devices_hover_tab.jpg) !important;
        }

        .DeviceIcon .active {
            background-image: url(../Images/Devices_hover_tab.jpg) !important;
        }

    .TimeKeepingIcon {
        background-image: url(../Images/TimeKeeping_tab.jpg);
        background-repeat: no-repeat;
    }

        .TimeKeepingIcon a:hover {
            background-image: url(../Images/TimeKeeping_hover_tab.jpg) !important;
        }

        .TimeKeepingIcon .active {
            background-image: url(../Images/TimeKeeping_hover_tab.jpg) !important;
        }
    .WorkOrderIcon {
        background-image: url(../Images/WorkOrder.jpg);
        background-repeat: no-repeat;
    }

        .WorkOrderIcon a:hover {
            background-image: url(../Images/WorkOrder_hover.jpg) !important;
        }

        .WorkOrderIcon .active {
            background-image: url(../Images/WorkOrder_hover.jpg) !important;
        }
    .AuditsIcon {
        background-image: url(../Images/Audits_tab.jpg);
        background-repeat: no-repeat;
    }

        .AuditsIcon a:hover {
            background-image: url(../Images/Audits_hover_tab.jpg) !important;
        }

        .AuditsIcon .active {
            background-image: url(../Images/Audits_hover_tab.jpg) !important;
        }

    .BillingIcon {
        background-image: url(../Images/Billing_tab.jpg);
        background-repeat: no-repeat;
    }

        .BillingIcon a:hover {
            background-image: url(../Images/Billing_hover_tab.jpg) !important;
        }

        .BillingIcon .active {
            background-image: url(../Images/Billing_hover_tab.jpg) !important;
        }
    .BillingMenuIcon {
        background-image: url(../Images/BillingMenuIcon.png);
        background-repeat: no-repeat;
    }

        .BillingMenuIcon a:hover {
            background-image: url(../Images/BillingMenuIcon_hover.png) !important;
        }

        .BillingMenuIcon .active {
            background-image: url(../Images/BillingMenuIcon_hover.png) !important;
        }

    .InvoiceIcon {
        background-image: url(../Images/InvoiceIcon.png);
        background-repeat: no-repeat;
    }

        .InvoiceIcon a:hover {
            background-image: url(../Images/InvoiceIcon_hover.png) !important;
        }

        .InvoiceIcon .active {
            background-image: url(../Images/InvoiceIcons_hover.png) !important;
        }
}

@media (min-width: 872px) and (max-width: 983px) {

    .menu li a {
        display: block;
        list-style: none;
        height: 24px;
        font-family: Tahoma, Geneva, sans-serif;
        font-size: 9px;
        color: #FFF;
        text-transform: uppercase;
        float: left;
        padding-top: 8px;
        padding-right: 4px;
        padding-left: 4px;
        text-decoration: none;
    }
}

@media (min-width: 768px) and (max-width: 871px) {

    .menu li a {
        display: block;
        list-style: none;
        height: 24px;
        font-family: Tahoma, Geneva, sans-serif;
        font-size: 8px;
        color: #FFF;
        text-transform: uppercase;
        float: left;
        padding-top: 8px;
        padding-right: 4px;
        padding-left: 4px;
        text-decoration: none;
    }
}

.location-fieldset {
    font-size: 50px;
    background-color: white;
}

.x-item-disabled.PhotoView-enabled {
    background: url(../Images/view_grey.png) !important;
    background-size: 16px 16px !important;
}

.PhotoView-enabled {
    background: url(../Images/view.png);
    background-size: 16px 16px;
}

.center {
    margin-top: auto;
    margin-bottom: auto;
}

.biggertext {
    font-weight: 600;
    background-color: red;
}
.boldtext {
    font-weight: 600;
    color: red;
}
/******************* billing report *********************/
#page-wrap {
    /*width: 800px;*/
    margin: 0 auto;
}

#invoiceHeader {
    height: 30px;
    width: 100%;
    margin: 8px 0;
    background: #287CB7;
    text-align: center;
    color: white;
    font: bold 15px Helvetica, Sans-Serif;
    text-decoration: uppercase;
    letter-spacing: 10px;
    padding: 7px 0px 0px 0px;
}

#invoiceItems {
    clear: both;
    width: 100%;
    margin: 12px 0 0 0;
    border: 1px solid black;
}

    #invoiceItems th {
        background: #eee;
    }

    #invoiceItems textarea {
        width: 80px;
        height: 50px;
    }

    #invoiceItems tr.item-row td {
        border: 0;
        vertical-align: top;
    }

    #invoiceItems td.description {
        width: 250px;
    }

    #invoiceItems td.item-name {
        width: 150px;
    }

    #invoiceItems td.description textarea, #items td.item-name textarea {
        width: 100%;
    }

    #invoiceItems td.total-line {
        border-right: 0;
        text-align: right;
    }

    #invoiceItems td.total-value {
        border-left: 0;
        padding: 10px;
    }

        #invoiceItems td.total-value textarea {
            height: 20px;
            background: none;
        }

    #invoiceItems td.balance {
        background: #eee;
    }

    #invoiceItems td.blank {
        border: 0;
    }

    #invoiceItems td {
        text-align: center;
    }

#terms {
    text-align: center;
    margin: 20px 0 0 0;
}

    #terms h5 {
        text-transform: uppercase;
        font: 13px Helvetica, Sans-Serif;
        letter-spacing: 10px;
        border-bottom: 1px solid black;
        padding: 0 0 8px 0;
        margin: 0 0 8px 0;
    }

    #terms textarea {
        width: 100%;
        text-align: center;
    }

.box {
    position: relative;
    border-radius: 3px;
    background: #ffffff;
    border: 1px solid #333333;
    margin-bottom: 12px;
    width: 100%;
    box-shadow: 0 1px 1px rgba(0,0,0,0.1);
    height: 195px;
}
.box-header.with-border {
    border: 1px solid #A6B6CD;
    background: #D6E3F3;
    
}
.box-header.with-border:hover {
   
    cursor: pointer;
}


.box-header {
    color: #444;
    display: block;
    padding: 10px;
    position: relative;
    margin-bottom: 2px;
}

.box-body {
    padding: 15px;
    border: 1px solid #A6B6CD;
    margin-bottom: 2px;
}
/*.box-header.with-border {
    border-bottom: 1px solid #ececec;
    background: #eee;
}

.box-header {
    color: #444;
    display: block;
    padding: 10px;
    position: relative;
}*/

.box-title {
    display: inline-block;
    font-size: 14px;
    margin: 0;
    line-height: 1;
}

/*
.box-body {
    padding: 15px;
}*/

.dl-horizontal dt {
    float: left;
    width: 80px;
    overflow: hidden;
    clear: left;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-bottom: 25px;
}

.dl-horizontal dd {
    margin-left: 90px;
    margin-bottom: 25px;
}

.bill-ticket-report ul {
    list-style: none;
    margin: 0;
    padding: 0 0 30px;
    margin-left: -20px;
}

.bill-ticket-report li {
    display: block;
    float: left;
    margin: 0;
    padding: 0;
    /*width: 33%;*/
    width: 50%;
}
/*dl {
    margin: 0;
    padding: 0;
}
dt, dd {
    display: block;
    margin: 0;
    text-align: center;
}*/



#invoiceItemBody {
    display: block;
    height: 200px;
    overflow: auto;
}

.scrollableTable thead,
.scrollableTable tr {
    display: table;
    width: 100%;
    table-layout: fixed; /* even columns width , fix width of table too*/
}

.scrollableTable tbody tr {
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-bottom-color: #d6d6d6;
}

.x-item-disabled.BillingCancelled-enabled {
    margin-left: 10px;
    background: url(../Images/cancel-grey.png) !important;
    background-size: 16px 16px !important;
}

.BillingCancelled-enabled {
    margin-left: 10px;
    background: url(../Images/cancel-blue.png);
    background-size: 16px 16px;
}


.status-green {
    background: url(../Images/Ok_Active.png) !important;
    cursor: default;
}

.status-grey {
    background: url(../Images/Ok_Active_Grey.png) !important;
    cursor: default;
}

.status-orange {
    background: url(../Images/Ok_Active_Orange.png) !important;
    cursor: default;
}

.status-red {
    background: url(../Images/Ok_deac.png) !important;
    cursor: default;
}

.status-blue {
    background: url(../Images/Ok.png) !important;
    cursor: default;
}
.status-blue-circle {
    background: url(../Images/blue-circle.png) !important;
    cursor: default;
}
.status-orange-circle {
    background: url(../Images/orange-circle.png) !important;
    cursor: default;
}
.status-green-circle {
    background: url(../Images/green-circle.png) !important;
    cursor: default;
}
.status-grey-circle {
    background: url(../Images/tick_grey.png) !important;
    cursor: default;
    }

.status-green-o {
    background: url(../Images/Ok_Active.png) !important;
    cursor: default;
    background-position: top right !important;
    background-repeat: no-repeat !important;
    padding-right: 18px !important;
    height: 15px !important;
}

.status-grey-o {
    background: url(../Images/Ok_Active_Grey.png) !important;
    cursor: default;
    background-position: top right !important;
    background-repeat: no-repeat !important;
    padding-right: 18px !important;
}

.status-orange-o {
    background: url(../Images/Ok_Active_Orange.png) !important;
    cursor: default;
    background-position: top right !important;
    background-repeat: no-repeat !important;
    padding-right: 18px !important;
    height: 15px !important;
}

.status-red-o {
    background: url(../Images/Ok_deac.png) !important;
    cursor: default;
    background-position: top right !important;
    background-repeat: no-repeat !important;
    padding-right: 18px !important;
    height: 15px !important;
}

.status-blue-o {
    background: url(../Images/Ok.png) !important;
    cursor: default;
    background-position: top right !important;
    background-repeat: no-repeat !important;
    padding-right: 18px !important;
    height: 15px !important;
}

.status-blue-circle-o {
    background: url(../Images/blue-circle.png) !important;
    cursor: default;
    background-position: top right !important;
    background-repeat: no-repeat !important;
    padding-right: 18px !important;
    height: 15px !important;
}

.status-orange-circle-o {
    background: url(../Images/orange-circle.png) !important;
    cursor: default;
    background-position: top right !important;
    background-repeat: no-repeat !important;
    padding-right: 18px !important;
    height: 15px !important;
}

.status-green-circle-o {
    background: url(../Images/green-circle.png) !important;
    cursor: default;
    background-position: top right !important;
    background-repeat: no-repeat !important;
    padding-right: 18px !important;
    height: 15px !important;
}

.status-grey-circle-o {
    background: url(../Images/tick_grey.png) !important;
    cursor: default;
    background-position: top right !important;
    background-repeat: no-repeat !important;
    padding-right: 18px !important;
    height:15px !important;
}
.tooltipButton {
    background: url(../Images/iconHelp.png) !important;
    background-repeat: no-repeat !important;
    height: 25px !important;
    width: 30px;
    top: 2px !important;
}
.map {
    position: initial !important;
}

.contract-label-style {
    font-weight: bold;
}

.mapPopup a {
    cursor: pointer;
    text-decoration: underline;
    color: blue;
}

.dock-bottom-border {
    border-top: 1px solid #99BBE8;
}

.x-grid-row-summary .x-grid-cell {
    background-color: #ffffff !important;
}
.x-grid-row-summary {
    background-color: #ffffff !important;
}

    /* Make text bold */
    .x-grid-row-summary .x-grid-cell-inner {
        font-weight: bold;
    }
.inactive-summary .x-grid-cell-inner {
    background-color: #dcdcdc !important;
}
.transparentPanel .x-panel-body-default {
    background-color: transparent;
}

.polar-legend .x-legend-container .x-legend-item span {
    float: left;
    height: 13px;
    width: 12px;
    margin-right: 6px;
}

.polar-chart-border div:first-child { /*#contractChart-body {*/
    border-right: 0px;
}

.polar-chart-border div:nth-child(2) div {
    border: 0px;
}
/*#panel-1013-body {
    border:0px
}*/

.x-legend-item:first-child { /* To remove top border of legend in chart*/
    border: none !important;
}

.x-legend-container {
    text-align: left;
}

.activatecontract-pending {
    background: url(../Images/contract_pending.png);
    background-size: 16px 16px;
}
.activatecontract-pending-disable {
    background: url(../Images/contract_pending_disable.png);
    background-size: 16px 16px;
}

.activatecontract-expired {
    background: url(../Images/Expired.png);
    background-size: 16px 16px;
}

.activatecontract-edit {
    background: url(../Images/contract_edit.png);
    background-size: 16px 16px;
}
.activatecontract-edit-disable {
    background: url(../Images/contract_edit_disable.png);
    background-size: 16px 16px;
}

.activatecontract-active {
    background: url(../Images/Ok_Active.png);
    background-size: 16px 16px;
}
.photoCountIcon {
    background: url(../Images/before.png);
    height: 24px;
    width: 24px;
    background-repeat: no-repeat;
}
.AfterphotoCountIcon {
    background: url(../Images/after.png);
    height: 24px;
    width: 24px;
    top:6px;
    background-repeat: no-repeat;
}
.needSignIcon .x-form-checkbox {
    background: url(../Images/signature.png);
    height: 32px;
    width: 32px;
    background-repeat: no-repeat;
}
.needSignIconChecked .x-form-checkbox {
    background: url(../Images/signature-checked.png);
    height: 32px;
    width: 32px;
    background-repeat: no-repeat;
}

.onboardingstatusIcon {
    top: -5px !important;
    /*left: 215px !important;*/
}
.onboardingstatusIcon .x-form-checkbox {
    background: url(../Images/pending.png);
    height: 40px;
    width: 40px;
    background-repeat: no-repeat;
    background-color:transparent;

}

.onboardingstatusIconChecked .x-form-checkbox {
    background: url(../Images/completed.png);
    height: 40px;
    width: 40px;
    background-repeat: no-repeat;
    background-color: transparent;
}
.seasonalRatesRequiredIcon .x-form-checkbox {
    background: url(../Images/seasonalRates_unchecked_false.png);
    height: 20px;
    width: 20px;
    margin-top: 0;
    margin-bottom: 0;
    background-repeat: no-repeat;
}
.seasonalRatesRequiredIconChecked .x-form-checkbox {
    background: url(../Images/seasonalRates_checked_true.png);
    height: 20px;
    width: 20px;
    margin-top: 0;
    margin-bottom: 0;
    background-repeat: no-repeat;
}
.isprimaryRequiredIcon .x-form-checkbox {
    background: url(../Images/primaryskillicon.png);
    height: 20px;
    width: 20px;
    margin-top: 0;
    background-repeat: no-repeat;
}

.isprimaryRequiredIconChecked .x-form-checkbox {
    background: url(../Images/primaryskilliconchecked.png);
    height: 25px;
    width: 25px;
    margin-top: 0;
    background-repeat: no-repeat;
}

.IceEventIcon .x-form-checkbox {
    background: url(../Images/iceEventRate.png);
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
}

.OperationalDashboardTab {
    background-image: url(../Images/dashboardTab.png) !important;
    width: 80px !important;
}
.OperationalMapDashboard {
    background-image: url(../Images/mapDashboardTab.png) !important;
    width: 80px !important;
}
.DriverStatus {
    background-image: url(../Images/driverSummaryTab.png) !important;
    width: 80px !important;
}
.iconServiceRecodsMissing {
    background-image: url(../images/endTimeMissing.gif) !important;
    width: 175px !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
}
.icon-checked {
    background-image: url(../Images/noCharge1.png) !important;
    width: 40px !important;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: 0 !important;
    filter: grayscale(1);
    margin-left: 5px !important;
}
.icon-unchecked {
    background-image: url(../Images/noCharge1.png) !important;
    width: 40px !important;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: 0 !important;
    margin-left: 5px !important;
}
.Spliticon-checked {
    background-image: url(../Images/splitsitevisiticon.png) !important;
    height: 20px;
    width: 20px;
    background-size: contain;
    background-repeat: no-repeat;
}

.Spliticon-unchecked {
    background-image: url(../Images/splitsitevisiticondisabled.png) !important;
    height: 20px;
    width: 20px;
    background-size: contain;
    background-repeat: no-repeat;
}
.highlight-row {
    background-color: #b0ff90 !important; /* Important to override default styles */
}
#btnMissingServiceRecords-btnInnerEl {
    font-weight: 700;
    color: red !important;
    font-size:15px !important
}
.IceEventIconChecked .x-form-checkbox {
    background: url(../Images/iceEventRate-checked.png);
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
}
.PreSeasonIcon .x-form-checkbox {
    background: url(../Images/preAudit.png);
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
}

.PreSeasonIconChecked .x-form-checkbox {
    background: url(../Images/preAudit-checked.png);
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
}
.PostSeasonIcon .x-form-checkbox {
    background: url(../Images/postAudit.png);
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
}

.PostSeasonIconChecked .x-form-checkbox {
    background: url(../Images/postAudit-checked.png);
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
}
.rowColorAuditExpired {
background-color:#E5A7A8
}
.rowColorDefaultRate {
    background-color: #D8BFD8
}
.rowColorPreviousWorkData {
background-color:#BFA6C4

}

.rowColorMissingSMART {
    background-color: #E67E22;
}
.rowColorMissingQB {
    background-color: #FAD7A0;
}
.rowColorMissingSQB {
    background-color: #FEF9E7;
}

.rowColorAuditExpiredDateOver {
    background-color: #FFFFFF
}
.rowColorDefaultValue{
    background-color:lightskyblue
}
.activate_map_icon {
    background: url(../Images/ViewMap.png);
    background-size: 16px 16px;
}
.inactivate_map_icon {
    background: url(../Images/viewMap_grey.png);
    background-size: 16px 16px;
}
#TaskList {
    border-color: #598df3;
}
#SubtaskList {
    border-color: #e3ba6a;
}
#TaskList .x-panel-header-default {
    background-color: #598df3;
    background-image: none;
}
#SubtaskList .x-panel-header-default {
    background-color: #e3ba6a;
    background-image: none;
}
#TaskList .x-title-text, #SubtaskList .x-title-text {
    color: white;
    padding:3px 0;
}
#gridtask-body{
    padding-bottom:100px;
}
.TaskListbtn {
    background: none !important;
    border: none;
    padding: 0 !important;
    /*optional*/
    font-family: arial, sans-serif;
    /*input has OS specific font-family*/
    color: #069;
    text-decoration: underline;
    cursor: pointer;
}
.TaskExportbtn {
    background: none !important;
    border: none;
    padding: 0 !important;
    cursor: pointer;
    height:20px;
}    .special{
    font-weight: 600;
}
.date-right-align{
    float: right !important;
    font-weight: 600 !important;
}

.taskBy-left-align{
  font-weight: 600 !important;
}

.task-border{
    border-top: 4px solid red;
    border-left: 1px solid red;
    border-right: 1px solid red;
    border-bottom: 1px solid red;
}

.task-hor-line{
   border-bottom: 1px solid grey;
}

.task-box-whiteboardview-progress {
    position: relative;
    background: #ffffff;
    border-top: 3px solid #2A9708;
    border-right: 1px solid #2A9708;
    border-bottom: 1px solid #2A9708;
    border-left: 1px solid #2A9708;
    margin-bottom: 4px;
    /*width: 95%;*/
}

.x-grid-item-selected .task-box-whiteboardview-progress {
    position: relative;
    background: #c2f1bd;
    border-top: 3px solid #2A9708;
    border-right: 1px solid #2A9708;
    border-bottom: 1px solid #2A9708;
    border-left: 1px solid #2A9708;
    margin-bottom: 4px;
    /*width: 95%;*/
}

.x-grid-item-selected .task-box-whiteboardview-completed {
    position: relative;
    background: #c8eaff;
    border-top: 3px solid #009CFF;
    border-right: 1px solid #009CFF;
    border-bottom: 1px solid #009CFF;
    border-left: 1px solid #009CFF;
    margin-bottom: 4px;
    /*width: 95%;*/
}

.x-grid-item-selected .task-box-whiteboardview-Notstarted {
    position: relative;
    background: #ffdfbf;
    border-top: 3px solid #FF7E00;
    border-right: 1px solid #FF7E00;
    border-bottom: 1px solid #FF7E00;
    border-left: 1px solid #FF7E00;
    margin-bottom: 4px;
    /*width: 95%;*/
}

.x-grid-item-selected .task-box-whiteboardview-Cancelled {
    position: relative;
    background: #eaeaea;
     border-top: 3px solid #9A9999;
    border-right: 1px solid #9A9999;
    border-bottom: 1px solid #9A9999;
    border-left: 1px solid #9A9999;
    margin-bottom: 4px;
    /*width: 95%;*/
}

.x-grid-item-selected .task-box-whiteboardview-Expired {
    position: relative;
    background: #ffcbcb;
    border-top: 3px solid #FF0000;
    border-right: 1px solid #FF0000;
    border-bottom: 1px solid #FF0000;
    border-left: 1px solid #FF0000;
    margin-bottom: 4px;
    /*width: 95%;*/
}
.x-grid-item-selected .task-box-whiteboardview-Notstarted_black {
    position: relative;
    background: #dcdcdc;
    border-top: 3px solid #000000;
    border-right: 1px solid #000000;
    border-bottom: 1px solid #000000;
    border-left: 1px solid #000000;
    margin-bottom: 4px;
    /*width: 95%;*/
}



.task-box-whiteboardview-Notstarted_black {
    position: relative;
    background: #ffffff;
    border-top: 3px solid #000000;
    border-right: 1px solid #000000;
    border-bottom: 1px solid #000000;
    border-left: 1px solid #000000;
    margin-bottom: 4px;
}
/*#2A9708 Progress task-box-whiteboardview-progress
#009CFF Completed .task-box-whiteboardview-completed
#FF0000 Not started.task-box-whiteboardview-Notstarted
 #9A9999 Cancelled .task-box-whiteboardview-Cancelled*/
.task-box-whiteboardview-progress:hover {
    background: #c2f1bd;
}

.task-box-whiteboardview-completed:hover {
    background: #c8eaff;
}

.task-box-whiteboardview-Notstarted:hover {
    background: #ffdfbf;
}
.task-box-whiteboardview-Cancelled:hover {
    background: #eaeaea;
}
.task-box-whiteboardview-Expired:hover {
    background: #ffcbcb;
}
.task-box-whiteboardview-Notstarted_black:hover {
    background: #dcdcdc;
}
/*.task-box-whiteboardview-progress:focus, .task-box-whiteboardview-completed:focus, .task-box-whiteboardview-Notstarted:focus, .task-box-whiteboardview-Cancelled:focus, .task-box-whiteboardview-Expired:focus, .task-box-whiteboardview-Notstarted_black:focus {
    background: #c2f1bd;
}*/

.task-box-whiteboardview-completed {
    position: relative;
    background: #ffffff;
    border-top: 3px solid #009CFF;
    border-right: 1px solid #009CFF;
    border-bottom: 1px solid #009CFF;
    border-left: 1px solid #009CFF;
    margin-bottom: 4px;
    /*width: 95%;*/
}

.task-box-whiteboardview-Notstarted {
    position: relative;
    background: #ffffff;
    border-top: 3px solid #FF7E00;
    border-right: 1px solid #FF7E00;
    border-bottom: 1px solid #FF7E00;
    border-left: 1px solid #FF7E00;
    margin-bottom: 4px;
    /*width: 95%;*/
}
.task-box-whiteboardview-Cancelled {
    position: relative;
    background: #ffffff;
    border-top: 3px solid #9A9999;
    border-right: 1px solid #9A9999;
    border-bottom: 1px solid #9A9999;
    border-left: 1px solid #9A9999;
    margin-bottom: 4px;
    /*width: 95%;*/
}
.task-box-whiteboardview-Expired {
    position: relative;
    background: #ffffff;
    border-top: 3px solid #FF0000;
    border-right: 1px solid #FF0000;
    border-bottom: 1px solid #FF0000;
    border-left: 1px solid #FF0000;
    margin-bottom: 4px;
    /*width: 95%;*/
}
.whiteboardview-box-header {
    color: #444;
    display: block;
    padding: 6px;
    position: relative;
    display: flex
}
.whiteboardview-box-header-border{
    border-bottom: 1px solid #cabbbb;
}
.whiteboardview-box-title{
    display: inline-block;
    font-size: 12px;
    margin: 0;
    line-height: 1;
}
.whiteboardview-box-body {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    padding: 0px 7px 7px 7px;
    margin-bottom: 15px;
}
.whiteboardview-box-footer {
    border-top: 1px solid #cabbbb;
    padding: 10px;
    height:auto;
    display:list-item;
}

.whiteboardview-para {
   font-size: 12px;
   word-wrap: break-word;

}
.whiteboardview-pre {
overflow-x: auto;
white-space: pre-wrap;
word-wrap: break-word;
}
.whiteboardview-task-by{
    float:left;
    font-size: 10px;
    font-weight:600;

}
.whiteboardview-task-date{
    float:right;
    font-size: 10px;
 
}
.whiteboardview-btn-margin{
    margin: 0px 0px 0px 8px;
    width: 15px;
    height: 15px;
}
.myGridNoPaddingStyle .x-grid3-cell-inner {
     padding: 0px;
}

.myGridNoPaddingStyle .x-grid-td {
    overflow: hidden;
    border-width: 0;
    vertical-align: top;
    padding: 0px 5px 0px 5px;
}

.myGridNoPaddingStyle .x-grid-body {
    border-color: #ffffff;
}

.myGridNoPaddingStyle .x-grid-item-selected {
    color: #000;
    background-color: #ffffff;
}


.chatBox {
    width: 100%;
    height: auto;
    overflow: hidden;
    background-color: #FFF;
    border: 1px solid #B5B8C8;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-style: italic;
    line-height: 21px;
    padding: 1%;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    
}

.chatEditor {
    width: 80%;
    height: auto;
    overflow: hidden;
    background-color: #FFF;
    border: 1px solid #58A83E;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-style: italic;
    padding: 2%;
    float: right;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    margin-bottom: 15px;
}

.pro-pic {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 2px solid #FFF;
    float: left;
    background-color: #96CBDA;
    margin-right: 10px;
}

.chat-content {
    width: auto;
    padding-left: 15px;
    margin-top: 10px;
    padding-top: 5px;
}

.chat-details {
    width: 100%;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    color: #307DA3;
    font-style: normal;

    
}


.addCommentPnl .x-grid-view, .x-tree-view {
    z-index: 1;
    background-color: #dfe8f6;
}

.commentArea {
    width: 80%;
    outline: none;
    border: 1px solid #198221;
    float: right;
    margin-top: 5px;
   
    margin-left: 150px;
    padding: 5px;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    font-size: 11px;
    color: gray;
    background-color: white;
    border: none !important;
    
    background-image: none !important;
    margin-right:10px;
    border-image-width:0px !important;
}

#textareaComment-inputWrap {
   
    background-image: none !important;
    outline: none !important;
    border-image-width: 0px !important;
}


.colorCell .x-grid-td {
    overflow: hidden;
    border-width: 0px;
    vertical-align: top;
    background-color: #dfe8f6;
    border: 0px !important;
    padding: 0px !important;
    outline: none !important;
}
.lheight{
    line-height:30px !important;
}



.lheight1 {
    line-height: 30px !important;


    font-weight:bold;
}
.lstyle1 {
    line-height: 30px !important;
    font-weight: normal !important;

}
#commentbtn, #btnsaved {
    float: right !important;
    margin-right: 10px;
}

.taskName{font-size:14px;
          font-weight:bold;
          color:dodgerblue;
          padding-bottom:5px;
}
.newTD {
    font-weight: bold;
    padding-top: 5px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 14px;
}
.newBold{font-weight:bold; padding-right:3px;}
.newBold1 {
    font-weight: bold;
    padding-right: 3px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 16px;
}
.newBold2 {
    font-weight: bold;
    padding-right: 3px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 16px;
    color:white
}
.underline1{width:100%; height:1px; border-bottom:1px solid grey; outline:none; margin-bottom:5px; }

.shtDescription {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 14px;
    line-height: 21px;
    padding: 7px 0;
    overflow-wrap: break-word; 
    word-break: break-word; 
    white-space: normal; 
    display: block;
}


.whiteboardright .x-box-inner{
    float:right;
}
.taskPanel .x-grid-view, .x-tree-view {
    z-index: 1;
    height: 670px !important;
}

.not-box {
    /*width: 300px;*/
    height: auto;
    background-color: #FFF;

}

.not-boxHeading {
    width: 97%;
    height: auto;
    border-bottom: 1px solid #CCC; 
    margin: auto;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    padding-top: 2px;
}

    .not-boxHeading img{
        position:absolute;
        top:0px;
        right:0px;
    }
    .not-boxHeading input {
        float: right;
        position: absolute;
        top: 3px;
        right: 5px;
    }

    .not-box-content {
        width: 97%;
        height: 30px;
        margin: auto;
        padding: 10px 25px 10px 25px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 11px;
        color: black;
    }

.not-box-name {
    width: 50%;
    height: auto;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    float: left;
    border-right:1px dotted grey;
}

.not-box-icons {
    width: 30%;
    float: left;
}

.not-box-date {
    width: 50%;
    float: right;
    text-align: right;
}

.not-grid .x-grid-item-container {
    min-height: 1px;
    position: relative;
    width: 100% !important;

}

.not-grid .x-grid-with-row-lines .x-grid-item:last-child {
    border-bottom-width: 1px;
    width: 100% !important;
   
}

.taskPanel .x-grid-view, .x-tree-view {
    z-index: 1;
    height: 670px !important;
  
}
#notifycount {
    position: absolute;
    top: 10px;
    color: red;
    font-size: 9px;
    font-weight: bold;
    /* float: right; */
    padding-left: 1%;
}
.highlighttab{
    font-size: 13px;
    /*font-style: italic;*/
    color: #635f5f;
    background-image:none!important
}
.userProText{
   font-size: 19px;
   color: #0A657F;
}
.userProTextRole{
    font-size: 13px;
    /*font-style: italic;*/
    color: #635f5f;
}
.userProTextHeader{
   font-size: 19px;
   color: #0A657F;
}
.userProTextInfo{
    font-size: 13px;
    font-weight: bold;
    color: #363535;
}
.userProTextInfoValue{
    font-size: 13px;
    /*color: #363535;*/
}
.userProTextImgLabel{
    background-image: url(../Images/printer.png);
}
.userProfileWindowStyle{
    background: #ffffff;
}

.userProfileWindowStyle .x-window-body-default {
    border-color: #ffffff;
    border-style: solid;
    background: #ffffff;
    color: #000;
    font-size: 12px;
    font-weight: normal;
    font-family: tahoma, arial, verdana, sans-serif;
    width: auto !important;
}

.userProfileWindowStyle  .x-window-header-default {
    font-size: 11px;
    border-color: #a2b1c5;
    background-color: #ced9e7;
    padding: 8px !important;
}
#displayMergeToUserData-innerCt {
    max-width: 555px !important;
    /* height:auto !important;
    display:block !important;
    word-break: break-word !important;
    word-wrap: break-word !important;*/
}
.userProfileHeaderBorder {
    border-bottom: 1px solid #969393;
    width: 100%;
}

.userProfileWindowStyle  .x-window-header-title-default > .x-title-text-default {
    padding: 0 2px 1px;
    text-transform: none;
    font-size: 13px;
}

.contractsGridTable .x-grid-with-row-lines .x-grid-item.x-grid-item-selected {
   border: 1px solid #0769ea;
}

.contractsGridTable .x-grid-item-selected {
    /*color: #000;*/
    /*background-color: greenyellow;*/
}

.siteAuditsGridTable .x-grid-with-row-lines .x-grid-item.x-grid-item-selected {
   border: 1px solid #0769ea;
}

#addUser {
    top: 20px !important;
}
#addRateWindow {
    top: 20px !important;
}
#PrivilegeView {
    top: 20px !important;
}

#userWindow-body {
    overflow: hidden !important;
}

.siteVisitGalleryPanelBody {
    overflow-y: auto;
}
.invoicing-icon{
    width: 16px;
    height: 20px;
}

#SubcontractSearchButton {
    left: 92px !important;
}
#HourlySubcontractorSearchButton {
    left: 135px !important;
}
#HSPayrollSearchButtonSummary {
    left: 125px !important;
}
#HsPayrollsummaryGridFilter {
    left: 165px !important;
}
#COIValue {
    padding-left: 14px !important;
}
#ValidTill-labelTextEl {
    margin-left: 20px !important;
}
#COIValue-labelTextEl {
    margin-left: 20px !important;
}
#subSiteVisitSearchButton {
    left: 100px !important;
}
#nonServicedLocationSearchButton {
    left: 85px !important;
}

.TM-active {
    background: url(../Images/T_M.png) !important;
    cursor: pointer;
}

.TM-inactive {
    background: url(../Images/T_M_grey.png) !important;
    cursor: pointer;
}
.device-active {
    background: url(../Images/device_active.png) !important;
    cursor: pointer;
    margin-right: 15px;
   
}

.device-inactive {
    background: url(../Images/device_block.png) !important;
    cursor: pointer;
    margin-right: 15px;
   
}
.device-disabled {
    background: url(../Images/device_block_grey.png) !important;
    cursor: pointer;
    margin-right: 15px;
}
.EquipmentList {
    background: url(../Images/equipment.png) !important;
    cursor: pointer;
    margin-right:15px;
  
}
/* for all checkboxgroups inside your addUser window */
#addUser .role-checkboxgroup .x-form-cb-wrap {
    width: 15% !important; /* 6 columns fits perfectly in 980px */
    white-space: normal !important; /* allow multi-line text */
    word-break: break-word !important;
    line-height: 1.2em;
}

.UsersList {
    background: url(../Images/Assign.png) !important;
    cursor: pointer;
    margin-right: 15px;
}
#SVactiveEvents-labelTextEl{
    margin-left:50px;
}
#subsiteVisitsGridFilter {
    left :145px !important;
}
#subsiteVisitsGridFilter-labelTextEl {
    margin-left: 15px;
}
#siteVisitsGridFilter {
    left: 145px !important;
}

#siteVisitsGridFilter-labelTextEl {
    margin-left: 15px;
}
#tnmServicesGridFilter {
    left: 145px !important;
}
#tnmServicesGridFilter-labelTextEl {
    margin-left: 15px;
}
#workTicketsGridFilter {
    left: 145px !important;
}
#workTicketsGridFilter-labelTextEl {
    margin-left: 15px;
}
#LocationsByVisitsGridFilter {
    left: 145px !important;
}
#LocationsByVisitsGridFilter-labelTextEl {
    margin-left: 15px;
}
#RoutesByStatusGridFilter {
    left: 145px !important;
}
#RoutesByStatusGridFilter-labelTextEl {
    margin-left: 15px;
}
#AreaByStatusGridFilter {
    left: 145px !important;
}
#AreaByStatusGridFilter-labelTextEl {
    margin-left: 15px;
}
#LocationsByServicingTimeGridFilter {
    left: 145px !important;
}
#LocationsByServicingTimeGridFilter-labelTextEl {
    margin-left: 15px;
}
#DriverGridFilter {
    left: 145px !important;
}
#DriverGridFilter-labelTextEl {
    margin-left: 15px;
}
#locationByVisitsFilter {
    left: 145px !important;
}
#locationByVisitsFilter-labelTextEl {
    margin-left: 15px;
}
#DriverGridFilters {
    left: 185px !important;
}
#DriverGridFilters-labelTextEl {
    margin-left: 15px;
}
#contractsGridFilter {
    position: relative;
    left: 145px !important;
}
#contractsGridFilter-labelTextEl {

    margin-left: 15px;
}
#SiteauditsGridFilter {
    position: relative;
    left: 145px !important;
}

#SiteauditsGridFilter-labelTextEl {
    margin-left: 15px;
}
#PlanauditsGridFilter {
    position: relative;
    left: 145px !important;
}

#PlanauditsGridFilter-labelTextEl {
    margin-left: 15px;
}
#LocationassignGridFilter {
    left: 145px !important;
}
#LocationassignGridFilter-labelTextEl {
    margin-left: 15px;
}
#usersGridFilter {
    left: 145px !important;
}
#usersGridFilter-labelTextEl {
    margin-left: 15px;
}
#subContractorsGridFilter {
    left: 145px !important;
}
#subContractorsGridFilter-labelTextEl {
    margin-left: 15px;
}
#HourlysubContractorsGridFilter {
    left: 165px !important;
}
#HourlysubContractorsGridFilter-labelTextEl {
    margin-left: 15px;
}
#ServiceRecordsLocationsGridFilter {
    left: 165px !important;
}

#ServiceRecordsLocationsGridFilter-labelTextEl {
    margin-left: 15px;
}
.userImageUpload {
    height: 22px;
    width: 89px;
    cursor: pointer;
}
.collapsible {
    background-color: #777;
    color: white;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    margin-bottom: 2px;
}

    .active, .collapsible:hover {
        background-color: #555;
    }

.content {
    padding: 0 18px;
    display: block;
    overflow: hidden;
   
}
.author_bio_toggle_wrapper {
}

#author_bio_wrap {
    margin-top: 0px;
    margin-bottom: 30px;
    background: gray;
    width: auto;
    height: 50px;
}
#Nocharge {
    background: url(../Images/noCharge1.png) !important;
    height:27px;
    width:42px;
    border-radius:3px;border:none;


}
.cancelCallback {
    background-image: url(../Images/Called_Back_cancel.png) !important;
    width: 16px;
    height: 16px;
    display: block;
}
.markAsArrived {
    background-image: url(../Images/status3.png) !important;
    width: 16px;
    height: 16px;
    display: block;
}
.markAsInfield {
    background-image: url(../Images/status2.png) !important;
    width: 16px;
    height: 16px;
    display: block;
}
.x-menu-item-text {
    font-weight: bold !important;
}
.x-item-disabled.userSkill-enabled {
    background: url(../Images/userSkill_inactive.png) !important;
    background-size: 16px 16px !important;
}
.userSkill-enabled {
    background: url(../Images/userSkill.png);
    background-size: 16px 16px;
}
.x-item-disabled.userRating-enabled {
    background: url(../Images/userRating_inactive.png) !important;
    background-size: 16px 16px !important;
}
.userRating-enabled {
    background: url(../Images/userRating.png);
    background-size: 16px 16px;
}
.x-item-disabled.userDocs-enabled {
    background: url(../Images/docs_inactive.png) !important;
    background-size: 16px 16px !important;
}

.userDocs-enabled {
    background: url(../Images/docs.png);
    background-size: 16px 16px;
}
.x-item-disabled.payrollNotAddedButton {
    background: url(../Images/payroll_disabled.png) !important;
    background-size: 16px 16px !important;
}
.x-item-disabled.payrollPartialButton {
    background: url(../Images/payroll_disabled.png) !important;
    background-size: 16px 16px !important;
}
.x-item-disabled.payrollAllDataButton {
    background: url(../Images/payroll_disabled.png) !important;
    background-size: 16px 16px !important;
}
.x-item-disabled.payrollExportedButton {
    background: url(../Images/payroll_disabled.png) !important;
    background-size: 16px 16px !important;
}
.payrollExportedButton {
    background: url(../Images/payroll.png);
    background-size: 16px 16px;
}

.payrollAllDataButton {
    background: url(../Images/AddPayrollDetails.png);
    background-size: 16px 16px;
}
.payrollPartialButton {
    background: url(../Images/payrollDetails_partial.png);
    background-size: 16px 16px;
}
.payrollNotAddedButton {
    background: url(../Images/payrollDetails_notAdded.png);
    background-size: 16px 16px;
}
.payrollDetails_New {
    background: url(../Images/PayrollDetails_New.png);
    background-size: 16px 16px;
}
.payrollDetails_Pending {
    background: url(../Images/PayrollDetails_Edited.png);
    background-size: 16px 16px;
}
.payrollDetails_Completed {
    background: url(../Images/PayrollDetails_Done.png);
    background-size: 16px 16px;
}
.payrollDetails_Exported {
    background: url(../Images/PayrollDetails_Exported.png);
    background-size: 16px 16px;
}
.payrollDetails_Exported_Selected {
    background: url(../Images/PayrollDetails_Exported_Selected.png);
    background-size: 16px 16px;
}
.grouped-list .x-boundlist-item {
    padding: 1px 3px 0 10px;
}

.grouped-list .group-header {
    padding: 4px;
    font-weight: bold;
    border-bottom: 1px solid #ddd;
}
.x-item-disabled.userRateButton {
    background: url(../Images/rate_disabled.png) !important;
    background-size: 16px 16px !important;
}
.no-action-cursor  {
    cursor: none; 
}
.OBATickbutton {
    background: url(../Images/tick_oba.png);
    background-size: 16px 16px;
}
.OBAUnTickbutton {
    background: url(../Images/untick_oba.png);
    background-size: 16px 16px;
}

.userRateButton {
    background: url(../Images/rate.png);
    background-size: 16px 16px;
}
.textboxasLabel{
    border: none !important;
    border-width: 0 !important;
    background-image: none !important;
    background-color: transparent !important;
}
.userRemarks .x-form-text-default.x-form-textarea {
    min-height: 54px;
}
.infrastructureRadioGroup {
    display: flex !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 15px !important;
    width: 100% !important;
    text-align: center !important;
}

    .infrastructureRadioGroup .x-form-radio-wrap {
        white-space: nowrap !important;
    }

.center-radio-item {
    margin: 5px !important;
}

.verificationtxtbox::-webkit-outer-spin-button,
.verificationtxtbox::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.seasonalRatesDeleteIconRed {
    background-image: url('../Images/Delete_Stop.png') !important;
}

.seasonalRatesDeleteIconBlack {
    background-image: url('../Images/Delete_Stop_disabled.png') !important;
}

.custom-file-field .x-form-trigger.x-form-trigger-cmp {
/*    display: none !important;*/
}
.custom-file-field {

}

.custom-file-field-icon {
    width: 75%; 
    white-space: normal; 
    overflow-wrap: break-word; 
    word-break: break-word;
    line-height: 1.2em; 
    padding: 5px; 
    text-align: left; 
    right: 378px;

    top: 20px;
    position:relative;
}

    .custom-file-field .x-form-text-field-body-default {
        width: 78%;
    }
    .custom-file-field .x-form-item-label-default {
        vertical-align: top;
    }
    .custom-file-field .x-form-text {
        height: calc(100% + 20px) !important;
    }
    .custom-preview-button {
    background: url('../Images/view.png') no-repeat center left;
    left: 440px !important;
}

.custom-delete-button {
    background: url('../Images/deleteContact.png') no-repeat center left;
    left: 459px !important;
}
.thumbnail-and-extension-container {
    display: flex ;
    align-items: center;
     margin-top: 1px; 
    flex-direction: row;
/*    justify-content: center;*/
     width: 298px; 
     overflow:auto;
     height: 58px; 
    /* border: 1px solid #ddd; */
    position: relative;
    /* padding: 5px; */
    right: 325px;
/*    margin-top: 10px;
    margin-left: 10px;*/
}
}

.thumbnail-preview {
    margin-bottom: 5px;
    width:30px;
    height:30px;
}

.generic-file-icon {
    margin-top: 7px;
    width: 36px;
    height: 36px;
}

.file-extension-text {
    font-size: 9px;
    color: #333;
    text-align: center;
}
.remove-button {
    position: absolute;
    top: 3px;
    right: 3px;
    background-color: red;
    color: white;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 14px;
    line-height: 1;
}
.tag {
    display: inline-block;
    background-color: #cdd9e9;
    color: #000000;
    padding: 3px 5px;
    margin-bottom: 5px;
    border-radius: 5px;
    font-size: 11px;
    position: relative;
}
.remove-tag {
    display: inline-block;
    width: 14px;
    height: 14px;
    background-color: #d20e0f;
    color: #ffffff;
    border-radius: 50%;
    text-align: center;
    line-height: 14px;
    font-size: 11px;
    font-weight: bold;
    cursor: pointer;
    margin-left: 8px;
}
/* Apply styles to all scrollable elements */
#SplitsiteVisitTnM ::-webkit-scrollbar {
    width: 6px; /* Thin scrollbar width */
    height: 6px; /* Thin scrollbar height for horizontal scroll */
}

#SplitsiteVisitTnM ::-webkit-scrollbar-thumb {
    background-color: #3b96f3; /* Blue color for the scrollbar */
    border-radius: 3px; /* Rounded corners for the scrollbar */
}

#SplitsiteVisitTnM ::-webkit-scrollbar-track {
    background-color: #f1f1f1; /* Light gray track background */
    border-radius: 3px;
}

#seasonalLimitedRatesForm ::-webkit-scrollbar {
    width: 6px; /* Thin scrollbar width */
    height: 6px; /* Thin scrollbar height for horizontal scroll */
}

#seasonalLimitedRatesForm ::-webkit-scrollbar-thumb {
    background-color: #3b96f3; /* Blue color for the scrollbar */
    border-radius: 3px; /* Rounded corners for the scrollbar */
}

#seasonalLimitedRatesForm ::-webkit-scrollbar-track {
    background-color: #f1f1f1; /* Light gray track background */
    border-radius: 3px;
}

#editlocationwindow ::-webkit-scrollbar {
    width: 6px; /* Thin scrollbar width */
    height: 6px; /* Thin scrollbar height for horizontal scroll */
}

#editlocationwindow ::-webkit-scrollbar-thumb {
    background-color: #3b96f3; /* Blue color for the scrollbar */
    border-radius: 3px; /* Rounded corners for the scrollbar */
}

#editlocationwindow ::-webkit-scrollbar-track {
    background-color: #f1f1f1; /* Light gray track background */
    border-radius: 3px;
}
.issnowiceincludedIcon .x-form-checkbox {
    background: url(../Images/icegrey.png);
    height: 40px;
    width: 40px;
    background-repeat: no-repeat;
    background-color: transparent;
    cursor: pointer;
    top: -7px;
}

.issnowiceincludedIconChecked .x-form-checkbox {
    background: url(../Images/iceblue.png);
    height: 40px;
    width: 40px;
    background-repeat: no-repeat;
    background-color: transparent;
    cursor: pointer;
    top: -7px;
}
#SplitsiteVisitReadonly ::-webkit-scrollbar {
    width: 6px; /* Thin scrollbar width */
    height: 6px; /* Thin scrollbar height for horizontal scroll */
}

#SplitsiteVisitReadonly ::-webkit-scrollbar-thumb {
    background-color: #3b96f3; /* Blue color for the scrollbar */
    border-radius: 3px; /* Rounded corners for the scrollbar */
}

#SplitsiteVisitReadonly ::-webkit-scrollbar-track {
    background-color: #f1f1f1; /* Light gray track background */
    border-radius: 3px;
}
.custom-icon12 {
    width: 23px !important;
    height: 23px !important;
}
.boundaryname {
    word-Wrap: break-word;
    white-Space: normal;
}
.whiteboardview-header {
    display: flex;
    align-items: center; 
    flex-wrap: nowrap; 
    width: 100%;
}

.whiteboardview-icons {
    display: flex;
    margin-left: auto;
    gap: 1px; 
    flex-wrap: nowrap; 
}
.keys-action-icon {
    width: 16px !important;
    height: 16px !important;
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px 16px;
}
.status-default-disabled {
    opacity: 0.4 !important;
    cursor: not-allowed !important;
    background: url(../Images/Ok_Active.png) !important;
}

.keys-generate-icon {
    background-image: url('../Images/key_green.png');
}

.keys-history-icon {
    background-image: url('../Images/history.png');
    margin-left: 7px;
}
    .keys-generate-icon.masked, .keys-history-icon.masked {
        -webkit-mask-image: url('../Images/key_green.png');
        mask-image: url('../Images/key_green.png');
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        background-color: #3074a3;
    }