body,html { background: #fff; height:100%; font-family: Helvetica Neue, Helvetica, Arial, sans-serif; padding: 0; margin: 0;}
a { color: #903; }
#map {
	background: #fff;
	width: 75%;
	margin-left: 25%;
	height: 99%;
}
svg path { stroke-linejoin: round }

svg .polygon.bg {
	fill: #ddd;
	stroke: none;
}
svg .polygon.nuts {
	stroke: #000;
	stroke-width:.5px;
	fill: #fff
}
svg .polygon.nuts:hover {
	stroke-width:2px;
}
svg .dotMarker {
	stroke: #330;
	stroke-opacity: .8;
	fill: #ff7;
	fill-opacity: .2;
}
svg .dotMarker:hover {
	stroke: #000;
	fill: #ff3;
	fill-opacity: .7;
}	
svg .graticule {
	stroke: #000;
	fill: none;
	stroke-opacity: .1;
}

#about {
	position: absolute;
	top: 0px;
	left: 0px;
	padding: 20px;
	z-index: 300;
	width: 25%;
	background: #fff
}
#about h1 { font-size:24px; margin-top:0 }	
#about h2 { font-size:14px; margin:25px 0 10px; color: #888; }	
#about p { font-size: 12px; line-height: 17px; }
ul {
	margin: 0;
	padding: 0;
}
ul li { font-size: 12px; list-style: none; padding: 0 0 5px; }
ul#years li {
	cursor: pointer;
	
	padding: 5px 10px 5px 0;
	color: #903;
	text-decoration: underline;
	display: inline;
}
ul#years li.selected {
	color: #000;
	font-weight: bold;
}
ul#proj li.selected a {
	color: #000;
	text-decoration: none;
	font-weight: bold;
}
