/** main banner **/

.main-banner {
	height: 289px;
	display: flex;
	align-items: flex-end;
}

.main-banner .page-title {
	margin: 0 33px 56px 0;
	border: 2px solid #dcc182;
	padding: 5px;
}

.main-banner .page-title > * {
	padding: 10px 38px;
	border: 1px solid #dcc182;
}

/** main banner **/

/** page description **/

.page-description {
	margin: 37px auto;
}

/** page description **/

/** inner links **/

.inner-links {
	display: flex;
	justify-content: center;
}

.inner-links li:not(:last-child) a:after {
	content: '||';
	margin: 0 16px;
}

.inner-links li a span {
	text-decoration: underline;
}

.inner-links li a:hover span,
.inner-links li.active a span {
	text-decoration: none;
}

/** inner links **/

/** blog posts **/

.blog-posts {
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	grid-gap: 49px 12px;
	margin-top: 32px;
}

.blog-posts li {
	border: 1px solid #dcc182;
	display: flex;
	flex-direction: column;
}

.blog-posts li .post-image {
	height: 237px;
}

.blog-posts li .post-info {
	padding: 20px 20px 5px;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

.blog-posts li .post-info .post-info-content {
	margin-bottom: 20px;
}

.blog-posts li .post-categories {
	margin-top: auto;
}

.blog-posts li .post-info .post-tags a {
	text-decoration: underline;
}

/** blog posts **/

/** load more posts **/

.load-more-posts {
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	grid-column-gap: 12px;
	margin-top: 49px;
}

.load-more-posts a {
	grid-column: 2 / 3;
	padding: 9px 0;
	background-color: #220000;
}

/** load more posts **/

@media (max-width: 1365px) {

	/** main banner **/

	.main-banner {
		height: 216px;
	}

	.main-banner .page-title {
		margin: 0 24px 41px 0;
	}

	/** main banner **/

	/** page description **/

	.page-description {
		margin: 25px auto;
	}

	/** page description **/

	/** inner links **/

	.inner-links li:not(:last-child) a:after {
		margin: 0 8px;
	}

	/** inner links **/

	/** blog posts **/

	.blog-posts {
		margin-top: 20px;
		grid-row-gap: 27px;
	}

	.blog-posts li .post-image {
		height: 176px;
	}
	
	.blog-posts li .post-info {
		padding: 12px 10px 2px;
	}
	
	.blog-posts li .post-info .post-categories {
		margin-top: 10px;
	}

	/** blog posts **/

}

@media (max-width: 700px) {

	/** blog posts **/
	
	.blog-posts {
		grid-template-columns: repeat( 2, 1fr );
	}
	
	/** blog posts **/

}

@media (max-width: 500px) {

	/** inner links **/
	
	.inner-links li:not(:last-child) a:after {
		margin: 0 4px;
	}
	
	/** inner links **/
	
	/** blog posts **/
	
	.blog-posts {
		grid-template-columns: 1fr;
	}
	
	/** blog posts **/

}