@charset "UTF-8";

.card__content {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: 1fr;
  grid-column-gap: 20px;
  grid-row-gap: 0px;
}

.card {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 4;
  border: 1px solid #000;
  margin-bottom: 20px;
}

.card__header {
  order: 2;
  padding: 5px 10px;

  .card__title {
    font-size: 18px;
    font-weight: bold;
  }
}

.card__body {
  order: 3;
  padding: 5px 10px;

  .card__text {
    font-size: 16px;
  }
}

.card__footer {
  order: 4;
  padding: 5px 10px;

  .card__btn {
    text-align: center;

    a {
      display: block;
      padding: 10px;
      background-color: #eeeeee;
      border: 1px solid #aaaaaa;
    }
  }
}

.card__thumbnail {
  order: 1;
}



.img_objectfit {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 4 / 3;
}

.img_objectnone {
  width: 100%;
  height: auto;
}




.card__content.-fit {

  /* width: 100%; */
  .card__thumbnail {
    overflow: hidden;

    .card__thumbnail--img {
      position: relative;
      overflow: hidden;
      width: 100%;
      /* height: 0;
          padding-top: 75%; */
      height: 180px;

      .img_objectauto {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        max-width: 100%;
        width: auto;
        max-height: 100%;
      }
    }
  }
}