@import url(https://fonts.googleapis.com/css?family=Roboto:400,700);

* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
body, html {
	
    margin: 0;padding: 0;
    font-family: 'Roboto', sans-serif;
    text-align: justify;
}

h1 { display: block;   margin: 0;   font-size: 20px;   font-weight: 700; }
h2 { display: block;   margin: 0;   font-size: 18px;   font-weight: 700; }
h3 { display: block;   margin: 0;   font-size: 18px;   font-weight: 400; }
input {font-size: 18px;   font-weight: 400; font-family: 'BenchNine', sans-serif; margin-bottom:20px;}
textarea {font-size: 18px;   font-weight: 400; font-family: 'BenchNine', sans-serif;width:100%;}
a		{text-decoration: none;}
a:hover {text-decoration: underline;}

header {width:100%; height:100%; margin:0; padding: 0; background: url(header.jpg) bottom left no-repeat;	background-size: cover; position: relative; cursor:pointer;}


nav {margin: 0 auto ;padding:0;background:#ffffff;}
nav ul {list-style-type: none;margin: 0;padding: 0;font-weight: 700;}
nav ul li a {font-weight: 700;color: #000; text-decoration: none; display: block;}
nav ul li a:hover {text-decoration:none;font-weight: 200;}
li  {font-style:italic; font-size:15px; margin-bottom:5px;}
footer {
	
    width: 100%;
    word-wrap: break-word;
	text-align: center;
    background: #b3c9ec;
    color: #335c9c;
	font-size:15px;
	 margin: 0;padding: 5px;
}
footer a {
    color: #335c9c;font-weight:700;
}

#page {
    font-size:18px;
    margin: 5px auto;
	padding:5px;
	min-height:450px;

   

}

.rwd-video {
	height: 0;
	overflow: hidden;
	padding-bottom: 56.25%;
	padding-top: 30px;
	position: relative;
}
.rwd-video iframe,
.rwd-video object,
.rwd-video embed {
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}


#gmaps-canvas {margin:0 auto;}


.max {width:100%;}
.fotosx {float:left;width:220px;margin:10px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-o-border-radius: 5px;border-radius: 5px;}
.fotodx {float:right;width:220px;margin:10px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-o-border-radius: 5px;border-radius: 5px;}
.lavori {width:90%; font-size:15px;background:transparent;}
.contatti {background:#78AD42;margin:0 auto; width:100%;}
.contatti_label {width:25%;}
.contatti_input {width:75%;}

.attiva-nav {display:none;}
.icon-bar   {display:none;}
.clearboth	{clear:both;}
.twentypx {height:20px;}



@media only screen and (min-width:1281px) {

	header {height: 20em;}
	nav    {width: 1250px;height:35px;border:0;}
	nav ul li {display: block; float: left;margin-right: 10px;}
	nav ul li a {
		font-size: 20px;
		border-bottom: .1em solid #d0d0d0;
		float: left;
		padding: 0 5px;
		transition-property: all;
	    transition-duration: 500ms;
		transition-timing-function: ease;
	    transition-delay: 100ms;
		-webkit-transition-property: all;
	    -webkit-transition-duration: 500ms;
		-webkit-transition-timing-function: ease;
	    -webkit-transition-delay: 100ms;
		-o-transition-property: all;
		-o-transition-duration: 500ms;
		-o-transition-timing-function: ease;
		-o-transition-delay: 100ms;
		-moz-transition-property: all;
	    -moz-transition-duration: 500ms;
		-moz-transition-timing-function: ease;
		-moz-transition-delay: 100ms;
	}
	nav ul li a:hover {border-bottom: .2em solid #78AD42;}
	#page {width: 1250px;}
	#gmaps-canvas {width:480px; height:480px;}
	.selected {border-bottom:.1em solid #78AD42; }
	.maps {float:right;width:500px;}
	.address {float:left;width:730px;}

	.address_contatti	{float:left;width:450px;}
	.form_contatti		{float:left;width:450px;}
	.foto_logo			{float:left;width:220px;margin:10px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-o-border-radius: 5px;border-radius: 5px;}


}
@media only screen and (min-width:769px) and (max-width:1280px) {
	header {height: 15em;}
	nav	  {width: 750px;height:35px;border:0;}
	nav ul li {display: block; float: left;margin-right: 10px;}
	nav ul li a {
		font-size: 20px;
		border-bottom: .1em solid #d0d0d0;
		float: left;
		padding: 0 5px;
		transition-property: all;
	    transition-duration: 500ms;
		transition-timing-function: ease;
	    transition-delay: 100ms;
		-webkit-transition-property: all;
	    -webkit-transition-duration: 500ms;
		-webkit-transition-timing-function: ease;
	    -webkit-transition-delay: 100ms;
		-o-transition-property: all;
		-o-transition-duration: 500ms;
		-o-transition-timing-function: ease;
		-o-transition-delay: 100ms;
		-moz-transition-property: all;
	    -moz-transition-duration: 500ms;
		-moz-transition-timing-function: ease;
		-moz-transition-delay: 100ms;
	}
	nav ul li a:hover {border-bottom: .2em solid #78AD42;}
	#page {width: 750px;}
	#gmaps-canvas {width:380px; height:380px;}
	.selected {border-bottom:.1em solid #78AD42; }
	.maps {float:right;width:400px;}
	.address {float:left;width:330px;}
	.address_contatti	{float:left;width:360px;font-size:15px;}
	.form_contatti		{float:left;width:380px;}
	.foto_logo			{float:left;width:220px;margin:10px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-o-border-radius: 5px;border-radius: 5px;}
	
}
@media only screen and (min-width:481px) and (max-width:768px) {

	header {height: 10em;}

	#page {width: 95%;background:#ffffff;}
	#gmaps-canvas {width:100%; height:400px;}

	nav {position: absolute;top: 10em;left: 2.5%;width: 95%;z-index: 10000;display: none;height: auto;border: 1px solid #000;}
	nav ul li {float: none;	padding: 0;	}
	nav ul li a {padding: 5px ;	width: 100%;transition-property: none;-webkit-transition-property: none;-o-transition-property: none;-moz-transition-property: none;font-size:22px;}
	nav ul li a:hover {background: #78AD42;color: #d0d0d0;}
	
	.attiva-nav {	position: absolute;bottom:15px;left:15px; outline: #000 solid thin;	padding: 5px; cursor: pointer;margin: 0; color: #fff;text-shadow: 0 -1px 0 rgba(0, 0, 0, .25); background: #78AD42;
					-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;display: block;}

	.icon-bar {	display: block; width: 18px;height: 2px;margin: 5px;background-color: #f5f5f5;-webkit-border-radius: 1px;-moz-border-radius: 1px;border-radius: 1px;
				-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .25);-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .25);box-shadow: 0 1px 0 rgba(0, 0, 0, .25);}
	.selected {border-bottom:0; }
	.maps {width:100%;margin-top:10px;}
	.address {width:100%;}
	.address_contatti	{width:95%;margin:0 auto;}
	.form_contatti		{width:95%;margin:10px auto;}
	.foto_logo			{float:left;width:220px;margin:10px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-o-border-radius: 5px;border-radius: 5px;}

}

@media only screen and (max-width:480px) {
	html, body {background:#000000;}
	header {height: 5em;}
	#page {width: 90%;background:#ffffff;}
	#gmaps-canvas {width:100%; height:250px;}
	
	nav {position: absolute;top: 5em;left: 5%;width: 90%;z-index: 10000;display: none;height: auto;border: 1px solid #000;}
	nav ul li {float: none;	padding: 0;	}
	nav ul li a {padding: 5px ;	width: 100%;transition-property: none;-webkit-transition-property: none;-o-transition-property: none;-moz-transition-property: none;font-size:22px;}
	nav ul li a:hover {background: #78AD42;color: #d0d0d0;}
	
	.attiva-nav {	position: absolute;bottom:15px;left:15px; outline: #000 solid thin;	padding: 5px; cursor: pointer;margin: 0; color: #fff;text-shadow: 0 -1px 0 rgba(0, 0, 0, .25); background: #78AD42;
					-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;display: block;}

	.icon-bar {	display: block; width: 18px;height: 2px;margin: 5px;background-color: #f5f5f5;-webkit-border-radius: 1px;-moz-border-radius: 1px;border-radius: 1px;
				-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .25);-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .25);box-shadow: 0 1px 0 rgba(0, 0, 0, .25);}
	.selected {border-bottom:0; }
	.maps {width:100%;margin-top:10px;}
	.address {width:90%;}
	.address_contatti	{width:90%;margin:0 auto;}
	.form_contatti		{width:90%;margin:10px auto;}
	.fotosx				{width:90%;margin:10px auto;-webkit-border-radius: 5px;-moz-border-radius: 5px;-o-border-radius: 5px;border-radius: 5px;display:block;float:none;}
	.fotodx				{width:90%;margin:10px auto;-webkit-border-radius: 5px;-moz-border-radius: 5px;-o-border-radius: 5px;border-radius: 5px;display:block;float:none;}
	
}