html,
body
{
	background: #5788af;

	color: #fff;
	font: normal 500 16px/1.2 "Helvetica Neue", Helvetica, Arial, sans-serif;

	margin: 0;
	padding: 0;

	height: 100%;
	width: 100%;
}

main
{
	display: block;
	overflow: hidden;
	position: relative;

	height: 100%;
	width: 100%;
}

a,
a img,
a picture
[tabindex]
{
	box-shadow: none;

	border: 0;
	outline: 0;
}

/* Typography */
	h1
	{
		font-size: 5vmin;
		letter-spacing: .02em;
		line-height: 1.2;
		text-transform: uppercase;

		margin: 0 auto;
	}
	
	h2
	{
		font-size: 5vmin;
		letter-spacing: .02em;
		line-height: 1.2;
		text-transform: uppercase;

		margin: 0 0 .8em;
	}
	
	p
	{
		margin: 0 0 5vmin;
	}

	h1 + p
	{
		margin-top: 5vmin;
	}

	p:last-of-type,
	p:last-child
	{
		margin-bottom: 0;
	}
	
	sup
	{
		transform: translateY(-40%);

		font-size: 65%;
		vertical-align: middle;

		display: inline-block;
		position: relative;
	}
	
	.widows
	{
		white-space: nowrap;
		word-break: keep-all;
	}

	@media screen and (max-width: 667px)
	{
		h1
		{
			font-size: 8vmin;
			line-height: 1.15;

			max-width: none;
			width: 100%;
		}
		
		h2
		{
			font-size: 6.5vmin;
			line-height: 1.15;
			text-transform: none;
		}
	}

	@media screen and (min-width: 668px) and (orientation: portrait)
	{
		h1
		{
			font-size: 4vmin;
			letter-spacing: .015em;
			line-height: 1.1;
		}

		h2
		{
			font-size: 4vmin;
			letter-spacing: .015em;
			line-height: 1.1;

			margin: 0 0 .5em;
		}
		
		p
		{
			margin: 0 0 3.5vmin;
		}

		h1 + p
		{
			margin-top: 3.5vmin;
		}
	}

/* Structures */
	/* Chapters and Scenes */
		.chapter,
		.chapter .scene
		{
			background: transparent;
			transition: opacity 1s ease 1s;

			display: flex;
			 flex-flow: column nowrap;
			 place-content: center stretch;
			position: absolute;
			 top: 0;
			 left: 0;
			 z-index: 0;

			height: 100%;
			width: 100%;
		}

		.chapter[hidden],
		.chapter .scene[hidden]
		{
			transition-delay: .75s;

			opacity: 0;

			pointer-events: none;
		}

		.chapter:not([hidden]):last-of-type,
		.chapter .scene:not([hidden]):last-of-type
		{
			z-index: 1;
		}

		@media screen and (max-width: 667px)
		{
			.chapter .scene,
			.chapter .scene[hidden]
			{
				transition: opacity .25s ease 0s;
				transition-delay: 0s;
			}
		}
		
	/* Media Query Structure */
		@media screen and (max-width: 667px)
		{
			[data-viewport="large"]
			{
				display: none !important;
			}
		}

		@media screen and (min-width: 668px)
		{
			[data-viewport="small"]
			{
				display: none !important;
			}
		}

	/* Video Backgrounds */
		.chapter .scene video[class*='__background']
		{
			transform: translate(-50%, -50%);

			position: absolute;
			 top: 50%;
			 left: 50%;
			 z-index: -1;

			min-height: 100%;
			height: auto;
			min-width: 100%;
			width: auto;

			pointer-events: none;
		}
		
		@supports(object-fit: cover)
		{
			object-fit: cover;
			transform: none;

			top: 0;
			left: 0;

			height: 100%;
			width: 100%;
		}
		
		.chapter .scene video[class*='__background']::-webkit-media-controls
		{
			display: none;
		}
	
	/* Headers */
		#banner
		{
			background: transparent;
			transition: all .25s ease;

			box-sizing: border-box;
			display: block;
			flex: 0 1 auto;
			padding: 0;
			position: absolute;
			 top: 0;
			 left: 0;
			 z-index: 3;

			height: 8vmin;
			width: 100%;
		}

		#banner .brand
		{
			opacity: 1;
			transform: translateX(-100%);
			transition: all .25s ease;

			display: inline-block;
			margin: 0 0 0 100%;
			padding: 2vmin;
			position: relative;
			left: -2vmin;

			height: calc(100% - 4vmin);
		}

		#banner .brand:focus,
		#banner .brand:hover
		{
			opacity: .75;
		}

		#banner .brand img,
		#banner .brand picture
		{
			image-rendering: -webkit-optimize-contrast;
			image-rendering: crisp-edges;
			image-rendering: high-quality;

			display: block;
			margin: 0;

			height: 100%;
		}

		@media screen and (min-width: 668px)
		{
			#banner
			{
				transition: all .75s ease;

				box-sizing: border-box;
				display: block;
				flex: 0 1 auto;
				position: absolute;
				 top: 0;
				 left: 0;
				 z-index: 3;

				height: 7.5vmin;
				width: 100%;
			}

			#banner .brand
			{
				transition: all .5s ease .75s, opacity .25s ease 0s;
			}
			
			#banner.full
			{
				background: #004b87;

				padding: 0;

				height: 9.5vmin;
			}

			#banner.full .brand
			{
				transform: translateX(-50%);

				margin-left: 50%;
				left: 0;
			}
		}
		
		@media screen and (min-width: 668px) and (orientation: portrait)
		{
			#banner
			{
			    padding: 2.5vmin 0;

				height: 14vmin;
			}
		}

		@media screen and (max-width: 667px)
		{
			#banner
			{
				padding: 5vmin;

				height: 22vmin;
			}

			#banner:not(.full)
			{
				opacity: 0;

				pointer-events: none;
			}

			#banner .brand
			{
				transform: translateX(-50%);

				margin-left: 50%;
				left: 0;
			}
		}

	/* Content */
		.scene .content
		{
			text-align: center;
			text-shadow: rgba(0,0,0,.25) 0 0 .5vmin;

			box-sizing: border-box;
			display: flex;
			 flex-flow: column nowrap;
			 -ms-flex-pack: center;
			 place-content: center;
			 justify-content: center;
			flex: 1 1 auto;
			padding: 5vmin;
			overflow: hidden;
			overflow-y: auto;

			width: 100%;
		}

		@media screen and (max-width: 667px)
		{
			.scene .content
			{
				font-size: 3.5vmin;
				line-height: 1.4;
				text-align: left;

				padding: 9vmin;
			}
		}

/* UI Elements */
	/* Fat Links */
		[class*='exploder']
		{
			color: #fff;
			font: 600 3vmin/1 sans-serif;
			letter-spacing: .02em;
			text-align: center;
			text-decoration: underline;

			box-sizing: border-box;
			display: inline-block;
			margin: 0 auto;
			padding: 2vmin 5vmin;
			position: relative;
			 z-index: 1;

			width: auto;
		}

	/* Exploder Button(s) */
		@keyframes exploder--pulse
		{
			0%
			{
				opacity: .65;

				padding: 0;
			}
			
			90%
			{			
				opacity: 0;

				padding: 12px;
			}
			
			100%
			{			
				opacity: 0;
			}
		}

		[class*='exploder']
		{
			background: #1e4b83;
			border-radius: 100vmin;
			box-shadow: rgba(255,255,255,0) 0 0 1.5vmin;
			transition: box-shadow .25s ease;

			color: #fff;
			font: 600 3vmin/1 sans-serif;
			letter-spacing: .02em;
			text-align: center;
			text-decoration: none;

			box-sizing: border-box;
			display: inline-block;
			margin: 0 auto;
			padding: 3.25vmin 5.5vmin;
			position: relative;
			 z-index: 1;

			width: auto;
		}

		[class*='exploder']:not(.run):focus,
		[class*='exploder']:not(.run):hover
		{
			box-shadow: rgba(255,255,255,.25) 0 0 1.5vmin .25vmin;
		}

		[class*='exploder']::before,
		[class*='exploder']::after
		{
			border-radius: 100vmin;
			cursor: pointer;
			opacity: .65;
			transform: translate(-50%,-50%);
			transition: all .4s ease;

			border: #fff solid 1px;
			overflow: hidden;
			position: absolute;
			 top: 50%;
			 left: 50%;
			 z-index: -1;
			
			height: calc(100% - 4px);
			width: calc(100% - 4px);

			content: "";
			pointer-events: none;
		}

		[class*='exploder']:not(.run)::before,
		[class*='exploder']:not(.run)::after
		{
			animation: 2.5s infinite exploder--pulse;
		}

		[class*='exploder']:not(.run)::after
		{
			animation-delay: .4s;
		}

		[class*='exploder'] .label
		{
			opacity: 1;
			transition: all .5s ease;

			white-space: nowrap;

			display: inline-block;
			position: relative;
			 z-index: 2;
		}

		[class*='exploder']:focus .label,
		[class*='exploder']:hover .label
		{
			transform: perspective(1px) scale(1.05);

			-webkit-font-smoothing: antialiased;
		}

		[class*='exploder'].run .label
		{
			opacity: 0;
		}

		[class*='exploder'] .fx
		{
			-webkit-backface-visibilty: hidden;
			backface-visibilty: hidden;
			background: #2e5b8c;
			border-radius: 100vmin;
			transition: all .75s cubic-bezier(1,0,0,1), height .75s cubic-bezier(1,0,0,1) .1s, top .75s cubic-bezier(1,0,0,1) .1s, background-color .5s ease .5s;

			display: block;
			overflow: hidden;
			position: absolute;
			 top: 0;
			 left: 0;
			 z-index: 0;

			height: 100%;
			width: 100%;

			pointer-events: none;
		}

		[class*='exploder'] .fx::before
		{
			-webkit-backface-visibilty: hidden;
			backface-visibilty: hidden;
			background: #1e4b83;
			transform: skew(-25deg);
			transition: opacity .5s ease .25s;

			display: block;
			overflow: hidden;
			position: absolute;
			 top: 0;
			 left: -25%;
			 z-index: 0;

			height: 100%;
			width: calc(50% + 25%);

			content: "";
			pointer-events: none;
		}

		[class*='exploder'].run .fx
		{
			background: #5788af;
			border-radius: 0 !important;

			top: 0 !important;
			left: 0 !important;

			height: 100% !important;
			width: 100% !important;
		}

		[class*='exploder'].run .fx::before
		{
			opacity: 0;
		}
		
		@media screen and (max-width: 667px)
		{
			[class*='exploder']
			{
				font-size: 5.25vmin;
				font-weight: 500;
				letter-spacing: .075em;

				padding: 6vmin 8vmin;
			}
		}

		@media screen and (max-width: 667px) and (orientation: landscape)
		{
			[class*='exploder']
			{
				font-size: 4.25vmin;

				padding: 5vmin 7vmin;
			}
		}

	/* Pinger Button(s) */
		@keyframes pinger--pulse
		{
			0%
			{
				opacity: .65;

				padding: 0;
			}
			
			90%
			{			
				opacity: 0;

				padding: 4vmin;
			}
			
			100%
			{			
				opacity: 0;
			}
		}
	
		[class*='pinger']
		{
			color: #fff;
			font-size: 1.2vw;
			font-weight: 500;
			letter-spacing: .05em;
			text-decoration: none;
			text-transform: uppercase;

			box-sizing: border-box;
			flex: 0;
			overflow: visible;
			padding: 1vmin;
			position: relative;

			height: 7vmin;
			width: 7vmin;
		}

		[class*='pinger']::before
		{
			background: #2e5b8c;
			border-radius: 100vmin;
			transition: all .5s ease;

			vertical-align: middle;

			border: #fff solid .5vmin;
			box-sizing: border-box;
			display: inline-block;

			height: 100%;
			width: 100%;

			content: "";
		}

		[class*='pinger']:focus::before,
		[class*='pinger']:hover::before
		{
			background-color: #004b87;
		}

		[class*='pinger']:active::before,
		[class*='pinger'].active::before
		{
			background-color: #da291c;
		}
		
		[class*='pinger'] .fx::before,
		[class*='pinger'] .fx::after
		{
			border-radius: 100vmin;
			cursor: pointer;
			opacity: .65;
			transform: translate(-50%,-50%);
			transition: all .4s ease;

			border: #fff solid 1px;
			overflow: hidden;
			position: absolute;
			 top: 50%;
			 left: 50%;
			 z-index: -1;
			
			height: calc(100% - 2vmin);
			width: calc(100% - 2vmin);

			content: "";
			pointer-events: none;
		}

		[class*='pinger']:not(.active) .fx::before,
		[class*='pinger']:not(.active) .fx::after
		{
			animation: 2.5s infinite exploder--pulse;
		}

		[class*='pinger']:not(.active) .fx::after
		{
			animation-delay: .65s;
		}

		[class*='pinger'] .label
		{
			vertical-align: middle;
			white-space: nowrap;

			display: inline-block;
			flex: 0 1 auto;
			margin: auto 0;
			position: absolute;
			 top: calc(100% - 1vmin);
			 left: calc(100% - 1vmin);
		}
		
/* Chapter-Specific Styles */
	/* Start/Landing Page */
		.chapter:nth-of-type(1) .content
		{
			background: rgba(0,0,0,.2);

			padding-top: 9.5vmin;
		}

		.chapter:nth-of-type(1) .content h1
		{
			margin: 0 auto;

			min-width: 480px;
			width: 75vmin;
		}
			
		.chapter:nth-of-type(1) .content .exploder
		{
			margin-top: 6vmin;
		}
		
		@media screen and (max-width: 667px)
		{
			.chapter:nth-of-type(1) .content
			{
				padding-top: 22vmin;
			}
			
			.chapter:nth-of-type(1) .content h1
			{
				min-width: 0;
				max-width: none;
				width: 100%;
			}
			
			.chapter:nth-of-type(1) .content .exploder
			{
				margin-top: 10vmin;
			}
		}
		
		@media screen and (max-width: 667px) and (orientation: landscape)
		{
			.chapter:nth-of-type(1) .content .exploder
			{
				margin-top: 5vmin;
			}
		}
	
	/* Guided Storyline Videos */
		.chapter:nth-of-type(2)
		{
			background: #5788af;
		}

		.chapter:nth-of-type(2) .scene [class*='__background']
		{
			background: transparent url() 50% 50% / cover no-repeat;
			transform: translate(-50%,-50%) scale(1);
			transition: all 10s ease;

			position: absolute;
			 top: 50%;
			 left: 50%;
			 z-index: 0;
			
			height: 100%;
			width: 100%;
		}

		.chapter:nth-of-type(2) .scene:not([hidden]) [class*='__background']
		{
			transform: translate(-50%,-50%) scale(1.1);
		}

		.chapter:nth-of-type(2) .scene .content
		{
			font-size: 3vmin;
			
			padding: 14vmin 5vmin 38vmin;
			z-index: 1;
		}
		
		@media screen and (min-width: 668px) and (orientation: portrait)
		{
			.chapter:nth-of-type(2) .scene .content
			{
				padding-bottom: 42px;
			}
		}

		/* Scene 1: Intro */
			.chapter:nth-of-type(2) .scene:nth-of-type(1)
			{
				
			}
			
			.chapter:nth-of-type(2) .scene:nth-of-type(1) [class=*='__text']
			{
				font-size: 3.5vmin;

				margin: 0 auto;

				max-width: 120vmin;
			}

		/* Every other scene: Videos */
			.chapter:nth-of-type(2) .scene:not(:nth-of-type(1))
			{
				
			}

			.chapter:nth-of-type(2) .scene:not(:nth-of-type(1)) .content
			{
				box-sizing: border-box;
				display: flex;
				 flex-direction: row;
				 place-content: space-between;
				
				width: 100%;
			}

			.chapter:nth-of-type(2) .scene:not(:nth-of-type(1)) [class*='__text']
			{
				text-align: left;

				box-sizing: border-box;
				flex: 0 1 auto;

				width: 100%;
			}

			.chapter:nth-of-type(2) .scene:not(:nth-of-type(1)) [class*='__text']:only-child
			{
				text-align: center;

				display: flex;
				 flex-flow: column nowrap;
				 place-content: center;
			}

			.chapter:nth-of-type(2) .scene:not(:nth-of-type(1)) [class*='__video']
			{
				flex: 0 1 auto;

				width: 100%;
			}

			.chapter:nth-of-type(2) .scene:not(:nth-of-type(1)) [class*='__video'] video
			{
				background: #000;

				max-height: 100%;
				width: 100%;
			}
			
			@media screen and (min-width: 668px)
			{
				.chapter:nth-of-type(2) .scene:not(:nth-of-type(1)) [class*='__video']
				{
					width: calc(50% - 5vmin);
				}
			}
			
			@media screen and (min-width: 668px) and (orientation: landscape)
			{
				.chapter:nth-of-type(2) .scene:not(:nth-of-type(1)) [class*='__text']:not(:only-child)
				{
					padding-right: 5vmin;

					width: calc(50% + 5vmin);
				}
			}
			
			@media screen and (min-width: 668px) and (orientation: portrait)
			{
				.chapter:nth-of-type(2) .scene:not(:nth-of-type(1)) .content
				{
					flex-flow: column;
					padding-bottom: 30vmin;
				}

				.chapter:nth-of-type(2) .scene:not(:nth-of-type(1)) [class*='__text'],
				.chapter:nth-of-type(2) .scene:not(:nth-of-type(1)) [class*='__video']
				{
					padding-right: 0;

					width: 100%;
				}
			}

			@media screen and (max-width: 667px)
			{
				.chapter:nth-of-type(2) .scene:nth-of-type(1) .content,
				.chapter:nth-of-type(2) .scene:not(:nth-of-type(1)) .content
				{
					font-size: 5vmin;

					flex-flow: column;
					padding: 0 0 20vmin;
				}

				.chapter:nth-of-type(2) .scene [class*='__background']
				{
					box-shadow: rgba(0,0,0,.5) 0 0 10vmin 5vmin inset;
				}

				.chapter:nth-of-type(2) .scene [class*='__text']
				{
					box-sizing: border-box;
					padding: 5vmin 10vmin 10vmin;
				}

				.chapter:nth-of-type(2) .scene:not(:nth-of-type(1)) [class*='__text'],
				.chapter:nth-of-type(2) .scene:not(:nth-of-type(1)) [class*='__video']
				{
					flex: 1 1 auto;
				}

				.chapter:nth-of-type(2) .scene:not(:nth-of-type(1)) [class*='__text']:only-child
				{
					display: flex;
					 flex-flow: column nowrap;
					 place-content: center space-evenly;

					height: 100%;
				}

				.chapter:nth-of-type(2) .scene [class*='__text'] a[href]
				{
					color: inherit;
					text-decoration: underline;
				}

				.chapter:nth-of-type(2) .scene:not(:nth-of-type(1)) [class*='__video']
				{
					display: flex;
					 place-content: flex-end center;

					flex: 1 1 auto;
				}

				.chapter:nth-of-type(2) .scene:not(:nth-of-type(1)) [class*='__video'] video
				{
					object-fit: cover;
				}
			}
		
		/* Controls */
			.chapter:nth-of-type(2) .controls
			{
				box-sizing: border-box;
				display: block;
				oveflow: visible;
				position: absolute;
				 bottom: 0;
				 left: 0;
				 z-index: 2;

				height: 40vmin;
				width: 100%;
			}

			@media screen and (min-width: 668px)
			{
				.chapter:nth-of-type(2) .controls [class*='__background']
				{
					object-fit: contain;
					transition:  all .25s ease;

					overflow: hidden;
					position: absolute;
					 top: 0;
					 left: 0;
					 z-index: -1;

					height: 100%;
					width: 100%;

					pointer-events: none;
				}

				.chapter:nth-of-type(2) .controls.run [class*='__background']
				{
					opacity: .5;
				}

				.chapter:nth-of-type(2) .controls [class*='__background'] svg,
				.chapter:nth-of-type(2) .controls [class*='__background'] img,
				.chapter:nth-of-type(2) .controls [class*='__background'] picture
				{
					object-fit: cover;

					position: absolute;
					 top: 0;
					 left: 0;

					width: 100%;

					pointer-events: none;
				}

				.chapter:nth-of-type(2) .controls [class*='control']
				{
					cursor: pointer;
				}
				
				.hide-controls .chapter:nth-of-type(2) .controls [class*='__background']
				{
					transition-delay: 0;
				}
			}
			
			@media screen and (min-width: 668px) and (orientation: portrait)
			{
				.chapter:nth-of-type(2) .controls
				{
					
					height: 30vmin;
				}
			}

			@media screen and (max-width: 667px)
			{
				.chapter:nth-of-type(2) .controls
				{
					box-sizing: border-box;
					display: block;
					flex: 0 1 auto;
					overflow: hidden;
					position: absolute;
					 bottom: 0;
					 z-index: 2;

					height: 20vmin;
					width: 100%;
				}
			}

			/* Scene-Selection Controls */
				.chapter:nth-of-type(2) .controls [class*='__scene-selection']
				{
					cursor: default;

					display: block;
					display: flex;
					 flex-flow: row nowrap;
					 place-content: center space-around;
					position: absolute;
					 top: 0;
					 left: 0;

					height: 100%;
					width: 100%;
				}

				.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']
				{
					transition: opacity .5s ease;

					display: inline-block;
					flex: 0 1 auto;
				}

				@media screen and (min-width: 668px)
				{
					.chapter:nth-of-type(2) .controls:not(.run) [class*='__scene-selection'] [class*='scene-choice']
					{
						opacity: 0;

						pointer-events: none;
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice'] .label
					{
						opacity: .9;
						transition: all .25s ease;

						text-shadow: rgba(255,255,255,0) 0 0 .25vmin;
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:focus .label,
					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:hover .label
					{
						opacity: 1;

						text-shadow: rgba(255,255,255,.25) 0 0 .5vmin;
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(1)
					{
						transition-delay: .5s;

						position: absolute;
						 top: 27%;
						 left: 11%;
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(1) .fx::before,
					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(1) .fx::after
					{
						animation-delay: .5s;
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(1)::after
					{
						animation-delay: 1.15s;
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(2)
					{
						transition-delay: .1s;

						position: absolute;
						 top: 15%;
						 left: 38%;
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(2) .fx::before,
					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(2) .fx::after
					{
						animation-delay: .1s;
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(2)::after
					{
						animation-delay: .75s;
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(2) .label
					{
						text-align: right;

						top: auto;
						right: 100%;
						bottom: 50%;
						left: auto;
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(3)
					{
						transition-delay: .3s;

						position: absolute;
						 top: 36%;
						 left: 52%;
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(3) .fx::before,
					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(3) .fx::after
					{
						animation-delay: .35s;
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(3)::after
					{
						animation-delay: .95s;
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(3) .label
					{
						text-align: right;

						top: 50%;
						right: 100%;
						bottom: auto;
						left: auto;
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(4)
					{
						transition-delay: .65s;

						position: absolute;
						 top: 35%;
						 left: 73%;
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(4) .fx::before,
					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(4) .fx::after
					{
						animation-delay: .65s;
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(4)::after
					{
						animation-delay: 1.3s;
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection'] [class*='scene-choice']:nth-child(4) .label
					{
						top: auto;
						right: auto;
						bottom: 100%;
						left: 50%;
					}

					.chapter:nth-of-type(2) .controls.run [class*='__background'],
					.chapter:nth-of-type(2) .controls.run [class*='__scene-selection']
					{
						transition: all .5s ease 0s;
					}

					.chapter:nth-of-type(2) .controls.run [class*='__scene-selection']
					{
						transition: all .5s ease .25s;
					}

					.chapter:nth-of-type(2).hide-controls .controls [class*='__background'],
					.chapter:nth-of-type(2).hide-controls .controls [class*='__scene-selection']
					{
						opacity: 0;
						transition-delay: .75s;

						pointer-events: none;
					}

					.chapter:nth-of-type(2).hide-controls .controls [class*='__scene-selection']
					{
						transition-delay: .5s
					}
				}

				@media screen and (max-width: 667px)
				{
					.chapter:nth-of-type(2) .controls
					{
						-webkit-backdrop-filter: blur(5px);
						backdrop-filter: blur(5px);
					}

					.chapter:nth-of-type(2) .controls [class*='__scene-selection']
					{
						box-sizing: border-box;
						justify-content: space-evenly;
						padding-right: 25vmin;
						padding-left: 25vmin;

						width: 100%;
					}

					.chapter:nth-of-type(2) .controls .indicator
					{
						background: rgba(255,255,255,0);
						transition: all .25s ease;

						border: #fff solid .35vmin;
						border-radius: 100vmin;
						box-sizing: border-box;
						display: inline-block;
						flex: none;
						margin: auto -10%;
						overflow: hidden;
						
						width: 5%;
					}
					
					.chapter:nth-of-type(2) .controls .indicator::before
					{
						display: block;
						padding: 100% 0 0;
						
						width: 100%;

						content: "";
					}

					.chapter:nth-of-type(2) .controls .indicator.active
					{
						background: rgba(255,255,255,1);
					}
					
					[data-chapter="story"][data-scene="nightmare"] .chapter:nth-of-type(2) .controls
					{
						opacity: 0;

						pointer-events: none;
					}
				}

			/* Step Controls */
				.chapter:nth-of-type(2) .controls [class*='__step']
				{
					color: #fff;
					font-size: 2.2vmin;
					font-weight: 600;
					letter-spacing: .05em;
					text-decoration: none;
					text-transform: uppercase;
					white-space: nowrap;

					box-sizing: border-box;
					flex: 0;
					padding: 1vmin;
					position: absolute;
					 bottom: 3vmin;
				}
		
				@media screen and (min-width: 668px)
				{
					.chapter:nth-of-type(2) .controls [class*='__step'][hidden]
					{
						display: none;
					}

					.chapter:nth-of-type(2) .controls [class*='__step'].back
					{
						left: 3vmin;
					}

					.chapter:nth-of-type(2) .controls [class*='__step'].next
					{
						right: 3vmin;
					}

					.chapter:nth-of-type(2) .controls [class*='__step']::before,
					.chapter:nth-of-type(2) .controls [class*='__step']::after
					{
						background: #da291c url("./media/control.svg") 55% 50% / 40% no-repeat;
						background-size: 40%;
						border-radius: 100vmin;
						transition: all .5s ease;

						vertical-align: middle;

						border: #fff solid .5vmin;
						box-sizing: border-box;
						display: inline-block;
						margin: auto 2.25vmin auto 0;

						height: 5vmin;
						width: 5vmin;
					}

					.chapter:nth-of-type(2) .controls [class*='__step'].back::before
					{
						transform: scale(-1);

						margin: auto 2.25vmin auto 0;

						content: "";
					}

					.chapter:nth-of-type(2) .controls [class*='__step'].next::after
					{
						margin: auto 0 auto 2vmin;

						content: "";
					}

					.chapter:nth-of-type(2) .controls [class*='__step']:focus::before,
					.chapter:nth-of-type(2) .controls [class*='__step']:hover::before,
					.chapter:nth-of-type(2) .controls [class*='__step']:focus::after,
					.chapter:nth-of-type(2) .controls [class*='__step']:hover::after
					{
						background-color: #004b87;
					}

					.chapter:nth-of-type(2) .controls [class*='__step']:active::before,
					.chapter:nth-of-type(2) .controls [class*='__step']:active::after
					{
						background-color: #2e5b8c;
					}

					.chapter:nth-of-type(2) .controls [class*='__step'] .label
					{
						vertical-align: middle;

						flex: 0 1 auto;
						margin: auto 0;
					}
					
					body[data-chapter='story'][data-scene='end'] .chapter:nth-of-type(2) .controls [class*='__step'][href$='/end'],
					body[data-chapter='story']:not([data-scene='end']) .chapter:nth-of-type(2) .controls [class*='__step'][href$='/nightmare']
					{
						display: none;
					}
				}

				@media screen and (max-width: 667px)
				{
					.chapter:nth-of-type(2) .controls [class*='__step']
					{
						background: transparent url("./media/control.svg") 50% 50% / 15% no-repeat;
						transform: translateY(-50%);

						box-sizing: border-box;
						display: inline-block;
						flex: 0;
						position: absolute;
						 top: 50%;

						height: 100%;
						width: 20vmin;
					}

					.chapter:nth-of-type(2) .controls [class*='__step'].back
					{
						transform: translateY(-50%) scale(-1);

						left: 0;
					}

					.chapter:nth-of-type(2) .controls [class*='__step'].next
					{
						right: 0;
					}

					.chapter:nth-of-type(2) .close
					{
						background: transparent url("./media/close.svg") 50% 50% / 5vmin no-repeat;
						cursor: pointer;

						display: inline-block;
						flex: 0;
						padding: 3.5vmin;
						position: absolute;
						 top: 1vmin;
						 right: 2.5vmin;
						 z-index: 4;

						height: 9vmin;
						width: 9vmin;
					}
				}