.card {
  box-shadow: 0 0.25rem 0.5rem 0 rgba(0,0,0,0.2);
  transition: 0.3s;
  border-radius: 0.5rem;
  color: rgb(192, 192, 192);
  background-color: rgb(40, 40, 40);
  display: inline-block;
  margin: 1rem;
  width: calc(100% - 2rem);
}

.card:hover {
  box-shadow: 0 0.5rem 1rem 0 rgba(0,0,0,0.2);
}

.card > .container {
  padding: 0.5rem 1rem;
  width: 100%;
}

.card > img {
  width: 100%;
  border-radius: 0.5rem 0.5rem 0 0;
  object-fit: contain;
}

.card > .container > .header {
  font-weight: bolder;
  height: 2rem;
  min-height: 2rem;
  overflow: hidden;
  text-overflow: ellipsis;
}

.card > .container > .details {
  height: 5rem;
  min-height: 5rem;
  overflow-wrap: break-word;
}

.card > .container > .header, .details {
  margin: 1rem;
  width: calc(100% - 2rem)
}
