<style type="text/css" media="screen, tv, projection">
/*<![CDATA[*/

.example {
	background: #eee;
	padding: 0px;
}

/*		Navigation core 	*/

.navig {
	line-height: 1;
/*	margin: 0 0 1.2em 0;*/
	display: block;
	position: relative;
}

/* remove all list stylings */
.navig, .navig ul {
	margin: 0;
	padding: 0;
	border: 0;
	list-style-type: none;
}

/* move all list items into one row, by floating them */
.navig li {
	margin: 0;
	padding: 0;
	border: 0;
	display: block;
	float: left;
}

/* initialy hide all sub menus */
.navig ul {
	width: 100%;
	display: block;
	visibility: hidden;
	position: absolute;
	clear: both;
	top: 1.2em;/* watch for this value! you must 
		      make sure that this value and value of 
			line-height for the parent items are 
			such that it is possible to move the 
			mouse over to submenu */
	left: 0;
}
#HomeMenu {
	text-align: left;
	width: 373px;
	left: -0px;
}

#OneBayMenu {
	text-align: left;
	width: 113px;
	left:  85px;
}

#NetworkMenu {
	width: 615px;
	left:  45px;
}

#OnERMenu {
	width: 560px;
	left:  75px;	
}

#HotListMenu {
	width: 560px;
        left: 75px;
}

#PortalMenu {
	width: 105px;
	left:  500px;
}

#HelpMenu {
	width: 528px;
	left:  195px;
}

/************************************************************************
CSS Margin Properties
The CSS margin properties define the space around elements. It is possible 
to use negative values to overlap content. The top, right, bottom, and left 
margin can be changed independently using separate properties. A shorthand 
margin property can also be used to change all of the margins at once.

Note: Netscape and IE give the body tag a default margin of 8px. Opera does 
not! Instead, Opera applies a default padding of 8px, so if one wants to 
adjust the margin for an entire page and have it display correctly in Opera, 
the body padding must be set as well!

Browser support: IE: Internet Explorer, F: Firefox, N: Netscape.

W3C: The number in the "W3C" column indicates in which CSS recommendation the property is defined (CSS1 or CSS2).

Property Description Values IE F N W3C:

margin  A shorthand property for setting the margin properties in one declaration 
margin-top margin-right margin-bottom margin-left 4 1 4 1 
Property                    Description                 Values: IE F N W3C 
margin-bottom Sets the bottom margin of an element auto length%  4 1 4 1 
margin-left   Sets the left margin of an element auto length%    3 1 4 1 
margin-right  Sets the right margin of an element auto length%   3 1 4 1 
margin-top    Sets the top margin of an element auto length%     3 1 4 1 

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

/* -- float.clear -- force containment of floated LIs inside of main UL */
.navig:after {
	content: ".";
	height: 0;
	display: block;
	visibility: hidden;
	overflow: hidden;
	clear: both;
}
/* -- float.clear.END --  */

.navig li.selected ul, .navig li:hover ul {
	visibility: visible;
}

.navig li.selected ul {
/*	z-index: 10;*/
}

.navig li:hover ul {
/*	z-index: 100;*/
}

/*		Navigation make-up 	*/

.navig {
	font-size: .9em;
	font-weight: bold;
	color: #fff;
	background-color: #006666; /* background menu bar */

/*	margin: 3.0em auto 5.0em;  This moves the top menu top,right,bottom,left*/

/*	padding: 0 1em;*/
	border: 1px solid #03c;
	border-width: 1px 0;
	
	/******* width: 50.3em;  this background lenght value should be close 
			   to what is needed for elements to stay on one line */
	width: 50.1em;

}

/**************************** set the top menu **********************/
.navig a {
	color: #fff;
	text-decoration: none;
/*	padding: 0.5em 1.8em 0.7em 1.8em; top,right,bottom,left*/



      	padding: 0.5em 1.6em 0.7em 1.6em; /********* top,right,bottom,left *******8*/

	display: block;
}

.navig li {
	margin: 0;
	border-right: 1px dotted #fff;
}

/******* if the following selector was ".navig li:hover a" ********************
***** IE7 will NOT render nested UL! the reason is the background-color rule. */

.navig li:hover {
	color: #fff;
	background-color: #000;
}
/* which is why the link is styled separatelly */
.navig li:hover a {
	color: #fff;
}

.navig li:hover ul {
	background-color: #006699;  /* #cde background drop down*/
}

/* always pay attention that the value for top is such 
that it is possible to move the mouse over to submenu */
.navig ul {
	top: 2.0em;

/*	padding: 0 1em; should be identical to .navig, for best results 
	padding: 18px 0.5em 15px 0.5em; top,right,bottom,left*/

	color: #000;
	background-color: #ccc;
	width: 48em;
}

.navig li li {
	border-right: 1px dotted #999;
}

/*set the drop down  ****** padding for drop down *****XXXXXXXXX */
.navig li li a {
	color: #000;
	font-weight: normal;
	text-align: left;
	background: none;
	padding: 8px 0.5em 15px 0.5em; /*top,right,bottom,left*/
	border-bottom: 1px solid #465463;
}

.navig li li a:hover {
	text-decoration: underline;
}

/* fix the colors for selected item and submenu, for better usability */

.navig li.selected a, .navig li.selected, .navig li.selected a:hover {
	color: #000;
	background-color: #ccc;
}

.navig li.selected, .navig li.selected:hover a, .navig li.selected ul {
	background-color: #ccc;
}

/* IE5/Mac: \*//*/
.navig {
	display: inline-block;
}

.navig a {
	float: left;
}

.navig li ul {
	top: 1.8em;
	height: 2em;
}

.navig li li, .navig li li a {
	display: inline;
	float: none;
}
/*]]>*/

/* IE6: \*//*/
.navig {
	font-size: .9em;
	font-weight: bold;
	color: #fff;
	background-color: #006666; /* background menu bar */

/*	margin: 3.0em auto 5.0em;  This moves the top menu top,right,bottom,left*/

/*	padding: 0 1em;*/
	border: 1px solid #03c;
	border-width: 1px 0;
	
	/******* width: 50.3em;  this background lenght value should be close 
			   to what is needed for elements to stay on one line */
	width: 52.0em;

}

/**************************** set the top menu **********************/
.navig a {
	color: #fff;
	text-decoration: none;
/*	padding: 0.5em 1.8em 0.7em 1.8em; top,right,bottom,left*/

      	padding: 0.5em 1.9em 0.7em 1.7em; /********** top,right,bottom,left *******8*/

	display: block;
}

/*]]>*/
</style>

<!--[if lte IE 6]>
<style type="text/css" media="screen, tv, projection">
.navig {
	height: 1%;
}

.navig .twolevelhover ul {
	visibility: visible;
	z-index: 100;
}

.navig {
	padding: 0 1px;
}

.navig ul {
	padding:5px 4px;/************ MUST BE IN pixels for the next rule to work properly **************
	is is for the drop down level 2  ***************/
	width: expression((this.parentNode.parentNode.offsetWidth - 
	parseInt(this.currentStyle.paddingLeft) - 
	parseInt(this.currentStyle.paddingRight)) + 'px');
}
.navig .twolevelhover {
	color: #fff;
	background-color: #000;
}

.navig .twolevelhover a {
	color: #fff;
	background-color: #006699;
	font-weight: bold;
}

.navig .twolevelhover ul {
	background-color: #006699;
}

</style>

<![endif]-->
