/*-------------------------------*/
/* do not touch this is the core */
/*-------------------------------*/
.mdBarMenuContainer, .mdBarMenuItem, .mdMenuContainer, .mdMenuItem, .mdBarMenuItemClear
{
	list-style:none;
	padding:0px;
	margin:0px;
}

.mdBarMenuContainer
{
	display:inline-block;
	position:relative;
	zoom:1;
}

.mdBarMenuItem
{
	display:block;
	position:relative;
	float:left;
}

.mdBarMenuItem a
{
	display:block;
	white-space:nowrap;
	float:left;
	ffont-family: helvetica;
}

.mdBarMenuItem a:hover
{
	background-color:red;
}

.mdMenuContainer
{
	float:none;
	display:none;
	position:absolute;
	ffilter: alpha(opacity=95); /* internet explorer */
	-khtml-opacity: 0.95;      /* khtml, old safari */
	-moz-opacity: 0.95;       /* mozilla, netscape */
	opacity: 0.95;           /* fx, safari, opera */	
}

.mdMenuItem
{
	display:block;
	position:relative;
	float:none;
} 

.mdMenuItem a
{
	display:block;
	position:relative;
	white-space:nowrap;
	float:none;
}

.mdMenuItem a:hover
{
	background-color:red;
}

.mdBarMenuItem:hover>.mdMenuContainer
{
	display:block;
	position:absolute;
	z-index:1;
}

.mdMenuItem:hover>.mdMenuContainer
{
	display:block;
	position:absolute;
	z-index:1;
}

.mdBarMenuItemClear
{
	font-size:1px;
	height:0px;
	width:0px;
	clear:left;
	line-height:0px;
	display:block;
	*display:inline;/*IE7 hack*/
	float:none !important;
}


/*-------------------------------*/
/* CSS design follows - can be amended */
/*-------------------------------*/

.mdBarMenuContainer
{
	width:100%;/*set auto if you do not need 100%*/
	background-color:#0083B5;
	border-bottom: 3px solid #ca0000;
}
.mdBarMenuItem
{
	border-right:1px solid #015B7F;
}
.mdBarMenuItem a
{
	padding: 10px 8px 8px 10px;
	margin:0px;
	text-decoration:none;
	color:white;
	font-weight:bold;
	font-size:13px;
	border-top:0px solid #0083B5;
	border-bottom:0px solid #0083B5;
}
.mdBarMenuItem a:hover
{
	background-color:#026D97;
	padding: 11px 7px 7px 11px;
}
.mdMenuItem
{
	padding:2px 4px;
} 
.mdMenuItem a /* this element inherits css from .mdBarMenuItem a so set appropreate css for submenu link*/
{
	padding: 5px 8px 5px 6px;
	text-decoration:none;
	color:white;
	font-weight:bold;
	font-size:13px;
	border-top:1px solid #0083B5;
	border-bottom:1px solid #0083B5;
}
.mdMenuItem a:hover/* this element inherits css from .mdBarMenuItem a so set appropreate css for submenu link*/
{
	padding: 5px 7px 5px 7px;
	bbackground-color:#353535;
	background-color:#0083B5;
	border-top:1px solid #009CDA;
	border-bottom:1px solid #009CDA;
}

.mdBarMenuItem:hover>.mdMenuContainer
{
	top:100%;
	left:0;
	background-color:#0083B5;
	border: 1px solid #026D97;
}

.mdMenuItem:hover>.mdMenuContainer
{
	top:2px;
	left:100%;
	margin-left:0px;
	background-color:#0083B5;
	border: 0px solid #026D97;
	border-left: 1px solid white;
}

.mdArrow-d, .mdArrow-l
{
    position: relative;
    top: 0px;
    font-size: 0px;
    border-style: solid;
    border-color: transparent;
    display: -moz-inline-box;
    display: inline-block;
    height: 0px;
    line-height: 0;
    width: 0px;
   
}
    
.mdArrow-d {
    border-width:5px;
    border-top-color: white;
    padding-top: 0px;
    left: 4px;
    top:2px;
}
.mdArrow-l {
    border-width:5px;
    border-left-color: white;
    padding-bottom: 0px;
    left: 10px;
    top:4px;
    float:right;
}


.mdArrowHelper /*this helper is needed as mdArrow is set to float right and taken out of flow so this helper extends parent element width for the arrow*/
{
	display:inline-block;
	width:10px;
}