@charset "utf-8";
/* 代码整理：懒人之家 lanrenzhijia.com */
.thumbnailWrapper {
	width:300px;
	margin:0px auto;
	margin-top:-65px;
	float:left;
} /* 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) */
	margin-top:10px;
}
.thumbnailWrapper ul li a img {
	width:290px; /* 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 */
	
	/* styling bellow */
			background:#48a848;
	color:white;
	opacity:0.9;
}
.caption .captionInside {
	/* just styling */
			padding:10px;
	margin:0px;
}



.thumbnailWrapper2 {
	width:300px;
	margin:0px auto;
		margin-top:-65px;

} /* not important */
.thumbnailWrapper2 ul {
	list-style-type: none; /* remove the default style for list items (the circles) */
	margin:0px; /* remove default margin */
	padding:0px; /* remove default padding */
}
.thumbnailWrapper2 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) */
	margin-top:10px;
}
.thumbnailWrapper2 ul li a img {
	width:300px; /* not important, the pics we use here are too big */
	
	height:482px;
	position:relative; /* so we can use top and left positioning */
	border:none; /* remove the default blue border */
}
.caption2 {
	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 */
	
	/* styling bellow */
			background:#48a848;
	color:white;
	opacity:0.9;
}
.caption2 .captionInside2 {
	/* just styling */
			padding:10px;
	margin:0px;
}




.thumbnailWrapper3 {
	width:300px;
	margin:0px auto;
		margin-top:-65px;

} /* not important */
.thumbnailWrapper3 ul {
	list-style-type: none; /* remove the default style for list items (the circles) */
	margin:0px; /* remove default margin */
	padding:0px; /* remove default padding */
}
.thumbnailWrapper3 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) */
	margin-top:10px;
}
.thumbnailWrapper3 ul li a img {
	width:300px; /* not important, the pics we use here are too big */
	
    height:235px;
	position:relative; /* so we can use top and left positioning */
	border:none; /* remove the default blue border */
}
.caption3 {
	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 */

	/* styling bellow */
			background:#48a848;
	color:white;
	opacity:0.9;
}
.caption3 .captionInside3 {
	/* just styling */
			padding:10px;
	margin:0px;
}


.thumbnailWrapper4 {
	width:580px;
	margin:0px auto;
	float:left;
		margin-top:-65px;
	margin-left:10px;

} /* not important */
.thumbnailWrapper4 ul {
	list-style-type: none; /* remove the default style for list items (the circles) */
	margin:0px; /* remove default margin */
	padding:0px; /* remove default padding */
}
.thumbnailWrapper4 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) */
	margin-top:10px;
}
.thumbnailWrapper4 ul li a img {
	width:580px; /* not important, the pics we use here are too big */
	height:359px;

	position:relative; /* so we can use top and left positioning */
	border:none; /* remove the default blue border */
}
.caption4 {
	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 */

	/* styling bellow */
			background:#48a848;
	color:white;
	opacity:0.9;
}
.caption4 .captionInside4 {
	/* just styling */
			padding:10px;
	margin:0px;
}


.clear {
	clear:both;
} /* to clear the float after the last item */
a {
	color:#FFCC00;
}
/* 代码整理：懒人之家 lanrenzhijia.com */

