/* The main site menu */

#main-menu-wrapper {
    margin: 0 5px;
    background: url(i/backgrounds/menu/main/back.gif) top left repeat-x;
}

#main-menu-left {
    background: url(i/corners/menu/main/left.gif) top left no-repeat;
}

#main-menu-right {
    background: url(i/corners/menu/main/right.gif) top right no-repeat;
}

#main-menu-content {
    height: 37px;
    padding: 2px 20px;
}

#main-menu-content ul {
    list-style-position: outside;
    list-style-type: none;
    list-style-image: none;
    z-index: 99;
    position: relative;
}

#main-menu-content ul li {
    position: relative;
    padding: 7px 24px 0 24px;
    height: 28px;
    color: #FFFFFF;
    font-size: 14px;
    float: left;
    background: url(i/backgrounds/menu/main/divider.gif) top left repeat-y;
}

#main-menu-content ul li.active {
    background: #6cb0d2 url(i/backgrounds/menu/main/divider.gif) top left repeat-y;
}

#main-menu-content ul li.last {
    padding: 0;
    height: 35px;
    width: 2px;
}

#main-menu-content ul li a {
    font-size: 14px;
    color: #FFFFFF;
    text-decoration: none;
}

#main-menu-content ul li a:hover { text-decoration: underline; }

/* The main menu drop-down */

#main-menu-content ul ul {
    z-index: 99;
    float: left;
    position: absolute;
    padding: 8px 0 0 0;
    top: 30px;
    left: 0;
    margin: 0 0 0 -10000px;
}

.filler {
    margin: 0 0 0 -10000px;
    position: absolute;
    top: 37px;
    left: 0;
    width: 100%;
    height: 1px;
    background: transparent url(i/backgrounds/menu/main/drop-down-back.png) top left repeat;
    z-index: 200;
    float: left;
}

.conversion {
    position: absolute;
    top: 27px;
    right: -11px;
    display: none;
    width: 11px;
    height: 11px;
    z-index: 203;
    background: transparent url(i/backgrounds/menu/main/conversion.png) top left no-repeat;
}

#main-menu-content ul li:hover div.conversion {
    display: block;
}

.top-right-image, .bottom-right-image, .bottom-left-image {
    position: absolute;
    width: 3px;
    height: 3px;
}

.top-right-image {
    top: 0;
    right: -1px;
    background: transparent url(i/corners/menu/main/top-right.png) top left no-repeat;
}


#main-menu-content ul li:hover ul,
#main-menu-content ul li:hover ul:hover,
#main-menu-content ul li:hover div.filler
{
    margin: 0;
}

#main-menu-content ul ul li {
    position: relative;
    background: transparent url(i/backgrounds/menu/main/drop-down-back.png) top left repeat;
    width: 200px;
}

.left-border {
    float: left;
    padding: 0 0 0 1px;
    height: 100%;
    background: transparent url(i/backgrounds/menu/main/border.png) top left repeat-y;
}

.right-border {
    float: right;
    position: relative;
    padding: 0 1px 0 0;
    height: 100%;
    background: transparent url(i/backgrounds/menu/main/border.png) top right repeat-y;
}