/* app css stylesheet */

/* Include this file in your html if you are using the CSP mode. */

@charset "UTF-8";

[ng\:cloak],
[ng-cloak],
[data-ng-cloak],
[x-ng-cloak],
.ng-cloak,
.x-ng-cloak,
.ng-hide:not(.ng-hide-animate) {
  display: none !important;
}

ng\:form {
  display: block;
}

.ng-animate-shim {
  visibility:hidden;
}

.ng-anchor {
  position:absolute;
}

.menu {
  list-style: none;
  border-bottom: 0.1em solid black;
  margin-bottom: 2em;
  padding: 0 0 0.5em;
}

.menu:before {
  content: "[";
}

.menu:after {
  content: "]";
}

.menu>li {
  display: inline;
}

.menu>li:before {
  content: "|";
  padding-right: 0.3em;
}

.menu>li:nth-child(1):before {
  content: "";
  padding: 0;
}

body {
  margin-top: 114px;
}

button.navbar-btn {
  margin-right: 5px;
}

/* .navbar.menu-principal {
  border-bottom: 1px solid #ddd;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 2px rgba(0, 0, 0, .075);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 2px rgba(0, 0, 0, .075);
} */

.navbar-brand {
  background: url("../images/logo-ilink-r.png") center left no-repeat;
  padding-left: 92px;
  float: none !important;
  padding-bottom: 21px;
  /*padding-top: 0px !important;*/
}

#myTabContent {
  padding-top: 25px;
}

.content_tab_margin {
  margin-top: 15px;
}

.highlight {
  padding: 9px 10px;
  margin-bottom: 14px;
  background-color: #f7f7f9;
  /*border-top: 1px solid #e1e1e8; */
  /*border-radius: 4px; */
  margin: 14px 0px 14px 0px;

}

/* tab color */
.nav-tabs>li>a {
  /*background-color: #333333; */
  border-top: 3px solid #DDDDDD;
  border-left-color: #EEE;
  border-right-color: #EEE;
}

/* active tab color */
.nav-tabs>li.active>a,
.nav-tabs>li.active>a:hover,
.nav-tabs>li.active>a:focus {
  /*background-color: #666;*/
  border-top: 3px solid #BBBBBB;
}

/* hover tab color */
.nav-tabs>li>a:hover {
  border-top: 3px solid #999999;
  background-color: #FEFEFE;
}

.header_casos {
  margin-top: 35px;
  margin-bottom: -10px;
  color: #555 !important;
  font-family: "Helvetica";
  font-weight: bold;
}

div.anchors_selector a:hover {
  text-decoration: none;
}

thead tr {
  color: #777;
}

body {
  font-family: "Calibri", "Helvetica", "Arial";
}

dl dt {
  color: #777;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ddd;
  border-bottom: 2px solid #ddd;
  margin-bottom: 15px;
}

table tbody tr {
  cursor: pointer;
}

.midias thead tr th {
  text-align: center;

}

#barra-ferramentas {
  position: fixed;
  height: 42px;
  min-height: 42px;
  width: 100%;
  background-color: #E7E7E7;
  z-index: 1000;
  top: 51px;
  padding-top: 5px;
  border-bottom: 1px solid #D7d7d7;

}

#barra-ferramentas .container {
  padding-left: 0px;
}

#barra-ferramentas button {
  margin: 0px;
  display: block;
  float: left;
}

#barra-ferramentas button,
#barra-ferramentas div.tooltip {

  margin-right: 5px;

}

#barra-ferramentas .btns-nav {
  float: left;
  margin-right: 5px;
}



.audio-player {
  width: 250px;
}

.navbar-default {
  /*color: #fff;
background-color: #39b3d7;
border-color: #269abc; */
}

.navbar-default .navbar-nav>li>a {
  /*color:#fff;*/
}

.navbar-default .navbar-nav>.dropdown>a .caret {
  /* border-top-color: #fff;
    border-bottom-color: #fff;*/
}

.navbar-default .navbar-brand {
  /*color:#fff;*/
}

.menu-large {
  position: static !important;
}

.megamenu {
  padding: 20px 0px;
  width: 100%;
}

.megamenu>li>ul {
  padding: 0;
  margin: 0;
}

.megamenu>li>ul>li {
  list-style: none;
}

.megamenu>li>ul>li>a {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: normal;
  line-height: 1.428571429;
  color: #333333;
  white-space: normal;
}

.megamenu>li ul>li>a:hover,
.megamenu>li ul>li>a:focus {
  text-decoration: none;
  color: #262626;
  background-color: #f5f5f5;
}

.megamenu.disabled>a,
.megamenu.disabled>a:hover,
.megamenu.disabled>a:focus {
  color: #999999;
}

.megamenu.disabled>a:hover,
.megamenu.disabled>a:focus {
  text-decoration: none;
  background-color: transparent;
  background-image: none;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  cursor: not-allowed;
}

.megamenu.dropdown-header {
  color: #428bca;
  font-size: 18px;
}

@media (max-width: 768px) {
  .megamenu {
    margin-left: 0;
    margin-right: 0;
  }

  .megamenu>li {
    margin-bottom: 30px;
  }

  .megamenu>li:last-child {
    margin-bottom: 0;
  }

  .megamenu.dropdown-header {
    padding: 3px 15px !important;

  }

  .navbar-nav .open .dropdown-menu .dropdown-header {
    color: #fff;
  }
}

.notifications {
  width: 310px;
}

.dropdown-menu {
  border: none;
  -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
}

.dropdown-title {
  font-size: 16px;
  font-weight: 600;
  color: #555;
  margin-top: 0px;
}

.dropdown-notifications {
  width: 500px;
  padding: 16px;
}

.notification-item {
  min-height: 80px;
  background-color: #f8f9fa;
  border-radius: 5px;
  padding: 12px;
}

.notification-icon {
  padding: 12px;
  color: rgba(0, 123, 255, 1);
  background-color: rgba(0, 123, 255, 0.1);
  border-radius: 50%;
}

.notification-title {
  color: #555;
  font-size: 16px;
  font-weight: 600;
}

.notification-message {
  color: #666;
  font-size: 14px;
}

.notification-date {
  color: #999;
  font-size: 12px;
}

.icon-notification {
  height: 60px;
  padding: 15px 10px 10px 0px;
  font-size: 24px;
  color: #2980B9;
}

.text-notification {
  white-space: normal;
}

.case-view dd,
.case-view dt {
  padding: 2px 0px;
  /*font-family: "Verdana", "Arial", "Helvetica";
  font-size: 12px;*/
}

.case-view dd {}

span.label {
  font-size: 85%;
}

.clickable {
  cursor: pointer;
}

.form_margin_top {
  margin-top: 50px;
}

.form_margin_top2 {
  margin-top: 19px;
}

.form_alert_margin_top {
  margin-top: -31px;
  ;
}

a.btn_actions_table {
  margin-bottom: 40px;
}

.box-action-preview hr {
  margin-top: 0px;
}

.case_view_margin_top {
  margin-top: -30px;
}

.case-view-preview dd,
.case-view-preview dt {
  padding: 5px 0px;
}

.case-view-preview h4 {
  font-size: 14px;
  font-weight: 700;
}

.case-view-preview p {
  padding-bottom: 20px;
}

span.icon-time-gray {
  background: url('../images/time-gray.png') no-repeat !important;
  width: 25px !important;
  height: 25px !important;
  margin: -7px -2px !important;
  display: inline-block;
}

span.text-gray {
  color: '#505050';
}

/* Side notes for calling out things
-------------------------------------------------- */

/* Base styles (regardless of theme) */
.bs-callout {
  margin: 10px 0;
  padding: 6px 30px 6px 15px;
  border-left: 2px solid #eee;

}

.bs-callout h4 {
  margin-top: 0;
}

.bs-callout p:last-child {
  margin-bottom: 0;
}

.bs-callout code,
.bs-callout .highlight {
  background-color: #fff;
}

/* Themes for different contexts */
.bs-callout-danger {
  background-color: #fdf7f7;
  border-color: #a94442;
  color: #a94442;
  font-weight: 700;
}

.bs-callout-warning {
  background-color: #fefbed;
  border-color: #f1e7bc;
}

.bs-callout-info {
  background-color: #f0f7fd;
  border-color: #d0e3f0;
}

.datepicker-class.has-error .select2-container .select2-choice {
  border-color: #a94442;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}

.datepicker-class.has-success .select2-container .select2-choice {
  border-color: #3c763d;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}

.footer-loading {
  width: 100%;
  height: 50px;
  position: fixed;
  bottom: 0px;
  padding-top: 9px;
  left: 0;
  /*background:url("../images/background-loading-footer.png") bottom repeat-x;*/
  text-align: center;
  -webkit-box-shadow: inset 0px -32px 31px -31px rgba(50, 50, 50, 1);
  -moz-box-shadow: inset 0px -32px 31px -31px rgba(50, 50, 50, 1);
  box-shadow: inset 0px -32px 31px -31px rgba(50, 50, 50, 1);
}

.footer-loading img {
  width: 25px;
}

.dropdown-menu li {
  cursor: pointer;
}

.loading-index {
  background-color: #2980b9;
  width: 100%;
  height: 100%;
  z-index: 9999;
  position: absolute;
  margin-top: -114px;
}

.loading-position {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -140px;
  margin-left: -113px;
}

.loading-index .loading {

  width: 272px;
  height: 32px;
  border: 3px #fff solid;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  border-radius: 7px;
  background-color: #2071a3;
  -webkit-box-shadow: inset 0px 0px 5px 1px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: inset 0px 0px 5px 1px rgba(0, 0, 0, 0.5);
  box-shadow: inset 0px 0px 5px 1px rgba(0, 0, 0, 0.5);
}

.loading-page {
  background: url("../images/tile-loading-page.png");
  width: 100%;
  height: 100%;
  z-index: 9999;
  position: fixed;
  top: 0px;
}

.loading-page-position {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -100px;
  margin-left: -75px;

}

.loading-page .loading {

  background: url("../images/loading-page1.gif") no-repeat;
  width: 125px;
  height: 125px;
}

.loading-page h4 {
  font-weight: bold;
  font-size: 25px;
  color: #666;
}

.block-load {

  height: 100%;
  background: url("../images/block-load.png") repeat-x;
  margin-top: 2px;
  margin-left: 1px;
}

.loading-index .text-load h1 {
  display: block;
  color: #fff;
  font-family: "Arial Black", "Arial";
  font-weight: bold;
  font-size: 35px;
  width: 100%;
  text-align: center;
  margin-top: 10px;
  text-shadow: 0px 0px 9px rgba(0, 0, 0, 0.5);

}

.loading-index .text-load p {
  display: block;
  color: #fff;
  width: 100%;
  text-align: center;

}

.loading-index .logo-index {
  display: block;
  width: 260px;
  background: url("../images/logo-loading-cad-ilink.png") center no-repeat;
  height: 100px;
}

.label-status-form {
  margin-top: 5px;
}

.system-mensagens {
  margin-top: -32px;
}

#application {
  display: none;
}

#attempts {
  font-size: 18px;
  color: #2980B9;
  font-weight: bold;
}

#total-attempts {
  font-size: 18px;
  color: #000000;
}

#header-modal {
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
}

#modalUI .modal-header {
  -webkit-border-top-left-radius: 6px;
  -webkit-border-top-right-radius: 6px;
  -moz-border-radius-topleft: 6px;
  -moz-border-radius-topright: 6px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  background: #e7e7e7;
}

.treeview-node-selected {
  color: #428bca;
  /*background-color: #428bca;*/
  text-decoration: underline;
}

.treeview-node-selected:hover {
  background-color: #428bca;
  text-decoration: underline;
}

.node-events_tree:hover {
  background-color: #fff !important;
  text-decoration: underline;
}

.node-events_tree span.icon i {
  font-size: 11px;
}

.case-event-classification {
  margin-bottom: 0px;
}

.container-box-tiles .thumbnail {
  cursor: pointer;
}

.container-box-tiles .thumbnail:hover {
  -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.4);
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.4);
}



.container-box-tiles .thumbnail .caption h3 {
  color: #fff;
  margin-top: 10px;
}

.container-box-tiles .thumbnail .caption .pull-right span {
  color: #fff;
  display: block;
  margin-top: -10px;
}

.percent-text {
  text-align: center;
  color: #fff;
  position: absolute;
  width: 100%;
}

div#box a:hover {
  text-decoration: none;
  cursor: default;
}

.multipleInputSelect .select2-container-multi .select2-choices {
  border: 1px solid #ccc;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  border-radius: 4px;
  background-image: none;
}

.multipleInputSelect .select2-container-multi .select2-choices .select2-search-choice {
  background-image: none;
  border: none;
  box-shadow: none;
  background-color: #428bca;
  color: #fff;
  padding: 3px 21px 5px 7px;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  font-size: 85%;
  border-radius: .25em;
  margin: 6px 0 3px 5px;
}

.multipleInputSelect .select2-container-multi .select2-search-choice-close {
  left: initial;
}

.multipleInputSelect .select2-search-choice-close {
  background: url('../images/x.png');
}

.bootstrap-tagsinput span.tag.label.label-info {
  background-color: #428bca;
}

.bootstrap-tagsinput {
  padding: 4px 6px 6px 6px !important;
  display: block !important;
}

div.jHtmlArea .ToolBar {
  border-bottom: none;
  background: none;
}

div.jHtmlArea {
  border: none;
}

div.jHtmlArea iframe {
  border: 1px solid #ccc;
  border-radius: 4px;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

div.jHtmlArea .ToolBar ul {
  background: none;
  border-radius: 4px;
}

.table-checklist {
  margin-bottom: 0px;
}

.file-input-wrapper {
  overflow: hidden;
  position: relative;
  cursor: pointer;
  z-index: 1;
}

.file-input-wrapper input[type=file],
.file-input-wrapper input[type=file]:focus,
.file-input-wrapper input[type=file]:hover {
  position: absolute;
  top: 0;
  left: 0;
  cursor: pointer;
  opacity: 0;
  filter: alpha(opacity=0);
  z-index: 99;
  outline: 0;
}

.questions {
  width: 300px;
}

.upload-button {
  margin-left: 14px !important;
}

/*
 * simple file upload component
 */
#upload-title {
  color: #000000;
  font-weight: 700;
}

#upload-add {
  margin-left: 15px;
  display: inline-block;
}

#upload-itens {
  list-style: none;
  width: auto;
  max-width: 100%;
}

#upload-itens li {
  /*background-color:#333639;
    border-top:1px solid #3d4043;
    border-bottom:1px solid #2b2e31;
    padding:15px;*/
  position: relative;
  width: 100%;
}

#upload-itens li div {
  cursor: pointer;
  display: inline-block;
  width: 100%;
}

.upload-filename {}

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

/*
 * simple inplace edit component
 */
[contenteditable]:focus {
  outline: none;
  box-shadow: 0px 0px 10px 0px #719ECE;
  border-collapse: separate;
}

td.break-word {
  word-break: break-all !important;
  word-wrap: break-word !important;
}

.pre-scrollable {
  max-height: 340px !important;
  overflow-y: scroll !important;
  white-space: pre-wrap !important;
}

p.caseid {
  color: #fff !important;
  font-family: "Helvetica";
  font-weight: bold;
}

.image-logo-about {
  background: url("../images/logo-ilink-r.png") center no-repeat;
  height: 50px;
}

#modalReconnectToolbar .modal-dialog {
  width: 525px;
}

#modalConfigToolbar .modal-dialog {
  width: 525px;
}

#modalClearCache .modal-dialog {
  width: 350px;
}

#modalAbout .modal-dialog {
  width: 350px;
}

#modalLoginToolbar .modal-dialog {
  width: 350px;
}

#modalCallToolbar .modal-dialog {
  width: 350px;
}

.modal {
  top: 150px !important;
}

#modalTransfToolbar .modal-dialog {
  width: 350px;
  top: 150px;
}

#modalTransfAssistidaToolbar .modal-dialog {
  width: 350px;
  top: 150px;
}

#modalConferenciaToolbar .modal-dialog {
  width: 350px;
  top: 150px;
}

span.icon-reopened-gray {
  background: url('../images/reopened.png') no-repeat !important;
  display: inline-block;
}

.navbar-text {
  margin-left: 15px;
  margin-top: 15px;
  margin-bottom: 15px;
  margin-right: 5px;
}

.round-button-circle {
  height: 0px;
  padding-bottom: 100%;
  border-radius: 100%;
  background: #428BCA;
}

.round-button-circle:hover {
  background: #3276B1;
}

.round-button a {
  display: block;
  float: left;
  width: 100%;
  padding-top: 50%;
  padding-bottom: 50%;
  line-height: 1em;
  margin-top: -0.5em;

  text-align: center;
  color: #e2eaf3;
  font-family: Verdana;
  font-size: 1.2em;
  font-weight: bold;
  text-decoration: none;
}

.button-chat {
  margin: 18px 0 0 15px !important;
  border: 0;
}

.chat-container {
  position: fixed !important;
  margin: 0 0 0 0;
  -webkit-font-smoothing: antialiased;
  background-attachment: scroll;
  background-clip: border-box;
  background-color: rgb(248, 248, 248);
  background-image: none;
  background-origin: padding-box;
  background-size: auto;
  border-bottom-color: rgb(51, 51, 51);
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-style: none;
  border-bottom-width: 0px;
  border-image-outset: 0px;
  border-image-repeat: stretch;
  border-image-slice: 100%;
  border-image-source: none;
  border-image-width: 1;
  border-left-color: rgb(51, 51, 51);
  border-left-style: none;
  border-left-width: 0px;
  border-right-color: rgb(51, 51, 51);
  border-right-style: none;
  border-right-width: 0px;
  border-top-color: rgb(51, 51, 51);
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  border-top-style: none;
  border-top-width: 0px;
  box-sizing: border-box;
  color: rgb(51, 51, 51);
  display: block;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 13px;
  font-stretch: normal;
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  height: 65%;
  line-height: 18.2px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 0px;
  outline-color: rgb(51, 51, 51);
  outline-style: none;
  outline-width: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 0px;
  position: relative;
  vertical-align: baseline;
  visibility: visible;
  width: 25%;
  right: 2px;
  top: 28%;
}

.chat-conversation {
  -webkit-font-smoothing: antialiased;
  border-bottom-color: rgb(51, 51, 51);
  border-bottom-style: none;
  border-bottom-width: 0px;
  border-image-outset: 0px;
  border-image-repeat: stretch;
  border-image-slice: 100%;
  border-image-source: none;
  border-image-width: 1;
  border-left-color: rgb(51, 51, 51);
  border-left-style: none;
  border-left-width: 0px;
  border-right-color: rgb(51, 51, 51);
  border-right-style: none;
  border-right-width: 0px;
  border-top-color: rgb(51, 51, 51);
  border-top-style: none;
  border-top-width: 0px;
  box-sizing: border-box;
  color: rgb(51, 51, 51);
  display: block;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 13px;
  font-stretch: normal;
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  height: 331px;
  line-height: 18.2px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 0px;
  outline-color: rgb(51, 51, 51);
  outline-style: none;
  outline-width: 0px;
  overflow-x: hidden;
  overflow-y: scroll;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 0px;
  position: relative;
  transition-delay: 0s;
  transition-duration: 0.5s;
  transition-property: padding-top;
  transition-timing-function: ease;
  vertical-align: baseline;
  visibility: visible;
  height: 100%;
  background-color: #F8F8F8;

}

.header-chat {
  z-index: 10;
  height: 32px;
  line-height: 28px;
  padding: 6px 18px;
  position: relative;
  background-color: #E7E7E7;
  cursor: pointer;
  border-radius: 8px 8px 0 0;
  font-size: 16px;
  font-weight: 400;
  box-sizing: content-box;
  border-bottom: 1px solid #eee;
  text-align: center;
}

.chat-send {
  display: inline-block;
  box-shadow: 0 -1px 3px rgba(0, 0, 0, .1);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  left: 0;
  bottom: 0px;
  margin: 0 0 0 0;
  width: 100%;
}


.chats {
  list-style-type: none;
  margin-top: 10px;
}

.me {
  clear: both !important;
  margin-bottom: 10px !important;
  -webkit-font-smoothing: antialiased !important;
  background-color: rgb(231, 231, 231) !important;
  border-bottom-color: rgb(5, 5, 5) !important;
  border-bottom-left-radius: 14px !important;
  border-bottom-right-radius: 14px !important;
  border-top-left-radius: 14px !important;
  border-top-right-radius: 14px !important;
  border-top-style: none !important;
  border-top-width: 0px !important;
  color: #555 !important;
  display: block !important;
  margin-bottom: 10px !important;
  padding-bottom: 9px !important;
  padding-left: 13px !important;
  padding-right: 13px !important;
  padding-top: 8px !important;
  width: 202px !important;
  word-break: break-word !important;
  word-wrap: break-word !important;
}

.you {
  float: right !important;
  clear: both !important;
  margin-bottom: 10px !important;
  -webkit-font-smoothing: antialiased !important;
  background-color: rgb(0, 153, 255) !important;
  border-bottom-color: rgb(255, 255, 255) !important;
  border-bottom-left-radius: 14px !important;
  border-bottom-right-radius: 14px !important;
  border-top-left-radius: 14px !important;
  border-top-right-radius: 14px !important;
  border-top-style: none !important;
  border-top-width: 0px !important;
  color: rgb(255, 255, 255) !important;
  display: block !important;
  margin-bottom: 10px !important;
  padding-bottom: 9px !important;
  padding-left: 13px !important;
  padding-right: 13px !important;
  padding-top: 8px !important;
  width: 202px !important;
  word-break: break-word !important;
  word-wrap: break-word !important;
}


.badge-message {
  background-attachment: scroll;
  background-clip: border-box;
  background-color: rgb(26, 187, 156);
  background-image: none;
  background-origin: padding-box;
  background-size: auto;
  border-bottom-color: rgb(26, 187, 156);
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-image-outset: 0px;
  border-image-repeat: stretch;
  border-image-slice: 100%;
  border-image-source: none;
  border-image-width: 1;
  border-left-color: rgb(26, 187, 156);
  border-left-style: solid;
  border-left-width: 1px;
  border-right-color: rgb(26, 187, 156);
  border-right-style: solid;
  border-right-width: 1px;
  border-top-color: rgb(26, 187, 156);
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  border-top-style: solid;
  border-top-width: 1px;
  box-sizing: border-box;
  color: rgb(255, 255, 255);
  cursor: auto;
  display: block;
  font-family: 'Helvetica Neue', Roboto, Arial, 'Droid Sans', sans-serif;
  font-size: 10px;
  font-weight: normal;
  height: 19px;
  line-height: 13px;
  list-style-image: none;
  list-style-position: outside;
  list-style-type: none;
  min-width: 10px;
  padding-bottom: 2px;
  padding-left: 6px;
  padding-right: 6px;
  padding-top: 2px;
  position: absolute;
  /* right: 2px; */
  text-align: center;
  top: 21px;
  vertical-align: middle;
  white-space: nowrap;
  width: 20px;
  margin: 0 0 0 54px;
}


/* The Modal (background) */
.modalWidget {
  display: none;
  /* Hidden by default */
  position: fixed;
  /* Stay in place */
  z-index: 1;
  /* Sit on top */
  left: 0;
  top: 0;
  width: 100%;
  /* Full width */
  height: 100%;
  /* Full height */
  overflow: auto;
  /* Enable scroll if needed */
  background-color: rgb(0, 0, 0);
  /* Fallback color */
  background-color: rgba(0, 0, 0, 0.4);
  /* Black w/ opacity */
  -webkit-animation-name: fadeIn;
  /* Fade in the background */
  -webkit-animation-duration: 0.4s;
  animation-name: fadeIn;
  animation-duration: 0.4s;
  -webkit-animation-name: fadeOut;
  /* Fade in the background */
  -webkit-animation-duration: 0.4s;
  animation-name: fadeOut;
  animation-duration: 0.4s;
  z-index: 9999;
}

/* Modal Content */
.modal-content-widget {
  position: fixed;
  bottom: 0;
  background-color: #fefefe;
  width: 100%;
  -webkit-animation-name: slideIn;
  -webkit-animation-duration: 0.4s;
  animation-name: slideIn;
  animation-duration: 0.4s;
  -webkit-animation-name: fadeOut;
  /* Fade in the background */
  -webkit-animation-duration: 0.4s;
  animation-name: fadeOut;
  animation-duration: 0.4s;
  min-height: 45%;
  max-height: 93%;
  height: auto;
  overflow-y: auto;
}

.modal-body-widget {
  padding: 2px 16px;
}

#caseviewcontainer .chat-collapsed {
  display: none !important;
}


#caseviewcontainer {
  overflow-x: hidden;
  margin-bottom: 24px;
  /* necessary to hide collapsed sidebar by Google Tradutor*/
}

/* 
@media (min-width: 1992px) {  
    #caseviewcontainer .chat-collapsed {
        display: block;
        margin-right: -25%;
    }
} */

/* #caseviewcontainer #casecontent {
    -webkit-transition: width 0.1s ease;
    -moz-transition: width 0.1s ease;
    -o-transition: width 0.1s ease;
    transition: width 0.1s ease;
} */
#caseviewcontainer #chatbar {
  display: none;
  -webkit-transition: margin 0.3s ease;
  -moz-transition: margin 0.3s ease;
  -o-transition: margin 0.3s ease;
  transition: margin 0.3s ease;
}

/* END */

.iframecaseview {
  display: block;
  background: #FFF;
  height: 100vh;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.width100 {
  width: 100%;
}

.width98 {
  width: 98%;
}


.typeahead,
.tt-query,
.tt-hint {
  width: 458px;
  /* height: 30px; */
  padding: 8px 12px;
  font-size: 24px;
  line-height: 30px;
  /* border: 2px solid #ccc; */
  /* -webkit-border-radius: 8px; */
  -moz-border-radius: 8px;
  /* border-radius: 8px; */
  outline: 0;
}

.typeahead {
  background-color: #fff;
}

.typeahead:focus {
  border: 2px solid #0097cf;
}

.tt-query {
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.tt-hint {
  color: #999
}

.tt-menu {
  width: 422px;
  margin: 12px 0;
  padding: 8px 0;
  background-color: #fff;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
  -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
  width: 101%;
  max-height: 200px;
  padding: 0 0 0 4px;
  margin: 4px 4px 4px 0;
  position: relative;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.tt-suggestion {
  padding: 3px 20px;
  font-size: 14px;
  line-height: 24px;
}

.tt-suggestion:hover {
  cursor: pointer;
  color: #fff;
  background-color: #0097cf;
}

.tt-suggestion.tt-cursor {
  color: #fff;
  background-color: #0097cf;
}

.tt-suggestion.active {
  color: #fff;
  background-color: #0097cf;
}

.tt-suggestion p {
  margin: 0;
}

.gist {
  font-size: 14px;
}

.bootstrap .tags {
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.bootstrap .tags.focused {
  border-color: #66afe9;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
}

.bootstrap .tags .tag-item {
  background: #428bca;
  border: 1px solid #357ebd;
  border-radius: 4px;
  color: #fff;
}

.bootstrap .tags .tag-item.selected {
  background: #d9534f;
  border: 1px solid #d43f3a;
  border-radius: 4px;
  color: #fff;
}

.bootstrap .tags .tag-item button {
  background: transparent;
  color: #000;
  opacity: .4;
}

.bootstrap .autocomplete {
  border-radius: 4px;
}

.bootstrap .autocomplete .suggestion-item.selected {
  color: #262626;
  background-color: #e9e9e9;
}

.bootstrap .autocomplete .suggestion-item em {
  font-weight: normal;
  background-color: #ffff00;
}

.bootstrap .autocomplete .suggestion-item.selected em {
  color: #262626;
  background-color: #ffff00;
}

.recipientGroup .select2-container-multi .select2-choices {
  border: 1px solid #ccc;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  border-radius: 4px;
  background-image: none;
}

.recipientGroup .select2-container-multi .select2-choices .select2-search-choice {
  background-image: none;
  border: none;
  box-shadow: none;
  background-color: #428bca;
  color: #fff;
  padding: 3px 21px 5px 7px;
  font-weight: 400;
  line-height: 1;
  text-align: center;
  font-size: 90%;
  border-radius: .25em;
  margin: 6px 0 3px 5px;
}

.recipientGroup .select2-container-multi .select2-search-choice-close {
  left: initial;
}

.recipientGroup .select2-search-choice-close {
  background: url('../images/select2.png') right top no-repeat;
  background-position: right -11px;
}

.recipientCCGroup .select2-container-multi .select2-choices {
  border: 1px solid #ccc;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  border-radius: 4px;
  background-image: none;
}

.recipientCCGroup .select2-container-multi .select2-choices .select2-search-choice {
  background-image: none;
  border: none;
  box-shadow: none;
  background-color: #428bca;
  color: #fff;
  padding: 3px 21px 5px 7px;
  font-weight: 400;
  line-height: 1;
  text-align: center;
  font-size: 90%;
  border-radius: .25em;
  margin: 6px 0 3px 5px;
}

.recipientCCGroup .select2-container-multi .select2-search-choice-close {
  left: initial;
}

.recipientCCGroup .select2-search-choice-close {
  background: url('../images/select2.png') right top no-repeat;
  background-position: right -11px;
}

.email-content {
  border: 1px solid #dddddd;
  padding: 20px;
  width: 90%;
  overflow: hidden;
}

.video_call {
  fill: white;
}

.d-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.d-block {
  display: block;
}

.ml-auto {
  margin-left: auto;
}

.ml-2 {
  margin-left: 8px;
}

.ml-3 {
  margin-left: 16px;
}

.ml-4 {
  margin-left: 24px;
}

.mb-0 {
  margin-bottom: 0px;
}

.mb-1 {
  margin-bottom: 4px;
}

.mb-2 {
  margin-bottom: 8px;
}

.mb-3 {
  margin-bottom: 16px;
}

.mb-4 {
  margin-bottom: 24px;
}

.mb-5 {
  margin-bottom: 5px;
}

.mb-6 {
  margin-bottom: 35px;
}

.email-print {
  display: block;
}

.hide-print {
  display: block;
}

.show-print {
  display: none;
}

.email-label {
  float: left;
  width: 160px;
  clear: left;
  text-align: right;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #777;
  font-weight: 700;
  line-height: 1.42857143;
}

.email-value {
  margin-left: 20px;
}

.email-attachment {
  margin-left: 180px;
}

@page {
  margin: 1cm;
}

@media print {
  * {
    background: transparent !important;
    color: #000 !important;
    text-shadow: none !important;
    filter: none !important;
    -ms-filter: none !important;
  }

  body {
    margin: 0;
    padding: 0;
    line-height: 1.4em;
  }

  body {
    margin: 0px !important;
  }

  hr {
    display: none;
  }

  img {
    max-width: 100%;
  }

  a,
  a:visited {
    text-decoration: underline;
  }

  a:link:after,
  a:visited:after {
    content: " ("attr(href) ") ";
  }

  a:after,
  a[href^="javascript:"]:after,
  a[href^="#"]:after {
    content: "";
  }

  p a {
    word-wrap: break-word;
  }

  p {
    widows: 3;
  }

  p {
    orphans: 3;
  }

  #email_data {
    display: none;
  }

  .top-divider {
    border-top: 1px solid #000;
    padding-top: 5px;
  }

  .email-print {
    display: block;
  }

  .email-label {
    float: left;
    width: auto;
    clear: left;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #777;
    font-weight: 700;
    line-height: 1.42857143;
  }

  .email-content {
    border: none;
    padding: 20px 0px 0px 0px;
    width: 100%;
    text-align: justify;
  }

  .hide-print {
    display: none;
  }

  .show-print {
    display: block;
  }
}

.h-100 {
  height: 100%;
}

.w-100 {
  width: 100%;
}

.align-items-center {
  align-items: center;
}

.justify-content-center {
  justify-content: center;
}

.ml-2 {
  margin-left: 8px;
}

.ml-3 {
  margin-left: 16px;
}

.mr-1 {
  margin-right: 4px;
}

.mr-2 {
  margin-right: 8px;
}

.mr-3 {
  margin-right: 16px;
}

.mr-4 {
  margin-right: 24px;
}

.bg-danger {
  background-color: #dc3545 !important;
}

.btn-white {
  background-color: #fff !important;
}

.white {
  color: #fff;
}

.btn-floating {
  /* display: inline-block; */
  color: #fff;
  position: relative;
  overflow: hidden;
  z-index: 1;
  width: 40px;
  height: 40px;
  line-height: 40px;
  padding: 0;
  border-radius: 50%;
  -webkit-transition: background-color .3s;
  transition: background-color .3s;
  cursor: pointer;
  vertical-align: middle;
}

.btn-floating:before {
  border-radius: 0;
}

.btn-floating:focus {
  outline: none;
}

.btn-floating.btn-large {
  width: 56px;
  height: 56px;
  padding: 0;
}

.btn-floating.btn-large.halfway-fab {
  bottom: -28px;
}

.btn-floating.btn-large i {
  line-height: 56px;
}

.btn-floating.btn-small {
  width: 32.4px;
  height: 32.4px;
}

.btn-floating.btn-small.halfway-fab {
  bottom: -16.2px;
}

.btn-floating.btn-small i {
  line-height: 32.4px;
}

.btn-floating.halfway-fab {
  position: absolute;
  right: 24px;
  bottom: -20px;
}

.btn-floating.halfway-fab.left {
  right: auto;
  left: 24px;
}

.btn-floating i {
  width: inherit;
  display: inline-block;
  text-align: center;
  color: #fff;
  font-size: 1.6rem;
  line-height: 40px;
}

button.btn-floating {
  border: none;
}

.video {
  position: absolute;
  min-width: 427px;
  min-height: 240px;
  background-color: #404040;
  z-index: 9999;
  left: 5px;
  top: 124px;
  border-radius: 5px;
  background: rgb(5, 90, 145);
  background: linear-gradient(180deg, rgba(5, 90, 145, 1) 0%, rgba(0, 0, 0, 1) 100%);
  cursor: move;
}

.start-video-chat {
  position: absolute;
  height: 100%;
  width: 100%;
}

.btn-start-call {
  height: 46px !important;
  padding: 10px 16px !important;
  line-height: 1.3333333 !important;
  border-radius: 6px !important;
}

#subscriber {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 9001;
  transform: scale(-1, 1);
}

#publisher {
  position: absolute;
  width: 80px;
  height: 100px;
  top: 10px;
  right: 10px;
  z-index: 9002;
  border-radius: 5px;
  background-color: rgba(0, 0, 0, 0.4);
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
}

.video-control {
  position: absolute;
  bottom: 0px;
  left: 0px;
  z-index: 9003;
  height: 65px;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.2);
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: all .4s ease-in;
}

.close {
  float: none;
  font-size: 24px;
  line-height: 0;
  color: #fff;
  text-shadow: none;
  filter: none;
  opacity: 1;
}

.closeModalEmail {
  float: right;
  font-size: 24px;
  text-shadow: none;
  filter: none;
  opacity: 1;
  padding: 0;
  cursor: pointer;
  background: 0 0;
  border: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.close:hover {
  color: #fff;
  opacity: .8;
}

.close-video-chat {
  position: absolute;
  top: 15px;
  right: 10px;
}

.video:hover .video-control {
  opacity: 1;
}

.OT_publisher,
.OT_subscriber {
  border-radius: 5px;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
}

.OT_bar,
.OT_edge-bar-item,
.OT_mode-auto {
  display: none !important;
}

.OT_root div {
  border-radius: 5px;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
}

.navbar {
  position: fixed;
  top: 0px;
  width: 100%;
  height: 64px !important;
  margin: 0px;
  padding: 8px 16px;
  border-radius: 0px;
  border: none;
  z-index: 9980;
}

.navbar-primary {
  background-color: #377ef9;
}

.navbar-secondary {
  top: 64px;
  height: 50px !important;
  padding: 0px !important;
  background-color: #377ef9;
  box-shadow: 0px 4px 2px -2px rgba(0, 0, 0, 0.3);
  z-index: 9979;
}

.btn-primary {
  color: #fff;
  background-color: #007bff;
  border-color: #007bff;
}

.btn-primary:hover {
  color: #fff;
  background-color: #0069d9;
  border-color: #0062cc;
}

.btn-primary:focus,
.btn-primary.focus {
  color: #fff;
  background-color: #0069d9;
  border-color: #0062cc;
  box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
}

.btn-primary.disabled,
.btn-primary:disabled {
  color: #fff;
  background-color: #007bff;
  border-color: #007bff;
}

.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show>.btn-primary.dropdown-toggle {
  color: #fff;
  background-color: #0062cc;
  border-color: #005cbf;
}

.btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.show>.btn-primary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
}

.btn-secondary {
  color: #fff;
  background-color: #6c757d;
  border-color: #6c757d;
}

.btn-secondary:hover {
  color: #fff;
  background-color: #5a6268;
  border-color: #545b62;
}

.btn-secondary:focus,
.btn-secondary.focus {
  color: #fff;
  background-color: #5a6268;
  border-color: #545b62;
  box-shadow: 0 0 0 0.2rem rgba(130, 138, 145, 0.5);
}

.btn-secondary.disabled,
.btn-secondary:disabled {
  color: #fff;
  background-color: #6c757d;
  border-color: #6c757d;
}

.btn-secondary:not(:disabled):not(.disabled):active,
.btn-secondary:not(:disabled):not(.disabled).active,
.show>.btn-secondary.dropdown-toggle {
  color: #fff;
  background-color: #545b62;
  border-color: #4e555b;
}

.btn-secondary:not(:disabled):not(.disabled):active:focus,
.btn-secondary:not(:disabled):not(.disabled).active:focus,
.show>.btn-secondary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(130, 138, 145, 0.5);
}

.btn-success {
  color: #fff;
  background-color: #28a745;
  border-color: #28a745;
}

.btn-success:hover {
  color: #fff;
  background-color: #218838;
  border-color: #1e7e34;
}

.btn-success:focus,
.btn-success.focus {
  color: #fff;
  background-color: #218838;
  border-color: #1e7e34;
  box-shadow: 0 0 0 0.2rem rgba(72, 180, 97, 0.5);
}

.btn-success.disabled,
.btn-success:disabled {
  color: #fff;
  background-color: #28a745;
  border-color: #28a745;
}

.btn-success:not(:disabled):not(.disabled):active,
.btn-success:not(:disabled):not(.disabled).active,
.show>.btn-success.dropdown-toggle {
  color: #fff;
  background-color: #1e7e34;
  border-color: #1c7430;
}

.btn-success:not(:disabled):not(.disabled):active:focus,
.btn-success:not(:disabled):not(.disabled).active:focus,
.show>.btn-success.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(72, 180, 97, 0.5);
}

.btn-info {
  color: #fff;
  background-color: #17a2b8;
  border-color: #17a2b8;
}

.btn-info:hover {
  color: #fff;
  background-color: #138496;
  border-color: #117a8b;
}

.btn-info:focus,
.btn-info.focus {
  color: #fff;
  background-color: #138496;
  border-color: #117a8b;
  box-shadow: 0 0 0 0.2rem rgba(58, 176, 195, 0.5);
}

.btn-info.disabled,
.btn-info:disabled {
  color: #fff;
  background-color: #17a2b8;
  border-color: #17a2b8;
}

.btn-info:not(:disabled):not(.disabled):active,
.btn-info:not(:disabled):not(.disabled).active,
.show>.btn-info.dropdown-toggle {
  color: #fff;
  background-color: #117a8b;
  border-color: #10707f;
}

.btn-info:not(:disabled):not(.disabled):active:focus,
.btn-info:not(:disabled):not(.disabled).active:focus,
.show>.btn-info.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(58, 176, 195, 0.5);
}

.btn-warning {
  color: #212529;
  background-color: #ffc107;
  border-color: #ffc107;
}

.btn-warning:hover {
  color: #212529;
  background-color: #e0a800;
  border-color: #d39e00;
}

.btn-warning:focus,
.btn-warning.focus {
  color: #212529;
  background-color: #e0a800;
  border-color: #d39e00;
  box-shadow: 0 0 0 0.2rem rgba(222, 170, 12, 0.5);
}

.btn-warning.disabled,
.btn-warning:disabled {
  color: #212529;
  background-color: #ffc107;
  border-color: #ffc107;
}

.btn-warning:not(:disabled):not(.disabled):active,
.btn-warning:not(:disabled):not(.disabled).active,
.show>.btn-warning.dropdown-toggle {
  color: #212529;
  background-color: #d39e00;
  border-color: #c69500;
}

.btn-warning:not(:disabled):not(.disabled):active:focus,
.btn-warning:not(:disabled):not(.disabled).active:focus,
.show>.btn-warning.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(222, 170, 12, 0.5);
}

.btn-danger {
  color: #fff;
  background-color: #dc3545;
  border-color: #dc3545;
}

.btn-danger:hover {
  color: #fff;
  background-color: #c82333;
  border-color: #bd2130;
}

.btn-danger:focus,
.btn-danger.focus {
  color: #fff;
  background-color: #c82333;
  border-color: #bd2130;
  box-shadow: 0 0 0 0.2rem rgba(225, 83, 97, 0.5);
}

.btn-danger.disabled,
.btn-danger:disabled {
  color: #fff;
  background-color: #dc3545;
  border-color: #dc3545;
}

.btn-danger:not(:disabled):not(.disabled):active,
.btn-danger:not(:disabled):not(.disabled).active,
.show>.btn-danger.dropdown-toggle {
  color: #fff;
  background-color: #bd2130;
  border-color: #b21f2d;
}

.btn-danger:not(:disabled):not(.disabled):active:focus,
.btn-danger:not(:disabled):not(.disabled).active:focus,
.show>.btn-danger.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(225, 83, 97, 0.5);
}

.btn-light {
  color: #212529;
  background-color: #f8f9fa;
  border-color: #f8f9fa;
}

.btn-light:hover {
  color: #212529;
  background-color: #e2e6ea;
  border-color: #dae0e5;
}

.btn-light:focus,
.btn-light.focus {
  color: #212529;
  background-color: #e2e6ea;
  border-color: #dae0e5;
  box-shadow: 0 0 0 0.2rem rgba(216, 217, 219, 0.5);
}

.btn-light.disabled,
.btn-light:disabled {
  color: #212529;
  background-color: #f8f9fa;
  border-color: #f8f9fa;
}

.btn-light:not(:disabled):not(.disabled):active,
.btn-light:not(:disabled):not(.disabled).active,
.show>.btn-light.dropdown-toggle {
  color: #212529;
  background-color: #dae0e5;
  border-color: #d3d9df;
}

.btn-light:not(:disabled):not(.disabled):active:focus,
.btn-light:not(:disabled):not(.disabled).active:focus,
.show>.btn-light.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(216, 217, 219, 0.5);
}

.text-white {
  color: #fff;
}

.navbar-caseid {
  margin: 0px;
}

.btn-menu {
  color: #fff !important;
  text-decoration: none !important;
}

.badge-primary {
  color: #fff;
  background-color: #007bff;
}

.btn .badge {
  position: unset;
  top: unset;
}

a.badge-primary:hover,
a.badge-primary:focus {
  color: #fff;
  background-color: #0062cc;
}

a.badge-primary:focus,
a.badge-primary.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}

.badge-secondary {
  color: #fff;
  background-color: #6c757d;
}

a.badge-secondary:hover,
a.badge-secondary:focus {
  color: #fff;
  background-color: #545b62;
}

a.badge-secondary:focus,
a.badge-secondary.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5);
}

.badge-success {
  color: #fff;
  background-color: #28a745;
}

a.badge-success:hover,
a.badge-success:focus {
  color: #fff;
  background-color: #1e7e34;
}

a.badge-success:focus,
a.badge-success.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
}

.badge-info {
  color: #fff;
  background-color: #17a2b8;
}

a.badge-info:hover,
a.badge-info:focus {
  color: #fff;
  background-color: #117a8b;
}

a.badge-info:focus,
a.badge-info.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
}

.badge-warning {
  color: #212529;
  background-color: #ffc107;
}

a.badge-warning:hover,
a.badge-warning:focus {
  color: #212529;
  background-color: #d39e00;
}

a.badge-warning:focus,
a.badge-warning.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
}

.badge-danger {
  color: #fff;
  background-color: #dc3545;
}

a.badge-danger:hover,
a.badge-danger:focus {
  color: #fff;
  background-color: #bd2130;
}

a.badge-danger:focus,
a.badge-danger.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
}

.badge-light {
  color: #212529;
  background-color: #f8f9fa;
}

a.badge-light:hover,
a.badge-light:focus {
  color: #212529;
  background-color: #dae0e5;
}

a.badge-light:focus,
a.badge-light.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
}

.badge-dark {
  color: #fff;
  background-color: #343a40;
}

a.badge-dark:hover,
a.badge-dark:focus {
  color: #fff;
  background-color: #1d2124;
}

a.badge-dark:focus,
a.badge-dark.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
}

.modal {
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.5)
}

.btn-flag {
  width: 100%;
}

.dropdown-user-menu {
  width: 220px;
  padding: 16px;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  border: none;
}

.dropdown-subtitle {
  color: #555;
  font-size: 16px;
  font-weight: 500;
  margin: 0px 0px 24px 0px;
}

.mt-3 {
  margin-top: 16px;
}

.icon-primary {
  color: #377ef9;
}

.icon-danger {
  color: #f93737;
}

.alert-danger {
  color: #fff;
  background-color: #ff3860;
}

.alert-info {
  color: hsla(204, 90%, 18%, 1);
  background-color: rgba(32, 156, 238, 0.5);
}

.alert-success {
  background-color: hsla(141, 53%, 53%, 1);
  color: #fff;
}

.alert-warning {
  background-color: hsla(48, 100%, 67%, 1);
  color: rgba(0, 0, 0, 0.7);
}

.badge-notification {
  position: absolute !important;
  right: 0px !important;
  top: 0px !important;
}

/* Rules for sizing the icon. */
.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;
}

/* Rules for using icons as black on a light background. */
.material-icons.md-dark {
  color: rgba(0, 0, 0, 0.54);
}

.material-icons.md-dark.md-inactive {
  color: rgba(0, 0, 0, 0.26);
}

/* Rules for using icons as white on a dark background. */
.material-icons.md-light {
  color: rgba(255, 255, 255, 1);
}

.material-icons.md-light.md-inactive {
  color: rgba(255, 255, 255, 0.3);
}

.has-feedback label~.form-control-feedback {
  top: 0 !important;
}

.toast-title {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 4px;
}

.toast-message {
  font-size: 14px;
  color: #555555;
  word-wrap: break-word;
}

.toast-icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: 12px;
  border-radius: 50%;
  margin-right: 16px;
  background-color: rgba(0, 98, 204, 0.3);
}

.toast-close {
  padding: 8px;
  margin-left: auto;
  font-size: 16px !important;
  color: #bfbfbf;
}

.toast-close:hover {
  color: #666666;
}

.toast-top-center {
  top: 0;
  right: 0;
  width: 100%;
}

.toast-bottom-center {
  bottom: 0;
  right: 0;
  width: 100%;
}

.toast-top-full-width {
  top: 0;
  right: 0;
  width: 100%;
}

.toast-bottom-full-width {
  bottom: 0;
  right: 0;
  width: 100%;
}

.toast-top-left {
  top: 130px;
  left: 24px;
}

.toast-top-right {
  top: 130px;
  right: 24px;
}

.toast-bottom-right {
  right: 24px;
  bottom: 24px;
}

.toast-bottom-left {
  bottom: 24px;
  left: 24px;
}

#toast-container {
  position: fixed;
  z-index: 999999;
  /*overrides*/
}

#toast-container * {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#toast-container .toast {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  overflow: hidden;
  padding: 16px;
  margin-bottom: 16px;
  width: 100%;
  min-width: 500px;
  max-width: 650px;
  -moz-border-radius: 3px 3px 3px 3px;
  -webkit-border-radius: 3px 3px 3px 3px;
  border-radius: 5px;
  border-left: 4px solid #377ef9;
  background-color: #fff;
  -moz-box-shadow: 2px 2px 7px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 2px 2px 7px rgba(0, 0, 0, 0.3);
  box-shadow: 2px 2px 7px rgba(0, 0, 0, 0.3);
}

#toast-container .toast:hover {
  cursor: pointer;
}

#toast-container.toast-top-center .toast,
#toast-container.toast-bottom-center .toast {
  width: 300px;
  margin-left: auto;
  margin-right: auto;
}

#toast-container.toast-top-full-width .toast,
#toast-container.toast-bottom-full-width .toast {
  width: 96%;
  margin-left: auto;
  margin-right: auto;
}

.toast-success {
  border-left: 4px solid #00b476 !important;
}

.toast-success .toast-title {
  color: #00b476 !important;
}

.toast-success .toast-icon {
  background-color: rgba(0, 180, 118, 0.3) !important;
}

.toast-success .toast-icon:before {
  content: 'check';
  color: #00b476;
}

.toast-error {
  border-left: 4px solid #ff5353 !important;
}

.toast-error .toast-title {
  color: #ff5353 !important;
}

.toast-error .toast-icon {
  background-color: rgba(255, 83, 83, 0.3) !important;
}

.toast-error .toast-icon:before {
  content: 'close';
  color: #ff5353;
}

.toast-info {
  border-left: 4px solid #377ef9 !important;
}

.toast-info .toast-title {
  color: #377ef9 !important;
}

.toast-info .toast-icon {
  background-color: rgba(55, 126, 249, 0.3) !important;
}

.toast-info .toast-icon:before {
  content: 'info';
  color: #377ef9;
}

.toast-warning {
  border-left: 4px solid #ffd035 !important;
}

.toast-warning .toast-title {
  color: #ffd035 !important;
}

.toast-warning .toast-icon {
  background-color: rgba(255, 208, 53, 0.3) !important;
}

.toast-warning .toast-icon:before {
  content: 'warning';
  color: #ffd035;
}

progress-bar {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 4px;
  background-color: rgba(0, 0, 0, 0.3);
}

/*Animations*/
div[toast] {
  opacity: 1 !important;
}

div[toast].ng-enter {
  opacity: 0 !important;
  transition: opacity .3s linear;
}

div[toast].ng-enter.ng-enter-active {
  opacity: 1 !important;
}

div[toast].ng-leave {
  opacity: 1;
  transition: opacity .3s linear;
}

div[toast].ng-leave.ng-leave-active {
  opacity: 0 !important;
}

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

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

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

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

.bg-primary {
  background-color: #377ef9 !important;
}

.navbar-teamtask {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: fixed;
  height: 102px;
  align-items: center;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1050;
}

.navbar-back {
  width: 24px;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3);
  cursor: pointer;
}

.navbar-logo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding-left: 27px;
  padding-right: 38px;
  background-color: rgba(0, 0, 0, 0.1);
  cursor: pointer;
  width: 179px;
}

.navbar-logo img{
  width: 127px;
}

.user-toolbar {
  height: 48px;
}

.system-toolbar {
  height: 54px;
}

.btn-navbar {
  color: #fff;
  background-color: rgba(0, 0, 0, 0.1);
  padding: 8px !important;
}

.btn-navbar.active {
  background-image: none;
  outline: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  background-color: rgba(0, 0, 0, 0.3);
}

.btn-navbar:focus {
  color: #fff;
}

.btn-navbar:hover {
  color: #fff;
  background-color: rgba(1, 1, 1, 0.2);
}

.btn-navbar-active {
  background-color: rgba(0, 0, 0, 0.3);
}

.btn-user-tool {
  background-color: transparent;
}

.title-btn-system {
  font-size: 16px;
  padding-left: 8px;
  padding-right: 8px;
}

.m-0 {
  margin: 0px;
}

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

.btn-link:hover {
  text-decoration: none;
}

.warning-color {
  color: #ffd035;
}

.error-color {
  color: #a94442;
}

.navbar-select .select2-container .select2-choice {
  height: 42px;
  border: none;
  line-height: 42px;
  border-radius: 5px;
  background-color: rgba(1, 1, 1, 0.1);
  box-shadow: none;
  -webkit-box-shadow: none;
}

.navbar-select .select2-dropdown-open .select2-choice {
  background-image: none;
}

.navbar-select .select2-container .select2-choice>.select2-chosen {
  margin-right: 38px;
  color: #fff;
}

.navbar-select .select2-container .select2-choice .select2-arrow {
  border: none;
  background: none;
  width: 24px;
  height: 24px;
  right: 8px;
  top: 8px;
}

.navbar-select .select2-container .select2-choice .select2-arrow b {
  width: 24px;
  height: 24px;
  background: url('../images/svgs/arrow_drop_down.svg');
}

.select2-drop {
  padding-top: 4px;
}

.hide-on-medium {
  display: none;
}

.show-on-medium {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.isChatTask {
  width: 60% !important;
}

.isChat {
  width: 40% !important;
}

.isChat .card-chat {
  width: 420px;
}

.hideChat {
  width: 100% !important;
}

.dropdown-menu {
  color: #666;
}

@media (max-width: 1440px) {
  .hide-on-medium {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 38px;
    line-height: 38px;
    padding: 0px 8px !important;
  }

  .show-on-medium {
    display: none;
  }

  .isChatTask {
    width: 55% !important;
  }

  .isChat {
    width: 45% !important;
  }

  .title-btn-system {
    max-width: 100px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
}

@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
  .hide-on-medium {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 38px;
    line-height: 38px;
    padding: 0px 8px !important;
  }

  .show-on-medium {
    display: none;
  }

}

.p-3 {
  padding: 16px;
}

.position-relative {
  position: relative;
}

.toolbar-client-deslogado {
  background-color:rgb(105, 105, 105);
  position: fixed;
  width: 100%;
  right: 0;
}

.toolbar-client-disponivel {
  background-color:rgba(62, 206, 5);
  position: fixed;
  width: 100%;
  right: 0;
}

.toolbar-client-pausado {
  background-color:rgba(150, 150, 253);
  position: fixed;
  width: 100%;
  right: 0;
}

.toolbar-client-chamando {
  background-color:rgba(206, 206, 85);
  position: fixed;
  width: 100%;
  right: 0;
}

.toolbar-client-ocupado {
  background-color:rgba(221, 119, 119);
  position: fixed;
  width: 100%;
  right: 0;
}

.toolbar-client-aguardando {
  background-color:rgb(255, 179, 71);
  position: fixed;
  width: 100%;
  right: 0;
}

.metadata {
  display: inline-block;
  float: right;
  padding: 0 0 0 7px;
  position: relative;
  bottom: -4px;
}

.metadata .time {
  color: rgba(0, 0, 0, .45);
  font-size: 11px;
  display: inline-block;
}


/* CHAT */

/* @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap'); */
@font-face {
  font-family: 'Roboto';
  src: url('../fonts/Roboto-Regular.ttf');
}

:root {
  
  /* Colors */
  --bg-primary: #3574DD;
  --bg-secondary: #ecf1f8;
  --border: #377ef9;
  --text-primary: #4a4a4a;
  --text-invert: #FFF;
  --status-on: #32e4cd;
  --status-off: #E43247;
  
  /* Spacings */
  --padding-default: 15px;
  --margin-message: 5px;
  
  /* Heights */
  --chat-height: 50px;
  --header-height: 50px;
  --footer-height: 56px;
  
}

/* Chat Area Row */
/* ------------------------------------------------------------------------ */

.chatAreaContent {
  position: fixed;
  bottom: 0;
  width: 100%;
  height: var(--header-height);
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: flex-end;
}


/* Chat Options */
/* ------------------------------------------------------------------------ */

.chatMore {
  width: 60px;
  min-width: 60px;
  height: var(--header-height);
  background: #3574DD;
  margin-right: 15px;
  cursor: pointer;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  border: solid 1px var(--border);
  position: relative;
}

.chatMore[data-title]:before {
  font-family:'Roboto';
  position: absolute;
  top: -8px;
  right: -8px;
  background: red;
  content: attr(data-title);
  font-size: 11px;
  font-weight: 500;
  color: #fff;
  background: #FB565C;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 20px;
}

.chatMore > img {
  width: 30px;
  height: 30px;
}

.chatMoreListContainer {
  position: fixed;
  width: 50px;
  bottom: 55px;
  right: 8px;
  background: green;
  max-height: 300px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  visibility:hidden;
  transform: translateY(200px);
  transition: all ease .25s;
}

.chatMessagesContainer {
  background: #fff;
  position: fixed;
  bottom: 65px;
  right: 5px;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
  max-height: 0px;
  width: 150px;
  border: solid 1px #dbdbdb;
  border-radius: 6px;
  font-family:'Roboto';
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: all ease 0.25s;
  visibility: hidden;
}

.chatMessagesContainer.active {
  width: 350px;
  max-height: 75%;
  visibility: visible;
}

.chatMessagesContainer .cm_row {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: space-between;
  align-items: center;
}

.chatMessagesContainer .cm_header {
  width: 100%;
  border-bottom: solid 1px #dbdbdb;
  padding: 18px;
  box-sizing: border-box;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 5px 10px 0px;
}

.chatMessagesContainer .cm_header h4 {
  font-size: 16px;
  font-weight: 700;
  margin: 0;
  padding: 0;
}

.chatMessagesContainer .cm_close {
  width: 32px;
  height: 32px;
  cursor: pointer;
}

.chatMessagesContainer .cm_search {
  width: 100%;
  border: solid 1px #dbdbdb;
  height: 42px;
  padding: 0 8px 0 38px;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 14px;
  font-size: 13px;
  outline: none;
  font-family:'Roboto';
  /* background: url('https://cdn0.iconfinder.com/data/icons/web-basics-2/24/search-512.png') 10px center no-repeat; */
  background-size: 20px 20px;
}

.chatMessagesContainer .cm_search:focus {
  border-color: #3574DD;
  box-shadow: rgba(53, 116, 221, 0.1) 0px 3px 12px;
}

.chatMessagesContainer .cm_list {
  width: 100%;
  height: 100%;
  display: flex;
  padding: 0;
  margin: 0;
  list-style: none;
  overflow: auto;
  flex-direction: column;
}

.chatMessagesContainer .cm_lititem {
  width: 100%;
  box-sizing: border-box;
  padding: 14px 18px;
  border-bottom: solid 1px #dbdbdb;
  margin: 0;
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  transition: 0.15s;
  cursor: pointer;
}

.chatMessagesContainer .cm_lititem:before {
  content: '';
  width: 2px;
  height: 0px;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  background: #3574DD;
  transition: 0.15s;
}

.chatMessagesContainer .cm_lititem:hover {
  background: #F6F8FC;
}

.chatMessagesContainer .cm_lititem:hover:before {
  height: 100%;
}

.chatMessagesContainer .cm_lititem:hover .cm_code {
  color: #3574DD;
}

.chatMessagesContainer .cm_thumb {
  min-width: 42px;
  min-height: 42px;
  background: #ecf1f8;
  border-radius: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 15px;
}

.chatMessagesContainer .cm_thumb>img {
  width: 15px;
  height: 15px;
}

.chatMessagesContainer .cm_itemContent {
  display: flex;
  flex-direction: column;
  flex: 1;
  width: 100%;
  overflow: hidden;
}

.chatMessagesContainer .cm_code {
  color: #000;
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 4px;
  margin-top: 4px;
}

.chatMessagesContainer .cm_time {
  color: #989A9B;
  font-size: 12px;
  font-weight: 500;
}

.chatMessagesContainer .cm_name {
  color: #989A9B;
  font-size: 12px;
  font-weight: 500;
  margin-bottom: 10px;
}

.chatMessagesContainer .cm_message {
  font-size: 12px;
  font-weight: 500;
  color: #4a4a4a;
  line-height: 18px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chatMessagesContainer .cm_new {
  font-size: 11px;
  font-weight: 500;
  color: #fff;
  background: #FB565C;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  min-height: 18px;
  border-radius: 18px;
  margin-left: 15px;
}


/* Chat Styles */
/* ------------------------------------------------------------------------ */

.chatBox {
  font-family: 'roboto';
  transform: translateY(calc(var(--chat-height) - var(--header-height)));
  right: 40px;
  width: 270px;
  height: var(--chat-height);
  border: solid 1px var(--border);
  box-sizing: border-box;
  transition: all ease .25s;
  margin-right: 8px;
  border-radius: 6px 6px 0 0;
  overflow: hidden;
}

.chatBox.active {
  transform: translateY(0);
  width: 400px;
}

.chatBox.active {
  bottom: 0;
}

.chatContainer {
  flex: 1;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.chatHeader {
  display: flex;
  width: 100%;
  height: var(--header-height);
  background: #FFF;
  align-items: stretch;
  align-items: center;
  box-sizing: border-box;
  padding: 0 var(--padding-default);
  cursor: pointer;
  position: relative;
}

.chatBox.active .chatHeader {
  background: var(--bg-primary);
}

.chatBox.active .chatHeader .ch_code,
.chatBox.active .chatHeader .title,
.chatBox.active .chatHeader .ch_code,
.chatBox.active .chatHeader .ch_time,
.chatBox.active .chatHeader .ch_user {
  color: var(--text-invert);
}

.chatBox .chatHeader .title,
.chatBox .chatHeader .ch_code {
  color: #0073F7;
}

.chatBox .chatHeader .ch_time,
.chatBox .chatHeader .ch_user {
  color: #000;
  font-weight: 500;
}


.chatHeader .close {
  display: none;
}

.chatBox.active .chatHeader .close {
  display: block;
}

.chatHeader[data-notification]:before {
    font-family:'Roboto';
    background: red;
    content: attr(data-notification);
    font-size: 10px;
    font-weight: 500;
    color: #fff;
    background: #FB565C;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 16px;
    border-radius: 20px;
    margin-right: 5px;
}

.chatHeader[data-notification] {
  background: #FFF9DB;
}

.chatHeader .status {
  width: 10px;
  height: 10px;
  background: var(--status-on);
  border-radius: 10px;
  margin-right: 10px;
}

.chatHeader .status.off {
  background: var(--status-off);
}

.chatHeader .ch_code,
.chatHeader .title{
  font-size: 14px;
  font-weight: 500;
  overflow: hidden;
  text-wrap: nowrap;
  text-overflow: ellipse;
  flex-grow: 1;
}

.chatHeader .ch_content {
  display: flex;
  flex-direction: column;
}

.chatHeader .ch_time,
.chatHeader .ch_user {
  font-size: 13px;
  line-height: 14px;
  white-space: nowrap;
  /* text-align: right; */
  color: #FFF;
  opacity: 0.6;
}

.chatHeader .close {
  padding: var(--padding-default);
  margin-right: -15px;
  box-sizing: border-box;
  cursor: pointer;
}

.chatHeader .close > img {
  width: 10px;
  height: 10px;
}


.chatContent {
  display: flex;
  flex: 1;
  overflow: auto;
  overflow-x: hidden;
  background: #FFF;
  box-sizing: border-box;
  padding: var(--padding-default);
  flex-direction: column;
}

.chatContent ::-moz-selection { /* Code for Firefox */
  color: rgb(224, 133, 133);
  background: rgb(242, 242, 160);
}

.chatContent ::selection {
  color: rgb(224, 133, 133);
  background: rgb(242, 242, 160);
}

.chatMessage {
  display: flex;
  margin-bottom: 18px;
}


.chatMessage.writer {
  flex-direction: row-reverse;
  width: 100%;
  word-break: break-word;
}

.chatMessage .userImg {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  margin-right: 8px;
}

.chatMessage.writer .userImg {
  margin-right: 0;
  margin-left: 8px;
}

.chatMessage .messageContent {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}


.chatMessage .message {
  padding: 10px;
  background: var(--bg-secondary);
  font-size: 15px;
  border-radius: 5px;
  margin-bottom: var(--margin-message);
  color: var(--text-primary);
  flex-direction: row-reverse;
  width: 100%;
  word-break: break-word;
}

.chatMessage.writer .message {
  background: var(--bg-primary);
  color: var(--text-invert);
}

.chatMessage .image {
  padding: 10px;
  background: var(--bg-secondary);
  font-size: 15px;
  border-radius: 5px;
  margin-bottom: var(--margin-message);
  color: var(--text-primary);
  flex-direction: row-reverse;
  width: 100%;
  word-break: break-word;
}

.chatMessage.writer .image {
  background: var(--bg-primary);
  color: var(--text-invert);
}

.chatMessage .when {
  /* display: block; */
  width: 100%;
  text-align: left;
  font-size: 11px;
  color: #989A9B;
}

.chatMessage.writer .when {
  text-align: right;
}

.chatFooter {
  background: #FFF;
  width: 100%;
  /* display: flex;
  border-top: solid 1px var(--border);
  height: var(--footer-height); */
  box-sizing: border-box;
  align-items: center;
}

.chatFooter .chatTextarea {
  flex: 1;
  border: none;
  outline: none;
  resize: none;
  padding: 20px 12px 20px 12px;
  height: 56px;
  box-sizing: border-box;
  font-family: 'roboto';
  font-size: 13px;
}

.chatFooter .chatSendButton {
  font-size: 12px;
  background: var(--bg-primary);
  padding: 8px;
  border-radius: 4px;
  color: var(--text-invert);
  margin-right: var(--padding-default);
  margin-left: var(--padding-default);
  cursor: pointer;
}


.chatBox.active .chatMessage {
  animation-name: slideFromLeft;
  transition-timing-function: cubic-bezier(0.4, -0.04, 1, 1);
  -webkit-animation-duration: 0.35s;
          animation-duration: 0.35s;
}

.chatBox.active .chatMessage.writer {
  animation-name: slideFromRight;
}

.colorRed{
  color: red !important;
}

.colorGreen{
  color: green !important;
}

@-webkit-keyframes slideFromLeft {
    0% {
        transform: translateX(-200px);
        opacity: 0;
    }
    100% {
        transform: translateX(0px);
        opacity: 1;
    }
}

@-webkit-keyframes slideFromRight {
    0% {
        transform: translateX(200px);
        opacity: 0;
    }
    100% {
        transform: translateX(0px);
        opacity: 1;
    }
}

.__chatRow {
  flex: 1;
}

.__chatId {
  color: #3574dd;
  font-family: 'roboto';
  font-size: 14px;
  font-weight: 700;
}

.__chatUser {
  color: #7B92A5;
  font-family: 'roboto';
  font-size: 11px;
  font-weight: 500;
  margin-top: 2px;
}

.__chatCaso{     
  color: #fff !important; 
}

.__chatStatusTime {
  color: #7B92A5;
  font-family: 'roboto';
  font-size: 11px;
  font-weight: 500;
  position: relative;
  padding-right: 19px;
  margin-right: 27px;
}

.__chatStatusTime:after {
  position: absolute;
  width: 8px;
  height: 8px;
  content: '';
  right: 0px;
  top: 0px;
  bottom: 0px;
  margin: auto;
  background: #27AE60;
  border-radius: 10px;
  outline: solid 4px rgba(39,174,96, 0.15);
}

.__chatStatusTime.danger:after {
  background: #EB5757;
  outline: solid 4px rgba(235,87,87, 0.15);
}

.btn-sair {
  background-color: #ad2121;
  color: #ffffff;
  border-radius: 4px;
}

.grupo-sair {
  float: left; 
  overflow: hidden;
}

.grupo-continuar {
  overflow: hidden;
}


.caseCheck{
  margin-bottom:0px;
}

.displayNone{
  display: none;
}

.width24{
  width: 24px;
}

.teamtask-display-none{
  display:none;
}

.chat-margin-top {
  margin-top: 35px;
}

.case-view-result {
  background-color: white;width:80%;
}

.case-sameclient-combo {
  margin-top: 15px; 
  text-align: right !important;
}

.case-email.content {
  filter: contrast(0.3);
}

.case-email-contant-generec {
  height: auto;
  max-height: 350px;
}

.case-message-chat-img {
  width: 40px; 
  height: 40px;
}

.case-view-pre {
  height: 180px; 
  background-color: #FFFFFF;
}

.case-view-fields-ul {
  padding-left: 17px
}

.he-0 {
  height: 100%;
}

.he-1 {
  height: 30px;
}

.he-2 {
  height: 90%;
}

.wid-0 {
  width: 80%;
}

.wid-1 {
  width: 0%;
}

.text_align-0{
  text-align: center;
}

.message_margin_top {
  margin-top: 11px;
}

.questionnaire_describe {
  height: 100%;
}

.dd_describe {
  height: 100%;
}

.dynamic.fields-table {
  overflow: auto;
}

.dynamic_align {
  position: relative;
  left: 9px;
}

.modal_menu{
  height: 150px;
  text-align: center;
}

.button-menu{
  padding: 6px !important;
}

.dropdown-menu-position{
  position: relative;
}

.table_menu-action{
  float: left;
  padding-left: 6px;
}

.table_menu-action_a{
  margin-left: 35px;
}

.table_menu-action_padding{
  padding-left: 40px;
}

.panel-widget-0 {
  right: 13px;
  position: fixed;
  cursor: pointer;
  margin: 0;
}

.panel-widget-1 {
  overflow-y: inherit;
}

.mar-lef-0 {
  margin-left: 10px;
}

.iframe_upload-panel {
  display:none;
  width:0px;
  height:0px;
}

.chat-messages-color{
  color: #dc3545;
}

.chat-messages-0{
  display: flex;
  align-items: center; 
  justify-content: center; 
  cursor: pointer;
}

.chat-messages-1{
  max-width: 25px;
  width: 25px;
  flex-grow: 1;
}

.chat-messages-2{
  flex-grow: 2;
  user-select: none;
}

.chat-messages-3{
  white-space: nowrap;
  margin: 0px;
}

.chat-messages-4{
  padding: 5px;
  display:none;
}

.chat-messages-5{
  cursor: pointer;
  height: 22px;
  width: 22px;
}

.chat-messages-6{
  display: none;
  height: 22px;
  width: 22px;
}

.compo-multiselect-ui-0{
  margin-bottom: 0px !important;
  margin-top: 0px !important;
}

.grouped-combo-ui-0{
  float:right; 
  margin-bottom:5px;
}

.grouped-combo-ui-1{
  margin-bottom: 0px !important; 
  margin-top: 0px !important; 
  clear:both;
}

.grouped-combo-ui-2{
  margin-bottom: 0px !important; 
  margin-top: 0px !important;
}

.grouped-combo-ui-3{
  width:200px; 
  max-width: 300px;
}

.posi_simplechat{
  position: relative;
}

.tabel-ui-0{
  width: 300px !important;
  height: 30px !important;
}

.tabel-ui-1{
  width:110px;
  display:block;
}

.tabel-ui-2{
  color:blue;
  text-decoration: underline;
}

.video-chat-0{
  z-index: 9999;
}

.case-message-chat-0{
  padding-right: 12px;
  width: 70%;
}

.index-0{
  position:absolute;
  width:0;
  height:0
}

.marginTopAc{
  margin-top: 48px;
}

.toolbarTransf{
  padding: 6px !important;color: #0824c4;
}

.toolbarTransfRed{
  padding: 6px !important;color: #df1405;
}

.toolbarTransfYellow{
  padding: 6px !important;color: #08ff00;
}

.left16{
  margin-left: 16px;
}

.padding6{
  padding: 6px !important;
}

.marginTop48{
  margin-top: 48px;
}

.divLeft{
  margin-left: auto;margin-right: auto;
}

.styleToolbarbt{
  text-align: center;width: 150px;border: 0 !important;height: 38px;line-height: 38px;border-radius: 5px;background-color: rgba(1, 1, 1, 0.1);-webkit-box-shadow: none;padding: 6px !important;margin-left: 8px;color: white;font-weight: bold;
}

.styleToolbarbtWS{
  text-align: left;width: 430px;border: 0 !important;height: 38px;line-height: 38px;border-radius: 5px;background-color: #ad2222;-webkit-box-shadow: none;padding: 6px !important;margin-left: 8px;color: white;font-weight: bold;
}

.ttCall{
  padding: 6px !important;color: #08ff00;
}

.ttTransf{
  padding: 6px !important;color: #9eb952;
}

.ttTrasnf2{
  padding: 6px !important;color: #b0c2af;
}

.ttTransf3{
  padding: 6px !important;color: #66a6ca;
}

.callOf{
  padding: 6px !important;color: #ff0c0c;
}

.callon{
  padding: 6px !important;
}

.chatMes{
  display: flex; align-items: center; justify-content: center; cursor: pointer;
}

.chatMax{
  max-width: 25px;width: 25px;flex-grow: 1;
}

.chatFlex{
  flex-grow: 2; user-select: none;
}

.chatSpace{
  white-space: nowrap; margin: 0px;
}

.chatPnone{
  padding: 5px;
  display:none !important
}

.chatWM{
  white-space: nowrap; margin: 0px;
}
.chatUp{
  cursor: pointer; height: 22px;width: 22px;
}

.chatMarTop10{
  margin-top: 10px;
}

.chatMarTop35{
  margin-top: 35px;
}

.btSave{
  margin-bottom: 100px !important;
}

.btbRemover {
  margin-bottom: 1px;
}

#timerReconnect {
  padding-right: 20px;
}

#timerReconfig {
  padding-right: 20px;
}