/* 
    This sparkle code is from https://freecodez.com/post/0ryvaqt
*/

.star-1 {
position: absolute;
top: 20%;
left: 20%;
width: 25px;
height: auto;
filter: drop-shadow(0 0 0 #fffdef);
pointer-events: none;
opacity: 0;
z-index: -5;
transition: all 1s cubic-bezier(0.05, 0.83, 0.43, 0.96);
}

.star-2 {
position: absolute;
top: 45%;
left: 45%;
width: 15px;
height: auto;
filter: drop-shadow(0 0 0 #fffdef);
pointer-events: none;
opacity: 0;
z-index: -5;
transition: all 1s cubic-bezier(0, 0.4, 0, 1.01);
}

.star-3 {
position: absolute;
top: 40%;
left: 40%;
width: 5px;
height: auto;
filter: drop-shadow(0 0 0 #fffdef);
pointer-events: none;
opacity: 0;
z-index: -5;
transition: all 1s cubic-bezier(0, 0.4, 0, 1.01);
}

.star-4 {
position: absolute;
top: 20%;
left: 40%;
width: 8px;
height: auto;
filter: drop-shadow(0 0 0 #fffdef);
pointer-events: none;
opacity: 0;
z-index: -5;
transition: all .8s cubic-bezier(0, 0.4, 0, 1.01);
}

.star-5 {
position: absolute;
top: 25%;
left: 45%;
width: 15px;
height: auto;
filter: drop-shadow(0 0 0 #fffdef);
pointer-events: none;
opacity: 0;
z-index: -5;
transition: all .6s cubic-bezier(0, 0.4, 0, 1.01);
}

.star-6 {
position: absolute;
top: 5%;
left: 50%;
width: 5px;
height: auto;
filter: drop-shadow(0 0 0 #fffdef);
pointer-events: none;
opacity: 0;
z-index: -5;
transition: all .8s ease;
}

:any-link:hover .star-1 {
  position: absolute;
  top: -80%;
  left: -30%;
  width: 25px;
  height: auto;
  filter: drop-shadow(0 0 10px #fffdef);
  z-index: 2;
  opacity: 1;
}

:any-link:hover .star-2 {
  position: absolute;
  top: -25%;
  left: 10%;
  width: 15px;
  height: auto;
  filter: drop-shadow(0 0 10px #fffdef);
  z-index: 2;
  opacity: 1;
}

:any-link:hover .star-3 {
  position: absolute;
  top: 55%;
  left: 25%;
  width: 5px;
  height: auto;
  filter: drop-shadow(0 0 10px #fffdef);
  z-index: 2;
  opacity: 1;
}

:any-link:hover .star-4 {
  position: absolute;
  top: 30%;
  left: 80%;
  width: 8px;
  height: auto;
  filter: drop-shadow(0 0 10px #fffdef);
  z-index: 2;
  opacity: 1;
}

:any-link:hover .star-5 {
  position: absolute;
  top: 25%;
  left: 115%;
  width: 15px;
  height: auto;
  filter: drop-shadow(0 0 10px #fffdef);
  z-index: 2;
  opacity: 1;
}

:any-link:hover .star-6 {
  position: absolute;
  top: 5%;
  left: 60%;
  width: 5px;
  height: auto;
  filter: drop-shadow(0 0 10px #fffdef);
  z-index: 2;
  opacity: 1;
}

.fil0 {
  fill: #ffef79
}