body {
  background-color: #f5f5f5;
  color: #1a1a1a;
  font-size: 16pt;
  font-family: "Helvetica", "Arial", sans-serif;
  text-decoration: none;
}
a {
  color: #2a2a2a;
}
a:hover {
  color: #000;
}
.site-header {
  border-bottom-color: #d0d0d0;
}
.header-inner {
  margin: 20px;
}
nav.navbar a {
  color: #555;
}
nav.navbar a:hover,
nav.navbar a.active {
  color: #111;
  border-bottom-color: #111;
}

.gallery-grid {
  margin: 20px;
}
.gallery-item {
    margin-top: 40px;
}
.gallery-item img {
    display: block;
    width: 100%
}
.gallery-item .caption {
  font-size: 12pt;
  color: #666;
}

.lightbox-overlay {
  background: rgba(0, 0, 0, 0.85);
}
.page-content h2 {
  color: #1a1a1a;
}
.page-content h3 {
  color: #555;
}
.page-content p {
  color: #444;
}
.page-content .cv-entry {
  color: #444;
}
.page-content .cv-entry .year {
  color: #999;
}
.media-section {
  font-size: 12pt;
}
.media-section h2 {
  color: #1a1a1a;
}
.media-section h3 {
  color: #555;
}
.media-section p {
  color: #444;
}
.media-section a {
  color: #3a6080;
}
.media-section a:hover {
  color: #1a3a55;
}
.pet-text {
  color: #555;
}
.pet-text a {
  color: #3a6080;
}
.pet-text a:hover {
  color: #1a3a55;
}
.site-footer {
  border-top-color: #d0d0d0;
  color: #999;
}
.site-footer a {
  color: #999;
}
.site-footer a:hover {
  color: #333;
}
.site-logo img {
  filter: brightness(0.9607);
}

/* Container layout */
.navbar {
    gap: 20px;
    margin-top: 20px;
    margin-bottom: 40px;
    margin-left: -20px;
}

/* Turning links into bordered buttons */
.nav-btn {
  display: inline-block;        /* Allows padding and vertical margins */
  align-items: center;
  text-decoration: none;        /* Removes default underline */
  padding: 10px 20px;          /* Vertical and horizontal spacing */
  background-color: transparent;/* Transparent inside for outline style */
  font-weight: 600;
  transition: all 0.2s ease;    /* Smooth hover effect transition */
}

/* Hover state interaction */
.nav-btn:hover {
  background-color: #999999;    /* Fills background on hover */
  cursor: pointer;             /* Shows pointing hand icon */
}

/* Active/Current page state */
.nav-btn.active {
  color: #ffffff;
  background-color: #0056b3;    /* Slightly darker for active state */
  border-color: #0056b3;
}

.video-container {
    width: 100%;            /* Allows the video to expand dynamically to its parent width */
    margin: 0 auto;         /* Centers the video container if max-width is reached */
    aspect-ratio: 16 / 9;   /* Forces the 16:9 standard YouTube aspect ratio */
}

.video-container iframe {
    width: 100%;
    height: 100%;
    border: none;
}

.content {
    margin: 20px;
}