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

/*fascia footer*/
* { 
 -moz-box-sizing: border-box; 
 -webkit-box-sizing: border-box; 
 box-sizing: border-box;
}

a, a:hover, a:active {
 color: #fff;
 text-decoration: none;
}

a.block {
 display: block;
}

#fasciafooter {
	float: left;	
}

#container img {border: 0;}

#container {
	width: 910px;
	height: 198px;
	overflow: hidden;
	box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.35);
	-webkit-box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.35);
	-moz-box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.35);
	float: left;
}

#container ul {
	width: 2000px;
	margin: 0;
	padding: 0;
}

#container li {
 position: relative;
 list-style: none;
 margin: 0;
 padding: 0;
	display: block;
	float: left;
	width: 182px;
	height: 198px;
	border-left: 1px solid #888;
	box-shadow: 0 0 25px 10px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0 0 25px 10px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0 0 25px 10px rgba(0, 0, 0, 0.5);
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
}

.titolo {
	position: absolute;
	left: 0;
	top: 0;
	width: 300px;
	height: 48px;
	-webkit-transform: translateX(-100%) rotate(-90deg);
	-webkit-transform-origin: right top;
	-moz-transform: translateX(-100%) rotate(-90deg);
	-moz-transform-origin: right top;
	-ms-transform: translateX(-100%) rotate(-90deg);
	-ms-transform-origin: right top;
	-o-transform: translateX(-100%) rotate(-90deg);
	-o-transform-origin: right top;
	transform: translateX(-100%) rotate(-90deg);
	transform-origin: right top;
	background-color: rgba(0,0,0,0.8);
}

.lt-ie9 .titolo {
 position: absolute;
	left: -126px; 
	top: 327px;
	width: 300px;
	height: 48px;
 background: #000;
 transform: rotate(-90deg); 
}


.titolo h1 {
	width: 300px;
	height: 48px;
	margin: 0;
	font-size: 20px;
	color: #fff;
	padding-top: 15px;
	padding-right: 15px;
	padding-bottom: 10px;
	padding-left: 115px;
}

.immagine img {
 display: block;
}

#container ul:hover li {width: 48px;}

#container ul li:hover {width: 718px;}



/*qui sotto il sito si adatta in base alla misura dello schermo*/
@media only screen and (min-width: 320px) and (max-width: 480px) {
	

	
}

@media only screen and (min-width: 481px) and (max-width: 768px) {
	
	
}

@media only screen and (min-width: 769px) and (max-width: 1024px) {
	
	
}

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

	
}
