.coming-soon::before
{
    animation: wipe-up forwards 0.5s ease 0.5s;
}
@keyframes wipe-up
{
    100%
    {
        transform: translateX(-100%);
    }    
}
.coming-soon::after
{
    animation: wipe-down forwards 0.5s ease 0.5s;
}
@keyframes wipe-down
{
    100%
    {
        transform: translateX(100%);
    }    
}
.pop
{
    animation: pop 0.6s ease forwards 1.5s;
    opacity: 0;
}
@keyframes pop {
    
    0%
    {
        transform: scale(0);
    }
    100%
    {
        opacity: 1;
        transform: scale(1);
    }
}
.delay-100ms
{
    animation-delay: 1s;
}
.fade-up
{
    animation: fade-up 0.5s linear forwards 1s;
    opacity: 0;
}

@keyframes fade-up
{
    0%
    {
        opacity: 0;
        transform: translateY(100%) scale(0.5);
    }
    70%
    {
        opacity: 1;
        transform: translateY(0) scale(0.5);
    }
    100%
    {
        opacity: 1;
        transform: scale(1);
    }    
}