@charset "UTF-8";
/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.m-brand__logo h4 {
  font-size: 1.5rem;
  color: #ffffff;
  text-decoration: none;
  letter-spacing: 3px;
}

@media (min-width: 992px) {
  .m-brand {
    width: 225px;
  }
}
.m-brand.m-brand--skin-dark {
  background-color: #3B3B53;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.popover-header {
  display: none;
}

.popover {
  font-size: 14px !important;
  font-weight: 600;
  width: 250px;
  text-align: center;
  padding-bottom: 12px;
  -webkit-filter: blur(0.000001px) !important;
}
.popover .title {
  margin-bottom: 0px;
}
.popover .times {
  margin-bottom: 6px;
}

.event-types button {
  color: white;
  border-radius: 10px;
}

.fixed-name {
  font-size: 12px;
  background-color: #F5F6FA;
  padding: 0.75rem;
  border: 1px solid #d6d6db;
  vertical-align: top;
  position: fixed;
}

.user-group-text {
  position: relative;
}

.duration {
  font-weight: 200;
}

.fixed-header th {
  text-align: center;
  padding-left: 0.1%;
  font-size: 14px;
  vertical-align: bottom;
  font-weight: 500;
  padding: 0.75rem;
  display: table-cell;
}

.calendar-modal button.active {
  border-style: solid;
  border-width: 2px;
  border-color: black;
  background-color: white;
  color: black;
}
.calendar-modal .form-control:focus {
  background-color: inherit;
}

.calendar-table .days-header th {
  text-align: center;
  width: 12.5%;
  padding-left: 0.1%;
}
.calendar-table thead tr {
  background-color: #F5F6FA;
  border: 1px solid #d6d6db;
}
.calendar-table thead th {
  font-size: 14px;
  border-bottom: 1px solid #d6d6db;
  border-top: 1px solid #d6d6db;
}
.calendar-table tbody {
  max-height: 100px;
  overflow-y: scroll;
}
.calendar-table tbody tr td {
  border: 1px solid #d6d6db;
  padding: 0px;
}
.calendar-table tbody tr td:nth-child(1) {
  background-color: #F5F6FA;
  font-size: 12px;
  padding: 0.75rem;
}
.calendar-table tbody tr th {
  background-color: #F5F6FA;
  border: 1px solid #d6d6db;
  font-size: 14px;
}

.rota-calendar-table .days-header th {
  padding-left: 15px;
  padding-right: 15px;
  font-size: 12px;
}
.rota-calendar-table td.selected {
  background-color: #DFF2FD;
}

.rota-fixed-header.fixed-header-month th {
  padding-left: 15px;
  padding-right: 15px;
  font-size: 12px;
}

.calendar-table-month .days-header th {
  min-width: 120px !important;
  width: 120px !important;
}

.cal-row td:first-child {
  white-space: nowrap;
}

.bar {
  display: block;
  height: 15px;
  position: absolute;
}

.line {
  font-size: 0px;
  margin: 3px 0px;
  height: 15px;
  cursor: pointer;
  position: relative;
}
.bg-worked-hours {
  background-color: #96CF1D;
}

.bg-holiday {
  background-color: #FBDE00;
}

.bg-diary {
  background-color: #AD498C;
}

.bg-unpaid-leave {
  background-color: #42291D;
}

.bg-eta {
  background-color: #8A5D19;
}

.bg-offsite {
  background-color: #004930;
}

.bg-late {
  background-color: #151616 !important;
}

.bg-lunch {
  background-color: #008C56;
}

.bg-sick {
  background-color: #E53918;
}

.bg-medical {
  background-color: #004ABA;
}

.bg-rota {
  background-color: #00A3D4;
}

.bg-transparent {
  background-color: white !important;
}

.bg-nwd {
  background-color: #8A5D19;
}

.rota-users-table td {
  border-left: none;
  border-right: none;
}

.rota-page .dataTables_wrapper {
  width: 100%;
}

.color-patch {
  padding: 10px;
  display: inline-block;
}

.status-title {
  display: inline-block;
  position: relative;
  bottom: 3px;
  margin-left: 5px;
  font-weight: 600;
}

.status-subtitle {
  margin-left: 30px;
  font-size: 10px;
  position: relative;
  bottom: 10px;
}

.m-content.call-board .calls:empty {
  display: none;
}
.m-content.call-board .call[direction=inbound][ringing=true] {
  background-color: #b7fdbb;
}
.m-content.call-board .call[direction=inbound][ringing=false] {
  background-color: #04ff12;
}
.m-content.call-board .call[direction=outbound][ringing=true] {
  background-color: #f9ff9f;
}
.m-content.call-board .call[direction=outbound][ringing=false] {
  background-color: #f2ff42;
}
.m-content.call-board .call[direction=internal][ringing=true] {
  background-color: #75d0f2;
}
.m-content.call-board .call[direction=internal][ringing=false] {
  background-color: #00acec;
}
.m-content.call-board .call[ringing=false] span.ringing {
  display: none;
}

.call-log audio {
  width: 100%;
}

.datatable.calls:not(.quote-calls) tbody tr {
  cursor: pointer;
}

.datatable.quote-calls i.fa-headphones {
  cursor: pointer;
}

.moo-aside-titles i.chat-notification {
  margin-top: 5px;
  display: none;
}
@keyframes unread {
  from {
    color: rgb(103, 207, 255);
  }
  to {
    color: white;
  }
}
.moo-aside-titles i.chat-notification[read=unread] {
  display: block;
  animation-name: unread;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-timing-function: linear;
}

.chat-toggle {
  position: fixed;
  bottom: 10;
  right: 10;
}
.chat-toggle i {
  text-align: center;
  width: 56px;
  cursor: pointer;
  background-color: rgb(0, 162, 255);
  border-radius: 50px;
  font-size: 30px;
  padding: 10px;
  color: white;
}
.chat-toggle i:hover {
  background-color: rgb(0, 134, 211);
}
@keyframes unread {
  from {
    border-color: rgb(255, 255, 255);
  }
  to {
    border-color: rgba(255, 255, 255, 0.5);
  }
}
.chat-toggle[read=unread] i {
  border: 3px solid;
  animation-name: unread;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-timing-function: linear;
}

.chat {
  position: fixed;
  bottom: 64;
  right: 0;
  margin: 10 10;
  border: 1px solid #b2b2b2;
  border-radius: 5px;
  padding: 0;
  width: 280px;
  background-color: white;
}
.chat .remove-attachment {
  color: red;
  position: relative;
  top: 2px;
  margin-right: 5px;
  cursor: pointer;
}
.chat .attach-file {
  cursor: pointer;
  float: right;
  margin: 8;
}
.chat .bottom .attachments {
  margin: 0 10px;
  clear: both;
}
.chat .bottom .attachments .attachment {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.chat .bottom .attachments .attachment:first-child {
  margin-top: 5px;
}
.chat .bottom .attachments input {
  display: none;
}
.chat textarea {
  border: none;
  overflow: auto;
  outline: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  resize: none;
  width: 80%;
}
.chat .broadcast-pane .checkboxes {
  padding: 7px 10px 13px 10px;
}
.chat .broadcast-pane .contacts {
  padding: 20px;
  height: 300px;
  overflow-y: auto;
}
.chat .broadcast-pane .contacts label {
  display: block;
}
.chat .broadcast-pane .bottom {
  background: white;
  border-top: 1px #ccc solid;
  width: 100%;
  padding: 10px;
}
.chat .broadcast-pane .title {
  padding: 12px;
  border-bottom: 1px #ccc solid;
}
.chat .broadcast-pane .title span {
  font-size: 15px;
  font-weight: bolder;
  float: left;
}
.chat .broadcast-pane .title i {
  margin: 3px 5px;
  font-size: 18px;
  float: right;
}
.chat .home .search {
  border-bottom: 1px #ccc solid;
  width: 100%;
  padding: 12;
}
.chat .home .search i.close {
  margin: 5 5 0 0;
}
.chat .home .bottom {
  min-height: 50px;
  padding-top: 14px;
  text-align: center;
  font-weight: bolder;
  background-color: #ececec;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}
.chat .home .bottom:hover {
  background-color: #dcdcdc;
  cursor: pointer;
}
.chat .home .contacts {
  overflow-y: auto;
  height: 304px;
}
.chat .home .contacts .contact {
  cursor: pointer;
  padding: 10px;
  border-bottom: 1px #ececec solid;
}
.chat .home .contacts .contact.clocked-in {
  background-color: #dff2ff;
}
.chat .home .contacts .contact.clocked-in:hover {
  background-color: #cae8fd;
}
.chat .home .contacts .contact:hover {
  background-color: #f3f3f3;
}
.chat .contacts .name {
  font-weight: bold;
}
.chat .contacts .information {
  float: left;
  padding-left: 12px;
  width: 85%;
}
.chat .contacts .profile {
  float: left;
  width: 15%;
}
.chat .contacts .message {
  float: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 100%;
}
.chat .contacts .timeago {
  float: right;
}
.chat .contacts .contact .profile img {
  height: 40px;
  width: 40px;
  border-radius: 40px;
  object-fit: cover;
}
.chat .contacts .contact[read=read] .profile img {
  border: none;
}
.chat .contacts .contact[read=unread] .profile img {
  border: 4px solid #0090ff;
}
.chat .room .contact {
  padding: 12px;
  border-bottom: 1px #ccc solid;
}
.chat .room .contact span.name {
  font-size: 15px;
  font-weight: bolder;
  float: left;
}
.chat .room .contact i {
  margin: 3px 5px;
  font-size: 18px;
  float: right;
}
.chat .room .messages {
  height: 300px;
  overflow-y: auto;
}
.chat .room .messages hr {
  clear: both;
  margin: 0;
  border: none;
}
.chat .room .message {
  cursor: pointer;
}
.chat .room .message .content {
  margin: 6px;
  border-radius: 10px;
}
.chat .room .message .content.no-text .text {
  display: none;
}
.chat .room .message .content.no-text .attachments {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.chat .room .message .content .text {
  padding: 6px 10px;
  word-break: break-all;
}
.chat .room .message .content.no-attachments .attachments {
  display: none;
}
.chat .room .message .content .attachments {
  padding: 6px 10px;
}
.chat .room .message .timestamp {
  display: none;
  clear: both;
  margin: 0 6px;
  font-size: 12px;
  color: #aaa;
}
.chat .room .message:last-of-type .timestamp {
  display: block;
}
.chat .room .message.me .content {
  float: right;
  max-width: 80%;
  border-bottom-right-radius: 0px;
  color: white;
  background-color: #36a3f7;
}
.chat .room .message.me .content .attachments {
  border-bottom-left-radius: 10px;
}
.chat .room .message.me .content a {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  color: white;
  text-decoration: underline;
  font-weight: bold;
}
.chat .room .message.me.broadcast .content {
  background-color: #f73636;
}
.chat .room .message.me .timestamp {
  float: right;
}
.chat .room .message.you .content {
  float: left;
  max-width: 80%;
  border-bottom-left-radius: 0px;
  color: black;
  background-color: #ececec;
}
.chat .room .message.you .content .attachments {
  border-bottom-right-radius: 10px;
}
.chat .room .message.you .content a {
  color: black;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: underline;
  font-weight: bold;
}
.chat .room .message.you.broadcast .content {
  background-color: #ffc1c1;
}
.chat .room .message.you .timestamp {
  float: left;
}
.chat .room .bottom {
  min-height: 50px;
  background: white;
  border-top: 1px #ccc solid;
  width: 100%;
  padding: 10px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}

#croppic {
  width: 400px; /* MANDATORY */
  height: 208px; /* MANDATORY */
  position: relative; /* MANDATORY */
  margin: 50px 70px 20px;
  border: 3px solid #FFF;
  box-sizing: content-box;
  -moz-box-sizing: content-box;
  border-radius: 2px;
  background-image: url(/static/src/media/mooloo/placeholder.png);
  background-repeat: no-repeat;
  background-position: center;
  box-shadow: 8px 8px 0px rgba(0, 0, 0, 0.1);
}

/* DO NOT CHANGE FROM HERE ( unless u know what u are doing) */
.cropImgWrapper {
  cursor: -webkit-grab;
  cursor: grab;
}

.cropImgWrapper:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

.cropImgUpload {
  z-index: 2;
  position: absolute;
  height: 28px;
  display: block;
  top: -30px;
  right: -2px;
  font-family: sans-serif;
  width: 20px;
  height: 20px;
  text-align: center;
  line-height: 20px;
  color: #FFF;
}

.cropControls {
  z-index: 2;
  position: absolute;
  height: 30px;
  display: block;
  /* top: -31px; */
  top: -1px;
  right: -1px;
  font-family: sans-serif;
  background-color: rgba(0, 0, 0, 0.35);
}

.cropControls i {
  display: block;
  float: left;
  margin: 0;
  cursor: pointer;
  background-image: url("/static/src/media/mooloo/cropperIcons.png");
  width: 30px;
  height: 30px;
  text-align: center;
  line-height: 20px;
  color: #FFF;
  font-size: 13px;
  font-weight: bold;
  font-style: normal;
}

.cropControls i:hover {
  background-color: rgba(0, 0, 0, 0.7);
}

.cropControls i.cropControlZoomMuchIn {
  background-position: 0px 0px;
}

.cropControls i.cropControlZoomIn {
  background-position: -30px 0px;
}

.cropControls i.cropControlZoomOut {
  background-position: -60px 0px;
}

.cropControls i.cropControlZoomMuchOut {
  background-position: -90px 0px;
}

.cropControls i.cropControlRotateLeft {
  background-position: -210px 0px;
}

.cropControls i.cropControlRotateRight {
  background-position: -240px 0px;
}

.cropControls i.cropControlCrop {
  background-position: -120px 0px;
}

.cropControls i.cropControlUpload {
  background-position: -150px 0px;
}

.cropControls i.cropControlReset {
  background-position: -180px 0px;
}

.cropControls i.cropControlRemoveCroppedImage {
  background-position: -180px 0px;
}

.cropControls i:last-child {
  margin-right: none;
}

#croppicModal {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: block;
  background: rgba(0, 0, 0, 0.8);
  z-index: 10000;
}

/*
*		PRELOADER 
*		With courtesy of : http://cssload.net/
*/
.bubblingG {
  text-align: center;
  width: 80px;
  height: 50px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -18px auto auto -40px;
  z-index: 2;
}

.bubblingG span {
  display: inline-block;
  vertical-align: middle;
  width: 10px;
  height: 10px;
  margin: 25px auto;
  background: #FFF;
  box-shadow: 5px 5px 0px rgba(0, 0, 0, 0.2);
  -moz-border-radius: 50px;
  -moz-animation: bubblingG 1s infinite alternate;
  -webkit-border-radius: 50px;
  -webkit-animation: bubblingG 1s infinite alternate;
  -ms-border-radius: 50px;
  -ms-animation: bubblingG 1s infinite alternate;
  -o-border-radius: 50px;
  -o-animation: bubblingG 1s infinite alternate;
  border-radius: 50px;
  animation: bubblingG 1s infinite alternate;
}

#bubblingG_1 {
  -moz-animation-delay: 0s;
  -webkit-animation-delay: 0s;
  -ms-animation-delay: 0s;
  -o-animation-delay: 0s;
  animation-delay: 0s;
}

#bubblingG_2 {
  -moz-animation-delay: 0.3s;
  -webkit-animation-delay: 0.3s;
  -ms-animation-delay: 0.3s;
  -o-animation-delay: 0.3s;
  animation-delay: 0.3s;
}

#bubblingG_3 {
  -moz-animation-delay: 0.6s;
  -webkit-animation-delay: 0.6s;
  -ms-animation-delay: 0.6s;
  -o-animation-delay: 0.6s;
  animation-delay: 0.6s;
}

@-moz-keyframes bubblingG {
  0% {
    width: 10px;
    height: 10px;
    background-color: #FFF;
    -moz-transform: translateY(0);
  }
  100% {
    width: 24px;
    height: 24px;
    background-color: #FFF;
    -moz-transform: translateY(-21px);
  }
}
@-webkit-keyframes bubblingG {
  0% {
    width: 10px;
    height: 10px;
    background-color: #FFF;
    -webkit-transform: translateY(0);
  }
  100% {
    width: 24px;
    height: 24px;
    background-color: #FFF;
    -webkit-transform: translateY(-21px);
  }
}
@-ms-keyframes bubblingG {
  0% {
    width: 10px;
    height: 10px;
    background-color: #FFF;
    -ms-transform: translateY(0);
  }
  100% {
    width: 24px;
    height: 24px;
    background-color: #FFF;
    -ms-transform: translateY(-21px);
  }
}
@-o-keyframes bubblingG {
  0% {
    width: 10px;
    height: 10px;
    background-color: #FFF;
    -o-transform: translateY(0);
  }
  100% {
    width: 24px;
    height: 24px;
    background-color: #FFF;
    -o-transform: translateY(-21px);
  }
}
@keyframes bubblingG {
  0% {
    width: 10px;
    height: 10px;
    background-color: #FFF;
    transform: translateY(0);
  }
  100% {
    width: 24px;
    height: 24px;
    background-color: #FFF;
    transform: translateY(-21px);
  }
}
.croppedImg {
  max-width: 200px;
}

.modal-image-uploader {
  width: 100%;
  height: 200px;
  position: relative;
  border: 1px solid #ccc;
}

#cropContaineroutput {
  width: 100%;
  height: 145px;
  position: relative;
  border: 1px solid #ccc;
}

#cropContainerEyecandy {
  width: 100%;
  height: 200px;
  position: relative;
  border: 1px solid #ccc;
}

#cropContainerPreload {
  width: 100%;
  height: 200px;
  position: relative;
  border: 1px solid #ccc;
}

#cropContainerMinimal {
  width: 100%;
  height: 200px;
  position: relative;
  border: 1px solid #ccc;
}

#cropContainerPlaceHolder2 {
  width: 100%;
  height: 200px;
  position: relative;
  border: none;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.alias {
  cursor: alias;
}

.all-scroll {
  cursor: all-scroll;
}

.auto {
  cursor: auto;
}

.cell {
  cursor: cell;
}

.context-menu {
  cursor: context-menu;
}

.col-resize {
  cursor: col-resize;
}

.copy {
  cursor: copy;
}

.crosshair {
  cursor: crosshair;
}

.default {
  cursor: default;
}

.e-resize {
  cursor: e-resize;
}

.ew-resize {
  cursor: ew-resize;
}

.grab {
  cursor: grab;
}

.grabbing {
  cursor: grabbing;
}

.help {
  cursor: help;
}

.drag:active {
  cursor: move;
}

.move {
  cursor: move;
}

.n-resize {
  cursor: n-resize;
}

.ne-resize {
  cursor: ne-resize;
}

.nesw-resize {
  cursor: nesw-resize;
}

.ns-resize {
  cursor: ns-resize;
}

.nw-resize {
  cursor: nw-resize;
}

.nwse-resize {
  cursor: nwse-resize;
}

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

.none {
  cursor: none;
}

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

.pointer {
  cursor: pointer;
}

.progress {
  cursor: progress;
}

.row-resize {
  cursor: row-resize;
}

.s-resize {
  cursor: s-resize;
}

.se-resize {
  cursor: se-resize;
}

.sw-resize {
  cursor: sw-resize;
}

.text {
  cursor: text;
}

.url {
  cursor: url(myBall.cur), auto;
}

.w-resize {
  cursor: w-resize;
}

.wait {
  cursor: wait;
}

.zoom-in {
  cursor: zoom-in;
}

.zoom-out {
  cursor: zoom-out;
}

.edit-customers .calls audio {
  width: 100%;
}

.timeline .start {
  width: 120px;
  border-right: 4px solid #00ACEC;
}
.timeline .start .date {
  font-size: 0.92em;
}
.timeline .start .person {
  font-size: 0.8em;
}

.moo-generic-contact {
  color: #00ACEC !important;
}

.linked_datatable tr {
  cursor: pointer;
}

.dataTables_processing.card {
  display: none !important;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.delivery-map .map-div {
  width: 100%;
  height: 100%;
}
.delivery-map h5 {
  margin-bottom: 12px;
  color: #3aadec;
  font-size: 15px;
}
.delivery-map .journey[state=save] h3.update {
  display: none !important;
}
.delivery-map .journey[state=save] h3.save {
  display: block !important;
}
.delivery-map .journey[state=save] button.update {
  display: none;
}
.delivery-map .journey[state=save] button.save {
  display: block;
}
.delivery-map .journey[state=update] h3.update {
  display: block !important;
}
.delivery-map .journey[state=update] h3.save {
  display: none !important;
}
.delivery-map .journey[state=update] button.update {
  display: block;
}
.delivery-map .journey[state=update] button.save {
  display: none;
}
.delivery-map .journey .m-portlet__body > div:not(:first-child) {
  margin-top: 20px;
}
.delivery-map .journey .stop {
  padding: 10px;
  margin: 10px 0px;
  background-color: #f3f3f3;
  cursor: pointer;
}
.delivery-map .journey .stop i.remove {
  float: right;
  cursor: pointer;
}
.delivery-map .journey .stop p {
  margin-bottom: 4;
}
.delivery-map .journey .stop p:last-child {
  margin-bottom: 0;
}
.delivery-map .journey .other .total-mileage, .delivery-map .journey .other .total-carriage-charged {
  margin-left: 20px;
  color: #3aadec;
  font-size: 20px;
}

.journey-table tr {
  cursor: move;
}
.journey-table tr:hover {
  background-color: #f7f7f7;
}

.journey-orders-list {
  width: 30px;
  height: 30px;
  margin: auto;
  display: inline-block;
  border: 1px solid gray;
  vertical-align: middle;
  border-radius: 2px;
  cursor: pointer;
}

.fix-map {
  position: sticky;
  top: 90px;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.displays-icon-div {
  margin-right: 10px;
}
.displays-icon-div i {
  font-size: 20px;
}

.target-text {
  font-size: 80px;
  font-weight: bold;
}

.stats-text {
  font-size: 60px;
  font-weight: bold;
}

.target-rainbow {
  background: linear-gradient(0.25turn, #ff61ef, #ffa561, #fff461, #61ff86, #fff461, #ffa561, #ff61ef);
  height: 40px;
}
.target-rainbow .target-rainbow-section-mid {
  display: inline-block;
  width: 16.66%;
  height: 100%;
  border-right: 1px solid #313131;
  float: left;
}

.target-circle {
  width: 30px;
  height: 30px;
  border-radius: 50px;
  background-color: black;
  margin-right: -15px;
  position: relative;
  float: right;
  top: 5px;
  display: inline-flex;
}

.call-board-col {
  width: 50%;
  border-right: 1px solid #707070;
  padding: 10px;
  font-size: 45px;
  font-weight: 400;
  color: black;
}

.displays.delivery-map .map-div > div {
  position: relative !important;
}

li#m_quicksearch div.m-dropdown__content a {
  display: block;
  margin-bottom: 2px;
}
li#m_quicksearch div.m-dropdown__content h4:not(:first-child) {
  margin-top: 10px;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.file-input {
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1;
}

.col-20-percent {
  margin-right: 15;
}

.file-input + label {
  color: white;
  display: inline-block;
}

.bracket {
  display: none;
}

.email-search-highlighted {
  background-color: #b2eafb !important;
}

.file-input + label {
  cursor: pointer; /* "hand" cursor */
}

.file-input:focus + label {
  outline: 1px dotted #000;
  outline: -webkit-focus-ring-color auto 5px;
}

.file-input + label * {
  pointer-events: none;
}

.email-menu {
  list-style-type: none;
  padding-left: 0px;
  font-size: 14px;
  line-height: 1.8;
}
.email-menu li {
  cursor: pointer;
  padding: 3px 5px;
}
.email-menu li:hover {
  background-color: #f9f9f9;
}

.tag-li {
  list-style-type: none;
}

.email-list-con thead th {
  background-color: #36a3f7;
  color: white;
}

.email-summary {
  padding: 7px;
  cursor: pointer;
  border: 1px solid transparent;
  border-bottom: 1px solid rgb(224, 224, 228);
}
.email-summary:hover {
  -webkit-box-shadow: 0px 1px 6px 0px rgb(224, 224, 224);
  -moz-box-shadow: 0px 1px 6px 0px rgb(224, 224, 224);
  box-shadow: 0px 1px 6px 0px rgb(224, 224, 224);
}

.e-summary-job-number {
  font-size: 10px;
}

.e-summary-name-email {
  font-size: 12px;
}

.e-summary-date {
  font-size: 10px;
}

.open-thread-row {
  background-color: #C5E7FB;
}

.unread-thread-row {
  font-weight: 700;
}

.e-summary-subject {
  font-size: 12px;
}

.e-writing-subject {
  font-size: 15px;
  font-weight: 500;
}

.e-writing-tags .moo-badge {
  margin-left: 5px;
}
.e-writing-tags .add-tags-dropdown {
  margin-bottom: 7px;
}
.e-writing-tags .moo-checkbox {
  margin-top: 1px;
}

.e-writing-icons i, .e-writing-icons a {
  padding: 5px;
  font-size: 1.2rem;
  cursor: pointer;
}

.file-extension-box {
  display: inline;
  border: #e0e0e4 1px solid;
  padding: 3px;
  border-radius: 10px;
  background-color: #e4e4e4;
  font-size: 1.75rem;
  margin-bottom: 0.5rem;
  font-weight: 500;
  line-height: 1.2;
  color: #575962;
}

.file-extension-box:hover {
  color: #575962;
  text-decoration: none;
}

.email-portlet {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  border: solid 1px rgb(224, 224, 228);
  margin-bottom: 8px !important;
}
.email-portlet .m-portlet__head {
  padding: 10px !important;
  height: 3.2rem !important;
}
.email-portlet .m-portlet__head .m-portlet__head-caption {
  height: auto !important;
  width: 80%;
}
.email-portlet .m-portlet__head h3 {
  font-size: 14px !important;
  color: #575962 !important;
}
.email-portlet .m-portlet__body {
  padding: 10px !important;
}
.email-portlet .m-portlet__body small {
  color: #afb2c1;
}

.email-summernote .btn-fullscreen, .email-summernote .note-table, .email-summernote .btn-codeview, .email-summernote [aria-label=Picture], .email-summernote [aria-label=Video], .email-summernote [aria-label=Help] {
  display: none !important;
}

.body {
  word-wrap: break-word;
}

.e-unlink {
  position: absolute;
  right: 20px;
}

.pending-file-list {
  padding-left: 0px !important;
  margin-bottom: 0px !important;
  list-style: none !important;
}

.file-type-icon {
  height: auto;
  width: 40px;
}

.reason-con input:disabled ~ span {
  border-color: grey !important;
  background-color: lightgrey;
}

.reason-con input:disabled ~ span:after {
  border-color: black !important;
  background-color: lightgrey;
}

/*
.prev-emails * {
	font-size: 110%;
}
*/
.yellow-bar {
  background-color: #FBDE00;
  padding: 20px !important;
  border-radius: 10px;
  border-style: solid !important;
  border-width: 1px;
  margin-top: 10px;
  margin-bottom: 20px;
  font-weight: 900;
  width: 100%;
}

.yellow-bar .blue-text {
  color: #00ACEC;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
/*
.select2-selection__clear {
	display: none !important;
}
*/
.capitalize {
  text-transform: capitalize;
}

.dashboard .displays-icon-div {
  border: 1px solid #00ACEC;
  border-radius: 50px;
  height: 50px;
  width: 50px;
  padding: 15px;
  margin-right: 20px;
}
.dashboard .legendLabel {
  font-size: 140%;
  padding: 5px;
}
.dashboard .legendColorBox > div {
  border: 0px !important;
}
.dashboard .legendColorBox > div > div {
  border-radius: 10px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  padding-right: 40px;
}

a {
  color: #00ACEC;
}
a:hover {
  color: #009EDA;
}

@media (min-width: 1025px) {
  .m-aside-left--fixed .m-body {
    padding-left: 225px;
  }
}
.m-portlet .m-portlet__body {
  padding: 1.5rem;
}

.m-portlet__head {
  padding: 1.5rem !important;
}

.m-body .m-subheader {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.m-body .m-content {
  padding-top: 16px !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.container {
  padding-left: 8px;
  padding-right: 8px;
}

.row {
  margin-left: -8px;
  margin-right: -8px;
}

.col-xs-1,
.col-sm-1,
.col-md-1,
.col-lg-1,
.col-xs-2,
.col-sm-2,
.col-md-2,
.col-lg-2,
.col-xs-3,
.col-sm-3,
.col-md-3,
.col-lg-3,
.col-xs-4,
.col-sm-4,
.col-md-4,
.col-lg-4,
.col-xs-5,
.col-sm-5,
.col-md-5,
.col-lg-5,
.col-xs-6,
.col-sm-6,
.col-md-6,
.col-lg-6,
.col-xs-7,
.col-sm-7,
.col-md-7,
.col-lg-7,
.col-xs-8,
.col-sm-8,
.col-md-8,
.col-lg-8,
.col-xs-9,
.col-sm-9,
.col-md-9,
.col-lg-9,
.col-xs-10,
.col-sm-10,
.col-md-10,
.col-lg-10,
.col-xs-11,
.col-sm-11,
.col-md-11,
.col-lg-11,
.col-xs-12,
.col-sm-12,
.col-md-12,
.col-lg-12,
.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12 {
  padding-left: 8px;
  padding-right: 8px;
}

div.m-portlet {
  margin-bottom: 16px;
}

h3.m-subheader__title {
  font-size: 1.7rem !important;
}

label {
  display: block;
}

.m-dropzone .dz-message {
  margin: 1em 0 !important;
}

.dropzone {
  min-height: 125px;
}

.dropzone .dz-preview {
  margin: 0px;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
}

div.dz-image {
  max-width: 100% !important;
  height: auto !important;
}
div.dz-image img {
  max-width: 100% !important;
  height: auto !important;
}

.nav.nav-tabs {
  margin: 0px;
}

input:focus {
  border-color: #00ACEC !important;
}

textarea:focus {
  border-color: #00ACEC !important;
}

.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--single {
  border-color: #00ACEC !important;
}

.note-editable {
  margin-top: 10px;
  line-height: 1;
}
.note-editable p {
  margin: 0 !important;
}

.m-list-search__form {
  margin-bottom: 0px !important;
}

.dataTables_wrapper .pagination .page-item:hover > .page-link,
.dataTables_wrapper .pagination .page-item.next > .page-link:hover,
.dataTables_wrapper .pagination .page-item.last > .page-link:hover,
.dataTables_wrapper .pagination .page-item.first > .page-link:hover,
.dataTables_wrapper .pagination .page-item.previous > .page-link:hover {
  background-color: #A5A4BF;
}

.dataTables_wrapper .pagination .page-item.active > .page-link {
  background-color: #00ACEC;
}

.m-portlet__head-text {
  color: #00ACEC !important;
}

.m-timeline-3 .m-timeline-3__item:before {
  left: 4.2rem;
  width: 0.25rem;
}

.m-timeline-3 .m-timeline-3__item .m-timeline-3__item-time {
  font-size: 0.8rem;
  text-align: right;
  padding-top: 0px;
  color: #A5A4BF;
  font-weight: 300;
}

.m-timeline-3 .m-timeline-3__item .m-timeline-3__item-desc {
  padding-left: 5rem;
}

.main-content {
  padding: 0px !important;
}

.note-editor.note-frame .note-editing-area .note-editable[contenteditable=false] {
  background-color: #ffffff !important;
}

.toast {
  opacity: 1 !important;
}

.toast-top-right {
  top: 80px;
}

.fake-portlet-header {
  height: 0;
  display: inline-block !important;
  margin: 0;
  padding: 0px 0px 0px 10px !important;
  font-size: 18px;
}

.swal2-confirm {
  background-color: #00ACEC !important;
}

.datepicker tbody tr > td.day.today {
  background-color: #005EAD;
}

.datepicker tbody tr > td.day.selected,
.datepicker tbody tr > td.day.selected:hover,
.datepicker tbody tr > td.day.active,
.datepicker tbody tr > td.day.active:hover {
  background-color: #00ACEC;
}

.datepicker table tr td.today.active,
.datepicker table tr td.today:active,
.datepicker table tr td.today.focus,
.datepicker table tr td.today:focus,
.datepicker table tr td.today.active.focus,
.datepicker table tr td.today.active:focus,
.datepicker table tr td.today.active:hover,
.datepicker table tr td.today:active.focus,
.datepicker table tr td.today:active:focus,
.datepicker table tr td.today:active:hover,
.datepicker tbody tr > td span.month.active:hover,
.datepicker tbody tr > td span.month.active {
  color: white;
  background-color: #00ACEC;
  border-color: #00ACEC;
}

.select2-container--disabled .select2-selection {
  background-color: white !important;
}

.moo-contact-tab-content > .moo-tab-pane:first-child input.remove {
  display: none !important;
}

.global_quantity_discounter_content > .moo-tab-pane:first-child input.gqd-remove {
  display: none !important;
}

.global_length_discounter_content > .moo-tab-pane:first-child input.gqd-remove {
  display: none !important;
}

.global_area_discounter_content > .moo-tab-pane:first-child input.gqd-remove {
  display: none !important;
}

.product-images .la-close,
.option .la-close {
  cursor: pointer;
  font-size: 20px;
  color: tomato;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  /* display: none; <- Crashes Chrome on hover */
  -webkit-appearance: none;
  margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

@media (max-width: 768px) {
  .m-subheader .m-subheader__title {
    display: inline-block;
  }
}
.dataTables_filter .form-control {
  margin-left: 10px;
  display: inline-block;
  width: 300px;
}

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

.moo-cyan {
  color: cyan;
}

.moo-white {
  color: white;
}

.modal-xl {
  max-width: 800px;
}

@media (min-width: 992px) {
  .modal-xl {
    max-width: 1000px;
  }
}
.btn-secondary:hover {
  border-color: #00ACEC !important;
}

.btn-secondary:focus {
  border-color: #00ACEC !important;
}

.btn-info:focus {
  color: #212529 !important;
  text-decoration: none;
}

.moo-underline {
  text-decoration: underline !important;
}

.job-board-box-selected {
  border-color: blue !important;
  border-width: 3px !important;
}

.job-board-notes-line {
  background-color: grey;
  width: 3px;
  position: relative;
  right: 5px;
}

/* Large devices (large desktops, 1200px and up) */
@media (max-width: 1199px) {
  .m-portlet .m-portlet__head {
    height: auto !important;
  }
}
.created-via-portal-row {
  background-color: #f0fff0;
}

.areas-warnings-table td {
  padding: 0.75rem;
  border: 2px solid #989898;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
/* CLASSES - COLOR */
.moo-cl-header {
  color: #43425D;
}

.moo-cl-white {
  color: #ffffff;
}

.moo-cl-black {
  color: #000000;
}

.moo-cl-grey {
  color: #F5F6FA;
}

.moo-cl-darker-grey {
  color: #A5A4BF;
}

.moo-cl-blue {
  color: #00ACEC !important;
}

.moo-cl-light-blue {
  color: #00ACEC;
}

.moo-cl-icon-green {
  color: #B7FDBB;
}

.moo-cl-icon-dark-green {
  color: #65F96D;
}

.moo-cl-icon-dark-red {
  color: #F95656;
}

.moo-cl-red {
  color: #ff0000 !important;
}

.moo-cl-blue {
  color: #00ACEC !important;
}

.moo-cl-light-blue {
  color: #00ACEC;
}

.moo-cl-dark-blue {
  color: #005EAD;
}

.moo-cl-icon-red {
  color: #FFA7BB;
}

.moo-cl-icon-orange {
  color: #FFEB88;
}

.moo-cl-icon-dark-orange {
  color: rgb(255, 193, 136);
}

/* CLASSES - BACKGROUND COLOR */
.moo-bg-white {
  background-color: #ffffff;
}

.moo-bg-darker-grey {
  background-color: #A5A4BF;
}

.moo-bg-grey {
  background-color: #F5F6FA;
}

.moo-bg-darkest-grey {
  background-color: #535353;
}

.moo-bg-left-sidebar {
  background-color: #43425D;
}

.moo-bg-left-sidebar {
  background-color: #43425D;
}

.moo-bg-right-sidebar {
  background-color: #504F69;
}

.moo-bg-red {
  background-color: #ff0000;
}

.moo-bg-dark-blue {
  background-color: #005EAD;
}

.moo-bg-icon-green {
  background-color: #B7FDBB;
}

.moo-bg-icon-yellow {
  background-color: #F9FEB2;
}

.moo-bg-icon-blue {
  background-color: #00804F;
}

.moo-bg-icon-dark-green {
  background-color: #65F96D;
}

.moo-bg-icon-red {
  background-color: #FFA7BB;
}

.moo-bg-icon-dark-red {
  background-color: #F95656;
}

.moo-bg-icon-grey {
  background-color: #F0F0F0;
}

.moo-bg-icon-orange {
  background-color: #FFEB88;
}

.moo-bg-icon-dark-orange {
  background-color: rgb(255, 193, 136);
}

.moo-bg-icon-purple {
  background-color: purple;
}

.moo-bg-icon-black {
  background-color: black;
}

.moo-dark-skin {
  background-color: #484848;
}

.moo-portlet-dark-skin {
  background-color: #505050;
}

/* CLASSES - BACKGROUND COLOR HOVER */
.moo-bgh-white:hover {
  background-color: #f9f9f9;
}

.moo-bgh-grey:hover {
  background-color: rgb(224, 224, 228);
}

.moo-bgh-darkest-grey:hover {
  background-color: #383838;
}

.moo-bgh-dark-blue:hover {
  background-color: #004C8E;
}

.moo-bgh-icon-green:hover {
  background-color: #AAECAE;
}

.moo-bgh-icon-yellow:hover {
  background-color: #EDF2A9;
}

.moo-bgh-icon-blue:hover {
  background-color: #ACB5DA;
}

.moo-bgh-icon-dark-green:hover {
  background-color: #5BE262;
}

.moo-bgh-icon-red:hover {
  background-color: #EA99AB;
}

.moo-bgh-icon-dark-red:hover {
  background-color: rgb(218, 75, 75);
}

.moo-bgh-icon-grey:hover {
  background-color: #E4E4E4;
}

.moo-bgh-icon-orange:hover {
  background-color: #F2DF81;
}

.moo-bgh-icon-dark-orange:hover {
  background-color: rgb(242, 170, 129);
}

/* CLASSES - HOVER POINTER */
.moo-pointer:hover {
  cursor: pointer;
}

/* CLASSES - BUTTONS */
.moo-header-button {
  float: right;
}

.moo-input-icon-button {
  display: inline-block;
  cursor: pointer;
  padding: 10px;
  font-size: 18px;
  color: #000000;
}

.moo-input-icon-input {
  width: 80%;
  display: inline-block;
}

.moo-btn-med {
  padding: 0.6rem 1.15rem;
}

.moo-arrow-nav {
  border: 1px solid #ebedf2 !important;
  opacity: 1 !important;
  margin-left: 3px;
  margin-right: 3px;
}

.moo-x-pad {
  white-space: nowrap;
  padding-left: 20px !important;
  padding-right: 20px !important;
  text-align: center;
}

/* CLASSES - INPUTS */
.moo-input-short {
  max-width: 390px;
}

.moo-input-shorter {
  max-width: 300px;
}

.moo-input-shortest {
  max-width: 250px;
}

.moo-input-tiny {
  max-width: 150px;
}

.moo-white-disable:disabled {
  background-color: #ffffff;
}

/* CLASSES - TEXT */
.moo-h4-small {
  font-size: 1.2rem;
}

.moo-h4-smaller {
  font-size: 1.1rem;
}

.moo-h4-smallest {
  font-size: 1rem;
}

.moo-text-divider {
  border-bottom: solid 1px rgb(224, 224, 228);
  margin-bottom: 15px;
  padding-bottom: 10px;
}

.moo-right-divider {
  border-right: solid 1px #e0e0e4;
}

.moo-top-divider {
  border-top: solid 1px #e0e0e4;
  margin-top: 10px;
  padding-top: 10px;
}

.moo-divider {
  border-bottom: solid 1px rgb(224, 224, 228);
  margin-bottom: 15px;
}

/* CLASSES - TAGS */
.moo-tag {
  background-color: #F5F6FA;
  padding: 8px 15px;
  margin: 4px 4px;
  border-radius: 50px;
  list-style-type: none;
  display: inline-block;
}
.moo-tag p {
  display: inline;
}
.moo-tag i {
  font-size: 1.1rem;
  margin-left: 5px;
}
.moo-tag i:hover {
  cursor: pointer;
  color: #ff0000;
}

.pointer-events-none {
  pointer-events: none;
}

.moo-color-tag {
  background-color: #F5F6FA;
  padding: 8px 15px;
  margin: 4px 4px;
  border-radius: 50px;
  list-style-type: none;
  display: inline-block;
}
.moo-color-tag p {
  display: inline;
}
.moo-color-tag i.la-close {
  font-size: 1.1rem;
  margin-left: 0px;
  margin-left: 5px;
}
.moo-color-tag i.la-close:hover {
  cursor: pointer;
  color: #ff0000;
}
.moo-color-tag i.fa-circle {
  font-size: 1.1rem;
  margin-left: 0px;
  margin-right: 5px;
}

.moo-badge {
  min-height: 15px;
  min-width: 15px;
  padding: 1px 7px;
  font-size: 0.9rem;
}

/* CLASSES - RADIO/CHECKBOX */
.moo-radio span {
  border: 1px solid #00ACEC;
  color: #00ACEC;
}
.moo-radio span::after {
  border: 1px solid #00ACEC;
  color: #00ACEC;
  background-color: #00ACEC;
}
.moo-radio > input:checked ~ span {
  border-color: #00ACEC;
}

.moo-checkbox span {
  border: 1px solid #00ACEC;
}
.moo-checkbox > input:checked ~ span {
  border-color: #00ACEC;
}

/* CLASSES - TABLE */
.moo-table-head th {
  background-color: #F5F6FA;
  font-size: 13px;
  color: #575962;
}

.moo-table-body tbody {
  font-size: 13px !important;
}

.moo-table-hover td:hover {
  cursor: pointer;
}

/* CLASSES - LINKS */
.moo-red-link {
  color: #ff0000;
  font-style: italic;
}
.moo-red-link:hover {
  color: #e20000;
  text-decoration: none;
}
.moo-red-link:active {
  color: #e20000;
}

.moo-blue-link {
  color: #00ACEC;
  font-style: italic;
}
.moo-blue-link:hover {
  color: #009EDA;
  text-decoration: none;
}
.moo-blue-link:active {
  color: #009EDA;
}

.m-portlet.moo-warning {
  border-left-color: #F9FEB2;
  border-left-style: solid;
  border-left-width: 5px;
}

/* CLASSES - PORTLETS */
.moo-portlet-head {
  height: auto !important;
}

.no-portlet-shadow {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}

/* CLASSES - IMAGE */
.moo-image-autoh {
  width: 100%;
  height: auto;
}

/* CLASSES - GENERAL */
.moo-hide {
  display: none;
}

.moo-error-field {
  border-color: #ff0000 !important;
}

.moo-changed-field {
  border-color: green !important;
  border-style: solid;
}

.table td.fit,
.table th.fit {
  white-space: nowrap !important;
  width: 1% !important;
}

.blockMsg {
  padding: 20px 30px 20px 30px !important;
  border: none !important;
  box-shadow: 0px 1px 15px 1px rgba(69, 65, 78, 0.1) !important;
  border-radius: 4px;
  display: table;
  table-layout: fixed;
  width: 175px !important;
  left: 50% !important;
  transform: translateX(-50%);
}

.loader-con {
  position: relative;
  left: 15px;
  top: 8px;
}

.no-border {
  border: none !important;
}

.moo-scroll-y {
  overflow-y: scroll;
}

.h-65 {
  height: 65% !important;
}

.y-scroll-important {
  overflow-y: auto !important;
}

p {
  overflow-wrap: break-word;
}

.padded-icon {
  width: 30px;
  height: 30px;
  border: 1px solid grey;
  border-radius: 5px;
  cursor: pointer;
}
.padded-icon.padded-icon-red {
  color: #000000;
  background-color: #FFA7BB;
}
.padded-icon.padded-icon-red:hover {
  background-color: #EA99AB;
}
.padded-icon.padded-icon-dark-red {
  color: #000000;
  background-color: #F95656;
}
.padded-icon.padded-icon-dark-red:hover {
  background-color: rgb(218, 75, 75);
}
.padded-icon.padded-icon-green {
  color: #000000;
  background-color: #B7FDBB;
}
.padded-icon.padded-icon-green:hover {
  background-color: #AAECAE;
}
.padded-icon.padded-icon-dark-green {
  color: #ffffff;
  background-color: #65F96D;
}
.padded-icon.padded-icon-dark-green:hover {
  background-color: #5BE262;
}
.padded-icon.padded-icon-red {
  color: #000000;
  background-color: #FFA7BB;
}
.padded-icon.padded-icon-red:hover {
  background-color: #EA99AB;
}
.padded-icon.padded-icon-dark-red {
  color: #ffffff;
  background-color: #F95656;
}
.padded-icon.padded-icon-dark-red:hover {
  background-color: rgb(218, 75, 75);
}
.padded-icon.padded-icon-darker-green {
  color: #ffffff;
  background-color: #2E8C55;
}
.padded-icon.padded-icon-darker-green:hover {
  background-color: #257245;
}
.padded-icon.padded-icon-grey {
  color: #000000;
  background-color: #F0F0F0;
}
.padded-icon.padded-icon-grey:hover {
  background-color: #E4E4E4;
}
.padded-icon.padded-icon-black {
  color: #ffffff;
  background-color: #000000;
}
.padded-icon.padded-icon-yellow {
  color: #000000;
  background-color: #F9FEB2;
}
.padded-icon.padded-icon-yellow:hover {
  background-color: #EDF2A9;
}
.padded-icon.padded-icon-blue {
  color: #000000;
  background-color: #00804F;
}
.padded-icon.padded-icon-blue:hover {
  background-color: #ACB5DA;
}
.padded-icon.padded-icon-darker-orange {
  color: #ffffff;
  background-color: #F48312;
}
.padded-icon.padded-icon-darker-orange:hover {
  background-color: #E07911;
}
.padded-icon.padded-icon-orange {
  color: #000000;
  background-color: #FFEB88;
}
.padded-icon.padded-icon-orange:hover {
  background-color: #F2DF81;
}
.padded-icon.padded-icon-darker-orange-black {
  color: #000000;
  background-color: #F48312;
}
.padded-icon.padded-icon-darker-orange-black:hover {
  background-color: #E07911;
}
.padded-icon.padded-icon-dark-red-black {
  color: #000000;
  background-color: #F95656;
}
.padded-icon.padded-icon-dark-red-black:hover {
  background-color: rgb(218, 75, 75);
}

.global-search .m-dropdown__content a:focus {
  background-color: yellow;
}

.search-summary {
  background-color: #eee;
  padding: 10px;
  border: 1px solid #aaa;
  display: none;
  margin-top: 20px;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.image-con {
  width: 178px;
  height: 178px;
  position: relative;
  margin-top: 20px !important;
}

.moo-image {
  width: 100%;
  height: 100%;
  object-fit: contain !important;
}

.moo-image.filled:hover ~ .delete-photo {
  display: block;
}

.moo-image:hover ~ .delete-con {
  display: block;
}

.delete-con:hover {
  display: block;
  cursor: pointer;
}

.delete-photo:hover {
  display: block;
  cursor: pointer;
}

.delete-con {
  display: none;
  position: absolute;
  top: 3%;
  right: 5%;
  font-size: 200%;
}

.delete-photo {
  display: none;
  position: absolute;
  top: 3%;
  right: 5%;
  font-size: 200%;
}

.product-images .image-con {
  margin-left: 13px;
  margin-bottom: 60px !important;
}
.product-images .file-label {
  position: relative;
  bottom: 60px;
}

.incidents .tabs ul {
  margin-bottom: 20px;
  border-bottom-color: #ddd !important;
}
.incidents .tabs li a {
  width: 120px !important;
  border-color: #ddd !important;
  background-color: none !important;
}
.incidents i.la-close {
  cursor: pointer;
}
.incidents label.mood {
  display: inline;
}
.incidents .incident-modal label.moo-checkbox.m-checkbox {
  display: block;
}

.incident-items-table {
  overflow-y: scroll;
  max-height: 500px;
}

.invoicer td.status {
  text-transform: capitalize;
}
.invoicer td.checkbox label {
  position: relative;
  bottom: 12;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.job-board-header-select {
  min-width: 130px;
  margin-right: 5px;
}

.job-board-toggler-box {
  background-color: #ffffff;
  padding: 6px 12px;
  color: #00ACEC;
  font-size: 1.1rem;
  font-weight: 500;
  border: 1px solid #8F8F8F;
  margin-top: 5px;
}
.job-board-toggler-box i {
  cursor: pointer;
}

.job-board-date-box {
  background-color: #D1D2D4;
  margin-right: 5px;
  margin-bottom: 5px;
  border-radius: 5px;
  border: 1px solid #8F8F8F;
  padding: 5px 4px;
}
.job-board-date-box p {
  color: #000000;
  margin-bottom: 0px;
  font-size: 1.2rem;
  padding: 5px 4px;
}

.status-text {
  font-size: 1.2rem;
}

.job-board-job-box {
  margin-right: 5px;
  margin-bottom: 5px;
  cursor: pointer;
  border-radius: 5px;
  font-size: 1.2rem;
  border: 1px solid #8F8F8F;
}
.job-board-job-box div:first-child {
  border-radius: 5px 0px 0px 5px;
}
.job-board-job-box p {
  padding: 10px 8px 0px 8px;
  margin-bottom: 0px;
}
.job-board-job-box .job-board-mini-tag {
  width: 10px;
}

.left-indenter {
  border-bottom: 1px solid black;
  width: 25px;
  margin-right: 5px;
}

.left-indenter-white {
  border-bottom: 1px solid white;
  width: 25px;
  margin-right: 5px;
}

.modal.print-copies input {
  pointer-events: all !important;
}
.modal.print-copies label.m-checkbox {
  pointer-events: all !important;
  display: block;
}
.modal.print-copies label.m-checkbox span {
  border-color: #009eda !important;
}
.modal.print-copies label.custom {
  margin-top: 20px;
}
.modal.print-copies label.custom input {
  width: 50%;
}
.modal.print-copies div.contacts {
  margin-top: 16px;
}
.modal.print-copies div.form-group {
  margin-top: 16px;
}
.modal.print-copies h6 {
  margin-bottom: 20px;
}
.modal.print-copies h6:not(:first-of-type) {
  margin-top: 25px;
}
.modal.print-copies .copies input.m-input, .modal.print-copies .summaries input.m-input {
  display: inline;
}
.modal.print-copies .copies input.m-input[type=number], .modal.print-copies .summaries input.m-input[type=number] {
  width: 60px;
  text-align: center;
  margin-right: 10px;
}
.modal.print-copies .copies input.m-input[type=text], .modal.print-copies .summaries input.m-input[type=text] {
  width: auto;
  margin-right: 0;
}

.moo-blinker {
  animation: blinker 2s cubic-bezier(1, 0.04, 1, -0.02) infinite;
}

@keyframes blinker {
  80% {
    opacity: 0.2;
  }
}
.side-box-title {
  color: #00ACEC;
}

.fix-job-box {
  position: sticky;
  top: 90px;
  max-height: 75vh;
  overflow-y: scroll;
}

.reset-search-button {
  cursor: pointer;
}

.search-label {
  color: #575962;
}

.delete-note {
  color: #000000;
}
.delete-note:hover {
  color: #ff0000;
  cursor: pointer;
}

.urgency-box {
  width: 20px;
  height: 20px;
  margin: auto;
  display: inline-block;
  border: 1px solid gray;
  vertical-align: middle;
  border-radius: 2px;
}

.tag-circle {
  height: 15px;
  width: 15px;
  margin-right: 5px;
  border: 1px solid gray;
  display: inline-block;
  vertical-align: middle;
  border-radius: 50%;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.m-aside-left {
  width: 225px;
  background-color: #43425D !important;
}

.m-menu__link-icon {
  color: #A5A4BF !important;
  font-size: 1.1rem !important;
}

.m-menu__link-text {
  color: #A5A4BF !important;
}

.m-menu__link:hover {
  color: #ffffff !important;
}

.m-menu__item:hover, .m-menu__item--open {
  background-color: #3B3B53 !important;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.login-portlet {
  max-width: 600px;
  width: 100%;
}

.login-img {
  max-width: 300px;
  width: 100%;
  height: auto;
  margin-bottom: 10px;
}

.login-title {
  font-size: 2.2rem;
  font-weight: 600;
  letter-spacing: 0.3rem;
  color: #3B3B53;
}

.login-subtitle {
  font-size: 15px;
  color: #A5A4BF;
}

.login-input {
  font-size: 1.3rem;
  border-radius: 0px;
  border: none;
  border-bottom: 2px solid #F5F6FA;
}
.login-input:focus {
  border: none;
  border-bottom: 2px solid #00ACEC;
}

.login-button {
  width: 100%;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.note-con {
  max-height: 800px;
  overflow-y: auto;
}

.note-deleter:hover {
  color: #F95656;
}

.note-holder {
  background-color: #f0f0f7;
  padding: 15px;
  border-radius: 10px 10px 10px 10px;
  margin-bottom: 10px;
}

.note-warning {
  border: solid 1px #F95656;
}

.pending-list-con span.bold {
  font-weight: bold;
}
.pending-list-con ul.main-pending-tabs li:not(.active) a {
  background-color: transparent !important;
}
.pending-list-con ul.main-pending-tabs li.active a {
  font-weight: bold !important;
}
.pending-list-con .modal input {
  pointer-events: all !important;
}
.pending-list-con .modal label.m-checkbox {
  pointer-events: all !important;
  display: block;
}
.pending-list-con .modal label.m-checkbox span {
  border-color: #009eda !important;
}
.pending-list-con .modal label.custom {
  margin-top: 20px;
}
.pending-list-con .modal label.custom input {
  width: 50%;
}
.pending-list-con .modal div.contacts {
  margin-top: 16px;
}
.pending-list-con .modal div.form-group {
  margin-top: 16px;
}
.pending-list-con .modal h6 {
  margin-bottom: 20px;
}
.pending-list-con .modal h6:not(:first-of-type) {
  margin-top: 25px;
}
.pending-list-con .modal .copies input.m-input {
  display: inline;
}
.pending-list-con .modal .copies input.m-input[type=number] {
  width: 60px;
  text-align: center;
  margin-right: 10px;
}
.pending-list-con .modal .copies input.m-input[type=text] {
  width: auto;
  margin-right: 0;
}

.abc span.select2-results > ul.select2-results__options > li:first-child:not([aria-live=assertive]) {
  display: none;
}

#m_aside_right {
  display: flex;
}
#m_aside_right[disabled=disabled] {
  opacity: 0.5;
  pointer-events: none;
  /*
  div.container {
  	display: none;
  }
  */
}
#m_aside_right[disabled=disabled] div.unavailable {
  display: block;
}
#m_aside_right div.unavailable {
  display: none;
  color: white;
  padding: 70px 20px;
  text-align: center;
}
#m_aside_right div.unavailable span {
  display: none;
}

.fa-headphones-slash {
  background: url("https://ashby-elysium-public-2.s3-eu-west-2.amazonaws.com/assets/fa-headphones-slash.svg");
  height: 26px;
  width: 26px;
}
.fa-headphones-slash:before {
  content: " ";
}

.my-calls-buttons {
  height: 50%;
  padding-top: 3px;
  margin-top: 2px;
}

.my-calls-info {
  position: relative;
}
.my-calls-info i {
  position: relative;
  cursor: pointer;
  top: 3px;
  margin-left: 3px;
  border-radius: 5px;
  padding: 5px;
}
.my-calls-info .close-icon {
  position: absolute;
  right: 2px;
  font-size: 90%;
  top: 1px;
}

.call-containers[connection=true] .call.call.call.call .action {
  display: none;
}
.call-containers[connection=true] .call.call.call.call .action[action=stop-listening] {
  display: block;
}
.call-containers .call {
  cursor: default;
  border-bottom: 1px solid #504F69;
}
.call-containers .call > div:not(.clear-float) {
  height: 60px;
}
.call-containers .call > div.clear-float {
  clear: both;
}
.call-containers .call .info {
  float: left;
  padding: 10px;
}
.call-containers .call .info > div {
  width: 180px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.call-containers .call .info .external {
  font-size: 15px;
}
.call-containers .call .my-calls-info {
  padding: 5px 10px 5px 10px;
}
.call-containers .call .action {
  float: right;
  padding: 17px 10px;
  padding-left: 0px;
  font-size: 85%;
}
.call-containers .call .action i {
  font-size: 26px;
  cursor: pointer;
}
.call-containers .call .action[action=none] .fa-phone, .call-containers .call .action[action=none] .fa-headphones, .call-containers .call .action[action=none] .fa-headphones-slash {
  display: none;
}
.call-containers .call .action[action=listen] .fa-phone, .call-containers .call .action[action=listen] .fa-headphones-slash {
  display: none;
}
.call-containers .call .action[action=pick-up] .fa-headphones, .call-containers .call .action[action=pick-up] .fa-headphones-slash {
  display: none;
}
.call-containers .call .action[action=stop-listening] .fa-phone, .call-containers .call .action[action=stop-listening] .fa-headphones {
  display: none;
}
.call-containers .call[direction=inbound][ringing=true] {
  background-color: #b7fdbb;
}
.call-containers .call[direction=inbound][ringing=false] {
  background-color: #04ff12;
}
.call-containers .call[direction=outbound][ringing=true] {
  background-color: #f9ff9f;
}
.call-containers .call[direction=outbound][ringing=false] {
  background-color: #f2ff42;
}
.call-containers .call[direction=internal][ringing=true] {
  background-color: #75d0f2;
}
.call-containers .call[direction=internal][ringing=false] {
  background-color: #00acec;
}
.call-containers div[color=flashing-green] {
  animation-name: flashing-green;
  animation-duration: 1s;
  animation-iteration-count: infinite;
}
@keyframes flashing-green {
  0% {
    background-color: #04FF12;
  }
  50% {
    background-color: #B7FDBB;
  }
  100% {
    background-color: #04ff12;
  }
}
.call-containers div[color=flashing-blue] {
  animation-name: flashing-blue;
  animation-duration: 1s;
  animation-iteration-count: infinite;
}
@keyframes flashing-blue {
  0% {
    background-color: #00acec;
  }
  50% {
    background-color: #75d0f2;
  }
  100% {
    background-color: #00acec;
  }
}
.call-containers div[color=flashing-yellow] {
  animation-name: flashing-yellow;
  animation-duration: 1s;
  animation-iteration-count: infinite;
}
@keyframes flashing-yellow {
  0% {
    background-color: #f2ff42;
  }
  50% {
    background-color: #f9ff9f;
  }
  100% {
    background-color: #f2ff42;
  }
}
.call-containers div.moo-fwd-call span.select2-container--default {
  width: 80% !important;
}
.call-containers div.new-call span.select2-container--default {
  width: 80% !important;
}

.my-calls-container .call > div:not(.clear-float) {
  height: 80px;
}

.phone-lines .panes {
  width: 100%;
}
.phone-lines .phone-line-pane {
  width: 100%;
  margin-bottom: 10px;
  display: none;
}
.phone-lines .phone-line-pane.active {
  display: block;
}
.phone-lines .phone-line-pane .icons {
  text-align: center;
}
.phone-lines .phone-line-pane .icons i.close-phone-line {
  display: none;
}
.phone-lines .phone-line-pane .icons i.pick-up {
  display: none;
}
.phone-lines .phone-line-pane .clear-float {
  clear: both;
}
.phone-lines .phone-line-pane:not([customer]) i.customer-page {
  display: none;
}
.phone-lines .phone-line-pane[on_hold=true] i.mute {
  display: none;
}
.phone-lines .phone-line-pane[on_hold=true] i.hold {
  display: none;
}
.phone-lines .phone-line-pane[on_hold=true] i.display-forward-dropdown {
  display: none;
}
.phone-lines .phone-line-pane[hold=true] i.hold {
  display: none;
}
.phone-lines .phone-line-pane[hold=true] i.hang-up {
  display: none;
}
.phone-lines .phone-line-pane[hold=true] i.display-forward-dropdown {
  display: none;
}
.phone-lines .phone-line-pane[hold=true] i.pick-up {
  display: inline;
}
.phone-lines .phone-line-pane[deactivated=true] .m-dropdown {
  float: left;
}
.phone-lines .phone-line-pane[deactivated=true] i {
  float: left;
  margin-right: 3px;
}
.phone-lines .phone-line-pane[deactivated=true] i.mute {
  display: none;
}
.phone-lines .phone-line-pane[deactivated=true] i.hold {
  display: none;
}
.phone-lines .phone-line-pane[deactivated=true] i.hang-up {
  display: none;
}
.phone-lines .phone-line-pane[deactivated=true] i.display-forward-dropdown {
  display: none;
}
.phone-lines .phone-line-pane[deactivated=true] i.pick-up {
  display: none;
}
.phone-lines .phone-line-pane[deactivated=true] i.close-phone-line {
  float: right;
  display: block;
}
.phone-lines .phone-line-pane[deactivated=true] i.close-phone-line:hover {
  color: red;
}
.phone-lines select.party {
  width: 240px;
  padding: 9px;
}
.phone-lines .new-call {
  width: 100%;
}
.phone-lines i.call {
  font-size: 18px;
  padding: 11.5px;
}
.phone-lines ul {
  margin-bottom: 0;
  padding-left: 0;
}

ul.main-po-tabs li:not(.active) a {
  background-color: transparent !important;
}
ul.main-po-tabs li.active a {
  font-weight: bold !important;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.moo-brand-logo .portal-logo {
  width: 100px;
}
.moo-brand-logo h4 {
  font-size: 1.2rem;
  margin-bottom: 0px !important;
}

.portal-nav {
  height: auto !important;
  border: 1px solid #005EAD;
  border-radius: 5px;
  color: #005EAD;
  padding: 8px !important;
}
.portal-nav:hover {
  color: #005EAD !important;
}

.portal-user-email {
  height: auto !important;
  color: #575962;
}
.portal-user-email:hover {
  color: #575962 !important;
}
.portal-user-email i {
  color: rgb(224, 224, 228) !important;
}

.portal-nav {
  display: none !important;
}

.portal-user-email,
.portal-nav {
  margin-top: 6px !important;
}

@media (min-width: 576px) {
  .portal-user-email,
  .portal-nav {
    display: table !important;
  }
}
@media (min-width: 992px) {
  .portal-user-email,
  .portal-nav {
    margin-top: 15px !important;
    display: table !important;
  }
}
tr.red-row {
  background-color: red;
}
tr.red-row:hover {
  background-color: red !important;
}

.portal-body .refresh-button {
  display: none;
}

/* Job Status Wizard */
.job-status-wizard-titles {
  display: flex;
  margin-bottom: 40px;
  text-align: center;
}

.job-status-wizard-titles .job-status-wizard-title {
  width: 20%;
  font-size: 16px;
}

.job-status-wizard-titles .job-status-wizard-title span {
  padding: 8px;
  border-radius: 10px;
}

.job-status-wizard-titles .job-status-wizard-title.first-step .highlight {
  background: #e5402b;
  color: white;
}

.job-status-wizard-titles .job-status-wizard-title.second-step .highlight {
  background: #ec8321;
  color: white;
}

.job-status-wizard-titles .job-status-wizard-title.third-step .highlight {
  background: #fdf000;
}

.job-status-wizard-titles .job-status-wizard-title.fourth-step .highlight,
.job-status-wizard-titles .job-status-wizard-title.fifth-step .highlight {
  background: #2e8953;
  color: white;
}

.job-status-wizard {
  border-bottom: solid 1px #e0e0e0;
  display: flex;
}

.job-status-wizard .progress {
  cursor: default !important;
}

.job-status-wizard .status-marker {
  position: absolute;
  color: #e2048d;
  z-index: 1;
}

.job-status-wizard .status-marker div {
  width: 100px !important;
}

.job-status-wizard .status-marker div i {
  margin-top: -30px;
  font-size: 40px;
  margin-left: -3px;
}

.job-status-wizard > .job-status-wizard-step {
  padding: 0;
  position: relative;
  width: 20%;
}

.job-status-wizard > .job-status-wizard-step.first-step {
  margin-left: 10%;
}

.job-status-wizard > .job-status-wizard-step > .job-status-wizard-dot {
  position: absolute;
  width: 20px;
  height: 20px;
  display: block;
  margin-top: -34px;
  margin-left: -10px;
  border-radius: 50%;
}

.job-status-wizard > .job-status-wizard-step > .job-status-wizard-dot.last-dot {
  left: 100%;
}

.job-status-wizard > .job-status-wizard-step.first-step > .job-status-wizard-dot,
.job-status-wizard > .job-status-wizard-step.first-step > .progress > .progress-bar {
  background: #e5402b;
}

.job-status-wizard > .job-status-wizard-step.second-step > .job-status-wizard-dot,
.job-status-wizard > .job-status-wizard-step.second-step > .progress > .progress-bar {
  background: #ec8321;
}

.job-status-wizard > .job-status-wizard-step.third-step > .job-status-wizard-dot,
.job-status-wizard > .job-status-wizard-step.third-step > .progress > .progress-bar {
  background: #fdf000;
}

.job-status-wizard > .job-status-wizard-step.fourth-step > .job-status-wizard-dot,
.job-status-wizard > .job-status-wizard-step.fourth-step > .progress > .progress-bar {
  background: #2e8953;
}

.job-status-wizard > .job-status-wizard-step > .progress {
  position: relative;
  border-radius: 0px;
  height: 8px;
  box-shadow: none;
  margin: 20px 0;
}

.job-status-wizard > .job-status-wizard-step > .progress > .progress-bar {
  width: 0px;
  box-shadow: none;
}

.job-status-wizard > .job-status-wizard-step > .progress > .progress-bar {
  width: 100%;
}

.job-status-wizard > .job-status-wizard-step.disabled a.job-status-wizard-dot {
  pointer-events: none;
}

/* Vert Wizard */
.job-status-vert-wizard {
  padding-left: 50px;
}

.job-status-vert-wizard .status-marker {
  position: absolute;
  color: #e2048d;
  z-index: 100;
  font-size: 20px;
  margin-left: -40px;
}

.job-status-vert-wizard .job-status-vert-wizard-step {
  border-left: 3px solid #000000;
  padding: 0px 0px 30px 25px;
}

.job-status-vert-wizard .job-status-vert-wizard-step .job-status-vert-wizard-title {
  font-size: 16px;
  padding: 0px 10px;
  border-radius: 10px;
}

.job-status-vert-wizard .job-status-vert-wizard-step .job-status-vert-wizard-dot {
  position: absolute;
  width: 20px;
  height: 20px;
  display: block;
  margin-top: -8px;
  margin-left: -36px;
  border-radius: 50%;
  background-color: #000000;
}

.job-status-vert-wizard .job-status-vert-wizard-step.first-step {
  border-color: #e5402b;
}

.job-status-vert-wizard .job-status-vert-wizard-step.second-step {
  border-color: #ec8321;
}

.job-status-vert-wizard .job-status-vert-wizard-step.third-step {
  border-color: #fdf000;
}

.job-status-vert-wizard .job-status-vert-wizard-step.fourth-step {
  border-color: #2e8953;
}

.job-status-vert-wizard .job-status-vert-wizard-step.fifth-step {
  border-color: #ffffff;
}

.job-status-vert-wizard .job-status-vert-wizard-step.first-step .job-status-vert-wizard-dot,
.job-status-vert-wizard .job-status-vert-wizard-step.first-step .highlight {
  background-color: #e5402b;
  color: white;
}

.job-status-vert-wizard .job-status-vert-wizard-step.second-step .job-status-vert-wizard-dot,
.job-status-vert-wizard .job-status-vert-wizard-step.second-step .highlight {
  background-color: #ec8321;
  color: white;
}

.job-status-vert-wizard .job-status-vert-wizard-step.third-step .job-status-vert-wizard-dot,
.job-status-vert-wizard .job-status-vert-wizard-step.third-step .highlight {
  background-color: #fdf000;
}

.job-status-vert-wizard .job-status-vert-wizard-step.fourth-step .job-status-vert-wizard-dot,
.job-status-vert-wizard .job-status-vert-wizard-step.fifth-step .job-status-vert-wizard-dot,
.job-status-vert-wizard .job-status-vert-wizard-step.fourth-step .highlight,
.job-status-vert-wizard .job-status-vert-wizard-step.fifth-step .highlight {
  background-color: #2e8953;
  color: white;
}

.info-popover {
  font-size: 14px !important;
  font-weight: 500;
  width: 250px;
  text-align: center;
  padding-bottom: 1px;
  -webkit-filter: blur(0.000001px) !important;
  border: #00acec 2px solid;
  border-radius: 10px;
  background-color: #f2f2f2;
}

.portal-body {
  font-size: 14px !important;
}

.portal-body h3 {
  color: black !important;
  font-size: 20px !important;
}

.portal-body .m-portlet {
  border-radius: 20px !important;
}

.portal-body .form-control {
  border-radius: 15px !important;
}

.portal-body .m-subheader__title {
  font-size: 30px !important;
  font-weight: 900 !important;
  padding-left: 10px !important;
}

.portal-body .m-nav__item {
  font-weight: bold !important;
  padding-bottom: 8px !important;
}

.portal-body .m-nav__item .la-angle-down {
  color: darkgray !important;
}

.portal-body .moo-h4-smaller {
  color: black !important;
}

.portal-nav {
  border-radius: 20px !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
  background: rgba(36, 86, 236, 0.1) !important;
  color: rgb(36, 86, 236) !important;
  border: 0px !important;
  padding-bottom: 8px !important;
}

.portal-nav:hover {
  background: rgba(36, 86, 236, 0.2) !important;
  color: rgb(0, 0, 200) !important;
}

.portal-nav .la {
  /* top: 10px !important; */
  transform: translateY(2px) !important;
  padding-right: 7px !important;
}

.portal-body .m-dropdown__content li {
  margin-top: 10px !important;
}

.portal-body .m-dropdown__content li:first-child {
  margin-top: 0px !important;
}

.portal-body .popover {
  border: 1px solid darkgray !important;
  border-radius: 10px !important;
  filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.2)) !important;
}

.portal-body #m-header-nav {
  /* Doesn't work */
  border: 1px solid black !important;
}

.portal-body input[name=date_from],
.portal-body input[name=value_from] {
  border-top-right-radius: 0px !important;
  border-bottom-right-radius: 0px !important;
}

.portal-body input[name=date_to],
.portal-body input[name=value_to] {
  border-top-left-radius: 0px !important;
  border-bottom-left-radius: 0px !important;
}

/* (On Information, and quotes > View Draft Quote) */
.portal-body .nav-tabs {
  border: 0px !important;
}

.portal-body .nav-tabs .nav-item .nav-link {
  color: black !important;
  border: 1px solid darkgray !important;
  border-radius: 10px !important;
}

.portal-body .nav-tabs .nav-item .active {
  font-weight: bold !important;
}

.portal-body .m-portlet .tab-content {
  margin-top: 10px !important;
  border-radius: 10px !important;
  border: 1px solid darkgray !important;
}

.portal-body .select2-selection {
  border-radius: 15px !important;
}

.portal-body .select2-dropdown {
  border-radius: 15px !important;
}

.portal-body .fa-phone {
  border-radius: 20px !important;
}

.portal-body .btn-primary {
  border-radius: 10px !important;
  background: rgba(15, 69, 231, 0.8) !important;
  font-weight: bold !important;
  border: 0px !important;
}

.portal-body .btn-info {
  border-radius: 10px !important;
  background: rgba(15, 69, 231, 0.8) !important;
  font-weight: bold !important;
  border: 0px !important;
}

.portal-body .btn-info:focus {
  background: rgba(15, 69, 231, 0.8) !important;
}

.portal-body .delivery-con .btn-info {
  background: rgba(15, 69, 231, 0.8) !important;
}

.portal-body .delivery-con .btn-info:focus {
  background: rgba(15, 69, 231, 0.8) !important;
}

.portal-body .btn-secondary {
  border-radius: 10px !important;
  /* font-weight: bold !important; */
}

.portal-body .m-nav__item {
  padding-right: 0px !important;
}

.portal-body .m-nav .m-dropdown {
  /* padding-right: 8px !important; */
}

.portal-body .m-nav .m-dropdown__toggle {
  border: 1px solid #ccc !important;
  border-radius: 15px !important;
  padding: 10px !important;
  padding-left: 13px !important;
  color: #333 !important;
  margin-top: 12px !important;
}

.portal-body .history-title {
  /* On Quotes > View Draft Quote page */
  font-size: 20px !important;
  color: black !important;
  border: 0px !important;
  font-weight: bold !important;
  padding-bottom: 0px !important;
  margin-bottom: 15px !important;
}

.portal-body .image-con,
.portal-body .moo-image {
  border-radius: 10px !important;
}

.portal-body a {
  color: rgb(36, 86, 236) !important;
}

.portal-body .pagination a {
  color: black !important;
  font-weight: bold !important;
}

.portal-body .pagination .active .page-link {
  background: rgba(36, 86, 236, 0.2) !important;
}

.portal-body .pagination .active .page-link {
  color: rgb(36, 86, 236) !important;
}

.portal-body .dropdown-menu {
  border-radius: 10px !important;
  border: 1px solid #eee !important;
}

.portal-body .m-portlet {
  border: 1px solid #eee !important;
}

.portal-body .internal-link.btn {
  color: white !important;
}

.only-vis-portal {
  display: none;
}

.portal-body .invis-for-portal {
  display: none;
}
.portal-body .only-vis-portal {
  display: inline-block;
}
.portal-body .portal-no-pointer-events {
  pointer-events: none;
  color: #6e6e6e;
  background: #f5f5f5;
}
.portal-body .portal-no-pointer-events-2 {
  pointer-events: none;
}

.portal-body .m-subheader {
  margin-left: -37px !important;
}

.portal-body .m-subheader {
  margin-bottom: 10px;
}

.portal-body .btn-info {
  color: white !important;
}

.portal-body .popover {
  line-height: 1.3 !important;
}

.portal-body .portal-information {
  margin-bottom: 20px !important;
}

.select2-container .select2-selection--single .select2-selection__rendered {
  overflow: initial !important;
}

@media (max-width: 768px) {
  .hide-mobile {
    display: none;
  }
}
@media (min-width: 769px) {
  .show-mobile {
    display: none;
  }
}
.product .constraint .col-1, .product .option .col-1 {
  text-align: right;
}
.product .constraint .la-close, .product .option .la-close {
  right: 15px;
  top: 10px;
  position: absolute;
  cursor: pointer;
  font-size: 20px;
  color: tomato;
}
.product .warning-triangle {
  float: left;
  font-size: 20px;
  position: relative;
  top: 10px;
}
.product .moo-form-list {
  list-style: none;
  padding-left: 0px;
}
.product textarea {
  width: 100%;
  height: 150px;
}
.product form[model=Option] textarea {
  min-height: 112px;
}
.product label {
  margin-top: 5px;
}
.product label, .product input {
  display: block;
}
.product input[type=text], .product select {
  width: 100%;
}
.product h5 {
  font-size: 1.1rem;
}
.product .component {
  background-color: #f6f6f6;
  border: 1px solid #e2e2e2;
  padding: 20px;
  margin-bottom: 20px;
}
.product .component-head {
  height: 40px;
}
.product .component-head .menu {
  text-align: right;
}
.product .copy-component, .product .copy-component-to-description {
  font-size: 16px;
  padding: 7px;
  color: black;
}
.product .delete-component {
  font-size: 16px;
  padding: 7px;
  color: black;
}
.product .fold-button {
  font-size: 24px;
  padding: 0px 12px;
}
.product label.pt-5 span {
  margin-top: 3em;
}
.product .option, .product .constraint {
  background-color: #f6f6f6;
  padding: 8px 14px;
  margin-bottom: 20px;
  border: 1px solid #e2e2e2;
}
.product .file-label {
  width: 178px;
  margin-left: 13px;
}
@media (min-width: 1000px) {
  .product .product-file-con {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
}
@media (min-width: 1200px) {
  .product .product-file-con {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33.333%;
    flex: 0 0 33.333%;
    max-width: 33.333%;
  }
}
@media (min-width: 1400px) {
  .product .product-file-con {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
}
@media (min-width: 1600px) {
  .product .product-file-con {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
  }
}

.calculator label {
  margin-top: 20px;
  display: block;
}

.web-feed-table td.live {
  text-align: center;
}
.web-feed-table td.live label {
  top: -10px;
}

.mass-pricing-component-tool .products {
  background-color: #f6f6f6;
  padding: 24px;
  border: 1px solid #e2e2e2;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.modal-iframe {
  width: 60%;
  max-width: unset !important;
}
.modal-iframe iframe {
  margin: 0 25px 20px;
  height: 500px;
}

.modal.send-quote button.confirm:disabled, .modal.send-draft button.confirm:disabled, .modal.send-order button.confirm:disabled {
  cursor: not-allowed;
}

ul.main-enquiries-tabs li:not(.active) a {
  background-color: transparent !important;
}
ul.main-enquiries-tabs li.active a {
  font-weight: bold !important;
}

ul.main-recruitment-form-submissions-tabs li:not(.active) a {
  background-color: transparent !important;
}
ul.main-recruitment-form-submissions-tabs li.active a {
  font-weight: bold !important;
}

.quotes-portlet-outer {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  background-color: #F5F6FA;
  margin-bottom: 8px !important;
}
.quotes-portlet-outer.system:not(.mutable) .m-portlet__head-tools i:not(.la-angle-down) {
  display: none !important;
}
.quotes-portlet-outer.system:not(.mutable) .search-code {
  display: none;
}
.quotes-portlet-outer.system:not(.mutable) input[name=system_name] {
  pointer-events: none;
}
.quotes-portlet-outer.system:not(.mutable) .add-update-buttons {
  display: none;
}
.quotes-portlet-outer.system:not(.mutable) .la-close {
  display: none;
}
.quotes-portlet-outer.system:not(.mutable) .add-text {
  display: none;
}
.quotes-portlet-outer.system:not(.mutable) .add-shape {
  display: none;
}
.quotes-portlet-outer.system:not(.mutable) .text-row .input-group-append {
  display: none;
}
.quotes-portlet-outer.system:not(.mutable) .shape-row .input-group-append {
  display: none;
}
.quotes-portlet-outer.system:not(.mutable) table {
  pointer-events: none;
}
.quotes-portlet-outer.system:not(.mutable) form {
  pointer-events: none;
}
.quotes-portlet-outer .m-portlet__head {
  height: 3.2rem !important;
}
.quotes-portlet-outer .m-portlet__head h3 {
  font-size: 14px !important;
}
.quotes-portlet-outer .m-portlet__head .m-portlet__head-tools li a {
  color: #c3c3c3;
}
.quotes-portlet-outer .m-portlet__head .m-portlet__head-tools li a:hover {
  color: #949494;
}
.quotes-portlet-outer .dimensions-row {
  margin-top: 5px;
  padding-left: 6.3px;
  padding-right: 6.3px;
}
.quotes-portlet-outer .dimensions-row .col-2,
.quotes-portlet-outer .dimensions-row .col-4,
.quotes-portlet-outer .dimensions-row .col-6 {
  padding-right: 2.5px;
  padding-left: 2.5px;
  margin-top: 5px;
}
.quotes-portlet-outer .dimensions-row.options .col-12 {
  padding-right: 2.5px;
  padding-left: 2.5px;
  margin-top: 5px;
}
.quotes-portlet-outer .dimensions-row .input-group > .select2-container--default {
  width: 50% !important;
}
.quotes-portlet-outer .dimensions-row .input-group .s-cap-input {
  border-left-width: 0px;
}
.quotes-portlet-outer .dimensions-row .input-group .s-cap-input:focus {
  border-left-width: 1px;
}
.quotes-portlet-outer .dimensions-row .input-group .shapes-add .input-group-text {
  padding-left: 0.8rem;
  padding-right: 0.8rem;
}
.quotes-portlet-outer .dimensions-row .input-group .w-sections-number,
.quotes-portlet-outer .dimensions-row .input-group .h-sections-number {
  max-width: 45px;
}

.quotes-portlet-inner {
  -webkit-box-shadow: 0px 1px 3px 0px rgb(219, 219, 219);
  -moz-box-shadow: 0px 1px 3px 0px rgb(219, 219, 219);
  box-shadow: 0px 1px 3px 0px rgb(219, 219, 219);
  background-color: #ffffff;
  margin-bottom: 8px !important;
}
.quotes-portlet-inner .m-portlet__head {
  height: 3.2rem !important;
}
.quotes-portlet-inner .m-portlet__head h3 {
  font-size: 14px !important;
}
.quotes-portlet-inner .m-portlet__body {
  padding: 0px;
}
.quotes-portlet-inner .table {
  font-size: 11px;
  margin-bottom: 8px;
}
.quotes-portlet-inner .table .order {
  background-color: #00804F;
  color: #ffffff;
}
.quotes-portlet-inner .table td {
  border-right: 1px solid rgb(224, 224, 228);
  padding: 6px;
}
.quotes-portlet-inner .table .qty-input {
  width: 50px;
  padding: 4px;
}
.quotes-portlet-inner .table .each-input,
.quotes-portlet-inner .table .total-input,
.quotes-portlet-inner .table .vat-input,
.quotes-portlet-inner .table .weight-input,
.quotes-portlet-inner .table .unit-weight-input {
  width: 60px;
  padding: 4px;
}
.quotes-portlet-inner .table .description-input {
  padding: 6px;
  white-space: pre-wrap;
}
.quotes-portlet-inner .table .no-border {
  border-right: none !important;
}
.quotes-portlet-inner .table .no-border .la-close {
  cursor: pointer;
  color: #ff0000 !important;
}
.quotes-portlet-inner .table .no-border .la-close:hover {
  color: #e20000 !important;
}
.quotes-portlet-inner .table .no-border .la-bars {
  cursor: all-scroll;
  color: #00ACEC !important;
}
.quotes-portlet-inner .table .no-border .la-minus-circle {
  cursor: pointer;
  color: #65F96D !important;
}
.quotes-portlet-inner .table .no-border .la-minus-circle:hover {
  color: #5BE262 !important;
}
.quotes-portlet-inner .table .no-border .fa-palette {
  cursor: pointer;
  color: #E4E4E4 !important;
}
.quotes-portlet-inner .table .job-discount-div a,
.quotes-portlet-inner .table .quote-product-image-div a {
  text-decoration: none;
}
.quotes-portlet-inner .table .quote-product-image {
  width: 100px;
  height: 100px;
  object-fit: cover !important;
}
.quotes-portlet-inner .table .quote-product-image-preview {
  object-fit: cover !important;
  width: 35px;
  height: 35px;
}
.quotes-portlet-inner .table .quote-product-image-drop {
  width: 150px;
}

.version-code-head-text span {
  margin-left: 10px;
}

.note-portlet textarea {
  min-height: 61;
}

.textarea-replacement {
  padding: 6px;
  white-space: pre-wrap;
  font-family: sans-serif, Arial;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.25;
  overflow: auto;
  resize: vertical;
}

.textarea-replacement ins {
  background-color: lightgreen;
}

.textarea-replacement del {
  background-color: lightcoral;
}

.delivery-image {
  width: 70px;
  height: 70px;
}

.quotes-total-table {
  margin-bottom: 20px;
}
.quotes-total-table tr th {
  font-weight: normal;
  font-size: 12px;
}
.quotes-total-table tr td {
  font-weight: 500;
  color: #00ACEC;
  padding-left: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
}

.history-title {
  color: #00ACEC;
  border-bottom: 2px solid #00ACEC;
  margin-bottom: 15px;
  padding-bottom: 15px;
}

.copy-version:hover {
  text-decoration: none !important;
}

.options-selects .select2-container {
  width: 100% !important;
}

.edit-quote {
  /* disabled stuff */
}
.edit-quote input.credit-status {
  text-transform: capitalize;
}
.edit-quote .text-row,
.edit-quote .shape-row {
  margin-bottom: 5px;
}
.edit-quote .surcharge[price-type=cost] {
  display: none;
}
.edit-quote span.select2-container--disabled span.select2-selection__rendered {
  background-color: #f4f5f8 !important;
  cursor: default;
}
.edit-quote span.select2-container--disabled span.select2-selection__arrow {
  cursor: default;
  display: none;
}
.edit-quote ul.main-quote-tabs li:not(.active) a {
  background-color: transparent !important;
}
.edit-quote ul.main-quote-tabs li.active a {
  font-weight: bold !important;
}
.edit-quote .quotes-portlet-outer input,
.edit-quote .quotes-portlet-outer button.btn-secondary,
.edit-quote .quotes-portlet-outer .select2-selection {
  border-color: #ddd;
}
.edit-quote .quotes-portlet-outer button.btn-secondary:hover {
  background-color: #f6f6f6;
}
.edit-quote .options .select2-container--default {
  margin-right: 10px;
}
.edit-quote div.item.selected td.order {
  background-color: #778be4;
}
.edit-quote div.item.selected i.edit {
  display: none;
}
.edit-quote div.item[painted=true] i.fa-palette {
  color: #00acec !important;
}
.edit-quote div.item i.edit {
  cursor: pointer;
  color: #778be4;
}
.edit-quote.view-quote {
  /* For Webkit browsers like Chrome */
  /* disable all inputs on view quote page */
}
.edit-quote.view-quote .modal input {
  pointer-events: all !important;
}
.edit-quote.view-quote .modal textarea {
  pointer-events: all !important;
}
.edit-quote.view-quote .modal label.m-checkbox {
  pointer-events: all !important;
  display: block;
}
.edit-quote.view-quote .modal label.m-checkbox span {
  border-color: #009eda !important;
}
.edit-quote.view-quote .modal label.custom {
  margin-top: 20px;
}
.edit-quote.view-quote .modal label.custom input {
  width: 50%;
}
.edit-quote.view-quote .modal div.contacts {
  margin-top: 16px;
}
.edit-quote.view-quote .modal div.form-group {
  margin-top: 16px;
}
.edit-quote.view-quote .modal h6 {
  margin-bottom: 20px;
}
.edit-quote.view-quote .modal h6:not(:first-of-type) {
  margin-top: 25px;
}
.edit-quote.view-quote .modal .copies input.m-input,
.edit-quote.view-quote .modal .summaries input.m-input {
  display: inline;
}
.edit-quote.view-quote .modal .copies input.m-input[type=number],
.edit-quote.view-quote .modal .summaries input.m-input[type=number] {
  width: 60px;
  text-align: center;
  margin-right: 10px;
}
.edit-quote.view-quote .modal .copies input.m-input[type=text],
.edit-quote.view-quote .modal .summaries input.m-input[type=text] {
  width: auto;
  margin-right: 0;
}
.edit-quote.view-quote .quote-notes::-webkit-scrollbar {
  width: 20px; /* Adjust width to your preference */
}
.edit-quote.view-quote .quote-notes {
  overflow-y: scroll;
  scrollbar-width: thin; /* Firefox */
}
.edit-quote.view-quote .quote-notes::-webkit-scrollbar {
  width: 10px; /* Adjust width to your preference */
}
.edit-quote.view-quote .quote-notes::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.5); /* Style of the scrollbar */
  border-radius: 5px; /* Rounded edges */
}
.edit-quote.view-quote .quote-notes::-webkit-scrollbar-track {
  background: transparent;
}
.edit-quote.view-quote input,
.edit-quote.view-quote textarea,
.edit-quote.view-quote span.select2-container span.select2-selection__rendered {
  background-color: #fff !important;
  border-color: #e0e2e6;
  pointer-events: none;
  cursor: default !important;
}
.edit-quote.view-quote .job-status span.select2-container span.select2-selection__rendered {
  pointer-events: all !important;
}
.edit-quote.view-quote .job-status span.select2-selection__arrow {
  display: block !important;
}
.edit-quote.view-quote .job-status button.override-job-status {
  display: block;
}
.edit-quote.view-quote .credit-status-con span.select2-container span.select2-selection__rendered {
  pointer-events: all !important;
}
.edit-quote.view-quote .credit-status-con span.select2-selection__arrow {
  display: block !important;
}
.edit-quote.view-quote button.override-job-status {
  display: none;
}
.edit-quote.view-quote span.select2-container--disabled span.select2-selection__rendered {
  background-color: #fff !important;
}
.edit-quote.view-quote span.select2-container--disabled {
  cursor: default !important;
}
.edit-quote.view-quote span.select2-selection {
  background-color: #fff !important;
  border-color: #e0e2e6 !important;
  pointer-events: none;
}
.edit-quote.view-quote span span.select2-selection__arrow {
  display: none !important;
}
.edit-quote.view-quote label.m-checkbox {
  pointer-events: none;
}
.edit-quote.view-quote label.m-checkbox span {
  background-color: #fff !important;
  border-color: #e0e2e6 !important;
}
.edit-quote.view-quote i.la-close, .edit-quote.view-quote i.la-bars, .edit-quote.view-quote i.la-minus-circle, .edit-quote.view-quote i.edit {
  visibility: hidden;
}
.edit-quote.view-quote i.fa-palette {
  pointer-events: none;
}
.edit-quote.view-quote div.add-update-buttons {
  visibility: hidden;
}
.edit-quote.view-quote button.add-system {
  display: none;
}
.edit-quote.view-quote .paste-system {
  display: none;
}
.edit-quote.view-quote .m-dropdown {
  pointer-events: none;
}

.view-quote .logs .system-history tr[url] {
  cursor: pointer;
}

.edit-quote .dummy {
  width: 100%;
}

.quote-top-bar {
  position: fixed;
  top: 70;
  left: 225;
  right: 300;
  padding: 20px 20px 10px 20px;
  background-color: #fff;
  -webkit-box-shadow: 0px 2px 5px 0px rgb(207, 199, 207);
  -moz-box-shadow: 0px 2px 5px 0px rgb(207, 199, 207);
  box-shadow: 0px 2px 5px 0px rgb(207, 199, 207);
}
.quote-top-bar input {
  padding: 0.5rem 0.75rem !important;
  height: 31px;
}
.quote-top-bar span.select2-selection__rendered {
  padding: 0.5rem 0.75rem !important;
}
.quote-top-bar select.shapes-input .select2-selection {
  border-right: 0;
}
.quote-top-bar .dimensions-row,
.quote-top-bar .search-code.row {
  margin-bottom: 10px;
}

#shape-template,
#text-template {
  display: none;
}

.suggested-lead {
  color: #00ACEC;
}

.view-quote .review {
  text-align: right;
  margin-top: 7px;
}
.view-quote .review i {
  font-size: 2rem;
  cursor: pointer;
}
.view-quote .review .modal textarea {
  pointer-events: all !important;
  cursor: text !important;
}

.review .modal .form-group {
  margin-bottom: 0;
}

.review .modal form {
  margin-bottom: 0;
}

.review .modal textarea {
  min-height: 150px;
}

.edit-quote .logs .quotes-files-table a:hover {
  color: black;
}
.edit-quote .logs tr.status-changed td.content {
  font-weight: bold;
}
.edit-quote .logs .event .feedback {
  visibility: hidden;
  padding: 8px;
  border: 2px solid black;
  border-radius: 4px;
  margin: auto;
  text-align: center;
  position: absolute;
  background-color: white;
}
.edit-quote .logs .event:hover .feedback {
  visibility: visible;
}

.edit-quote .version-history h3.converted {
  color: green !important;
}

tr.old {
  background-color: #eee;
}
tr.old:hover {
  background-color: #eee !important;
}

.edit-quote .review-content {
  padding: 12px;
  margin: 0 12px;
}
.edit-quote .review-content.reject {
  background-color: rgb(226, 110, 110);
  color: white;
}
.edit-quote .review-content.accept {
  background-color: #b7fdbb;
  color: black;
}
.edit-quote .review-content.query {
  background-color: #ffeb88;
  color: black;
}

.edit-quote label[disabled].auto-discounts {
  cursor: default !important;
  pointer-events: none;
}
.edit-quote label[disabled].auto-discounts span {
  border-color: #e0e2e6;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.m-aside-right {
  width: 300px;
  background-color: #504F69 !important;
  padding: 0px;
}
.m-aside-right .ps {
  overflow: visible !important;
}
.m-aside-right .ps .m-scrollable {
  overflow: hidden !important;
}
.m-aside-right .moo-aside-titles {
  color: #ffffff;
  background-color: #3B3B53;
  padding: 5px 8px;
  letter-spacing: 2px;
}
.m-aside-right .moo-aside-titles h6 {
  margin: 5px;
}
.m-aside-right .moo-aside-icon {
  background-color: #3B3B53;
}
.m-aside-right .moo-aside-icon i {
  background-color: #FFEB88;
  color: #000000;
  cursor: pointer;
  font-size: 2.2rem;
}
.m-aside-right .moo-aside-icon i:hover {
  background-color: #F2DF81;
}
.m-aside-right .moo-aside-board {
  height: 350px;
  overflow-y: scroll;
}
.m-aside-right .moo-aside-board-2 {
  height: 320px;
  overflow-y: scroll;
}
.m-aside-right .moo-aside-call {
  padding: 2px 4px;
  border-bottom: 1px solid #A5A4BF;
}
.m-aside-right .moo-aside-call h6 {
  margin-bottom: 0px;
}
.m-aside-right .moo-aside-call p {
  margin-bottom: 0px;
}
.m-aside-right .moo-aside-call-icon {
  cursor: pointer;
}
.m-aside-right .moo-aside-call-icon i {
  font-size: 1.5rem;
}
.m-aside-right .moo-aside-stats {
  text-align: center;
  padding: 4px 0px;
}
.m-aside-right .moo-aside-stats p {
  margin: 0px;
  font-size: 1.3rem;
  font-weight: 400;
}
.m-aside-right .moo-aside-phone-tab {
  background-color: #F5F6FA;
  border-top: 3px solid #A5A4BF;
  cursor: pointer;
}
.m-aside-right .moo-aside-phone-tab p {
  margin: 4px 0;
}
.m-aside-right .moo-aside-phone-tab.active {
  border-top: 3px solid #00ACEC;
}
.m-aside-right .moo-aside-phone-tab:hover {
  background-color: #f0f0f7;
}
.m-aside-right .moo-aside-phone input::-webkit-outer-spin-button, .m-aside-right .moo-aside-phone input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
.m-aside-right .moo-aside-phone i {
  padding: 6px;
  font-size: 1.4rem;
}
.m-aside-right .moo-aside-phone i:hover {
  cursor: pointer;
}
.m-aside-right .moo-save-job .m-input {
  margin-bottom: 20px;
}
.m-aside-right .moo-save-job h6 {
  font-size: 1.15rem;
  margin: 5px 0;
}
.m-aside-right .moo-save-job i {
  font-size: 14px;
  padding: 0 20px 0 4px;
}
.m-aside-right .moo-fwd-call .m-input {
  margin-bottom: 15px;
}
.m-aside-right .moo-fwd-call p {
  border-bottom: 1px solid #F5F6FA;
  padding: 5px 10px;
  margin: 5px;
}
.m-aside-right .moo-fwd-call div div:hover {
  background-color: #F5F6FA;
}
.m-aside-right .moo-aside-chat {
  height: 225px;
  overflow: hidden;
}
.m-aside-right .moo-aside-chat .moo-chat-pic img {
  width: 100%;
  height: auto;
}
.m-aside-right .moo-aside-chat .moo-chat-col {
  padding: 6px 4px;
  border-bottom: 1px solid #A5A4BF;
}
.m-aside-right .moo-aside-chat h6 {
  margin: 0;
}
.m-aside-right .moo-aside-chat p {
  margin-bottom: 0px;
}
.m-aside-right .moo-aside-chat .moo-unread {
  background-color: #F5F6FA;
}
.m-aside-right .moo-aside-chat .moo-read h6 {
  font-weight: 300;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.scanner input.job-number {
  position: absolute;
  opacity: 0;
}
.scanner iframe {
  display: none;
}
.scanner .numpad {
  margin: 10px 0;
}
.scanner .numpad .col-4 {
  padding: 2;
}
.scanner .numpad form {
  width: 100%;
  margin-bottom: 0;
}
.scanner .numpad button {
  width: 100%;
  margin-bottom: 2;
}
.scanner table thead tr {
  background-color: #005ead;
  color: white;
}
.scanner table tbody tr {
  cursor: pointer;
}
.scanner table tbody tr[selected] {
  background-color: #e3f2ff;
}

.scanner-header-tabs a {
  font-size: 1.4rem !important;
}

.scanner-table {
  font-size: 14px !important;
}
.scanner-table .fa-times {
  cursor: pointer;
  color: red;
  font-size: 1.5rem;
}

.scanner-barcode-icon {
  font-size: 5rem;
  opacity: 0.3;
}

.scanner-ready {
  border: 2px dashed rgb(224, 224, 228);
  padding: 20px;
}

.scanner-user-table-div {
  border: 1px solid rgb(224, 224, 228);
  height: 600px;
  padding: 10px;
}

.scanner-status-box, .label-box, .clocking-element-box {
  background-color: #F5F6FA;
  text-align: center;
  padding: 30px 10px;
  cursor: pointer;
}
.scanner-status-box[disabled], .label-box[disabled], .clocking-element-box[disabled] {
  background-color: #ffdddd;
  cursor: default;
}
.scanner-status-box[disabled]:hover, .label-box[disabled]:hover, .clocking-element-box[disabled]:hover {
  background-color: #ffdddd;
}
.scanner-status-box[disabled] h4, .label-box[disabled] h4, .clocking-element-box[disabled] h4 {
  color: #ff7777 !important;
}
.scanner-status-box:hover, .label-box:hover, .clocking-element-box:hover {
  background-color: rgb(224, 224, 228);
}

.scanner-touch-spin .bootstrap-touchspin-down {
  height: 75px !important;
  font-size: 2.5rem !important;
  min-width: 60px !important;
}
.scanner-touch-spin .bootstrap-touchspin-up {
  height: 75px !important;
  font-size: 2.5rem !important;
  min-width: 60px !important;
}
.scanner-touch-spin input {
  text-align: center;
  font-size: 1.5rem !important;
  height: 75px !important;
}

.scanner-ip-image {
  width: 100%;
}

.scanner-nav {
  list-style: none;
  padding-left: 0px;
  font-size: 16px;
  font-weight: 500;
  line-height: 2.5;
  border-right: 2px solid #F5F6FA;
}
.scanner-nav li {
  border-bottom: 2px solid #F5F6FA;
}
.scanner-nav .scanner-link-div {
  padding: 20px 20px;
}
.scanner-nav a {
  text-decoration: none;
}

.post-picker-head-text {
  font-size: 1.8rem !important;
}

.post-picker-diameter-row {
  overflow-y: scroll;
  padding-right: 5px !important;
}

.post-picker-diameter-box {
  cursor: pointer;
  background-color: #F5F6FA;
  padding: 15px;
  font-size: 1.3rem;
  font-weight: 500;
  margin-bottom: 5px !important;
}
.post-picker-diameter-box .fa-chevron-right {
  font-size: 1.5rem;
}

.post-picker-pad-number {
  background-color: #F5F6FA;
  font-size: 1.5rem;
  color: #00ACEC;
  font-weight: 700;
  margin: 5px;
  cursor: pointer;
  text-align: center;
  width: 70px;
  padding: 22px 0;
}
.post-picker-pad-number p {
  vertical-align: middle;
}
.post-picker-pad-number:hover {
  background-color: rgb(224, 224, 228);
}
.post-picker-pad-number i {
  font-size: 1.5rem;
  margin-top: 5px;
}

.post-picker-plusser-button {
  padding: 18px 20px !important;
}

.post-picker-col {
  overflow-y: scroll;
  border: 2px solid rgb(224, 224, 228);
  border-right-width: 0px;
}

.post-picker-length-row {
  padding-top: 10px;
  padding-bottom: 3.5px;
  border: 2px solid #F5F6FA;
  margin-top: 10px;
  margin-left: 1px;
  margin-right: 1px;
}

.post-picker-account-types .active {
  background-color: #F5F6FA;
}

.post-picking-table tr {
  cursor: pointer;
}

.post-picking-table .selected-row {
  background-color: #F5F6FA;
}

.post-picker-account-types .dataTables_wrapper {
  overflow: hidden;
}

.scanner-user-image {
  display: inline-block;
  width: 130px;
  height: 130px;
  background-size: 100%;
  background-repeat: no-repeat;
  position: top;
  margin-right: 15px;
  margin-bottom: 15px;
  border-radius: 50%;
  border: 3px solid #00ACEC;
  cursor: pointer;
}
.scanner-user-image.user-selected {
  box-shadow: 0 2px 20px 0 rgba(0, 0, 0, 0.6);
}

.scanner-info {
  width: 50px;
  height: 50px;
  object-fit: cover;
  position: top;
  font-size: 50px;
}

.scanner-department {
  border-radius: 10px;
  border: 3px solid #00ACEC;
  background-color: rgba(125, 197, 255, 0.479);
}

.scanner-worked-hours {
  border: 4px solid #96CF1D;
}

.scanner-holiday {
  border: 4px solid #FBDE00;
}

.scanner-offsite {
  border: 4px solid #004930;
}

.scanner-lunch {
  border: 4px solid #008C56;
}

.scanner-sick {
  border: 4px solid #E53918;
}

.scanner-medical {
  border: 4px solid #004ABA;
}

.scanner-rota {
  border: 4px solid #00A3D4;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
li.fixed.select2-selection__choice {
  background-color: #ddd !important;
}
li.fixed.select2-selection__choice span {
  display: none !important;
}

button.duration {
  padding-top: 4px;
  padding-bottom: 4px;
  font-weight: 700;
}

.moo-settings-menu-portlet ul {
  margin-bottom: 0px;
  list-style-type: none;
  padding: 0px;
}
.moo-settings-menu-portlet ul li {
  border-bottom: 1px solid #F5F6FA;
  padding: 4px 0;
}
.moo-settings-menu-portlet ul li:last-child {
  border-bottom: 0;
}
.moo-settings-menu-portlet ul li a {
  display: inline;
}
.moo-settings-menu-portlet ul li i {
  display: inline;
  float: right;
  font-size: 1.1rem;
  margin-top: 2px;
}

.moo-history-table i {
  cursor: pointer;
}
.moo-history-table thead {
  font-weight: 500;
  border-bottom: 2px solid #F5F6FA;
  color: #898b96;
  display: block;
  width: 100%;
}
.moo-history-table td {
  padding: 5px 15px;
  width: 150px;
}
.moo-history-table tbody {
  display: block;
  overflow-y: scroll;
  max-height: 150px;
  width: 100%;
}
.moo-history-table .widecol {
  min-width: 300px;
}

.non-account-pass {
  border: solid 0px black;
  font-size: 22px;
  height: 22px;
  width: 100px;
  background-color: transparent !important;
}
.non-account-pass:hover {
  background-color: transparent !important;
}

.moo-settings-portlet .dataTables_length {
  display: none;
}

div.suboption {
  display: flex;
  justify-content: space-between;
  background-color: #F5F6FA;
  padding: 10px;
  margin-bottom: 8px;
}
div.suboption input {
  width: 100%;
}
div.suboption span {
  display: inline-flex;
  width: 70%;
}
div.suboption i {
  padding: 12px;
}
div.suboption i.fa-bars {
  padding-right: 22px;
  cursor: move;
}
div.suboption i.la-close {
  padding-left: 22px;
  cursor: pointer;
}
div.suboption[deleted] {
  display: none;
}

button.add-suboption {
  float: right;
}

.no-outline {
  outline: none;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
ul.moo-form-tab-list.nav.nav-tabs {
  list-style: none;
  border-bottom: 1px solid #ebedf2;
  display: flex;
  flex-wrap: wrap;
  padding-left: 0;
  margin-top: 0;
}
ul.moo-form-tab-list.nav.nav-tabs.double-band-y {
  border-right: 1px solid #ebedf2;
  padding-right: 0;
  flex-direction: column;
}
ul.moo-form-tab-list.nav.nav-tabs.double-band-y li {
  margin-left: 0px;
  width: 100%;
  display: block;
}
ul.moo-form-tab-list.nav.nav-tabs.double-band-y li a {
  text-align: right;
  margin-right: -1px;
  border-top-left-radius: 0.25rem;
  border-top-right-radius: 0;
  border-bottom-left-radius: 0.25rem;
  margin-bottom: 10px;
}
ul.moo-form-tab-list.nav.nav-tabs.double-band-y li a.active {
  border-right-color: transparent;
  border-bottom-color: #ebedf2;
}
ul.moo-form-tab-list.nav.nav-tabs li {
  margin-bottom: -1px;
  margin-left: 5px;
}
ul.moo-form-tab-list.nav.nav-tabs li a {
  color: #6f727d;
  font-weight: 400;
  border: 1px solid transparent;
  border-color: #ebedf2;
  border-top-left-radius: 0.25rem;
  border-top-right-radius: 0.25rem;
  display: block;
  padding: 0.5rem 1rem;
  text-decoration: none;
  background-color: white;
}
ul.moo-form-tab-list.nav.nav-tabs li a.active {
  border-bottom-color: transparent;
  background-color: #F5F6FA;
}
ul.moo-form-tab-list.nav.nav-tabs.inverted li a {
  background-color: #F5F6FA;
}
ul.moo-form-tab-list.nav.nav-tabs.inverted li a.active {
  background-color: white;
}
ul.moo-form-tab-list.nav.nav-tabs li.deactivated a {
  color: red;
}

.declarations .add-tab {
  display: none;
}

.tab-content {
  padding: 20px;
  background-color: #F5F6FA;
  border: 1px solid #ebedf2;
  border-top: 0;
}
.tab-content.inverted {
  background-color: white;
}
.tab-content.double-band {
  border-left: 0;
}

.lds-dual-ring {
  width: 20px;
  height: 20px;
  float: right !important;
  margin-right: 5px !important;
  position: relative;
  bottom: 6px;
}

.lds-dual-ring:after {
  content: " ";
  display: block;
  width: 20px;
  height: 20px;
  margin: 8px;
  border-radius: 50%;
  border: 3px solid grey;
  border-color: grey transparent grey transparent;
  animation: lds-dual-ring 1s linear infinite;
}

@keyframes lds-dual-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.task-scrolling-portlet {
  height: 65%;
  overflow-y: scroll;
}

.moo-task-divider {
  border-bottom: solid 1px rgb(224, 224, 228);
  margin-bottom: 15px;
}

.tasks-list .fa-folder {
  padding-left: 9px !important;
}

.task-user-image {
  width: 50px;
  height: 50px;
  object-fit: cover;
  position: top;
  margin-right: 10px;
  margin-bottom: 10px;
  border-radius: 50%;
  border: 3px solid #00ACEC;
  cursor: pointer;
}
.task-user-image:hover {
  border-color: #FFA7BB;
}
.task-user-image.user-selected {
  border-color: #ff0000;
}

.tasks-radio-con.btn-info:not(:disabled):not(.disabled).active {
  border-color: red !important;
  border-width: 3px;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.moo-notifications h5 {
  text-align: center;
  color: #43425D;
}
.moo-notifications ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.moo-notifications li {
  border-bottom: 1px solid #F5F6FA;
  margin-bottom: 10px;
}
.moo-notifications a {
  font-size: 15px;
}
.moo-notifications p {
  margin-bottom: 5px;
}
.moo-notifications .moo-notif-content {
  width: 80%;
  display: inline-block;
}
.moo-notifications .close-tab {
  float: right;
  margin-top: 6px;
  padding: 2px;
  font-weight: 400;
  line-height: 1;
  cursor: pointer;
  color: #a7a7a7;
}
.moo-notifications .close-tab:hover {
  color: white;
  background-color: #ff0000;
  border-radius: 3px;
}

.moo-profile-menu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.moo-profile-menu a {
  font-size: 15px;
  margin-left: 20px;
  color: #43425D;
}
.moo-profile-menu a:hover {
  color: #3B3B53;
}
.moo-profile-menu #profile-menu-profile {
  font-size: 1.5rem;
  color: #00ACEC;
}
.moo-profile-menu #profile-menu-off {
  font-size: 1.5rem;
  color: #ff0000;
}

.moo-notifications-dropdown {
  max-height: 300px !important;
  overflow-y: hidden !important;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.moo-tabs {
  float: left;
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
  height: 70px;
  width: 70%;
  overflow-y: hidden;
}
.moo-tabs:hover {
  overflow-y: visible;
}
.moo-tabs .m-portlet {
  margin-bottom: 0px;
  box-shadow: none;
  background-color: #F5F6FA;
}
.moo-tabs .m-portlet__head {
  height: auto;
  padding: 0 !important;
}
.moo-tabs .m-portlet .m-portlet__head {
  border: none;
}
.moo-tabs ul {
  margin-top: 22px;
  padding: 0;
  list-style-type: none;
}
.moo-tabs li {
  float: left;
  margin-right: 7px;
  padding: 10px;
  width: 160px;
  border-top: solid 5px #00ACEC;
  background-color: #F5F6FA;
}
.moo-tabs li.active {
  border-top: solid 5px #005EAD;
}
.moo-tabs li div {
  max-width: 112px;
  margin-right: 5px;
  float: left;
}
.moo-tabs li a {
  color: #3d3d3d;
  font-size: 120%;
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.moo-tabs li:hover {
  cursor: pointer;
  background-color: #f0f0f7;
}
.moo-tabs li span.close-tab {
  padding: 2px;
  margin-top: 2px;
  color: #a7a7a7;
  float: right;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
}
.moo-tabs li span.close-tab:hover {
  color: white;
  background-color: #ff0000;
  border-radius: 3px;
}

.popper {
  background-color: white;
  padding-left: 8px;
}
.popper:hover {
  box-shadow: 0px 1px 15px 1px rgba(69, 65, 78, 0.1);
}

.m-portlet--sortable-placeholder {
  visibility: hidden;
}

.ui-sortable-helper .close-tab {
  position: relative;
  bottom: 22px;
}

.tuffnells input.job-number {
  position: absolute;
  opacity: 0;
}
.tuffnells td.checkbox label {
  position: relative;
  bottom: 12;
}
.tuffnells tr.urgent {
  background-color: #f7f6ba;
}

.unknown-scans iframe {
  margin-bottom: 20px;
  width: 100%;
  height: 300px;
}
.unknown-scans label.m-checkbox[disabled] {
  pointer-events: none;
  cursor: not-allowed;
  color: lightgray;
}
.unknown-scans label.m-checkbox[disabled] span {
  background-color: lightgray;
  border-color: gray;
}

/* VARIABLES - COLOR */
/* VARIABLES - COLOR (ICONS) */
/* DARKENS */
.profile-image {
  max-width: 120px;
  max-height: 120px;
  border-radius: 50%;
}

.m-widget4-icon {
  font-size: 1.3rem;
  border-radius: 50%;
  padding: 10px;
  border: solid 1.5px #00ACEC;
}

.staff-profile .permissions label.m-checkbox {
  display: block;
}