@charset "utf-8";

#paginas { float: left; width: 100%; min-height: 400px; position: relative;}

#titulo { float: left; width: 100%;}
#titulo h1 { float: left; width: 100%; padding: 40px 0 15px; background-color: rgb(218, 218, 218); text-transform: uppercase; font-weight: bold; text-align: center; font-size: 1.7em; color: rgb(70, 84, 91); line-height: 1.1;}

#texto { float: left; width: 100%;}
#texto .simples { float: left; width: 100%;}
#texto .simples h5 { float: left; width: 100%; margin: 20px 0 0; text-align: center; font-size: 1.1em; color: rgb(70, 84, 91)}
#texto .destaque { float: left; width: 100%; margin: 20px 0 0;}
#texto .destaque h2 { float: left; width: 90%; margin: 8px 5% 10px; text-align: center; font-weight: bold; font-size: 1.4em; line-height: 1.2;}
#texto .destaque h5 { float: left; width: 40%; padding: 0 0 20px; margin: 0 30% 20px; border-bottom: 2px dotted rgb(210, 210, 210); text-align: center; font-size: 1.2em; color: rgb(70, 84, 91)}
#texto .open { float: left; width: 50%; margin: 0 25%;}
#texto .open .item { float: left; width: 100%; margin: 0 0 5px;}
#texto .open .item h3 { float: left; width: 92%; position: relative; padding: 14px 4% 12px; background-color: rgb(210, 210, 210); font-size: 1em; line-height: 1.2; cursor: pointer; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px;}
#texto .open .item h3 em { position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
#texto .open .item h3 em.fecha { display: none;}
#texto .open .item h4 { float: left; width: 83%; margin: 0 0 10px 7%; padding: 10px 3%; display: none; border: 1px solid rgb(180, 180, 180); border-top: 0; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px;}
#texto .open .item:hover h3 { background-color: rgb(121, 132, 138); color: rgb(218, 218, 218);}
#texto .open .item.ativo h3 { background-color: rgb(121, 132, 138); color: rgb(218, 218, 218);}
#texto .redes { float: left; width: 100%; height: 40px; margin: 20px 0; text-align: center;}
#texto .redes .ico { width: 40px; padding: 20px; margin: 0 2px; background-color: rgb(70, 84, 91); background-position: 50%; background-repeat: no-repeat; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px;}
#texto .redes .ico.telegram { background-image: url('../imagens/telegram.png');}
#texto .redes .ico.instagram { background-image: url('../imagens/instagram.png');}
#texto .redes .ico.facebook { background-image: url('../imagens/facebook.png');}
#texto .redes .ico:hover { background-color: rgb(32 41 46);}

#margem { float: left; width: 100%; height: 160px;}

#banners { float: left; width: 100%; min-height: 140px; position: relative;}
#banners .fundo { float: left; width: 100%;}
#banners .fundo.m { display: none;}
#banners .slides { float: left; width: 100%; position: relative; z-index: 1;}
#banners .slides, .slides > li, .flex-control-nav { float: left; margin: 0; padding: 0; list-style: none;}
#banners .slides > li { display: none;}
#banners .slides > li .img { float: left; width: 100%;}
#banners .slides > li .youtube { float: left; width: 100%; position: relative;}
#banners .slides > li .youtube .naoplay { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 5;}
#banners .slides > li .youtube .iframe { position: relative; width: 100%; padding-bottom: 31.5%; overflow: hidden;}
#banners .slides > li .youtube .iframe iframe { position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
#banners .flex-direction-nav { display: none;}
#banners .flex-control-nav { position: absolute; width: 90%; left: 5%; bottom: -15px; z-index: 3; text-align: center;}
#banners .flex-control-paging li a { float: left; width: 25px; height: 25px; margin: 0 5px; background-color: rgb(218, 218, 218); border: 5px solid rgb(255, 255, 255); cursor: pointer; display: block; font-size: 0; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px;}
#banners .flex-control-paging li a:hover { background-color: rgb(70, 84, 91);}
#banners .flex-control-paging li a.flex-active { float: right; background-color: rgb(70, 84, 91);}

#destaques { float: left; width: 100%; position: relative; z-index: 2;}
#destaques .icone { position: absolute; width: 100%; height: 200px; top: -100px; left: 0; background-image: url('../imagens/destaques-icone.png?v1'); background-position: 50%; background-repeat: no-repeat;}
#destaques .subtitulo { float: left; width: 100%;}
#destaques .subtitulo h1 { float: left; width: 100%; margin: 120px 0 0; text-transform: uppercase; text-align: center; font-size: 2em; line-height: 1;}
#destaques .subtitulo h2 { float: left; width: 100%; text-transform: uppercase; text-align: center; font-size: 1.7em; line-height: 1;}
#destaques .subtitulo b { padding: 10px 20px 8px; border: 2px solid rgb(210, 210, 210); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
#destaques .subtexto { float: left; width: 100%;}
#destaques .subtexto h3 { float: left; width: 30%; margin: 30px 35% 0; text-align: center; font-size: 1em; color: rgb(70, 84, 91);}
#destaques .subtexto h4 { float: left; width: 60%; margin: 30px 20% 0; text-align: center; font-size: 1em; color: rgb(70, 84, 91);}
#destaques .setas { float: left; width: 90%; height: 60px; position: relative; margin: 10px 5% 40px; overflow: hidden;}
#destaques .setas .tab { position: absolute; width: 50%; height: 60px; top: 0; background-position: 50%; background-repeat: no-repeat;}
#destaques .setas .tab.um { left: 0; background-image: url('../imagens/seta-um.png');}
#destaques .setas .tab.dois { right: 0; background-image: url('../imagens/seta-dois.png');}
#destaques .lado { float: left; width: 40%; margin: 0 5% 20px;}

#blog { float: left; width: 100%; min-height: 325px; background-color: rgb(218, 218, 218);}
#blog .baico { float: left; width: 100%; position: relative; overflow: hidden;}
#blog .baico .barra { position: absolute; width: 100%; top: 0; left: 0;}
#blog .baico .ico { float: left; width: 100%; height: 200px; position: relative; z-index: 1; background-image: url('../imagens/blog-ico.png'); background-position: 50%; background-repeat: no-repeat;}
#blog .conteudo { float: left; width: 94%; margin: 10px 3% 20px;}
#blog .conteudo .tab { float: left; width: 21%; margin: 10px 2%;}
#blog .conteudo .tab .imagem { float: left; width: 100%; position: relative;}
#blog .conteudo .tab .imagem .selo { position: absolute; right: 8px; bottom: 8px; z-index: 2; padding: 4px 5px 2px; background-color: rgb(255, 255, 255); text-transform: uppercase; font-style: normal; font-size: 0.8em; color: rgb(56, 64, 59); line-height: 1;}
#blog .conteudo .tab .imagem .selo:hover { background-color: rgb(210, 210, 210);}
#blog .conteudo .tab .imagem .img { float: left; width: 100%;}
#blog .conteudo .tab .detalhes { float: left; width: 100%;}
#blog .conteudo .tab .detalhes h3 { float: left; width: 100%; margin: 8px 0 5px; font-size: 0.9em; line-height: 1.3; color: rgb(70, 84, 91);}
#blog .conteudo .tab:hover .detalhes h3 { color: rgb(79, 140, 175);}
#blog .conteudo .linha2 { float: left; width: 100%; height: 1px; display: none;}
#blog .conteudo .linha4 { float: left; width: 100%; height: 1px;}
#blog .velas-top { float: left; width: 100%; height: 30px; position: relative; z-index: 3; background-color: rgb(218, 218, 218); background-image: url('../imagens/velas-top.png'); background-position: 50%;}

#opcoes { float: left; width: 100%; position: relative; margin: 20px 0 18px; text-align: center; line-height: 1;}
#opcoes b { padding: 0 4px; text-transform: uppercase; font-size: 0.9em; color: rgb(70, 84, 91); font-weight: bold;}
#opcoes a { padding: 0 20px; border-right: 2px solid rgb(210, 210, 210); text-transform: uppercase; font-size: 0.9em; color: rgb(70, 84, 91);}
#opcoes a.ultimo { border-right: 0;}
#opcoes a:hover { color: rgb(0, 0, 0);}

#cotacao { float: left; width: 100%; background-color: rgb(32 41 46); display: none;}
#cotacao .subtitulo { float: left; width: 100%;}
#cotacao .subtitulo h2 { float: left; width: 100%; padding: 15px 0 10px; background-color: rgb(27, 35, 39); text-transform: uppercase; font-weight: bold; text-align: center; line-height: 1; font-size: 2em; color: rgb(180, 180, 180);}
#cotacao .ajax .tab { float: left; width: 16.66%; padding: 27px 0 22px; color: rgb(210, 210, 210);}
#cotacao .ajax .tab h2 { float: left; width: 100%; text-align: center; font-weight: bold; font-size: 1.1em;}
#cotacao .ajax .tab h3 { float: left; width: 100%; text-align: center; font-size: 0.9em;}
#cotacao .ajax .tab h4 { float: left; width: 100%; margin: 2px 0 0; text-align: center; font-size: 0.9em;}
#cotacao .ajax .tab h4.s1 { color: rgb(12, 212, 22);}
#cotacao .ajax .tab h4.s2 { color: rgb(247, 108, 108);}
#cotacao .opcoes { float: left; width: 100%; padding: 7px 0; margin: 10px 0 0; background-color: rgb(56, 64, 59); text-align: center;}
#cotacao .opcoes b { padding: 0 10px; font-size: 0.9em; color: rgb(210, 210, 210); cursor: pointer;}
#cotacao .opcoes b.dois { border-left: 1px solid rgb(121, 132, 138);}
#cotacao .opcoes b.ativo { color: rgb(255, 242, 126);}

#consultorias { float: left; width: 100%; padding: 50px 0 20px;}
#consultorias .subtitulo { float: left; width: 100%;}
#consultorias .subtitulo h2 { float: left; width: 100%; text-transform: uppercase; text-align: center; line-height: 1; font-size: 2em;}
#consultorias .subtitulo h2 b { font-size: 1.2em;}
#consultorias .tab { float: left; width: 26.65%; margin: 50px 0 0 5%; position: relative;}
#consultorias .nome { position: absolute; width: 80%; top: -30px; left: 10%; z-index: 1;}
#consultorias .nome h2 { float: left; width: 100%; padding: 22px 0 20px; background-color: rgb(70, 84, 91); text-transform: uppercase; font-weight: bold; text-align: center; font-size: 1.2em; color: rgb(210, 210, 210); line-height: 1; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}
#consultorias .fundo { float: left; width: 100%; padding: 40px 0 10px; border: 1px solid rgb(210, 210, 210); -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}
#consultorias .lista { float: left; width: 90%; padding: 0 5%; position: relative;}
#consultorias .lista h3 { float: left; width: 90%; position: relative; padding: 15px 5% 13px; text-align: center; line-height: 1.1; font-size: 0.9em;}
#consultorias .lista b { position: absolute; width: 18px; height: 18px; top: 14px; left: -8px; background-image: url('../imagens/ok.png'); background-position: 50%; background-repeat: no-repeat;}
#consultorias .lista em { float: left; width: 80%; height: 1px; margin: 0 10%; border-bottom: 2px dotted rgb(210, 210, 210);}
#consultorias .botao { float: left; width: 70%; padding: 17px 5% 15px; margin: 10px 10%; background-color: rgb(210, 210, 210); text-transform: uppercase; text-align: center; font-weight: bold; font-size: 1em; color: rgb(70, 84, 91); -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}
#consultorias .botao:hover { background-color: rgb(32 41 46); color: rgb(210, 210, 210);}

#depoimentos { float: left; width: 100%; padding: 20px 0;}
#depoimentos .subtitulo { float: left; width: 100%;}
#depoimentos .subtitulo h2 { float: left; width: 100%; padding: 11px 0 5px; background-color: rgb(210, 210, 210); text-transform: uppercase; font-weight: bold; text-align: center; line-height: 1; font-size: 2em;}
#depoimentos .tab { float: left; width: 50%; margin: 30px 25% 20px; position: relative;}
#depoimentos .tab .imagem { position: absolute; width: 100%; top: 0; left: 0; text-align: center;}
#depoimentos .tab .imagem img { height: 70px; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px;}
#depoimentos .tab .descricao { float: left; width: 100%; margin: 80px 0 0;}
#depoimentos .tab .descricao h2 { float: left; width: 100%; text-align: center; font-weight: bold; font-size: 1.4em; line-height: 1; color: rgb(70, 84, 91);}
#depoimentos .tab .descricao h3 { float: left; width: 100%; text-align: center; font-style: normal; font-size: 0.8em; color: rgb(70, 84, 91);}
#depoimentos .tab .descricao h4 { float: left; width: 80%; position: relative; padding: 0 10%; margin: 10px 0 0; text-align: center; font-size: 1em; color: rgb(70, 84, 91);}
#depoimentos .tab .descricao h4 i { position: absolute; width: 20px; height: 20px; background-position: 50%; background-repeat: no-repeat;}
#depoimentos .tab .descricao h4 i.aspas-abre { top: 0; left: 0; background-image: url('../imagens/aspas-abre.png');}
#depoimentos .tab .descricao h4 i.aspas-fecha { bottom: 0; right: 0; background-image: url('../imagens/aspas-fecha.png');}
#depoimentos .tab:hover .descricao h2 { color: rgb(32 41 46);}
#depoimentos .tab:hover .descricao h4 { color: rgb(32 41 46);}

#metodos { float: left; width: 100%;}
#metodos .subtitulo { float: left; width: 100%;}
#metodos .subtitulo h2 { float: left; width: 100%; padding: 12px 0 8px; background-color: rgb(70, 84, 91); text-transform: uppercase; font-weight: bold; text-align: center; line-height: 1; font-size: 1.2em; color: rgb(180, 180, 180);}
#metodos .logos { float: left; width: 90%; margin: 15px 5%; text-align: center;}
#metodos .logos .img { width: 200px; max-width: 47%; margin: 1%;}

#servicos { float: left; width: 100%; padding: 0 0 30px;}
#servicos .subtitulo { float: left; width: 100%;}
#servicos .subtitulo h2 { float: left; width: 100%; padding: 12px 0 8px; background-color: rgb(70, 84, 91); text-transform: uppercase; font-weight: bold; text-align: center; line-height: 1; font-size: 1.2em; color: rgb(180, 180, 180);}
#servicos .tab { float: left; width: 24%; padding: 3%; margin: 20px 0 0 2.5%; background-color: rgb(210, 210, 210); -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}
#servicos .tab h2 { float: left; width: 100%; font-weight: bold; font-size: 2.2em; line-height: 1;}
#servicos .tab h3 { float: left; width: 100%; padding: 15px 0 0; margin: 15px 0 0; border-top: 1px solid rgb(121, 132, 138); font-size: 1.1em; line-height: 1.4; color: rgb(70, 84, 91);}
#servicos .tab a { float: left; padding: 15px 20px 13px; margin: 15px 0 0; background-color: rgb(70, 84, 91); text-transform: uppercase; font-weight: bold; font-size: 1.1em; color: rgb(210, 210, 210); -webkit-border-radius: 2px; -webkit-border-top-right-radius: 100px; -webkit-border-bottom-right-radius: 100px; -moz-border-radius: 2px; -moz-border-radius-topright: 100px; -moz-border-radius-bottomright: 100px; border-radius: 2px; border-top-right-radius: 100px; border-bottom-right-radius: 100px;}
#servicos .tab a:hover { background-color: rgb(32 41 46);}

#portfolio { float: left; width: 94%; min-height: 325px; padding: 10px 3% 20px; background-color: rgb(218, 218, 218);}
#portfolio .conteudo { display: flex; flex-wrap: wrap;}
#portfolio .tab { float: left; width: 21%; margin: 10px 2%;}
#portfolio .tab .imagem { float: left; width: 100%; position: relative;}
#portfolio .tab .imagem .selo { position: absolute; right: 8px; bottom: 8px; z-index: 2; padding: 4px 5px 2px; background-color: rgb(255, 255, 255); text-transform: uppercase; font-style: normal; font-size: 0.8em; color: rgb(56, 64, 59); line-height: 1;}
#portfolio .tab .imagem .selo:hover { background-color: rgb(210, 210, 210);}
#portfolio .tab .imagem .img { float: left; width: 100%;}
#portfolio .tab .detalhes { float: left; width: 100%;}
#portfolio .tab .detalhes h3 { float: left; width: 100%; margin: 8px 0 5px; font-size: 0.9em; line-height: 1.3; color: rgb(70, 84, 91);}
#portfolio .tab:hover .detalhes h3 { color: rgb(79, 140, 175);}

#comentarios { float: left; width: 100%; margin: 40px 0 0; position: relative;}
#comentarios .apresenta { float: left; width: 100%;}
#comentarios .apresenta h2 { float: left; width: 100%; font-weight: bold; font-size: 1.5em;}
#comentarios .add { float: left; width: 100%;}
#comentarios .add .c1 { float: left; width: 100%;}
#comentarios .add .c2 { float: left; width: 49%; margin: 18px 0 0;}
#comentarios .add .c2.a { float: left;}
#comentarios .add .c2.b { float: right;}
#comentarios .add .nomecampo { float: left; width: 100%; font-size: 0.9em;}
#comentarios .add .nomecampo em { font-style: normal; color: rgb(255, 0, 0);}
#comentarios .add .campo { float: left; width: 95.2%; height: 50px; padding: 1px 2%; border: 1px solid rgb(210, 210, 210);}
#comentarios .add .campo:focus { border: 1px solid rgb(89, 181, 255); -webkit-box-shadow: 0 0 10px 0 rgb(0 0 0 / 20%); -moz-box-shadow: 0 0 10px 0 rgb(0 0 0 / 20%); box-shadow: 0 0 10px 0 rgb(0 0 0 / 20%);}
#comentarios .add .escolha { float: left; width: 100%; height: 54px; padding: 1px 2%; border: 1px solid rgb(210, 210, 210);}
#comentarios .add .escolha:focus { border: 1px solid rgb(89, 181, 255); -webkit-box-shadow: 0 0 10px 0 rgb(0 0 0 / 20%); -moz-box-shadow: 0 0 10px 0 rgb(0 0 0 / 20%); box-shadow: 0 0 10px 0 rgb(0 0 0 / 20%);}
#comentarios .add .textarea { float: left; width: 97.5%; height: 80px; padding: 15px 1%; border: 1px solid rgb(210, 210, 210);}
#comentarios .add .textarea:focus { border: 1px solid rgb(89, 181, 255); -webkit-box-shadow: 0 0 10px 0 rgb(0 0 0 / 20%); -moz-box-shadow: 0 0 10px 0 rgb(0 0 0 / 20%); box-shadow: 0 0 10px 0 rgb(0 0 0 / 20%);}
#comentarios .add .botao { float: left; padding: 17px 20px 15px; margin: 10px 0 0; background-color: rgb(70, 84, 91); color: rgb(255, 255, 255); text-transform: uppercase; font-weight: bold; font-size: 1em; cursor: pointer;}
#comentarios .add .botao:hover { background-color: rgb(32 41 46);} 
#comentarios .lista { float: left; width: 100%; min-height: 80px; border-top: 2px dashed rgb(210, 210, 210);}
#comentarios .lista .tab { float: left; width: 100%; margin: 20px 0 0; position: relative;}
#comentarios .lista .tab .ico { position: absolute; width: 60px; height: 60px; top: 0; left: 0; background-color: rgb(218, 218, 218); background-image: url("../imagens/comentario.png?v1"); background-repeat: no-repeat; background-position: 50%; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px;}
#comentarios .lista .tab .comentario { padding: 0 0 0 70px;}
#comentarios .lista .tab .comentario h2 { float: left; width: 100%; line-height: 1.2; font-weight: bold; font-size: 1.5em;}
#comentarios .lista .tab .comentario h3 { float: left; width: 100%; margin: 10px 0; font-size: 1em;}
#comentarios .lista .tab .comentario h4 { float: left; width: 100%; font-size: 0.8em; color: rgb(121, 132, 138);}
#comentarios .lista .tab .comentario em { float: left; width: 100%; height: 1px; margin: 8px 0 0; background-color: rgb(180, 180, 180);}
#comentarios .lista .tab.resposta { float: right; width: 90%;}
#comentarios .aviso { float: left; width: 100%;}
#comentarios .aviso .sucesso { float: left; width: 96%; padding: 14px 2% 12px; margin: 12px 0 0; background-color: rgb(143, 221, 189); text-transform: uppercase; text-align: center; font-size: 1em; color: rgb(56, 64, 59); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
#comentarios .aviso .erro { float: left; width: 96%; padding: 14px 2% 12px; margin: 12px 0 0; background-color: rgb(236, 161, 161); text-transform: uppercase; text-align: center; font-size: 1em; color: rgb(173, 89, 89); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
#comentarios .aviso .vazio { float: left; width: 100%; margin: 20px 0 0; font-style: italic; font-size: 1em; color: rgb(70, 84, 91);}
#comentarios .paginacao { cursor: pointer; padding: 10px 20px 8px; margin: 12px 0 0; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px;}
#comentarios .paginacao.avancar { float: right; background-color: rgb(143, 221, 189);}
#comentarios .paginacao.recuar { float: left; background-color: rgb(236, 161, 161);}
#comentarios .paginacao.avancar:hover { background-color: rgb(122, 192, 163);}
#comentarios .paginacao.recuar:hover { background-color: rgb(211, 139, 139);}
#comentarios .rolagem { float: left; width: 100%; height: 1px;}
#comentarios .espacao { float: left; width: 100%; position: relative; padding: 0 0 10px; margin: 20px 0 10px;}
#comentarios .loader { position: absolute; width: 104%; height: 100%; display: none; top: 0; left: -2%; z-index: 50; background-color: rgba(0,0,0,0.30); background-image: url("../imagens/loader.gif"); background-position: 50%; background-repeat: no-repeat;}

#carousel { float: left; width: 86%; padding: 0 7%; position: relative; z-index: 1;}
#carousel .owl-carousel { float: left; width: 100%; -webkit-tap-highlight-color: transparent; position: relative; z-index: 1; display: none;}
#carousel .owl-carousel.owl-loaded { display: block;}
#carousel .owl-carousel.owl-loading { opacity: 0; display: block;}
#carousel .no-js .owl-carousel { display: block;}
#carousel .owl-stage-outer { position: relative; overflow: hidden;}
#carousel .owl-stage-outer .owl-item { float: left; position: relative; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none;}
#carousel .owl-stage-outer .owl-item .item { float: left; width: 100%;}
#carousel .owl-nav { position: absolute; width: 100%; top: 47%; left: 0;}
#carousel .owl-nav button { position: absolute; width: 24px; top: 0; padding: 12px 0; opacity: 0.9; background-color: transparent; background-position: 50%; background-repeat: no-repeat; cursor: pointer; font-size: 0; border: 0; outline: 0;}
#carousel .owl-nav button.owl-prev { left: -50px; background-image: url('../imagens/carousel-prev.png');}
#carousel .owl-nav button.owl-next { right: -50px; background-image: url('../imagens/carousel-next.png');}
#carousel .owl-nav button:hover { opacity: 1;}
#carousel .owl-nav button.disabled { opacity: 0.5;}
#carousel .owl-dots { display: none;}

#contato { float: left; width: 100%;}
#orcamento { float: left; width: 100%;}

#email { float: left; width: 100%;}
#email .aviso { display: none; float: left; width: 100%; margin: 10px 0 0; position: relative;}
#email .aviso .msg { float: left; width: 90%; padding: 18px 5% 15px; background-color: rgb(255, 242, 126); color: rgb(0, 0, 0); font-size: 1em; line-height: 1.1; text-align: center;}
#email .aviso .fechar { position: absolute; top: 15px; right: 15px; font-size: 1.3em;}
#email .form { float: left; width: 40%; margin: 0 30% 25px;}
#email .form .c1 { float: left; width: 100%;}
#email .form .c2 { float: left; width: 25%;}
#email .form .c3 { float: right; width: 70%;}
#email .form .nomecampo { float: left; width: 100%; margin: 22px 0 3px; font-style: italic; font-size: 1em;} 
#email .form .nomecampo em { font-style: normal; color: rgb(255, 0, 0);}
#email .form .campo { float: left; width: 95%; height: 60px; padding: 1px 2% 0; border: 1px solid rgb(210, 210, 210); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
#email .form .campo:focus { border: 1px solid rgb(89, 181, 255); -webkit-box-shadow: 0 0 10px 0 rgb(0 0 0 / 20%); -moz-box-shadow: 0 0 10px 0 rgb(0 0 0 / 20%); box-shadow: 0 0 10px 0 rgb(0 0 0 / 20%);} 
#email .form .textarea { float: left; width: 95%; height: 120px; padding: 5px 2% 0; border: 1px solid rgb(210, 210, 210); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;} 
#email .form .textarea:focus { border: 1px solid rgb(89, 181, 255); -webkit-box-shadow: 0 0 10px 0 rgb(0 0 0 / 20%); -moz-box-shadow: 0 0 10px 0 rgb(0 0 0 / 20%); box-shadow: 0 0 10px 0 rgb(0 0 0 / 20%);} 
#email .form .botao { float: left; padding: 15px 30px 13px; margin: 10px 0 0; background-color: rgb(70, 84, 91); color: rgb(255, 255, 255); text-transform: uppercase; font-weight: bold; cursor: pointer; font-size: 1.2em; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
#email .form .botao:hover { background-color: rgb(32 41 46);} 

@media only screen and (max-width: 1000px){
  #paginas { top: -35px;}

  #titulo h1 { padding: 45px 0 10px; background-color: rgb(180, 180, 180);}

  #texto .destaque h5 { width: 90%; margin: 0 5% 20px;}
  #texto .open { width: 90%; margin: 0 5%;}

  #margem { height: 0;}

  #banners { top: -35px;}

  #destaques .icone { height: 120px; top: -60px; background-size: 120px;}

  #blog .baico .barra { width: 140%; left: -20%;}
  #blog .conteudo .tab { width: 46%;}
  #blog .conteudo .linha2 { display: block;}
  #blog .conteudo .linha4 { display: none;}

  #cotacao .ajax .tab { width: 33.33%;}

  #consultorias .tab { width: 90%;}
  #depoimentos .tab { width: 90%; margin: 30px 5% 20px;}
  #servicos .tab { width: 84%; margin: 20px 0 0 5%;}
  #portfolio .tab { width: 46%;}

  #email .form { width: 80%; margin: 0 10% 25px;}
}
@media only screen and (max-width: 900px){
  #destaques .subtitulo h1 { margin: 80px 0 0;}
  #destaques .setas { margin: 10px 5% 20px;}
  #destaques .lado { width: 46%; margin: 0 2% 30px;}

  #opcoes { margin: 0;}
  #opcoes b { float: left; width: 100%; padding: 18px 0 16px; position: relative}
  #opcoes b i { position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
  #opcoes b i.fecha { display: none;}
  #opcoes a { float: left; width: 100%; padding: 18px 0 16px; display: none; border-right: 0; border-top: 1px solid rgb(218, 218, 218);}
  #opcoes a.abre { display: block;}
  #opcoes em { position: absolute; width: 20px; height: 20px; top: 16px; right: 20px; background-image: url('../imagens/seta-submenu.png'); background-position: 50%; background-repeat: no-repeat;}
  #opcoes em img { width: 0;}
}
@media only screen and (max-width: 800px){
  #banners .fundo.d { display: none;}
  #banners .fundo.m { display: block;}

  #blog .baico .barra { width: 160%; left: -30%;}

  #carousel .owl-nav button.owl-prev { left: -15px;}
  #carousel .owl-nav button.owl-next { right: -15px;}
}
@media only screen and (max-width: 700px){
  #destaques .subtitulo h1 { font-size: 1.4em;}
  #destaques .subtitulo h2 { font-size: 1em;}
  #destaques .subtitulo b { padding: 10px 10px 8px;}
  #destaques .subtexto h3 { width: 80%; margin: 20px 10% 0;}
  #destaques .subtexto h4 { width: 100%; margin: 20px 0 0; font-size: 0.9em;}
}
@media only screen and (max-width: 600px){
  #texto .open .item h3 { width: 84%; padding: 10px 8% 8px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}

  #blog .baico .barra { width: 200%; left: -50%;}

	#comentarios .add .c2 { float: left; width: 100%; margin: 20px 0 0;}
	#comentarios .add .c2.b { margin: 20px 0 0;}
  #comentarios .add .c2.c { width: 100%;}
  #comentarios .lista .tab .comentario h2 { font-size: 1em;}
  #comentarios .lista .tab .comentario h3 { font-size: 0.9em;}
  #comentarios .lista .tab .comentario h4 { font-size: 0.7em;} 
}
@media only screen and (max-width: 500px){
  #blog .baico .barra { width: 270%; left: -85%;}
  #blog .conteudo .tab { width: 96%;}
  #blog .conteudo .linha2 { display: none;}

  #portfolio .tab { width: 96%;}

  #carousel { width: 70%; padding: 0 15%;}
  #carousel .owl-nav button.owl-prev { left: -30px;}
  #carousel .owl-nav button.owl-next { right: -30px;}
}
@media only screen and (max-width: 400px){
  #blog .baico .barra { width: 340%; left: -120%;}
}
@keyframes redes{
  0% { margin-top: 0;}
  25% { margin-top: -5px;}
  50% { margin-top: 0;}
  75% { margin-top: -5px;}
  100% { margin-top: 0;}
}