.blog-post-body {
	width: 80%
}

.blog {
	overflow-x: auto;
	height: auto!important;
}

main .page article.blog {
	border: none
}

.blog-thumbnail img {
	width: 80% ;
	max-width: auto
}

.recent-blog {
	display: block;
	clear: both;
	overflow: hidden;
	width: 100%;
	position: relative;
	height: auto;
	padding: 30px 30px;
	margin: 0px
}

.recent-blog h2 {
	text-align: center
}

.blog-thumbnail {
	max-width: 100%
}

.recent-blog ul {
	display: block;
	clear: both;
	overflow: hidden;
	width: 100%;
	position: relative;
	height: auto;
	padding: 0px 0px;
	margin: 0px;
	list-style: none
}

.recent-blog ul li {
	float: left;
	width: 25%;
	padding: 20px
}

.recent-blog ul li h3 {
	font-size: 16px;
	text-align: center
}

.recent-blog ul li a {
	text-decoration: none
}

@media (min-width:801px) {
	main .page article.blog {
		display: block;
		float: left;
		overflow: hidden;
		width: 50%;
		position: relative;
		padding: 30px 30px;
		margin: 0px;
		min-height: 850px;
		border: none
	}

	main .page article.blog .blog-post-figure {
		width: 100%
	}


	main .page article.blog .blog-post-figure img {
		width: 100% ;
		max-width: auto
	}

	main .page article.blog .blog-post-body {
	}

	main .page article.blog .blog-post-body  .blog-title {
		margin: 1.5rem 0rem 0px
	}

	main .page article.blog .blog-post-body .blog-author, main .page article.blog .blog-post-body .blog-date {
	}

}

main .page article.blog .blog-post-body .blog-title::after {
	content: "";
	display: block;
	border-bottom: 3px solid #4f4f4f;
	width: 30px;
	margin: auto;
	height: 10px;
	margin-bottom: 10px
}

@media (max-width:801px) {
	.recent-blog ul li {
		width: 50%;
		padding: 20px 10px;
		margin: 0px;
		clear: none
	}

	.body, body {
		overflow-x: hidden !important
	}

}

.pagination { display: block;
clear: both;
overflow: hidden;
width: 100%;
height: auto; }