@charset "UTF-8";
@import url("reset.css");
/* Created by Brendan P. Behan for BrendanBehan.dance */

/* Colors
---------------------------------------------------------- */
/* Primary palette: 
   (1) bice blue (2) dark purple (3) carmine red (4) lavender web (5) mountbatten pink
   (1) #006ba6   (2) #32213a     (3) #9b1d20     (4) #dfd9e2      (5) #af7595 
   Logo Palette: blue #0487D9
*/
/* Variant A: 
		--thistle --mint --persiangreen --carmine --biceblue (--darthmouthgreen --maize --periwinkle-3 --fawn --rosybrown --lavenderpink --sandybrown --teagreen-2 --pearl --black-2 --dkpurple) */
/* Variant B (dropping carmine+biceblue): 
		--dkpurple --persiangreen --mint (--timberwolf --gamboge) (--amber --cerise) 
*/
:root {
	--biceblue: #006BA6; /*--Bice Blue--*/
	--blue: #0487D9; /*--Logo Blue/Link Blue--*/
	--dkpurple: #32213A; /*--Dark Purple--*/
	--red: #9B1D20; /*--Carmine--*/
	--lavender: #DFD9E2; /*--Lavender (web)--*/
	--pink: #AF7595; /*--Mountbatten Pink--*/
	--black-2: #07020D;
	--salmonpink: #EF959D;
	--sandybrown: #F5A65B;
	--lion: #AF9164;
	--pearl: #E7DFC6;
	--maize: #FFF689;
	--mintgreen: #CDF7F6;
	--periwinkle: #BBB6DF;
	--periwinkle-2: #C6C8EE; /* w/ --thistle */
	--periwiknkle-3: #AFAFDC; /* w/ --mint --persiangreen --carmine --biceblue */
	--lavenderblush: #F1E4E8;
	--platinum: #E2DCDE;
	--skyblue: #48CDEC;
	--cerulean: #247BA0;
	--bice-shade-lt: #0085CC;
	--lapislazuli: #0A5C90;
	--bice-dk: #12507F;
	--bice-dker: #184771;
	--lavender-2: #AFAFDC;
	--rosybrown: #B09398;
	--thistle: #BFB1C1; /* w/ --persiangreen --mint */
	--lilac: #C3ACCE;
	--lavenderpink: #E6AACE;
	/*--plum: #7D387D;*/
	--plum: #894A89; /*Pomp and Power*/
	--cambridgeblue: #7DAF9C;
	--persiangreen: #339989;
	--mint: #02C39A;
	--dartmouthgreen: #036016;
	--pistachio: #A5CC6B;
	--teagreen: #CDEAC0;
	--teagreen-2: #D6FFB7;
	--vanilla: #EFE9AE;
	--fawn: #FFC07F;
	--timberwolf: #E5DADA;
	--gamboge: #E59500;
	--amber: #FFBF00;
	--cerise: #E83F6F;
	--melon: #E9AFA3;
	--champagnepink: #F9DEC9;
	--black: #000000;
	--white: #FFFFFF;
	/* navy w/ --gamboge --carmine */
	--deepnavy: #111a4f;
	--bubblegum: #ef798a;
	--pacificcyan: #258EA6;
}

p						{ color: var(--black); }
h2, h5, h4 span			{ color: var(--dkpurple); }
a, a:visited 			{ color: var(--blue); }
h4,
h4 a,
h4 a:visited,
.annual-calendar li .season,
h3 span.year 			{ color: var(--pink); }
.title-wrapper h4,
header h4,
h1 em,
h1 span,
h2 span,
.callout p span.date,
blockquote,
blockquote p 			{ color: var(--biceblue);}
.callout p span.season,
.callout p span.year	{ color: var(--bice-dk)}
nav, button, 
nav a, button a,
nav a:visited, 
button a:visited,
nav .active a:hover,
.social-menu a,
.social-menu a:visited 	{ color: var(--lavender); }
h3, h3 a, h3 a:visited 	{ color: var(--cerulean); }
.site-design a,
.site-design a:visited 	{ color: var(--skyblue); }
h1, h6,
a:hover, button a:hover, nav a:hover, .social-menu a:hover, h4 a:hover,
.class-schedule .note, .class-schedule .title-wrapper h3, .class-schedule header h3,
.dates sup, button sup, .button sup, .advisory sup,
.time span, .dance-class span, .weekday span,
.callout p span, .other-links p span,
.warning, .red		 	{ color: var(--red); }
.other-links p span.age-range,
.plum					{ color: var(--plum); }
h4.location 			{ color: var(--dkpurple); }
footer p	 			{ color: var(--pistachio); }
.class-page h2.season-year { color: var(--dartmouthgreen);}
.annual-calendar li .session { color: var(--bice-dk); }
.spring-green 			{ color: var(--cambridgeblue); }
button {
	border: 1px solid var(--lilac);
	background-color: rgba(0, 0, 0, 0);
}
.button:after {
	background-color: var(--pink);
}
.mobile-nav-toggle:hover {
	background-color: rgba(0,0,0,0.1);
	border-color: var(--dkpurple);
}
.mobile-nav-toggle:hover .burger-wrapper > div {
	background-color: var(--pink);
}
.has-border,
.warning {
	border: 1px solid var(--biceblue);
}
.callout {
	border: 1px solid var(--pink);
}
.callout.no-border {
	border: none;
}
.class-page .class-schedule {
	border: var(--dartmouthgreen) 1px dashed;
}
.reg-info .title-wrapper {
	background-color: var(--bice-dk);
}
.reg-info .title-wrapper,
.reg-info .title-wrapper h2 {
	color: var(--pistachio);
}
.class-page .weekday {
	color: var(--pacificcyan);
}

/* Backgrounds
---------------------------------------------------------- */
body {
	background-color: var(--lavender);
}
.primary-nav {
	background-color: var(--biceblue);
}
.primary-nav .logo-wrapper {
	background-image: url("../_img/logo-color-horiz-whitetext-bbdance.svg");
}
footer .logo-wrapper {
	background-image: url("../_img/logo-brendanbehandance-tricolor-whiteletters-horiz.svg");
}
.logo-wrapper {
	background-repeat: no-repeat;
}
footer {
	background-color: var(--blue);
	background-image: url("../_img/bg/pattern-bhe6-0487d9.png");
	background-repeat: repeat;
}
.location {
	background-image: url("../_img/icons/logo-geolocation_carmine_300r128h.png");
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 1.25rem;
}
.class-page .class-schedule {
	background-color: var(--pistachio);
}
.annual-calendar {
    background-color: var(--lavenderblush);
}

/* Fonts and Text
---------------------------------------------------------- */
html 		{ font-size: 16px; }
html, body 	{ 
	min-height: 100vh;
	position: relative;
}
body {
	display: grid;
	grid-template-rows: min-content 1fr;
	overflow-x: hidden;
	text-orientation: upright;
    writing-mode: lr;
}
p, blockquote, legend, input, label,
table, caption,
ul, ol, li {
	font-style: normal;
	font-weight: 300;
	text-align: left;
}
p, blockquote, legend, input, label,
table, caption,
ul, ol, li,
h1,h2,h3,h4,h5,h6 {
	text-wrap: wrap;
}
.class-schedule .weekday {
	text-wrap: nowrap;
}
.caps,
.weekday span {
	text-transform: uppercase;
}
.paper-body .references,
.references li,
.references li a {
	overflow-wrap: break-word;
    word-break: break-word;
}
h1, header h2, .title-wrapper h2, h3, h5, blockquote, .meta {
	font-family: brandon-grotesque, Helvetica, Arial, sans-serif;
}
h2, h4, h6, h2>span, .time span, .weekday span {
	font-family: rift, Helvetica, Arial, sans-serif;;
}
p, li, nav, button {
	font-family: mr-eaves-modern, Helvetica, Arial, sans-serif;
}
h4 a,
h4 :link,
a:hover, a:active, 
a:link:hover, a:link:active {
	text-decoration: underline;
}
cite, span { 
	font-family: inherit;
	font-size: inherit;
}
span {
	font-style: inherit;
}
em, i, blockquote,
blockquote p,
h2>span, 
.time span,
.dance-class span,
blockquote .attribution em,
blockquote .attribution i { 
	font-style: italic; 
}
cite,
blockquote em,
blockquote i,
blockquote span {
	font-style: normal;
}
strong, b, h1, h3, h5,
.reg-info .title-wrapper h2,
.section-title .diacritic,
button a sup, .button a sup,
.annual-calendar li span,
.dance-class			{ font-weight: 700; }
h4 span					{ font-weight: 500; }
.references li .diacritic.force-lower-case,
.footnotes li .diacritic.force-lower-case,
.paper-body .photo-caption .diacritic.force-lower-case,
h1 span, h2, h6		 	{ font-weight: 400; }
nav, nav li, button,
ul, li,
h1+h2,
.reg-info h2,
h4,
h3 span, h5 span, h6 span,
.location,
.dance-class span, .time span, .dates span,
.section-title .subtitle .diacritic,
.references li, .footnotes li, .annual-calendar li,
li.note		  			{ font-weight: 300; }
.paper-body .meta,
.deemphasis				{ font-weight: 200; }
.force-lower-case 		{ letter-spacing: 0.075em; }
h1 						{ font-size: 72px; }
.weekday 				{ font-size: 60px; }
h2						{ font-size: 52px; }
.dance-class 			{ font-size: 40px; }
h3, .location 			{ font-size: 36px; }
h3 .diacritic			{ font-size: 35px; }
h4, h5, h6	 			{ font-size: 32px; }
p, li, blockquote		{ font-size: 28px; }
.class-page .class-schedule h2 { font-size: 24px; }
.cityofevanston-accessibility-statement,
.paper-body p,
.paper-body blockquote,
.footnotes li,
.annual-calendar li,
.weekday span,
.time span, 
.dance-class span 		{ font-size: 22px; }
button,
.note, .dates,
.class-schedule .age-range,
footer li, nav li		{ font-size: 20px; }
.warning p,
.photo-caption, .date-line, .meta,
.paper-body .photo-caption,
.paper-body .date-line,
.paper-body .meta 		{ font-size: 18px; }
.paper-body .diacritic.force-lower-case,
.references li			{ font-size: 16px; }
.site-design,
.copyright				{ font-size: 15px; }
.footnotes li .diacritic.force-lower-case
						{ font-size: 14px; }
.references li .diacritic.force-lower-case,
.paper-body .photo-caption .diacritic.force-lower-case
						{ font-size: 13px; }
button a sup			{ font-size: 90%; }
.other-links .age-range	{ font-size: 70%; }
sub, sup 				{ font-size: 60%; }
.dance-class sup 		{ font-size: 50%; }
sub 					{ vertical-align: sub; }
sup 					{ vertical-align: super; }
sub, sup { 
	line-height: 1;
	text-indent: initial;
}
.center,
h1, h2,
.title-wrapper h3, .title-wrapper h4,
.title-wrapper h5, .title-wrapper h6,
h1, main header h2,
main header h3, main header h4,
main header h5, main header h6,
.lead-image + .photo-caption,
.center + .photo-caption,
.column img + .photo-caption,
.works-page p.attribution,
.secondary-nav li,
.social-menu li,
.site-design, .copyright,
.other-links, .other-links p {
	text-align: center;
}
.class-schedule h2 {
	text-align: left;
}

button {
  letter-spacing: 1px;
}
h1, h2,
h3, h4, h5, h6,
blockquote,
p {
	line-height: 1.3em;
}
main li,
.paper-information {
	line-height: 1.2em;
}
.class-page .class-schedule h2 {
	line-height: 1.1em;
}
.annual-calendar li {
    line-height: 1.15rem;
}

nav a,
button a,
button a:hover sup, button a:link:hover sup,
button a:hover, button a:active, 
button a:link:hover, button a:link:active,
sup a,
h3 a,
a.note-return { text-decoration: none; }

.hide, .callout .hide, button.hide,
.home-page nav li.active,
nav .nav-menu > li.cv-link,
nav .nav-menu > li.as-link { 
	display: none; 
}

/* Positioning
---------------------------------------------------------- */
.primary-nav,
.nav-menu,
main,
.lead-image-wrapper,
.section-image-wrapper,
footer > .inner-wrapper {
	display: flex;
}
footer > .inner-wrapper {
	align-content: center;
	flex-wrap: wrap;
}
main {
	justify-content: center;
    flex-flow: row wrap;
}
sub > a, sup > a {
	display: inline-block;
    height: 1.75em;
    margin-inline-end: -0.25em;
    min-width: 1em;
	padding-inline-end: 0.25em;
	position: relative;
	z-index: 10;
}

nav,
section,
.lead-image-wrapper,
.location-wrapper,
.photo-frame {
	margin-bottom: 4rem;
	margin-block-end: 4rem;
}
.research-page .precedes-submenu,
.book-mark-links-nav {
	margin-bottom: 2rem;
	margin-block-end: 2rem;
}
.class-page .location-wrapper,
.location-wrapper .photo-frame,
.location-wrapper .photo-frame img,
.class-page .class-schedule h2,
.warning p:last-child {
	margin-bottom: 0;
	margin-block-end: 0rem;
}
header h2,
p, h4, h6,
legend, input, label,
img, iframe, object,
blockquote, 
table {
	margin-bottom: 2rem;
	margin-block-end: 2rem;
}
h1, h2, h3, h5,
ul, ol, li,
.footnotes li { 
	margin-bottom: 1.5rem;
	margin-block-end: 1.5rem; 
}
footer li,
.references li {
	margin-bottom: 1.25rem;
	margin-block-end: 1.25rem; 
}
.paper-body p,
.annual-calendar li {
	margin-bottom: 1.15rem;
	margin-block-end: 1.15rem;
}
.title-wrapper h2,
.class-page .class-schedule,
.lead-image + .photo-caption,
img.center + .photo-caption,
img.has-caption,
.excerpt,
.class-page .weekday {
	margin-bottom: 1rem;
	margin-block-end: 1rem;
}
.callout > h4:last-child,
.callout p.advisory,
.class-page header h1,
.class-page header h2 {
	margin-bottom: 0;
	margin-block-end: 0rem;
}
.class-page .weekday {
	margin-top: 0;
	margin-block-start: 0rem;
	margin-bottom: 0.25rem;
	margin-block-end: 0.25rem;
}
.dates {
	margin-bottom: 0.5rem;
	margin-block-end: 0.5rem;
}
.class-page .dates {
	margin-bottom: 0.25rem;
	margin-block-end: 0.25rem;
}
.classes-page .dates,
h5.dates {
	margin-top: 0;
	margin-block-start: 0;
}
.classes-page .dates+.dates,
.cityofevanston-accessibility-statement,
.paper-body blockquote,
.paper-body blockquote p,
.site-design {
	margin-bottom: 0.5rem;
	margin-block-end: 0.5rem;
}
header p.note,
.warning {
	margin-top: 1.5rem;
	margin-block-start: 1.5rem;
}
.indent {
	text-indent: 1.625rem;
}
.photo-caption {
	margin-right: 3rem;
	margin-left: 3rem;
	margin-inline: 3rem;
}
header p.note,
.warning,
.annual-calendar,
.meta {
	margin-right: 2rem;
	margin-left: 2rem;
	margin-inline: 2rem;
}
blockquote .attribution {
	margin-top: 1.25rem;
    margin-block-start: 1.25rem;
	margin-bottom: 0;
	margin-block-end: 0rem;
	font-size: 80%;
	font-style: normal;
}
.class-schedule h4,
.class-schedule p,
li.pretitle,
.pretitle h4,
.dates.has-note,
.classes-page .dates+.dates.has-note,
p.note {
	margin-bottom: 0;
	margin-block-end: 0.375rem;
}

.primary-nav {
    flex-flow: column wrap;
	align-content: center;
	justify-content: center;
	padding-block: 1rem;
}
.primary-nav > .wrapper,
footer .row {
	display: flex;
	align-items: center;
    gap: 2rem;
    justify-content: space-around;
}
.primary-nav .logo-wrapper,
footer .logo-wrapper {
    height: 70px;
}
.primary-nav .logo-wrapper,
footer .logo-wrapper,
footer .social-wrapper {
    width: 200px;
}
.primary-nav .logo-wrapper a,
footer .logo-wrapper a {
	cursor: pointer;
	display: block;
	height: 100%;
	width: 100%;
}
footer .logo-wrapper,
footer .social-wrapper {
	margin-block-end: 1rem;
}
.primary-nav-menu {
	flex-flow: row nowrap;
	padding-inline-start: 0.75rem;
	transition: transform 250ms ease-in;
}
.secondary-nav .nav-menu,
.lead-image-wrapper {
	flex-flow: column nowrap;
}
.primary-nav-menu,
p.copyright {
	margin-bottom: 0;
	margin-block-end: 0rem;
}
.primary-nav-menu > li {
	margin-bottom: 0;
	margin-block-end: 0rem;
	margin-right: 2.5rem;
	margin-inline-end: 2.5rem;
}
.primary-nav-menu li a {
	display: block;
	padding: 0.5rem;
}

blockquote,
.warning,
.other-biz, 
.copyright-wrapper {
	padding-right: 2rem;
	padding-left: 2rem;
	padding-inline: 2rem;
}
blockquote,
.warning {
	padding-top: 2rem;
	padding-bottom: 2rem;
	padding-block: 2rem;
}
.class-page .class-schedule {
	padding-top: 1rem;
	padding-bottom: 1rem;
	padding-block: 1rem;
}
h3+blockquote,
h4+blockquote,
h5+blockquote,
h6+blockquote {
	padding-top: 1rem;
	padding-block-start: 1rem;
}
.cityofevanston-accessibility-statement,
.paper-body blockquote {
	margin-bottom: 0;
	margin-block-end: 0rem;
	padding-top: 0.75rem;
    padding-block-start: 0.75rem;
}

footer {
	margin-top: 3rem;
	margin-block-start: 3rem;
	padding-top: 2rem;
	padding-bottom: 1.5rem;
	padding-block: 2rem 1.5rem;
}
.secondary-nav {
	margin-bottom: 0;
	margin-block-end: 0rem;
}
footer,
.other-biz,
.copyright-wrapper {
	position: relative;
}

.row,
.column {
	flex-wrap: nowrap;
}
.row {
	display: flex;
	flex-direction: column;
	gap: 0rem;
	justify-content: space-between;
}
.column {
	display: flex;
	flex-direction: column;
}
.row > .column {
	flex: 1 1 0;
}
.row > .column.logo-wrapper {
	flex: 0 0 auto;
}
footer .row,
.class-page .row {
	justify-content: center;
}
.class-page .class-schedule .row > .column {
	align-items: center;
	justify-content: center;
}
.column.right {
	float: right;
}
.column.right img {
	margin-top: 1.5rem;
	margin-block-start: 1.5rem;
}
nav .column {
	width: 30%;
	min-width: 120px;
}
.column img,
.photo-frame img {
	max-width: 100%;
    height: auto;
	width: auto;
}
.column.photo-frame img {
	margin-top: auto;
	margin-bottom: auto;
	margin-block: auto;
}
.photo-frame.center img {
	display: block;
	margin-right: auto;
	margin-left: auto;
	margin-inline: auto;
}

.location-wrapper {
	align-items: center;
	display: flex;
	flex-flow: column wrap;
	gap: 2rem;
	justify-content: center;
}
.location-wrapper .column {
	display: flex;
}

.flex {
	display: flex;
	flex-flow: row nowrap;
	gap: 2rem;
}
.flex .img-wrapper.one-third {
	flex: 0 0 30%;
}
.flex .img-wrapper.one-fourth {
	flex: 0 0 25%;
}
.flex .img-wrapper > img {
	max-width: 100%;
	height: auto;
	width: auto;
}

.title-wrapper,
main header,
.callout,
.classes-page .class-schedule,
.class-schedule:last-of-type,
.section-image-wrapper,
.vimeo-spacer {
	margin-bottom: 4rem;
	margin-block-end: 4rem;
}
main section.callout .title-wrapper {
	margin-bottom: 2.5rem;
	margin-block-end: 2.5rem;
}
.class-schedule-page .session-dates {
	margin-bottom: 1rem;
	margin-block-end: 1rem;
}
main > .wrapper > :last-child {
	margin-bottom: 0;
	margin-block-end: 0rem;
}
.section-image-wrapper {
    align-items: center;
    flex-direction: column;
    flex-wrap: wrap;
	justify-content: center;
	margin-top: 5rem;
    margin-block-start: 5rem;
}

.location {
	margin-top: 1.5rem;
	margin-block-start: 1.5rem;
	padding-left: 2.25rem;
	padding-inline-start: 2.25rem;
	width: 17.5rem;
}
.annual-calendar {
	padding: 1.5rem 2.25rem 1.25rem;
	max-width: 620px;
	margin-left: auto;
	margin-right: auto;
	margin-inline: auto;
}
.title-wrapper .location,
header .location {
	padding-left: 1.125rem;
	padding-inline-start: 1.125rem;
}
.reg-info .title-wrapper {
	padding-top: 1rem;
	padding-bottom: 1rem;
	padding-block: 1rem;
}
.reg-info .title-wrapper h2 {
	margin-bottom: 0;
	margin-block-end: 0rem;
}

img,
iframe,
object,
ul,ol,li {
	max-width: 100%;
}
.lead-image,
img.center,
iframe.center,
object.center {
	margin-right: auto;
	margin-left: auto;
	margin-inline: auto;
}

.weekday {
	margin-top: 1rem;
	margin-block-start: 1rem;
}
.dates+.weekday {
	margin-top: 1rem;
	margin-block-start: 1rem;
}
.class-schedule h4 {
	margin-bottom: 0.375rem;
	margin-block-end: 0.375rem;
}
.class-info {
	margin-bottom: 2.25rem;
	margin-block-end: 2.25rem;
}
.class-page .class-info {
	margin-bottom: 0.25rem;
    margin-block-end: 0.25rem;
}
.callout,
.callout > .inner-wrapper {
	padding-top: .75rem;
	padding-bottom: .75rem;
	padding-block: .75rem;
}
.callout > .inner-wrapper {
	padding-right: 2.5rem;
	padding-left: 2.5rem;
	padding-inline: 2.5rem;
}
.callout > .inner-wrapper > p:last-child {
	margin-bottom: 0;
	margin-block-end: 0;
}

/* Buttons 
---------------------------------------------------------- */
button,
.burger-wrapper {
	position: relative;
}
button {
	padding: 13px 20px;
	outline: 0;
	border: 1px solid var(--lilac);
	cursor: pointer;
	background-color: rgba(0, 0, 0, 0);
	user-select: none;
	-webkit-user-select: none;
	touch-action: manipulation;
}
.button:after {
	content: "";
	background-color: var(--pink);
	width: 100%;
	z-index: -1;
	position: absolute;
	height: 100%;
	top: 7px;
	left: 7px;
	transition: 0.2s;
}
.button:hover:after {
	top: 0px;
	left: 0px;
}
.callout button {
	display: block;
	margin-block-start: 0.25rem;
	margin-inline: auto;
}

.mobile-nav-toggle {
	aspect-ratio: 1;
    border-image: none;
    border-radius: 0.25rem;
    border-style: none;
	border-width: 0px;
	display: none;
    padding: 0.125rem;
	position: absolute;
	inset: 0rem 2rem 0 auto;
	width: 2rem;
	z-index: 9999;
}
.burger-wrapper {
	height: 1.5rem;
}
.brand-text,
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}
.burger-wrapper div {
	background-color: var(--lilac);
    border-radius: 1rem;
    height: 4px;
    left: 0px;
    position: absolute;
    transition: all 0.3s ease 0s;
    transform-origin: center center;
    width: 100%;
}
.burger-wrapper :nth-child(1) {
    top: 0px;
    transition: all 0.1s ease 0s;
}
.burger-wrapper :nth-child(2) {
    top: calc(50% - 2px);
    transition: all 0.2s ease 0s;
}
.burger-wrapper :nth-child(3) {
    bottom: 0px;
    transition: all 0.3s ease 0s;
}

/* Responsive
---------------------------------------------------------- */
@media (max-width: 62rem) {
	.primary-nav,
	.primary-nav-menu {
		position: fixed;
	}
	.papers-pages .primary-nav {
		position: relative;
	}
	.papers-pages .primary-nav-menu {
		position: absolute;
	}
	.primary-nav {
		margin-bottom: 0;
		margin-block-end: 0rem;
		padding-top: 1rem;
		padding-bottom: 1rem;
		padding-block: 1rem;
		width: 100%;
		z-index: 9000;
	}
	.mobile-nav-toggle {
		display: block;
	}
	.primary-nav-menu {
		background-color: var(--biceblue);
		flex-flow: column wrap;
		inset: 5rem 0rem auto auto;
	}
	.primary-nav-menu[data-visible="false"] {
		transform: translateX(300%);
	}
	.primary-nav-menu[data-visible="true"] {
		transform: translateX(0%);
	}
	.primary-nav-menu > li {
		margin-inline-end: 1.5rem;
	}
	.primary-nav-menu li a {
		padding: 1rem;
		padding-block: 1rem;
		padding-inline: 1rem;
	}
	.primary-nav,
	.primary-nav .logo-wrapper,
	footer .logo-wrapper {
		height: 3rem;
	}
	.primary-nav .logo-wrapper,
	footer .logo-wrapper,
	footer .social-wrapper {
		width: 140px;
	}
	main {
		padding-top: 8rem;
		padding-block-start: 8rem;
	}
	.papers-pages main {
		padding-top: 3rem;
		padding-block-start: 3rem;
	}
	main > .wrapper {
		max-width: 54rem;
	}
	main .full-width {
		margin-left: -2rem;
		margin-right: -2rem;
		margin-inline: -2rem;
	}
	.title-wrapper, main header,
	.callout,
	.classes-page .class-schedule,
	.class-schedule:last-of-type,
	.section-image-wrapper,
	.vimeo-spacer {
		margin-bottom: 3rem;
		margin-block-end: 3rem;
	}
	h1 { 
		margin-bottom: 0;
		margin-block-end: 0; 
	}
	h2, h3, h5 { 
		margin-bottom: 1rem;
		margin-block-end: 1rem; 
	}
	h3, h5 {
        margin-bottom: 1rem;
        margin-block-end: 1rem;
		margin-top: 2rem;
        margin-block-start: 2rem;
    }
	.weekday {
		margin-bottom: 0.75rem;
		margin-block-end: 0.75rem;
	}
	.bookmark-links-nav {
		margin-bottom: 2.75rem;
		margin-block-end: 2.75rem;
	}
	main section.callout .title-wrapper {
		margin-bottom: 2rem;
		margin-block-end: 2rem;
	}
	header h2 {
		font-size: 30px;
	}
	h4, h5, h6 {
		font-size: 28px;
	}
	.book-reviews h3,
	.book-reviews h5 {
		font-size: 26px;
	}
	p, li, blockquote {
		font-size: 24px;
	}
	header p.note,
	.class-schedule p.age-requirement,
	.meta,
	.paper-body p.meta {
		font-size: 18px;
	}
}
@media (max-width: 48rem) {
	.primary-nav-menu > li.active { 
		display: none; 
	}
	main > .wrapper {
		max-width: 40rem;
	}
	.class-schedule {
		margin-block-end: 3rem;
	}
	.classes-page .row .column {
		border-top: 1px dashed var(--pink);
	}
	.classes-page .row:first-child .column:first-child {
		border-top: none;
	}
	.section-image-wrapper {
		margin-top: 4rem;
		margin-block-start: 4rem;
	}
	.column.photo-frame img {
		margin-right: auto;
		margin-left: auto;
		margin-inline: auto;
	}
	.dance-class {
		font-size: 34px;
	}
	.footnotes a,
	.references a,
	.url {
		line-break: anywhere;
	}
}
@media (max-width: 42rem) {
	main > .wrapper {
		max-width: 33rem;
	}
	h1 { font-size: 48px; }
	h2 { font-size: 38px; }
	h3 { font-size: 32px; }
}
@media (max-width: 38rem) {
	main > .wrapper {
		max-width: 30rem;
	}
	.callout,
	.callout > .inner-wrapper {
		padding-top: 1rem;
		padding-bottom: 1rem;
		padding-block: 1rem;
	}
	.location {
		margin-top: 0;
		margin-block-start: 0rem;
		margin-bottom: 0;
        margin-block-end: 0rem;
        max-width: 10.75rem;
		padding-top: 0.3125rem;
		padding-bottom: 0.3125rem;
		padding-block: 0.3125rem;
	}
	.section-image-wrapper {
		margin-top: 3rem;
		margin-block-start: 3rem;
	}
	.title-wrapper, main header,
	.home-page .lead-image-wrapper,
	.classes-page .class-schedule,
	.class-schedule:last-of-type,
	.section-image-wrapper,
	.vimeo-spacer {
		margin-bottom: 2rem;
		margin-block-end: 2rem;
	}
	main section.callout .title-wrapper,
	.callout {
		margin-bottom: 1.5rem;
		margin-block-end: 1.5rem;
	}
	header h2, h4, h6 {
		margin-bottom: 0;
		margin-block-end: 0rem;
	} 
	legend, input, label, textarea,
	img, iframe, object, 
	p, blockquote, table, 
	ul, ol, li,
	.other-links h5 {
		margin-bottom: 1rem;
		margin-block-end: 1rem;
	}
	legend, input, label, textarea,
	img, iframe, object {
		margin-bottom: 1rem;
		margin-block-end: 1rem;
	}
	p, blockquote, table, 
	ul, ol, li,
	.other-links h5 {
		margin-bottom: 1rem;
		margin-block-end: 1rem;
	}
	.callout button {
		margin-top: 0.125rem;
		margin-block-start: 0.125rem;
	}
	h3, h5, 
	.footnotes li,
	.annual-calendar li {
		margin-bottom: 0.5rem;
		margin-block-end: 0.5rem;
	}
	.photo-caption {
		margin-right: 2rem;
		margin-left: 2rem;
		margin-inline: 2rem;
	}
	.cityofevanston-accessibility-statement {
		margin-top: 0;
		margin-bottom: 0;
		margin-block: 0;
	}
	header p.note, 
	.cityofevanston-accessibility-statement,
	.warning, 
	.meta {
		margin-right: 0.75rem;
		margin-left: 0.75rem;
		margin-inline: 0.75rem;
	}
	header h2 {
        font-size: 26px;
    }
	.location {
		font-size: 22px;
	}
	.paper-body p,
	.paper-body blockquote,
	.annual-calendar li {
		font-size: 20px;
	}
	.cityofevanston-accessibility-statement {
		font-size: 18px;
	}
	.footnotes li,
	.photo-caption, 
	.date-line, 
	.warning p, 
	.class-schedule p.age-requirement,
	.meta, 
	.paper-body .meta, 
	.paper-body .photo-caption, 
	.paper-body .date-line {
		font-size: 16px;
	}
	.paper-body .diacritic.force-lower-case {
		font-size: 15px;
	}
	.footnotes li .diacritic.force-lower-case,
	.references li .diacritic.force-lower-case,
	.paper-body .photo-caption .diacritic.force-lower-case {
		font-size: 11px;
	}
	.indent {
		text-indent: 2rem;
	}
}
@media (max-width: 32rem) {
	main > .wrapper {
		max-width: 28rem;
	}
	h1,
	header h2 {
		margin-bottom: 0.5rem;
		margin-block-end: 0.5rem;
	}
	.location {
		margin-top: 0;
		margin-bottom: 0;
		margin-block: 0rem;
		max-width: 13.75rem;
	}
	.cityofevanston-accessibility-statement {
		max-width: 30rem;
	}
	.classes-page .weekday {
		margin-bottom: 0.75rem;
		margin-block-end: 0.75rem;
		min-height: 2.25rem;
	}
	.title-wrapper .has-subtitle {
		margin-bottom: 0.75rem;
		margin-block-end: 0.75rem;
	}
	.reg-info {
		margin-top: 4rem;
		margin-block-start: 4rem;
	}
	.class-page .reg-info {
		margin-top: 2rem;
		margin-block-start: 2rem;
	}
	section,
	.lead-image-wrapper,
	.location-wrapper,
	.photo-frame {
		margin-bottom: 2rem;
		margin-block-end: 2rem;
	}
	footer {
		margin-top: 2rem;
		margin-block-start: 2rem;
	}
	h4, h5, h6, 
	p, blockquote {
        line-height: 1.25em;
	}
	.class-page .other-links p {
		line-height: 2em;
	}
	h1 			{ font-size: 40px; }
	h2 			{ font-size: 32px; }
	header h2 	{ font-size: 24px; }
	h3 			{ font-size: 22px; }

	.weekday 		{ font-size: 42px; }
	.dance-class 	{ font-size: 28px; }

	nav li,
	footer li,
	footer nav li,
	p.time,
	.location {
		font-size: 22px;
	}
	h4, h5, h6 {
		font-size: 20px;
	}
	p, li, blockquote,
	.note,
	.class-page .class-schedule h2 {
		font-size: 18px;
	}
	header .note,
	.class-schedule .note,
	.class-schedule p.age-requirement,
	.meta,
	.paper-body .meta,
	.warning,
	.warning p {
		font-size: 16px;
	}
}
@media (max-width: 30rem) {
	main > .wrapper {
		max-width: 26rem;
	}
}
@media (max-width: 28rem) {
	main > .wrapper {
		max-width: 24rem;
	}
}
@media (max-width: 26rem) {
	main > .wrapper {
		max-width: 22rem;
	}
	h1 {
        font-size: 36px;
    }
}
@media (max-width: 24rem) {
	main > .wrapper {
		max-width: 20rem;
	}
}
@media (max-width: 22rem) {
	main > .wrapper {
		max-width: 18rem;
	}
}

@media (min-width: 45.0625rem) {
	nav,
	nav ul,
	nav li,
	footer li {
		height: fit-content;
	}
	.primary-nav .nav-menu li {
		margin-bottom: 0;
		margin-block-end: 0rem;
		margin-right: 1.25rem;
		margin-inline-end: 1.25rem;
	}
	.primary-nav.collapsed .nav-menu {
		height: 12rem;
	}
	.primary-nav.collapsed .nav-menu li {
		font-size: 20px;
		height: 4rem;
		line-height: 3rem;
		margin-bottom: 0.625rem;
		margin-right: 1rem;
		margin-block-end: 0.625rem;
		margin-inline-end: 1rem;
	}
	.primary-nav.collapsed .nav-menu li:last-child {
		margin-bottom: 0;
		margin-inline-end: 0rem;
	}
}
@media (min-width: 48rem) {
	.button {
		padding-block: 1rem;
		padding-inline: 3.25rem;
	}
	.column.text-frame > .wrapper {
		padding-right: 2rem;
		padding-left: 0.75rem;
		padding-inline: 2rem 0.75rem;
	}
	.class-schedule .column.text-frame > .wrapper {
		padding-right: 2rem;
		padding-left: 2rem;
		padding-inline: 2rem;
	}
	.class-schedule .location {
		margin-top: 8.125rem;
		margin-block-start: 8.125rem;
	}
	.location-wrapper {
		flex-direction: row;
		gap: 3rem;
	}
	.location-wrapper .location,
	.location-wrapper .photo-frame,
	.location-wrapper .photo-frame img {
		margin-bottom: 0;
		margin-block-end: 0rem;
		max-width: 25rem;
	}
	.location-wrapper .location {
		margin-top: 1.5rem;
		margin-block-start: 1.5rem;
	}
	.class-page .location-wrapper .location {
		margin-top: 3rem;
        margin-block-start: 3rem;
    }
	header p.note {
		margin-top: 2.5rem;
		margin-block-start: 2.5rem;
	}
	header p.note {
		margin-right: 5rem;
		margin-left: 5rem;
		margin-inline: 5rem;
	}
	.warning,
	.meta {
		margin-right: 3rem;
		margin-left: 3rem;
		margin-inline: 3rem;
	}
	.meta {
		margin-bottom: 1.5rem;
		margin-block-end: 1.5rem;
	}
}
@media (min-width: 52rem) {
	.row {
		flex-direction: row;
		gap: 3rem;
	}
	footer .row {
		align-items: unset;
	}
	.virtual-classes .row {
        gap: 8rem;
    }
	.class-page .class-schedule .row > .column {
		flex: 0 1 32rem;
	}
	.class-page .class-schedule,
	footer .logo-wrapper,
	footer .social-wrapper {
		margin-bottom: 2rem;
		margin-block-end: 2rem;
	}
	footer {
		margin-top: 6rem;
		padding-top: 4rem;
		padding-bottom: 1.5rem;
		margin-block-start: 6rem;
		padding-block: 4rem 1.5rem;
	}
	footer li {
		margin-block-end: inherit;
	}
	.secondary-nav,
	.references li {
		margin-bottom: 1.5rem;
		margin-block-end: 1.5rem;
	}
	.social-menu li {
		text-align: left;
	}
	.paper-body p,
	.paper-body blockquote {
		font-size: 24px;
	}
	.paper-body .diacritic.force-lower-case {
		font-size: 18px;
	}
	.footnotes li,
	.references li,
	.annual-calendar li {
		font-size: 20px;
	}
	.references li .diacritic.force-lower-case {
		font-size: 14.25px;
	}
}
@media (min-width: 62rem) {
	.primary-nav > .wrapper {
		gap: 5.75rem;
	}
	.page-wrapper {
		width: 60rem;
	}
	main > .wrapper {
		max-width: 60rem;
	}
	.warning,
	.warning p,
	.class-schedule p.age-requirement,
	.meta,
	.paper-body p.meta {
		font-size: 20px;
	}
	.photo-caption {
		margin-inline: 5rem;
	}
}
@media (min-width: 64.0625rem) {
	.page-wrapper,
	main > .wrapper {
		max-width: 62.5rem;
	}
}

/* Season Session Display Controls 
   ! move comment closures after	!
   ! pushing new season schedule	!
   ! in order to hide past season	!
---------------------------------------------------------- */
 /* In winter Jan 1 hide fall: 
.fall.session-i,
.fall.session-ii {
	display: none;
}
 */

 /* In spring Apr 1 hide winter: 
.winter.session-i,
.winter.session-ii {
	display: none;
} */

/* In summer Jun 1 hide spring: 
.spring.session-i,
.spring.session-ii {
	display: none;
} */

 /* In fall Sept 1 hide summer: 
.summer.session-i,
.summer.session-ii {
	display: none;
} */