﻿@charset "UTF-8";
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  border: 0;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
  font-weight: inherit;
  font-style: inherit;
  font-size: 13px;
  font-family: Roboto, Arial;
}

a:active {
  outline: none;
}

a:focus {
  outline: none;
  -moz-outline-style: none;
}

html {
  position: relative;
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

form {
  height: 100%;
  width: 100%;
}

.row12 {
  margin-left: auto;
  margin-right: auto;
  padding: 0 5px 0 5px;
}

.row12-flex {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.row12:after {
  content: "";
  display: table;
  clear: both;
}

.row12 .col {
  float: left;
  box-sizing: border-box;
  padding: 0;
  min-height: 1px;
  position: relative;
  padding: 5px;
}

.row12-flex .col {
  box-sizing: border-box;
  padding: 0;
  min-height: 1px;
  position: relative;
  float: none;
  margin-left: 0 !important;
}

.row12 .col[class*=push-], .row12 .col[class*=pull-] {
  position: relative;
}

.row12 .col.l1 {
  width: 8.3333333333%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row12 .col.l2 {
  width: 16.6666666667%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row12 .col.l3 {
  width: 25%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row12 .col.l4 {
  width: 33.3333333333%;
  left: auto;
  right: auto;
}

.row12 .col.l5 {
  width: 41.6666666667%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row12 .col.l6 {
  width: 50%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row12 .col.l7 {
  width: 58.3333333333%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row12 .col.l8 {
  width: 66.6666666667%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row12 .col.l9 {
  width: 75%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row12 .col.l10 {
  width: 83.3333333333%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row12 .col.l11 {
  width: 91.6666666667%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row12 .col.l12 {
  width: 100%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row12-flex .col.l1 {
  flex: 0 0 8.3333333333%;
}

.row12-flex .col.l2 {
  flex: 0 0 16.6666666667%;
}

.row12-flex .col.l3 {
  flex: 0 0 25%;
}

.row12-flex .col.l4 {
  flex: 0 0 33.3333333333%;
}

.row12-flex .col.l5 {
  flex: 0 0 41.6666666667%;
}

.row12-flex .col.l6 {
  flex: 0 0 50%;
}

.row12-flex .col.l7 {
  flex: 0 0 58.3333333333%;
}

.row12-flex .col.l8 {
  flex: 0 0 66.6666666667%;
}

.row12-flex .col.l9 {
  flex: 0 0 75%;
}

.row12-flex .col.l10 {
  flex: 0 0 83.3333333333%;
}

.row12-flex .col.l11 {
  flex: 0 0 91.6666666667%;
}

.row12-flex .col.l12 {
  flex: 0 0 100%;
}

.row12 .col.offset-l1 {
  margin-left: 8.3333333333%;
}

.row12 .col.pull-l1 {
  right: 8.3333333333%;
}

.row12 .col.push-l1 {
  left: 8.3333333333%;
}

.row12 .col.offset-l2 {
  margin-left: 16.6666666667%;
}

.row12 .col.pull-l2 {
  right: 16.6666666667%;
}

.row12 .col.push-l2 {
  left: 16.6666666667%;
}

.row12 .col.offset-l3 {
  margin-left: 25%;
}

.row12 .col.pull-l3 {
  right: 25%;
}

.row12 .col.push-l3 {
  left: 25%;
}

.row12 .col.offset-l4 {
  margin-left: 33.3333333333%;
}

.row12 .col.pull-l4 {
  right: 33.3333333333%;
}

.row12 .col.push-l4 {
  left: 33.3333333333%;
}

.row12 .col.offset-l5 {
  margin-left: 41.6666666667%;
}

.row12 .col.pull-l5 {
  right: 41.6666666667%;
}

.row12 .col.push-l5 {
  left: 41.6666666667%;
}

.row12 .col.offset-l6 {
  margin-left: 50%;
}

.row12 .col.pull-l6 {
  right: 50%;
}

.row12 .col.push-l6 {
  left: 50%;
}

.row12 .col.offset-l7 {
  margin-left: 58.3333333333%;
}

.row12 .col.pull-l7 {
  right: 58.3333333333%;
}

.row12 .col.push-l7 {
  left: 58.3333333333%;
}

.row12 .col.offset-l8 {
  margin-left: 66.6666666667%;
}

.row12 .col.pull-l8 {
  right: 66.6666666667%;
}

.row12 .col.push-l8 {
  left: 66.6666666667%;
}

.row12 .col.offset-l9 {
  margin-left: 75%;
}

.row12 .col.pull-l9 {
  right: 75%;
}

.row12 .col.push-l9 {
  left: 75%;
}

.row12 .col.offset-l10 {
  margin-left: 83.3333333333%;
}

.row12 .col.pull-l10 {
  right: 83.3333333333%;
}

.row12 .col.push-l10 {
  left: 83.3333333333%;
}

.row12 .col.offset-l11 {
  margin-left: 91.6666666667%;
}

.row12 .col.pull-l11 {
  right: 91.6666666667%;
}

.row12 .col.push-l11 {
  left: 91.6666666667%;
}

.row12 .col.offset-l12 {
  margin-left: 100%;
}

.row12 .col.pull-l12 {
  right: 100%;
}

.row12 .col.push-l12 {
  left: 100%;
}

@media only screen and (max-width: 1100px) {
  .row12 .col.m1 {
    width: 8.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.m2 {
    width: 16.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.m3 {
    width: 25%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.m4 {
    width: 33.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.m5 {
    width: 41.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.m6 {
    width: 50%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.m7 {
    width: 58.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.m8 {
    width: 66.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.m9 {
    width: 75%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.m10 {
    width: 83.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.m11 {
    width: 91.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.m12 {
    width: 100%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.offset-m1 {
    margin-left: 8.3333333333%;
  }
  .row12 .col.pull-m1 {
    right: 8.3333333333%;
  }
  .row12 .col.push-m1 {
    left: 8.3333333333%;
  }
  .row12 .col.offset-m2 {
    margin-left: 16.6666666667%;
  }
  .row12 .col.pull-m2 {
    right: 16.6666666667%;
  }
  .row12 .col.push-m2 {
    left: 16.6666666667%;
  }
  .row12 .col.offset-m3 {
    margin-left: 25%;
  }
  .row12 .col.pull-m3 {
    right: 25%;
  }
  .row12 .col.push-m3 {
    left: 25%;
  }
  .row12 .col.offset-m4 {
    margin-left: 33.3333333333%;
  }
  .row12 .col.pull-m4 {
    right: 33.3333333333%;
  }
  .row12 .col.push-m4 {
    left: 33.3333333333%;
  }
  .row12 .col.offset-m5 {
    margin-left: 41.6666666667%;
  }
  .row12 .col.pull-m5 {
    right: 41.6666666667%;
  }
  .row12 .col.push-m5 {
    left: 41.6666666667%;
  }
  .row12 .col.offset-m6 {
    margin-left: 50%;
  }
  .row12 .col.pull-m6 {
    right: 50%;
  }
  .row12 .col.push-m6 {
    left: 50%;
  }
  .row12 .col.offset-m7 {
    margin-left: 58.3333333333%;
  }
  .row12 .col.pull-m7 {
    right: 58.3333333333%;
  }
  .row12 .col.push-m7 {
    left: 58.3333333333%;
  }
  .row12 .col.offset-m8 {
    margin-left: 66.6666666667%;
  }
  .row12 .col.pull-m8 {
    right: 66.6666666667%;
  }
  .row12 .col.push-m8 {
    left: 66.6666666667%;
  }
  .row12 .col.offset-m9 {
    margin-left: 75%;
  }
  .row12 .col.pull-m9 {
    right: 75%;
  }
  .row12 .col.push-m9 {
    left: 75%;
  }
  .row12 .col.offset-m10 {
    margin-left: 83.3333333333%;
  }
  .row12 .col.pull-m10 {
    right: 83.3333333333%;
  }
  .row12 .col.push-m10 {
    left: 83.3333333333%;
  }
  .row12 .col.offset-m11 {
    margin-left: 91.6666666667%;
  }
  .row12 .col.pull-m11 {
    right: 91.6666666667%;
  }
  .row12 .col.push-m11 {
    left: 91.6666666667%;
  }
  .row12 .col.offset-m12 {
    margin-left: 100%;
  }
  .row12 .col.pull-m12 {
    right: 100%;
  }
  .row12 .col.push-m12 {
    left: 100%;
  }
  .row12-flex .col.m1 {
    flex: 0 0 8.3333333333%;
  }
  .row12-flex .col.m2 {
    flex: 0 0 16.6666666667%;
  }
  .row12-flex .col.m3 {
    flex: 0 0 25%;
  }
  .row12-flex .col.m4 {
    flex: 0 0 33.3333333333%;
  }
  .row12-flex .col.m5 {
    flex: 0 0 41.6666666667%;
  }
  .row12-flex .col.m6 {
    flex: 0 0 50%;
  }
  .row12-flex .col.m7 {
    flex: 0 0 58.3333333333%;
  }
  .row12-flex .col.m8 {
    flex: 0 0 66.6666666667%;
  }
  .row12-flex .col.m9 {
    flex: 0 0 75%;
  }
  .row12-flex .col.m10 {
    flex: 0 0 83.3333333333%;
  }
  .row12-flex .col.m11 {
    flex: 0 0 91.6666666667%;
  }
  .row12-flex .col.m12 {
    flex: 0 0 100%;
  }
}
@media only screen and (max-width: 900px) {
  .row12 .col.ms1 {
    width: 8.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.ms2 {
    width: 16.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.ms3 {
    width: 25%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.ms4 {
    width: 33.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.ms5 {
    width: 41.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.ms6 {
    width: 50%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.ms7 {
    width: 58.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.ms8 {
    width: 66.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.ms9 {
    width: 75%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.ms10 {
    width: 83.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.ms11 {
    width: 91.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.ms12 {
    width: 100%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12-flex .col.ms1 {
    flex: 0 0 8.3333333333%;
  }
  .row12-flex .col.ms2 {
    flex: 0 0 16.6666666667%;
  }
  .row12-flex .col.ms3 {
    flex: 0 0 25%;
  }
  .row12-flex .col.ms4 {
    flex: 0 0 33.3333333333%;
  }
  .row12-flex .col.ms5 {
    flex: 0 0 41.6666666667%;
  }
  .row12-flex .col.ms6 {
    flex: 0 0 50%;
  }
  .row12-flex .col.ms7 {
    flex: 0 0 58.3333333333%;
  }
  .row12-flex .col.ms8 {
    flex: 0 0 66.6666666667%;
  }
  .row12-flex .col.ms9 {
    flex: 0 0 75%;
  }
  .row12-flex .col.ms10 {
    flex: 0 0 83.3333333333%;
  }
  .row12-flex .col.ms11 {
    flex: 0 0 91.6666666667%;
  }
  .row12-flex .col.ms12 {
    flex: 0 0 100%;
  }
}
@media only screen and (max-width: 601px) {
  .row12 .col.s1 {
    width: 8.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.s2 {
    width: 16.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.s3 {
    width: 25%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.s4 {
    width: 33.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.s5 {
    width: 41.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.s6 {
    width: 50%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.s7 {
    width: 58.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.s8 {
    width: 66.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.s9 {
    width: 75%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.s10 {
    width: 83.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.s11 {
    width: 91.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.s12 {
    width: 100%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row12 .col.offset-s1 {
    margin-left: 8.3333333333%;
  }
  .row12 .col.pull-s1 {
    right: 8.3333333333%;
  }
  .row12 .col.push-s1 {
    left: 8.3333333333%;
  }
  .row12 .col.offset-s2 {
    margin-left: 16.6666666667%;
  }
  .row12 .col.pull-s2 {
    right: 16.6666666667%;
  }
  .row12 .col.push-s2 {
    left: 16.6666666667%;
  }
  .row12 .col.offset-s3 {
    margin-left: 25%;
  }
  .row12 .col.pull-s3 {
    right: 25%;
  }
  .row12 .col.push-s3 {
    left: 25%;
  }
  .row12 .col.offset-s4 {
    margin-left: 33.3333333333%;
  }
  .row12 .col.pull-s4 {
    right: 33.3333333333%;
  }
  .row12 .col.push-s4 {
    left: 33.3333333333%;
  }
  .row12 .col.offset-s5 {
    margin-left: 41.6666666667%;
  }
  .row12 .col.pull-s5 {
    right: 41.6666666667%;
  }
  .row12 .col.push-s5 {
    left: 41.6666666667%;
  }
  .row12 .col.offset-s6 {
    margin-left: 50%;
  }
  .row12 .col.pull-s6 {
    right: 50%;
  }
  .row12 .col.push-s6 {
    left: 50%;
  }
  .row12 .col.offset-s7 {
    margin-left: 58.3333333333%;
  }
  .row12 .col.pull-s7 {
    right: 58.3333333333%;
  }
  .row12 .col.push-s7 {
    left: 58.3333333333%;
  }
  .row12 .col.offset-s8 {
    margin-left: 66.6666666667%;
  }
  .row12 .col.pull-s8 {
    right: 66.6666666667%;
  }
  .row12 .col.push-s8 {
    left: 66.6666666667%;
  }
  .row12 .col.offset-s9 {
    margin-left: 75%;
  }
  .row12 .col.pull-s9 {
    right: 75%;
  }
  .row12 .col.push-s9 {
    left: 75%;
  }
  .row12 .col.offset-s10 {
    margin-left: 83.3333333333%;
  }
  .row12 .col.pull-s10 {
    right: 83.3333333333%;
  }
  .row12 .col.push-s10 {
    left: 83.3333333333%;
  }
  .row12 .col.offset-s11 {
    margin-left: 91.6666666667%;
  }
  .row12 .col.pull-s11 {
    right: 91.6666666667%;
  }
  .row12 .col.push-s11 {
    left: 91.6666666667%;
  }
  .row12 .col.offset-s12 {
    margin-left: 100%;
  }
  .row12 .col.pull-s12 {
    right: 100%;
  }
  .row12 .col.push-s12 {
    left: 100%;
  }
  .row12-flex .col.s1 {
    flex: 0 0 8.3333333333%;
  }
  .row12-flex .col.s2 {
    flex: 0 0 16.6666666667%;
  }
  .row12-flex .col.s3 {
    flex: 0 0 25%;
  }
  .row12-flex .col.s4 {
    flex: 0 0 33.3333333333%;
  }
  .row12-flex .col.s5 {
    flex: 0 0 41.6666666667%;
  }
  .row12-flex .col.s6 {
    flex: 0 0 50%;
  }
  .row12-flex .col.s7 {
    flex: 0 0 58.3333333333%;
  }
  .row12-flex .col.s8 {
    flex: 0 0 66.6666666667%;
  }
  .row12-flex .col.s9 {
    flex: 0 0 75%;
  }
  .row12-flex .col.s10 {
    flex: 0 0 83.3333333333%;
  }
  .row12-flex .col.s11 {
    flex: 0 0 91.6666666667%;
  }
  .row12-flex .col.s12 {
    flex: 0 0 100%;
  }
}
dl dt {
  font: normal normal normal 11px/14px "Roboto", Arial;
}

dl dd {
  font: normal normal normal 13px/16px "Roboto", Arial;
}

body {
  position: relative;
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  background: #eee;
  font-family: Arial;
  font-size: 12px;
  color: #333;
  overflow: hidden;
}

#container {
  position: absolute;
  top: 0px;
  left: 0px;
  bottom: 0px;
  height: 100%;
  right: 0px;
  overflow: hidden;
}

.rightShadow {
  position: absolute;
  top: 0;
  right: -10px;
  bottom: 0;
  z-index: 10;
  width: 10px;
  height: 100%;
  background: url(/assets/images/crm/rightShadow.png) repeat-y left top;
}

.logo {
  float: left;
  display: block;
  width: 152px;
  height: 34px;
  background: url(../images/crm/logo.png) no-repeat top left;
  margin: 18px 0 0 0px;
  text-decoration: none;
}

.left {
  position: absolute;
  width: 50px;
  top: 70px;
  left: 0;
  background: #333;
  display: block;
  width: 50px;
  height: 100%;
  bottom: 0px;
  transition: 0.3s;
  overflow: hidden;
}

.right {
  display: block;
  position: absolute;
  top: 70px;
  left: 50px;
  right: 0;
  background: #eee;
  height: 100%;
  bottom: 0px;
  z-index: 2;
  transition: 0.3s;
}

.open .left {
  width: 250px;
  transition: 0.3s;
}

.open .right {
  left: 250px;
  transition: 0.3s;
}

.topContent {
  float: right;
  z-index: 1;
}

.topHeader {
  height: 70px;
  width: 100%;
  background: #444444;
  font-family: Arial;
  font-size: 14px;
  color: #777;
}

.dropButton {
  border-left: 1px solid rgba(255, 255, 255, 0.2);
  display: block;
  height: 70px;
  text-align: center;
  line-height: 70px;
  font-size: 20px;
  color: rgba(255, 255, 255, 0.5);
  padding: 0;
  float: left;
  width: 75px;
  transition: 0.5s;
  -moz-transition: 0.5s;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
}

.dropButton:hover {
  color: rgb(255, 255, 255);
  transition: 0.5s;
  -moz-transition: 0.5s;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
}

.dropButton.active {
  color: rgb(255, 255, 255);
}

.addMailing span {
  display: block;
  height: 70px;
  width: 75px;
  background: url(../images/crm/topIcons.png) no-repeat left top;
}

.addMailing span:hover {
  background-position: left bottom;
}

.addClient span {
  display: block;
  height: 70px;
  width: 75px;
  background: url(../images/crm/topIcons.png) no-repeat -75px top;
}

.addClient span:hover {
  background-position: -75px bottom;
}

.addInvoice span {
  display: block;
  height: 70px;
  width: 75px;
  background: url(../images/crm/topIcons.png) no-repeat right top;
}

.addInvoice span:hover {
  background-position: right bottom;
}

.topProfileBox {
  height: 70px;
  float: left;
  padding: 0 20px 0 20px;
  border-left: 1px solid rgba(255, 255, 255, 0.2);
}

.languageBox {
  height: 65px;
  float: left;
  padding: 5px 0 0 0;
  border-left: 1px solid #ccc;
}

.languageBox a {
  display: block;
  width: 33px;
  height: 20px;
  text-align: center;
  font: normal normal normal 10px/20px Roboto, Arial;
  color: #666;
}

.languageBox a.active {
  color: #ff7c2d;
}

.user {
  float: left;
  line-height: 70px;
}

.user span {
  padding-right: 10px;
}

.user .username {
  display: block;
  font: normal normal normal 13px/70px Roboto, Arial;
  color: #fff;
}

.logOff {
  float: left;
  display: block;
  width: 14px;
  height: 70px;
  color: rgba(255, 255, 255, 0.5);
  line-height: 70px;
  font-size: 20px;
  transition: 0.3s;
}

.logOff:hover {
  color: rgb(255, 255, 255);
  transition: 0.3s;
}

.pannel {
  position: fixed;
  z-index: 1000;
  background: url(../images/panelBg.png) repeat-y;
  width: 446px;
  top: 0;
  bottom: 0;
  right: 0;
  overflow: hidden;
}

.pannel .innerPanel {
  padding: 0px 0 0 46px;
  width: 400px;
}

.pannel .innerPanel .scrollHolder {
  width: 423px;
  padding-bottom: 12px;
}

.pannel .innerPanel .tabs {
  height: 69px;
  background: #f7f7f7;
}

.pannel .innerPanel .tabs .tab {
  display: block;
  float: left;
  height: 69px;
  padding: 0 25px 0 25px;
  font: normal normal normal 16px/69px "Roboto", Arial;
  color: #666;
}

.pannel .innerPanel .tabs .tab.active {
  background: #fff;
}

.pannel .innerPanel .pnl {
  background: #fff;
}

.pannel a.close {
  background: url(/assets/images/crm/iconCancelDark.png) no-repeat center center;
  width: 40px;
  height: 40px;
  position: absolute;
  top: 15px;
  right: 15px;
}

.pannel .searchField {
  margin: 20px;
}

.pannel .innerPanel .form {
  padding: 17px 15px 15px 15px;
}

.pannel .innerPanel .form label, #activeLead .pannel .innerPanel .form label {
  display: block;
  font: normal normal normal 11px/16px "Roboto", Arial;
  height: 16px;
  color: #999;
  width: 368px;
  padding: 0;
}

.pannel .innerPanel .form input, .pannel .innerPanel .form select {
  display: block;
  height: 30px;
  padding: 0;
  border-radius: 0;
  border: 1px solid #ccc;
  text-indent: 10px;
  font: normal normal normal 12px/16px "Roboto", Arial;
  color: #666;
  width: 368px !important;
  margin: 0 0 12px 0 !important;
}

.pannel .innerPanel .form .chk {
  height: 32px;
  margin: 0 0 12px 0;
}

.pannel .innerPanel .form .chk input {
  border: 1px solid #ccc;
  width: 16px !important;
  height: 16px;
  float: left;
  margin: 8px 12px 0 0 !important;
}

.pannel .innerPanel .form .chk span {
  display: block;
  font: normal normal normal 11px/16px "Roboto", Arial;
  height: 16px;
  color: #999;
  width: 340px;
  padding: 8px 0 0 0;
}

.pannel .innerPanel .form select {
  height: 32px;
  width: 370px;
  padding-left: 10px;
  text-indent: 0;
}

.pannel .innerPanel .form .btnGreen {
  float: left;
  font: normal normal normal 14px/37px "Roboto", Arial;
  color: #fff;
  margin: 8px 0 0 0;
  padding: 0 15px 0 15px;
}

.pannel .innerPanel .form label.oneThird, #activeLead .pannel .innerPanel .form label.oneThird {
  width: 100px;
  float: left;
}

.pannel .innerPanel .form input.oneThird {
  width: 98px !important;
  float: left;
}

.pannel .innerPanel .form label.twoThird, #activeLead .pannel .innerPanel .form label.twoThird {
  width: 250px !important;
  float: left;
  margin-left: 10px !important;
}

.pannel .innerPanel .form input.twoThird {
  width: 258px !important;
  float: left;
  margin-left: 10px !important;
}

ul.menu {
  margin: 0px 0 0 0;
  width: 250px;
}

ul.menu li {
  margin: 0;
  list-style: none;
  display: block;
  width: 250px;
  height: 49px;
  position: relative;
}

ul.menu li a {
  width: 250px;
  height: 49px;
  display: block;
  transition: 0.5s;
  -moz-transition: 0.5s;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  color: #acacac;
  line-height: 49px;
  text-align: left;
  font-size: 13px;
  color: #777;
  font-weight: 500;
}

ul.menu li a:hover, ul.menu li a.active, ul.menu li a.hover {
  background-color: #ff7c2d;
  transition: 0.5s;
  -moz-transition: 0.5s;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  color: #fff;
}

ul.menu li a i {
  font-size: 18px;
  color: #999;
  width: 50px;
  height: 49px;
  text-align: center;
}

ul.menu li a i.zmdi {
  font-size: 24px;
}

ul.menu li a:hover i, ul.menu li a.active i {
  color: #fff;
}

.mnu-btn {
  display: block;
  float: left;
  height: 70px;
  width: 49px;
  text-align: center;
  line-height: 70px;
  font-size: 18px;
  color: #777;
}

.mnu-btn .opened, .open .mnu-btn .closed {
  display: none;
}

.open .mnu-btn .opened {
  display: inline-block;
}

ul.submenu {
  display: block;
  list-style: none;
  font-family: Arial, Arial;
  font-size: 12px;
  color: #ababab;
  display: block;
  position: absolute;
  width: 170px;
  top: 0px;
  right: 0px;
  z-index: 12;
}

ul.submenu li {
  width: 170px;
  padding: 0;
  height: 29px;
  border: none;
  border-top: 1px solid #dedede;
  background: none;
}

ul.submenu li a {
  display: block;
  background: none !important;
  width: 150px;
  padding: 0 0 0 20px;
  height: 29px;
  font: normal normal normal 12px/29px Roboto, Arial;
  text-transform: none;
  text-decoration: none;
  color: #333;
}

ul.submenu li a.active, ul.submenu li a:hover {
  color: #ff7c2d;
}

h1 {
  color: #666;
  font-size: 20px;
  font-family: Arial;
  margin: 0px;
  padding: 0px;
  font-weight: normal;
}

h1 span a {
  color: #ff7c2d;
  text-decoration: none;
}

.offer {
  display: block;
  margin: 20px 0 0 0px;
  background: #fff;
  border: solid 1px #999;
  width: 800px;
  height: 800px;
}

.button {
  border: solid 1px #666;
  background: #ccc;
  color: #333;
}

ul.customers {
  display: block;
  margin: 0 20px 0 20px;
  padding: 0;
  background: url(../images/crm/dottedline.png) repeat-x top left;
}

ul.customers li {
  margin: 0;
  padding: 7px 0 9px 0;
  list-style: none;
  display: block;
  text-align: left;
  background: url(../images/crm/dottedline.png) repeat-x bottom left;
}

ul.customers li a {
  font: normal normal normal 13px/19px "Roboto", Arial;
  text-decoration: none;
  display: block;
  color: #666;
  position: relative;
  padding-left: 30px;
}

ul.customers li a span {
  display: block;
  color: #999;
  font: normal normal normal 11px/14px "Roboto", Arial;
}

ul.customers li a:hover, ul.customers li a.active {
  color: #eebb00;
  text-decoration: none;
}

ul.customers li a::before {
  position: absolute;
  top: 10px;
  left: 0;
  display: block;
  content: "\f207";
  font: normal normal normal 20px/1 "Material-Design-Iconic-Font";
}

ul.customers li a.company::before {
  content: "\f128";
}

.searchField {
  height: 16px;
  border: solid 1px #dfdfd8;
  width: 355px;
  font-family: Arial;
  font-size: 14px;
  color: #666;
  padding: 10px 0px 11px 10px;
  border-radius: 0px;
}

a.btnClose {
  display: block;
  height: 44px;
  width: 44px;
  top: 5px;
  right: 5px;
  position: absolute;
  background: url(../images/crm/btnClose.png) no-repeat top left;
  text-decoration: none;
}

a.btnClose:hover {
  background: url(../images/crm/btnClose.png) no-repeat bottom left;
}

ul.carList {
  width: 365px;
  display: block;
  margin: 0 0 0 20px;
  padding: 0;
  background: url(../images/crm/dottedline.png) repeat-x top left;
}

ul.carList li {
  margin: 0;
  padding: 1px 0 0 0;
  list-style: none;
  display: block;
  width: 365px;
  text-align: left;
  background: url(../images/crm/dottedline.png) repeat-x bottom left;
}

ul.carList li a {
  font-size: 14px;
  font-family: Arial;
  text-decoration: none;
  width: 365px;
  display: block;
  color: #666;
  position: relative;
}

ul.carList li a::after {
  content: "";
  float: none;
  clear: both;
  display: block;
}

ul.carList li a img {
  display: block;
  max-width: 110px;
  height: 73px;
  float: left;
  border: none;
}

ul.carList li a span.details {
  float: left;
  width: 155px;
  padding: 0 0 0 10px;
  font: normal normal normal 11px/15px "Roboto", Arial;
}

ul.carList li a span.details span.sold {
  display: none;
  color: #08c880;
  text-transform: uppercase;
}

ul.carList li a span.details span.sold.on {
  display: inline;
}

ul.carList li a span.price {
  float: right;
  text-align: right;
  width: 90px;
  font-size: 16px;
  padding-right: 10px;
  box-sizing: border-box;
}

ul.carList li a:hover, ul.customers li a.active {
  color: #eebb00;
}

ul.carList li a .status {
  position: absolute;
  bottom: 4px;
  left: 4px;
  line-height: 16px;
  font-size: 9px;
  font-weight: bold;
  text-transform: uppercase;
  color: #fff;
  background: #ff0000;
  border-radius: 4px;
  padding: 0 4px 0 4px;
}

.innerPanel .chk {
  padding-left: 20px;
  margin-top: -10px;
  padding-bottom: 5px;
}

.innerPanel .chk.npl {
  padding-left: 0;
}

.innerPanel .chk input[type=checkbox] {
  display: none;
}

.innerPanel .chk input[type=checkbox] + label {
  color: #777;
  font: normal normal normal 13px/18px "Roboto", Arial;
  min-height: 19px;
  overflow: hidden;
  cursor: pointer;
  padding: 3px 0 0 25px;
}

.innerPanel .chk input[type=checkbox] + label::before {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  vertical-align: middle;
  margin-right: 8px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 0;
  text-align: center;
  line-height: 14px;
  font-size: 14px;
  border-radius: 3px;
  margin-top: -3px;
}

.innerPanel .chk input[type=checkbox]:checked + label::before {
  content: "\f26b";
  color: #fff !important;
  border: 1px solid #08c880;
  background-color: #08c880;
  text-align: center;
  font-family: "Material-Design-Iconic-Font";
}

.offer {
  display: block;
  margin: 20px 0 0 0px;
  background: #fff;
  border: solid 1px #999;
  width: 680px;
  height: 800px;
  color: #666;
  font-size: 12px;
  font-family: Arial;
}

.offer .left {
  float: left;
  height: auto;
  min-height: 0px;
  background: none;
}

.offer .logo {
  float: left;
  display: block;
  margin: 28px 0px 0px 17px;
  width: 121px;
  height: 64px;
  background: url(../images/crm/offerLogo.jpg) repeat-x top left;
}

.offer .customer {
  float: right;
  display: block;
  margin: 28px 10px 0px 0px;
  width: 190px;
  height: 130px;
}

.offer .qcars {
  float: left;
  display: block;
  margin: 25px 0px 0px 17px;
  width: 160px;
  height: 40px;
}

.offer .box {
  width: 626px;
  border: solid 1px #ddd;
  margin-left: 17px;
  padding: 10px;
}

.offer .box a {
  display: block;
  font-size: 14px;
  color: #666;
  text-decoration: none;
  padding-bottom: 4px;
}

.offer .rightBox {
  width: 180px;
  border: solid 1px #ddd;
  float: right;
  margin: 10px 15px 10px 0;
  padding-left: 10px;
}

.offer .offerNr {
  margin: 50px 0px 10px 17px;
}

.offer .carDetails td.left {
  font-weight: bold;
  width: 100px;
}

.todoTable {
  padding: 20px;
}

h3 {
  display: inline-block !important;
  text-transform: uppercase;
  font-family: Arial;
  font-size: 14px;
  line-height: 18px;
  padding: 4px 10px 10px 0;
}

.clear {
  clear: both;
  font-size: 0px;
  margin: 0;
  padding: 0;
  line-height: 0px;
}

.floatRight {
  float: right !important;
  margin-right: 15px;
}

.floatRightNM {
  float: right !important;
}

table {
  border-collapse: separate;
  border-spacing: 0;
}

caption, th, td {
  text-align: left;
  font-weight: normal;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
}

blockquote, q {
  quotes: "" "";
}

li {
  list-style-type: none;
}

hr {
  display: none;
}

strong, b {
  font-weight: bold;
}

em, i {
  font-style: italic;
}

a {
  text-decoration: none;
  color: #333;
}

a img {
  border: none;
}

.fl {
  float: left;
}

.fr {
  float: right;
}

.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

.ir {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
}

.tl {
  text-align: left !important;
}

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

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

.ttop {
  vertical-align: top !important;
}

.hand {
  cursor: pointer;
}

.a-hidden {
  position: absolute;
  top: -10000em;
}

.first {
  border-left: 0 !important;
}

.last {
  border-right: 0 !important;
}

.msg {
  border: none;
  margin: 0;
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 150px;
  z-index: 2000;
  padding: 20px;
  font: normal normal 500 14px/20px "Roboto", Arial;
  background: #fff;
  border: 1px solid #ccc;
  color: #777;
  border-radius: 5px;
}

.msg p {
  display: block;
  margin: 0 0 0 0;
  padding: 0;
  font: normal normal 500 14px/20px "Roboto", Arial;
}

.msg-ok {
  border-color: #00c981;
  color: #00c981;
}
.msg-ok::before {
  background: #00c981;
  color: #fff;
  display: block;
  position: absolute;
  left: -25px;
  top: -25px;
  line-height: 40px;
  font-size: 20px;
  font-family: "Font Awesome 5 Pro";
  border-radius: 50%;
  width: 40px;
  height: 40px;
  z-index: 2001;
  text-align: center;
  content: "\f00c";
}

.msg-error {
  border-color: #ff0000;
  color: #ff0000;
}
.msg-error::before {
  background: #ff0000;
  color: #fff;
  display: block;
  position: absolute;
  left: -25px;
  top: -25px;
  line-height: 40px;
  font-size: 20px;
  font-family: "Font Awesome 5 Pro";
  border-radius: 50%;
  width: 40px;
  height: 40px;
  z-index: 2001;
  text-align: center;
  content: "\f00d";
}

.msg-warn {
  border-color: #f2bd17;
  color: #f2bd17;
}

.msg-info {
  border-color: #c3e6ff;
  color: #c3e6ff;
}

.error {
  color: #b70b0b;
}

div.plain {
  padding: 0;
}

div.plain fieldset {
  border: 0 !important;
  padding: 0 !important;
}

div.basic {
  width: 920px;
  float: none;
  padding: 20px 0 20px 0;
}

.subSection div.basic {
  padding: 0;
  width: 910px;
}

div.basic.p20 {
  padding: 20px;
}

div.basic.p10, div.basic .inner-form.description {
  padding: 10px;
}

div.basic.half {
  width: 460px;
  float: left;
}

div.basic.twoThird {
  width: 550px;
}

div.basic dl {
  width: 920px;
  overflow: hidden;
}

div.basic dl dt,
div.basic dl dd {
  display: block;
  float: left;
}

div.basic dl dt {
  padding: 10px 10px 0 0;
  width: 130px;
  text-align: right;
  font: normal normal normal 10px/12px "Roboto", Arial;
  min-height: 24px;
}

div.basic dl dt label {
  font: normal normal normal 12px/12px "Roboto", Arial;
  color: #999;
}

div.basic dl dd {
  min-height: 32px;
  padding: 0 0 2px 0;
  width: 780px;
  font: normal normal normal 13px/32px "Roboto", Arial;
  color: #333;
}

div.basic dl dd a {
  font: normal normal normal 13px/32px "Roboto", Arial;
}

div.basic dl dd.ml {
  padding: 8px 0 2px 0;
  line-height: 16px;
}

div.basic.floating-box {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 320px;
  padding: 0;
  border: 1px solid #ccc;
}

div.basic.floating-box dl {
  width: 100%;
}

div.basic.floating-box dl dt {
  width: 40%;
  box-sizing: border-box;
}

div.basic.floating-box dl dd {
  width: 60%;
  box-sizing: border-box;
}

.card-table td.c1 {
  width: 40px;
}

.card-table td.c2 {
  width: 24px;
}

.card-table td.c3 {
  width: 100%;
}

.todo-remarks {
  display: none;
}

div dl dd {
  position: relative;
}

div.basic.half dl {
  width: 460px;
  overflow: hidden;
}

div.basic.twoThird dl {
  width: 550px;
  overflow: hidden;
}

div.basic.half dl dd {
  width: 320px;
}

div.basic.twoThird dl dd {
  width: 410px;
}

.txt {
  -webkit-appearance: none;
  border-radius: 0;
  padding: 7px 0 7px 10px;
  font: normal normal normal 14px/20px "Roboto", Arial;
  color: #333;
  border: 1px solid #ccc;
  border-radius: 3px;
  margin: 0;
  min-height: 40px;
  background: #fff;
  box-sizing: border-box;
}

div.basic dl dd .txt {
  width: 100%;
}

.txt.disabled, div.basic dl dd .txt.disabled, .disabled input, .disabled label {
  opacity: 0.4;
}

div.basic dl dd .txt.hl {
  width: 49.5%;
  float: left;
}

div.basic dl dd .txt.hr {
  width: 49.5%;
  float: right;
}

div.basic dl dd .txt.hl.nb {
  width: 50%;
  float: left;
  border-right: none;
}

div.basic dl dd .txt.hr.nb {
  width: 50%;
  float: right;
  border-left: none;
}

div.basic dl dd .txt.dhh {
  width: 59.1%;
  float: left;
}

div.basic dl dd .txt.w33 {
  width: 33%;
  float: left;
  margin-right: 2px;
}

div.basic dl dd .txt.w33.last {
  width: 32.5%;
  float: right;
  margin-right: 0px;
  border-right: 1px solid #ccc !important;
}

div.basic dl dd label.txt {
  line-height: 30px;
  text-align: right;
  padding-right: 16px;
  box-sizing: border-box;
  width: 100% !important;
}

#activeLead.readonly .txt, #activeLead.readonly .btnMinPlus, #activeLead.readonly .ui-datepicker-trigger, #activeLead.readonly .control-holder {
  display: none;
}

#activeLead.readonly dd label, #activeLead.readonly dd #lblCar, #activeLead.readonly dd #lblCustomer {
  display: block;
}

#activeLead dd label, #activeLead dd #lblCar, #activeLead dd #lblCustomer {
  display: none;
}

#activeLead.readonly dd #lblCar, #activeLead.readonly dd #lblCustomer {
  font: normal normal normal 12px/16px "Roboto", Arial;
  color: #333;
  padding: 8px 10px 0 0;
}

div.basic.twoThird dl dd .txt {
  width: 410px;
}

div.basic.half dl dd select.txt {
  width: 320px;
}

div.basic.half dl dd select.txt.hl {
  width: 49.5%;
  float: left;
}

div.basic.half dl dd select.txt.hr {
  width: 49.5%;
  float: right;
}

div.basic.half dl dd .txt.hhr {
  width: 29%;
  float: left;
  margin-right: 3px;
}

div.basic.half dl dd .txt.hhl {
  width: 29%;
  float: left;
}

div.basic.half dl dd .txt.hh {
  width: 29%;
  float: right;
}

div.basic.half dl dd .txtLbl.hh {
  width: 11%;
  display: block;
  float: left;
  font: normal normal 300 12px/32px "Roboto", Arial;
  color: #999;
  box-sizing: border-box;
  padding-left: 15px;
}

div.basic.twoThird dl dd select.txt {
  width: 410px;
}

div.basic.half dl dd textarea.txt {
  height: 100px;
}

div.basic.twoThird dl dd textarea.txt {
  height: 100px;
}

.txt.date {
  padding-right: 50px;
}

div.basic.half dl dd select.txt.date, div.basic.half dl dd select.txt.add {
  width: 100%;
  padding-right: 50px;
}

div.basic.half dl dd select.txt.datePart {
  width: 106px;
  margin-right: 2px;
}

.dateSpace {
  display: inline-block;
  width: 105px;
  margin-right: 2px;
}

div.basic.half dl dd select.txt.datePartYear {
  width: 104px;
}

div.basic.twoThird dl dd select.txt.datePartYear {
  width: 194px;
}

.txt.e, div.basic dl dd .txt.e, div.basic.half dl dd .txt.e {
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgEuro.png) no-repeat right center;
}

.txt.s, div.basic dl dd .txt.s, div.basic.half dl dd .txt.s {
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgs.png) no-repeat right center;
}

.txt.kg, div.basic dl dd .txt.kg, div.basic.half dl dd .txt.kg {
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgKg.png) no-repeat right center;
}

.txt.mm, div.basic dl dd .txt.mm, div.basic.half dl dd .txt.mm {
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgMm.png) no-repeat right center;
}

.txt.cm, div.basic dl dd .txt.cm, div.basic.half dl dd .txt.cm {
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgCm.png) no-repeat right center;
}

.txt.km, div.basic dl dd .txt.km, div.basic.half dl dd .txt.km {
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgKm.png) no-repeat right center;
}

.txt.kmh, div.basic dl dd .txt.kmh, div.basic.half dl dd .txt.kmh {
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgKmh.png) no-repeat right center;
}

.txt.nm, div.basic dl dd .txt.nm, div.basic.half dl dd .txt.nm {
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgNm.png) no-repeat right center;
}

.txt.cx, div.basic dl dd .txt.cx, div.basic.half dl dd .txt.cx {
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgCx.png) no-repeat right center;
}

.txt.lkm, div.basic dl dd .txt.lkm, div.basic.half dl dd .txt.lkm {
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgl100Km.png) no-repeat right center;
}

.txt.l, div.basic dl dd .txt.l, div.basic.half dl dd .txt.l {
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgl.png) no-repeat right center;
}

.txt.db, div.basic dl dd .txt.db, div.basic.half dl dd .txt.db {
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgDb.png) no-repeat right center;
}

.txt.kw, div.basic dl dd .txt.kw, div.basic.half dl dd .txt.kw {
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgKw.png) no-repeat right center;
}

.txt.cc, div.basic dl dd .txt.cc, div.basic.half dl dd .txt.cc {
  padding-right: 16px;
  background: url(../images/crm/txtBgCC.png) no-repeat right center;
}

.txt.perc, div.basic dl dd .txt.perc, div.basic.half dl dd .txt.perc {
  padding-right: 16px;
  background: url(../images/crm/txtBgPerc.png) no-repeat right center;
}

.txt.co2, div.basic dl dd .txt.co2, div.basic.half dl dd .txt.co2 {
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgCO2.png) no-repeat right center;
}

.txt.hp, div.basic dl dd .txt.hp, div.basic.half dl dd .txt.hp {
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgHp.png) no-repeat right center;
}

div.basic.twoThird dl dd .txt.e {
  width: 377px;
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgEuro.png) no-repeat right center;
}

div.basic.twoThird dl dd .txt.hp {
  width: 377px;
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgKg.png) no-repeat right center;
}

div.basic.twoThird dl dd .txt.hp {
  width: 377px;
  padding-right: 16px;
  background: url(../images/crm/txtBgCC.png) no-repeat right center;
}

div.basic.twoThird dl dd .txt.perc {
  width: 377px;
  padding-right: 16px;
  background: url(../images/crm/txtBgPerc.png) no-repeat right center;
}

div.basic.twoThird dl dd .txt.co2 {
  width: 377px;
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgCO2.png) no-repeat right center;
}

div.basic.twoThird dl dd .txt.hp {
  width: 377px;
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgHp.png) no-repeat right center;
}

div.basic.twoThird dl dd .txt.price {
  float: left;
  width: 327px;
  padding-right: 16px;
  background: #fff url(../images/crm/txtBgEuro.png) no-repeat right center;
  border-right: none;
}

span.note, div.basic span.note {
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  font: normal normal normal 10px/30px Arial;
  color: #999;
  border-left: none;
}

em.note, div.basic em.note {
  display: block;
  font: normal normal normal 10px/13px Arial;
  color: #999;
}

span.profit, div.basic span.profit {
  font: normal normal normal 11px/30px "Roboto", Arial;
  text-align: right;
  color: #08c880;
  position: absolute;
  right: 60px;
  top: 49%;
  transform: translateY(-50%);
}

span.profit.red, div.basic span.profit.red {
  color: #ff0000;
}

span.lblProfit {
  display: inline-block;
  padding-left: 10px;
}

.chk {
  display: block;
  min-height: 32px;
}

.chk label, .chk input, .chkList label, div.basic dl dd .chkList label {
  float: left;
  display: block;
  height: 16px;
}

.chkList span {
  display: block;
  min-height: 24px;
}

.chk label, .chkList label, div.basic dl dd label {
  padding: 8px 10px 0 0;
  font: normal normal normal 13px/16px "Roboto", Arial;
  color: #333;
}

.chk.dark label {
  color: #333;
}

.chk input {
  width: 16px;
  margin: 6px 10px 0 0;
  padding: 0;
}

input[type=checkbox], input[type=radio] {
  display: none;
}

.no-style input[type=checkbox], input[type=checkbox].toggleAll {
  display: block;
  border-radius: 3px;
  border-color: #ccc;
  width: 17px;
  height: 17px;
}

input[type=checkbox].toggleAll {
  display: inline-block;
}

input[type=checkbox] + label, div.basic dl dd input[type=checkbox] + label, input[type=radio] + label, div.basic dl dd input[type=radio] + label {
  color: #333;
  font: normal normal normal 12px/19px "Roboto", Arial;
  min-height: 19px;
  cursor: pointer;
  float: none;
  display: block;
  position: relative;
  padding: 8px 0 8px 30px;
}

div.basic dl dd .inline input[type=checkbox] + label, div.basic dl dd .inline input[type=radio] + label {
  display: inline-block;
  padding-right: 15px;
}

div.basic dl dd .white input[type=checkbox] + label, div.basic dl dd .white input[type=radio] + label {
  color: #fff;
}

input[type=checkbox] + label:before, input[type=radio] + label:before {
  content: "";
  display: inline-block;
  width: 17px;
  height: 17px;
  vertical-align: middle;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 3px;
  color: #ccc !important;
  text-align: center;
  line-height: 15px;
  font-size: 15px;
  position: absolute;
  top: 8px;
  left: 0;
}

input[type=radio] + label:before, input[type=radio]:checked + label:before {
  border-radius: 50%;
}

.rounded input[type=checkbox] + label:before, .rounded input[type=radio] + label:before {
  border-radius: 50%;
}

input[type=checkbox]:checked + label, input[type=radio]:checked + label {
  color: #08c880;
  position: relative;
}

input[type=checkbox]:checked + label:before, input[type=radio]:checked + label:before {
  content: "\f26b";
  color: #fff !important;
  border: 1px solid #08c880;
  background-color: #08c880;
  text-align: center;
  font-family: "Material-Design-Iconic-Font";
}

div.basic dl dd a.btnMinPlus {
  background: none;
  display: block;
  width: 38px;
  height: 36px;
  border-left: 1px solid #ccc;
  position: absolute;
  top: 1px;
  right: 1px;
  background: #f7f7f7;
  margin: 0;
  box-sizing: border-box;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  transition: 0.3s;
  color: #ccc;
}

div.basic dl dd a.btnMinPlus:hover {
  color: #666;
  transition: 0.3s;
}

div.basic dl dd a.btnMinPlus span {
  position: absolute;
  background: none;
  transition: 0.3s;
  display: block;
  width: 100%;
  height: auto;
  display: block;
  top: 50%;
  left: 0;
  right: 0;
  text-align: center;
  transform: translateY(-50%);
  font-size: 16px;
  line-height: 20px;
  color: #ccc;
}

div.basic dl dd a.btnMinPlus:hover span {
  color: #666;
  transition: 0.3s;
}

div.basic dl dd a.btnMinPlus.search span::after {
  font-family: "Font Awesome 5 Pro";
  content: "\f002";
  font-weight: light;
}

div.basic dl dd a.btnMinPlus.add span::after, div.basic dl dd a.btnMinPlus.plus span::after {
  font-family: "Font Awesome 5 Pro";
  content: "\f055";
  font-weight: bold;
}

div.basic dl dd a.btnMinPlus.min span {
  background-position: center -60px;
}

div.basic dl dd a.btnMinPlus.date span {
  background-position: center -90px;
}

.ui-trigger, .ui-datepicker-trigger {
  display: block;
  position: absolute;
  margin: 0;
  width: 32px;
  height: 36px;
  border: none;
  border-left: none;
  background: none;
  text-align: center;
  cursor: pointer;
  top: 1px;
  right: 1px;
}

.ui-datepicker-trigger img {
  visibility: hidden;
}

.ui-trigger::after, .ui-datepicker-trigger::after {
  content: "\f073";
  font-family: "Font Awesome 5 Pro";
  font-weight: light;
  font-size: 16px;
  color: #999;
  line-height: 30px;
  position: absolute;
  top: 50%;
  right: 0;
  left: 0;
  text-align: center;
  transform: translateY(-50%);
}

div.basic dl dd a.btnMinPlus.refresh span {
  background-position: center -120px;
}

a.btnGrey, .pagination a.btnGrey {
  position: relative;
  display: inline-block;
  height: 30px;
  background: #eaeaea;
  border: 1px solid #ccc;
  padding: 0 14px 0 0;
  font: normal normal normal 13px/30px "Roboto", Arial;
  color: #666;
}

a.btnGrey.previous {
  display: block;
  border: none;
  margin: 0 10px 0 0;
  float: left;
  height: 35px;
  background: #ccc url(/assets/images/crm/arrowPrev.png) no-repeat left center;
  padding: 2px 20px 0 45px;
  font: normal normal normal 13px/35px "Roboto", Arial;
  text-transform: uppercase;
  color: #666 !important;
  text-decoration: none;
}

a.btnGrey23 {
  display: block;
  height: 21px;
  background: #f4f4f4;
  float: right;
  margin: 0px 7px 0 0;
  border: 1px solid #ccc;
  padding: 0 5px 0 5px;
  line-height: 23px;
  color: #666 !important;
}

a.btnGrey span {
  display: block;
  padding-left: 40px;
  background: url(../images/crm/footerActions.png) no-repeat left top;
  font: normal normal normal 13px/30px "Roboto", Arial;
  color: #666;
}

a.btnGrey.unarchive span {
  background-position: left -60px;
}

a.btnGrey.sort span {
  background-image: none;
}

a.btnGrey.sort span::before {
  content: "\f1c3";
  font-family: "Material-Design-Iconic-Font";
  display: block;
  top: 0px;
  left: 0px;
  width: 40px;
  text-align: center;
  position: absolute;
  font-size: 22px;
  line-height: 30px;
  color: #999;
}

.pagination a.btnGrey {
  margin-top: 10px;
  display: block;
  float: left;
}

.pagination::after {
  content: "";
  display: block;
  clear: both;
  float: none;
}

a.btnGrey.archive, a.btnGrey.save, .pagination a.btnGrey.archive, .pagination a.btnGrey.save, a.btnGrey.delete, .pagination a.btnGrey.delete {
  vertical-align: middle;
  color: #666 !important;
  transition: 0.3s;
}

a.btnGrey.archive span, a.btnGrey.delete span {
  display: inline;
  background: none;
  padding: 0;
}

a.btnGrey.archive:hover, a.btnGrey.save:hover, a.btnGrey.delete:hover,
.pagination a.btnGrey.archive:hover, .pagination a.btnGrey.save:hover, .pagination a.btnGrey.delete:hover,
a.btnGrey.archive::before:hover, a.btnGrey.save::before:hover, a.btnGrey.delete::before:hover {
  color: #333 !important;
  transition: 0.3s;
}

a.btnGrey.delete::before, a.btnGrey.save::before, a.btnGrey.archive::before {
  color: #888;
  font-size: 18px;
  line-height: 30px;
  font-family: "Font Awesome 5 Pro";
  font-weight: 300;
  padding-right: 8px;
  padding-left: 10px;
}

a.btnGrey.save::before {
  content: "\f0c7";
}

a.btnGrey.archive::before {
  content: "\f187";
}

a.btnGrey.delete::before {
  content: "\f2ed";
}

a.btnGrey.import span {
  background-position: left -90px;
}

a.btnGrey.export span {
  background-position: left -120px;
}

a.btnGrey.next span {
  background-position: left -150px;
}

a.btnGrey.search span {
  background-position: left -180px;
}

a.btnGrey35 {
  display: inline-block;
  height: 35px;
  background: #ccc;
  padding: 0 10px 0 10px;
  font: normal normal normal 13px/35px "Roboto", Arial;
  color: #fff;
  transition: 0.4s;
}

a.btnGrey35:hover {
  background-color: #666;
  transition: 0.4s;
}

a.btnGrey35.add {
  padding: 0 10px 0 30px;
  background-image: url(/assets/images/crm/iconPlusWhite.png);
  background-repeat: no-repeat;
  background-position: 10px center;
}

div.basic dl dd .cke_chrome {
  background: #f7f7f7;
  background-image: none;
  box-shadow: none;
  border: 1px solid #ccc;
}

div.basic dl dd .cke_top {
  background: #f7f7f7;
  background-image: none;
  box-shadow: none;
  border-bottom: 1px solid #ccc;
}

div.basic dl dd .cke_bottom {
  display: none;
  background: #f7f7f7;
  background-image: none;
  box-shadow: none;
  border-top: 1px solid #ccc;
}

div.basic dl dd .cke_toolgroup, div.basic dl dd .cke_combo_button {
  border-radius: 0;
  background: #eaeaea;
  color: #666;
  background-image: none;
  box-shadow: none;
  border: 1px solid #ccc;
}

.btnNext {
  display: block;
  width: 38px;
  height: 21px;
  float: right;
  background: url(/assets/images/nextIcon.png) no-repeat center center;
}

.btnPrevious {
  display: block;
  width: 38px;
  height: 21px;
  float: right;
  background: url(/assets/images/previousIcon.png) no-repeat center center;
}

label.check,
label.radio {
  margin-right: 5px;
}

form small {
  color: #999;
}

form {
  overflow: hidden;
}

textarea, textarea.txt {
  background: #fff;
  border-radius: 0;
  border: 1px solid #ccc;
  padding: 10px;
  padding-right: 0;
  font-family: Arial;
  font-size: 12px;
  -webkit-appearance: none;
}

select.txt {
  padding: 4px 2px 4px 10px;
  background: #fff url(/assets/images/crm/ddl.png) no-repeat right center;
  height: 26px;
  -webkit-appearance: menulist;
}

select.txt.date, select.txt.add {
  background: #fff url(/assets/images/crm/ddl-plus.png) no-repeat right center;
}

.txt.warning {
  border: 1px solid #f2bd17 !important;
  color: #f2bd17 !important;
}

.msgContent input.date {
  width: 302px !important;
}

.msgContent select.txt {
  min-width: 200px;
}

div.basic span {
  color: #333;
}

input.error,
select.error,
textarea.error, input.warning.error, select.warning.error, div.basic dl dd .txt.error, div.basic dl dd textarea.txt.error, div.basic dl dd select.txt.error {
  border-color: #b70b0b;
  background: #fff;
}

span.loading {
  background: url("../images/crm/upload.gif") 0 50% no-repeat;
  padding: 3px 0 3px 20px;
}

ul.actions {
  margin: 0;
}

ul.actions li {
  display: inline;
  margin-right: 5px;
}

.box {
  float: none;
  width: 100%;
  margin-bottom: 20px;
}

.boxin {
  background: #fff;
}

.box .header {
  background: #e5e5e5;
  height: 50px;
}

.box .header h3 {
  position: relative;
  display: inline;
  color: #444444;
  font: normal normal normal 20px/50px Roboto, Arial;
  padding: 0 0 0 16px;
}

.box .header .button {
  margin-left: 15px;
}

.tabs {
  height: 35px;
  background: #444;
}

.tabs ul {
  display: block;
  float: left;
  margin: 0;
  height: 35px;
}

.tabs ul li {
  display: block;
  float: left;
  margin-top: 0;
  height: 35px;
}

.tabs ul a {
  display: block;
  padding: 0 14px 0 14px;
  font: normal normal bold 10px/35px Roboto, Arial;
  color: #fff;
  text-transform: uppercase;
  position: relative;
}

.tabs.tab-progress ul a {
  color: #ccc;
}

.tabs.tab-progress ul a:hover {
  background: #444;
  color: #ccc;
}

.tabs.tab-progress ul a.complete {
  color: #fff;
}

.tabs.tab-progress ul a.complete:hover {
  background: #444;
  color: #fff;
}

.tabs.tab-progress ul a.active:hover {
  background: #f7f7f7;
  color: #666;
}

.tabs ul a.active,
.tabs ul a:hover,
.tabs ul a:focus,
.tabs ul a:active {
  background: #f7f7f7;
  color: #666;
}

.box table .header {
  background: #f7f7f7;
  height: 30px;
  border-bottom: 1px solid #dedede;
}

.box table .header.h40 {
  height: 40px;
  border-bottom: solid 1px #ccc;
}

.box .stats table .header {
  background: #f7f7f7;
  height: 40px;
  border-bottom: 1px solid #ccc;
}

.box .stats .content table tr.header td {
  background: #f7f7f7;
  height: 40px;
  border-bottom: 1px solid #ccc;
}

.box .content table {
  width: 100%;
  font-size: 11px;
}

.box .content table th {
  padding: 10px 10px 8px 10px;
}

.box .content table td img {
  display: block;
}

.box .content table td.tc img {
  margin: auto;
}

.box .content table td {
  padding: 0px 10px 0px 10px;
  vertical-align: middle;
  height: 39px;
  font-size: 13px;
  border-bottom: 1px solid #f0f0f0;
  font-family: Roboto, Arial;
}

.box .content table tr.totals-row td {
  font-weight: bolder;
}

.box .content table td.light {
  color: #999;
}

.box .content table td em {
  color: #666;
  display: block;
  font-style: normal;
  font-size: 13px;
}

.box .content table tr.narrow td {
  height: 20px;
}

.box .content table th {
  text-align: left;
  font-weight: normal;
}

.box .content table th.first,
.box .content table td.first {
  padding-left: 20px;
}

.box .content table thead th, .box .content table thead td, .box .content table tr.header td, .box .content table tr.header td a, tr.header td a {
  height: 30px;
  font: normal normal normal 10px/12px Roboto, Arial;
  color: #666;
  vertical-align: middle;
}

.box .content table thead .h40 th, .box .content table thead .h40 td, .box .content table tr.header.h40 td, .box .content table tr.header.h40 td a, tr.header.h40 td a {
  height: 40px;
  border-bottom: solid 1px #ccc;
}

.box .content table tr.header td a.active, tr.header td a.active {
  font-weight: 700;
  color: #333;
}

.box .content table tbody tr.first th,
.box .content table tbody tr.first td {
  border-top: 1px solid #bbb;
}

.box .content table tr.summary td {
  background: #fff;
  border-top: 1px solid #bbb;
  font-weight: bold;
}

.box .content table tr.detail td {
  height: 20px;
  color: #666;
}

.box .content table a.ico-comms {
  border: 0;
  background: url("../images/crm/ico-tablecomms.gif") 50% 60% no-repeat;
  padding: 10px;
  color: #fff !important;
}

.box .content table tfoot th,
.box .content table tfoot td {
  border-top: 1px solid #ccc;
  background: #fff url("../images/crm/tfoot.gif") repeat-x;
}

.box .content ul.simple li {
  clear: both;
  padding: 10px 20px 8px 20px;
  overflow: hidden;
}

.box .content table tr.even th,
.box .content ul.simple li.even {
  background: #f5f5f5;
}

.box .content ul.simple strong {
  float: left;
  font-weight: normal;
}

.box .content ul.simple span {
  float: right;
}

.pagination {
  border-top: 1px solid #b2b2b2;
  background: #f7f7f7;
  text-align: center;
  color: #333 !important;
  padding: 0px 10px 10px 10px;
  min-height: 39px;
}

.pagination ul {
  position: relative;
  top: -1px;
  padding: 12px 10px 6px;
}

.pagination ul li {
  display: inline;
}

.pagination a {
  border: 0;
  background: #ebebeb;
  margin: 0 5px;
  padding: 6px 10px;
  color: #333 !important;
}

.pagination strong {
  padding: 15px 10px 8px;
}

.searchBox {
  margin: 15px 15px 0 0;
  display: block;
  height: 37px;
  width: 350px;
  font-family: Arial;
  font-size: 12px;
  float: right;
  color: #999;
  background: #3c3c3c;
  padding: 0px 2px 0 5px;
  text-transform: uppercase;
  border-radius: 3px;
  -moz-border-radius: 3px;
}

.searchBox span.search {
  background: none;
  border: none;
  line-height: 37px;
  font-family: Arial;
  font-size: 12px;
  color: #999;
  text-transform: none;
}

.searchBox a.search {
  display: block;
  float: right;
  background: #08c880;
  height: 31px;
}

.searchBox a.search span {
  display: block;
  height: 31px;
  width: 36px;
  background: url(../images/crm/magnifier.png) no-repeat 45% 50%;
}

.msg-error ul {
  display: none;
  visibility: hidden;
}

small.red {
  color: #ff3333;
}

.small {
  font-size: 10px !important;
}

td.small {
  width: 36px;
}

.subSection {
  height: 40px;
  background: #f7f7f7;
  border-bottom: solid 1px #ccc;
  font: normal normal normal 16px/40px Roboto, Arial;
  color: #666;
  padding-left: 11px;
}

.subSectionLight {
  height: 40px;
  background: #fcfcfc;
  border-bottom: solid 1px #ccc;
  font: normal normal normal 16px/40px Roboto, Arial;
  color: #666;
  padding-left: 11px;
}

.subSection a {
  margin-top: 5px !important;
}

.subSection a.weekPrevious, .subSection a.weekNext {
  margin-top: 1px !important;
}

.subSection a.btnMinPlus {
  display: block;
  width: 40px;
  height: 40px;
  background: none;
  margin: 0 !important;
}

.subSection a.btnMinPlus span {
  width: 40px;
  height: 40px;
  background: url(/assets/images/crm/actionIcons40.png) no-repeat right -200px;
}

.subSection a.btnMinPlus.min.plus span, .subSection a.btnMinPlus.plus span {
  width: 40px;
  height: 40px;
  background: url(/assets/images/crm/actionIcons40.png) no-repeat right -200px;
}

.subSection a.btnMinPlus.min span {
  width: 40px;
  height: 40px;
  background: url(/assets/images/crm/actionIcons40.png) no-repeat right -160px;
}

.subSection a.btnMinPlus.search {
  display: block;
  width: 40px;
  height: 40px;
  background: none;
  margin: 0 !important;
}

.subSection a.btnMinPlus.search span {
  width: 40px;
  height: 40px;
  background: url(/assets/images/crm/actionIcons40.png) no-repeat right top;
}

.subSection a.btnMinPlus.view span {
  width: 40px;
  height: 40px;
  background: url(/assets/images/crm/actionIcons40.png) no-repeat left -80px;
}

.subSection.white {
  background: #fff;
}

a.btnMinPlus {
  display: block;
  height: auto;
  background: #ff7f2c;
  float: right;
  margin: 4px 7px 0 0;
}

a.btnMinPlus.min span {
  display: block;
  height: 20px;
  width: 20px;
  background: url(../images/crm/fieldactions.png) no-repeat center -55px;
}

a.btnMinPlus.plus span {
  display: block;
  height: 20px;
  width: 20px;
  background: url(../images/crm/fieldactions.png) no-repeat center -29px;
}

td a.btnMinPlus.plus span {
  display: block;
  height: 32px;
  width: 32px;
  background: url(../images/crm/actionIcons.png) no-repeat center -259px;
}

a.btnMinPlus.add span {
  display: block;
  height: 26px;
  width: 26px;
  background: url(../images/crm/fieldactions.png) no-repeat center -26px;
}

a.btnMinPlus.export span {
  display: block;
  height: 20px;
  padding-left: 20px;
  background: url(../images/crm/exportIcon.png) no-repeat left center;
}

a.btnMinPlus.search span {
  display: block;
  height: 30px;
  width: 30px;
  background: url(../images/crm/fieldactions.png) no-repeat center top;
}

a.btnMinPlus.refresh span {
  display: block;
  height: 26px;
  width: 26px;
  background: url(../images/crm/fieldactions.png) no-repeat center -104px;
}

.subTitle {
  display: block;
  padding-top: 8px;
  padding-bottom: 5px;
  width: 100%;
  font-size: 14px;
  color: #666;
}

.smaller {
  width: 50% !important;
}

.msgContent dl dd a.btnMinPlus {
  margin: 0px;
  width: 31px;
  height: 30px;
  border: 1px solid #ccc;
  border-left: none;
  background: #fff;
}

.msgContent dl dd a.btnMinPlus span {
  display: block;
  height: 30px;
  width: 30px;
  background: url(../images/crm/fieldactions.png) no-repeat center top;
}

.msgContent dl dd a.btnMinPlus.add span, div.basic dl dd a.btnMinPlus.plus span {
  background-position: center -30px;
}

.msgContent dl dd a.btnMinPlus.min span {
  background-position: center -60px;
}

.msgContent dl dd a.btnMinPlus.date span {
  background-position: center -90px;
}

.msgContent dl dd textarea {
  width: 333px;
  height: 100px;
}

.header a.link {
  padding-top: 5px;
  text-decoration: underline;
  color: #999;
}

.overlay {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  background: url(../images/crm/blk80.png);
  z-index: 1001;
}

.overlayLight {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  min-height: 100%;
  min-width: 100%;
  bottom: 0px;
  z-index: 1000;
  overflow-y: auto;
  overflow-x: hidden;
}

.popUp {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -240px;
  margin-top: -120px;
}

.hdrBtn {
  display: block;
  float: left;
  width: 50px;
  height: 50px;
}

.tabs .hdrBtn, td.header .hdrBtn {
  display: block;
  float: left;
  width: 35px;
  height: 35px;
}

tr.header .hdrBtn {
  display: block;
  float: left;
  width: 30px;
  height: 30px;
}

.widgetbox .header .hdrBtn, .subSection .hdrBtn, .pagination .hdrBtn {
  padding: 2px 0 0;
  display: block;
  float: left;
  width: 40px;
  height: 40px;
  background: url(../images/crm/actionIcons40.png) no-repeat right top;
}

.pagination .hdrButtons {
  margin-top: -5px;
  margin-right: -6px;
}

.subSection a.hdrBtn {
  margin: 0 !important;
}

.hdrBtn.add {
  background: #08c880;
  position: relative;
}

.hdrBtn.add::before {
  display: block;
  position: absolute;
  left: 50%;
  top: 10px;
  width: 1px;
  bottom: 10px;
  background: #fff;
  content: "";
  transition: 0.3s;
}

.hdrBtn.add::after {
  position: absolute;
  display: block;
  content: "";
  background: #fff;
  top: 50%;
  left: 10px;
  right: 10px;
  height: 1px;
  transition: 0.3s;
}

.hdrBtn.add:hover::after {
  left: 5px;
  right: 5px;
  transition: 0.1s;
}

.hdrBtn.add:hover::before {
  top: 5px;
  bottom: 5px;
  transition: 0.1s;
}

.floatNone, .hdrBtn.add.floatNone {
  float: none;
  display: inline-block;
}

.hdrBtn {
  text-align: center;
}

.hdrBtn:after {
  font-size: 20px;
  line-height: 50px;
  font-family: "Material-Design-Iconic-Font";
  color: #777;
}

@-moz-keyframes spin {
  from {
    -moz-transform: rotate(0deg);
  }
  to {
    -moz-transform: rotate(360deg);
  }
}
@-webkit-keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
  }
}
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.hdrBtn.cancel {
  background: none;
}

.hdrBtn.cancel::after {
  content: "\f136";
}

.hdrBtn.save {
  background: none;
}

.hdrBtn.save::after {
  content: "\f0c7";
  font-family: "Font Awesome 5 Pro";
  font-weight: 300;
}

.hdrBtn.import {
  background: none;
}

.hdrBtn.import::after {
  content: "\f093";
  font-family: "Font Awesome 5 Pro";
  font-weight: 300;
}

.hdrBtn.export {
  background: none;
}

.hdrBtn.export::after {
  content: "\f019";
  font-family: "Font Awesome 5 Pro";
  font-weight: 300;
}

.hdrBtn.archive {
  background: none;
}

.hdrBtn.archive::after {
  content: "\f187";
  font-family: "Font Awesome 5 Pro";
  font-weight: 300;
}

.hdrBtn.search {
  background: none;
}

.hdrBtn.search::after {
  content: "\f1c3";
}

.hdrBtn.print, .hdrBtn.pdf {
  background: none;
  text-align: center;
  padding: 0;
  margin: 0;
}

.hdrBtn.print::after, .hdrBtn.pdf::after {
  content: "\f02f";
  font-family: "Font Awesome 5 Pro";
  font-weight: 300;
}

.hdrBtn.more {
  background: none;
}

.hdrBtn.more::after {
  content: "\f32f";
}

.hdrBtn.todo {
  background: none;
}

.hdrBtn.todo::after {
  content: "\f110";
}

.hdrBtn.detail {
  background: url(../images/crm/actionIcons.png) no-repeat center -500px;
}

.hdrBtn.detail {
  background: none;
}

.hdrBtn.detail::after {
  content: "\f1ee";
}

.hdrBtn.done {
  background: none;
}

.hdrBtn.done::after {
  content: "\f26b";
}

.hdrBtn.followUp {
  background: none;
}

.hdrBtn.followUp::after {
  content: "\f3b2";
}

.hdrBtn.email {
  background: none;
  text-align: center;
  padding: 0;
  margin: 0;
}

.hdrBtn.email::after {
  content: "\f0e0";
  font-family: "Font Awesome 5 Pro";
  font-weight: 300;
}

.hdrBtn.payment {
  background: none;
  text-align: center;
  padding: 0;
  margin: 0;
}

.hdrBtn.payment::after {
  content: "\f19a";
  font: normal normal normal 18px/20px "Material-Design-Iconic-Font";
  color: #777;
  width: 20px;
  border: 2px solid #777;
  border-radius: 30px;
  display: inline-block;
  margin-top: 13px;
}

.hdrBtn.reminder {
  background: none;
}

.hdrBtn.reminder::after {
  content: "\f337";
}

.hdrBtn.transfer {
  background: url(../images/crm/actionIcons.png) no-repeat center -800px;
}

.hdrBtn.refresh {
  background: none;
}

.hdrBtn.refresh::after {
  content: "\f1b9";
}

.hdrBtn.reset-time {
  background: none;
}

.hdrBtn.reset-time::after {
  content: "\f273";
  font-family: "Font Awesome 5 Pro";
  font-weight: 300;
}

.hdrBtn.refresh.busy {
  -webkit-animation-name: spin;
  -webkit-animation-duration: 4000ms;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  -moz-animation-name: spin;
  -moz-animation-duration: 4000ms;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: spin;
  -ms-animation-duration: 4000ms;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  animation-name: spin;
  animation-duration: 4000ms;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

.hdrBtn.delete {
  background: none;
  text-align: center;
  padding: 0;
  margin: 0;
}

.hdrBtn.delete::after {
  content: "\f2ed";
  font-family: "Font Awesome 5 Pro";
  font-weight: 300;
}

.hdrBtn.invoice {
  background: none;
  position: relative;
}

.hdrBtn.invoice::after {
  content: "\f198";
  font-size: 25px;
}

.hdrBtn.order {
  background: none;
  text-align: center;
  padding: 0;
  margin: 0;
}

.hdrBtn.order::after {
  content: "\f15c";
  font-family: "Font Awesome 5 Pro";
  font-weight: 300;
}

.hdrBtn.copycar {
  background: none;
}

.hdrBtn.copycar::after {
  content: "\f237";
}

.hdrBtn.create::after {
  content: "\f0fe";
  font-family: "Font Awesome 5 Pro";
  font-weight: 300;
}

.hdrBtn.previous {
  background: none;
}

.hdrBtn.previous::after {
  content: "\f2fa";
}

.hdrBtn.next {
  background: none;
}

.hdrBtn.next::after {
  content: "\f2fb";
}

.hdrBtn.edit {
  background: none;
}

.hdrBtn.edit::after {
  content: "\f158";
}

.hdrBtn.copylink {
  background: none;
}

.hdrBtn.copylink::after {
  content: "\f1c6";
  font-family: "Font Awesome 5 Pro";
  font-weight: 300;
}

.hdrBtn.b2blink {
  background: none;
}

.hdrBtn.b2blink::after {
  content: "\f21b";
  font-family: "Font Awesome 5 Pro";
  font-weight: 300;
}

.hdrBtn::after {
  transition: 0.2s;
  color: #777777;
}

.hdrBtn:hover::after {
  color: #111;
  transition: 0.3s;
}

.hdrBtn.payment:hover::after {
  border-color: #333;
}

.widgetbox .header .hdrBtn, .subSection .hdrBtn, .pagination .hdrBtn {
  background: none;
}

.widgetbox .header .hdrBtn.add, .subSection .hdrBtn.add, .pagination .hdrBtn.add {
  background: #08c880;
}

.widgetbox .header .hdrBtn::after, .subSection .hdrBtn::after, .pagination .hdrBtn::after {
  line-height: 42px;
}

.subSection .hdrDevider {
  width: 1px;
  height: 40px;
  background: #cccccc;
}

.hdrDevider {
  display: block;
  float: left;
  width: 0px;
}

.hdrButtons {
  float: right;
}

.select-spacing {
  height: 40px;
  width: 5px;
  float: left;
}

.header select, .header input {
  margin-top: 5px !important;
  border: 1px solid #CCC;
  background-color: #fff;
  color: #444444;
  font: normal normal normal 13px/24px Roboto, Arial;
  padding: 5px;
  border-radius: 5px;
  box-sizing: border-box;
  height: 36px;
}

.header .ui-datepicker-trigger {
  margin-top: 4px !important;
}

.floatLeft {
  float: left !important;
}

.logoSmall {
  display: block;
  height: 50px;
  width: 230px;
  padding-bottom: 10px;
  background: url(../images/crm/logoSmall.png) no-repeat;
}

.offerDate span {
  padding-top: 3px;
  float: left;
  font-size: 18px;
}

div.basic INPUT.txt.offerDateSelect {
  float: left;
  margin-left: 17px;
  width: 138px !important;
}

div.basic dt label {
  white-space: nowrap;
}

.salesDropdown {
  padding: 10px 0 10px 0;
}

.smallFont {
  font-size: 11px;
  color: #666;
}

a.btnGreen {
  display: block;
  height: 37px;
  background: #08c880;
  float: right;
  margin: 4px 7px 0 0;
  padding: 0 10px 0 10px;
  color: #fff !important;
  text-decoration: none;
}

a.btnGreen.next {
  margin: 0;
  float: left;
  background: #08c880 url(/assets/images/crm/arrowNextWhite.png) no-repeat right center;
  height: 35px;
  padding: 2px 45px 0 20px;
  font: normal normal normal 13px/35px "Roboto", Arial;
  text-transform: uppercase;
  color: #fff !important;
  text-decoration: none;
}

a.btnGreen.inline-left {
  display: inline-block;
  float: none;
}

.btnGreen span.iconMail {
  height: 37px;
  padding: 0px 20px 0 25px;
  display: inline-block;
  margin: 0px 0 0 17px;
  color: #fff !important;
  text-transform: uppercase;
  font-weight: normal;
  font: normal normal normal 13px/37px "Roboto", Arial;
}

a.btnRed {
  position: absolute;
  right: 10px;
  top: 30px;
  display: block;
  color: #cf000f;
  text-transform: uppercase;
  text-decoration: underline;
}

a.btnRed span {
  display: block;
  line-height: 20px;
  padding: 0 10px 0 10px;
  color: #ff7c2d;
  text-transform: uppercase;
  text-decoration: underline;
}

a.btnGreen span {
  display: block;
  line-height: 37px;
  padding: 0;
  color: #fff;
  text-transform: uppercase;
}

a.btnGreen.iconSaveWhite span, a.btnGreen span.iconSaveWhite {
  display: block;
  height: 37px;
  width: 40px;
  background: url(../images/crm/iconSaveWhite.png) no-repeat center center;
}

a.btnGreen27, div.btnGreen27 {
  display: inline-block;
  height: 37px;
  background: #08c880;
  margin: 0px 7px 0 0;
  padding: 0px 20px 0 20px;
  line-height: 37px;
  color: #fff !important;
  font: normal normal 400 13px/37px Roboto, Arial;
  border-radius: 3px;
}

a.btnNoBg27, .basic a.btnNoBg27 {
  display: inline-block;
  height: 35px;
  margin: 0px 7px 0 0;
  padding: 0px 19px 0 19px;
  line-height: 35px;
  color: #999 !important;
  font: normal normal 400 13px/35px Roboto, Arial;
  text-decoration: none;
  border-radius: 3px;
  border: 1px solid #999;
}

.btnGreen27.align-left, .btnNoBg27.align-left, .basic a.btnNoBg27.align-left {
  display: block;
  float: left;
  margin-top: 3px;
}

a.btnGreen27 span, div.btnGreen27 span {
  color: #fff;
  font: normal normal 400 14px/27px Roboto, Arial;
}

a.btnNoBg27:hover, .basic a.btnNoBg27:hover {
  text-decoration: none !important;
  color: #333 !important;
  border-color: #333;
}

a.btnGreen23 {
  display: block;
  height: 23px;
  background: #08c880;
  float: right;
  margin: 0px 7px 0 0;
  padding: 0px;
  line-height: 23px;
  color: #fff !important;
}

a.btnGreen23 span {
  padding: 0px 5px 0 5px;
  font-weight: bold;
}

a.btnGreen23.iconPlus span {
  padding: 0px;
  display: block;
  height: 23px;
  width: 25px;
  background: url(../images/crm/plus.png) no-repeat center center;
}

a.btnRed27 {
  display: block;
  height: 37px;
  background: #cf000f;
  float: right;
  margin: 0px 7px 0 0;
  padding: 0px 20px 0 20px;
  line-height: 37px;
  color: #fff !important;
  font: normal normal 400 13px/37px Roboto, Arial;
}

a.btnRed27.tc100, a.btnGreen27.tc100 {
  min-width: 60px;
  display: inline-block;
  float: none;
}

a.btnRed27 span {
  padding: 0px 5px 0 5px;
  font-weight: bold;
}

a.btnRed27:hover, .pagination a.btnRed27:hover {
  color: #fff !important;
}

a.btnGrey27 {
  display: block;
  height: 37px;
  background: #ccc;
  float: right;
  margin: 0px 7px 0 0;
  padding: 0px 20px 0 20px;
  line-height: 37px;
  color: #333 !important;
  font: normal normal 400 13px/37px Roboto, Arial;
}

a.btnGrey27.tc100 {
  min-width: 60px;
  display: inline-block;
  float: none;
}

a.btnGrey27 span {
  padding: 0px 5px 0 5px;
  font-weight: bold;
}

a.btnGrey27:hover {
  color: #000 !important;
}

a.btnGreen27:hover, .pagination a.btnGreen27:hover {
  color: #fff !important;
}

a.btnGreen27.iconSaveWhite span, a.btnGreen.iconSaveWhite span {
  padding: 0px;
  display: block;
  height: 50px;
  width: 50px;
  background: #ff7f2c;
}

a.btnGreen27.iconPlus, a.btnGreen27.iconSearch, a.btnGreen27.iconRefresh, a.btnGreen27.iconNext, a.btnRed27.iconPrevious, a.btnGreen27.iconSaveWhite, a.btnGreen.iconSaveWhite {
  border-radius: 0px;
  width: 50px;
  height: 50px;
  margin: 0;
  padding: 0;
  background: #ff7f2c;
}

a.btnGreen27.iconPlus span {
  padding: 0px;
  display: block;
  height: 50px;
  width: 50px;
  position: relative;
}

a.btnGreen27.iconPlus span::before {
  display: block;
  position: absolute;
  left: 50%;
  top: 15px;
  width: 1px;
  bottom: 15px;
  background: #fff;
  content: "";
  transition: 0.3s;
}

.header td a.btnGreen27.iconPlus span::before {
  top: 5px;
  bottom: 5px;
}

a.btnGreen27.iconPlus span::after {
  position: absolute;
  display: block;
  content: "";
  background: #fff;
  top: 50%;
  left: 15px;
  right: 15px;
  height: 1px;
  transition: 0.3s;
}

.header td a.btnGreen27.iconPlus span::after {
  left: 5px;
  right: 5px;
}

a.btnGreen27.iconPlus span:hover::after {
  left: 10px;
  right: 10px;
  transition: 0.1s;
}

a.btnGreen27.iconPlus span:hover::before {
  top: 10px;
  bottom: 10px;
  transition: 0.1s;
}

.header td a.btnGreen27.iconPlus span:hover::after {
  left: 3px;
  right: 3px;
}

.header td a.btnGreen27.iconPlus span:hover::before {
  top: 3px;
  bottom: 3px;
}

.header td a.btnGreen27.iconPlus {
  width: 30px;
  height: 30px;
}

.header td a.btnGreen27.iconPlus span {
  width: 30px;
  height: 30px;
}

a.btnGreen27.iconRefresh span {
  padding: 0px;
  display: block;
  height: 50px;
  width: 50px;
  background: url(../images/crm/refresh.png) no-repeat center center;
}

a.btnGreen27.iconSearch span {
  padding: 0px;
  display: block;
  height: 50px;
  width: 50px;
  background: url(../images/crm/magnifierWhite.png) no-repeat center center;
}

a.btnGreen27.iconNext span {
  padding: 0px;
  display: block;
  height: 50px;
  width: 50px;
  background: url(../images/crm/arrowRightWhite.png) no-repeat center center;
}

a.btnRed27.iconPrevious span {
  padding: 0px;
  display: block;
  height: 50px;
  width: 50px;
  background: url(../images/crm/arrowLeftWhite.png) no-repeat center center;
}

.twoCol td {
  width: 40%;
  color: #666;
  padding-bottom: 15px;
}

.twoCol td.label {
  width: 10%;
  color: #999;
  vertical-align: top;
  text-align: right;
  padding-right: 5px;
}

.box .content table td.noPadding {
  padding: 0px 0px 0px 0px !important;
}

span#btnCancel a {
  float: left !important;
  margin-left: 0;
  clear: both !important;
}

a.btnDeleteImg {
  float: right;
  background: url(../images/crm/delete.png);
  display: block;
  width: 16px;
  height: 16px;
  text-decoration: none;
  margin: 2px 2px 0 0;
}

a.btnEditImg {
  float: left;
  background: url(../images/crm/iconEditGreen.png);
  display: block;
  width: 16px;
  height: 16px;
  text-decoration: none;
  margin: 2px 0 0 2px;
}

table.AddImgHolder {
  border: solid 1px #FFF;
  width: 138px !important;
  height: 138px;
  background-color: #F0F0F0;
  margin: 2px;
  float: left;
}

table.AddImgHolder td {
  padding: 0px !important;
}

table.AddImgHolder img {
  display: block;
  margin: auto;
}

table.AddImgHolder label {
  position: relative;
  top: 0;
  padding-left: 3px;
  font-size: 10px;
}

.AjaxUploaderQueueTable {
  margin-top: 40px;
}

.profile {
  float: left;
  margin-top: 1px;
  display: block;
  width: 37px;
  height: 35px;
  border-left: 1px solid #333;
  background: url(../images/topIcons.png) no-repeat top left;
}

.adminA {
  float: left;
  margin-top: 1px;
  display: block;
  width: 63px;
  height: 35px;
  background: url(../images/crm/admin.png) no-repeat 50% 50%;
}

.admin {
  float: left;
  margin-top: 1px;
  display: block;
  width: 63px;
  height: 35px;
  background: url(../images/crm/adminOff.png) no-repeat 50% 50%;
}

.profile:hover {
  background: url(../images/topIcons.png) no-repeat bottom left;
  border-left: 1px solid #333;
}

table.stats {
  background: #fff;
  width: 100%;
}

.widgetbox .wboxin table.stats tr.header, .widgetbox .wboxin table.mostviewed tr.header, .widgetbox .wboxin table.offeredcar tr.header, .widgetbox .wboxin table.auctiondata tr.header {
  height: 32px;
}

table.stats tr.header td, .mostviewed tr.header td, .offeredcar tr.header td, .auctiondata tr.header td {
  height: 29px;
  background: #f7f7f7;
  font: normal normal normal 10px/29px Roboto, Arial;
  color: #666;
  border-left: 1px solid #dedede;
  text-align: center;
  padding: 0 10px 0 10px;
  white-space: nowrap;
}

table.stats tr.header td.first {
  padding-left: 15px;
  border-left: none;
  text-align: left;
  width: 90%;
  white-space: nowrap;
}

.mostviewed tbody tr td.first, .auctiondata tbody tr td.first {
  padding: 9px 10px 0 10px;
}

.w66 .mostviewed tbody tr, .w66 .offeredcar tbody tr, .w100 .auctiondata tbody tr, .w80 .auctiondata tbody tr {
  height: 30px;
}

.w66 .mostviewed tbody tr td, .w66 .offeredcar tbody tr td, .w100 .auctiondata tbody tr td, .w80 .auctiondata tbody tr td {
  height: 29px;
  padding: 0 10px 0 10px;
  vertical-align: middle;
}

.w66 .mostviewed tbody tr td.first, .w66 .offeredcar tbody tr td.first, .w100 .auctiondata tbody tr td.first, .w80 .auctiondata tbody tr td.first {
  height: 26px;
  padding: 0 10px 0 10px;
  vertical-align: middle;
  line-height: 0;
  font-size: 0;
}

table.stats tbody td {
  padding: 0px 0px 0px 0px;
  height: 38px;
  font: normal normal normal 12px/38px Roboto, Arial;
  color: #666;
  border-top: 1px solid #dedede;
  white-space: nowrap;
}

table.stats tbody td.first {
  vertical-align: middle;
  padding-left: 8px;
}

table.stats tbody td img {
  margin-left: 15px;
}

table.stats td.first span {
  display: block;
  min-height: 38px;
  font: normal normal normal 12px/38px Roboto, Arial;
  color: #666;
  padding: 0 0 0 37px;
  background: url(/assets/images/crm/iconCarsOnline.png) no-repeat left center;
}

table.stats td.first span.ttCarsViewed {
  background: url(/assets/images/crm/iconSearchPlus.png) no-repeat left center;
}

table.stats td.first span.ttVisitors {
  background: url(/assets/images/crm/iconOnline.png) no-repeat left center;
}

table.stats td.first span.tt1 {
  background: url(/assets/images/crm/TaskType1.png) no-repeat left center;
}

table.stats td.first span.tt2 {
  background: url(/assets/images/crm/TaskType2.png) no-repeat left center;
}

table.stats td.first span.tt10 {
  background: url(/assets/images/crm/TaskType10.png) no-repeat left center;
}

table.stats td.first span.ttNotSold {
  background: url(/assets/images/crm/iconSales.png) no-repeat left center;
}

.small {
  font-size: 11px;
}

.subSection select {
  margin-top: 2px;
}

.red {
  color: #ff7c2d;
}

.ui-sortable {
  background: none;
}

.frmOption .ui-state-default {
  height: 20px;
  width: 340px;
  font-size: 11px;
  float: left;
  margin-left: 20px;
  margin-right: 10px;
  line-height: 20px;
  background: url(../images/crm/optionsHover.png) top left;
  border-bottom: 1px solid #ebebeb;
}

.ui-state-default {
  height: 20px;
  font: normal normal normal 12px/20px Arial, Helvetica, sans;
  padding: 0 0 0 10px;
}

.frmOption dt {
  width: 18%;
  display: flex;
  text-align: right;
  float: left;
  margin: 0;
  padding: 0 20px 0 0;
  color: #999999;
  min-height: 32px;
  font-size: 11px;
  justify-content: flex-end;
  align-items: center;
}

.frmOption dd {
  width: 75%;
  display: block;
  float: left;
  padding: 0;
  margin: 0;
  min-height: 36px;
}

.frmOption .txt {
  width: 100%;
  margin-bottom: 2px;
}

.frmOption input.txt.flu {
  height: 20px;
}

.boxOption {
  position: relative;
  margin: 100px auto 10px auto;
  width: 500px;
  height: auto;
  background: #fff;
  font-size: 11px;
  color: #333;
  box-shadow: #333 0 0 10px;
  -webkit-box-shadow: #333 0 0 10px;
  -moz-box-shadow: #333 0 0 10px;
  border: 1px solid #999;
}

.msgBox {
  position: fixed;
  top: 150px;
  left: 50%;
  width: 500px;
  height: auto;
  margin-left: -250px;
  background: #fff;
  font-size: 11px;
  color: #333;
  box-shadow: #333 0 0 10px;
  -webkit-box-shadow: #333 0 0 10px;
  -moz-box-shadow: #333 0 0 10px;
  border: 1px solid #999;
  border-radius: 4px;
}

.msgHeader {
  display: block;
  position: relative;
  width: 460px;
  height: 69px;
  font-family: Arial;
  font-size: 20px !important;
  color: #ff7c2d;
  line-height: 69px;
  padding: 0px 20px 0 20px;
}

.msgHeader span {
  font-size: 20px !important;
}

a.msgClose {
  position: absolute;
  right: 20px;
  top: 20px;
  display: block;
  width: 20px;
  height: 20px;
}

a.msgClose::after {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  text-align: center;
  font-family: "Font Awesome 5 Pro";
  content: "\f00d";
  color: #ccc;
  font-size: 16px;
  line-height: 20px;
}

.msgBox a.btnRed27.tc100, .msgBox a.btnGreen27.tc100 {
  border-radius: 4px;
  box-sizing: border-box;
  min-width: 100px;
}

.msgBox a.btnRed27.tc100 {
  background: none;
  border: 1px solid #ccc;
  color: #777 !important;
}

.msgBox a.btnRed27.tc100 span {
  color: #777 !important;
}

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

.msgContent p {
  padding: 0 0 10px 0;
  font-size: 12px;
}

.msgContent.paddingLeft p {
  padding-left: 104px;
}

.boxOption hr {
  display: block;
  margin: 10px -20px 10px -20px;
  border: none;
  border-bottom: 1px solid #e9e9e9;
  width: 500px;
  height: 1px;
}

.boxOption .msgFooter {
  display: block;
  text-align: center;
  position: relative;
  width: 460px;
  height: 38px;
  border-top: 1px solid #e9e9e9;
  padding: 16px 20px 20px 20px;
}

.msgBox .msgFooter {
  display: block;
  text-align: center;
  position: relative;
  width: 460px;
  height: 37px;
  margin-top: 10px;
  border-top: 1px solid #e9e9e9;
  padding: 16px 20px 10px 20px;
}

.tblStats {
  width: 100%;
}

.box .content table td.statsLeft, .box .content table td.cmsLeft {
  background: #f7f7f7;
  padding: 0 0 20px 0;
  width: 200px;
  vertical-align: top;
}

.box .content table td.statsLeft .basic {
  width: 164px;
}

.box .content table td.statsRight {
  vertical-align: top;
  width: auto;
  padding: 0;
}

.cms, .stats {
  background: #fff;
}

.graph .overlay {
  position: inherit;
  background: none;
}

table.sold dl dt {
  width: 15%;
}

td.top {
  vertical-align: top;
}

#progress {
  background-color: #CF4342;
  color: #fff;
  top: 0px;
  right: 0px;
  position: fixed;
}

#progress img {
  vertical-align: middle;
  margin: 2px;
}

.statsLeft td.statsHeader {
  height: 35px;
  font-size: 14px;
  line-height: 35px;
  border-bottom: 1px solid #ccc;
}

.statsLeft tr.header td {
  border-bottom: 1px solid #ccc;
}

.statsLeft table tbody td {
  border-bottom: 1px solid #fff;
}

span.hTime {
  display: block;
  height: 30px;
  background: url("../images/crm/timeIcon.png") no-repeat left center;
  line-height: 30px;
  padding-left: 30px;
}

span.hStats {
  display: block;
  height: 30px;
  background: url("../images/crm/statsIcon.png") no-repeat left center;
  line-height: 30px;
  padding-left: 30px;
}

span.hSales {
  display: block;
  height: 30px;
  background: url("../images/crm/salesIcon.png") no-repeat left center;
  padding-left: 30px;
  line-height: 30px;
}

span.hCars {
  display: block;
  height: 30px;
  background: url("../images/crm/carIcon.png") no-repeat left center;
  padding-left: 30px;
  line-height: 30px;
}

span.hPeople {
  display: block;
  height: 30px;
  background: url("../images/crm/peopleIcon.png") no-repeat left center;
  padding-left: 30px;
  line-height: 30px;
}

span.legend {
  display: block;
  padding-left: 30px;
  font-size: 11px;
  padding: 0 0 0 11px;
  margin: 6px 0 10px 0;
  float: left;
}

span.space {
  padding-right: 10px;
}

span.legend.red {
  background: url("../images/crm/bulletRed.png") no-repeat left center;
}

span.legend.green {
  background: url("../images/crm/bulletGreen.png") no-repeat left center;
}

span.legend.blue {
  background: url("../images/crm/bulletBlue.png") no-repeat left center;
}

img.btnDivider {
  float: left;
}

.subscribe {
  display: inline-block;
  width: 20px;
  height: 39px;
  background: url(/assets/images/crm/mailStatus.png) no-repeat center top;
}

span.subscribe.active {
  display: inline-block;
  width: 20px;
  height: 39px;
  background: url(/assets/images/crm/mailStatus.png) no-repeat center top;
  background-position: center -39px;
  border-radius: 0;
}

.subscribe.unsubscribe {
  background-position: center -78px;
}

.pnl.margin {
  padding-left: 10px;
}

.fixed .pnl {
  padding-bottom: 50px;
}

.fixed .pagination {
  position: fixed;
  bottom: 0;
  left: 50px;
  right: 0;
  z-index: 1;
  padding-bottom: 10px;
}

.fixed .pagination.relative {
  position: relative;
  left: 0;
}

table.mailer tr td.SearchBox div, div.SearchBox {
  background: #ccc;
  position: relative;
  height: 40px;
  padding: 4px 4px 4px 4px;
  margin: 0px;
}

table.mailer tr td.SearchBox div input, div.SearchBox input {
  background: #fff;
  border: none;
  font-size: 12px;
  color: #666;
  height: 40px;
  line-height: 16px;
  padding: 0 30px 0 5px;
  border-radius: 0px;
  -moz-border-radius: 0px;
  float: right;
  display: block;
  width: 270px;
}

div.SearchBox input {
  background: #fff;
  border: none;
  font-size: 12px;
  color: #666;
  height: 40px;
  line-height: 40px;
  padding: 0 0 0 10px;
  border-radius: 0px;
  float: left;
  display: block;
  width: 244px;
  margin-right: 4px;
}

.SearchBox select, .SearchBox .control-holder {
  box-sizing: border-box;
  background-color: #fff;
  border: none;
  font-size: 12px;
  color: #666;
  height: 40px;
  line-height: 17px;
  margin: 0 5px 0 0;
  padding: 10px 5px 11px 5px;
  border-radius: 0px;
  float: left;
  display: block;
  width: 155px;
}

div.SearchBox a.btnResetBox {
  display: block;
  position: absolute;
  top: 4px;
  right: 4px;
  width: 40px;
  height: 40px;
  color: #777;
}

div.SearchBox a.btnResetBox::after {
  content: "\f0e2";
  font-family: "Font Awesome 5 Pro";
  font-size: 20px;
  line-height: 34px;
  padding: 0 14px;
}

div.SearchBox a.btnSearchBox {
  display: block;
  position: absolute;
  top: 4px;
  right: 48px;
  width: 40px;
  height: 40px;
  color: #777;
}

div.SearchBox a.btnSearchBox::after {
  content: "\f1c3";
  font-family: Material-Design-Iconic-Font;
  font-size: 20px;
  line-height: 34px;
}

div.SearchBox.new a.btnSearchBox {
  top: 1px;
  right: 1px;
  width: 34px;
  height: 34px;
  text-align: center;
  background: none;
  color: #999;
  z-index: 1;
}

div.SearchBox.new a.btnSearchBox::after {
  content: "\f1c3";
  font-family: Material-Design-Iconic-Font;
  font-size: 20px;
  line-height: 34px;
}

div.SearchBox.new.inline a.btnSearchBox {
  height: 34px;
}

div.SearchBox.new.inline a.btnSearchBox::after {
  line-height: 34px;
}

div.SearchBox.new.inline .input-holder {
  border-color: #ccc;
}

.subSectionLight.has-search {
  height: auto;
}

div.SearchBox.new.inline {
  background: none;
  padding: 10px 50px 10px 0;
}

div.SearchBox.new.inline a.btnResetBox {
  top: 9px;
  right: 15px;
  width: 34px;
  height: 34px;
  border: 1px solid #ccc;
  border-radius: 4px;
  background: #e5e5e5;
  background: -moz-linear-gradient(top, rgb(255, 255, 255) 0%, rgb(229, 229, 229) 100%);
  background: -webkit-linear-gradient(top, rgb(255, 255, 255) 0%, rgb(229, 229, 229) 100%);
  background: linear-gradient(to bottom, rgb(255, 255, 255) 0%, rgb(229, 229, 229) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff", endColorstr="#e5e5e5",GradientType=0 );
  text-align: center;
  font-size: 20px;
  line-height: 34px;
  box-sizing: border-box;
  color: rgba(0, 0, 0, 0.4);
  transition: 0.3s;
}

div.SearchBox.new.inline a.btnResetBox:hover {
  background: #e5e5e5;
  transition: 0.3s;
}

div.SearchBox.new.inline .select2-container {
  margin-right: 5px;
  display: block;
  float: left;
}

div.SearchBox.new.inline select, div.SearchBox.new.inline .input-holder {
  width: auto !important;
  float: left;
  min-width: 200px;
}

div.SearchBox .searchBox-holder a.btnSearchBox, div.SearchBox .searchBox-holder a.btnResetBox {
  top: auto;
  right: auto;
  position: relative;
  float: left;
}

table.tablesorter tr td {
  border-bottom: 1px dotted #f4f4f4;
  height: 28px !important;
  padding: 0 !important;
}

div.dropdown {
  position: relative;
  display: block;
  width: 145px;
  height: 40px;
  float: left;
  padding-left: 10px;
  padding-right: 15px;
  line-height: 40px;
  font-size: 12px;
  color: #fff;
  text-transform: capitalize;
  background: url(../images/crm/searchddlBg.png) no-repeat top right;
  border-radius: 3px;
  -moz-border-radius: 3px;
}

.ddlBox {
  position: absolute;
  display: block;
  z-index: 2000;
  top: 37px;
  left: 0px;
  height: auto;
  width: 170px;
  margin: 0;
  list-style: none;
  background: #191919;
  max-height: 400px;
  overflow-y: auto;
  overflow-x: hidden;
}

.ddlBox a.item {
  float: none;
  list-style: none;
  height: 24px;
  padding: 0;
  margin: 0;
  display: block;
  width: 150px;
  line-height: 24px;
  border: none;
  padding: 0 10px 0 10px;
  margin: 0;
  color: #9b9b9b;
  background: #191919 none;
  text-transform: capitalize;
}

.ddlBox a.item:hover {
  background: #2b2b2b;
}

div.SearchBox {
  background: #ccc;
  position: relative;
  height: auto;
  padding: 4px;
  margin: 0px;
  position: relative;
  padding-right: 92px;
}

div.SearchBox.new {
  padding-right: 46px;
}

div.SearchBox::after {
  content: "";
  display: block;
  clear: both;
  float: none;
}

div.SearchBox input, div.SearchBox select, div.SearchBox .control-holder {
  border: 2px solid #888;
  width: 25% !important;
  margin: 0;
  box-sizing: border-box;
}

div.SearchBox .control-holder {
  background: #fff;
  padding: 0 40px 0 0;
  position: relative;
}

div.SearchBox .control-holder input {
  line-height: 36px;
  height: 36px;
  width: 100% !important;
  border: none;
  margin: 0;
}

div.SearchBox .control-holder a {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 40px;
  line-height: 40px;
  font-size: 20px;
  color: #333;
  text-decoration: none;
  text-align: center;
}

div.SearchBox .input-holder {
  position: relative;
  width: 100%;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 5px;
  box-sizing: border-box;
  height: 36px;
}

div.SearchBox .ddl-col {
  width: 25%;
  float: left;
  padding: 1px;
  box-sizing: border-box;
}

div.SearchBox.new .ddl-col {
  width: 20%;
}

div.SearchBox.col5 .ddl-col {
  width: 20%;
}

div.SearchBox.new.col6 .ddl-col {
  width: 16.66%;
}

div.SearchBox .input-holder input, div.SearchBox .ddl-col select {
  width: 100% !important;
  float: none;
}

div.SearchBox .input-holder input {
  border: 0;
  height: 34px;
  line-height: 34px;
  border-radius: 5px;
}

div.SearchBox.multiCol select, div.SearchBox.multiCol input {
  width: 20% !important;
}

div.SearchBox.multiCol.col6 select, div.SearchBox.multiCol.col6 input {
  width: 16.66% !important;
}

@media all and (max-width: 700px) {
  div.SearchBox input, div.SearchBox select, div.SearchBox.multiCol select, div.SearchBox.multiCol input {
    width: 50% !important;
  }
  div.SearchBox.multiCol.col6 select, div.SearchBox.multiCol.col6 input {
    width: 33.33% !important;
  }
}
@media all and (max-width: 400px) {
  div.SearchBox input, div.SearchBox select, div.SearchBox.multiCol select, div.SearchBox.multiCol input, div.SearchBox.multiCol.col6 select, div.SearchBox.multiCol.col6 input {
    width: 100% !important;
  }
}
.ddlHolder {
  position: relative;
  display: block;
  height: auto;
  width: 170px;
  float: left;
  margin-right: 5px;
}

.hand, .hand td {
  cursor: pointer;
  background: #f2f2f2 !important;
}

handCur, .handCur td, .hover tr td {
  cursor: pointer;
}

tr.header.hand, tr.header.hand td {
  cursor: pointer;
  background: #666 url(../images/crm/tableHeaderBg.png) no-repeat right bottom !important;
}

.carSearchBox {
  width: 688px;
  border: 1px solid #999;
  border-radius: 3px;
  -moz-border-radius: 3px;
  margin-top: 15px;
}

.sHeader {
  background: #3d3d3d;
  margin: -1px -1px 0px -1px;
  border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  height: 34px;
}

.sContent {
  padding-bottom: 10px;
}

.sHeader h3 {
  margin: 4px 0 0 10px;
  color: #fff;
}

.textfieldTrefwoord {
  display: block;
  height: 29px;
  border-radius: 3px;
  -moz-border-radius: 3px;
  padding: 3px 3px 3px 10px;
  border: 1px solid #ccc;
  background: url(../images/crm/carSearchInputBg.png) repeat-x;
  margin: 10px;
  width: 653px;
}

.content table td.tdBig {
  padding: 0 37px 3px 10px;
  width: 310px;
}

.content table td.tdSmall {
  padding: 0 2px 3px 0;
  width: 160px;
}

.content table td.tdBig .dropdown, .content table td.tdSmall .dropdown {
  padding: 3px;
  border: 1px solid #ccc;
  background: #fff;
}

.content table td.tdBig .dropdown {
  width: 310px;
}

.content table td.tdSmall .dropdown {
  width: 160px;
}

.content table td.tdButtons {
  padding: 0px;
}

.positionSearchButton {
  float: right;
}

.positionSearchButton a {
  height: 27px;
  line-height: 27px;
  font-size: 12px;
  color: #fff;
  font-weight: bold;
  display: block;
  float: left;
  padding: 0;
  margin: 0px;
  width: 75px;
  text-align: center;
}

.positionSearchButton a.btnReset {
  border-radius: 3px 0 0 3px;
  -moz-border-radius: 3px 0 0 3px;
  background: url(../images/crm/searchResetBg.png) repeat-x;
}

.positionSearchButton a.btnSearch {
  border-radius: 0 3px 3px 0;
  -moz-border-radius: 0 3px 3px 0;
  background: url(../images/crm/carSearchBg.png) repeat-x;
}

.box .content table.carResult td {
  padding: 0px;
}

.conflict td {
  color: #ff0000 !important;
}

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

.weekPrevious {
  display: block;
  float: left;
  height: 28px;
  width: 29px;
  border: 1px solid #999;
  border-right: none;
  background: url(../images/crm/btnLeft.png) no-repeat;
}

.weekNext {
  display: block;
  float: left;
  height: 28px;
  width: 29px;
  border: 1px solid #999;
  border-left: none;
  background: url(../images/crm/btnRight.png) no-repeat;
}

.weekPeriod {
  display: block;
  float: left;
  height: 28px;
  width: 150px;
  border: 1px solid #999;
  background: #fff;
  line-height: 28px;
  padding-top: 0px;
  font-size: 12px;
  text-align: center;
}

dl.checkList dd {
  padding-top: 5px !important;
}

.panelHolder {
  position: relative;
  height: 0px;
}

.vatPanel {
  display: block;
  position: absolute;
  top: 0px;
  background: #fff;
  border: 1px solid #ccc;
  padding: 10px 10px 10px 40px;
}

.vatPanel .boxClose {
  display: block;
  position: absolute;
  right: 0px;
  top: 0px;
  height: 19px;
  width: 19px;
  background: url(../images/crm/iconRemove.png) no-repeat;
}

.vatPanel.ok {
  background: #fff url(../images/accept.png) no-repeat 10px 10px;
  width: 150px;
}

.vatPanel.err {
  background: #fff url(../images/exclamation.png) no-repeat 10px 10px;
  width: 150px;
}

.cropPopUp {
  position: fixed;
  z-index: 10000;
  top: 0px;
  left: 0px;
  bottom: 0px;
  right: 0px;
  background: url(../images/blackOpacity80.png);
}

.cropPopUp .cropImage {
  position: absolute;
  width: 1200px;
  left: 50%;
  margin-left: -600px;
  top: 50px;
}

div.basic .settings span {
  font-size: 12px;
  color: #666;
}

div.basic .settings span.fielddescription {
  line-height: 20px;
  display: block;
}

.invoice h2 {
  display: block;
  padding: 0;
  margin: 20px 0 10px 20px;
  font: normal normal normal 20px/22px Arial;
  color: #333;
  text-transform: uppercase;
}

hr {
  padding: 0;
  margin: 0 20px 0 20px;
  display: block;
  height: 1px;
  border: none;
  background: #C2C7CD;
}

.invoice table.invoiceLines {
  margin: 0 20px 20px 20px;
  width: 708px;
}

.invoice table.invoiceLines .linesHeader td {
  border-top: 1px solid #C2C7CD;
}

.invoice table.invoiceLines td.f {
  border-left: 1px solid #C2C7CD;
}

.invoice table.invoiceLines td {
  border-bottom: 1px solid #C2C7CD;
  border-right: 1px solid #C2C7CD;
}

.invoice table.invoiceLines .linesHeader td {
  color: #666;
}

.invoice table.invoiceLines .subtotal td {
  border: none;
  height: 20px;
}

.invoice table.invoiceLines .subtotal td.gt {
  padding-top: 7px;
  font-size: 14px;
}

.state {
  display: inline-block;
  margin-top: 5px;
  padding: 2px 5px 2px 4px;
  line-height: 14px;
  border: 1px solid #666;
  text-transform: uppercase;
  font-size: 14px;
}

.state.green {
  color: #1db000;
  border: 1px solid #1db000;
}

.state.red {
  color: #ff0000;
  border: 1px solid #ff0000;
}

.invTable td .inv-status {
  display: inline-block;
  line-height: 22px;
  padding: 0 5px 0 5px;
  min-width: 45px;
  text-align: center;
  box-sizing: border-box;
  border-radius: 11px;
  color: #fff;
  font-weight: 500;
  font-size: 12px !important;
  background: #999;
}

.invTable td .inv-status.Late {
  background: #ff0000;
}

.invTable td .inv-status.Sent {
  background: #2dabed;
}

.invTable td .inv-status.Paid {
  background: #08c880;
}

div.basic .txt.calc {
  display: block;
  float: left;
  height: 14px;
  border-right: none;
  width: 215px;
}

div.basic .btnCalc {
  display: block;
  float: left;
  border: 1px solid #ccc;
  border-left: none;
  background: url(../images/crm/recalcBg.png) no-repeat right center;
  height: 24px;
  width: 28px;
}

.checkinput a {
  display: block;
  float: left;
  width: 23px;
  height: 30px;
  border: 1px solid #ccc;
  border-right: none;
  background: url(../images/crm/unchecked.png) no-repeat right center;
}

.checkinput a.checked {
  background: url(../images/crm/checked.png) no-repeat right center;
}

.checkinput .e.txt, div.basic dl dd .checkinput .e.txt, div.half.basic dl dd .checkinput .e.txt, .checkinput input.txt {
  display: block;
  float: left;
  border-left: none;
  width: 268px;
}

div.basic .checkinput .txt.e {
  width: 225px;
  padding-right: 12px;
  background: #fff url(../images/crm/txtBgEuro.png) no-repeat right center;
}

.cardetailOverview dl dt, .cardetailOverview dl dd {
  display: block;
  height: 20px;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.cardetailOverview dl dt {
  color: #999;
}

.publish, .unpublish {
  display: inline-block;
  width: 16px;
  height: 16px;
}

.publish.facebook {
  background: url(../images/crm/export_FB.png) no-repeat center center;
}

.unpublish.facebook {
  background: url(../images/crm/exportA_FB.png) no-repeat center center;
}

.publish.twitter {
  background: url(../images/crm/export_TW.png) no-repeat center center;
}

.unpublish.twitter {
  background: url(../images/crm/exportA_TW.png) no-repeat center center;
}

.phone {
  display: block;
  line-height: 20px;
  margin-bottom: 10px;
  padding-left: 30px;
  background: url(../images/crm/newIconPhone.png) no-repeat left center;
}

.email {
  display: block;
  line-height: 20px;
  margin-bottom: 10px;
  padding-left: 30px;
  background: url(../images/crm/newIconMail.png) no-repeat left center;
}

.siteLogo {
  display: block;
  margin: 0px 0 10px 0;
  float: left;
}

.loading {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 220px;
  padding: 5px;
  margin: -25px 0 0 -115px;
  font: normal normal 300 13px/18px Arial, sans-serif;
  color: #666;
  box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.3);
  z-index: 10000;
  background: #f9f9f9;
  display: none;
  text-align: center;
}

.loading span {
  font: normal normal 300 13px/18px Arial, sans-serif;
  color: #666;
  display: inline-block;
  padding: 10px;
}

.damageCar {
  margin: auto;
  width: 100%;
  position: relative;
  width: 186px;
}

.damageCar img {
  display: block;
  position: relative;
}

.damageCar img.damageMap {
  z-index: 10;
}

.damageCar .damages-img-stack, .damageCar .damages-img-stack img {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.damageCar .damages-img-stack img.z1 {
  z-index: 1;
}

.damageCar .damages-img-stack img.z2 {
  z-index: 2;
}

.damageCar .damages-img-stack img.z3 {
  z-index: 3;
}

.damageCar .damages-img-stack img.z4 {
  z-index: 4;
}

.damageCar a {
  display: block;
  position: absolute;
  width: 20px;
  height: 20px;
  background: #f3f3f3;
  border: 1px solid #999;
  border-radius: 10px;
  font: normal normal bold 11px/20px Arial, sans !important;
  color: #333;
  text-align: center;
}

.damageCar a.dark {
  background: #666;
  border: 1px solid #666;
  color: #fff;
}

.damageCar a.active, .damageCar a.dark.active {
  background: #ff7c2d;
  border: 0;
  color: #fff;
}

.damages-list .dr {
  height: 71px;
  width: 407px;
  border-bottom: 1px solid #ccc;
}

.damages-list .dr.other {
  height: auto;
  padding: 20px 20px 20px 60px;
  border: none;
  background: #f7f7f7;
  margin-bottom: 10px;
  position: relative;
  width: 500px;
}

.damages-list .dr.other::after {
  content: "";
  display: block;
  clear: both;
  float: none;
}

.damages-list .dr.other span {
  position: absolute;
  top: 16px;
  left: 20px;
  font-size: 22px;
  line-height: 32px;
}

.damages-list .dr.other span::before {
  Content: "\f071";
  font-family: "Font Awesome 5 Pro";
  font-weight: 700;
  font-size: 22px;
  line-height: 32px;
  display: block;
}

.damages-list .dr span {
  display: block;
  padding: 4px 0 4px 0px;
  height: 22px;
  font: normal normal normal 12px/22px Arial;
  color: #666;
}

div.basic dl dd .damages-list .dr select, div.basic.half dl dd .damages-list .dr select {
  display: block;
  float: left;
  width: 220px;
  margin: 0 0 0 0;
  border-right: 1px solid #ccc;
}

div.basic dl dd .damages-list .dr.other select, div.basic.half dl dd .damages-list .dr.other select {
  width: 440px;
}

div.basic dl dd .damages-list .dr select.severity, div.basic.half dl dd .damages-list .dr select.severity {
  width: 45px;
  border-right: none;
}

.damages-list .dr a {
  display: block;
  float: left;
  width: 29px;
  height: 32px;
  text-decoration: none;
}

.damages-list .dr a:hover {
  text-decoration: none;
}

.damages-list .dr a::after {
  display: block;
  font-family: "Font Awesome 5 Pro";
  content: "\f00d";
  font-weight: 200;
  color: #ff0000;
  text-align: center;
  line-height: 32px;
  font-size: 16px;
}

.damages-list .dr a.addvalue {
  height: 30px;
  background: #fff;
  margin-top: 0px;
  display: none;
}

.damages-list .dr .fileinput-button {
  margin-top: 0;
}

img[usemap], map area {
  outline: none;
}

.basic .inner-form dt.full, .basic .inner-form dd.full {
  display: block;
  float: none;
  width: 407px;
  padding-left: 0;
}

.basic .inner-form dt.full {
  text-align: left;
}

.basic .inner-form dd.full textarea {
  width: 401px;
}

.fileinput-button {
  display: block;
  overflow: hidden;
  position: relative;
  float: left;
  width: 50px;
  height: 34px;
  margin: 7px 4px 0 16px;
  background: url(/assets/images/crm/nopic.png) no-repeat center center;
}

.fileinput-button input {
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  opacity: 0;
  filter: alpha(opacity=0);
  transform: translate(-300px, 0) scale(4);
  font-size: 23px;
  direction: ltr;
  cursor: pointer;
}

.verr, .verr p {
  display: block;
  font: normal normal normal 12px/15px "Roboto", Arial;
  color: #666;
}

.verr {
  padding: 5px;
}

.widgetbox {
  position: relative;
  display: block;
  float: left;
  width: 33.33%;
  height: 420px;
  padding: 10px;
  box-sizing: border-box;
}

.widgetbox.w66 {
  width: 66.66%;
}

.widgetbox.w100 {
  width: 100%;
  height: auto;
  min-height: 420px;
}

.widgetbox.w80 {
  width: 80%;
  height: auto;
  min-height: 420px;
}

.widgetbox.w20 {
  width: 20%;
  height: auto;
  min-height: 420px;
}

.widgetbox .wboxin {
  padding: 4px 0 10px 0;
  height: 385px;
  background: #fff;
  box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.2);
}

.widgetbox.w100 .wboxin, .widgetbox.w80 .wboxin, .widgetbox.w20 .wboxin {
  height: auto;
  min-height: 385px;
}

.widgetbox .wboxin .header {
  height: 46px;
  background: #fff;
}

.widgetbox .wboxin .header h3 {
  font: normal normal normal 20px/42px Roboto, Arial;
  padding: 0 0 0 10px;
  color: #444;
}
.widgetbox .wboxin .header h3 span.big {
  font-size: 20px;
}

.widgetbox .wboxin .tabs {
  height: 35px;
}

.wToDo, .mostviewed, .offeredcar, .auctiondata {
  width: 100%;
  background: #fff;
}

.wToDo tr, .wToDo td, .mostviewed tr, .mostviewed td, .offeredcar tr, .offeredcar td, .auctiondata tr, .auctiondata td {
  height: 46px;
}

.offeredcar td.last {
  padding-right: 10px;
}

.wToDo td, .mostviewed td, .offeredcar td, .auctiondata td {
  border-bottom: 1px solid #dedede;
  font: normal normal normal 12px/16px Roboto, Arial;
  color: #999;
  padding: 12px 0 0 15px;
}

.auctiondata td.maxoffer {
  color: #ff0000;
}

.auctiondata td.last {
  padding-right: 10px;
}

.auctiondata td.url {
  font-size: 0;
  padding-top: 0;
  padding-bottom: 0;
  line-height: 0;
}

.wToDo td em, .mostviewed td em, .offeredcar td em, .auctiondata td em {
  font: normal normal normal 12px/16px Roboto, Arial;
  color: #666;
  display: block;
}

.wToDo td.date, .offeredcar td.date {
  padding: 10px 0 2px 15px;
  font: normal normal normal 16px/20px Roboto, Arial;
  width: 46px;
}

.wToDo td.date em, .offeredcar td.date em {
  font: normal normal normal 16px/20px Roboto, Arial;
  color: #666;
}

.wToDo td.img {
  padding: 0;
  width: 20px;
  text-align: center;
  vertical-align: middle;
}

.wToDo td.date {
  width: 30px;
}

.wToDo td.tl {
  padding-left: 10px;
}

.wToDo td.l {
  width: 10px;
  padding: 0;
}

.auctiondata td {
  color: #444;
  height: auto;
  min-height: 36px;
}

.auctiondata td em {
  color: #999;
}

.auctiondata td span.reserve {
  font-weight: bold;
}

.wboxin .content {
  position: relative;
  height: 345px;
}

.widgetbox.w100 .wboxin .content, .widgetbox.w80 .wboxin .content, .widgetbox.w20 .wboxin .content {
  height: auto;
  min-height: 345px;
}

.wboxin .content.small {
  position: relative;
  height: 310px;
}

.widgetWait {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: url(/assets/images/crm/widgetWait.gif) no-repeat center center;
}

.wboxin .innerContent {
  display: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.widgetbox.w100 .wboxin .innerContent, .widgetbox.w80 .wboxin .innerContent, .widgetbox.w20 .wboxin .innerContent {
  position: relative;
}

td a.action {
  display: inline-block;
  width: 30px;
  height: 30px;
  background: url(/assets/images/crm/iconStats.png) no-repeat center center;
}

td a.action.s {
  background: url(/assets/images/crm/iconStats.png) no-repeat center center;
}

td a.action.p {
  background: url(/assets/images/crm/iconPrint.png) no-repeat center center;
}

td a.action.o {
  background: url(/assets/images/crm/iconOffer.png) no-repeat center center;
}

td a.action.o {
  background: url(/assets/images/crm/iconOffer.png) no-repeat center center;
}

td.nw {
  white-space: nowrap;
}

#tooltip {
  position: absolute;
  display: none;
  padding: 5px 10px;
  border: 1px solid #e1e1e1;
  z-index: 99000;
}

td.nw {
  white-space: nowrap;
}

.rating {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin: 0 1px 0 1px;
  background: url(/assets/images/crm/rating.png) no-repeat left bottom;
}

.rating.active {
  background-position: left top;
}

.rating.two {
  background: url(/assets/images/crm/rating.png) no-repeat -16px bottom;
}

.rating.two.active {
  background-position: -16px top;
}

.rating.three {
  background: url(/assets/images/crm/rating.png) no-repeat -32px bottom;
}

.rating.three.active {
  background-position: -32px top;
}

.items {
  position: relative;
  width: 100%;
}

.itemsHeader {
  position: relative;
  width: 100%;
  height: 41px;
}

.items .wToDo td {
  height: 46px;
  position: relative;
}

.itemsHeader .list, .SearchBox .list {
  position: absolute;
  top: 0px;
  left: 0;
  width: 360px;
  bottom: 0;
  overflow: hidden;
  border-right: 1px solid #ccc;
  height: 41px;
  box-sizing: border-box;
}

.SearchBox .list {
  border-color: #7a7a7a;
}

.itemsHeader .detail {
  position: absolute;
  top: 0px;
  left: 360px;
  right: 0;
  bottom: 0;
}

.SearchBox .detail {
  padding-left: 360px;
}

.items .list {
  position: absolute;
  top: 0px;
  left: 0;
  bottom: 0;
  width: 360px;
  background: #f7f7f7;
  overflow: hidden;
}

.items .list .scrollHolder {
  width: 377px;
  overflow-y: visible;
}

.items .detail {
  position: absolute;
  top: 0px;
  left: 360px;
  right: 0;
  bottom: 0;
}

.items .list .wToDo {
  height: 100%;
  margin-right: 0px;
  background: none;
}

.items .list .wToDo td {
  background: #f7f7f7;
}

.items .list .wToDo td.l {
  border-right: 1px solid #ccc;
}

.items .list .wToDo tr.a td.tl, .items .list .wToDo tr.a.active td.tl {
  background-image: url(/assets/images/crm/done.png);
  background-position: right center;
  background-repeat: no-repeat;
}

.items .list .wToDo tr.active td {
  background: #eee;
}

.items .list .wToDo tr.active td.l {
  border-right: 1px solid #eee;
  background: #eee;
}

.items .list table {
  width: 360px;
}

.items .list li {
  display: block;
  min-height: 38px;
}

.items .list li a {
  width: 350px;
  display: block;
  font: normal normal normal 13px/38px "Roboto", Arial;
  color: #666;
  border-bottom: 1px solid #ccc;
  padding: 0 0 0 10px;
}

.items .list li a.active {
  background: #fff;
}

.smallCol .itemsHeader .list {
  width: 240px;
}

.smallCol .itemsHeader .detail {
  left: 240px;
}

.smallCol .items .list {
  width: 240px;
  background: #f7f7f7 url(/assets/images/crm/dotCCC.png) repeat-y 239px top;
}

.smallCol .items .list .scrollHolder {
  width: 100%;
}

.smallCol .items .detail {
  left: 240px;
}

.smallCol .items .list li a {
  width: 230px;
}

.box.fullNoMargin {
  margin: 0;
  height: 100%;
}

.box.fullNoMargin .boxin {
  height: 100%;
  background: none;
}

.wToDo tr.heightFill, .heightFill td, .items .wToDo .heightFill td {
  height: 100%;
  position: relative;
}

.heightFill td {
  background: #08c880;
}

.bgWhite {
  background: #fff;
}

.autocomplete-suggestions {
  background: #fff;
  border: 1px solid #ccc;
}

.autocomplete-suggestion {
  padding: 5px;
  font-size: 10px;
  color: #999;
}

.autocomplete-suggestion strong {
  display: block;
  font-weight: normal;
  font-size: 12px;
  color: #333;
}

.autocomplete-suggestion em {
  font-weight: normal;
  font-style: normal;
  font-size: 10px;
  color: #333;
}

.autocomplete-suggestion:hover {
  background: #dedede;
}

span.mail {
  display: block;
  width: 15px;
  height: 11px;
  background: url(/assets/images/crm/mail.png) no-repeat center top;
}

span.mail.active {
  background-position: center bottom;
}

.nodata {
  display: block;
  padding: 15px;
}

.lines li {
  display: block;
  font: normal normal normal 13px/39px Roboto, Arial;
  color: #666;
  border-bottom: 1px solid #e9e9e9;
  padding: 0 0 0 19px;
  height: 39px;
}

.lines li label {
  display: inline-block;
  font: normal normal normal 11px/39px Roboto, Arial;
  width: 70px;
}

.box .content table tr.vAllignTop td {
  vertical-align: top;
  line-height: 39px;
}

.makeContent #detailViews td {
  line-height: 22px;
  height: 22px;
}

.makeContent #detailViews {
  display: none;
}

.box div.templates {
  width: 100%;
  max-width: 1240px;
}

.templates a {
  display: block;
  float: left;
  width: 600px;
  height: 104px;
  background: #f7f7f7;
  margin: 0 20px 20px 0;
}

.templates a span.icon {
  display: block;
  float: left;
  width: 104px;
  height: 104px;
  background: #ff7c2d url(/assets/images/crm/templateIcons.png) no-repeat center top;
}

.templates a.dis span.icon {
  background-color: #ccc;
}

.templates a.selected span.icon {
  background-color: #08c880;
}

.templates a span.icon.stock {
  background-position: center top;
}

.templates a span.icon.promo {
  background-position: center -104px;
}

.templates a span.icon.text, .templates a span.icon.invite {
  background-position: center -208px;
}

.templates a span.content {
  display: block;
  float: left;
  width: 425px;
  height: 94px;
  padding: 10px 30px 0 20px;
}

.templates a.dis span.content strong, .templates a.dis span.content p {
  color: #ccc;
}

.templates a.selected span.content strong, .templates a.selected span.content p {
  color: #08c880;
}

.templates a span.content strong {
  font: normal normal normal 20px/39px Roboto, Arial;
  color: #333;
  text-decoration: none;
}

.templates a span.content p {
  padding: 0;
  font: normal normal normal 14px/19px Roboto, Arial;
  color: #333;
  text-decoration: none;
}

.thumbs div {
  display: block;
  float: left;
  margin: 0 5px 5px 0;
  width: 138px;
  height: 100px;
  position: relative;
  background-size: cover;
}

.btnGreen27.fileinput-button {
  width: 130px;
  padding: 0 10px 0 10px;
  overflow: hidden;
  text-align: center;
  height: 35px;
  margin: 2px 0 20px 0;
}

div.btnGreen27.fileinput-button span {
  display: inline-block;
  padding: 0 0 0 28px;
  height: 35px;
  font: normal normal normal 14px/35px Roboto, Arial;
  background: url(/assets/images/crm/nopic_white.png) no-repeat left center;
}

.btnGreen27 input {
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  opacity: 0;
  filter: alpha(opacity=0);
  transform: translate(-300px, 0) scale(4);
  font-size: 23px;
  direction: ltr;
  cursor: pointer;
}

.progress {
  height: 20px;
  width: 300px;
  background: #f7f7f7;
  border: 1px solid #ccc;
}

.progress .progress-bar {
  display: block;
  height: 20px;
  background: #08c880;
}

.thumbs div .delete {
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.4);
  color: #fff;
  z-index: 10;
  text-align: center;
  text-decoration: none;
}

.thumbs div .delete::after {
  content: "\f136";
  font-family: "Material-Design-Iconic-Font";
  font-size: 14px;
  line-height: 20px;
}

.thumbs div .previous {
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  height: 20px;
  width: 20px;
  background: url(/assets/images/crm/arrowLeftWhite.png) no-repeat center center;
  z-index: 10;
}

.thumbs div .next {
  display: block;
  position: absolute;
  right: 0;
  bottom: 0;
  height: 20px;
  width: 20px;
  background: url(/assets/images/crm/arrowRightWhite.png) no-repeat center center;
  z-index: 10;
}

.progressBox {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 300px;
  padding: 10px;
  margin: -50px 0 0 -165px;
  font: normal normal 300 13px/18px Arial, sans-serif;
  color: #666;
  border: 1px solid #666;
  z-index: 10000;
  background: #fff;
  min-height: 50px;
}

.scrollHolder {
  overflow-y: scroll;
  overflow-x: auto;
  top: 0;
  bottom: 0;
}

.scrollHolder .content {
  position: relative;
}

.dropdownMenuHolder {
  position: relative;
  float: left;
  height: 70px;
}

.dropdownMenu {
  position: absolute;
  display: none;
  top: 60px;
  right: 0;
  z-index: 1000;
  background: #f7f7f7;
}

.dropdownMenu .submenu {
  position: relative;
  display: block;
}

body.loginPage {
  background: #444444;
}

body.loginPage .logo {
  display: block;
  float: left;
}

body.loginPage .forgotlink {
  display: block;
  float: right;
  margin: 30px 30px 0 0;
  padding: 0 20px 0 20px;
  background: #333;
  font: normal normal normal 16px/46px "Roboto", Arial;
  color: #ccc;
  height: 46px;
  transition: 0.3s;
}

body.loginPage .forgotlink:hover {
  color: #fff;
  transition: 0.3s;
}

body.loginPage .forgotlink i {
  font-size: 20px;
  padding-right: 8px;
  line-height: 46px;
}

body.loginPage .basic {
  padding: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -150px 0 0 -345px;
  width: 490px;
}

body.loginPage .basic h1 {
  font: normal normal 300 30px/37px "Roboto", Arial;
  color: #fff;
  padding: 0 0 20px 140px;
}

body.loginPage .basic .txt {
  width: 338px;
  border: 0;
  background: #e5e5e5;
  height: 42px;
  line-height: 16px;
}

body.loginPage .basic dl {
  width: 490px;
}

body.loginPage div.basic dl dt {
  padding-top: 15px;
}

body.loginPage .basic dl dt, body.loginPage .basic dl dd {
  margin-bottom: 10px;
}

body.loginPage .basic dl dd {
  width: 350px;
}

body.loginPage .basic dl dt label, body.loginPage .basic dl dd label {
  color: #fff;
  font-size: 16px;
  font-weight: 300;
}

body.loginPage .basic dl dd span.note {
  display: block;
  font: normal normal normal 16px/30px "Roboto", Arial;
  color: #ddd;
  padding: 5px 0 0 0;
  float: none;
  border: none;
  width: auto;
}

.yellowButton, body.loginPage .basic dl dd .yellowButton {
  display: inline-block;
  height: 40px;
  background: #ff7c2d;
  font: normal normal 500 16px/46px "Roboto", Arial;
  color: #fff;
  padding: 0 20px 0 15px;
  text-transform: uppercase;
  border-radius: 5px;
}

.yellowButton, body.loginPage .basic dl dd .yellowButton:hover {
  text-decoration: none;
}

.yellowButton::after {
  display: block;
  content: "";
  clear: both;
  float: none;
}

.yellowButton::before {
  content: "\f18f";
  display: block;
  float: left;
  font-size: 22px;
  line-height: 40px;
  font-family: "Material-Design-Iconic-Font";
  padding-right: 8px;
  text-decoration: none;
}

.yellowButton span {
  color: #fff;
  display: block;
  float: left;
}

.yellowButton.mail {
  display: block;
  float: left;
  margin-right: 10px;
  height: 40px;
  font: normal normal normal 16px/38px "Roboto", Arial;
  padding: 0;
  width: 209px;
  text-align: center;
  box-sizing: border-box;
  padding-left: 20px;
}

.yellowButton.mail::before {
  content: "\f18f";
}

.yellowButton.mail span {
  display: block;
  float: left;
  height: 40px;
  margin: auto;
  font: normal normal normal 16px/40px "Roboto", Arial;
  text-transform: uppercase;
  color: #fff;
}

.blackButton {
  display: block;
  float: left;
  height: 40px;
  font: normal normal normal 16px/38px "Roboto", Arial;
  color: #fff;
  padding: 0 15px 0 15px;
  width: 100px;
  text-align: center;
  text-decoration: none;
}

.blackButton:hover, .basic a.blackButton:hover {
  text-decoration: none;
}

.blackButton::after {
  display: block;
  content: "";
  clear: both;
  float: none;
}

div.basic .blackButton span {
  display: block;
  float: left;
  height: 40px;
  margin: auto;
  padding: 0;
  font: normal normal normal 16px/38px "Roboto", Arial;
  color: #fff;
  text-transform: uppercase;
}

div.basic .blackButton::before {
  display: block;
  float: left;
  font-size: 22px;
  line-height: 40px;
  font-family: "Material-Design-Iconic-Font";
  content: "\f136";
  padding-right: 8px;
  text-decoration: none;
}

.loginError {
  display: block;
  padding: 0 0 5px 140px;
  font: normal normal normal 13px/16px "Roboto", Arial;
  color: #b70b0b;
}

.optionDiv {
  min-height: 40px;
  width: 33%;
  font-size: 11px;
  float: left;
  line-height: 30px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.optionDiv input[type=checkbox] + label {
  overflow: hidden;
  cursor: pointer;
  display: block;
  line-height: 24px;
  padding-left: 40px;
}

.optionDiv input[type=checkbox] + label:hover {
  background: #f7f7f7;
}

.optionDiv input[type=checkbox] + label::before {
  top: 10px;
  left: 10px;
}

.optionDiv input[type=checkbox]:checked + label {
  color: #10b376;
}

.optionDiv input[type=checkbox]:checked + label:before {
  content: "\f26b";
  color: #fff !important;
  border: 1px solid #10b376;
  background-color: #10b376;
  text-align: center;
  font-family: "Material-Design-Iconic-Font";
}

ul.cols li {
  background: #fff;
  width: 349px;
  display: block;
  font: normal normal normal 13px/38px "Roboto", Arial;
  color: #666;
  border-bottom: 1px solid #ccc;
  padding: 0 0 0 10px;
}

ul.cols li.ttl {
  background: #f7f7f7;
  height: 31px;
  overflow: hidden;
}

ul.cols li span.c1, ul.cols li span.c2, ul.cols li span.c3 {
  display: block;
  float: left;
  height: 39px;
  font: normal normal normal 12px/38px "Roboto", Arial;
  padding: 0 0 0 10px;
}

ul.cols li.ttl span.c1, ul.cols li.ttl span.c2, ul.cols li.ttl span.c3 {
  height: 31px;
  font: normal normal normal 11px/31px "Roboto", Arial;
  border-right: 1px solid #ccc;
}

ul.cols li.ttl span.c1 {
  padding: 0;
  width: 42px;
}

ul.cols li span.c1 {
  padding: 0;
  width: 43px;
  text-align: center;
}

ul.cols li span.c2 {
  width: 238px;
}

ul.cols li.ttl span.c2 {
  width: 237px;
}

ul.cols li span.c3 {
  width: 45px;
  text-align: center;
}

ul.cols li.ttl span.c3 {
  border-right: none;
  width: 44px;
}

.rel {
  position: relative;
}

.historyHolder {
  position: absolute;
  top: -10px;
  right: 20px;
  height: 59px;
  width: 350px;
  z-index: 9900;
  display: none;
  padding: 0;
  background: url(/assets/images/crm/prices.png) no-repeat right top;
}

.historyHolder .innerHolder {
  display: block;
  position: absolute;
  box-shadow: 0px 0px 11px 0px rgba(0, 0,0, 0.5);
  right: 70px;
  top: -19px;
  width: 320px;
  background: #fff;
  z-index: 9900;
}

#link-table tr.nohover, #link-table tr.nohover td {
  background: #fff !important;
}

.historyHolder .innerHolder .shade {
  display: block;
  position: absolute;
  height: 39px;
  right: -12px;
  top: 29px;
  width: 12px;
  background: rgba(255,255,255, 0.8);
}

.historyHolder li {
  width: 320px;
  border-bottom: 1px solid #f0f0f0;
  height: 29px;
  padding: 0;
}

.historyHolder li em {
  display: block;
  float: left;
  width: 75px;
  padding: 0 30px 0 0;
  font: normal normal normal 11px/29px "Roboto", Arial !important;
  text-align: right;
  color: #666 !important;
}

.historyHolder li.b em, .historyHolder li.b span {
  color: #333 !important;
}

.historyHolder li span {
  display: block;
  float: left;
  padding: 0 20px 0 0;
  width: 87px;
  height: 29px;
  text-align: left;
  font: normal normal normal 11px/29px "Roboto", Arial !important;
  text-align: right;
  color: #666 !important;
}

.historyHolder li.profit span.green {
  font: normal normal bold 11px/29px "Roboto", Arial !important;
  color: #08c880 !important;
}

.historyHolder li.profit span.red {
  font: normal normal bold 11px/29px "Roboto", Arial !important;
  color: #ff0000 !important;
}

.historyHolder a.cta {
  display: block;
  text-align: center;
  font: normal normal normal 13px/35px "Roboto", Arial;
  color: #fff;
  height: 35px;
  background: #08c880;
  margin: 16px 20px 15px 140px;
  line-height: 35px !important;
}

.linesHeader {
  height: 30px;
  background: #f7f7f7;
  border-bottom: 1px solid #f0f0f0;
}

.linesHeader .col {
  height: 30px;
  float: left;
  font: normal normal normal 10px/30px "Roboto", Arial;
  color: #666;
}

.linesHeader .col span {
  font: normal normal normal 10px/30px "Roboto", Arial;
  color: #666;
}

.row {
  padding: 13px 0 7px 0;
  min-height: 70px;
  font: normal normal normal 11px/32px "Roboto", Arial;
  color: #666;
  border-bottom: 1px solid #e4e4e4;
  width: 920px;
}

#rules .row {
  min-height: 32px;
  width: 100%;
}

.row .col {
  float: left;
  min-height: 32px;
}

.col.remove {
  width: 30px;
}

.col.removeWide {
  width: 50px;
  text-align: right;
}

.col.removeWide a.remove {
  float: right;
}

.col.field {
  width: 300px;
  margin-right: 10px;
}

.col.operator {
  width: 100px;
  margin-right: 10px;
}

.col.values input[type=text] {
  width: 190px;
}

.col.field select, .col.operator select {
  width: 100%;
}

.col.type {
  width: 110px;
}

.col.type select {
  width: 100px;
  height: 32px;
  border: 1px solid #ccc;
  font: normal normal normal 11px/18px "Roboto", Arial;
  color: #666;
  padding: 6px;
}

.col.type select.error {
  border: 1px solid #b70b0b;
}

.col.descr {
  width: 470px;
}

.col.descr textarea {
  width: 446px;
  height: 56px;
  border: 1px solid #ccc;
  font: normal normal normal 11px/18px "Roboto", Arial;
  color: #666;
  padding: 6px;
}

.col input[type=text] {
  width: 50px;
  height: 18px;
  border: 1px solid #ccc;
  font: normal normal normal 11px/18px "Roboto", Arial;
  color: #666;
  padding: 6px 8px 6px 0;
  text-align: right;
}

#rules .row .col input[type=text] {
  font: normal normal normal 13px/18px "Roboto", Arial;
}

.col select {
  width: 200px;
  height: 32px;
  border: 1px solid #ccc;
  font: normal normal normal 13px/18px "Roboto", Arial;
  color: #666;
  padding: 6px 8px 6px 8px;
  text-align: right;
}

.col input[type=text].error {
  border: 1px solid #b70b0b;
}

.col.quantity {
  width: 60px;
  text-align: right;
  padding: 0 10px 0 0;
}

.col.price {
  width: 90px;
  text-align: right;
}

.col.price input[type=text] {
  width: 80px;
}

.col.total {
  width: 100px;
  text-align: right;
}

.col.vat1, .col.vat2 {
  width: 25px;
  text-align: right;
}

.row .add {
  float: left;
  width: 170px;
  padding: 9px 0 0 30px;
}

.row .tcol {
  float: left;
  width: 670px;
  text-align: left;
  padding-right: 50px;
  line-height: 1px;
}

.row .tcol .total {
  display: block;
  text-align: right;
}

.row .tcol .total span, .row .tcol .total label, .generaltotal span, .generaltotal label, .paymentLine span, .paymentLine label, .balanceLine span, .balanceLine label {
  display: inline-block;
  text-align: right;
  font: normal normal normal 11px/32px "Roboto", Arial;
  color: #666;
  width: 100px;
}

.row .tcol .total label em {
  font: normal normal normal 11px/32px "Roboto", Arial;
  color: #666;
}

.generaltotal span, .generaltotal label, .paymentLine span, .paymentLine label, .balanceLine span, .balanceLine label {
  font: normal normal normal 11px/30px "Roboto", Arial;
  color: #333;
}

.generaltotal, .paymentLine, .balanceLine {
  width: 870px;
  display: block;
  text-align: right;
  font: normal normal normal 11px/30px "Roboto", Arial;
  color: #333;
}

.paymentLine, .balanceLine {
  display: none;
}

a.info {
  display: block;
  width: 38px;
  height: 40px;
  float: left;
  margin-left: 3px;
  background: #ccc url(/assets/images/crm/iconi.png) no-repeat center center;
  border-radius: 3px;
}

a.info.incomplete {
  background: #ff7c2d url(/assets/images/crm/iconExclamation.png) no-repeat center center;
}

.clientHolder {
  width: 279px;
  float: left;
}

div.half.basic dl dd .clientHolder input.txt.date.clientDescbox {
  width: 247px;
}

.txtBox {
  width: 308px;
  height: 32px;
  border: 1px solid #ccc;
  padding: 0 0 0 10px;
}

.txtBox.error {
  border: 1px solid #b70b0b;
}

.txtBox input {
  float: left;
}

.txtBox input[type=checkbox] {
  float: left;
}

div.half.basic dl dd .txtBox .txt {
  width: 278px;
  border: none;
  padding: 0;
}

a.remove {
  display: inline-block;
  width: 30px;
  height: 32px;
  background: url(/assets/images/crm/crossSmall.png) no-repeat center center;
}

.frmOption input.txt.zip {
  width: 90px;
  margin-right: 2px;
}

.frmOption input.txt.city {
  width: 253px;
}

div.half.basic dl dd .txt.w30 {
  width: 50px;
}

span.active {
  display: inline-block;
  width: 10px;
  height: 10px;
  background: #08c880;
  border-radius: 5px;
}

select {
  background: url(/assets/images/crm/ddl.png) no-repeat right center;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  select {
    -webkit-appearance: none !important;
  }
}
.grpIcon {
  display: block;
  float: right;
  width: 20px;
  height: 17px;
}

.grpIcon.preferences {
  background: url(/assets/images/crm/iconSliders.png) no-repeat center center;
}

.grpIcon.smartgroup {
  background: url(/assets/images/crm/iconFilter.png) no-repeat center center;
}

.ItemCarThumb {
  width: 100px;
  margin-left: 0px;
  float: left;
}

.ItemCarThumb img {
  width: 90px !important;
  height: 68px !important;
  float: left;
}

div.basic dl dt.lblHelp label span, .smallFields div.basic dl dt label span {
  font: normal normal normal 10px/12px "Roboto", Arial;
  color: #999;
  font-size: 11px;
}

em.help, .smallFields div.basic dl dt em.help {
  display: block;
  width: 17px;
  height: 17px;
  min-height: 17px;
  margin: -2.5px 0 0 10px;
  background: url(/assets/images/crm/help.png) no-repeat left center;
  z-index: 1;
  padding: 0;
}

.smallFields div.basic dl dt, .smallFields div.basic dl dd {
  position: relative;
}

em.help div {
  display: none;
  position: absolute;
  top: 0px;
  right: 2px;
  width: 120px;
  padding: 5px;
  background: #f7f7f7;
  border: 1px solid #ccc;
  border-radius: 2px;
  font: normal normal normal 11px/14px "Roboto", Arial;
  color: #333;
  box-shadow: 1px 1px 3px 0px rgba(0,0,0, 0.2);
}

em.help div span {
  display: block;
  position: absolute;
  right: -6px;
  top: 50%;
  margin-top: -6px;
  width: 6px;
  height: 12px;
  background: url(/assets/images/crm/help-nudge.png) no-repeat right center;
}

/* DIV classes */
.smallFields div.basic dl dt {
  width: 180px;
  padding: 10px 0 0 0;
  max-height: 22px;
}

.smallFields div.basic dl dd {
  width: 280px;
}

.smallFields div.basic dl dt em {
  padding-left: 15px;
  width: 29px;
  float: left;
  text-align: left;
  font: normal normal normal 10px/12px "Roboto", Arial;
  color: #999;
  min-height: 12px;
}

.smallFields div.basic dl dt label {
  float: left;
}

.smallFields div.basic dl dd select, .smallFields div.basic dl dd input.txt, .smallFields div.basic dl dd select.txt {
  box-sizing: border-box;
  width: 100%;
  height: 32px;
}

.smallFields div.basic dl dd select.txt.d, .smallFields div.basic dl dd select.txt.m, .smallFields div.basic dl dd select.txt.y {
  width: 91px;
}

.smallFields div.basic dl dd select.txt.m {
  width: 90px;
}

.smallFields div.basic dl dd select.txt.half {
  width: 139px;
  float: left;
}

.smallFields div.basic dl dd select.txt.half.r {
  float: right;
}

.smallFields div.basic dl dd textarea, .smallFields div.basic dl dd textarea.txt {
  box-sizing: border-box;
  width: 100%;
  height: 132px;
}

.smallFields .ui-trigger, .smallFields .ui-datepicker-trigger {
  width: 11.4%;
}

.smallFields div.basic dl dd input.date, .smallFields div.basic dl dd select.date, .smallFields div.basic dl dd input.txt.date, .smallFields div.basic dl dd select.txt.date {
  width: 88.5%;
}

.axle2, .axle3, .axle4, .axle5,
div.basic dl dd label.axle2, div.basic dl dd label.axle3, div.basic dl dd label.axle4, div.basic dl dd label.axle5,
div.basic dl dt.axle2, div.basic dl dd.axle2, div.basic dl dt.axle3, div.basic dl dd.axle3, div.basic dl dt.axle4, div.basic dl dd.axle4, div.basic dl dt.axle5, div.basic dl dd.axle5 {
  display: none;
}

.lblinside, div.basic dl dd label.lblinside {
  display: block;
  position: absolute;
  top: 0;
  right: 50%;
  font: normal normal normal 10px/16px "Roboto", Arial;
}

.lblinside.no1.axle2, div.basic dl dd label.lblinside.no1.axle2 {
  top: 0;
}

.lblinside.axle2, div.basic dl dd label.lblinside.axle2, .lblinside.no1.axle3, div.basic dl dd label.lblinside.no1.axle3 {
  top: 34px;
}

.lblinside.axle3, div.basic dl dd label.lblinside.axle3, .lblinside.no1.axle4, div.basic dl dd label.lblinside.no1.axle4 {
  top: 68px;
}

.lblinside.axle4, div.basic dl dd label.lblinside.axle4, .lblinside.no1.axle5, div.basic dl dd label.lblinside.no1.axle5 {
  top: 102px;
}

.lblinside.axle5, div.basic dl dd label.lblinside.axle5 {
  top: 136px;
}

.txt.lblAxle, .smallFields div.basic dl dd input.txt.lblAxle {
  width: 50%;
  padding-right: 75px;
  margin-bottom: 2px;
}

.smallFields div.basic dl dd select.half, .smallFields div.basic dl dd input.txt.half, .smallFields div.basic dl dd select.txt.half {
  width: 50%;
}

.smallFields div.basic dl dd input.txt.co2, .smallFields div.basic dl dd input.txt.cc {
  width: 100%;
}

.carstatus {
  display: inline-block;
  font: normal normal normal 16px/40px Roboto, Arial;
  color: #ff7c2d;
  text-transform: uppercase;
  padding-left: 20px;
}

.statusbox {
  display: none;
  position: absolute;
  width: 170px;
  font: normal normal normal 12px/30px Roboto, Arial;
  background: #fff;
  border: 1px solid #efefef;
  border-bottom: none;
  z-index: 1;
}

.statusbox div {
  border-bottom: 1px solid #efefef;
}

.statusbox a {
  padding: 0 10px 0 40px;
  font: normal normal normal 12px/30px Roboto, Arial;
  display: block;
  text-decoration: none;
  background-repeat: no-repeat;
  background-position: 10px center;
}

.statusbox a:hover {
  background-color: #efefef;
}

.statusbox a.stock {
  background-image: url(/assets/images/crm/iconStock.png);
}

.statusbox a.expected {
  background-image: url(/assets/images/crm/iconExpected.png);
}

.statusbox a.inoption {
  background-image: url(/assets/images/crm/iconOption.png);
}

.statusbox a.ordered {
  background-image: url(/assets/images/crm/iconOrder.png);
}

.statusbox a.sold {
  background-image: url(/assets/images/crm/iconSold.png);
}

.statusbox a.delivered {
  background-image: url(/assets/images/crm/iconDelivered.png);
}

.pieChart {
  float: left;
  padding: 20px 30px 20px 20px;
}

.pieChart canvas {
  width: 180px;
  height: 180px;
}

.pieLegent {
  float: left;
  width: 400px;
  padding-top: 70px;
}

.legentImg {
  float: left;
  width: 10px;
  height: 10px;
  border-radius: 2px;
  margin-top: 6px;
}

.legentImg.opens {
  background: #50b432;
}

.legentImg.clicks {
  background: #058dc7;
}

.legentImg.not-opened {
  background: #c9c9c9;
}

.legentItem span {
  font-size: 18px;
  color: #000;
  padding-left: 0px;
  display: inline-block;
  width: 20px;
  text-align: right;
}

.legentItem {
  float: left;
  display: block;
  font-size: 14px;
  color: #555;
  padding-left: 7px;
  width: 150px;
}

.legentItem a {
  font-size: 14px;
  color: #555;
  padding-left: 7px;
  width: 150px;
}

.mailIcons {
  margin-top: 0px;
}

.iconStock {
  display: block;
  width: 19px;
  height: 35px;
  margin: 0 10px 0 10px;
  background: url(../images/crm/iconStock.png) no-repeat center center;
  float: left;
}

.iconTextOnly {
  display: block;
  width: 19px;
  height: 35px;
  margin: 0 10px 0 10px;
  background: url(../images/crm/iconTextOnly.png) no-repeat center center;
  float: left;
}

.iconPeople {
  display: block;
  padding-left: 32px;
  height: 35px;
  margin: 0px 10px 0 10px;
  background: url(../images/crm/iconPeople.png) no-repeat left center;
  font: normal normal normal 20px/35px Arial, Verdana, sans;
  float: left;
  color: #999;
}

.iconCars {
  display: block;
  padding-left: 30px;
  height: 35px;
  margin: 0px 10px 0 10px;
  background: url(../images/crm/icon_stock_grey.png) no-repeat left center;
  font: normal normal normal 20px/35px Arial, Verdana, sans;
  float: left;
  color: #999;
}

.vies {
  display: inline-block;
  padding-left: 35px;
  background: url(/assets/images/crm/viesGrey.png) no-repeat left center;
}

.vatHolder {
  display: none;
  position: absolute;
  top: -1px;
  left: -1px;
  background: #fff;
  border: 1px solid #ccc;
  padding: 0 35px 0 10px;
  box-shadow: 0px 0px 7px 0px #ccc;
  z-index: 1;
}

.vatHolder .close {
  display: block;
  position: absolute;
  right: 0px;
  top: 0px;
  height: 36px;
  width: 33px;
  background: url(../images/crm/iconRemove.png) no-repeat center center;
}

.vatLine {
  height: 38px;
  line-height: 38px;
  display: block;
  padding-left: 35px;
  background: url(/assets/images/crm/viesGreen.png) no-repeat left center;
  color: #08c880;
}

.vatLine.invalid {
  background: url(/assets/images/crm/viesRed.png) no-repeat left center;
  color: #ff1919;
}

.vatHolder .data {
  padding-left: 35px;
  font: normal normal normal 11px/16px Roboto, Arial;
  color: #666;
}

.vatHolder .link {
  display: block;
  text-decoration: underline;
  padding: 4px 0 10px 35px;
  font: normal normal normal 11px/16px Roboto, Arial;
  color: #999;
}

.box .content table.subTable td {
  padding: 0;
}

.box .content table.subTable td {
  padding: 0;
  min-width: 80px;
}

.box .content table.subTable td.first {
  padding: 0;
  min-width: 40px;
}

.box .content table.subTable td.last {
  padding: 0;
  width: 95%;
}

.smallFields div.basic dl dd input.txt.unit {
  width: 79%;
  border-right: none;
}

.smallFields div.basic dl dd select.txt.unit {
  width: 21%;
  padding: 0;
  border-left: none;
  font-size: 11px;
  float: right;
  color: #999;
}

.subSection input.txt-hidden {
  border: none;
  background: transparent;
  font: normal normal normal 16px/40px Roboto, Arial;
  color: #666;
}

.toggleAll {
  display: block;
  margin: 0;
  margin-right: 5px;
  position: absolute;
  top: 5px;
  left: 0px;
}

.box .content table.nowrap thead td {
  padding-left: 17px;
  position: relative;
}

.box .content table.nowrap thead td a {
  white-space: nowrap;
}

.colgroup {
  border-bottom: 1px solid #333;
  padding: 10px;
  font-size: 14px;
  font-family: Roboto;
  border-top: 1px solid #ebebeb;
  margin-top: -1px;
}

.banners .banner-holder {
  display: block;
  box-sizing: border-box;
  float: left;
  width: 20%;
  padding: 5px;
}

.banners .banner-holder .banner {
  position: relative;
}

.banners .banner-holder .banner img {
  position: relative;
  display: block;
  width: 100%;
}

.banners .banner-holder .banner:after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.5);
  content: "\f2f0";
  text-align: center;
  color: #fff;
  z-index: 1;
  font-size: 20px;
  line-height: 50px;
  font-family: "Material-Design-Iconic-Font";
  opacity: 0;
  transition: 0.3s;
}

.banners .banner-holder .banner:hover:after {
  opacity: 1;
  transition: 0.3s;
}

.banners .banner-holder .banner a.btn {
  display: block;
  position: absolute;
  z-index: 2;
  width: 34px;
  height: 34px;
  border-radius: 34px;
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
  text-decoration: none;
  opacity: 0;
  transition: 0.3s;
  text-align: center;
  box-sizing: border-box;
}

.banners .banner-holder .banner:hover a.btn {
  opacity: 1;
  transition: 0.5s;
}

.banners .banner-holder .banner a.btn:after {
  display: block;
  content: " ";
  position: absolute;
  top: -2px;
  left: -2px;
  width: 34px;
  height: 34px;
  border-radius: 34px;
  border: 2px solid #fff;
  transition: 0.3s;
  opacity: 0;
}

.banners .banner-holder .banner a.btn:hover:after {
  opacity: 1;
  transition: 0.3s;
}

.banners .banner-holder .banner a.btn i {
  font-size: 20px;
  line-height: 34px;
}

.banners .banner-holder .banner a.btn.edit {
  bottom: 10px;
  right: 50%;
  margin-right: -40px;
}

.banners .banner-holder .banner a.btn.delete {
  bottom: 10px;
  left: 50%;
  margin-left: -40px;
}

.slim-btn {
  font-size: 20px !important;
  background-image: none !important;
}

a.btnGreen27.mleft, a.btnRed27.mleft {
  float: left;
  margin: 10px;
}

a.isActive {
  position: relative;
}

a.isActive::after {
  content: "\f269";
  font: normal normal normal 14px/38px "Material-Design-Iconic-Font";
  display: block;
  position: absolute;
  right: 10px;
  top: 0;
  color: #08c880;
}

@media all and (max-width: 1100px) {
  .banners .banner-holder {
    width: 25%;
  }
}
@media all and (max-width: 850px) {
  .banners .banner-holder {
    width: 33.33%;
  }
}
@media all and (max-width: 500px) {
  .banners .banner-holder {
    width: 50%;
  }
}
@media all and (max-width: 380px) {
  .banners .banner-holder {
    width: 100%;
  }
}
.spinner {
  margin: 5px auto 0;
  width: 70px;
  text-align: center;
}

.spinner > div {
  width: 18px;
  height: 18px;
  background-color: #ccc;
  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
  }
}
@keyframes sk-bouncedelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.box .content table tbody.trModelViews td {
  height: 24px;
}

.box .content table tbody.trModelViews td.spacer {
  border: none;
}

.box .content table tbody.trModelViews tr:last-child td.spacer {
  border-bottom: 1px solid #f0f0f0;
}

.box .content table tr.header td a, tr.header td a {
  height: initial;
  position: relative;
  padding-right: 10px;
  display: inline-block;
}
.box .content table tr.header td a.btnGreen27, tr.header td a.btnGreen27 {
  padding-right: 0;
}

tr.header td a::after {
  content: "\f312";
  font: normal normal normal 10px/12px "Material-Design-Iconic-Font";
  display: block;
  position: absolute;
  top: 50%;
  right: 0;
  margin-top: -6px;
}

tr.header td a.btnGreen27::after {
  display: none;
}

.slim {
  overflow: hidden;
}

.control-holder {
  display: block;
  border: 1px solid #ccc;
  height: 30px;
  position: relative;
}

dd .control-holder {
  height: auto;
  min-height: 38px;
  box-sizing: border-box;
  border-radius: 3px;
}

dd .control-holder input {
  min-height: 38px;
}

.subSection .control-holder, .hdrButtons .control-holder {
  float: right;
  border: none;
  margin-right: 0;
}

.hdrButtons .control-holder {
  float: left;
  width: 50px;
}

.subSection .fillbox.reset, .hdrButtons .fillbox.reset {
  display: none !important;
}

.subSection .fillbox.search, .hdrButtons .fillbox.search {
  margin: 0 !important;
  background: #08c880;
  width: 40px;
  height: 40px;
}

.hdrButtons .fillbox.search {
  width: 50px;
  height: 50px;
}

.subSection .fillbox.search i, .hdrButtons .fillbox.search i {
  display: none;
}

.subSection .fillbox.search::after {
  position: absolute;
  display: block;
  content: "";
  background: #fff;
  top: 50%;
  left: 10px;
  right: 10px;
  height: 1px;
  transition: 0.3s;
}

.subSection .fillbox.search::before {
  display: block;
  position: absolute;
  left: 50%;
  top: 10px;
  width: 1px;
  bottom: 10px;
  background: #fff;
  content: "";
  transition: 0.3s;
}

.hdrButtons .fillbox.search::after {
  position: absolute;
  display: block;
  content: "";
  background: #fff;
  top: 50%;
  left: 15px;
  right: 15px;
  height: 1px;
  transition: 0.3s;
}

.hdrButtons .fillbox.search::before {
  display: block;
  position: absolute;
  left: 50%;
  top: 15px;
  width: 1px;
  bottom: 15px;
  background: #fff;
  content: "";
  transition: 0.3s;
}

.control-holder.auto-height {
  border: none;
  height: auto;
}

.control-holder.small {
  max-width: 210px;
}

.control-holder input.txt.date {
  display: block;
  border: none !important;
  width: 100% !important;
  padding-right: 60px !important;
  box-sizing: border-box;
}

.control-holder .ui-trigger, .control-holder .ui-datepicker-trigger {
  position: absolute;
  top: 0;
  right: 0;
  height: 30px;
  border: none;
}

a.fillbox {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 36px;
  bottom: 0;
  text-decoration: none;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}

a.fillbox.search {
  border-left: 1px solid #ccc;
  background: #f7f7f7;
}

a.fillbox i {
  width: 100%;
  line-height: 36px;
  text-align: center;
  font-size: 20px;
  color: #999;
}

a.fillbox.reset {
  right: 36px;
  display: none;
  border-right: none;
}

.c_beige, .hand td.c_beige {
  background: #dbb67f !important;
}

.c_blue, .hand td.c_blue {
  background: #376edb !important;
}

.c_brown, .hand td.c_brown {
  background: #663300 !important;
}

.c_bronze, .hand td.c_bronze {
  background-color: #CD7F32 !important;
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr=#CD7F32, endColorstr=#804000) !important;
  background-image: -moz-linear-gradient(right bottom, #CD7F32 5%, #804000 49%, #CD7F32 100%) !important;
  background-image: linear-gradient(right bottom, #CD7F32 5%, #804000 49%, #CD7F32 100%) !important;
  background-image: -webkit-linear-gradient(right bottom, #CD7F32 5%, #804000 49%, #CD7F32 100%) !important;
  background-image: -o-linear-gradient(right bottom, #CD7F32 5%, #804000 49%, #CD7F32 100%) !important;
  background-image: -ms-linear-gradient(right bottom, #CD7F32 5%, #804000 49%, #CD7F32 100%) !important;
  background-image: -webkit-gradient(linear, right bottom, left top, color-stop(5%, #CD7F32), color-stop(49%, #804000), color-stop(100%, #CD7F32)) !important;
}

.c_yellow, .hand td.c_yellow {
  background: #f5d300 !important;
}

.c_grey, .hand td.c_grey {
  background: #ababab !important;
}

.c_green, .hand td.c_green {
  background: #7eba30 !important;
}

.c_red, .hand td.c_red {
  background: #ff4040 !important;
}

.c_black, .hand td.c_black {
  background: #000000 !important;
}

.c_silver, .hand td.c_silver {
  background-color: #d2d2d2 !important;
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr=#d2d2d2, endColorstr=#f3f3f3) !important;
  background-image: -moz-linear-gradient(right bottom, #d2d2d2 5%, #f3f3f3 49%, #d2d2d2 100%) !important;
  background-image: linear-gradient(right bottom, #d2d2d2 5%, #f3f3f3 49%, #d2d2d2 100%) !important;
  background-image: -webkit-linear-gradient(right bottom, #d2d2d2 5%, #f3f3f3 49%, #d2d2d2 100%) !important;
  background-image: -o-linear-gradient(right bottom, #d2d2d2 5%, #f3f3f3 49%, #d2d2d2 100%) !important;
  background-image: -ms-linear-gradient(right bottom, #d2d2d2 5%, #f3f3f3 49%, #d2d2d2 100%) !important;
  background-image: -webkit-gradient(linear, right bottom, left top, color-stop(5%, #d2d2d2), color-stop(49%, #f3f3f3), color-stop(100%, #d2d2d2)) !important;
}

.c_violet, .hand td.c_violet {
  background: #7F00FF !important;
}

.c_white, .hand td.c_white {
  background: #ffffff !important;
}

.c_orange, .hand td.c_orange {
  background: #ff7f23 !important;
}

.c_gold, .hand td.c_gold {
  background-color: #d9a410;
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr=#d9a410, endColorstr=#f4d008) !important;
  background-image: -moz-linear-gradient(right bottom, #d9a410 5%, #f4d008 49%, #d9a410 100%) !important;
  background-image: linear-gradient(right bottom, #d9a410 5%, #f4d008 49%, #d9a410 100%) !important;
  background-image: -webkit-linear-gradient(right bottom, #d9a410 5%, #f4d008 49%, #d9a410 100%) !important;
  background-image: -o-linear-gradient(right bottom, #d9a410 5%, #f4d008 49%, #d9a410 100%) !important;
  background-image: -ms-linear-gradient(right bottom, #d9a410 5%, #f4d008 49%, #d9a410 100%) !important;
  background-image: -webkit-gradient(linear, right bottom, left top, color-stop(5%, #d9a410), color-stop(49%, #f4d008), color-stop(100%, #d9a410)) !important;
}

.bg_color, .selected td.bg_color {
  display: block;
  width: 15px;
  padding: 0 !important;
  background: #f0f0f0;
}

.period {
  display: inline-block;
  width: 33%;
  line-height: 44px;
  text-align: center;
  color: #fff;
  font-size: 20px;
  box-sizing: border-box;
}

.period.prev {
  text-align: left;
  padding-left: 20px;
}

.period.next {
  text-align: right;
  padding-right: 20px;
}

.search-panel {
  padding: 15px 20px 40px 20px;
  background: #888;
  z-index: 10;
  display: none;
}

.search-panel .controls::after {
  content: "";
  display: block;
  height: 0;
  float: none;
  clear: both;
}

.search-panel .close {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 50px;
  line-height: 50px;
  font-size: 20px;
  color: #fff;
  text-decoration: none;
  transition: 0.2s;
}

.search-panel .close:hover {
  font-size: 23px;
  transition: 0.3s;
}

.search-panel h2 {
  font: normal normal normal 20px/29px Roboto, Arial;
  color: #fff;
  padding: 0 0 24px 0;
  margin: 0;
}

div.SearchBox .search-panel select, div.SearchBox .search-panel .control-holder {
  float: left;
  width: 25% !important;
  margin-bottom: 1px;
}

div.SearchBox.np {
  padding: 0;
  min-height: 44px;
}

.SearchBox .more {
  float: right;
  font-size: 20px;
  line-height: 44px;
  width: 48px;
  text-align: center;
  color: #fff;
  text-decoration: none;
  transition: 0.2s;
}

.SearchBox .more:hover {
  font-size: 23px;
  transition: 0.3s;
}

.i-hdr-btns {
  float: right;
}

.i-hdr-btns a.i-hdr-btn {
  margin: 0 !important;
}

.edit-show, .i-hdr-btn.edit-show {
  display: none;
}

.i-hdr-btn {
  display: block;
  float: left;
  width: 45px;
  line-height: 40px;
  font-size: 24px;
  color: #777;
  transition: 0.3s;
  text-align: center;
}

.i-hdr-btn:hover {
  color: #333;
  transition: 0.3s;
}

.i-hdr-btn i {
  line-height: 40px;
  font-size: 24px;
}

.wToDo i {
  display: block;
  width: 20px;
  line-height: 24px;
  font-size: 24px;
  color: #777;
}

i.icon::after {
  font: normal normal normal 24px/24px "Material-Design-Iconic-Font";
}

/* Showroom visit */
i.icon.tt1::after {
  content: "\f1d4";
}

/* Phone call */
i.icon.tt2::after {
  content: "\f2be";
}

/* Offer */
i.icon.tt3::after {
  content: "\f198";
}

/* Email */
i.icon.tt4::after {
  content: "\f15a";
}

/* Other */
i.icon.tt5::after {
  content: "\f1f9";
}

/* Contact request */
i.icon.tt6::after {
  content: "\f266";
}

/* Car request */
i.icon.tt7::after {
  content: "\f125";
}

/* Sale */
i.icon.tt8::after {
  content: "\f19a";
}

/* Newsletter */
i.icon.tt10::after {
  content: "\f173";
}

/* Follow up */
i.icon.tt11::after {
  content: "\f307";
}

/* Purchase */
i.icon.tt12::after {
  content: "\f19a";
}

/* Price reduction */
i.icon.tt13::after {
  content: "\f187";
}

/* POffered car */
i.icon.tt14::after {
  content: "\f125";
}

.search-summary {
  float: right;
  color: #fff;
  text-transform: uppercase;
  line-height: 44px;
  font-size: 11px;
  font-weight: 500;
}

.card {
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
}

.card-header {
  background: #f7f7f7;
  color: #666;
  position: relative;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.card-header h3 {
  padding: 14px;
  text-transform: none;
  color: #666;
  margin: 0;
  font-size: 16px;
  line-height: 22px;
}

.card-content {
  padding: 15px;
}

.card-content p {
  font-size: 13px;
  line-height: 30px;
  color: #777777;
  padding-bottom: 15px;
}

.card .row12 {
  border-bottom: 1px solid #e4e4e4;
}

.card .row12 .col {
  padding: 1px;
}

.card .row12 label, .card .row12 #lblCar, .card .row12 #lblCustomer, .card .row12 span.text {
  display: block;
  text-align: right;
  padding: 7px 15px 7px 0;
  font-size: 11px;
  font-weight: 300;
  line-height: 17px;
  color: #999;
}

.card .row12 .input-holder label, .card .row12 .input-holder #lblCar, .card .row12 .input-holder #lblCustomer, .card .row12 span.text {
  text-align: left;
  display: none;
  font-size: 13px;
  color: #333;
}

.card .readonly#activeLead .row12 .input-holder label, .card .readonly#activeLead .row12 .input-holder #lblCar, .card .readonly#activeLead .row12 .input-holder #lblCustomer, .card .row12 span.text {
  display: block;
}

.row12 .col input[type=text], .row12 .col select, .row12 .col textarea {
  box-sizing: border-box;
  border: 1px solid #ccc;
  height: 29px;
  width: 100%;
  padding: 5px 5px 5px 10px;
  text-align: left;
  font-size: 13px;
  line-height: 19px;
  color: #333;
  margin: 0;
  text-indent: 0;
}

.row12 .col textarea {
  height: 120px;
}

.card-table {
  width: 100%;
}

.card-table td {
  border-bottom: 1px solid #e4e4e4;
  padding: 10px;
  line-height: 20px;
  vertical-align: middle;
  font-weight: 300;
  color: #333;
}

.card-table i.icon {
  color: #777;
}

.basic.half.cards-holder {
  padding-left: 20px;
}

.cards-holder .card-header .card-controls {
  top: 10px;
  right: 10px;
}

.card a.btnGrey {
  height: auto;
  padding: 10px 12px 10px 12px;
  line-height: 26px;
  font-size: 14px;
  color: #777;
  border-radius: 4px;
  text-decoration: none;
  transition: 0.3s;
}

.card a.btnGrey:hover {
  background: #f7f7f7;
  text-decoration: none;
  transition: 0.3s;
}

.card a.btnGrey i {
  line-height: 26px;
  font-size: 14px;
  padding-right: 7px;
  color: #777;
}

.card a.btnGreen {
  display: inline-block;
  float: none;
  height: auto;
  padding: 10px 12px 10px 12px;
  line-height: 26px;
  font-size: 14px;
  color: #fff;
  border-radius: 4px;
  text-decoration: none;
  transition: 0.3s;
  margin-right: 10px;
}

.card a.btnGreen i {
  line-height: 26px;
  font-size: 14px;
  padding-right: 7px;
  color: #fff;
}

.card a.btnRed {
  display: inline-block;
  float: none;
  height: auto;
  padding: 10px 12px 10px 12px;
  line-height: 26px;
  font-size: 14px;
  color: #fff;
  border-radius: 4px;
  text-decoration: none;
  transition: 0.3s;
  margin-right: 10px;
  background: #cf000f;
  position: relative;
  right: auto;
  top: auto;
  text-transform: none;
}

.card a.btnRed i {
  line-height: 26px;
  font-size: 14px;
  padding-right: 7px;
  color: #fff;
}

.errNote {
  display: block;
  padding: 10px 0 10px 0;
  color: #ff0000;
}

table td a i.zmdi {
  color: #999;
  font-size: 16px;
}

#history i.zmdi {
  margin-left: 15px;
  color: #fff;
  display: inline-block;
  width: 24px;
  height: 24px;
  border-radius: 24px;
  background: #d2d2d2;
  color: #fff;
  text-align: center;
  line-height: 24px;
}

p {
  font-size: 12px;
}

p.intro {
  font-size: 13px;
}

p {
  font-size: 18px;
}

.chart-holder {
  background: #eee;
}

.border-box {
  margin: 10px;
  background: #fff;
  border: 1px solid #dedede;
  box-shadow: 1px 2px 3px 0px rgba(0, 0, 0, 0.2);
  padding: 20px;
}

.border-box hr {
  border: none;
  height: 1px;
  margin: 0 -20px 0 -20px;
  background: #dedede;
}

.border-box .card-label {
  display: block;
  padding-top: 30px;
  font: normal normal normal 14px/20px Roboto, Arial;
  color: #666;
}

.border-box .card-detail {
  display: block;
  padding-bottom: 27px;
  font: normal normal normal 20px/30px Roboto, Arial;
  color: #333;
}

/*media all*/
.graph-legend li {
  display: inline-block;
  font-size: 12px;
  margin-right: 10px;
}

/*media all*/
.graph-legend .key {
  border-radius: 2px;
  display: inline-block;
  height: 14px;
  margin-right: 5px;
  position: relative;
  top: 3px;
  width: 14px;
}

.graph-legend li .key-open {
  background: rgba(85, 172, 76, 0.6);
}

.graph-legend li .key-paid {
  background: rgb(85, 172, 76);
}

.pull-right::after {
  content: "";
  float: none;
  display: block;
  clear: both;
  height: 0;
}

.pull-right h5 {
  padding: 0;
  margin: 0;
  display: block;
  font-size: 14px;
  line-height: 36px;
  float: left;
}

.timeframe {
  display: block;
  float: left;
  position: relative;
  padding-left: 10px;
  padding-right: 14px;
  height: 36px;
}

.timeframe::after {
  content: "";
  display: block;
  float: none;
  clear: both;
  height: 0;
}

.timeframe a {
  position: relative;
  display: block;
  float: left;
  height: 32px;
  border: 1px solid #ccc;
  padding: 0 5px 0 5px;
  font: normal normal normal 20px/32px "Roboto", Arial;
  color: rgba(0, 0, 0, 0.5);
  text-align: center;
  background-color: #e5e5e5;
  background: -moz-linear-gradient(top, rgb(255, 255, 255) 0%, rgb(229, 229, 229) 100%);
  background: -webkit-linear-gradient(top, rgb(255, 255, 255) 0%, rgb(229, 229, 229) 100%);
  background: linear-gradient(to bottom, rgb(255, 255, 255) 0%, rgb(229, 229, 229) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff", endColorstr="#e5e5e5",GradientType=0 );
  min-width: 24px;
  transition: 0.3s;
}

.timeframe a:hover {
  background: #e5e5e5;
  transition: 0.3s;
}

.timeframe a.current {
  font-size: 14px;
  border-left: none;
  border-right: none;
}

.timeframe a.prev {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.timeframe a.next {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.items .list.tree li {
  padding-left: 10px;
  border-bottom: 1px solid #ccc;
}

.items .list.tree li a {
  padding: 0;
  width: auto;
  border: none;
  padding-left: 15px;
}

.items .list.tree li a.active {
  background: none;
  color: #ff7c2d;
}

.items .list.tree .haschildren.tree ul {
  padding-left: 15px;
}

.items .list.tree li.haschildren ul {
  display: none;
}

.items .list.tree li.haschildren a {
  display: inline-block;
}

.items .list.tree li.haschildren {
  position: relative;
}

.items .list.tree li.haschildren a.plus {
  position: absolute;
  top: 12px;
  left: 6px;
  width: 12px;
  height: 12px;
  border: 1px solid #ccc;
  background: #fff;
  padding: 0;
}

.items .list.tree li.haschildren a.plus::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1px;
  height: 8px;
  margin-top: -4px;
  background: #ccc;
}

.items .list.tree li.haschildren a.plus::after {
  content: "";
  display: block;
  background: #ccc;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 1px;
  margin-left: -4px;
}

.items .list.tree li.haschildren a.plus.on::before {
  display: none;
}

.items .list.tree li.haschildren ul li {
  border: none;
}

.detail p {
  font-size: 12px;
}

td {
  position: relative;
}

td a.clicker, .links td a.clicker {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  min-height: 40px;
  z-index: 1;
}

.perso-holder {
  padding: 20px;
  padding-right: 35px;
}

.perso-holder::after {
  content: "";
  display: block;
  float: none;
  clear: both;
}

.perso-holder .profile-img {
  float: left;
  width: 20%;
}

.perso-holder .profile-img img {
  width: 100%;
  display: block;
  border-radius: 100%;
}

.perso-holder .profile-data {
  float: left;
  width: 80%;
  box-sizing: border-box;
  padding: 20px 0 0 20px;
  font: normal normal normal 13px/20px "Roboto", Arial;
  color: rgba(0, 0, 0, 0.8);
}

.perso-holder .profile-data .profile-contact {
  padding-top: 20px;
  line-height: 30px;
}

.child {
  padding: 0 90px 5px 0;
  position: relative;
}

.child.noaction {
  padding-right: 60px;
  padding-bottom: 0;
}

.child::after {
  content: "";
  display: block;
  float: none;
  clear: both;
}

div.basic dl dd .child .child-c1 {
  width: 60%;
  float: left;
}

div.basic dl dd .child .child-c1 .txt, div.basic dl dd .child .child-c2 .txt {
  border-right: none;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

div.basic dl dd .child .child-c2 .txt {
  width: 40%;
  float: left;
  border-left: none;
  border-radius: 0;
}

div.basic dl dd .child .child-c3 {
  display: block;
  position: absolute;
  top: 0;
  right: 30px;
}

div.basic dl dd .child.noaction .child-c3 {
  right: 0;
}

.child .btn {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 30px;
  height: 36px;
  font-size: 20px;
  line-height: 36px;
  text-decoration: none;
  text-align: center;
  color: #666;
}

div.basic dl dd label.switch {
  padding: 0;
  position: relative;
  display: inline-block;
  width: 60px;
  height: 38px;
  border: 1px solid #ccc;
  box-sizing: border-box;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  overflow: hidden;
}

.switch input, div.basic dl dd .switch input[type=checkbox] {
  display: none;
}

.switch::before {
  Content: "\f222";
  font-family: "Font Awesome 5 Pro";
  position: absolute;
  line-height: 36px;
  top: 0;
  left: 0;
  width: 30px;
  text-align: center;
  z-index: 1;
  font-size: 16px;
  color: #666;
}

.switch::after {
  Content: "\f221";
  font-family: "Font Awesome 5 Pro";
  position: absolute;
  line-height: 36px;
  top: 0;
  right: 0px;
  width: 30px;
  text-align: center;
  z-index: 1;
  font-size: 16px;
  color: #666;
}

.switch .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #e7e7e7;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.switch .slider:before {
  position: absolute;
  content: "";
  height: 36px;
  width: 30px;
  left: 0px;
  bottom: 0px;
  background-color: white;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.switch input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

.switch input:checked + .slider:before {
  -webkit-transform: translateX(28px);
  -ms-transform: translateX(28px);
  transform: translateX(28px);
}

.full-map {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 10px solid #fff;
  z-index: 10000;
}

.full-map #map_canvas {
  width: 100%;
  height: 100%;
}

.full-map a.close {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 50px;
  height: 50px;
  background: #fff;
  color: #666;
  text-align: center;
  line-height: 50px;
  font-size: 20px;
  z-index: 100;
}

div.basic dl dd.small {
  padding-top: 6px;
  line-height: 20px;
}

div.basic dl dd.small a {
  line-height: 20px;
}

.basic a:hover {
  text-decoration: underline;
}

.control-group .w50 {
  width: 50%;
  float: left;
  box-sizing: border-box;
  height: auto;
}

.control-group .w50:first-child {
  padding-right: 5px;
}

.control-group .w50:last-child {
  padding-left: 5px;
}

.control-group::after {
  content: "";
  float: none;
  clear: both;
  display: block;
}

div.basic dl dd a.addvalue {
  background: none;
  display: block;
  width: 38px;
  height: 36px;
  border-left: 1px solid #ccc;
  position: absolute;
  top: 1px;
  right: 1px;
  background: #f7f7f7;
  margin: 0;
  box-sizing: border-box;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  transition: 0.3s;
  color: #ccc;
  font-size: 16px;
  text-decoration: none;
}

div.basic dl dd a.addvalue:hover {
  color: #666;
  transition: 0.3s;
}

div.basic dl dd a.addvalue::before {
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  text-align: center;
  transform: translateY(-50%);
  font-family: "Font Awesome 5 Pro";
  content: "\f055";
  font-weight: bold;
}

div.basic dl dd.closer, div.basic dl dd.closer a {
  font: normal normal normal 13px/22px "Roboto", Arial;
  padding-top: 6px;
  color: rgba(0, 0, 0, 0.8);
}

.icon-row {
  display: block;
  font: normal normal normal 13px/30px "Roboto", Arial;
  color: rgba(0, 0, 0, 0.8);
}

.icon-row i {
  padding-right: 12px;
  color: rgba(0, 0, 0, 0.6);
}

.cards-holder {
  padding: 10px;
}

.card-container.l4 {
  width: 33.33%;
  float: left;
  padding: 10px;
  box-sizing: border-box;
  position: relative;
}

@media all and (max-width: 1200px) {
  .card-container.m6 {
    width: 50%;
  }
}
.card-container .card {
  display: block;
  min-height: 200px;
  border: 1px solid #e5e5e5;
  border-radius: 4px;
}

.card .perso-holder .profile-data {
  padding-top: 0;
}

.cards-holder .card-controls {
  display: block;
  position: absolute;
  top: 20px;
  right: 20px;
  border-top-right-radius: 4px;
  z-index: 1;
  height: 30px;
}

.cards-holder .card-controls::after {
  content: "";
  display: block;
  float: none;
  clear: both;
}

.cards-holder .card-controls a {
  display: block;
  font-size: 20px;
  width: 30px;
  height: 30px;
  text-align: center;
  line-height: 30px;
  color: rgba(0, 0, 0, 0.5);
  float: left;
}

.cards-holder .card-controls .card-controls-ddl {
  position: absolute;
  top: 26px;
  right: 5px;
  border-radius: 4px;
  border: 1px solid #e5e5e5;
  background: #fff;
  display: none;
  padding: 7px 15px 7px 15px;
}

.cards-holder .card-controls .card-controls-ddl a {
  display: block;
  width: auto;
  height: auto;
  font: normal normal normal 13px/22px "Roboto", Arial;
  color: rgba(0, 0, 0, 0.9);
  padding: 8px 0 8px 0;
  white-space: nowrap;
  text-align: left;
}

.cards-holder .card-controls .card-controls-ddl a i {
  font-size: 16px;
  padding-right: 11px;
  color: rgba(0, 0, 0, 0.5);
}

div.basic dl dd.closer strong a {
  font-weight: normal;
}

.note-box {
  margin: 20px;
  border: 1px solid #ccc;
  padding: 15px 10px 0 15px;
}

.note-box::after {
  display: block;
  content: "";
  float: none;
  clear: both;
}

.note-box strong {
  display: block;
  padding-bottom: 6px;
}

.note-box .info-left {
  width: 40%;
  float: left;
  padding-bottom: 10px;
}

.note-box .info-right {
  width: 60%;
  float: left;
  text-align: right;
  padding-top: 5px;
  padding-bottom: 10px;
}

.note-box .info-right::after {
  content: "";
  display: block;
  float: none;
  clear: both;
}

.btnGrey.convert, .btnGrey.add2company, .btnGrey.dismiss {
  line-height: 30px;
  display: block;
  float: right;
  margin-left: 5px;
}

.basic a.btnGrey.convert:hover, .basic a.btnGrey.add2company:hover, .basic a.btnGrey.dismiss:hover {
  text-decoration: none;
}

.btnGrey.convert::before {
  content: "\f1b9";
  font-family: Material-Design-Iconic-Font;
  font-size: 16px;
  line-height: 30px;
  padding-right: 10px;
  padding-left: 10px;
}

.btnGrey.add2company::before {
  content: "\f0c1";
  font-family: "Font Awesome 5 Pro";
  font-size: 16px;
  line-height: 30px;
  padding-right: 10px;
  padding-left: 10px;
}

.btnGrey.dismiss::before {
  content: "\f127";
  font-family: "Font Awesome 5 Pro";
  font-size: 16px;
  line-height: 30px;
  padding-right: 10px;
  padding-left: 10px;
}

.basic a {
  color: #999;
}

.zmdi.company-icon {
  display: block;
  position: absolute;
  top: 11px;
  left: 3px;
  font-size: 16px;
  color: rgba(0, 0, 0, 0.5);
}

.links td a.action {
  display: block;
}

.links td a i {
  line-height: 36px;
  font-size: 18px;
  color: #999;
}

.msgFooter a.btnGreen {
  line-height: 37px;
  color: #fff;
  text-transform: uppercase;
  width: 120px;
  float: none;
  margin: auto;
}

.chkList br {
  display: none;
}

.inner-form.description p {
  font-size: 13px;
}

.hidden .control-holder {
  display: none;
}

.highlight-links a {
  color: #2c94d4;
  transition: 0.3s;
}

.highlight-links a:hover {
  text-decoration: underline;
  transition: 0.3s;
}

.scrollHolder::after {
  content: "";
  display: block;
  height: 50px;
}

.box .header h3 span {
  font: normal normal normal 20px/50px Roboto, Arial;
}

.no-highlight .selected td {
  background-color: #fff;
}

.no-highlight .selected td.ui-sortable-handle {
  cursor: s-resize;
}

.invTable .zmdi-format-line-spacing {
  font-size: 20px;
  color: rgba(0, 0, 0, 0.4);
}

.invTable .check {
  display: inline-block;
  display: inline-block;
  width: 17px;
  height: 17px;
  vertical-align: middle;
  border: 1px solid #ccc;
  border-radius: 3px;
  color: #ccc !important;
  text-align: center;
  line-height: 15px;
  font-size: 15px;
}

.invTable .selected .check {
  cursor: pointer;
  border: 1px solid #10b376;
  background-color: #10b376;
  text-align: center;
}

.invTable .selected .check::before {
  content: "\f26b";
  color: #fff !important;
  text-align: center;
  font-family: "Material-Design-Iconic-Font";
}

.select2-container {
  box-sizing: border-box;
  display: inline-block;
  margin: 0;
  position: relative;
  vertical-align: middle;
}
.select2-container .select2-selection--single {
  box-sizing: border-box;
  cursor: pointer;
  display: block;
  height: 28px;
  user-select: none;
  -webkit-user-select: none;
}
.select2-container .select2-selection--single .select2-selection__rendered {
  display: block;
  padding-left: 8px;
  padding-right: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.select2-container .select2-selection--single .select2-selection__clear {
  position: relative;
}
.select2-container[dir=rtl] .select2-selection--single .select2-selection__rendered {
  padding-right: 8px;
  padding-left: 20px;
}
.select2-container .select2-selection--multiple {
  box-sizing: border-box;
  cursor: pointer;
  display: block;
  min-height: 36px;
  user-select: none;
  -webkit-user-select: none;
}
.select2-container .select2-selection--multiple .select2-selection__rendered {
  display: inline-block;
  overflow: hidden;
  padding-left: 8px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.select2-container .select2-search--inline {
  float: left;
}
.select2-container .select2-search--inline .select2-search__field {
  box-sizing: border-box;
  border: none;
  font-size: 100%;
  margin-top: 5px;
  padding: 0;
}
.select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button {
  -webkit-appearance: none;
}

.select2-dropdown {
  background-color: white;
  border: 1px solid #aaa;
  border-radius: 5px;
  box-sizing: border-box;
  display: block;
  position: absolute;
  left: -100000px;
  width: 100%;
  z-index: 1051;
}

.select2-results {
  display: block;
}

.select2-results__options {
  list-style: none;
  margin: 0;
  padding: 0;
}

.select2-results__option {
  padding: 6px;
  user-select: none;
  -webkit-user-select: none;
}
.select2-results__option[aria-selected] {
  cursor: pointer;
}

.select2-container--open .select2-dropdown {
  left: 0;
}

.select2-container--open .select2-dropdown--above {
  border-bottom: none;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.select2-container--open .select2-dropdown--below {
  border-top: none;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.select2-search--dropdown {
  display: block;
  padding: 4px;
}
.select2-search--dropdown .select2-search__field {
  padding: 4px;
  width: 100%;
  box-sizing: border-box;
}
.select2-search--dropdown .select2-search__field::-webkit-search-cancel-button {
  -webkit-appearance: none;
}
.select2-search--dropdown.select2-search--hide {
  display: none;
}

.select2-close-mask {
  border: 0;
  margin: 0;
  padding: 0;
  display: block;
  position: fixed;
  left: 0;
  top: 0;
  min-height: 100%;
  min-width: 100%;
  height: auto;
  width: auto;
  opacity: 0;
  z-index: 99;
  background-color: #fff;
  filter: alpha(opacity=0);
}

.select2-hidden-accessible {
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  width: 1px !important;
}

.select2-container--default .select2-selection--single {
  background-color: #fff;
  border: 1px solid #aaa;
  border-radius: 4px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #444;
  line-height: 28px;
}
.select2-container--default .select2-selection--single .select2-selection__clear {
  cursor: pointer;
  float: right;
  font-weight: bold;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: #999;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 26px;
  position: absolute;
  top: 1px;
  right: 1px;
  width: 20px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: #888 transparent transparent transparent;
  border-style: solid;
  border-width: 5px 4px 0 4px;
  height: 0;
  left: 50%;
  margin-left: -4px;
  margin-top: -2px;
  position: absolute;
  top: 50%;
  width: 0;
}
.select2-container--default[dir=rtl] .select2-selection--single .select2-selection__clear {
  float: left;
}
.select2-container--default[dir=rtl] .select2-selection--single .select2-selection__arrow {
  left: 1px;
  right: auto;
}
.select2-container--default.select2-container--disabled .select2-selection--single {
  background-color: #eee;
  cursor: default;
}
.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear {
  display: none;
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent #888 transparent;
  border-width: 0 4px 5px 4px;
}
.select2-container--default .select2-selection--multiple {
  background-color: white;
  border: 1px solid #aaa;
  border-radius: 5px;
  cursor: text;
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered {
  box-sizing: border-box;
  list-style: none;
  margin: 0;
  padding: 0 5px;
  width: 100%;
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered li {
  list-style: none;
}
.select2-container--default .select2-selection--multiple .select2-selection__placeholder {
  color: #999;
  margin-top: 5px;
  float: left;
}
.select2-container--default .select2-selection--multiple .select2-selection__clear {
  cursor: pointer;
  float: right;
  font-weight: bold;
  margin-top: 5px;
  margin-right: 10px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
  background-color: #e4e4e4;
  border: 1px solid #aaa;
  border-radius: 5px;
  cursor: default;
  float: left;
  margin-right: 5px;
  margin-top: 5px;
  padding: 0 5px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  color: #999;
  cursor: pointer;
  display: inline-block;
  font-weight: bold;
  margin-right: 2px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
  color: #333;
}
.select2-container--default[dir=rtl] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir=rtl] .select2-selection--multiple .select2-selection__placeholder, .select2-container--default[dir=rtl] .select2-selection--multiple .select2-search--inline {
  float: right;
}
.select2-container--default[dir=rtl] .select2-selection--multiple .select2-selection__choice {
  margin-left: 5px;
  margin-right: auto;
}
.select2-container--default[dir=rtl] .select2-selection--multiple .select2-selection__choice__remove {
  margin-left: 2px;
  margin-right: auto;
}
.select2-container--default.select2-container--focus .select2-selection--multiple {
  border: solid black 1px;
  outline: 0;
}
.select2-container--default.select2-container--disabled .select2-selection--multiple {
  background-color: #eee;
  cursor: default;
}
.select2-container--default.select2-container--disabled .select2-selection__choice__remove {
  display: none;
}
.select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
  border: 1px solid #aaa;
}
.select2-container--default .select2-search--inline .select2-search__field {
  background: transparent;
  border: none;
  outline: 0;
  box-shadow: none;
  -webkit-appearance: textfield;
}
.select2-container--default .select2-results > .select2-results__options {
  max-height: 200px;
  overflow-y: auto;
}
.select2-container--default .select2-results__option[role=group] {
  padding: 0;
}
.select2-container--default .select2-results__option[aria-disabled=true] {
  color: #ccc;
}
.select2-container--default .select2-results__option[aria-selected=true] {
  background-color: #ddd;
}
.select2-container--default .select2-results__option .select2-results__option {
  padding-left: 1em;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__group {
  padding-left: 0;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option {
  margin-left: -1em;
  padding-left: 2em;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
  margin-left: -2em;
  padding-left: 3em;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
  margin-left: -3em;
  padding-left: 4em;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
  margin-left: -4em;
  padding-left: 5em;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
  margin-left: -5em;
  padding-left: 6em;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: #5897fb;
  color: white;
}
.select2-container--default .select2-results__group {
  cursor: default;
  display: block;
  padding: 6px;
}

.select2-container--classic .select2-selection--single {
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  height: 36px;
  outline: 0;
}
.select2-container--classic .select2-selection--single:focus {
  border: 1px solid #ccc;
}
.select2-container--classic .select2-selection--single .select2-selection__rendered {
  color: #444;
  line-height: 34px;
}
.select2-container--classic .select2-selection--single .select2-selection__clear {
  cursor: pointer;
  float: right;
  font-weight: bold;
  margin-right: 10px;
}
.select2-container--classic .select2-selection--single .select2-selection__placeholder {
  color: #999;
}
.select2-container--classic .select2-selection--single .select2-selection__arrow {
  background-color: #fff;
  border: none;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  height: 34px;
  position: absolute;
  top: 1px;
  right: 1px;
  width: 20px;
  line-height: 34px;
  text-align: center;
}
.select2-container--classic .select2-selection--single .select2-selection__arrow::before {
  content: "\f2f9";
  font-family: "Material-Design-Iconic-Font";
  font-size: 20px;
  line-height: 34px;
  color: #999;
}
.select2-container--classic .select2-selection--single .select2-selection__arrow b {
  display: none;
}
.select2-container--classic .select2-results__option {
  padding: 7px 15px 7px 15px;
  line-height: 20px;
}
.select2-container--classic .select2-search--dropdown {
  padding: 9px;
  border-bottom: 1px solid #ccc;
}
.select2-container--classic[dir=rtl] .select2-selection--single .select2-selection__clear {
  float: left;
}
.select2-container--classic[dir=rtl] .select2-selection--single .select2-selection__arrow {
  border: none;
  border-right: 1px solid #ccc;
  border-radius: 0;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  left: 1px;
  right: auto;
}
.select2-container--classic.select2-container--open .select2-selection--single {
  background: #e4e4e4;
}
.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow {
  background: transparent;
  border: none;
}
.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow::before {
  content: "\f2fc";
}
.select2-container--classic .select2-selection--multiple {
  background-color: white;
  border: 1px solid #ccc;
  border-radius: 4px;
  cursor: text;
  outline: 0;
}
.select2-container--classic .select2-selection--multiple:focus {
  border: 1px solid #ccc;
}
.select2-container--classic .select2-selection--multiple .select2-selection__rendered {
  list-style: none;
  margin: 0;
  padding: 0 5px;
}
.select2-container--classic .select2-selection--multiple .select2-selection__clear {
  display: none;
}
.select2-container--classic .select2-selection--multiple .select2-selection__choice {
  background-color: #e4e4e4;
  border: 1px solid #ccc;
  border-radius: 4px;
  cursor: default;
  float: left;
  margin-right: 5px;
  margin-top: 5px;
  padding: 0 5px;
}
.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove {
  color: #888;
  cursor: pointer;
  display: inline-block;
  font-weight: bold;
  margin-right: 2px;
}
.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover {
  color: #555;
}
.select2-container--classic[dir=rtl] .select2-selection--multiple .select2-selection__choice {
  float: right;
}
.select2-container--classic[dir=rtl] .select2-selection--multiple .select2-selection__choice {
  margin-left: 5px;
  margin-right: auto;
}
.select2-container--classic[dir=rtl] .select2-selection--multiple .select2-selection__choice__remove {
  margin-left: 2px;
  margin-right: auto;
}
.select2-container--classic.select2-container--open .select2-selection--multiple {
  border: 1px solid #ccc;
}
.select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple {
  border-top: none;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple {
  border-bottom: none;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.select2-container--classic .select2-search--dropdown {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-top: none;
  border-left: none;
  border-right: none;
}
.select2-container--classic .select2-search--dropdown .select2-search__field {
  border: 1px solid #ccc;
  outline: 0;
  background: #fff;
  border-radius: 4px;
  line-height: 26px;
}
.select2-container--classic .select2-search--inline .select2-search__field {
  outline: 0;
  box-shadow: none;
}
.select2-container--classic .select2-dropdown {
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
}
.select2-container--classic .select2-dropdown--above {
  border-bottom: none;
}
.select2-container--classic .select2-dropdown--above::before {
  bottom: -8px;
  left: 12px;
}
.select2-container--classic .select2-dropdown--below {
  position: relative;
}
.select2-container--classic .select2-dropdown--below::before {
  content: "";
  display: block;
  position: absolute;
  top: -10px;
  left: 12px;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #ccc;
}
.select2-container--classic .select2-dropdown--below::after {
  content: "";
  display: block;
  position: absolute;
  top: -9px;
  left: 14px;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 9px solid #fff;
}
.select2-container--classic .select2-results > .select2-results__options {
  max-height: 200px;
  overflow-y: auto;
}
.select2-container--classic .select2-results__option[role=group] {
  padding: 0;
}
.select2-container--classic .select2-results__option[aria-disabled=true] {
  color: grey;
}
.select2-container--classic .select2-results__option--highlighted[aria-selected] {
  background-color: #efefef;
  color: rgba(0, 0, 0, 0.8);
}
.select2-container--classic .select2-results__group {
  cursor: default;
  display: block;
  padding: 6px;
}
.select2-container--classic.select2-container--open .select2-dropdown {
  border-color: #ccc;
  margin-top: 3px;
}

table tr td.sort {
  display: none;
}

table tr td.sort i, .ui-sortable i.fa-bars {
  font-size: 13px;
  color: #ccc;
}

.sortable table tr td.sort {
  display: table-cell;
  cursor: n-resize;
}

.caps {
  text-transform: uppercase;
}

.subsubSection {
  height: 34px;
  background: #fafafa;
  border-bottom: 1px solid #eee;
  line-height: 36px;
  padding-left: 15px;
  font-size: 13px;
  font-weight: bold;
}

a.cta {
  display: inline-block;
  padding: 7px 15px;
  font: normal normal normal 16px/24px "Roboto", Arial !important;
  color: #777;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 3px;
  text-decoration: none;
  text-transform: none;
  box-sizing: border-box;
}

a.cta i {
  padding-right: 8px;
  font-size: 18px;
}

a.cta i.sm {
  font-size: 14px;
}

a.cta i.yellow {
  color: #ebbe1c;
}

a.cta.next::after {
  display: inline-block;
  font-family: FontAwesome;
  font-size: 16px;
  line-height: 24px;
  padding-right: 0px;
  padding-left: 8px;
  content: "\f105";
}

a.cta.previous::before {
  display: inline-block;
  font-family: FontAwesome;
  font-size: 16px;
  line-height: 24px;
  padding-right: 8px;
  padding-left: 0px;
  content: "\f104";
}

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

a.cta.green, a.cta.confirm {
  background-color: #08c880;
  border-color: #08c880;
  color: #fff !important;
}

a.cta.green span, a.cta.confirm span {
  font: normal normal normal 14px/24px "Roboto", Arial !important;
  color: #fff;
}

a.cta.red {
  background-color: #ee394d;
  border-color: #ee394d;
  color: #fff;
}

a.cta.light-grey {
  background-color: #eee;
  border-color: #eee;
  color: #999;
  font-weight: normal;
}

a.cta.light-grey-border {
  background-color: #fafafa;
  border-color: #eee;
  color: #999;
  font-weight: normal;
}

a.cta.link {
  background: none;
  border: none;
  color: #777;
  font-weight: normal !important;
  font-size: 12px !important;
  padding: 6px 10px 6px 10px;
  text-decoration: underline;
}

a.cta.outline.blue {
  color: #01a8dc;
  border-color: #01a8dc;
}

.max1400 {
  max-width: 1400px;
}

.max1400::after {
  content: "";
  display: block;
  float: none;
  clear: both;
  height: 0;
}

.max1400 .optionDiv {
  width: 25%;
}

@media all and (max-width: 1200px) {
  .max1400 .optionDiv {
    width: 33.33%;
  }
}
@media all and (max-width: 800px) {
  .max1400 .optionDiv {
    width: 50%;
  }
}
.disabled-overlay-holder {
  position: relative;
}

.disabled-overlay {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  background: rgba(255, 255, 255, 0.7);
  z-index: 1000;
}

.disabled-title {
  position: absolute;
  top: 230px;
  left: 0px;
  right: 0px;
  text-align: center;
  font: normal normal normal 30px/60px Roboto, Arial;
  color: #999;
}

.subtab-holder {
  float: right;
}

.subSection .subtab-holder a {
  display: block;
  float: left;
  margin-top: 0 !important;
  padding: 0 15px 0 15px;
  border: 1px solid rgb(204, 204, 204);
  border-bottom: 0;
  border-left: 0;
}

.subSection .subtab-holder a.active {
  color: #333;
  background: #fff;
}

.subSection .subtab-holder a:first-child {
  border-left: 1px solid rgb(204, 204, 204);
}

div.basic dl dd a.inline-link {
  line-height: 20px;
  display: inline-block;
  padding-top: 5px;
  font-size: 13px;
  color: #333;
}

div.basic dl dd a.inline-link i {
  font-size: 9px;
  color: #999;
  padding-left: 7px;
}

div.basic dl dd a.inline-link i.fas {
  display: none;
}

div.basic dl dd a.inline-link:hover i.fas {
  display: inline-block;
  color: #ff7c2d;
}

div.basic dl dd a.inline-link:hover i.fal {
  display: none;
}

div.basic dl dd a.inline-link .light {
  color: #666;
}

i.severity {
  display: block;
  width: 32px;
  height: 32px;
  background: #ccc;
  margin: auto;
}

i.severity.l2 {
  background: #fdd12f;
}

i.severity.tires.l2 {
  background: #08c880;
}

i.severity.l3 {
  background: #f59b22;
}

i.severity.l4 {
  background: #d02e27;
}

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

.icon i {
  color: #ddd;
  font-size: 16px;
}

.icon.green i {
  color: #08c880;
}

.underline-hover {
  white-space: nowrap;
}

.underline-hover span {
  display: inline-block;
  position: relative;
  padding-right: 15px;
}

.underline-hover span::after {
  content: "\f05a";
  line-height: 18px;
  font-size: 10px;
  font-family: "Font Awesome 5 Pro";
  font-weight: 300;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  color: #999;
}

.underline-hover:hover span {
  text-decoration: underline;
}

.underline-hover:hover span::after {
  color: #ff7f2c;
  font-weight: bold;
}

.promo-field {
  width: 100%;
  border: 1px solid #cccccc;
  border-radius: 3px;
  box-sizing: border-box;
  position: relative;
  transition: 0.3s;
}

.promo-field.on {
  border-color: #08c880;
}

.promo-field .original-price {
  display: block;
  font: normal normal normal 12px/20px "Roboto", Arial;
  color: #777;
  text-decoration: line-through;
  padding: 0px 0 0 10px;
  height: 0;
  overflow: hidden;
  transition: 0.3s;
}

.promo-field.on .original-price {
  display: block;
  padding-top: 6px;
  height: 20px;
  transition: 0.3s;
}

.promo-field a, div.basic dl dd .promo-field a {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 37px;
  text-align: center;
  line-height: 36px;
  color: #ccc;
  font-size: 16px;
  border-left: 1px solid #ccc;
  background: #f7f7f7;
  min-height: 36px;
  text-decoration: none;
}

.promo-field.on a, div.basic dl dd .promo-field.on a {
  background: #08c880;
  border-color: #08c880;
  color: #fff;
  right: -1px;
}

.promo-field a i {
  display: block;
  position: absolute;
  top: 50%;
  width: 100%;
  left: 0;
  transform: translateY(-50%);
}

.promo-field a i:last-child {
  display: none;
}

.promo-field.on a i:first-child {
  display: none;
}

.promo-field.on a i:last-child {
  display: block;
}

.promo-field span.note, div.basic .promo-field span.note {
  position: absolute;
  right: 50px;
  top: 50%;
  transform: translateY(-50%);
  border: none;
  width: auto;
}

dd span.note:before, div.basic dd span.note:before {
  content: "€";
  padding-right: 6px;
}

.promo-field span.profit, div.basic .promo-field span.profit {
  position: absolute;
  right: 110px;
  top: 49%;
  transform: translateY(-50%);
  border: none;
  width: auto;
}

.promo-field input {
  display: block;
  border: none;
  background: none;
  width: 100%;
  box-sizing: border-box;
  padding-left: 10px;
  min-height: 36px;
  line-height: 36px;
  font-size: 14px;
}

.promo-field.on input {
  font-weight: bold;
  line-height: 20px;
  min-height: 20px;
  padding-bottom: 6px;
}

.has-promo span, .no-promo span {
  display: block;
  color: #0ea86e;
  font-weight: 500;
}

.no-promo span {
  color: #333;
}

.has-promo span.old-price {
  text-decoration: line-through;
  color: #999;
  font-size: 11px;
  font-weight: normal;
}

.tc a {
  display: inline-block;
  position: relative;
}

.pagination a.btnGreen.next {
  margin-top: 10px;
}

.inline.rounded.error {
  border: 0;
}

.inline.rounded.error label {
  color: #b70b0b;
}

.inline.rounded.error label::before {
  border-color: #b70b0b;
}

.address i {
  width: 24px;
  min-height: 1px;
  display: inline-block;
}

.items .list.tree li a.sort {
  display: block;
  position: absolute;
  right: 0px;
  top: 0px;
  width: 30px;
}

.sortBox li {
  border-top: 1px solid #e5e5e5;
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: -1px;
  background: #fff;
  padding: 5px 5px 5px 0;
  cursor: n-resize;
}

.sortBox li::before {
  font-family: "Font Awesome 5 Pro";
  content: "\f0dc";
  font-weight: 400;
  color: #e5e5e5;
  padding-right: 7px;
}

.totals-row-auction {
  float: right;
  padding-right: 115px;
  padding-top: 20px;
}
.totals-row-auction label {
  color: #444;
}
.totals-row-auction span {
  min-width: 60px;
  display: inline-block;
  text-align: right;
  padding-left: 20px;
  font-weight: 500;
}

.onlineusers .tHead {
  height: 29px;
  background: #f7f7f7;
  font: normal normal normal 10px/29px Roboto, Arial;
  color: #666;
  border-bottom: 1px solid #dedede;
  text-align: left;
  padding: 0 10px 0 10px;
  white-space: nowrap;
}
.onlineusers .tBody a {
  display: block;
  text-decoration: none;
  border-bottom: 1px solid #dedede;
  font: normal normal normal 12px/16px Roboto, Arial;
  color: #444;
  padding: 0px 0 0px 10px;
  box-sizing: border-box;
  overflow: hidden;
  max-height: 0;
}
.onlineusers .tBody a em {
  display: block;
  color: #999;
  font-style: normal;
}

.msgBox .control-holder.auto-height {
  border: 1px solid #ccc;
  margin-bottom: 10px;
}

.carpass-box {
  margin: 0 0 0 20px;
  border: 1px solid #e5e5e5;
  padding: 20px;
}

.card-ddl-holder {
  display: block;
  float: left;
  padding-left: 6px;
  position: relative;
}
.card-ddl-holder .card-ddl-active {
  background: #fff;
  border: 1px solid #d5d5d5;
  border-radius: 5px;
  display: block;
  padding: 9px 12px 9px 12px;
  font: normal normal normal 13px/19px "Roboto";
  color: #777;
  text-transform: uppercase;
  transition: 0.3s;
}
.card-ddl-holder .card-ddl-active:hover {
  color: #444;
  transition: 0.3s;
}
.card-ddl-holder .card-ddl-active i {
  padding-left: 5px;
}
.card-ddl-holder .card-ddl-active.icon {
  min-width: 40px;
  text-align: center;
  box-sizing: border-box;
}
.card-ddl-holder .card-ddl-active.icon i {
  padding: 0;
  color: #777;
  font-size: 18px;
  line-height: 18px;
  margin: -2px 0;
}
.card-ddl-holder .card-ddl-active.dark {
  background: #fafafa;
}
.card-ddl-holder .card-ddl-items {
  opacity: 0;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  will-change: transform;
  pointer-events: none;
  position: absolute;
  right: 0;
  min-width: 200px;
  top: 43px;
  box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.2);
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 5px;
  z-index: 10;
  transform: scale(0.95) translateY(-20px);
  padding: 5px 0 5px 0;
}
.card-ddl-holder .card-ddl-items.wider {
  width: 250px;
}
.card-ddl-holder .card-ddl-items.open {
  pointer-events: all;
  transition: all 0.2s;
  opacity: 1;
  transform: scale(1) translateY(0px);
}
.card-ddl-holder .card-ddl-items a {
  display: block;
  padding: 10px 12px 10px 12px;
  font: normal normal normal 13px/20px "Roboto";
  color: #444;
  transition: 0.3s;
  margin: 0 5px 0 5px;
  border-radius: 3px;
}
.card-ddl-holder .card-ddl-items a:hover {
  background: #f5f5f5;
  transition: 0.3s;
}
.card-ddl-holder .card-ddl-items a i {
  padding-right: 8px;
  color: #777;
  font-size: 16px;
  line-height: 20px;
}
.card-ddl-holder .card-ddl-items a i.zmdi {
  font-size: 20px;
}
.card-ddl-holder .card-ddl-items a i.green {
  color: #08c880;
}
.card-ddl-holder .card-ddl-items .title {
  display: block;
  padding: 10px 12px 10px 12px;
  font: normal normal normal 13px/20px "Roboto";
  font-weight: 500;
  color: #444;
}
.card-ddl-holder .card-ddl-items::before {
  content: "";
  display: block;
  position: absolute;
  top: -10px;
  right: 12px;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #ccc;
}
.card-ddl-holder .card-ddl-items::after {
  content: "";
  display: block;
  position: absolute;
  top: -9px;
  right: 14px;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 9px solid #fff;
}
.card-ddl-holder .card-ddl-items hr {
  padding: 0;
  margin: 0;
  border: none;
  background: #ccc;
  height: 1px;
  margin: 5px 0 5px 0;
}

.pl-label {
  padding-left: 140px;
}

a.cta.f-left, .tools {
  display: block;
  float: left;
}

.fileinput-button.cta {
  width: auto;
  margin: 0;
  padding: 1px 15px 1px 15px;
  font: normal normal normal 14px/34px "Roboto", Arial !important;
  border: 1px solid #08c880;
  background: #08c880;
  border-radius: 3px;
  text-transform: uppercase;
  color: #fff;
}
.fileinput-button.cta i {
  padding-right: 8px;
}

.hidden-btn {
  height: 0px;
  overflow: hidden;
  position: absolute;
}

.box .content table td em.profit, table td em.profit {
  text-align: center;
  width: 23px;
  height: 23px;
  line-height: 23px;
  border-radius: 11px;
  color: #444;
  background: #f7f7f7;
  font-weight: 600;
  font-size: 10px;
  display: inline-block;
}
.box .content table td em.profit.yellow, table td em.profit.yellow {
  background: #ffc000;
  color: #fff;
}
.box .content table td em.profit.green, table td em.profit.green {
  background: #92d050;
  color: #fff;
}
.box .content table td em.profit.blue, table td em.profit.blue {
  background: #3691d4;
  color: #fff;
}
.box .content table td em.profit.red, table td em.profit.red {
  background: #ff0000;
  color: #fff;
}

.box .content table td.extra-small, table td.extra-small, .w80 .auctiondata tbody tr td.extra-small, .auctiondata tr.header td.extra-small {
  padding: 0;
  width: 10px;
}

.text-light, .auctiondata td.text-light {
  color: #999;
}

.nobg-pageheader {
  position: relative;
  background: none;
  display: flex;
  z-index: 10;
  transition: 0.3s;
  background: #fafafa;
  border-bottom: 1px solid #e0e0e0;
  box-sizing: border-box;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 0;
  min-height: 80px;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  transition-property: padding-left;
  transition-duration: 0.5s;
}
.nobg-pageheader.shift-right {
  padding-left: 70px;
  transition-property: padding-left;
  transition-duration: 0.5s;
}
.nobg-pageheader.shadow {
  background: #fff;
  border-bottom-color: #fff;
  box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.3);
  transition: 0.3s;
}
.nobg-pageheader .p20 {
  padding: 20px;
  padding-top: 15px;
  padding-bottom: 15px;
}
.nobg-pageheader h1 {
  font-size: 26px;
  line-height: 30px;
  color: #444;
  font-family: "Roboto";
  position: relative;
  min-height: 30px;
  padding: 5px 0;
}
.nobg-pageheader h1 .h1-size {
  font-size: 26px;
  line-height: 30px;
  color: #444;
  padding: 2.5px 0 2.5px;
  display: block;
}
.nobg-pageheader h1 span {
  font-size: 26px;
}
.nobg-pageheader h1 .small {
  font-size: 18px !important;
  line-height: 22px;
  display: block;
}
.nobg-pageheader .tools {
  display: block;
  float: right;
  margin-top: 0px;
  top: 20px;
  position: absolute;
  right: 20px;
  flex-direction: row;
  align-items: center;
}
.nobg-pageheader .tools::after {
  content: "";
  display: block;
  float: none;
  clear: both;
}
.nobg-pageheader .btn-back {
  display: block;
  box-sizing: border-box;
  width: 26px;
  height: 50px;
  line-height: 50px;
  font-size: 24px;
}

.tools-menu-btn {
  margin-left: 6px;
  background: #fafafa;
  border: 1px solid #d5d5d5;
  border-radius: 5px;
  display: block;
  float: left;
  padding: 9px 12px 9px 12px;
  font: normal normal normal 13px/20px "Roboto";
  color: #777;
  text-transform: uppercase;
  transition: 0.3s;
  min-width: 40px;
  text-align: center;
  box-sizing: border-box;
}
.tools-menu-btn:hover {
  color: #444;
  transition: 0.3s;
}
.tools-menu-btn.green {
  color: #00c981;
  background: #fff;
  border: 1px solid #00c981;
}
.tools-menu-btn.green i {
  color: #00c981;
}
.tools-menu-btn.green-bg {
  color: #fff;
  background: #00c981;
  border: 1px solid #00c981;
  padding: 7px 12px 7px 12px;
}
.tools-menu-btn.green-bg i {
  color: #fff;
  font-size: 20px;
  line-height: 23px;
  padding-left: 0;
}

.cc.center {
  margin: auto;
}

.cc {
  max-width: 1400px;
}

.card-holder .card .row12 {
  border-bottom: none;
}

.card-holder .row12 .col {
  padding: 0;
}

.p10 {
  padding: 10px;
}

em.help, .smallFields div.basic dl dt em.help {
  float: right;
  display: block;
  width: 17px;
  height: 15px;
  min-height: 15px;
  margin: 0 0 0 10px;
  background: url(/assets/images/crm/help.png) no-repeat left center;
  z-index: 1;
  padding: 0;
  position: relative;
}

div.basic dl dt, div.basic dl dd {
  position: relative;
}

em.help div {
  display: none;
  position: absolute;
  top: 0px;
  left: 20px;
  width: 120px;
  padding: 5px;
  background: #f7f7f7;
  border: 1px solid #ccc;
  border-radius: 2px;
  font: normal normal normal 11px/14px "Roboto", Arial;
  color: #333;
  box-shadow: 1px 1px 3px 0px rgba(0,0,0, 0.2);
  text-decoration: none;
}

em.help div span {
  display: block;
  position: absolute;
  right: -6px;
  top: 50%;
  margin-top: -6px;
  width: 6px;
  height: 12px;
}

/* DIV classes */
.smallFields div.basic dl dt {
  width: 180px;
  padding: 10px 0 0 0;
  max-height: 22px;
}

.smallFields div.basic dl dd {
  max-width: 280px;
  width: 100%;
}

.smallFields div.basic dl dt em {
  padding-left: 15px;
  width: 29px;
  float: left;
  text-align: left;
  font-style: normal;
  color: #999;
  min-height: 12px;
}

.smallFields div.basic dl dt label {
  float: left;
}

.smallFields div.basic dl dd select, .smallFields div.basic dl dd input.txt, .smallFields div.basic dl dd select.txt {
  box-sizing: border-box;
  width: 100%;
  height: 32px;
}

.smallFields div.basic dl dd select.txt.d, .smallFields div.basic dl dd select.txt.m, .smallFields div.basic dl dd select.txt.y {
  width: 91px;
}

.smallFields div.basic dl dd select.txt.m {
  width: 90px;
}

.smallFields div.basic dl dd select.txt.half {
  width: 139px;
  float: left;
}

.smallFields div.basic dl dd select.txt.half.r {
  float: right;
}

.smallFields div.basic dl dd textarea, .smallFields div.basic dl dd textarea.txt {
  box-sizing: border-box;
  width: 100%;
  height: 132px;
}

.smallFields .ui-trigger, .smallFields .ui-datepicker-trigger {
  width: 11.4%;
}

.smallFields div.basic dl dd input.date, .smallFields div.basic dl dd select.date, .smallFields div.basic dl dd input.txt.date, .smallFields div.basic dl dd select.txt.date {
  width: 88.5%;
}

.axle2, .axle3, .axle4, .axle5,
div.basic dl dd label.axle2, div.basic dl dd label.axle3, div.basic dl dd label.axle4, div.basic dl dd label.axle5,
div.basic dl dt.axle2, div.basic dl dd.axle2, div.basic dl dt.axle3, div.basic dl dd.axle3, div.basic dl dt.axle4, div.basic dl dd.axle4, div.basic dl dt.axle5, div.basic dl dd.axle5 {
  display: none;
}

.lblinside, div.basic dl dd label.lblinside {
  display: block;
  position: absolute;
  top: 0;
  right: 10px;
  font: normal normal normal 10px/16px "Roboto", Arial;
  top: 11px;
}

.display-group label, .card .row12 .display-group label, .input-group label, .card .row12 .input-group label {
  font-size: 10px;
  line-height: 12px;
  color: #999;
  text-align: left;
  padding: 0;
  font-weight: normal;
  text-transform: uppercase;
  display: inline-block;
  min-height: 17px;
}

.row12 .col .input-group {
  margin-bottom: 10px;
}
.row12 .col .input-group .input-control {
  border: 1px solid #ccc;
  border-radius: 3px;
  width: 100%;
  min-height: 38px;
  box-sizing: border-box;
  position: relative;
}
.row12 .col .input-group .input-control.error {
  border-color: #ff0000;
  background-color: #ff0000;
}
.row12 .col .input-group .input-control select, .row12 .col .input-group .input-control input[type=text] {
  border: none;
  width: 100%;
  height: 36px;
  line-height: 20px;
  padding: 8px;
  min-height: 36px;
}
.row12 .col .input-group .input-control select.d, .row12 .col .input-group .input-control select.m, .row12 .col .input-group .input-control select.y, .row12 .col .input-group .input-control input[type=text].d, .row12 .col .input-group .input-control input[type=text].m, .row12 .col .input-group .input-control input[type=text].y {
  width: 33%;
  float: left;
}
.row12 .col .input-group .input-control select.half, .row12 .col .input-group .input-control input[type=text].half {
  width: 50%;
  float: left;
}
.row12 .col .input-group .input-control select.unit, .row12 .col .input-group .input-control input[type=text].unit {
  padding-right: 80px;
}
.row12 .col .input-group .input-control select.unit {
  padding-right: 5px;
  font-size: 10px;
  width: 70px;
  color: #999;
  position: absolute;
  top: 0px;
  right: 0px;
}
.row12 .col .input-group .input-control.icon {
  padding-right: 30px;
  position: relative;
}
.row12 .col .input-group .input-control.icon a {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 36px;
  height: 36px;
  line-height: 36px;
  text-align: center;
  text-decoration: none;
  color: #777;
  background: #f7f7f7;
  border-left: 1px solid #ccc;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}
.row12 .col .input-group div select, .row12 .col .input-group div input[type=text] {
  width: 100%;
  height: 38px;
  line-height: 20px;
  padding: 8px;
}
.row12 .col .input-group .input-checkbox input[type=checkbox] {
  display: none;
}
.row12 .col .input-group .input-checkbox input[type=checkbox] + label {
  color: #444;
  font-size: 14px;
  min-height: 20px;
  cursor: pointer;
  float: none;
  display: block;
  position: relative;
  padding-left: 30px;
  padding-bottom: 3px;
  padding-top: 3px;
  line-height: 20px;
  text-transform: none;
}
.row12 .col .input-group .input-checkbox input[type=checkbox] + label::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  vertical-align: middle;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 3px;
  color: #ccc !important;
  text-align: center;
  line-height: 14px;
  font-size: 14px;
  position: absolute;
  top: 3px;
  left: 0px;
}
.row12 .col .input-group .input-checkbox input[type=checkbox]:checked + label::before {
  content: "\f26b";
  color: #fff !important;
  border: 1px solid #10b376;
  background-color: #10b376;
  text-align: center;
  font-family: "Material-Design-Iconic-Font";
}

.input-group label em {
  font-style: normal;
  padding-right: 5px;
  font-size: 11px;
}

.input-group label span {
  font-size: 10px;
}

input.vin {
  text-transform: uppercase;
}

.form .row12.g5 {
  margin: 0 -15px 0 -15px;
}

.form .row12.g5 col, .card-holder .form .row12.g5 .col {
  padding: 0 10px 0 10px;
}

.card-holder .select2-container--classic .select2-selection--single {
  height: 38px;
}

.card-holder .select2-container--classic .select2-selection--single .select2-selection__rendered {
  color: #444;
  line-height: 36px;
}

div.basic dl dd .chkList {
  display: block;
}
div.basic dl dd .chkList input[type=checkbox] + label {
  display: block;
  float: left;
  width: 33.33%;
  box-sizing: border-box;
  min-height: 35px;
}
div.basic dl dd .chkList::after {
  content: "";
  display: block;
  float: none;
  clear: both;
}

#rules .col select {
  text-align: left;
}

dd img.img-preview {
  max-width: 100%;
}

div.basic dl dd span.lh-small {
  line-height: 22px;
  display: block;
}

div.basic dl dd .radio-list-item input[type=radio] + label {
  float: left;
}

.radio-list-item {
  padding-bottom: 5px;
}
.radio-list-item:after {
  content: "";
  display: block;
  float: none;
  clear: both;
}
.radio-list-item label {
  float: left;
}
.radio-list-item select, .radio-list-item input[type=text] {
  max-width: calc(100% - 35px);
  float: left;
  margin-bottom: 7px;
}
.radio-list-item.radio-btn {
  padding: 2.5px 10px;
  margin-top: 24px;
  background: #f7f7f7;
  border: 1px solid #ccc;
  border-radius: 3px;
}

.pub-status {
  position: relative;
  margin-left: 46px;
  padding-left: 34px;
}
.pub-status img {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}
.pub-status .status-line {
  padding-bottom: 12px;
}
.pub-status .status-line label {
  display: block;
  font-size: 12px;
  color: #999;
}
.pub-status .status-line span {
  display: block;
  font-size: 14px;
  color: #333;
}
.pub-status .pub-cta {
  display: inline-block;
  padding: 2.5px 10px;
  background: #f7f7f7;
  color: #333;
  border: 1px solid #ccc;
  border-radius: 3px;
  width: 100%;
  max-width: 210px;
  text-align: center;
  font-size: 16px;
  line-height: 38px;
  font-weight: 500;
  box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.5);
  margin-top: 12px;
  text-decoration: none;
}
.pub-status .pub-cta.as24 {
  background: #f1f508;
  color: #333;
  border: 1px solid #f1f508;
}
.pub-status .pub-cta:hover {
  text-decoration: none;
}
.pub-status .unpub-cta {
  display: inline-block;
  padding: 2.5px 10px;
  background: #ff0000;
  color: #fff;
  border: 1px solid #ff0000;
  border-radius: 3px;
  width: 100%;
  max-width: 210px;
  text-align: center;
  font-size: 16px;
  line-height: 38px;
  font-weight: 500;
  box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.5);
  margin-top: 12px;
  text-decoration: none;
}
.pub-status .unpub-cta:hover {
  text-decoration: none;
}

div.basic span.error {
  border: none;
  color: #dd0000;
}
div.basic span.error span {
  color: #dd0000;
}

.footer-spacer {
  padding: 20px 0 0 125px;
}

td i.warning {
  position: absolute;
  top: 19px;
  right: 5px;
  color: #ff5b20;
  font-size: 14px;
}

td i.warning-bg {
  position: absolute;
  top: 16px;
  right: 3px;
  color: #fff;
  /* background: #fff; */
  font-size: 18px;
}

.pub-status-error {
  display: none;
  border: 1px solid #ff5b20;
  margin: 25px 0 0 -34px;
  padding: 14px;
  border-radius: 3px;
}

.pup-status-error-title {
  color: #ff5b20;
  font-size: 16px;
  line-height: 20px;
  font-weight: 500;
  padding-bottom: 10px;
}

.box .content table td .icon-combi {
  line-height: 19px;
  white-space: nowrap;
  transform: translateY(2px);
}
.box .content table td .icon-combi img, .box .content table td .icon-combi span {
  display: inline-block;
}
.box .content table td .icon-combi span {
  padding-left: 8px;
  line-height: 19px;
  transform: translateY(-5px);
  font-size: 11px;
  color: #666;
}

.box .content table .links-header td.tr {
  padding-right: 0;
}

.links td.tr a {
  padding-right: 0;
}

.box .content table .nowrap td {
  white-space: nowrap;
}

.toggle-btns {
  text-align: center;
}

.toggle-btns a.btnNoBg27 {
  margin: 0 3px;
  float: left;
  display: inline-block;
  min-width: 100px;
}

.toggle-btns::after {
  content: "";
  display: block;
  float: none;
  clear: both;
}
