
.site-article {
	margin-bottom: 5em;
}

.page-article > * {
	float: left;
	clear: left;
	width: 30em;
}

.page-article > .content {
	word-wrap: break-word;
}

/* .page-aside */

.page-aside .about {
	font-family: 'Open Sans', 'Arial', 'Helvetica', sans-serif;
	font-size: 87.5%;
	border: 1px solid #006C85;
	padding: 1.5em 2.5em 1.5em;
	margin-top: 2em;
}

.page-aside .about img {
	display: block;
	width: 20em;
	height: 4.76190476em;
}

.page-aside .about p {
	margin: 1em 0;
}

.page-aside .site-articles,
.page-aside .podcast-info {
	margin-bottom: 4em;
}

.page-aside .site-articles h2 {
	margin-top: 0;
}

.page-aside .podcast-info p {
	padding: 0.75em 0;
	text-align: center;
}

.page-aside .podcast-info .links img {
	height: 2.5em;
	margin: 0 1em;
}

.page-aside .podcast-info .learn a {
	display: block;
	background: #EDF3F4;
	color: #63A2A7;
	padding: .5em 0;
	border-radius: .5em;
	font-family: 'Open Sans', 'Arial', 'Helvetica', sans-serif;
}

/**/

.page-aside,
.child .page-article .table-of-contents,
.child .page-article .publication-title {
	float: none;
	clear: none;
	width: 20em;
	margin-top: 2em;
	margin-left: 36em;
}

.child .page-article .publication-title {
	margin-top: 1.5em;
}

.child .page-article .publication-title h2 {
	font-size: 175%;
}

.child .page-article .publication-title + .table-of-contents {
	margin-top: 1em;
}


@media (max-width: 961px) {
	.page-aside,
	.child .page-article .table-of-contents,
	.child .page-article .publication-title {
		margin-left: 0;
		width: auto;
		max-width: 30em;
	}

	.page-aside .about {
		border: none;
		padding: 0;
	}

	.page-article > *,
	.child .page-article .table-of-contents,
	.child .page-article .publication-title {
		float: none;
		width: auto;
		max-width: 30em;
	}
}

/* .comments */

.page-article .comments {
	margin-top: 1em;
}

@media print {
	.page-article .comments {
		display: none;
	}
}

/* .signup */

.page-article .signup {
	color: #FFF;
	background: no-repeat 90% 95%/auto 125% url(/include/images/signup-background.svg) #006C85;
	padding: 1em 0;
	margin: 1.5em 0 .5em;
}

.page-article .signup h2 {
	font-size: 150%;
	margin: .5em 1.3333333333em;
}

.page-article .signup p {
	margin: 1em 2em;
}

.page-article .signup form p {
	display: flex;
}

.page-article .signup input,
.page-article .signup button {
	border: none;
}

.page-article .signup input {
	font-family: 'Open Sans', 'Arial', 'Helvetica', sans-serif;
	flex-shrink: 1;
	min-width: 0;
}

.page-article .signup button {
	background: #000;
	color: #FFF;
	border: none;
	width: 6em;
	flex: none;
}

@media print {
	.page-article .signup {
		display: none;
	}
}

/* .breadcrumb */

.page-article .breadcrumb {
	float: none;
	overflow: hidden;
	margin: 1.5em 0;
	color: #777;
}

.page-article .breadcrumb .d,
.page-article .breadcrumb a {
	font-family: 'Open Sans', 'Arial', 'Helvetica', sans-serif;
	font-size: 87.5%;
}

.page-article .breadcrumb .d {
	margin: 0 .25em;
}

.page-article .breadcrumb span.issue {
	float: right;
}

.page-article .breadcrumb span.issue a {
	font-family: inherit;
}

@media print {
	.page-article .breadcrumb {
		display: none;
	}
}

/* .tools */

.page-article .tools {
	font-family: 'Open Sans', 'Arial', 'Helvetica', sans-serif;
	margin: 1em 0 0;
	text-align: center;
}

.page-article .tools .d {
	display: inline-block;
	width: 0;
	height: 1.75em;
	margin: -.875em 1em;
	margin-right: .25em;
	overflow: hidden;
	border-left: 1px solid #000;
	vertical-align: middle;
}

.page-article .tools img {
	height: 1em;
	margin: -.5em .5em;
	vertical-align: middle;
}

@media print {
	.page-article .tools *,
	.page-article .tools .d {
		display: none;
	}

	.page-article .tools .date {
		display: inline;
	}
}

/* .title */

.page-article .title {
	margin: 0 0 2em;
}

.root .page-article .title {
	margin-top: 3em;
}

.page-article .banner ~ .title {
	margin-top: 2em;
}

.page-article .breadcrumb ~ .title {
	margin-top: 0;
}

.page-article .title .byline {
	margin: 1em 0 0;
}

.page-article .title .byline .thumbnail {
	text-decoration: none;
}

.page-article .title .byline img {
	vertical-align: middle;
	vertical-align: -1.125em;
	border-radius: 50%;
	margin-right: .25em;
	display: inline-block;
}

.page-article .title .tools {
	text-align: left;
}

.page-article .title .tools img {
	margin-left: .75em;
	margin-right: 0;
}

.page-article .title .tools a:first-child img {
	margin-left: 0;
}

.page-article .title h1 {
	font-size: 200%;
}

.page-article .title h1.subtitle {
	font-size: 150%;
	font-weight: normal;
}

.page-article .title h1 + h1 {
	margin-top: .5em;
}

@media (max-width: 420px) {
	.page-article .title {
		margin: 0 0 1em;
	}

	.root .page-article .title {
		margin-top: 2em;
	}

	.page-article .banner ~ .title {
		margin-top: 1em;
	}

	.page-article .title h1 {
		font-size: 150%;
	}

	.page-article .title h1.subtitle {
		font-size: 120%;
	}
}

/* .isxn */

.page-article .isxn {
	margin-top: 3em;
}

.site-article .isxn > * {
	font-size: 87.5%;
	color: #777;
}

/* .with-banner */

.with-banner .page-article .banner,
.with-banner .page-article .breadcrumb {
	width: 40em;
	max-width: none;
}

.with-banner .page-article .breadcrumb {
	position: absolute;
	top: 0;
	left: 0;
}

.with-banner .page-article .banner {
	float: none;
	padding-top: 4.5em;
	margin-bottom: 2em;
}

.with-cover .page-article .banner {
	margin-bottom: 1.25em;
}

.with-banner .page-article .breadcrumb ~ .banner {
	margin-top: 0;
}

.page-article .banner .image,
.page-article .banner .video {
	position: relative;
	width: 100%;
	height: 0;
	padding-top: 52.5%;
}

.page-article .banner .video {
	background: #333;
	color: #FFF;
}

.with-banner-16_9 .page-article .banner .image,
.with-banner-16_9 .page-article .banner .video {
	padding-top: 56.25%;
}

.page-article .banner .caption {
	font-family: 'Open Sans', 'Arial', 'Helvetica', sans-serif;
	font-size: 88%;
	color: #777;
	margin: .5em 0 2em;
}

.page-article .banner .image img,
.page-article .banner .video * {
	position: absolute !important;
	top: 0 !important;
	width: 100% !important;
	height: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
	border: none !important;
}

@media (max-width: 961px) {
	.with-banner .page-article .banner,
	.with-banner .page-article .breadcrumb {
		width: 30em;
	}
}

@media screen and (max-width: 800px) {
	.with-banner {
		position: relative;
		padding-top: 52.5%;
	}

	.with-banner-16_9 {
		padding-top: 56.25%;
	}

	.with-banner .site-section {
		position: static;
	}

	.with-banner .page-article .breadcrumb {
		position: relative;
		width: auto;
		margin: 1em 0;
	}

	.with-banner .page-article .banner {
		width: 100%;
		padding: 0;
	}

	.with-banner .page-article .banner .image,
	.with-banner .page-article .banner .video {
		position: absolute;
		top: 0;
		left: 0;
	}
}

@media print {
	.with-banner .page-article .banner {
		float: right;
		padding: .25em 0 1em 1.5em;
		max-width: 33.3333%
	}

	.with-banner .page-article .title {
		margin-top: 1.5em;
	}
}

/* .audio */

.page-article .audio audio {
	display: block;
	width: 100%;
}

/* .formats */

.site-article .publication .formats {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: -.25em;
	margin-top: .75em;
}

.page-article > .publication .formats.single {
	justify-content: center;
}

.site-article .publication .formats > * {
	background: no-repeat top 50% left 1.5em #006C85;
	background-size: auto 1em;
	color: white;
	font: inherit;
	font-family: 'Open Sans', 'Arial', 'Helvetica', sans-serif;
	line-height: 2.5;
	height: 2.5em;
	border-radius: .5em;
	text-decoration: none;
	padding: 0 1.5em;
	margin: .25em;
	border: none;
	cursor: pointer;
}

.site-article .publication .formats .download {
	background-color: #D94137;
	padding-left: 2.875em;
	background-image: url(/include/images/document-dark.svg);
}

.site-article .publication .formats .download.pdf {
	background-image: url(/include/images/pdf-dark.svg);
}

.site-article .publication .formats .order {
	padding-left: 3em;
	background-image: url(/include/images/order-dark.svg);
}

/* .table-of-contents */

.page-article .table-of-contents {
	position: relative;
	margin: 2em 0 0;
}

.page-article .table-of-contents h2 {
	font-size: 150%;
	padding-bottom: .25em;
	border-bottom: 1px solid #000;
}

.page-article .table-of-contents ul {
	list-style: none;
	padding-left: 1.25em;
	line-height: 1.125;
}

.page-article .table-of-contents li {
	margin: 1em 0;
}

.page-article .table-of-contents li.selected > a {
	display: block;
	background: #E6F0F3;
	position: relative;
	padding: .75em 1.25em;
	margin: -.75em 0 -.75em -1.25em;
}

.single-page.with-cover .page-article .table-of-contents ul ul {
	display: none;
}

.single-page.with-cover .page-article .table-of-contents li.selected > ul,
.single-page.with-cover .page-article .table-of-contents ul.selected {
	display: block;
}

.single-page.with-cover .page-article .table-of-contents ul {
	font-family: 'Open Sans', 'Arial', 'Helvetica', sans-serif;
	padding: 0 .5em;
}

.single-page.with-cover .page-article .table-of-contents ul ul {
	padding-left: 1em;
	padding-right: 0;
}

.single-page.with-cover .page-article .table-of-contents li.selected > a {
	padding: .5em;
	margin: -.5em;
}

/* .child-nav */

.page-article ul.child-nav {
	list-style: none;
	padding: 0;
	margin: 0;
	font-size: 150%;
	font-family: 'Open Sans', 'Arial', 'Helvetica', sans-serif;
	line-height: 1.125;
	font-weight: bold;
}

.page-article ul.child-nav li + li {
	margin-top: .75em;
}

/* .with-cover */

.with-cover .page-article {
	width: 53em;
}

.with-cover .page-article > * {
	float: right;
	clear: right;
	width: 30em;
}

.with-cover .page-article .publication {
	width: 20em;
	margin-top: 3em;
}

.with-cover .page-article > .publication,
.with-cover.child .page-article > .table-of-contents {
	float: none;
	clear: none;
	margin-left: 0;
}

.with-cover.root .page-article .publication {
	float: left;
}

.with-cover .page-article .cover img {
	display: block;
	width: 100%;
	box-shadow: rgba(0, 0, 0, .125) 0 0 .25em;
}

.with-cover .page-article .breadcrumb ~ .publication {
	margin-top: 0;
}

.with-cover .page-article .breadcrumb {
	float: none;
	width: auto;
}

.with-cover .page-aside {
	margin-top: 6em;
	margin-left: 0;
}

.with-cover .page-aside,
.with-cover .page-article:after {
	clear: left;
	float: none;
	width: 20em;
}

.with-cover .page-article:after {
	content: '';
	display: block;
	padding-bottom: 1px;
	margin-bottom: -1px;
}

.with-cover .page-article .isxn {
	margin: 0;
	padding-top: .5em;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.with-cover.child .page-article .table-of-contents {
	clear: left;
	width: 20em;
	box-sizing: border-box;
}

.single-page.with-cover .page-article .table-of-contents {
	float: left;
	clear: left;
	width: 20em;
	max-height: 100vh;
	margin: 0;
	position: sticky;
	top: 0;
	display: flex;
	flex-direction: column;
}

.single-page.with-cover .page-article .table-of-contents ~ * {
	float: none;
	margin-left: auto;
	padding-top: 1.5em;
}

.single-page.with-cover .page-article .table-of-contents h2 {
	margin-top: .75em;
	flex: 0 0 auto;
}

.single-page.with-cover .page-article .table-of-contents h2 + div {
	flex: 1 1 auto;
	overflow-y: auto;
}

.single-page.with-cover .page-article .table-of-contents ul {
	margin: 1em 0 1.5em;
}

.single-page.with-cover .page-article .table-of-contents ul ul {
	margin: 1em 0;
}

.single-page.with-cover .page-article h3 {
	font-size: 120%;
	margin: 1.2em 0 0.83333333333em;
	font-style: italic;
}

.single-page.with-cover .page-article h4 {
	font-size: 120%;
	margin: 1em 0 0.83333333333em;
	font-weight: normal;
}

.single-page.with-cover .page-article h5 {
	font-size: 100%;
	margin: 1em 0;
	font-family: inherit;
}

@media (max-width: 1080px) {
	.with-cover .page-article {
		max-width: calc(51.5em + (100% - 51.5em) / 2);
	}

	.with-cover.child .page-article .table-of-contents,
	.single-page.with-cover .page-article .table-of-contents,
	.with-cover .page-article .publication {
		max-width: calc(100% - 31.5em);
	}

	.with-cover .page-aside {
		display: none;
	}

	.single-page.with-cover .page-article .table-of-contents h2 ~ * {
		font-size: 90%;
	}
}

@media (max-width: 900px) {
	.with-cover .page-article {
		width: calc(51.5em + (100% - 51.5em) / 2);
		max-width: 100%;
	}
}

@media (max-width: 850px) {
	.with-cover .page-article .isxn > * {
		flex-basis: 100%;
	}

	.with-cover.child .page-article .table-of-contents ul {
		font-size: 87.5%;
		padding-left: 0;
	}

	.with-cover.child .page-article .table-of-contents ul ul {
		font-size: 100%;
		padding-left: 1.25em;
	}

	.with-cover.child .page-article .table-of-contents {
		padding-top: 2.5em;
	}
}

@media (max-width: 750px) {
	.with-cover .page-article > *,
	.with-cover.child .page-article .table-of-contents,
	.single-page.with-cover .page-article .table-of-contents,
	.single-page.with-cover .page-article .table-of-contents ~ *,
	.with-cover.child .page-article .publication,
	.with-cover.root .page-article .publication {
		float: none;
		clear: none;
		width: auto;
		max-width: 30em;
		margin-left: 0;
	}

	.with-cover.child .page-article .publication,
	.with-cover.root .page-article .publication,
	.with-cover.child .page-article .table-of-contents {
		max-width: 20em;
	}

	.with-cover.root .page-article .publication {
		margin-bottom: 1.25em;
	}

	.with-cover.child .page-article .title,
	.with-cover.child .page-article .publication {
		margin-top: 1.25em;
	}

	.single-page.with-cover .page-article .table-of-contents {
		position: fixed;
		top: auto;
		bottom: 0;
		box-sizing: border-box;
		max-height: calc(100vh - 3em);
		max-width: calc(100vw - 1.25em);
		transform: translateY(100%);
		transition: transform ease .25s;
		justify-content: flex-start;
		z-index: 999;
	}
	
	.single-page.with-cover .page-article .table-of-contents h2,
	.single-page.with-cover .page-article .table-of-contents h2 ~ * {
		background: white;
		border: 1px solid #CCC;
		border-bottom: none;
	}
	
	.single-page.with-cover .page-article .table-of-contents h2 {
		margin: 0;
		font-size: 100%;
		line-height: 1;
		padding: .5em;
		cursor: pointer;
		position: absolute;
		bottom: calc(100% - 1px);
	}

	.single-page.with-cover .page-article .table-of-contents ul {
		padding: 0 1em;
	}

	.single-page.with-cover .page-article .table-of-contents h2:after {
		content: ' ▲';
	}

	.single-page.with-cover .page-article .table-of-contents:focus h2:after,
	.single-page.with-cover .page-article .table-of-contents:focus-within h2:after {
		content: ' ▼';
	}

	.single-page.with-cover .page-article .table-of-contents:focus,
	.single-page.with-cover .page-article .table-of-contents:focus-within {
		transform: none;
	}

	.single-page.with-cover .page-article .table-of-contents:focus,
	.single-page.with-cover .page-article .table-of-contents:focus-within,
	.single-page.with-cover .page-article .table-of-contents:focus h2,
	.single-page.with-cover .page-article .table-of-contents:focus-within h2 {
		pointer-events: none;
	}

	.single-page.with-cover .page-article .table-of-contents:focus h2 ~ *,
	.single-page.with-cover .page-article .table-of-contents:focus-within h2 ~ * {
		pointer-events: initial;
	}
}

@media print {
	.page-aside {
		display: none;
	}
}

/* #font-size */

#font-size-75:checked ~ .content > * {
	font-size: 75%;
}

#font-size-125:checked ~ .content > * {
	font-size: 125%;
}

#font-size-150:checked ~ .content > * {
	font-size: 150%;
}

.tools .font-size {
	float: right;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.tools .font-size > * {
	vertical-align: middle;
}

.tools .font-size > span {
	text-transform: uppercase;
	font-size: 75%;
	font-weight: bold;
	margin-right: .25em;
}

.tools .font-size label {
	display: none;
	width: 1em;
	height: 1em;
	overflow: hidden;
	text-indent: -9999%;
	cursor: pointer;
	background: no-repeat center/contain url(/include/images/tools/font-larger.svg);
}

#font-size-75:checked ~ .title [for="font-size-75"],
#font-size-100:checked ~ .title [for="font-size-75"],
#font-size-125:checked ~ .title [for="font-size-100"],
#font-size-150:checked ~ .title [for="font-size-125"] {
	display: inline-block;
	background-image: url(/include/images/tools/font-smaller.svg);
}

#font-size-75:checked ~ .title [for="font-size-100"],
#font-size-100:checked ~ .title [for="font-size-125"],
#font-size-125:checked ~ .title [for="font-size-150"],
#font-size-150:checked ~ .title [for="font-size-150"] {
	display: inline-block;
}

#font-size-75:checked ~ .title [for="font-size-75"],
#font-size-150:checked ~ .title [for="font-size-150"] {
	opacity: .5;
	cursor: auto;
}
