/*==================================================
    GONDO EXPORT THEME
    File : animation.css
    Version : 1.0.0
==================================================*/


/*==================================================
01. TRANSITION
==================================================*/

.fade-transition{
    transition:all .3s ease;
}


/*==================================================
02. FADE UP
==================================================*/

.fade-up{
    opacity:0;
    transform:translateY(40px);
}

.fade-up.show{
    opacity:1;
    transform:translateY(0);
}


/*==================================================
03. FADE DOWN
==================================================*/

.fade-down{
    opacity:0;
    transform:translateY(-40px);
}

.fade-down.show{
    opacity:1;
    transform:translateY(0);
}


/*==================================================
04. FADE LEFT
==================================================*/

.fade-left{
    opacity:0;
    transform:translateX(-40px);
}

.fade-left.show{
    opacity:1;
    transform:translateX(0);
}


/*==================================================
05. FADE RIGHT
==================================================*/

.fade-right{
    opacity:0;
    transform:translateX(40px);
}

.fade-right.show{
    opacity:1;
    transform:translateX(0);
}


/*==================================================
06. ZOOM
==================================================*/

.zoom-in{
    opacity:0;
    transform:scale(.9);
}

.zoom-in.show{
    opacity:1;
    transform:scale(1);
}


/*==================================================
07. BUTTON HOVER
==================================================*/

.btn-gondo,
.btn-outline-gondo{

    transition:.3s;

}

.btn-gondo:hover,
.btn-outline-gondo:hover{

    transform:translateY(-3px);

}


/*==================================================
08. CARD HOVER
==================================================*/

.card-gondo{

    transition:.35s;

}

.card-gondo:hover{

    transform:translateY(-8px);

}


/*==================================================
09. IMAGE HOVER
==================================================*/

.image-hover{

    overflow:hidden;

    border-radius:inherit;

}

.image-hover img{

    transition:.4s;

}

.image-hover:hover img{

    transform:scale(1.08);

}


/*==================================================
10. LINK ANIMATION
==================================================*/

.link-line{

    position:relative;

}

.link-line::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-3px;

    width:0;

    height:2px;

    background:var(--primary);

    transition:.3s;

}

.link-line:hover::after{

    width:100%;

}


/*==================================================
11. ICON HOVER
==================================================*/

.icon-hover{

    transition:.3s;

}

.icon-hover:hover{

    transform:rotate(8deg) scale(1.1);

}


/*==================================================
12. BACK TO TOP
==================================================*/

.back-to-top{

    transition:.3s;

}

.back-to-top:hover{

    transform:translateY(-5px);

}


/*==================================================
13. LOADER
==================================================*/

.loader-spin{

    animation:spin 1s linear infinite;

}

@keyframes spin{

    from{
        transform:rotate(0deg);
    }

    to{
        transform:rotate(360deg);
    }

}


/*==================================================
14. FLOATING
==================================================*/

.floating{

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

}

@keyframes floating{

    0%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(-10px);
    }

    100%{
        transform:translateY(0);
    }

}


/*==================================================
15. FADE ANIMATION
==================================================*/

@keyframes fadeIn{

    from{

        opacity:0;

    }

    to{

        opacity:1;

    }

}

.fade-in{

    animation:fadeIn .8s ease;

}