.timeline-control {
	min-width: 50vw;
	background: #282a30bf;
	color: #ffffff;
	min-height: 130px;
	border-radius: 8px;

	ol, li {
		margin: 0;
		padding: 0;
		/*color: #fff;*/
		font-size: 13px;
		/*z-index: 3;*/
	}

	ol {
		display: flex;
		width: 100%;
		justify-content: space-between;
		position: relative;
		align-items: center;
	}

	ol:after {
		content: '';
		display: block;
		width: 100%;
		height: 8px;
		background-color: #ffffff;
		position: absolute;
		top: 50%;
		/*left: 0;*/
		border-radius: 5px;
		transform: translate(0, -50%);
		z-index: -1;
	}

	li {
		list-style-type: none;
		position: relative;
		cursor: pointer;
	}

	li:after {
		content: '';
		display: block;
		width: 12px;
		height: 12px;
		border-radius: 50%;
		background: #009D9A;
		border: 2px solid #009D9A;
		transition: background-color 0.2s ease;
	}

	li:hover:after {
		background-color: #528787;
	}

	li.active:after {
		background: #FFA000;
		border: 2px solid #FFA000;
		width: 16px;
		height: 16px;

	}

	span {
		position: absolute;
		top: calc(100% + 20px);
		left: 50%;
		transform: translate(-50%, 0);
		display: inline-block;
		text-align: center;
		text-align: center;
		width: 100px;
	}

	#timeline-control-play, #timeline-control-prev, #timeline-control-next {
		cursor: pointer;
	}

}

.btn.active {
	background: black;
	color: white;
	box-shadow: 20px 20px 60px #bebebe, -20px -20px 60px #ffffff;
	border: 1px solid #bebebe;
}

.btn.active:hover {
	background: black !important;
}

.map {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 100%;
}

.mapboxgl-compare {
	background-color: #fff;
	position: absolute;
	width: 1px !important;
	height: 100%;
	z-index: 1;
}

.mapboxgl-compare .compare-swiper-vertical {
	background-color: #000000a8 !important;
	box-shadow: inset 0 0 0 2px #fff;
	display: inline-block;
	border-radius: 50%;
	position: absolute;
	width: 60px;
	height: 60px;
	top: 50%;
	left: -30px;
	margin: -30px 1px 0;
	color: #fff;
	cursor: ew-resize;
	background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyAgIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIiAgIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyIgICB4bWxuczpzdmc9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgICB4bWxuczpzb2RpcG9kaT0iaHR0cDovL3NvZGlwb2RpLnNvdXJjZWZvcmdlLm5ldC9EVEQvc29kaXBvZGktMC5kdGQiICAgeG1sbnM6aW5rc2NhcGU9Imh0dHA6Ly93d3cuaW5rc2NhcGUub3JnL25hbWVzcGFjZXMvaW5rc2NhcGUiICAgd2lkdGg9IjYwIiAgIGhlaWdodD0iNjAiICAgdmVyc2lvbj0iMS4xIiAgIHZpZXdCb3g9IjAgMCA2MCA2MCIgICBpZD0ic3ZnNTQzNCIgICBpbmtzY2FwZTp2ZXJzaW9uPSIwLjkxK2RldmVsK29zeG1lbnUgcjEyOTExIiAgIHNvZGlwb2RpOmRvY25hbWU9Imwtci5zdmciPiAgPG1ldGFkYXRhICAgICBpZD0ibWV0YWRhdGE1NDQ0Ij4gICAgPHJkZjpSREY+ICAgICAgPGNjOldvcmsgICAgICAgICByZGY6YWJvdXQ9IiI+ICAgICAgICA8ZGM6Zm9ybWF0PmltYWdlL3N2Zyt4bWw8L2RjOmZvcm1hdD4gICAgICAgIDxkYzp0eXBlICAgICAgICAgICByZGY6cmVzb3VyY2U9Imh0dHA6Ly9wdXJsLm9yZy9kYy9kY21pdHlwZS9TdGlsbEltYWdlIiAvPiAgICAgICAgPGRjOnRpdGxlPjwvZGM6dGl0bGU+ICAgICAgPC9jYzpXb3JrPiAgICA8L3JkZjpSREY+ICA8L21ldGFkYXRhPiAgPGRlZnMgICAgIGlkPSJkZWZzNTQ0MiIgLz4gIDxzb2RpcG9kaTpuYW1lZHZpZXcgICAgIHBhZ2Vjb2xvcj0iI2ZmZmZmZiIgICAgIGJvcmRlcmNvbG9yPSIjNjY2NjY2IiAgICAgYm9yZGVyb3BhY2l0eT0iMSIgICAgIG9iamVjdHRvbGVyYW5jZT0iMTAiICAgICBncmlkdG9sZXJhbmNlPSIxMCIgICAgIGd1aWRldG9sZXJhbmNlPSIxMCIgICAgIGlua3NjYXBlOnBhZ2VvcGFjaXR5PSIwIiAgICAgaW5rc2NhcGU6cGFnZXNoYWRvdz0iMiIgICAgIGlua3NjYXBlOndpbmRvdy13aWR0aD0iMTI4NiIgICAgIGlua3NjYXBlOndpbmRvdy1oZWlnaHQ9Ijc1MSIgICAgIGlkPSJuYW1lZHZpZXc1NDQwIiAgICAgc2hvd2dyaWQ9InRydWUiICAgICBpbmtzY2FwZTp6b29tPSI0IiAgICAgaW5rc2NhcGU6Y3g9IjI1Ljg4OTgzMSIgICAgIGlua3NjYXBlOmN5PSIzNC4zODE4MzMiICAgICBpbmtzY2FwZTp3aW5kb3cteD0iMCIgICAgIGlua3NjYXBlOndpbmRvdy15PSIyMyIgICAgIGlua3NjYXBlOndpbmRvdy1tYXhpbWl6ZWQ9IjAiICAgICBpbmtzY2FwZTpjdXJyZW50LWxheWVyPSJzdmc1NDM0IiAgICAgaW5rc2NhcGU6b2JqZWN0LW5vZGVzPSJ0cnVlIiAgICAgaW5rc2NhcGU6c25hcC1zbW9vdGgtbm9kZXM9InRydWUiPiAgICA8aW5rc2NhcGU6Z3JpZCAgICAgICB0eXBlPSJ4eWdyaWQiICAgICAgIGlkPSJncmlkNTk4OSIgLz4gIDwvc29kaXBvZGk6bmFtZWR2aWV3PiAgPHBhdGggICAgIHN0eWxlPSJmaWxsOiNmZmZmZmY7ZmlsbC1ydWxlOmV2ZW5vZGQ7c3Ryb2tlOm5vbmU7c3Ryb2tlLXdpZHRoOjFweDtzdHJva2UtbGluZWNhcDpidXR0O3N0cm9rZS1saW5lam9pbjptaXRlcjtzdHJva2Utb3BhY2l0eToxIiAgICAgZD0iTSAyNSAyNCBMIDE2IDMwIEwgMjUgMzYgTCAyNSAyNCB6IE0gMzUgMjQgTCAzNSAzNiBMIDQ0IDMwIEwgMzUgMjQgeiAiICAgICBpZD0icGF0aDU5OTUiIC8+PC9zdmc+);
}


.rounded-rect {
	background: white;
	border-radius: 10px;
	box-shadow: 0 0 50px -25px black;
}

.flex-center {
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
}

.flex-center.left {
	left: 0px;
}

.flex-center.right {
	right: 0px;
}

.sidebar-content {
	height: 100%;
	/*font-family: Arial, Helvetica, sans-serif;*/
	/*font-size: 32px;*/
	color: #0D0E10;

	.indicator-chart-container {
		background-color: #F7F7F7;
	}

	.absolute-value {
		font-size: 2.3rem;
		font-weight: 500;

	}
}

.sidebar-toggle {
	position: absolute;
	width: 1.3em;
	height: 1.3em;
	overflow: visible;
	display: flex;
	justify-content: center;
	align-items: center;
}

.sidebar-toggle.left {
	right: -1.5em;
}

.sidebar-toggle.right {
	left: -1.5em;
}

.sidebar-toggle:hover {
	color: #0aa1cf;
	cursor: pointer;
}

.overlay-sidebar {
	height: 100%;
	overflow: auto;
	background: #fff;
	min-height: calc(100vh - 9rem);
	max-height: calc(100vh - 9rem);
	bottom: 1rem;
}

.overlay-sidebar::-webkit-scrollbar {
	display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.overlay-sidebar {
	-ms-overflow-style: none; /* IE and Edge */
	scrollbar-width: none; /* Firefox */
}

.indicator-label {
	font-size: 1.1rem;
	font-weight: bold;
}

.indicator-summary {
	font-size: 0.9rem;
}

.absolute-value{
	font-size: 2rem;
	font-weight: 500;
}

.left-indicator-label {
	font-size: 1.2rem;
	font-weight: 400;
}

.left-indicator-summary {
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.6;
	color: #fff;
}

.mapboxgl-ctrl-top-left {
	pointer-events: visibleFill;
}

.mapboxgl-ctrl-logo {
	display: none !important;
}

.mapboxgl-ctrl-attrib{
	display: none;
}