/* Superior Energy CSS Hover Styles for Javascript (when .htc file is not supported */

/******* Set the displays */

#navIR {
  float: left;
  clear: left;
  display: inline;
  width: 986px;
  height: 26px;
  margin: 10px 0px 0px 6px;
  z-index: 6000;
}

#navIR ul {
  margin: 0px;
  padding: 0px;
  list-style: none;
  width: 986px;
  height: 26px;
  z-index: 6000;
}

#navIR ul li {
  /*float the main list items*/
  float: left;
  display: block;
  position: relative;
  margin: 0px;
  padding: 0px;
  z-index: 6000;
}

#navIR ul li.off ul, 
#nav ul li.on ul {
  /*hide the subnavs*/
  display: none;
  z-index: 6000;
}

#navIR ul li a {
  /*for all links in the list*/
  display: block;
  position: relative;
  height: 26px;
  padding: 0px;
	background-position: top;
}

/* Link Styles */

#navIR ul li.navAboutIR a {
  width: 107px;
  background-image: url("../image/nav_about.jpg");
}

#navIR ul li.navGlobalIR a {
  width: 168px;
  background-image: url("../image/nav_global.jpg");
}

#navIR ul li.navProductsIR a {
  width: 181px;
  background-image: url("../image/nav_services.jpg");
}

#navIR ul li.navSubsidiariesIR a {
  width: 138px;
  background-image: url("../image/nav_subsidiaries.jpg");
}
#navIR ul li.navRelationsIR a {
  width: 165px;
  background-image: url("../image/nav_relations.jpg");
}

#navIR ul li.navCareersIR a {
  width: 101px;
  background-image: url("../image/nav_careers.jpg");
}

#navIR ul li.navContactIR a {
  width: 120px;
  background-image: url("../image/nav_contact.jpg");
}

#navIR ul li a span {
  display: none;
}



/******* Position our second nav level below the main list */

#navIR ul li.navAboutIR ul,
#navIR ul li.navProductsIR ul,
#navIR ul li.navGlobalIR ul,
#navIR ul li.navSubsidiariesIR ul,
#navIR ul li.navRelationsIR ul {
  /*put the subnavs below and hide them all*/
  display: none;
  float: none;
  position: absolute;
  top: 26px;
  margin: 0px;
  padding: 0px;
  list-style: none;
  width: 180px; 
  height: auto;
  border: solid 1px #ffffff;
  background-color: #355a77;
  z-index: 6000;
}

#navIR ul li.navAboutIR ul li,
#navIR ul li.navProductsIR ul li,
#navIR ul li.navGlobalIR ul li,
#navIR ul li.navSubsidiariesIR ul li,
#navIR ul li.navRelationsIR ul li {
  float: none;
  margin: 0px;
  z-index: 6000;
  background-color: #345f81;
}


/******* Style the "on" states */

#navIR ul li.on a {
	background-position: bottom;
}
#navIR ul li.navRelationsIR a {
	background-position: bottom;
}

#navIR ul li.on ul {
  /*display active subnav list*/
  display: block;
  z-index: 6000;
}

/******* Activate the rollover */

#navIR ul li.navAboutIR ul a,
#navIR ul li.navProductsIR ul a,
#navIR ul li.navGlobalIR ul a,
#navIR ul li.navSubsidiariesIR ul a,
#navIR ul li.navRelationsIR ul a {
  display: block;
  width: 170px;
  height: auto;
  font-family: arial, helvetica, sans-serif;
  font-size: 11px;
  line-height: 16px;
  padding: 2px 4px;
  margin: 0px;
  color: #ddeeff;
  border-top: solid 1px #446688;
  background-image: none;
  letter-spacing: 0px;
  text-decoration: none;
  z-index: 6000;
} 

#navIR ul li ul li a:hover {
  color: #7799cc;
  text-decoration: none;
  background: url("../image/nav_bg_hover.jpg") top repeat-x;
  background-position: top;
  z-index: 6000;
}

/* Display the current topic */
#navIR ul li.on ul {
  display: block;
  z-index: 6000;
}

/* Display the other topics when their parent is hovered */
#navIR ul li.off:hover ul {
  display: block;
  z-index: 6000;
}


/******* Put the subnav below */

#navIR ul li.off ul, 
#navIR ul li.on ul {
  top: 26px;
  left: 0px;
}


/******* Add the class "hover" to list items that require it */

#navIR ul li.off:hover ul, 
#navIR ul li.over ul { 
  display: block;
  z-index: 6000;
}

#navIR ul li.off a:hover,
#navIR ul li:hover a,
#navIR ul li.over a {
  background-position: bottom;
}
