/* Fade In */
@keyframes fadeIn{
    from{
        opacity:0;
    }
    to{
        opacity:1;
    }
}

/* Fade Up */
@keyframes fadeUp{
    from{
        opacity:0;
        transform:translateY(50px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

/* Zoom In */
@keyframes zoomIn{
    from{
        opacity:0;
        transform:scale(.8);
    }
    to{
        opacity:1;
        transform:scale(1);
    }
}

/* Float */
@keyframes float{
    0%,100%{
        transform:translateY(0);
    }
    50%{
        transform:translateY(-10px);
    }
}

/* Pulse */
@keyframes pulse{
    0%{
        transform:scale(1);
    }
    50%{
        transform:scale(1.08);
    }
    100%{
        transform:scale(1);
    }
}

/* Rotate */
@keyframes rotate{
    from{
        transform:rotate(0deg);
    }
    to{
        transform:rotate(360deg);
    }
}

/* Hero */
.hero-content{
    animation:fadeUp 1.2s ease;
}

.hero h1{
    animation:zoomIn 1.4s ease;
}

.hero p,
.hero h3,
#countdown,
.btn{
    animation:fadeIn 2s ease;
}

/* Sections */
section{
    animation:fadeUp .8s ease both;
}

/* Cards */
.card{
    transition:.35s;
}

.card:hover{
    transform:translateY(-8px);
    box-shadow:0 20px 45px rgba(0,0,0,.15);
}

/* Gallery */
.gallery img{
    transition:.35s;
}

.gallery img:hover{
    transform:scale(1.05);
}

/* Buttons */
.btn,
form button,
#shareBtn{
    transition:.3s ease;
}

.btn:hover,
form button:hover,
#shareBtn:hover{
    transform:translateY(-3px);
}

/* Music Button */
#musicBtn{
    animation:float 3s ease-in-out infinite;
}

#musicBtn.playing{
    animation:rotate 6s linear infinite;
}

/* Lightbox */
#lightbox{
    animation:fadeIn .3s ease;
}

#lightbox img{
    animation:zoomIn .3s ease;
}

/* Reveal Animation */
.reveal{
    opacity:0;
    transform:translateY(60px);
    transition:all .8s ease;
}

.reveal.active{
    opacity:1;
    transform:translateY(0);
}