/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jun 07 2025 | 19:13:58 */
/* Container: set the column count and spacing */
/* Ensure grid still responds properly inside the max-width wrapper */
.wp-block-group .my-masonry-grid {
  width: 100%; /* Ensures it remains responsive */
}

/* 3 columns on large screens */
.my-masonry-grid {
  column-count: 3;
  column-gap: 1em;  /* Reduced gap (was 2em before) */
}

.my-masonry-grid .wp-block-post {
  background-color: #f5f5f5; /* Change this to any color you want */
  list-style: none; /* Ensure no default <li> styling */
	  break-inside: avoid; /* Prevents posts from breaking between columns */
  page-break-inside: avoid; /* Ensures print layout respects it too */
}

.my-masonry-grid img {
  width: 100%;
  height: auto;
/*   display: block; */
/*   border-radius: 5px;  Optional: adds slightly softer edges */
}

/* Ensure pagination stays full width */
.my-masonry-grid .wp-block-query-pagination {
  display: flex;
  justify-content: center; /* Center pagination items */
  width: 100%;
  margin-top: 2em; /* Add spacing above pagination */
  column-span: all; /* Forces it out of masonry grid */
}

/* Ensure pagination numbers and buttons spread across */
.my-masonry-grid .wp-block-query-pagination > * {
  flex: 1;
  text-align: center;
}

/* 2 columns on tablets */
@media (max-width: 1024px) {
  .my-masonry-grid {
    column-count: 2;
  }
}

/* 1 column on mobile */
@media (max-width: 900px) {
  .my-masonry-grid {
    column-count: 1;
  }
}

/* remove page title underline that is added when I add a link to the page name  */
.wp-block-heading.header.is-style-default a {
    text-decoration: none !important;
}

/* Highlight the active page link in the nav bar */
.wp-block-navigation a[aria-current="page"],
.wp-block-navigation a[aria-current="true"],
.wp-block-navigation .current-menu-item > a,
.wp-block-navigation .current_page_item > a {
    text-decoration: underline;
    text-underline-offset: 4px;   /* pushes the line a little lower; optional */
}



