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

* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

body { 
/*font-family: sans-serif;*/
position:relative;
width:100%;
height:100%;}

.bkg_black {
	background-color:#000 !important;
}

.bkg_orange {
	background-color: #fff/*#F90 #c62f2f*/ !important;
}

.bkg_blue {
	background-color:#0f9 !important;
}

.masonry {
	background: #fefefe;
	width: 80%;
	max-width: 1800px;
	position:relative;
	top:0px;
	left:288px;
}

.masonry .item {
	width:286px;
	/*min-width:288px;
	max-width:300px; eliminato per fare effetto hover*/
	height: 286px;
	float: left;
	background: #fff; /* background del singolo elemento 8da sistemare 10px bottom */
	z-index:0; /* per far stare dietro i link all'effetto grigio */
	position:relative;
}

.masonry .item.w1 { 
	width:286px;
	/*max-width:600px; eliminato per fare effetto hover*/
}
.masonry .item.w2 { 
	width:572px;
	/*max-width:600px; eliminato per fare effetto hover*/
}

.item.w3 { width:  286px; }
.item.w4 { width:  1024px; }

.masonry .item.h2 { height: 572px; }
.item.h3 { height: 572px; }
.item.h4 { height: 1024px; }



/* ===== max-width 1448px ===== */

@media only screen and (max-width:1448px)
{
.masonry {
	width: 74%;
}

}

/* ===== max-width 1175px ===== */

@media only screen and (max-width:1175px)
{
.masonry {
	width: 70%;
}

}

/* ===== min-width 860px ===== */

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

.masonry {
	left:288px;
}

.masonry .item {
	width: 286px; /*268px;*/
	height: 286px; /*268px;*/
}

.masonry .item.w1 { 
	width:286px; /*268px;*/
}
.masonry .item.w2 { 
	width: 572px; /*536px;*/
}

.masonry .item.h2 { 
	height: 572px; /*536px;*/
}

.item.w3 { 
	width: 286px; /*268px;*/
}
.item.h3 { 
	height: 572px; /*536px;*/
}

}



/* ===== max-width 859px ===== */

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

.masonry {
	width: 100%;
	position:relative;
	top:0px;
	left:0px;
}

.masonry .item {
	width:50%;
	height: 224px;
}

.masonry .item.w1 { 
	width:50%;
}
.masonry .item.h1 { 
	height: 288px;/*auto;*//*448px;*/
 }

.masonry .item.w2 { 
	width:100%;
}

.masonry .item.h2 { 
	height: 276px; /*572px;*//*auto;*//*448px;*/
	margin-top:40px; /*34px;*/
 }

.item.w3 { width: 50%; /*224px;*/ }
.item.h3 { height: 572px; }

/* specifico altezza per quadri piano di studi */
.masonry .item.h5 { 
	height: 288px;/*auto;*//*448px;*/
 }


}



/* ===== max-width: 572px ===== */

@media only screen and (max-width:572px)
{
.masonry {
/*	left:40px;*/
	left:0px;
}

.masonry .item {
	width:100%;
	height: auto; /*440px;*/
}

.masonry .item.w1 { 
	width: 100%; /*440px;*/
}

.masonry .item.h1 {
	height: 144px; /*440px;*/
}

.masonry .item.w2 { 
	width: 100% /*440px;*/
}

.masonry .item.h2 {
	margin-top:40px; /*34px;*/
	height: 288px; /*440px;*/
}

.item.w3 { 
	width: 100%; /*width:  440px;*/
}
.item.h3 { 
	height: 572px; /*auto;*/ /*height: 660px;*/ 
}

/* specifico altezza per quadri piano di studi */
.masonry .item.h5 {
	height: 288px; /*440px;*/
}


}