/* Animations */
.fade-in {
    opacity: 0;
    transition: opacity .5s ease-in;
}
.fade-in.visible {
    opacity: 1;
}

.slide-in-left {
    opacity: 0;
    transform: translateX(-60%);
    transition: transform 0.8s ease-out, opacity 0.8s ease-out;
}
.slide-in-left.visible {
    opacity: 1;
    transform: translateX(0);
}

.drop-in {
    opacity: 0;
    transform: translateY(-50%);
    transition: transform 0.6s cubic-bezier(0.47, 0, 0.745, 0.715), opacity 0.6s ease-out;
}
.drop-in.visible {
    opacity: 1;
    transform: translateY(0);
}

.fade-scale-in {
    opacity: 0;
    transform: scale(0.5);
    transition: transform 0.6s ease-out, opacity 0.6s ease-out;
}
.fade-scale-in.visible {
    opacity: 1;
    transform: scale(1);
}

.bounce-in {
    opacity: 0;
    transform: translateY(10%);
    transition: transform 0.8s cubic-bezier(0.68, -0.55, 0.27, 1.55), opacity 0.8s ease-out;
}
.bounce-in.visible {
    opacity: 1;
    transform: translateY(0);
}

.flip-in {
    opacity: 0;
    transform: rotateY(-90deg);
    transition: transform 0.8s ease-out, opacity 0.8s ease-out;
}
.flip-in.visible {
    opacity: 1;
    transform: rotateY(0deg);
}
/* END Animations */