@font-face
	font-family: 'KaushanScript-Regular'
	font-style: normal
	font-weight: 400
	src: url('/fonts/KaushanScript-Regular.ttf') format('truetype')

.nav-separator
	height: 0.2rem
	width: 40%
	margin-left: 30%
	background-color: white

nav
	font-size: 1.4rem

nav a
	display: inline-block
	color: #AF8A62
	text-decoration: none

nav a:hover
	color: #F9F1E1
	text-decoration: underline
nav a:active
	color: #F9F1E1
	text-decoration: none

nav a + a
	margin-left: 2rem
	
.pageHeaderContainer
	background-image: url("/images/header.svg")
	background-origin: border-box
	background-size: cover
	background-position: center
	
.pageHeader
	//background: #2c031c
	color: white
	/*background-image: linear-gradient(to bottom, #d0edf5, #e1e5f0 100%)*/
	padding: 20px 15px 15px 15px
	position: relative
	
.pageNavContainer
	background: #28211A
	
.pageContentContainer
	margin: 0 auto
	width: 85%
	padding-top: 2rem

.title
	margin-bottom: 0
	color: white
	font-family: "KaushanScript-Regular", sans-serif
	font-size: 4rem
	text-shadow: 0 0 .5rem black
	display: inline-block
	
.k12
	font-family: "KaushanScript-Regular", sans-serif
	font-size: 1.5rem
	text-shadow: 0 0 .4rem black
	padding: 0 .4rem 0 .2rem
	position: relative
	top: -1rem
	color: white
	transform: rotate(-12deg)
	border: .2rem solid white
	box-shadow: 0 0 .2rem black
	border-radius: .5rem
	display: inline-block

.logo
	position: absolute
	left: 0
	top: 0
	width: 8rem

.logoContainer
	height: 0
	position: relative

.login
	position: absolute
	right: 0
	top: 0

.login button
	background: #28211A
	border-radius: 999px
	box-shadow: 0.2rem .3rem .4rem .1rem #886f59
	//box-shadow: #886f59 0 1px 2px -1px
	box-sizing: border-box
	color: #FFFFFF
	cursor: pointer
	font-family: Inter, Helvetica, "Apple Color Emoji", "Segoe UI Emoji", NotoColorEmoji, "Noto Color Emoji", "Segoe UI Symbol", "Android Emoji", EmojiSymbols, -apple-system, system-ui, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", sans-serif
	font-weight: 700
	line-height: 24px
	opacity: 1
	outline: 0 solid transparent
	padding: 8px 18px
	user-select: none
	-webkit-user-select: none
	touch-action: manipulation
	width: fit-content
	word-break: break-word
	border: 0

@media (max-width: 600px)
	.logo
		position: absolute
		left: 0
		right: 0
		top: 0
		margin: 0 auto
		width: 8rem

	.logoContainer
		height: 6rem
    
