Spinning Letter Illusion

Developer
Jon Kantner
Size
7,778 Kb
Views
26,312
  1. Spinning Letter Illusion Previews
  2. Spinning Letter Illusion HTML Codes
  3. Spinning Letter Illusion CSS Codes

How do I make an spinning letter illusion?

A demo based on a GIF I found on iFunny where someone uses a record player to animate circular patterns on cards. While this patterns rotates at the proper RPM (rotate(66turn) for 60s = 66 RPM), it’ll look like the rings of letters are rotating at different speeds in different directions!. What is a spinning letter illusion? How do you make a spinning letter illusion? This script and codes were developed by Jon Kantner on 21 August 2022, Sunday.

Spinning Letter Illusion Previews
IQ Test

Spinning Letter Illusion - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Spinning Letter Illusion</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel='stylesheet prefetch' href='https://fonts.googleapis.com/css?family=Rubik+Mono+One'> <link rel="stylesheet" href="css/style.css">
</head>
<body>
<div class="disc"> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _1">r</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _2">e</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _3">v</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _4">o</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _5">l</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _6">u</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _7">t</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _8">i</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _9">o</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _10">n</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div> <div class="sector _11">s</div>
</div>
</body>
</html>

Spinning Letter Illusion - Script Codes CSS Codes

body { background: #000; display: flex; font-family: "Rubik Mono One", sans-serif; flex-direction: column; justify-content: center; align-items: center; margin: 0; overflow: hidden; height: 100vh;
}
.disc { animation: spin 60s linear infinite; position: relative; width: 480px; height: 480px;
}
.sector { margin: auto; position: absolute; width: 50%; text-transform: uppercase; transform-origin: 100% 50%;
}
/* Sector levels */
._1 { color: #4d6ddf; font-size: 22px; line-height: 22px; text-indent: 0px; height: 10%; top: 45%;
}
._1:nth-of-type(1) { transform: rotate(0deg);
}
._1:nth-of-type(2) { transform: rotate(6.10169deg);
}
._1:nth-of-type(3) { transform: rotate(12.20339deg);
}
._1:nth-of-type(4) { transform: rotate(18.30508deg);
}
._1:nth-of-type(5) { transform: rotate(24.40678deg);
}
._1:nth-of-type(6) { transform: rotate(30.50847deg);
}
._1:nth-of-type(7) { transform: rotate(36.61017deg);
}
._1:nth-of-type(8) { transform: rotate(42.71186deg);
}
._1:nth-of-type(9) { transform: rotate(48.81356deg);
}
._1:nth-of-type(10) { transform: rotate(54.91525deg);
}
._1:nth-of-type(11) { transform: rotate(61.01695deg);
}
._1:nth-of-type(12) { transform: rotate(67.11864deg);
}
._1:nth-of-type(13) { transform: rotate(73.22034deg);
}
._1:nth-of-type(14) { transform: rotate(79.32203deg);
}
._1:nth-of-type(15) { transform: rotate(85.42373deg);
}
._1:nth-of-type(16) { transform: rotate(91.52542deg);
}
._1:nth-of-type(17) { transform: rotate(97.62712deg);
}
._1:nth-of-type(18) { transform: rotate(103.72881deg);
}
._1:nth-of-type(19) { transform: rotate(109.83051deg);
}
._1:nth-of-type(20) { transform: rotate(115.9322deg);
}
._1:nth-of-type(21) { transform: rotate(122.0339deg);
}
._1:nth-of-type(22) { transform: rotate(128.13559deg);
}
._1:nth-of-type(23) { transform: rotate(134.23729deg);
}
._1:nth-of-type(24) { transform: rotate(140.33898deg);
}
._1:nth-of-type(25) { transform: rotate(146.44068deg);
}
._1:nth-of-type(26) { transform: rotate(152.54237deg);
}
._1:nth-of-type(27) { transform: rotate(158.64407deg);
}
._1:nth-of-type(28) { transform: rotate(164.74576deg);
}
._1:nth-of-type(29) { transform: rotate(170.84746deg);
}
._1:nth-of-type(30) { transform: rotate(176.94915deg);
}
._1:nth-of-type(31) { transform: rotate(183.05085deg);
}
._1:nth-of-type(32) { transform: rotate(189.15254deg);
}
._1:nth-of-type(33) { transform: rotate(195.25424deg);
}
._1:nth-of-type(34) { transform: rotate(201.35593deg);
}
._1:nth-of-type(35) { transform: rotate(207.45763deg);
}
._1:nth-of-type(36) { transform: rotate(213.55932deg);
}
._1:nth-of-type(37) { transform: rotate(219.66102deg);
}
._1:nth-of-type(38) { transform: rotate(225.76271deg);
}
._1:nth-of-type(39) { transform: rotate(231.86441deg);
}
._1:nth-of-type(40) { transform: rotate(237.9661deg);
}
._1:nth-of-type(41) { transform: rotate(244.0678deg);
}
._1:nth-of-type(42) { transform: rotate(250.16949deg);
}
._1:nth-of-type(43) { transform: rotate(256.27119deg);
}
._1:nth-of-type(44) { transform: rotate(262.37288deg);
}
._1:nth-of-type(45) { transform: rotate(268.47458deg);
}
._1:nth-of-type(46) { transform: rotate(274.57627deg);
}
._1:nth-of-type(47) { transform: rotate(280.67797deg);
}
._1:nth-of-type(48) { transform: rotate(286.77966deg);
}
._1:nth-of-type(49) { transform: rotate(292.88136deg);
}
._1:nth-of-type(50) { transform: rotate(298.98305deg);
}
._1:nth-of-type(51) { transform: rotate(305.08475deg);
}
._1:nth-of-type(52) { transform: rotate(311.18644deg);
}
._1:nth-of-type(53) { transform: rotate(317.28814deg);
}
._1:nth-of-type(54) { transform: rotate(323.38983deg);
}
._1:nth-of-type(55) { transform: rotate(329.49153deg);
}
._1:nth-of-type(56) { transform: rotate(335.59322deg);
}
._1:nth-of-type(57) { transform: rotate(341.69492deg);
}
._1:nth-of-type(58) { transform: rotate(347.79661deg);
}
._1:nth-of-type(59) { transform: rotate(353.89831deg);
}
._2 { color: #a5aff3; font-size: 21px; line-height: 21px; text-indent: 20px; height: 9%; top: 45.5%;
}
._2:nth-of-type(60) { transform: rotate(0deg);
}
._2:nth-of-type(61) { transform: rotate(6.2069deg);
}
._2:nth-of-type(62) { transform: rotate(12.41379deg);
}
._2:nth-of-type(63) { transform: rotate(18.62069deg);
}
._2:nth-of-type(64) { transform: rotate(24.82759deg);
}
._2:nth-of-type(65) { transform: rotate(31.03448deg);
}
._2:nth-of-type(66) { transform: rotate(37.24138deg);
}
._2:nth-of-type(67) { transform: rotate(43.44828deg);
}
._2:nth-of-type(68) { transform: rotate(49.65517deg);
}
._2:nth-of-type(69) { transform: rotate(55.86207deg);
}
._2:nth-of-type(70) { transform: rotate(62.06897deg);
}
._2:nth-of-type(71) { transform: rotate(68.27586deg);
}
._2:nth-of-type(72) { transform: rotate(74.48276deg);
}
._2:nth-of-type(73) { transform: rotate(80.68966deg);
}
._2:nth-of-type(74) { transform: rotate(86.89655deg);
}
._2:nth-of-type(75) { transform: rotate(93.10345deg);
}
._2:nth-of-type(76) { transform: rotate(99.31034deg);
}
._2:nth-of-type(77) { transform: rotate(105.51724deg);
}
._2:nth-of-type(78) { transform: rotate(111.72414deg);
}
._2:nth-of-type(79) { transform: rotate(117.93103deg);
}
._2:nth-of-type(80) { transform: rotate(124.13793deg);
}
._2:nth-of-type(81) { transform: rotate(130.34483deg);
}
._2:nth-of-type(82) { transform: rotate(136.55172deg);
}
._2:nth-of-type(83) { transform: rotate(142.75862deg);
}
._2:nth-of-type(84) { transform: rotate(148.96552deg);
}
._2:nth-of-type(85) { transform: rotate(155.17241deg);
}
._2:nth-of-type(86) { transform: rotate(161.37931deg);
}
._2:nth-of-type(87) { transform: rotate(167.58621deg);
}
._2:nth-of-type(88) { transform: rotate(173.7931deg);
}
._2:nth-of-type(89) { transform: rotate(180deg);
}
._2:nth-of-type(90) { transform: rotate(186.2069deg);
}
._2:nth-of-type(91) { transform: rotate(192.41379deg);
}
._2:nth-of-type(92) { transform: rotate(198.62069deg);
}
._2:nth-of-type(93) { transform: rotate(204.82759deg);
}
._2:nth-of-type(94) { transform: rotate(211.03448deg);
}
._2:nth-of-type(95) { transform: rotate(217.24138deg);
}
._2:nth-of-type(96) { transform: rotate(223.44828deg);
}
._2:nth-of-type(97) { transform: rotate(229.65517deg);
}
._2:nth-of-type(98) { transform: rotate(235.86207deg);
}
._2:nth-of-type(99) { transform: rotate(242.06897deg);
}
._2:nth-of-type(100) { transform: rotate(248.27586deg);
}
._2:nth-of-type(101) { transform: rotate(254.48276deg);
}
._2:nth-of-type(102) { transform: rotate(260.68966deg);
}
._2:nth-of-type(103) { transform: rotate(266.89655deg);
}
._2:nth-of-type(104) { transform: rotate(273.10345deg);
}
._2:nth-of-type(105) { transform: rotate(279.31034deg);
}
._2:nth-of-type(106) { transform: rotate(285.51724deg);
}
._2:nth-of-type(107) { transform: rotate(291.72414deg);
}
._2:nth-of-type(108) { transform: rotate(297.93103deg);
}
._2:nth-of-type(109) { transform: rotate(304.13793deg);
}
._2:nth-of-type(110) { transform: rotate(310.34483deg);
}
._2:nth-of-type(111) { transform: rotate(316.55172deg);
}
._2:nth-of-type(112) { transform: rotate(322.75862deg);
}
._2:nth-of-type(113) { transform: rotate(328.96552deg);
}
._2:nth-of-type(114) { transform: rotate(335.17241deg);
}
._2:nth-of-type(115) { transform: rotate(341.37931deg);
}
._2:nth-of-type(116) { transform: rotate(347.58621deg);
}
._2:nth-of-type(117) { transform: rotate(353.7931deg);
}
._3 { color: #aaa; font-size: 20px; line-height: 20px; text-indent: 39.09091px; height: 8%; top: 46%;
}
._3:nth-of-type(118) { transform: rotate(0deg);
}
._3:nth-of-type(119) { transform: rotate(6.31579deg);
}
._3:nth-of-type(120) { transform: rotate(12.63158deg);
}
._3:nth-of-type(121) { transform: rotate(18.94737deg);
}
._3:nth-of-type(122) { transform: rotate(25.26316deg);
}
._3:nth-of-type(123) { transform: rotate(31.57895deg);
}
._3:nth-of-type(124) { transform: rotate(37.89474deg);
}
._3:nth-of-type(125) { transform: rotate(44.21053deg);
}
._3:nth-of-type(126) { transform: rotate(50.52632deg);
}
._3:nth-of-type(127) { transform: rotate(56.84211deg);
}
._3:nth-of-type(128) { transform: rotate(63.15789deg);
}
._3:nth-of-type(129) { transform: rotate(69.47368deg);
}
._3:nth-of-type(130) { transform: rotate(75.78947deg);
}
._3:nth-of-type(131) { transform: rotate(82.10526deg);
}
._3:nth-of-type(132) { transform: rotate(88.42105deg);
}
._3:nth-of-type(133) { transform: rotate(94.73684deg);
}
._3:nth-of-type(134) { transform: rotate(101.05263deg);
}
._3:nth-of-type(135) { transform: rotate(107.36842deg);
}
._3:nth-of-type(136) { transform: rotate(113.68421deg);
}
._3:nth-of-type(137) { transform: rotate(120deg);
}
._3:nth-of-type(138) { transform: rotate(126.31579deg);
}
._3:nth-of-type(139) { transform: rotate(132.63158deg);
}
._3:nth-of-type(140) { transform: rotate(138.94737deg);
}
._3:nth-of-type(141) { transform: rotate(145.26316deg);
}
._3:nth-of-type(142) { transform: rotate(151.57895deg);
}
._3:nth-of-type(143) { transform: rotate(157.89474deg);
}
._3:nth-of-type(144) { transform: rotate(164.21053deg);
}
._3:nth-of-type(145) { transform: rotate(170.52632deg);
}
._3:nth-of-type(146) { transform: rotate(176.84211deg);
}
._3:nth-of-type(147) { transform: rotate(183.15789deg);
}
._3:nth-of-type(148) { transform: rotate(189.47368deg);
}
._3:nth-of-type(149) { transform: rotate(195.78947deg);
}
._3:nth-of-type(150) { transform: rotate(202.10526deg);
}
._3:nth-of-type(151) { transform: rotate(208.42105deg);
}
._3:nth-of-type(152) { transform: rotate(214.73684deg);
}
._3:nth-of-type(153) { transform: rotate(221.05263deg);
}
._3:nth-of-type(154) { transform: rotate(227.36842deg);
}
._3:nth-of-type(155) { transform: rotate(233.68421deg);
}
._3:nth-of-type(156) { transform: rotate(240deg);
}
._3:nth-of-type(157) { transform: rotate(246.31579deg);
}
._3:nth-of-type(158) { transform: rotate(252.63158deg);
}
._3:nth-of-type(159) { transform: rotate(258.94737deg);
}
._3:nth-of-type(160) { transform: rotate(265.26316deg);
}
._3:nth-of-type(161) { transform: rotate(271.57895deg);
}
._3:nth-of-type(162) { transform: rotate(277.89474deg);
}
._3:nth-of-type(163) { transform: rotate(284.21053deg);
}
._3:nth-of-type(164) { transform: rotate(290.52632deg);
}
._3:nth-of-type(165) { transform: rotate(296.84211deg);
}
._3:nth-of-type(166) { transform: rotate(303.15789deg);
}
._3:nth-of-type(167) { transform: rotate(309.47368deg);
}
._3:nth-of-type(168) { transform: rotate(315.78947deg);
}
._3:nth-of-type(169) { transform: rotate(322.10526deg);
}
._3:nth-of-type(170) { transform: rotate(328.42105deg);
}
._3:nth-of-type(171) { transform: rotate(334.73684deg);
}
._3:nth-of-type(172) { transform: rotate(341.05263deg);
}
._3:nth-of-type(173) { transform: rotate(347.36842deg);
}
._3:nth-of-type(174) { transform: rotate(353.68421deg);
}
._4 { color: #fff; font-size: 19px; line-height: 19px; text-indent: 57.27273px; height: 7%; top: 46.5%;
}
._4:nth-of-type(175) { transform: rotate(0deg);
}
._4:nth-of-type(176) { transform: rotate(6.42857deg);
}
._4:nth-of-type(177) { transform: rotate(12.85714deg);
}
._4:nth-of-type(178) { transform: rotate(19.28571deg);
}
._4:nth-of-type(179) { transform: rotate(25.71429deg);
}
._4:nth-of-type(180) { transform: rotate(32.14286deg);
}
._4:nth-of-type(181) { transform: rotate(38.57143deg);
}
._4:nth-of-type(182) { transform: rotate(45deg);
}
._4:nth-of-type(183) { transform: rotate(51.42857deg);
}
._4:nth-of-type(184) { transform: rotate(57.85714deg);
}
._4:nth-of-type(185) { transform: rotate(64.28571deg);
}
._4:nth-of-type(186) { transform: rotate(70.71429deg);
}
._4:nth-of-type(187) { transform: rotate(77.14286deg);
}
._4:nth-of-type(188) { transform: rotate(83.57143deg);
}
._4:nth-of-type(189) { transform: rotate(90deg);
}
._4:nth-of-type(190) { transform: rotate(96.42857deg);
}
._4:nth-of-type(191) { transform: rotate(102.85714deg);
}
._4:nth-of-type(192) { transform: rotate(109.28571deg);
}
._4:nth-of-type(193) { transform: rotate(115.71429deg);
}
._4:nth-of-type(194) { transform: rotate(122.14286deg);
}
._4:nth-of-type(195) { transform: rotate(128.57143deg);
}
._4:nth-of-type(196) { transform: rotate(135deg);
}
._4:nth-of-type(197) { transform: rotate(141.42857deg);
}
._4:nth-of-type(198) { transform: rotate(147.85714deg);
}
._4:nth-of-type(199) { transform: rotate(154.28571deg);
}
._4:nth-of-type(200) { transform: rotate(160.71429deg);
}
._4:nth-of-type(201) { transform: rotate(167.14286deg);
}
._4:nth-of-type(202) { transform: rotate(173.57143deg);
}
._4:nth-of-type(203) { transform: rotate(180deg);
}
._4:nth-of-type(204) { transform: rotate(186.42857deg);
}
._4:nth-of-type(205) { transform: rotate(192.85714deg);
}
._4:nth-of-type(206) { transform: rotate(199.28571deg);
}
._4:nth-of-type(207) { transform: rotate(205.71429deg);
}
._4:nth-of-type(208) { transform: rotate(212.14286deg);
}
._4:nth-of-type(209) { transform: rotate(218.57143deg);
}
._4:nth-of-type(210) { transform: rotate(225deg);
}
._4:nth-of-type(211) { transform: rotate(231.42857deg);
}
._4:nth-of-type(212) { transform: rotate(237.85714deg);
}
._4:nth-of-type(213) { transform: rotate(244.28571deg);
}
._4:nth-of-type(214) { transform: rotate(250.71429deg);
}
._4:nth-of-type(215) { transform: rotate(257.14286deg);
}
._4:nth-of-type(216) { transform: rotate(263.57143deg);
}
._4:nth-of-type(217) { transform: rotate(270deg);
}
._4:nth-of-type(218) { transform: rotate(276.42857deg);
}
._4:nth-of-type(219) { transform: rotate(282.85714deg);
}
._4:nth-of-type(220) { transform: rotate(289.28571deg);
}
._4:nth-of-type(221) { transform: rotate(295.71429deg);
}
._4:nth-of-type(222) { transform: rotate(302.14286deg);
}
._4:nth-of-type(223) { transform: rotate(308.57143deg);
}
._4:nth-of-type(224) { transform: rotate(315deg);
}
._4:nth-of-type(225) { transform: rotate(321.42857deg);
}
._4:nth-of-type(226) { transform: rotate(327.85714deg);
}
._4:nth-of-type(227) { transform: rotate(334.28571deg);
}
._4:nth-of-type(228) { transform: rotate(340.71429deg);
}
._4:nth-of-type(229) { transform: rotate(347.14286deg);
}
._4:nth-of-type(230) { transform: rotate(353.57143deg);
}
._5 { color: #4d6ddf; font-size: 18px; line-height: 18px; text-indent: 74.54545px; height: 6%; top: 47%;
}
._5:nth-of-type(231) { transform: rotate(0deg);
}
._5:nth-of-type(232) { transform: rotate(6.54545deg);
}
._5:nth-of-type(233) { transform: rotate(13.09091deg);
}
._5:nth-of-type(234) { transform: rotate(19.63636deg);
}
._5:nth-of-type(235) { transform: rotate(26.18182deg);
}
._5:nth-of-type(236) { transform: rotate(32.72727deg);
}
._5:nth-of-type(237) { transform: rotate(39.27273deg);
}
._5:nth-of-type(238) { transform: rotate(45.81818deg);
}
._5:nth-of-type(239) { transform: rotate(52.36364deg);
}
._5:nth-of-type(240) { transform: rotate(58.90909deg);
}
._5:nth-of-type(241) { transform: rotate(65.45455deg);
}
._5:nth-of-type(242) { transform: rotate(72deg);
}
._5:nth-of-type(243) { transform: rotate(78.54545deg);
}
._5:nth-of-type(244) { transform: rotate(85.09091deg);
}
._5:nth-of-type(245) { transform: rotate(91.63636deg);
}
._5:nth-of-type(246) { transform: rotate(98.18182deg);
}
._5:nth-of-type(247) { transform: rotate(104.72727deg);
}
._5:nth-of-type(248) { transform: rotate(111.27273deg);
}
._5:nth-of-type(249) { transform: rotate(117.81818deg);
}
._5:nth-of-type(250) { transform: rotate(124.36364deg);
}
._5:nth-of-type(251) { transform: rotate(130.90909deg);
}
._5:nth-of-type(252) { transform: rotate(137.45455deg);
}
._5:nth-of-type(253) { transform: rotate(144deg);
}
._5:nth-of-type(254) { transform: rotate(150.54545deg);
}
._5:nth-of-type(255) { transform: rotate(157.09091deg);
}
._5:nth-of-type(256) { transform: rotate(163.63636deg);
}
._5:nth-of-type(257) { transform: rotate(170.18182deg);
}
._5:nth-of-type(258) { transform: rotate(176.72727deg);
}
._5:nth-of-type(259) { transform: rotate(183.27273deg);
}
._5:nth-of-type(260) { transform: rotate(189.81818deg);
}
._5:nth-of-type(261) { transform: rotate(196.36364deg);
}
._5:nth-of-type(262) { transform: rotate(202.90909deg);
}
._5:nth-of-type(263) { transform: rotate(209.45455deg);
}
._5:nth-of-type(264) { transform: rotate(216deg);
}
._5:nth-of-type(265) { transform: rotate(222.54545deg);
}
._5:nth-of-type(266) { transform: rotate(229.09091deg);
}
._5:nth-of-type(267) { transform: rotate(235.63636deg);
}
._5:nth-of-type(268) { transform: rotate(242.18182deg);
}
._5:nth-of-type(269) { transform: rotate(248.72727deg);
}
._5:nth-of-type(270) { transform: rotate(255.27273deg);
}
._5:nth-of-type(271) { transform: rotate(261.81818deg);
}
._5:nth-of-type(272) { transform: rotate(268.36364deg);
}
._5:nth-of-type(273) { transform: rotate(274.90909deg);
}
._5:nth-of-type(274) { transform: rotate(281.45455deg);
}
._5:nth-of-type(275) { transform: rotate(288deg);
}
._5:nth-of-type(276) { transform: rotate(294.54545deg);
}
._5:nth-of-type(277) { transform: rotate(301.09091deg);
}
._5:nth-of-type(278) { transform: rotate(307.63636deg);
}
._5:nth-of-type(279) { transform: rotate(314.18182deg);
}
._5:nth-of-type(280) { transform: rotate(320.72727deg);
}
._5:nth-of-type(281) { transform: rotate(327.27273deg);
}
._5:nth-of-type(282) { transform: rotate(333.81818deg);
}
._5:nth-of-type(283) { transform: rotate(340.36364deg);
}
._5:nth-of-type(284) { transform: rotate(346.90909deg);
}
._5:nth-of-type(285) { transform: rotate(353.45455deg);
}
._6 { color: #a5aff3; font-size: 17px; line-height: 17px; text-indent: 90.90909px; height: 5%; top: 47.5%;
}
._6:nth-of-type(286) { transform: rotate(0deg);
}
._6:nth-of-type(287) { transform: rotate(6.66667deg);
}
._6:nth-of-type(288) { transform: rotate(13.33333deg);
}
._6:nth-of-type(289) { transform: rotate(20deg);
}
._6:nth-of-type(290) { transform: rotate(26.66667deg);
}
._6:nth-of-type(291) { transform: rotate(33.33333deg);
}
._6:nth-of-type(292) { transform: rotate(40deg);
}
._6:nth-of-type(293) { transform: rotate(46.66667deg);
}
._6:nth-of-type(294) { transform: rotate(53.33333deg);
}
._6:nth-of-type(295) { transform: rotate(60deg);
}
._6:nth-of-type(296) { transform: rotate(66.66667deg);
}
._6:nth-of-type(297) { transform: rotate(73.33333deg);
}
._6:nth-of-type(298) { transform: rotate(80deg);
}
._6:nth-of-type(299) { transform: rotate(86.66667deg);
}
._6:nth-of-type(300) { transform: rotate(93.33333deg);
}
._6:nth-of-type(301) { transform: rotate(100deg);
}
._6:nth-of-type(302) { transform: rotate(106.66667deg);
}
._6:nth-of-type(303) { transform: rotate(113.33333deg);
}
._6:nth-of-type(304) { transform: rotate(120deg);
}
._6:nth-of-type(305) { transform: rotate(126.66667deg);
}
._6:nth-of-type(306) { transform: rotate(133.33333deg);
}
._6:nth-of-type(307) { transform: rotate(140deg);
}
._6:nth-of-type(308) { transform: rotate(146.66667deg);
}
._6:nth-of-type(309) { transform: rotate(153.33333deg);
}
._6:nth-of-type(310) { transform: rotate(160deg);
}
._6:nth-of-type(311) { transform: rotate(166.66667deg);
}
._6:nth-of-type(312) { transform: rotate(173.33333deg);
}
._6:nth-of-type(313) { transform: rotate(180deg);
}
._6:nth-of-type(314) { transform: rotate(186.66667deg);
}
._6:nth-of-type(315) { transform: rotate(193.33333deg);
}
._6:nth-of-type(316) { transform: rotate(200deg);
}
._6:nth-of-type(317) { transform: rotate(206.66667deg);
}
._6:nth-of-type(318) { transform: rotate(213.33333deg);
}
._6:nth-of-type(319) { transform: rotate(220deg);
}
._6:nth-of-type(320) { transform: rotate(226.66667deg);
}
._6:nth-of-type(321) { transform: rotate(233.33333deg);
}
._6:nth-of-type(322) { transform: rotate(240deg);
}
._6:nth-of-type(323) { transform: rotate(246.66667deg);
}
._6:nth-of-type(324) { transform: rotate(253.33333deg);
}
._6:nth-of-type(325) { transform: rotate(260deg);
}
._6:nth-of-type(326) { transform: rotate(266.66667deg);
}
._6:nth-of-type(327) { transform: rotate(273.33333deg);
}
._6:nth-of-type(328) { transform: rotate(280deg);
}
._6:nth-of-type(329) { transform: rotate(286.66667deg);
}
._6:nth-of-type(330) { transform: rotate(293.33333deg);
}
._6:nth-of-type(331) { transform: rotate(300deg);
}
._6:nth-of-type(332) { transform: rotate(306.66667deg);
}
._6:nth-of-type(333) { transform: rotate(313.33333deg);
}
._6:nth-of-type(334) { transform: rotate(320deg);
}
._6:nth-of-type(335) { transform: rotate(326.66667deg);
}
._6:nth-of-type(336) { transform: rotate(333.33333deg);
}
._6:nth-of-type(337) { transform: rotate(340deg);
}
._6:nth-of-type(338) { transform: rotate(346.66667deg);
}
._6:nth-of-type(339) { transform: rotate(353.33333deg);
}
._7 { color: #aaa; font-size: 16px; line-height: 16px; text-indent: 106.36364px; height: 4%; top: 48%;
}
._7:nth-of-type(340) { transform: rotate(0deg);
}
._7:nth-of-type(341) { transform: rotate(6.79245deg);
}
._7:nth-of-type(342) { transform: rotate(13.58491deg);
}
._7:nth-of-type(343) { transform: rotate(20.37736deg);
}
._7:nth-of-type(344) { transform: rotate(27.16981deg);
}
._7:nth-of-type(345) { transform: rotate(33.96226deg);
}
._7:nth-of-type(346) { transform: rotate(40.75472deg);
}
._7:nth-of-type(347) { transform: rotate(47.54717deg);
}
._7:nth-of-type(348) { transform: rotate(54.33962deg);
}
._7:nth-of-type(349) { transform: rotate(61.13208deg);
}
._7:nth-of-type(350) { transform: rotate(67.92453deg);
}
._7:nth-of-type(351) { transform: rotate(74.71698deg);
}
._7:nth-of-type(352) { transform: rotate(81.50943deg);
}
._7:nth-of-type(353) { transform: rotate(88.30189deg);
}
._7:nth-of-type(354) { transform: rotate(95.09434deg);
}
._7:nth-of-type(355) { transform: rotate(101.88679deg);
}
._7:nth-of-type(356) { transform: rotate(108.67925deg);
}
._7:nth-of-type(357) { transform: rotate(115.4717deg);
}
._7:nth-of-type(358) { transform: rotate(122.26415deg);
}
._7:nth-of-type(359) { transform: rotate(129.0566deg);
}
._7:nth-of-type(360) { transform: rotate(135.84906deg);
}
._7:nth-of-type(361) { transform: rotate(142.64151deg);
}
._7:nth-of-type(362) { transform: rotate(149.43396deg);
}
._7:nth-of-type(363) { transform: rotate(156.22642deg);
}
._7:nth-of-type(364) { transform: rotate(163.01887deg);
}
._7:nth-of-type(365) { transform: rotate(169.81132deg);
}
._7:nth-of-type(366) { transform: rotate(176.60377deg);
}
._7:nth-of-type(367) { transform: rotate(183.39623deg);
}
._7:nth-of-type(368) { transform: rotate(190.18868deg);
}
._7:nth-of-type(369) { transform: rotate(196.98113deg);
}
._7:nth-of-type(370) { transform: rotate(203.77358deg);
}
._7:nth-of-type(371) { transform: rotate(210.56604deg);
}
._7:nth-of-type(372) { transform: rotate(217.35849deg);
}
._7:nth-of-type(373) { transform: rotate(224.15094deg);
}
._7:nth-of-type(374) { transform: rotate(230.9434deg);
}
._7:nth-of-type(375) { transform: rotate(237.73585deg);
}
._7:nth-of-type(376) { transform: rotate(244.5283deg);
}
._7:nth-of-type(377) { transform: rotate(251.32075deg);
}
._7:nth-of-type(378) { transform: rotate(258.11321deg);
}
._7:nth-of-type(379) { transform: rotate(264.90566deg);
}
._7:nth-of-type(380) { transform: rotate(271.69811deg);
}
._7:nth-of-type(381) { transform: rotate(278.49057deg);
}
._7:nth-of-type(382) { transform: rotate(285.28302deg);
}
._7:nth-of-type(383) { transform: rotate(292.07547deg);
}
._7:nth-of-type(384) { transform: rotate(298.86792deg);
}
._7:nth-of-type(385) { transform: rotate(305.66038deg);
}
._7:nth-of-type(386) { transform: rotate(312.45283deg);
}
._7:nth-of-type(387) { transform: rotate(319.24528deg);
}
._7:nth-of-type(388) { transform: rotate(326.03774deg);
}
._7:nth-of-type(389) { transform: rotate(332.83019deg);
}
._7:nth-of-type(390) { transform: rotate(339.62264deg);
}
._7:nth-of-type(391) { transform: rotate(346.41509deg);
}
._7:nth-of-type(392) { transform: rotate(353.20755deg);
}
._8 { color: #fff; font-size: 15px; line-height: 15px; text-indent: 120.90909px; height: 3%; top: 48.5%;
}
._8:nth-of-type(393) { transform: rotate(0deg);
}
._8:nth-of-type(394) { transform: rotate(6.92308deg);
}
._8:nth-of-type(395) { transform: rotate(13.84615deg);
}
._8:nth-of-type(396) { transform: rotate(20.76923deg);
}
._8:nth-of-type(397) { transform: rotate(27.69231deg);
}
._8:nth-of-type(398) { transform: rotate(34.61538deg);
}
._8:nth-of-type(399) { transform: rotate(41.53846deg);
}
._8:nth-of-type(400) { transform: rotate(48.46154deg);
}
._8:nth-of-type(401) { transform: rotate(55.38462deg);
}
._8:nth-of-type(402) { transform: rotate(62.30769deg);
}
._8:nth-of-type(403) { transform: rotate(69.23077deg);
}
._8:nth-of-type(404) { transform: rotate(76.15385deg);
}
._8:nth-of-type(405) { transform: rotate(83.07692deg);
}
._8:nth-of-type(406) { transform: rotate(90deg);
}
._8:nth-of-type(407) { transform: rotate(96.92308deg);
}
._8:nth-of-type(408) { transform: rotate(103.84615deg);
}
._8:nth-of-type(409) { transform: rotate(110.76923deg);
}
._8:nth-of-type(410) { transform: rotate(117.69231deg);
}
._8:nth-of-type(411) { transform: rotate(124.61538deg);
}
._8:nth-of-type(412) { transform: rotate(131.53846deg);
}
._8:nth-of-type(413) { transform: rotate(138.46154deg);
}
._8:nth-of-type(414) { transform: rotate(145.38462deg);
}
._8:nth-of-type(415) { transform: rotate(152.30769deg);
}
._8:nth-of-type(416) { transform: rotate(159.23077deg);
}
._8:nth-of-type(417) { transform: rotate(166.15385deg);
}
._8:nth-of-type(418) { transform: rotate(173.07692deg);
}
._8:nth-of-type(419) { transform: rotate(180deg);
}
._8:nth-of-type(420) { transform: rotate(186.92308deg);
}
._8:nth-of-type(421) { transform: rotate(193.84615deg);
}
._8:nth-of-type(422) { transform: rotate(200.76923deg);
}
._8:nth-of-type(423) { transform: rotate(207.69231deg);
}
._8:nth-of-type(424) { transform: rotate(214.61538deg);
}
._8:nth-of-type(425) { transform: rotate(221.53846deg);
}
._8:nth-of-type(426) { transform: rotate(228.46154deg);
}
._8:nth-of-type(427) { transform: rotate(235.38462deg);
}
._8:nth-of-type(428) { transform: rotate(242.30769deg);
}
._8:nth-of-type(429) { transform: rotate(249.23077deg);
}
._8:nth-of-type(430) { transform: rotate(256.15385deg);
}
._8:nth-of-type(431) { transform: rotate(263.07692deg);
}
._8:nth-of-type(432) { transform: rotate(270deg);
}
._8:nth-of-type(433) { transform: rotate(276.92308deg);
}
._8:nth-of-type(434) { transform: rotate(283.84615deg);
}
._8:nth-of-type(435) { transform: rotate(290.76923deg);
}
._8:nth-of-type(436) { transform: rotate(297.69231deg);
}
._8:nth-of-type(437) { transform: rotate(304.61538deg);
}
._8:nth-of-type(438) { transform: rotate(311.53846deg);
}
._8:nth-of-type(439) { transform: rotate(318.46154deg);
}
._8:nth-of-type(440) { transform: rotate(325.38462deg);
}
._8:nth-of-type(441) { transform: rotate(332.30769deg);
}
._8:nth-of-type(442) { transform: rotate(339.23077deg);
}
._8:nth-of-type(443) { transform: rotate(346.15385deg);
}
._8:nth-of-type(444) { transform: rotate(353.07692deg);
}
._9 { color: #4d6ddf; font-size: 14px; line-height: 14px; text-indent: 134.54545px; height: 2%; top: 49%;
}
._9:nth-of-type(445) { transform: rotate(0deg);
}
._9:nth-of-type(446) { transform: rotate(7.05882deg);
}
._9:nth-of-type(447) { transform: rotate(14.11765deg);
}
._9:nth-of-type(448) { transform: rotate(21.17647deg);
}
._9:nth-of-type(449) { transform: rotate(28.23529deg);
}
._9:nth-of-type(450) { transform: rotate(35.29412deg);
}
._9:nth-of-type(451) { transform: rotate(42.35294deg);
}
._9:nth-of-type(452) { transform: rotate(49.41176deg);
}
._9:nth-of-type(453) { transform: rotate(56.47059deg);
}
._9:nth-of-type(454) { transform: rotate(63.52941deg);
}
._9:nth-of-type(455) { transform: rotate(70.58824deg);
}
._9:nth-of-type(456) { transform: rotate(77.64706deg);
}
._9:nth-of-type(457) { transform: rotate(84.70588deg);
}
._9:nth-of-type(458) { transform: rotate(91.76471deg);
}
._9:nth-of-type(459) { transform: rotate(98.82353deg);
}
._9:nth-of-type(460) { transform: rotate(105.88235deg);
}
._9:nth-of-type(461) { transform: rotate(112.94118deg);
}
._9:nth-of-type(462) { transform: rotate(120deg);
}
._9:nth-of-type(463) { transform: rotate(127.05882deg);
}
._9:nth-of-type(464) { transform: rotate(134.11765deg);
}
._9:nth-of-type(465) { transform: rotate(141.17647deg);
}
._9:nth-of-type(466) { transform: rotate(148.23529deg);
}
._9:nth-of-type(467) { transform: rotate(155.29412deg);
}
._9:nth-of-type(468) { transform: rotate(162.35294deg);
}
._9:nth-of-type(469) { transform: rotate(169.41176deg);
}
._9:nth-of-type(470) { transform: rotate(176.47059deg);
}
._9:nth-of-type(471) { transform: rotate(183.52941deg);
}
._9:nth-of-type(472) { transform: rotate(190.58824deg);
}
._9:nth-of-type(473) { transform: rotate(197.64706deg);
}
._9:nth-of-type(474) { transform: rotate(204.70588deg);
}
._9:nth-of-type(475) { transform: rotate(211.76471deg);
}
._9:nth-of-type(476) { transform: rotate(218.82353deg);
}
._9:nth-of-type(477) { transform: rotate(225.88235deg);
}
._9:nth-of-type(478) { transform: rotate(232.94118deg);
}
._9:nth-of-type(479) { transform: rotate(240deg);
}
._9:nth-of-type(480) { transform: rotate(247.05882deg);
}
._9:nth-of-type(481) { transform: rotate(254.11765deg);
}
._9:nth-of-type(482) { transform: rotate(261.17647deg);
}
._9:nth-of-type(483) { transform: rotate(268.23529deg);
}
._9:nth-of-type(484) { transform: rotate(275.29412deg);
}
._9:nth-of-type(485) { transform: rotate(282.35294deg);
}
._9:nth-of-type(486) { transform: rotate(289.41176deg);
}
._9:nth-of-type(487) { transform: rotate(296.47059deg);
}
._9:nth-of-type(488) { transform: rotate(303.52941deg);
}
._9:nth-of-type(489) { transform: rotate(310.58824deg);
}
._9:nth-of-type(490) { transform: rotate(317.64706deg);
}
._9:nth-of-type(491) { transform: rotate(324.70588deg);
}
._9:nth-of-type(492) { transform: rotate(331.76471deg);
}
._9:nth-of-type(493) { transform: rotate(338.82353deg);
}
._9:nth-of-type(494) { transform: rotate(345.88235deg);
}
._9:nth-of-type(495) { transform: rotate(352.94118deg);
}
._10 { color: #a5aff3; font-size: 13px; line-height: 13px; text-indent: 147.27273px; height: 1%; top: 49.5%;
}
._10:nth-of-type(496) { transform: rotate(0deg);
}
._10:nth-of-type(497) { transform: rotate(7.2deg);
}
._10:nth-of-type(498) { transform: rotate(14.4deg);
}
._10:nth-of-type(499) { transform: rotate(21.6deg);
}
._10:nth-of-type(500) { transform: rotate(28.8deg);
}
._10:nth-of-type(501) { transform: rotate(36deg);
}
._10:nth-of-type(502) { transform: rotate(43.2deg);
}
._10:nth-of-type(503) { transform: rotate(50.4deg);
}
._10:nth-of-type(504) { transform: rotate(57.6deg);
}
._10:nth-of-type(505) { transform: rotate(64.8deg);
}
._10:nth-of-type(506) { transform: rotate(72deg);
}
._10:nth-of-type(507) { transform: rotate(79.2deg);
}
._10:nth-of-type(508) { transform: rotate(86.4deg);
}
._10:nth-of-type(509) { transform: rotate(93.6deg);
}
._10:nth-of-type(510) { transform: rotate(100.8deg);
}
._10:nth-of-type(511) { transform: rotate(108deg);
}
._10:nth-of-type(512) { transform: rotate(115.2deg);
}
._10:nth-of-type(513) { transform: rotate(122.4deg);
}
._10:nth-of-type(514) { transform: rotate(129.6deg);
}
._10:nth-of-type(515) { transform: rotate(136.8deg);
}
._10:nth-of-type(516) { transform: rotate(144deg);
}
._10:nth-of-type(517) { transform: rotate(151.2deg);
}
._10:nth-of-type(518) { transform: rotate(158.4deg);
}
._10:nth-of-type(519) { transform: rotate(165.6deg);
}
._10:nth-of-type(520) { transform: rotate(172.8deg);
}
._10:nth-of-type(521) { transform: rotate(180deg);
}
._10:nth-of-type(522) { transform: rotate(187.2deg);
}
._10:nth-of-type(523) { transform: rotate(194.4deg);
}
._10:nth-of-type(524) { transform: rotate(201.6deg);
}
._10:nth-of-type(525) { transform: rotate(208.8deg);
}
._10:nth-of-type(526) { transform: rotate(216deg);
}
._10:nth-of-type(527) { transform: rotate(223.2deg);
}
._10:nth-of-type(528) { transform: rotate(230.4deg);
}
._10:nth-of-type(529) { transform: rotate(237.6deg);
}
._10:nth-of-type(530) { transform: rotate(244.8deg);
}
._10:nth-of-type(531) { transform: rotate(252deg);
}
._10:nth-of-type(532) { transform: rotate(259.2deg);
}
._10:nth-of-type(533) { transform: rotate(266.4deg);
}
._10:nth-of-type(534) { transform: rotate(273.6deg);
}
._10:nth-of-type(535) { transform: rotate(280.8deg);
}
._10:nth-of-type(536) { transform: rotate(288deg);
}
._10:nth-of-type(537) { transform: rotate(295.2deg);
}
._10:nth-of-type(538) { transform: rotate(302.4deg);
}
._10:nth-of-type(539) { transform: rotate(309.6deg);
}
._10:nth-of-type(540) { transform: rotate(316.8deg);
}
._10:nth-of-type(541) { transform: rotate(324deg);
}
._10:nth-of-type(542) { transform: rotate(331.2deg);
}
._10:nth-of-type(543) { transform: rotate(338.4deg);
}
._10:nth-of-type(544) { transform: rotate(345.6deg);
}
._10:nth-of-type(545) { transform: rotate(352.8deg);
}
._11 { color: #aaa; font-size: 12px; line-height: 12px; text-indent: 159.09091px; height: 0%; top: 50%;
}
._11:nth-of-type(546) { transform: rotate(0deg);
}
._11:nth-of-type(547) { transform: rotate(7.34694deg);
}
._11:nth-of-type(548) { transform: rotate(14.69388deg);
}
._11:nth-of-type(549) { transform: rotate(22.04082deg);
}
._11:nth-of-type(550) { transform: rotate(29.38776deg);
}
._11:nth-of-type(551) { transform: rotate(36.73469deg);
}
._11:nth-of-type(552) { transform: rotate(44.08163deg);
}
._11:nth-of-type(553) { transform: rotate(51.42857deg);
}
._11:nth-of-type(554) { transform: rotate(58.77551deg);
}
._11:nth-of-type(555) { transform: rotate(66.12245deg);
}
._11:nth-of-type(556) { transform: rotate(73.46939deg);
}
._11:nth-of-type(557) { transform: rotate(80.81633deg);
}
._11:nth-of-type(558) { transform: rotate(88.16327deg);
}
._11:nth-of-type(559) { transform: rotate(95.5102deg);
}
._11:nth-of-type(560) { transform: rotate(102.85714deg);
}
._11:nth-of-type(561) { transform: rotate(110.20408deg);
}
._11:nth-of-type(562) { transform: rotate(117.55102deg);
}
._11:nth-of-type(563) { transform: rotate(124.89796deg);
}
._11:nth-of-type(564) { transform: rotate(132.2449deg);
}
._11:nth-of-type(565) { transform: rotate(139.59184deg);
}
._11:nth-of-type(566) { transform: rotate(146.93878deg);
}
._11:nth-of-type(567) { transform: rotate(154.28571deg);
}
._11:nth-of-type(568) { transform: rotate(161.63265deg);
}
._11:nth-of-type(569) { transform: rotate(168.97959deg);
}
._11:nth-of-type(570) { transform: rotate(176.32653deg);
}
._11:nth-of-type(571) { transform: rotate(183.67347deg);
}
._11:nth-of-type(572) { transform: rotate(191.02041deg);
}
._11:nth-of-type(573) { transform: rotate(198.36735deg);
}
._11:nth-of-type(574) { transform: rotate(205.71429deg);
}
._11:nth-of-type(575) { transform: rotate(213.06122deg);
}
._11:nth-of-type(576) { transform: rotate(220.40816deg);
}
._11:nth-of-type(577) { transform: rotate(227.7551deg);
}
._11:nth-of-type(578) { transform: rotate(235.10204deg);
}
._11:nth-of-type(579) { transform: rotate(242.44898deg);
}
._11:nth-of-type(580) { transform: rotate(249.79592deg);
}
._11:nth-of-type(581) { transform: rotate(257.14286deg);
}
._11:nth-of-type(582) { transform: rotate(264.4898deg);
}
._11:nth-of-type(583) { transform: rotate(271.83673deg);
}
._11:nth-of-type(584) { transform: rotate(279.18367deg);
}
._11:nth-of-type(585) { transform: rotate(286.53061deg);
}
._11:nth-of-type(586) { transform: rotate(293.87755deg);
}
._11:nth-of-type(587) { transform: rotate(301.22449deg);
}
._11:nth-of-type(588) { transform: rotate(308.57143deg);
}
._11:nth-of-type(589) { transform: rotate(315.91837deg);
}
._11:nth-of-type(590) { transform: rotate(323.26531deg);
}
._11:nth-of-type(591) { transform: rotate(330.61224deg);
}
._11:nth-of-type(592) { transform: rotate(337.95918deg);
}
._11:nth-of-type(593) { transform: rotate(345.30612deg);
}
._11:nth-of-type(594) { transform: rotate(352.65306deg);
}
@keyframes spin { to { transform: rotate(66turn); }
}
Spinning Letter Illusion - Script Codes
Spinning Letter Illusion - Script Codes
Home Page Home
Developer Jon Kantner
Username jkantner
Uploaded August 21, 2022
Rating 4.5
Size 7,778 Kb
Views 26,312
Do you need developer help for Spinning Letter Illusion?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Jon Kantner (jkantner) Script Codes
Name
Flying Windows Logo
Smash Ball
K-2SO
SM64 Endless Staircase
Fox News TV Display
Empire State Building
Animated Flipping Tables Emoticon
How the New Sublime Text Logo Was Made
Isometric Japanese Castle
Club Command Line
Create amazing sales emails with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!