/* --------------------------- Main body/container styles ------------------------- */

body {
  position: absolute;
  font-family: verdana, sans-serif;
  font-size: 9.0pt;
  background: white;
  color: black;
  width: 100%;
  margin: 0;
}

#container {
/* Uncomment the following to center the page: */
/*  margin: auto; */
  background: white;
  position: relative;
  width: 780px;
}


/* -------------------------------- Default styles -------------------------------- */

input.text, input.password {
  width: 250px;
}
textarea {
  width: 250px;
}

.info-message {
  background: #dee1e8;
  padding: 5px 10px 5px 10px;
  border: 1px solid #8b8ba1;
}

.alert-message {
  background: #ecebf0;
  padding: 5px 10px 5px 10px;
  color: red;
}

.action-paragraph {
  font-size: 8pt;
  text-align: right;
  clear: both;
}

hr {
  width: 30%;
  background: #888;
  border: none;
  height: 1px;
}

br.clear {
  clear: both;
}

img.right {
  float: right;
  margin: 0 0 10px 10px;
}

img.left {
  float: left;
  margin: 0 10px 10px 0;
}

img.block { }

h1,h2 {
  color: #7c1f00;
  font-family: "Times New Roman", times, serif;
  font-weight: normal;
  letter-spacing: 4px;
  margin-bottom: 15px;
  margin-top: 20px;
}

h1 { font-size: 200%; }

h2 { font-size: 210%; }

h3,h4 {
  color: #75797c;
  font-family: arial;
  letter-spacing: 4px;
  margin-top: 20px;
  font-weight: bold;
}

h3 {
  font-variant: small-caps;
  font-size: 130%;
}

h4 {
  font-size: 100%;
  margin-left: 15px;
}

h5 {
  color: #383a3c
}

ul {
  padding-left: 40px;
  margin-left: 0;
}
  ul li {
    margin-bottom: 1px;
    padding-left: 10px;
    list-style-position: inside;
  }

ul.links-list {
  list-style-type: none;
}
.links-list li {
}

a {
  color: #24389f;
  text-decoration: underline;
}

li a {
  color: #24387f;
  text-decoration: none;
}

a:visited {
  color: #45a;
}

li a:visited {
  color: #678;
}

a:hover {
  text-decoration: none;
}

li a:hover {
  text-decoration: underline;
}

a:active {
  text-decoration: none;
}

img {
  border: none;
}


/* -------------------------------- Header styles --------------------------------- */

#header {
  position: absolute;
  top: 0px;
  left: 25px;
  height: 211px;
  width: 736px;
  z-index: 1;
}
  #header-left {
    width: 210px;
    width: 210px;
    height: 100%;
    position: absolute;
    left: -10px;
    background: white url(../images/header-left.jpg) no-repeat;
  }
  #header-right {
    position: absolute;
    right: 0px;
    width: 526px;
    height: 100%;
    background: white url(../images/header-right.gif) no-repeat;
    background-position: right top;
  }


/* ------------------------------- Main menu styles ------------------------------- */

#mainMenu {
  position: absolute;
  width: 189px;
  _width: 173px;
  padding-top: 60px;
  left: 25px;
  top: 233px;
  overflow: visible;
  border-right: 1px solid #8b8ba1;
  border-left: 1px solid #8b8ba1;
  background: url(../images/mainMenuBackground.jpg) no-repeat;
  background-position: 2px 0;
}
  #mainMenu .header {
    position: absolute;
    top: 0px;
    width: 191px;
    height: 47px;
    background: url(../images/mainMenuHeader.jpg) no-repeat;
    margin-left: -1px;
    padding-top: 15px;
    text-align: right;
  }
  #mainMenu .footer {
    position: relative;
    width: 191px;
    height: 42px;
    background: white url(../images/mainMenuFooter.gif) no-repeat;
    margin-left: -1px;
    .margin-right: -1px;
  }

#mainMenu h3 {
  color: #741b19;
  margin: 0 10 0 0;
  font-size: 13.5pt;
  letter-spacing: 1px;
  font-weight: normal;
  font-family: "Times New Roman", times, serif;
  display: none;
}

#mainMenu ul {
  list-style-type: none;
  margin: 0 13px 42px 23px;
  padding: 0;
  .margin-left: 0px;
  .padding-left: 23px;
  .margin-right: 28px;
  _margin-right: 13px;
}

#mainMenu li {
  height: 21px;
  line-height: 21px;
  width: 100%;
  text-align: right;
  margin: 0;
  padding: 0;
  border-bottom: 1px solid #959aa6;
}

#mainMenu li.background1 { border-bottom: 1px solid #959aa6; }
#mainMenu li.background2 { border-bottom: 1px solid #9ba0b0; }
#mainMenu li.background3 { border-bottom: 1px solid #a5aab6; }
#mainMenu li.background4 { border-bottom: 1px solid #a5aab6; }
#mainMenu li.background5 { border-bottom: 1px solid #abb0c0; }
#mainMenu li.background6 { border-bottom: 1px solid #abb0c0; }
#mainMenu li.background7 { border-bottom: 1px solid #b5bac0; }
#mainMenu li.background8 { border-bottom: 1px solid #b5bac0; }
#mainMenu li.background9 { border-bottom: 1px solid #bbc0ca; }
#mainMenu li.background10 { border-bottom: 1px solid #bbc0ca; }

#mainMenu li .connector {
  position: absolute;
  right: 0px;
  margin-top: -984px;
  margin-right: -30px;
  _margin-right: -31px;
  background-image: url(../images/menuConnectorBottom.png);
  background-repeat: no-repeat;
  background-position: right bottom;
  width: 29px;
  height: 1000px;
}

#mainMenu a {
  background-position: right top;
  background-repeat: no-repeat;
  display: block;
  height: 100%;
  width: 100%;
  color: #484c55;
  text-decoration: none;
}

#mainMenu a:visited {
}

#mainMenu li.background1 a:hover { background-image: url(../images/mainMenuActiveLink1.jpg); }
#mainMenu li.background2 a:hover { background-image: url(../images/mainMenuActiveLink2.jpg); }
#mainMenu li.background3 a:hover { background-image: url(../images/mainMenuActiveLink3.jpg); }
#mainMenu li.background4 a:hover { background-image: url(../images/mainMenuActiveLink4.jpg); }
#mainMenu li.background5 a:hover { background-image: url(../images/mainMenuActiveLink5.jpg); }
#mainMenu li.background6 a:hover { background-image: url(../images/mainMenuActiveLink6.jpg); }
#mainMenu li.background7 a:hover { background-image: url(../images/mainMenuActiveLink7.jpg); }
#mainMenu li.background8 a:hover { background-image: url(../images/mainMenuActiveLink8.jpg); }
#mainMenu li.background9 a:hover { background-image: url(../images/mainMenuActiveLink9.jpg); }
#mainMenu li.background10 a:hover { background-image: url(../images/mainMenuActiveLink10.jpg); }

#mainMenu a:active {
}


/* -------------------------------- Sub menu styles ------------------------------- */

#subMenu {
  position: absolute;
  top: 233px;
  left: 284px;
  background: white url(../images/subMenuBackground.jpg) no-repeat;
  background-position: 0 -50px;
  height: auto;
  width: 460px;
  border: 1px solid #8b8ba1;
  overflow: visible;
  text-align: center;
  font-family: arial;
  font-size: 10.5pt;
}
  #subMenu .container {
    height: 100%;
    overflow: hidden;
  }
  #subMenu .container * {
    vertical-align: middle;
  }
  #subMenu .connector {
    position: absolute;
    left: 0px;
    margin-top: -23px;
    margin-left: -53px;
    background-image: url(../images/menuConnectorTop.png);
    background-repeat: no-repeat;
    background-position: left top;
    width: 52px;
    height: 50px;
  }
  #subMenu .corner {
    position: absolute;
    width: 20px;
    height: 20px;
  }
  #subMenu .corner.TL { margin: -2px 0 0 -2px; top: 0px; left: 0px; background: url(../images/subMenuTL.gif) no-repeat; }
  #subMenu .corner.TR { margin: -2px -2px 0 0; top: 0px; right: 0px; background: url(../images/subMenuTR.gif) no-repeat; }
  #subMenu .corner.BR { margin: 0 -2px -2px 0; bottom: 0px; right: 0px; background: url(../images/subMenuBR.gif) no-repeat; }
  #subMenu .corner.BL { margin: 0 0 -2px -2px; bottom: 0px; left: 0px; background: url(../images/subMenuBL.gif) no-repeat; }

#subMenu a {
  color: #34488f;
  margin: 0 10px 0 10px;
  display: -moz-inline-box;
  font-size: 85%;
  letter-spacing: 3px;
  font-weight: bold;
  text-decoration: none;
  line-height: 40px;
  padding: 13px 10px 13px 10px;
  .display: inline-block;
  .line-height: 20px;
  .padding: 10px 10px 10px 10px;
  _height: 0;
}

#subMenu a:visited {
  color: #34488f;
}

#subMenu a:hover {
  background: #00236a;
  color: white;
  filter: alpha(opacity=25);
  opacity: 0.250;
  -moz-opacity: 0.250;
}

#subMenu a:active {
  filter: alpha(opacity=40);
  opacity: 0.400;
  -moz-opacity: 0.400;
}


/* -------------------------------- Content styles -------------------------------- */

#content {
  position: absolute;
  left: 284px;
  top: 276px;
  width: 460px;
  margin-top: 30px;
  padding-bottom: 30px;
}
#content.no-sub-menu {
  top: 236px;
  margin-top: 0;
}

#content p {
  margin-top: 15px;
}


/* --------------------------------- Footer styles -------------------------------- */

#source-link {
  color: gray;
  font-size: 7pt;
  padding-top: 60px;
  text-align: center;
  padding-bottom: 20px;
}
  #source-link a {
    color: gray;
    text-decoration: underline;
  }
  #source-link a:hover {
  }



/* ---------------------------------- NZ Map styles -------------------------------- */

#map {
  position: relative;
  margin-top: 180px;
  margin-left: -50px;
  width: 450px;
  height: 650px;
  background: url(../images/nz-map.jpg) no-repeat;
  overflow: visible;
}

#map .city, #map .city .city {
  position: absolute;
  background: transparent url(../images/red-dot.gif) no-repeat;
  width: 12px;
  height: 12px;
  overflow: visible;
}

#map .city a {
  color: #24387f;
  text-decoration: none;
}

#map .city a:visited {
  color: #678;
}

#map .city a:hover {
  text-decoration: underline;
}

#map .city .pointer, #map .city .city .pointer {
  position: absolute;
  z-index: 1;
  height: 46px;
  width: 25px;
  overflow: visible;
}
#map .up-left .pointer, #map .city .up-left .pointer {
  left: auto;
  top: auto;
  right: 5px;
  bottom: 5px;
  background: transparent url(../images/bubble-pointer-up-left.gif) no-repeat;
}

#map .up-right .pointer, #map .city .up-right .pointer {
  right: auto;
  top: auto;
  left: 5px;
  bottom: 5px;
  background: transparent url(../images/bubble-pointer-up-right.gif) no-repeat;
}

#map .down-left .pointer, #map .city .down-left .pointer {
  left: auto;
  bottom: auto;
  right: 5px;
  top: 5px;
  background: transparent url(../images/bubble-pointer-down-left.gif) no-repeat;
}

#map .down-right .pointer, #map .city .down-right .pointer {
  right: auto;
  bottom: auto;
  left: 5px;
  top: 5px;
  background: transparent url(../images/bubble-pointer-down-right.gif) no-repeat;
}

#map .large .pointer, #map .city .large .pointer {
  height: 99px;
  width: 60px;
}

#map .large-up-left .pointer, #map .city .large-up-left .pointer {
  right: 5px;
  bottom: 5px;
  background: transparent url(../images/bubble-pointer-large-up-left.gif) no-repeat;
}

#map .large-up-right .pointer, #map .city .large-up-right .pointer {
  left: 5px;
  bottom: 5px;
  background: transparent url(../images/bubble-pointer-large-up-right.gif) no-repeat;
}

#map ..large-down-left .pointer, #map .city .large-down-left .pointer {
  right: 5px;
  top: 5px;
  background: transparent url(../images/bubble-pointer-large-down-left.gif) no-repeat;
}

#map .large-down-right .pointer, #map .city .large-down-right .pointer {
  left: 5px;
  top: 5px;
  background: transparent url(../images/bubble-pointer-large-down-right.gif) no-repeat;
}


#map .city .info, #map .city .city .info {
  position: absolute;
  padding: 3px 6px 3px 6px;
  font-size: 9pt;
  border: 1px solid black;
  background: white;
  width: auto;
  z-index: 0;
}
#map .info .sub-image {
  position: relative;
  margin: 5px;
}
#map .large .info, #map .city .large .info {
  padding: 5px;
}
#map .info img { border: 2px solid black; }
#map .city .info a { display: block; }

#map .caption {
  font-weight: bold;
}

#map .up-left .info, #map .city .up-left .info {
  left: auto;
  top: auto;
  right: 5px;
  bottom: 50px;
}

#map .up-right .info, #map .city .up-right .info {
  right: auto;
  top: auto;
  left: 5px;
  bottom: 50px;
}

#map .down-left .info, #map .city .down-left .info {
  left: auto;
  bottom: auto;
  right: 5px;
  top: 50px;
}

#map .down-right .info, #map .city .down-right .info {
  right: auto;
  bottom: auto;
  left: 5px;
  top: 50px;
}

#map .small-up-left .info, #map .city .small-up-left .info {
  top: auto;
  left: auto;
  right: 7px;
  bottom: 7px;
}

#map .small-up-right .info, #map .city .small-up-right .info {
  top: auto;
  right: auto;
  left: 7px;
  bottom: 7px;
}

#map .small-down-left .info, #map .city .small-down-left .info {
  bottom: auto;
  left: auto;
  right: 7px;
  top: 7px;
}

#map .small-down-right .info, #map .city .small-down-right .info {
  bottom: auto;
  right: auto;
  left: 7px;
  top: 7px;
}

#map .large-up-left .info, #map .city .large-up-left .info {
  right: 20px;
  bottom: 103px;
}

#map .large-up-right .info, #map .city .large-up-right .info {
  left: 20px;
  bottom: 103px;
}

#map .large-down-left .info, #map .city .large-down-left .info {
  right: 20px;
  top: 103px;
}

#map .large-down-right .info, #map .city .large-down-right .info {
  left: 20px;
  top: 103px;
}

