/* @override https://www.tantalustrailway.org/dofaw/trailmap.css */

html, body, #map {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}

#slider1 {
	position: absolute;
	top: 7px;
	right: 10px;
}

#slider2 {
	position: absolute;
	top: 32px;
	right: 10px;
}

#slider3 {
	position: absolute;
	top: 57px;
	right: 10px;
}

#slider4 {
	position: absolute;
	top: 57px;
	right: 10px;
}

#slider5 {
	position: absolute;
	top: 107px;
	right: 10px;
}
#slider6 {
	position: absolute;
	top: 132px;
	right: 10px;
}
#slider7 {
	position: absolute;
	top: 157px;
	right: 10px;
}
#slider8 {
	position: absolute;
	top: 182px;
	right: 10px;
}
#slider9 {
	position: absolute;
	top: 83px;
	right: 10px;
}
#slider10 {
	position: absolute;
	top: 133px;
	right: 10px;
}
#slider11 {
	position: absolute;
	top: 107px;
	right: 10px;
}
#hiderlabel1 {
	font-size: 16px;
	position: absolute;
	top: 12px;
	right: 48px;
	background-color: white;
	color: black;
	z-index: 2000;
}

#sliderlabel1 {
	position: absolute;
	top: 5px;
	right: 150px;
}

#sliderlabel2 {
	position: absolute;
	top: 30px;
	right: 150px;
}

#sliderlabel3 {
	position: absolute;
	top: 55px;
	right: 150px;
}

#sliderlabel4 {
	position: absolute;
	top: 55px;
	right: 150px;
}

#sliderlabel5 {
	position: absolute;
	top: 105px;
	right: 150px;
}
#sliderlabel6 {
	position: absolute;
	top: 130px;
	right: 150px;
}
#sliderlabel7 {
	position: absolute;
	top: 155px;
	right: 150px;
}
#sliderlabel8 {
	position: absolute;
	top: 180px;
	right: 150px;
}
#sliderlabel9 {
	position: absolute;
	top: 80px;
	right: 150px;
}
#sliderlabel10 {
	position: absolute;
	top: 132px;
	right: 130px;
	left: 40px;
}
#sliderlabel11 {
	position: absolute;
	top: 105px;
	right: 150px;
}
div#controlboxtb {
	background-color: rgba(254, 255, 255, 0.811082);
	width: 300px;
	height: 240px;
	position: absolute;
	top: 46px;
	right: 10px;
	font-size: 12px;
	margin: 0;
	border: 1px solid #000;
	z-index: 1000;
	opacity: 90;
}
div#instructions{
	padding: 5px;
	
}
div#hider{
	position: relative;
	
}

.slider {
	-webkit-appearance: none;
	/* Override default CSS styles */
	appearance: none;
	/*     width: 100%; /* Full-width */
	*/ height: 17px;
	/* Specified height */
	background: #d3d3d3;
border: 1px solid black;

	/* Grey background */
	outline: none;
	/* Remove outline */
	opacity: 0.7;
	/* Set transparency (for mouse-over effects on hover) */
	-webkit-transition: .2s;
	/* 0.2 seconds transition on hover */
	transition: opacity .2s;
}

/* Mouse-over effects */

.slider:hover {
	opacity: 1;
	/* Fully shown on mouse-over */
}

/* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */

.slider::-webkit-slider-thumb {
	-webkit-appearance: none;
	/* Override default look */
	appearance: none;
	width: 25px;
	/* Set a specific slider handle width */
	height: 18px;
	/* Slider handle height */
	background: #4CAF50;
	/* Green background */
	cursor: pointer;
	/* Cursor on hover */
}

.slider::-moz-range-thumb {
	width: 25px;
	/* Set a specific slider handle width */
	height: 17px;
	/* Slider handle height */
	background: #4CAF50;
	/* Green background */
	cursor: pointer;
	/* Cursor on hover */
}