/**
* Folha de Estilo HDS Paisagismo
*
* LESSA  Publicidade 27 3315-2696 
*
* css/estilo.css
*/

/* reset css */
html, body, div, span, applet, object, iframe, table, caption,
tbody, tfoot, thead, tr, th, td, del, dfn, em, font, img, ins,
kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,
h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr,
acronym, address, big, cite, code, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend {
    vertical-align: baseline;
    font-family: inherit;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    outline: 0;
    padding: 0;
    margin: 0;
    border: 0;
    text-decoration:none;
}
:focus {
    outline: 0;
}
body {
    background: white;
    line-height: 1;
    color: black;
}
ol, ul {
    list-style: none;
}
table {
    border-collapse: separate;
    border-spacing: 0;
}
caption, th, td {
    font-weight: normal;
    text-align: left;
}
blockquote:before, blockquote:after, q:before, q:after {
    content: "";
}
blockquote, q {
    quotes: "" "";
}

/* ---------------------------------------------------------------- */
@font-face {
    font-family:scada-reg;
    src: url('../fonts/Scada-Regular.otf');
}
@font-face {
    font-family:scot;
    src: url('../fonts/scottn.otf');
}
body{
    background-color: #fff;
    height: 100%;
    width: 100%;
}
.centro{
    width: 1000px;
    margin: auto;
}
#barra_topo{
    background-color: #fff;
    height: 155px;
    position: fixed;
    width: 100%;
    z-index: 9999;
    box-shadow: #b2b2b2 2px 0px 5px;
}
@media screen and (max-width: 1200px) {
  #barra_topo {
    overflow-y: scroll;
  }
}
#barra_topo img#logo{
    margin-top: 30px;
}
#barra_topo ul#menu{
    float: right;
    margin-top: 73px;
}
#barra_topo ul#menu li{
    float: left;
    font-family: scada-reg;
    margin-left: 32px;
    text-transform: uppercase;
}
#barra_topo ul#menu li a{
    color:#333333;
    font-size: 16x;
}
#barra_topo ul#menu li a:hover{
    color: #888;
}
#home{
    background-color: #00cb73;
    width: 100%;
    padding-bottom: 150px;
    padding-top: 155px;
}
#home #banner{
    height: 400px;
    width: 100%;
}
#home p#apresentacao{
    color:#fff;
    font-size: 19.4px;
    line-height: 23.5px;
    font-family: scada-reg;
    text-align: justify;
    width: 950px;
    margin: auto;
    margin-top: 75px;
    margin-bottom: 65px;
}
#home ul#box li{
    float: left;
}
#home ul#box li.margin-right{
    margin-right: 12px;
}
#home ul#box li div{
    width: 323px;
    border: 1px #016735 solid;
    border-radius: 12px;
    color: #016735;
    height: 260px;
    margin-right:
}
#home ul#box li div h1{
    font-family: scada-reg;
    font-size: 27px;
    margin: 20px 0px 20px 28px;
}
#home ul#box li div p{
    text-align: justify;
    font-family: scada-reg;
    font-size: 15px;
    margin-left: 31px;
    width: 260px;
    line-height: 19.2px;
}
#estrutura{
    background-color: #fff;
    padding-bottom:148px;
    width: 100%;
}
#estrutura ul{
    margin-top: 50px;
}
#estrutura ul li{
    width: 333px;
    height: 300px;
    float: left;
}
#estrutura ul li.mosaic-block {
    width: 333px;
    height: 300px
	float:left;
	position:relative;
	overflow:hidden;
}
#galeria ul li.mosaic-block .mosaic-overlay,
#estrutura ul li.mosaic-block .mosaic-overlay {
    z-index:5;
    position:absolute;
    width:100%;
    height:50px;
    background-image: url(../images/fundo_legenda.png);
}
#galeria ul li.mosaic-block .mosaic-overlay p,
#estrutura ul li.mosaic-block .mosaic-overlay p{
    color:#fff;
    margin: 7px 15px;
    font-family: scada-reg;
    font-size: 12.8px;
    letter-spacing: 0.03em;
    line-height: 1.4em;
    text-align: justify;
}
#galeria ul li.mosaic-block .mosaic-backdrop,
#estrutura ul li.mosaic-block .mosaic-backdrop {
    position:absolute;
    top:0;
    height:100%;
    width:100%;
}
#galeria ul li.mosaic-block .mosaic-backdrop img,
#estrutura ul li.mosaic-block .mosaic-backdrop img{
    width: 335px;
}
#estrutura ul li#title{
    background-color: #00cb73;
    color:#fff;
    font-size: 24px;
    font-family: scada-reg;
}
#estrutura ul li#title h2{
    width: 208px;
    text-align: center;
    margin: auto;
    margin-top: 38px;
    line-height: 28.8px;
    font-weight: bold;
}
#complemento_servico{
    height: 40px;
    background-color:#3ecb8c;
    width: 100%;
}
#servicos{
    margin-top: 0px;
    border: none;
    background-color: #004e2c;
    padding-bottom: 148px;
    width: 100%;
}
#servicos #title_servico{
    background-color: #3ecb8c;
    padding-bottom: 38px;
}
#servicos #title_servico h2{
    color: #004e2c;
    width: 734px;
    font-size: 31.7px;
    font-family: scada-reg;
    text-align: center;
    margin: auto;
    line-height: 38.1px;
}
#servicos ul{
    margin-top: 32px;
}
#servicos ul li{
    float: left;
    border: #3ecb8c 1px solid;
    width: 210px;
    padding-left:19px;
    padding-right:19px; 
    height: 106px;
    position: relative;
    display:table; 
}
#servicos ul li p{
    font-family: scada-reg;
    font-size: 17px;
    text-align: center;
    color: #fff;
    width: 220px;
    margin: auto;
    display: table-cell;
    vertical-align: middle;
}
#galeria{
    background-color: #fff;
    padding-bottom: 148px;
    width: 100%;
}
#galeria ul{
    margin-top: 108px;
}
#galeria ul li{
    float: left;
    width: 333px;
    height: 253px;
	position:relative;
	overflow:hidden;
}
#galeria ul li.mosaic-block img{
    height: 254px;
}
#galeria ul li.mosaic-block .ocult{
    display: none;
}
#galeria ul li.mosaic-block .opacity_album{
    width: 333px;
    height: 253px;
    background-image: url(../images/fundo_legenda.png);
    position: absolute;
    z-index: 1;
    opacity: 0;
    display:none;
}   
#galeria ul li.mosaic-block .opacity_album img{
    width: 24px;
    height: 24px;
    float: right;
    margin-top: 5px;
    margin-right: 5px;
}
#galeria ul li.mosaic-block .mosaic-overlay p{
    color:#fff;
    margin: 7px 15px;
    font-family: scada-reg;
    font-size: 18px;
    letter-spacing: 0.03em;
    line-height: 1.4em;
    text-align: justify;
}
#clientes{
    background-color: #fff;
    padding-bottom: 148px;
    width: 100%;
}
#clientes ul{
    margin-top: 61px;
}
#clientes ul li{
    float: left;
    width: 323px;
    height: 144px;
    margin: 5px;
    box-shadow: #d1d1d1 2px 2px 5px;
    text-align: center;
}
#clientes ul li img{
    max-width: 250px;
    max-height: 110px;
}
#contato{
    padding-bottom: 35px;
    width: 100%;
}
#contato #esquerda{
    width:1300px;
    height: 500px;
    float: left;
    background-image: url(../images/mapa.png);
    background-repeat: no-repeat;
    background-position: right;
    background-size: 1000px;
    margin-left: -870px;
    overflow: hidden;
}
#contato #esquerda .map_canvas{
    height: 650px;
    width: 1800px;
    margin-right: -750px;
    float: right;
    margin-top: -25px;
}
#contato #esquerda #box_endereco{
    width: 160px;
    height: 160px;
    background-image: url(../images/fundo_endereco.png);
    border-radius:90px 90px 25px 90px;
    position: relative;
    display:table;
    float:right;
    top:143px;
    right: -820px;
}
#contato #esquerda #box_endereco h3{
    text-align: center;
    font-family: scada-reg;
    font-size: 11.7px;
    font-weight: bold;
    color:#fff;
    line-height: 15px;
    display: table-cell;
    vertical-align: middle;
}
#contato #direita{
    width: 545px;
    float: right;
}
#contato #direita h2{
    color:#e3e3e3;
    font-size:77.4px;
    font-family: scada-reg;
    letter-spacing: 42px;
    margin-bottom: 17px;
}
#contato #direita form{
    margin-bottom: 59px;
}
#contato #direita form label{
    color:#333333;
    font-family: scada-reg;
    font-size: 19px;
}
#contato #direita form #form_esquerda{
    float: left;
}
#contato #direita form #form_direita{
    float: right;
}
#contato #direita form #form_esquerda input,
#contato #direita form #form_direita input{
    height: 27px;
    width: 252px;
}
#contato #direita form #form_esquerda input,
#contato #direita form #form_direita input,
#contato #direita form textarea{
    border-radius: 4px;
    border:1px solid #b1b1b1;
    padding: 4px;
    margin-top: 8px;
    margin-bottom: 8px;
}
#contato #direita form textarea{
    width: 100%;
    height: 142px;
    resize: none;
}
#contato #direita form input[type="submit"]{
    background-color: #00cb73;
    width: 94px;
    height: 27px;
    border-radius: 4px;
    border:none;
    box-shadow: #2b8953 0px 1px 0px;
    color:#fff;
    font-size: 19px;
    font-family: scada-reg;
    float: right;
    margin-top: 2px;
    cursor: pointer;
}
#contato #direita form input[type="submit"]:hover{
    opacity: 0.8;
}
#contato #direita #telefone,
#contato #direita #email{
    color:#333333;
    font-family: scada-reg;
    font-size: 18.9px;
}
#contato #direita #telefone small{
    font-size: 14px;
}
#contato #direita #telefone a,
#contato #direita #email a{
    color:#333333;
}
#contato #direita #telefone{
    float: left;
    width: 260px;
}
#contato #direita #email{
    float: right;
    width: 278px;
}
#contato #direita img{
    float: left;
    margin-top: -15px;
    margin-right: 10px;
}
#rodape{
    background-color: #004e2c;
    padding-top: 4px;
    padding-bottom: 2px;
    text-align: center;
    width: 100%;
    padding-bottom: 7px;
}
#rodape img{
    margin-top: 65px;
    margin-bottom: 50px;
}
#rodape .rodape{
    float: left;
    color:#002e1a;
    margin-top: 16px;
}
#rodape #float_txt{
    margin: auto;
    width: 200px;
}
#rodape .rodape#desen{
    font-family: scada-reg;
    font-size: 11px;
    margin-top: 18px;
}
#rodape .rodape#lessa{
    font-family: scot;
    margin-left: 6px;
    font-size: 14px;
}
#rodape .rodape#lessa font{
    font-family: scada-reg;
    margin-left: 3px;
    font-size: 12px;
    margin-right: 10px;
}


#background_black{
    width: 100%;
    height: 100%;
    z-index: 9999;
    position: fixed;
    top: 0;
    background-color: #000;
    opacity: 0.8;
    display: none;
}
#modal_video{
    position: fixed;
    z-index: 9999;
    top: 0;
    padding: 5px;
    background-color: #fff;
    left:50%;
    margin-left: -320px;
    top: 50%;
    margin-top: -240px;
    display: none;
}
a#close_video{
    color:#666;
    margin-left:639px;
    margin-top: -10px;
    position: absolute;
    top:0;
    font-family: scada-reg;
    font-weight: bold;
    font-size: 16px;
    width: 16px;
    height:15px;
    background-color: #fff;
    display: table-cell;
    padding-bottom: 2px;
    text-align: center;
    vertical-align: middle;
    border-radius:10px;
    box-shadow:0px 0px 5px #000;
}


.clear{
    clear: both;
}