@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');


/* RESET */
* { margin:0; padding:0; list-style:none; border:0; vertical-align:baseline; font-family: 'Lato', sans-serif; -webkit-tap-highlight-color: rgba(0,0,0,0); transition: all 0.2s linear;  -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -ms-transition: all 0.2s linear; }
/* tap-hig... removendo quadro azul links mobile */
h1, h2, h3, h4, h5, h6 { font-weight:400; }
img, picture, video, embed { max-width: 100%; } /* truque para deixar as imagens e outros elementos adaptáveis */
a { color:#1E88E5; text-decoration:none; }
a:hover { text-decoration:underline; }
input:focus, button:focus, textarea:focus, select:focus { outline: none; }
input, select, textarea { -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-border-radius: 0px; } 

input[type=number]:-webkit-outer-spin-button, input[type=number]:-webkit-inner-spin-button { -webkit-appearance: none; }
input[type=number] { -moz-appearance:textfield; }
/* remover setas contador input tipo number */

.clearfix:before,.clearfix:after { content: " "; display: table; } 
.clearfix:after { clear: both; } 
.clearfix { *zoom: 1; }
/* fazer com que todos elementos fiquem dentro da div #conteudo por exemplo */

*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
/* todos os elementos agora levarão em conta apenas a largura e altura determinada, sem somar a este valor a borda e o padding */

/* BASE */
html, body { height:100%; }
body { color:#666; font-size:16px; background:#fff; }
#tudo { position:relative; float:left; width:100%;  }

/* CABEÇALHO */
#header { position:fixed; top:0; left:0; width:100%; background:#132f3d; z-index:9; }
#header a.logo-topo { float:left; width:308px; height:60px; margin:20px 0; }
#header a.botao-whatsapp { float: right; color: #fff; font-size: 28px; margin: 25px 20px 0 0; display: none; }

#header .menu { float:right; }
#header .menu ul { float:right; font-size:16px; text-transform: uppercase; font-weight: 400; }
#header .menu ul li { float:right; }
#header .menu ul li a { color:#e1f0f7; display:block; padding:0 15px; height:100px; line-height:100px; }
#header .menu ul li a:hover { color:#132f3d; text-decoration:none; background:#e1f0f7; }

#header .menu .botao-acao { float:right; height:100px; color:#fff; font-size:16px; text-align:center; padding:25px 30px 0 30px; background:#26d367; }
#header .menu .botao-acao span { font-size:16px; font-weight:700; }
#header .menu .botao-acao:hover { text-decoration:none; }
#header .menu .botao-acao i { font-size: 30px; }

#header.fixo { box-shadow: 0px 2px 2px rgba(0,0,0,.1); }

/* MENU MOBILE */
nav { position:fixed; bottom:0; left:0; width:100%; height:60%; padding:10px 30px; background:#132f3d; z-index:8; overflow:auto; }
nav ul { float:left; width:100%; font-size:18px; text-transform: uppercase;  margin-bottom:15px; }
nav ul li { width:100%; border-bottom:1px solid; border-color: rgba(255, 255, 255,.2); }
nav ul li a { padding:15px 0; color:#e1f0f7; display:block; text-indent:5px; }
nav ul li a:hover { color:#fcb02a; text-decoration:none; }

nav { 
	-webkit-transform: translateY(100%); 
	-moz-transform: translateY(100%); 
	-ms-transform: translateY(100%); 
	transform: translateY(100%); 
}

/* BANNER */
.banner-principal { position:relative; float:left; width:100%; height:800px; margin-top:100px; overflow:hidden; background: url(imagens/vinhetas/bg-banner.jpg) no-repeat center; background-size:cover; }
.banner-principal .texto { float: right; width: 50%; margin-top: 10%; }
.banner-principal .texto h1 { font-size: 54px; font-weight: 700; color: #e1f0f7; }
.banner-principal .texto h2 { font-size: 48px; font-weight: 400; color: #e1f0f7; }
.banner-principal .texto a.botao { display: inline-block; font-weight: 700; color: #fff; padding: 20px 50px; margin-top: 30px; background: #23231f; border-radius:5px; }
.banner-principal .texto a.botao:hover { text-decoration: none; color: #23231f; background: #fcb02a; }

/* BANNER PÁGINAS */
.banner-paginas { float:left; width:100%; height:200px; margin-top:100px; text-align: center; color: #fff; background: url(imagens/vinhetas/bg-banner.jpg) no-repeat center; }
.banner-paginas h1 { font-size: 48px; font-weight: 400; color: #e1f0f7; margin-top: 40px; }
.banner-paginas h2 { font-size: 38px; font-weight: 300; color: #e1f0f7; }

/* DESTAQUES */
.destaques { position: relative; float: left; width: 100%; margin-top: -80px; }
.destaques .solucao { float: left; width: 31.42857142857143%; color: #fff; text-align: center; padding: 40px; margin-right: 2.857142857142857%; background: #77776b; }
.destaques .solucao i { font-size: 60px; }
.destaques .solucao h3 { font-size: 22px; font-weight: 700; margin: 25px 0; }
.destaques .solucao.dois { background: #494942; }
.destaques .solucao.tres { background: #383832; margin-right: 0; }

/* SOBRE DESTAQUE */
.sobre-destaque { float:left; width:100%; padding:80px 0; background:#fff; }
.sobre-destaque p { margin-bottom:20px; line-height:24px; }
.sobre-destaque .direito { float: right; width: 65.71428571428571%; padding-top: 40px; }

h2.conteudo { position: relative; float: left; width: 31.42857142857143%; color: #23231f; font-size: 49px; font-weight: 700; padding-top: 40px; }
h2.conteudo:before { content: ""; position:absolute; top:0; left:0; width:120px; height: 2px; background: #666; }


/* CONTEÚDO */
#container { float:left; width:100%; }
.meio-conteudo { position: relative; width:1120px; margin:0 auto; }

.bloco-conteudo { float:left; width:100%; padding:80px 0; background:#fff; }
.bloco-conteudo .full { position: relative; float: left; width: 100%; padding-top: 40px; }
.bloco-conteudo .full:before { content: ""; position: absolute; top: 0; left: 50%; margin-left: -60px; width: 120px; height: 2px; background: #666; }
.bloco-conteudo .esquerdo { position: relative; float: left; width: 53.57142857142857%; padding-top: 40px; }
.bloco-conteudo .esquerdo:before { content: ""; position:absolute; top:0; left:0; width:120px; height: 2px; background: #666; }
.bloco-conteudo .direito { position: relative; float: right; width: 42.85714285714286%; padding-top: 40px; }

.bloco-conteudo h3.titulo { font-size: 22px; font-weight: 700; margin-bottom: 30px; }
.bloco-conteudo h4.subtitulo { font-size: 18px; font-weight: 700; margin-bottom: 15px; }
.bloco-conteudo p { margin-bottom:20px; line-height:24px; }
.lista-geral { width:100%; margin-bottom:20px; }
.lista-geral li { list-style: square; margin:0 0 5px 20px; line-height:24px; }


/* SÓCIOS */
.socios { float:left; width:100%; color: #fff; text-align: center; padding:80px 0 40px 0; background:#383832 url("imagens/vinhetas/bg-socios.jpg") no-repeat center; background-size:cover; background-attachment: fixed; }
.socios h2 { position: relative; float: left; width: 100%; font-size: 48px; font-weight: 700; padding-top: 40px; margin-bottom: 40px; }
.socios h2:before { content: ""; position:absolute; top: 0; left:50%; margin-left: -60px; width:120px; height: 2px; background: #666; }
.socios .grupo-pessoas { float: left; width: 100%; }

.socios .pessoas { display: inline-block; width: 22.32142857142857%; text-align: center; margin-bottom: 40px; }
.socios .pessoas .imagem { width: 100%; height: auto; border-radius:50%; overflow:hidden; font-size: 0; border: solid 10px #494942; }
.socios .pessoas h4 { font-size: 22px; font-weight: 700; margin: 20px 0 10px 0; }
.socios .pessoas h5 { color: #999; }
.socios .pessoas:nth-child(3n+2) { margin: 0 13%; }

/* NOTÍCIAS */
.noticias-destaques { float:left; width:100%; padding:80px 0; background:#f2f2f2; }
.noticias-destaques  h2 { position: relative; float: left; width: 100%; color: #23231f; text-align: center; font-size: 48px; font-weight: 700; padding-top: 40px; margin-bottom: 40px; }
.noticias-destaques  h2:before { content: ""; position:absolute; top: 0; left:50%; margin-left: -60px; width:120px; height: 2px; background: #666; }
.noticias-destaques .noticia { float: left; width: 31.42857142857143%; margin-right: 2.857142857142857%; }
.noticias-destaques .noticia:last-child { margin-right: 0; }
.noticias-destaques h3 { color: #23231f; font-size: 18px; font-weight: 700; margin-bottom: 20px; }
.noticias-destaques .descricao { line-height:24px; margin-bottom: 30px; }

.noticias { float: left; width: 31.42857142857143%; margin: 0 2.857142857142857% 2.857142857142857% 0 ; padding: 20px; border: 1px solid #ccc; cursor: pointer; }
.noticias:hover { box-shadow: 0px -1px 10px 1px rgba(0,0,0,0.2); }
.noticias:nth-child(3n) { margin-right: 0; }
.noticias h3 a { display: inline-block; color: #23231f; font-size: 18px; font-weight: 700; margin-bottom: 20px; }
.noticias .descricao a { color: #666; line-height:24px; }
.fonte { font-size: 14px; color: #999; }

/* SOLUÇÕES */
.solucoes-lista { position: relative; float: left; width: 28%; padding-top: 40px; }
.solucoes-lista:before { content: ""; position:absolute; top:0; left:0; width:120px; height: 2px; background: #666; }
.solucoes-lista li { float: left; width: 100%; }
.solucoes-lista li a { display: inline-block; float: left; width: 100%; padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #ccc; }

.solucoes-conteudo { float: right; width: 65.71428571428571%; padding-top: 40px; }
.solucoes-topicos { float: left; width: 100%; padding: 20px; margin-bottom: 30px; background: #f2f2f2; }
.solucoes-topicos:last-child { margin-bottom: 0; }

/* RODAPÉ */
#rodape { float:left; width:100%; padding:80px 0; color: #bcbbac; background:#494942; }
.rodape-bloco { float: left; width: 31.42857142857143%; margin-right: 2.857142857142857%; }
.rodape-bloco:last-child { margin-right: 0; }
.rodape-bloco-logo { width: 250px; text-align: center; }
.rodape-bloco-logo i { font-size: 30px; margin: 10px 0; color: #77776b; }
.rodape-bloco-logo p { line-height: 24px; }

.rodape-bloco-conteudo { float: left; width: 100%; line-height: 24px; margin-bottom: 20px; }
.rodape-bloco-conteudo h5 { color: #fff; font-size: 16px; font-weight: 700; margin-bottom: 5px; }
.rodape-bloco-conteudo span { color: #fff; }
.rodape-bloco-conteudo:last-child { margin-bottom: 0; }
.rodape-bloco-conteudo a { color: #fcb02a; }

.rodape-direitos { position: relative; float: left; width: 100%; border-top: 1px solid #77776b; margin-top: 40px; padding-top: 40px; }
.rodape-direitos .redes-sociais { position: absolute; right: 0; top: 40px; }
.rodape-direitos .redes-sociais a { color: #bcbbac; margin-left: 20px; font-size: 18px; }

/* FORMULÁRIO */
.form-coluna { float:left; width:100%; margin-bottom: 15px; }
.form-coluna-buttom { clear:both; float:left; width:100%; text-align:center; }

input, textarea { float:left; width:100%; padding:10px; font-size:14px; color:#999; border:1px solid #ccc; background: #f2f2f2; transition: all 0.2s linear; }
input:focus, textarea:focus, select:focus { border:1px solid #132f3d; }
.caixa-erro, .caixa-erro:focus { border:1px solid #ea3d4a; }

.botao-form { float:left; display:inline-block; width:auto; padding:15px 30px; color:#fff; font-size:16px; font-weight: 400; border:0; cursor:pointer; background:#23231f; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; border-radius:3px; }
.botao-form:hover { color:#23231f; background:#fcb02a; }

.mensagem-sucesso { float:left; width:100%; color:#000; padding:10px; text-align:center; margin-bottom:15px; background:#C4FFC4; }
.mensagem-erro { float:left; width:100%; color:#000; padding:10px; text-align:center; margin-bottom:15px; background:#FFAEAE; }

/* BOTÕES */
.botao-link { display:inline-block; padding:10px 20px; color:#fff; font-size:16px; font-weight: 400; background: #23231f; border-radius:3px; }
.botao-link:hover { color:#23231f; background:#fcb02a; text-decoration:none; }


/* OUTROS */
#header, #menu, #rodape, .meio-conteudo {
	transition: all 0.25s linear;
	-webkit-transition: all 0.25s linear;
	-moz-transition: all 0.25s linear;
	-ms-transition: all 0.25s linear;
}

/* ICONE MENU HAMBURGUER */
.hamburguer {
  float:right;
  width: 25px;
  height: 20px;
  display: none;
  position: relative;
  margin-top:32px;
}
.hamburguer:after, .hamburguer:before, .hamburguer span {
  content: '';
  display: block;
  width: 100%;
  height: 2px;
  background: #fff;
  left: 0;
  position: absolute;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}
.hamburguer:before {
  top: 2px;
}
.hamburguer:after {
  bottom: 2px;
}
.hamburguer:focus {
  outline: none;
}
.hamburguer label {
  width: 100%;
  height: 100%;
  cursor: pointer;
  z-index: 1000;
  display: block;
  position: absolute;
  background:none;
}
.hamburguer span {
  top: 9px;
}

.menu-active .hamburguer:before, .menu-active .hamburguer:after {
  top: 10px;
  margin-top: -10%;
}
.menu-active .hamburguer:before {
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.menu-active .hamburguer:after {
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
}
.menu-active .hamburguer span {
  opacity: 0;
}

@media screen and (max-width: 1120px) {
	.meio-conteudo { width:100%; padding:0 20px; }
	#header a.logo-topo { width:254px; height:50px; }
	
	#header .menu { display:none; }	
	.oculto-mobile { display:none; }
	.hamburguer, #header a.botao-whatsapp { display:block; }
	
	.banner-principal, .banner-paginas { margin-top:90px; }
	
	.menu-active nav { 
		-webkit-transform: translateY(0); 
		-moz-transform: translateY(0); 
		-ms-transform: translateY(0); 
		transform: translateY(0); 
	}
}

@media screen and (max-width: 900px) {
	.banner-principal { height:600px; background-position: 57% 25%; background-size: auto; }
	.banner-principal .texto { width: 100%; text-align: center; margin-top: 15%; }
	
	.botao-link, .botao-form { width:100%; text-align:center; }
}

@media screen and (max-width: 768px) {	
	.meio-conteudo h2 { font-size: 38px; }
	.bloco-conteudo .bloco { width:100%; }
	
	.bloco-conteudo .esquerdo { width: 100%; }
	.bloco-conteudo .direito { width: 100%; padding-top: 20px; }
	
	.banner-principal .texto { margin-top: 25%; }
	.banner-principal .texto h1 { font-size: 42px; }
	.banner-principal .texto h2 { font-size: 36px; }
	.banner-principal .texto a.botao { padding: 15px 45px; }
	
	.banner-paginas h1 { font-size: 42px; }
	.banner-paginas h2 { font-size: 32px; }
	
	.destaques .solucao { float: left; width: 100%; margin: 0 0 20px 0; }
	
	h2.conteudo:before {  left:50%; margin-left: -60px; }
	h2.conteudo { width: 100%; text-align: center; }
	.sobre-destaque .direito { width: 100%; }
	
	.solucoes-lista { width: 100%; }
	.solucoes-conteudo { width: 100%; }	
	
	.socios .pessoas { float: left; width: 45%; margin-bottom: 30px; }
	.socios .pessoas .imagem { border-width: 5px; }
	.socios .pessoas h4 { font-size: 18px; }
	.socios .pessoas:nth-child(3n+2) { margin: 0; }
	.socios .pessoas:nth-child(2n+1) { clear: both;  }
	.socios .pessoas:nth-child(2n) { float: right;  }
	
	.noticias-destaques .noticia { width: 100%; margin: 0 0 40px 0; }
	.noticias-destaques .noticia:last-child { margin-bottom: 0; }
	.noticias-destaques .descricao { margin-bottom: 20px; }
	
	.noticias { width: 100%; margin: 0 0 20px 0 ; }
	.noticias:last-child { margin-bottom: 0; }
	
	.rodape-bloco { width: 100%; margin: 0 0 40px 0; text-align: center; }
	.rodape-bloco-logo { width: 100%; }
	.rodape-bloco:last-child { margin-bottom: 0; }
	.rodape-bloco-conteudo:last-child { margin-bottom: 0; }

	.rodape-direitos { text-align: center; }
	.rodape-direitos div { float: left; width: 100%; }
	.rodape-direitos .redes-sociais { float: left; position: relative; width: 100%; top: 0; margin-top: 20px; font-size: 18px; }
	.rodape-direitos .redes-sociais a { color: #bcbbac; margin-left: 10px; }
}

@media screen and (max-width: 480px) {	
	.banner-principal .texto h1 { font-size: 38px; }
	.banner-principal .texto h2 { font-size: 32px; }	
	
	.socios .pessoas h4 { font-size: 16px; }
}