@charset "utf-8";
/* CSS Document */
/* image map styling for online tour page */	

/* positioning for each link's corresponding span, relative to the position of the link itself */
#imap ul li.p1 span {position:absolute; width:280px; height:447px; top:-183px; left:498px; z-index:100;}
#imap ul li.p2 span {position:absolute; width:280px; height:447px; top:-69px; left:355px; z-index:99;}
#imap ul li.p3 span {position:absolute; width:280px; height:447px; top:-185px; left:378px; z-index:98;}
#imap ul li.p4 span {
	position:absolute;
	width:280px;
	height:447px;
	top:-191px;
	left:356px;
	z-index:97;
}
#imap ul li.p5 span {position:absolute; width:280px; height:447px; top:-191px; left:338px; z-index:96;}
#imap ul li.p6 span {position:absolute; width:280px; height:447px; top:-179px; left:309px; z-index:95;}
#imap ul li.p7 span {position:absolute; width:280px; height:447px; top:-212px; left:343px; z-index:94;}
#imap ul li.p8 span {position:absolute; width:280px; height:447px; top:-178px; left:203px; z-index:93;}
#imap ul li.p9 span {position:absolute; width:280px; height:447px; top:-178px; left:251px; z-index:92;}
#imap ul li.p10 span {position:absolute; width:280px; height:447px; top:-178px; left:161px; z-index:91;}
#imap ul li.p11 span {position:absolute; width:280px; height:447px; top:-180px; left:60px; z-index:90;}
#imap ul li.p12 span {position:absolute; width:280px; height:447px; top:-237px; left:103px; z-index:89;}
#imap ul li.p13 span {position:absolute; width:280px; height:447px; top:-260px; left:360px; z-index:88;}
#imap ul li.p14 span {position:absolute; width:280px; height:447px; top:-260px; left:420px; z-index:87;}
#imap ul li.p15 span {position:absolute; width:280px; height:447px; top:-341px; left:476px; z-index:100;}

/* position of the link relative to top left of map, link dimensions, and sprite image for link */
#imap ul li.p1 a:active, #imap ul li.p1 a:focus, #imap ul li.p1 a {top:183px;left:32px; width:75px; height:37px; background:transparent url(images/mapbuttons/library.jpg) no-repeat top left;}
#imap ul li.p2 a:active, #imap ul li.p2 a:focus, #imap ul li.p2 a {top:69px; left:175px; width: 17px; height:19px; background:transparent url(images/mapbuttons/tuhua.jpg) no-repeat top left;}
#imap ul li.p3 a:active, #imap ul li.p3 a:focus, #imap ul li.p3 a {top:185px; left:152px; width:26px; height: 39px; background:transparent url(images/mapbuttons/staffroom.jpg) no-repeat top left;}
#imap ul li.p4 a:active, #imap ul li.p4 a:focus, #imap ul li.p4 a {top:191px; left:174px; width:17px; height:14px; background:transparent url(images/mapbuttons/principal.jpg) no-repeat top left;}
#imap ul li.p5 a:active, #imap ul li.p5 a:focus, #imap ul li.p5 a {top:191px; left:192px; width:16px; height:14px; background:transparent url(images/mapbuttons/reception.jpg) no-repeat top left;}
#imap ul li.p6 a:active, #imap ul li.p6 a:focus, #imap ul li.p6 a {top:179px; left:220px; width:47px; height:45px; background:transparent url(images/mapbuttons/kauri.jpg) no-repeat top left;}
#imap ul li.p7 a:active, #imap ul li.p7 a:focus, #imap ul li.p7 a {top:212px; left:187px; width:14px; height:11px; background:transparent url(images/mapbuttons/nurse.jpg) no-repeat top left;}
#imap ul li.p8 a:active, #imap ul li.p8 a:focus, #imap ul li.p8 a {top:178px; left:326px; width:41px; height:33px; background:transparent url(images/mapbuttons/kahikatea.jpg) no-repeat top left;}
#imap ul li.p9 a:active, #imap ul li.p9 a:focus, #imap ul li.p9 a {top:178px; left:278px; width:48px; height:33px; background:transparent url(images/mapbuttons/kowhai.jpg) no-repeat top left;}
#imap ul li.p10 a:active, #imap ul li.p10 a:focus, #imap ul li.p10 a {top:178px; left:368px; width:45px; height:45px; background:transparent url(images/mapbuttons/totara.jpg) no-repeat top left;}
#imap ul li.p11 a:active, #imap ul li.p11 a:focus, #imap ul li.p11 a {top:180px; left:469px; width:35px; height:44px; background:transparent url(images/mapbuttons/rimu.jpg) no-repeat top left;}
#imap ul li.p12 a:active, #imap ul li.p12 a:focus, #imap ul li.p12 a {top:237px; left:426px; width:62px; height:33px; background:transparent url(images/mapbuttons/rata.jpg) no-repeat top left;}
#imap ul li.p13 a:active, #imap ul li.p13 a:focus, #imap ul li.p13 a {top:260px; left:169px; width:40px; height:34px; background:transparent url(images/mapbuttons/ruapehu.jpg) no-repeat top left;}
#imap ul li.p14 a:active, #imap ul li.p14 a:focus, #imap ul li.p14 a {top:260px; left:108px; width:28px; height:36px; background:transparent url(images/mapbuttons/learning.jpg) no-repeat top left;}
#imap ul li.p15 a:active, #imap ul li.p15 a:focus, #imap ul li.p15 a {top:341px; left:52px; width:41px; height:75px; background:transparent url(images/mapbuttons/pool.jpg) no-repeat top left;}

/* images to display in link's span box on hover */
#imap ul li.p1 a:hover em {
	display:block;
	width:280px;
	height:150px;
	background-image:url(images/mapphotos/library.gif);
}
#imap ul li.p2 a:hover em {display:block; width:280px; height:150px; background-image:url(images/mapphotos/tuhua.gif);}
#imap ul li.p3 a:hover em {display:block; width:280px; height:150px; background-image:url(images/mapphotos/staffroom.gif);}
#imap ul li.p4 a:hover em {
	display:block;
	width:217px;
	height:325px;
	background-image:url(images/mapphotos/principals.gif);
}
#imap ul li.p5 a:hover em {
	display:block;
	width:278px;
	height:186px;
	background-image:url(images/mapphotos/office.gif);
}
#imap ul li.p6 a:hover em {
	display:block;
	width:280px;
	height:187px;
	background-image:url(images/mapphotos/kauri.gif);
}
#imap ul li.p7 a:hover em {
	display:block;
	width:280px;
	height:150px;
	background-image:url(images/mapphotos/sickbay.jpg);
}
#imap ul li.p8 a:hover em {
	display:block;
	width:280px;
	height:187px;
	background-image:url(images/mapphotos/kahikatea.gif);
}
#imap ul li.p9 a:hover em {
	display:block;
	width:280px;
	height:187px;
	background-image:url(images/mapphotos/kowhai.gif);
}
#imap ul li.p10 a:hover em {
	display:block;
	width:280px;
	height:210px;
	background-image:url(images/mapphotos/totara.gif);
}
#imap ul li.p11 a:hover em {
	display:block;
	width:280px;
	height:187px;
	background-image:url(images/mapphotos/rimu.gif);
}
#imap ul li.p12 a:hover em {
	display:block;
	width:280px;
	height:187px;
	background-image:url(images/mapphotos/rata.gif);
}
#imap ul li.p13 a:hover em {
	display:block;
	width:280px;
	height:187px;
	background-image:url(images/mapphotos/ruapehu.gif);
}
#imap ul li.p14 a:hover em {display:block; width:280px; height:150px; background-image:url(images/mapphotos/default.gif);}
#imap ul li.p15 a:hover em {
	display:block;
	width:280px;
	height:187px;
	background-image:url(images/mapphotos/pool.gif);
}

/* makes the link's corresponding span content display on hover */
#imap ul li a:hover span {display:block; color:#333333; background:/*#eaeee8*/; font-size:11px; line-height:18px}

/* The click image map styling */
#imap {width:815px; height:447px; background:transparent url(images/map.jpg) no-repeat scroll left top; position:relative; overflow:hidden;}
#imap ul {padding:0; margin:0; width:815px; height:447px; list-style:none;}
#imap ul li {display:inline; width:0; height:0;} /* needed for IE to function correctly */

/* positioning the clickable areas on the map */
#imap ul li a {position:absolute; display:block; cursor:default; /*background:#f93;*/ text-decoration:none;}

/* styling of onclicks and focusses and removing span text */
#imap ul li a span {display:none;}
#imap ul li a:hover {cursor:pointer;border:0px none;background-position:top right;/*background:#f60;*//*background:transparent url(../images/img/circle_map_orange_over.png) no-repeat scroll top left;*/}
#imap ul li a:active,
#imap ul li a:focus {position:relative;width:15px;height:15px;z-index:0;background-position:-30px 0px;/*position:static;width:240px;height:350px;z-index:0;text-decoration:none;/*background:transparent;*//*background:transparent url(../images/img/circle_map_red.png) no-repeat scroll top left;*/}
#imap ul li a:visited {background-position:left top;}

#imap ul li a:active span,
#imap ul li a:focus span { /*display:block; position:absolute;left:300px; top:200px; color:#fff; border:1px solid #000; background:#888; padding:5px;*/}

/*
	Specifications for container for layers to show/hide.
	Most browsers need both width and height set.
*/
#locationsContainer	{/*height:300px;*/position:relative;width:600px;z-index:100;}

/* Include id's for all your layers here, with commas between. */
#L0,#L1,#L2,#L3,#L4,#L5,#L6,#L7,#L8,#L9,#L10,#L11,#L12,#L13,#L14,#L15
{ position:absolute; visibility:hidden; left:0px; top:0px; z-index:1; }