.pedigree,
.pedigree ul,
.pedigree li {
	list-style: none;
	padding: 0;
}

.pedigree {
	display: flex;
	width: 100%;
	min-height: 350px;
}

.generation {
	flex-grow: 1;
	list-style: none;
}

.children {
	display: flex;
	width: 100%;
	height: 100%;
	flex-direction: column;
	justify-content: space-around;
}

.children > li {
	padding: 1rem;
}

.connector {
	width: 3%;
}

.connector ul {
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	height: 100%;
}

.connector li {
	margin: 0 auto;
	width: 60%;
	border: 1px dashed #999;
	border-right: 0;
}

:nth-child(1 of li.connector) li {
	height: 50%;
}

:nth-child(2 of li.connector) li {
	height: 25%;
}

:nth-child(3 of li.connector) li {
	height: 12.5%;
  }