@keyframes fadeIn
  from
    opacity: 0
  to
    opacity: 1

@keyframes fadeInDelayed
  0%
    opacity: 0
  50%
    opacity: 0
  100%
    opacity: 1

@keyframes slideInRight
  from
    opacity: 0
    transform: translate(-($unit * 2), 0px) // -8 0
  to
    opacity: 1
    transform: translate(0px, 0px)

@keyframes slideInLeft
  from
    opacity: 0
    transform: translate($unit * 2, 0px) // 8 0
  to
    opacity: 1
    transform: translate(0px, 0px)

@keyframes popIn
  from
    transform: scale(0)
  to
    transform: scale(1)

@keyframes slideInDelayed
  0%
    opacity: 0
    transform: translate(-($unit * 2), 0) // -8 0
  50%
    opacity: 0
    transform: translate(-($unit * 2), 0) // -8 0
  100%
    opacity: 1
    transform: translate(0, 0)

@keyframes shrinkIn
  from
    transform: scale(1.5)
  to
    transform: scale(1)

@keyframes growInWidth
  from
    width: 0
  to
    width: 100%

@keyframes growInWidthScale
  from
    transform: scale(0, 1)
  to
    transform: scale(1, 1)

@keyframes growInHeight
  from
    transform: scale(1, 0)
  to
    transform: scale(1, 1)

@keyframes growInHeightDelayed
  0%
    transform: scale(1, 0)
  50%
    transform: scale(1, 0)
  100%
    transform: scale(1, 1)