/* MediaQuery Breakpoints */
/* Template Components */
/*@heightSidebarUser: 80px;*/
.font-purple {
  color: #9c27b0;
}
.font-primary {
  color: #3f51b5;
}
.font-accent {
  color: #e91e63;
}
.bg-highlight {
  background-color: #e8eaf6;
}
.accent {
  color: #1565C0;
}
.accent-dark {
  color: #0D47A1;
}
.accent-light {
  color: #2196F3;
}
.light {
  color: #E9F0F5;
}
.dark {
  color: #273135;
}
.bg-accent {
  background-color: #1565C0;
}
.bg-accent-dark {
  background-color: #0D47A1;
}
.bg-accent-light {
  background-color: #2196F3;
}
.green {
  color: #449D44;
}
.dark-green {
  color: #000000;
}
.red {
  color: #d9534f;
}
.orange {
  color: #EC971F;
}
.yellow {
  color: #ecc83c;
}
.blue {
  color: #31B0D5;
}
/* Typography Document */
/* Font Sizes */
.font-xs {
  font-size: 0.5em;
}
.font-sm {
  font-size: 0.75em;
}
.font-md {
  font-size: 1em;
}
.font-lg {
  font-size: 1.4em;
}
.font-xl {
  font-size: 2em;
}
/* Font Weights */
.font-thin {
  font-weight: 100;
}
.font-light {
  font-weight: 300;
}
.font-regular {
  font-weight: 400;
}
.font-heavy {
  font-weight: 700;
}
/* Breaks */
.word-break {
  word-wrap: break-word;
}
.md-label-head {
  font-size: 0.76em;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.54);
}
.md-label-head.highlight {
  color: #3f51b5;
}
.label-color {
  color: rgba(0, 0, 0, 0.54);
}
.md-muted {
  color: rgba(0, 0, 0, 0.54);
}
.md-dark-theme .md-label-head {
  font-weight: 500;
  color: rgba(255, 255, 255, 0.87);
}
.md-dark-theme md-autocomplete input {
  color: black;
}
.liparent > ul {
  display: block !important;
}
.taskTabs {
  position: inherit;
  height: 100%;
}
.taskTabs md-tabs-content-wrapper {
  position: relative !important;
  top: 0 !important;
  height: 100%;
}
.taskTabs md-tab-content {
  padding-bottom: 48px;
}
.taskTabs .tasks {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.taskTabs .task {
  height: 60px;
  color: #fafafa;
  background-color: #37474f;
  border-bottom: 1px solid #546e7a;
}
.taskTabs .task.complete {
  color: #90a4ae;
  background-color: #263238;
}
.taskTabs .task.complete .check {
  color: #455a64;
}
.taskTabs .task.complete .description .time {
  color: #607d8b;
}
.taskTabs .task .check {
  cursor: pointer;
  width: 60px;
  height: 59px;
  line-height: 60px;
  font-size: 30px;
  text-align: center;
  color: #546e7a;
  background-color: #263238;
  border-right: 1px solid #546e7a;
}
.taskTabs .task .description {
  padding: 6px;
  float: left;
}
.taskTabs .task .description .time {
  font-size: 0.7em;
  color: #b0bec5;
}
.taskTabs .task .controls {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  overflow: hidden;
  border-left: 1px solid #546e7a;
  background-color: #1565C0;
  transition: width 0.5s;
  width: 10px;
  min-width: 10px;
}
.taskTabs .task .controls.display {
  width: 140px;
}
* {
  box-sizing: border-box;
}
a {
  text-decoration: none;
}
html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
  font-family: "Lato", "Arial", "Helvetica", sans-serif;
  font-size: 1em;
}
html #mainWrapper,
body #mainWrapper {
  height: 100%;
  position: relative;
}
html #mainWrapper > aside,
body #mainWrapper > aside {
  width: 200px;
  height: 100%;
  overflow: hidden;
  transition: width 0.5s ease-in-out, left 0.5s ease-in-out;
}
html #mainWrapper > aside > header,
body #mainWrapper > aside > header {
  width: 100%;
  overflow: visible;
}
html #mainWrapper > aside > header > #sidebarUser,
body #mainWrapper > aside > header > #sidebarUser {
  position: relative;
  height: 70px;
  padding: 4px 20px;
  background-color: #222;
  transition: padding 0.5s ease-in-out;
}
html #mainWrapper > aside > header > #sidebarUser > .icon,
body #mainWrapper > aside > header > #sidebarUser > .icon {
  float: left;
  margin-right: 5px;
}
html #mainWrapper > aside > header > #sidebarUser > .icon img.user-avatar,
body #mainWrapper > aside > header > #sidebarUser > .icon img.user-avatar {
  width: 50px;
  height: 50px;
  margin: 5px 8px;
  border-radius: 25px;
}
html #mainWrapper > aside > header > #sidebarUser > .details,
body #mainWrapper > aside > header > #sidebarUser > .details {
  opacity: 1;
  padding: 12px;
  transition: opacity 0.4s ease-in-out;
}
html #mainWrapper > aside > header > #sidebarUser > .details > .underline,
body #mainWrapper > aside > header > #sidebarUser > .details > .underline {
  padding-bottom: 4px;
  border-bottom: 4px solid #0D47A1;
}
@media only screen and (max-width: 768px) {
  html #mainWrapper > aside > header > #sidebarUser,
  body #mainWrapper > aside > header > #sidebarUser {
    height: 64px;
    padding: 0;
  }
  html #mainWrapper > aside > header > #sidebarUser > .icon,
  body #mainWrapper > aside > header > #sidebarUser > .icon {
    display: none;
  }
  html #mainWrapper > aside > header > #sidebarUser > .details,
  body #mainWrapper > aside > header > #sidebarUser > .details {
    display: block;
    margin: 0;
    height: 64px;
    line-height: 64px;
    text-align: center;
  }
  html #mainWrapper > aside > header > #sidebarUser > .details > span,
  body #mainWrapper > aside > header > #sidebarUser > .details > span {
    display: block;
    margin: 0;
    height: 64px;
    line-height: 59px;
    border: 0;
    padding: 0;
  }
}
html #mainWrapper > aside > header > #sidebarControls,
body #mainWrapper > aside > header > #sidebarControls {
  position: relative;
  height: 64px;
  background-color: #0D47A1;
  z-index: 15;
  overflow: visible;
}
html #mainWrapper > aside > header > #sidebarControls > ul,
body #mainWrapper > aside > header > #sidebarControls > ul {
  margin: 0;
  padding: 0;
}
html #mainWrapper > aside > header > #sidebarControls > ul > li,
body #mainWrapper > aside > header > #sidebarControls > ul > li {
  display: block;
  width: 50%;
  /* 4 Items 25% | 2 Items 50% */
  float: left;
  list-style-type: none;
  line-height: 64px;
  text-align: center;
  font-size: 21.33333333px;
  cursor: pointer;
  color: #1565C0;
  border-left: 1px solid rgba(255, 255, 255, 0.1);
  border-right: 1px solid rgba(0, 0, 0, 0.1);
  transition: all 0.5s ease-in-out;
}
html #mainWrapper > aside > header > #sidebarControls > ul > li:hover,
body #mainWrapper > aside > header > #sidebarControls > ul > li:hover {
  color: #E9F0F5;
  background-color: rgba(0, 0, 0, 0.1);
}
@media only screen and (max-width: 768px) {
  html #mainWrapper > aside > header > #sidebarControls,
  body #mainWrapper > aside > header > #sidebarControls {
    display: none;
  }
}
html #mainWrapper > aside > nav,
body #mainWrapper > aside > nav {
  height: 100%;
  width: 100%;
  overflow: hidden;
}
html #mainWrapper > aside > nav *,
body #mainWrapper > aside > nav * {
  transition: background-color 0.2s ease, border 0.1s ease, opacity 2s ease, margin 2s ease;
}
html #mainWrapper > aside > nav > ul,
body #mainWrapper > aside > nav > ul {
  position: relative;
  height: 100%;
  margin: 0;
  padding: 15px 0;
  background-color: #222;
  overflow-y: auto;
}
html #mainWrapper > aside > nav > ul > li,
body #mainWrapper > aside > nav > ul > li {
  list-style-type: none;
  outline: none;
}
html #mainWrapper > aside > nav > ul > li.section,
body #mainWrapper > aside > nav > ul > li.section {
  padding: 10px 15px;
  margin: 0;
  color: #777;
  text-transform: uppercase;
  font-size: 13px;
  letter-spacing: 2px;
  cursor: default;
}
html #mainWrapper > aside > nav > ul > li > a,
body #mainWrapper > aside > nav > ul > li > a {
  display: block;
  position: relative;
  padding: 15px 25px;
  color: rgba(255, 255, 255, 0.7);
  cursor: pointer;
  white-space: nowrap;
}
html #mainWrapper > aside > nav > ul > li > a.active,
body #mainWrapper > aside > nav > ul > li > a.active {
  border-left: 3px solid #1565C0;
  background-color: rgba(0, 0, 0, 0.6) !important;
}
html #mainWrapper > aside > nav > ul > li > a.active::after,
body #mainWrapper > aside > nav > ul > li > a.active::after {
  opacity: 1;
  border-width: 10px 10px 10px 0;
  top: 16px;
}
html #mainWrapper > aside > nav > ul > li > a.active.parent::after,
body #mainWrapper > aside > nav > ul > li > a.active.parent::after {
  display: none;
}
html #mainWrapper > aside > nav > ul > li > a > i,
body #mainWrapper > aside > nav > ul > li > a > i {
  margin-right: 22px;
}
html #mainWrapper > aside > nav > ul > li > a > span,
body #mainWrapper > aside > nav > ul > li > a > span {
  opacity: 1;
  transition: opacity 0.4s ease-in-out;
}
html #mainWrapper > aside > nav > ul > li > a:after,
body #mainWrapper > aside > nav > ul > li > a:after {
  content: '';
  display: block;
  position: absolute;
  right: 0px;
  top: 26px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0;
  border-color: transparent #E9F0F5 transparent transparent;
  -webkit-transform: rotate(360deg);
  opacity: 0;
  transition: opacity 0.5s ease, border-width 0.5s ease, top 0.5s ease !important;
}
html #mainWrapper > aside > nav > ul > li > ul,
body #mainWrapper > aside > nav > ul > li > ul {
  display: none;
  margin-left: 25px;
  border-left: 1px solid rgba(255, 255, 255, 0.4);
  outline: none;
}
html #mainWrapper > aside > nav > ul > li > ul > li,
body #mainWrapper > aside > nav > ul > li > ul > li {
  position: relative;
  list-style-type: none;
}
html #mainWrapper > aside > nav > ul > li > ul > li > a,
body #mainWrapper > aside > nav > ul > li > ul > li > a {
  display: block;
  padding: 15px 40px;
  font-size: 0.95em;
  color: rgba(255, 255, 255, 0.7);
  margin-left: -3px;
}
html #mainWrapper > aside > nav > ul > li > ul > li > a.active,
body #mainWrapper > aside > nav > ul > li > ul > li > a.active {
  border-left: 3px solid #2196F3;
  background-color: rgba(0, 0, 0, 0.5) !important;
}
html #mainWrapper > aside > nav > ul > li > ul > li > a.active::after,
body #mainWrapper > aside > nav > ul > li > ul > li > a.active::after {
  opacity: 1;
  border-width: 10px 10px 10px 0;
  top: 14px;
}
html #mainWrapper > aside > nav > ul > li > ul > li > a::after,
body #mainWrapper > aside > nav > ul > li > ul > li > a::after {
  content: '';
  display: block;
  position: absolute;
  right: 0px;
  top: 24px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0;
  border-color: transparent #E9F0F5 transparent transparent;
  -webkit-transform: rotate(360deg);
  opacity: 0;
  transition: opacity 0.5s ease, border-width 0.5s ease, top 0.5s ease !important;
}
html #mainWrapper > aside > nav > ul > li > ul > li > a:hover,
body #mainWrapper > aside > nav > ul > li > ul > li > a:hover,
html #mainWrapper > aside > nav > ul > li > ul > li a:focus,
body #mainWrapper > aside > nav > ul > li > ul > li a:focus {
  text-decoration: none;
}
html #mainWrapper > aside > nav > ul > li > ul > li > a::before,
body #mainWrapper > aside > nav > ul > li > ul > li > a::before {
  content: '';
  display: block;
  position: absolute;
  width: 25px;
  background-color: rgba(255, 255, 255, 0.4);
  height: 1px;
  top: 50%;
  left: -3px;
}
html #mainWrapper > aside > nav > ul > li > ul > li > a.active::before,
body #mainWrapper > aside > nav > ul > li > ul > li > a.active::before {
  display: none;
}
html #mainWrapper > aside > nav > ul > li > ul a:hover,
body #mainWrapper > aside > nav > ul > li > ul a:hover {
  text-decoration: none;
  background-color: rgba(0, 0, 0, 0.4);
}
html #mainWrapper > aside > nav > ul > li > .ps-scrollbar-x-rail,
body #mainWrapper > aside > nav > ul > li > .ps-scrollbar-x-rail {
  display: none;
}
html #mainWrapper > main #mainView,
body #mainWrapper > main #mainView {
  overflow: hidden;
  height: 100%;
}
html #mainWrapper > main #mainView .page-content,
body #mainWrapper > main #mainView .page-content {
  height: 100%;
  overflow-y: auto;
}
html #mainWrapper > main #mainView div.container,
body #mainWrapper > main #mainView div.container {
  height: 100%;
}
html #mainWrapper > main #mainView div.toolbar-container,
body #mainWrapper > main #mainView div.toolbar-container {
  position: relative;
  padding: 64px 0 0 0;
  height: 100%;
}
html #mainWrapper > main #mainView div.toolbar-container .page-toolbar,
body #mainWrapper > main #mainView div.toolbar-container .page-toolbar {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  padding: 0 15px;
  height: 65px;
  line-height: 64px;
  background-color: #9c27b0;
}
html #mainWrapper > main #mainView div.toolbar-container .page-toolbar h2,
body #mainWrapper > main #mainView div.toolbar-container .page-toolbar h2 {
  font-size: 1.5em;
  line-height: 64px;
  margin: 0 !important;
  padding: 0 !important;
  color: white;
}
html #mainWrapper > main #mainView div.toolbar-container .page-toolbar .md-button,
body #mainWrapper > main #mainView div.toolbar-container .page-toolbar .md-button {
  border-radius: 0;
}
html #mainWrapper > main #mainView div.toolbar-container .page-toolbar .md-button:last-child,
body #mainWrapper > main #mainView div.toolbar-container .page-toolbar .md-button:last-child {
  margin-right: 0;
}
html ::-webkit-scrollbar-track,
body ::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.2);
  background-color: #F5F5F5;
}
html ::-webkit-scrollbar,
body ::-webkit-scrollbar {
  width: 10px;
  background-color: #F5F5F5;
  width: 4px;
  height: 4px;
}
html ::-webkit-scrollbar-thumb,
body ::-webkit-scrollbar-thumb {
  background-color: #444;
  border: 2px solid #555555;
  border-radius: 4px;
}
md-card {
  box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12);
}
/*#mainPageIndicator {
  animation: none;
  height:3px;
  background-color: #000000;
  display: block;
  position: absolute;
  z-index: 99999;
  top: 0;
  left: 0;
  right: 0;

  &.active {
    animation: pulse-animation 1s infinite;
    animation-timing-function: ease-in-out;
  }

  @keyframes pulse-animation {
    0%, 100% {
      background-color: #000000;
    }
    50% {
      background-color: #8551bf;
    }
  }
}*/
.mono-panel {
  transition: all 0.4s linear;
  border: 1px solid #333333;
  box-shadow: 3px 3px 10px 1px rgba(0, 0, 0, 0.3);
  border-radius: 0px;
  margin-bottom: 15px;
}
.mono-panel.highlight {
  border: 1px solid #255D8D;
  box-shadow: 3px 3px 10px 1px rgba(41, 96, 227, 0.7);
}
.mono-panel.highlight > .header {
  background-color: #255D8D;
}
.mono-panel > .header {
  transition: all 0.4s linear;
  background-color: #333;
  border-bottom: 1px solid #444444;
  min-height: 40px;
  color: #cdcdcd;
  padding: 11px 15px;
}
.mono-panel > .header .icon {
  font-size: 18px;
  margin-right: 10px;
}
.mono-panel > .header .menu {
  float: right;
  margin-right: 5px;
}
.mono-panel > .header .menu > .btn-group {
  margin-top: -6px;
  margin-right: -11px;
}
.mono-panel > .header .menu > .btn-group > .menu-btn {
  padding: 0px 5px;
  font-size: 16px;
}
.mono-panel > .panel-toolbar {
  padding-left: -15px;
  padding-right: -15px;
  background-color: #C3C3C3;
  border-bottom: 1px solid #D1D1D1;
}
.mono-panel > .panel-toolbar > .content {
  padding: 10px 15px;
}
.mono-panel > .panel-body {
  background-color: #ffffff;
}
.mono-panel > .panel-body.no-pad {
  margin: 0;
  padding: 0;
}
.mono-panel-light {
  background-color: #ffffff;
  color: #1c1c1c;
  border: 1px solid #dcdcdc;
  box-shadow: 0px 0px 2px #dcdcdc;
  margin-bottom: 15px;
}
.mono-panel-light > .header {
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 15px;
  padding-bottom: 15px;
}
.mono-panel-light > .header h3 {
  color: #8c8c8c;
  font-size: 18px;
  margin: 0px;
}
.mono-panel-light > .header .icon {
  font-size: 18px;
  margin-right: 10px;
}
.mono-panel-light > .header .menu {
  float: right;
  margin-right: 5px;
}
.mono-panel-light > .header .menu > .btn-group {
  margin-top: -6px;
  margin-right: -11px;
}
.mono-panel-light > .header .menu > .btn-group > .menu-btn {
  padding: 0px 5px;
  font-size: 16px;
}
.mono-panel-light > .panel-body {
  padding: 0px;
  padding-left: 15px;
  padding-right: 15px;
  padding-bottom: 15px;
}
.input-border-btm {
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: 1px solid #CCCCCC !important;
  width: 100%;
  padding: 5px;
}
.mono-widget {
  background-color: #333333;
  border: 1px solid #2d2d2d;
  box-shadow: 3px 3px 10px 1px rgba(0, 0, 0, 0.3);
  padding: 15px;
}
.mono-widget > .icon {
  float: left;
  width: 30%;
  color: #cdcdcd;
  text-align: center;
}
.mono-widget > .icon > span {
  font-size: 60px;
}
.mono-widget > .body {
  float: right;
  width: 69%;
  color: #cdcdcd;
  text-align: left;
  padding: 10px;
}
.mono-widget > .body .title {
  font-weight: 700;
  font-size: 1.2em;
}
.mono-widget > .clear {
  clear: both;
}
ul {
  padding-left: 3px;
}
.mono-flex-list[droppable] {
  min-height: 90px;
}
.mono-flex-list li {
  border-color: #BBB #BBB #BBB #BBB;
  background-color: #F6F6F6;
  border-width: 1px 1px 1px 1px;
  border-style: solid;
  border-image: none;
  border-radius: 0px;
  padding: 3px 3px 3px 10px;
  font-size: 1.2em;
  font-weight: 400;
  list-style: none;
}
.mono-flex-list li a {
  color: #333;
}
.mono-flex-list li a small {
  color: #7A7A7A;
}
.mono-flex-list li a:hover {
  color: #7A7A7A;
}
.mono-panel dir-pagination-controls .pagination .active a {
  color: #FFF;
  cursor: default;
  border-color: #333;
  background-color: #333;
}
.mono-panel dir-pagination-controls .pagination .active a:hover {
  border-color: #333;
  color: #fff;
}
.mono-panel dir-pagination-controls .pagination li a {
  cursor: hand;
  border-color: #BBBBBB;
  color: #333;
}
.mono-panel dir-pagination-controls .pagination li a:hover {
  border-color: #BBBBBB;
  color: #333;
}
li.highlight {
  padding: 2px 0;
  list-style: none;
  text-align: center;
  background-color: #80afe3;
  border-top: solid 1px #306f98;
  border-bottom: solid 1px #306f98;
}
.mono-model {
  width: 100%;
  margin-top: 75px;
  background-color: #ffffff;
  border: 1px solid #333333;
  border-radius: 4px;
}
.mono-model .header {
  background-color: #333333;
  border: 1px solid #333333;
  color: #cdcdcd;
}
.mono-model .header h1,
.mono-model .header h2,
.mono-model .header h3,
.mono-model .header h4,
.mono-model .header h5,
.mono-model .header h6,
.mono-model .header p {
  padding: 15px;
  font-size: 20px;
  padding-right: 50px;
  margin: 0;
}
.mono-model .header .menu {
  float: right;
  padding: 6px;
}
.mono-model .header .menu > .btn.btn-mono {
  background-color: #434343;
  padding-left: 10px;
  padding-right: 10px;
}
.mono-model .header .menu > .btn.btn-mono:hover {
  background-color: #555;
  color: #fff;
}
.mono-model .error {
  padding: 15px;
  background-color: #F9E6E6;
  border-bottom: 1px solid #BEA4A4;
}
.mono-model .gutter {
  background-color: #ededed;
  border-bottom: 1px solid #cdcdcd;
  padding: 15px;
}
.mono-model .sub-header {
  padding: 8px;
  border-bottom: 1px solid #cdcdcd;
  background-color: #f9f9f9;
}
.mono-model .body {
  padding: 15px;
}
.mono-model .body > .content-header:first-child {
  margin: -15px -15px 0 -15px;
  padding: 10px 15px;
  background-color: #337ab7;
  border-bottom: 1px solid #CCCCCC;
  color: #fff;
}
.mono-model .body.no-pad {
  padding: 0;
}
.mono-model .body.no-pad > .content-header:first-child {
  margin: 0;
}
.mono-model .body.no-pad .row.no-gutter {
  margin: 0;
}
.mono-model .footer {
  padding: 8px;
  border-top: 1px solid #cdcdcd;
  background-color: #f9f9f9;
  text-align: right;
}
.mono-model .footer > .btn.btn-mono {
  background-color: #434343;
  padding-left: 10px;
  padding-right: 10px;
  color: #cdcdcd;
}
.mono-model .footer > .btn.btn-mono:hover {
  background-color: #555;
  color: #fff;
}
.mbox-audit-viewer {
  width: auto;
  margin: -15px;
}
.mbox-audit-viewer > .message {
  padding: 20px;
  text-align: center;
}
.mbox-audit-viewer > .error i {
  font-size: 2em;
  padding-bottom: 8px;
}
.mbox-audit-viewer .audit {
  border-bottom: solid 1px #8b8b8b;
}
.mbox-audit-viewer .audit .overview {
  padding: 10px 15px;
  background-color: #f1f1f1;
  vertical-align: middle;
}
.mbox-audit-viewer .audit .overview .message {
  padding: 5px 15px;
}
.mbox-audit-viewer .audit .overview .details {
  text-align: right;
}
.mbox-audit-viewer .audit .targets {
  background-color: #d9e7fe;
}
.mbox-audit-viewer .audit .targets .target .overview {
  border-top: solid 1px #d5d5d5;
  background-color: #E6E6E6;
}
.mbox-audit-viewer .audit .targets .target .properties {
  border-top: solid 1px #d5d5d5;
}
.mbox-audit-viewer .audit .targets .target .properties .property {
  padding: 5px 0;
}
.mbox-audit-viewer .audit .targets .target .properties .property .key {
  display: inline-block;
}
.mbox-audit-viewer .audit .targets .target .properties .property .value {
  display: inline-block;
  padding-left: 10px;
}
.mbox-audit-viewer .audit .targets .target .properties .property.selected {
  background-color: #098ddf;
}
.btn.btn-mono {
  color: #cdcdcd;
  background-color: #434343;
}
.btn.btn-mono:hover {
  background-color: #555;
  color: #fff;
}
.mono-accordion {
  border: 1px solid #333333;
  box-shadow: 3px 3px 10px 1px rgba(0, 0, 0, 0.3);
  border-radius: 0px;
  margin-bottom: 15px;
}
.mono-accordion .page {
  background-color: #FFF;
}
.mono-accordion .page > .header {
  background-color: #333;
  border-bottom: 1px solid #444444;
  min-height: 40px;
  color: #cdcdcd;
  padding: 11px 15px;
}
.mono-accordion .page > .page-content {
  background-color: #ffffff;
  padding: 10px 15px;
}
.tray-item {
  padding: 10px 15px;
  background-color: white;
  border-bottom: 1px solid #b7b7b7;
  color: #555555;
  cursor: pointer;
}
.tray-item:last-child {
  border-bottom: none;
}
.tray-item:first-child {
  border-bottom: 1px solid #b7b7b7;
}
.tray-item .tray-item-detail {
  font-size: 0.8em;
}
.tray-item .tray-item-date {
  font-size: 0.8em;
  line-height: 0.8em;
}
.tray-item.one {
  background-color: #fff9b2;
  color: #4d4d4d;
}
.tray-item.two {
  background-color: #ffca81;
  color: #3d3d3d;
}
.tray-item.three {
  background-color: #ffaf62;
  color: #353535;
}
.tray-item.four {
  background-color: #ff8c6f;
  color: #353535;
}
.tray-item.five {
  background-color: #ff5d5a;
  color: #2d2d2d;
}
.tray-panel.state-hover > .panel-body {
  background-color: #8ea6e3;
}
.tray-panel.state-active > .header {
  background-color: #13192C;
}
.tray-category {
  margin-bottom: 30px;
  margin-left: 15px;
  margin-right: 15px;
  border-style: solid;
  border-width: 1px;
}
.tray-category:last-child {
  margin-bottom: 15px;
}
.tray-category .category-header {
  padding: 10px 20px 2px 20px;
  font-weight: bold;
}
.tray-category .trays-container {
  padding-top: 15px;
  border-top-style: solid;
  border-top-width: 1px;
}
.fade {
  /*used for tray opacity when filtered*/
  opacity: 0.5;
}
.imageFilesContainer {
  vertical-align: top;
}
.imageFilesContainer .imageContainer {
  width: 200px;
  height: 100%;
  margin: 5px;
  display: inline-block;
  vertical-align: top;
}
.imageFilesContainer .imageContainer .container {
  width: 100%;
  padding: 0;
}
.imageFilesContainer .imageContainer .container .image {
  box-shadow: 0 0 3px 0 rgba(87, 87, 87, 0.5);
  background-color: #ffffff;
  border: 1px solid #cdcdcd;
  border-radius: 3px;
  padding: 1px;
  position: relative;
  text-align: center;
}
.imageFilesContainer .imageContainer .container .image > img {
  width: 100%;
  height: auto;
  outline: 0;
}
.imageFilesContainer .imageContainer .container .image > .remove {
  position: absolute;
  font-size: 26px;
  top: 5px;
  right: 5px;
  opacity: 0;
  transition: opacity .5s, color 2s;
  color: #f5f5f5;
  outline: none;
}
.imageFilesContainer .imageContainer .name {
  margin-top: 10px;
  text-align: center;
}
.imageFilesContainer .imageContainer:hover .image > .remove {
  color: #ffffff;
  opacity: 1;
}
.files-view .files-header {
  position: relative;
}
.files-view .files-header .breadcrumbs i {
  color: #424242;
  padding: 0 10px;
}
.files-view .files-header .breadcrumbs i.fa {
  font-size: 0.8em;
}
.files-view .files-header .breadcrumbs .breadcrumb-step {
  color: #303f9f;
}
.files-view .files-header .breadcrumbs .breadcrumb-step:hover {
  color: #1a237e;
}
.files-view .files-header .breadcrumbs .breadcrumb-step.active {
  color: #212121;
}
.files-view .files-header .files-fab {
  position: absolute;
  right: 8px;
  top: 8px;
}
.file.generic p.title {
  padding-left: 20px;
}
.file.generic md-icon {
  font-size: 1.4em;
}
md-list-item.generic.file._md-button-wrap > div.md-button:first-child {
  padding: 8px 16px;
}
.image-responsive {
  width: 100%;
  height: 0;
  padding-bottom: 50%;
  position: relative;
  overflow: hidden;
}
.image-responsive > div.image-wrapper {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
}
.image-responsive > div.image-wrapper > img {
  width: 100%;
  height: 100%;
  object-fit: scale-down;
}
.image-responsive > div.image-wrapper > .content-wrapper {
  width: 100%;
  height: 100%;
}
.image-responsive .image-menu {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  opacity: 0;
  z-index: 2;
  transition: opacity 0.3s;
}
.image-responsive:hover .image-menu {
  opacity: 1;
}
.ratio-1-1 .image-responsive {
  padding-bottom: 100%;
}
.image-contain .image-responsive > div.image-wrapper > img {
  object-fit: contain;
}
.image-cover .image-responsive > div.image-wrapper > img {
  object-fit: cover;
}
.image-fill .image-responsive > div.image-wrapper > img {
  object-fit: cover;
}
.fileManagerContainer {
  border: 1px solid #3F51B5;
  height: 100%;
}
.fileManagerContainer .sidebar {
  border-right: 1px solid #BDBDBD;
  color: #555;
  width: 250px;
}
.fileManagerContainer .sidebar .selected {
  background-color: #dadada;
  border-top: 1px solid #cdcdcd;
  border-bottom: 1px solid #cdcdcd;
}
.fileManagerContainer .files {
  overflow-y: auto;
  background-color: #EEE;
  color: #555;
}
.fileManagerContainer .files .file a {
  margin: 0;
  padding-left: 15px;
  padding-right: 0;
}
.fileManagerContainer .files .file a:hover {
  color: #555;
}
.fileManagerContainer .toolbar {
  border-top: 1px solid #BDBDBD;
  color: #555;
  padding: 10px;
}
.rowContainer .columns > .column {
  background-color: #333;
  color: #cdcdcd;
  padding: 5px;
}
.rowContainer .newStep {
  border: 1px dashed #808080;
  background-color: #fff;
  padding: 15px;
  cursor: pointer;
  outline: none;
  font-size: 16px;
  color: #808080;
  text-transform: uppercase;
  letter-spacing: 2px;
  border-radius: 4px;
}
.rowContainer .newStep:hover {
  background-color: #d9e0e5;
  color: #393939;
}
.rowContainer .workflowLink {
  background-color: #fff;
  border: 1px solid #808080;
  padding: 10px;
}
.rowContainer .workflow-column {
  margin: 0 7px;
}
.rowContainer .workflow-column:first-child {
  margin-left: 0;
}
.rowContainer .workflow-column:last-child {
  margin-right: 0;
}
.rowContainer .arrow-down {
  margin: 5px;
  outline: none;
}
.startingTray {
  border: 1px dashed #808080;
  background-color: #fff;
  padding: 25px;
  cursor: pointer;
  outline: none;
  font-size: 22px;
  color: #808080;
  text-transform: uppercase;
  letter-spacing: 2px;
  border-radius: 4px;
  user-select: none;
}
.startingTray:hover {
  background-color: #e2e2e2;
  color: #393939;
}
.task-sidebar {
  width: 64px;
  height: 100%;
  overflow-x: hidden;
  transition: width 0.5s;
}
.task-sidebar.reveal {
  width: 340px;
}
.task-sidebar .mini-task-list {
  background-color: #222;
  color: white;
  width: 64px;
  max-width: 64px;
  overflow: hidden;
}
.task-sidebar .mini-task-list .md-icon-button {
  margin: 12px;
}
.task-sidebar .main-task-list {
  width: 276px;
  height: 100%;
}
.task .complete-icon {
  margin: 0;
  width: 40px;
  text-align: center;
}
.task .md-list-item-text {
  margin-left: 12px;
}
.user-sidebar {
  width: 64px;
  height: 100%;
  overflow-x: hidden;
  transition: width 0.5s;
}
.user-sidebar.reveal {
  width: 340px;
}
.user-sidebar .head {
  height: 65px;
  background-color: #ba68c8;
  font-size: 1em;
  color: #ffffff;
}
.user-sidebar .mini-user-list {
  background-color: #222;
  color: white;
  width: 64px;
  max-width: 64px;
  overflow: hidden;
}
.user-sidebar .mini-user-list .md-icon-button {
  margin: 12px;
}
.user-sidebar .main-user-list {
  width: 276px;
  height: 100%;
}
.note-display .note .user img {
  width: 50px;
  height: 50px;
  border-radius: 25px;
}
.note-display .note .divider {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 20px 20px 0;
  border-color: transparent #3f51b5 transparent transparent;
}
.note-display .note .bubble > .message {
  color: white;
  background-color: #3f51b5;
  padding: 10px;
  margin-right: 60px;
}
.note-display .note .bubble > .time {
  color: #555;
}
.note-display .note.response .divider {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 20px 20px 0 0;
  border-color: #e44944 transparent transparent transparent;
}
.note-display .note.response .bubble > .message {
  background-color: #e44944;
  margin-right: 0;
  margin-left: 60px;
}
.notes {
  width: 300px;
  border: 1px solid #333;
  background-color: #ffffff;
}
.notes.chat {
  border: none;
  background-color: #fafafa;
}
.notes.chat > .messages .note .bubble > .time {
  color: #777;
}
.notes.chat > .loading-indicator {
  color: white;
}
.notes > note-head > .head {
  background-color: #333;
  color: #fff;
  padding: 5px;
}
.notes > note-head > .head.minimise {
  font-weight: bold;
}
.notes > note-head > .head:hover {
  background-color: #393939;
}
.notes > .messages {
  margin-top: 5px;
  padding: 5px;
  overflow-y: auto;
  overflow-x: hidden;
  min-height: 350px;
}
.notes > .messages .note .user {
  width: 50px;
  height: 50px;
}
.notes > .messages .note .bubble {
  margin-right: 40px;
}
.notes > .messages .note .bubble > .message {
  color: white;
  background-color: #3f51b5;
  word-wrap: break-word;
  padding: 10px;
}
.notes > .messages .note .bubble > .time {
  color: #555;
  text-align: right;
  margin: 1px 0 8px 0;
}
.notes > .messages .note::before {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 20px 20px 0;
  border-color: transparent #3f51b5 transparent transparent;
}
.notes > .messages .note.response .bubble {
  margin-right: 0;
  margin-left: 40px;
}
.notes > .messages .note.response .bubble > .message {
  background-color: #e44944;
}
.notes > .messages .note.response .bubble > .time {
  text-align: left;
}
.notes > .messages .note.response::before {
  content: none;
}
.notes > .messages .note.response::after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 20px 20px 0 0;
  border-color: #e44944 transparent transparent transparent;
}
.notes > .compose {
  padding: 10px 5px;
  border-top: 1px solid #e6e5e5;
  background-color: #ebeaea;
}
.notes > .compose > .note > .bubble {
  margin-left: 5px;
}
.notes > .compose > .note > .bubble > .message {
  color: white;
  background-color: #e44944;
  border: none;
  padding: 10px;
  height: 90px;
  width: 100%;
  resize: none;
  outline: none;
}
.notes > .compose > .note > .bubble > .message::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: white;
}
.notes > .compose > .note > .bubble > .message::-moz-placeholder {
  /* Firefox 19+ */
  color: white;
}
.notes > .compose > .note > .bubble > .message:-ms-input-placeholder {
  /* IE 10+ */
  color: white;
}
.notes > .compose > .note > .bubble > .message:-moz-placeholder {
  /* Firefox 18- */
  color: white;
}
.notes > .compose > .note > .bubble::after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 20px 20px 0 0;
  border-color: #e44944 transparent transparent transparent;
}
.node-element {
  position: absolute;
  /* Make sure events are propagated to the JointJS element so, e.g. dragging works.*/
  pointer-events: none;
  background-color: white;
  border: solid black 1px;
}
.node-element .pointer-enabled {
  pointer-events: all;
}
.node-element.start .node-header {
  background-color: #e91e63 !important;
  height: 38px;
  border-bottom: none;
}
.node-element.logic .node-header {
  background-color: #e91e63;
  height: 38px;
  border-bottom: none;
}
.node-element.value .node-header {
  background-color: #9c27b0;
  height: 38px;
  border-bottom: none;
}
.node-element .node-header {
  background-color: #3f51b5;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.87);
  border-bottom: solid black 1px;
  height: 39px;
  line-height: 39px;
  overflow: hidden;
}
.node-element .node-header span {
  padding: 0 10px;
}
.node-element .node-body {
  color: #212121;
}
.node-element .ports .port {
  height: 40px;
  line-height: 40px;
  padding: 0 5px;
  text-transform: uppercase;
}
.node-element .ports .output {
  text-align: right;
}
.node-element .ports .input {
  text-align: left;
}
.table-view {
  border: 1px solid #E7E7E7;
  border-radius: 4px;
  background-color: #ffffff;
  box-shadow: 0 2px 2px rgba(171, 171, 171, 0.75);
}
.table-view > .header {
  color: #757575;
  border-bottom: 1px solid #E7E7E7;
}
.table-view > .header .header {
  color: #212121;
  padding: 10px 15px;
  background-color: #F5F5F5;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
.table-view > .header .th {
  padding: 3px 8px;
}
.table-view > .header .th > .headItem {
  padding: 10px;
  font-weight: bold;
}
.table-view > .content {
  color: #212121;
}
.table-view > .content .tableRow {
  color: #212121;
  border-bottom: 1px solid #E7E7E7;
  padding: 0 8px;
}
.table-view > .content .tableRow:hover {
  background-color: #EEEEEE;
}
.table-view > .footer {
  background-color: #F5F5F5;
  border-top: 1px solid #E7E7E7;
  padding: 8px 15px;
  color: #757575;
}
.priceBreak {
  border-radius: 2px;
  border: 1px solid #3f51b5;
}
.priceBreak .column {
  border-right: 1px solid #5c6bc0;
  min-width: 100px;
}
.priceBreak .column.header {
  color: rgba(255, 255, 255, 0.87);
  background-color: #3f51b5;
}
.priceBreak .column.highlight {
  background-color: #e3f2fd;
}
.priceBreak .cell {
  height: 3em;
}
.priceBreak .cell.warn {
  background-color: #ffc3c3;
}
.priceBreak .border {
  border-bottom: 1px solid #5c6bc0;
}
.priceBreak input {
  width: 100px;
  padding-left: 10px;
  margin: 0;
  border: none;
  background: none;
}
.md-dark-theme .priceBreak {
  background-color: #F5F5F5;
  color: rgba(0, 0, 0, 0.87);
}
.swatch {
  height: 100px;
  width: 120px;
  border: 1px solid #cdcdcd;
  border-radius: 3px;
  position: relative;
}
.swatch .view {
  border-right: 1px solid #cdcdcd;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  background-color: #ebebeb;
}
.swatch .view > i {
  color: #cdcdcd;
}
.swatch .view > img {
  width: 100%;
  height: 100%;
}
.swatch .dropdown {
  padding: 5px;
  background-color: #ffffff;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  outline: none;
}
.swatch .drop {
  position: absolute;
  left: 108%;
  top: 0;
  background-color: #ffffff;
  border: 1px solid #cdcdcd;
  border-radius: 3px;
  z-index: 9;
  width: 220px;
  word-wrap: break-word;
}
.swatch .drop .option {
  padding: 5px;
  text-align: center;
  outline: none;
}
.swatch .drop .option.active {
  background-color: #cdcdcd;
}
.swatch .drop .option:active {
  background-color: #cdcdcd;
}
.swatch .drop .option:hover {
  background-color: #e6e6e6;
}
.swatch .drop .upload {
  background-color: #f5f5f5;
  border: 1px solid #ebebeb;
  border-radius: 3px;
  padding: 8px;
}
.swatch .drop .upload:hover {
  background-color: #ebebeb;
  border: 1px solid #f5f5f5;
}
.badges .badgeContainer {
  background-color: #ffffff;
  border: 1px solid #e1e1e1;
  padding: 8px;
  margin: 3px;
  float: left;
}
.badges .badgeContainer .badgeIcon {
  height: 50px;
  background-repeat: no-repeat;
}
.badges .badgeContainer .badgeIcon.powder_coated {
  background-image: url('../image/badge/PowderCoated.png');
  background-size: cover;
  width: 50px;
}
.badges .badgeContainer .badgeIcon.buy_back_scheme {
  background-image: url('../image/badge/BuyBackScheme.png');
  background-size: cover;
  width: 50px;
}
.badges .badgeContainer .badgeIcon.customisable {
  background-image: url('../image/badge/Customisable.png');
  background-size: cover;
  width: 50px;
}
.badges .badgeContainer .badgeIcon.made_in_uk {
  background-image: url('../image/badge/madeinUK.png');
  background-size: cover;
  width: 94px;
}
.badges .badgeContainer .badgeIcon.same_day_delivery {
  background-image: url('../image/badge/SameDayDelivery.png');
  background-size: cover;
  width: 68px;
}
.badges .badgeContainer .badgeIcon.in_house_manufactured {
  background-image: url('../image/badge/InHouseManufactured.png');
  background-size: cover;
  width: 50px;
}
.badges .badgeContainer .badgeIcon.click_and_collect {
  background-image: url('../image/badge/ClickandCollect.png');
  background-size: cover;
  width: 50px;
}
.badges .badgeContainer .badgeIcon.hire {
  background-image: url('../image/badge/hire.png');
  background-size: cover;
  width: 55px;
}
.badges .badgeContainer .badgeIcon.in_stock {
  background-image: url('../image/badge/InStock.png');
  background-size: cover;
  width: 62px;
}
.sidenav-wrapper .sidenav {
  height: 100%;
  width: 250px;
}
.sidenav-wrapper .sidenav.minimise {
  width: 60px;
}
.sidenav-wrapper .sidenav.minimise.selected {
  width: 80px;
}
.sidenav-wrapper .sidenav > .head {
  height: 70px;
  background-color: #1565C0;
  font-size: 1em;
  color: rgba(255, 255, 255, 0.98);
}
.sidenav-wrapper .sidenav > .head > i {
  padding: 0 10px;
}
.sidenav-wrapper .sidenav > .list {
  background-color: #243150;
}
.sidenav-wrapper .sidenav > .list > .section {
  width: 100%;
}
.sidenav-wrapper .sidenav > .list > .section > .title {
  color: #cdcdcd;
  font-weight: 300;
  text-transform: uppercase;
  width: 100%;
  text-align: center;
  margin: 15px 0 5px 0;
}
.sidenav-wrapper .sidenav > .list .item {
  width: 100%;
  word-wrap: break-word;
  padding: 5px 0;
  color: #cdcdcd;
}
.sidenav-wrapper .sidenav > .list .item:hover {
  background-color: #202641;
}
.sidenav-wrapper .sidenav.users > .list .item.selected::after {
  content: '';
  width: 0;
  height: 0;
  flex: 1;
  border-style: solid;
  border-width: 15px 15px 15px 0;
  border-color: transparent #121523 transparent transparent;
}
.sidenav-wrapper .sidenav.users > .list .item.selected:hover {
  background-color: transparent;
}
.sidenav-wrapper .sidenav.tasks {
  width: 500px;
}
.sidenav-wrapper .sidenav.tasks.minimise {
  width: 60px;
}
.sidenav-wrapper .chat-container {
  height: 100%;
  transition: width 0.6s;
  width: 0;
  overflow-x: hidden;
}
.sidenav-wrapper .chat-container.active {
  width: 300px;
}
.codeEditor {
  height: 100%;
  background-color: #ffffff;
  border: 1px solid #cdcdcd;
  /*border-top-left-radius: 5px;
  border-top-right-radius: 5px;*/
  color: #333333;
}
.codeEditor > .header {
  padding: 10px;
  background-color: #f0f0f0;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom: 1px solid #cdcdcd;
}
.codeEditor > .setting {
  background-color: #fcfcfc;
  border-bottom: 1px solid #cdcdcd;
}
.codeEditor .padding10 {
  padding: 10px;
}
.previewFrame {
  border: 0;
  outline: none;
}
.buttonSelection {
  height: 40px;
  line-height: 40px;
  border-radius: 2px;
  border: none;
  width: 100%;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12);
  background-color: #fff;
}
.buttonSelection > .option {
  border-right: 1px solid #cdcdcd;
  text-transform: uppercase;
  color: #333333;
  padding: 0 15px;
  text-align: center;
  font-size: 14px;
  cursor: pointer;
  outline: none;
}
.buttonSelection > .option:first-child {
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px;
}
.buttonSelection > .option:last-child {
  border-right: none;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
}
.buttonSelection > .option.overdue {
  background-color: #ff5722;
  color: #fff;
}
.buttonSelection > .option.selected {
  background-color: #2196f3;
  color: #fff;
}
.address-display {
  margin: 0;
  padding: 8px;
  width: 100%;
}
.address-display .address {
  float: left;
  text-align: left;
  line-height: 1.4em;
}
.address-display .edit {
  color: #3f51b5;
  float: right;
  text-align: right;
  line-height: 1.4em;
  opacity: 0;
  transition: opacity 0.25s;
}
.address-display:hover .edit {
  opacity: 1;
}
.address-display .clear {
  clear: both;
}
.product-selector .bundled-items .bundled-item {
  padding: 0 0 8px 0;
}
.product-selector .bundled-items .bundled-item .bundled-item-text h3 {
  font-size: 1em;
  font-weight: 500;
  padding: 0;
  margin: 0;
}
.product-selector .bundled-items .bundled-item .bundled-item-text p {
  font-size: 0.9em;
  color: rgba(0, 0, 0, 0.54);
  padding: 2px 0 0 0;
  margin: 0;
}
.product-selector .bundled-items .bundled-item .bundled-item-quantity {
  padding-left: 16px;
  min-width: 440px;
}
.product-selector .bundled-items .bundled-item .bundled-item-quantity small {
  color: rgba(0, 0, 0, 0.54);
  padding-right: 8px;
}
.quote-item {
  border-bottom: 1px dashed #8e8e8e;
  padding-bottom: 8px;
}
.quote-item .details {
  font-size: 0.9em;
  color: #3f51b5;
}
.quote-item .details .discount {
  text-align: left;
}
.sidebar {
  width: 300px;
}
.sidebar .sidebar-items .sidebar-item {
  height: 48px;
  margin-right: -4px;
}
.sidebar .sidebar-items .sidebar-item.selected {
  background-color: #c5cae9;
}
.color-picker-wrapper .color-picker-panel.color-picker-panel-left {
  width: 175px;
  left: 0;
}
.permission-disabled {
  background-color: #f5f5f5;
  color: #8b8b8b;
}
.permission-disabled .md-font {
  color: #8b8b8b;
}
.nonMember {
  opacity: 0.5;
}
.history-container {
  position: relative;
}
.history-container .history-panel {
  position: absolute;
  right: 0;
  bottom: 0;
  top: 0;
  width: 0;
  transition: 0.3s width;
  background-color: white;
  z-index: 11;
  overflow-x: hidden;
}
.history-container .history-panel .history-panel-content {
  height: 100%;
  width: 300px;
  min-width: 300px;
  max-width: 300px;
}
.history-container .history-panel .history-panel-content .selected-revision {
  background-color: #bbdefb;
}
.history-container .history-panel .history-panel-content .selected-revision:hover {
  background-color: #bbdefb;
}
.history-container .overlay {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: #212121;
  transition: 0.3s opacity;
  opacity: 0;
  z-index: 10;
  cursor: auto;
}
.history-container .overlay.hide {
  z-index: -1;
}
.history-container.active .history-panel {
  width: 300px;
}
.history-container.active .overlay {
  opacity: 0.48;
}
.revision-panel {
  z-index: 1;
  width: 100%;
  margin: 0;
  border-radius: 0;
  padding: 6px 12px;
}
.user-select-custom-avatar {
  height: 60px;
  width: 60px;
  border-radius: 50px;
}
.group-avatar {
  height: 60px;
  border-radius: 50px;
  max-width: 60px;
  line-height: 60px;
  font-size: 2em;
  width: 60px;
  overflow: hidden;
}
.md-contact-suggestion img {
  vertical-align: top;
}
.user-select-subtext {
  word-wrap: break-word;
  color: #90a4ae;
}
.bg {
  background-color: #88bbff;
}
.user-select-card-title-text {
  text-align: left;
  margin-left: 10px;
}
.margin20 {
  margin: 20px 20px;
}
.workflow-step {
  border: 1px solid #222222;
}
.workflow-step > .header {
  background-color: #333333;
  color: #cdcdcd;
  font-size: 18px;
  padding: 7px 15px;
}
.workflow-step .addTask {
  text-align: center;
  color: #666;
  font-size: 14px;
  padding: 6px;
  outline: none;
  border: 0;
}
.workflow-step .addTask:hover {
  color: #333333;
  background-color: #f3f3f3;
}
.workflow-step ul.workflowSubtasks {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.workflow-step ul.workflowSubtasks li {
  border-bottom: 1px solid #cdcdcd;
  outline: none;
}
.workflow-step ul.workflowSubtasks li:hover {
  background-color: #ececec;
}
.workflow-step .duration {
  background-color: #EAEAEA;
  border-left: 1px solid #999999;
  border-bottom: 1px solid #999999;
  border-bottom-left-radius: 5px;
  padding: 5px;
}
.md-solid {
  height: 40px;
  line-height: 40px;
  border-radius: 2px;
  border: none;
  width: 100%;
  color: black;
  padding: 0 15px;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12);
}
.grey-border {
  border: 1px solid #ccc;
}
.md-dialog-fullscreen {
  max-width: 100%;
  max-height: 100%;
  width: 100%;
  height: 100%;
  border-radius: 0;
}
.md-solid .md-select-value :first-child {
  color: black;
}
.md-select-menu-container .md-dark-theme {
  padding: 0px 0px;
}
.side-bar {
  border-right: 2px solid #777;
}
.side-bar .search-panel {
  padding: 15px;
  background-color: #eaeaea;
  border-bottom: 2px solid #777;
}
.side-bar .active-list-item {
  background-color: #cecece;
}
.side-bar .list-body {
  height: 100%;
  overflow: hidden;
  overflow-y: scroll;
  background-color: #FFF;
}
.custom-chip {
  display: inline-block;
  font-size: 14px;
  padding: 0px 12px;
  margin: 8px 8px 0 0;
  border-radius: 16px;
  line-height: 32px;
}
.custom-avatar {
  display: block;
  height: 100px;
  margin-right: 10px;
  border-radius: 50px;
}
.responsive-avatar {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.md-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
}
.tcc-check {
  display: inline-block;
  margin: 0;
  max-width: 20px;
  max-height: 20px;
  background-color: white;
  border-radius: 2px;
}
.tcc-check .md-icon {
  color: black;
  border-color: black;
  background-color: white;
}
.tcc-checkbadge {
  border-width: 1px;
  border-style: solid;
  padding: 6px 15px;
  border-radius: 50px;
  line-height: 18px;
  z-index: -10;
}
.tcc-checkbadgebottom {
  border-width: 1px;
  border-style: solid;
  padding: 0px 15px;
  border-radius: 50px;
  line-height: 18px;
  z-index: 10;
}
.tcc-transition {
  -webkit-transition: opacity 0.5s;
  /* Safari */
  transition: opacity 0.5s;
}
.tcc-arrow-container {
  position: absolute;
  text-align: center;
  line-height: 0;
  top: 100%;
  left: 0;
  right: 0;
}
.tcc-arrow-container2 {
  position: absolute;
  padding-left: 50px;
  line-height: 0;
  top: 100%;
  left: 0;
  right: 0;
}
.tcc-arrowUp {
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid;
  opacity: 0;
  display: inline-block;
}
.tcc-inactive {
  opacity: 0.6;
}
.authentication-form {
  width: 100%;
  margin: 0em auto;
  padding: 3em 2em 2em 2em;
  background: #fafafa;
  border: 1px solid #ebebeb;
  box-shadow: rgba(0, 0, 0, 0.14902) 0px 1px 1px 0px, rgba(0, 0, 0, 0.09804) 0px 1px 2px 0px;
}
.authentication-form .group {
  display: flex !important;
  position: relative;
  margin-bottom: 45px;
}
.authentication-form .group .input-error {
  color: red;
  font-size: 15px;
  display: block;
  position: absolute;
  bottom: -50%;
}
.authentication-form .group h3 {
  color: #505160;
  font-size: 16px;
  font-weight: bold;
}
.authentication-form .group h3:hover {
  color: #9B9CAB;
}
.authentication-form .group h3:visited,
.authentication-form .group h3:link,
.authentication-form .group h3:active {
  text-decoration: none !important;
}
.authentication-form .group label {
  color: #999;
  font-size: 18px;
  font-weight: normal;
}
.authentication-form .group input {
  font-size: 18px;
  -webkit-appearance: none;
  display: block;
  background: #fafafa;
  color: #636363;
  width: 100%;
  border: none;
  border-radius: 0;
  border-bottom: 1px solid #B9B9B9;
}
.authentication-form .button {
  position: relative;
  display: inline-block;
  padding: 12px 24px;
  margin: .3em 0 1em 0;
  width: 100%;
  vertical-align: middle;
  color: #fff;
  font-size: 16px;
  line-height: 20px;
  -webkit-font-smoothing: antialiased;
  text-align: center;
  letter-spacing: 1px;
  background: #3c3c3c;
  border: 0;
  cursor: pointer;
  transition: all 0.15s ease;
}
.authentication-form .button:focus {
  outline: 0;
}
.authentication-form .buttonBlue {
  background: #505160;
  text-shadow: 1px 1px 0 rgba(39, 110, 204, 0.5);
}
.authentication-form .buttonBlue .fa {
  color: #D49F75;
}
.authentication-form .buttonBlue:hover {
  background: #6F707F !important;
}
.auth-controller {
  height: 100%;
  background-color: #19212f;
}
.login-controller .error-message {
  text-align: center;
  padding: 10px;
  background-color: #ffc8c8;
  border-bottom: 1px solid #c39d9d;
  color: #ca0b0b;
}
.verify-controller .verify-email {
  margin: 10px 0;
  padding: 10px;
  border: 1px solid #a7aed4;
  background-color: #c7cdef;
  border-radius: 3px;
}
.tenant-controller .error-message {
  text-align: center;
  padding: 10px;
  background-color: #ffc8c8;
  border-bottom: 1px solid #c39d9d;
  color: #ca0b0b;
}
.tenant-controller .tenant-users {
  border: 1px solid #5a5a5a;
}
.tenant-controller .tenant-users .tenant-users-add {
  padding: 0 10px;
  color: rgba(255, 255, 255, 0.87);
  background-color: #3f51b5;
  border-bottom: 1px solid #5a5a5a;
}
.tenant-controller .tenant-users .tenant-users-list {
  padding: 0;
  margin: 0;
  list-style: none;
}
.tenant-controller .tenant-users .tenant-users-list > li {
  padding: 10px;
  border-bottom: 1px solid #cecece;
}
.tenant-controller .company-invite {
  padding: 15px;
  margin-top: 15px;
  background-color: #fefefe;
  border: 1px solid #7b7b7b;
}
.quote-address-display {
  border: 1px solid #CCC;
  padding: 0;
  height: 100%;
}
.quote-address-display > .title {
  background-color: #EEE;
  border-bottom: 1px solid #CCC;
  padding: 5px 20px;
}
.quote-address-display > .body {
  padding: 5px 20px;
}
.quote-address-display > .body > .name-line {
  font-weight: bold;
  font-size: 0.9em;
}
.quote-address-display .kit-items {
  font-size: 0.9em;
}
.quote-address-display .kit-items > .kit-header {
  padding-top: 8px;
  color: rgba(0, 0, 0, 0.54);
}
.quote-address-display .kit-items > .kit-contents .kit-item {
  padding: 8px 0;
}
.quote-address-display .kit-items > .kit-contents .kit-item .kit-item-per-quantity {
  color: #8e8e8e;
}
.quote-address-display .quote-total .quote-total-subtotal {
  font-size: 1.1em;
}
.quote-address-display .quote-total .quote-total-vat {
  color: #e91e63;
  font-size: 0.9em;
}
.quote-address-display .quote-total .quote-total-total {
  color: #757575;
  font-size: 0.9em;
}
.quotes-controller .custom-chip {
  display: inline-block;
  font-size: 14px;
  padding: 0px 12px;
  margin: 0px 8px 0 0;
  border-radius: 16px;
  line-height: 32px;
  text-align: center;
}
.quotes-controller .default {
  background-color: #D4D4D4;
  border: 1px solid #BBB;
}
.quotes-controller .error {
  color: #A94442;
  background-color: #F2DEDE;
  border: 1px solid #A94442;
}
.quotes-controller .success {
  color: #3c763d;
  background-color: #dff0d8;
  border: 1px solid #3c763d;
}
.quotes-controller .quote-list .quote-list-item {
  border-bottom: 1px solid #eaeaea;
}
.quotes-controller .quote-list .quote-list-item .quote-list-item-text {
  line-height: 1em;
  padding: 16px 0;
}
.quotes-controller .quote-list .quote-list-item .quote-list-item-text .quote-list-item-id {
  font-size: 1.1em;
  padding-bottom: 8px;
}
.quotes-controller .quote-list .quote-list-item .quote-list-item-text .quote-list-item-customer {
  color: rgba(0, 0, 0, 0.54);
  font-size: 0.9em;
}
.salesAdmin {
  background-color: #f0f0f0;
}
.salesAdmin .list {
  border: 1px solid #cdcdcd;
  border-radius: 4px;
  background-color: #ffffff;
  margin-bottom: 15px;
}
.salesAdmin .list > .item {
  padding: 6px 6px 6px 12px;
  border-bottom: 1px solid #cdcdcd;
  min-height: 65px;
}
.salesAdmin .list > .item:last-child {
  border-bottom: 0;
}
.select-address-dialog .address-list .address-card .md-button {
  line-height: 1.6em;
}
.select-address-dialog .address-list .address-card .md-button h2 {
  font-size: 1.1em;
  font-weight: bold;
  margin-top: 0;
  margin-bottom: 8px;
}
md-toast.md-center {
  left: 50%;
  transform: translate3d(-50%, 0, 0);
}