//Italic Font
@font-face {
	font-family: "Noto Sans Italic";
	src: local("Noto Sans Italic"),
		url("../fonts/noto_sans/NotoSans-Italic.woff") format("woff"),
		url("../fonts/noto_sans/NotoSans-Italic.woff2") format("woff");
}

.content-area,
.widget-area {
	address {
		margin-bottom: $lsx-gap;
	}

	a {
		&:not(.btn) {
			transition: all 300ms ease;
			word-wrap: break-word;
		}
	}

	big {
		font-size: 120%;
	}

	em {
		font-family: "Noto Sans Italic", sans-serif;
	}

	blockquote {
		font-family: "Noto Sans Italic", sans-serif;
		border-radius: 10px;
		border-style: solid;
		border-width: 1px;
		display: block;
		font-size: 16px;
		margin: calc(25px + 1.2rem) 0 $lsx-gap;
		padding: 4rem 4rem $lsx-gap;
		position: relative;
		text-align: center;
		p {
			font-weight: 400;
		}
		@include media(">=tablet") {
			margin-left: auto;
			margin-right: auto;
			margin-top: calc(30px + 1.2rem);
			max-width: 80%;

			.blog &,
			.archive & {
				max-width: none;
			}
		}

		&:before {
			border-radius: 50%;
			content: "”";
			font-family: $headings-font-family;
			font-size: 60px;
			font-style: normal;
			height: 50px;
			left: 50%;
			line-height: 1.375;
			overflow: hidden;
			position: absolute;
			top: -25px;
			transform: translateX(-50%);
			width: 50px;

			@include media(">=tablet") {
				font-size: 72px;
				height: 60px;
				top: -30px;
				width: 60px;
			}
		}

		& cite {
			display: block;
			font-size: 13px;
			font-style: normal;
			margin-top: $lsx-gap;
			text-align: left;

			&:before {
				content: "\2014";
				display: inline-block;
				margin-right: 5px;
			}
		}

		& p {
			font-style: italic;
			font-size: inherit;
			line-height: 1.375;
		}
	}

	dl {
		margin-bottom: $lsx-gap;

		& > dt {
			font-weight: 700;
		}

		& > dd {
			font-style: italic;

			& + dt {
				margin-top: $lsx-gap;
			}
		}
	}

	em {
		font-style: italic;
	}

	h1,
	h2,
	h3,
	h4,
	h5,
	h6,
	.widget-title {
		margin-top: 0;
		margin-bottom: $lsx-gap;
	}

	h3,
	.h3 {
		font-size: 22px;
	}

	h4,
	.h4 {
		font-size: 20px;
	}

	h5,
	.h5 {
		font-size: 18px;
	}

	h6,
	.h6 {
		font-size: 16px;
	}

	ol,
	ul:not([class]) {
		margin-bottom: $lsx-gap;
		padding-left: 4rem;

		ol,
		ul {
			margin-bottom: 0;
		}
	}

	p {
		margin-bottom: $lsx-gap;
	}

	pre {
		border-radius: 5px;
		border-style: solid;
		border-width: 1px;
		font-size: 14px;
		margin-bottom: $lsx-gap;
		padding: 2rem;
	}

	small {
		font-size: 80%;
	}

	strong {
		font-weight: 700;
	}

	table,
	.table {
		margin-bottom: $lsx-gap;
	}

	.white {
		color: #ffffff;
	}
}