@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&family=Special+Elite&display=swap');
:root {
	--font-Headings: "Cormorant Garamond", serif;
	--font-main: "Special Elite", monospace;
	--font-accent: "Cormorant Garamond", serif;
	--color-primary: #6F3B56;
	--color-secondary: #A94F5C;
	--color-accent: #C99A3D;
	--color-light-accent: #D8A7A0;
	--color-muted-accent: #7D8763;
	--color-body-text: #383337;
	--color-background-light: #FDFDFD;
	--color-dark-bg: #4A3040;
	--color-dark-bg-rgb: 74, 48, 64;
	--color-soft-bg: #f5eef1;
	--btn-radius: 1px 1px 1px 1px;
}
html {
	position: relative;
	min-height: 100%;
	scroll-behavior: smooth;
}
body {
	position: relative;
	font-family: var(--font-main);
	font-size: 22px;
	color: var(--color-body-text);
	font-weight: 400;
	opacity: 0;
	overflow-x: hidden;
	animation-name: fadeInB;
	animation-iteration-count: 1;
	animation-duration: 3s;
	animation-delay: 1;
	animation-fill-mode: forwards;
	background-color: var(--color-background-light);
}
main {
	flex: 1 0 auto;
	min-height: auto;
	background-color: var(--color-background-light);
	position: relative;
	z-index: 150;
}
@keyframes fadeInB {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
#Main {
	position: relative;
	padding-top: 80px;
	padding-bottom: 80px;
}
.MainAjust {
	padding-top: 0px !important;
}
#Main img, #homeMain img {
	max-width: 100% !important;
	height: auto !important;
}
#Main img.noImgStyle, #homeMain img.noImgStyle {
	border-radius: 0 !important;
	box-shadow: none !important;
}
@media(max-width:768px) {
	#Main img, #homeMain img {
		float: none !important;
		display: block !important;
		margin-left: auto !important;
		margin-right: auto !important;
	}
	#Main {
		width: 100%;
	}
}
img[src="https://www.paypal.com/en_US/i/scr/pixel.gif"] {
	display: none;
}
#Main .breakWidth {
	width: 90vw;
	position: relative;
	margin-left: -45vw;
	left: 50%;
}
#Main .sample img {
	border: 4px solid var(--color-background-light);
	box-shadow: 0px 0px 2px 0px black;
	margin-bottom: 20px;
}
.pageTop {
	position: relative;
	width: 100%;
	min-height: calc(40vh + 100px);
	display: flex;
	justify-content: center;
	align-items: center;
	background-image: url(/tempimg/pageTop.jpeg);
	background-size: cover;
	background-position: center center;
	background-attachment: inherit;
	padding-bottom: 50px;
	overflow: hidden;
	z-index: 50;
}
/*------------Home TOP --------------------*/
.mainLogo {
	display: block;
	margin: 20px auto 30px auto;
	width: 600px;
	max-width: 90%;
}
@media(min-width:768px) {
	.navbar-right {
		padding-right: 1vw;
	}
}
/*-------------------Home TOP END ------------------*/
/* ---- New Book -----*/
.logoAFF {
	width: 96%;
	max-width: 1600px;
	padding-top: 90px;
	padding-bottom: 90px;
	text-align: center;
}
.logoAFF h2 {
	display: block;
	margin-right: auto;
	margin-left: auto;
	width: 1000px;
	max-width: 90%;
}
.logoAFF img {
	height: 120px;
	margin: 20px;
	max-width: 90%;
}
@media(max-width:768px) {
	.logoAFF img {
		height: 80px;
		margin: 20px;
	}
}
hr {
	height: 1px;
	margin: 32px 0;
	border: 0;
	background-color:
		color-mix(in srgb, var(--color-primary) 45%, var(--color-background-light));
}
@media(max-width:768px) {
	.pageTextTop h1 {
		font-size: 36px;
		line-height: 34px;
	}
}
/*--- NVHC End----------------------*/
.mainHome {
	padding-top: 100px !important;
	padding-bottom: 100px !important;
	max-width: 1600px;
	margin: auto;
}
@media(max-width:768px) {
	.mainHome {
		padding-top: 0px !important;
		margin-top: -45px;
		padding-bottom: 50px !important;
	}
}
.photoBox img {
	position: relative;
	z-index: 1;
	display: block;
	width: 100%;
}
@media(max-width:992px) {
	.homeMainTop .row {
		display: block;
	}
	.homeMainLeft {
		padding-left: 20px;
		padding-right: 20px;
	}
}
.childFlex p, .modal-body p, .post-item p, .contentFlex *, .post-item li, .post-item h2, .post-item h3, .post-item h4, .faqcloser p, .modal-content * {
	opacity: 1 !important;
	transform: none !important;
}
@media(max-width:768px) {
	.homeMainTop {
		text-align: left;
		padding-top: 70px !important;
		padding-bottom: 40px !important;
	}
	.navbar-custom li, .faAuto, .dropdown-toggle .fa {
		opacity: 1 !important;
		transform: none !important;
	}
}
.sr h1, .sr p, .sr .fa, .sr .eventRev, .photoBoxRight, .sr .agecol, .sr .divider, .sr #Main li, .sr #Main .divider, .sr #Main hr {
	visibility: hidden;
}
.sr .shr-socials li {
	visibility: visible !important;
}
.sr .itemInner p, .sr .itemInner h2, #Main #BlogTopics li, #Main #BlogTopics ul {
	opacity: 1 !important;
	visibility: visible !important;
	transform: scale(1) !important;
}
.err {
	border-color: red;
}
#docbody {
	padding-top: 0px;
	padding: 0px;
	margin: 0px;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	-webkit-transition: padding-top 1.0s;
	-moz-transition: padding-top 1.0s;
	transition: padding-top 1.0s;
}
.homeDisplay {
	width: 100%;
}
.homeDisplay1p {
	display: table;
	width: 100%;
}
.homeDisplay1 {
	position: relative;
	display: table-cell;
	vertical-align: middle;
	height: 460px;
	overflow: hidden;
	width: 100%;
	line-height: 7vw;
	margin-top: 20px;
	color: var(--color-background-light);
	font-size: 8vw;
	text-shadow: 1px 1px 3px black;
	text-align: right;
	padding: 4vw;
}
@media(min-width:1200px) {
	.homeDisplay1 {
		text-align: left;
		line-height: 90px;
		font-size: 80px;
		padding: 10vh calc(4vh + 10px);
	}
}
.homeDisplay2 {
	text-align: right;
	padding-right: 0px;
}
.homeDisplayButton {
	filter: grayscale(0%);
	transition: all 1s;
	position: relative;
	width: 100%;
	height: 360px;
	margin-top: 20px;
	margin-bottom: 20px;
	background-size: cover;
	background-position: center center;
	border: 4px solid var(--color-background-light);
	box-shadow: 0px 0px 2px 0px black;
}
.homeDisplayButton:hover {
	filter: grayscale(100%)
}
/*----- Typography -----*/
h1 {
	font-family: var(--font-Headings);
	margin-top: 10px;
	font-weight: 400;
	font-size: 52px;
	line-height: 1.05;
	color: var(--color-dark-bg);
}
#Main .header {
	margin: 0 0 45px;
	padding: 0;
}
#Main .header h1 {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	width: 100%;
	margin: 0;
	color: var(--color-dark-bg);
	font-family: var(--font-Headings);
	font-weight: 400;
	line-height: .98;
}
#Main .header h1 small, #Main .header h1 .small {
	order: -1;
	display: flex;
	align-items: center;
	width: 100%;
	gap: 20px;
	margin: 0 0 14px;
	font-family: var(--font-main);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 3px;
	text-transform: uppercase;
	color: var(--color-dark-bg);
}
/* Line beside small heading */
#Main .header h1 small:after, #Main .header h1 .small:after {
	content: "";
	flex: 1;
	border-top: 2px solid var(--color-light-accent);
}
#Main .header h1:after {
	display: none !important;
	content: none !important;
}
.well .fa-solid {
	float: left;
	width: 72px;
	margin: 4px 6px 6px 0;
	font-size: 50px;
	line-height: 1;
	text-align: center;
	color: var(--color-accent);
}
/* =========================================================
   MOBILE
========================================================= */
@media(max-width:767px) {
	#Main .header {
		margin-bottom: 35px;
	}
	#Main .header h1 small, #Main .header h1 .small {
		gap: 15px;
		margin-bottom: 11px;
		font-size: 11px;
		letter-spacing: 2.5px;
	}
}
h2 {
	font-family: var(--font-Headings);
	margin: 45px 0px 25px 0px;
	font-weight: 400;
	color: var(--color-dark-bg);
	font-size: 44px;
	line-height: 1;
}
/* Small eyebrow text inside headings */
h2 small, h2 .small, h3 small, h3 .small {
	margin: 0 0 15px;
	font-family: var(--font-main);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 3px;
	text-transform: uppercase;
	color: var(--color-dark-bg);
}
h2 small, h3 small {
	display: flex;
	align-items: center;
	gap: 20px;
}
h2 small:after, h3 small:after {
	content: "";
	flex: 1;
	border-top: 2px solid var(--color-light-accent);
}
.homeBooks h2 small:after {
	border-top-color: var(--color-background-light);
}
h3 {
	margin: 25px 0px 25px 0px;
	font-weight: 500;
	color: var(--color-dark-bg);
	font-size: 34px;
	line-height: .8;
	font-family: var(--font-accent);
}
h4 {
	font-family: var(--font-Headings);
	margin: 35px 0px -15px 0px;
	font-weight: 600;
	color: var(--color-primary);
	font-size: 24px;
	line-height: 1;
}
p {
	margin: 25px 0px 25px 0px;
}
@media(max-width: 768px) {
	h1 {
		font-size: 38px;
	}
	h2 {
		font-size: 34px;
	}
	h3 {
		font-size: 32px;
	}
	h4 {
		font-size: 28px;
	}
}
blockquote {
	margin: 25px 0;
	padding: 6px 20px;
	border-left: 5px solid var(--color-light-accent);
	font-family: var(--font-accent);
	font-size: 28px;
}
blockquote p {
	margin: 10px 0px !important;
}
blockquote footer {
	font-family: var(--font-Headings);
	font-size: 22px;
}
/*----- Typography End -----*/
.str_prd_name {
	font-family: var(--font-main);
}
.hide-store-filter, .hide-store-space {
	display: none;
}
.hide-store-sort {
	margin-top: -40px;
	margin-bottom: 40px;
	display: none;
}
/* =========================================================
   HORIZONTAL RULES
========================================================= */
#Main hr {
	width: 85%;
	margin: 42px auto;
	border: 0;
	border-top: 1px solid rgba(var(--color-dark-bg-rgb), .18);
	background: none;
}
/* =========================================================
   STANDARD WELLS
========================================================= */
#Main .well, #Main .well p, #Main .well li, #Main .well strong, #Main .well em {
	font-family: var(--font-Headings);
}
#Main .well {
	line-height: 1.45;
}
#Main .well {
	position: relative;
	margin: 25px 0 35px;
	padding: 42px 44px;
	background: var(--color-soft-bg) !important;
	background-image: none !important;
	border: 1px solid rgba(var(--color-dark-bg-rgb), .14) !important;
	border-radius: 0 !important;
	box-shadow:
		0 10px 28px color-mix(in srgb, var(--color-dark-bg) 5%, transparent) !important;
	overflow: hidden;
}
#Main .well {
	--well-line-grow: 0;
}
#Main .well:before {
	transform: scaleX(var(--well-line-grow));
	transform-origin: left center;
	transition: transform 900ms ease-out;
}
#Main .well {
	--well-accent: var(--color-secondary);
}
#Main .well:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 34%;
	height: 3px;
	background: var(--well-accent);
	pointer-events: none;
}
/* Remove old offset-border treatment */
#Main .well:after {
	display: none !important;
	content: none !important;
}
/* =========================================================
   CONTENT
========================================================= */
#Main .well > * {
	position: relative;
	z-index: 1;
}
#Main .well > *:first-child {
	margin-top: 0;
}
#Main .well > *:last-child {
	margin-bottom: 0;
}
#Main .well h2, #Main .well h3, #Main .well h4 {
	color: var(--color-dark-bg);
}
/* Any eyebrow heading inside a well */
#Main .well h2 small:after, #Main .well h2 .small:after, #Main .well h3 small:after, #Main .well h3 .small:after {
	border-top-color: var(--color-secondary);
}
/* =========================================================
    WELL VARIATION
========================================================= */
/* Default well color */
#Main .well {
	--well-accent: var(--color-accent);
}
#Main .row .well {
	--well-accent: var(--color-muted-accent);
}
/* Gold */
#Main .grid > .grid-item:nth-child(odd) > .well {
	--well-accent: var(--color-accent);
}
/* Sage */
#Main .grid > .grid-item:nth-child(even) > .well {
	--well-accent: var(--color-muted-accent);
}
/* =========================================================
   EQUAL HEIGHT WELL ROWS
========================================================= */
@media(min-width: 768px) {
	.equalWellRow {
		display: flex;
		flex-wrap: wrap;
		align-items: stretch;
		margin-top: 15px;
		margin-bottom: 20px;
	}
	.equalWellRow .well {
		margin-top: 0px !important;
		margin-bottom: 0px !important;
	}
	.equalWellRow > [class*="col-"] {
		float: none;
		display: flex;
		flex-direction: column;
	}
	.equalWellRow > [class*="col-"] > .well {
		flex: 1 1 auto;
		display: block;
		width: 100%;
		height: 100%;
		margin-top: 0;
		margin-bottom: 0;
	}
}
/* =========================================================
   MOBILE
========================================================= */
@media(max-width: 767px) {
	#Main .well {
		margin: 34px 0 42px;
		padding: 32px 25px;
	}
	#Main .well:before {
		width: 42%;
	}
}
/* =========================================================
   EQUAL HEIGHT WELL ROWS
   Add .equalWellRow to any Bootstrap row
========================================================= */
@media (min-width: 768px) {
	.equalWellRow {
		display: flex;
		flex-wrap: wrap;
		align-items: stretch;
	}
	/* Keep normal Bootstrap column gutters,
	   but make each column equal height */
	.equalWellRow > [class*="col-"] {
		float: none;
		display: flex;
		flex-direction: column;
	}
	/* If the column contains a well,
	   stretch the well to fill the column height */
	.equalWellRow > [class*="col-"] > .well {
		flex: 1 1 auto;
		display: block;
		width: 100%;
		height: 100%;
		margin-top: 0;
		margin-bottom: 0;
	}
}
a {
	color: var(--color-secondary);
}
a:hover, a:focus, a:active {
	text-decoration: none;
	color: var(--color-primary);
}
a:focus, a:active, button:focus, button:active, input:focus, textarea:focus, select:focus {
	outline: none !important;
	box-shadow: none !important;
}
hr {
	border-color: var(--color-dark-bg);
}
/*----TOP-----*/
@media(min-width:768px) {
	.topCon {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
	}
}
.topLinks a {
	display: inline-block;
	padding: 0px 20px 0px 10px;
	font-size: 40px;
	color: var(--color-background-light);
	text-shadow: -2px 2px 0px black;
}
.topLinks a:hover {
	text-decoration: underline;
}
.topLeft {
	text-align: right;
}
.topRight {
	text-align: left;
}
/* Contact Bar ----*/
.getContact {
	background-color: var(--color-dark-bg);
	background-image: url('tempimg/toptexture.png');
	background-position: left center;
	padding: 8px 4vw 16px 4vw;
	color: var(--color-background-light);
	font-size: 16px;
	text-align: right;
	box-shadow: 0px 0px 1px 1px black;
}
.getContact .break {
	margin-left: 10px;
	margin-right: 10px;
}
@media(max-width:768px) {
	.getContact {
		display: none;
	}
}
/* =========================================================
   HOME BLOG / RECENT POSTS
========================================================= */
.homePostsSection {
	width: 100%;
	padding: 140px 0 125px;
	background:
		linear-gradient(to bottom, var(--color-background-light) 0%, #ffffff 18%, #ffffff 82%, var(--color-background-light) 100%);
}
/* =========================================================
   INNER WIDTH
========================================================= */
.homePostsInner {
	width: 92%;
	max-width: 1650px;
	margin: 0 auto;
	padding: 0;
}
/* =========================================================
   SECTION HEADING
========================================================= */
.homePostsInner > h2 {
	margin: 0 0 48px;
	color: var(--color-primary);
}
/* FROM THE BLOG */
.homePostsInner > h2 small {
	display: flex;
	align-items: center;
	gap: 18px;
	margin: 0 0 18px;
	font-family: var(--font-main);
	font-size: 13px;
	line-height: 1;
	font-weight: normal;
	letter-spacing: 3px;
	text-transform: uppercase;
	color: var(--color-dark-bg);
}
/* Gold line after FROM THE BLOG */
.homePostsInner > h2 small:after {
	content: "";
	flex: 1 1 auto;
	height: 1px;
	background: color-mix(in srgb, var(--color-accent) 65%, transparent);
}
/* =========================================================
   BOOTSTRAP ROW
========================================================= */
.homeBlogRow {
	margin-left: -14px;
	margin-right: -14px;
}
.homeBlogFeatureCol, .homeBlogSideCol {
	padding-left: 14px;
	padding-right: 14px;
}
/* =========================================================
   FEATURED POST
========================================================= */
.homeBlogFeatured {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	background: #ffffff;
	border: 1px solid color-mix(in srgb, var(--color-dark-bg) 13%, transparent);
	--blog-accent: var(--color-secondary);
	box-shadow:
		0 12px 32px color-mix(in srgb, var(--color-dark-bg) 6%, transparent);
	overflow: hidden;
	transition:
		transform .3s ease, box-shadow .3s ease;
}
.homeBlogFeatured:hover {
	transform: translateY(-3px);
	box-shadow:
		0 18px 42px color-mix(in srgb, var(--color-dark-bg) 9%, transparent);
}
/* =========================================================
   FEATURED IMAGE
========================================================= */
.homeBlogFeaturedImage {
	display: block;
	height: 440px;
	overflow: hidden;
}
/* =========================================================
   SHARED PHOTO
========================================================= */
.homeBlogPhoto {
	width: 100%;
	height: 100%;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	transform: scale(1);
	transition:
		transform .65s ease;
}
.homeBlogFeatured:hover .homeBlogPhoto, .homeBlogSmall:hover .homeBlogPhoto {
	transform: scale(1.025);
}
/* =========================================================
   FEATURED CONTENT
========================================================= */
.homeBlogFeaturedContent {
	position: relative;
	padding: 32px 40px 36px;
	background: #ffffff;
}
/* Remove old fabric / quilt effects */
.homeBlogFeaturedContent:before, .homeBlogSmallContent:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 50%;
	height: 4px;
	background: var(--blog-accent);
	pointer-events: none;
}
/* =========================================================
   FEATURED TITLE
========================================================= */
.homeBlogFeaturedContent h3 {
	margin: 0 0 18px;
	font-size: clamp(34px, 2.25vw, 46px);
	line-height: 1.12;
	text-align: left;
	color: var(--color-primary);
}
.homeBlogFeaturedContent h3 small {
	display: block;
	margin: 0 0 12px;
	font-family: var(--font-main);
	font-size: 11px;
	line-height: 1.4;
	font-weight: normal;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--color-muted-accent);
}
/* Heading links inherit heading appearance */
.homeBlogFeaturedContent h3 > a, .homeBlogSmallContent h3 > a {
	color: inherit;
	text-decoration: none;
}
.homeBlogFeaturedContent h3 > a:hover, .homeBlogSmallContent h3 > a:hover {
	color: var(--color-secondary);
	text-decoration: none;
}
/* Featured excerpt */
.homeBlogFeaturedContent p {
	margin: 0;
	line-height: 1.55;
	color: var(--color-body-text);
}
/* =========================================================
   READ MORE
========================================================= */
.homeBlogReadMore {
	white-space: nowrap;
	color: var(--color-secondary) !important;
	text-decoration: none;
}
.homeBlogReadMore:hover, .homeBlogReadMore:focus {
	color: var(--color-primary) !important;
	text-decoration: none;
}
/* =========================================================
   RIGHT COLUMN
========================================================= */
.homeBlogSideCol {
	display: flex;
	flex-direction: column;
}
/* =========================================================
   SMALL POSTS
========================================================= */
.homeBlogSmall {
	position: relative;
	display: flex;
	align-items: stretch;
	flex: 1 1 0;
	width: 100%;
	min-height: 190px;
	margin-bottom: 18px;
	background: #ffffff;
	border: 1px solid color-mix(in srgb, var(--color-dark-bg) 13%, transparent);
	overflow: hidden;
	transition:
		transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
/* Slight color variation without becoming busy */
.homeBlogSmall {
	--blog-accent: var(--color-secondary);
}
.homeBlogSmall:nth-child(2) {
	--blog-accent: var(--color-accent);
}
.homeBlogSmall:nth-child(3) {
	--blog-accent: var(--color-muted-accent);
}
.homeBlogSmall:last-child {
	margin-bottom: 0;
}
.homeBlogSmall:hover {
	transform: translateY(-2px);
	box-shadow:
		0 10px 26px color-mix(in srgb, var(--color-dark-bg) 7%, transparent);
}
/* =========================================================
   SMALL POST IMAGE
========================================================= */
.homeBlogSmallImage {
	display: block;
	flex: 0 0 46%;
	overflow: hidden;
}
/* =========================================================
   SMALL POST CONTENT
========================================================= */
.homeBlogSmallContent {
	position: relative;
	display: flex;
	align-items: center;
	flex: 1 1 auto;
	min-width: 0;
	padding: 22px 24px;
	background: #ffffff;
	overflow: hidden;
}
/* =========================================================
   SMALL TITLES
========================================================= */
.homeBlogSmallContent h3 {
	width: 100%;
	margin: 0;
	font-size: clamp(19px, 1.25vw, 25px);
	line-height: 1.2;
	text-align: left;
	color: var(--color-primary);
	overflow-wrap: break-word;
}
.homeBlogSmallContent h3 small {
	display: block;
	margin: 0 0 10px;
	font-family: var(--font-main);
	font-size: 10px;
	line-height: 1.4;
	font-weight: normal;
	letter-spacing: 1.7px;
	text-transform: uppercase;
	color: var(--color-muted-accent);
}
/* =========================================================
   DESKTOP EQUAL HEIGHT
========================================================= */
@media(min-width: 992px) {
	.homeBlogRow {
		display: flex;
		align-items: stretch;
	}
	.homeBlogFeatureCol, .homeBlogSideCol {
		float: none;
	}
	.homeBlogFeatureCol {
		display: flex;
	}
	.homeBlogFeatured {
		flex: 1 1 auto;
	}
}
/* =========================================================
   SMALLER DESKTOP
========================================================= */
@media(min-width: 992px) and (max-width: 1250px) {
	.homePostsSection {
		padding-top: 100px;
		padding-bottom: 110px;
	}
	.homeBlogFeaturedImage {
		height: 390px;
	}
	.homeBlogSmall {
		min-height: 175px;
	}
	.homeBlogSmallImage {
		flex-basis: 43%;
	}
	.homeBlogSmallContent {
		padding: 18px 18px;
	}
	.homeBlogSmallContent h3 {
		font-size: 20px;
	}
}
/* =========================================================
   TABLET
========================================================= */
@media(max-width: 991px) {
	.homePostsSection {
		padding-top: 90px;
		padding-bottom: 95px;
	}
	.homePostsInner {
		width: 92%;
	}
	.homePostsInner > h2 {
		margin-bottom: 38px;
	}
	.homeBlogFeatureCol, .homeBlogSideCol {
		width: 100%;
		float: none;
	}
	.homeBlogFeatured {
		margin-bottom: 24px;
	}
	.homeBlogFeaturedImage {
		height: 420px;
	}
	.homeBlogSmall {
		min-height: 170px;
	}
	.homeBlogSmallImage {
		flex-basis: 42%;
	}
}
/* =========================================================
   MOBILE
========================================================= */
@media(max-width: 767px) {
	.homePostsSection {
		padding: 75px 0 80px;
	}
	.homePostsInner {
		width: auto;
		margin-left: 20px;
		margin-right: 20px;
	}
	.homePostsInner > h2 {
		margin-bottom: 30px;
	}
	.homePostsInner > h2 small {
		gap: 12px;
		margin-bottom: 14px;
		font-size: 11px;
		letter-spacing: 2px;
	}
	.homeBlogRow {
		margin-left: 0;
		margin-right: 0;
	}
	.homeBlogFeatureCol, .homeBlogSideCol {
		padding-left: 0;
		padding-right: 0;
	}
	/* Featured */
	.homeBlogFeaturedImage {
		height: 280px;
	}
	.homeBlogFeaturedContent {
		padding: 26px 23px 30px;
	}
	.homeBlogFeaturedContent h3 {
		font-size: 32px;
		line-height: 1.12;
	}
	/* Small posts */
	.homeBlogSideCol {
		display: block;
	}
	.homeBlogSmall {
		flex: 0 0 auto;
		height: auto;
		min-height: 135px;
		margin-bottom: 16px;
		overflow: hidden;
	}
	.homeBlogSmallImage {
		flex-basis: 42%;
	}
	.homeBlogSmallContent {
		height: auto;
		min-height: 135px;
		padding: 16px 17px;
		overflow: visible;
	}
	.homeBlogSmallContent h3 {
		font-size: 20px;
		line-height: 1.15;
	}
	.homeBlogSmallContent h3 small {
		font-size: 9px;
		letter-spacing: 1.25px;
	}
}
/*---------- Buttons ------------*/
/*---------- Buttons ------------*/
.btn {
	display: inline-block;
	padding: 15px 42px;
	font-family: var(--font-main);
	font-size: 18px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--color-dark-bg) !important;
	border: 2px solid var(--color-dark-bg) !important;
	border-radius: var(--btn-radius);
	text-transform: none;
	letter-spacing: 0;
	var(--color-background-light)-space: normal;
	background-image: none !important;
	box-shadow: none !important;
	text-shadow: none !important;
	transition: all .25s ease;
}
.btn {
	white-space: normal;
}
/* PRIMARY
   Main Bobby-style button */
.btn-primary {
	background: var(--color-background-light) !important;
	color: var(--color-dark-bg) !important;
}
/* SUCCESS
   Soft sage */
.btn-success {
	background: var(--color-light-accent) !important;
	color: var(--color-dark-bg) !important;
}
/* INFO
   Soft antique gold */
.btn-info {
	background: var(--color-secondary) !important;
	border: 1px solid var(--color-dark-bg) !important;
	color: var(--color-background-light) !important;
}
.btn-info:hover, .btn-info:focus, .btn-info:active, .btn-info.active, .open > .dropdown-toggle.btn-info {
	background: #fff !important;
	border-color: var(--color-dark-bg) !important;
	color: var(--color-dark-bg) !important;
	background-image: none !important;
	box-shadow: none !important;
}
.btn-default {
	background: var(--color-primary) !important;
	color: var(--color-background-light) !important;
}
/* All light button hovers */
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .btn-success:hover, .btn-success:focus, .btn-success:active, .btn-success.active, .btn-default:hover, .btn-default:focus, .btn-default:active, .btn-default.active {
	background: #fff !important;
	border-color: var(--color-dark-bg) !important;
	color: var(--color-dark-bg) !important;
	background-image: none !important;
	box-shadow: none !important;
	outline: none !important;
}
/* DARK BUTTON
   Use sparingly for the strongest CTA */
.btn-dark {
	background: var(--color-dark-bg) !important;
	border: 1px solid var(--color-dark-bg) !important;
	color: #fff !important;
}
.btn-dark:hover, .btn-dark:focus, .btn-dark:active {
	background: #fff !important;
	border-color: var(--color-dark-bg) !important;
	color: var(--color-dark-bg) !important;
}
/* Small */
.btn-sm {
	padding: 10px 26px;
	font-size: 15px;
}
/*---------- Buttons End ------------*/
.bottomMain {
	padding-top: 20px !important;
	padding-bottom: 40px !important;
	max-width: 1680px;
}
.FAQquestion {
	font-size: 24px;
}
.resH3 {
	margin-top: 0px;
	margin-bottom: 10px;
	font-size: 24px;
}
/*-----------------FLIP COVER-----------------------*/
.PageFlipBook {
	-webkit-perspective: 1200px;
	perspective: 1200px;
}
.PageFlipBook a, .PageFlipBook .has-edge {
	transition: .2s;
	display: inline-block;
}
.PageFlipBook .page-flip-book-ribbon {
	position: absolute;
	top: 2%;
	right: -12px;
	text-transform: uppercase;
	padding: 10px 20px;
	background-color: var(--color-secondary);
	color: var(--color-background-light);
	font-size: 13px;
	letter-spacing: 1px;
	text-align: left;
	width: 50%;
	transition: .2s;
	z-index: 1;
	-webkit-transform-origin: 100% 0;
	transform-origin: 100% 0;
}
.PageFlipBook .page-flip-book-ribbon .fa-spinner {
	font-size: 17px;
}
.PageFlipBook .page-flip-book-ribbon span {
	/*margin-left: 10px;*/
}
.PageFlipBook .page-flip-book-ribbon:after {
	content: '';
	position: absolute;
	top: 100%;
	right: 0;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 15px 15px 0 0;
	border-color: var(--color-secondary) transparent transparent transparent;
}
.PageFlipBook .has-edge {
	position: relative;
}
.PageFlipBook:hover a {
	opacity: 1;
}
.PageFlipBook:hover .has-edge {
	-webkit-transform: rotateY(-35deg);
	transform: rotateY(-35deg);
}
.PageFlipBook:hover .single-has-edge:after {
	opacity: 1;
}
.PageFlipBook:hover .has-edge .page-flip-book-ribbon {
	right: 0;
	-webkit-transform: rotateY(35deg) translate3d(10px, 0%, 20px);
	transform: rotateY(35deg) translate3d(10px, 0%, 20px);
}
/**
*  Book Edge
*/
.has-edge {
	-webkit-transform-origin: 35% 50%;
	transform-origin: 35% 50%;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
}
.has-edge:after {
	content: '';
	position: absolute;
	top: 3px;
	left: 98.5%;
	bottom: 3px;
	width: 45px;
	background: repeating-linear-gradient(to right, #f5f5f5, #f5f5f5 5px, #aaa 5px, #aaa 6px);
	-webkit-transform-origin: 0% 50%;
	transform-origin: 0% 50%;
	-webkit-transform: rotateY(90deg);
	transform: rotateY(90deg);
}
.has-edge.has-edge-thin:after {
	width: 30px;
}
.has-edge.has-edge-thick:after {
	width: 70px;
}
.single-has-edge:after {
	opacity: 0;
	transition: .3s;
}
.BookImage {
	text-align: center;
	margin: auto;
	width: 80%;
	max-width: 260px;
	margin-top: 10px;
	margin-bottom: 40px;
}
.BookImageBackground {
	bottom: 10% !important;
}
.BookImageBackground.book-bg-type-1, .BookImageBackground.book-bg-type-2, .BookImageBackground.book-bg-type-3, .BookImageBackground.book-bg-type-4 {
	left: -5%;
	right: -5%;
}
.bookText {
	padding: 0px 20px 20px 20px;
}
.bookText h2 {
	margin-top: 0px;
}
.bookText p {
	text-align: justify;
}
.bookRight {
	padding: 80px;
}
.bookLeft {
	padding: 80px;
}
@media(max-width:768px) {
	.bookRight, .bookLeft {
		padding-top: 30px;
		padding-bottom: 30px;
	}
}
.prodButton {
	border: 0px !important;
}
.prodTitle::first-letter {
	margin-right: -15px;
	font-size: 1.2em;
	color: var(--color-secondary);
	padding: 0 15px;
	border: 1px solid var(--color-secondary);
}
/* ----------------Home STYLES---------------- */
.parentFlex {
	display: flex;
	flex-wrap: wrap;
	width: 90%;
	max-width: 1900px;
	margin: auto;
	margin-bottom: -13vh;
}
.childFlex {
	flex: 1 0 50%;
	margin: 0px 0px 20vh 0px;
	min-height: 60vh;
	position: sticky;
	top: 20vh;
	display: flex;
	align-items: center;
}
@media(min-width:993px) {
	.childNoStick {
		position: relative;
	}
	.parentBottom {
		margin-bottom: 7vh;
	}
}
.childText {
	padding: 40px;
}
.childText p {
	text-align: justify;
}
.childText h2 {
	color: var(--color-background-light);
}
.s1 {
	background-image: url(/tempimg/sr-h-1.jpeg);
	background-size: cover;
	background-position: left center;
}
.s2 {
	background-color: var(--color-dark-bg);
	color: var(--color-background-light);
}
.s3 {
	background-color: rgba(43, 47, 68, .95);
	color: var(--color-background-light);
	text-align: right;
}
.s4 {
	background-image: url(/tempimg/sr-h-2.jpeg);
	background-size: cover;
	background-position: right center;
}
.s5 {
	background-image: url(/tempimg/sr-h-3.jpeg);
	background-size: cover;
	background-position: center center;
}
.s6 {
	background-color: rgba(43, 47, 68, .95);
	color: var(--color-background-light);
}
@media(max-width:992px) {
	.childFlex {
		flex: 1 0 100%;
		margin: 0px 0px 20px 0px;
		min-height: calc(100vh - 40px);
		top: 20px;
	}
	.childNoStickM {
		position: relative;
	}
	.parentBottomM {
		margin-bottom: 7vh;
	}
	.parentFlex {
		margin-bottom: 0px;
	}
	.s2 {
		background-color: rgba(43, 47, 68, .95);
	}
}
/*--- BWS Test Contact Override---*/
.contactPhone span {
	display: none;
}
.contactFax span {
	display: none;
}
.contactPhone:after {
	content: "Desk";
}
.contactFax:after {
	content: "Cell";
}
/*--------------------BUBBLES END ------------------------------------*/
/* Target the column that contains the submit button */
#CONTACTFORM .col-md-4:has(#contact_submit) {
	float: none !important;
	width: 100% !important;
	clear: both;
}
#CONTACTFORM #contact_submit {
	display: block;
	width: 100%;
}
.conblock {
	word-wrap: break-word;
	display: none !important;
}
.vid_title {
	font-weight: normal !important;
	font-size: 24px;
}
.vid_date {
	display: none;
}
/*------------- PAGE INTRO ----------*/
/* =========================================================
   PAGE INTRO
========================================================= */
.introSplit {
	position: relative;
	width: 92%;
	max-width: 1250px;
	margin: 70px auto 45px;
	padding: 0;
	border: 1px solid rgba(var(--color-dark-bg-rgb), .14);
}
/* =========================================================
   INNER
========================================================= */
.introInner {
	position: relative;
	display: flex;
	align-items: stretch;
	width: 100%;
	min-height: 390px;
	background: #fff;
	box-shadow:
		0 12px 34px color-mix(in srgb, var(--color-dark-bg) 6%, transparent);
}
/* =========================================================
   LEFT IMAGE
========================================================= */
.introPhoto {
	position: relative;
	width: 54%;
	min-height: 390px;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
}
/* =========================================================
   RIGHT CONTENT
========================================================= */
.introText {
	position: relative;
	width: 46%;
	display: flex;
	align-items: center;
	padding: 65px 4vw;
	background: var(--color-soft-bg);
	overflow: hidden;
}
/* Partial accent line */
.introText:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 38%;
	height: 4px;
	background: var(--color-secondary);
	pointer-events: none;
}
/* =========================================================
   TITLE
========================================================= */
.introText h1 {
	position: relative;
	width: 100%;
	margin: 0;
	color: var(--color-dark-bg);
	z-index: 2;
}
.introText h1 small, .introText h1 .small {
	display: block;
	width: 100%;
	margin: 13px 0 0;
	font-family: var(--font-main);
	font-size: 18px;
	font-weight: 400;
	line-height: 1.45;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--color-primary);
}
/* Kill old decorative line */
.introText h1 small:after, .introText h1 .small:after {
	display: none !important;
	content: none !important;
}
/* =========================================================
   TABLET
========================================================= */
@media(max-width: 991px) {
	.introSplit {
		width: 92%;
		margin-top: 55px;
		margin-bottom: 35px;
	}
	.introInner {
		display: block;
		min-height: 0;
	}
	.introPhoto, .introText {
		width: 100%;
	}
	.introPhoto {
		min-height: 400px;
	}
	.introText {
		min-height: 220px;
		padding: 50px 7vw;
	}
	.introText:before {
		width: 32%;
	}
}
/* =========================================================
   MOBILE
========================================================= */
@media(max-width: 767px) {
	.introSplit {
		width: auto;
		margin: 35px 20px 15px;
	}
	.introPhoto {
		min-height: 280px;
	}
	.introText {
		min-height: 0;
		padding: 40px 28px 44px;
	}
	.introText:before {
		width: 38%;
		height: 3px;
	}
	.introText h1 small, .introText h1 .small {
		margin-top: 11px;
		font-size: 10px;
		line-height: 1.5;
		letter-spacing: 1.5px;
	}
}
/* =========================================================
   SMALL MOBILE
========================================================= */
@media(max-width: 480px) {
	.introPhoto {
		min-height: 240px;
	}
	.introText {
		padding: 35px 22px 38px;
	}
}
/* ---------------------------------------------------------
   REUSABLE FABRIC TEXTURE OVERLAY
--------------------------------------------------------- */
.fabric-overlay {
	position: relative;
	isolation: isolate;
	--fabric-opacity: .9;
}
/* Fabric sits over background, under content */
.fabric-overlay:after {
	content: "";
	position: absolute;
	inset: 0;
	background-image: url('/tempimg/fabric_overlay_white_strong.png');
	background-repeat: repeat;
	background-position: bottom right;
	opacity: var(--fabric-opacity);
	border-radius: inherit;
	pointer-events: none;
	z-index: 0;
}
/* Keep actual content above texture */
.fabric-overlay > * {
	position: relative;
	z-index: 1;
}
/* ----------------------------------------------------
   HOME HERO
---------------------------------------------------- */
/*.homeProfileTop {
	padding: 0;
	background: var(--color-background-light);
}
.homeProfileRow {
	display: flex;
	align-items: stretch;

	min-height: calc(100vh - 146px);
	margin-left: 0;
	margin-right: 0;
}

.homeProfileImage {
	display: flex;
	/* Top / Right / Bottom / Left */
padding: 10vh 4vw 10vh 8vw;
overflow: visible;
}
.homeProfilePhoto {
	position: relative;
	width: 100%;
	flex: 1 1 auto;
}
.homeProfilePhoto:after {
	content: "";
	position: absolute;
	top: 12px;
	left: 12px;
	right: -12px;
	bottom: -12px;
	border: 1px solid var(--color-dark-bg);
	z-index: 0;
	pointer-events: none;
}
.homeProfilePhotoBW, .homeProfilePhotoColor {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-position: center top;
	background-repeat: no-repeat;
	background-size: cover;
	z-index: 1;
}
.homeProfilePhotoBW {
	background-image: url('/tempimg/HomeDeb_BW.png');
}
.homeProfilePhotoColor {
	background-image: url('/tempimg/HomeDeb_FULL.png');
	opacity: 0;
	animation: debraColorFade 12s ease-in-out infinite;
}
@keyframes debraColorFade {
	0%, 30% {
		opacity: 0;
	}
	45%, 65% {
		opacity: 1;
	}
	80%, 100% {
		opacity: 0;
	}
}
.homeProfileContent {
	display: flex;
	align-items: center;
	padding: 60px 7vw 60px 6vw;
	background: var(--color-background-light);
}
.homeProfileText {
	width: 100%;
	max-width: 660px;
}
.homeProfileText h1 {
	margin: 0 0 25px;
	font-size: 48px;
	line-height: 1.05;
	color: var(--color-dark-bg);
}
.homeProfileText p {
	margin: 0 0 32px;
	font-size: 20px;
	line-height: 1.6;
	color: var(--color-body-text);
}
@media (max-width: 767px) {
	.homeProfileRow {
		display: block;
		min-height: 0;
	}
	.homeProfileImage {
		display: block;
		height: 58vh;
		min-height: 420px;
		padding: 20px 24px 26px 18px;
	}
	.homeProfilePhoto {
		width: 100%;
		height: 100%;
	}
	.homeProfilePhoto:after {
		top: 8px;
		left: 8px;
		right: -8px;
		bottom: -8px;
	}
	.homeProfileContent {
		display: block;
		padding: 50px 25px 60px;
	}
	.homeProfileText {
		max-width: none;
	}
	.homeProfileText h1 {
		font-size: 36px;
	}
	.homeProfileText p {
		font-size: 18px;
	}
}
/* ====================================================
   MAIN HEADER Navigation
==================================================== */
.mainMenu {
	position: relative;
	z-index: 300;
	width: 100%;
	background: var(--color-background-light);
	border-bottom: 1px solid rgba(111, 59, 86, .12);
	box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
}
.menuInner {
	position: relative;
	width: 100%;
	max-width: 1900px;
	margin: 0 auto;
	padding: 12px 30px;
}
/* ====================================================
   LARGE DESKTOP

   MENU | CENTER LOGO | MENU
==================================================== */
.desktopMenuGrid {
	display: grid;
	grid-template-columns:
		minmax(0, 1fr) auto minmax(0, 1fr);
	align-items: center;
	width: 100%;
}
/* ----------------------------------------------------
   DESKTOP LOGO
---------------------------------------------------- */
.desktopMenuLogo {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 28px;
}
.desktopMenuLogo a {
	display: block;
}
.desktopMenuLogo img {
	display: block;
	width: 160px;
	height: auto;
	margin: 0 auto;
}
/* ====================================================
   BOOTSTRAP NAV RESET
==================================================== */
.navbar-custom {
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	min-height: 0;
	background: transparent;
}
.navbar-custom .navbar-inner {
	padding: 0;
}
.navbar-custom .nav {
	float: none;
	width: 100%;
	margin: 0;
	padding: 0;
}
.navbar-custom .nav:before, .navbar-custom .nav:after {
	display: none;
	content: none;
}
/* ====================================================
   LEFT / RIGHT PUBLIC MENU
==================================================== */
.navbar-custom .menuLeft, .navbar-custom .menuRight {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(0, 1fr);
	align-items: stretch;
	width: 100%;
}
.navbar-custom .nav > li {
	float: none;
	display: block;
	width: 100%;
	height: 100%;
}
/* ----------------------------------------------------
   MAIN LINKS
---------------------------------------------------- */
.navbar-custom .nav > li > a {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	min-height: 54px;
	padding: 9px 7px;
	font-family: var(--font-main);
	font-size: 18px;
	font-weight: 400;
	line-height: 1.15;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 1.4px;
	white-space: normal;
	color: var(--color-primary);
	background: transparent;
	text-decoration: none;
}
.menuLine {
	display: block;
}
/* ----------------------------------------------------
   HOVER
---------------------------------------------------- */
.navbar-custom .nav > li > a:hover, .navbar-custom .nav > li > a:focus, .navbar-custom .nav > li.active > a, .navbar-custom .nav > li.open > a {
	color: var(--color-secondary);
	background: transparent;
	text-decoration: none;
}
/* ----------------------------------------------------
   UNDERLINE
---------------------------------------------------- */
.navbar-custom .nav > li > a:after {
	content: "";
	position: absolute;
	left: 10px;
	right: 10px;
	bottom: 3px;
	height: 1px;
	background: var(--color-secondary);
	transform: scaleX(0);
	transform-origin: center;
	transition: transform .2s ease;
}
.navbar-custom .nav > li > a:hover:after, .navbar-custom .nav > li.active > a:after, .navbar-custom .nav > li.open > a:after {
	transform: scaleX(1);
}
/* ====================================================
   FOLLOW ME TAB
   Logged-out visitors only.
==================================================== */
.followTab {
	position: absolute;
	top: 0;
	right: 72px;
	z-index: 350;
	background: var(--color-dark-bg);
	box-shadow: 0 5px 12px rgba(0, 0, 0, .12);
}
.followTab:after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -9px;
	height: 10px;
	background: var(--color-dark-bg);
	clip-path: polygon(0 0, 100% 0, 91% 100%, 9% 100%);
}
.followTab a {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-width: 155px;
	padding: 12px 18px 5px;
	font-family: var(--font-Headings);
	font-size: 20px;
	font-style: italic;
	font-weight: 600;
	line-height: 1;
	color: var(--color-background-light);
	text-decoration: none;
}
.followTab a:hover, .followTab a:focus {
	color: var(--color-light-accent);
	text-decoration: none;
}
.followIcon {
	font-family: Georgia, serif;
	font-size: 17px;
	font-style: normal;
	color: var(--color-light-accent);
}
/* ====================================================
   ADMIN TAB
   Replaces Follow Me while logged in.
==================================================== */
.adminTab {
	position: absolute;
	top: 0;
	right: 55px;
	z-index: 360;
	min-width: 220px;
	padding: 5px 14px 5px;
	text-align: center;
	background: var(--color-dark-bg);
	box-shadow: 0 5px 12px rgba(0, 0, 0, .14);
}
.adminTab:after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -9px;
	height: 10px;
	background: var(--color-dark-bg);
	clip-path: polygon(0 0, 100% 0, 94% 100%, 6% 100%);
}
.adminTabLinks {
	padding-top: 12px;
	position: relative;
	z-index: 2;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 4px 10px;
}
.adminTabLinks a {
	font-family: var(--font-main);
	font-size: 15px;
	line-height: 1.3;
	letter-spacing: .5px;
	text-transform: uppercase;
	color: var(--color-light-accent);
	text-decoration: none;
}
.adminTabLinks a:hover, .adminTabLinks a:focus {
	color: #fff;
	text-decoration: none;
}
/* ====================================================
   STANDARD DROPDOWNS
==================================================== */
.navbar-custom .dropdown-menu {
	min-width: 220px;
	padding: 8px 0;
	border: 0;
	border-radius: 0;
	background: var(--color-background-light);
	box-shadow: 0 8px 18px rgba(0, 0, 0, .12);
}
.navbar-custom .dropdown-menu > li > a {
	padding: 10px 18px;
	font-family: var(--font-main);
	font-size: 14px;
	line-height: 1.3;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: var(--color-primary);
}
.navbar-custom .dropdown-menu > li > a:hover, .navbar-custom .dropdown-menu > li > a:focus {
	color: var(--color-background-light);
	background: var(--color-primary);
}
.navbar-custom .dropdown-menu .divider {
	margin: 5px 0;
	background-color:
		rgba(111, 59, 86, .15);
}
/* Right-side dropdowns open inward so they stay on screen */
.navbar-custom .menuRight > li.dropdown > .dropdown-menu {
	left: auto;
	right: 0;
}
/* ====================================================
   MORE MENU
==================================================== */
.moreMenu > .dropdown-menu {
	min-width: 270px;
	padding:
		8px 0;
}
/* Items that were moved inside MORE */
.moreMenu > .dropdown-menu > li {
	float: none;
	display: block;
	width: 100%;
	height: auto;
}
.moreMenu > .dropdown-menu > li > a {
	display: block;
	min-height: 0;
	padding:
		10px 18px;
	text-align: left;
}
/*
 * If an overflow item already has subpages,
 * make its title a section heading.
 */
.moreMenu > .dropdown-menu > .dropdown > a {
	font-weight: 700;
	color: var(--color-primary);
	background:
		rgba(111, 59, 86, .06);
	cursor: default;
	pointer-events: none;
}
.moreMenu > .dropdown-menu > .dropdown > .dropdown-menu {
	position: static;
	display: block !important;
	float: none;
	width: 100%;
	min-width: 0;
	margin: 0;
	padding:
		2px 0 8px 14px;
	border: 0;
	background: transparent;
	box-shadow: none;
}
.moreMenu > .dropdown-menu > .dropdown > .dropdown-menu > li > a {
	padding:
		7px 18px;
	font-size: 13px;
	text-transform: none;
	letter-spacing: .4px;
}
/* ====================================================
   MOBILE HEADER
==================================================== */
.mobileMenuHeader {
	display: none;
}
/* ----------------------------------------------------
   SUBSCRIBE ANCHOR
---------------------------------------------------- */
#Subscribe {
	scroll-margin-top: 50px;
}
/* ====================================================
   MID SIZE / TABLET

   LOGO | MENU ROW
        | MENU ROW
==================================================== */
@media (min-width: 768px) and (max-width: 1200px) {
	.menuInner {
		padding: 18px 32px 16px;
	}
	.desktopMenuGrid {
		display: grid;
		grid-template-columns: 170px minmax(0, 1fr);
		grid-template-rows: auto auto;
		grid-template-areas:
			"logo left"
			"logo right";
		column-gap: 28px;
		row-gap: 2px;
		align-items: center;
		width: 100%;
		/*
		 * Leave breathing room for Follow/Admin tab.
		 */
		padding-top: 15px;
		padding-bottom: 15px;
	}
	/* -----------------------------------------------
	   LOGO LEFT
	----------------------------------------------- */
	.desktopMenuLogo {
		grid-area: logo;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		padding: 0;
	}
	.desktopMenuLogo img {
		width: 145px;
		height: auto;
		margin: -10px auto -10px;
	}
	/* -----------------------------------------------
	   MENU ROW 1
	----------------------------------------------- */
	.navbar-custom .menuLeft {
		grid-area: left;
		display: grid;
		grid-auto-flow: column;
		grid-auto-columns: minmax(0, 1fr);
		width: 100%;
		margin: 0;
	}
	/* -----------------------------------------------
	   MENU ROW 2
	----------------------------------------------- */
	.navbar-custom .menuRight {
		grid-area: right;
		display: grid;
		grid-auto-flow: column;
		grid-auto-columns: minmax(0, 1fr);
		width: 100%;
		margin: 0;
	}
	/* -----------------------------------------------
	   TABLET MENU ITEMS
	----------------------------------------------- */
	.navbar-custom .nav > li {
		width: 100%;
		height: auto;
	}
	.navbar-custom .nav > li > a {
		/*
		 * Two-word titles stay side-by-side
		 * whenever the cell has enough space.
		 */
		flex-direction: row;
		flex-wrap: wrap;
		align-content: center;
		min-height: 44px;
		padding:
			7px 8px;
		font-size: 13px;
		line-height: 1.15;
		letter-spacing: .9px;
		white-space: normal;
	}
	.navbar-custom .nav > li > a .menuLine {
		display: inline-block;
	}
	.navbar-custom .nav > li > a .menuLine + .menuLine {
		margin-left: .4em;
	}
	/* -----------------------------------------------
	   UTILITY TAB
	----------------------------------------------- */
	.followTab {
		right: 48px;
	}
	.followTab a {
		min-width: 135px;
		padding: 9px 14px 4px;
		font-size: 17px;
	}
	.adminTab {
		right: 40px;
	}
}
/* ====================================================
   MOBILE
==================================================== */
@media (max-width: 768px) {
	#Subscribe {
		scroll-margin-top: 0;
	}
	.mainMenu {
		background: var(--color-background-light);
	}
	.menuInner {
		padding:
			7px 22px;
	}
	/* Hide desktop utility tabs */
	.followTab, .adminTab {
		display: none;
	}
	/* Hide desktop logo */
	.desktopMenuLogo {
		display: none;
	}
	.desktopMenuGrid {
		display: block;
		width: 100%;
	}
	.mobileMenuHeader {
		display: grid;
		grid-template-columns:
			minmax(0, 1fr) auto minmax(0, 1fr);
		align-items: center;
		width: 100%;
		min-height: 74px;
		padding: 0 8px;
	}
	/* -----------------------------------------------
	   MOBILE MENU BUTTON
	----------------------------------------------- */
	.mobileMenuButton {
		float: none !important;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 7px;
		width: auto;
		margin: 0;
		padding: 8px 2px;
		border: 0;
		background: transparent;
		font-family: var(--font-main);
		font-size: 12px;
		font-weight: 400;
		line-height: 1;
		letter-spacing: 1px;
		text-transform: uppercase;
		color: var(--color-primary);
	}
	.mobileMenuButton:hover, .mobileMenuButton:focus {
		color: var(--color-secondary);
		background: transparent;
		outline: none;
	}
	.mobileMenuIcon {
		font-family: Arial, sans-serif;
		font-size: 21px;
		line-height: 1;
	}
	/* -----------------------------------------------
	   MOBILE LOGO
	----------------------------------------------- */
	.mobileLogo {
		display: block;
		margin: 0 auto;
		text-align: center;
	}
	.mobileLogo img {
		display: block;
		width: 88px;
		height: auto;
		margin: 0 auto;
	}
	/* -----------------------------------------------
	   MOBILE FOLLOW
	----------------------------------------------- */
	.mobileFollow {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		gap: 5px;
		width: auto;
		margin: 0;
		padding: 8px 2px;
		font-family: var(--font-main);
		font-size: 12px;
		line-height: 1;
		letter-spacing: 1px;
		text-transform: uppercase;
		color: var(--color-primary);
		text-decoration: none;
	}
	.mobileFollow:hover, .mobileFollow:focus {
		color: var(--color-secondary);
		text-decoration: none;
	}
	.mobileFollowIcon {
		font-family: Georgia, serif;
		font-size: 18px;
		line-height: 1;
		color: var(--color-secondary);
	}
	.mobileHeaderSpacer {
		display: block;
		width: 100%;
	}
	/* -----------------------------------------------
	   MOBILE COLLAPSE
	----------------------------------------------- */
	.navbar-custom {
		width: 100%;
		margin: 0;
		padding: 0;
	}
	.navbar-collapse {
		width: 100%;
		margin: 0;
		padding: 0;
		border: 0;
		box-shadow: none;
	}
	/* -----------------------------------------------
	   MOBILE PUBLIC MENU
	----------------------------------------------- */
	.navbar-custom .menuLeft, .navbar-custom .menuRight {
		display: block;
		width: 100%;
		margin: 0;
		text-align: center;
	}
	.navbar-custom .nav > li {
		display: block;
		width: 100%;
		height: auto;
	}
	.navbar-custom .nav > li > a {
		display: block;
		width: 100%;
		min-height: 0;
		padding: 13px 10px;
		font-size: 16px;
		line-height: 1.3;
		text-align: center;
		white-space: normal;
	}
	.navbar-custom .nav > li > a .menuLine {
		display: inline;
	}
	.navbar-custom .nav > li > a .menuLine + .menuLine {
		margin-left: 0;
	}
	.navbar-custom .nav > li > a .menuLine + .menuLine:before {
		content: " ";
	}
	.navbar-custom .nav > li > a:after {
		display: none;
	}
	/* -----------------------------------------------
	   MOBILE DROPDOWNS
	----------------------------------------------- */
	.navbar-custom .dropdown-menu {
		position: static;
		float: none;
		width: 100%;
		margin: 0;
		padding:
			5px 0;
		text-align: center;
		background:
			rgba(111, 59, 86, .05);
		box-shadow: none;
	}
	.navbar-custom .dropdown-menu > li > a {
		padding: 11px 10px;
		text-align: center;
	}
	/* Reset right-side positioning on mobile */
	.navbar-custom .menuRight > li.dropdown > .dropdown-menu {
		left: auto;
		right: auto;
	}
	/* -----------------------------------------------
	   MORE ON MOBILE
	----------------------------------------------- */
	.moreMenu > .dropdown-menu {
		width: 100%;
		min-width: 0;
	}
	.moreMenu > .dropdown-menu > li > a {
		text-align: center;
	}
	.moreMenu > .dropdown-menu > .dropdown > a {
		text-align: center;
	}
	.moreMenu > .dropdown-menu > .dropdown > .dropdown-menu {
		padding-left: 0;
	}
	/* ================================================
	   MOBILE ADMIN AREA

	   Always appears at the BOTTOM of opened menu.
	================================================ */
	.mobileAdminMenu {
		float: none !important;
		width: 100% !important;
		margin: 12px 0 0 !important;
		padding: 12px 0 4px !important;
		border-top: 1px solid rgba(111, 59, 86, .18);
		text-align: center;
	}
	.mobileAdminMenu:before {
		content: "SITE ADMIN";
		display: block;
		margin-bottom: 6px;
		font-family: var(--font-Headings);
		font-size: 15px;
		font-style: italic;
		letter-spacing: .5px;
		color: var(--color-secondary);
	}
	.mobileAdminMenu > li {
		float: none;
		display: block;
		width: 100%;
	}
	.mobileAdminMenu > li > a {
		display: block;
		padding: 9px 10px;
		font-family: var(--font-main);
		font-size: 12px;
		letter-spacing: .8px;
		text-align: center;
		text-transform: uppercase;
		color: var(--color-primary);
	}
}
/* =========================================================
   BOOKS & PROJECTS GRID OVERRIDES
========================================================= */
#Main .grid .sbox {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}
#Main .grid .strwell {
	position: relative;
	max-width: 300px;
	margin-left: auto;
	margin-right: auto;
	padding: 20px 16px 68px !important;
}
#Main .grid .strbutton {
	position: absolute;
	left: 16px;
	right: 16px;
	bottom: 18px;
	padding: 0;
	background: none;
	text-align: center;
}
/* =========================================================
   BOOK CARD TITLE OVERRIDES
========================================================= */
#Main .grid .str_prd_name {
	font-family: var(--font-Headings);
	font-size: 25px;
	font-weight: 600;
	line-height: 1.05;
	min-height: 54px;
	margin: 22px 0 18px;
	display: flex;
	align-items: center;
	justify-content: center;
}
/* =========================================================
   PAGE WIDTH / SPACING
========================================================= */
#Main:has(.blogContent) {
	width: 90%;
	max-width: 1450px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 65px;
	padding-bottom: 90px;
}
/* =========================================================
   DESKTOP COLUMNS
========================================================= */
@media(min-width: 992px) {
	#Main:has(.blogContent) > .row {
		display: flex;
		align-items: flex-start;
	}
	#Main:has(.blogContent) > .row > .blogContent, #Main:has(.blogContent) > .row > #BlogTopics {
		float: none;
	}
}
/* =========================================================
   MAIN ARTICLE COLUMN
========================================================= */
.blogContent {
	position: relative;
	z-index: 0;
	padding-right: 40px;
}
/* =========================================================
   ARTICLE TITLE
========================================================= */
.blogContent > h2 {
	position: relative;
	margin: 0 0 8px;
	font-family: var(--font-Headings);
	font-size: 48px;
	font-weight: 400;
	line-height: 1.03;
	color: var(--color-primary);
	overflow: visible;
	z-index: 1;
}
/* Remove old botanical from article title */
.blogContent > h2:before {
	display: none !important;
	content: none !important;
	background: none !important;
}
/* =========================================================
   DATE / AUTHOR
========================================================= */
.blogContent > h2 small {
	display: block;
	position: relative;
	margin: 12px 0 0;
	font-family: var(--font-main);
	font-size: 12px;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 1.4px;
	text-transform: none;
	color: var(--color-muted-accent);
	z-index: 2;
}
.blogContent > h2 small:after {
	display: none !important;
	content: none !important;
}
/* =========================================================
   ARTICLE CATEGORY
========================================================= */
.catHolder {
	display: flex;
	align-items: center;
	width: 100%;
	gap: 18px;
	margin: 22px 0 32px;
	padding: 0;
	background: transparent;
	border: 0;
	font-family: var(--font-main);
	font-size: 11px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 2px;
	color: var(--color-dark-bg);
	text-transform: uppercase !important;
}
.catHolder:after {
	content: "";
	flex: 1 1 auto;
	height: 1px;
	background: var(--color-accent);
	opacity: .65;
}
.catHolder strong {
	color: var(--color-primary);
}
/* =========================================================
   ARTICLE BODY
========================================================= */
#blogAudioText {
	position: relative;
	display: flow-root;
	margin: 0;
	padding: 38px 40px 42px;
	background: #fff;
	border: 1px solid rgba(var(--color-dark-bg-rgb), .14);
	box-shadow: none;
	overflow: visible;
	z-index: 0;
	line-height: 1.55;
}
/* Partial gold line - same visual language as new wells */
#blogAudioText:before {
	display: block !important;
	content: "" !important;
	position: absolute;
	top: -1px;
	left: -1px;
	width: 34%;
	height: 3px;
	background: var(--color-accent);
	pointer-events: none;
}
/* Remove old offset border */
#blogAudioText:after {
	display: none !important;
	content: none !important;
}
/* =========================================================
   ARTICLE TEXT
========================================================= */
#blogAudioText p {
	margin-top: 0;
	margin-bottom: 24px;
	line-height: 1.55;
}
#blogAudioText p:last-child {
	margin-bottom: 0;
}
#blogAudioText ul, #blogAudioText ol {
	margin-top: 18px;
	margin-bottom: 26px;
}
#blogAudioText li {
	margin-bottom: 8px;
	line-height: 1.5;
}
#blogAudioText strong {
	color: var(--color-dark-bg);
}
#blogAudioText em {
	color: inherit;
}
/* =========================================================
   ARTICLE LINKS
========================================================= */
#blogAudioText a {
	color: var(--color-secondary);
	text-decoration: none;
}
#blogAudioText a:hover, #blogAudioText a:focus {
	color: var(--color-primary);
	text-decoration: underline;
}
/* =========================================================
   ARTICLE IMAGES
========================================================= */
#blogAudioText img {
	max-width: 100% !important;
	height: auto !important;
}
#blogAudioText img.alignleft {
	margin: 4px 24px 18px 0 !important;
}
#blogAudioText img.alignright {
	margin: 4px 0 18px 24px !important;
}
/* =========================================================
   SHARE AREA
========================================================= */
.shrCR {
	margin-top: 38px;
}
.shr_class {
	min-height: 38px;
}
.social-share {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 10px;
	margin-bottom: 25px;
}
.social-share .btn {
	margin: 0;
}
/* =========================================================
   ARTICLE BOTTOM DIVIDER
========================================================= */
.blogContent > hr {
	width: 100%;
	height: 1px;
	margin: 38px 0 0;
	border: 0;
	background:
		rgba(var(--color-dark-bg-rgb), .15);
}
/* =========================================================
   COMMENT BUTTON ROW
========================================================= */
.blogContent > hr + .row, .blogContent > hr + hr + .row {
	display: flex !important;
	align-items: center;
	width: 100%;
	margin: 24px 0 0 !important;
	padding: 0;
}
.blogContent > hr + .row > .col-sm-12, .blogContent > hr + hr + .row > .col-sm-12 {
	float: none;
	width: auto;
	padding: 0;
}
.blogContent > hr + .row > .col-sm-12:first-child, .blogContent > hr + hr + .row > .col-sm-12:first-child {
	margin-right: auto;
}
.blogContent > hr + .row > .col-sm-12:last-child, .blogContent > hr + hr + .row > .col-sm-12:last-child {
	margin-left: auto;
	text-align: right;
}
.blogContent > hr + .row .btn, .blogContent > hr + hr + .row .btn {
	margin: 0 !important;
}
/* =========================================================
   COMMENTS
========================================================= */
.blogContent .BlogComments.well {
	position: relative;
	margin: 30px 0 20px;
	padding: 30px;
	background: var(--color-soft-bg) !important;
	background-image: none !important;
	border: 1px solid rgba(var(--color-dark-bg-rgb), .14) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}
/* Keep comment well accent consistent */
.blogContent .BlogComments.well:before {
	content: "";
	position: absolute;
	top: -1px;
	left: -1px;
	width: 34%;
	height: 3px;
	background: var(--color-accent);
}
.blogContent .BlogComments[style*="margin-left"] {
	width: 94%;
	margin-left: 6% !important;
}
/* =========================================================
   COMMENT HEADINGS
========================================================= */
.BlogComments h4, .BlogComments h4 small, .BlogComments .blogCommentTitle, .BlogComments .blogCommentAuthor {
	font-family: var(--font-Headings);
	font-size: 24px;
	font-weight: 400;
	line-height: 1.2;
	color: var(--color-dark-bg) !important;
}
.BlogComments h4 small {
	display: inline;
	margin: 0;
	letter-spacing: 0;
	text-transform: none;
	color: var(--color-dark-bg) !important;
}
/* =========================================================
   SIDEBAR
========================================================= */
#BlogTopics {
	position: relative;
	padding-left: 20px;
	color: var(--color-body-text);
}
#BlogTopics hr {
	display: none;
}
/* =========================================================
   PREVIOUS POSTS CARD
========================================================= */
#BlogTopics > h3 {
	position: relative;
	margin: 0;
	padding: 26px 22px 20px;
	background: var(--color-soft-bg) !important;
	border: 1px solid rgba(var(--color-dark-bg-rgb), .14);
	border-bottom: 0;
	border-radius: 0;
	font-family: var(--font-Headings);
	font-size: 30px;
	font-weight: 400;
	line-height: 1;
	color: var(--color-dark-bg);
	text-transform: none !important;
	overflow: hidden;
}
/* Kill old texture */
#BlogTopics > h3:after {
	display: none !important;
	content: none !important;
	background: none !important;
}
/* Gold partial line */
#BlogTopics > h3:before {
	display: block !important;
	content: "" !important;
	position: absolute;
	top: -1px;
	left: -1px;
	width: 34%;
	height: 3px;
	background: var(--color-accent) !important;
}
/* =========================================================
   PREVIOUS POSTS LIST
========================================================= */
#BlogTopics #itemContainer {
	position: relative;
	margin: 0 0 38px;
	background: var(--color-soft-bg) !important;
	border: 1px solid rgba(var(--color-dark-bg-rgb), .14);
	border-top: 0;
	border-radius: 0;
	box-shadow: none;
	overflow: hidden;
}
/* Remove old fabric */
#BlogTopics #itemContainer:after {
	display: none !important;
	content: none !important;
	background: none !important;
}
/* Individual posts */
#BlogTopics #itemContainer > p {
	position: relative;
	margin: 0;
	padding: 17px 20px;
	background: transparent;
	border-bottom:
		1px solid rgba(var(--color-dark-bg-rgb), .10);
	text-align: left;
	text-transform: none !important;
	transition:
		background-color .25s ease, padding-left .25s ease;
}
#BlogTopics #itemContainer > p:last-child {
	border-bottom: 0;
}
#BlogTopics #itemContainer > p:hover {
	padding-left: 24px;
	background:
		color-mix(in srgb, var(--color-light-accent) 18%, transparent);
}
/* =========================================================
   PREVIOUS POST TITLES
========================================================= */
#BlogTopics #itemContainer > p > a {
	display: block;
	margin-bottom: 7px;
	font-family: var(--font-Headings);
	font-size: 19px;
	font-weight: 500;
	line-height: 1.18;
	color: var(--color-dark-bg) !important;
	text-decoration: none;
	text-transform: none !important;
}
#BlogTopics #itemContainer > p > a:hover, #BlogTopics #itemContainer > p > a:focus {
	color: var(--color-secondary) !important;
	text-decoration: none;
}
#BlogTopics #itemContainer b {
	font-weight: 500;
	text-transform: none !important;
}
/* =========================================================
   SIDEBAR AUTHOR / DATE
========================================================= */
#BlogTopics .blogWhoInfo br, #BlogTopics .blogDateInfo br {
	display: none;
}
#BlogTopics .blogWhoInfo, #BlogTopics .blogDateInfo {
	/*display: inline;*/
	display: none;
	font-family: var(--font-main);
	font-size: 10px;
	font-style: normal !important;
	line-height: 1.35;
	text-transform: none !important;
}
#BlogTopics .blogWhoInfo {
	color: var(--color-body-text);
}
#BlogTopics .blogDateInfo {
	color: var(--color-primary);
}
#BlogTopics .blogDateInfo:before {
	content: "|";
	display: inline-block;
	margin: 0 6px;
	color: rgba(var(--color-dark-bg-rgb), .35);
}
/* =========================================================
   PAGINATION
========================================================= */
#BlogTopics center {
	display: block;
	margin: 0;
	padding: 0;
	text-align: left;
}
#BlogTopics .pagination {
	display: inline-block;
	float: none;
	margin: 4px 0 32px !important;
	padding: 0;
}
#BlogTopics .pagination > li > a, #BlogTopics .pagination > li > span {
	background: #fff;
	border-color:
		rgba(var(--color-dark-bg-rgb), .18);
	color: var(--color-dark-bg);
	box-shadow: none;
}
#BlogTopics .pagination > li > a:hover, #BlogTopics .pagination > li > a:focus, #BlogTopics .pagination > .active > a, #BlogTopics .pagination > .active > span, #BlogTopics .pagination > .jp-current {
	background: var(--color-primary) !important;
	border-color: var(--color-primary) !important;
	color: #fff !important;
}
/* =========================================================
   BLOG CATEGORIES CARD
========================================================= */
#BlogTopics .panel.panel-default {
	position: relative;
	margin: 0 0 40px;
	background: var(--color-soft-bg) !important;
	background-image: none !important;
	border: 1px solid rgba(var(--color-dark-bg-rgb), .14) !important;
	border-radius: 0;
	box-shadow: none;
	overflow: hidden;
}
/* Remove old fabric */
#BlogTopics .panel.panel-default:after {
	display: none !important;
	content: none !important;
	background: none !important;
}
/* Sage partial line */
#BlogTopics .panel.panel-default:before {
	display: block !important;
	content: "" !important;
	position: absolute;
	top: -1px;
	left: -1px;
	width: 34%;
	height: 3px;
	background: var(--color-muted-accent) !important;
	z-index: 2;
}
/* =========================================================
   BLOG CATEGORIES HEADING
========================================================= */
#BlogTopics .panel.panel-default > .panel-heading {
	position: relative;
	margin: 0;
	padding: 26px 22px 20px;
	background: transparent !important;
	border: 0 !important;
	border-bottom:
		1px solid rgba(var(--color-dark-bg-rgb), .10) !important;
	border-radius: 0;
	font-family: var(--font-Headings);
	font-size: 30px;
	font-weight: 400;
	line-height: 1;
	color: var(--color-dark-bg);
	text-transform: none !important;
}
#BlogTopics .panel-heading:before, #BlogTopics .panel-heading:after {
	display: none !important;
	content: none !important;
}
/* =========================================================
   BLOG CATEGORY LINKS
========================================================= */
#BlogTopics .panel-body {
	padding: 0;
	background: transparent;
	border: 0;
}
#BlogTopics .panel-body a, #BlogTopics .list-group-item a {
	display: block;
	font-family: var(--font-main);
	font-size: 15px;
	font-style: normal !important;
	line-height: 1.35;
	padding: 15px 20px;
	background: transparent;
	color: var(--color-body-text);
	text-decoration: none;
	text-transform: none;
	transition:
		background-color .25s ease, color .25s ease, padding-left .25s ease;
}
#BlogTopics .panel-body a:hover, #BlogTopics .panel-body a:focus, #BlogTopics .list-group-item a:hover, #BlogTopics .list-group-item a:focus {
	padding-left: 24px;
	background:
		color-mix(in srgb, var(--color-light-accent) 18%, transparent);
	color: var(--color-primary);
	text-decoration: none;
}
#BlogTopics .list-group {
	margin: 0;
	padding: 0;
}
#BlogTopics .list-group-item {
	margin: 0;
	padding: 0;
	background: transparent;
	border: 0;
	border-top:
		1px solid rgba(var(--color-dark-bg-rgb), .10);
	border-radius: 0;
}
/* =========================================================
   COMMENT MODAL
========================================================= */
#comment .modal-content, #commentclose .modal-content {
	background: var(--color-background-light);
	border:
		1px solid rgba(var(--color-dark-bg-rgb), .18);
	border-radius: 0;
	box-shadow:
		0 18px 45px rgba(var(--color-dark-bg-rgb), .12);
	overflow: hidden;
}
#comment .modal-header, #commentclose .modal-header {
	padding: 22px 25px;
	background: var(--color-soft-bg);
	border: 0;
	border-bottom:
		1px solid rgba(var(--color-dark-bg-rgb), .12);
}
#comment .modal-title, #commentclose .modal-title {
	margin: 0;
	color: var(--color-dark-bg);
}
#comment .close, #commentclose .close {
	color: var(--color-dark-bg);
	opacity: .7;
	text-shadow: none;
}
#comment .close:hover, #commentclose .close:hover {
	opacity: 1;
}
#comment .modal-body, #commentclose .modal-body {
	padding: 28px;
}
#comment .input-group-addon {
	background: var(--color-soft-bg);
	border-color:
		rgba(var(--color-dark-bg-rgb), .20);
	color: var(--color-dark-bg);
}
#comment .form-control {
	background: #fff;
	border-color:
		rgba(var(--color-dark-bg-rgb), .20);
	border-radius: 0;
	box-shadow: none;
	color: var(--color-body-text);
}
#comment .form-control:focus {
	border-color: var(--color-secondary);
	box-shadow: none;
}
#comment .modal-footer, #commentclose .modal-footer {
	padding: 18px 25px;
	background: var(--color-background-light);
	border-top:
		1px solid rgba(var(--color-dark-bg-rgb), .12);
}
/* =========================================================
   TABLET
========================================================= */
@media(max-width: 991px) {
	#Main:has(.blogContent) {
		width: 92%;
		padding-top: 55px;
		padding-bottom: 80px;
	}
	.blogContent {
		padding-left: 15px;
		padding-right: 15px;
	}
	#blogAudioText {
		padding: 34px 32px 38px;
	}
	#BlogTopics {
		margin-top: 60px;
		padding-left: 15px;
		padding-right: 15px;
	}
}
/* =========================================================
   MOBILE
========================================================= */
@media(max-width: 767px) {
	#Main:has(.blogContent) {
		width: 100%;
		padding-top: 40px;
		padding-bottom: 65px;
	}
	.blogContent {
		padding-left: 20px;
		padding-right: 20px;
	}
	.blogContent > h2 {
		font-size: 38px;
		line-height: 1.04;
	}
	.blogContent > h2 small {
		font-size: 10px;
		letter-spacing: 1px;
	}
	.catHolder {
		gap: 14px;
		margin-top: 18px;
		margin-bottom: 26px;
		font-size: 10px;
		letter-spacing: 1.5px;
	}
	#blogAudioText {
		padding: 29px 23px 32px;
	}
	#blogAudioText:before {
		width: 45%;
	}
	/* Old imported floated images become full-width */
	#blogAudioText img {
		float: none !important;
		display: block !important;
		width: auto !important;
		max-width: 100% !important;
		height: auto !important;
		margin: 25px auto 28px !important;
	}
	/* Comment row */
	.blogContent > hr + .row, .blogContent > hr + hr + .row {
		display: block !important;
	}
	.blogContent > hr + .row > .col-sm-12, .blogContent > hr + hr + .row > .col-sm-12 {
		width: 100%;
		text-align: center !important;
	}
	.blogContent > hr + .row .btn, .blogContent > hr + hr + .row .btn {
		margin-top: 15px !important;
	}
	/* Social share */
	.social-share {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 8px;
	}
	.social-share .btn {
		width: 100%;
	}
	/* Comments */
	.blogContent .BlogComments.well {
		padding: 24px 22px;
	}
	.blogContent .BlogComments[style*="margin-left"] {
		width: 95%;
		margin-left: 5% !important;
	}
	/* Sidebar */
	#BlogTopics {
		margin-top: 55px;
		padding-left: 20px;
		padding-right: 20px;
	}
	#BlogTopics > h3, #BlogTopics .panel.panel-default > .panel-heading {
		padding: 23px 18px 17px;
		font-size: 27px;
	}
	#BlogTopics #itemContainer > p, #BlogTopics .panel-body a, #BlogTopics .list-group-item a {
		padding-left: 18px;
		padding-right: 18px;
	}
}
/* =========================================================
   SMALL MOBILE
========================================================= */
@media(max-width: 480px) {
	.blogContent {
		padding-left: 15px;
		padding-right: 15px;
	}
	.blogContent > h2 {
		font-size: 34px;
	}
	#blogAudioText {
		padding: 26px 19px 29px;
	}
	.social-share {
		grid-template-columns: 1fr;
	}
	#BlogTopics {
		padding-left: 15px;
		padding-right: 15px;
	}
}
/* -------HOME TOP ----------*/
.homeTop {
	position: relative;
	width: 100%;
	max-width: 2200px;
	height: calc(90vh - 200px);
	min-height: 520px;
	margin: 0 auto;
	overflow: hidden;
	background: #fff;
}
/* ==================================================
   IMAGE
================================================== */
.heroPicture {
	position: absolute;
	inset: 0;
	display: block;
}
.heroPicture img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	object-position: center center;
}
/* ==================================================
   SOFT DIAGONAL WHITE WASH

   No clip-path and no hard line.

   The transparent portion extends well into the
   center before gradually building toward white.

   Because the gradient is angled, the fade reaches
   farther left near the top and stays farther right
   near the bottom, preserving the books/table.
================================================== */
.heroWash {
	position: absolute;
	z-index: 1;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(122deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 37%, rgba(255, 255, 255, .05) 42%, rgba(255, 255, 255, .14) 47%, rgba(255, 255, 255, .28) 52%, rgba(255, 255, 255, .46) 58%, rgba(255, 255, 255, .61) 65%, rgba(255, 255, 255, .70) 74%, rgba(255, 255, 255, .72) 86%, rgba(255, 255, 255, .66) 100%);
}
/* ==================================================
   TEXT
================================================== */
.heroText {
	position: absolute;
	z-index: 3;
	top: 42%;
	right: 7%;
	width: 43%;
	transform: translateY(-50%);
	text-align: center;
}
.heroText h1 {
	margin: 0 0 28px;
	color: var(--color-primary);
	font-size: clamp(34px, 3vw, 58px);
	line-height: 1.17;
	font-weight: normal;
}
/* ==================================================
   GOLD DIVIDER
================================================== */
.heroDivider {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	margin: 0 auto 24px;
	color: var(--color-accent);
}
.heroDivider span {
	display: block;
	width: 105px;
	height: 1px;
	background: var(--color-accent);
}
.heroDivider em {
	color: var(--color-accent);
	font-size: 27px;
	line-height: 1;
	font-style: normal;
}
/* ==================================================
   WRITER | EDITOR | SPEAKER
================================================== */
.heroRoles {
	font-size: 17px;
	letter-spacing: 2px;
	white-space: nowrap;
}
.heroRoles a {
	color: var(--color-primary);
	text-decoration: none;
	transition: color .2s ease;
}
.heroRoles a:hover {
	color: var(--color-accent);
	text-decoration: none;
}
.heroRoles b {
	margin: 0 15px;
	color: var(--color-primary);
	font-weight: normal;
}
/* ==================================================
   LARGE / WIDE DESKTOP
================================================== */
@media (min-width: 1700px) {
	.heroText {
		top: 43%;
		right: 15%;
		width: 42%;
	}
	.heroRoles {
		font-size: 19px;
		text-shadow:
			0 0 10px #fff, 0 0 18px #fff, 0 0 28px #fff, 0 0 38px rgba(255, 255, 255, .9);
	}
	/*
       Slightly stronger angle on very wide screens.
       Still fully transparent before the transition.
    */
	.heroWash {
		background: linear-gradient(124deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 38%, rgba(255, 255, 255, .04) 43%, rgba(255, 255, 255, .13) 48%, rgba(255, 255, 255, .27) 53%, rgba(255, 255, 255, .45) 59%, rgba(255, 255, 255, .60) 66%, rgba(255, 255, 255, .70) 75%, rgba(255, 255, 255, .72) 87%, rgba(255, 255, 255, .65) 100%);
	}
}
/* ==================================================
   SMALL DESKTOP / LAPTOP
================================================== */
@media (max-width: 1200px) {
	.homeTop {
		height: 500px;
		min-height: 0;
	}
	.heroText {
		top: 43%;
		right: 3%;
		width: 46%;
	}
	.heroText h1 {
		font-size: 40px;
	}
	.heroWash {
		background: linear-gradient(118deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 34%, rgba(255, 255, 255, .08) 42%, rgba(255, 255, 255, .24) 49%, rgba(255, 255, 255, .45) 57%, rgba(255, 255, 255, .62) 67%, rgba(255, 255, 255, .70) 80%, rgba(255, 255, 255, .64) 100%);
	}
}
/* ==================================================
   TABLET
================================================== */
@media (max-width: 900px) {
	.heroText h1 {
		font-size: 34px;
	}
	.heroRoles {
		font-size: 14px;
		letter-spacing: 1px;
	}
	.heroRoles b {
		margin: 0 8px;
	}
	.heroDivider span {
		width: 75px;
	}
}
/* ==================================================
   MOBILE
================================================== */
@media (max-width: 767px) {
	.homeTop {
		height: auto;
		min-height: 0;
		overflow: visible;
	}
	.heroPicture {
		position: relative;
	}
	.heroPicture img {
		width: 100%;
		height: auto;
		object-fit: initial;
	}
	.heroWash {
		display: none;
	}
	.heroText {
		position: relative;
		top: auto;
		right: auto;
		width: 100%;
		transform: none;
		padding: 35px 20px 40px;
		background: #fff;
	}
	.heroText h1 {
		margin-bottom: 25px;
		font-size: 32px;
	}
	.heroRoles {
		font-size: 14px;
		letter-spacing: 1px;
		white-space: normal;
	}
	.heroRoles b {
		margin: 0 7px;
	}
	.heroDivider {
		gap: 15px;
	}
	.heroDivider span {
		width: 70px;
	}
}
/* --- Home PAths ---*/
.homePaths {
	padding: 70px 35px;
	background: var(--color-soft-bg);
}
.pathCardLine {
	width: 65px;
	height: 2px;
	margin: 8px auto 10px;
	background: var(--color-accent);
}
.homePathCard {
	display: block;
	max-width: 430px;
	margin: 0 auto 30px;
	padding: 16px;
	background: var(--color-background-light);
	text-align: center;
	text-decoration: none;
	transition: transform .25s ease, box-shadow .25s ease;
}
.homePathCard:hover {
	transform: translateY(-5px);
	box-shadow: 0 12px 30px rgba(74, 48, 64, .14);
	text-decoration: none;
}
.homePathImage {
	height: 390px;
	overflow: hidden;
}
.homePathImage img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.homePathContent {
	padding: 24px 10px 18px;
}
.homePathContent h2 {
	margin: 0 0 5px;
	font-family: var(--font-Headings);
	font-size: 34px;
	font-weight: normal;
	color: var(--color-primary);
}
.homePathContent p {
	margin: 0;
	font-family: var(--font-main);
	font-size: 14px;
	letter-spacing: 1px;
	color: var(--color-body-text);
}
@media (max-width: 991px) {
	.homePathImage {
		height: 330px;
	}
}
@media (max-width: 767px) {
	.homePaths {
		padding: 45px 20px;
	}
}
/* =========================================================
   HOME SIGNUP / FREE RESOURCES
========================================================= */
.mainSignup {
	position: relative;
	width: 92%;
	max-width: 1600px;
	margin: 110px auto 110px;
	padding: 0;
	background: transparent;
}
/* =========================================================
   MAIN FRAME
========================================================= */
.mainSignupInner {
	position: relative;
	display: flex;
	align-items: stretch;
	width: 100%;
	background: var(--color-background-light);
	border: 1px solid rgba(var(--color-dark-bg-rgb), .14);
	overflow: hidden;
}
/* =========================================================
   LEFT: FREE RESOURCE LIBRARY
========================================================= */
.mainSignupResources {
	position: relative;
	width: 46%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 55px 3.5vw 60px;
	background:
		color-mix(in srgb, var(--color-light-accent) 11%, var(--color-background-light));
}
.mainSignupResourcesInner {
	width: 100%;
	max-width: 590px;
	margin: 0 auto;
}
/* Resource heading */
.mainSignupResourcesTitle {
	margin: 0 0 30px;
	text-align: center;
}
.mainSignupResourcesTitle small {
	display: block;
}
/* =========================================================
   RESOURCE GRID
========================================================= */
.mainSignupResourceGrid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: start;
	gap: 18px;
	width: 100%;
	max-width: 540px;
	margin: 0 auto;
}
.mainSignupResource {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	min-width: 0;
	padding: 9px;
	background: #fff;
	border: 1px solid rgba(var(--color-dark-bg-rgb), .12);
	box-shadow:
		0 5px 18px rgba(var(--color-dark-bg-rgb), .045);
}
.mainSignupResource img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 315px;
	margin: 0 auto;
	object-fit: contain;
}
/* =========================================================
   RIGHT: SIGNUP CONTENT
========================================================= */
.mainSignupContent {
	position: relative;
	width: 54%;
	display: flex;
	align-items: center;
	padding: 65px 5vw;
	background: var(--color-background-light);
}
.mainSignupText {
	position: relative;
	width: 100%;
	max-width: 650px;
	margin: 0 auto;
}
/* =========================================================
   SMALL HEADING + LINE
========================================================= */
.mainSignupEyebrow {
	display: flex;
	align-items: center;
	gap: 18px;
	margin-bottom: 10px;
}
.mainSignupEyebrow small {
	flex: 0 0 auto;
}
.mainSignupEyebrow:after {
	content: "";
	display: block;
	flex: 1 1 auto;
	height: 1px;
	background: var(--color-secondary);
	opacity: .65;
}
/* =========================================================
   TEXT
========================================================= */
.mainSignupText h2 {
	margin-top: 0;
}
.mainSignupText p {
	margin: 0 0 22px;
}
.mainSignupResourceNote {
	margin-top: 25px;
	padding-left: 17px;
	border-left: 2px solid var(--color-accent);
	color: var(--color-primary);
}
/* =========================================================
   FORM
========================================================= */
.mainSignupForm {
	position: relative;
	width: 100%;
	margin-top: 27px;
}
.mainSignupForm .form-group {
	margin: 0;
}
.mainSignupForm .form-control {
	width: 100%;
	height: 50px;
	margin: 0 0 14px;
	padding: 10px 15px;
	background: #fff;
	border: 1px solid rgba(var(--color-dark-bg-rgb), .4);
	border-radius: var(--btn-radius);
	box-shadow: none;
	color: var(--color-body-text);
}
.mainSignupForm .form-control:focus {
	background: #fff;
	border-color: var(--color-secondary);
	box-shadow: none;
	outline: none;
}
.mainSignupForm .form-control::placeholder {
	color: var(--color-body-text);
	opacity: .7;
}
.mainSignupForm button {
	margin-top: 4px;
}
.mainSignupFinePrint {
	margin-top: 11px !important;
	opacity: .75;
}
/* =========================================================
   TABLET
========================================================= */
@media(max-width: 991px) {
	.mainSignup {
		width: 90%;
		margin-top: 90px;
		margin-bottom: 90px;
	}
	.mainSignupInner {
		display: block;
	}
	.mainSignupResources, .mainSignupContent {
		width: 100%;
	}
	.mainSignupResources {
		padding: 55px 7vw 60px;
	}
	.mainSignupResourcesInner {
		max-width: 600px;
	}
	.mainSignupResourceGrid {
		max-width: 520px;
	}
	.mainSignupResource img {
		max-height: 290px;
	}
	.mainSignupContent {
		padding: 60px 7vw 65px;
	}
	.mainSignupText {
		max-width: 720px;
	}
}
/* =========================================================
   MOBILE
========================================================= */
@media(max-width: 767px) {
	.mainSignup {
		width: auto;
		margin: 70px 20px;
	}
	.mainSignupResources {
		padding: 45px 22px 50px;
	}
	.mainSignupResourcesTitle {
		margin-bottom: 25px;
	}
	.mainSignupResourceGrid {
		max-width: 420px;
		gap: 12px;
	}
	.mainSignupResource {
		padding: 7px;
	}
	.mainSignupResource img {
		max-height: 245px;
	}
	.mainSignupContent {
		padding: 48px 28px 52px;
	}
	.mainSignupEyebrow {
		gap: 12px;
	}
	.mainSignupForm button {
		width: 100%;
	}
}
/* =========================================================
   SMALL MOBILE
========================================================= */
@media(max-width: 480px) {
	.mainSignupResources {
		padding-left: 15px;
		padding-right: 15px;
	}
	.mainSignupResourceGrid {
		gap: 9px;
	}
	.mainSignupResource {
		padding: 5px;
	}
	.mainSignupResource img {
		max-height: 210px;
	}
	.mainSignupContent {
		padding-left: 22px;
		padding-right: 22px;
	}
}
/*========================================================
  ENDORSEMENTS
========================================================*/
.contentNoTilt {
	position: relative;
	margin: 0;
	padding: 65px 25px;
	min-height: 560px;
	background-image: url("/tempimg/Marti_End_Wide.png");
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	color: var(--color-body-text);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}
/*--------------------------------------------------------
  WHITE FADE OVER BACKGROUND
--------------------------------------------------------*/
.TiltCover {
	position: absolute;
	inset: 0;
	z-index: 1;
	/*
		Strong enough for the copy,
		but still lets the garden show through.
	*/
	background: linear-gradient(to right, rgba(255, 255, 255, .96) 0%, rgba(255, 255, 255, .92) 25%, rgba(255, 255, 255, .78) 45%, rgba(255, 255, 255, .40) 60%, rgba(255, 255, 255, .10) 72%, rgba(255, 255, 255, 0) 82%);
}
/*--------------------------------------------------------
  KEEP SCROLLREVEAL FROM TOUCHING TESTIMONIAL TEXT
--------------------------------------------------------*/
.sr .contentNoTilt p {
	visibility: visible !important;
	opacity: 1 !important;
	transform: none !important;
}
/*--------------------------------------------------------
  MAIN CONTENT AREA
--------------------------------------------------------*/
#contentCar {
	position: relative;
	z-index: 2;
	width: 100%;
}
.endorsementContent {
	width: 58%;
	max-width: 1100px;
	box-sizing: border-box;
	padding: 0 3vw;
}
/*========================================================
  CAROUSEL
========================================================*/
#contentSlide {
	width: 100%;
}
/*
	All items occupy the same grid cell.

	This makes the carousel automatically take the height
	of the tallest endorsement, so the indicators and
	button NEVER move when the quote changes.
*/
#contentSlide .carousel-inner {
	display: grid;
	width: 100%;
	overflow: visible;
}
/*
	Every endorsement remains in the grid so its height
	contributes to the overall carousel height.

	Opacity controls which one is visible.
*/
#contentSlide .carousel-inner > .item {
	grid-area: 1 / 1;
	display: flex !important;
	align-items: center;
	justify-content: center;
	position: relative !important;
	left: 0 !important;
	right: auto !important;
	width: 100%;
	opacity: 0;
	z-index: 1;
	pointer-events: none;
	-webkit-transform: none !important;
	transform: none !important;
	-webkit-transition: opacity .75s ease-in-out !important;
	transition: opacity .75s ease-in-out !important;
}
/* Current endorsement */
#contentSlide .carousel-inner > .item.active {
	opacity: 1;
	z-index: 2;
	pointer-events: auto;
}
/*--------------------------------------------------------
  BOOTSTRAP 3 FADE INSTEAD OF SLIDE
--------------------------------------------------------*/
/* Incoming next slide */
#contentSlide .carousel-inner > .item.next.left {
	left: 0 !important;
	opacity: 1;
	z-index: 3;
	-webkit-transform: none !important;
	transform: none !important;
}
/* Current slide fading out */
#contentSlide .carousel-inner > .item.active.left {
	left: 0 !important;
	opacity: 0;
	z-index: 2;
	-webkit-transform: none !important;
	transform: none !important;
}
/* Incoming previous slide */
#contentSlide .carousel-inner > .item.prev.right {
	left: 0 !important;
	opacity: 1;
	z-index: 3;
	-webkit-transform: none !important;
	transform: none !important;
}
/* Current slide fading out */
#contentSlide .carousel-inner > .item.active.right {
	left: 0 !important;
	opacity: 0;
	z-index: 2;
	-webkit-transform: none !important;
	transform: none !important;
}
/*
	Kill Bootstrap's normal horizontal positioning.
*/
#contentSlide .carousel-inner > .next, #contentSlide .carousel-inner > .prev, #contentSlide .carousel-inner > .active.left, #contentSlide .carousel-inner > .active.right {
	left: 0 !important;
	right: auto !important;
	-webkit-transform: none !important;
	transform: none !important;
}
/*========================================================
  ENDORSEMENT COPY
========================================================*/
.contentFlex {
	width: 100%;
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}
.contentText {
	width: 100%;
	padding: 10px 0;
	box-sizing: border-box;
}
/*
	Uses the site's normal BODY font and BODY size.
	No desktop font-size override.
*/
.endorsementQuote {
	width: 100%;
	margin: 0;
	padding: 0;
	text-align: center;
	color: var(--color-body-text);
	line-height: 1.65;
}
/* Truncated quote "more" link */
#contentCar .endorsementQuote a {
	color: var(--color-primary);
	text-decoration: none;
}
#contentCar .endorsementQuote a:hover, #contentCar .endorsementQuote a:focus, #contentCar .endorsementQuote a:active {
	color: var(--color-secondary);
	text-decoration: underline;
}
/*--------------------------------------------------------
  PERSON / ATTRIBUTION
--------------------------------------------------------*/
.contentFlex .contWho {
	margin: 18px 0 0 0;
	text-align: center;
	font-family: var(--font-Headings);
	font-size: inherit;
	line-height: 1.4;
	color: var(--color-primary);
}
/*--------------------------------------------------------
  STAR RATINGS
--------------------------------------------------------*/
.contentFlex .stars {
	margin-top: 12px;
	text-align: center;
	color: var(--color-accent);
	font-size: 22px;
}
.contentFlex .stars .fa-star {
	padding: 0 4px;
}
/*========================================================
  CAROUSEL DOTS
========================================================*/
#contentSlide .carousel-indicators {
	position: static;
	left: auto;
	right: auto;
	bottom: auto;
	width: auto;
	margin: 24px auto 0 auto;
	padding: 0;
	text-align: center;
	-webkit-transform: none;
	transform: none;
}
#contentSlide .carousel-indicators li {
	display: inline-block;
	width: 12px;
	height: 12px;
	margin: 0 5px;
	border: 2px solid var(--color-primary);
	border-radius: 50%;
	background: transparent;
	vertical-align: middle;
}
#contentSlide .carousel-indicators li.active {
	width: 12px;
	height: 12px;
	margin: 0 5px;
	border-color: var(--color-primary);
	background: var(--color-primary);
}
/*========================================================
  MORE ENDORSEMENTS BUTTON
========================================================*/
.endorsementMore {
	margin-top: 20px;
	text-align: center;
}
/*========================================================
  TABLET
========================================================*/
@media screen and (min-width: 768px) and (max-width: 1099px) {
	.contentNoTilt {
		min-height: 520px;
		padding: 60px 35px;
		background-position: right center;
		background-size: cover;
	}
	/*
		On tablet the white treatment covers the whole
		image so the endorsement can use full width.
	*/
	.TiltCover {
		background: rgba(255, 255, 255, .82);
	}
	.endorsementContent {
		width: 100%;
		max-width: 100%;
		padding: 0 5vw;
	}
	.contentText {
		max-width: 900px;
		margin: auto;
	}
}
/*========================================================
  MOBILE
========================================================*/
@media screen and (max-width: 767px) {
	.contentNoTilt {
		min-height: 0;
		padding: 45px 20px;
		/*
			Show the LEFT portion of the photo.
			Marti is on the right side of the original,
			so this keeps her mostly out of the mobile crop.
		*/
		background-position: left center;
		background-size: cover;
	}
	.TiltCover {
		background: rgba(255, 255, 255, .88);
	}
	.endorsementContent {
		width: 100%;
		max-width: 100%;
		padding: 0;
	}
	.contentText {
		padding: 5px 0;
	}
	/*
		Smaller than normal body copy on phones.
	*/
	.endorsementQuote {
		font-size: 14px;
		line-height: 1.55;
	}
	.contentFlex .contWho {
		margin-top: 14px;
		font-size: 14px;
		line-height: 1.4;
	}
	.contentFlex .stars {
		margin-top: 10px;
		font-size: 17px;
	}
	#contentSlide .carousel-indicators {
		margin-top: 18px;
	}
	#contentSlide .carousel-indicators li, #contentSlide .carousel-indicators li.active {
		width: 9px;
		height: 9px;
		margin-left: 4px;
		margin-right: 4px;
	}
	.endorsementMore {
		margin-top: 17px;
	}
}
/* =========================================================
   ACCENT LINE GROW ANIMATION
   Homepage Blogs + Blog Pages
========================================================= */
.homeBlogFeaturedContent, .homeBlogSmallContent, #blogAudioText, #BlogTopics > h3, #BlogTopics .panel.panel-default {
	--blog-line-grow: 0;
}
/* Homepage blog card lines */
.homeBlogFeaturedContent:before, .homeBlogSmallContent:before, /* Blog article line */ #blogAudioText:before, /* Previous Posts line */ #BlogTopics > h3:before, /* Blog Categories line */ #BlogTopics .panel.panel-default:before {
	transform: scaleX(var(--blog-line-grow));
	transform-origin: left center;
	transition: transform 900ms ease-out;
}
/* Intro header accent line grow */
.introText {
	--intro-line-grow: 0;
}
.introText:before {
	transform: scaleX(var(--intro-line-grow));
	transform-origin: left center;
	transition: transform 900ms ease-out;
}
/* =========================================================
   MARTI PIEPER FOOTER
========================================================= */
#footer {
	position: relative;
	z-index: 49;
	width: 100%;
	padding: 75px 0 0;
	background: var(--color-dark-bg);
	color: var(--color-background-light);
	flex-shrink: 0;
}
.footerFluid {
	width: 92%;
	max-width: 1650px;
	margin: 0 auto;
	padding: 0;
}
/* =========================================================
   MAIN FOOTER
========================================================= */
.footerMain {
	display: flex;
	align-items: flex-start;
	padding-bottom: 60px;
}
/* =========================================================
   BRAND
========================================================= */
.footerBrand {
	padding-right: 60px;
}
.footerLogo {
	display: inline-block;
	margin: 0 0 15px;
}
.footerLogo img {
	display: block;
	width: 205px;
	max-width: 100%;
	height: auto;
}
.footerBrand h3 {
	max-width: 520px;
	margin: 0;
	font-family: var(--font-Headings);
	font-size: calc(2vw + 5px);
	font-weight: 400;
	line-height: 1.05;
	color: var(--color-background-light);
}
/* =========================================================
   COLUMN HEADINGS
========================================================= */
.footerHeading {
	position: relative;
	margin: 5px 0 25px;
	padding-bottom: 12px;
	font-family: var(--font-Headings);
	font-weight: 400;
	color: var(--color-background-light);
	border-bottom: 1px solid rgba(255, 255, 255, .18);
}
.footerHeading:after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 55px;
	height: 2px;
	background: var(--color-accent);
}
/* =========================================================
   CONNECT LINKS
========================================================= */
.footerConnectLinks {
	padding-right: 35px;
}
.footLink {
	margin: 0 0 15px;
}
.footLink a {
	display: flex;
	align-items: center;
	gap: 12px;
	color: var(--color-background-light);
	text-decoration: none;
	opacity: .9;
	transition:
		color .25s ease, opacity .25s ease, transform .25s ease;
}
.footLink a:hover, .footLink a:focus {
	color: var(--color-light-accent);
	opacity: 1;
	transform: translateX(3px);
	text-decoration: none;
}
.footLink i {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	flex: 0 0 26px;
	color: inherit !important;
	font-size: 18px;
}
/* =========================================================
   NEWSLETTER
========================================================= */
.footerSignup {
	padding-left: 35px;
}
.footerSignup p {
	max-width: 500px;
	margin: 0 0 26px;
	color: var(--color-background-light);
	opacity: .88;
	line-height: 1.65;
}
/* =========================================================
   BOTTOM BAR
========================================================= */
.footerBottomWrap {
	border-top: 1px solid rgba(255, 255, 255, .16);
}
.footerBottom {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	padding: 20px 0 22px;
	font-size: 11px;
	line-height: 1.5;
	color: var(--color-background-light);
	opacity: .72;
}
.footerBottom a {
	color: var(--color-background-light);
	text-decoration: none;
}
.footerBottom a:hover, .footerBottom a:focus {
	color: var(--color-light-accent);
	text-decoration: none;
}
/* =========================================================
   TABLET
========================================================= */
@media(max-width: 991px) {
	#footer {
		padding-top: 60px;
	}
	.footerMain {
		display: block;
		padding-bottom: 45px;
	}
	.footerBrand {
		margin-bottom: 50px;
		padding-right: 15px;
	}
	.footerConnectLinks {
		padding-right: 30px;
	}
	.footerSignup {
		padding-left: 30px;
	}
}
/* =========================================================
   MOBILE
========================================================= */
@media(max-width: 767px) {
	#footer {
		padding-top: 50px;
	}
	.footerFluid {
		width: auto;
		margin-left: 25px;
		margin-right: 25px;
	}
	.footerBrand, .footerConnectLinks, .footerSignup {
		padding-left: 0;
		padding-right: 0;
		text-align: center;
	}
	.footerBrand, .footerConnectLinks {
		margin-bottom: 45px;
	}
	.footerLogo {
		margin-left: auto;
		margin-right: auto;
	}
	.footerLogo img {
		width: 175px;
	}
	.footerBrand h3 {
		margin-left: auto;
		margin-right: auto;
	}
	.footerHeading:after {
		left: 50%;
		transform: translateX(-50%);
	}
	.footLink a {
		justify-content: center;
	}
	.footLink a:hover, .footLink a:focus {
		transform: none;
	}
	.footerSignup p {
		margin-left: auto;
		margin-right: auto;
	}
	.footerBottom {
		display: block;
		text-align: center;
	}
	.footerBottom span {
		display: none;
	}
	.footerBottom div + div {
		margin-top: 5px;
	}
}
/* =========================================================
   DEMENTIA / BLOG SUMMARY CARDS
========================================================= */
#blogPostsContainer.blogSumDisplay {
	width: 90%;
	max-width: 1450px;
	margin: 35px auto 65px;
	padding-left: 15px !important;
	padding-right: 15px !important;
}
/* ---------------------------------------------------------
   CARD COLUMNS
--------------------------------------------------------- */
#blogPostsContainer .blogHoldSumDisplay {
	--post-accent: var(--color-secondary);
	padding: 0 12px 30px !important;
	margin: 0;
}
/* Rotate the same accent colors used elsewhere */
#blogPostsContainer .blogHoldSumDisplay:nth-child(3n+1) {
	--post-accent: var(--color-secondary);
}
#blogPostsContainer .blogHoldSumDisplay:nth-child(3n+2) {
	--post-accent: var(--color-accent);
}
#blogPostsContainer .blogHoldSumDisplay:nth-child(3n+3) {
	--post-accent: var(--color-muted-accent);
}
/* ---------------------------------------------------------
   IMAGE
--------------------------------------------------------- */
#blogPostsContainer .pictureBackSumDisplay {
	position: relative;
	width: 100%;
	height: 220px;
	margin: 0;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	border: 1px solid rgba(var(--color-dark-bg-rgb), .14);
	border-bottom: 0;
	background-color: var(--color-soft-bg);
}
/* Partial accent line */
#blogPostsContainer .post-itemSumDisplay {
	position: relative;
}
#blogPostsContainer .post-itemSumDisplay:before {
	content: "";
	position: absolute;
	top: -1px;
	left: -1px;
	width: 34%;
	height: 3px;
	background: var(--post-accent);
	z-index: 2;
	transform: scaleX(var(--post-card-line-grow));
	transform-origin: left center;
	transition: transform 900ms ease-out;
}
/* ---------------------------------------------------------
   TEXT CARD
--------------------------------------------------------- */
#blogPostsContainer .post-itemSumDisplay {
	padding: 22px 24px 26px;
	background: var(--color-soft-bg);
	border: 1px solid rgba(var(--color-dark-bg-rgb), .14);
	border-top: 0;
}
/* ---------------------------------------------------------
   POST TITLE
--------------------------------------------------------- */
#blogPostsContainer .post-itemSumDisplay h3 {
	margin: 0 0 15px;
	font-family: var(--font-Headings);
	font-size: 28px !important;
	font-weight: 500;
	line-height: 1.05;
	text-align: left !important;
	color: var(--color-primary);
}
/* ---------------------------------------------------------
   POST EXCERPT
--------------------------------------------------------- */
#blogPostsContainer .blogCommentSumDisplay {
	font-family: var(--font-main);
	font-size: 14px !important;
	line-height: 1.5;
	text-align: left !important;
	color: var(--color-body-text) !important;
}
/* Clean up old imported multiple line breaks */
#blogPostsContainer .blogCommentSumDisplay br + br {
	display: none;
}
/* Read more */
#blogPostsContainer .blogCommentSumDisplay a {
	color: var(--color-secondary);
	text-decoration: none;
}
#blogPostsContainer .blogCommentSumDisplay a:hover, #blogPostsContainer .blogCommentSumDisplay a:focus {
	color: var(--color-primary);
	text-decoration: underline;
}
/* ---------------------------------------------------------
   EQUAL HEIGHT CARDS - DESKTOP
--------------------------------------------------------- */
@media(min-width: 992px) {
	#blogPostsContainer > .row {
		display: flex;
		flex-wrap: wrap;
	}
	#blogPostsContainer .blogHoldSumDisplay {
		display: flex;
		flex-direction: column;
	}
	#blogPostsContainer .blogHoldSumDisplay > a {
		display: block;
		flex: 0 0 auto;
	}
	#blogPostsContainer .post-itemSumDisplay {
		display: flex;
		flex: 1 1 auto;
		flex-direction: column;
	}
	#blogPostsContainer .blogCommentSumDisplay {
		flex: 1 1 auto;
	}
}
/* ---------------------------------------------------------
   TABLET
--------------------------------------------------------- */
@media(max-width: 991px) {
	#blogPostsContainer.blogSumDisplay {
		width: 92%;
	}
	#blogPostsContainer .blogHoldSumDisplay {
		max-width: 760px;
		margin-left: auto;
		margin-right: auto;
	}
	#blogPostsContainer .pictureBackSumDisplay {
		height: 280px;
	}
}
#blogPostsContainer .blogHoldSumDisplay {
	--post-card-line-grow: 0;
}
#blogPostsContainer .pictureBackSumDisplay:before {
	transform: scaleX(var(--post-card-line-grow));
	transform-origin: left center;
	transition: transform 900ms ease-out;
}
/* ---------------------------------------------------------
   MOBILE
--------------------------------------------------------- */
@media(max-width: 767px) {
	#blogPostsContainer.blogSumDisplay {
		width: 100%;
		padding-left: 20px !important;
		padding-right: 20px !important;
	}
	#blogPostsContainer .blogHoldSumDisplay {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	#blogPostsContainer .pictureBackSumDisplay {
		height: 220px;
	}
	#blogPostsContainer .post-itemSumDisplay {
		padding: 20px 20px 23px;
	}
	#blogPostsContainer .post-itemSumDisplay h3 {
		font-size: 26px !important;
	}
}