/*==========================
        Fade Up
==========================*/

@keyframes fadeUp{

    from{

        opacity:0;
        transform:translateY(70px);

    }

    to{

        opacity:1;
        transform:translateY(0);

    }

}

.fade-up{

    animation:fadeUp 1s ease forwards;

}

/*==========================
        Fade Left
==========================*/

@keyframes fadeLeft{

    from{

        opacity:0;
        transform:translateX(-80px);

    }

    to{

        opacity:1;
        transform:translateX(0);

    }

}

.fade-left{

    animation:fadeLeft 1s ease;

}

/*==========================
        Fade Right
==========================*/

@keyframes fadeRight{

    from{

        opacity:0;
        transform:translateX(80px);

    }

    to{

        opacity:1;
        transform:translateX(0);

    }

}

.fade-right{

    animation:fadeRight 1s ease;

}

/*==========================
        Zoom
==========================*/

@keyframes zoom{

    from{

        opacity:0;

        transform:scale(.8);

    }

    to{

        opacity:1;

        transform:scale(1);

    }

}

.zoom{

    animation:zoom .8s ease;

}

/*==========================
        Float
==========================*/

@keyframes floating{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-12px);

    }

    100%{

        transform:translateY(0);

    }

}

.hero-image img{

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

}

/*==========================
        Button
==========================*/

.btn{

    position:relative;

    overflow:hidden;

}

.btn::before{

    content:"";

    position:absolute;

    left:-120%;

    top:0;

    width:120%;

    height:100%;

    background:rgba(255,255,255,.35);

    transform:skewX(-25deg);

    transition:.6s;

}

.btn:hover::before{

    left:130%;

}

/*==========================
        Card Hover
==========================*/

.card,
.award-card,
.contact-card,
.why-card,
.stat{

    transition:.35s;

}

.card:hover,
.award-card:hover,
.contact-card:hover,
.why-card:hover,
.stat:hover{

    transform:translateY(-10px) scale(1.03);

}

/*==========================
        Image Hover
==========================*/

.gallery img,
.photo-card img,
.major-image img{

    transition:.5s;

}

.gallery img:hover,
.photo-card img:hover,
.major-image img:hover{

    transform:scale(1.08);

}

/*==========================
        Navbar Hover
==========================*/

nav a{

    transition:.35s;

}

nav a:hover{

    letter-spacing:1px;

}

/*==========================
        Footer
==========================*/

footer{

    animation:fadeUp 1.2s ease;

}