/*------------------------------------------------------------------------*/
/*------------------------------------------------------------------------*/
/*------------------------------------------------------------------------*/
/*------------------------------------------------------------------------*/
@keyframes animation1 {
  0% {
    transform: translate(252px, 166px);
  }

  5.56% {
    transform: translate(284px, 193px);
  }

  11.11% {
    transform: translate(316px, 193px);
  }

  16.67% {
    transform: translate(348px, 193px);
  }

  22.22% {
    transform: translate(380px, 166px);
  }

  27.78% {
    transform: translate(412px, 166px);
  }

  33.33% {
    transform: translate(444px, 193px);
  }

  38.89% {
    transform: translate(476px, 166px);
  }

  44.44% {
    transform: translate(508px, 166px);
  }

  50% {
    transform: translate(540px, 139px);
  }

  55.56% {
    transform: translate(572px, 166px);
  }

  61.11% {
    transform: translate(604px, 139px);
  }

  66.67% {
    transform: translate(636px, 139px);
  }

  72.22% {
    transform: translate(668px, 112px);
  }

  77.78% {
    transform: translate(700px, 112px);
  }

  83.33% {
    transform: translate(732px, 85px);
  }

  88.89% {
    transform: translate(764px, 85px);
  }

  94.44% {
    transform: translate(796px, 85px);
  }

  100% {
    transform: translate(828px, 85px);
  }

  0% {
    opacity: 0;
  }

  15% {
    opacity: 1;
  }

  85% {
    opacity: 1;
  }

  /*100% {*/
  /*  opacity: 0;*/
  /*}*/
}

@keyframes animation2 {
  0% {
    transform: translate(604px, 193px);
  }

  3.85% {
    transform: translate(636px, 193px);
  }

  7.69% {
    transform: translate(668px, 193px);
  }

  11.54% {
    transform: translate(700px, 166px);
  }

  15.38% {
    transform: translate(732px, 139px);
  }

  19.23% {
    transform: translate(764px, 112px);
  }

  23.08% {
    transform: translate(796px, 85px);
  }

  26.92% {
    transform: translate(828px, 112px);
  }

  30.77% {
    transform: translate(860px, 85px);
  }

  34.62% {
    transform: translate(892px, 58px);
  }

  38.46% {
    transform: translate(924px, 85px);
  }

  42.31% {
    transform: translate(956px, 58px);
  }

  46.15% {
    transform: translate(988px, 58px);
  }

  50% {
    transform: translate(1020px, 31px);
  }

  53.85% {
    transform: translate(1052px, 58px);
  }

  57.69% {
    transform: translate(1084px, 85px);
  }

  61.54% {
    transform: translate(1116px, 58px);
  }

  65.38% {
    transform: translate(1148px, 58px);
  }

  69.23% {
    transform: translate(1180px, 31px);
  }

  73.08% {
    transform: translate(1212px, 4px);
  }

  76.92% {
    transform: translate(1244px, 4px);
  }

  80.77% {
    transform: translate(1276px, 4px);
  }

  84.62% {
    transform: translate(1308px, 31px);
  }

  88.46% {
    transform: translate(1340px, 31px);
  }

  92.31% {
    transform: translate(1372px, 4px);
  }

  96.15% {
    transform: translate(1404px, -23px);
  }

  100% {
    transform: translate(1436px, 4px);
  }

  0% {
    opacity: 0;
  }

  15% {
    opacity: 1;
  }

  85% {
    opacity: 1;
  }

  /*100% {*/
  /*  opacity: 0;*/
  /*}*/
}

@keyframes animation3 {
  0% {
    transform: translate(700px, 571px);
  }

  7.69% {
    transform: translate(732px, 544px);
  }

  15.38% {
    transform: translate(764px, 517px);
  }

  23.08% {
    transform: translate(796px, 490px);
  }

  30.77% {
    transform: translate(828px, 517px);
  }

  38.46% {
    transform: translate(860px, 517px);
  }

  46.15% {
    transform: translate(892px, 517px);
  }

  53.85% {
    transform: translate(924px, 517px);
  }

  61.54% {
    transform: translate(956px, 490px);
  }

  69.23% {
    transform: translate(988px, 517px);
  }

  76.92% {
    transform: translate(1020px, 544px);
  }

  84.62% {
    transform: translate(1052px, 544px);
  }

  92.31% {
    transform: translate(1084px, 517px);
  }

  100% {
    transform: translate(1116px, 517px);
  }

  0% {
    opacity: 0;
  }

  15% {
    opacity: 1;
  }

  85% {
    opacity: 1;
  }

  /*100% {*/
  /*  opacity: 0;*/
  /*}*/
}

@keyframes animation4 {
  0% {
    transform: translate(828px, 85px);
  }

  5.56% {
    transform: translate(796px, 85px);

  }

  11.11% {
    transform: translate(764px, 85px);

  }

  16.67% {
    transform: translate(732px, 85px);

  }

  22.22% {
    transform: translate(700px, 112px);

  }

  27.78% {
    transform: translate(668px, 112px);
  }

  33.33% {
    transform: translate(636px, 139px);

  }

  38.89% {
    transform: translate(604px, 139px);

  }

  44.44% {
    transform: translate(572px, 166px);

  }

  50% {
    transform: translate(540px, 139px);

  }

  55.56% {
    transform: translate(508px, 166px);

  }

  61.11% {
    transform: translate(476px, 166px);

  }

  66.67% {
    transform: translate(444px, 193px);

  }

  72.22% {
    transform: translate(412px, 166px);

  }

  77.78% {
    transform: translate(380px, 166px);

  }

  83.33% {
    transform: translate(348px, 193px);

  }

  88.89% {
    transform: translate(316px, 193px);

  }

  94.44% {
    transform: translate(284px, 193px);

  }

  100% {
    transform: translate(252px, 166px);
  }

  0% {
    opacity: 0;
  }

  15% {
    opacity: 1;
  }

  85% {
    opacity: 1;
  }

  /*100% {*/
  /*  opacity: 0;*/
  /*}*/
}

.particle {
  position: absolute;
  opacity: 0;
  overflow: visible;
  background-size: contain;
}

.elem1 {
  left: 92px;
  top: 58px;
  animation: animation1 linear 16s infinite;
}

.elem2 {
  left: 188px;
  top: 193px;
  animation: animation2 linear 17s infinite;
}

.elem3 {
  left: -36px;
  top: 85px;
  animation: animation3 linear 16s infinite;
}

.elem4 {
  left: 50px;
  animation: animation4 linear 16s infinite;
}

.anim-delay1 {
  animation-delay: 1s;
}

.anim-delay2 {
  animation-delay: 2s;
}

.anim-delay3 {
  animation-delay: 3s;
}