@keyframes arrow_top_down {
    0% {transform: rotate(-90deg) translateX(0px);}
    50% {transform: rotate(-90deg) translateX(-25px);}
    100% {transform: rotate(-90deg) translateX(0px);}
}
@keyframes arrow_top_down_designPage {
  0% {transform: scale(0.3) rotate(-90deg) translateX(0px);}
  50% {transform: scale(0.3) rotate(-90deg) translateX(-25px);}
  100% {transform: scale(0.3) rotate(-90deg) translateX(0px);}
}

#WrapperDataBase #WelcomePage .arrow svg{
    animation-name: arrow_top_down_designPage;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}
#WelcomePage .arrow svg {
    animation-name: arrow_top_down;
    animation-duration: 3s;
    animation-iteration-count: infinite;
}

.toTop svg:last-child{
  animation-name: arrow_top_down_toTop;
  animation-duration: 3s;
  animation-iteration-count: infinite;
}

@keyframes arrow_top_down_toTop {
  0% {transform: translateY(0px);}
  50% {transform: translateY(-25px);}
  100% {transform: translateY(0px);}
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}
.animate__fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
     animation-duration: 2s;
    animation-fill-mode: forwards;
}
.delay_1{
    animation-delay: 1s;
}

.delay_2{
    animation-delay: 2s;
}

.delay_3{
    animation-delay: 3s;
}

.delay_4{
    animation-delay: 4s;
}

.opaciti_0{
    opacity: 0;
}