@font-face {
  font-family: Quicksand;
  src: url("../ttf/Quicksand-Regular.ttf");
}

.exportar-btn {
  width: 70px;
  background-color: transparent !important;
  text-decoration: underline !important;
  color: #41a7db !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/*custom css for datatable reflow*/
.ui-datatable-reflow .ui-datatable-data td[role="gridcell"] .ui-column-title {
  float: left !important;
  clear: left !important;
  text-align: left !important;
}
body .ui-datatable tbody tr td {
  text-align: center;
}

.ui-widget,
.ui-widget .ui-widget {
  font-size: 100% !important;
}

.alinharColunasDireita {
  text-align: right;
}

.topBarScroll {
  max-height: 250px;
  overflow: hidden;
  overflow-y: scroll;
}

.tabmenuitem-link {
  position: relative;
  display: inline-block;
}
.inbox-label-badge2 {
  background: #00a7db;
  text-align: center;
  border-radius: 30px 30px 30px 30px;
  color: white;
  padding: 1px 5px;
  font-size: 11px;
  margin-right: -10px;
}

.inbox-label-badge3 {
  background: #00a7db;
  text-align: center;
  border-radius: 30px 30px 30px 30px;
  color: white;
  padding: 1px 5px;
  font-size: 11px;
  margin-right: -10px;
  margin-left: 2px;
  margin-top: -10px;
}
.inbox-label-badge4 {
  background: #00a7db;
  text-align: center;
  border-radius: 30px 30px 30px 30px;
  color: white;
  padding: 1px 5px;
  font-size: 11px;
  margin-right: -10px;
  margin-left: 184px;
  margin-top: -66px;
}
.inbox-label-badge5 {
  background: #ff6551;
  text-align: center;
  border-radius: 30px 30px 30px 30px;
  color: white;
  padding: 1px 5px;
  font-size: 11px;
  margin-right: -10px;
  margin-left: 2px;
  margin-top: -10px;
}

.inbox-label-badge6 {
  display: inline-block;
  font-size: 13px;
  /* margin-right: -10px; */
  margin-left: -20px;
  /* z-index: 100000000; */
  margin-top: -13px;
  vertical-align: top;
}
.imagem_centro {
  margin-top: -10px;
}

.starrate {
  color: gold !important;
}

.img_center {
  margin-left: auto;
  margin-right: auto;
  display: block;
  height: 100px;
}
.text_img {
  margin-top: 31px;
  margin-left: auto;
  margin-right: auto;
  display: block;
  text-align: center;
  font-size: 18px;
  font-weight: bold;
}
.text_img2 {
  margin-top: 21px;
  margin-left: auto;
  margin-right: auto;
  display: block;
  text-align: center;
  font-size: 15px;
  color: #373e46;
}
.text_center {
  margin-top: 21px;
  margin-left: auto;
  margin-right: auto;
  display: block;
  text-align: center;
  font-size: 15px;
  color: #373e46;
}
.label_custom {
  color: #373e36;
  padding-right: 0px;
  float: left;
  margin-left: 40px;
}

.custom-inputNumber input {
  width: 60px;
  font-weight: bold !important;
  margin-right: 10px;
}
.custom-inputNumber2 input {
  width: 120px;
  font-size: 40px !important;
  border: none !important;
  font-weight: bold !important;
  margin-right: 10px;
}

.linha {
  margin-left: 40px;
  margin-right: 40px;
  margin-top: 34px;
  margin-bottom: 32px;
  border-style: solid;
  border-left: none;
  border-top: none;
  border-right: none;
  border-bottom-color: #aaaaaa;
  border-width: 1px;
}

.output_custom {
  font-size: 18px;
  color: #aaa;
}
.custom-modal {
  background-color: #fafafa !important;
}
.custom-modal div {
  background-color: #fafafa !important;
}

.custom-modal2 {
  background-color: #fafafa !important;
}
.custom-modal2:first-child {
  background-color: #fafafa !important;
}
.painel_tabela {
  height: 100% !important;
  margin-bottom: 0px !important;
  margin-top: 0px !important;
  padding-bottom: 0px !important;
  padding-top: 0px !important;
}

.login-body .login-panel {
  background-color: #ffffff;
  width: 600px;
  margin: 50px auto;
  padding-bottom: 20px;
  -webkit-box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24),
    0 17px 50px 0 rgba(0, 0, 0, 0.19);
  -moz-box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24),
    0 17px 50px 0 rgba(0, 0, 0, 0.19);
  box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24),
    0 17px 50px 0 rgba(0, 0, 0, 0.19);
}
.login-body .login-panel .login-header {
  margin-bottom: 10px;
  background-color: #262728;
  color: #d8dadb;
  height: 110px;
  position: relative;
}
.login-body .login-panel .login-header h1 {
  font-size: 18px;
  font-weight: 700;
}
.login-body .login-panel .login-header h2 {
  font-size: 14px;
  font-weight: normal;
  margin-top: 0;
}
.login-body .login-panel .login-header img {
  width: 150px;
  height: 90px;
  position: relative;
  align-content: center;
}
.login-body .login-panel .login-header.ui-g-12 {
  padding: 10px 10px;
  margin-bottom: 20px;
  text-align: center;
}
.login-body .login-panel .ui-g-12 {
  padding: 0px 0px;
}

.alert-minimo {
  background-color: #ff40158a !important;
}
@media (max-width: 640px) {
  .login-body {
    padding-top: 150px;
  }
  .login-body .login-panel {
    width: 300px;
  }
  .login-body .login-panel .ui-g-12 {
    padding: 5px 10px;
  }
}
@media only screen and (max-height: 480px) {
  #dlg_novo {
    width: auto !important;
    overflow-y: scroll;
    overflow-x: scroll;
    height: 480px !important;
  }
}
@media only screen and (max-width: 720px) {
  #dlg_novo {
    width: auto !important;
    overflow-x: scroll;
  }
}
@media only screen and (max-device-height: 1366px) {
  #comandaDlg {
    overflow: scroll !important;
    height: 100% !important;
  }
}
#cat_desativada {
  -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
}

.img_cad_usuario {
  background-image: url("../images/front/login.png");
  background-size: 100% 100%;
  height: 475px;
  width: 100%;
}

.passo_1 {
  background-image: url("../images/front/TOPO_1.png");
  background-size: cover;
}

.passo_2 {
  background-image: url("../images/front/TOPO_2.png");
  background-size: cover;
}

.passo_3 {
  background-image: url("../images/front/TOPO_3.png");
  background-size: cover;
}

.espacamento_passos {
  margin-top: 30px;
  margin-bottom: 30px;
}

hr.ouou {
  border-top: 1px solid #8c8b8b;
  text-align: center;
  color: #999;
  margin-bottom: 10px;
  font-weight: bolder;
}

hr.ouou:after {
  content: "ou";
  display: inline-block;
  position: relative;
  top: -15px;
  padding: 0 20px;
  background-color: #fafafa;
  font-size: 18px;
}

.modal {
  width: 400px !important ;
}

.col.s12 > .btn {
  width: 100%;
}
body {
  font-family: Quicksand;
}

.coluna_esquerda {
  margin: 0px;
  padding: 10px;
  background-color: #fafaf8;
}

.coluna_direita {
  margin: 0px;
  padding: 10px;
  background-color: #fffefe;
}

.card-custom {
  padding: 0px !important;
  margin: 30px;
  margin-top: 0px;
  box-shadow: none !important;
}

.custom-table-card * {
  border: 0px !important;
  text-align: left !important;
}
.ui-paginator {
  text-align: center !important;
}
.ui-chkbox {
  border: 1px solid !important;
  border-color: #bdbdbd !important;
  border-radius: 5px !important;
}
.conteudo-top-tabela {
  margin-left: 30px;
  margin-top: 38px;
  margin-bottom: 48px;
  width: 100%;
}

.default-options-btn {
  border-radius: 0px !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

.btn-azul-claro {
  background-color: #40a7db !important;
}
.btn-azul-claro:hover {
  background-color: #3180a8 !important;
  color: white;
}
.btn-azul-claro svg {
  font-size: 14px !important;
  margin-top: -9px !important;
  margin-right: 0px;
  margin-left: 8px;
  top: 48% !important;
}

.btn-limpar {
  background-color: #77c6f3 !important;
  height: 40px !important;
  width: 90px;
}

.btn-azul-escuro {
  background-color: #343e43 !important;
  height: 40px !important;
  width: 120px;
}
.btn-azul-escuro:hover {
  background-color: #252c30 !important;
  color: white;
}

.btn-azul-escuro svg {
  font-size: 14px !important;
  margin-top: -9px !important;
  margin-right: 0px;
  margin-left: 13px;
  top: 48% !important;
}
.pagar-comissao svg {
  font-size: 14px !important;
  margin-top: -7px !important;
  margin-right: 0px;
  margin-left: 16px !important;
  top: 48% !important;
}
.btn-azul-claro-comanda {
  background-color: #0287d0 !important;
  height: 40px !important;
  box-shadow: none !important;
}
.btn-azul-claro-comanda:hover {
  background-color: #346e8e !important;
  color: white;
}
.btn-azul-escuro span:nth-child(2) {
  line-height: 31px !important;
}

.btn-azul-escuro-dre span {
  line-height: 15px !important;
}
.custom-height-padding {
  padding-top: 25px !important;
}

.btn-preto-escuro {
  background-color: #252c30 !important;
  height: 40px !important;
}
.btn-preto-escuro:hover {
  background-color: #343e43 !important;
  color: white;
}
.custom-calendar input {
  background-color: white;
  border-width: 1px 1px 1px 1px;
  border-radius: 5px;
  height: 36px !important;
  width: 120px;
  text-align: center;
}

.custom-calendar2 input {
  background-color: white;
  border-width: 1px 1px 1px 1px;
  border-radius: 5px;
  height: 20px !important;
  width: 75px;
  text-align: center;
}

.custom-calendar3 input {
  background-color: white;
  border-width: 1px 1px 1px 1px;
  border-radius: 5px;
  height: 27px !important;
  width: 120px;
  text-align: center;
}

.custom-select {
  background-color: white !important;
  border-width: 1px 1px 1px 1px;
  border-style: solid;
  border-color: #bdbdbd;
  border-radius: 5px !important;
  height: 40px !important;
  text-align: center;
}
.custom-select label {
  padding-top: 10px;
}
.custom-select-dre {
  width: 120px !important;
}
.custom-select-dre label {
  padding-top: 13px;
  padding-left: 36px;
}

custom-select:hover {
  background-color: black !important;
}

.custom-check-tabela span {
  margin-left: 0px !important;
}
.pdf-btn {
  border-radius: 0px !important;
  background-color: transparent !important;
  box-shadow: none !important;
  width: 45px !important;
  height: 45px !important;
}
.pdf-btn svg {
  padding-left: 3px;
  color: #343e42 !important;
  font-size: 18px !important;
  margin-top: -2px !important;
  margin-left: -21px !important;
}
.pdf-btn svg:hover {
  color: #1c74bf !important;
}
.download-btn svg {
  padding-left: 3px;
  color: #343e42 !important;
  font-size: 18px !important;
}

.download-btn svg:hover {
  color: #1c74bf !important;
}
.red-btn svg {
  padding-left: 3px;
}

.green-btn svg {
  padding-left: 3px;
  color: #1ddc61 !important;
  font-size: 18px !important;
}
.green-btn svg:hover {
  color: #343e4 !important;
}

.excluir-btn svg {
  padding-left: 3px;
  color: #ff6551 !important;
  font-size: 18px !important;
}
.excluir-btn svg:hover {
  color: #ff4e37 !important;
}
.pesquisar-btn svg {
  padding-left: 3px;
  color: #5398f7 !important;
  font-size: 18px !important;
}
.pesquisar-btn svg:hover {
  color: #d8dadb !important;
}

.addmoedas-btn svg {
  padding-left: 3px;
  color: #42d167 !important;
  font-size: 18px !important;
}
.addmoedas-btn svg:hover {
  color: #20c149 !important;
}

.editar-btn svg {
  padding-left: 3px;
  color: #41a7db !important;
  font-size: 18px !important;
}
.editar-btn svg:hover {
  color: #3e97c4 !important;
}

.fiscal-btn svg {
  padding-left: 3px;
  color: #000 !important;
  font-size: 18px !important;
}

.fiscal-btn svg:hover {
  padding-left: 3px;
  color: #797979 !important;
  font-size: 18px !important;
}

.moeda-btn svg {
  padding-left: 3px;
  color: #ffc107 !important;
  font-size: 18px !important;
}
.moeda-btn svg:hover {
  color: #d4af37 !important;
}
.excluir-moeda-btn svg {
  padding-left: 3px;
  color: #ff6551 !important;
  font-size: 18px !important;
}
.excluir-moeda-btn svg:hover {
  color: #ef8577 !important;
}

.visualizar-btn svg {
  padding-left: 3px;
  color: #343e42 !important;
  font-size: 18px !important;
}
.visualizar-btn svg:hover {
  color: #1c74bf !important;
}

.reabrir-btn svg {
  padding-left: 3px;
  color: #42d167 !important;
  font-size: 18px !important;
}
.reabrir-btn svg:hover {
  color: #20c149 !important;
}
.nova-conta-btn-zap {
  height: 40px !important;
  background-color: #3E7853 !important;
  box-shadow: none !important;
}
.nova-conta-btn-zap:hover {
  background-color: #20c149 !important;
}

.nova-conta-btn {
  height: 40px !important;
  background-color: #42d167 !important;
  box-shadow: none !important;
}


.nova-conta-btn:hover {
  background-color: #20c149 !important;
}

.nova-conta-btn span {
  font-size: 14px !important;
}
.nova-conta-btn svg {
  font-size: 14px !important;
  margin-top: -10px !important;
  margin-right: 0px;
  margin-left: 8px;
  top: 48% !important;
}

.nova-conta-btn svg:hover {
  color: #20c149;
}
.novo-vale-produto-btn {
  height: 40px !important;
  background-color: #41a7db !important;
  box-shadow: none !important;
}
.novo-vale-produto-btn:hover {
  background-color: #35afee !important;
}

.novo-vale-produto-btn span {
  font-size: 14px !important;
}
.novo-vale-produto-btn svg {
  font-size: 14px !important;
  margin-top: -10px !important;
  margin-right: 0px;
  margin-left: 8px;
  top: 48% !important;
}

.novo-vale-produto-btn svg:hover {
  color: #20c149;
}

.ver-detalhado-comissao {
  width: 120px !important;
  height: 40px !important;
  background-color: #00a7db !important;
  box-shadow: none !important;
}
.ver-detalhado-comissao span {
  line-height: 1 !important;
  font-size: 14px !important;
}
.ver-detalhado-comissao svg {
  font-size: 14px !important;
  margin-top: -10px !important;
  margin-right: 0px;
  margin-left: 8px;
  top: 48% !important;
}
.ver-detalhado-comissao:hover {
  background-color: #048eb9 !important;
}
.nova-compra-btn span {
  line-height: 1 !important;
  font-size: 14px !important;
}
.remover-btn {
  height: 40px !important;
  background-color: #ff6551 !important;
  box-shadow: none !important;
}
.remover-btn:hover {
  background-color: #ff4e37 !important;
}
.remover-btn svg {
  font-size: 14px !important;
  margin-top: -9px !important;
  margin-right: 0px;
  margin-left: 8px;
  top: 48% !important;
}

@media screen and (min-width: 720px) {
  .modal-agendamento {
    width: 433px !important;
  }
  .remover-btn {
    width: 120px !important;
  }
  .nova-conta-btn {
    width: 120px !important;
  }
  .btn-azul-escuro-comanda {
    width: 120px !important;
  }
  .btn-azul-claro-comanda {
    width: 120px !important;
  }
  .btn-preto-escuro {
    width: 120px !important;
  }
}

.btn-azul-escuro-comanda {
  background-color: #343e43 !important;
  height: 40px !important;
  box-shadow: none !important;
}

.btn-azul-escuro-comanda svg {
  font-size: 14px !important;
  margin-top: -10px !important;
  margin-right: 0px;
  margin-left: 7px;
  top: 48% !important;
}
.btn-azul-escuro-comanda:hover {
  background-color: #252c30 !important;
  color: white;
}

.pagar-btn svg {
  color: #343e42 !important;
}
.pagar-btn svg:hover {
  color: #1c74bf !important;
}
.pago-btn svg {
  color: #20c149 !important;
}

.def-senha-btn svg {
  color: #343e42 !important;
}
.def-senha-btn svg:hover {
  color: #1c74bf !important;
}

.custom-row thead tr {
  line-height: 3 !important;
}
.custom-row-relatorio-cliente tbody tr {
  line-height: 2 !important;
}
.custom-row {
  font-size: 14px !important;
}

.custom-row-mensalidade tbody tr {
  line-height: 2 !important;
}
th.custom-alinhamento-thead {
  padding-bottom: 23px !important;
}
.status_cliente {
  border-radius: 4px;
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 9px;
}

.cliente_inativo {
  padding-right: 20px !important;
  padding-left: 20px !important;
}
.cliente_ativo {
  padding-right: 20px !important;
  padding-left: 20px !important;
}
.cliente_semiativo {
  padding-right: 10px !important;
  padding-left: 10px !important;
}

.mensalidade {
  margin-left: -12px;
  margin-right: -10px;
  margin-top: -10px;
  font-size: 12px;
  height: 40px;
}
.mensalidade span {
  display: inline-block;

  vertical-align: middle;

  line-height: 3;
}
.margin-custom {
  margin-left: 30px;
}

@media screen and (max-width: 400px) {
  .titulo-h1 {
    font-size: 25px;
  }
}
@media screen and (max-width: 350px) {
  .titulo-h1 {
    font-size: 21px;
  }
}

@media screen and (max-width: 700px) {
  .mensalidade {
    margin-left: -12px;
    margin-right: -10px;
    margin-top: -10px;
    font-size: 12px;
    height: auto;
  }
  .mensalidade span {
    line-height: 1.5;
  }
  .card-custom {
    margin: 0px;
  }
  .margin-custom {
    margin: 0px;
  }
  .conteudo-top-tabela {
    margin-left: 5px;
    margin-top: 5px;
    margin-bottom: 10px;
    width: 100%;
  }
}

.pagar_agora {
  margin-left: 5px;
  height: 30px !important;
  top: 1px;
  background-color: #ebebeb !important;
}
.pagar_agora span {
  color: #2ba24a;
  line-height: 1 !important;
  font-size: 10px !important;
}

.status_mensalidade {
  color: #ffffff;
  border-radius: 4px;
  padding-top: 5px;
  padding-bottom: 5px;
}
.mensalidade_ATRASADO {
  background-color: #d14242;
  padding-right: 43px !important;
  padding-left: 43px !important;
}
.mensalidade_ABERTO {
  background-color: #42d167;
  padding-right: 38px !important;
  padding-left: 38px !important;
}
.mensalidade_PAGO {
  background-color: #42d167;
  padding-right: 55px !important;
  padding-left: 55px !important;
}
.mensalidade_PROCESSANDO {
  background-color: #676767;
  padding-right: 30px !important;
  padding-left: 30px !important;
}
.pagamento_hoje {
  color: #ffffff;
  background-image: linear-gradient(to right, #d9d721, #ab9a0b);
}
.pagamento_amanha {
  color: #ffffff;
  background-image: linear-gradient(to right, #42d167, #2ba24a);
}
.pagamento_semana {
  color: #ffffff;
  background-image: linear-gradient(to right, #42d167, #2ba24a);
}
.pagamento_atrasado {
  color: #ffffff;
  background-image: linear-gradient(to right, #d14242, #941414);
}

.top-menu-span span {
  font-size: 14px !important;
  line-height: 1 !important;
}

#inicioModal div:first-child {
  background: transparent !important;
}
#inicioModal div:nth-child(2) {
  background: transparent !important;
}
.inicio-btn span {
  font-size: 18px !important;
}
.botaoAvancarDataAgenda {
  border-radius: 0px !important;
  background-color: white !important;
  width: 15px;
  height: 40px !important;

  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}
.botaoAvancarDataAgenda svg {
  font-size: 11px;
  padding-left: 5px;
  color: #bdbdbd !important;
}
.nomeDiaAgenda {
  font-size: 12px;
  text-align: center;
  margin-top: 9px;
  height: 42px;
  padding-top: 13px !important;
  background: white;
}
.custom-calendar-sem-borda input {
  border-color: white;
  border-radius: 0px;
  width: 100%;
}

.custom-calendar-sem-borda2 input {
  border-color: white;
  border-radius: 5px;
  text-align: left;
  width: 70px;
}
.custom-calendar-sem-borda2 {
  width: 50% !important;
}

.customHeaderAtrasado .ui-widget-header {
  background-image: linear-gradient(to right, #d14242, #941414) !important;
  border: none !important;
}
.customHeaderPago .ui-widget-header {
  background-image: linear-gradient(to right, #42d167, #2ba24a) !important;
  border: none !important;
}
.customHeaderAberto .ui-widget-header {
  border: none !important;
  background-image: linear-gradient(to right, #68abef, #3b7ed2);
}
.customHeaderNaoGerada .ui-widget-header {
  border: none !important;
  background-image: linear-gradient(to right, #3e464c, #395668);
}

.ui-datatable.borderless thead th,
.ui-datatable.borderless tbody,
.ui-datatable.borderless tbody tr,
.ui-datatable.borderless tbody td {
  border-style: none;
}
.ui-datatable.borderless {
  width: 50%;
  background-color: #ffffff;
}
.ui-datatable.borderless thead {
  border: none;
}
.ui-datatable.borderless tbody tr {
  background-color: #ffffff !important;
  font-size: 11px;
}

.ui-datatable.borderless tbody tr td {
  text-align: left;
}
.ui-datatable.borderless thead th {
  display: none;
}

.ui-datatable.borderless-comanda thead th,
.ui-datatable.borderless-comanda tbody,
.ui-datatable.borderless-comanda tbody tr,
.ui-datatable.borderless-comanda tbody td {
  border-style: none;
}
.ui-datatable.borderless-comanda {
  width: 70%;
  background-color: #ffffff;
}
.ui-datatable.borderless-comanda thead {
  border: none;
}
.ui-datatable.borderless-comanda tbody tr {
  background-color: #fafafa !important;
  font-size: 14px;
}
.ui-datatable.borderless-comanda tbody tr td {
  text-align: left;
}
.ui-datatable.borderless-comanda thead th {
  display: none;
}

.custom-fp > div > label {
  font-size: 10px;
}

.titulo-comanda {
  text-decoration: underline;
  font-weight: 1000 !important;
}
.dotted-div {
  margin-bottom: 0px;
  border-top-style: dotted;
  border-top-width: 4px;
  border-top-color: #b3b3b3;
  margin-top: 10px;
}
.numParcelas input {
  width: 30px;
}
.valorInput input {
  width: 70px;
}
.custom-link {
  text-decoration: underline !important;
  color: #5299ff;
  font-weight: 1000;
}

.status_assinatura {
  display: inline-block;
  border-radius: 5px;
  font-weight: bold;
  color: black;
  padding-left: 2px;
  padding-right: 2px;
}

.status_assinatura_ATRASADO {
  background: #f04141;
  color: white !important;
}
.status_assinatura_PAGO {
  background: #1bdc61;
  color: white !important;
}

.status_assinatura_PENDENTE {
  background: #ff9a0a;
  color: white !important;
}
.status_assinatura_INATIVO {
  background: #ff9a0a;
  color: white !important;
}

.help-button {
  background: white !important;
  box-shadow: none !important;
  height: 20px !important;
  width: 15px !important;
}
.help-button svg {
  color: black !important;
  width: 15px !important;
  height: 15px !important;
}
.help-button::hover {
  background: white !important;
  box-shadow: none !important;
  height: 20px !important;
  width: 15px !important;
}