@charset "utf-8";
/* CSS Document */

.mapTooltip {
	position:fixed;
	background-color : #fff;
	moz-opacity:0.80;
	opacity: 0.80;
	filter:alpha(opacity=80);
	border-radius:4px;
	padding : 10px;
	z-index: 1000;
	max-width: 200px;
	display:none;
	color:#232323;
}

.cityFrance {
	background-color:#343434;
	border-radius:10px;
	width:400px;
}

.mapLegend {
}




.container5{ padding:0 0px 10px!important;}
.knobContainer {
	text-align:center;
	margin:10px;
}

.knobContainer canvas {
	cursor:pointer;
}

.rightPanel {
	background-color:#f2c811;
	float:right;
	width: 29%;
	border-radius: 4px;
}

.rightPanel text {
	font-size: 11px !important;
}

.rightPanel h2{
	font-size: 11px;
	margin: 0;
	padding: 5px;
	color: #ffffff;
	text-transform: uppercase;
}
.map {
	width: 70%;
	height: 400px;
	float:left;
	overflow:hidden;
	position:relative;
	background-color:#ffffff;
}

.zoomIn, .zoomOut {
	background-color:#f2c811;
	border:1px solid #f2c811;
	color:#FFF;
	width: 21px;
	height: 22px;
	line-height: 21px;
	text-align:center;
	cursor:pointer;
	position:absolute;
	top : 10px;
	font-weight:bold;
	left : 10px;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
	border-radius: 50px;
}

.zoomOut {
	top:35px;
}

.rightPanel .updated {
	display: none;
}
.areaLegend text , .plotLegend text{ fill:#ffffff; }

@media (max-width: 719px){
	.rightPanel{ width:100%;}
	.map{ width:100%;}
}