.post-link {
  font-size: 1.6rem;
  font-weight: bold;
}

.meta {
  color: var(--text-light);
  font-size: 1rem;
}

.blog-item {
  margin-bottom: 4rem;
}

nav a.current {
  color: var(--accent) !important;
  border-color: var(--accent) !important;
}

.medium {
  font-size: 1.4rem;
}

.small {
  font-size: 1rem;
}

.icon {
  vertical-align: sub;
  padding-right: .25rem;
  display: inline-block;
  width: 1em;
  height: 1.3em;
  margin-right: 0.2rem;
  stroke-width: 0;
  stroke: currentColor;
  fill: currentColor;
}

.circle-img {
  width: 150px;       /* Set a specific width */
  height: 150px;      /* Set the same height for a perfect circle */
  border-radius: 50%; /* This creates the circular shape */
  object-fit: cover;  /* Ensures the image covers the container without stretching */
}

.screenshot-img {
  max-width: 100%; /* Ensures the image never exceeds the width of its parent container */
  height: auto;    /* Maintains the aspect ratio of the image */
  display: block;  /* Changes the image from inline to block-level element */
  margin: 0 auto;  /* Sets equal left/right margins to center the block horizontally */

}