/* ==========================================
   KEYFRAMES
========================================== */

/* Hero Background Zoom */
@keyframes heroZoom {

    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(1.10);
    }

}

/* Floating */

@keyframes floating {

    0% {
        transform: translateY(0px);
    }

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

    100% {
        transform: translateY(0px);
    }

}

/* Bell Swing */

@keyframes bellSwing {

    0% {
        transform: rotate(0deg);
    }

    25% {
        transform: rotate(12deg);
    }

    50% {
        transform: rotate(0deg);
    }

    75% {
        transform: rotate(-12deg);
    }

    100% {
        transform: rotate(0deg);
    }

}

/* Golden Glow */

@keyframes glow {

    0% {
        box-shadow:0 0 5px #ffd54f;
    }

    50% {
        box-shadow:0 0 25px #ffd54f;
    }

    100% {
        box-shadow:0 0 5px #ffd54f;
    }

}

/* Pulse */

@keyframes pulse {

    0% {
        transform:scale(1);
    }

    50% {
        transform:scale(1.08);
    }

    100% {
        transform:scale(1);
    }

}

/* Scroll Arrow */

@keyframes bounce {

    0%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(12px);
    }

    100%{
        transform:translateY(0);
    }

}

/* Flower Falling */

@keyframes flowerFall{

    from{

        transform:translateY(-150px) rotate(0deg);

    }

    to{

        transform:translateY(110vh) rotate(360deg);

    }

}

/* Smoke */

@keyframes smoke{

    0%{

        opacity:.5;
        transform:translateY(0) scale(1);

    }

    100%{

        opacity:0;
        transform:translateY(-100px) scale(2);

    }

}

/* ==========================================
   APPLY ANIMATIONS
========================================== */

.hero-section{

    animation:heroZoom 18s linear infinite alternate;

}

.temple-btn{

    animation:glow 3s infinite;

}

.scroll-down{

    animation:bounce 2s infinite;

}

.scrollTop{

    animation:pulse 2s infinite;

}

.temple-img{

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

}

.hero-content h1{

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

}

.gallery-img:hover{

    animation:pulse .6s;

}