.family-input {
	background-color: hsl(216, 30%, 70%);
	border-color: hsl(216, 26.400000000000002%, 42%);
}
.family-input.selected {
	box-shadow: inset 0px 0px 10px hsl(216, 46.8%, 94%), 0px 2px 4px hsl(216, 22.799999999999997%, 13.999999999999996%);
	background-color: hsl(216, 27.3%, 48.99999999999999%);
	border-color: hsl(216, 25.5%, 35%);
}

.family-event {
	background-color: hsl(36, 70%, 70%);
	border-color: hsl(36, 61.6%, 42%);
}
.family-event.selected {
	box-shadow: inset 0px 0px 10px hsl(36, 77.19999999999999%, 94%), 0px 2px 4px hsl(36, 53.19999999999999%, 13.999999999999996%);
	background-color: hsl(36, 63.7%, 48.99999999999999%);
	border-color: hsl(36, 59.5%, 35%);
}

.family-state {
	background-color: hsl(21.599999999999998, 70%, 70%);
	border-color: hsl(21.599999999999998, 61.6%, 42%);
}
.family-state.selected {
	box-shadow: inset 0px 0px 10px hsl(21.599999999999998, 77.19999999999999%, 94%), 0px 2px 4px hsl(21.599999999999998, 53.19999999999999%, 13.999999999999996%);
	background-color: hsl(21.599999999999998, 63.7%, 48.99999999999999%);
	border-color: hsl(21.599999999999998, 59.5%, 35%);
}

.family-wave {
	background-color: hsl(216, 10%, 80%);
	border-color: hsl(216, 8.8%, 48%);
}
.family-wave.selected {
	box-shadow: inset 0px 0px 10px hsl(216, 31.6%, 96%), 0px 2px 4px hsl(216, 7.600000000000001%, 15.999999999999998%);
	background-color: hsl(216, 9.100000000000001%, 55.99999999999999%);
	border-color: hsl(216, 8.5%, 40%);
}

.family-image {
	background-color: hsl(50.400000000000006, 80%, 70%);
	border-color: hsl(50.400000000000006, 70.4%, 42%);
}
.family-image.selected {
	box-shadow: inset 0px 0px 10px hsl(50.400000000000006, 84.80000000000001%, 94%), 0px 2px 4px hsl(50.400000000000006, 60.80000000000001%, 13.999999999999996%);
	background-color: hsl(50.400000000000006, 72.80000000000001%, 48.99999999999999%);
	border-color: hsl(50.400000000000006, 68%, 35%);
}

.family-vector {
	background-color: hsl(194.4, 70%, 70%);
	border-color: hsl(194.4, 61.6%, 42%);
}
.family-vector.selected {
	box-shadow: inset 0px 0px 10px hsl(194.4, 77.19999999999999%, 94%), 0px 2px 4px hsl(194.4, 53.19999999999999%, 13.999999999999996%);
	background-color: hsl(194.4, 63.7%, 48.99999999999999%);
	border-color: hsl(194.4, 59.5%, 35%);
}

.family-three {
	background-color: hsl(338.4, 30%, 50%);
	border-color: hsl(338.4, 26.400000000000002%, 30%);
}
.family-three.selected {
	box-shadow: inset 0px 0px 10px hsl(338.4, 46.8%, 90%), 0px 2px 4px hsl(338.4, 22.799999999999997%, 9.999999999999998%);
	background-color: hsl(338.4, 27.3%, 35%);
	border-color: hsl(338.4, 25.5%, 25%);
}

.family-geo {
	background-color: hsl(198.00000000000003, 40%, 50%);
	border-color: hsl(198.00000000000003, 35.2%, 30%);
}
.family-geo.selected {
	box-shadow: inset 0px 0px 10px hsl(198.00000000000003, 54.400000000000006%, 90%), 0px 2px 4px hsl(198.00000000000003, 30.400000000000006%, 9.999999999999998%);
	background-color: hsl(198.00000000000003, 36.400000000000006%, 35%);
	border-color: hsl(198.00000000000003, 34%, 25%);
}

.family-shape {
	background-color: hsl(288, 20%, 50%);
	border-color: hsl(288, 17.6%, 30%);
}
.family-shape.selected {
	box-shadow: inset 0px 0px 10px hsl(288, 39.2%, 90%), 0px 2px 4px hsl(288, 15.200000000000003%, 9.999999999999998%);
	background-color: hsl(288, 18.200000000000003%, 35%);
	border-color: hsl(288, 17%, 25%);
}

.family-text {
	background-color: hsl(154.8, 70%, 70%);
	border-color: hsl(154.8, 61.6%, 42%);
}
.family-text.selected {
	box-shadow: inset 0px 0px 10px hsl(154.8, 77.19999999999999%, 94%), 0px 2px 4px hsl(154.8, 53.19999999999999%, 13.999999999999996%);
	background-color: hsl(154.8, 63.7%, 48.99999999999999%);
	border-color: hsl(154.8, 59.5%, 35%);
}

.family-color {
	background-color: hsl(104.39999999999999, 60%, 70%);
	border-color: hsl(104.39999999999999, 52.800000000000004%, 42%);
}
.family-color.selected {
	box-shadow: inset 0px 0px 10px hsl(104.39999999999999, 69.6%, 94%), 0px 2px 4px hsl(104.39999999999999, 45.599999999999994%, 13.999999999999996%);
	background-color: hsl(104.39999999999999, 54.6%, 48.99999999999999%);
	border-color: hsl(104.39999999999999, 51%, 35%);
}
.tile-person {
	background-image: url('img/articons_person.png');
}

.tile-content {
	background-image: url('img/articons_content.png');
}

.tile-sensor {
	background-image: url('img/articons_sensor.png');
}

.tile-value {
	background-image: url('img/articons_value.png');
}

.tile-waveform {
	background-image: url('img/articons_waveform.png');
}

.tile-event {
	background-image: url('img/articons_event.png');
}

.tile-state {
	background-image: url('img/articons_state.png');
}

.tile-geolocation {
	background-image: url('img/articons_geolocation.png');
}

.tile-shape {
	background-image: url('img/articons_shape.png');
}

.tile-graph {
	background-image: url('img/articons_graph.png');
}

.tile-curve {
	background-image: url('img/articons_curve.png');
}

.tile-particle {
	background-image: url('img/articons_particle.png');
}

.tile-vector {
	background-image: url('img/articons_vector.png');
}

.tile-text {
	background-image: url('img/articons_text.png');
}

.tile-trimesh {
	background-image: url('img/articons_trimesh.png');
}

.tile-voxel {
	background-image: url('img/articons_voxel.png');
}

.tile-color {
	background-image: url('img/articons_color.png');
}

.tile-depthmap {
	background-image: url('img/articons_depthmap.png');
}

.tile-image {
	background-image: url('img/articons_image.png');
}