@charset "UTF-8";

/*=================================Set Valuer Default Body Start=================================*/

body {
    font-size: 16px !important;
}

html {
    font-size: 16px !important;
}

body,
html {
    position: relative;
    height: 100%;
    text-align: center;
}

input:focus {
    outline: 0 none;
}

textarea {
    outline: 0 none;
    overflow: auto;
}

select {
    outline: 0 none;
}

option {
    outline: 0 none;
}

label {
    margin-bottom: 1px !important;
}

a {
    outline: 0 none !important;
    text-decoration: none !important;
    color: #000 !important;
    cursor: pointer;
}

a:hover {
    outline: 0 none !important;
    text-decoration: none !important;
    color: #000 !important;
    cursor: pointer;
}

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


/*=================================End of Set Valuer Default Body=================================*/


/*==========================Typography Start============================*/

.h1lp {
    font-family: Muli-Light;
    font-weight: 300;
    font-size: 64px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 4rem;
}

.txt-black-14{
    font-family: Muli-Bold;
    font-size: 14px;
    color: rgba(0,0,0,0.80);
}

.h1 {
    font-family: Muli-SemiBold;
    font-weight: 600;
    font-size: 36px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 2.25rem;
}

.h2lp {
    font-family: Muli-SemiBold;
    font-weight: 600;
    font-size: 32px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 2rem;
}

.h3lp {
    font-family: Muli-SemiBold;
    font-weight: 600;
    font-size: 24px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 1.5rem;
}

.plp {
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 24px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 1.5rem;
}

.p {
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 18px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 1.125rem;
}

.mdtitle {
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 18px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 1.125rem;
    text-transform: uppercase;
}

.tbtext {
    float: left;
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 13px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 0.8125rem;
}

.inputlabel {
    float: left;
    font-family: Muli-Bold;
    font-weight: 700;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 0.75rem;
    /*text-transform: uppercase;*/
    transition: color 0.5s linear;
}

.txt-inputlabel {
    font-family: Muli-Bold;
    font-weight: 700;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 0.75rem;
}

.txt-assinatura{
    font-family: Muli-Bold;
    font-size: 12px;
    color: rgba(0,0,0,0.80);
}

.inputlabel-new{
    float: left;
    font-family: Muli-Regular;
    font-size: 14px;
    color: rgba(0,0,0,0.32);
    font-weight: 400;
    transition: color 0.5s linear;
}

.textRegular16{
    font-family: Muli-Regular;
    font-size: 16px;
    color: #000000;
    letter-spacing: 0;
    font-weight: 500;
}

.textRegular15{
    font-family: Muli-Regular;
    font-size: 15px;
    color: #000000;
    letter-spacing: 0;
    font-weight: 500;
}

.textRegular14{
    font-family: Muli-Regular;
    font-size: 14px;
    color: #000000;
    letter-spacing: 0;
    font-weight: 500;
}

.textRegular13{
    font-family: Muli-Regular;
    font-size: 13px;
    color: #000000;
    letter-spacing: 0;
    font-weight: 500;
}

.inputlabelMuted {
    /*font-family: muli, sans-serif;
    font-weight: 400;
    font-style: normal;*/
    font-family: Muli-Regular;
    font-size: 14px;
    color: #798DA3;
    font-weight: 400;
}

.textMediumMuted {
    font-family: Muli-Regular;
    font-size: 14px;
    color: #798DA3;
}

.inputlabelMutedSmall {
    float: left;
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 14px;
    color: #798DA3;
    font-size: 0.70rem;
    text-transform: uppercase;
    transition: color 0.5s linear;
}

.labelMutedMedium {
    float: left;
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 13px;
    color: #798DA3;
    font-size: 0.75rem;
    transition: color 0.5s linear;
    letter-spacing: 0;
}

.textTableMutedMedium {
    float: left;
    font-family: Muli-Regular;
    font-size: 13px;
    color: #798DA3;
    letter-spacing: 0;
}

.labeTextMedium {
    float: left;
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 13px;
    color: #000000;
    font-size: 0.75rem;
    text-transform: uppercase;
    transition: color 0.5s linear;
    letter-spacing: 0;
}

.labelTextMedium {
    float: left;
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 13px;
    color: #000000;
    font-size: 0.70rem;
    text-transform: uppercase;
    transition: color 0.5s linear;
    letter-spacing: 0;
}


/* Label ERRO: abaixo do Input*/

.inputlabelError {
    float: left;
    font-family: Muli-Regular;
    font-size: 14px;
    color: rgba(255, 0, 0, 0.64);
    transition: color 0.5s linear;
}

.textError {
    float: left;
    font-family: Muli-Regular;
    font-weight: 700;
    font-size: 12px;
    color: rgba(255,0,0,0.64);
    text-align: left;
}

.inputText-14{
    font-family: Muli-SemiBold;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.80);   
}

.inpuntDisable {
    float: left;
    font-family: Muli-SemiBold;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.80);
    background: #F5F6F7;
}

.textDetalhesInput {
    font-family: Muli-Regular;
    font-size: 12px;
    color: #798DA3;
    text-align: left;
}

.txtDetalhes-with-line {
    font-family: Muli-Regular;
    font-size: 12px;
    color: #798DA3;
    line-height: 16px;
}

.textMuli-SemiBold-14{
    float: left;
    text-align: left;
    font-family: Muli-SemiBold;
    font-size: 14px;
    color: #798DA3;
}

.txtTitleUserDet {
    font-family: Muli-Bold;
    font-weight: 700;
    font-size: 24px;
    font-size: 1.5rem;
    color: rgba(0, 0, 0, 0.8);
}

.txtDadosBas {
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 14px;
    font-size: 0.875rem;
    color: #90949c;
}

.txtDadosBasAzul {
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 14px;
    font-size: 0.875rem;
    color: #0077ff;
}

.txtDadosBasAzulRegular {
    font-weight: 400;
    font-size: 14px;
    color: #0077FF;
    font-family: Muli-SemiBold;
    text-align: center;
}

.txtDadosBasRazao {
    font-family: Muli-SemiBold;
    font-weight: 600;
    font-size: 16px;
    font-size: 1rem;
    color: rgba(0, 0, 0, 0.8);
}

.txtDadosBasInative {
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 14px;
    font-size: 0.875rem;
    color: rgba(0, 0, 0, 0.32);
}

.txtTitleDadoDet {
    float: left;
    font-family: Muli-SemiBold;
    font-weight: 600;
    font-size: 14px;
    font-size: 0.875rem;
    color: rgba(0, 0, 0, 0.32);
}

.txtDadosBas {
    font-family: Muli-SemiBold;
    font-weight: 600;
    font-size: 14px;
    font-size: 0.875rem;
    color: rgba(0, 0, 0, 0.8);
}

.hint {
    float: left;
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 0.75rem;
    margin-top: 5px;
    width: 364px;
    height: 15px;
    margin-top: 1px;
    margin-bottom: 10px;
    display: none;
}

.hinte {
    float: left;
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 0.75rem;
    margin-top: 5px;
    width: 364px;
    height: 15px;
    margin-top: 1px;
    margin-bottom: 10px;
}

.hintcount {
    float: left;
    font-family: Muli-SemiBold;
    font-weight: 600;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 0.75rem;
    margin-top: 5px;
}

.btnsmall {
    font-family: Muli-SemiBold;
    font-weight: 600;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 0.75rem;
    text-transform: uppercase;
}

.btnSmallMuted {
    /*font-weight: 600;*/
    font-family: Muli-SemiBold;
    font-size: 12px;
    color: #798DA3;
}

.btnmedium {
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 0.875rem;
    /* text-transform: uppercase; */
}

.btnlarge {
    font-family: Muli-SemiBold;
    font-weight: 600;
    font-size: 16px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 1rem;
    text-transform: uppercase;
}

.btnhuge {
    font-family: Muli-SemiBold;
    font-weight: 600;
    font-size: 18px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 1.125rem;
    text-transform: uppercase;
}

.txtAlert {
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 17px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 1.0625rem;
}

.txtSubMenu {
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 20px;
    color: white;
    font-size: 1.25rem;
}

.titleTableBottom {
    font-family: Muli-SemiBold;
    font-weight: 600;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 0.75rem;
    padding: 1.5px;
}

.itemTable {
    font-family: Muli-SemiBold;
    font-size: 13px;
    color: #000000;
    letter-spacing: 0;
    float: left;
    width: 100%;
}

.itemBoldMuted-13{
    font-family: Muli-SemiBold;
    font-size: 13px;
    color: #798DA3;
    text-align: left;
}

.itemTable.sub {
    font-family: Muli-Regular;
    font-size: 13px;
    color: #000000;
    letter-spacing: 0;
}

.itemTableMuted {
    font-family: Muli-Regular;
    font-size: 13px;
    color: #798DA3;
    letter-spacing: 0;
    float: left;
    width: 100%;
}

.itemTableMuted.sub {
    font-family: Muli-Regular;
    font-size: 13px;
    color: #798DA3;
    letter-spacing: 0;
}

.txtTableBottom {
    font-family: Muli-SemiBold;
    font-weight: 600;
    font-size: 13px;
    color: rgba(0, 0, 0, 0.5);
    font-size: 0.8125rem;
    padding: 1.5px;
}

.itemMsg{
    font-family: Muli-Regular;
    font-size: 14px;
    color: #000000;
    text-align: left;
}

.titleText-13{
    font-family: Muli-ExtraBold;
    font-size: 13px;
    color: rgba(0,0,0,0.80);
}

.titleSmartBold {
    font-family: Muli-Bold;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #000000;
}

.titleBold-muted{
    font-family: Muli-Bold;
    letter-spacing: 0;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #7B7B7B;
}

.title-16-white{
    color: #FFF;
    font-family: Muli-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.titleBoldWhit-14{
    font-family: Muli-Bold;
    font-size: 14px;
    color: #FFFFFF;
}

.font-14-card{
    color: #302F2F;
    font-family: Muli-Bold;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;    
}

.font-12-card{
    color: #494949;
    font-family: Muli-Bold;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.textSmartRegular {
    font-family: Muli-SemiBold;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.80);
}

.titleSmartNormal {
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.80);
    margin-left: 6px;
}

.titleNormalSM {
    font-family: Muli-Regular;
    font-size: 13px;
    color: #000000;
    letter-spacing: 0;
}

.titleBlue {
    font-family: Muli-Regular;
    font-size: 13px;
    color: #0091FF;
    letter-spacing: 0;
}

.titleBlack {
    font-family: Muli-Regular;
    font-size: 13px;
    color: #000000;
    letter-spacing: 0;
}

.titleGray{
    font-family: Muli-Regular;
    font-size: 13px;
    color: #798DA3;
    letter-spacing: 0;
}

.txtTitleTable {
    font-family: Muli-Bold;
    font-weight: 700;
    font-size: 16px;
    font-size: 1rem;
}

.textTableMuted-16{
    font-family: Muli-Bold;
    font-size: 16px;
    color: rgba(0,0,0,0.40);
}

.textTableBlue-16{
    font-family: Muli-Bold;
    font-size: 16px;
    color: #0077FF;
    text-align: right;
}

.textTable-16{
    font-family: Muli-Bold;
    font-size: 16px;
    color: rgba(0,0,0,0.80);
    text-align: right;
}

.textTableRed-16{
    font-family: Muli-Bold;
    font-size: 16px;
    color: #FF0120;
    text-align: right;
}

.txtTitleDash{
    font-family: Muli-Bold;
    font-size: 24px;
    color: rgba(0,0,0,0.80);
}

.txtTitleDashRed{
    font-family: Muli-Bold;
    font-size: 24px;
    color: #FF0120;
    text-align: center;
}

.txtTotalHoras {
    font-family: Muli-Bold;
    font-weight: 700;
    font-size: 22px;
    font-size: 1.375rem;
}

.txtLight {
    font-family: Muli-Light;
    font-weight: 300;
}

.txtLight36 {
    font-family: Muli-Light;
    font-size: 36px;
    color: #000000;
}

.txtRegular {
    font-family: Muli-Regular;
    font-weight: 400;
}

.txtSemiBold {
    font-family: Muli-SemiBold;
    font-weight: 600;
}

.txtBold {
    font-family: Muli-Bold;
    font-weight: 700;
}

.txtBlack {
    font-family: Muli-Black;
    font-weight: 900;
}

.fz-10 {
    font-size: 10px;
    font-size: 0.625rem;
}

.fz-12 {
    font-size: 12px;
    font-size: 0.75rem;
}

.fz-13 {
    font-size: 13px;
    font-size: 0.8125rem;
}

.fz-14 {
    font-size: 14px;
    font-size: 0.875rem;
}

.fz-16 {
    font-size: 16px;
    font-size: 1rem;
}

.fz-18 {
    font-size: 18px;
    font-size: 1.125rem;
}

.fz-20 {
    font-size: 20px;
    font-size: 1.25rem;
}

.fz-22 {
    font-size: 22px;
    font-size: 1.375rem;
}

.fz-24 {
    font-size: 24px;
    font-size: 1.5rem;
}

.fz-32 {
    font-size: 32px;
    font-size: 2rem;
}

.capitalize {
    text-transform: capitalize;
}

.uppercase {
    text-transform: uppercase;
}

.overflowHidden {
    overflow: hidden;
}

.let-spacing-2-4{
    letter-spacing: 2.4px;
}


/*==========================End of Typography============================*/


/*==========================Text Color Start=============================*/

.txtTituloSystem {
    color: #0077ff;
}

.txtcolordefault {
    color: rgba(0, 0, 0, 0.8);
}

.txtcolorsecondary {
    color: rgba(0, 0, 0, 0.6);
}

.txtcolordesactived {
    color: rgba(0, 0, 0, 0.4);
}

.labelfocus {
    color: #2196f3;
    transition: all 0.5s linear;
}

.labelerror {
    color: #e91e63;
}

.txtactive {
    color: #4a90e2;
}

.txtfocus {
    color: #00b9f7;
}

.txtsucesso {
    color: #50e3c2;
}

.txtalert {
    color: #ffea00;
}

.txterror {
    color: #e91e63;
}

.btn-cor-default {
    color: white;
}

.btn-cor-segundary {
    color: #e91e63;
}

.btn-cor-alt {
    color: rgba(0, 0, 0, 0.48);
}

.count {
    margin-top: 4px;
    float: right;
}


/*==========================End of Text Color=============================*/


/*===========================Background's Start===========================*/

.backmain {
    background: -webkit-linear-gradient(44deg, #2196f3 0%, #00e5fd 100%);
    background: -o-linear-gradient(44deg, #2196f3 0%, #00e5fd 100%);
    background: linear-gradient(134deg, #2196f3 0%, #00e5fd 100%);
}

.backmaintransp {
    background: -webkit-linear-gradient(44deg, rgba(33, 150, 243, 0.8) 0%, rgba(0, 229, 253, 0.8) 100%);
    background: -o-linear-gradient(44deg, rgba(33, 150, 243, 0.8) 0%, rgba(0, 229, 253, 0.8) 100%);
    background: linear-gradient(134deg, rgba(33, 150, 243, 0.8) 0%, rgba(0, 229, 253, 0.8) 100%);
}

.bkDefault {
    background: rgba(0, 0, 0, 0.8);
}

.bkSecondary {
    background: rgba(0, 0, 0, 0.6);
}

.bkDesactived {
    background: rgba(0, 0, 0, 0.4);
}

.bg-gray-dark{
    background: #E9EEF2;
}

.bgMenuVertical {
    background: #0091FF;
}

.bg-progress-bar-destak {
    background-color: #0077FF!important;
}

.bg-progress-bar {
    background-color: rgba(0, 119, 255, 0.4)!important;
}

.bg-ass-alter{
    background: #FFFFFF;
}

.bg-vermelho{
    background: #FE4364;
}

.bg-verde{
    background: #60D669;
}

.bg-amarelo{
    background: #f5a623;
}

.bg-azul-marinho{
    background: #EFF6FC;
}

.bg-cinza{
    background: #707070;
}

.grade-tabela{
    border: 1px solid #DBDBDB;
}

.bg-whatsapp{
    background: rgb(217, 253, 211);
}

.bg-msg-anonimo{
    background: #707070;
}

.bg-azul-end{
    background: #DBEEFF;
}

.bg-verde-whats{
    background: #d9fdd3;
}

.grade-tabela-r{
    border-right: 1px solid #DBDBDB;
}

.grade-tabela-b{
    border-bottom: 1px solid #DBDBDB;
}

/*===========================End of Background's===========================*/

/*===============================Input's Start==============================*/

.inputmsg {
    width: 364px;
    height: 16px;
    margin-top: 1px;
    margin-bottom: 10px;
}

.inputPes {
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 7.5px;
    padding-bottom: 8.5px;
    /* width: 364px; */
    width: 100%;
    height: 36px;
    border: none;
    display: block;
    /* -webkit-box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.80);
  -o-box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.80);
  -moz-box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.80);
  box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.80); */
    border-radius: 4px;
    transition: all 0.5s linear;
}

.inputPes:focus {
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 7.5px;
    padding-bottom: 8.5px;
    width: 364px;
    width: 100%;
    height: 36px;
    border: none;
    display: block;
    color: rgba(0, 0, 0, 0.8);
    /* -webkit-box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.80);
  -o-box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.80);
  -moz-box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.80);
  box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.80); */
    background-image: linear-gradient(-134deg, rgba(33, 150, 243, 0.2) 0%, rgba(0, 229, 253, 0.2) 100%);
    border-radius: 4px;
    transition: all 0.5s linear;
}


/*========================Input CheckBox ===========================*/

input[type="time"]::-webkit-calendar-picker-indicator {
    background: none;
    display: none;
}

/* apenas elementos checkbox */
/*
input[type="checkbox"]:checked {
    display: none;
    background: #fff;
    border-radius: 4px;
    border: 1px solid #E9EEF2;
}
*/
input[type=checkbox] {
    background: #fff;
    border-radius: 4px;
    border: 1px solid #E9EEF2;
  } 


.inputCheckBox {
    transform: scale(1.25);
    background: #fff;
    border-radius: 4px;
    border: 1px solid #E9EEF2;
}

.checkbox-custom {
    display: none;
  }
  .checkbox-custom-label {
    display: inline-block;
    position: relative;
    vertical-align: middle;
    margin: 5px;
    cursor: pointer;
  }
  .checkbox-custom + .checkbox-custom-label:before {
    content: '';
    background: #fff;
    border-radius: 5px;
    border: 2px solid #ddd;
    display: inline-block;
    vertical-align: middle;
    width: 10px; height: 10px;
    padding: 2px; margin-right: 10px;
  }
  .checkbox-custom:checked + .checkbox-custom-label:after {
    content: "";
    padding: 2px;
    position: absolute;
    width: 1px;
    height: 5px;
    border: solid blue;
    border-width: 0 3px 3px 0;
    transform: rotate(45deg);
    top: 2px; left: 5px;
  }

.exemplo2 input[type=radio],
.exemplo2 input[type=checkbox] {
    display: none;
    transform: scale(1.25);
    /* Esconde os inputs */
}

.exemplo2 label {
    cursor: pointer;
}

.exemplo2 input[type="checkbox"]+label:before {
    transform: scale(1.25);
    background: #fff;
    border-radius: 4px;
    border: 1px solid #E9EEF2;
    content: "\00a0";
    display: inline-block;
    font: 16px/1em sans-serif;
    height: 16px;
    margin: 0 .25em 0 0;
    vertical-align: top;
    width: 16px;
}

.exemplo2 input[type="checkbox"]:checked+label:before {
    background: #0077FF;
    color: #FFF;
    content: "\2713";
    /*content: "✓";*/
    text-align: center;
}


.inputDate{
    border: none;
    background: #E9EEF2;
    font-family: Muli-Regular;
    font-size: 13px;
    color: #798DA3;
    padding: 0%;
    padding-top: 0%;
    padding-right: 0%;
    padding-bottom: 0%;
    padding-left: 0%;
    margin: 0%;
    margin-top: 0%;
    margin-right: 0%;
    margin-bottom: 0%;
    margin-left: 0%;
    padding-top: 1px;
    padding-left: 2px;
}

.inputDate:focus{
    border: none;
    background: #E9EEF2;
    font-family: Muli-Regular;
    font-size: 13px;
    color: #798DA3;
    padding: 0%;
    padding-top: 0%;
    padding-right: 0%;
    padding-bottom: 0%;
    padding-left: 0%;
    margin: 0%;
    margin-top: 0%;
    margin-right: 0%;
    margin-bottom: 0%;
    margin-left: 0%;
    padding-top: 1px;
    padding-left: 2px;
}

.inputDateWhite{
    padding: 0%;
    padding-top: 0%;
    padding-right: 0%;
    padding-bottom: 0%;
    padding-left: 0%;
    margin: 0%;
    margin-top: 0%;
    margin-right: 0%;
    margin-bottom: 0%;
    margin-left: 0%;
    padding-top: 2px;
    padding-left: 6px;
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 1rem;
    color: #555555;
}

.inputDateWhite:focus{
    padding: 0%;
    padding-top: 0%;
    padding-right: 0%;
    padding-bottom: 0%;
    padding-left: 0%;
    margin: 0%;
    margin-top: 0%;
    margin-right: 0%;
    margin-bottom: 0%;
    margin-left: 0%;
    padding-top: 2px;
    padding-left: 6px;
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 1rem;
    color: #555555;
}


.divFiltro{
    width: 270px;
}

.card-custom-filtro {
    background: #FFFFFF;
    border-radius: 3px;
    border: 0.4px solid #000;
    display: flex;
    margin-right: 10px;
}

.card-aplicated-filter{
    border-radius: 3px;
    border: 0.4px solid #000;
    display: flex;
    margin-right:10px;
    padding: 3px 10px 4px 5px;
}

.card-versao{
    border-radius: 10px;
    background: #FFF;
    box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.10);
    padding: 13px;
}

.card-versao-item{
    border-radius: 10px;
    background: #F5F6F7;
    padding: 10px;
    margin-bottom: 10px;
}

/*========================Input Pesquisa Listagem===================*/

.inputPesquisaModal {
    padding: 11px 40px;
    width: 320px;
    height: 40px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    display: block;
    font-family: Muli-SemiBold;
    font-size: 14px;
    background: white;
    border-radius: 12px;
    color: rgba(0, 0, 0, 0.80);
    transition: box-shadow 0.5s linear;
}

.inputPesquisaModal:focus {
    padding: 11px 40px;
    width: 320px;
    height: 40px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    display: block;
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.16);
    font-family: Muli-SemiBold;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.80);
    background: white;
    border-radius: 12px;
    transition: box-shadow 0.5s linear;
}

.autocomplete-suggestions {
    /* border: 1px solid #999; */
    background: white;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26), 0 2px 10px 0 rgba(0, 0, 0, 0.16);
    border-radius: 4px;
    margin-top: 4px;
    padding: 8px 0px 8px 0px;
    color: rgba(0, 0, 0, 0.8);
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 16px;
    font-size: 1rem;
    overflow: auto;
}

.autocomplete-suggestion {
    padding: 12px 16px;
    white-space: nowrap;
    height: 40px;
    cursor: pointer;
    overflow: hidden;
}

.autocomplete-selected {
    background: #60cdff;
}

.autocomplete-suggestions strong {
    font-weight: normal;
    color: #3399FF;
}


/* .autocomplete-suggestions:hover strong{
  font-weight: normal; color: #FFF;
}  */

.autocomplete-group {
    padding: 2px 5px;
}

.autocomplete-group strong {
    display: block;
    border-bottom: 1px solid #000;
}

.iconPesquiList {
    position: absolute;
    margin-top: 8px;
    margin-left: 8px;
    display: block;
    transition: all 0.5s linear;
}

.iconPesquiList>svg g {
    fill: #000;
    fill-opacity: 0.34;
    transition: all 0.5s linear;
}

.iconDashboard {
    background: rgba(0, 0, 0, 0.16);
    border-radius: 24px;
    border-radius: 24px;
}

@keyframes example {
    0% {
        fill-opacity: 0.34;
    }
    25% {
        fill-opacity: 0.45;
    }
    50% {
        fill-opacity: 0.50;
    }
    75% {
        fill-opacity: 0.75;
    }
    100% {
        fill-opacity: 1;
    }
    from {
        fill: #000;
    }
    to {
        fill: #007AFF;
    }
}


.inputPesquisaModal:focus~.iconPesquiList>svg g {
    animation-name: example;
    animation-duration: 1s;
    fill: #007AFF;
    fill-opacity: 1;
    transition: all 0.5s linear;
}

.iconPesqClearList {
    position: absolute;
    margin-top: -24px;
    margin-left: 97%;
    font-size: 12px;
}


/*=======================Fim de Input Pesquisa Listagem=====================*/

.inputn {
    padding-left: 7px;
    padding-right: 0px;
    padding-top: 7.5px;
    padding-bottom: 8.5px;
    /* width: 364px; */
    width: 100%;
    height: 36px;
    border: 1px solid #E9EEF2;
    border-radius: 4px;
    display: block;
    /*-webkit-box-shadow: inset -1px -1px -1p -1px rgba(0, 0, 0, 0.8);
  -o-box-shadow: inset -1px -1px -1px -1px rgba(0, 0, 0, 0.8);
  -moz-box-shadow: inset -1px -1px -1px -1px rgba(0, 0, 0, 0.8);
  box-shadow: inset -1px -1px 1px -1px rgba(0, 0, 0, 0.8);*/
    background: transparent;
    /*transition: box-shadow 0.5s linear;*/
}

.inputnselect {
    width: 380px;
    height: 36px;
    margin-top: 1px;
    padding-left: 0px;
    padding-right: 0px;
    border: none;
    display: block;
    -webkit-box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.8);
    -o-box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.8);
    -moz-box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.8);
    box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.8);
    background: transparent;
}

.inputnselectf {
    width: 380px;
    height: 36px;
    padding-left: 0px;
    padding-right: 0px;
    margin-top: 1px;
    border: none;
    display: block;
    -webkit-box-shadow: inset 0 -2px 0 0 #23a9f6;
    -o-box-shadow: inset 0 -2px 0 0 #23a9f6;
    -moz-box-shadow: inset 0 -2px 0 0 #23a9f6;
    box-shadow: inset 0 -2px 0 0 #23a9f6;
    background: transparent;
}

.inputntext {
    padding-top: 8px;
    padding-bottom: 8px;
    width: 364px;
    height: 71px;
    border: none;
    display: block;
    -webkit-box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.8);
    -o-box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.8);
    -moz-box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.8);
    box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.8);
    resize: none;
}

.inputntextf {
    padding-top: 8px;
    padding-bottom: 8px;
    width: 364px;
    min-height: 71px;
    border: none;
    display: block;
    -webkit-box-shadow: inset 0 -2px 0 0 #23a9f6;
    -o-box-shadow: inset 0 -2px 0 0 #23a9f6;
    -moz-box-shadow: inset 0 -2px 0 0 #23a9f6;
    box-shadow: inset 0 -2px 0 0 #23a9f6;
    background: transparent;
    resize: none;
}


/* Essa Classe é Ativada Quando o Usuário Clica sobre o INPUT*/

.inputf {
    padding-top: 7.5px;
    padding-bottom: 8.5px;
    padding-left: 7px;
    padding-right: 0px;
    /* width: 364px; */
    width: 100%;
    height: 36px;
    border: 1px solid #23a9f6;
    border-radius: 4px;
    display: block;
    /*-webkit-box-shadow: inset 0 -2px 0 0 #23a9f6;
  -o-box-shadow: inset 0 -2px 0 0 #23a9f6;
  -moz-box-shadow: inset 0 -2px 0 0 #23a9f6;
  box-shadow: inset 0 -2px 0 0 #23a9f6;*/
    background: transparent;
    /*transition: box-shadow 0.5s linear;*/
}


/* Essa Classe pode ser usada para Indicar uma Valor Inválido
digitado no Input*/

.inputfError {
    padding-top: 7.5px;
    padding-bottom: 8.5px;
    padding-left: 7px;
    padding-right: 0px;
    /* width: 364px; */
    width: 100%;
    height: 36px;
    border: 1px solid #FF0000;
    border-radius: 4px;
    display: block;
    /*-webkit-box-shadow: inset 0 -2px 0 0 #FF0000;
  -o-box-shadow: inset 0 -2px 0 0 #FF0000 ;
  -moz-box-shadow: inset 0 -2px 0 0 #FF0000 ;
  box-shadow: inset 0 -2px 0 0 #FF0000;*/
    background: transparent;
    /*transition: box-shadow 0.5s linear; */
}

.inpute {
    /*padding-top: 7.5px;
    padding-bottom: 8.5px;
    padding-left: 0px;
    padding-right: 0px;*/
    /* width: 364px; */
    /*width: 100%;
    height: 36px;
    border: none;*/
    display: block;
    /*-webkit-box-shadow: inset 0 -1px 0 0 #e91e63;
    -o-box-shadow: inset 0 -1px 0 0 #e91e63;
    -moz-box-shadow: inset 0 -1px 0 0 #e91e63;
    box-shadow: inset 0 -1px 0 0 #e91e63;
    background: transparent;*/
}

.inputef {
    padding-top: 7.5px;
    padding-bottom: 8.5px;
    padding-left: 0px;
    padding-right: 0px;
    /* width: 364px; */
    width: 100%;
    height: 36px;
    border: none;
    display: block;
    -webkit-box-shadow: inset 0 -2px 0 0 #e91e63;
    -o-box-shadow: inset 0 -2px 0 0 #e91e63;
    -moz-box-shadow: inset 0 -2px 0 0 #e91e63;
    box-shadow: inset 0 -2px 0 0 #e91e63;
    background: transparent;
}

.inputepas {
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 0px;
    padding-right: 0px;
    /* width: 364px; */
    width: 100%;
    height: 20px;
    border: none;
    display: block;
    -webkit-box-shadow: inset 0 -1px 0 0 #e91e63;
    -o-box-shadow: inset 0 -1px 0 0 #e91e63;
    -moz-box-shadow: inset 0 -1px 0 0 #e91e63;
    box-shadow: inset 0 -1px 0 0 #e91e63;
    background: transparent;
}

.select {
    /*background: url(../img/seta.png) no-repeat; /* Imagem de fundo (Seta) */
    /*background-position: 348px center;  /*Posição da imagem do background*/
    -webkit-appearance: none;
    /* Remove estilo padrão do Chrome */
    -moz-appearance: none;
    /* Remove estilo padrão do FireFox */
    appearance: none;
    /* Remove estilo padrão do FireFox*/
    background: transparent;
    z-index: 10;
}

.option {
    border: 5px solid #AAA;
    background-color: #fff;
    -webkit-appearance: none;
    /* Remove estilo padrão do Chrome */
    -moz-appearance: none;
    /* Remove estilo padrão do FireFox */
    appearance: none;
    /* Remove estilo padrão do FireFox*/
    box-shadow: 5px #e91e63;
    background: transparent;
}

.passwords {
    padding-right: 36px;
}

.textRadioChek {
    margin-left: 6px;
    margin-right: 22px;
}

.iconPesqui {
    position: absolute;
    margin-top: 6px;
    margin-left: 3px;
}

.iconPesqClear {
    position: absolute;
    margin-top: -24px;
    margin-left: 97%;
    font-size: 12px;
}

.inputPesIcons {
    padding-left: 31px;
    padding-right: 26px;
}

.inputPesIcons:focus {
    padding-left: 31px;
    padding-right: 26px;
}

.input-busca{
    height: 44px;
    padding: 8px;
    margin-bottom: 3px;
    border: 1px solid #9A9696;
    border-radius: 8px;
    display: flex;
}

.input-placeholder {
    color: #000!important;
}

.input-placeholder-anonimo {
    color: rgba(255, 255, 255, 0.78)!important;
}

.input-placeholder::placeholder {
    color: rgba(48, 48, 48, 0.54);
}

.input-placeholder-anonimo::placeholder {
    color: rgba(255, 255, 255, 0.78);
}

.busca-os{
    position: absolute;
    right: 32px;
    top: 130px;
    width: 291px;
    height: 50px;
    border-radius: 4px;
    background: #FFF;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    padding: 3px 10px 7px 9px;
}

.div-busca{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 100%;
}

.input-bucsa-os{
    width: 205px;
    height: 20px;
    padding-left: 2px;
    border: none;
    border-bottom: 2px solid #F5F6F7;;
}

/*==================================DIV wrap the input's====================*/

.dinput {
    position: relative;
    width: 100%;
    margin-top: 20px;
    float: left;
}

.dinput.uf {
    padding-top: 21px;
}

.dinputTop {
    position: relative;
    width: 75%;
    float: left;
}

.no-bd {
    border: 0px !important;
}

.uf .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-left: 9px !important;
    padding-top: 5px !important;
}


/*================================================Float===============================================*/

.fl {
    float: left;
}

.fr {
    float: right;
}


/*==================================End of DIV wrap the input's====================*/


/*==================================Input Checkbox Start===========================*/


/* Base for label styling */


/* [type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
display: none;
}
[type="checkbox"]:not(:checked) + label,
[type="checkbox"]:checked + label {
  position: relative;
  padding-left: 2em;
  cursor: pointer;
} */


/* checkbox aspect */


/* [type="checkbox"]:not(:checked) + label:before{
  content: '';
  position: absolute;
  left: 0; top: 0;
  width: 1.5em; height: 1.5em;
  border: 2px solid rgba(74,144,226,1);
  background: transparent;
} */


/* checked mark aspect */


/* [type="checkbox"]:checked + label:after {
  content: '✔';
  position: absolute;
  top: .1em; left: .1em;
  font-size: 1.8em;
  line-height: 0.8;
  color: rgba(35,169,246,1);
  transition: all .2s;
}
checked mark aspect changes
[type="checkbox"]:not(:checked) + label:after {
  opacity: 0;
  transform: scale(0);
}
[type="checkbox"]:checked + label:after {
  opacity: 1;
  transform: scale(1);
} */


/* disabled checkbox */


/* [type="checkbox"]:disabled:checked + label:before {
  content: '✔';
  position: absolute;
  top: .1em; left: .1em;
  font-size: 1.8em;
  line-height: 0.8;
  color: rgba(35,169,246,1);
  transition: all .2s;
}
[type="checkbox"]:disabled:not(:checked) + label:before{
content: '';
position: absolute;
left: 0; top: 0;
width: 1.5em; height: 1.5em;
border: 2px solid rgba(144,148,156,1);
}
[type="checkbox"]:disabled:checked + label:after {
  color: #bdb9b9;
}
[type="checkbox"]:disabled + label {
  color: #aaa;
} */


/* accessibility */


/*[type="checkbox"]:checked:focus + label:before,
[type="checkbox"]:not(:checked):focus + label:before {
 /* border: 2px dotted blue;
}*/


/* hover style just for information */


/*label:hover:before {
  border: 2px solid #4778d9!important;
}*/


/* Base for label styling */


/* [type="radio"]:not(:checked),
[type="radio"]:checked {
display: none;
}
[type="radio"]:not(:checked) + label,
[type="radio"]:checked + label {
  position: relative;
  padding-left: 2em;
  cursor: pointer;
} */


/* checkbox aspect */


/* [type="radio"]:checked + label:before,
[type="radio"]:not(:checked) + label:before{
  content: '';
  position: absolute;
  left: 0; top: 0;
  height: 1.5rem; width: 1.5rem;
  width: 1.5rem; height: 1.5rem;
  border: 2px solid rgba(74,144,226,1);
  border-radius: 1.5rem;
} */


/* checked mark aspect */


/* [type="radio"]:checked + label:after {
  content: '';
  position: absolute;
  top: .18em; left: .156em;
  height: 1.125rem; width: 1.125rem;
  font-size: 1.8em;
  line-height: 0.8;
  color: rgba(35,169,246,1);
  transition: all .2s;
  background: rgba(74,144,226,1);
  border-radius: 1.5rem;
}
[type="radio"]:not(:checked) + label:after {
  position: absolute;
  top: .2em; left: .156em;
  height: 1.125rem; width: 1.125rem;
  font-size: 1.8em;
  line-height: 0.8;
  color: rgba(35,169,246,1);
  transition: all .2s;
} */


/* checked mark aspect changes */


/* [type="radio"]:not(:checked) + label:after {
  opacity: 0;
  transform: scale(0);
}
[type="radio"]:checked + label:after {
  opacity: 1;
  transform: scale(1);
} */


/* disabled checkbox */


/* [type="radio"]:disabled:checked + label:before {
  content: '';
  position: absolute;
  top: .1em; left: .1em;
  font-size: 1.8em;
  line-height: 0.8;
  color: rgba(35,169,246,1);
  transition: all .2s;
}
[type="radio"]:disabled:not(:checked) + label:before{
content: '';
position: absolute;
left: 0; top: 0;
width: 1.5em; height: 1.5em;
border: 2px solid rgba(144,148,156,1);
}
[type="radio"]:disabled:checked + label:after {
  color: #bdb9b9;
}
[type="radio"]:disabled + label {
  color: #aaa;
} */


/*=================================End of Input Checkbox=======================*/


/*===================================Icon in Input===========================*/

.icon_input {
    position: absolute;
    top: 25px;
    right: 4px;
    z-index: 1;
    border: none;
    background: transparent;
    outline: none;
    color: #90949c;
}

.icon_input:hover {
    position: absolute;
    top: 25px;
    right: 4px;
    z-index: 10;
    border: none;
    background: transparent;
    outline: none;
    color: #4a90e2;
    cursor: pointer;
}

.icon_select {
    position: absolute;
    /*top: 0px;*/
    right: 0;
    bottom: -5px;
    border: none;
    background: transparent;
    outline: none;
    z-index: -1;
    color: #90949c;
    cursor: pointer;
}

.icon_select:hover {
    position: absolute;
    /*top: 0px; */
    right: 0;
    bottom: -5px;
    z-index: -1;
    border: none;
    background: transparent;
    outline: none;
    color: #4a90e2;
    cursor: pointer;
}


/*===================================End of Icon in Input===========================*/


/*==================================End of Input's=================================*/


/*==================================Icones Start===================================*/


/*===============================Size Font Icones Start============================*/

.material-icons.fs-14 {
    font-size: 16px;
    font-size: 1rem;
}

.material-icons.fs-18 {
    font-size: 18px;
    font-size: 1.125rem;
}

.material-icons.fs-19 {
    font-size: 19px;
    font-size: 1.1875rem;
}

.material-icons.fs-24 {
    font-size: 24px;
    font-size: 1.5rem;
}

.material-icons.fs-32 {
    font-size: 32px;
    font-size: 2rem;
}


/*==============================End of Size Font Icones============================*/


/*==============================Color Icons Start=================================*/

.material-icons.fc-default {
    color: #90949c;
}

.material-icons.fc-write {
    color: white;
}

.material-icons.fc-secundary {
    color: #ff1967;
}

.material-icons.fc-noti {
    color: rgba(0, 0, 0, 0.4);
}

.material-icons.fc-focus {
    color: #0077ff;
}


/*===============================End of Color Icons===============================*/


/*==================================End of Icones==================================*/


/*=================================Elevation Start=================================*/

.elv1 {
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26), 0 2px 10px 0 rgba(0, 0, 0, 0.16);
}

.elv1_1 {
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
}

.elv2 {
    box-shadow: 0 8px 17px 0 rgba(108, 84, 84, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.elv3 {
    box-shadow: 0 17px 50px 0 rgba(0, 0, 0, 0.19), 0 12px 15px 0 rgba(0, 0, 0, 0.24);
}

.elv4 {
    box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.19), 0 16px 28px 0 rgba(0, 0, 0, 0.24);
}


/*==================================End of Elevation=================================*/


/*===================================Start Button====================================*/

.save {
    float: right;
    background: #7ed321;
    height: 40px;
    padding: 11px 16px;
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.16);
    border-radius: 4px;
    color: #fff;
    font-family: Muli-Black;
    font-weight: 900;
    font-size: 14px;
    font-size: 0.875;
    cursor: pointer;
    margin-right: 16px;
    border: none;
}

.saveDiv {
    float: right;
    background: #0077FF;
    height: 40px;
    padding: 11px 11px;
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.16);
    color: #0077FF;
    font-family: Muli-Black;
    font-weight: 900;
    font-size: 14px;
    font-size: 0.875;
    cursor: pointer;
    margin-right: 16px;
    border: none;
    border-radius: 50%;
}

.saveDivMuted {
    float: right;
    background: #FFFFFF;
    height: 40px;
    padding: 11px 11px;
    /*box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.16);*/
    color: #0077FF;
    font-family: Muli-Black;
    font-weight: 900;
    font-size: 14px;
    font-size: 0.875;
    cursor: pointer;
    margin-right: 16px;
    border: none;
    border-radius: 50%;
}

.textBlack16{
    font-family: Muli-Black;
    font-size: 16px;
    color: rgba(0,0,0,0.80);
}

.saveAlternativo {
    float: right;
    background: transparent;
    height: 40px;
    border: 1px solid #7ed321;
    color: #7ed321;
    font-family: Muli-Black;
    font-weight: 900;
    border-radius: 4px;
    font-size: 14px;
    font-size: 0.875;
    padding: 11px 16px;
}

.bnt-small {
    background-image: -webkit-linear-gradient(44deg, #2196f3 0%, #00e5fd 100%);
    background-image: -o-linear-gradient(44deg, #2196f3 0%, #00e5fd 100%);
    background-image: linear-gradient(134deg, #2196f3 0%, #00e5fd 100%);
    border: none;
    border-radius: 24px;
    position: relative;
    height: 24px;
    margin: 0;
    width: 104px;
    padding: 0 24px;
    display: inline-block;
    letter-spacing: 0;
    overflow: hidden;
    will-change: box-shadow;
    transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    outline: none;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    vertical-align: middle;
}

.bnt-confirm-modal {
    background: #0077ff;
    border: none;
    border-radius: 4px;
    position: relative;
    margin: 0;
    margin-bottom: 1px;
    border: 1px solid #0077ff;
    padding: 8px 32px;
    display: inline-block;
    letter-spacing: 0;
    overflow: hidden;
    font-family: Muli-Black;
    font-weight: 900;
    font-size: 14px;
    font-size: 0.875rem;
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.16);
    outline: none;
    color: white;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    vertical-align: middle;
    transition: all 0.5s linear;
}

.bnt-cancelar-modal {
    font-family: Muli-Black;
    font-weight: 900;
    padding: 8px 32px;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.48);
    text-align: center;
    border: 1px solid rgba(0, 0, 0, 0.32);
    border-radius: 4px;
    background: #fff;
    margin-right: 16px;
}

.bnt-perigo-modal {
    font-family: Muli-Black;
    font-weight: 900;
    padding: 8px 31px;
    font-size: 14px;
    color: #FFF;
    border-radius: 4px;
    background: #0077FF;
    border: 1px solid #0077FF;
    transition: background 0.3s linear;
}

.bnt-perigo-modal:hover {
    background: #0077FF;
    transition: background 0.3s linear;
}

.bnt-perigo-modal:active {
    background: #0077ffe5;
    transition: background 0.3s linear;
}




.iconBtnTop {
    float: left;
    margin-top: -3px;
}

.txtBtnTop {
    float: left;
    margin-left: 8px;
}

.bnt-large {
    background-image: -webkit-linear-gradient(44deg, #2196f3 0%, #00e5fd 100%);
    background-image: -o-linear-gradient(44deg, #2196f3 0%, #00e5fd 100%);
    background-image: linear-gradient(134deg, #2196f3 0%, #00e5fd 100%);
    border: none;
    border-radius: 100px;
    position: relative;
    height: 48px;
    margin: 0;
    width: 136px;
    padding: 0 24px;
    display: inline-block;
    letter-spacing: 0;
    overflow: hidden;
    will-change: box-shadow;
    transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    outline: none;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    vertical-align: middle;
}

.bnt-huge {
    background-image: -webkit-linear-gradient(44deg, #2196f3 0%, #00e5fd 100%);
    background-image: -o-linear-gradient(44deg, #2196f3 0%, #00e5fd 100%);
    background-image: linear-gradient(134deg, #2196f3 0%, #00e5fd 100%);
    border: none;
    border-radius: 100px;
    position: relative;
    height: 58px;
    margin: 0;
    width: 136px;
    padding: 0 24px;
    display: inline-block;
    letter-spacing: 0;
    overflow: hidden;
    will-change: box-shadow;
    transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    outline: none;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    vertical-align: middle;
}

.bnt-small.sec,
.bnt-large.sec,
.bnt-huge.sec {
    background: #e91e63;
}

.bnt-small.alt,
.bnt-large.alt,
.bnt-huge.alt {
    background: transparent;
    border: 1px solid rgba(0, 0, 0, 0.32);
}

.bnt-small.alt:hover,
.bnt-large.alt:hover,
.bnt-huge.alt:hover {
    background: transparent;
    border: 1px solid rgba(0, 0, 0, 0.32);
}

.bnt-small.sec.alt,
.bnt-large.sec.alt,
.bnt-huge.sec.alt {
    background: transparent;
    border: 2px solid #e91e63;
    color: #e91e63;
}

.bnt-small.sec.alt:hover,
.bnt-large.sec.alt:hover,
.bnt-huge.sec.alt:hover {
    background: #ff1967;
    color: white;
}

.bnt-small.sec:hover,
.bnt-large.sec:hover,
.bnt-huge.sec:hover {
    background-image: linear-gradient(-45deg, #A445B2 0%, #D41872 52%, #FF0066 100%);
}

.select2-search__field {
    background: #fff;
}

.add_novo_select2 {
    cursor: pointer;
    color: #2196f3;
    font-family: Muli-SemiBold;
    font-weight: 600;
}

.msg-nao-lida{
    height: 15px;
    width: 15px;
    border-radius: 50%;
    background-color: #0091FF;
}

/*===================================End of Button===================================*/


/*===============================Modal and Alert Star================================*/

.modal_i {
    position: fixed;
    background: #FFF;
    margin-top: 50px;
    top: 0%;
    left: 22%;
    z-index: 1000;
    display: none;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26), 0 2px 10px 0 rgba(0, 0, 0, 0.16);
}

.header-modal_i {
    margin-bottom: 10px;
    width: 768px;
    height: 64px;
    box-shadow: inset 0 -1px 0 0 #CCCCCC;
}

.footer-modal_-i {
    margin-top: 10px;
    width: 768px;
    height: 64px;
    box-shadow: 0 -1px 0 0 #EFEFEF, inset 0 1px 0 0 #CCCCCC;
}

.btn-footer-modal {
    border: 1px;
    float: right;
    margin-top: 14px;
    margin-right: 23.8px;
}

.modal-title {
    font-family: Muli-Black;
    font-weight: 900;
    font-size: 18px;
    font-size: 1.125rem;
    color: rgba(0, 0, 0, 0.8);
}

.title-modal {
    float: left;
    margin-top: 21px;
    margin-left: 31px;
}

.subtitle-modal {
    float: left;
    margin-top: 21px;
    margin-left: 5px;
}

.fechar-modal {
    float: right;
    height: 17.5px;
    width: 16.3px;
    margin-top: 20.7px;
    margin-right: 20.7px;
    cursor: pointer;
}

.alert {
    position: fixed;
    background: #FFF;
    margin-top: 50px;
    top: 0%;
    left: 26%;
    z-index: 100;
    width: 600px;
    height: 248.1px;
    box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.19), 0 16px 28px 0 rgba(0, 0, 0, 0.24);
    z-index: 1000;
    display: none;
}

.title-alert {
    margin-top: 22px;
    margin-left: 36px;
}

.msg-alert {
    margin-left: 36px;
    width: 521px;
}

.btn-alert {
    float: right;
    width: 308px;
    margin-top: 63px;
    margin-left: 242px;
    margin-right: 42px;
}

.btn-cancelar {
    float: left;
    font-family: Muli-Black;
    font-weight: 900;
    background: transparent;
    border: 1px solid rgba(0, 0, 0, 0.32);
    border-radius: 4px;
    padding: 8px 32px;
    margin-right: 24px;
    font-size: 14px;
    font-size: 0.875rem;
    color: rgba(0, 0, 0, 0.48);
}

.titlePagerBlack {
    font-family: Muli-Black;
    font-size: 24px;
    color: rgba(0,0,0,0.80);
}

.titlePagerExtraBlack {
    font-family: Muli-ExtraBold;
    font-size: 24px;
    color: rgba(0,0,0,0.80);
}

.titleBlack-14{
    font-family: Muli-Black;
    font-size: 16px;
    color: rgba(0,0,0,0.80);
}

.btn-confitmar {
    float: left;
}

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    height: 100%;
    display: none;
    z-index: 999;
}

.fecharModal {
    float: left;
    position: absolute;
    margin-left: -56px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #FFFFFF;
    padding: 7px;
    cursor: pointer;
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.16);
    margin-top: -10px;
}

@media (min-width: 1280px){
    .modal-xxl {
        max-width: 1210px;
        margin: 1.85rem auto 1.85rem auto;
    }
}

/*======================================Menu=========================================*/

.navMenu {
    width: 100%;
    background: #fff;
    float: left;
    max-height: 60px;
}

.navMenu ul {
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
}

.iconSize{
    width: 24px;
    height: 24px;
}

.menuItemActive {
    background: rgba(0,0,0,0.16);
    border-radius: 24px;
    padding: 10px;
}

.optionActive {
    background: rgba(0,0,0,0.16);
    border-radius: 50%;
    padding: 8px;
    width: 38px;
    height: 38px;
}

.optionActiveSuporte {
    background: rgba(0,0,0,0.16);
    border-radius: 50%;
    padding: 6px;
    width: 34px;
    height: 34px;
}

.menuItemPadding{
    padding: 7px;
    /*background: rgba(0,0,0,0.16);
    border-radius: 50%;*/
}

.menuItemLargePadding{
    padding: 30%;
}

.divMenuVertical {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: center;
    height: 100vh;
}


.divMenuVertical .menu-footer {
    position: absolute;
    bottom:2%;
    width:100%;
}

.divFixedMenu{
    width: 43px;
    position:fixed;
}

.divVerticalMenu{
    width: 66px;
    position:fixed;
}

.linha{
    display: flex;
    flex-flow: row wrap;
}

.linha-flex{
    display: flex;
    flex-wrap: wrap;
}

.linha-horinzontal{
    border: 0;
    box-shadow: inset 0 -1px 0 0 rgb(190, 189, 189);
    /*box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.08);*/
}

.linha-base-grafico{
    border: 3;
    box-shadow: inset 0 -1px 0 0 blue;
    /*box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.08);*/
}

.navMenu ul li {
    display: inline;
}

.navMenu ul li a {
    display: inline-block;
    text-decoration: none;
    text-align: left;
    padding: 22px;
    margin: -2px;
    transition: background 0.5s linear 0s, color 0.5s linear 0s;
}

.navMenu ul li a:hover,
.navMenu>ul>li:hover>a {
    color: #0077ff !important;
    background: #e5f2f8;
    transition: background 0.5s linear 0s, color 0.5s linear 0s;
}

.navMenu ul li ul.megamenu {
    float: left;
    width: 100%;
    left: 0;
    max-height: 0px;
    background: white;
    position: relative;
    transition: max-height 0.3s ease-out;
    overflow: hidden;
    display: inline-block;
    z-index: 100;
}

.navMenu ul li:hover ul.megamenu {
    max-height: 800px;
    box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.08);
    transition: max-height 0.4s ease-in;
    transition-delay: 0.4s;
}

.links {
    /* width: 1088%; */
    display: inline-block;
    padding: 8px 8px 32px 8px;
}

.links li {
    float: left;
    width: 240px;
    display: inline-grid !important;
}

.links li h1 {
    font-family: Muli-Bold;
    font-weight: 700;
    font-size: 12px;
    font-size: 0.75rem;
    text-align: left;
    padding-top: 16px;
    padding-bottom: 17px;
    margin-top: 0px;
    margin-bottom: 0px;
    text-transform: uppercase;
    color: rgba(0, 0, 0, 0.8);
    box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.08);
}

.links li a {
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 14px;
    font-size: 0.875rem;
    color: rgba(0, 0, 0, 0.8);
    text-align: left !important;
    padding: 12px 0px 10px 0px !important;
}

.links li a:hover {
    background: transparent !important;
}

.menu_top_esquerdo {
    position: absolute;
}

.menu_top_direito {
    position: absolute;
    right: 0;
}

.contentTopPage{
    flex:1;
    /*margin-left: 90px;
    margin-right: 165px;*/
}

.content-less-margin{
    display: table;
    width: 100%;
    flex:1;
    margin-left: 25px;

}

.content-page-menu,
.content-deteail{
    display: table-cell;
}

.content-deteail{
    height: 660px;
    width: 360px;
}

.content-novo{
    width: 274px;   
}

/*
.content-page-menu{
    padding-left: 40px;
    padding-right: 40px;
}
*/

.content-main-page{
    display: table-cell;
    width: calc(100vw);   
}


.voltar {
    float: left;
    position: absolute;
    margin-left: -56px;
    margin-top: -10px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #FFFFFF;
    padding: 7px;
    cursor: pointer;
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.16);
}

.voltar-icon{
    background: #F5F6F7;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    padding-top: 5px;
}

.back-icon{
    background: #FFFFFF;
    box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
    width: 32px;
    height: 32px;
    border-radius: 50%;
    padding-top: 5px;   
}

.txtMenu {
    font-family: Muli-SemiBold;
    font-weight: 600;
    font-size: 16px;
    font-size: 1rem;
    color: rgba(0, 0, 0, 0.8);
    text-align: center;
}

.showPerfil {
    position: absolute;
    left: 52px;
    bottom: 8px;
    width: 223px;
    margin-top: 8px;
    background: #fff;
    padding: 6px 13px 5px 13px;
    border: 1px solid rgba(0, 0, 0, 0.20);
    border-radius: 10px;
    -webkit-transform: scale(0.1);
    -moz-transform: scale(0.1);
    -ms-transform: scale(0.1);
    transform: scale(0.1);
    opacity: 0;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

.visMenu {
    webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

.fotoTop.vis>.showPerfil {
    display: inline;
}

.perfilIcon{
    padding-left: 0%;
}

.perfilIcon.vis > .showPerfil {
    display: inline;
}

.UserPerfilMenu {
    float: left;
    padding-bottom: 13px;
    box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.08);
    width: 100%;
    text-align: center;
}

.imgUserPerfilMenu {
    float: left;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #d8d8d8;
}

.iconUserMenu {
    width: 32px;
    height: 32px;
}

.nomeUserPerfilMenu {
    font-family: Muli-Black;
    font-weight: 900;
    font-size: 14px;
    font-size: 0.875rem;
    text-align: center;
    overflow: hidden;
}

.linksPerfilMenu {
    float: left;
    font-family: Muli-SemiBold;
    font-weight: 600;
    font-size: 14px;
    font-size: 0.875rem;
    text-align: left;
    width: 100%;
    padding: 0px;
    box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.08);
}

.linksPerfilMenu ul {
    width: 0px;
    height: 0px;
    padding: 0px;
}

.linksPerfilMenu ul li {
    float: left;
    padding: 11px 0px;
    cursor: pointer;
    transition: color 0.3s linear;
    text-transform: none;
}

.linksPerfilMenu ul li:hover {
    transition: color 0.3s linear;
    text-transform: none;
    padding-left: 3px;
}

.logoutPerfilMenu ul {
    width: 0px;
    height: 0px;
    padding: 0px;
}

.logoutPerfilMenu ul li {
    cursor: pointer;
    transition: color 0.3s linear;
    text-transform: none;
    padding: 13px 0px;
    text-align: left;
}

.logoutPerfilMenu ul li:hover {
    transition: color 0.3s linear;
    text-transform: none;
    padding: 13px 0px 13px 3px;
    text-align: left;
}

.bnt-menu2 {
    width: 80px;
    height: 80px;
    padding-top: 24px;
    padding-left: 24px;
    padding-right: 24px;
    padding-bottom: 24.1px;
    -webkit-transition: background 1s linear;
    -moz-transition: background 1s linear;
    -o-transition: background 1s linear;
    transition: background 1s linear;
}

.card-client{
    padding-top: 35px;
    padding-left: 53px;
    padding-right: 50px;
    height: 707px;
    background-color: white;
}

.card-client-detail{
    padding-top: 35px;
    padding-left: 33px;
}

.card-menu-no-pr {
    text-align: left;
    border-radius: 8px;
    padding-top: 30px;
    padding-right: 45px;
    /*padding-bottom: 225px;*/
    padding-bottom: 30px;
    padding-left: 45px;
    background: #FFFFFF;
    border-radius: 8px;
}

.scrolling-wrapper {
    display: flex;
    overflow-x: auto;
}

.scrolling-wrapper::-webkit-scrollbar {
    display: none;
}

::-webkit-scrollbar {
    width: 14px;
}

::-webkit-scrollbar-thumb {
    border: 4px solid rgba(0, 0, 0, 0);
    background-clip: padding-box;
    border-radius: 9999px;
    background-color: #737373;
}

.scroll-small::-webkit-scrollbar {
    width: 10px;
}

.scroll-small-horizontal::-webkit-scrollbar {
    height: 10px;
}

.rm-barra-rolagem {
    overflow: hidden;
}

.scroll-select-empresa{
    height: calc(100vh - (254px));
    overflow: hidden;
    overflow-y: auto;
    padding-right: 14px;
}

.scroll-select-contato{
    height: calc(100vh - (342px));
    overflow: hidden;
    overflow-y: auto;
    padding-right: 0px;
}

.scroll-select-cliente{
    height: calc(100vh - (334px));
    overflow: hidden;
    overflow-y: auto;
}

.scroll-historico-suporte{
    height: calc(100vh - (275px));
    overflow: hidden;
    overflow-y: auto;
}

.scroll-select-produto{
    height: calc(100vh - (305px));
    overflow: hidden;
    overflow-y: auto;   
}

.scroll-nova-assinatura{
    height: calc(100vh - (130px));
    overflow: hidden;
    overflow-y: auto;   
}

.scroll-assinatura-clientes{
    height: calc(100vh - (396px));
    overflow: hidden;
    overflow-y: auto;
}

.scroll-assinatura-financeiro{
    height: calc(100vh - (169px));
    overflow: hidden;
    overflow-y: auto;   
}

.scroll-salve-assinatura{
    height: calc(100vh - (80px));
    overflow: hidden;
    overflow-y: auto;
    padding-right: 6px;   
}

.scroll-list-ass{
    height: calc(100vh - (140px));
    overflow: hidden;
    overflow-y: auto;
    padding-right: 6px;   
}

.scroll-list-assinaturas{
    height: calc(100vh - (137px));
    overflow: hidden;
    overflow-y: auto;
    padding-right: 6px;   
}

.scroll-detalhes{
    height: calc(100vh - (102px));
    overflow: hidden;
    overflow-y: auto;
    padding-right: 0px;   
}

.scroll-historico-os{
    height: calc(100vh - (147px));
    overflow: hidden;
    overflow-y: auto;
    padding-right: 0px;   
}

.scroll-detalhes-cliente{
    height: calc(100vh - (92px));
    overflow: hidden;
    overflow-y: auto;
    padding-right: 6px;    
}

.scroll-logs{
    height: calc(100vh - (60px));
    overflow: hidden;
    overflow-y: auto;
}

.scroll-clientes{
    height: calc(100vh - (203px));
    overflow: hidden;
    overflow-y: auto;
}

.scroll-cobrancas{
    height: calc(100vh - (294px));
    overflow: hidden;
    overflow-y: auto;
}

.scroll-usuarios-cliente{
    height: calc(100vh - (401px));
    overflow: hidden;
    overflow-y: auto;
}

.scroll-horizontal-usuarios {
    width: calc(100vw - 378px);
    overflow: auto hidden;
    display: -webkit-inline-box;
    padding-bottom: 0px;
}

.scroll-cliente-suporte{
    overflow: hidden auto;
    height: calc(100vh - 55px);
}

.scroll-cliente-suporte-detalhamento{
    overflow: hidden auto;
    height: calc(100vh - 275px);
}

.scroll-financeiro-cobranca{
    height: calc(100vh - 301px);
    overflow: hidden;
    overflow-y: auto;
    padding-right: 2px;   
}

.scroll-financeiro-boletos{
    height: calc(100vh - 325px);;
    overflow: hidden;
    overflow-y: auto;
    padding-right: 2px;   
}

.scroll-clientes-boletos{
    height: calc(100vh - 380px);
    overflow: hidden;
    overflow-y: auto;
    padding-right: 2px;      
}

.scroll-clientes-boletos-enviar{
    height: calc(100vh - 395px);;
    overflow: hidden;
    overflow-y: auto;
}

.scroll-filtro-cliente{
    height: calc(67vh - 170px);
    overflow: hidden;
    overflow-y: auto;  
}

.scroll-tela-versao{
    height: calc(100vh - 81px);
    overflow: hidden;
    overflow-y: auto;
    padding-right: 25px;  
}

.scroll-versoes{
    height: 247px;
    overflow: hidden;
    overflow-y: auto;
    padding-right: 3px;  
}

/*
.card-usuarios{
    height: 166px;
    width: 188px;
    background: #FFFFFF;
    border: 2px solid rgba(0,0,0,0.06);
    border-radius: 8px;
    padding-top: 18px;
    padding-right: 18px;
    padding-bottom: 9px;
    padding-left: 18px;
}*/

.card-usuarios{
    height: 166px;
    width: 188px;
    background: #FFFFFF;
    border: 2px solid rgba(0,0,0,0.06);
    border-radius: 8px;
    padding-top: 18px;
    padding-right: 18px;
    padding-bottom: 9px;
    padding-left: 18px;
    margin-right: 6px;
}

div.scrollmenu {
    overflow: auto;
    white-space: nowrap;
    /*max-width: 1175px;*/
    /*max-width: 800px;*/
  }
  
  div.scrollmenu .card-usuarios {
    display: inline-block;
  }

.pd-card-user{
    padding: 16px 16px 16px 16px;
}

.pd-card-opcoes{
    padding: 8px;
}

.card-custom-user{
    width: 188px;
    height: 166px;
    padding-left: 0%;
    padding-right: 0%;
    padding-top: 0%;
    margin-left: 0%;
    margin-right: 0%;
    margin-right: 8px;
    margin-bottom: 0%;
    margin-bottom: 8px;
}

.card-select-empresa{
    background: #FFFFFF;
    border-radius: 23px;
    padding: 14px 0px 14px 25px;
}

.card-select-empresa-alt{
    background: #F5F6F7;
    border-radius: 9px;
    padding: 14px 0px 14px 25px;
}

.bnt-menu2.ativo {
    background: -webkit-linear-gradient(125deg, #00e5fd 0%, #2196f3 100%);
}

.bnt-menu2.ativo>.fc-default {
    color: #FFF;
}

.bnt-menu2:hover {
    background: -webkit-linear-gradient(125deg, #00e5fd 0%, #2196f3 100%);
    cursor: pointer;
}

.bnt-menu2:hover>.fc-default {
    color: #FFF;
}

.bnt-menu3 {
    width: 80px;
    height: 60px;
    padding-top: 14px;
    padding-left: 24px;
    padding-right: 24px;
    padding-bottom: 14px;
}

.bnt-menu3:hover {
    width: 60px;
    height: 50px;
    margin: 5px 10px 5px 10px;
    padding-top: 9px;
    padding-left: 14px;
    padding-right: 14px;
    padding-bottom: 9px;
    background: -webkit-linear-gradient(125deg, #00e5fd 0%, #2196f3 100%);
    cursor: pointer;
    box-shadow: 0 7px 10px 0 rgba(0, 188, 222, 0.4), 0 4px 20px 0 rgba(0, 0, 0, 0.14);
}

.bnt-menu3:hover>.fc-default {
    color: #FFF;
}

.bnt-menu4 {
    width: 32px;
    height: 32px;
    padding-top: 24px;
    padding-left: 24px;
    padding-right: 24px;
    padding-bottom: 24.1px;
}

.bnt-menu4>.fc-default {
    color: #FFF;
}

.bnt-menu4:hover {
    width: 32px;
    height: 32px;
    padding-top: 24px;
    padding-left: 24px;
    padding-right: 24px;
    padding-bottom: 24.1px;
    background: rgba(255, 255, 255, 0.3);
    cursor: pointer;
}

.avatar {
    position: relative;
    width: 50px;
    height: 50px;
    margin-right: 14px;
    margin-left: 14px;
    border-radius: 25px;
    background: #c5c5c5;
    bottom: -434px;
}

.sub-menu {
    float: left;
    height: 737px;
    width: 221px;
    margin-left: 20px;
    margin-top: 10px;
    margin-bottom: 10px;
    background: -webkit-linear-gradient(44deg, #00e5fd 0%, #2196f3 100%);
    background: -o-linear-gradient(44deg, #00e5fd 0%, #2196f3 100%);
    background: linear-gradient(44deg, #00e5fd 0%, #2196f3 100%);
}

.sub-menu-link {
    width: 175px;
    height: 34px;
    padding: 26px 23px 26px 23px;
}

.sub-menu-link:hover {
    background: rgba(255, 255, 255, 0.3);
    cursor: pointer;
}

.border-gray {
    border: 1px solid rgba(0,0,0,0.06);
}

.border-gray-1-5{
    border: 2px solid #7A7A7A;
}

.border-green-1-5{
    border: 2px solid #60D669;
}

.border-azul-1-5{
    border: 2px solid #278BFF;
}

.border-red-1-5{
    border: 2px solid #FE4364;
}

.border-yellow-1-5{
    border: 2px solid #f5a623;
}

.pr-33{
    padding-right: 33px;
}

.pr-30{
    padding-right: 30px;
}

.pr-25{
    padding-right: 25px;
}

.pr-22{
    padding-right: 22px;
}

.pr-20{
    padding-right: 20px;
}

.pr-19{
    padding-right: 19px;
}

.pr-18{
    padding-right: 18px;
}

.pr-14{
    padding-right: 14px;
}

.pr-12{
    padding-right: 12px;
}

.pr-11{
    padding-right: 11px;
}

.pr-9{
    padding-right: 9px;
}

.pr-7{
    padding-right: 7px
}

.pr-6{
    padding-right: 6px
}

.pr-3{
    padding-right: 3px
}

.pr-0{
    padding-right: 0px
}

.pl-11{
    padding-left: 11px;
}

.busca-vazia-emepresa{
    height: calc(100vh - (254px));
}

.busca-vazia-cliente{
    height: calc(100vh - (245px));
}

.efeitoArrastrar {
    opacity: 0.5;
}


/*=========================================Data Table===============================*/

.dataTable {
    float: left;
    width: 829px;
    margin-left: 20px;
    margin-top: 16px;
    background: #FFF;
}

.topDataTable {
    width: 829px;
    height: 46px;
    background: #FFF;
}

.iconTable {
    float: left;
    margin-top: 11.3px;
    margin-bottom: 12.7px;
    margin-left: 10px;
    width: 24px;
    height: 24px;
}

.iconTable:hover {
    cursor: pointer;
}

.cnpjTable {
    float: left;
    position: relative;
    width: 125px;
    height: 16px;
    margin-left: 12px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.razaoTable {
    float: left;
    position: relative;
    width: 180px;
    height: 16px;
    margin-left: 46px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.fantasiaTable {
    float: left;
    position: relative;
    width: 112px;
    height: 16px;
    margin-left: 56px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.fantasiaTable2 {
    float: left;
    position: relative;
    width: 112px;
    height: 16px;
    margin-left: 5px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.iconEditarTable {
    float: left;
    position: relative;
    width: 18px;
    height: 18px;
    margin-top: 12px;
    margin-bottom: 15px;
}

.iconEditarTable2 {
    float: left;
    position: relative;
    width: 18px;
    height: 18px;
    margin-top: 12px;
    margin-bottom: 15px;
    margin-left: 30px;
}

.editarTable {
    float: left;
    position: relative;
    width: 36px;
    height: 16px;
    margin-left: 4px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.excluirTable {
    float: left;
    position: relative;
    width: 44px;
    height: 16px;
    margin-left: 4px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.iconDeletarTable {
    float: left;
    position: relative;
    width: 18px;
    height: 18px;
    margin-top: 12px;
    margin-bottom: 15px;
    margin-left: 16px;
}

.iconDeletarTable2 {
    float: left;
    position: relative;
    width: 18px;
    height: 18px;
    margin-top: 12px;
    margin-bottom: 15px;
    margin-left: 16px;
}

.iconPacote {
    float: left;
    position: relative;
    width: 18px;
    height: 18px;
    margin-top: 12px;
    margin-bottom: 15px;
    margin-left: 46px;
}

.iconTransport {
    float: left;
    position: relative;
    width: 18px;
    height: 18px;
    margin-top: 12px;
    margin-bottom: 15px;
    margin-left: 17px;
}

.iconCliente {
    float: left;
    position: relative;
    width: 18px;
    height: 18px;
    margin-top: 12px;
    margin-bottom: 15px;
    margin-left: 17px;
}

.iconTable {
    float: left;
    overflow: hidden;
}

.bottomDataTable {
    height: 90px;
    width: 829px;
    display: none;
}

.wEmal {
    float: left;
    width: 176px;
    height: 37px;
    margin-top: 23px;
    margin-left: 11px;
    margin-bottom: 30px;
}

.wFone {
    float: left;
    width: 110px;
    height: 37px;
    margin-top: 23px;
    margin-left: 31px;
    margin-bottom: 30px;
}

.material-icons.iconOcultar {
    display: none;
}

.pai {
    box-shadow: 0 2px 21px 0 rgba(0, 0, 0, 0.19);
}

.paginacaoTable {
    float: left;
    position: relative;
    margin-top: 16px;
    margin-left: 20px;
    width: 828px;
    height: 46px;
    background: #FFF;
}

.paginaText {
    float: left;
    margin-left: 477px;
    margin-top: 14px;
    margin-bottom: 16px;
}

.paginaSelet {
    float: left;
    margin-left: 24px;
    margin-top: 11px;
    margin-bottom: 15px;
}

.SeletTable {
    border: none;
    -webkit-appearance: none;
    /* Remove estilo padrão do Chrome */
    -moz-appearance: none;
    /* Remove estilo padrão do FireFox */
    appearance: none;
    /* Remove estilo padrão do FireFox*/
}

.paginaNumPg {
    float: left;
    margin-left: 27px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.paginaNext {
    float: left;
    width: 24px;
    height: 24px;
    margin-left: 22px;
    margin-top: 11.5px;
    margin-bottom: 10.5px;
}

.paginaNext:hover {
    cursor: pointer;
}

.paginaPreviu {
    float: left;
    width: 24px;
    height: 24px;
    margin-left: 26px;
    margin-top: 11.5px;
    margin-bottom: 10.5px;
}

.paginaPreviu {
    cursor: pointer;
}

.chips {
    float: left;
    position: relative;
    width: 90px;
    height: 16px;
    background: #2196f3;
    border-radius: 100px;
    list-style: none;
    margin-left: 4px;
    text-align: center;
    padding: 7px 32px 9px 16px;
}

.chips2 {
    float: left;
    position: relative;
    width: 90px;
    height: 16px;
    background: rgba(153, 153, 153, 0.2);
    border: 1px solid #979797;
    border-radius: 100px;
    list-style: none;
    margin-left: 4px;
    text-align: center;
    padding: 7px 32px 9px 16px;
}

ul {
    display: inline;
    text-decoration: none;
    list-style: none;
}

.ul {
    margin-left: 20px;
    list-style: none;
}

.material-icons.iconChips {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

.info-data-msg{
    float: right;
    margin-left: 14px;
    padding-top: 7px;
}

/*=================================================Margin's============================*/

.no-mg-lf {
    margin-left: 0px !important;
}

.no-mg-rt {
    margin-right: 0px !important;
}

.mt-8 {
    margin-top: 8px;
}

.mt-11 {
    margin-top: 11px;
}

.mt-13 {
    margin-top: 13px;
}

.mt-20 {
    margin-top: 20px;
}

.mt-24 {
    margin-top: 24px !important;
}

.mt-25 {
    margin-top: 25px;
}

.mt-28 {
    margin-top: 28px;
}

.mt-29 {
    margin-top: 29px;
}

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

.mt-38 {
    margin-top: 38px;
}

.ml-14 {
    margin-left: 14px;
}

.ml-10 {
    margin-left: 10px;
}

.ml-12 {
    margin-left: 12px;
}

.ml-14 {
    margin-left: 14px;
}

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

.ml-19 {
    margin-left: 19px;
}

.ml-20 {
    margin-left: 20px;
}

.mb-8 {
    margin-bottom: 8px !important;
}

.mb-16 {
    margin-bottom: 16px !important;
}

.mb-24 {
    margin-bottom: 24px !important;
}

.mb-36 {
    margin-bottom: 36px !important;
}

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

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

.mb-52 {
    margin-bottom: 52px !important;
}

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

.mr-16 {
    margin-right: 16px !important;
}

.mr-30 {
    margin-right: 30px !important;
}

.mr-35 {
    margin-right: 35px !important;
}

.mr-40 {
    margin-right: 40px !important;
}


/*==============================================Paddings===============================*/

.no-pd-lf {
    padding-left: 0px !important;
}

.no-pd-rt {
    padding-right: 0px !important;
}

.no-pd-lat{
    padding-left: 0px;
    padding-right: 0px;
}

.pd-bt-8 {
    padding-bottom: 8px;
}


/*===========================================Satart Table's======================================*/

.title_tab {
    box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.8);
    padding: 12px 8px 8px 8px;
}

.dadoTab {
    background: #fff;
    padding: 10px 0px 10px 0px;
    transition: all 1s ease;
}

.dadoTab:hover {
    background: rgba(35, 169, 246, 0.32);
    transition: all 1s ease;
}


/*============================================End of Table's=====================================*/


/* .modal-backdrop{
  z-index: 1052;
} */

.modal-content {
    z-index: 1055;
}

.fotoTop {
    width: 32px;
    height: 32px;
    right: 0;
}

.imgTop {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: #d8d8d8;
    cursor: pointer;
}

.circlSelect {
    border-radius: 50%;
    width: 32px;
    height: 32px;
    background: #d8d8d8;
}

.titleTop {
    transition-duration: all 0.4s;
    float: left;
    position: relative;
    text-align: center;
    width: 100%;
    height: 72px;
    padding-top: 16px;
    padding-bottom: 16px;
    background: #fff;
    box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.08);
}

.contTitlePage {
    height: 41px;
    padding: 12px;
}

.titlePage {
    float: left;
    font-family: Muli-Bold;
    font-weight: 700;
    font-size: 24px;
    font-size: 1.5rem;
    margin-left: 8px;
}

.titlePageForm {
    font-family: Muli-Bold;
    font-size: 22px;
    font-size: 1.5rem;
}

.titlePageTop {
    font-family: Muli-Bold;
    font-size: 22px;
    color: rgba(0, 0, 0, 0.80);
    text-align: center;
}

.mdl-badge.mdl-badge--overlap.topM:after {
    right: -8px;
}

.topM.mdl-badge[data-badge]:after {
    top: -6px;
    font-size: 11px;
    width: 16px;
    height: 16px;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

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

.hidden {
    display: none;
}

.esconder{
    display: none;
}

.remover-visibilidade{
    visibility: hidden;
}

.select2 {
    float: left;
    text-align: left;
}

.select2-container--default .select2-selection--single {
    border: none;
    border-bottom: 1px solid;
    border-radius: 0px;
    height: 36px;
    outline: 0 none;
}

.select2-container--default .select2-selection--single.selectFocus {
    border-bottom: 2px solid #23a9f6;
}

.select2-container--default.select2-container--disabled .select2-selection--single {
    cursor: not-allowed;
    background: transparent;
}

.select2.select2-container.select2-container--default {
    width: 100% !important;
}

.select-style {
    padding: 0;
    margin: 0;
    border: none;
    width: 100%;
    overflow: hidden;
    background-color: #fff;
    cursor: pointer;
    outline: none;
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 16px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 1rem;
}

.card-dashboard{
    border-radius: 2px;
    background: #FFF;
    box-shadow: 0px 4px 7px 0px rgba(0, 0, 0, 0.08);
}

.dashboard-info{
    font-family: Muli-Regular;
    font-size: 16px;
    color: rgba(0,0,0,0.40);
}

.info-muted-16{
    font-family: Muli-Regular;
    font-size: 16px;
    color: #798DA3;
}

.select-style select {
    padding-top: 7.5px;
    padding-bottom: 8.5px;
    width: 100%;
    cursor: pointer;
    text-transform: capitalize;
    border: none;
    box-shadow: none;
    background-color: transparent;
    background-image: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-family: Muli-Regular;
    font-weight: 400;
    font-size: 16px;
    color: rgba(0, 0, 0, 0.8);
    font-size: 1rem;
}

.select-style select:focus {
    outline: none;
}

.select-style.select-uf select {
    text-transform: uppercase;
}

.select2-dropdown {
    border-radius: 0px;
    border: 1px solid #aaa;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    z-index: 1000;
    display: none;
    min-width: 8rem;
    padding: .5rem 0;
    margin: 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: .25rem; }

.div-download-anexo{
    height: 20px;
    width: 20px;
    margin-left: 9px;
    border: 1px solid #898989;
    border-radius: 50%;
}

[v-cloak] { display: none; }

.select2-container--default .select2-results__option[aria-selected=true] {
    background: #fff;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1px solid #f7f7f7;
}

.money {
    text-align: right;
}


/* ::-webkit-scrollbar { 
    display: none;
} */

.conteudoList1 {
    position: relative;
    width: 1088px;
    display: inline-block;
}

.conteudoTop {
    width: 1088px;
    position: relative;
    background: #fff;
    display: inline-block;
    z-index: 100;
}

.rod_btnaddNew {
    position: fixed;
    width: 65px;
    height: 65px;
    bottom: 0;
    right: 0;
    margin-right: 3%;
    margin-bottom: 3%;
    z-index: 100;
}

#home {
    cursor: pointer;
}

.btn_menu {
    float: left;
    padding: 22px 16px;
    display: inline;
    transition: all 1s linear;
    cursor: pointer;
}

.btn_menu:hover {
    background: rgba(233, 239, 244, 0.48);
    display: inline;
    color: #0077ff;
    transition: all 1s linear;
}

.btn_menu.ativo {
    padding: 22px 16px;
    display: inline;
    color: #0077ff;
    background: rgba(233, 239, 244, 0.48);
    cursor: pointer;
    transition: all 1s linear;
}

.preMegaMenu {
    float: left;
    width: 100%;
    height: 300px;
    position: relative;
    background: #fff;
    display: none;
}

.megaMenu {
    float: left;
    width: 100%;
    height: 300px;
    position: relative;
    background: #fff;
    background: rgba(233, 239, 244, 0.48);
    box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.08);
}

.conteudoMegaMenu {
    display: none;
}


/*========================Modal Warning===================*/

.modal-content.warn {
    padding: 32px 40px;
    /* width: 37.899%; */
}

.modal-dialog.warn {
    max-width: 37.482%;
    text-align: left;
}

.modal-header.warn {
    padding: 0px;
    margin-bottom: 24px;
}

.modal-body.warn {
    padding: 0px;
    margin-bottom: 32px;
}

.modal-footer.warn {
    padding: 0px;
}

.modal-grande{
    max-width: 92%;
    text-align: left;
}

.modal-tam-68 {
    max-width: 68%;
    text-align: left;
}

.modal-tam-65 {
    max-width: 65%;
    text-align: left;
}

.modal-tam-60 {
    max-width: 60%;
    text-align: left;
}

.modal-tam-55 {
    max-width: 55%;
    text-align: left;
}

.modal-medio {
    max-width: 52%;
    text-align: left;
}

.modal-tam-43{
    max-width: 43%;
    text-align: left;    
}

.modal-tam-37 {
    max-width: 37%;
    text-align: left;
}

.modal-tam-27 {
    max-width: 27%;
    text-align: left;
}

.modal-pequeno{
    max-width: 18.5%;
    text-align: left;
}

.btnFooter.warn {
    float: right;
}

.btn-editar {
    border: 1px solid #f5a623;
    background: #f5a623;
    border-radius: 4px;
    padding: 11px 16px;
    cursor: pointer;
}

.txtBTNEditar {
    float: left;
    margin-top: 2px;
    margin-left: 8px;
    margin-right: 5px;
    font-family: Muli-Black;
    font-weight: 900;
    font-size: 14px;
    font-size: 0.875rem;
    color: white;
}

.inconBntEditar {
    float: left;
    margin-top: -3px;
}

.btn-delet {
    border: 1px solid #ff1967;
    border-radius: 4px;
    background: #fff;
    padding: 11px 16px;
    cursor: pointer;
}


/*===============================================================*/


/* Estilos para os Botões da Forma de Pagamento: Cartão ou Boleto*/


/*Estilo aplicado quando o usuário clica sobre o botão*/

.btn-large-active:focus {
    padding-left: 55px;
    padding-right: 55px;
    padding-top: 0%;
    padding-top: 7px;
    padding-bottom: 0%;
    padding-bottom: 7px;
    background: rgba(0, 119, 255, 0.04);
    border: 1px solid rgba(0, 119, 255, 0.24);
    border-radius: 4px;
    /*Texto do Botão*/
    font-size: 14px;
    color: #0077FF;
    font-family: Muli-SemiBold;
    text-align: center;
}


/*Estilo Aplicado para exibir a Forma de Pagamento Selecionada*/

.btn-large-selected {
    padding-left: 55px;
    padding-right: 55px;
    padding-top: 0%;
    padding-top: 7px;
    padding-bottom: 0%;
    padding-bottom: 7px;
    background: rgba(0, 119, 255, 0.04);
    border: 1px solid rgba(0, 119, 255, 0.24);
    border-radius: 4px;
    /*Texto do Botão*/
    font-size: 14px;
    color: #0077FF;
    font-family: Muli-SemiBold;
    text-align: center;
}


/*Estilo Aplicado para exibir a Forma de Pagamento que não foi
Selecionada*/

.btn-large-normal {
    padding-left: 55px;
    padding-right: 55px;
    padding-top: 0%;
    padding-top: 7px;
    padding-bottom: 0%;
    padding-bottom: 7px;
    border: 1px solid #E9EEF2;
    border-radius: 4px;
    /*Texto do Botão*/
    font-size: 14px;
    color: rgba(0, 0, 0, 0.80);
    font-family: Muli-SemiBold;
    text-align: center;
}

/*============================== Botões da Dashboard ======================*/

/*Estilo Aplicado para exibir os botões da DashBoard*/

.btn-large-selected-dash {
    /*SIZE*/
    width: 160px;
    height: 40px;
    /*
    padding-left: 27px;
    padding-right: 55px;
    padding-top: 0%;
    padding-top: 7px;
    padding-bottom: 0%;
    padding-bottom: 7px;*/
    background: #FFFFFF;
    border: 1px solid #0077FF;
    box-shadow: 0 0 2px 0 rgba(0,0,0,0.16);
    border-radius: 4px;
    /*Texto do Botão*/
    font-family: Muli-Bold;
    font-size: 12px;
    color: #0077FF;
    text-align: center;
}

.textoBotao {
    float: left;
    margin-left: 8px;
}

/*Estilo aplicado quando o usuário clica sobre o botão*/

.btn-large-active-dash:focus {
    /*SIZE*/
    width: 160px;
    height: 40px;
    /*
    padding-left: 27px;
    padding-right: 55px;
    padding-top: 0%;
    padding-top: 7px;
    padding-bottom: 0%;
    padding-bottom: 7px;*/
    background: #FFFFFF;
    border: 1px solid #0077FF;
    box-shadow: 0 0 2px 0 rgba(0,0,0,0.16);
    border-radius: 4px;
    /*Texto do Botão*/
    font-family: Muli-Bold;
    font-size: 12px;
    color: #0077FF;
    text-align: center;
}

/*Estilo Aplicado para exibir um Botão não Selecionado*/
.btn-dash-normal {
    /*SIZE*/
    width: 160px;
    height: 40px;
    /*
    padding-left: 27px;
    padding-right: 55px;
    padding-top: 0%;
    padding-top: 7px;
    padding-bottom: 0%;
    padding-bottom: 7px;*/
    background: rgba(163, 159, 159, 0.1);
    border-radius: 4px;
    /*Texto do Botão*/
    font-family: Muli-Bold;
    font-size: 12px;
    color: rgba(0,0,0,0.40);
    text-align: center;
}



/*Butão Mudar Exercício*/

.btn-exercicio{
    width: 148px;
    height: 28px;
    padding-right: 0px;
    padding-left: 0px;
    padding-top: 4px;
    border: 1px solid #007AFF;
    border-radius: 4px;
    /*Text*/
    font-family: Muli-SemiBold;
    font-size: 14px;
    color: #0077FF;
}

.btn-exercicio-ano{
    height: 24px;
    padding-right: 0px;
    padding-left: 15px;
    padding-top: 0px;
    padding-bottom: 0px;

    /*Text*/
    color: #333;
    text-align: right;
    font-family: Muli-Bold;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.btn-exercicio-ano:hover{
    height: 24px;
    padding-right: 0px;
    padding-left: 15px;
    padding-top: 0px;
    padding-bottom: 0px;


    /*Text*/
    color: #333;
    text-align: right;
    font-family: Muli-Bold;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.btn-voltar-modal{
    border: 1px solid #4C4C4C;
    border-radius: 4px;
    color: #494949;
    padding: 9px 30px;
    background: #FFFFFF;
    font-family: Muli-Bold;
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 21px;
    color: #494949;
}



/*===========================================================================*/

.txtBTNDelet {
    float: left;
    margin-top: 2px;
    margin-left: 8px;
    font-family: Muli-Black;
    font-weight: 900;
    font-size: 14px;
    font-size: 0.875rem;
    color: #ff1967;
}

.inconBntDelet {
    float: left;
    margin-top: -3px;
}

.selec.t2_com_erro {
    border-bottom: 1px solid #e91e63 !important;
}


/* .modal-body {
    max-height: calc(100vh - 210px);
    overflow-y: auto;
} */

.butonsCardListBack {
    float: right;
    width: 80px;
    height: 40px;
    background: rgba(233, 239, 244, 0.48);
    border-radius: 4px;
    /* padding: 4px; */
}

.btnCardList {
    float: left;
    width: 40px;
    height: 40px;
    border-radius: 3px;
    cursor: pointer;
    padding: 10px 11px;
    color: rgba(0, 0, 0, 0.32);
    transition: all 0.5s linear;
}

.btnCardList svg g {
    fill: #000;
    fill-opacity: 0.34;
}

.btnCardList:hover>svg g {
    fill: #007AFF;
    transition: all 0.5s linear;
}

.btnCardList.active {
    float: left;
    width: 40px;
    height: 40px;
    background: white;
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.16);
    border-radius: 4px;
    color: rgba(0, 0, 0, 0.8);
    cursor: pointer;
}

.btnCardList.active>svg g {
    fill: #007AFF;
    fill-opacity: 1;
    transition: all 0.5s linear;
}

.btnCardList .active:hover {
    float: left;
    width: 86px;
    height: 32px;
    background: white;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.04);
    border-radius: 3px;
    cursor: pointer;
}

.btnCardList.active>i {
    color: #0077ff;
    transition: all 0.5s linear;
}

input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
    background: transparent !important;
}


/*=======================Efect Blur Open Modal=============================*/

/*
body.modal-open .background-container {
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -o-filter: blur(3px);
    -ms-filter: blur(3px);
    filter: blur(3px);
}*/

body.modal-open .background-container.subTop {
    z-index: 1;
}

.modal-header {
    border-bottom: 0px !important;
}

.modal-footer {
    border-top: 0px !important;
}


/*========================Start Base's======================*/

.menu {
    margin-top: 0px;
    margin-left: 0px;
    position: fixed;
    z-index: 1000;
}

.top {
    float: left;
    width: 100%;
    height: 64px;
    background: #fff;
    z-index: 100;
}

.contQNT {
    float: left;
    width: 100%;
    padding: 24px 0px 16px 8px;
}

.qntEncontrada {
    float: left;
    font-family: Muli-SemiBold;
    font-size: 14px;
    color: #798DA3;
}

.contSubmenu {
    height: 41px;
    width: 1088px;
    display: inline-block;
}

.back_fixo {
    width: 102%;
    /* height: 555px; */
    float: left;
    position: fixed;
    /* margin-top: 80px; */
    margin-left: -15px;
    bottom: 0;
    z-index: -1;
    /*background-color: #F5F6F7*/
    ;
}

.back_fixo_branco {
    width: 102%;
    /* height: 555px; */
    float: left;
    position: fixed;
    /* margin-top: 80px; */
    margin-left: -15px;
    bottom: 0;
    z-index: -1;
    background-color: #FFFFFF;
}

.back_fixo_solid {
    background-color: #F5F6F7;
}

.svg-blue{
    filter: invert(33%) sepia(45%) saturate(4929%) hue-rotate(201deg) brightness(100%) contrast(109%);
}

.svg-green-whatsapp{
    filter: invert(8%) sepia(9%) saturate(773%) hue-rotate(54deg) brightness(103%) contrast(98%);
}

.svg-padrao{
    filter: invert(22%) sepia(0%) saturate(0%) hue-rotate(174deg) brightness(94%) contrast(83%);
}

.svg-black{
    filter: invert(0%) sepia(82%) saturate(7500%) hue-rotate(52deg) brightness(87%) contrast(115%);
}

.conteudo {
    width: calc(100% - 80px);
    margin-left: 80px;
    float: left;
    height: 100%;
}

.img_bck {
    float: left;
    width: 100%;
    bottom: 0px;
}

.card {
    float: left;
    margin: auto;
    width: 85%;
    margin-left: 8%;
    text-align: left;
    border-radius: 8px;
    padding: 32px 40px;
    background: white;
    /*box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.16); */
}

.btn-add {
    float: right;
    position: relative;
    border-radius: 4px;
    cursor: pointer;
    text-align: right;
    transition: all 1s linear;
}

.btn-add:hover {
    float: right;
    position: relative;
    border-radius: 4px;
    cursor: pointer;
    text-align: right;
    transition: all 1s linear;
}

.btn-addII {
    float: right;
    position: relative;
    background: #2196f3;
    border-radius: 4px;
    height: 32px;
    width: 145px;
    cursor: pointer;
    text-align: center;
    padding: 3px 0px 5px 2px;
    transition: all 1s linear;
}

.btn-addII:hover {
    float: right;
    position: relative;
    background: #00e5fd;
    border-radius: 4px;
    height: 32px;
    width: 145px;
    cursor: pointer;
    text-align: center;
    padding: 3px 0px 5px 2px;
    transition: all 1s linear;
}

.txt-btn-add {
    /*font-weight: 600;*/
    font-family: Muli-SemiBold;
    font-size: 14px;
    color: #0077FF;
    text-align: right;
}

.icon-btn-add {
    font-family: Muli-SemiBold;
    font-size: 32px;
    color: #0077FF;
    text-align: right;
}

.txt-32{
    color: #333;
    font-family: Muli-Bold;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;   
}

.text-info-blue{
    font-family: Muli-SemiBold;
    font-size: 14px;
    color: #0091FF;
}

.btn-adicionar{
    width: 39px;
    height: 39px;
    align-items: center;
    justify-content: center;
    display: flex;
}

/* .primCard{
  margin-top: 90px;
} */

.ultimCard {
    margin-bottom: 13px;
}

.titleCard {
    padding-left: 0px;
    padding-right: 0px;
    margin-bottom: 32px;
}

.titleCard-near {
    padding-left: 0px;
    padding-right: 0px;
    margin-bottom: 22px;
}

.to-prev {
    float: left;
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 4px;
    height: 32px;
    width: 32px;
    /* position: fixed; */
    display: block;
    padding: 5px 11px;
    cursor: pointer;
}

.to-next {
    float: left;
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 4px;
    height: 32px;
    width: 32px;
    /* position: fixed; */
    display: block;
    padding: 5px 11px;
    cursor: pointer;
    margin-left: 8px;
}

.contTxtNav {
    float: left;
    margin-left: 16px;
    margin-top: 5px;
}

.txtNav {
    font-size: 14px;
    color: rgba(0, 0, 0, 0.34);
    font-family: Muli-Regular;
    font-weight: 400;
}

.rod_btnScroll {
    position: fixed;
    right: 3%;
    bottom: 20px;
}

#select2-id_cid-result-71bz-addCidade {
    background: green;
}

.select2-results {
    text-align: left;
    max-height: 215px;
    overflow-x: auto;
}

.select2-results__options {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
}

.iconCard {
    float: left;
    margin-top: 5px;
    margin-left: 5px;
}

.iconTabela {
    float: left;
    margin-top: 5px;
    margin-left: 5px;
}

.iconCard:hover {
    fill: #007AFF;
}

.iconButton{
    width: 16px;
    height: 16px;
}


/*====================End of Base's========================*/


/*====================Efeect Buonce===================*/


/* .btn_menu{
  padding: 20px 16px;
  display: inline;
  transition: all 1s linear;
  cursor: pointer;
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;

}
.btn_menu::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(233,239,244,0.48);
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}
.btn_menu:hover::before{
-webkit-transform: scaleY(1);
transform: scaleY(1);
-webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
} */


/*===============================End of Buonce==================*/

.menu_top {
    text-align: center;
}

.conteudo_menu_top {
    display: inline-block;
}

.blur {
    float: left;
    position: absolute;
    height: 72px;
    width: 100%;
    margin-top: 64px;
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    -o-filter: blur(5px);
    -ms-filter: blur(5px);
    filter: blur(5px);
}

.fixBlur {
    position: fixed;
    top: 0;
    z-index: 1040;
    margin-top: 0px;
    background: rgba(255, 255, 255, 0.8);
}

.fixoTitleTop {
    transition-duration: all 0.4s;
    position: fixed;
    top: 0;
    z-index: 1040;
    background: rgba(255, 255, 255, 0.8);
}

.centerDiv{
    display: flex;
    align-items: center;
    justify-content: center;
}

.justCenter{
    justify-content: center;
}

.direitaDiv{
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
}

.topDiv{
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
}

.bottom-center{
    align-items: flex-end;
    display: flex;
    justify-content: center;
}

.center-left{
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

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

.ali-left{
    display: flex;
    justify-content:flex-start;
    align-items: flex-start;
    text-align: left;
}

.ali-start-end{
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
}

.ali-start{
    display: flex;
    align-items: flex-start;
}

.ali-left-center{
    display: flex;
    justify-content:flex-start;
    align-items: center;
    text-align: left;
}

.ali-right{
    display: flex;
    justify-content:flex-end;
    text-align: right;
}

.center-right{
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.ali-end{
    display: flex;
    justify-content: flex-end;
}

.txt-center{
    text-align: center;
}

.setaDown {
    float: left;
    transform: rotate(180deg);
}

.inativ {
    pointer-events: none;
}

.resultNo {
    color: #000;
}

.stt-ativo{
    color: #038868!important;
}

.stt-yellow{
    color: #B0A900!important;
}

.stt-red{
    color: #FF4141!important;
}


/* "Botões" Status */


.status-base{
    padding: 4px 17px;
}

.status {
    font-family: Muli-Black;
    font-weight: 900;
    padding: 4px 14px;
    color: #fff;
    border-radius: 4px;
    font-size: 12px;
    font-size: 0.75rem;
}

.statusGray {
    font-family: Muli-SemiBold;
    font-size: 10px;
    color: #798DA3;
    letter-spacing: 0;
    /*font-weight: 900;*/
    padding: 4px 14px;
    border-radius: 4px;
}

.status-cliente{
    font-size: 8.5px;
}

.stAbertoCinza {
    background: #F5F6F7;
}

.stTableAltern {
    background: rgba(0, 145, 255, 0.08);
    border-radius: 8px;
    padding-top: 14px;
    padding-bottom: 14px;
    padding-left: 15px;
    padding-right: 15px;
}

.stTableAlternSmart {
    background: rgba(0, 145, 255, 0.08);
    border-radius: 8px;
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 15px;
    padding-right: 15px;
}

.stTableAlternWhite {
    background: #FFFFFF;
    border-radius: 8px;
    padding-left: 15px;
    padding-right: 15px;
}

.stParcelaAlternWhite {
    background: #FFFFFF;
    border-radius: 8px;
    padding-left: 15px;
    padding-right: 15px;
}

.parcelaSelecionada{
    background: rgba(0, 145, 255, 0.08)!important;
    border: 1px solid rgba(0, 119, 255, 0.24);
}

.spaceVertical {
    padding-top: 4px;
    padding-bottom: 4px;
}


.tableAltern{
    background: #FFFFFF;
    border-radius: 8px;
    padding-top: 7px;
    padding-bottom: 7px;
    padding-left: 10px;
    padding-right: 10px;
}

.tableAltern .card{
    background: #FFFFFF;
}

.tableAltern:hover .card{
    background: rgba(0, 145, 255, 0.08);
}

.card-agregado{
    padding-left: 0px;
    padding-right: 0px;
    float: left;
    margin: auto;
    text-align: left;
    border-radius: 8px;
    background: white;
}

.card-vazio-cliente{
    height: calc(100vh - (225px));
    justify-content: center;
    display: flex;
    flex-direction: column;
}

.tableAltern .dropbtn3{
    background: #FFFFFF;   
}

.tableAltern:hover .dropbtn3{
    background: rgba(0, 145, 255, 0.02); 
}


.tableAltern .txt-ordem-destaque{
    color: #798DA3;
}

.tableAltern:hover .txt-ordem-destaque{
    color: #0091FF;
}

.tableAltern:hover{
    background: rgba(0, 145, 255, 0.08);
    border-radius: 8px;
    padding-top: 7px;
    padding-bottom: 7px;
    padding-left: 10px;
    padding-right: 10px;
}

.statusGreen {
    font-family: Muli-SemiBold;
    font-size: 10px;
    color: #009688;
    padding: 4px 14px;
    border-radius: 4px;
}

.stPagoVerde {
    background: #D4FFEA;
}

.statusRed {
    font-family: Muli-SemiBold;
    font-size: 10px;
    color: #D0021B;
    letter-spacing: 0;
    padding: 4px 14px;
    border-radius: 4px;
}

.txt-red{
    color: #FF5555;
}

.stAtrasadoVermelho {
    background: #FFDCDC;
}

.stAtivo {
    /*background: #7ed321;*/
    background: #D4FFEA;
    border-radius: 4px;
    font-family: Muli-Bold;
    font-size: 10px;
    color: #009688;
    text-align: center;
}

.stAtivo-lg {
    /*STATUS*/
    background: rgba(80,227,194,0.32);
    border-radius: 4px;
    /*TEXT*/
    font-family: Muli-ExtraBold;
    font-size: 12px;
    color: #009688;
    text-align: center;
}

.stAtivo-regular{
    /*STATUS*/
    background: rgba(80,227,194,0.24);
    border-radius: 4px;
    width: 59px;
    height: 24px;
}

.textStatus-Green{
    /*TEXT*/
    font-family: Muli-Bold;
    font-size: 12px;
    color: #009688;
    text-align: center;
}

.stVencida-lg{
    /*STATUS*/
    background: rgba(245,166,35,0.32);
    border-radius: 4px;
    /*Text*/
    font-family: Muli-Black;
    font-size: 12px;
    color: #F5A623;
    text-align: center;
}

.stInativo {
    background: rgba(0, 0, 0, 0.48);
}

.stVencido {
    background: #f5a623;
}

.stSuspenso {
    background: #f5a623;
}

.stCancelado {
    background: #f0166d;
}

.stEtiqueta {
    background: #0077ff;
}

.stAtiva {
    background: #7ed321;
}

.stInativa {
    background: rgba(0, 0, 0, 0.48);
}

.stVencida {
    background: #f5a623;
}

.stSuspensa {
    background: #f5a623;
}

.stCancelada {
    background: #f0166d;
}

.stEtiqueta {
    background: #0077ff;
}

.statusAtivo {
    background: #D4FFEA;
    border-radius: 4px;
    font-family: Muli-Bold;
    font-size: 10px;
    color: #009688;
    text-align: center;
}

.statusCancelado{
    background: #FFDCDC;
    border-radius: 4px;
    font-family: Muli-Bold;
    font-size: 10px;
    color: #D0021B;
    text-align: center;
}

.statusSuspenso{
    background: #f5a623;
    border-radius: 4px;
    font-family: Muli-Bold;
    font-size: 10px;
    color: white;
    text-align: center;
}

.statusBase{
    padding: 6px 15px;
    margin: 0px;
}

/* STATUS Ordem de serviço*/

.statusOrdem{
    background: rgba(0,145,255,0.08);
    border-radius: 4px;
    padding: 6px 9px 6px 9px;
}

.txt-ordem-destaque{
    font-family: Muli-SemiBold;
    font-size: 10px;
    color: #0091FF;
    letter-spacing: 0;
}

.txt-ordem-muted{
    font-family: Muli-SemiBold;
    font-size: 10px;
    color: #798DA3;
    letter-spacing: 0;
}

.modal-dialog.Bairro {
    width: 380px;
    height: 336px;
}

.modal-content.Bairro {
    padding: 32px 40px;
}

.modal-header.Bairro {
    padding: 0px;
}

.modal-body.Bairro {
    padding: 0px;
}

.modal-body.Bairro {
    padding: 0px;
}

.modal-footer.Bairro {
    padding: 0px;
}

.modal-dialog.Motivo {
    width: 380px;
    height: 336px;
}

.modal-content.Motivo {
    padding: 32px 40px;
}

.modal-header.Motivo {
    padding: 0px;
}

.modal-body.Motivo {
    padding: 0px;
}

.modal-body.Motivo {
    padding: 0px;
}

.modal-footer.Motivo {
    padding: 0px;
}

.modal {
    background: rgba(0, 0, 0, 0.10);
}

.barraModalSelect {
    position: fixed;
    width: 100%;
    height: 72px;
    padding-top: 16px;
    padding-bottom: 16px;
    background: #FFF;
    box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.08);
    z-index: 1;
}

.inputPesquisaModal.pesqModal {
    margin-top: -11px;
    width: 100%;
}

.iconPesquiList.pesModal {
    margin-top: -3px;
}

.contQuantModal {
    float: left;
    margin-left: 8px;
    margin-top: 32px;
}

.animacaoHover{
    transition: box-shadow 0.5s ease;
    /* box-shadow: 0 2px 4px 1px rgba(0, 0, 0, 0.04)!important; */
}

.animacaoHover:hover {
    box-shadow: 0 4px 8px 2px rgba(0, 0, 0, 0.08)!important;
    transition: box-shadow 0.5s ease;
}

.animacaoItemCard {
    opacity: 1; /* Define a opacidade inicial do elemento */
    --ds-shadow-raised: 0px 1px 1px #091E4240, 0px 0px 1px #091E424F;
    box-shadow: var(--ds-shadow-raised,0 1px 1px #091e4240,0 0 1px #091e424f);
}

.animacaoDrag {
    opacity: 1; /* Define a opacidade inicial do elemento */
    --ds-shadow-raised: 0px 1px 1px #091E4240, 0px 0px 1px #091E424F;
    box-shadow: var(--ds-shadow-raised,0 1px 1px #091e4240,0 0 1px #091e424f);
}

.animacaoDrag:active {
    z-index: 2000;
    opacity: 1; /* Define a opacidade quando o elemento está sendo arrastado */
    font-weight: bold!important;
    font-family: Muli-ExtraBold!important;
    border: 1.5px solid rgba(0, 0, 0, 0.32)!important;
    --ds-shadow-raised: 0px 1px 1px #091E4240, 0px 0px 1px #091E424F;
    box-shadow: var(--ds-shadow-raised,0 1px 1px #091e4240,0 0 1px #091e424f);
}

.border-card{
    --ds-shadow-raised: 0px 1px 1px #091E4240, 0px 0px 1px #091E424F;
    box-shadow: var(--ds-shadow-raised,0 1px 1px #091e4240,0 0 1px #091e424f);
}

/*# sourceMappingURL=componentes.css.map */

.input-component {
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 4px;
    /*box-shadow: inset 0px 0px 0px 0px #000;*/
    font-family: Muli-SemiBold;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.80);
}

.input-component-new {
    border: 1px solid rgba(0, 0, 0, 0.24);
    border-radius: 4px;
    box-shadow: inset 0px 0px 0px 0px #000;
    font-family: Muli-SemiBold;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.80);
}

.input-conversa{
    padding: 6px 8px 6px 45px;
    display: block;
    font-family: Muli-SemiBold;
    font-size: 14px;
    color: #798DA3;
    background: white;
    border-radius: 12px;
    color: rgba(0, 0, 0, 0.8);
    transition: box-shadow 0.5s linear;
    width: 100%;height: 100%;
}

.input-conversa:focus{
    padding: 6px 8px 6px 45px;
    display: block;
    font-family: Muli-SemiBold;
    font-size: 14px;
    color: #798DA3;
    background: white;
    border-radius: 12px;
    color: rgba(0, 0, 0, 0.8);
    transition: box-shadow 0.5s linear;
    width: 100%;height: 100%;
}

.label.label-primary.manager {
    background: #0077ff;
    color: #fff;
    margin-right: 5px;
    display: inline-block;
}

.label.manager .btn-rm {
    background: none;
    border: none;
    margin-right: -5px;
    color: #fff;
}

.border-menu{
    border-bottom: 1px solid #0091FF;
    padding-bottom: 8px;
}

.border-muted{
    box-shadow: inset 0 -1px 0 0 #CACACA;
}

.border-muted-card{
    box-shadow: inset 0 -1px 0 0 #E9EEF2;
}

/*======================================================= Progress Bar =============================================*/

progress {
    vertical-align: baseline;
}

@-webkit-keyframes progress-bar-stripes {
  from {
    background-position: 1rem 0;
  }
  to {
    background-position: 0 0;
  }
}

@keyframes progress-bar-stripes {
  from {
    background-position: 1rem 0;
  }
  to {
    background-position: 0 0;
  }
}

.progress {
    display: flex;
    height: 1rem;
    overflow: hidden;
    line-height: 0;
    font-size: 0.75rem;
    background-color: #eaecf4;
    border-radius: 0.35rem;
  }

.progress-bar {
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    background: #0077FF;
    transition: width 0.6s ease;
}

@media (prefers-reduced-motion: reduce) {
    .progress-bar {
        transition: none;
    }
}

.progress-bar-striped {
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-size: 1rem 1rem;
}

.progress-bar-animated {
    -webkit-animation: progress-bar-stripes 1s linear infinite;
    animation: progress-bar-stripes 1s linear infinite;
}


@media (prefers-reduced-motion: reduce) {
    .progress-bar-animated {
        -webkit-animation: none;
        animation: none;
    }
}

.progress-sm {
    height: .5rem;
}

/*=============================================================================================================*/


/* Classe para dar espaço entre as linhas do texto*/
.space-line{
    text-align: left;
    line-height: 1.3;
}

/*=============================================================================================================*/

/* Classe para indicar atividade (carregando) */

.loader {
    width: 64px;
    height: 64px;
    animation: spin 2s linear infinite;
    background: transparent url('../img/loading.png') no-repeat;
    background-size: contain;
    position: absolute;
    z-index: 2050;
    top: 50%;
    bottom: 50%;
    right: 50%;
    left: 50%;
  }

.loader-fixed {
    width: 64px;
    height: 64px;
    animation: spin 2s linear infinite;
    background: transparent url('../img/loading.png') no-repeat;
    background-size: contain;
    z-index: 2050;
}

  @keyframes spin {
    0% {
      transform: rotate(0deg);
    }
  
    100% {
      transform: rotate(360deg);
    }
  }

.txt-white{
    color: #FFF;   
}

.txt-black{
    color: #4E4C4C;   
}

/* Fontes */
.txt-24-black{
    font-family: Muli-Regular;
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 35px;
    color: #333333;    
}

.txt-24-gray{
    font-family: Muli-Regular;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 30px;
    color: #939393;
}

.txt-24-title{
    font-family: Muli-SemiBold;
    font-style: normal;
    font-weight: 600;
    font-size: 24px;
    line-height: 35px;
    color: #333333;
}

.txt-24-modal{
    color: #333;
    font-size: 24px;
    font-family: Muli-Bold;
    font-style: normal;
    font-weight: 700;
    line-height: normal;   
}

.txt-20-gray{
    font-family: Muli-Regular;
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 25px;
    color: #737373;
}

.txt-header{
    color: #FFF;
    font-family: Muli-Bold;
    font-size: 20px;
    font-style: normal;
    font-weight: 800;
    line-height: normal;    
}

.txt-bold-btn{
    color: #FFF!important;
    font-family: Muli-Bold;
    font-size: 14px;
    font-style: normal;
    font-weight: 800;
    line-height: normal;
}

.txt-18-blue{
    font-family: Muli-Bold;
    font-style: normal;
    font-weight: 700;
    font-size: 18px;
    line-height: 23px;
    color: #0091FF;
}


.txt-16-card{
    color: #333;
    text-align: right;
    font-family: Muli-Bold;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.txt-16-gray{
    font-family: Muli-Regular;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #A2A2A2;
}

.txt-16-legend{
    color: rgba(0, 0, 0, 0.87);
    font-family: Muli-SemiBold;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.txt-16-sub-title{
    font-family: Muli-Regular;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    color: #727272;    
}

.txt-14-sub3{
    font-family: Muli-Regular;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    color: #8D8989;
}

.txt-14-gray{
    font-family: Muli-Regular;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;    
    color: #919191;
}

.txt-14-info{
    font-family: Muli-Regular;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    color: #B4B4B4;
}

.txt-14-col{
    color: #333;
    font-family: Muli-SemiBold;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;    
}

.txt-14-filtro{
    color: #757575;
    font-family: Muli-SemiBold;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.txt-14-sb{
    color: #333;
    font-family: Muli-SemiBold;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.txt-14-reg-msg{
    color: #4E4C4C;
    font-size: 14px;
    font-family: Muli-SemiBold;
    font-style: normal;
    font-weight: 700;
    line-height: normal;   
}

.txt-14-reg-black{
    color: #000;
    font-size: 14px;
    font-family: Muli-SemiBold;
    font-style: normal;
    font-weight: 700;
    line-height: normal;    
}

.txt-14-semi-bold{
    color: #494949;
    font-family: Muli-SemiBold;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.txt-14-btn{
    color: #494949;
    font-size: 14px;
    font-family: Muli-SemiBold;
    font-style: normal;
    font-weight: 600;
    line-height: normal;   
}

.txt-12-gray{
    font-family: Muli-Regular;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 18px;    
    color: #939393;
}

.txt-12-legend{
    color: rgba(0, 0, 0, 0.38);
    font-family: Muli-Bold;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;    
}

.txt-12-semi-black{
    font-family: Muli-SemiBold;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 18px;
    color: #333333;   
}

.txt-12-azul{
    color: #0091FF;
    font-size: 12px;
    font-family: Muli-SemiBold;
    font-weight: 600;
}

.txt-12-cinza{
    color: #7A7A7A;
    font-size: 12px;
    font-family: Muli-SemiBold;
    font-weight: 600;
}

.txt-12-graph{
    color: #333;
    font-family: Muli-Light;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 1px;
}

.txt-12-title-card{
    color: #333;
    text-align: right;
    font-family: Muli-Bold;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.txt-12-title-card-blue{
    color: #07F;
    text-align: right;
    font-family: Muli-Bold;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.txt-12-muted{
    color: #BEBEBE;
    font-size: 12px;
    font-family: Muli-Regular;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.txt-12-event{
    color: #494949;
    font-size: 12px;
    font-family: Muli-SemiBold;
    font-style: normal;
    font-weight: 600;
    line-height: normal;   
}

.txt-12-lt{
    color: #494949;
    font-family: Muli-Regular;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;   
}

.txt-12-data{
    color: #707070;
    font-size: 12px;
    font-family: Muli-Regular;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.6px;
}

.txt-12-data-white{
    color: rgb(255, 255, 255);
    font-size: 12px;
    font-family: Muli-Regular;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.6px;
}

.txt-12-src{
    color: #7D7D7D;
    font-size: 14px;
    font-family: Muli-Regular;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.txt-12-red{
    color: rgb(255, 65, 65);
    font-size: 12px;
    font-family: Muli-SemiBold;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.txt-10-gray{
    color: #999595;
    font-size: 10px;
    font-family: Muli-Regular;
    font-weight: 400;
}

.txt-10-white{
    color: #FFF;
    font-size: 10px;
    font-family: Muli-Regular;
    font-weight: 600;
    line-height: 13px;
}

.ali-esq{
    float: left;
    text-align: left;
}

/* Colunas */
.coluna-6{
    flex: 0 0 6%;
    max-width: 6%;
}

.coluna-7{
    flex: 0 0 7%;
    max-width: 7%;
}

.coluna-9{
    flex: 0 0 9%;
    max-width: 9%;
}

.coluna-10{
    flex: 0 0 10%;
    max-width: 10%;
}

.coluna-11{
    flex: 0 0 11%;
    max-width: 11%;
}

.coluna-12{
    flex: 0 0 12%;
    max-width: 12%;
}

.coluna-13{
    flex: 0 0 13%;
    max-width: 13%;
}

.coluna-14{
    flex: 0 0 14%;
    max-width: 14%;
}

.coluna-15{
    flex: 0 0 15%;
    max-width: 15%;
}

.coluna-15-5{
    flex: 0 0 15.5%;
    max-width: 15.5%;
}

.coluna-16{
    flex: 0 0 16%;
    max-width: 16%;
}

.coluna-17{
    flex: 0 0 17%;
    max-width: 17%;
}

.coluna-18{
    flex: 0 0 18%;
    max-width: 18%;
}

.coluna-19{
    flex: 0 0 19%;
    max-width: 19%;
}

.coluna-20{
    flex: 0 0 20%;
    max-width: 20%;
}

.coluna-21{
    flex: 0 0 21%;
    max-width: 21%;
}

.coluna-22{
    flex: 0 0 22%;
    max-width: 22%;
}

.coluna-23{
    flex: 0 0 23%;
    max-width: 23%;
}

.coluna-24{
    flex: 0 0 24%;
    max-width: 24%;
}

.coluna-25{
    flex: 0 0 25%;
    max-width: 25%;
}

.coluna-26{
    flex: 0 0 26%;
    max-width: 26%;
}

.coluna-27{
    flex: 0 0 27%;
    max-width: 27%;
}

.coluna-28{
    flex: 0 0 28%;
    max-width: 28%;
}

.coluna-29{
    flex: 0 0 29%;
    max-width: 29%;
}

.coluna-30{
    flex: 0 0 30%;
    max-width: 30%;
}

.coluna-31{
    flex: 0 0 31%;
    max-width: 31%;
}

.coluna-32{
    flex: 0 0 32%;
    max-width: 32%;
}

.coluna-33{
    flex: 0 0 33%;
    max-width: 33%;
}

.coluna-34{
    flex: 0 0 34%;
    max-width: 34%;
}

.coluna-35{
    flex: 0 0 35%;
    max-width: 35%;
}

.coluna-36{
    flex: 0 0 36%;
    max-width: 36%;
}

.coluna-37{
    flex: 0 0 37%;
    max-width: 37%;
}

.coluna-38{
    flex: 0 0 38%;
    max-width: 38%;
}

.coluna-38-75{
    flex: 0 0 38.75%;
    max-width: 38.75%;
}

.coluna-39{
    flex: 0 0 39%;
    max-width: 39%;
}

.coluna-40{
    flex: 0 0 40%;
    max-width: 40%;
}

.coluna-41{
    flex: 0 0 41%;
    max-width: 41%;
}

.coluna-42{
    flex: 0 0 42%;
    max-width: 42%;
}

.coluna-43{
    flex: 0 0 43%;
    max-width: 43%;
}

.coluna-44{
    flex: 0 0 44%;
    max-width: 44%;
}

.coluna-45{
    flex: 0 0 45%;
    max-width: 45%;
}

.coluna-46{
    flex: 0 0 46%;
    max-width: 46%;
}

.coluna-47{
    flex: 0 0 47%;
    max-width: 47%;
}

.coluna-48{
    flex: 0 0 48%;
    max-width: 48%;
}

.coluna-49{
    flex: 0 0 49%;
    max-width: 49%;
}

.coluna-50{
    flex: 0 0 50%;
    max-width: 50%;
}

.coluna-51{
    flex: 0 0 51%;
    max-width: 51%;
}

.coluna-52{
    flex: 0 0 52%;
    max-width: 52%;
}

.coluna-53{
    flex: 0 0 53%;
    max-width: 53%;
}

.coluna-54{
    flex: 0 0 54%;
    max-width: 54%;
}

.coluna-55{
    flex: 0 0 55%;
    max-width: 55%;
}

.coluna-56{
    flex: 0 0 56%;
    max-width: 56%;
}

.coluna-57{
    flex: 0 0 57%;
    max-width: 57%;
}

.coluna-58{
    flex: 0 0 58%;
    max-width: 58%;
}

.coluna-59{
    flex: 0 0 59%;
    max-width: 59%;
}

.coluna-60{
    flex: 0 0 60%;
    max-width: 60%;
}

.coluna-61{
    flex: 0 0 61%;
    max-width: 61%;
}

.coluna-62{
    flex: 0 0 62%;
    max-width: 62%;
}

.coluna-63{
    flex: 0 0 63%;
    max-width: 63%;
}

.coluna-64{
    flex: 0 0 64%;
    max-width: 64%;
}

.coluna-65{
    flex: 0 0 65%;
    max-width: 65%;
}

.coluna-66{
    flex: 0 0 66%;
    max-width: 66%;
}

.coluna-68{
    flex: 0 0 68%;
    max-width: 68%;
}

.coluna-70{
    flex: 0 0 70%;
    max-width: 70%;
}

.coluna-72{
    flex: 0 0 72%;
    max-width: 72%;
}

.coluna-73{
    flex: 0 0 73%;
    max-width: 73%;
}

.coluna-74{
    flex: 0 0 74%;
    max-width: 74%;
}

.coluna-75{
    flex: 0 0 75%;
    max-width: 75%;
}

.coluna-77{
    flex: 0 0 77%;
    max-width: 77%;
}

.coluna-79{
    flex: 0 0 79%;
    max-width: 79%;
}

.coluna-80{
    flex: 0 0 80%;
    max-width: 80%;
}

.coluna-81{
    flex: 0 0 81%;
    max-width: 81%;
}

.coluna-82{
    flex: 0 0 82%;
    max-width: 82%;
}

.coluna-83{
    flex: 0 0 83%;
    max-width: 83%;
}

.coluna-84{
    flex: 0 0 84%;
    max-width: 84%;
}

.coluna-85{
    flex: 0 0 85%;
    max-width: 85%;
}

.coluna-87{
    flex: 0 0 87%;
    max-width: 87%;
}

.coluna-88{
    flex: 0 0 88%;
    max-width: 88%;
}

.coluna-89{
    flex: 0 0 89%;
    max-width: 89%;
}

.coluna-90{
    flex: 0 0 90%;
    max-width: 90%;
}

.coluna-100{
    flex: 0 0 100%;
    max-width: 100%;
}

/* .audio-bg-whatsapp audio::-webkit-media-controls-play-button,
    audio::-webkit-media-controls-panel{
    background-color: rgb(217, 253, 211);
} */

/*Responsividade*/
@media (max-width: 600px ){
    *{
        margin: 0;
        box-sizing: border-box;}

    .projeto_menu{
        display: none !important;}

    /*--Todo o MENU vertical--*/
   #aside-menu-lateral {
        display: none;}

    #aside-menu-lateral{
        height: 100%;
        position: fixed;
         }

    .labelOptionMenu{
        font-size: 16px;
       /* color: red;*/}

    /*Financeiro*/
    /*--TESTE--*/
    /*Bg-modal geral ticket/boletos*/
     .bg-modal{
        text-align: center;
        display: flex;
        flex-direction: column;
        margin-left: 10% !important;
        margin-right: 20% !important;}

    /*Campo de ticket*/
    .bg-modal#ticket{
        width: 135% !important;
        float: left;}

    /*Campo de boletos*/
    .bg-modal#boletos{
        width: 100% !important;
        float: right;}

    /*Title pendência*/
  /* #pendencia{
        margin-left: -60%;
        font-size: 18px;
        font-weight: 700;
        line-height: normal;}

    .dropbtn-pendencias{
        margin-left: 80% !important;}*/

    /*.linha{
        background-color: red;
        width: 100%;
        display: flex;}*/

      
    /*fundo home financeiro*/ 
    /*.pl-55-pt-30{
       background-color:blue;} */

    /*--TITLE PENDÊNCIAS/TICKETS */
    /*.txt-20-black{
        font-size: 18px;
        display: inline;
        text-align: left;
        }

    .border-top-basic{
        background-color: red;
    }*/

    /*Pendências e Tickets */
    /*.card-financeiro{
    margin: 0;
    background-color: #F5F6F7;
    display: flex;
    flex-direction: column;
    text-align: left;
    overflow-y: auto;}*/


    /*tickets*/
    /*.coluna-51{
        margin: 0 !important;
        display: block;
        margin-top: 180% !important;
        text-align: left;
        margin-left: -92% !important;
        overflow-y: auto;}*/

    /**btn-pendencias*/
    /*.svg-cinza{
        margin-top: -30%;
        margin-left: 5%; } */
    /*input*/

    .coluna-35 {
        display: block !important;
        width: 190% !important;
        height: 200vh !important; 
        /*margin: 10px auto; /* Centraliza horizontalmente */
      }

    .dropdown-content-pendencias#info{
        min-width: 380% !important;
        padding: 8px 0 0 0;   
    }

    .txt-12-topic{
        font-size: 12px !important;
        width: 90% !important;}

    .list-marker{
        width: 90%;}

    .bg-card-susp{
        background-color: blue;}

    .menu_principal{
        margin-right: 30.5%;
        margin-top: 0.2%;}

    .svg-voltar{
        position: fixed;
        margin-left: -0.1%;
        margin-top: 0.2%;}
    
    #caminho-1{
        font-size: 16px;
        font-family: Muli-ExtraBold; 
        margin-left: -50% !important;
        overflow-y: auto;}
  
    #liOptionAtiva{
        height: 9%; }

    .card-financeiro{
        display: flex;
        flex-direction: column;
        overflow-y: auto !important; }

    .coluna-35,.coluna-65{
        padding: 10px;
        margin: 5px;
        display: flex;
        flex-direction: column;
        background-color: #F5F6F7;
        background-color: transparent;}

    #card2{
        background-color: transparent;
        width: 380% !important;
        height: 45vh !important;
        margin-left: -55%;
        overflow-y: auto;
        margin-top: -30% !important;
    }

    #card1{
        background-color: transparent;
        margin-top: -75%;
        width: 197% !important;
        height: 50vh !important;
        margin-left: -22%;
        overflow-y: auto;}
    
    .coluna-35{
        width: 1500% !important;
        height: 55vh !important;}

    #razao{
        margin-top: 20% !important;
        float: right;
        margin-left: -105% !important;}

    #campo_busca{
        width: 205%;}

    /*--Parte da busca que contém o emoji e a frase*/
    .busca-vazia-cliente{
        height: 40vh;
        width: 320px;
        align-items: center;}

    body{
        overflow-y: auto !important;
        background-color: #F5F6F7;
    }

    .linha.center-right.border-top-basic{
        position: fixed;
        margin-top: -29%;
        bottom: 0;
        padding: 8px 0;
        width: 100%;
        background-color: #FFFFFF !important;
        margin-left: -13%;
    }

    #sincronizar{
        background-color: #0091FF !important;}

    #cobranca{
        background-color: #0091FF !important;}

    /*M O D A L  - - - - - teste*/ 
    /*.modal-dialog{
        width: 130%;
        height: 70vh;}

    #modal-client.bg-modal{
        width: 230%;
        height: 55vh;}*/

/*--Todo o campo de busca--*/


    #buscar_client{
        width: 120%;
        height: 60vh;
    }

    .modal-content{
        width: 1510px !important;
        height: 75vh;
        margin-left: 1.5% !important;}

    .modal-content.bg-modal{
        background-color: yellow;}
   
    #mensagem-modal-empresa-vazio{
        font-size: 14px;}

    .txt-14-black{
        font-size: 12px;}

    #titulo-modal-empresa{
        font-size: 16px;
        font-family: Muli-ExtraBold;}

    .input-busca-cliente{
        font-size: 10px;}

    #line-cliente,#cliente{
        width: 50%;
    }

    /*#scroll{
        background-color: red !important;
        padding: 0px 20px !important;
    }*/
   
}

@media (max-width: 372px){
    /*Bg-modal geral ticket/boletos*/
    .bg-modal{
        text-align: center;
        display: flex;
        flex-direction: column;
        margin-left: 40% !important;
        margin-right: -10% !important;
    }

    /*Campo de ticket*/
    .bg-modal#ticket{
        max-width: 135% !important;
        margin-left: -14% !important;
        background-color: red !important;}

    /*Campo de boletos*/
    .bg-modal#boletos{
        margin-right: 20% !important;
        max-width: 100% !important;
        float: right;}
    
    #scroll{
        margin-left: -5%;
    }

    .linha.center-right.border-top-basic{
        margin-top: -29%;
        width: 110%;
        background-color: #FFFFFF !important;
        margin-left: -18%;
        align-items: center;
    }

    #sincronizar{
        background-color: #0091FF !important;
        width: 33% !important;
        height: 5vh !important;}

    #cobranca{
        background-color: #0091FF !important;
        width: 43% !important;
        height: 5vh !important;}
      
}