/*animation*/
.blue {
    color: #017ad2;
}
.white {
    color: #fff;
}
.gray {
  color:  #666;
}
.bar-title{
  font-size: 14px;
  margin-bottom: 8px;
}
.bar-wrapper {
    width: 75%;
    text-align: left;
    margin:2vh auto;
}
@media screen and (max-width: 960px) {
  .bar-wrapper {

    width: 90%;
     margin:2vh auto;
}
}
.barbox{
    display: block;
    position: relative;
    text-align: left;
}
.barbox.long {
    width: 100%;
}

.bar {
    display: block;
    width: 100%;
    max-width: 1200px;
    border-radius: 5px;
    /*background-color: rgba(68, 68, 68, 1.00);*/
    background-color:#666;
    content: "";
}

.bluebar {
    background-color: #003eff;
    background: url("https://storage-asset.msi.com/global/picture/image/feature/CoreLiquid/Mag-coreLiquid/bar-blue-pattern.png")repeat-x;
    /*animation: 2s nvmodelflash ease infinite;*/
}

.count {
    font-family: 'Sarpanch', sans-serif;
    font-weight: 400;
    font-size: 30px;
    text-align: right;
}

.run {
    -webkit-animation-name: run;
    animation-name: run;

}

/*run*/
@-webkit-keyframes run {
    0% {
        width: 0;
        -webkit-box-shadow: #fff 0 0 5px inset;
        box-shadow: #fff 0 0 5px inset;
    }

    50% {
        width: 50%;

        -webkit-box-shadow: #fff 0 0 20px inset;
        box-shadow: #fff 0 0 20px inset;
    }

    100% {
        width: 100%;
        -webkit-box-shadow: #fff 0 0 5px inset;
        box-shadow: #fff 0 0 5px inset;
    }
}