/* 
	Title: Hungrybrowser - Map search style sheet
	Description: Contains all the custom styling for the mmk website
	Client: MMK
	Date: 05/12/2006
	Version 1.01
	Author: Ben Ellis
*/

/* ------------------------------------------------------------
	Map container
---------------------------------------------------------------- */

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

/* ------------------------------------------------------------
	Map areas
---------------------------------------------------------------- */

ul#map_areas, ul#map_areas li {
	list-style: none;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}

ul#map_areas {
	width: 540px;
	height: 689px;
	background: #9c8dc3 url(../img/map_search_base_bg.gif) 0px 0px no-repeat;
}

ul#map_areas li a {
	cursor: pointer;
}

/* ------------------------------------------------------------
	Hides map text
---------------------------------------------------------------- */

ul#map_areas li a {
	text-indent: -10000px;
} 

/* ------------------------------------------------------------
	Positions top level map areas
---------------------------------------------------------------- */

ul#map_areas li, ul#map_areas li a {
	position: absolute;
	z-index: 0;
	display: block;
	background-position: 0px 0px;
	background-repeat: no-repeat;
	border: 1px transparent dashed;
}

/*ul#map_areas li a {
	opacity:.85;
	filter: alpha(opacity=85); 
	-moz-opacity: 0.85;
}
*/

ul#map_areas li a:hover,ul#map_areas li.active a {
	border: 1px #000000 dashed;
	text-indent: 0px;
	text-decoration: none;
	z-index: 20;
}

ul#map_areas li.active a {
	border-color: #CC0000;
	z-index: 20;
}

ul#map_areas li a:hover span, ul#map_areas li.active a span {
	background-color: #FFFFCC;
	border: 1px #999999 solid;
	color: #333333;
	padding: 1px 2px 1px 2px;
	margin: 2px 2px 0px 2px;
	font-size: 85%;
	text-decoration: none;
	font-weight: bold;
}

/* ------------------------------------------------------------
	Increases the z-index of top level hover states
---------------------------------------------------------------- */

ul#map_areas li a:hover {
	z-index: 1;
}

/* ------------------------------------------------------------
	Styles area 1
---------------------------------------------------------------- */

ul#map_areas li#map_area_1 a {
	top: 0px;
	left: 190px;
	width: 347px;
	height: 210px;
	/* background: url(../img/map_search_base_bg.gif) -192px -691px no-repeat;*/
}

ul#map_areas li#map_area_1 a:hover,
ul#map_areas li#map_area_1.active a {
	background: url(../img/map_search_base_bg.gif) -192px -691px no-repeat;
}

/* ------------------------------------------------------------
	Styles area 2
---------------------------------------------------------------- */

ul#map_areas li#map_area_2 a {
	top: 0px;
	left: 0px;
	width: 189px;
	height: 345px;
	/*background: url(../img/map_search_base_bg.gif) -2px -2px no-repeat;*/
}

ul#map_areas li#map_area_2 a:hover,
ul#map_areas li#map_area_2.active a {
	background: url(../img/map_search_base_bg.gif) -2px -691px no-repeat;
}

/* ------------------------------------------------------------
	Styles area 3
---------------------------------------------------------------- */

ul#map_areas li#map_area_3 a {
	top: 345px;
	left: 0px;
	width: 190px;
	height: 250px;
}

ul#map_areas li#map_area_3 a:hover,
ul#map_areas li#map_area_3.active a {
	background: url(../img/map_search_base_bg.gif) -2px -1036px no-repeat;
}

/* ------------------------------------------------------------
	Styles area 4
---------------------------------------------------------------- */

ul#map_areas li#map_area_4 a {
	top: 210px;
	left: 190px;
	width: 160px;
	height: 288px;
}

ul#map_areas li#map_area_4 a:hover,
ul#map_areas li#map_area_4.active a {
	background: url(../img/map_search_base_bg.gif) -192px -901px no-repeat;
}

/* ------------------------------------------------------------
	Styles area 5
---------------------------------------------------------------- */

ul#map_areas li#map_area_5 a {
	top: 210px;
	left: 350px;
	width: 187px;
	height: 195px;
}

ul#map_areas li#map_area_5 a:hover,
ul#map_areas li#map_area_5.active a {
	background: url(../img/map_search_base_bg.gif) -352px -901px no-repeat;
}

/* ------------------------------------------------------------
	Styles area 6
---------------------------------------------------------------- */

ul#map_areas li#map_area_6 a {
	top: 498px;
	left: 190px;
	width: 160px;
	height: 172px;
}

ul#map_areas li#map_area_6 a:hover,
ul#map_areas li#map_area_6.active a {
	background: url(../img/map_search_base_bg.gif) -192px -1189px no-repeat;
}

/* ------------------------------------------------------------
	Styles area 7
---------------------------------------------------------------- */

ul#map_areas li#map_area_7 a {
	top: 406px;
	left: 350px;
	width: 187px;
	height: 215px;
}

ul#map_areas li#map_area_7 a:hover,
ul#map_areas li#map_area_7.active a {
	background: url(../img/map_search_base_bg.gif) -352px -1097px no-repeat;
}


/* ------------------------------------------------------------
	Map details container
---------------------------------------------------------------- */

#map_details {
	position: absolute;
	top: 0px;
	right: 0px;
	width: 330px;
}

/* ------------------------------------------------------------
	Styles sub-areas
---------------------------------------------------------------- */

#map_details ul {
	height: auto;
	padding: 0px;
	margin: 0px 0px 0px 0px;
	z-index: 20;
	background-image: none;
	position: absolute;
	top: 0px;
	left: 0px;
}

/* ------------------------------------------------------------
	Styles sub-areas
---------------------------------------------------------------- */

#map_details ul li {
	background-image: none;
	padding-left: 0px;
}

#map_details ul li a {
	background: url("../img/column_2_bullet_bg_light.gif") 0px 7px no-repeat;
	display: block;
	padding: 0px 0px 0px 25px;
	text-indent: 0px;
	position: inherit;
}

#map_details h3 {
	margin: 0px 0px 10px 0px;
	padding: 5px 0px 7px 40px;
	color: #FFFFFF;
	font-size: 100%;
	font-weight: normal;
	width: 290px;
}

#map_details h3 {
	background: url("../img/map_heading_bg.gif") 0px 0px no-repeat;
}
