/* They're also sized differently */
.entry-content h2,
.entry-content h3,
.entry-content h4 {
		font-family: var(--body-large-font-desktop);
		font-size: var(--title-large-size-rem-smartphone);
		font-weight: var(--label-large-weight-desktop);
		line-height: var(--title-large-line-height-rem-smartphone);
	margin-bottom: 0;
	margin-top: var(--space-xlarge);

	@media (min-width: 37.5em) {
			font-size: var(--title-large-size-rem-desktop);
			line-height: var(--title-large-line-height-rem-desktop);
	}
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
.entry-header,
.entry-content,
.entry-footer {
	padding: 0 var(--gutter-width);
	margin: var(--space-normal) auto;
}

.entry-header-wrapper,
.entry-content-wrapper,
.entry-footer-wrapper {
	width: 100%;
	max-width: var(--max-width-wide);
	margin: auto;
}

.blog .entry-header-wrapper,
.archive .entry-header-wrapper {
	max-width: var(--max-width-wide);	
}

/* Posts / Comment Navs */
.site-main .comment-navigation, 
.site-main .posts-navigation, 
.site-main .post-navigation {
	margin: 0 1em; 
	overflow: hidden; /* Test this - does it contain the floats? */
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	float: left;
	width: 20%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	float: right;
	text-align: right;
	width: 20%;
}