#container-menu-main {
	width:  100%;
	height: 40px;
	background: transparent repeat-x scroll top left;
	color:      #ffffff;
	position: absolute;
	left:     0px;
	top:      -40px;
	z-index: 3;
}

#container-menu-main-left {
	width:  10px;
	height: 100%;
	
	background: transparent no-repeat scroll top left;
	
	position: absolute;
	left:     0px;
	top:      0px;
}

#container-menu-main-right {
	width:  10px;
	height: 100%;
	
	background: transparent no-repeat scroll top left;
	
	position: absolute;
	right:    0px;
	top:      0px;
}

#container-menu-main-buttons {
	position: relative;
	z-index:  2;
}

.menu-main-button-container {
	height: 40px; /* Cannot simply be 100%, or Netscape refuses to display the edge graphics. */
	float:  left;
	
	position: relative;
}

.menu-main-button-link, .menu-main-button, .menu-main-button-hl {
	color:           #ffffff;
	text-decoration: none;
	cursor: pointer;
}

.menu-main-button, .menu-main-button-hl {
	height: 40px; /* Cannot simply be 100%, or Netscape refuses to display the edge graphics. */
	float:  left; /* IE 6 needs this, otherwise it stretches the button to 100% width. */
	position: relative;
}

.menu-main-button-left {
	width:  11px;
	float:  left;
	
	height: 40px; /* Height value required, or Firefox causes the area to expand to much and stretch the link area. */
}

.menu-main-button-left-home {
	width:  8px;
	float:  left;
	position: relative;
	
	height: 40px; /* Height value required, or Firefox causes the area to expand to much and stretch the link area. */	
}

.menu-main-button-right {
	width:  11px;
	float:  left;
	position: relative;
	
	height: 40px; /* Height value required, or Firefox causes the area to expand to much and stretch the link area. */	
}

.menu-main-button-content {
	float:  left;
	height: 20px; /* Height value required, or Firefox causes the area to expand to much and stretch the link area. */	
	
	padding: 10px 6px 10px 6px;
	cursor: pointer; /* Required or Firefox will flicker to the text cursor. */
}

.menu-main-sub {
	width:  200px;
	
	position: relative;
	z-index:  8;
}

.menu-main-sub-effect-wrapper {
	overflow: hidden; 
	
	width:  150px;	
	-width: 150px; /* IE 6 */
	
	position: absolute; 
	top:      40px; 
	left:     4px;

	z-index:  8;
}

.menu-main-sub-block {
	background-color: #233250;	
	width: 150px;
	
	-width: 150px; /* IE 6 */
	
	padding-left:  4px;
	padding-right: 4px;
	
	clear: both;
}

.menu-main-sub-top, .menu-main-sub-bottom {
	background-color: #233250;

	width:  158px;
	height: 5px;
	
	float: left;
	
	font-size:   1px; /* IE 6 */
	line-height: 1px; /* IE 6 */
}

.menu-main-sub-topleft {
	background-color: #233250;
	
	width:  0px;
	height: 0px;
	
	float: left;
	
	font-size:   1px; /* IE 6 */
	line-height: 1px; /* IE 6 */
}

.menu-main-sub-topright {
	background: transparent no-repeat scroll top right;
	
	width:  0px;
	height: 0px;
	
	float: left;
	
	font-size:   1px; /* IE 6 */
	line-height: 1px; /* IE 6 */
}

.menu-main-sub-bottomleft {
	background: transparent  no-repeat scroll bottom left;
	
	width:  0px;
	height: 0px;
	
	float: left;
	
	font-size:   1px; /* IE 6 */
	line-height: 1px; /* IE 6 */
}

.menu-main-sub-bottomright {
	background: transparent no-repeat scroll bottom right;
	
	width:  0px;
	height: 0px;
	
	float: left;
	
	font-size:   1px; /* IE 6 */
	line-height: 1px; /* IE 6 */
}

.menu-main-sub-item, .menu-main-sub-item-hl {
	padding:  4px 6px 4px 6px;	
	position: relative;
}

/* Hover element is for Opera, which messes with the parent button layout when a re-draw of the elements is caused. */
.menu-main-sub-item-hl, .menu-main-sub-block A:hover .menu-main-sub-item {
	background-color: #233250;
}

.menu-main-sub-item-corner-topleft {
	width:  0px;
	height: 0px;
	
	position: absolute;
	top:      0px;
	left:     0px;
	
	-left: -6px; /* IE 6 */
}

.menu-main-sub-item-corner-topright {
	width:  0px;
	height: 0px;
	
	position: absolute;
	top:      0px;
	right:    0px;
	
	-right:  4px; /* IE 6 */
}

.menu-main-sub-item-corner-bottomleft {
	width:  0px;
	height: 0px;
	
	position: absolute;
	bottom:   0px;
	left:     0px;	
	
	-left:   -6px; /* IE 6 */
	-bottom: 23px; /* IE 6 */
}

.menu-main-sub-item-corner-bottomright {
	width:  0px;
	height: 0px;
	
	position: absolute;
	bottom:   0px;
	right:    0px;
	
	-right:  4px; /* IE 6 */
	-bottom: 23px; /* IE 6 */
}

.menu-main-sub-block A:hover, .menu-main-sub-block A:hover {
	color: #ffffff;	
}