﻿#featured-items {
font-family: verdana, arial, sans-serif; 
width:607px; 
margin:0 0 0 0; 
position:relative;
z-index:100;
height:250px;
}
/* remove the bullets and set the margin and padding to zero for the unordered list */
#featured-items ul {
padding:0; 
margin:0;
list-style: none;
border:0;
}
#featured-items ul table {border-collapse:collapse; margin:-1px -10px; font-size:1em;}

/* float the list so that the items are in a line */
#featured-items ul li {
float:left; 
}
/* style the links to be 249px wide by 30px high with a top and right border 1px solid white. Set the background color and the font size. */
#featured-items ul li a, #featured-items ul li a:visited {
display:block; 
text-align:center; 
text-decoration:none; 
width:auto; 
height:30px; 
color:#666; 
border:1px solid #fff;
border-width:1px 1px 0 0;
line-height:30px; 
font-size:12px;
font-weight: bold;
margin-top:219px;
background:#E3ECF3 url(../../../SiteCollectionImages/slideshow/feature_tab_off_left.gif) bottom left no-repeat;
}
#featured-items ul li a div, #featured-items ul li a:visited div {
margin: 0; padding: 0;
height: 30px;
background: url(../../../SiteCollectionImages/slideshow/feature_tab_off_right.gif) bottom right no-repeat;
}
/* make the dropdown ul invisible */
#featured-items ul ul {
position:absolute; left:-9999px; height:0; z-index:10;
}

/* set the background and foreground color of the main featured-items items on hover */
#featured-items ul li#selected a{
color:#036; 
background:#E3ECF3 url(../../../SiteCollectionImages/slideshow/feature_tab_off_left.gif) bottom left no-repeat;
}
#featured-items ul li#selected a div{
margin: 0; padding: 0;
height:30px;
backgrnoud: url(../../../SiteCollectionImages/slideshow/feature_tab_off_right.gif) bottom right no-repeat;
}
#featured-items ul li a:hover,
#featured-items ul li:hover a {
color:#036; 
background:#E3ECF3 url(../../../SiteCollectionImages/slideshow/feature_tab_off_left.gif) bottom left no-repeat;
}
#featured-items ul li a:hover div,
#featured-items ul li:hover a div
{
margin: 0; padding: 0;
height:30px;
background: url(../../../SiteCollectionImages/slideshow/feature_tab_off_right.gif) bottom right no-repeat;
}
/* make the sub featured-items ul visible and position it beneath the first list item */
#featured-items ul li#selected ul {
top:-30px; 
height:auto;
left:0; 
text-align:left;
}
#featured-items ul :hover ul {
top:-30px; 
height:auto;
left:0; 
text-align:left;
z-index:100;
}
/* make the sub featured-items ul li the full width with padding and border. Add an auto scroll bar */
#featured-items ul li#selected ul li,
#featured-items ul :hover ul li {
background:#E3ECF3; 
color:#fff;
padding:0;
margin:0;
width:610px;
height:250px;
overflow:auto;
}
#featured-items ul li#selected ul li {  }

/*float the image left with padding and no border */
#featured-items ul li#selected ul li p img,
#featured-items ul :hover ul li p img {
padding:0; 
margin:0;
border:0;
}
/* style the heading font height */
#featured-items ul li#selected ul li h1,
#featured-items ul :hover ul li h1 {
margin: 30px 362px 0px 40px;
font-size:12px;
color: #ccc;
}
/* style the paragraph font height */
#featured-items ul li#selected ul li p,
#featured-items ul :hover ul li p {
font-size:11px;
margin: 10px 362px 0px 40px;
}
/* style the background and foreground color of the sub featured-items links */
#featured-items ul li#selected ul li a,
#featured-items ul :hover ul li a {
display:inline;
color:#ccc;
text-decoration:none;
border:0;
font-size:11px;
background: none;
}
/* style the background and forground colors of the links on hover */
#featured-items ul li#selected ul li a:hover,
#featured-items ul :hover ul li a:hover {
text-decoration:none; 
color:#036;
background: none;}

#featured-items ul li#selected ul li#feature_roadmap { background: #E3ECF3 url(../../../SiteCollectionImages/slideshow/feature_back_roadmap.jpg) no-repeat; }
#featured-items ul :hover ul li#feature_roadmap { background: #E3ECF3 url(../../../SiteCollectionImages/slideshow/feature_back_roadmap.jpg) no-repeat; }

#featured-items ul li#selected ul li#feature_communications { background: #E3ECF3 url(../../../SiteCollectionImages/slideshow/feature_back_communications.jpg) no-repeat; }
#featured-items ul :hover ul li#feature_communications { background: #E3ECF3 url(../../../SiteCollectionImages/slideshow/feature_back_communications.jpg) no-repeat; }
#featured-items ul li#selected ul li#feature_communications h1,
#featured-items ul :hover ul li#feature_communications h1 { color: #036; }
#featured-items ul li#selected ul li#feature_communications p,
#featured-items ul :hover ul li#feature_communications p { color: #333; }

#featured-items ul li#selected ul li#feature_metrics { background: #E3ECF3 url(../../../SiteCollectionImages/slideshow/feature_back_metrics.jpg) no-repeat; }
#featured-items ul :hover ul li#feature_metrics { background: #E3ECF3 url(../../../SiteCollectionImages/slideshow/feature_back_metrics.jpg) no-repeat; }
#featured-items ul li#selected ul li#feature_metrics h1,
#featured-items ul :hover ul li#feature_metrics h1 { color: #036; }
#featured-items ul li#selected ul li#feature_metrics p,
#featured-items ul :hover ul li#feature_metrics p { color: #333; }
