/* All <ul> tags in the menu including the first level */

.menulist {
        position: absolute;
        top: 38px;
        right: 0px;
}

.menulist, .menulist  ul {
        margin: 0;
        padding: 0;
        list-style: none;
        font-family: Verdana, Arial, Helvetica, sans-serif;
        color: #FFFFFF;
}



/* Submenus (<ul> tags) are hidden and absolutely positioned downwards from their parent */

.menulist ul {
        display: none;
        position: absolute;
        top: 1em;
        margin-top: 16px;
        width: 150px;
}

.menulist .company ul{
        margin-left: -83px;
}

.menulist .solutions ul{
        width: 175px;
}

.menulist .products ul{
        width: 175px;
}              

/*

 All menu items (<li> tags). 'float: left' lines them up horizontally, and they are

 positioned relatively to correctly offset submenus. Also, they have overlapping borders.

*/

.menulist li {
        float: left;
        display: block;
        position: relative;
        margin-right: -1px;
}
/* Items in submenus - override float/border/margin from above, restoring default vertical style */

.menulist ul li {
        float: none;
        margin: 0;
        margin-bottom: -1px;
        background-color: #f3f3f3;
        color: #666666;
}

.menulist ul>li:last-child {
 margin-bottom: 1px; /* Mozilla fix */
}

/* Links inside the menu */

.menulist a {
        display: block;
        color: #FFFFFF;
        text-decoration: none;
        padding-top: 8px;
        padding-right: 6px;
        padding-bottom: 8px;
        padding-left: 6px;
        background-image: url(/images/main-nav-tile.jpg);
        background-repeat: repeat-x;
}

.menulist .first a {
        color: #fff;
        background-image: url(/images/main-nav-left-tile.jpg);
        background-repeat: no-repeat;
        background-color:#f3f3f3;
        padding-left: 10px;
}

.menulist .last a {
        color: #fff;
        background-image: url(/images/main-nav-right-tile.jpg);
        background-repeat: no-repeat;
        background-color:#f3f3f3;
        background-position: right 0px;
        padding-right: 10px;
}

.menulist ul li a {
        color: #7e7e7e;
        background-color: #f3f3f3;
        background-image: none;
        padding-top: 5px;
        padding-bottom: 5px;
}

.menulist ul li a:visited {
        color:#7e7e7e;
}

.menulist .first ul li a {
        color: #7e7e7e;
        background-color: #f3f3f3;
        background-image: none;
        background-position: 0px;
}

/* Lit  items: 'hover' is mouseover, 'highlighted' are parent items to visible menus */

.menulist a:hover, .menulist a.highlighted:hover, .menulist a:focus, .menulist a.highlighted {
        color: #7e7e7e;
        background-image: url(/images/main-nav-tile-hover.jpg);
}

.menulist .first a:hover, .menulist .first a.highlighted:hover, .menulist .first a:focus, .menulist .first a.highlighted {
        color: #7e7e7e;
        background-image: url(/images/main-nav-left-tile-hover.jpg);
        background-repeat: no-repeat;
        background-color:#f3f3f3;
}

.menulist .last a:hover, .menulist .last a.highlighted:hover, .menulist .last a:focus, .menulist .last a.highlighted {
        color: #7e7e7e;
        background-image: url(/images/main-nav-right-tile-hover.jpg);
        background-repeat: no-repeat;
        background-color:#f3f3f3;
        background-position: right;
}

.menulist ul li a:hover {
        color: #ffffff;
        background-color: #7e7e7e;
        background-image: none;
}

.menulist .first ul li a:hover, .menulist .first ul li a.highlighted:hover, .menulist .first ul li a:focus {
        color: #ffffff;
        background-color: #7e7e7e;
        background-image: none;
}

/*

 If you want per-item background images in your menu items, here's how to do it.

 1) Assign a unique ID tag to each link in your menu, like so: <a id="xyz" href="#">

 2) Copy and paste these next lines for each link you want to have an image:

    .menulist a#xyz {

      background-image: url(out.gif);

    }

    .menulist a#xyz:hover, .menulist a.highlighted#xyz, .menulist a:focus {

     background-image: url(over.gif);

    }

*/



/* Only style submenu indicators within submenus. */

.menulist a .subind {
 display: none;
}
.menulist ul a .subind {
 display: block;
 float: right;
}


/* 'Escaped Comment' hack for horizontal menubar width in IE5/Mac */

.menulist a {
 float: left;
}

.menulist ul a {
        float: none;
        color: #666666;
}

/* \*/

.menulist a {
 float: none;
}



/* Style Drop down hover*/
.menulist ul a:hover, .menulist ul a.highlighted:hover, .menulist ul a:focus {
        color: #ffffff;
        background-color: #7e7e7e;
}

/*

 HACKS: IE/Win:

 A small height on <li> and <a> tags and floating prevents gaps in menu.

 * html affects <=IE6 and *:first-child+html affects IE7.

 You may want to move these to browser-specific style sheets.

*/

*:first-child+html .menulist ul li {
 float: left;
 width: 100%;
}



* html .menulist ul li {
 float: left;
 height: 1%;
}

* html .menulist ul a {
 height: 1%;
}

/* End Hacks */