html,
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}
html {
    width: 100%;
    height: 100%;
}
body {
    height: 100%;
    width: 100%;
    position: relative;
    color: #222;
    font-weight: 500;
    font-family: 'Lato', sans-serif;
    background-color: #122048;
}
body.modalOpen header,
body.modalOpen section:not(.modal),
body.modalOpen footer {
    filter: blur(2px);
}

#container {
    background-color: #fff;
    min-height: 100%;
}

a,
a:visited {
    color: #e95625;
    text-decoration: none;
    -webkit-transition: all .2s linear;
    -moz-transition: all .2s linear;
    transition: all .2s linear;
}
a:hover {
    color: #a9aaab;
    text-decoration: none;
}

img {
    -webkit-transition: opacity .2s linear;
    transition: opacity .2s linear;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.text-right {
    text-align: right;
}
.text-center {
    text-align: center;
}
.text-left {
    text-align: left;
}

li, th, td, p {
    color: #717171;
    line-height: 1.45em;
    font-weight: 500;
    font-size: 16px;
    letter-spacing: 0.3px;
}
p:last-child {
    margin-bottom: 0;
}

strong {
    font-weight: 600;
    color: #1d1d1b;
    /*letter-spacing: .8px;*/
}

p.empty {
    text-align: center;
    width: 100%;
    font-size: 1.4em;
    padding: 40px 0;
    color: #b1afaf;
}
p.empty .button {
    background-color: #86449b;
}

h1, h2, h3, h4, h5, h6 {
    color: #122148;
    font-weight: 500;
    margin-bottom: 20px;
    line-height: 1.14em;
    /*letter-spacing: 0.7px;*/
    font-family: 'Lato', sans-serif;
}

h1 {
    font-size: 33px;
    margin-bottom: 30px;
    color: #122148;
    /*text-transform: uppercase;*/
}
h2 {
    font-size: 30px;
    margin-bottom: 30px;
    /*text-transform: uppercase;*/
    font-weight: 600;
}
h3 {
    font-size: 22px;
    margin-bottom: 15px;
}
h4 {
    font-size: 22px;
}
h1 a, h2 a, h3 a, h4 a {
    font-size: 16px;
    color: #a9aaab;
    float: right;
    text-transform: none;
    font-weight: 700;
    margin-top: 2px;
}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover {
    color: #e95625;
}
h1:after, h2:after, h3:after, h4:after {
    clear: both;
    display: table;
    content: '';
}
table th {
    color: #373737;
	font-weight: bold;
}
table.dataTable thead th.text-right.sorting{
    padding-right: 20px;
}
table td {
	color: #373737;
    font-size: 15px;
    vertical-align: middle;
}
table td.buttons {
    white-space: nowrap;
}
table td .button,
table td .button:visited,
table td .button:focus {
    height: 33px;
    padding: 0 16px;
    line-height: 30px;
    min-height: 0;
    font-size: 14px;
    /*background-color: #122148;*/
}
table td .button svg {
    display: inline-block;
    margin-right: 5px;
}

table td.overdue > span {
    background-color: #f00;
    color: #fff;
    border-radius: 3px;
    padding: 2px 4px;
    cursor:default;
}

#claim div.box {
    margin-bottom: 0;
}

section.box h2 {
    font-size: 20px;
    margin-bottom: 15px;
    padding-bottom: 5px;
    display: inline-block;
    border-bottom: 1px solid #e95625;
    font-weight: 400;
}

section.list table tbody img {
    max-width: 100px;
    max-height: 100px;
    width: auto;
    height: auto;
}

section#testimonials.list table tbody img {
    max-width: 40px;
    max-height: 40px;
}

section#testimonials.list td[data-label="Content"] {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 400px;
}

section#testimonials.list td[data-label="Rating"] {
    white-space: nowrap;
    text-align: right;
    color: #dcaf58;
}

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

.outerwrapper .wrapper {
    width: 1400px;
    max-width: calc(100% - 50px);
    margin: 0 auto;
}

time {
    font-size: 1em;
}

/*** TOOLTIPS ******************************/
#tooltip {
    text-align: center;
    color: #fff;
    background: #121f48e0;
    border-top-color: #121f48e0;
    position: absolute;
    z-index: 100;
    padding: 10px 5px;
    border-radius: 2px;
    font-size: 13px;
    line-height: 15px;
}
#tooltip:after /* triangle decoration */ {
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid;
    border-top-color: inherit;
    content: '';
    position: absolute;
    left: 50%;
    bottom: -10px;
    margin-left: -10px;
}

#tooltip.top:after {
    border-top-color: transparent;
    border-bottom: 10px solid #121f48e0;
    top: -20px;
    bottom: auto;
}
#tooltip.left:after {
    left: 10px;
    margin: 0;
}
#tooltip.right:after {
    right: 10px;
    left: auto;
    margin: 0;
}



/********** FORMS *****************************************************************/

form {
    margin-bottom: 0;
}
input, select {
    height: 40px;
	line-height: 40px;
    padding: 0px 19px 0 19px;
}
textarea {
    height: 114px;
}

textarea[rows] {
    height: unset;
}

textarea:focus,
input:not([type="submit"]):focus,
select:focus {
    box-shadow: 0 0 0 3px rgb(216, 223, 236);
    border-color: #a9acb3;
}

.form-item {
    margin-bottom: 1.2rem;
}
.form-buttons {
    margin-top: 35px;
}
.form-item a:not(.button) {
    margin-right: 15px;
}

.form .row .address .form-item {
    margin-bottom: 1.2rem;
}

.form-item.checkbox label.check {
    padding-left: 36px;
    position: relative;
    display: inline-block;
    margin-right: 15px;
    cursor: pointer;
}
.form-item.checkbox label.check input {
    position: absolute;
    top: 4px;
    left: 0;
    margin: 0;
    opacity: 0;
}
.form-item.checkbox label.check input+span {
    width: 27px;
    height: 27px;
    border: 1px solid #bbbbbb;
    border-radius: 3px;
    background-color: #fff;
    position: absolute;
    left: 0;
    top: 4px;
    z-index: 9;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 16px;
}
.form-item.checkbox label.check input+span:before {
    content: "\f00c";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    display: inline-block;
    color: #122048;
    opacity: .25;
    transition: all linear .2s;
}
.form-item.checkbox label.check input:checked+span:before {
    opacity: 1;
}
.form-item.checkbox label.check p {
    padding-top: 7px;
    font-size: 15px;
}
.form-item.checkbox.radio label.check input+span {
    border-radius: 50%;
}
button, .button, .button:visited, .button:focus, button:not(.mfp-close):focus {
    background-color: #e95625;
    /*text-transform: uppercase;*/
    font-family: 'Lato', sans-serif;
    letter-spacing: 1.3px;
    line-height: 1;
    min-height: 38px;
    /*padding: 11px 20px 13px 20px;*/
    color: #fff;
    border-radius: 6px;
    transition: all 0.2s linear;
    font-weight: 500;
    letter-spacing: 0.5px;
    font-size: 15px;
    padding: 10px 15px;
	/* min-width: 100px; */
    height: auto;
    white-space: nowrap;
    text-align: center;
}
button:not(:disabled):hover, .button:not(:disabled):hover {
    background-color: #e86438
}

.auth-button {
    background-color: #2872cf;
}

.auth-button:hover {
    background-color: #676cd6;
}

button.delete, .button.delete, .button.delete:visited,
button.btn-cancel, .button.btn-cancel, .button.btn-cancel:visited {
    background-color: #da230e;
}

button.lightblue, .button.lightblue, .button.lightblue:visited {
    background-color: #d8dfeb;
    color: #122048;
}

.excel-export,
.excel-export:visited,
.excel-export:hover,
.excel-export:active,
.excel-export:focus {
    background-color: #1f6e43;
}

.button.outline {
    border-width: 1px;
    border-color: #dedede;
    color: #696969;
    /*font-family: 'Roboto Condensed';*/
    font-weight: 600;
    /*line-height: 38px;*/
    text-align: center;
}
.button svg:first-child {
    display: inline-block;
    margin-right: 5px;
}
.button svg:last-child {
    display: inline-block;
    margin-left: 5px;
}
form .buttons {
    text-align: right;
}

form .buttons.mt {
    margin-top: 20px;
}

.redactor-box {
    border: 1px solid #d4d4d4;
}


label.file-input {
    width: 100%;
    background-color: #d8dfeb;
    color: #122048;
    border-radius: 10px;
    transition: all 0.2s linear;
    font-weight: 500;
    letter-spacing: 0.5px;
    font-size: 15px;
    padding: 7px 23px 7px 23px;
    white-space: nowrap;
    cursor: pointer;
}

label.file-input:hover {
    background-color: #d0d7e4;
}

label.file-input:before {
    content: 'Choose a File...';
}

.form-item.error > label {
    color: red;
}

.form-item.error > input, .form-item.error > select,.form-item.error > textarea {
    border: 1px solid #f00;
    color: red;
}

img.image-preview {
    width: 100px;
    height: 100px;
    float: right;
    display: block;
    border: 1px solid #ededed;
}

img.image-preview.partner {
    width: unset;
    height: unset;
    max-width: 100%;
    max-height: 100px;
}

.form-item .emblemed,
.form-item p.field > a {
    border: 1px solid #d4d4d4;
    padding: 0 19px 0 50px;
    height: 40px;
	line-height: 40px;
    border-radius: 3px;
    font-size: 13px;
    white-space: nowrap;
}

.form-item .emblemed a {
    text-overflow: ellipsis;
    overflow: hidden;
}

.form-item p.field > a {
    display: block;
    padding: 0 19px;
    margin:0;
}

label.prepend {
    position: relative;
}

label.prepend + input,
label.prepend + p.field > a,
label.prepend + select,
label.prepend + textarea {
    padding-left: 50px;
}

label.prepend:before {
    position: absolute;
	height: 40px;
	width: 40px;
	top: calc(100% + 4px);
	line-height: 40px;
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
	background-color: #d8dfeb;
	text-align: center;
	color: #122048;
	font-size: 1.2em;
}

.prepend > svg {
    top: 45px;
    position: absolute;
    left: 20px;
    transform: translate(-50%, 0);
    background-color: #d8dfeb;
}

label.prepend.type:before {
    content: '\f040';
    font-family: 'FontAwesome';
}

label.prepend.money:before {
    content: '\f154';
    font-family: 'FontAwesome';
}

label.prepend.number:before {
    content: '\f292';
    font-family: 'Font Awesome 5 Pro';
}

label.prepend.partner:before {
    content: '\f2b5';
    font-family: 'Font Awesome 5 Pro';
}

label.offer.offer:before {
    content: '\f0a3';
    font-family: 'Font Awesome 5 Pro';
    font-weight: 700;
}

label.prepend.status:before {
    content: '\f129';
    font-family: 'FontAwesome';
}

label.prepend.text:before {
    content: '\f031';
    font-family: 'FontAwesome';
}

label.prepend.pencil:before {
    content: '\f040';
    font-family: 'FontAwesome';
}

label.prepend.select:before {
    content: '\f733';
    font-family: 'Font Awesome 5 Pro';
}

label.prepend.pencil.height:before {
    height: 114px;
}

label.prepend.clock:before {
    content: '\f017';
    font-family: 'FontAwesome';
}

label.prepend.date:before {
    content: '\f073';
    font-family: 'FontAwesome';
}

label.prepend.plan:before {
    content: '\f06d';
    font-family: 'FontAwesome';
}

label.prepend.user:before {
    content: '\f007';
    font-family: 'FontAwesome';
}

label.prepend.engineer:before {
    content: '\f2c2';
    font-family: "Font Awesome 5 Pro";
    font-weight: 400;
}

label.prepend.phone:before {
    content: '\f095';
    font-family: 'FontAwesome';
}

label.prepend.mobile:before {
    content: '\f10b';
    font-family: 'FontAwesome';
}

label.prepend.email:before {
    content: '\f1fa';
    font-family: "Font Awesome 5 Pro";
}

label.prepend.location:before {
    content: '\f041';
    font-family: 'FontAwesome';
}

label.prepend.percentage:before {
    content: '\f295';
    font-family: 'FontAwesome';
}

label.prepend.star:before {
    content: '\f005';
    font-family: 'FontAwesome';
}

label.prepend.wrench:before {
    content: '\f0ad';
    font-family: 'FontAwesome';
}

/********** MODAL *****************************************************************/

.overlay {
    background-color: #122148e3 !important;
    display: none;
    /*position: relative;*/
}
.overlay .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}
.modal {
    box-shadow: none;
    border-radius: 0px;
    padding: 30px;
    width: 980px;
    max-width: 100%;
    margin: 0;
}
.modal.confirm {
text-align: center;
    width: 500px;
    display: block;
    /*height: 230px;*/
    top: 50%;
    left: 50%;
    bottom: unset;
    transform: translate(-50%, -50%);
}

#cancel .modal.confirm {
    width: 700px;
    left: 50%;
    transform: translate(-50%, -50%);
}

#cancel .modal.confirm .button.cancel {
    background-color: #808080;
}

.modal.confirm h1 {
    font-size: 33px;
    line-height: 1.3;
    margin-bottom: 15px;
}
.modal.confirm .buttons {
    margin-top: 30px;
}
.modal.confirm .buttons .button,
.modal.confirm .buttons button {
    padding: 10px 20px;
    border-radius: 6px;
    margin: 0 0 0 5px;
}
.modal-body {
    padding: 35px;
}
.dropdown {
    box-shadow: unset !important;
    filter: drop-shadow(0 5px 20px rgba(0, 0, 0, 0.1));
}

.modal.view {
    text-align: center;
    width: 500px;
    display: block;
    /*height: 230px;*/
    top: 50%;
    left: 50%;
    bottom: unset;
    transform: translate(-50%, -50%);
}

#cancel .modal.view {
    width: 700px;
    left: 50%;
    transform: translate(-50%, -50%);
}

#cancel .modal.view .button.cancel {
    background-color: #808080;
}

.modal.view h1 {
    font-size: 33px;
    line-height: 1.3;
    margin-bottom: 15px;
}
.modal.view .buttons {
    margin-top: 30px;
}
.modal.view .buttons .button,
.modal.view .buttons button {
    padding: 10px 20px;
    border-radius: 6px;
    margin: 0 0 0 5px;
}

/********** MISC *****************************************************************/

.flex-fill {
    flex-grow: 1;
}

.animate-highlight {
    animation: highlight 2.5s linear;
}
@keyframes highlight {
    0% {
        background-color: #f7ecd0;
    }
    100% {
        background: transparent;
    }
}

.video-container {
    margin-bottom: 0;
}
span.help {
    color: #a5a5a5;
    font-size: 0.8em;
}
.meta {
    font-size: 15px;
    display: block;
}

.message {
    font-family: 'Lato', sans-serif;
    letter-spacing: 0.4px;
    font-size: 15px;
    line-height: 22px;
    text-align: center;
    padding: 8px;
    margin-bottom: 0px;
}

.message.danger {
    background-color: #b13c3c;
    color: #fff;
}

.message.info {
    background-color: #4ca8d6;
    color: #fff;
}

.message a {
    color: #fff;
    text-decoration: underline;
}


header a.navlink {
    display: none;
    position: absolute;
    z-index: 10;
    width: 35px;
    height: 29px;
    border-bottom: 5px solid #ffffff;
    right: 0;
    top: 2px;
}
header a.navlink:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 17px;
    width: 100%;
    border-top: 5px solid #ffffff;
    border-bottom: 5px solid #ffffff;
}

.mm-menu {
    background-color: #22315a;
}
.mm-listview>li>a,
.mm-listview>li>span {
    color: #fff;
    font-size: 18px;
    /*margin-bottom: 12px;*/
    font-weight: 500;
    letter-spacing: .8px;
    padding: 17px 10px 17px 20px;
}
.mm-next:after {
    border-color: #fff !important;
}
.mm-menu .mm-btn:after, .mm-menu .mm-btn:before,
.mm-menu .mm-navbar a, .mm-menu .mm-navbar>* {
    border-color: #fff;
    color: #fff;
}
.mm-menu .caret {
    display: none;
}

/********** HEADER *****************************************************************/

.outerwrapper header {
    position: relative;
    background-image: linear-gradient(to right top, #2872cf, #4b6fd4, #676cd6, #8066d6, #9860d4, #b75ac8, #cf56ba, #e255aa, #f26192, #f7757f, #f48a74, #ed9f72);
}

header .top {
    padding: 10px 0;
}
header .top .wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
header .top a.logo {
    display: block;
    height: 30px;
}
header .top a.logo img {
    position: relative;
    max-height: 45px;
}
header .top .other {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.dropdownList {
    /* padding: 17px; */
    background-color: #fff;
    box-shadow: 0px 2px 9px #00000012;
}
.dropdownList .section {
    /* margin-bottom: 16px; */
    padding: 14px;
    border-bottom: 1px solid #eee;
}
.dropdownList .section:last-child {
    /* margin-bottom: 0; */
    border-bottom:  none;
}
.dropdownList .section h3 {
    margin-bottom: 10px;
    font-size: 18px;
    font-weight:  500;
}
.dropdownList .section .result {
    display: block;
    margin-bottom: 6px;
    padding-bottom: 6px;
    border-bottom: 1px solid #f9f9f9;
    cursor: pointer;
}
.dropdownList .section .result span {
    font-size: 14px;
    color: #666;
    display: block;
}
.dropdownList .section .result span.title.nowrap {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.dropdownList .section .result span.title {
    color: #e95625;
}
.dropdownList .section .result span.extra {
    text-align: right;
}
.dropdownList .section .result:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}
.dropdownList .section .result span[data-label="Status"]:before {
	color: #f00;
	position: static;
	left: unset;
	top: unset;
	transform: unset;
	display: inline-block;
	margin-right: 5px;
}

header .top .other .user {
    position: relative;
    text-align: right;
    margin-left: 16px;
}
header .top .other .user .icon {
    color: #fff;
    font-size: 36px;
    background-color: #ffffff24;
    border-radius: 50%;
    /* padding: 4px; */
    display:  inline-block;
}
header .top .other .user .dropd {
    position: absolute;
    text-align: left;
    top: 100%;
    right: 0;
    display: none;
    background-color: #fff;
    z-index: 10;
    width: 180px;
    box-shadow: 0px 2px 9px #00000012;
	z-index: 9999;
}
header .top .other .user:hover .dropd {
    display: block;
}
header .top .other .user .dropd:before {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 7px 8px 7px;
    border-color: transparent transparent #ffffff transparent;
    position: absolute;
    content: '';
    top: -8px;
    right: 8px;
    content: '';
}
header .top .other .user .dropd p {
    margin-bottom: 0;
    padding: 12px 17px 0 17px;
}
header .top .other .user .dropd ul {
    padding: 5px 17px 12px 17px;
    list-style: none;
    margin: 0;
}
header .top .other .user .dropd ul li {
    margin-bottom: 4px;
}
header .top .other .user .dropd ul li a {
    display: block;
    font-size: 15px;
}

header nav {
    padding: 0;
    background-color: #d8dfeb;
}
header nav > ul {
    text-align: left;
/*    display: flex;
    align-items: center;
    justify-content: space-between;*/
}
header nav > ul li {
    display: inline-block;
    position: relative;
    /* z-index: 40; */
}
.redactor-toolbar {
    z-index:initial;
}
header nav > ul li a,
header nav > ul li a:visited {
    display: block;
    padding: 10px 30px 10px 0px;
    color: #122048;
    font-size: 13px;
}
header nav > ul li:hover > a,
header nav > ul li.active > a {
    color: #ec6a42;
}
header nav > ul li a svg {
    display: inline-block;
    margin-right: 5px;
    position: relative;
    bottom: -2px;
}
header nav > ul li .dropd {
    display: none;
    position: absolute;
    top: 100%;
    left: -26px;
    background-color: #fff;
    margin:  0;
    padding: 0;
    z-index:  20;
    min-width: 250px;
    box-shadow: 0px 2px 9px #00000012;
}
header nav > ul li:hover > .dropd {
    display: block;
}
header nav > ul li .dropd li {
    display: block;
}
header nav > ul li .dropd li a {
    padding: 5px;
    width: 100%;
    white-space: nowrap;
}

header nav > ul li .dropd li a[href="javascript:;"] {
	cursor: default;
}

header nav > ul li .dropd li a svg {
    width: 18px !important;
}

.dropd i.fas, .dropd i.far, .dropd i.fal, .dropd i.fab, .dropd i.fa {
    display: inline-block;
    width: 20px;
    margin-right: 15px;
    text-align: center;
}
/****** SECTIONS *********************************************************************/

.outerwrapper section {
    padding: 20px 0;
}

/***** LINKS *************************/

section.links {
    padding: 0;
}

/***** PAGINATION *************************/

section.paging {
    padding: 0 0 30px 0;
}
section.paging nav.pagination {
    margin-bottom: 0;
    margin-top: 10px;
}
section.paging nav.pagination ul {
    justify-content: flex-end;
    flex-wrap: wrap;
}
section.paging nav.pagination ul li {
    margin: 0 0 10px 10px;
}
section.paging nav.pagination ul li.disabled {
    opacity: .2;
    display: none;
}
section.paging nav.pagination ul li span,
section.paging nav.pagination ul li a,
section.paging nav.pagination ul li a:visited {
    border: none;
    color: #222;
    background: #f5f5f5;
    padding: 9px 13px 10px 13px;
    text-align: center;
    min-width: 33px;
    font-size:  14px;
}
section.paging nav.pagination ul li.prev a,
section.paging nav.pagination ul li.prev span,
section.paging nav.pagination ul li.next a,
section.paging nav.pagination ul li.next span {
    background: transparent;
}
section.paging nav.pagination ul li.active a,
section.paging nav.pagination ul li.active span {
    background-color: #122148;
    color: #fff;
}

/***** BOX *************************/

section .box {
    padding: 20px;
    border: 2px solid #f3f3f3;
    border-radius: 4px;
    margin-bottom: 25px;
}

/***** TITLE *************************/

section.title {
    padding: 10px 0;
	background-color: #f3f7fd;
	min-height: 55px;
}
section.title .wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
section.title h1 {
    margin-bottom: 0;
    font-size: 20px;
    height: 35px;
	line-height: 35px;
}
section.title h1 img {
    height:30px;
    margin-right:5px;
    vertical-align:text-bottom;
}
section.title .btns {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    /* width: 50%; */
}
section.title .btns .button {
    margin-left: 15px;
    padding: 11.5px 20px;
}

/***** LOGIN *************************/

section.login {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ea5526;
    background-image: linear-gradient(to right top, #2872cf, #4b6fd4, #676cd6, #8066d6, #9860d4, #b75ac8, #cf56ba, #e255aa, #f26192, #f7757f, #f48a74, #ed9f72);

}
section.login .wrapper {
    width: 500px;
}
section.login .wrapper .logo {
    display: block;
    text-align: center;
    margin-bottom: 35px;
}
section.login .wrapper .inner {
    padding: 40px;
    background-color: #fff;
    border-radius: 3px;
    box-shadow: 0px 3px 6px #0000001f;
    margin-bottom: 15px;
}

section.login .wrapper .form-item {
    margin-bottom: 26px;
}
section.login .wrapper button {
    width: 100%;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 1.4px;
    height: 50px;
}
section.login a.forgot {
    color: #fff;
}

/***** FORM *************************/

section.form .values {
    margin-bottom: 15px;
}
section.form .values:after {
    display: table;
    content: '';
    clear: both;
}
section.form .autocomplete {
    position: relative;
}
section.form .autocomplete .results {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    z-index: 35;
}
section.form .autocomplete .results .section {
    display: none;
}

/***** File Input *****/

.blank.filename:after {
    content: '(empty)';
    color: #afafaf;
}

.filename {
    border: 1px solid #d4d4d4;
    height: 38px;
    line-height: 33px;
    background-color: #f9f6f6;
    padding: 0 10px;
    color: #616161;
    cursor: default;
    pointer-events: none;
    user-select: none;
}

/***** REVISIONS *************************/

section.toggle {
    padding: 10px 0;
}
section.toggle h3 {
    margin-bottom: 0;
    position: relative;
    cursor: pointer;
    font-size: 20px;
}
section.toggle h3 i,
section.toggle h3 svg {
    position: absolute;
    top: 0;
    right: 0;
}
section.toggle h3 i.fa-minus,
section.toggle h3 svg.fa-minus {
    display: none;
}
section.toggle table,
section.toggle .content {
    display: none;
    margin-top: 15px;
}
section.toggle.open h3 i.fa-minus,
section.toggle.open h3 svg.fa-minus {
    display: block;
}
section.toggle.open h3 i.fa-plus,
section.toggle.open h3 svg.fa-plus {
    display: none;
}
section.toggle.open table {
    display: table;
}

section.toggle.open .content {
    display: block;
}

section#revisions.toggle .paging,
section#tenantRevisions.toggle .paging,
section#revisionsRates.toggle .paging,
section#activity.toggle .paging {
    display: none;
}

section#revisions.toggle.open .paging,
section#tenantRevisions.toggle.open .paging,
section#revisionsRates.toggle.open .paging,
section#activity.toggle.open .paging {
    display: block;
}

section.toggle + section.toggle:last-child {
    margin-bottom: 20px;
}

/***** DASHBOARD *************************/

section.dashboard .statistics .stat {
    overflow: hidden;
    position: relative;
}
section.dashboard .statistics .stat strong {
    display: block;
    margin-bottom: 14px;
    position: relative;
    z-index: 10;
}
section.dashboard .statistics .stat span {
    display: block;
    font-size: 38px;
    font-weight: 600;
    color: #ec6a42;
    line-height: 1;
    position: relative;
    z-index: 8;
}
section.dashboard .statistics .stat small {
    font-size: 12px;
}
section.dashboard .statistics .stat svg,
section.dashboard .statistics .stat i,
section.dashboard .statistics .stat span.far,
section.dashboard .statistics .stat span.fas,
section.dashboard .statistics .stat span.fa {
    position: absolute;
    right: -20px;
    bottom: -10px;
    font-size: 110px;
    opacity: 0.2;
    transform: rotate(-12deg);
    color: #d8dfec;
}

section.commision .buttons a {
    background-color: #d8dfeb;
    font-family: 'Lato', sans-serif;
    color: #122048;
    border-radius: 30px;
    font-size: 15px;
    padding: 5px 20px 5px 20px;
    margin-left: 10px;
}

section.commision .buttons {
    position: relative;
    top: -35px;
    display: block;
    width: 100%;
    text-align: right;
}

section.commision .buttons a:first-child > svg {
    margin-right: 5px;
    display: inline-block;
}

section.commision .buttons a:last-child > svg {
    margin-left: 5px;
    display: inline-block;
}

.highcharts-container:before {
    display: none;
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fdfdfd;
    opacity: 0;
    transition: opacity .3s linear;
}

.highcharts-container:after {
    display: none;
    content: 'Loading Data...';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #f3f7fd;
    border: 1px solid #122048;
    padding: 20px 40px;
    opacity: 0;
    transition: opacity .3s linear;
}

.highcharts-container.loading:before {
    display: block;
    opacity: .7;
}

.highcharts-container.loading:after {
    display: block;
    opacity: 1;
}

.highcharts-container.error:before {
    display: block;
    opacity: .7;
}

.highcharts-container.error:after {
    display: none;
    content: 'Error Loading Chart...';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #bb0331;
    border: 1px solid transparent;
    padding: 20px 40px;
    opacity: 0;
    transition: opacity .3s linear;
    color:white;
}

.highcharts-container.error:after {
    display: block;
    opacity: 1;
}

.graph-container > h2 {
    font-size: 1.2em;
    padding: 10px 10px 0 10px;
}

.commisionAmount > p {
    padding: 10px 20px;
    text-align: center;
    background-color: #d8dfeb;
    color: #122048;
    margin-top: 10px;
}

/********* FOOTER ******************************************************************/

.outerwrapper footer {
    border-top: 1px solid #0000001a;
    padding: 20px 0;
    font-size: 13px;
    color: #424242;
    margin-top: 10px;
}
footer .weboptic {
    text-align: right;
}

/***** Redactor *****/
body .redactor-toolbar {
    background-color: #dBdfeb;
}

body .redactor-toolbar li a:active,
body .redactor-toolbar li a.redactor-act,
body .redactor-toolbar li a {
    color: #122048;
    margin-right: 0px;
    border-right: none;
}

.form-item .redactor-toolbar a:not(.button) {
    margin-right: 0px;
}

body .redactor-toolbar li a:hover {
    background-color: #dBdfeb;
    color: #e95625;
}

body .redactor-toolbar li a:active,
body .redactor-toolbar li a.redactor-act {
    background-color: #dBdfeb;
    color: #e95625;
}

body .redactor-dropdown li {
    border-bottom: none;
    color: #122048;
}

body .redactor-dropdown li:hover {
    background-color: white;
}

body .redactor-dropdown li:hover a {
    color: #e95625 !important;
}

.re-button-tooltip {
    background-color: #122048 !important;
    font-family: sans-serif !important;
    font-size: 14px !important;
    border-radius: 0px !important;
    padding: 5px 10px !important;
    min-width: 60px;
    text-align: center;
}

.form .order-address .row:last-child .form-item {
    margin-bottom: 1.2rem;
}

#jobs .address{
    background-color: #f3f7fd;
    color: #122048;
    padding: 10px;
    margin-bottom: 30px;
}

section.filters {
	padding: 20px 0 0;
}
/*
section.filters label {
    display: inline-block;
    padding: 0px 10px;
    border-radius: 30px;
    margin-right: 3px;
    background-color: #f7f7f7;
    color: #a9a8a8;
    cursor: pointer;
}

section.filters label.enabled {
    background-color: #e95625;
    color: white;
}

section.filters label input {
    display: none;
}

section.filters label:last-child {
    margin-right: 0;
}

section.filters p {
    font-weight: bold;
    margin-bottom: 10px;
}*/

section.filters a {
  color: #fff;
}

section.filters .drop dd,
section.filters .drop dt {
  margin: 0px;
  padding: 0px;
}

section.filters .drop ul {
  margin: -1px 0 0 0;
}

section.filters .drop dd {
  position: relative;
}

section.filters .drop a,
section.filters .drop a:visited {
  color: #fff;
  text-decoration: none;
  outline: none;
  font-size: 12px;
    margin-bottom: -2px;
}

section.filters .drop dt {
    margin-bottom: -3px;
}

section.filters .drop dt a {
    background-color: #f3f7fd;
    color: #122048;
    border: 1px solid #d8dfeb;
    display: block;
    padding: 5px 20px 5px 10px;
    overflow: hidden;
}

section.filters .drop dt a span,
section.filters .multiSel span {
    cursor: pointer;
    display: block;
    font-size: 12px;
    color: #122048;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

section.filters .drop dd ul {
    background-color: #f3f7fd;
	border: 1px solid #d8dfeb;
	color: #fff;
	display: none;
	left: 0px;
	padding: 5px 20px 5px 10px;
	position: absolute;
	top: 3px;
	min-width: 100%;
	list-style: none;
	overflow: overlay;
    z-index: 99999;
    max-height: 400px;
}

section.filters .drop dd .no-max-width ul {
    width: auto;
}

.multi-select ul li label input {
    position: relative;
    top: -1px;
}

section.filters .drop span.value {
  display: none;
}

section.filters .drop dd ul li a {
  padding: 5px;
  display: block;
}

section.filters .drop dd ul li a:hover {
  background-color: #fff;
}

section.filters button {
  background-color: #6BBE92;
  width: 302px;
  border: 0;
  padding: 10px 0;
  margin: 5px 0;
  text-align: center;
  color: #fff;
  font-weight: bold;
}

section.filters .drop li label:after {
    content: attr(data-label);
    font-size: 11px;
    line-height: 1em;
    position: relative;
    top: -1px;
    color: #122048;
    left: 12px;
}

section.filters select,
section.filters input[type="text"]{
    height: 36px;
    border-color: #d8dfeb;
    background-color: #f3f7fd;
    border-radius: 0;
	padding: 5px;
    line-height: 24px;
    font-size: 12px;
}

section.filters select:focus,
section.filters input[type="text"]:focus{
    box-shadow: none;
}

section.filters .wrapper .row > .col > label {
    font-weight: bold;
    font-size: 12px;
    margin-bottom: 0px;
}

/***** CRM Notifications *****/
.crm-notification {
    background-color: #fbfbfb;
    padding: 10px;
    font-size: 0.9em;
    position: relative;
    cursor: default;
    margin-bottom: 10px;
    padding-left: 60px;
}

.crm-notification p.title {
    font-weight: bold;
    margin: 0;
    font-size: 0.95em;
}

.crm-notification p {
    margin: 0;
    font-size: 0.9em;
}

.crm-notification .actions {
    position: absolute;
    right: 10px;
    top: 30px;
    transform: translate(0, -50%);
}

.crm-notification .actions > a {
    padding: 0px 10px;
    color: #fff;
    background-color: #808080;
    border-radius: 4px;
    margin-left: 10px;
    font-size: 0.9em;
    display: inline-block;
    min-width: 40px;
    text-align: center;
}

.crm-notification.danger > p,
.crm-notification.warning > p,
.crm-notification.info > p,
.crm-notification.success > p {
    color: white;
}

.crm-notification.danger {
    background-color: #b13c3c;
}
.crm-notification.danger .actions > a {
    background-color: #af0202;
}

.crm-notification.warning {
    background-color: #d6b34c;
}
.crm-notification.warning .actions > a {
    background-color: #d2a41f;
}

.crm-notification.info {
    background-color: #4ca8d6;
}
.crm-notification.info .actions > a {
    background-color: #2297d2;
}

.crm-notification.success {
    background-color: #7dad34;
}
.crm-notification.success .actions > a {
    background-color: #699c1c;
}

.crm-notification:before {
    content: '';
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    width: 55px;
    font-family: 'FontAwesome';
    font-size: 2em;
    line-height: 2;
    /*color: white;*/
    text-align: center;
}

.crm-notification.danger:before {
    content: '\f057';
    color: #af0202;
}
.crm-notification.warning:before {
    content: '\f071';
    color: #d2a41f;
}
.crm-notification.info:before {
    content: '\f05a';
    color: #2297d2;
}
.crm-notification.success:before {
    content: '\f058';
    color: #699c1c;
}

.crm-notification a[data-action="more"] {
    margin-left: 10px;
    color: white;
    text-decoration: underline;
}

.crm-notification .more-info {
    padding-top: 10px;
    padding-bottom: 5px;
}

.crm-notification .more-info > p {
    color: white;
    max-width: 80%;
}

.crm-notification .more-info table {
    max-width: 80%;
}

.crm-notification .more-info table thead tr th, .crm-notification .more-info table tbody tr td {
    padding: 5px;
    color: white;
    font-size: 0.8em;
    border-bottom-color: rgba(255, 255, 255, 0.18);
}

.check-input {
    position: relative;
}

.check-input input[type="checkbox"] {
    position: absolute;
    top: calc(50%);
    left: 10px;
    margin: 0;
    z-index: 99;
    transform: translate(0, -50%);
}

.check-input input[type="text"] {
    padding-left: 35px;
}

input[name^="rates"][readonly] {
    background-color: #eaeaea;
    opacity: 0.3;
}

section.list table.responsive td[data-label*="Status"],
section.toggle > .wrapper.box table td[data-label*="Status"] {
    position: relative;
    padding-left: 20px;
}

.filters .col li > label[data-label] {
    position: relative;
    white-space: nowrap;
    /* overflow: hidden; */
    /* text-overflow: ellipsis; */
}

.filters .col li > label[data-label]:before,
[data-label*="Status"][data-status]:before,
.dynamic-bullet-point:before {
    content: '';
    width: 10px;
    height: 10px;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 5px;
    transform: translate(0, -50%);
    background-color: grey;
}

.dynamic-bullet-point::before {
    background-color: var(--point-color);
}

.filters .col li > label[data-label]:before {
    left: 15px;
}

#container h1 span.status {
    border-radius: 6px !important;
    margin-left: 5px;
    font-size: 14px !important;
    color: white;
    background-color: gray;
}

.filters .col li > label[data-label="Incomplete"]:before,
[data-label*="Status"].incomplete:before,
#container h1 span.status.incomplete {
    background-color: #f44336;
}

.filters .col li > label[data-label="Submitted"]:before,
[data-label*="Status"].submitted:before,
#container h1 span.status.submitted {
    background-color: #607D8B;
}

.filters .col li > label[data-label="Manual Dispatch Req\'d"]:before,
[data-label*="Status"].manual_dispatch_required:before,
#container h1 span.status.bad,
#container h1 span.status.manual_dispatch_required,
#container h1 span.status.information {
    background-color: #800000;
}

.previous-reports-container [data-label*="Status"][data-status="Completed"]:before,
.filters .col li > label[data-label="Accepted"]:before,
[data-label*="Status"].accepted:before,
#container h1 span.status.good,
#container h1 span.status.accepted {
    background-color: #8BC34A;
}

.previous-reports-container [data-label*="Status"][data-status="Failed"]:before,
.filters .col li > label[data-label="Rejected"]:before,
[data-label*="Status"].rejected:before,
#container h1 span.status.rejected {
    background-color: #FF5722;
}

.filters .col li > label[data-label="Invoiced"]:before,
[data-label*="Status"].invoiced:before,
#container h1 span.status.warn,
#container h1 span.status.invoiced {
    background-color: #ff8c29;
}

.filters .col li > label[data-label="Sent For Payment"]:before,
[data-label*="Status"].sent_for_payment:before,
#container h1 span.status.sent_for_payment {
    background-color: #20b2aa;
}

.previous-reports-container [data-label*="Status"][data-status="In Progress"]:before,
.filters .col li > label[data-label="Booked"]:before,
[data-label*="Status"].booked:before,
#container h1 span.status.booked {
    background-color: #03A9F4;
}

.filters .col li > label[data-label="Completed"]:before,
[data-label*="Status"].completed:before,
#container h1 span.status.completed {
    background-color: #673AB7;
}

.filters .col li > label[data-label="Finalised"]:before,
[data-label*="Status"][data-status="Finalised"]:before,
#container h1 span.status.finalised {
    background-color: #19827C;
}

.filters .col li > label[data-label="Open"]:before,
[data-label*="Status"][data-status="Open"]:before,
#container h1 span.status.open {
    background-color: #8BC34A;
}

.filters .col li > label[data-label="Waiting"]:before,
[data-label*="Status"][data-status="Waiting"]:before,
#container h1 span.status.waiting {
    background-color: #ff8c29;
}

.filters .col li > label[data-label="Overturned"]:before,
[data-label*="Status"][data-status="Overturned"]:before,
#container h1 span.overturned {
    background-color: #FF5722;
}

.filters .col li > label[data-label="Chargeback"]:before,
[data-label*="Status"][data-status="Chargeback"]:before,
#container h1 span.status.chargeback {
    background-color: #800000;
}

.filters .col li > label[data-label="Manual Check Req'd"]:before,
[data-label*="Status"][data-status="Manual Check Req'd"]:before {
    background-color: #800000;
}

.filters .col li > label[data-label="Resolved"]:before,
[data-label*="Status"][data-status="Resolved"]:before {
    background-color: #03A9F4;
}

.filters .col li > label[data-label="Excess Payment Req'd"]:before,
[data-label*="Status"][data-status="Excess Payment Req'd"]:before {
    background-color: #673AB7;
}

.filters .col li > label[data-label="Callout Policy Req'd"]:before,
[data-label*="Status"][data-status="Callout Policy Req'd"]:before {
    background-color: #673AB7;
}

.filters .col li > label[data-label="Unable To Contact"]:before,
[data-label*="Status"].unable_to_contact:before,
#container h1 span.status.unable_to_contact {
    background-color: #d45b66;
}

.filters .col li > label[data-label="Needs Job Sheet Confirming"]:before,
[data-label*="Status"][data-status="Needs Job Sheet Confirming"]:before,
[data-label*="Status"].needs_job_sheet_confirming:before,
#container h1 span.status.needs_job_sheet_confirming {
    background-color: #9C27B0;
}

.filters .col li > label[data-label="Job Sheet Rejected"]:before,
[data-label*="Status"][data-status="Job Sheet Rejected"]:before,
[data-label*="Status"].job_sheet_rejected:before,
#container h1 span.status.job_sheet_rejected {
    background-color: #FF5722;
}

#container h1 span.status.low-priority {
    background-color: #03A9F4;
}

#container h1 span.status.high-priority,
#container h1 span.status.urgent-priority {
    background-color: red;
}

[data-label*="Status"][data-status="Incomplete"]:before {
    background-color: #f44336;
}

[data-label*="Status"][data-status="Rejected"]:before {
    background-color: #FF5722;
}

[data-label*="Status"].empty:before {
    background-color: transparent;
}

table td[data-label="Payment Status"]:before {
    display: none;
}

#leads .filters .col li > label[data-label="Lost"]:before,
#leads table td[data-label*="Status"][data-status*="Lost"]:before {
    background-color: #FF5722;
}

#leads .filters .col li > label[data-label="Won"]:before,
#leads table td[data-label*="Status"][data-status*="Won"]:before {
    background-color: #8bc34a;
}

#leads .filters .col li > label[data-label="Open"]:before,
#leads table td[data-label*="Status"][data-status*="Open"]:before {
    background-color: #808080;
}

.ticket-notes {
    padding: 20px 20px 0 0;
}

.ticket-notes h2 {
    font-size: 1.2em;
    margin-bottom: -5px;
}

.ticket-notes .ticket-note {
    background-color: #d8dfeb;
    /* padding: 10px; */
    border-radius: 4px;
    margin-top: 20px;
}

.ticket-notes .ticket-note > p {
    color: #122048;
    font-size: 0.8em;
    padding: 10px;
    margin: 0;
}

.ticket-notes .ticket-note p:first-child {
    white-space: pre-line;
}

.ticket-notes .ticket-note > ul > li {
    color: #122048;
    font-size: 0.8em;
}

.ticket-notes .ticket-note > span {
    font-size: 0.65em;
    text-align: right;
    display: inline-block;
    width: 100%;
    color: hsla(224, 23%, 33%, 1);
    padding-right: 10px;
    background-color: #f3f7fd;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.ticket-notes .ticket-note > div {
    padding: 5px 10px;
    background-color: #f3f7fd;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.ticket-notes .ticket-note > div > span,
.ticket-notes .ticket-note > div > div {
    width: 100%;
    font-size: 0.65em;
    height: 15px;
    text-align: right;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    vertical-align: middle;
    align-items: center;
}

.ticket-notes .ticket-note > div > span > strong,
.ticket-notes .ticket-note > div > div > strong {
    float: left;
}

.ticket-notes .ticket-note.danger {
    background-color: #b13c3c;
}

.ticket-notes .ticket-note.danger > p,
.ticket-notes .ticket-note.danger > ul > li {
    color: white;
}

#tickets .note > div > div {
    width: 30%;
    margin-right: 3%;
    font-size: 11px;
    height: 14px;
    text-align: right;
    display: inline-flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    vertical-align: middle;
    align-items: center;
}

#tickets .note > div {
    padding: 5px 10px;
    background-color: #f3f7fd;
    margin: 0 -10px -3px -20px;
    border: 1px solid #d8dfeb;
    margin-top: 5px;
}

#tickets .note > div > div:nth-child(3n+3) {
    margin-right: 0;
}

#tickets .note > div > div > strong,
#tickets .note > div > div > span {
    line-height: 1;
}

#user #notes tr.note-content {
    background-color: #f9f9f9;
}

#user #notes td {
    border-bottom: 0;
}

#user #notes .note-content td {
    border-bottom: 1px solid rgb(218, 218, 218);
    font-style: italic;
    font-weight: 100;
    color: black;
}

#user #notes th, #user #notes td {
    font-size: 0.9em;
}

#invoice table,
#invoice .row {
    display: none;
}

#invoice.open table{
    display: table;
}

#invoice.open .row {
    display: flex;
}

#jobsheet h3 + .row {
    display: none;
}

#jobsheet.open h3 + .row {
    display: flex;
}

#jobsheet label {
    font-weight: bold;
    color: #122048;
    margin-bottom: 0px;
}

#jobsheet .row > .col {
    margin-top: 20px;
    color: #5b616f;
}

#jobsheet span.pass {
    color: green;
}

#jobsheet span.fail {
    color: red;
}

#searchResults h3 + p {
    font-size: 0.8em;
    color: #122048;
}

.smsWysiwyg .redactor-box li:not(:first-child) {
    float: right;
}

.smsWysiwyg span.info {
    font-size: 0.8em;
    color: rgba(18, 32, 72, 0.80);
}

.smsWysiwyg span.info:before {
    content: '\f05a';
    font-family: 'FontAwesome';
    margin: 5px;
}

#expenses td:last-child > a {
    margin-left: 10px;
}

#expenses tr.editing td {
    border-bottom: 0;
}

#expenses tr.editing, #expenses tr.editing + tr {
    background-color: #fbf8f8;
}

#ticket textarea[name="description"] {
    height: auto !important;
}

#ticket section.ticket section.form{
    padding: 0;
}

#ticket section.ticket section > .wrapper {
    width: 100%;
    max-width: inherit;
}

    /* Danger: #b13c3c */
    /* Warning: #d6b34c */
    /* Info: #4ca8d6 */
    /* Success: #7dad34 */


section.box h2 + p,
section.box p.title-info,
#dispatch-existing p.title-info {
    font-size: 0.9em;
    color: #122148;
}

section.box h2 + p:before,
section.box p.title-info:before,
#dispatch-existing p.title-info:before {
    content: '\f05a';
    font-family: 'FontAwesome';
    margin-right: 6px;
}

#ticket .row.margin,
#claim .row.margin {
    margin-bottom: 30px;
}

.add-note-container .button.small {
    font-size: 13px;
    min-height: inherit;
    padding: 6px 20px;
    border-radius: 3px;
    margin-right: 0px;
    margin-top: 10px;
}

.add-note-container .cancel-note.button.small {
    background-color: #808080;
    margin-right: 5px;
}

.hidden {
    display: none !important;
}

#users .status,
#user .status ,
#invoices .status,
.invoices > table  .status {
    background-color: #f3f7fd;
    padding: 5px 10px;
    font-size: 0.8em;
    border-radius: 3px;
    cursor: default;
    white-space: nowrap;
}

.invoices > table .status.bad {
    background-color: #b13c3c;
}

:not(.prepend).status {
    background-color: #f3f7fd;
    padding: 5px 10px;
    font-size: 0.8em;
    border-radius: 3px;
    cursor: default;
    white-space: nowrap;
}

.emblemed .small.status {
    line-height: 1;
    margin-inline-start: 1em;
}

.form-item .emblemed .small.status {
    margin: 0;
}

#users .status.good,
#user .status.good ,
#invoices .status.good {
    background-color: #7dad34;
    color: white;
}

.status.good {
    background-color: #7dad34;
    color: white;
}

#users .status.bad,
#user .status.bad ,
#invoices .status.bad {
    background-color: #b13c3c;
    color: #fff;
}

.status.bad {
    background-color: #b13c3c;
    color: #fff;
}

#invoices .status.neutral {
    background-color: #adadad;
	color: #fff;
}

#users .status.warn,
#user .status.warn ,
#invoices .status.warn,
#invoices .status.processing {
    background-color: #ffa518;
    color: #fff;
}

.status.warn {
    background-color: #ffa518;
    color: #fff;
}


#invoices .status.neutral {
    background-color: #adadad;
	color: #fff;
}


#order .new-prices {
    display: inline-block;
    height: 45px;
    font-size: 0.8em;
    position: relative;
    top: 10px;
    right: 15px;
    line-height: 18px;
    font-weight: bold;
}

/* Add Job */

._overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(18, 32, 72,.5);
    z-index: 1;
}

._overlay > ._modal,
._overlay > ._modal,
._overlay > ._modal,
._overlay > ._modal {
    position: absolute;
    max-width: 800px;
    width: 98%;
    background-color: white;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 20px;
    border-radius: 6px;
    max-height: 90vh;
    overflow: auto;
}

._overlay > ._modal h2 {
    border-bottom: 1px solid #e95625;
    display: inline-block;
    font-weight: 400;
    font-size: 20px;
	margin-bottom: 20px;
}

._overlay > ._modal .footer > div {
    margin: -20px;
    width: calc(50% + 40px);
    margin-top: 10px;
    padding: 10px 20px;
    background-color: #f3f7fd;
}

._overlay > ._modal .footer > div .button.cancel {
    background-color: #808080;
}

.align-bottom {
    display: flex;
    align-items: flex-end;
}
/* END Add Job */

/* Order Edit */
.tenant-address {
    display: none;
}

.tenant-address h3 {
    margin-bottom: 5px;
}

.tenant-address h3 + p {
    color: #122048;
    font-size: 0.85em;
}

.tenant-address > .col-12 {
    background-color: #f3f7fd;
    padding: 20px 20px 20px;
    border: 1px solid #122048;
    margin-bottom: 20px;
}

.tenant-address > .col-12 > .row > .col-4 {
    margin-bottom: 15px;
}
/* END Order Edit */

.filters .col + .col li > label[data-role="developer"]:before {
    background-color: #8c5fc7;
}

.filters .col + .col li > label[data-role="administrator"]:before {
    background-color: #79bc64;
}

.filters .col + .col li > label[data-role="supervisor"]:before {
    background-color: #da230e;
}

.filters .col + .col li > label[data-role="cms"]:before {
    background-color: #24a0e9;
}

.filters .col + .col li > label[data-role="employee"]:before {
    background-color: #e95524;
}

.filters .col + .col li > label[data-role="call-centre"]:before {
    background-color: #f576eb;
}

#customer-plans tr.cancelled td,
#invoices tr.cancelled td {
    /* text-decoration: line-through; */
}

.append span.req,
.prepend span.req {
    background: none;
    border: 0;
    display: inline;
    padding: 0;
    position: relative;
    top: 1px;
    font-weight: bold;
    color: #f03c69;
    font-size: 110%;
    left: 5px;
}

/* Accent Box */
.accent-box h3 {
    margin-bottom: 5px;
}

.accent-box h3 + p {
    color: #122048;
    font-size: 0.85em;
}

.accent-box-wrapper,
.accent-box > .col-12 {
    background-color: #f3f7fd;
    padding: 20px 20px 20px;
    border: 1px solid #122048;
    margin-top: 20px;
}

.accent-box-wrapper > .row > .col-4,
.accent-box  > .col-12 > .row > .col-4 {
    margin-bottom: 15px;
}
/* END Accent Box */

.row.gutters.margin-bottom .col{
    margin-bottom: 20px;
}

#questions .question {
    background-color: #f3f7fd;
    padding: 45px 20px 20px 20px;
    margin-bottom: 40px;
    position: relative;
}

#questions .question h2 {
    margin-bottom: 10px;
    display: inline-block;
    font-size: 1em;
    margin: 10px 20px;
}

#questions .question .answer label input[type="radio"] {
    display: none;
}

#questions .question .answer label {
    display: inline-block;
    margin: 0 10px;
    cursor: pointer;
}

#questions .question .answer label.selected {
    color: #ec6a42;
}

#questions .question .toolbar {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    background-color: #D8DFED;
}

#questions .question .toolbar a {
    color: #122048;
    height: 38px;
    width: 10px;
    display: inline-block;
    text-align: center;
    line-height: 38px;
    margin-right: 25px;
}

#questions .question .toolbar a:hover {
    color: #e95625;
}

#questions .question .answers .answer {
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    transition: all 0.2s;
    padding: 1px 0 4px 0;
}

#questions .question .answers .answer:hover {
    border-top: 1px solid #D8DFED;
    border-bottom: 1px solid #D8DFED;
}

#questions .question .answers .answer .delete-answer {
    margin-right: 5px;
}

#questions .question .add-answer,
#questions .question .add-answer-ok,
#questions .question .add-answer-cancel,
#questions .add-question {
    margin-top: 10px;
    padding: 10px 8px;
    border-radius: 6px;
}

#questions .question .add-answer-cancel {
    background-color: #f3f7fd;
    color: #122148;
    margin-right: 5px;
}

.row.add-answer-form {
    display: flex;
    background-color: #D8DFED;
    padding: 20px;
    margin-top: 30px;
    margin-bottom: -20px;
    margin-left: -20px;
    margin-right: -20px;
}

.ui-state-highlight {
    border: 1px solid #122048;
    background: #D8DFED;
    color: #777620;
    height: 31px;
}

.ui-state-highlight-question {
    border: 1px solid #122048;
    background: #D8DFED;
    color: #777620;
    height: 31px;
    margin-bottom: 40px;
}

/* MANUAL DISPATCH */

button.existing,
button.existing:focus {
    margin-right: 10px;
    background-color: #f3f7fd;
    color: #122048;
}

button.existing:hover {
    background-color: #d8dfeb;
}
.new-overlay {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0,0,0,0.3);
    display: none;
}

.new-overlay .cont {
    position: absolute;
	top: 50px;
	left: 50%;
	transform: translate(-50%, 0%);
	background-color: #fff;
	border-radius: 6px;
	min-width: 300px;
	max-width: 700px;
	width: 100%;
	padding: 20px;
	height: 600px;
}

.new-overlay .cont {
    max-width: 900px;
}

.new-overlay button,
.new-overlay button:focus {
    padding: 5px 15px;
    border-radius: 6px;
    margin-left: 10px;
}

.new-overlay h2 i {
    position: absolute;
    top: 50%;
    right: 0px;
    transform: translate(0, -50%);
    color: #122148;
    cursor: pointer;
    transition: all 0.2s linear;
    font-size: 0.6em;
    font-weight: 100;
}

.new-overlay h2 + i,
#dispatch-existing h2 + i {
    position: absolute;
    top: 20px;
    right: 20px;
    color: #122148;
    cursor: pointer;
    transition: all 0.2s linear;
    font-weight: 100;
    font-size: 2em;
}

.new-overlay h2 + i:hover,
#dispatch-existing h2 + i:hover {
    color: #6b6a6a;
}

.new-overlay .footer {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 15px;
    background-color: #f3f7fd;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    border-top: 1px solid #bfbfbf;
}

.new-overlay h2 {
    margin-bottom: 0;
    position: relative;
	font-size: 20px;
}

.new-overlay .body {
    position: absolute;
    top: 140px;
    height: calc(100% - 208px);
    left: 0;
    right: 0;
    overflow-y: auto;
    background-color: #fff;
    overscroll-behavior-y: contain;
}

#mass-assign .body {
	top: 53px;
	height: 478px;
	overflow-y: scroll;
}

.new-overlay table th {
    white-space: nowrap;
}

.new-overlay table td, .new-overlay table th {
	padding: 5px 10px;
    /* we must allow td's to wrap for the manual dispatch table */
}

.new-overlay table td label {
	margin: 0;
}

.new-overlay #existing-engineer {
    display: none;
}

.new-overlay .body .new {
    padding: 20px;
}

.new-overlay .header {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    padding: 15px;
    background-color: #f3f7fd;
    border-top-right-radius: 6px;
    border-top-left-radius: 6px;
    border-bottom: 1px solid #bfbfbf;
}

button.existing,
button.existing:focus,
button.existing + button,
button.existing + button:focus {
    border-radius: 6px;
}

#dispatch-existing .filter select {
    padding: 0 30px 0 15px;
    width: 100%;
    font-size: 14px;
    height: 40px;
}

#dispatch-existing .filter input {
    width: 100%;
    font-size: 14px;
    height: 40px;
}

#dispatch-existing .filter {
    margin-top: 10px;
    margin-bottom: 0;
}

#dispatch-existing .filter label {
    font-size: 14px;
    margin-bottom: 0;
}

.new-overlay tr.not-available {
    opacity: 0.3;
}

.new-overlay .ajax-error {
    display: none;
    position: absolute;
    top: -35px;
    left: 0;
    right: 0;
    background-color: #f00;
    color: #fff;
    text-align: left;
    padding: 5px;
}

/* END MANUAL DISPATCH */

tr.cancelled td:not(.buttons) {
    text-decoration: line-through;
}

#lead .button.green,
#claim .button.green,
#tickets .button.green {
    background-color: #4fa54f;
}

#claim .button.red,
#tickets .button.red {
    background-color: #da230e;
}

#tickets .button.green,
#tickets .button.red {
    min-width: 100px;
    text-align: center;
}

/* REPORT DATATABLES */
#report .dataTables_filter {
    display: none;
}

#report .dataTable th {
    color: #122048;
    border-bottom-color: #122048;
}

#report .dataTable td {
    color: #122048;
}

#report button.dt-button {
    border-radius: 6px;
    height: 25px;
    min-height: unset;
    line-height: 0px;
    background-color: #d8dfeb;
    color: #122048;
}

#report .paginate_button {
    border-radius: 6px;
    height: 30px;
    min-height: unset;
    line-height: 10px;
    background-color: #d8dfeb;
    color: #122048 !important;
    margin-top: 5px;
    margin-left: 5px;
}

#report .paginate_button.current, #report .paginate_button:hover {
    background: #122048 !important;
    border-color: #122048;
    color: #d8dfeb !important;
}

#report .paginate_button.disabled {
    background-color: #f2f2f2;
    color: #b5b5b5 !important;
}

#report .paginate_button.disabled:hover {
    border-color: #f2f2f2;
    background-color: #f2f2f2 !important;
    color: #b5b5b5 !important;
    cursor: not-allowed;
}

#report .dataTables_wrapper {
    margin: 25px 0 50px 0;
}

#report button.dt-button:hover {
    background-color: #122048;
    color: #d8dfeb;
}
/* END REPORT DATATABLES */

/* REPORT SELECTOR */
#report section.report-form {
    background-color: #f3f7fd;
    padding: 20px 0 25px 0;
    border-top: 1px solid #d8dfeb;
    border-bottom: 1px solid #d8dfeb;
}

#report section.report-form .report-form-inner-wrapper > .col {
    margin-top: auto;
}

#report section.report-form label {
    font-size: 12px;
    margin: 0;
}

#report section.report-form select, section.report-form input {
    height: 35px;
    line-height: 35px;
    font-size: 12px;
}

#report section.report-form button {
    background-color: #d8dfeb;
    color: #122048;
    border-radius: 6px;
    height: 35px;
    min-height: unset;
    font-size: 14px;
    padding: 0 20px;
    position: relative;
    top: -5px;
}
/* END REPORT SELECTOR */

.prepend + .append input {
    text-align: right;
}

.filter-picker {
    cursor: pointer;
    display: block;
    font-size: 12px;
    color: #122048;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#voucher select[multiple] {
    height: 208px;
}

#voucher .gen {
    text-align: right;
    margin: 10px 0 0;
    color: #e95625;
    font-size: 0.9em;
}

#voucher .sku-list .sku {
    /* text-align: center; */
    font-size: 0.8em;
    background-color: #d8dfeb;
    color: #122048;
    border-radius: 6px;
    padding: 0 10px;
    margin-bottom: 10px;
    cursor: pointer;
    position: relative;
}

#voucher .sku-list {
    margin-top: 30px;
}

#voucher .sku-list .sku:hover {
    background-color: #d5dde8;
}

#voucher .sku-list .sku:after {
    content: 'x';
    position: absolute;
    top: calc(50% - 2px);
    right: 10px;
    transform: translate(0, -50%);
    font-size: 1.2em;
}

.prepend span[rel="tooltip"] {
    display: inline-block;
    border: none;
    background: none;
    padding: 0;
    color: #333;
    position: relative;
    left: 10px;
}

/* CRM Jobs Filter By Engineer Autocomplete */
section.filters input.autocomplete,
section.filters input[name="engineer"] {
    cursor: pointer;
    display: block;
    font-size: 12px;
    color: #122048;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 5px 20px 5px 10px;
}

section.filters .results {
    display: none;
    position: absolute;
    border: 1px solid #d8dfeb;
    background-color: #f3f7fd;
    width: 150%;
    transform: translate(0,-1px);
    z-index: 100;
}

section.filters .results a p {
    color: #e95625;
    font-size: 0.8em;
    margin-bottom: 0;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow-x: hidden;
}

section.filters .results a span {
    color: #122048;
    font-size: 0.7em;
    line-height: 1.1em;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow-x: hidden;
    width: 150%;
}

section.filters .results a {
    padding: 10px 10px 6px 10px;
    display: block;
    border-bottom: 1px solid #d8dfeb;
}

/* Settings */

#settings h2 {
    border-bottom: 2px solid #f00;
    font-size: 24px;
    margin-bottom: 15px;
    padding-bottom: 5px;
    display: inline-block;
    border-bottom: 1px solid #e95625;
    font-weight: 400;
}

#settings .row + h2 {
    margin-top: 30px;
}

#settings .checkbox-setting {
    height: 50px;
    display: inline-block;
    line-height: 50px;
    font-size: 0.9em;
    color: #7b7b7b;
}

.expense_notes {
    margin-bottom: 20px;
    height: 50px;
}

/* END Settings */

/* Support Tickets */

p.ticket-title {
    font-size: 1.2em;
    margin: 20px 0;
}

#tickets .comments {
    border-top: 1px solid #122048;
    border-bottom: 1px solid #122048;
    margin-top: 40px;
    padding: 40px 0;
}

.add-comment {
    margin-top: 40px;
}

#tickets .toggle:last-child {
    margin-bottom: 40px;
}

.comment {
    padding: 10px;
    margin-top: 20px;
    background-color: #f3f7fd;
    color: #122048;
    max-width: 75%;
    position: relative;
    font-size: 0.9em;
}

.comment.tick:before {
    width: 0;
    height: 0;
    content: '';
    position: absolute;
    bottom: -30px;
}

.comment.staff {
    background-color: #122048;
    color: #fff;
    margin-left: 25%;
    /*margin-right: 20px;*/
}

.comment.staff.tick:before {
    right: 0;
    border-top: 30px solid #122048;
    border-left: 30px solid #0000;
}

.comment.user.tick:before {
    left: 0;
    border-top: 30px solid #f3f7fd;
    border-right: 30px solid #0000;
}

.comment.user + .comment.user,
.comment.staff + .comment.staff {
    margin-top: 10px;
}

.comment > span {
    display: block;
    font-size: 11px;
    text-align: right;
    margin-top: 10px;
}

#tickets .note {
    display: block;
    padding: 3px 10px 3px 20px;
    margin: 10px 50px 10px 50px;
    background-color: #d8dfeb;
    color: #122048;
    font-size: 0.9em;
}

#tickets .note > span {
    display: inline-block;
    text-align: right;
    font-size: 11px;
    float: right;
}

#tickets .show-add-note,
#tickets .add-note {
    background-color: #fff;
    color: #122048;
    border: 1px solid;
    margin-right: 10px;
}

#tickets .show-add-note:hover,
#tickets .add-note:hover {
    background-color: #122048;
    color: white;
}

#tickets .add-file {
    background-color: #fff;
    color: #e95625;
    border: 1px solid;
    margin-right: 10px;
}

#tickets .add-file:hover {
    background-color: #e95625;
    color: white;
}

#tickets .add-reply {
    background-color: #fff;
    color: #e95625;
    border: 1px solid;
}

#tickets .add-reply:hover {
    background-color: #e95625;
    color: #fff;
}

#tickets .file-upload {
    display: none;
}

#tickets .seen {
    font-size: 1.5em;
    margin-right: 5px;
    position: relative;
    top: 2px;
    color: inherit;
}

#tickets .file {
    display: block;
    padding: 3px 8px 3px 15px;
    margin: 10px 50px 10px 50px;
    color: #e95625;
    border: 2px solid #e95625;
    border-left: 5px solid #e95625;
    font-size: 1em;
}

#tickets .file:before {
    content: '\f0c6';
    font-family: 'Font Awesome 5 Pro';
    margin-right: 5px;
}

#tickets .file.staff {
    margin-left: 25%;
}

#tickets .file.user {
    margin-right: 25%;
}

#tickets .file.staff > a {
    color: #122048;
}

#tickets .file.user > a {
    color: #e95625;
}

#tickets .file > a:hover {
    text-decoration: underline;
}

#tickets .file.staff {
    color: #122048;
    border: 2px solid #122048;
    border-left: 5px solid #122048;
}

#tickets .note.tick[data-log]:before {
    content: '\f05a';
    font-family: 'Font Awesome 5 Pro';
    margin-right: 5px;
}

#tickets .note.tick[data-note]:before {
    content: '\f249';
    font-family: 'Font Awesome 5 Pro';
    margin-right: 5px;
}

#tickets .note[data-log] {
    background-color: unset;
    padding: 3px 8px 3px 15px;
    font-size: 0.9em;
    color: #122048;
    margin-bottom: 0;
    border: 2px solid #d8dfeb;
    border-left: 5px solid #d8dfeb;
}

#tickets .note[data-log] + .note[data-log] {
    margin-top: 10px;
    margin-bottom: 10px;
}

#tickets .note[data-log] > span {
    font-size: 0.8em;
}

#tickets .note[data-log] + .note[data-note] {
    margin-top: 10px;
}

#tickets .note + .comment.staff {
    margin-top: 10px;
}

#tickets .file > span {
    display: inline-block;
    float: right;
    font-size: 11px;
}

#tickets #tooltip {
    font-size: 0.8em;
}

#tickets .note + .file {
    margin-top: 10px;
}

#tickets .file + .comment.staff {
    margin-top: 10px;
}

/* END Support Tickets */

.prepend.engineer + .field > a {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.button.small,
.button.small:focus {
    font-size: 13px;
    min-height: 36px;
    padding: 6px 20px;
    border-radius: 3px;
    line-height: 20px;
}

header nav > ul li .dropd li ul.dropd {
    display: none;
    position: absolute;
    left: calc(100% - 0px);
	top: 0px;
}

header nav > ul li .dropd li:hover ul.dropd {
    display: block;
}

header nav > ul li .dropd li {
    padding: 1px 5px;
}

ul.dropd .caret {
	float: right;
	position: relative;
	top: 3px;
}

span.response-message {
    margin-right: 20px;
}

span.response-message.success {
    color: green;
}

span.response-message.error {
    color: #da230e;
}

.email-log-content td {
    display: table-cell;
    display: none;
}

.email-log-content {
    background-color: #f3f3f3;
}

.email-log-content p {
    color: #717171;;
}

tr.email-log-content td {
    border: 1px solid #dbdbdb;
    box-shadow: 0px 0.5px 4px rgba(148, 147, 147, 0.29);
}

#override .modal.confirm {
    height: 350px;
}

.manual-dispatch.error {
    background-color: #e8e8e8;
    color: grey;
    cursor: not-allowed;
}

/* KPI Dashboard */

body#kpiDashboard {
    background-color: #f3f7fd;
}

#kpiDashboard .dashboard > .wrapper > .row > .col {
    padding: 10px;
    background-color: white;
    border-radius: 2px;
    margin-bottom: 30px;
    overflow: hidden;
    box-shadow: 1px 3px 6px rgba(0,0,0,0.1);
}

#kpiDashboard .stat h2 {
    font-size: 1em;
    text-align: center;
    margin-bottom: 10px;
}

#kpiDashboard .stat .stat-value {
    color: #ec6a42;
    font-size: 2em;
    font-weight: bold;
    text-align: center;
    margin-bottom: 10px;
}

#kpiDashboard .graph-container h2 + .stat-value {
    margin-top: -10px;
    margin-bottom: 10px;
    padding: 0 10px;
    text-align: right;
    font-size: 1.1em;
}

/* END KPI Dashboard */

.manual.trigger {
    background-color: #f7ba45;
}

.trigger {
    padding: 2px 5px;
    font-size: 0.8em;
    margin-left: 10px;
    cursor: default;
    user-select: none;
}

.rejected.trigger {
    background-color: #ce0f0f;
    color: white;
}

.tabs {
    display: flex;
}

.tabs a {
    flex: 1;
    text-align: center;
    background-color: #d8dfeb;
    color: #122048;
}

.tabs a:hover,
.tabs a.current {
    text-decoration: none;
    cursor: pointer;
    background-color: #122048;
    color: white;
}

.tabs {
    margin-bottom: 40px;
}

#settings .form-item {
    margin-bottom: 20px;
}

section.title .btns .button {
    border-radius: 6px;
    font-size: 0.8em;
    padding: 10px;
    height:unset;
    min-height:unset;
}

table td .button, table td .button:visited, table td .button:focus {
    height: 35px;
    padding: 10px;
    font-size: 0.8em;
    min-height: unset;
    border-radius: 6px;
    line-height: 13px;
    margin-left: 5px;
}

.button.red {
    background-color: #da230e;
}

.button.grey {
    background-color: #b7b7b7;
}

span.badge {
    height: 10px;
    width: 10px;
    display: inline-block !important;
    margin-right: 10px;
}

#mass-assign table label {
    display: inline-block;
}

span.external-engineer, span.internal-engineer{
    display: inline-block;
    float: left;
    background-color: #4E97F5;
    color: white;
    border-radius: 3px;
    padding: 0px 7px;
    font-size: 0.8em;
    margin-right: 5px;
}

span.internal-engineer{
    background-color: #8BC34A;
}

#jobs .toggle > .box {
    margin-bottom: 0px;
}

/* Agent Workflow */

.agent-workflow table.dataTable.no-footer {
    border-bottom: 1px solid #ec6a42;
}

.agent-workflow table.dataTable thead th {
    padding: 0 30px 5px 5px;
    border-bottom: 1px solid #ec6a42;
    color: #122048;
}

.agent-workflow table.dataTable tbody td {
    padding: 0 5px;
    box-sizing: border-box;
    color: #122048;
}

.agent-workflow table.dataTable tbody tr {
    height: 35px;
}

.agent-workflow table.dataTable + .dataTables_info{
    clear: both;
    float: left;
    padding: 5px;
    font-size: 0.8em;
    color: #717171 !important;
}

.agent-workflow .dataTables_wrapper .dataTables_filter input {
    margin: 0 0 10px 0;
    height: 35px;
}

.agent-workflow table.dataTable td .button {
    padding: 2px 5px;
    margin: 3px 0;
    height: auto;
    border-radius: 3px;
}

.agent-workflow .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.agent-workflow .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
    padding: 5px 10px;
    font-size: 0.8em;
    color: #717171 !important;
}

.agent-workflow .dataTables_wrapper .dataTables_paginate .paginate_button,
.agent-workflow .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    border: 0px;
    background: unset;
    background-color: #d8dfeb;
    padding: 5px 10px;
    height: unset;
    line-height: 1;
    font-size: 0.8em;
    color: #122048 !important;
}

.agent-workflow .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.agent-workflow .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    border: 0px;
    background: unset;
    background-color: #122048;
    padding: 5px 10px;
    height: unset;
    line-height: 1;
    font-size: 0.8em;
    color: #fff !important;
}

.agent-workflow h2 {
    margin-bottom: -31px;
    display: block;
	font-size: 18px;
}

.agent-workflow:not(:first-child) {
	border-top: 1px solid #ececec;
	margin-top: 20px;
	padding-top: 40px;
}

.agent-supervised-workflow {
    margin: 0 -25px 25px;
    padding: 25px 25px;
    background-color: #f3f7fc;
}

#workflow-tickets .over {
    color: red;
}

#tickets .over {
    color: red;
}

#leads .due,
#workflow-leads .due {
    color: green;
}

#leads .overdue,
#workflow-leads .overdue {
    color: red;
}

#leads .product > span,
#workflow-leads .product > span {
    font-size: 0.8em;
    color: #8a8989;
    display: block;
    margin-bottom: -25px;
}

#leads .product > span:before,
#workflow-leads .product > span:before {
    content: '-';
    margin-left: 5px;
    margin-right: 5px;
}

#leads .product > span:last-child,
#workflow-leads .product > span:last-child {
    margin-bottom: 5px;
}

#leads .product,
#workflow-leads .product {
    padding-top: 6px;
}

/* END Agent Workflow */

.buttons .button.invoice {
    padding: 5px 10px;
    line-height: 1;
    border-radius: 6px;
    height: 30px;
    min-height: unset;
    margin-left: 10px;
}

.buttons .button.invoice.accept,
.btns .button.pli.accept {
    background-color: #4fa54f;
    color: #fff;
}

.buttons .button.invoice.reject,
.btns .button.pli.reject {
    background-color: #ce0f0f;
    color: #fff;
}

#chargebacks + .buttons .button{
    padding: 5px 10px;
    line-height: 1;
    border-radius: 6px;
    height: 30px;
    min-height: unset;
    margin-left: 10px;
    background-color: #ce0f0f;
}

#chargebacks + .buttons .button + .button {
    background-color: #4fa54f;
}

.highcharts-tooltip table th,
.highcharts-tooltip table td {
    padding: 5px;
    font-size: 0.8em;
}

#costPlansService .highcharts-tooltip th {
    padding: 5px;
    font-size: 0.8em;
}

td[data-label="Priority"].high:before {
    content: '!';
    color: red;
    font-weight: bold;
    margin-right: 3px;
}

td[data-label="Priority"].emergency:before {
    content: '!!';
    color: red;
    font-weight: bold;
    margin-right: 3px;
}

/* New Notes */

#add-note .form-item label input,
#add-note .form-item label select,
#add-note .form-item label textarea {
    margin-top: 4px;
}

#add-note textarea {
    height: 85px;
}

#add-note h2 {
    font-size: 1.4em;
    margin-bottom: 5px;
    margin-top: 15px;
}

#add-note .modal {
    width: 100%;
    max-width: 700px;
}

#add-note h1 {
    text-align: left;
}

#add-note .buttons {
    text-align: right;
    margin-top: 10px;
}

#add-note .modal {
    /* Make sure datepicker is visible outside of modal */
    overflow: initial;
}

#edit-note .form-item label input,
#edit-note .form-item label select,
#edit-note .form-item label textarea {
    margin-top: 4px;
}

#edit-note textarea {
    height: 85px;
}

#edit-note h2 {
    font-size: 1.4em;
    margin-bottom: 5px;
    margin-top: 15px;
}

#edit-note .modal {
    width: 100%;
    max-width: 700px;
}

#edit-note h1 {
    text-align: left;
}

#edit-note .buttons {
    text-align: right;
    margin-top: 10px;
}

#edit-note .modal {
    /* Make sure datepicker is visible outside of modal */
    overflow: initial;
}

/* #workflow-notes .status.bad {
    color: red;
}

#workflow-notes .status.good {
    color: green;
} */

.agent-workflow th,
.agent-workflow td {
	font-size: 12px;
}

/* END New Notes */

/* Assignables */

#add-assignable .results {
    overflow: overlay;
    max-height: 260px;
}

#add-assignable .results .dropdownList {
    width: 100%;
    box-shadow: none;
}

#add-assignable .results .dropdownList h3 {
    display: none;
}

#add-assignable .results .dropdownList a.result {
    width: 29.5%;
    display: inline-block;
    margin: 0 5px 5px 0;
    border: 1px solid #d4d4d4;
    padding: 2px 0 2px 5px;
    cursor: pointer;
}

#add-assignable .results .dropdownList a.result span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#add-assignable .results .dropdownList .result {
    margin-bottom: 0;
    padding-bottom: 0;
}

#add-assignable .results .dropdownList section {
    padding: 0;
}

#add-assignable .dropdownList .section {
    padding: 0;
    border: 0;
    box-shadow: none;
}

#add-assignable .dropdownList a.result .col.col-6:first-child {
    width: 100%;
    text-align: left;
}

#add-assignable .dropdownList a.result .col.col-6:last-child {
    display: none;
}

#add-assignable #searchResults.selected span {
    text-align: left;
    display: block;
    padding: 0 10px;
}

#add-assignable a.button.btn-ok[disabled="DISABLED"] {
    background-color: lightgrey;
    color: grey;
    cursor: not-allowed;
}

#add-assignable #searchResults.selected:before {
    content: 'Selected Item:';
    text-align: left;
    display: block;
    padding-left: 10px;
    margin-bottom: 5px;
}

/* END Assignables */

.form-item .redactor-box .redactor-layer a {
    margin-right: 0px !important;
}

#tickets .note .show-edit-note {
    font-size: 0.8em;
    padding: 8px 10px 10px;
    min-height: unset;
}

#tickets .note > div + div {
    margin-top: 0px;
    border-top:0;
    padding-bottom: 10px;
}

.ticket-notes .ticket-note > div > div.buttons {
    height: unset;
    justify-content: flex-end;
    margin: 9px 0 5px;
}

.ticket-notes .ticket-note > div > div.buttons .show-edit-note {
    font-size: 12px;
    padding: 4px 10px 4px;
    min-height: unset;
}

table td .button.mark-as-paid {
    background-color: #7dad34;
}

#invoices .status.gc-paid,
.invoices > table .status.gc-paid {
    background-color: #7dad34;
    color: #fff;
}

#invoices .status.gc-error,
#invoices .status.gc-failed,
#invoices .status.gc-chargeback,
#invoices .status.gc-unpaid,
#invoices .status.gc-max-retries,
#invoices .status.gc-debt-recovery,
#invoices .status.gc-manually-cancelled,
.invoices > table .status.gc-error,
.invoices > table .status.gc-failed,
.invoices > table .status.gc-unpaid,
.invoices > table .status.gc-max-retries,
.invoices > table .status.gc-debt-recovery,
.invoices > table .status.gc-chargeback,
.invoices > table .status.gc-manually-cancelled {
    background-color: #b13c3c;
    color: #fff;
}

#invoices .status.gc-submitted,
#invoices .status.gc-attempting,
.invoices > table .status.gc-submitted,
.invoices > table .status.gc-attempting {
    background-color: #ffa518;
    color: #fff;
}

#invoices .status.gc-complete,
.invoices > table  .status.gc-complete {
    background-color: #7dad34;
    color: #fff;
}

#invoices span.status + span,
.invoices > table span.status + span {
    float: right;
}

#order form.form .row .form-item {
	overflow: hidden;
	text-overflow: ellipsis;
	display: block;
	white-space: nowrap;
}

/* Payouts */

#payouts .info {
	background-color: #f3f7fd;
	border-left: 1px solid #dbdee4;
	border-right: 1px solid #dbdee4;
	border-bottom: 1px solid #dbdee4;
}

#payouts .info > td {
    display: none;
}

#payouts .active td {
	background-color: #d8dfeb;
}

#payouts .active {
	border-right: 1px solid #dbdee4;
}

#payouts .active + .info td {
	display: table-cell;
}

#payouts .info th, #payouts .info td {
	padding: 5px 20px;
}

#payouts .info > td {
	padding: 0;
}

#payouts .info > td > table {
	margin-bottom: 0;
}

#payouts .info .bank-details {
	padding: 20px 0;
	text-align: center;
	border-bottom: 1px solid #e7eaf0;
	font-size: 1em;
	color: #122048;
}

#payouts .info .bank-details h3 {
	font-size: 1em;
	margin-bottom: 5px;
	font-weight: bold;
}

#payout-items.new-overlay .body {
	top: 54px;
	height: calc(100% - 121px);
}

#payout-items.new-overlay h2 + i {
    position: absolute;
	top: 13px;
	right: 20px;
	color: #122148;
	cursor: pointer;
	transition: all 0.2s linear;
	font-weight: 100;
	font-size: 1.5em;
}

.payout-disabled {
	color: grey;
	background-color: lightgrey;
	cursor: not-allowed;
}

.payout-disabled:hover {
	color: #808080;
	background-color: #d3d3d3;
}

/* END Payouts */

.invoice-filters .bootstrap-datetimepicker-widget td.day.active {
	background-color: #f3f7fd;
	color: #122048;
}

table#invoices td[data-label*="Status"]:before {
    content: unset;
}

/* Menu Buttons */

.button.button-dropdown > span {
    text-align: center;
    font-size: 18px;
    line-height: 34px;
    top: 0;
    bottom: 0;
    right: 0;
    display: inline-block;
    position: absolute;
    width: 30px;
    background-color: #d8dfeb;
    border-left: 1px solid #122048;
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
    transition: all 0.2s linear;
}

.button.button-dropdown {
	position: relative;
	padding: 0 40px 0 0 !important;
	list-style-type: none;
	height: 35px !important;
    margin-bottom: 0;
    border: 1px solid;
    transition: all 0.2s linear;
    text-align: left;
}

.button.button-dropdown:hover > span {
	background-color: #122048;
	color: #d8dfeb;
}

.button.button-dropdown:hover,
.button.button-dropdown:hover > li > .button {
	background-color: #333f62;
    color: #fff;
    border-bottom-left-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
}

.button.button-dropdown > li > a.button {
    margin: 0;
    border: 0;
    text-align: left;
}

.button.button-dropdown .dropdown-buttons {
    display: none;
}

.button.button-dropdown:hover .dropdown-buttons {
    display: block;
	min-width: 100%;
	z-index: 9000;
	text-align: left;
}

table td .button-dropdown .button,
table td .button-dropdown .button:visited,
table td .button-dropdown .button:focus {
    height: 33px;
    min-width: unset;
    text-align: left;
}

.button-dropdown .dropdown-buttons {
	list-style-type: none;
	position: absolute;
	margin: 0;
	padding-top: 0;
	right: 0;
    border: 1px solid #122048;
    border-bottom-right-radius: 6px;
	border-bottom-left-radius: 6px;
}

.button-dropdown .dropdown-buttons > li a.button {
	width: 100%;
	border-radius: 0;
    margin: 0;
    text-align: left;
}

.button-dropdown .dropdown-buttons > li:last-child a.button {
    border-bottom: 0;
    border-bottom-right-radius: 6px;
	border-bottom-left-radius: 6px;
}

.button-dropdown .dropdown-buttons > li a.button:hover {
	filter: brightness(0.9);
}

/* END Menu Buttons */

div#card-element {
	border: 1px solid #eaeaea;
	padding: 0 20px;
}

.manual-details + div {
	margin: 0 0 20px 0;
}

section.toggle .box table th,
section.toggle .box table td {
    color: #424242;
	font-size: 13px;
	vertical-align: middle;
	padding: 5px;
}

section.toggle .box table th {
	color: #909090;
	padding-bottom: 10px;
}

section label {
    color: #424242;
	font-size: 13px;
}

input, textarea, select {
    font-size: 13px;
}

a.button.cancel {
    background-color: #808080;
}

textarea[readonly] {
    background-color: #d8dfeb;
    border-color: #d8dfeb;
    cursor: not-allowed;
}

input[readonly]:not(.datepicker):not(.handledInFile),
select.readonly {
	background-color: #d8dfeb;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
    border-color: #d8dfeb;
    cursor: not-allowed;
}

label.prepend + input[readonly]:not(.datepicker):not(.handledInFile),
label.prepend + select.readonly {
    margin-left: 40px;
    padding-left: 10px !important;
    width: calc(100% - 40px) !important;
}

input[readonly]:not(.datepicker):not(.handledInFile):focus,
select.readonly:focus {
	box-shadow: none;
	border-color: #d8dfeb;
}

select.readonly {
    color: #000;
	font-style: normal;
	opacity: 1;
}

section.toggle > .wrapper.box {
    width: 100%;
    max-width: unset;
}

._overlay > ._modal > .body .invoices {
	max-height: 400px;
	overflow-y: scroll;
}

span.invoice-amount {
	display: inline-block;
	margin-right: 10px;
	font-weight: bold;
}

span.invoice-amount:before {
    content: 'Amount to be charged:';
    margin-right: 10px;
    font-weight: normal;
}

._overlay > ._modal > .body .invoices th,
._overlay > ._modal > .body .invoices td {
	font-size: 13px;
	color: #424242;
	padding: 5px 0;
}

._overlay > ._modal > .body .invoices th {
	color: #909090;
	padding-bottom: 10px;
}

._overlay > ._modal > .body .invoices td > span[rel="tooltip"] {
	float: none;
	margin-left: 20px;
}

#invoiceRetryPayment .quote {
	border-left: 5px solid #122048;
	background-color: #d8dfeb;
	padding: 5px 5px 5px 20px;
}

#invoiceRetryPayment p {
	font-size: 13px;
	color: #424242;
}

.bootstrap-datetimepicker-widget td.active {
	background-color: #f3f7fd;
	color: #122048;
}

.bootstrap-datetimepicker-widget td {
	padding: 12px;
	text-align: center;
	font-size: 13px;
	color: #404040;
}

.bootstrap-datetimepicker-widget table th.dow {
	padding: 12px;
	font-size: 13px;
}

.bootstrap-datetimepicker-widget table thead tr:first-child th {
	padding: 10px;
}

.button.developer {
    background-color: #9062ff;
	color: #fff;
}

section.list table.responsive td,section.list table.responsive th {
	font-size: 12px;
	padding: 5px 10px;
}

section.list table.responsive td .button {
	/* height: 10px; */
	padding: 5px 10px;
	height: unset;
	border-radius: 4px;
	min-width: 50px;
}

section.list table.responsive tfoot td {
	padding: 15px 10px;
	border: 0;
	color: #000;
	font-size: 13px;
	font-weight: 100;
}

header nav > ul li .dropd li:hover {
	background-color: #d8dfeb;
}

header nav > ul li .dropd li {
	transition: all 0.1s linear;
}

section.list table.responsive td .button.fixed-116 {
    min-width: 116px;
}

span.pending-pli {
    position: absolute;
	font-size: 0.7em;
	color: #ffa500;
	display: inline-block;
	margin-left: 10px;
	line-height: 29px;
}

.pending-pli label.prepend:before {
	background-color: #ffe5c2;
	border: 1px solid #ffa500;
	border-right: none;
	color: #ffa500;
}

.pending-pli input:not([type="file"]) {
	background-color: #ffa5004d;
	border-color: #ffa500;
}

.pending-pli input:not([type="file"]):focus {
	box-shadow: none;
}

.pending-pli label {
	color: orange;
}

.pending-pli label i {
    color: #424242;
}

.button.lightblue.view-certificate {
	margin-top: 15px;
	font-size: .8em;
}

.button.lightblue.view-certificate[disabled] {
	background-color: #d3d3d3;
	color: #808080;
	cursor: not-allowed;
}

/* Notifications */

ul.notifications {
	list-style-type: none;
	margin: 0;
	padding: 0;
	position: relative;
	margin-right: 10px;
}

ul.notifications > li {
	color: #fff;
	height: 36px;
	line-height: 36px;
	padding: 0 15px;
	border-radius: 6px;
	transition: background-color .2s linear;
}

ul.notifications > li:hover {
    background-color: #333f62;
}

ul.notifications.new > li,
ul.notifications.new > li:hover {
	background-color: #e95625;
}

ul.notifications.new > li > i {
	rotate: 30deg;
}

/* ul.notifications > li:hover {
	background-color: #333f62;
} */

ul.notifications > li > i {
	cursor: pointer;
}

ul.notifications > li > .dropdown {
	position: absolute;
	display: none;
	top: 28px;
	left: 0;
	right: unset;
	transform: translate(-47.5%, 0);
	min-width: 500px;
	background-color: #0000;
    padding-top: 20px;
    max-height: unset;
}

ul.notifications > li:hover > .dropdown {
	display: inline-block;
}

ul.notifications > li > .dropdown:before {
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid #fff;
	border-top-color: inherit;
	content: '';
	position: absolute;
	left: 50%;
	top: 20px;
	padding-top: 0px;
}

ul.notifications > li > .dropdown > li {
	background-color: white;
	margin-top: 10px;
}

ul.notifications > li > .dropdown > li > ul > li {
	font-size: 0.8em;
	color: #122048;
	padding: 3px 37px 3px 15px;
	line-height: 30px;
	position: relative;
}

ul.notifications > li > .dropdown > li > ul > li .buttons .button {
	height: unset;
	padding: 2px 5px;
	min-height: unset;
	min-width: unset;
	display: inline-block;
	font-size: 12px;
}

ul.notifications > li > .dropdown > li > ul > li .buttons .button:hover {
	background-color: #d85023;
}

ul.notifications > li > .dropdown > li > ul > li .buttons {
	text-align: right;
}

ul.notifications > li > .dropdown > li > ul > li .row {
	align-items: center;
	justify-content: space-between;
}

ul.notifications > li > .dropdown > li > ul > li .col {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

ul.notifications > li > .dropdown > li > ul > li .col .status {
	padding: 5px;
}

ul.notifications > li > .dropdown > li > ul > li .col:not(.buttons) a {
	padding: 0;
	color: #ec6a42;
}
ul.notifications > li > .dropdown > li > ul > li .col:not(.buttons) a:hover {
	background: none;
}

ul.notifications > li > .dropdown > li > ul > li.new {
	background: #ebf0f9;
}

ul.notifications .mark {
	display: inline-block;
	width: 10px;
	height: 10px;
	border: 1px solid #122048;
	border-radius: 50%;
	padding: 0 !important;
	position: absolute;
	top: 50%;
	right: 15px;
	transform: translate(0,-50%);
    background: transparent;
}

ul.notifications .mark.read {
    border: 1px solid #122048;
    background-color: #122048;
}

ul.agent-notifications {
	list-style-type: none;
	margin: 0;
    padding: 0;
    overflow-y: auto;
    max-height: 500px;
}

ul.notifications ul.agent-notifications a.action {
	float: right;
	padding: 0 5px!important;
	display: inline-block;
}

ul.notifications ul.agent-notifications a.action:hover {
	background: none !important;
}

ul.notifications time {
	float: right;
	font-weight: bold;
	color: #a5aaba;
	font-size: 0.8em;
	margin-right: 10px;
}

ul.notifications .bar {
    background-color: #f3f7fd;
    text-align: right;
    padding: 0 25px;
    height: 30px;
    line-height: 30px;
    font-size: 0.9em;
}

ul.notifications .bar.bar .clear {
    color: #122048;
}

ul.notifications .action.done {
    opacity: 0.2;
}

/* END Notifications */

table#customer-plans td,
table#customer-plans th {
	font-size: 12px;
	padding: 5px;
}

/* TOGGLE DATATABLES */
section.toggle .content > .dataTables_wrapper table.dataTable thead th,
section.toggle .content > .dataTables_wrapper table.dataTable thead td {
    border-bottom: inherit;
}

section.toggle .content > .dataTables_wrapper table.dataTable.no-footer {
    border-bottom: inherit;
}

section.toggle .content > .dataTables_wrapper .dataTables_filter input {
    position: absolute;
    top: -44px;
    left: unset;
    right: 40px;
    width: 200px;
    height: 30px;
    line-height: 30px;
    border: 1px solid #122148;
    padding: 0 5px;
}

section.toggle .content > .dataTables_wrapper .dataTables_length,
section.toggle .content > .dataTables_wrapper .dataTables_filter,
section.toggle .content > .dataTables_wrapper .dataTables_info,
section.toggle .content > .dataTables_wrapper .dataTables_processing,
section.toggle .content > .dataTables_wrapper .dataTables_paginate {
    color: #333;
    font-size: 12px;
    padding-top: 20px;
}

section.toggle .content > .dataTables_wrapper .dataTables_paginate a {
    border: 0px;
    background: unset;
    background-color: #ffffff;
    padding: 6px 10px;
    font-size: 12px !important;
    height: unset;
    line-height: 1;
    font-size: 0.8em;
    border: 1px solid #122148 !important;
    margin-right: 5px;
}

section.toggle .content > .dataTables_wrapper .dataTables_paginate a:not(.disabled):hover {
    background-color: #122148 !important;
    color: white !important;
}

section.toggle .content > .dataTables_wrapper .dataTables_paginate a.disabled {
    opacity: 0.3;
}

section.toggle .content > .dataTables_wrapper .dataTables_paginate a.current,
section.toggle .content > .dataTables_wrapper .dataTables_paginate a.current:hover {
    background: none;
    background-color: #122148 !important;
    color: #fff !important;
}

section.toggle .content > .dataTables_wrapper .dataTable .button-dropdown .dropdown-buttons > li a.button {
	width: calc(100% - 22px);
}

section.toggle .content > .dataTables_wrapper table td .button-dropdown .button,
section.toggle .content > .dataTables_wrapper table td .button-dropdown .button:visited,
section.toggle .content > .dataTables_wrapper table td .button-dropdown .button:focus {
    height: inherit;
}

section.toggle .content > .dataTables_wrapper table td .button,
section.toggle .content > .dataTables_wrapper table td .button:visited,
section.toggle .content > .dataTables_wrapper table td .button:focus {
    height: inherit;
	padding: 7px 10px;
}

section.toggle .content > .dataTables_wrapper .button-dropdown {
    height: 27px !important;
}

section.toggle .content > .dataTables_wrapper .button-dropdown span > i{
    top: -4px;
}
/* END TOGGLE DATATABLES */

/* GC Invoice Status */
ul.records {
    margin: 0;
    list-style-type: none;
}

ul.records li {
    position: relative;
    padding: 0 0 33px;
}

ul.records li:before {
    border-right: 1px solid #d5d6da;
    content: " ";
    display: block;
    height: 100%;
    left: 114px;
    position: absolute;
    top: 0;
}

ul.records li:last-of-type {
    margin-bottom: 18px;
    padding-bottom: 0;
}

ul.records li:last-of-type:before {
    height: 0;
}

ul.records li .date {
    position: absolute;
    text-align: right;
    top: 1px;
    width: 65px;
    font-size: 14px;
}

ul.records li .icon {
    position: absolute;
    left: 95px;
    margin: 0 6px;
    -ms-flex-align: center;
    -ms-flex-pack: center;
    align-items: center;
    background: #d5d6da;
    color: white;
    border: 3px solid #fff;
    border-radius: 50%;
    display: -ms-flexbox;
    display: flex;
    height: 28px;
    justify-content: center;
    width: 28px;
}

ul.records li .icon.pending {
    background: #ffcc00;
}

ul.records li .icon.success {
    background: #40bd9e;
}

ul.records li .icon.failure {
    background: #c83b3b;
}

ul.records li .info {
    margin-left: 140px;
    position: relative;
    font-size: 14px;
}

ul.records li .info p {
    font-size: 14px;
}
/* END GC Invoice Status */

.emblemed {
    align-items:center;
    display:flex;
}

.emblemed img {
    height:13px !important;
    margin-right:3px;
}

#pause-modal.on-hold .temporary-unavailable-only {
    display: none;
}

#pause-modal.temporary-unavailable .on-hold-only {
    display: none;
}

:not(.button).request-override {
    font-size: 0.8em;
    line-height: 1;
    float: right;
}

#supervisor_override {
    z-index: 10;
}

.form-item.show-staggered input[type="file"] {
    height: 40px;
    width: 100%;
    border: 1px solid #d4d4d4;
}

.form-item.show-staggered input[type="file"].error {
    background-color: rgba(240, 60, 105, 0.1);
    border: 1px solid #f583a0;
}