diff --git a/s/css/cyber.css b/s/css/cyber.css new file mode 100644 index 0000000..0108c1d --- /dev/null +++ b/s/css/cyber.css @@ -0,0 +1,538 @@ +@import url('https://fonts.googleapis.com/css?family=Oswald:700|Press+Start+2P'); + +body { + margin: 1em auto 3em auto; + background-color: rgb(10, 10, 10); + color: #01ffbd; + font-family: 'Oswald', sans-serif; + font-size: 17px; +} + +a { + color: #f300ff; + text-decoration: none; +} + +a:hover { + color: #ffffff; + text-decoration: none; +} + +.return { + text-align: center; + font-family: 'Press Start 2P', cursive; + font-size: 29px; + text-decoration: none; + animation: glitch2 2s steps(100) infinite; + color: white; +} + +.thumb { + border: 2px solid rgb(4, 232, 189); +} + +/* Color the Controls */ +a#next { + color: #01f4b5; +} + +a#next:hover { + animation: glitch2 2s steps(100) infinite; +} + +a#random { + color: #01f4b5; +} + +a#random:hover { + animation: glitch2 2s steps(100) infinite; +} + +a#prev { + color: #01f4b5; +} + +a#prev:hover { + animation: glitch2 2s steps(100) infinite; +} + +a#holland { + color: white; +} + +a#holland:hover { + color: #cc0ccb; + animation: glitch2 2s steps(100) infinite; +} + +/* PANEL */ +.panel { + background-color: rgba(4, 27, 23, 0.61); + border: 5px solid #9a0039; +} + +@keyframes noise-anim { + 0% { + clip: rect(2px, 9999px, 94px, 0); + } + 5% { + clip: rect(89px, 9999px, 60px, 0); + } + 10% { + clip: rect(66px, 9999px, 50px, 0); + } + 15% { + clip: rect(3px, 9999px, 54px, 0); + } + 20% { + clip: rect(26px, 9999px, 19px, 0); + } + 25% { + clip: rect(20px, 9999px, 66px, 0); + } + 30% { + clip: rect(18px, 9999px, 43px, 0); + } + 35% { + clip: rect(54px, 9999px, 48px, 0); + } + 40% { + clip: rect(33px, 9999px, 66px, 0); + } + 45% { + clip: rect(24px, 9999px, 61px, 0); + } + 50% { + clip: rect(30px, 9999px, 18px, 0); + } + 55% { + clip: rect(16px, 9999px, 96px, 0); + } + 60% { + clip: rect(2px, 9999px, 20px, 0); + } + 65% { + clip: rect(84px, 9999px, 19px, 0); + } + 70% { + clip: rect(50px, 9999px, 5px, 0); + } + 75% { + clip: rect(60px, 9999px, 80px, 0); + } + 80% { + clip: rect(26px, 9999px, 96px, 0); + } + 85% { + clip: rect(100px, 9999px, 74px, 0); + } + 90% { + clip: rect(82px, 9999px, 29px, 0); + } + 95% { + clip: rect(34px, 9999px, 97px, 0); + } + 100% { + clip: rect(91px, 9999px, 44px, 0); + } +} + +.return:after { + content: attr(class="return"); + position: absolute; + left: 2px; + text-shadow: -1px 0 red; + top: 0; + color: white; + background: black; + overflow: hidden; + clip: rect(0, 900px, 0, 0); + animation: noise-anim 2s infinite linear alternate-reverse; +} + +@keyframes noise-anim-2 { + 0% { + clip: rect(76px, 9999px, 52px, 0); + } + 5% { + clip: rect(5px, 9999px, 11px, 0); + } + 10% { + clip: rect(25px, 9999px, 9px, 0); + } + 15% { + clip: rect(56px, 9999px, 30px, 0); + } + 20% { + clip: rect(63px, 9999px, 93px, 0); + } + 25% { + clip: rect(84px, 9999px, 63px, 0); + } + 30% { + clip: rect(55px, 9999px, 54px, 0); + } + 35% { + clip: rect(53px, 9999px, 52px, 0); + } + 40% { + clip: rect(40px, 9999px, 66px, 0); + } + 45% { + clip: rect(50px, 9999px, 15px, 0); + } + 50% { + clip: rect(90px, 9999px, 31px, 0); + } + 55% { + clip: rect(33px, 9999px, 4px, 0); + } + 60% { + clip: rect(18px, 9999px, 57px, 0); + } + 65% { + clip: rect(2px, 9999px, 21px, 0); + } + 70% { + clip: rect(38px, 9999px, 93px, 0); + } + 75% { + clip: rect(61px, 9999px, 44px, 0); + } + 80% { + clip: rect(83px, 9999px, 27px, 0); + } + 85% { + clip: rect(80px, 9999px, 51px, 0); + } + 90% { + clip: rect(91px, 9999px, 39px, 0); + } + 95% { + clip: rect(59px, 9999px, 36px, 0); + } + 100% { + clip: rect(74px, 9999px, 80px, 0); + } +} +.return:before { + content: attr(data-text); + position: absolute; + left: -2px; + text-shadow: 1px 0 blue; + top: 0; + color: white; + background: transparent; + overflow: hidden; + clip: rect(0, 900px, 0, 0); + animation: noise-anim-2 3s infinite linear alternate-reverse; +} + +@keyframes glitch2 { + 0% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 1% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 2% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 3% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 4% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 5% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 6% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 7% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 8% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 9% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 10% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 11% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 12% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 13% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 14% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 15% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 16% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 17% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 18% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 19% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 20% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 21% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 22% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 23% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 24% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 25% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 26% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 27% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 28% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 29% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 30% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 31% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 32% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 33% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 34% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 35% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 36% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 37% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 38% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 39% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 40% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 41% { + text-shadow: 50px 0 0 blue, -50px 0 0 lime; + } + 42% { + text-shadow: 0 0 0 blue, 0 0 0 lime; + } + 43% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 44% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 45% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 46% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 47% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 48% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 49% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 50% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 51% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 52% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 53% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 54% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 55% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 56% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 57% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 58% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 59% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 60% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 61% { + text-shadow: 30px 0 0 red, -30px 0 0 lime; + } + 62% { + text-shadow: 0 0 0 red, 0 0 0 lime; + } + 63% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 blue; + } + 64% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 blue; + } + 65% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 blue; + } + 66% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 blue; + } + 67% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 68% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 69% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 70% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 71% { + text-shadow: 70px 0 0 red, -70px 0 0 blue; + } + 72% { + text-shadow: 0 0 0 red, 0 0 0 blue; + } + 73% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 74% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 75% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 76% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 77% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 78% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 79% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 80% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 81% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 82% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 83% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 84% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 85% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 86% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 87% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 88% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 89% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 90% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 91% { + text-shadow: 60px 0 0 lime, -60px 0 0 blue; + } + 92% { + text-shadow: 0 0 0 lime, 0 0 0 blue; + } + 92% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 93% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 94% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 95% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 96% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 97% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 98% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 99% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 100% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } +} diff --git a/s/cyber.css b/s/cyber.css new file mode 100644 index 0000000..9e50b8d --- /dev/null +++ b/s/cyber.css @@ -0,0 +1,547 @@ +@import url('https://fonts.googleapis.com/css?family=Oswald:700|Press+Start+2P'); + +body { + margin: 1em auto 3em auto; + background-color: rgb(10, 10, 10); + color: #01ffbd; + font-family: 'Oswald', sans-serif; + font-size: 17px; +} + +a { + color: #f300ff; + text-decoration: none; +} + +input, select, textarea { + border: 1px double #00ffc4; + border-radius: 5px; + background: #9a0039; + color: #ACACAC; + font-size: 80%; + font-family: 'Oswald', sans-serif; +} + +a:hover { + color: #ffffff; + text-decoration: none; +} + +.return { + text-align: center; + font-family: 'Press Start 2P', cursive; + font-size: 29px; + text-decoration: none; + animation: glitch2 2s steps(100) infinite; + color: white; +} + +.thumb { + border: 2px solid rgb(4, 232, 189); +} + +/* Color the Controls */ +a#next { + color: #01f4b5; +} + +a#next:hover { + animation: glitch2 2s steps(100) infinite; +} + +a#random { + color: #01f4b5; +} + +a#random:hover { + animation: glitch2 2s steps(100) infinite; +} + +a#prev { + color: #01f4b5; +} + +a#prev:hover { + animation: glitch2 2s steps(100) infinite; +} + +a#holland { + color: white; +} + +a#holland:hover { + color: #cc0ccb; + animation: glitch2 2s steps(100) infinite; +} + +/* PANEL */ +.panel { + background-color: rgba(4, 27, 23, 0.61); + border: 5px solid #9a0039; +} + +@keyframes noise-anim { + 0% { + clip: rect(2px, 9999px, 94px, 0); + } + 5% { + clip: rect(89px, 9999px, 60px, 0); + } + 10% { + clip: rect(66px, 9999px, 50px, 0); + } + 15% { + clip: rect(3px, 9999px, 54px, 0); + } + 20% { + clip: rect(26px, 9999px, 19px, 0); + } + 25% { + clip: rect(20px, 9999px, 66px, 0); + } + 30% { + clip: rect(18px, 9999px, 43px, 0); + } + 35% { + clip: rect(54px, 9999px, 48px, 0); + } + 40% { + clip: rect(33px, 9999px, 66px, 0); + } + 45% { + clip: rect(24px, 9999px, 61px, 0); + } + 50% { + clip: rect(30px, 9999px, 18px, 0); + } + 55% { + clip: rect(16px, 9999px, 96px, 0); + } + 60% { + clip: rect(2px, 9999px, 20px, 0); + } + 65% { + clip: rect(84px, 9999px, 19px, 0); + } + 70% { + clip: rect(50px, 9999px, 5px, 0); + } + 75% { + clip: rect(60px, 9999px, 80px, 0); + } + 80% { + clip: rect(26px, 9999px, 96px, 0); + } + 85% { + clip: rect(100px, 9999px, 74px, 0); + } + 90% { + clip: rect(82px, 9999px, 29px, 0); + } + 95% { + clip: rect(34px, 9999px, 97px, 0); + } + 100% { + clip: rect(91px, 9999px, 44px, 0); + } +} + +.return:after { + content: attr(class="return"); + position: absolute; + left: 2px; + text-shadow: -1px 0 red; + top: 0; + color: white; + background: black; + overflow: hidden; + clip: rect(0, 900px, 0, 0); + animation: noise-anim 2s infinite linear alternate-reverse; +} + +@keyframes noise-anim-2 { + 0% { + clip: rect(76px, 9999px, 52px, 0); + } + 5% { + clip: rect(5px, 9999px, 11px, 0); + } + 10% { + clip: rect(25px, 9999px, 9px, 0); + } + 15% { + clip: rect(56px, 9999px, 30px, 0); + } + 20% { + clip: rect(63px, 9999px, 93px, 0); + } + 25% { + clip: rect(84px, 9999px, 63px, 0); + } + 30% { + clip: rect(55px, 9999px, 54px, 0); + } + 35% { + clip: rect(53px, 9999px, 52px, 0); + } + 40% { + clip: rect(40px, 9999px, 66px, 0); + } + 45% { + clip: rect(50px, 9999px, 15px, 0); + } + 50% { + clip: rect(90px, 9999px, 31px, 0); + } + 55% { + clip: rect(33px, 9999px, 4px, 0); + } + 60% { + clip: rect(18px, 9999px, 57px, 0); + } + 65% { + clip: rect(2px, 9999px, 21px, 0); + } + 70% { + clip: rect(38px, 9999px, 93px, 0); + } + 75% { + clip: rect(61px, 9999px, 44px, 0); + } + 80% { + clip: rect(83px, 9999px, 27px, 0); + } + 85% { + clip: rect(80px, 9999px, 51px, 0); + } + 90% { + clip: rect(91px, 9999px, 39px, 0); + } + 95% { + clip: rect(59px, 9999px, 36px, 0); + } + 100% { + clip: rect(74px, 9999px, 80px, 0); + } +} +.return:before { + content: attr(data-text); + position: absolute; + left: -2px; + text-shadow: 1px 0 blue; + top: 0; + color: white; + background: transparent; + overflow: hidden; + clip: rect(0, 900px, 0, 0); + animation: noise-anim-2 3s infinite linear alternate-reverse; +} + +@keyframes glitch2 { + 0% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 1% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 2% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 3% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 4% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 5% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 6% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 7% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 8% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 9% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 10% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 11% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 12% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 13% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 14% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 15% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 16% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 17% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 18% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 19% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 20% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 21% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 22% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 23% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 24% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 25% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 26% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 27% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 28% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 29% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 30% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 31% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 32% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 33% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 34% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 35% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 36% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 37% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 38% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 39% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 40% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 41% { + text-shadow: 50px 0 0 blue, -50px 0 0 lime; + } + 42% { + text-shadow: 0 0 0 blue, 0 0 0 lime; + } + 43% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 44% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 45% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 46% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 47% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 48% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 49% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 50% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 51% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 52% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 53% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 54% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 55% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 56% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 57% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 58% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 59% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 60% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 61% { + text-shadow: 30px 0 0 red, -30px 0 0 lime; + } + 62% { + text-shadow: 0 0 0 red, 0 0 0 lime; + } + 63% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 blue; + } + 64% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 blue; + } + 65% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 blue; + } + 66% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 blue; + } + 67% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 68% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 69% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 70% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 71% { + text-shadow: 70px 0 0 red, -70px 0 0 blue; + } + 72% { + text-shadow: 0 0 0 red, 0 0 0 blue; + } + 73% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 74% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 75% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 76% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 77% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 78% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 79% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 80% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 81% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 82% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 83% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 84% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 85% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 86% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 87% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 88% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 89% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 90% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 91% { + text-shadow: 60px 0 0 lime, -60px 0 0 blue; + } + 92% { + text-shadow: 0 0 0 lime, 0 0 0 blue; + } + 92% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 93% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 94% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 95% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 96% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 97% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 98% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 99% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 100% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } +} diff --git a/s/index.tpl.html b/s/index.tpl.html index 83a6f45..b037ef0 100644 --- a/s/index.tpl.html +++ b/s/index.tpl.html @@ -6,7 +6,7 @@ - +