@charset "utf-8";

/* DOCUMENTO CSS */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, blockquote, pre, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, p { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline;}

address { font-style: initial;}
a { color: inherit; text-decoration: none;}
a:hover {text-decoration: none !important; color: inherit;}
.conteudo{ position: relative; display: block; width: 95%; max-width: 1400px; margin: auto; height: inherit; overflow:hidden;}
h1.titulo_interna, h2.titulo_interna{ width:100%; text-align:center; margin:20px;}
body{ background-color:#f8f8f8;}


/*CSS PARA O HEADER*/
header#topo{ position:relative; display:block; width:100%; background-color: #FFF; max-height:110px; overflow:hidden; box-shadow:#666 0 1px 10px;}
header#topo div#logo{width:25%; height:auto; float:left; margin-top:15px;}
header#topo div#logo img{width:100%; height:auto; max-width:200px;}

header#topo nav#menu{display:none;}

.transformed {transform: rotate(15deg);}
.notransformed {transform: rotate(-15deg);}

header#topo nav#menu_responsivo{ width: auto; height:auto; float: right; margin-right:30px;}
header#topo nav#menu_responsivo ul{ margin:0; padding:0; list-style:none;}

header#topo nav#menu_responsivo ul li{ border: #EF403D 1px solid; background-color:#EF403D; color:#FFF; line-height:160px; padding:0 10px; min-width:80px; width:auto; text-align:center; margin: -20px 1.5px 0; font-size:18px; -webkit-transition:all ease-in-out .5s; -moz-transition:all ease-in-out .5s; -ms-transition:all ease-in-out .5s; -o-transition:all ease-in-out .5s;}

header#topo nav#menu_responsivo ul li a{display:block; color:inherit; text-decoration:none;}

.container_titulo{z-index:1; position:relative; width:90%; margin-left:25px; display:flex; align-items: center; height:70px; margin-top:30px;}
.container_titulo h1{ margin-left:30px;}

header#topo nav#menu ul li.orcamento{ border: #000 1px solid; margin:10% 0 0 20px; line-height:30px; padding:0 10px; float: left; min-width:100px; width:auto; text-align:center; font-size:13px; -webkit-transition:all ease-in-out .5s; -moz-transition:all ease-in-out .5s; -ms-transition:all ease-in-out .5s; -o-transition:all ease-in-out .5s; font-weight:lighter; background-color:#000; color:#FFFFFF;}

header#topo nav#menu ul li.orcamento:hover{ border: #000 1px solid; margin:10% 0 0 20px; line-height:30px; padding:0 10px; float: left; min-width:100px; width:auto; text-align:center; font-size:13px; font-weight:lighter; background-color:#000; cursor:pointer; border-radius:5px; color:#FFF;}


/*CSS PARA ASNA*/
#asna{background: url(../img_site/marca_vermelho.gif) top left no-repeat #f8f8f8; padding:80px 0; display:block; position:relative;}
#asna #texto{ width:66%; float:left; position:relative; min-height:587px; z-index:1;}
#asna #texto img{ position: absolute; top:0; width:100%; height:100%; left:0; z-index:0}
#asna #texto div#text{position:relative; display:block; width:60%; margin:auto; padding:15% 0; z-index:1;}
a#btn_asna{position: absolute; bottom:0; left:50%; margin-left:-85px; width:177px; display:block; background-color:#FFF; line-height:3; z-index:1; text-align: center;}
#asna #imagem_asna{position:absolute; right:0; top:0; z-index:0; height:561px; width:50%; overflow:hidden;}

/*CSS PARA ASNA_INTERNA*/
#asna_interna{padding:30px 0; background:url(../img_site/marca_vermelho.gif) no-repeat left top #f8f8f8;}
#asna_interna .conteudo{}
#asna_interna #asna_left{float:left; width:33%;}
#asna_interna #asna_left img{width:100%; height:auto;}
#asna_interna #asna_rigth{float:right; width:65%;}

/*CSS PARA SERVIÇOS*/
#servicos{background:url(../img_site/marca_verde.gif) bottom right no-repeat #f0f0f0; padding:30px 0;}
#servicos .conteudo #container_servicos{ display:flex; justify-content:space-between; padding:30px 5px;}
#servicos .conteudo #container_servicos .topo_serv{display:flex; justify-content: center; align-items: center; height:70px; background-color:#01AAAD;}
#servicos .conteudo #container_servicos img{ margin:auto; display:block; margin:40px auto 60px auto;}
#servicos .conteudo #container_servicos .box_servicos{ min-height:470px; background-color: #FFF; text-align:center; box-shadow:0 1px 10px #CCCCCC; width:24%;}
#servicos .conteudo #container_servicos .box_servicos .texto_box_servico{ width:80%; margin:auto;}
#servicos a#btn_serv{display:block; width:10%; min-width:120px; text-align:center; margin:30px auto; background-color:#000; padding:10px 15px;}

/*CSS PARA SERVICOS_INTERNA*/
#servicos_interna{ background: #f8f8f8; padding:30px 0;}
#servicos_interna .conteudo #container_servicos{ display:flex; flex-wrap:wrap; justify-content:space-between; padding:30px 5px;}
#servicos_interna .conteudo #container_servicos .topo_serv{display:flex; justify-content: center; align-items: center; height:70px; background-color:#01AAAD;}
#servicos_interna .conteudo #container_servicos img{ margin:auto; display:block; margin:40px auto 60px auto;}
#servicos_interna .conteudo #container_servicos .box_servicos{ min-height:470px; background-color: #FFF; text-align:center; box-shadow:0 1px 10px #CCCCCC; width:24%; display:block; margin-bottom:20px;}
#servicos_interna .conteudo #container_servicos .box_servicos .texto_box_servico{ width:80%; margin:auto;}
#servicos_interna a#btn_serv{display:block; width:10%; min-width:120px; text-align:center; margin:30px auto; background-color:#000; padding:10px 15px;}

/*CSS PARA OBRAS*/
#obras{background:url(../img_site/marca_vermelho2.gif) no-repeat left 40px #f8f8f8; padding:20px 0;}
#obras .container_titulo{ margin-bottom:30px;}
#obras #container_imagens{width:50%; float:left; min-height:400px;}
#obras #container_imagens .swiper-container { width: 100%; height: auto; margin-left: auto; margin-right: auto;}
#obras #container_imagens .swiper-slide { overflow:hidden; text-align: center; font-size: 18px; background: #fff; height: 200px;
        /* Center slide text vertically */
        display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center;-webkit-align-items: center; align-items: center;}
#obras #container_imagens .swiper-slide img {width:100%; height: 100%;}

#obras #formulario{width:48%; float:right; min-height:330px; padding:35px; background-color:#EF403D;}
#obras #formulario form{ position:relative; padding-bottom:50px;}
#obras #formulario span{ width:100%; display: block; text-align:center; margin-bottom:20px;}
#obras #formulario input{width:100%; margin-bottom:10px; padding:6px; color: #CCC;}
#obras #formulario textarea{ height: 85px; width:100%; margin-bottom:10px; padding:6px; color: #CCC;}
#obras #formulario button{ width:177px; position: absolute; left:50%; margin-left:-88.5px; bottom:0; background-color:#FFF; border:none; padding:7px 0;}

/*CSS PARA AIRLESS*/
#airless{min-height:400px; height:auto; width:100%; background:url(../img_site/fundo_airless_mobile.gif) no-repeat center center #F8F8F8; background-size: contain;}
#airless #texto{width:45%; float:right; margin-top:5%;}
#airless #texto span{ font-size:20px;}
#airless #texto img{ margin: 20px 0; width:150px;}
#airless #texto div{ width:80%; margin:0; float: left; margin:auto; margin-left:15px; line-height:1.2;}

/*CSS PARA PARCEIROS*/
#parceiros{padding:30px 0; text-align:center; background-color:#f8f8f8;}

/*CSS PARA O CONTATO*/
#contato{padding:30px 0; background: url(../img_site/fdcontato.jpg) top right no-repeat #f8f8f8;}
#contato form{ position:relative; margin:40px 0; padding-bottom:70px;}
#contato form input{width:35%; max-width:330px; line-height:35px; padding: 10px; border:none; background-color:#eaeaea; margin-bottom:10px; color:#666;}
#contato form textarea{width:63%; position:absolute; right:0; top:0; min-height:185px; border:none; background-color:#eaeaea; padding:10px; color:#666;}
#contato #enviar{display:block; position:absolute; right:0; bottom:0;border:none; background-color:#EF403D; line-height:45px; padding:0 10px;}

/*CSS PARA O RODA PE PRINCIPAL*/
#rodape_principal{padding:20px 0; overflow:hidden;}
#rodape_principal.ranger{background-color:#EF403D;}
#rodape_principal.green{background-color:#01AAAD;}

#rodape_principal .conteudo{display: block; justify-content:space-between; text-align:center;}
#rodape_principal address{ width:80%; display:flex; justify-content:space-between; text-align:left; margin:30px auto;}
#rodape_principal #sociais img:last-child{margin-left:10px;}

/*CSS PARA O RODA PE BAIXO*/
#rodape_baixo{ border:#000 1px solid; background-color:#000; padding:10px 0;}
#rodape_baixo #direitos{ float:left;}
#rodape_baixo #desenvolvido{ float: right;}

/*CSS PARA SOLICITAR UM ORÇAMENTO*/
div.modal-content{ background:url(../img_site/fd_orcamento.gif) repeat center center; padding:50px; width:80%; margin:auto;}
button.close{ margin: -25px -25px 0 0; position: absolute; top:40px; right:50px; color: #fff; font-size: 30px; opacity: 1;}
form#orcamento{ position:relative; padding-bottom:50px;}
form#orcamento input{ width:100%; background-color:#FFF; padding:10px; border:none; margin-bottom:10px; color:#999;}
form#orcamento textarea{ width:100%; min-height:120px; height:auto; background-color:#FFF; padding:10px; border:none; color:#999;}
form#orcamento button{ position:absolute; left:50%; margin-left:-88.5px; bottom:0; border: none; min-width:177px; text-align:center; background-color:#FFF; color:#000; padding:7px 0;}


/* CSS DO MENU RESPONSIVO */
#lista{ position: absolute; display:block; top: 100px; right: 0; width: 50%;  height: auto;  background-color: #FFF; border-radius:5px; border:#CCC 1px solid; visibility:visible; z-index:109 !important; margin-right:10px;}
#icone_menu_lista{ position:absolute; display:block; width:26px; height:15px; top: -14px; right: 70px; background:url(../img_site/icone_lista_menu_mobile.png) center center no-repeat;}
#lista ul{ width: auto; height: auto;  text-align: left; list-style:none;}
#lista ul li{ display: table; height: auto; padding: 4% 0 4% 0; width: 100%; border-bottom-width: 1px ; border-bottom-style: solid; border-bottom-color: #CCC;}
#lista li:last-child{ border-bottom:none;}
.lista{ font-size: 16px; color: #999; text-decoration: none; padding-left: 20px;}
#escurece{ position: absolute; left:0; top:0; background-color: rgba(0,0,0, 0.5); height:100%; width:100%; z-index: 100;}