body {
  font-family: "Poppins", monospace;
  margin: 0;
}

h1, h3 {
  text-align: center;
}

.topic {
  width: 100%;
  background-color: #edededed;
  border: 1px solid #dddddddd;
}

.card {
  box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
  transition: 0.2s;
  margin: 20px;
  border: 1px solid #ababab;
  border-radius: 9px;
  overflow: hidden;
  background-color: #f9f9f9;
}

.card > img {
  width: 100%;
  display: block;
  transition: 0.2s ease-in-out;
}

.card-link-small{
  width: 20%;
  max-width: 220px;
  text-decoration: none;
  color: black;
  min-width: 160px;
}

.cards h4 {
  font-size: 2em;
  margin: 10px;
}

.cards h5 {
  font-size: 1.5em;
  margin: 10px;
  font-family: "Patrick Hand", cursive;
}

.card:hover {
  box-shadow: 2px 2px 4px 0 rgba(0,0,0,0.2);
  background-color: #fefefe;
}

.card:hover > img {
  filter: brightness(1.08);
}

.container {
  text-align: center;
}

.cards {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}