yes of course it is possible, menu on our company web site is the MonoX default menu. Please take a look in the
You can change it manually or use the style from our company web site. Below if the CSS style from this web site.
.header .navigation
{
width
:
722px
;
float
:
right
;
position
:
relative
;
z-index
:
1000
;
}
.header .nav
{
float
:
right
;
}
.header .navigation ul
{
padding
:
0px
;
margin
:
40px
0px
0px
0px
;
list-style
:
none
;
float
:
left
;
}
.header .navigation ul li
{
float
:
left
;
display
:
inline
;
/*For ignore double margin in IE6*/
margin
:
0
;
color
:
#fff
;
margin-right
:
5px
;
position
:
relative
;
}
.header .navigation ul li a
{
height
:
25px
;
text-decoration
:
none
;
float
:
left
;
color
:
#cdd8e9
;
cursor
:
pointer
;
font-size
:
12px
;
font-weight
:
bold
;
padding
:
4px
0px
0px
15px
;
background
:
url
(img/nav.png)
no-repeat
top
left
;
text-shadow
:
1px
1px
1px
#000000
;
}
.header .navigation ul li.no-hand A
{
cursor
:
default
;
}
.header .navigation ul li strong
{
width
:
15px
;
position
:
relative
;
/*To fix IE6 problem (not displaying)*/
float
:
left
;
height
:
24px
;
background
:
url
(img/nav.png)
no-repeat
top
right
;
}
.header .navigation ul li a:hover
{
color
:
#fff
;
}
/* Start - Simple Menu */
.header .navigation ul ul
{
position
:
absolute
;
z-index
:
5000
;
top
:
29px
;
left
:
0px
;
float
:
left
;
clear
:
both
;
}
.header .navigation ul ul ul
{
top
:
auto
;
left
:
190px
;
border-left
:
solid
1px
Transparent;
float
:
left
;
clear
:
none
;
}
.header .navigation ul li:hover .level
0
{
display
:
block
;
margin
:
0px
;
padding
:
4px
;
float
:
left
;
}
.header .navigation .level
0
{
background
:
#2a4574
url
(img/navigation-level-bg.jpg)
right
repeat-y
;
padding
:
3px
;
border
:
solid
1px
#4e6587
;
}
.header .navigation .level
0
li
{
display
:
block
;
float
:
left
;
clear
:
both
;
margin
:
0px
0px
2px
0px
!important
;
border-left
:
solid
5px
#9ed457
;
}
.header .navigation .level
0
li:hover
{
background
:
#9ed457
;
}
.header .navigation .level
0
li a,
.header .navigation li.selected .level
0
li a
{
background
:
none
;
text-decoration
:
none
;
color
:
#ADBDD4
;
display
:
block
;
padding
:
5px
!important
;
margin
:
0px
!important
;
text-align
:
left
;
font-family
: Trebuchet MS,
Arial
,
Helvetica
,
sans-serif
;
font-size
:
12px
;
height
:
auto
!important
;
cursor
:
pointer
!important
;
}
.header .navigation .level
0
li a:hover,
.header .navigation li.selected .level
0
li a:hover
{
background
:
#9ed457
;
padding
:
5px
!important
;
color
:
#fff
!important
;
}
.header .navigation .level
0
li a span
{
background
:
none
!important
;
margin
:
0px
!important
;
padding
:
0px
0px
0px
5px
!important
;
white-space
:
pre
;
width
:
180px
;
display
:
block
;
}
.header .navigation .level
0
li a span:hover
{
background
:
none
!important
;
margin
:
0px
!important
;
padding
:
0px
0px
0px
5px
!important
;
}
.header .navigation .level
0
li strong
{
background
:
none
;
height
:
auto
;
width
:
auto
;
display
:
none
;
}
header .navigation .level
0
li a
{
background-color
:
transparent
;
}
.header .navigation .level
0
li:hover a
{
background-color
:
transparent
;
}
.header .navigation .level
0
li.selected a
{
color
:
#ADBDD4
;
background
:
none
;
}
.header .navigation .level
0
li:hover,
.header .navigation .level
0
li.selected a:hover
{
background
:
#9ed457
;
}
.header .navigation .level
0
{
display
:
none
;
}
.header .navigation .level
1
{
display
:
none
;
margin-top
:
-1px
;
}
.header .navigation ul.level
0
li:hover .level
1
{
display
:
block
;
}
/* End - MonoX Simple Menu */
Note: you need to manually copy the images to your application, and please change them a bit.