/*
Theme Name: WPL-Ombre - Book Recs version
Theme URI: westmontlibrary.org
Description: WPL Ombre BR - Child of WPL Ombre
Template: WPL-Ombre
Version: 251118
Author: K Barnett
Author URI: westmontlibrary.org
*/

@charset "utf-8";

@font-face {
font-family: "wplicons";
	src:	url("/WPLicons/wplicons3.woff") format("woff");
}

/* COLORS */

/* logo dark blue		rgba(57,65,77,1);	#38414c; */
/* logo grey			rgba(57,65,77,1);	#555d61; */

/* body bkg			rgba(241,241,241,1);	#f1f1f1; */
/* wrapper bkg			rgba(248,248,248,1);	#f8f8f8; */

/* lilac 			rgba(146,136,207,1);	#9288cf; */
/* violet			rgba(135,148,204,1);	#8794cc; */
/* periwinkle			gba(132,165,226,1);	#84a5e2; */
/* blue				rgba(112,180,239,1);	#70b4ef; */
/* cyan				rgba(88,189,223,1);	#58bddf; */

/* minim HEADER - blog vers */
	
	#wpllogoblock {
		height: 6rem;
		margin-top: -0.5rem;
	}
		/*---- mobile ----*/
		@media screen and (max-device-width: 640px) {
			#wpllogoblock {
				position: absolute;
			}
		}

	#search-container {
		margin-top: 4.5rem;
		right: 0;
		padding: 1rem;
		background-color: white;
		display: none;
	}

#wrapper {
	background: rgb(248,248,248);
	background-size: cover;
	background-position: 62% center;
}

/*---- desktop narrow ----*/
	@media screen and (min-device-width: 1024px) and (max-width: 1300px) {
		#wrapper {
			width: 100%;
		}
	}

#its_header {
	position: relative;
	width: 100%;
	margin:0;
	padding:2rem 0 1rem 0;
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	gap:1.5rem;
	align-items:center;
}

	/*---- mobile ----*/
	@media screen and (max-width: 640px) {
		#its_header {
			flex-direction:column;
			
		}
		#its_header img {
			width: 80%;
		}
	}

#its_header > a {
	display: inline-block;
	width: 18%;
	float: left;
	padding: 1rem 2rem 0 0;
	
	width:unset;
	float:none;
	flex-basis:20%;
	padding:0;
	max-width:12rem;
	min-width:8rem;
	
	flex-shrink:1;
}

	/*---- mobile ----*/
	@media screen and (max-width: 640px) {
			#its_header > a {
				display: block;
				width: 70%;
				margin: 0 auto 1rem auto;
				padding: 0;
				float: none;
			}
	}
	

#its_header > a img {
	width: 100%;
}

/*---- mobile ----*/
	@media screen and (max-device-width: 1023px) {
			#main-container {
				padding: 0 1rem;
			}
	}

#full-container {
	display: block;
	position: relative;
	float: none;
	clear: both;
	background:none;
}

/* POSTS - HOME, ARCHIVE, or CATEGORY */


/*--------------------- begin new RA styles -----------------------*/

#searchform-br-container {
	display: inline-block;
	width: 82%;
	
	position:relative;
	flex-basis:80%;
	display:flex;
	flex-direction:column;
	
	/*max-width:45rem;*/
	flex-grow:1;
	padding:1rem;
	background:#f8f8f8;
}

	/*---- mobile ----*/
	@media screen and (max-width: 640px) {
			#searchform-br-container {
				position: relative;
				width: 100%;
			}
	}


form#searchform-br {
	display:flex;
	position:relative; /* so we can move search button on mobile */
	flex-direction:column;
	gap:0.5rem;
	align-items:flex-start;
	
	align-items:flex-end;
}

	/*---- mobile ----*/
	@media screen and (max-width:1024px) {
		form#searchform-br {
			align-items:center;
		}
	}

#searchform-br div.searchbar {
	position: relative;
	
	width: 100%;
	
	
	margin:0;
	display:flex;
	flex-direction:row;
	align-items:center;
	gap:0.5rem;
}



#searchform-br label {
	display: inline-block;
	font-weight:bold;
}


#searchform-br div.searchbar label {
	
}

#searchform-br input[type="text"] {
	width: 100%;
}

#searchform-br button#searchsubmit {
	font-size: 1.25rem;
	background: rgb(13,19,35);
	background:#38414c;
	color: white;
	cursor: pointer;
	padding:0.4rem;
	font-family:wplicons;
	border:0;
	min-width:unset;
}

/*---- mobile ----*/
	@media screen and (max-width: 1024px) {
		#searchform-br button#searchsubmit {
			position:absolute;
			right:0;
			top:0;
			
		}
	}

#searchform-br button#searchsubmit:hover,
#searchform-br button#searchsubmit:focus-visible {
	background:#c93818;
}

div.facets-and-searchsubmit {
	display:flex;
	flex-direction:row;
	gap:0.5rem;
	align-items:center;
}

	/*---- mobile ----*/
	@media screen and (max-width:1024px) {
		div.facets-and-searchsubmit {
			flex-direction:column;
		}
	}

div.show-facets {
	display: none;
	text-align: center;
	margin:0;
}

div.show-facets button {
	display: inline-block;
	padding: 0.25rem 0.5rem;
	border-radius: 0.25rem;
	background: #0073bb;
	color: white;
	font-size: 1rem;
	font-family:ProbaPro, Calibri, sans-serif;
}

/*---- mobile ----*/
	@media screen and (max-width: 1024px) {
		div.show-facets {
			display: block;
		}
	}

div.facets {
	display:flex;
	flex-direction:row;
	gap:0.75rem;
}

/*---- mobile ----*/
	@media screen and (max-width: 1024px) {
		div.facets {
			width: 100%;
			display: none;
		}
	}


.select-container {
	margin: 0;
	padding: 0.5rem;
	background: rgba(0,0,0,0.05);
	
	display:flex;
	flex-direction:row;
	gap:0.25rem;
	align-items:center;
	padding:0;
	background:none;
}

	/*---- mobile ----*/
	@media screen and (max-width:1024px) {
		.select-container {
			margin:0 0 0.25rem 0;
		}
	}

	/*---- mobile ----*/
	/* labels for facets only */
	@media screen and (max-width:1024px) {
		#searchform-br .select-container label {
			width:4rem;
		}
	}

.select-container select {
	display: inline-block;
	font-weight:400;
	font-size:0.9rem;
}

	/*---- mobile ----*/
	@media screen and (max-width: 1024px) {
		.select-container select {
			width: 100%;
			max-width:20rem;
		}
	}

/*----------------------- current search values ------------------------*/

div.current-search {
	display: flex;
	flex-direction:row;
	flex-wrap:wrap;
	align-items:center;
	gap:0.5rem;
	margin: 1rem 0;
}

div.current-search h1 {
	width:100%;
}

div.current-search > p {
	display:inline-block;
}

ul.search-list {
	display: flex;
	flex-direction:row;
	flex-wrap:wrap;
	justify-content:flex-start;
	align-items:center;
	gap:0.25rem;
}

ul.search-list li {
	display:inline-block;
	margin:0;
	padding:0.333rem 0.333rem 0.333rem 0.5rem;
	
	padding:0.333rem 2.5rem 0.333rem 0.5rem;
	position:relative;
}



ul.search-list li p {
	color:#ffffff;
}

ul.search-list li.s {
	background: #38414c;
}

ul.search-list li.author-archive,
ul.search-list li.author {
	background: navy;
}

ul.search-list li a {
	display:inline-block;
	text-decoration:none!important;
	
	position:absolute;
	top:0;
	left:0;
	display:flex;
	flex-direction:row;
	justify-content:flex-end;
	align-items:center;
	width:100%;
	height:100%;
}

ul.search-list li a span.utility-right-align {
	padding:0 0.333rem 0 0;
}

ul.search-list a .wplicons {
	color:#ffffff;
	font-size: 0.8rem;
	font-weight:bold;
	border:none;
	border-radius:100%;
	padding:0.333rem;
}

ul.search-list a:hover .wplicons,
ul.search-list a:focus-visible .wplicons {
	background:#ffffff;
	color:#38414c;
}

/*------------------------ SINGLE POST --------------------- */
.post-ra {
	margin:2rem 0;
	background: white;
	box-shadow: 0.25rem 0.25rem 0.5rem -0.25rem rgba(0,0,0,0.25);
}

.post-header {
	width: 100%;
	margin: 0;
	padding: 0;
	text-align: left;
	background-position: center center;
	background-size: cover;
}

.post-header-overlay {
	position: relative;
	width: 100%;
	height: 100%;
	padding: 2rem;
	background: rgba(0,0,0,0.6);
}

.post-header .post-header-overlay {
	min-height: 18rem;
	display:flex;
	flex-direction:column;
	justify-content:flex-end;
}

/*---- mobile ----*/
	@media screen and (max-width: 640px) {
		.post-header-overlay {
			padding: 1rem;
		}
	}

.post-header h1, 
.post-header h2 {
	display: inline-block;
	color: white;
	border: 0;
	margin: 0 10rem 0 0;
	
	display:flex;
	flex-direction:column;
	align-items:flex-start;
}

/*---- mobile ----*/
	@media screen and (max-width: 640px) {
		.post-header h1, 
		.post-header h2 {
			margin: 0;
		}
	}

.post-header h1 {
	font-size: 2.5rem;
	/*padding-top: 0.25rem;*/
}

	/*---- mobile ----*/
	@media screen and (max-width: 640px) {
		.post-header h1 {
			font-size: 2rem;
		}
	}
	
.post-header h1 span {
	padding: 0.25rem 0.75rem;
	background: #38414cdd;
}

/* defunct? 1-31-25 */
.post-header h2 {
	padding-bottom: 0.5rem;
}

ul.rating-list {
	height: 1.5rem;
	width: 100%;
	margin: 1rem 0 0 0;
}


.rating-list li.stars {
	height: 1.5rem;
	width: 1.5rem;
	display: inline-block;
	padding: 0 !important;
	margin: 0 1rem 0 0;
	opacity: 0.4;
	vertical-align: middle;
}

	/*---- mobile ----*/
	@media screen and (max-width: 640px) {
		.rating-list li.stars {
			margin: 0 0.333rem;
		}
	}

.rating-list li.stars::before {
	display: none !important;
}

.rating-list li.stars.opaque {
	opacity: 1;
}

.rating-list li.stars img {
	height: 100%;
	width: 100%;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 0;
	vertical-align: middle;
}

ul.genre-list {
	display: flex;
	flex-direction:row;
	flex-wrap:wrap;
	gap:0.25rem;
}

ul.genre-list li {
	display: inline-block;
	/*padding: 0.6666rem 1rem;
	float: left;*/
	color: white;
	
	padding:0;
}

	/*---- mobile ----*/
	@media screen and (max-width: 640px) {
		ul.genre-list li {
			
		}
	}

ul.genre-list li strong {
	color: white;
}

ul.genre-list li a {
	color: white;
	display:inline-block;
	padding:0.25rem 0.5rem;
}

ul.genre-list li a:hover,
ul.genre-list li a:focus-visible {
	background:#0073bb;
}

/* is this used for anything? maybe search? */
ul.genre-list .wplicons {
	vertical-align: top;
}

.post-content {
	display: block;
	width: 100%;
	float: none;
	clear: both;
	
	display:flex;
	flex-direction:column;
	padding:3rem;
	gap:2rem; /* between review-and-sidebar and personal-recs-container */
}

@media screen and (max-width:1024px) {
	.post-content {
		padding:1.5rem;
		gap:2rem;
	}
}

.review-and-sidebar {
	display:flex;
	flex-direction:row;
	gap:4rem; /* between review and sidebar-container */
}

@media screen and (max-width:1024px) {
	.review-and-sidebar {
		flex-direction:column;
		gap:2rem;
	}
}

.review {
	display: inline-block;
	
	width:unset;
	flex-basis:70%;
	padding:0;
	flex-grow:1;
}

	/*---- mobile ----*/
	@media screen and (max-width: 1024px) {
		.review {
			display: block;
			width: 100%;
		}
	}


.listformat .review {
	width: 100%;
	float: none;
}

div.book-cover {
	float: left;
	margin: 0 2rem 2rem 0;
}

	/*---- mobile ----*/
	@media screen and (max-width: 640px) {
		div.book-cover {
			float: none;
			margin: 0 0 1rem 0;
		}
	}

div.book-cover img {
    display: block;
    height: 20rem;
    width: initial;
	box-shadow: 0.125rem 0.125rem 0.0625rem 0.0625rem gainsboro;
}

/*---- mobile ----*/
	@media screen and (max-width: 1024px) {
		div.book-cover img {
			height: 14rem;
		}
	}

/*---- mobile ----*/
	@media screen and (max-width: 640px) {
		div.book-cover img {
			width: 100%;
			height: auto;
		}
	}

.review p a,
.review h3 a,
.review h2 a,
.review a p,
.review a h3,
.review a h2 {
	color: rgb(0,120,170);
	border-bottom: 1px solid rgb(88,189,223);
}

.post-content h3 + p,
.post-content h2 + p,
.post-content p + p {
	margin-top: 1rem;
}

hr {
	clear: both;
	margin: 2rem 0;
}


.sidebar-container {
	display: flex;
	flex-direction:column;
	gap:2rem; /* between sidebars */

	flex-grow:1;
	padding:0;
	
	flex-basis:25%;
}

	/*---- mobile ----*/
	@media screen and (max-width: 1024px) {
		.sidebar-container {
			width: 100%;
		}
	}

	
.sidebar {
	background: white;
	padding: 1rem;
	margin: 0;
	background: #f8f8f8 !important;
	border-top: 0.35rem solid #dcdcdc;
	box-shadow: 0.25rem 0.25rem 0.5rem -0.25rem #dcdcdc;
}

.sidebar h2 {
	margin: 0 0 0.5rem 0;
	font-size:1.222rem;
}

ul.format-list {
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	margin:0 1rem;
}

	/*---- mobile ----*/
	@media screen and (max-width: 1024px) {
		ul.format-list {
			column-width:12rem;
		}
	}

ul.format-list li {
	margin: 0 0.25rem 0.35rem 0;
	padding: 0.25rem 0.75rem;
	border-radius:1rem;
	list-style: none;
	color: white;
	display: inline-block;
	
	display:list-item;
	color:#38414c;
	background:transparent !important;
	margin:0.25rem;
	padding:0;
	border-radius:0;
	list-style:disc;
}

ul.format-list li::marker {
	color:#1f9ae5;
}

/* get this title */
.sidebar.format p.link {
	margin:1rem 0 0 0;
}

.sidebar.format p.link a {
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	align-items:center;
	gap:0.5rem;
}

.personal-recs-container {
	margin: 0;
	padding: 2rem;
	background: #f8f8f8 !important;
	border-top: 6px solid;
	box-shadow: 0.25rem 0.25rem 0.5rem -0.25rem #dcdcdc;
}

.personal-recs-container p:first-of-type {
	font-weight:bold;
	font-size:1.222rem;
}

.post-footer {
	display: block;
	float: none;
	clear: both;
	margin: margin: 0 0 2rem 0;
	padding: 0;
	background: #38414c;
	background-size: cover;
	background-position: center center;
	background-blend-mode:multiply;
}

.post-footer .date-container {
	display:flex;
	flex-direction:row;
	gap:1rem;
	align-items:center;
}

.post-footer p,
.post-footer a {
	color: white !important;
}

.date {
	display: inline-block;
	font-size: 0.9rem;
}

.author-image {
	display: inline-block;
	height: 6rem;
	width: 6rem;
	margin:-3rem 0;
	border-radius: 50%;
	background: white;
	box-shadow: 0 0 0.25rem 0 rgba(0,0,0,0.25);
}

.author-image img {
	margin:0 !important;
	float:none !important;
}

.normal-weight {
	font-weight: normal;
}

.gainsboro {
	color: gainsboro !important;
}




.post.hide {
	/*display: none;*/
}

/*------ ageranges ------ */

.adult {
	background:#3c6eb6;
	border-color:#3c6eb6;
}

.board-book-ages-0-3 {
	background:#bb4688;
	border-color:#bb4688;
}

.picture-book {
	background:#c64f29;
	border-color:#c64f29;
}

.early-reader-gr-1-2 {
	background:#6e00a0;
	border-color:#6e00a0;
}

.beginning-chapter-gr-2-3 {
    background:#538307;
	border-color:#538307;
}

.intermediate-chapter-gr-3-5 {
    background:#1e8843;
	border-color:#1e8843;
}

.middle-grade-gr-5-8 {
	background:#783bb5;
	border-color:#783bb5;
}

.teen-gr-6-12,
.young-adult,
.young-adults {
	background:#027b8f;
	border-color:#027b8f;
}

.youth-teen-multiple-ages {
	background:#8e2689;
	border-color:#8e2689;
}

.no-age {
	background: rgb(160,0,130);
	border-color: rgb(160,0,130);
}

/* ------ genres ------ */

.adventure-thriller,
.action-adventure,
.espionage-and-terrorism,
.survival-stories,
.war-stories {
	background:#960096 !important;
}

.post-header-overlay.adventure-thriller {
	background:#96009699 !important;
}

.contemporary,
.abuse,
.animals-contemporary,
.art-music,
.coming-of-age,
.cooking-food,
.crimes-legal-issues,
.death,
.disability-illness,
.drugs-alcohol,
.ethnic-racial-identity,
.faith-religion,
.family,
.fostering-adoption,
.friendship,
.gender-sexual-identity,
.homelessness-runaways,
.lgbtq,
.mental-illness,
.contemporary-politics-government,
.social-political-activism,
.sports-games,
.teen-pregnancy-parenting,
.theater,
.violence-bullying,
.contemporary-war,
.social-justice
 {
	background:#2a43bb !important;
}

.post-header-overlay.contemporary {
	background:#2a43bb99 !important;
}

.fantasy,
.fantasy-alternate-worlds,
.animals,
.epic-fantasy,
.fairy-tales,
.magic-and-wizards,
.fantasy-superheroes,
.myth-legend,
.urban-fantasy {
    background:#12873b !important;
}

.post-header-overlay.fantasy {
	background:#12873b99 !important;
}

.historical,
.mystery-historical,
.history,
.romance-historical,
.twentieth-century,
.twentieth-century-north-america,
.age-of-exploration,
.ancient,
.biblical,
.industrial-revolution,
.middle-ages,
.pre-1900s-north-america
 {
	background:#005050 !important;
}

.post-header-overlay.historical {
	background:#00505099 !important;
}

.humor,
.dark-comedy,
.satire,
.slapstick,
.spoof,
.contemporary-humor,
.humorous-horror {
    background:#df2a5c !important;
}

.post-header-overlay.humor {
	background:#df2a5c99 !important;
}

.multicultural,
.africa,
.african-american,
.americans-abroad,
.asia,
.asian-american,
.australia-new-zealand,
.europe,
.latin-america,
.latino-american,
.native-american,
.north-america,
.south-america {
	background:#9e0000 !important;
}

.post-header-overlay.multicultural {
	background:#9e000099 !important;
}

.mystery,
.mystery-contemporary,
.crime-and-law,
.suspense,
.cozy {
	background:#8c005e !important;
}

.post-header-overlay.mystery {
	background:#8c005e99 !important;
}

.nonfiction,
.animals-pets,
.anthology,
.arts-culture,
.biography-memoir,
.diy-crafts,
.economics-social-sciences,
.essays,
.health-medicine,
.language-literature,
.nonfiction-politics-government,
.religion,
.science,
.technology,
.nonfiction-war,
.environmental {
	background:#1e3c64 !important;
}

.post-header-overlay.nonfiction {
	background:#1e3c6499 !important;
}

.paranormal-horror,
.angels-demons,
.ghosts,
.occult,
.out-of-body-experiences,
.psionic-powers,
.superheroes,
.unexplained-phenomena,
.vampires,
.werewolves,
.zombies {
	background:#141414 !important;
}

.post-header-overlay.paranormal-horror,
.post-header-overlay.paranormalhorror {
	background:#14141499 !important;
}

.romance,
.romance-contemporary,
.romance-romance
 {
	background:#c80028 !important;
}

.post-header-overlay.romance {
	background:#c8002899 !important;
}

.play-and-learning {
	background:#005ac8 !important;
}

.post-header-overlay.play-and-learning {
	background:#005ac899 !important;
}

.science-fiction,
.aliens,
.science-fiction-alternate-worlds,
.bioengineering,
.cyberpunk,
.dystopia-utopia,
.hard-sci-fi,
.post-apocalyptic,
.space,
.steampunk,
.science-fiction-time-travel,
.virtual-reality,
.fantasy-time-travel,
.robots
 {
	background:#480880 !important;
}

.post-header-overlay.science-fiction {
	background:#48088099 !important;
}


.short-stories {
	background:#5a7000 !important;	
}

.post-header-overlay.short-stories {
	background:#5a700099 !important;
}

.genre {
	opacity: 0.9; 
}


/*--- Formats ---*/

.book,
.graphic-novel,
.ebook-hoopla,
.ebook-libby,
.ebook-overdrive,
.graphic-novel-comics-plus,
.graphic-novel-hoopla,
.graphic-novel-libby,
.graphic-novel-overdrive {
	background:#6f55c4;
}

ul.format-list li.book::marker,
ul.format-list li.graphic-novel::marker,
ul.format-list li.ebook-hoopla::marker,
ul.format-list li.ebook-libby::marker,
ul.format-list li.ebook-overdrive::marker,
ul.format-list li.graphic-novel-comics-plus::marker,
ul.format-list li.graphic-novel-hoopla::marker,
ul.format-list li.graphic-novel-libby::marker,
ul.format-list li.graphic-novel-overdrive::marker {
	color:#6f55c4;
}

.audiobook,
.audiobook-hoopla,
.audiobook-overdrive,
.audiobook-libby,
.playaway-audiobook {
	background:#2a845b;
}

ul.format-list li.audiobook::marker,
ul.format-list li.audiobook-hoopla::marker,
ul.format-list li.audiobook-overdrive::marker,
ul.format-list li.audiobook-libby::marker,
ul.format-list li.playaway-audiobook::marker {
	color:#2a845b;
}

.music,
.music-cd,
.music-hoopla,
.music-libby,
.music-overdrive {
	background:#ba3bba;
}

ul.format-list li.music::marker,
ul.format-list li.music-cd::marker,
ul.format-list li.music-hoopla::marker,
ul.format-list li.music-libby::marker,
ul.format-list li.music-overdrive::marker {
	color:#ba3bba;
}

.movie,
.movie-dvd,
.movie-hoopla,
.movie-kanopy,
.movie-libby,
.movie-overdrive,
.tv-series,
.tv-series-dvd,
.tv-series-hoopla,
.tv-series-kanopy,
.tv-series-libby,
.tv-series-overdrive {
	background:#d63e05;
}

ul.format-list li.movie::marker,
ul.format-list li.movie-dvd::marker,
ul.format-list li.movie-hoopla::marker,
ul.format-list li.movie-kanopy::marker,
ul.format-list li.movie-libby::marker,
ul.format-list li.movie-overdrive::marker,
ul.format-list li.tv-series::marker,
ul.format-list li.tv-series-dvd::marker,
ul.format-list li.tv-series-hoopla::marker,
ul.format-list li.tv-series-kanopy::marker,
ul.format-list li.tv-series-libby::marker,
ul.format-list li.tv-series-overdrive::marker {
	color:#d63e05;
}

.video-game {
	background:#cd3c23;
}

ul.format-list li.video-game::marker {
	color:#cd3c23;
}


/* --- star ratings (for search) --- */
.search-list li.rating {
	background: rgb(60,60,60);
}


/* ----------- INDIVIDUAL POST -------------- */
.post-ra img.aligncenter,
.post-ra img.alignleft,
.post-ra img.alignright,
.post-ra img.alignnone {
	float: left;
	clear: left;
	margin: 0 2rem 2rem 0;
}

.post-ra.listformat img.alignleft,
.post-ra.listformat img.alignright,
.post-ra.listformat img.aligncenter,
.post-ra.listformat img.alignnone:not(.avatar) {
	height: auto;
	width: 12rem;
	margin: 0 1rem 1rem 0;
}

	/*---- mobile ----*/
	@media screen and (max-device-width: 767px) {
		.post-ra.listformat img.alignleft,
		.post-ra.listformat img.alignright,
		.post-ra.listformat img.aligncenter,
		.post-ra.listformat img.alignnone:not(.avatar) {
			width: 100%;
		}
	}

.packery-container {
	position: relative;
	height: 100%;
	display: block;
	width: 100%;
	margin: 2rem 0;
}


.post-excerpt {
	display:flex;
	flex-direction:column;
	/* subtract (gutter * (col-1)/col) but then rounded up for this and down for wide one so like for 5 cols it's (4/5)gutter */
	width: calc( 25% - 27px ); /* 36 gutter */
	padding: 0;
	margin: 0;
	background: white;
	box-shadow: 0.25rem 0.25rem 0.5rem -0.25rem rgba(0,0,0,0.25);
}

/*---- mobile ----*/
	@media screen and (max-device-width: 640px) {
			.post-excerpt {
				width: 100%;
			}
	}
/*---- tablet ----*/
	@media screen and (min-device-width: 641px) and (max-device-width: 1023px) {
			.post-excerpt {
				/* subtract (gutter * (col-1)/col) but then rounded up for this and down for wide one so like for 5 cols it's (4/5)gutter */
				width: calc( 50% - 18px ); /* 36 gutter */
			}
	}


.post-excerpt h1 a {
	
}

.post-excerpt .excerpt-author {
	opacity: 0.9;
	display:block;
	margin:0.25rem 0 0 0;
	font-size:1.111rem;
	font-weight:400;
}

.post-excerpt-img {
	position: relative;
	display: block;
	height: auto;
	width: 100%;
}

/*---- mobile ----*/
	@media screen and (max-device-width: 640px) {
		.post-excerpt-img {
			display: block;
			width: 100%;
			/*height: 12rem;*/
			/*background-size: cover;
			background-repeat: no-repeat;
			background-position: top center;*/
			
			/*display: inline-block;
			width: 40%;
			height: 100%;
			float: left;*/
			
			height: auto;
		}
	}

.post-excerpt-img img {
	display: block;
	width: 100%;
	height: auto;
}

.post-excerpt-text {
	display: block;
	height: auto;
	width: 100%;
	vertical-align: top;
}

/*---- mobile ----*/
	@media screen and (max-device-width: 640px) {
		.post-excerpt-text {
			display: block;
			width: 100%;
			
			/*display: inline-block;
			width: 60%;*/
		}
	}

.post-excerpt-content {
	display: block;
	width: 100%;
	padding: 1rem;
	clear: both;
}


.post-excerpt.packery-item div.genre-container {
	position: relative;
	margin:0.5rem 0;
}

.post-excerpt ul.genre-list {
	
}

.post-excerpt ul.genre-list li {
	height: 100%;
}

.post-excerpt .genre-list p,
.post-excerpt .genre-list li,
.post-excerpt .genre-list strong,
.post-excerpt .date-container p {
	font-size: 0.9rem;
}

.post-excerpt p a {
	color: rgb(0,120,170);
	border-bottom: 1px solid rgb(88,189,223);
}

.post-excerpt h1,
.post-excerpt h2 {
	display: inline-block;
	margin: 0 0 0.75rem 0;
	font-size: 1.333rem;
}

.post-excerpt h1 a,
.post-excerpt h2 a {
	color: #38414c;
}

.post-excerpt h1 a:hover,
.post-excerpt h1 a:focus-visible,
.post-excerpt h2 a:hover,
.post-excerpt h2 a:focus-visible {
	color: #0073bb;
	text-decoration:underline solid 2px;
}

.post-excerpt ul.rating-list {
	margin: 0;
}

.post-excerpt .post-excerpt-img ul.rating-list {
	position: relative;
	height: 2rem;
	width: 100%;
	padding: 0.333rem 0;
	bottom: 0;
	float: none;
	text-align: center;
	background: rgba(0,0,0,0.8);
}



.post-excerpt ul.rating-list li.stars {
	height: 1rem;
	width: 1rem;
	margin: 0 0.5rem 0 0;
}

/*---- mobile ----*/
	@media screen and (max-device-width: 640px) {
		.post-excerpt ul.rating-list {
			float: none;
		}
		
		/* regular post only */
		.post-excerpt .post-excerpt-img ul.rating-list {
			position: relative;
		}
		
		/* regular post only */
		.post-excerpt .post-excerpt-img ul.rating-list li.stars {
			height: 0.75rem;
			width: 0.75rem;
			margin: 0 0.125rem 0 0.125rem;
		}
	}

.post-excerpt .date-container {
	margin: 1rem 0 0 0;
	padding: 0.5rem 0 0 0;
	border-top: 1px solid #dcdcdc;
}

/*---- mobile ----*/
	@media screen and (max-width: 640px) {
		.post-excerpt.packery-item .date-container {
			
		}
	}

.post-excerpt .date {
	color: #666666;
}


/* ----------- packery featured ---------- */
.featured-container {
	position: relative;
	display: block;
	width: 100%;
	margin: 2rem 0;
	padding: 2rem;
	border-top: 1px solid gainsboro;
	border-bottom: 1px solid gainsboro;
}

/*---- mobile ----*/
	@media screen and (max-device-width: 640px) {
			.featured-container {
				margin: 1rem 0;
				padding: 2rem 0;
			}
	}

.featured-item {
	display: inline-block;
	width: calc( 50% - 22px );
	vertical-align: top;
}

/* "I'm stumped!" aka no search results */
.featured-item.centered {
	display: block;
	width: 50%;
	height: 20rem;
	padding: 1rem;
}

/*---- mobile ----*/
	@media screen and (max-device-width: 640px) {
			.featured-item {
				display: block;
				width: 100%;
			}
	}
	
/*---- tablet ----*/
	@media screen and (min-device-width: 641px) and (max-device-width: 1023px) {
			.featured-item {
				display: block;
				width: 100%;
			}
	}


.featured-item:first-of-type {
	margin: 0 2rem 0 0;
}

/* "I'm stumped!" aka no search results */
.featured-item.centered {
	margin: 0 auto;
}

/*---- mobile ----*/
	@media screen and (max-device-width: 640px) {
			.featured-item:first-of-type {
				margin: 0 0 2rem 0;
			}
	}
/*---- tablet ----*/
	@media screen and (min-device-width: 641px) and (max-device-width: 1023px) {
			.featured-item:first-of-type {
				margin: 0 0 2rem 0;
			}
	}

.featured-item .genre-container {
	height: 2.1rem;
	overflow: hidden;
}

.post-excerpt.featured-item ul.genre-list li {
	height: 100%;
	padding: 0.5rem 0.75rem;
}

/* featured only */
.post-excerpt-header {
	display: block;
	width: 100%;
	padding: 0.777rem 1rem;
	background: #0d1323;
}

/* featured only */
.post-excerpt .post-excerpt-header h1 {
	font-size: 1.333rem;
	margin: 0;
}

/* featured only */
.post-excerpt .post-excerpt-header h1 a {
	color: white;
}

.featured-item .post-excerpt-img {
	display: table-cell;
	width: 13rem;
}

/*---- mobile ----*/
	@media screen and (max-device-width: 640px) {
			.featured-item .post-excerpt-img {
				display: block;
				width: 100%;
				height: auto;
				border: 1rem solid white;
			}
	}
/*---- tablet ----*/
	@media screen and (min-device-width: 641px) and (max-device-width: 1023px) {
			.featured-item .post-excerpt-img {
				width: 10rem;
			}
	}
	
.featured-item .post-excerpt-img img {
	height: auto;
	width: 13rem;
}

/*---- mobile ----*/
	@media screen and (max-device-width: 640px) {
			.featured-item .post-excerpt-img img {
				display: block;
				width: 100%;
				height: auto;
			}
	}
/*---- tablet ----*/
	@media screen and (min-device-width: 641px) and (max-device-width: 1023px) {
			.featured-item .post-excerpt-img img {
				width: 10rem;
			}
	}

.featured-item .post-excerpt-text {
	display: table-cell;
}

/* "I'm stumped!" aka no search results */
.featured-item.centered .post-excerpt-text {
	vertical-align: middle;
}

/*---- mobile ----*/
	@media screen and (max-device-width: 640px) {
			.featured-item .post-excerpt-text {
				display: block;
				width: 100%;
			}
	}

/*---- mobile ----*/
	@media screen and (max-device-width: 640px) {
		.featured-item .post-excerpt-content {
			padding: 0 1rem 0.777rem 1rem;
		}
	}	
	
.featured-item p {
	font-size: 1rem;
} 



/* --- container for pagination nav --- */
.posts-link {
	position: relative;
	display: block;
	height: 10rem;
	width: 10rem;
	margin: 0 auto 2rem auto;
	padding: 1.75rem;
	border-radius: 50%;
	text-align: center;
	background: rgb(13,19,35);
	box-shadow: 0 0.25rem 0.75rem -0.25rem grey;
	transition: 500ms;
}

.posts-link div {
	margin-top: 50%;
	transform: translateY(-50%);
}

.next-posts-link,
.previous-posts-link {
	margin: 0;
	padding: 0;
	text-align: center;
	vertical-align: middle;
}

/* use the same link styles as footer */
.posts-link a {
	color: white!important;
	text-decoration:underline solid #1f9ae5 2px !important;
	text-underline-offset:2px!important;
}

/* use the same hover/focus styles as footer */
.posts-link a:hover,
.posts-link a:focus-visible {
	color: white!important;
	text-decoration:underline solid #1f9ae5 2px !important;
	background:#0073bbaa!important;
}

.posts-link a:focus-visible {
	background:#0073bbaa!important;
	outline:2px solid #ffffffaa;
}

.posts-link .wplicons {
	vertical-align: middle;
}


#footer-container {
	position: relative;
		
}