/* Animation keyframes */
@keyframes fadeInOut {
    0% { 
        opacity: 1;
        z-index: 201;
     }
    47% { 
        opacity: 1;
        z-index: 201;
    }
    50% {
        opacity: 0;
        z-index: 200;
    }
    97% { 
        opacity: 0; 
        z-index: 200;
    }
    100% { 
        opacity: 1;
        z-index: 201; 
    }
}
  
@keyframes fadeOutIn {
    0% { 
        opacity: 0;
        z-index: 200;
     }
    47% { 
        opacity: 0;
        z-index: 200;
    }
    50% {
        opacity: 1;
        z-index: 201;
    }
    97% { 
        opacity: 1; 
        z-index: 201;
    }
    100% { 
        opacity: 0;
        z-index: 200; 
    }
}

@keyframes flip {
    0% { 
        transform: rotateY(0deg);
     }
    47% { 
        transform: rotateY(0deg);
    }
    50% {
        transform: rotateY(-180deg);
    }
    97% { 
        transform: rotateY(-180deg);
    }
    100% { 
        transform: rotateY(-360deg);
    }
}

.fade-in-out {
    opacity: 1;
    animation: fadeInOut 14s ease-in-out infinite;
}
  
.fade-out-in {
    opacity: 0;
    animation: fadeOutIn 14s ease-in-out infinite;
}