@font-face {
    font-family: "SourceSansPro-Regular";
    src: url('fonts/SourceSansPro-Regular.otf') format("truetype");
}

@font-face {
    font-family: "SourceSansPro-Bold";
    src: url('fonts/SourceSansPro-Bold.otf') format("truetype");
}
body{
	font-family: 'SourceSansPro-Regular', Arial, serif;
	font-size: 10px;
}
.header{
	top:35px;
	width: inherit;
	height: 10px;
	position: absolute;
	z-index: 3;
	text-align: center;
	color:white;
	font-size: 12;
	text-shadow: 0px 2px 3px rgba(150, 150, 150, 1)
}

#url{
	top:50px;
	font-size: 30px;
	color:white;
	font-family: 'SourceSansPro-Bold';
	text-shadow: 0px 2px 3px rgba(150, 150, 150, 1)
}

#map {
 z-index:1;
 top: 0px;
 left: 0px;
 position:absolute; 
}


.bar{
	z-index:2;
	top:0px;
	left:0px;
	width:20px;
	height:100%;
	position:absolute;
	background-color: white;
	-webkit-box-shadow:  12px 0px 8px 4px rgba(0, 0, 0, 0.5);
    box-shadow:  12px 0px 8px 4px rgba(0, 0, 0, 0.5);
    overflow: auto;
}
#button{
	z-index:4;
	float:right;
	width: 10px;
	height: 90%;
	padding: 5px;
	font-size: 20px;

}

.info{
	z-index: 3;
	width:250;
	position: absolute;
	top: 0px;
	z-index: 4;
	color:black;
	padding: 15px;
	float: left;
	overflow: auto;
	

}
.info img{
	top :0px;
}
.info p {
	overflow: auto;
}
.info #info-text{
	text-align: justify;
	height:inherit;
	overflow: auto;

}

#metadata{
	visibility: hidden;
}