body {
	background-color: #000;
}


.dialogue_topleft_raiders_ext {
	position: absolute;	
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
	padding: 1.3%;
	border-radius: 0em .75em .75em .75em;
	border-color: rgba(92, 43, 64, 0.7);
	border-width: 2px;
	border-style: solid;
	color: #df6570;
	background: rgba(0, 0, 0, 0.8);
}

.dialogue_topright_raiders_ext {
	position: absolute;	
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
	padding: 1.3%;
	border-radius: .75em 0em .75em .75em;
	border-color: rgba(92, 43, 64, 0.7);
	border-width: 2px;
	border-style: solid;
	color: #df6570;
	background: rgba(0, 0, 0, 0.8);
}

.dialogue_bottomright_raiders_ext {
	position: absolute;	
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
	padding: 1.3%;
	border-radius: .75em .75em 0em .75em;
	border-color: rgba(92, 43, 64, 0.7);
	border-width: 2px;
	border-style: solid;
	color: #df6570;
	background: rgba(0, 0, 0, 0.8);
}

.dialogue_bottomleft_raiders_ext {
	position: absolute;	
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
	padding: 1.3%;
	border-radius: .75em .75em .75em 0em;
	border-color: rgba(92, 43, 64, 0.7);
	border-width: 2px;
	border-style: solid;
	color: #df6570;
	background: rgba(0, 0, 0, 0.8);
}

.dialogue_offscreen_raiders_ext {
	position: absolute;	
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
	padding: 1.3%;
	border-radius: .75em .75em .75em .75em;
	border-color: rgba(92, 43, 64, 0.7);
	border-width: 2px;
	border-style: solid;
	color: #df6570;
	background: rgba(0, 0, 0, 0.8);
}

.dialogue_topleft_raiders {
	position: absolute;	
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
	padding: 1.3%;
	border-radius: 0em .75em .75em .75em;
	border-color: rgba(112, 39, 25, 0.7);
	border-width: 2px;
	border-style: solid;
	color: #e87548;
	background: rgba(0, 0, 0, 0.8);
}

.dialogue_topright_raiders {
	position: absolute;	
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
	padding: 1.3%;
	border-radius: .75em 0em .75em .75em;
	border-color: rgba(112, 39, 25, 0.7);
	border-width: 2px;
	border-style: solid;
	color: #e87548;
	background: rgba(0, 0, 0, 0.8);
}

.dialogue_bottomright_raiders {
	position: absolute;	
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
	padding: 1.3%;
	border-radius: .75em .75em 0em .75em;
	border-color: rgba(112, 39, 25, 0.7);
	border-width: 2px;
	border-style: solid;
	color: #e87548;
	background: rgba(0, 0, 0, 0.8);
}

.dialogue_bottomleft_raiders {
	position: absolute;	
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
	padding: 1.3%;
	border-radius: .75em .75em .75em 0em;
	border-color: rgba(112, 39, 25, 0.7);
	border-width: 2px;
	border-style: solid;
	color: #e87548;
	background: rgba(0, 0, 0, 0.8);
}

.dialogue_offscreen_raiders {
	position: absolute;	
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
	padding: 1.3%;
	border-radius: .75em .75em .75em .75em;
	border-color: rgba(112, 39, 25, 0.7);
	border-width: 2px;
	border-style: solid;
	color: #e87548;
	background: rgba(0, 0, 0, 0.8);
}

.dialogue_topleft {
	position: absolute;	
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
	padding: 1.3%;
	border-radius: 0em .75em .75em .75em;
	border-color: rgba(119, 69, 11, 0.7);
	border-width: 2px;
	border-style: solid;
	color: #c1963a;
	background: rgba(0, 0, 0, 0.8);
}

.dialogue_topright {
	position: absolute;	
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
	padding: 1.3%;
	border-radius: .75em 0em .75em .75em;
	border-color: rgba(119, 69, 11, 0.7);
	border-width: 2px;
	border-style: solid;
	color: #c1963a;
	background: rgba(0, 0, 0, 0.8);
}

.dialogue_bottomright {
	position: absolute;	
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
	padding: 1.3%;
	border-radius: .75em .75em 0em .75em;
	border-color: rgba(119, 69, 11, 0.7);
	border-width: 2px;
	border-style: solid;
	color: #c1963a;
	background: rgba(0, 0, 0, 0.8);
}

.dialogue_bottomleft {
	position: absolute;	
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
	padding: 1.3%;
	border-radius: .75em .75em .75em 0em;
	border-color: rgba(119, 69, 11, 0.7);
	border-width: 2px;
	border-style: solid;
	color: #c1963a;
	background: rgba(0, 0, 0, 0.8);
}

.dialogue_offscreen {
	position: absolute;	
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
	padding: 1.3%;
	border-radius: .75em .75em .75em .75em;
	border-color: rgba(119, 69, 11, 0.7);
	border-width: 2px;
	border-style: solid;
	color: #c1963a;
	background: rgba(0, 0, 0, 0.8);
}





	.nar_exterior {
		color: rgba(217, 180, 236, 0.7);
		background: rgba(0, 0, 0, 0.4);
	}

	.nar_interior {
		color: rgba(150, 201, 193, 0.7);
		background: rgba(0, 0, 0, 0.4);
	}





	/* Tutorial */
	@media only screen and (min-width: 1100px) {	/* pc */
		.tutorialMajor {
			text-align: center;
			font-size: 22pt;
			color: #c9a76c;
		}
		.tutorialMinor {
			text-align: center;
			font-size: 16pt;
			color: #8d6c3c;
		}
	}
	
	@media only screen and (max-width: 1099px) {	/* mobile */
	
		.tutorialMajor {
			text-align: center;
			font-size: 3.8vw;
			color: #c9a76c;
		}
		.tutorialMinor {
			text-align: center;
			font-size: 2.8vw;
			line-height: -10vw;
			color: #8d6c3c;
		}
	}
	
	/* TUTORIAL */ 
		#tutorial1_t1 {
			position: absolute;
			width: 100%;
			top: 15%;
		}
		#tutorial2_t1 {
			position: absolute;
			width: 100%;
			top: 6%;
		}
		#tutorial3_t1 {
			position: absolute;
			width: 100%;
			bottom: 60%;
		}
		
	/* Appeal */
		#appeal_t1 {
			position: absolute;	
			-webkit-transition: opacity 1.5s;
			transition: opacity 1.5s;
			left: 50%;
			top: 50%;
			transform: translate(-50%, -50%);
		}
	
		#appeal_t1 p {
			line-height: 280%;
			color: #c9a76c;
		}





/* sh1 Riders Wait */

	#sh1_t1 {
		left: 4%;
		top: 6%;
	}

/* sh2 On Ridge */

	#sh2_t1 {
		left: 4%;
		bottom: 17%;
	}

/* sh3 Watching */

	#sh3_t1 {
		right: 4%;
		top: 6%;
	}

/* sh4 Herd */


/* sh5 Herd Close */

	#sh5_t1 {
		left: 52%;
		top: 25%;
	}

/* sh6 God of Wisdom */

	#sh6_t1 {
		left: 47%;
		bottom: 75%;
	}
	#sh6_t2 {
		left: 42%;
		top: 37%;
	}
	#sh6_t3 {
		left: 4%;
		bottom: 6%;
	}

/* sh7 Morora Smiles */

	#sh7_t1 {
		left: 66%;
		top: 26%;
	}

/* sh8 Feast Tonight */

	#sh8_t1 {
		left: 36%;
		bottom: 82%;
	}
	#sh8_t2 {
		right: 4%;
		top: 6%;
	}

/* sh9 Fog */

	#sh9_t1 {
		left: 4%;
		bottom: 6%;
	}

/* sh10 Fog 2 */

/* sh11 Herdsman Sees Riders */

	#sh11_t1 {
		left: 4%;
		bottom: 5%;
	}
	#sh11_t2 {
		left: 37%;
		top: 26%;
	}

/* sh12_1 Herd Into Forest */

	#sh12_1_t1 {
		left: 4%;
		top: 6%;
	}

/* sh12 Root Wall */

	#sh12_t1 {
		right: 4%;
		top: 3%;
	}
	#sh12_t2 {
		left: 55%;
		bottom: 22%;
	}
	#sh12_t3 {
		left: 55%;
		bottom: 18%;
	}

/* sh13 Entering Clearing */

	#sh13_t1 {
		left: 4%;
		bottom: 4%;
	}
	#sh13_t2 {
		left: 8%;
		bottom: 8%;
	}
	#sh13_t3 {
		left: 15%;
		top: 54%;
	}

/* sh13b Catch */

	#sh13b_t1 {
		left: 22%;
		top: 33%;
	}
	#sh13b_t2 {
		right: 25%;
		bottom: 20%;
	}

/* sh14 50 Warriors */

	#sh14_t1 {
		right: 60%;
		top: 10%;
	}
	#sh14_t2 {
		right: 4%;
		top: 6%;
	}
	#sh14_t3 {
		bottom: 15%;
		right: 4%;
	}

/* sh15 Herdsman Considers */

	#sh15_t1 {
		left: 4%;
		top: 6%;
	}
	#sh15_t2 {
		left: 4%;
		top: 15%;
	}
	#sh15_t3 {
		right: 40%;
		top: 25%;
	}
	#sh15_t4 {
		left: 4%;
		top: 15%;
	}

/* sh16 Archers Draw */

	#sh16_t1 {
		left: 4%;
		bottom: 6%;
	}
	#sh16_t2 {
		right: 4%;
		top: 50%;
	}

/* sh17 Dodging Arrows */

	#sh17_t1 {
		left: 4%;
		top: 10%;
	}
	#sh17_t2 {
		right: 30%;
		bottom: 5%;
	}
	#sh17_t3 {
		left: 4%;
		bottom: 20%;
	}

/* sh18 Archer Knocked Out */

	#sh18_t1 {
		left: 4%;
		top: 55%;
	}

/* sh19 Swords into Fog */

	#sh19_t1 {
		left: 43%;
		top: 6%;
	}
	#sh19_t2 {
		right: 4%;
		top: 10%;
	}

/* sh20 Mah'rakt Archers */

	#sh20_t1 {
		left: 45%;
		top: 23%;
	}
	#sh20_t2 {
		right: 4%;
		bottom: 6%;
	}

/* sh21 Show Yourselves */

	#sh21_t1 {
		left: 4%;
		top: 6%;
	}
	#sh21_t2 {
		right: 35%;
		top: 40%;
	}

/* sh22 Kai Revealed */

	#sh22_t1 {
		left: 36%;
		bottom: 15%;
	}

/* sh23 Shen Revealed */

	#sh23_t1 {
		right: 50%;
		top: 15%;
	}
	#sh23_t2 {
		left: 4%;
		top: 6%;
	}
	#sh23_t3 {
		left: 20%;
		bottom: 25%;
	}

/* sh24 Kida Revealed */

	#sh24_t1 {
		left: 4%;
		top: 6%;
	}
	#sh24_t2 {
		left: 30%;
		top: 30%;
	}
	#sh24_t3 {
		left: 35%;
		top: 40%;
	}
	#sh24_t4 {
		left: 40%;
		top: 65%;
	}
	#sh24_t5 {
		right: 28%;
		top: 12%;
	}

/* sh25 They're Na'Katar */

	#sh25_t1 {
		right: 55%;
		top: 28%;
	}
	#sh25_t2 {
		right: 4%;
		bottom: 6%;
	}

/* sh26 Oka Revealed */

	#sh26_t1 {
		left: 4%;
		bottom: 5%;
	}
	#sh26_t2 {
		left: 32%;
		top: 5%;
	}

/* sh27 The Morora is With Us */

	#sh27_t1 {
		right: 48%;
		top: 30%;
	}
	#sh27_t2 {
		right: 44%;
		top: 40%;
	}
	#sh27_t3 {
		left: 4%;
		bottom: 6%;
	}

/* sh28 Kida Attacks */

	#sh28_t1 {
		right: 18%;
		top: 10%;
	}


/* END */
	#end {
		width: 100%;
		height: 100%;
		background-color: #6b0e0e;
	}

	#end_t1 {	
		width: 100%;
		height: 100%;
		color: #000;
	}