/* Map hotspot code sourced from http://www.tankedup-imaging.com/css_dev/rollover.html */

/* Visible image map container */
#paddocks {
position: relative;
width: 800px;
height: 680px;
background: #5ae url(paddock_map_extension_800.jpg) no-repeat;
margin: 0px auto;
padding: 0;
}

/* List styling */
#paddocks li {
display: block;
position: absolute;
list-style: none;
margin: 0;
padding: 0;
}

/* Link styling */
#paddocks a {
display: block;
text-indent: -5000px;
text-decoration: none;
outline: none;
cursor: default;
}

/* Hotpot position on the image (z-index goes here) */
#Forest {left: 180px; top: 170px; }
#Hawker {top: 190px; left: 290px;}
#Central {top: 230px; left: 370px;}
#Dam {top: 260px;	left: 455px;}
#Weetangera { top: 295px;	left: 555px;}
#Eastern {top: 275px; left: 690px;}
#Kama  {top: 290px;	left: 240px;}
#Southern  {top: 395px;	left: 320px;}
#Boundary  {top: 115px;	left: 465px;}
#BP  {top: 525px;	left: 270px;}
#NKNW   {top: 70px;	left: 40px;}
#NKhome   {top: 230px;	left: 50px;}
#Extension   {top: 360px;	left: 170px;}

/* Paddock width & height */
#Forest a {width: 92px; height: 65px;}
#Hawker a {width: 75px;	height: 55px;}
#Central a {width: 75px; height: 100px;}
#Dam a {width: 70px; height: 170px;}
#Weetangera a {width: 125px; height: 95px;}
#Eastern a {width: 80px; height: 60px;}
#Kama a {width: 90px; height: 70px;}
#Southern  a {width: 135px;	height: 95px;}
#Boundary  a {width: 90px;	height: 80px;}
#BP a {width: 240px; height: 130px;}
#NKNW a {width: 125px; height: 150px;}
#NKhome a {width: 130px; height: 125px;}
#Extension a {width: 95px; height: 100px;}


/* Adding opacity to an image (libya only)
#lib a:hover {background: url(middle-east.png) -0px -364px no-repeat;
opacity: 0.6; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter: alpha(opacity=60); -moz-opacity: 0.60; -khtml-opacity: 0.6;} */

/* END Map Hotspot CODE */

/* Pop-up image code sourced from: Dynamic Drive CSS Library */
/* URL: http://www.dynamicdrive.com/style/ */

/* float-left   offsets: vertical +50px; horizontal +100px */
#paddocks .float-left{
	position: relative;
	z-index: 0;
}

#paddocks .float-left:hover{
background-color: transparent;
z-index: 50;
}

#paddocks .float-left span{ /*CSS for enlarged image*/
position: absolute;
background-color:#e5e5c3;
padding: 5px;
left: -1000px;
border: 1px dashed #cccc99;
visibility: hidden;
color: black;
text-decoration: none;
}

#paddocks .float-left span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

#paddocks .float-left:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 50px;    /* position where enlarged image should offset vertically */
left: 5100px; /* position where enlarged image should offset horizontally */
}

/* float-center   offsets: vertical +50px; horizontal -250px */
#paddocks .float-center{
position: relative;
z-index: 0;
}

#paddocks .float-center:hover{
background-color: transparent;
z-index: 50;
}

#paddocks .float-center span{ /*CSS for enlarged image*/
position: absolute;
background-color:#e5e5c3;
padding: 5px;
left: -1000px;
border: 1px dashed #cccc99;
visibility: hidden;
color: black;
text-decoration: none;
}

#paddocks .float-center span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

#paddocks .float-center:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 50px;    /* position where enlarged image should offset vertically */
left: 4850px; /* position where enlarged image should offset horizontally */
}

/* float-right   offsets: vertical +50px; horizontal -400px */
#paddocks .float-right{
position: relative;
z-index: 0;
}

#paddocks .float-right:hover{
background-color: transparent;
z-index: 50;
}

#paddocks .float-right span{ /*CSS for enlarged image*/
position: absolute;
background-color:#e5e5c3;
padding: 5px;
left: -1000px;
border: 1px dashed #cccc99;
visibility: hidden;
color: black;
text-decoration: none;
}

#paddocks .float-right span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

#paddocks .float-right:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 50px;    /* position where enlarged image should offset vertically */
left: 4700px; /* position where enlarged image should offset horizontally */
}


/* float-left-up   offsets: vertical -30px; horizontal 100px */
#paddocks .float-left-up{
position: relative;
z-index: 0;
}

#paddocks .float-left-up:hover{
background-color: transparent;
z-index: 50;
}

#paddocks .float-left-up span{ /*CSS for enlarged image*/
position: absolute;
background-color:#e5e5c3;
padding: 5px;
left: -1000px;
border: 1px dashed #cccc99;
visibility: hidden;
color: black;
text-decoration: none;
}

#paddocks .float-left-up span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

#paddocks .float-left-up:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: -30px;    /* position where enlarged image should offset vertically */
left: 5100px; /* position where enlarged image should offset horizontally */
}

/* float-left-up200   offsets: vertical -150px; horizontal 100px */
#paddocks .float-left-up200{
position: relative;
z-index: 0;
}

#paddocks .float-left-up200:hover{
background-color: transparent;
z-index: 50;
}

#paddocks .float-left-up200 span{ /*CSS for enlarged image*/
position: absolute;
background-color:#e5e5c3;
padding: 5px;
left: -1000px;
border: 1px dashed #cccc99;
visibility: hidden;
color: black;
text-decoration: none;
}

#paddocks .float-left-up200 span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

#paddocks .float-left-up200:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: -150px;    /* position where enlarged image should offset vertically */
left: 5100px; /* position where enlarged image should offset horizontally */
}