/* ==========================================
   Animations
   Fantasy CMS
========================================== */

/* ------------------------------------------
   Fade In
------------------------------------------ */

.fade-in{

    opacity:0;

    transition:
        opacity .8s ease;

}

.fade-in.show{

    opacity:1;

}


/* ------------------------------------------
   Fade Up
------------------------------------------ */

.fade-up{

    opacity:0;

    transform:translateY(40px);

    transition:
        opacity .8s ease,
        transform .8s ease;

}

.fade-up.show{

    opacity:1;

    transform:translateY(0);

}


/* ------------------------------------------
   Fade Down
------------------------------------------ */

.fade-down{

    opacity:0;

    transform:translateY(-40px);

    transition:
        opacity .8s ease,
        transform .8s ease;

}

.fade-down.show{

    opacity:1;

    transform:translateY(0);

}


/* ------------------------------------------
   Fade Left
------------------------------------------ */

.fade-left{

    opacity:0;

    transform:translateX(-50px);

    transition:
        opacity .8s ease,
        transform .8s ease;

}

.fade-left.show{

    opacity:1;

    transform:translateX(0);

}


/* ------------------------------------------
   Fade Right
------------------------------------------ */

.fade-right{

    opacity:0;

    transform:translateX(50px);

    transition:
        opacity .8s ease,
        transform .8s ease;

}

.fade-right.show{

    opacity:1;

    transform:translateX(0);

}


/* ------------------------------------------
   Zoom
------------------------------------------ */

.zoom-in{

    opacity:0;

    transform:scale(.9);

    transition:
        opacity .8s ease,
        transform .8s ease;

}

.zoom-in.show{

    opacity:1;

    transform:scale(1);

}


/* ------------------------------------------
   Rotate
------------------------------------------ */

.rotate{

    transition:
        transform .4s ease;

}

.rotate:hover{

    transform:rotate(3deg);

}


/* ------------------------------------------
   Hover Lift
------------------------------------------ */

.hover-lift{

    transition:
        transform .35s ease,
        box-shadow .35s ease;

}

.hover-lift:hover{

    transform:translateY(-8px);

    box-shadow:var(--shadow);

}


/* ------------------------------------------
   Image Zoom
------------------------------------------ */

.img-zoom{

    overflow:hidden;

}

.img-zoom img{

    transition:
        transform .8s ease;

}

.img-zoom:hover img{

    transform:scale(1.08);

}


/* ------------------------------------------
   Gold Glow
------------------------------------------ */

.gold-glow{

    transition:
        box-shadow .3s ease;

}

.gold-glow:hover{

    box-shadow:
        0 0 30px rgba(212,175,55,.35);

}


/* ------------------------------------------
   Hero Overlay
------------------------------------------ */

@keyframes heroFade{

    0%{

        opacity:0;

    }

    100%{

        opacity:1;

    }

}

.hero-fade{

    animation:
        heroFade
        1.2s ease;

}


/* ------------------------------------------
   Loading
------------------------------------------ */

@keyframes loadingPulse{

    0%{

        opacity:.4;

    }

    50%{

        opacity:1;

    }

    100%{

        opacity:.4;

    }

}

.loading{

    animation:
        loadingPulse
        1.2s infinite;

}


/* ------------------------------------------
   Float
------------------------------------------ */

@keyframes floating{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-10px);

    }

    100%{

        transform:translateY(0);

    }

}

.float{

    animation:
        floating
        4s ease-in-out infinite;

}


/* ------------------------------------------
   Scroll Indicator
------------------------------------------ */

@keyframes scroll{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(12px);

    }

    100%{

        transform:translateY(0);

    }

}

.scroll-indicator{

    animation:
        scroll
        2s infinite;

}