.gallery__card {
  position: relative;
  display: block;
  width: 100%;
}
.gallery__card img {
  height: 360px;
  width: 100%;
}
.gallery__card::after {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0%;
  left: 0%;
  background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBjbGFzcz0iZmVhdGhlciBmZWF0aGVyLWV4dGVybmFsLWxpbmsiPjxwYXRoIGQ9Ik0xOCAxM3Y2YTIgMiAwIDAgMS0yIDJINWEyIDIgMCAwIDEtMi0yVjhhMiAyIDAgMCAxIDItMmg2Ij48L3BhdGg+PHBvbHlsaW5lIHBvaW50cz0iMTUgMyAyMSAzIDIxIDkiPjwvcG9seWxpbmU+PGxpbmUgeDE9IjEwIiB5MT0iMTQiIHgyPSIyMSIgeTI9IjMiPjwvbGluZT48L3N2Zz4=") no-repeat center center/2rem;
  background-color: rgba(0, 0, 0, 0.7607843137);
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s linear;
}
.gallery__card:hover::after {
  opacity: 1;
  visibility: visible;
}

@media (max-width: 1399px) {
  .gallery__card img {
    height: 280px;
  }
}
@media (max-width: 991px) {
  .gallery__card img {
    height: 220px;
  }
}
@media (max-width: 575px) {
  .gallery__card img {
    height: 130px;
  }
}/*# sourceMappingURL=gallery.css.map */