/* slphMenu (cross frame menu) Placeholder*/
#slphMenu {
    background-color: #ee0015;
    margin: 0 0 37px 0;
    background-image: url('images/menu_background.jpg');
}

#slphMenu div.inner {
    height: 38px;
    border-left: 1px solid #cec7c7;
}

/* GROUPED MENU */
#slphMenu.grouped ul {
    list-style: none outside none;
    padding-left: 2px;
    margin: 0;
    font-size: 10px;
    height: 38px;
}

#slphMenu.grouped li {
    float: left;
}

#slphMenu.grouped li li {
    margin: 0;
    background-image: none;
}

#slphMenu.grouped li a span {
    padding: 2px 11px 2px 11px;
    margin: 7px 17px 7px 17px;
    display: inline-block;
    font-size: 1.4em;
    line-height: 20px;
    text-transform: uppercase;
    color: #FFFFFF;
}

#slphMenu.grouped li a:active,
#slphMenu.grouped li a:focus {
    outline: 0;
}

#slphMenu.grouped li a:hover span {
    text-decoration: none;
}

#slphMenu.grouped li a.disabled,
#slphMenu.grouped li dl a.disabled:hover {
    color: #bbb !important;
    background: none !important;
}

#slphMenu.grouped ul.holder {
    position: absolute;
    left: -9999em;
    display: block;
    z-index: 9999;
    background-position: 15px -168px;
    background-repeat: no-repeat;
    margin: 0;
    padding: 0px 0 0 0 !important;
    height: 440px;
}

#slphMenu.grouped .holder li {
    padding: 0 0 8px 8px;
    background: #eee;
    border: 1px solid #bcbcbc !important;
    box-shadow: 4px 4px 4px 0px #bbb;
    border-radius: 4px;
    margin-top: -1px;
}

#slphMenu.grouped .subMenuSpacer {
    height: 10px;
    background-image: url('../images/popup-arrow.png') !important;
    margin-left: 40px;
    background-repeat: no-repeat;
    border: 0 solid #ff0000;
    width: 200px;
    z-index: 10000;
    position: relative;
}

#slphMenu.grouped .col2 {
    width: 670px;
}

#slphMenu.grouped .col3 {
    width: 996px;
}

#slphMenu.grouped .holder dl {
    overflow: hidden;
    width: 140px;
    list-style-type: disc;
    list-style-position: inside;
    margin: 4px 8px 0 0;
    padding: 0 0 6px 0 !important;
    background-color: #fff;
    position: relative;
}

#slphMenu.grouped .holder dt {
    /*background: url('/images/home-portlet-header.png') repeat-x right !important;*/
    color: #333333;
    padding: 0 6px;
    line-height: 23px;
    font-size: 1.4em;
    text-align: center;
}

#slphMenu.grouped .holder dd {
    overflow: hidden;
    margin: 0;
    float: left;
    width: 200px;
    display: inline-block;
}

/* Display menu link arrow below primary menu tab rather than above menu dropdown */
#slphMenu.grouped li a.drop {
    height: 38px;
}

#slphMenu.grouped li:hover a.drop {
    /*background-image: url('/images/menu-link-arrow.gif');*/
    background-repeat: no-repeat;
    background-position: 15px bottom;
}

/* this is not ideal but flow of the dd needed to be change from ltr to top down, this was the best way of doing that without rewriting the menu code */
#slphMenu.grouped.top-down-items .holder dd {
    float: none !important;
    display: block !important;
}

#slphMenu.grouped .holder a {
    border-width: 0 !important;
    color: #1565ac !important;
    display: block !important;
    text-align: left !important;;
    font-size: 1.4em;
    line-height: 23px;
    white-space: nowrap;
    cursor: pointer;
    outline: 0;
    text-decoration: none;
    padding: 1px 0 0 9px;
    _padding: 1px 0 0 20px !important;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    _margin-top: 2px;
    text-overflow: ellipsis;
    overflow: hidden;
}

#slphMenu.grouped .holder a:hover {
    text-decoration: none;
    background-color: #ECF6FB !important;
    border-width: 0 !important;
}

#slphMenu.grouped .holder a.disabled,
#slphMenu.grouped .holder a.disabled:hover {
    color: #bbb !important;
    background: none !important;
    cursor: default !important;
}

#slphMenu.grouped .holder a.selected,
#slphMenu.grouped .holder a.selected:hover {
    background-color: #CDE3ED !important;
}

#slphMenu.grouped .holder div.col {
    float: left;
    display: inline-block;
    height: auto;
}

/* positioning */
#slphMenu.drop-on-hover li:hover ul.holder,
#slphMenu li ul.holder.show {
    left: auto !important;
    zoom: 1;
}

#slphMenu.drop-on-hover li:hover ul.holder.col3,
#slphMenu li ul.holder.col3.show {
    left: 4px !important;
    zoom: 1;
}

#slphMenu.grouped li:hover ul {
    left: auto;
}

/* NESTED MENU */
#slphMenu.nested ul {
    list-style: none outside none;
    padding: 1px 7px;
    margin: 0 8px;
    font-size: 11px;
    height: 35px;
    z-index: 9999;
    background: url('../images/sprite.gif') repeat-x 0 -37px;
    position: relative;
}

#slphMenu.nested li {
    float: left;
}

#slphMenu.nested ul ul {
    position: absolute;
    left: -9999px;
    height: auto !important;
    border: 1px solid #404040 !important;
    background: #fff;
    margin: 0;
    opacity: 0.2;
}

#slphMenu.nested ul li li a {
    display: block;
    float: left;
    padding: 6px 10px 6px 8px;
    color: #404040;
    text-decoration: none;
}

#slphMenu.nested li a {
    border-bottom: 0;
    color: #333;
    display: block;
    line-height: 12px;
    padding: 0 10px 0 6px;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    outline: 0;
}

#slphMenu.nested li li.sub {
    background: #fff url('../images/uirefresh/slphMenu-menu-right-arrow.gif') no-repeat 124px center;
}

#slphMenu.nested li a span {
    padding: 0 8px;
    display: inline-block;
    line-height: 34px;
}

#slphMenu.nested li a.drop span {
    background: url('../images/uirefresh/slphMenu-menu-down-arrow.gif') no-repeat right 16px !important;
    padding-right: 16px;
}

#slphMenu.nested ul ul li {
    margin: 0;
}

#slphMenu.nested ul ul li a {
    width: 113px;
}

#slphMenu.nested ul ul ul li a {
    width: 150px;
}

#slphMenu.nested ul li:hover {
    position: relative;
}

#slphMenu.nested ul li a:hover {
    direction: ltr;
    background-color: #404040;
    color: #fff;
    border-color: #8a9;
    position: relative;
}

#slphMenu.nested ul li:hover > a {
    background-color: #404040;
    color: #fff;
    border-color: #8a9;
}

#slphMenu.nested ul :hover ul {
    left: 0;
    width: 140px;
    top: 34px;
    padding: 0;
    opacity: 1;
}

#slphMenu.nested ul :hover ul :hover ul,
#slphMenu.nested ul :hover ul :hover ul :hover ul,
#slphMenu.nested ul :hover ul :hover ul :hover ul :hover ul {
    left: 130px;
    width: 168px;
    top: -1px;
}

#slphMenu.nested ul :hover ul ul,
#slphMenu.nested ul :hover ul :hover ul ul,
#slphMenu.nested ul :hover ul :hover ul :hover ul ul {
    left: -9999px;
}

/* BREADCRUMB */
#slphMenu.use-breadcrumb {
    height: 56px !important;
}

#slphMenu .breadcrumb {
    display: block;
    float: none;
    background: #fff;
    font-size: 11px;
    padding: 4px;
    color: #333;
    height: 14px;
    position: absolute;
    left: 0;
    width: 100%;
    z-index: -1;
}

#slphMenu .breadcrumb span.title {
    padding: 0 6px 0 6px;
    font-weight: bold;
}

/* HIDDEN */
#slphMenu a.hidden {
    display: none !important;
}

/*#slphMenu #help span { background: none !important; }*/
#slphMenu.grouped #reports span {
    background: none !important;
}

span.nav-active-page {
    color: #ffca00 !important;
    background: transparent;
    background-color: transparent;
}