/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/final_drop.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

#menu {
width:696px; 
font-size:11px;
position:relative;
z-index:99;
}
/* 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:116px;
}
/* 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:116px;
position:relative;
}
/* style the links for the top level */

#menu a, #menu a:visited {
display:block;
font-size:11px;
text-decoration:none;
text-align: center;
color:#000;
width:116px; 
height:41px;
border-color: #999999;
border-style:solid;
border-width:0px 0px 0px 0px; 
background-color: #FFFFFF; 
padding-left:0px;
margin:0;
line-height: 13px;
}

/* ---- Preload over images for navigation ---- */

.home_image {
	width: 1px;
	height: 1px;
	position: absolute;
	left: -10000px;
	background-image: url(/images/nav_2v1/nav_2v1_over_05.jpg);
}

.the_company_image {
	width: 1px;
	height: 1px;
	position: absolute;
	left: -10000px;
	background-image: url(/images/nav_2v1/nav_2v1_over_06.jpg);
}

.the_product_image {
	width: 1px;
	height: 1px;
	position: absolute;
	left: -10000px;
	background-image: url(/images/nav_2v1/nav_2v1_over_07.jpg);
}

.shop_image {
	width: 1px;
	height: 1px;
	position: absolute;
	left: -10000px;
	background-image: url(/images/nav_2v1/nav_2v1_over_08.jpg);
}

.contact_image {
	width: 1px;
	height: 1px;
	position: absolute;
	left: -10000px;
	background-image: url(/images/nav_2v1/nav_2v1_over_09.jpg);
}

.misc_image {
	width: 1px;
	height: 1px;
	position: absolute;
	left: -10000px;
	background-image: url(/images/nav_2v1/nav_2v1_over_10.jpg);
}

.brush_bkgd_image {
	width: 1px;
	height: 1px;
	position: absolute;
	left: -10000px;
	background-image: url(/images/nav_2v1/nav_2v1_bkgd.jpg);
}

.brush_cap_image {
	width: 1px;
	height: 1px;
	position: absolute;
	left: -10000px;
	background-image: url(/images/nav_2v1/nav_2v1_bkgd_bottom.jpg);
}


/*  First level images and over_images */

#menu a .home, #menu a:visited .home{
display:block;
position:absolute;
width:116px; 
height:41px;
background-image: url(/images/nav_2v1/nav_2v1_05.jpg);
background-repeat:no-repeat;
padding: 0;
margin: 0;
left: 0px;
top: 0px;
}

#menu a:hover .home, #menu a:active .home{
display:block;
position:absolute;
width:116px; 
height:41px;
background-image: url(/images/nav_2v1/nav_2v1_over_05.jpg);
background-repeat:no-repeat;
padding: 0;
margin: 0;
left: 0px;
top: 0px;
}

#menu a .the_company, #menu a:visited .the_company{
display:block;
position:absolute;
width:116px; 
height:41px;
background-image: url(/images/nav_2v1/nav_2v1_06.jpg);
background-repeat:no-repeat;
padding: 0;
margin: 0;
left: 0px;
top: 0px;
}

#menu a:hover .the_company, #menu a:active .the_company{
display:block;
position:absolute;
width:116px; 
height:41px;
background-image: url(/images/nav_2v1/nav_2v1_over_06.jpg);
background-repeat:no-repeat;
padding: 0;
margin: 0;
left: 0px;
top: 0px;
}

#menu a .the_product, #menu a:visited .the_product{
display:block;
position:absolute;
width:116px; 
height:41px;
background-image: url(/images/nav_2v1/nav_2v1_07.jpg);
background-repeat:no-repeat;
padding: 0;
margin: 0;
left: 0px;
top: 0px;
}

#menu a:hover .the_product, #menu a:active .the_product{
display:block;
position:absolute;
width:116px; 
height:41px;
background-image: url(/images/nav_2v1/nav_2v1_over_07.jpg);
background-repeat:no-repeat;
padding: 0;
margin: 0;
left: 0px;
top: 0px;
}

#menu a .shop, #menu a:visited .shop {
display:block;
position:absolute;
width:116px; 
height:41px;
background-image: url(/images/nav_2v1/nav_2v1_08.jpg);
background-repeat:no-repeat;
padding: 0;
margin: 0;
left: 0px;
top: 0px;
}

#menu a:hover .shop, #menu a:active .shop{
display:block;
position:absolute;
width:116px; 
height:41px;
background-image: url(/images/nav_2v1/nav_2v1_over_08.jpg);
background-repeat:no-repeat;
padding: 0;
margin: 0;
left: 0px;
top: 0px;
}

#menu a .contact, #menu a:visited .contact{
display:block;
position:absolute;
width:116px; 
height:41px;
background-image: url(/images/nav_2v1/nav_2v1_09.jpg);
background-repeat:no-repeat;
padding: 0;
margin: 0;
left: 0px;
top: 0px;
}

#menu a:hover .contact, #menu a:active .contact{
display:block;
position:absolute;
width:116px; 
height:41px;
background-image: url(/images/nav_2v1/nav_2v1_over_09.jpg);
background-repeat:no-repeat;
padding: 0;
margin: 0;
left: 0px;
top: 0px;
}

#menu a .misc, #menu a:visited .misc{
display:block;
position:absolute;
width:116px; 
height:41px;
background-image: url(/images/nav_2v1/nav_2v1_10.jpg);
background-repeat:no-repeat;
padding: 0;
margin: 0;
left: 0px;
top: 0px;
}

#menu a:hover .misc, #menu a:active .misc{
display:block;
position:absolute;
width:116px; 
height:41px;
background-image: url(/images/nav_2v1/nav_2v1_over_10.jpg);
background-repeat:no-repeat;
padding: 0;
margin: 0;
left: 0px;
top: 0px;
}

/* a hack so that IE5.5 faulty box model is corrected */
* html #menu a, * html #menu a:visited {
width:116px;
w\idth:116px;
}

/* style the second level background */
#menu ul ul a.drop, #menu ul ul a.drop:visited {
background:#d4d8bd url(../../graphics/drop.gif) bottom right no-repeat;

}
/* style the second level hover */
#menu ul ul a.drop:hover{
background:#c9ba65 url(../../graphics/drop.gif) bottom right no-repeat;
}
#menu ul ul :hover > a.drop {
background:#c9ba65 url(../../graphics/drop.gif) bottom right no-repeat;
}
/* style the third level background */
#menu ul ul ul a, #menu ul ul ul a:visited {
background:#e2dfa8;
}
/* style the third level hover */
#menu ul ul ul a:hover {
background:#b2ab9b;
}


/* 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:41px;
left:0; 
width:116px;
}
/* another hack for IE5.5 */
* html #menu ul ul {
top:41px;
t\op:41px;
}

/* position the third level flyout menu */
#menu ul ul ul{
left:116px; 
top:0;
width:116px;
}
/* position the third level flyout menu for a left flyout */
#menu ul ul ul.left {
left:-116px;
}

/* style the table so that it takes no part in the layout - required for IE to work */
#menu table {position:absolute; top:0; left:0;}

/* style the second level links */
#menu ul ul a, #menu ul ul a:visited {
font-weight: normal;
color:#666666; 
height:auto; 
line-height:1em;
border-color:#CCCCCC;
border-style:solid;
border-width:1px 1px 0px 1px; 
padding:5px 0px;
width:115px;
background-image: url(/images/nav_2v1/nav_2v1_bkgd.jpg);
}

/* yet another hack for IE5.5 */
* html #menu ul ul a{
width:116px;
w\idth:115px;
}

#menu ul ul a.bottom, #menu ul ul a.bottom:visited {
	background-image: url(/images/nav_2v1/nav_2v1_bkgd_bottom.jpg);
	bottom: 0px;
}

#menu ul ul a.bottom:hover{
color:#FFFFFF; 
background-color: #CCCCCC;
background-image: none;
font-weight: bold;
}

#menu ul ul :hover > a.bottom {
color:#FFFFFF; 
background-color: #CCCCCC;
background-image: none;
font-weight: bold;
}


/* style the top level hover */
#menu a:hover, #menu ul ul a:hover{
color:#FFFFFF; 
background-color: #CCCCCC;
background-image: none;
font-weight: bold;
}

#menu :hover > a, #menu ul ul :hover > a {
color:#FFFFFF;
background-color: #CCCCCC;
background-image: none;
font-weight: bold;
}


/* 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; 
}
/* keep the third level hidden when you hover on first level list OR link */
#menu ul :hover ul ul{
visibility:hidden;
}

/* make the third level visible when you hover over second level list OR link */
#menu ul :hover ul :hover ul{ 
visibility:visible;
}

/* ---------------- business_menu formating ---------------- */

.business_menu a #your_business_drop, business_menu a:visited #your_business_drop {
display:block;
position:absolute;
height: 32px;
width: 161px;
background-image: url(/images/your_business_drop.jpg);
background-repeat:no-repeat;
padding: 0;
margin: 0;
left: 0px;
top: 0px;
}

.business_menu a:hover #your_business_drop, business_menu a:active #your_business_drop {
display:block;
position:absolute;
height: 32px;
width: 161px;
background-image: url(/images/your_business_drop_over.gif);
background-repeat:no-repeat;
padding: 0;
margin: 0;
left: 0px;
top: 0px;
}

.business_menu {
width:160px; 
font-size:0.85em;
position:relative;
top: 60px;
left: 30px;
z-index:99;
}

/* remove all the bullets, borders and padding from the default list styling */
.business_menu ul {
padding:0;
margin:0;
list-style-type: none;
list-style-image: none;
}
.business_menu ul ul {
width:160px;
}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.business_menu li {
float:left;
width:160px;
position:relative;
list-style-type: none;
list-style-image: none;
}
/* style the links for the top level */
.business_menu a, .business_menu a:visited {
display:block;
font-size:11px;
text-decoration:none; 
color:#000; 
width:149px; 
height:30px;
border-color:#CCCCCC;
border-style:solid;
border-width:1px 1px 1px 1px; 
background-color: #FFFFFF; 
padding-left:10px; 
line-height:29px;
}
/* a hack so that IE5.5 faulty box model is corrected */
* html .business_menu a, * html .business_menu a:visited {
width:160px;
w\idth:149px;
}

/* style the second level background */
.business_menu ul ul a.drop, .business_menu ul ul a.drop:visited {
background:#d4d8bd url(../../graphics/drop.gif) bottom right no-repeat;

}
/* style the second level hover */
.business_menu ul ul a.drop:hover{
background:#c9ba65 url(../../graphics/drop.gif) bottom right no-repeat;
}
.business_menu ul ul :hover > a.drop {
background:#c9ba65 url(../../graphics/drop.gif) bottom right no-repeat;
}
/* style the third level background */
.business_menu ul ul ul a, .business_menu ul ul ul a:visited {
background:#e2dfa8;
}
/* style the third level hover */
.business_menu ul ul ul a:hover {
background:#b2ab9b;
}


/* hide the sub levels and give them a positon absolute so that they take up no room */
.business_menu ul ul {
visibility:hidden;
position:absolute;
height:0;
top:31px;
left:0; 
width:160px;
}
/* another hack for IE5.5 */
* html .business_menu ul ul {
top:30px;
t\op:31px;
}

/* position the third level flyout menu */
.business_menu ul ul ul{
left:160px; 
top:0;
width:160px;
}
/* position the third level flyout menu for a left flyout */
.business_menu ul ul ul.left {
left:-160px;
}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.business_menu table {position:absolute; top:0; left:0;}

/* style the second level links */
.business_menu ul ul a, .business_menu ul ul a:visited {
background-color: #EEEEEE; 
color:#000; 
height:auto; 
line-height:1em; 
padding:5px 10px;
width:139px
/* yet another hack for IE5.5 */
}
* html .business_menu ul ul a{
width:160px;
w\idth:139px;
}


/* style the top level hover */
.business_menu a:hover, .business_menu ul ul a:hover{
color:#fff; 
background-color: #0033FF;
}
.business_menu :hover > a, .business_menu ul ul :hover > a {
color:#fff;
background: #0033FF;
}

/* make the second level visible when hover on first level list OR link */
.business_menu ul li:hover ul,
.business_menu ul a:hover ul{
visibility:visible; 
}
/* keep the third level hidden when you hover on first level list OR link */
.business_menu ul :hover ul ul{
visibility:hidden;
}

/* make the third level visible when you hover over second level list OR link */
.business_menu ul :hover ul :hover ul{ 
visibility:visible;
}