/* ---- Map Styles ----*/
#map {
	position: relative;
	overflow: hidden;
	width: 100%;
	border: 1px solid #cccccc;
	margin: -1px;
}
#content #map p, #content #map li, #content #map div {
	font-size: 11px;
}
#map_canvas img {
	max-width: none !important;
}

/* ---- Sidebar Styles ----*/
#map_sidebar {
	width: 180px;
	height: 580px;
	overflow: hidden;
	background-color: #dddddd;
	float: left;
	z-index: 9;
	position: relative;
	padding: 10px 5px 10px 10px;
}
	#sidebarContentWrapper {
		width: 180px;
		position: absolute;
		right: 5px;
		top: 10px;
	}
	/* ---- Quick Access Search ----*/
	#locationSearch {
		position: relative;
		border-bottom: 2px groove white;
		padding-bottom: 8px;
		z-index: 20;
	}
		.qa_search_query {
			border: 1px solid #999999;
			border-radius: 10px 10px 10px 10px;
			height: 16px;
			margin: 0;
			padding: 1px 5px;
			width: 168px;
			-moz-box-shadow: 0 1px 0 #EFEFEF, 1px 1px 1px #cdcdcd inset;
			-webkit-box-shadow: 0 1px 0 #EFEFEF, 1px 1px 1px #cdcdcd inset;
			box-shadow: 0 1px 0 #EFEFEF, 1px 1px 1px #cdcdcd inset;
			outline: none;
			background: white url(/map/images/search.gif) no-repeat 97% 50%;
		}
		#qa_results {
			border: 1px solid #999999;
			padding: 4px;
			position: absolute;
			top: 20px;
			left: 0;
			-moz-box-shadow: 0 0 5px #999999;
			-webkit-box-shadow: 0 0 5px #999999;
			box-shadow: 0 0 5px #999999;
		}
			#qa_results ul {
				border-bottom: 1px solid #CDCDCD;
			}
				#qa_results ul li {
					border-top: 1px solid #CDCDCD;
				}
	#map_sidebar h2 {
		margin: 0;
		border-bottom: 2px groove #ffffff;
	}
	/* ---- Building List ----*/
	#building_list {
		z-index: 15;
		height: 510px;
	}
		#building_list ul {
			list-style-type: none;
			margin: 0;
			padding: 0;
		}
		#building_list ul li {
			border-top: 1px solid #bbbbbb;
			line-height: 1.2;
			margin: 0 8px;
			position: relative;
			padding: 0;
			font-size: 11px;
		}
			#building_list ul li a {
				padding: 6px 2px;
				display: block;
				text-decoration: none;
			}
				#building_list ul li a:hover {
					background-color: #efefef;
					cursor: pointer;
				}
				#building_list ul li a span.tags {
					display: none;
				}
		/* ---- Parking ----*/
		#building_list ul.parking li {
			padding: 6px 20px 6px 28px;
			background-repeat: no-repeat;
			background-position: 7px 50%;
			cursor: pointer;
		}
			ul.parking li.facstaff {
				background-image: url(/map/images/parking-A.png);
			}
			ul.parking li.commuting {
				background-image: url(/map/images/parking-B.png);
			}
			ul.parking li.residence {
				background-image: url(/map/images/parking-C.png);
			}
			ul.parking li.reserved {
				background-image: url(/map/images/parking-D.png);
			}
			ul.parking li.extended {
				background-image: url(/map/images/parking-E.png);
			}
			ul.parking li.handicapped {
				background-image: url(/map/images/parking-H.png);
			}
			ul.parking li.number {
				background-image: url(/map/images/parking-numbers.png);
			}
			ul.parking li .check {
				right: 0;
			}
		#accordion div {
			padding: 0;
			-moz-border-radius: 0;
			-webkit-border-radius: 0;
			border-radius: 0;
			border: none;
			border-bottom: 2px groove #ffffff;
			background: white;
		}
		#building_list h6 {
    		position: relative;
			padding: 6px 35px 6px 16px;
			margin: 0;
			font-size: 12px;
			line-height: 1.1;
			cursor: default;
			color: #333333;
			-moz-text-shadow: 1px 1px 0 #ffffff;
			-webkit-text-shadow: 1px 1px 0 #ffffff;
			text-shadow: 1px 1px 0 #ffffff;
			background-repeat: no-repeat;
			background-position: 88% 50%;
			border-color: #999999;
			border-width: 0 0 0 0;
			border-bottom: 2px groove #ffffff;
			-moz-border-radius: 0;
			-webkit-border-radius: 0;
			border-radius: 0;
			background-color: transparent;
			background-image: none;
			text-transform: none;
			font-weight: bold;
		}
            .ui-icon-triangle-1-e,
            .ui-icon-triangle-1-s {
                border: 4px solid transparent;
                height: 0;
                width: 0;
                border-left-color: #777;
                left: 5px;
                top: 50%;
                position: absolute;
                margin-top: -4px;
                border-right-width: 0;
                transition: all .2s ease;
            }
            
            .ui-icon-triangle-1-s {
                transform: rotate(90deg);
            }
            
            h6:hover .ui-icon-triangle-1-e,
            h6:hover .ui-icon-triangle-1-s {
                border-left-color: #444;
            }
			#building_list h6.parking {
				background: transparent url(/map/images/parking.png) no-repeat 15px 50%;
				padding-left: 35px;
			}
			#building_list h6.acad_admin {
				background: transparent url(/map/images/acad_admin.png) no-repeat 15px 50%;
				padding-left: 35px;
			}
			#building_list h6.service {
				background: transparent url(/map/images/service.png) no-repeat 15px 50%;
				padding-left: 35px;
			}
			#building_list h6.athletic {
				background: transparent url(/map/images/athletic.png) no-repeat 15px 50%;
				padding-left: 35px;
			}
			#building_list h6.residence {
				background: transparent url(/map/images/residence.png) no-repeat 15px 50%;
				padding-left: 35px;
			}
			#building_list h6.dining {
				background: transparent url(/map/images/dining.png) no-repeat 15px 50%;
				padding-left: 35px;
			}
			#building_list h6.off_campus {
				background: transparent url(/map/images/off_campus.png) no-repeat 15px 50%;
				padding-left: 35px;
			}
			#building_list h6.callbox {
				background: transparent url(/map/images/callbox.png) no-repeat 15px 50%;
				padding-left: 35px;
			}
			#building_list h6.poi {
				background: transparent url(/map/images/poi.png) no-repeat 15px 50%;
				padding-left: 35px;
			}
			#building_list h6.aed {
				background: transparent url(/map/images/aed.png) no-repeat 15px 50%;
				padding-left: 35px;
			}
			#building_list h6:hover {
				background-color: #efefef;
				
			}
			#building_list h6.ui-state-active {
				border-bottom-style: solid;
				background-color: #ffffff;
				border-bottom-width: 0;
			}
			/* ---- Checkmarks ----*/
			#map_sidebar .check {
				width: 15px;
				height: 15px;
				overflow: hidden;
				background: transparent url(/map/images/checks.png) no-repeat 0 0;
				margin: -8px 0 0 0;
				position: absolute;
				right: 4px;
				top: 50%;
				cursor: pointer;
			}
				#map_sidebar .check:hover {
					background-position: 0 -15px;
				}
				#map_sidebar .check.unchecked {
					background-position: -15px 0;
				}
					#map_sidebar .check.unchecked:hover {
						background-position: -15px -15px;
					}
		
/* ---- Sidebar Toggle ----*/
#map_sidebar_toggle {
	float: left;
	width: 20px;
	height: 600px;
	z-index: 5;
	position: relative;
	background: transparent url(/map/images/expand_collapse.png) no-repeat 0 50%;
	cursor: pointer;
	margin-right: -20px;
}
	#map_sidebar_toggle:hover {
		background-position: -20px 50%;
	}
	#map_sidebar_toggle.expand {
		background-position: -40px 50%;
	}
		#map_sidebar_toggle.expand:hover {
			background-position: -60px 50%;
		}

/* ---- Map Canvas ----*/
#map_canvas {
	overflow: hidden;
	width: auto;
	height: 600px;
	z-index: 1;
	position: relative;
}
.mapIconLabel {
	font-size: 13px !important;
    font-weight: bold;
    color: #FFFFFF;
    width: 24px !important;
	margin-left: -12px !important;
	text-align: center;
	-webkit-font-smoothing: antialiased;
	text-shadow: 0 0 2px black,0 0 2px black;
}

/* ---- Info Windows ----*/
.infoWindow {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	min-width: 350px;
}
.infoWindow p {
	line-height: 1.5;
	margin: 4px 0 !important;
	font-size: 12px !important;
}
	.infoWindow a.shadowbox {
		position: relative;
		float: left;
	}
	.infoWindow a.shadowbox:after {
		content: url(/images/icons/zoom.png);
		width: 16px;
		height: 16px;
		display: block;
		position: absolute;
		bottom: 10px;
		right: 12px;
	}
	.infoWindow img {
		width: 120px;
		height: 120px;
		float: left;
		margin: 0 10px 8px 0 !important;
	}
	.infoWindow h2 {
		font-size: 18px;
		color: #133980;
		line-height: 16px !important;
		margin: 10px 0 4px 0 !important;
	}
		.infoWindow h2 span {
			font-size: 12px;
			font-weight: bold;
			color: #999999;
		}
	.infoWindow div.permalink {
		color: #999999;
		cursor: pointer;
		padding-left: 150px;
		background: transparent url(/map/images/link.png) no-repeat 130px 0px;
		font-weight: bold;
	}
		.infoWindow .permalink input {
			width: 90%;
			border: 1px solid #999999;
			margin: 0 !important;
			padding: 2px;
			cursor: text;
		}
	.infoWindow div.directions {
		color: #999999;
		padding-left: 150px;
		background: transparent url(/map/images/compass_small.png) no-repeat 130px 0px;
		font-weight: bold;
	}
		.infoWindow .directions form {
			margin: 0;
			padding: 0;
		}
		.infoWindow .directions form label {
			margin: 0;
			padding: 0;
			display: inline;
			font-size: 12px;
		}
		.infoWindow .directions input {
			width: 75%;
			border: 1px solid #999999;
			margin: 0 !important;
			padding: 2px;
		}
		.infoWindow .directions input.getDirections {
			width: auto;
		}
	.infoWindow p.description,
	.infoWindow div.description {
		clear: left;
	}
	
/* ---- Toolbar ----*/
#toolbar {
	position: relative;
	padding: 0;
	background-color: #efefef;
	z-index: 100;
	float: left;
	width: 100%;
	-moz-text-shadow: white 1px 1px 0px;
	-webkit-text-shadow: white 1px 1px 0px;
	text-shadow: white 1px 1px 0px;
	-moz-box-shadow: 0 0 10px black;
	-webkit-box-shadow: 0 0 10px black;
	box-shadow: 0 0 10px black;
}
	#toolbar h6 {
		margin: 0;
		line-height: 1.2;
	}
	#drivingDirections,
	#walkingTour,
	#virtualTour,
	#asuMobile,
	#print {
		float: left;
		width: 23%;
	}
		#drivingDirections > div,
		#walkingTour > div,
		#virtualTour > div,
		#asuMobile > div,
		#print > div {
			padding: 10px 0 10px 36px;
			background-repeat: no-repeat;
			background-position: 0 10px;
			margin-left: 20px;
		}
	#drivingDirections {
		width: 40%;
	}
	#print {
		width: 14%;
	}
	#drivingDirections > div {
		background-image: url(/map/images/compass.png);
	}
		#drivingDirections form {
			margin: 0;
		}
			input.start {
				border: 1px solid #999999;
				border-radius: 10px 10px 10px 10px;
				height: 16px;
				margin: 0;
				padding: 1px 5px;
				width: 80%;
				-moz-box-shadow: 0 1px 0 #EFEFEF, 1px 1px 1px #cdcdcd inset;
				-webkit-box-shadow: 0 1px 0 #EFEFEF, 1px 1px 1px #cdcdcd inset;
				box-shadow: 0 1px 0 #EFEFEF, 1px 1px 1px #cdcdcd inset;
				background-color: white;
			}
			input.getDirections {
				font-size: 12px !important;
				margin: 0px !important;
				padding: 2px 8px !important;
			}
	#walkingTour > div {
		background-image: url(/map/images/printable_map.png);
	}
		#walkingTour p {
			margin: 2px 0 0 0 !important;
		}
		#walkingTour a {
			font-weight: bold;
		}
	#virtualTour > div {
		background-image: url(/map/images/virtual-tour.png);
	}
		#virtualTour p {
			margin: 2px 0 0 0 !important;
		}
		#virtualTour a {
			font-weight: bold;
		}
	#asuMobile > div {
		background-image: url(/map/images/iphone.png);
	}
		#asuMobile p {
			margin: 2px 0 0 0 !important;
		}
		#asuMobile a {
			font-weight: bold;
		}
	#print > div {
		border-right: none;
		background-image: url(/map/images/print.png);
	}
		#print p {
			margin: 2px 0 0 0 !important;
		}
		#print a {
			font-weight: bold;
		}

/* ---- Driving Directions Panel ----*/
#directionsPanel {
	height: 485px;
	padding: 15px 15px 30px 15px;
	position: absolute;
	left: 10px;
	top: 565px;
	width: 250px;
	overflow: visible;
	display: none;
	z-index: 90;
	background: transparent url(/map/images/folded_paper.png) no-repeat 100% 100%;
}
	#open_close {
		display: block;
		height: 12px;
		width: 100%;
		background: transparent url(/map/images/open_close.png) no-repeat 50% 0;
		overflow: hidden;
		cursor: pointer;
		text-indent: -9999px;
	}
		#open_close.open {
			background-position: 50% 0;
		}
			#open_close.open:hover {
				background-position: 50% -24px;
			}
		#open_close.close {
			background-position: 50% -12px;
		}
			#open_close.close:hover {
				background-position: 50% -36px;
			}
	#directions {
		height: 473px;
		overflow: auto;
		clear: both;
	}
	#paperclip {
		display: none;
		width: 24px;
		position: absolute;
		left: 30px;
		top: -46px;
		height: 64px;
		background: transparent url(/map/images/paperclip.png) no-repeat 0 0;
		z-index: 150;
	}
	#directionsPanel img {
		max-width: none;
	}
	
/*---------------------- Quick Search ----------------------*/
#pagesearch_container {
	background-color:#f9efcb;
	border:1px solid #f5c27b;
	padding:10px;
	margin-bottom: 10px;
}
#pagesearch_container h2 {
	margin: 0;
}
#pagesearch_container p {
}
#pagesearch {
	position: relative;
}
#pagesearch input {
	border: 1px solid #F5C27B;
	font-size:16px;
	line-height:20px;
	width: 100%;
	margin: 0;
	padding: 5px 0;
	text-indent: 5px;
}
#qa_results.qa_noquery {
	display:none;
}
#qa_results.qa_blur {
	display: none;
}
#qa_results {
	background-color:white;
	border:1px solid #F5C27B;
	padding:10px;
	position:absolute;
	top: 30px;
	left: 0;
	z-index: 999;
	font-size: 12px;
}
#qa_results ul {
	list-style-type:none;
	margin:0;
	padding:0;
}
#qa_results ul li {
	margin: 0;
	padding: .0;
}
#qa_results ul li a {
	margin: 0;
	padding: .25em;
	display: block;
}
#qa_results ul li.qa_selected a {
	background-color: #F9EFCB;
}
#qa_results ul li a:hover {
	background-color: #fdda99;
	text-decoration: none;
	cursor: pointer;
}
#qa_results ul li a .qa_highlight {
	font-weight: bold;
	color: #014576;
}
.qa-links {
	display: none;
}


/*---------------------- Quick Search ----------------------*/

#opacity-slider {
	position: absolute;
	z-index: 9;
	width: 100px;
	right: 115px;
	top: 12px;
    border-radius: 4px;
    background: white;
    border: 1px solid #aaa;
    height: .8em;
}
#opacity-slider .ui-slider-handle {
    border: 1px solid #999 !important;
    background: #efefef !important;
    position: absolute;
    top: -.3em;
    margin-left: -.6em;
    z-index: 2;
    width: 1.2em;
    height: 1.2em;
    cursor: default;
    -ms-touch-action: none;
    touch-action: none;
    border-radius: 4px;
}
#opacity-slider a {
	border-color: #999999;
	box-shadow: 0 1px 4px rgba(0,0,0,.3);
}
.opacity0 img[src*='map/1'] {
	filter: alpha(opacity=0);
	opacity: 0;
}
.opacity10 img[src*='map/1'] {
	filter: alpha(opacity=10);
	opacity: .1;
}
.opacity20 img[src*='map/1'] {
	filter: alpha(opacity=20);
	opacity: .2;
}
.opacity30 img[src*='map/1'] {
	filter: alpha(opacity=30);
	opacity: .3;
}
.opacity40 img[src*='map/1'] {
	filter: alpha(opacity=40);
	opacity: .4;
}
.opacity50 img[src*='map/1'] {
	filter: alpha(opacity=50);
	opacity: .5;
}
.opacity60 img[src*='map/1'] {
	filter: alpha(opacity=60);
	opacity: .6;
}
.opacity70 img[src*='map/1'] {
	filter: alpha(opacity=70);
	opacity: .7;
}
.opacity80 img[src*='map/1'] {
	filter: alpha(opacity=80);
	opacity: .8;
}
.opacity90 img[src*='map/1'] {
	filter: alpha(opacity=90);
	opacity: .9;
}



/* @media only screen and (max-width: 480px) { */
@media only screen and (max-width: 767px) {

#map_sidebar {
	float: none;
	width: auto;
	height: auto;
}
#sidebarContentWrapper {
	position: static;
	width: auto;
}
#map #building_list {
	height: auto;
}
.qa_search_query {
	width: 95%;
}
#map_sidebar_toggle {
	display: none;
}
#paperclip {
	display: none !important;
}
#drivingDirections,
#walkingTour,
#asuMobile {
	width: 100%;
}
#drivingDirections > div,
#walkingTour > div,
#asuMobile > div {
	margin-left: 5px;
	margin-right: 5px;
}
#print {
	display: none;
}
#directionsPanel {
	position: static;
	background: none;
	width: auto;
	height: auto;
}
#directions {
	height: auto;
}
#map_canvas {
	height: 300px !important;
}
#opacity-slider {
	display: none;
}
}