/* Desenvolvido por Joshua Aliaga - behance.com/joshuaaliaga */
/* CSS Resetado */

@charset "utf-8";

body {-webkit-font-smoothing: antialiased; }
.container {position: absolute; width: 100%; min-height: 100%; top: 0; left: 0; transition: all .5s }

/*Barra de Progresso*/
.pace {-webkit-pointer-events: none; pointer-events: none; -webkit-user-select: none; -moz-user-select: none; user-select: none;}
.pace-inactive {display: none;}
.pace .pace-progress {background: #f19116; position: fixed; z-index: 200; top: 0px; right: 100%; width: 100%; height: 3px;}
.bx-pager-item {display: none;}

/* Mensagem Alerta*/
.alerta {width: 300px; padding: 15px 30px 15px 50px; position: fixed; top: 100px;color: #FFF; text-align: center; font-size: 14pt; display: none; line-height: 25px; border-radius: 30px; font-weight: 500}
.alerta{-webkit-box-shadow: 0px 0px 35px -12px rgba(0,0,0,0.52);-moz-box-shadow: 0px 0px 35px -12px rgba(0,0,0,0.52); box-shadow: 0px 0px 35px -12px rgba(0,0,0,0.52);}
#sucesso {background: #29B74E  url('../imagens/enviado.webp') no-repeat; background-position: 13px center}
#erro {background: #A81F00  url('../imagens/erro.webp') no-repeat; background-position: 13px center}
#enviando {background: #577fe3 url('../imagens/enviando.gif?v=2') no-repeat; background-position: 5px center}

/* Base*/
section {width: 100%; padding: 100px 0; display: block;  }
.conteudo {width: 1440px; margin: 0 auto; min-height: 100px;}
.coluna {width: 695px; min-height: 100px;} .left {float: left;} .right {float: right;}
.topo {width: 100%; padding: 20px 0; background: #EFEFEF; position: fixed; top: 0; z-index: 101;}
.conteudo-topo {width: 1440px; margin: 0 auto;}
.logo-topo {display: block; float: left; height: 30px; cursor: pointer; transition: all .3s;}
.logo-topo:hover {transform: scale(1.2);}
.logo-rodape {display: block; height: 100px; margin: 0 auto; cursor: pointer;}
.logo-menu {display: block; width: 70px; margin: 0 auto 30px auto;}
.menu-topo {display: block; float: right; height: 30px; text-align: center; margin-right: 15px; font-size: 0}
.menu-rodape {display: block;text-align: center; margin: 20px auto; font-size: 0}
.menu-topo a, .menu-rodape a {cursor: pointer; display: inline-block; font-size: 9pt; padding: 9px 10px; transition: all .5s; border-radius: 50px; height: 15px; line-height: 15px; color: #5cb349; text-transform: uppercase; font-weight: 600}
.menu-topo span, .menu-rodape span {color: #966838; font-weight: 700; font-size: 10pt; height: 13.3px; padding: 8.38px 10px; display: inline-block;}
.menu-topo a:hover, .menu-rodape a:hover {background: #5cb349; color: #11252a;}
#contato, #contato-mobile, #quemsomos, #quemsomos-mobile, #produtos, #produtos-mobile, #clientes, #clientes-mobile {cursor: pointer;}
.bt-home {font-size: 0 !important; border-radius: 10px !important}
.bt-home img {width: 12px; height: 12px; display: inline-block; transition: all .3s}
.bt-home:hover {background: #dcc6ab !important; transform: scale(1.2);}
.bt-home:hover img {filter: filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(81deg) brightness(102%) contrast(105%);}
.sociais-topo {float: right; height: 30px;}
.sociais-topo a {height: 20px; width: 20px ;padding: 5px; display: inline-block; border-radius: 5px;}
.sociais-topo img {width: 20px; height: 20px; display: inline-block; transition: all .1s;}
.sociais-rodape {height: 50px; display: block; text-align: center; margin-bottom: 20px}
.sociais-rodape a {height: 30px; width: 30px; padding: 10px; display: inline-block; border-radius: 10px}
.sociais-rodape img {width: 30px; height: 30px; display: block; transition: all .1s;}
.sociais-rodape {height: 50px; display: block; text-align: center; margin-bottom: 20px}
.sociais-menu {display: block; text-align: center; margin-top: 30px}
.sociais-menu a {height: 30px; width: 30px; padding: 10px; display: inline-block; }
.sociais-menu img {width: 30px; height: 30px; display: block; filter: brightness(0) saturate(100%) invert(78%) sepia(21%) saturate(1071%) hue-rotate(337deg) brightness(88%) contrast(98%);}
.sociais-rodape a, .sociais-topo a, .sociais-menu a {transition: all .5s}
.sociais-topo a:hover {transform: scale(1.3); background: #208c37;}
.sociais-rodape a:hover {transform: scale(1.2); background: #208c37;}
.sociais-topo a:hover img, .sociais-rodape a:hover img {filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(81deg) brightness(102%) contrast(105%);}
.topo-mobile {width: 100%; height: 50px; background: #EFEFEF; position: fixed; top: 0; z-index: 101; display: none; text-align: center;}
.logo-topo-mobile {height: 25px; padding: 12.5px 0; margin: 0 auto; display: inline-block;}
.bt-menu-mobile, .social-topo-mobile {display: block; padding: 10px; width: 30px; height: 30px; transition: all 1s;}
.bt-menu-mobile img, .social-topo-mobile img {width: 30px; height: 30px; display: block;}
.bt-menu-mobile{float:right;} .social-topo-mobile {float: left;}
.menu-mobile {width: 200px; padding:50px 30px; background:#082a0e; top: 0; right: -260px; position: fixed; transition: all .5s; overflow: auto;}
.menu-mobile nav a {line-height: 21px; display: block; font-size: 12pt; padding: 10px 0; transition: all .5s; color: #FFFF; text-align: center; border-bottom: 0.5px solid rgba(29,70,80,.5); text-transform: uppercase; font-weight: 600}
.menu-mobile nav a:last-child {border-bottom: 0}
.bt-home-menu img {width: 15px; height: 15px; display: inline-block; filter: brightness(0) saturate(100%) invert(78%) sepia(21%) saturate(1071%) hue-rotate(337deg) brightness(88%) contrast(98%);}
.modal {position: fixed; width: 100%; min-height: 100%; top: 0; z-index: 100; background: rgba(0,0,0,0.7); display: none; transition: all .5s}
.rodape {background: #EFEFEF}
.conteudo-rodape {width: 1440px; margin: 0 auto; padding: 50px 0;}
.direitos {text-align: center; font-size: 11pt; line-height: 14pt}
.direitos br {display: none}
.direitos-menu {text-align: center; font-size: 10pt; line-height: 16px; position: absolute; bottom: 0; padding: 40px 0; color: #FFFF}
.desenvolvedor {width: 100%; padding: 20px 0; background: #5e3b19;}
.desenvolvedor a {display: block; height: 30px; width: 180px; margin: 0 auto;}
.desenvolvedor a img {display: block; height: 30px; width: 180px}
.section-contato {background: #333 url('../imagens/bg-contato.webp?v=2') no-repeat center;}
.contato {display: block; padding: 30px; background: #EFEFEF; width: 370px; margin: 0 auto; border-radius: 20px; transition: all .3s;}
.contato h3 {font-size: 25pt; color: #333; display: block; margin-bottom: 20px; text-align: center;font-weight: 900; text-transform: uppercase;}
input[type="text"], 
textarea {display: block; padding: 20px; background: #FFF; margin-bottom: 20px; width: 326px; font-size: 15pt; border-radius: 10px; border: 2px solid #333; transition: all .2s; text-align: center; color: #333}
textarea{resize: none; height: 100px; line-height: 25pt}
input[type="text"]::placeholder, 
textarea::placeholder {color: #555;}
.enviar {padding: 20px 0; width: 300px; background: #333; color: #FFF; font-size: 13pt; font-weight: 500; text-align: center; margin: 0 auto; display: block; transition: all .3s; border-radius: 50px; cursor: pointer; text-transform: uppercase;}
.enviar:hover {background: #555;}
.tela-loading {width: 100%; min-height: 100%; background: #104e1c; position: fixed;  top:0; z-index: 150;}
.imagem-loading {width: 200px; height:200px; display: block; position: fixed; top: 0; z-index: 150}
.banner-pagina {width: 100%; padding: 462px 0 30px 0; background: #ccc url('../imagens/bg-banner.webp?v=2') no-repeat center;}
.conteudo-banner {display: block; margin: 0 auto; width: 1440px; text-align: center;}
.icone-banner {width: 30px; height: 30px; margin: 20px auto 0 auto; display: block; transition: all .5s; cursor: pointer; filter: brightness(0) saturate(100%) invert(79%) sepia(15%) saturate(427%) hue-rotate(353deg) brightness(100%) contrast(89%);}
.icone-banner:hover {transform: scale(1.5); filter: brightness(0) saturate(100%) invert(57%) sepia(46%) saturate(4863%) hue-rotate(85deg) brightness(110%) contrast(97%);}
.txt-pag {display: block;}
.txt-pag p, .txt-pag p strong, .txt-pag ul li, .txt-pag ul li strong {font-size: 15pt; line-height: 25pt;}
.txt-pag p {margin-bottom: 20px;} .txt-pag p:last-child {margin-bottom: 0}
.txt-pag h3 {font-size: 23pt; font-weight: 700; margin-bottom: 20px; line-height: 30pt; color: #5cb349}
.txt-pag ul {margin-left: 16px; margin-bottom: 20px;}
.txt-pag ul li {list-style-image: url('../imagens/list.webp'); margin-bottom: 20px;}
.txt-pag ul li:last-child {margin-bottom: 0}
.imagem-pagina {display: block; width: 90%; margin: 0 auto; background: #CCC}
.titulo-pagina {display: block; font-size: 30pt; font-weight: 900; color: #0b7535; text-transform: uppercase; margin-bottom: 50px}
.conteudo-banner-home {display: block; margin: 0 auto;}
.conteudo-banner-home h1 {display: block; font-size: 30pt; font-weight: 600; color: #FFF; text-transform: uppercase; margin-bottom: 20px; line-height: 53px;}
.section-produtos {background: #dcc6ab url('../imagens/bg-produtos.png?v=2'); }
.selos {display: block; text-align: center;}
.selos img {display: inline-block; width: 201px;height: 201px; margin: 0 20px;}
.selos img:first-child{margin-left: 0}.selos img:last-child{margin-right: 0}
.logo-clientes {display: block;}
.logo-clientes img {display: inline-block; width: 215px; margin: 0 10px 20px 10px; text-align: center; transition: all .3s; filter: grayscale(1); cursor: pointer;}
.logo-clientes img:hover {transform: scale(1.2); filter: grayscale(0);}
.base-produtos {display: block; text-align: center;}
.itens-produtos {width: 264px; height: 335px; display: inline-block; margin: 0 10px 10px 10px; cursor: pointer;transition: all .3s; overflow: hidden;}
.itens-produtos:hover {
	transform: scale(1.2); background: #077235;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.30);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.30);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.30);
}
.itens-produtos:hover h1{color: #FFF}
.itens-produtos img {display: block; width: 264px; height: 264px; background: #CCC; margin-bottom: 10px;}
.itens-produtos h1 {display: block; font-size: 11pt; line-height: 13pt; font-weight: 700; text-align: center; padding: 0 10px 10px 10px; color: #67411c; text-transform: uppercase;}
.itens-produtos p{display: none;}
.painel-produtos {width: 800px; background: #FFF; position: fixed; display: none; top: 100px; z-index: 101; padding: 20px;}
.coluna-painel {width: 390px;}
.coluna-painel img {width: 390px; display: block;}
.coluna-painel h1 {display: block; font-size: 25pt; font-weight: 900; color: #67411c; text-transform: uppercase; margin-bottom: 20px; line-height: 40px;}
.coluna-painel p {font-size: 13pt; line-height: 20pt;}

.botao-painel-produto {margin-top: 30px; text-align: center;}
.botao-painel-produto a {display: inline-block; border-radius: 10px; width: 360px; padding: 10px; text-align: center; color: #FFF; cursor: pointer; text-transform: uppercase; font-weight: 700; font-size: 15px; transition: all .3s; margin: 0 5px}
.fechar-painel-produtos {background: #790a0a;}.contato-produtos {background: #0b7535;}



.fechar-painel-produtos:hover {background: #2e4b08}
.modal-painel-produtos {position: fixed; width: 100%; min-height: 100%; top: 0; z-index: 100; background: rgba(0,0,0,0.7); display: none}
.whatsapp {cursor: pointer;}
.painel-whatsapp {position: fixed; top: 70px; padding: 0 20px; border-radius: 20px; background: #104e1c; z-index: 101; width: 310px; display: none;}
.painel-whatsapp a {display: block; height: 40px; width: 100%; padding: 20px 0;transition: all .3s}
.painel-whatsapp a:hover img {transform: scale(1.2); filter: brightness(0) saturate(100%) invert(100%) sepia(21%) saturate(7091%) hue-rotate(303deg) brightness(107%) contrast(77%);}
.painel-whatsapp a:hover p {filter: brightness(0) saturate(100%) invert(100%) sepia(21%) saturate(7091%) hue-rotate(303deg) brightness(107%) contrast(77%);}
.painel-whatsapp a img{display: block; float: left; width: 40px; filter: brightness(0) saturate(100%) invert(99%) sepia(1%) saturate(4092%) hue-rotate(314deg) brightness(123%) contrast(100%); transition: all .3s}
.painel-whatsapp p {display: block; float: right; color: #FFF; font-size: 12px; text-transform: uppercase; padding: 2px 0; width: 265px}
.painel-whatsapp p strong {color: #FFF; font-weight: 700;font-size: 25px; text-transform: uppercase;}
.painel-whatsapp a:last-child {border-bottom: 1px solid}

.contato-quemsomos {display: block; width: 300px; padding: 10px; background: #0b7535; font-weight: 700; text-transform: uppercase; border-radius: 5px; cursor: pointer; color: #FFF; transition: all .3s; margin-top: 30px; text-align: center;}
.contato-quemsomos:hover {background: #5e3b19; color: #dcc6ab}
.txt-quemsomos {text-align: justify;}

.menu-mobile {
	-webkit-box-shadow: inset 0px 0px 10px 0px rgba(0,0,0,0.30);
	-moz-box-shadow: inset 0px 0px 10px 0px rgba(0,0,0,0.30);
	box-shadow: inset 0px 0px 10px 0px rgba(0,0,0,0.30);
}

.topo, .topo-mobile, .contato,.painel-produtos, .painel-produtos,
.painel-whatsapp {
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.30);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.30);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.30);
}




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


/*CSS Responsivo*/

@media only screen and (max-width: 1440px) {

	.conteudo, .conteudo-rodape, .conteudo-topo, .conteudo-banner {width: 1366px;}
	.coluna {width: 658px}
	.selos img {width: 189px;height: 189px;}
	.logo-clientes img {width: 203px;}
	.itens-produtos {width: 249px; height:335px }
	.itens-produtos img {width: 249px; height:249px}

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

}

@media only screen and (max-width: 1366px) {

	.conteudo, .conteudo-rodape, .conteudo-topo, .conteudo-banner {width: 1280px;}
	.coluna {width: 615px}
	.selos img {width: 175px;height: 175px;}
	.logo-clientes img {width: 189px;}
	.itens-produtos {width: 232px; height: 295px}
	.itens-produtos img {width: 232px; height:232px}

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

}

@media only screen and (max-width: 1280px) {

	.conteudo, .conteudo-rodape, .conteudo-topo, .conteudo-banner {width: 1155px;}
	.coluna {width: 552.5px}
	.banner-pagina {padding: 409px 0 30px 0;}
	.selos {margin: 124px 0}
	.selos img {width: 154px;height: 154px;}
	.logo-clientes img {width: 207px;}
	.itens-produtos {width: 207px; height: 275px}
	.itens-produtos img {width: 207px; height:207px}

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

}

@media only screen and (max-width: 1155px) {

	.conteudo, .conteudo-rodape, .conteudo-topo, .conteudo-banner {width: 1024px;}
	.coluna {width: 487px}
	.selos img {width: 132px;height: 132px;}
	.logo-clientes img {width: 232px;}
	.itens-produtos {width: 180px; }
	.itens-produtos img {width: 180px; height:180px}

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

}

@media only screen and (max-width: 1024px) {

	.conteudo, .conteudo-rodape, .conteudo-topo, .conteudo-banner {width: 900px;}
	.coluna {width: 425px;}
	.contato {width: 385px; padding: 20px}
	input[type="text"], textarea {width: 341px;}
	.sociais-topo {display: none;}
	.selos img {width: 111px;height: 111px;}
	.logo-clientes img {width: 276px;}
	.itens-produtos {width: 156px; height:260px}
	.itens-produtos img {width: 156px; height:156px}

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


}

@media only screen and (max-width: 800px) {

	.conteudo, .conteudo-rodape, .conteudo-topo, .conteudo-banner {width: 85%;}
	.coluna {width: 100%;  margin-bottom: 20px}
	.logo-topo {float: none; margin: 0 auto 30px auto; height: 40px;}
	.menu-topo {float: none; margin: 0 auto;}
	.alerta {top: 170px}
	.bg-home {background-position: -388px 0;}
	.banner-pagina {padding: 357px 0 30px 0;}
	.titulo-pagina {text-align: center;}
	.txt-pag p {text-align: center;}
	.selos img {width: 196px;height: 196px;}
	.logo-clientes {text-align: center;}
	.logo-clientes img {width: 203px;}
	.itens-produtos {width: 146px; }
	.itens-produtos img {width: 146px; height:146px}
	.painel-produtos {width: 85%; top: 170px}
	.coluna-painel {width: 48%;}
	.coluna-painel img {width: 100%}
	.botao-painel-produto a {width: 300px;}
	.selos {margin: 50px 0 0 0}
	.contato-quemsomos {margin: 30px auto 0 auto;}

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


}

@media only screen and (max-width: 500px) {

	.alerta {width: calc(85% - 80px); top: 70px}
	.conteudo, .conteudo-rodape, .conteudo-banner{width: 85%;}
	.topo {display: none}.topo-mobile {display: block;}
	.coluna {width: 100%;}
	.direitos br {display: block}
	.direitos span {display: none}
	.contato h3 {font-size: 20pt}
	.contato {width: calc(100% - 40px);}
	input[type="text"], textarea {width: calc(100% - 44px);;}
	.enviar {width: 240px;}
	.imagem-pagina {width: 280px}
	.menu-rodape a {display: block;}
	.menu-rodape span {display: none}
	.banner-pagina {padding: 330px 0 30px 0; background: #ccc url('../imagens/bg-banner-mobile.webp?v=1') no-repeat center;}
	.conteudo-banner-home h1 {font-size: 17px; line-height: 30px}
	.titulo-pagina {text-align: center;}
	.txt-pag p {text-align: center;}
	.selos img {width: 80px;height: 80px; margin: 0 5px}
	.logo-clientes img {width: 113px; filter: grayscale(0);}
	.itens-produtos {width: 130px; height:183px}
	.itens-produtos img {width: 130px; height:130px}
	.itens-produtos h1 {font-size: 8pt; line-height: 10pt;}
	.left, .right {float: none;}
	.painel-produtos {width: 70%; height: 650px; top: 70px; overflow: scroll;}
	.coluna-painel {width: 100%; margin-bottom: 20px}
	.coluna-painel img {width: 100%}
	.coluna-painel h1{margin-bottom: 20px; text-align: center;font-size: 17pt;line-height: 23px;}
	.coluna-painel p{ text-align: center; font-size: 13pt; line-height: 20pt;}
	.botao-painel-produto a {display: block; width: 90%;}
	.contato-produtos {margin-bottom: 20px !important;}
	/*--------------------------------------------------*/




}



