.card-img img {
  height: 400px;
  object-fit: cover;
  transition: transform 0.3s ease-in-out;
}

.card-img {
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  height: 316px !important;
}

@media (min-width: 1240px) {

  .card-img::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(rgba(22, 35, 48, 0.35) 0%,
        rgba(22, 35, 48, 0.35) 100%);
    z-index: 1;
  }

  .sports-card-content:hover .image-bg {
    transform: scale(1.1);
  }

  .sports-card-content:hover .arrow-upwards {
    background: none;
    transition: all 0.2s ease;
    transform: rotate(-45deg);

  }

  .sports-card-content:hover .arrow-upwards {
    content: url('data:image/svg+xml,<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_611_6299)"><path d="M15.9997 28.0006C22.6271 28.0006 27.9997 22.628 27.9997 16.0006C27.9997 9.37316 22.6271 4.00058 15.9997 4.00058C9.37232 4.00058 3.99973 9.37316 3.99973 16.0006C3.99973 22.628 9.37232 28.0006 15.9997 28.0006Z" fill="%23162330" stroke="%23528138" stroke-linecap="round" stroke-linejoin="round"/><path d="M10.9997 16.0006H20.9997" stroke="white" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.9997 12.0006L20.9997 16.0006L16.9997 20.0006" stroke="white" stroke-linecap="round" stroke-linejoin="round"/></g><defs><clipPath id="clip0_611_6299"><rect width="32" height="32" fill="white"/></clipPath></defs></svg>') !important;

  }

  .sports-card-content:hover .card-img::before {
    opacity: 0;
  }

}

@media (min-width: 600px) {
  .sport-title {
    padding-bottom: 12px !important;
  }

  .card-img {
    height: 400px !important;
  }
}