.mdi-spin:before {
    -webkit-animation: mdi-spin 2s infinite linear;
    animation: mdi-spin 2s infinite linear;
}

.layout-main {
    min-height: calc(100vh - 156px);
    position: relative;
}

.layout-content {
    padding-bottom: 200px !important;
}

.layout-footer {
    border-bottom: none;
    bottom: 0;
    position: absolute;
    width: 100%;
}

.layout-wrapper .layout-main .layout-content {
    padding-top: 30px;
}

/* Navbar */
.layout-wrapper.layout-horizontal .layout-menu-container {
    border: none;
    border-bottom: none;
    box-shadow: 0 .125rem .25rem #0000000D;
    padding: 0 0 0 15px;
}

@media screen and (max-width: 896px) {
    .layout-wrapper.layout-horizontal .layout-menu-container {
        padding: 0;
    }
}

.layout-wrapper.layout-horizontal .layout-menu-container .layout-menu > li > ul {
    border: none;
    border-radius: 0 0 20px 20px;
    top: inherit;
}

.layout-wrapper.layout-horizontal .layout-menu-container .layout-menu > li > ul li:last-child a {
    border-radius: 0 0 20px 20px;
}

.layout-wrapper.layout-horizontal .layout-menu-container .layout-menu > li a {
    align-items: center;
    display: flex;
    font-size: 13px;
    height: auto;
    padding: 15px;
}

.layout-wrapper.layout-menu-light .layout-menu-container .layout-menu li.active-menuitem > a .layout-menuitem-text,
.layout-wrapper.layout-menu-light .layout-menu-container .layout-menu li.active-menuitem > a .layout-menuitem-icon,
.layout-wrapper.layout-menu-light .layout-menu-container .layout-menu li.active-menuitem > a .layout-submenu-toggler,
.layout-wrapper.layout-horizontal .layout-menu-container .layout-menu > li a:hover {
    background-color: #FFF;
    color: #000;
}

.layout-wrapper.layout-horizontal .layout-menu-container .layout-menu > li a i.layout-menuitem-icon {
    color: #ADADAD;
    font-size: 18px;
    margin-right: 6px;
}

.layout-wrapper.layout-horizontal .layout-menu-container .layout-menu > li > ul > li a {
    padding: 10px 15px;
}

.layout-wrapper.layout-horizontal .layout-menu-container .layout-menu > li > ul > li a i.layout-menuitem-icon {
    color: #ADADAD;
    font-size: 14px;
    margin-right: 15px;
}

.layout-wrapper .layout-menu-container .layout-menu li a .layout-submenu-toggler {
    margin-top: 0;
}

.layout-wrapper.layout-horizontal .layout-menu-container .layout-menu > li a {
    color: #727272 !important;
}

/* advantage statuses for first choice purchasing */
.table.table-clear .ui-datatable-tablewrapper table tbody tr.ui-datatable-even.adv-po-matched,
.adv-po-matched, .table.table-clear .ui-datatable-tablewrapper table tbody tr.ui-datatable-even.adv-po-return,
.adv-po-return, .table.table-clear .ui-datatable-tablewrapper table tbody tr.ui-datatable-even.adv-po-van-stock,
.adv-po-van-stock {
    /* pale green */
    background-color: #D4EDDA;
    border-color: #C3E6CB;
}

/* Topbar */
.advantage-topbar {
    align-items: center;
    background-color: #578697;
    color: #E2EEF3;
    display: flex;
    padding: 15px 25px;
}

.advantage-topbar .advantage-topbar-left {
    align-items: center;
    display: flex;
    justify-content: start;
}

.advantage-topbar .advantage-topbar-right {
    align-items: center;
    display: flex;
    justify-content: end;
    margin-left: auto;
}

.advantage-topbar .user {
    align-items: center;
    display: flex;
    font-size: 14px;
    margin-left: 20px;
}

.advantage-topbar .business-selector:hover, .advantage-topbar .user:hover {
    cursor: pointer;
}

.advantage-topbar .dark-mode-btn i {
    color: #E2EEF3;
}

.advantage-topbar .dark-mode-btn i:hover {
    color: #FFF;
}

.advantage-topbar .ui-menu {
    border: none;
    font-size: 14px;
    width: 100%;
}

.advantage-topbar .ui-menu .ui-menu-list .ui-menuitem .ui-menuitem-link {
    padding: 15px 20px;
}

.advantage-topbar .ui-overlaypanel {
    background-color: #406E7E;
    border-radius: 20px;
    box-shadow: none;
    margin-top: 15px;
}

.advantage-topbar .ui-overlaypanel .ui-overlaypanel-content {
    padding: 0;
}

.advantage-topbar .user img {
    border-radius: 50%;
    margin-right: 15px;
    width: 40px;
}

.advantage-topbar .quick-link-button {
    align-items: center;
    background-color: #FFFFFF3B;
    border-radius: 20px;
    color: #E2EEF3;
    display: flex;
    height: 40px;
    margin-right: 15px;
    padding: 2px 11px 0 11px;
}

.advantage-topbar .quick-link-button i {
    font-size: 1.5em;
}

.advantage-topbar .quick-link-button .text {
    font-weight: bold;
    overflow: hidden;
    transition: all 0.3s ease-in-out;
    white-space: nowrap;
    width: 0px;
}

.advantage-topbar .quick-link-button:hover .text {
    padding-left: 10px;
    width: 120px;
}

.advantage-topbar .layout-menu-button.layout-topbar-icon {
    align-items: center;
    background-color: #FFFFFF3B;
    border-radius: 20px;
    color: #E2EEF3;
    display: flex;
    font-size: 14px;
    height: 40px;
    margin-right: 15px;
    padding: 14px;
    width: 40px;
}

.advantage-topbar.layout-topbar .layout-menu-button i {
    font-size: 14px;
}

/* Date Selector */
.date-selector {
    align-items: center;
    display: flex;
    justify-content: center;
    margin-bottom: 20px;
    margin-top: 10px;
}

.date-selector .date-header {
    border: 1px solid #E5E6E7;
    border-left: none;
    border-radius: 0px;
    border-right: none;
    font-size: 14px;
    height: 34px;
    padding: 6px 12px;
}

.date-selector .left-arrow, .date-selector .right-arrow {
    align-items: center;
    background-color: #578697;
    color: #FFF;
    display: flex;
    height: 34px;
    padding: 0 10px;
    padding: 0 10px
}

.date-selector .left-arrow i, .date-selector .right-arrow i {
    color: #FFF;
}

.date-selector .left-arrow:hover, .date-selector .right-arrow:hover {
    background-color: #719BAA;
    color: #FFF;
}

.date-selector .left-arrow {
    border-radius: 10px 0 0 10px;
}

.date-selector .right-arrow {
    border-radius: 0 10px 10px 0;
}

/* Font */
body, body .ui-widget, body .ui-widget .ui-widget {
    font-family: "Nunito Sans", "Open Sans", "Karla", "Sans Serif",
    "Arial" !important;
}

body {
    background-color: #F0F0F5;
}

.test-banner {
    background-color: #ED5565;
    color: #FFF;
    font-size: 1.2em;
    font-weight: bold;
    padding: 5px;
    text-align: center;
}

@media screen and (max-width: 896px) {
    .layout-content {
        padding: 15px 0 !important;
    }
}

.block {
    display: block;
}

/* selectBooleanButton */
body .ui-button.ui-button-text-icon-left.ui-selectbooleanbutton .ui-icon {
    margin-top: -8px !important;
}

/* Flex Box */
.flex {
    align-items: start;
    display: flex;
}

.flex-wrap {
    flex-wrap: wrap;
}

.flex-space-between {
    justify-content: space-between;
}

.flex-right {
    margin-left: auto !important;
}

.flex-left {
    margin-right: auto !important;
}

.flex-center {
    margin-left: auto !important;
    margin-right: auto !important;
}

.flex-top {
    align-items: start !important;
}

.flex-middle {
    align-items: center !important;
}

.flex-bottom {
    align-items: end !important;
}

/* Dashboard Filter Group Toggle */
.filter-operator-toggle {
    text-align: center;
}

.filter-operator-toggle .filter-operator-button {
    border: 1px solid #578697;
    border-radius: 50px;
    display: inline-block;
    margin: 0 10px 10px 10px;
    padding: 5px 10px;
}

.filter-operator-toggle .filter-operator-button:hover {
    background-color: #578697;
    color: #FFF;
    cursor: pointer;
}

/* Office Display */
.office-display-logout a {
    color: #FFF;
    margin-top: 12px;
}

.office-display-logout a:hover {
    color: #EEE;
}

/* Call Queue Summary */
.call-queue-summary-row {
    display: flex;
    justify-content: center;
    margin-top: 25px;
}

.call-queue-summary-row .call-queue-summary-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0 10px;
    padding: 10px 20px;
}

.call-queue-summary-row .call-queue-summary-item-title {
    font-size: 14px;
    margin: 0;
    text-align: center;
}

.call-queue-summary-row .call-queue-summary-item-total {
    font-size: 32px;
    font-weight: bold;
    margin: 0 0 5px 0;
    text-align: center;
}

/* Business */
.business-panel {
    display: flex;
    justify-content: end;
    margin-right: 15px;
    margin-top: 15px;
}

.sub-business-panel {
    display: flex;
    justify-content: end;
    margin-bottom: 15px;
}

.business-item.selected {
    border-color: #406E7E;
}

.business-item:hover {
    background-color: #EDEDED;
    border-color: #A1A1A1;
}

.business-item.selected:hover {
    border-color: #406E7E;
}

.business-item img {
    line-height: 50px;
}

.business-item i.fa-globe {
    font-size: 3.5em;
    margin: 0 10px;
}

.business-item {
    background-color: #E7E7E7;
    border-bottom: none;
    border-radius: 15px;
    box-shadow: none;
    height: 70px;
    margin: 0 5px;
    padding: 10px 15px 5px 15px;
    text-align: center;
}

.business-item:hover {
    background-color: #CDCDCD;
    border-bottom-color: #CDCDCD;
}

.sub-business-panel .business-item {
    border-radius: 10px;
    height: 55px;
}

.sub-business-panel .business-item img {
    height: 28px;
}

.sub-business-panel .business-item i {
    font-size: 30px;
}

@media screen and (max-width: 896px) {
    .business-panel, .sub-business-panel {
        margin-right: 5px;
    }

    .business-panel .business-item {
        height: 45px !important;
    }

    .business-panel .business-item img {
        height: 25px;
    }

    .business-panel .business-item i.fa-globe {
        font-size: 1.8em;
    }

    .sub-business-panel .business-item {
        height: 35px !important;
    }

    .sub-business-panel .business-item img {
        height: 20px;
    }

    .sub-business-panel .business-item i.fa-globe {
        font-size: 1.5em;
    }

    #businessForm {
        padding-top: 35px;
    }
}

.full-width input,
.full-width.ui-selectonemenu {
    width: 100% !important;
}

.ui-toggleswitch-slider:before {
    background: #FFF;
}

.ui-toggleswitch-slider {
    background: #BBB;
}

/* KPI Gradients */
.kpi-gradient-1 {
    background-color: #C00000;
    color: #252529;
}

.kpi-gradient-2 {
    background-color: #FF7B71;
    color: #252529;
}

.kpi-gradient-3 {
    background-color: #FFC000;
    color: #252529;
}

.kpi-gradient-4 {
    background-color: #A9D08E;
    color: #252529;
}

.kpi-gradient-5 {
    background-color: #548235;
    color: #252529;
}

/* Call Queues */
.queue-total {
    font-size: 0.9em;
    font-weight: bold;
    margin-top: 8px;
}

/* Visit SLA */
.sla .result {
    height: 16px;
}

.sla .progress-wrapper {
    background-color: #FFF;
    height: 6px;
    margin-top: 5px;
    width: 100%;
}

.sla .progress {
    height: 6px;
}

.sla .progress-wrapper.small {
    background-color: #FFF;
    height: 4px;
    margin-top: 8px;
    width: 100%;
}

.sla .progress.small {
    height: 4px;
}

.sla .progress.green {
    background-color: #1AB394;
}

.sla .progress.yellow {
    background-color: #F79703;
}

.sla .progress.red {
    background-color: #F56F64;
}

/* Retro */
.retro-start {
    border-left: 4px solid #1AB394 !important;
}

.retro-end {
    border-right: 5px solid #F56F64 !important;
}

.retro-key {
    display: block;
    padding-top: 15px;
}

.retro-key .retro-key-box {
    border: 1px solid #D8D8DC;
    display: inline-block;
    height: 32px;
    line-height: 36px;
    text-align: center;
    width: 100px;
}

.retro-key .retro-key-box i {
    font-size: 36px;
}

.retro-key .retro-key-label {
    display: inline-block;
    line-height: 32px;
    margin-left: 15px;
    vertical-align: top;
}

.retro-circle-panel {
    bottom: 0px;
    height: 34px;
    left: 0px;
    position: absolute;
    width: 15px;
}

.retro-circle {
    font-size: 32px;
    line-height: 10px;
    position: relative;
}

/* SelectButtons */
.ui-fluid .ui-buttonset.ui-buttonset-1 .ui-button {
    width: 100%;
}

.ui-fluid .ui-buttonset.ui-buttonset-2 .ui-button {
    width: 50%;
}

.ui-fluid .ui-buttonset.ui-buttonset-3 .ui-button {
    width: 33%;
}

.ui-fluid .ui-buttonset.ui-buttonset-4 .ui-button {
    width: 25%;
}

.ui-fluid .ui-buttonset.ui-buttonset-5 .ui-button {
    width: 20%;
}

.ui-fluid .ui-buttonset.ui-buttonset-6 .ui-button {
    width: 16.6%;
}

.ui-fluid .ui-buttonset.ui-buttonset-7 .ui-button {
    width: 14.28%;
}

.ui-fluid .ui-buttonset.ui-buttonset-8 .ui-button {
    width: 12.5%;
}

.ui-fluid .ui-buttonset.ui-buttonset-9 .ui-button {
    width: 11.1%;
}

.ui-fluid .ui-buttonset.ui-buttonset-10 .ui-button {
    width: 10%;
}

.ui-fluid .ui-buttonset.ui-buttonset-11 .ui-button {
    width: 9.09%;
}

.ui-fluid .ui-buttonset.ui-buttonset-12 .ui-button {
    width: 8.33%;
}

.ui-fluid .ui-buttonset.ui-buttonset-13 .ui-button {
    width: 7.69%;
}

.ui-fluid .ui-buttonset.ui-buttonset-14 .ui-button {
    width: 7.14%;
}

.ui-fluid .ui-buttonset.ui-buttonset-15 .ui-button {
    width: 6.66%;
}

.ui-fluid .ui-buttonset.ui-buttonset-16 .ui-button {
    width: 6.25%;
}

.ui-fluid .ui-buttonset.ui-buttonset-17 .ui-button {
    width: 5.88%;
}

.ui-fluid .ui-buttonset.ui-buttonset-18 .ui-button {
    width: 5.55%;
}

.ui-fluid .ui-buttonset.ui-buttonset-19 .ui-button {
    width: 5.26%;
}

.ui-fluid .ui-buttonset.ui-buttonset-20 .ui-button {
    width: 5%;
}

.media.sla {
    padding: 0;
}

.media.sla .media-left {
    background: #676A6C;
    color: #FFF;
    font-size: 28px;
    height: 70px;
    padding-right: 0px;
    text-align: center;
    vertical-align: middle;
    width: 90px;
}

.media.sla .media-body {
    width: inherit;
}

body .unstyle-disabled .ui-state-disabled {
    opacity: 1;
}

body .green .ui-inputfield {
    color: #1AB394;
}

/* Menu */
.layout-wrapper.layout-horizontal .layout-menu-container .layout-menu > li > ul {
    max-height: 10000px !important;
    min-width: 250px !important;
    z-index: 5 !important;
}

/* Number Plate */
.number-plate {
    background: linear-gradient(to bottom, #F8D038 0%, #F5CA2E 100%);
    border: 1px solid #000;
    border-radius: 5px;
    box-shadow: 1px 1px 1px #DDD;
    color: #000;
    font-family: helvetica, ariel, sans-serif;
    font-size: 1.5em;
    font-weight: bold;
    padding: .25em 0.75em .25em 2.5em;
    position: relative;
}

.number-plate:before {
    background: #063298;
    border-radius: 5px 0 0 5px;
    color: #F8D038;
    content: 'GB';
    display: block;
    font-size: 0.5em;
    height: 100%;
    line-height: 53px;
    padding-left: 12px;
    position: absolute;
    top: 0;
    width: 26px;
}

.number-plate:after {
    border: 1px dashed #F8D038;
    border-radius: 30px;
    content: '';
    display: block;
    height: 15px;
    left: 10px;
    position: absolute;
    top: 3px;
    width: 15px;
}

/* Dummy Subtable */
.dummy-subtable-header {
    background: #F3F3F4;
    border: none;
    border-radius: 10px 10px 0 0;
    border-top: 5px solid #578697;
    font-weight: bold;
    margin: 0px;
}

.dummy-subtable-table {
    margin-bottom: 0px !important;
}

.dummy-subtable-table thead tr th {
    background-color: #F3F3F4 !important;
    border-radius: 0px !important;
}

/* Primefaces Messages */
body .ui-messages .ui-messages-info {
    background-color: #1AB394;
    border: none;
}

body .ui-messages .ui-messages-info .ui-messages-info-icon:before {
    content: "\f058";
}

.ui-messages ul {
    line-height: 16px;
}

/*Primefaces Scheduler */
body .fc .fc-event.red {
    background-color: #F56F64;
    border: 1px solid #F56F64;
    color: #FFF;
}

body .fc .fc-event.green {
    background-color: #1AB394;
    border: 1px solid #1AB394;
    color: #FFF;
}

/* Gallery */
.gallery {
    width: auto;
}

.gallery-small {
    width: 130px;
}

/* Date Picker */
.ui-calendar.text-center input {
    text-align: center;
}

body .ui-datepicker .ui-datepicker-calendar td a {
    border-radius: 50%;
}

body .ui-datepicker .ui-datepicker-calendar td.ui-datepicker-today a {
    background-color: #EEE;
    font-weight: bold;
}

/* Subcontractor Widgets */
.subcontractor-widget {
    background-color: #406E7E;
    border-radius: 2px;
    color: #FFF;
    margin-top: 10px;
    padding: 10px 15px;
}

.subcontractor-widget.query {
    background-color: #F56F64;
}

.subcontractor-widget p.title {
    font-size: 16px;
    font-weight: 500;
    margin: 0 0 5px 0;
}

.subcontractor-widget p.count {
    font-size: 32px;
    line-height: 80px;
    margin: 0;
}

.subcontractor-widget i {
    font-size: 3.5em;
    margin-left: 10px;
}

/* Customer Portal Widgets */
.customer-portal-widget {
    background-color: #406E7E;
    border-radius: 10px;
    color: #FFF;
    margin-bottom: 10px !important;
    padding: 10px 10px;
}

.customer-portal-widget.query {
    background-color: #F56F64;
}

.customer-portal-widget.info {
    background-color: #EDEDED;
    color: #406E7E;
}

.customer-portal-widget p.title {
    font-size: 16px;
    font-weight: 500;
    margin: 0 0 5px 0;
}

.customer-portal-widget p.count {
    font-size: 32px;
    line-height: 80px;
    margin: 0;
}

.customer-portal-widget i {
    font-size: 3.5em;
}

/* Unauthorized */
.unauthorized-banner {
    background-color: #FFF !important;
}

.unauthorized-banner i.fa {
    float: left;
    font-size: 4.5em;
    margin-left: 15px;
    margin-right: 15px;
}

.unauthorized-banner p {
    margin-bottom: 5px;
}

/* Other */
div.subtotal {
    float: right;
    font-size: 1.2em;
    margin: 5px 0;
    padding: 8px 5px;
}

div.subtotal.big {
    font-size: 1.4em;
}

.no-wrap, .no-wrap td, td.no-wrap {
    white-space: nowrap !important;
}

.box-shadow {
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.08);
}

.fancybox-is-open .fancybox-bg {
    opacity: .75 !important;
}

body .ui-panel .ui-panel-footer, body .ui-panel .ui-panel-content, body .ui-tabs .ui-tabs-panels,
body .ui-dialog .ui-dialog-content, body .ui-datatable thead th, body .ui-datatable .ui-datatable-data > tr,
body .ui-accordion .ui-accordion-content, body .ui-accordion .ui-accordion-header.ui-state-hover,
body .ui-accordion .ui-accordion-header.ui-tabs-outline {
    color: #676A6C;
}

.ui-dialog .ui-dialog-content {
    overflow: hidden;
}

.ui-dialog .p-grid:first-child {
    margin-right: 0;
    max-height: calc(100vh - 190px);
    overflow-y: auto;
}

/* Popups */
body .ui-tooltip .ui-tooltip-text {
    background-color: #578697;
    border-radius: 8px;
    color: #FFF;
    opacity: 1;
    padding: 8px 15px;
}

body .ui-tooltip.ui-tooltip-right .ui-tooltip-arrow {
    border-right-color: #578697;
}

body .ui-tooltip.ui-tooltip-left .ui-tooltip-arrow {
    border-left-color: #578697;
}

body .ui-tooltip.ui-tooltip-top .ui-tooltip-arrow {
    border-top-color: #578697;
}

body .ui-tooltip.ui-tooltip-bottom .ui-tooltip-arrow {
    border-bottom-color: #578697;
}

body .ui-dialog {
    border-radius: 20px;
    margin-top: 30px;
    max-width: 900px;
    width: 100% !important;
}

body .ui-dialog.popup-small {
    max-width: 400px;
}

body .ui-dialog.popup-large {
    max-width: 1000px;
}

body .ui-panel .ui-panel-footer, body .ui-panel .ui-panel-content, body .ui-tabs .ui-tabs-panels,
body .ui-dialog .ui-dialog-content, body .ui-datatable thead th, body .ui-datatable .ui-datatable-data > tr {
    border: none;
    color: #676A6C;
}

body .ui-panel .ui-panel-content {
    padding: 0;
}

.well {
    background-color: #F3F3F4;
    border: 1px solid #F3F3F4;
    border-radius: 10px;
    box-shadow: none;
    min-height: 20px;
    padding: 1em;
}

.bs-callout .well {
    background-color: #DDD;
    border: 1px solid #DDD;
}

.well-white {
    background-color: #FFF;
}

.well-green {
    background-color: #1AB394;
    color: #FFF;
}

.well-red {
    background-color: #D9534F !important;
    color: #FFF;
}

.well-yellow {
    background-color: #F79703 !important;
    color: #FFF;
}

/* Row Editor */
body .ui-datatable .ui-datatable-data > tr .ui-row-editor .ui-icon.ui-icon-close,
body .ui-datatable .ui-datatable-data > tr .ui-row-editor .ui-icon.ui-icon-check {
    font-size: 1.5em;
}

.ui-datatable .ui-datatable-data tr.ui-row-editing td.ui-editable-column,
.ui-datatable .ui-datatable-data td.ui-cell-editing {
    padding: 3px;
}

.engineer-selector {
    margin-bottom: 20px;
    text-align: center;
}

.engineer-selector .ui-selectonemenu {
    width: 300px;
}

/* Menu */
.layout-menu .Separator {
    border-top: 1px solid #E5E5E5;
    margin: 7px 25px;
}

.layout-menu-container i {
    font-size: 1.1em;
}

.layout-wrapper .layout-topbar .topbar-menu .user-profile {
    padding: 0 5px 0 10px;
}

.layout-wrapper.layout-horizontal .layout-topbar .layout-topbar-logo {
    margin: 10px 0 0 10px;
}

.ui-menu-list .ui-separator {
    background: #C5C5C5;
    height: 1px;
    width: 100%;
}

#menuform\:right-menu-item {
    float: right;
}

@media screen and (max-width: 896px) {
    #menuform\:right-menu-item {
        float: none;
    }

    .layout-wrapper .layout-main {
        padding-top: 50px;
    }

    .layout-wrapper .layout-content-mask {
        top: 0;
    }

    .layout-wrapper .layout-menu-container {
        top: 70px;
    }

    .layout-wrapper.layout-horizontal .layout-menu-container .layout-menu > li > ul > li a {
        padding-left: 30px;
    }
}

/* Select Checkbox Menu */
body .ui-selectcheckboxmenu .ui-selectcheckboxmenu-multiple-container {
    padding: 0 26px 0 0;
}

body .ui-selectcheckboxmenu .ui-selectcheckboxmenu-multiple-container .ui-selectcheckboxmenu-token {
    margin: 5px;
    padding: 3px;
}

body .ui-selectcheckboxmenu .ui-selectcheckboxmenu-multiple-container .ui-selectcheckboxmenu-token .ui-selectcheckboxmenu-token-label {
    font-weight: normal;
}

body .ui-selectcheckboxmenu, body .ui-inputfield {
    background-color: #EDEDED;
    border: none;
    border-bottom: 2px solid;
    border-radius: 8px;
    color: #406E7E;
    font-weight: bold;
}

body .white-background.ui-inputfield, body .white-background.ui-inputfield, body .white-background .ui-inputfield {
    background-color: #FFF;
}

body .ui-selectonemenu {
    background-color: #EDEDED;
    background-color: #EDEDED;
    border: none;
    border-bottom: 2px solid;
    border-radius: 8px;
    color: #406E7E;
}

body .ui-selectonemenu-panel .ui-selectonemenu-filter-container {
    width: 100%;
}

body .ui-selectonemenu label.ui-selectonemenu-label {
    background: #EDEDED;
    height: 29px;
}

body .ui-selectonemenu.white-background label.ui-selectonemenu-label {
    background: #FFF;
}

body .ui-autocomplete.white-background input {
    background: #FFF;
}

body .ui-autocomplete.full-width, body .ui-autocomplete.full-width input {
    width: 100% !important;
}

body .ui-selectonemenu.text-center label.ui-selectonemenu-label {
    text-align: center;
}

body .ui-selectonemenu-item.ui-selectonemenu-list-item {
    font-weight: bold;
}

body .ui-selectonemenu-panel, body .ui-selectonemenu-items.ui-selectonemenu-list {
    border-radius: 0 0 10px 10px;
    padding: 0px;
}

body .ui-selectonemenu-items.ui-selectonemenu-list li:last-child {
    border-radius: 0 0 10px 10px;
}

/* Accordion Panel */
body .ui-accordion .ui-accordion-header {
    color: #666;
    font-weight: inherit;
}

/* Tabs */
body .ui-tabs-top.ui-tabs .ui-tabs-panel {
    border-top: 1px solid #D8D8DC;
}

body .ui-tabs.false-tabs .ui-tabs-panels .ui-tabs-panel {
    padding: 0;
}

body .ui-tabs .ui-tabs-nav .ui-tabs-header {
    margin: 0;
}

body .ui-tabs.ui-tabs-top.worksheet-tabs .ui-tabs-panels {
    border-bottom: 2px solid #578697;
    border-left: none;
    border-right: none;
    border-top: 4px solid #578697;
}

body .ui-tabs.ui-tabs-top.worksheet-tabs .ui-tabs-panels .ui-tabs-panel {
    padding: 10px 0;
}

body .ui-tabs.worksheet-tabs .ui-tabs-nav .ui-tabs-header.ui-state-active,
body .ui-tabs.worksheet-tabs .ui-tabs-nav .ui-tabs-header.ui-state-default {
    border: none;
    border-bottom: 1px solid #578697;
}

body .ui-tabs.worksheet-tabs .ui-tabs-nav .ui-tabs-header.ui-state-active a {
    background-color: #578697;
    border-radius: 10px 10px 0 0;
    color: #FFF;
}

.ui-tabs.ui-tabs-top > .ui-tabs-nav li {
    top: 0;
}

body .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header {
    border: none;
    border-bottom: 4px solid #E5E5E5;
    border-bottom-color: transparent;
}

body .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header:first-child {
    border-top-left-radius: 10px;
}

body .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header:last-child {
    border-top-right-radius: 10px;
}

body .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header:hover {
    background-color: #FFF;
    border-bottom: 4px solid #E5E5E5;
}

body .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header.ui-state-active {
    border: none;
    border-bottom: 4px solid #578697;
    font-weight: bold;
}

body .ui-tabs.ui-tabs-top .ui-tabs-nav {
    background: transparent;
}

/* Dummy Tabs (Dummy Top Tab Row) */
div.ui-tabs.ui-tabs-top.dummy-tabs.dummy-tabs-no-side-border div.ui-tabs-panel {
    border-left: none;
    border-right: none;
    min-height: 0px;
    padding: 0px;
}

div.ui-tabs.ui-tabs-top.dummy-tabs {
    padding-bottom: 0px;
}

div.ui-tabs.ui-tabs-top.dummy-tabs div.ui-tabs-panels {
    border-bottom: none;
}

div.ui-tabs.ui-tabs-top.dummy-tabs div.ui-tabs-panel {
    border-bottom: none;
    padding: 8px;
}

div.ui-tabs.ui-tabs-top.dummy-tabs + div.ui-tabs {
    background: #FFF;
    border: 1px solid #E7EAEC;
    border-top: none;
    padding: 0px;
}

div.ui-tabs.ui-tabs-top.dummy-tabs + div.ui-tabs div.ui-tabs-panel {
    border: none;
    border-top: 1px solid #E7EAEC;
}

div.ui-tabs.ui-tabs-top.dummy-tabs + div.ui-tabs ul.ui-tabs-nav li {
    top: 0;
}

div.ui-tabs.ui-tabs-top.dummy-tabs + div.ui-tabs ul.ui-tabs-nav li a {
    border-radius: 0px;
}

div.ui-tabs.ui-tabs-top.dummy-tabs + div.ui-tabs ul.ui-tabs-nav li:first-child a {
    border-left: none;
}

div.ui-tabs.ui-tabs-top.dummy-tabs div.ui-tabs-panel {
    min-height: 25px;
}

.logo-tabs li {
    vertical-align: bottom !important;
}

.logo-tabs li:hover {
    background-color: #EEE !important;
    border: none !important;
}

.logo-tabs li:hover a {
    background-color: #EEE !important;
    border: 1px solid #EEE !important;
}

.logo-tabs li.ui-state-active:hover {
    background-color: #FFF !important;
    border: none !important;
}

.logo-tabs li.ui-state-active:hover a {
    background-color: #FFF !important;
    border-color: #E7EAEC #E7EAEC transparent !important;
}

.logo-tabs img {
    height: 30px;
}

.logo-tabs .ui-state-active img {
    height: 50px;
}

/* Dialogs */
body .ui-dialog .ui-dialog-titlebar {
    color: #676A6C;
}

body .ui-dialog .ui-dialog-titlebar .ui-dialog-title {
    font-size: 18px;
    font-weight: 500;
}

body .ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-icon {
    font-size: 20px;
}

body .ui-dialog .ui-dialog-content {
    padding-top: 0px;
}

/* Contract Progress Bar */
.contract-progress {
    background-color: #E0E0E0 !important;
    border: none;
    margin: auto;
    width: 300px;
}

.contract-progress.contract-progress-small {
    width: 150px;
}

.contract-progress.primary .ui-progressbar-value {
    background-color: #578697;
}

.contract-progress.green .ui-progressbar-value {
    background-color: #1AB394;
}

.contract-progress.yellow .ui-progressbar-value {
    background-color: #F79703;
}

.contract-progress.red .ui-progressbar-value {
    background-color: #D9534F;
}

.label {
    background-color: #D1DADE;
    border-radius: 8px;
    color: #5E5E5E;
    color: #FFF;
    display: inline;
    line-height: 1;
    padding: 5px 10px;
    text-align: center;
    text-shadow: none;
    vertical-align: baseline;
    white-space: nowrap;
}

.label-grey {
    background-color: #676A6C;
    color: #FFF;
}

.label-green, .label-primary, .label-success {
    background-color: #21CE9E1A;
    color: #21CE9E;
}

.label-blue, .label-info {
    background-color: #0EA5E81A;
    color: #0EA5E8;
}

.label-warning {
    background-color: #FFC6581A;
    color: #FF8E6F;
}

.label-red, .label-danger {
    background-color: #FB42421A;
    color: #FB4242;
}

.label-lg {
    font-size: 1em;
    font-weight: normal;
}

/* Picklist */
.fake-picklist-filter {
    position: relative;
    width: 45%;
}

.fake-picklist-filter input {
    padding-left: 30px;
    position: absolute;
    top: 0;
}

.fake-picklist-filter i {
    left: 8px;
    position: absolute;
    top: 8px;
}

.ui-picklist.hidden-source-filter .ui-picklist-list-wrapper:first-child {
    padding-top: 34px;
}

/* Quote Picker */
.quote-picker {
    background-color: #578697;
    border-radius: 20px;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
    height: 40px;
    margin: auto;
    margin-bottom: 30px;
    overflow: hidden;
    padding-top: 3px;
    position: relative;
    width: 260px;
}

.quote-picker .left {
    color: #FFF;
    font-size: 2.7em;
    left: 10px;
    position: absolute;
    top: 4px;
}

.quote-picker .right {
    color: #FFF;
    font-size: 2.7em;
    position: absolute;
    right: 10px;
    top: 4px;
}

.quote-picker .title {
    color: #FFF;
    font-size: 16px;
    line-height: 20px;
    margin: auto;
    text-align: center;
}

.quote-picker .subtitle {
    color: #FFF;
    font-size: 12px;
    margin: auto;
    text-align: center;
}

/* Supplier Portal */
.supplier-rate-schedule {
    padding-right: 15px;
    width: 100%;
}

.supplier-rate-schedule .day {
    display: table;
    height: 40px;
    margin-bottom: 5px;
    width: 100%;
}

.supplier-rate-schedule .day-name {
    display: table-cell;
    line-height: 40px;
    text-align: center;
    width: 100px;
}

.supplier-rate-schedule .zones {
    display: table-cell;
    height: 40px;
    text-align: center;
    width: auto;
}

.supplier-rate-schedule .zone-wrapper {
    display: table;
    height: 40px;
    width: 100%;
}

.supplier-rate-schedule .zone {
    border-right: 2px solid #FFF;
    color: #FFF;
    display: table-cell;
    height: 40px;
    line-height: 40px;
    max-width: 0;
    overflow: hidden;
    padding: 0px 5px;
    text-align: center;
    text-overflow: ellipsis;
    transition: all 0.4s;
    white-space: nowrap;
}

.supplier-rate-schedule .zone:hover {
    cursor: pointer;
}

.supplier-rate-schedule .zone.cheapest-rate {
    background-color: #1AB394;
}

.supplier-rate-schedule .zone.cheapest-rate:hover {
    background-color: #14967C;
}

.supplier-rate-schedule .zone.middle-rate {
    background-color: #F79703;
}

.supplier-rate-schedule .zone.middle-rate:hover {
    background-color: #CC7C02;
}

.supplier-rate-schedule .zone.most-expensive-rate {
    background-color: #D9534F;
}

.supplier-rate-schedule .zone.most-expensive-rate:hover {
    background-color: #B33C38;
}

.supplier-rate-schedule .heading-wrapper {
    display: table;
    height: 25px;
    width: 100%;
}

.supplier-rate-schedule .heading-buffer {
    display: table-cell;
    height: 25px;
    width: 100px;
}

.supplier-rate-schedule .headings {
    display: table-cell;
    font-size: 1.4em;
    font-weight: bold;
    position: relative;
    width: auto;
}

.supplier-rate-schedule .headings .heading {
    position: absolute;
}

.supplier-rate-schedule .headings .start-day {
    left: -4px;
}

.supplier-rate-schedule .headings .start-work {
    left: 37.6%;
}

.supplier-rate-schedule .headings .end-work {
    left: 70.3%;
}

.supplier-rate-schedule .headings .end-day {
    right: -8px;
}

.supplier-portal-total {
    background-color: #1AB394;
    color: #FFF;
    margin-left: -15px;
    margin-right: -15px;
    margin-top: 30px;
    padding: 15px;
    text-align: center;
}

.supplier-portal-total-red {
    background-color: #D9534F;
}

.supplier-portal-total h2 {
    margin: 0;
}

.supplier-portal-warning {
    background-color: #F5F5F5;
    color: #D9534F;
    margin-left: -15px;
    margin-right: -15px;
    padding: 15px;
    text-align: center;
}

/* Tables */

.ui-datatable .ui-column-filter {
    background-color: #FFF;
    margin-top: 3px;
}

body th .ui-selectonemenu {
    margin-top: 3px;
    width: 100%;
}

.no-scroll .ui-datatable-tablewrapper {
    overflow: hidden;
}

th.ui-state-default.ui-sortable-column.ui-state-active {
    background-color: #578697 !important;
    color: #FFF;
}

body .ui-datatable .ui-datatable-header, body .ui-datatable .ui-datatable-footer {
    border: none;
    color: #676A6C;
    font-weight: bold;
}

body .ui-datatable .ui-paginator.ui-paginator-bottom {
    background-color: #F3F3F4;
    border: none;
    border-radius: 0 0 10px 10px;
}

body .ui-datatable .ui-paginator.ui-paginator-top {
    border: none;
}

body .ui-datatable .ui-datatable-data > tr > td {
    border-top: 1px solid #D8D8DC;
    padding: .85rem 1rem;
}

body .ui-datatable .ui-datatable-data > tr:first-child > td {
    border-top: none;
}

body .ui-datatable .ui-datatable-data > tr:last-child > td {
    border-bottom: 1px solid #E5E5E5;
}

body .ui-datatable.no-gridlines .ui-datatable-data > tr > td {
    border: none;
}

body .ui-datatable.no-gridlines .ui-datatable-data > tr > td {
    border-bottom: 1px solid #E5E5E5;
}

body .ui-datatable.no-gridlines .ui-datatable-data > tr.ui-state-hover {
    border: none;
}

body .ui-datatable .ui-datatable-data > tr.ui-datatable-even {
    background-color: #FFF;
}

body .ui-datatable .ui-datatable-data > tr.ui-datatable-even.ui-state-hover,
body .ui-datatable .ui-datatable-data > tr.ui-datatable-odd.ui-state-hover {
    background-color: #F3F3F4;
    border: none;
}

body .ui-datatable .ui-datatable-data > tr.ui-state-highlight {
    background: #F5F5F5;
    color: inherit;
}

body .ui-datatable .ui-datatable-data > tr.ui-state-highlight td {
    color: inherit;
}

body .ui-datatable thead th {
    background-color: #F3F3F4;
}

body .ui-datatable thead th:first-child:not(.hidden) {
    border-top-left-radius: 10px;
}

body .ui-datatable thead th:last-child:not(.hidden) {
    border-top-right-radius: 10px;
}

body .ui-datatable thead th.left-border {
    border-left: 1px solid #D8D8DC;
}

body .ui-datatable .ui-datatable-data > tr > td.ui-datatable-subtable-header {
    background-color: #F8F8F8;
    border-top: 5px solid #578697;
    color: #676A6C;
}

body .ui-datatable.table-condensed .ui-datatable-data > tr > td {
    padding: 4px;
}

body .ui-datatable tfoot td {
    border: none;
}

.ui-datatable {
    margin-bottom: 12px;
}

.ui-datatable.no-header thead {
    display: none;
}

table {
    border: none;
}

td input, td div.ui-selectonemenu {
    width: 100%;
}

body .ui-panelgrid.no-border .ui-panelgrid-cell {
    border: none;
}

.ui-datatable-tablewrapper th.column-odd, .ui-datatable-tablewrapper th.ui-state-default.column-odd,
.ui-datatable-tablewrapper td.ui-state-default.column-odd, div.ui-datatable.ui-widget.textAlignCenter.table.laTable div.ui-datatable-tablewrapper thead th.column-odd {
    background-color: #DDD;
}

div.table td.column-odd {
    background-color: rgba(0, 0, 0, 0.05);
}

div.table tr.ui-datatable-odd-dark {
    background-color: #EEE;
}

div.table tr.normal-row td {
    background-color: #FFF;
}

div.table tr.normal-row.ui-state-hover td {
    background-color: #F1F1F1;
}

div.table tr.alternative-row td {
    background-color: #E7E7E7;
}

div.table tr.alternative-row.ui-state-hover td {
    background-color: #DDD;
}

div.table tr.normal-row.ui-state-highlight td, div.table tr.alternative-row.ui-state-highlight td {
    background-color: #578697;
}

/* Omnisearch */
.omni-searchbar {
    margin: auto;
    margin-bottom: 20px;
    max-width: 500px;
    position: relative;
}

.omni-searchbar input.form-control.omni-searchbox {
    border: 1px solid #DDD;
    border-radius: 23px;
    font-size: 15px;
    height: 46px;
    line-height: 1.3333333;
    padding: 10px 60px;
    width: 100%;
}

.omni-searchbar.omnibox-red input.form-control.omni-searchbox {
    border: 1px solid #DDD;
    border-radius: 23px;
    font-size: 18px;
    height: 46px;
    line-height: 1.3333333;
    padding: 10px 60px;
    width: 100%;
}

.omni-searchbar input.form-control.omni-searchbox:focus {
    border: 2px solid #406E7E;
    box-shadow: none !important;
    outline: none;
}

.omni-searchbar.omnibox-red input.form-control.omni-searchbox,
.omni-searchbar.omnibox-red input.form-control.omni-searchbox:focus {
    border-color: #ED5565;
}

.omni-searchbar.search-button input.form-control.omni-searchbox {
    padding: 10px 60px 10px 30px;
}

.omni-searchbar i.omni-search-icon {
    font-size: 1.5em;
    left: 20px;
    position: absolute;
    top: 14px;
}

.omni-searchbar i.omni-search-icon-button {
    background-color: #406E7E;
    border: none;
    border-radius: 50%;
    color: #FFF;
    font-size: 1.5em;
    left: 0px;
    padding: 13px;
    position: absolute;
    top: 0px;
}

.omni-searchbar i.omni-cancel-icon {
    color: #ED5565;
    font-size: 1.5em;
    position: absolute;
    right: 15px;
    top: 12px;
}

.omni-searchbar i.omni-search-button {
    background: #406E7E;
    border-radius: 50%;
    color: #FFF;
    font-size: 1.7em;
    height: 46px;
    padding: 8px 13px 13px 12px;
    padding-top: 11px;
    position: absolute;
    right: 0px;
    top: 0px;
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    width: 46px;
}

.omni-searchbar i.omni-search-icon-button:hover {
    background-color: #274F5D;
}

.omni-searchbar i.omni-cancel-icon:hover {
    color: #D7394A !important;
    cursor: pointer;
}

.false-tabs div.ui-tabs-panels {
    border-bottom: none;
    border-left: none;
    border-right: none;
}

.card {
    border-radius: 15px;
    margin-bottom: 24px;
    padding: 18px;
    position: relative;
}

.card-grey {
    background-color: #EEE;
}

.card-footer, .modal-footer {
    margin-top: 15px;
}

.card-footer:before, .card-footer:after, .modal-footer:before,
.modal-footer:after {
    content: " ";
    display: table;
}

.card-footer:after, .modal-footer:after {
    clear: both;
}

.date-chooser {
    background-color: #FFF;
    border-bottom: 4px solid #406E7E;
    display: inline-block;
    font-weight: bold;
    line-height: 2em;
    text-align: center;
    width: 100%;
}

body {
    color: #676A6C;
}

.ui-datatable table {
    table-layout: auto;
}

body .ui-datatable .ui-datatable-data > tr.grey, .grey {
    color: #CCC;
}

body .ui-datatable .ui-datatable-data > tr.green, .green {
    color: #1AB394;
}

tr.red {
    color: #F56F64 !important;
}

.danger, .red {
    color: #F56F64;
}

tr.orange {
    color: #F79703 !important;
}

.info, .blue {
    color: #3F8EFC;
}

.warning {
    color: #F5B064;
}

.gold {
    color: #FFA700 !important
}

.ui-outputlabel {
    display: block;
    margin-bottom: 0.3em;
    margin-top: 1em;
}

td .ui-outputlabel {
    display: block;
    margin-bottom: inherit;
    margin-top: inherit;
}

.media {
    margin-top: 15px;
}

.media:first-child {
    margin-top: 0;
}

.media, .media-body {
    overflow: hidden;
    zoom: 1;
}

.media-body {
    padding-left: 15px;
    vertical-align: middle;
    width: 100%;
}

.media-object {
    display: block;
}

.media-object.img-thumbnail {
    max-width: none;
}

.media-right, .media > .pull-right {
    padding-left: 10px;
}

.media-left {
    padding-right: 15px;
    vertical-align: middle;
}

.bs-callout .well .media-left {
    border-right: 1px solid #AFAFAF;
}

.media-right {
    vertical-align: middle;
}

.media-left, .media > .pull-left {
    padding-left: 10px;
    padding-right: 10px;
}

.media-left, .media-right, .media-body {
    display: table-cell;
}

.media-middle {
    vertical-align: middle;
}

.media-bottom {
    vertical-align: bottom;
}

.media-heading {
    margin-bottom: 5px;
    margin-top: 0;
}

.media-list {
    list-style: none;
    padding-left: 0;
}

/* Cards */
.card h1, .card h2, .card h3, .card h4, .card h5 {
    font-weight: bold;
}

.card-bordered {
    border-left: 7px solid #676A6C;
}

.card-bordered.card-success {
    border-color: #1AB394;
}

.card-bordered.card-primary {
    border-color: #578697;
}

.card-bordered.card-danger {
    border-color: #F56F64;
}

.card-bordered.card-warning {
    border-color: #F5B064;
}

body .ui-panel {
    margin-bottom: 20px;
}

body .ui-panel.no-padding .ui-panel-content {
    padding: 0px;
}

body .ui-datatable thead > tr {
    border: none;
}

body .ui-panel .ui-panel-titlebar {
    background-color: #F3F3F4;
    border: none;
    border-radius: 10px 10px 0 0;
    color: #676A6C;
    text-shadow: none;
}

body .ui-datatable thead th .ui-column-title {
    font-weight: bold;
}

body .ui-panel.bordered {
    border: 1px solid #D8D8DC;
}

body .ui-panel.bordered .ui-panel-titlebar {
    border: none;
}

/* tree */
body .ui-tree {
    border: none;
    color: #65656A;
}

.ui-treenode-label {
    width: 90%;
}

body .ui-tree .ui-tree-container .ui-treenode .ui-treenode-content .ui-treenode-label.ui-state-highlight,
body .ui-tree .ui-tree-container .ui-treenode .ui-treenode-content .ui-treenode-label.ui-state-highlight i,
body .ui-tree .ui-tree-container .ui-treenode .ui-treenode-content .ui-treenode-label.ui-state-hover,
.ui-treenode-label.ui-state-hover,
body .ui-tree .ui-tree-container .ui-treenode .ui-treenode-content .ui-treenode-label.ui-state-hover i,
.ui-treenode-label.ui-state-hover i {
    background-color: #FFF;
    color: #000;
}

.ui-treenode-label.ui-state-hover div {
    background-color: #FFF;
    color: #000;
}

.tree-node-label, .ui-treenode-content {
    vertical-align: middle;
}

body .ui-tree .ui-tree-container .ui-treenode .ui-treenode-content .ui-tree-toggler {
    color: #ADADAD;
}

.tree-node-label i {
    color: #ADADAD;
    margin-right: 10px;
}

.middle {
    vertical-align: middle !important;
}

.bs-callout {
    background-color: #F0F0F0;
    border-radius: 10px;
    border-top: 5px solid #676A6C;
    margin-bottom: 12px;
    padding: 12px;
}

.bs-callout.white-background {
    background-color: #FFF;
}

.bs-callout-danger {
    border-color: #F56F64 !important;
}

.bs-callout-danger i {
    color: #F56F64;
}

.bs-callout-primary {
    border-color: #578697;
}

.bs-callout-primary i {
    color: #578697;
}

.bs-callout-success {
    border-color: #1AB394 !important;
}

.bs-callout-success i {
    color: #1AB394;
}

.bs-callout-warning {
    border-color: #F5B064 !important;
}

.bs-callout-warning i {
    color: #F5B064;
}

.text-center {
    text-align: center !important;
}

span.text-center > input {
    text-align: center !important;
}

.text-right {
    text-align: right !important;
}

.bold {
    font-weight: bold;
}

.clearfix:before, .clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.pull-right {
    float: right !important;
}

.pull-left {
    float: left !important;
}

.hide, .hidden {
    display: none !important;
}

.show {
    display: block !important;
}

.invisible {
    visibility: hidden;
}

.ui-fluid .ui-button {
    width: inherit;
}

.new-call-label {
    background-color: #578697;
    border-radius: 10px;
    color: #FFF;
    display: inline-block;
    font-size: 12px;
    height: 80px;
    margin-bottom: 0px;
    margin-right: 10px;
    margin-top: 10px;
    padding: 10px;
    text-align: center;
    white-space: nowrap;
    width: 110px;
}

.new-call-label.sla {
    background-color: #DEDEDE;
    border-radius: 10px;
    color: #676A6C;
    font-size: 28px;
    padding-top: 20px;
    width: 90px;
}

.sla-label {
    background-color: #676A6C;
    border-radius: 5px;
    color: #FFF;
    color: #FFF;
    display: inline-block;
    font-size: 13px;
    height: 50px;
    padding: 10px;
    text-align: center;
    white-space: nowrap;
    width: 50px;
}

.new-call-label.danger, .new-call-label-small.danger {
    background-color: #F56F64;
}

.new-call-label.warning, .new-call-label-small.warning {
    background-color: #F5B064;
}

.new-call-label i {
    font-size: 2.5em;
}

.new-call-label-small i {
    font-size: 20px;
}

.new-call-label-small {
    background-color: #578697;
    border-radius: 2px;
    color: #FFF;
    display: inline-block;
    font-size: 12px;
    height: 35px;
    margin-bottom: 4px;
    margin-right: 4px;
    margin-top: 4px;
    padding: 5px;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    width: 50px;
}

.bs-callout h1:first-child, .bs-callout h2:first-child, .bs-callout h3:first-child {
    margin-top: 0px;
}

.ui-rating.ui-state-disabled {
    opacity: 1;
}

.ui-rating .ui-rating-star a {
    color: #406E7E !important;
    height: 0.9em !important;
}

.ui-rating.alt-colour .ui-rating-star a {
    color: #FFF !important;
}

.ui-rating.small .ui-rating-star a {
    font-size: 1em;
}

/* File Upload */
body .ui-fileupload .ui-fileupload-buttonbar {
    background-color: #F3F3F4;
    border: none;
    border-radius: 10px 10px 0 0;
    padding: 10px 15px;
}

body .ui-fileupload .ui-fileupload-content {
    border: 1px solid #EBEBEB;
    border-radius: 0 0 10px 10px;
    border-top: none;
}

/* Checkbox */
body .ui-chkbox {
    height: 30px;
    width: 30px;
}

body .ui-chkbox .ui-chkbox-box {
    background-color: #DEDEDE;
    border: none;
    border-bottom: 2px solid #406E7E;
    border-radius: 6px;
    height: 30px;
    width: 30px;
}

body .ui-chkbox .ui-chkbox-box.ui-state-active {
    border-bottom: 0px solid #406E7E;
}

body button.ui-button {
    border-radius: 8px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
}

body button.ui-button.xs-btn {
    border-radius: 5px;
}

body .ui-button.pull-right {
    margin-left: 10px;
}

.ui-button.xs-btn .ui-button-text {
    font-size: 12px;
    line-height: 1.5;
    padding: 1px 5px !important;
}

.ui-button.block-btn {
    width: 100%;
}

body .ui-button.outline-btn {
    background-color: #FFF;
}

.ui-button.primary-btn.outline-btn {
    color: #578697;
}

.ui-button.primary-btn.outline-btn:hover {
    background-color: #578697;
    color: #FFF;
}

.ui-button.warning-btn.outline-btn {
    color: #F5B064;
}

.ui-button.danger-btn.outline-btn {
    color: #F56F64;
}

body .ui-selectmanybutton .ui-button {
    box-shadow: none;
}

body .ui-selectmanybutton .ui-button:first-child {
    border-radius: 8px 0 0 8px;
}

body .ui-selectmanybutton .ui-button:last-child {
    border-radius: 0 8px 8px 0;
}

body .ui-buttonset:not(.ui-splitbutton) > .ui-button.ui-state-hover {
    background-color: #CCC;
    border-color: #CCC;
    color: #252529;
}

.badge {
    border-radius: 10px;
    display: inline-block;
    font-size: 11px;
    font-weight: 300;
    line-height: 1;
    min-width: 10px;
    padding: 5px 9px;
    text-align: center;
    text-shadow: none;
    vertical-align: middle;
    white-space: nowrap;
}

.badge-warning {
    background-color: #F5B064;
    color: #FFF;
}

.badge-danger {
    background-color: #F56F64;
    color: #FFF;
}

.badge-primary {
    background-color: #578697;
    color: #FFF;
}

.badge-success {
    background-color: #1AB394;
    color: #FFF;
}

.layout-wrapper .layout-topbar .topbar-menu > li > a .layout-profile-userinfo {
    margin: 14px 0 0 8px;
}

/* Circle Nav Bar */
.process-step .btn:focus {
    outline: none;
}

.process {
    display: table;
    margin-bottom: 15px;
    margin-top: 15px;
    position: relative;
    width: 100%;
}

.process-row {
    display: table-row;
}

.process-step button[disabled] {
    opacity: 1 !important;
}

.process-row:before {
    background-color: #CCC;
    bottom: 0;
    content: " ";
    height: 1px;
    position: absolute;
    top: 52px;
    width: 100%;
    z-index: 0;
}

.process-advantage .process-row:before {
    background-color: #CCC;
    bottom: 0;
    content: " ";
    height: 1px;
    position: absolute;
    top: 37px;
    width: 100%;
    z-index: 0;
}

.process-step {
    display: table-cell;
    position: relative;
    text-align: center;
    width: 33%;
}

.process-step p {
    margin-top: 4px;
}

.btn-circle {
    border-radius: 50% !important;
    font-size: 12px;
    text-align: center;
}

.process-step p {
    margin-bottom: 0px;
}

.process-step a {
    line-height: 5.4em;
}

@media ( max-width: 610px) {
    .process-advantage .process-row:before {
        top: 22px;
    }

    .process-row:before {
        top: 20px;
    }

    .btn-circle {
        height: 40px;
        width: 40px;
    }

    .btn-circle.btn-lg {
        border-radius: 25px;
        font-size: 18px;
        height: 50px;
        line-height: 1.33;
        padding: 10px 16px;
        width: 50px;
    }

    .process-step a {
        line-height: 40px;
    }

    .process-step a i {
        font-size: 1.5em;
    }

    .process-step p {
        font-size: 10px;
    }

    .btn-circle {
        border-width: 3px !important;
    }
}

@media ( min-width: 611px) {
    .btn-circle {
        height: 70px;
        padding: 5px 10px;
        width: 70px;
    }

    .process-step a {
        line-height: 4.4em;
    }

    .process-step a i {
        font-size: 2.5em;
    }

    .process-step p {
        font-size: inherit;
    }

    .btn-circle.btn-lg {
        border-radius: 50px;
        font-size: 24px;
        height: 100px;
        line-height: 1.33;
        padding: 20px 20px;
        width: 100px;
    }
}

.btn-configure {
    color: #1CBF9E;
    font-size: 0.9em;
    font-style: italic;
}

.btn-configure:hover {
    text-decoration: underline;
}

.btn-remove {
    color: #ED5565;
    font-size: 0.9em;
    font-style: italic;
}

.btn-remove:hover {
    color: #ED5565;
    text-decoration: underline;
}

.btn-default {
    background-color: #FFF;;
    border: 5px solid #B1B3B5;
    color: #B1B3B5;
}

.btn-default.blue-background {
    background-color: #FFF;;
    border: 5px solid #1C84C6;
    color: #1C84C6;
}

.btn-default.red-background {
    background-color: #D9534F;
    border-color: #D9534F;
}

.btn-default.green-background {
    background-color: #FFF;;
    border: 5px solid #1AB394;
    color: #1AB394;
}

.btn-default.yellow-background {
    background-color: #FFF;;
    border: 5px solid #F79703;
    color: #F79703;
}

.btn-default.btn-circle:hover, .btn-default.btn-circle:focus,
.btn-default.btn-circle:active, .btn-default.active.btn-circle, .open .dropdown-toggle.btn-default.btn-circle {
    background-color: #B9B9B9;
    border-color: #B9B9B9;
    color: #FFF;
}

.btn-default.blue-background:hover, .btn-default.blue-background:focus,
.btn-default.blue-background:active, .btn-default.active.blue-background,
.open .dropdown-toggle.btn-default.blue-background {
    background-color: #1877B2;
    border-color: #1877B2;
    color: #FFF;
}

.btn-default.red-background:hover, .btn-default.red-background:focus,
.btn-default.red-background:active, .btn-default.active.red-background,
.open .dropdown-toggle.btn-default.red-background {
    background-color: #C64B49;
    border-color: #C64B49;
    color: #FFF;
}

.btn-default.green-background:hover, .btn-default.green-background:focus,
.btn-default.green-background:active, .btn-default.active.green-background,
.open .dropdown-toggle.btn-default.green-background {
    background-color: #179E80;
    border-color: #179E80;
    color: #FFF;
}

.btn-white {
    color: inherit;
}

.btn-circle {
    display: inline-block;
}

.red-border {
    border-color: #ED5565 !important;
}

.green-border {
    border-color: #1AB394 !important;
}

/* Query Panel */
.layout-dashboard .live-support ul {
    padding: 0px;
}

.query-panel {
    border: 1px solid #000;
    margin-bottom: 15px;
    padding: 12px;
    position: relative;
}

.query-panel h3 {
    margin-top: 0px;
}

.query-status {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 13% 100%);
    color: #FFF !important;
    font-size: 0.9em;
    font-weight: bold;
    height: 20px;
    padding-left: 17px;
    padding-right: 8px;
    padding-top: 2px;
    position: absolute;
    right: 0px;
    text-align: right;
    top: 0px;
    width: fit-content;
}

.layout-dashboard .live-support ul li {
    padding: 0px;
}

.layout-dashboard .live-support ul li img {
    border-radius: 50%;
    width: 42px;
}

.layout-dashboard .live-support ul li .p-col-fixed {
    width: 54px;
}

.layout-dashboard .live-support .chat-message {
    background-color: #F3F3F4 !important;
}

.layout-dashboard .live-support .message-from .chat-message:before {
    border-right-color: #F3F3F4 !important;
}

.layout-dashboard .live-support .message-to .chat-message:before,
.layout-dashboard .live-support .message-to .chat-message:after {
    border-left-color: #F3F3F4 !important;
}

.query-status.red {
    background-color: #ED5565;
    border-top: 1px solid #ED5565;
}

.query-status.green {
    background-color: #1AB394;
    border-top: 1px solid #1AB394;
}

.italic {
    font-style: italic;
}

.table.table-clear .ui-datatable-tablewrapper table tbody tr.ui-datatable-even.adv-po-used,
.adv-po-used {
    background-color: #FFF3CD;
    border-color: #FFEEBA;
}

.table.table-clear .ui-datatable-tablewrapper table tbody tr.ui-datatable-even.adv-po-invoiced,
.adv-po-invoiced {
    /* pale blue */
    background-color: #D1ECF1;
    border-color: #BEE5EB;
}

.table.table-clear .ui-datatable-tablewrapper table tbody tr.ui-datatable-even.adv-po-ordered,
.adv-po-ordered {
    background-color: #F8D7DA;
    border-color: #F5C6CB;
}

ul.layout-menu li ul {
    z-index: 2 !important;
}

i.help-circle {
    color: #578697;
}

/* JSON Plugin */
.json-string {
    color: #DA7B09 !important;
}

.json-literal {
    color: #1960BE !important;
}

/* MARGINS & PADDINGS */
.fa-15x {
    font-size: 1.5em;
}

.fa-25x {
    font-size: 2.5em;
}

.p-none {
    padding: 0px !important;
}

.p-l-none {
    padding-left: 0px !important;
}

.p-r-none {
    padding-right: 0px !important;
}

.p-xxs {
    padding: 5px;
}

.p-xs {
    padding: 10px;
}

.p-sm {
    padding: 15px;
}

.p-m {
    padding: 20px;
}

.p-md {
    padding: 25px;
}

.p-lg {
    padding: 30px;
}

.p-xl {
    padding: 40px;
}

.p-w-xs {
    padding: 0 10px;
}

.p-w-sm {
    padding: 0 15px;
}

.p-w-m {
    padding: 0 20px;
}

.p-w-md {
    padding: 0 25px;
}

.p-w-lg {
    padding: 0 30px;
}

.p-w-xl {
    padding: 0 40px;
}

.m-xxs {
    margin: 2px 4px;
}

.m-xs {
    margin: 5px;
}

.m-sm {
    margin: 10px;
}

.m {
    margin: 15px;
}

.m-md {
    margin: 20px;
}

.m-lg {
    margin: 30px;
}

.m-xl {
    margin: 50px;
}

.m-n {
    margin: 0 !important;
}

.m-l-none {
    margin-left: 0;
}

.m-l-xs {
    margin-left: 5px;
}

.m-l-sm {
    margin-left: 10px !important;
}

.m-l {
    margin-left: 15px;
}

.m-l-md {
    margin-left: 20px !important;
}

.m-l-lg {
    margin-left: 30px !important;
}

.m-l-xl {
    margin-left: 40px !important;
}

.m-l-n-xxs {
    margin-left: -1px;
}

.m-l-n-xs {
    margin-left: -5px;
}

.m-l-n-sm {
    margin-left: -10px;
}

.m-l-n {
    margin-left: -15px;
}

.m-l-n-md {
    margin-left: -20px;
}

.m-l-n-lg {
    margin-left: -30px;
}

.m-l-n-xl {
    margin-left: -40px;
}

.m-t-none {
    margin-top: 0 !important;
}

.m-t-xxs {
    margin-top: 1px;
}

.m-t-xs {
    margin-top: 5px !important;
}

.m-t-sm {
    margin-top: 10px !important;
}

.m-t {
    margin-top: 15px;
}

.m-t-md {
    margin-top: 20px !important;
}

.m-t-lg {
    margin-top: 30px !important;
}

.m-t-xl {
    margin-top: 40px;
}

.m-t-n-xxs {
    margin-top: -1px;
}

.m-t-n-xs {
    margin-top: -5px;
}

.m-t-n-sm {
    margin-top: -10px;
}

.m-t-n {
    margin-top: -15px;
}

.m-t-n-md {
    margin-top: -20px;
}

.m-t-n-lg {
    margin-top: -30px;
}

.m-t-n-xl {
    margin-top: -40px;
}

.m-r-none {
    margin-right: 0;
}

.m-r-xxs {
    margin-right: 1px;
}

.m-r-xs {
    margin-right: 5px !important;
}

.m-r-sm {
    margin-right: 10px !important;
}

.m-r {
    margin-right: 15px;
}

.m-r-md {
    margin-right: 20px !important;
}

.m-r-lg {
    margin-right: 30px !important;
}

.m-r-xl {
    margin-right: 40px;
}

.m-r-n-xxs {
    margin-right: -1px;
}

.m-r-n-xs {
    margin-right: -5px;
}

.m-r-n-sm {
    margin-right: -10px;
}

.m-r-n {
    margin-right: -15px;
}

.m-r-n-md {
    margin-right: -20px;
}

.m-r-n-lg {
    margin-right: -30px;
}

.m-r-n-xl {
    margin-right: -40px;
}

.m-b-none {
    margin-bottom: 0;
}

.m-b-xxs {
    margin-bottom: 1px;
}

.m-b-xs {
    margin-bottom: 5px !important;
}

.m-b-sm {
    margin-bottom: 10px !important;
}

.m-b {
    margin-bottom: 15px;
}

.m-b-md {
    margin-bottom: 20px;
}

.m-b-lg {
    margin-bottom: 30px;
}

.m-b-xl {
    margin-bottom: 40px;
}

.m-b-n-xxs {
    margin-bottom: -1px;
}

.m-b-n-xs {
    margin-bottom: -5px;
}

.m-b-n-sm {
    margin-bottom: -10px;
}

.m-b-n {
    margin-bottom: -15px;
}

.m-b-n-md {
    margin-bottom: -20px;
}

.m-b-n-lg {
    margin-bottom: -30px;
}

.m-b-n-xl {
    margin-bottom: -40px;
}

.mdi.flip-180:before {
    transform: rotateX(180deg);
}

.p-col-1, .p-col-2, .p-col-3, .p-col-4, .p-col-5, .p-col-6, .p-col-7,
.p-col-8, .p-col-9, .p-col-10, .p-col-11, .p-col-12 {
    padding: 12px;
}