
/*@charset utf-8 */

/* Basic CSS for menus to be included by other CSS files */

/* LAYOUT CSS -- this part should not be altered! */

/* This selector will activate on page load when the menue is displayed */
.zpMenuContainer, .zpMenu {
	float: left; /* IE fix */
	position: relative;
	color: #000000;
}


/* Top menu, horizontal */
.zpMenu-horizontal-mode .zpMenu-level-1 {
	float: left;
	padding-left:1em;
	padding-right:2em;
	height: 18px;
}

/* Anchor has NO style */
.zpMenu-top a{
	text-decoration:none;
}

/* All NON-Selected Labels font color black */
.zpMenu-top .zpMenu-label,
.zpMenu-top a{
	color: #000000;
}

/* ALL Selected Labels font color black */
.zpMenu-top .zpMenu-item-selected .zpMenu-label,
.zpMenu-top .zpMenu-item-selected a {
	color: #000000;
}

/* What to do if the LI has NO icon
by default show NO icons
-you css can override this
*/
.zpMenu-level-1  {
	background: none;
}

/* Vertical: true */
.zpMenu-vertical-mode  .zpMenu-level-1 {
	width: 10em;
	position:relative;
	/* override float:left in basic.css */
	float:none;
	margin:0;
	padding-left: 5px;	/* Label 5px in */
	border-bottom:1px solid black;
 }

.zpMenu-vertical-mode .zpMenu-level-1 .zpMenu-item-last {
	border-bottom: none;
}

/* FORMATTING CSS -- can be altered. */


/* Menu containers */

.zpMenu-item table.zpMenu-table {
	font: 11px "Arial", "Verdana", sans-serif;
}


.zpMenu-item {
	cursor: pointer;
}


/* Hide expansion indicators */

/* These are indicators for items that have sub-menus, and are hidden cause they generate a
   blank space in front of the content of those items */

.zpMenu .zpMenu-item .minus,
.zpMenuContainer .zpMenuContainer .zpMenu-item .minus,
.zpMenu .zpMenu-item .plus,
.zpMenuContainer .zpMenuContainer .zpMenu-item .plus {
	display: none;
}

/* Helper classes to hide the menu onload */
/* ??? I guess these are to be used on low Internet connection to display nothing befor all the needed things for the menu are loaded*/
.zpHideOnLoad {
	background: url("images/menuLoad.gif") no-repeat 100% 100%;
	display:none;
}
.zpHideOnLoad ul {
	display:none;
}


/* Begin HR style */
/* Controls the behavior of <hr>  it the menu
Overide ALL element contained in a zpMenu-item-hr */
.zpMenuContainer .zpMenuContainer .zpMenu-item .zpMenu-item-hr,
.zpMenuContainer .zpMenuContainer .zpMenu-item-hr .zpMenu-item td,
.zpMenuContainer .zpMenuContainer .zpMenu-item-hr .zpMenu-item td .zpMenu-label,
.zpMenuContainer .zpMenuContainer .zpMenu-item-hr .zpMenu-item .tgb,
.zpMenuContainer .zpMenuContainer .zpMenu-item-hr .zpMenu-item .icon,
.zpMenuContainer .zpMenuContainer .zpMenu-item-hr {
	margin:0;
	padding:0;
	border-color:black;
	background:black;
	background-color:black;
}


.zpMenuContainer .zpMenuContainer .zpMenu-item-hr hr {    /* for CSS1 browsers */
	display: none;
}


.zpMenuContainer .zpMenuContainer .zpMenu-item-hr hr * {     /* for CSS2 browsers */
	display: none;
}


/* End HR style */

/* Start - ICON Alignment */
/* Controls the behavior of ALL left icons */
.zpMenuContainer .zpMenuContainer .icon {
	background: none;
	width: 32px;
	padding-right:5px;
}

/* If you have an icon column and you want the Label to be left aligned, where the
   icon would start, then uncomment this section
.zpMenuContainer .zpMenuContainer  .zpMenu-noicon {
	background: none;
	width: 0px;
}
*/
/* End - ICON Alignment */

/* Sub-menu */
.zpMenuContainer .zpMenuContainer {
	position: absolute;
	width: 10em;
}

/* General items that's not a top menu */
.zpMenuContainer .zpMenuContainer .zpMenu-item {
	float: left;
	width: 10em;
	padding:0em;
}

/* TOP Menu - Set vertical align to center table */
.zpMenu-vertical-mode .zpMenu-level-1,
.zpMenu-horizontal-mode .zpMenu-level-1 {
	vertical-align:top;
}

/* TOP Menu - Have table use 100% of DIV so it can be vertical-align: middle */
.zpMenu-horizontal-mode .zpMenu-level-1 .zpMenu-table {
	height:100%;
}

.zpMenuContainer .zpMenuContainer  .zpMenu-label {
	/* This scenario is needed when an Arrow image is over a menu item image */
	/* Make the Menu label FILL the td so the Arrow will be right aligned */
	/* zpMenu-item-collapsed, zpMenu-item-expanded */
	width:1000px; 
}


/* Must include this CSS for Animation and Special Effects.  Fixes IE problems */
.zpMenuContainer .zpMenuContainer .zpMenu {
	filter: Alpha(Opacity=100);
}



/* -------------------------------------------------------------------------------- */


/* top level, vertical and horizontal */
.zpMenu-horizontal-mode .zpMenu-level-1,
.zpMenu-vertical-mode .zpMenu-level-1 {
	height: 24px;
	width: 115px;
	padding: 0;
	/*background-color: #EAEAEA; */ /* Top Menu,No Sub */
}



/* Top Menu,Has SUB */
.zpMenuContainer .zpMenu-item-collapsed { background: url(../imgs/bg1.png) repeat-y 0 0; }
/* Top Menu,Selected,No Sub */
.zpMenuContainer .zpMenu-item-selected { background-color: #EAEAEA; }
/* Top Menu,selected,Has Sub */
.zpMenuContainer .zpMenu-item-expanded { background: url(../imgs/bg1_on.png) repeat-y 0 0; }

/* Top Menu,Selected,No Sub */
.zpMenu-horizontal-mode .zpMenu-level-1 {
	padding-left: 5px;
}

.zpMenu-vertical-mode .zpMenu-level-1 {
	padding-left: 5px;
	text-align:left;
	border:none;
}

.zpMenu-top .zpMenu-item-selected a,
.zpMenu-top .zpMenu-item-selected .zpMenu-label,
.zpMenuContainer a, 
.zpMenuContainer span, 
.zpMenuContainer .zpMenu-label,
.zpMenuContainer .zpMenuContainer a,
.zpMenuContainer .zpMenuContainer span,
.zpMenuContainer .zpMenuContainer .zpMenu-label {
	color: rgb(0, 48, 102);
	font-family: Verdana,  Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 24px;
}

.zpMenuContainer .zpMenuContainer {
	margin-top:1px;
	margin-left:5px;
	background:  #F0F0F0;
	min-width: 12em;
	padding-top:0px;
	border: solid 1px #dadada;
}



/* General items that's not a top menu */
.zpMenuContainer .zpMenuContainer .zpMenu-item,
.zpMenuContainer .zpMenuContainer {
	width: 210px;
}

.zpMenuContainer .zpMenuContainer .zpMenu-item {
  background-color: #F3F3F3;
	margin-top:0px;
	padding-top: 0px;
	padding-left: 0px;
	height: 24px;
	/*border-bottom: 1px solid rgb(235,235,235);*/
	margin-left:0px;	
	margin-bottom: 1px;
	background-position:right;
	/*border: solid 2px #eaeaea;*/
}


/* Current selected items in vertical menu*/
.zpMenuContainer .zpMenuContainer .zpMenu-item-selected {
	background-color: #EAEAEA;
}

.zpMenu-top .zpMenu-item-selected a,
.zpMenu-top .zpMenu-item-selected .zpMenu-label,
.zpMenuContainer .zpMenuContainer .zpMenu-item-selected a,
.zpMenuContainer .zpMenuContainer .zpMenu-item-selected .zpMenu-label {
	font-weight: bold; 
}


/* The arrow that shows up when there's a sub-menu */
.zpMenuContainer .zpMenuContainer .zpMenu-item-collapsed .zpMenu-label {
	/*background: url("../imgs/arrow_light.gif")  no-repeat center right;*/
}

/* The arrow that shows up when there's a sub-menu and the item is hovered*/
.zpMenuContainer .zpMenuContainer .zpMenu-item-expanded .zpMenu-label {
/*	background: url("../imgs/arrow_dark.gif")  no-repeat center right;*/
}

.zpMenuContainer .zpMenuContainer .icon {
	padding-left: 3px;
}

/* Controls the behavior of <hr>  it the menu */
.zpMenuContainer .zpMenuContainer .zpMenu-item-hr {
	border:none;
	margin:0;
	background:#98BCD5;
	height:6px;
	padding:0px 0px 0px 0px;
	margin-left:10px;
	width:200px;
}

