/* CUSTOM FOR THIS WEBSITE */
/** BLOG */
.blogLeft {width:100%;}
.blogRight {clear:both; width:100%;}

    .blog-grid {
        display: flex;
        flex-wrap: wrap;
        gap: 20px;
        justify-content: flex-start;
    }
    .blog-grid-item {
        width: 350px;
        background: #fff;
        border-radius: 8px;
        overflow: hidden;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        transition: transform 0.2s ease-in-out;
    }
    .blog-grid-item:hover {
        transform: translateY(-5px);
    }
    .blog-grid-image {
        width: 100%;
        height: 250px;
        object-fit: cover;
    }
    .blog-grid-title {
        padding: 15px;
        margin: 0;
        line-height: .7em;
    }
    .blog-grid-title a {
        color: inherit;
        text-decoration: none;
        font-size: 1.2rem;
    }
    .back-link {
      display: inline-block;
      margin-right: 12px;
      font-size: 0.9rem;
      color: #666;        /* subtle gray to blend with title */
      text-decoration: none;
      vertical-align: middle;
    }

    .back-link:hover {
      color: #000;        /* darker on hover */
      text-decoration: underline;
    }

    .blog-grid-title a:hover {color: #FF9900; text-decoration:underline;}
    .blog-grid-title img {border-radius:5px; margin-bottom:10px;}

/* For the actual entry/post */
.pmBlogEntry { clear: both; margin: 10px 0 35px 0; background-color: #F9F9F9; border-radius: 10px; padding: 25px; border: 1px solid #EDEDED; }

.pmBlogEntry h2.title {font-family: 'Playfair Display', serif; font-weight: bold; color: #666; float:left; margin-top:22px; margin-bottom:22px; padding-top:0; font-size:2.0em;}
.pmBlogEntry h2.title a:link, .pmBlogEntry h1.title a:visited {text-decoration:none; color: black; }
.pmBlogEntry h2.title a:hover { color: #FF9900; }
.pmBlogEntry h2 {font-size: 1.5em; margin-top:1em; margin-bottom:.5em;}

.pmBlogEntry .dateAuthor { font-size: .80em; float: right; width: 200px; text-align: right; color: #999999; }
.pmBlogEntry .contentWrapper {clear:both; margin-top:1.5em; overflow:hidden; padding-bottom:30px;}
.pmBlogEntry .contentWrapper img {border-radius: 10px; margin-bottom:15px;}
.pmBlogEntry .contentWrapper ul {
  list-style-type: disc !important;
  padding-left: 1.5em !important;
  margin-bottom: 1em !important;
}
.pmBlogEntry .contentWrapper li {
  margin-bottom: 0.5em !important;
}
.pmBlogEntry .contentWrapper a:any-link {color:#FF9900;}

.pmBlogEntry a:link, .pmBlogEntry .dateAuthor:visited {color: #FF9900; text-decoration:none;}
.pmBlogEntry p a:link, .pmBlogEntry p a:visited {color: peru; text-decoration:none;}
.pmBlogEntry p a:hover {color: darkorange; text-decoration:underline;}
.pmBlogEntry a:hover {color:black; text-decoration:underline;}
.pmBlogEntry a.moreLink {font-weight: 500; color: #FF9900; display:inline-block; margin-top:.5em;}
.pmBlogEntry a.moreLink:hover {color:black;}
.pmBlogEntry p {padding: .1em 0 .1em 0;}

/* For the listings of entries */
.pmBlogEntriesWrapper {}  /* surrounds whole list of entries */

/* Page Navigation Links */
.pmBlogPageNavigationWrapper {text-align:right; padding:5px; margin:5px 20px 5px 5px; font-size:.8em;}

/* Archive Navigation */
.blogArchiveNavWrapper {font-size:.85em; font-family:Verdana, Geneva, sans-serif;}
.blogArchiveNavWrapper a:link, .blogArchiveNavWrapper a:visited {color:#666;}
.blogArchiveNavWrapper a:hover {color:#09C; text-decoration:underline;}
.blogArchiveNavWrapper ul.top {padding-left:0;}
.blogArchiveNavWrapper ul {list-style-type:none; padding-left:15px;}
.blogArchiveNavWrapper li {line-height:1.2em;}
.blogArchiveNavWrapper li.post a:link {text-decoration:none; font-weight:normal;}
.blogArchiveNavWrapper li.post a:hover {text-decoration:underline; }
.blogArchiveNavWrapper li.post {
  position: relative;
  padding-left: 1.2em;  /* Create space for the icon */
  margin-bottom: 1.3em;
  line-height: 1.4em;
}

.blogArchiveNavWrapper li.post::before {
  content: '▸';
  position: absolute;
  left: 0;              /* Aligns icon to left edge */
  top: 0.15em;          /* Fine-tune vertical alignment */
  color: #CC6600;
  font-weight: bold;
}

/* Social Media Button Bar */
.pmBlogButtonBar {display:block; margin-left:30px; margin-top:15px; margin-bottom:30px;}
.pmBlogButtonBar a.linkButton { text-decoration:none; display: inline-block; font-size: 10px; font-weight: bold; padding: 3px; font-family: Arial, Helvetica, sans-serif; color: #666; border: 1px solid #C0C0C0; background-color: #F5F5F5; border-radius: 3px; }

@media screen and (min-width: 600px){
    .blogLeft {width:70%; float:left;}
    .blogRight {clear:none; width:25%; float:right;}
}

@media (max-width: 420px) {
    .blog-grid-item {
        width: 100%;
    }
}

/* Make the blog grid stretch full width on the landing page */
.blogLeft {
    width: 100% !important;
    float: none !important;
}