body
{ 
	font-family:monospace, monospace;	
	// Doubling the monospace definition solves a Firefox issue (if it still exists).
	color:#ffffff; 
	background-color:#000000; 
	overflow:hidden;
}


div.outer_map_container
{
	position:absolute;
	left:0vw;
	top:0vh;
//	width:60.88vw;
//	height:30vw;
	width:100%;
	height:100%;
	border:solid 1px #888888;
	overflow:hidden;
	cursor:crosshair;
}

div.inner_map_container
{
	position:absolute;
	left:0vw;
	top:0vh;
	width:100%;
	height:100%;

	transition:transform 0.5s linear;
	-webkit-transition:transform 0.5s linear;
}

div.zoom_buttons
{
	position:absolute;
	right:0.50vw;
	bottom:0.50vw;
	height:3.0vw;
	width:6.5vw;
	font-size:3.0vw;
	line-height:2.6vw;
	text-align:center;
	color:#1c2a50;
	user-select:none;
}

div.zoom_in_button
{
	position:absolute;
	left:0vw;
	top:0vw;
	height:100%;
	width:46%;
	background-color:#ffffff;
	border:solid 1px #000000;
}

div.zoom_in_button:hover
{
	background-color:#e88f5b;
	border:solid 1px #000000;
}

div.zoom_out_button
{
	position:absolute;
	right:0vw;
	top:0vw;
	height:100%;
	width:46%;
	background-color:#ffffff;
	border:solid 1px #000000;
}

div.zoom_out_button:hover
{
	background-color:#e88f5b;
	border:solid 1px #000000;
}

img.map
{
	position:absolute;
	left:0vw;
	top:0vh;
	width:100%;
	height:100%;
	user-select:none;
	user-drag:none;
	
	z-index:5;
}

img.pin
{
	position:absolute;
	width:1%;
//	height:2.8%;
	aspect-ratio:1/1.4;
	cursor:pointer;
	z-index:10;

	transition:all 0.5s linear;
	-webkit-transition:all 0.5s linear;
}

div.pin_details
{
	position:absolute;
	width:6vw;
	height:auto;
	aspect-ratio:6/2.5;
	margin-left:2%;
	margin-right:1%;
	margin-top:0%;
	font-size:2.0vh;
	line-height:2.5vh;
	vertical-align:top;
	text-align:left;
	color:#222222;
	background-color:#eeeeee;
	border:solid 1px #51b1de;
	visibility:hidden;
	//overflow:visible;
	overflow-x:hidden;
	overflow-y:scroll;
	scrollbar-width:none;
	cursor:default;
	z-index:20;
}

hr.pin_detail_separator
{
	border:solid 1px #51b1de;
	width:80%;
}

div.pin_detail_header
{
	position:relative;
	width:100%;
	font-size:inherited;
	font-weight:bold;
	background-color:#51b1de;
	padding:1px;
}

div.pin_detail_text
{
	width:100%;
	padding:1%;
}

div.chapter_list_container
{
	position:absolute;
	left:0vw;
	top:0vh;
	width:100%;
	height:100%;
	border:solid 1px #ff0000;
}

div.chapter_list_uploader
{
	position:absolute;
	left:65vw;
	top:10vw;
	padding:0.5vh 0.5vw;
}

div.info_dark
{
	width:100%;
	height:auto;
	display:inline-block;
	background-color:#cccccc;
	padding:2px 0px;
}

div.info_light
{
	width:100%;
	height:auto;
	display:inline-block;
	background-color:#eeeeee;
	padding:2px 0px;
}

iframe.chapter_iframe
{
	width:100%;
	height:45vh;
	max-height:90vh;
	background:#aaffff;

	transition:height 0.5s linear;
	-webkit-transition:height 0.5s linear;
}