.a {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: a 0.3s ease forwards;
}

@keyframes a {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .a {
  fill: blue;
}

.b {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: b 0.3s ease forwards 0.3s;
}

@keyframes b {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .b {
  fill: blue;
}

.c {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: c 0.3s ease forwards 0.6s;
}

@keyframes c {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .c {
  fill: red;
}

.d {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: d 0.3s ease forwards 0.9s;
}

@keyframes d {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .d {
  fill: pink;
}

.e {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: e 0.3s ease forwards 1.2s;
}

@keyframes e {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .e {
  fill: green;
}

.f {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: f 0.3s ease forwards 1.5s;
}

@keyframes f {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .f {
  fill: brown;
}

.g {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: g 0.3s ease forwards 1.8s;
}

@keyframes g {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .g {
  fill: rosybrown;
}

.h {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: h 0.3s ease forwards 2.1s;
}

@keyframes h {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .h {
  fill: rosybrown;
}

.i {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: i 0.3s ease forwards 2.4s;
}

@keyframes i {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .i {
  fill: rosybrown;
}

.j {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: j 0.3s ease forwards 2.7s;
}

@keyframes j {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .j {
  fill: purple;
}

.k {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: k 0.3s ease forwards 3.0s;
}

@keyframes k {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .k {
  fill: maroon;
}

.l {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: l 0.3s ease forwards 3.3s;
}

@keyframes l {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .l {
  fill: orange;
}

.m {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: m 0.3s ease forwards 3.6s;
}

@keyframes m {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .m {
  fill: orange;
}

.n {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: n 0.3s ease forwards 3.9s;
}

@keyframes n {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .n {
  fill: yellow;
}

.o {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: o 0.3s ease forwards 4.2s;
}

@keyframes o {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .o {
  fill: darkgreen;
}

.p {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: p 0.3s ease forwards 4.5s;
}

@keyframes p {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .p {
  fill: goldenrod;
}

.q {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: q 0.3s ease forwards 4.8s;
}

@keyframes q {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .q {
  fill: goldenrod;
}

.r {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: r 0.3s ease forwards 5.1s;
}

@keyframes r {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .r {
  fill: salmon;
}

.s {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: s 0.3s ease forwards 5.4s;
}

@keyframes s {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .s {
  fill: steelblue;
}

.t {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: t 0.3s ease forwards 5.7s;
}

@keyframes t {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .t {
  fill: teal;
}

.u {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: u 0.3s ease forwards 6.0s;
}

@keyframes u {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .u {
  fill: thistle;
}

.v {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: v 0.3s ease forwards 6.3s;
}

@keyframes v {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .v {
  fill: turquoise;
}

.w {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: w 0.3s ease forwards 6.6s;
}

@keyframes w {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .w {
  fill: violet;
}

.x {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: x 0.3s ease forwards 6.9s;
}

@keyframes x {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .x {
  fill: violet;
}

.y {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: y 0.3s ease forwards 7.2s;
}

@keyframes y {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .y {
  fill: red;
}

.z {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: z 0.3s ease forwards 7.5s;
}

@keyframes z {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .z {
  fill: limegreen;
}

.a1 {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: a1 0.3s ease forwards 7.8s;
}

@keyframes a1 {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .a1 {
  fill: lightcoral;
}

.a2 {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: a2 0.3s ease forwards 8.1s;
}

@keyframes a2 {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .a2 {
  fill: indigo;
}

.a3 {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: a3 0.3s ease forwards 8.4s;
}

@keyframes a3 {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .a3 {
  fill: darkseagreen;
}

.a4 {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: a4 0.3s ease forwards 8.7s;
}

@keyframes a4 {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .a4 {
  fill: red;
}

.a5 {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: a5 0.3s ease forwards 9.0s;
}

@keyframes a5 {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .a5 {
  fill: aquamarine;
}

.a6 {
  stroke: white;
  stroke-width:9px;
  stroke-dasharray: 250;
  stroke-dashoffset: 0;
  animation: a6 0.3s ease forwards 9.3s;
}

@keyframes a6 {
  to {
    stroke-dashoffset: 250;
  }
}
svg:hover .a6 {
  fill: aquamarine;
}

.cls-2 {
  stroke: white;
  stroke-width:1.2px;
  stroke-dasharray: 250;
  stroke-dashoffset: 250;
  animation: cls-2 2s forwards .0s;
}

@keyframes cls-2 {
  to {
    stroke-dashoffset: 0;
  }
}


.cls-9 {
  stroke: white;
  stroke-width:15px;
  stroke-dasharray: 700;
  stroke-dashoffset: 0;
  animation: cls-9 2s ease forwards 0.0s;
}

@keyframes cls-9 {
  to {
    stroke-dashoffset: 700;
  }
}

.cls-4 {
  stroke: white;
  stroke-width:1.2px;
  stroke-dasharray: 250;
  stroke-dashoffset: 250;
  animation: cls-4 2.5s forwards 2.5s;
}

@keyframes cls-4 {
  to {
    stroke-dashoffset: 0;
  }
}


.cls-3 {
  stroke: white;
  stroke-width:15px;
  stroke-dasharray: 700;
  stroke-dashoffset: 0;
  animation: cls-3 2.5s ease forwards 2.5s;
}

@keyframes cls-3 {
  to {
    stroke-dashoffset: 700;
  }
}
.cls-6 {
  stroke: white;
  stroke-width:1.2px;
  stroke-dasharray: 250;
  stroke-dashoffset: 250;
  animation: cls-6 2.5s forwards 5s;
}

@keyframes cls-6 {
  to {
    stroke-dashoffset: 0;
  }
}


.cls-5 {
  stroke: white;
  stroke-width:15px;
  stroke-dasharray: 700;
  stroke-dashoffset: 0;
  animation: cls-5 2.5s ease forwards 5.0s;
}

@keyframes cls-5 {
  to {
    stroke-dashoffset: 700;
  }
}
.cls-8 {
  stroke: white;
  stroke-width:1.2px;
  stroke-dasharray: 250;
  stroke-dashoffset: 250;
  animation: cls-8 2.5s forwards 7.5s;
}

@keyframes cls-8 {
  to {
    stroke-dashoffset: 0;
  }
}


.cls-7 {
  stroke: white;
  stroke-width:15px;
  stroke-dasharray: 700;
  stroke-dashoffset: 0;
  animation: cls-7 2.5s ease forwards 7.5s;
}

@keyframes cls-7 {
  to {
    stroke-dashoffset: 700;
  }
}