/* You can delete those if you want. I just found them very helpful */
* {
	box-sizing: border-box;
}

body {
	margin: 0;
}

html,
body {
	/* Required for Firefox so the contents aren't cut off if they don't have a fixed size */
	height: 100%;
	height: 100vh;
}

.adapter-container {
	height: 100%;
	width: 100%;
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: auto;
}

#map {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
	text-align: center;
}
#map > svg {
	display: inline-block;
	height: 100%;
}

/* Add your styles here */
.node path {
	stroke: black;
	fill: grey;
}
.chord {
	fill-opacity: 0.8;
	stroke: black;
	stroke-opacity: 0.15;
}
.node-id {
	font-family: Arial;
	font-size: 18px;
}
.node-name {
	font-family: Arial;
	font-size: 11px;
	max-width: 100px;
}
text.controller {
	fill: #696969;
}
text.connected {
	fill: #699669;
}
text.disconnected {
	fill: #c90f0f;
	font-weight: bold;
}