/* this is the clipping region for the menu. it's width and height get set by script, depending on the size of the items table */
.transMenu {
	position:absolute;
	overflow:hidden;
	left:-1000px;
	top:-1000px;
	margin-left:0px;
	}

/* this is the main container for the menu itself. it's width and height get set by script, depending on the size of the items table */
.transMenu .content {
	position:absolute;
	}

/* this table comprises all menu items. each TR is one item. It is relatively positioned so that the shadow and background transparent divs can be positioned underneath it */
.transMenu .items {
	position:relative;
	left:0px; top:0px;
	z-index:2;
	width:200px;
	}

.transMenu.top .items {
	
	}

/* each TR.item is one menu item */
.transMenu .item {
	/* this is a hack for mac/ie5, whom incorrectly cascades the border properties of the parent table to each row */
	border:none;
	cursor:pointer;
	cursor:hand;
	}

tr.item td { color:#ffffff; font-size:11px; font-family:tahoma, verdana, sans-serif; font-weight:bold; text-decoration:none; text-align:left; padding-left:8px; }
td.item-icon { border-right:0px solid #333366; }
td.item-text { border-left:0px solid #cccccc; }
table.items { border-top:0px solid #000000; }

div.TransMenu0 table, div.TransMenu1 table { background:#589e22; }
div.TransMenu2 table, div.TransMenu3 table, div.TransMenu4 table, div.TransMenu5 table, div.TransMenu6 table, div.TransMenu7 table, div.TransMenu8 table { background:#22489e; }
div.TransMenu9 table { background:#9e3f22; }
div.TransMenu10 table, div.TransMenu11 table, div.TransMenu12 table, div.TransMenu13 table, div.TransMenu14 table, div.TransMenu15 table, div.TransMenu16 table, div.TransMenu17 table, div.TransMenu18 table, div.TransMenu19 table { background:#d48c02; }
div.TransMenu20 table, div.TransMenu21 table, div.TransMenu22 table { background:#b00202; }
div.TransMenu23 table, div.TransMenu24 table, div.TransMenu25 table { background:#ffcc00; }
div.TransMenu26 table, div.TransMenu27 table, div.TransMenu28 table, div.TransMenu29 table, div.TransMenu30 table, div.TransMenu31 table { background:#bfb092; }
div.TransMenu32 table, div.TransMenu33 table, div.TransMenu34 table { background:#33cccc; } 
div.TransMenu35 table, div.TransMenu36 table, div.TransMenu37 table, div.TransMenu38 table, div.TransMenu39 table, div.TransMenu40 table, div.TransMenu41 table, div.TransMenu42 table, div.TransMenu43 table, div.TransMenu44 table, div.TransMenu45 table, div.TransMenu46 table, div.TransMenu47 table, div.TransMenu48 table, div.TransMenu49 table, div.TransMenu50 table { background:#cccc33; }
div.TransMenu52 table, div.TransMenu53 table { background:#5f93f4; }

/* this DIV is the semi-transparent white background of each menu. the -moz-opacity is a proprietary way to get transparency in mozilla, the filter is for IE/windows 5.0+. */
/* we set the background color in script because ie mac does not use it; that browser only uses a semi-transparent white PNG that the spacer gif inside this DIV is replaced by */
.transMenu .background {
	position:absolute;
	left:0px; top:0px;
	z-index:1;
	-moz-opacity:.8;
	filter:alpha(opacity=80);
	}

/* same concept as .background, but this is the sliver of shadow on the right of the menu. It's left, height, and background are set by script. In IE5/mac, it uses a PNG */
.transMenu .shadowRight {
	position:absolute;
	z-index:3;
	top:3px; width:2px;
	-moz-opacity:.8;
	filter:alpha(opacity=80);
	display:none;
	}

/* same concept as .background, but this is the sliver of shadow on the bottom of the menu. It's top, width, and background are set by script. In IE5/mac, it uses a PNG */
.transMenu .shadowBottom {
	position:absolute;
	z-index:1;
	left:3px; height:2px;
	-moz-opacity:.8;
	filter:alpha(opacity=80);
	display:none;
	}

/* this is the class that is used when the mouse is over an item. script sets the row to this class when required. */
.transMenu .item .hover {
	background:#E5E0CD;
	}

/* this is either the dingbat that indicates there is a submenu, or a spacer gif in it's place. We give it extra margin to create some space between the text and the dingbat */
.transMenu .item img {
	margin-left:10px;
	}