a {
    text-decoration: underline;
    color: #9C8B7E;
}

a:hover {
    color: #555;
}

img {
    display: block;
    max-height: 300px;
    max-width: 600px;
    object-fit: contain;
}

table, td, th {
  border: 1px solid;
}

td, th {
  padding: 5px;
}

table {
  border-collapse: collapse; /* no double borders */
}

.post-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 300px; /* gap between the two spans */
  flex-wrap: wrap;
}

.post-nav span {
  display: flex;
  align-items: center;
  gap: 5px; /* gap between icon and link */
}

@media screen and (max-width: 768px) { /* mobile devices & tablets - screen width <= 768px */
  .post-nav {
    gap: 200px;
  }
}

@media screen and (max-width: 480px) { /* mobile phone devices only - no tablets */
  .post-nav {
    gap: 100px;
  }
}