#container {
  max-width: 1280px;
  background-color: white;
  /* For browsers that do not support gradients */
  background-image: linear-gradient(blue, #c3fcd1, white);
  border: 10px #22e732 solid;
  border-radius: 20px;
  margin: 20px auto;
  padding: 20px;
  font-family: Arial, Helvetica, sans-serif;
  resize: horizontal;
  overflow: auto;
}

.flex-container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-around;
  padding: 5px;
  background-color: white;
}

.button {
  color: black;
  background-color: #60a7d6;
  border: 2px solid black;
  border-radius: 8px;
  box-shadow: 10px 10px 5px rgba(0, 0, 0, 0.2);
  font-size: 16px;
  padding: 10px 20px;
  margin-left: 17%;
}

.button:hover {
  background-color: #3681b3;
}

.button a:link {
  color: white;
  text-decoration: none;
}

.button a:visited {
  color: white;
  text-decoration: none;
}

.columns {
  margin: 10px auto;
  background-color: white;
  /* For browsers that do not support gradients */
  background-image: linear-gradient(lightblue, lightgreen);
  padding: 10px;
  column-count: 3;
  column-gap: 20px;
  column-rule: 1px solid blue;
  column-width: 200px;
  column-fill: auto;
}

.columns h2 {
  column-span: all;
}

.pagination {
  display: inline-block;
}

.pagination a {
  color: black;
  float: left;
  padding: 8px 16px;
  text-decoration: none;
  transition: background-color .3s;
  border: 1px solid #ddd;
  margin: 0 4px;
}

.pagination a.active {
  background-color: #60a7d6;
  color: white;
  border: 1px solid #60a7d6;
}

.pagination a:hover:not(.active) {
  background-color: #ddd;
}

img {
  border-radius: 5px;
}
