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


.thumbnailWrapper {
	width:940px;
	margin:0px auto;
	height: 344px;
} /* not important */
		
		.thumbnailWrapper ul { 
			list-style-type: none; /* remove the default style for list items (the circles) */ 
			margin:0px; /* remove default margin */
			padding:0px; /* remove default padding */
		}
		.thumbnailWrapper ul li { 
			float:left; /* important: left float */
			position:relative; /* so we can use top and left positioning */
			overflow:hidden; /* hide the content outside the boundaries (ZOOM) */
		}
		.thumbnailWrapper ul li a img { 
			width:188px; /* not important, the pics we use here are too big */
			position:relative; /* so we can use top and left positioning */
			border:none; /* remove the default blue border */
		}
		.caption{
	position:absolute; /* needed for positioning */
	bottom:0px; /* bottom of the list item (container) */
	left:0px; /* start from left of the list item (container) */
	width:100%; /* stretch to the whole width of container */
	display:none; /* hide by default */
	/* styling bellow */
			background:#000000;
	color:white;
	opacity:0.7;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
		}
		.caption .captionInside{
			/* just styling */
			padding:10px;
			margin:0px;
		}
		.clear { clear:both; } /* to clear the float after the last item */