/* css styles */
<style>

/* The 'Position' filter box on People page */
.quarto-listing-category-title {
  display: none; 
}
.quarto-listing-category-title {
  display: none; 
}
.quarto-listing-categories {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start; 
  margin-top: -50px; 
  margin-bottom: 25px;
  float: right; 
}
.quarto-listing-category .category:hover {
  font-weight: bold;
  color: #2c3e50;
}
.quarto-listing-category {
  font-size: 0.75rem !important; 
  border: 1px solid #dee2e6 !important;
  padding: 4px 10px !important;
  border-radius: 4px !important;
  background-color: #f8f9fa;
  color: #333 !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* Grid formatting */
.listing-title {
  font-size: 1.0rem !important;
  font-weight: 600;
}
.listing-position, .listing-interests {
  font-size: 0.8rem !important;
  line-height: 1.3;
}
.field-name {
  font-size: 0.75rem !important;
  color: #666;
}
.quarto-grid-item.card .card-text, 
.quarto-grid-item.card .listing-description,
.quarto-grid-item.card .listing-subtitle,
.quarto-grid-item.card .card-subtitle {
  color: #000000; 
}
.quarto-grid-item.card:hover {
  outline: 3px solid #2c3e50 !important; 
  outline-offset: -3px; 
  transition: outline 0.2s ease-in-out;
  cursor: pointer;
}

/* Page number buttons on People and Research */
.btn-secondary, 
.page-item.active .page-link,
.page-item.active span {
  background-color: #000000 !important; 
  border-color: #000000 !important;
  color: #ffffff !important;
}
.btn-secondary:hover, 
.page-link:hover {
  background-color: #78c2ad !important; 
  border-color: #78c2ad !important;
  color: #ffffff !important;
}
.page-link {
  color: #000000 !important;
  background-color: #ffffff !important;
  border-color: #dee2e6 !important;
}

/* Photo gallery formatting */
.quarto-layout-cell img {
  width: 100%;
  border-radius: 5px;  
}

/* General formatting */
a {
  color: #004225; 
}
body {
  color: #000000;
}
h1, h2, h3, h4, h5, h6, .title {
  color: #000000 !important;
  font-weight: bold; 
}

/* Navbar */
.navbar-brand img {
  height: 35px !important; 
  width: auto;
  max-height: none !important;
  margin-top: -5px; 
  margin-bottom: -5px;
}
.navbar {
  padding-top: 0.8rem;
  padding-bottom: 0.8rem;
}
.navbar-nav .nav-link {
  font-weight: 700 !important; 
  font-size: 1.1rem;          
}
a:hover {
  color: #000000 !important; 
  text-decoration: none !important; 
  font-weight: normal !important;        
}
.nav-footer a {
  text-decoration: none;
}

</style>