diff --git a/client/assets/scss/anims.scss b/client/assets/scss/anims.scss
deleted file mode 100644
index 8828c0d0..00000000
--- a/client/assets/scss/anims.scss
+++ /dev/null
@@ -1,59 +0,0 @@
-
-.anim-container {
-    position: absolute;
-    width: 100%;
-    min-height: 100%;
-    transform-style: preserve-3d;
-}
-
-.blast-cast {
-    position: absolute;
-    background: black;
-    opacity: .7;
-    border-radius: 50%;
-}
-
-@for $i from 1 through 100 {
-    @keyframes blast-cast-#{$i} {
-      100% {
-        transform: translate3d(-3em +random(200)/200, 0, 0);
-      }
-    }
-}
-
-@for $i from 1 through 100 {
-  .blast-cast:nth-child(#{$i}){
-     $size: random(30)+px;
-     height: $size;
-     width: $size;
-     transform: translate3d( (random(200) * 1px),  (random(200) * 1px), (random(200) * 1px));
-     background: #15f4ee;
-     animation: blast-cast-#{$i} 0.7s;
-  }
-}
-
-.blast-hit {
-    position: absolute;
-    background: black;
-    opacity: .7;
-    border-radius: 50%;
-}
-
-@for $i from 1 through 100 {
-    @keyframes blast-hit-#{$i} {
-      100% {
-            transform: translate3d((random(200) * 1px),  (random(200) * 1px), (random(200) * 1px));
-      }
-    }
-}
-
-@for $i from 1 through 100 {
-    .blast-hit:nth-child(#{$i}){
-        $size: random(30)+px;
-        height: $size;
-        width: $size;
-        transform: translate3d(-3em +random(200)/200, 0, 0);
-        animation: blast-hit-#{$i} 0.7s infinite;
-        background: #15f4ee;
-     }
-}
diff --git a/client/assets/styles/anims.css b/client/assets/styles/anims.css
deleted file mode 100644
index 4af1c7db..00000000
--- a/client/assets/styles/anims.css
+++ /dev/null
@@ -1,2217 +0,0 @@
-.anim-container {
-  position: absolute;
-  width: 100%;
-  min-height: 100%;
-  transform-style: preserve-3d; }
-
-.blast-cast {
-  position: absolute;
-  background: black;
-  opacity: .7;
-  border-radius: 50%; }
-
-@keyframes blast-cast-1 {
-  100% {
-    transform: translate3d(-2.69em, 0, 0); } }
-
-@keyframes blast-cast-2 {
-  100% {
-    transform: translate3d(-2.785em, 0, 0); } }
-
-@keyframes blast-cast-3 {
-  100% {
-    transform: translate3d(-2.58em, 0, 0); } }
-
-@keyframes blast-cast-4 {
-  100% {
-    transform: translate3d(-2.42em, 0, 0); } }
-
-@keyframes blast-cast-5 {
-  100% {
-    transform: translate3d(-2.305em, 0, 0); } }
-
-@keyframes blast-cast-6 {
-  100% {
-    transform: translate3d(-2.58em, 0, 0); } }
-
-@keyframes blast-cast-7 {
-  100% {
-    transform: translate3d(-2.805em, 0, 0); } }
-
-@keyframes blast-cast-8 {
-  100% {
-    transform: translate3d(-2.69em, 0, 0); } }
-
-@keyframes blast-cast-9 {
-  100% {
-    transform: translate3d(-2.67em, 0, 0); } }
-
-@keyframes blast-cast-10 {
-  100% {
-    transform: translate3d(-2.79em, 0, 0); } }
-
-@keyframes blast-cast-11 {
-  100% {
-    transform: translate3d(-2.97em, 0, 0); } }
-
-@keyframes blast-cast-12 {
-  100% {
-    transform: translate3d(-2.615em, 0, 0); } }
-
-@keyframes blast-cast-13 {
-  100% {
-    transform: translate3d(-2.905em, 0, 0); } }
-
-@keyframes blast-cast-14 {
-  100% {
-    transform: translate3d(-2.76em, 0, 0); } }
-
-@keyframes blast-cast-15 {
-  100% {
-    transform: translate3d(-2.57em, 0, 0); } }
-
-@keyframes blast-cast-16 {
-  100% {
-    transform: translate3d(-2.4em, 0, 0); } }
-
-@keyframes blast-cast-17 {
-  100% {
-    transform: translate3d(-2.055em, 0, 0); } }
-
-@keyframes blast-cast-18 {
-  100% {
-    transform: translate3d(-2.33em, 0, 0); } }
-
-@keyframes blast-cast-19 {
-  100% {
-    transform: translate3d(-2.455em, 0, 0); } }
-
-@keyframes blast-cast-20 {
-  100% {
-    transform: translate3d(-2.16em, 0, 0); } }
-
-@keyframes blast-cast-21 {
-  100% {
-    transform: translate3d(-2.84em, 0, 0); } }
-
-@keyframes blast-cast-22 {
-  100% {
-    transform: translate3d(-2.45em, 0, 0); } }
-
-@keyframes blast-cast-23 {
-  100% {
-    transform: translate3d(-2.28em, 0, 0); } }
-
-@keyframes blast-cast-24 {
-  100% {
-    transform: translate3d(-2.295em, 0, 0); } }
-
-@keyframes blast-cast-25 {
-  100% {
-    transform: translate3d(-2.89em, 0, 0); } }
-
-@keyframes blast-cast-26 {
-  100% {
-    transform: translate3d(-2.18em, 0, 0); } }
-
-@keyframes blast-cast-27 {
-  100% {
-    transform: translate3d(-2.485em, 0, 0); } }
-
-@keyframes blast-cast-28 {
-  100% {
-    transform: translate3d(-2.88em, 0, 0); } }
-
-@keyframes blast-cast-29 {
-  100% {
-    transform: translate3d(-2.305em, 0, 0); } }
-
-@keyframes blast-cast-30 {
-  100% {
-    transform: translate3d(-2.375em, 0, 0); } }
-
-@keyframes blast-cast-31 {
-  100% {
-    transform: translate3d(-2.11em, 0, 0); } }
-
-@keyframes blast-cast-32 {
-  100% {
-    transform: translate3d(-2em, 0, 0); } }
-
-@keyframes blast-cast-33 {
-  100% {
-    transform: translate3d(-2.43em, 0, 0); } }
-
-@keyframes blast-cast-34 {
-  100% {
-    transform: translate3d(-2.765em, 0, 0); } }
-
-@keyframes blast-cast-35 {
-  100% {
-    transform: translate3d(-2.27em, 0, 0); } }
-
-@keyframes blast-cast-36 {
-  100% {
-    transform: translate3d(-2.015em, 0, 0); } }
-
-@keyframes blast-cast-37 {
-  100% {
-    transform: translate3d(-2.33em, 0, 0); } }
-
-@keyframes blast-cast-38 {
-  100% {
-    transform: translate3d(-2.905em, 0, 0); } }
-
-@keyframes blast-cast-39 {
-  100% {
-    transform: translate3d(-2.76em, 0, 0); } }
-
-@keyframes blast-cast-40 {
-  100% {
-    transform: translate3d(-2.27em, 0, 0); } }
-
-@keyframes blast-cast-41 {
-  100% {
-    transform: translate3d(-2.705em, 0, 0); } }
-
-@keyframes blast-cast-42 {
-  100% {
-    transform: translate3d(-2.89em, 0, 0); } }
-
-@keyframes blast-cast-43 {
-  100% {
-    transform: translate3d(-2.89em, 0, 0); } }
-
-@keyframes blast-cast-44 {
-  100% {
-    transform: translate3d(-2.41em, 0, 0); } }
-
-@keyframes blast-cast-45 {
-  100% {
-    transform: translate3d(-2.705em, 0, 0); } }
-
-@keyframes blast-cast-46 {
-  100% {
-    transform: translate3d(-2.15em, 0, 0); } }
-
-@keyframes blast-cast-47 {
-  100% {
-    transform: translate3d(-2.945em, 0, 0); } }
-
-@keyframes blast-cast-48 {
-  100% {
-    transform: translate3d(-2.51em, 0, 0); } }
-
-@keyframes blast-cast-49 {
-  100% {
-    transform: translate3d(-2.305em, 0, 0); } }
-
-@keyframes blast-cast-50 {
-  100% {
-    transform: translate3d(-2.475em, 0, 0); } }
-
-@keyframes blast-cast-51 {
-  100% {
-    transform: translate3d(-2.725em, 0, 0); } }
-
-@keyframes blast-cast-52 {
-  100% {
-    transform: translate3d(-2.545em, 0, 0); } }
-
-@keyframes blast-cast-53 {
-  100% {
-    transform: translate3d(-2.685em, 0, 0); } }
-
-@keyframes blast-cast-54 {
-  100% {
-    transform: translate3d(-2.36em, 0, 0); } }
-
-@keyframes blast-cast-55 {
-  100% {
-    transform: translate3d(-2.14em, 0, 0); } }
-
-@keyframes blast-cast-56 {
-  100% {
-    transform: translate3d(-2.01em, 0, 0); } }
-
-@keyframes blast-cast-57 {
-  100% {
-    transform: translate3d(-2.615em, 0, 0); } }
-
-@keyframes blast-cast-58 {
-  100% {
-    transform: translate3d(-2.525em, 0, 0); } }
-
-@keyframes blast-cast-59 {
-  100% {
-    transform: translate3d(-2.885em, 0, 0); } }
-
-@keyframes blast-cast-60 {
-  100% {
-    transform: translate3d(-2.165em, 0, 0); } }
-
-@keyframes blast-cast-61 {
-  100% {
-    transform: translate3d(-2.47em, 0, 0); } }
-
-@keyframes blast-cast-62 {
-  100% {
-    transform: translate3d(-2.07em, 0, 0); } }
-
-@keyframes blast-cast-63 {
-  100% {
-    transform: translate3d(-2.8em, 0, 0); } }
-
-@keyframes blast-cast-64 {
-  100% {
-    transform: translate3d(-2.75em, 0, 0); } }
-
-@keyframes blast-cast-65 {
-  100% {
-    transform: translate3d(-2.22em, 0, 0); } }
-
-@keyframes blast-cast-66 {
-  100% {
-    transform: translate3d(-2.285em, 0, 0); } }
-
-@keyframes blast-cast-67 {
-  100% {
-    transform: translate3d(-2.69em, 0, 0); } }
-
-@keyframes blast-cast-68 {
-  100% {
-    transform: translate3d(-2.23em, 0, 0); } }
-
-@keyframes blast-cast-69 {
-  100% {
-    transform: translate3d(-2.545em, 0, 0); } }
-
-@keyframes blast-cast-70 {
-  100% {
-    transform: translate3d(-2.51em, 0, 0); } }
-
-@keyframes blast-cast-71 {
-  100% {
-    transform: translate3d(-2.59em, 0, 0); } }
-
-@keyframes blast-cast-72 {
-  100% {
-    transform: translate3d(-2.52em, 0, 0); } }
-
-@keyframes blast-cast-73 {
-  100% {
-    transform: translate3d(-2.295em, 0, 0); } }
-
-@keyframes blast-cast-74 {
-  100% {
-    transform: translate3d(-2.25em, 0, 0); } }
-
-@keyframes blast-cast-75 {
-  100% {
-    transform: translate3d(-2.595em, 0, 0); } }
-
-@keyframes blast-cast-76 {
-  100% {
-    transform: translate3d(-2.09em, 0, 0); } }
-
-@keyframes blast-cast-77 {
-  100% {
-    transform: translate3d(-2.105em, 0, 0); } }
-
-@keyframes blast-cast-78 {
-  100% {
-    transform: translate3d(-2.5em, 0, 0); } }
-
-@keyframes blast-cast-79 {
-  100% {
-    transform: translate3d(-2.985em, 0, 0); } }
-
-@keyframes blast-cast-80 {
-  100% {
-    transform: translate3d(-2.88em, 0, 0); } }
-
-@keyframes blast-cast-81 {
-  100% {
-    transform: translate3d(-2.045em, 0, 0); } }
-
-@keyframes blast-cast-82 {
-  100% {
-    transform: translate3d(-2.83em, 0, 0); } }
-
-@keyframes blast-cast-83 {
-  100% {
-    transform: translate3d(-2.575em, 0, 0); } }
-
-@keyframes blast-cast-84 {
-  100% {
-    transform: translate3d(-2.11em, 0, 0); } }
-
-@keyframes blast-cast-85 {
-  100% {
-    transform: translate3d(-2.495em, 0, 0); } }
-
-@keyframes blast-cast-86 {
-  100% {
-    transform: translate3d(-2.845em, 0, 0); } }
-
-@keyframes blast-cast-87 {
-  100% {
-    transform: translate3d(-2.3em, 0, 0); } }
-
-@keyframes blast-cast-88 {
-  100% {
-    transform: translate3d(-2.765em, 0, 0); } }
-
-@keyframes blast-cast-89 {
-  100% {
-    transform: translate3d(-2.755em, 0, 0); } }
-
-@keyframes blast-cast-90 {
-  100% {
-    transform: translate3d(-2.425em, 0, 0); } }
-
-@keyframes blast-cast-91 {
-  100% {
-    transform: translate3d(-2.305em, 0, 0); } }
-
-@keyframes blast-cast-92 {
-  100% {
-    transform: translate3d(-2.96em, 0, 0); } }
-
-@keyframes blast-cast-93 {
-  100% {
-    transform: translate3d(-2.105em, 0, 0); } }
-
-@keyframes blast-cast-94 {
-  100% {
-    transform: translate3d(-2.645em, 0, 0); } }
-
-@keyframes blast-cast-95 {
-  100% {
-    transform: translate3d(-2.525em, 0, 0); } }
-
-@keyframes blast-cast-96 {
-  100% {
-    transform: translate3d(-2.22em, 0, 0); } }
-
-@keyframes blast-cast-97 {
-  100% {
-    transform: translate3d(-2.275em, 0, 0); } }
-
-@keyframes blast-cast-98 {
-  100% {
-    transform: translate3d(-2.13em, 0, 0); } }
-
-@keyframes blast-cast-99 {
-  100% {
-    transform: translate3d(-2.16em, 0, 0); } }
-
-@keyframes blast-cast-100 {
-  100% {
-    transform: translate3d(-2.265em, 0, 0); } }
-
-.blast-cast:nth-child(1) {
-  height: 13px;
-  width: 13px;
-  transform: translate3d(197px, 177px, 109px);
-  background: #15f4ee;
-  animation: blast-cast-1 0.7s; }
-
-.blast-cast:nth-child(2) {
-  height: 22px;
-  width: 22px;
-  transform: translate3d(98px, 148px, 190px);
-  background: #15f4ee;
-  animation: blast-cast-2 0.7s; }
-
-.blast-cast:nth-child(3) {
-  height: 6px;
-  width: 6px;
-  transform: translate3d(10px, 92px, 12px);
-  background: #15f4ee;
-  animation: blast-cast-3 0.7s; }
-
-.blast-cast:nth-child(4) {
-  height: 22px;
-  width: 22px;
-  transform: translate3d(83px, 107px, 66px);
-  background: #15f4ee;
-  animation: blast-cast-4 0.7s; }
-
-.blast-cast:nth-child(5) {
-  height: 12px;
-  width: 12px;
-  transform: translate3d(9px, 145px, 109px);
-  background: #15f4ee;
-  animation: blast-cast-5 0.7s; }
-
-.blast-cast:nth-child(6) {
-  height: 1px;
-  width: 1px;
-  transform: translate3d(57px, 135px, 200px);
-  background: #15f4ee;
-  animation: blast-cast-6 0.7s; }
-
-.blast-cast:nth-child(7) {
-  height: 12px;
-  width: 12px;
-  transform: translate3d(103px, 83px, 12px);
-  background: #15f4ee;
-  animation: blast-cast-7 0.7s; }
-
-.blast-cast:nth-child(8) {
-  height: 8px;
-  width: 8px;
-  transform: translate3d(62px, 54px, 86px);
-  background: #15f4ee;
-  animation: blast-cast-8 0.7s; }
-
-.blast-cast:nth-child(9) {
-  height: 25px;
-  width: 25px;
-  transform: translate3d(17px, 25px, 13px);
-  background: #15f4ee;
-  animation: blast-cast-9 0.7s; }
-
-.blast-cast:nth-child(10) {
-  height: 28px;
-  width: 28px;
-  transform: translate3d(181px, 81px, 38px);
-  background: #15f4ee;
-  animation: blast-cast-10 0.7s; }
-
-.blast-cast:nth-child(11) {
-  height: 10px;
-  width: 10px;
-  transform: translate3d(190px, 173px, 2px);
-  background: #15f4ee;
-  animation: blast-cast-11 0.7s; }
-
-.blast-cast:nth-child(12) {
-  height: 2px;
-  width: 2px;
-  transform: translate3d(134px, 95px, 87px);
-  background: #15f4ee;
-  animation: blast-cast-12 0.7s; }
-
-.blast-cast:nth-child(13) {
-  height: 12px;
-  width: 12px;
-  transform: translate3d(163px, 189px, 92px);
-  background: #15f4ee;
-  animation: blast-cast-13 0.7s; }
-
-.blast-cast:nth-child(14) {
-  height: 26px;
-  width: 26px;
-  transform: translate3d(60px, 69px, 183px);
-  background: #15f4ee;
-  animation: blast-cast-14 0.7s; }
-
-.blast-cast:nth-child(15) {
-  height: 13px;
-  width: 13px;
-  transform: translate3d(44px, 132px, 185px);
-  background: #15f4ee;
-  animation: blast-cast-15 0.7s; }
-
-.blast-cast:nth-child(16) {
-  height: 5px;
-  width: 5px;
-  transform: translate3d(77px, 60px, 43px);
-  background: #15f4ee;
-  animation: blast-cast-16 0.7s; }
-
-.blast-cast:nth-child(17) {
-  height: 12px;
-  width: 12px;
-  transform: translate3d(158px, 31px, 177px);
-  background: #15f4ee;
-  animation: blast-cast-17 0.7s; }
-
-.blast-cast:nth-child(18) {
-  height: 22px;
-  width: 22px;
-  transform: translate3d(46px, 103px, 13px);
-  background: #15f4ee;
-  animation: blast-cast-18 0.7s; }
-
-.blast-cast:nth-child(19) {
-  height: 11px;
-  width: 11px;
-  transform: translate3d(92px, 25px, 49px);
-  background: #15f4ee;
-  animation: blast-cast-19 0.7s; }
-
-.blast-cast:nth-child(20) {
-  height: 24px;
-  width: 24px;
-  transform: translate3d(102px, 71px, 95px);
-  background: #15f4ee;
-  animation: blast-cast-20 0.7s; }
-
-.blast-cast:nth-child(21) {
-  height: 27px;
-  width: 27px;
-  transform: translate3d(130px, 71px, 94px);
-  background: #15f4ee;
-  animation: blast-cast-21 0.7s; }
-
-.blast-cast:nth-child(22) {
-  height: 14px;
-  width: 14px;
-  transform: translate3d(117px, 6px, 21px);
-  background: #15f4ee;
-  animation: blast-cast-22 0.7s; }
-
-.blast-cast:nth-child(23) {
-  height: 16px;
-  width: 16px;
-  transform: translate3d(39px, 165px, 116px);
-  background: #15f4ee;
-  animation: blast-cast-23 0.7s; }
-
-.blast-cast:nth-child(24) {
-  height: 30px;
-  width: 30px;
-  transform: translate3d(155px, 67px, 168px);
-  background: #15f4ee;
-  animation: blast-cast-24 0.7s; }
-
-.blast-cast:nth-child(25) {
-  height: 24px;
-  width: 24px;
-  transform: translate3d(181px, 137px, 65px);
-  background: #15f4ee;
-  animation: blast-cast-25 0.7s; }
-
-.blast-cast:nth-child(26) {
-  height: 13px;
-  width: 13px;
-  transform: translate3d(180px, 39px, 125px);
-  background: #15f4ee;
-  animation: blast-cast-26 0.7s; }
-
-.blast-cast:nth-child(27) {
-  height: 24px;
-  width: 24px;
-  transform: translate3d(98px, 199px, 120px);
-  background: #15f4ee;
-  animation: blast-cast-27 0.7s; }
-
-.blast-cast:nth-child(28) {
-  height: 14px;
-  width: 14px;
-  transform: translate3d(63px, 82px, 153px);
-  background: #15f4ee;
-  animation: blast-cast-28 0.7s; }
-
-.blast-cast:nth-child(29) {
-  height: 18px;
-  width: 18px;
-  transform: translate3d(54px, 3px, 42px);
-  background: #15f4ee;
-  animation: blast-cast-29 0.7s; }
-
-.blast-cast:nth-child(30) {
-  height: 24px;
-  width: 24px;
-  transform: translate3d(184px, 94px, 117px);
-  background: #15f4ee;
-  animation: blast-cast-30 0.7s; }
-
-.blast-cast:nth-child(31) {
-  height: 21px;
-  width: 21px;
-  transform: translate3d(148px, 178px, 17px);
-  background: #15f4ee;
-  animation: blast-cast-31 0.7s; }
-
-.blast-cast:nth-child(32) {
-  height: 27px;
-  width: 27px;
-  transform: translate3d(67px, 24px, 172px);
-  background: #15f4ee;
-  animation: blast-cast-32 0.7s; }
-
-.blast-cast:nth-child(33) {
-  height: 3px;
-  width: 3px;
-  transform: translate3d(53px, 5px, 10px);
-  background: #15f4ee;
-  animation: blast-cast-33 0.7s; }
-
-.blast-cast:nth-child(34) {
-  height: 9px;
-  width: 9px;
-  transform: translate3d(29px, 68px, 98px);
-  background: #15f4ee;
-  animation: blast-cast-34 0.7s; }
-
-.blast-cast:nth-child(35) {
-  height: 10px;
-  width: 10px;
-  transform: translate3d(15px, 37px, 5px);
-  background: #15f4ee;
-  animation: blast-cast-35 0.7s; }
-
-.blast-cast:nth-child(36) {
-  height: 14px;
-  width: 14px;
-  transform: translate3d(1px, 144px, 161px);
-  background: #15f4ee;
-  animation: blast-cast-36 0.7s; }
-
-.blast-cast:nth-child(37) {
-  height: 28px;
-  width: 28px;
-  transform: translate3d(194px, 16px, 159px);
-  background: #15f4ee;
-  animation: blast-cast-37 0.7s; }
-
-.blast-cast:nth-child(38) {
-  height: 13px;
-  width: 13px;
-  transform: translate3d(191px, 174px, 171px);
-  background: #15f4ee;
-  animation: blast-cast-38 0.7s; }
-
-.blast-cast:nth-child(39) {
-  height: 7px;
-  width: 7px;
-  transform: translate3d(7px, 136px, 190px);
-  background: #15f4ee;
-  animation: blast-cast-39 0.7s; }
-
-.blast-cast:nth-child(40) {
-  height: 26px;
-  width: 26px;
-  transform: translate3d(23px, 8px, 62px);
-  background: #15f4ee;
-  animation: blast-cast-40 0.7s; }
-
-.blast-cast:nth-child(41) {
-  height: 29px;
-  width: 29px;
-  transform: translate3d(87px, 171px, 182px);
-  background: #15f4ee;
-  animation: blast-cast-41 0.7s; }
-
-.blast-cast:nth-child(42) {
-  height: 23px;
-  width: 23px;
-  transform: translate3d(100px, 103px, 80px);
-  background: #15f4ee;
-  animation: blast-cast-42 0.7s; }
-
-.blast-cast:nth-child(43) {
-  height: 25px;
-  width: 25px;
-  transform: translate3d(102px, 76px, 103px);
-  background: #15f4ee;
-  animation: blast-cast-43 0.7s; }
-
-.blast-cast:nth-child(44) {
-  height: 13px;
-  width: 13px;
-  transform: translate3d(92px, 45px, 172px);
-  background: #15f4ee;
-  animation: blast-cast-44 0.7s; }
-
-.blast-cast:nth-child(45) {
-  height: 15px;
-  width: 15px;
-  transform: translate3d(168px, 52px, 141px);
-  background: #15f4ee;
-  animation: blast-cast-45 0.7s; }
-
-.blast-cast:nth-child(46) {
-  height: 21px;
-  width: 21px;
-  transform: translate3d(117px, 7px, 113px);
-  background: #15f4ee;
-  animation: blast-cast-46 0.7s; }
-
-.blast-cast:nth-child(47) {
-  height: 22px;
-  width: 22px;
-  transform: translate3d(50px, 154px, 37px);
-  background: #15f4ee;
-  animation: blast-cast-47 0.7s; }
-
-.blast-cast:nth-child(48) {
-  height: 11px;
-  width: 11px;
-  transform: translate3d(14px, 86px, 161px);
-  background: #15f4ee;
-  animation: blast-cast-48 0.7s; }
-
-.blast-cast:nth-child(49) {
-  height: 12px;
-  width: 12px;
-  transform: translate3d(177px, 164px, 59px);
-  background: #15f4ee;
-  animation: blast-cast-49 0.7s; }
-
-.blast-cast:nth-child(50) {
-  height: 18px;
-  width: 18px;
-  transform: translate3d(28px, 1px, 12px);
-  background: #15f4ee;
-  animation: blast-cast-50 0.7s; }
-
-.blast-cast:nth-child(51) {
-  height: 25px;
-  width: 25px;
-  transform: translate3d(4px, 36px, 84px);
-  background: #15f4ee;
-  animation: blast-cast-51 0.7s; }
-
-.blast-cast:nth-child(52) {
-  height: 4px;
-  width: 4px;
-  transform: translate3d(78px, 88px, 199px);
-  background: #15f4ee;
-  animation: blast-cast-52 0.7s; }
-
-.blast-cast:nth-child(53) {
-  height: 18px;
-  width: 18px;
-  transform: translate3d(194px, 153px, 186px);
-  background: #15f4ee;
-  animation: blast-cast-53 0.7s; }
-
-.blast-cast:nth-child(54) {
-  height: 5px;
-  width: 5px;
-  transform: translate3d(69px, 200px, 118px);
-  background: #15f4ee;
-  animation: blast-cast-54 0.7s; }
-
-.blast-cast:nth-child(55) {
-  height: 13px;
-  width: 13px;
-  transform: translate3d(199px, 153px, 132px);
-  background: #15f4ee;
-  animation: blast-cast-55 0.7s; }
-
-.blast-cast:nth-child(56) {
-  height: 16px;
-  width: 16px;
-  transform: translate3d(152px, 96px, 116px);
-  background: #15f4ee;
-  animation: blast-cast-56 0.7s; }
-
-.blast-cast:nth-child(57) {
-  height: 12px;
-  width: 12px;
-  transform: translate3d(179px, 45px, 162px);
-  background: #15f4ee;
-  animation: blast-cast-57 0.7s; }
-
-.blast-cast:nth-child(58) {
-  height: 9px;
-  width: 9px;
-  transform: translate3d(8px, 6px, 187px);
-  background: #15f4ee;
-  animation: blast-cast-58 0.7s; }
-
-.blast-cast:nth-child(59) {
-  height: 18px;
-  width: 18px;
-  transform: translate3d(84px, 43px, 89px);
-  background: #15f4ee;
-  animation: blast-cast-59 0.7s; }
-
-.blast-cast:nth-child(60) {
-  height: 27px;
-  width: 27px;
-  transform: translate3d(167px, 200px, 144px);
-  background: #15f4ee;
-  animation: blast-cast-60 0.7s; }
-
-.blast-cast:nth-child(61) {
-  height: 4px;
-  width: 4px;
-  transform: translate3d(113px, 93px, 2px);
-  background: #15f4ee;
-  animation: blast-cast-61 0.7s; }
-
-.blast-cast:nth-child(62) {
-  height: 17px;
-  width: 17px;
-  transform: translate3d(2px, 94px, 188px);
-  background: #15f4ee;
-  animation: blast-cast-62 0.7s; }
-
-.blast-cast:nth-child(63) {
-  height: 17px;
-  width: 17px;
-  transform: translate3d(33px, 169px, 100px);
-  background: #15f4ee;
-  animation: blast-cast-63 0.7s; }
-
-.blast-cast:nth-child(64) {
-  height: 19px;
-  width: 19px;
-  transform: translate3d(52px, 127px, 6px);
-  background: #15f4ee;
-  animation: blast-cast-64 0.7s; }
-
-.blast-cast:nth-child(65) {
-  height: 22px;
-  width: 22px;
-  transform: translate3d(22px, 68px, 134px);
-  background: #15f4ee;
-  animation: blast-cast-65 0.7s; }
-
-.blast-cast:nth-child(66) {
-  height: 27px;
-  width: 27px;
-  transform: translate3d(157px, 2px, 42px);
-  background: #15f4ee;
-  animation: blast-cast-66 0.7s; }
-
-.blast-cast:nth-child(67) {
-  height: 30px;
-  width: 30px;
-  transform: translate3d(200px, 128px, 72px);
-  background: #15f4ee;
-  animation: blast-cast-67 0.7s; }
-
-.blast-cast:nth-child(68) {
-  height: 1px;
-  width: 1px;
-  transform: translate3d(23px, 54px, 2px);
-  background: #15f4ee;
-  animation: blast-cast-68 0.7s; }
-
-.blast-cast:nth-child(69) {
-  height: 25px;
-  width: 25px;
-  transform: translate3d(43px, 156px, 198px);
-  background: #15f4ee;
-  animation: blast-cast-69 0.7s; }
-
-.blast-cast:nth-child(70) {
-  height: 28px;
-  width: 28px;
-  transform: translate3d(62px, 2px, 158px);
-  background: #15f4ee;
-  animation: blast-cast-70 0.7s; }
-
-.blast-cast:nth-child(71) {
-  height: 1px;
-  width: 1px;
-  transform: translate3d(42px, 114px, 197px);
-  background: #15f4ee;
-  animation: blast-cast-71 0.7s; }
-
-.blast-cast:nth-child(72) {
-  height: 27px;
-  width: 27px;
-  transform: translate3d(82px, 105px, 175px);
-  background: #15f4ee;
-  animation: blast-cast-72 0.7s; }
-
-.blast-cast:nth-child(73) {
-  height: 17px;
-  width: 17px;
-  transform: translate3d(174px, 46px, 149px);
-  background: #15f4ee;
-  animation: blast-cast-73 0.7s; }
-
-.blast-cast:nth-child(74) {
-  height: 12px;
-  width: 12px;
-  transform: translate3d(160px, 103px, 141px);
-  background: #15f4ee;
-  animation: blast-cast-74 0.7s; }
-
-.blast-cast:nth-child(75) {
-  height: 27px;
-  width: 27px;
-  transform: translate3d(101px, 76px, 68px);
-  background: #15f4ee;
-  animation: blast-cast-75 0.7s; }
-
-.blast-cast:nth-child(76) {
-  height: 18px;
-  width: 18px;
-  transform: translate3d(186px, 199px, 80px);
-  background: #15f4ee;
-  animation: blast-cast-76 0.7s; }
-
-.blast-cast:nth-child(77) {
-  height: 27px;
-  width: 27px;
-  transform: translate3d(116px, 17px, 31px);
-  background: #15f4ee;
-  animation: blast-cast-77 0.7s; }
-
-.blast-cast:nth-child(78) {
-  height: 23px;
-  width: 23px;
-  transform: translate3d(52px, 80px, 130px);
-  background: #15f4ee;
-  animation: blast-cast-78 0.7s; }
-
-.blast-cast:nth-child(79) {
-  height: 13px;
-  width: 13px;
-  transform: translate3d(162px, 150px, 129px);
-  background: #15f4ee;
-  animation: blast-cast-79 0.7s; }
-
-.blast-cast:nth-child(80) {
-  height: 24px;
-  width: 24px;
-  transform: translate3d(144px, 57px, 55px);
-  background: #15f4ee;
-  animation: blast-cast-80 0.7s; }
-
-.blast-cast:nth-child(81) {
-  height: 3px;
-  width: 3px;
-  transform: translate3d(77px, 59px, 63px);
-  background: #15f4ee;
-  animation: blast-cast-81 0.7s; }
-
-.blast-cast:nth-child(82) {
-  height: 2px;
-  width: 2px;
-  transform: translate3d(79px, 89px, 72px);
-  background: #15f4ee;
-  animation: blast-cast-82 0.7s; }
-
-.blast-cast:nth-child(83) {
-  height: 7px;
-  width: 7px;
-  transform: translate3d(44px, 46px, 134px);
-  background: #15f4ee;
-  animation: blast-cast-83 0.7s; }
-
-.blast-cast:nth-child(84) {
-  height: 1px;
-  width: 1px;
-  transform: translate3d(127px, 31px, 110px);
-  background: #15f4ee;
-  animation: blast-cast-84 0.7s; }
-
-.blast-cast:nth-child(85) {
-  height: 26px;
-  width: 26px;
-  transform: translate3d(164px, 181px, 170px);
-  background: #15f4ee;
-  animation: blast-cast-85 0.7s; }
-
-.blast-cast:nth-child(86) {
-  height: 10px;
-  width: 10px;
-  transform: translate3d(54px, 42px, 176px);
-  background: #15f4ee;
-  animation: blast-cast-86 0.7s; }
-
-.blast-cast:nth-child(87) {
-  height: 8px;
-  width: 8px;
-  transform: translate3d(61px, 59px, 43px);
-  background: #15f4ee;
-  animation: blast-cast-87 0.7s; }
-
-.blast-cast:nth-child(88) {
-  height: 2px;
-  width: 2px;
-  transform: translate3d(177px, 17px, 151px);
-  background: #15f4ee;
-  animation: blast-cast-88 0.7s; }
-
-.blast-cast:nth-child(89) {
-  height: 24px;
-  width: 24px;
-  transform: translate3d(10px, 47px, 45px);
-  background: #15f4ee;
-  animation: blast-cast-89 0.7s; }
-
-.blast-cast:nth-child(90) {
-  height: 30px;
-  width: 30px;
-  transform: translate3d(175px, 147px, 8px);
-  background: #15f4ee;
-  animation: blast-cast-90 0.7s; }
-
-.blast-cast:nth-child(91) {
-  height: 5px;
-  width: 5px;
-  transform: translate3d(102px, 19px, 195px);
-  background: #15f4ee;
-  animation: blast-cast-91 0.7s; }
-
-.blast-cast:nth-child(92) {
-  height: 10px;
-  width: 10px;
-  transform: translate3d(14px, 136px, 21px);
-  background: #15f4ee;
-  animation: blast-cast-92 0.7s; }
-
-.blast-cast:nth-child(93) {
-  height: 4px;
-  width: 4px;
-  transform: translate3d(5px, 75px, 4px);
-  background: #15f4ee;
-  animation: blast-cast-93 0.7s; }
-
-.blast-cast:nth-child(94) {
-  height: 3px;
-  width: 3px;
-  transform: translate3d(24px, 4px, 41px);
-  background: #15f4ee;
-  animation: blast-cast-94 0.7s; }
-
-.blast-cast:nth-child(95) {
-  height: 6px;
-  width: 6px;
-  transform: translate3d(94px, 60px, 12px);
-  background: #15f4ee;
-  animation: blast-cast-95 0.7s; }
-
-.blast-cast:nth-child(96) {
-  height: 27px;
-  width: 27px;
-  transform: translate3d(30px, 70px, 158px);
-  background: #15f4ee;
-  animation: blast-cast-96 0.7s; }
-
-.blast-cast:nth-child(97) {
-  height: 20px;
-  width: 20px;
-  transform: translate3d(195px, 160px, 8px);
-  background: #15f4ee;
-  animation: blast-cast-97 0.7s; }
-
-.blast-cast:nth-child(98) {
-  height: 4px;
-  width: 4px;
-  transform: translate3d(149px, 41px, 92px);
-  background: #15f4ee;
-  animation: blast-cast-98 0.7s; }
-
-.blast-cast:nth-child(99) {
-  height: 9px;
-  width: 9px;
-  transform: translate3d(6px, 64px, 152px);
-  background: #15f4ee;
-  animation: blast-cast-99 0.7s; }
-
-.blast-cast:nth-child(100) {
-  height: 30px;
-  width: 30px;
-  transform: translate3d(84px, 129px, 147px);
-  background: #15f4ee;
-  animation: blast-cast-100 0.7s; }
-
-.blast-hit {
-  position: absolute;
-  background: black;
-  opacity: .7;
-  border-radius: 50%; }
-
-@keyframes blast-hit-1 {
-  100% {
-    transform: translate3d(194px, 21px, 15px); } }
-
-@keyframes blast-hit-2 {
-  100% {
-    transform: translate3d(59px, 59px, 125px); } }
-
-@keyframes blast-hit-3 {
-  100% {
-    transform: translate3d(98px, 112px, 36px); } }
-
-@keyframes blast-hit-4 {
-  100% {
-    transform: translate3d(53px, 187px, 105px); } }
-
-@keyframes blast-hit-5 {
-  100% {
-    transform: translate3d(53px, 5px, 174px); } }
-
-@keyframes blast-hit-6 {
-  100% {
-    transform: translate3d(52px, 47px, 4px); } }
-
-@keyframes blast-hit-7 {
-  100% {
-    transform: translate3d(29px, 44px, 161px); } }
-
-@keyframes blast-hit-8 {
-  100% {
-    transform: translate3d(192px, 123px, 192px); } }
-
-@keyframes blast-hit-9 {
-  100% {
-    transform: translate3d(172px, 173px, 36px); } }
-
-@keyframes blast-hit-10 {
-  100% {
-    transform: translate3d(200px, 16px, 169px); } }
-
-@keyframes blast-hit-11 {
-  100% {
-    transform: translate3d(85px, 102px, 131px); } }
-
-@keyframes blast-hit-12 {
-  100% {
-    transform: translate3d(26px, 40px, 192px); } }
-
-@keyframes blast-hit-13 {
-  100% {
-    transform: translate3d(40px, 186px, 81px); } }
-
-@keyframes blast-hit-14 {
-  100% {
-    transform: translate3d(122px, 166px, 80px); } }
-
-@keyframes blast-hit-15 {
-  100% {
-    transform: translate3d(198px, 58px, 76px); } }
-
-@keyframes blast-hit-16 {
-  100% {
-    transform: translate3d(152px, 78px, 121px); } }
-
-@keyframes blast-hit-17 {
-  100% {
-    transform: translate3d(97px, 138px, 80px); } }
-
-@keyframes blast-hit-18 {
-  100% {
-    transform: translate3d(78px, 48px, 122px); } }
-
-@keyframes blast-hit-19 {
-  100% {
-    transform: translate3d(122px, 49px, 199px); } }
-
-@keyframes blast-hit-20 {
-  100% {
-    transform: translate3d(177px, 103px, 31px); } }
-
-@keyframes blast-hit-21 {
-  100% {
-    transform: translate3d(52px, 136px, 194px); } }
-
-@keyframes blast-hit-22 {
-  100% {
-    transform: translate3d(34px, 30px, 116px); } }
-
-@keyframes blast-hit-23 {
-  100% {
-    transform: translate3d(127px, 174px, 110px); } }
-
-@keyframes blast-hit-24 {
-  100% {
-    transform: translate3d(183px, 111px, 53px); } }
-
-@keyframes blast-hit-25 {
-  100% {
-    transform: translate3d(120px, 102px, 139px); } }
-
-@keyframes blast-hit-26 {
-  100% {
-    transform: translate3d(126px, 137px, 148px); } }
-
-@keyframes blast-hit-27 {
-  100% {
-    transform: translate3d(164px, 2px, 67px); } }
-
-@keyframes blast-hit-28 {
-  100% {
-    transform: translate3d(41px, 77px, 7px); } }
-
-@keyframes blast-hit-29 {
-  100% {
-    transform: translate3d(77px, 112px, 56px); } }
-
-@keyframes blast-hit-30 {
-  100% {
-    transform: translate3d(14px, 114px, 28px); } }
-
-@keyframes blast-hit-31 {
-  100% {
-    transform: translate3d(66px, 39px, 141px); } }
-
-@keyframes blast-hit-32 {
-  100% {
-    transform: translate3d(34px, 64px, 143px); } }
-
-@keyframes blast-hit-33 {
-  100% {
-    transform: translate3d(101px, 137px, 127px); } }
-
-@keyframes blast-hit-34 {
-  100% {
-    transform: translate3d(171px, 140px, 29px); } }
-
-@keyframes blast-hit-35 {
-  100% {
-    transform: translate3d(64px, 150px, 20px); } }
-
-@keyframes blast-hit-36 {
-  100% {
-    transform: translate3d(76px, 58px, 114px); } }
-
-@keyframes blast-hit-37 {
-  100% {
-    transform: translate3d(68px, 105px, 44px); } }
-
-@keyframes blast-hit-38 {
-  100% {
-    transform: translate3d(32px, 6px, 140px); } }
-
-@keyframes blast-hit-39 {
-  100% {
-    transform: translate3d(127px, 88px, 41px); } }
-
-@keyframes blast-hit-40 {
-  100% {
-    transform: translate3d(156px, 91px, 4px); } }
-
-@keyframes blast-hit-41 {
-  100% {
-    transform: translate3d(89px, 3px, 70px); } }
-
-@keyframes blast-hit-42 {
-  100% {
-    transform: translate3d(105px, 51px, 146px); } }
-
-@keyframes blast-hit-43 {
-  100% {
-    transform: translate3d(171px, 141px, 151px); } }
-
-@keyframes blast-hit-44 {
-  100% {
-    transform: translate3d(73px, 155px, 195px); } }
-
-@keyframes blast-hit-45 {
-  100% {
-    transform: translate3d(50px, 123px, 161px); } }
-
-@keyframes blast-hit-46 {
-  100% {
-    transform: translate3d(149px, 59px, 81px); } }
-
-@keyframes blast-hit-47 {
-  100% {
-    transform: translate3d(6px, 24px, 194px); } }
-
-@keyframes blast-hit-48 {
-  100% {
-    transform: translate3d(93px, 109px, 25px); } }
-
-@keyframes blast-hit-49 {
-  100% {
-    transform: translate3d(32px, 73px, 153px); } }
-
-@keyframes blast-hit-50 {
-  100% {
-    transform: translate3d(81px, 186px, 114px); } }
-
-@keyframes blast-hit-51 {
-  100% {
-    transform: translate3d(109px, 124px, 130px); } }
-
-@keyframes blast-hit-52 {
-  100% {
-    transform: translate3d(179px, 35px, 30px); } }
-
-@keyframes blast-hit-53 {
-  100% {
-    transform: translate3d(156px, 160px, 92px); } }
-
-@keyframes blast-hit-54 {
-  100% {
-    transform: translate3d(1px, 28px, 21px); } }
-
-@keyframes blast-hit-55 {
-  100% {
-    transform: translate3d(13px, 55px, 183px); } }
-
-@keyframes blast-hit-56 {
-  100% {
-    transform: translate3d(71px, 71px, 36px); } }
-
-@keyframes blast-hit-57 {
-  100% {
-    transform: translate3d(125px, 76px, 4px); } }
-
-@keyframes blast-hit-58 {
-  100% {
-    transform: translate3d(9px, 116px, 162px); } }
-
-@keyframes blast-hit-59 {
-  100% {
-    transform: translate3d(166px, 70px, 36px); } }
-
-@keyframes blast-hit-60 {
-  100% {
-    transform: translate3d(190px, 47px, 113px); } }
-
-@keyframes blast-hit-61 {
-  100% {
-    transform: translate3d(14px, 29px, 110px); } }
-
-@keyframes blast-hit-62 {
-  100% {
-    transform: translate3d(16px, 61px, 154px); } }
-
-@keyframes blast-hit-63 {
-  100% {
-    transform: translate3d(107px, 94px, 177px); } }
-
-@keyframes blast-hit-64 {
-  100% {
-    transform: translate3d(116px, 196px, 141px); } }
-
-@keyframes blast-hit-65 {
-  100% {
-    transform: translate3d(79px, 95px, 172px); } }
-
-@keyframes blast-hit-66 {
-  100% {
-    transform: translate3d(64px, 9px, 157px); } }
-
-@keyframes blast-hit-67 {
-  100% {
-    transform: translate3d(43px, 32px, 7px); } }
-
-@keyframes blast-hit-68 {
-  100% {
-    transform: translate3d(194px, 70px, 37px); } }
-
-@keyframes blast-hit-69 {
-  100% {
-    transform: translate3d(18px, 131px, 110px); } }
-
-@keyframes blast-hit-70 {
-  100% {
-    transform: translate3d(183px, 34px, 137px); } }
-
-@keyframes blast-hit-71 {
-  100% {
-    transform: translate3d(104px, 193px, 137px); } }
-
-@keyframes blast-hit-72 {
-  100% {
-    transform: translate3d(168px, 106px, 74px); } }
-
-@keyframes blast-hit-73 {
-  100% {
-    transform: translate3d(84px, 127px, 76px); } }
-
-@keyframes blast-hit-74 {
-  100% {
-    transform: translate3d(172px, 155px, 32px); } }
-
-@keyframes blast-hit-75 {
-  100% {
-    transform: translate3d(17px, 65px, 19px); } }
-
-@keyframes blast-hit-76 {
-  100% {
-    transform: translate3d(44px, 155px, 193px); } }
-
-@keyframes blast-hit-77 {
-  100% {
-    transform: translate3d(164px, 84px, 12px); } }
-
-@keyframes blast-hit-78 {
-  100% {
-    transform: translate3d(77px, 157px, 190px); } }
-
-@keyframes blast-hit-79 {
-  100% {
-    transform: translate3d(35px, 150px, 154px); } }
-
-@keyframes blast-hit-80 {
-  100% {
-    transform: translate3d(117px, 66px, 77px); } }
-
-@keyframes blast-hit-81 {
-  100% {
-    transform: translate3d(6px, 91px, 1px); } }
-
-@keyframes blast-hit-82 {
-  100% {
-    transform: translate3d(160px, 145px, 17px); } }
-
-@keyframes blast-hit-83 {
-  100% {
-    transform: translate3d(180px, 171px, 74px); } }
-
-@keyframes blast-hit-84 {
-  100% {
-    transform: translate3d(21px, 174px, 69px); } }
-
-@keyframes blast-hit-85 {
-  100% {
-    transform: translate3d(84px, 14px, 157px); } }
-
-@keyframes blast-hit-86 {
-  100% {
-    transform: translate3d(48px, 60px, 40px); } }
-
-@keyframes blast-hit-87 {
-  100% {
-    transform: translate3d(90px, 42px, 25px); } }
-
-@keyframes blast-hit-88 {
-  100% {
-    transform: translate3d(95px, 46px, 35px); } }
-
-@keyframes blast-hit-89 {
-  100% {
-    transform: translate3d(38px, 177px, 45px); } }
-
-@keyframes blast-hit-90 {
-  100% {
-    transform: translate3d(197px, 23px, 162px); } }
-
-@keyframes blast-hit-91 {
-  100% {
-    transform: translate3d(79px, 32px, 196px); } }
-
-@keyframes blast-hit-92 {
-  100% {
-    transform: translate3d(108px, 86px, 153px); } }
-
-@keyframes blast-hit-93 {
-  100% {
-    transform: translate3d(3px, 9px, 165px); } }
-
-@keyframes blast-hit-94 {
-  100% {
-    transform: translate3d(161px, 73px, 131px); } }
-
-@keyframes blast-hit-95 {
-  100% {
-    transform: translate3d(186px, 28px, 119px); } }
-
-@keyframes blast-hit-96 {
-  100% {
-    transform: translate3d(180px, 80px, 119px); } }
-
-@keyframes blast-hit-97 {
-  100% {
-    transform: translate3d(98px, 36px, 136px); } }
-
-@keyframes blast-hit-98 {
-  100% {
-    transform: translate3d(186px, 62px, 69px); } }
-
-@keyframes blast-hit-99 {
-  100% {
-    transform: translate3d(103px, 135px, 124px); } }
-
-@keyframes blast-hit-100 {
-  100% {
-    transform: translate3d(8px, 38px, 144px); } }
-
-.blast-hit:nth-child(1) {
-  height: 11px;
-  width: 11px;
-  transform: translate3d(-2.7em, 0, 0);
-  animation: blast-hit-1 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(2) {
-  height: 19px;
-  width: 19px;
-  transform: translate3d(-2.455em, 0, 0);
-  animation: blast-hit-2 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(3) {
-  height: 29px;
-  width: 29px;
-  transform: translate3d(-2.575em, 0, 0);
-  animation: blast-hit-3 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(4) {
-  height: 5px;
-  width: 5px;
-  transform: translate3d(-2.645em, 0, 0);
-  animation: blast-hit-4 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(5) {
-  height: 21px;
-  width: 21px;
-  transform: translate3d(-2.29em, 0, 0);
-  animation: blast-hit-5 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(6) {
-  height: 25px;
-  width: 25px;
-  transform: translate3d(-2.38em, 0, 0);
-  animation: blast-hit-6 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(7) {
-  height: 2px;
-  width: 2px;
-  transform: translate3d(-2.14em, 0, 0);
-  animation: blast-hit-7 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(8) {
-  height: 4px;
-  width: 4px;
-  transform: translate3d(-2.12em, 0, 0);
-  animation: blast-hit-8 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(9) {
-  height: 29px;
-  width: 29px;
-  transform: translate3d(-2.68em, 0, 0);
-  animation: blast-hit-9 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(10) {
-  height: 30px;
-  width: 30px;
-  transform: translate3d(-2.81em, 0, 0);
-  animation: blast-hit-10 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(11) {
-  height: 6px;
-  width: 6px;
-  transform: translate3d(-2.48em, 0, 0);
-  animation: blast-hit-11 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(12) {
-  height: 4px;
-  width: 4px;
-  transform: translate3d(-2.74em, 0, 0);
-  animation: blast-hit-12 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(13) {
-  height: 20px;
-  width: 20px;
-  transform: translate3d(-2.76em, 0, 0);
-  animation: blast-hit-13 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(14) {
-  height: 4px;
-  width: 4px;
-  transform: translate3d(-2.885em, 0, 0);
-  animation: blast-hit-14 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(15) {
-  height: 12px;
-  width: 12px;
-  transform: translate3d(-2.325em, 0, 0);
-  animation: blast-hit-15 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(16) {
-  height: 20px;
-  width: 20px;
-  transform: translate3d(-2.8em, 0, 0);
-  animation: blast-hit-16 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(17) {
-  height: 14px;
-  width: 14px;
-  transform: translate3d(-2.02em, 0, 0);
-  animation: blast-hit-17 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(18) {
-  height: 8px;
-  width: 8px;
-  transform: translate3d(-2.965em, 0, 0);
-  animation: blast-hit-18 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(19) {
-  height: 18px;
-  width: 18px;
-  transform: translate3d(-2.975em, 0, 0);
-  animation: blast-hit-19 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(20) {
-  height: 7px;
-  width: 7px;
-  transform: translate3d(-2.455em, 0, 0);
-  animation: blast-hit-20 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(21) {
-  height: 24px;
-  width: 24px;
-  transform: translate3d(-2.69em, 0, 0);
-  animation: blast-hit-21 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(22) {
-  height: 18px;
-  width: 18px;
-  transform: translate3d(-2.535em, 0, 0);
-  animation: blast-hit-22 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(23) {
-  height: 16px;
-  width: 16px;
-  transform: translate3d(-2.925em, 0, 0);
-  animation: blast-hit-23 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(24) {
-  height: 9px;
-  width: 9px;
-  transform: translate3d(-2.835em, 0, 0);
-  animation: blast-hit-24 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(25) {
-  height: 8px;
-  width: 8px;
-  transform: translate3d(-2.5em, 0, 0);
-  animation: blast-hit-25 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(26) {
-  height: 13px;
-  width: 13px;
-  transform: translate3d(-2.095em, 0, 0);
-  animation: blast-hit-26 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(27) {
-  height: 28px;
-  width: 28px;
-  transform: translate3d(-2.86em, 0, 0);
-  animation: blast-hit-27 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(28) {
-  height: 28px;
-  width: 28px;
-  transform: translate3d(-2.095em, 0, 0);
-  animation: blast-hit-28 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(29) {
-  height: 18px;
-  width: 18px;
-  transform: translate3d(-2.155em, 0, 0);
-  animation: blast-hit-29 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(30) {
-  height: 22px;
-  width: 22px;
-  transform: translate3d(-2.81em, 0, 0);
-  animation: blast-hit-30 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(31) {
-  height: 17px;
-  width: 17px;
-  transform: translate3d(-2.5em, 0, 0);
-  animation: blast-hit-31 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(32) {
-  height: 23px;
-  width: 23px;
-  transform: translate3d(-2.725em, 0, 0);
-  animation: blast-hit-32 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(33) {
-  height: 24px;
-  width: 24px;
-  transform: translate3d(-2.255em, 0, 0);
-  animation: blast-hit-33 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(34) {
-  height: 4px;
-  width: 4px;
-  transform: translate3d(-2.285em, 0, 0);
-  animation: blast-hit-34 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(35) {
-  height: 14px;
-  width: 14px;
-  transform: translate3d(-2.985em, 0, 0);
-  animation: blast-hit-35 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(36) {
-  height: 3px;
-  width: 3px;
-  transform: translate3d(-2.65em, 0, 0);
-  animation: blast-hit-36 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(37) {
-  height: 11px;
-  width: 11px;
-  transform: translate3d(-2.405em, 0, 0);
-  animation: blast-hit-37 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(38) {
-  height: 3px;
-  width: 3px;
-  transform: translate3d(-2.46em, 0, 0);
-  animation: blast-hit-38 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(39) {
-  height: 3px;
-  width: 3px;
-  transform: translate3d(-2.11em, 0, 0);
-  animation: blast-hit-39 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(40) {
-  height: 29px;
-  width: 29px;
-  transform: translate3d(-2.18em, 0, 0);
-  animation: blast-hit-40 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(41) {
-  height: 1px;
-  width: 1px;
-  transform: translate3d(-2.7em, 0, 0);
-  animation: blast-hit-41 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(42) {
-  height: 4px;
-  width: 4px;
-  transform: translate3d(-2.6em, 0, 0);
-  animation: blast-hit-42 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(43) {
-  height: 12px;
-  width: 12px;
-  transform: translate3d(-2.69em, 0, 0);
-  animation: blast-hit-43 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(44) {
-  height: 8px;
-  width: 8px;
-  transform: translate3d(-2.655em, 0, 0);
-  animation: blast-hit-44 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(45) {
-  height: 14px;
-  width: 14px;
-  transform: translate3d(-2.965em, 0, 0);
-  animation: blast-hit-45 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(46) {
-  height: 21px;
-  width: 21px;
-  transform: translate3d(-2.93em, 0, 0);
-  animation: blast-hit-46 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(47) {
-  height: 3px;
-  width: 3px;
-  transform: translate3d(-2.31em, 0, 0);
-  animation: blast-hit-47 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(48) {
-  height: 29px;
-  width: 29px;
-  transform: translate3d(-2.17em, 0, 0);
-  animation: blast-hit-48 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(49) {
-  height: 13px;
-  width: 13px;
-  transform: translate3d(-2.545em, 0, 0);
-  animation: blast-hit-49 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(50) {
-  height: 7px;
-  width: 7px;
-  transform: translate3d(-2.705em, 0, 0);
-  animation: blast-hit-50 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(51) {
-  height: 23px;
-  width: 23px;
-  transform: translate3d(-2.915em, 0, 0);
-  animation: blast-hit-51 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(52) {
-  height: 15px;
-  width: 15px;
-  transform: translate3d(-2.77em, 0, 0);
-  animation: blast-hit-52 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(53) {
-  height: 26px;
-  width: 26px;
-  transform: translate3d(-2.695em, 0, 0);
-  animation: blast-hit-53 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(54) {
-  height: 7px;
-  width: 7px;
-  transform: translate3d(-2.155em, 0, 0);
-  animation: blast-hit-54 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(55) {
-  height: 16px;
-  width: 16px;
-  transform: translate3d(-2.17em, 0, 0);
-  animation: blast-hit-55 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(56) {
-  height: 28px;
-  width: 28px;
-  transform: translate3d(-2.235em, 0, 0);
-  animation: blast-hit-56 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(57) {
-  height: 19px;
-  width: 19px;
-  transform: translate3d(-2.085em, 0, 0);
-  animation: blast-hit-57 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(58) {
-  height: 25px;
-  width: 25px;
-  transform: translate3d(-2.025em, 0, 0);
-  animation: blast-hit-58 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(59) {
-  height: 16px;
-  width: 16px;
-  transform: translate3d(-2.46em, 0, 0);
-  animation: blast-hit-59 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(60) {
-  height: 24px;
-  width: 24px;
-  transform: translate3d(-2.33em, 0, 0);
-  animation: blast-hit-60 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(61) {
-  height: 3px;
-  width: 3px;
-  transform: translate3d(-2.83em, 0, 0);
-  animation: blast-hit-61 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(62) {
-  height: 14px;
-  width: 14px;
-  transform: translate3d(-2.73em, 0, 0);
-  animation: blast-hit-62 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(63) {
-  height: 23px;
-  width: 23px;
-  transform: translate3d(-2.265em, 0, 0);
-  animation: blast-hit-63 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(64) {
-  height: 26px;
-  width: 26px;
-  transform: translate3d(-2.815em, 0, 0);
-  animation: blast-hit-64 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(65) {
-  height: 3px;
-  width: 3px;
-  transform: translate3d(-2.555em, 0, 0);
-  animation: blast-hit-65 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(66) {
-  height: 27px;
-  width: 27px;
-  transform: translate3d(-2.23em, 0, 0);
-  animation: blast-hit-66 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(67) {
-  height: 2px;
-  width: 2px;
-  transform: translate3d(-2.22em, 0, 0);
-  animation: blast-hit-67 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(68) {
-  height: 20px;
-  width: 20px;
-  transform: translate3d(-2.215em, 0, 0);
-  animation: blast-hit-68 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(69) {
-  height: 7px;
-  width: 7px;
-  transform: translate3d(-2.17em, 0, 0);
-  animation: blast-hit-69 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(70) {
-  height: 7px;
-  width: 7px;
-  transform: translate3d(-2.96em, 0, 0);
-  animation: blast-hit-70 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(71) {
-  height: 2px;
-  width: 2px;
-  transform: translate3d(-2.885em, 0, 0);
-  animation: blast-hit-71 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(72) {
-  height: 23px;
-  width: 23px;
-  transform: translate3d(-2.49em, 0, 0);
-  animation: blast-hit-72 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(73) {
-  height: 17px;
-  width: 17px;
-  transform: translate3d(-2.575em, 0, 0);
-  animation: blast-hit-73 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(74) {
-  height: 18px;
-  width: 18px;
-  transform: translate3d(-2.81em, 0, 0);
-  animation: blast-hit-74 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(75) {
-  height: 24px;
-  width: 24px;
-  transform: translate3d(-2.95em, 0, 0);
-  animation: blast-hit-75 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(76) {
-  height: 23px;
-  width: 23px;
-  transform: translate3d(-2.62em, 0, 0);
-  animation: blast-hit-76 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(77) {
-  height: 23px;
-  width: 23px;
-  transform: translate3d(-2.6em, 0, 0);
-  animation: blast-hit-77 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(78) {
-  height: 4px;
-  width: 4px;
-  transform: translate3d(-2.77em, 0, 0);
-  animation: blast-hit-78 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(79) {
-  height: 25px;
-  width: 25px;
-  transform: translate3d(-2.75em, 0, 0);
-  animation: blast-hit-79 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(80) {
-  height: 28px;
-  width: 28px;
-  transform: translate3d(-2.23em, 0, 0);
-  animation: blast-hit-80 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(81) {
-  height: 20px;
-  width: 20px;
-  transform: translate3d(-2.21em, 0, 0);
-  animation: blast-hit-81 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(82) {
-  height: 14px;
-  width: 14px;
-  transform: translate3d(-2.375em, 0, 0);
-  animation: blast-hit-82 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(83) {
-  height: 11px;
-  width: 11px;
-  transform: translate3d(-2.035em, 0, 0);
-  animation: blast-hit-83 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(84) {
-  height: 6px;
-  width: 6px;
-  transform: translate3d(-2.48em, 0, 0);
-  animation: blast-hit-84 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(85) {
-  height: 8px;
-  width: 8px;
-  transform: translate3d(-2.16em, 0, 0);
-  animation: blast-hit-85 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(86) {
-  height: 10px;
-  width: 10px;
-  transform: translate3d(-2.18em, 0, 0);
-  animation: blast-hit-86 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(87) {
-  height: 30px;
-  width: 30px;
-  transform: translate3d(-2.55em, 0, 0);
-  animation: blast-hit-87 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(88) {
-  height: 1px;
-  width: 1px;
-  transform: translate3d(-2.945em, 0, 0);
-  animation: blast-hit-88 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(89) {
-  height: 15px;
-  width: 15px;
-  transform: translate3d(-2.675em, 0, 0);
-  animation: blast-hit-89 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(90) {
-  height: 5px;
-  width: 5px;
-  transform: translate3d(-2.73em, 0, 0);
-  animation: blast-hit-90 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(91) {
-  height: 13px;
-  width: 13px;
-  transform: translate3d(-2.26em, 0, 0);
-  animation: blast-hit-91 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(92) {
-  height: 17px;
-  width: 17px;
-  transform: translate3d(-2.385em, 0, 0);
-  animation: blast-hit-92 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(93) {
-  height: 17px;
-  width: 17px;
-  transform: translate3d(-2.135em, 0, 0);
-  animation: blast-hit-93 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(94) {
-  height: 6px;
-  width: 6px;
-  transform: translate3d(-2.295em, 0, 0);
-  animation: blast-hit-94 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(95) {
-  height: 1px;
-  width: 1px;
-  transform: translate3d(-2.865em, 0, 0);
-  animation: blast-hit-95 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(96) {
-  height: 9px;
-  width: 9px;
-  transform: translate3d(-2.65em, 0, 0);
-  animation: blast-hit-96 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(97) {
-  height: 3px;
-  width: 3px;
-  transform: translate3d(-2.91em, 0, 0);
-  animation: blast-hit-97 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(98) {
-  height: 17px;
-  width: 17px;
-  transform: translate3d(-2.56em, 0, 0);
-  animation: blast-hit-98 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(99) {
-  height: 25px;
-  width: 25px;
-  transform: translate3d(-2.81em, 0, 0);
-  animation: blast-hit-99 0.7s infinite;
-  background: #15f4ee; }
-
-.blast-hit:nth-child(100) {
-  height: 19px;
-  width: 19px;
-  transform: translate3d(-2.69em, 0, 0);
-  animation: blast-hit-100 0.7s infinite;
-  background: #15f4ee; }
diff --git a/client/index.js b/client/index.js
index 2a5c1f0f..8f409800 100644
--- a/client/index.js
+++ b/client/index.js
@@ -3,7 +3,6 @@ require('./assets/styles/styles.mobile.css');
 require('./assets/styles/instance.css');
 require('./assets/styles/instance.mobile.css');
 require('./assets/styles/game.css');
-require('./assets/styles/anims.css');
 
 // kick it off
 require('./src/app');
diff --git a/client/src/animations.jsx b/client/src/animations.jsx
deleted file mode 100644
index b2e01552..00000000
--- a/client/src/animations.jsx
+++ /dev/null
@@ -1,11 +0,0 @@
-const preact = require('preact');
-
-function animationDivs(classes) {
-    switch (classes) {
-        case 'blast-cast': return Array.from({ length: 100 }).map(j => <div key={j} class="blast-cast"></div>);
-        case 'blast-hit': return Array.from({ length: 100 }).map(j => <div key={j} class="blast-hit"></div>);
-        default: return <div>&nbsp;</div>;
-    }
-}
-
-module.exports = { animationDivs };
diff --git a/client/src/components/animations.jsx b/client/src/components/animations.jsx
new file mode 100644
index 00000000..56971485
--- /dev/null
+++ b/client/src/components/animations.jsx
@@ -0,0 +1,19 @@
+const preact = require('preact');
+
+const Attack = require('./anims/attack');
+
+function animations(props) {
+    const { combatTextClass, combatText, stage, player, construct } = props;
+
+    if (combatText === 'Attack') {
+        return (
+            <div class={combatTextClass}>
+                <Attack id={construct.id} stage={stage} team={player}/>
+            </div>
+        );
+    }
+    if (combatText) return <div construct={construct} class={combatTextClass}>{combatText}</div>;
+    return (<div>&nbsp;</div>);
+}
+
+module.exports = animations;
diff --git a/client/src/components/anims/attack.jsx b/client/src/components/anims/attack.jsx
new file mode 100644
index 00000000..352f9fa3
--- /dev/null
+++ b/client/src/components/anims/attack.jsx
@@ -0,0 +1,63 @@
+const preact = require('preact');
+const { Component } = require('preact');
+const anime = require('animejs').default;
+
+const { TIMES } = require('../../constants');
+
+const duration = TIMES.START_SKILL;
+
+class Attack extends Component {
+    constructor(props) {
+        super();
+        this.props = props;
+    }
+
+    render() {
+        return (
+            <svg
+                id={this.props.id}
+                class={`attack-anim skill-animation ${this.props.stage}`}
+                version="1.1"
+                id="Layer_1"
+                xmlns="http://www.w3.org/2000/svg"
+                viewBox="0 0 300 300">
+                <g>
+                    <polygon class='blue' points={'0,190    100,50   190,190'}/>
+                    <polygon class='blue' points={'40,170    100,50   160,170'}/>
+                    <polygon class='blue' points={'70,150    100,50   130,150'}/>
+                </g>
+            </svg>
+        );
+    }
+
+    componentDidMount() {
+        let value = '';
+        if ((!this.props.team && this.props.stage === 'START_SKILL')
+            || (this.props.team && this.props.stage === 'END_SKILL')) {
+            anime.set('.attack-anim', {
+                translateY: -250,
+            });
+            value = '+=250px';
+        }
+        if ((!this.props.team && this.props.stage === 'END_SKILL')
+            || (this.props.team && this.props.stage === 'START_SKILL')) {
+            anime.set('.attack-anim', {
+                translateY: 0,
+            });
+            value = '-=250px';
+        }
+
+        anime({
+            targets: ['.attack-anim'],
+            translateY: {
+                value,
+                duration,
+            },
+            loop: false,
+            duration,
+            easing: 'easeInQuad',
+        });
+    }
+}
+
+module.exports = Attack;
diff --git a/client/src/components/game.construct.jsx b/client/src/components/game.construct.jsx
index 6f5942d8..884b7870 100644
--- a/client/src/components/game.construct.jsx
+++ b/client/src/components/game.construct.jsx
@@ -5,10 +5,9 @@ const range = require('lodash/range');
 const actions = require('../actions');
 const { STATS, eventClasses, getCombatText } = require('../utils');
 const { ConstructAvatar } = require('./construct');
-const { animationDivs } = require('../animations');
+const animations = require('./animations');
 const shapes = require('./shapes');
 
-const TrippyTriangle = require('./svgs/trippy.triangle');
 
 const SkillBtn = require('./skill.btn');
 
@@ -41,9 +40,10 @@ const addState = connect(
             activeSkill,
             selectSkillTarget,
         };
-    },
+    }
 );
 
+
 function GameConstruct(props) {
     const {
         i,
@@ -77,9 +77,9 @@ function GameConstruct(props) {
 
     const [combatText, combatClass] = getCombatText(construct, resolution);
     const combatTextClass = `combat-text ${combatClass}`;
-    const combatTextEl = combatText
-        ? <div class={combatTextClass}>{combatText}</div>
-        : <div class={combatTextClass}> <TrippyTriangle /></div>;
+
+    const stage = resolution ? resolution.stage : false;
+    const combatInfo = animations({ combatTextClass, combatText, stage, player, construct });
 
     const effects = construct.effects.length
         ? construct.effects.map(c => <div key={c.effect}>{c.effect} - {c.duration}T</div>)
@@ -88,12 +88,6 @@ function GameConstruct(props) {
     const playerTeam = game.players.find(t => t.id === account.id);
     const playerTeamIds = playerTeam.constructs.map(c => c.id);
 
-    const anim = (
-        <div class="anim-container">
-            {animationDivs(combatClass)}
-        </div>
-    );
-
     return (
         <div
             onClick={() => selectSkillTarget(construct.id)}
@@ -103,7 +97,7 @@ function GameConstruct(props) {
             {crypSkills}
             <div class="stats"> {stats} </div>
             <ConstructAvatar name={construct.name} id={construct.id} />
-            {combatTextEl}
+            {combatInfo}
             <div class="effects"> {effects} </div>
         </div>
     );