/*

 */



.HMenuMenu,.HMenuSubMenuTable

{

	font-family: Tahoma;

	font-weight: normal;

	font-size: 11px;

	text-align:left;

	color: white;

	background-color: #008ACC;

	cursor:		hand;

	cursor:		hand !important;

	white-space:	nowrap;

	width: auto;

}



.HMenuSubMenu

{

	position:	absolute;

	display:	block;

	visibility:	hidden;

	overflow:	hidden;



	border:		1px outset #9C9A9C;

	background-color: transparent;

	

}



.HMenuSubMenuTable

{

	border-collapse: separate;

	opacity: 0.9;

	filter: Alpha(style=0,opacity=90);

}



.HMenuMenuItem,.HMenuMenuItemHover,.HMenuMenuItemActive

{

	cursor:		hand !important;

	white-space:	nowrap;

}



.HMenuMainItem,

.HMenuMenuItem

{

	padding:	6px 13px 6px 13px;

	border:		1px solid #FFFFFF;

	color:#FFFFFF;

}



.HMenuMainItemHover,

.HMenuMainItemActive

{

	padding:	6px 13px 6px 13px;

	border:		1px outset #FFFFFF;

	background-color:	#00699B;

	color: #FFFFFF;

}



.HMenuMenuItemHover,

.HMenuMenuItemActive

{

	padding:	5px;

	border:		1px solid #ffffff;

	background-color:	#008ACC;

	color: #FFFFFF;

}



/* horizontal main menu sub components */

/* panel doesn't really support horizontal menus */

/* there are simpler approaches, but the setting here allows me to

   set a background image for the menu without lines all over it */



.HMenuMainFolderLeft,

.HMenuMainItemLeft,

.HMenuMainFolderText,

.HMenuMainItemText,

.HMenuMainItemRight,

.HMenuMainFolderRight

{

	background-color: inherit;

	white-space: nowrap;

}



/* sub menus sub components */



.HMenuMenuFolderLeft,

.HMenuMenuItemLeft

{

	padding:	5px 0px 5px 3px;

	white-space:	nowrap;

	background-color:	inherit;

}



.HMenuMenuFolderText,

.HMenuMenuItemText

{

	padding:	5px 3px 5px 5px;

	white-space:	nowrap;

	color: #FFFFFF;

}



.HMenuMenuItemRight,

.HMenuMenuFolderRight

{

	padding:	5px 1px 5px 0px;

	white-space:	nowrap;

	background-color:	inherit;

}



/* hoover and active border */

.HMenuMenuItemHover .HMenuMenuFolderLeft,

.HMenuMenuItemActive .HMenuMenuFolderLeft,

.HMenuMenuItemHover .HMenuMenuItemLeft,

.HMenuMenuItemActive .HMenuMenuItemLeft,

.HMenuMenuItemHover .HMenuMenuFolderText,

.HMenuMenuItemActive .HMenuMenuFolderText,

.HMenuMenuItemHover .HMenuMenuItemText,

.HMenuMenuItemActive .HMenuMenuItemText,

.HMenuMenuItemHover .HMenuMenuFolderRight,

.HMenuMenuItemActive .HMenuMenuFolderRight,

.HMenuMenuItemHover .HMenuMenuItemRight,

.HMenuMenuItemActive .HMenuMenuItemRight

{

	border-color:	#CCCCCC;

}



.HMenuMenuItemHover .HMenuMenuFolderLeft,

.HMenuMenuItemActive .HMenuMenuFolderLeft,

.HMenuMenuItemHover .HMenuMenuItemLeft,

.HMenuMenuItemActive .HMenuMenuItemLeft

{

	border-width:	1px 0px 1px 1px;

	border-style:	solid;

	padding:	4px 0px 4px 2px;

}



.HMenuMenuItemHover .HMenuMenuFolderText,

.HMenuMenuItemActive .HMenuMenuFolderText,

.HMenuMenuItemHover .HMenuMenuItemText,

.HMenuMenuItemActive .HMenuMenuItemText

{

	border-width:	1px 0px 1px 0px;

	border-style:	solid;

	padding:	4px 3px 4px 5px;

}



.HMenuMenuItemHover .HMenuMenuFolderRight,

.HMenuMenuItemActive .HMenuMenuFolderRight,

.HMenuMenuItemHover .HMenuMenuItemRight,

.HMenuMenuItemActive .HMenuMenuItemRight

{

	border-width:	1px 1px 1px 0px;

	border-style:	solid;

	padding:	4px 0px 4px 0px;

}



td.HMenuMenuSplit

{

	padding:	0px;

	margin:		0px;

	border:		0px;

	background-color:	#FFFFFF;

	overflow:	hidden;

	width: 1px;

}



div.HMenuMenuSplit

{

	margin: 1px;

	background-color: #FFFFFF;

	border-top: 1px solid #9C9A9C;

	width: 1px;

}



/* image shadow animation */



/*

	seq1:	image for normal

	seq2:	image for hover and active



	To use, in the icon field, input the following:

	<img class="seq1" src="normal.gif" /><img class="seq2" src="hover.gif" />

*/



.HMenuMenuItem img.seq1

{

	display:	inline;

}



.HMenuMenuItemHover seq2,

.HMenuMenuItemActive seq2

{

	display:	inline;

}



.HMenuMenuItem .seq2,

.HMenuMenuItemHover .seq1,

.HMenuMenuItemActive .seq1

{

	display:	none;

}