Skip to content

Instantly share code, notes, and snippets.

/index.html

Created August 7, 2016 23:30
Show Gist options
  • Save anonymous/f92335867ce5b9db39332e2283780815 to your computer and use it in GitHub Desktop.
Save anonymous/f92335867ce5b9db39332e2283780815 to your computer and use it in GitHub Desktop.
Download ZIP
R41nb0wz!
Raw
index.html
<div class="container">
<div class="well container-fluid">
<div class="row">
<div class="col-xs-12 col-sm-6">
<div class="h1 rbBase rainbowShadows">Hello, World!</div>
<div class="h3 rbBase rbStacked">Hello, World!</div>
<div class="h2 rbBase rbFuzz">Hello, World!</div>
<div class="h1 rbBase rbFuzz2 rbTextDark">Hello, World!</div>
</div>
<div class="col-xs-12 col-sm-6">
<div class="rbBase rbBoring h1">Hello, World!</div>
<div class="rbBase rbBoring h2 rbBoring2">Hello, World!</div>
<div class="rbBase rbBoring h3 rbBoring3">Hello, World!</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-6">
<div class="h1 rbBase rbTextShadow">Hello, World!</div>
<div class="h1 rbBase rbTextShadow aniSCurve">Hello, World!</div>
<div class="h1 rbBase rbTextShadow aniS2">Hello, World!</div>
</div>
<div class="col-xs-12 col-sm-6">
<div class="h1 rbBase rbCrazy">Hello, World!</div>
<div class="h1 rbBase rbCrazy2">Hello, World!</div>
<div class="h1 rbBase rbCrazy3">Hello, World!</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-6">
<div class="h1 rbBase rbText">Hello, World!</div>
<div class="h1 rbBase rbTextDark">Hello, World!</div>
<div class="h1 rbBase rbTextBright">Hello, World!</div>
</div>
<div class="col-xs-12 col-sm-6">
<div class="h1 rbBase rbGlow">Hello, World!</div>
<div class="h1 rbBase rbGlow aniSCurve">Hello, World!</div>
<div class="h1 rbBase rbGlow aniS2">Hello, World!</div>
</div>
</div>
</div>
</div>
</div>
Raw
r41nb0wz.markdown
Raw
scripts
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
Raw
style.css
.row {
border: 0.05em black solid;
margin: 0.75em;
margin-bottom: 1.5em;
box-shadow: 0.3em 0.3em 0.6em rgba(0,0,0,0.5);
}
.rbBase {
font-weight: 900;
color: #f0f0f0;
text-align: center;
white-space: nowrap;
padding: 0.5em;
}
@keyframes rainbowizeColor {
0%,
100% {
color: #ff0000;
color: hsl(0, 100%, 50%);
}
8.333% {
color: #ff8000;
color: hsl(30, 100%, 50%);
}
16.667% {
color: #ffff00;
color: hsl(60, 100%, 50%);
}
25% {
color: #80ff00;
color: hsl(90, 100%, 50%);
}
33.333% {
color: #00ff00;
color: hsl(120, 100%, 50%);
}
41.667% {
color: #00ff80;
color: hsl(150, 100%, 50%);
}
50% {
color: #80ffff;
color: hsl(180, 100%, 50%);
}
58.333% {
color: #0080ff;
color: hsl(210, 100%, 50%);
}
66.667% {
color: #0000ff;
color: hsl(240, 100%, 50%);
}
75% {
color: #8000ff;
color: hsl(270, 100%, 50%);
}
83.333% {
color: #ff80ff;
color: hsl(300, 100%, 50%);
}
91.667% {
color: #ff0080;
color: hsl(330, 100%, 50%);
}
}
@keyframes rainbowizeColorBright {
0%,
100% {
color: #ff8080;
color: hsl(0, 100%, 75%);
}
8.333% {
color: #ffc080;
color: hsl(30, 100%, 75%);
}
16.667% {
color: #ffff80;
color: hsl(60, 100%, 75%);
}
25% {
color: #c0ff80;
color: hsl(90, 100%, 75%);
}
33.333% {
color: #80ff80;
color: hsl(120, 100%, 75%);
}
41.667% {
color: #80ffc0;
color: hsl(150, 100%, 75%);
}
50% {
color: #80ffff;
color: hsl(180, 100%, 75%);
}
58.333% {
color: #80c0ff;
color: hsl(210, 100%, 75%);
}
66.667% {
color: #8080ff;
color: hsl(240, 100%, 75%);
}
75% {
color: #c080ff;
color: hsl(270, 100%, 75%);
}
83.333% {
color: #ff80ff;
color: hsl(300, 100%, 75%);
}
91.667% {
color: #ff80c0;
color: hsl(330, 100%, 75%);
}
}
@keyframes rainbowizeColorDark {
0%,
100% {
color: #e02020;
color: hsl(0, 75%, 50%);
}
8.333% {
color: #e08020;
color: hsl(30, 75%, 50%);
}
16.667% {
color: #e0e020;
color: hsl(60, 75%, 50%);
}
25% {
color: #80e020;
color: hsl(90, 75%, 50%);
}
33.333% {
color: #20e020;
color: hsl(120, 75%, 50%);
}
41.667% {
color: #20e080;
color: hsl(150, 75%, 50%);
}
50% {
color: #20e0e0;
color: hsl(180, 75%, 50%);
}
58.333% {
color: #2080e0;
color: hsl(210, 75%, 50%);
}
66.667% {
color: #2020e0;
color: hsl(240, 75%, 50%);
}
75% {
color: #8020e0;
color: hsl(270, 75%, 50%);
}
83.333% {
color: #e020e0;
color: hsl(300, 75%, 50%);
}
91.667% {
color: #e02080;
color: hsl(330, 75%, 50%);
}
}
@keyframes rainbowizeGlow {
0%,
100% {
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em #ff0000, 0 0 0.2em #ff0000;
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em rgba(255, 0, 0, 0.80), 0 0 0.2em rgba(255, 0, 0, 0.80);
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em hsla(0, 100%, 50%, 0.80), 0 0 0.2em hsla(0, 100%, 50%, 0.80);
}
8.333% {
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em #ff8000, 0 0 0.2em #ff8000;
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em rgba(255, 128, 0, 0.80), 0 0 0.2em rgba(255, 128, 0, 0.80);
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em hsla(30, 100%, 50%, 0.80), 0 0 0.2em hsla(30, 100%, 50%, 0.80);
}
16.667% {
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em #ffff00, 0 0 0.2em #ffff00;
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em rgba(255, 255, 0, 0.80), 0 0 0.2em rgba(255, 255, 0, 0.80);
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em hsla(60, 100%, 50%, 0.80), 0 0 0.2em hsla(60, 100%, 50%, 0.80);
}
25% {
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em #80ff00, 0 0 0.2em #80ff00;
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em rgba(128, 255, 0, 0.80), 0 0 0.2em rgba(128, 255, 0, 0.80);
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em hsla(90, 100%, 50%, 0.80), 0 0 0.2em hsla(90, 100%, 50%, 0.80);
}
33.333% {
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em #00ff00, 0 0 0.2em #00ff00;
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em rgba(0, 255, 0, 0.80), 0 0 0.2em rgba(0, 255, 0, 0.80);
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em hsla(120, 100%, 50%, 0.80), 0 0 0.2em hsla(120, 100%, 50%, 0.80);
}
41.667% {
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em #00ff80, 0 0 0.2em #00ff80;
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em rgba(0, 255, 128, 0.80), 0 0 0.2em rgba(0, 255, 128, 0.80);
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em hsla(150, 100%, 50%, 0.80), 0 0 0.2em hsla(150, 100%, 50%, 0.80);
}
50% {
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em #00ffff, 0 0 0.2em #00ffff;
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em rgba(0, 255, 255, 0.80), 0 0 0.2em rgba(0, 255, 255, 0.80);
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em hsla(180, 100%, 50%, 0.80), 0 0 0.2em hsla(180, 100%, 50%, 0.80);
}
58.333% {
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em #0080ff, 0 0 0.2em #0080ff;
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em rgba(0, 128, 255, 0.80), 0 0 0.2em rgba(0, 128, 255, 0.80);
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em hsla(210, 100%, 50%, 0.80), 0 0 0.2em hsla(210, 100%, 50%, 0.80);
}
66.667% {
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em #0000ff, 0 0 0.2em #0000ff;
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em rgba(0, 0, 255, 0.80), 0 0 0.2em rgba(0, 0, 255, 0.80);
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em hsla(240, 100%, 50%, 0.80), 0 0 0.2em hsla(240, 100%, 50%, 0.80);
}
75% {
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em #8000ff, 0 0 0.2em #8000ff;
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em rgba(128, 0, 255, 0.80), 0 0 0.2em rgba(128, 0, 255, 0.80);
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em hsla(270, 100%, 50%, 0.80), 0 0 0.2em hsla(270, 100%, 50%, 0.80);
}
83.333% {
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em #ff00ff, 0 0 0.2em #ff00ff;
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em rgba(255, 0, 255, 0.80), 0 0 0.2em rgba(255, 0, 255, 0.80);
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em hsla(300, 100%, 50%, 0.80), 0 0 0.2em hsla(300, 100%, 50%, 0.80);
}
91.667% {
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em #ff0080, 0 0 0.2em #ff0080;
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em rgba(255, 0, 128, 0.80), 0 0 0.2em rgba(255, 0, 128, 0.80);
text-shadow: 0.05em 0.05em 0.1em #000000, 0 0 1.0em hsla(330, 100%, 50%, 0.80), 0 0 0.2em hsla(330, 100%, 50%, 0.80);
}
}
@keyframes rainbowizeTextShadow {
0%,
100% {
text-shadow: 2px 2px 2px #ff0000;
text-shadow: 2px 2px 2px rgba(255, 0, 0, 0.80);
text-shadow: 2px 2px 2px hsla(0, 100%, 50%, 0.80);
}
8.333% {
text-shadow: 2px 2px 2px #ff8000;
text-shadow: 2px 2px 2px rgba(255, 128, 0, 0.80);
text-shadow: 2px 2px 2px hsla(30, 100%, 50%, 0.80);
}
16.667% {
text-shadow: 2px 2px 2px #ffff00;
text-shadow: 2px 2px 2px rgba(255, 255, 0, 0.80);
text-shadow: 2px 2px 2px hsla(60, 100%, 50%, 0.80);
}
25% {
text-shadow: 2px 2px 2px #80ff00;
text-shadow: 2px 2px 2px rgba(128, 255, 0, 0.80);
text-shadow: 2px 2px 2px hsla(90, 100%, 50%, 0.80);
}
33.333% {
text-shadow: 2px 2px 2px #00ff00;
text-shadow: 2px 2px 2px rgba(0, 255, 0, 0.80);
text-shadow: 2px 2px 2px hsla(120, 100%, 50%, 0.80);
}
41.667% {
text-shadow: 2px 2px 2px #00ff80;
text-shadow: 2px 2px 2px rgba(0, 255, 128, 0.80);
text-shadow: 2px 2px 2px hsla(150, 100%, 50%, 0.80);
}
50% {
text-shadow: 2px 2px 2px #00ffff;
text-shadow: 2px 2px 2px rgba(0, 255, 255, 0.80);
text-shadow: 2px 2px 2px hsla(180, 100%, 50%, 0.80);
}
58.333% {
text-shadow: 2px 2px 2px #0080ff;
text-shadow: 2px 2px 2px rgba(0, 128, 255, 0.80);
text-shadow: 2px 2px 2px hsla(210, 100%, 50%, 0.80);
}
66.667% {
text-shadow: 2px 2px 2px #0000ff;
text-shadow: 2px 2px 2px rgba(0, 0, 255, 0.80);
text-shadow: 2px 2px 2px hsla(240, 100%, 50%, 0.80);
}
75% {
text-shadow: 2px 2px 2px #8000ff;
text-shadow: 2px 2px 2px rgba(128, 0, 255, 0.80);
text-shadow: 2px 2px 2px hsla(270, 100%, 50%, 0.80);
}
83.333% {
text-shadow: 2px 2px 2px #ff00ff;
text-shadow: 2px 2px 2px rgba(255, 0, 255, 0.80);
text-shadow: 2px 2px 2px hsla(300, 100%, 50%, 0.80);
}
91.667% {
text-shadow: 2px 2px 2px #ff0080;
text-shadow: 2px 2px 2px rgba(255, 0, 128, 0.80);
text-shadow: 2px 2px 2px hsla(330, 100%, 50%, 0.80);
}
}
.rbText {
animation: rainbowizeColor 10s 0 infinite alternate cubic-bezier(0, 0, 1, 1);
}
.rbTextDark {
animation: rainbowizeColorDark 10s 0 infinite alternate cubic-bezier(1, 0, 0, 1);
}
.rbTextBright {
animation: rainbowizeColorBright 10s 0 infinite alternate cubic-bezier(1, 0.5, 0, 0.5);
}
.rbTextShadow {
color: darkgray;
animation: rainbowizeTextShadow 10s 0 infinite alternate linear;
}
.rbGlow {
animation: rainbowizeGlow 10s 0 infinite alternate linear;
}
.aniSCurve {
animation-timing-function: cubic-bezier(1, 0, 0, 1);
animation-direction: normal;
}
.aniS2 {
animation-timing-function: cubic-bezier(1, -3, 0, 3);
animation-direction: reverse;
}
.rbCrazy {
animation: rainbowizeColor 13s 0 infinite normal cubic-bezier(0, 0, 1, 1), rainbowizeGlow 5s 0 infinite reverse cubic-bezier(1, -3, 0, 3);
}
.rbCrazy2 {
animation: rainbowizeColor 37s 0 infinite alternate-reverse cubic-bezier(1, 0.5, 0, 0.5), rainbowizeGlow 17s 0 infinite reverse cubic-bezier(0, 0, 1, 1);
font-weight: 900;
}
.rbCrazy3 {
animation: rainbowizeColor 2s 0 infinite normal cubic-bezier(1, 0.5, 0, 0.5), rainbowizeGlow 3s 0 infinite alternate cubic-bezier(1, -3, 0, 3);
font-weight: 900;
}
/***** It doesn't have to be obnoxious. It can be subtle (read: BORING) if you prefer... *****/
@keyframes rainbowizeBackground {
50% {
background-color: #ff0000;
background-color: rgba(255, 0, 0, 1.00);
background-color: hsla(0, 100%, 50%, 1.00);
}
58.333% {
background-color: #ff8000;
background-color: rgba(255, 128, 0, 1.00);
background-color: hsla(30, 100%, 50%, 1.00);
}
66.667% {
background-color: #ffff00;
background-color: rgba(255, 255, 0, 1.00);
background-color: hsla(60, 100%, 50%, 1.00);
}
75% {
background-color: #80ff00;
background-color: rgba(128, 255, 0, 1.00);
background-color: hsla(90, 100%, 50%, 1.00);
}
83.333% {
background-color: #00ff00;
background-color: rgba(0, 255, 0, 1.00);
background-color: hsla(120, 100%, 50%, 1.00);
}
91.667% {
background-color: #00ff80;
background-color: rgba(0, 255, 128, 1.00);
background-color: hsla(150, 100%, 50%, 1.00);
}
0%,
100% {
background-color: #00ffff;
background-color: rgba(0, 255, 255, 1.00);
background-color: hsla(180, 100%, 50%, 1.00);
}
8.333% {
background-color: #0080ff;
background-color: rgba(0, 128, 255, 1.00);
background-color: hsla(210, 100%, 50%, 1.00);
}
16.667% {
background-color: #0000ff;
background-color: rgba(0, 0, 255, 1.00);
background-color: hsla(240, 100%, 50%, 1.00);
}
25% {
background-color: #8000ff;
background-color: rgba(128, 0, 255, 1.00);
background-color: hsla(270, 100%, 50%, 1.00);
}
33.333% {
background-color: #ff00ff;
background-color: rgba(255, 0, 255, 1.00);
background-color: hsla(300, 100%, 50%, 1.00);
}
41.667% {
background-color: #ff0080;
background-color: rgba(255, 0, 128, 1.00);
background-color: hsla(330, 100%, 50%, 1.00);
}
}
.rbBoring {
text-shadow: 0 0 1.0em white, 0 0 0.1em white, 3px 3px 0.1em black;
animation: rainbowizeColorDark 301s infinite normal linear, rainbowizeBackground 217s 0 infinite alternate-reverse ease;
}
.rbBoring2 {
animation: rainbowizeColorDark 57s -37s infinite normal ease, rainbowizeBackground 103s -29s infinite alternate-reverse linear;
}
.rbBoring3 {
animation: rainbowizeColorDark 301s -183s infinite alternate-reverse ease, rainbowizeBackground 251s -91s infinite normal ease;
}
@keyframes kfRainbowStacked {
0%, 100% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0.100em 0.100em 4px hsla(0, 100%, 50%, 1.0),
0.150em 0.150em 4px hsla(30, 100%, 50%, 1.0),
0.200em 0.200em 4px hsla(60, 100%, 50%, 1.0),
0.250em 0.250em 4px hsla(90, 100%, 50%, 1.0),
0.300em 0.300em 4px hsla(120, 100%, 50%, 1.0),
0.350em 0.350em 4px hsla(150, 100%, 50%, 1.0),
0.400em 0.400em 5px hsla(180, 100%, 50%, 1.0),
0.450em 0.450em 5px hsla(209, 100%, 50%, 1.0),
0.500em 0.500em 5px hsla(240, 100%, 50%, 1.0),
0.550em 0.550em 5px hsla(270, 100%, 50%, 1.0),
0.600em 0.600em 5px hsla(300, 100%, 50%, 1.0),
0.650em 0.650em 5px hsla(330, 100%, 50%, 1.0);
}
8.333% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0.100em 0.100em 4px hsla(30, 100%, 50%, 1.0),
0.150em 0.150em 4px hsla(60, 100%, 50%, 1.0),
0.200em 0.200em 4px hsla(90, 100%, 50%, 1.0),
0.250em 0.250em 4px hsla(120, 100%, 50%, 1.0),
0.300em 0.300em 4px hsla(150, 100%, 50%, 1.0),
0.350em 0.350em 4px hsla(180, 100%, 50%, 1.0),
0.400em 0.400em 5px hsla(210, 100%, 50%, 1.0),
0.450em 0.450em 5px hsla(239, 100%, 50%, 1.0),
0.500em 0.500em 5px hsla(270, 100%, 50%, 1.0),
0.550em 0.550em 5px hsla(300, 100%, 50%, 1.0),
0.600em 0.600em 5px hsla(330, 100%, 50%, 1.0),
0.650em 0.650em 5px hsla(0, 100%, 50%, 1.0);
}
16.667% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0.100em 0.100em 4px hsla(60, 100%, 50%, 1.0),
0.150em 0.150em 4px hsla(90, 100%, 50%, 1.0),
0.200em 0.200em 4px hsla(120, 100%, 50%, 1.0),
0.250em 0.250em 4px hsla(150, 100%, 50%, 1.0),
0.300em 0.300em 4px hsla(180, 100%, 50%, 1.0),
0.350em 0.350em 4px hsla(210, 100%, 50%, 1.0),
0.400em 0.400em 5px hsla(240, 100%, 50%, 1.0),
0.450em 0.450em 5px hsla(270, 100%, 50%, 1.0),
0.500em 0.500em 5px hsla(300, 100%, 50%, 1.0),
0.550em 0.550em 5px hsla(330, 100%, 50%, 1.0),
0.600em 0.600em 5px hsla(0, 100%, 50%, 1.0),
0.650em 0.650em 5px hsla(30, 100%, 50%, 1.0);
}
25.000% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0.100em 0.100em 4px hsla(90, 100%, 50%, 1.0),
0.150em 0.150em 4px hsla(120, 100%, 50%, 1.0),
0.200em 0.200em 4px hsla(150, 100%, 50%, 1.0),
0.250em 0.250em 4px hsla(180, 100%, 50%, 1.0),
0.300em 0.300em 4px hsla(210, 100%, 50%, 1.0),
0.350em 0.350em 4px hsla(240, 100%, 50%, 1.0),
0.400em 0.400em 5px hsla(270, 100%, 50%, 1.0),
0.450em 0.450em 5px hsla(300, 100%, 50%, 1.0),
0.500em 0.500em 5px hsla(330, 100%, 50%, 1.0),
0.550em 0.550em 5px hsla(0, 100%, 50%, 1.0),
0.600em 0.600em 5px hsla(30, 100%, 50%, 1.0),
0.650em 0.650em 5px hsla(60, 100%, 50%, 1.0);
}
33.333% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0.100em 0.100em 4px hsla(120, 100%, 50%, 1.0),
0.150em 0.150em 4px hsla(150, 100%, 50%, 1.0),
0.200em 0.200em 4px hsla(180, 100%, 50%, 1.0),
0.250em 0.250em 4px hsla(210, 100%, 50%, 1.0),
0.300em 0.300em 4px hsla(240, 100%, 50%, 1.0),
0.350em 0.350em 4px hsla(270, 100%, 50%, 1.0),
0.400em 0.400em 5px hsla(300, 100%, 50%, 1.0),
0.450em 0.450em 5px hsla(330, 100%, 50%, 1.0),
0.500em 0.500em 5px hsla(0, 100%, 50%, 1.0),
0.550em 0.550em 5px hsla(30, 100%, 50%, 1.0),
0.600em 0.600em 5px hsla(60, 100%, 50%, 1.0),
0.650em 0.650em 5px hsla(90, 100%, 50%, 1.0);
}
41.667% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0.100em 0.100em 4px hsla(150, 100%, 50%, 1.0),
0.150em 0.150em 4px hsla(180, 100%, 50%, 1.0),
0.200em 0.200em 4px hsla(210, 100%, 50%, 1.0),
0.250em 0.250em 4px hsla(240, 100%, 50%, 1.0),
0.300em 0.300em 4px hsla(270, 100%, 50%, 1.0),
0.350em 0.350em 4px hsla(300, 100%, 50%, 1.0),
0.400em 0.400em 5px hsla(330, 100%, 50%, 1.0),
0.450em 0.450em 5px hsla(0, 100%, 50%, 1.0),
0.500em 0.500em 5px hsla(30, 100%, 50%, 1.0),
0.550em 0.550em 5px hsla(60, 100%, 50%, 1.0),
0.600em 0.600em 5px hsla(90, 100%, 50%, 1.0),
0.650em 0.650em 5px hsla(120, 100%, 50%, 1.0);
}
50.000% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0.100em 0.100em 4px hsla(180, 100%, 50%, 1.0),
0.150em 0.150em 4px hsla(210, 100%, 50%, 1.0),
0.200em 0.200em 4px hsla(240, 100%, 50%, 1.0),
0.250em 0.250em 4px hsla(270, 100%, 50%, 1.0),
0.300em 0.300em 4px hsla(300, 100%, 50%, 1.0),
0.350em 0.350em 4px hsla(330, 100%, 50%, 1.0),
0.400em 0.400em 5px hsla(0, 100%, 50%, 1.0),
0.450em 0.450em 5px hsla(30, 100%, 50%, 1.0),
0.500em 0.500em 5px hsla(60, 100%, 50%, 1.0),
0.550em 0.550em 5px hsla(90, 100%, 50%, 1.0),
0.600em 0.600em 5px hsla(120, 100%, 50%, 1.0),
0.650em 0.650em 5px hsla(150, 100%, 50%, 1.0);
}
58.333% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0.100em 0.100em 4px hsla(209, 100%, 50%, 1.0),
0.150em 0.150em 4px hsla(239, 100%, 50%, 1.0),
0.200em 0.200em 4px hsla(270, 100%, 50%, 1.0),
0.250em 0.250em 4px hsla(300, 100%, 50%, 1.0),
0.300em 0.300em 4px hsla(330, 100%, 50%, 1.0),
0.350em 0.350em 4px hsla(0, 100%, 50%, 1.0),
0.400em 0.400em 5px hsla(30, 100%, 50%, 1.0),
0.450em 0.450em 5px hsla(59, 100%, 50%, 1.0),
0.500em 0.500em 5px hsla(90, 100%, 50%, 1.0),
0.550em 0.550em 5px hsla(120, 100%, 50%, 1.0),
0.600em 0.600em 5px hsla(150, 100%, 50%, 1.0),
0.650em 0.650em 5px hsla(180, 100%, 50%, 1.0);
}
66.667% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0.100em 0.100em 4px hsla(240, 100%, 50%, 1.0),
0.150em 0.150em 4px hsla(270, 100%, 50%, 1.0),
0.200em 0.200em 4px hsla(300, 100%, 50%, 1.0),
0.250em 0.250em 4px hsla(330, 100%, 50%, 1.0),
0.300em 0.300em 4px hsla(0, 100%, 50%, 1.0),
0.350em 0.350em 4px hsla(30, 100%, 50%, 1.0),
0.400em 0.400em 5px hsla(60, 100%, 50%, 1.0),
0.450em 0.450em 5px hsla(90, 100%, 50%, 1.0),
0.500em 0.500em 5px hsla(120, 100%, 50%, 1.0),
0.550em 0.550em 5px hsla(150, 100%, 50%, 1.0),
0.600em 0.600em 5px hsla(180, 100%, 50%, 1.0),
0.650em 0.650em 5px hsla(210, 100%, 50%, 1.0);
}
75.000% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0.100em 0.100em 4px hsla(270, 100%, 50%, 1.0),
0.150em 0.150em 4px hsla(300, 100%, 50%, 1.0),
0.200em 0.200em 4px hsla(330, 100%, 50%, 1.0),
0.250em 0.250em 4px hsla(0, 100%, 50%, 1.0),
0.300em 0.300em 4px hsla(30, 100%, 50%, 1.0),
0.350em 0.350em 4px hsla(60, 100%, 50%, 1.0),
0.400em 0.400em 5px hsla(90, 100%, 50%, 1.0),
0.450em 0.450em 5px hsla(120, 100%, 50%, 1.0),
0.500em 0.500em 5px hsla(150, 100%, 50%, 1.0),
0.550em 0.550em 5px hsla(180, 100%, 50%, 1.0),
0.600em 0.600em 5px hsla(210, 100%, 50%, 1.0),
0.650em 0.650em 5px hsla(240, 100%, 50%, 1.0);
}
83.333% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0.100em 0.100em 4px hsla(300, 100%, 50%, 1.0),
0.150em 0.150em 4px hsla(330, 100%, 50%, 1.0),
0.200em 0.200em 4px hsla(0, 100%, 50%, 1.0),
0.250em 0.250em 4px hsla(30, 100%, 50%, 1.0),
0.300em 0.300em 4px hsla(60, 100%, 50%, 1.0),
0.350em 0.350em 4px hsla(90, 100%, 50%, 1.0),
0.400em 0.400em 5px hsla(120, 100%, 50%, 1.0),
0.450em 0.450em 5px hsla(150, 100%, 50%, 1.0),
0.500em 0.500em 5px hsla(180, 100%, 50%, 1.0),
0.550em 0.550em 5px hsla(210, 100%, 50%, 1.0),
0.600em 0.600em 5px hsla(240, 100%, 50%, 1.0),
0.650em 0.650em 5px hsla(270, 100%, 50%, 1.0);
}
91.667% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0.100em 0.100em 4px hsla(330, 100%, 50%, 1.0),
0.150em 0.150em 4px hsla(0, 100%, 50%, 1.0),
0.200em 0.200em 4px hsla(30, 100%, 50%, 1.0),
0.250em 0.250em 4px hsla(60, 100%, 50%, 1.0),
0.300em 0.300em 4px hsla(90, 100%, 50%, 1.0),
0.350em 0.350em 4px hsla(120, 100%, 50%, 1.0),
0.400em 0.400em 5px hsla(150, 100%, 50%, 1.0),
0.450em 0.450em 5px hsla(180, 100%, 50%, 1.0),
0.500em 0.500em 5px hsla(210, 100%, 50%, 1.0),
0.550em 0.550em 5px hsla(240, 100%, 50%, 1.0),
0.600em 0.600em 5px hsla(270, 100%, 50%, 1.0),
0.650em 0.650em 5px hsla(300, 100%, 50%, 1.0);
}
}
.rbStacked {
animation: kfRainbowStacked 3s 0s infinite alternate-reverse ease;
}
.rainbowShadows {
text-shadow: 0 0 1px black, 2px 2px 10px hsla(0, 100%, 50%, 1.0), -2px -2px 10px hsla(0, 100%, 50%, 1.0), 2px -2px 10px hsla(0, 100%, 50%, 1.0), -2px 2px 10px hsla(0, 100%, 50%, 1.0), 4px 4px 10px hsla(30, 100%, 50%, 1.0), -4px -4px 10px hsla(30, 100%, 50%, 1.0), 4px -4px 10px hsla(30, 100%, 50%, 1.0), -4px 4px 10px hsla(30, 100%, 50%, 1.0), 6px 6px 10px hsla(60, 100%, 50%, 1.0), -6px -6px 10px hsla(60, 100%, 50%, 1.0), 6px -6px 10px hsla(60, 100%, 50%, 1.0), -6px 6px 10px hsla(60, 100%, 50%, 1.0), 8px 8px 10px hsla(90, 100%, 50%, 1.0), -8px -8px 10px hsla(90, 100%, 50%, 1.0), 8px -8px 10px hsla(90, 100%, 50%, 1.0), -8px 8px 10px hsla(90, 100%, 50%, 1.0), 10px 10px 10px hsla(120, 100%, 50%, 1.0), -10px -10px 10px hsla(120, 100%, 50%, 1.0), 10px -10px 10px hsla(120, 100%, 50%, 1.0), -10px 10px 10px hsla(120, 100%, 50%, 1.0), 12px 12px 10px hsla(150, 100%, 50%, 1.0), -12px -12px 10px hsla(150, 100%, 50%, 1.0), 12px -12px 10px hsla(150, 100%, 50%, 1.0), -12px 12px 10px hsla(150, 100%, 50%, 1.0), 14px 14px 10px hsla(180, 100%, 50%, 1.0), -14px -14px 10px hsla(180, 100%, 50%, 1.0), 14px -14px 10px hsla(180, 100%, 50%, 1.0), -14px 14px 10px hsla(180, 100%, 50%, 1.0), 16px 16px 10px hsla(210, 100%, 50%, 1.0), -16px -16px 10px hsla(210, 100%, 50%, 1.0), 16px -16px 10px hsla(210, 100%, 50%, 1.0), -16px 16px 10px hsla(210, 100%, 50%, 1.0), 18px 18px 10px hsla(240, 100%, 50%, 1.0), -18px -18px 10px hsla(240, 100%, 50%, 1.0), 18px -18px 10px hsla(240, 100%, 50%, 1.0), -18px 18px 10px hsla(240, 100%, 50%, 1.0), 20px 20px 10px hsla(270, 100%, 50%, 1.0), -20px -20px 10px hsla(270, 100%, 50%, 1.0), 20px -20px 10px hsla(270, 100%, 50%, 1.0), -20px 20px 10px hsla(270, 100%, 50%, 1.0), 22px 22px 10px hsla(300, 100%, 50%, 1.0), -22px -22px 10px hsla(300, 100%, 50%, 1.0), 22px -22px 10px hsla(300, 100%, 50%, 1.0), -22px 22px 10px hsla(300, 100%, 50%, 1.0), 24px 24px 10px hsla(330, 100%, 50%, 1.0), -24px -24px 10px hsla(330, 100%, 50%, 1.0), 24px -24px 10px hsla(330, 100%, 50%, 1.0), -24px 24px 10px hsla(330, 100%, 50%, 1.0), 26px 26px 10px hsla(360, 100%, 50%, 1.0), -26px -26px 10px hsla(360, 100%, 50%, 1.0), 26px -26px 10px hsla(360, 100%, 50%, 1.0), -26px 26px 10px hsla(360, 100%, 50%, 1.0);
}
@keyframes kfRainbowFuzz {
0%, 100% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0 0 0.250em hsla(0, 100%, 25%, 0.900),
0 0 0.250em hsla(10, 100%, 25%, 0.903),
0 0 0.250em hsla(20, 100%, 25%, 0.906),
0 0 0.250em hsla(30, 100%, 25%, 0.908),
0 0 0.250em hsla(40, 100%, 25%, 0.911),
0 0 0.250em hsla(50, 100%, 25%, 0.914),
0 0 0.250em hsla(60, 100%, 25%, 0.917),
0 0 0.250em hsla(69, 100%, 25%, 0.919),
0 0 0.250em hsla(80, 100%, 25%, 0.922),
0 0 0.250em hsla(90, 100%, 25%, 0.925),
0 0 0.250em hsla(100, 100%, 25%, 0.928),
0 0 0.250em hsla(109, 100%, 25%, 0.931),
0 0 0.250em hsla(120, 100%, 25%, 0.933),
0 0 0.250em hsla(130, 100%, 25%, 0.936),
0 0 0.250em hsla(139, 100%, 25%, 0.939),
0 0 0.250em hsla(150, 100%, 25%, 0.942),
0 0 0.250em hsla(160, 100%, 25%, 0.944),
0 0 0.250em hsla(170, 100%, 25%, 0.947),
0 0 0.250em hsla(180, 100%, 25%, 0.950),
0 0 0.250em hsla(190, 100%, 25%, 0.953),
0 0 0.250em hsla(200, 100%, 25%, 0.956),
0 0 0.250em hsla(209, 100%, 25%, 0.958),
0 0 0.250em hsla(219, 100%, 25%, 0.961),
0 0 0.250em hsla(229, 100%, 25%, 0.964),
0 0 0.250em hsla(240, 100%, 25%, 0.967),
0 0 0.250em hsla(250, 100%, 25%, 0.969),
0 0 0.250em hsla(260, 100%, 25%, 0.972),
0 0 0.250em hsla(270, 100%, 25%, 0.975),
0 0 0.250em hsla(279, 100%, 25%, 0.978),
0 0 0.250em hsla(289, 100%, 25%, 0.981),
0 0 0.250em hsla(300, 100%, 25%, 0.983),
0 0 0.250em hsla(310, 100%, 25%, 0.986),
0 0 0.250em hsla(320, 100%, 25%, 0.989),
0 0 0.250em hsla(330, 100%, 25%, 0.992),
0 0 0.250em hsla(340, 100%, 25%, 0.994),
0 0 0.250em hsla(350, 100%, 25%, 0.997);
}
8.333% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0 0 0.250em hsla(30, 100%, 38%, 0.900),
0 0 0.259em hsla(40, 100%, 38%, 0.903),
0 0 0.268em hsla(50, 100%, 38%, 0.906),
0 0 0.277em hsla(60, 100%, 38%, 0.908),
0 0 0.286em hsla(70, 100%, 38%, 0.911),
0 0 0.295em hsla(80, 100%, 38%, 0.914),
0 0 0.304em hsla(90, 100%, 38%, 0.917),
0 0 0.313em hsla(99, 100%, 38%, 0.919),
0 0 0.322em hsla(110, 100%, 38%, 0.922),
0 0 0.331em hsla(120, 100%, 38%, 0.925),
0 0 0.340em hsla(130, 100%, 38%, 0.928),
0 0 0.349em hsla(140, 100%, 38%, 0.931),
0 0 0.358em hsla(150, 100%, 38%, 0.933),
0 0 0.367em hsla(160, 100%, 38%, 0.936),
0 0 0.376em hsla(169, 100%, 38%, 0.939),
0 0 0.385em hsla(180, 100%, 38%, 0.942),
0 0 0.394em hsla(190, 100%, 38%, 0.944),
0 0 0.403em hsla(200, 100%, 38%, 0.947),
0 0 0.412em hsla(210, 100%, 38%, 0.950),
0 0 0.421em hsla(220, 100%, 38%, 0.953),
0 0 0.430em hsla(230, 100%, 38%, 0.956),
0 0 0.439em hsla(239, 100%, 38%, 0.958),
0 0 0.448em hsla(249, 100%, 38%, 0.961),
0 0 0.457em hsla(260, 100%, 38%, 0.964),
0 0 0.466em hsla(270, 100%, 38%, 0.967),
0 0 0.475em hsla(280, 100%, 38%, 0.969),
0 0 0.484em hsla(290, 100%, 38%, 0.972),
0 0 0.493em hsla(300, 100%, 38%, 0.975),
0 0 0.502em hsla(309, 100%, 38%, 0.978),
0 0 0.511em hsla(319, 100%, 38%, 0.981),
0 0 0.520em hsla(330, 100%, 38%, 0.983),
0 0 0.529em hsla(340, 100%, 38%, 0.986),
0 0 0.538em hsla(350, 100%, 38%, 0.989),
0 0 0.547em hsla(0, 100%, 38%, 0.992),
0 0 0.556em hsla(10, 100%, 38%, 0.994),
0 0 0.565em hsla(20, 100%, 38%, 0.997);
}
16.667% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0 0 0.250em hsla(60, 100%, 50%, 0.900),
0 0 0.267em hsla(70, 100%, 50%, 0.903),
0 0 0.285em hsla(80, 100%, 50%, 0.906),
0 0 0.302em hsla(90, 100%, 50%, 0.908),
0 0 0.319em hsla(100, 100%, 50%, 0.911),
0 0 0.337em hsla(110, 100%, 50%, 0.914),
0 0 0.354em hsla(120, 100%, 50%, 0.917),
0 0 0.372em hsla(130, 100%, 50%, 0.919),
0 0 0.389em hsla(140, 100%, 50%, 0.922),
0 0 0.406em hsla(150, 100%, 50%, 0.925),
0 0 0.424em hsla(160, 100%, 50%, 0.928),
0 0 0.441em hsla(170, 100%, 50%, 0.931),
0 0 0.458em hsla(180, 100%, 50%, 0.933),
0 0 0.476em hsla(190, 100%, 50%, 0.936),
0 0 0.493em hsla(199, 100%, 50%, 0.939),
0 0 0.510em hsla(210, 100%, 50%, 0.942),
0 0 0.528em hsla(220, 100%, 50%, 0.944),
0 0 0.545em hsla(230, 100%, 50%, 0.947),
0 0 0.563em hsla(240, 100%, 50%, 0.950),
0 0 0.580em hsla(250, 100%, 50%, 0.953),
0 0 0.597em hsla(260, 100%, 50%, 0.956),
0 0 0.615em hsla(270, 100%, 50%, 0.958),
0 0 0.632em hsla(280, 100%, 50%, 0.961),
0 0 0.649em hsla(290, 100%, 50%, 0.964),
0 0 0.667em hsla(300, 100%, 50%, 0.967),
0 0 0.684em hsla(310, 100%, 50%, 0.969),
0 0 0.701em hsla(320, 100%, 50%, 0.972),
0 0 0.719em hsla(330, 100%, 50%, 0.975),
0 0 0.736em hsla(339, 100%, 50%, 0.978),
0 0 0.753em hsla(349, 100%, 50%, 0.981),
0 0 0.771em hsla(0, 100%, 50%, 0.983),
0 0 0.788em hsla(10, 100%, 50%, 0.986),
0 0 0.806em hsla(20, 100%, 50%, 0.989),
0 0 0.823em hsla(30, 100%, 50%, 0.992),
0 0 0.840em hsla(40, 100%, 50%, 0.994),
0 0 0.858em hsla(50, 100%, 50%, 0.997);
}
25.000% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0 0 0.250em hsla(90, 100%, 60%, 0.900),
0 0 0.275em hsla(100, 100%, 60%, 0.903),
0 0 0.299em hsla(110, 100%, 60%, 0.906),
0 0 0.324em hsla(120, 100%, 60%, 0.908),
0 0 0.348em hsla(130, 100%, 60%, 0.911),
0 0 0.373em hsla(140, 100%, 60%, 0.914),
0 0 0.397em hsla(150, 100%, 60%, 0.917),
0 0 0.422em hsla(160, 100%, 60%, 0.919),
0 0 0.446em hsla(170, 100%, 60%, 0.922),
0 0 0.471em hsla(180, 100%, 60%, 0.925),
0 0 0.496em hsla(190, 100%, 60%, 0.928),
0 0 0.520em hsla(200, 100%, 60%, 0.931),
0 0 0.545em hsla(210, 100%, 60%, 0.933),
0 0 0.569em hsla(220, 100%, 60%, 0.936),
0 0 0.594em hsla(229, 100%, 60%, 0.939),
0 0 0.618em hsla(240, 100%, 60%, 0.942),
0 0 0.643em hsla(250, 100%, 60%, 0.944),
0 0 0.667em hsla(260, 100%, 60%, 0.947),
0 0 0.692em hsla(270, 100%, 60%, 0.950),
0 0 0.716em hsla(280, 100%, 60%, 0.953),
0 0 0.741em hsla(290, 100%, 60%, 0.956),
0 0 0.766em hsla(300, 100%, 60%, 0.958),
0 0 0.790em hsla(310, 100%, 60%, 0.961),
0 0 0.815em hsla(320, 100%, 60%, 0.964),
0 0 0.839em hsla(330, 100%, 60%, 0.967),
0 0 0.864em hsla(340, 100%, 60%, 0.969),
0 0 0.888em hsla(350, 100%, 60%, 0.972),
0 0 0.913em hsla(0, 100%, 60%, 0.975),
0 0 0.937em hsla(9, 100%, 60%, 0.978),
0 0 0.962em hsla(19, 100%, 60%, 0.981),
0 0 0.987em hsla(30, 100%, 60%, 0.983),
0 0 1.011em hsla(40, 100%, 60%, 0.986),
0 0 1.036em hsla(50, 100%, 60%, 0.989),
0 0 1.060em hsla(60, 100%, 60%, 0.992),
0 0 1.085em hsla(70, 100%, 60%, 0.994),
0 0 1.109em hsla(80, 100%, 60%, 0.997);
}
33.333% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0 0 0.250em hsla(120, 100%, 68%, 0.900),
0 0 0.280em hsla(130, 100%, 68%, 0.903),
0 0 0.310em hsla(140, 100%, 68%, 0.906),
0 0 0.340em hsla(150, 100%, 68%, 0.908),
0 0 0.370em hsla(160, 100%, 68%, 0.911),
0 0 0.400em hsla(170, 100%, 68%, 0.914),
0 0 0.430em hsla(180, 100%, 68%, 0.917),
0 0 0.460em hsla(190, 100%, 68%, 0.919),
0 0 0.491em hsla(200, 100%, 68%, 0.922),
0 0 0.521em hsla(210, 100%, 68%, 0.925),
0 0 0.551em hsla(220, 100%, 68%, 0.928),
0 0 0.581em hsla(230, 100%, 68%, 0.931),
0 0 0.611em hsla(240, 100%, 68%, 0.933),
0 0 0.641em hsla(250, 100%, 68%, 0.936),
0 0 0.671em hsla(260, 100%, 68%, 0.939),
0 0 0.701em hsla(270, 100%, 68%, 0.942),
0 0 0.731em hsla(280, 100%, 68%, 0.944),
0 0 0.761em hsla(290, 100%, 68%, 0.947),
0 0 0.791em hsla(300, 100%, 68%, 0.950),
0 0 0.821em hsla(310, 100%, 68%, 0.953),
0 0 0.851em hsla(320, 100%, 68%, 0.956),
0 0 0.881em hsla(330, 100%, 68%, 0.958),
0 0 0.912em hsla(340, 100%, 68%, 0.961),
0 0 0.942em hsla(350, 100%, 68%, 0.964),
0 0 0.972em hsla(0, 100%, 68%, 0.967),
0 0 1.002em hsla(10, 100%, 68%, 0.969),
0 0 1.032em hsla(20, 100%, 68%, 0.972),
0 0 1.062em hsla(30, 100%, 68%, 0.975),
0 0 1.092em hsla(39, 100%, 68%, 0.978),
0 0 1.122em hsla(49, 100%, 68%, 0.981),
0 0 1.152em hsla(60, 100%, 68%, 0.983),
0 0 1.182em hsla(70, 100%, 68%, 0.986),
0 0 1.212em hsla(80, 100%, 68%, 0.989),
0 0 1.242em hsla(90, 100%, 68%, 0.992),
0 0 1.272em hsla(100, 100%, 68%, 0.994),
0 0 1.302em hsla(110, 100%, 68%, 0.997);
}
41.667% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0 0 0.250em hsla(150, 100%, 73%, 0.900),
0 0 0.284em hsla(160, 100%, 73%, 0.903),
0 0 0.317em hsla(170, 100%, 73%, 0.906),
0 0 0.351em hsla(180, 100%, 73%, 0.908),
0 0 0.384em hsla(190, 100%, 73%, 0.911),
0 0 0.418em hsla(200, 100%, 73%, 0.914),
0 0 0.451em hsla(210, 100%, 73%, 0.917),
0 0 0.485em hsla(220, 100%, 73%, 0.919),
0 0 0.518em hsla(230, 100%, 73%, 0.922),
0 0 0.552em hsla(240, 100%, 73%, 0.925),
0 0 0.585em hsla(250, 100%, 73%, 0.928),
0 0 0.619em hsla(260, 100%, 73%, 0.931),
0 0 0.652em hsla(270, 100%, 73%, 0.933),
0 0 0.686em hsla(280, 100%, 73%, 0.936),
0 0 0.720em hsla(290, 100%, 73%, 0.939),
0 0 0.753em hsla(300, 100%, 73%, 0.942),
0 0 0.787em hsla(310, 100%, 73%, 0.944),
0 0 0.820em hsla(320, 100%, 73%, 0.947),
0 0 0.854em hsla(330, 100%, 73%, 0.950),
0 0 0.887em hsla(340, 100%, 73%, 0.953),
0 0 0.921em hsla(350, 100%, 73%, 0.956),
0 0 0.954em hsla(0, 100%, 73%, 0.958),
0 0 0.988em hsla(10, 100%, 73%, 0.961),
0 0 1.021em hsla(20, 100%, 73%, 0.964),
0 0 1.055em hsla(30, 100%, 73%, 0.967),
0 0 1.088em hsla(40, 100%, 73%, 0.969),
0 0 1.122em hsla(50, 100%, 73%, 0.972),
0 0 1.156em hsla(60, 100%, 73%, 0.975),
0 0 1.189em hsla(69, 100%, 73%, 0.978),
0 0 1.223em hsla(79, 100%, 73%, 0.981),
0 0 1.256em hsla(90, 100%, 73%, 0.983),
0 0 1.290em hsla(100, 100%, 73%, 0.986),
0 0 1.323em hsla(110, 100%, 73%, 0.989),
0 0 1.357em hsla(120, 100%, 73%, 0.992),
0 0 1.390em hsla(130, 100%, 73%, 0.994),
0 0 1.424em hsla(140, 100%, 73%, 0.997);
}
50.000% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0 0 0.250em hsla(180, 100%, 75%, 0.900),
0 0 0.285em hsla(190, 100%, 75%, 0.903),
0 0 0.319em hsla(200, 100%, 75%, 0.906),
0 0 0.354em hsla(210, 100%, 75%, 0.908),
0 0 0.389em hsla(220, 100%, 75%, 0.911),
0 0 0.424em hsla(230, 100%, 75%, 0.914),
0 0 0.458em hsla(240, 100%, 75%, 0.917),
0 0 0.493em hsla(250, 100%, 75%, 0.919),
0 0 0.528em hsla(260, 100%, 75%, 0.922),
0 0 0.563em hsla(270, 100%, 75%, 0.925),
0 0 0.597em hsla(280, 100%, 75%, 0.928),
0 0 0.632em hsla(290, 100%, 75%, 0.931),
0 0 0.667em hsla(300, 100%, 75%, 0.933),
0 0 0.701em hsla(310, 100%, 75%, 0.936),
0 0 0.736em hsla(320, 100%, 75%, 0.939),
0 0 0.771em hsla(330, 100%, 75%, 0.942),
0 0 0.806em hsla(340, 100%, 75%, 0.944),
0 0 0.840em hsla(350, 100%, 75%, 0.947),
0 0 0.875em hsla(0, 100%, 75%, 0.950),
0 0 0.910em hsla(10, 100%, 75%, 0.953),
0 0 0.944em hsla(20, 100%, 75%, 0.956),
0 0 0.979em hsla(30, 100%, 75%, 0.958),
0 0 1.014em hsla(40, 100%, 75%, 0.961),
0 0 1.049em hsla(50, 100%, 75%, 0.964),
0 0 1.083em hsla(60, 100%, 75%, 0.967),
0 0 1.118em hsla(70, 100%, 75%, 0.969),
0 0 1.153em hsla(80, 100%, 75%, 0.972),
0 0 1.188em hsla(90, 100%, 75%, 0.975),
0 0 1.222em hsla(99, 100%, 75%, 0.978),
0 0 1.257em hsla(109, 100%, 75%, 0.981),
0 0 1.292em hsla(120, 100%, 75%, 0.983),
0 0 1.326em hsla(130, 100%, 75%, 0.986),
0 0 1.361em hsla(140, 100%, 75%, 0.989),
0 0 1.396em hsla(150, 100%, 75%, 0.992),
0 0 1.431em hsla(160, 100%, 75%, 0.994),
0 0 1.465em hsla(170, 100%, 75%, 0.997);
}
58.333% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0 0 0.250em hsla(209, 100%, 73%, 0.900),
0 0 0.284em hsla(219, 100%, 73%, 0.903),
0 0 0.317em hsla(229, 100%, 73%, 0.906),
0 0 0.351em hsla(239, 100%, 73%, 0.908),
0 0 0.384em hsla(249, 100%, 73%, 0.911),
0 0 0.418em hsla(260, 100%, 73%, 0.914),
0 0 0.451em hsla(270, 100%, 73%, 0.917),
0 0 0.485em hsla(279, 100%, 73%, 0.919),
0 0 0.518em hsla(290, 100%, 73%, 0.922),
0 0 0.552em hsla(300, 100%, 73%, 0.925),
0 0 0.585em hsla(310, 100%, 73%, 0.928),
0 0 0.619em hsla(319, 100%, 73%, 0.931),
0 0 0.652em hsla(330, 100%, 73%, 0.933),
0 0 0.686em hsla(340, 100%, 73%, 0.936),
0 0 0.720em hsla(349, 100%, 73%, 0.939),
0 0 0.753em hsla(0, 100%, 73%, 0.942),
0 0 0.787em hsla(10, 100%, 73%, 0.944),
0 0 0.820em hsla(20, 100%, 73%, 0.947),
0 0 0.854em hsla(30, 100%, 73%, 0.950),
0 0 0.887em hsla(40, 100%, 73%, 0.953),
0 0 0.921em hsla(50, 100%, 73%, 0.956),
0 0 0.954em hsla(59, 100%, 73%, 0.958),
0 0 0.988em hsla(69, 100%, 73%, 0.961),
0 0 1.021em hsla(79, 100%, 73%, 0.964),
0 0 1.055em hsla(90, 100%, 73%, 0.967),
0 0 1.088em hsla(100, 100%, 73%, 0.969),
0 0 1.122em hsla(110, 100%, 73%, 0.972),
0 0 1.156em hsla(120, 100%, 73%, 0.975),
0 0 1.189em hsla(129, 100%, 73%, 0.978),
0 0 1.223em hsla(139, 100%, 73%, 0.981),
0 0 1.256em hsla(150, 100%, 73%, 0.983),
0 0 1.290em hsla(160, 100%, 73%, 0.986),
0 0 1.323em hsla(170, 100%, 73%, 0.989),
0 0 1.357em hsla(180, 100%, 73%, 0.992),
0 0 1.390em hsla(190, 100%, 73%, 0.994),
0 0 1.424em hsla(200, 100%, 73%, 0.997);
}
66.667% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0 0 0.250em hsla(240, 100%, 68%, 0.900),
0 0 0.280em hsla(250, 100%, 68%, 0.903),
0 0 0.310em hsla(260, 100%, 68%, 0.906),
0 0 0.340em hsla(270, 100%, 68%, 0.908),
0 0 0.370em hsla(280, 100%, 68%, 0.911),
0 0 0.400em hsla(290, 100%, 68%, 0.914),
0 0 0.430em hsla(300, 100%, 68%, 0.917),
0 0 0.460em hsla(310, 100%, 68%, 0.919),
0 0 0.491em hsla(320, 100%, 68%, 0.922),
0 0 0.521em hsla(330, 100%, 68%, 0.925),
0 0 0.551em hsla(340, 100%, 68%, 0.928),
0 0 0.581em hsla(350, 100%, 68%, 0.931),
0 0 0.611em hsla(0, 100%, 68%, 0.933),
0 0 0.641em hsla(10, 100%, 68%, 0.936),
0 0 0.671em hsla(20, 100%, 68%, 0.939),
0 0 0.701em hsla(30, 100%, 68%, 0.942),
0 0 0.731em hsla(40, 100%, 68%, 0.944),
0 0 0.761em hsla(50, 100%, 68%, 0.947),
0 0 0.791em hsla(60, 100%, 68%, 0.950),
0 0 0.821em hsla(70, 100%, 68%, 0.953),
0 0 0.851em hsla(80, 100%, 68%, 0.956),
0 0 0.881em hsla(90, 100%, 68%, 0.958),
0 0 0.912em hsla(100, 100%, 68%, 0.961),
0 0 0.942em hsla(110, 100%, 68%, 0.964),
0 0 0.972em hsla(120, 100%, 68%, 0.967),
0 0 1.002em hsla(130, 100%, 68%, 0.969),
0 0 1.032em hsla(140, 100%, 68%, 0.972),
0 0 1.062em hsla(150, 100%, 68%, 0.975),
0 0 1.092em hsla(160, 100%, 68%, 0.978),
0 0 1.122em hsla(170, 100%, 68%, 0.981),
0 0 1.152em hsla(180, 100%, 68%, 0.983),
0 0 1.182em hsla(190, 100%, 68%, 0.986),
0 0 1.212em hsla(200, 100%, 68%, 0.989),
0 0 1.242em hsla(210, 100%, 68%, 0.992),
0 0 1.272em hsla(220, 100%, 68%, 0.994),
0 0 1.302em hsla(230, 100%, 68%, 0.997);
}
75.000% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0 0 0.250em hsla(270, 100%, 60%, 0.900),
0 0 0.275em hsla(280, 100%, 60%, 0.903),
0 0 0.299em hsla(290, 100%, 60%, 0.906),
0 0 0.324em hsla(300, 100%, 60%, 0.908),
0 0 0.348em hsla(310, 100%, 60%, 0.911),
0 0 0.373em hsla(320, 100%, 60%, 0.914),
0 0 0.397em hsla(330, 100%, 60%, 0.917),
0 0 0.422em hsla(340, 100%, 60%, 0.919),
0 0 0.446em hsla(350, 100%, 60%, 0.922),
0 0 0.471em hsla(0, 100%, 60%, 0.925),
0 0 0.496em hsla(10, 100%, 60%, 0.928),
0 0 0.520em hsla(20, 100%, 60%, 0.931),
0 0 0.545em hsla(30, 100%, 60%, 0.933),
0 0 0.569em hsla(40, 100%, 60%, 0.936),
0 0 0.594em hsla(50, 100%, 60%, 0.939),
0 0 0.618em hsla(60, 100%, 60%, 0.942),
0 0 0.643em hsla(70, 100%, 60%, 0.944),
0 0 0.667em hsla(80, 100%, 60%, 0.947),
0 0 0.692em hsla(90, 100%, 60%, 0.950),
0 0 0.716em hsla(100, 100%, 60%, 0.953),
0 0 0.741em hsla(110, 100%, 60%, 0.956),
0 0 0.766em hsla(120, 100%, 60%, 0.958),
0 0 0.790em hsla(130, 100%, 60%, 0.961),
0 0 0.815em hsla(140, 100%, 60%, 0.964),
0 0 0.839em hsla(150, 100%, 60%, 0.967),
0 0 0.864em hsla(160, 100%, 60%, 0.969),
0 0 0.888em hsla(170, 100%, 60%, 0.972),
0 0 0.913em hsla(180, 100%, 60%, 0.975),
0 0 0.937em hsla(190, 100%, 60%, 0.978),
0 0 0.962em hsla(200, 100%, 60%, 0.981),
0 0 0.987em hsla(210, 100%, 60%, 0.983),
0 0 1.011em hsla(220, 100%, 60%, 0.986),
0 0 1.036em hsla(230, 100%, 60%, 0.989),
0 0 1.060em hsla(240, 100%, 60%, 0.992),
0 0 1.085em hsla(250, 100%, 60%, 0.994),
0 0 1.109em hsla(260, 100%, 60%, 0.997);
}
83.333% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0 0 0.250em hsla(300, 100%, 50%, 0.900),
0 0 0.267em hsla(310, 100%, 50%, 0.903),
0 0 0.285em hsla(320, 100%, 50%, 0.906),
0 0 0.302em hsla(330, 100%, 50%, 0.908),
0 0 0.319em hsla(340, 100%, 50%, 0.911),
0 0 0.337em hsla(350, 100%, 50%, 0.914),
0 0 0.354em hsla(0, 100%, 50%, 0.917),
0 0 0.372em hsla(10, 100%, 50%, 0.919),
0 0 0.389em hsla(20, 100%, 50%, 0.922),
0 0 0.406em hsla(30, 100%, 50%, 0.925),
0 0 0.424em hsla(40, 100%, 50%, 0.928),
0 0 0.441em hsla(50, 100%, 50%, 0.931),
0 0 0.458em hsla(60, 100%, 50%, 0.933),
0 0 0.476em hsla(70, 100%, 50%, 0.936),
0 0 0.493em hsla(80, 100%, 50%, 0.939),
0 0 0.510em hsla(90, 100%, 50%, 0.942),
0 0 0.528em hsla(100, 100%, 50%, 0.944),
0 0 0.545em hsla(110, 100%, 50%, 0.947),
0 0 0.563em hsla(120, 100%, 50%, 0.950),
0 0 0.580em hsla(130, 100%, 50%, 0.953),
0 0 0.597em hsla(140, 100%, 50%, 0.956),
0 0 0.615em hsla(150, 100%, 50%, 0.958),
0 0 0.632em hsla(160, 100%, 50%, 0.961),
0 0 0.649em hsla(170, 100%, 50%, 0.964),
0 0 0.667em hsla(180, 100%, 50%, 0.967),
0 0 0.684em hsla(190, 100%, 50%, 0.969),
0 0 0.701em hsla(200, 100%, 50%, 0.972),
0 0 0.719em hsla(210, 100%, 50%, 0.975),
0 0 0.736em hsla(220, 100%, 50%, 0.978),
0 0 0.753em hsla(230, 100%, 50%, 0.981),
0 0 0.771em hsla(240, 100%, 50%, 0.983),
0 0 0.788em hsla(250, 100%, 50%, 0.986),
0 0 0.806em hsla(260, 100%, 50%, 0.989),
0 0 0.823em hsla(270, 100%, 50%, 0.992),
0 0 0.840em hsla(280, 100%, 50%, 0.994),
0 0 0.858em hsla(290, 100%, 50%, 0.997);
}
91.667% {
text-shadow: 0.05em 0.05em 0.1em rgba(0,0,0,1),
0 0 1px rgb(0,0,0),
0 0 3px rgb(255,255,255),
0 0 0.250em hsla(330, 100%, 38%, 0.900),
0 0 0.259em hsla(340, 100%, 38%, 0.903),
0 0 0.268em hsla(350, 100%, 38%, 0.906),
0 0 0.277em hsla(0, 100%, 38%, 0.908),
0 0 0.286em hsla(10, 100%, 38%, 0.911),
0 0 0.295em hsla(20, 100%, 38%, 0.914),
0 0 0.304em hsla(30, 100%, 38%, 0.917),
0 0 0.313em hsla(40, 100%, 38%, 0.919),
0 0 0.322em hsla(50, 100%, 38%, 0.922),
0 0 0.331em hsla(60, 100%, 38%, 0.925),
0 0 0.340em hsla(70, 100%, 38%, 0.928),
0 0 0.349em hsla(80, 100%, 38%, 0.931),
0 0 0.358em hsla(90, 100%, 38%, 0.933),
0 0 0.367em hsla(100, 100%, 38%, 0.936),
0 0 0.376em hsla(110, 100%, 38%, 0.939),
0 0 0.385em hsla(120, 100%, 38%, 0.942),
0 0 0.394em hsla(130, 100%, 38%, 0.944),
0 0 0.403em hsla(140, 100%, 38%, 0.947),
0 0 0.412em hsla(150, 100%, 38%, 0.950),
0 0 0.421em hsla(160, 100%, 38%, 0.953),
0 0 0.430em hsla(170, 100%, 38%, 0.956),
0 0 0.439em hsla(180, 100%, 38%, 0.958),
0 0 0.448em hsla(190, 100%, 38%, 0.961),
0 0 0.457em hsla(200, 100%, 38%, 0.964),
0 0 0.466em hsla(210, 100%, 38%, 0.967),
0 0 0.475em hsla(220, 100%, 38%, 0.969),
0 0 0.484em hsla(230, 100%, 38%, 0.972),
0 0 0.493em hsla(240, 100%, 38%, 0.975),
0 0 0.502em hsla(250, 100%, 38%, 0.978),
0 0 0.511em hsla(260, 100%, 38%, 0.981),
0 0 0.520em hsla(270, 100%, 38%, 0.983),
0 0 0.529em hsla(280, 100%, 38%, 0.986),
0 0 0.538em hsla(290, 100%, 38%, 0.989),
0 0 0.547em hsla(300, 100%, 38%, 0.992),
0 0 0.556em hsla(310, 100%, 38%, 0.994),
0 0 0.565em hsla(320, 100%, 38%, 0.997);
}
}
.rbFuzz {
animation: rainbowizeColorDark 41s -17s infinite normal ease,
kfRainbowFuzz 11s -5s infinite normal linear;
}
.rbFuzz2 {
animation: rainbowizeColorBright 37s -11s infinite normal linear,
kfRainbowFuzz 7s 0 infinite alternate-reverse ease;
}
Raw
styles
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery-ui-bootstrap/0.5pre/assets/css/bootstrap.min.css" rel="stylesheet" />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment