.hover {padding: 0px; width:301px; height:198px;}
.confi.hover {width:285px;}

.item {
	width:301px;
	height:198px;	
	border:0px;	
	margin:0px;
	
	/* required to hide the image after resized */
	overflow:hidden;
	
	/* for child absolute position */
	position:relative;
	
	/* display div in line */
	float:left;
}
.confi .item {
	width:285px;
}

.item .caption {
	width:291px;
	height:150px;
	background:url(images/screen-black.png) repeat;
	color:#fff;
	padding:48px 10px 0 5px;
	z-index:1;
	
		
	/* fix it at the bottom */
	position:absolute;
	left:0;

	/* hide it by default */
	display:none;
}
.confi .item .caption {
	width:280px;
	padding: 48px 10px 5px 5px;
}

.item .caption a {
	font-weight:bold;
	text-decoration:none;
	color:#fff;
	font-size:12px;
	/* add spacing and make the whole row clickable*/
	padding:5px;
	display:block;
	width:286px;
	height:130px;
}
.confi .item .caption a {
	width:280px;
}



.item img {
	border:0;
	margin:0px;
	width: 300px;
	height:198px;
	
	/* allow javascript moves the img position*/
	position:absolute;
}
.confi .item img {
	width: 285px;	
}


.clear {
	clear:both;	
}