body,
div,
h1,
h2,
h4,
h5,
h6,
img,
img a,
a img,
form,
fieldset,
blockquote {
    margin: 0;
    padding: 0;
    border: 0;
    font-family: Arial, Helvetica, sans-serif;
}

body {
    font-size: 13px;
    color: #626262;
    background-color: #CFD9E2;
}

*:focus {
    outline-color: #0BA9DD;
}

p {
    margin: 0 0 10px 0;
}

a.hiddenlink {
    text-decoration: none;
}

a.hiddenlink:visited {
    text-decoration: none;
}

a.hiddenlink:link {
    text-decoration: none;
}

a.hiddenlink:hover {
    text-decoration: none;
}
.site-search-help {
  margin-top: 10px;
  font-size: 13px;
}

a.clickableColHdr {
    text-decoration: none;
}

a.clickableColHdr:visited {
    text-decoration: none;
}

a.clickableColHdr:link {
    text-decoration: none;
}

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

a.wastereport {
    text-decoration: none;
}

a.wastereport:visited {
    text-decoration: none;
}

a.wastereport:link {
    text-decoration: none;
}

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

a.wastereport {
    color: #FFFFFF;
}


/***************************************************
************* FORMS FROM CONTROL PANEL *************
***************************************************/

input.styled {
    background-image: none;
    background-position: 0px -39px;
    padding: 0 12px;
    width: 240px;
    height: 39px;
    line-height: 39px;
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #008FCE;
    border: 1px solid rgba(25, 26, 30, 0.20);
    border-radius: 3px;
}

textarea.styled {
    background-image: none;
    background-repeat: repeat-x;
    background-position: 0px -39px;
    padding: 0 12px;
    width: 271px;
    height: 80px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    border: 1px solid rgba(25, 26, 30, 0.20);
    border-radius: 3px;
}

.notecount {
    width: 24px;
    height: 24px;
    color: #FFFFFF;
    font-weight: bold;
    font-size: 13px;
    text-align: center;
    line-height: 25px;
    background-color: #339FDB;
    border-radius: 4px;
}

.btnRequestReport,
.btnAdvancedFilter,
.btnExportChoose,
.btnExport,
.btnCreateMailshot,
.viewselector {
    margin-left: 5px;
    cursor: pointer;
}

.wsorderstatus {
    width: 24px;
    height: 24px;
    color: #FFFFFF;
    font-weight: bold;
    font-size: 13px;
    text-align: center;
    line-height: 24px;
}

.wsorderstatusdonotsend {
    background-image: url(../images/website/icon_order_donotsend.svg);
}

.wsorderstatuspending {
    background-image: url(../images/website/icon_order_pending.svg);
}

.wsorderstatussent {
    background-image: url(../images/website/icon_order_sent.svg);
}

.socount {
    background-image: url(images/icon_count.png);
    width: 24px;
    height: 24px;
    color: #FFFFFF;
    font-weight: bold;
    font-size: 13px;
    text-align: center;
    line-height: 24px;
}

.tagflag {
    background-image: url(images/icon_count.png);
    width: 24px;
    height: 24px;
    color: #FFFFFF;
    font-weight: bold;
    font-size: 13px;
    text-align: center;
    line-height: 24px;
    margin-left: 5px;
    margin-right: 5px;
}

input.styled.settings select.styled.settings {
    width: 120px;
}

input.styled.left {
    float: left;
}

input.styled.right {
    float: right;
    margin-bottom: 5px;
}

input.styled.settings.checkbox {
    margin-right: 172px;
}

input.styled.date {
    margin-bottom: 0px;
}

select.styled.right {
    float: right;
    margin-bottom: 5px;
}

input.styled.time {
    width: 73px;
}

input.styled.timedt {
    width: 73px;
}

input.styled.datedt{
  width: 70px;
}

input.styled.tasktitle,
span.styled.tasktitle{
  font-size: 18px;
}

input.styled.timeout {
    height: 4px;
    width: 80px;
}

input.styled.fieldwidth {
    height: 6px;
    width: 60px;
}

input.styled.fsetquantity {
    width: 60px;
    height: 8px;
}

input.styled.fsettext {
    width: 140px;
    height: 8px;
}

input.styled.checkbox {
    width: 16px;
}

select.styled.time {
    width: 100px;
}

select.styled.sym_code {
    width: 300px;
}

span.styled {
    width: 162px;
    line-height: 1;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: bold;
    color: #000000;
}

span.contact_inactive, span.user_inactive {
    font-style: italic;
    color: #d10e25;
}

span.contactduty_inactive {
    font-weight: bold;
    color: #d10e25;
}

span.dutydatemissing{
    margin-left: 20px;
    font-weight: bold;
    color: #d10e25;

}

span.pane_hidden,
span.panefield_hidden,
span.assetcategory_hidden,
span.filter_hidden {
    font-style: italic;
    font-weight: bold;
    color: #d10e25;
}

span.category_pause {
    font-style: italic;
    color: #FF0000;
}

img.subcontractor_edit,
img.subcontractorcanceledit,
img.subcontractorsaveedit{
  cursor: pointer;
  margin-top: 1px;
}

img.subcontractor_delete{
  cursor: pointer;
}

img.contactsite_delete,
img.contactduty_delete,
img.contactticket_delete,
img.vacancyduty_delete {
    float: right;
    cursor: pointer;
}

img.sitebunit_delete, img.prospectbunit_delete {
    float: right;
    cursor: pointer;
    margin-top: -5px;
}

img.reference_delete {
    float: right;
    cursor: pointer;
}

img.candidate_put_delete {
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.candidate_int_delete {
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.candidate_pla_delete {
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.contactcv_delete,
img.contactother_delete,
img.contactnotesdoc_delete {
    float: right;
    cursor: pointer;
}

img.prospectquotation_delete,
img.prospectserviceinstruction_delete,
img.clientdocument_delete,
img.groupdocument_delete,
img.quotedocument_delete,
img.mailshotattachment_delete {
    float: right;
    cursor: pointer;
}

img.vacancyattachment_delete {
    float: right;
    cursor: pointer;
}

img.contactoffice_delete {
    float: right;
    cursor: pointer;
}

img.office_delete,
img.region_delete {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.wlisted_delete {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.group_delete {
    float: right;
    cursor: pointer;
    margin-right: 6px;
}

img.client_delete,
img.order_delete,
img.message_delete {
    float: right;
    cursor: pointer;
    margin-right: 6px;
}

img.reminder_delete {
    float: right;
    cursor: pointer;
    margin-top: -1px;
    margin-left: 5px;
    margin-right: 6px;
}

img.prospect_delete {
    float: right;
    cursor: pointer;
    margin-right: 6px;
}

img.bunit_delete {
    float: right;
    cursor: pointer;
    margin-right: 6px;
}

img.user_delete,
img.driver_delete {
    float: right;
    cursor: pointer;
    margin-right: 6px;
}

img.user_status,
img.driver_status {
    float: right;
    cursor: pointer;
    margin-right: 6px;
}

img.restrictedimage {
    margin-top: 10px;
}

img.site_delete {
    margin-left: 5px;
    float: right;
    cursor: pointer;
    margin-right: 6px;
}

img.quote_delete,
img.task_delete,
img.mailshot_delete {
    margin-left: 5px;
    float: right;
    cursor: pointer;
    margin-right: 6px;
}

img.addgroup_delete {
    margin-top: -5px;
    float: right;
    cursor: pointer;
    margin-right: 6px;
    margin-left: 5px;
}

img.addgroup_addcodes {
    margin-top: -5px;
    float: right;
    cursor: pointer;
}

img.addcode_delete {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.ourwastetype_delete {
    margin-top: -5px;
    float: right;
    cursor: pointer;
}

img.note_delete {
    float: right;
    cursor: pointer;
    margin-top: -5px;
}

img.interview_delete {
    float: right;
    cursor: pointer;
}

img.tenant_delete,
img.template_delete {
  margin-top: 5px;
}

img.vacancy_reinstate {
    margin-top: 9px;
}

img.vacancy_delete {
    margin-top: 9px;
}

img.unfollow {
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.note_reminder {
    margin-top: -5px;
    float: right;
}

img+img.note_reminder {
    margin-top: -4px;
    float: right;
    margin-right: 5px;
}

img.contact_phone {
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.contact_email {
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.contact_delete,
img.candidate_delete,
img.mailshotcontact_delete,
img.mailshotcontact_noemail,
img.mailshotcontact_nophone {
    margin-left: 5px;
    float: right;
    cursor: pointer;
    margin-right: 6px;
}

img.report_view {
    margin-top: 5px;
}

a.pdflink {
    display: block;
}

img.report_delete,
img.report_view {
    margin-top: 5px;
    margin-left: 10px;
}

img.remindernote {
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.contact_type {
    float: left;
    margin-right: 14px;
    margin-bottom: 3px;
}

img.interest_delete {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.interest_options {
    margin-top: -5px;
    float: right;
    cursor: pointer;
}

img.option_delete {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.vreason_delete {
    margin-top: -5px;
    float: right;
    cursor: pointer;
}

img.entertainment_delete {
    margin-top: -5px;
    float: right;
    cursor: pointer;
}

img.position_delete {
    margin-top: -5px;
    float: right;
    cursor: pointer;
}

img.source_delete {
    margin-top: -5px;
    float: right;
    cursor: pointer;
}

img.psource_delete,
img.pstatus_delete,
img.term_delete,
img.tasktype_delete {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.expensetype_delete, img.duty_delete, img.ticket_delete {
    margin-top: -5px;
    float: right;
    cursor: pointer;
}

img.notetype_delete {
    margin-top: -5px;
    float: right;
    cursor: pointer;
}

img.segment_delete {
    margin-top: -5px;
    float: right;
    cursor: pointer;
}

img.service_delete {
    margin-top: -5px;
    float: right;
    cursor: pointer;
}

img.category_delete {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.fset_delete,
img.pane_delete,
img.listfield_delete {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.prodtype_delete {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.attribute_delete {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.subtype_delete {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.product_delete {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.prodattribute_delete,
img.prodsubtype_delete {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.bucket_delete, img.assetcategory_delete, img.subcontractortype_delete {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.prodtype_attributes {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.prodtype_subtypes {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.prodtype_products {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.product_attributes,
img.product_subtypes {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.login_delete {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.fset_fields,
img.pane_fields {
    margin-top: -5px;
    float: right;
    cursor: pointer;
}

img.field_indent {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.field_move {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.attribute_move,
img.subtype_move,
img.productsubtype_move {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.category_move {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.pstatus_move {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

.div_actions {
    float: right;
    margin-top: -13px;
}

span.indent1 {
    margin-left: 20px;
}

img.field_delete,
img.panefield_delete,
img.panefield_hide,
img.assetcategory_hide {
    margin-top: -5px;
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.package_delete {
    float: right;
    cursor: pointer;
}

img.sitecontact_followed {
    margin-left: 5px;
    xmargin-top: 3px;
    float: right;
    cursor: pointer;
}

img.office_followed {
    margin-top: -4px;
    float: right;
    cursor: pointer;
}

img.office_badpcode {
    margin-top: -5px;
    float: right;
}

img.site_followed {
    margin-top: 2px;
    float: right;
    cursor: pointer;
}

div.inlinebunitfilter select {
    height: 29px;
    line-height: 29px;
}

div.sitecontact_note {
    margin-left: 5px;
    margin-top: -14px;
    float: right;
    cursor: pointer;
}

div.reminder_note {
    margin-left: 5px;
    margin-top: 0px;
    float: right;
    cursor: pointer;
}

img.sitecontact_phone {
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.sitecontact_email {
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.sitecontact_delete {
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.referee_phone {
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

img.referee_email {
    margin-left: 5px;
    float: right;
    cursor: pointer;
}

input.styled:focus {
    background-color: #FFF;
    outline: none;
    color: #000;
}

input.narrow {
    width: 164px;
}

input.styled.hint_text {
    color: #8F8F8F;
}

.labelCheckbox {
    display: block;
    line-height: 16px;
    color: #4F4F4F;
    font-size: 12px;
    margin: 0 0 7px 0;
    font-family: Arial, Helvetica, sans-serif;
    padding: 0;
    cursor: pointer;
}

.labelCheckbox * {
    cursor: pointer;
}

.labelCheckbox.on {
    font-weight: bold;
}

.checkbox {
    width: 16px;
    height: 16px;
    background-image: url(images/form_checkbox.png);
    background-repeat: no-repeat;
    background-position: 0px top;
    cursor: pointer;
}

.checkbox:hover,
.labelCheckbox:hover .checkbox {
    background-position: -16px top;
}

.checkbox.on {
    background-position: -32px top;
}

.checkbox.on:hover,
.labelCheckbox:hover .checkbox.on {
    background-position: -48px top;
}

.labelCheckbox .checkbox {
    float: left;
    margin: 0 10px 0 0;
}

.labelRadio {
    display: block;
    width: 51px;
    height: 13px;
    line-height: 13px;
    font-family: Arial, Helvetica, sans-serif;
    color: #4B4B4B;
    font-size: 10px;
    padding: 0 0 0 11px;
    margin: 0;
    float: left;
    cursor: pointer;
}

.radio {
    width: 13px;
    height: 13px;
    background-image: url(images/form_radio.png);
    background-repeat: no-repeat;
    background-position: 0px top;
    cursor: pointer;
    margin: 0 3px 0 0;
}

.radio:hover,
.labelRadio:hover .radio {
    background-position: -13px top;
}

.radio.on {
    background-position: -26px top;
}

.radio.on:hover,
.labelRadio:hover .radio.on {
    background-position: -39px top;
}

.labelRadio .radio {
    float: left;
}

.select {
    margin: 0;
    width: 288px;
    height: 41px;
    font-weight: bold;
    background-color: #F6F6F6;
    padding-left: 8px;
    border: 1px solid rgba(25, 26, 30, 0.20);
    border-radius: 3px;
    transition: background-color .2s, color .2s;
    cursor: pointer;
}

html.ios .select div,
html.android .select div {
    pointer-events: none;
}

.selectGhost {
    position: absolute;
    opacity: 0;
    z-index: 4;
}

.select.left {
    margin: 0;
    float: left;
}

.select.vnarrow {
    width: 100px;
}

.select.narrow {
    width: 140px;
}

.select.medium {
    width: 170px;
}

.select.margtop {
    margin-top: 10px;
}

.select.multiple {
    line-height: 20px;
    height: 100px;
}

.select p {
    padding: 0 0 0 14px;
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #008FCE;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.select.narrow p {
    overflow: hidden;
}

.select.right {
    margin-right: 0;
}

.select.task{
  xbackground-color: #FFFFFF;
  color: #000000;
}

.select.task:disabled{
  background-color: #FFFFFF;
}

.select * {
    user-select: none;
}

.select:focus {
    background-color: #F6F6F6;
    border: 1px solid rgba(25, 26, 30, 0.30);
    color: #000;
}

.selectButton {
    float: right;
    width: 39px;
    height: 39px;
}

.select.open .selectButton {
    background-position: center bottom;
}

.selectedOption,
.option {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: #333;
}

.selectedOption {
    height: 39px;
    line-height: 39px;
    background-image: none;
    background-repeat: repeat-x;
    background-position: left top;
    height: 39px;
    line-height: 39px;
    background-color: #F6F6F6;
    border: 1px solid rgba(25, 26, 30, 0.20);
    border-radius: 3px;
    transition: background-color .2s, border-color .1s, box-shadow .1s, color .2s, border-radius .2s;
}

.select p {
    height: 39px;
    line-height: 39px;
}

.selectedOption:hover,
.select.open .selectedOption {
    background-color: #FFF;
    color: #000;
}

.select.open .selectedOption {
    box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.5);
    border-color: #999;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}

.option {
    padding: 0;
    height: 39px;
    line-height: 39px;
    border-width: 0 1px 1px 1px;
    border-style: solid solid dashed solid;
    border-color: transparent #999 #CCC #999;
    -webkit-transition: background-color .2s, color .2s;
    -moz-transition: background-color .2s, color .2s;
    -o-transition: background-color .2s, color .2s;
    -ms-transition: background-color .2s, color .2s;
    transition: background-color .2s, color .2s;
}

.option.last {
    border-bottom-style: solid;
    border-bottom-color: #999;
    -webkit-border-bottom-right-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

.option.hovered {
    background-color: rgba(0, 0, 0, 0.05);
    color: #000;
}

.option p span.selectFiltered {
    background-color: yellow;
}

.selectOptionWrapper {
    position: absolute;
    overflow: hidden;
    z-index: 3;
    background-image: url(images/gradient_bg.png);
    background-repeat: repeat-x;
    background-position: left -78px;
    background-color: #FFF;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    -webkit-border-bottom-right-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

.select.small,
.select.small .selectedOption,
.select.small .option,
.select.small .selectButton {
    height: 26px;
    line-height: 26px;
}

.select.small {
    margin: 0 16px 0 0;
    float: right;
    border-right: 1px solid #999;
    border-bottom: 1px solid #999;
    width: 197px;
}

.select.small .selectButton {
    width: 26px;
    background-position: center -6px;
}

.select.open.small .selectButton {
    width: 26px;
    background-position: center -45px;
}

.select.small .option {
    width: 173px;
    border-right: 1px solid #999;
    border-bottom: 1px solid #999;
}

.span.tooltipData {
    font-weight: bold;
}

.sliderWrapper {
    width: 81%;
    margin: 0 auto 55px;
}

.sliderTooltip {
    background-repeat: no-repeat;
    background-position: left top;
    height: 42px;
    position: absolute;
    margin-top: 25px;
    background-image: url(images/slider_tooltip_small_white.png);
    width: 38px;
    position: absolute;
    margin-left: -8px;
}

.salarySliderWrapper .sliderTooltip {
    background-image: url(images/slider_tooltip_large_white.png);
    width: 78px;
    position: absolute;
    margin-left: -26px;
}

.sliderTooltip p.data,
.sliderTooltip p.dataMixed {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-weight: bold;
    color: #008FCE;
    line-height: 1;
    padding: 7px 0 3px;
    margin: 0;
    text-align: center;
    border-bottom: 1px dotted #99D2EC;
    -webkit-transition: border-color .5s;
    -moz-transition: border-color .5s;
    -o-transition: border-color .5s;
    -ms-transition: border-color .5s;
    transition: border-color .5s;
}

.sliderTooltip p.dataType {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 8px;
    font-weight: bold;
    line-height: 1;
    color: #008FCE;
    padding: 2px 0 0;
    margin: 0;
    text-align: center;
    text-transform: uppercase;
}

.ui-datepicker {
    z-index: 1000 !important;
}

.ui-slider {
    background-image: url(images/slider_small_track_large.png);
    background-repeat: no-repeat;
    background-position: center 8px;
    background-color: transparent;
    border: 0;
}

.ui-slider-range {
    background-image: url(images/slider_small_track_large_range.png);
    background-repeat: no-repeat;
    background-position: center 8px;
    background-color: transparent;
    border: 0;
}

.ui-slider-horizontal {
    height: 25px;
}

.ui-slider .ui-slider-handle {
    width: 25px;
    height: 25px;
    background-image: url(images/slider_handle.png);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-color: transparent;
    border: 0;
    cursor: pointer;
}

.ui-slider .ui-slider-handle:hover,
.ui-slider .ui-slider-handle.ui-state-active {
    background-position: -25px 0px;
}

.ui-slider .ui-slider-handle:hover .sliderTooltip,
.ui-slider .ui-slider-handle.ui-state-active .sliderTooltip {
    background-position: right top;
}

.ui-slider .ui-slider-handle:focus {
    outline: none;
    background-color: #81DA93;
}

.ui-slider-horizontal .ui-slider-handle {
    margin-left: -12px;
    top: 0;
}

.btn {
    user-select: none;
    margin: 0;
    padding: 0;
    transition: background-color .4s;
    cursor: pointer;
    background-image: none;
    background-color: #339FDB;
    border: none;
    border-radius: 4px;
}

.btn,
.btn p {
    height: 39px;
    line-height: 39px;
}

.btn p {
    margin: 0;
    padding: 0 10px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #FFF;
    text-align: center;
}

.btn a {
    display: block;
    text-decoration: none;
    width: 100%;
    height: 100%;
}

.btn.left {
    float: left;
}

.btn.right {
    float: right;
}

.btn.new, .btn.save {
    margin-left: 20px;
    background-color: #64CE79;
}

.btn.new:hover, .btn.save:hover {
    background-color: #81DA93;
}

.btn.newrecordno {
    margin-left: 6px;
}

.btn.center {
    margin-left: auto;
    margin-right: auto;
}

.btn.green {
    border-color: #AED55F #799E2A #799E2A #AED55F;
    background-image: url(images/gradient_bg_green.png);
    background-color: #BCDC7A;
}

.btn.green:hover {
    background-color: #E9F4D4;
}

.btn.green p {
    color: #FFF;
    font-size: 13px;
    font-weight: bold;
    margin-left: 80px;
}

.btn.apply {
    width: 87px;
}

.btn.apply,
.btn.apply p {
    height: 35px;
    line-height: 35px;
}

.btn.rcApplyAppliedBtn p.applied {
    display: none;
}

.btn.rcApplyAppliedBtn.applied {
    cursor: default;
}

.btn.rcApplyAppliedBtn.applied p.applied {
    display: block;
}

.btn.rcApplyAppliedBtn.applied p.apply {
    display: none;
}

.btn.search p {
    padding: 0 39px 0 22px;
    background-image: url(images/btn_search_bg.png);
    background-repeat: no-repeat;
    background-position: 79px center;
}

.btn.search.loading p {
    background-image: url(images/search_loading.gif);
    background-position: 76px center;
}

.btn.version{
  color: #FFFFFF;
  font-weight: bold;
  padding: 0px 2px 20px 2px;
  margin-right: 10px;
  width: 15px;
  height: 12px;
}

.btn:hover {
    background-color: #FFF;
    transition: background-color .2s;
}

.btn:active {
    border-color: #AAA;
    box-shadow: inset 0px 0px 7px rgba(0, 0, 0, 0.5);
}

.btn.close {
    background-image: url(images/popup_close.png);
    min-width: 39px;
    background-position: center;
    background-repeat: no-repeat;
}

.btn.note {
    width: 34px;
    height: 34px;
}

.btn.note .btnInner {
    background-image: url(images/btn_add_note.png);
}

.btn.send,
.btn.newversion,
.btn.hirecontract,
.btn#btnApprove {
    background-color: #64CE79;
}

.btn.hirecontract.not-allowed {
    background-color: #B4B5B6;
}

.btn.hirecontract.not-allowed:hover {
  background-color: #B4B5B6;
}

.btn.newversion,
.btn.hirecontract {
  margin-left: 30px;
  margin-top: -10px;
}

.btn.send:hover,
.btn.newversion:hover,
.btn.hirecontract:hover {
  background-color: #81DA93;
}

.btn.exit {
    color: #339FDB;
    background-color: #000000;
}

.loading {
    margin: 5px;
}

#btnCancelDelete {
    margin-right: 10px;
}


/***************************************************
******************* END OF FORMS *******************
***************************************************/


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


/**************** FORMS OVERRIDES *****************/


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

input.styled {
    float: left;
    width: 243px;
    height: 14px;
    line-height: 1;
    padding: 7px 12px;
    font-size: 13px;
    font-weight: bold;
    color: #000;
}

input.styled.settings.tinyint {
    width: 30px;
    height: 10px;
    margin-right: 199px;
}

input.styled.settings.panefieldlabel,
input.styled.settings.fieldlabel {
    width: 229px;
}

select.styled.panefieldtype,
select.styled.fieldtype {
    width: 255px;
}

textarea.styled.panefieldvalues,
textarea.styled.fieldvalues {
    width: 230px;
    margin-left: 135px;
    margin-bottom: 10px;
}

textarea.styled.panefieldsubtitle,
textarea.styled.fieldsubtitle {
    width: 230px;
    margin-left: 135px;
    margin-bottom: 10px;
}

input.styled.sourceclient {
    width: 300px;
}

input.styled.default {
  width: 230px;
}

input.styled.tasktitle,
input.styled.taskdetail {
    width: 340px;
}

label.datepicker input.styled {
    width: 70px;
    border-right: 0;
    -webkit-border-top-right-radius: 0px;
    -webkit-border-bottom-right-radius: 0px;
    -moz-border-radius-topright: 0px;
    -moz-border-radius-bottomright: 0px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

label.timepicker input.styled {
    width: 73px;
    border-right: 0;
    -webkit-border-top-right-radius: 0px;
    -webkit-border-bottom-right-radius: 0px;
    -moz-border-radius-topright: 0px;
    -moz-border-radius-bottomright: 0px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

.selectedOption,
input.styled {
    border: 1px solid rgba(25, 26, 30, 0.20);
}

.inerror {
    background-color: #FF0000;
}

.selectedOption {
    box-shadow: inset -1px -1px 2px rgba(0, 0, 0, 0.2);
    border-style: outset;
}

.select.open .selectedOption {
    box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.3);
    border-style: inset;
}

.infoColContent label input.styled {
    float: left;
}

.infoColContent label .select {
    float: left;
}

.select,
.selectButton,
.selectedOption,
.select p,
.option {
    height: 34px;
    line-height: 34px;
}

.select {
    width: 188px;
}

.select p {
    font-size: 13px;
    font-family: Arial, Helvetica, sans-serif;
    color: #626262;
    font-weight: bold;
}

.selectButton {
    margin: 15px 11px 0 0;
    width: 0px;
    height: 0px;
    border: 6px solid transparent;
    border-top-color: #000;
    -webkit-transition: border .2s, margin-top .2s;
    -moz-transition: border .2s, margin-top .2s;
    -o-transition: border .2s, margin-top .2s;
    -ms-transition: border .2s, margin-top .2s;
    transition: border .2s, margin-top .2s;
}

.select.open .selectButton {
    margin-top: 9px;
    border-top-color: transparent;
    border-bottom-color: #000;
}

.select.mailshotcontact {
  width: 300px
}

.select.offices {
  width: 100px;
}

.select.bunits {
  width: 120px;
}

.btn,
.btn p {
    height: 34px;
    line-height: 34px;
    font-weight: bold;
}

.btn:hover {
    background-color: #5AB1E1;
}

.btn:active,
.btn.grey:active {
    box-shadow: inset 0px 0px 7px rgba(0, 0, 0, 0.2);
}

.btn p {
    font-size: 13px;
    color: #FFF;
    padding: 0 15px;
}

.btn.sitestatusfilter {
  height: 24px;
}

.btn p.sitestatusfilter {
    height: 24px;
    line-height: 24px;
}

.btn.grey {
    box-shadow: inset -1px -1px 2px rgba(0, 0, 0, 0.2);
    border: 1px outset #CCC;
    background-color: #F6F6F6;
}

.btn.multiple p {
    font-size: 13px;
}

.btn.grey:hover {
    background-color: #FFF;
}

.btn.grey p {
    color: #000;
}

.btn.tiny p {
    height: 34px;
    line-height: 34px;
}

.dialogs-wrapper {
    width: 100%;
    flex: none;
}

input.styled.sym_code {
  width: 300px;
}

.btn.datePicker {
    float: left;
    width: 34px;
    height: 30px;
    box-shadow: none;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border: none;
    background-color: #d4dbe0;
}

input.styled.searchcriteria + .btn.datePicker {
    height: 35px;
}

.btn.datePicker:hover {
    background-color: #e3e9ed;
}

.btn.timePicker {
    float: left;
    width: 34px;
    -webkit-border-top-left-radius: 0px;
    -webkit-border-bottom-left-radius: 0px;
    -moz-border-radius-topleft: 0px;
    -moz-border-radius-bottomleft: 0px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}

.btn .btnInner {
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

.btn.datePicker .btnInner {
    background-image: url(images/datepicker_icon.svg);
}

.btn.timePicker .btnInner {
    background-image: url(images/btn_timepicker_icon.png);
}

.btn.profileIcon {
    width: 34px;
}

.btn.profileIcon .btnInner {
    background-image: url(../images/website/icon_menu_contacts.svg);
}

.btn.leadIcon {
    width: 34px;
}

.btn.leadIcon .btnInner {
    background-image: url(../images/website/icon_menu_leads.svg);
}

.btn.refereeIcon {
    width: 34px;
}

.btn.refereeIcon .btnInner {
    background-image: url(../images/website/icon_menu_referees.svg);
}

.btn.vacancyIcon {
    width: 34px;
}

.btn.vacancyIcon .btnInner {
    background-image: url(../images/website/icon_menu_vacancies.svg);
}

.btn.groupIcon {
    width: 34px;
}

.btn.groupIcon .btnInner {
    background-image: url(../images/website/icon_menu_groups.svg);
}

.btn.clientIcon {
    width: 34px;
}

.btn.clientIcon .btnInner {
    background-image: url(../images/website/icon_menu_clients.svg);
}

.btn.taskIcon {
    width: 34px;
}

.btn.taskIcon .btnInner {
    background-image: url(../images/website/icon_menu_tasks.svg);
}

.btn.tenantIcon,
.btn.templateIcon {
    width: 34px;
}

.btn.tenantIcon .btnInner {
    background-image: url(../images/website/icon_menu_tenants.svg);
}

.btn.templateIcon .btnInner {
    background-image: url(../images/website/icon_menu_templates.svg);
}

.btn.mapIcon .btnInner {
    background-image: url(../images/website/icon_menu_maps.svg);
}

.btn.prospectIcon {
    width: 34px;
}

.btn.prospectIcon .btnInner {
    background-image: url(../images/website/icon_menu_prospects.svg);
}

.btn.bunitIcon {
    width: 34px;
}

.btn.bunitIcon .btnInner {
    background-image: url(../images/website/icon_menu_bunits.svg);
}

.btn.siteIcon {
    width: 34px;
}

.btn.siteIcon .btnInner {
    background-image: url(../images/website/icon_menu_sites.svg);
}

.btn.hirecontractIcon {
    width: 34px;
}

.btn.hirecontractIcon .btnInner {
    background-image: url(../images/website/icon_menu_hirecontracts.svg);
    background-size: 19px 25px;
}

.btn.invoiceIcon {
    width: 34px;
}

.btn.invoiceIcon .btnInner {
    background-image: url(../images/website/icon_menu_invoices.svg);
    background-size: 19px 25px;
}

.btn.abiIcon {
    width: 34px;
}

.btn.abiIcon .btnInner {
    background-image: url(../images/website/icon_menu_abi.svg);
}

.btn.entertainmentIcon {
    width: 34px;
}

.btn.entertainmentIcon .btnInner {
    background-image: url(../images/website/icon_menu_entertainment.svg);
}

.btn.driverIcon {
    width: 34px;
}

.btn.driverIcon .btnInner {
    background-image: url(../images/website/icon_menu_drivers.svg);
}

.btn.reportIcon {
    width: 34px;
}

.btn.reportIcon .btnInner {
    background-image: url(../images/website/icon_menu_reports.svg);
}

.btn.quoteIcon {
    width: 34px;
}

.btn.quoteIcon .btnInner {
    background-image: url(../images/website/icon_menu_quotations.svg);
}

.btn.plus {
    width: 34px;
}

.btn.plus .btnInner {
    background-image: url(images/btn_plus_icon.png);
}

#btnMapView,
#btnListView,
#btnCalendarView,
#btnKanbanView,
#btnClusters {
    user-select: none;
    padding: 0;
    transition: background-color .4s;
    border-radius: 4px;
    cursor: pointer;
    background-repeat: repeat-x;
    background-position: left top;
    padding: 0 15px;
    color: #FFF;
    background-color: #339FDB;
    height: 34px;
    line-height: 34px;
    display: block;
    text-decoration: none;
}

#btnMapView:hover,
#btnListView:hover,
#btnCalendarView:hover,
#btnKanbanView:hover,
#btnClusters:hover {
    background-color: #5AB1E1;
    transition: background-color .2s;
}

#btnClusters {
    margin-left: 10px;
    height: 24px;
    line-height: 24px;
}

ul.tagMenu {
    list-style: none;
    margin: 0;
    padding: 0;
}

ul.tagMenu li {
    list-style: none;
    float: left;
    padding: 0 8px;
    margin: 0 5px 5px 0;
    background-color: #E6E6E6;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
}

ul.tagMenu li {
    margin: 5px 5px 5px 5px;
    padding: 8px;
    font-weight: bold;
    color: #000;
}

ul.tagMenu.clients li {
    float: none;
}

.tagdel {
    margin-left: 5px;
    color: #CCCCCC;
    float: right;
    cursor: pointer;
}

.badpcode {
    font-weight: bold;
    color: #FF0000;
    font-size: 20px;
}

.badpcode img {
    margin-right: 4px;
    margin-top: 4px;
}

span.badpcodesmsg {
    font-weight: bold;
    color: #FF0000;
    font-size: 14px;
    margin-left: 10px;
}

.limitexceeded {
    font-weight: bold;
    color: #FF0000;
}

ul.tagMenu+.btn.plus {
    height: 31px;
    width: 31px;
    margin: 5px;
}

span.prospecttype {
  display: inline-block;
  max-width:100px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow: ellipsis;
  width: 100px;
  color: #FFFFFF;
  padding: 1px 4px 1px 4px;
  font-weight: bold;
  border-radius: 3px;
  margin: 10px 5px 5px 5px;
}

span.prospecttypesmall {
    height: 12px;
    width: 80px;
    font-size: 10px;
}

span.prospectstatus {
  display: inline-block;
  max-width:100px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow: ellipsis;
  width: 100px;
  color: #FFFFFF;
  padding: 1px 4px 1px 4px;
  font-weight: bold;
  border-radius: 3px;
  margin: 10px 5px 5px 5px;
}

span.prospectstatussmall {
    height: 22px;
    width: 100px;
    font-size: 10px;
    vertical-align: sub;
}

span.receipt {
    display: inline-block;
    height: 24px;
    width: 120px;
    font-weight: bold;
    color: #FFF;
    text-align: center;
    padding: 4px;
    margin: 5px 5px 5px 5px;
    background-color: #E6E6E6;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
}

span.receiptsmall {
    display: inline-block;
    width: 120px;
    font-weight: bold;
    color: #FFF;
    text-align: center;
    padding: 4px;
    margin: 5px 0px 5px 0px;
    background-color: #E6E6E6;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
}

span.receiptview {
    background-color: #64CE79;
}

span.receiptmultiple {
    background-color: #64CE79;
}

span.receiptdelete {
    background-color: #64CE79;
    font-weight: bold;
    color: #FFF;
    text-align: center;
    padding: 4px;
    margin: 5px 5px 5px 0px;
    background-color: #E6E6E6;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
}


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


/************** FORMS OVERRIDES END ***************/


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

.staticHeader {
    height: 141px;
    background-color: #339FDB;
    background-repeat: no-repeat;
    background-position: center 0px;
}

.topMenu {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-right: 80px;
    margin-left: 80px;
    font-size: 0;
    text-align: center;
}

.topLogo {
    margin-top: 25px;
    margin-right: 20px;
    float: left;
}

.aiBotHeaderV3 svg {
    animation: slowRotate 30s linear infinite;
}
.aiBotHeaderV3 svg:hover {
    animation-play-state: paused;
}
@keyframes slowRotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.topMenu .aiBotHeader, .topMenu .aiBotHeaderV3 {
    width: 48px;
    height: 48px;
    float: left;
    margin: 25px 10px 0 0;
    cursor: pointer;
}

@keyframes slowRotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.aiBotHeader img {
    animation: slowRotate 30s linear infinite;
}

.aiBotHeader img:hover {
    animation-play-state: paused;
}

.topMenu .aiBotFloatBar {
    position: fixed;
    bottom: 20px;
    padding: 15px;
    background-color: #FFF;
    z-index: 99;
    width: 90%;
    left: 0;
    right: 0;
    margin: 0 auto;
    max-width: 700px;
    color: #FFF;
    display: flex;
    align-items: center;
    gap: 8px;
    box-shadow: 0 0 10px rgba(0,0,0,0.3);
    border-radius: 8px;
}

.topMenu .aiBotFloatBarIcon {
    height: 34px;
    width: auto;
}

.topMenu .aiBotFloatBarInput {
    flex: 1;
    background-color: rgba(51, 159, 219, 0.08);
    color: #333;
    border: 1px solid rgba(25, 26, 30, 0.10);
    padding: 9px;
    border-radius: 3px;
}

.topMenu .aiBotFloatBarInput:focus {
    background-color: #eaf4fc;
}

.topMenuOption {
    margin-top: 25px;
    margin-right: 10px;
    display: inline-block;
    vertical-align: middle;
    background-color: rgba(244, 247, 250, 0.2);
    width: 48px;
    height: 48px;
    border-radius: 8px;
    transition: background-color .2s;
}

.topMenuOption:hover {
    background-color: rgba(244, 247, 250, 0.4);
}

.topMenuOption.on {
    background-color: #FFF;
}

.topMenuOption.on svg {
    fill: #339FDB;
}

.topMenuOption a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.topMenuOption svg {
    max-width: 20px;
    max-height: 20px;
    width: auto;
    height: auto;
}
.topToolOption {
    display: inline-block;
    vertical-align: middle;
    width: 48px;
    height: 48px;
}

.topToolOption a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.topToolOption svg {
    width: auto;
    height: auto;
    fill: #FFF
}

.topMenuSettings {
    margin-top: 22px;
    margin-right: 20px;
    float: right;
    width: 20px;
    height: 20px;
}

.topMenuSettings.manage-reports {
    margin-top: 22px;
    width: 20px;
    height: 14px;
}

.topMenuSettings.manage-mailshots {
    margin-top: 22px;
    width: 20px;
    height: 14px;
}

.topMenuSettings.reminders {
    width: 16px;
    height: 20px;
}

.topMenuSettings.site-search {
    margin-top: 22px;
    width: 18px;
    height: 18px;
}

.topMenuSettings a {
    display: block;
    cursor: pointer;
}

.xtopMenuReminders {
    margin-top: 35px;
    margin-right: 10px;
    float: right;
}

.topMenuClientLogo {
    float: right;
    background: #FFF;
    margin-left: 20px;
    padding: 10px 15px;
    font-size: 0;
    box-sizing: border-box;
    border-radius: 4px;
    margin-top: 22px;
    width: 135px;
    height: 50px;
}

.topMenuClientLogo.salespad {
    float: right;
    margin-left: 20px;
    background: #339FDB;
    padding: 0px 0px 0px 10px;
    font-size: 0;
    box-sizing: border-box;
    border-radius: 4px;
    margin-top: 22px;
    width: 135px;
    height: 50px;
}



@media screen and (max-width: 600px) {
    .topMenuClientLogo {
        display: none;
    }
}

.topMenuClientLogo:before {
    content: '';
    width: 0;
    height: 30px;
    box-sizing: border-box;
    display: inline-block;
    vertical-align: middle;
}

.topMenuClientLogo img {
    display: inline-block;
    vertical-align: middle;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    box-sizing: border-box;
}

.topMenuLogout {
    margin-top: 22px;
    margin-right: 0px;
    float: right;
    color: #FFFFFF;
    font-weight: bold;
    width: 32px;
    height: 24px;
}

.topMenuLogout a {
    display: block;
}

.topMenuLogoutInitials {
    float: right;
    margin-top: 6px;
    margin-left: -23px;
    font-size: 12px;
}

a.logout {
    color: #FFFFFF;
    text-decoration: none;
}

a.logout:visited {
    color: #FFFFFF;
    text-decoration: none;
}

a.logout:hover {
    color: #FFFFFF;
    text-decoration: none;
}

.container {
    width: 90%;
    padding: 20px 17px;
    margin: -40px auto 60px;
    background-color: #E9F0F6;
    border-radius: 16px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.16);
    /* remove after test */
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    /* align-items: flex-start; */
}

.container-quote {
  box-shadow: none;
  padding: 0;
}

.container-quote iframe,
.quote-approval-preview iframe {
    width: 100% !important;
    border: 0;
    border-radius: 5px;
}

.quote-approval-preview {
    width: 100%;
}

#frmQuote {
    flex-grow: 1;
}

.dashboardMenuWrapper {
    /* remove after test */
    width: 100%;
}

.dashboardMenu li {
    height: 34px;
}

.dashboardMenu li a {
    line-height: 34px;
}

.userInfo {
    margin-top: -10px;
    width: 100%;
}

.infoCol {
    float: left;
    margin: 14px;
    width: 417px;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid rgba(25, 26, 30, 0.20);
    background-color: #FAFCFF;
    /* remove after test */
    float: none;
    flex-grow: 1;
    margin: 0;
    display: flex;
    flex-flow: column;
}

.infoCol.clientDetails,
.infoCol.eventDetails,
.infoCol.groupDetails,
.infoCol.siteDetails,
.infoCol.leadDetails,
.infoCol.contactDetails,
.infoCol.prospectDetails,
.infoCol.vacancyDetails,
.infoCol.userDetails,
.infoCol.duplicateDetails,
.infoCol.tenantDetails,
.infoCol.historypane,
.infoCol.quotationspane,
.infoCol.operatorspane,
.infoCol.taskDetails,
.infoCol.loginspane,
.infoCol.bdmspane {
    flex-grow: 0;
}

.infoCol.quotationspane,
.infoCol.operatorspane{
  min-width: 450px;
}

.infoCol.taskDetails{
  min-width: 550px;
}

.infoColA {
    width: 441px;
}

.infoColHeader,
.infoColFooter {
    min-height: 30px;
    padding: 0 14px;
}

.infoColFooter {
    padding: 0;
    margin-top: auto;
    margin-bottom: 0;
}

.infoColHeader {
    padding: 16px 14px 16px 14px;
    display: flex;
    gap: 15px;
    justify-content: flex-start;
    align-items: flex-start;
}

.infoColHeader>p,
.infoColFooter>p {
    margin: 0;
    font-weight: bold;
    color: #000;
    height: auto;
    line-height: normal;
}

.infoColHeader>p {
    font-family: Gilroy, Helvetica, Arial, sans-serif;
    font-size: 18px;
    font-weight: 700;
    text-transform: capitalize;
}

.infoColHeaderActions {
    margin-right: 0;
    margin-left: auto;
    display: flex;
    gap: 15px;
}

.infoColScrollBoxWrapper+.infoColFooter {
    padding: 16px 32px;
    min-height: 26px;
    display: flex;
}

.infoColHeader .btn {
    margin: 0;
    flex: none;
}

.infoColHeader .btn.refresh {
    margin: 0;
    width: 32px;
    height: 32px;
    background-image: url('../images/website/btn_refresh.svg');
    background-position: center;
    background-repeat: no-repeat;
}

.infoColHeader .btn p {
    color: #FFF;
}

.infoColHeader .btn,
.infoColHeader .btn p {
    height: 29px;
    line-height: 29px;
}

.infoColHeaderImage {
    float: right;
    margin-top: 10px;
}

.infoColHeaderQuote{
    min-height: 20px;
}

.infoColContent {
    padding: 20px 20px 10px 20px;
}

.infoColContentHelp {
    padding-left: 20px;
}

.infoColContentHelpLast {
    padding-left: 20px;
    padding-bottom: 10px;
}

.infoColContent label {
    display: block;
    padding-bottom: 10px;
}

.infoColContent label p.labelTitle {
    float: left;
    width: 103px;
    margin-right: 5px;
}

.infoColContent label p.labelTitleA {
    float: left;
    width: 200px;
    margin-right: 5px;
}
.infoColContent label p.labelTitleA.module {
    font-weight: bold;
}

.infoColContent label p.labelTitleB {
    float: left;
    width: 150px;
    margin-right: 5px;
}

.infoColContent label p.labelTitle2 {
    float: left;
    width: 87px;
}

.infoColContent label p.labelTitle3 {
    float: left;
    width: 103px;
}

.infoColContent label p.labelTitle4 {
    float: left;
    width: 203px;
}

.infoColContent label p.sublabelTitle {
    margin-left: 40px;
}

.infoColContent label p.sublabelTitleA {
    float: left;
    margin-left: 15px;
    width: 185px;
    margin-right: 5px;
}

.infoColContent label p.sublabelTitleB {
    float: left;
    margin-left: 30px;
    width: 170px;
    margin-right: 5px;
}

.infoColContent label p.subsublabelTitle {
    margin-left: 80px;
}

.pagetoolbar-right {
    float: right;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.pagetoolbar-right .btn {
    float: none;
    color: #FFF;
    text-decoration: none;
}

.pagetoolbar-right a {
    color: #FFF;
    text-decoration: none;
}

.pagetoolbar-left {
    float: left;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.pagetoolbar-left .btn {
    float: none;
    color: #FFF;
    text-decoration: none;
}

.pagetoolbar-left a {
    color: #FFF;
    text-decoration: none;
}


.infoTile {
    float: left;
    margin: 14px;
    width: 417px;
    height: 100px;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid rgba(25, 26, 30, 0.20);
    background-color: #FAFCFF;
    /* remove after test */
    float: none;
    flex-grow: 1;
    margin: 0;
    cursor: pointer;
    display: flex;
    flex-flow: row;
}

.infoTileItem {
    padding: 16px 14px 16px 14px;
    display: flex;
    margin: auto;
    gap: 15px;
    justify-content: flex-start;
    align-items: flex-start;
}

.infoTileItemLeft {
    margin:auto;
    display:flex;
    flex-flow:column;
}

.infoTileItemMiddle {
    height: 60px;
    margin:auto;
    border-left: 2px solid;
    border-color: #E1E8EE;
    display:flex;
    flex-flow:column;
}

.infoTileItemRight {
     margin:auto;
     display:flex;
     width: 150px;
     flex-flow:column;
}

.infoTileItemLeftBottom {
     font-weight: bold;
     margin-top: 10px;
     color: #000000;
}

.infoTilePerc {
    font-size: 26px;
    font-weight: bold;
    color: #000000;
}

.infoTilePercUp {
    color: #64CE79;
    gap: 10px;
}

.infoTilePercDown {
    color: #D67E7E;
}

.hirestile {
  max-width: 500px;
}

input.styled.custom_text {
  width: 243px;
}
input.styled.custom_text.pql_custom {
  margin-left: 10px;
  margin-bottom: 5px;
}

textarea.styled.custom_textarea {
  width: 230px;
}
textarea.styled.custom_textarea.pql_custom {
  margin-left: 10px;
  margin-bottom: 3px;
}

.styled.custom_checkbox.pql_custom {
  margin-left: 10px;
}

.styled.time.pql_custom {
  margin-left: 10px;
}

select.styled.custom_select {
  width: auto;
}
select.styled.custom_select.pql_custom {
  margin-left: 10px;
  margin-bottom: 5px;
}

input.styled.custom_integer {
  width: 70px;
}
input.styled.custom_integer.pql_custom {
  margin-left: 10px;
  margin-bottom: 5px;
}

input.styled.custom_decimal {
  width: 70px;
}
input.styled.custom_decimal.pql_custom {
  margin-left: 10px;
  margin-bottom: 5px;
}

input.styled.custom_currency {
  width: 70px;
}
input.styled.custom_currency.pql_custom {
  margin-left: 10px;
  margin-bottom: 5px;
}

input.styled.custom_date {
  width: 70px;
}
input.styled.custom_date.pql_custom {
  margin-left: 10px;
  margin-bottom: 5px;
}

input.styled.custom_client_lookup.pql_custom,
input.styled.custom_group_lookup.pql_custom {
  margin-left: 10px;
}


.custom_subtitle {
    float: left;
    font-size: 14px;
    font-weight: bold;
    width: 100%;
    margin-bottom: 10px;
}

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

.reportGrid {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

.reportGrid,
.reportGrid * {
    box-sizing: border-box;
}

.reportOption {
    background-color: #339FDB;
    height: 200px;
    min-width: 340px;
    border-radius: 8px;
    flex: 1 0 0;
    transition: background-color .2s;
}

.reportOption:hover {
    background-color: #5AB1E1;
}

.reportOption a {
    height: 100%;
    width: 100%;
    display: flex;
    padding: 16px;
    flex-direction: column;
    justify-content: flex-end;
    text-decoration: none;
}

.reportOption .icon {
    display: flex;
    width: 48px;
    height: 48px;
    padding: 12px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 4px;
    background: #FAFCFF;
    margin-top: 0;
    margin-bottom: auto;
    margin-right: 0;
    margin-left: auto;
}

.reportOption p.title {
    color: #FAFCFF;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: capitalize;
    text-decoration: none;
    margin: 0;
}

.reportOption p.description {
    color: #FAFCFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-decoration: none;
    margin: 5px 0 0;
    opacity: 0.7;
}

.report1 {
    margin-left: 0px;
    width: 100%;
}

.report2 {
    margin-left: 0px;
    width: 100%;
}

.report3 {
    width: 100%;
    margin-left: 0px;
    margin-right: 25px;
}

.report4 {
    margin-left: 0px;
    width: 100%;
}

.report4.subtotal {
    font-weight: bold;
}

label.tagLabel p.labelTitle {
    width: 55px;
}

p.labelTitle2 {
    width: 55px;
    margin-left: 20px;
}

ul.listView {
    list-style: none;
    margin: 0;
    padding: 0;
}

ul.listView li {
    list-style: none;
    padding: 10px;
    border-bottom: 1px solid #D8D8D8;
    min-height: 25px;
}

ul.listView li p {
    margin: 0;
}

ul.listView li p.title {
    font-weight: bold;
    color: #000;
}

ul.listView li p.title.contactdocument {
    margin-top: -8px;
}

ul.listView li p.title.prospectdocument {
    margin-top: -8px;
}

ul.listView li p.title.clientdocument {
    margin-top: -8px;
}

ul.listView li p.title.groupdocument {
    margin-top: -8px;
}

ul.listView li p.title.quotedocument {
    margin-top: -8px;
}

ul.listView li p.title.mailshotattachment {
    margin-top: -8px;
}

ul.listView li p.title.vacancyattachment {
    margin-top: -8px;
}

ul.listView li p.reminderdesc {
    margin-left: 25px;
}

ul.listView li p span.remindernote {
    font-style: italic;
}

ul.listView li p.updateddesc {
    margin-left: 25px;
}

ul.listView li p.interviewclient {
    font-weight: bold;
    color: #000;
}

li.lisortable {
    border-left-style: solid;
    border-left-color: #999999;
    border-width: 3px;
    margin-top: 5px;
    cursor: n-resize;
}

.infoColScrollBox {
    height: 359px;
}

.infoColScrollBox2 {
    height: 120px;
}

.infoColScrollBox3 {
    height: 600px;
}

.infoColScrollBox4 {
    height: 200px;
}

.infoColScrollBox5 {
    height: 122px;
}

.infoColScrollBoxWrapper .jspVerticalBar {
    width: 0;
    background: none;
}

.infoColScrollBoxWrapper .jspDrag {
    opacity: 0;
    -webkit-transition: opacity .2s;
    -moz-transition: opacity .2s;
    -o-transition: opacity .2s;
    -ms-transition: opacity .2s;
    transition: opacity .2s;
}

.infoColScrollBoxWrapper:hover .jspDrag,
.infoCol:hover .jspDrag,
.infoColScrollBoxWrapper .jspDrag.jspHover,
.infoColScrollBoxWrapper .jspDrag.jspActive {
    opacity: 1;
}

.infoColScrollBoxWrapper .jspTrack {
    background: none;
}

.infoColScrollBoxWrapper .jspDrag {
    width: 10px;
    margin-left: -8px;
    background-color: #D9D9D9;
}

.infoColScrollBoxWrapper .jspCap {
    display: block;
    height: 3px;
}

.scrollArrow,
.arrow-nav {
    width: 100%;
    height: 26px;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: center;
    background-color: rgba(25, 26, 30, 0.10);
    transition: background-color .2s;
    user-select: none;
}

.scrollArrow:hover,
.arrow-nav:hover {
    background-color: rgba(25, 26, 30, 0.15);
    transition: background-color .1s;
}

.scrollArrow.up,
.arrow-nav.up {
    border-top-left-radius: 13px;
    border-bottom-left-radius: 13px;
    border-right: 1px solid #D9D9D9;
    background-image: url('../images/website/btn_scroll_up.svg');
}

.scrollArrow.down,
.arrow-nav.down {
    border-top-right-radius: 13px;
    border-bottom-right-radius: 13px;
    background-image: url('../images/website/btn_scroll_down.svg');
}

.arrow-nav.off,
.arrow-nav.off:hover {
    cursor: default;
    opacity: 0.5;
    background-color: rgba(25, 26, 30, 0.1);
}

.navigation-toolbar {
    padding-top: 15px;
    display: flex;
    width: 100%;
    max-width: 600px;
}

.navigation-toolbar .arrow-nav,
.navigation-toolbar a {
    width: 50%;
}

.navigation-toolbar a .arrow-nav {
    width: 100%;
}

.event_delete,
.lead_delete {
    margin: 5px 6px 0 0;
}

p.userName {
    float: left;
}

p.firstAdded {
    float: left;
    margin-top: 10px;
    margin-left: 10px;
    font-weight: bold;
    font-style: italic;
}

p.lastActivity {
    float: left;
    margin-top: 10px;
    margin-left: 10px;
    font-weight: bold;
    font-style: italic;
}

p.infoArchived {
    float: left;
    margin-top: 10px;
    margin-left: 10px;
    font-weight: bold;
    font-style: italic;
}

p span.noteuser {
    font-weight: normal;
    font-style: italic;
}

.userInfo p.userName a {
    display: block;
    padding-left: 20px;
}

p.userName,
p.userName a {
    color: #333;
    font-size: 21px;
    text-decoration: none;
    font-weight: bold;
    line-height: 36px;
    margin-left: 10px;
}

p.xuserName:first-child {
    margin-left: 0;
}

p.dateLabel {
    float: left;
    display: block;
    padding-left: 10px;
    padding-right: 20px;
    color: #333;
    font-size: 12px;
    text-decoration: none;
    font-weight: bold;
    line-height: 36px;
}

p.Notes {
    float: left;
}

p.CVs {
    float: left;
}

p.OtherDocuments {
    float: left;
}

p.Quotations,
p.ServiceInstructions,
p.Documents {
    float: left;
}

p.Attachments {
    float: left;
}

p.noteuser,
span.noteuser {
    font-style: italic;
}

p.placedby {
    font-style: italic;
}

p.subtitle {
    font-weight: bold;
}

span.placed {
    color: #FFFFFF;
    background-color: #73DD5A;
    padding-left: 3px;
    padding-right: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
}

span.archived {
    color: #FFFFFF;
    background-color: #EB5252;
    padding-left: 3px;
    padding-right: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
}

tr.tooltipdetail {
  line-height: 24px;
}

td.tooltipheader {
    font-weight: bold;
    font-size: 13px;
    background-color: #64CE79;
    color: #FFFFFF;
    padding: 5px;
    line-height: 24px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
}

hr.tooltipdetail {
    height: 2px;
    background-color: #f3f6db;
    color: #f3f6db;
    border: 0 none;
}

.tooltipdetailbold {
  font-weight: bold;
}

p.tooltipTitle {
    font-weight: bold;
    font-size: 10px;
}

p.tooltipNotetext {
    font-weight: bold;
    font-size: 10px;
}

span.tooltipNotetype {
    font-weight: bold;
    font-size: 10px;
    color: #0EB609;
}

p.tooltipNoteuser {
    font-style: italic;
    font-size: 10px;
}

.userInfo p.followedLabel {
    float: left;
    margin-left: 40px;
    margin-top: 10px;
    font-weight: bold;
}

.userInfo p.followedLabelMobile {
    float: left;
    margin-top: 10px;
    font-weight: bold;
}

td.followedLabel {
    font-weight: bold;
}

ul.followed {
    list-style: none;
    margin: 0;
    padding: 0;
}

ul.followed li.followed.on {
    list-style: none;
    border-radius: 8px;
    background: rgba(94, 202, 44, 0.10);
    margin: 0 10px 0 0;
    padding: 0 16px 0 40px;
    height: 34px;
    line-height: 34px;
    font-size: 14px;
    float: left;
    color: #64CE79;
    font-weight: 600;
    background-image: url('../images/website/follow_tick.svg');
    background-repeat: no-repeat;
    background-position: left 16px center;
}

.liActivity .activityIconWrapper {
    display: none;
}

.liActivity .activityDetailWrapper {
    padding: 15px;
}

.liActivity .activityDetailWrapper a {
    color: #339FDB;
    font-weight: 600;
}

.liActivity .activityDescWrapper {
    padding: 0;
}

.liActivity .activityInfo {
    font-weight: 400;
}

ul.followed li.followed.on:before {
    content: 'Following';
}

ul.followed li.followed.off {
    display: none;
}

.panecount {
    border-radius: 8px;
    background: rgba(94, 202, 44, 0.10);
    margin: 0 0 0 0;
    padding: 0 10px 0 10px;
    height: 24px;
    line-height: 24px;
    font-size: 12px;
    float: left;
    color: #64CE79;
    font-weight: 700;
}


.listcount {
    border-radius: 8px;
    background: rgba(94, 202, 44, 0.10);
    margin: 0 0 0 20px;
    padding: 10px 8px 0px 8px;
    height: 26px;
    min-width: 22px;
    font-size: 15px;
    float: left;
    color: #64CE79;
    font-weight: 700;
    text-align: center;
}


.kanbancount {
    border-radius: 8px;
    background-color: #E6EFFA;
    margin: 10px 10px 5px 0px;
    padding: 0px 10px 10px 5px;
    height: 24px;
    line-height: 24px;
    font-size: 12px;
    color: #339FDB;
    font-weight: 700;
    display: flex;
}

.btn.prospectcreateclient,
.btn.prospectcreateclient:hover {
    background-color: #64CE79;
}

.kanban-item-image {
    margin: 2px 0px 6px 0px;
    border-radius: 3px;
    width: 30px;
    height: 24px;
    line-height: 24px;
    padding: 0 0 0 0px;
    text-align: center;
    font-size: 0;
    line-height: normal;
}

.kanban-item-image:before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    width: 0;
    height: 20px;
}

.kanban-item-image img {
    display: inline-block;
    vertical-align: middle;
    max-width: 12px;
    max-height: 12px;
    width: auto;
    height: auto;
}

.kanban-predicted-value {
    border-radius: 8px;
    background: rgba(94, 202, 44, 0.10);
    margin: 8px 0 0 0;
    padding: 0 10px 0 10px;
    height: 24px;
    line-height: 24px;
    font-size: 12px;
    color: #64CE79;
    font-weight: bold;
    width: 45%;
}

.kanban-predicted-value2 {
  float:right;
  vertical-align: top;
  margin-left: 5px;
}


.active-state {
    width: 16px;
    height: 16px;
    border-radius: 8px;
}

.active-state.active {
    background-color: #64CE79;
}

.active-state.inactive {
    background-color: #D10E25;
}

ul.restricted {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    float: right;
    gap: 10px;
}

ul.restricted li.restricted.on {
    background-repeat: no-repeat;
    padding: 0 15px;
    border-radius: 4px;
    background: rgba(209, 14, 37, 0.20);
    display: flex;
    gap: 8px;
    align-items: center;
    font-size: 0;
}

ul.restricted li.restricted.on:before {
    display: block;
    content: '';
    background-image: url('images/psl-warning-icon.svg');
    width: 16px;
    height: 16px;
}

ul.restricted li.restricted.on:after {
    content: 'PSL Restricted';
    color: #D10E25;
    font-weight: 800;
    font-size: 13px;
    height: 34px;
    line-height: 34px;
}

ul.makecandidate {
    list-style: none;
    margin: 0;
    padding: 0;
}

ul.makecandidate li.makecandidate {
    list-style: none;
    margin: 10 3px 0 0;
    padding: 0;
    width: 90px;
    height: 21px;
    float: left;
    cursor: pointer;
}

.userInfo ul.followed {
    float: left;
    margin-left: 10px;
}

.userInfo ul.followed li {
    margin-top: 5px;
}

.userInfo p.ratingsLabel {
    float: left;
    margin-left: 40px;
    margin-top: 10px;
    font-weight: bold;
}

.userInfo p.ratingsLabelMobile {
    float: left;
    margin-top: 10px;
    font-weight: bold;
}

td.ratingsLabel {
    font-weight: bold;
}

ul.ratings {
    list-style: none;
    margin: 0;
    padding: 0;
}

ul.ratings li.rating.on {
    list-style: none;
    margin: 10 3px 0 0;
    padding: 0;
    background-image: url(../images/website/icon_star_on.svg);
    width: 23px;
    height: 22px;
    float: left;
    cursor: pointer;
}

ul.ratings li.rating.off {
    list-style: none;
    margin: 10 3px 0 0;
    padding: 0;
    background-image: url(../images/website/icon_star_off.svg);
    width: 23px;
    height: 21px;
    float: left;
    cursor: pointer;
}

ul.ratings li.ratingall.on {
    list-style: none;
    margin: 10 3px 0 0;
    padding: 0;
    background-image: url(images/icon_all_on.png);
    width: 32px;
    height: 32px;
    float: left;
    cursor: pointer;
}

ul.ratings li.ratingall.off {
    list-style: none;
    margin: 10 3px 0 0;
    padding: 0;
    background-image: url(images/icon_all.png);
    width: 32px;
    height: 32px;
    float: left;
    cursor: pointer;
}

.userInfo ul.ratings {
    float: left;
    margin-left: 10px;
}

.userInfo ul.ratings li {
    margin-top: 5px;
}

.userInfo p.warmthsLabel {
    float: left;
    margin-left: 40px;
    margin-top: 10px;
    font-weight: bold;
}

.userInfo p.warmthsLabelMobile {
    float: left;
    margin-left: 40px;
    margin-top: 10px;
    font-weight: bold;
}

td.warmthsLabel {
    font-weight: bold;
}

ul.warmths {
    list-style: none;
    margin: 0;
    padding: 0;
}

.warmth-overview-icon {
    display: inline-block;
    width: 20px;
    height: 6px;
    background-color: #EF9A1A;
    margin-bottom: 2px;
}

ul.warmths li {
    list-style: none;
    margin: 0 3px 0 0;
    padding: 0;
    width: 24px;
    height: 8px;
    float: left;
    cursor: pointer;
}

ul.warmths li.off {
    background-color: #191A1E;
    opacity: 0.2;
}

ul.warmths li.on {
    background-color: #EF9A1A;
    opacity: 1;
}

ul.warmths li.warmthall.on {
    background-image: url(images/icon_all_on.png);
    width: 32px;
    height: 32px;
}

ul.warmths li.warmthall.off {
    background-image: url(images/icon_all.png);
    width: 32px;
    height: 32px;
}

ul.warmths li.warmthall.on {
    list-style: none;
    margin: 10 3px 0 0;
    padding: 0;
    width: 32px;
    height: 32px;
    float: left;
    cursor: pointer;
}

ul.ratings li.warmthall.off {
    list-style: none;
    margin: 10 3px 0 0;
    padding: 0;
    width: 32px;
    height: 32px;
    float: left;
    cursor: pointer;
}

.userInfo ul.warmths {
    float: left;
    margin-left: 10px;
}

.userInfo ul.warmths li {
    margin-top: 14px;
}

td.title {
    color: #333;
    font-size: 21px;
    text-decoration: none;
    font-weight: bold;
    line-height: 36px;
    white-space: nowrap;
}

li.highlighted {
    background-color: #D0DCEF;
}

.clickable,
.clickablevercol {
    cursor: pointer;
}

.clickableabi {
    cursor: pointer;
}

.clickableclient,
.clickablegroup {
    cursor: pointer;
}

.clickablesite {
    cursor: pointer;
}

.clickablenote {
    cursor: pointer;
}

.xlocation {
    cursor: pointer;
}

.clickableclientoffice {
    cursor: pointer;
}

.clickableclientcontact,
.clickableclientcandidate,
.clickableclientdocument,
.clickableclientlead,
.clickableprospectlead {
    cursor: pointer;
}

.clickableprospect,
.clickableprospectcontact {
    cursor: pointer;
}

.clickableclientsite {
    cursor: pointer;
}

.clickableclientgroup {
    cursor: pointer;
}

.clickableourwastetype {
    cursor: pointer;
}

.clickablebunitsite {
    cursor: pointer;
}

.clickableduplicate {
    cursor: pointer;
}

.clickablesitecontact {
    cursor: pointer;
}

.clickablecandidate {
    cursor: pointer;
}

.clickablecandidatevacancy {
    cursor: pointer;
}

.clickablecontactvacancy {
    cursor: pointer;
}

.clickablereferee {
    cursor: pointer;
}

.clickablecontactsite {
    cursor: pointer;
}

.clickableclientasbdm,
.clickableprospectasbdm {
    cursor: pointer;
}

.clickablecontactcv {
    cursor: pointer;
}

.clickablecontactother {
    cursor: pointer;
}

.clickablecontactnotesdoc {
    cursor: pointer;
}

.clickablecontactinterview {
    cursor: pointer;
}

.clickableprospectquotation,
.clickableprospectserviceinstruction {
    cursor: pointer;
}

.clickablevacancyattachment {
    cursor: pointer;
}

.xxmobile {
    font-weight: bold;
}

div.listAA {
  width: calc(100% - 0px);
  overflow: auto;
  margin: auto;
}

.listA {
    flex-grow: 1;
    max-width: 100%;
}

.listAHdr {
    background-color: #FFF;
    font-weight: bold;
    line-height: 30px;
}

.listBHdr {
    background-color: #FFF;
    font-weight: bold;
    line-height: 16px;
}

.list-wrapper {
  position: relative;
  overflow: auto;
  white-space: nowrap;
}
.list-sticky-col {
  position: sticky;
  background-color: white;
}
.list-first-col {
  left: 0px;
}

.clickableColHdr {
    background-color: #FFF;
    font-weight: bold;
    line-height: 30px;
    color: #000;
}

div.colHdrSortable {
    display:flex;
    flex-flow:row;
    margin-top: 3px;
}

div.colHdrImage {
    margin-left:3px;
    margin-top:3px;
}

.calendarHdr {
    background-color: #F0F0F0;
    font-weight: bold;
    font-size: 12px;
    line-height: 30px;
    padding-left: 10px;
    color: #000000;
}

.calendarRow {
    line-height: 20px;
}

.calendarCell {
    vertical-align: text-top;
}

.calendarHourCell {
    vertical-align: text-top;
}

div.calendarCell {
    vertical-align: text-top;
    font-weight: bold;
    color: #000000;
    font-size: 10px;
    line-height: 20px;
    padding-left: 5px;
    margin-bottom: 1px;
    border-style: solid;
    border-left-width: 5px;
    border-top-width: 0px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
}

div.calendarCell {
    background-color: #C7DD9F;
    border-left-color: #99B06B;
}

div.calendarCellVREASON {
    background-color: #C7DD9F;
    border-left-color: #99B06B;
}

div.calendarCellVREASONCandidate {
    background-color: #C7DD9F;
    border-left-color: #459ADA;
}

div.calendarCellVREASONContact {
    background-color: #C7DD9F;
    border-left-color: #8D4BC2;
}

div.calendarCellVREASONDual {
    background-color: #C7DD9F;
    border-left-color: #72CA68;
}

div.calendarCellENTERTAINMENT {
    background-color: #94C1EA;
    border-left-color: #4A99DB;
}

div.calendarCellENTERTAINMENTCandidate {
    background-color: #94C1EA;
    border-left-color: #459ADA;
}

div.calendarCellENTERTAINMENTContact {
    background-color: #94C1EA;
    border-left-color: #8D4BC2;
}

div.calendarCellENTERTAINMENTDual {
    background-color: #94C1EA;
    border-left-color: #72CA68;
}

div.calendarCellNOTE {
    background-color: #FCFFBA;
    border-left-color: #C9C085;
}

div.calendarCellNOTECandidate {
    background-color: #FCFFBA;
    border-left-color: #459ADA;
}

div.calendarCellNOTEContact {
    background-color: #FCFFBA;
    border-left-color: #8D4BC2;
}

div.calendarCellNOTEDual {
    background-color: #FCFFBA;
    border-left-color: #72CA68;
}

div.calendarCellEmpty {
    line-height: 40px;
}

div.followingfilter {
    float: right;
    margin-top: 20px;
}

div.xright {
    float: right;
    margin-left: 100px;
}

table.listA {
    margin: 10px 15px;
    width: calc(100% - 30px);
    position: relative;
    z-index: 2;
    border-collapse: collapse;
}

table.listA:before {
    content: '';
    position: absolute;
    z-index: -1;
    background-color: #FFF;
    border: 1px solid rgba(25, 26, 30, 0.20);
    border-radius: 3px;
    top: -10px;
    right: -15px;
    bottom: -10px;
    left: -15px;
}

tr.listA {
    border-bottom: 1px solid rgba(25, 26, 30, 0.10);
}

tr.listA:last-child {
    border: 0;
}

.odd {
    background-color: white;
    line-height: 24px;
}

.even {
    background-color: #FFF;
    line-height: 24px;
}

.odd.report4 {
    line-height: 16px;
}

.even.report4 {
    line-height: 16px;
}

.rowimg {
    vertical-align: middle;
}

.contact_delete,
.mailshotcontact_delete {
    vertical-align: middle;
    cursor: pointer;
}

.interest {
    cursor: pointer;
}

#search {
    margin-left: 20px;
}

#notesearch {
    margin-left: 20px;
    margin-top: 0px;
}

.listname {
    font-weight: bold;
    color: #000000;
}

.rowtotal {
    font-weight: bold;
}

.reptotal {
    font-weight: bold;
    color: #000000;
    background-color: white;
    line-height: 30px;
}

td.reptotal {
    border-top-width: 2px;
    border-top-style: solid;
    border-top-color: #000000;
}

.listsubname {
    font-weight: normal;
}

.contactname {
    font-weight: bold;
    color: #000000;
}

.clientname {
    font-weight: bold;
    color: #000000;
}

.clickableclientname,
.clickablesecondaryclientname,
.clickablesitename {
    cursor: pointer;
}

.sitename {
    font-weight: bold;
    color: #000000;
}

.orgchartcontactname {
    font-weight: bold;
}

.notetype {
    font-weight: bold;
    color: #64CE79;
}

.span.salary {
    width: 60px;
}

#xinfoColNotes {
    width: 1085px;
}

#mkn_text {
    width: calc(100% - 26px);
    height: 60px;
    margin-bottom: 4px;
}

#mkf_text {
    width: 275px;
    height: 60px;
}

#mkci_note {
    width: 275px;
    height: 60px;
}

#rcv_nosalary {
    margin-right: 5px;
}

.inlinemaintouterdiv {
    margin-left: 5px;
    margin-right: 5px;
    margin-top: 5px;
}

.inlinemaintdiv {
    border-radius: 5px;
    padding: 15px;
    background-color: rgba(25, 26, 30, 0.03);
    border: 1px solid rgba(25, 26, 30, 0.10);
}

.inlinemaintsave {
    margin-left: 15px;
    margin-top: 5px;
    margin-bottom: 10px;
    background-color: #64CE79;
    font-weight: bold;
}

.inlinemaintsave:hover {
    background-color: #81DA93;
}

.inlinemaintcancel {
    margin-top: 5px;
    margin-bottom: 10px;
    font-weight: bold;
}


.inlinemaint-table {
  display: table;
}
.inlinemaint-table-row-group {
  display: table-row-group;
}
.inlinemaint-table-row {
  display: table-row;
  margin-bottom: 5px;
}
.inlinemaint-table-cell {
  display: table-cell;
  vertical-align: middle;
  padding-bottom: 5px;
}

textarea.inlinenote {
    width: 250px;
    height: 60px;
    margin-top: 10px;
}

.inlinenotesave {
    margin-left: 5px;
    margin-right: 6px;
}

.labelInlinenote {
    margin-left: 0px;
    margin-bottom: 5px;
    font-size: 13px;
    color: #000;
    font-weight: bold;
}

textarea.inlinenote2 {
    width: 230px;
    height: 40px;
    margin-top: 10px;
}

textarea.inlinenote3 {
    width: 250px;
    height: 40px;
    margin-top: 10px;
}

.sitemapContainer {
    height: 100px;
}

.mapsettingsContainer {
    height: 400px;
}

.sendemail {
    margin-left: 5px;
    margin-right: 6px;
}

input.styled.searchcriteria {
    margin-left: 5px;
    margin-top: 0px;
    padding-left: 30px;
    width: 100px;
    height: 19px;
    background-image: url(../images/website/icon_search.svg);
    background-position: left 8px center;
    background-repeat: no-repeat;
}

input.styled.searchcriteria.narrow {
    width: 50px;
}

div.officemap{
  width: 120px;
}

img.officemap {
  margin-top: 7px;
  margin-left: 10px;
  max-height: 17px;
  max-width: 17px;
  height: auto;
  width: auto;
}

input.styled.salary {
    width: 60px;
}

input.styled.sym_code {
    width: 242px;
}

textarea.templateHTML{
    width: 98%;
    height: 400px;
}

input.styled.searchcriteria.pane {
    margin-top: 0px;
}

input.styled.searchcriteria[name='xfilter_pjc_name'],
input.styled.searchcriteria[name='xfilter_sytt_desc_position'] {
    margin-right: 10px;
    margin-bottom: 10px;
}

input.styled.searchcriteria[name='xfilter_pjs_name_siteandlead'] {
    margin-right: 10px;
}

input.styled.searchcriteria[name='xfilter_sytt_desc_position'],
input.styled.searchcriteria[name='xfilter_jobtitle'] {
    margin-right: 10px;
    margin-bottom: 10px;
}

select.searchcriteria {
    margin-left: 5px;
    margin-bottom: 10px;
    width: 110px;
}

select.searchcriteria.clientfilter {
    margin-top: 14px;
    margin-bottom: 0px;
    width: 400px;
}

select.notetypeselector {
    float: right;
    height: 29px;
    border-radius: 3px;
}

select.salary {
    width: 100px;
    margin-left: 2px;
}

select.driver {
    width: 130px;
    padding-left: 1px;
}

select.stage {
    width: 100px;
    padding-left: 1px;
}

select.status {
    width: 90px;
    padding-left: 1px;
}

.driverproblem {
    color: #FF0000;
    font-weight: bold;
}

div.followingfilter {
    float: right;
    margin-top: 20px;
}

div.docimg {
    float: left;
    padding: 0px 0px 0px 0x;
    margin: 0px 7px 0px 11px;
}

select.searchcriteria.package {
    width: 120px;
}

select.searchcriteria.status {
    width: 100px;
}

select.searchcriteria.prospectstatus {
    width: 135px;
}

select.searchcriteria.probability {
    width: 135px;
}

select.searchcriteria.office {
    width: 110px;
}

select.searchcriteria.interest {
    width: 110px;
}

select.searchcriteria.client {
    width: 185px;
}

select.searchcriteria.account {
    width: 300px;
}

select.searchcriteria.level {
    width: 300px;
}

select.searchcriteria.mapped {
    width: 200px;
}

select.searchcriteria.bunit {
    width: 185px;
}

select.searchcriteria.segment {
    width: 130px;
}

select.searchcriteria.category {
    width: 130px;
}

select.searchcriteria.direction {
    width: 140px;
}

select.searchcriteria.bdm {
    width: 110px;
}

select.searchcriteria.custserv {
    width: 185px;
}

select.searchcriteria.currency {
    width: 185px;
}

select.searchcriteria.balance {
    width: 125px;
}

select.searchcriteria.hirecontractstatus {
    width: 145px;
}

select.searchcriteria.eventtype {
    width: 165px;
}

select.searchcriteria.expensetype {
    width: 165px;
}

select.searchcriteria.position {
    width: 110px;
}

select.searchcriteria.following {
    margin-left: 10px;
    width: 135px;
}

select.searchcriteria.numyears {
    width: 220px;
}

select.searchcriteria.gdprtier {
    width: 135px;
}

select.searchcriteria.type {
    width: 110px;
}

select.searchcriteria.ordertype {
    width: 150px;
}

select.searchcriteria.stage {
    width: 100px;
}

select.searchcriteria.user {
    width: 110px;
}

select.searchcriteria.rtype {
    width: 100px;
}

select.searchcriteria.producedby {
    width: 150px;
}

.jobadvert {
    width: 290px;
    height: 300px;
}

span.filtertooltip {
    font-weight: bold;
}

.viewselector {
    float: right;
    font-weight: bold;
}

.clusterselector {
    float: right;
}

#searchhelp {
    margin-top: 0;
    margin-left: 5px;
}

.btnAddNote {
    margin-top: -10px;
}

#btnWasteReport {
    margin-left: 10px;
}

img.navbut {
    cursor: pointer;
}

img.rowimage {
    margin-left: 6px;
    margin-right: 6px;
    margin-top: 0;
}

.row-image {
    margin: 5px 6px 6px;
    border-radius: 3px;
    width: 20px;
    height: 20px;
    background-color: #339FDB;
    text-align: center;
    font-size: 0;
    line-height: normal;
}

.row-image:before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    width: 0;
    height: 20px;
}

.row-image img {
    display: inline-block;
    vertical-align: middle;
    max-width: 12px;
    max-height: 12px;
    width: auto;
    height: auto;
}

.row-image-task {
    margin: 0px 6px 6px 5px;
    border-radius: 3px;
    width: 20px;
    height: 20px;
    text-align: center;
    font-size: 0;
    line-height: normal;
}

.row-image-task:before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    width: 0;
}

.row-image-task img {
    display: inline-block;
    vertical-align: middle;
    xmax-width: 12px;
    xmax-height: 12px;
    width: auto;
    height: auto;
}

.row-image-task.repeats img {
    max-width: 16px;
    max-height: 16px;
    margin-top: 6px;
}

div.repeatsmsg {
  font-weight:bold;
  color: #D10E25;
}

img.orgchartimage {
    margin-right: 6px;
    margin-top: 6px;
}

br.listsubname {
    line-height: 5px;
}

.chk {
    float: left;
}

ul.tagMenu li span.greyed {
    color: #FFFFFF;
}

#filter_pjo_id {
    height: 29px;
    line-height: 29px;
}

.filteredit {
    box-shadow: inset 0px 1px 2px rgba(255, 255, 255, 0.5), 1px 1px 1px rgba(0, 0, 0, 0.3);
    border: 1px outset #73CD4B;
    background-color: #73CD4B;
    width: 70px;
    padding: 10px;
    margin-left: 10px;
    color: #ffffff;
    cursor: pointer;
    text-align: center;
    float: left;
}

.filteron {
    box-shadow: inset 0px 1px 2px rgba(255, 255, 255, 0.5), 1px 1px 1px rgba(0, 0, 0, 0.3);
    border: 1px outset #73CD4B;
    background-color: #73CD4B;
    width: 70px;
    padding: 10px;
    margin-left: 10px;
    color: #ffffff;
    cursor: pointer;
    text-align: center;
    float: left;
}

table.Calendar {
    border-collapse: collapse;
    border-color: #CCCCCC;
}

span.userName {
    font-size: 20px;
    font-weight: bold;
    line-height: 36px;
}

a.sitepopup {
    margin-left: 14px;
    color: #000000;
    font-size: 20px;
    font-weight: bold;
}

a.sitepopup {
    text-decoration: none;
}

a.sitepopup:visited {
    text-decoration: none;
}

a.sitepopup:link {
    text-decoration: none;
}

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

a.clientpopup {
    margin-left: 14px;
    color: #000000;
    font-size: 16px;
}

a.clientpopup {
    text-decoration: none;
}

a.clientpopup:visited {
    text-decoration: none;
}

a.clientpopup:link {
    text-decoration: none;
}

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

textarea.siteemail {
    height: 100px;
}

textarea.clientwords {
    width: 162px;
    font-weight: bold;
}

textarea.template {
  width: 705px;
  height: 100px;
}

textarea.testing {
    width: 272px;
    font-weight: bold;
}

.mandatory,
input.styled.mandatory,
.selectedOption.mandatory {
    background-color: rgba(51, 159, 219, 0.08);
}

.mandatory.disabled,
input.styled.mandatory.disabled,
.selectedOption.mandatory.disabled {
    background-color: #F6F6F6;
}

input[type=text]:disabled {
    background: #FFFFFF;
}

span.expired {
    color: #EB3D3D;
    font-weight: bold;
}

span.inactive {
    color: #EB3D3D;
    font-weight: bold;
}

.bold {
    font-weight: bold;
}

#ui-dialog-title-dlgGetWSProducts,
#ui-dialog-title-dlgMapCode {
    font-size: 18px;
}

.pageIcon {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: rgba(51, 159, 219, 0.20);
    display: flex;
    align-items: center;
    justify-content: center;
    float: left;
}

.pageIcon img {
    display: block;
    max-width: 16px;
    max-height: 16px;
    height: auto;
    width: auto;
}

#menuAppend {
    float: right;
}


/***** ADDED  BY AMANI  ********/

.staticHeader {
    position: relative;
}

.container {
    position: relative;
}

.divDropDownMenu {
    display: none;
}

.divDropDownMenu {
    width: 32px;
    float: right;
    margin-left: 15px;
    margin-top: 29px;
}

.menuIcon {
    display: block;
    width: 32px;
    height: 32px;
    cursor: pointer;
    display: flex;
    gap: 3px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    border: 1px solid #FAFCFF;
    background: rgba(250, 252, 255, 0.20);
}

.menuIcon .menuBar {
    width: 16px;
    height: 2px;
    background-color: #fff;
    transition: 0.4s;
}

.menuIcon.on .bar:nth-child(1) {
    transform: rotate(-45deg) translate(-5px, 6px);
}

.menuIcon.on .bar:nth-child(2) {
    opacity: 0;
}

.menuIcon.on .bar:nth-child(3) {
    transform: rotate(45deg) translate(-5px, -6px);
}

.smallscreen.ulDropdownMenu {
    padding: 0;
    margin: 0;
    position: absolute;
    width: 100%;
    left: 0;
    z-index: 2;
    box-shadow: 0 5px 1px #0066A9;
    overflow: hidden;
}

.mobileMenuSelect {
    width: 110px;
    height: 50px;
    position: absolute;
    z-index: 10;
    top: 24px;
    margin-left: 5px;
    opacity: 0;
    cursor: pointer;
}

.liDropDownMenu a {
    color: #fff;
    display: block;
    line-height: 70px;
    height: 70px;
    padding: 0 20px;
    font-size: 18px;
    background: #66B3D7;
    text-decoration: none;
    text-transform: capitalize;
    border-bottom: 1px dotted #96C5DB;
    -webkit-transition: all .1s ease;
    -moz-transition: all .1s ease;
    -o-transition: all .1s ease;
    -ms-transition: all .1s ease;
    transition: all .1s ease;
}

.liDropDownMenu a:hover {
    color: #66B3D7;
    background: #fff;
    text-decoration: none;
    -webkit-transition: all .1s ease;
    -moz-transition: all .1s ease;
    -o-transition: all .1s ease;
    -ms-transition: all .1s ease;
    transition: all .1s ease;
}

.mobileMenuSelect option {
    text-transform: uppercase;
}

@media screen and (max-width: 790px) {
    .infoCol.clientDetails,
    .infoCol.eventDetails,
    .infoCol.groupDetails,
    .infoCol.siteDetails,
    .infoCol.leadDetails,
    .infoCol.contactDetails,
    .infoCol.prospectDetails,
    .infoCol.userDetails,
    .infoCol.duplicateDetails,
    .infoCol.tenantDetails {
        flex-grow: 1;
    }
}


/* Smartphones (portrait and landscape) ----------- */

@media only screen and (max-width: 480px),
only screen and (max-device-width:480px) {
    .topMenuOption {
        display: none;
    }
    .topMenu {
        margin-top: 0px;
        margin-bottom: 0px;
        margin-right: 10px;
        margin-left: 10px;
    }
    .divDropDownMenu {
        display: block;
        width: 32px;
        float: right;
        margin-left: 15px;
        margin-top: 29px;
    }
    .mobileMenuSelect {
        width: 48px;
        height: 50px;
        margin-left: 0;
    }
    p.userName {
        font-size: 14px;
    }
    #search {
        width: 56px;
        margin-left: 5px;
        margin-right: 0;
    }
    .btn.left.new {
        margin-left: 5px;
    }
}


/*** tablet and medium screens ****/

@media only screen and (max-width: 768px),
only screen and (max-device-width:768px) {
    .topMenuOption {
        display: none;
    }
    .divDropDownMenu {
        display: block;
    }
    .topMenu {
        margin-top: 0px;
        margin-bottom: 0px;
        margin-right: 20px;
        margin-left: 20px;
    }
}


/* Smartphones (landscape) ----------- */

@media only screen and (min-width: 321px) {
    /*
  .topMenuOption {
  display: none;
  }
  .divDropDownMenu {
    display: block;
  }

*/
}


/**** END ADDED BY AMANI *****/

.autocomplete-w1 {
    background: url(images/shadow.png) no-repeat bottom right;
    position: absolute;
    top: 0px;
    left: 0px;
    margin: 8px 0 0 6px;
    /* IE6 fix: */
    _background: none;
    _margin: 0;
}

.autocomplete {
    border: 1px solid #999;
    background: #FFF;
    cursor: default;
    text-align: left;
    max-height: 350px;
    overflow: auto;
    margin: -6px 6px 6px -6px;
    /* IE6 specific: */
    _height: 350px;
    _margin: 0;
    _overflow-x: hidden;
}

.autocomplete .selected {
    background: #F0F0F0;
}

.autocomplete div {
    padding: 2px 5px;
    white-space: nowrap;
}

.autocomplete strong {
    font-weight: normal;
    color: #3399FF;
}

.passwordonly {
    background-color: yellow;
}

.search_bar {
    background-color: #FFFFFF;
}

.search_heading {
    font-size: 14px;
    font-weight: bold;
    color: #000000;
    padding-right: 6px;
}

form.infieldlabel {
    padding: 0 20px 20px 20px;
}

form.infieldlabel,
form.infieldlabel fieldset input,
form.infieldlabel input,
form.infieldlabel select,
form.infieldlabel label {
    font-family: Helvetica, Arial;
    font-size: 12pt;
}

form.infieldlabel p {
    position: relative;
    margin: 10px 0;
}

form.infieldlabel fieldset p input,
form.infieldlabel p input,
form.infieldlabel p select {
    display: block;
    padding: 4px;
    width: 300px;
    margin: 0;
}

form.infieldlabel fieldset p label,
form.infieldlabel p label {
    width: 380px;
    display: block;
    margin: 5px 5px 5px 6px;
    padding: 0;
}

form.infieldlabel fieldset p input,
form.infieldlabel p input,
form.infieldlabel p select {
    border: solid 1px #ccc;
}

form.infieldlabel fieldset p label,
form.infieldlabel p label {
    color: #777;
}

form.infieldlabel p select option.blank {
    color: #777;
}

span.ordertag {
    margin-left: 5px;
    color: #ffffff;
    padding: 3px;
    background-color: #A5A5A5;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
}

span.newtag {
    margin-left: 5px;
    font-weight: bold;
    border-radius: 2px;
    background: rgba(239, 154, 26, 0.20);
    padding: 3px 6px;
    color: #EF9A1A;
}

.loaderror {
    color: #FF0000;
    font-weight: bold;
}

.loadsuccess {
    color: #00FF00;
    font-weight: bold;
}

.sitepadinfo {
    font-size: 13px;
    font-style: italic;
}

.sitepadinfotop {
  float: left;
  margin-left: 10px;
  margin-top: 10px;
}

.rdbinfo {
    font-size: 13px;
    font-style: italic;
}

.syrinxinfo {
    font-size: 13px;
    font-style: italic;
}

span.noclientflg {
    font-weight: bold;
    color: #FF0000;
    font-size: 16px;
}

span.noaccountflg {
    vertical-align: text-top;
    font-weight: bold;
    color: #FF0000;
    font-size: 24px;
}

legend.dashboardnew {
    font-weight: bold;
    border-radius: 8px;
    padding: 3px 6px;
    background-color:#EBF7E9;
    color:#64CE79;
}


/*tweeks*/

.menubutton img {
    vertical-align: middle;
}

#reportboxes {
    max-width: unset !important;
    padding: 10px;
}

.waste-chart {
    margin-top: 20px;
}

.waste-chart-data-efw {
    top: 10px !important;
}

.reportbox {
    border-radius: 5px;
    box-shadow: 0px 3px 6px #00000029 !important;
    max-width: unset !important;
    box-sizing: border-box;
    /* width: calc(100% - 74px) !important; */
}

.waste-chart-back {
    height: 27px !important;
    /*background-color: #f4f4f4 !important;*/
    border-radius: 5px !important;
}

.table-row.chart {
    height: 50px;
}

.color-rep {
    border-top: #DDDDDD 1px solid;
    justify-content: center;
    padding-top: 20px;
    margin: 0 -25px;
}

.color-rep,
.color-label {
    display: flex;
}

.color-label {
    margin: 10px;
}

.color-box {
    border-radius: 3px;
    width: 15px;
    height: 15px;
    margin-right: 10px;
}

.light-blue-box {
    background-color: #6CCCDF;
}

.dark-blue-box {
    background-color: #0E2751;
}

.grey-box {
    background-color: #B4B4B4;
}

.waste-chart-back div.recyc {
    top: -27px !important;
}

.waste-chart-back div {
    height: 27px !important;
}

.table-row.chart .column-data .waste-chart-back {
    margin-top: -5px;
}

.site-visit-title {
    display: flex;
    align-items: center;
    margin-bottom: 25px;
}

.request-visit-btn {
    background-color: #6CCCDF;
    padding: 6px 20px;
    color: #ffffff;
    text-decoration: none;
    border-radius: 5px;
    margin-left: 25px;
}

.request-visit-btn span {
    font-size: 20px;
    vertical-align: middle;
    margin-right: 5px;
}

.site-visit-table thead {
    text-align: left;
}

.site-visit-table thead th {
    padding: 15px 0;
    font-weight: normal;
}

.site-visit-table tbody td {
    padding: 10px 0;
    font-weight: bold;
}

.site-visit-table .green-box {
    background-color: #77E294;
    width: 15px;
    height: 15px;
    border-radius: 3px;
    display: inline-block;
    margin-right: 5px;
    vertical-align: middle;
}

.targetclient {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 21px;
    font-weight: bold;
    color: #000000;
}

.no-close .ui-dialog-titlebar-close {
    display: none
}

.ui-widget-header {
    background: #339FDB;
}

.sybg_status {
    height: 24px;
    width: 24px;
    border-radius: 50%;
}
.sybg_status_down {
    background-color: #FF0000;
}
.sybg_status_up {
    background-color: #00FF00;
}

.syrinx_import_status {
    height: 24px;
    width: 24px;
    border-radius: 50%;
}
.syrinx_import_status_down {
    background-color: #FF0000;
}
.syrinx_import_status_up {
    background-color: #00FF00;
}
.syrinx_import_status_changing {
    background-color: #FFA500;
    color: #FFFFFF;
    font-weight: bold;
}


span.logbold {
    font-weight: bold;
    font-size: 14px;
}

table.processlog {
    font-family: "Courier New", Courier, monospace;
}

div.exportoption {
    font-size: 14px;
    padding: 10px;
}

.viewselector {
    margin-right: 10px;
}

.unread {
    font-weight: bold;
}

.not-allowed {
    cursor: not-allowed;
}

.logoSmallSitepad {
    width: 200px;
    height: 59px;
    margin: 0 auto;
    background-image: url(../images/website/logo_crm.png);
    background-repeat: no-repeat;
}

.quoteLineDetails{
  width: 100%;
}

.resp-table {
  width: 100%;
  margin: auto;
  display: table;
}
.resp-table-header{
  display: table-header-group;
  background-color: #339FDB;
  color: #FFFFFF;
  font-weight: bold;
  font-size: 13px;
}
.resp-table-header-cell{
  display: table-cell;
  padding: 10px;
  text-align: left;
  border-bottom: 1px solid black;
}
.resp-table-header-cell-top-left{
  border-top-left-radius: 10px;
}
.resp-table-header-cell-top-right{
  border-top-right-radius: 10px;
}

.resp-table-body{
  display: table-row-group;
}
.resp-table-row{
  display: table-row;
}
.resp-table-body-cell{
  display: table-cell;
  padding: 10px;
  text-align: left;
  vertical-align: middle;
}
.resp-table-body-cell.recruit{
  padding: 2px 10px 2px 10px;
}
.resp-table-body-cell.hr{
  padding: 0;
}

.balance-over{
  display: inline-block;
  width: 100px;
  color: #D67E7E;
  padding: 0px;
  font-weight: bold;
  border-radius: 3px;
  margin: 5px 0px 5px 5px;
  background-color: #FBDFDE;
}

.quote-status{
  display: inline-block;
  width: 95px;
  color: #FFFFFF;
  padding: 0px;
  font-weight: bold;
  border-radius: 3px;
  margin: 5px 5px 5px 5px;
}

.quote-status-summary{
  display: inline-block;
  text-align: center;
  width:95px;
  height: 24px;
  padding: 7px 5px 0px 5px;
  font-size: 13px;

}

.quote-checkbox{
  height:20px;
  width:20px;
}

.quote-draft{
  background-color: #8E7CC3;
}

.quote-sent{
  background-color: orange;
}

.quote-viewed{
  background-color: #339FDB;
}

.quote-approved{
  background-color: #64CE79;
}

.quote-senttosyrinx{
  background-color: #64CE79;
}

.quote-lost{
  background-color: #000000;
}

.quote-void{
  background-color: #000000;
}

.task-status{
  display: inline-block;
  width: 80px;
  color: #FFFFFF;
  padding: 0px;
  font-weight: bold;
  border-radius: 3px;
  margin: 5px 5px 5px 5px;
}

.task-status-summary{
  display: inline-block;
  text-align: center;
  width: 70px;
  height: 24px;
  padding: 7px 5px 0px 5px;
  font-size: 13px;

}

.task-checkbox{
  height:20px;
  width:20px;
}

.task-incomplete{
  background-color: #6FA8DC;
}

.task-complete{
  background-color: #64CE79;
}

.task-void{
  background-color: #000000;
}

.task-priority{
  display: inline-block;
  width: 70px;
  color: #FFFFFF;
  padding: 0px;
  font-weight: bold;
  border-radius: 3px;
  margin: 5px 5px 5px 5px;
}

.task-priority-summary{
  display: inline-block;
  text-align: center;
  width: 70px;
  height: 24px;
  padding: 7px 5px 0px 5px;
  font-size: 13px;

}

.task-low{
  background-color: #64CE79;
}

.task-medium{
  background-color: orange;
}

.task-high{
  background-color: #D10E25;
}

.task-attendee-container{
  display:flex;
  flex-wrap:wrap;
  margin-bottom:10px;
  gap: 10px;
}

.task-attendee-required,
.task-attendee-optional{
  background-color: #F5F5F5;
  border-radius:3px;
  padding:8px;
  font-weight: bold;
}

.task-attendee-required.calendar,
.task-attendee-optional.calendar{
  font-weight: normal;
}

.task-day{
  border-radius:3px;
  padding:8px;
  font-weight: bold;
}

.task-day-selected{
  background-color: #E6E6E6;
}

.private{
  cursor: not-allowed;
}

.hirecontract-status{
  display: inline-block;
  min-width: 110px;
  color: #FFFFFF;
  padding: 0 5px 0 5px;
  font-weight: bold;
  border-radius: 3px;
  margin: 5px 5px 5px 5px;
}


.hirecontract-unconfirmed{
  background-color: #8E7CC3;
}

.hirecontract-onhire{
  background-color: #64CE79;
}

.hirecontract-pendingoffhire{
  background-color: orange;
}



.mailshot-status{
  display: inline-block;
  width: 70px;
  color: #FFFFFF;
  padding: 0px;
  font-weight: bold;
  border-radius: 3px;
  margin: 5px 5px 5px 5px;
}

.mailshot-status-summary{
  display: inline-block;
  text-align: center;
  width: 70px;
  height: 24px;
  padding: 7px 5px 0px 5px;
  font-size: 13px;

}

.mailshot-new,
.mailshot-draft{
  background-color: #8E7CC3;
}

.mailshot-launched{
  background-color: orange;
}

.mailshot-beingqueued{
  background-color: #E5CA5E;
}

.mailshot-queued{
  background-color: #E5CA5E;
}

.mailshot-beingsent{
  background-color: #E5CA5E;
}

.mailshot-sent{
  background-color: #64CE79;
}

.mailshotline-notyetqueued{
  background-color: #DE4A43;
}

.mailshotline-queued{
  background-color: #E5CA5E;
}

.mailshotline-sent{
  background-color: #64CE79;
}


.toggle {
  width: 60px;
  color: #000000;
  background-color: #EAF5FC;
  font-weight: bold;
  padding: 10px;
  border-radius: 10px;
  text-align: center;
  position: relative;
  z-index: 1;
}

.toggleselected{
  background-color: #339FDB;
  color: #FFFFFF;
  z-index: 2;
}

.currencywarning {
  font-weight: bold;
  color: #D10E25;
  margin-bottom: 10px;
}

.noemailorphonewarning{
  font-weight: bold;
  color: #D10E25;
}

.quotecurrencysymbol{
  font-weight: bold;
}

.smslength{
  float: right;
  font-weight: 400;
}

.saveItem {
  font-weight: bold;
  color: #FFFFFF;
  font-size: 13px;
  margin-left: 10px;
}

.infoItem {
  font-weight: bold;
  color: #FFFFFF;
  font-size: 13px;
  margin-left: 10px;
}

.errList {
  font-weight: bold;
  color: #FFFFFF;
  font-size: 13px;
  margin-left: 0px;
  margin-bottom: 0px;
}

.errItemFirst {
  margin-top: -14px;
  margin-bottom: 6px;
}

.errItem {
  margin-bottom: 6px;
}

.table-row.chart {
    display: flex;
}

.table-col {
    width: auto !important;
}

.table-col.name {
    width: 30% !important;
}

.table-col.bar {
    width: 50% !important;
}

@media screen and ( min-width: 1280px) {
    .reportbox {
        width: calc(50% - 74px) !important;
    }
}

.mobile-nav {
    display: none;
}
/*mobile menu scroll*/

@media screen and ( max-width: 768px) {
    .filter .datepicker {
        width: 80px;
    }
    .wastePaneBox {
        width: 100%;
    }
    .waste-chart {
        height: auto;
    }
    .wastePaneBox .wasteTileA {
        width: 100%;
    }
    .mobile-nav {
        display: block;
        position: fixed;
        width: 100%;
        background: #ffffff;
        bottom: 0;
        left: 0;
        overflow: scroll;
    }
    .mobile-nav .headernav {
        display: block !important;
        float: none;
    }
    .mobile-nav .headernav-inner {
        display: flex;
    }
    .mobile-nav .headernav-inner .menubutton {
        flex: 1;
    }
    .mobile-nav .headernav-inner .menubutton p {
        white-space: nowrap;
    }

    #reportboxes {
        padding-bottom: 80px;
    }
}

@media screen and ( max-width: 500px) {

    .fill-in {
        width: 100%;
    }

    .dropdown-outer {
        width: 100%;
    }

    .dropdown-outer select {
        width: 100% !important;
    }

    #chart1 {
        width: 100%;
        height: 240px;
    }

    #chart1 > div {
        width: 100%;
        height: 240px;
    }

    #reportboxes .reportbox {
        padding: 15px;
    }

    .table-row .column-data {
        font-size: 12px;
    }

    .table-col.name {
        width: 49% !important;
    }
    /* #chart1 > div > div {
        width: 100%;
        height: auto;
    } */
}



.form-screen,
.form-screen * {
    box-sizing: border-box;
}

.form-screen {
    min-width: 100%;
    min-height: 100vh;
    background-color: #E9F0F6;
    background-image: url('../images/website/form-screen-background.png');
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: 45%;
    display: flex;
    flex-flow: column;
}

.form-screen-inner {
    width: 100%;
    max-width: 1512px;
    margin: 0 auto;
    padding: 0 80px;
}

.form-screen-header {
    padding: 40px 0;
    display: flex;
    align-items: center;
}

.form-screen-header.centered {
    justify-content: center;
}

.form-screen-header-logo {
    flex: none;
}

.form-screen-header-title {
    width: 100%;
    text-align: center;
    padding-right: 94px;
}

.form-screen-header-title h1 {
    color: #191A1E;
}

.form-screen form {
    margin: 0 auto;
    display: block;
    background-color: #FFF;
    padding: 20px 40px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.16);
    border-radius: 16px;
    width: 100%;
    max-width: 500px;
}

.form-screen form p.form-title {
    color: #000;
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.form-screen form p.form-title+.cpFormWrapper {
    margin-top: 30px;
}

.form-screen form .blockAnimWrapper {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

.form-screen form .cpValueWrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    gap: 20px;
}

.form-screen form .cpValueWrapper p {
    color: #000;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin: 0;
    float: none;
    width: auto;
    height: auto;
    text-align: left;
}

.form-screen form .cpValueWrapper input {
    width: 240px;
    height: auto;
    flex: none;
    padding: 12px 10px;
    border-radius: 8px;
    border: 1px solid rgba(25, 26, 30, 0.40);
    background: #FAFCFF;
    font-size: 15px;
    font-style: normal;
    color: #191A1E;
    font-weight: 600;
}

.form-screen form .cpValueWrapper input::placeholder {
    opacity: 0.5;
    font-weight: 400;
}

.form-screen .cpFormSubmit input {
    border: 0;
    background-color: #339FDB;
    color: #FAFCFF;
    width: 100%;
    line-height: 40px;
    font-size: 13px;
    font-weight: 700;
    border-radius: 8px;
    transition: background-color .2s;
}

.form-screen .cpFormSubmit input:hover {
    background-color: #5AB1E1;
}

.form-screen .errmsg {
    padding: 20px 0 10px;
    font-size: 16px;
    font-weight: 400;
    text-align: center;
    width: 100%;
}

.form-screen .loginContainer {
    width: auto;
    height: auto;
    margin: auto;
    padding: 0;
}

.form-screen .loginWrapper {
    width: auto;
    background: none;
    float: none;
    margin: 0;
    border: none;
    border-radius: 0px;
    box-shadow: none;
}

.form-screen-footer {
    margin-bottom: 0;
    margin-top: auto;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 20px 0;
}

.form-screen-footer p {
    color: #838383;
    font-size: 12px;
    margin: 0;
}

.form-screen .loginBtnWrapper {
    margin-top: 40px;
}

.form-screen .btn.loginButton {
    float: none;
    width: 100%;
    height: 40px;
    line-height: 40px;
    border-radius: 8px;
}

.form-screen .btn.loginButton p {
    height: 40px;
    line-height: 40px;
    font-size: 13px;
}

.form-screen .submitBtn.forgotPassword {
    float: none;
    width: 100%;
    margin: 15px 0 0;
}

.form-screen .submitBtn.forgotPassword p {
    border: 2px solid #339FDB;
    background-color: #FAFCFF;
    color: #339FDB;
    width: 100%;
    line-height: 36px;
    font-size: 13px;
    font-weight: 700;
    border-radius: 8px;
    text-align: center;
}

.form-screen .loginLabel {
    width: auto;
    height: auto;
    display: block;
    margin: 0;
}

.form-screen div.dlgalert {
    margin: 20px 0 0;
    text-align: center;
    width: 100%;
}

.form-screen span.dlgalert {
    font-size: 13px;
}

.subscription-options {
    max-width: 960px;
    margin: 100px auto;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.16);
    border-radius: 16px;
    overflow: hidden;
}

.trial-reminder {
    z-index: 1;
    position: fixed;
    bottom: 20px;
    border-radius: 8px;
    border: 1px solid rgba(25, 26, 30, 0.20);
    background: #FAFCFF;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.16);
    padding: 16px;
    display: flex;
    width: calc(100% - 40px);
    max-width: 536px;
    margin: auto;
    left: 0;
    right: 0;
    gap: 10px;
}

.trial-reminder .btn {
    margin-left: auto;
    margin-right: 0;
}

.trial-reminder .text p {
    margin: 3px 0 0;
    color: #000000;
    opacity: 0.5;
}

.trial-reminder .text p.title {
    margin: 0;
    font-weight: 700;
    opacity: 1;
}

.nodata {
  color: #BABABA;
  font-weight: bold;
}


a.rv-entity {text-decoration:none;}
a.rv-entity:visited {text-decoration:none;}
a.rv-entity:link {text-decoration:none;}
a.rv-entity:hover {text-decoration:none;}
a.rv-entity:active {text-decoration:none;}


.rv-wrapper {
  margin-top: 0px;
  margin-left: 10px;
  margin-bottom: 10px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

div.rv-label {
  border-radius: 8px;
  background: rgba(94, 202, 44, 0.10);
  margin: 0 0 0 0;
  padding: 0 10px 0 10px;
  height: 24px;
  line-height: 24px;
  font-size: 12px;
  color: #64CE79;
  font-weight: 700;
  cursor: pointer;
}


div.rv-active {
  background-color:#64CE79;
  color: #FFF;
}

div.rv-inactive {
  background-color:#EBF7E9;
  color:#64CE79;
}

.announcekit-widget {
    position: absolute !important;
    left: 80px;
    background: #5ab0e1;
    color: #FFF;
    padding: 8px 12px;
    z-index: 2;
    border-radius: 5px;
    display: flex;
    gap: 5px;
    align-items: center;
    margin-top: -10px;
    margin-left: 45px;
}

.announcekit-widget:before {
    content: '';
    position: absolute;
    top: -13px;
    left: 4px;
    border-color: transparent;
    border-width: 8px;
    border-style: solid;
    border-bottom-color: #5ab0e1;
}

.uploadifive-button {
    background-image: none;
    background-color: rgba(25, 26, 30, 0.10);
    color: #191a1e;
    border: none;
    text-shadow: none;
    padding: 2px;
    border-radius: 4px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.9em;
    transition: background-color .2s;
}

.uploadifive-button:hover {
    background-image: none;
    background-color: rgba(25, 26, 30, 0.15);
    transition: background-color .1s;
}

#advancedFilter {
  background-color: #FFF;
  display: inline-block;
  position: absolute;
  width: 400px;
  padding: 10px;
  top:0px;
  border-radius: 16px;
  box-shadow: 3px 3px 20px #DCDCDC;
  left: 0px;
}

.advancedfiltertitle{
  font-weight: bold;
  font-size: 20px;
}

.advancedfiltersubtitle{
  font-weight: bold;
  font-size: 16px;
}

.advancedfilterclear{
  font-weight: bold;
}

.advancedfiltersection{
    border: 2px solid rgba(25, 26, 30, 0.20);
    border-radius: 3px;
}

.advancedfilterinput{
  background-color: #FFF;
  width: 320px;
}

#btnAdvancedFilterClear,
#btnAdvancedFilterClose{
  cursor: pointer;
}

#divQuotationHireContract{
  margin-left: 10px;
  font-weight: bold;
}

input.styled.pql_code,
div.pql_code{
  width: 80px;
}

input.styled.pql_desc_r_narrow,
div.pql_desc_r_narrow{
  width: 160px;
}

input.styled.pql_desc_r_wide,
div.pql_desc_r_wide{
  width: 260px;
}

div.pql_operated{
  width: 140px;
}

input.styled.pql_quantity,
div.pql_quantity{
  width: 40px;
}

input.styled.pql_hours,
div.pql_hours{
  width: 120px;
}

input.styled.mandatory.pql_recruithours,
input.styled.pql_recruithours,
div.mandatory.pql_recruithours,
div.pql_recruithours{
  width: 50px;
}

input.styled.pql_rate,
div.pql_rate{
  width: 50px;
}

select.pql_per,
div.pql_per{
  width: 110px;
}

input.styled.pql_plantno,
div.pql_plantno{
  width: 160px;
  margin-top:-15px;
}

input.styled.pql_notes_r_narrow,
div.pql_notes_r_narrow{
  width: 160px;
  margin-top:-15px;
}

input.styled.pql_notes_r_wide,
div.pql_notes_r_wide{
  width: 260px;
  margin-top:-15px;
}

input.styled.pql_desc_a,
div.pql_desc_a{
  width: 300px;
}

input.styled.pql_notes_a,
div.pql_notes_a{
  width: 300px;
  margin-top:-15px;
}

.col-live {
  background-color: #E9EFF6;
}

.notification {
  position: relative;
  display: inline-block;
}

.notification .badge {
  position: absolute;
  top: -3px;
  right: -3px;
  padding: 5px 5px;
  border-radius: 50%;
  background: #64CE7D;
  color: white;
}

#filter_status_multiselect {
  background-color: #F6F6F6;
  display: inline-block;
  position: absolute;
  width: 93px;
  padding: 10px;
  border-color: #000000;
  border-radius: 3px;
  box-shadow: 3px 3px 20px #DCDCDC;
  left: 4px;
  top: 35px;
}

#btnCloseSiteStatusFilter{
  cursor: pointer;
}

input.styled.searchcriteria.sitestatusfilter {
  width:70px;
  background-color: #F6F6F6;
  background-image:url(../images/website/new_arrow_black.svg);
  background-position:left 5px center;
  background-size: 10px 10px;
}

@media screen and (max-width: 770px) {

    .form-screen form .cpValueWrapper {
        flex-wrap: wrap;
        gap: 10px;
    }

    .form-screen form .cpValueWrapper input {
        width: 100%;
    }

    .form-screen .loginLabel {
        width: 100%;
    }

    .form-screen-inner {
        padding: 0 40px;
    }

    .announcekit-widget {
        margin-left: 39px;
        top: 74px;
        left: 20px;
    }

}