﻿button {
  transition: all 300ms;
}
button {
	height:0px !important;  
}
button:before, button:after {

}
button:before {
  opacity: 1;
  animation: sparkles1 1s infinite;
}
button:after {
  opacity: 1;
  animation: sparkles2 .8s infinite;
}
button b:before, button b:after, button i:before, button i:after, button span:before, button span:after, button strong:before, button strong:after {
  transition: 600ms all;
  display: block;
  opacity: 0;
  content: '';
  position: absolute;
  background: yellow;
  border-radius: 20px;
  width: 4px;
  height: 4px;
  top: -5px;
  left: -5px;
}
button b:before, button b:after, button i:before, button i:after, button span:before, button span:after, button strong:before, button strong:after {
  opacity: 1;
}
button b:before {
  animation: sparkles3 1.2s infinite;
  animation-delay: -2000ms;
}
button b:after {
  animation: sparkles4 .7s infinite;
  animation-delay: -206ms;
}
button i:before {
  animation: sparkles5 1.1s infinite;
  animation-delay: -660ms;
}
button i:after {
  animation: sparkles6 .9s infinite;
  animation-delay: -280ms;
}
button span:before {
  animation: sparkles7 1.1s infinite;
  animation-delay: -4120ms;
}
button span:after {
  animation: sparkles8 .9s infinite;
  animation-delay: -730ms;
}
button strong:before {
  animation: sparkles9 1.3s infinite;
  animation-delay: -910ms;
}
button strong:after {
  animation: sparkles10 .7s infinite;
  animation-delay: -110ms;
}


@keyframes sparkles3 {
  0% {
    top: 0;
    left: 50%;
    transform: scale(1);
  }
  100% {
    top: -50%;
    left: 50%;
    transform: scale(2.2);
    opacity: 0;
  }
}

@keyframes sparkles4 {
  0% {
    top: 0;
    left: 90%;
    transform: scale(1);
  }
  100% {
    top: -50%;
    left: 100%;
    transform: scale(1.8);
    opacity: 0;
  }
}

@keyframes sparkles5 {
  0% {
    top: 100%;
    left: 50%;
    transform: scale(1);
  }
  100% {
    top: 150%;
    left: 60%;
    transform: scale(2.2);
    opacity: 0;
  }
}

@keyframes sparkles6 {
  0% {
    top: 100%;
    left: 85%;
    transform: scale(1);
  }
  100% {
    top: 150%;
    left: 95%;
    transform: scale(1.8);
    opacity: 0;
  }
}

@keyframes sparkles7 {
  0% {
    top: 90%;
    left: 10%;
    transform: scale(1);
  }
  100% {
    top: 100%;
    left: -5%;
    transform: scale(1.8);
    opacity: 0;
  }
}

@keyframes sparkles8 {
  0% {
    top: 100%;
    left: 15%;
    transform: scale(1);
  }
  100% {
    top: 120%;
    left: 10%;
    transform: scale(1.9);
    opacity: 0;
  }
}

@keyframes sparkles9 {
  0% {
    top: 50%;
    left: 10%;
    transform: scale(1);
  }
  100% {
    top: 20%;
    left: 0%;
    transform: scale(1.8);
    opacity: 0;
  }
}

@keyframes sparkles10 {
  0% {
    top: 50%;
    left: 90%;
    transform: scale(1);
  }
  100% {
    top: 60%;
    left: 100%;
    transform: scale(1.9);
    opacity: 0;
  }
}
