/* ====================================================== */
/* XAR MENU MOD STYLES                                    */
/* ====================================================== */

/* dropdown menus based on the suckerfish solution by by  Patrick Griffiths, Dan Webb
 * see: http://www.alistapart.com/articles/dropdowns/
 * and: http://htmldog.com/articles/suckerfish/
 * lvdb: IExplorer does not understand a hover on anything else but A
 */


.xar-menu-selected, .xar-menu-selected a{
	font-style: underline!important;
	font-weight: bold!important;
	color:red!important;
	}

/* ============================================================================================== */
/* STANDARD *VERTICAL DROPDOWN* MENU - CLASSES */
/* ============================================================================================== */
.xar-menu-vertical{
	position:absolute; /* do not change: forces IE to flow menu on top of other containers */
	z-index:9998; /* do not change: forces IE to flow menu on top of other containers */
	list-style: none;
	}
	.xar-menu-vertical-list{
		display: none; 
		list-style: none;
		padding: 0px; margin: 0px;
		top: 0; /* can be overriden in menu specific CSS (via ID)*/
  		left: 0; /* do not change: aligns dropdown under parent item */
		}

		.xar-menu-vertical-list > ul{top: auto;left: auto;} /* do not change: browser compatibility */

	.xar-menu-vertical-item{
		float:none; /* do not change: keeps vertical listed menu-items vertical */
	   	position: relative;
		text-align:left;
		padding: 0px; margin: 0px;
		vertical-align: top;
		}
		.xar-menu-vertical-item, .xar-menu-vertical-item a,
		.xar-menu-vertical-item a:hover{
				text-decoration:none;
				}

		/* structure */
		/* part below makes the hover dropdown-effect: do not change */
		.xar-menu-vertical ul, .xar-menu-vertical ul ul{/* all lists below main level */
			position: absolute;
			z-index:9999; /*do not change: keeps menu stack on right levels*/
			}

		/* 2nd level list: only activated when first level is hovered over */
		/* need to keep 3rd-level-and-below hidden */
		.xar-menu-vertical li:hover ul, .xar-menu-vertical li.over ul{display: block;}
		.xar-menu-vertical li:hover ul ul, .xar-menu-vertical li.over ul ul{display: none;} 

		/* 3rd level list: only activated when first level is hovered over */
		.xar-menu-vertical li li:hover ul, 
		.xar-menu-vertical li li.over ul{display: block;}

	
	/* END: vertical menu */

/*====================================================================================*/
/* STANDARD *HORIZONTAL* MENU - CLASSES */
/* ============================================================================================== */
/* actions on each admin page */	
	.xar-menu-horizontal{}
	.xar-menu-horizontal-list{
		list-style: none;
		padding: 0px; margin: 0px;
		}
	.xar-menu-horizontal-item{
	    display: inline; /* need to keep items aligned next to each other */ 
		padding: 0px 0px 0px 0px;
		}
		.xar-menu-horizontal-item, 
		.xar-menu-horizontal-item a,
		.xar-menu-horizontal-item a:hover{
			text-decoration:none;
			}
	/* END: horizontal menu */

/* ============================================================================================== */
/* STANDARD *LIST* MENU - CLASSES */
/* ============================================================================================== */
/* assumes single level menu list only */
.xar-menu-list{
	margin: 0px; margin: 0px 10px 0px 10px;
	}	

	.xar-menu-list-list{
		display: block;
		padding: 0px; margin: 15px;
		list-style: disc outside none;
		}

		.xar-menu-list-list > ul{top: auto;left: auto;} /* do not change: browser compatibility */

	.xar-menu-list-item{
	   	position: relative;
		text-align:left;
		padding: 0px; margin: 0px;
		vertical-align: top;
		}
		.xar-menu-list-item, .xar-menu-list-item a,
		.xar-menu-list-item a:hover{}

	/* END: list menu */


* ============================================================================================== */
/* STANDARD *ICONS* MENU - CLASSES */
/* ============================================================================================== */
/* assumes single level menu icons image only */
.xar-menu-icon{ /* main DIV */
	}
	.xar-menu-icon-wrapper{ /* wrapper around individual icon image */
		float:left;
		margin: 20px 10px 20px 10px;  /* spacing on each side and top/bottom of icon */
		padding: 0px;
		}	
		.xar-menu-icon-wrapper IMG{
			border: none;
			vertical-align: middle;		
			}

	/* END: icons menu */



/* ============================================================================================== */
/* *ADMIN-MAIN* MENU - IDs                                                                        */
/* ============================================================================================== */
/*  can override this in themes by copying menu.xd and setting id-value in the */
/*  main list (e.g <ul class="xar-menu-vertical" id="xc-admin-menu">)          */

#menu_admin-main{ /* main UL */}
	#menu_admin-main, #menu_admin-main a{
		color: rgb(153,153,153); /* grey */
		padding:0px;margin:0px; /* keep to align list nicely on left */
	}

	/* 1st level list items */
	#menu_admin-main ul{}
	#menu_admin-main li{/* All list items */
		background-color:#FFFFFF;
		padding: 0px 7px 10px 7px;
		float:left; /* force first level to align horizontally */
		} 
		#menu_admin-main li, #menu_admin-main li a, #menu_admin-main li a:hover{
			font-weight: bold;
			font-size:12px;
			}
		#menu_admin-main li a:hover{}

	/* 2nd level list items */
	#menu_admin-main li ul{
		width:125px; /* fixed width forces subitems to list vertically with float:left */
		top: 20px; /* position dropdown at foot of parent item */
		border:1px solid #999999;
		border-top:4px solid #999999;
		margin-bottom: 0px;
		}
		/* IExplorer only */
		* html #menu_admin-main li ul{top: 22px;}

		#menu_admin-main li li{
			width:115px; /* minus padding for firefox */
			height:20px;
			padding: 5px 5px 0px 5px;  
			background-color:rgb(238,238,225); /* brown grey */
			} 
			#menu_admin-main li li, #menu_admin-main li li a, #menu_admin-main li li a:hover{
				font-weight: normal;
				font-size:11px;
				}
			#menu_admin-main li li a:hover{
				font-weight: bold;
				color:#333333; /* dark grey */
				} 

	/* 3rd-and-above-level lists */
	#menu_admin-main li li ul{
		width:125px; /* fixed width forces subitems to list vertically with float:left */
		top: 0px; /* move menu-item on same level as 2nd level item */
    	left: 125px; /* align 3rd level dropdown to right of main vertical: width -/- padding for firefox */
		}




/* ============================================================================================== */
/* *ADMIN-FOOTER* MENU - IDs                                                                        */
/* ============================================================================================== */
/*  can override this in themes by copying menu.xd and setting id-value in the */
/*  main list (e.g <ul class="xar-menu-vertical" id="xc-admin-menu">)          */

#menu_admin-footer{/* main UL */
	margin: 0px 0px 0px -15px; /* remove first padding around pipe */
	padding: 0px 0px 0px 0px;
	}
	#menu_admin-footer, #menu_admin-footer a{}

		#menu_admin-footer li{/* All list items */
			display: inline;
			/* create pipe-style divider between menu items */
			border-right: 1px solid #FFFFFF;
			margin: 5px 0px 0px 0px; /* for white-spacing but with line-height pipes */
			padding: 0px 15px 0px 15px; /* padding on each side of pipe-style divider */
			vertical-align: middle; /* position menu text in middle of pipe-style divider */
			} 
		#menu_admin-footer li, #menu_admin-footer li a, #menu_admin-footer li a:hover{
			font-weight: bold;
			font-size: 11px;
			color: #FFFFFF;
			text-decoration: none;
			}
		#menu_admin-footer li a:hover{
			 color: #CCCCCC;
			}



/* ============================================================================================== */
/* *ADMIN-MODULE* MENU - IDs                                                                      */
/* ============================================================================================== */
/*  can override this in themes by copying menu.xd and setting id-value in the */
/*  main list (e.g <ul class="xar-menu-vertical" id="xc-admin-menu">)          */


#menu_admin-mod{} /* main DIV */

	#menu_admin-mod, #menu_admin-mod a{
		color: #999999; /* grey */
		padding:0px;margin:0px; /* keep to align list nicely aligned to edge */
	}

	/* 1st level list items */
	#menu_admin-mod ul{}
	
	#menu_admin-mod li{/* All list items */
		padding: 0px 5px 0px 5px;
		} 
		#menu_admin-mod li, #menu_admin-mod li a, #menu_admin-mod li a:hover{
			font-weight: normal;
			font-size:12px;
			}
		#menu_admin-mod li a:hover{
			font-weight: bold;
			color: #333333;
		}


/* ============================================================================================== */
/* *ADMIN-CONSOLE* MENU - IDs                                                                        */
/* ============================================================================================== */
/*  can override this in themes by copying menu.xd and setting id-value in the */
/*  main list (e.g <ul class="xar-menu-vertical" id="xc-admin-menu">)          */

#menu_admin-console{}/* main DIV */
	#menu_admin-console, #menu_admin-console a{}



/* ============================================================================================== */
/* STANDARD ADMIN-TABS MENU - POSITIONING 
  can override this in themes by copying menu.xd and setting id-value in the 
  main list (e.g <ul class="xar-menu-vertical" id="xc-admin-menu">)
*/

#menu_admin-consolepanel{} /* main UL */

	#menu_admin-consolepanel, #menu_admin-consolepanel a{
		color: #666666; /* grey */
		padding:0px;margin:0px; /* keep to align list nicely aligned to edge */
		font-size:12px;
		font-weight: normal;
		color: #333333;
	}
	/* 1st level list items */
	#menu_admin-consolepanel ul{}
	#menu_admin-consolepanel li{/* All list items */
		border:1px solid #666666;
		} 
		#menu_admin-consolepanel li div{/* special container for tab-effect */
			display: block;
			padding:5px 10px 5px 10px; /* keep: necessary for tab-effect; full fill */
			}
		#menu_admin-consolepanel li, #menu_admin-consolepanel li a, #menu_admin-consolepanel li a:hover{}
			#menu_admin-consolepanel li, #menu_admin-consolepanel li a, #menu_admin-consolepanel li a:hover div{/* need extra container for tab effect */}
		#menu_admin-consolepanel li a:hover{}
			#menu_admin-consolepanel li a:hover div{/* need extra container for tab effect */
				background-color: #666666;		
				font-weight: bold;
				color: #999999;
			}

		.menu_admin-consolepanel-active, .menu_admin-consolepanel-active a{/* goes into the container div within li-element */
				background-color: #666666;		
				font-weight: bold;
				color: #999999;
			}


/* STANDARD TABS MENU - CLASSES */
	.xar-menu-tabs{}
		.xar-menu-tabs-list{
			list-style: none;
			padding: 0px; margin: 0px;
			}

		.xar-menu-tabs-item{
			display:block;
			float:left;
			}
			.xar-menu-tabs-item, .xar-menu-tabs-item a{}


/* ============================================================================================== */