/* TransMenu
-------------------------------------------------
NOTE:TransMenu background and some
configurations are located in the ja-transmenu.js.
-------------------------------------------------*/
/* 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}

/* 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; font-size:11px}

.transMenu.top .items{}

/* 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{width:2px; position:absolute; z-index:3; top:3px; -moz-opacity:.2; filter:alpha(opacity=20)}

/* 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:.2; filter:alpha(opacity=20)}

/* each TR.item is one menu item */
.transMenu .item{border:none; color:#666; text-decoration:none; text-transform:none; /* this is a hack for mac/ie5,whom incorrectly cascades the border properties of the parent table to each row */cursor:pointer; font-weight:normal}

/* 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{color:#D8182D; background:#DBD9CB}

/* 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}

/* ----------------------------------------------------------------
- Added classes by Khanh - 050629
- Style and mark-up improved by Hieu Nguyen &Ha Le Viet - 060718
-------------------------------------------------------------------*/
.transMenu .item#active, .transMenu .item#active:hover{background:#BDBAA6; color:#FFF!important; font-weight:bold; /* -moz-opacity:.6; filter:alpha(opacity=60); */}

#ja-mainnav div.transmenu-inner{float:left; padding-left:5px; background:url(img/tableft.gif) no-repeat top left}

/* For first level menu.*/
#ja-transmenu{margin:0; padding-right:5px; float:left; background:url(img/tabright.gif) no-repeat top right; line-height:25px; height:25px}

#ja-transmenu li{margin:0; padding:0; display:inline; background:none}

#ja-transmenu li a{padding:0 20px; /* common styles for 1st level menu */float:left; display:block; text-decoration:none; text-align:center; color:#666}

#ja-transmenu li a:hover{color:#D8182D; /* common styles for 1st level menu */text-decoration:none}

a.havechild-mainlevel-trans{background:url(../ja_transmenu/img/arrow-off2.gif) center right no-repeat}

a.havechild-mainlevel-active-trans, 
a.havechild-mainlevel-active-trans:active{color:#FFF!important; background:url(img/havechild-active-bg.gif) no-repeat top right #BDBAA6}

a.jahover{background:url(img/havechild-on-bg.gif) no-repeat top right #DBD9CB}

a.jahover-active{color:#FFF!important; background:url(img/havechild-active-bg.gif) no-repeat top right #BDBAA6}

a.mainlevel-trans{}

a.mainlevel-trans:hover, 
a.mainlevel-trans:active{color:#484848; background:url(img/tabhover-bg.gif) top #DBD9CB}

a.mainlevel-active-trans, 
a.mainlevel-active-trans:hover, 
a.mainlevel-active-trans:active{color:#FFF!important; background:url(img/tabactive-bg.gif) top #BDBAA6}
