/* ==========================================================
   RADHE ENTERPRISE
   ANIMATIONS
   Version : 1.0
========================================================== */

/* ==========================================================
   INITIAL STATE
========================================================== */

.reveal{

    opacity:0;

    transition:all .9s cubic-bezier(.215,.61,.355,1);

    will-change:transform,opacity;

}

.reveal.active{

    opacity:1;

    transform:none;

}


/* ==========================================================
   FADE UP
========================================================== */

.fade-up{

    transform:translateY(60px);

}

/* ==========================================================
   FADE down
========================================================== */

@keyframes fadeDown{

    from{

        opacity:0;

        transform:translateY(-15px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}


/* ==========================================================
   FADE LEFT
========================================================== */

.fade-left{

    transform:translateX(-60px);

}


/* ==========================================================
   FADE RIGHT
========================================================== */

.fade-right{

    transform:translateX(60px);

}


/* ==========================================================
   ZOOM
========================================================== */

.zoom{

    transform:scale(.9);

}


/* ==========================================================
   ROTATE
========================================================== */

.rotate{

    transform:rotate(5deg) scale(.95);

}


/* ==========================================================
   DELAYS
========================================================== */

.delay-100{

    transition-delay:.1s;

}

.delay-200{

    transition-delay:.2s;

}

.delay-300{

    transition-delay:.3s;

}

.delay-400{

    transition-delay:.4s;

}

.delay-500{

    transition-delay:.5s;

}


/* ==========================================================
   IMAGE HOVER
========================================================== */

.image-hover{

    overflow:hidden;

}

.image-hover img{

    transition:transform .6s ease;

}

.image-hover:hover img{

    transform:scale(1.08);

}


/* ==========================================================
   CARD HOVER
========================================================== */

.hover-up{

    transition:all .35s ease;

}

.hover-up:hover{

    transform:translateY(-10px);

}


/* ==========================================================
   BUTTON RIPPLE
========================================================== */

.btn{

    position:relative;

    overflow:hidden;

}

.btn::before{

    content:"";

    position:absolute;

    top:50%;

    left:50%;

    width:0;

    height:0;

    background:rgba(255,255,255,.18);

    border-radius:50%;

    transform:translate(-50%,-50%);

    transition:.6s;

}

.btn:hover::before{

    width:320px;

    height:320px;

}


/* ==========================================================
   UNDERLINE ANIMATION
========================================================== */

.underline{

    position:relative;

}

.underline::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-6px;

    width:0;

    height:2px;

    background:currentColor;

    transition:.35s;

}

.underline:hover::after{

    width:100%;

}


/* ==========================================================
   SMOOTH IMAGE
========================================================== */

.smooth{

    transition:all .45s ease;

}