.latest-posts-row {display: grid ; gap: 20px;grid-template-columns: 1fr 1.3fr 1fr;}
.latest-posts-row .latest-post-card:nth-child(2) {grid-column: 2; grid-row: span 2; }
.latest-post-thumbnail a img {width: 100%; height: 217px; object-fit: cover; border-radius: 20px; display: block; }
.latest-posts-row .latest-post-card:nth-child(2) img {height: 287px; }
.latest-post-title a {color: #0E2E57; }
.latest-post-content .latest-post-title {font-size: 24px; margin-bottom: 10px; font-family: "Open Sans", sans-serif; }
.latest-post-content .latest-post-excerpt {color: #5D5D5D; }
.latest-post-thumbnail {position: relative; margin-bottom: 15px; }
span.latest-post-date {font-size: 12px; position: absolute; background: #00000080; color: #fff; padding: 5px 12px; border-radius: 30px; top: 10px; right: 10px; }





/*filter css*/
.blog-title-filter {display: flex ; justify-content: space-between; gap: 30px; align-items: center; }
#post-filter ul#category-list li {border-radius: 30px; padding: 14px 20px; list-style-type: none; border: 1px solid #0E2E571A; text-align: center; font-size: 14px; font-weight: 500; color: #5D5D5D; margin: 0; line-height: 1;     cursor: pointer;}
ul#category-list {padding: 0; display: flex ; gap: 10px; }
#post-filter ul#category-list li.active {background: #0E2E571A; color: #0E2E57; border-color: #0E2E571A; }
.blog-listing-sec {display: grid ; grid-template-columns: 1fr 1fr 1fr; gap: 20px; margin-bottom: 50px; }
.load-more-btn {text-align: center; }



@media screen and (max-width: 960px) {
.latest-posts-row {grid-template-columns: 1fr 1fr;     gap: 30px;}
.latest-posts-row .latest-post-card:nth-child(2) {grid-column: unset; grid-row: unset; }
.latest-posts-row .latest-post-card:nth-child(2) img {height: inherit; }
.blog-title-filter {flex-direction: column; }
.blog-listing-sec { grid-template-columns: 1fr 1fr; gap: 30px;}

.blog-title-filter div#post-filter {width: 100%; }
ul#category-list { gap: 6px;}

}


@media screen and (max-width: 767px) {
.latest-post-thumbnail a img { height: 217px !important;}
    .latest-posts-row {gap: 20px; }
    ul#category-list {overflow: auto;}
    #post-filter ul#category-list li {white-space: nowrap; flex-shrink: 0;    font-size: 13px; }
        .blog-listing-sec {  gap: 20px;    }


}


@media screen and (max-width: 480px) {

    .latest-posts-row {grid-template-columns: 1fr; gap:30px;}
    .blog-listing-sec {gap: 30px; grid-template-columns: 1fr; }


    
	}