/* -ANIMATION STYLESHEET-
* Name: goldlight.css
* Written By: Gold Eyes Studio
* Version: 2.0.0
* Animations for Gold Eyes Studio Themes & Tempaltes
* Special for Goldeyes studio items buyers.
* This plugin does not call any other file.
*/
.animated{
    opacity: 0;
    animation-duration: var(--animated-items-base);
    animation-fill-mode: both;
}

.animated.visible{opacity:1;}

.group-hover-fadeIn,
.group-hover-fadeInUp,
.group-hover-fadeInLeft,
.group-hover-fadeInRight,
.group-hover-fadeInDown,
.group-hover-zoomIn,
.group-hover-zoomInReverse,
.group-hover-blurIn,
.group-hover-blurInReverse,
.group-hover-blurInUp,
.group-hover-blurInDown,
.group-hover-blurInLeft,
.group-hover-blurInRight,
.group-hover-rotateIn,
.group-hover-rotateInLeft,
.group-hover-rotateInRight,
.group-hover-rotateInUp,
.group-hover-rotateInDown,
.group-hover-flipInY,
.group-hover-flipInX{
    animation-duration: var(--group-animated-items-base);
    animation-fill-mode: both;
}

.fadeIn,.group:hover .group-hover-fadeIn {
    animation-name: fadeIn;
}
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}


.fadeInUp,.group:hover .group-hover-fadeInUp {
    animation-name: fadeInUp;
}
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: var(--fadeInUp);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}


.fadeInLeft,.group:hover .group-hover-fadeInLeft {
    animation-name: fadeInLeft;
}
@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: var(--fadeInLeft);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}



.fadeInRight,.group:hover .group-hover-fadeInRight {
    animation-name: fadeInRight;
}
@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: var(--fadeInRight);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}


.fadeInDown,.group:hover .group-hover-fadeInDown {
    animation-name: fadeInDown;
}
@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: var(--fadeInDown);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}


.zoomIn,.group:hover .group-hover-zoomIn {
    animation-name: zoomIn;
}
@keyframes zoomIn {
    from {
        opacity: 0;
        transform: var(--zoomIn);
    }
    to {
        opacity: 1;
        transform: scale3d(1, 1, 1) translateZ(0);
    }
}


.zoomInReverse,.group:hover .group-hover-zoomInReverse {
    animation-name: zoomInReverse;
}
@keyframes zoomInReverse {
    from {
        opacity: 0;
        transform: scale3d(1.1, 1.1, 1.1) translateZ(0);
    }
    to {
        opacity: 1;
        transform: scale3d(1, 1, 1) translateZ(0);
    }
}


.blurIn,.group:hover .group-hover-blurIn {
    animation-name: blurIn;
    backface-visibility: hidden;
}
@keyframes blurIn {
    from {
        opacity: 0;
        filter: var(--blurIn-blur);
        transform: var(--blurIn-transform);
    }
    to {
        opacity: 1;
        filter: blur(0px);
        transform: scale3d(1, 1, 1) translateZ(0);
    }
}


.blurInReverse,.group:hover .group-hover-blurInReverse {
    animation-name: blurInReverse;
    backface-visibility: hidden;
}
@keyframes blurInReverse {
    from {
        opacity: 0;
        filter: var(--blurInReverse-blur);
        transform: var(--blurInReverse-transform);
    }
    to {
        opacity: 1;
        filter: blur(0px);
        transform: scale3d(1, 1, 1) translateZ(0);
    }
}


.blurInUp,.group:hover .group-hover-blurInUp {
    animation-name: blurInUp;
    backface-visibility: hidden;
}
@keyframes blurInUp {
    from {
        opacity: 0;
        filter: var(--blurInUp-blur);
        transform: var(--blurInUp-transform);
    }
    to {
        opacity: 1;
        filter: blur(0px);
        transform: translate3d(0, 0, 0) translateZ(0);
    }
}


.blurInDown,.group:hover .group-hover-blurInDown {
    animation-name: blurInDown;
    backface-visibility: hidden;
}
@keyframes blurInDown {
    from {
        opacity: 0;
        filter: var(--blurInDown-blur);
        transform: var(--blurInDown-transform);
    }
    to {
        opacity: 1;
        filter: blur(0px);
        transform: translate3d(0, 0, 0) translateZ(0);
    }
}


.blurInLeft,.group:hover .group-hover-blurInLeft {
    animation-name: blurInLeft;
    backface-visibility: hidden;
}
@keyframes blurInLeft {
    from {
        opacity: 0;
        filter: var(--blurInLeft-blur);
        transform: var(--blurInLeft-transform);
    }
    to {
        opacity: 1;
        filter: blur(0px);
        transform: translate3d(0, 0, 0) translateZ(0);
    }
}


.blurInRight,.group:hover .group-hover-blurInRight {
    animation-name: blurInRight;
    backface-visibility: hidden;
}
@keyframes blurInRight {
    from {
        opacity: 0;
        filter: var(--blurInRight-blur);
        transform: var(--blurInRight-transform);
    }
    to {
        opacity: 1;
        filter: blur(0px);
        transform: translate3d(0, 0, 0) translateZ(0);
    }
}


.rotateIn,.group:hover .group-hover-rotateIn {
    transform-style: preserve-3d;
    animation-name: rotateIn;
    backface-visibility: hidden;
}
@keyframes rotateIn {
    from {
        opacity: 0;
        transform: var(--rotateIn);
    }
    to {
        opacity: 1;
        transform: perspective(300px) scale(1) translate3d(0, 0, 0) rotateY(0) rotateX(0) translateZ(0);
    }
}


.rotateInLeft,.group:hover .group-hover-rotateInLeft {
    transform-style: preserve-3d;
    animation-name: rotateInLeft;
    backface-visibility: hidden;
}
@keyframes rotateInLeft {
    from {
        opacity: 0;
        transform: var(--rotateInLeft);
    }
    to {
        opacity: 1;
        transform: perspective(300px) scale(1) rotateY(0) rotateX(0) translateZ(0);
    }
}


.rotateInRight,.group:hover .group-hover-rotateInRight {
    transform-style: preserve-3d;
    animation-name: rotateInRight;
    backface-visibility: hidden;
}
@keyframes rotateInRight {
    from {
        opacity: 0;
        transform: var(--rotateInRight);
    }
    to {
        opacity: 1;
        transform: perspective(300px) scale(1) rotateY(0) rotateX(0) translateZ(0);
    }
}


.rotateInUp,.group:hover .group-hover-rotateInUp {
    transform-style: preserve-3d;
    animation-name: rotateInUp;
    backface-visibility: hidden;
}
@keyframes rotateInUp {
    from {
        opacity: 0;
        transform: var(--rotateInUp);
    }
    to {
        opacity: 1;
        transform: perspective(300px) scale(1) rotateY(0) rotateX(0) translateZ(0);
    }
}


.rotateInDown,.group:hover .group-hover-rotateInDown {
    transform-style: preserve-3d;
    animation-name: rotateInDown;
    backface-visibility: hidden;
    transition: all 0.8s cubic-bezier(0.27, 0, 0.2, 1);
}
@keyframes rotateInDown {
    from {
        opacity: 0;
        transform: var(--rotateInDown);
    }
    to {
        opacity: 1;
        transform: perspective(300px) scale(1) rotateY(0) rotateX(0) translateZ(0);
    }
}


.flipInY,.group:hover .group-hover-flipInY {
    transform-style: preserve-3d;
    backface-visibility: hidden;
    animation-name: flipInY;
}
@keyframes flipInY {
  from {
    transform: perspective(750px) rotate3d(1, 0, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    transform: perspective(750px) rotate3d(1, 0, 0, -20deg);
    animation-timing-function: ease-in;
  }

  60% {
    transform: perspective(750px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    transform: perspective(750px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    transform: perspective(750px);
  }
}


.flipInX,.group:hover .group-hover-flipInX {
    transform-style: preserve-3d;
    backface-visibility: hidden;
    animation-name: flipInX;
}
@keyframes flipInX {
  from {
    transform: perspective(750px) rotate3d(0, 1, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    transform: perspective(750px) rotate3d(0, 1, 0, -20deg);
    animation-timing-function: ease-in;
  }

  60% {
    transform: perspective(750px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    transform: perspective(750px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    transform: perspective(750px);
  }
}