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.6339372768em 0.5639358929em 7px rgba(255, 147, 0, 0.9), 0.4170258214em 1.8533954444em 7px rgba(186, 0, 255, 0.9), 0.7151177172em 1.755578791em 7px rgba(234, 255, 0, 0.9), -0.4458608921em -0.3662303212em 7px rgba(0, 255, 214, 0.9), 0.7616589431em 2.1039592503em 7px rgba(255, 59, 0, 0.9), -0.449937525em 1.9969537901em 7px rgba(0, 118, 255, 0.9), 0.5151582062em 1.8512755757em 7px rgba(200, 255, 0, 0.9), 2.0344157711em 2.4049371879em 7px rgba(255, 0, 14, 0.9), 1.9240870837em 1.2716157347em 7px rgba(210, 0, 255, 0.9), 2.0970344303em 0.8101495122em 7px rgba(255, 66, 0, 0.9), 0.1157269408em 0.4942660638em 7px rgba(255, 141, 0, 0.9), 0.9152440665em 0.2116641979em 7px rgba(106, 0, 255, 0.9), 1.6287974863em 0.5865683555em 7px rgba(40, 255, 0, 0.9), 2.357521015em -0.1524459261em 7px rgba(0, 53, 255, 0.9), 1.4080348444em 0.5026477593em 7px rgba(192, 0, 255, 0.9), 0.9677494346em 1.2792466138em 7px rgba(0, 137, 255, 0.9), -0.3539544226em -0.3473005629em 7px rgba(255, 165, 0, 0.9), 1.159665682em 2.1708276728em 7px rgba(255, 0, 65, 0.9), -0.4491538742em 1.7181086412em 7px rgba(255, 52, 0, 0.9), -0.3768956371em 0.962186037em 7px rgba(250, 255, 0, 0.9), 1.6975180834em 1.9376874864em 7px rgba(255, 0, 171, 0.9), -0.3921794076em 0.3723218294em 7px rgba(255, 0, 214, 0.9), 1.5325648418em 1.112007608em 7px rgba(0, 255, 58, 0.9), 0.7244848296em 2.254759858em 7px rgba(255, 238, 0, 0.9), 1.226891055em 0.4820482386em 7px rgba(0, 255, 73, 0.9), 0.1004818698em 1.2071365459em 7px rgba(80, 0, 255, 0.9), 1.0003585802em 1.305723059em 7px rgba(5, 255, 0, 0.9), 1.5815013049em 1.5999552032em 7px rgba(255, 120, 0, 0.9), 0.9668886134em 1.8200702699em 7px rgba(129, 255, 0, 0.9), -0.1250579723em 2.1886480227em 7px rgba(255, 109, 0, 0.9), 1.1878996147em 1.0498495212em 7px rgba(0, 255, 199, 0.9), 0.519392362em 0.7245622689em 7px rgba(255, 223, 0, 0.9), 0.4574363631em 2.18496045em 7px rgba(0, 203, 255, 0.9), 1.8106796712em 2.2046089181em 7px rgba(255, 33, 0, 0.9), 0.7122814118em 2.0096792124em 7px rgba(255, 0, 110, 0.9), -0.2428572724em 1.0069946548em 7px rgba(0, 255, 8, 0.9), 1.1834635794em -0.3115652376em 7px rgba(0, 57, 255, 0.9), 2.2900968926em 2.2788334966em 7px rgba(145, 255, 0, 0.9), 0.1821611814em 0.7145483651em 7px rgba(0, 255, 121, 0.9), 0.9074721795em 1.4211013425em 7px rgba(255, 85, 0, 0.9), 0.7701167191em 1.0171149569em 7px rgba(255, 0, 110, 0.9);
  animation-duration: 44s;
  animation-delay: -27s;
}

body::after {
  text-shadow: 1.0710135685em 0.0442112294em 7px rgba(255, 64, 0, 0.9), 1.0221556348em -0.0677181412em 7px rgba(11, 0, 255, 0.9), -0.2093152171em 1.591189274em 7px rgba(0, 255, 120, 0.9), 0.095198958em 2.0455495752em 7px rgba(255, 0, 134, 0.9), 1.5578120787em 0.9937966673em 7px rgba(255, 0, 104, 0.9), 0.4683421005em 1.7465109877em 7px rgba(47, 255, 0, 0.9), 1.2996851513em -0.3062662718em 7px rgba(255, 52, 0, 0.9), 0.9304440201em 1.0266046314em 7px rgba(255, 0, 87, 0.9), 0.3964143684em 1.0389386094em 7px rgba(235, 0, 255, 0.9), 1.1045939396em 0.9289955361em 7px rgba(145, 255, 0, 0.9), 1.5689302612em 1.8247268277em 7px rgba(0, 2, 255, 0.9), 0.6117724891em 1.5468088455em 7px rgba(255, 57, 0, 0.9), -0.4158932119em 2.0029808961em 7px rgba(255, 101, 0, 0.9), 2.0723075104em 1.4501803255em 7px rgba(107, 255, 0, 0.9), 1.8612702514em 1.6137735524em 7px rgba(255, 132, 0, 0.9), 0.7928414812em 2.1097627826em 7px rgba(0, 205, 255, 0.9), 1.6520750094em -0.0557950371em 7px rgba(235, 255, 0, 0.9), -0.3526204721em 0.3821994352em 7px rgba(96, 255, 0, 0.9), 2.0635694853em 0.5896927465em 7px rgba(255, 118, 0, 0.9), 1.3804788355em 0.1145654428em 7px rgba(10, 255, 0, 0.9), 1.4040571829em 0.2268471044em 7px rgba(0, 219, 255, 0.9), 0.6251158211em 0.3934061515em 7px rgba(109, 0, 255, 0.9), 0.1895450792em 2.4566960853em 7px rgba(255, 0, 70, 0.9), 1.3364386251em 0.8560895109em 7px rgba(255, 0, 185, 0.9), -0.3178845831em 1.1998125904em 7px rgba(0, 255, 243, 0.9), 1.6193783373em 2.285274203em 7px rgba(0, 201, 255, 0.9), 0.8235128209em 0.8220141658em 7px rgba(255, 199, 0, 0.9), 1.0541616078em 2.4413176913em 7px rgba(255, 0, 158, 0.9), 1.745652185em -0.3952417409em 7px rgba(112, 0, 255, 0.9), 1.6350433878em 2.4147075247em 7px rgba(0, 255, 61, 0.9), 0.3372286116em 1.815738749em 7px rgba(255, 194, 0, 0.9), 2.4188961194em 1.5719033432em 7px rgba(255, 0, 240, 0.9), 0.2113126604em 2.0502451176em 7px rgba(27, 255, 0, 0.9), 2.4379302686em -0.242459029em 7px rgba(255, 0, 151, 0.9), -0.1413707987em 1.378790979em 7px rgba(0, 255, 84, 0.9), 1.9229499296em 1.3824794474em 7px rgba(0, 255, 121, 0.9), 2.0460010994em 1.8841327963em 7px rgba(0, 127, 255, 0.9), 0.5049296784em 0.0926948591em 7px rgba(0, 255, 119, 0.9), 2.0197338639em -0.3633944836em 7px rgba(149, 255, 0, 0.9), 2.3026118926em 0.5956725676em 7px rgba(255, 0, 25, 0.9), -0.0713195174em 1.8003611943em 7px rgba(137, 0, 255, 0.9);
  animation-duration: 43s;
  animation-delay: -32s;
}

head::before {
  text-shadow: 2.3332324434em 0.9245499509em 7px rgba(0, 148, 255, 0.9), 0.0261617068em 0.9463564545em 7px rgba(0, 128, 255, 0.9), -0.4522441929em 1.6734601822em 7px rgba(0, 255, 181, 0.9), 2.0817985849em -0.3013188555em 7px rgba(201, 255, 0, 0.9), 0.6719298167em 2.1373595167em 7px rgba(0, 255, 51, 0.9), 1.4679958008em 1.0393070486em 7px rgba(255, 3, 0, 0.9), 1.6677521111em 1.4460460375em 7px rgba(80, 0, 255, 0.9), 1.0864821432em 1.4794718952em 7px rgba(255, 0, 201, 0.9), -0.115927218em 2.1350440213em 7px rgba(0, 255, 187, 0.9), 0.3870619088em 1.4411005748em 7px rgba(255, 0, 235, 0.9), 1.1088558272em 1.9020618011em 7px rgba(246, 255, 0, 0.9), -0.1251302576em 0.7361802016em 7px rgba(0, 47, 255, 0.9), 2.3343429189em -0.2665593908em 7px rgba(250, 255, 0, 0.9), 0.362227003em 0.6935504783em 7px rgba(37, 0, 255, 0.9), 1.5435222918em 0.5588814982em 7px rgba(255, 113, 0, 0.9), -0.105466219em 2.3645390671em 7px rgba(255, 157, 0, 0.9), 1.3102401928em 1.1067429909em 7px rgba(0, 52, 255, 0.9), 0.9154400754em 1.2648010176em 7px rgba(0, 49, 255, 0.9), -0.1567701711em 0.2401968838em 7px rgba(138, 255, 0, 0.9), 1.3220165741em 0.5871629625em 7px rgba(255, 214, 0, 0.9), 1.2947418329em -0.3692502876em 7px rgba(0, 255, 252, 0.9), 1.1311603779em 0.6617182226em 7px rgba(0, 255, 124, 0.9), 0.7668485861em 1.3651275389em 7px rgba(0, 150, 255, 0.9), 1.3387549775em 1.1712767538em 7px rgba(78, 0, 255, 0.9), 0.8197749691em 2.3334481291em 7px rgba(0, 255, 6, 0.9), 1.5301625877em -0.4471229317em 7px rgba(0, 87, 255, 0.9), 1.1414701033em -0.4806802026em 7px rgba(255, 0, 143, 0.9), 1.8383345056em 0.1255855936em 7px rgba(255, 0, 234, 0.9), 0.1487333256em 0.4001631635em 7px rgba(0, 18, 255, 0.9), 1.1877297695em 0.0377235781em 7px rgba(0, 255, 180, 0.9), 2.3406409057em -0.2210271635em 7px rgba(0, 255, 97, 0.9), 1.1493192895em 2.379421155em 7px rgba(0, 69, 255, 0.9), 1.1009833397em 1.6603119386em 7px rgba(255, 45, 0, 0.9), 2.3942495415em 0.1925058809em 7px rgba(255, 44, 0, 0.9), 0.5493321649em 0.1845849967em 7px rgba(151, 0, 255, 0.9), 0.2748961684em 1.5561553891em 7px rgba(0, 224, 255, 0.9), 0.1675346159em 1.8287061985em 7px rgba(237, 255, 0, 0.9), 1.7467564336em 2.1318848542em 7px rgba(255, 0, 176, 0.9), 1.1013183147em 0.7414486461em 7px rgba(166, 255, 0, 0.9), 0.8566202424em 0.5214546138em 7px rgba(0, 255, 73, 0.9), 2.2652408592em 1.6972753508em 7px rgba(8, 255, 0, 0.9);
  animation-duration: 42s;
  animation-delay: -23s;
}

head::after {
  text-shadow: 2.289806894em 1.337194191em 7px rgba(255, 252, 0, 0.9), 0.6868430949em 1.4671739014em 7px rgba(251, 0, 255, 0.9), -0.0266382613em 1.4054399855em 7px rgba(0, 255, 145, 0.9), 1.4880109074em 1.9980407001em 7px rgba(0, 193, 255, 0.9), -0.3288785267em 1.6600684774em 7px rgba(255, 29, 0, 0.9), 1.836975986em -0.2029203694em 7px rgba(187, 0, 255, 0.9), 2.2287457778em 2.2429752804em 7px rgba(89, 255, 0, 0.9), 1.4034164149em 2.3921809462em 7px rgba(0, 41, 255, 0.9), 1.0597860149em 0.3115189275em 7px rgba(255, 117, 0, 0.9), -0.0881133821em 2.0190269589em 7px rgba(255, 0, 187, 0.9), 0.2055987266em 1.9341976911em 7px rgba(86, 0, 255, 0.9), 0.8583811586em 1.8997602572em 7px rgba(255, 136, 0, 0.9), -0.4546626296em 0.0463475732em 7px rgba(207, 0, 255, 0.9), 0.2126060264em 2.0709399584em 7px rgba(255, 92, 0, 0.9), -0.0163011588em 1.4701993067em 7px rgba(255, 2, 0, 0.9), 1.222988927em 2.2060275528em 7px rgba(255, 7, 0, 0.9), 2.0534258757em 1.706741831em 7px rgba(0, 255, 19, 0.9), 1.0866923528em -0.1741242043em 7px rgba(217, 255, 0, 0.9), 1.2211430261em 1.987058807em 7px rgba(255, 0, 210, 0.9), 1.4766698931em 0.5102837564em 7px rgba(226, 0, 255, 0.9), 2.0990660276em -0.4186664656em 7px rgba(255, 239, 0, 0.9), -0.2032585559em 1.8903342411em 7px rgba(62, 255, 0, 0.9), -0.3190325878em -0.0403121515em 7px rgba(21, 255, 0, 0.9), 2.1190110429em 1.8881789224em 7px rgba(255, 0, 29, 0.9), 1.182968407em 1.9289736989em 7px rgba(0, 200, 255, 0.9), 2.2366151883em 1.2611262671em 7px rgba(255, 144, 0, 0.9), 2.1712786299em 1.9875186155em 7px rgba(0, 3, 255, 0.9), 1.5285070512em 0.3698218945em 7px rgba(0, 235, 255, 0.9), 0.396277852em 2.4419985547em 7px rgba(255, 0, 225, 0.9), 0.8673952824em 1.5324496082em 7px rgba(0, 255, 246, 0.9), 2.1765571416em 1.3681660967em 7px rgba(255, 148, 0, 0.9), 0.8170987252em 0.3075591943em 7px rgba(23, 255, 0, 0.9), 2.161276327em 2.0512140103em 7px rgba(255, 60, 0, 0.9), 1.5936681195em 0.5198883444em 7px rgba(242, 255, 0, 0.9), -0.2113834422em 2.3160486578em 7px rgba(255, 156, 0, 0.9), 1.3060813329em 1.4979292745em 7px rgba(255, 45, 0, 0.9), 1.7902661915em 2.4765300356em 7px rgba(158, 255, 0, 0.9), 0.8106777642em 2.1603961153em 7px rgba(255, 105, 0, 0.9), 2.1354778071em 0.0930910463em 7px rgba(233, 255, 0, 0.9), 1.7188619247em -0.420318871em 7px rgba(255, 0, 211, 0.9), 1.4711566376em 2.2569581118em 7px rgba(131, 255, 0, 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);
  }
}

p {
  color: #fff;
  font-size: 46px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}