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


#loadingimg {
	/*display:none;*/
}
#loadingimg .i1 {
	background:url(gfx/perche2-compressor.png) no-repeat -9999px -9999px;
}
#loadingimg .i2 {
	background:url(gfx/come2-compressor.png) no-repeat -9999px -9999px;
}
#loadingimg .i3 {
	background:url(gfx/cosa2-compressor.png) no-repeat -9999px -9999px;
}

.grid {
	width: 100%;
	max-width: 900px;
	margin: 0 auto;
	background: #fff;
	padding-bottom:50px;
}
.grid::after {
	content: "";
	display: block;
	clear: both;
}
.grid-item {
	width: 21.833%;
	padding-bottom: 21.833%;
	overflow: hidden;
	float: left;
    -webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	margin: 5.5%;
	margin-top: -11%;
	margin-left: 10%;
	opacity:0;
    -webkit-transition: opacity 1s;
    transition: opacity 1s;
	position: relative;
}
.grid-item:nth-child(5n+6) {
    clear:left;
}
.grid-item:nth-child(5n+6):last-of-type {
	margin-left: 38.25%;
}
.grid-item:hover, .grid-item.hover {
	background: #FFF;
}
.grid-item:nth-child(1) {
	width: 45%;
	padding-bottom: 45%;
	margin-top: 9.5%;
}
.grid-item:nth-child(2) {
	margin-left: -6.5%;
	margin-top: 5%;
}
.grid-item:nth-child(3) {
	width: 45%;
	padding-bottom: 45%;
	margin-top: -17.98%;
    margin-left: 42.6%;
}
.grid-item:nth-child(4) {
	width: 45%;
	padding-bottom: 45%;
    margin-top: -18%;
    margin-left: 10.2%;
}
.grid-item:nth-child(5) {
	width: 45%;
	padding-bottom: 45%;
	margin-top: -17.98%;
    margin-left: 42.6%;
}
.grid-item:nth-child(6) {
    /*margin-top: -6.2%;*/
	width: 45%;
	padding-bottom: 45%;
	margin-top: -18% !important;
	margin-left: 10% !important;
}

.grid-inner {
	box-sizing: border-box;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: rotate(-45deg) scale(2.1);
	transform: rotate(-45deg) scale(2.1);
    text-align: center;
	background-repeat:no-repeat;
	background-position: center center;
    background-size: 70%;
    color: #fff;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 14px;
    line-height: 1em;
    text-align: center;
	cursor:default;
}
.grid-inner strong {
	font-size:24px;
    line-height: 1em;
	display:block;
	z-index: 999;
}
.grid-inner span, .grid-inner ol, .grid-inner ol li {
	visibility:hidden;
	text-transform: none;
	font-weight:400;
}
.grid-item:nth-child(6) span {
	visibility:visible;
}
.grid-item:nth-child(1) .grid-inner {
    padding: 47.5% 35% 0 35%;
	background-image:url(gfx/hpperche-compressor.jpg);
}
.grid-item:nth-child(1):hover .grid-inner {
    text-align: left;
	padding-top: 45%;
	background-image:url(gfx/perche2-compressor.png);
}
.grid-item:nth-child(1):hover .grid-inner * {
    visibility:hidden;
}
.grid-item:nth-child(2) .grid-inner {
    /*text-align: left;*/
    padding: 40% 30% 0 30%;
	background-color: #B49D8A;
	background-image:url(gfx/gesto-compressor.png);
}
.grid-item:nth-child(3) .grid-inner {
    padding: 47% 35% 0 35%;
	background-image:url(gfx/hpcosa-compressor.jpg);
}
.grid-item:nth-child(3):hover .grid-inner {
    text-align: left;
    padding-top: 45%;
	background-image:url(gfx/cosa2-compressor.png);
}
.grid-item:nth-child(3):hover .grid-inner * {
    visibility:hidden;
}
.grid-item:nth-child(4) .grid-inner {
    padding: 47% 35% 0 35%;
	background-image:url(gfx/hpcome-compressor.jpg);
}
.grid-item:nth-child(4):hover span {
	display:none;
}
.grid-item:nth-child(4):hover .grid-inner {
    text-align: left;
    padding-top: 42%;
	background-image:url(gfx/come2-compressor.png);
}
.grid-item:nth-child(4):hover .grid-inner * {
    visibility:hidden;
}
.grid-item:nth-child(4):hover .grid-inner ol, .grid-item:nth-child(4):hover .grid-inner ol li {
	padding:0;
	margin: 0 0 0 7.5px;
	text-align:left;
    position:relative;
}
.grid-item:nth-child(4):hover .grid-inner em {
    position:absolute;
	left: -20px;
	background:#fff;
	text-align:center;
    text-decoration: none;
    -webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	width: 12px;
    height: 12px;
}
.grid-item:nth-child(4):hover .grid-inner em u {
	display: block;
	color:rgba(207,91,69,1);
	font-style:normal;
    font-size:10px;
	margin: -1px 0 0 -1px;
	text-decoration: none;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.grid-item:nth-child(5) .grid-inner {
   	cursor:pointer;
    padding: 41% 35% 0 35%;
	background-image:url(gfx/hpvideo-30-ottobre.jpg);
}
.grid-item:nth-child(5) .grid-inner img {
    width:50%;
}
.grid-item:nth-child(5):hover .grid-inner {
	/*background-image:url(gfx/hparancio-compressor.jpg);*/
}
.grid-item:nth-child(6) .grid-inner {
    /*text-align: left;*/
	cursor:pointer;
	font-size:13px;
	padding: 40% 20% 0 20%;
    background-image:url(gfx/partecipa4-compressor.png);
}
.grid-item:nth-child(6) .grid-inner a {
	text-decoration:none;
	color:rgba(255,255,255,0);
}

.grid-item:hover .grid-inner, .grid-item.hover .grid-inner {
	/* */
}
.grid-item:hover .grid-inner strong, .grid-item.hover .grid-inner strong {
	font-size:14px;
	/*margin-bottom:5px;*/
}
.grid-item:hover .grid-inner span, .grid-item.hover .grid-inner span,
.grid-item:hover .grid-inner ol, .grid-item:hover .grid-inner ol li {
	visibility:visible;
}
.grid-item.opa {
	opacity:1;
}
#hpvideo {
	display:none;
	position:absolute;
	top :0;
	left:0;
	width:100%;
	height:120%;
    background: rgba(0,0,0,0.8);
    z-index: 999;
}
#hpvideo iframe {
	width:100%;
	height:70%;
	margin:auto;
	display:block;
	margin-top:5%;
}
#hpvideo .fa {
	display: block;
    top: 0;
    right: 0;
    background: rgba(207,91,69,1);
    color: #fff;
    padding: 10px 12px;
    position: absolute;
}
#hpvideo .fa:hover {
    background: rgba(207,91,69,0.5);
}

.altre {
	text-align:center;
	width: 100%;
    padding: 50px 0;
}
.altre a {
	text-decoration:none;
	font-size:30px;
	font-weight:700;
	color:rgba(207,91,69,1);
	text-align:center;
	display:inline-block;
}
.altre img {
	display: block;
    margin: 20px auto;
}
.altre a:hover span {
	border-bottom: 2px solid rgba(207,91,69,1);
}
.altre img.loader {
	opacity:0;
}

