/*

progress.css

Licensed under the WTFPL license

Copyright © 2018 adilbo <internmail@gmail.com>
This program is free software. It comes without any warranty, 
to the extent permitted by applicable law. 
You can redistribute it and/or modify it under the
terms of the Do What The Fuck You Want To Public License, Version 2,
as published by Sam Hocevar. See http://www.wtfpl.net/ for more details.
*/

/*
  CONFIGURATION FILE
  This is the configuration for progress.css.
  Define the attributes of progress bars.
  In addition, you can define the standard color set and 
  the duration sets or different styles.
*/

.progress {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    height: .5rem;
    overflow: hidden;
    font-size: 0.703125rem;
    background-color: #e9ecef; /* GREY */
    border-radius: 3px;
}
.progress-bar {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    color: white; 
    text-align: center;
    white-space: nowrap;
    background-color: black;
    width: 0%;
    animation: progress 2s forwards;
}
@keyframes progress {
  from { width: 0%; }
  to   { width: attr(data-width)%; }
}
.progress .blue   { background-color: #467fcf !important }
.progress .red    { background-color: #cd201f !important }
.progress .green  { background-color: #5eba00 !important }
.progress .yellow { background-color: #f1c40f !important }
