/* Normalizing css: */
button,hr,input{overflow:visible}[type=checkbox],[type=radio],legend{box-sizing:border-box;padding:0}html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;margin:1em 0;opacity:.6;}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bold}dfn{font-style:italic}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{margin:0}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}[hidden],template{display:none}

:root {
	--theSans: gravita-hum-variable, arial, sans-serif;
	--textColor: #000;
	--homePcolor: #535353;
	--mainBGcolor: rgba(224, 214, 203, 1);
	--htmlBG: var(--mainBGcolor);
	--linkColor: rgba(118, 68, 0, 1);
	--theBlue: hsla(201, 74%, 26%, 1);
	font-size: 17.78px;
}
#map2us { text-align: center; margin: .5em auto;height:400px; width:100%; overflow:hidden !important;  }
#map2us iframe { filter: contrast(1.5) brightness(.9); mix-blend-mode: multiply; }
#theReport { padding-left: 3em; font-size: 105%; }
#theReport a { font-weight: 500; font-variation-settings: "wght" 500; }
.darkmode { 
	--textColor: #bbb; 
	--homePcolor: #969696;
	--mainBGcolor: #0d1b21;
	--htmlBG: var(--mainBGcolor) none;
	--linkColor: rgba(186, 152, 77, 1);
	--theBlue: hsla(201, 25%, 53%, 1);
}
.darkmode #logo { filter: invert() hue-rotate(180deg); }
.darkmode #map2us iframe { filter: brightness(1) invert(1) hue-rotate(180deg); mix-blend-mode: screen; }

* { box-sizing: border-box;}
.IEonly { display: none; }

.offerings { text-align: center; font-size: .9rem; display: flex; flex-wrap: wrap; justify-content: center;font-weight: 200; font-variation-settings: 'wght' 200;}
.offerings div { margin: .2em .5em;}

#giftcodelink { display: block; width: 100px; aspect-ratio: 1055 / 606; background: url('/images/giftCode.svg') no-repeat center; background-size: contain;text-indent: -9999em; }
.giftcard #giftcodelink { display: none; }
html {
scroll-behavior: smooth;
margin: 0; padding: 0;
font-family: var(--theSans); 
color: var(--textColor);
background: var(--htmlBG);
background-size: 100% 300vh, auto;
/* -moz-font-feature-settings: "ss08";
-webkit-font-feature-settings: "ss08"; */
font-feature-settings: "ss08";
}

label.buttony, a.buttony, .buttony a, .featured a {
	display: block; padding: 1em; 
	border: 1px solid rgba(255,255,255,0); 
	margin: 1em auto;
	font-family: var(--theSans); 
	text-decoration: none; 
	border-radius: .5em;
	cursor: pointer; 
	background: rgba(120,120,120, .1);
	text-align: center;
}
.featured a { background: none;  }
.news .buttony a { display: inline-block; margin: .7em; }
	/* .featured a { padding: .4em; margin: 2em auto; max-width: 425px; } */
	/* .featured a h3 {  margin: 0 0 .3em 0; font-size: 1.1rem; } */
	.featured a p { margin: 0; font-size: .8rem; font-weight: 300;font-variation-settings: "wght" 300; }

form select { 
	background-image: url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0Ljk1IDEwIj48ZGVmcz48c3R5bGU+LmNscy0ye2ZpbGw6IzQ0NDt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPmFycm93czwvdGl0bGU+PHBvbHlnb24gY2xhc3M9ImNscy0yIiBwb2ludHM9IjEuNDEgNC42NyAyLjQ4IDMuMTggMy41NCA0LjY3IDEuNDEgNC42NyIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMiIgcG9pbnRzPSIzLjU0IDUuMzMgMi40OCA2LjgyIDEuNDEgNS4zMyAzLjU0IDUuMzMiLz48L3N2Zz4=); 
	background-position:  100% 50%; 
	background-repeat: no-repeat;
	-moz-appearance: none; 
	-webkit-appearance: none; 
	appearance: none; 
	padding: .2em 2em;
		}
	 .founded { 
		font-feature-settings: "ss01"; font-family: "roca", garamond, georgia, serif; font-weight: 600; font-variation-settings: "wght" 600;
		 text-align: center;
		 font-size: 2.1rem;
		 color: #be882f;
		 margin-top: 1em;
	 }

em { /* font-family: "rotunda-variable-italic", arial, sans-serif; */ font-style: italic; }

.legendy { margin: 0 auto; max-width: 480px; background:var(--mainBGcolor); padding: .5em; border-bottom: 1px solid var(--theBlue); text-align: center !important; font-size: 80%; position: sticky; top: 0; display: flex; justify-content: space-around; align-items: baseline; }
	.legendy img { margin: 0 auto; }
	.courseList .legendy img { margin-bottom: -.9em; }
	.legendy p { margin: 0; line-height: 1.3; }
	.darkmode .legendy img { filter: invert() hue-rotate(180deg); }

#bigNav .abouts .abouts { border: none; color: #fff; background: #666; }

a, a *, .home a h3 { color: var(--linkColor); }
a:hover, a:hover *, .home a:hover h3 { /*color: #0473e1;*/ filter: brightness(120%); }
a.calClassEntry p[class], a.calClassEntry time, a[id*="buy"], a[id*="buy"] span { color: #fff; }
a.buttony:hover, label.buttony:hover, .buttony a:hover {  border: 1px solid #888; }
.delivery { margin: 0;}
.delivery a { width: 100%; display: block; margin: 0 auto; text-align: center; text-decoration: none; transition: width .5s; }
.delivery a:hover { filter: brightness(1.2); }
li { line-height: 1.3; font-weight: 300;font-variation-settings: "wght" 300;  }
#abanner { width: 99%; max-width: 450px; margin: 1em auto;}
#abanner img { width: 100%; }
.multiply {mix-blend-mode: multiply;}
#instr { grid-area: inst; }
.why { grid-area: why; }
.featured { grid-area: featured; text-align: center; }
.news { grid-area: news; }
.questions { grid-area: questions; align-self: start; }
/* .delivery {grid-area: delivery; } */
.deliveryBlurbs { grid-area: deliveryBlurbs;}
.why hr {margin: .3em 3em -.7em 3em;}
.home p { font-weight: 200; font-size: .95rem;font-variation-settings: "wght" 200; color: var(--homePcolor); }
footer td, .home footer td  { font-size: .75rem; }
.bookblurb { text-align: left; font-size: .9rem; }

a[href="#choosing"] {width: fit-content; font-weight: 700; font-variation-settings: "wght" 700;margin: 1em auto;}

#inpersonClassesOffered p.tinyMeetDates:before { content: 'live, in-person';
display: block; text-align: left; }
#zoomClassesOffered p.tinyMeetDates:before { content: 'live, via Zoom';
display: block; text-align: left; }

.merch > div {padding: 1em; margin: 1em; border: 1px solid #333; }
.merch h4 { margin: 0; }
.previews { display: flex; justify-content: center; gap: .5em; float: right; padding-left: .5em; }
.previews div { width: 150px; cursor: zoom-in; }
.previews div img { display: block; width: 100%; }
.previews div:before { content: 'click to enlarge'; display: block; width: 100%; font-size: .8rem; text-align: center; padding: 0 .5em; }
.previews div.bigly { width: 90vw; max-width: 1400px; position: fixed; top: 20px; left: 5%; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.6); cursor: zoom-out; z-index: 1000;  }
.previews div.bigly:before { content: '×'; display: block; width: 95%; margin-right: 5%; font-size: 5rem; text-align: right; padding: .2em .5em 0 .5em; font-weight: bold;  }
a.itemPurchase { display: inline-block; padding: .3em 1em; margin: 0 .5em; }

body {
	margin: 0 auto; padding: 1em 1%;
	width: 100%; max-width: 1550px;
	display: grid;
	grid-template-columns: 100%;
	grid-gap: 1rem 0;
	grid-template-rows: auto;
	grid-template-areas:	"logo"
						"nav"
						"othernav"
						"cart"
						"h1"
						"main"
						"quickContact"
						"footer";
	}
	.listofclasses { 
	grid-template-areas:	"logo"
						"nav"
						"othernav"
						"cart"
						"h1"
						"main"
						"quickContact"
						"deliveryBlurbs"
						"footer";
	}

	.home {
		grid-template-rows: auto;
		grid-gap: .75em 0;
		grid-template-areas:	"logo"
							"welcome"
							"nav"
							"othernav"
							"cart"
							"quickContact"
							"why"
							"featured"
							"news"
							"footer";
		}

	.QandA {
		grid-template-rows: auto;
		grid-template-areas:	"logo"
							"nav"
							"othernav"
							"cart"
							"h1"
							"main"
							"news"
							"questions"
							"quickContact"
							"footer";
		}

	.description {
		grid-template-rows: auto;
		grid-template-areas:	"logo"
							"nav"
							"othernav"
							"cart"
							"h1"
							"main"
							"classDates"
							"quickContact"
							"footer";
		}

	.checkout {
		grid-template-rows: auto;
		grid-template-areas:	"logo"
							"nav"
							"othernav"
							"cart"
							"h1"
							"main"
							"quickContact"
							"footer";
		}

	.about main { max-width: 40em; margin: 0 auto; }

	.category main div > a
	{ max-width: 30em;}

	/* .category main div > a,
	.listofclasses #courses
	{ max-width: 30em;} */
	
	.listofclasses #courses
	{ margin: 1em auto; font-size: .9rem; max-width: 30em; }
	
	#courses a.buttony
	{ margin: 1em auto 1em 0; }
	
.category main div a + div
 { 	/* the intro from the course description */
	margin: .3em auto 2em 5em;
	max-width: 50em;
	font-size: .9rem;
	}

.listofclasses main div > a   {  }
.listofclasses main div > a span  { font-size: .8rem;  white-space: nowrap; }

p a, td a	{ font-weight: 500; font-variation-settings: "wght" 500;  }
a:hover	{  text-decoration: none; }
#aatc, a#ctt { display: block; width: 200px; height: 59px; background: url(/images/aatc2016.svg) no-repeat; background-size: contain; margin: .5em auto 1em calc(107px + 1em); text-indent: -9999em; }

a#ctt { float: left; width: 107px; height: 98px; background: url(/images/logocttplus.svg) no-repeat; margin: 0 1em  0 0; }

.smallCaps { text-transform: lowercase; font-variant: small-caps; }

::selection		{ background: #dc8;  }
::-moz-selection	{ background: #dc8;  }

.noBreak { white-space: nowrap; }

.visuallyhidden {
	position: absolute;
	overflow: hidden; 
	clip: rect(0 0 0 0); 
	height: 1px; width: 1px; 
	margin: -1px; padding: -1px; border: 0;
	}

.block { display: block; }

#openAll { max-width: 300px; margin: 0 auto; text-align: center; }
#openAll:before { content: "Show "; }
.answers #openAll:before { content: "Hide "; }

.faqs dl { margin: 0 auto; max-width: 35em;  }
.faqs main label, .webresources label { display: block; margin: .5em 0; cursor: pointer; color: var(--linkColor); background: rgba(120,120,120, .06); padding: .3em; border-radius: .3em; }
.faqs main input, .webresources input { display: none; }
.faqs main input + div { max-height: 0; overflow: hidden; padding: 0; margin: 0; transition: all .4s; }
.faqs main input:checked + div, .faqs.answers main div/* , #covidBlurb */ { max-height: 30em; overflow: visible; margin: 0 auto 2em auto;  }

.iconDarker { fill: var(--linkColor); }
.iconLighter { fill: #7a560f; }

	.about .aboutLink,
	.faqs .FAQlink,
	.calendarPage .calLink,
	.contact .customLink,
	.policies .policiesLink,
	.resources .resourcesLink
	{ cursor: default; color: var(--theBlue); }

	.about #aboutIcon .iconDarker,
	.faqs #faqIcon .iconDarker,
	.calendarPage #calendarIcon .iconDarker,
	.contact #customIcon .iconDarker,
	.policies #policiesIcon .iconDarker,
	.resources #resourcesIcon .iconDarker
	{ fill: var(--theBlue); }
	#aboutIcon .iconLighter { fill: #293; }

		
	.contact #customIcon .iconLighter,
	.policies #policiesIcon .iconLighter,
	.resources #resourcesIcon .iconLighter
	{ fill: var(--theBlue); filter: brightness(0.7); }
	
	.calLink:before, .calendarPage .calLink:before { color: var(--mainBGcolor);z-index: 1000; }
	.calendarPage .calLink:after { color: var(--theBlue);}

#cartLink { color: var(--textColor);}
	
div#cart { 
	grid-area: cart; 
	direction: flex;
	width: 100%;
	justify-content: center;
	}
#cart a { 
	display: none; 
	border: 1px solid #fff; 
	font-family: var(--theSans); text-decoration: none; border-radius: .5em; 
	text-align: center; line-height: 1.1; padding: .25em .35em .25em 0; color: #000;
	font-size: .9rem; font-weight: 200; font-variation-settings: "wght" 200;
	margin: .2em;
	flex: 1 2 auto;
	max-width: 50%;
	color: #fff;
	}
	#cart a strong { color: #fff; }
	#cart a:hover { filter: brightness(1.2); }
	
	#cart a#in-person { background: #368; }
		
	#cart a#customCart { background: #927233; text-align: right; }
		#cart a#customCart:before { content: '\25b6'; color: rgba(255, 255, 255, 1); display: block; float: left; margin: .6em .25em auto 10px; transform: scale(1.3, 1); border: .5px solid #fff; border-radius: .2em; font-size: 75%; padding: .3em .3em .1em .3em;  }
		#cart a#customCart:after { content: ''; width: 21px; height: 21px; display: block; float: left; margin: -.7em .25em auto 10px; background: url(/images/product.svg) no-repeat; background-size: contain; }

.checkout #cart a:before { content: 'to ';}

.customcheckout #cart a#customCart,
.customcheckout #cart a#customCart:hover { display: none;  }

.inpersoncheckout #cart a#in-person,
.inpersoncheckout #cart a#in-person:hover { display: none;  }

.recordingcheckout #cart a#recordingCart, 
.recordingcheckout #cart a#recordingCart:hover { display: none;  }

#cart svg { width: 24.7px; height: 28px; margin-bottom: -4px; }

.balance-text { text-wrap: balance; }  /* Apply (proposed) CSS style */
  
	
h1 { 
	grid-area: h1;
	font-feature-settings: "ss01"; font-family: "roca", garamond, georgia, serif; font-weight: 400; font-variation-settings: "wght" 400; text-align: center;
	font-size: 1.7rem;
	letter-spacing: -.016em;
	line-height: 1.1;
	margin: 0 auto calc(.5em - 1vw) auto; 
	color: var(--theBlue);
	}
	.QandA h1 { width: calc(4 * 10.15vw); padding-top: calc(4.1 * 4.94062vw); background: url(/images/QnA.svg) center top no-repeat; background-size: contain; font-size: 2.5vw; text-align: center; max-width: 507.48px; }
	@media only screen and (min-width: 750px) {
	.QandA h1 { text-align: right; }
	}
	@media only screen and (min-width: 1250px) {
	.QandA h1 { padding-top: 253.41px; font-size: 31.4px; }
	}
.home h1 { height: 0; width: 0;  text-indent: -4000em; grid-area: none; }
h2 { 
	font-feature-settings: "ss01"; font-family: "roca", garamond, georgia, serif; font-weight: 400; font-variation-settings: "wght" 400; 
	font-size: 1.4rem;
	line-height: 1;
	margin: 1.3em 0 .25em 0;
	}
h3 { margin: 1.5em 0 5px 0; font-family: var(--theSans); font-weight: 550;font-variation-settings: "wght" 550; color: var(--theBlue); text-align: center; font-size: 1.2rem; }
.description main h3 { font-feature-settings: "ss01"; font-family: "roca", garamond, georgia, serif; font-weight: 550; font-variation-settings: "wght" 550;font-size: 1.5rem; } 

.home h2 { text-align: center; color: var(--theBlue); font-size: 2.5rem;font-weight: 750;font-variation-settings: "wght" 750; }

.checkout h3 {  margin-top: 1em;  }
.home h3 { text-align: left; color: var(--theBlue); font-weight: 600;font-variation-settings: "wght" 600; }
h4 { font-weight: 500;font-variation-settings: "wght" 500; }
.description #intro h4::first-letter { text-transform: uppercase; }
.welcome h2 { 
	grid-area: h1;
	text-align: center;
	color: var(--textColor);
	filter: contrast(120%);
	font-size: 35px; font-size: 15cqw;
	font-weight: 700;font-variation-settings: "wght" 700;
	line-height: 1.1;
	margin: 0 auto .2em auto; 
	text-rendering: optimizeLegibility; font-feature-settings: "kern" 1; font-kerning: normal; 
	}
.showBanner .welcome h2 span.call { display: none; }
	.welcome h2 span.odv { display: block; font-family: darkmode-off; font-size: 32%; font-weight: 300; font-variation-settings: "wght" 300;letter-spacing: .05em; line-height: 1.2; margin: 0; }
	.welcome h2 span.tagline { display: block; font-size: 55%; font-weight: 500; font-variation-settings: "wght" 500;line-height: 1.2; margin-top: .5em;  }
.calendarPage .calholder h2 {
	    padding: .2rem 0 .9rem .5rem;
	    background: var(--theBlue);
	    color: #fff;
	    font-weight: 500;font-variation-settings: "wght" 500;
	    font-size: 1.4rem;
	    margin:  1em -1vw .25em -1vw; 
	    position: sticky;
	    position: -webkit-sticky;
	    top: 0;
	    z-index: 500;
	}

		#damnTiny { width: 0; height: 0; margin: 0; padding: 0; overflow: hidden; text-indent: -999em; }
	.zoomlogo { width: 2.7em; height: auto; margin: 0; padding: 0; overflow: hidden; text-indent: -999em; display: inline-block; background: url(/images/zoom.svg) no-repeat bottom; background-size: contain; }
	.vodHead:before { display: inline-block; content:''; background: url(/images/vidOnly.svg) no-repeat; height: 1.2em; width: 1.67em; background-size: contain; margin-right: .5em; }
	.zoomHead:before { display: inline-block; content:''; background: url(/images/zoom.svg) no-repeat left bottom; height: 1em; width: 2.7em; background-size: contain; margin-right: .5em; }
	.inp:before { display: inline-block; content:''; background: url(/images/inPerson.svg) no-repeat; height: 1.2em; width: 1.5em; background-size: contain; margin-right: .5em; }
	.darkmode .inp:before { filter: invert(); }
	

p { margin: 0 0 .6em 0; font-weight: 200; line-height: 1.4; font-variation-settings: "wght" 200; }

li, dt { margin-top: .6em; }

#recs { display: flex; flex-wrap: wrap; flex-direction: row; justify-content: center;  }
#recs a { flex: 0 1 auto; display: block; /* aspect-ratio: 1/1; */ width: 150px; height: 150px; background-size: contain; background-color: transparent; background-position: center center; background-repeat: no-repeat; color: #fff; text-decoration: none; text-shadow: 0px 0px 6px black, 0px 0px 6px black; text-align: center; padding-top: 3em; margin: .5em; }

.webresources div { clear: both; }
.webresources div { columns: 2 20em; }

.welcome { grid-area: welcome; margin-bottom: .5em; align-self: center; container-type: inline-size; }
.showBanner .welcome { align-self: start; }
.covid { grid-area: covid; /* padding: 0 0 .5em 0; border-top: var(--theBlue) double 6px; border-bottom: var(--theBlue) double 6px; margin: 1em auto; font-weight: 300; align-self: start; */}
.covid h3 { margin: .5em 0 0 0; text-align: left; font-weight: 500; font-variation-settings: "wght" 500; }
.covid p { line-height: 1.2em;}

p.qaref:before { content: ''; display: block; width: 130px; height: 61px; background: url(/images/QnA.svg) left top no-repeat; background-size: contain; float: left; margin: 4px .5em 0 0; }

div#social {
	max-width: 480px;
	height: 38px;
	padding: 0;
	border: 0;
	margin: 0 auto 1.5em auto; 
	display: flex;
	justify-content: space-between;
}

	div#social a {
		display: block; 
		text-indent: -6000em;
		height: 38px;
		width: 38px;
		padding: 0;
		border: 0;
		text-decoration: none; 
		
		}
	div#social a#bsky {
		background: url(/images/bsky.png) no-repeat;
		background: url(/images/bsky.svg) no-repeat, none; background-size: contain;
		}
		
	div#social a#mn {
		background: url(/images/mastodon.png) no-repeat;
		background: url(/images/mastodon.svg) no-repeat, none; background-size: contain;
		}
		
	div#social a#tw {
		background: url(/images/twitter.png) no-repeat;
		background: url(/images/twitter.svg) no-repeat, none; background-size: 38px 38px;
		}
	
	div#social a#fb {
		background: url(/images/fb.png) no-repeat;
		background: url(/images/fb.svg) no-repeat, none; background-size: 38px 38px;
		}
	
	div#social a#ig {
		background: url(/images/ig.png) no-repeat;
		background: url(/images/ig.svg) no-repeat, none; background-size: 38px 38px;
		}
	
	div#social a#yt {
		background: url(/images/youtube.png) no-repeat;
		background: url(/images/youtube.svg) no-repeat, none; 
		background-size: contain;
		width: 54px;
		}
	div#social a#linkedin {
		background: url(/images/linkedin.png) no-repeat;
		background: url(/images/linkedin.svg) no-repeat, none; background-size: 38px 38px;
		}
	div#social a#substack {
		background: url(/images/substack.svg) no-repeat, none; background-size: contain;
		}
	div#social a#beehiiv {
		background: url(/images/beehiiv.svg) no-repeat, none; background-size: contain;
		}
		
	

#logo, .showBanner.home #logo { 
			grid-area: logo; 
			display: block; 
			width: 205px; height: 90px;
			text-indent: -999em; 
			background-image: url(/images/logo2022.svg); 
			background-repeat: no-repeat;
			background-size: contain;
			justify-self: center;
			
		}
		
.home #logo { background-image: url(/images/logo2022noTagline.svg); cursor: default; pointer-events: none; }
		
.othernav {
	grid-area: othernav;
	width: 87%;
}

nav { grid-area: nav; }	

	nav ul {
		padding: 0; 
		margin: 0;
		list-style: none;
		display: flex;
		align-items: flex-end;
		justify-content: space-around;
		flex-wrap: wrap;
		}
		
	nav li { margin: 0; padding: 0; }
	
			@media only screen and (max-width: 330px) {
				nav ul { width: 305px; margin: 0 auto; }
				nav li { margin: 6px; }
			}

	a.othernav:hover { filter: invert(100%) hue-rotate(180deg); }
	nav a:hover { filter: brightness(1.2); }
	.about .aboutLink:hover,
	.faqs .FAQlink:hover,
	.calendarPage .calLink:hover,
	.contact .customLink:hover,
	.policies .policiesLink:hover,
	.resources .resourcesLink:hover 
	{ filter: none; }
	
		a.othernav, a.othernav:hover, nav a, nav a:hover {	
			display: block; font-size: .9486rem;
			color: var(--textColor);
			line-height: 1; margin: 0; padding: 0; 		
			text-decoration: none;
			text-align: center;
			}	
		nav svg { display: block; margin: 0 auto; }
		.calLink svg  { width: 48px; height: 48px; }
		.customLink svg  { width: 46px; height: 23px; }
		.policiesLink svg  { width: 48px; height: 39px; margin-bottom: 4px; }
		.resourcesLink svg  { width: 48px; height: 48px; }
		.FAQlink svg  { width: 22px; height: 50px; }
		.aboutLink svg  { width: 45px; height: 48px; }
	.calLink { position: relative;}		
	.calLink:before { content: attr(data-month); position: absolute; top: 7px; width: 100%; left: 0; text-align: center; font-size: 70%; font-weight: 500;font-variation-settings: "wght" 500; }		
	.calLink:after { content: attr(data-date); position: absolute; top: 20px; width: 100%; left: 0; text-align: center; font-size: 130%; font-weight: 500; font-variation-settings: "wght" 500; color: var(--linkColor); }		

@keyframes borderFade {
	  0% {
		width: 0; overflow: hidden;
		color: rgba(255,255,255, 0);
		background: var(--theBlue); opacity: 1;
	    }
	  50% {
		color: rgba(255,255,255, 0);
		}
	  100% {
		width: 100%; overflow: inherit;
		color: rgba(255,255,255, 1);
		background: var(--theBlue); opacity: 1;
	    }
	}
	
@keyframes colorFade {
		  0% {
			 filter: drop-shadow(0 0 0 var(--linkColor)); 
		    }
		  50% {
			 filter: drop-shadow(0 55px 0 var(--linkColor));
			}
		  100% {
			 filter: drop-shadow(0 0 0 var(--linkColor));
		    }
		}
		
	@keyframes again {
		  0% {
			width: 100%; overflow: inherit;
			  color: rgba(255,255,255, 1);
			  background: var(--theBlue); opacity: 1;
		    }
		  100% {
			width: 100%; overflow: inherit;
			color: rgba(255,255,255, 1);
			background: var(--theBlue); opacity: 1;
		    }
		}
		
	#select { 
		display: block; width: 100%; /* max-width: 430px; */
		max-width: 30em;
		line-height: 53px; height: 60px; 
		padding: 0 .75em 0 1em; cursor: pointer;
		border-radius: 5px; 
		text-align: left; font-size: 30px; font-weight: 300;font-variation-settings: "wght" 300;
		font-family: var(--theSans);
		justify-self: center; 
		    border: 1px solid var(--theBlue);
		    color: rgba(255,255,255, 1);
		    background: var(--theBlue); 
		/* opacity: 0;*/
		animation: colorFade 1.5s ease-in-out 2s 1 normal forwards; 
		-moz-font-feature-settings: "ss08";
		-webkit-font-feature-settings: "ss08";
		font-feature-settings: "ss08";
		}	
	#select.noodge { animation: again .5s ease-in-out .1s 1 normal forwards; }
	
	#select:before { content: 'see our'; }	
	.description #select:before { content: 'see other'; }
	.checkout #select:before { content: 'add more'; }
	#select:after { content: "❯"; transform: rotateZ(90deg); display: inline-block; float: right;   }
	
.pic { grid-area: pic; align-self: start; display: none; width: 100%; height: 100%; max-width: 600px; background-position: 50% top; background-size: contain; background-repeat: no-repeat; } 
.pic iframe, .pic svg  { display: none; }

.pic[class*="acro"] 	{ background-image: url(/images/pics/acro.svg); }
.pic[class*="ae"] 		{ background-image: url(/images/pics/ae.svg); }
.pic[class*="ill"] 		{ background-image: url(/images/pics/ai.svg); }
.pic.id1cc			{ background-image: url(/images/pics/id.svg); }
.pic[class*="lr"] 		{ background-image: url(/images/pics/lr.png); }
.pic[class*="premiere"] svg	{ display: block; }
.pic[class*="ps"] 		{ background-image: url(/images/pics/ps.svg); }

	.pic.dcs1 	{ background-image: url(/images/pics/dcs1.png); }
	/* .pic.psccci 		{ background-image: url(/images/pics/psccci2.jpg); } */
	.pic.psccphoto 	{ background-image: url(/images/pics/psSd.svg); background-size: 50%; }
	.pic.ae1cc, .pic.ae2cc { background-image: url(/images/pics/gears.svg); }
.pic.id2cc iframe { display: block; }
	.pic.proposals { background-image: url(/images/pics/proposals.png); }

	
	@keyframes fancyGear {
		0% { transform: rotateZ(0deg); }
		100% { transform: rotateZ(360deg); }
		}
	.pic.ae2cc { animation: fancyGear 45s linear infinite; transform-origin: 250px 250px; opacity: .6; }
	
.classDates 	{ grid-area: classDates; justify-self: center; width: 100%; max-width: 400px; margin: 0 auto; -webkit-font-smoothing: antialiased; } 
.classDates h2 { font-size: 1.2rem; font-family: var(--theSans); font-weight: 500;font-variation-settings: "wght" 500; }
.courseData 	{ font-family: var(--theSans); font-weight: 300; font-variation-settings: "wght" 300;font-size: 1rem; }
				
	.courseData span 	{ font-weight: 600; font-variation-settings: "wght" 600; }

.quickContact 	{ grid-area: quickContact; line-height: 1.1; font-weight: 300; font-variation-settings: "wght" 300;}

.quickContact { text-align: center; }
.quickContact a { width: 100%; max-width: 250px; /* aspect-ratio: 200 / 54; */ line-height: 1.1;}
	.quickContact span	{ display: block;  }
	.contact .quickContact .formish, 
	.directions .quickContact a[href*='directions']
	 { display: none; }

.quickContact span { font-size: .8rem;  }
.quickContact a, #obf { margin-top: .1em; font-weight: 400; font-variation-settings: "wght" 400;padding: .5em; line-height: 1; }

.giftcard #gcode { display: none; }
.giftcard input::-webkit-outer-spin-button,
.giftcard input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
/* Firefox */
.giftcard input[type=number] {
  -moz-appearance: textfield;
}

main { grid-area: main; }
	.why, .news, #CnC { width: 95%; margin: 0 auto 2em auto; align-self: start;  }
	.news, #social { text-align: left; }

footer { grid-area: footer; align-self: center; text-align: left; width: 100%; /* max-width: 505px; */ margin: 1em auto 1em 0; }
footer .credits { font-weight: 300; font-variation-settings: "wght" 300; }
.credits td { padding: .5em .5em .5em 0; }
.credits .postal { padding: 0 .5em .5em 0; font-size: 90%; font-weight: 100; font-variation-settings: "wght" 100; }
.motto { font-size: 90%; cursor: pointer; }

footer p {  font-weight: 200; font-variation-settings: "wght" 200;line-height: 1.2; margin-bottom: 1em; }
footer a { font-weight: 300; font-variation-settings: "wght" 300;}	

	.motto:after { content: ' = \201CThrough Learning, Beauty\201D'; color: rgba(0,0,0,0); white-space: nowrap; font-weight: 500; font-variation-settings: "wght" 500;}
	.motto.clicked:after, .motto:hover:after { color: var(--textColor); }

.quote { grid-area: quote; display: none; }

.quote blockquote, #nicewords blockquote { line-height: 1.7; width: fit-content; max-width: 100%; text-align: left;font-family: var(--theSans); font-style: italic;font-size: 18.5px; font-weight: 200;font-variation-settings: "wght" 200; margin: 0 auto; padding-left: 3em; text-indent: -2.5em; text-wrap: balance; }

.quote blockquote{ text-indent: 0; text-align: center; padding: 0 2rem;  }

#testimonials { background: rgba(255, 255, 255, .05); padding: .25em; border-radius: 1em; margin-top: 1.75em;}	 
#testimonials h3 { margin-top: .5em; }	 
#nicewords blockquote { font-size: .85rem; margin: 1em 15% 1em 0; width: auto; }
#nicewords blockquote:nth-child(2n+1) { font-size: .85rem; margin: 1em 0 1em 15%; }

		 .quote blockquote:before, .quote blockquote:after { color: var(--theBlue); font-size: 4em; line-height: 0; font-family: var(--theSans); font-style: normal; font-weight: 400;font-variation-settings: "wght" 400;vertical-align: -.4em;}
	
		 #nicewords blockquote:before, #nicewords blockquote:after { color: var(--theBlue); font-size: 2em; line-height: 0; vertical-align: -.3em; }
	
		 .quote blockquote:before { content: open-quote; margin-right: .5rem; margin-left: -2rem; }
			 
		#nicewords blockquote:before { content: open-quote; margin-right: .25em; }
			 
		 #nicewords blockquote:after { content: close-quote; margin-left: .25em;  }
		 
		 .quote blockquote:after{ content: close-quote; margin-left: .5rem; margin-right: -2rem; vertical-align: -.45em;}
	 
	 .quote p { font-family: var(--theSans); text-align: right; margin-right: 20%; }
		 .quote p:before { content: "— "; }

img { display: block; }
figure { width: 100%; margin: 1em 0; text-align: center; }

.mugshot { 
	width: 125px; height: 200px; margin: 0 2em 1em 2em; background-size: contain; background-repeat: no-repeat; background-position: 0 0;
	  }

#steve { background-image: url(/images/Steve1.jpg); float: right; }

#ivan { background-image: url(/images/Ivan.jpg); float: left; }

#regan { background-image: url(/images/Regan.jpg); float: right; }

#peachy { background-image: url(/images/peachy1.jpg); float: left; height: 125px; }

	@media
	only screen and (-webkit-min-device-pixel-ratio: 2),
	only screen and (   min--moz-device-pixel-ratio: 2),
	only screen and (     -o-min-device-pixel-ratio: 2/1),
	only screen and (        min-device-pixel-ratio: 2),
	only screen and (                min-resolution: 192dpi),
	only screen and (                min-resolution: 2dppx) { 
	
		#steve { background-image: url(/images/Steve2.jpg); background-size: 125px auto; }
		#ben { background-image: url(/images/Ben2.jpg); background-size: 125px auto; }
		#ivan { background-image: url(/images/Ivan.jpg); background-size: contain; }
		#peachy { background-image: url(/images/peachy2.jpg); background-size: 125px auto; }
	}
.cleanList { list-style: none; }

.directions main { max-width: 38em; margin: 1em auto; }
.directions p[itemprop] { margin-left: 2em; font-size: 120%; font-weight: 500;font-variation-settings: "wght" 500; }
.keymap { display: flex; justify-content: space-between; }
.keymap a { flex: 1; text-align: center; margin-right: .25em;}
.keymap a:last-child { margin-right: 0; }

.direct input { display: none; }
.direct label { margin-left: 2em; max-width: 30em; }
	.direct input + div {
		overflow: visible; 
		max-height: 50em;
		transition: max-height .333s, margin-top .5s, margin-bottom .5s;
		padding-bottom: 1em;
		border-bottom: 1px solid #666;
		margin: 1em auto 1.5em 2em;
		}
		
	.direct input:not(:checked) + div {
		overflow: hidden; 
		max-height: 0;	
		margin: 0 0 0 0;
		padding: 0; border: none;
		}


/*  Course Description Page rules  */

#basics {display: none;}
#basics + div { display: none; }
#basics:checked + div { display: block; margin: 0 0 1em 2em; }
label[for="basics"] { margin: 1em 0; }

		#outline { max-height: 500rem; transition: max-height 1s; overflow: hidden; margin: auto; }
		
			.folded #outline { position: relative; max-height: 50vw; }
			.folded #outline:after { content: ""; display: block; width: 100%; height: 50vw; position: absolute; bottom: 0;
				background: linear-gradient(180deg, rgba(235, 232, 223,0) 0%,var(--mainBGcolor) 100%) no-repeat; }
				
			.revealer { 
				opacity: 1; font-family: var(--theSans); 
				font-size: .8rem;
				font-weight: 500; font-variation-settings: "wght" 500;color: #ab6400; text-align: center; 
				border-top: 1px solid #ab6400; padding-top: .25em; letter-spacing: 1px;
				width: 100%; margin: 0 auto 4em auto; position: relative; cursor: pointer; 
				display: none;
				}
			.folded .revealer { display: block; }
			.revealer:after {
				content: ""; display: block; position: absolute; width: 40%; 
				height: 2em; top: 0; border: 1px solid #ab6400; border-top: 0;
				left: 30%; border-radius: 0 0 1em 1em;
			}
			
			.revealer:hover {  }
		
		.courseList { 
			position: absolute; z-index: 999;
			margin: 0 auto; border-radius: 5px;
			right: 0; bottom: 0; height: 0; width: 0; overflow: hidden; opacity: 0;
			background: var(--mainBGcolor);
			padding: 0; 
			font-size: .9rem;
			transition: opacity .5s;
			border: 1px solid var(--theBlue);
			}
			.courseList label, .courseList ul { background: var(--mainBGcolor); }
			.courseList label { font-size: 1.15rem; }
			.courseList label, a.listolink { line-height: 2.4; padding: .1em 0 .1em .35vw; margin: .3em 0;  }
			.courseList label { display: block; cursor: pointer; border-top: 1px solid var(--theBlue); margin: 0; clear: both; }
			.courseList label:hover { background: rgba(255,255,255,.1);  }
			
			.courseList label:before { content: "❯"; transform: rotateZ(90deg); display: block; float: right; margin: 0 .3em 0 0; transition: transform .25s; }
			.courseList label.revealed:before { transform: rotateZ(-90deg); }
			
			.courseList input { display: none; }
		
			#bigNav span { display: inline-block; width: 0; height: 0; overflow: hidden; }
			
			#closeList span { float: right; text-align: right; width: 50%; display: block; padding-right: .5em; }
#closeList span:after { content: "❯"; transform: rotateZ(-90deg); display: inline-block; /*height: 24px;*/ width: 24px; 
/* font-size: 2rem;  */
}			
			.courseList ul { list-style: none; padding: 0; margin: 0 .5em; }
			
			.courseList a { padding: .6em; margin: 0 0 .3em 0; font-weight: 500; font-variation-settings: "wght" 500;display: block; }
			
			.courseList h2 { color: #fff; padding: .4em 0 .7em 77px; margin: 0 -.5rem 0 -.5rem ; background: var(--theBlue) ; border-radius: 5px 5px 0 0; height: 60px; line-height: 33px; font-family: var(--theSans); font-size: 30px; font-weight: 300; font-variation-settings: "wght" 300;cursor: pointer; text-align: left; }
		
		#darkness { position: fixed; width: 0; height: 0; top: 0; left: 50%; background: var(--mainBGcolor); z-index: 888; opacity: 0; filter: blur(20em); transition: opacity .5s; }
		
		.coursesShown #darkness { width: 100%; height: 100vh; top: 0; bottom: auto; left: 0; right: 0; opacity: .6; filter: blur(0); }

		.coursesShown #select, .coursesShown #select:after { opacity: 0; background: transparent; filter: blur(0); }
		
		.coursesShown { background: none; background-image: none !important;}

		.coursesShown h1, .coursesShown aside, .coursesShown nav, .coursesShown main, .coursesShown #logo, .coursesShown footer, .coursesShown .covid, .coursesShown section, .coursesShown .featured { filter: blur(5px); }
		
		.coursesShown .courseList { top: .25em; left: .3em; right: .3em; width: 100%; /* max-width: 430px; */
			max-width: 30em; padding: 0 .5rem .25rem .5rem; bottom: auto; height: auto; overflow: visible; opacity: 1; }
		
		.courseList input + ul {
			overflow: visible; 
			max-height: 900px;
			transition: max-height .333s;
			margin-bottom: 1em;
			}
			
		.courseList input:not(:checked) + ul {
			overflow: hidden; 
			max-height: 0;	
			margin-bottom: 0;
			}

	#courses a, #bigNav a { text-align: left; }
			
			#courses a div, #bigNav a div { 
				height: 1.2em;
				margin: 0;
				padding: 0;
				display: inline-block; float: right;
				background-size: contain; z-index: 99;
			}
			.darkmode #courses a div, .darkmode #bigNav a div { filter: invert() hue-rotate(180deg); }
			
			.inpersonclass { background: url(/images/inPerson.svg) no-repeat center; width: 2.5em; }
			.zoomclass { background: url(/images/zoom.svg) no-repeat center; width: 2.75em;}
			.vodclass { background: url(/images/vidOnly.svg) no-repeat center; width: 2.5em; }


#helloThere { width: 200px; height: 200px; background: url(/images/helloThere.svg) no-repeat; background-size: contain; position: absolute; display: none; }	
/*  end description page  */	

@media only screen and (min-width: 740px) {
	footer td, .home footer td  { font-size: .95rem; }
	html {background-size: 100% 100vh, auto;}
	a[href="#choosing"] {display: none; }
	.featured a { padding: 0; border-radius: 0; margin: 2em auto; border: 0; }
	.offerings { font-size: 1.4rem;}
	.quote { display: block; width: 100%; } 
	.description .quote { display: none; } 
	.folded #outline { max-height: 500rem; }
	.folded #outline:after, .folded .revealer { display: none; }
	
	#logo { justify-self: start; }
	.coursesShown #select, .coursesShown #select:after { filter: blur(20px); }

	h1 { 
		font-size: calc(.03415 * 100vw + 1rem); 
		align-self: center; } 
	.welcome h2 { font-size: 45px; font-size: 9cqw; }	
	.welcome h2 .tagline { margin-top: 0; }

	body {
		grid-gap: 1.7875rem;
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto;
		grid-template-areas:	"logo 		nav"
							"cart		othernav"
							"h1			h1"
							"main		quickContact"
							"main		quote"
							"main	 	footer";
		}
	.listofclasses { 
		grid-template-columns: 1fr 1fr;
		grid-gap: 1.7875rem;
		grid-template-rows: auto;
		grid-template-areas:	"logo 		nav"
							"cart		othernav"
							"h1			quickContact"
							"main		deliveryBlurbs"
							"main		deliveryBlurbs"
							"footer		footer";
		}
		.resources { 
			grid-template-columns: 1fr 1fr;
			grid-template-rows: auto;
			grid-template-areas:	"logo 		nav"
								"cart		othernav"
								"h1			h1"
								"main		main"
								"quickContact	quote"
								"footer	 	footer";
			}

		.policies { 
			grid-template-columns: 1fr 1fr 1fr;
			grid-gap: 2.6rem;
			grid-template-rows: auto;
			grid-template-areas:	"logo 		othernav		nav"
								"logo		cart			nav"
								"h1			h1			h1"
								"main		main			quickContact"
								"footer		footer		footer";
			}
			
		.checkout { 
			grid-template-columns: 1fr 1fr;
			grid-template-rows: auto;
			grid-template-areas:	"logo 		nav"
								"cart		othernav"
								"h1			quickContact"
								"main		main"
								"footer		footer";
			}

		.receipt { 
			grid-template-columns: 1fr 1fr;
			grid-template-rows: auto;
			grid-template-areas:	"logo 		nav"
								"cart		othernav"
								"h1			quickContact"
								"main		quickContact"
								"footer		footer";
			}

		.home {
			grid-template-columns: 1fr 1fr;
			grid-template-rows: auto;
			grid-gap: 1em;
			grid-template-areas:	"logo	nav"
								"cart	othernav"
								"welcome	welcome"
								"why	quickContact"
								"why	featured"
								"why	quote"
								"news	news"
								"footer 	footer"								
		}
		
		.description {
			grid-template-columns: 2fr 3fr;
			grid-template-rows: auto;
			grid-template-areas:	"logo		nav"
								"cart 		othernav"
								"h1			h1"
								"quickContact	main"
								"classDates	main"
								"classDates	quote"
								"classDates	footer";
		}

		.QandA {
			grid-template-columns: 1fr 1fr 1fr;
			grid-template-rows: auto;
			grid-template-areas:	"logo		nav	nav"
								"cart 		othernav	othernav"
								"h1		h1	quickContact"
								"main	main	news"
								"questions	questions	news"
								"questions	questions	news"
								"footer		footer	news";
		}

		.calendarPage {
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto;
		grid-template-areas:	"logo 		nav"
							"cart		othernav"
							"h1			quickContact"
							"inst			quickContact"
							"main		main"
							"footer	 	footer";
		}
		.category {
			grid-template-columns: 1fr 1fr 1fr; 
			grid-template-rows: auto;
			grid-template-areas:	"logo	nav		nav"
								"cart 	othernav	othernav"
								"h1		h1		h1"
								"main	main		quickContact"
								"main	main		quote"
								"footer	footer	footer";
		}

	.why, .news { width: 100%; }
	.newsGrid {
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-gap: 3em;
	}

 	.delivery a { width: 90%; }
	.courseData { font-size: 1rem; } 
	nav ul { justify-content: space-evenly; }
	.folded .pic { display: none; } 
	#select { justify-self: center; }
	.classDates { justify-self: start; }
	.classDates { height: 35em; }
	.quickContact { justify-self: center; align-self: start; font-size: .96rem; }
	.featured {
		/*align-self: start;
		 display: flex;
		justify-content: space-between; */
		/* margin: 1.5em 0 0 0; */
		/* border-bottom: 1px solid rgba(126, 126, 126, 0.5);
		padding-bottom: 1em; */
	}
	.home .featured h2 { margin-top: 0;}
	.quickContact .buttony {
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-gap: 1em; margin: 0;
		grid-auto-rows: max-content;
	}
	.quickContact a {
		display: grid;
		align-self: stretch;
		align-items: center;
	}
	
	.othernav { width: 100%; }
	div#social { margin: 0 auto 1.5em 0; }

	.home .quote { align-self: start !important; justify-self: start !important; } 
	
	.newsGrid p, .why p { padding-left: 1em; }
}

@media only screen and (min-width: 1150px) {

	html { background-size: 100% 1150px, auto; }
	.welcome { align-self: start; }
	.welcome h2 { text-align: center; /* font-size: 50px;  */font-size: 18cqw; }	
	/* .news h2 { padding-right: 2em; } */
	.description .quote { display: block; align-self: center; height: 60vw; } 
	.coursesShown .courseList { top: 1em; left: -19px; right: 19px; opacity: 1; }
	.coursesShown #select, .coursesShown #select:after { filter: blur(0); }


	body, .resources, .category { 
	grid-template-columns: 1fr 1fr 1fr;
	grid-template-rows: auto;
	grid-template-areas:	"logo 	othernav		nav"
					"logo		cart			nav"
					"h1		h1			h1"
					"main		main			quickContact"
					"main		main			quote"
					"main		main			."
					"main		main			."
					"main		main			."
					"footer	footer		footer";
	}
	
	.listofclasses { 
	grid-template-columns: 1fr 1fr 1fr;
	grid-gap: 2.6rem;
	grid-template-rows: auto;
	grid-template-areas:	"logo 		othernav		nav"
						"logo		cart			nav"
						"h1			h1			quickContact"
						"main		main			deliveryBlurbs"
						"main		main			deliveryBlurbs"
						"footer		footer		footer";
	}
	
	.directions {
		grid-template-areas:	"logo 		othernav		nav"
							"logo		cart			nav"
							"h1			h1 			h1"
							"main		main			quickContact"
							"main		main			pic"
							"main		main			pic"
							"main		main			pic"
							"main		main			pic"
							"footer		footer		footer";
	}

	.QandA { 
		background-size: 225px auto;
		grid-template-columns: 1fr 1fr 1fr;
		grid-template-areas:	"logo 		othernav		nav"
							"logo		cart			nav"
							"h1			h1			quickContact"
							"main		main			news"
							"questions	questions		news"
							"footer		footer		news";
		}

	.home {
			grid-template-rows: auto;
			grid-template-columns: 1fr 1fr 1fr;
			grid-gap: 3em 1em;
			grid-template-areas:	"logo 		othernav		nav"
							"logo 		othernav		cart"
							". 		welcome		."
							"why		welcome		quickContact"
							"why		quote			featured"
							"why		news			news"
							"why	footer	footer"
							"why	footer	footer";
		}

	.description {
		grid-template-rows: auto;
		grid-template-columns: 1fr 1fr 1fr;
		grid-template-areas:	"logo 		othernav		nav"
							"logo		cart			nav"
							"h1			h1 			h1"
							"classDates	main			quickContact"
							"classDates	main			pic"
							"classDates	main			pic"
							"classDates	main			pic"
							"classDates	main			pic"
							"classDates	main			quote"
							"classDates	main			quote"
							"classDates	footer		footer";
	}

		.calendarPage {
		grid-template-rows: auto;
		grid-template-columns: 1fr 1fr 1fr;
		grid-template-areas:	"logo 		othernav		nav"
							"logo 		cart			nav"
							"h1			h1			quickContact"
							"inst			inst			quickContact"
							"main		main			main"
							"footer		footer		footer";
		}

		.checkout {
		grid-template-rows: auto;
		grid-template-columns: 1fr 1fr 1fr;
		grid-template-areas:	"logo 		othernav		nav"
							"logo 		cart			nav"
							"h1			h1			quickContact"
							"main		main			main"
							"footer		footer		footer";
		}

		.receipt {
		grid-template-rows: auto;
		grid-template-columns: 1fr 1fr 1fr;
		grid-template-areas:	"logo 	othernav	nav"
							"h1 		cart		quickContact"
							"main	main		main"
							"footer	footer	footer";
		}
/* 	.nowebp.description  { background-image: url(/images/classroomFade.png); }
	.webp.description  { background-image: url(/images/classroomFade.webp); } */

	.description  { 
		background-size: 50% auto; 
		background-position: 0 50px;
		background-repeat: no-repeat;
		}
	#logo { justify-self: end; margin-right: .5em; }
	
	h1 { font-size: 3.237rem;  }
	.welcome h2  { /* font-size: 85px; */ text-align: center; }	
	.home main section { max-width: 30%; }
	.home main section.news { max-width: 100%; }
	.folded .pic, .pic { display: block;  } 
	.classDates { justify-self: end; }
	.classDates { height: 35em;  }
	.quickContact { justify-self: center; font-size: 1rem; }
	footer { text-align: left; margin: 0; }

	.delivery a { width: 100%; }
	.covid ul { margin-bottom: 0; }

	main > h2:first-child, section h2:first-child, aside h2, .covid h2 { margin: 0 0 .25em 0; }
}

/*  More description page items...  */

		.description main dt { margin: 2em 0 0 0; font-family: var(--theSans); font-weight: 600;  font-variation-settings: "wght" 600;}
		.description main ul { margin: .25em 0 0 0; padding: 0 0 0 1.5em; }
		.description main dd { margin: 0; padding: 0; line-height: 1.3; }
		.description main li { margin: .25em 0; font-weight: 250;  font-variation-settings: "wght" 250;}
		.description main li li { font-weight: 150; font-variation-settings: "wght" 150; }
		
		#classesOffered {
		  width: 100%;
		}
		
		#classesOffered p {
		  font-family: var(--theSans);
		  font-size: .9rem;
		}
		
		.signUp { clear: left; text-align: center; margin: -.5em 0 1em 0; }
		
		.classEntry {
		  display: block;
		  text-decoration: none;
		  padding: .5em;
		  padding-bottom: .25em;
		  border-radius: .5em;
		  margin-bottom: 2em;
		  border: 1px solid rgba(155,130,75,.5);
		  background: rgba(255, 255, 255, .2);
		}
		
		.description #recording {
		  border: 1px solid rgba(0,0,0,.5);
		  background: rgba(220, 220, 255, .1);
		}
		.description #zoomClassesOffered { display: none; }
		.description.zoom #zoomClassesOffered { display: block; }
		
		.description.zoom h1:after { display: block; content: "online via zoom"; color: var(--textColor); font-family: var(--theSans); font-weight: 200; font-variation-settings: "wght" 200;font-size: 1.4rem;  margin-top: .5em; }

		.classEntry:hover { background: rgba(255, 255, 255, .3); }
		
		.classEntry:after {
		  content: "";
		  display: block;
		  width: 0;
		  height: 0;
		  clear: both;
		}
		
		.classEntry h3 {
			color: var(--textColor);
		}
		
		.tinyCalendars {
		  text-align: center;
		  font-size: 1.6px;
		  font-family: var(--theSans);
		  width: 118px;
		  float: right;
		}
		
		
		.tinyMonth {
		  width: 58px;
		  margin-bottom: 8px;
		  font-size: 2.88px;
		  float: left;
		}
		
		.tinyMonth:nth-child(2n) { margin-left: 2px; }
		
		.tinyMonth:nth-child(3) { clear: left; }
		
		.tinyMonth:after {
		  content: '';
		  display: block;
		  clear: both;
		  width: 0;
		  height: 0;
		}
		
		.tinyCalendars h2 {
		  color: rgba(151,113,36,.06);
		  line-height: 12.8px;
		  margin: 0 0 -33.6px 0;
		  font-weight: 700;font-variation-settings: "wght" 700;
		  font-size: 25.1px;
		  padding-top: 21px;
		}
				
		.tinyMonth div {
		  width: 6.4px;
		  margin: 0.5px 0.8px;
		  height: 6.4px;
		  float: left;
		  border-radius: 50%;
		  background: rgba(0, 0, 0, 0.1);
		  z-index: 50;
		}
		
		.tinyMonth .tinyMonthStart-0 { margin-left: 0.8px;}
		.tinyMonth .tinyMonthStart-1 { margin-left: 8.8px;}
		.tinyMonth .tinyMonthStart-2 { margin-left: 16.8px;}
		.tinyMonth .tinyMonthStart-3 { margin-left: 24.8px;}
		.tinyMonth .tinyMonthStart-4 { margin-left: 32.8px;}
		.tinyMonth .tinyMonthStart-5 { margin-left: 40.8px;}
		.tinyMonth .tinyMonthStart-6 { margin-left: 48.8px;}
		
		.tinyMonth .offered { background: rgba(217,0,0, 1); border-radius: 0; }
		
		.tinyMonth .calDays {
		  background: none;
		  opacity: .5;
		  font-size: 7.2px;
		}
		
		.seatGauge { margin-left: 103px; }
		
		.seatGauge div {
		  float: left;
		  width: 6.4px;
		  height: 6.4px;
		  border-radius: 50%;
		  background: rgba(115, 115, 115, 0.2);
		  margin-right: 3.2px;
		  margin-bottom: .25em;
		}
		
		form.buyOrShop {
		  clear: both;
		  font-size: 90%; font-weight: 500;font-variation-settings: "wght" 500;
		  padding-top: 1em;
		  text-align: center;
		}
				
		.buyOrShop div { display: flex; margin-top: .4em; }

		.buyOrShop label, .buyOrShop select { font-weight: 500; font-variation-settings: "wght" 500;font-size: 110%; }
		.buyOrShop select { background-color: rgba(255, 255, 255, .4); }
		.buyOrShop div button { font-weight: 500; font-variation-settings: "wght" 500;font-size: 110%; }
		
		.buyOrShop select, .buyOrShop option { background-size: auto 150%; }
		

		
		a[id*="buy"] {
		  display: block;
		  flex: 1;
		  margin: .5em .2em;
		  padding: .3em;
		  background: transparent;
		  border: 2px solid #fff;
		  border-radius: .6em;
		  text-align: center;
		  text-decoration: none;
		  background: rgba(0,0,0, .7);
		  cursor: pointer;
		  font-weight: 300;font-variation-settings: "wght" 300;
		}
		#recording a[id*="buy"] {
		  border: 2px solid #000;
		  background: rgba(0,0,30, .7);
		}
		a[id*="buy"] span { font-weight: 700;font-variation-settings: "wght" 700; }
		a[id*="buy"]:hover, a[id*="buy"]:hover { filter: invert(1); }
				


#CnC { display: flex; justify-content: center; flex-wrap: wrap; }
.CnCbooklink { display: block; margin: 1em auto; width: 160px; height: 200px; background-position: center center; background-repeat: no-repeat; background-size: contain; text-indent: -999em;}
.CnCID { background-image: url(/images/IDbookcover1.png); }
.CnCAI { background-image: url(/images/AIbookcover1.png); }
.CnCPS { background-image: url(/images/PSbookcover2.png); }
.CnCPR { background-image: url(/images/PRbookcover1.png); }
.CnCLR { background-image: url(/images/LRbookcover1.png); }
.CnCAE { background-image: url(/images/AEbookcover1.png); }
#CnC div { flex: 1; margin: 0 .5em; }
.home #CnC div { min-width: 70%; }
#CnC div { min-width: 40%; }

@media only screen and (min-width: 740px) {
	#CnC div, .home #CnC div { min-width: 40%; }
}

input#darkmodeSwitch { 
	-webkit-appearance: none; appearance: none; 
	position: relative;
	display: inline-block; padding: 0;
	margin: 0 0 -.5em 0;
	width: 2.2rem; height: 1.2rem;
	border-radius: .6rem;
	border: 1px solid #888;
	cursor: pointer;
}
label[for="darkmodeSwitch"] { cursor: pointer; padding: 0 .25em; font-size: .9rem; }

input#darkmodeSwitch::before {
  display: block; position: absolute;
  content: '';
  left: .07rem;
  top: .086rem;
  border-radius: 50%;
  width: .9rem;
  height: .9rem;
  background-color: #aaa;
  transform: translateX(0);
  transition: transform .5s, background-color .5s;
}

input#darkmodeSwitch:checked { border: 1px solid #ddd; background-color: #000; }

input#darkmodeSwitch:checked::before { 
	 transform: translateX(.95rem);
	 background-color: #fff;
 }
