@font-face {
  font-family: PapMar;
  src: url(Hey-Gorgeous.ttf.woff);
}


.areaHeader, .dialogueHeader, .mainHeader {
	background-image: linear-gradient(to right, #354B7F, #4564A9, #354B7F, #4564A9);
    border-top: 1px solid #5E8BDE;
    border-left: 1px solid #5E8BDE;
    border-bottom: 1px solid #1F2A46;
    border-right: 1px solid #1F2A46;
    text-shadow: 0.07em 0.07em 0.07em #5C86E2;
    color: #0E111D;
	font-weight: bold;
}
.forceDefaultFont .areaHeader, .forceDefaultFont .dialogueHeader {
	background-image: linear-gradient(to right, #4564A9, #4564A9);
    text-shadow: none;
}
.dialogueHeader {
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
}
.dialogueSubcontainer::before {
	background-color: #354B7F55;
    border: 0.2rem solid #0E111D;
}
.material-symbols-outlined {
	color: #0E111D;
}

.highlight {
	background-color: orange;
}

.speakerName {
	position: absolute;
	height: 1px;
	overflow: hidden;
	opacity: 0;
}
.characterIcon {
	position: absolute;
	height: 3rem;
	width: 3rem;
	border-radius: 1.5rem;
	bottom: 0.2rem;
	user-select: none;
}
.leftIcon {
	left: 0rem;
}
.rightIcon {
	right: 0rem;
	transform: scaleX(-1);
}

.messageBox {
	font-family: Calibri;
	display: inline-block;
	width: calc( 100% - 10rem );
	margin: 1rem;
	margin-top: 0.2rem;
	margin-bottom: 0.2rem;
	margin-left: 4rem;
	padding-left: 2rem;
	padding-top: 0.6rem;
	padding-bottom: 0.7rem;
	font-size: 1rem;
	font-weight: bold;
	text-align: left;
	letter-spacing: 0.02em;
	white-space: pre;
	border-radius: 1rem;
	color: #FEFEFE;
	text-shadow: 0.1em 0.1em black;
}
.speechBubble {
	position: relative;
	background-color: #000000AA;
}
.tattle {
	position: relative;
	background-color: #000066AA;
}
.itemDescription {
	position: relative;
	background-color: #00000000;
	padding-left: 5rem;
	width: calc( 100% - 13rem );
}
.itemDescriptionNoIcon {
	position: relative;
	background-color: #00000000;
	padding-left: 2rem;
	width: calc( 100% - 10rem );
}
.itemDescription::before, .itemDescriptionNoIcon::before {
	content: "";
	display: block;
	position: absolute;
	background-color: #000066AA;
	border-radius: 1rem;
	height: 100%;
    width: 100%;
    left: 0rem;
    top: 0rem;
	filter: blur(0.2rem);
}
.itemDescription2 {
	position: relative;
	background-color: #000000AA;
	padding-left: 5rem;
	width: calc( 100% - 13rem );
}
.itemOffset {
	position: relative;
	background-color: #000000AA;
	padding-left: 5rem;
	width: calc( 100% - 13rem );
}
.sign {
	position: relative;
	background-image: url("ui/sign.png");
	background-size: 100% 6.2rem;
	border-radius: 0;
}
.boxless {
	position: relative;
	background-color: #00000000;
}
.music {
	position: relative;
	height: 5rem;
	padding-top: 0.3rem;
	background-color: #000000AA;
	border-radius: 0.25rem;
	background-image: url("ui/musicSheet.png");
	background-position: bottom;
	background-repeat: no-repeat;
    background-size: 70%;
    background-position-y: bottom 0.5rem;
}
.overlay {
	position: relative;
	background-image: linear-gradient(to right, #00000088, #36143888, #36143888);
	padding-left: 5rem;
	padding-top: 1rem;
	padding-bottom: 1.8rem;
	width: calc(100% - 11rem);
	margin-left: 3rem;
	border-radius: 0;
}
.black {
	background-color: #000000;
	border-radius: 0;
}
.white {
	background-color: #ffffff;
	color: #000000;
	border-radius: 0;
	text-shadow: none;
}
.note {
	background-color: #E5E2B3;
	background-image: url("ui/notebook.png");
	padding-top: 1rem;
	padding-bottom: 1rem;
	padding-left: 5rem;
	width: calc( 100% - 13rem );
	border-radius: 0;
	color: #000000;
	text-shadow: none;
	clip-path: polygon(
		0.2rem 0.1rem,
		2% 0.1rem,
		2% 0rem,
		10% 0rem,
		11% 0.2rem,
		12% 0rem,
		16% 0rem,
		16% 0.2rem,
		18% 0.2rem,
		18% 0.1rem,
		21% 0.1rem,
		21% 0.2rem,
		22.2% 0.2rem,
		22.8% 0.1rem,
		26% 0.1rem,
		27% 0.14rem,
		27% 0rem,
		31% 0rem,
		31% 0.1rem,
		32% 0.1rem,
		32% 0rem,
		35% 0rem,
		35% 0.1rem,
		36% 0.1rem,
		36% 0rem,
		41% 0rem,
		41% 0.1rem,
		43% 0.1rem,
		43% 0rem,
		44% 0rem,
		45% 0.2rem,
		46% 0rem,
		49% 0rem,
		50% 0.2rem,
		51% 0.2rem,
		52% 0rem,
		55% 0rem,
		56% 0.17rem,
		57% 0rem,
		57.5% 0.1rem,
		59% 0.1rem,
		57% 0rem,
		64% 0rem,
		64% 0.1rem,
		65% 0.1rem,
		65% 0rem,
		68% 0rem,
		68% 0.1rem,
		69% 0.1rem,
		69% 0rem,
		73% 0rem,
		73% 0.14rem,
		74% 0.1rem,
		77.2% 0.1rem,
		77.8% 0.2rem,
		79% 0.2rem,
		79% 0.1rem,
		82% 0.1rem,
		82% 0.2rem,
		84% 0.2rem,
		84% 0rem,
		88% 0rem,
		89% 0.2rem,
		90% 0rem,
		98% 0rem,
		98% 0.1rem,
		calc( 100% - 0.2rem ) 0.1rem,
		100% 3%,
		100% 4%,
		calc( 100% - 0.2rem ) 10%,
		100% 10%,
		100% 11%,
		calc( 100% - 0.1rem ) 11%,
		100% 13%,
		100% 30%,
		calc( 100% - 0.2rem ) 32%,
		calc( 100% - 0.1rem ) 33.5%,
		calc( 100% - 0.2rem ) 35%,
		calc( 100% - 0.1rem ) 36%,
		calc( 100% - 0.1rem ) 45%,
		100% 45%,
		100% 55%,
		calc( 100% - 0.2rem ) 55%,
		calc( 100% - 0.1rem ) 56%,
		calc( 100% - 0.1rem ) 58%,
		calc( 100% - 0.2rem ) 58%,
		100% 61%,
		100% 64%,
		calc( 100% - 0.2rem ) 63%,
		calc( 100% - 0.1rem ) 65%,
		calc( 100% - 0.1rem ) 75%,
		calc( 100% - 0.2rem ) 75%,
		100% 78%,
		100% 90%,
		calc( 100% - 0.2rem ) 94%,
		calc( 100% - 0.2rem ) 96%,
		calc( 100% - 0.1rem ) 97%,
		100% 95%,
		100% 97%,
		calc( 100% - 0.3rem ) 100%,
		94% 100%,
		92% calc( 100% - 0.2rem ),
		92% 100%,
		85% 100%,
		84% calc( 100% - 0.1rem ),
		82% calc( 100% - 0.1rem ),
		81% 100%,
		76% 100%,
		73% calc( 100% - 0.1rem ),
		74% calc( 100% - 0.2rem ),
		71% calc( 100% - 0.2rem ),
		71% calc( 100% - 0.1rem ),
		69% 100%,
		66% 100%,
		65% calc( 100% - 0.1rem ),
		64% calc( 100% - 0.1rem ),
		63% 100%,
		62% 100%,
		61% calc( 100% - 0.1rem ),
		60% calc( 100% - 0.1rem ),
		59% 100%,
		57% 100%,
		57% calc( 100% - 0.2rem ),
		55% 100%,
		50% calc( 100% - 0.02rem ),
		50% 100%,
		37% calc( 100% - 0.1rem ),
		36% calc( 100% - 0.25rem ),
		35% 100%,
		32% 100%,
		31% calc( 100% - 0.02rem ),
		29% calc( 100% - 0.02rem ),
		25% 100%,
		23% calc( 100% - 0.03rem ),
		20% 100%,
		17% 100%,
		15% calc( 100% - 0.2rem ),
		15% 100%,
		13% 100%,
		13% calc( 100% - 0.1rem ),
		11% calc( 100% - 0.1rem ),
		11% 100%,
		9% calc( 100% - 0.1rem ),
		5% calc( 100% - 0.1rem ),
		5% calc( 100% - 0.2rem ),
		2% 100%,
		0.3rem 100%,
		0% 97%,
		0% 95%,
		0.1rem 97%,
		0.2rem 96%,
		0.2rem 94%,
		0% 90%,
		0% 78%,
		0.2rem 75%,
		0.1rem 75%,
		0.1rem 65%,
		0.2rem 63%,
		0% 64%,
		0% 61%,
		0.2rem 58%,
		0.1rem 58%,
		0.1rem 56%,
		0.2rem 55%,
		0% 55%,
		0% 45%,
		0.1rem 45%,
		0.1rem 36%,
		0.2rem 35%,
		0.1rem 33.5%,
		0.2rem 32%,
		0% 30%,
		0% 13%,
		0.1rem 11%,
		0% 11%,
		0% 10%,
		0.2rem 10%,
		0% 4%,
		0% 3%
	);
}
.forceDefaultFont .note {
	background-image: none;
}
.notebook {
	padding-left: 5rem;
	width: calc( 100% - 13rem );
	background-color: #ffffff;
	color: #000000;
	text-shadow: none;
}

.sheet {
	position: absolute;
	left: 3.5rem;
	top: 2rem;
}
.A {
	display: inline-block;
	height: 3.3rem;
	width: 1.2rem;
	background-image: url("ui/noteA.png");
	background-repeat: no-repeat;
    background-size: 100%;
    background-position-y: bottom;
	margin-left: 0.5rem;
	padding-top: 0.16rem;
}
.CD {
	display: inline-block;
	height: 3.3rem;
	width: 1.2rem;
	background-image: url("ui/noteCD.png");
	background-repeat: no-repeat;
    background-size: 100%;
    background-position-y: bottom 0.475rem;
	margin-left: 0.5rem;
	padding-top: 0.16rem;
}
.CR {
	display: inline-block;
	height: 3.3rem;
	width: 1.2rem;
	background-image: url("ui/noteCR.png");
	background-repeat: no-repeat;
    background-size: 100%;
    background-position-y: bottom 0.95rem;
	margin-left: 0.5rem;
	padding-top: 0.16rem;
}
.CL {
	display: inline-block;
	height: 3.3rem;
	width: 1.2rem;
	background-image: url("ui/noteCL.png");
	background-repeat: no-repeat;
    background-size: 100%;
    background-position-y: bottom 1.425rem;
	margin-left: 0.5rem;
	padding-top: 0.16rem;
}
.CU {
	display: inline-block;
	height: 3.3rem;
	width: 1.2rem;
	background-image: url("ui/noteCU.png");
	background-repeat: no-repeat;
    background-size: 100%;
    background-position-y: bottom 1.9rem;
	margin-left: 0.5rem;
	padding-top: 0.16rem;
}

.meta {
	font-family: sans-serif;
	font-size: 1em;
	font-weight: normal;
	text-shadow: none;
}
.COLOR_RED {
	color: #ED3C3C;
}
.sign .COLOR_RED {
	color: #FC7700;
}
.note .COLOR_RED {
	color: #C50907;
}
.COLOR_YELLOW {
	color: #FFFF32;
}
.COLOR_BLUE {
	color: #4A54EB;
}
.notebook .COLOR_BLUE {
	color: #515BFF;
}
.COLOR_LIGHTBLUE {
	color: #4C8DEF;
}
.COLOR_SILVER {
	color: #A2A2A2;
}
.COLOR_PINK {
	color: #FF96B4;
}
.COLOR_GREEN {
	color: #46FF50;
}
.notebook .COLOR_GREEN {
	color: #70ACFF;
}

.TWO_CHOICE, .THREE_CHOICE {
	display: block;
	padding-left: 1em;
}

.itemIcon {
	position: absolute;
	left: -4rem;
	width: 3rem;
	top: 50%;
	transform: translateY(-50%)
}

.smaller {
	font-size: 0.7em;
	font-weight: bold;
}
.bigger {
	font-family: sans-serif;
	font-size: 1.5em;
	font-weight: bold;
    display: inline-block;
}
.meta .bigger {
	font-size: 1em;
	font-weight: bold;
}
.alignmentFix {
	display: block;
    position: relative;
    bottom: 1rem;
}
.meta .alignmentFix {
	display: block;
    position: relative;
    bottom: 0px;
}
.wider {
	margin-left: 0rem;
	margin-right: 0rem;
	padding-left: 0.5rem;
	width: calc( 100% - 0.5rem );
}

.gameIcon {
	height: 0.9em;
    vertical-align: bottom;
}
.leftAlignedPic {
	position: absolute;
	left: 1rem;
	top: 50%;
	translateY: -50%;
	height: 5rem;
}

::selection {
  color: white;
  background: #0665D4;
}