.ab a {
	height: 300px;
}
.gallery_product img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	overflow: hidden;
}
.gallery-title {
	font-size: 36px;
	color: #42B32F;
	text-align: center;
	font-weight: 500;
	margin-bottom: 70px;
}
.gallery-title:after {
	content: "";
	position: absolute;
	width: 7.5%;
	left: 46.5%;
	height: 45px;
	border-bottom: 1px solid #5e5e5e;
}
.filter-button {
	font-size: 18px;
	border-radius: 5px;
	text-align: center;
	color: #fff;
}
.filter-button:hover {
	font-size: 18px;
	border-radius: 5px;
	text-align: center;
	color: #fff;
}
.filter-button.active {
	background:none;
	color: #fff;
	box-shadow: none;
}
.filter-button.btn-default:focus {
	color: #fff;
	outline: none;
}
.port-image {
	width: 100%;
}
.gallery_product {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	padding:0;
}
.block {
	opacity: 0;
}
 @-webkit-keyframes fadeIn {
 0% {
opacity: 0;
}
 100% {
opacity: 1;
}
}
@keyframes fadeIn {
 0% {
opacity: 0;
}
 100% {
opacity: 1;
}
}
.fadeIn {
	-webkit-animation-name: fadeIn;
	animation-name: fadeIn;
}
.p-0 {
	padding:0;
}
.fltr .btn {
	background: none;
	border: none;
}
.filter {
	padding-left: 1px;
	padding-right: 1px;
	padding-bottom: 2px;
}

.image-container {
  position: relative;

  overflow: hidden;
}

.image-container img {
  width: 100%;
  height: auto;
  display: block;
}

#overlay-img .overlay {
  position: absolute;
  padding-top: 43%;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); /* Adjust overlay color and opacity */
  color: white;
  text-align: center;
  opacity: 0;
  transition: opacity 0.3s ease;
  visibility:inherit
}

.image-container:hover .overlay {
  opacity: 1;
}

#overlay-img .overlay p {
  position: absolute;
  top: 25%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 16px; /* Adjust font size */
  font-weight: bold;
  padding: 10px;
  width: 100%;
  font-family: "Lato", sans-serif;
}
div#overlay-img:hover .overlay {
    opacity: 1;
}







 @media only screen and (min-width: 800px) {
#overlay-img .overlay p {
 
  top: 15%;
  font-size: 18px; /* Adjust font size */

}

#overlay-img .overlay {
  padding-top: 25%;
 
}
.filter-button {
	margin-bottom: 30px;
}
}
