@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,600,300italic,400italic,600italic);


/* RESET */
* { margin:0; padding:0; list-style:none; border:0; vertical-align:baseline; font-family: 'Open Sans', sans-serif; -webkit-tap-highlight-color: rgba(0,0,0,0); } /* tap-hig... removendo quadro azul links mobile */
h1, h2, h3, h4, h5, h6 { font-weight:300; color:#333; }
img, picture, video, embed { max-width: 100%; } /* truque para deixar as imagens e outros elementos adaptáveis */
a { color:#762206; text-decoration:none; outline: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:#4D4D4D; font-size:16px; background:#fff; }
#tudo { position:relative; float:left; width:100%; height:100%; min-width:320px;  }

/* CABEÇALHO position:fixed; */
#header { top:0; left:0; width:100%; background: #fff; z-index:9; transition: all 0.2s linear; }
#header a.logo-topo { float:left; width:280px; height:110px; margin:20px 0; transition: all 0.2s linear; }

#header .menu { float:right; }
#header .menu .botao-acao { float:right; height:140px; color:#000; font-size:16px; padding:18px 40px 0 40px; background:#ffeb33;}
#header .menu .botao-acao span { font-size:18px; font-weight:600; }
#header .menu .botao-acao:hover { text-decoration:none; }
#header .menu ul { float:right; font-size:18px; }
#header .menu ul li { float:right; }
#header .menu ul li a { color:#fff; display:block; padding:43px 20px 0 60px; height:140px; transition: all 0.2s linear; }
#header .menu ul li a:hover { text-decoration:none; background:#fff; }
#header .menu ul li img { float:left; margin:48px 5px 0 20px; }
#header .menu ul li a .desc { color:#C0C0C0; font-size:13px; }
#header .menu ul li a .online { color:#08f70e; }
#header .menu ul li a .offline { color:#FF0000; }

#header.fixo { background:#fff; box-shadow: 0px 2px 2px rgba(0,0,0,.1); }
#header .menu { display:none; }	

/* MENU MOBILE  */

nav { position:fixed; top:0; left:0; width:100%; height:calc(100%); padding:10px 30px; background:rgba(0, 0, 0, 0.8); z-index:8;  }
nav ul { width:1120px; margin:150px auto 0 auto; }
nav ul li { width:100%; border-bottom:1px solid; border-color: rgba(255, 255, 255,.2); font-size:20px; }
nav ul li a { padding:15px 0; color:#fff; display:block; text-indent:5px; }
nav ul li a:hover { color:#0067b5; text-decoration:none; }
nav ul li a i { color:#ed3237; margin:0 3px; }






nav { 
	-webkit-transform: translateY(-100%); 
	-moz-transform: translateY(-100%); 
	-ms-transform: translateY(-100%); 
	transform: translateY(-100%); 
	transition: all .25s linear;
}



/* BANNER PRINCIPAL */
.banner-principal { position:relative; float:left; width:100%; height:calc(600px - 150px); min-height:530px; overflow:hidden; background:#f2f2f2 url(imagens/vinhetas/banner-principal.jpg) no-repeat center; background-size:cover; transition: all 0.2s linear; }
.banner-principal.receita { height:calc(130px - 150px); min-height:130px; background:#f2f2f2 url(imagens/vinhetas/banner-interno-receita.jpg) no-repeat center;  }
.banner-principal.fale { height:calc(130px - 150px); min-height:130px; background:#f2f2f2 url(imagens/vinhetas/banner-interno-fale.jpg) no-repeat center;  }



.banner-principal h1 { line-height:130px; font-size:35px; font-weight:100; color:#FFF; text-align:center; }
.banner-principal h1 strong { font-weight:600; }

.banner-principal h3 { line-height:130px; font-size:35px; font-weight:100; color:#FFF; text-align:center; }

.banner-principal .descricao { float:left; width:100%; font-size:22px; color:#736357; margin:5% 0; }
.banner-principal .valor { float:left; width:100%; font-size:18px; color:#736357; margin-bottom:10px; }
.banner-principal .valor .texto { margin-top:-10px; }
.banner-principal .valor .cifra { font-size:36px; }
.banner-principal .valor .numero { font-size:60px; }


/* CONTEÚDO */
#container { float:left; width:100%; }
.meio-conteudo { width:1120px; margin:0 auto; }
.bloco-conteudo { float:left; width:100%; padding:40px 0; background:#fff; }
.bloco-conteudo.bg { background:#0d5288; color:#fff; }
.bloco-conteudo.bg2 { background:#f2f2f2; }
.bloco-conteudo .bloco { float:left; width:48%; }
.bloco-conteudo .bloco.direito { float:right; }
.bloco-conteudo p { margin-bottom:20px; line-height:24px; }
.bloco-conteudo h1 { font-size:50px; margin-bottom:30px; }
.bloco-conteudo h2 { font-size:36px; margin-bottom:20px; }
.bloco-conteudo h3 { font-size:36px; }
.bloco-conteudo h3.azul { color:#0067b5; }
.bloco-conteudo h3.subtitulo { font-size:26px; color:#999999; margin-bottom:30px; }

.bloco-conteudo ul { float:left; width:100%; }
.bloco-conteudo ul li { line-height:24px; margin-bottom:20px; }

.bloco-conteudo a.catalogo { padding:20px; border:1px #B17677 solid; font-size:20px; }
.bloco-conteudo a.catalogo:hover { background:#B17677; color:#FFFFFF; text-decoration: none; }

.bloco-conteudo .receita { float:left; width:23%; margin:0 1% 4% 1%; background:#FFFFFF; border-radius:15px; transition: all 0.2s linear; }
.bloco-conteudo .receita:hover { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); cursor:pointer; }
.bloco-conteudo .quebra-linha-receita { display:none; }
.bloco-conteudo .receita img { width:100%; border-radius:15px 15px 0 0; }
.bloco-conteudo .receita .dados { width:100%; padding:15px 20px;  font-size:14px; }
.bloco-conteudo .receita .dados h2 { font-size:18px; font-weight: normal;  line-height: normal; }

.bloco-conteudo .fotos { float:left; width:20%; border:1px #fff solid; transition: all 0.2s linear; }
.bloco-conteudo .fotos.clear { clear:both; }
.bloco-conteudo .fotos .foto { width:100%; }
.bloco-conteudo .fotos .info { float:left; padding:15px; font-size:14px; }

.bloco-conteudo .produtos { float:left; width:25%;  border:10px #f2f2f2 solid; transition: all 0.2s linear; }
.bloco-conteudo .produtos.clear { clear:both; }
.bloco-conteudo .produtos .foto { width:100%; }
.bloco-conteudo .produtos .info { text-align:center; font-weight:600; font-size:18px; }
.bloco-conteudo .produtos .info a { font-weight:400; font-size:15px; }





.bloco-conteudo .mapa { clear:both; width:90%; margin:0 5%; border:1px #D7D7D7 solid; }
.bloco-conteudo .mapa-iframe { height:500px; }





/* CAIXA DE BUSCA */
.busca-menu { float:right; margin:40px 0 0 0; }
.busca-menu .busca { float:right; }
.busca-menu .busca .caixaB { position:relative; float:left; width:280px; height:35px; border:1px solid #CCC; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; background:url(imagens/vinhetas/iconeBusca.png) left center no-repeat;  }
.busca-menu .busca .caixaB .caixaBusca { float:left; height:22px; line-height:22px; width:200px; font-size:13px; color:#999; font-family:Arial; margin:7px 0 0 40px; border:none; }
.busca-menu .busca .caixaB .botao {  width:38px; height:33px; cursor:pointer; background:#ee3339 url(imagens/vinhetas/icoBotaoBusca.png); text-indent:-9999px; border:none; }
.busca-menu .busca .caixaB .botao:hover { background:#0067b5 url(imagens/vinhetas/icoBotaoBusca.png); }


.busca-menu ul { clear: both; float:right; margin-top: 20px; }
.busca-menu ul li { float:left; margin-left:17px; padding-right:17px; font-size: 15px; border-right:1px #ccc solid;}
.busca-menu ul li.ultimo { margin-left:17px; padding-right:0; border-right:0;}
.busca-menu ul li a { color: #0267b1; }



.formas-pagamento { float:left; width:100%; text-align:center; color:#808080; margin-top:10px; }
.formas-pagamento img { margin-top:10px; }

/* RODAPÉ */
#rodape { float:left; width:100%; padding:40px 0; font-size:14px; }
#rodape .logo { width: 220px; }
#rodape .endereco { font-size:16px; margin: 15px 0; }

#social { float:left; width:100%; padding:40px 0; background:#f2f2f2; }

#rodape .bloco { float:left; width:100%; margin-bottom:25px; }
#rodape .bloco.mapa { width:35%; margin-right:5%; }
#rodape .bloco.representante { width:60%; margin:40px 0; }
#rodape .bloco.representante .estados { float:left; width:33.33333333%; margin-bottom:15px; }
#rodape .bloco.representante .estados h6 { font-size:18px; color:#0D5288; margin-bottom:5px; font-weight:normal; }
#rodape .bloco.escritorio { width:40%; }
#rodape .bloco.suporte { width:20%; }
#rodape h4 { font-size:27px; margin-bottom:20px; }
#rodape .direitos { float:left; width:100%; padding:25px 0; font-size:13px; border-top:1px #e4e4e4 solid; margin-top: 40px; text-align: center; }

/* PÁGINA CONCLUÍDO */
.concluido-topo { float:left; width:100%; padding:40px; color:#fff; text-align:center; font-size:60px; font-weight:300; background:#00A99D; }
.concluido-topo .logo { display:inline-block; width:200px; font-size:0; }
.concluido-meio { float:left; width:100%; padding:40px; text-align:center; font-size:36px; font-weight:300; }
.concluido-meio a.link { margin-top:20px; display:inline-block; }

/* FORMULÁRIO */
.form-coluna { float:left; width:100%; padding:0 20px 20px 0; }
.form-coluna.coluna2 { width:50%; }
.form-coluna.coluna3 { width:33.33333333%; }
.form-coluna.center { width:40%; margin:0 30%; }
.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; transition: all 0.2s linear; }
select { float:left; width:100%; padding:10px; font-size:14px; color:#999; border:1px solid #ccc; background:#fff url(imagens/vinhetas/iconSelect.png) no-repeat; background-position:98% 50%; background-size:16px 10px; transition: all 0.2s linear; }
input:focus, textarea:focus, select:focus { border:1px solid #00a0d8; }
.caixa-erro, .caixa-erro:focus { border:1px solid #ea3d4a; }

.botao-form { float:none; display:inline-block; width:auto; padding:15px 40px; color:#fff; font-size:14px; font-weight:600; border:0; cursor:pointer; background:#ee3339; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; }
.botao-form:hover { color:#fff; background:#0067b5; }

/* BOTÕES */
.botao-link { display:inline-block; padding:15px 40px; color:#fff; font-size:22px; font-weight:100; background:#0d5288; transition: all 0.2s linear; }
.botao-link.suporte { display:inline-block; padding:10px 20px; margin-top:20px; font-size:15px; color:#fff; text-align:center; font-weight:600; background:#0dc144;  }
.botao-link.suporte i { font-size:25px; margin-right:10px; vertical-align:-4px; }
.botao-link:hover, .botao-link.tipo2:hover { background:#003979; text-decoration:none; }

.botao-link img { float:left; margin:8px 8px 0 0; }
.botao-link .desc { color:#C0C0C0; font-size:13px; }


.botao-manual { display:inline-block; color:#0d5288; font-size:22px; font-weight:100; margin:15px 40px 0 40px; }
.botao-manual span { color:#7B7B7B; font-size:15px; }
.botao-manual:hover { color:#CD090C; text-decoration:none; }


/* CAIXA MODAL */
.bloco-modal { position:fixed; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,.8); z-index:999; display:none; transition: all 0.25s linear; }
.bloco-modal .modal { position:absolute; top:50%; left:50%; width:600px; height:300px; margin-top:-150px; margin-left:-300px; font-size:16px; text-align:center; padding:30px; background:#fff; -webkit-box-shadow: 0px 5px 15px rgba(0,0,0,.4); -moz-box-shadow: 0px 5px 15px rgba(0,0,0,.4); box-shadow: 0px 5px 15px rgba(0,0,0,.4); transition: all 0.25s linear; }
.bloco-modal .modal h2 { color:#000; font-size:24px; font-weight:600; margin-bottom:20px; }
.bloco-modal .modal .acoes { float:left; width:100%; margin-top:40px; }

.modal-active .bloco-modal { 
	display:block;
}


/* DIVERSOS */
.text-center { text-align:center; }
.fonte12 { font-size:12px; }
.fonte14 { font-size:14px; }
.fonte22 { font-size:22px; }
.fonte-cinza { color:#808080; }
.marginTop30 { margin-top:30px }
.quebra-linha { clear:both; }

.caixa-aviso { position:relative; float:left; width:100%; margin-bottom:15px; padding:15px 15px 15px 50px; font-size:13px; background:#fff; }
.caixa-aviso i { position:absolute; top:15px; left:20px; font-size:16px; }
.caixa-aviso:before { position:absolute; top:0; left:0; width:5px; height:100%; content:""; background-color:rgba(0,0,0,.1); }
.caixa-aviso.alerta { color:#000; background:#f7df9a; }
.caixa-aviso.ok { color:#fff; background:#62bc6a; }
.caixa-aviso.erro { color:#fff; background:#e85d6e; }

#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;
}

.borda-redonda {
	border-radius:50%;
	-webkit-border-radius:50%;
	-moz-border-radius:50%;
	overflow:hidden; 
}


/* ICONE MENU HAMBURGUER */
.hamburguer {
  float:right;
  width: 30px;
  height: 20px;
  display: none;
  position: relative;
  margin-top:60px;
  z-index:9;
}
.hamburguer:after, .hamburguer:before, .hamburguer span {
  content: '';
  display: block;
  width: 100%;
  height: 2px;
  background: #0067b5;
  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%;
  background: #fff;
}
.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; }
	nav ul { width:100%; }
}

@media screen and (max-width: 900px) {
	#header .menu { display:none; }	
	.oculto-mobile { display:none; }
	.hamburguer { display:block; }
	
	.menu-active nav { 
		-webkit-transform: translateY(0); 
		-moz-transform: translateY(0); 
		-ms-transform: translateY(0); 
		transform: translateY(0); 
	}
	
	#rodape .bloco { width:100%; text-align:center; }
	#rodape .bloco.mapa { display:none; }
	
	#rodape .bloco.representante { width:100%; margin-top: auto; }
	#rodape .bloco.escritorio { width:100%; }
	#rodape .bloco.suporte { width:100%; }
	
	
	.busca-menu ul { display: none; }
	.busca-menu { margin:52px 15px 0 0; }
	
	
	
	
}

@media screen and (max-width: 768px) {	
	.banner-principal { height:calc(400px - 80px); min-height:400px; }
	
	.bloco-conteudo .fotos { width:33.33333333%; }
	
	.banner-principal h1 { font-size:38px; }
	.bloco-conteudo .bloco { width:100%; }
	.form-coluna  { width:100%; padding-right:0; }	
	.form-coluna.coluna2 {  width:100%; padding-right:0; }
	
	.form-coluna.center { width:100%; margin:0; padding-right:0; }
	
	.banner-principal .chamada { width:100%; }
	.bloco-conteudo .bloco.pessoas { display:none; }
	
	
	.bloco-conteudo .receita { width:46%; margin:0 2% 4% 2%; }
	.bloco-conteudo .quebra-linha-receita { display:block; clear:both; }
	
	.bloco-conteudo .produtos {  width:50%; }

	
	.busca { display:none; }
	
	nav ul li { float:none; }
	
	.planos { width:100%; }
	.planos .icon { width:150px; border:1px solid #ccc; border-radius:50%; }
	.planos h4 { font-size:22px; font-weight:600; color:#F15A24; margin:10px 0; }
	.planos .descricao { font-size:14px; }
	.planos .valor { color:#333; }
	.planos .valor .cifra { font-size:26px; }
	.planos .valor .numero { font-size:44px; }
	.planos .botao-link { padding:15px 40px; font-size:12px; background:#39B54A; }
	.planos .botao-link:hover { background:#007AFF; }
	.planos .exemplo { font-size:14px; color:#808080; margin:10px 0 0 0; }
	
	.botao-link.suporte { padding:10px 20px; margin:0 0 50px 0; font-size:14px;  }
	
	#rodape h4 { font-size:23px; margin-bottom:10px; }
	#rodape .direitos { padding:20px 0; margin-top: 20px; }
	
}

@media screen and (max-width: 480px) {
	#header a.logo-topo { width:200px; height:80px; margin:30px 0; }
	.banner-principal { height:calc(300px - 80px); min-height:300px; }
	
	.banner-principal h1 { font-size:27px; }
	.banner-principal h3 { font-size:27px; }
	.banner-principal .descricao { font-size:18px; }
	.banner-principal .valor { float:left; width:100%; font-size:18px; color:#736357; margin-bottom:10px; }
	.banner-principal .valor .texto { margin-top:-10px; }
	.banner-principal .valor .cifra { font-size:36px; }
	.banner-principal .valor .numero { font-size:60px; }
	

	
	.bloco-conteudo .receita { width:100%; margin:0 0 10% 0; border-radius:10px; }
	.bloco-conteudo .receita img {border-radius:10px 10px 0 0; }
	.bloco-conteudo .receita .dados h2 { font-size:17px; }
	
	.bloco-conteudo .fotos { width:100%; }
	
	.bloco-conteudo .mapa-iframe { height:300px; }
	
	.bloco-conteudo h2 { font-size:28px; }
	.bloco-conteudo h3 { font-size:28px; }
	.bloco-conteudo h3.subtitulo { font-size:20px; margin-bottom:25px; }
	
	.concluido-topo { padding:20px; font-size:48px; }
	.concluido-meio { padding:20px; font-size:24px; }
	
	#rodape .bloco.representante .estados { width:100%; margin-bottom:15px; }
	#rodape .bloco.representante .estados h6 { font-size:16px; margin-bottom:7px; }
	
	.bloco-conteudo .produtos {  width:100%; }
	
}

@media screen and (max-width: 320px) {
	.bloco-conteudo h2 { font-size:24px; }
	
	.concluido-topo { padding:15px; font-size:44px; }
	.concluido-meio { padding:15px; font-size:20px; }
	
}