.sparkles-wrapper {
  position: relative;
  display: inline;
  overflow: visible; }
  .sparkles-wrapper__star {
    position: absolute;
    transform-style: preserve-3d;
    backface-visibility: hidden;
    will-change: transform; }
    .sparkles-wrapper__star path {
      fill: #FFCD00; }
  .sparkles-wrapper__star--st1 {
    width: 21px;
    height: 13px;
    animation: 2700ms ease-in infinite sparkle-2;
    bottom: -7px;
    left: -4px; }
  .sparkles-wrapper__star--st2 {
    width: 8px;
    height: 8px;
    animation: 2000ms ease-in infinite sparkle;
    top: 8px;
    left: 0px; }
  .sparkles-wrapper__star--st3 {
    width: 7px;
    height: 7px;
    animation: 3150ms ease-in infinite sparkle;
    top: 2px;
    right: -5px; }
  .sparkles-wrapper__star--st4 {
    width: 11px;
    height: 11px;
    animation: 2850ms ease-in infinite sparkle;
    bottom: -4px;
    right: -4px; }
  .sparkles-wrapper__star--st5 {
    width: 11px;
    height: 11px;
    animation: 2080ms ease-in infinite sparkle-2;
    top: -4px;
    right: -1px; }

.sparkles-wrapper__star {
  display: none; }

.sparkles-wrapper .sparkles-wrapper__star {
  display: initial; }

@keyframes sparkle {
  0% {
    opacity: 0;
    transform: scale(0) translateZ(0); }
  66.666% {
    opacity: 1;
    transform: scale(1.2) translateZ(0); }
  100% {
    opacity: 0.5;
    transform: scale(0) translateZ(0); } }

@keyframes sparkle-2 {
  0% {
    opacity: 0;
    transform: scale(0) translateZ(0); }
  33.333% {
    opacity: 1;
    transform: scale(1.2) translateZ(0); }
  66.666% {
    opacity: 1;
    transform: scale(0) translateZ(0); }
  100% {
    opacity: 0;
    transform: scale(0) translateZ(0); } }