#maskenball > path[id='m']{
  stroke-dasharray: 259.07;  
  stroke-dashoffset: 259.07;
  animation: m;
}

@keyframes m {
  0% {
    stroke-dashoffset: 259.07;
  }
  0% {
    stroke-dashoffset: 259.07;
  }
  15% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

#maskenball > path[id='as']{
  stroke-dasharray: 182.9;  
  stroke-dashoffset: 182.9;  
  animation: as;
}

@keyframes as {
  0% {
    stroke-dashoffset: 182.9;
  }
  10% {
    stroke-dashoffset: 182.9;
  }
  60% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

#maskenball > path[id='ken']{
  stroke-dasharray: 345.04;  
  stroke-dashoffset: 345.04;  
  animation: ken;
}

@keyframes ken {
  0% {
    stroke-dashoffset: 345.04;
  }
  20% {
    stroke-dashoffset: 345.04;
  }
  50% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

#maskenball > path[id='b']{
  stroke-dasharray: 147.51;  
  stroke-dashoffset: 147.51;  
  animation: b;
}

@keyframes b {
  0% {
    stroke-dashoffset: 147.51;
  }
  30% {
    stroke-dashoffset: 147.51;
  }
  50% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

#maskenball > path[id='al']{
  stroke-dasharray: 207.43;  
  stroke-dashoffset: 207.43;  
  animation: al;
}

@keyframes al {
  0% {
    stroke-dashoffset: 207.43;
  }
  45% {
    stroke-dashoffset: 207.43;
  }
  70% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

#maskenball > path[id='l']{
  stroke-dasharray: 82.09;  
  stroke-dashoffset: 82.09;  
  animation: l;
}

@keyframes l {
  0% {
    stroke-dashoffset: 82.09;
  }
  50% {
    stroke-dashoffset: 82.09;
  }
  70% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

#maskenball > path[id='end']{
  stroke-dasharray: 39.1;  
  stroke-dashoffset: 39.1;  
  animation: end;
}

@keyframes end {
  0% {
    stroke-dashoffset: 39.1;
  }
  60% {
    stroke-dashoffset: 39.1;
  }
  70% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
