/*********************************************************/
/*	STYLE CSS										 	 */
/*	DESENVOLVIDO POR: GLOBALWS							 */
/*	CEO: MICHAEL PICOLO									 */
/*********************************************************/
html, body {width:100%; height:100%;  font-family: "Roboto Condensed", sans-serif;}
/*********************************************************/
:root {
	--cinza: #63666B;
	--dourado: #C89A2C;
}

.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 {font-family: "Merriweather", serif; text-transform: uppercase; letter-spacing: 2px; font-size: 1.6em; font-weight: 400; text-transform: uppercase; color: var(--dourado); padding-bottom: 20px;}
p {color: var(--cinza); line-height: 30px;}

.aparecer {display: none !important;}
/*********************************************************/
/*	TOPO & RODAPE										 */
/*********************************************************/
header {width: 20%; float: left; min-height: 100%; position: fixed; padding: 20px;}
header .logo {width: 90%; height: 60px; margin: 0 auto 60px auto;}
header p {font-size: 1.2em; text-transform: uppercase; letter-spacing: 2px; color: var(--cinza); line-height: 20px;}
header p span {color: var(--dourado); font-size: 0.5em;}
header .menu {margin-bottom: 40px;}

header .social {width: 100%; text-align: center; display: table; padding: 20px 0; border-top: 1px solid #ededed; mask-position: relative; margin-top: 40px;}
header .social li {border: 1px solid #ededed; width: 40px; height: 40px; border-radius: 50%; display: inline-block; top: -40px; margin: 0 15px; background-color: #fff; color: var(--dourado); font-size: 1.2em; padding-top: 8px; position: relative;}
header .social li:hover {background-color: var(--dourado); color: #fff;}

.centro {width: 80%; float: right; background-color: #fafafa;}
.background {min-height: 750px; width: 100%; background-position: bottom left;}

header .rdp {position: absolute; bottom: 20px;}
header .rdp p {font-size: 0.7em; text-align: center; line-height: 20px;}
header .rdp p span {font-size: 1em;}
header .rdp a {color: var(--cinza);}
header .rdp a:hover {color: var(--dourado);}

footer {width: 100%; display: table; padding: 40px 0; text-align: center; background-color: #1b1b1b;}
footer .logo {width: 300px; height: 45px; margin: auto;}
footer span {color: var(--dourado);}
footer p {font-size: 0.9em;}
footer a {color: var(--cinza);}
footer a:hover {color: var(--dourado);}
/*********************************************************/
.tela-1 {width: 100%; display: table; padding: 60px 0;}
.tela-1 h2 {color: var(--cinza); font-weight: 400; padding-bottom: 30px; font-size: 2em;}
.tela-1 h3 {color: var(--cinza);font-family: "Merriweather", serif; padding-bottom: 40px; font-weight: 300;}
.tela-1 .imagem {width: 25%; float: left;}
.tela-1 .texto {width: 70%; float: right;}
/*********************************************************/
.tela-2 {width: 100%; padding: 60px 0; background-color: #f4f4f4;}
.tela-2 h2 {color: var(--cinza);font-family: "Merriweather", serif; padding-bottom: 20px; font-weight: 300;}

.tela-2 .quadro {width: 48%; background-color: #fff; margin: 0 1% 60px 1%; display: table; float: left;}
.tela-2 .foto {width: 45%; float: left;}
.tela-2 .texto {width: 55%; float: right; padding: 20px;}
.tela-2 .capa {width: 50%; margin: auto; border: 10px solid #63666B; }
.tela-2 .capa img {margin-bottom: -5px ;}
/*********************************************************/
.tela-3 {width: 100%; display: table; padding: 60px 0; background-image: url(../images/bg-1.jpg);}
.tela-3 .texto {width: 30%; float: left;}
.tela-3 .galeria {width: 60%; float: right;}
.tela-3 .foto {width: 48%; float: left; height: 200px; margin: 1%; border-top-left-radius: 30px; border-right: 5px solid var(--dourado); border-bottom: 5px solid var(--dourado); background-position: center center;}
.tela-3 .foto:hover {-webkit-filter: grayscale(100%); filter: grayscale(100%); filter: gray;}
/*********************************************************/
.tela-4 {width: 100%; padding: 60px 0; }
.tela-4 h2 {color: var(--cinza);font-family: "Merriweather", serif; padding-bottom: 20px; font-weight: 300; font-size: 2em;}
.tela-4 h3 {color: var(--dourado);font-family: "Merriweather", serif; padding-bottom: 10px; font-weight: 300; font-size: 1.2em;}
.tela-4 img {border-right: 5px solid var(--dourado); border-bottom: 5px solid var(--dourado);}
.tela-4 .direito {width: 100%; display: table; background-image: url(../images/bg-2.jpg); padding: 40px; background-attachment: fixed;}
.tela-4 .imagem {width: 30%; float: left;}
.tela-4 .texto {width: 65%; float: right;} 
.tela-4 .quadro {width: 30%; margin: auto; background-color: #fff; padding: 20px; margin: 0 1.5% 40px 1.5%; float: left;}
.tela-4 .capa {width: 100%; height: 240px; margin-bottom: 15px;}
.tela-4 .conteudo {width: 100%; min-height: 260px; border-bottom: 10px solid var(--dourado);}
.tela-4 .maior {height: 450px;}
/*********************************************************/
.tela-5 {width: 100%; padding: 60px 0; min-height: 740px;}
.tela-5 h2 {color: var(--dourado);font-family: "Merriweather", serif; padding-bottom: 10px; font-weight: 500; font-size: 1.2em;}
.tela-5 a {color: var(--dourado);}
.tela-5 a:hover {color: var(--cinza);}

.tela-5 article {width: 30%; float: left; margin: 0 1.5% 40px 1.5%; background-color: #fff;}
.tela-5 .imagem {width: 100%; height: 240px; border-bottom: 10px solid var(--dourado); border-right: 5px solid var(--dourado); margin-bottom: 10px;}
.tela-5 .texto {width: 100%; padding: 10px 20px; min-height: 240px;}

.tela-5 .post-e {width: 40%; float: left;}
.tela-5 .post-d {width: 55%; float: right;}

.tela-5 .artigo {width: 80%; background-color: #fff; padding: 40px; margin: auto;}
.tela-5 .capa {width: 50%; margin: 0 auto 40px auto; border-bottom: 10px solid var(--dourado);}
/*********************************************************/
.tela-6 {width: 100%; padding: 60px 0; display: table;}

.tela-6 iframe {width: 100%; height: 650px;}
.tela-6 .input {width: 100%; padding: 20px; border: 1px solid var(--cinza); font-family: "Roboto Condensed", sans-serif;}
.tela-6 .inputtext {width: 100%; height: 140px; resize: none; padding: 20px; border: 1px solid var(--cinza); font-family: "Roboto Condensed", sans-serif;}
.tela-6 .botao {background-color: var(--dourado); padding: 10px 30px; color: #fff; cursor: pointer; font-family: "Roboto Condensed", sans-serif; font-size: 1.3em;}
.tela-6 .botao:hover {background-color: var(--cinza);}

.tela-6 .dados li {color: var(--cinza); width: 100%; display: table;}
.tela-6 .dados i {color: var(--dourado); padding-right: 20px; height: 40px; float: left;}
/*********************************************************/
.tela-7 {width: 100%; padding: 60px 0; display: table; }
/*********************************************************/
.tela-8 {width: 100%; padding: 60px 0; background-color: #fff;}
.tela-8 .quadro {width: 90%; margin: auto;}
.tela-8 .imagem {width: 100%; height: 240px; border-bottom: 10px solid var(--dourado); border-right: 5px solid var(--dourado); margin-bottom: 10px;}
.tela-8 .texto {width: 100%; padding: 10px 20px; min-height: 240px;}
.tela-8 h2 {color: var(--dourado);font-family: "Merriweather", serif; padding-bottom: 10px; font-weight: 300; font-size: 1.2em;}
.tela-8 h2:hover {color: var(--cinza);}
.tela-8 a:hover {text-decoration: none !important;}
/*********************************************************/
.tela-9 {padding-bottom: 60px;}
.tela-9 h2 {font-family: "Merriweather", serif; font-size: 1em; color: var(--cinza);}
.tela-9 .quadro {width: 90%; margin: 20px auto; text-align: center;}
.tela-9 .icon {width: 50%; height: 120px; margin: 0 auto 20px auto;}
.tela-9 .ic1 {background-image: url(../images/i1.png);}
.tela-9 .ic2 {background-image: url(../images/i2.png);}
.tela-9 .ic3 {background-image: url(../images/i3.png);}
.tela-9 .ic4 {background-image: url(../images/i4.png);}
.tela-9 .ic5 {background-image: url(../images/i5.png);}
.tela-9 .ic6 {background-image: url(../images/i6.png);}
/*********************************************************/
.tela-10 {width: 100%; display: table; padding: 40px 0;}
.tela-10 .texto {float: left; width: 30%; padding-top: 80px;}
.tela-10 .mapa {width: 68%; float: right;}
.tela-10 iframe {width: 100%; height: 340px;}
.tela-10 .dados li {color: var(--cinza); width: 100%; display: table;}
.tela-10 .dados i {color: var(--dourado); padding-right: 20px; height: 40px; float: left;}