Mapa Proceso v0.1

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="Content-type" content="text/html; charset=UTF-8">
		<title>Mapa de Actores y Proyectos en Territorio</title>

.node text {
  			pointer-events: none;
  			text-shadow: 0 1px 0 #fff;
				font-family: 'Poppins', sans-serif;
				fill: black;
			}

.link {
  			fill: none;
  			stroke-opacity: .8;
			}}

.text{
				font-family: 'Poppins', sans-serif;
				fill: black;
			}

.tooltip {
  			position: absolute;
  			background-color: #fafafa;
				font-family: 'Poppins', sans-serif;
  			font-size: 11px;
				width: 100px;
  			height: 250px;
  			padding-left: 10px;
				padding-right: 10px;
  			z-index: 99;
			}

.d3-tip {
				width: 250px;
  			height: 170px;
  			line-height: 1.4;
				font-family: 'Poppins', sans-serif;
				font-size: 13px;
				color: #000;
				padding: 7px;
  			background: rgba(255, 255, 255, .9);
				box-shadow: 1px 1px 4px #848484;
  			border-radius: 3px;
				z-index: 99;
			}

/* Creates a small triangle extender for the tooltip */
			.d3-tip:after {
			  box-sizing: border-box;
			  display: inline;
			  font-size: 10px;
			  width: 100%;
			  line-height: 1;
			  color: rgba(255, 255, 255, 1);
			  position: absolute;
			  pointer-events: none;
			}

/* Westward tooltips */
			.d3-tip.w:after {
  			content: "\25B6";
  			margin: -4px 0 0 -1px;
  			top: 50%;
  			left: 100%;
			}

br {
  			display: block;
   			margin: 5px 0;
			}

.tooltip {
				position: absolute;
				background-color: #fafafa;
				font-family: 'Varela Round', sans-serif;
				width: 300px;
				height: 300px;
				padding-left: 10px;
				border-radius: 2px;
			}

.convenciones{
				position: absolute;
				z-index: 99;
			}

html, body {
            height: 100%;
            width: 100%;
        }
		</style>
	</head>
	<body>
		<script src="casita_proceso_3.js"></script>
	</body>
</html>

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