
.blog .search {display: flex; justify-content: flex-end; padding: 60px 0;}
.blog .search form {display: flex; align-items: center; gap: 1rem;}
.blog .search form .search-field {padding: 0.5rem; border: 1px solid var(--three);  color: var(--one); width: 100%; display: inline-flex; font-size: 14px;}
.blog .search form .search-field::placeholder {color: var(--three);}
.blog .search form .search-submit {display: inline-flex; width: fit-content; padding: 0.5rem; background-color: var(--two); color: var(--zero);  border: solid 1px var(--two); font-size: 14px;}
.blog .search form .search-submit:hover {background-color: var(--one); color: var(--zero);}

.blog .blogposts .container {display: flex; flex-direction: column; gap: 35px;}
.blog .blogposts .single-post {background: var(--zero);}
.blog .blogposts .single-post a {display: block;}
.blog .blogposts .single-post a img.featured-img {display: block; width: 100%; height: 235px; object-fit: cover; margin-bottom: 1rem;}
.blog .blogposts .single-post .details {display: flex; flex-direction: column; gap: 15px;}
.blog .blogposts .single-post .details .author-time {display: flex; justify-content: space-between;}
.blog .blogposts .single-post .details .author-time .author {display: flex; font-size: 12px; align-items: center; gap: 10px;}
.blog .blogposts .single-post .details .author-time .author a {line-height: 1.1; color: var(--four);}
.blog .blogposts .single-post .details .author-time .author a:hover {opacity: 0.8;}
.blog .blogposts .single-post .details .author-time .avatar-img {width: 37px; height: 37px; }
.blog .blogposts .single-post .details .author-time .time {display: flex; flex-direction: column; font-size: 12px; justify-content: center;}
.blog .blogposts .single-post .details .author-time .time .date {display: flex; gap: 15px; white-space: nowrap; line-height: 1; color: var(--four); justify-content: end;}
.blog .blogposts .single-post .details .author-time .time .date svg {min-width: 10px; min-height: 10px; width: 10px; height: 10px;}
.blog .blogposts .single-post .details .author-time .time .date svg * {fill: var(--two);}
.blog .blogposts .single-post .details .title {font-size: 24px; color: var(--one);}
.blog .blogposts .single-post .details .title:hover {opacity: 0.8;}
.blog .blogposts .single-post .details .excerpt p {color: var(--four); margin: 0; padding: 0;}
.blog .blogposts .single-post .details .read-more {padding: 1rem 2rem;  background-color: transparent; color: var(--two); border: solid 1px var(--two); font-weight: bold; width: fit-content; font-size: 14px;}
.blog .blogposts .single-post .details .read-more:hover {color: var(--one); border: solid 1px var(--one);}
.blog .blogposts.button {display: flex; width: fit-content; padding: 15px 40px; background-color: transparent; color: var(--two);  border: solid 1px var(--two);}
.blog .blogposts.button:hover {border: solid 1px var(--one); color: var(--one); background-color: transparent;}


.blog .pagination {padding: 60px 0;}
.blog .pagination a {display: flex; width: fit-content; padding: 15px 40px; background-color: transparent; color: var(--three);  border: solid 1px var(--three);}
.blog .pagination a:hover {border: solid 1px var(--two); color: var(--two); background-color: transparent;}

body.blog.ks-rounding-light .search form .search-field {border-radius: 8px;}
body.blog.ks-rounding-strong .search form .search-field {border-radius: 32px;}
body.blog.ks-rounding-light .search form .search-submit {border-radius: 8px;}
body.blog.ks-rounding-strong .search form .search-submit {border-radius: 32px;}
body.blog.ks-rounding-light .blogposts .single-blogpost .post-details .read-more {border-radius: 8px;}
body.blog.ks-rounding-strong .blogposts .single-blogpost .post-details .read-more {border-radius: 32px;}


body.blog.ks-rounding-light .blogposts .single-post {border-radius: 8px 8px 0 0; overflow: hidden;}
body.blog.ks-rounding-strong .blogposts .single-post {border-radius: 32px 32px 0 0; overflow: hidden;}
body.blog.ks-rounding-light .blogposts .single-post .details .read-more {border-radius: 8px;}
body.blog.ks-rounding-strong .blogposts .single-post .details .read-more {border-radius: 32px;}
body.blog.ks-rounding-light .blogposts .button {border-radius: 8px;}
body.blog.ks-rounding-strong .blogposts .button {border-radius: 32px;}
body.blog.ks-rounding-light .blogposts .single-post .details .author-time .avatar-img,
body.blog.ks-rounding-strong .blogposts .single-post .details .author-time .avatar-img {border-radius: 100px;}

@media (max-width: 991.98px) {
	.blog .blogposts .single-blogpost .featured-img {width: 200px;}
}

@media (max-width: 767.98px) {
	.blog .search {justify-content: center;}
	.blog .blogposts .single-blogpost {flex-direction: column;}
	.blog .blogposts .single-blogpost .featured-img {width: 100%; height: 100px; }
	.blog .pagination .row {flex-direction: column; gap: 10px;}
	.blog .pagination a {width: 100%; justify-content: center;}
}