body {
	padding: 5%;
	font-family: Helvetica,sans-serif;
	background-color: lightblue;
}

#container {
	display: flex;
	justify-content: center;
}

.device {
	border: 2px solid darkgray;
	border-radius: 0.5em;
	padding: 3em;
	margin: 3em;
	display: flex;
	flex-direction: column;
	align-items: center;
	background-color: whitesmoke;
}


.ip_address {
	font-size: 0.8em;
	color: darkgray;
	margin: 0.2em;
}

.sub_devices {
	display: flex;
}

.sub_device {
	border: 2px solid darkgray;
	border-radius: 0.5em;
	padding: 1em;
	margin: 1em;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.outlet_image {
	width: 5em;
	height: 5em;
}

path {
	cursor: pointer;
}

.on {
	stroke: red;
}

.off {
	stroke: black;
}

@font-face {
	font-family: FontAwesome;
	src: url("/static/fontawesome-webfont.woff2");
}

.edit, .save {
	font-family: FontAwesome;
	font-size: 0.8em;
	color: dimgrey;
}

.edit:hover, .save:hover {
	color: red;
	cursor: pointer;
}