Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/rightscale-design/designkit-percentage-bars

A Sass module for percentage bars used in RightScale apps.
https://github.com/rightscale-design/designkit-percentage-bars

Last synced: 10 days ago
JSON representation

A Sass module for percentage bars used in RightScale apps.

Awesome Lists containing this project

README

        

# designkit-percentage-bars
1.0.0

A Sass module for percentage bars used in RightScale apps.

## Install
```
npm i --save designkit-percentage-bars
```

## CSS

```css
.percentage_bar {
position: relative;
height: 4px;
margin-top: 10px;
background: #eaeaea;
border-radius: 10px;
}

.percentage_bar .percentage_metric {
position: absolute;
height: 100%;
top: 0;
left: 0;
background: #0A83F6;
border-radius: 10px 0 0 10px;
}

.percentage_bar .percentage_metric.percentage_bar_100, .percentage_bar .percentage_metric.percentage_bar_animation_100 {
border-radius: 10px;
}

.percentage_bar_0 {
width: 0%;
}

.percentage_bar_1 {
width: 1%;
}

.percentage_bar_2 {
width: 2%;
}

.percentage_bar_3 {
width: 3%;
}

.percentage_bar_4 {
width: 4%;
}

.percentage_bar_5 {
width: 5%;
}

.percentage_bar_6 {
width: 6%;
}

.percentage_bar_7 {
width: 7%;
}

.percentage_bar_8 {
width: 8%;
}

.percentage_bar_9 {
width: 9%;
}

.percentage_bar_10 {
width: 10%;
}

.percentage_bar_11 {
width: 11%;
}

.percentage_bar_12 {
width: 12%;
}

.percentage_bar_13 {
width: 13%;
}

.percentage_bar_14 {
width: 14%;
}

.percentage_bar_15 {
width: 15%;
}

.percentage_bar_16 {
width: 16%;
}

.percentage_bar_17 {
width: 17%;
}

.percentage_bar_18 {
width: 18%;
}

.percentage_bar_19 {
width: 19%;
}

.percentage_bar_20 {
width: 20%;
}

.percentage_bar_21 {
width: 21%;
}

.percentage_bar_22 {
width: 22%;
}

.percentage_bar_23 {
width: 23%;
}

.percentage_bar_24 {
width: 24%;
}

.percentage_bar_25 {
width: 25%;
}

.percentage_bar_26 {
width: 26%;
}

.percentage_bar_27 {
width: 27%;
}

.percentage_bar_28 {
width: 28%;
}

.percentage_bar_29 {
width: 29%;
}

.percentage_bar_30 {
width: 30%;
}

.percentage_bar_31 {
width: 31%;
}

.percentage_bar_32 {
width: 32%;
}

.percentage_bar_33 {
width: 33%;
}

.percentage_bar_34 {
width: 34%;
}

.percentage_bar_35 {
width: 35%;
}

.percentage_bar_36 {
width: 36%;
}

.percentage_bar_37 {
width: 37%;
}

.percentage_bar_38 {
width: 38%;
}

.percentage_bar_39 {
width: 39%;
}

.percentage_bar_40 {
width: 40%;
}

.percentage_bar_41 {
width: 41%;
}

.percentage_bar_42 {
width: 42%;
}

.percentage_bar_43 {
width: 43%;
}

.percentage_bar_44 {
width: 44%;
}

.percentage_bar_45 {
width: 45%;
}

.percentage_bar_46 {
width: 46%;
}

.percentage_bar_47 {
width: 47%;
}

.percentage_bar_48 {
width: 48%;
}

.percentage_bar_49 {
width: 49%;
}

.percentage_bar_50 {
width: 50%;
}

.percentage_bar_51 {
width: 51%;
}

.percentage_bar_52 {
width: 52%;
}

.percentage_bar_53 {
width: 53%;
}

.percentage_bar_54 {
width: 54%;
}

.percentage_bar_55 {
width: 55%;
}

.percentage_bar_56 {
width: 56%;
}

.percentage_bar_57 {
width: 57%;
}

.percentage_bar_58 {
width: 58%;
}

.percentage_bar_59 {
width: 59%;
}

.percentage_bar_60 {
width: 60%;
}

.percentage_bar_61 {
width: 61%;
}

.percentage_bar_62 {
width: 62%;
}

.percentage_bar_63 {
width: 63%;
}

.percentage_bar_64 {
width: 64%;
}

.percentage_bar_65 {
width: 65%;
}

.percentage_bar_66 {
width: 66%;
}

.percentage_bar_67 {
width: 67%;
}

.percentage_bar_68 {
width: 68%;
}

.percentage_bar_69 {
width: 69%;
}

.percentage_bar_70 {
width: 70%;
}

.percentage_bar_71 {
width: 71%;
}

.percentage_bar_72 {
width: 72%;
}

.percentage_bar_73 {
width: 73%;
}

.percentage_bar_74 {
width: 74%;
}

.percentage_bar_75 {
width: 75%;
}

.percentage_bar_76 {
width: 76%;
}

.percentage_bar_77 {
width: 77%;
}

.percentage_bar_78 {
width: 78%;
}

.percentage_bar_79 {
width: 79%;
}

.percentage_bar_80 {
width: 80%;
}

.percentage_bar_81 {
width: 81%;
}

.percentage_bar_82 {
width: 82%;
}

.percentage_bar_83 {
width: 83%;
}

.percentage_bar_84 {
width: 84%;
}

.percentage_bar_85 {
width: 85%;
}

.percentage_bar_86 {
width: 86%;
}

.percentage_bar_87 {
width: 87%;
}

.percentage_bar_88 {
width: 88%;
}

.percentage_bar_89 {
width: 89%;
}

.percentage_bar_90 {
width: 90%;
}

.percentage_bar_91 {
width: 91%;
}

.percentage_bar_92 {
width: 92%;
}

.percentage_bar_93 {
width: 93%;
}

.percentage_bar_94 {
width: 94%;
}

.percentage_bar_95 {
width: 95%;
}

.percentage_bar_96 {
width: 96%;
}

.percentage_bar_97 {
width: 97%;
}

.percentage_bar_98 {
width: 98%;
}

.percentage_bar_99 {
width: 99%;
}

.percentage_bar_100 {
width: 100%;
}

.percentage_bar_animation_0 {
-webkit-animation: anim_width_0 1s;
animation: anim_width_0 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_0 {
from {
width: 0%;
}
to {
width: 0%;
}
}

@keyframes anim_width_0 {
from {
width: 0%;
}
to {
width: 0%;
}
}

.percentage_bar_animation_1 {
-webkit-animation: anim_width_1 1s;
animation: anim_width_1 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_1 {
from {
width: 0%;
}
to {
width: 1%;
}
}

@keyframes anim_width_1 {
from {
width: 0%;
}
to {
width: 1%;
}
}

.percentage_bar_animation_2 {
-webkit-animation: anim_width_2 1s;
animation: anim_width_2 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_2 {
from {
width: 0%;
}
to {
width: 2%;
}
}

@keyframes anim_width_2 {
from {
width: 0%;
}
to {
width: 2%;
}
}

.percentage_bar_animation_3 {
-webkit-animation: anim_width_3 1s;
animation: anim_width_3 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_3 {
from {
width: 0%;
}
to {
width: 3%;
}
}

@keyframes anim_width_3 {
from {
width: 0%;
}
to {
width: 3%;
}
}

.percentage_bar_animation_4 {
-webkit-animation: anim_width_4 1s;
animation: anim_width_4 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_4 {
from {
width: 0%;
}
to {
width: 4%;
}
}

@keyframes anim_width_4 {
from {
width: 0%;
}
to {
width: 4%;
}
}

.percentage_bar_animation_5 {
-webkit-animation: anim_width_5 1s;
animation: anim_width_5 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_5 {
from {
width: 0%;
}
to {
width: 5%;
}
}

@keyframes anim_width_5 {
from {
width: 0%;
}
to {
width: 5%;
}
}

.percentage_bar_animation_6 {
-webkit-animation: anim_width_6 1s;
animation: anim_width_6 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_6 {
from {
width: 0%;
}
to {
width: 6%;
}
}

@keyframes anim_width_6 {
from {
width: 0%;
}
to {
width: 6%;
}
}

.percentage_bar_animation_7 {
-webkit-animation: anim_width_7 1s;
animation: anim_width_7 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_7 {
from {
width: 0%;
}
to {
width: 7%;
}
}

@keyframes anim_width_7 {
from {
width: 0%;
}
to {
width: 7%;
}
}

.percentage_bar_animation_8 {
-webkit-animation: anim_width_8 1s;
animation: anim_width_8 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_8 {
from {
width: 0%;
}
to {
width: 8%;
}
}

@keyframes anim_width_8 {
from {
width: 0%;
}
to {
width: 8%;
}
}

.percentage_bar_animation_9 {
-webkit-animation: anim_width_9 1s;
animation: anim_width_9 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_9 {
from {
width: 0%;
}
to {
width: 9%;
}
}

@keyframes anim_width_9 {
from {
width: 0%;
}
to {
width: 9%;
}
}

.percentage_bar_animation_10 {
-webkit-animation: anim_width_10 1s;
animation: anim_width_10 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_10 {
from {
width: 0%;
}
to {
width: 10%;
}
}

@keyframes anim_width_10 {
from {
width: 0%;
}
to {
width: 10%;
}
}

.percentage_bar_animation_11 {
-webkit-animation: anim_width_11 1s;
animation: anim_width_11 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_11 {
from {
width: 0%;
}
to {
width: 11%;
}
}

@keyframes anim_width_11 {
from {
width: 0%;
}
to {
width: 11%;
}
}

.percentage_bar_animation_12 {
-webkit-animation: anim_width_12 1s;
animation: anim_width_12 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_12 {
from {
width: 0%;
}
to {
width: 12%;
}
}

@keyframes anim_width_12 {
from {
width: 0%;
}
to {
width: 12%;
}
}

.percentage_bar_animation_13 {
-webkit-animation: anim_width_13 1s;
animation: anim_width_13 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_13 {
from {
width: 0%;
}
to {
width: 13%;
}
}

@keyframes anim_width_13 {
from {
width: 0%;
}
to {
width: 13%;
}
}

.percentage_bar_animation_14 {
-webkit-animation: anim_width_14 1s;
animation: anim_width_14 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_14 {
from {
width: 0%;
}
to {
width: 14%;
}
}

@keyframes anim_width_14 {
from {
width: 0%;
}
to {
width: 14%;
}
}

.percentage_bar_animation_15 {
-webkit-animation: anim_width_15 1s;
animation: anim_width_15 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_15 {
from {
width: 0%;
}
to {
width: 15%;
}
}

@keyframes anim_width_15 {
from {
width: 0%;
}
to {
width: 15%;
}
}

.percentage_bar_animation_16 {
-webkit-animation: anim_width_16 1s;
animation: anim_width_16 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_16 {
from {
width: 0%;
}
to {
width: 16%;
}
}

@keyframes anim_width_16 {
from {
width: 0%;
}
to {
width: 16%;
}
}

.percentage_bar_animation_17 {
-webkit-animation: anim_width_17 1s;
animation: anim_width_17 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_17 {
from {
width: 0%;
}
to {
width: 17%;
}
}

@keyframes anim_width_17 {
from {
width: 0%;
}
to {
width: 17%;
}
}

.percentage_bar_animation_18 {
-webkit-animation: anim_width_18 1s;
animation: anim_width_18 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_18 {
from {
width: 0%;
}
to {
width: 18%;
}
}

@keyframes anim_width_18 {
from {
width: 0%;
}
to {
width: 18%;
}
}

.percentage_bar_animation_19 {
-webkit-animation: anim_width_19 1s;
animation: anim_width_19 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_19 {
from {
width: 0%;
}
to {
width: 19%;
}
}

@keyframes anim_width_19 {
from {
width: 0%;
}
to {
width: 19%;
}
}

.percentage_bar_animation_20 {
-webkit-animation: anim_width_20 1s;
animation: anim_width_20 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_20 {
from {
width: 0%;
}
to {
width: 20%;
}
}

@keyframes anim_width_20 {
from {
width: 0%;
}
to {
width: 20%;
}
}

.percentage_bar_animation_21 {
-webkit-animation: anim_width_21 1s;
animation: anim_width_21 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_21 {
from {
width: 0%;
}
to {
width: 21%;
}
}

@keyframes anim_width_21 {
from {
width: 0%;
}
to {
width: 21%;
}
}

.percentage_bar_animation_22 {
-webkit-animation: anim_width_22 1s;
animation: anim_width_22 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_22 {
from {
width: 0%;
}
to {
width: 22%;
}
}

@keyframes anim_width_22 {
from {
width: 0%;
}
to {
width: 22%;
}
}

.percentage_bar_animation_23 {
-webkit-animation: anim_width_23 1s;
animation: anim_width_23 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_23 {
from {
width: 0%;
}
to {
width: 23%;
}
}

@keyframes anim_width_23 {
from {
width: 0%;
}
to {
width: 23%;
}
}

.percentage_bar_animation_24 {
-webkit-animation: anim_width_24 1s;
animation: anim_width_24 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_24 {
from {
width: 0%;
}
to {
width: 24%;
}
}

@keyframes anim_width_24 {
from {
width: 0%;
}
to {
width: 24%;
}
}

.percentage_bar_animation_25 {
-webkit-animation: anim_width_25 1s;
animation: anim_width_25 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_25 {
from {
width: 0%;
}
to {
width: 25%;
}
}

@keyframes anim_width_25 {
from {
width: 0%;
}
to {
width: 25%;
}
}

.percentage_bar_animation_26 {
-webkit-animation: anim_width_26 1s;
animation: anim_width_26 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_26 {
from {
width: 0%;
}
to {
width: 26%;
}
}

@keyframes anim_width_26 {
from {
width: 0%;
}
to {
width: 26%;
}
}

.percentage_bar_animation_27 {
-webkit-animation: anim_width_27 1s;
animation: anim_width_27 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_27 {
from {
width: 0%;
}
to {
width: 27%;
}
}

@keyframes anim_width_27 {
from {
width: 0%;
}
to {
width: 27%;
}
}

.percentage_bar_animation_28 {
-webkit-animation: anim_width_28 1s;
animation: anim_width_28 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_28 {
from {
width: 0%;
}
to {
width: 28%;
}
}

@keyframes anim_width_28 {
from {
width: 0%;
}
to {
width: 28%;
}
}

.percentage_bar_animation_29 {
-webkit-animation: anim_width_29 1s;
animation: anim_width_29 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_29 {
from {
width: 0%;
}
to {
width: 29%;
}
}

@keyframes anim_width_29 {
from {
width: 0%;
}
to {
width: 29%;
}
}

.percentage_bar_animation_30 {
-webkit-animation: anim_width_30 1s;
animation: anim_width_30 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_30 {
from {
width: 0%;
}
to {
width: 30%;
}
}

@keyframes anim_width_30 {
from {
width: 0%;
}
to {
width: 30%;
}
}

.percentage_bar_animation_31 {
-webkit-animation: anim_width_31 1s;
animation: anim_width_31 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_31 {
from {
width: 0%;
}
to {
width: 31%;
}
}

@keyframes anim_width_31 {
from {
width: 0%;
}
to {
width: 31%;
}
}

.percentage_bar_animation_32 {
-webkit-animation: anim_width_32 1s;
animation: anim_width_32 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_32 {
from {
width: 0%;
}
to {
width: 32%;
}
}

@keyframes anim_width_32 {
from {
width: 0%;
}
to {
width: 32%;
}
}

.percentage_bar_animation_33 {
-webkit-animation: anim_width_33 1s;
animation: anim_width_33 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_33 {
from {
width: 0%;
}
to {
width: 33%;
}
}

@keyframes anim_width_33 {
from {
width: 0%;
}
to {
width: 33%;
}
}

.percentage_bar_animation_34 {
-webkit-animation: anim_width_34 1s;
animation: anim_width_34 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_34 {
from {
width: 0%;
}
to {
width: 34%;
}
}

@keyframes anim_width_34 {
from {
width: 0%;
}
to {
width: 34%;
}
}

.percentage_bar_animation_35 {
-webkit-animation: anim_width_35 1s;
animation: anim_width_35 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_35 {
from {
width: 0%;
}
to {
width: 35%;
}
}

@keyframes anim_width_35 {
from {
width: 0%;
}
to {
width: 35%;
}
}

.percentage_bar_animation_36 {
-webkit-animation: anim_width_36 1s;
animation: anim_width_36 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_36 {
from {
width: 0%;
}
to {
width: 36%;
}
}

@keyframes anim_width_36 {
from {
width: 0%;
}
to {
width: 36%;
}
}

.percentage_bar_animation_37 {
-webkit-animation: anim_width_37 1s;
animation: anim_width_37 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_37 {
from {
width: 0%;
}
to {
width: 37%;
}
}

@keyframes anim_width_37 {
from {
width: 0%;
}
to {
width: 37%;
}
}

.percentage_bar_animation_38 {
-webkit-animation: anim_width_38 1s;
animation: anim_width_38 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_38 {
from {
width: 0%;
}
to {
width: 38%;
}
}

@keyframes anim_width_38 {
from {
width: 0%;
}
to {
width: 38%;
}
}

.percentage_bar_animation_39 {
-webkit-animation: anim_width_39 1s;
animation: anim_width_39 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_39 {
from {
width: 0%;
}
to {
width: 39%;
}
}

@keyframes anim_width_39 {
from {
width: 0%;
}
to {
width: 39%;
}
}

.percentage_bar_animation_40 {
-webkit-animation: anim_width_40 1s;
animation: anim_width_40 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_40 {
from {
width: 0%;
}
to {
width: 40%;
}
}

@keyframes anim_width_40 {
from {
width: 0%;
}
to {
width: 40%;
}
}

.percentage_bar_animation_41 {
-webkit-animation: anim_width_41 1s;
animation: anim_width_41 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_41 {
from {
width: 0%;
}
to {
width: 41%;
}
}

@keyframes anim_width_41 {
from {
width: 0%;
}
to {
width: 41%;
}
}

.percentage_bar_animation_42 {
-webkit-animation: anim_width_42 1s;
animation: anim_width_42 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_42 {
from {
width: 0%;
}
to {
width: 42%;
}
}

@keyframes anim_width_42 {
from {
width: 0%;
}
to {
width: 42%;
}
}

.percentage_bar_animation_43 {
-webkit-animation: anim_width_43 1s;
animation: anim_width_43 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_43 {
from {
width: 0%;
}
to {
width: 43%;
}
}

@keyframes anim_width_43 {
from {
width: 0%;
}
to {
width: 43%;
}
}

.percentage_bar_animation_44 {
-webkit-animation: anim_width_44 1s;
animation: anim_width_44 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_44 {
from {
width: 0%;
}
to {
width: 44%;
}
}

@keyframes anim_width_44 {
from {
width: 0%;
}
to {
width: 44%;
}
}

.percentage_bar_animation_45 {
-webkit-animation: anim_width_45 1s;
animation: anim_width_45 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_45 {
from {
width: 0%;
}
to {
width: 45%;
}
}

@keyframes anim_width_45 {
from {
width: 0%;
}
to {
width: 45%;
}
}

.percentage_bar_animation_46 {
-webkit-animation: anim_width_46 1s;
animation: anim_width_46 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_46 {
from {
width: 0%;
}
to {
width: 46%;
}
}

@keyframes anim_width_46 {
from {
width: 0%;
}
to {
width: 46%;
}
}

.percentage_bar_animation_47 {
-webkit-animation: anim_width_47 1s;
animation: anim_width_47 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_47 {
from {
width: 0%;
}
to {
width: 47%;
}
}

@keyframes anim_width_47 {
from {
width: 0%;
}
to {
width: 47%;
}
}

.percentage_bar_animation_48 {
-webkit-animation: anim_width_48 1s;
animation: anim_width_48 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_48 {
from {
width: 0%;
}
to {
width: 48%;
}
}

@keyframes anim_width_48 {
from {
width: 0%;
}
to {
width: 48%;
}
}

.percentage_bar_animation_49 {
-webkit-animation: anim_width_49 1s;
animation: anim_width_49 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_49 {
from {
width: 0%;
}
to {
width: 49%;
}
}

@keyframes anim_width_49 {
from {
width: 0%;
}
to {
width: 49%;
}
}

.percentage_bar_animation_50 {
-webkit-animation: anim_width_50 1s;
animation: anim_width_50 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_50 {
from {
width: 0%;
}
to {
width: 50%;
}
}

@keyframes anim_width_50 {
from {
width: 0%;
}
to {
width: 50%;
}
}

.percentage_bar_animation_51 {
-webkit-animation: anim_width_51 1s;
animation: anim_width_51 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_51 {
from {
width: 0%;
}
to {
width: 51%;
}
}

@keyframes anim_width_51 {
from {
width: 0%;
}
to {
width: 51%;
}
}

.percentage_bar_animation_52 {
-webkit-animation: anim_width_52 1s;
animation: anim_width_52 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_52 {
from {
width: 0%;
}
to {
width: 52%;
}
}

@keyframes anim_width_52 {
from {
width: 0%;
}
to {
width: 52%;
}
}

.percentage_bar_animation_53 {
-webkit-animation: anim_width_53 1s;
animation: anim_width_53 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_53 {
from {
width: 0%;
}
to {
width: 53%;
}
}

@keyframes anim_width_53 {
from {
width: 0%;
}
to {
width: 53%;
}
}

.percentage_bar_animation_54 {
-webkit-animation: anim_width_54 1s;
animation: anim_width_54 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_54 {
from {
width: 0%;
}
to {
width: 54%;
}
}

@keyframes anim_width_54 {
from {
width: 0%;
}
to {
width: 54%;
}
}

.percentage_bar_animation_55 {
-webkit-animation: anim_width_55 1s;
animation: anim_width_55 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_55 {
from {
width: 0%;
}
to {
width: 55%;
}
}

@keyframes anim_width_55 {
from {
width: 0%;
}
to {
width: 55%;
}
}

.percentage_bar_animation_56 {
-webkit-animation: anim_width_56 1s;
animation: anim_width_56 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_56 {
from {
width: 0%;
}
to {
width: 56%;
}
}

@keyframes anim_width_56 {
from {
width: 0%;
}
to {
width: 56%;
}
}

.percentage_bar_animation_57 {
-webkit-animation: anim_width_57 1s;
animation: anim_width_57 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_57 {
from {
width: 0%;
}
to {
width: 57%;
}
}

@keyframes anim_width_57 {
from {
width: 0%;
}
to {
width: 57%;
}
}

.percentage_bar_animation_58 {
-webkit-animation: anim_width_58 1s;
animation: anim_width_58 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_58 {
from {
width: 0%;
}
to {
width: 58%;
}
}

@keyframes anim_width_58 {
from {
width: 0%;
}
to {
width: 58%;
}
}

.percentage_bar_animation_59 {
-webkit-animation: anim_width_59 1s;
animation: anim_width_59 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_59 {
from {
width: 0%;
}
to {
width: 59%;
}
}

@keyframes anim_width_59 {
from {
width: 0%;
}
to {
width: 59%;
}
}

.percentage_bar_animation_60 {
-webkit-animation: anim_width_60 1s;
animation: anim_width_60 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_60 {
from {
width: 0%;
}
to {
width: 60%;
}
}

@keyframes anim_width_60 {
from {
width: 0%;
}
to {
width: 60%;
}
}

.percentage_bar_animation_61 {
-webkit-animation: anim_width_61 1s;
animation: anim_width_61 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_61 {
from {
width: 0%;
}
to {
width: 61%;
}
}

@keyframes anim_width_61 {
from {
width: 0%;
}
to {
width: 61%;
}
}

.percentage_bar_animation_62 {
-webkit-animation: anim_width_62 1s;
animation: anim_width_62 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_62 {
from {
width: 0%;
}
to {
width: 62%;
}
}

@keyframes anim_width_62 {
from {
width: 0%;
}
to {
width: 62%;
}
}

.percentage_bar_animation_63 {
-webkit-animation: anim_width_63 1s;
animation: anim_width_63 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_63 {
from {
width: 0%;
}
to {
width: 63%;
}
}

@keyframes anim_width_63 {
from {
width: 0%;
}
to {
width: 63%;
}
}

.percentage_bar_animation_64 {
-webkit-animation: anim_width_64 1s;
animation: anim_width_64 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_64 {
from {
width: 0%;
}
to {
width: 64%;
}
}

@keyframes anim_width_64 {
from {
width: 0%;
}
to {
width: 64%;
}
}

.percentage_bar_animation_65 {
-webkit-animation: anim_width_65 1s;
animation: anim_width_65 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_65 {
from {
width: 0%;
}
to {
width: 65%;
}
}

@keyframes anim_width_65 {
from {
width: 0%;
}
to {
width: 65%;
}
}

.percentage_bar_animation_66 {
-webkit-animation: anim_width_66 1s;
animation: anim_width_66 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_66 {
from {
width: 0%;
}
to {
width: 66%;
}
}

@keyframes anim_width_66 {
from {
width: 0%;
}
to {
width: 66%;
}
}

.percentage_bar_animation_67 {
-webkit-animation: anim_width_67 1s;
animation: anim_width_67 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_67 {
from {
width: 0%;
}
to {
width: 67%;
}
}

@keyframes anim_width_67 {
from {
width: 0%;
}
to {
width: 67%;
}
}

.percentage_bar_animation_68 {
-webkit-animation: anim_width_68 1s;
animation: anim_width_68 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_68 {
from {
width: 0%;
}
to {
width: 68%;
}
}

@keyframes anim_width_68 {
from {
width: 0%;
}
to {
width: 68%;
}
}

.percentage_bar_animation_69 {
-webkit-animation: anim_width_69 1s;
animation: anim_width_69 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_69 {
from {
width: 0%;
}
to {
width: 69%;
}
}

@keyframes anim_width_69 {
from {
width: 0%;
}
to {
width: 69%;
}
}

.percentage_bar_animation_70 {
-webkit-animation: anim_width_70 1s;
animation: anim_width_70 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_70 {
from {
width: 0%;
}
to {
width: 70%;
}
}

@keyframes anim_width_70 {
from {
width: 0%;
}
to {
width: 70%;
}
}

.percentage_bar_animation_71 {
-webkit-animation: anim_width_71 1s;
animation: anim_width_71 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_71 {
from {
width: 0%;
}
to {
width: 71%;
}
}

@keyframes anim_width_71 {
from {
width: 0%;
}
to {
width: 71%;
}
}

.percentage_bar_animation_72 {
-webkit-animation: anim_width_72 1s;
animation: anim_width_72 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_72 {
from {
width: 0%;
}
to {
width: 72%;
}
}

@keyframes anim_width_72 {
from {
width: 0%;
}
to {
width: 72%;
}
}

.percentage_bar_animation_73 {
-webkit-animation: anim_width_73 1s;
animation: anim_width_73 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_73 {
from {
width: 0%;
}
to {
width: 73%;
}
}

@keyframes anim_width_73 {
from {
width: 0%;
}
to {
width: 73%;
}
}

.percentage_bar_animation_74 {
-webkit-animation: anim_width_74 1s;
animation: anim_width_74 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_74 {
from {
width: 0%;
}
to {
width: 74%;
}
}

@keyframes anim_width_74 {
from {
width: 0%;
}
to {
width: 74%;
}
}

.percentage_bar_animation_75 {
-webkit-animation: anim_width_75 1s;
animation: anim_width_75 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_75 {
from {
width: 0%;
}
to {
width: 75%;
}
}

@keyframes anim_width_75 {
from {
width: 0%;
}
to {
width: 75%;
}
}

.percentage_bar_animation_76 {
-webkit-animation: anim_width_76 1s;
animation: anim_width_76 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_76 {
from {
width: 0%;
}
to {
width: 76%;
}
}

@keyframes anim_width_76 {
from {
width: 0%;
}
to {
width: 76%;
}
}

.percentage_bar_animation_77 {
-webkit-animation: anim_width_77 1s;
animation: anim_width_77 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_77 {
from {
width: 0%;
}
to {
width: 77%;
}
}

@keyframes anim_width_77 {
from {
width: 0%;
}
to {
width: 77%;
}
}

.percentage_bar_animation_78 {
-webkit-animation: anim_width_78 1s;
animation: anim_width_78 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_78 {
from {
width: 0%;
}
to {
width: 78%;
}
}

@keyframes anim_width_78 {
from {
width: 0%;
}
to {
width: 78%;
}
}

.percentage_bar_animation_79 {
-webkit-animation: anim_width_79 1s;
animation: anim_width_79 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_79 {
from {
width: 0%;
}
to {
width: 79%;
}
}

@keyframes anim_width_79 {
from {
width: 0%;
}
to {
width: 79%;
}
}

.percentage_bar_animation_80 {
-webkit-animation: anim_width_80 1s;
animation: anim_width_80 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_80 {
from {
width: 0%;
}
to {
width: 80%;
}
}

@keyframes anim_width_80 {
from {
width: 0%;
}
to {
width: 80%;
}
}

.percentage_bar_animation_81 {
-webkit-animation: anim_width_81 1s;
animation: anim_width_81 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_81 {
from {
width: 0%;
}
to {
width: 81%;
}
}

@keyframes anim_width_81 {
from {
width: 0%;
}
to {
width: 81%;
}
}

.percentage_bar_animation_82 {
-webkit-animation: anim_width_82 1s;
animation: anim_width_82 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_82 {
from {
width: 0%;
}
to {
width: 82%;
}
}

@keyframes anim_width_82 {
from {
width: 0%;
}
to {
width: 82%;
}
}

.percentage_bar_animation_83 {
-webkit-animation: anim_width_83 1s;
animation: anim_width_83 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_83 {
from {
width: 0%;
}
to {
width: 83%;
}
}

@keyframes anim_width_83 {
from {
width: 0%;
}
to {
width: 83%;
}
}

.percentage_bar_animation_84 {
-webkit-animation: anim_width_84 1s;
animation: anim_width_84 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_84 {
from {
width: 0%;
}
to {
width: 84%;
}
}

@keyframes anim_width_84 {
from {
width: 0%;
}
to {
width: 84%;
}
}

.percentage_bar_animation_85 {
-webkit-animation: anim_width_85 1s;
animation: anim_width_85 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_85 {
from {
width: 0%;
}
to {
width: 85%;
}
}

@keyframes anim_width_85 {
from {
width: 0%;
}
to {
width: 85%;
}
}

.percentage_bar_animation_86 {
-webkit-animation: anim_width_86 1s;
animation: anim_width_86 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_86 {
from {
width: 0%;
}
to {
width: 86%;
}
}

@keyframes anim_width_86 {
from {
width: 0%;
}
to {
width: 86%;
}
}

.percentage_bar_animation_87 {
-webkit-animation: anim_width_87 1s;
animation: anim_width_87 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_87 {
from {
width: 0%;
}
to {
width: 87%;
}
}

@keyframes anim_width_87 {
from {
width: 0%;
}
to {
width: 87%;
}
}

.percentage_bar_animation_88 {
-webkit-animation: anim_width_88 1s;
animation: anim_width_88 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_88 {
from {
width: 0%;
}
to {
width: 88%;
}
}

@keyframes anim_width_88 {
from {
width: 0%;
}
to {
width: 88%;
}
}

.percentage_bar_animation_89 {
-webkit-animation: anim_width_89 1s;
animation: anim_width_89 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_89 {
from {
width: 0%;
}
to {
width: 89%;
}
}

@keyframes anim_width_89 {
from {
width: 0%;
}
to {
width: 89%;
}
}

.percentage_bar_animation_90 {
-webkit-animation: anim_width_90 1s;
animation: anim_width_90 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_90 {
from {
width: 0%;
}
to {
width: 90%;
}
}

@keyframes anim_width_90 {
from {
width: 0%;
}
to {
width: 90%;
}
}

.percentage_bar_animation_91 {
-webkit-animation: anim_width_91 1s;
animation: anim_width_91 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_91 {
from {
width: 0%;
}
to {
width: 91%;
}
}

@keyframes anim_width_91 {
from {
width: 0%;
}
to {
width: 91%;
}
}

.percentage_bar_animation_92 {
-webkit-animation: anim_width_92 1s;
animation: anim_width_92 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_92 {
from {
width: 0%;
}
to {
width: 92%;
}
}

@keyframes anim_width_92 {
from {
width: 0%;
}
to {
width: 92%;
}
}

.percentage_bar_animation_93 {
-webkit-animation: anim_width_93 1s;
animation: anim_width_93 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_93 {
from {
width: 0%;
}
to {
width: 93%;
}
}

@keyframes anim_width_93 {
from {
width: 0%;
}
to {
width: 93%;
}
}

.percentage_bar_animation_94 {
-webkit-animation: anim_width_94 1s;
animation: anim_width_94 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_94 {
from {
width: 0%;
}
to {
width: 94%;
}
}

@keyframes anim_width_94 {
from {
width: 0%;
}
to {
width: 94%;
}
}

.percentage_bar_animation_95 {
-webkit-animation: anim_width_95 1s;
animation: anim_width_95 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_95 {
from {
width: 0%;
}
to {
width: 95%;
}
}

@keyframes anim_width_95 {
from {
width: 0%;
}
to {
width: 95%;
}
}

.percentage_bar_animation_96 {
-webkit-animation: anim_width_96 1s;
animation: anim_width_96 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_96 {
from {
width: 0%;
}
to {
width: 96%;
}
}

@keyframes anim_width_96 {
from {
width: 0%;
}
to {
width: 96%;
}
}

.percentage_bar_animation_97 {
-webkit-animation: anim_width_97 1s;
animation: anim_width_97 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_97 {
from {
width: 0%;
}
to {
width: 97%;
}
}

@keyframes anim_width_97 {
from {
width: 0%;
}
to {
width: 97%;
}
}

.percentage_bar_animation_98 {
-webkit-animation: anim_width_98 1s;
animation: anim_width_98 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_98 {
from {
width: 0%;
}
to {
width: 98%;
}
}

@keyframes anim_width_98 {
from {
width: 0%;
}
to {
width: 98%;
}
}

.percentage_bar_animation_99 {
-webkit-animation: anim_width_99 1s;
animation: anim_width_99 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_99 {
from {
width: 0%;
}
to {
width: 99%;
}
}

@keyframes anim_width_99 {
from {
width: 0%;
}
to {
width: 99%;
}
}

.percentage_bar_animation_100 {
-webkit-animation: anim_width_100 1s;
animation: anim_width_100 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}

@-webkit-keyframes anim_width_100 {
from {
width: 0%;
}
to {
width: 100%;
}
}

@keyframes anim_width_100 {
from {
width: 0%;
}
to {
width: 100%;
}
}

```

## Author

Jason Melgoza

## License

MIT