.series{
max-width: 20em;

}

.card {
  padding: 0.5em;
  border: 2px solid #463f32;
  cursor: pointer;
  background-color: white;
  height: 132px;
  transition: background-color 0.3s, box-shadow 0.3s ease, transform 0.3s ease;
  justify-content: center;
  margin-bottom: 0.2em;
  display: flex;
}

.card:hover{
    background-color: #C2B7AD;
    box-shadow: 0 0 15px rgba(194, 183, 173, 0.8);
    transform: scale(1.02);
    color: white;
}



.card ul{text-align: left;
font-size: 65%;
line-height: 10pt;}

iframe{
    width: 98%;
    height: 80px;
    margin: auto;
}

@keyframes pulse-animation {
  0% { transform: scale(1); }
  50% { transform: scale(1.1); }
  100% { transform: scale(1); }
}

.pulse {
  animation: pulse-animation 0.4s ease;
}

#reset-button{
  text-align: right;
}

.card-name{
  font-size: 70%;
  margin-top: 1.5em;
  margin-bottom: 0em;
}

@media screen and (min-width: 491px) {
  .card-name{
    font-size: 80%;
  }

  iframe{
    width: 95%;
  }

  .card ul{
font-size: 75%;
line-height: 12pt;
}
}