.svg-fix {
  position: absolute;
  top: 100px;
  left: 0;
  width: 100%;
  height: auto;
}
.svg-container {
  width: 100%;
  height: 0;
  padding-top: 16.6666667%;
  position: relative;
}
.svg-container > svg {
  position: absolute;
  top: 0;
  left: 0;
  transform: translateZ(0);
}




.path-animated {
  stroke-dasharray: 3840;
  stroke-dashoffset: 3840;
  transition: stroke-dashoffset 3s ease;

}

.fp-completely .path-animated {
  stroke-dashoffset: 0;
  /*animation: path-reveal 2s ease;*/
}

@keyframes path-reveal {
  from {
    stroke-dashoffset: 3840;
  }
  to {
    stroke-dashoffset: 0;
  }
}

#travel-path-mask {
  stroke-dasharray: 40px;
}




#buggy {
  -webkit-transform: scale(1) translateY(-21.75%) rotate(63deg) translateZ(0);
  transform: scale(1) translateY(-21.75%) rotate(63deg) translateZ(0);
  -webkit-offset-path: path('M200,300 Q1920,50 2400,300 T3640,300');
  offset-path: path('M200,300 Q1920,50 2400,300 T3640,300');
  -webkit-offset-distance: 0;
  offset-distance: 0;
  opacity: 0;
  display: block;
}

.fp-completely #buggy {
  opacity: 1;
  offset-distance: 3840px;
  -webkit-animation: bug-animate 3s ease;
  animation: bug-animate 3s ease;
}


@-webkit-keyframes bug-animate {
  from {
    offset-distance: 0;
  }
  to {
    offset-distance: 3840px;
  }
}

@keyframes bug-animate {
  from {
    offset-distance: 0;
  }
  to {
    offset-distance: 3840px;
  }
}