my website front svg

<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://d3js.org/d3.v4.min.js"></script>
  <style>
    body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; }
  
    .svg-class {
      fill:none; 
      stroke: #000; 
      stroke-width:4px
    }
  	.path1 {
      stroke-dashoffset:200;
      stroke-dasharray:10;
      -webkit-animation: draw 3s linear infinite;
      -moz-animation: draw 3s linear infinite;
      animation: draw 3s linear infinite;
      fill-opacity: 0;
    }
    
    .path {
      stroke-dashoffset:200;
      stroke-dasharray:10;
      fill-opacity: 0;
    }
    
    .path2 {
      -webkit-animation: draw 6s linear infinite;
      -moz-animation: draw 6s linear infinite;
      animation: draw 6s linear infinite;
    }
    
    .path3 {
      -webkit-animation: draw 10s linear infinite;
      -moz-animation: draw 10s linear infinite;
      animation: draw 10s linear infinite;
    }
    
    .path4 {
      -webkit-animation: draw 14s linear infinite;
      -moz-animation: draw 14s linear infinite;
      animation: draw 14s linear infinite;
    }
    
    @-webkit-keyframes draw {
      30%{stroke-dashoffset:0; fill-opacity: 0;}
      50%{fill-opacity:1;}	
      100%{stroke-dashoffset:0; fill-opacity:1;}	
    }
  </style>
</head>

https://d3js.org/d3.v4.min.js