@keyframes cuke-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes cuke-fade-out {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, -50px, 0);
  }
}

@keyframes cuke-fade-in {
  from {
    opacity: 0;
    transform: translate3d(0, -50px, 0);
  }
  to {
    opacity: 1;
    transform: scale(1) translate3d(0, 0, 0);
  }
}

@keyframes cuke-mask-fade-in {
  from {
    opacity: 0;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 1;
    transform: scale(1) translate3d(0, 0, 0);
  }
}
@keyframes cuke-mask-fade-out {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes cuke-slide-up {
  from {
    opacity: 0;
    transform: translate3d(0, 15px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes cuke-slide-up-out {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, 15px, 0);
  }
}

@keyframes cuke-slide-down {
  from {
    opacity: 0;
    transform: translate3d(0, -15px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes cuke-slide-down-out {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, -15px, 0);
  }
}

@keyframes cuke-slide-right {
  from {
    opacity: 0;
    transform: translate3d(15px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes cuke-slide-right-out {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(15px, 0, 0);
  }
}

@keyframes cuke-slide-left {
  from {
    opacity: 0;
    transform: translate3d(-15px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
@keyframes cuke-slide-left-out {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(-15px, 0, 0);
  }
}
@keyframes cuke-drawer-slide-in-left {
  from {
    transform: translate3d(-100%, 0, 0);
  }
  to {
    transform: scale(1) translate3d(0, 0, 0);
  }
}

@keyframes cuke-drawer-slide-out-left {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes cuke-drawer-slide-in-right {
  to {
    transform: translate3d(0, 0, 0);
  }
}

@keyframes cuke-drawer-slide-out-right {
  from {
    transform: translate3d(-100%, 0, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}

@keyframes cuke-drawer-slide-in-top {
  from {
    transform: translate3d(0, -100%, 0);
  }
  to {
    transform: scale(1) translate3d(0, 0, 0);
  }
}

@keyframes cuke-drawer-slide-out-top {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes cuke-drawer-slide-in-bottom {
  from {
    transform: translate3d(0, 100%, 0);
  }
  to {
    transform: scale(1) translate3d(0, -100%, 0);
  }
}

@keyframes cuke-drawer-slide-out-bottom {
  from {
    transform: translate3d(0, -100%, 0);
  }
  to {
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes cuke-hide {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translate3d(-20px, 0, 0);
  }
}

@keyframes cuke-picker-hide {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, -30px, 0);
  }
}

@keyframes cuke-picker-open {
  from {
    opacity: 0;
    transform: translate3d(0, -30px, 0);
  }
  to {
    opacity: 1;
    transform: scale(1) translate3d(0, 0, 0);
  }
}

@keyframes cuke-picker-close {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, -15px, 0);
  }
}

@keyframes cuke-notification-open {
  from {
    opacity: 0;
    transform: translate3d(100px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes cuke-notification-open-from-left {
  from {
    opacity: 0;
    transform: translate3d(-100px, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes cuke-notification-close {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(100px, 0, 0);
  }
}
@keyframes cuke-notification-close-from-left {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(-100px, 0, 0);
  }
}

@keyframes cuke-zoom-in {
  from {
    transform: scale(0);
  }
  to {
    transform: scale(1);
  }
}

@keyframes cuke-zoom-out {
  from {
    transform: scale(1);
  }
  to {
    transform: scale(0);
  }
}

