.card {
  border: 1px solid #0002;
  padding: 3px;
}

.card .inner {
  overflow: hidden;
  border-radius: 0.25em;
  height: 184px;
}

.card .inner .overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: black;
}

.card .inner:hover .overlay {
  opacity: 0.5;
}

.card .inner img {
  transition: all 1.0s ease;
}

.card .inner:hover img {
  transform: scale(1.3);
}

.card-link.btn:hover {
  background: var(--danger);
  color: var(--light)!important;
}

.card-link.btn, .card-link.btn:hover {
  transition: .3s ease;
}

.card .inner:hover {
  background: linear-gradient(#FFF6, #FFF6);
}