/*The Oxygen Store StyleSheet dropdown menu*/

.menu{
	width: 773px;
	height: 40px;
	font-family:  Tahoma;
	font-size: small;
	margin: 0px;
	position:relative;
	z-index:100;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding: 0px;
	background: #FFFFFF url(../images/bk_menubig.jpg) no-repeat
}

/* hack to correct IE5.5 faulty box model */
* html .menu {
width:774px; 
w\idth:773px
}
/* remove all the bullets, borders and padding from the default list styling */
.menu ul {
padding:0;
margin:0;
list-style-type:none
}
.menu ul ul {
width:180px
}
.btwn{
height: 25px;
padding:15px 12px 0px 12px;
line-height: 1em; 
}
* html .bwtn, * html .btwn {
margin: 0px;
}
.nws{
padding-right: 21px;
padding-left: 24px;
}

/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li {
float:left;
width: auto;
position:relative

}
/* style the links for the top level */
.menu ul a, .menu ul a:visited {
display:block;
text-decoration:none; 
color:#F8F8F8;
width:auto;
height:25px;
font-size: 90%; 
padding: 15px 11px 0px 11px;
line-height: 1em;
font-weight: bold
}

.menu a.press, .menu a.press:visited {
width: 136px
}
.menu a.benefits, .menu a.benefits:visited {
width: 120px
}
.menu a.salon, .menu a.salon:visited {
width: 85px
}
.menu a.commercial, .menu a.commercial:visited {
width: 120px
}
.menu a.products, .menu a.products:visited {
width: 70px
}
/* a hack so that IE5.5 faulty box model is corrected widths needed for IE6 */
* html .menu a, * html .menu a:visited {
width:109px; 
w\idth:98px;
}

/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {
visibility:hidden;
position:absolute;
height:0;
top:40px;
left:0;
width: 180px
}
/* another hack for IE5.5 */
* html .menu ul ul {
top:40px;
t\op:40px
}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.menu table {
position:absolute;
top:0;
left:0;
border-collapse:collapse;;
}

/* style the second level links */
.menu ul ul a, .menu ul ul a:visited {
background:#E1F5FE;
color:#0073AB;
height:auto;
font-weight: bold;
font-size: 85%;
line-height: 1em;
padding: 5px 10px 5px 10px;
width:180px;
border: 1px solid #0073AA;
border-width:0px 1px 1px 1px
}

/* yet another hack for IE5.5 */
* html .menu ul ul a, * html .menu ul ul a:visited {
width:180px;
w\idth:158px
}

/* style the top level hover */
.menu ul a:hover{
color:#003651;
padding: 15px 11px 0px 11px;
font-size: 85%;
background: url(../images/bk_menumid.jpg) repeat-x
}

.menu ul a:hover > a{
color:#003651;
padding: 15px 11px 0px 11px;
font-size: 85%;
background: url(../images/bk_menumid.jpg) repeat-x
}

.menu ul ul a:hover{
color:#003651;
padding: 5px 10px 5px 10px;
background: url(../images/bk_drop.gif) repeat-x

}

.menu ul ul a:hover > a{
color:#003651;
padding: 5px 10px 5px 10px;
background: url(../images/bk_drop.gif) repeat-x;
}

/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul, .menu ul a:hover ul{
visibility:visible
}
