/* ===============================
Desenvolvido por: 
Halyson Brito Studio 
www.halysonbrito.com.br
==================================*/

body{font-family:'Open Sans', sans-serif; font-weight:400; color:#3c3c3c; width:100%;font-size:1em; -webkit-font-smoothing:antialiased;}
 
.clearfix:before, .clearfix:after {content: " "; display: table;}
.clearfix:after {clear:both;}
.clearfix {*zoom:1;}

.center {margin:0 auto;}
.content {max-width:1024px;}
header, section, footer {display: block;}

img, picture, video, embed {max-width:100%;}
h1, h2, h3, h4, h5, h6 {margin: 0;}
p {margin:0; padding:0;}
a, a:link, a:visited {text-decoration: none;}
a:hover {}

.fr {float: right;}
.fl {float: left}

/* ===============================
Basic
==================================*/
/*Botões*/
.btn {font-weight: 600; padding: 6px 20px;}
.btn-verde {background: #3e9057; color: #fff;}
.btn-verde:hover {background: #48a966; color: #fff;}

.btn-verde-medio {background: #13b0ba; color: #fff}
.btn-verde-medio:hover {background: #16bcc7; color: #fff;}

.btn-lg-verde-claro {background: #b8e7ea; width: 100%; color: #13b0ba}
.btn-lg-verde-claro:hover {background: #c0f1f4; color: #13b0ba;}

/* ===============================
Header
==================================*/
header {}

/*Logo*/
header .navbar-brand {padding: 0 15px; }
header .navbar-brand img {box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, .15);}

/*Menu*/
header .navbar-inverse{background: #fff; border-color: #e1e1e1; border:none; box-shadow: 0px 0px 150px 10px rgba(0, 0, 0, .15);-webkit-box-shadow: 0px 0px 150px 10px rgba(0, 0, 0, .15);}
header .navbar-inverse .navbar-nav>li>a {font-size: 14px; font-weight: 600; padding: 15px 30px}
header .navbar-inverse .navbar-nav>li>a:hover {color: #3e9057}

header .dropdown-menu>li>a:hover {background: #3e9057; color: #fff;}

header .navbar-inverse .navbar-nav li.dropdown.open a:first {background: #3e9057;}

/* Telefone de Topo */
header .navbar-inverse .navbar-nav>li.telefone-topo>a{background: #13b0ba; color: #fff; height: 34px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; margin: 8px 0; padding-top: 7px; font-weight: 700}
header .navbar-inverse .navbar-nav>li.telefone-topo>a:hover {background: #16bcc7}
header .nav>li.telefone-topo>a>img {margin-right: 10px;}

/* Responsivo */
@media (max-width: 1024px){
    header .navbar-inverse .navbar-nav>li>a {padding: 15px 30px}
    header .navbar-inverse .navbar-nav>li.telefone-topo>a {margin: 8px 30px;}
}

@media (max-width: 768px) {
    header .navbar-inverse .navbar-nav>li>a {padding: 15px 14px}
    header .navbar-inverse .navbar-nav>li.telefone-topo>a {margin: 8px 15px;}

}

@media (max-width:767px){
    header .navbar-inverse button.navbar-toggle.collapsed,
    header .navbar-inverse button.navbar-toggle.collapsed:active,
    header .navbar-inverse button.navbar-toggle.collapsed:hover,
    .navbar-inverse .navbar-toggle,
    .navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover {
        background: #3e9057; border: none;
    }
    ul.nav.navbar-nav {margin: 0;}
    .navbar-inverse .navbar-collapse {border: none; padding: 28px 0 0; }
    header .navbar-inverse .navbar-nav>li {text-align: center;}
    header .navbar-inverse .navbar-nav>li>a:hover {background: #3e9057; color: #fff;}
    .navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover {background: #3e9057;}
    .navbar-nav .open .dropdown-menu {text-align: center;}
    .navbar-nav .open .dropdown-menu li {padding: 6px 0}
    header .navbar-inverse .navbar-nav>li.telefone-topo>a {height: 50px; padding-top: 15px; margin: 0; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px;}
}

/* ===============================
Section .banner (HOME)
==================================*/
section.banner {background: url(../images/BANNER-home.jpg) left center; background-size: cover; width: 100%; height: 464px; padding: 78px 0}

/* Conteúdo do Banner*/
section.banner .conteudo-banner {color: #fff; margin: 100px 0 0}

section.banner .conteudo-banner h1{font-size: 32px; font-weight: 700; margin-bottom: 10px}
section.banner .conteudo-banner p{font-size: 17px; font-weight: 600; line-height: 1.3; margin-bottom: 20px}
section.banner .conteudo-banner a{font-size: 16px}

/* Responsivo */
@media (max-width:1024px){
    section.banner .conteudo-banner {padding-left: 50px;}
}
@media (max-width:768px){
    section.banner .conteudo-banner {padding-left: 30px; margin-top: 50px}
    
}
@media (max-width:425px){
    section.banner .conteudo-banner {padding-left:25px;}
    section.banner .conteudo-banner h1{text-align: left;}
    section.banner .conteudo-banner p {font-weight: 700}
}
/* ===============================
Section .banner (INTERNAS)
==================================*/
/* Página Caçambas*/
.pag-cacamba section.banner {background: url(../images/BANNER-cacamba.jpg) center center; background-size: cover; width: 100%; height: 464px; padding: 78px 0}
/* Página Gerenciamento*/
.pag-gerenciamento section.banner {background: url(../images/BANNER-conteineres.jpg) center center; background-size: cover; width: 100%; height: 350px; padding: 78px 0}
/* Página Construções */
.pag-construcao section.banner {background: url(../images/BANNER-construcao.jpg) center center; background-size: cover; width: 100%; height: 464px; padding: 78px 0}
@media (max-width:768px){
    .pag-gerenciamento section.banner {background: url(../images/BANNER-conteineres.jpg) left center; background-size: cover; width: 100%; padding: 78px 0; height: 464px}
}

/* Página Orgânicos */
.pag-organicos section.banner {background: url(../images/BANNER-organicos.png) left center; background-size: cover; width: 100%; padding: 78px 0; height: 464px}

/* Página Perigosos */
.pag-perigosos section.banner {background: url(../images/BANNER-perigosos.jpg) left center; background-size: cover; width: 100%; padding: 78px 0; height: 464px}

/* Página Empresa */
.pag-empresa section.banner {background: url(../images/BANNER-empresa.jpg) left center; background-size: cover; width: 100%; padding: 78px 0; height: 464px}

/* Página Empresa */
.pag-servicos section.banner {background: url(../images/BANNER-servicos.jpg) left center; background-size: cover; width: 100%; padding: 78px 0; height: 464px}

/* Página Contato */
.pag-contato section.banner {background: url(../images/BANNER-contato.jpg) left center; background-size: cover; width: 100%; padding: 78px 0; height: 364px}

/* Página Fotos */
.pag-fotos section.banner {background: url(../images/BANNER-contato.jpg) left center; background-size: cover; width: 100%; padding: 78px 0; height: 364px}

/* Conteúdo dos Banners Internos*/
.pag-interna .conteudo-banner{background: #fff; padding: 14px 20px 4px}
.pag-interna .conteudo-banner h1{color: #3e9057;}
.pag-interna .conteudo-banner p{color: #9da1a2}

/* ===============================
Section .caminho-navegacao (INTERNAS)
==================================*/
section.caminho-navegacao {background: #f7f7f7; padding: 10px 0}
section.caminho-navegacao a {color: #9da1a2; font-weight: 600; font-size: 12px; padding: 0 6px}
section.caminho-navegacao a:hover {color: #13b0ba; text-decoration: underline;}
section.caminho-navegacao a.pag-atual {color: #3e9057; font-weight: 700}

/* Responsivo */
@media (max-width:1024px) {
    section.caminho-navegacao .link-paginas {margin-left: 30px}
}

@media (max-width:425px) {
    section.caminho-navegacao {display: none;}
}

/* ===============================
Section .conteudo (HOME)
==================================*/
section.conteudo {padding: 50px 0}

/* ===============================
Section .conteudo (INTERNAS)
==================================*/
.pag-interna section.conteudo h2 {font-size: 26px; color: #3e9057; font-weight: 600; margin-bottom: 20px;}
.pag-interna section.conteudo p {font-size: 15px; color: #555; margin-bottom: 20px}
.pag-interna section.conteudo h3 {font-size:18px; color: #13b0ba; font-weight: 700 }
.pag-interna section.conteudo ul {padding: 14px 15px}
.pag-interna section.conteudo li {font-size: 14px; font-weight: 600;}
.pag-interna section.conteudo li:hover{color: #13b0ba}

.pag-interna section.conteudo .btn {margin: 30px 0}
.pag-interna section.conteudo .telefone {color: #13b0ba; font-size: 14px; font-weight: 700;}
.pag-interna section.conteudo .telefone span {font-size: 26px;}

.pag-interna section.conteudo .clientes {padding-top: 0px; text-align: center;}
.pag-interna section.conteudo .clientes .texto {margin-bottom: 50px}
.pag-interna section.conteudo .clientes .cliente {margin-bottom: 50px}

/* secao-1 */
.pag-interna .secao-1 {padding: 60px 0 40px}
.pag-interna .secao-1 .img-leed {margin-top: -20px}
.pag-interna .secao-1 .img-saco {margin-top: -60px}
.pag-perigosos .secao-1 {padding: 90px 0 40px}
.pag-empresa .secao-1 {padding: 80px 0}

/* Conteúdo Lateral */
.pag-interna .chamada-contato {background: #13b0ba; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; color: #fff; padding: 20px 20px 8px}
.pag-interna .chamada-contato h4{font-weight: 700; margin-bottom: 20px; font-size: 20px}
.pag-interna section.conteudo .chamada-contato p{color: #fff; font-size: 14px; font-weight: 700}
.pag-interna .chamada-contato img{float: left; margin-right: 10px; margin-top: 4px}
.pag-interna section.conteudo .chamada-contato .telefone {font-weight: 700; font-size: 20px}

.pag-interna section.conteudo .btn-lg-verde-claro {margin: 20px 0; padding: 10px; font-size: 16px;}

/* Responsivo */
@media (max-width:1024px) {
    .pag-interna section.conteudo {margin-left: 30px; margin-right: 30px}
}
@media (max-width:768px){
    .pag-interna .secao-1 .img-saco {margin-top: 0px}
}

@media (max-width:425px) {
    .pag-interna .secao-1 .img-leed {margin: 0px auto 30px;}
    .pag-interna .secao-1 .img-truck {display: none}
    .pag-interna .secao-1 .img-saco {margin: -50px auto 40px}
    .pag-interna .secao-1 .img-logo {margin-bottom: 60px}
}

/* ===============================
Section .destaque (HOME)
==================================*/
section.destaque {}

/* ===============================
Section .destaque (INTERNAS)
==================================*/
.pag-interna section.destaque {padding: 80px 0 50px; background: #13b0ba; color: #fff;}
.pag-interna section.destaque .texto {margin-bottom: 80px}
.pag-interna section.destaque h2 {font-size: 28px; font-weight: 700; margin-bottom: 10px}
.pag-interna section.destaque p {font-size: 16px; font-weight: 600;}
    
/* Página Construção */
.pag-construcao section.destaque {text-align: center;}
.pag-construcao section.destaque .item {margin-bottom: 50px; opacity: 0.9}
.pag-construcao section.destaque .item:hover {opacity: 1}
.pag-construcao section.destaque .item img {margin-bottom: 10px}

/* Página Orgânicos + Página Perigosos */
.pag-organicos section.destaque,
.pag-perigosos section.destaque{padding-bottom: 5px}
.pag-organicos section.destaque img,
.pag-perigosos section.destaque img{margin-top: -24%; position: absolute;}

/* Página Empresa */
.pag-empresa section.destaque{padding-bottom: 5px; background: #3e9057;}
.pag-empresa section.destaque img{margin-top: -5%; position: absolute;}

@media (max-width:1024px) {
    .pag-empresa section.destaque {padding-left: 40px}
}

@media (max-width:767px) {
    section.destaque .descarte-organico {display: none;}
}

@media (max-width:425px) { 
section.destaque .descarte-organico {width: 50%; margin: -10% 0 50px 20%; display: inline-block;}
section.destaque .descarte-organico {width: 50%; margin: -10% 0 50px 20%;}
}

/* ===============================
Section .servicos (HOME)
==================================*/
section.servicos {padding: 70px 0}

section.servicos .lista-servicos {list-style: none;}
section.servicos .lista-servicos img{float: left;padding: 0 20px 0 0px; opacity: 0.90}
section.servicos .lista-servicos h3{ float: left; font-size: 15px; color: #3e9057; font-weight: 600; margin-top: 10px;}
section.servicos .lista-servicos span{font-size: 14px; color: #9da1a2;}

section.servicos .lista-servicos li {margin-bottom: 50px;}
section.servicos .lista-servicos li.item-4 {float: right}
section.servicos .lista-servicos .item-servico:hover img {opacity: 1}
section.servicos .lista-servicos .item-servico:hover h3 {color: #48a966}

/* Responsivo */
@media (max-width:768px){
    section.servicos {padding:  70px 0 20px 10px;}
    section.servicos .lista-servicos .item-servico {margin-bottom: 60px}
    
}

@media (max-width:425px) {
    section.servicos .lista-servicos li.item-4 {float: inherit}
}

/* ===============================
Section .servicos (INTERNAS)
==================================*/
.pag-interna section.servicos {background: #f7f7f7; padding-bottom: 20px}
.pag-interna section.servicos h2 {font-size: 20px; font-weight: 700; color: #3e9057; text-align: center; margin-bottom: 4px}
.pag-interna section.servicos p {font-size: 14px; font-weight: 600; color: #555; text-align: center; margin-bottom: 80px}

.pag-empresa section.servicos {background: #fff;}
.pag-interna section.servicos .lista-servicos li {margin-bottom: 50px;}
.pag-interna section.servicos .lista-servicos li h3 {font-size: 15px; font-weight: 600}
.pag-empresa section.servicos .lista-servicos li h3 span {font-weight: 600; line-height: 1.8}
.pag-empresa section.servicos {padding-bottom: 0px}


/* Responsivo */
@media (max-width:768px){
    .pag-interna section.servicos {padding-bottom: 10px;}
    .pag-empresa section.servicos .lista-servicos {padding-left: 10px}
}

/* ===============================
Section .contato
==================================*/
section.contato {padding: 50px 0;}
section.contato .formulario {background: #f7f7f7; padding: 50px 20px}
section.contato .formulario textarea {height: 100px}


section.contato .infos-contato {background: #3e9057; padding-top: 40px; text-align: center;}
section.contato .infos-contato .icone {margin-right: 10px; margin-top: -3px}
section.contato .infos-contato .titulo {font-size: 18px; font-weight: 700; color: #fff; margin-top: 40px; margin-bottom: 8px}

section.contato .infos-contato .contato {margin-bottom: 40px}
section.contato .infos-contato .contato .telefones{font-size: 16px; clear: both; color: #fff; font-weight: 600}
section.contato .infos-contato .contato .email{color: #fff; font-size: 12px; font-weight: 600}
section.contato .infos-contato .contato .site{color:#fff; font-size: 15px; font-weight: 600}

section.contato .infos-contato .endereco {color: #fff; font-size: 12px; font-weight: 600; margin-bottom: 17px}
section.contato .infos-contato a {font-size: 12px; font-weight: 700; color: #fff;}
section.contato .infos-contato a:hover {text-decoration: underline;}

section.contato .formulario .btn {margin-top: 20px}

@media (max-width: 768px) {
    section.contato .infos-contato {padding-bottom: 135px}
}

@media (max-width: 425px) {
    section.contato .infos-contato {padding-bottom: 20px}
}
/* ===============================
Section .certificacao-aqua
==================================*/
section.certificacao-aqua {border-bottom: 1px solid #f1f1f1; background: #fdfdfd;}
section.certificacao-aqua h2 {color: #1653a6!important;}

/* ===============================
Section .orgaos-ambientais
==================================*/
section.orgaos-ambientais {text-align: center; padding:60px 0 60px; background: #fdfdfd; border-top: 1px solid #f1f1f1; border-bottom: 1px solid #f1f1f1}
section.orgaos-ambientais h3 {margin: 0px 0 60px; font-size:20px; color: #999; font-weight: 700; vertical-align: middle;}

section.orgaos-ambientais .logo-orgao-1{padding-top: 10px; margin-bottom: 40px}
section.orgaos-ambientais .logo-orgao-2{margin-bottom: 40px}
section.orgaos-ambientais .logo-orgao-3{margin-bottom: 40px}
section.orgaos-ambientais .logo-orgao-4{margin-top: -14px;}

/* ===============================
Section .banner (INTERNAS)
==================================*/
.pag-fotos .galeria {padding: 100px 0}
.pag-fotos .galeria .gallery div {margin-bottom: 30px}

/* ===============================
Footer
==================================*/
footer {background: #333333}
footer .secao-rdp {padding-top: 40px; padding-bottom: 40px}
footer .titulo-secao {font-size: 18px; color: #9da1a2;}
footer .hr {margin: 10px 0 10px; height: 1px; width: 90%; background: #9da1a2; opacity: 0.5}

footer ul {padding: 0 15px}
footer li {color: #fff; font-size: 13px}
footer li a {color: #fff;}
footer li a:hover {color: #fff; text-decoration: underline;}

footer .contato-rdp {color: #fff; float: left; margin-bottom: 16px}
footer .contato-rdp img {float: left; margin: 0 12px 0 0}
footer .contato-rdp p {float: left;font-size: 12px; font-weight: 600}
footer .contato-rdp a {color: #fff}
footer .contato-rdp a:hover {color: #fff; text-decoration: underline;}

/*Small*/
footer .small {background: #222222; color: #9da1a2; padding: 20px; font-size: 10px; font-weight: 600}
footer .small a {color: #9da1a2;}
footer .small a:hover {text-decoration: underline; color: #fff;}

/* Responsivo */
@media (max-width:768px){
    footer .small {text-align: center}
}

/* ===============================
Bootstrap RECONFIG
==================================*/
.row {margin: 0;}

@media (min-width: 1024px) {
  ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;
  }


/* ===============================
Resources
==================================*/

/*Animated*/
.delay-01s { animation-delay: 0.1s; -webkit-animation-delay: 0.1s; }
.delay-02s { animation-delay: 0.2s; -webkit-animation-delay: 0.2s; }
.delay-03s { animation-delay: 0.3s; -webkit-animation-delay: 0.3s; }
.delay-04s { animation-delay: 0.4s; -webkit-animation-delay: 0.4s; }
.delay-05s { animation-delay: 0.5s; -webkit-animation-delay: 0.5s; }
.delay-06s { animation-delay: 0.6s; -webkit-animation-delay: 0.6s; }
.delay-07s { animation-delay: 0.7s; -webkit-animation-delay: 0.7s; }
.delay-08s { animation-delay: 0.8s; -webkit-animation-delay: 0.8s; }
.delay-09s { animation-delay: 0.9s; -webkit-animation-delay: 0.9s; }
.delay-1s { animation-delay: 1s; -webkit-animation-delay: 1s; }

/* ===============================
The End \0/
==================================*/
.hide {display: none; }