div.item 
{
	width:22%;
	display:inline-block;
	margin:0px 1%;
}

div.item img
{
	width:100%;
}

div.item .item-thumb 
{
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	position: relative;
	z-index: 95;
	height:100%;
}

div.item .item-thumb .note 
{
	position: absolute;
	right: 10px;
	top: 10px;
	background-color: white;
	color: #444444;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 700;
	z-index: 96;
}

div.item .item-thumb .overlay 
{
	position: absolute;
	z-index: 97;
	background-color: rgba(10, 10, 10, 0.9);
	-webkit-transition: all 200ms linear;
	-moz-transition: all 200ms linear;
	-ms-transition: all 200ms linear;
	-o-transition: all 200ms linear;
	transition: all 200ms linear;
	opacity: 0;
	filter: alpha(opacity=0);
	height:96%;
	border: 3px solid #26b864;	
}

div.item .item-thumb .overlay .overlay-inner 
{
	text-align: center;
	padding-top:25%;
	width:90%;
	margin:0 auto;
}

div.item .item-thumb .overlay .overlay-inner a.view-detail 
{
	position: relative;
	display: block;
	background: url(../images/active-state.png) no-repeat;
	background-position: center bottom;
	padding-bottom: 30px;
	color: #26b864;
	font-weight: 600;
	font-size: 100%;
	line-height:1.2;
}

div.item .item-thumb:hover .overlay 
{
	opacity: 1;
	filter: alpha(opacity=100);
}

div.item h3 
{
	font-size: 90%;
	text-align:center;
	text-transform: uppercase;
	color:#222;
	padding:5px 0px;
}

div.item span 
{
	font-size: 95%;
	line-height:1.5;
	font-weight:normal;
}

/*******************************************************************/

@media (max-width: 1024px) 
{
	div.item .item-thumb .overlay .overlay-inner 
	{
		padding-top:18%;
	}
	
	div.item span 
	{
		font-size: 90%;
	}
	
	div.item .item-thumb .overlay 
	{
		height:94%;
	}
}

@media (max-width: 960px) 
{
	div.item .item-thumb .overlay .overlay-inner 
	{
		padding-top:15%;
	}
	
	div.item span 
	{
		font-size: 85%;
	}
	
	div.item .item-thumb .overlay 
	{
		height:94%;
	}
}

@media (max-width: 854px) 
{
	div.item .item-thumb .overlay .overlay-inner 
	{
		padding-top:7%;
	}
	
	div.item span 
	{
		font-size: 75%;
	}
	
	div.item .item-thumb .overlay 
	{
		height:93%;
	}
}

@media (max-width: 800px) 
{
	div.item 
	{
		width:45%;
		margin:1% 2%;		
	}
	
	div.item .item-thumb .overlay .overlay-inner 
	{
		padding-top:27%;
	}
	
	div.item span 
	{
		font-size: 105%;
		line-height:1.5;
	}
	
	div.item .item-thumb .overlay 
	{
		height:96%;
	}
}

@media (max-width: 640px) 
{
	div.item .item-thumb .overlay .overlay-inner 
	{
		padding-top:22%;
	}
	
	div.item span 
	{
		font-size: 96%;
		line-height:1.7;
	}
	
	div.item .item-thumb .overlay 
	{
		height:95%;
	}
}

@media (max-width: 480px) 
{
	div.item 
	{
		width:48%;
		margin:1% 2px;		
	}
	
	div.item .item-thumb .overlay .overlay-inner 
	{
		padding-top:5%;
	}
	
	div.item span 
	{
		font-size: 72%;
		line-height:1.4;
	}
	
	div.item .item-thumb .overlay 
	{
		height:95%;
	}
}

@media (max-width: 320px) 
{
	div.item 
	{
		width:90%;
		margin:3% 0%;		
	}
	
	div.item .item-thumb .overlay .overlay-inner 
	{
		padding-top:25%;
	}
	
	div.item span 
	{
		font-size: 100%;
		line-height:1.4;
	}
	
	div.item .item-thumb .overlay 
	{
		height:96%;
	}
}