/*	COMMON PAGE ELEMENTS 
	====================

	Third-party media sources:
	- Cork Board background pattern: https://www.toptal.com/designers/subtlepatterns/cork-board-pattern/
	- Rice Paper 2 background pattern: https://www.toptal.com/designers/subtlepatterns/rice-paper-2/
	- Lato font: https://fonts.google.com/specimen/Lato
	- Rock Salt font: https://fonts.google.com/specimen/Rock+Salt
	- Special Elite font: https://fonts.google.com/specimen/Special+Elite
	- Font Awesome icons as SVG glyphs: https://fontawesome.com

*/
 
 
	@font-face { font-family: 'Lato'; font-display: swap; font-style: normal; src: url('/css/lato-regular.ttf') format('truetype'); }

	@font-face { font-family: 'Lato'; font-display: swap; font-style: italic; src: url('/css/lato-italic.ttf') format('truetype'); }

	@font-face { font-family: 'Lato'; font-display: swap; font-style: normal; font-weight: 500 900; src: url('/css/lato-bold.ttf') format('truetype'); }

	@font-face { font-family: 'Lato'; font-display: swap; font-style: italic; font-weight: 500 900; src: url('/css/lato-bolditalic.ttf') format('truetype'); }

	@font-face { font-family: 'Rock Salt'; font-display: swap; src: url('/css/rocksalt-regular.ttf') format('truetype'); }

	@font-face { font-family: 'Special Elite'; font-display: swap; font-style: normal; src: url('/css/special-elite.ttf') format('truetype'); }

	@font-face { font-family: 'Rock Salt'; font-display: swap; src: url('/css/rocksalt-regular.ttf') format('truetype'); }

	body { background: #252324 url('/css/cork-board.png') fixed; font-family: 'Special Elite', system-ui; font-size: 120%; line-height: 1.4em; margin: 0 auto; padding: 0; width: 100%; }

	a:active, a:hover { color: red; text-decoration: none; }


/* 	HEADER 
	====== */

	#page-header { background: #252324; margin: 0; padding: 0; width: 100%; }

	#page-header div { color: white; font-family: 'Special Elite'; letter-spacing: 0.2px; margin: 0 auto; padding: 24px 0 0 0; text-align: left;  max-width: 800px; text-shadow: #000 1px 1px 1px; }

	#page-header a { text-decoration: none; }

	#profile-pic { border: 3px white solid; box-shadow: #000 3px 3px 6px; float: left; height: 80px; margin: -16px 10px 0 -4px; transform: rotate(3deg); }

	#site-name, #site-menu { display: block; padding: 0; }

	#site-name { color: #FFF; font-size: 180%; margin: 0 0 0 100px; letter-spacing: 0.5px;  }

	#site-menu { padding: 0 0 3px 94px; position: relative; }

	#site-menu li { border: 0; display: inline-block; font-size: smaller; margin: 0; padding: 6px 7px 2px 7px; letter-spacing: 0.05px; }
	
	#site-menu li:hover { background: #000; text-shadow: none; }
	
	#site-menu li a { color: white; display: inline-block; text-align: center; }
	
	#site-menu li a:hover { text-decoration: underline; }

	#site-menu ul { display: block; margin: 0 auto; padding: 0; }

	#site-menu img { filter: invert(100%) sepia(0%) saturate(1%) hue-rotate(327deg) brightness(111%) contrast(102%); opacity: 1; height: 32px; position: absolute; top: -32px; right: 16px; display: none;  }

	
/*	FOOTER
	====== */

	#page-footer div { font-size: smaller; font-weight: 300; margin: 0 auto 0 auto; padding: 2em 40px; text-align: center; max-width: 720px; }

	#page-footer #footer-icons { display: block; margin: 0.25em auto 0 auto;  }

	#page-footer img { display: inline-block; height: 1.1em; opacity: 0.67; padding: 0 0.125em; width: auto; vertical-align: middle; }

	#page-footer img:hover { opacity: 1; }

	#footer-copyright span { font-family: Lato; }


/*	MAIN CONTENT
	============ */

	main { background: #FFF url('/css/ricepaper2.png'); border-left: rgba(0,0,0,0.67) 0.5px solid; border-right: rgba(0,0,0,0.67) 0.5px solid; box-shadow: rgba(0,0,0,0.67) 6px 6px 24px; margin: 0 auto 3em auto; max-width: 656px; padding: 16px 72px; }

	main a:active, main a:hover { text-decoration: none; }


/*	ICONS
	===== */

	a[href*="youtu"]:after { content: url('/svg/youtube.svg'); display: inline-block; width: 20px; position: relative; top: 3px; padding-left: 0.15em; opacity: 0.67; }

	li > a[href*="wikipedia"]:after, p > a[href*="wikipedia"]:after { content: url('/svg/wikipedia-w.svg'); display: inline-block; width: 12px; position: relative; top: -4px; padding: 0; opacity: 1; }
	
	img[src*="bluesky.svg"]:hover { filter: invert(36%) sepia(74%) saturate(3902%) hue-rotate(195deg) brightness(105%) contrast(101%); }

	img[src*="facebook.svg"]:hover { filter: invert(38%) sepia(31%) saturate(3357%) hue-rotate(197deg) brightness(93%) contrast(104%); }

	img[src*="flickr.svg"]:hover { filter: invert(14%) sepia(99%) saturate(6922%) hue-rotate(320deg) brightness(96%) contrast(103%); }

	img[src*="instagram.svg"]:hover { filter: invert(24%) sepia(29%) saturate(5671%) hue-rotate(291deg) brightness(98%) contrast(94%); }
	
	img[src*="mastodon.svg"]:hover { filter: invert(36%) sepia(65%) saturate(1612%) hue-rotate(221deg) brightness(98%) contrast(109%); }
	
	img[src*="rss.svg"]:hover {	filter: invert(52%) sepia(69%) saturate(1238%) hue-rotate(356deg) brightness(96%) contrast(94%); }

	#alibi-icons { margin-top: 4em; text-align: center; }

	#alibi-icons a { background-position: center !important; background-repeat: no-repeat !important; background-size: 80% !important; border: rgba(0,0,0,0.67) 0.5px solid;  border-radius: 100%; box-shadow: rgba(0,0,0,0.33) 1px 1px 1px; display: inline-block; margin: 0 0.125em; width: 64px; height: 64px; position: relative; }

	#alibi-icons a:hover { background: #FFF; box-shadow: rgba(0,0,0,0.33) 3px 3px 6px; transform: scale(1.6); transition: 0.33s ease-in-out; z-index: 50; }

	#alibi-icons + #front-icons img { height: 2em; }

	#front-icons { display: block; margin: 1.5em 0 3em 0; text-align: center !important; }

	#front-icons img, #front-photos h3 img { display: inline-block; height: 1.5em; opacity: 0.67; padding: 0 0.125em; width: auto; vertical-align: middle; }
	
	#front-icons img:hover, #front-photos h3 img:hover { opacity: 1; }

	.icon-inline { display: inline-block; height: 1em; opacity: 0.67; padding: 6px 4px; width: auto; vertical-align: bottom; }


/*	IMAGES
	====== */

	.book-cover-inline { border: rgb(0,0,0,0.67) 0.5px solid; box-shadow: rgba(0,0,0,0.67) 3px 6px 6px; float: right; width: 33%; height: auto; margin: 0.34em 0 6% 6%; }

	.book-cover-data { border: rgb(0,0,0,0.67) 0.5px solid; box-shadow: rgb(0,0,0,0.67) 3px 6px 6px; float: left; height: 96px; box-shadow: none; width: auto; margin: 4px 18px 0 0; }

	figure { margin: 2.5em 0; padding: 0; }

	figure img { border: rgba(0,0,0,0.67) 0.5px solid; background: #FFF; box-shadow: rgba(0,0,0,0.67) 6px 6px 12px; height: auto; padding: 0.5em; width: 100% }

	figure.chart img, figure.no-border img { background: none; border: none; box-shadow: none; height: auto; padding: 0 !important; }

	figure.chart img { width: 96%; }
	
	figure.tv-movie { background: #000; border: 0; color: #FFF; margin: 2em -72px 2em -72px; padding:  0;}
	
	figure.tv-movie a { color: #FFF; }
	
	figure.tv-movie img { background: #000; border: 0; box-shadow: none; margin: 0; padding: 0; width: 100% }
	
	figure.tv-movie figcaption { background: #000; border: 0; color: #FFF; margin: 0; padding: 0.5em 72px; text-align: left; }
	
	figure.image-snapshot, figure.image-pair { display: block; margin: 1.5em 0; }

	figure.image-pair img { display: inline-block; width: 46%; }

	figure.inline-right { float: right; width: 33%; margin: 0.34em 0 1em 6.67%; }

	figcaption { font-size: smaller; margin: 1em 0 0 0; }

	figcaption i, figcaption em { font-style: normal; text-decoration: underline; }


/*	TEXT ELEMENTS
	============= */

	address { display: block; font-style: normal !important; letter-spacing: 0.5px; margin: 2em 0; padding-left: 1.5em; }

	h1, h2, h3, h4 { color: rgba(0,0,0,0.67) !important; font-family: 'Special Elite'; font-weight: normal; text-shadow: #CCC 1px 1px 1px; }

	h1 { font-size: 2.4em; line-height: 1.33em; margin: 1em 0; width: 100%; }

	h2, h3 { margin-top: 1.5em; }

	h4 { text-decoration: underline; }

	h5, h6 { font-weight: normal; line-height: 1.67em; }
	
	h1 i, h1 em, h2 i, h2 em, h3 i, h3 em, h4 i, h4 em { font-style: normal; text-decoration: underline; }

	main dd, main li, main p { font-family: 'Lato', 'Verdana', -system-ui; font-weight: 400; line-height: 1.67em; }
		
	li p { font-size: 100%; }

	main strong, main b { font-weight: 500; }

	article li, .pub-list li { margin-top: 0.5em; margin-bottom: 0.5em; }

	blockquote { color: rgba(0,0,0,0.67); margin-top: 1.5em; margin-bottom: 1.5em; }

	blockquote cite { display: block; font-family: "Special Elite"; font-style: normal; line-height: 1.67em; text-align: right; margin: 0.5em 0 0 16.7%; }

	blockquote cite::before { content: "—"; }

	blockquote cite em, blockquote cite i { font-style: normal; text-decoration: underline; }

	hr { background: rgba(0,0,0,0.67); border: 0; height: 2px; margin: 3em auto; width: 10%; }

	sup { font-size: 67%; line-height: 100%; }

	table { border-bottom: rgba(0,0,0,0.33) 1px solid; border-collapse: collapse; margin: 2em 0 3em 0; padding: 0; table-layout: fixed; width: 100% }

	th, td { font-size: smaller; margin: 0; padding: 0.6em 0.3em 0.3em 0.3em; }
	
	th { border-bottom: rgba(0,0,0,0.33) 1px solid; font-weight: 500; text-align: left; text-decoration: underline; }

	td + td { text-align: right; }

	tr + tr { border-top: rgba(0,0,0,0.16) 0.5px dotted; }

	#article-date { color: rgba(0,0,0,0.67); line-height: 1.67em; margin-bottom: 3em;  }

	#article-date em, #article-date i { font-style: normal; text-decoration: underline; }

	#article-top + p::first-letter, article hr + p::first-letter, #front-bio  p::first-letter { color: rgba(0,0,0,0.67); display: block; float: left; font-family: 'Special Elite'; font-size: 6.5em; font-style: normal; font-weight: normal; padding: 0 0.05em 0.05em 0; margin: 0 0 -0.33em 0; line-height: 100%; }

	.article-teaser, #story-data { font-size: 1.1em; font-weight: 300; line-height: 1.67em; margin-bottom: 3em; text-shadow: none; }

	.bibliography li { font-size: smaller; list-style: none; margin-left: 3em; text-indent: -3em; }

	.bibliography ul { padding: 0; }

	.book-data { border-top: rgb(0,0,0,0.67) 1px solid; border-bottom: rgb(0,0,0,0.67) 1px solid; font-family: 'Lato', 'Verdana'; font-size: smaller; line-height: 1.65em; height: 120px; margin-top: 3em; padding: 16px 0 0 0; }
	
	.book-data + h3 { margin-top: 3em; }

	.book-title { font-family: 'Special Elite'; font-size: 1.3em; }

	.ext-link { height: 0.75em; width: auto; opacity: 0.67; }

	#fn + ol li { font-size: smaller; }
	
	.list-icons li { list-style: none; padding: 0; }
	
	.list-icons { padding-left: 12px; }
	
	.maps-consulted { columns: 2; column-gap: 40px; font-size: smaller; }
	
	.maps-consulted p { margin: 0 0 1em 0; }

	.postit { background: cornsilk; box-shadow: rgba(0,0,0,0.67) 6px 6px 12px; float: right; font-family: 'Rock Salt'; padding: 1em; text-align: center; transform: rotate(-5deg); width: 20%; }

	.pub-title { font-weight: 400; }

	.read-more { display: block; text-align: right !important; white-space: nowrap; }

	.read-more::before { content: ">> "; }

	.read-more::after { content: " . . ."; }
	
	.toc { margin: 2em 0; }

	.toc * { font-family: 'Special Elite'; font-size: 100%; }

	.toc * em { font-style: normal; text-decoration: underline; }

	.toc li { line-height: 1.8em; text-shadow: none; }
	
	.toc li::first-line { text-decoration: underline; }
	
	.toc li ul { margin-bottom: 1em; }

	.toc li ul li { display: inline; }

	.toc li ul li + li::before { content: " | "; } 


/* 	FRONT PAGE
	========== */

	.front-section + .front-section { margin: 3em 0 0 0; }
	
	.front-section * { font-family: 'Special Elite'; }
	
	.front-section em { font-style: normal; text-decoration: underline; }

	.front-section h2 { margin-top: 0.5em;	}

	.front-section h3 { margin-top: 0.5em; border-bottom: rgba(0,0,0,0.33) 6px double; }
	
	.front-section h3 a { color: rgba(0,0,0,0.67); text-decoration: none; }

	.front-section li { margin-bottom: 0.5em; }
	
	.front-section p, .front-section li { font-size: 96%; text-align: left; }
	
	.front-section strong { color: rgba(0,0,0,0.67) !important; text-transform: uppercase; font-weight: bold; }
		
	.front-section .pub-title { font-weight: 400; }

	#buttondown {margin: 2em auto; text-align: center !important; width: 80%; }

	#buttondown a { color: rgba(0,0,0,0.67); text-decoration: none; }	
	
	#buttondown input { border: rgba(0,0,0,0.67) 0.5px solid; box-shadow: #CCC 1px 1px 1px;; display: block; font-size: 0.8em; margin: 8px auto; padding: 16px 0 10px 0; text-align: center; width: 67%; }
	
	#buttondown input[type="submit"] { background: rgba(0,0,0,0.67); border-radius: 2em; color: #FFF; }
	
	#buttondown input[type="submit"]:hover { background: #252324; box-shadow: none; }
	
	#buttondown p { font-size: smaller; margin 0; text-align: center; }
	
	#front-photos + .front-section { margin-top: 3.33em; }
	
	#front-photos h3 img { float: right; height: 1.33em; margin-top: -0.33em; padding: 0 0 0 0.25em; }
	
	#front-photos p {  margin: 0 -40px; text-align: center; }
	
	#front-photos p img { border: rgba(0,0,0,0.67) 0.5px solid; background: #FFF; box-shadow: rgba(0,0,0,0.67) 6px 6px 12px; display: inline-block; height: auto; margin: -0.67em -0.33em; padding: 0.25em; width: 24%; }
	
	#front-publications ul { padding-left: 0; list-style: none !important; }
		
	#front-about-site p { font-size: smaller !important; }
	
	#front-essays ul { columns: 2; font-size: smaller; list-style: none; padding: 0; }
		
	#front-reviews img { border: rgba(0,0,0,0.67) 0.5px solid; box-shadow: rgba(0,0,0,0.67) 3px 3px 6px; display: inline-block; height: 128px; width: auto; }
	
	#front-reviews img:hover { transform: rotate(0deg) scale(1.33); transition: 0.33s ease-in-out; }
	
	#front-reviews li { display: inline; list-style: none; }
	
	#front-reviews ul { margin: 1em -40px; padding: 0; text-align: center; white-space: nowrap; }

	#front-reviews-1 { transform: rotate(-3deg); }

	#front-reviews-2 { margin-left: -0.33em; transform: rotate(4.5deg); }

	#front-reviews-3 { margin-left: -0.33em; transform: rotate(-4.5deg); }

	#front-reviews-4 { margin-left: -0.33em; transform: rotate(0deg); }

	#front-reviews-5 { margin-left: -0.33em; transform: rotate(-6deg); }

	#front-reviews-6 { margin-left: -0.33em; transform: rotate(4.5deg); }

	#front-reviews-7 { margin-left: -0.33em; transform: rotate(-6deg); }
	
	#front-top { margin: 0 -64px; text-align: center; white-space: nowrap; }
	
	#front-top + .front-section { margin-top: 1em; }
	
	#front-top a { border: #FFF 0.33em solid; box-shadow: rgba(0,0,0,0.67) 6px 6px 12px; color: #FFF; display: inline-block; width: 33%; height: 10em; margin: 0 -1.33em; position: relative; text-shadow: #000 3px 3px 6px; z-index: 10; }
	
	#front-top a span { position: absolute; bottom: 0.33em; left: 0.33em; }
	
	#front-top a.nopic { background: cornsilk; border-color: cornsilk; color: #000; height: 5em; margin: 0 0.5em; position: relative; top: -2em; text-shadow: none; width: 28%; z-index: 5; }

	#front-top a.nopic span { font-family: 'Rock Salt'; }


/* 	BOOK REVIEW INDEX
	================= */

	.book-reviews a  { text-decoration: none; }

	.book-reviews a[href^="http"]:before { content: url('/svg/ext-link.svg'); display: inline-block; width: 10px; height: 10px; float: left; margin-right: 0.3em; opacity: 0.8; }

	.book-reviews em { font-style: normal; text-decoration: underline; }

	.book-reviews li { break-inside: avoid; font-family: 'Special Elite'; font-size: smaller; list-style: none; margin: 0 0 0 1.5em; text-indent: -1.5em; }

	.book-reviews ul { padding-left: 0; columns: 2; column-gap: 40px; }

	#review-banner { margin: 3em 0; text-align: left; }

	#review-banner img { border: rgb(0,0,0,0.67) 0.5px solid; box-shadow: rgba(0,0,0,0.67) 3px 6px 6px; display: inline-block; margin: 0; height: 127px; width: auto; }
	
	#review-banner a + a { margin-left: 5.5px !important; }
	
	#review-copies + p + ol > li { margin-bottom: 0.5em; }


/* 	ESSAYS INDEX 
	============ */

	#essays-toc {  }

	#essays-toc a { font-weight: 400; }
	
	#essays-toc h4 { margin-left: -2em; }
	


/*	GUIDES INDEX
	============ */
	
	#guides-toc a { font-weight: bold; display: block; }

	#guides-toc a[href^="http"]:after { content: url('/svg/ext-link.svg'); display: inline-block; width: 14px; height: 14px; margin-left: 0.3em; opacity: 0.67; }

	#guides-toc li { clear: left; list-style: none; margin: 1em 0; }
	

/*	FACIT TYPEWRITER RESOURCE PAGE
	============================== */

	.typewriter-page * { font-family: 'Special Elite'; }
	
	.typewriter-page a[href*="youtu"]:after { content: none; }

	.typewriter-page h4 { font-weight: bold; margin: 2em 0 0 0; text-transform: uppercase; }

	.typewriter-page h4, .typewriter-page li, .typewriter-page p { color: rgba(0,0,0,0.8); font-size: 90%; hyphens: none; letter-spacing: 0px; line-height: 1.8em; text-shadow: none; }

	.typewriter-page li ul li { display: inline; font-size: 100%; }

	.typewriter-page li ul li + li::before { content: " | "; } 

	.typewriter-page p em  { font-style: normal; text-decoration: underline; }

	.typewriter-page p strong { color: red; font-weight: normal; margin-top: 1em; text-transform: uppercase; }
	
	.typewriter-page table td + td, .typewriter-page table th + th { text-align: center; }
	
	
/*	MEDIA QUERIES
	============= */

@media (max-width: 800px) {
	#front-reviews img { height: 120px; }
	#front-topics, #front-photos { margin-left: 0; margin-right: 0; }
	#page-header div { padding-top: 0; height: 64px; }
	#profile-pic { border: 0; box-shadow: none; margin: 0 10px 0 0; height: 64px; width: 64px; transform: none; }
	#site-menu { padding: 16px 0 0 64px; }
	#site-menu img { display: block; }
	#site-menu ul { box-shadow: #000 0px 32px 48px; display: none;  margin: 0; padding: 0; width: 136px; }
	#site-menu li { background: #252324; border-top: #FFF 0.5px dotted; display: block; }
	#site-name { margin: 0 0 0 80px; padding-top: 22px; }
}

@media (max-width: 720px) {
	main { padding: 16px 48px; }
	#front-reviews img { height: 96px; }
}

@media (max-width: 640px) {

	#buttondown input { width: 80%; }
	.book-reviews ul, .maps-consulted { columns: 1; }
	#front-reviews img { height: 80px; }
	#front-topics a { display: block; margin: 0.5em auto; width: 90%; transform: rotate(0deg) !important; }
}

@media (max-width: 480px) {

	main { border: 0; padding: 16px 24px; }
	h1 { font-size: 200%; line-height: 100%; }
	#buttondown input { width: 96%; }
	#front-reviews img { height: 64px; }
	#front-essays ul { columns: 1; }
	#page-footer div { border: 0; margin: 0; padding: 2em 24px; }
	#site-name { font-size: 120%; }
	#alibi-author-pages a { height: 120px; width: 120px; }
	.book-cover-inline { display: block; float: none; width: 240px; margin: 0 0 2em 0; }
	li .book-cover-inline { display: none; }
	.book-data { font-size: smaller; height: 112px; letter-spacing: -0.5px; line-height: 1.5em; white-space: nowrap; overflow: hidden; }
	.book-cover-data { height: 88px; margin: 2px 10px 0 0; }
	figure img { padding: 0.3em}
	figure.tv-movie { margin: 2em -25px 2em -25px; }
	figure.tv-movie figcaption { padding-left: 25px; }
	
}