.simple_blog_archive_year{
padding-left:15px;
margin-top:10px;
margin-bottom:0;
font-weight:bold;
}

.simple_blog_archive_month{
font-weight:normal;
}

.simple_blog_archive_post{
font-weight:normal;
}

.simple_blog_archive_post li{
margin-bottom:8px;
}

.simple_blog_categories{
padding-left:20px;
margin-top:10px;
margin-bottom:0;
}

.simple_blog_categories li{
margin-bottom:10px;
}

.simple_blog_post img{
	height:96px;
	width:96px;
 	flex-shrink: 0;
}

.simple_blog_post p{
  	margin: 0;
  	flex: 1;
}

.pagination{
list-style:none;
padding:0;
text-align:center;
}

.pagination li{
display:inline-block;
}

.pagination li a,
.pagination li a:link,
.pagination li a:active,
.pagination li a:visited,
.pagination li a:hover{
display:block;
color:#ffffff;
font-weight:bold;
font-size:16px;
text-decoration:none;
background-color:#1e90ff;
border-radius:30px;
margin:3px;
width:32px;
height:32px;
line-height:32px;
}

.activepagination{
background-color:gray !important;
}

/* Container for the posts */
.blog-container,
#content > .box {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: space-between;
  padding: 5px;
}

/* Each blog post */
.simple_blog_post {
  flex: 1 1 calc(50% - 10px); /* two per row */
  border-top: 1px solid #ccc;
  border-right: 1px solid #ccc;
  box-sizing: border-box;
  padding: 10px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 10px;
  align-items: flex-start;
  cursor: pointer;
}

/* For visual spacing inside the post */
.simple_blog_post > * {
  margin: 0 0 10px 0;
}

/* Ensure contents wrap properly */
.simple_blog_post * {
  overflow-wrap: break-word;
  word-break: break-word;
  white-space: normal;
}

/* Category styling */
.simple_blog_post .category {
  font-weight: 100; /* Hairline */
  color: orange;
  display: block;
  font-size: 0.85em;
  margin-bottom: 5px;
}

/* Published date */
.published-date {
  color: #aaa;
  display: block;
  margin-top: 5px;
}

/* Responsive: stack to one column on very narrow screens */
@media (max-width: 500px) {
  .simple_blog_post {
    flex: 1 1 100%;
  }
}
