body {
  margin: 0;
  font-family: 'Open Sans', sans-serif;
  font-size: 11px !important;
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
  text-rendering: optimizeLegibility;
  line-height: 20px !important;
  background: #e9ebee;
  height: 100%;
  color: #000;
  overflow-x: hidden;
  overflow-y: auto !important;
}

a {
  color: #000;
}

html {
  margin-right: calc(-1 * (100vw - 100%));
}

.navbar-default {
  background: #232323;
  border: 0px;
}

a:hover {
  text-decoration: none !important;
}

@media (min-width: 1200px) {
  .container {
    width: 98%;
  }
}

.no-margin {
  margin: 0 !important;
}

.no-padding {
  padding: 0 !important;
}

/* .btn:focus {
  outline: none;
} */

@media (max-width: 767px) {
  .btn {
    margin: 2px;
  }
}


/*  Login  */

.sign-in-container {
  margin: 0 auto;
  padding: 30px;
  width: 86%;
}

.input-group .input-group-addon i {
  display: block;
  cursor: pointer;
  width: 18px;
  height: 20px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

.padright19 {
  padding-right: 20px !important;
}
.padright32 {
  padding-right: 32px !important;
}
.padright9 {
  padding-right: 9px !important;
}

.noSelect {
  user-select: none;
  -o-user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.tab-content {
  background: transparent !important;
  -webkit-border-radius: 0 0 2px 2px;
  -moz-border-radius: 0 0 2px 2px;
  border-radius: 2px !important;

}

.notice {
  position: relative;
  margin: 10px;
  background: #f2f2f2;
  padding: 12px 12px 12px 25px;
  border-left: 4px solid #e6e6e6;
}

.notice:before {
  position: absolute;
  top: 50%;
  margin-top: -15px;
  left: -17px;
  background-color: #f2f2f2;
  color: white;
  width: 30px;
  height: 30px;
  -webkit-border-radius: 20%;
  -moz-border-radius: 20%;
  border-radius: 20%;
  text-align: center;
  line-height: 30px;
}

.notice p {
  margin: 0;
}

.notice.blue {
  border-color: #3693cf;
}

.notice.blue:before {
  font-family: "FontAwesome";
  content: "\f14a";
  background-color: #3693cf;
}

.notice.green {
  border-color: #74b749;
}

.notice.green:before {
  content: "\f121";
  font-family: "FontAwesome";
  background-color: #74b749;
}

.notice.yellow {
  border-color: #ffb400;
}

.notice.yellow:before {
  font-family: "FontAwesome";
  content: "\f101";
  background-color: #ffb400;
}

.notice.red {
  border-color: #f63131;
}

.notice.red:before {
  font-family: "FontAwesome";
  content: "\f129";
  background-color: #f63131;
}


/*  DASHBOARD CSS Starts here  */

.dashboard-container {
  margin-top: 50px;
}

.dashboard-wrapper {
  padding: 15px;
}

.right-sidebar {
  margin: 16px 0px 0 23px;
}

.right-sidebar2 {
  margin: 16px 0px 0 0;
  -webkit-transition: all 0.1s linear;
  -moz-transition: all 0.1s linear;
  transition: all 0.1s linear;
}

.widget {
  border-radius: 2px !important;
}

.padtop5 {
  padding-top: 5px;
}


/*  left Sidebar Container Starts Here  */
.hidesidebar1 {
  left: -44px !important;
}
select option {
  font-family: inherit !important;
  font-size: inherit !important;
}
.left-sidebar {
    position: fixed;
    left: 0;
    width: 41px;
    background: #232323;
    top: 50px;
    bottom: 0;
    z-index: 1031;
    overflow: visible !important;
    visibility: visible !important;
    right: 0;
}

.left_media_ipad {
  display: none !important;
}
@media (max-width: 767px) {

  .navbar-default .navbar-collapse,
  .navbar-default .navbar-form {
    border-color: #e7e7e7;
    background: white;
  }

  .navbar li a {
    color: black !important;
  }

  .navbar li a:hover {
    background: #eee !important;
    color: black !important;
  }

  #calendar {
    position: absolute;
    left: 0;
    top: 50px;
    z-index: 3;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
  }

  /* .right-sidebar {
    padding-top: 70px !important;
  } */

  .anime-logo {
    display: none !important;
  }

  #left-sidebar li {
    display: inline-block;
  }
}


/*  left Sidebar Container Ends Here  */

.navbar-default .navbar-toggle .icon-bar {
  background-color: white;
}

.navbar-default .navbar-toggle:hover {
  background-color: transparent;
}

.navbar-default .navbar-toggle:hover .icon-bar {
  background-color: grey;
}

.navbar-default .navbar-toggle:focus {
  background: transparent;
}

.navbar-default .navbar-toggle {
  border: 0;
}


/*  Status  */

.stats>li,.stats>a {
  margin-bottom: 5px;
  padding: 6px 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  position: relative;
  align-items: center;
  -webkit-box-pack: center;
  box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.stats>li:hover .left-tooltip ,.stats>a:hover .left-tooltip{
  display: block;
}

.stats>li>.left-tooltip,.stats>a>.left-tooltip {
  position: absolute;
  background: black;
  padding: 2px 7px;
  display: none;
  color: white;
  font-size: 10px;
  left: 47px;
  border-radius: 3px;
}

.stats>li>.left-tooltip::before,.stats>a>.left-tooltip::before {
  content: "";
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-right: 4px solid black;
  position: absolute;
  left: -4px;
  top: 8px;
}

.stats-header {
  padding: 10px 20px;
  background: black;
  font-size: 11px;
  font-weight: bold;
  border-top-right-radius: 4px;
}

.treeview-menu {
  position: absolute;
  top: 0;
  left: 41px;
  width: 140px;
  padding: 0 !important;
}

.treeview-menu li {
  padding: 5px 20px;
  background: #3e3e3e !important;
  font-size: 11px;
  margin: 0;
}

.treeview-menu li:last-child {
  border-bottom-right-radius: 4px;
}

.treeview-menu li a {
  font-size: 11px;
  color: #bdbdbd;
}

.treeview-menu li:hover a {
  color: white;
}

.stats {
  margin-top: 31px;
}

.stats>li>span,.stats>a>span {
  padding: 10px;
  font-size: 18px;
  color: white;
  cursor: pointer;
}

/* .c-tabs-nav__link:active,.c-tab__content a:active  {
    background-color: #d6d6d6 !important;
} */
.stats>li:hover .mbri-edit2,
.stats>li:hover .mbri-home,
.stats>li:hover .mbri-align-left,
.stats>li:hover .mbri-letter,
.stats>li:hover .mbri-folder,
.stats>li:hover .mbri-setting3,
.stats>a:hover .mbri-setting3  {
    padding: 10px 9px 10px 9px;
    background: #444444;
    border-radius: 20px;
    color: white;
}

.stats>li.selected,.stats>a.selected {
  background: black;
}

.stats>li.selected span.mbri-edit2,
.stats>li.selected span.mbri-home,
.stats>li.selected span.mbri-align-left,
.stats>li.selected span.mbri-letter,
.stats>li.selected span.mbri-folder,
.stats>li.selected span.mbri-setting3,
.stats>a.selected span.mbri-setting3 {
  color: white;
  padding: 10px 9px 10px 9px;
  background: black;
  border-radius: 20px;
  transition: all 0.2s linear;
}

.invoice {
  border: 1px solid #cccccc;
  padding: 15px;
}

.invoice .invoice-head {
  border-bottom: 1px solid #cccccc;
  height: 48px;
}

.invoice .invoice-head .logo {
  margin: 0;
}

.invoice .invoice-head .invoice-info {
  float: right;
  margin-top: 8px;
  text-align: right;
}

.invoice .invoice-head .invoice-info span {
  color: #ed6d49;
  font-weight: 600;
  font-size: 12px;
  float: right;
  text-align: right;
}

.invoice .invoice-head .invoice-info .date {
  color: #3693cf;
  font-size: 11px;
  font-weight: 600;
}

.invoice .invoice-data-container {
  padding: 20px 0;
}

.invoice .invoice-data-container .from {
  width: 40%;
}

.invoice .invoice-data-container .from h5 {
  color: #4d4d4d;
  margin: 0 0 10px 0;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7);
}

.invoice .invoice-data-container .from span {
  color: #ef8060;
  display: block;
  font-size: 12px;
  margin-bottom: 3px;
}

.icon-rounded {
  width: 32px;
  height: 32px;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  padding: 2px;
  text-align: center;
  vertical-align: middle;
  line-height: 28px !important;
  color: white;
}

.panel {
  padding-bottom: 26px;
  box-shadow: none;
}

.panel-body {
  padding: 15px;
  position: relative;
}

.panel-heading {
  position: relative;
  padding: 12px 15px;
  border-bottom: 0;
  border-radius: 4px;
}

h4.panel-title {
  font-size: 15px;
}

h4.panel-title .icon {
  margin-right: 4px;
  font-size: 20px;
}

.panel-default {
  padding-bottom: 26px;
  border-radius: 2px;
  border: 0;
  box-shadow: 0 6px 8px rgba(102, 119, 136, .03), 0 1px 2px rgba(102, 119, 136, .3);
}

.stats li .left p {
  color: #FFFFFF !important;
}

/* .stats i {
  position: relative !important;
} */
.login_bg {
  background: #2E363D !important;
}

.margin-right {
  margin-right: 10px;
}

thead {
  border-bottom: 0;
}

th,
.table>tbody>tr>td {
  padding: 9px 9px;
  padding-top: 5px;
  padding-bottom: 5px;
}

.nav-tabs>li>a {
  outline: 0 none;
}

.margin-top10 {
  margin-top: 10px !important;
}

.widget .widget-header {
  display: inline-block;
  margin-right: 7px;
  margin-bottom: 14px;
  font-weight: bold;
}

.widget-header:hover {
  color: #2196F3;
  cursor: pointer;
}

.widget .widget-body {
  border-radius: 2px;
}


.tab-content .widget-header {
  background: #FFFFFF !important;
}

.form-horizontal .control-label {
  text-align: left !important;
  white-space: nowrap;
  padding-top: 5px;
}

.form-control:focus {
  box-shadow: none;

  border-color: #232323;
}

.label-cancelled {
  background-color: #e9573f !important;
}

.label-pending {
  background-color: #f6bb42 !important;
}
.label-completed {
  background-color: #8cc152 !important;
}


/*.nav-tabs>li {
  font-weight: 600 !important;
}*/

input[type="file"] {
  margin-top: 5px !important;
}

.no-padding-btn {
  padding: 0 12px !important;
  line-height: 0.429 !important;
}

.btn-link {
  color: #000000;
  font-weight: 600;
}

.search_f {
  height: 26px !important;
  padding: 4px 8px !important;
  font-size: 12px !important;
  margin-top: -5px;
}

.email-refresh {
  font-size: 15px;
  color: #88D2DD;
}

.list-group li {
  border-radius: 0 !important;
}

.bg_white {
  background: #FFFFFF !important;
  color: black;
}

.bg-grey {
  background: #EDF1F2 !important;
}

.salesimg {
  background-image: url("salesbg.png");
}

.bg-grey i {
  color: #C2C1C1 !important;
}

.contact-folder {
  float: left;
  font-size: 15px;
  margin-left: 10px;
}

.featuresandbugs li {
  list-style-type: disc;
}

.featuresandbugs ul {
  padding: 0 23px !important;
  list-style: disc;
}

a {
  outline: 0 !important;
  text-decoration: none !important;
}

.remove-left-pad {
  padding-left: 0 !important;
}

.remove-right-pad {
  padding-right: 0 !important;
}

.tasks strong {
  font-weight: normal !important;
}

.tasks a {
  color: black;
}

.tasks {
  margin-top: 13px;
}

input[type="checkbox"],
input[type="radio"] {
  vertical-align: -1px;
  margin-right: 4px;
}

.color-black {
  color: #595959 !important;
}

.gap {
  margin-top: 4px;
}

.active-item {
  background: #88D2DD !important;
}

.rem-botom-padding {
  padding-bottom: 0 !important;
}

.panel-default>.panel-body .panel-heading {
  background: #edf1f2 none repeat scroll 0 0;
  border-color: #edf1f2;
  color: #555555;
}

.hr2 {
  border: 1px solid #eee;
  margin-bottom: 5px;
  margin-top: 1px;
}

.active-color {
  border: 1px solid #000000;
}

.scroll-bar {
  padding: 10px 0 5px 0;
  width: 100%;
  float: left;
}

.scroll-bar a {
  display: block;
  margin-bottom: 5px;
  cursor: pointer;
  color: #6f6f6f;
}

.scroll-bar img {
  width: 27px;
  height: 26px;
  border-radius: 50%;
}

.fix_padding {
  padding: 0.2em 0em 0.2em 0.6em !important;
}

.fix_padding2 {
  padding: 0.2em 0.6em 0.2em 0.7em !important;
}

a:focus,
a:hover {
  text-decoration: none !important;
}

.up {
  z-index: 1000;
}

.dropp {
  border-radius: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin-bottom: 0 !important;
}

.dropp a:hover {
  background: #88d2dd;
  color: #FFFFFF;
}

#eventInviteAttendees i {
  font-size: 16px !important;
  margin-left: 5px !important;
}

#eventInviteAttendees {
  white-space: nowrap !important;
}

#eventColor i {
  font-size: 16px !important;
}

.remove_bg {
  background: none !important;
}

.active_breadcrumb {
  color: #5ab1b9 !important;
  text-decoration: underline;
}

.bg_blue {
  background: #3693cf !important;
  color: #FFFFFF !important;
  border-color: #3693cf !important;
}


.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
  color: #666666 !important;
  border: 1px solid #88d2dd !important;
}

.event-color-green {
  background-color: #4CAF50;
}

.event-color-brown {
  background-color: #00BCD4;
}

.event-color-yellow {
  background-color: #FFC107;
}

.event-color-red {
  background-color: #F44336;
}

.base_price {
  margin-bottom: 0 !important;
  margin-top: 7px !important;
}

.eventdiv {
  height: 20px;
  overflow: hidden;
  margin-bottom: 1px;
  border-radius: 2px;
  color: white;
}

.event-time {
  width: auto !important;
}

.event-title {
  width: 100% !important;
}

.allevents {
  position: absolute;
  background: #fff none repeat scroll 0 0;
  border-radius: 7px;
  box-shadow: 0 0 6px -1px;
  padding-bottom: 7px;
}

.fc-view {
  overflow: unset !important;
}

.inbox_icon {
  height: 28px;
  margin-right: 9px;
  margin-top: 8px;
}

.inbox_grey {
  color: #E7EBEE !important;
}

.email_icons {
  font-size: 16px;
  margin-top: 8px;
}

.email_item {
  padding-bottom: 5px;
  padding-top: 5px;
  position: relative;
  padding: 5px;
  margin-bottom: 3px;
  padding-left: 15px;
  -webkit-transition: all 0.1s linear;
  -moz-transition: all 0.1s linear;
  -ms-transition: all 0.1s linear;
  -o-transition: all 0.1s linear;
  transition: all 0.1s linear;
  border-bottom: 1px solid #eaeaea;
}

.border-bot td {
  border-bottom: 1px solid whitesmoke;
}

.sender-name:hover {
  color: #2ca1e0;
}

.mail-info {
  overflow: hidden;
  padding-left: 7px;
  padding-right: 7px;
  width: 92%;
}

.message-scroll {
  height: 500px;
  overflow-x: hidden;
  overflow-y: hidden;
}

.message-scroll:hover {
  overflow-y: scroll;
}

.editor .btn-link i {
  color: #88d2dd !important;
}

.side_icons i {
  color: #3B595C !important;
  font-size: 14px;
}

.side_icons {
  margin-right: 8px;
}

.email_nav_left {
  padding-left: 8px !important;
  text-align: left !important;
}

.quotes_font label {
  font-size: 11px !important;
}

.quotes_font .form-group {
  margin-bottom: 5px !important;
}

.quotes_font input {
  height: 28px !important;
  font-size: 11px !important;
}

.quotes_font select {
  height: 28px !important;
  font-size: 11px !important;
}

.quotes_font .btn {
  padding: 3px 12px;
}

/* .expenses_font label {
  font-size: 11px !important;
}

.expenses_font .form-group {
  margin-bottom: 5px !important;
}

.expenses_font input {
  height: 28px !important;
} */

.expenses_font .form-control {
  height: 28px !important;
  font-size: 10px !important;
}

.custom_textarea {
  height: 34px !important;
  border: 1px solid #dddddd !important;
  box-shadow: 1px 1px 2px #f5f5f5 !important;
}

.email_nav_pad {
  padding: 8px 15px !important;
}

.small_fields .form-group {
  margin-bottom: 5px !important;
}

.small_fields input {
  font-size: 11px !important;
}

.img-border {
  border: 1px solid #ccc;
}

.profile_img {
  height: 129px;
  width: 127px;
  margin-top: 26px;
}

.no-height {
  height: 100% !important;
}

.tag {
  background: #ecebeb none repeat scroll 0 0;
  border-radius: 10px;
  padding-left: 5px;
  padding-right: 5px;
}

.main_title {
  border-bottom: 1px solid #D7D6D6 !important;
  font-weight: 500px !important;
  text-transform: capitalize !important;
}

.sidbar_active {
  background: #88d2dd none repeat scroll 0 0 !important;
  font-weight: bold !important;
}

.border-top-grey {
  border-top: 1px solid #D7D6D6 !important;
}

.border-bottom-grey {
  border-bottom: 1px solid #D7D6D6 !important;
}
.border-top-grey2 td {
    border-bottom: 1px solid #D7D6D6 !important;
}
/* .bg-gray td {
  background: #efefef;
} */


.no-bg {
  background: none !important;
}

.drop_btn .dropdown-toggle {
  box-shadow: none !important;
  padding: 0 !important;
  font-size: 11px !important;
}

.message-icons {
  position: absolute;
  top: 3px;
  right: 19px;
  height: 68px;
  width: 19px;
  padding-right: 11px;
  font-size: 11px;
}

.message-icons i {
  border: 1px solid transparent;
  padding: 3px;
  text-align: center;
  padding-right: 5px;
  padding-left: 5px;
  opacity: 0.3;
}

.message-icons i:hover {
  opacity: 1;
  cursor: pointer;
}

.sender-name {
  color: black;
  cursor: pointer;
}


/*********Vertical-tabs Starts****************/

.e-as {
  position: absolute;
  background: rgb(255, 255, 255);
  padding: 6px;
  z-index: 9;
  width: 100%;
  top: 49px;
  box-shadow: 0 2px 1px 0 #e2e2e2;
  padding-bottom: 24px;
  padding-left: 10px;
}

.compose-mail {
  padding: 3px;
  color: #ffffff;
  text-align: center;
  position: absolute;
  top: 11px;
  right: 17px;
  border-radius: 50%;
  font-size: 13px;
  width: 28px;
  background: #2ca1e0;
  box-shadow: 0 1px 1px 1px #efefef;
}

.compose-mail:hover {
  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
  cursor: pointer;
}

.compose-mail:hover {
  background: #2ca1e0;
  color: white;
  cursor: pointer;
}

#vertical-tab .tabs-left {
  margin-top: 3rem;
}

#vertical-tab .nav-tabs {
  float: left;
  border-bottom: 0;
}

#vertical-tab .nav-tabs li {
  float: none;
  margin: 0;
}

#vertical-tab .nav-tabs li a {
  margin-right: 0;
  border: 0;
  border-radius: 23px !important;
  /* padding: 6px 7px 8px 16px !important; */
  box-shadow: none !important;
  padding-left: 0 !important;
  text-align: center;
}

.con-box li {
  display: block;
}

.con-box {
  overflow-y: scroll;
  height: 200px;
  border-radius: 0;
  overflow-x: hidden;
}

#vertical-tab .nav-tabs li a i {
  color: #444444 !important;
  margin: 0 !important;
}

#vertical-tab .nav-tabs li {
  border-bottom: 1px solid #FFFFFF;
}

#vertical-tab .nav-tabs li a:hover {
  color: #3693cf !important;
}

#vertical-tab .tab-content {
  margin-left: 33px;
}

#vertical-tab .tab-content .tab-pane {
  display: none;
  background-color: #fff;
  overflow-y: auto;
  position: relative;
}

#vertical-tab .tab-content .active {
  display: block;
}

#vertical-tab .list-group {
  width: 100%;
}

#vertical-tab .list-group .list-group-item {
  height: 50px;
}

#vertical-tab .list-group .list-group-item h4,
.list-group .list-group-item span {
  line-height: 11px;
}

#vertical-tab .nav-tabs .active a {
  color: #3693cf !important;
}

#vertical-tab .tab-content {
  border: none !important;
}


/*********Vertical-tabs Ends****************/

.rem-pad-left {
  padding-left: 0 !important;
}


.tree-item:hover {
  border-bottom: 1px solid black;
  -webkit-transition: all 0.1s linear;
  -moz-transition: all 0.1s linear;
  -ms-transition: all 0.1s linear;
  -o-transition: all 0.1s linear;
  transition: all 0.1s linear;
}

.tree-item i {
  cursor: pointer !important;
  margin-left: -4px !important;
}

.tree-item a {
  padding: 0 4px !important;
}

.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
  width: 45%;
  padding: 3px;
  height: 25px;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
  position: absolute;
  top: 7px !important;
  width: 1.8em;
  height: 1.8em;
}

.ui-datepicker .ui-datepicker-title select {
    background-image: none !important;
    padding: 2px 3px !important;
    width: auto;
    background: transparent;
    font-weight: normal;
    border-color: transparent;
    border-radius: 3px;
}

.ui-datepicker .ui-datepicker-prev {
    left: 1px;
}
.ui-datepicker .ui-datepicker-next {
    right: 1px;
}
.input-symbol span {
  position: absolute;
  transform: translate(0, -50%);
  top: 15px !important;
  right: 8px !important;
  color: #7d7d7d;
  font-size: 10px;
}
.input-symbol span.input-symbol2 {
  position: absolute;
  transform: translate(0, -50%);
  top: 15px !important;
  right: 5px !important;
  color: #7d7d7d;
  font-size: 10px;
}
.fileUpload {
  overflow: hidden;
  position: relative;
  width: auto;
  left: 0 !important;
  font-size: 12px !important;
}
.fileUpload:hover .mbri-upload {
    color: white !important;
    background-color: #008eff;
}

.ngdialog.ngdialog-theme-default .ngdialog-close::before,
.ngdialog-close::before {
  background: #fff none repeat scroll 0 0 !important;
  border-radius: 0;
  box-shadow: none !Important;
  color: #000000 !important;
  font-size: 20px !important;
  height: 24px !important;
  right: 2px !important;
  top: 2px !important;
  width: 24px !important;
}

#cssmenu>ul>li>a {
  white-space: nowrap;
}

.rem_margintop {
  margin-top: 0 !important;
}

.help a {
  color: #5FBCC6 !important;
  font-size: 12px;
}

#helplist i {
  color: #555555 !important;
  font-size: 15px;
}

.help .glyphicon {
  color: #555555 !important;
  cursor: pointer;
  font-size: 9px !important;
  margin-right: 7px;
}

.help h3 {
  color: #444444 !important;
}

.help .gap-level1 {
  margin-left: 20px;
}

.help .lead {
  font-size: 12px !important;
}

.nav-list {
  padding-right: 15px;
  padding-left: 15px;
  margin-bottom: 0;
}

.nav-list-main {
  padding-left: 0;
  padding-right: 0;
  margin-bottom: 0;
}

span.nav-toggle-icon {
  font-size: 7px !important;
  top: -2px !important;
  color: #888 !important;
}

.help .nav>li>a {
  padding: 0 15px !important;
}

.circle-icon {
  color: white;
  line-height: 34px;
  background: white;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  content: "";
  position: absolute;
  right: 32px;
  text-align: center;
  top: 23px;
  border: 1px solid #3693cf;
  background: #3693cf;
}

.circle-icon i {
  font-size: 16px;
}

.circle-icon:hover {
  background: #337ab7;
  border-color: #337ab7;
}

.circle-icon:hover i {
  color: white !important;
}

#helplist .main_title {
  border-bottom: 0 !important;
}

#helplist i {
  margin-right: 5px;
}

#helplist .help-item {
  padding: 3px;
}

.help .level1 {
  padding-left: 12px !important;
}

.help .level2 {
  padding-left: 36px !important;
}

#helpChilList .main_title {
  border-bottom: 0 !important;
}

.close {
    color: #b5b5b5 !important;
    font-size: 26px !important;
    height: 24px !important;
    opacity: 100 !important;
    position: absolute;
    right: -1px !important;
    top: -3px !important;
    width: 24px !important;
    text-shadow: none;
}

.close:hover {
  color: gray !important;
}

.close:active,
.close:focus {
  outline: none !important;
}


.ngdialog.ngdialog-theme-default {
  padding-top: 25px !important;
}

.unread {
  font-weight: bold !important;
}

.read {
  font-weight: normal !important;
}

input[type='number'] {
  -moz-appearance: textfield;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

.margin-left-nav2 {
  margin-left: 28px !important;
}

.margin-left-nav {
  margin-left: 17px !important;
}

.margin-left-nav svg {
  height: 19px;
  width: 18px;
}

.nav_logo {
  position: absolute;
  bottom: 44px;
  text-align: center;
  width: 100%;
}

/* .sidenav_title {
  float: right;
  width: auto;
  vertical-align: middle;
  color: rgb(0, 0, 0);
  margin-top: 2px;
  font-weight: 600;
  font-size: 12px;
  font-family: "Source Sans Pro", sans-serif;
  position: relative;
  left: -26px;
}

.sidenav_hover li:hover {
  box-shadow: inset -1px -25px 48px -33px #8F8F8F;
  -webkit-box-shadow: inset -1px -25px 48px -33px #8F8F8F;
  -moz-box-shadow: inset -1px -25px 48px -33px #8F8F8F;
  -o-box-shadow: inset -1px -25px 48px -33px #8F8F8F;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
} */

.li_title {
  height: 56px !important;
}

.remove_widths li {
  width: auto !important;
}

.side_nav_ul li h4 {
  font-size: 14px;
  margin-bottom: 10px !important;
  margin-top: 10px !important;
}


/*CALENDAR CSS STARTS*/

.ng-valid-date table .btn-default {
  border-color: #FFFFFF !important;
}

.ng-valid-date table tr td .active {
  background-color: #e6e6e6 !important;
}

.ng-valid-date .btn-success {
  color: #000000 !important;
  background-color: #F0F0F0 !important;
  border-color: #F0F0F0 !important;
}

.ng-valid-date .btn-danger {
  color: #000000 !important;
  background-color: #F0F0F0 !important;
  border-color: #F0F0F0 !important;
}

.ng-valid-date table {
  width: 100% !important;
}

.fa_display {
  display: none !important;
}

.small_fields2 .form-group {
  margin-bottom: 9px !important;
}

.small_fields2 input {
  height: 31px !important;
  font-size: 11px !important;
}

.small_fields2 select {
  height: 31px !important;
  font-size: 11px !important;
}

.small_fields2 .btn {
  padding: 3px 12px;
}

.rem-pad-right {
  padding-right: 0 !important;
}

.custom_width {
  width: 14.190% !important;
}

.small_fields2 input[type="checkbox"] {
  height: auto !important;
}

.label-info {
  background-color: #03A9F4;
}

.border_cover {
  border: 1px solid #eee;
  padding-bottom: 5px;
}

.sub-table td table thead th {
  background: #DBE0E2 !important;
}

.sub-table td table thead {
  border: 1px solid #C6CCCE !important;
}

.sub-table td .table-bordered {
  border: 1px solid #C6CCCE !important;
}

.sub-table td table tbody tr td {
  border-right: 1px solid #C6CCCE !important;
  border-left: 1px solid #C6CCCE !important;
}

.sub-table td table thead tr th {
  border-right: 1px solid #C6CCCE !important;
  border-left: 1px solid #C6CCCE !important;
}

.bg-white {
  background: #FFFFFF !important;
}

.right-sidebar_chat {
  display: none;
  padding: 10px;
  position: fixed;
  right: 0;
  width: 5px;
  height: 100%;
  background: lightgrey;
  z-index: 3;
  transition: all ease-in 0.2s;
}

.right-sidebar_chat ul li {
  background: #c3c3c3;
  padding: 2px;
  margin-bottom: 2px;
}

.right-sidebar_chat:hover {
  width: 150px;
  transition: all ease-in 0.2s;
}

.right-sidebar_chat a:hover {
  color: lightblue;
  transition: all ease-in 0.2s;
}

.right-sidebar_chat ul li a {
  color: white;
}

#chatbox_babydoe {
  background: white !important;
  margin-right: 149px;
}

.chatboxcontent {
  width: 225px !important;
}

.new_ca {
  font-size: 16px !important;
  padding-right: 50px;
}

.sidenav_title {
  display: none;
}

.bgt {
  background-color: transparent !important;
}

.btn-grey {
  background: transparent !important;
  border: 1px solid grey !important;
  color: grey !important;
}

a.addnewitem {
  line-height: 2.00625;
  font-weight: 600;
  letter-spacing: normal;
  background-color: #2189db;
  background: -webkit-linear-gradient(#42a1ec, #0070c9);
  background: linear-gradient(#42a1ec, #0070c9);
  border: 1px solid #07c;
  border-radius: 4px;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  padding: 0 15px;
  text-align: center;
  white-space: nowrap;
}

.bdinput {
  border: 1px solid #2b90e0;
}

a.addnewitem:hover {
  background-color: #3392de;
  background: -webkit-linear-gradient(#51a9ee, #147bcd);
  background: linear-gradient(#51a9ee, #147bcd);
  border-color: #1482d0;
  text-decoration: none;
  color: white;
}

.bluebutton {
  background-color: #3392de;
  background: -webkit-linear-gradient(#51a9ee, #147bcd);
  background: linear-gradient(#51a9ee, #147bcd);
  border-color: #1482d0;
  text-decoration: none;
  color: white;
}

.anime-logo {
  position: absolute;
  bottom: 55px;
  background: #ffffff;
  overflow: auto;
  width: 48px;
  display: none;
  left: 9px;
}

.anime-logo img {
  width: 58%;
  margin: 1px 7px;
}

.img {
  -webkit-animation: anim 8s infinite linear;
  animation: anim 8s infinite linear;
}

@-webkit-keyframes anim {
  from {
    -webkit-transform: rotateY(0deg);
  }

  to {
    -webkit-transform: rotateY(360deg);
  }
}

@keyframes anim {
  from {
    transform: rotateY(0deg);
  }

  to {
    transform: rotateY(360deg);
  }
}

.card.red {
  background: #cfe7fa;
  background: -moz-linear-gradient(top, #cfe7fa 0%, #6393c1 100%);
  background: -webkit-linear-gradient(top, #cfe7fa 0%, #6393c1 100%);
  background: linear-gradient(to bottom, #cfe7fa 0%, #6393c1 100%);
  filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#cfe7fa', endColorstr='#6393c1', GradientType=0);
  color: #FFF;
}

.card.summary-inline .card-body {
  padding: 20px;
  margin-bottom: 3px;
}

.card {
  -webkit-transition: all 0.1s linear;
  -moz-transition: all 0.1s linear;
  -ms-transition: all 0.1s linear;
  -o-transition: all 0.1s linear;
  transition: all 0.1s linear;
}

.card:hover {
  -webkit-box-shadow: inset 0 0 0 3px #545454;
  -moz-box-shadow: inset 0 0 0 3px #545454;
  box-shadow: inset 0 0 0 3px #545454;
  -webkit-transition: all 0.1s linear;
  -moz-transition: all 0.1s linear;
  -ms-transition: all 0.1s linear;
  -o-transition: all 0.1s linear;
  transition: all 0.1s linear;
}



.card.summary-inline .card-body .content {
  float: right;
}

.card.summary-inline .card-body .content .title {
  margin-top: 8px;
  font-size: 3.5em;
  text-align: right;
}

.card.summary-inline .card-body .content .sub-title {
  font-size: 0.9em;
  text-align: right;
  margin-top: 5px;
  margin-bottom: 0;
  padding: 0;
  border-bottom: 0;
}

.card.summary-inline .card-body .content {
  float: right;
}

.row {
  margin-bottom: 15px !important;
}


@media (min-width: 768px) {

  .navbar>.container .navbar-brand,
  .navbar>.container-fluid .navbar-brand {
    margin-left: 0px;
    width: 200px;
  }
}

.navbar-brand img {
  width: 81%;
  position: relative;
  top: -15px;
  left: 7px;
}

.despwidth {
  width: 273px !important;
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn
}

@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}


.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight
}

@-webkit-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

@keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig
}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0)
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp
}

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1
  }

  to {
    opacity: 0
  }
}

@keyframes fadeOut {
  0% {
    opacity: 1
  }

  to {
    opacity: 0
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut
}

@-webkit-keyframes slideInRight {
  0% {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible
  }

  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }
}

@keyframes slideInRight {
  0% {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible
  }

  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight
}


.table-bordered>thead>tr>th:hover .showtitle {
  display: block !important;
  position: absolute;
  top: -10px;
  padding: 10px;
  color: white;
  display: block !important;
  position: absolute;
  top: -43px;
  background: #575757;
  padding: 10px;
  color: #ffffff;
  /* left: 0; */
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

.showtitle:after {
  content: "";
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 8px solid #575757;
  position: absolute;
  left: 16%;
  top: 35px;
}

.nav-tabs>li.active>a,
.nav-tabs>li.active>a:focus {
  color: #2196F3;
  cursor: default;
  font-weight: 600;
  box-shadow: inset 0 -2px 0 0;
  border-color: white;
}

.nav-tabs>li>a:hover {
  background: white;
  color: #2196F3;
  cursor: pointer;
  border-color: white;
}

.nav-tabs>li>a {
  color: #4c4c4c;
  padding-left: 8px;
  padding-right: 8px;
  letter-spacing: 0.3px;
  font-weight: bold;
}

.btn-icon {
    display: block;
    position: relative;
    float: left !important;
    width: 100%;
    padding: 3px 3px;
    border-color: #d0d6d9;
    font-weight: bold;
    background-color: white;
    box-shadow: inset 0 -2px 0 rgba(0,0,0,.05);
    -moz-box-shadow: inset 0 -2px 0 rgba(0,0,0,.05);
    -webkit-box-shadow: inset 0 -2px 0 rgba(0,0,0,.05);
}

.btn-icon:hover {
  color: #2196F3
}

.input-symbol i.fa-envelope-o {
  visibility: hidden;
}

.btn_blue {
  font-size: 1.1em;
}

/*Buttons Css */

.btn {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  transition: none !important;
}

.btn-primary {
  color: #fff !important;
  background-color: #ffffff !important;
  border-color: #ffffff !important;
  transition: all 0.2s;
}

.btn.active,
.btn:active {
  background-image: none;
  outline: 0;
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125) !important;
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125) !important;
}
.btn-silverow {
  background: #232323;
  color: white;
}
.btn-export li a {
  background-color: #232323 !important;
}

.btn-cancel,
.btn-cancel2,
.btn-default,
.btn-default2,
.btn-edit,
.btn-delete,
.btn-submit,
.btn-submit2 {
    font-size: 11px !important;
    border-color: #c5c5c5;
    border-width: 1px;
    border-style: solid;
    font-weight: bold;
    color: #444444;
    background-color: white;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.1);
}

.btn-cancel:hover,
.btn-cancel2:hover,
.btn-default:hover,
.btn-default2:hover,
.btn-edit:hover,
.btn-delete:hover {
    border-color: #969696;
    color: #018fff;
    background-color: white;

}

.btn_add,
.btn_add2 {
  font-size: 11px !important;
  border-color: #2196F3;
  border-width: 1px;
  border-style: solid;
  font-weight: bold;
  color: #ffffff;
  background-color: #03A9F4;
}

hr {
  border-color: #e0e0e0;
}

.widget-dropdown select {
  font-family: "Open Sans" !important;
  font-size: 10px;
  background-color: white;
  border-radius: 3px;
  padding-left: 3px;
  width: auto !important;
  color: gray;
  margin-left: 2px;
  border-color: #dedede;
  padding-bottom: 0;
  position: absolute;
  margin: -2px 0 0 4px !important;
}

.btn_add:hover,
.btn_add:focus,
.btn_add2:hover,
.btn_add2:focus {
    color: white;
    background: rgb(15, 148, 246);
}

.btn-submit,
.btn-submit2 {
  color: #3ea756;
}

.btn-submit:hover,
.btn-submit2:hover {
  color: #3ea756;
  border-color: #3ea756;
}

.breakemail {
  width: 94% !important;
}

.btn-delete {
  /* font-size: 11px !important;
  border-width: 1px;
  border-style: solid;
  font-weight: bold; */
  color: red;

}

.btn-delete:hover {
  border-color: red;
  color: red;
}

.btn-edit,
.btn-cancel,
.btn-cancel2,
.btn-submit,
.btn-submit2,
.btn-delete {
  margin-left: 3px;
  /* position: relative; */
}

.btn-export {
  float: right;
}
.btn-default,
.btn-default2,
.btn_add {
  margin-left: 3px;
}


/*Button End*/


.panel-heading {
  padding-bottom: 15px !important;
}

.modal-header {
    text-align: center;
    background: rgb(247, 247, 247);
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    padding-top: 10px;
    padding-bottom: 10px;
    border: 0;
}

.modal-footer {
  border: 0;
  padding-left: 16px;
  padding-right: 16px;
  padding-top: 8px;
  padding-bottom: 8px;
}

.despwidth2 {
  width: 100px;
}

.nav-tabs {
  padding: 6px !important;
  white-space: nowrap;
  background: white;
  position: relative;
  margin: .5rem 0 1rem 0;
  background-color: #fff;
  border-radius: 2px;
  border: 0;
  box-shadow: 0 6px 8px rgba(102, 119, 136, .03), 0 1px 2px rgba(102, 119, 136, .3);
}

.itth {
  height: 35px !important;
}

.table>tbody>tr>td {
  vertical-align: middle !important;
  text-overflow: ellipsis;
  overflow: hidden;
  border: 0;
}

.table>thead>tr>th {
  border: 0;
  vertical-align: middle;
  color: #000000;
  background-color: #f9f9f9 !important;
  border-bottom: 1px solid #dddddd !important;
  text-align: left;
  cursor: default;
    padding: 9px 9px;
    padding-top: 3px;
    padding-bottom: 3px;
}

.checktask {
  transition: all 0.1s;
  position: absolute;
  left: -16px;
  opacity: 0;
}

.mydocs:hover .checktask {
  left: 14px;
  opacity: 1;
}

.padleft15 {
  transition: all 0.1s;
}

.mydocs:hover .padleft15 {
  padding-left: 17px;
}

.filter-area li a {
  color: black !important;
  font-family: 'Open Sans', sans-serif !important;
  letter-spacing: 0 !important;
  padding: 4px 11px !important;
  font-size: 11px !important;
}
tr.activeRowBenefit td{
      background-color: #fffce5fa;
}
.notes-tip-pop:hover .notes-tip {
    visibility: visible;
    text-align: center;
    white-space: normal;
    font-size: 10px;
    line-height: 15px;
    font-weight: normal;
    color: black;
    padding: 6px;
    border-radius: 4px;
    border: 1px dotted #da8509;
    margin-top: 5px;
}
.notes-tip-label {
    background-color: #e5a13e;
    position: absolute;
    top: 6px;
    left: -13px;
    padding: 0px 9px;
    border-radius: 52px;
    color: white;
}
.notes-tip {
  visibility: hidden;
  position: relative;
}
.notes-tip p {
    color: #da8509;
    margin: 0;
}
.notes-tip .mbri-edit2 {
    margin-bottom: 5px;
    color: #da8509;
    font-size: 17px;
    display: block;
}
.open .openfilter {
    z-index: 10 !important;
    position: relative;
    color: #2196F3;
    border-color: #2196F3;
}

.filter-area {
    min-width: 100px;
    left: -63px;
    top: 29px;
}

.filter-area>li>a:hover {
  background-color: #f7f7f7 !important;
}

.showfilterbox:hover .filterbox {
  display: block;
}

.filterbox {
  display: none;
}
.a-content .form-control:hover {
    border-color: #737373 !important;
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  outline: 0;
  padding-right: 19px !important;
  background-size: 20px !important;
  background-repeat: no-repeat !important;
  background-image: url(https://image.ibb.co/dfEnfw/arrowdown.png) !important;
  background-position: right !important;
  cursor: pointer;
}

.add-new {
  background: #63b6db;
  background: -moz-linear-gradient(top, #63b6db 0%, #309dcf 100%);
  background: -webkit-linear-gradient(top, #63b6db 0%, #309dcf 100%);
  background: linear-gradient(to bottom, #63b6db 0%, #309dcf 100%);
  filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#63b6db', endColorstr='#309dcf', GradientType=0);
  color: white;
  padding: 5px;
  padding-left: 15px;
  font-size: 13px;
  padding-right: 15px;
}

.add-new:hover {
  color: white;
  background: #309dcf;
  background: -moz-linear-gradient(top, #309dcf 1%, #63b6db 99%);
  background: -webkit-linear-gradient(top, #309dcf 1%, #63b6db 99%);
  background: linear-gradient(to bottom, #309dcf 1%, #63b6db 99%);
  filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#309dcf', endColorstr='#63b6db', GradientType=0);
}


/*New Mail Design*/

.btn-compose {
  background: #ef8e8e;
  color: white !important;
  width: 100%;
  margin-bottom: 6px;
  display: block;
  border: 1px solid #cc7878;
}

.btn-compose:hover {
  background: #f36e6e;
  color: white !important;
}

.mailbox {
  border-radius: 2px;
  background: #ffffff;
  margin-bottom: 20px;
  width: 100%;
  position: relative;
  border: 1px solid;
  border-color: #dadada;
}

.mailbox .box-header {
  color: #444;
  display: block;
  padding: 10px;
  position: relative;
  border-bottom: 1px solid #f4f4f4;
}

.box-body {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
  padding: 10px;
}

.mailbox .nav-pills>li.active>a,
.nav-pills>li.active>a:focus,
.nav-pills>li.active>a:hover {
  color: black;
  background: #f7f7f7 !important;
  -webkit-box-shadow: inset 3px 0 0 0 #ef8e8e;
  -moz-box-shadow: inset 3px 0 0 0 #ef8e8e;
  box-shadow: inset 3px 0 0 0 #ef8e8e;
  border-radius: 0;
}

.mailbox .nav li a {
  border-radius: 0;
  font-size: 12px;
  border-bottom: 1px solid #eaeaea;
  padding-top: 6px !important;
  padding-bottom: 6px !important;
}

.mailbox .nav li a:hover {
  background: #f7f7f7;
  -webkit-box-shadow: inset 3px 0 0 0 #ef8e8e;
  -moz-box-shadow: inset 3px 0 0 0 #ef8e8e;
  box-shadow: inset 3px 0 0 0 #ef8e8e;
  color: black;
}

.mailbox .label-primary {
  background-color: #ef8e8e;
}

.c-tab__content a strong {
    color: black;
    font-size: 13px;
}
.mailbox .label {
  display: inline;
  padding: 0.2em .6em .3em;
  font-size: 75%;
  font-weight: 600;
  line-height: 2 !important;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: .25em;
}

.mailbox-icon {
  width: 13px;
  margin-right: 3px;
}

.mailbox .box-title {
  display: inline-block;
  font-size: 14px;
  margin: 0;
  line-height: 1;
}

.mailbox .box-header>.box-tools {
  position: absolute;
  right: 10px;
  top: 5px;
}

.mailbox .has-feedback {
  position: relative;
}

.has-feedback .form-control {
  padding-right: 42.5px;
}

.mailbox-controls {
  padding: 5px;
}

.mailbox .table>tbody>tr>td {
  line-height: 1.42857143;
  vertical-align: middle !important;
  border: 0 !important;
  padding: 9px;
}

.text-yellow {
  color: #f39c12 !important;
}

.b-b-g {
  border-bottom: 1px solid #d8d8d8;
}

.b-b-g>input {
  width: 100% !important;
  border: 0 !important;
  height: 37px;
  padding-left: 14px;
  font-size: 14px;
}

.message-area textarea {
  border: 0;
  width: 100%;
}

.message-area textarea:hover {
  border: 0 !important;
}

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
  cursor: default;
  opacity: 1;
  background: #f4f7f7;
  color: #3a3a3a;
}
.disable {
  background: #f4f7f7;
  color: #3a3a3a;
  cursor: default;
}
.btn-lock {
  background: transparent;
  border: 1px solid lightgrey;
  font-size: 1.1em;
  color: lightgrey;
}

.targetDiv {
  width: 85%;
  position: absolute;
  top: 100px;
  z-index: 1;
  display: none;
  padding: 5px;
  line-height: 24px;
  border: 1px solid #d4d4d4;
  background: white;
  overflow: hidden;
  max-height: 217px;
  border-top: 0;
  -webkit-border-bottom-right-radius: 4px;
  -webkit-border-bottom-left-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -moz-border-radius-bottomleft: 4px;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
}

.targetDiv:hover {
  overflow-y: auto;
}

.targetDiv li a:hover {
  text-decoration: underline !important;
  color: #3693cf;
}

.targetDiv li a {
  display: block;
}

.title_active {
  color: blue;
}

.showSingle span {
  color: white;
  text-decoration: none;
  text-align: center;
  display: block;
  padding-top: 19px;
}

.showSingle {
  height: 120px;
  overflow: hidden;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
  -moz-border-radius: 2px 2px 2px 2px;
  box-shadow: 0 2px 0 0 rgba(40, 70, 100, .05);
  background: white;
  margin-bottom: 25px;
}

.showSingle:hover {
  cursor: pointer !important;
}

.showSingle:hover .c-anim-btn h4 {
  font-size: 16px;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.c-anim-btn h4 {
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.showSingle a {
  color: white;
}

.c-anim-btn i {
  font-size: 40px;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
  height: 39px !important;
  display: block;
}

.showSingle:hover .c-anim-btn i {
  transition: 0.6s;
  transform: rotateY(180deg);
}

.c-anim-btn h4 {
  margin: 0;
  font-size: 14px;
  margin-top: 13px;
}

.targetDiv .panel-body {
  padding: 3px;
}

.bg2 {
  background: rgba(26, 55, 71, 0.8);
}

.currentclass {
  border: 1px solid #d4d4d4;
  border-bottom: 0;
  box-shadow: none;
  -webkit-border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  -moz-border-radius-topleft: 4px;
  -moz-border-radius-topright: 4px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.showmore {
  display: none;
  position: absolute;
  z-index: 3;
  background: #ffffff;
  color: #6d6d6d;
  padding: 12px;
  border-radius: 3px 3px 3px 3px;
  -moz-border-radius: 3px 3px 3px 3px;
  -webkit-border-radius: 3px 3px 3px 3px;
  padding: 12px;
  top: 42px;
  box-shadow: 0 0 3px 0 #9e9e9e;
}

.showmore2 {
  display: none;
  position: absolute;
  z-index: 3;
  background: #ffffff;
  color: #6d6d6d;
  padding: 12px;
  border-radius: 3px 3px 3px 3px;
  -moz-border-radius: 3px 3px 3px 3px;
  -webkit-border-radius: 3px 3px 3px 3px;
  padding: 12px;
  top: 42px;
  box-shadow: 0 0 3px 0 #9e9e9e;
}

.showmore2:after {
  content: "";
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #dadada;
  position: absolute;
  left: 7px;
  top: -10px;
  box-shadow: 0 0 3px 0 #ffffff;
}

.showmore:after {
  content: "";
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #dadada;
  position: absolute;
  left: 7px;
  top: -10px;
  box-shadow: 0 0 3px 0 #ffffff;
}

.ltsp:hover .showmore {
  display: block;
}

.ltdp:hover .showmore2 {
  display: block;
}

.fadeInUp {
  -webkit-animation-duration: 0.2s;
  -moz-animation-animation-delay: 0.2s;
}

.zoomIn {
  -webkit-animation-duration: 0.1s;
  -moz-animation-animation-delay: 0.1s;
}

.fadeInRight {
  -webkit-animation-duration: 0.2s;
  -moz-animation-animation-delay: 0.2s;
}

.fadeIn {
  -webkit-animation-duration: 0.2s;
  -moz-animation-animation-delay: 0.2s;
}

.affix {
    right: 0;
    bottom: 0;
    padding: 12px 26px;
    background: white;
    z-index: 9 !important;
    box-shadow: 1px 1px 13px 1px rgba(0, 0, 0, 0.23);
}

.nav-tabs .nav-tabs {
  border: 0 !important;
}

© .navbar-fixed-top {
  font-size: 11px !important;
  border: 0 !important;
  height: 51px;
}

.ngdialog-content .panel-default {
  background: white !important;
}

.modal-body {
  padding-bottom: 0;
  min-height: 187px;
}

.modal-body .panel-default {
  background: white !important;
  border: 0 !important;
  box-shadow: none;
  padding-bottom: 0;
}

.form-control+.form-control-feedback,
.form-control+.parsley-errors-list+.form-control-feedback {
  right: -12px;
  top: 9px;
  color: #464646;
  z-index: 1;
  font-size: 13px !important;
  color: #cccccc;
}

.table>tbody>tr:last-child {
  border: 0 !important;
}

.panel-default .panel-default {
  border-radius: 0;
  border-bottom: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
}

h4.no-span {
  padding-left: 13px;
  font-weight: 600;
}

.panel-default .panel-default .panel-heading {
  padding-top: 34px;
}

.ngdialog-content .panel-default {
  border: 0 !important;
  box-shadow: none;
  padding: 0;
}

/* Please add to your summernote.css / summernote-bs4.css file to fix bold. */
.note-editable b,
.note-editable strong {
  font-weight: bold !important;
}

.word-counter {
  position: absolute;
  right: 15px;
  display: none;
  font-size: 12px;
  padding: 0 5px;
  color: #000;
  border-radius: 2px;
  border: 1px solid #d0d0d0;
  background: white;
  margin-top: -1px;
  border-top: 1px solid white;
}

.disable-btn {
  background: #f9f9f9;
  color: #d4d4d4;
  border: 1px solid #b7b7b7;
}

.disabled {
  cursor: not-allowed;
}

.onspan {
  width: 20px;
  position: absolute;
  top: 6px;
  right: 25px;
  opacity: 0.5;
}

.onspan:hover {
  cursor: pointer;
  opacity: 1;
}

.centerwidth {
  margin: 0 auto;
  width: 85%;
}

ul.nav-tabs > li.dont-click a{
      color: #b7b7b7;
}
.modal-title {
    color: #000000;
    font-size: 13px;
    font-weight: bold;
}

.modal-footer .btn+.btn {
  margin-left: 0;
}

.table {
  margin-bottom: 0;
}

.ui-datepicker-calendar thead {
  border: 0;
  text-transform: uppercase;
  font-size: 9px;
}

select[disabled] {
  background-image: none !important;
  padding-right: 0 !important;
}

thead tr {
  height: 30px;
}

.tab-content>.tab-pane {
  margin-top: 12px;
}

@keyframes animateCard {
  0% {
    opacity: 0;
    transform: translate(0, -10px);
  }

  100% {
    opacity: 1;
    transform: translate(0px, 0px);
  }
}

.addshadow {
  background: #ffffff !important;
  left: 0;
  padding-left: 68px !important;
  box-shadow: 1px 0 11px 0 #e4e4e4;
}

.red-btn {
  background: #8a8a8a;
  padding: 8px;
  padding-left: 10px;
  padding-right: 10px;
  border-radius: 4px;
  color: white;
}

.red-btn i {
  color: white;
}

.red-btn:hover {
  color: white;
  background: grey;
}

.set-menu li {
  display: inline;
  margin-right: 8px;
}

.set-menu a:hover {
  cursor: pointer;
}

.set-menu ul {
  text-align: left;
  top: 45%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  height: 100%;
  left: auto;
  width: 300px;
  position: absolute;
  margin-left: 65px;
  display: none;
  margin-left: 92px;
}

.down-col li {
  display: block;
}

.downloads {
  display: none;
  position: relative;
  top: -24px;
  left: 168px;
  background-color: #6a9fcc;
  color: white;
  width: 93px;
  padding-left: 11px;
  padding-bottom: 4px;
  padding-top: 6px;
  padding-right: 10px;
  border-radius: 4px;
}

.downloads a {
  padding-right: 5px;
}

.downloads i {
  font-size: 18px;
  color: white;
}

.down-col span {
  margin-right: 6px;
  position: relative;
  top: -2px;
}

.modal.in .modal-dialog {
  margin-top: 84px;
}

.pagination {
  padding-left: 0;
  margin: 8px 0;
  border-radius: 4px;
  margin-top: 38px;
  float: right !important;
  position: relative;
  top: 9px;
}

a.ct1a1 {
  padding: 7px;
  font-size: 13px;
  color: #848484;
  position: relative;
  top: 7px;
  background: white;
  border-radius: 2px;
  border: 1px solid #d0d0d0;
}

a.ct1a1:hover {
  background-color: #e9ebee;
  color: #545454;
  cursor: pointer;
}

.cfilter {
  display: none;
}

.wt {
  width: auto !important;
}

a.submit-popper {
  color: white;
  display: block;
  width: 48%;
  text-align: center;
  background: #5aaf5a;
  margin: 0 auto;
  padding: 5px;
  border-radius: 2px;
}

.testing .form-group {
  padding-bottom: 21px;
}

.dd-listing {
  position: relative;
}

.dd-listing-op {
  position: absolute;
  top: 109%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 160px;
  padding: 5px 0;
  margin: 2px 0 0;
  font-size: 14px;
  text-align: left;
  list-style: none;
  background-color: #fff;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, .15);
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
}

.dropdown-menu-rights {
  right: 32px;
  left: auto;
  border-radius: 0;
  top: 22px;
  background: #ffffff;
  -webkit-box-shadow: inset 0 0 0 1px #d4d4d4;
  -moz-box-shadow: inset 0 0 0 1px #d4d4d4;
  box-shadow: inset 0 0 0 1px #d4d4d4;
  box-shadow: none;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
  min-width: 0 !important;
}

.ty-1:hover {
  background: white !important;
  color: #3693cf !important;
}

.ty-1:focus {
  -webkit-box-shadow: inset 0 0 0 1px #d4d4d4;
  -moz-box-shadow: inset 0 0 0 1px #d4d4d4;
  box-shadow: inset 0 0 0 1px #d4d4d4;
  background: white !important;
}

.dropdown-menu-rights li a {
  text-align: left;
}

.dispin {
  display: inline-table;
}

.tyw {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  border-radius: 0;
  marker: 10px;
  top: 21px;
  border: 1px solid #a2a2a2;
}

a.yyuy {
  text-align: center !important;
  padding: 7px !important;
  position: relative !important;
  bottom: -8px !important;
  color: white !important;
  background: #f1f1f1;
}


.showhide {
  position: relative;
  color: white;
  padding: 8PX;
  background: #484242;
  z-index: 1;
  right: 15px;
  -webkit-border-top-left-radius: 5px;
  -webkit-border-bottom-left-radius: 5px;
  -moz-border-radius-topleft: 5px;
  -moz-border-radius-bottomleft: 5px;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
  top: 227px;
  padding-bottom: 11px;
  padding-top: 9px;
  padding-right: 10px;
  padding-left: 7px;
  right: 16px;
  display: none;
}

.showhide:hover {
  cursor: pointer;
  background: #676767;
  color: #ffffff
}

.showhidefields {
  color: black;
  margin: 0 auto !important;
  width: 45% !important;
  display: block;
}

.item-del {
  background: rgba(255, 236, 236, 0.6) !important;
  color: #b76864;
}


.grandtotal {
  position: absolute;
  top: 1px;
  z-index: 3;
  left: 24px;
  color: white;
  font-weight: 600;
}

.in-dir {
  text-align: left;
  padding-left: 112px !important;
  color: white !important;
  padding-top: 2px !important;
}

.place-gbp {
  position: absolute;
  top: 0;
  right: 22px;
  color: white !important;
}

.bluecolr {
  padding-left: 100px;
  text-align: right;
  background: #3693cf !important;
  color: white !important;
  border: 0 !important;
  font-size: 13px !important;
  -webkit-border-bottom-right-radius: 3px !important;
  -webkit-border-bottom-left-radius: 3px !important;
  -moz-border-radius-bottomright: 3px !important;
  -moz-border-radius-bottomleft: 3px !important;
  border-bottom-right-radius: 3px !important;
  border-bottom-left-radius: 3px !important;
  position: relative;
  top: -5px;
}

.modal-body .widget-body {
  box-shadow: none;
}

.modal-body .panel-body {
  box-shadow: none;
}

.highlight-focus {
  border: 1px solid #bbbbbb;
  color: #888888;
  width: 75%;
}

.whirl {
  content: " ";
  z-index: 999;
  display: block;
  top: 0;
  left: 0;
  right: 0;
  cursor: wait;
  min-height: 100%;
}

.whirl:before {
  background-image: url('loading.gif');
}

.form-control:hover:not(:focus) {
  border-color: #bbbbbb;
}

.addbtn2 {
  position: absolute;
  z-index: 999;
  top: 15px;
  right: 11px;
}

.cog-highlight {
  color: #bbbbbb;
  margin-left: 2px;
  font-size: 12px;
}

.cog-highlight:hover {
  cursor: pointer;
  color: gray;
}

.form-control[disabled]:hover,
.form-control[readonly]:hover {
  border-color: #e5e5e5;
}

.form-control {
    padding: 5px 5px;
    box-shadow: none !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 29px;
    border-radius: 2px;
    font-size: 11px;
    position: relative;
    color: black;
    font-weight: normal;
    background: white;
    border: 1px solid #e5e5e5;
    text-overflow: ellipsis;
}


.in-t-1 {
    border: 1px solid #e5e5e5;
    width: 100%;
    background: white;
    color: black;
    transition: none;
    height: 29px !important;
    padding: 5px 5px;
    border-radius: 2px;
}

.in-t-1:focus {
  color: #000000 !important;
  box-shadow: none !important;
  border-color: #000000 !important;
  outline: none;
}

.in-t-2 {
  padding: 7px;
  font-size: 13px;
  color: #848484;
  position: relative;
  top: 7px;
  background: white;
  border-radius: 2px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
  border: 1px solid #d0d0d0 !important;
}

.in-t-2:hover {
  color: black;
  cursor: pointer;
}

.panel-body .table-responsive {
  border: 0;
  padding: 0;
  box-shadow: none;
}


.form-control:readonly {
  box-shadow: none !important;
}

.low-op {
  opacity: 0.6;
}

.w-55 {
  width: 60%;
  display: inline-block;
  padding: 3px;
  font-weight: 600;
  text-align: right;
}

.w-45 {
  width: 38%;
  display: inline-block;
  text-align: right;
}

.modal-body .panel-body {
  padding: 0 !important;
  /* overflow-x: hidden; */
}

.modal-body .note-editor .panel-body {
  padding: 9px !important;
}

.note-editor p {
  margin: 0 0 1px;
}

.modal-body table .panel-body {
  padding: 5px 11px !important;
}

.modal-body .widget-body {
  border: 0;
}

.material-icons.md-18 {
  font-size: 18px;
}

.material-icons.md-24 {
  font-size: 24px;
}

.material-icons.md-36 {
  font-size: 36px;
}

.material-icons.md-48 {
  font-size: 48px;
}

.cards {
  position: relative;
  margin: .5rem 0 1rem 0;
  background-color: #fff;
  border-radius: 4px;
  border: 1px solid;
  border-color: #dadada;
  transition: 0.3s;
}

.cards:hover {
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
  transition: 0.3s;
}

.cards .cards-content {
  padding: 15px;
  border-radius: 0 0 2px 2px;
}

.cards .card-content>h5 {
  margin: 0;
}

.progresss {
  position: relative;
  height: 4px;
  display: block;
  width: 100%;
  background-color: #acece6;
  border-radius: 2px;
  margin: .5rem 0 1rem 0;
  overflow: hidden;
}

.progresss .determinate {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  background-color: #26a69a;
  transition: width .3s linear;
}

.rows {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
}

.orange.darken-2 {
  background-color: #f57c00 !important;
}

.teal.darken-2 {
  background-color: #00796b !important;
}

.orange {
  background-color: #ff9800 !important;
}

.blue.lighten-4 {
  background-color: #BBDEFB !important;
}

.blue {
  background-color: #2196F3 !important;
}

.red.lighten-4 {
  background-color: #FFCDD2 !important;
}

.red {
  background-color: #F44336 !important;
}

tr.onHoldRed  {
  color: #ff0000 !important;
}
td.onHoldRed  {
  color: #ff0000 !important;
}
.greencolorImp {
  color: green !important;
}

.d-wi {
  background: white;
  padding: 20px;
  position: relative;
  margin: .5rem 0 1rem 0;
  background-color: #fff;
  border-radius: 4px;
  border: 1px solid;
  border-color: #dadada;
}

.ibn {
  margin-right: 8px;
  display: none !important;
}

.d-title {
  font-size: 15px;
  position: relative;
  top: -12px;
  margin: 5px 0;
}

.d-close {
  position: absolute;
  top: 10px;
  right: 11px;
  background: white;
  padding-left: 6px;
  padding-right: 5px;
  border: 1px solid #e8e8e8;
  border-radius: 2px;
  box-shadow: 0 2px 0 0 rgba(40, 70, 100, .05);
  border-radius: 50%;
  box-shadow: 0 2px 0 0 rgba(40, 70, 100, .05);
}

/* .panel-body .hilight {
    color: #000000 !important;
    font-size: 11px;
    font-weight: bold !important;
    pointer-events: none;
} */

[ng-readonly~=product_type] {
    color: #000000 !important;
    font-size: 13px !important;
    background: #f4f7f7 !important;
    pointer-events: none;
    font-weight: bold;
}

.modal-header .close {
  position: relative;
}

.btn[disabled].btn-icon {
  opacity: 1;
  background-color: #f4f7f7;
}

.btn[disabled].btn-icon i {
  color: gray;
}

.modal-body .widget-body {
  border: 0 !important;
  box-shadow: none !important;
}

.panel-default .panel-default {
  box-shadow: none !important;
  padding-bottom: 0;
}

input.ng-invalid:hover .parsley-errors-list>li {
  display: none !important;
}

.n-heading {
  position: absolute;
  top: 0;
  text-align: center !important;
  display: block;
  width: 100%;
  left: 0;
}

ul.options-list li {
  display: inline-block;
  width: 32%;
  margin-bottom: 10px;
}

ul.options-list li a {
  padding: 10px;
  background: #f5f5f5;
  display: block;
  text-align: center;
  outline: none !important;
}

ul.options-list li a:hover {
  color: #3693cf;
}

ul.options-list .panel-body ul li {
  display: inline;
  padding: 0;
}

.fix-width {
  height: 0;
  position: absolute;
  width: 182px;
}

.fix-width ul li a {
  padding: 3px;
}

.fix-width ul {
  background: #f1f1f1;
}

b,
strong {
  font-weight: 600;
}

.inline-do ul.options-list {
  display: inline-block;
  width: 32%;
}

.inline-do ul.options-list li {
  width: 100%;
}

a.defaultimage:hover span {
  display: block;
}

a.defaultimage span {
  display: none;
  z-index: 33333;
  position: absolute;
  top: -170px;
  background: white;
  border: 1px solid #d2d2d2;
  padding: 4px;
  border-radius: 4px;
  left: 0px;
}

a.defaultimage span img {
  width: 237px;
  height: 147px;
}

a.defaultimage img.d1img {
  /*max-width: 300px;*/
  max-width: 66px;
  border-radius: 2px;
  margin-top: 10px;
  margin-left: 14px;
}

.a-t-l {
  position: absolute;
  top: 2px;
  left: 7px;
}

em.icon-name {
  position: relative;
  top: -3px;
  left: 6px;
  font-style: normal;
}

.actives {
  -webkit-box-shadow: inset 0 -2px 0 0 #3693cf !important;
  -moz-box-shadow: inset 0 -2px 0 0 #3693cf !important;
  box-shadow: inset 0 -2px 0 0 #3693cf !important;
  color: #3693cf !important;
}

.btn-hl:hover {
  box-shadow: none;
  color: #2196F3 !important;
  border: 1px solid;
  border-radius: 2px !important;
}

.select-btn .btn.active {
  box-shadow: none;
  color: #2196F3 !important;
  border: 1px solid;
  border-radius: 2px !important;
}

.select-btn .btn {
  font-size: 11px;
}


.ui-datepicker th {
  background: white !important;
  color: black !important;
  text-align: center !important;
  border: 0 !important;
}


b.caret {
  position: relative;
  left: 5px;
}

.ui-widget-content .ui-state-default {
  border: 0 !important;
  text-align: center;
  background: white !important;
}

.ui-widget-content .ui-state-default:hover {
    background-color: #eaeaea !important;
    border-radius: 20px;
}
.ui-widget-content .ui-state-highlight:hover,.ui-widget-content .ui-state-active:hover {
    background-color: white !important;
}
.ui-datepicker-title select:hover {
    cursor: pointer;
    color: #000000;
    border-color: #cccccc;
}
#ui-datepicker-div {
  width: 220px;
}

.ui-state-active,
.ui-widget-content .ui-state-active {
    background: #ffffff !important;
    font-weight: normal;
    color: #008eff !important;
    border-radius: 20px;
    font-weight: bold;
    box-shadow: inset 0 0 0px 2px;
}

.ui-state-highlight,
.ui-widget-content .ui-state-highlight {
    color: white !important;
    border-radius: 2px;
    color: orange !important;
    border-radius: 20px;
    font-weight: bold;
    box-shadow: inset 0 0 0px 2px;
}

.ui-corner-all:hover {
  cursor: pointer !important;
}

.full-border .table-responsive {
  padding: 0 !important;
  box-shadow: none !important;
}

.active-listing {
  display: none;
}

.active-btns {
  display: inline-block !important;
}

.targetDiv .collapse.in {
  padding-top: 14px;
  margin-top: -22px;
  background: whitesmoke;
}

#toast-container {
  top: 59px;
}


.bor-input .form-control {
  box-shadow: none !important;
  border: 1px solid #c5c5c5 !important;
  padding-left: 7px !important;
}

.cv-image {
  position: absolute;
  top: -106px;
  right: 17px;
  background: white;
}

.cv-bor {
  height: 108px;
  width: 99px;
}

.d-w-s {
  box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
  background: white;
  padding: 20px;
}

.contact-picture {
  line-height: 110px;
  align-items: center;
  color: rgb(255, 255, 255);
  text-align: center;
  font-size: 36.6667px;
  overflow: hidden;
  background-color: rgb(157, 165, 171);
  width: 110px;
  flex-shrink: 0;
  justify-content: center;
  display: flex;
  position: relative;
  letter-spacing: 2px;
  border-radius: 2px;
  height: 110px;
}

.upload-picture {
  position: absolute;
  top: 35px;
  right: 0;
}

.upload-picture i {
  font-size: 15px;
  background: rgb(255, 255, 255);
  border-top-left-radius: 3px;
  color: #9da5ab;
  padding: 6px;
}

.upload-picture i:hover {
  color: #3693cf !important;
}

.contact-li {
  border: 1px dotted #c5c5c5;
  padding: 12px 0;
  padding-bottom: 10px;
}

.contact-li svg {
  transition: 0.2s;
}

.c-title {
  display: inline-block;
  position: relative;
  color: black;
  font-weight: bold;
}

.no-b-mar {
  margin-bottom: 0 !important;
}

.left-info-contact {
  color: #7d868c;
  font-size: 14px;
  margin-top: 10px;
}

.left-info-contact i {
  margin-right: 15px;
  width: 10px;
}

.no-border-top {
  border-top: 0;
}
.no-border {
  border:0 !important;
}

.bold-text::-webkit-input-placeholder {
  font-size: 17px !important;
}

.bold-text::-moz-input-placeholder {
  font-size: 17px !important;
}

.bold-text::-ms-input-placeholder {
  font-size: 17px !important;
}

.bold-text {
  font-size: 17px !important;
  font-weight: 600 !important;
}

.add-new-con {
  border: 1px solid #3693cf;
  padding: 5px;
  border-radius: 19px;
  position: relative;
  width: 23px;
  padding-left: 6px;
  top: 2px;
  font-size: 10px !important;
  padding-top: 6px;
  color: #499dd3;
}

.add-new-con:hover {
  background: #499dd3;
  color: white;
}

.sp::-webkit-input-placeholder {
  padding-left: 10px;
}

.sp::-moz-input-placeholder {
  padding-left: 10px;
}

.sp::-ms-input-placeholder {
  padding-left: 10px;
}

.featured-articles-container .articles em {
  color: #a2a2a2;
  margin-left: 6px;
  font-style: normal;
  font-size: 12px;
}

.add-margin-p {
  margin-left: 0 !important;
  line-height: 22px;
  font-weight: normal;
  font-style: normal;
  font-size: 11px;
  color: gray;
}

.setshow {
  background: #f4f7f7 !important;
  border-color: #e5e5e5 !important;
}

.circle-icon2 {
  text-align: center;
  border: 1px solid #ffffff;
  padding: 3px;
  border-radius: 50%;
  color: #afafaf;
  width: 28px;
  display: inline-block;
}

.circle-icon2:hover {
  color: #717171;
  background: #eaeaea !important;
}

.small-btn {
  background: transparent;
  border: 1px solid #dadada;
  color: #929292;
  border-radius: 2px;
  padding: 4px;
}

.small-btn:hover {
  color: gray;
  border-color: gray;
}

.hide-filter {
  display: none !important;
}

.btn-info {
  color: #484242;
}

tbody.no-border-table tr th,
tbody.no-border-table tr td {
  border-style: none;
}

body.modal-open {
  padding-right: 0px !important;
}

.level2 {
  position: relative;
}

.pickdate {
  background: white !important;
  cursor: pointer !important;
  color: #000 !important;
}

.whitebg {
  background: white !important;
  cursor: pointer !important;
  color: #000 !important;
}

.level2:before {
  content: "";
  display: block;
  width: 10px;
  height: 0;
  border-top: 2px solid;
  margin-top: -2px;
  position: absolute;
  top: 1em;
  left: 28px;
}

.input-s2 {
  border: 1px solid grey !important;
  box-shadow: none !important;
  padding-left: 4px !important;
}

.show_record {
  position: relative;
  top: 6px;
}

.cfcl .form-group .control-label {
  margin-top: 10px !important;
}

.total_paging_record {
  margin-top: 7px;
  margin-right: 15px;
  font-weight: 600;
}

.total_paging_center {
  margin-top: 7px;
}

.page-options {
  position: relative;
  width: 100%;
  background: white;
  display: inline-block;
  padding-top: 5px;
  padding-bottom: 5px;
  border: 1px solid #eaeaea;
  font-size: 11px;
  height: 45px;
}

.right-sidebar .page-options {
  display: none;
}

.right-sidebar2 .page-options {
  display: none;
}

.acidjs-css3-treeview,
.acidjs-css3-treeview * {
  padding: 0;
  margin: 0;
  list-style: none;
}

.acidjs-css3-treeview label[for]::before,
.acidjs-css3-treeview label span::before {
  content: "\25b6";
  display: inline-block;
  margin: 2px 0 0;
  width: 13px;
  height: 13px;
  vertical-align: top;
  text-align: center;
  color: #e74c3c;
  font-size: 8px;
  line-height: 13px;
}

.acidjs-css3-treeview li ul {
  margin: 0 0 0 22px;
}

.acidjs-css3-treeview * {
  vertical-align: middle;
}

.acidjs-css3-treeview {
  font: normal 11px/16px "Segoe UI", Arial, Sans-serif;
}

.acidjs-css3-treeview li {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.acidjs-css3-treeview input[type="checkbox"] {
  display: none;
}

.acidjs-css3-treeview label {
  cursor: pointer;
}

.acidjs-css3-treeview label[for]::before {
  -webkit-transform: translatex(-24px);
  -moz-transform: translatex(-24px);
  -ms-transform: translatex(-24px);
  -o-transform: translatex(-24px);
  transform: translatex(-24px);
}

.acidjs-css3-treeview label span::before {
  -webkit-transform: translatex(16px);
  -moz-transform: translatex(16px);
  -ms-transform: translatex(16px);
  -o-transform: translatex(16px);
  transform: translatex(16px);
}

.acidjs-css3-treeview input[type="checkbox"][id]:checked~label[for]::before {
  content: "\25bc";
}

.acidjs-css3-treeview input[type="checkbox"][id]:not(:checked)~ul {
  display: none;
}

.acidjs-css3-treeview label:not([for]) {
  margin: 0 8px 0 0;
}

.acidjs-css3-treeview label span::before {
  content: "";
  border: solid 1px #1375b3;
  color: #1375b3;
  opacity: .50;
}

.acidjs-css3-treeview label input:checked+span::before {
  content: "\2714";
  box-shadow: 0 0 2px rgba(0, 0, 0, .25) inset;
  opacity: 1;
}

.chk_in_role input {
  margin-left: 6px;
  margin-right: 1px;
}

.add-new-dash {
  padding: 11px;
  border-radius: 50%;
  text-align: center;
  font-size: 16px;
  padding-right: 15px;
  padding-left: 15px;
  background-color: #2ca1e0;
  border-color: #1f94d3;
  color: white;
  box-shadow: 0 3px 6px 0 #bfbfbf;
  position: relative;
}

.ngdialog-content {
  background: #ffffff !important;
}

.add-new-dash-open {
  display: none;
  position: absolute;
  width: 400px;
  right: -2px;
  top: 0;
  padding: 6px;
  -webkit-border-radius: 10px;
  -webkit-border-top-right-radius: 24px;
  -moz-border-radius: 10px;
  -moz-border-radius-topright: 24px;
  border-radius: 10px;
  border-top-right-radius: 24px;
  background-color: #2ca1e0;
  border-color: #1f94d3;
  z-index: 3;
  -webkit-transition: width 0.2s linear;
  -moz-transition: width 0.2s linear;
  -ms-transition: width 0.2s linear;
  -o-transition: width 0.2s linear;
  transition: width 0.2s linear;
  color: white;
  box-shadow: 0 5px 7px 0 rgba(0, 0, 0, 0.18);
}

.add-new-dash:hover>.add-new-dash-open {
  display: block;
  -webkit-transition: width 0.2s linear;
  -moz-transition: width 0.2s linear;
  -ms-transition: width 0.2s linear;
  -o-transition: width 0.2s linear;
  transition: width 0.2s linear;
}

.add-new-dash-open li a {
  font-size: 12px;
  color: white;
  line-height: 0;
}

.add-new-dash-open li a:hover {
  text-decoration: underline !important;
  cursor: pointer;
}

.cust-dash {
  display: none;
}

.add-new-dash-open li a.show-cust:hover .cust-dash {
  display: block;
}

.dash-b-line {
  width: 92%;
  display: inline-block;
  border: 1px solid rgba(255, 255, 255, 0.16);
}

.s-1-a {
  position: relative;
  top: 2px;
  opacity: 0.6;
}

.s-1-a:hover {
  opacity: 1;
  cursor: pointer;
}

.a-s-1 {
  padding: 4px !important;
  border-radius: 2px;
  margin-right: 18px;
  padding-right: 10px !important;
  padding-left: 10px !important;
  color: #a0a0a0;
  margin-top: -3px;
}

.a-s-1:hover {
  background: #484242;
  padding: 4px !important;
  color: white;
  border-radius: 2px;
  margin-right: 18px;
  padding-right: 10px !important;
  padding-left: 10px !important
}

.m0auto {
  display: block;
  margin: 0 auto;
  border: 1px solid white;
}

table tr td .btn {
  padding: 0 0 !important;
}

.m0auto img {
  width: 58%;
}

.mtop23 {
  margin-top: -23px;
}

.pt7 {
  padding-top: 7px;
}

.addnew {
  font-weight: 600;
  color: #a0a0a0;
}

.navbar-fixed-bottom,
.navbar-fixed-top {
  z-index: 8;
}

.img-circles {
  margin-left: 8px;
  margin-top: 1px;
  transition: all 0.2s;
}

.hoverimg:hover {
  cursor: pointer;
}

.hoverimg img {
  opacity: 0.5;
  transition: 0.3s ease;
  cursor: pointer;
}

.hoverimg:hover img {
  transform: scale(1.5, 1.5);
  opacity: 1;
  position: relative;
  left: 86px;
}

.com-info {
  background: black !important;
  font-size: 12px;
  padding-bottom: 11px !important;
  border-bottom-right-radius: 0;
  width: -moz-available;
  width: -webkit-fill-available;
  width: fill-available;
}
/* .ngdialog-close {
  display: none;
} */

.com-pro-img {
  width: 28%;
  float: left;
  border-radius: 3px;
  height: 60px;
}

.form-control2 {
  background: rgb(255, 255, 255);
  padding: 10px;
  position: relative;
  border: 1px solid #ffffff;
  padding-left: 17px !important;
  width: 100%;
  margin-bottom: 13px;
  border-radius: 2px;
  color: #3c3c3c;
}

.form-control2:focus {
  border: 1px solid white;
}

.form-control2::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: #3c3c3c;
}

.form-control2::-moz-placeholder {
  /* Firefox 19+ */
  color: #3c3c3c;
}

.form-control2:-ms-input-placeholder {
  /* IE 10+ */
  color: #3c3c3c;
}

.form-control2:-moz-placeholder {
  /* Firefox 18- */
  color: #3c3c3c;
}

.btn-login {
  padding: 9px;
  border-radius: 2px;
  text-align: center;
  width: 100%;
  border: 0;
  color: #ffffff;
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 1px;
  background-color: #03A9F4;
  transition: all 0.6s;
}

.btn-login:hover {
  background-color: #2196F3;
}

#calendar {
  position: absolute !important;
}

.img-circle {
  border-radius: 50%;
  width: 32px !important;
  margin-top: 7px !important;
}

.circle-top-name {
  padding: 4.6px !important;
  padding-left: 25px !important;
}

.table a i.fa {
  font-size: 8px;
  width: 17px;
  padding: 4px 3px;
  text-align: center;
  border: 1px solid #d4d4d4;
  border-radius: 2px;
  color: #909090;
  background: white;
}


.table a i.fa:hover {
    color: #2196F3;
    border-color: #2196F3;
    border-radius: 2px;
}

.table i.fa-times {
  padding-left: 5px !important;
  padding-right: 5px !important;
}

.c-tabs-nav {
    background: #ffffff;
    position: fixed;
    z-index: 7;
    top: 51px;
    width: 264px;
    left: 0;
    bottom: 0;
    overflow-y: auto;
    padding-left: 57px;
    padding-right: 20px;
    overflow-x: hidden;
    border-right: 1px solid #dedede;
}

.c-tabs-nav__link {
padding: 12px 0 12px 15px;
    display: flex;
    font-weight: bold;
    font-size: 12px;
    position: relative;
    margin-bottom: 4px;
    align-items: center;
    justify-content: left;
}

.c-tabs-nav__link:first-child {
  margin-top: 30px !important;
}

.c-tabs-nav__link:last-child {
  margin-right: 0;
}

.c-tabs-nav__link.is-active,
.c-tabs-nav__link:hover {
    background-color: #f1f3f7;
    border-radius: 2px;
    cursor: pointer;
}

.c-tabs-nav__link.is-active::before {
  content: '';
  position: absolute;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-right: 10px solid white;
  right: -20px;
}

.c-tabs-nav__link.is-active span,
.c-tabs-nav__link:hover span {
  color: #1f62d0;
}

.c-tabs-nav__link i,
.c-tabs-nav__link span {
  margin: 0;
  padding: 0;
  line-height: 1;
  color: #4f5d78;
}

@media all and (min-width: 720px) {
  .c-tabs-nav__link i {
    margin-bottom: 12px;
    font-size: 24px;
  }

  .c-tabs-nav__link span {
    display: block;
  }
}


/** 
* Tab
*/

.c-tab {
  display: none;
  background-color: white;
}

.c-tab.is-active {
  display: block;
}

.c-tab__content {
  margin-top: 14px;
  position: fixed;
  background: white;
  right: 0;
  left: 0;
  top: 37px;
  padding-left: 280px;
  bottom: 0;
  overflow: auto;
  padding-top: 27px;
  padding-right: 27px;
  background-image: url(setup-pattern.svg);
  background-repeat: no-repeat;
  background-position: bottom right;
  background-size: cover;
}

select::-ms-expand {
display: none;
}

.c-tab__content ul {
    padding: 0 !important;
}

#simpleList {
    margin-top: 50px;
}

.reorderMode {
  background-size: 8.33% 67px;
  background-image: linear-gradient(to right, #e9ebee 8.33%, transparent 0), linear-gradient(to top, #e9ebee 10px, transparent 0);
  background-repeat: repeat;
  background-position: -4px 5px;
  bottom: 53px;
  background-color: #dde0e4;
  transition: 0.1s linear;
}

.c-tabs.no-js .c-tabs-nav {
  display: none;
}

.c-tabs.no-js .c-tab {
  display: block;
  margin-bottom: 1.5rem;
}

.c-tabs.no-js .c-tab:last-child {
  margin-bottom: 0;
}

.s-con {
  padding: 5px;
}

.s-con span {
  display: block;
}

.ngdialog-message b {
    font-weight: normal;
}
.s-con:hover {
  background: whitesmoke;
}

.c-tab__content a {
    padding: 3px 10px;
    color: #676c88;
    font-size: 13px;
    display: block;
    position: relative;
}

.c-tab__content a::before {
  position: absolute;
  font-family: "FontAwesome";
  content: "\f105";
  visibility: hidden;
  left: 0;
}

.c-tab__content a:hover,
.c-tab__content .panel-body a:hover {
      color: #008eff;
}
.c-tab__content a:hover::before,
.c-tab__content .panel-body a:hover::before {
            visibility: visible;
}
.checkdiv {
    /* padding: 3px 9px;
    border: 1px solid #e6e6e6;
    border-radius: 2px;
    display: block; */
}
.checkdiv:hover {
    /* background-color: #fdfdfd; */
    cursor: pointer;
}
.c-tab__content a:active {
    color: #1a77c1;
}
.l-style a {
  padding: 5px;
  margin-right: 25px;
}

.l-style li {
  margin-bottom: 10px;
}

.c-tab__content .panel-body {
    /* padding: 3px; */
    /* border-left: 1px dotted #b9b9b9;
    margin-left: 12px; */
    /* overflow: auto; */
    /* padding-left: 8px; */
    /* padding-left: 7px; */
    overflow: auto;
    padding: 0 0 0px 5px;
}

/* .c-tab__content .panel-body:hover {
  border-left-style: solid;
  border-left-color: black;
} */

/*.c-tabs-nav__link.is-active i {
  -webkit-animation: anim 3s infinite linear;
  animation: anim 3s infinite linear;
}*/

@-webkit-keyframes anim {
  from {
    -webkit-transform: rotateY(0deg);
  }

  to {
    -webkit-transform: rotateY(360deg);
  }
}

@keyframes anim {
  from {
    transform: rotateY(0deg);
  }

  to {
    transform: rotateY(360deg);
  }
}

.c-tab__content .panel-body a {
  padding: 4px;
}

.table>thead>tr>th.sortordertable:hover {
  cursor: ns-resize;
  color: #2196F3;
}

img.img-circles:before {
  background: red;
}

.permis {
  margin-top: 5px;
  display: inline-block;
  margin-bottom: 24px;
}

.show-more {
  display: none;
}

.show-less:hover.show-more {
  display: block;
}

.type-document {
  -webkit-transition: all 0.1s ease;
  -moz-transition: all 0.1s ease;
  -ms-transition: all 0.1s ease;
  -o-transition: all 0.1s ease;
  transition: all 0.1s ease;
  border-radius: 2px;
  border: 1px solid white;
}

.type-document:hover {
  -webkit-transition: all 0.1s ease;
  -moz-transition: all 0.1s ease;
  -ms-transition: all 0.1s ease;
  -o-transition: all 0.1s ease;
  transition: all 0.1s ease;
  border: 1px solid #848484;
}

.btn-overlay a {
  margin-right: 6px;
}

.f-i-t-d {
  display: block;
  position: relative;
  cursor: default;
  text-align: center;
  vertical-align: bottom;
}

.type-document:hover .f-i-icons {
  padding-bottom: 10px;
  transition: 0.2s;
}

.type-document-title {
  display: block;
  text-align: center;
  font-weight: bold;
}

.f-i-icons {
  display: block;
  text-align: center;
}

.f-i-icons .fa {
  color: #c5c5c5;
}

.f-i-icons a {
  padding: 2px;
  margin-right: 6px;
}

.f-i-icons a .fa:hover {
  color: black;
  cursor: pointer;
}

.doc-creator {
  display: inline-block;
  float: right;
  font-size: 10px;
  color: #5b86a9;
  font-weight: 600;
  overflow: hidden !important;
  text-overflow: ellipsis;
  width: 42%;
  white-space: nowrap;
  text-transform: uppercase;
}

.type-document:hover .btn-overlay {
  display: block;
}

.btn-overlay {
  position: absolute;
  display: none;
  width: 100%;
  height: 25px;
  top: 5px;
  text-align: right;
}

a i.f5 {
  padding-left: 5px;
  color: #c7c7c7;
}

a i.f5:hover {
  background: white;
  color: #03A9F4;
}

.filetype {
  font-size: 88px !important;
  color: #e4e4e4;
  margin-top: 39px;
}

.ftimes-d {
  padding-left: 6px !important;
  padding-right: 6px !important;
}

.whatfolder {
  position: relative;
  top: -1px;
  font-size: 13px;
}

.f-x {
  font-style: normal;
  font-size: 10px;
  color: #03A9F4;
}

.f-x:hover {
  color: black;
  cursor: pointer;
}

.whatuser {
  font-size: 13px;
  position: relative;
  top: -1px;
}

.whatdate {
  font-size: 13px;
  position: relative;
  top: -1px;
}

.hight_light_sorting {
  background: rgba(235, 246, 255, 0.41) !important;
  color: #3f8ac5 !important;
  font-weight: 600;
}

.open-mail {
  position: absolute;
  top: 9px;
  right: 11px;
  color: #2196F3;
  font-size: 13px;
}

.doc-folder {
  height: 33px;
  margin-bottom: 7px;
}

.doc-folder:hover {
  cursor: pointer;
}

.doc-folder:hover .folder-detail .fold1 {
  color: blue;
}

.doc-folder:focus {
  border: 1px solid red !important;
}

.folder-icon {
  padding: 12px;
  float: left;
  padding-top: 0;
  font-size: 15px;
  margin-top: 4px;
  color: #868686;
}

.folder-options {
  display: none;
  position: absolute;
  right: 16px;
  width: 61px;
  top: 5px;
  background: #ffffff;
}

.folder-options a {
  margin-right: 0;
  font-size: 13px;
}

.doc-folder:hover .folder-options {
  display: block;
}

.shw-more-op {
  padding: 14px;
  margin-top: 2px;
}

.folder-detail {
  float: left;
  margin-top: 6px;
  position: absolute;
  left: 40px;
}

.fold1:hover {
  text-decoration: underline;
}

.fold1:nth-child(1) {
  color: #757575;
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  font-weight: bold;
  font-size: 11px;
}

.doc-folder:hover .fold1:nth-child(1) {
  color: #03A9F4;
}

.doc-folder:active .fold1:nth-child(1) {
  color: gray;
}

.m-1-r {
  left: -127px;
  top: -11px;
  border-radius: 0;
  border: 0;
}

.m-1-r ul li a {
  color: black !important;
}

a i.f6 {
  padding: 5px;
  color: #03A9F4;
}

a i.f6:hover {
  color: #03A9F4;
  cursor: pointer;
}

.m-r-i {
  position: absolute;
  top: 66px;
  left: -90px;
}

.accordion-inner {
  margin-top: 4px;
  padding-top: 14px;
  padding-bottom: 39px;
  border: 1px solid #e0e0e0;
  border-radius: 2px;
}

.accordion-heading {
  border: 1px solid #e3e3e3;
  background: #f7f7f7;
  border-radius: 2px;
}

.accordion-heading a:hover {
  box-shadow: none;
  border-radius: 0;
}

.fol-10 {
  color: #2196F3;
  padding-bottom: 11px;
  background: white;
  margin-top: 0;
  padding: 7px;
  border-radius: 3px;
  border: 1px solid #d0d1d4;
}

.table>tbody>tr {
  border-bottom: 1px solid #ececec;
  background-color: white !important;
}

aside:after {
  content: "\f08e";
  font-family: "FontAwesome";
  position: absolute;
  right: 1px;
  color: #c3c3c3;
  top: 1px;
  background: white;
  padding: 4px 8px;
  height: 100%;
}

.readonly aside:after {
  background: #f4f7f7;
}

.readonly {
  background: #f4f7f7;
}

.add-image {
  display: inline-block;
  float: right;
  margin-top: -17px;
}

.place-gbp2 {
  position: relative;
  top: -22px;
  right: -80px;
}

.a-cp {
  font-weight: 600 !important;
  text-transform: uppercase;
}

fieldset.scheduler-border {
  border: 1px groove #ddd !important;
  padding: 0 1.4em 1.4em 1.4em !important;
  margin: 0 0 1.5em 0 !important;
  -webkit-box-shadow: 0 0 0 0 #000;
  box-shadow: 0 0 0 0 #000;
}

legend.scheduler-border {
  font-size: 1.2em !important;
  font-weight: bold !important;
  text-align: left !important;
  width: auto;
  padding: 0 10px;
  border-bottom: none;
}

.s-r-1 {
  height: 46px;
  padding-top: 8px;
  padding-left: 0PX;
  padding-bottom: 12px;
}

.s-r-1:hover .in-t-1 {
  border: 1px solid black;
}

.re-rec {
  display: none;
}

.s-r-1:hover .re-rec {
  display: inline-block;
  padding: 4px;
  background: #fd8484;
  color: white;
  padding-left: 10px;
  padding-right: 10px;
  border-radius: 2px;
  cursor: pointer;
  margin-top: 1px;
  margin: 1px 71px;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.re-rec:hover {
  background: #ff5252 !important;
}

.setshow2::after {
  font-family: "FontAwesome";
  content: "\f111";
  color: #81d084;
  position: absolute;
  top: -9px;
  right: 30px;
  font-size: 9px;
}

.highlight-focus2 {
  border: 1px solid #bbbbbb;
  color: #888888;
  width: 68%;
}

.btn-2 {
  text-align: center;
  padding: 4px;
  border-radius: 2px;
  cursor: pointer;
}

.btn-icon i {
  color: #484848;
  font-size: 12px;
}

.btn-icon:hover {
  border: 1px solid #03A9F4 !important;
}

.btn-icon:hover i {
  color: #2196F3;
}

.h31 {
  height: 32px !important;
}

.mt15 {
  margin-top: 15px;
}

.control-label2 {
  padding-top: 7px !important;
  font-weight: 600 !important;
  color: #495459;
}

.place-gbp3 {
  color: #a5a5a5;
  top: 4px;
  position: absolute;
  right: 22px;
}

.pad15 {
  padding-left: 15px;
  padding-right: 15px;
}
 
.input-symbol span i {
    color: #a9a9a9;
    font-size: 12px;
    background: transparent;
    padding: 6px 2px 6px 3px;
}
.form-control[disabled] .input-symbol span i , .form-control[readonly] .input-symbol span i {
    background: #f4f7f7;
}

.setshow3 i {
  color: #51b551;
}

.ipb {
  margin-top: 14px !important;
}

.control-label {
  font-weight: 600;
  color: #353535;
}

.in-t-1:hover .input-symbol span {
  color: #72bbea;
}

.padb0 {
  padding-bottom: 0 !important;
}

.show_password {
position: absolute;
    top: 5px;
    right: 25px;
    color: #cacaca;
    cursor: pointer;
    font-size: 12px;
}
.show_password:hover {
  color: gray;
}

.bit {
  display: block;
  padding-left: 13px;
  padding-bottom: 8px;
  font-size: 13px;
}

.sender-subject {
  width: 157px;
  font-size: 11px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #949494;
  position: relative;
  top: -3px;
}

.sender-name-yo span {
  background: cornflowerblue;
  color: white;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  text-align: center;
  display: inline-block;
  font-size: 12px;
  padding: 5px;
  vertical-align: middle;
  margin: 0 10px 0 0;
}

.search_e {
  margin-top: 7px;
  width: 260px;
  margin-left: 12px;
}

.i-89 {
  margin-top: 12px;
  /* height: 33.4px; */
  background: white;
  border: 0;
  border-radius: 2px;
  margin-left: -38px;
  padding-left: 10px;
  padding-right: 12px;
  color: #c5c5c5;
}

.i-89:hover {
  color: #333333;
}

.hb {
  height: 48px;
  box-shadow: 0 2px 7px 0 #d2d2d2;
}

a.iic {
  padding: 3px 8px;
  display: inline-block;
  margin-right: 19px;
  font-size: 14px;
  color: #bdbdbd;
}

a.iic:last-child {
  margin: 0;
}

a.iic.btn-group.open .dropdown-toggle {
  background: #333333;
  color: white;
  box-shadow: none;
}

a.iic:hover {
  cursor: pointer;
  color: #333333;
}

a.iic:hover i {
  -moz-transform: scale(1.2);
  -webkit-transform: scale(1.2);
  -o-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
}

.header-sub {
  padding: 4px 16px 0 9px;
  font-weight: 600;
  font-size: 14px;
}

.inbox-area {
  height: 451px;
  padding: 15px 15px 0 15px;
  overflow-x: hidden;
  overflow-y: hidden;
}

.inbox-area:hover {
  overflow-y: scroll;
}

.e-wi {
  position: fixed;
  height: 100%;
  width: 24%;
}

#iframe1 {
  display: block;
  border: none;
  height: 100vh;
  width: 104%;
}

.f-d {
  padding-right: 16px;
  font-size: 10px;
  color: #a7a7a7;
}

.f-d:hover {
  color: #3e3e3e;
}

a.attachments {
  background: #f7f7f7;
  border-radius: 17px;
  margin-right: 5px;
  padding: 2px 11px 2px 11px;
}

.action-btns {
  padding-top: 7px;
  padding-left: 15px;
  margin-top: -32px;
  margin-left: 143px;
}

.d-wf {
  position: fixed;
  right: 6px;
  left: 30%;
  height: 100%;
}

.r-p {
  box-shadow: none !important;
  border: 1px solid transparent !important;
  border-radius: 2px !important;
  width: 100% !important;
  padding-left: 10px !important;
  height: 34px;
}

.r-p:hover {
  border: 1px solid #3693cf !important;
}

.show-gh .s-a {
  display: block;
  text-align: right;
  font-size: 9px;
  width: 59px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #616161;
  font-weight: 600;
  margin-top: -6px;
}

.selected2 {
  color: red !important;
}

.iconofied {
  color: white;
  background: black;
  position: fixed;
  top: 51px;
  left: 0;
  min-height: 100%;
  width: 100%;
}

.collapse.in {
  height: auto !important;
}

.message-icons i .fa-star {
  color: #FF9800 !important;
}

.timeline-task:before {
  width: 2px;
  height: 74%;
  position: absolute;
  margin-left: -3px;
  top: 50px;
  background: #ececec;
  content: "";
  left: 26px;
}

.timeline-entry-container {
  background: #ffffff;
  margin-left: 34px;
  padding: 6px;
  margin-bottom: 5px;
  position: relative;
  border: 1px solid #e8e8e8;
  border-radius: 2px;
  height: 34px;
}

.timeline-entry-container:before {
  width: 16px;
  height: 16px;
  background: #3dbcff;
  border-radius: 50%;
  position: absolute;
  top: 32%;
  content: "";
  border: 4px #fff solid;
  left: -38px;
}

.timeline-entry-container:after {
  content: '';
  display: block;
  position: absolute;
  top: 12px;
  left: -5px;
  width: 10px;
  height: 10px;
  background: #ffffff;
  -moz-transform: rotate(-225deg);
  -webkit-transform: rotate(-225deg);
  -ms-transform: rotate(-225deg);
  border-right: 1px solid #eaeaea;
  border-bottom: 1px solid #eaeaea;
}

.timeline-entry-container span {
  position: absolute;
  right: 2px;
  color: #ff6c6c;
  border-radius: 10px;
  font-size: 9px;
  padding-right: 6px;
}

.timeline-entry-container p {
  margin: 0;
  color: #7d7d7d;
}

.timeline-entry-container p:hover {
  color: #2196F3;
  cursor: pointer;
}

.c-tabs-nav__link2 {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding: 12px;
  color: #a0a0a0;
  background-color: #ffffff;
  text-align: center;
  -webkit-transition: color 0.3s;
  transition: color 0.3s;
  position: relative;
}

.folder-name {
  position: relative;
  display: inline-block;
  top: -4px;
  margin-left: 9px;
}

.folder-name span {
  display: inline-block;
  text-align: center;
  position: absolute;
  right: -146px;
  top: 0;
  padding: 5px;
  border-radius: 36px;
  font-size: 10px;
  background: #F44336;
  color: white;
  width: 22px;
}

.compose-btn {
  display: block;
  padding: 6px;
  background: rgb(122, 188, 255);
  background: -moz-linear-gradient(top, rgba(122, 188, 255, 1) 0%, rgba(96, 171, 248, 1) 44%, rgba(64, 150, 238, 1) 100%);
  background: -webkit-linear-gradient(top, rgba(122, 188, 255, 1) 0%, rgba(96, 171, 248, 1) 44%, rgba(64, 150, 238, 1) 100%);
  background: linear-gradient(to bottom, rgba(122, 188, 255, 1) 0%, rgba(96, 171, 248, 1) 44%, rgba(64, 150, 238, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7abcff', endColorstr='#4096ee', GradientType=0);
  border: 0;
  color: white;
}

.compose-btn:hover {
  color: white;
}

.compose-btn:active {
  background: #2196F3;
  color: white;
}

.checkall {
  padding: 2px;
  background: #f1f1f1;
  width: 36px;
  text-align: center;
  border-radius: 2px;
  margin-top: 7px;
}

.p-a {
  text-align: left !important;
  width: 20%;
}

.p-b {
  text-align: left !important;
  color: #72aede;
}

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

.email-subject {
  white-space: nowrap;
}

.email-sent-date {
  color: black;
}

.email-table {
  width: 100%;
}

.email-table tbody tr {
  border-bottom: 1px solid whitesmoke;
}

.email-table tbody tr:hover {
  background: #f9f9f9 !important;
  cursor: pointer;
}

.email-table tbody tr:first-child {
  border-top: 1px solid whitesmoke;
}

.email-table tr td {
  height: 40px !important;
}

.more-options {
  display: inline-block;
}

.more-options a {
  display: inline-block;
  padding: 0;
  cursor: pointer;
}

.more-options a:hover i {
  color: #616161;
}

.more-options i {
  font-size: 15px;
  position: relative;
  top: 3px;
  margin-left: 4px;
  margin-right: 2px;
  color: #a7a7a7;
  border: 1px solid white;
  padding: 3px;
  border-radius: 3px;
  box-shadow: 0 1px 1px 1px #f1f1f1;
}

#showmoreemail {
  position: absolute;
  right: 28px;
  background: white;
  border: 1px solid #e8e8e8;
  width: 121px;
  border-radius: 4px;
}

#showmoreemail li a {
  font-size: 11px;
  padding-top: 0;
  padding-bottom: 0;
}

#showmoreemail:before {
  content: '';
  display: block;
  position: absolute;
  top: -6px;
  left: 82px;
  width: 10px;
  height: 10px;
  background: #ffffff;
  border-right: 1px solid #dadada;
  border-bottom: 1px solid #dadada;
  -moz-transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
  -ms-transform: rotate(-135deg);
}

.loggedin {
  cursor: pointer;
}

.favourite i:hover {
  color: orange;
}

.droplink {
  color: gray;
  cursor: pointer;
}

.drop1:before {
  content: '';
  display: block;
  position: absolute;
  top: -6px;
  right: 19%;
  width: 10px;
  height: 10px;
  background: #ffffff;
  border-right: 1px solid #dadada;
  border-bottom: 1px solid #dadada;
  -moz-transform: rotate(-45deg);
  -webkit-transform: rotate(225deg);
  -ms-transform: rotate(-45deg);
}

.drop2:before {
  content: '';
  display: block;
  position: absolute;
  top: -6px;
  left: 10px;
  width: 10px;
  height: 10px;
  background: #ffffff;
  border-right: 1px solid #dadada;
  border-bottom: 1px solid #dadada;
  -moz-transform: rotate(-45deg);
  -webkit-transform: rotate(225deg);
  -ms-transform: rotate(-45deg);
}

.show {
  display: block;
}

.myfolder {
  display: block;
  cursor: pointer;
}

.profile-sec {
  background-color: #6C84E5;
  background: url(//dmypbau5frl9g.cloudfront.net/elements_header_background.png), linear-gradient(to right, rgba(71, 114, 217, 1), rgba(0, 220, 175, 1));
  background-size: 300px 300px, auto;
  height: 46px;
  margin-left: -10px;
  margin-right: -10px;
  margin-top: -20px;
  border-radius: 2px;
  margin-bottom: 9px;
}

.userprofile {
  position: absolute;
  left: 78px;
  top: 21px;
  color: #60abf8;
  background: white;
  border-radius: 50%;
  font-size: 17px;
  padding: 10px;
  width: 44px;
  text-align: center;
  font-weight: 600;
  box-shadow: inset 0 1.5px 3px 0 rgba(0, 0, 0, .15), 0 1.5px 3px 0 rgba(0, 0, 0, .15);
  height: 43px;
  line-height: 23px;
}

.mymail {
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  margin-top: 28px;
  margin-bottom: 10px;
}

.fixed-left-div {
  position: fixed;
  width: inherit;
  left: 61px;
}

.emailsubject {
  font-size: 15px;
  border-bottom: 1px solid #ececec;
  padding-bottom: 18px;
  font-weight: bold;
  text-transform: capitalize;
  padding-top: 5px;
}

a.goback i {
  float: left;
  font-size: 22px;
  padding: 4px;
  margin-right: 13px;
  background: #f7f7f7;
  border-radius: 2px;
  color: #ababab;
  padding-left: 9px;
  padding-right: 11px;
}

a.goback i:hover {
  background: gray;
  color: white;
  cursor: pointer;
}

.print {
  display: inline-block;
  position: relative;
  top: -36px;
  right: -97%;
}

.print a i {
  color: #d4d4d4;
  font-size: 21px;
  margin-top: 2px;
  position: relative;
  right: -8px;
}

.print a i:hover {
  color: black;
  cursor: pointer;
}

.quick-icons a i {
  font-size: 13px;
  margin-right: 24px;
  opacity: 0.6;
}

.quick-icons a i:hover {
  cursor: pointer;
  opacity: 1;
}

.quick-icons a:nth-child(1) {
  color: #5dc8f9;
}

.quick-icons a:nth-child(2) {
  color: #fbbc5e;
}

.quick-icons a:nth-child(3) {
  color: #ff7878;
}

.quick-icons a:nth-child(4) {
  color: #98a8af;
}

.quick-icons {
  margin-top: -14px;
}

.mail-section {
  text-align: justify;
  margin-top: 17px;
  font-size: 13px;
}

.emailfrom {
  margin: 8px 0;
}

.newmessage {
  position: fixed;
  right: 16px;
  background: white;
  z-index: 3;
  bottom: 0;
  height: 400px;
  width: 542px;
  box-shadow: rgba(0, 0, 0, 0.2) 0 2px 6px;
}

.newmessage h5 {
  padding: 10px;
  color: white;
  font-size: 13px;
  font-weight: 600;
}

.newmessageheader {
  background: url(//dmypbau5frl9g.cloudfront.net/elements_header_background.png), linear-gradient(to right, rgb(0, 0, 0), rgb(111, 111, 111));
  background-size: 300px 300px, auto;
  height: 37px;
}

.closemessage i {
  font-size: 14px;
  color: white;
  margin: 10px 10px;
}

.mail-action {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 40px;
  background: #f9f9f9;
  right: 0;
  padding-top: 4px;
  padding-left: 9px;
  border-top: 1px solid #cfcfcf;
}

.sendbtn {
  padding: 6px;
  background: #4CAF50;
  border-radius: 2px;
  top: 7px;
  position: relative;
  color: white;
  padding-left: 13px;
  padding-right: 13px;
  left: -3px;
}

.input2 {
  border: 0 !important;
  width: 100%;
  padding-left: 50px !important;
  box-shadow: none !important;
  height: 33px;
}

.addnewfol {
  float: right;
  font-size: 17px;
  color: #2d2d2d;
  margin: 2px -2px;
  cursor: pointer;
}

.rmt-btn {
  padding: 3px;
  background: #acb7bf;
  padding-left: 10px;
  padding-right: 10px;
  border-radius: 2px;
  color: white;
}

.donut {
  display: inline-block;
  width: 16px;
  height: 16px;
  -webkit-border-radius: 100%;
  border-radius: 100%;
  border: 4px solid #acb7bf;
  position: relative;
  top: 2px;
  margin-right: 4px;
}

.donut-info {
  border-color: #03A9F4;
}

.donut-red {
  border-color: #F44336;
}

.donut-yellow {
  border-color: #FFC107;
}

.donut-blue {
  border-color: #337ab7;
}

.donut-lg {
  border-color: #00BCD4;
}

.donut-green {
  border-color: #4CAF50;
}

.event-clr li {
  margin-bottom: 5px;
}

.rmt-btn:hover {
  background: #868686;
  cursor: pointer;
}

.modal-footer .btn+.btn {
  margin-bottom: 0;
  margin-left: 2px !important;
}

.pad-l-r {
  padding-left: 3px;
  padding-right: 3px;
}

.control-label3 {
  font-weight: 600;
  margin-left: 8px;
}

.d-i {
  padding: 7px;
  background: #f9f9f9;
  display: inline-block;
  width: 124px;
  border: 1px;
  box-shadow: inset 0 0 1px rgb(210, 210, 210);
  border-radius: 2px;
}

.to {
  text-align: center;
  line-height: 32px;
}

.label2 {
  padding: 1px 2px 2.2px 5px;
  border-radius: 2px;
  margin-right: 10px;
  position: relative;
  top: 5px;
}

.idp {
  position: relative;
  top: 5px;
  left: -3px;
  color: white;
}

.hilight2 {
  color: #428bad !important;
  font-weight: bold !important;
}

.sprite {
  background-image: url(spritesheet.png);
  background-repeat: no-repeat;
  display: block;
}

.sprite-001-folder {
  width: 24px;
  height: 24px;
  background-position: -1px -1px;
}

.sprite-002-file {
  width: 24px;
  height: 24px;
  background-position: -27px -1px;
}

.file-view {
  background: white;
  width: 100%;
  height: 52px;
  border-radius: 5px;
  position: relative;
}

.file-icon {
  display: inline-block;
  margin-top: 15px;
}

.share-type {
  text-transform: uppercase;
  color: #9e9e9e;
  letter-spacing: 2px;
  font-size: 10px;
  position: absolute;
  bottom: 0;
  padding: 0;
  display: block;
  width: 144px;
  text-align: center;
  padding-bottom: 2px;
}

.file-area {
  position: absolute;
  left: 65px;
  top: 7px;
  height: 88%;
}

.file-name {
  margin-top: 9px;
  margin-left: -2px;
}

.more-optionss {
  position: absolute;
  top: 18px;
  right: 27px;
}

.more-optionss i {
  font-size: 16px;
  color: #cacaca;
  cursor: pointer;
}

.more-optionss i:hover {
  color: black;
}

.d-p {
  font-size: 10px;
}

.searchbar {
  background: white;
  display: inline-block;
  width: 100%;
  border-radius: 2px;
  padding-top: 6px;
  padding-bottom: 7px;
  border: 1px solid #dfe4ed;
}

.search-input {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid #eaeaea;
  border-radius: 2px;
  margin: 6px 4px;
  width: 56%;
  margin-left: -10px;
  padding-left: 41px !important;
  height: 36px;
}

.btn-search {
  padding: 7px;
  border: 1px solid #dcdcdc;
  background: white;
  border-radius: 2px;
  padding-left: 20px;
  padding-right: 20px;
}

ul.t-p-o li a {
  padding: 8px 3px;
  display: inline-block;
  color: gray;
  padding-right: 21px;
  margin-top: 6px;
}

.left-help li a {
  display: block;
  margin: 6px 0;
}

.add-in-crum {
  float: right;
  margin-top: -26px;
  padding: 2px;
  border-radius: 18px;
  width: 25px;
  text-align: center;
  border: 1px solid #eceff4;
  height: 25px;
  color: #ffffff;
  position: relative;
  display: block;
  background: #56CCF2;
  background: -webkit-linear-gradient(to left, #56CCF2, #2F80ED);
  background: linear-gradient(to left, #56CCF2, #2F80ED);
  font-size: 10px;
}

.show-more-ad {
  cursor: pointer;
  border: 1px solid #efefef;
  border-radius: 2px;
  color: #717171;
}

.show-more-ad:hover {
  border: 1px solid #b9b9b9;
  color: #585858;
  cursor: pointer;
}

.j-i {
  display: none;
  position: absolute;
  z-index: 3;
  right: -2px;
  width: 206px;
  padding: 6px;
  border-radius: 3px;
  top: -2px;
  background: rgb(255, 255, 255);
  box-shadow: 0 1px 4px 1px rgba(62, 62, 62, 0.12);
  border: 1px solid #d6d6d6;
  text-align: left;
  color: black;
}

.j-i ul {
  padding-left: 0 !important;
  font-size: 11px;
  padding-top: 4px !important;
  padding-bottom: 0 !important;
  display: inline-block;
  margin-left: 10px;
  margin-top: 5px;
  margin-right: 8px;
}

.j-i li a {
  display: block;
  margin-bottom: 3px;
}

.j-i li a:hover {
  color: #03A9F4;
  cursor: pointer;
}

.j-i b {
  border-bottom: 1px solid #efefef;
  display: block;
  padding-bottom: 4px;
  color: #03A9F4;
  text-align: center;
  font-size: 12px;
}

.add-in-crum:hover .j-i {
  display: block;
}

.crum2 {
  background: -webkit-linear-gradient(bottom left, #fc636b, #ff6d92 35%, #ffb900 100%);
  background: linear-gradient(to top right, #fc636b, #ff6d92 35%, #ffb900 100%);
}

.crum2:hover {
  background: #ef867e;
  cursor: pointer;
}

.pr0 {
  padding-right: 0;
}

.pb6 {
  padding-bottom: 6px;
}

.threeBars {
  color: white;
  position: absolute;
  left: 10px;
  padding: 6.5px;
  border-radius: 50%;
  text-align: center;
  width: 28px;
  height: 29px;
  top: 13px;
  font-size: 15px !important;
}

.hidesidebar {
  display: none;
}

.ui-datepicker-header {
  border-radius: 0;
  border: 0;
  background-color: #f1f1f1;
}

.ui-datepicker .ui-datepicker-buttonpane {
  margin: 0 !important;
  padding: 0 !important;
}

.ui-datepicker .ui-datepicker-buttonpane button {
  margin: 0 !important;
  font-weight: normal !important;
}

.ui-datepicker-calendar tr,
.ui-datepicker-calendar td,
.ui-datepicker-calendar tbody {
  border: 0 !important;
  padding: 0px 2px;
}

.ui-icon-circle-triangle-w {
  background-position: -97px -18px !important;
}

.ui-icon-circle-triangle-e {
  background-position: -33px -18px !important;
}

.fc-grid th {
  text-align: center;
  border: 0 !important;
}

.datetimepicker-days table thead tr th {
  background: none !important;
  border: 0 !important;
}

.fc-header tbody {
  border: 0 !important;
}

.quickadd {
  color: black;
  font-weight: 600;
  font-size: 12px;
  padding-left: 14px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  display: block;
  margin-bottom: -7px;
}

.dd-e .v-t {
  padding: 9px;
  width: 28px;
  text-align: center;
  border-radius: 50%;
}

.fa-edit:before,
.fa-pencil-square-o:before {
  content: "\f040" !important;
}

.trans-in {
  border: 0;
  background: none;
  padding-top: 6px;
}

.widget-body2 {
    background: #fff !important;
    padding: 10px !important;
    border-radius: 2px;
    box-shadow: 0 6px 8px rgba(102,119,136,.03), 0 1px 2px rgba(102,119,136,.3);
}

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

ul.dte span {
  display: block;
  font-size: 12px;
}

ul.dte span i {
  width: 22px;
  text-align: center;
}

ul.dte span:hover {
  color: #03A9F4;
  cursor: pointer;
}

ul.dte {
  padding: 14px !important;
  font-size: 12px;
  left: -128px;
  top: -59px;
  position: absolute;
  border: 0;
  border-radius: 2px;
}

.ib {
  display: inline-block;
}

.dte-ico:before {
  content: "\f141";
  font-family: "FontAwesome";
  position: absolute;
  right: 9px;
  top: 5px;
  font-style: normal !important;
  font-size: 14px;
  font-weight: normal;
  color: #b7b7b7;
}

.dte-btn {
  padding: 14px;
  position: relative;
  background: white;
  border: 1px solid #c7c7c7;
  border-radius: 2px;
  display: none;
  vertical-align: middle;
}

.dte-btn:hover {
  border: 1px solid #989898;
  box-shadow: 0px 0px 0px 1px #989898;
  transition: 0.2s;
}

.fa-calendar:before {
  content: "\f133" !important;
}

thead.fixit {
  display: table;
  table-layout: fixed;
  width: 100%;
}

tbody.fixit {
  display: block;
  max-height: 450px;
  overflow: auto;
  overflow: overlay;

}

.padr16 {
  padding-right: 24px !important;
}

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

tbody.fixit2 {
  display: block;
  max-height: 61vh;
  overflow: auto;
}

thead.fixit3 {
  display: table;
  table-layout: fixed;
  width: 100%;
}

tbody.fixit3 {
    display: block;
    height: 164px;
    overflow: auto;
    overflow: overlay;
}

/* tbody.fixit:hover {
  overflow-y: overlay;
} */

tbody.fixit tr,
tbody.fixit2 tr,
tbody.fixit3 tr {
  display: table;
  width: 100% !important;
  table-layout: fixed
}
tbody.fixit3 tr {
      cursor: default !important;
}
.modal-body tbody.fixit {
    display: block;
    max-height: 40vh !important;
    overflow: auto;
    overflow: overlay;
}

.pb0 {
  padding-bottom: 0;
}

.pagination>li>a,
.pagination>li>span {
  position: relative;
  float: left;
  padding: 6px 12px;
  margin-left: -1px;
  line-height: 1.42857143;
  color: #000000;
  text-decoration: none;
  background-color: #fff;
  border: 1px solid #ddd;
}

.modal-footer .pagination>li>a {
  font-size: 10px;
}

.comment-section {
  border-radius: 13px;
  position: relative;
  padding: 10px;
  padding-top: 0;
  padding-bottom: 33px;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.08);
}

.comment-section .form-control {
  background: white !important;
  border: 0 !important;
}

.comment-section:after {
  content: '';
  display: block;
  position: absolute;
  top: 77px;
  left: -10.3px;
  width: 18px;
  height: 18px;
  background: #ffffff;
  border-right: 1px solid #dddddd;
  border-bottom: 1px solid #dddddd;
  -moz-transform: rotate(-225deg);
  -webkit-transform: rotate(-225deg);
  -ms-transform: rotate(-225deg);
}

.posted {
  text-align: center;
  display: inline-block;
  background: white;
  margin-bottom: 10px;
  color: #2196F3;
}

.comment-title {
  display: inline-block;
}

.comment-title .form-control {
  border: 0 !important;
  font-size: 17px;
  margin-top: 5px;
  margin-left: 3px;
  background: white !important;
  color: #73b0d9;
}

.current-user {
  display: block;
  color: #5d5d5d;
  font-weight: 600;
}

.panel-title2 {
  margin-bottom: 24px;
  padding-left: 12px;
  margin-top: 10px;
}

.panel-title,
.panel-title2 {

  font-size: 19px;
  color: #4e575d;
  font-weight: 700;
  letter-spacing: 0.3px;
  display: none;
}

.panel-title {
  margin-top: 0;
  margin-bottom: 0;
}

thead {
  border: 0 !important;
}

.pagination>.active>a,
.pagination>.active>a:focus,
.pagination>.active>a:hover,
.pagination>.active>span,
.pagination>.active>span:focus,
.pagination>.active>span:hover {
  background: white;
  border-color: #e0e0e0;
  color: #03A9F4;
}

.pagination>li>a,
.pagination>li>span {
  color: black;
  text-decoration: none;
  background-color: #fff;
  border: 1px solid #ddd;
}

.pagination>li>a:focus,
.pagination>li>a:hover,
.pagination>li>span:focus,
.pagination>li>span:hover {
  color: #000000;
  background: #e6e6e6;
}

.file-holder {
  width: 136px;
  height: 85px;
  display: inline-block;
  margin-left: 14px;
  margin-bottom: 118px;
}

.ui-timepicker-table td {
  padding: 3.2px !important;
  border: 1px solid transparent;
}

.ui-datepicker thead tr th:first-child {
  border: 0 !important;
}

.bird {
  position: absolute;
  bottom: 6px;
  left: 8px;
}

.bird img {
  width: 71%;
}

.btn-collapo {
  margin-bottom: 27px;
  cursor: pointer;

  font-weight: bold;
  margin-left: 13px;
  color: #4e575d;
}

.btn-collapo:hover {
  cursor: pointer;
  color: #03a9f4;
}

.btn-collapo:focus {
  color: red !important;
}

.bubble-wrap {
  background-color: rgb(68, 68, 68);
  top: 0;
  left: 0;
  position: absolute;
  cursor: pointer;
  -webkit-transform: scale(1);
  -webkit-transition: all 0.3s ease-out;
  display: block;
  z-index: 2;
  padding: 20px;
  padding-bottom: 30px;
  padding-left: 19px;
  padding-top: 20px;
}

.bubble-wrap:hover {
  opacity: 1;
}

.bubble-wrap.active {
  display: none;
}

.bar {
  background-color: #ffffff;
  width: 15px;
  height: 1px;
  right: 14px;
  top: 21px;
}

.first {
  position: absolute;
  -webkit-transition: all 0.1s ease-out;
}

.second {
  margin-top: 5px;
  position: absolute;
  -webkit-transition: all 0.1s ease-out;
}

.third {
  margin-top: 10px;
  position: absolute;
  -webkit-transition: all 0.1s ease-out;
}

.first.active {
  margin-top: 10px;
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  -webkit-transition: all 0.1s ease-out;
  -webkit-transition-delay: .1s;
  background: black;
}

.second.active {
  opacity: 0;
  margin-top: 10px;
  -webkit-transition: all 0.1s ease-out;
  -webkit-transition-delay: .1s;
  background: black;
}

.third.active {
  margin-top: 10px;
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transition: all 0.1s ease-out;
  -webkit-transition-delay: .1s;
  background: black;
}

.SlideDownSM {
  top: 0;
  display: none;
  left: 0;
  position: fixed;
  width: 100%;
  height: 100%;
  padding: 20px;
  transition: top 300ms cubic-bezier(0.17, 0.04, 0.03, 0.94);
  overflow: hidden;
  box-sizing: border-box;
  background: white;
  z-index: 1;
}

.SlideDownSM .heading {
  font-size: 17px;
  margin-bottom: 7px;
  margin-left: 20px;
  border-bottom: 1px solid #e4e4e4;
  padding-bottom: 9px;
}

.SlideDownSM ul li a {
  display: block;
  color: #535c69;
  padding: 8px 21px 8px 21px;
  font-size: 13px;
}

.m-b-md {
  padding-top: 18px;
}

h1.line>span {
  padding: 0 25px;
  background-color: #fff;
  position: relative;
}


/*Line Style*/

.line:before {
  content: "";
  position: absolute;
  border-bottom: 1px solid #dedede;
  width: 94%;
  left: 4%;
  top: 42px;
}

.SlideDownSM a:hover {
  color: #ffffff;
  background: #03A9F4;
  border-radius: 20px;
}

.helptooltip {
  display: none;
}

.SlideDownSM a.linkclicked {
  color: #ffffff;
  background: #03A9F4;
  border-radius: 20px;
}

.SlideDownSM.acto {
  display: block !important;
}

@-webkit-keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}

.modal-body .nav-tabs {
    box-shadow: none;
    border: 1px solid #e0e0e0;
    padding: 3px !important;
    border-radius: 2px;
    white-space: nowrap;
    overflow-x: auto;
}
.modal-body .nav-tabs>li {
    display: inline-block;
    float: none;
}

/* .setshow4 {
  color: #4caf50 !important;
  margin-left: 13px;
} */

.ccbcc {
  position: absolute;
  right: 16px;
  top: 0;
  padding: 6px;
}

.ccbcc span {
  margin-left: 5px;
  color: #a2a2a2;
}

.ccbcc span:hover {
  cursor: pointer !important;
  text-decoration: underline !important;
  color: black;
}

.ngdialog.ngdialog-theme-default-custom-large .ngdialog-close:before {
  right: 10px !important;
  top: 10px !important;
  background: transparent !important;
}

.color-scheme a {
  display: inline-block;
  width: 20px !important;
  height: 20px !important;
  margin-right: 3px;
  border-radius: 2px;
}

.color-scheme a#themedefault {
  background: #333;
}

.color-scheme a#themeblue {
  background: #337AB7;
}

.color-scheme a#themegreen {
  background: #00abc0;
}

.color-scheme a#themeyellow {
  background: #d2a153;
}

.color-scheme a:hover {
  cursor: pointer;
  opacity: 0.5;
  transition: 0.2s;
}

.themedefauls {
  background: red;
}

.open .fa-angle-down {
  transform: rotate(180deg);
  transition: 0.2s;
}

.fa-angle-down {
  transition: 0.2s;
}

.task-card {
  background: white;
  padding: 15px;
  margin-bottom: 17px;
  box-sizing: border-box;
  border-radius: 2px;
  position: relative;
  height: 141px;
  transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}

.task-card:hover {
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
  transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
  cursor: pointer;
}

.task-card:hover .task-name {
  color: #2196F3;
}

.task-status {
  position: absolute;
  bottom: 11px;
  color: #2196F3;
  display: block;
  text-align: center;
  text-transform: uppercase;
  font-size: 10px;
  letter-spacing: 1px;
  font-weight: 600;
  width: 86%;
}

.redcolor {
  color: red;
}

.mytask {
  font-size: 16px;
  text-transform: capitalize;
  color: black;
  letter-spacing: 0.8px;
}

.task-name {
  color: black;
  margin-bottom: 8px;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 600;
  text-transform: capitalize;
}

.task-desp {
  color: #6d6d6d;
  height: 58px;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 12px;
}

.greencolor {
  color: green;
}

.greenborder {
  box-shadow: inset 0 2px 0 0 #4ace4a;
}

.redborder {
  box-shadow: inset 0 2px 0 0 #ff8989;
}

.yellowborder {
  box-shadow: inset 0 2px 0 0 #ffb124;
}

.yellowcolor {
  color: orange;
}

.blueborder {
  box-shadow: inset 0 2px 0 0 #2497f3;
}

small.info {
  line-height: 6px;
  font-weight: normal;
  margin-left: 5px;
  font-style: italic;
}

.despwidth3 {
  width: 133px !important;
}

.modal-email-from small {
  display: inline-block;
}

.modal-email-from {
  display: inline-block;
}

.modal-email-date {
  position: absolute;
  right: 33px;
  top: 13px;
  display: inline-block;
  font-size: 10px;
  text-align: right;
}

.modal-email-subject {
  display: block;
  font-weight: 600;
}

.modal-reply-message {
  padding: 15px;
  border-radius: 8px;
  margin-left: 100px;
  margin-top: 13px;
  background-color: #e1e9ee;
  overflow: hidden;
  color: #292b2b;
  font-size: 13px;
  position: relative;
  padding-bottom: 29px;
  text-align: justify;
}

.modal-reply-message .date {
  font-size: 10px;
  text-align: right;
  position: absolute;
  right: 16px;
  bottom: 4px;
  font-style: italic;
}

.modal-my-message {
  box-shadow: inset 0 0 0 2px #e1e9ee;
  padding: 15px;
  border-radius: 8px;
  font-size: 13px;
  color: #292b2b;
}

.modal-email-reply-icon {
  position: absolute;
  top: 42px;
  right: 12px;
  font-size: 11px;
  color: #4CAF50;
}

.moveto {
  left: -122px;
  top: 45px;
  border-radius: 2px;
}

ul.moveto li a {
  display: block;
  width: 100%;
}

.bdec {
  left: -46%;
  top: 30px;
  border-radius: 2px;
}

.bdec li a {
  font-size: 10px;
  text-transform: lowercase !important;
}

.moveto::before {
  content: '';
  display: block;
  position: absolute;
  top: -6px;
  right: 18px;
  width: 11px;
  height: 11px;
  background: #ffffff;
  border-right: 1px solid #dddddd;
  border-bottom: 1px solid #dfdfdf;
  -moz-transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
  -ms-transform: rotate(-135deg);
}

.filterby {
  padding: 10px;
  border-bottom: 1px solid #d8d8d8;
  color: black;
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiP…dpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==);
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fdfefe), color-stop(100%, #f6f7f8));
  background: -webkit-linear-gradient(#fdfefe, #f6f7f8);
  background: -webkit-linear-gradient(#fdfefe, #f6f7f8);
  background: linear-gradient(#fdfefe, #f6f7f8)
}

ul.email-cat {
  padding-top: 0 !important;
  padding-left: 9px !important;
  margin-top: 16px;
  border-left: 1px solid #dedede;
  margin-left: 25px;
  margin-bottom: 21px;
  padding-bottom: 0 !important
}

.bdec::before {
  content: '';
  display: block;
  position: absolute;
  top: -6px;
  left: 18px;
  width: 11px;
  height: 11px;
  background: #ffffff;
  border-right: 1px solid #cfcfcf;
  border-bottom: 1px solid #d9d9d9;
  -moz-transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
  -ms-transform: rotate(-135deg);
}

ul.email-cat li {
  margin-bottom: 14px;
}

ul.email-cat li a {
  color: black;
  position: relative;
  top: -2px;
}

ul.email-cat li a:hover {
  color: #03A9F4;
  cursor: pointer;
  padding-left: 3px;
}

ul.email-cat li a i {
  width: 23px;
  text-align: center;
  color: #798894;
}

.loggedinass {
  color: black;
  font-weight: normal;
  padding-bottom: 2px;
  padding-top: 7px;
  width: 92%;
  display: block;
  margin: 18px auto;
  margin-top: -6px;
  border: 1px solid #e6e6e6;
  border-radius: 2px;
}

.loggedinassname {
  color: black;
  cursor: pointer;
  position: relative;
  top: -3px;
  display: block;
  font-weight: bold;
}

.smart-folder {
  font-weight: normal;
  position: relative;
  top: -2px;
  color: black;
}

.mail-counter {
  color: #ff0e0e;
  margin-left: 44px;
  font-size: 10px;
  font-weight: bold;
}

.new-email {
  padding: 6px;
  background: #03A9F4;
  color: white;
  width: 92%;
  text-align: center;
  display: block;
  margin: 16px auto;
  border-radius: 2px;
  margin-bottom: 26px;
}

.new-email:hover {
  background: #4dc8ff;
  color: white;
  cursor: pointer;
}

.incoming-mail {
  border-bottom: 1px solid #d2d2d2;
  padding: 10px;
}

.incoming-mail:hover {
  background: #f7f7f7;
  cursor: pointer;
}

.incoming-sender-name {
  font-weight: bold;
  color: black;
  font-size: 13px;
  display: inline-block;
}

.incoming-subject {
  font-weight: bold;
  color: #636363;
  display: block;
  position: relative;
  top: 1px;
}

.mail-part {
  color: black;
  text-overflow: ellipsis;
  width: 256px;
  overflow: hidden;
  white-space: nowrap;
}

.email-area-scroll {
  position: fixed;
  height: 80%;
  overflow: auto;
  width: 22.1%;
}

.incoming-date {
  display: inline-block;
  float: right;
  color: #5d5d5d;
  font-size: 11px;
  font-weight: bold;
  margin-top: -17px;
}

.options-d-a-f {
  display: none;
  float: right;
}

.incoming-mail:hover .options-d-a-f {
  display: inline-block;
}

.options-d-a-f i {
  margin-left: 5px;
  color: #8a8a8a;
  cursor: pointer;
}

.options-d-a-f .fa-flag:hover {
  color: #f35555;
}

.options-d-a-f .fa-archive:hover {
  color: #59a259;
}

.options-d-a-f .fa-trash:hover {
  color: #f35555;
}

.options-d-a-f i:hover {
  transform: scale(1.3);
}

.open-incoming-message-subject {
  font-size: 16px;
  border-bottom: 1px solid gainsboro;
  padding: 10px;
  position: relative;
  font-weight: bold;
  color: black;
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiP…dpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==);
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fdfefe), color-stop(100%, #f6f7f8));
  background: -webkit-linear-gradient(#fdfefe, #f6f7f8);
  background: -webkit-linear-gradient(#fdfefe, #f6f7f8);
  background: linear-gradient(#fdfefe, #f6f7f8)
}

.open-incoming-message-options {
  position: absolute;
  top: 2px;
  right: 2px;
}

.open-incoming-message-options a i {
  font-size: 26px;
  text-align: center;
  color: #c3c3c3;
}

.open-incoming-message-options a:hover i {
  color: black;
}

.open-incoming-message-options a:hover {
  cursor: pointer;
}

.open-incoming-message-options a {
  padding: 5px;
  display: block;
  float: left;
  margin-right: 8px;
  padding-left: 7px;
  padding-right: 7px;
  border-radius: 2px;
}

.incoming-sender-detail {
  font-weight: bold;
}

.incoming-message-detail {
  padding: 12px;
}

.incoming-mail-time {
  color: gray;
}

.incoming-mail-to {
  color: #dc5d54;
}

.incoming-fullmail {
  border-top: 1px solid #dbdbdb;
  margin-bottom: 10px;
  padding: 12px;
}

.searchInEmail {
  position: relative;
}

.advanceSearch {
  position: absolute;
  left: 8px;
  color: #a5a5a5;
  top: 6px;
}

.InsideadvanceSearch {
  position: relative;
  margin-bottom: 4px;
}

.InsideadvanceSearch .fromtosubject {
  position: absolute;
  left: 6px;
  top: 5px;
  font-size: 10px;
  font-weight: bold;
}

.thissearch {
  width: 100%;
  padding: 10px !important;
  border-radius: 2px;
  top: 38px;
  left: -2px;
}

.thissearch::before {
  content: '';
  display: block;
  position: absolute;
  top: -6px;
  left: 18px;
  width: 11px;
  height: 11px;
  background: #ffffff;
  border-right: 1px solid #d3d4d5;
  border-bottom: 1px solid #d3d4d5;
  -moz-transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
  -ms-transform: rotate(-135deg);
}

.InsideadvanceSearch input[type="text"] {
  width: 100% !important;
  padding-left: 50px !important;
  font-size: 10px !important;
  border: 0 !important;
  box-shadow: none !important;
}

.advanceSearch:hover i {
  color: black;
  cursor: pointer;
}

.thissearch h5 {
  padding-left: 5px;
  font-weight: bold;
  font-size: 12px;
  color: #8a8a8a;
}

.addAFolder {
  margin-right: 2px;
  position: relative;
  top: -1px;
  right: 26px;
  color: #c3c3c3;
}

.addAFolder:hover {
  color: black;
  cursor: pointer;
}

.moveto h6 {
  padding-left: 13px;
  font-weight: bold;
  font-size: 12px;
  color: #8a8a8a;
}

.bdec h6 {
  padding-left: 13px;
  font-weight: bold;
  font-size: 12px;
  color: #8a8a8a;
}

.modal-email-to {
  display: inline-block;
  margin-left: 15px;
}

#emailsList {
  font-weight: 600;
  margin-bottom: 22px;
}

.list-grid a {
  display: inline-block;
  padding: 5px;
  background: white;
  font-size: 16px;
  margin-top: 4px;
  padding-left: 9px;
  padding-right: 9px;
  color: #cccccc;
  border-radius: 2px;
  border: 1px solid;
}

.list-grid a:hover {
  color: #9c9c9c;
  cursor: pointer;
}

#btn-grid .activess i {
  color: black !important;
}

hr.h5a {
  display: inline-block;
  width: 100%;
  border-color: #b1b1b1;
  margin-top: 4px;
  margin-bottom: 2px;
}

.nobo {
  border: 1px solid white !important;
}

.attach {
  padding: 5px;
  display: block;
  padding-left: 10px;
  padding-right: 10px;
  margin-left: 10px;
}

.attach:hover {
  cursor: pointer;
}

.attached-files {
  display: inline-block;
  padding: 2px;
  background: #f3f3f3;
  padding-left: 12px;
  padding-right: 13px;
  border-radius: 20px;
  margin-left: 5px;
}

.attached-files:hover {
  background: #eaeaea;
}

.del-attach {
  padding: 4px;
  color: gray;
  margin-left: 4px;
  display: inline-block;
}

.del-attach:hover {
  cursor: pointer;
  color: black;
}

.attached-files {
  display: inline-block;
  padding: 2px;
  background: #f3f3f3;
  padding-left: 12px;
  padding-right: 13px;
  border-radius: 20px;
  margin-left: 5px;
  font-size: 10px;
  width: 114px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: bottom;
}

.attached-files:hover {
  background: #eaeaea;
}

.del-attach {
  padding: 4px;
  color: gray;
  margin-left: 4px;
  display: inline-block;
}

.del-attach:hover {
  cursor: pointer;
  color: black;
}

.hrt {
  height: 1px;
  background: #dedede;
  margin-bottom: 6px;
  margin-top: 6px;
}

.mod-tag {
  background: #67d1ff;
  border-radius: 3px 0 0 3px;
  color: #fff;
  padding: 3px;
  position: relative;
  display: inline-block;
  padding-left: 20px;
  padding-right: 15px;
  margin-top: 2px;
  font-size: 11px;
}

.mod-tag::before {
  background: #fff;
  border-radius: 10px;
  content: '';
  height: 6px;
  left: 9px;
  position: absolute;
  width: 6px;
  top: 10px;
}

.mod-tag::after {
  background: #fff;
  border-bottom: 13px solid transparent;
  border-left: 10px solid #67d1ff;
  border-top: 13px solid transparent;
  content: '';
  position: absolute;
  right: 0;
  top: 0;
}

label.save-check {
  padding: 5px;
  padding-left: 7px;
  padding-right: 10px;
  border-radius: 2px;
  display: inline-block;
  text-align: center;
  border: 1px solid #cacaca;
  background: #f9f9f9;
  float: right;
}

label.save-check:hover {
  border: 1px solid gray;
  cursor: pointer;
}

.custwarning {
  border: 1px solid #ff0000 !important;
  color: #ff5b5b !important;
}

.custhiglisght,
.custwarning {
  padding: 3px 14px;
  margin-top: 7px;
  margin-right: 4px;
  border-radius: 3px;
  border: 1px solid #03A9F4;
  color: #03A9F4;
  float: right;
}

.custhiglisght:hover,
.custwarning:hover {
  opacity: 1;
  color: white;
  box-shadow: none;
  background: #03A9F4;
  cursor: pointer;
}

.gmlh {
  padding: 10px;
  display: block;
  background: white;
  margin-bottom: 10px;
  border: 1px solid #e6e6e6;
  position: relative;
  padding-left: 18px;
}

.gmlh:hover {
  cursor: pointer;
  border-color: #03a9f4;
}

.gmlho {
  background: white;
  padding: 10px;
  margin-bottom: 7px;
  border: 1px solid #e6e6e6;
  margin-top: -12px;
}

.int-mail-list .email-from {
  color: #4e88b7;
  margin-right: 5px;
}

.int-mail-list .email-subject {
  text-transform: capitalize;
}

.email-attachment span {
  position: relative;
  padding: 8px 12px;
  margin: 0em auto;
  color: #fff;
  background: #f5f5f5;
  margin-right: 5px;
  border-radius: 2px;
}

.email-attachment span a.attach12 {
  vertical-align: bottom;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 105px;
  display: inline-block;
  transition: all 0.2s linear;
}

.email-download {
  position: absolute;
  top: 0;
  left: 0;
  display: none;
  right: 0;
  border-radius: 2px;
  bottom: 0;
  background: #585858;
  transition: all 0.2s linear;
}

.downloadnview {
  text-align: center;
  margin-top: 8px;
}

.downloadnview a {
  color: white;
  padding-left: 8px;
  padding-right: 8px;
  text-align: center;
  padding: 4px;
  border-radius: 3px;
  transition: all 0.2s linear;
}

.downloadnview a:hover {
  background: #232323;
  cursor: pointer;
  transition: all 0.2s linear;
}

.email-attachment span:hover .email-download {
  display: block;
}

.email-attachment {
  margin-top: 6px;
  border-top: 1px solid #d8d8d8;
  padding-top: 14px;
  margin-left: 39px;
  position: relative;
}

.if-replied-icon {
  color: #359e35;
  padding: 0;
  border: 1px solid;
  border-radius: 3px;
  padding-left: 9px;
  padding-right: 10px;
  display: inline-block;
  font-size: 10px;
}

.if-attachment {
  transform: rotate(133deg);
  font-size: 19px;
  color: rgb(173, 173, 173);
}

.email-isent {
  padding: 23px;
  text-align: justify;
  color: black;
  letter-spacing: 0.6px;
  margin-top: 11px;
  margin-bottom: 20px;
  border-radius: 2px;
  position: relative;
  background: white;
  border-left: 2px solid #80d283;
}

.email-replied {
  padding: 12px;
  margin-right: 14px;
  text-align: justify;
}

.email-replied .name {
  font-size: 14px;
  margin-bottom: 5px;
  color: black;
  margin-top: 4px;
  font-weight: bold;
}

.email-replied .if-replied {
  color: #359e35;
  display: inline-block;
  font-size: 10px;
  padding: 0;
  border: 1px solid;
  border-radius: 4px;
  padding-left: 9px;
  padding-right: 10px;
  margin-left: 4px;
}

.email-replied .date {
  font-size: 10px;
  color: #717171;
  margin-top: -6px;
  margin-bottom: 10px;
}

.email-replied .attachments span {
  padding: 5px 11px;
  box-shadow: 0 0 1px rgba(0, 0, 0, .11), 0 1px 2px rgba(0, 0, 0, .22);
  background: #f7f7f7;
  margin-top: 1px;
  display: inline-block;
  font-size: 10px;
  position: relative;
  padding-left: 18px;
  margin-right: 6px;
}

.email-replied .attachments span::before {
  font-family: "FontAwesome";
  position: absolute;
  content: "\f0c6";
  left: 6px;
}

.email-replied .attachments span:hover {
  box-shadow: 0 0 3px rgba(0, 0, 0, .13), 0 3px 6px rgba(0, 0, 0, .26);
  cursor: pointer;
}

.email-replied .attachments {
  margin-top: 12px;
}

.attachname {
  display: inline-block;
  font-weight: bold;
  margin-right: 12px;
}

.email-date {
  margin-right: 12px;
  position: absolute;
  top: 21px;
  right: 9px;
}

.email-to {
  color: black;
  display: block;
  float: left;
}

hr.hu9 {
  margin-left: 10px;
  margin-bottom: 4px;
  margin-top: 5px;
  margin-right: 10px;
}

.email-received {
  box-shadow: inset 0 2px 0 0 #59ce59;
}

.checkAllbtn,
.btn-refresh {
  padding: 5px;
  background: white;
  padding-left: 13px;
  padding-right: 14px;
  border: 1px solid #d8d8d8;
  border-radius: 2px;
  margin: 0;
  padding-bottom: 7px;
}

tr.EmailList {
  background: white;
  border-bottom: 1px solid #eaeaea;
}

tr.EmailList:hover {
  cursor: pointer;
  box-shadow: inset 3px 0 0 0 #03a9f4;
}

tr.EmailList td {
  padding: 10px;
  vertical-align: middle;
}

.EmailTable {
  width: 100%;
  height: auto;
  border-collapse: collapse;
}

.short-sent-message {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 289px;
  color: gray;
  position: relative;
  top: 1px;
  margin-top: -6px;
  vertical-align: bottom;
}

.showmail {
  background: rgb(255, 255, 255);
  position: fixed;
  top: 57px;
  left: 344px;
  right: 0;
  height: 100%;
  box-shadow: rgb(189, 189, 189) -3px 1px 33px 1px;
}

.email-box {
  margin-top: -21px;
}

.email-box-subject {
  padding: 6px 0 10px;
  text-align: justify;
  color: #525252;
  font-size: 18px;
  letter-spacing: 1.3px;
  text-transform: capitalize;
  font-weight: bold;
}

.email-avatar {
  display: inline-block;
}

.email-box-from {
  display: inline-block;
  margin-left: 12px;
}

.actual-mail {
  margin: 16px 0 19px 40px;
}

.actual-mail blockquote {
  padding: 10px 20px;
  margin: 0 0 20px;
  font-size: 12px;
  background: #f9f9f9;
  border-radius: 2px;
  border: 0;
  font-family: Arial !important;
  color: #6b6b6b;
}

.frm-date {
  display: inline-block;
  font-size: 12px;
  color: black;
}

.frm-attach {
  display: inline-block;
  font-size: 12px;
  color: #1d1d1d;
  margin-right: 17px;
}

.frm-attach .fa-paperclip {
  transform: rotate(133deg);
  font-size: 17px;
}

.rec-if-replied {
  display: inline-block;
  font-size: 10px;
  margin-right: 17px;
  padding: 0 6px;
  border: 1px solid;
  color: green;
  border-radius: 4px;
}

.dateandattach {
  float: right;
}

.email-box .ta-scroll-window.form-control {
  min-height: 205px;
}

.email-box .ta-scroll-window>.ta-bind {
  min-height: 203px;
}

.replyagain {
  padding: 13px;
  border: 1px solid gainsboro;
  border-radius: 2px;
}

.indirect-hidden {
  visibility: hidden !important;
}

.b-n {
  font-size: 18px;
  color: #6f6f6f;
  position: relative;
  top: 2px;
  margin-left: 7px !important;
}

.note-list {
  display: none;
}

.note-editor ul li {
  list-style-type: disc;
}

.note-editor ol li {
  list-style-type: decimal;
}

.note-editor ul {
  padding-left: 40px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.note-editor .dropdown-fontsize li {
  list-style: none !important;
}

.note-editor .dropdown-fontsize {
height: 104px;
overflow-y: hidden;
overflow-y: auto;
}

.note-editing-area {
  padding-right: 0;
}

.note-editor.note-frame {
  border: 1px solid #d6d6d6;
  border-radius: 2px;
  transition: all 0.2s;
}

.note-editor .btn-default2:hover {
  border: 1px solid #7d7d7d;
  box-shadow: none;
  color: black !important;
}

.note-editor .dropdown-fontname li {
  list-style-type: none !important;
}

.note-color .dropdown-menu li {
  list-style-type: none !important;
}

.add-del-time {
  color: #616161 !important;
  padding: 4px;
  position: relative;
  top: -8px;
  right: -7px;
  background-color: #eff3f6;
  background-image: -webkit-linear-gradient(270deg, #fafbfc 0%, #eff3f6 90%);
  background-image: linear-gradient(-180deg, #fafbfc 0%, #eff3f6 90%);
  border-radius: 2px;
  border: 1px solid #cacaca;
  font-size: 11px;
  padding-left: 6px;
  padding-right: 6px;
}

.add-del-time:hover {
  border-color: gray;
  cursor: pointer;
}

.ui-timepicker-buttonpane {
  border: 0 !important;
  margin: 0 !important;
}

.email-to-many {
  text-overflow: ellipsis;
  width: 167px;
  overflow: hidden;
  white-space: nowrap;
  display: inline-block;
  vertical-align: bottom;
  margin-left: 8px;
}

.email-cc {
  margin-left: 40px;
}

.note-statusbar {
  display: none;
}

.replywitheditor {
  padding: 18px !important;
  border: 2px solid #c7c7c7 !important;
  margin-top: 17px;
  border-radius: 2px;
  background: white
}

.replytotitle {
  padding: 11px;
  border: 1px solid #d0d0d0;
  border-bottom: 0;
  margin-bottom: -2px;
}

.frm-attach a:hover,
.frm-attach a:hover {
  color: #2196F3;
  cursor: pointer;
}

.showAttachments span {
  display: inline-block;
  padding: 2px;
  background: #f3f3f3;
  padding-left: 12px;
  padding-right: 13px;
  border-radius: 20px;
  margin-left: 5px;
  font-size: 10px;
}

.discard {
  padding: 2px 5px;
  border: 1px solid #d8d8d8;
  border-radius: 2px;
  display: inline-block;
  color: #a0a0a0;
  font-size: 11px;
}

.me-sent {
  border-radius: 2px;
  position: relative;
  padding-top: 23px;
  border-left: 2px solid #78c5e8;
}

.me-sent::before {
  position: absolute;
  top: 67px;
  left: 29px;
  color: #a3d7ef;
  content: "\f061";
  font-family: "FontAwesome";
  font-size: 18px;
}

.me-reply::before {
  position: absolute;
  top: 67px;
  left: 29px;
  color: #a3e0a5;
  content: "\f060";
  font-family: "FontAwesome";
  font-size: 18px;
}

.ccandbcc a {
  color: gray
}

.ccandbcc a:hover {
  cursor: pointer;
  text-decoration: underline !important;
  color: black;
}

.email-date-rec {
  white-space: nowrap;
  overflow: hidden;
  vertical-align: bottom;
  width: 77px;
  text-overflow: ellipsis;
  float: right;
}

.savedraft {
  padding: 5px 10px;
  background: #f9f9f9;
  border-radius: 2px;
  border: 1px solid #cacaca;
  display: inline-block;
  cursor: pointer;
}

.s-11 {
  background: #f1f1f1;
  color: #8e8e8e;
  padding: 4px;
  margin-right: 4px;
  border-radius: 2px;
  border: 1px solid #d4d4d4;
}

.d12 {
  margin: 0;
  font-size: 19px;
  color: #565656;
  display: inline-block;
  position: relative;
  top: 3px;
  left: 4px;
}

.panel-default>.panel-heading {
  color: #333;
  background-color: #ffffff;
  border-color: #ddd;
  padding-top: 25px;
  /* display: none; */
}

.glue {
  background: black !important;
}

.limitdata {
  display: block;
  width: 122px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
  top: 4px;
}

table.ui-timepicker a.ui-state-default {
  padding: 4px !important;
}

.leftsidebar-container .modal-body .form-control:focus {
  border-color: black;
}
.width180 {
  width: 200px !important;
}
@-webkit-keyframes fadeinout {

  0%,
  100% {
    opacity: 0;
  }

  50% {
    opacity: 1;
  }
}

@keyframes fadeinout {

  0%,
  100% {
    opacity: 0;
  }

  50% {
    opacity: 1;
  }
}

.whirl:after {
  z-index: 2;
  content: "";
  position: absolute;
  top: 40%;
  left: 46%;
  background-image: url(loader.png) !important;
  background-repeat: no-repeat;
  height: 136px;
  width: 165px;
  display: block;
  margin: 0 auto;
  background-size: 40px 40px;
  -webkit-animation: flickerAnimation 1s infinite;
  -moz-animation: flickerAnimation 1s infinite;
  -o-animation: flickerAnimation 1s infinite;
  animation: flickerAnimation 1s infinite;
}
.text-bold td,.text-bold td span {
  font-weight: bold !important;
}
.ui-timepicker-now {
  color: #03A9F4 !important;
}

.ui-timepicker-close {
  color: rgba(244, 67, 54, 0.58) !important;
}

.ui-timepicker-deselect {
  color: #a5a5a5 !important;
}

.ui-timepicker-hours .ui-timepicker-title {
  background: #f7f7f7 !important;
}

.ui-timepicker-minutes .ui-timepicker-title {
  background: #f7f7f7 !important;
}

#ui-timepicker-div {
  padding: 0.2em;
  border: 1px solid #cacaca;
  background: white;
}

.parsley-error:hover,
.parsley-error:focus {
  border-color: red !important;
}

.fwn {
  font-weight: normal;
  display: block;
  padding-top: 5px;
  color: #404040;
}

.padr6 {
  padding-right: 3px;
}

.padl6 {
  padding-left: 3px;
}

.panel-info {
  border: 1px solid #e5e5e5;
  min-height: 29px;
  white-space: nowrap;
  cursor: pointer;
  overflow: hidden;
  border-radius: 2px;
}
.tooltips_clsshilight {
  color: #2196F3 !important;
}
/* .tooltips_clsshilight:hover {
  text-decoration: underline;
} */

.margin-bottomreport {
      margin-bottom: 13px;
}
.pi2 {
  white-space: normal;
  height: 29px;
}
.recAddCostExist i {
    color: #4ead52 !important;
}
.panel-info .panel-body {
    padding: 3px 6px;
    height: 27px;
}

:focus {
  outline: 0 !important;
}

input[type='checkbox']:focus,
input[type='radio']:focus {
  outline: 1px solid black !important;
}

readonly {
  background: #fafbfb;
}

.caret {
  color: #b3b3b3;
}

.ngdialog-overlay {
  background: none;
}

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

.ui-select-container .btn {
  padding: 6px 6px !important;
  margin-left: 0;
}

.pl0 {
  padding-left: 0;
}

.mb19 {
  margin-bottom: -7px;
}

.setup-heading {
  padding: 0px 20px !important;
}

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

tbody {
  background: white;
}

.warning-primary {
  position: absolute;
  top: 8px;
  right: 29px;
  color: orange;
  font-weight: bold;
  padding: 2px;
}

input[type=search] {
    padding-left: 6px !important;
    font-size: 11px;
    width: 100% !important;
    -webkit-appearance: textfield;
    -moz-box-sizing: border-box !important;
    -webkit-box-sizing: border-box !important;
    box-sizing: border-box !important;
}

.dtb {
  padding: 2px 14px 10px 2px;
  border-radius: 2px;
  box-shadow: 0px 1px 13px 0px #e2e2e2;
}

.dtl {
  font-size: 15px;
  text-align: center;
  margin-top: -20px;
  background: white;
  width: 155px;
  margin: 0 auto;
  display: block;
  position: relative;
  top: -16px;
}

.adj-btn {
  width: 14%;
  float: right;
}

.adj-field {
  width: 52.6%;
}

.d-wi2 {
  position: fixed;
  width: 350px;
  padding: 14px 18px;
  left: 41px;
  float: left;
  top: 64px;
  bottom: 0px;
  overflow: auto;
}

.d-wi2:hover select {
  background-image: url(https://image.ibb.co/dfEnfw/arrowdown.png) !important;
}

.d-wi2 select {
  background-color: transparent;
  border: 0;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: bold;
  color: #6b6b6b;
  background-image: none !important;
}

.d-wi3 {
  position: fixed;
  height: 100%;
  padding: 10px 20px;
  background: white;
  top: 52px;
  right: 0;
  left: 386px;
  bottom: 0;
  overflow: auto;
}

.d-wi4 {
  position: fixed;
  overflow: auto;
  bottom: 0;
  top: 150px;
  width: 313px;
}

.no-folder-msg {
  margin-left: 19px;
  padding: 11px;
  padding-top: 0px;
  text-shadow: 0 1px 0 #fff;
  font-size: 45px;
  text-align: center;
  color: #a9a9a9;
  position: fixed;
  top: 45%;
  left: 34%;
}

.no-folder-msg i {
  text-shadow: 0 1px 0 #fff;
  font-size: 45px;
}

.doc-header {
  padding: 12px 7px 9px 10px;
  margin: -5px -10px 14px;
}

.doc-header h5 {
  font-size: 15px;
  font-weight: bold;
  color: black;
  position: relative;
  top: -5px;
}

.folder-scroll {
  position: fixed;
  width: 17.6%;
  overflow-x: hidden;
  overflow-y: auto;
  bottom: 0px;
  top: 155px;
}

.scroller:hover {
  visibility: visible !important;
}

.f2 {
  float: left;
  overflow: auto;
  height: 100%;
  position: fixed;
  top: 156px;
  width: 76%;
}

.scrolhere {
  float: left;
  overflow: auto;
  height: 100%;
  position: fixed;
  top: 161px;
  width: 76%;
}

.doc-created-date {
  position: absolute;
  right: 0px;
  top: 16px;
}

.ssg {
  position: fixed;
  overflow-y: auto;
  width: 17.9%;
  bottom: 0px;
  top: 144px;
}

.contact-names:hover {
  color: #03A9F4;
}

.contact-names {
  text-transform: capitalize;
  margin-bottom: 7px !important;
  display: block;
  color: #7b7b7b;
  font-size: 11px;
}

.show-scroll {
  overflow-x: hidden;
  bottom: 0px;
  top: 196px;
  position: fixed;
  overflow-y: auto;
}

.ui-select-search {
  width: 100% !important;
  padding: 9px !important;
  padding-top: 8px !important;
}

.activity-area {
  padding: 16px 10px 20px 10px;
  left: 41px;
  position: absolute;
  right: 0;
  top: 51px;
  z-index: 88;
  background: white;
  box-shadow: 0 2px 0 0 rgba(50, 70, 90, .05)
}

.editDashboard {
  position: absolute;
  text-align: center;
  z-index: 9;
  top: 70px;
  left: 17px;
  padding: 1px 8px;
  font-size: 10px;
  color: #03A9F4;
}

.affix2 {
  right: 0;
  bottom: 0;
  padding: 12px 26px;
  background: white;
  z-index: 1 !important;
  box-shadow: 1px 1px 13px 1px rgba(0, 0, 0, 0.23);
  left: 42px;
  text-align: center;
  position: fixed;
}

.activity-area .widget {
  height: 58px;
  text-align: center;
  padding: 4px 2px 2px 2px;
  border: 1px solid #7bc9f1;
  position: relative;
}

.activity-area .widget:hover {
  background: #7bcaf1;
}

.activity-area .widget:hover .count_top,
.activity-area .widget:hover .count {
  color: white;
}

.fixdiv {
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23) !important;
  transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
  position: fixed;
}

.highlightdiv {
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23) !important;
  transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
  border: 0 !important;
  opacity: 0.5;
}

.highlightdiv:hover {
  opacity: 1;
}

.activity-area .widget i {
  padding: 4px 5px;
  position: absolute;
  background: #f18484;
  text-align: center;
  border-radius: 23px;
  color: white;
  font-size: 8px;
  top: -8px;
  right: -6px;
}

.activity-area .widget i:hover {
  background: red;
  cursor: pointer;
}

.add-box-widget {
  height: 58px;
  text-align: center;
  padding: 4px 2px 2px 2px;
  border: 1px solid #efefef;
  line-height: 41px;
  font-size: 14px;
  color: #c3c3c3;
  border-radius: 2px !important;
}

.add-box-widget:hover {
  cursor: pointer;
  color: gray;
  border-color: gray;
}

.widget .count_top {
  text-transform: uppercase;
  font-size: 9px;
  font-weight: bold;
  color: #6cb9dc;
}

.widget .count {
  font-size: 22px;
  font-weight: bold;
  color: #067fb5;
}

.welcome-message {
  font-size: 17px;
  color: #424242;
}

.activity-list {
  font-size: 21px;
  color: #000000;
}

.activity-list li {
  border-bottom: 1px solid #e7eaec;
  padding: 7px 0;
  color: #6a6d6f;
  font-size: 10px;
  font-weight: bold;
}

.activity-list .counter {
  padding: 3px 8px;
  background: #ababab;
  margin-right: 7px;
  display: inline;
  border-radius: 15PX;
  color: white;
  font-weight: bold;
  font-size: 9px;
}

.activity-area .company-name {
  color: #565656;
  padding: 2px 13px;
  display: inline;
  margin-top: 7px;
  float: left;
  border: 1px solid #d4d4d4;
  border-radius: 3px;
}

/* .chart {
  display: table;
  table-layout: fixed;
  width: 100%;
  max-width: 700px;
  height: 200px;
  background-image: linear-gradient(to top, rgba(177, 177, 177, 0.1) 2%, rgba(0, 0, 0, 0) 2%);
  background-size: 100% 50px;
  background-position: left top;
  margin-top: 21px;
}
.chart li {
  position: relative;
  display: table-cell;
  vertical-align: bottom;
  height: 200px;
}
.chart span {
  margin: 0 1em;
  display: block;
  background: rgba(209, 236, 250, 0.75);
  animation: draw 1s ease-in-out;
}
.chart span:before {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  padding: 5px 1em 0;
  display: block;
  text-align: center;
  content: attr(title);
  word-wrap: break-word;
} */
.s-box {
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #ccced2;
    margin-bottom: 11px;
}


.s-title {
  color: #444444;
  margin-bottom: 0;
  padding: 15px 15px 7px;
  min-height: 48px;
  border-bottom: 1px solid #e7eaec;
  font-size: 14px;
  font-weight: bold;
  position: relative;
}

.s-heading {
  background: #36D1DC;
  /* fallback for old browsers */

  background: -webkit-linear-gradient(to right, #5B86E5, #36D1DC);
  /* Chrome 10-25, Safari 5.1-6 */

  background: linear-gradient(to right, #5B86E5, #36D1DC);
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.s-heading h3,
.s-heading small {
  color: white !important;
}

.s-content {
  padding: 15px 20px 20px 20px;
}

.s-content h3 {
  font-size: 19px;
  color: #6b7980;
}

.timeline-item .date {
  text-align: right;
  width: 110px;
  position: relative;
  padding-top: 30px;
}

.timeline-item .content {
  border-left: 1px solid #e7eaec;
  padding-top: 10px;
  min-height: 100px;
}

.s-content small {
  margin-top: 4px;
  display: block;
  color: black;
}

.item {
  position: relative;
  float: left;
  text-align: center;
  width: 90%;
  margin: 38px auto;
  margin-bottom: 0px;
}

.item h2 {
  text-align: center;
  position: absolute;
  line-height: 114px;
  width: 100%;
  font-size: 18px;
  color: #4CAF50;
  font-weight: bold;
}

.item svg {
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

.circle_animation {
  stroke-dasharray: 440;
  /* this value is the pixel circumference of the circle */

  stroke-dashoffset: 440;
}

.html .circle_animation {
  -webkit-animation: html 1s ease-out forwards;
  animation: html 1s ease-out forwards;
}

.css .circle_animation {
  -webkit-animation: css 1s ease-out forwards;
  animation: css 1s ease-out forwards;
}

@-webkit-keyframes html {
  to {
    stroke-dashoffset: 80;
    /* 50% would be 220 (half the initial value specified above) */
  }
}

@keyframes html {
  to {
    stroke-dashoffset: 80;
  }
}

@-webkit-keyframes css {
  to {
    stroke-dashoffset: 160;
  }
}

@keyframes css {
  to {
    stroke-dashoffset: 160;
  }
}

.bargraph {
  list-style: none;
  width: 300px;
  padding: 0px !important;
  position: relative;
  margin-top: 17px;
}

.bargraph li {
  position: relative;
  height: 25px;
  margin-bottom: 5px;
  transition: width 2s;
  -webkit-transition: width 2s;
}

.bargraph li span {
  position: absolute;
  right: -55px;
  line-height: 25px;
}

.bargraph .top {
  background: #7ecd27;
  width: 12%;
}

.bargraph .midtop {
  background: #FF9800;
  width: 35%;
}

.bargraph .neutral {
  width: 40%;
  background: #64cdf4;
}

.bargraph .midbottom {
  width: 35%;
  background: #edb2d6;
}

.bargraph .bottom {
  width: 22%;
  background: #edb2d6;
}

.ibox-tools {
  display: inline-block;
  float: none;
  position: absolute;
  padding: 0;
  text-align: right;
  right: 16px;
  top: 13px;
}

.ibox-tools i {
  color: #b7b7b7;
}

.ibox-tools .fa-chevron-down,
.ibox-tools .fa-chevron-up {
  color: #b7b7b7;
  position: relative;
  top: -1px;
  right: 3px;
}

.single-post .entry-content ul li {
  margin-bottom: 0;
}

.single-post .entry-content ul {
  padding: 0;
}

.horizontal-bar-chart {
  float: left;
  width: 100%;
}

.horizontal-bar-chart li {
  position: relative;
  display: block;
  _zoom: 1;
  height: 2em;
  margin-bottom: .2em;
  background: #ebebeb;
}

.horizontal-bar-chart p {
  color: #666666;
  position: relative;
  display: block;
  margin: 0 0 .9em 0;
}

.horizontal-bar-chart .name {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  margin: 0 1em;
  text-align: right;
  color: #999;
  font-weight: bold;
  font-size: 0.875em;
  line-height: 2em;
  text-shadow: 1px 1px 0px #e8e8e8;
}

.horizontal-bar-chart .index {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  text-indent: .6em;
  font-weight: bold;
  color: #ffffff;
  background: #03A9F4;
  line-height: 2.2em;
}

.chart-container .source {
  padding-top: 4.5em;
  text-align: center;
}

.funnel {
  width: 300px;
  margin: 12px auto 0;
}

.date .location {
  color: #2196F3;
  font-style: italic;
  font-weight: bold;
}

.add-widget {
  border: 1px dashed #777;
  color: #777;
  padding: 5px;
  border-radius: 3px;
  opacity: 0.4;
  text-align: center;
}

.add-widget:hover {
  cursor: pointer;
  opacity: 0.8;
}

.select-widget label {
  padding: 4px 10px;
  background: #f1f1f1;
  vertical-align: middle;
  display: inline-block;
  border-radius: 2px;
  margin-right: 4px;
  margin-bottom: 4px;
}

.select-widget label input {
  margin-right: 7px;
}

ul.select-widget {
  padding: 0px !important;
}

.recent-activity {
  display: inline-block;
  margin: 1px 4px;
  border-bottom: 1px dotted;
}

.recent-activity:hover {
  border-bottom: 1px solid #2196F3;
  cursor: pointer;
  color: #2196F3;
}

.notificaton-counter {
  display: inline;
  background-color: #f8ac59;
  color: white;
  font-size: 9px;
  padding: 3px 8px;
  border-radius: 3px;
  vertical-align: middle;
  margin-left: 5px;
}

.s-heading2 {
  background: #FF5F6D;
  background: -webkit-linear-gradient(to right, #FFC371, #FF5F6D);
  background: linear-gradient(to right, #FF5F6D, #FFC371);
}

.s-heading2 h3,
.s-heading2 small {
  color: white !important;
}

.feed-element:first-child {
  margin-top: 0px;
  color: #ff4951;
}

.feed-activity-list .feed-element {
  border-bottom: 1px solid rgb(231, 234, 236);
}

.feed-element {
  margin-top: 15px;
}

.feed-element {
  padding-bottom: 15px;
}

.search-btn {
  float: right;
  background: white;
  border: 1px;
  font-size: 17px;
  color: #b3b3b3;
  margin-top: 4px;
}

.listing-area {
  border-radius: 4px;
  border: 1px solid;
  border-color: #dadada;
  display: inline-block;
  width: 100%;
  padding: 10px;
  background: white;
}

.filter-panel {
  margin-top: -1px !important;
  border: 1px solid #cccccc;
  z-index: 11 !important;
  background: white;
  border-radius: 2px;
  left: -136px;
}

.filter-panel b {
  display: block;
  color: gray;
  padding: 11px 11px 0px;
  font-size: 13px;
}

.filter-panel form {
  background: #fff;
  color: #000;
  border-radius: 8px;
  width: 199px;
  padding: 10px 8px 6px 12px;
  padding-top: 1px;
}

.filter-panel form .form-control {
  border-color: white;
  padding-left: 0px;
}

.filter-panel form .form-control:hover {
  border-color: white;
}

.nav .open>.filter-btn {
  border-bottom: 0px;
  position: relative;
  z-index: 12;
  background: white;
  border-color: #cccccc;
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
}

.nav .open>.filter-btn:hover {
  background: white;
  border-color: #cccccc;
}

.sep {
  border-right: 1px solid #cecece;
}

.sep .dropdown {
  float: right;
}

.search-icon {
  font-size: 15px !important;
  color: #cccccc;
  position: absolute;
  top: 7px;
  left: 11px;
}

.adv-filter {
  position: fixed;
  right: 0px;
  bottom: 0px;
  top: 51px;
  background: white;
  width: 242px;
  z-index: 3;
  box-shadow: 1px 2px 22px 1px #afafaf;
  padding: 47px 20px;
}

.filtering-by {
  display: inline-block;
  margin-top: 7px;
  font-size: 11px;
}

.filtering-by span {
  margin-left: 3px;
  font-size: 11px;
  font-weight: bold;
}

.adv-filter h4 {
  margin-bottom: 16px;
  color: #717171;
  border-bottom: 1px solid #f1f1f1;
  padding-bottom: 11px;
}

.adv-filter .form-control {
  margin-bottom: 10px;
}

.adv-filter {
  -webkit-animation: slideIn .1s forwards;
  -moz-animation: slideIn .1s forwards;
  animation: slideIn .1s forwards;
}

@-webkit-keyframes slideIn {
  0% {
    transform: translateX(242px);
  }

  100% {
    transform: translateX(0px);
  }
}

@-moz-keyframes slideIn {
  0% {
    transform: translateX(242px);
  }

  100% {
    transform: translateX(0px);
  }
}

@keyframes slideIn {
  0% {
    transform: translateX(242px);
  }

  100% {
    transform: translateX(0px);
  }
}


.fln {
  margin-right: -3px;
  color: #828282 !important;
  font-weight: normal !important;
}

.adv-filter {
  -webkit-animation: slideIn .1s forwards;
  -moz-animation: slideIn .1s forwards;
  animation: slideIn .1s forwards;
}

.close-filter:hover {
  color: gray;
  cursor: pointer;
}



.clear-filter {
  background: url(clear-filter.png) no-repeat center;
  width: 31px;
  height: 28px;
  border: 1px solid #cccccc;
  display: inline-block;
  border-radius: 2px;
}

.dropdown-menu {
      z-index: 6;
}

.form-group {
  margin-bottom: 6px;
}

.lol {
  background-color: red !important;
}

.breadcrumb {
    position: fixed;
    right: 0;
    padding: 5px !important;
    top: 50px;
    border-radius: 0;
    padding-left: 48px !important;
    background: white;
    left: 0;
    z-index: 7;
    box-shadow: 1px 0px 17px #cecece;
}

.breadcrumb .ActiveLink {
  color: #2196F3 !important;
}
.breadcrumb .ActiveLink:active{
    color: #5db3f7 !important;
}

.breadcrumb>li+li:before {
  color: #000000;
  /* content: "\f105";
  font-family: FontAwesome; */
  padding: 0 7px 0px 11px;
  font-size: 14px;
  position: relative;
  top: 1px;
}

.breadcrumb li a {
  color: #000000;
  pointer-events: none;
  font-size: 12px !important;
}

.breadcrumb li:first-child a {
  background: white !important;
  border: 0 !important;
  margin-left: 10px !important;
}

.breadcrumb li:last-child a {
background: #e9ebee;
    padding: 6px 12px 7px;
    color: black;
    font-weight: bold;
    
}

.breadcrumb li a:hover {
  cursor: pointer !important;
  color: black;
  text-decoration: underline !important;
}

.add-icon {
  color: #41b7d8;
  font-size: 14px;
  transition: 0.3s;
  border-bottom: .08em solid transparent;
}

.add-icon i {
  margin-right: 5px;
}

.add-icon:hover {
  border-bottom: .08em solid #41b7d8;
  cursor: pointer;
  color: #41b7d8;
  transition: 0.3s;
}

.nav-tabs div li a {
  border: 1px solid white;
  color: #4c4c4c;
  padding: 9PX;
  padding-left: 8px;
  padding-right: 8px;
  position: relative;
  float: left;
  letter-spacing: 0.3px;
  font-weight: bold;
}

.nav-tabs>div>li.active>a,
.nav-tabs>div>li.active>a:focus {
  color: #2196F3;
  cursor: default;
  font-weight: 600;
  box-shadow: inset 0 -2px 0 0;
}

.nav-tabs>div>li>a:hover {
  background: white;
  color: #2196F3;
  cursor: pointer;
}

/* .nav>div>li>a {
    position: relative;

}

.nav-tabs>div>li.active>a:before {
  transform: scaleX(1);
  -webkit-transform: scaleX(1);
  -moz-transform: scaleX(1);
  -ms-transform: scaleX(1);
  -o-transform: scaleX(1);
} */

.no-record,
.no-record-transaction-sup,
.no-record-transaction-cust,
.no-record-transaction-item {
  max-width: 600px;
  margin: 26px auto;
  text-align: center;
  font-size: 16px;
  padding: 10px;
  color: #8e8e8e;
  line-height: 31px;
}

.norecordmessage {
  margin-top: -3px;
  font-size: 13px;
  color: #c7c7c7;
  border: 1px solid #eaeaea;
  padding: 18px;
  border-radius: 3px;
  background-color: white;
}

.norecordmessage div {
  margin-top: 7px;
}

.norecordmessage span {
  font-size: 27px;
  background: white !important;
  color: #bbbbbb !important;

}
.modal-lg3 {
    width: 93%;
}

.no-record::before {
  content: " You have not entered any record. Create your first one with the Add button.";
}

.no-record-transaction-sup::before {
  content: "No transaction found for this supplier. ";
}

.no-record-transaction-cust::before {
  content: "No transaction found for this customer. ";
}

.no-record-transaction-item::before {
  content: "No transaction found for this item. ";
}

.ui-select-bootstrap .btn-default2:hover {
  border: 1px solid #ccc;
  background: white;
  color: #0b0b0b;
}

.mtop7 {
  margin-top: 7px;
  margin-left: -8px;
}

.showpointer input {
  cursor: pointer !important;
  text-decoration: underline;
}

.showpointer span i {
  visibility: hidden;
}

.cursorPointer {
  cursor: pointer;
}

.showpointer:hover i {
  color: #b9b9b9 !important;
  visibility: visible;

}

.company-logo {
  text-align: center !important;
  width: 100%;
  font-size: 39px;
  color: #cecece;
}

.company-fullname {
  display: block;
  text-align: center;

  font-size: 17px;
  margin-bottom: 3px;
  color: #737373;
}

.company-city {
  display: block;
  text-align: center;
  color: #b5b5b5;
  margin-bottom: 10px;
}

.company-logo img {
  height: 72.27px;
  padding: 30px 32px;
  display: block;
  text-align: center;
  margin: 0 auto;
}

.edit-company {
  padding: 6px 10px;
  display: block;
  visibility: hidden;
  position: absolute;
  right: 11px;
  background: #4aacdc12;
  top: 4px;
  border-radius: 2px;
  color: #009fec;
  border: 1px solid #4aacdc4d;
}

.s-box:hover a.edit-company {
  visibility: visible;
}

.company-telephone,
.company-postcode {
  width: 200px;
  margin: 0 auto;
  border-bottom: 1px solid #e4e4e4;
  padding-bottom: 4px;
  margin-bottom: 4px;
  font-weight: bold;
  color: #949494;
}

.company-postcode {
  border-bottom: 0px;
}

.company-telephone i,
.company-postcode i {
  width: 16px;
}

.enablelogin {
  pointer-events: all;
  opacity: 1;
}

.slogan {
  position: absolute;
  color: #ffffff;
  font-size: 12px;
  letter-spacing: 6px;
  text-align: center;
  display: block;
  width: 90%;
  font-weight: bold;
  margin-top: 8px;
}

.authmessage {
  font-size: 13px;
  position: absolute;
  top: 61px;
  color: #ff0100;
  background-color: #ffdfdf;
  padding: 13px 43px;
  text-transform: capitalize;
  font-weight: 400;
  animation: fadeInText 300ms 0ms forwards;
  border-radius: 3px;
  width: 541px;
}
.authmessage i {
  position: absolute;
  left: 14px;
  top: 12px;
}
@keyframes fadeInText {
  from {
    transform: translateY(-10px);
    opacity: 0;
  } to {
    transform: translateY(0);
    opacity: 1;
  }
}
/* label[aria-expanded=true] .fa-caret-right {
   display: none;
   
}
label[aria-expanded=false] .fa-caret-down {
   display: none;
} */

.collapseicon {
  font-size: 15px !important;
  position: relative;
  top: 1px;
  right: -8px;
}

.collapseaction {
  font-size: 15px;
  display: inline-block;
  color: #4e575d;

  letter-spacing: 0.2px;
}

.collapseaction:hover {
  cursor: pointer;
  color: #03a9f4;
}

.box-container {
  background-color: #fff;
  border-radius: 4px;
  border: 1px solid;
  border-color: #dadada;
  padding: 10px;
  text-align: center;
  position: relative;
  font-size: 13px;
  margin-bottom: 16px;
}

.box-container i {
  font-size: 33px;
  margin-bottom: 6px;
  display: block;
  margin-top: 5px;
}

.box-container .fa-twitter {
  color: #42c0fb;
}

.box-container .fa-youtube-play {
  color: #ec2828;
}

.box-container .fa-linkedin {
  color: #007ab9;
}

.box-container .fa-pinterest {
  color: #cb2028;
}

.box-container .fa-instagram {
  color: #dd2982;
}

.box-container .fa-facebook {
  color: #3b5997;
}

.box-container .fa-yahoo {
  color: #7b0099;
}

.box-container .fa-vimeo {
  color: #1bb6ec;
}

.box-container .fa-tumblr {
  color: #32506a;
}

.box-container .fa-whatsapp {
  color: #49c659;
}

.box-container .fa-google {
  color: #db4b40;
}

.box-container .fa-google-plus-official {
  color: #db4b40;
}

.box-container .fa-skype {
  color: #00b0f0;
}

.box-container .fa-windows {
  color: #00adef;
}

.box-container .fa-flickr {
  color: #0154d8;
}

.box-container:hover {
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
  transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
  border-color: transparent;
}

.SocialMediaName {
  font-weight: bold;
  text-transform: capitalize;
  color: #757575;
}

.box-container a {
  position: absolute;
  right: 8px;
  top: 6px;
  padding: 4px 8px;
  border-radius: 2px;
  border: 1px solid transparent;
  visibility: hidden;
}

.box-container a:hover {
  background: #f7f7f7;
  border: 1px solid #e4e4e4;
  cursor: pointer;
}

.box-container:hover a {
  visibility: visible;
}

.box-container a i {
  font-size: 10px;
}

.cbdesign input[type="checkbox"]+label:before {
  left: 183px;
}

.cbdesign input[type="checkbox"]+label:after {
  left: 187px;
}

.cbdesign label {
  margin-left: -23px;
}

.style-icon {
  height: 23px;
  width: 23px;
  position: relative;
  left: -8px;
  top: 3px;
}

.input-label {
  position: relative;
}

.input-label-name {
  position: absolute;
  font-size: 11px;
  left: 1px;
  top: 1px;
  z-index: 1;
  color: #9a9a9a;
  font-weight: bold;
  padding: 4px 0 0 5px;

}

.input-city .form-control {
  padding-left: 37px !important;
}

.input-county .form-control {
  padding-left: 56px !important;
}

.input-postcode .form-control {
  padding-left: 67px;
  text-transform: uppercase;
}

.input-fax .form-control {
  padding-left: 34px;
}

.input-tel .form-control {
  padding-left: 74px;
}

.input-web .form-control {
  padding-left: 42px;
}

.panel-title-hover:hover {
  cursor: pointer;
  color: #03a9f4;
}

.mini-navbar .nav-tabs {
  padding: 1px !important;
  border-color: white;
  margin-bottom: 18px !important;
  border-bottom: 1px solid #f3f3f3;
  border-radius: 0px;
  padding-left: 0px !important;
}

.mini-navbar .nav-tabs>li.active>a {
  background: #f3f3f3;
  border-radius: 3px;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.mini-navbar .nav-tabs>li>a {
  padding: 7px 10px;
}

.mini-navbar .nav-tabs>li.active>a:before {
  transform: scaleX(0);
}

@keyframes flickerAnimation {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@-o-keyframes flickerAnimation {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@-moz-keyframes flickerAnimation {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@-webkit-keyframes flickerAnimation {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}


tr.isPrimary {
  box-shadow: inset 2px 0 0 0 #4CAF50 !important;
}

tr.isDefault {
  box-shadow: inset 2px 0 0 0 #03a9f4;
}

.isPrimaryLabel {
  display: block;
  font-weight: bold;
  color: #4CAF50;
}

.isDefaultLabel {
  display: block;
  font-weight: bold;
  color: #2dade6;
}

.company-logo i {
  padding: 9px;
  font-size: 30px;
  width: 72.27px;
  height: 72.27px;
  text-align: center;
  line-height: 52px;
  color: #cacaca;
}

.mt6 {
  margin-top: 6px;
}

.pt7 {
  padding-top: 7px !important;
}

.new-pagination {
  padding: 7px 6px;
  position: relative;
  background: #f9f9f9;
  border-top: 1px solid #ececec;
}

.new-pagination .pagination {
  position: absolute;
  right: 8px;
  margin-top: -14px;
}

.total-records {
  position: absolute;
  top: 7px;
  font-weight: bold;
  color: #000000;
  font-weight: normal;
  margin-left: 4px;
}

.items-per-page .form-control {
  border-color: white;
  font-weight: bold;
  color: gray;
  font-size: 11px;
}

.showing-record {
  position: absolute;
  left: 42%;
  top: 22%;
  font-weight: bold;
  color: black;
  font-size: 11px;
}

.new-pagination ul li a {
  border-color: white !important;
}

.new-pagination .pagination a {
  padding: 4px 8px;
  margin-top: 3px;
  border: 1px solid #e6e6e6 !important;
  color: black;
  font-weight: normal;
}

.new-pagination .pagination>.active>a {
  background: #e6e6e6;
  color: black;
}

.opp-stages {
  counter-reset: flag;
  margin-bottom: 21px;
  width: 100%;
  overflow-x: auto;
  ;
  white-space: nowrap;
  overflow-y: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}

.opp-stages a {
  text-decoration: none;
  outline: none;
  display: block;
  float: left;
  font-size: 10.5px;
  line-height: 30px;
  color: white;
  font-weight: bold;
  padding: 0 8px 0 60px;
  background: #bbbbbb;
  position: relative;
  width: 150px;
}

.disableNoteEditable .note-editor:nth-child(3) {
  pointer-events: none;
}
/*since the first link does not have a triangle before it we can reduce the left padding to make it look consistent with other links*/
.opp-stages a:first-child {
  padding-left: 46px;
  border-radius: 5px 0 0 5px;
  /*to match with the parent's radius*/
}

.opp-stages a:first-child:before {
  left: 14px;
}

.opp-stages a:last-child {
  border-radius: 0 5px 5px 0;
  /*this was to prevent glitches on hover*/
  padding-right: 20px;
}

/*hover/active styles*/
.opp-stages a.active,
.opp-stages a.active:after,
.opp-stages a.active:hover,
.opp-stages a.active:hover:after {
  background: #67b0d2;
}

.opp-stages a.missed,
.opp-stages a.missed:after,
.opp-stages a.missed:hover,
.opp-stages a.missed:hover:after {
  background: #c5a472;
}

.opp-stages a.completed,
.opp-stages a.completed:after,
.opp-stages a.completed:hover,
.opp-stages a.completed:hover:after {
  background: #86bf86;
}

.opp-stages a:hover,
.opp-stages a:hover:after {
  background: #9c9c9c;
  text-decoration: underline !important;
  cursor: pointer;
}

.opp-stages a:hover a:before {
  color: #333333 !important;
}


/*adding the arrows for the breadcrumbs using rotated pseudo elements*/
.opp-stages a:after {
  content: '';
  position: absolute;
  top: -3px;
  right: -18px;
  width: 36px;
  height: 36px;
  transform: scale(0.6) rotate(45deg);
  z-index: 1;
  background: #bbbbbb;
  box-shadow: 2px -2px 0 2px rgb(255, 255, 255), 3px -3px 0 2px rgba(255, 255, 255, 0.1);
  border-radius: 0 5px 0 50px;
}

/*we dont need an arrow after the last link*/
.opp-stages a:last-child:after {
  content: none;
}

/*we will use the :before element to show numbers*/
.opp-stages a:before {
  content: counter(flag);
  counter-increment: flag;
  border-radius: 100%;
  width: 17px;
  height: 17px;
  line-height: 17px;
  margin: 6px 0;
  position: absolute;
  top: 0;
  left: 30px;
  background: #fff;
  color: #bbbbbb;
  text-align: center;
  font-size: 10px;
  font-weight: bold;
}

.readonlydiv {
    background: #f4f7f7;
    border: 1px solid #e5e5e5 !important;
    padding-top: 6px;
}
.opp-stages a.active-now::before {
  border: 2px solid #6f6f6f;
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
  line-height: 18px;
  width: 24px;
  height: 24px;
  -webkit-animation: popover-dot-animation 1.5s;
  animation: popover-dot-animation 1.5s;
  color: black !important;
  background: #ffffff;
  margin-top: 3px;
}

@keyframes popover-dot-animation {
  0% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
}

.opp-stages a.active::before {
  color: #4cbbec;
}

.opp-stages a.missed::before {
  color: #e2a651;
}

.opp-stages a.completed::before {
  color: #86bf86;
}

.opp-stages span {
  display: block;
}

.opp-stages small {
  text-transform: uppercase;
  font-style: normal;
  margin-left: 5px;
}

.label-stages i {
  font-size: 11px;
  margin-right: 5px;
}

.label-stages:nth-child(1) i {
  color: #4dbbec;
}

.label-stages:nth-child(2) i {
  color: #86bf86;
}

.label-stages:nth-child(3) i {
  color: #d8d8d8;
}

.label-stages {
  font-size: 11px;
  color: #777777;
}

.search-wrapper .form-control {
  border-color: white !important;
  font-size: 15px;
  padding-left: 17px;
  box-shadow: none !important;
}

.search-wrapper {
  position: relaive;
}

.search-wrapper i {
  position: absolute;
  top: 7px;
  left: 9px;
}

a.clear-record {
  position: absolute;
  top: 4px;
  right: 21px;
  padding: 1px 5px;
  font-size: 20px;
  color: #cacaca;
  background: white;
  border-radius: 50%;
}

a.clear-record:hover {
  cursor: pointer;
  background: gray;
  color: white;
}

.btn-default3 {
  padding: 3px;
  font-size: 11px;
  width: 100%;
  border: 1px solid #d0d6d9;
  text-align: center;
  border-radius: 2px;
}

.btn-default3:hover {
  border-color: gray;
  cursor: pointer;
}

.plusminus {
  display: block;
  margin-top: 3px;
  color: #a2a2a2;
  width: 18px;
  text-align: center;
  border-radius: 3px;
  border: 1px solid #c5c5c5;
  box-shadow: 0 2px 4px 0 rgba(0,0,0,0.1);
  font-size: 10px;
}

.plusminus:hover {
  cursor: pointer;
  border-color: #9e9e9e;
  color: #008eff;
}

.vol-toggle-btn {
  padding: 6px;
  border-radius: 2px;
  border: 1px solid transparent;
  color: #bdbdbd;
}

.vol-toggle-btn:hover {
  border: 1px solid #d4d4d4;
  cursor: pointer;
  background: white;
}

.crm-postcode::-webkit-input-placeholder {
  text-transform: none;
}

.crm-postcode:-moz-placeholder {
  text-transform: none;
}

.crm-postcode::-moz-placeholder {
  text-transform: none;
}

.crm-postcode:-ms-input-placeholder {
  text-transform: none;
}

.crm-postcode {
  text-transform: uppercase;
}

.change-bg thead tr th,
.change-bg tbody td {
  background: rgb(236, 249, 255);
  border-bottom: #ecf9ff 1px solid !important;
  color: #3f9dc5 !important;
}

.max-height {
  height: 50px !important;
  overflow-y: scroll;
}

.selectedItem,
.active-items {
  background: linear-gradient(to bottom, rgba(240, 249, 255, 1) 0%, rgb(227, 244, 254) 47%, rgb(237, 248, 254) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f0f9ff', endColorstr='#c4efff', GradientType=0);
}

.bp0 {
  border: 0;
  padding: 0;
  box-shadow: 0;
}

a.full-notes:hover {
  color: gray;
  cursor: default !important;
}

.truncatetext {
  width: 180px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.vol-disc-heading {
  padding: 4px 0px 0px 0px !important;
  margin: 32px 0 7px 0;
  margin-left: 93px;
  position: relative;
  border-radius: 3px;
  border: 1px solid #e6e6e6;
  background: #ffffff;
  background: -moz-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
  background: -webkit-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
  background: linear-gradient(to bottom, #ffffff 0%, #f2f2f2 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f2f2f2', GradientType=0);

}

.despwidth3 {
  width: 194px !important;
}

.vol-disc-heading::before {
  position: absolute;
  content: 'Volume Discount';
  left: 0;
  top: -25px;
  font-weight: bold;
  color: #5f5f5f;
  font-size: 14px;

}

.itemnamehover {
  color: gray;
  border-bottom: 1px dotted gray;
}

.itemnamehover:hover {
  color: black;
  border-bottom: 0;
}


.f-modal-alert .f-modal-icon {
  border-radius: 50%;
  border: 4px solid gray;
  box-sizing: content-box;
  height: 85px;
  margin: 20px auto;
  padding: 0;
  position: relative;
  width: 80px;
}

.f-modal-alert .f-modal-icon.f-modal-success,
.f-modal-alert .f-modal-icon.f-modal-error {
  border-color: #A5DC86;
}

.f-modal-alert .f-modal-icon.f-modal-success:after,
.f-modal-alert .f-modal-icon.f-modal-success:before,
.f-modal-alert .f-modal-icon.f-modal-error:after,
.f-modal-alert .f-modal-icon.f-modal-error:before {
  background: #fff;
  content: '';
  height: 120px;
  position: absolute;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  width: 60px;
}

.f-modal-alert .f-modal-icon.f-modal-success:before,
.f-modal-alert .f-modal-icon.f-modal-error:before {
  border-radius: 120px 0 0 120px;
  left: -33px;
  top: -7px;
  -webkit-transform-origin: 60px 60px;
  transform-origin: 60px 60px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.f-modal-alert .f-modal-icon.f-modal-success:after,
.f-modal-alert .f-modal-icon.f-modal-error:after {
  border-radius: 0 120px 120px 0;
  left: 30px;
  top: -11px;
  -webkit-transform-origin: 0 60px;
  transform-origin: 0 60px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.f-modal-alert .f-modal-icon.f-modal-success .f-modal-placeholder,
.f-modal-alert .f-modal-icon.f-modal-error .f-modal-placeholder {
  border-radius: 50%;
  border: 4px solid rgba(165, 220, 134, 0.2);
  box-sizing: content-box;
  height: 80px;
  left: -4px;
  position: absolute;
  top: -4px;
  width: 80px;
  z-index: 2;
}

.f-modal-alert .f-modal-icon.f-modal-success .f-modal-fix,
.f-modal-alert .f-modal-icon.f-modal-error .f-modal-fix {
  background-color: #fff;
  height: 90px;
  left: 28px;
  position: absolute;
  top: 8px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  width: 5px;
  z-index: 1;
}

.f-modal-alert .f-modal-icon.f-modal-success .f-modal-line,
.f-modal-alert .f-modal-icon.f-modal-error .f-modal-line {
  background-color: #A5DC86;
  border-radius: 2px;
  display: block;
  height: 5px;
  position: absolute;
  z-index: 2;
}

.f-modal-alert .f-modal-icon.f-modal-success .f-modal-line.f-modal-tip,
.f-modal-alert .f-modal-icon.f-modal-error .f-modal-line.f-modal-tip {
  left: 14px;
  top: 46px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  width: 25px;
}

.f-modal-alert .f-modal-icon.f-modal-success .f-modal-line.f-modal-long,
.f-modal-alert .f-modal-icon.f-modal-error .f-modal-line.f-modal-long {
  right: 8px;
  top: 38px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  width: 47px;
}

.f-modal-alert .f-modal-icon.f-modal-error {
  border-color: #F27474;
}

.f-modal-alert .f-modal-icon.f-modal-error .f-modal-x-mark {
  display: block;
  position: relative;
  z-index: 2;
}

.f-modal-alert .f-modal-icon.f-modal-error .f-modal-placeholder {
  border: 4px solid rgba(200, 0, 0, 0.2);
}

.f-modal-alert .f-modal-icon.f-modal-error .f-modal-line {
  background-color: #F27474;
  top: 37px;
  width: 47px;
}

.f-modal-alert .f-modal-icon.f-modal-error .f-modal-line.f-modal-left {
  left: 17px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.f-modal-alert .f-modal-icon.f-modal-error .f-modal-line.f-modal-right {
  right: 16px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.f-modal-alert .f-modal-icon.f-modal-warning {
  border-color: #F8BB86;
}

.f-modal-alert .f-modal-icon.f-modal-warning:before {
  -webkit-animation: pulseWarning 2s linear infinite;
  animation: pulseWarning 2s linear infinite;
  background-color: #fff;
  border-radius: 50%;
  content: "";
  display: inline-block;
  height: 100%;
  opacity: 0;
  position: absolute;
  width: 100%;
}

.f-modal-alert .f-modal-icon.f-modal-warning:after {
  background-color: #fff;
  border-radius: 50%;
  content: '';
  display: block;
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 1;
}

.f-modal-alert .f-modal-icon.f-modal-warning .f-modal-body {
  background-color: #F8BB86;
  border-radius: 2px;
  height: 47px;
  left: 50%;
  margin-left: -2px;
  position: absolute;
  top: 10px;
  width: 5px;
  z-index: 2;
}

.f-modal-alert .f-modal-icon.f-modal-warning .f-modal-dot {
  background-color: #F8BB86;
  border-radius: 50%;
  bottom: 10px;
  height: 7px;
  left: 50%;
  margin-left: -3px;
  position: absolute;
  width: 7px;
  z-index: 2;
}

.f-modal-alert .f-modal-icon+.f-modal-icon {
  margin-top: 50px;
}

.animateSuccessTip {
  -webkit-animation: animateSuccessTip .75s;
  animation: animateSuccessTip .75s;
}

.animateSuccessLong {
  -webkit-animation: animateSuccessLong .75s;
  animation: animateSuccessLong .75s;
}

.f-modal-icon.f-modal-success.animate:after {
  -webkit-animation: rotatePlaceholder 4.25s ease-in;
  animation: rotatePlaceholder 4.25s ease-in;
}

.f-modal-icon.f-modal-error.animate:after {
  -webkit-animation: rotatePlaceholder 4.25s ease-in;
  animation: rotatePlaceholder 4.25s ease-in;
}

.animateErrorIcon {
  -webkit-animation: animateErrorIcon .5s;
  animation: animateErrorIcon .5s;
}

.animateXLeft {
  -webkit-animation: animateXLeft .75s;
  animation: animateXLeft .75s;
}

.animateXRight {
  -webkit-animation: animateXRight .75s;
  animation: animateXRight .75s;
}

.scaleWarning {
  -webkit-animation: scaleWarning 0.75s infinite alternate;
  animation: scaleWarning 0.75s infinite alternate;
}

.pulseWarningIns {
  -webkit-animation: pulseWarningIns 0.75s infinite alternate;
  animation: pulseWarningIns 0.75s infinite alternate;
}

@-webkit-keyframes animateSuccessTip {

  0%,
  54% {
    width: 0;
    left: 1px;
    top: 19px;
  }

  70% {
    width: 50px;
    left: -8px;
    top: 37px;
  }

  84% {
    width: 17px;
    left: 21px;
    top: 48px;
  }

  100% {
    width: 25px;
    left: 14px;
    top: 45px;
  }
}

@keyframes animateSuccessTip {

  0%,
  54% {
    width: 0;
    left: 1px;
    top: 19px;
  }

  70% {
    width: 50px;
    left: -8px;
    top: 37px;
  }

  84% {
    width: 17px;
    left: 21px;
    top: 48px;
  }

  100% {
    width: 25px;
    left: 14px;
    top: 45px;
  }
}

@-webkit-keyframes animateSuccessLong {

  0%,
  65% {
    width: 0;
    right: 46px;
    top: 54px;
  }

  84% {
    width: 55px;
    right: 0;
    top: 35px;
  }

  100% {
    width: 47px;
    right: 8px;
    top: 38px;
  }
}

@keyframes animateSuccessLong {

  0%,
  65% {
    width: 0;
    right: 46px;
    top: 54px;
  }

  84% {
    width: 55px;
    right: 0;
    top: 35px;
  }

  100% {
    width: 47px;
    right: 8px;
    top: 38px;
  }
}

@-webkit-keyframes rotatePlaceholder {

  0%,
  5% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }

  100%,
  12% {
    -webkit-transform: rotate(-405deg);
    transform: rotate(-405deg);
  }
}

@keyframes rotatePlaceholder {

  0%,
  5% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }

  100%,
  12% {
    -webkit-transform: rotate(-405deg);
    transform: rotate(-405deg);
  }
}

@-webkit-keyframes animateErrorIcon {
  0% {
    -webkit-transform: rotateX(100deg);
    transform: rotateX(100deg);
    opacity: 0;
  }

  100% {
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
    opacity: 1;
  }
}

@keyframes animateErrorIcon {
  0% {
    -webkit-transform: rotateX(100deg);
    transform: rotateX(100deg);
    opacity: 0;
  }

  100% {
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
    opacity: 1;
  }
}

@-webkit-keyframes animateXLeft {

  0%,
  65% {
    left: 82px;
    top: 95px;
    width: 0;
  }

  84% {
    left: 14px;
    top: 33px;
    width: 47px;
  }

  100% {
    left: 17px;
    top: 37px;
    width: 47px;
  }
}

@keyframes animateXLeft {

  0%,
  65% {
    left: 82px;
    top: 95px;
    width: 0;
  }

  84% {
    left: 14px;
    top: 33px;
    width: 47px;
  }

  100% {
    left: 17px;
    top: 37px;
    width: 47px;
  }
}

@-webkit-keyframes animateXRight {

  0%,
  65% {
    right: 82px;
    top: 95px;
    width: 0;
  }

  84% {
    right: 14px;
    top: 33px;
    width: 47px;
  }

  100% {
    right: 16px;
    top: 37px;
    width: 47px;
  }
}

@keyframes animateXRight {

  0%,
  65% {
    right: 82px;
    top: 95px;
    width: 0;
  }

  84% {
    right: 14px;
    top: 33px;
    width: 47px;
  }

  100% {
    right: 16px;
    top: 37px;
    width: 47px;
  }
}

@-webkit-keyframes scaleWarning {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  30% {
    -webkit-transform: scale(1.02);
    transform: scale(1.02);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes scaleWarning {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  30% {
    -webkit-transform: scale(1.02);
    transform: scale(1.02);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes pulseWarning {
  0% {
    background-color: #fff;
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0.5;
  }

  30% {
    background-color: #fff;
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0.5;
  }

  100% {
    background-color: #F8BB86;
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 0;
  }
}

@keyframes pulseWarning {
  0% {
    background-color: #fff;
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0.5;
  }

  30% {
    background-color: #fff;
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0.5;
  }

  100% {
    background-color: #F8BB86;
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 0;
  }
}

@-webkit-keyframes pulseWarningIns {
  0% {
    background-color: #F8D486;
  }

  100% {
    background-color: #F8BB86;
  }
}

@keyframes pulseWarningIns {
  0% {
    background-color: #F8D486;
  }

  100% {
    background-color: #F8BB86;
  }
}


tbody.collapse.in {
  display: table-row-group;
}

a.add-dis-btn i {
  color: #03A9F4;
}

a.add-dis-btn i:hover {
  cursor: pointer;
  color: black;
}



/* Flexitable  */

table.flexi-table {
  border-collapse: collapse;
  background: white;
  table-layout: fixed;
  width: 100%;
}

.flexi-table th,
.flexi-table td {
  padding: 5px 11px;
  border-right: 0;
  width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border-bottom: 1px solid #dadada;
}

.flexi-table th:first-child,
.flexi-table tr td:first-child {
  padding-left: 28px;
}

.flexi-table th:first-child {
  position: relative;
}

.tableCustomization tbody tr:hover {
  cursor: move;
  background: #efefef;
}

.tableCustomization td,
.tableCustomization th {
  padding: 4px;
}

.tableCustomization th:nth-child(3) {
  width: 22%;
}

.tableCustomization th:nth-child(4),
.tableCustomization th:nth-child(2) {
  text-align: center;
}

.tableCustomization td:nth-child(4),
.tableCustomization td:nth-child(2) {
  position: relative;
  text-align: center;
}

.tableCustomization td:last-child i {
  position: absolute;
  right: 11px;
  font-size: 18px;
  display: none;
  top: 9px;
  color: #cacaca;
}

.tableCustomization tr:hover td i {
  display: inline-block;
}

.flexi-table th i {
  position: absolute;
  left: 8px;
  top: 11px;
  font-size: 15px;
  color: #b9b9b9;
}

.flexi-table th i:hover {
  color: black;
  cursor: pointer;
}

.flexi-table td {
  line-height: 24px;
}

.flexi-table th {
  height: 39px;
  color: #616161;
  font-weight: bold;
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiP…dpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==);
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fdfefe), color-stop(100%, #f6f7f8));
  background: -webkit-linear-gradient(#fdfefe, #f6f7f8);
  background: -webkit-linear-gradient(#fdfefe, #f6f7f8);
  background: linear-gradient(#fdfefe, #f6f7f8);
  border: 0;
}

.flexi-table-hScroll {
  overflow: auto;
}

.flexi-table-vScroll {
  overflow-y: auto;
  overflow-x: hidden;
  max-height: 250px;
}

.ui-select-toggle:focus {
  border: 1px solid #929292 !important;
}

.panel-info:focus-within {
  border: thin solid black;
}

.input-dimen .form-control {
  padding-left: 19px;
}

.v-align {
  padding-top: 4px;
}

.white-space-normal {
  white-space: normal !important;
}

.input-symbol:hover .fa-external-link {
  cursor: pointer;
}

.normal-font {
  font-weight: normal !important;
}

.AttocatedStock {
  color: #4CAF50 !important;
  opacity: 1 !important;
}

readonly {
  background: #fafbfb !important;
}

.activeme {
  background-color: #f3f3f3 !important;
}

.btn-group.btn-block {
  display: flex;
}

.btn-group.btn-block>.btn {
  flex: 1;
}

.allocatedStock {
  background: green;
}

.loginAction a {
    padding: 0 !important;
    color: #b3b2b2 !important;
}

.loginAction li {
   padding: 4px 2px;
    margin-bottom: -2px;
    border-radius: 2px;
    color: white;
}

.loginAction li:hover {
    cursor: pointer;
    background: #1f1f1f;
}
.loginAction li:hover a {
  color: #000000 !important;
}

.loginAction span {
  width: 20px !important;
  position: relative;
  top: 1px;
  padding: 3px 2px;
  text-align: left;
}

.allo i {
  padding: 4px 5px;
  background: #2196F3;
  border-radius: 50%;
  color: #ffffff;
  height: 20px;
  width: 19px;
  text-align: center;
  line-height: 13px;
  margin-right: 5px;
}

.allo i:hover {
  cursor: pointer;
  background: gray;
  color: white;
}

.allo i:active {
  background: black;
  color: white;
}
.hoverOnApproval:hover {
  background-color: #f9f9f9;
}

.smallwidget {
  border: 1px solid #e2e2e2;
    padding: 8px;
    width: 18%;
    position: relative;
    float: left;
    margin-right: 7px;
    border-radius: 4px;
    padding: 8px;
    background-color: white;
}

.smallwidget div:first-child {
  color: #565656;
  margin-bottom: 3px;
}

.smallwidget i {
  position: absolute;
  top: 5px;
  right: 4px;
  color: #adadad;
  font-size: 13px;
}

.smallwidget:hover i {
  color: #03A9F4;
}

.smallwidget div:nth-child(2) {
  font-weight: bold;
  font-size: 16px !important;
  color: #3a3a3a;
  text-overflow: ellipsis;
  overflow: hidden;
}

.belowzero {
  color: #fd7272 !important;
}

.belowzero2 {
  border-color: #fd7272 !important;
}

.belowzero2 div {
  color: #fd7272 !important;
}

.StkAllocated {
  border-color: #64ca64;
}

.currentStock {
  border-color: #03A9F4;
}

.currentStock div {
  color: #03A9F4 !important;
}

.StkAllocated div {
  color: #64ca64 !important;
}

.comp-alloc2 {
  box-shadow: inset 4px 0px 0px 0px #7ac5e6;
  font-weight: bold;
}

.mb0 {
  margin-bottom: 0 !important;
}

.dontwrap th {
  white-space: normal !important;
}

.in-comp-alloc {
  border-color: #ef7373 !important;
  color: #ef7373 !important;
  border: 1px solid !important;
}

.in-comp-alloc:hover {
  background-color: #ef7373 !important;
  color: white !important;
  border-color: #ef7373 !important;
}


.comp-alloc {
  border-color: #30d430 !important;
  color: #25b725 !important;
  border: 1px solid !important;
}

.comp-alloc:hover {
  border-color: #30d430 !important;
  color: #25b725 !important;
  border: 1px solid !important;
}


.item-dispatch {
  border-color: orange !important;
  color: orange !important;
  border: 1px solid !important;
}

.item-dispatch:hover {
  background-color: orange !important;
  color: white !important;
  border-color: orange !important;
}

.item-alloc a i.fa {
  border-color: #30d430 !important;
  color: #25b725 !important;
  border: 1px solid !important;
}

.item-alloc a i.fa:hover {
  border-color: #30d430 !important;
  color: #25b725 !important;
  border: 1px solid !important;
}

option:disabled {
  background: #ccc;
}

.stockDispatchedBtn {
  border-color: #efa624;
  color: #ffa300;
  background: white;
}

.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
  opacity: .5;
}

label {
color: #444444;
}

.ActiveLink {
  pointer-events: initial !important;
  background: white !important;
  border: 0 !important;
  font-family: 'Open Sans', sans-serif !important;
  padding: 0 !important;
}

/* .btn.disabled, .btn[disabled], fieldset[disabled] .btn {
  box-shadow: none !important;
  background: #f4f7f7 !important;
  color: #3a3a3a !important;
  font-weight: normal !important;
  border-color: #e5e5e5;
} */

.stock-done {
  color: #63cb63 !important;
  font-weight: bold;
}

.stock-done2 {
  box-shadow: inset 4px 0px 0px 0px #63cb63;
}

.avail_stock {
  position: relative;
}


.avail_stock span,
.stock-done span {
  border-radius: 2px;
  padding: 3px 5px;
  border: 1px solid;
  display: block;
  font-size: 9px;
  text-align: center !important;
}

.no-readonly .form-control[readonly],
.no-readonly .form-control[disabled] {
  background: white;
  border-color: transparent;
  background-image: none !important;
  padding-left: 0;
  padding-right: 0 !important;
  pointer-events: none;
    
}
.fullwidth {
  width: 100% !important;
  margin-right: 0 !important;
}
.dont-wrap {
  white-space: normal !important;
  padding-top: 0 !important;
  line-height: 1.4;
}

.disable-el {
  pointer-events: none;
  opacity: 0.2;
}

.disable-el2 {
  pointer-events: none;
  opacity: 0.5;
}

.dont-wrap thead th,
.dont-wrap tbody td {
  white-space: normal !important;
}

/* kia flexi-select */

.flexi-stage {
  width: 65%;
  counter-reset: flag;
  white-space: nowrap;
  overflow-y: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  float: right;
  margin: 3px 16px 0;
}

.flexi-stage:hover {
  background-color: white;
}


.flexi-stage span {
  text-decoration: none;
  outline: none;
  display: block;
  float: left;
  font-size: 10.5px;
  line-height: 24px;
  color: white;
  font-weight: bold;
  padding: 0 8px 0 60px;
  background: #bbbbbb;
  position: relative;
  width: 150px;
}

/*since the first link does not have a triangle before it we can reduce the left padding to make it look consistent with other links*/

.flexi-stage span:first-child {
  padding-left: 1px;
  border-radius: 5px 0 0 5px;
  /*to match with the parent's radius*/
}

.flexi-stage span:first-child:before {
  left: 14px;
}

.flexi-stage span:last-child {
  border-radius: 0 5px 5px 0;
  /*this was to prevent glitches on hover*/
  padding-right: 20px;
}

/*hover/active styles*/

.flexi-stage span.active,
.flexi-stage span.active:after,
.flexi-stage span.active:hover,
.flexi-stage span.active:hover:after {
  background: #4cbbec;
}

.flexi-stage span.missed,
.flexi-stage span.missed:after,
.flexi-stage span.missed:hover,
.flexi-stage span.missed:hover:after {
  background: #dfe4e6;
}

.flexi-stage span.missed:hover,
.flexi-stage span.missed:hover:after {
  background: #bfc2c3;
}

.flexi-stage span.completed,
.flexi-stage span.completed:after,
.flexi-stage span.completed:hover,
.flexi-stage span.completed:hover:after {
  background: #86bf86;
}

/* After state changed */
.flexi-stage span.completed:hover,
.flexi-stage span.completed:hover:after {
  background: #71a071;
}

.flexi-stage span:hover,
.flexi-stage span:hover:after {
  background: #9c9c9c;
  cursor: pointer;
}

.flexi-stage span:hover span:before {
  color: #333333 !important;
}

/*adding the arrows for the breadcrumbs using rotated pseudo elements*/

.flexi-stage span:after {
  content: '';
  position: absolute;
  top: -4px;
  right: -18px;
  width: 40px;
  height: 36px;
  transform: scale(0.6) rotate(45deg);
  z-index: 1;
  background: #bbbbbb;
  box-shadow: 2px -2px 0 2px rgb(255, 255, 255), 3px -3px 0 2px rgba(255, 255, 255, 0.1);
  border-radius: 0 5px 0 50px;
}

/*we dont need an arrow after the last link*/

/*we will use the :before element to show numbers*/

.flexi-stage span:before {
  content: counter(flag);
  counter-increment: flag;
  border-radius: 100%;
  width: 17px;
  display: none;
  height: 17px;
  line-height: 17px;
  margin: 6px 0;
  position: absolute;
  top: 0;
  left: 30px;
  background: #fff;
  color: #bbbbbb;
  text-align: center;
  font-size: 10px;
  font-weight: bold;
}

.flexi-stage span {
  padding: 0 19px 0 22px;
  width: 150px;
  text-align: center;
  text-transform: capitalize;
}

.flexi-stage span input[type="checkbox"] {
  visibility: hidden;
}

.flexi-stage span:hover input[type="checkbox"] {
  visibility: visible;
}

.flexi-stage span:first-child {
  padding-left: 14px;
}

.flexi-stage label {
    margin: 2px;
    color: #ffffff;
    font-weight: normal;
}

.no-formcontrol .form-control {
  border-color: transparent;
}

.no-formcontrol:hover .form-control {
  border-color: #d8d8d8;
}

.mod-desp {
  padding-left: 7px;
  font-size: 11px;
  margin-top: -4px;
  color: gray;
  display: none !important;
}

.is_allocated {
  box-shadow: inset 3px 0px 0px 0px #25b726;
}

.is_par_allocated {
  box-shadow: inset 3px 0px 0px 0px #ef7372;
}

.is_dispatched {
  box-shadow: inset 3px 0px 0px 0px #ffd351;
}

.EmployeeInfo {
background: #fff !important;
    padding: 10px !important;
    border-radius: 4px;
    text-align: center;
    position: relative;
    padding-top: 27px !important;
    box-shadow: 0 6px 8px rgba(102, 119, 136, .03), 0 1px 2px rgba(102, 119, 136, .3);
}

.EmployeeInfo .form-control {
  border: 0;
  pointer-events: none;
  background: white;
}

.EmployeeInfo img {
  width: 70px;
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: inset 0 1.5px 3px 0 rgba(0, 0, 0, .15), 0 1.5px 3px 0 rgba(0, 0, 0, .15);
  margin-bottom: 5px;
  height: 70px;
  display: block;
}

.EmployeeInfo .name {
  font-size: 14px;
  font-weight: bold;
  margin-top: 6px;
  display: block;
}

.EmployeeInfo .job {
  color: gray;
  display: block;
}

.EmployeeInfo .mobile,
.EmployeeInfo .skype {
  display: none;
}

.EmployeeInfo .mobile i,
.EmployeeInfo .skype i {
  margin-right: 6px;
  font-size: 15px;
  text-align: right;
  position: relative;
  top: 2px;
}

.EmployeeInfo .skype i {
  color: #03A9F4;
}

.EmployeeInfo .mobile i {
  color: #a5a5a5;
}

.EmployeeInfo .mobile div,
.EmployeeInfo .skype div {
  display: inline-block;
  text-align: left;
}

.EmployeeInfo .mobile {
  border-top: 1px solid #e8e8e8;
  padding-top: 7px;
}

.EmployeeInfo .email a {
  color: #2196F3;
  display: none;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
}

.table-bordered {
  background-color: #fafafa;
}

.showupload {
  display: none;
  position: absolute;
  font-size: 10px !important;
  text-align: center;
  width: 100%;
  margin-top: 59px;
}

.showupload i {
  background: #2196F3;
  border-top: 0;
  border-right: 0;
  border-radius: 20px;
  color: white !important;
  text-align: center;
  width: 22px;
  height: 22px;
  line-height: 21px;
}

.EmployeeInfo:hover .showupload {
  display: block;
}

.white_bg {
  background: white !important;
  cursor: pointer !important;
}

.email_options {
  position: fixed;
  bottom: 0;
  z-index: 10;
  top: 90px;
  width: 240px;
  left: 0;
  background: rgb(255, 255, 255);
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed', GradientType=0);
  padding: 9px 0 6px 67px;
  font-size: 12px;
  border-right: 1px solid #e4e4e4;
  overflow: auto;
}

.email_body_header {
  position: fixed;
  background: white;
  top: 51px;
  bottom: 0;
  left: 587px;
  padding: 5px;
  right: 0;
  height: 39px;
  ;
  background: rgb(255, 255, 255);
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e5e5e5', GradientType=0);
}

.email_new {
  padding: 4px 51px;
  position: fixed;
  right: 0;
  left: 0;
  top: 51px;
  width: 240px;
  z-index: 12;
  background: rgb(255, 255, 255);
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e5e5e5', GradientType=0);
  height: 39px;
}

.email_options .categories {
  padding: 0 !important;
  margin-top: 7px;
}

.email_options b {
  margin: 9px 0 7px 0;
  display: block;
  color: #636262;
}

.email_options .categories li {
  margin-top: 3px;
}

.email_options .categories li:hover {
  background: #e4e4e4;
  cursor: pointer;
}

.email_options .categories li a {
  display: block;
}

.email_options .categories svg {
  width: 17px;
  height: 17px;
}

.email_lists2 {
  bottom: 0 !important;
}

.email_lists {
  position: fixed;
  right: 0;
  left: 240px;
  top: 90px;
  width: 348px;
  bottom: 26px;
  overflow-y: hidden;
  z-index: 9;
  text-transform: capitalize;
}

.email_lists:hover {
  overflow-y: overlay;
}

.email_search {
  position: fixed;
  right: 0;
  left: 240px;
  top: 51px;
  width: 347px;
  z-index: 12;
  height: 39px;
  background: rgb(255, 255, 255);
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e5e5e5', GradientType=0);

}

.disablebtn {
  opacity: 0.5;
}

.email_search .form-control {
  border: 1px solid #b9b9b9;
  box-shadow: none;
  margin-top: 6px;
}

.email_box {
  padding: 5px 15px;
  position: relative;
  padding-left: 20px;
  border-bottom: 1px solid #e8e8e8;
  background: white;
}

.email_box input[type="checkbox"] {
  position: absolute;
  left: 11px;
  top: 28px;
}

.email_box:hover {
  cursor: pointer;
  color: black;
  box-shadow: inset 3px 0px 0px 0px #3387e1;
}

.email_box:hover .nameAvatar span {
  background: #04a9f4;
}

.email_box:hover .nameAvatar span:first-letter {
  color: white !important;
}

.activeEmail .sender_name {
  font-weight: bold;
  color: white;
}

.activeEmail .sender_subject,
.activeEmail .sender_body {
  color: white !important;
}

.email_box .sender_name span {
  visibility: hidden;
  font-size: 10px;
  color: #525252;
  text-transform: none;
  font-weight: normal;
  padding: 0px 9px;
  background: #ffffff;
  border-radius: 2px;
  border: 1px solid #dadada;
  position: absolute;
  right: 9px;
  bottom: 5px;
}

.email_box:hover .sender_name span {
  visibility: visible;
}

.email_box .sender_body {
  height: 18px;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
  white-space: nowrap;
  color: gray;

}

.email_body {
  position: fixed;
  background: white;
  top: 134px;
  overflow-y: auto;
  left: 598px;
  padding: 10px;
  right: 10px;
  border-radius: 4px;
  max-height: 73%;
  min-height: auto;
  border: 1px solid #d6d6d6;
  text-align: justify;
}

.activeEmail {
  background: #3287e1;
  transition: 0.1s linear;
}

.email_subject {
  text-transform: capitalize;
  color: black;
  position: fixed;
  right: 11px;
  left: 598px;
  top: 95px;
  border-radius: 4px;
}

.email_subject h5 {

  color: #292929;
  text-shadow: 0 1px 0 #fff;
  font-size: 16px;
}

.email_subject i {
  font-size: 17px;
  line-height: 34px;
  margin-left: 6px;
}

/* .note-editable .table>tbody>tr>td {
  border: 1px solid #7d7d7d;
  padding: 5px;
} */

.invoice_total {
  width: 100%;
  background: gray;
}

.invoice_total td:nth-child(1) {
    font-weight: bold;
    padding-right: 8px;
    /* width: 64%; */
}

.invoice_total td {
    /* padding: 5px 0px; */
}

/* .invoice_total tbody {
    border-left: 2px solid #ececec;
} */

.hasDatepicker {
  background: white;
  cursor: pointer !important;
}

.from_date_title {
  position: absolute;
  z-index: 1;
  top: 4px;
  left: 23px;
  color: #454545;
  font-weight: bold;
  font-size: 10px;
}

.to_date_title {
  position: absolute;
  z-index: 1;
  top: 4px;
  left: 13px;
  color: #454545;
  font-weight: bold;
  font-size: 10px;

}

.from_date .form-control[readonly] {
  padding-left: 38px;
  font-size: 9px;
}

.to_date .form-control[readonly] {
  padding-left: 30px;
  font-size: 9px;
}

.note-editor .btn:active {
  box-shadow: none !important;
  background: #d0d6d9;
  transform: none !important;
}

.note-editor a {
  color: #03A9F4;
  text-decoration: underline !important;
}

.note-editor a:hover {
  cursor: pointer;
  color: blue;
}

.note-popover .popover-content .note-btn {
  font-size: 8px;

}

.note-btn i {
  color: black;
}
.note-btn {
  font-size: 11px !important;
}

.getAllEmails {
  position: absolute;
  right: 0px;
  top: 6px;
  padding: 4px 12px;
  background: white;
  color: #9e9e9e;
  border: 1px solid #b9b9b9;
  border-radius: 2px;
  height: 29px;
  border-left: 0;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.getAllEmails:hover {
  cursor: pointer;
  background-color: #f5f5f5;
  color: #6b6b6b;

}

.getAllEmails:active {
  background: #333333;
  color: white;
  border: 0;
}

.email_box:hover .email_filter {
  visibility: visible;
}

.email_filter {
  position: absolute;
  top: 7px;
  right: 7px;
  visibility: hidden;
}

.email_filter i {
  transition: none !important;
  display: inline;
  padding: 1px 3px;
  font-size: 12px;
  color: #5a5a5a;
}

.email_filter i:first-child:hover {
  border-color: red;
  color: red;
}

.email_filter i:first-child:active {
  background-color: red;
  color: white;
}

.email_filter i:last-child:hover {
  border-color: gray;
  color: gray;
}

.email_filter i:last-child:active {
  background-color: gray;
  color: white;
}

.summary-box {
    border-radius: 3px;
    padding: 8px;
    background-color: white;
    box-shadow: 0 6px 8px rgba(102,119,136,.03), 0 1px 2px rgba(102,119,136,.3);
}

.summary-box div:first-child {
    color: #737373;
    margin-bottom: 3px;
    font-size: 14px;
}

.summary-box div:nth-child(2) {
    font-weight: bold;
    font-size: 15px !important;
    color: #131313;
}

.mail-refresh {
  font-size: 16px;
  line-height: initial;
  padding: 19px;
  text-align: center;
  color: #d6d6d6;
  margin-top: 45%;
  cursor: pointer;
  border: 1px solid white;
}

.mail-refresh:hover {
  color: grey;
  border-top: 1px solid #e8e8e8;
  border-bottom: 1px solid #e8e8e8;
}

.mail-refresh:active {
  border-top: 1px solid grey;
  border-bottom: 1px solid grey;
}

.email_footer {
  position: fixed;
  z-index: 10;
  bottom: 0;
  right: 0;
  left: 0;
  border: 1px solid #e0e0e0;
  padding: 2px 31px 2px 62px;
  text-align: right;
  color: #000000;
  background: #f5f5f5;
  border-bottom: 0;
}

.email_compose {
  background: white;
  position: fixed;
  z-index: 90;
  right: 0;
  left: 240px;
  bottom: 0;
  top: 51px;
}

.email_compose_btn2 {
  padding: 0px 1px;
  font-size: 16px;
  color: #8c8c8c;
  border-radius: 2px;
  float: right;
  margin-right: -41px;
  margin-top: 4px;
  height: 28px;
  border: 1px solid transparent;
}

.email_compose_btn2:hover {
  cursor: pointer;
  background: #ffffff;
  color: #8e8e8e;
  border: 1px solid #b9b9b9;

}

.email_header {
  clear: both;
  padding: 2px 16px 7px 0px;
  height: 39px;
  background: rgb(255, 255, 255);
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e5e5e5', GradientType=0);
  color: #5d5d5d;
}

.send_email {
  display: block;
  padding: 5px 9px;
  color: #03A9F4;
  font-weight: bold;
}

.send_email:hover {
  background-color: #03A9F4;
  color: white;
  cursor: pointer;
}

.send_email:hover i {
  color: white;
}

.send_email i {
  font-size: 16px;
  float: left;
  padding: 2px 2px;
  color: #03A9F4;
  transition: none !important;
}

.sptt {
  padding: 4px 15px;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-color: #f1f1f1;
}

.tab_name {
font-weight: bold;
    width: 260px;
    display: inline-block;
    margin-bottom: 10px;
    font-size: 12px;
}

.tab_name i {
  background-color: #ffffff;
  border-radius: 10px;
  width: 16px;
  text-align: center;
  height: 16px;
  line-height: 15px;
  color: #c1c1c1;
  margin-right: 5px;
  border: 1px solid transparent;
}

.tab_name i:hover {
    cursor: pointer;
    background-color: #000000;
    color: #ffffff;
}

.tab_name-title {
  font-weight: normal !important;
  color: #757575;
}

.permission_name {
    width: 64px;
    text-align: center;
    display: inline-block;
    font-weight: bold;
    font-size: 12px;
}

.whencollapse {
    padding-top: 7px;
    margin-bottom: 4px;
}
.whencollapse:hover {
    background-color: whitesmoke;
}
.whencollapse2 {
  padding-top: 7px;
  background: #efefef;
}

.whencollapse2 .tab_name-title {
  pointer-events: none;
}

.rolesandper {
    max-height: 40vh;
    width: 1054px;
    overflow: auto;
    border: 1px solid #f1f1f1;
    padding: 14px 0!important;
}


/* .inherit {
  margin-right: 33px;
  width: 139px;
} */
.modulename div {
  margin-bottom: 10px;
  font-size: 14px;
  color: gray;
}

.modulename div i {
  margin-right: 4px;
}

.modulename div:nth-child(2) {
  padding-left: 16px;
  margin-bottom: 9px;
}

.modulename div:nth-child(3) {
  color: #000;
  padding-left: 30px;
  margin-bottom: 5px;
}

.modulename {
  padding: 14px 19px;
  box-shadow: 0px 1px 17px 1px #e0e0e0;
}

.tab_name .fa-expand,
.tab_name .fa-compress {
  font-size: 15px;
  color: #03A9F4;
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  -o-transform: rotate(135deg);
}

.tab_name .fa-expand:hover,
.tab_name .fa-compress:hover {
  background: white;
  border-radius: 0;
  border-color: white;
  color: black;
}

.dont-click2 {
  BACKGROUND: #f1f1f1;
  BORDER-COLOR: #d2d2d2;
  COLOR: #b7b7b7;
  pointer-events: none;
}

.allocatedAmount {
  box-shadow: inset 4px 0px 0px 0px #ffd351;
}

.zeroAllocatedAmount {
  box-shadow: inset 4px 0px 0px 0px #ef7372;
}

.promotionRow {
  box-shadow: inset 4px 0px 0px 0px #ef7372;
}

/* .greyedout {
  background: #f4f7f7 !important;
} */

.modal .overflow-visible {
  overflow: visible;
}

.showingmore {
  margin-left: 5px;
  color: #929292;
  display: inline;
  padding: 2px 7px;
  border-radius: 2px;
}

.showingmore:hover {
  cursor: pointer;
  background: #444444;
}

td .fa-external-link {
    padding: 4px 4px;
    border-radius: 2px;
    color: #6e727b;
    float: left;
    background-color: transparent;
}
td .fa-external-link:hover,td.fa-eye:hover {
       color: #0b8df5;
}

.ipadUsermessage {
  display: none;
}

td .fa2 {
  margin-right: 5px;
}

.showMoreoptions li {
  padding: 0px 11px;
  font-size: 12px;
}

.showMoreoptions label {
  margin-bottom: 0;
  color: white;
  font-weight: normal;
  cursor: pointer;
}

.showMoreoptions li:hover {
  background: #2f2f2f;
}

.showLessoptions li:hover {
  background: #2f2f2f;
}

.modal .table>tbody>tr>td {
  text-overflow: initial !important;
  white-space: normal !important;
  font-weight: normal;
  color: #585858;
}

.colorSelection div {
  height: 15px;
  width: 15px;
  display: inline-block;
  border-radius: 2px;
  border-width: 1px;
  border-style: solid;
  position: relative;
}

.colorSelection div:nth-child(1) {
  border-color: #b8d0e2;
}

.colorSelection div:nth-child(2) {
  border-color: #8bb395;
}

.colorSelection div:nth-child(3) {
  border-color: #d2ca8c;
}

.colorSelection div:nth-child(4) {
  border-color: #d69d90;
}

.colorSelection div:nth-child(5) {
  border-color: #d0d0d0;
}

.colorSelection div:hover {
    cursor: pointer;
    border-color: black;
}

.colorSelected{
    border: 2px solid #0000005c !important;
}

.popover-title {
    font-weight: 600;
}

/* .borderblue {
  border-bottom-color: #c5d7e4 !important;
}

.bordergreen {
  border-bottom-color: #9dc1a7 !important;
}

.borderyellow {
  border-bottom-color: #d6d68e !important;
}

.borderred {
  border-bottom-color: #f7ad99 !important;
} */

.borderwhite {
  border-bottom: 1px solid #ececec !important;
}

.activebtn i {
  color: #000000;
}

.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

.clearFlexi {
  font-size: 17px;
  color: darkgrey;
  margin-left: -26px;
  margin-top: 3px;
  float: right;
  width: 14px;
  background-color: white;
  z-index: 99999;
  position: relative;
  margin-right: 4px;
  text-align: center;
}

.clearFlexi:hover {
  cursor: pointer;
  color: #525252;

}

.ending_benifits i {
  color: #FF4500;
}

@media print {
  #left-sidebar {
    display: none !important;
  }

  header {
    border: 0 !important;
  }

  .dashboard-container {
    margin: 0 !important;
  }
}

.flexi-tags {
  background: white;
  padding: 4px 11px;
  margin-right: 5px;
  border-radius: 2px;
}

/* .flexiCol i {
  color: #828282;
  margin-left: 7px;
}  */
.flexiTableTag {
  padding: 3px 12px;
  border-radius: 2px;
  float: left;
  font-size: 11px;
  margin: 0 6px 9px 0px;
  background: #f5f5f5;
  word-wrap: break-word;
  position: relative;
  border: 1px solid #dedede;
}

.flexiTableTag::before {
  position: absolute;
  content: "x";
  right: 11px;
  font-size: 17px;
  color: gray;
  opacity: 0;
  cursor: pointer;
}

.nav-tabs .btn-group-sm {
  display: none;
}

.flexiTableTag:hover::before {
  opacity: 1;
}

.flexiTableTag:hover {
  background: #ffffff;
}

.modal .flexiTable {
  margin: 0;
}

.flexiTagHolder {
  background: #ffffff;
  position: fixed;
  bottom: 0;
  z-index: 9;
  padding: 10px 17px 15px;
  right: 104px;
  top: 51px;
  left: 59px;
  height: 84px;
  white-space: nowrap;
  overflow-x: auto;
  display: none;
}

.max-height2 {
  height: 27px !important;
  overflow-y: scroll;
}

.flexiTagDel {
  cursor: pointer;
  font-size: 14px;
  color: #ababab;
  position: relative;
  margin-left: 3px;
}

.flexiTagDel:hover {
  color: black;
}

.flexiSearchTag {
  padding: 6px 12px;
  background: #23bb28;
  color: white;
  border-radius: 2px;
  margin-left: 15px;
  display: inline-block;
}

.flexiSearchTag {
  color: white;
  cursor: pointer;
}

.allReport li a {
padding: 7px 16px 7px;
    display: block;
    color: #545454;
    font-size: 12px;
    border-top: 1px solid #e8e8e8;
}

th.flexiCol  .max-height {
      overflow-y: hidden !important;
}

.allReport li a:hover {
  cursor: pointer;
  color: #000000;
  background: whitesmoke;
}

.allReport li a:active {
  background: #e0e0e0;
}

.allReport li:last-child {
  border: 0;
}

.allReport .s-content {
    padding: 0;
    border-radius: 4px;
}

.allReport .s-box:hover .s-content {
  height: auto;
}

.allReport .s-title {
  padding: 7px 15px 7px;
  min-height: auto;
}

.sales_heading {
  margin: 0 0 14px 13px;
  font-weight: bold;
  font-size: 15px;
  color: black;
}

th.flexiCol .max-height {
  max-height: 27px;
}

.hiddenrange {
  visibility: hidden;
}

.pagination>li:last-child>a,
.pagination>li:last-child>span {
  border-top-right-radius: 25px;
  border-bottom-right-radius: 25px;
}

.pagination>li:first-child>a,
.pagination>li:first-child>span {
  margin-left: 0;
  border-top-left-radius: 25px;
  border-bottom-left-radius: 25px;
}

.adjustwidth .form-control {
  width: 89%;
}

.email_body_header .options a {
  background-color: white;
  font-size: 13px;
  padding: 2px 6px;
  border-radius: 4px;
  margin-right: 9px;
  border: 1px solid #bfbfbf;
  margin-left: 1px;
}

.email_body_header .options a:hover {
  border-color: black;
  color: black;
  cursor: pointer;
}

.note-toolbar .btn.active {
  background: #d0d6d9 !important;
  box-shadow: none !important;
}

.email_compose .ui-select-bootstrap>.ui-select-choices {
  width: 300px;
}

.email_compose .ui-select-multiple.ui-select-bootstrap {
  height: 29px;
  border: 0;
}

.bbg {
  border-bottom: 1px solid #c5c5c5;
}

.attachgridview ul li {
  background-color: white;
  float: left;
  width: 16%;
  padding: 8px 11px;
  margin-right: 5px;
  margin-bottom: 6px;
  position: relative;
  border-radius: 2px;
  border: 1px solid #dedede;
}

.attachgridview ul li:hover {
  box-shadow: inset 0 0 0 1px #03A9F4;
  cursor: pointer;
  border-color: #03A9F4;
}

/* File Type CSS  */
/* .pngclr .document-item::after,
.jpgclr .document-item::after,
.jpegclr .document-item::after,
.tiffclr .document-item::after,
.gifclr .document-item::after {
  background: rgb(157,157,183);
  background: -moz-linear-gradient(top, rgba(157,157,183,1) 0%, rgba(106,106,183,1) 100%);
  background: -webkit-linear-gradient(top, rgba(157,157,183,1) 0%,rgba(106,106,183,1) 100%);
  background: linear-gradient(to bottom, rgba(157,157,183,1) 0%,rgba(106,106,183,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9d9db7', endColorstr='#6a6ab7',GradientType=0 );
}

.docclr .document-item::after,
.docxclr .document-item::after {
  background: rgb(178,225,255);
  background: -moz-linear-gradient(top, rgba(178,225,255,1) 0%, rgba(0,131,247,1) 100%);
  background: -webkit-linear-gradient(top, rgba(178,225,255,1) 0%,rgba(0,131,247,1) 100%);
  background: linear-gradient(to bottom, rgba(178,225,255,1) 0%,rgba(0,131,247,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b2e1ff', endColorstr='#0083f7',GradientType=0 );
}
.pptclr .document-item::after,
.pptxclr .document-item::after,
.pdfclr .document-item::after  {
  background: rgb(254,187,187);
  background: -moz-linear-gradient(top, rgba(254,187,187,1) 0%, rgba(254,144,144,1) 45%, rgba(255,92,92,1) 100%);
  background: -webkit-linear-gradient(top, rgba(254,187,187,1) 0%,rgba(254,144,144,1) 45%,rgba(255,92,92,1) 100%);
  background: linear-gradient(to bottom, rgba(254,187,187,1) 0%,rgba(254,144,144,1) 45%,rgba(255,92,92,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#febbbb', endColorstr='#ff5c5c',GradientType=0 );
}
.xlsclr .document-item::after,
.xlsxclr .document-item::after {
  background: rgb(148,211,159);
  background: -moz-linear-gradient(top, rgba(148,211,159,1) 0%, rgba(0,198,19,1) 100%);
  background: -webkit-linear-gradient(top, rgba(148,211,159,1) 0%,rgba(0,198,19,1) 100%);
  background: linear-gradient(to bottom, rgba(148,211,159,1) 0%,rgba(0,198,19,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#94d39f', endColorstr='#00c613',GradientType=0 );
} */

/* .document-item {
  display: block;
  margin: 11px 0 12px 3px;
  position: relative;
  padding-left: 45px;
  color: black;
}

.document-item::before {
  position: absolute;
  width: 29px;
  height: 34px;
  left: 0;
  top: -7px;
  content: '';
  border: solid 2px #c5c5c5;
}

.document-item::after {
  content: 'file';
  content: attr(filetype);
  left: -4px;
  padding: 0px 2px;
  text-align: right;
  line-height: 1.3;
  position: absolute;
  background-color: #000;
  color: #fff;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
  top: 9px;
}

.document-item .fileCorner {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 11px 0 0 11px;
  border-color: white transparent transparent #c5c5c5;
  position: absolute;
  top: -7px;
  left: 22px;
} */

.documentdesp {
  width: 71%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #3c3c3c;
  font-weight: bold;
  float: right;
  margin-top: 7px;
}

.moredetails {
  -webkit-animation: slideIn .1s forwards;
  -moz-animation: slideIn .1s forwards;
  animation: slideIn .1s forwards;
  background: white;
  border-radius: 2px;
  padding: 9px;
  -webkit-box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.12), 0 1px 8px 0 rgba(0, 0, 0, 0.2);
  box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.12), 0 1px 8px 0 rgba(0, 0, 0, 0.2);
}

.highlightfile {
  box-shadow: inset 0 0 0 1px #03A9F4;
  cursor: pointer;
  border-color: #03A9F4 !important;
}

.previouscomments {
  padding: 15px 25px;
  position: relative;
  background: #f1f1f1;
  border-radius: 2px;
  text-align: justify;
  margin-bottom: 8px;
}

.commentsDeletebtn {
  position: absolute;
  top: 0px;
  right: 0px;
  padding: 1px 4px;
  background-color: white;
  color: gray;
  visibility: hidden;
  cursor: pointer;
}

.commentsDeletebtn:hover {
  color: red;
}

.previouscomments:hover .commentsDeletebtn {
  visibility: visible;
}

.setshow6 {
  background: #f1f1f1 !important;
  border-color: #e2e2e2 !important;
  color: #afafaf;
}
.exportFile {
    position: absolute;
    top: -16px;
    left: 83px;
    background: white;
    padding: 1px 7px;
    border-radius: 18px;
    color: #808080;
    box-shadow: 0 5px 14px 0 rgba(50,50,93,.1), 0 1px 6px 0 rgba(0,0,0,.07);
    z-index: 5;
    width: 25px;
    text-align: center;
}

.shadowbox:hover {
      box-shadow: 0 5px 14px 0 rgba(50,50,93,.1), 0 1px 6px 0 rgba(0,0,0,.07);
}
.shadowbox:hover .handle {
      color: #47bbef !important;
}
.exportFile:hover {
    color: #ffffff;
    cursor: pointer;
    background-color: #008eff;
}
.oval {
position: relative;
    right: 23px;
    z-index: 6;
    border-radius: 50%;
    padding: 3px 7px;
    top: 5px;
    box-shadow: 0 5px 14px 0 rgba(50,50,93,.1), 0 1px 6px 0 rgba(0,0,0,.07);
}
.oval:hover {
    transform: scale(1.1);
}

tbody.noborpl td i {
  padding: 3px 2px !important;
  width: 18px !important;
  margin-left: 2px;
  font-size: 9px !important;
}
.tableSettings3 {
    left: 30px !important;
}

.tableSettings4 {
  left: 80px !important;
}

.tableSettings2 {
    position: absolute;
    z-index: 3;
    left: 112px;
    top: -14px;
}

/* .table-responsive {
  overflow-x: inherit;
} */
.nameWidth {
  width: 13%;
}

.flexiaction i {
  margin-left: 7px;
  font-size: 10px;
  width: 20px;
  padding: 3px 3px;
  text-align: center;
  border: 1px solid #d4d4d4;
  border-radius: 2px;
  color: #909090;
}

.flexidel i:hover {
  color: black;
  border-color: #848484;
  cursor: pointer;
  box-shadow: 0 0 11px rgba(33, 33, 33, .2);
}

.animateGlobalClass i {
  animation-name: spin;
  animation-duration: 1000ms;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

.animateGlobalClass {
  background: black;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

/* .moverightsearch .flexi_search_btn {
margin-left: 36px;
} */

.dont-click i.fa-times {
    opacity: 0.4;
}
.spanlink {
      color: #2196F3;
}
.spanlink:hover {
      cursor: pointer;
      border-bottom: 1px solid #2196F3;
}
/* .nav-tabs .dont-click {
    pointer-events: none;
    opacity: 0.4;
} */

.modal .bodyContainer {
    max-height: 40vh !important;
}

/* Internal Email START */
.viewEmail {
  padding: 30px;
  border-radius: 4px;
  margin-bottom: 10px;
  position: relative;
  border: 1px solid #e6e6e6;
  margin-top: 8px;
}

.viewEmail:hover,
.viewEmail:hover .options {
  border-color: #e4e4e4;
  box-shadow: 1px 1px 1px 1px #0000000f;

}

.viewEmail .options {
  position: absolute;
  top: -12px;
  right: 15px;
  border: 1px solid #e6e6e6;
  background: white;
  border-radius: 4px;
  padding: 2px 3px 0px 3px;
  cursor: default;
}

.viewEmail a {
  padding: 4px 2px;
}

.viewEmail i {
  color: #5DB2FF;
  padding: 2px 3px;
  font-size: 15px !important;
}

.viewEmail i:hover {
  background-color: #eef7ff;
  cursor: pointer;
}

.disable-sign {
  opacity: 0.7;
  /* width: 180px;
  border-radius: 30px; */
}


.goBack {
  background: #e6e6e6;
  padding: 3px 12px 5px 12px;
  font-size: 15px;
  margin-bottom: 4px;
  border-radius: 2px;
}

.goBack:hover {
  background: #a7a7a7;
  color: white;
  cursor: pointer;
}

/* Internal Email END*/

.panel-info .panel-body span {
  float: left;
  font-weight: normal;
}

.select_mail {
  width: auto;
  border: 0;
  padding-left: 0;
  transition: all 0.1s linear;
  font-weight: bold;
}

.select_mail:hover {
  padding: 5px 5px;
  box-shadow: none;
  border: 1px solid #e5e5e5;
}

.attachment_area span {
    padding: 3px 9px;
    display: inline-block;
    word-break: unset;
    text-align: center;
    border-radius: 2px;
    cursor: default;
    background-color: #f9f9f9;
    color: black;
    position: relative;
    margin-bottom: 8px;
    border: 1px solid #dcdcdc;
}

.attachment_area span:hover {
    background: #e2e2e2;
    cursor: pointer;
}

.attachment_area span div {
  visibility: hidden;
  position: absolute;
  padding: 0px 6px;
  background: #e87f7f;
  border-radius: 16px;
  font-size: 7px;
  color: white;
  top: -9px;
  right: -6px;
  line-height: 17px;
  cursor: pointer;
}

.attachment_area span:hover div {
  visibility: visible;
}

.attachment_area {
    white-space: nowrap;
    overflow: auto;
    margin-top: 5px;
    border-radius: 2px;
}

.attachment_area b {
margin-bottom: 6px;
    color: #000000;
    width: 13%;
    display: inline-block;
}

.tab-grey-name {
    position: fixed;
    right: 21px;
    bottom: 45px;
    font-size: 38px;
    color: #748db7;
}

.t-allocatedstock {
  box-shadow: inset 2px 0px 0px #25b726;
}

.t-partiallyallocated {
  box-shadow: inset 2px 0px 0px #ef7271;
}

.t-stockreceived {
  box-shadow: inset 2px 0px 0px #ffd350;
}

.employee-label {
  position: absolute;
  top: 0;
  background: #64bb67;
  padding: 1px 6px;
  left: 0px;
  color: white;
  display: block;
  width: 100%;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.modal-backdrop.in {
  opacity: .7;
}

.template-design .modal-footer {
  border-top: 1px solid #eaeaea;
  padding-top: 10px;
  padding-bottom: 10px;
  background-color: #f9f9f9;
}


/* Template Design */
table td {
  padding-top: 2px;
  padding-bottom: 2px;
}

.template-text-right {
  text-align: right;
}

.temp-main-table {
  width: 100%;
  margin-top: 17px;
  float: left
}

.temp-left-area {
  float: left;
  width: 50;
  margin: 0 0 6px;
}

.temp-right-area {
  float: right;
  width: 50%;
}

table.temp-main-table tbody td {
  padding: 1px 4px 1px 4px;
}

.template-name {
  font-size: 19px;
  font-weight: bold;
  color: #2196F3;
  text-align: right;
}

.template-bottom-pad {
  padding-bottom: 10px;
}
.flexiTable .popover {
    min-width: 357px;
}

/* .temp-pad-left {
  width: 63%;
} */

.popover-content ol {
    margin: 0 !important;
    padding-left: 16px;
    font-size: 12px;
}
.popover-content ol li {
  list-style-type: decimal !important;
}
.temp-logo {
  margin-bottom: 10px;
}

.temp-logo img {
      max-width: 100px;
}

.temp-box {
  padding-right: 7px;
}

.template-design thead th {
    vertical-align: middle !important;
    padding-top: 3px !important;
    padding-bottom: 3px !important;
    color: #000000 !important;
    line-height: 15px !important;
    background-color: #f5f5f5 !important;
}

.reportHeading__left table tbody  td{
      padding: 2px 0 !important;
}
.emailUnreadSubject .emailsub {
    color: #2196F3;
    font-weight: bold;
}
.emailUnreadSubject .fa-circle {
    position: absolute;
    left: 2px;
    top: 34px;
    font-size: 7px !important;
    color: #2196F3;
} 
table.report-spacing-table tbody tr:nth-of-type(even) {
    background-color: #f8f8f8 !important;
}
/* table.report-spacing-table tbody tr {
    border-bottom: 1px solid #e8e8e8;
} */

.template-design tbody td {
    padding-top: 3px !important;
    padding-bottom: 3px !important;
    vertical-align: top;
    padding-left: 9px !important;
    padding-right: 9px !important;
}

.temp-highlight {
    color: #2196F3;
    font-weight: bold;
    padding-bottom: 0 !important;
}
.select2-chosen{
   display: block !important;
}

.temp-address-container {
  float: left;
  width: 32%;
}

.temp-total {
    text-align: right;
    color: #2196F3;
}

.ui-select-bootstrap .btn[disabled] {
  background: #f4f7f7;
  opacity: 1;
}

.custom-dropdown ul {
  padding-left: 0 !important;
}

.custom-dropdown li {
  padding: 2px 8px;
  list-style-type: none !IMPORTANT;
  font-size: 11px;
  cursor: pointer;
}

.custom-dropdown li:hover {
  background-color: #f3f3f3;
}

.panel-heading.note-toolbar .note-color .dropdown-menu {
  min-width: 363px;
  height: 224px;
}

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

.modal-open .modal {
  overflow-x: hidden;
  overflow-y: hidden;
}

.extraAlocated {
  border-color: #ffd350 !important;
}

.isActive2 {
    background-color: #ffffff;
    border-radius: 2px;
    cursor: pointer;
    position: relative;
}

.isActive2 span {
  color: #1f62d0;
}

.isActive2::before {
  content: '';
  position: absolute;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-right: 10px solid white;
  right: -22px;
}

.dropdown-menu2 {
  margin-left: 3px;
  min-width: 104px !important;
  border: 1px solid rgba(100, 100, 100, .4);
  border-radius: 0;
  box-shadow: 0 3px 8px rgba(0, 0, 0, .25);
}

ul.dropdown-menu2>li>a:hover {
  color: #000000 !important;
  background: #f3f3f3 !important;
}

ul.dropdown-menu2 li a {
  color: black !important;
  font-size: 11px !important;
  padding: 7px 5px 7px 10px !important;
}

.animateCaret .open .btn-default2 .fa-caret-up {
  transform: rotate(180deg);
  transition: 0.2s;
}

/* Report Css */

.reportHeading {
  clear: both;
}
 .addMarginBottom {
  padding-bottom: 150px;
}

.reportHeading__left {
  float: left;
  width: 60%;
}

.reportHeading__left__reportname {
    font-size: 16px;
    margin-bottom: 4px;
    color: #2196F3;
}

td.onHoldRed .fa-external-link {
  color:red;
}
.reportHeading__left__reportfilter {
    float: left;
    font-weight: bold;
    width: 100%;
}
.reportHeading__right {
    float: right;
    width: 40%;
    text-align: right;
  
}

.reportHeading__right__img {
    margin-bottom: 10px;
    max-width: 100px !important;
}

/* .reportHeading__right__img_resized {
  border: 1px solid whitesmoke;
} */

.reportHeading__right__companyname {
  font-size: 12px;
  text-align: right;
  font-weight: bold;
  margin-bottom: 20px;
  color: #25a0f5;
}

.makeModalFixed .modal-dialog {
    position: fixed;
    left: 0;
    right: 0;
    top: -30px;
}

.dropdown-menu .divider {
  margin: 0px 0;
}

.solid-border-left {
  border-left: 1px solid #d6d6d6 !important;
}

.solid-border-right {
  border-right: 1px solid #d6d6d6 !important;
}

.padding-num-right {
  text-align: right !important;
  padding-right: 18px !important;
}

.taskcontainer:first-child .bbh {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.taskcontainer:last-child .bbh {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.bbh {
  padding: 6px 8px;
  background: white;
  margin-bottom: 1px;
}

.tasktable {
  background-color: white;
}

.tasktable td,
.tasktable th {
  padding: 4px;
}

.modal-body .nav-tabs>li>a:hover:before,
.nav-tabs>div>li>a:hover:before {
  opacity: 0 !important;
}

.no-select {
  border: 0;
  background-color: white;
  background-image: none !important;
  font-size: 12px;
  font-weight: bold;
  margin-top: 4px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.taskdata,
.emaildata {
  padding: 7px 11px;
  border-bottom: 1px solid #eaeaea;
}

.taskListing:last-child .taskdata,
.taskListing:last-child .emaildata {
  border-bottom: 0;
}

.taskListing .taskname,
.taskListing .emailsub,
.taskListing .emailbo {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: bottom;
  width: 58%;
}

.emaildata {
  position: relative;
}

.emailda {
    white-space: nowrap;
    overflow: hidden;
    vertical-align: bottom;
    position: absolute;
    top: 29px;
    right: 12px;
    background-color: #ffffff;
    padding-left: 6px;
}

.taskListing .emailsub {
  width: calc(100% - 117px);
}

.emailmod {
    position: absolute;
    top: 5px;
    right: 11px;
    color: #607D8B;
    background: #ffffff;
    padding: 2px 0 3px 12px;
    border-bottom: 1px;
}
.emaildataactive .emailmod,.emaildataactive .emailda {
          background-color: #f3f9fe;
}
.focemail {
  background-color: red;
}

.focmodule {
  padding: 0px 11px;
  color: #607D8B;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 10px;
}

.focmodule:nth-child(3) {
  border: 0;
}

.taskListing .taskduedate {
  padding-left: 21px;
}

.taskListing .emailbo {
  color: gray;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  width: calc(100% - 118px);
}

.taskListing .taskpriority {
  margin-right: 4px;
  width: 12px;
  text-align: center;
  font-size: 13px;
}

.taskListing .taskhigh i {
  color: red;
}

.taskListing .tasklow i {
  color: #59b3fb;
}

.taskmodal .form-group {
  float: left;
  width: 100%;
}

.taskmodal .control-label {
  padding-top: 5px;
}

.linkedto {
  color: #00a1ea;
  padding: 2px 12px;
  border: 1px solid #c4e1ef;
  border-radius: 2px;
}

.borderrightjoin {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-right: 0;
}

.borderleftjoin {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.modaltabs .tab-pane {
  border: 1px solid #e6e6e6;
  overflow: auto;
  max-height: 49vh;
  border-radius: 2px;
  margin-top: -3px;
}

.modemaildownload {
  font-size: 13px;
  padding: 2px 11px;
  border-radius: 2px;
  color: #03A9F4;
  background: white;
  border: 1px solid #e4e4e4;
  margin-top: 16px;
}

.modemaildownload:hover {
  cursor: pointer;
  background-color: #03A9F4;
  color: white;
  border-color: #03A9F4;
}

.modattach {
  position: absolute;
  right: 8px;
  top: 50px;
  width: 22px;
  text-align: center;
}

.modattach i {
  font-size: 16px;
  transform: rotate(133deg);
  color: #dadada;
}

/* Added by Ahmad */
.dropdown-menu emailer>butlef {
  border: none;
  margin: 0;
  text-align: left;
}

/* Added by Ahmad end */

.ifnologo i {
  padding: 10px;
  font-size: 18px;
  background: #ffffff29;
  border-radius: 22px;
  width: 40px;
  height: 40px;
  text-align: center;
  line-height: 20px;
  color: #ffffff;
  margin-left: 6px;
}

/* .centercompany {
  padding-top: 10px;
} */

/* .note-editable table {
  width: auto !important;
  min-width: 300px;
} */

.email-area {
    margin-bottom: 4px;
    display: flex;
}

.email-area b {
  margin-top: 5px;
  display: inline-block;
  width: 9%;
}

.email-area .email-input {
  display: inline-block;
  width: 91%;
}

.headingreport {
  background: white;
  border: 0;
  text-align: center;
  font-weight: bold;
  font-size: 15px;
  padding: 9px 2px;
  border-bottom: 1px solid #dddddd !important;
  margin-bottom: 20px;
  color: black;
}

.moduleEmails_sender {
  padding-bottom: 12px;
}

.moduleEmails_sender_avatar {
  background: #f1f1f1;
  border-radius: 25px;
  width: 35px;
  height: 35px;
  text-align: center;
  font-size: 15px;
  font-weight: bold;
  color: #03A9F4;
  line-height: 32px;
  float: left;
  display: none;
}

/* .moduleEmails_sender_from b {
  font-size: 13px;
} */
/* .moduleEmails_sender_info {
  margin-left: 48px;
} */
.moduleEmails_sender_time>span,
.moduleEmails_sender_to>span {
  width: 29px;
  display: inline-block;
}

.moduleEmails_body {
  background-color: #f9f9f9;
  border: 1px solid #e6e6e6;
  overflow: auto;
  max-height: 40vh;
}

.moduleEmails_body .note-toolbar {
  display: none;
}

.moduleEmails_body .note-editor {
  border: 0 !important;
}

.moduleEmails_body .note-editable {
  background-color: transparent !important;
}

.moduleEmails_body .note-toolbar-wrapper {
  height: 0 !important;
}

.gem1 .note-editable {
  height: 150px !important;
  float: left;
  width: 100%;
  margin-top: 10px;
}

.tableSmall {
  width: 400px !important;
  border-collapse: collapse !important;
}

.tableSmall td {
  border: 1px solid #d2d2d2 !important;
}

.popover-content {
  word-break: break-all;
}

.modal-lg2 {
  width: 80%;
}

.ui-tooltip {
  position: absolute !important;
  z-index: 9999 !important;
  max-width: 300px !important;
  background: #000000 !important;
  border: 0 !important;
  color: white !important;
  box-shadow: none !important;
  font-size: 11px !important;
  padding: 1px 5px !important;
  border-radius: 3px !important;
  margin-top: -5px;
}

.modal {
  bottom: 0;
}

.displayflex {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}

.flexverticlecenter {
  -webkit-box-align: center;
  box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.mydocs {
  padding: 7px 14px;
  border-bottom: 1px solid #efebeb;
  position: relative;
  
}

.mydocs:hover,
.emaildata:hover {
  cursor: pointer;
  box-shadow: inset 3px 0px 0px 0px #2196F3;
}

.createdby {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.strike {
  background-color: #80808014 !important;
}

.strike .mynotessubject b {
  text-decoration: line-through;
  color: gray;
}

.strike .mynotesmodule {
  background-color: whitesmoke !important;
  border-color: #d2d2d2 !important;
  color: gray !important;
}

.mydocsname {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  display: block;
  width: calc(100% - 128px);
  font-weight: bold;
}

.ipwe {
    font-size: 12px;
    padding-top: 5px;
    color: black;
}

.desc1 {
    padding: 5px 10px;
    background-color: white;
    height: 67px;
    border-radius: 3px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.desc2 {
  color: #578ea9;
}

.desc3 {
  color: #888888;
}

.desc4 {
  margin: 0 auto;
}

.desf {
  text-transform: uppercase;
  color: #2196F3;
  font-size: 10px;
  margin-left: 9px;
  text-decoration: underline !important;
}

.attachmodname {
  position: absolute;
  top: 7px;
  right: 11px;
  font-size: 10px;
  font-weight: bold;
  color: #607D8B;
}

.mynotescomment {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  color: gray;
  width: calc(100% - 105px);
}

.mydocsrecord {
  display: block;
  width: calc(100% - 126px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mydocs img {
  height: 31px;
  float: left;
  margin-right: 6px;
  margin-top: 3px;
}

.focusedcomments {
    word-wrap: break-word;
    overflow: auto;
    max-height: 48vh;
    padding: 20px;
    margin-top: 5px;
    margin-bottom: 10px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}

.focusedcreated {
  font-weight: normal;
  font-size: 11px;
  color: gray;
  margin-right: 22px;
  margin-top: 7px;
}

.mynotesmodule {
    position: absolute;
    top: 7px;
    right: 11px;
    color: #607D8B;
}

.mynotessubject b {
  width: 64%;
  text-overflow: ellipsis;
  overflow: hidden;
  display: block;
  text-transform: capitalize;
  white-space: nowrap;
}

.desc55 {
  position: absolute;
  margin: auto;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  max-height: 275px;
}
.focusedStatus {
display: inline-block;
    font-size: 11px;
    padding: 3px 11px;
    border-radius: 2px;
    background-color: #ffffff;
    color: #000000;
    margin-left: 7px;
}

.mynotessubject .high {
  color: red;
  position: absolute;
  left: 7px;
  font-size: 14px;
}

.mynotessubject .low {
  color: #00a7f7;
  position: absolute;
  left: 4px;
  font-size: 14px;
}

.recurrence {
  margin-left: 4px;
  color: #b1b1b1;
}

.mynotesrecord {
  width: calc(100% - 105px);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  color: black;
}

.whitebg1 {
  background: white;
  display: inline-block;
  background-color: #fff;
  border-radius: 4px;
  border: 1px solid;
  border-color: #dadada;
  padding: 11px 13px;
  width: 100%;
}

.moduleEmails_sender_to {
  width: 335px;
  word-break: break-all;
}

.generatingPDF {
  margin-top: 1px;
  float: left;
  color: black;
  width: 18px;
  white-space: nowrap;
  overflow: hidden;
  font-size: 15px;
  position: relative;
  right: -217px;
  top: 4px;
  cursor: wait;
  background-color: white;
}

#pleaseNo x-flexi-select .col-md-8 {
  padding: 0;
  width: 100%;
}

.generatingPDF i {
  margin-right: 6px;
}

/* Filetype for Documents */

.document-item {
  display: inline-block;
  position: relative;
  float: left;
  height: 25px;
  width: 38px;
  top: 6px;
}

.document-item::before {
  position: absolute;
  width: 24px;
  height: 31px;
  left: 0;
  top: -2px;
  content: '';
  border: solid 1px #94b0bd;
  border-radius: 3px;
}

.document-item::after {
  content: 'file';
  content: attr(filetype);
  left: -4px;
  text-align: right;
  line-height: 1.3;
  position: absolute;
  background-color: #607D8B;
  color: #fff;
  font-size: 7px;
  text-transform: uppercase;
  top: 10px;
  border-radius: 2px;
  padding: 0px 3px;
}

.document-item .fileCorner {
  font-size: 30px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: #757575;
  line-height: 46vh;
  background-color: #f9f9f9;
}

.myfiletypeinner {
     font-size: 65px;
    border-radius: 3px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #d4d4d4;
    line-height: 256px;
    background-color: white;
    font-weight: 200;
}

.mailfrom {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 69%;
}

.modal .flexiTable #myModal .modal-dialog {
  margin-top: 18px !important;
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
}

.sidebarEmailAttach a {
  display: inline-block;
  padding: 2px 9px;
  font-size: 10px;
  border: 1px solid #e4e4e4;
  margin-right: 6px;
  border-radius: 2px;
  position: relative;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ipwe:hover .editModuleName {
  opacity: 1;
} 
.klip-toolbar-move:hover {
  background: #7caabd;
  border-color: #688996;
}
.editModuleName {
    float: left;
    margin-right: 6px;
    margin-top: 0px;
    font-size: 11px !important;
    padding: 4px 6px;
    opacity: 0.4;
}
span.totalHeader {
  font-weight: normal;
  font-size: 9px !important;
  margin: -5px 9px 0 0 !important;
}
.attachmentExtension {
    float: left;
    margin-right: 5px;
    text-transform: uppercase;
    margin: -2px 3px -2px -10px;
    padding: 2px 6px;
    color: #8c8c8c;
    font-weight: bold;
    /* background: rgb(196,196,196);
    background: linear-gradient(83deg, rgb(228, 228, 228) 0%, #ffffff 100%); */
}
.sidebarEmailAttach a:hover {
  border-color: #b5b5b5;
  color: #6d6d6d;
}

.sidebarEmailAttach {
  min-width: 0;
  border-radius: 2px;
  margin-left: 6px;
  position: absolute;
  right: 3px;
  background: white;
  overflow: auto;
  white-space: nowrap;
  padding-bottom: 5px;
  max-width: 31%;
  margin-right: 5px;
  margin-top: 16px;
}

.sidebar-email-attach {
    border: 1px solid #dcdcdc;
    display: inline-block;
    margin-right: 5px;
    border-radius: 2px;
    padding: 5px 11px 5px;
    position: relative;
    width: 179px;
    cursor: default;
    clear: both;
    background-color: #f9f9f9;
}

.sidebar-email-attach:hover {
  border-color: #cccccc;
}

.sidebar-email-attach:hover .sidebar-email-attach-remove {
  visibility: visible;
}

.sidebar-email-attach-remove {
    position: absolute;
    right: 0;
    background: #d8d7d8;
    text-align: center;
    top: 0;
    visibility: hidden;
    bottom: 0;
    line-height: 28px;
    font-size: 16px;
    color: #656565;
    cursor: pointer;
    width: 51px;
    border-left: 1px solid #d2d2d2;
}

.sidebar-email-attach-remove:hover {
    background: #ffffff;
    color: black;
}

.sidebar-email-attach-remove:active {
  background-color: #cccccc;
  color: #404040;
  border-left-color: #cccccc;
}

.sidebar-email-attach-name {
    color: black;
    text-overflow: ellipsis;
    overflow: hidden;
    width: calc(166px - 66px);
    float: left;
}

.sidebar-email-attach-size {
    color: gray;
    line-height: 15px;
    font-size: 10px;
    float: right;
    margin-top: 3px;
}

.sidebar-email-attachments-container {
    white-space: nowrap;
    overflow: auto;
    width: 94%;
    margin-left: 0.4%;
}

.sidebar-email-attach-size2 {
  position: absolute;
  top: 191px;
  letter-spacing: 0.3px;
  font-size: 10px;
  color: #000000;
}

/* .enableOverflow {
    overflow: auto;
    max-height: 465px;
} */

 

.matrixContainer .relocateHeaderUp {
  height: 35px !important;
  position: relative;
  top: 8px;
}
.matrixContainer .relocateHeaderDown{
  height: 35px !important;
  top: 0px;
} 
.smallWidth {
  width: 50% !important;
  margin: 0 auto;
}

.smallWidthContainer {
  width: 27cm !important;
}

.fixSummernote2 .note-editable,
.fixSummernote3 .note-editable {
  height: 180px;
  overflow: hidden;
}

.note-editor.note-frame .note-editing-area {
  overflow: auto;
  display: inline-block;
  width: 100%;
}

.panel-heading2.note-toolbar {
  padding: 0 0 5px 5px;
  margin: 0;
  float: left;
  border-bottom: 1px solid #d6d6d6;
  background: #f7f7f7;
  width: 100% !important;
}

.note-editor.note-frame:hover {
  border-color: gray;
}

.ShowHideAction {
  display: none;
}

.table-hover>tbody>tr:hover, .table>tbody>tr:hover {
    background-color: #f4faff !important;
}

.table-hover>tbody>tr:active,
.table>tbody>tr:active {
  background-color: #f4faff !important;
}

.horizontal1 {
  overflow: -moz-scrollbars-none;
}

#product_dilter_pop .modal-dialog {
    position: fixed;
    left: 15%;
    top: -23px;
}

.ui-select-bootstrap .btn[disabled] .text-muted {
  color: gray;
}

.ui-select-bootstrap .text-muted {
  color: black;
}

.makeBold {
  font-weight: bold !important;
}
.makeBold2 td {
  font-weight: bold !important;
  color: black;
}
.rightAlign {
  text-align: right !important;
}
.centerAlign {
    text-align: center !important;
}
.onholdborder {
  box-shadow: inset 0px -2px 0px 0px #f5bfbf;
}

.moveright {
  display: block;
  float: right;
  text-align: right;
}

.onholdborder:hover {
  box-shadow: inset 0px -3px 0px 0px #f5bfbf;
}

.template-design .modal-dialog {
  width: 950px !important;
}

.template-design .modal-body {
    max-height: 75vh;
    overflow: auto;
    padding: 40px !important;
}

.onholdcomment {
  font-size: 15px !important;
  left: 34px;
  top: 11px;
  color: red;
  position: absolute;
}

.onholdcomment:hover,
.onholdcomment2:hover {
  color: #6d6d6d;
  cursor: default;
}

.onholdcomment2 {
  font-size: 13px !important;
  color: red;
  margin-left: 5px;
}

.highlightdoc,
.highlightdoc,
.emaildataactive {
  background-color: #2196f30f;
  box-shadow: inset 3px 0px 0px 0px #2196F3
}

.white_bg2 {
  background: #fff !important;
  padding: 10px !important;
  border-radius: 2px;
  box-shadow: 0 6px 8px rgba(102, 119, 136, .03), 0 1px 2px rgba(102, 119, 136, .3);
}

/* .highlightdoc .mynotesmodule,.highlightdoc .attachmodname,.emaildataactive .emailmod{
    background-color: white;
} */
/* .enableOverflow {
    max-height: 385px;
    overflow: auto;
} */

/* Dashboard Css Start */

.klip-value-num-counter {
  font-weight: 600;
  font-size: 25px;
  margin-right: 6px;
}

.klip-value-desp-counter {
  font-size: 11px;
  letter-spacing: 1px;
}

.klip-value-desp-info a {
  display: block;
  font-size: 11px;
  color: #038fff;
  margin-left: 4px;
  padding: 2px 1px;
}

.klip-tabs {
  margin-top: 0;
  margin: -15px -15px -6px -15px;
  border-right: 0;
  border-left: 0;
  border-radius: 0;
  text-align: center;
  background: #f9f9f9;
  border-color: #e9ebee;
  border-top-color: white;
}

.activeEmailAccount {
  color: #0186ef !important;
}

.activeEmailArea {
position: relative;
}
/* .activeEmailArea::before {
    content: "\f105";
    position: absolute;
    display: inline-block;
    font-family: FontAwesome;
    top: -1px;
    left: -8px;
    color: #2196F3;
    font-size: 23px;
} */

/* .klip-body .table>thead>tr>th {
  background-color: #ffffff !important;
  border-bottom: 1px solid #ffffff !important;
} */
.klip-tabs li {
  margin-bottom: -1px;
  float: none;
  display: inline-block;
}
.col-md-12-margin-bottom .col-md-12 {
  margin-bottom: 7px;
}
.klip-tabs li a {
  padding: 5px 11px;
  border: 1px solid transparent;
  border-radius: 18px;
}

.klip-tabs li.active a {
  box-shadow: none !important;
  border-radius: 18px;
  border: 1px solid #e4e4e4 !important;
}

.klip-tabs li a:hover {
  border: 1px solid #e4e4e4 !important;
}

.klip-value-desp-info a:hover {
  text-decoration: underline !important;
  cursor: pointer;
}

.dashboardheader {
  position: fixed;
  background: #ffffff;
  padding-left: 200px;
  padding: 3px 23px 3px 58px;
  top: 51px;
  left: 0;
  right: 0;
  box-shadow: 1px 1px 1px 1px #0000000d;
  z-index: 7;
}

.klip {
    background-color: #FEFEFE;
    text-align: left;
    border-radius: 10px;
    transition: all 0.1s cubic-bezier(.25, .8, .25, 1);
    box-shadow: 0 6px 8px rgba(102,119,136,.03), 0 1px 2px rgba(102,119,136,.3);
}

.klip-toolbar {
    font-weight: 600;
    padding: 7px 15px 7px 10px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    display: block;
    position: relative;
    /* border-bottom: 1px solid #eaeaea;
    background-color: #3d3f3e; */
    border-bottom: 1px solid #8dbbce;
    background-color: #8dbbce;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    
}

.klip-toolbar-move {
  cursor: move;
}

.klip-toolbar-x-small .klip-toolbar-title {
    font-size: 1.2em;
    color: #ffffff;
    transition: all 0.1s;
    font-weight: 400;
}

.outer {
  display: table;
  position: absolute;
  height: 100%;
  width: 100%;
  bottom: 0;
  top: 0;
  right: 0;
}

.middle {
  display: table-cell;
  vertical-align: middle;
}

.inner {
  width: 400px;
  margin: 0 auto;
}

.klip-small .klip-body {
  height: 80px;
}

.klip-medium .klip-body,
.klip-large .klip-body {
  height: 216px;
}

.klip-body {
  padding: 10px;
  overflow: auto;
}

.klip-body table>tbody>tr>td {
    vertical-align: middle !important;
    text-overflow: ellipsis;
    overflow: hidden;
    border: 0;
    white-space: nowrap;
    padding: 6px 5px 6px 5px;
}

.klip-body .table>thead>tr>th {
    border: 0 !important;
    padding: 7px 5px;
    background-color: rgb(240, 242, 247) !important;
    color: rgb(80, 89, 107);
}

.klip-body .table-bordered {
  background-color: #f7f7f7 !important;
  border:0;
}

.widget-options {
  padding: 15px 15px;
  margin-bottom: 10px;
  position: relative;
  border-bottom: 1px solid #cecece;
}

.widgetimage {
  display: inline-block;
  width: 50%;
}


.widgetimage img {
  width: 100%;
}

.add-w-icon {
  font-style: normal;
  text-transform: capitalize;
  border: 1px solid #e6e6e6;
  padding: 3px 9px;
  border-radius: 2px;
  color: #3a97e0;
}

.add-w-icon:hover {
  border-color: #3a97e0;
  cursor: pointer;
}

.loadthis {
  pointer-events: none;
}

.selectedWidget {
  opacity: 0.5;
}

.widget-size {
  position: absolute;
  right: 12px;
  bottom: 11px;
  border-radius: 3px;
  text-transform: uppercase;
  font-size: 11px;
  border: 1px solid #e8e8e8;
  padding: 1px 7px;
  font-weight: bold;
}

.sortable-ghost {
  box-shadow: inset 0 0 0 1px black;
}

th.sortable {
  pointer-events: none !important;
}

.highlight-delete-widget {
  border-top-color: #ff00005e;
}

/* .highlight-reorder-widget {
  box-shadow: 0 1px 10px 0 rgba(0,0,0,0.2);
} */
.highlight-delete-widget:hover {
  border-top-color: #ff00005e;
}

.reduceOpacity {
  opacity: 0.6;
}

.reduceOpacity:hover {
  opacity: 1;
}

.selectedWidget:hover {
  opacity: 1;
}

.widget-desp {
  color: #6f6f6f;
  display: block;
  margin-bottom: 10px;
  padding-right: 10px;
}

.widget-name {
  margin-top: 0;
  font-weight: bold;
  font-size: 12px;
  margin-bottom: 4px;
}

.klip-small,
.klip-medium,
.klip-large {
  float: left;
  padding: 5px;
  border-radius: 4px;
}

.klip-small {
  width: 25%;
}

.klip-medium {
  width: 33.33333333%;
}

.klip-large {
  width: 50%;
}

/* Dashboard css End */

.total-value-header {
  position: absolute;
  right: 13px;
  font-size: 1.1em;
  color: #3a3a3a;
  font-weight: normal;
}

.total-value-header b {
  margin-right: 2px;
}

.total-value-header-margin {
    margin-left: 6px;
    display: inline-block;
    padding: 0 6px;
    /* background-color: #3d3f3e; */
    background-color: #8dbbce;
    border-radius: 3px;
    font-size: 10px;
    color: white;
    cursor: default;
}

.dont-click3 {
  pointer-events: none;
  cursor: not-allowed;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
  box-shadow: none;
  opacity: .65;
}

.klip .chartjs-size-monitor {
  display: none;
}

.show123:hover .small-invoice {
  visibility: visible;
}

.small-invoice {
  position: relative;
  width: 105px;
  padding: 0px 5px;
  border: 1px solid #b1b1b169;
  text-align: center;
  font-size: 9px;
  border-radius: 2px;
  height: 113px;
  margin-top: 9px;
  visibility: hidden;
}

.small-invoice-name {
  position: absolute;
  right: 6px;
}

.small-invoice-logo {
  position: absolute;
  left: 6px;
  font-size: 12px;
  color: gray;
}

.small-invoice-logo img {
  width: 22px;
}

.small-invoice-table {
  border-radius: 2px;
  height: 4px;
  background: #f3f3f3;
  margin-bottom: 6px;
}

.small-invoice-print-area {
  position: absolute;
  bottom: -2px;
  left: 5px;
}

.klip-toolbar-buttons .klip-move,
.klip-toolbar-buttons .klip-delete {
  float: left;
  margin-left: 2px;
}

.klip-toolbar-buttons {
  position: absolute;
  left: 0;
  top: 9px;
}

.movetoright {
  margin-left: 16px;
}

.klip-toolbar-buttons i {
    font-size: 18px;
    /* color: #9c9c9c; */
    color:white;
    padding: 3px;
    position: absolute;
    top: -4px;
}

.klip-delete i {
      /* color: #9c9c9c; */
      color:white;
}

.klip-delete i:hover {
  background-color: #5b8596;
  color: white;
  cursor: pointer;
  border-radius: 18px;
}

.klip-widget-dropdown.open .btn-default2 {
    z-index: 6;
    position: relative;
    border-color: #b9b9b9;
    color: #018fff;
}

.widget-options-dropdown {
    top: 29px;
  border-radius: 2px;
    border-color: #b9b9b9;
    min-width: 106px;
    z-index: 5 !important;
}

.widget-options-dropdown li span {
    color: black !important;
    font-size: 11px !important;
    display: block;
    padding: 2px 6px;
}

.widget-options-dropdown li span:hover {
  background: whitesmoke !important;
  cursor: pointer;
}

.klip-widget-dropdown i {
  color: #b1b1b1;
  margin-top: 2px;
}

.klip-widget-dropdown.open i,.klip-widget-dropdown.open {
  color: #018fff;
}

.removeback {
  position: relative;
  top: 3px;
  right: 5px;
}

.removeback i {
  font-size: 24px;
}

.removeback i:hover {
  cursor: pointer;
}

.removeback i:nth-child(1) {
  color: #74ce78;
}

.removeback i:nth-child(1):hover {
  color: green;
}

.removeback i:nth-child(2) {
  color: #b5b5b5;
}

.removeback i:nth-child(2):hover {
  color: #676767;
}

tr.dont-click4 {
  pointer-events: none;
}

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

.low-op2 {
    opacity: 0.3;
}

tr.dont-click4 td {
  background-color: #f1f1f1;
  color: #000000 !important;
  opacity: 0.5;
}

.row-left-green {
  box-shadow: inset 2px 0 0 0 #06d606;
}

.row-left-orange {
  box-shadow: inset 2px 0 0 0 #FF9800;
}

.row-left-red {
  box-shadow: inset 2px 0 0 0 red;
}

.open .img-circles {
  transform: scale(0.9);
}

.reportHeading2 {
    margin-top: 23px;
    border-radius: 3px;
    margin-bottom: 150px;
}

.startdate {
  width: 50%;
  float: left;
  margin-right: 5px;
}

.enddate {
  width: 48%;
}

.makespace {
  float: right;
  width: 73%;
}

.makespace2 {
  width: 25%;
  float: left;
  margin-right: 5px;
}

.table>tbody+tbody {
  border-top: 1px solid #ececec;
}

.taskfullname .high {
  color: red;
  margin-right: 7px;
  font-size: 17px;
}

.taskfullname .low {
  color: #2196F3;
  margin-right: 3px;
  font-size: 17px;
}

.taskfullname {
  color: black;
  margin-top: 4px;
}

.widgetOptionsTag {
    display: inline-block;
    padding: 0 6px;
    border-radius: 3px;
    font-size: 10px;
    color: #ffffff;
    font-weight: bold;
    box-shadow: inset 0px 0px 0px 1px;
}
.widgetOptionsTag:hover {
    /* color: #000000; */
    color: #6a99ad;
    cursor: pointer;
    background-color: #ffffff;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
  float: left;
  display: none;
}
.pad5 td {
  padding: 5px !important;
}
/* New Email */
.sideBarEmailCollapse i {
    width: 20px;
    text-align: center;
    cursor: pointer;
}
.sideBarEmailCollapse li:hover {
  cursor: pointer;
  background-color: #00a4fa;
  color: white;
  border-radius: 2px;
}
.sideBarEmailCollapse li {
  margin-top: 6px;
  width: 100px;
}
.activeInbox {
    background-color: #00a7f7;
    border-radius: 2px;
    color: #ffffff;
}
.emailBox {
  padding: 3px 0 3px 0px !important;
  border-bottom: 1px solid #f3f3f3;
}
.emaildata2 {
  height: 75px;
}
.emailBox li.hoverMailIt:hover {
  background-color: #fbf8f8;
}
.emailBox b {
  cursor: pointer;
  font-weight: normal;
}

.abc {
    float: left;
    margin: 4px 0px;
    padding: 6px 7px;
    width: 100%;
    position: relative;
    border: 1px solid #dadada;
    border-radius: 4px;
    box-shadow: 1px 1px 1px 1px #0000000d;
}
.def {
    white-space: nowrap;
    font-weight: bold;
    width: calc(100% - 57px);
    overflow: hidden;
    text-overflow: ellipsis;
}
.hij {
    float: left;
    color: #4a4a4a;
}
.klm {
font-size: 10px;
    margin-right: 2px;
    color: #b97209;
    position: absolute;
    top: 7px;
    right: 6px;
}

.opq {
    position: absolute;
    top: 0;
    right: 0;
    padding: 1px 5px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 2px;
    color: white;
    display: none;
}
.taskCompleted {
  background-color:#4CAF50;
}
.taskCompletedBorder {
  border-color: #4CAF50;
}
.taskDue {
 background-color: #ff9800c7;
}
.taskDueBorder {
  border-color: #ff9800c7;
}
.taskOverDue {
    background-color: #f9887f;
}
.taskOverDueBorder {
  border-color: #f9887f;
}

.padTopBot td {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
}

.fixedModal .modal-dialog {
    position: fixed;
    left: -143px;
    right: 0;
    top: -44px;
}

.border-right-dash {
              border-right: 1px solid #c7c7c7 !important;
}
.tableBorder {
    border: 1px solid #dadada;
}
.centerAlign {
  text-align: center !important;
}
tr.rightMoreOptions:hover .moreOptionsArrow {
  visibility: visible;
}
.moreOptionsArrow {
  visibility: hidden;
  position: absolute;
  left: 0px;
  background: #71b0e2;
  padding: 0px 1px;
  color: white;
  height: 39px;
  text-align: center;
  line-height: 41px;
  font-size: 5px;
  top: 0;
}
.moreOptionsArrow:hover {
  background: #008eff;
  color: white;
  cursor: pointer;
}
.dropmenu-white {
    border-radius: 2px;
    left: 2px !important;
}
.dropmenu-white a {
    padding: 5px 7px !important;
    color: black !important;
    letter-spacing: 0 !important;
}
.dropmenu-white a:hover {
    background-color: #ffffff !important;
    border-radius: 2px !important;
    color: #018fff !important;
}

.temp-company-address table td,.temp-address-container table td,.table-no-padding td  {
      padding: 2px !important;
}
.checkboxHide {
    visibility: hidden;
    vertical-align: 0 !important;
    margin: auto !important;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}
.checkboxShow {
  position: relative;
  background-color: red;
}
.checkboxShow:hover .checkboxHide {
  visibility: visible;
}
.checkboxShow:hover span {
  visibility: hidden;
}
.width100 {
    width: 100% !important;
}

.x-box {
    font-size: 14px;
    color: black;
    padding: 8px 15px 8px;
    background: #ffffff;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…EiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #ffffff 0%, #f6f6f6 47%, #ededed 100%);
    background: -webkit-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%);
    background: linear-gradient(to bottom, #ffffff 0%,#f6f6f6 47%,#ededed 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 );
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

table.alternateRowColor tr:nth-child(even) td{
    background: whitesmoke !important;
}

.assignTo {
  position: relative;
}
.assignTo__show {
    position: absolute;
    right: 0;
    padding: 6px;
    z-index: 9;
    background-color: white;
    border-radius: 3px;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26), 0 2px 10px 0 rgba(0, 0, 0, 0.16);
    padding: 10px;
    top: -5px;
}
.assignTo__show table th, .assignTo__show table>tbody>tr>td  {
      font-size: 11px;
}
.assignTo__show .form-control {
      font-size: 11px;
}
.openLink {
    background: #2196F3 !important;
    color: white !important;
}
.noAssign {
  pointer-events: none;
  opacity: 0.5;
}
.assignTo .fa-link,.assignTo .fa-angle-right {
font-size: 15px;
    color: #2196F3;
    background: white;
    border-radius: 20px;
    margin-top: -4px;
    height: 30px;
    width: 30px;
    text-align: center;
    line-height: 30px;
    position: relative;
    z-index: 99;
    box-shadow: inset 0 0 0 1px #dedede;
}
.assignTo .fa-angle-right {
    color: #888888;
    right: 5px;
    top: 3px;
}
.assignTo .fa-link:hover,.assignTo .fa-angle-right:hover {
    cursor: pointer;
    background-color: #e4e4e4;
}


@keyframes animationFrames{
  0% {
    opacity:0;
    transform:  translate(0px,-25px)  ;
  }
  100% {
    opacity:1;
    transform:  translate(0px,0px)  ;
  }
}

@-moz-keyframes animationFrames{
  0% {
    opacity:0;
    -moz-transform:  translate(0px,-25px)  ;
  }
  100% {
    opacity:1;
    -moz-transform:  translate(0px,0px)  ;
  }
}

@-webkit-keyframes animationFrames {
  0% {
    opacity:0;
    -webkit-transform:  translate(0px,-25px)  ;
  }
  100% {
    opacity:1;
    -webkit-transform:  translate(0px,0px)  ;
  }
}

@-o-keyframes animationFrames {
  0% {
    opacity:0;
    -o-transform:  translate(0px,-25px)  ;
  }
  100% {
    opacity:1;
    -o-transform:  translate(0px,0px)  ;
  }
}

@-ms-keyframes animationFrames {
  0% {
    opacity:0;
    -ms-transform:  translate(0px,-25px)  ;
  }
  100% {
    opacity:1;
    -ms-transform:  translate(0px,0px)  ;
  }
}
.paginationDirective li {
    display: inline-block;
    margin-right: 3px;
    padding: 1px 5px;
    border-radius: 2px;
    border: 1px solid #eaeaea;
    text-align: center !important;
}
.paginationDirectivePages {
    border-color: white !important;
    text-align: center !important;
    margin: 0 !important;
}
.paginationDirectiveForm {
  margin-left: 5px;
}
.paginationControl {
padding: 0px 4px;
    border-radius: 2px;
    border: 1px solid #eaeaea;
    margin: 0 3px 0 3px;
    width: 44px;
}
.paginationDirective li:hover {
    cursor: pointer;
    background-color: #2196F3;
    border-color: #2196F3 !important;
}
.paginationDirective li:hover a {
  color: white;
}
.paginationWrapper:hover .paginationDirective li,
.paginationWrapper:hover .paginationControl{
  border-color: #cacaca;
}

.migrationCounter {
    display: inline-block;
    text-align: center;
    background-color: #ffffff;
    padding: 4px 8px;
    border-radius: 50%;
    font-weight: bold;
    margin-right: 6px;
    color: #008cfb;
    box-shadow: 0 5px 14px 0 rgba(50,50,93,.1), 0 1px 6px 0 rgba(0,0,0,.07);
}

.totalFont td {
    padding-bottom: 10px;
}

.fixitthtd tr th,.fixitthtd tr td  {
    width: 6.25% !important;
}

.form-control-stack {
    height: 14.2px !important;
    padding: 2px !important;
    font-size: 9px !important;
    letter-spacing: 0.3px;
}
.form-control-stack:nth-child(1) {
    border-bottom: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
.form-control-stack:nth-child(1):hover {
  box-shadow: inset 0 -1px 0 0 #bbbbbb !important;
}
/* .form-control-stack:nth-child(2) {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
} */
.form-control-stack:nth-child(1):focus {
        box-shadow: inset 0 -1px 0 0 black !important;
}
.modal .flexiTable .pinnedBody {
  max-height: 40vh;
}
.flexiTable .bodyContainer td.flexiCol{
    padding-top: 3px;
    padding-bottom: 3px;
}
.link-item .panel-info {
    border: 0;
    min-height: auto !important;
    margin-left: 1.5px;
}
.link-item .col-md-8 {
    /* float: right; */
    width: 42% !important;
    padding: 0;
    margin-left: -1px;
}
.left-margin-6 {
  margin-right: 6px !important;
}
.flexiTable input[type="number"]::placeholder {
  text-align: left;
}
.flexiTable input[type="number"]:-ms-input-placeholder {
  text-align: left;
}
.flexiTable .fa-sort-asc{
    font-size: 9px;
    position: relative;
    top: 2px;
}
.flexiTable .fa-sort-desc {
    font-size: 9px;
    position: relative;
    top: -1px;
}
.table-condensed2 td {
    padding-top: 3px !important;
    padding-bottom: 3px !important;
}
/* .border-divide-right {
      border-right: 1px dotted #b1b1b1 !important;
}
.border-divide-left {
      border-left: 1px dotted #b1b1b1 !important;
} */
.matrixcontainer {
    display: inline-block;
    width: 100%;
    padding: 10px;
    color: white;
    border-radius: 3px;
    padding-bottom: 14px;
    background-color: #232323;
}
.matrixcontainer2 {
    display: inline-block;
    width: 100%;
    padding: 10px;
    color: white;
    border-radius: 3px;
    padding-bottom: 5px;
    background-color: #232323;
}
.matrixcontainer .control-label,.matrixcontainer2 .control-label{
  color: white;
}
.matrixcontainer h4{
    color: white;
    margin-top: 0px;
    font-size: 23px;
    padding-left: 14px;
    margin-right: 27%;
    margin-bottom: 9px;
}
.matrixcontainer2 h4{
    color: white;
    margin-top: 0px;
    font-size: 23px;
    padding-left: 14px;
    margin-right: 27%;
}
/* 
.bgshade {
    background-color: #d5ecf7 !important;
    border-bottom: 1px solid #a3c2d0 !important;
}
.bgshade2 {
    background-color: #eaf4f9 !important;
    border-bottom: 1px solid #d3e7f1 !important;
} */

.ShowHideBox .matrixBox {
  padding: 0;
}
.ShowHideBox .matrixBox i {
    position: absolute;
    left: 32%;
    font-size: 18px;
    padding: 4px 11px;
    border-radius: 50px;
}
.matrixBox {
  padding: 5px 8px 15px;
  background-color: #232323;
  margin-top: 8px;
  color: white;
  border-radius: 3px;
}
.matrixBox i {
    padding: 2px 7px;
    background: black;
    font-size: 15px;
    border-radius: 12px;
    margin-top: 9px;
}

.matrixcontainer3 .input-symbol {
    display: inline-block;
    width: 113px;
}
/* .matrixcontainer3 .input-symbol .form-control:hover {
      box-shadow: inset 0 0 0 1px !important;
} */
.mtic {
    font-size: 17px;
    position: relative;
    top: 3px;
    left: 5px;
    color: #05a005;
}
.mtic:hover{
    cursor: pointer;
    color: #096d09;
}
.padright10 {
      padding-right: 10px !important;
}
.tooltips_clsshilight span.pull-right:hover {
  text-decoration: underline;
}

/* .highlightColBoth {
    border-left: 1px solid #B3C5D7;
    border-right: 1px solid #B3C5D7;
    margin-left: -0.9px;
} */
.highlightColRight {
    border-right: 1px solid #B3C5D7;
}
.highlightTh {
    background: rgb(177,197,215);
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…EiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, rgba(177,197,215,1) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(top, rgba(177,197,215,1) 0%,rgba(255,255,255,1) 100%);
    background: linear-gradient(to bottom, rgba(177,197,215,1) 0%,rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b1c5d7', endColorstr='#ffffff',GradientType=0 );
    color: #354a5d !important;
}
.text-primary {
  color: #607D8F !important;
  pointer-events: none;
}

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

.hr_matrix_mon {
    display: inline-block;
    width: 15px;
    font-weight: normal;
}
.hr_matrix_mon_hol {
    background-color: #249eff;
    color: white;
}

.hr_label {
    border-radius: 2px;
    padding: 2px 14px;
    font-size: 10px;
    color: white;
    display: block;
}
.hr_sickleave {
      background: orange;
}
.hr_present {
      background: #4CAF50;
}
.hr_leave {
  background-color: #ff7979;
}
.hr_nopadding {
      padding: 0;
}

.activeRangeHighlight {
    background: #88a1bf !important;
    color: white !important;
}
.activeRangeHighlight,.activeRangeHighlightBorder,
.activeRangeHighlightDate,.highlightTh,.dateHighlighter,.tooltips_clsshilight {
  transition: 0.3s;
}
/* .activeRangeHighlightBorder .tooltips_clsshilight{
  color: #3d5f88 !important;
} */
.activeRangeHighlightDate  {
    color: #176e98;
}

.checkedCounter {
    margin-right: 11px;
}
.tooltips_clsshilight:hover {
    text-decoration: underline !important;
}

.matrixDate .form-control,.matrixDate2 .form-control  {
    background-color: #222222!important;
    color: white !important;
    border: 1px solid #222222 !important;
    border-radius: 5px;
}
.matrixDate2 .form-control:hover ,.matrixDate .form-control:hover {
    background-color: #444444 !important;
}
.matrixDate i ,.matrixDate2 i{
color: white !important;
}
.matrixcontainer3 .report-default {
        padding: 5px 8px;
            margin-top: 2px;
}
.matrixSearch {
    vertical-align: bottom;
    border-radius: 2px;
    background-color: #3ea756;
    color: white;
    box-shadow: none;
    border-color: #3ea756;
    border-radius: 5px;
}
.matrixSearch:hover {
      color: white;
    background-color: #28bd4a;
    border-color: #28bd4a;
}

.note-fontname {
  display: none;
}
/* Reports Styling */

    table.report-spacing tbody td {
      padding-top: 3px !important;
      padding-bottom: 3px !important;
    }

    .report-generate {
      font-size: 11px;
      font-weight: bold;
      background-color: #33a238;
      color: white !important;
      padding: 4px 8px;
          border-radius: 2px;
    }

    .report-generate:hover {
      background-color: #318035;
  }
  .report-clearfilter:hover {
    background-color: #616161;
}
.report-default:hover {
  background: #006fca;
}
    .report-default {
      font-size: 11px;
      font-weight: bold;
      background-color: #0681e6;
      color: white !important;
          padding: 4px 8px;
          border-radius: 2px;
    }
    .report-clearfilter{
      font-size: 11px;
      font-weight: bold;
      background-color: #7d7d7d;
      color: white !important;
          padding: 4px 8px;
          border-radius: 2px;
    }

    .a-content {
    width: 950px;
    clear: left;
    padding: 20px;
    margin: 0 auto;
    position: relative;
    background-color: #58585824;
    margin-top: 10px;
    margin-bottom: 9px;
    border-radius: 3px;
    }

    .a-report-title {
      padding-left: 11px;
      color: #2c98ef;
      margin-bottom: 5px;
    }

    .a-report-date {
      padding-left: 11px;
      display: inline-block;
      margin-bottom: 5px;
    }

    .a-table tbody tr:nth-of-type(even) {
      background-color: #f8f8f8 !important;
    }

    .a-table {
    margin: 0 auto;
    width: 950px;
    background-color: white;
    padding-top: 4px;
    border-radius: 3px;
    padding-bottom: 4px;
    }

    .add-filter {
    cursor: pointer;
    color: #ffffff;
    }
    .add-filter:hover {
    color: #0681e6;
    }

    .a-title-relative {
      position: relative;
      top: -9px;
    }

    .a-margin-left {
    margin-left: 8px;
    font-size: 10px;
    }

    .report-box {
      margin-bottom: 4px;
      display: block;
    }

    .a-date {
      width: 165px;
      display: inline-block;
    }

    .a-form-control {
      width: 200px;
      display: inline-block;
    }

    .a-title {
      width: 100px;
      display: inline-block;
    }

    .report-filter-panel {
      margin-top: 20px;
    }
    .report-excel {
      display: inline-block;
    }
    .report-excel .caret {
      color: white;
    }
    .report-excel .dropdown-menu {
    min-width: 80px;
    border-radius: 3px;
    margin-top: 3px;
    }
    .report-excel .dropdown-menu li a {
    color: #0788ef;
    padding: 4px 8px !important;
    width: 100%;
    font-size: 11px;
    }
    .report-excel .dropdown-menu li a:hover {
    background: #f1f1f1;
    color: #0788ef;
    }
    .add-filter.collapsed:after {
    font-family: "FontAwesome";
    content: "\f0d7";
    margin-left: 5px;
    } 
    .add-filter:after {
   font-family: "FontAwesome";
    content: "\f0d8";
    margin-left: 5px;
    } 
  .a-table table tbody td, .a-table table thead th {
      padding-top: 3px !important;
      padding-bottom: 3px !important;
      font-size: 11px;
  }
  .a-table table.template-design thead th {
    padding: 3px 9px !important;
    color: black !important;
}
.a-content .btn-default2, .a-content .btn-submit2 {
  padding: 4px 8px;
  box-shadow: none;
}

    .no-top-margin {
      margin-top: 0 !important;
    }
    .a-content label {
      color: black;
      cursor: pointer;
    }
    .a-content .form-control, .a-content .panel-info {
    border: 1px solid #b9b9b9 !important;
    border-radius: 4px;
}
table.hr_martix_container td {
    padding: 3px 9px !important;
    background: #f8f8f8 !important;
    border: 1px solid white !important;
    cursor: default;
}
table.hr_martix_container th {
    color: #ffffff !important;
    border-right: 1px solid #20242d !important;
    border-color: #1f232c;
    box-shadow: inset 0 0 0 18px #444444;

}
.matrixcontainer3 .panel-info,.matrixcontainer3 .form-control {
    border-radius: 5px;
}
.hr_matrix_weekend {
    box-shadow: inset 0 0 0 23px #222222 !important;
}
table.hr_martix_container tbody tr:nth-child(odd) td {
    box-shadow: inset 0 0 0 22px white;
}
.hr_leave-highlight  {
    display: block;
    border-radius: 3px;
    color: white;
    padding: 2px;
    background: #93cff9;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzkzY2ZmOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMmE5ZjciIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(left, #93cff9 0%, #02a9f7 100%);
    background: -webkit-linear-gradient(left, #93cff9 0%,#02a9f7 100%);
    background: linear-gradient(to right, #93cff9 0%,#02a9f7 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#93cff9', endColorstr='#02a9f7',GradientType=1 );
}
.hr_leave-highlight a:hover {
  text-decoration: underline !important;
}
/* .report-excel .dropdown-menu:after {
    content: '';
    display: inline-block;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #ffffff;
    position: absolute;
    top: -6px;
    left: 8px;
} */
.subs-container_child {
    background: white;
    width: 176px;
    height: 213px;
    margin: 10px;
    transition: 0.1s all;
    float: left;
    padding: 11px;
    box-shadow: 1px 2px 9.87px 1.13px rgba(0, 0, 0, 0.18);
    border-radius: 4px;
    position: relative;
    background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.74)),url(report-BG.jpg);
    background-size: 333px 291px;
    background-repeat: no-repeat;
    background-position: -73px -68px
}
.subs-container_parent {
    width: 1000px;
    margin: 35px auto;
}
.subs-container_parent h3 {
    margin-bottom: 29px;
}
.subs-number{
    font-size: 67px;
    height: 101px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    font-weight: 300;
    color: #0d2c72;
    position: relative;
}
.subs-number small {
    font-size: 20px;
    font-weight: bold;
    position: absolute;
    right: 9px;
    color: black;
    top: 58px;
}
.subs-text-large{
    font-size: 20px;
    /* height: 101px; */
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    /* font-weight: 300; */
    color: #0d2c72;
    margin-top: 25px;
}
.subs-text-small{
    font-size: 10px;
    /* height: 101px; */
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    /* font-weight: 300; */
    /* margin-top: 6px; */
    color: #0d2c72;
}
.subs-desp {
   font-weight: bold;
    height: 40px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    position: absolute;
    bottom: 8px;
    left: 0;
    font-size: 12px;
    right: 0;
    padding: 10px;
}
.subs-icon {
   font-size: 42px;
}
.subs-icon img {
    width: 33px;
    height: 38px;
    margin-top: 11px;
}
.fave-report {
    width: 30px;
    text-align: center;
    padding: 7px;
    border-top: 1px solid #e8e8e8;
    float: left;
    line-height: 19px !important;
    font-size: 14px !important;
    color: gray;
    padding-right: 0;
    padding-left: 0;
    padding-bottom: 8px;
}
.fave-report:hover {
    color: #000000 !important;
    cursor: pointer;
    background-color: #f1f1f1;
}
.allReport li a.fave-report-desp {
    display: inline-block !important;
    width: calc(100% - 30px) !important;
    padding-left: 6px !important;
}
.s-box i.fa-star {
    color: #989898;
}
.s-box li:hover i.fa-star-o {
    color: #3f8bc6;
}
.attachment_area span a {
    color: #2196F3;
}

.move-left-help {
    left: 33px !important;
}
.move-left-excel {
    left: 66px !important;
}
.move-left-search {
      left: 97px !important;
}
.subs-container_hover:hover {
  cursor: pointer;
}
.subs-container_hover:hover  {
    cursor: pointer;
    transform: scale(1.05);
}

.subs-container_hover i {
    position: absolute;
    right: 8px;
    color: #00287c;
    font-size: 13px;
    top: 9px;
}
.paid-invoice {
  color: green;
}
.unpaid-invoice {
  color: red;
}
li:hover .sidebarNotification {
    background: black;
    top: 10px;
    height: 20px;
    color: white;
    transition: 0.2s;
    border-radius: 25px;
}
.sidebarNotification {
    color: white;
    position: absolute;
    top: 29px;
    bottom: 0;
    cursor: pointer;
    left: 6px;
    right: 5px;
    text-align: center;
    font-size: 9px;
    transition: 0.2s;
}
.move-right-search {
    position: absolute;
    z-index: 3;
    left: 143px !important;
    top: -14px; 
}

.margin-analysis-box {
    box-shadow: inset 0px 0px 3px 1px grey;
    padding: 8px 10px;
    border-radius: 5px;
}

.pro-margin-input {
    background: #616161 !important;
    border-color: black !important;
    color: white !important;
}
.assignTo__show td {
    padding: 5px 9px !important;
}

.assignTo__show .ui-select-choices {
      position: fixed !important;
      top: auto !important;
      left: auto !important;
      width: 200px !important;
}

.helpFlexiTable {
    position: absolute;
    top: -16px;
    left: 52px;
    background: white;
    padding: 1px 9px;
    border-radius: 18px;
    color: #808080;
    z-index: 5;
    box-shadow: 0 5px 14px 0 rgba(50,50,93,.1), 0 1px 6px 0 rgba(0,0,0,.07);
}

.timeline-comment-wrapper {
    border-bottom: 2px solid #fff;
    border-top: 2px solid #fff;
    margin-bottom: 15px;
    margin-top: 15px;
    padding-left: 79px;
    position: relative;
}

.timeline-comment-avatar {
    border-radius: 3px;
    float: left;
    margin-left: -80px;
    padding: 4px;
    border: 1px solid #d1d5da;
    width: 71px;
    text-align: center;
}
.timeline-comment {
    background-color: #fff;
    border: 1px solid #d1d5da;
    border-radius: 3px;
    position: relative;
}
.discussion-timeline:before {
    background-color: #e6ebf1;
    bottom: 0;
    content: "";
    display: block;
    left: 95px;
    position: absolute;
    top: 0;
    width: 2px;
    z-index: 0;
}
.discussion-timeline {
    position: relative;
        margin-top: 56px;
}

.timeline-comment-header {
    position: absolute;
    background-color: #f6f8fa;
    border-bottom: 1px solid #d1d5da;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    color: #586069;
    padding: 4px 12px;
}
.timeline-comment-header b {
      color: black;
}

.timeline-comment-text {
    margin-top: 28px;
    padding: 4px 12px;
}

.moduleAndRecordName {
    color: #607D8B;
    width: calc(100% - 343px);
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: right;
}

.on-hold-text {
    background: #fff5f5;
    border-color: #f9d1d1;
    color: #fb0000;
}
.edit-timeline-comment:hover {
    color: black;
    cursor: pointer;
    text-decoration: underline;
}

.selected-comment-edit {
      border: 1px solid #8a8a8a;
}

.leftsidebar-container .modal-body {
    background-color: #e9ebee;
    float: left;
    width: 100%;
}
.leftsidebar-container .modal-footer .showSelected {
  color:black !important;
}
.leftsidebar-container .modal-body .focusedcomments {
    box-shadow: none;
    border: 1px solid #e0e0e0;
    border-radius: 2px;
    background: white;
    min-height: 343px;
    margin-bottom: 0;
    margin-top: -1px;
}
/* .move-up {
      margin-top: -38px;
} */
.leftsidebar-container .edit-notes {
  color: #008bf9;
  cursor: pointer;
}
.leftsidebar-container .edit-notes:hover {
  text-decoration: underline;
}
.leftsidebar-container .modal-body .form-control {
    border-color: #cecece;
}
.leftsidebar-container .modal-header {
    /* background-color: #444444; */
    background-color: #8dbbce;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
.leftsidebar-container .modal-footer {
    background: #e9ebee;
}
.leftsidebar-container .modal-header .btn-default2 {
    border: 0;
    box-shadow: none !important;
}
.leftsidebar-container .modal-header .close {
    color:white !important;
}
.leftsidebar-container .modal-header .modal-title{
    color:white;
}
/* .leftsidebar-container .modaltabs .nav-tabs{
    background-color: #e9ebee;
    border: 0;
    margin-bottom: 6px;
    padding-left: 0 !important;
} */
.leftsidebar-container .modaltabs .nav-tabs{
    margin-bottom: 6px;
}
.leftsidebar-container .modal-body .sidebarEmailAttach {
      background: #e9ebee;
}
.leftsidebar-container .modal-body .sidebarEmailAttach a {
      background: white;
}
.leftsidebar-container .modal-body .moduleEmails_body {
    background-color: #ffffff;
    border: 1px solid #cecece;
    overflow: auto;
    min-height: 300px;
    border-radius: 2px;
}
.leftsidebar-container .modaltabs .nav-tabs>li.active>a{
        padding-top: 6px;
}
/* .leftsidebar-container .modaltabs .nav-tabs>li>a{
    border-color: #e9ebee;
    background: #e9ebee;
} */
.leftsidebar-container .modaltabs .tab-pane {
    background-color: white;
    border-color: #cecece;
}
.leftsidebar-notes .modaltabs .tab-pane, .leftsidebar-documents .modaltabs .tab-pane,.leftsidebar-tasks .modaltabs .tab-pane{
    max-height: 300px;
}
.leftsidebar-email .modaltabs .tab-pane {
    max-height: 346px;
}
.no_cursor {
  cursor: default !important;
}
.padleft-left {
  padding-right: 50px !important;
}
.leftsidebar-container .modal-body .focusedcreated {
    font-weight: normal;
    color: black;
    margin-top: 7px;
}
.leftsidebar-container .modal-body .moduleAndRecordName {
  color: black;
}
.leftsidebar-container .modal-body select {
    cursor: pointer;
}

.margin-top33 {
      margin-top: 33px;
}

.saveAsDesign {
    display: inline-block;
    text-align: center;
    width: 144px;
    padding: 10px;
    border-radius: 3px;
    margin: 11px;
    cursor: pointer;
    color: #333333;
    font-weight: normal;
    font-size: 13px;
    border: 1px solid #e8e8e8;
}
.saveAsDesign:hover {
    border-color: #0086f1;
}

.leftsidebar-email .note-editor.note-frame {
    background: white;
}
.recordSummary a, .recordSummary b,.recordSummary span{
  margin: 11px 18px 3px 0px;
  display: inline-block;
  border-left: 1px solid #d6d6d6;
  font-size: 12px;
}
.recordSummary a {
    color: #008eff;
    padding: 0px 9px;
}
.recordSummary a:hover{
    text-decoration: underline !important;
    cursor: pointer;
}

ul.export-as {
  box-shadow: none;
  left: 3px;
  border-color: #c5c5c5;
  min-width: 98px !important;
  border-radius: 3px;
  right: 0;
  margin-bottom: -3px !important;
  border-bottom-left-radius: 0;
  border-bottom: 0;
  border-bottom-right-radius: 0;
  z-index: 2;
}

.spinCaret.open .btn-default2:hover {
  border-color: #c5c5c5;
}
.spinCaret.open .caret {
  -webkit-transform:rotate(180deg);
  -ms-transform:rotate(180deg);
      transform:rotate(180deg);
  color: #4e4e4e;
}
.spinCaret .caret {
  -webkit-transition:0.2s;
  -o-transition:0.2s;
  transition:0.2s;
}
ul.export-as li a {
    color: #424242 !important;
    padding: 4px 11px !important;
    letter-spacing: normal;
    font-size: 11px !important;
}
ul.export-as li a:hover {
  color: #018fff;
  cursor: pointer;
  background: #f7f7f7;
}

.fields-timeline,.fields-timeline-items {
  position: relative;
}
.fields-timeline-item{
  padding-left: 30px;
  margin: 16px 0px;
  position: relative;
  color: #313131;
}
.fields-timeline-item-small {
  padding-left: 113px;
}
.fields-timeline-item-small i {
  margin-right: 10px;
  padding: 3px 4px;
  font-size: 14px;
  border-radius: 2px;
  border: 1px solid #e6e6e6;
  color: #bbbbbb;
  float: left;
  margin-top: 4px;
}
.fields-timeline-item::before {
  content: " ";
  width: 13px;
  height: 13px;
  background-color: #cacaca;
  position: absolute;
  left: 120px;
  border-radius: 50%;
  top: 5px;
  border: 3px solid white;
}
.fields-timeline:before {
  content: " ";
  border-left: 1px solid #cacaca;
  position: absolute;
  top: -11px;
  bottom: -17px;
  left: 126px;
  z-index: 0;
}

.headerColor .modal-header {
  background-color: rgb(247, 247, 247) !important;
}
.headerColor .modal-title {
  color: #000000 !important;
}
.headerColor .modal-header .close {
  color: #b5b5b5 !important;
}
.showPrice {
  font-size: 19px;
  color: #bfbfbf;
}
.showPrice i{
  font-size: 19px;
  color: #bfbfbf;
}
.showPrice i:hover {
  font-size: 19px;
  color: #02a9f4;
  cursor: pointer;
}

.modal-footer span {
  color: black !important;
}

.modal .vatTable tbody td {
  color: black !important;
  background: white !important;
  font-size: 12px;
}

/* .modal tbody tr:nth-child(odd) td {
  box-shadow: none !important;
} */

.template-design table tr {
  cursor: default !important;
}

.dis-table {
    display: table-cell;
    border-right: 1px solid #e4e4e4;
    border-radius: 0;
    box-shadow: none;
}
.dis-table:first-child {
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
}
.dis-table:last-child {
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
    border-right:0
}
.btn-focus:focus {
  border-color: #969696;
  color: #018fff;
}
.input-symbol i.material-icons {
  position: absolute;
  right: 4px;
  font-size: 16px;
  top: -2px;
  border-radius: 2px;
  padding: 3px;
  color: gray;
}
.input-symbol i.material-icons:hover {
  background: #ececec;
  color:black;
  cursor: pointer;
}

/* .dis-table:nth-child(even) {
    background: #ffffff;
    background: -moz-linear-gradient(left, #ffffff 0%, #f6f6f6 47%, #ededed 100%);
    background: -webkit-linear-gradient(left, #ffffff 0%,#f6f6f6 47%,#ededed 100%);
    background: linear-gradient(to right, #ffffff 0%,#f6f6f6 47%,#ededed 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=1 );
} */

.widget-wrapper-holiday {
    box-shadow: 0 6px 8px rgba(102, 119, 136, .03), 0 1px 2px rgba(102, 119, 136, .3);
    display: table;
    table-layout: fixed;
    width: 100%;
}

.matrixContainer .tableCustomize tr td:nth-child(5), #flexiSettingsModal_SalesMatrixDetails .tableCustomize tr td:nth-child(5),
#flexiSettingsModal_GLActivity .tableCustomize tr td:nth-child(5) ,#purchase_matrix_details .tableCustomize tr td:nth-child(5)
,#flexiSettingsModal_FinanceMatrix .tableCustomize tr td:nth-child(5),#inventory_matrix_details .tableCustomize tr td:nth-child(5)  {
  opacity: 0.3;
  pointer-events: none;
}

.pagination_wrapper {
  overflow-y: hidden;
  overflow-x: auto;
  height: 49px;
}

.pagination_wrapper .pagination li {
  display: table-cell !important;
  white-space: nowrap;
}

.control-label-hover {
  border: 1px solid white;
  padding: 5px 6px;
  margin-left: 8px;
}
.control-label-hover:hover {
  border: 1px solid #f1f1f1;
  padding: 5px 6px;
  cursor: pointer;
  background: #fdfdfd;
}
.control-label-hover input[type = checkbox] {
  margin-right: 42px;
  float: right;
}

.selectedRecordDropup {
  box-shadow: none;
  left: -11px;
  bottom: 27px !important;
  border-radius: 0;
  border-color: #bdbdbd;
  overflow: auto;
  max-height: 200px;
}

.selectedRecordDropup li a {
  color: black !important;
  padding: 6px 4px 4px 8px!important;
  font-size: 11px !important;
  letter-spacing: initial !important;
  width:100%;
}

.selectedRecordDropup li a:hover,.selectedRecordDropup li:hover {
  background-color: #f3f3f3 !important;
  cursor: default !important;
}
.checkedCounter,.checkedCounter .caret {
  color: #008eff;
  font-weight: bold;
  cursor: pointer;
}
.checkedCounter:hover {
  border-bottom: 1px dotted;
}
.selectedRecordDropup .material-icons {
  font-size: 12px;
}
.clearSelectedrecord {
  visibility: hidden;
  padding: 5px 4px;
  background: transparent;
  margin-top: -5px;
  line-height: 11px;
}
.selectedRecordDropup li a:hover .clearSelectedrecord {
  visibility: visible;
}
.clearSelectedrecord:hover {
  background-color: gainsboro;
  cursor: pointer;
}

.highlighted_unit_price{
  color: red !important;
}