/* ------- FONT AND FONT SIZE ------- */

.menucell, .menucell th { font-size:13px;
	line-height: 19px;
	font-family: Tahoma, Helvetica, sans-serif;
	font-weight: normal }


/* ------- NERD STUFF ------- */

.menucell {  padding-top: 4px; padding-bottom: 4px;
	opacity:.98; /*filter:alpha(opacity=98);*/ }
/* IE's alpha filter is commented out because it has a strange effect. We
   have <td><a><img></a></td>. If <td> has a background colour, <a> has one
   too, and <img> has a png filter, then the two background colours are
   turned off. Seems to be some kind of knockout feature. :-)
*/

.menucell a { text-decoration: none; display:block; zoom: 100% }

.menucell img { border: none }

/* items without arrows use a div, not a table */
.menucell a div { padding: 0 20px 0 40; text-indent: -20px }

/* overlain image for items with arrows */
.img-overlay { position: absolute; border: none }

.menucell table { width: 100% }

/* text label */
.menucell th { text-indent: -20px;
	 padding: 0 20px 0 40px; text-align: left }

/* arrow */
.menucell td {
	padding: 1px 12px 0 19px; /* this order: top right bottom left */
	font-size: 10px; font-family: Arial;
	overflow: visible;
	text-align: right
}


/* If these backgrounds change, they also need to be changed in the anony-
   mous function near the top of cogs.js */

.top-shadow { background: url(t.png) }
.left-shadow { background: url(l.png) }
.right-shadow { background: url(r.png); boarder: solid 1px green }
.bottom-shadow { background: url(b.png) }
.top-left-shadow { background: url(tl.png); width: 8px; height: 4px }
.top-right-shadow { background: url(tr.png); width: 8px; height: 4px }
.bottom-left-shadow { background: url(bl.png); width: 8px; height: 12px }
.bottom-right-shadow { background: url(br.png); width: 8px; height: 12px }
.top-left-side-shadow { background: url(tls.png); width: 8px; height: 10px }
.top-right-side-shadow { background: url(trs.png); width: 8px; height 10px }
.left-bottom-side-shadow { background: url(lbs.png); width: 7px; height: 12px}
.right-bottom-side-shadow { background: url(rbs.png); width: 7px; height: 12px }
.inverted-top-left-shadow { background: url(itl.png) }
.inverted-top-right-shadow { background: url(itr.png) }
.inverted-bottom-left-shadow { background: url(ibl.png); height: 12px }
.inverted-bottom-right-shadow { background: url(ibr.png); height: 12px }


/* special graphic needed by IE so that a PNG filter can be applied to it*/
html > .forIE { display:none}

/* special sizing graphic that does not work with IE PNG filters */
.notforIE { visibility:hidden}
* html .notforIE { display:none }

.menu-cross { background-size: 100% 100%; background-image: url(bar/crossblack.png) }
a.menu-item:hover .menu-cross { background-size: 100% 100%; background-image: url(bar/crosswhite.png) }