/*
	******************** SUCKERFISH MENU ******************** 
	
	CONTENTS:
	1. Default Styles - These should not need to be altered.  They only set defaults for menu items and allow the hover functionality
	2. Layout Styles - These set the overall layout of the menu structure.
	
*/

/*
****************************************************
     BEGIN MENU CUSTOMIZATION
****************************************************
This targets a UL with an ID of #SFNav.  Change that to target a different ID name.
*/


/* ROOT MENU / ALL ITEMS (Defaults) */

#SFNav {
	height:34px; /* Height of ROOT Menu */
	font-size:12px;
}

#SFNav a {
	/*
		Applies to ALL Menu Items (Root and Sub)
		Total Height = height + vertical padding + vertical border + vertical margin
		Total Height should = #SFNav height
	*/
	height:34px; 
	padding:0px;
	/* FIX FOR IE 8 */
	/*
	width:100%;
	height:100%;
	*/
}

#SFNav li {
	/*
		Applies to ALL Menu Items (Root and Sub)
		Specify width of menu items.
		width:auto; will shrink menu items to fit
		width:100px will cause every root item and every sub-menu to be 100px wide regardless of text content
	*/
	/*width:auto;*/
}

/* SUB MENUS */

#SFNav li ul li a {
	/*
		Applies to SUB-MENUS only
		Total Height = height + vertical padding + vertical border + vertical margin
	*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: bold;
	height:14px;
	padding:4px 10px;
}

#SFNav li ul,
#SFNav li ul li {
	/*
		Applies to SUB-MENUS only
		specifies width of all sub-menu items
	*/
	width:223px;
}

/* THIRD LEVEL MENUS */

#SFNav li ul ul {
	/*
		Applies to LEVEL 3 OR GREATER sub menus only
		margin-top = total height of parent menu item
		margin-right = total width of parent menu item
	*/
	margin-top: -21px;
	margin-bottom: 0px;
	margin-left: 223px;
	margin-right: 0px;
}


/*
	COSMETIC SETTINGS
	The following settings should only affect appearance and not layout
	EXCEPTION: The addition of border sizes may modify heights.  If borders are added, margins on correct items may also need to be altered.
*/

/* Main Menu */
#SFNav {
	/*background-color:gray;*/
}

/* Sub Menu */
#SFNav li ul {
	border-top:1px solid #dddddd;
	width: 224px;
}

/* Sub Menu List Item */
#SFNav li ul li {
	background-color:#666666;
	border-bottom:1px solid #dddddd;
	border-right:1px solid #dddddd;
	border-left:1px solid #dddddd;
}

/* Sub Menu Link */
#SFNav a:link,
#SFNav a:active,
#SFNav a:visited,
#SFNav a:hover {
	color: #ffffff;
}

.wideitem {
width: 230px;
}

/* ALL Menu Links on Hover */
#SFNav a:hover {
	background-color: #333333;
	color: #dddddd;
}

/* Sub Menu Links on Hover */

#SFNav ul a:hover {
	background-color: #333333;
	color: #dddddd;
}

/*
Root Menu Widths
*/

#SFNav .root_item_1 {width:106px;}
#SFNav .root_item_2 {width:125px;}
#SFNav .root_item_3 {width:159px;}
#SFNav .root_item_4 {width:144px;}
#SFNav .root_item_5 {width:117px;}
#SFNav .root_item_6 {width:149px;}


#xSFNav .root_item_1 a:link,
#xSFNav .root_item_1 a:active,
#xSFNav .root_item_1 a:visited,
#xSFNav .root_item_1 a:hover {
	width:106px;
}

img.menuspacer {
	width:100%;
	height:34px;
	border:0px;
}


/*
Root Menu Background
*/
#SFNav .root_item_1 a:hover {
	background-attachment: scroll;
	background-image: url(/images/home_hover.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
#SFNav .root_item_2 a:hover {
	background-attachment: scroll;
	background-image: url(/images/products_hover.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
#SFNav .root_item_3 a:hover {
	background-attachment: scroll;
	background-image: url(/images/customers_hover.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
#SFNav .root_item_4 a:hover {
	background-attachment: scroll;
	background-image: url(/images/vendors_hover.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
#SFNav .root_item_5 a:hover {
	background-attachment: scroll;
	background-image: url(/images/aboutus_hover.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
#SFNav .root_item_6 a:hover {
	background-attachment: scroll;
	background-image: url(/images/contact_hover.gif);
	background-repeat: no-repeat;
	background-position: left top;
}

/*
	Sub-Menu Menu Item background image
*/

#SFNav .root_item_1 ul a:hover,
#SFNav .root_item_2 ul a:hover,
#SFNav .root_item_3 ul a:hover,
#SFNav .root_item_4 ul a:hover,
#SFNav .root_item_5 ul a:hover,
#SFNav .root_item_6 ul a:hover {
	background-image:none;
	background-color:#333333;
	color: #dddddd;
}
