/*! modern-normalize v2.0.0 | MIT License | https://github.com/sindresorhus/modern-normalize */

/* ========================================
   RESET & BASE STYLES
======================================== */
*,
::before,
::after {
	box-sizing: border-box
}

html {
	font-family: "V-O-I-L-A-Regular", "zhongwen", system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
	-moz-tab-size: 4;
	tab-size: 4
}

body {
	margin: 0
}

/* ========================================
   FONT DEFINITIONS
======================================== */
@font-face {
	font-family: "zhongwen";
	src:  url("fonts/江城圆体 300W.woff2") format("woff2");;
	font-weight: normal;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: bc-sans;
	src: url("fonts/BCSans-Regular.woff2") format("woff2"), url("fonts/BCSans-Regular.woff") format("woff");
	font-weight: normal;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: kaerukaeru-Regular;
	src: url("fonts/kaerukaeru-Regular.woff2") format("woff2"), url("fonts/kaerukaeru-Regular.woff") format("woff");
	font-weight: normal;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: AaBanShuZhiShi-2;
	src: url("fonts/AaBanShuZhiShi-2.woff2") format("woff2"), url("fonts/AaBanShuZhiShi-2.woff") format("woff");
	font-weight: normal;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: jgs5;
	src: url("fonts/jgs5.woff2") format("woff2"), url("fonts/jgs5.woff") format("woff");
	font-weight: normal;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: hershey-futural;
	src: url("fonts/Hershey-Futural--15.woff2") format("woff2"), url("fonts/Hershey-Futural--15.woff") format("woff");
	font-weight: 300;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: hershey-futural;
	src: url("fonts/Hershey-Futural-0.woff2") format("woff2"), url("fonts/Hershey-Futural-0.woff") format("woff");
	font-weight: normal;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: hershey-futural;
	src: url("fonts/Hershey-Futural-30.woff") format("woff"), url("fonts/Hershey-Futural-30.woff2") format("woff2");
	font-weight: 500;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: hershey-futural;
	src:  url("fonts/Hershey-Futural-40.woff") format("woff"),url("fonts/Hershey-Futural-40.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap
}

@font-face {
    font-family: 'V-O-I-L-A-Regular';
    src: url('fonts/V-O-I-L-A-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* ========================================
   CSS VARIABLES
======================================== */
:root {
	--font-family-display: "hershey-futural", "V-O-I-L-A-Regular", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	--font-family-display-mono: "jgs5", SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
	--font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	--font-bc-sans: "bc-sans", ui-sans-serif, system-ui, sans-serif;
    --font-menu: "kaerukaeru-Regular","AaBanShuZhiShi-2";
	--font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
	--white: #fff;
	--black: #000;
	--beige: rgba(235, 90, 60, 0.2);
	--grey: #666;
	--accent: #ff4433
}

/* ========================================
   COLOR UTILITIES
======================================== */
.text-accent {
	color: var(--accent)
}

.text-white {
	color: var(--white)
}

.bg-accent {
	background-color: var(--accent)
}

.bg-white {
	background-color: var(--white)
}

.bg-black {
	background-color: var(--black)
}

.bg-beige {
	background-color: var(--beige)
}

.bg-grey {
	background-color: var(--grey)
}

.active\:bg-accent:active {
	background-color: var(--accent)
}

.active\:text-white:active {
	color: var(--white)
}

/* ========================================
   TYPOGRAPHY & TEXT STYLES
======================================== */
h2,
h3 {
	margin-top: 1.5em;
	margin-bottom: 0em
}

p,
ul {
	line-height: 1.625
}

p {
	font-size: 1rem
}

small {
	font-size: 80%
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline
}

sub {
	bottom: -0.25em
}

sup {
	top: -0.5em
}

code,
kbd,
samp,
pre {
	font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
	font-size: 1em
}

abbr[title] {
	text-decoration: underline dotted
}

b,
strong {
	font-weight: bolder
}

/* Font Family Utilities */
.font-display {
	font-family: var(--font-family-display)
}

.font-display-mono {
	font-family: var(--font-family-display-mono)
}

.font-mono {
	font-family: var(--font-family-mono)
}

.font-menu {
	font-family: var(--font-menu)
}

.font-bc-sans {
	font-family: var(--font-bc-sans)
}

.font-sans {
	font-family: var(--font-family)
}

/* Text Size & Weight Utilities */
.text-10 {
	font-size: 0.6rem
}

.text-base {
	font-size: 1rem
}

.text-sm {
	font-size: .875rem;
	line-height: 1.25rem
}

.text-xs {
	font-size: .75rem
}

.text-2xl {
	font-size: 1.5rem;
	line-height: 2rem
}

.text-4xl {
	font-size: 2.25rem;
	line-height: 2.5rem
}

.font-light {
	font-weight: 300
}

.font-normal {
	font-weight: 400
}

.font-medium {
	font-weight: 500
}

.font-semibold {
	font-weight: 600
}

/* Text Alignment & Decoration */
.text-center {
	text-align: center
}

.text-left {
	text-align: left
}

.no-underline {
	text-decoration-line: none
}

.uppercase {
	text-transform: uppercase
}

.not-italic {
	font-style: normal
}

.tracking-wide {
	letter-spacing: .025em
}

/* Line Height & Text Behavior */
.leading-normal {
	line-height: 1.5
}

.leading-relaxed {
	line-height: 1.625
}

.antialiased {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale
}

.aliased {
	-webkit-font-smoothing: none
}

.break-all {
	word-break: break-all
}

.whitespace-nowrap {
	white-space: nowrap
}

.list-none {
	list-style-type: none
}

/* ========================================
   LAYOUT & POSITIONING
======================================== */
.relative {
	position: relative
}

.sticky {
	position: sticky
}

.top-0 {
	top: 0
}

.overflow-hidden {
	overflow: hidden
}

.overflow-scroll {
	overflow: scroll
}

/* Display Properties */
.none {
	display: none
}

.inline {
	display: inline
}

.flex {
	display: flex
}

.inline-flex {
	display: inline-flex
}

/* Flexbox Properties */
.flex-wrap {
	flex-wrap: wrap
}

.flex-grow {
	flex-grow: 1
}

.flex-direction-column {
	flex-direction: column
}

.flex-align-baseline {
	align-items: baseline
}

.flex-align-center {
	align-items: center
}

.flex-align-end {
	align-items: flex-end
}

.flex-align-content-end {
	align-content: flex-end
}

.flex-justify-center {
	justify-content: center
}

.flex-justify-space-between {
	justify-content: space-between
}

/* Width & Sizing */
.w-100 {
	width: 100%
}

.w-50 {
	width: calc(50% - .5em);
	max-width: 50rem
}

.w-33 {
	width: calc(33.3333333% - .5em)
}

.max-w-prose {
	max-width: 75ch
}

@media(max-width: 45rem) {
	.w-50 {
		width: 100%
	}
	
	.w-33 {
		width: 100%
	}
}

/* ========================================
   SPACING UTILITIES
======================================== */
/* Padding */
.p-0 {
	padding: 0
}

.p-1 {
	padding: .25rem
}

.p-2 {
	padding: 1rem
}

.pl-0 {
	padding-left: 0
}

.pl-1 {
	padding-left: 1rem
}

.pt-2 {
	padding-top: .5rem
}

.pt-4 {
	padding-top: 1rem
}

.px-2 {
	padding-left: 1rem;
	padding-right: 1rem
}

/* Margin */
.m-0 {
	margin: 0
}

.m-1 {
	margin: 1em
}

.mb-0 {
	margin-bottom: 0
}

.mb-025 {
	margin-bottom: .25em
}

.mb-05 {
	margin-bottom: .5em
}

.mb-1 {
	margin-bottom: 1em
}

.mb-2 {
	margin-bottom: 2em
}

.mt-0 {
	margin-top: 0
}

.mt-1 {
	margin-top: 1em
}

.mt-2 {
	margin-top: 2em
}

.mx-auto {
	margin-left: auto;
	margin-right: auto
}

.gap-4 {
	gap: 1rem
}

/* ========================================
   CONTAINER & LAYOUT COMPONENTS
======================================== */
.container {
	padding: 0 1.25rem
}

.screen {
	display: inline-block;
	width: 38ch;
	min-height: 2rem;
	overflow: hidden;
	margin-bottom: -4px
}

/* ========================================
   BORDERS & OUTLINES
======================================== */
.rounded {
	border-radius: .25rem
}

.border {
	border-style: solid;
	border-width: 2px
}

.border-0 {
	border-width: 0px
}

.outlined:hover,
.outlined:focus {
	outline: 1px solid var(--black);
	outline-offset: .2rem
}

.outlined:active {
	outline-width: 2px
}

.active\:outline-accent:active {
	outline-color: var(--accent)
}

/* ========================================
   TABLE STYLES
======================================== */
table {
	text-indent: 0;
	border-color: inherit;
	border-collapse: collapse;
	line-height: 1.625
}

table tr {
	border: 1px dashed;
	border-left: 0;
	border-right: 0;
	border-bottom-color: var(--black)
}

table td,
table th {
	padding: .5em;
	vertical-align: top
}

.register-table th:first-child {
	min-width: 120px
}

.register-table th:nth-child(2) {
	min-width: 75px
}

.register-table tr td:nth-child(3) {
	font-size: .875rem;
	line-height: 1.25rem
}

.schedule-table th:first-child {
	width: 1%;
	white-space: nowrap;
	border-right: 1px dashed var(--black)
}

.schedule-table .time-cell:first-child {
	border-right: 1px dashed var(--black)
}

.schedule-table tr:not(.sticky):hover .time-cell:first-child {
	color: var(--accent)
}

/* ========================================
   FORM ELEMENTS & BUTTONS
======================================== */
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0
}

button,
select {
	text-transform: none
}

button,
[type=button],
[type=reset],
[type=submit] {
	-webkit-appearance: button
}

[type=search] {
	-webkit-appearance: textfield;
	outline-offset: -2px
}

::-moz-focus-inner {
	border-style: none;
	padding: 0
}

:-moz-focusring {
	outline: 1px dotted ButtonText
}

:-moz-ui-invalid {
	box-shadow: none
}

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
	height: auto
}

::-webkit-search-decoration {
	-webkit-appearance: none
}

::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit
}

input[type=checkbox].menu-btn:checked~.nav {
	display: block
}

input[type=checkbox].menu-btn:checked~.menu-icon {
	background-color: var(--accent);
	outline-color: var(--accent)
}

/* ========================================
   NAVIGATION & HEADER
======================================== */
.header>.container {
	padding: 1em 30px
}

.header .nav-item {
	display: inline-flex
}

.header .nav-item.active {
	color: var(--black)
}

.header .menu {
	padding: 0;
    font-family: var(--font-menu)
}

.header .menu li {
	position: relative;
	margin-right: 1px;
    font-family: var(--font-menu)
}

.menu-icon {
	padding: .5em 1em .5em 1em;
	cursor: pointer;
	align-items: flex-end
}

.logo {
	display: inline-flex;
	margin-right: 30px;
	vertical-align: middle
}

.logo svg {
	width: 50px;
	height: 100%
}

.nav-item-sub {
	padding: 0;
	list-style: none
}

@media(max-width: 45rem) {
	.header>.container {
		padding: 1em 0
	}
	
	.header .nav-item {
		aspect-ratio: unset
	}
	
	.header .menu li {
		width: 100%
	}

	.header .menu li[aria-haspopup=true] {
		margin: 1px 0
	}

	.header .menu li[aria-haspopup=true]:first-child {
		margin-top: 0;
		margin-bottom: 0
	}
	
	.header .menu {
		flex-wrap: wrap
	}
	
	.nav {
		padding: 0 20px;
		display: none
	}

	.nav pre {
		line-height: 2rem
	}
	
	.menu-icon {
		display: inline-flex
	}
	
	.logo {
		margin-left: 20px
	}
	
	.header li:hover .nav-item-sub:empty {
		display: none
	}

	.nav-item-sub {
		display: block;
		position: inherit;
		width: 100%;
		float: none;
		margin-bottom: 0
	}
	
	#register-button {
		position: absolute;
		text-align: center;
		right: 0;
		left: 0;
		bottom: 0;
		background-color: var(--beige)
	}
}

/* ========================================
   LINKS & INTERACTIVE ELEMENTS
======================================== */
a {
	color: inherit;
	text-underline-offset: .2rem
}

a:active {
	color: var(--accent)
}

.hover-ornament:after {
	font-family: var(--font-family-display-mono);
	display: inline-flex;
	line-height: 0;
	margin-left: 1ch
}

.hover-ornament:hover::after {
	content: "☼"
}

.hover-ornament.active::after {
	content: "*"
}

/* ========================================
   MEDIA ELEMENTS
======================================== */
img {
	max-width: 100%;
	height: auto
}

.video-thumbnail .video-overlay {
	position: absolute;
	width: 100%;
	height: 100%;
	justify-content: center;
	align-items: center;
	opacity: .75
}

.video-thumbnail .video-play-graphic {
	width: 48px
}

.video-thumbnail:hover .video-overlay {
	opacity: 0
}

.video-links-container {
	border-top: 1px solid var(--black);
	padding-top: 1em
}

.video-links-item {
	line-height: 1rem;
	margin-bottom: .65em;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

/* ========================================
   MISCELLANEOUS ELEMENTS
======================================== */
hr {
	height: 0;
	color: inherit;
	border: 0;
	background-color: var(--black);
	height: 1px
}

blockquote {
	padding-left: 1em;
	margin: 2em 0;
	border-left: 1px dashed var(--black)
}

legend {
	padding: 0
}

progress {
	vertical-align: baseline
}

summary {
	display: list-item
}

.highlight:has(*:target) .highlight-name:before {
	margin-right: 1ch;
	margin-left: -2ch;
	content: "*";
	color: var(--accent);
	font-family: var(--font-family-display-mono)
}

/*# sourceMappingURL=main.css.map */