/* Body Fonts */
body,
button,
input,
select,
table,
textarea,
.post-navigation .nav-title span,
.entry-content p.has-s-font-size,
.wp-block-calendar table {
	@include font-body;
	@include font-body-s;
	color: $color__text_two;
}

.posts-container .hentry .entry-footer,
.hentry .entry-summary,
.hentry .entry-header .entry-meta,
.single-post .navigation a span.nav-subtitle,
.widget ul li,
.entry-content p.has-extrasmall-font-size,
.entry-content p.has-xs-font-size,
.entry-content .sharedaddy h3.sd-title {
	@include font-body-xs;
}

.hentry .entry-summary {

	.blog-2-column & {
		@include breakpoint(l) {
			@include font-body-s;
		}
	}

	.blog-1-column & {
		@include breakpoint(m) {
			@include font-body-m;
		}
	}
}

.entry-content p,
.hentry ol,
.hentry ul,
.single-post .entry-cats,
.page-header .description p,
.entry-content p.has-m-font-size {
	@include font-body-m;
}

.entry-content p.has-l-font-size,
.entry-content .intro {
	@include font-body-l;
}

.entry-content p.has-xl-font-size {
	@include font-body-xl;
}

.entry-content p.has-xxl-font-size {
	@include font-body-xxl;
}

.comment-metadata,
.comment-notes,
.logged-in-as,
.entry-content p.has-xxs-font-size {
	@include font-body-xxs;
}

/* Headings */
h1,
h2,
h3,
h4,
h5,
h6,
.site-title,
.post-navigation .nav-title {
	color: $color__text_one;
	@include font-bold;
	@include hyphenation;
}

h1.site-title,
.site-title,
h2.entry-title {
	@include hyphenation;
}

.h-regular h1,
.h-regular h2,
.h-regular h3,
.h-regular h4,
.h-regular h5,
.h-regular h6,
.h-regular .site-title,
.h-regular.single-post .byline,
.h-regular .post-navigation .nav-title,
.post-navigation .nav-title span {
	@include font-regular;
}

h1.has-xxl-font-size {
	@include font-h-l;
}

h1.has-xl-font-size,
h2.has-xxl-font-size {
	@include font-h-k;
}

h1.has-l-font-size,
h2.has-xl-font-size,
h3.has-xxl-font-size {
	@include font-h-j;
}

h1.has-m-font-size,
h2.has-l-font-size,
h3.has-xl-font-size,
h4.has-xxl-font-size {
	@include font-h-i;
}

h1.has-s-font-size,
h2.has-m-font-size,
h3.has-l-font-size,
h4.has-xl-font-size,
h5.has-xxl-font-size {
	@include font-h-h;
}

h1.has-xs-font-size,
h2.has-s-font-size,
h3.has-m-font-size,
h4.has-l-font-size,
h5.has-xl-font-size,
h6.has-xxl-font-size {
	@include font-h-g;
}

h1,
h1.has-xxs-font-size,
h2.has-xs-font-size,
h3.has-s-font-size,
h4.has-m-font-size,
h5.has-l-font-size,
h6.has-xl-font-size {
	@include font-h-f;
}

h2,
h2.has-xxs-font-size,
h3.has-xs-font-size,
h4.has-s-font-size,
h5.has-m-font-size,
h6.has-l-font-size {
	@include font-h-e;
}

h3,
h3.has-xxs-font-size,
h4.has-xs-font-size,
h5.has-s-font-size,
h6.has-m-font-size,
.related .section-title,
.comments-area .comments-title {
	@include font-h-d;
}

h4,
h4.has-xxs-font-size,
h5.has-xs-font-size,
h6.has-s-font-size,
h1.site-title,
.site-title {
	@include font-h-c;
}

h1.site-logo {
	font-size: 1px;
	line-height: 1;

	@include breakpoint(m) {
		font-size: 1;
	}
}

.related-title,
.comment-reply-title,
.nav-title,
.blog h2.entry-title,
.blog-archive h2.entry-title,
h5,
h5.has-xxs-font-size,
h6.has-xs-font-size {
	@include font-h-b;
}

h6,
h6.has-xxs-font-size,
h2.widget-title {
	@include font-h-a;
}

.blog,
.blog-archive {
	&.blog-2-column h2.entry-title {
		@include breakpoint(l) {
			@include font-h-c;
		}
	}

	&.blog-1-column h2.entry-title {
		@include breakpoint(m) {
			@include font-h-d;
		}
	}
}

/* Padding for Headlines in Content Area */
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
	margin-top: $spacing-2;
	margin-bottom: $spacing-2;
}

address,
p {
	margin-bottom: $spacing-mobile-4;

	@include breakpoint(m) {
		margin-bottom: $spacing-desktop-4;
	}
}

dfn,
em,
i {
	font-style: italic;
}

dt {
	font-weight: bold;
}

dd {
	margin: 0 $spacing-3 $spacing-3;

	@include breakpoint(m) {
		margin: 0 $spacing-3 $spacing-3;
	}
}

blockquote {
	margin: 0;
	padding: 0;
}

.entry-content blockquote p,
blockquote p {
	margin: 0;
}

blockquote cite,
.wp-block-pullquote cite {
	text-align: left;
	display: block;
	padding: $spacing-2 0 0;
	@include font-body-xs;
	font-style: normal;
	font-weight: bold;
}

code,
kbd,
tt,
var {
	@include font-code;
}

pre {
	max-width: 100%;
	overflow: auto;
	padding: $spacing-mobile-4;
	margin-bottom: $spacing-mobile-4;
	border: none;
	@include border-radius-m;
	@include font-code;

	@include breakpoint(m) {
		padding: $spacing-desktop-4;
		margin-bottom: $spacing-desktop-4;
	}
}

abbr,
acronym {
	text-decoration: none;
	border-bottom: 1px dotted #666;
	cursor: help;
}

ins,
mark {
	background-color: rgba(63, 192, 224, .1);
	text-decoration: none;
}

big {
	font-size: 125%;
}

.dropcap {
	font-size: 6.125rem;
	font-weight: 300;
	float: left;
	padding: 0 10px 0 0;
	line-height: 0.9;
	color: $color__text_one;

	@include breakpoint(m) {
		font-size: 7.75rem;
		margin-left: -11px;
		line-height: 0.79;
	}
}

.wide-content {
	@include breakpoint(xl) {
		max-width: $col12;
	}
}