Кнопка "на главную"

Видеоинструкция: https://youtu.be/CJE5gLJxCCs

Код:

<div class="homeicon__wrapper">
  <a href="/"><div class="homeicon__circle"><img src="https://img.icons8.com/material-rounded/24/000000/home.png"/>
    <div class="homeicon__text">На главную!</div>
    </div></a>
</div>

<style>
 .homeicon__wrapper {
  position: fixed;
  bottom: 30px;
  right: 30px;  
  z-index: 10;
}
.homeicon__circle {
  position: relative;
  border-radius: 50%;
  background: orange;
  width: 50px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  animation: 4s circle--moving linear infinite normal; 
}
.homeicon__text {
    text-decoration: underline;
  position: absolute;
  right: 0px;
  white-space: nowrap;
  top: 50%;
  transform: translate(0px, -50%);
  color: orange;
  animation: 4s sign--moving infinite linear normal;
}
@keyframes sign--moving 
{
  0% {
    right: -10px;
  opacity: 0;
  }
  10% {
     right: 60px;
  opacity: 1;
  }
    60% {
     right: 60px;
  opacity: 1;
  }
   70% {
    right: -10px;
  opacity: 0;
  }
  100% {
    right: -10px;
  opacity: 0;
  }
}
@keyframes circle--moving 
{
  0% {
    transform: translate(0px, 0px);
  }

  
    60% {
  transform: translate(0px, 0px) rotate(0deg);
  }
   70% {
    transform: translate(0px, 0px) rotate(0deg);
  }
  90% {
    transform: translate(0px, 0px) rotate(360deg);
  }
  92% {
    transform: translate(0px, 0px) rotate(360deg);
  }
  94% {
    transform: translate(0px, 5px) rotate(360deg);
  }
  96% {
    transform: translate(0px, 0px) rotate(360deg);
  }
  98% {
    transform: translate(0px, 5px) rotate(360deg);
  }
  100% {
    transform: translate(0px, 0px) rotate(360deg);
  }
}
</style>

Код для главной:

<style>
.homeicon__wrapper {
display: none;
}
</style>