@import url(reset.css);
@import url(fonts.css);
@import url(responsivo.css);
@import url(padrao.css);

header { border-top: 5px solid var(--cor-destaque); float: left; width: 0%; height: 178px; position: relative; }

header #logo { opacity: 0; top: -30px; padding: 55px 0px 10px; margin: 0px 0px 0px 15px; float: left; width: 368px; height: auto; position: relative; transition: 0.7s ease; -webkit-transition: 0.5s ease; }

header #info_menu { opacity: 0; margin: 0px 15px 0px 0px; float: right; width: 777px; height: auto; position: relative; }

header #info_menu #info_header { padding: 7px 30px; float: right; width: 398px; height: 40px; background: url(../image/caminho_topo.png) no-repeat center top transparent; position: relative; transition: 0.7s ease; -webkit-transition: 0.5s ease; }
header #info_menu #info_header a { text-decoration: none; font: normal normal bold 16px/20px var(--font-bold); color: #FFFFFF; transition: 0.7s ease; -webkit-transition: 0.5s ease; }
header #info_menu #info_header a svg { margin: -5px 1px -5px; }
header #info_menu #info_header a svg .a { fill:#FFFFFF; transition: 0.7s ease; -webkit-transition: 0.5s ease; }
header #info_menu #info_header a:hover { text-decoration: none; color: var(--cor-cinza); }
header #info_menu #info_header a:hover svg .a { fill: var(--cor-cinza); }

header #info_menu #menu_header { padding: 46px 0px 0px; width: 100%; height: auto; float: left; position: relative; background-color: transparent; }
header #info_menu #menu_header ul { float: left; width:100%; height: auto; position: relative; margin: 0px; list-style:none; padding-right: 0px!important; }
header #info_menu #menu_header ul li { float: left; width:auto; height: auto; padding: 0px; margin: 0px; }
header #info_menu #menu_header ul li a { margin: 0px 18px; padding: 0px 0px 62px; font: normal normal normal 20px/25px var(--font-bold); color: var(--cor-cinza); float: left; position: relative; width: auto; height: auto; transition: 0.7s ease; -webkit-transition: 0.5s ease; }
header #info_menu #menu_header ul li a:hover { color: var(--cor-destaque); }
header #info_menu #menu_header ul li a.sel { color: var(--cor-destaque); }
header #info_menu #menu_header ul li a.sel .anima { height: 23px; } 
header #info_menu #menu_header ul li a.sem_margin_left { margin-left: 0px; }
header #info_menu #menu_header ul li a.sem_margin_right { margin-left: 0px; }
header #info_menu #menu_header ul li a .anima { width: 100%; height: 0px; position: absolute; bottom: 0px; left: 0px; background-color: var(--cor-destaque); transition: 0.7s ease; -webkit-transition: 0.5s ease; }
header #info_menu #menu_header ul li a:hover .anima { height: 23px; }

#main section#conteudo { opacity: 0; width: 100%; height: auto; float: left; position: relative; }

footer { opacity: 0; float: left; height: auto; position: relative; width: 100%; padding: 80px 0px 0px 0px; background-color: var(--cor-destaque); }
footer #informacoes_com_linha { padding: 20px 0px 0px; width: 100%; height: auto; float: left; position: relative; border-top: 3px solid #FFFFFF; }
footer #informacoes_com_linha #logo_rodape { width: auto; height: auto; position: absolute; right: 0px; top: -68px; }
footer #informacoes_com_linha .coluna_1 { width: 490px; float: left; height: auto; position: relative; }
footer #informacoes_com_linha .coluna_2 { width: 200px; float: left; height: auto; position: relative; }

footer a.link_rodape { color: #FFFFFF; font: normal normal normal 20px/24px var(--font-regular); text-align: left; }
footer a.link_rodape svg .a { fill:#FFFFFF; transition: 0.7s ease; -webkit-transition: 0.5s ease; }
footer a.link_rodape svg .b { fill:#FFFFFF; transition: 0.7s ease; -webkit-transition: 0.5s ease; }
footer a.link_rodape:hover { color: var(--cor-cinza); }
footer a.link_rodape:hover .a { fill:var(--cor-cinza); }
footer a.link_rodape:hover .b { fill:var(--cor-cinza); }
footer a.link_rodape .icone_localizacao { float: left; position: relative; width: auto; height: auto; margin: 0px 5px 45px 0px; }
footer a.link_rodape .icone_contatos { float: left; position: relative; width: auto; height: auto; margin: 0px 5px 0px 0px; }

footer p.redes_titulo { text-align: center; color: #FFFFFF; font: normal normal normal 20px/24px var(--font-regular); }
footer p.redes_titulo a.footer_icones svg { margin: -6px 5px; }
footer p.redes_titulo a.footer_icones svg .a { fill:#FFFFFF; transition: 0.7s ease; -webkit-transition: 0.5s ease; }
footer p.redes_titulo a.footer_icones svg .b { fill:#FFFFFF; transition: 0.7s ease; -webkit-transition: 0.5s ease; }
footer p.redes_titulo a.footer_icones:hover .a { fill: var(--cor-cinza); }
footer p.redes_titulo a.footer_icones:hover .b { fill:var(--cor-cinza); }

footer #desenvolvido_inove { margin-top: 25px; text-align: center; border-top: 1px solid #FFFFFF; padding: 10px 0px; width: 100%; float: left; height: auto; position: relative; }

#wpp_chat { opacity: 0; }

#home_categorias { text-align: center; padding: 70px 0px 275px; float: left; width: 100%; height: auto; background: url(../image/fundo_solucoes.jpg) no-repeat center top transparent; position: relative; }

#home_categorias #home_rolon { z-index: 1; position: absolute; bottom: -56px; left: 0px; width: 100%; height: 192px; background: url(../image/fundo_roll_on_roll_off.jpg) no-repeat center 50% transparent; }
#home_categorias #home_rolon #content_rolon { padding: 30px 20px; background-color: var(--cor-destaque); width: 100%; height: auto; min-height: 200px; position: relative; float: left; }
#home_categorias #home_rolon #content_rolon #img_rolon { position: absolute; width: auto; height: auto; bottom: 18px; left: 11px; }
#home_categorias #home_rolon #content_rolon .coluna_2 { width: 690px; height: auto; position: relative; float: right; }
#home_categorias #home_rolon #content_rolon .coluna_2 p { color: #FFFFFF; text-align: left; font: normal normal normal 32px/38px var(--font-regular); }
#home_categorias #home_rolon #content_rolon .coluna_2 p span { font: normal normal normal 32px/38px var(--font-bold-destaque); }
#home_categorias #home_rolon #content_rolon .coluna_2 a.link_saiba_mais { margin: 1px 0px; color: var(--cor-destaque); background-color: #FFFFFF; border-color: var(--cor-cinza); }
#home_categorias #home_rolon #content_rolon .coluna_2 a.link_saiba_mais:hover { color: #FFFFFF; background-color: var(--cor-cinza); border-color: var(--cor-destaque); }

#blog_rolon { margin: 60px 0px 80px; float: left; position: relative; width: 100%; height: auto; background: url(../image/fundo_roll_on_roll_off.jpg) no-repeat center 50% transparent; }
#blog_rolon #content_rolon { padding: 30px 20px; background-color: var(--cor-destaque); width: 100%; height: auto; min-height: 200px; position: relative; float: left; }
#blog_rolon #content_rolon #img_rolon { position: absolute; width: auto; height: auto; bottom: 18px; left: 11px; }
#blog_rolon #content_rolon .coluna_2 { width: 690px; height: auto; position: relative; float: right; }
#blog_rolon #content_rolon .coluna_2 p { color: #FFFFFF; text-align: left; font: normal normal normal 32px/38px var(--font-regular); }
#blog_rolon #content_rolon .coluna_2 p span { font: normal normal normal 32px/38px var(--font-bold-destaque); }
#blog_rolon #content_rolon .coluna_2 a.link_saiba_mais { margin: 1px 0px; color: var(--cor-destaque); background-color: #FFFFFF; border-color: var(--cor-cinza); }
#blog_rolon #content_rolon .coluna_2 a.link_saiba_mais:hover { color: #FFFFFF; background-color: var(--cor-cinza); border-color: var(--cor-destaque); }

#produto_importante { margin: 60px 0px 80px; float: left; position: relative; width: 100%; height: auto; background: url(../image/fundo_roll_on_roll_off.jpg) no-repeat center 50% transparent; }
#produto_importante #content_rolon { padding: 30px 20px; background-color: var(--cor-destaque); width: 100%; height: auto; min-height: 200px; position: relative; float: left; }
#produto_importante #content_rolon #img_rolon { position: absolute; width: auto; height: auto; bottom: 18px; left: 11px; }
#produto_importante #content_rolon .coluna_2 { width: 670px; height: auto; position: relative; float: right; }
#produto_importante #content_rolon .coluna_2 p { color: #FFFFFF; text-align: left; font: normal normal normal 25px/31px var(--font-regular); }
#produto_importante #content_rolon .coluna_2 p span { font: normal normal normal 25px/31px var(--font-bold-destaque); }
#produto_importante #content_rolon .coluna_2 a.link_saiba_mais { margin: 1px 0px; color: var(--cor-destaque); background-color: #FFFFFF; border-color: var(--cor-cinza); }
#produto_importante #content_rolon .coluna_2 a.link_saiba_mais:hover { color: #FFFFFF; background-color: var(--cor-cinza); border-color: var(--cor-destaque); }


.card_categorias { margin: 0px 4px 12px; width: 547px; height: auto; display: inline-block; background-color: #FFFFFF; transition: 0.7s ease; -webkit-transition: 0.5s ease; }
.card_categorias a.foto { background-repeat: no-repeat; background-position: center; background-size: auto 90%; opacity: 1; width: 100%; height: 332px; float: left; position: relative; font-size: 0px; transition: 0.7s ease; -webkit-transition: 0.5s ease; text-decoration: none; }
.card_categorias a.foto:hover { background-size: auto 95%; text-decoration: none; }
.card_categorias .titulo { padding: 23px 1px; float: left; width: 100%; height: auto; position: relative; background-color: var(--cor-destaque); transition: 0.7s ease; -webkit-transition: 0.5s ease; }
.card_categorias .titulo p { text-transform: uppercase; text-align: center; color: #FFFFFF; font: normal normal normal 20px/25px var(--font-regular); }
.card_categorias:hover .titulo { background-color: var(--cor-cinza); }

#home_espaco_sonatta { text-align: center; padding: 122px 0px 58px; float: left; width: 100%; height: auto; background: url(../image/fundo_espaco_sonatta.jpg) no-repeat center bottom transparent; position: relative; }
#home_espaco_sonatta h2 { color: #FFFFFF; }
#home_espaco_sonatta a.card_espaco_sonatta { margin: 0px 1% 20px; width: 31.33%; height: auto; min-height: 338px; float: left; position: relative; text-decoration: none; background-repeat: no-repeat; background-position: center; background-size: auto 100%; transition: 0.7s ease; -webkit-transition: 0.5s ease; }
#home_espaco_sonatta a.card_espaco_sonatta .sombra { z-index: 1; position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; opacity: 0.8; background-color: var(--cor-destaque); transition: 0.7s ease; -webkit-transition: 0.5s ease; }
#home_espaco_sonatta a.card_espaco_sonatta:hover .sombra { background-color: #FFFFFF; }
#home_espaco_sonatta a.card_espaco_sonatta .label { z-index: 2; position: absolute; width: 100%; height: auto; left: 0px; top: 50%; margin-top: -14px; transition: 0.7s ease; -webkit-transition: 0.5s ease; text-align: center; }
#home_espaco_sonatta a.card_espaco_sonatta .label p { font: normal normal normal 24px/28px var(--font-regular); color: #FFFFFF; text-align: center; }
#home_espaco_sonatta a.card_espaco_sonatta:hover .label p { color: var(--cor-destaque); }

#home_blog { text-align: center; padding: 70px 0px 80px; float: left; width: 100%; height: auto; background-color: #F2F2F2; position: relative; }
a.card_blog { width: 31.33%; display: block; height: auto; min-height: 415px; margin: 0px 1% 20px; background-color: #FFFFFF; text-align: center; text-decoration: none; box-shadow: 0px 3px 6px #00000029; --webkit-box-shadow: 0px 3px 6px #00000029; transition: 0.7s ease; -webkit-transition: 0.5s ease; float: left; position: relative; }
a.card_blog .foto { background-repeat: no-repeat; background-position: center top; background-size: auto 110%; opacity: 1; width: 100%; height: 353px; float: left; position: relative; font-size: 0px; transition: 0.7s ease; -webkit-transition: 0.5s ease; text-decoration: none; }
a.card_blog .foto:hover { background-size: auto 115%; text-decoration: none; }
a.card_blog:hover { box-shadow: none; -webkit-box-shadow: none; }
a.card_blog:hover .foto { background-size: auto 115%; text-decoration: none; }
a.card_blog p { min-height: 70px; text-align: left; font: normal normal normal 16px/20px var(--font-regular); color: #222221; padding: 15px 30px; }

#interna_padrao { text-align: center; padding: 70px 0px 80px; float: left; width: 100%; height: auto; background-color: #F2F2F2; position: relative; }

a.card_contato { margin-bottom: 20px; padding: 20px; text-align: center; width: 31.33%; box-shadow: 0px 0px 6px #00000029; -webkit-box-shadow: 0px 0px 6px #00000029; background-color: #FFFFFF; height: auto; position: relative; float: left; display: block; text-decoration: none; font-size: 0px; transition: 0.7s ease; -webkit-transition: 0.5s ease; }
a.card_contato p.titulo { text-align: center; font: normal normal normal 24px/28px var(--font-regular); color: var(--cor-cinza); }
a.card_contato p.label { text-align: center; font: normal normal normal 20px/24px var(--font-regular); color: var(--cor-cinza); }
a.card_contato:hover { box-shadow: none; -webkit-box-shadow: none; }
a.card_contato:hover p.titulo { color: var(--cor-destaque); }
a.card_contato:hover p.label { color: var(--cor-destaque); }
a.card_contato:nth-child(2) { margin: 0px 3%; }

.icone_servico { margin: 0px; }

#interna_servicos p { font: normal normal normal 20px/24px var(--font-regular); color: #636462; }

#interna_servicos_caracteristicas { float: left; width: 100%; height: auto; position: relative; }
#interna_servicos_caracteristicas .coluna_1 { float: left; width: 45%; height: auto; position: relative; }
#interna_servicos_caracteristicas .coluna_2 { float: right; width: 52%; height: auto; position: relative; }
#interna_servicos_caracteristicas .coluna_2 p.titulo_itens { font: normal normal normal 20px/24px var(--font-regular); color: #636462; }
#interna_servicos_caracteristicas .coluna_2 p.label_servicos { padding: 7px 31px; font: normal normal normal 16px/20px var(--font-regular); color: #636462; transition: 0.7s ease; -webkit-transition: 0.5s; }
#interna_servicos_caracteristicas .coluna_2 p.label_servicos img { margin: 0px 6px 1px 0px; }
#interna_servicos_caracteristicas .coluna_2 p.label_servicos:hover { color: var(--cor-destaque); }

#frase_servicos { padding: 31px 5px; float: left; width: 100%; height: auto; position: relative; background-color: var(--cor-destaque); }
#frase_servicos h2 { padding: 0px; color: #FFFFFF; font: normal normal normal 24px/28px var(--font-regular); }
#frase_servicos h2 span { margin: 0px 0px 0px 0px; padding: 0px; font: normal normal normal 24px/28px var(--font-bold-destaque); }

#content_galeria_de_fotos { padding: 75px 0px 30px; width: 100%; height: auto; float: left; position: relative; }
#content_galeria_de_fotos_blog { padding: 0px 0px 30px; width: 100%; height: auto; float: left; position: relative; }

#content_missao_visao { padding: 70px 0px 120px; width: 100%; height: auto; float: left; position: relative; background: url(../image/fundo_institucional.jpg) no-repeat center top transparent; }

#content_missao_visao #card_logo { opacity: 0; width: 502px; height: auto; float: left; position: relative; }

#content_missao_visao #card_missao {  opacity: 0; padding: 22px 50px 1px 212px; position: absolute; top: 0px; left: 454px; background: url(../image/missao.png) no-repeat center top transparent; width: 543px; height: 141px; }
#content_missao_visao #card_missao h2 { padding: 0px 0px 4px 0px; font: normal normal normal 20px/28px var(--font-regular); color: #FFFFFF; text-align: left; }
#content_missao_visao #card_missao p { padding: 0px; font: normal normal normal 12px/12px var(--font-regular); color: #FFFFFF; text-align: left; }

#content_missao_visao #card_visao { opacity: 0; padding: 22px 60px 1px 224px; position: absolute; top: 183px; left: 485px; background: url(../image/visao.png) no-repeat center top transparent; width: 557px; height: 129px; }
#content_missao_visao #card_visao h2 { padding: 0px 0px 4px 0px; font: normal normal normal 20px/28px var(--font-regular); color: #FFFFFF; text-align: left; }
#content_missao_visao #card_visao p { padding: 0px; font: normal normal normal 12px/12px var(--font-regular); color: #FFFFFF; text-align: left; }

#content_missao_visao #card_valores { opacity: 0; padding: 28px 55px 1px 207px; position: absolute; top: 544px; left: 455px; background: url(../image/valores.png) no-repeat center top transparent; width: 543px; height: 140px; }
#content_missao_visao #card_valores h2 { padding: 0px 0px 4px 0px; font: normal normal normal 20px/28px var(--font-regular); color: #FFFFFF; text-align: left; }
#content_missao_visao #card_valores p { padding: 0px; font: normal normal normal 12px/12px var(--font-regular); color: #FFFFFF; text-align: left; }

#blog_interna { width: 100%; height: auto; float: left; position: relative; }
#blog_interna h2 { text-align: left; font: normal normal normal 24px/28px var(--font-regular); padding: 0px 0px 20px 0px; color: var(--cor-destaque); }

#mostra_cateria { margin-bottom: 47px; padding: 9px 50px; width: 100%; height: auto; float: left; position: relative; background-color: var(--cor-destaque); }
#mostra_cateria h2 { padding: 8px 0px; font: normal normal normal 24px/28px var(--font-regular); color: #FFFFFF; text-align: left; }
#mostra_cateria a.link_saiba_mais { float: right; position: relative; margin: 0px; color: var(--cor-destaque); background-color: #FFFFFF; border-color: var(--cor-cinza); }
#mostra_cateria a.link_saiba_mais:hover { color: #FFFFFF; background-color: var(--cor-cinza); border-color: var(--cor-destaque); }

.card_produtos { margin: 0px 4px 12px; width: 365px; height: auto; display: inline-block; background-color: #FFFFFF; transition: 0.7s ease; -webkit-transition: 0.5s ease; }
.card_produtos a.foto { background-repeat: no-repeat; background-position: center top; background-size: auto 115%; opacity: 1; width: 100%; height: 259px; float: left; position: relative; font-size: 0px; transition: 0.7s ease; -webkit-transition: 0.5s ease; text-decoration: none; }
.card_produtos a.foto:hover { background-size: auto 120%; text-decoration: none; }
.card_produtos .titulo { min-height: 96px; padding: 23px 1px; float: left; width: 100%; height: auto; position: relative; background-color: var(--cor-destaque); transition: 0.7s ease; -webkit-transition: 0.5s ease; }
.card_produtos .titulo p { text-transform: uppercase; text-align: center; color: #FFFFFF; font: normal normal normal 20px/25px var(--font-regular); }
.card_produtos:hover .titulo { background-color: var(--cor-cinza); }

#produtos_interna_veja_tambem { padding: 0px 0px 80px; background-color: transparent; width: 100%; height: auto; float: left; position: relative; }

#produtos_interno { padding: 0px; width: 100%; height: auto; float: left; position: relative; }
#produtos_interno .coluna_1 { float: left; width: 49.5%; height: auto; position: relative; }
#produtos_interno .coluna_1 a.foto { background-repeat: no-repeat; background-position: center top; background-size: auto 100%; opacity: 1; width: 100%; height: 464px; float: left; position: relative; font-size: 0px; transition: 0.7s ease; -webkit-transition: 0.5s ease; text-decoration: none; }
#produtos_interno .coluna_1 a.foto:hover { background-size: auto 105%; text-decoration: none; }
#produtos_interno .coluna_2 { text-align: left; float: right; width: 47%; height: auto; position: relative; }
#produtos_interno .coluna_2 h2 { padding: 0px 0px 18px; font: normal normal normal 24px/28px var(--font-regular); text-align: left; color: var(--cor-destaque); }
#produtos_interno .coluna_2 p { font: normal normal normal 16px/20px var(--font-regular); color: var(--cor-cinza); text-align: left; }
#produtos_interno .coluna_2 p strong { color: var(--cor-destaque); }
#produtos_interno .coluna_2 a.link_saiba_mais { background-color: var(--cor-cinza); border-color: var(--cor-cinza); color: #FFFFFF; margin: 1px 8px 1px 0px; }
#produtos_interno .coluna_2 a.link_saiba_mais:hover { background-color: var(--cor-destaque); border-color: var(--cor-destaque); }

#produto_video { padding: 80px 0px 10px; width: 100%; height: auto; float: left; position: relative; }

.card_servicos { margin: 0px 4px 12px; width: 365px; height: auto; display: inline-block; background-color: #FFFFFF; transition: 0.7s ease; -webkit-transition: 0.5s ease; }
.card_servicos a.foto { background-repeat: no-repeat; background-position: center top; background-size: auto 115%; opacity: 1; width: 100%; height: 259px; float: left; position: relative; font-size: 0px; transition: 0.7s ease; -webkit-transition: 0.5s ease; text-decoration: none; }
.card_servicos a.foto:hover { background-size: auto 120%; text-decoration: none; }
.card_servicos .titulo { min-height: 96px; padding: 23px 5px; float: left; width: 100%; height: auto; position: relative; background-color: var(--cor-destaque); transition: 0.7s ease; -webkit-transition: 0.5s ease; }
.card_servicos .titulo p { text-transform: uppercase; text-align: center; color: #FFFFFF; font: normal normal normal 18px/23px var(--font-regular); }
.card_servicos:hover .titulo { background-color: var(--cor-cinza); }

#noticias_relacionadas { text-align: center; }