* {
    margin: 0;
    padding: 0;
}

body {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

#graphic {
    width: 100%;
    height: 100%;
    position: absolute;
}

#graphic-nodes g.inner {
    animation: wiggle infinite alternate ease-in-out;
}

#graphic-nodes rect {
    fill: #ffffff;
}

#graphic-edges path {
    stroke: #C0C0C0;
    stroke-width: 4px;
    fill: none;
}
#graphic-packets image {
    offset-distance: 0%;
    opacity: 0;
    animation: moveAlongPath 12s alternate linear infinite;
}

p.copyright {
    position: fixed;
    right: 3px;
    bottom: 2px;
    font-size: 8pt;
    color: #b0b0b0;
}
p.copyright a {
    text-decoration: none;
    color: #b0b0b0;
}

@keyframes wiggle {
  from {
    transform: translate(0px, 0px);
  }
  to {
    transform: translate(20px, 10px);
  }
}

@keyframes fullOffset {
  0% {
    offset-distance: 0%;
  }
  100% {
    offset-distance: 100%;
  }
}

@keyframes moveAlongPath {
  0% {
    offset-distance: 0%;
    opacity: 0;
  }
  20% {
    offset-distance: 0%;
    opacity: 0;
  }
  50% {
    offset-distance: 50%;
    opacity: 1;
  }
  100% {
    offset-distance: 100%;
    opacity: 0;
  }
}