.portfolioFilter {
  padding: 15px 0;
}

.portfolioFilter a {
  margin-right: 6px;
  color: #666;
  text-decoration: none;
  border: 1px solid #ccc;
  padding: 4px 15px;
  border-radius: 50px;
  display: inline-block;
}

.portfolioFilter a.current {
  background: #1e1e1e;
  border: 1px solid #1e1e1e;
  color: #f9f9f9;
}
.portfolioContainer{
  border: 1px solid #eee;
  border-radius: 3px;
}
 

.isotope-item {
  z-index: 2;
}

.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}

.isotope,
.isotope .isotope-item {
  /* change duration value to whatever you like */
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
  -moz-transition-property: height, width;
  transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
  -moz-transition-property: -moz-transform, opacity;
  transition-property: transform, opacity;
}


.portfolioFilter {
  padding: 15px 0;
}
.portfolioFilter a.current {
  background: #1e1e1e;
  border: 1px solid #1e1e1e;
  color: #f9f9f9;
}  
.fables-second-hover-text-color:hover .fables-forth-text-color{
  border-color: #E54D42
}
.portfolioContainer{
  border: 1px solid #eee;
  border-radius: 3px;
}
.filter-masonry{
  -moz-column-width: 13em;
  -webkit-column-width: 13em;
  column-width: 13em;
  -moz-column-gap: 1em;
  -webkit-column-gap: 1em; 
  column-gap: 1em; 
}  
.portfolioContainer{
  border: 1px solid #eee;
  border-radius: 3px;
}

.filter-masonry{
  -moz-column-width: 13em;
  -webkit-column-width: 13em;
  column-width: 13em;
  -moz-column-gap: 1em;
  -webkit-column-gap: 1em; 
  column-gap: 1em; 
}  
.filter-masonry .filter-img-block {
  margin-bottom: 15px; 
}
/* .image-container{ 
  overflow: hidden;
  position: relative; 
} */
.fables-main-color-transparent {
  background-color: rgba(44,62,79,.9);
}

.image-containers {
  width: 100%; /* لتناسب العرض الكامل للحاوية */
  text-align: center; /* لمركز الصورة أفقيًا */
}

.image-containers img {
  width: 100%; /* لتناسب العرض الكامل للحاوية */
  max-width: 500px; /* الحد الأقصى للعرض على الشاشات الكبيرة */
  height: auto; /* للحفاظ على نسبة العرض إلى الارتفاع */
  border-radius: 10px; /* لتدوير الزوايا */
}

/* استعلامات الوسائط لتحديد أبعاد الصورة على أجهزة مختلفة */
@media (max-width: 767px) { /* الهواتف */
  .image-containers img {
    max-width: 400px;
    height: 400px;
  }
}

@media (min-width: 768px) and (max-width: 1023px) { /* الأيباد */
  .image-containers img {
    max-width: 400px;
    height: 400px;
  }
}