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

header { z-index: 2; float: left; width: 0%; height: auto; position: absolute; border-top: 4px solid var(--cor-destaque2); padding: 54px 0px 0px; }
.header_internas { padding: 40px 0px; background-color: #2E6432; position: relative; }

#topo_logo { opacity: 0; width: 420px; height: auto; float: left; position: relative; }
#topo_informacoes_menu { opacity: 0; width: 825px; height: auto; float: right; position: relative; }
#topo_informacoes_menu #topo_informacoes { width: 100%; height: auto; float: right; position: relative; text-align: right; padding-bottom: 22px; }
#topo_informacoes_menu #topo_informacoes a.link_redes { width: auto; height: auto; position: relative; transition: 0.7s ease; -webkit-transition: 0.5s ease; margin-right: 20px; }
#topo_informacoes_menu #topo_informacoes a.link_redes svg .a { fill:#fcfeff; transition: 0.7s ease; -webkit-transition: 0.5s ease; }
#topo_informacoes_menu #topo_informacoes a.link_redes:hover svg .a { fill:#BCBBC0; }
#topo_informacoes_menu #topo_informacoes a.link_orcamento { width: 140px; height: auto; float: right; padding: 3px 1px 2px; border: 1px solid #FCFEFF; text-align: center; font: normal normal bold 16px/20px var(--font-bold2); letter-spacing: 0px; color: #F6F6F6; text-transform: uppercase; }
#topo_informacoes_menu #topo_informacoes a.link_orcamento:hover { color: #2E6432; background-color: #BCBBC0; border-color: #BCBBC0; }

#topo_informacoes_menu #topo_menu { width: 100%; height: auto; float: right; position: relative; text-align: right; padding: 0px; }
#topo_informacoes_menu #topo_menu ul { float: right; width: auto; height: auto; position: relative; margin: 0px; list-style:none; padding-right: 0px!important; }
#topo_informacoes_menu #topo_menu ul li { float: left; width: auto; height: auto; padding: 0px; margin: 0px; }
#topo_informacoes_menu #topo_menu ul li a { border-bottom: 3px solid transparent; text-align: left; font: normal normal normal 20px/20px var(--font-bold2); letter-spacing: 0px; color: #FCFEFF; padding: 0px 0px 3px 0px; margin: 0px 33px 0px; transition: 0.7s ease; -webkit-transition: 0.5s ease; float: left; position: relative; width: auto; height: auto; }
#topo_informacoes_menu #topo_menu ul li a:hover { color: #BCBBC0; border-bottom: 3px solid var(--cor-destaque2); }
#topo_informacoes_menu #topo_menu ul li a.sel { color: #BCBBC0; border-bottom: 3px solid var(--cor-destaque2); }
#topo_informacoes_menu #topo_menu ul li a.menu_primeiro { margin-left: 0px!important; }
#topo_informacoes_menu #topo_menu ul li a.menu_ultimo { margin-right: 0px!important; }

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

#avatar-whats { opacity: 0; -webkit-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; box-shadow: 0 0 0 var(--cor-destaque); background: url('../image/bg_ico_whatsapp.png') no-repeat scroll 0 0 transparent; bottom: -38px; display: block; height: 65px; position: fixed; right: 30px; width: 65px; z-index: 9400; }

#banner_home { width: 100%; height: auto; float: left; position: relative; background-color: transparent; }
#banner_home .chevron::before { border-style: solid; border-width: 0.25em 0.25em 0 0; content: ''; display: inline-block; height: 0.45em; left: 0.15em; position: relative; top: 0.15em; transform: rotate(-45deg); vertical-align: top; width: 0.45em; text-align: center; margin: 0 auto; }
#banner_home .chevron.bottom:before { top: 0; transform: rotate(135deg); }
#banner_home .arrowsWrap { width: 50px; margin-left: -25px; position: absolute; bottom: 50px; left: 50%; z-index: 999; }
#banner_home .arrows { color: #FFFFFF; padding: 15px 0; cursor: pointer; display: inline-block; -webkit-animation-name: wobble-vertical; animation-name: wobble-vertical; -webkit-animation-duration: 2s; animation-duration: 2s; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; -webkit-animation: wobble-vertical 2s steps(10) infinite; -moz-animation: wobble-vertical 2s steps(10) infinite; -ms-animation: wobble-vertical 2s steps(10) infinite; -o-animation: wobble-vertical 2s steps(10) infinite; animation: wobble-vertical 2s steps(10) infinite; }
#banner_home .chevron { transition: 0.70s; -webkit-transition: 0.70s; -moz-transition: 0.70s; -ms-transition: 0.70s; -o-transition: 0.70s; width: 50px; height: 50px; }
#banner_home .chevron:hover { opacity: .5; }
#banner_home .arrows.open .chevron { transition: 0.70s; -webkit-transition: 0.70s; -moz-transition: 0.70s; -ms-transition: 0.70s; -o-transition: 0.70s; }

#banner_frase { width: auto; height: auto; position: absolute; top: 40%; margin-top: -106px; left: 6%; opacity: 0; z-index: 3; }

footer { float: left; height: auto; position: relative; width: 100%; padding: 0px; background-color: #2E6432; }

#rodape_contato { width: 100%; height: auto; float: left; position: relative; padding: 90px 0px 0px; background: url(../image/rodape_fundo.png) no-repeat center 40px transparent; }
#rodape_contato h2 { opacity: 0; color: #FCFEFF; padding-bottom: 0px; }
#rodape_contato p.label_titulo { text-align: left; font: normal normal 800 24px/20px var(--font-bold); letter-spacing: 0px; color: #FCFEFF; padding-bottom: 30px; }
#rodape_contato a { text-align: left; font: normal normal normal 16px/24px var(--font-regular); letter-spacing: 0px; color: #FCFEFF; width: 100%; height: auto; position: relative; float: left; padding-bottom: 10px;}
#rodape_contato a:hover { opacity: 0.5; }
#rodape_contato a svg.icone_normal { height: 24px; width: auto; position: relative; float: left; margin: 0px 10px 0px 0px; }
#rodape_contato a svg.icone_localizacao { float: left; margin: 2px 10px 35px 0px; height: auto; width: auto; position: relative; }
#rodape_contato .coluna_01 { top: -200px; opacity: 0; width: 35.6%; height: auto; float: left; position: relative; text-align: left; }
#rodape_contato .coluna_02 { opacity: 0; width: 30.7%; height: auto; float: left; position: relative; text-align: center; padding-top: 100px; }
#rodape_contato .coluna_03 { opacity: 0; width: 425px; height: auto; float: right; position: relative; text-align: left; padding-top: 100px; }

#rodape_direitos { width: 100%; height: auto; float: left; position: relative; padding: 30px 0px 40px; }
#rodape_direitos a { font: normal normal medium 14px/24px var(--font-regular); letter-spacing: 0px; color: #FCFEFF; }
#rodape_direitos .coluna_01 { width: 35%; height: auto; float: left; position: relative; text-align: left; }
#rodape_direitos .coluna_01 a { text-align: left; } 
#rodape_direitos .coluna_02 { width: 30%; height: auto; float: left; position: relative; text-align: center; }
#rodape_direitos .coluna_02 a { text-align: center; }
#rodape_direitos .coluna_03 { width: 35%; height: auto; float: left; position: relative; text-align: right; }
#rodape_direitos .coluna_03 a { text-align: right; }
#rodape_direitos .coluna_03 a img { margin: -4px 0px -4px 10px; }

a.card_clientes { padding: 40px 1px; text-align: center; width: 18%; margin: 0px 1% 20px; height: auto; position: relative; float: left; background-color: #FFFFFF; text-decoration: none; border: 1px solid #FFFFFF; transition: 0.7s ease; -webkit-transition: 0.5s ease; }
a.card_clientes img { width: 55%; height: auto; position: relative; }
a.card_clientes:hover { border-color: var(--cor-destaque); }

#home_seja_um_cliente { width: 100%; height: auto; float: left; position: relative; padding: 61px 0px; background: url(../image/fundo_seja_cliente.jpg) no-repeat left bottom transparent; background-size: cover; }
#home_seja_um_cliente .coluna_01 { opacity: 0; width: 550px; height: auto; float: left; position: relative; text-align: left; }
#home_seja_um_cliente .coluna_02 { opacity: 0; width: 402px; height: auto; float: right; position: relative; text-align: right; padding-top: 44px; }
#home_seja_um_cliente p.label_titulo { text-align: left; font: normal normal normal 50px/70px var(--font-regular); letter-spacing: 0px; color: #FCFEFF; background: url(../image/seja_um_cliente_traco.svg) no-repeat left bottom transparent; }
#home_seja_um_cliente p.label_titulo b { font: normal normal 800 50px/70px var(--font-bold); }
#home_seja_um_cliente a.link_saiba_mais_branco { float: right; }

a.card_obras { width: 23%; margin: 0px 1% 20px; height: auto; position: relative; float: left; background-color: var(--cor-destaque); transition: 0.7s ease; -webkit-transition: 0.5s ease; }
a.card_obras .sobra { opacity: 0; display: flex; width: 100%; height: 100%; top: 0px; left: 0px; position: absolute; z-index: 2; background: transparent linear-gradient(180deg, #2E6432 0%, #2E6432 100%) 0% 0% no-repeat padding-box; justify-content: center; align-items: center; transition: 0.7s ease; -webkit-transition: 0.5s ease; }
a.card_obras .foto { z-index: 1; width: 100%; height: 295px; position: relative; float: left; background-color: transparent; background-repeat: no-repeat; background-size: cover; background-position: center center; }
a.card_obras .descricao_categoria { z-index: 1; width: 100%; height: auto; position: relative; float: left; padding: 12px 1px; background-color: #BCBBC0; text-align: center; }
a.card_obras .descricao_categoria p { text-align: center; font: normal normal 800 18px/20px var(--font-bold2); letter-spacing: 0px; color: #2E6432; }
a.card_obras .descricao_cliente_cidade { z-index: 1; width: 100%; height: auto; position: relative; float: left; padding: 12px 1px; background-color: #FCFEFF; text-align: center; }
a.card_obras .descricao_cliente_cidade p { padding: 2px 0px; text-align: center; font: normal normal normal 16px/20px var(--font-regular); letter-spacing: 0px; color: #12110E; }
a.card_obras:hover .sobra { opacity: 0.84; }

#home_quem_somos { width: 100%; height: auto; float: left; position: relative; padding: 0px 0px 100px; }
#home_quem_somos #anima_casas { opacity: 0; width: 100%; height: 43px; left: 0px; top: -100px; position: absolute; background: url(../image/detalhe_casinhas_obras.png) no-repeat left bottom transparent; }
#home_quem_somos .coluna_01 { opacity: 0; width: 711px; height: auto; float: left; position: relative; text-align: left; padding-top: 160px; }
#home_quem_somos .coluna_02 { opacity: 0; width: 633px; height: auto; float: right; position: relative; text-align: right; padding-top: 140px; }
#home_quem_somos .coluna_02 a.link_saiba_mais { float: left; }

#home_nossos_numeros { width: 100%; height: auto; float: left; position: relative; padding: 0px; }
#home_nossos_numeros .coluna_01 { opacity: 0; padding: 100px 40px; width: 50%; height: 460px; float: left; position: relative; background: url(../image/home_nossos_numeros_coluna_1.png) no-repeat center center transparent; background-size: cover; }
#home_nossos_numeros .coluna_02 { opacity: 0; width: 50%; height: 460px; float: left; position: relative; padding: 0px; background: url(../image/home_nossos_numeros_coluna_2.jpg) no-repeat center center transparent; background-size: cover; }
#home_nossos_numeros #card_numeros { width: 750px; height: auto; float: right; position: relative; text-align: center; }
#home_nossos_numeros #card_numeros .card_label_numero { width: 33.33%; height: auto; float: left; position: relative; text-align: center; }
#home_nossos_numeros #card_numeros p.numeros { text-align: center; font: normal normal 800 70px/70px var(--font-bold); letter-spacing: 0px; color: #2E6432; padding-bottom: 15px; }
#home_nossos_numeros #card_numeros p.label_nome_numeros { text-align: center; font: normal normal normal 20px/20px var(--font-regular); letter-spacing: 0px; color: #12110E; }
#home_nossos_numeros #detalhe_lateral { z-index: 2; width: auto; height: auto; position: absolute; right: -21px; top: 50%; margin-top: -14.5px; }

#home_nossos_servicos { width: 100%; height: auto; float: left; position: relative; padding: 100px 0px; background: url(../image/fundo_servicos.jpg) no-repeat left bottom #2E6432; background-size: cover; }
#home_nossos_servicos h2 { color: #FCFEFF; }
#home_nossos_servicos p { color: #FCFEFF; text-align: left; }
#home_nossos_servicos p.label_titulo { font: normal normal 800 20px/20px var(--font-bold2); padding-bottom: 8px; }
#home_nossos_servicos .card_servicos { width: 31.33%; height: auto; position: relative; float: left; margin: 0px 1% 25px; padding: 0px; min-height: 100px; }
#home_nossos_servicos .card_servicos .coluna_1 { width: 75px; height: auto; position: relative; float: left; }
#home_nossos_servicos .card_servicos .coluna_1 img { width: 100%; height: auto; position: relative; float: left; }
#home_nossos_servicos .card_servicos .coluna_2 { width: 81%; height: auto; position: relative; float: right; }
  
#home_nossos_numeros { width: 100%; height: auto; float: left; position: relative; padding: 0px; }
#home_nossos_numeros .coluna_01 { padding: 100px 40px; width: 50%; height: 460px; float: left; position: relative; background: url(../image/home_nossos_numeros_coluna_1.png) no-repeat center center transparent; background-size: cover; }
#home_nossos_numeros .coluna_02 { width: 50%; height: 460px; float: left; position: relative; padding: 0px; background: url(../image/home_nossos_numeros_coluna_2026.jpg) no-repeat center center transparent; background-size: cover; }

#home_mapa { padding: 100px 0px; width: 100%; height: auto; float: left; position: relative; background: url(../image/fundo_onde_atendemos.jpg) no-repeat center center transparent; background-size: cover; }
#home_mapa .coluna_01 { opacity: 0; width: 750px; height: auto; position: relative; float: left; }
#home_mapa .coluna_02 { opacity: 0; width: 496px; height: auto; position: relative; float: right; padding-top: 185px; }

#home_mapa { padding: 100px 0px; width: 100%; height: auto; float: left; position: relative; background: url(../image/fundo_onde_atendemos.jpg) no-repeat center center transparent; background-size: cover; }

#quem_somos_foto { width: 100%; height: 550px; float: left; position: relative; background: url(../image/fundo_foto_quem_somos.jpg) no-repeat center center transparent; background-size: cover; }

#quem_somos_slogan { width: 100%; height: auto; float: left; position: relative; padding: 70px 0px; background: url(../image/fundo_servicos.jpg) no-repeat left bottom #2E6432; background-size: cover; }
#quem_somos_slogan p.label_titulo { text-align: center; font: normal normal normal 50px/50px var(--font-regular); letter-spacing: 0px; color: #FCFEFF; background: url(../image/seja_um_cliente_traco.svg) no-repeat center bottom transparent; padding-bottom: 10px; }
#quem_somos_slogan p.label_titulo b { font: normal normal 800 50px/70px var(--font-bold); }

.card_missao_visao p { text-align: center; }
.card_missao_visao { width: 29.33%; height: auto; float: left; position: relative; margin: 0px 2%; }
.card_missao_visao p.label_titulo { text-align: center; font: normal normal normal 30px/30px var(--font-regular); color: var(--cor-destaque); padding-bottom: 30px; }
.card_missao_visao p.label_titulo b { text-align: center; font: normal normal 800 30px/30px var(--font-bold); }

#card_missao_visao_1 { top: -200px; opacity: 0; }
#card_missao_visao_2 { opacity: 0; }
#card_missao_visao_3 { opacity: 0; }
#card_missao_visao_4 { opacity: 0; }

.card_servicos_itens { width: 100%; height: auto; float: left; position: relative; margin-bottom: 80px; background-color: #2E6432; }
.card_servicos_itens a.foto { width: 35%; height: 100%; position: absolute; float: left; background-color: transparent; background-repeat: no-repeat; background-size: cover; background-position: center center; left: 0px; top: 0px; }
.card_servicos_itens a.foto:hover { opacity: 0.28; }
.card_servicos_itens .coluna_02 { width: 65%; height: auto; float: right; position: relative; padding: 0px; }
.card_servicos_itens .coluna_02 .div_titulo { width: 100%; height: auto; float: left; position: relative; padding: 20px 40px; background-color: #BCBBC0; }
.card_servicos_itens .coluna_02 .div_titulo p.label_titulo { text-align: left; font: normal normal 800 20px/20px var(--font-bold2); color: #2E6432; }
.card_servicos_itens .coluna_02 .card_texto { width: 100%; height: auto; float: left; position: relative; padding: 40px 40px; background-color: #FCFEFF; }
.card_servicos_itens .coluna_02 .card_texto p { text-align: justify; }

#obras_lista { width: 100%; height: auto; float: left; position: relative; padding: 0px 0px 120px; }
#obras_lista #card_nome_lista { width: 100%; height: auto; float: left; position: relative; padding: 0px 0px 20px; border-bottom: 1px solid #2E6432; }
#obras_lista #card_nome_lista .coluna_01 { width: 70%; height: auto; float: left; position: relative; text-align: left; }
#obras_lista #card_nome_lista .coluna_01 p.titulo_principal { text-align: left; font: normal normal bold 30px/30px var(--font-bold2); color: var(--cor-destaque); }
#obras_lista #card_nome_lista .coluna_01 p.titulo_principal_cidade { text-align: left; font: normal normal bold 20px/30px var(--font-regular); color: var(--cor-destaque); }
#obras_lista #card_nome_lista .coluna_02 { width: 30%; height: auto; float: right; position: relative; text-align: right; }
  
#obras_busca { width: 100%; height: auto; float: left; position: relative; padding: 40px 30px; background-color: #2E6432; display: none; }
#obras_busca form label { padding: 5px; }
#obras_busca form button { padding: 11px 10px; }
#obras_busca form p { color: #FCFEFF; text-align: left; font: normal normal 800 20px/20px var(--font-bold2); padding-bottom: 10px; }

#obras_interna { width: 100%; height: auto; float: left; position: relative; padding: 0px 0px 100px; background-color: transparent; }
#obras_interna .coluna_01 { width: 40%; height: auto; float: left; position: relative; background-color: #2E6432; }
#obras_interna .coluna_01 a.foto { width: 100%; height: 550px; position: relative; float: left; background-color: transparent; background-repeat: no-repeat; background-size: cover; background-position: center center; }
#obras_interna .coluna_01 a.foto:hover { opacity: 0.28; }
#obras_interna .coluna_02 { width: 55%; height: auto; float: right; position: relative; padding-top: 60px; }
#obras_interna .coluna_02 p.label_cliente { padding-bottom: 10px; }
#obras_interna .coluna_02 p.label_cidade { padding-bottom: 10px; }
#obras_interna .coluna_02 .texto { width: 100%; height: auto; position: relative; float: left; padding-top: 30px; }
#obras_interna .coluna_02 .texto p { text-align: left; }
#obras_interna .coluna_02 a.lk_whatsapp { font-size: 18px; font-weight: bold; width: auto; height: auto; float: left; text-align: center; position: relative; padding: 10px 25px; color: #FFFFFF; background-color: #25D366; -webkit-border-radius: 10px 10px 10px 10px; border-radius: 10px 10px 10px 10px; }
#obras_interna .coluna_02 a.lk_whatsapp img { margin: -4px 10px -4px 0px; }
#obras_interna .coluna_02 a.lk_whatsapp:hover { background-color: #2E6432; }

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

a.mapa_set_point { width: 20px; height: 20px; position: absolute; transition: 0.7s ease; -webkit-transition: 0.5s ease; z-index: 2; }
a.mapa_set_point .tool_set_point { opacity: 0; position: relative; width: 150px; height: auto; background-color: #000; text-align: center; bottom: 3px; left: -60px; text-align: center; font: normal normal normal 16px/20px var(--font-regular); letter-spacing: 0px; color: #FFF; display: block; transition: 0.7s ease; -webkit-transition: 0.5s ease; padding: 5px 1px; float: left; } 
a.mapa_set_point:hover .tool_set_point { opacity: 1; }

.card_aviso { width: 100%; height: auto; float: left; position: relative; padding: 50px 5px; background-color: #F0F0F0; border: 1px solid #CACACA; }


/* ********* */
/* ANIMACOES */
/* ********* */
@-webkit-keyframes wobble-vertical {
  16.65% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }

  33.3% {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
  }

  49.95% {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
  }

  66.6% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }

  83.25% {
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes wobble-vertical {
  16.65% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }

  33.3% {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
  }

  49.95% {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
  }

  66.6% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }

  83.25% {
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}