.loading-bar {
    position: fixed;
    z-index: 5000;
    background: rgba(0, 0, 0, 0.1);
    width: 100%;
    top: 0;
    height: 100%;
    overflow: hidden;
    display: none;
}
.loading-bar.active {
    display: block;
}
.loading-activity {
    position: relative;
    height: 15px;
    background-color: #00a9e0;
}
.loading-bars {
    position: relative;
    height: 100%;
    background-size: 32px 32px;
    animation: loading-motion 500ms linear infinite;
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent);
}
@keyframes loading-motion {
    0% {
        transform: translate(-16px, 0);
        transform: translate(-16px, 0);
    }
    100% {
        transform: translate(16px, 0);
        transform: translate(16px, 0);
    }
}