/* ------ IMAGE ZOOM Start ------ */

@-webkit-keyframes zoomInImage {
  from {
    transform: scale3d(1, 1, 1);
    transition: 1s;
  }
  to {
    transform: scale3d(1.1, 1.1, 1.1);
    transition: 1s;
  }
}
@keyframes zoomInImage {
  from {
    transform: scale3d(1, 1, 1);
    transition: 1s;
  }
  to {
    transform: scale3d(1.1, 1.1, 1.1);
    transition: 1s;
  }
}
.zoomInImage {
  -webkit-animation-name: zoomInImage;
          animation-name: zoomInImage;
}

@-webkit-keyframes zoomOutImage {
  from {
    transform: scale3d(1.1, 1.1, 1.1);
    transition: 1s;
  }
  to {
    transform: scale3d(1, 1, 1);
    transition: 1s;
  }
}

@keyframes zoomOutImage {
  from {
    transform: scale3d(1.1, 1.1, 1.1);
    transition: 1s;
  }
  to {
    transform: scale3d(1, 1, 1);
    transition: 1s;
  }
}


/* ------ IMAGE ZOOM End ------ */


/* ------ Slick Slider Nav strock Start  ------ */

@-webkit-keyframes stroke {
  52% {
    transform: rotate(-180deg);
    stroke-dashoffset: 0;
  }
  52.1% {
    transform: rotate(-360deg);
    stroke-dashoffset: 0;
  }
  100% {
    transform: rotate(-180deg);
    stroke-dashoffset: 126;
  }
}

@keyframes stroke {
  52% {
    transform: rotate(-180deg);
    stroke-dashoffset: 0;
  }
  52.1% {
    transform: rotate(-360deg);
    stroke-dashoffset: 0;
  }
  100% {
    transform: rotate(-180deg);
    stroke-dashoffset: 126;
  }
}

/* ------ Slick Slider Nav strock End  ------ */


/* ------ Slick Slider Nav All Arrow Start  ------ */


@-webkit-keyframes arrow {
  0%, 100% {
    transform: translateX(0);
    opacity: 1;
  }
  23% {
    transform: translateX(17px);
    opacity: 1;
  }
  24%, 80% {
    transform: translateX(-22px);
    opacity: 0;
  }
  81% {
    opacity: 1;
    transform: translateX(-22px);
  }
}
@keyframes arrow {
  0%, 100% {
    transform: translateX(0);
    opacity: 1;
  }
  23% {
    transform: translateX(17px);
    opacity: 1;
  }
  24%, 80% {
    transform: translateX(-22px);
    opacity: 0;
  }
  81% {
    opacity: 1;
    transform: translateX(-22px);
  }
}
@-webkit-keyframes arrowUp {
  0%, 100% {
    transform: rotate(-40deg) scaleX(1);
  }
  20%, 80% {
    transform: rotate(0deg) scaleX(0.1);
  }
}
@keyframes arrowUp {
  0%, 100% {
    transform: rotate(-40deg) scaleX(1);
  }
  20%, 80% {
    transform: rotate(0deg) scaleX(0.1);
  }
}
@-webkit-keyframes arrowDown {
  0%, 100% {
    transform: rotate(40deg) scaleX(1);
  }
  20%, 80% {
    transform: rotate(0deg) scaleX(0.1);
  }
}
@keyframes arrowDown {
  0%, 100% {
    transform: rotate(40deg) scaleX(1);
  }
  20%, 80% {
    transform: rotate(0deg) scaleX(0.1);
  }
}

/* ------ Slick Slider Nav All Arrow End  ------ */

/* ------ Video Button Plus Start  ------ */

@keyframes pulse-border {
  0% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}


/* ------ Video Button Plus End  ------ */


/* ------ Motion Shape Border Start  ------ */

@-webkit-keyframes border-transform {
  0%,
  100% {
    border-radius: 63% 37% 54% 46%/55% 48% 52% 45%
  }
  14% {
    border-radius: 40% 60% 54% 46%/49% 60% 40% 51%
  }
  28% {
    border-radius: 54% 46% 38% 62%/49% 70% 30% 51%
  }
  42% {
    border-radius: 61% 39% 55% 45%/61% 38% 62% 39%
  }
  56% {
    border-radius: 61% 39% 67% 33%/70% 50% 50% 30%
  }
  70% {
    border-radius: 50% 50% 34% 66%/56% 68% 32% 44%
  }
  84% {
    border-radius: 46% 54% 50% 50%/35% 61% 39% 65%
  }
}

@keyframes border-transform {
  0%,
  100% {
    border-radius: 63% 37% 54% 46%/55% 48% 52% 45%
  }
  14% {
    border-radius: 40% 60% 54% 46%/49% 60% 40% 51%
  }
  28% {
    border-radius: 54% 46% 38% 62%/49% 70% 30% 51%
  }
  42% {
    border-radius: 61% 39% 55% 45%/61% 38% 62% 39%
  }
  56% {
    border-radius: 61% 39% 67% 33%/70% 50% 50% 30%
  }
  70% {
    border-radius: 50% 50% 34% 66%/56% 68% 32% 44%
  }
  84% {
    border-radius: 46% 54% 50% 50%/35% 61% 39% 65%
  }
}

/* ------ Motion Shape Border End  ------ */