@keyframes fadeIn {
        from { opacity: 0; }
        to { opacity: 1; }
    }

@keyframes fadeOut {
        from { opacity: 1; }
        to { opacity: 0; }
    }

@-webkit-keyframes fadeIn {
        from { opacity: 0; }
        to { opacity: 1; }
    }

@-webkit-keyframes fadeOut {
        from { opacity: 1; }
        to { opacity: 0; }
    }

.fadeIn{
        animation: fadeIn;
        animation-duration: 0.5s;
}

.fadeOut{
        animation: fadeOut;
        animation-duration: 0.5s;
}