/* **************************************************

Name: subnav.css

Description: generic application style for sub navigation component

Create: 2009.09.XX
Update: 

***************************************************** */



/* contents===========================================

  [-] Generic Container Style and Position
  [-] Expand/Contact Icons/Indicator
  [-] Node Style (w/children)
  [-] Node Style (child)
 
===================================================== */


/* [-] Generic Container Style and Position
=========================================================================================== */
.treeview, .treeview ul { 
	padding: 0;
	margin: 0;
	list-style: none;
}

/* style for top level container */
.treeview {
	padding:0; margin:0;
	}

/* generic style for sub levels */
.treeview ul {
	/*background-color: white;*/
	margin: 0
}


/* [-] Expand/Contact Icons/Indicator
=========================================================================================== */
.treeview .hitarea {
	background: url(../resources/images/global/sideNavImages/treeview-default.gif) 0 10px no-repeat;
	/*border: 1px solid #ccc;*/
	height: 14px;
	width: 14px;
	float: left;
	cursor: pointer;
	position: relative;
	top: .65em; left: .20em;
}
/* fix for IE6 */
* html .hitarea {
	/*display: inline;
	float:none;*/
}
.treeview .expandable-hitarea { background-position: 0 -1px; }
.treeview .collapsable-hitarea { background-position: 0 -27px; }

/* custom icon if last node */
.treeview li.last, .treeview li ul li.last, .treeview li ul li ul li.last {border-top: 1px solid #F4F4F4; border-bottom: 1px solid #F4F4F4;}

/* custom icon if last node has childrend */
.treeview li.lastCollapsable, .treeview li.lastExpandable {border:0px;}  
.treeview li.lastCollapsable {}
.treeview li.lastExpandable {}
.treeview div.lastCollapsable-hitarea, .treeview div.lastExpandable-hitarea {}

/*.treeview li.lastCollapsable ul li ul li{ margin-left: 10px;}*/

/* [-] Node Style (w/children)
=========================================================================================== */
.treeview li { 
	margin: 0;
	padding: 0;
	width: 222px;
	font-size: 12px;
	border-bottom: 1px solid #CCCCCC;
	border-top: 1px solid #F7F7F7;
	font-family: Arial, Verdana, san-serif;
	display: block;
	background: #E4DECD url(../resources/images/global/sideNavImages/left-menubg.gif) top repeat-x;
}                   
.treeview span{border-top: 1px solid #F4F4F4;}
.treeview li ul li{ border-top: 1px solid #F4F4F4;}

li.selected {background: #EBE8DF url(../resources/images/global/sideNavImages/side-leftnavbg-hover.gif) 0 -15px repeat-x; background-position: center; color: #FFF !important; font-weight: bold;}

li.collapsable {padding-bottom:0;background: url(../resources/images/global/sideNavImages/bg_topLevel_hover.gif) 0 -20px repeat-x; background-position: center; color: #000 !important}

li.collapsable ul {/*border-top: 1px solid #c4c4c4; margin-top: .75em*/}

/*li.collapsable span {background: url(../resources/images/global/sideNavImages/arrows-333.gif) 97% -88px no-repeat}
li.expandable span {background: url(../resources/images/global/sideNavImages/arrows-333.gif) 97% 1em no-repeat}*/
/* node style on hover */
.treeview .hover {cursor: pointer;text-decoration:underline;background: url(../resources/images/global/sideNavImages/bg_topLevel_hover.gif) 0 -15px repeat-x;color: #FFF}
.treeview span.hover{cursor: pointer;text-decoration: none;background: #F69C44; color: #000; display: block}
/* 1st level node style */
/*.treeview > li {font-weight:bold;border-bottom:1px solid #C4C4C4}*/
/* style when 1st level node is expanded */
.treeview > li.collapsable {font-weight: bold; border-bottom: 0px solid #C0C0C0;}

li.collapsable li.expandable {color: #333}

/* 2nd level node style */
/*.treeview > li > ul > li{font-weight:normal;font-size:90%}*/
/* style when 2nd level node is expanded */
.treeview > li > ul > li.collapsable {font-weight:bold; border-bottom: 0px; display: block}

/* 2nd level node style */
/*.treeview > li > ul > li > ul > li{font-weight:normal;font-size:90%}*/
/* style when 2nd level node is expanded */
.treeview > li > ul > li > ul > li.collapsable {font-weight:bold; border-bottom:0px;}


/* [-] Node Style (child)
=========================================================================================== */

.treeview a, .treeview span {color: #000; display:block; /*width:86%;*/ padding: .75em 5% .75em 9%;}
.treeview li.collapsable ul li ul li a{padding-left: 40px; display: block;}
/*.treeview a:hover {background-image: url(../resources/images/global/sideNavImages/bg_topLevel_hover.gif); background-position: 0 -15px; background-repeat: repeat-x;color: #FFF}*/
.treeview a:hover {background: #DA6404 url(../resources/images/global/sideNavImages/side-leftnavbg-hover.gif) 0 -15px repeat-x;color: #000; background-position: center;}
.treeview span:hover {background: #DA6404 url(../resources/images/global/sideNavImages/side-leftnavbg-hover.gif) 0 -15px repeat-x;color: #000; text-decoration: none; background-position: center;}

.treeview a:visited {color: #000}
.treeview a.selected {color: #FFF;font-weight:bold}

.ie6 .treeview a.selected {color:#fff}
.ie6 .treeview a:hover {background: #DA6404 url(../resources/images/global/sideNavImages/side-leftnavbg-hover.gif) 0 -15px repeat-x;color: #000; background-position: center;}
.ie6 .treeview span:hover {background: #DA6404 url(../resources/images/global/sideNavImages/side-leftnavbg-hover.gif) 0 -15px repeat-x;color: #000; background-position: center;}