/* loading */
#sys-loading {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1000000;
    background: url(../images/loading.jpg) no-repeat;
    background-color:#000;
    background-size: 100%;
    opacity: 1
}
.progress{
  height: 25px;
  background: #262626;
  padding: 3px;
  overflow: visible;
  border-radius: 20px;
  border-top: 1px solid #000;
  border-bottom: 1px solid #7992a8;
  margin-top: 45%;
  margin-right: 30px;
  margin-left: 30px;
}
.progress .progress-bar{
  left: 0;
  top: 0;
  border-radius: 20px;
  position: relative;
  animation: animate-positive 2s;
}
.progress .progress-value{
  display: block;
  padding: 3px 7px;
  font-size: 13px;
  color: #fff;
  border-radius: 4px;
  background: #191919;
  border: 1px solid #000;
  position: absolute;
  top: -40px;
  right: -10px;
}
.progress .progress-value:after{
  content: "";
  border-top: 10px solid #191919;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  position: absolute;
  bottom: -6px;
  left: 26%;
}
.progress-bar.active{
  animation: reverse progress-bar-stripes 0.40s linear infinite, animate-positive 2s;
}
@-webkit-keyframes animate-positive{
  0% { width: 0; }
}
@keyframes animate-positive{
  0% { width: 0; }
}