Строка загрузки

.progress {
    background: #333;
    /* Фон */
    border: 2px solid #333;
    /* Рамка */
    height: 20px;
    /* Высота */
    position: relative;
    /* Относительное позиционирование */
}
.progress::before {
    animation: progress 5s;
    animation-timing-function: linear;
    animation-duration: 5s;
    animation-fill-mode: forwards;
    -webkit-animation-name: progress;
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration: 5s;
    -webkit-animation-fill-mode: forwards;
    content:'';
    position: absolute;
    /* Абсолютное позиционирование */
    height: 100%;
    background: #FFA600;
    /* Фон */
}
@-webkit-keyframes progress {
    from {
        width: 0;
    }
    to {
        width: 100%;
    }
}
@keyframes progress {
    from {
        width: 0;
    }
    to {
        width: 100%;
    }
}