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

@media only screen and (max-width: 1200px) {	

#menu-mob {display:block;}

#top {
	position:fixed;
	top: 0;
	bottom: 0;
	width:100%;
	height: auto;
	margin: 0 auto;
	background-color: #FFF !important;
	display: none;
	z-index:998;
	opacity: 0.95;}

.logo {display: none;}
.logo-mob {display: block;}

.top-mob {display: block;}

nav {margin-top: 50px; margin-left: 0px;}

	nav ul li {display: block; text-align:center;}
	
	nav ul li a {margin: 0px auto; padding: 25px; color: #666;}

p {padding: 0px 20px; font-size:18px;}
	
#nav-mob {display:block;}
	
#nav-desk {display:none;}
	
.medias {
	position: absolute;
	left: 50%;
	margin-left: -55px;
	margin-top:350px;
	right: 0px;
	width: 120px;	
	}

.link-desk {display: none;}
.link-mob {display: block;}


#banner {box-shadow: 0px 10px 20px #999; padding: 100px 0px 70px;}

#produtos, #sobre, #contato {padding: 70px 0px;}

#produtos #container {max-width: 800px;}


	#contato .box {width: 100%; margin: 0 auto; float:none;}

	#contato img {margin-left:10px}

	.map-500 {display: none;}
	.map-full {display: block;}	

}


@media only screen and (max-width: 800px) {

#produtos #container {max-width: 350px;}

#produtos .box {float: none; width: 350px; margin: 25px auto;}

#produtos p { height: auto;}

.text-desk {display: none;}
.text-mob{display: block;}

 }	


@media only screen and (max-width: 340px) {

#banner .p1 {font-size: 40px;}

#produtos .box {float: none; width: 300px; margin: 25px auto;}

#produtos p { height: auto;}

#contato .text {font-size: 16px;}

 }