#ppdf-viewer {
	margin: 2em 0;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

#ppdf-viewer .ppdf-loading {
	padding: 3em 1em;
	text-align: center;
	color: #666;
}

#ppdf-viewer .ppdf-pages canvas {
	display: block;
	margin: 0 auto 16px;
	max-width: 100%;
	height: auto;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
	-webkit-user-drag: none;
}

.ppdf-print-notice {
	display: none;
}

/* Blank the document out of any print attempt (browser menu included). */
@media print {
	#ppdf-viewer {
		display: none !important;
	}
	.ppdf-print-notice {
		display: block;
		padding: 2em;
		text-align: center;
		font-size: 1.2em;
	}
}

/* Shrink the page-header banner on viewer pages.
 *
 * header.php gives every non-front page a hero (#page-header-container) and, for
 * protected_pdf, falls back to the blog page's banner ($pid = 741). Its height comes
 * entirely from .section-title's padding — 2.5em of a 2.5rem font is 100px top and
 * bottom, so ~250px of stock photo sits above a document the member opened to read.
 *
 * Safe to scope here: this stylesheet is enqueued only on is_singular('protected_pdf'),
 * and the body-class prefix outweighs the theme's #page-header-container .section-title.
 */
body.single-protected_pdf #page-header-container {
	/* Default is `top center`; at this height that crops to foreheads. */
	background-position: center center;
}

body.single-protected_pdf #page-header-container .section-title {
	font-size: 1.375rem;
	padding: 0.85em 15px;
	letter-spacing: 0.02em;
}

@media screen and (max-width: 480px) {
	body.single-protected_pdf #page-header-container .section-title {
		font-size: 1.125rem;
		padding: 0.75em 15px;
	}
}