/*-------------------------------------------------------------------------------

	HOME

	Data:				09/09/2010
	Descricao:			Arquivo com regras e componentes específicos desta seção
	Autor:				Johny Krauss
	E-mail: 			johny@gadbrivia.com.br
	
	Observacoes:		Nenhuma observação 

	Documentos:			login.html

-------------------------------------------------------------------------------*/

/*--- TEMPLATE ---*/
#conteudo{
	margin:0 auto 50px;
	width: 1000px;
}

#pagina #conteudo .principal{
	width:710px!important;
	float:left;
/*	height:395px!important;
	min-height:395px;
	*min-height:425px;		*/
        height: auto;
}

/*--- LOGO ---*/
#logo{
	width:203px;
	height:76px;
	z-index:100;
	float:left;
	margin:0px;
	border-right: 1px solid #D8D8D8;
	padding-right: 10px;
}
#logo a, #logo1 a, #logo2a {background:url(../../img/logo-login.jpg?version=1) no-repeat 0 top; width:203px;	height:76px;}
.contraste #logo a{background:url(../../img/logo-login.jpg?version=1) no-repeat 0 bottom !important;}

#logo1{
	width:203px;
	height:76px;
	z-index:100;
	float:left;
	margin:0px;
	width:96px; 
	margin-left:1px;
	border-right: 1px solid #D8D8D8;
	padding-right: 15px;
	background: url("../../img/internet.png?version=2") no-repeat scroll 0 center transparent !important;
}
.contraste #logo1 {
    background: url("../../img/internetContraste.png") no-repeat scroll 0 center transparent !important;
}

#logo2{
	width:203px;
	height:76px;
	z-index:100;
	float:left;
	margin:0px;
	margin-left: 10px;
	border-right: 1px solid #D8D8D8;
	padding-right: 10px;
	margin-left:10px;
}

/*--- TOPO ---*/
#conteudo .topo{
	width:1000px;
	overflow:hidden;
	margin-bottom:20px;
}
#conteudo .topo .anuncio{
	clear:both;
	display:block;
	padding:0 0 0;
}
#conteudo .topo .anuncio img{padding:0px;}

/*--- CONTEUDO ---*/
.corner-bt-top-left,
.corner-bt-top-right,
.corner-bt-bottom-right,
.corner-bt-bottom-left{
	background-image:url(../../img/corner-bt-login.png);
}
.lk-acessar .corner-top-left,
.lk-acessar .corner-top-right,
.lk-acessar .corner-bottom-right,
.lk-acessar .corner-bottom-left{
	background-image:url(../../img/corner-logar.png);
}

#conteudo .principal h2{
	margin-bottom:19px;
}
#conteudo .principal .identificacaoLogin{
	width:675px;
	position:relative;
	float:left;
	border:1px solid #E6E6E6;
	padding:24px;
	min-height:204px;
	*min-height:200px;
	margin-right:20px;
	
	_height: 200px;
}

.dadosAcesso li strong{
	float:left;
	clear:both;
	width:135px;	
}


.dadosAcesso li{
	width:300px;
	height:30px;
	float:left;	
}

#conteudo .principal .identificacaoLogin a{
	color: #666666;
    font: 12px Arial,Helvetica,sans-serif;	
}
.contraste #conteudo .principal .identificacao{border:1px solid #333333;}
#conteudo .principal .identificacao li, .identificacaoLogin li{
	margin-bottom:10px;
	font-size:0.75em;
	color:#666666;
	font-family:Arial, Helvetica, sans-serif;
}
.contraste #conteudo .principal .identificacao li
{
	color:#FFFFFF;
}

.login-buttons--container {
	display: flex;
	justify-content: space-between;
	margin-top: 56px;
}

.pre-auth--container {
	margin-left: 24px;
	margin-top: 24px;
}

.informe-senha--container {
	box-sizing: border-box;
	display: flex;
	padding: 24px;
	width: 350px;
	min-height: 472px;
	background: #FFFFFF;
	border: 1px solid #CDD3CD;
	border-radius: 8px;
	flex: none;
	order: 1;
	align-self: stretch;
	flex-grow: 0;
	
	h2 {
		width: 312px;
		height: 28px;
		font-family: 'Helvetica';
		font-style: normal;
		font-weight: 700;
		font-size: 24px;
		line-height: 28px;
		display: flex;
		justify-content: center;
	}

	label {
		width: 250px;
		height: 32px;
		font-family: 'Helvetica' !important;
		font-style: normal;
		font-weight: 400;
		font-size: 14px !important;
		line-height: 16px;
		color: #333333 !important;
		flex: none;
		order: 0;
		flex-grow: 0;
	}

	img {
		margin-left: 24px !important;
	}

	.ml-20 {
		margin-left: 20px;
	}
	.ml-10 {
		margin-left: 10px;
	}
	.input-senha {
		margin-top: -18px;
    	margin-left: 28px;
	}
}

.selecione-usuario--container {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 24px;
	gap: 32px;
	width: 350px;
	min-height: 472px;
	background: #FFFFFF;
	border: 1px solid #CDD3CD;
	border-radius: 8px;

	h2 {
		width: 312px;
		height: 56px;
		font-family: 'Helvetica';
		font-style: normal;
		font-weight: 700;
		font-size: 24px;
		line-height: 28px;
		flex: none;
		order: 0;
		flex-grow: 0;
	}

	h3 {
		height: 32px;
		width: 297px;
		font-family: 'Helvetica';
		font-style: normal;
		font-weight: 400;
		font-size: 14px;
		line-height: 16px;
		color: #333333;
		flex: none;
		flex-grow: 0;
		margin-bottom: 24px;
	}

	.usuarios-secundarios__title {
		width: 150px;
		height: 18px;
		font-family: 'Helvetica';
		font-style: normal;
		font-weight: 700;
		font-size: 16px;
		line-height: 18px;
		order: 0;
		flex-grow: 0;
	}
}

#conteudo .principal .acesso{
	height: 472px;
	background: #FFFFFF;
	border: 1px solid #CDD3CD;
	border-radius: 8px;
}

.bg-primary800 {
    background: #26610A !important;
}

.font-primary800 {
    color: #26610A !important;
}

.contraste #conteudo .principal .acesso{
	background:#333;
}

#conteudo .principal .lista-login{
	float:left;
	width:150px;
}
#conteudo .principal .lista-login input{
	background:url("../../img/bg-select-topo.gif") repeat-x scroll 0 0 transparent;
	border:1px solid #DDDDDD;
	color:#999999;
	float:left;
	font:0.7em Arial,Helvetica,sans-serif;
	height:1.6em;
	padding:2px 5px;
	width:60px;
	margin-left: 85px;
	*margin-left: 55px;
	text-align: center;
}
.contraste #conteudo .principal .lista-login input{
	background:#FFF;
	color:#000;
}
#conteudo .principal .lista-botoes{
	float:right;
	width:176px;
	*margin-left: 20px;
}
#conteudo .principal .lista-botoes label{
	font-size:0.6em;
	margin-bottom:10px;
}


#conteudo .principal .lista-login li{
	clear:both;
	height:41px;
	margin-bottom:9px;
	*margin-bottom:8px;
	position:relative;
}
#conteudo .principal .lista-login li .icon{
	right:-20px;
	top:19px;
	display:none;
}
#conteudo .principal .lista-login li .icon.ativo{display:block;}


.icon-seta-login{
	width:10px;
	height:20px;
	position:absolute;
	left:-10px;
	top:11px;
}

.login-erro{
	position:absolute;
	width:210px;
	min-height:55px;
	_height:55px;
	padding:10px;
	border:1px solid #E6A500;
	right:50px;
	top:265px;
	display:none;
	font-family:Arial, Helvetica, sans-serif;
	z-index:100000;
	background:#FFFFFF;
	*background:url(../../img/bg-b.gif) repeat !important;
}
.login-erro.ativo{display:block;}
.login-erro h3{
	color:#333333!important;
	font-weight:bold;
	font-size:14px;
	line-height:120%;
	margin-bottom:10px;
}
.login-erro li{color:#333333;font-size:12px;}
.contraste .login-erro{
	border:1px solid #FFF600;
	background:#000000;
	*background:url(../../img/bg-p.gif) repeat !important;
}


.contraste .login-erro h3, .contraste .login-erro li{color:#FFF;}

#conteudo .principal .lista-login .ultimo{margin-bottom:0px; height:54px;}
#conteudo .principal .lista-login .ultimo label{font-size:0.65em;}
#conteudo .principal h3 {
	color:#333333;
	font-size:14px;
	display:block;
	clear:both;
	margin-bottom:24px;
}
#conteudo .principal label{
	color:#666666;
	font-size:0.7em;
	display:block;
	clear:both;
	margin-bottom:3px;
	font-family:Arial, Helvetica, sans-serif;
}
.contraste #conteudo .principal label{color:#FFFFFF;}

#conteudo .principal .lista-botoes ul .bt-borda a{
	padding:4px 10px;
	display:block;
	width:30px;
	font:0.8em Arial Narrow, Helvetica, sans-serif;
}

#conteudo .principal form{
	display:block;
	overflow:hidden;
	padding-bottom:13px;
	margin-bottom:20px;
	border-bottom:1px solid #ACD0BA;
	
	width:350px;
	min-height:40px;

}

#conteudo .principal form#secureForm{
    	width:auto!important;
}

.fixFont{
	font-size: 1em!important;
	color: #666666!important;	
}

.contraste #conteudo .principal form{
	border-bottom:1px solid #FFF;
}

#conteudo .principal .lista-botoes ul li{
	margin:1px 8px 5px 0;
	padding:0px;
	clear:none;
	float:left;
}
#conteudo .principal .lista-botoes ul .ultimo{margin:1px 0 0 0;}

.contraste .lista-login input{color:#000000;}


#conteudo .principal .lk-acessar{float:right;}
#conteudo .principal .lk-acessar a{
	float:left;
	font-size:16px;
	height:35px;
	line-height:35px;
	padding:0 10px 0 35px;
}

.contraste .ib-version .span-version{
	float: right;
	font-size: 8px;
	color: black;
	margin-top: 235px;
}

.ib-version .span-version{
	float: right;
	font-size: 8px;
	color: #FFdddd;
	margin-top: 235px;
}



.listaSenha li{
	height: auto;
    margin-bottom: 5px!important;
    margin-right: 11px!important;
    width: 26px;
    float: left;
    margin: 0 55px 13px 0;
    max-width: 287px;
    position: relative;
    clear: none;
    padding: 0;
}

.corner-bt-comp{
	height: 23px;
	border: 1px solid #666666;
    float: left;
    position: relative;	
}

.corner-bt-comp a:hover{
	color:#FFFFFF!important;	
}

.corner-bt-comp :hover{
	background: none repeat scroll 0 0 #666666;	
}

.corner-bt-comp a{
	width: auto;
	display: block;
    font: 0.8em Arial Narrow,Helvetica,sans-serif;
    padding: 4px 10px;
    color: #666666;
    float: left;
    font-size: 14px;
    text-decoration: none;
    border: medium none;
}

.borda-bt-mini-tl{ 
    background-position: 0 0;
    left: 0;
    top: 0;
    background-image: url("../../img/corner-bt.png");
    height: 5px !important;
    position: absolute;
    width: 5px !important;
}
.borda-bt-mini-tr{ 
	background-position: -10px 0;
    right: -2px;
    top: 0;
    color: #999999;
    background-image: url("../../img/corner-bt.png");
    height: 5px !important;
    position: absolute;
    width: 5px !important;
}
.borda-bt-mini-bl{ 
	background-position: -5px 0;
    bottom: 0px;
    left: 0px;
    background-image: url("../../img/corner-bt.png");
    height: 5px !important;
    position: absolute;
    width: 5px !important;
}

.borda-bt-mini-br{ 
	background-position: -15px 0;
    bottom: 0px;
    right: -2px;
    background-image: url("../../img/corner-bt.png");
    height: 5px !important;
    position: absolute;
    width: 5px !important;
}

.floatLeft{
	float:left!important;	
}

.floatRight{
	float:right!important;	
}

.clearNone{
	clear:none!important;	
}
.corner-bt {
	float: left;
	border: 1px solid #666666;	
	line-height: 33px;
    position: relative;
}

.corner-bt a{
	height: 33px;
    padding: 0 12px 0 35px;
    font-size: 13px !important;
    color: #666666;
}

.divAcesso{
	 height:auto!important;
	 width:990px!important;
}

.fixTermo{
	 overflow:auto!important;
	 height: 250px!important;
	 border: 1px solid #E6E6E6!important;
}

.imgCartao{
	clear:none!important;
	height:auto!important;
	margin-left:150px!important;
	width:800px!important;
}

.clearBoth{
	clear:both;
}
.liPsw
{
	margin-top:-18px;
	margin-left:40px;
	*margin-left:35px;
}
.lblPwd
{
	margin-left:102px; 
	*margin-left:110px;
}
.boxIdentificacao{
	height: 70px!important; 
	min-height: 50px!important;
}
.dadosAcesso li input
{
	width:280px;
}
.dadosAcesso .left
{
	margin-right: 17px;
}

.dadosAcesso .right
{
	width: 285px;
}
.divBotoesLogin
{
	float:right;
	width:653px; 
	margin-right:20px;
}
.contraste .filtro form .primAcess
{
	color: #000!important; 
}
#conteudo #princPrimAcesso
{
	height:700px; float:left; width:1010px;
}
.lblConfDad
{
	width:100%!important; margin-bottom:30px;
}
#conteudo .principal #secureForm
{
	border-bottom: none;
}
.btNoAmbiguo a
{
	width: auto;
}
#imgGrade{ margin-top:-8px!important; *margin-top:-3px!important;}

#conteudo .principal .lista-login .cooperativa input
{
	text-align: right;
}
#pagina #conteudo .principal
{
	height:auto; 
	float:left; 
	width:1010px;
	display: flex;
	gap: 24px;
}
#divFiltroSenha
{
	width:640px;margin-top: -150px!important;*margin-top: 20px!important;
}
#listaLogin li
{
	width: 325px; margin-left: 35px;
}
#listaLogin li input
{
	float:right;	
}
#divBotTransacao
{
	margin-right: 20px;width: 652px;
}
#secureForm
{
	border-bottom: none;
}
#divAssEletronica .confirmarSenha label
{
	*clear:none!important;
}
#pagina #conteudo #princLogin
{
	width:710px;
	margin-left: 10px;
}
.btLaranja
{
    background: url(../../img/bg-bt-laranja.jpg) repeat-x !important;
}
.btCinza{
	 color: #FFFFFF!important;
	 background-color: #666666;
}
#secundarios
{
	min-height: 105px;
} 

.titulares-container {
	display: flex;
	flex-direction: column;
}

.titulares-container div {
	display: flex;
}

.secundarios-container {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}
.secundarios-container h3 {
	flex-basis: 100%;
}

#iconeTrocarConta{
	float: left;
    position: relative;
    margin-top: -4px;
    margin-right: 5px;
}
.labelRadio
{
	display:inline!important;
}
.lista-login #coop, .lista-login #conta
{
	margin-left: 0!important;
}

.divBotoes {
    height: 50px;
    margin-bottom: 5px;
    margin-left: 10px;
    margin-top: 20px;
}
#conteudo .principal .divBotoes label
{
	width: 190px;*width: auto;clear: none;
}
#conteudo .principal .formLogin {
    border-bottom: none;
    display: block;
    margin-bottom: 0;
    min-height: 0;
    overflow: hidden;
    padding-bottom: 0;
    width: auto;
}
#messageBox .error
{
	font-size:11.2px;
	color:#666666;
	line-height:	12.3167px;
	display: block;
}
#iconPerfilAcesso
{
	margin-left: 115px;
	margin-top: 148px;
}
#dados .lista-login .cooperativa
{
	margin-right:35px;
	}
#divLinha
{
	border-top: 1px solid #ACD0BA;
    width:250px;
    margin-bottom:20px;min-height:40px;margin-top:13px;
}
#divLibAcesso
{
	padding-bottom: 0!important;
}


#retornoCritica{
    position:absolute;
    display:none;	
    left: 500px;
    top:165px;
    z-index:9;
}

#retornoCritica .seta-esquerda{
    width:10px;
    height:30px;
    margin-top: 12px;
    float:left; 
    background: url(../../img/setaAmarela.png) repeat-x 0 -1px transparent;
}

#retornoCritica .criticas{
    background-color:#F8F8F8;
    width:170px;
    height:auto;
    float:left;	
    padding: 8px;
    border: solid 1px #FBB800;
    color:#666;
    font: 0.7em Arial,Helvetica,sans-serif;
}

#retornoCritica .criticas span{
    display:block;
    color:#999;
    padding-bottom: 8px;
    font-weight:bold;
}

.contraste #retornoCritica .criticas{
    background-color:#000;
    color:#FFF;
}

.contraste #retornoCritica .criticas span{
    color:#FFF;
}

#retornoErro{
    position:absolute;
    display:none;	
    left: 500px;
    top:165px;
    z-index:9;
}

#retornoErro .seta-esquerda{
    width:10px;
    height:30px;
    margin-top: 12px;
    float:left; 
    background: url(../../img/setaAmarela.png) repeat-x 0 -1px transparent;
}

#retornoErro .criticasErro{
    background-color:#F8F8F8;
    width:170px;
    height:auto;
    float:left;	
    padding: 8px;
    border: solid 1px #FBB800;
    color:#666;
    font: 0.7em Arial,Helvetica,sans-serif;
}

#retornoErro .criticasErro span{
    display:block;
    color:#999;
    padding-bottom: 8px;
    font-weight:bold;
}

.contraste #retornoErro .criticasErro{
    background-color:#000;
    color:#FFF;
}

.contraste #retornoErro .criticasErro span{
    color:#FFF;
}

#msgNNE {
	display: none;
	margin-left: 45%;
	margin-top: 10%;
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 1;			
}
#msgNNE .msgBorder{
	width: 250px;
	font-size: 14px;
	text-align: justify;
	background-color: #fafafa;
	height: auto;
	float: left;
	padding: 10px;
	border: solid 1.2px #63c731;
	color: #666;
	font: 0.7em Arial,Helvetica,sans-serif;			
}
#msgNNE .msgBorder span{
	color: #63c731;
	font-stretch: condensed;
	font-size: 25px;
	padding-bottom: 8px;
}
#msgNNE .msgBorder p{
	font-size: 14px;
}

.whatsapp-button {
    background-color: #24CC63;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    bottom: 22px;
    right: 22px;
    box-shadow: 0px 4px 8px rgba(50,60,50,0.2);
    z-index: 99
}

.whatsapp-button a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

.whatsapp-button:hover {
    animation-name: grow;
    animation-duration: 0.4s;
    animation-fill-mode: forwards
}

.whatsapp-button:not(:hover) {
    animation-name: decrease;
    animation-duration: 0.4s;
    animation-fill-mode: forwards
}

@media (max-width: 450px) {
    .whatsapp-button {
        bottom:16px;
        right: 16px
    }
}