@keyframes fillBars{
    from{
        width:0%;
    }
    to{
        width:100%;
    }
}


@keyframes opacity{
    from{
        opacity: 0.0;
    }
    to{
        opacity: 1;
    }
}

@keyframes slideRight{
    from{
        transform: translateX(-40%);
        opacity: 0.0;
    }
    to{
        transform: translateX(0%);
        opacity:1.0;
       }
}

@keyframes slideLeft{
    from{
        transform: translateX(40%);
        opacity: 0.0;
    }
    to{
        transform: translateX(0%);
        opacity:1.0;
    }
}

@keyframes zoomIn{
    from{
        opacity: 0;
        transform: scale(0.5);
    }
    to{
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes slideUp{
    from{
        opacity: 0;
        transform: translateY(40%);
    }
    to{
        opacity: 1;
        transform: translateY(0%);
    }
}

@keyframes slideDown{
    from{
        opacity: 0;
        transform: translateY(-40%);
    }
    to{
        opacity: 1;
        transform: translateY(0%);
    }
}

@keyframes titleLineIn{
    from{
        opacity:0;
        width:0%;
    }
    to{
        opacity:1;
        width:20%;
    }
}