body {
	font-family: helvetica, arial, sans-serif;
	font-size: 12px;
	height: 80vh;
}

h1 {
	text-align: center;
}

.bag.grid-sec {
	height: inherit;
}

#series {
	text-align: center;
}

#series-title {
	text-align: center;
}

#select table.slices {
	margin-left:auto; 
	margin-right:auto;
}

#select .slices tr.slice0 {
	background-color: rgb(80, 200, 80);
}

#select .slices tr.slice1 {
	background-color: rgb(180, 255, 130);
}

#select .slices tr.slice2 {
	background-color: rgb(255, 255, 130);
}

#select .slices tr.slice3 {
	background-color: rgb(255, 180, 130);
}

#select .slices tr.slice4 {
	background-color: rgb(255, 130, 130);
}

#select .data th {
	text-align: right;
}

#select .data td {
	color: red;
}

#serie [label] {
	color: red;
}

#serie option {
	color: black;
}

#display {
	height: inherit;
	border: 1px rgb(120, 120, 120);
}

.commune {
	fill: rgb(120, 220, 140);
	stroke: rgb(240, 240, 240);	
	stroke-width: 0.5px;
	stroke-linejoin: round;
	stroke-linecap: round;
}

#map {
	height: inherit;
	/*
	height: 75vw;
	float: right;
	width: 700px;
	height: 630px;
	overflow: auto;
	*/
}

svg {
	height: inherit;
	width: 100%;
	/*
	width: 1200px;
	height: 810px;
	*/
	background-color: beige;
}

.communex {
	pointer-events: none;
}

.paroisse {
	fill: none;
	stroke: white;
	stroke-width: 2px;
	stroke-linejoin: round;
	stroke-linecap: round;
	pointer-events: none;
}

.territoire {
	fill: none;
	stroke: darkgreen;
	stroke-width: 4px;
	stroke-linejoin: round;
	stroke-linecap: round;
	pointer-events: none;
}

.sliceNaN {
	fill: rgb(230, 230, 230);
}

.slice0 {
	fill: rgb(80, 200, 80);
}

.slice1 {
	fill: rgb(180, 255, 130);
}

.slice2 {
	fill: rgb(255, 255, 130);
}

.slice3 {
	fill: rgb(255, 180, 130);
}

.slice4 {
	fill: rgb(255, 130, 130);
}