div.gallery img {
	width: 100%;
	height: auto;
}

div.gallery img:hover {
	filter: alpha(opacity = 40);
	-moz-opacity: .40;
	opacity: .40;
}

div.desc {
	padding: 15px;
	text-align: center;
}

.responsive {
	padding: 0 6px;
	float: left;
	width: 24.99999%;
}

@media only screen and (max-width: 700px) {
	.responsive {
		width: 49.99999%;
		margin: 6px 0;
	}
}

@media only screen and (max-width: 500px) {
	.responsive {
		/* width: 100%; */
		width: 50%;
	}
}

.gallery .tooltiptext {
	visibility: hidden;
	width: 120px;
	background-color: #555;
	color: #fff;
	text-align: center;
	border-radius: 6px;
	padding: 5px 0; //
	position: absolute;
	z-index: 1;
	bottom: 125%; //
	left: 5%;
	margin-left: -60px;
	opacity: 0;
	transition: opacity 1s;
}

.gallery .tooltiptext::after {
	content: "";
	position: absolute;
	top: 100%; //
	left: 50%;
	margin-left: -15px;
	border-width: 5px;
	border-style: solid;
	border-color: #555 transparent transparent transparent;
}

/* Show the tooltip text when you mouse over the tooltip container */
.gallery:hover .tooltiptext {
	position: absolute;
	visibility: visible;
	opacity: 0.8;
	bottom: -20px; //
	left: 50%;
	margin-left: 76px;
	z-index: 999;
}