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

/* Importazione fogli di stile */
@import "reset.css";
@import "font.css";
@import "obsoleto.css";

body {
	font-family: 'roboto_medium', sans-serif;
	font-size: 1em;
	/*background-color: #000000;*/
	color:#333333;
	overflow-x: hidden;
}

    .left{
        float:left;
    }

    .right{
        float:right;
    }

    .fontlight{
        font-family: 'roboto_light', sans-serif;
    }

	a {
		color: #333333;
	}

	.container {
		width:950px;
		margin:0 auto;
		padding: 1em 2em 5em 2em;
	}

	.container-logo{
		width: 140px;
		margin: 4em 0 2em 0;
	}

	.container-logo-b{
		width: 180px;
		margin: 4em 0 2em 0;
	}

	.container-logo-b img{
		width: 100%;
	}

	
	.p80 img{
		height: 40px;
	}

	/* HEADER */

	#header {
		width:100%;
		position:relative;
		background-color:#FFFFFF;
	}

		#header h1 {
			font-size:4em;
			font-family: 'roboto_medium', sans-serif;
			float:left;
			margin: 0;
		}

			#header h1 img {
				height:0.9em;
				margin-right: 0.1em;
				float:left;
			}

			#header h1 span {
				display:block;
				float:left;
			}

				#header h1 span.light {
					font-family: 'roboto_light', sans-serif;
				}

		#header h1.titolo{
		    font-size:4em;
            font-family: 'roboto_medium', sans-serif;
            float:left;
            margin: 0.5em 0 0 0 ;
            border-bottom:0.5em solid #8a8a89;
		}

		#header h2 {
			font-family: 'roboto_light', sans-serif;
			font-size:2em;
			text-transform:uppercase;
		}

		#header h3 {
			font-family: 'roboto_light', sans-serif;
			font-size:2em;
		}

			#header h3 a {
				text-decoration: underline;
				font-family: 'roboto_medium', sans-serif;
			}

			#header h3 a:hover {
				color:#666666;
			}

		#header h4 {
			font-family: 'roboto_light', sans-serif;
			font-size: 1.4em;
			margin: 1em 0;
		}

			#header h4 span {
				display:block;
				float:left;
				margin-right: 0.1em;
				padding: 0.2em 0;
			}

			#header h4 a {
				font-family: 'roboto_medium', sans-serif;
				text-decoration: underline;
				display:block;
				float:left;
				margin-right: 0.1em;
				padding: 0.2em 0;
			}

			#header h4 a:hover {
				color:#666666;
			}

		#header h5 {
			font-family: 'roboto_medium', sans-serif;
			font-size: 1.2em;
		}

			#header h5 span {
				display:block;
				float:left;
				padding: 0.2em 0;
				margin-right: 0.1em;
			}

		#header .icons {
			margin:3em 0 7em 0;
	   }

			#header .icons li {
				float:left;
				margin-right:0.5em;

			}

				#header .icons li img {
					width:100%;
					max-width: 40px;
				}


	    #header .loghi{
            width:100%;
            margin:20px auto;
            float:left;
            font-size:2em;
        }
        #header .logofriweb img{
            width:200px;
            margin-right:10px;
        }
        #header .logoenrico{
            line-height: 1.5em;
        }

        #header .indirizzi{
            position:absolute;
            width:30%;
            max-width:150px;
            height:150px;
            right:0px;
            top:20%;
            padding:10px;
            background-color: #8a8a89;
        }

        #header .indirizzi .titolo{
            font-size: 2em;
        }
        #header .indirizzi .testo{
            position:relative;
            top:85px;
            text-decoration: underline;
            line-height: 1.2em;
            font-size: 0.8em;
        }
	/* SECTION */

	#section {
		/*background-image: url('../img/bg-texture.jpg');*/
		position: relative;
		color: #222;
		font-family: 'roboto_light', sans-serif;
	}

	#section #panorama{
	   background-color:#ddd;

	}

	#section #object {
       background-color:#ddd;

    }
		#section .article {
			position: relative;
		}

		    #section .article .box .boxnumero{
		        border-bottom:0.3em solid #8a8a89;
                max-width:300px;
                font-family: 'roboto_medium', sans-serif;
                font-size: 1.5em;
                margin-bottom:0.5em;
                line-height:1.6em;
		    }

		    #section .article .box .boxtitolo{
                max-width:300px;
                font-family: 'roboto_medium', sans-serif;
                font-size: 1.5em;
                margin-bottom:1.5em;
                line-height:1.2em;
            }

			#section .article .box {
				margin: 6em 0;
			}

			#section .article h1 {
				font-family: 'roboto_medium', sans-serif;
				font-size: 3em;
				/*text-transform: uppercase;*/
				color: #222;
				float:left;
			}

				#section .article h1 span {
						display:block;
						float:left;
					}

			#section .article h2 {
				font-family: 'roboto_thin', sans-serif;
				font-size: 1.5em;
				margin-bottom:0.5em;
				line-height:1.6em;
			}

				#section .article h2 span {
					font-size: 1.8em;
				}

			#section .article p {
			    max-width:400px;
				font-family: 'roboto_thin', sans-serif;
				font-size: 1.3em;
				margin-bottom:1.5em;
				margin-top:1em;
				line-height: 1.4em;
			}

			#section .article .link {
				float:left;
				margin-bottom:1em;
			}

				#section .article .link li {
					display:block;
					float:left;
					margin-right:0.5em;
					height: 2em;
					line-height: 2em;
				}

					#section .article .link a {
						font-size:1.4em;
						color:#333;
						text-transform:uppercase;
						text-decoration:underline;
						display:block;
						float:left;
					}

						#section .article .link a:hover {
							color:#666;
						}

			#section .article .img {
				width:100%;
				/*padding:1%;
				border:1px solid #CCCCCC;*/
			}

				#section .article .img a {
					display:block;
					position: relative;
				}

				#section #panorama .img img {
					width:100%;
				}

			#section .article .mosaico-object {
				float:left;
				margin-left: -10px;
				margin-top: -10px;
				width:100%;
			}

				#section .article .mosaico-object li {
					width:30%;
					/*padding:1%;*/
					float:left;
					margin-left:10px;
					margin-top:10px;
					/*border:1px solid #CCCCCC;*/
				}

					#section .article .mosaico-object li a {
						display:block;
						position: relative;
					}

						#section .article .mosaico-object li a img {
							width:100%;
						}


		.opacity {
			position:absolute;
			width:100%;
			height:100%;
			background:url('../img/opacity.png');
			display:none;
		}

		#section .article .mosaico-object li:hover .opacity, #section .article .img:hover .opacity {display:block;}

		#section .arrow-down {
			width: 100%;
			height: 60px;
			background-image: url('../img/arrow-down-withe.png');
			background-position: center center;
			background-repeat: no-repeat;
		}

		#section .arrow-down-black {
			width: 100%;
			height: 60px;
			background-image: url('../img/arrow-down-withe.png');
			background-position: center center;
			background-repeat: no-repeat;
		}

		#section .arrow-up {
			width: 100%;
			height: 60px;
			background-image: url('../img/arrow-up-withe.png');
			background-position: center center;
			background-repeat: no-repeat;
			position:absolute;
			bottom:0;
		}

		#section .divisore {
			width:100%;
			background-color:#fff;
			height:3em;
			/*background-image: url("../img/logo-grey.png");*/
			background-repeat: no-repeat;
			background-position: center center;
		}

	/* footer */

	#footer {
		/*background-color:#000000;*/
		width:100%;
		color:#222;
		text-align:center;
		font-family: 'roboto_light', sans-serif;
	}

		#footer img {
			margin-bottom:1em;
			width:112px;
		}

		#footer h4 {
			font-size:1.2em;
			margin-bottom:1em;
		}

		#footer h5 {
			font-size:1em;
			margin-bottom:0.5em;
		}

		#footer p {
			font-size:1em;
			margin-bottom:1em;
			line-height:1.3em;
		}

		#footer p.note {
			font-size:0.9em;
			color:#666666;
		}

		#footer a {
			color:#222;
			text-decoration:underline;
		}

			#footer a:hover {
				color:#666;
			}

#top {
	padding:0.3em;
	border:1px solid #ffffff;
	color:#ffffff;
	position: fixed;
	bottom:2em;
    right:2em;
    cursor:pointer;
    display:none;
    font-family: 'roboto_light', sans-serif;
    text-transform:uppercase;
}

	#top span {
		display:block;
		padding:1em;
		background:url('../img/opacity.png');
	}


/* --- */
@media screen and (max-width: 1100px) {

	body {
		font-size:0.9em;
	}

	.container {
		width:auto;
	}

	#header .indirizzi{

        position:inherit;
        max-width:none;
        height:auto;
        right:0px;
        top:none;

        width:80%;
        right:0px;
        padding:10px;
        background-color: #8a8a89;

        margin-bottom:1em;
    }

    #header .indirizzi .testo{
        position:relative;
        top:0;
        text-decoration: underline;
        line-height: 1.2em;
        font-size: 1em;
    }

    #header .logoenrico {
        line-height: 1.7em;
    }
    .p80 img{
		height: 30px;
	}
}

/* --- */
@media screen and (max-width: 600px) {

	body {
		font-size:0.8em;
	}
	#header .logoenrico {
        line-height: 1.9em;
    }
    
   	.p80 img{
		height: 20px;
	}
}

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

	#section .article .mosaico-object li {
		width:40%;
	}
	#header .logoenrico {
    line-height: 1.9em;
}
}

/* background retina display */

@media only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {

	.section .arrow  {
		background-image: url('../img/arrow-down-withe@2x.png');
		background-size: 240px 60px;
	  }

	 .section .arrow-down-black {
		background-image: url('../img/arrow-down-black@2x.png');
		background-size: 240px 60px;
	  }

	  .divisore {
	  	background-image: url("../img/logo-grey@2x.png");
		background-size: 112px 24px;
	  }


}