html {
	font-family: Irma, sans-serif;
	font-weight: 900;
	text-rendering: optimizeLegibility;
	-webkit-font-feature-settings: "kern" 1, "liga" on, "dlig" on;
   	   -moz-font-feature-settings: "kern" 1, "liga" on, "dlig" on;
            font-feature-settings: "kern" 1, "liga" on, "dlig" on;
	-webkit-text-size-adjust: 100%;
	text-transform: uppercase;
	background: black;
	line-height: 1;
}
body {
	display: flex;
	height: 100vh;
	margin: 0;
	padding: 0;
	background: black;
}
h1 {
	margin: auto;
	font-size: 12vw;
	background-color: black;
	line-height: 0.886;
	color: white;
	font-weight: 800;
}
span {
	position: relative;
	display: inline-block;
}
strong {
	position: absolute;
	color: blue;
	margin-left: -.265em;
	opacity: .8;
}
span::before {
	content: attr(data-h1);
	position: absolute;
	color: blue;
	margin-left: .99em;
	mix-blend-mode: difference;
	opacity: .8;
	transition: .3s;
}
span::after {
	content: attr(data-h2-1);
	position: absolute;
	color: blue;
	left: 0;
	margin-left: 1.6em;
	mix-blend-mode: difference;
	opacity: .8;
	transition: .3s;
}
[data-h2-2]::after {
	content: attr(data-h2-2);
	margin-left: 1.97em;
}
[data-h2-3]::after {
	content: attr(data-h2-3);
	margin-left: 1.3em;
}
[data-h2-4]::after {
	content: attr(data-h2-4);
	margin-left: 0.78em;
}
[data-h2-5]::after {
	content: attr(data-h2-5);
	margin-left: 2.415em;
}
[data-h2-6]::after {
	content: attr(data-h2-6);
	margin-left: 0.03em;
}
[data-h2-7]::after {
	content: attr(data-h2-7);
	margin-left: 2.5em;
}
[data-h2-8]::after {
	content: attr(data-h2-8);
	margin-left: 1.25em;
}
[data-h2-9]::after {
	content: attr(data-h2-9);
	margin-left: 2.48em;
}
[data-h2-0]::after {
	content: attr(data-h2-0);
	margin-left: 2em;
}
[data-d0]::after {
	content: attr(data-d0);
	margin-left: 0.61em;
}
[data-d1]::after {
	content: attr(data-d1);
	margin-left: 0.235em;
}
[data-d2]::after {
	content: attr(data-d2);
	margin-left: 0.425em;
}
[data-d3]::after {
	content: attr(data-d3);
	margin-left: 0.33em;
}
[data-d4]::after {
	content: attr(data-d4);
	margin-left: 0.135em;
}
[data-d5]::after {
	content: attr(data-d5);
	margin-left: 0.3em;
}
[data-m0]::before {
	content: attr(data-m0);
	margin-left: 1.54em;
}
[data-m1]::before {
	content: attr(data-m1);
	margin-left: 1.212em;
}
[data-m2]::before {
	content: attr(data-m2);
	margin-left: 2.1em;
}
[data-m3]::before {
	content: attr(data-m3);
	margin-left: 1.7em;
}
[data-m4]::before {
	content: attr(data-m4);
	margin-left: 1.628em;
}
[data-m5]::before {
	content: attr(data-m5);
	margin-left: 1.55em;
}
[data-m6]::before {
	content: attr(data-m6);
	margin-left: 2em;
}
[data-m7]::before {
	content: attr(data-m7);
	margin-left: 1.7em;
}
[data-m8]::before {
	content: attr(data-m8);
	margin-left: 1.4em;
}
[data-m9]::before {
	content: attr(data-m9);
	margin-left: 2.03em;
}