html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }


#upload { padding:10px 20px; background:#000; color:#fff; float:right; opacity:0.5; position:relative; margin:-100px 20px 0px 0px; font-size:40px; z-index:10; }

/*FONT & BACKGROUND*/
body { font-family: "Droid Sans", Helvetica, Arial, Sans-serif; font-size:11px; }


h1 { letter-spacing:-1px; margin:10px 0px; padding:0; font-weight:normal; }
h2 { letter-spacing:-0.5px; margin:10px 0px; padding:0; text-decoration:underline; font-weight:normal; }

p { margin:10px 0px; padding:0; letter-spacing:0.25px; line-height:22px; text-align:justify; }

a:link { color:inherit; text-decoration:underline; }
a:hover { color:inherit; text-decoration:none; }
a:visited { color:inherit; }


/*LOGO IMAGE*/

#logo { clear:both; margin-top:10px; width:790px; height:300px; margin-left:-10px; margin-right:-10px; border:5px solid #fff; background-image:url('images/logo.png'); }


span.link { cursor:pointer; }
span.link:hover { cursor:pointer; }

i.link {cursor:pointer; position:relative;}
i.link:hover { cursor:pointer; opacity:0.7; }

a img:hover{opacity:0.7;}

/*span.link:hover { cursor:pointer; text-decoration:underline; color:#888; }
*/

.right{float:right;}
.left{float:left;}
.clear{clear:both;}

.uppercase{ text-transform:uppercase;}

.arrow-down {
	display: inline-block;
	vertical-align: middle;
	position:relative;
	left:3px;
	top:-1px;
	content: "";
	width: 0; 
	height: 0; 
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;	
	border-top: 4px solid #000;
}

.text-arrow-down{
	font-size:8px; position:relative; top:-1px; left:3px;
}

.current{color:#629a51!important; font-weight:bold;}
.current:hover{color:#629a51!important; font-weight:bold;}

ul { list-style:none; margin:0; padding:0; }
li { margin-bottom:10px; }

#header { padding:10px 10px 5px 10px; }

#content { padding:10px; margin-top:5px; background:#f0ffff; }

#footer { clear:float; background:#f0ffff; color:#000; padding:10px; margin-top:10px; margin-bottom:10px; }

#map { height: 100%; width:100%;}

#loading {display:none; position:absolute;}

#top { position:fixed; padding:17px 10px 15px 10px; top:0px; left:0px; width:100%; min-width:800px; color:#000; line-height:13px; height:14px; background:rgba(255,255,255,0.9); border-bottom:1px solid #ccc;}
/*#top { position:fixed; padding:7px 10px 5px 10px; top:0px; left:0px; width:100%; min-width:1000px; opacity:0.7; color:#000; height:14px; background:#fff;}*/

/*#top:hover { opacity:0.7; }*/

	#top a { text-decoration:none; }
	#top a:hover {  }

/*#top a { color:#000; text-decoration:none; }*/
/*#top a:hover { color:#888;  }*/


	#top ul { list-style-type:none; }

	.dropdownMenu {font-family:'Droid Sans'; font-size:11px; letter-spacing:2px; margin-top:3px;}
	.dropdownMenu.left{padding-left:40px;}
	.dropdownMenu.right{margin-right:35px;}
	.dropdownMenu li { display:inline; float:left; padding:12px 12px; margin:-12px 0px; }
	.dropdownMenu li a:link, .dropdownMenu li a:visited {   }
	.dropdownMenu li a:hover {  } 
/*	.dropdownMenu li ul { font-size:9px; position:absolute; visibility:hidden; color:#000; margin:6px 0px 0px -12px; padding:0px; background:#fff;}*/
	.dropdownMenu li ul { position:absolute; visibility:hidden; border:1px solid #ccc; border-top:none; overflow:auto;}
	.dropdownMenu li ul.page { position:absolute; visibility:hidden; color:#000; margin:12px 0px 0px -12px; padding:0px; padding-bottom:10px; background:rgba(255,255,255,0.9); }

	.dropdownMenu li ul ul {border:none;}
	
	.dropdownMenu li ul li { clear:both; margin:1px 0px; }

	.dropdownMenu li ul.page span.link:hover { color:#aaa; }

	.inline-page {padding:10px; }

	.inline-page p {line-height:18px; font-size:11px; margin-bottom:20px; letter-spacing:1px;}

	.inline-page p a{text-decoration:underline !important;}
	.inline-page p a:hover{text-decoration:none !important;}

	#browser { width:270px; height:19px; letter-spacing:2px; padding:0px 20px; }
/*#browser { float:right; position:absolute; top:40px; right:20px; padding:10px 20px 10px 10px; opacity:0.7; color:#000;  width:220px; letter-spacing:2px; background:#fff;}*/

/*#browser:hover { opacity:0.7; }*/


	#browserMusicList { margin-left:-12px; margin-top:12px; font-family:"Droid Sans"; background:rgba(255,255,255,0.9); color:#000; letter-spacing:2px; font-size:11px; overflow:auto; outline: none;  width:270px; }

	#browserSoundsList { margin-left:0px; margin-top:3px; font-family:"Droid Sans"; background:rgba(255,255,255,0.9); color:#000; letter-spacing:2px; font-size:11px; overflow:auto; outline: none;  width:270px; }

	#browserMusicList ul { position:relative; line-height:13px; }

	
/*	ul.square { list-style:square; }*/
	#browserMusicList li { margin-left:0px; padding:2px 0px 2px 10px; }





a.photo:hover{opacity:0.8;}
a.photo img { padding-bottom:2px; }
a.fancybox-media:hover{opacity:0.8;}
#title { float:left; }


#footer a { text-decoration:none; }

.selected { background:#f0ffff; color:#000; text-decoration:none; border:1px solid black; padding:4px; }



/*NAVBAR*/

#mainnav { margin-top:5px; margin-left:-10px; margin-right:-10px; background:#f0ffff; color:#000; padding:10px 5px 10px 5px; text-align:right; }

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

#mainnav li { display:inline; }

#mainnav li a { background:#f0ffff; color:#000; text-decoration:none; padding:5px; }

#mainnav li a:hover { background:#f0ffff; color:#000; text-decoration:underline; padding:5px; }


/*UPLOAD*/

.error { font-weight: bold; color: #C00 }


label { height:20px; width: 125px; float: left; text-align: right; margin-right: 0.5em; display: block; letter-spacing:0px;  }

input { height:20px; background:#f0fff0; color: #000; border: 1px solid #000; padding:2px 2px 2px 2px; margin-bottom:1px; margin-top:1px; }

input.submit { padding-bottom:2px; color: #000; border: 1px solid #000; background:#f0fff0; }

input.file  { height:30px; font-size:11px; color: #000; border: 1px solid #000; background:#f0fff0; }

input.checkbox { border: 1px solid #000; background:#f0fff0; }

select { color: #000; border: 1px solid #000; background:#f0fff0; }

option { background:#f0fff0; padding:0px 4px 0px 3px; }

textarea { color: #000; border: 1px solid #000; background:#f0fff0; }

fieldset { border: 1px solid #000; padding-left:10px; padding-bottom:15px; margin-bottom:10px; margin-top:10x; padding-top:5px; }

legend { border: 1px solid #000; padding: 2px 4px 4px 6px; }

#upload_map_static { width: 400px; height: 300px; border:1px solid black; }
#upload_map_mobile { width: 400px; height: 300px; border:1px solid black; }


.static{display:none;}
.mobile{display:none;}

	#clearPaths{
		 width:24px; height:24px; position:absolute; left:200px;
		top:6px;
	box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px;
	 background-color: rgb(255, 255, 255);
	border: 1px solid rgb(113, 123, 135); -webkit-box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px;
}

span.divider{margin: 0px 5px 0px 2px; border-left:1px solid #777;}


/*sound map*/

.gm-style .gm-style-iw, .gm-style .gm-style-iw a, .gm-style .gm-style-iw span, .gm-style .gm-style-iw label, .gm-style .gm-style-iw div{
	font-size:11px; letter-spacing:0.2px; line-height:14px; font-family:'Droid Sans';
}

.gm-style div, .gm-style span, .gm-style label, .gm-style a{
		font-size:11px; letter-spacing:0.2px; line-height:14px; font-family:'Droid Sans';
}

#map_main { width:250px; padding:5px 5px 5px 5px; margin:0px 0px 0px 0px; font-size:11px; letter-spacing:0.2px; line-height:14px; font-family:'Droid Sans'; }
#map_main.wide {width:525px;}

#map_title { font-size:11px; font-weight:bold; padding-bottom:7px;  background:#fff;}

#map_image {  }

#map_audio {position:relative; margin-bottom:15px;}

#map_info #map_audio{height:100px; margin-bottom:0px;}

#map_audio ul {position:relative; top:5px;}

#map_media { float:left; margin-left:20px; width:250px; padding-bottom:5px; }

#map_info { float:left; width:250px; top:2px; left:0px; min-height:200px;}
#map_extra { margin-top:10px; }

#map_info, #map_extra li { padding:0; }

#map_download { text-align:center;}

.inline{display:inline;}

/*sound map installation*/

/*sound map*/

#soundPlayer { width:250px;}

.audio-container{height:25px;}

#inst_main { position:relative; padding-top:0px; padding-bottom:0px; width:600px; margin:0px 10px 10px 10px; font-size:11px; letter-spacing:0.2px; line-height:15px; }

#inst_title { position:relative; font-size:12px; font-weight:bold; margin-bottom:10px; }

#inst_image { position:relative;  z-index:20px; margin:0px 0px; }

#inst_media { position:relative; margin-bottom:10px;}

#inst_info { position:relative; top:2px; width:250px; left:0px; }

#inst_info li { padding:0; margin:5px 0px 5px 0px; }

.justify {text-align:justify;}

#topTitle{float:left; font-family:'Economica'; font-size:26px; letter-spacing:2px}

.green{color:#629a51;}

#search{margin-left:10px; margin-top:-4px; height:12px;}

@media (max-width: 1290px) {
	.dropdownMenu{ font-size:10px;  padding-right:2px; }
	#topTitle{font-size:26px; }
	.text-arrow-down{font-size:7px;}
}

@media (max-width: 1246px) {
	.dropdownMenu{ font-size:10px; padding-right:0px; }
	#topTitle{font-size:26px; }
	.dropdownMenu li {padding:12px 11px;}
}

@media (max-width: 1214px) {
	.dropdownMenu{ font-size:10px; letter-spacing:1px; padding-right:0px; }
	#topTitle{font-size:22px; letter-spacing:1px; }
}

@media (max-width: 1090px) {
	.dropdownMenu{ font-size:10px; letter-spacing:1px; padding-right:0px; }
	#topTitle{font-size:22px; letter-spacing:1px; }
	.dropdownMenu li {padding:12px 8px;}
}

@media (max-width: 1005px) {
	.dropdownMenu{ font-size:10px; letter-spacing:0px; padding-right:0px; }
	#topTitle{font-size:22px; letter-spacing:0px; }
	.dropdownMenu li {padding:12px 8px;}
}

@media (max-width: 911px) {
	.dropdownMenu{ font-size:10px; letter-spacing:0px; padding-right:0px; }
	.dropdownMenu.left{ padding-left:15px;}
	.dropdownMenu.right{ margin-right:25px;}
	#topTitle{font-size:22px; letter-spacing:0px; }
	.dropdownMenu li {padding:12px 8px;}
	span.divider {margin: 0px 2px 0px 3px;}
}

@media (max-width: 868px) {
	.dropdownMenu{ font-size:10px; letter-spacing:0px; padding-right:0px; }
	.dropdownMenu.left{ padding-left:15px;}
	.dropdownMenu.right{ margin-right:25px;}
	#topTitle{font-size:22px; letter-spacing:0px; }
	.dropdownMenu li {padding:12px 6px;}
	span.divider {margin: 0px 2px 0px 3px;}
}

@media (max-width: 812px) {
	.dropdownMenu{ font-size:9px; letter-spacing:0px; padding-right:0px; }
	.dropdownMenu.left{ padding-left:15px;}
	.dropdownMenu.right{ margin-right:60px;}
	#topTitle{font-size:20px; letter-spacing:0px; }
	.dropdownMenu li {padding:12px 6px;}
	span.divider {margin: 0px 2px 0px 3px;}
	.text-arrow-down{font-size:6px;}
}