progrecss.css

/*
progre(c)ss.css - http://jh3y.github.io/progre-c-ss
Licensed under the MIT license

Jhey Tompkins (c) 2014.

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/
.progrecss {
  display: block;
  position: relative;
}
.progrecss[data-progrecss]:after,
.progrecss[data-progrecss-mock]:after {
  content: "";
  display: block;
  position: absolute;
  transition: width 1s ease 0s;
  -webkit-transition: width 1s ease 0s;
  background-color: #3498db;
  box-shadow: 0 0 1px #3498db;
  opacity: 0.6;
  height: 4px;
  border-radius: 0;
  top: 0;
}
.progrecss[data-progrecss].bottom:after,
.progrecss[data-progrecss-mock].bottom:after {
  top: 100%;
}
.progrecss[data-progrecss].fixed:after,
.progrecss[data-progrecss-mock].fixed:after {
  position: fixed;
  top: 0;
  left: 0;
}
.progrecss[data-progrecss].fixed.bottom:after,
.progrecss[data-progrecss-mock].fixed.bottom:after {
  position: fixed;
  top: 100%;
}
.progrecss[data-progrecss="0"]:after {
  width: 0%;
}
.progrecss[data-progrecss="1"]:after {
  width: 1%;
}
.progrecss[data-progrecss="2"]:after {
  width: 2%;
}
.progrecss[data-progrecss="3"]:after {
  width: 3%;
}
.progrecss[data-progrecss="4"]:after {
  width: 4%;
}
.progrecss[data-progrecss="5"]:after {
  width: 5%;
}
.progrecss[data-progrecss="6"]:after {
  width: 6%;
}
.progrecss[data-progrecss="7"]:after {
  width: 7%;
}
.progrecss[data-progrecss="8"]:after {
  width: 8%;
}
.progrecss[data-progrecss="9"]:after {
  width: 9%;
}
.progrecss[data-progrecss="10"]:after {
  width: 10%;
}
.progrecss[data-progrecss="11"]:after {
  width: 11%;
}
.progrecss[data-progrecss="12"]:after {
  width: 12%;
}
.progrecss[data-progrecss="13"]:after {
  width: 13%;
}
.progrecss[data-progrecss="14"]:after {
  width: 14%;
}
.progrecss[data-progrecss="15"]:after {
  width: 15%;
}
.progrecss[data-progrecss="16"]:after {
  width: 16%;
}
.progrecss[data-progrecss="17"]:after {
  width: 17%;
}
.progrecss[data-progrecss="18"]:after {
  width: 18%;
}
.progrecss[data-progrecss="19"]:after {
  width: 19%;
}
.progrecss[data-progrecss="20"]:after {
  width: 20%;
}
.progrecss[data-progrecss="21"]:after {
  width: 21%;
}
.progrecss[data-progrecss="22"]:after {
  width: 22%;
}
.progrecss[data-progrecss="23"]:after {
  width: 23%;
}
.progrecss[data-progrecss="24"]:after {
  width: 24%;
}
.progrecss[data-progrecss="25"]:after {
  width: 25%;
}
.progrecss[data-progrecss="26"]:after {
  width: 26%;
}
.progrecss[data-progrecss="27"]:after {
  width: 27%;
}
.progrecss[data-progrecss="28"]:after {
  width: 28%;
}
.progrecss[data-progrecss="29"]:after {
  width: 29%;
}
.progrecss[data-progrecss="30"]:after {
  width: 30%;
}
.progrecss[data-progrecss="31"]:after {
  width: 31%;
}
.progrecss[data-progrecss="32"]:after {
  width: 32%;
}
.progrecss[data-progrecss="33"]:after {
  width: 33%;
}
.progrecss[data-progrecss="34"]:after {
  width: 34%;
}
.progrecss[data-progrecss="35"]:after {
  width: 35%;
}
.progrecss[data-progrecss="36"]:after {
  width: 36%;
}
.progrecss[data-progrecss="37"]:after {
  width: 37%;
}
.progrecss[data-progrecss="38"]:after {
  width: 38%;
}
.progrecss[data-progrecss="39"]:after {
  width: 39%;
}
.progrecss[data-progrecss="40"]:after {
  width: 40%;
}
.progrecss[data-progrecss="41"]:after {
  width: 41%;
}
.progrecss[data-progrecss="42"]:after {
  width: 42%;
}
.progrecss[data-progrecss="43"]:after {
  width: 43%;
}
.progrecss[data-progrecss="44"]:after {
  width: 44%;
}
.progrecss[data-progrecss="45"]:after {
  width: 45%;
}
.progrecss[data-progrecss="46"]:after {
  width: 46%;
}
.progrecss[data-progrecss="47"]:after {
  width: 47%;
}
.progrecss[data-progrecss="48"]:after {
  width: 48%;
}
.progrecss[data-progrecss="49"]:after {
  width: 49%;
}
.progrecss[data-progrecss="50"]:after {
  width: 50%;
}
.progrecss[data-progrecss="51"]:after {
  width: 51%;
}
.progrecss[data-progrecss="52"]:after {
  width: 52%;
}
.progrecss[data-progrecss="53"]:after {
  width: 53%;
}
.progrecss[data-progrecss="54"]:after {
  width: 54%;
}
.progrecss[data-progrecss="55"]:after {
  width: 55%;
}
.progrecss[data-progrecss="56"]:after {
  width: 56%;
}
.progrecss[data-progrecss="57"]:after {
  width: 57%;
}
.progrecss[data-progrecss="58"]:after {
  width: 58%;
}
.progrecss[data-progrecss="59"]:after {
  width: 59%;
}
.progrecss[data-progrecss="60"]:after {
  width: 60%;
}
.progrecss[data-progrecss="61"]:after {
  width: 61%;
}
.progrecss[data-progrecss="62"]:after {
  width: 62%;
}
.progrecss[data-progrecss="63"]:after {
  width: 63%;
}
.progrecss[data-progrecss="64"]:after {
  width: 64%;
}
.progrecss[data-progrecss="65"]:after {
  width: 65%;
}
.progrecss[data-progrecss="66"]:after {
  width: 66%;
}
.progrecss[data-progrecss="67"]:after {
  width: 67%;
}
.progrecss[data-progrecss="68"]:after {
  width: 68%;
}
.progrecss[data-progrecss="69"]:after {
  width: 69%;
}
.progrecss[data-progrecss="70"]:after {
  width: 70%;
}
.progrecss[data-progrecss="71"]:after {
  width: 71%;
}
.progrecss[data-progrecss="72"]:after {
  width: 72%;
}
.progrecss[data-progrecss="73"]:after {
  width: 73%;
}
.progrecss[data-progrecss="74"]:after {
  width: 74%;
}
.progrecss[data-progrecss="75"]:after {
  width: 75%;
}
.progrecss[data-progrecss="76"]:after {
  width: 76%;
}
.progrecss[data-progrecss="77"]:after {
  width: 77%;
}
.progrecss[data-progrecss="78"]:after {
  width: 78%;
}
.progrecss[data-progrecss="79"]:after {
  width: 79%;
}
.progrecss[data-progrecss="80"]:after {
  width: 80%;
}
.progrecss[data-progrecss="81"]:after {
  width: 81%;
}
.progrecss[data-progrecss="82"]:after {
  width: 82%;
}
.progrecss[data-progrecss="83"]:after {
  width: 83%;
}
.progrecss[data-progrecss="84"]:after {
  width: 84%;
}
.progrecss[data-progrecss="85"]:after {
  width: 85%;
}
.progrecss[data-progrecss="86"]:after {
  width: 86%;
}
.progrecss[data-progrecss="87"]:after {
  width: 87%;
}
.progrecss[data-progrecss="88"]:after {
  width: 88%;
}
.progrecss[data-progrecss="89"]:after {
  width: 89%;
}
.progrecss[data-progrecss="90"]:after {
  width: 90%;
}
.progrecss[data-progrecss="91"]:after {
  width: 91%;
}
.progrecss[data-progrecss="92"]:after {
  width: 92%;
}
.progrecss[data-progrecss="93"]:after {
  width: 93%;
}
.progrecss[data-progrecss="94"]:after {
  width: 94%;
}
.progrecss[data-progrecss="95"]:after {
  width: 95%;
}
.progrecss[data-progrecss="96"]:after {
  width: 96%;
}
.progrecss[data-progrecss="97"]:after {
  width: 97%;
}
.progrecss[data-progrecss="98"]:after {
  width: 98%;
}
.progrecss[data-progrecss="99"]:after {
  width: 99%;
}
.progrecss[data-progrecss="100"]:after {
  width: 100%;
}
@keyframes mock {
  0% {
    width: 0%;
  }
  100% {
    width: 100%;
  }
}
@-webkit-keyframes mock {
  0% {
    width: 0%;
  }
  100% {
    width: 100%;
  }
}
@keyframes staggered-mock {
  0% {
    width: 0%;
  }
  10% {
    width: 10%;
  }
  20% {
    width: 10%;
  }
  30% {
    width: 30%;
  }
  40% {
    width: 30%;
  }
  50% {
    width: 30%;
  }
  60% {
    width: 50%;
  }
  70% {
    width: 70%;
  }
  80% {
    width: 70%;
  }
  90% {
    width: 90%;
  }
  100% {
    width: 100%;
  }
}
@-webkit-keyframes staggered-mock {
  0% {
    width: 0%;
  }
  10% {
    width: 10%;
  }
  20% {
    width: 10%;
  }
  30% {
    width: 30%;
  }
  40% {
    width: 30%;
  }
  50% {
    width: 30%;
  }
  60% {
    width: 50%;
  }
  70% {
    width: 70%;
  }
  80% {
    width: 70%;
  }
  90% {
    width: 90%;
  }
  100% {
    width: 100%;
  }
}
.progrecss[data-progrecss-mock="0"].mock:after {
  animation: mock 0s;
  -webkit-animation: mock 0s;
}
.progrecss[data-progrecss-mock="1"].mock:after {
  animation: mock 1s;
  -webkit-animation: mock 1s;
}
.progrecss[data-progrecss-mock="2"].mock:after {
  animation: mock 2s;
  -webkit-animation: mock 2s;
}
.progrecss[data-progrecss-mock="3"].mock:after {
  animation: mock 3s;
  -webkit-animation: mock 3s;
}
.progrecss[data-progrecss-mock="4"].mock:after {
  animation: mock 4s;
  -webkit-animation: mock 4s;
}
.progrecss[data-progrecss-mock="5"].mock:after {
  animation: mock 5s;
  -webkit-animation: mock 5s;
}
.progrecss[data-progrecss-mock="6"].mock:after {
  animation: mock 6s;
  -webkit-animation: mock 6s;
}
.progrecss[data-progrecss-mock="7"].mock:after {
  animation: mock 7s;
  -webkit-animation: mock 7s;
}
.progrecss[data-progrecss-mock="8"].mock:after {
  animation: mock 8s;
  -webkit-animation: mock 8s;
}
.progrecss[data-progrecss-mock="9"].mock:after {
  animation: mock 9s;
  -webkit-animation: mock 9s;
}
.progrecss[data-progrecss-mock="10"].mock:after {
  animation: mock 10s;
  -webkit-animation: mock 10s;
}
.progrecss[data-progrecss-mock="11"].mock:after {
  animation: mock 11s;
  -webkit-animation: mock 11s;
}
.progrecss[data-progrecss-mock="12"].mock:after {
  animation: mock 12s;
  -webkit-animation: mock 12s;
}
.progrecss[data-progrecss-mock="13"].mock:after {
  animation: mock 13s;
  -webkit-animation: mock 13s;
}
.progrecss[data-progrecss-mock="14"].mock:after {
  animation: mock 14s;
  -webkit-animation: mock 14s;
}
.progrecss[data-progrecss-mock="15"].mock:after {
  animation: mock 15s;
  -webkit-animation: mock 15s;
}
.progrecss[data-progrecss-mock="16"].mock:after {
  animation: mock 16s;
  -webkit-animation: mock 16s;
}
.progrecss[data-progrecss-mock="17"].mock:after {
  animation: mock 17s;
  -webkit-animation: mock 17s;
}
.progrecss[data-progrecss-mock="18"].mock:after {
  animation: mock 18s;
  -webkit-animation: mock 18s;
}
.progrecss[data-progrecss-mock="19"].mock:after {
  animation: mock 19s;
  -webkit-animation: mock 19s;
}
.progrecss[data-progrecss-mock="20"].mock:after {
  animation: mock 20s;
  -webkit-animation: mock 20s;
}
.progrecss[data-progrecss-mock="21"].mock:after {
  animation: mock 21s;
  -webkit-animation: mock 21s;
}
.progrecss[data-progrecss-mock="22"].mock:after {
  animation: mock 22s;
  -webkit-animation: mock 22s;
}
.progrecss[data-progrecss-mock="23"].mock:after {
  animation: mock 23s;
  -webkit-animation: mock 23s;
}
.progrecss[data-progrecss-mock="24"].mock:after {
  animation: mock 24s;
  -webkit-animation: mock 24s;
}
.progrecss[data-progrecss-mock="25"].mock:after {
  animation: mock 25s;
  -webkit-animation: mock 25s;
}
.progrecss[data-progrecss-mock="26"].mock:after {
  animation: mock 26s;
  -webkit-animation: mock 26s;
}
.progrecss[data-progrecss-mock="27"].mock:after {
  animation: mock 27s;
  -webkit-animation: mock 27s;
}
.progrecss[data-progrecss-mock="28"].mock:after {
  animation: mock 28s;
  -webkit-animation: mock 28s;
}
.progrecss[data-progrecss-mock="29"].mock:after {
  animation: mock 29s;
  -webkit-animation: mock 29s;
}
.progrecss[data-progrecss-mock="30"].mock:after {
  animation: mock 30s;
  -webkit-animation: mock 30s;
}
.progrecss[data-progrecss-mock="31"].mock:after {
  animation: mock 31s;
  -webkit-animation: mock 31s;
}
.progrecss[data-progrecss-mock="32"].mock:after {
  animation: mock 32s;
  -webkit-animation: mock 32s;
}
.progrecss[data-progrecss-mock="33"].mock:after {
  animation: mock 33s;
  -webkit-animation: mock 33s;
}
.progrecss[data-progrecss-mock="34"].mock:after {
  animation: mock 34s;
  -webkit-animation: mock 34s;
}
.progrecss[data-progrecss-mock="35"].mock:after {
  animation: mock 35s;
  -webkit-animation: mock 35s;
}
.progrecss[data-progrecss-mock="36"].mock:after {
  animation: mock 36s;
  -webkit-animation: mock 36s;
}
.progrecss[data-progrecss-mock="37"].mock:after {
  animation: mock 37s;
  -webkit-animation: mock 37s;
}
.progrecss[data-progrecss-mock="38"].mock:after {
  animation: mock 38s;
  -webkit-animation: mock 38s;
}
.progrecss[data-progrecss-mock="39"].mock:after {
  animation: mock 39s;
  -webkit-animation: mock 39s;
}
.progrecss[data-progrecss-mock="40"].mock:after {
  animation: mock 40s;
  -webkit-animation: mock 40s;
}
.progrecss[data-progrecss-mock="41"].mock:after {
  animation: mock 41s;
  -webkit-animation: mock 41s;
}
.progrecss[data-progrecss-mock="42"].mock:after {
  animation: mock 42s;
  -webkit-animation: mock 42s;
}
.progrecss[data-progrecss-mock="43"].mock:after {
  animation: mock 43s;
  -webkit-animation: mock 43s;
}
.progrecss[data-progrecss-mock="44"].mock:after {
  animation: mock 44s;
  -webkit-animation: mock 44s;
}
.progrecss[data-progrecss-mock="45"].mock:after {
  animation: mock 45s;
  -webkit-animation: mock 45s;
}
.progrecss[data-progrecss-mock="46"].mock:after {
  animation: mock 46s;
  -webkit-animation: mock 46s;
}
.progrecss[data-progrecss-mock="47"].mock:after {
  animation: mock 47s;
  -webkit-animation: mock 47s;
}
.progrecss[data-progrecss-mock="48"].mock:after {
  animation: mock 48s;
  -webkit-animation: mock 48s;
}
.progrecss[data-progrecss-mock="49"].mock:after {
  animation: mock 49s;
  -webkit-animation: mock 49s;
}
.progrecss[data-progrecss-mock="50"].mock:after {
  animation: mock 50s;
  -webkit-animation: mock 50s;
}
.progrecss[data-progrecss-mock="51"].mock:after {
  animation: mock 51s;
  -webkit-animation: mock 51s;
}
.progrecss[data-progrecss-mock="52"].mock:after {
  animation: mock 52s;
  -webkit-animation: mock 52s;
}
.progrecss[data-progrecss-mock="53"].mock:after {
  animation: mock 53s;
  -webkit-animation: mock 53s;
}
.progrecss[data-progrecss-mock="54"].mock:after {
  animation: mock 54s;
  -webkit-animation: mock 54s;
}
.progrecss[data-progrecss-mock="55"].mock:after {
  animation: mock 55s;
  -webkit-animation: mock 55s;
}
.progrecss[data-progrecss-mock="56"].mock:after {
  animation: mock 56s;
  -webkit-animation: mock 56s;
}
.progrecss[data-progrecss-mock="57"].mock:after {
  animation: mock 57s;
  -webkit-animation: mock 57s;
}
.progrecss[data-progrecss-mock="58"].mock:after {
  animation: mock 58s;
  -webkit-animation: mock 58s;
}
.progrecss[data-progrecss-mock="59"].mock:after {
  animation: mock 59s;
  -webkit-animation: mock 59s;
}
.progrecss[data-progrecss-mock="60"].mock:after {
  animation: mock 60s;
  -webkit-animation: mock 60s;
}
.progrecss[data-progrecss-mock="61"].mock:after {
  animation: mock 61s;
  -webkit-animation: mock 61s;
}
.progrecss[data-progrecss-mock="62"].mock:after {
  animation: mock 62s;
  -webkit-animation: mock 62s;
}
.progrecss[data-progrecss-mock="63"].mock:after {
  animation: mock 63s;
  -webkit-animation: mock 63s;
}
.progrecss[data-progrecss-mock="64"].mock:after {
  animation: mock 64s;
  -webkit-animation: mock 64s;
}
.progrecss[data-progrecss-mock="65"].mock:after {
  animation: mock 65s;
  -webkit-animation: mock 65s;
}
.progrecss[data-progrecss-mock="66"].mock:after {
  animation: mock 66s;
  -webkit-animation: mock 66s;
}
.progrecss[data-progrecss-mock="67"].mock:after {
  animation: mock 67s;
  -webkit-animation: mock 67s;
}
.progrecss[data-progrecss-mock="68"].mock:after {
  animation: mock 68s;
  -webkit-animation: mock 68s;
}
.progrecss[data-progrecss-mock="69"].mock:after {
  animation: mock 69s;
  -webkit-animation: mock 69s;
}
.progrecss[data-progrecss-mock="70"].mock:after {
  animation: mock 70s;
  -webkit-animation: mock 70s;
}
.progrecss[data-progrecss-mock="71"].mock:after {
  animation: mock 71s;
  -webkit-animation: mock 71s;
}
.progrecss[data-progrecss-mock="72"].mock:after {
  animation: mock 72s;
  -webkit-animation: mock 72s;
}
.progrecss[data-progrecss-mock="73"].mock:after {
  animation: mock 73s;
  -webkit-animation: mock 73s;
}
.progrecss[data-progrecss-mock="74"].mock:after {
  animation: mock 74s;
  -webkit-animation: mock 74s;
}
.progrecss[data-progrecss-mock="75"].mock:after {
  animation: mock 75s;
  -webkit-animation: mock 75s;
}
.progrecss[data-progrecss-mock="76"].mock:after {
  animation: mock 76s;
  -webkit-animation: mock 76s;
}
.progrecss[data-progrecss-mock="77"].mock:after {
  animation: mock 77s;
  -webkit-animation: mock 77s;
}
.progrecss[data-progrecss-mock="78"].mock:after {
  animation: mock 78s;
  -webkit-animation: mock 78s;
}
.progrecss[data-progrecss-mock="79"].mock:after {
  animation: mock 79s;
  -webkit-animation: mock 79s;
}
.progrecss[data-progrecss-mock="80"].mock:after {
  animation: mock 80s;
  -webkit-animation: mock 80s;
}
.progrecss[data-progrecss-mock="81"].mock:after {
  animation: mock 81s;
  -webkit-animation: mock 81s;
}
.progrecss[data-progrecss-mock="82"].mock:after {
  animation: mock 82s;
  -webkit-animation: mock 82s;
}
.progrecss[data-progrecss-mock="83"].mock:after {
  animation: mock 83s;
  -webkit-animation: mock 83s;
}
.progrecss[data-progrecss-mock="84"].mock:after {
  animation: mock 84s;
  -webkit-animation: mock 84s;
}
.progrecss[data-progrecss-mock="85"].mock:after {
  animation: mock 85s;
  -webkit-animation: mock 85s;
}
.progrecss[data-progrecss-mock="86"].mock:after {
  animation: mock 86s;
  -webkit-animation: mock 86s;
}
.progrecss[data-progrecss-mock="87"].mock:after {
  animation: mock 87s;
  -webkit-animation: mock 87s;
}
.progrecss[data-progrecss-mock="88"].mock:after {
  animation: mock 88s;
  -webkit-animation: mock 88s;
}
.progrecss[data-progrecss-mock="89"].mock:after {
  animation: mock 89s;
  -webkit-animation: mock 89s;
}
.progrecss[data-progrecss-mock="90"].mock:after {
  animation: mock 90s;
  -webkit-animation: mock 90s;
}
.progrecss[data-progrecss-mock="91"].mock:after {
  animation: mock 91s;
  -webkit-animation: mock 91s;
}
.progrecss[data-progrecss-mock="92"].mock:after {
  animation: mock 92s;
  -webkit-animation: mock 92s;
}
.progrecss[data-progrecss-mock="93"].mock:after {
  animation: mock 93s;
  -webkit-animation: mock 93s;
}
.progrecss[data-progrecss-mock="94"].mock:after {
  animation: mock 94s;
  -webkit-animation: mock 94s;
}
.progrecss[data-progrecss-mock="95"].mock:after {
  animation: mock 95s;
  -webkit-animation: mock 95s;
}
.progrecss[data-progrecss-mock="96"].mock:after {
  animation: mock 96s;
  -webkit-animation: mock 96s;
}
.progrecss[data-progrecss-mock="97"].mock:after {
  animation: mock 97s;
  -webkit-animation: mock 97s;
}
.progrecss[data-progrecss-mock="98"].mock:after {
  animation: mock 98s;
  -webkit-animation: mock 98s;
}
.progrecss[data-progrecss-mock="99"].mock:after {
  animation: mock 99s;
  -webkit-animation: mock 99s;
}
.progrecss[data-progrecss-mock="100"].mock:after {
  animation: mock 100s;
  -webkit-animation: mock 100s;
}
.progrecss[data-progrecss-mock="101"].mock:after {
  animation: mock 101s;
  -webkit-animation: mock 101s;
}
.progrecss[data-progrecss-mock="102"].mock:after {
  animation: mock 102s;
  -webkit-animation: mock 102s;
}
.progrecss[data-progrecss-mock="103"].mock:after {
  animation: mock 103s;
  -webkit-animation: mock 103s;
}
.progrecss[data-progrecss-mock="104"].mock:after {
  animation: mock 104s;
  -webkit-animation: mock 104s;
}
.progrecss[data-progrecss-mock="105"].mock:after {
  animation: mock 105s;
  -webkit-animation: mock 105s;
}
.progrecss[data-progrecss-mock="106"].mock:after {
  animation: mock 106s;
  -webkit-animation: mock 106s;
}
.progrecss[data-progrecss-mock="107"].mock:after {
  animation: mock 107s;
  -webkit-animation: mock 107s;
}
.progrecss[data-progrecss-mock="108"].mock:after {
  animation: mock 108s;
  -webkit-animation: mock 108s;
}
.progrecss[data-progrecss-mock="109"].mock:after {
  animation: mock 109s;
  -webkit-animation: mock 109s;
}
.progrecss[data-progrecss-mock="110"].mock:after {
  animation: mock 110s;
  -webkit-animation: mock 110s;
}
.progrecss[data-progrecss-mock="111"].mock:after {
  animation: mock 111s;
  -webkit-animation: mock 111s;
}
.progrecss[data-progrecss-mock="112"].mock:after {
  animation: mock 112s;
  -webkit-animation: mock 112s;
}
.progrecss[data-progrecss-mock="113"].mock:after {
  animation: mock 113s;
  -webkit-animation: mock 113s;
}
.progrecss[data-progrecss-mock="114"].mock:after {
  animation: mock 114s;
  -webkit-animation: mock 114s;
}
.progrecss[data-progrecss-mock="115"].mock:after {
  animation: mock 115s;
  -webkit-animation: mock 115s;
}
.progrecss[data-progrecss-mock="116"].mock:after {
  animation: mock 116s;
  -webkit-animation: mock 116s;
}
.progrecss[data-progrecss-mock="117"].mock:after {
  animation: mock 117s;
  -webkit-animation: mock 117s;
}
.progrecss[data-progrecss-mock="118"].mock:after {
  animation: mock 118s;
  -webkit-animation: mock 118s;
}
.progrecss[data-progrecss-mock="119"].mock:after {
  animation: mock 119s;
  -webkit-animation: mock 119s;
}
.progrecss[data-progrecss-mock="120"].mock:after {
  animation: mock 120s;
  -webkit-animation: mock 120s;
}
.progrecss[data-progrecss-mock="0"].staggered.mock:after {
  animation: staggered-mock 0s;
  -webkit-animation: staggered-mock 0s;
}
.progrecss[data-progrecss-mock="1"].staggered.mock:after {
  animation: staggered-mock 1s;
  -webkit-animation: staggered-mock 1s;
}
.progrecss[data-progrecss-mock="2"].staggered.mock:after {
  animation: staggered-mock 2s;
  -webkit-animation: staggered-mock 2s;
}
.progrecss[data-progrecss-mock="3"].staggered.mock:after {
  animation: staggered-mock 3s;
  -webkit-animation: staggered-mock 3s;
}
.progrecss[data-progrecss-mock="4"].staggered.mock:after {
  animation: staggered-mock 4s;
  -webkit-animation: staggered-mock 4s;
}
.progrecss[data-progrecss-mock="5"].staggered.mock:after {
  animation: staggered-mock 5s;
  -webkit-animation: staggered-mock 5s;
}
.progrecss[data-progrecss-mock="6"].staggered.mock:after {
  animation: staggered-mock 6s;
  -webkit-animation: staggered-mock 6s;
}
.progrecss[data-progrecss-mock="7"].staggered.mock:after {
  animation: staggered-mock 7s;
  -webkit-animation: staggered-mock 7s;
}
.progrecss[data-progrecss-mock="8"].staggered.mock:after {
  animation: staggered-mock 8s;
  -webkit-animation: staggered-mock 8s;
}
.progrecss[data-progrecss-mock="9"].staggered.mock:after {
  animation: staggered-mock 9s;
  -webkit-animation: staggered-mock 9s;
}
.progrecss[data-progrecss-mock="10"].staggered.mock:after {
  animation: staggered-mock 10s;
  -webkit-animation: staggered-mock 10s;
}
.progrecss[data-progrecss-mock="11"].staggered.mock:after {
  animation: staggered-mock 11s;
  -webkit-animation: staggered-mock 11s;
}
.progrecss[data-progrecss-mock="12"].staggered.mock:after {
  animation: staggered-mock 12s;
  -webkit-animation: staggered-mock 12s;
}
.progrecss[data-progrecss-mock="13"].staggered.mock:after {
  animation: staggered-mock 13s;
  -webkit-animation: staggered-mock 13s;
}
.progrecss[data-progrecss-mock="14"].staggered.mock:after {
  animation: staggered-mock 14s;
  -webkit-animation: staggered-mock 14s;
}
.progrecss[data-progrecss-mock="15"].staggered.mock:after {
  animation: staggered-mock 15s;
  -webkit-animation: staggered-mock 15s;
}
.progrecss[data-progrecss-mock="16"].staggered.mock:after {
  animation: staggered-mock 16s;
  -webkit-animation: staggered-mock 16s;
}
.progrecss[data-progrecss-mock="17"].staggered.mock:after {
  animation: staggered-mock 17s;
  -webkit-animation: staggered-mock 17s;
}
.progrecss[data-progrecss-mock="18"].staggered.mock:after {
  animation: staggered-mock 18s;
  -webkit-animation: staggered-mock 18s;
}
.progrecss[data-progrecss-mock="19"].staggered.mock:after {
  animation: staggered-mock 19s;
  -webkit-animation: staggered-mock 19s;
}
.progrecss[data-progrecss-mock="20"].staggered.mock:after {
  animation: staggered-mock 20s;
  -webkit-animation: staggered-mock 20s;
}
.progrecss[data-progrecss-mock="21"].staggered.mock:after {
  animation: staggered-mock 21s;
  -webkit-animation: staggered-mock 21s;
}
.progrecss[data-progrecss-mock="22"].staggered.mock:after {
  animation: staggered-mock 22s;
  -webkit-animation: staggered-mock 22s;
}
.progrecss[data-progrecss-mock="23"].staggered.mock:after {
  animation: staggered-mock 23s;
  -webkit-animation: staggered-mock 23s;
}
.progrecss[data-progrecss-mock="24"].staggered.mock:after {
  animation: staggered-mock 24s;
  -webkit-animation: staggered-mock 24s;
}
.progrecss[data-progrecss-mock="25"].staggered.mock:after {
  animation: staggered-mock 25s;
  -webkit-animation: staggered-mock 25s;
}
.progrecss[data-progrecss-mock="26"].staggered.mock:after {
  animation: staggered-mock 26s;
  -webkit-animation: staggered-mock 26s;
}
.progrecss[data-progrecss-mock="27"].staggered.mock:after {
  animation: staggered-mock 27s;
  -webkit-animation: staggered-mock 27s;
}
.progrecss[data-progrecss-mock="28"].staggered.mock:after {
  animation: staggered-mock 28s;
  -webkit-animation: staggered-mock 28s;
}
.progrecss[data-progrecss-mock="29"].staggered.mock:after {
  animation: staggered-mock 29s;
  -webkit-animation: staggered-mock 29s;
}
.progrecss[data-progrecss-mock="30"].staggered.mock:after {
  animation: staggered-mock 30s;
  -webkit-animation: staggered-mock 30s;
}
.progrecss[data-progrecss-mock="31"].staggered.mock:after {
  animation: staggered-mock 31s;
  -webkit-animation: staggered-mock 31s;
}
.progrecss[data-progrecss-mock="32"].staggered.mock:after {
  animation: staggered-mock 32s;
  -webkit-animation: staggered-mock 32s;
}
.progrecss[data-progrecss-mock="33"].staggered.mock:after {
  animation: staggered-mock 33s;
  -webkit-animation: staggered-mock 33s;
}
.progrecss[data-progrecss-mock="34"].staggered.mock:after {
  animation: staggered-mock 34s;
  -webkit-animation: staggered-mock 34s;
}
.progrecss[data-progrecss-mock="35"].staggered.mock:after {
  animation: staggered-mock 35s;
  -webkit-animation: staggered-mock 35s;
}
.progrecss[data-progrecss-mock="36"].staggered.mock:after {
  animation: staggered-mock 36s;
  -webkit-animation: staggered-mock 36s;
}
.progrecss[data-progrecss-mock="37"].staggered.mock:after {
  animation: staggered-mock 37s;
  -webkit-animation: staggered-mock 37s;
}
.progrecss[data-progrecss-mock="38"].staggered.mock:after {
  animation: staggered-mock 38s;
  -webkit-animation: staggered-mock 38s;
}
.progrecss[data-progrecss-mock="39"].staggered.mock:after {
  animation: staggered-mock 39s;
  -webkit-animation: staggered-mock 39s;
}
.progrecss[data-progrecss-mock="40"].staggered.mock:after {
  animation: staggered-mock 40s;
  -webkit-animation: staggered-mock 40s;
}
.progrecss[data-progrecss-mock="41"].staggered.mock:after {
  animation: staggered-mock 41s;
  -webkit-animation: staggered-mock 41s;
}
.progrecss[data-progrecss-mock="42"].staggered.mock:after {
  animation: staggered-mock 42s;
  -webkit-animation: staggered-mock 42s;
}
.progrecss[data-progrecss-mock="43"].staggered.mock:after {
  animation: staggered-mock 43s;
  -webkit-animation: staggered-mock 43s;
}
.progrecss[data-progrecss-mock="44"].staggered.mock:after {
  animation: staggered-mock 44s;
  -webkit-animation: staggered-mock 44s;
}
.progrecss[data-progrecss-mock="45"].staggered.mock:after {
  animation: staggered-mock 45s;
  -webkit-animation: staggered-mock 45s;
}
.progrecss[data-progrecss-mock="46"].staggered.mock:after {
  animation: staggered-mock 46s;
  -webkit-animation: staggered-mock 46s;
}
.progrecss[data-progrecss-mock="47"].staggered.mock:after {
  animation: staggered-mock 47s;
  -webkit-animation: staggered-mock 47s;
}
.progrecss[data-progrecss-mock="48"].staggered.mock:after {
  animation: staggered-mock 48s;
  -webkit-animation: staggered-mock 48s;
}
.progrecss[data-progrecss-mock="49"].staggered.mock:after {
  animation: staggered-mock 49s;
  -webkit-animation: staggered-mock 49s;
}
.progrecss[data-progrecss-mock="50"].staggered.mock:after {
  animation: staggered-mock 50s;
  -webkit-animation: staggered-mock 50s;
}
.progrecss[data-progrecss-mock="51"].staggered.mock:after {
  animation: staggered-mock 51s;
  -webkit-animation: staggered-mock 51s;
}
.progrecss[data-progrecss-mock="52"].staggered.mock:after {
  animation: staggered-mock 52s;
  -webkit-animation: staggered-mock 52s;
}
.progrecss[data-progrecss-mock="53"].staggered.mock:after {
  animation: staggered-mock 53s;
  -webkit-animation: staggered-mock 53s;
}
.progrecss[data-progrecss-mock="54"].staggered.mock:after {
  animation: staggered-mock 54s;
  -webkit-animation: staggered-mock 54s;
}
.progrecss[data-progrecss-mock="55"].staggered.mock:after {
  animation: staggered-mock 55s;
  -webkit-animation: staggered-mock 55s;
}
.progrecss[data-progrecss-mock="56"].staggered.mock:after {
  animation: staggered-mock 56s;
  -webkit-animation: staggered-mock 56s;
}
.progrecss[data-progrecss-mock="57"].staggered.mock:after {
  animation: staggered-mock 57s;
  -webkit-animation: staggered-mock 57s;
}
.progrecss[data-progrecss-mock="58"].staggered.mock:after {
  animation: staggered-mock 58s;
  -webkit-animation: staggered-mock 58s;
}
.progrecss[data-progrecss-mock="59"].staggered.mock:after {
  animation: staggered-mock 59s;
  -webkit-animation: staggered-mock 59s;
}
.progrecss[data-progrecss-mock="60"].staggered.mock:after {
  animation: staggered-mock 60s;
  -webkit-animation: staggered-mock 60s;
}
.progrecss[data-progrecss-mock="61"].staggered.mock:after {
  animation: staggered-mock 61s;
  -webkit-animation: staggered-mock 61s;
}
.progrecss[data-progrecss-mock="62"].staggered.mock:after {
  animation: staggered-mock 62s;
  -webkit-animation: staggered-mock 62s;
}
.progrecss[data-progrecss-mock="63"].staggered.mock:after {
  animation: staggered-mock 63s;
  -webkit-animation: staggered-mock 63s;
}
.progrecss[data-progrecss-mock="64"].staggered.mock:after {
  animation: staggered-mock 64s;
  -webkit-animation: staggered-mock 64s;
}
.progrecss[data-progrecss-mock="65"].staggered.mock:after {
  animation: staggered-mock 65s;
  -webkit-animation: staggered-mock 65s;
}
.progrecss[data-progrecss-mock="66"].staggered.mock:after {
  animation: staggered-mock 66s;
  -webkit-animation: staggered-mock 66s;
}
.progrecss[data-progrecss-mock="67"].staggered.mock:after {
  animation: staggered-mock 67s;
  -webkit-animation: staggered-mock 67s;
}
.progrecss[data-progrecss-mock="68"].staggered.mock:after {
  animation: staggered-mock 68s;
  -webkit-animation: staggered-mock 68s;
}
.progrecss[data-progrecss-mock="69"].staggered.mock:after {
  animation: staggered-mock 69s;
  -webkit-animation: staggered-mock 69s;
}
.progrecss[data-progrecss-mock="70"].staggered.mock:after {
  animation: staggered-mock 70s;
  -webkit-animation: staggered-mock 70s;
}
.progrecss[data-progrecss-mock="71"].staggered.mock:after {
  animation: staggered-mock 71s;
  -webkit-animation: staggered-mock 71s;
}
.progrecss[data-progrecss-mock="72"].staggered.mock:after {
  animation: staggered-mock 72s;
  -webkit-animation: staggered-mock 72s;
}
.progrecss[data-progrecss-mock="73"].staggered.mock:after {
  animation: staggered-mock 73s;
  -webkit-animation: staggered-mock 73s;
}
.progrecss[data-progrecss-mock="74"].staggered.mock:after {
  animation: staggered-mock 74s;
  -webkit-animation: staggered-mock 74s;
}
.progrecss[data-progrecss-mock="75"].staggered.mock:after {
  animation: staggered-mock 75s;
  -webkit-animation: staggered-mock 75s;
}
.progrecss[data-progrecss-mock="76"].staggered.mock:after {
  animation: staggered-mock 76s;
  -webkit-animation: staggered-mock 76s;
}
.progrecss[data-progrecss-mock="77"].staggered.mock:after {
  animation: staggered-mock 77s;
  -webkit-animation: staggered-mock 77s;
}
.progrecss[data-progrecss-mock="78"].staggered.mock:after {
  animation: staggered-mock 78s;
  -webkit-animation: staggered-mock 78s;
}
.progrecss[data-progrecss-mock="79"].staggered.mock:after {
  animation: staggered-mock 79s;
  -webkit-animation: staggered-mock 79s;
}
.progrecss[data-progrecss-mock="80"].staggered.mock:after {
  animation: staggered-mock 80s;
  -webkit-animation: staggered-mock 80s;
}
.progrecss[data-progrecss-mock="81"].staggered.mock:after {
  animation: staggered-mock 81s;
  -webkit-animation: staggered-mock 81s;
}
.progrecss[data-progrecss-mock="82"].staggered.mock:after {
  animation: staggered-mock 82s;
  -webkit-animation: staggered-mock 82s;
}
.progrecss[data-progrecss-mock="83"].staggered.mock:after {
  animation: staggered-mock 83s;
  -webkit-animation: staggered-mock 83s;
}
.progrecss[data-progrecss-mock="84"].staggered.mock:after {
  animation: staggered-mock 84s;
  -webkit-animation: staggered-mock 84s;
}
.progrecss[data-progrecss-mock="85"].staggered.mock:after {
  animation: staggered-mock 85s;
  -webkit-animation: staggered-mock 85s;
}
.progrecss[data-progrecss-mock="86"].staggered.mock:after {
  animation: staggered-mock 86s;
  -webkit-animation: staggered-mock 86s;
}
.progrecss[data-progrecss-mock="87"].staggered.mock:after {
  animation: staggered-mock 87s;
  -webkit-animation: staggered-mock 87s;
}
.progrecss[data-progrecss-mock="88"].staggered.mock:after {
  animation: staggered-mock 88s;
  -webkit-animation: staggered-mock 88s;
}
.progrecss[data-progrecss-mock="89"].staggered.mock:after {
  animation: staggered-mock 89s;
  -webkit-animation: staggered-mock 89s;
}
.progrecss[data-progrecss-mock="90"].staggered.mock:after {
  animation: staggered-mock 90s;
  -webkit-animation: staggered-mock 90s;
}
.progrecss[data-progrecss-mock="91"].staggered.mock:after {
  animation: staggered-mock 91s;
  -webkit-animation: staggered-mock 91s;
}
.progrecss[data-progrecss-mock="92"].staggered.mock:after {
  animation: staggered-mock 92s;
  -webkit-animation: staggered-mock 92s;
}
.progrecss[data-progrecss-mock="93"].staggered.mock:after {
  animation: staggered-mock 93s;
  -webkit-animation: staggered-mock 93s;
}
.progrecss[data-progrecss-mock="94"].staggered.mock:after {
  animation: staggered-mock 94s;
  -webkit-animation: staggered-mock 94s;
}
.progrecss[data-progrecss-mock="95"].staggered.mock:after {
  animation: staggered-mock 95s;
  -webkit-animation: staggered-mock 95s;
}
.progrecss[data-progrecss-mock="96"].staggered.mock:after {
  animation: staggered-mock 96s;
  -webkit-animation: staggered-mock 96s;
}
.progrecss[data-progrecss-mock="97"].staggered.mock:after {
  animation: staggered-mock 97s;
  -webkit-animation: staggered-mock 97s;
}
.progrecss[data-progrecss-mock="98"].staggered.mock:after {
  animation: staggered-mock 98s;
  -webkit-animation: staggered-mock 98s;
}
.progrecss[data-progrecss-mock="99"].staggered.mock:after {
  animation: staggered-mock 99s;
  -webkit-animation: staggered-mock 99s;
}
.progrecss[data-progrecss-mock="100"].staggered.mock:after {
  animation: staggered-mock 100s;
  -webkit-animation: staggered-mock 100s;
}
.progrecss[data-progrecss-mock="101"].staggered.mock:after {
  animation: staggered-mock 101s;
  -webkit-animation: staggered-mock 101s;
}
.progrecss[data-progrecss-mock="102"].staggered.mock:after {
  animation: staggered-mock 102s;
  -webkit-animation: staggered-mock 102s;
}
.progrecss[data-progrecss-mock="103"].staggered.mock:after {
  animation: staggered-mock 103s;
  -webkit-animation: staggered-mock 103s;
}
.progrecss[data-progrecss-mock="104"].staggered.mock:after {
  animation: staggered-mock 104s;
  -webkit-animation: staggered-mock 104s;
}
.progrecss[data-progrecss-mock="105"].staggered.mock:after {
  animation: staggered-mock 105s;
  -webkit-animation: staggered-mock 105s;
}
.progrecss[data-progrecss-mock="106"].staggered.mock:after {
  animation: staggered-mock 106s;
  -webkit-animation: staggered-mock 106s;
}
.progrecss[data-progrecss-mock="107"].staggered.mock:after {
  animation: staggered-mock 107s;
  -webkit-animation: staggered-mock 107s;
}
.progrecss[data-progrecss-mock="108"].staggered.mock:after {
  animation: staggered-mock 108s;
  -webkit-animation: staggered-mock 108s;
}
.progrecss[data-progrecss-mock="109"].staggered.mock:after {
  animation: staggered-mock 109s;
  -webkit-animation: staggered-mock 109s;
}
.progrecss[data-progrecss-mock="110"].staggered.mock:after {
  animation: staggered-mock 110s;
  -webkit-animation: staggered-mock 110s;
}
.progrecss[data-progrecss-mock="111"].staggered.mock:after {
  animation: staggered-mock 111s;
  -webkit-animation: staggered-mock 111s;
}
.progrecss[data-progrecss-mock="112"].staggered.mock:after {
  animation: staggered-mock 112s;
  -webkit-animation: staggered-mock 112s;
}
.progrecss[data-progrecss-mock="113"].staggered.mock:after {
  animation: staggered-mock 113s;
  -webkit-animation: staggered-mock 113s;
}
.progrecss[data-progrecss-mock="114"].staggered.mock:after {
  animation: staggered-mock 114s;
  -webkit-animation: staggered-mock 114s;
}
.progrecss[data-progrecss-mock="115"].staggered.mock:after {
  animation: staggered-mock 115s;
  -webkit-animation: staggered-mock 115s;
}
.progrecss[data-progrecss-mock="116"].staggered.mock:after {
  animation: staggered-mock 116s;
  -webkit-animation: staggered-mock 116s;
}
.progrecss[data-progrecss-mock="117"].staggered.mock:after {
  animation: staggered-mock 117s;
  -webkit-animation: staggered-mock 117s;
}
.progrecss[data-progrecss-mock="118"].staggered.mock:after {
  animation: staggered-mock 118s;
  -webkit-animation: staggered-mock 118s;
}
.progrecss[data-progrecss-mock="119"].staggered.mock:after {
  animation: staggered-mock 119s;
  -webkit-animation: staggered-mock 119s;
}
.progrecss[data-progrecss-mock="120"].staggered.mock:after {
  animation: staggered-mock 120s;
  -webkit-animation: staggered-mock 120s;
}
.progrecss[data-progrecss].green:after {
  background-color: #2ecc71;
}
.progrecss[data-progrecss].blue:after {
  background-color: #3498db;
}
.progrecss[data-progrecss].purple:after {
  background-color: #9b59b6;
}
.progrecss[data-progrecss].yellow:after {
  background-color: #f1c40f;
}
.progrecss[data-progrecss].orange:after {
  background-color: #e67e22;
}
.progrecss[data-progrecss].red:after {
  background-color: #e74c3c;
}