﻿/********************** HEADER (cabeçalho) ********************/
html{
    position: relative;
    min-height: 100%;
}
body{
    background-color:#F7F7F9;
    margin: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/* Configurações de cor na borda do pophover de informações do usuário */
a.btn-default:hover{
    border:1px solid #adadad;
}
a.btn-default:focus{
    border:1px solid #adadad;
}
a.btn-default:active{
    border:1px solid #adadad;
}
a.btn-default:active:hover{
    border:1px solid #adadad;
}
/* FIM */

.holeriteweb{
    font-style:normal;
    font-family: 'Titillium Web', sans-serif;
    font-size:20px;
}

#posicao-texto {
    text-align: center;
    margin-top:-21px;
	margin-left:150px;
}

#posicao-logo{
	float:left;
}

#header-config{
	padding-top:40px;
	padding-bottom:40px;
}

/***************************************************************/

/******************* MENU BAR (barra de menu) ******************/

#botao-Sair{
    text-decoration:none;
    border:solid;
}

.cor-bar { 
    margin-top:-1px;
    margin-left:0;
    margin-right:0;
    /*background-color:#146eb4;*/
    /*background-color:#56a0d3;*/
    background-color:#2D457A;
}

.cor-navbar { 
    margin-top:-20px;
    margin-left:0;
    margin-right:0;
    background-color:#FFFFFF;
}

.corButton{
    color:#0063B1;
}

#alinhamento { /*dados do contribuinte*/
    text-align:center;
}

/*#testhr{
}

#testhr:hover{ /*sublinha quando passa o mouse
	border-bottom-style:solid;
	border-bottom-color:red;
	padding-bottom:4px;
}*/


.button_mouse { color:white;display:inline-block; margin:0;text-transform:uppercase; } /*sublinha quando passa o mouse*/
.button_mouse:after {
  display:block;
  content: '';
  border-bottom: solid 1px #43B855;  
  transform: scaleX(0.0001);  
  transition: transform 250ms ease-in-out;
}
.button_mouse:hover:after { transform: scaleX(1); }

/* Back Pulse */
@-webkit-keyframes hvr-back-pulse {
  40% {
	background-color: #cfcfcf;
    color: #0063B1;
  }
}

@keyframes hvr-back-pulse {
  40% {
	background-color: #cfcfcf;
    color: #0063B1;
  }
}

.hvr-back-pulse {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  overflow: hidden;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-property: color, background-color;
  transition-property: color, background-color;
}
.hvr-back-pulse:hover, .hvr-back-pulse:focus, .hvr-back-pulse:active {
  -webkit-animation-name: hvr-back-pulse;
  animation-name: hvr-back-pulse;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  background-color: #2098d1;
  background-color: #2098d1;
  color: white;
}

/**************************************************************/

/*************************** LOGIN ****************************/
.cor-answer-red {
    color: red;
}

.position-answer {
    text-align:"center";
    font-family:"Verdana";
}
.login-box { /*centraliza*/
	/*background: none repeat scroll 0% 0% rgb(241, 241, 241);*/
	background: none repeat scroll 0% 0% rgb(239, 239, 239);
    margin: 0 auto;
    width: 300px;
    padding: 25px;
    margin-top: 10px;
    margin-bottom: 40px;
}

.login-box div {
	margin: 0px 0px 1.5em;
}

.login-box h2 {
	font-size: 16px;
	line-height: 17px;
	font-weight: normal;
}

.login-box label {
	/*display: block;*/
}

.login-box .usuario-label, .login-box .passwd-label {
	font-weight: bold;
	margin: 0px 0px 0.5em;
	display: block;
	-moz-user-select: none;
}

.login-box label.remember {
	/*display: inline-block;*/
	vertical-align: top;
	margin: 9px 0px 0px;
}

strong {
	color: rgb(34, 34, 34);
}

.login-box input[type="text"], .login-box input[type="password"] {
	width: 100%;
	height: 32px;
	font-size: 15px;
}

input[type="text"], input[type="password"] {
	/*display: inline-block;*/
	height: 29px;
	margin: 0px;
	padding: 0px 8px;
	background: none repeat scroll 0% 0% rgb(255, 255, 255);
	border-right: 1px solid rgb(217, 217, 217);
	border-width: 1px;
	border-style: solid;
	border-color: rgb(192, 192, 192) rgb(217, 217, 217) rgb(217, 217, 217);
	-moz-border-top-colors: none;
	-moz-border-right-colors: none;
	-moz-border-bottom-colors: none;
	-moz-border-left-colors: none;
	border-image: none;
	-moz-box-sizing: border-box;
	border-radius: 1px 1px 1px 1px;
}

ol, ul {
	list-style: none outside none;
	line-height: 17px;
	margin-left:0px;
	padding-left:0px;
}

a {
	color: rgb(17, 85, 204);
	text-decoration: none;
}

a#forgot_password {
	/*display:block;*/
}

.login-box input[type="submit"] {
	margin: 0px 1.5em 1.2em 0px;
	height: 32px;
	font-size: 13px;
}

.button, input.button[type="submit"] {
	height: 29px;
	line-height: 29px;
	vertical-align: bottom;
	margin: 0px;
}

.remember-label {
	font-weight: normal;
	color: rgb(102, 102, 102);
	line-height: 0;
	padding: 0px 0px 0px 0.4em;
	-moz-user-select: none;
}

input[type="text"]:focus, input[type="password"]:focus {
	outline: medium none;
	border: 1px solid rgb(77, 144, 254);
	box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3) inset;
}


/***************************************************************/

/**************** BODY PAGE (corpo da página) ******************/

.interrogacao { /* ponto de interrogação da imagem */
	width: 24px;
	height: 24px;
	position: absolute;
	top: 10px;
	left: 10px;
}

.item-tile{ /* texto que vai embaixo da imagem */
	text-align:center;
	font-size:17px;
	color:#333;
    font-family: Tahoma
}

.cursor-tiles{
 cursor:pointer;
}

.box-conteudo{
 background-color:#e4e4e4;
 padding-bottom:50px;
}

.blocos {
 width: 165px;
 height: 165px;
 background-color: #EDEDED;
 margin-right: 20px;
 margin-left: 10px;
 margin-bottom: 30px;
 position: relative;
}

.blocos:hover{
    border:solid 2px #3263a6;
}

.img-position{
 text-align:center;
 margin-top:19px;
 text-decoration:none;
}

#cor-fundo-pesquisa{
	background-color:#EDEDED;
    padding-bottom:12px;
    padding-left:12px;
    padding-top:12px;
}




.boxdown{
    float:left;
    margin-left:7px;
    padding-right:5px;
}

.boxdown2 {
    float: left;
}
/*Desevolvido por julio xiuxi KKKK*/

/***************************************************************/

/*************************** CVV *******************************/

.alinha-txt {
    margin-right:50px;
}

/***************************************************************/

/*************************** DAM *******************************/

#alinha-table {
    text-align:center;
}



/***************************************************************/

/************************* FOOTER (rodapé) *********************/
.font-footer{
	font-family: 'Titillium Web', sans-serif;
}

#position-elemento-prefooter{
	text-align:center;
}

.bgcolor-footer{
	/*background-color:rgb(34, 34, 34);*/
    background-color:#2A2730;
	color:#fff;
    margin-top:16px;
	/*padding-top:23px;*/
	/*padding-bottom:17px;*/
    text-align:center;
    position: static;
    margin-top: auto;
    padding: 1rem;
}

.footer-area-business{
	padding-top:30px;
	padding-bottom:15px;
	text-align:center;
}

.totais{
	text-align:center;
}

/***************************************************************/

/********************Administrator Area*************************/

.nav-side-menu {
  overflow: auto;
  font-family: verdana;
  font-size: 12px;
  font-weight: 200;
  background-color: #2e353d;
  position: fixed;
  top: 0px;
  width: 300px;
  height: 100%;
  color: #e1ffff;
}
.nav-side-menu .brand {
  background-color: #23282e;
  line-height: 50px;
  display: block;
  text-align: center;
  font-size: 14px;
}
.nav-side-menu .toggle-btn {
  display: none;
}
.nav-side-menu ul,
.nav-side-menu li {
  list-style: none;
  padding: 0px;
  margin: 0px;
  line-height: 35px;
  cursor: pointer;
  /*    
    .collapsed{
       .arrow:before{
                 font-family: FontAwesome;
                 content: "\f053";
                 display: inline-block;
                 padding-left:10px;
                 padding-right: 10px;
                 vertical-align: middle;
                 float:right;
            }
     }
*/
}
.nav-side-menu ul :not(collapsed) .arrow:before,
.nav-side-menu li :not(collapsed) .arrow:before {
  font-family: FontAwesome;
  content: "\f078";
  display: inline-block;
  padding-left: 10px;
  padding-right: 10px;
  vertical-align: middle;
  float: right;
}
.nav-side-menu ul .active,
.nav-side-menu li .active {
  border-left: 3px solid #d19b3d;
  background-color: #4f5b69;
}
.nav-side-menu ul .sub-menu li.active,
.nav-side-menu li .sub-menu li.active {
  color: #d19b3d;
}
.nav-side-menu ul .sub-menu li.active a,
.nav-side-menu li .sub-menu li.active a {
  color: #d19b3d;
}
.nav-side-menu ul .sub-menu li,
.nav-side-menu li .sub-menu li {
  background-color: #181c20;
  border: none;
  line-height: 28px;
  border-bottom: 1px solid #23282e;
  margin-left: 0px;
}
.nav-side-menu ul .sub-menu li:hover,
.nav-side-menu li .sub-menu li:hover {
  background-color: #020203;
}
.nav-side-menu ul .sub-menu li:before,
.nav-side-menu li .sub-menu li:before {
  font-family: FontAwesome;
  content: "\f105";
  display: inline-block;
  padding-left: 10px;
  padding-right: 10px;
  vertical-align: middle;
}
.nav-side-menu li {
  padding-left: 0px;
  border-left: 3px solid #2e353d;
  border-bottom: 1px solid #23282e;
}
.nav-side-menu li a {
  text-decoration: none;
  color: #e1ffff;
}
.nav-side-menu li a i {
  padding-left: 10px;
  width: 20px;
  padding-right: 20px;
}
.nav-side-menu li:hover {
  border-left: 3px solid #d19b3d;
  background-color: #4f5b69;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}
@media (max-width: 767px) {
  .nav-side-menu {
    position: relative;
    width: 100%;
    margin-bottom: 10px;
  }
  .nav-side-menu .toggle-btn {
    display: block;
    cursor: pointer;
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 10 !important;
    padding: 3px;
    background-color: #ffffff;
    color: #000;
    width: 40px;
    text-align: center;
  }
  .brand {
    text-align: left !important;
    font-size: 22px;
    padding-left: 20px;
    line-height: 50px !important;
  }
}
@media (min-width: 767px) {
  .nav-side-menu .menu-list .menu-content {
    display: block;
  }
}
body {
  margin: 0px;
  padding: 0px;
}
/**************************************************************************/

/****************************** Cadastro Credencial **********************/

.tipoPessoa {
    border:.5px solid #CCC;
    padding-top: 10px;
    height:75px;
}

#form-obrigatorio {
    color:red;
}

.imgTitulo {
    float:left;
    background-image: url(/Content/images/Contribuintes.jpg);
    background-repeat: no-repeat;
    width:420px;
    height:380px;
    border:1px #ccc solid;
    border-radius:20px;
    opacity:.5;
    margin-left:70px;
}

.imgTitulo:hover {
    opacity:1;
}

.txtcodigo {
    float:left;
    width:150px;
}

.rbFisica {
    float:left;
    padding-left:20px;
    margin-top:10px;
}

.rbJuridica {
    float:left;
    padding-left:20px;
    margin-top:10px;
}



#labelCodigo{
    float:left;
    margin-right: 21px;
}

#labelTipo{
    float:left;
    margin-right: 21px;
}

.txtNome {
    float:left;
}

.cmbSexo {
    float:left;
    padding-left:20px;
}
.txtCPF {
    float:left;
}

.txtRG {
    float:left;
    padding-left: 20px;
}

.txtCNPJ {
    float:left;
    padding-left: 20px;
}

.txtLogradouro {
    float:left;
}

.txtNumero {
    float:left;
    padding-left: 20px;
}

.txtComplemento {
    float:left;
    padding-left: 20px;
}


.txtUF {
    float:left;
}

.txtCidade {
    float:left;
    padding-left: 20px;
}

.txtBairro{
    float:left;
    margin-left: 0px;
    padding-left: 0px;
}

.txtCEP {
    float:left;
    padding-left: 20px;
}

.txtTelRes {
    float:left;
    padding-left: 20px;
}

.txtTelComer {
    float:left;
}

.txtCel {
    float:left;
    padding-left: 20px;
}

.txtEstadoCiv{
    float:left;
    padding-left: 20px;
}

.txtNacionalidade{
    float:left;
}

.txtEmail {
    float:left;
    padding-left: 16px;
}


.txtSenha {
    float: left;
}

.grupoSenha {
    border:1px;
    background-color:lightblue;
    height:200px;
}


.btForm {
    float:left;
}


/*FIM*/

/************************ GUIA DE ITBI *********************/

.imgTituloITBI {
    float:left;
    background-image: url(/Content/images/buy.jpg);
    background-repeat: no-repeat;
    width:420px;
    height:380px;
    border:1px #ccc solid;
    border-radius:20px;
    opacity:.5;
    margin-left:70px;
}

.imgTituloITBI:hover {
    opacity:1;
}

.cmbTipo {
    float:left;
}

.txtCodComprador {
    float:left;
}

.txtNomeComprador {
    float:left;
    padding-left: 15px;
}

.txtEndereco {
    float:left;
}

.txtNum {
    float:left;
    padding-left: 20px;
}

.txtBairro_Comprador {
    float:left;
}

.txtUF_Comprador {
    float:left;
    padding-left: 20px;
}

.txtCidade_Comprador {
    float:left;
    padding-left: 20px;
}

.txtCEP_Comprador {
    float:left;
}

.txtTelefone {
    float:left;
    padding-left: 20px;
}

.txtEmail_Comprador {
    float:left;
    padding-left: 20px;
}

.grupoComprador {
    width:555px;
    background-color: lightblue;
    padding: 5px 5px 5px 5px;
}

.txtCodVendedor{
    float:left;
}

.txtCodContribuinte{
    float:left;
    padding-left: 20px;
}

.txtNomeContribuinte{
    float:left;
    padding-left: 20px;
}

.txtCEP_Vendedor {
    float:left;
    padding-left: 20px;
}

.txtAreaAlqueires{
    float:left;
}
.txtCEP_Vendedor {
    float:left;
}

.txtAreaHectares {
    float:left;
    padding-left: 20px;
}

.txtIncra {
    float:left;
    padding-left: 20px;
}

.txtValorVenal {
    float:left;
    padding-left: 20px;
}

.txtAliquota {
    float:left;
    padding-left: 20px;
}

.cmbFinan {
    float:left;
}

.txtVencimento {
    float:left;
    padding-left: 20px;
}

.txtVrTransacao{
    float:left;
}

.txtFinanciado {
    float:left;
    padding-left: 18px;
}

.txtAliquota {
    float:left;
    padding-left: 18px;
}

.txtNaoFinanciado {
    float:left;
    padding-left: 18px;
}

.txtVrRecolher {
    float:left;
    padding-left: 18px;
}

.tipoA {
    border:.5px solid #CCC;
    padding-top: 10px;
    width:220px;
    height:85px;
    float:left;
}

.tipoB {
    border:.5px solid #CCC;
    padding-top: 10px;
    width:250px;
    height:85px;
    float:left;
    margin-left: 45px;
}
.tipoC {
    border:.5px solid #CCC;
    padding-top: 10px;
    width:350px;
    height:85px;
    float:left;
    margin-top:15px;
    margin-bottom:15px;
}

.rbParticular {
    float:left;
    padding-left:20px;
    margin-top:-10px;
}

.rbPublica {
    float:left;
    padding-left:20px;
    margin-top:-10px;
}

.rbSim {
    float:left;
    padding-left:60px;
    margin-top:-10px;
}

.rbNao {
    float:left;
    padding-left:40px;
    margin-top:-10px;
}

.txtMatricula {
    float:left;
    padding-left:20px;
}

.txtRegistro {
    float:left;
}

.txtDadosImovel {
    float:left;
}

/****************************/

/************ Credencial / Nota Eletronica ***************/


.espacoForm{
    margin-right:10px;
}

.alinharForm{
    /*float:left;*/
    display:inline-block;
}

/*.teste-gaspar{
    position:absolute;
    width:100%;
}*/

div.Clear{
    clear:both;
}

 ul { list-style-type: circle; }

/*#centro-credencial{
    text-align:center;
}*/

/************  ***************/


/************ Status para validação de senha ***************/
#status_user{
    font-size:11px;
}

.tes{
    margin-top:7px;
    text-align:center;
    margin-bottom:5px;
    color:#ffffff;
}


/************ CONFIG FORM HOLERITE ***************/
.config-form-holerite{
    display:inline-block;
    margin-left:7px;
}

.pesquisarHoleriteButton{
    margin-top:-2.5px;
}
.pesquisarHoleriteButton:hover{
    /*border:1px solid #159b29;
    color:#159b29;*/
    border:1px solid #147e24;
    color:#147e24;
    background-color:#FFFFFF;
}

/* Configurações de cor para o botão SAIR */
a.alterarSenhaButton {
    border: 1px solid #000000;
    color: #000000;
}
    a.alterarSenhaButton:hover {
        border: 1px solid #d19b3d;
        color: #d19b3d;
    }
a.logoutHoleriteButton{
    border:1px solid #a80101;
    color:#a80101;
}
a.logoutHoleriteButton:hover{
    border:1px solid #d40202;
    color:#d40202;
}
a.logoutHoleriteButton:focus{
    border:1px solid #d40202;
    color:#d40202;
}
a.logoutHoleriteButton:active{
    border:1px solid #d40202;
    color:#d40202;
}
a.logoutHoleriteButton:active:hover{
    border:1px solid #a80101;
    color:#a80101;
}
/************ FIM ***************/

.img-footer-busines{
    text-align:center;
    background-image: url("images/bwcontorno-64x63.png");
    width:64px;
    height:63px;
}
.img-footer-busines:hover{
    text-align:center;
    background-image: url("images/bwcontornoblue-64x63.png");
    width:64px;
    height:63px;
}
.ass-busines:hover{
    color:#2098d1;
}



/************ EFEITO APLICADO PARA CARREGAR PAGINAS ***************/
/************ APLICADO NA LOGIN ***************/

/* Center the loader */
/*#loader {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
  width: 70px;
  height: 70px;
  margin: -75px 0 0 -75px;
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 120px;
  height: 120px;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}*/

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Add animation to "page content" */
.animate-bottom {
  position: relative;
  -webkit-animation-name: animatebottom;
  -webkit-animation-duration: 1s;
  animation-name: animatebottom;
  animation-duration: 1s
}

@-webkit-keyframes animatebottom {
  from { bottom:-100px; opacity:0 } 
  to { bottom:0px; opacity:1 }
}

@keyframes animatebottom { 
  from{ bottom:-100px; opacity:0 } 
  to{ bottom:0; opacity:1 }
}

#myDiv {
  display: none;
  /*text-align: center;*/
}

/************ FIM ***************/


/************ CONFIGURAÇÃO DE PRE-LOADER ***************/

img#logo{
    display: none;
    text-align:center;
}

img#loginwait{
    display: none;
    text-align: center;
}

/************ FIM ***************/

#campos-obrigatorios-holerite{
    color:#CFCFCF;
    font-size:11px;
}


.obrigatoriedade-form{
    color:#a80101;
}



/*Utilizando Efeito WebKit param tremer o modal com bootbox.js - o alert invoca essa classe chamada bb-alternate-modal
    e a partir da classe o webkit executa o efeito através da palavra treme definida em animation
*/

.modal.bb-alternate-modal {
    animation: treme 0.1s;
    animation-iteration-count: 8;
}

/*@keyframes treme {
  0% {margin-left: 0;}
  25% {margin-left: 5px;}
  50% {margin-left: 0;}
  75% {margin-left: -5px;}
  100% {margin-left: 0;}
}*/

@-webkit-keyframes treme {
    0% {
        -webkit-transform: translate(2px, 1px) rotate(0deg);
    }

    10% {
        -webkit-transform: translate(-1px, -2px) rotate(-1deg);
    }

    20% {
        -webkit-transform: translate(-3px, 0px) rotate(1deg);
    }

    30% {
        -webkit-transform: translate(0px, 2px) rotate(0deg);
    }

    40% {
        -webkit-transform: translate(1px, -1px) rotate(1deg);
    }

    50% {
        -webkit-transform: translate(-1px, 2px) rotate(-1deg);
    }

    60% {
        -webkit-transform: translate(-3px, 1px) rotate(0deg);
    }

    70% {
        -webkit-transform: translate(2px, 1px) rotate(-1deg);
    }

    80% {
        -webkit-transform: translate(-1px, -1px) rotate(1deg);
    }

    90% {
        -webkit-transform: translate(2px, 2px) rotate(0deg);
    }

    100% {
        -webkit-transform: translate(1px, -2px) rotate(-1deg);
    }
}
/*
    FIM
*/

#centraliza-cpf {
    text-align: center;
    margin-bottom:-10px;
}

#posicao-alteracao-senha {
    text-align: center;
    font-family: 'Exo 2', sans-serif;
}

#subtituloAlterarSenha {
    margin-bottom:-10px;
}

#divUsuarioCPF {
    display: inline-block;
}
#divSenhaAtual {
    display: inline-block;
}
#divNovaSenha {
    display: inline-block;
}
#divConfirmacaoNovaSenha {
    display: inline-block;
}
#divEnviarButton {
    display: inline-block;
}
#divCancelarButton {
    display: inline-block;
}

#usuarioCPF {
    width: 100%;
}
#senhaAtual{
    width:100%;
}
#novaSenha {
    width: 100%;
}
#confirmacaoNovaSenha {
    width: 100%;
}
#inputNovaSenhaButton {
    width: 150px;
    border: 1px solid #147e24;
    color: #137e24;
}
#inputCancelarButton {
    width: 147px;
    border:1px solid #a80101;
    color:#a80101;
}
#posicao-form-alterarSenha{
    text-align:center;
}

#posiciona-botoes{
    text-align:center;
}
#status-alterarSenha{
    text-align:center;
}

/* Menu - Informações de Usuário - versão 2.0 */
.configElement {
    height: 28px;
    padding-top: 2px;
    margin-top: 15px;
    font-family: 'Titillium Web', sans-serif;
    color: #2A2730;
}
.liConfigElement {
    font-family: 'Titillium Web', sans-serif;
    margin-left:-10px;
    margin-right:-10px;
}
.aCConfigElement {
    color: #2A2730;
}
    .aCConfigElement:hover {
        color: #337AB7;
    }

.aCSairConfigElement {
    color: #2A2730;
}
    .aCSairConfigElement:hover {
        color: #E81123;
    }

/* Navegação principal e identificação do usuário */
.portal-main-nav > li > a {
    align-items: center;
    color: #42536a !important;
    display: flex;
    font-weight: 500;
    gap: 9px;
    min-height: 50px;
}

.portal-nav-icon {
    color: #315f9f;
    font-size: 17px;
    min-width: 18px;
    text-align: center;
}

.portal-main-nav > li > a:hover,
.portal-main-nav > li > a:focus {
    background: #f1f5fa !important;
    color: #244f89 !important;
}

.user-summary-nav {
    align-items: center;
    display: flex;
}

.user-summary-nav > li {
    align-items: center;
    display: flex;
    min-height: 50px;
    position: relative;
}

.user-summary-nav > li + li::before {
    background: #d9e0e8;
    content: "";
    height: 22px;
    left: 0;
    position: absolute;
    top: 14px;
    width: 1px;
}

.portal-user-meta > span,
.portal-user-action > a {
    align-items: center;
    color: #34445a;
    display: flex;
    font-family: 'Titillium Web', sans-serif;
    font-size: 14px;
    gap: 8px;
    line-height: 1.25;
    padding: 10px 12px;
}

.portal-user-meta:first-child > span {
    max-width: 450px;
}

.portal-user-icon {
    color: #315f9f;
    flex: 0 0 auto;
    font-size: 16px;
    min-width: 17px;
    text-align: center;
}

.portal-user-action > a:hover,
.portal-user-action > a:focus {
    background: #f1f5fa !important;
    color: #244f89 !important;
    text-decoration: none;
}

.portal-logout > a:hover,
.portal-logout > a:focus,
.portal-logout > a:hover .portal-user-icon,
.portal-logout > a:focus .portal-user-icon {
    color: #b3261e !important;
}



/*IMPOSTO DE RENDA*/
#obrigatoriedade-income {
    color: #cfdbea;
    font-size: 12px;
}

.income-tax-filter-grid {
    align-items: end;
    display: grid;
    grid-template-columns: minmax(260px, 40fr) minmax(100px, 15fr) minmax(128px, 15fr) minmax(0, 30fr);
    column-gap: 12px;
    row-gap: 16px;
}

.income-tax-filter-grid > .config-form-holerite:nth-child(1) { grid-column: 1; }
.income-tax-filter-grid > .config-form-holerite:nth-child(2) { grid-column: 2; }
.income-tax-filter-grid > .config-form-holerite:nth-child(3) { grid-column: 3; }

.income-tax-print-action .btn {
    height: 34px;
    min-height: 34px;
    width: 100%;
}

@media (max-width: 899px) {
    .income-tax-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .income-tax-filter-grid > .config-form-holerite:nth-child(1) { grid-column: 1; }
    .income-tax-filter-grid > .config-form-holerite:nth-child(2) { grid-column: 2; }
    .income-tax-filter-grid > .config-form-holerite:nth-child(3) { grid-column: 1 / -1; }

    .income-tax-print-action .btn {
        height: 44px;
        min-height: 44px;
    }
}

@media (max-width: 767px) {
    #obrigatoriedade-income {
        display: block;
        margin-top: 2px;
    }

    .income-tax-filter-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .income-tax-filter-grid > .config-form-holerite:nth-child(n) {
        grid-column: 1;
    }
}
/*FIM*/

/* Consulta de holerites - layout responsivo */
.body-content {
    flex: 1 0 auto;
    min-width: 0;
}

.portal-footer {
    box-sizing: border-box;
    flex-shrink: 0;
    padding-bottom: 8px;
    padding-top: 8px;
    width: auto;
}

.portal-footer .img-footer-busines {
    background-size: 48px 47px;
    height: 47px;
    margin: 0 auto;
    width: 48px;
}

.holerite-page {
    color: #263247;
    font-family: 'Titillium Web', sans-serif;
    max-width: 1200px;
    padding-bottom: 24px;
}

.holerite-breadcrumb {
    font-size: 15px;
    margin-bottom: 18px;
}

.holerite-filter-panel {
    border-color: #2d5795;
    box-shadow: 0 5px 18px rgba(45, 69, 122, .08);
}

.holerite-filter-panel > .panel-heading {
    background: #2d5795;
    border-color: #2d5795;
    font-size: 16px;
    font-weight: 600;
    padding: 12px 16px;
}

.holerite-filter-grid {
    display: grid;
    grid-template-columns: minmax(0, 30fr) minmax(88px, 10fr) minmax(88px, 10fr) minmax(0, 35fr) minmax(128px, 15fr);
    column-gap: 12px;
    row-gap: 16px;
    align-items: end;
}

.holerite-filter-grid > .config-form-holerite:nth-child(1) { grid-column: 1; }
.holerite-filter-grid > .config-form-holerite:nth-child(2) { grid-column: 2; }
.holerite-filter-grid > .config-form-holerite:nth-child(3) { grid-column: 3; }
.holerite-filter-grid > .config-form-holerite:nth-child(4) { grid-column: 4; }
.holerite-filter-grid > .config-form-holerite:nth-child(5) { grid-column: 5; }

.config-form-holerite {
    display: block;
    margin: 0;
    min-width: 0;
}

.config-form-holerite label {
    display: block;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 6px;
}

.config-form-holerite .form-control {
    font-size: 15px;
    width: 100%;
}

.holerite-search-action .btn {
    height: 34px;
    min-height: 34px;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
}

.pesquisarHoleriteButton {
    margin-top: 0;
}

.holerite-loader {
    min-height: 20px;
    text-align: center;
}

.holerite-results-heading {
    align-items: center;
    background: #edf4fc;
    border-left: 4px solid #2d5795;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin: 18px 0 14px;
    padding: 13px 16px;
}

.holerite-results-kicker {
    color: #52637d;
    display: block;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.holerite-results-heading h1 {
    color: #203e72;
    font-size: 21px;
    font-weight: 600;
    line-height: 1.25;
    margin: 2px 0 0;
}

.holerite-results-count {
    color: #52637d;
    font-size: 14px;
    white-space: nowrap;
}

.holerite-results {
    max-width: 100%;
}

.holerite-table {
    background: #fff;
    font-size: 15px;
    margin-bottom: 0;
    table-layout: auto;
    width: 100%;
}

.holerite-table th {
    background: #f2f5f9;
    border-bottom: 2px solid #2d5795 !important;
    color: #203e72;
    font-size: 14px;
    font-weight: 700;
    padding: 11px 12px !important;
    text-align: left;
}

.holerite-table td {
    padding: 10px 12px !important;
    text-align: left;
    vertical-align: middle !important;
    overflow-wrap: anywhere;
}

.holerite-table.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #fff;
}

.holerite-table.table-striped > tbody > tr:nth-of-type(even) {
    background-color: #edf1f5;
}

.holerite-table.table-striped > tbody > tr:hover {
    background-color: #dfe9f5;
}

.holerite-print-heading,
.holerite-print-cell {
    text-align: center !important;
    width: 76px;
}

.holerite-print-link {
    align-items: center;
    border: 1px solid transparent;
    border-radius: 6px;
    display: inline-flex;
    height: 44px;
    justify-content: center;
    transition: background-color .2s, border-color .2s, box-shadow .2s;
    width: 44px;
}

.holerite-print-link:hover,
.holerite-print-link:focus {
    background: #eaf2fb;
    border-color: #8eacd2;
    box-shadow: 0 0 0 3px rgba(45, 87, 149, .15);
    outline: none;
}

.holerite-empty {
    color: #66758b;
    padding: 28px 16px !important;
    text-align: center !important;
}

.holerite-modal-container,
.holerite-alert-item {
    max-width: 100%;
    width: 100%;
}

.holerite-alert-item {
    border: 0;
    margin-top: 10px;
}

.navbar-nav > li > a,
.configElement,
.liConfigElement {
    font-size: 14px;
}

.portal-footer-copy {
    color: #fff;
    font-family: 'Titillium Web', sans-serif;
    font-size: 13px;
    line-height: 1.5;
    margin: 4px 0 0;
    padding-bottom: 2px;
}

.income-tax-feedback {
    font-size: 15px;
    margin-top: 16px;
}

.portal-footer-copy a {
    color: #fff;
    text-decoration: none;
}

.portal-version {
    white-space: nowrap;
}

/* Login - cartão de acesso responsivo */
.login-page {
    align-items: center;
    display: flex;
    justify-content: center;
    min-height: 520px;
    padding: 38px 20px 52px;
}

.login-panel {
    background: #fff;
    border: 1px solid #d7e0ed;
    border-radius: 6px;
    box-shadow: 0 12px 32px rgba(34, 58, 103, .12);
    overflow: hidden;
    width: min(100%, 440px);
}

.login-panel-header {
    align-items: center;
    background: #315f9f;
    color: #fff;
    display: flex;
    gap: 16px;
    padding: 24px 28px;
}

.login-panel-icon {
    align-items: center;
    background: rgba(255, 255, 255, .14);
    border-radius: 50%;
    display: flex;
    flex: 0 0 48px;
    font-size: 22px;
    height: 48px;
    justify-content: center;
}

.login-panel-header h1 {
    color: #fff;
    font-family: 'Titillium Web', sans-serif;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.2;
    margin: 0 0 3px;
}

.login-panel-header p {
    color: #eaf2fc;
    font-size: 15px;
    line-height: 1.4;
    margin: 0;
}

.login-form {
    padding: 28px;
}

.login-alert {
    align-items: flex-start;
    background: #fff2f1;
    border: 1px solid #efc3bf;
    border-radius: 4px;
    color: #a1261d;
    display: flex;
    font-size: 14px;
    gap: 9px;
    line-height: 1.45;
    margin-bottom: 22px;
    padding: 11px 13px;
}

.login-alert .glyphicon {
    margin-top: 3px;
}

.login-field {
    margin-bottom: 20px;
}

.login-field label {
    color: #24364f;
    display: block;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 7px;
}

.required-mark {
    color: #c62828;
}

.login-input-wrap {
    position: relative;
}

.login-input-wrap > .glyphicon {
    color: #68778a;
    font-size: 16px;
    left: 14px;
    pointer-events: none;
    position: absolute;
    top: 15px;
    z-index: 1;
}

.login-input-wrap input[type="text"],
.login-input-wrap input[type="password"] {
    border: 1px solid #b9c4d2;
    border-radius: 4px;
    box-sizing: border-box;
    color: #233247;
    font-size: 16px;
    height: 46px;
    padding: 9px 13px 9px 42px;
    transition: border-color .15s ease, box-shadow .15s ease;
    width: 100%;
}

.login-input-wrap input:focus {
    border-color: #315f9f;
    box-shadow: 0 0 0 3px rgba(49, 95, 159, .16);
    outline: 0;
}

.login-field-help {
    color: #667487;
    display: block;
    font-size: 13px;
    margin-top: 6px;
}

.login-submit {
    align-items: center;
    background: #315f9f;
    border: 1px solid #294f86;
    border-radius: 4px;
    color: #fff;
    display: flex;
    font-size: 16px;
    font-weight: 600;
    height: 46px;
    justify-content: center;
    margin-top: 6px;
    width: 100%;
}

.login-submit:hover,
.login-submit:focus {
    background: #274f87;
    color: #fff;
}

.login-submit:focus {
    box-shadow: 0 0 0 3px rgba(49, 95, 159, .22);
    outline: 0;
}

.login-submit:disabled {
    cursor: wait;
    opacity: .78;
}

.login-loading {
    align-items: center;
    display: none;
    gap: 9px;
}

.login-spinner {
    animation: login-spin .7s linear infinite;
    border: 2px solid rgba(255, 255, 255, .38);
    border-radius: 50%;
    border-top-color: #fff;
    height: 18px;
    width: 18px;
}

.login-form.is-loading .login-submit-label {
    display: none;
}

.login-form.is-loading .login-loading {
    display: inline-flex;
}

@keyframes login-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .login-spinner {
        animation-duration: 1.4s;
    }
}

/* Alteração de senha - mesmo padrão visual do login */
.password-page {
    align-items: center;
    display: flex;
    justify-content: center;
    min-height: 610px;
    padding: 36px 20px 50px;
}

.password-panel {
    background: #fff;
    border: 1px solid #d7e0ed;
    border-radius: 6px;
    box-shadow: 0 12px 32px rgba(34, 58, 103, .12);
    overflow: hidden;
    width: min(100%, 520px);
}

.password-panel-header {
    align-items: center;
    background: #315f9f;
    color: #fff;
    display: flex;
    gap: 16px;
    padding: 23px 28px;
}

.password-panel-icon {
    align-items: center;
    background: rgba(255, 255, 255, .14);
    border-radius: 50%;
    display: flex;
    flex: 0 0 48px;
    font-size: 21px;
    height: 48px;
    justify-content: center;
}

.password-panel-header h1 {
    color: #fff;
    font-family: 'Titillium Web', sans-serif;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.2;
    margin: 0 0 3px;
}

.password-panel-header p {
    color: #eaf2fc;
    font-size: 15px;
    line-height: 1.4;
    margin: 0;
}

.password-form {
    padding: 27px 28px 30px;
}

.password-field {
    margin-bottom: 18px;
}

.password-field label {
    color: #24364f;
    display: block;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 7px;
}

.password-input-wrap {
    position: relative;
}

.password-input-wrap > .glyphicon {
    color: #68778a;
    font-size: 16px;
    left: 14px;
    pointer-events: none;
    position: absolute;
    top: 15px;
    z-index: 1;
}

.password-input-wrap input {
    border: 1px solid #b9c4d2;
    border-radius: 4px;
    box-sizing: border-box;
    color: #233247;
    font-size: 16px;
    height: 46px;
    padding: 9px 13px 9px 42px;
    transition: border-color .15s ease, box-shadow .15s ease;
    width: 100%;
}

.password-input-wrap input:focus {
    border-color: #315f9f;
    box-shadow: 0 0 0 3px rgba(49, 95, 159, .16);
    outline: 0;
}

.password-input-wrap input[aria-invalid="true"] {
    border-color: #b3261e;
    box-shadow: 0 0 0 3px rgba(179, 38, 30, .12);
}

.password-input-wrap.is-readonly input {
    background: #f2f5f8;
    color: #516071;
    cursor: not-allowed;
}

.password-validation {
    color: #a1261d;
    font-size: 13px;
    line-height: 1.4;
    min-height: 18px;
    padding-top: 5px;
}

.password-actions {
    display: grid;
    gap: 12px;
    grid-template-columns: 1fr 1.35fr;
    margin-top: 4px;
}

.password-cancel,
.password-submit,
.password-result-button {
    align-items: center;
    border-radius: 4px;
    display: flex;
    font-size: 16px;
    font-weight: 600;
    height: 46px;
    justify-content: center;
}

.password-cancel {
    background: #fff;
    border: 1px solid #9ba8b8;
    color: #394a60;
}

.password-cancel:hover,
.password-cancel:focus {
    background: #f3f6f9;
    border-color: #68778a;
    color: #24364f;
}

.password-submit,
.password-result-button {
    background: #315f9f;
    border: 1px solid #294f86;
    color: #fff;
}

.password-submit:hover,
.password-submit:focus,
.password-result-button:hover,
.password-result-button:focus {
    background: #274f87;
    color: #fff;
}

.password-submit:disabled {
    cursor: wait;
    opacity: .78;
}

.password-loading {
    align-items: center;
    display: none;
    gap: 9px;
}

.password-form.is-loading .password-submit-label {
    display: none;
}

.password-form.is-loading .password-loading {
    display: inline-flex;
}

.password-result {
    padding: 38px 32px 36px;
    text-align: center;
}

.password-result-icon {
    align-items: center;
    border-radius: 50%;
    display: flex;
    font-size: 23px;
    height: 58px;
    justify-content: center;
    margin: 0 auto 16px;
    width: 58px;
}

.password-result-icon.is-success {
    background: #e7f6ec;
    color: #237a3b;
}

.password-result-icon.is-error {
    background: #fff0ef;
    color: #a1261d;
}

.password-result h2 {
    color: #24364f;
    font-size: 22px;
    font-weight: 600;
    margin: 0 0 9px;
}

.password-result p {
    color: #5a687a;
    font-size: 15px;
    line-height: 1.5;
    margin: 0 0 24px;
}

.password-result-button {
    margin: 0 auto;
    max-width: 250px;
}

@media (max-width: 767px) {
    .password-page {
        align-items: flex-start;
        min-height: 0;
        padding: 24px 14px 36px;
    }

    .password-panel-header {
        padding: 20px;
    }

    .password-panel-header h1 {
        font-size: 21px;
    }

    .password-panel-header p {
        font-size: 14px;
    }

    .password-form {
        padding: 22px 20px 24px;
    }

    .password-actions {
        grid-template-columns: 1fr;
    }

    .password-submit {
        grid-row: 1;
    }
}

@media (max-width: 767px) {
    .login-page {
        align-items: flex-start;
        min-height: 0;
        padding: 24px 14px 36px;
    }

    .login-panel-header {
        padding: 20px;
    }

    .login-panel-header h1 {
        font-size: 21px;
    }

    .login-panel-header p {
        font-size: 14px;
    }

    .login-form {
        padding: 22px 20px 24px;
    }
}

@media (max-width: 899px) {
    .holerite-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .holerite-search-action {
        grid-column: 1 / -1;
    }

    .holerite-filter-grid > .config-form-holerite:nth-child(1),
    .holerite-filter-grid > .config-form-holerite:nth-child(3) {
        grid-column: 1;
    }

    .holerite-filter-grid > .config-form-holerite:nth-child(2),
    .holerite-filter-grid > .config-form-holerite:nth-child(4) {
        grid-column: 2;
    }

    .holerite-filter-grid > .config-form-holerite:nth-child(5) {
        grid-column: 1 / -1;
    }

    .holerite-search-action .btn {
        height: 44px;
        min-height: 44px;
        min-width: 160px;
    }

    .user-summary-nav {
        float: none !important;
        margin: 0;
    }

    .configElement,
    .liConfigElement {
        margin-left: 0;
        margin-right: 0;
    }
}

@media (max-width: 767px) {
    .portal-main-nav > li > a {
        min-height: 44px;
    }

    .user-summary-nav {
        align-items: stretch;
        display: block;
    }

    .user-summary-nav > li {
        display: block;
        min-height: 0;
    }

    .user-summary-nav > li + li::before {
        content: none;
    }

    .portal-user-meta > span,
    .portal-user-action > a {
        min-height: 44px;
        padding: 11px 15px;
    }

    .portal-user-meta:first-child > span {
        max-width: none;
        overflow-wrap: anywhere;
    }

    .holerite-page {
        padding-left: 14px;
        padding-right: 14px;
        width: 100%;
    }

    .holerite-filter-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 14px;
    }

    .holerite-search-action {
        grid-column: auto;
    }

    .holerite-filter-grid > .config-form-holerite:nth-child(n) {
        grid-column: 1;
    }

    .holerite-search-action .btn {
        width: 100%;
    }

    #campos-obrigatorios-holerite {
        display: block;
        font-size: 12px;
        margin-top: 2px;
    }

    .holerite-results-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }

    .holerite-results-heading h1 {
        font-size: 19px;
    }

    .holerite-results-count {
        white-space: normal;
    }

    .holerite-table,
    .holerite-table tbody,
    .holerite-table tr,
    .holerite-table td {
        display: block;
        width: 100%;
    }

    .holerite-table thead {
        clip: rect(0 0 0 0);
        clip-path: inset(50%);
        height: 1px;
        overflow: hidden;
        position: absolute;
        white-space: nowrap;
        width: 1px;
    }

    .holerite-table tr {
        border: 1px solid #dbe3ee;
        border-radius: 8px;
        box-shadow: 0 3px 12px rgba(40, 62, 99, .07);
        margin-bottom: 12px;
        overflow: hidden;
    }

    .holerite-table.table-striped > tbody > tr:nth-of-type(odd) {
        background-color: #fff;
    }

    .holerite-table.table-striped > tbody > tr:nth-of-type(even) {
        background-color: #f1f4f7;
    }

    .holerite-table td {
        align-items: flex-start;
        border-top: 1px solid #edf0f4 !important;
        display: grid;
        grid-template-columns: minmax(92px, 36%) minmax(0, 1fr);
        gap: 12px;
        padding: 10px 12px !important;
    }

    .holerite-table td::before {
        color: #52637d;
        content: attr(data-label);
        font-size: 13px;
        font-weight: 700;
    }

    .holerite-print-cell {
        align-items: center !important;
        text-align: left !important;
    }

    .holerite-empty {
        display: block !important;
    }

    .holerite-empty::before {
        content: none !important;
    }

    .navbar-nav > li > a,
    .configElement,
    .liConfigElement {
        font-size: 15px;
    }

    .configElement {
        height: auto;
        margin: 0;
        padding: 10px 15px;
    }

    .configElement p {
        margin: 0;
        overflow-wrap: anywhere;
    }

    .portal-footer-copy {
        font-size: 12px;
        padding: 0 8px;
    }
}
