body {
	margin:0; padding:0; background-color: #fff; color:#000; font-family: Arial, Helvetica, sans-serif;

	height:100%;


/*
 	background-image: url(i/bg-s4.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	background-attachment: fixed;
	
*/


 }
 
 html {height: 100%;}



h1,h2,h3,h4 { margin:0; padding:0; 
font-family: "Open Sans","Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: bold;
letter-spacing: -2px;
text-transform: uppercase;}

.clear {clear:both; font-size:1px; height:1px; visibility: hidden;}


.thumb img { border: 1px solid #2c2c2c; padding: 10px; margin:0 2px 2px 0; background-color:#282828; display:inline; float:left;  height:130px; }



a.linkmenu { display:block; padding:10px; font-family:"Open Sans","Helvetica Neue", Helvetica, Arial, sans-serif; text-transform:uppercase; }

a.linkmenu:link    { color: #000; text-decoration:none;  }
a.linkmenu:visited { color: #000; text-decoration:none; } 
a.linkmenu:hover, a.linkmenu:active   { color: #09F; text-decoration: none; background-color:#FFF }



#wrapper { text-align:center; 

	min-height: 100%;
	height: auto !important;
	height: 100%;
	/* Negative indent footer by it's height */
	margin: 0 auto -60px;


	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	background-attachment: fixed; 
	
	
	
	}
	
#wrapper.s4 {background-image: url(i/bg-s4.jpg);}
#wrapper.s2 {background-image: url(i/bg-s2.jpg);}	
	

#wrapper-image-alt { 
  
	width: 100%;
    display: inline-block;
    position: relative;
	
	display:none;
	
	overflow:hidden;
}

#wrapper-image-alt:after {  
	padding-top: 56.25%; /*16:9 ratio*/
    display: block;
    content: '';
}

#image-alt {
    position: absolute;
    top: 0; 
	bottom: 0; 
	right: 0; 
	left: 0;

	background-repeat:no-repeat;
	

}

#image-alt.s2 {background:url(i/bg-s2.jpg);	background-position: 60% 50%; background-size:120%;}
#image-alt.s4 {background:url(i/bg-s4.jpg); background-position: 60% 50%; background-size:200%;}


#header { max-width:1000px; margin: 0 auto 0 auto;  }

	#logo-hwu {float:left; margin:7px 0 0 0; }

	#partner { float: right;}
		#partner span { display:block; font-size:7pt; color:#888;}


#menu { /*padding:0;*/ text-align:left; margin: 120px 0 65px 0; }

	#menu ul { margin:0; padding:0;  border-bottom:1px solid #ddd; }
	#menu li { margin:0 0 0px 0; padding:0; list-style:none; border-top:1px solid #ddd; background-color: rgba(255,255,255,0.9);  font-size: 9pt; font-weight:bold;}

	#menu li span.mot { color:#C00}
	#menu li span.hwu { color:#06F}
	#menu li span.lux { color:#000}

#main { max-width:1000px; margin: 0 auto 0 auto; text-align:left; }

#footer { max-width:1000px; margin: 0 auto 0 auto;  height: 60px; color:#ccc; font-size:8pt; padding:10px; clear:both; }


.home-content {  margin:30px 0 0 30px; min-height:}

	.home-content h1.title { background-color: rgba(0,0,0,0.7); color:#fff; display:inline-block; padding:1px 5px 2px 5px; margin:0 50px 3px 0; }
	.home-content h2.subtitle { text-transform: none; background-color: rgba(0,0,0,0.7); color:#fff; display:inline-block; padding:1px 5px 2px 5px; }

.page-content { text-align:left;  margin:50px 0 120px 0px; background-color: rgba(255,255,255,0.9); line-height:24px; }

.page-content h1 { margin:50px 0 20px 0; font-size:2.2em;}


.richiamo-wrapper { position:absolute; bottom:80px; right:0;}

.richiamo { position:relative; width:280px; margin: 0 0 0 0;}
	.richiamo a {   }
	.richiamo img { width:100%;  }
	.richiamo span { position:absolute; bottom:15px; right:15px; background-color:rgba(0,0,0,0.7); color:#fff; display:inline-block; padding:3px 5px;  font-family:"Open Sans","Helvetica Neue", Helvetica, Arial, sans-serif; }


@media only screen and (max-width: 768px) {
	
	#logo-hwu .logo { width:170px; margin:10px 0 0 5px; }
	
	#wrapper {background-image: none; 	
		min-height:100px;
		height:auto;
		margin: 0;
	}
	
	#wrapper.s2, #wrapper.s4 {background-image: none; 	}
	
	#wrapper-image-alt {display:block;}

	.page-content { font-size:1.3em;}	
	
	#footer { height:auto;}
	
}

@media only screen and (max-width: 991px) {
		
	
	#menu {margin: 0;}
	
	#wrapper {background-image: none; 	
		min-height:100px;
		height:auto;
		margin: 0;
	}
	
	#wrapper.s2, #wrapper.s4 {background-image: none; 	}
	
	#wrapper-image-alt {display:block;}
	
	.home-content { margin:20px 0 20px 0;}
	
	.richiamo-wrapper { position: static; text-align:right; }
	.richiamo {margin: 20px 15px 20px 0; max-width:90%;}
	

	
}


