/* Slide In Up */
.fc-slideInUp {
    opacity: 1;
    position: relative;
    animation-name: slideInUp;
    animation-duration: 2s;  
    animation-delay: 0;
    animation-fill-mode: both;
    animation-timing-function: ease;
    animation-direction: alternate;
}
@keyframes slideInUp {
    from {bottom: -300px;}
    to {bottom: 0;}
}

/* Slide In Left */
.fc-slideInLeft {
    opacity: 1;
    position: relative;
    animation-name: slideInLeft;
    animation-duration: 2s;  
    animation-delay: 0;
    animation-fill-mode: both;
    animation-timing-function: ease;
    animation-direction: alternate;
}
@keyframes slideInLeft {
    from {left: -300px;}
    to {left: 0;}
}

/* Slide In Right */
.fc-slideInRight {
    opacity: 1;
    position: relative;
    animation-name: slideInRight;
    animation-duration: 2s;  
    animation-delay: 0;
    animation-fill-mode: both;
    animation-timing-function: ease;
    animation-direction: alternate;
}
@keyframes slideInRight {
    from {right: -300px;}
    to {right: 0;}
}

/* Slide In Down */
.fc-slideInDown {
    opacity: 1;
    position: relative;
    animation-name: slideInDown;
    animation-duration: 2s;  
    animation-delay: 0;
    animation-fill-mode: both;
    animation-timing-function: ease;
    animation-direction: alternate;
}
@keyframes slideInDown {
    from {top: -300px;}
    to {top: 0;}
}

/* Fade In */
.fc-fadeIn {
    opacity: 1;
    position: relative;
    animation-name: fadeIn;
    animation-duration: 5s;  
    animation-delay: 0;
    animation-fill-mode: both;
    animation-timing-function: ease;
    animation-direction: alternate;
}
@keyframes fadeIn {
    from {opacity: 0;}
    to {opacity: 1;}
}