/* <rde-dm:attribute mode="write" attribute="rdeResponseMimetype" source="request" value="text/css" /> */
/* CSS Document */
/*** adding sf-vertical in addition to sf-menu creates a vertical menu ***/
.sf-menu {position: relative; padding-top: 10px; margin-bottom: 20px;}
.sf-vertical li {height: 20px;}
.sf-vertical li li {font-size: 1.2em; height: auto !important;}
.sf-vertical li li.last {background-color: transparent !important;}
/* this lacks ul at the start of the selector, so the styles from the main CSS file override it where needed */
.sf-vertical li:hover ul,
.sf-vertical li.sfHover ul {
    left:    207px; /* match ul width */
    top:    -20px;
}

.sf-vertical ul {width:    210px; background-image: url(/pub/img/nav-flyout-bg-foot.png); background-position: 0 100%; background-repeat: no-repeat; padding-bottom: 14px !important; overflow: hidden;}
.sf-vertical ul li {background: url(/pub/img/nav-flyout-bg-li.png) 0 0 repeat-y !important;}
.sf-vertical ul li.first {background: url(/pub/img/nav-flyout-bg.png) top left no-repeat !important; padding-top: 10px;}

/*** alter arrow directions ***/
.sf-vertical .sf-sub-indicator { background-position: -10px 0; } /* IE6 gets solid image only */
.sf-vertical a > .sf-sub-indicator { background-position: 0 0; } /* use translucent arrow for modern browsers*/

/* hover arrow direction for modern browsers*/
.sf-vertical a:focus > .sf-sub-indicator,
.sf-vertical a:hover > .sf-sub-indicator,
.sf-vertical a:active > .sf-sub-indicator,
.sf-vertical li:hover > a > .sf-sub-indicator,
.sf-vertical li.sfHover > a > .sf-sub-indicator {
    background-position: -10px 0; /* arrow hovers for modern browsers*/
}

.sf-vertical li a {background-repeat: no-repeat; background-position: 20px 0; text-indent: -9999em;}
.sf-vertical li li a:hover {text-decoration: underline;}
.sf-menu li:focus, .sf-menu li:hover, .sf-menu li:active, .sf-menu li.on {background-image: url(/pub/img/nav-active.png);}

/*.sf-vertical ul {padding: 4px 0 0 0 !important;}*/

/*make sub visible for testing */
/*.news-research ul {display: block !important; visibility: visible !important; top: 0 !important; left: 210px !important;} */