@keyframes slideInUp {
  from {
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideOutDown {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes slideToLeft {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(0);
  }
}

@keyframes slideToRight {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(110%);
  }
}

@keyframes fadeIn {
  0%{
    opacity: 0;
    display: none;
  }
  100%{
    opacity: 1;
    display: block;
  }
}

@keyframes fadeOut {
  0%{
    opacity: 1;
    display: block;
  }
  100%{
    opacity: 0;
    display: none;
  }
}

@keyframes spinner {
  to {
    transform: rotate(360deg);
  }
}

@keyframes circleAnimation {
  100%{
    transform: rotate(360deg);
  }
}