.spider-container {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
  }
  .spider {
    position: absolute;
    top: -100px;
    margin-left: -20px;
    pointer-events: none;
    z-index: -1;
  }

  .spider-left {
    left: 5%;
    animation: spiderLeft 5s ease-in-out forwards;
  }
  .spider-right {
    left: 97%;
    animation: spiderRight 5s ease-in-out forwards;
  }

  .spider::after {
    background: rgba(255,120,0,0.2);
    content:"";
    position: absolute;
    top: -1000px;
    left: 50%;
    margin-left: 4px;
    width: 1px;
    height: 1000px;
  }

  .spider::before {
    background: #ff7800;
    border-radius: 100%;
    color: #fff;
    font-size: .9em;
    content:"...";
    position: absolute;
    margin-top: -2px;
    margin-left: -3px;
    width: 16px;
    height: 16px;
    text-align: center;
  }

  .spider-inner-left {
    position: absolute;
  }

  .spider-inner-right {
    position: absolute;
    transform: rotateY(180deg);
  }

  .uno,
  .dos,
  .tres,
  .cuatro {
    background: rgba(255,120,0,0.5);
    position: relative;
    width: 10px;
    height: 3px;
  }

  .uno > .uno,
  .dos > .dos,
  .tres > .tres,
  .cuatro > .cuatro {
    transform-origin: 10px top;
    transform: rotate(-80deg) translateX(10px);
    animation: seg 2.5s ease infinite;
  }

  .uno > .uno > .uno,
  .dos > .dos > .dos,
  .tres > .tres > .tres,
  .cuatro > .cuatro > .cuatro {
    transform-origin: 10px top;
    transform: rotate(10deg) translateX(10px);
    animation: seg 1.5s ease infinite;
  }

  .spider-inner-right > .dos > .dos {
    animation-delay: 200ms;
  }

  .dos > .dos {
    animation-delay: 400ms;
  }

  .dos > .dos > .dos {
    animation-delay: 200ms;
  }

  .spider-inner-right >.tres > .tres {
    animation-delay: 400ms;
  }

  .tres > .tres {
    animation-delay: 600ms;
  }

  .tres > .tres > .tres {
    animation-delay: 300ms;
  }

  .spider-inner-right > .cuatro > .cuatro {
    animation-delay: 100ms;
  }

  .cuatro > .cuatro {
    animation-delay: 800ms;
  }

  .cuatro > .cuatro > .cuatro {
    animation-delay: 400ms;
  }

  @keyframes seg {
    50% {
      transform: rotate(55deg) translateX(10px);
    }
  }

  @keyframes spiderLeft {
    100% {
      top: -200px;
    }
  }

  @keyframes spiderRight {
    100% {
      top: -800px;
    }
  }