@import url('https://fonts.googleapis.com/css?family=Arvo:400,700&display=swap');
@font-face {
  font-family: "MAWNSTR";
  src: 
  url("assets/fonts/MAWNSTR-Regular.woff2") format("woff2"),
  url("assets/fonts/MAWNSTR-Regular.woff") format("woff"),
  url("assets/fonts/MAWNSTR-Regular.otf") format("otf");
}

@keyframes color-decision {
	0% 	{ background-color: hsl(0,100%,50%); fill: hsl(0,100%,50%); }
	1% 	{ background-color: hsl(4,100%,50%); fill: hsl(4,100%,50%); }
	2% 	{ background-color: hsl(8,100%,50%); fill: hsl(8,100%,50%); }
	3% 	{ background-color: hsl(11,100%,50%); fill: hsl(11,100%,50%); }
	4% 	{ background-color: hsl(15,100%,50%); fill: hsl(15,100%,50%); }
	5% 	{ background-color: hsl(18,100%,50%); fill: hsl(18,100%,50%); }
	6% 	{ background-color: hsl(22,100%,50%); fill: hsl(22,100%,50%); }
	7% 	{ background-color: hsl(26,100%,50%); fill: hsl(26,100%,50%); }
	8% 	{ background-color: hsl(29,100%,50%); fill: hsl(29,100%,50%); }
	9% 	{ background-color: hsl(33,100%,50%); fill: hsl(33,100%,50%); }
	10% 	{ background-color: hsl(36,100%,50%); fill: hsl(36,100%,50%); }
	11% 	{ background-color: hsl(40,100%,50%); fill: hsl(40,100%,50%); }
	12% 	{ background-color: hsl(44,100%,50%); fill: hsl(44,100%,50%); }
	13% 	{ background-color: hsl(47,100%,50%); fill: hsl(47,100%,50%); }
	14% 	{ background-color: hsl(51,100%,50%); fill: hsl(51,100%,50%); }
	15% 	{ background-color: hsl(54,100%,50%); fill: hsl(54,100%,50%); }
	16% 	{ background-color: hsl(58,100%,50%); fill: hsl(58,100%,50%); }
	17% 	{ background-color: hsl(62,100%,50%); fill: hsl(62,100%,50%); }
	18% 	{ background-color: hsl(65,100%,50%); fill: hsl(65,100%,50%); }
	19% 	{ background-color: hsl(69,100%,50%); fill: hsl(69,100%,50%); }
	20% 	{ background-color: hsl(72,100%,50%); fill: hsl(72,100%,50%); }
	21% 	{ background-color: hsl(76,100%,50%); fill: hsl(76,100%,50%); }
	22% 	{ background-color: hsl(80,100%,50%); fill: hsl(80,100%,50%); }
	23% 	{ background-color: hsl(83,100%,50%); fill: hsl(83,100%,50%); }
	24% 	{ background-color: hsl(87,100%,50%); fill: hsl(87,100%,50%); }
	25% 	{ background-color: hsl(90,100%,50%); fill: hsl(90,100%,50%); }
	26% 	{ background-color: hsl(94,100%,50%); fill: hsl(94,100%,50%); }
	27% 	{ background-color: hsl(98,100%,50%); fill: hsl(98,100%,50%); }
	28% 	{ background-color: hsl(101,100%,50%); fill: hsl(101,100%,50%); }
	29% 	{ background-color: hsl(105,100%,50%); fill: hsl(105,100%,50%); }
	30% 	{ background-color: hsl(108,100%,50%); fill: hsl(108,100%,50%); }
	31% 	{ background-color: hsl(112,100%,50%); fill: hsl(112,100%,50%); }
	32% 	{ background-color: hsl(116,100%,50%); fill: hsl(116,100%,50%); }
	33% 	{ background-color: hsl(119,100%,50%); fill: hsl(119,100%,50%); }
	34% 	{ background-color: hsl(123,100%,50%); fill: hsl(123,100%,50%); }
	35% 	{ background-color: hsl(126,100%,50%); fill: hsl(126,100%,50%); }
	36% 	{ background-color: hsl(130,100%,50%); fill: hsl(130,100%,50%); }
	37% 	{ background-color: hsl(134,100%,50%); fill: hsl(134,100%,50%); }
	38% 	{ background-color: hsl(137,100%,50%); fill: hsl(137,100%,50%); }
	39% 	{ background-color: hsl(141,100%,50%); fill: hsl(141,100%,50%); }
	40% 	{ background-color: hsl(144,100%,50%); fill: hsl(144,100%,50%); }
	41% 	{ background-color: hsl(148,100%,50%); fill: hsl(148,100%,50%); }
	42% 	{ background-color: hsl(152,100%,50%); fill: hsl(152,100%,50%); }
	43% 	{ background-color: hsl(155,100%,50%); fill: hsl(155,100%,50%); }
	44% 	{ background-color: hsl(159,100%,50%); fill: hsl(159,100%,50%); }
	45% 	{ background-color: hsl(162,100%,50%); fill: hsl(162,100%,50%); }
	46% 	{ background-color: hsl(166,100%,50%); fill: hsl(166,100%,50%); }
	47% 	{ background-color: hsl(170,100%,50%); fill: hsl(170,100%,50%); }
	48% 	{ background-color: hsl(173,100%,50%); fill: hsl(173,100%,50%); }
	49% 	{ background-color: hsl(177,100%,50%); fill: hsl(177,100%,50%); }
	50% 	{ background-color: hsl(180,100%,50%); fill: hsl(180,100%,50%); }
	51% 	{ background-color: hsl(184,100%,50%); fill: hsl(184,100%,50%); }
	52% 	{ background-color: hsl(188,100%,50%); fill: hsl(188,100%,50%); }
	53% 	{ background-color: hsl(191,100%,50%); fill: hsl(191,100%,50%); }
	54% 	{ background-color: hsl(195,100%,50%); fill: hsl(195,100%,50%); }
	55% 	{ background-color: hsl(198,100%,50%); fill: hsl(198,100%,50%); }
	56% 	{ background-color: hsl(202,100%,50%); fill: hsl(202,100%,50%); }
	57% 	{ background-color: hsl(206,100%,50%); fill: hsl(206,100%,50%); }
	58% 	{ background-color: hsl(209,100%,50%); fill: hsl(209,100%,50%); }
	59% 	{ background-color: hsl(213,100%,50%); fill: hsl(213,100%,50%); }
	60% 	{ background-color: hsl(216,100%,50%); fill: hsl(216,100%,50%); }
	61% 	{ background-color: hsl(220,100%,50%); fill: hsl(220,100%,50%); }
	62% 	{ background-color: hsl(224,100%,50%); fill: hsl(224,100%,50%); }
	63% 	{ background-color: hsl(227,100%,50%); fill: hsl(227,100%,50%); }
	64% 	{ background-color: hsl(231,100%,50%); fill: hsl(231,100%,50%); }
	65% 	{ background-color: hsl(234,100%,50%); fill: hsl(234,100%,50%); }
	66% 	{ background-color: hsl(238,100%,50%); fill: hsl(238,100%,50%); }
	67% 	{ background-color: hsl(242,100%,50%); fill: hsl(242,100%,50%); }
	68% 	{ background-color: hsl(245,100%,50%); fill: hsl(245,100%,50%); }
	69% 	{ background-color: hsl(249,100%,50%); fill: hsl(249,100%,50%); }
	70% 	{ background-color: hsl(252,100%,50%); fill: hsl(252,100%,50%); }
	71% 	{ background-color: hsl(256,100%,50%); fill: hsl(256,100%,50%); }
	72% 	{ background-color: hsl(260,100%,50%); fill: hsl(260,100%,50%); }
	73% 	{ background-color: hsl(263,100%,50%); fill: hsl(263,100%,50%); }
	74% 	{ background-color: hsl(267,100%,50%); fill: hsl(267,100%,50%); }
	75% 	{ background-color: hsl(270,100%,50%); fill: hsl(270,100%,50%); }
	76% 	{ background-color: hsl(274,100%,50%); fill: hsl(274,100%,50%); }
	77% 	{ background-color: hsl(278,100%,50%); fill: hsl(278,100%,50%); }
	78% 	{ background-color: hsl(281,100%,50%); fill: hsl(281,100%,50%); }
	79% 	{ background-color: hsl(285,100%,50%); fill: hsl(285,100%,50%); }
	80% 	{ background-color: hsl(288,100%,50%); fill: hsl(288,100%,50%); }
	81% 	{ background-color: hsl(292,100%,50%); fill: hsl(292,100%,50%); }
	82% 	{ background-color: hsl(296,100%,50%); fill: hsl(296,100%,50%); }
	83% 	{ background-color: hsl(299,100%,50%); fill: hsl(299,100%,50%); }
	84% 	{ background-color: hsl(303,100%,50%); fill: hsl(303,100%,50%); }
	85% 	{ background-color: hsl(306,100%,50%); fill: hsl(306,100%,50%); }
	86% 	{ background-color: hsl(310,100%,50%); fill: hsl(310,100%,50%); }
	87% 	{ background-color: hsl(314,100%,50%); fill: hsl(314,100%,50%); }
	88% 	{ background-color: hsl(317,100%,50%); fill: hsl(317,100%,50%); }
	89% 	{ background-color: hsl(321,100%,50%); fill: hsl(321,100%,50%); }
	90% 	{ background-color: hsl(324,100%,50%); fill: hsl(324,100%,50%); }
	91% 	{ background-color: hsl(328,100%,50%); fill: hsl(328,100%,50%); }
	92% 	{ background-color: hsl(332,100%,50%); fill: hsl(332,100%,50%); }
	93% 	{ background-color: hsl(335,100%,50%); fill: hsl(335,100%,50%); }
	94% 	{ background-color: hsl(339,100%,50%); fill: hsl(339,100%,50%); }
	95% 	{ background-color: hsl(342,100%,50%); fill: hsl(342,100%,50%); }
	96% 	{ background-color: hsl(346,100%,50%); fill: hsl(346,100%,50%); }
	97% 	{ background-color: hsl(350,100%,50%); fill: hsl(350,100%,50%); }
	98% 	{ background-color: hsl(353,100%,50%); fill: hsl(353,100%,50%); }
	99% 	{ background-color: hsl(357,100%,50%); fill: hsl(357,100%,50%); }
	100% 	{ background-color: hsl(360,100%,50%); fill: hsl(360,100%,50%); }
	}
@keyframes color-decision-dark {
	0% 	{ background-color: hsl(0,100%,20%); }
	1% 	{ background-color: hsl(4,100%,20%); }
	2% 	{ background-color: hsl(8,100%,20%); }
	3% 	{ background-color: hsl(11,100%,20%); }
	4% 	{ background-color: hsl(15,100%,20%); }
	5% 	{ background-color: hsl(18,100%,20%); }
	6% 	{ background-color: hsl(22,100%,20%); }
	7% 	{ background-color: hsl(26,100%,20%); }
	8% 	{ background-color: hsl(29,100%,20%); }
	9% 	{ background-color: hsl(33,100%,20%); }
	10% 	{ background-color: hsl(36,100%,20%); }
	11% 	{ background-color: hsl(40,100%,20%); }
	12% 	{ background-color: hsl(44,100%,20%); }
	13% 	{ background-color: hsl(47,100%,20%); }
	14% 	{ background-color: hsl(51,100%,20%); }
	15% 	{ background-color: hsl(54,100%,20%); }
	16% 	{ background-color: hsl(58,100%,20%); }
	17% 	{ background-color: hsl(62,100%,20%); }
	18% 	{ background-color: hsl(65,100%,20%); }
	19% 	{ background-color: hsl(69,100%,20%); }
	20% 	{ background-color: hsl(72,100%,20%); }
	21% 	{ background-color: hsl(76,100%,20%); }
	22% 	{ background-color: hsl(80,100%,20%); }
	23% 	{ background-color: hsl(83,100%,20%); }
	24% 	{ background-color: hsl(87,100%,20%); }
	25% 	{ background-color: hsl(90,100%,20%); }
	26% 	{ background-color: hsl(94,100%,20%); }
	27% 	{ background-color: hsl(98,100%,20%); }
	28% 	{ background-color: hsl(101,100%,20%); }
	29% 	{ background-color: hsl(105,100%,20%); }
	30% 	{ background-color: hsl(108,100%,20%); }
	31% 	{ background-color: hsl(112,100%,20%); }
	32% 	{ background-color: hsl(116,100%,20%); }
	33% 	{ background-color: hsl(119,100%,20%); }
	34% 	{ background-color: hsl(123,100%,20%); }
	35% 	{ background-color: hsl(126,100%,20%); }
	36% 	{ background-color: hsl(130,100%,20%); }
	37% 	{ background-color: hsl(134,100%,20%); }
	38% 	{ background-color: hsl(137,100%,20%); }
	39% 	{ background-color: hsl(141,100%,20%); }
	40% 	{ background-color: hsl(144,100%,20%); }
	41% 	{ background-color: hsl(148,100%,20%); }
	42% 	{ background-color: hsl(152,100%,20%); }
	43% 	{ background-color: hsl(155,100%,20%); }
	44% 	{ background-color: hsl(159,100%,20%); }
	45% 	{ background-color: hsl(162,100%,20%); }
	46% 	{ background-color: hsl(166,100%,20%); }
	47% 	{ background-color: hsl(170,100%,20%); }
	48% 	{ background-color: hsl(173,100%,20%); }
	49% 	{ background-color: hsl(177,100%,20%); }
	50% 	{ background-color: hsl(180,100%,20%); }
	51% 	{ background-color: hsl(184,100%,20%); }
	52% 	{ background-color: hsl(188,100%,20%); }
	53% 	{ background-color: hsl(191,100%,20%); }
	54% 	{ background-color: hsl(195,100%,20%); }
	55% 	{ background-color: hsl(198,100%,20%); }
	56% 	{ background-color: hsl(202,100%,20%); }
	57% 	{ background-color: hsl(206,100%,20%); }
	58% 	{ background-color: hsl(209,100%,20%); }
	59% 	{ background-color: hsl(213,100%,20%); }
	60% 	{ background-color: hsl(216,100%,20%); }
	61% 	{ background-color: hsl(220,100%,20%); }
	62% 	{ background-color: hsl(224,100%,20%); }
	63% 	{ background-color: hsl(227,100%,20%); }
	64% 	{ background-color: hsl(231,100%,20%); }
	65% 	{ background-color: hsl(234,100%,20%); }
	66% 	{ background-color: hsl(238,100%,20%); }
	67% 	{ background-color: hsl(242,100%,20%); }
	68% 	{ background-color: hsl(245,100%,20%); }
	69% 	{ background-color: hsl(249,100%,20%); }
	70% 	{ background-color: hsl(252,100%,20%); }
	71% 	{ background-color: hsl(256,100%,20%); }
	72% 	{ background-color: hsl(260,100%,20%); }
	73% 	{ background-color: hsl(263,100%,20%); }
	74% 	{ background-color: hsl(267,100%,20%); }
	75% 	{ background-color: hsl(270,100%,20%); }
	76% 	{ background-color: hsl(274,100%,20%); }
	77% 	{ background-color: hsl(278,100%,20%); }
	78% 	{ background-color: hsl(281,100%,20%); }
	79% 	{ background-color: hsl(285,100%,20%); }
	80% 	{ background-color: hsl(288,100%,20%); }
	81% 	{ background-color: hsl(292,100%,20%); }
	82% 	{ background-color: hsl(296,100%,20%); }
	83% 	{ background-color: hsl(299,100%,20%); }
	84% 	{ background-color: hsl(303,100%,20%); }
	85% 	{ background-color: hsl(306,100%,20%); }
	86% 	{ background-color: hsl(310,100%,20%); }
	87% 	{ background-color: hsl(314,100%,20%); }
	88% 	{ background-color: hsl(317,100%,20%); }
	89% 	{ background-color: hsl(321,100%,20%); }
	90% 	{ background-color: hsl(324,100%,20%); }
	91% 	{ background-color: hsl(328,100%,20%); }
	92% 	{ background-color: hsl(332,100%,20%); }
	93% 	{ background-color: hsl(335,100%,20%); }
	94% 	{ background-color: hsl(339,100%,20%); }
	95% 	{ background-color: hsl(342,100%,20%); }
	96% 	{ background-color: hsl(346,100%,20%); }
	97% 	{ background-color: hsl(350,100%,20%); }
	98% 	{ background-color: hsl(353,100%,20%); }
	99% 	{ background-color: hsl(357,100%,20%); }
	100% 	{ background-color: hsl(360,100%,20%); }
	}
@keyframes be-erratic {
	0% {
		fill: hsl(0,100%,90%);
		color: hsl(0,100%,90%);
		transform: rotate(0deg) scale(.99);
		}
	1% {
		fill: hsl(4,100%,90%);
		color: hsl(4,100%,90%);
		}
	2% {
		fill: hsl(8,100%,90%);
		color: hsl(8,100%,90%);
		}
	3% {
		fill: hsl(11,100%,90%);
		color: hsl(11,100%,90%);
		}
	4% {
		fill: hsl(15,100%,90%);
		color: hsl(15,100%,90%);
		}
	5% {
		fill: hsl(18,100%,90%);
		color: hsl(18,100%,90%);
		}
	6% {
		fill: hsl(22,100%,90%);
		color: hsl(22,100%,90%);
		}
	7% {
		fill: hsl(26,100%,90%);
		color: hsl(26,100%,90%);
		}
	8% {
		fill: hsl(29,100%,90%);
		color: hsl(29,100%,90%);
		}
	9% {
		fill: hsl(33,100%,90%);
		color: hsl(33,100%,90%);
		}
	10% {
		fill: hsl(36,100%,90%);
		color: hsl(36,100%,90%);
		transform: rotate(1deg) scale(.95);
		}
	11% {
		fill: hsl(40,100%,90%);
		color: hsl(40,100%,90%);
		}
	12% {
		fill: hsl(44,100%,90%);
		color: hsl(44,100%,90%);
		}
	13% {
		fill: hsl(47,100%,90%);
		color: hsl(47,100%,90%);
		}
	14% {
		fill: hsl(51,100%,90%);
		color: hsl(51,100%,90%);
		}
	15% {
		fill: hsl(54,100%,90%);
		color: hsl(54,100%,90%);
		}
	16% {
		fill: hsl(58,100%,90%);
		color: hsl(58,100%,90%);
		}
	17% {
		fill: hsl(62,100%,90%);
		color: hsl(62,100%,90%);
		}
	18% {
		fill: hsl(65,100%,90%);
		color: hsl(65,100%,90%);
		}
	19% {
		fill: hsl(69,100%,90%);
		color: hsl(69,100%,90%);
		}
	20% {
		fill: hsl(72,100%,90%);
		color: hsl(72,100%,90%);
		transform: rotate(0deg) scale(1);
		}
	21% {
		fill: hsl(76,100%,90%);
		color: hsl(76,100%,90%);
		}
	22% {
		fill: hsl(80,100%,90%);
		color: hsl(80,100%,90%);
		}
	23% {
		fill: hsl(83,100%,90%);
		color: hsl(83,100%,90%);
		}
	24% {
		fill: hsl(87,100%,90%);
		color: hsl(87,100%,90%);
		}
	25% {
		fill: hsl(90,100%,90%);
		color: hsl(90,100%,90%);
		}
	26% {
		fill: hsl(94,100%,90%);
		color: hsl(94,100%,90%);
		}
	27% {
		fill: hsl(98,100%,90%);
		color: hsl(98,100%,90%);
		}
	28% {
		fill: hsl(101,100%,90%);
		color: hsl(101,100%,90%);
		}
	29% {
		fill: hsl(105,100%,90%);
		color: hsl(105,100%,90%);
		}
	30% {
		fill: hsl(108,100%,90%);
		color: hsl(108,100%,90%);
		transform: rotate(-1deg) scale(.98);
		}
	31% {
		fill: hsl(112,100%,90%);
		color: hsl(112,100%,90%);
		}
	32% {
		fill: hsl(116,100%,90%);
		color: hsl(116,100%,90%);
		}
	33% {
		fill: hsl(119,100%,90%);
		color: hsl(119,100%,90%);
		}
	34% {
		fill: hsl(123,100%,90%);
		color: hsl(123,100%,90%);
		}
	35% {
		fill: hsl(126,100%,90%);
		color: hsl(126,100%,90%);
		}
	36% {
		fill: hsl(130,100%,90%);
		color: hsl(130,100%,90%);
		}
	37% {
		fill: hsl(134,100%,90%);
		color: hsl(134,100%,90%);
		}
	38% {
		fill: hsl(137,100%,90%);
		color: hsl(137,100%,90%);
		}
	39% {
		fill: hsl(141,100%,90%);
		color: hsl(141,100%,90%);
		}
	40% {
		fill: hsl(144,100%,90%);
		color: hsl(144,100%,90%);
		transform: rotate(0deg) scale(1);
		}
	41% {
		fill: hsl(148,100%,90%);
		color: hsl(148,100%,90%);
		}
	42% {
		fill: hsl(152,100%,90%);
		color: hsl(152,100%,90%);
		}
	43% {
		fill: hsl(155,100%,90%);
		color: hsl(155,100%,90%);
		}
	44% {
		fill: hsl(159,100%,90%);
		color: hsl(159,100%,90%);
		}
	45% {
		fill: hsl(162,100%,90%);
		color: hsl(162,100%,90%);
		}
	46% {
		fill: hsl(166,100%,90%);
		color: hsl(166,100%,90%);
		}
	47% {
		fill: hsl(170,100%,90%);
		color: hsl(170,100%,90%);
		}
	48% {
		fill: hsl(173,100%,90%);
		color: hsl(173,100%,90%);
		}
	49% {
		fill: hsl(177,100%,90%);
		color: hsl(177,100%,90%);
		}
	50% {
		fill: hsl(180,100%,90%);
		color: hsl(180,100%,90%);
		transform: rotate(1deg) scale(.95);
		}
	51% {
		fill: hsl(184,100%,90%);
		color: hsl(184,100%,90%);
		}
	52% {
		fill: hsl(188,100%,90%);
		color: hsl(188,100%,90%);
		}
	53% {
		fill: hsl(191,100%,90%);
		color: hsl(191,100%,90%);
		}
	54% {
		fill: hsl(195,100%,90%);
		color: hsl(195,100%,90%);
		}
	55% {
		fill: hsl(198,100%,90%);
		color: hsl(198,100%,90%);
		}
	56% {
		fill: hsl(202,100%,90%);
		color: hsl(202,100%,90%);
		}
	57% {
		fill: hsl(206,100%,90%);
		color: hsl(206,100%,90%);
		}
	58% {
		fill: hsl(209,100%,90%);
		color: hsl(209,100%,90%);
		}
	59% {
		fill: hsl(213,100%,90%);
		color: hsl(213,100%,90%);
		}
	60% {
		fill: hsl(216,100%,90%);
		color: hsl(216,100%,90%);
		transform: rotate(0deg) scale(1);
		}
	61% {
		fill: hsl(220,100%,90%);
		color: hsl(220,100%,90%);
		}
	62% {
		fill: hsl(224,100%,90%);
		color: hsl(224,100%,90%);
		}
	63% {
		fill: hsl(227,100%,90%);
		color: hsl(227,100%,90%);
		}
	64% {
		fill: hsl(231,100%,90%);
		color: hsl(231,100%,90%);
		}
	65% {
		fill: hsl(234,100%,90%);
		color: hsl(234,100%,90%);
		}
	66% {
		fill: hsl(238,100%,90%);
		color: hsl(238,100%,90%);
		}
	67% {
		fill: hsl(242,100%,90%);
		color: hsl(242,100%,90%);
		}
	68% {
		fill: hsl(245,100%,90%);
		color: hsl(245,100%,90%);
		}
	69% {
		fill: hsl(249,100%,90%);
		color: hsl(249,100%,90%);
		}
	70% {
		fill: hsl(252,100%,90%);
		color: hsl(252,100%,90%);
		transform: rotate(-1deg) scale(.98);
		}
	71% {
		fill: hsl(256,100%,90%);
		color: hsl(256,100%,90%);
		}
	72% {
		fill: hsl(260,100%,90%);
		color: hsl(260,100%,90%);
		}
	73% {
		fill: hsl(263,100%,90%);
		color: hsl(263,100%,90%);
		}
	74% {
		fill: hsl(267,100%,90%);
		color: hsl(267,100%,90%);
		}
	75% {
		fill: hsl(270,100%,90%);
		color: hsl(270,100%,90%);
		}
	76% {
		fill: hsl(274,100%,90%);
		color: hsl(274,100%,90%);
		}
	77% {
		fill: hsl(278,100%,90%);
		color: hsl(278,100%,90%);
		}
	78% {
		fill: hsl(281,100%,90%);
		color: hsl(281,100%,90%);
		}
	79% {
		fill: hsl(285,100%,90%);
		color: hsl(285,100%,90%);
		}
	80% {
		fill: hsl(288,100%,90%);
		color: hsl(288,100%,90%);
		transform: rotate(0deg) scale(1);
		}
	81% {
		fill: hsl(292,100%,90%);
		color: hsl(292,100%,90%);
		}
	82% {
		fill: hsl(296,100%,90%);
		color: hsl(296,100%,90%);
		}
	83% {
		fill: hsl(299,100%,90%);
		color: hsl(299,100%,90%);
		}
	84% {
		fill: hsl(303,100%,90%);
		color: hsl(303,100%,90%);
		}
	85% {
		fill: hsl(306,100%,90%);
		color: hsl(306,100%,90%);
		}
	86% {
		fill: hsl(310,100%,90%);
		color: hsl(310,100%,90%);
		}
	87% {
		fill: hsl(314,100%,90%);
		color: hsl(314,100%,90%);
		}
	88% {
		fill: hsl(317,100%,90%);
		color: hsl(317,100%,90%);
		}
	89% {
		fill: hsl(321,100%,90%);
		color: hsl(321,100%,90%);
		}
	90% {
		fill: hsl(324,100%,90%);
		color: hsl(324,100%,90%);
		transform: rotate(0deg) scale(.99);
		}
	91% {
		fill: hsl(328,100%,90%);
		color: hsl(328,100%,90%);
		}
	92% {
		fill: hsl(332,100%,90%);
		color: hsl(332,100%,90%);
		}
	93% {
		fill: hsl(335,100%,90%);
		color: hsl(335,100%,90%);
		}
	94% {
		fill: hsl(339,100%,90%);
		color: hsl(339,100%,90%);
		}
	95% {
		fill: hsl(342,100%,90%);
		color: hsl(342,100%,90%);
		}
	96% {
		fill: hsl(346,100%,90%);
		color: hsl(346,100%,90%);
		}
	97% {
		fill: hsl(350,100%,90%);
		color: hsl(350,100%,90%);
		}
	98% {
		fill: hsl(353,100%,90%);
		color: hsl(353,100%,90%);
		}
	99% {
		fill: hsl(357,100%,90%);
		color: hsl(357,100%,90%);
		}
	100% {
		fill: hsl(360,100%,90%);
		color: hsl(360,100%,90%);
		}
	}
@keyframes wobble {
	0%, 10% {
		left: 50%;
		position: relative;
		transform-origin: right center;
		transform: rotate(0deg) scale(1) translateX(-50%);
	}
	40%, 60% {
		left: 50%;
		position: relative;
		transform-origin: center center;
		transform: rotate(-3deg) scale(1) translateX(-50%);
	}
	90%, 100% {
		left: 50%;
		position: relative;
		transform-origin: left center;
		transform: rotate(3deg) scale(.9) translateX(-50%);
	}
}
	
body {
	position: relative;
	z-index: 0;
	margin: 0;
	padding: 0 0 2em;
	background-color: rgb(26,26,26);
	font-size: 2.5vw;
	font-family: "Arvo", sans-serif;
	font-weight: 400;
	color: white;
	
	display: flex;
	flex-flow: column wrap;
	}
@media (max-width: 800px) {
	body {
		font-size: 6vw;
	}
}
	article, section, div {
		z-index: 10;
		position: relative;
		}
	h1, h2, h3, h4, h5, h6 {
		text-align: center;
		font-weight: 700;
		width: 100%;
		flex: none;
		}
		h1 {
			font-weight: 400;
			font-size: 8em;
			line-height: 1em;
			}
	@media (max-width: 800px) {
		h1 {
			font-size: 3em;
		}
	}
	img {
		z-index: 100;
		}
	hr {
		border: none;
		width: 50%;
		height: .1em;
		margin-left: 25%;
		background: linear-gradient(90deg, 
		rgba(255,255,255,0), 
		rgb(255,255,255), 
		rgba(255,255,255,0)
		);
		}
	header {
		position: relative;
		padding-top: 46.98%;
		padding-top: 50%;
		background-image: url("/assets/KRAAHK.png");
		background-size: cover;
		background-position: center top;
		background-repeat: no-repeat;
		animation: color-decision 60s infinite;
		}
		#logo, .logo,
		#logo a:link, #logo a:visited,
		.logo a:link, .logo a:visited {
			position: relative;
			fill: white;
			color: white;
			text-decoration: none;
/* 			transition: .25s fill ease-in-out; */
			}
			h1:hover, h1:hover a {
				animation: be-erratic 1s infinite alternate;
				text-decoration: none;
				}
				
	article {
		position: relative; 
		width: 100%;
		overflow: hidden;
		animation: color-decision 60s infinite;
		box-shadow: inset 100vw 0 50vw -25vw rgba(26,26,26,.95),  inset 50vw 0 25vw -25vw rgba(26,26,26,1);
		}
		article h1, article p {
			position: relative;
			display: inline-block;
			width: calc(100% - 2em);
			left: 1em;
			}
		article > section {
			padding: 1em 2em;
			display: flex;
			flex-flow: row wrap;
			align-content: center;
			align-items: center;
			}
	.top, .bottom {
		height: 3em;
		overflow: hidden;
		z-index: 1000;
		}
		.top::before, .bottom::before {
			display: block;
			position: absolute;
			content: "";
			height: 1.5em;
			width: 100%;
			background: rgb(26,26,26);
			transform: scale(2);
			}
			.top::before {
				bottom: -50%;
				}
			.bottom::before {
				bottom: -50%;
				}
			.top.overlay {
				bottom: -6em;
				margin-top: -6em;
				}
			.bottom.overlay {
				top: -6em;
				margin-bottom: -6em;
				}
		.skew-right, .skew-left {
			transform-origin: center center;
			}
			.skew-right {
				transform: rotate(3deg);
				}
			.skew-left {
				transform: rotate(-3deg);
				}
		.bottom.curves {
			background: url("/assets/bottom-curves.png");
			background-size: 100% 100%;
			height: 6em;
			}
		.top.curves {
			background: url("/assets/bottom-curves.png");
			background-size: 100% 100%;
			height: 6em;
			transform: rotate(180deg);
			}
/*	GAMING */
				
		.handle {
			flex: 1 1 auto;
			display: flex;
			margin: 0 .25em;
			height: 8rem;
/* 			padding: 1em 0; */
			font-size: .5em;
			line-height: 1em;
			text-align: center;
			background: transparent;
			border-radius: 1em;
			will-change: font-size;
			min-width: 25%;
/*
			transition: 
			.1s font-size ease-in;
*/
			}
			@media (max-width: 640pt) {
				.handle {
					height: 4em;
					min-width: 50%;
				}
			}
			.handle:hover {
/* 				padding: .75em 0; */
				font-size: .75em;
				font-weight: 400;
/*
				background: linear-gradient(90deg,
				rgba(26,26,26,0),
				rgba(26,26,26,.5),
				rgba(26,26,26,.75),
				rgba(26,26,26,.75),
				rgba(26,26,26,.5),
				rgba(26,26,26,0)
				);
*/
/* 				background: rgb(26,26,26); */
				border-radius: 3em;
				}
			.handle > * {
				float: left;
				}
			.handle p {
				top: 50%;
				transform: translateY(-50%);
				}
				.handle:hover p {
					margin-top: -1.5em;
					margin-bottom: -1.5em;
					color: black;
/* 					text-transform: uppercase; */
					animation: be-erratic 1s infinite alternate;
					}
				
	.clear {
		clear: both;
		}
		
	.q_3 {
		width: 75%;
		margin-left: 12.5%;
		}
		
		
	.game {
		animation: none;
		box-shadow: none;
		box-shadow: inset 0 -2.5em 10em 2.5em rgb(26,26,26), inset 0 0 10em rgb(26,26,26);
		transition: .125s background ease-in-out;
		}
/*
		#games:hover {
			background: rgb(127,127,127);
			animation: color-decision 6s infinite;
			}
*/
		.game img {
			width: 100%;
			filter: grayscale();
			mix-blend-mode: overlay;
			opacity: .25;
			}
		.game h3 {
			margin-top: -7.5em;
			margin-bottom: 6.5em;
			}
			
	.service, h1#logo {
		font-family: "MAWNSTR";
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
		}
		.service {
			position: relative;
			bottom: -.15em;
			margin-top: -.25em;
			margin-right: .25em;
			font-size: 4em;
			line-height: .25em;
			text-transform: none;
			pointer-events: none;
			}
			.service::after {
				position: absolute;
				top: 2.45em;
				right: -.8em;
				content: ":";
				font-size: .25em;
				font-weight: 700;
				}
				
				
#Verdansk {
	position: relative;
	height: 100vw;
	border-radius: 1em;
	width: calc(100vmin - 2em);
	height: calc(100vmin - 2em);
	width: calc(100vw - 2em);
	height: calc(100vw - 2em);
	left: 50%;
	transform: translateX(-50%);
/* 	margin: 1em; */
}
#Verdansk > * {
	transform: 
	scale(1.75);
	transform-origin: top center;
}
	#Verdansk img {
		position: relative;
		width: 100%;
		mix-blend-mode: screen;
		transition: .2s;
	}
		#Verdansk img + img {
			position: absolute;
			top: 0;
			left: 0;
		}
		#Verdansk > img.translucent {
			opacity: .25;
/* 			mix-blend-mode: normal; */
		}
		#Verdansk > img.sector {
			mix-blend-mode: normal;
		}
	#Verdansk #poi {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		height: 56.25%;
		margin: 0;
		padding: 0;
		display: block;
		list-style: none;
		z-index: 1000;
/* 		opacity: .5; */
	}
		#Verdansk #poi li {
			position: absolute;
			text-shadow: 1pt 1pt black;
			padding: .25em .5em;
			font-size: .5em;
			line-height: 1.2em;
			border: 1px solid white;
			background: black;
			transition: .2s;
		}
		#Verdansk #poi li.access_red {
			background-color: red;
			width: 1.5em;
			height: 1em;
		}
		#Verdansk #poi li.n_a:before {
			content: "";
			position: absolute;
			width: 100%;
			height: 100%;
			margin: -.25em -.5em;
			background: 
			linear-gradient(
				45deg,
				rgba(255,255,255,0) 48%,
				rgba(255,255,255,1) 48%,
				rgba(255,255,255,1) 52%,
				rgba(255,255,255,0) 52%
			), 
			linear-gradient(
				-45deg,
				rgba(255,255,255,0) 48%,
				rgba(255,255,255,1) 48%,
				rgba(255,255,255,1) 52%,
				rgba(255,255,255,0) 52%
			);
		}
		#Verdansk #poi :nth-child(1) {
			top: 62%;
			left: 26%;
		}
		#Verdansk #poi :nth-child(2) {
			top: 73%;
			left: 26%;
		}
		#Verdansk #poi :nth-child(3) {
			top: 86%;
			left: 52%;
		}
		#Verdansk #poi :nth-child(4) {
			top: 91%;
			left: 62%;
		}
		#Verdansk #poi :nth-child(5) {
			top: 66%;
			left: 64%;
		}
		#Verdansk #poi :nth-child(6) {
			top: 44%;
			left: 52%;
		}
		#Verdansk #poi :nth-child(7) {
			top: 92%;
			left: 38%;
		}
		#Verdansk #poi :nth-child(8) {
			top: 23%;
			left: 38%;
		}
		#Verdansk #poi :nth-child(9) {
			top: 25%;
			left: 46%;
		}
		#Verdansk #poi :nth-child(10) {
			top: 30%;
			left: 66%;
		}
		#Verdansk #poi :nth-child(11) {
			top: 86%;
			left: 70%;
		}
		
	#Verdansk:hover .hide-on-hover {
		opacity: 0;
	}
	@media (max-width: 640px) {
		#Verdansk .hide-on-hover {
			display: none;
		}
	}
	#Verdansk:hover ol#poi.show-on-hover {
		opacity: 1;
	}
	#Verdansk:hover ol#poi.show-on-hover li:hover {
		transform: scale(2);
		z-index: 10000;
	}
	.game--group {
		margin: 2em 0;
	}
	.group {
		display: flex;
		list-style: none;
		flex-flow: wrap;
	}
	.group > * {
		flex: 1 1 auto;
		padding: .25em;
		/* text-align: center; */
	}
	.group a:link, .group a:visited {
		background: white;
		color: black;
		padding: .125em .5em;
		border-radius: .25em;
		text-decoration: none;
		transition: .1s background ease-in-out;
	}
	.group a:hover, .group a:active {
		background: rgba(255,255,255,.25);
		animation: color-decision 1s infinite alternate;
	}
	
	.half {
		width: 50%;
		left: -50%;
		transform: translateX(50%);
	}
	.quarter {
		width: 25%;
		left: -100%;
		transform: translateX(100%);
	}
	.centered {
		text-align: center;
	}
	.deemphasize {
		font-weight: 100;
		font-size: .65em;
		opacity: .25;
		pointer-events: none;
	}
	
	svg path.background {
		fill: pink;
		animation: color-decision 60s infinite;
	}
	.game--group svg {
		margin-top: -5em;
		position: relative;
		left: 50%;
		transform: translateX(-50%);
		animation: wobble 10s infinite alternate;
	}
	@media (max-width: 640pt) {
		.game--group svg {
			margin-top: -2em;
		}
	}
	.widescreen {
		display: block;
		width: 100vw;
		height: 56.25vw;
/* 		padding-bottom: 56.25%; */
	}
	#twitch {
		position: relative;
		left: 50%;
		transform: translateX(-50%);
		max-width: 1280px;
		max-height: 720px;
		border-radius: 1rem;
		overflow: hidden;
	}