.login-center {
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%)
}

select.campos {
    background-repeat: no-repeat
}

.alturaPagina, body.no-scroll {
    overflow: hidden
}

a {
    text-decoration: none !important;
}

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

.linhaUnica, .linkAzul a {
    white-space: nowrap
}

#footer, .alinhamentoCentral {
    text-align: center
}

.campos, body, div.ui-tooltip, input, select, textarea {
    font-family: Segoe UI,Helvetica,Arial,sans-serif
}

body {
    height: 100%;
    margin: 0 auto;
    padding: 0;
    font-size: 14px;
    color: #222;
    overflow-x: hidden
}

body img {
    filter: none
}

td, th {
    /*border-color: #dededd*/
    border-color: #fff;
}

#footer {
    float: left;
    height: 25px;
    width: 100%;
    border-top: 1px solid #f2f2f2;
    position: absolute;
    bottom: 0;
    left: 0;
    padding-top: 10px;
    z-index: 999;
}

a.sp-cancel {
    background-color: #de4444 !important;
    border: 0 !important;
    color: #fff !important;
    font-size: 13px !important;
    padding: 7px 10px !important;
    cursor: pointer !important;
    border-radius: 4px !important;
    text-decoration: none !important
}

.linkAmarelo a, .linkAzul a, .linkAzul2 a, .linkAzul3 a, .linkAzulQuebra a, .linkIconeTopo, .linkLista a, .linkRoxo a, .linkVerde a, .linkVerdeWebNets a, .linkVerdeWebNets a:hover, .menusLargura a, .paginacao a, .paginacao span, .textoTop {
    text-decoration: none
}

.linkAmarelo a:hover, .linkAzul a:hover, .linkAzul2 a:hover, .linkAzul3 a:hover, .linkAzulQuebra a:hover, .linkLista a:hover, .linkRoxo a:hover, .linkVerde a:hover {
    text-decoration: underline
}

a.sp-cancel:hover {
    background-color: #fa5b5b !important;
    color: #fff !important
}

#footer, select.campos {
    background-color: #fff
}

.totalizadorFonteSize, h2 {
    font-size: 16px
}

input[type=button], input[type=submit] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.sp-replacer.sp-light, select.campos {
    background-image: url(../Imagens/icone-select.png);
    background-size: 16px;
    background-position: 100%;
    padding-right: 24px
}

::-webkit-input-placeholder {
    color: #828282
}

:-moz-placeholder, ::-moz-placeholder {
    color: #828282
}

:-ms-input-placeholder {
    color: #828282
}

:focus::-webkit-input-placeholder {
    -webkit-transition: .5s .5s;
    transition: .5s .5s;
    opacity: 0
}

.alertas b, .topoDireita[aria-expanded=true] {
    display: block
}

.esconde, .imprime, [data-tooltip]:not(:hover):after, [data-tooltip]:not(:hover):before {
    display: none
}

.alturaPagina, .desce, form, html {
    height: 100%
}

.agendamentoImpressao {
    width: 900px
}

.agendamentoT1 {
    padding: 0;
    margin: 0;
    /*border: 1px solid #dededd*/
}

.agendamentoT2 {
    background-color: #f2f2f2;
    border: 1px solid #dededd
}

.alinhamentoDireita, .class-adm .dataHoraInteracao {
    text-align: right
}

.alinhamentoDireita2, .topoDireita, .topoDireita2 {
    float: right
}

.topoDireita > span, .topoDireita > a, .topoDireita2 > span, .topoDireita2 > a {
    margin-left: 10px;
}

.alinhamentoEsquerda {
    text-align: left
}

.alinhamentoEsquerda2 {
    float: left
}

.alinhamentoInferior {
    vertical-align: bottom
}

.alinhamentoTopo, .imagemTop {
    vertical-align: top
}

.alturaPagina {
    height: auto;
    min-height: 100%;
    position: relative
}

.alturaTop7px {
    margin-top: 7px
}

.altura2px {
    clear: both;
    height: 2px
}

.altura3px {
    clear: both;
    height: 3px
}

.altura4px {
    clear: both;
    height: 4px
}

.altura5px {
    clear: both;
    height: 5px
}

.altura6px {
    clear: both;
    height: 6px
}

.altura8px {
    clear: both;
    height: 8px
}

.altura10px {
    clear: both;
    height: 10px
}

.altura12px {
    clear: both;
    height: 12px
}

.altura15px {
    clear: both;
    height: 15px
}

.altura17px {
    clear: both;
    height: 17px
}

.altura18px {
    clear: both;
    height: 18px
}

.altura19px {
    clear: both;
    height: 19px
}

.altura20px {
    height: 20px;
    clear: both
}

.altura22px {
    clear: both;
    height: 22px
}

.altura23px {
    clear: both;
    height: 23px
}

.altura24px {
    clear: both;
    height: 24px
}

.altura25px {
    clear: both;
    height: 25px
}

.altura29px {
    clear: both;
    height: 29px
}

.altura30px {
    clear: both;
    height: 30px
}

.altura35px {
    clear: both;
    height: 35px
}

.altura38px {
    clear: both;
    height: 38px
}

.altura40px {
    clear: both;
    height: 40px
}

.altura50px {
    clear: both;
    height: 50px
}

.altura57px {
    clear: both;
    height: 57px
}

.altura65px {
    clear: both;
    height: 65px
}

.altura500px {
    clear: both;
    height: 500px
}

.alturaMinima218 {
    min-height: 400px
}

.azul, .linkAzul a {
    color: #2555b6
}

.bold {
    font-weight: 600;
    color: #444
}

.hoverGrid, .tabelaFundo {
    border: 1px solid #dededd
}

.borda5Cinza {
    border: 5px solid #f1f1f1
}

.botao, .botao-icone {
    border-radius: 4px;
    display: inline-block
}

.botao {
    cursor: pointer;
    padding: 10px;
    font-size: 13px;
    color: #fff;
    border: 1px solid transparent;
    background-color: transparent
}

.botao-icone, .botao-icone2, .botao-icone3, .botao-icone4, .botaoHistoricoSolicitante {
    padding: 5px;
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    background-position: 50%
}

.botao:disabled {
    cursor: default;
    background-color: #eee;
    color: #bbb
}

.botao-excel {
    background-color: #ed5564
}

.botao-icone {
    cursor: pointer;
    border: 0;
    background-color: #cba67c
}

.botao-icone2, .botao-icone3, .botao-icone4 {
    display: inline-block;
    border-radius: 4px;
    border: 0;
    cursor: pointer
}

.botao-ajuda {
    font-weight: 700;
    background-color: #f8f8f8;
    color: #555;
    border: 1px solid #dededd;
    font-size: 1em;
    cursor: pointer;
    padding: 8px 12px;
    border-radius: 4px;
    display: inline-block
}

.botao-aviso {
    background-color: #ffb136
}

.botao-cancelar {
    background-color: #ec7c57
}

.botao-check2 {
    background-image: url(../Imagens/visivel2.png);
    background-size: 14px;
    background-color: #74b9ff
}

.botao-edicao {
    background-image: url(../Imagens/lapis.png);
    background-size: 12px;
    background-color: #fab1a0
}

.botao-email {
    background-image: url(../Imagens/email2.png);
    background-size: 18px;
    background-color: #2ecc71
}

.botao-encaminhar {
    background-color: #f06f4f
}

.botao-escolher {
    background-color: #78acc6
}

.botao-excel {
    background-color: #ed5564
}

.botao-excluir {
    background-image: url(../Imagens/excluir.png);
    background-size: 12px;
    background-color: #fb660d
}

.botao-filtro {
    background-color: #59c6ff
}

.botao-icone2 {
    background-color: #feca57
}

.botao-icone4 {
    background-color: #60a3bc
}

.botao-encaminhamento {
    background-color: #e77f67
}

.botao-resumo {
    background-color: #999
}

.botao-sucesso {
    background-color: #4da462
}

.botao-tempo {
    background-color: #90a4ae
}

.botaoAjuda {
    margin-top: -2px
}

.headerTabelas_img {
    float: left;
    display: grid;
}

.campos {
    -webkit-appearance: none;
    padding: 5px;
    color: #333;
    resize: none
}

.campos {
    border: 1px solid #dededd;
    border-radius: 5px;
    max-width: 400px;
    -moz-appearance: none;
    appearance: none
}

.icone svg, .larguraMaxima100Por {
    max-width: 100%
}

.camposMaiusculos {
    text-transform: uppercase
}

.camposMinusculos {
    text-transform: lowercase
}

.solicitante-seta:after {
    position: absolute;
    content: url(../Imagens/right-arrow.png);
    left: 6.5%;
    bottom: -23px
}

.login-container {
    -webkit-flex-direction: column;
    -webkit-box-direction: normal
}

.cinza13px {
    font-size: 13px;
    color: #999
}

.cinza555555 {
    color: #555
}

.cinza999999, .corStatusCinza, .totalizadorCorCancelado {
    color: #999
}

.conteudo {
    padding: 110px 20px 20px;
    min-height: calc(100vh - 260px);
    background-color: #f9f9f9;
}

.conteudoFixo {
    z-index: 99999;
    width: 100%;
    box-shadow: 2px 0 2px 2px #dededd;
    position: fixed;
    top: 0;
    background-color: #f8f8f8
}

.conteudo-emails {
    display: flex !important;
    min-height: calc(100vh - 260px);
}

.conteudo-emails__direita {
    width: 100%;
}

.corStatusAzul, .totalizadorCorAgendado {
    color: #479fec
}

.corStatusVerde, .totalizadorCorConcluido {
    color: #2dcc70
}

.Cor444 {
    color: #444;
}

.Cor888 {
    color: #888;
}

.Cor595 {
    color: #595959;
}

.dataBorda {
    border-bottom: 1px dashed #999;
    width: 100%
}

.desce {
    padding-bottom: 50px
}

.direita {
    margin: 0 auto;
    width: 40%;
    text-align: center
}

.divBotaoLogar {
    margin-left: 4px;
    margin-top: 10px;
    float: left;
}

.divCidadeInexistente {
    position: absolute;
    left: 50%;
    top: 40%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    font-size: 22px;
    color: #555;
    text-align: center;
}

.divEsqueciMinhaSenha {
    margin-left: 40px;
    margin-top: 20px;
    float: left
}

.divInicialParteBaixo {
    padding: 8px;
    background-color: #f7f7f8;
    border: 1px solid #f7f7f8;
    border-radius: 3px;
    font-size: 14px
}

.largura100Por {
    width: 100%
}

.selecIcone, .upload-campo + .upload-label {
    cursor: pointer
}

.emailsMarketingDiv {
    height: 378px;
    overflow-y: auto;
    width: 100%
}

.erro {
    color: #fb0000
}

.espacoDireita {
    padding-right: 20px
}

.font14Px, .fonteAvisos, .fonteRodape, .homeeOuveTexto, .linkLista a, .linkLista a:hover {
    font-size: 14px
}

.fonteRodape {
    width: 100%;
    background-color: #fff;
    position: relative;
    text-align: center;
    color: #999
}

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

.fonte13px {
    font-size: 13px
}

.fonte14pxCinza {
    color: #999;
    font-size: 14px
}

.fonte24px {
    font-size: 24px
}

.formsLogin {
    text-align: left;
    padding: 10px;
    color: #555
}

.fundoCinzaTabTempo, .headerGrid.sticky th {
    background-color: #dededd
}

.fundoHoverResumo:hover, .hoverGrid2 tr:hover, .hoverGrid3 tr:not(:first-child):hover {
    background-color: #e3eef8 !important
}

.hoverGrid td img, .icone svg, .selecIcone, .site-title, .site-title svg {
    display: inline-block;
    vertical-align: middle
}

.headerGrid {
    background-color: #dededd !important;
    height: 35px
}

.headerGridClaro {
    background-color: #f0f0f0 !important;
    height: 35px;
    border: 1px solid #fff;
    color: #444;
}

.hoverGrid tr.paginacao:hover, .hoverGrid2 tr.paginacao:hover, .hoverGrid3 tr.paginacao:hover, .sombra {
    background-color: #fff !important
}

.height30 {
    height: 30px
}

.hoverGrid tr:not(:first-child):hover {
    background-color: #e3eef8
}

.hoverGrid3 {
    border: 0 solid #dededd
}

.icone svg {
    height: 1em;
    width: 1em
}

.icone-color, .icone-color svg {
    color: inherit
}

.icone-color svg circle, .icone-color svg path, .icone-color svg polygon, .icone-color svg rect {
    fill: currentColor
}

.imagem {
    vertical-align: middle
}

.imagemMenu {
    top: 20%;
    vertical-align: middle;
    position: relative
}

.alertaBoxProfile, .box-retrato, .flexRowRespostaInteracao tbody, .linhaFlex, .login-center, .retificacaoProfile, .retificacaoProfileInformacao {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox
}

.largura1Por {
    width: 1%
}

.largura2Por {
    width: 2%
}

.largura4Por {
    width: 4%
}

.largura5 {
    width: 5px
}

.largura5Por {
    width: 5%
}

.largura7Por {
    width: 7%
}

.largura8Por {
    width: 8%
}

.largura10 {
    width: 10px
}

.largura10Por {
    width: 10%
}

.largura12Por {
    width: 12%
}

.largura15Por {
    width: 15%
}

.largura16Por {
    width: 16%
}

.largura19Por {
    width: 19%
}

.largura20Por {
    width: 20%
}

.largura21_5 {
    width: 21.5px
}

.largura22 {
    width: 22px
}

.largura24Por {
    width: 24%
}

.largura25Por {
    width: 25%
}

.largura27Por {
    width: 27%
}

.alertaSeta, .largura30 {
    width: 30px
}

.largura30Por {
    width: 30%
}

.largura40 {
    width: 40px
}

.largura40Por {
    width: 40%
}

.largura45Por {
    width: 45%
}

.largura48Por {
    width: 48%
}

.largura49Por {
    width: 49%
}

.largura50Por {
    width: 50%
}

.largura56Por {
    width: 56%
}

.largura57Por {
    width: 57%
}

.largura58Por {
    width: 58%
}

.largura59Por {
    width: 59%
}

.largura60Por {
    width: 60%
}

.largura70Por {
    width: 70%
}

.largura75Por {
    width: 75%
}

.largura76Por {
    width: 76%
}

.largura80Por {
    width: 80%
}

.largura85Por {
    width: 85%
}

.largura90Por {
    width: 90%
}

.largura95Por {
    width: 95%
}

.largura98Por {
    width: 98%
}

.largura99Por {
    width: 99%
}

.largura115 {
    width: 115px
}

.largura150 {
    width: 150px
}

.largura170 {
    width: 170px
}

.largura400 {
    width: 400px
}

.largura750 {
    width: 750px
}

.login-center {
    position: absolute;
    transform: translate(-50%,-50%)
}

.linhaCinza {
    border-bottom: 1px solid #dededd
}

.flexRowRespostaInteracao tbody, .linhaFlex {
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row
}

.linkAmarelo a, .linkAmarelo a:hover {
    color: #f7da64
}

.linkAmarelo a svg {
    fill: #f7da64
}

.linkAzulQuebra a, .linkAzulQuebra a:hover {
    color: #1a0dab
}

.linkAzul2 a, .linkAzul2 a:hover {
    color: #59c6ff
}

.linkAzul2 a svg {
    fill: #59c6ff
}

.linkAzul3 a, .linkAzul3 a:hover {
    color: #2555b6;
    font-size: 15px !important
}

.linkRoxo a, .linkRoxo a:hover {
    color: #d6a2e8
}

.linkRoxo a svg {
    fill: #d6a2e8
}

.linkVerde a, .linkVerde a:hover {
    color: #78e08f;
}

.linkVerde a svg {
    fill: #78e08f;
}

.linkMarromWebNets {
    color: #5a5b5c;
}

.linkVerdeWebNets a {
    color: #8fbd4e;
    font-weight: 700;
}

.linkSair {
    color: #ff7675;
    text-decoration: none;
}

@media screen and (min-width: 1200px) {
    .linkSair {
        line-height: 40px;
    }
}

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

.linkSair .iconeSvg {
    margin-right: 0;
}

.linkSair .iconeSvg svg {
    width: 12px;
    height: 12px;
}

.login-container {
    padding: 26px 10px 0 40px;
    display: flex;
    -webkit-box-orient: vertical;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center
}

.login-imagem {
    width: 100%;
    margin: 0 auto;
}

.sombra {
    border: 1px solid #eef0ec !important;
    box-shadow: 0 1px 3px rgb(0 0 0 / 7%) !important;
    border-radius: 5px !important;
    background: #fff;
}

.login-center {
    max-width: 450px;
    left: 50%;
    top: 50%;
    width: 450px;
    min-height: 597px;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: space-between
}

.max500px {
    max-width: 500px
}

.loginsTabela {
    width: 100%;
    border-left: 1px solid #dededd;
    border-right: 2px solid #dededd;
    border-top: 1px solid #dededd;
    border-bottom: 2px solid #dededd;
    border-radius: 3px
}

.marginLeft3 {
    margin-left: 3px
}

.marginLeft15 {
    margin-right: 15px
}

.marginTopMenos30 {
    margin-top: -30px
}

.menu {
    overflow-x: auto;
    padding: 6.5px 0
}

@media screen and (max-width:1685px) {
    .conteudo {
        padding: 110px 20px 20px
    }
}

.menu::-webkit-scrollbar {
    border-radius: 10px;
    height: 8px
}

.menu::-webkit-scrollbar-thumb {
    background-color: #bbb;
    border-radius: 10px;
    background-clip: padding-box
}

.menu::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #dfdfdf
}

.menu-table {
    padding: 0
}

.menu-table tr td a {
    display: flex;
    gap: 4px;
    margin: 0 0 0 19px;
    width: max-content;
    align-items: center
}

.menu-table tr .linkAzul a span {
    translate: 0 2px
}

.menu tr td img, .menu-table tr td a img {
    width: 18px;
    height: 18px;
    object-fit: contain
}

.menusLargura {
    text-align: center;
    padding-left: 20px
}

.menusLargura a {
    font-size: 13px;
    color: #444;
    display: block;
    text-align: center;
    width: 90px
}

.capslock, .inputSenhaControle, .relativo, .rodape, .upload-container {
    position: relative
}

#collider, .rodape2, .upload-campo {
    position: absolute
}

.paginacao a {
    margin-left: 5px;
    background-color: #fff;
    color: #c7cbd4
}

.paginacao a, .paginacao span {
    display: table-cell;
    height: 15px;
    width: 15px;
    font-weight: 700;
    text-align: center;
    padding: 5px;
    border: 1px solid #c7cbd4;
    border-radius: 5px
}

.paginacao span {
    background-color: #c7cbd4;
    color: #fff
}

.paginacao table {
    margin: auto
}

.padding100Left {
    padding-left: 100px
}

.padding2 {
    padding: 2px
}

.padding3 {
    padding: 3px
}

.padding3Left {
    padding-left: 3px
}

padding4 {
    padding: 4px
}

.padding4Top, paddings4 {
    padding-top: 4px
}

.padding5 {
    padding: 5px
}

.padding5Left {
    padding-left: 5px
}

.paddings5 {
    padding-right: 5px
}

.padding5Top, .paddings5 {
    padding-top: 5px
}

.padding6 {
    padding: 6px
}

.padding7 {
    padding: 7px
}

.padding6Left {
    padding-left: 6px
}

.padding7Top {
    padding-top: 7px
}

.padding8LeftRight {
    padding-left: 8px;
    padding-right: 8px
}

.padding8Home {
    padding-left: 8px;
    padding-bottom: 8px
}

.padding10 {
    padding: 10px
}

.padding10Left {
    padding-left: 10px
}

.paddingRight15px {
    padding-right: 15px
}

.padding20Left {
    padding-left: 20px
}

.padding20Topo {
    padding-top: 10px
}

.padding22Left {
    padding-left: 22px
}

.padding22Right {
    padding-right: 22px
}

.padding25 {
    padding: 25px
}

.padding25Left {
    padding-left: 25px
}

.padding50Left {
    padding-left: 50px
}

.paginacaoDireita {
    float: right;
    padding-top: 15px;
    padding-right: 5px
}

.rodape, .rodape2 {
    width: 100%;
    border-top: 1px solid #f2f2f2;
    text-align: center;
    color: #999;
    font-size: 12px;
    height: 50px
}

.respiro {
    clear: both
}

.rodape {
    margin-top: -55px
}

.rodape2 {
    bottom: 0;
    display: none
}

.semBarra {
    overflow-y: hidden
}

.semBorda {
    border: 0
}

.semHoverGrid tr:not(:first-child):hover {
    background-color: transparent
}

.selecIcone {
    margin: 0;
    overflow: hidden;
    padding: 4px 24px 4px 4px;
    border: 1px solid #91765d;
    background: url(../Imagens/icone-select.png) 100%/16px no-repeat #eee;
    color: #333
}

.site-title {
    margin-right: 10px;
    margin-bottom: 1.5px
}

.site-title svg {
    height: 40px;
    width: 40px
}

.sp-replacer .sp-preview {
    width: 28px;
    height: 28px;
    margin-right: 0
}

.tabelaColunaDireitaBranco {
    background-color: #fff;
    text-align: left;
    padding: 6px;
    width: 85%
}

.tabelaColunaEsquerdaBranco {
    background-color: #fff;
    text-align: right;
    padding: 6px;
    width: 15%;
    font-weight: 600;
    color: #333
}

.tabelaFundo {
    border-radius: 3px;
    background-color: #f8f8f8;
    padding: 10px;
    font-size: 16px;
    color: #555
}

.tabelaFundo > a {
    display: block;
    color: #555
}

.tabelaFundo > a:after {
    content: "";
    display: block;
    clear: both
}

.tabelaFundoBrancoPrincipal {
    border: 1px solid #dededd;
    background-color: #fff;
    padding: 4px
}

.tabelaFundoCinzaClaroPrincipal {
    border: 1px solid #dededd;
    background-color: #f9f9f9;
    padding: 4px
}

.tabelaHomeStatus {
    height: 303px;
    padding: 10px
}

.textoTop {
    font-size: 14px;
    float: right;
    margin: 3px 5px 0
}

#imgUsuarioPequeno.sem-foto {
    width: 16px !important;
    height: 16px !important;
    border-radius: unset !important
}

.topicoRelatorioFechamento {
    font-size: 20px;
    font-weight: 700
}

.topicoRelatorioFechamento2 {
    font-size: 16px;
    font-weight: 700
}

.topoEsquerda {
    float: left;
    display: flex;
    align-items: center
}

@media screen and (max-width: 1199px) {
    .topoDireita2 {
        margin-top: 10px;
    }

    .topoDireita2 > div {
        margin-top: 0px !important;
    }
}

.topoDireita .iconeSvg, .topoDireita2 .iconeSvg {
    display: inline-block;
    vertical-align: middle;
    margin-right: 2px
}

.topoDireita svg, .topoDireita2 svg {
    width: 16px;
    height: 16px
}

.topoMenu {
    background-color: #444;
    color: #fff;
    padding: 5px 20px
}

@media screen and (max-width:560px) {
    .menu {
        margin-top: 20px;
        margin-right: 0 !important
    }

    .menu > div {
        top: 95px !important;
        display: flex;
        width: 100%;
        justify-content: center;
        right: unset !important
    }

    .conteudo {
        padding: 175px 20px 20px !important
    }

    .submenu {
        margin-top: 0 !important
    }

    .topoEsquerda {
        float: none;
        justify-content: center
    }

    .topoDireita[aria-expanded=true] {
        top: 91px !important
    }

    .topoDireita_div {
        display: flex;
        justify-content: center;
        flex-direction: row-reverse
    }

    .topoMenu {
        padding: 5px 0
    }
}

@media screen and (max-width:1200px) {
    .topoDireita[aria-expanded=true] {
        position: fixed;
        width: 140px;
        background-color: #505050;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        padding: 15px;
        border-radius: 6px;
        right: 15px;
        top: 52px;
        z-index: 9;
        border: 1px solid #5c5c5c
    }

    .topoDireita {
        display: none
    }
}

#lblNome, #lblNomeCidadeHeader {
    display: -webkit-inline-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all
}

#lblNome {
    translate: 0 5px
}

#collider {
    height: 10px;
    top: 20px;
    z-index: -1
}

.totalizadorResultado {
    font-size: 20px;
    color: #555
}

.totalizadorCorPendente {
    color: #f992f9
}

.totalizadorCorVermelho {
    color: #ee796e
}

.upload-campo {
    padding: 0;
    width: .1px;
    height: .1px;
    font-size: 0;
    opacity: 0
}

.va-formulario .campos {
    width: 250px;
    padding: 10px;
    margin-bottom: 15px
}

.va-formulario .botao {
    width: 6.5em;
    font-size: 1.1em;
    margin-bottom: 7px
}

.va-label {
    font-weight: 600;
    font-size: 1.1em
}

.va-required {
    font-size: 1.2em;
    vertical-align: middle
}

a .acessibilidade:hover {
    background-color: #2c2c2c !important
}

.sidebar {
    top: 0;
    left: 0;
    background: #f8f8f8;
    z-index: 100;
    -webkit-transition: .5s;
    transition: .5s;
    box-shadow: 2px 0 2px 0 #dededd;
    margin: -21px 15px -70px -20px;
    width: 81px
}

.sidebar .nav-links {
    padding: 8px 0 10px;
    overflow: visible;
    min-height: 100%;
    width: 70px
}

.sidebar .nav-links::-webkit-scrollbar {
    width: 2px
}

.sidebar .nav-links::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px hsla(0,0%,49%,.11);
    border-radius: 10px
}

.sidebar .nav-links::-webkit-scrollbar-thumb {
    background-color: #d1d1d1;
    outline: #708090 solid 0;
    border-radius: 10px
}

.sidebar .nav-links li {
    position: relative;
    list-style: none;
    -webkit-transition: .4s;
    transition: .4s;
    margin: 0 14px;
    width: max-content
}

    .sidebar .nav-links li:hover .menu-icons-box {
        border-color: #c2c2c2
    }

    .box-retrato, .sidebar .nav-links li .iocn-link, .sidebar .nav-links li .menu-icons-box {
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    .sidebar .nav-links li .menu-icons-box {
        height: 32px;
        width: 32px;
        text-align: center;
        line-height: 50px;
        color: #fff;
        font-size: 20px;
        cursor: pointer;
        -webkit-transition: .3s;
        transition: .3s;
        position: relative
    }

    .sidebar .nav-links li .iocn-link .menu-icons-box:after {
        position: absolute;
        content: "";
        background-color: #f38282;
        width: 18px;
        height: 18px;
        top: -10px;
        right: -11px;
        border-radius: 50%;
        display: none
    }

.sidebar .nav-links li a {
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}

.sidebar .nav-links li a .link_name {
    font-size: 15px;
    font-weight: 400;
    color: #222;
    -webkit-transition: .4s;
    transition: .4s;
    margin-top: -8px;
    opacity: 0;
    pointer-events: none
}

.sidebar .nav-links li .sub-menu a {
    color: #fff;
    font-size: 15px;
    white-space: nowrap;
    opacity: .6;
    -webkit-transition: .3s;
    transition: .3s
}

.sidebar .nav-links li .sub-menu {
    position: absolute;
    top: 0;
    margin-top: 0;
    opacity: 0;
    display: block;
    pointer-events: none;
    -webkit-transition: none;
    transition: none
}

.sidebar .nav-links li:hover .sub-menu {
    top: 9px;
    left: 70px;
    opacity: 1;
    pointer-events: auto;
    -webkit-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
    background-color: #fff;
    border-radius: 3px;
    box-shadow: 0 0 15px 0 rgb(0 0 0/30%);
    padding: 6px 0
}

.sidebar .nav-links li:hover .sub-menu:after {
    content: "";
    position: absolute;
    left: -5px;
    margin-left: -2px;
    top: 41%;
    -webkit-transform: translateY(3%);
    -ms-transform: translateY(3%);
    transform: translateY(3%);
    -webkit-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    transform: rotate(-4deg);
    border: 4px solid #fff;
    border-color: transparent #fff transparent transparent
}

.sidebar .nav-links li .sub-menu .link_name {
    font-size: 14px;
    opacity: 1;
    display: block;
    color: #202020;
    text-align: center
}

.sidebar .nav-links li .sub-menu.blank {
    opacity: 1;
    pointer-events: auto;
    padding: 3px 20px 6px 16px;
    opacity: 0;
    pointer-events: none;
    background: #f8f8f8
}

.sidebar .nav-links li:hover .sub-menu.blank {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.sidebar .name-job {
    margin-left: -6px
}

.sidebar .menu-icons-box {
    border: 1px solid #f1f0f0;
    border-radius: 5px;
    padding: 5px;
    height: 62px;
    width: 62px;
    margin-bottom: 17px
}

.sidebar .menu-icons-box img {
    max-width: 68%
}

@-webkit-keyframes a {
    0% {
        -webkit-transform: scale(.3);
        opacity: 0
    }

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

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

    to {
        opacity: 1
    }
}

@keyframes a {
    0% {
        -webkit-transform: scale(.3);
        transform: scale(.3);
        opacity: 0
    }

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

@keyframes b {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@media print {
    .altura20px, .altura25px, .altura50px {
        height: 0;
        clear: unset
    }

    .estilos-print .largura5Por, .estilos-print .status-print img, .naoImprime {
        display: none
    }

    .estilos-print a, .linkAzul, .linkAzul a, .linkAzul a:hover, .print100 {
        color: #333 !important
    }

    .conteudo, .desce, .padding6.cinza999999, .topoMenu {
        padding: 0
    }

    .conteudo {
        padding-top: 25px;
        min-height: calc(100vh - 260px)
    }

    .conteudoFixo {
        position: static;
        box-shadow: none
    }

    .estilos-print .campos {
        border: 0;
        width: 100%;
        max-width: 100%
    }

    .estilos-print .linhaCinza, .loginsTabela, .tabelaFundo {
        border: 0
    }

    .estilos-print .status-print span {
        margin-left: -5px
    }

    .estilos-print, .print100 {
        display: block;
        width: 100%
    }

    .estilos-print .padding6 {
        padding: 2px
    }

    .estilos-print img {
        max-width: 700px
    }

    .estilos-print .qr-code {
        width: 100px !important;
        max-width: 100px !important
    }

    .estilos-print .img-mapa-impressao {
        max-width: 100%
    }

    .imprime {
        display: block
    }

    .legenda p, .linkSair {
        display: inline-block;
    }

    .print100 {
        margin-top: 30px
    }

    .quebraLinhaDepois {
        page-break-after: always
    }

    .quebraLinha {
        page-break-before: always;
        padding-top: 30px
    }

    .quebraLinha2 {
        page-break-before: always;
        border: 0;
        padding-top: 5px
    }

    .quebraLinhaAuto {
        page-break-before: auto
    }

    .quebraLinhaAvoid {
        page-break-inside: avoid
    }

    table {
        width: 100% !important
    }

    span.imprime {
        display: inline-block
    }

    .no-print {
        display: none !important
    }

    .charts-box {
        margin-top: 20px !important
    }
}

@media screen and (max-width:1100px) {
    .home-filtro .home-mobile {
        width: 100%;
        height: 0
    }
}

@media screen and (max-width:1440px) {
    .espacoDireita {
        padding-right: 0
    }

    .largura50Por {
        width: 100%;
        display: block
    }

    .largura50Por table.hoverGrid {
        width: 100% !important
    }

    .menuMapa .campos {
        margin-bottom: 10px
    }

    table.largura50Por {
        display: table
    }

    .visualizarMapa {
        height: calc(100% - 259px)
    }

    .menuMapa {
        padding-top: 10px;
    }
}

.linkIconeTopo {
    color: #fff;
    display: flex;
    align-items: center;
    grid-gap: 6px;
    min-height: 2.5em
}

.iconeImagemTopo {
    position: relative;
    width: 2.5em;
    height: 2.5em;
    border: 1px solid #595959;
    border-radius: 10px;
    overflow: hidden
}

.iconeImagemTopoPadrao {
    position: relative;
    width: 31px;
    height: 31px;
    border: 1px solid #585858;
    border-radius: 10px;
    background-color: #3a3a3a;
    display: grid;
    place-items: center
}

.imagemUsuarioTopo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute
}

.imagemUsuarioTopoPadrao {
    width: 21px;
    height: 21px
}

@media screen and (max-width:1024px) {
    .conteudo {
        padding-left: 5px;
        padding-right: 5px;
        min-height: calc(100vh - 260px)
    }

    .hidden-mobile, .largura2Por, .largura4Por {
        display: none
    }

    .largura45Por, .largura48Por {
        width: 100%;
        display: block;
        margin-bottom: 20px
    }

    .ouvidorias .campos {
        max-width: 160px
    }
}

.box-retrato, .dataHoraInteracao {
    margin-bottom: 7px
}

.alinhamentoFlexAlerta tbody {
    gap: 30px
}

.alertas {
    max-width: 700px
}

@media screen and (max-width:1492px) {
    .alertas {
        width: unset;
        min-width: 336px
    }
}

.box-retrato .retrato {
    margin-right: 0 !important
}

.botaoInteracao {
    width: 84px;
    margin-left: 10px
}

.inputInteracaoSolicitante {
    width: 550px;
    background-color: #f2f5f3
}

.inputInteracaoSolicitante textarea {
    max-width: 98% !important
}

.btnExibirSenha {
    position: absolute;
    right: 55px;
    width: 2em;
    top: 7px;
    cursor: pointer
}

.btnExibirSenha svg {
    fill: #808080;
    transition: .4s
}

.btnExibirSenha svg:hover {
    fill: #488bdf
}

.capslock::after {
    content: "A tecla 'Caps Lock' foi ativada.";
    position: absolute;    
    left: 5px;
    top: 42px;
    font-weight: 500;
    color: #ff7979
}

.camposLabel {
    font-weight: 600;
}

.headerTabelas {
    padding: 10px;
    font-size: 15px;
    background-color: #f1f1f1;
    color: #888;
    font-weight: normal;
    border-radius: 5px;
    display: flex;
    align-items: center;
}

.headerTabelas_titulo {
    display: flex;
    align-items: center;
    gap: 5px;
    font-weight: normal;
}

.linkBranco a {
    color: #fff;
    text-decoration: none;
}

.linkBranco a:hover {
    color: #fff;
    text-decoration: underline;
}

input::file-selector-button {
    font-weight: bold;
    color: #fff;
    padding: 10px;
    border-radius: 3px;
    font-size: 12px;
    background-color: #46b8da;
    border: 1px solid #46b8da;
    cursor: pointer;
}

input::file-selector-button:hover {
    background-color: #5bc0de;
    border: 1px solid #5bc0de;
}

/* Abaixo solução dinâmica para o problema da altura que estoura o limite da dela. Basta apenas englobar o conteúdo da div a ser scrollada com a classe "controle-altura-maxima" 

.sweet-alert {
    margin: 0 !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
}

.controle-altura-maxima {
    max-height: 39vh;
    overflow: auto;
}
*/