/*********************************************************/
/*	STYLE CSS										 	 */
/*	DESENVOLVIDO POR: GLOBALWS							 */
/*	CEO: MICHAEL PICOLO									 */
/*********************************************************/
html, body {width:100%; height:100%; font-family: 'Lato', sans-serif; background-color: #F3F4F9;}
/*********************************************************/
:root {
	--vermelho: #FF1100;
	--verde: #159033;
	--azul: #203791;
	--cinza: #918F8F;
	--cinza-claro: #E7E9F0;
	--preto: #333;
	--bege: #FDFDFD;
}

.esquerda {width: 47%; float: left;}
.direita {width: 47%; float: right;}

.bgcover {background-repeat: no-repeat; background-size: cover; background-position: center center;}
.bg100  {background-repeat: no-repeat; background-size: 100%; background-position: center center;}

h1, h2, h3, h4, h5 {font-family: 'Rubik', sans-serif;}

.botao-verde {padding: 12px 20px; background-color: var(--verde); color: #fff; font-weight: 600; text-transform: uppercase; border-radius: 5px; cursor: pointer;}
.botao-verde:hover {background-color: var(--vermelho);}
.botao-verde i {padding-right: 10px;}

.aparecer {display: none !important;}
/*********************************************************/
/*	TOPO & RODAPE										 */
/*********************************************************/
header {width: 100%; display: table; border-top: 5px solid var(--verde); padding-top: 10px; text-align: center; position: relative; background-color: #fff;}
header h2 {color: var(--cinza); font-weight: 700; font-size: 0.8em; padding-bottom: 5px;}

header .inicio {width: 100%; display: table; padding-bottom: 10px;}
header .logo {width: 350px; float: left; height: 100px;}

header .dados {float: right; width: 60%; padding-top: 20px;}
header .dados li {float: left; width: 50%; text-align: left; color: var(--preto); font-size: 1em; border-left: 1px solid var(--cinza); padding-left: 20px;}
header .dados i {color: var(--verde); padding-right: 10px;}

header .fone {font-size: 1.6em; color: var(--vermelho); font-weight: 900;}
header .menu {width: 100%; text-align: center; background-color: var(--verde);}

footer {width: 100%; display: table; padding: 20px 0; text-align: center; background-color: var(--preto);}
footer p {color: #fff; font-size: 0.9em; font-weight: 300;}
footer a {color: var(--verde);}
footer a:hover {color: var(--vermelho);}
/*********************************************************/
.busca {width: 100%; padding: 20px; background-color: #fff; display: table; margin: 30px auto; border-radius: 10px;}
.busca h4 {text-align: center; padding-bottom: 20px; text-transform: uppercase; font-size: 1em; color: var(--cinza); letter-spacing: 2px;}
.busca li {width: 20%; float: left; padding-right: 15px;}
.busca label {display: block;}
.busca .inputsel {width: 100%; padding: 10px; border: 1px solid var(--cinza); border-radius: 5px; font-size: 1em; color: var(--preto); margin-bottom: 5px; }
.busca .inputsel:focus {outline: none; border-color: var(--vermelho); box-shadow: 0 0 5px var(--vermelho); }
.busca .botao-verde {width: 100%;}
/*********************************************************/
.destaques {width: 100%; padding: 30px 0;}
.destaques h2 {text-align: center; padding-bottom: 20px; color: var(--preto); font-size: 1em; text-transform: uppercase; letter-spacing: 2px;}
.destaques h1 {color: var(--preto); font-size: 1.4em; font-weight: 400; letter-spacing: 1px; padding-bottom: 30px;}
.destaques h1:hover {color: var(--verde);}
.destaques a:hover {text-decoration: none !important;}
.destaques p {color: var(--cinza); letter-spacing: 1px; line-height: 25px;}
.destaques p span {color: var(--preto); font-weight: 600; font-size: 1.2em; line-height: 35px;}

.destaques .quadro {width: 100%; background-color: #fff; display: table; border-top-right-radius: 30px;}
.destaques .imagem {width: 45%; float: left; height: 280px; position: relative;}
.destaques .selo {background-color: var(--verde); position: absolute; left: 0; top: 30px; padding: 5px 20px; color: #fff; font-size: 0.9em; text-transform: uppercase; letter-spacing: 2px; }
.destaques .texto {width: 55%; float: right; padding: 40px 20px 20px 20px;}

.destaques .atributos {width: 100%; padding: 10px; background-color: var(--cinza-claro); text-align: center;}
.destaques .atributos li {display: inline-block; padding: 0 20px; font-weight: 400; color: var(--preto);}
.destaques .atributos i {color: var(--cinza); padding-right: 10px;}
/*********************************************************/
.banner-italia {width: 100%; display: table; padding: 180px 0; background-attachment: fixed; text-align: center;}
.banner-italia h1 {color: #fff; font-size: 2em; text-transform: uppercase; letter-spacing: 2px;}
.banner-italia p {color: #fff; font-weight: 600; letter-spacing: 1px;}
/*********************************************************/
.imoveis {width: 100%; display: table; padding: 40px 0; background-color: #fff;}
.imoveis h1 {color: var(--verde); font-size: 2em; text-transform: uppercase; letter-spacing: 2px; padding-bottom: 40px;}
.imoveis h2 {color: var(--preto); font-size: 1em; font-weight: 400; padding-bottom: 10px; height: 60px;}
.imoveis h2:hover {color: var(--verde);}
.imoveis p {color: var(--cinza); font-size: 0.9em; font-weight: 300;}
.imoveis p i {color: var(--preto); padding-right: 5px;}
.imoveis p span {color: var(--preto); font-weight: 600; font-size: 1.2em; margin-top: 10px; display: block;}

.imoveis .quadro {width: 23%; float: left; margin: 0 1% 40px 1%; min-height: 480px; border-bottom-right-radius: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; overflow: hidden; border-bottom-left-radius: 60px; border-color: var(--cinza); box-shadow: 0 0 5px var(--cinza); background-color: var(--bege); position: relative;}
.imoveis .quadro:hover {background-color: #f9f9f9;}
.imoveis .imagem {width: 100%; height: 280px; border-bottom-left-radius: 60px; background-position: top left;}
.imoveis .texto {width: 100%; padding: 20px 20px 10px 20px;}

.imoveis .atributos {width: 100%; text-align: center; position: absolute; bottom: 20px;}
.imoveis .atributos li {display: inline-block; padding: 0 2px; font-weight: 400; color: var(--preto); font-size: 0.8em; line-height: 25px;}
.imoveis .atributos i {color: var(--verde); padding-right: 5px;}
/*********************************************************/
.tela-1 {width: 100%; display: table; background-color: #fff; padding: 40px;}
.tela-1 h1 {color: #fff; font-weight: 600; text-transform: uppercase; letter-spacing: 2px;}
.tela-1 p {color: #fff; font-weight: 400; text-transform: uppercase; letter-spacing: 2px;}

.tela-1 .colunas {column-count: 3; margin-bottom: 40px;}
.tela-1 .quadro-b {width: 100%; float: left; height: 240px; margin: 1.5%; break-inside: avoid; position: relative; border-radius: 10px; overflow: hidden;}
.tela-1 .quadro-a {width: 100%; float: left; height: 380px; margin: 1.5%; break-inside: avoid; position: relative; border-radius: 10px; overflow: hidden;}
.tela-1 .quadro-b:hover .sombra {opacity: 1;  -webkit-transition: 0.3s ease-in; -moz-transition: 0.3s ease-in; -o-transition: 0.3s ease-in; transition: 0.3s ease-in; border-radius: 10px;}
.tela-1 .quadro-a:hover .sombra {opacity: 1;  -webkit-transition: 0.3s ease-in; -moz-transition: 0.3s ease-in; -o-transition: 0.3s ease-in; transition: 0.3s ease-in; border-radius: 10px;}

.tela-1 .sombra {position: absolute; background-color: rgba(0,0,0,0.6); width: 100%; height: 100%; padding: 20px; opacity: 0;}
.tela-1 .texto {width: 100%; height: 100%; border: 1px solid #fff; padding: 40px 30px 20px 30px; border-radius: 10px;}
/*********************************************************/
.contato {width: 100%; display: table; padding: 40px 0;}
.contato p {color: var(--preto); font-weight: 300; line-height: 25px;}
.contato h1 {color: var(--verde); font-size: 2em; text-transform: uppercase; letter-spacing: 2px; padding-bottom: 10px;}
.contato h2 {color: var(--cinza); font-weight: 700; font-size: 0.8em; padding-bottom: 10px;}

.contato .esquerda {width: 50%; border-right: 1px solid var(--cinza); padding-right: 5%;}
.contato .dados li{width: 100%; padding: 20px 0; border-bottom: 1px solid var(--cinza-claro); color: var(--preto); font-size: 1.1em;}
.contato .dados i {color: var(--verde); padding-right: 20px; height: 40px; float: left; padding-top: 5px;}

.contato .social li {float: left; color: var(--verde); font-size: 1.6em; padding-right: 15px;}
.contato .social li:hover {color: var(--vermelho);}

.contato .direita {padding-top:40px;}
.contato .input {width: 100%; padding: 20px; font-family: 'Lato', sans-serif; background-color: #fff;}
.contato .inputtext {width: 100%; height: 140px; padding: 20px; font-family: 'Lato', sans-serif; background-color: #fff;}
.contato span {color: var(--vermelho); font-weight: 300; font-size: 0.9em; font-style: italic;}
/*********************************************************/
.navegacao {width: 100%; display: table; padding: 20px 0; background-color: var(--preto); text-align: center;}
.navegacao li {color: #fff; font-weight: 500; display: inline-block; padding: 0 10px;}
.navegacao i {padding-right: 5px;}
.navegacao a li:hover {color: var(--verde);}
/*********************************************************/
.interna {width: 100%; display: table; padding: 60px 0;}
.interna h1 {color: var(--verde); font-size: 2em; text-transform: uppercase; letter-spacing: 2px; padding-bottom: 40px;}
.interna p {color: var(--preto); line-height: 30px; font-weight: 400;}
/*********************************************************/
.detalhes {width: 100%; display: block; padding: 60px 0;}
.detalhes p {color: var(--preto); font-weight: 400; line-height: 25px;}
.detalhes h1 {color: var(--verde); font-size: 1.2em; text-transform: uppercase; letter-spacing: 2px; padding-bottom: 10px;}
.detalhes h2 {width: 100%; color: var(--preto); letter-spacing: 2px; font-weight: 400; border-bottom: 3px solid #F3F4F9; padding-bottom: 10px; margin-bottom: 20px;}

.detalhes .centro {width: 65%; float: left;}
.detalhes .minifotos {width: 100%; padding: 10px 45px; background-color: #fff;}
.detalhes .subimg {width: 95%; margin: auto; height: 100px;}

.detalhes .atributos {width: 100%; padding: 10px; background-color: var(--cinza-claro); text-align: center;}
.detalhes .atributos li {display: inline-block; padding: 0 20px; font-weight: 400; color: var(--preto);}
.detalhes .atributos i {color: var(--cinza); padding-right: 10px;}

.detalhes .lateral {width: 30%; float: right;}

.detalhes .quadro {width: 100%; display: table; padding: 20px; background-color: #fff;}
.detalhes .valor {font-size: 1.4em; font-weight: 700; padding-top: 30px;}

.detalhes .ats li {width: 50%; float: left; padding: 5px 0; color: var(--preto);}
.detalhes .ats span {color: var(--cinza); font-weight: 400; padding-right: 10px;}

.detalhes .ats-2 li {width: 33.33%; float: left; padding: 5px 20px 5px 5px; color: var(--preto);}
.detalhes .ats-2 i {color: var(--verde); padding-right: 5px;}

/*********************************************************/
.form {width: 100%; display: table; background-color: var(--azul); padding: 15px;}
.form h2 {text-align: center; color: #fff; padding-bottom: 20px; text-transform: uppercase; font-weight: 400;}
.form .form-c {width: 100%; height: 100%; padding: 20px; border: 1px solid #fff;}
.form .input {width: 100%; padding: 15px; font-family: 'Lato', sans-serif;}
.form .inputtext {width: 100%; height: 120px; resize: none; padding: 15px; font-family: 'Lato', sans-serif;}
.form .botao-verde {width: 100%;}
.form span {color: #fff; font-weight: 300; font-style: italic; font-size: 0.9em;}