.pyro > .before,
.pyro > .after {
  position: fixed;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  box-shadow: 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff,
    0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff,
    0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff,
    0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff,
    0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff,
    0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff,
    0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff,
    0 0 #fff, 0 0 #fff, 0 0 #fff;
  -moz-animation: 1s bang ease-out infinite backwards,
    1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
  -webkit-animation: 1s bang ease-out infinite backwards,
    1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
  -o-animation: 1s bang ease-out infinite backwards,
    1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
  -ms-animation: 1s bang ease-out infinite backwards,
    1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
  animation: 1s bang ease-out infinite backwards,
    1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
}

.pyro > .after {
  -moz-animation-delay: 1.25s, 1.25s, 1.25s;
  -webkit-animation-delay: 1.25s, 1.25s, 1.25s;
  -o-animation-delay: 1.25s, 1.25s, 1.25s;
  -ms-animation-delay: 1.25s, 1.25s, 1.25s;
  animation-delay: 1.25s, 1.25s, 1.25s;
  -moz-animation-duration: 1.25s, 1.25s, 6.25s;
  -webkit-animation-duration: 1.25s, 1.25s, 6.25s;
  -o-animation-duration: 1.25s, 1.25s, 6.25s;
  -ms-animation-duration: 1.25s, 1.25s, 6.25s;
  animation-duration: 1.25s, 1.25s, 6.25s;
}

@-webkit-keyframes bang {
  to {
    box-shadow: 145px -280.6666666667px #0062ff, 166px 17.3333333333px #26ff00,
      -236px 15.3333333333px #ff0059, -101px -87.6666666667px #00ffcc,
      -233px -318.6666666667px #00fffb, -160px -217.6666666667px #95ff00,
      -39px -205.6666666667px #ff1500, -174px -277.6666666667px #ff0037,
      156px -86.6666666667px #00ff44, -229px -21.6666666667px #7bff00,
      34px -201.6666666667px #e6ff00, -102px -288.6666666667px #4dff00,
      -107px 19.3333333333px #00ff44, -84px -336.6666666667px #ff00e1,
      -24px -359.6666666667px #0011ff, -101px -167.6666666667px #8000ff,
      8px 59.3333333333px #ff6200, 137px -410.6666666667px deepskyblue,
      -141px -239.6666666667px #1eff00, -181px -2.6666666667px #ff00bf,
      -166px -289.6666666667px #ff0077, -135px 63.3333333333px #7700ff,
      188px -369.6666666667px #ff00a2, 113px -237.6666666667px #ff1e00,
      -35px -367.6666666667px #ff0900, 38px -63.6666666667px deepskyblue,
      76px -62.6666666667px #ff2b00, -211px 13.3333333333px #00ff73,
      -65px -363.6666666667px #ff0095, -89px -109.6666666667px #00d0ff,
      -78px 75.3333333333px #007bff, -8px -372.6666666667px #ff9d00,
      75px 65.3333333333px #004dff, 10px -243.6666666667px #6f00ff,
      -47px -176.6666666667px #00ffc8, -61px -233.6666666667px #00ff84,
      8px -193.6666666667px #00ff09, -232px -377.6666666667px #c8ff00,
      -173px -410.6666666667px #09ff00, 240px -382.6666666667px #ff0900,
      -194px -19.6666666667px #f700ff, -227px -112.6666666667px #3700ff,
      147px 28.3333333333px #00ff80, 250px -272.6666666667px #00aeff,
      -235px -257.6666666667px #6aff00, -58px -350.6666666667px #e1ff00,
      -88px 63.3333333333px #ff0011, 181px 50.3333333333px #ff0066,
      69px -352.6666666667px #77ff00, 75px -23.6666666667px #00ddff,
      -79px -304.6666666667px #00ff73;
  }
}
@-moz-keyframes bang {
  to {
    box-shadow: 145px -280.6666666667px #0062ff, 166px 17.3333333333px #26ff00,
      -236px 15.3333333333px #ff0059, -101px -87.6666666667px #00ffcc,
      -233px -318.6666666667px #00fffb, -160px -217.6666666667px #95ff00,
      -39px -205.6666666667px #ff1500, -174px -277.6666666667px #ff0037,
      156px -86.6666666667px #00ff44, -229px -21.6666666667px #7bff00,
      34px -201.6666666667px #e6ff00, -102px -288.6666666667px #4dff00,
      -107px 19.3333333333px #00ff44, -84px -336.6666666667px #ff00e1,
      -24px -359.6666666667px #0011ff, -101px -167.6666666667px #8000ff,
      8px 59.3333333333px #ff6200, 137px -410.6666666667px deepskyblue,
      -141px -239.6666666667px #1eff00, -181px -2.6666666667px #ff00bf,
      -166px -289.6666666667px #ff0077, -135px 63.3333333333px #7700ff,
      188px -369.6666666667px #ff00a2, 113px -237.6666666667px #ff1e00,
      -35px -367.6666666667px #ff0900, 38px -63.6666666667px deepskyblue,
      76px -62.6666666667px #ff2b00, -211px 13.3333333333px #00ff73,
      -65px -363.6666666667px #ff0095, -89px -109.6666666667px #00d0ff,
      -78px 75.3333333333px #007bff, -8px -372.6666666667px #ff9d00,
      75px 65.3333333333px #004dff, 10px -243.6666666667px #6f00ff,
      -47px -176.6666666667px #00ffc8, -61px -233.6666666667px #00ff84,
      8px -193.6666666667px #00ff09, -232px -377.6666666667px #c8ff00,
      -173px -410.6666666667px #09ff00, 240px -382.6666666667px #ff0900,
      -194px -19.6666666667px #f700ff, -227px -112.6666666667px #3700ff,
      147px 28.3333333333px #00ff80, 250px -272.6666666667px #00aeff,
      -235px -257.6666666667px #6aff00, -58px -350.6666666667px #e1ff00,
      -88px 63.3333333333px #ff0011, 181px 50.3333333333px #ff0066,
      69px -352.6666666667px #77ff00, 75px -23.6666666667px #00ddff,
      -79px -304.6666666667px #00ff73;
  }
}
@-o-keyframes bang {
  to {
    box-shadow: 145px -280.6666666667px #0062ff, 166px 17.3333333333px #26ff00,
      -236px 15.3333333333px #ff0059, -101px -87.6666666667px #00ffcc,
      -233px -318.6666666667px #00fffb, -160px -217.6666666667px #95ff00,
      -39px -205.6666666667px #ff1500, -174px -277.6666666667px #ff0037,
      156px -86.6666666667px #00ff44, -229px -21.6666666667px #7bff00,
      34px -201.6666666667px #e6ff00, -102px -288.6666666667px #4dff00,
      -107px 19.3333333333px #00ff44, -84px -336.6666666667px #ff00e1,
      -24px -359.6666666667px #0011ff, -101px -167.6666666667px #8000ff,
      8px 59.3333333333px #ff6200, 137px -410.6666666667px deepskyblue,
      -141px -239.6666666667px #1eff00, -181px -2.6666666667px #ff00bf,
      -166px -289.6666666667px #ff0077, -135px 63.3333333333px #7700ff,
      188px -369.6666666667px #ff00a2, 113px -237.6666666667px #ff1e00,
      -35px -367.6666666667px #ff0900, 38px -63.6666666667px deepskyblue,
      76px -62.6666666667px #ff2b00, -211px 13.3333333333px #00ff73,
      -65px -363.6666666667px #ff0095, -89px -109.6666666667px #00d0ff,
      -78px 75.3333333333px #007bff, -8px -372.6666666667px #ff9d00,
      75px 65.3333333333px #004dff, 10px -243.6666666667px #6f00ff,
      -47px -176.6666666667px #00ffc8, -61px -233.6666666667px #00ff84,
      8px -193.6666666667px #00ff09, -232px -377.6666666667px #c8ff00,
      -173px -410.6666666667px #09ff00, 240px -382.6666666667px #ff0900,
      -194px -19.6666666667px #f700ff, -227px -112.6666666667px #3700ff,
      147px 28.3333333333px #00ff80, 250px -272.6666666667px #00aeff,
      -235px -257.6666666667px #6aff00, -58px -350.6666666667px #e1ff00,
      -88px 63.3333333333px #ff0011, 181px 50.3333333333px #ff0066,
      69px -352.6666666667px #77ff00, 75px -23.6666666667px #00ddff,
      -79px -304.6666666667px #00ff73;
  }
}
@-ms-keyframes bang {
  to {
    box-shadow: 145px -280.6666666667px #0062ff, 166px 17.3333333333px #26ff00,
      -236px 15.3333333333px #ff0059, -101px -87.6666666667px #00ffcc,
      -233px -318.6666666667px #00fffb, -160px -217.6666666667px #95ff00,
      -39px -205.6666666667px #ff1500, -174px -277.6666666667px #ff0037,
      156px -86.6666666667px #00ff44, -229px -21.6666666667px #7bff00,
      34px -201.6666666667px #e6ff00, -102px -288.6666666667px #4dff00,
      -107px 19.3333333333px #00ff44, -84px -336.6666666667px #ff00e1,
      -24px -359.6666666667px #0011ff, -101px -167.6666666667px #8000ff,
      8px 59.3333333333px #ff6200, 137px -410.6666666667px deepskyblue,
      -141px -239.6666666667px #1eff00, -181px -2.6666666667px #ff00bf,
      -166px -289.6666666667px #ff0077, -135px 63.3333333333px #7700ff,
      188px -369.6666666667px #ff00a2, 113px -237.6666666667px #ff1e00,
      -35px -367.6666666667px #ff0900, 38px -63.6666666667px deepskyblue,
      76px -62.6666666667px #ff2b00, -211px 13.3333333333px #00ff73,
      -65px -363.6666666667px #ff0095, -89px -109.6666666667px #00d0ff,
      -78px 75.3333333333px #007bff, -8px -372.6666666667px #ff9d00,
      75px 65.3333333333px #004dff, 10px -243.6666666667px #6f00ff,
      -47px -176.6666666667px #00ffc8, -61px -233.6666666667px #00ff84,
      8px -193.6666666667px #00ff09, -232px -377.6666666667px #c8ff00,
      -173px -410.6666666667px #09ff00, 240px -382.6666666667px #ff0900,
      -194px -19.6666666667px #f700ff, -227px -112.6666666667px #3700ff,
      147px 28.3333333333px #00ff80, 250px -272.6666666667px #00aeff,
      -235px -257.6666666667px #6aff00, -58px -350.6666666667px #e1ff00,
      -88px 63.3333333333px #ff0011, 181px 50.3333333333px #ff0066,
      69px -352.6666666667px #77ff00, 75px -23.6666666667px #00ddff,
      -79px -304.6666666667px #00ff73;
  }
}
@keyframes bang {
  to {
    box-shadow: 145px -280.6666666667px #0062ff, 166px 17.3333333333px #26ff00,
      -236px 15.3333333333px #ff0059, -101px -87.6666666667px #00ffcc,
      -233px -318.6666666667px #00fffb, -160px -217.6666666667px #95ff00,
      -39px -205.6666666667px #ff1500, -174px -277.6666666667px #ff0037,
      156px -86.6666666667px #00ff44, -229px -21.6666666667px #7bff00,
      34px -201.6666666667px #e6ff00, -102px -288.6666666667px #4dff00,
      -107px 19.3333333333px #00ff44, -84px -336.6666666667px #ff00e1,
      -24px -359.6666666667px #0011ff, -101px -167.6666666667px #8000ff,
      8px 59.3333333333px #ff6200, 137px -410.6666666667px deepskyblue,
      -141px -239.6666666667px #1eff00, -181px -2.6666666667px #ff00bf,
      -166px -289.6666666667px #ff0077, -135px 63.3333333333px #7700ff,
      188px -369.6666666667px #ff00a2, 113px -237.6666666667px #ff1e00,
      -35px -367.6666666667px #ff0900, 38px -63.6666666667px deepskyblue,
      76px -62.6666666667px #ff2b00, -211px 13.3333333333px #00ff73,
      -65px -363.6666666667px #ff0095, -89px -109.6666666667px #00d0ff,
      -78px 75.3333333333px #007bff, -8px -372.6666666667px #ff9d00,
      75px 65.3333333333px #004dff, 10px -243.6666666667px #6f00ff,
      -47px -176.6666666667px #00ffc8, -61px -233.6666666667px #00ff84,
      8px -193.6666666667px #00ff09, -232px -377.6666666667px #c8ff00,
      -173px -410.6666666667px #09ff00, 240px -382.6666666667px #ff0900,
      -194px -19.6666666667px #f700ff, -227px -112.6666666667px #3700ff,
      147px 28.3333333333px #00ff80, 250px -272.6666666667px #00aeff,
      -235px -257.6666666667px #6aff00, -58px -350.6666666667px #e1ff00,
      -88px 63.3333333333px #ff0011, 181px 50.3333333333px #ff0066,
      69px -352.6666666667px #77ff00, 75px -23.6666666667px #00ddff,
      -79px -304.6666666667px #00ff73;
  }
}
@-webkit-keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0;
  }
}
@-moz-keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0;
  }
}
@-o-keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0;
  }
}
@-ms-keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0;
  }
}
@keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0;
  }
}
@-webkit-keyframes position {
  0%,
  19.9% {
    margin-top: 10%;
    margin-left: 40%;
  }
  20%,
  39.9% {
    margin-top: 40%;
    margin-left: 30%;
  }
  40%,
  59.9% {
    margin-top: 20%;
    margin-left: 70%;
  }
  60%,
  79.9% {
    margin-top: 30%;
    margin-left: 20%;
  }
  80%,
  99.9% {
    margin-top: 30%;
    margin-left: 80%;
  }
}
@-moz-keyframes position {
  0%,
  19.9% {
    margin-top: 10%;
    margin-left: 40%;
  }
  20%,
  39.9% {
    margin-top: 40%;
    margin-left: 30%;
  }
  40%,
  59.9% {
    margin-top: 20%;
    margin-left: 70%;
  }
  60%,
  79.9% {
    margin-top: 30%;
    margin-left: 20%;
  }
  80%,
  99.9% {
    margin-top: 30%;
    margin-left: 80%;
  }
}
@-o-keyframes position {
  0%,
  19.9% {
    margin-top: 10%;
    margin-left: 40%;
  }
  20%,
  39.9% {
    margin-top: 40%;
    margin-left: 30%;
  }
  40%,
  59.9% {
    margin-top: 20%;
    margin-left: 70%;
  }
  60%,
  79.9% {
    margin-top: 30%;
    margin-left: 20%;
  }
  80%,
  99.9% {
    margin-top: 30%;
    margin-left: 80%;
  }
}
@-ms-keyframes position {
  0%,
  19.9% {
    margin-top: 10%;
    margin-left: 40%;
  }
  20%,
  39.9% {
    margin-top: 40%;
    margin-left: 30%;
  }
  40%,
  59.9% {
    margin-top: 20%;
    margin-left: 70%;
  }
  60%,
  79.9% {
    margin-top: 30%;
    margin-left: 20%;
  }
  80%,
  99.9% {
    margin-top: 30%;
    margin-left: 80%;
  }
}
@keyframes position {
  0%,
  19.9% {
    margin-top: 10%;
    margin-left: 40%;
  }
  20%,
  39.9% {
    margin-top: 40%;
    margin-left: 30%;
  }
  40%,
  59.9% {
    margin-top: 20%;
    margin-left: 70%;
  }
  60%,
  79.9% {
    margin-top: 30%;
    margin-left: 20%;
  }
  80%,
  99.9% {
    margin-top: 30%;
    margin-left: 80%;
  }
}