@charset "utf-8";
/* CSS Document */

@font-face {
    font-family: 'roboto';
    src: url('Roboto-Light-webfont.eot');
    src: url('Roboto-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('Roboto-Light-webfont.woff') format('woff'),
         url('Roboto-Light-webfont.ttf') format('truetype'),
         url('Roboto-Light-webfont.svg#roboto') format('svg');
    font-weight: normal;
    font-style: normal;

}

/* Chrome, Safari, Opera */

body{ background: #FFF; font-family:'roboto'; padding:0; margin:0;}
menu, ul, li{ margin:0; padding:0}
a{text-decoration:none;}
div.clear{ clear:both; float:none;}
.larg{ width:80%; margin:auto;}	
header{ position:absolute; z-index:3; text-align:left; top:0}
header div.logo{ width:40%; margin: 5%}
header div.logo img{ width:100%}
menu{ width:80%;}
menu ul li{ width:46.2%; float:left; list-style:none; margin:1% 1.6% 1% 1.6%; text-align:center; border-radius: 10%}
menu ul:nth-child(2) li:first-child{ background:rgba(57,92,208, 0.8)}
menu ul:nth-child(2) li:last-child{ background:rgba(32,148,46, 0.8)}
menu ul:last-child li:first-child{ background:rgba(198,20,45, 0.8)}
menu ul:last-child li:last-child{ background:rgba(247,202,18, 0.8)}
menu ul li p{ display:none; color:#FFF;}
menu ul li:hover p{ display: block; font-size: medium}
menu ul li img{ width:60%; margin-top:15%}
div.divisao{ position:relative; z-index:1;}
div.divisao img{ width:100%; margin: -2% 0;}
div.banner{ position:relative; top:0; z-index:2;}

div.text{ color:#FFF; font-size:x-large }

div#sobre{ background-image: url(../images/qmsomos.png); background-position: right center; background-repeat:no-repeat; background-size:64%; position:relative; z-index:2;}
div#sobre div.text{ background-color: rgba(32,148,46, 0.8); background-image:url(../images/bgqmsomos.png); background-position:left center; background-repeat:no-repeat; padding: 0 3% 0 24%; background-size:38%;}

div#servicos{ background-image: url(../images/serv.png); background-position: left center; background-repeat:no-repeat; background-size:61%; position:relative; z-index:2;}
div#servicos div.text{ background-color: rgba(198,20,45, 0.8); background-image:url(../images/bgservicos.png); background-position:right center; background-repeat:no-repeat; padding: 0 24% 0 3%; background-size:33%;}


div#planos{ background-image: url(../images/plans.png); background-position: right center; background-repeat:no-repeat; background-size:37%; position:relative; z-index:2; padding:0 0 6%}
div#planos img.titulo{ width:45%; display:block; margin: -7% auto 4%;}
div#planos div h2{ padding:10% 0; font-size:larger;}

label{ color:#FFF;}
input{ padding:2%; width:85%; background:#48A754; color:#FFF; border: 1px solid #FFF;}
select{ padding:2%; width:85%; background:#48A754; color:#FFF; border: 1px solid #FFF}
option{ background:#0F2F55; color:#FFF;}

textarea{ padding:2%; width:85%; background:#48A754; color:#FFF; border:none; font-family:'roboto';}
button{ padding:2%; width:30%; background:#48A754; color:#FFF; border: 1px solid #FFF}


div#contato{ background: none; position:relative; z-index:2; height:505px;}

div#contato div.text{ background-color: rgba(77,77,77, 0.8); background-image: url(../images/bgcontato.png); background-position:left center; background-repeat:no-repeat; padding: 0 3% 0 24%; background-size:28%;}

div#contato form input{ padding:2%; width:85%; background:#48A754; color:#FFF; border:none; margin-top:-6%}
div#contato form button{float:right; margin-right:1% }
footer{ background: none; position:relative; z-index:2; background:#DBDBEA;}
footer div img{ width:90%}
footer div.social img{ width:70%; margin-bottom:10%}
footer a{ color:#000; text-decoration:none;}


div#map_canvas{ height: 680px;}
div.sobe{ width:100%; position:fixed; bottom:1%;  background-color: rgba(0,0,0, 0.5); text-align:center; z-index:3499}
div.sobe a{ padding:1%; color:#fff; text-decoration:none; display:block;}

@media only screen and (max-width:1380px){
div.text{ color:#FFF; font-size: larger }
div#sobre div.text{  background-size:36%;}
div#servicos div.text{ background-size:32%;}
div#contato div.text{ background-size:30%;}

div#sevicos{ background-size:57%;}
div#planos{ padding:0;}
div#planos div h2{ padding:16% 0; font-size:larger;}
div#map_canvas{ height: 505px}


}
@media only screen and (max-width:768px){
	
div#contato div.text{ background-size:39%;  padding: 0 3% 0 34%;}
div#planos div h2{ padding:44% 2%; font-size:larger;}
div#sobre{ background-size: 123%;}
div#sobre div.text{  background-size:55%; padding:0 3% 0 65%; }
div#servicos div.text{ background-size:47%; padding:0 65% 0 3%;}
div#servicos{background-size:145%; }
div#map_canvas{ height: 440px}

div.banner{ margin-top:20%}
header.larg{ width:100%}
header div.logo{margin: auto; padding:1% 0; background:#15366B; text-align:center; width:100%}
header div.logo img{ width: 60%}
}
@media only screen and (max-width:480px){
div.text p{  width:95%;}
div.text form{ width:80%;}
div#sobre{ background:none;}
div#servicos{background:none;}
div#sobre div.text{ background-image: url(../images/bgqmsomos2.png); padding:0 0 0 15%; width:85%; background-size:64%;}
div#servicos div.text{ background-image: url(../images/bgservicos2.png); padding:0 10% 0 5%; width:85%; background-size:56%;}
div#contato div.text{ background-image: url(../images/bgcontato2.png);  padding: 0 0 0 15%; background-size:42%; width:85%;}

	
}