html {
  font: 5vmin/1.3 Serif;
  overflow: hidden;
  background: #123;
}

body, head {
  display: block;
  font-size: 52px;
  color: transparent;
}

head::before, head::after,
body::before, body::after {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 3em;
  height: 3em;
  content: ".";
  mix-blend-mode: screen;
  animation: 44s -27s move infinite ease-in-out alternate;
}

body::before {
  text-shadow: 0.3957281347em 1.5552253254em 7px rgba(0, 102, 255, 0.9), -0.3508994954em 0.6872565527em 7px rgba(121, 255, 0, 0.9), 0.1930903636em 0.2783900094em 7px rgba(255, 56, 0, 0.9), 2.0233806171em -0.3770840778em 7px rgba(0, 67, 255, 0.9), 2.3392886174em 0.9897915377em 7px rgba(126, 0, 255, 0.9), 1.0288302642em -0.4899355513em 7px rgba(255, 0, 85, 0.9), -0.353339675em 2.027475655em 7px rgba(0, 220, 255, 0.9), 1.8205827165em 2.3785237239em 7px rgba(99, 0, 255, 0.9), -0.2762406944em 2.1401846238em 7px rgba(39, 255, 0, 0.9), 1.9499946219em 2.2614738182em 7px rgba(0, 71, 255, 0.9), 1.894646187em 0.6084747489em 7px rgba(255, 168, 0, 0.9), 1.4813073589em 1.6501467262em 7px rgba(255, 80, 0, 0.9), 1.0721693879em 1.3275360102em 7px rgba(0, 255, 111, 0.9), 1.8218700504em -0.4869063037em 7px rgba(0, 42, 255, 0.9), -0.0283923597em 0.2299262441em 7px rgba(255, 189, 0, 0.9), 1.1751481358em 1.2784708831em 7px rgba(255, 66, 0, 0.9), 1.8678835652em 1.847455753em 7px rgba(12, 0, 255, 0.9), 1.3803947334em 2.4629204051em 7px rgba(255, 0, 245, 0.9), 0.9999057039em 1.5494172657em 7px rgba(85, 0, 255, 0.9), 0.3163872935em 0.1142479608em 7px rgba(0, 18, 255, 0.9), 1.7996077572em 0.1531283838em 7px rgba(218, 255, 0, 0.9), 2.0560578815em 0.4814266171em 7px rgba(255, 0, 198, 0.9), 2.15966431em 1.8725519045em 7px rgba(66, 255, 0, 0.9), 0.1490708767em 1.4790006289em 7px rgba(0, 155, 255, 0.9), -0.0051488622em 0.7369671438em 7px rgba(255, 0, 58, 0.9), 1.6453202341em 0.0969533152em 7px rgba(59, 0, 255, 0.9), 0.4769738324em -0.2127894168em 7px rgba(18, 0, 255, 0.9), 1.2395792473em 1.2770438247em 7px rgba(255, 0, 31, 0.9), 0.1437059727em 0.2226482428em 7px rgba(7, 0, 255, 0.9), 2.3007274169em 1.126837663em 7px rgba(0, 103, 255, 0.9), 0.8674854288em 0.5272766572em 7px rgba(0, 121, 255, 0.9), 2.4336413349em 1.0961969434em 7px rgba(0, 255, 1, 0.9), -0.163277714em 2.4364007837em 7px rgba(255, 217, 0, 0.9), 0.2297635832em 0.4266890284em 7px rgba(0, 255, 225, 0.9), 0.5426216456em 2.0386189149em 7px rgba(0, 255, 162, 0.9), 0.6965752153em 1.2349455987em 7px rgba(0, 255, 253, 0.9), 0.0019030889em 1.9300193557em 7px rgba(255, 106, 0, 0.9), 1.4080954142em 0.8223961943em 7px rgba(255, 0, 39, 0.9), 0.266403598em 1.2635274583em 7px rgba(117, 255, 0, 0.9), 1.8997674366em -0.2853411597em 7px rgba(36, 0, 255, 0.9), 1.3626443987em 2.2805197579em 7px rgba(213, 0, 255, 0.9);
  animation-duration: 44s;
  animation-delay: -27s;
}

body::after {
  text-shadow: 1.8527892156em 1.0420731065em 7px rgba(112, 0, 255, 0.9), 0.4234882969em 1.4912438462em 7px rgba(0, 255, 216, 0.9), 2.3658195046em 0.5805031607em 7px rgba(255, 0, 182, 0.9), 0.6307770728em 2.2703147272em 7px rgba(107, 255, 0, 0.9), -0.1365901154em 1.620894161em 7px rgba(0, 255, 76, 0.9), 0.0456596507em 0.082762297em 7px rgba(255, 55, 0, 0.9), 1.5438141548em 1.0380763325em 7px rgba(255, 0, 9, 0.9), -0.2109753854em 1.0863729886em 7px rgba(255, 99, 0, 0.9), 0.2949416024em 1.9705138825em 7px rgba(255, 0, 230, 0.9), 2.2172107425em 1.4358763482em 7px rgba(150, 255, 0, 0.9), -0.1512311035em 0.6148120742em 7px rgba(255, 92, 0, 0.9), 0.1472875162em 1.5411659196em 7px rgba(46, 255, 0, 0.9), -0.3215294155em 1.7757121931em 7px rgba(255, 101, 0, 0.9), 1.1043827599em 2.450249454em 7px rgba(255, 15, 0, 0.9), 0.5029128821em 0.7929088678em 7px rgba(255, 0, 140, 0.9), 1.4690315185em 0.9206378074em 7px rgba(227, 255, 0, 0.9), 1.6244600607em 1.4706183179em 7px rgba(0, 136, 255, 0.9), 1.2233552907em 1.2682289789em 7px rgba(255, 218, 0, 0.9), 2.3899397622em 0.1543130508em 7px rgba(1, 0, 255, 0.9), 1.9839320093em -0.3465714024em 7px rgba(255, 225, 0, 0.9), 0.6315350347em 0.5725160073em 7px rgba(255, 0, 183, 0.9), 1.0170946953em 1.1219539341em 7px rgba(56, 255, 0, 0.9), -0.2729424868em 1.7779817361em 7px rgba(0, 195, 255, 0.9), 0.3865677171em 2.0478210795em 7px rgba(255, 107, 0, 0.9), 1.786056058em 0.8885090268em 7px rgba(255, 0, 109, 0.9), -0.1554471755em -0.3330571671em 7px rgba(0, 255, 82, 0.9), 0.0104262624em 0.8517236353em 7px rgba(54, 0, 255, 0.9), 0.4555157071em 0.4430670846em 7px rgba(255, 0, 134, 0.9), 1.2355938597em 0.7242875403em 7px rgba(0, 241, 255, 0.9), 0.3883432028em -0.4212657894em 7px rgba(244, 0, 255, 0.9), 1.2221320671em 1.2800944463em 7px rgba(255, 137, 0, 0.9), 1.5609250724em -0.2287715625em 7px rgba(7, 255, 0, 0.9), 0.4743257336em 1.9736315098em 7px rgba(255, 0, 15, 0.9), -0.2767002916em 1.7042391261em 7px rgba(0, 255, 186, 0.9), 1.8584270494em 0.0730316235em 7px rgba(121, 255, 0, 0.9), 0.969691771em 0.6473887082em 7px rgba(255, 0, 14, 0.9), -0.0209150176em 1.911633526em 7px rgba(255, 0, 250, 0.9), 0.1929523213em 0.4230456259em 7px rgba(0, 18, 255, 0.9), 1.4344035261em 2.207747184em 7px rgba(0, 255, 10, 0.9), 2.4222943606em 0.3461621659em 7px rgba(255, 0, 68, 0.9), 0.3368195237em 0.3891587149em 7px rgba(0, 255, 19, 0.9);
  animation-duration: 43s;
  animation-delay: -32s;
}

head::before {
  text-shadow: 2.0212992934em 0.7248859821em 7px rgba(0, 255, 63, 0.9), 2.4767820072em 1.2330078585em 7px rgba(255, 33, 0, 0.9), 1.6877327583em 1.7700934984em 7px rgba(255, 0, 237, 0.9), 1.7833580454em -0.0116522791em 7px rgba(24, 0, 255, 0.9), 0.0755483071em 1.8845382921em 7px rgba(147, 0, 255, 0.9), -0.39647138em 0.3312986681em 7px rgba(0, 255, 118, 0.9), -0.1265641969em 1.41834265em 7px rgba(0, 8, 255, 0.9), -0.0754187645em -0.4145499922em 7px rgba(255, 147, 0, 0.9), 0.076295203em 0.9813548362em 7px rgba(101, 255, 0, 0.9), 2.3016234037em -0.0601700932em 7px rgba(0, 255, 110, 0.9), -0.1265576958em 2.2046432327em 7px rgba(167, 255, 0, 0.9), 1.3324802868em 0.0214559568em 7px rgba(0, 97, 255, 0.9), 1.326626994em 1.3937291953em 7px rgba(0, 255, 86, 0.9), -0.2561182358em 1.7046069363em 7px rgba(255, 223, 0, 0.9), -0.2946327205em 2.3869058228em 7px rgba(115, 255, 0, 0.9), 0.8126443985em 1.4423200818em 7px rgba(255, 194, 0, 0.9), -0.0750606187em -0.4180102309em 7px rgba(0, 255, 236, 0.9), 1.3236610466em 1.8267659421em 7px rgba(255, 6, 0, 0.9), 0.141673782em 0.6927888375em 7px rgba(255, 0, 224, 0.9), 2.3516968371em 0.5136327138em 7px rgba(157, 255, 0, 0.9), 1.6276028804em 2.4852587382em 7px rgba(0, 26, 255, 0.9), -0.3398809433em 1.7268464871em 7px rgba(255, 0, 213, 0.9), 1.3751955364em 0.5400873935em 7px rgba(0, 255, 29, 0.9), 0.6803702354em 1.1842926831em 7px rgba(194, 255, 0, 0.9), 1.5750895884em -0.0726755983em 7px rgba(255, 0, 132, 0.9), 1.4795415626em 0.756366431em 7px rgba(0, 255, 20, 0.9), 1.7655117328em 0.2485657866em 7px rgba(0, 255, 26, 0.9), 1.4428372731em 1.4290512851em 7px rgba(16, 255, 0, 0.9), -0.0713376441em 0.5181633693em 7px rgba(182, 0, 255, 0.9), 0.8820907763em 1.4744863798em 7px rgba(0, 225, 255, 0.9), 0.3423164199em 1.9936325883em 7px rgba(255, 234, 0, 0.9), 2.142061021em 2.1123850691em 7px rgba(0, 244, 255, 0.9), 0.3258139249em 2.1691155943em 7px rgba(0, 219, 255, 0.9), 1.5856859404em 1.0967580919em 7px rgba(0, 152, 255, 0.9), 1.2677350859em 1.1641996641em 7px rgba(0, 109, 255, 0.9), -0.4885962886em 1.7374133409em 7px rgba(207, 255, 0, 0.9), 2.4507490874em 2.0594693688em 7px rgba(0, 225, 255, 0.9), -0.0148418658em 0.5818908016em 7px rgba(0, 137, 255, 0.9), 0.5058886776em 1.2207401983em 7px rgba(117, 255, 0, 0.9), 0.8897285389em 1.5973417242em 7px rgba(82, 255, 0, 0.9), 0.5546913213em 1.1804366973em 7px rgba(255, 0, 46, 0.9);
  animation-duration: 42s;
  animation-delay: -23s;
}

head::after {
  text-shadow: 0.9633996356em 1.2665259102em 7px rgba(19, 0, 255, 0.9), 2.4981252319em 2.1934348529em 7px rgba(164, 255, 0, 0.9), 1.2774574621em 0.9922715963em 7px rgba(255, 0, 133, 0.9), 0.5490097321em 0.743708796em 7px rgba(255, 0, 85, 0.9), 1.6896049249em 1.2867112724em 7px rgba(255, 227, 0, 0.9), 1.472938568em 1.1825107366em 7px rgba(196, 255, 0, 0.9), 0.4208052013em 0.2339983946em 7px rgba(0, 255, 80, 0.9), 0.4739254924em -0.1672837094em 7px rgba(255, 0, 221, 0.9), 0.8359456201em 1.6938113251em 7px rgba(0, 255, 99, 0.9), 1.5707474106em 2.1888162571em 7px rgba(255, 15, 0, 0.9), 0.908485755em 1.3503819359em 7px rgba(0, 183, 255, 0.9), -0.2993646847em 2.0713670046em 7px rgba(162, 255, 0, 0.9), 0.3586579526em 0.2991699752em 7px rgba(231, 0, 255, 0.9), 0.4621847761em 1.0007860708em 7px rgba(252, 0, 255, 0.9), 2.3745808475em 1.2254788988em 7px rgba(164, 0, 255, 0.9), 2.3911815783em -0.2257140319em 7px rgba(104, 0, 255, 0.9), -0.4086222621em 0.8050766577em 7px rgba(163, 0, 255, 0.9), 2.3710452446em 1.2856683711em 7px rgba(0, 247, 255, 0.9), 2.0473048992em 0.7995578819em 7px rgba(0, 255, 183, 0.9), 1.9742558499em 1.1128881557em 7px rgba(0, 41, 255, 0.9), 0.5686122569em 0.8128209834em 7px rgba(0, 56, 255, 0.9), 1.311359869em 0.0602963251em 7px rgba(245, 255, 0, 0.9), -0.0827122479em 2.0805546623em 7px rgba(255, 0, 189, 0.9), 2.0455207454em 0.7400740319em 7px rgba(255, 0, 121, 0.9), 0.5643101382em 1.5608095361em 7px rgba(69, 0, 255, 0.9), 0.9214325112em -0.0711183833em 7px rgba(222, 0, 255, 0.9), 0.6683550597em -0.1489440101em 7px rgba(0, 255, 149, 0.9), 0.0149592203em 1.2318007365em 7px rgba(0, 249, 255, 0.9), -0.2786501644em 0.3051854996em 7px rgba(0, 255, 117, 0.9), 2.4262838967em 2.4067268652em 7px rgba(0, 66, 255, 0.9), -0.4448050068em 0.625441306em 7px rgba(0, 185, 255, 0.9), 0.4179315501em 2.0071208701em 7px rgba(0, 255, 113, 0.9), 1.2826902202em 0.3256639404em 7px rgba(255, 48, 0, 0.9), 1.135014101em -0.0918873492em 7px rgba(255, 34, 0, 0.9), 1.1286747343em 0.1349731963em 7px rgba(0, 255, 174, 0.9), 1.8324834751em 2.0681212297em 7px rgba(23, 255, 0, 0.9), 1.01538159em 0.6382682412em 7px rgba(255, 137, 0, 0.9), 0.4142825219em -0.2260158142em 7px rgba(26, 255, 0, 0.9), 0.3727940515em 0.9447605784em 7px rgba(255, 0, 28, 0.9), 1.907288421em 0.1145030293em 7px rgba(234, 0, 255, 0.9), 2.2055342245em 0.0979484377em 7px rgba(255, 0, 45, 0.9);
  animation-duration: 41s;
  animation-delay: -19s;
}

@keyframes move {
  from {
    transform: rotate(0deg) scale(12) translateX(-20px);
  }
  to {
    transform: rotate(360deg) scale(18) translateX(20px);
  }
}