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


.masonry {
  background: #fff;
  max-width: 100%;
  margin-top: 100px;
  margin-left: 5px;
}

.masonry .item {
  width:  250px;
  height: 250px;
  float: left;
  background: transparent;
  border: 2px solid #333;
  border-color: #fff;
  border-radius: 0px;
  margin: 0px;
  overflow: hidden;
	

}
.item.listbox {
	overflow: visible;
}

.item.w2 { width:  500px; }
.item.h2 { height: 500px; }
.hidden { 
	opacity: 0; 
	transform: scale(0.001); 
}
.item .img {
	height: 100%;
	overflow: hidden;
	display: block;
	z-index: 2;
	/*background: url("../img/full010_small_grey.jpg") no-repeat scroll left top / auto 100% #FFFFFF;*/
}
.item .itemimage {
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 1;
	height: 100%;
	max-width: none;
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
	-webkit-filter: grayscale(100%);
	   -moz-filter: grayscale(100%);
	     -o-filter: grayscale(100%);
	    -ms-filter: grayscale(100%);
	        filter: grayscale(100%); 
	/*opacity: 0.4;
	filter: alpha(opacity=40);  msie */
}


.item .itemimage:hover{
	opacity: 1;
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
	-webkit-filter: grayscale(0%);
	   -moz-filter: grayscale(0%);
	     -o-filter: grayscale(0%);
	    -ms-filter: grayscale(0%);
	        filter: grayscale(0%); 
}
.hanno .itemimage:hover{
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
-webkit-filter: grayscale(100%);
   -moz-filter: grayscale(100%);
     -o-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
        filter: grayscale(100%); 
}
.item .img .textline {
	height: 64px;
	width: 100%;
	opacity: 0.85;
	background-color: #fff;
	bottom: 10px;
	display: block;
	position: absolute;
	padding: 9px 5px 5px 5px;
	overflow: hidden;
	z-index: 2;
}
.item .img .textline .h2,
.item .img .textline h2 {
	font-size: 15px;
	line-height: 16px;
	color: red;
	text-transform: uppercase;
	margin: 0px;
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
}
.listbox {
	background-color: #ADB5B7!important;
}
.listbox:hover{
	background-color: #FF2014!important;
}
.item .list { 
	height: 100%;
	overflow: hidden;
	display: block;
	background: url("../img/listenicon.gif") no-repeat scroll center center transparent;
}
.listbox .list .textline {
	height: 73px;
	width: 100%;
	bottom: 0px;
	display: block;
	position: absolute;
	padding: 0px 15px;
	line-height: 10px;
}
.listbox .list  .textline .h2 {
	font-size: 15px;
	line-height: 12px;
	color: #fff;
	text-transform: uppercase;
	margin: 0px;
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
}
.listbox .list  .textline p {
	font-size: 15px;
	color: #fff;
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
}
.biglistbox {
	display: none;
	width: 997px; /*746px*/
	height: 496px; /*246*/
	background-color: #ADB5B7;
	position: absolute;
	right: 0px;
	bottom: 0px;
	z-index: 1000;
}
.biglistbox .leer {
	display: none;
}
.biglistbox.open {
	display: block;

}

.biglistbox > .row02 {
	width: 220px;	
}

.biglistbox ul {
	float: left;
	margin:0px 10px 0px 15px;
	width: 220px;
}

.biglistbox p {
	margin-bottom: 0px;
}

.biglistbox li {
	float: left;
	margin:0px 0px 6px 0px;
	list-style: none;
	clear: both;
	line-height: 17px;
}
.biglistbox h2 {
	margin-bottom: 10px;
	color: #fff;
	font-size: 20px;
	margin-top: 5px;
	margin-left: 15px;
}
.biglistbox li a {
	color: #fff!important;
	font-size: 14px;
	text-decoration: underline;	
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
}
.biglistbox li a.inactive {
	text-decoration: none!important;
	cursor: default;
}
.biglistbox .close {
	position: absolute;
	top: 0px;
	right: 0px;
	text-indent: -3000px;
	width: 20px;
	height: 20px;
	background: url("../img/xicon.gif") no-repeat scroll center center transparent;
}
@media only screen and (max-width: 40em){ 
		.masonry .item {
			width: 100%;
			height: 0;
			padding-bottom: 100%;
		}
}
/* IPHONE */
@media only screen and (max-width: 321px){
		.masonry .item {
			width: 100%;
			height: 0;
			padding-bottom: 100%;
		}
		.biglistbox.open {
			display: block;
			width: 100%!important;
			height: 1250px;
		}
		
		.biglistbox > .row02 {
			width: 220px;	
		}
		
		.biglistbox ul {
			float: left;
			margin:0px 10px 0px 15px;
			width: 100%;
		}

}