/* ========================================================= */
/* General Styles  */

html,
body,
#main,
#main>div,
#map {
	height: 100%;
	width: 100%;
}

body {
	font-family: 'Raleway', Helvetica, Arial, sans-serif;
	font-size: 14px;
	line-height: 120%;
	padding: 0;
	margin: 0;
}

/* ========================================================= */
/* Search */

#Search {
	position: fixed;
	top: 0;
	width: 100%;
	padding: 11px 10px 11px 60px;
	background: rgba(255, 255, 255, .8);
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, .2);
	transition: all 0.5s ease-out;
	z-index: 1984;
}

#Search .form-group {
	margin: 0;
}

#Search a {
	float: right;
	margin: 9px 0 0 12px;
	display: block;
}

#Search a span {
	display: none;
}

@media (min-width: 768px) {

	#Search a span {
		display: inline;
	}

}

@media (min-width: 980px) {
	#Search {
		padding-left: 362px;
	}

	.toggled #Search {
		padding-left: 60px;
	}

}

/* ========================================================= */
/* Sidebar */

/* DISCLAIMER:
	- On mobile (default view), the sidebar is closed by default.
	- It can be opened on click. The "open" class is applied via JS.

	- On desktop, the sidebar is open by default.
	- It can be closed on click.
	- In this case, "closed" means collapsed to only show icons.
	- The JS functionality never changes, so the "open" class will be applied when the menu is actually closed and removed when it's open.
	- This is confusing, I know, but that's what happens when you want opposite behavior on mobile vs desktop.
	*/

	#sidebar-container {
		overflow-y: scroll;
		max-height: 100vh;
		-ms-overflow-style: none;
		overflow-y: -moz-scrollbars-none;
	}

	#sidebar-container::-webkit-scrollbar {
		display: none;
	}

	#sidebar {
		position: fixed;
		top: 0;
		left: 0;
		width: 50px;
		height: 56px;
		margin: 0;
		border-right: 1px solid #ddd;
		background: #ffffff;
		height: 100%;
		z-index: 2112;
	}

	.toggled #sidebar {
		width: 100%;
		height: 100%;
		border: 0;
		overflow-y: auto;
	}

	#sidebar ul {
		list-style: none;
		padding: 0;
		margin: 0;
	}

	#sidebar li {
		color: #fff;
		white-space: nowrap;
	}

	#sidebar .logo {
		white-space: nowrap;
		background: #fff;
	}

	#sidebar .title {
		position: relative;
		font-size: 16px;
		font-weight: 700;
		padding: 8px 10px 8px 0;
		background: #294277;
		border-bottom: 1px solid #fff;
		cursor: default;
	}

	#sidebar legend.title {
		margin-bottom: 0px;
		color: white;
	}

	.toggle {
		position: absolute;
		right: 10px;
		padding: 0;
		margin-top: 1px;
		background: transparent;
		border: 0;
		outline: none;
		display: none;
	}

	.toggled #sidebar .toggle {
		display: inline;
	}

	#sidebar a {
		position: relative;
		color: #294251;
		text-decoration: none;
		padding: 8px 0;
		border-bottom: 1px solid rgba(249, 162, 93, 0.9);
		display: block;
		cursor: pointer;
	}

	#sidebar .logo a {
		color: #717174;
		display: inline-block;
		border: 0;
	}

	#sidebar .selected {
		background: #ec9550;
	}

	#sidebar a:hover {
		background: rgba(0,0,0,.05);
	}

	#sidebar .logo a:hover {
		background: #fff;
	}

	#sidebar i {
		text-align: center;
		width: 48px;
	}

	#sidebar a i {
		color: #D63554;
	}

	#sidebar .toggle i {
		width: auto;
	}

	#sidebar .selected span:after {
		content: "\f00c";
		position: absolute;
		right: 10px;
		font: normal normal normal 14px/1 FontAwesome;
		font-size: inherit;
		text-rendering: auto;
		-webkit-font-smoothing: antialiased;
		display: none;
	}

	.toggled #sidebar .selected span:after {
		display: inline-block;
	}

	ul.data-contributors li {
		padding: 4px 0 3px;
		background: #ffffff;
		border-bottom: 1px solid rgba(249, 162, 93, 0.9);
	}

	ul.data-contributors li label {
		padding-left: 19px;
		font-weight: normal;
		cursor: pointer;
		color: #294277;
	}

	ul.data-contributors li label input {
		margin-right: 18px;
	}

	fieldset.data-contributors div {
		padding: 4px 0 3px;
		background: #ffffff;
		border-bottom: 1px solid rgba(249, 162, 93, 0.9);
	}

	fieldset.data-contributors div label {
		padding-left: 19px;
		font-weight: normal;
		cursor: pointer;
		color: #294277;
	}

	fieldset.data-contributors div label input {
		margin-right: 18px;
	}

	@media (max-width: 480px) {
		#sidebar a {
			font-size: 13px;
		}
	}

	@media (orientation: landscape) and (max-width: 979px) {
		.toggled #sidebar li {
			float: left;
			width: 50%;
		}

		.toggled #sidebar .logo,
		.toggled #sidebar .title {
			float: none;
			width: 100%;
			clear: left;
		}
	}

	@media (min-width: 980px) {

		#sidebar {
			width: 350px;
			height: auto;
			border: 0;
			box-shadow: 0 0 10px 0 rgba(0, 0, 0, .2);
			transition: all 0.5s ease-out;
		}

		.toggled #sidebar {
			width: 50px;
			height: auto;
			overflow: hidden;
		}

		.toggled #sidebar .toggle {
			display: none;
		}

		#sidebar .toggle {
			display: inline;
		}

		#sidebar .selected span:after {
			display: inline-block;
		}

		.toggled #sidebar .selected span:after {
			display: none;
		}
	}

	/* ========================================================= */
	/* Legend */
	#legend {
		width: auto;
		border-top: 1px solid rgba(255, 255, 255, 0.25);
		white-space: nowrap;
		background: white;
		margin-top: 10px;
		color: black;
		padding: 10px 20px;
		height: 90px;
		position: relative;
	}

	#legend .marker {
		position: absolute;
		left: 25px;
		top: 35px;
		filter: drop-shadow(1px 1px 0 yellow) drop-shadow(-1px 1px 0 yellow) drop-shadow(3px -2px 0 yellow) drop-shadow(-3px -2px 0 yellow);
		-webkit-filter: drop-shadow(1px 1px 0 yellow) drop-shadow(-1px 1px 0 yellow) drop-shadow(3px -2px 0 yellow) drop-shadow(-3px -2px 0 yellow);
	}

	#legend p {
		margin-left: 55px;
		margin-top: 20px;
	}

	/* ========================================================= */
	/* Disclaimer */

	#Disclaimer {
		position: fixed;
		bottom: 0;
		font-size: 12px;
		line-height: 140%;
		color: #333;
		width: 100%;
		padding: 5px;
		background: #fff;
		box-shadow: 0 0 10px 0 rgba(0, 0, 0, .2);
		transition: all 0.5s ease-out;
		z-index: 1977;
	}

	@media (min-width: 980px) {

		#Disclaimer {
			font-size: 14px;
			line-height: 140%;
			left: 25%;
			padding: 10px;
			width: 50%;
			border-radius: 5px 5px 0 0;
		}

	}

	/* ========================================================= */
	/* Map */

	.leaflet-container {
		font-family: 'Raleway', Helvetica, Arial, sans-serif;
		font-size: 14px;
		line-height: 120%;
	}

	.leaflet-popup-content {
		font-size: 13px;
	}

	.leaflet-right .leaflet-control.leaflet-control-zoom {
		margin-top: 66px;
	}

	.leaflet-container a {
		color: #6B489D;
	}

	.CNY {
		background-color: #f9a25d;
	}

	/* hide the shadow of markers when you are zoomed out past 8 */

	.z1 div.svg-icon,
	.z2 div.svg-icon,
	.z3 div.svg-icon,
	.z4 div.svg-icon,
	.z5 div.svg-icon,
	.z6 div.svg-icon,
	.z7 div.svg-icon {
		display: none;
	}

	/* force the highPoint little circle the markers when you are zoomed out 8 */
	.z1 div.highPointMarker,
	.z2 div.highPointMarker,
	.z3 div.highPointMarker,
	.z4 div.highPointMarker,
	.z5 div.highPointMarker,
	.z6 div.highPointMarker,
	.z7 div.highPointMarker {
		display: inline-block;
	}

	/* hide the little circle div markers when you are zoomed in past 8 */
	.z16 .highPointMarker,
	.z15 .highPointMarker,
	.z14 .highPointMarker,
	.z13 .highPointMarker,
	.z12 .highPointMarker,
	.z11 .highPointMarker,
	.z10 .highPointMarker,
	.z9 .highPointMarker,
	.z8 .highPointMarker {
		display: none;
	}

	.highPointMarker {
		width: 1px;
		height: 1px;
		-moz-border-radius: 50%;
		-webkit-border-radius: 50%;
		border-radius: 50%;
		background: #FFA500;
		border-color: #CF5A24;
	}

	.z16 svg.leaflet-zoom-animated g path,
	.z15 svg.leaflet-zoom-animated g path,
	.z14 svg.leaflet-zoom-animated g path,
	.z13 svg.leaflet-zoom-animated g path,
	.z12 svg.leaflet-zoom-animated g path,
	.z11 svg.leaflet-zoom-animated g path {
		display: none;
	}

	.svg-icon.glow {
		filter: drop-shadow(1px 1px 0 yellow) drop-shadow(-1px 1px 0 yellow) drop-shadow(3px -2px 0 yellow) drop-shadow(-3px -2px 0 yellow);
		-webkit-filter: drop-shadow(1px 1px 0 yellow) drop-shadow(-1px 1px 0 yellow) drop-shadow(3px -2px 0 yellow) drop-shadow(-3px -2px 0 yellow);
	}

	.svg-icon.ie-glow:before {
		content: "";
		position: absolute;
		width: 30px;
		height: 41px;
		background: url(../png/ie-glow5e1f.png?v=2) 0 0 no-repeat;
		right: -3px;
		top: -3px;
	}

	.svg-icon.ie-glow.ie-legend {
		right: -7px;
		top: -11px;
	}

	.prunecluster-large {
		background-color: rgba(243, 167, 96, 0.6);
	}

	.prunecluster-large div {
		background-color: rgba(240, 159, 84, 0.6);
		color: white;
	}

	.prunecluster-medium {
		background-color: rgba(9, 151, 187, 0.6);
	}

	.prunecluster-medium div {
		background-color: rgba(7, 140, 173, 0.6);
		color: white;
	}

	.prunecluster-small {
		background-color: rgba(125, 126, 129, 0.8);
	}

	.prunecluster-small div {
		background-color: rgba(105, 106, 110, 0.6);
		color: white;
	}

	.dot-icon {
		width: 9px;
		height: 9px;
		border-radius: 50%;
	}

	.dot-icon.blue {
		background-color: #294277;
		border: 1px solid #6281c1;
	}

	.dot-icon.orange {
		background-color: rgba(243, 167, 96, 1);
		border: 1px solid rgb(221, 151, 86);
	}

	.dot-icon.grey {
		background-color: rgba(125, 126, 129, 1);
		border: 1px solid rgb(106, 106, 109);
	}

	/* ========================================================= */
	/* List */

	#Content {
		padding: 66px 10px 10px 10px;
		transition: all 0.5s ease-out;
	}

	@media (min-width: 980px) {
		#Content {
			padding-left: 362px;
		}

		.toggled #Search,
		.toggled #Content {
			padding-left: 60px;
		}

	}

	@media screen and (max-width: 980px) {

		.table,
		.table tbody,
		.table tr,
		.table td {
			display: block;
		}

		.table thead {
			display: none;
		}

		.table td {
			position: relative;
			padding-left: 35% !important;
			min-height: 31px;
		}

		.table td:before {
			content: attr(data-title);
			position: absolute;
			left: 0;
			font-weight: bold;
			white-space: nowrap;
			padding: 0 10px;
			width: 35%;
		}

	}

	@media screen and (max-width: 479px) {

		.table td {
			padding-left: 10px !important;
		}

		.table td:before {
			position: static;
			padding: 0 0 3px 0;
			width: auto;
			display: block;
		}

	}

	a {
		color: #294277;
		text-decoration: none;
	}

	a:focus,
	a:hover {
		color: #006363;
	}