.Afarideh {
  stroke: #fff;
  stroke-width: 35;
  stroke-miterlimit: 10;
  fill: transparent;
  stroke-dasharray: 100000;
  stroke-dashoffset: 100000;
  animation: border 10s ease-in forwards, fill3 1s 6s linear forwards;
  /*4*/
}

.Az {
  stroke: #fff;
  stroke-width: 35;
  stroke-miterlimit: 10;
  fill: transparent;
  stroke-dasharray: 100000;
  stroke-dashoffset: 100000;
  animation: border 2s 4s ease-in forwards, fill3 1s 6s linear forwards;
  /*7*/
}

.Maharat {
  stroke: #fff;
  stroke-width: 35;
  stroke-miterlimit: 10;
  fill: transparent;
  stroke-dasharray: 100000;
  stroke-dashoffset: 100000;
  animation: border 6s 5s ease-in forwards, fill3 1s 7s linear forwards;
  /*10*/
}

.V {
  stroke: #fff;
  stroke-width: 35;
  stroke-miterlimit: 10;
  fill: transparent;
  stroke-dasharray: 100000;
  stroke-dashoffset: 100000;
  animation: border 2s 8s ease-in forwards, fill3 1s 8s linear forwards;
}

.Avari {
  stroke: #fff;
  stroke-width: 35;
  stroke-miterlimit: 10;
  fill: transparent;
  stroke-dasharray: 100000;
  stroke-dashoffset: 100000;
  animation: border 6s 9s ease-in forwards, fill3 1s 12s linear forwards;
}

.Text {
  fill: transparent;
  animation: fill3 2s 14s linear forwards;
}

.LineUpRight {
  fill: transparent;
  animation: fill3 2s 15s linear forwards;
}

.LineUpLeft {
  fill: transparent;
  animation: fill3 2s 15s linear forwards;
}

.LineMiddleLeft {
  fill: transparent;
  animation: fill3 2s 15s linear forwards;
}

.LineDownRight {
  fill: transparent;
  animation: fill3 2s 15s linear forwards;
}

.LineDownLeft {
  fill: transparent;
  animation: fill3 2s 15s linear forwards;
}

.circle {
  background: #fff;
  border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%;
  overflow: hidden;
  animation: morph 30s linear infinite;

  background-image: linear-gradient(45deg, #3023AE 0%, #f09 100%);
}

@keyframes morph {
  0%, 100% {
    border-radius: 40% 60% 70% 30% / 40% 40% 60% 50%;
  }
  34% {
    border-radius: 70% 30% 50% 50% / 30% 30% 70% 70%;
  }
  67% {
    border-radius: 100% 60% 60% 100% / 100% 100% 60% 60%;
  }
}


@keyframes border {
  from {
    stroke-dashoffset: 100000;
  }
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes fill3 {
  to {
    fill: #fff;
  }
}

