@keyframes showErrorPanel {
  from {
    bottom: -70px;
  }

  to {
    bottom: 0;
  }
}

@keyframes hideErrorPanel {
  from {
    bottom: 0;
  }

  to {
    bottom: 70px;
  }
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

i.fa-spinner {
  animation: spin 0.75s infinite linear;
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes showToast {
  0% {
    opacity: 0;
  }

  10% {
    opacity: 1;
  }

  80% {
    opacity: 0.9;
  }

  100% {
    opacity: 0;
  }
}

@keyframes blinkBackground {
  from {
    background-color: $grey2;
  }
  to {
    background-color: lighten($grey2, 10%);
  }
}

@keyframes blinkGlow {
  from {
    box-shadow: $cyan 0 0 4px 1px;
  }
  to {
    box-shadow: $cyan 0 0 0 0;
  }
}

@keyframes bounceLeft {
  from {
    padding-right: 8px;
  }
  to {
    padding-right: 16px;
  }
}

@keyframes bounceRight {
  from {
    padding-left: 4px;
  }
  to {
    padding-left: 12px;
  }
}
