real-world-css-libraries 1.0.3 → 1.0.5

package/libs/obnoxious-v3.5.2.css

@@ -0,0 +1,1144 @@
+/* https://github.com/tholman/obnoxious.css/blob/master/obnoxious.css */
+@keyframes fontalicious {
+  0% {
+    font-family: helvetica;
+  }
+  10% {
+    font-family: times;
+  }
+  20% {
+    font-family: fantasy;
+  }
+  30% {
+    font-family: monospace;
+  }
+  40% {
+    font-family: Palatino;
+  }
+  50% {
+    font-family: Tahoma;
+  }
+  60% {
+    font-family: impact;
+  }
+  70% {
+    font-family: cursive;
+  }
+  80% {
+    font-family: monospace;
+  }
+  90% {
+    font-family: fantasy;
+  }
+  99% {
+    font-family: futura;
+  }
+  100% {
+  }
+}
+
+.fontalicious {
+  animation-name: fontalicious;
+  animation-iteration-count: 4;
+  animation-duration: 1s;
+}
+
+/**
+ * Animations
+ */
+.animated {
+  animation-fill-mode: both;
+}
+
+/**
+ * Intensifies
+ * - Slowly increases in shaking and madness
+ */
+@keyframes intensifies {
+  0% {
+    transform: translate(1px, 1px) scale(1);
+  }
+  1% {
+    transform: translate(-1px, -1px) scale(1.02);
+  }
+  2% {
+    transform: translate(1px, 2px) scale(1.04);
+  }
+  3% {
+    transform: translate(-3px, -1px) scale(1.06);
+  }
+  4% {
+    transform: translate(3px, 3px) scale(1.08);
+  }
+  5% {
+    transform: translate(-4px, -5px) scale(1.1);
+  }
+  6% {
+    transform: translate(4px, 4px) scale(1.12);
+  }
+  7% {
+    transform: translate(-1px, -2px) scale(1.14);
+  }
+  8% {
+    transform: translate(5px, 1px) scale(1.16);
+  }
+  9% {
+    transform: translate(-4px, -10px) scale(1.18);
+  }
+  10% {
+    transform: translate(7px, 7px) scale(1.2);
+  }
+  11% {
+    transform: translate(-8px, -7px) scale(1.22);
+  }
+  12% {
+    transform: translate(1px, 8px) scale(1.24);
+  }
+  13% {
+    transform: translate(-2px, -10px) scale(1.26);
+  }
+  14% {
+    transform: translate(14px, 7px) scale(1.28);
+  }
+  15% {
+    transform: translate(-14px, -6px) scale(1.3);
+  }
+  16% {
+    transform: translate(2px, 6px) scale(1.32);
+  }
+  17% {
+    transform: translate(-16px, -4px) scale(1.34);
+  }
+  18% {
+    transform: translate(11px, 12px) scale(1.36);
+  }
+  19% {
+    transform: translate(-4px, -17px) scale(1.38);
+  }
+  20% {
+    transform: translate(12px, 7px) scale(1.4);
+  }
+  21% {
+    transform: translate(-11px, -13px) scale(1.42);
+  }
+  22% {
+    transform: translate(4px, 22px) scale(1.44);
+  }
+  23% {
+    transform: translate(-13px, -24px) scale(1.46);
+  }
+  24% {
+    transform: translate(23px, 5px) scale(1.48);
+  }
+  25% {
+    transform: translate(-15px, -16px) scale(1.5);
+  }
+  26% {
+    transform: translate(16px, 7px) scale(1.52);
+  }
+  27% {
+    transform: translate(-25px, -11px) scale(1.54);
+  }
+  28% {
+    transform: translate(25px, 20px) scale(1.56);
+  }
+  29% {
+    transform: translate(-16px, -20px) scale(1.58);
+  }
+  30% {
+    transform: translate(12px, 23px) scale(1.6);
+  }
+  31% {
+    transform: translate(-15px, -18px) scale(1.62);
+  }
+  32% {
+    transform: translate(3px, 27px) scale(1.64);
+  }
+  33% {
+    transform: translate(-18px, -14px) scale(1.66);
+  }
+  34% {
+    transform: translate(14px, 9px) scale(1.68);
+  }
+  35% {
+    transform: translate(-28px, -23px) scale(1.7);
+  }
+  36% {
+    transform: translate(12px, 30px) scale(1.72);
+  }
+  37% {
+    transform: translate(-25px, -27px) scale(1.74);
+  }
+  38% {
+    transform: translate(39px, 1px) scale(1.76);
+  }
+  39% {
+    transform: translate(-10px, -32px) scale(1.78);
+  }
+  40% {
+    transform: translate(15px, 35px) scale(1.8);
+  }
+  41% {
+    transform: translate(-27px, -15px) scale(1.82);
+  }
+  42% {
+    transform: translate(15px, 41px) scale(1.84);
+  }
+  43% {
+    transform: translate(-39px, -4px) scale(1.86);
+  }
+  44% {
+    transform: translate(34px, 19px) scale(1.88);
+  }
+  45% {
+    transform: translate(-4px, -45px) scale(1.9);
+  }
+  46% {
+    transform: translate(38px, 7px) scale(1.92);
+  }
+  47% {
+    transform: translate(-21px, -1px) scale(1.94);
+  }
+  48% {
+    transform: translate(19px, 6px) scale(1.96);
+  }
+  49% {
+    transform: translate(-49px, -25px) scale(1.98);
+  }
+  50% {
+    transform: translate(25px, 25px) scale(2);
+  }
+  51% {
+    transform: translate(-33px, -24px) scale(2.02);
+  }
+  52% {
+    transform: translate(45px, 36px) scale(2.04);
+  }
+  53% {
+    transform: translate(-44px, -7px) scale(2.06);
+  }
+  54% {
+    transform: translate(30px, 28px) scale(2.08);
+  }
+  55% {
+    transform: translate(-4px, -27px) scale(2.1);
+  }
+  56% {
+    transform: translate(17px, 18px) scale(2.12);
+  }
+  57% {
+    transform: translate(-4px, -12px) scale(2.14);
+  }
+  58% {
+    transform: translate(1px, 50px) scale(2.16);
+  }
+  59% {
+    transform: translate(-8px, -36px) scale(2.18);
+  }
+  60% {
+    transform: translate(29px, 26px) scale(2.2);
+  }
+  61% {
+    transform: translate(-24px, -21px) scale(2.22);
+  }
+  62% {
+    transform: translate(60px, 21px) scale(2.24);
+  }
+  63% {
+    transform: translate(-9px, -36px) scale(2.26);
+  }
+  64% {
+    transform: translate(44px, 1px) scale(2.28);
+  }
+  65% {
+    transform: translate(-38px, -40px) scale(2.3);
+  }
+  66% {
+    transform: translate(42px, 33px) scale(2.32);
+  }
+  67% {
+    transform: translate(-17px, -45px) scale(2.34);
+  }
+  68% {
+    transform: translate(1px, 17px) scale(2.36);
+  }
+  69% {
+    transform: translate(-20px, -62px) scale(2.38);
+  }
+  70% {
+    transform: translate(6px, 53px) scale(2.4);
+  }
+  71% {
+    transform: translate(-64px, -14px) scale(2.42);
+  }
+  72% {
+    transform: translate(67px, 48px) scale(2.44);
+  }
+  73% {
+    transform: translate(-47px, -39px) scale(2.46);
+  }
+  74% {
+    transform: translate(5px, 62px) scale(2.48);
+  }
+  75% {
+    transform: translate(-29px, -50px) scale(2.5);
+  }
+  76% {
+    transform: translate(5px, 60px) scale(2.52);
+  }
+  77% {
+    transform: translate(-51px, -76px) scale(2.54);
+  }
+  78% {
+    transform: translate(58px, 16px) scale(2.56);
+  }
+  79% {
+    transform: translate(-79px, -32px) scale(2.58);
+  }
+  80% {
+    transform: translate(41px, 22px) scale(2.6);
+  }
+  81% {
+    transform: translate(-43px, -48px) scale(2.62);
+  }
+  82% {
+    transform: translate(35px, 65px) scale(2.64);
+  }
+  83% {
+    transform: translate(-65px, -84px) scale(2.66);
+  }
+  84% {
+    transform: translate(62px, 73px) scale(2.68);
+  }
+  85% {
+    transform: translate(-48px, -40px) scale(2.7);
+  }
+  86% {
+    transform: translate(30px, 25px) scale(2.72);
+  }
+  87% {
+    transform: translate(-16px, -46px) scale(2.74);
+  }
+  88% {
+    transform: translate(81px, 73px) scale(2.76);
+  }
+  89% {
+    transform: translate(-79px, -76px) scale(2.78);
+  }
+  90% {
+    transform: translate(55px, 62px) scale(2.8);
+  }
+  91% {
+    transform: translate(-44px, -56px) scale(2.82);
+  }
+  92% {
+    transform: translate(46px, 91px) scale(2.84);
+  }
+  93% {
+    transform: translate(-48px, -34px) scale(2.86);
+  }
+  94% {
+    transform: translate(18px, 10px) scale(2.88);
+  }
+  95% {
+    transform: translate(-11px, -4px) scale(2.9);
+  }
+  96% {
+    transform: translate(14px, 80px) scale(2.92);
+  }
+  97% {
+    transform: translate(-29px, -54px) scale(2.94);
+  }
+  98% {
+    transform: translate(51px, 95px) scale(2.96);
+  }
+  99% {
+    transform: translate(-71px, -4px) scale(2.98);
+  }
+  100% {
+    transform: translate(0, 0) rotate(0deg);
+  }
+}
+
+.intensifies {
+  animation-timing-function: ease-out;
+  transform-origin: bottom center;
+  animation-name: intensifies;
+  animation-duration: 5s;
+}
+
+/**
+ * Animations
+ */
+.animated {
+  animation-fill-mode: both;
+}
+
+/**
+ * Intensifies
+ * - Slowly increases in shaking and madness
+ */
+@keyframes shakeit {
+  0% {
+    transform: translate(0px, 0) rotate(0deg);
+  }
+  1% {
+    transform: translate(-2px, 0) rotate(-1deg);
+  }
+  2% {
+    transform: translate(4px, 0) rotate(2deg);
+  }
+  3% {
+    transform: translate(-6px, 0) rotate(-3deg);
+  }
+  4% {
+    transform: translate(8px, 0) rotate(4deg);
+  }
+  5% {
+    transform: translate(-10px, 0) rotate(-5deg);
+  }
+  6% {
+    transform: translate(12px, 0) rotate(6deg);
+  }
+  7% {
+    transform: translate(-14px, 0) rotate(-7deg);
+  }
+  8% {
+    transform: translate(16px, 0) rotate(8deg);
+  }
+  9% {
+    transform: translate(-18px, 0) rotate(-9deg);
+  }
+  10% {
+    transform: translate(20px, 0) rotate(8deg);
+  }
+  11% {
+    transform: translate(-22px, 0) rotate(-8deg);
+  }
+  12% {
+    transform: translate(24px, 0) rotate(8deg);
+  }
+  13% {
+    transform: translate(-26px, 0) rotate(-8deg);
+  }
+  14% {
+    transform: translate(28px, 0) rotate(8deg);
+  }
+  15% {
+    transform: translate(-30px, 0) rotate(-8deg);
+  }
+  16% {
+    transform: translate(32px, 0) rotate(8deg);
+  }
+  17% {
+    transform: translate(-34px, 0) rotate(-8deg);
+  }
+  18% {
+    transform: translate(36px, 0) rotate(8deg);
+  }
+  19% {
+    transform: translate(-38px, 0) rotate(-8deg);
+  }
+  20% {
+    transform: translate(40px, 0) rotate(8deg);
+  }
+  21% {
+    transform: translate(-42px, 0) rotate(-8deg);
+  }
+  22% {
+    transform: translate(44px, 0) rotate(8deg);
+  }
+  23% {
+    transform: translate(-46px, 0) rotate(-8deg);
+  }
+  24% {
+    transform: translate(48px, 0) rotate(8deg);
+  }
+  25% {
+    transform: translate(-50px, 0) rotate(-8deg);
+  }
+  26% {
+    transform: translate(52px, 0) rotate(8deg);
+  }
+  27% {
+    transform: translate(-54px, 0) rotate(-8deg);
+  }
+  28% {
+    transform: translate(56px, 0) rotate(8deg);
+  }
+  29% {
+    transform: translate(-58px, 0) rotate(-8deg);
+  }
+  30% {
+    transform: translate(60px, 0) rotate(8deg);
+  }
+  31% {
+    transform: translate(-62px, 0) rotate(-8deg);
+  }
+  32% {
+    transform: translate(64px, 0) rotate(8deg);
+  }
+  33% {
+    transform: translate(-66px, 0) rotate(-8deg);
+  }
+  34% {
+    transform: translate(68px, 0) rotate(8deg);
+  }
+  35% {
+    transform: translate(-70px, 0) rotate(-8deg);
+  }
+  36% {
+    transform: translate(72px, 0) rotate(8deg);
+  }
+  37% {
+    transform: translate(-74px, 0) rotate(-8deg);
+  }
+  38% {
+    transform: translate(76px, 0) rotate(8deg);
+  }
+  39% {
+    transform: translate(-78px, 0) rotate(-8deg);
+  }
+  40% {
+    transform: translate(80px, 0) rotate(8deg);
+  }
+  41% {
+    transform: translate(-82px, 0) rotate(-8deg);
+  }
+  42% {
+    transform: translate(84px, 0) rotate(8deg);
+  }
+  43% {
+    transform: translate(-86px, 0) rotate(-8deg);
+  }
+  44% {
+    transform: translate(88px, 0) rotate(8deg);
+  }
+  45% {
+    transform: translate(-90px, 0) rotate(-8deg);
+  }
+  46% {
+    transform: translate(92px, 0) rotate(8deg);
+  }
+  47% {
+    transform: translate(-94px, 0) rotate(-8deg);
+  }
+  48% {
+    transform: translate(96px, 0) rotate(8deg);
+  }
+  49% {
+    transform: translate(-98px, 0) rotate(-8deg);
+  }
+  50% {
+    transform: translate(100px, 0) rotate(8deg);
+  }
+  51% {
+    transform: translate(-102px, 0) rotate(-8deg);
+  }
+  52% {
+    transform: translate(104px, 0) rotate(8deg);
+  }
+  53% {
+    transform: translate(-106px, 0) rotate(-8deg);
+  }
+  54% {
+    transform: translate(108px, 0) rotate(8deg);
+  }
+  55% {
+    transform: translate(-110px, 0) rotate(-8deg);
+  }
+  56% {
+    transform: translate(112px, 0) rotate(8deg);
+  }
+  57% {
+    transform: translate(-114px, 0) rotate(-8deg);
+  }
+  58% {
+    transform: translate(116px, 0) rotate(8deg);
+  }
+  59% {
+    transform: translate(-118px, 0) rotate(-8deg);
+  }
+  60% {
+    transform: translate(120px, 0) rotate(8deg);
+  }
+  61% {
+    transform: translate(-122px, 0) rotate(-8deg);
+  }
+  62% {
+    transform: translate(124px, 0) rotate(8deg);
+  }
+  63% {
+    transform: translate(-126px, 0) rotate(-8deg);
+  }
+  64% {
+    transform: translate(128px, 0) rotate(8deg);
+  }
+  65% {
+    transform: translate(-130px, 0) rotate(-8deg);
+  }
+  66% {
+    transform: translate(132px, 0) rotate(8deg);
+  }
+  67% {
+    transform: translate(-134px, 0) rotate(-8deg);
+  }
+  68% {
+    transform: translate(136px, 0) rotate(8deg);
+  }
+  69% {
+    transform: translate(-138px, 0) rotate(-8deg);
+  }
+  70% {
+    transform: translate(140px, 0) rotate(8deg);
+  }
+  71% {
+    transform: translate(-142px, 0) rotate(-8deg);
+  }
+  72% {
+    transform: translate(144px, 0) rotate(8deg);
+  }
+  73% {
+    transform: translate(-146px, 0) rotate(-8deg);
+  }
+  74% {
+    transform: translate(148px, 0) rotate(8deg);
+  }
+  75% {
+    transform: translate(-150px, 0) rotate(-8deg);
+  }
+  76% {
+    transform: translate(152px, 0) rotate(8deg);
+  }
+  77% {
+    transform: translate(-154px, 0) rotate(-8deg);
+  }
+  78% {
+    transform: translate(156px, 0) rotate(8deg);
+  }
+  79% {
+    transform: translate(-158px, 0) rotate(-8deg);
+  }
+  80% {
+    transform: translate(160px, 0) rotate(8deg);
+  }
+  81% {
+    transform: translate(-162px, 0) rotate(-8deg);
+  }
+  82% {
+    transform: translate(164px, 0) rotate(8deg);
+  }
+  83% {
+    transform: translate(-166px, 0) rotate(-8deg);
+  }
+  84% {
+    transform: translate(168px, 0) rotate(8deg);
+  }
+  85% {
+    transform: translate(-170px, 0) rotate(-8deg);
+  }
+  86% {
+    transform: translate(172px, 0) rotate(8deg);
+  }
+  87% {
+    transform: translate(-174px, 0) rotate(-8deg);
+  }
+  88% {
+    transform: translate(176px, 0) rotate(8deg);
+  }
+  89% {
+    transform: translate(-178px, 0) rotate(-8deg);
+  }
+  90% {
+    transform: translate(180px, 0) rotate(8deg);
+  }
+  91% {
+    transform: translate(-182px, 0) rotate(-8deg);
+  }
+  92% {
+    transform: translate(184px, 0) rotate(8deg);
+  }
+  93% {
+    transform: translate(-186px, 0) rotate(-8deg);
+  }
+  94% {
+    transform: translate(188px, 0) rotate(8deg);
+  }
+  95% {
+    transform: translate(-190px, 0) rotate(-8deg);
+  }
+  96% {
+    transform: translate(192px, 0) rotate(8deg);
+  }
+  97% {
+    transform: translate(-194px, 0) rotate(-8deg);
+  }
+  98% {
+    transform: translate(196px, 0) rotate(8deg);
+  }
+  99% {
+    transform: translate(-198px, 0) rotate(-8deg);
+  }
+  100% {
+    transform: translate(0, 0) rotate(0deg);
+  }
+}
+
+.shakeit {
+  animation-timing-function: ease-in;
+  transform-origin: bottom center;
+  animation-name: shakeit;
+  animation-duration: 12s;
+}
+
+@keyframes strobe {
+  0% {
+    opacity: 1;
+    transform: scale(1);
+  }
+  1% {
+    opacity: 0;
+    transform: scale(1.1);
+  }
+  2% {
+    opacity: 1;
+    transform: scale(1.2);
+  }
+  3% {
+    opacity: 0;
+    transform: scale(1.3);
+  }
+  4% {
+    opacity: 1;
+    transform: scale(1.4);
+  }
+  5% {
+    opacity: 0;
+    transform: scale(1.5);
+  }
+  6% {
+    opacity: 1;
+    transform: scale(1.6);
+  }
+  7% {
+    opacity: 0;
+    transform: scale(1.7);
+  }
+  8% {
+    opacity: 1;
+    transform: scale(1.8);
+  }
+  9% {
+    opacity: 0;
+    transform: scale(1.9);
+  }
+  10% {
+    opacity: 1;
+    transform: scale(2);
+  }
+  11% {
+    opacity: 0;
+    transform: scale(2.1);
+  }
+  12% {
+    opacity: 1;
+    transform: scale(2.2);
+  }
+  13% {
+    opacity: 0;
+    transform: scale(2.3);
+  }
+  14% {
+    opacity: 1;
+    transform: scale(2.4);
+  }
+  15% {
+    opacity: 0;
+    transform: scale(2.5);
+  }
+  16% {
+    opacity: 1;
+    transform: scale(2.6);
+  }
+  17% {
+    opacity: 0;
+    transform: scale(2.7);
+  }
+  18% {
+    opacity: 1;
+    transform: scale(2.8);
+  }
+  19% {
+    opacity: 0;
+    transform: scale(2.9);
+  }
+  20% {
+    opacity: 1;
+    transform: scale(3);
+  }
+  21% {
+    opacity: 0;
+    transform: scale(3.1);
+  }
+  22% {
+    opacity: 1;
+    transform: scale(3.2);
+  }
+  23% {
+    opacity: 0;
+    transform: scale(3.3);
+  }
+  24% {
+    opacity: 1;
+    transform: scale(3.4);
+  }
+  25% {
+    opacity: 0;
+    transform: scale(3.5);
+  }
+  26% {
+    opacity: 1;
+    transform: scale(3.6);
+  }
+  27% {
+    opacity: 0;
+    transform: scale(3.7);
+  }
+  28% {
+    opacity: 1;
+    transform: scale(3.8);
+  }
+  29% {
+    opacity: 0;
+    transform: scale(3.9);
+  }
+  30% {
+    opacity: 1;
+    transform: scale(4);
+  }
+  31% {
+    opacity: 0;
+    transform: scale(4.1);
+  }
+  32% {
+    opacity: 1;
+    transform: scale(4.2);
+  }
+  33% {
+    opacity: 0;
+    transform: scale(4.3);
+  }
+  34% {
+    opacity: 1;
+    transform: scale(4.4);
+  }
+  35% {
+    opacity: 0;
+    transform: scale(4.5);
+  }
+  36% {
+    opacity: 1;
+    transform: scale(4.6);
+  }
+  37% {
+    opacity: 0;
+    transform: scale(4.7);
+  }
+  38% {
+    opacity: 1;
+    transform: scale(4.8);
+  }
+  39% {
+    opacity: 0;
+    transform: scale(4.9);
+  }
+  40% {
+    opacity: 1;
+    transform: scale(5);
+  }
+  41% {
+    opacity: 0;
+    transform: scale(5.1);
+  }
+  42% {
+    opacity: 1;
+    transform: scale(5.2);
+  }
+  43% {
+    opacity: 0;
+    transform: scale(5.3);
+  }
+  44% {
+    opacity: 1;
+    transform: scale(5.4);
+  }
+  45% {
+    opacity: 0;
+    transform: scale(5.5);
+  }
+  46% {
+    opacity: 1;
+    transform: scale(5.6);
+  }
+  47% {
+    opacity: 0;
+    transform: scale(5.7);
+  }
+  48% {
+    opacity: 1;
+    transform: scale(5.8);
+  }
+  49% {
+    opacity: 0;
+    transform: scale(5.9);
+  }
+  50% {
+    opacity: 1;
+    transform: scale(6);
+  }
+  51% {
+    opacity: 0;
+    transform: scale(6.1);
+  }
+  52% {
+    opacity: 1;
+    transform: scale(6.2);
+  }
+  53% {
+    opacity: 0;
+    transform: scale(6.3);
+  }
+  54% {
+    opacity: 1;
+    transform: scale(6.4);
+  }
+  55% {
+    opacity: 0;
+    transform: scale(6.5);
+  }
+  56% {
+    opacity: 1;
+    transform: scale(6.6);
+  }
+  57% {
+    opacity: 0;
+    transform: scale(6.7);
+  }
+  58% {
+    opacity: 1;
+    transform: scale(6.8);
+  }
+  59% {
+    opacity: 0;
+    transform: scale(6.9);
+  }
+  60% {
+    opacity: 1;
+    transform: scale(7);
+  }
+  61% {
+    opacity: 0;
+    transform: scale(7.1);
+  }
+  62% {
+    opacity: 1;
+    transform: scale(7.2);
+  }
+  63% {
+    opacity: 0;
+    transform: scale(7.3);
+  }
+  64% {
+    opacity: 1;
+    transform: scale(7.4);
+  }
+  65% {
+    opacity: 0;
+    transform: scale(7.5);
+  }
+  66% {
+    opacity: 1;
+    transform: scale(7.6);
+  }
+  67% {
+    opacity: 0;
+    transform: scale(7.7);
+  }
+  68% {
+    opacity: 1;
+    transform: scale(7.8);
+  }
+  69% {
+    opacity: 0;
+    transform: scale(7.9);
+  }
+  70% {
+    opacity: 1;
+    transform: scale(8);
+  }
+  71% {
+    opacity: 0;
+    transform: scale(8.1);
+  }
+  72% {
+    opacity: 1;
+    transform: scale(8.2);
+  }
+  73% {
+    opacity: 0;
+    transform: scale(8.3);
+  }
+  74% {
+    opacity: 1;
+    transform: scale(8.4);
+  }
+  75% {
+    opacity: 0;
+    transform: scale(8.5);
+  }
+  76% {
+    opacity: 1;
+    transform: scale(8.6);
+  }
+  77% {
+    opacity: 0;
+    transform: scale(8.7);
+  }
+  78% {
+    opacity: 1;
+    transform: scale(8.8);
+  }
+  79% {
+    opacity: 0;
+    transform: scale(8.9);
+  }
+  80% {
+    opacity: 1;
+    transform: scale(9);
+  }
+  81% {
+    opacity: 0;
+    transform: scale(9.1);
+  }
+  82% {
+    opacity: 1;
+    transform: scale(9.2);
+  }
+  83% {
+    opacity: 0;
+    transform: scale(9.3);
+  }
+  84% {
+    opacity: 1;
+    transform: scale(9.4);
+  }
+  85% {
+    opacity: 0;
+    transform: scale(9.5);
+  }
+  86% {
+    opacity: 1;
+    transform: scale(9.6);
+  }
+  87% {
+    opacity: 0;
+    transform: scale(9.7);
+  }
+  88% {
+    opacity: 1;
+    transform: scale(9.8);
+  }
+  89% {
+    opacity: 0;
+    transform: scale(9.9);
+  }
+  90% {
+    opacity: 1;
+    transform: scale(10);
+  }
+  91% {
+    opacity: 0;
+    transform: scale(10.1);
+  }
+  92% {
+    opacity: 1;
+    transform: scale(10.2);
+  }
+  93% {
+    opacity: 0;
+    transform: scale(10.3);
+  }
+  94% {
+    opacity: 1;
+    transform: scale(10.4);
+  }
+  95% {
+    opacity: 0;
+    transform: scale(10.5);
+  }
+  96% {
+    opacity: 1;
+    transform: scale(10.6);
+  }
+  97% {
+    opacity: 0;
+    transform: scale(10.7);
+  }
+  98% {
+    opacity: 1;
+    transform: scale(10.8);
+  }
+  99% {
+    opacity: 0;
+    transform: scale(10.9);
+  }
+  100% {
+    opacity: 1;
+    transform: 1;
+  }
+}
+
+.strobe {
+  animation-timing-function: ease-in-out;
+  animation-name: strobe;
+  animation-duration: 6s;
+}
+
+@keyframes twister {
+  0% {
+    transform: rotateZ(0deg);
+  }
+  10% {
+    transform: rotateZ(360deg);
+  }
+  20% {
+    transform: rotateZ(720deg);
+  }
+  30% {
+    transform: rotateZ(1080deg);
+  }
+  40% {
+    transform: rotateZ(1440deg);
+  }
+  50% {
+    transform: rotateZ(1800deg);
+  }
+  60% {
+    transform: rotateZ(2160deg);
+  }
+  70% {
+    transform: rotateZ(2520deg);
+  }
+  80% {
+  }
+  90% {
+  }
+  100% {
+  }
+}
+
+.twister {
+  animation-name: twister;
+  animation-duration: 5s;
+  z-index: 1000;
+}