.simple-cards-component .cards-grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 768px) {
  .simple-cards-component .cards-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .simple-cards-component .cards-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 3rem;
  }
}
@media screen and (min-width: 1280px) {
  .simple-cards-component .cards-grid {
    gap: 4rem;
  }
}
.simple-cards-component .card-item {
  position: relative;
  overflow: hidden;
}
.simple-cards-component .card-item img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.simple-cards-component .card-item:nth-child(odd) {
  border-radius: 46px 0;
}
.simple-cards-component .card-item:nth-child(odd) img {
  border-radius: 46px 0;
}
.simple-cards-component .card-item:nth-child(even) {
  border-radius: 0 46px;
}
.simple-cards-component .card-item:nth-child(even) img {
  border-radius: 0 46px;
}
.simple-cards-component .card-item .card-content {
  text-align: center;
  padding: 1rem;
  color: var(--text-primary-color);
}
@media (min-width: 320px) and (max-width: 767px) {
  .simple-cards-component .card-item .card-content {
    padding: 0px;
  }
}
@media (min-width: 768px) {
  .simple-cards-component .card-item .card-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    color: #364d52;
  }
}
.simple-cards-component .card-item .card-overlay,
.simple-cards-component .card-item .card-overlay2 {
  position: absolute;
}
.simple-cards-component .card-item .card-overlay {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(61.3%, rgba(51, 51, 51, 0)), color-stop(99.94%, rgba(51, 51, 51, 0.45)));
  background: linear-gradient(180deg, rgba(51, 51, 51, 0) 61.3%, rgba(51, 51, 51, 0.45) 99.94%);
}
.simple-cards-component .card-item .card-overlay2 {
  bottom: 0;
  height: 33%;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(214, 237, 246, 0.1)), to(#d6edf6));
  background: linear-gradient(180deg, rgba(214, 237, 246, 0.1) 0%, #d6edf6 100%);
}

@media screen and (max-width: 767px) {
  #homepage .simple-cards-component {
    padding-top: 30px;
    padding-bottom: 30px;
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), color-stop(89%, rgba(214, 241, 249, 0.3))), #fff;
    background: linear-gradient(180deg, #fff 0%, rgba(214, 241, 249, 0.3) 89%), #fff;
  }
}
