﻿/* styles for css driven flyout menu - supports only one level of children */

#menu 
{
    float:left; 
    padding:0; 
    /*margin:3px 0 0 0; */
    margin:0;
    list-style:none; 
    position:relative; 
    width:185px;
}

#menu ul 
{
    padding:4px 0 4px 0;
    margin:0; 
    list-style:none; 
    width:200px; 
    background-color:#e1e1e1;
    height:auto; 
    position:absolute;
    left:-9999px; 
    top:0;
    border:1px solid #888888;
    /*border:1px solid #000;
    border-top-right-radius:6px;
    -moz-border-top-right-radius:6px;
    border-bottom-right-radius:6px;
    -moz-border-bottom-right-radius:6px;*/
    box-shadow: 3px 3px 3px #888888;
}

#menu table 
{
    border-collapse:collapse; 
    width:0;
    height:0; 
    margin:-1px -10px;
 }

#menu li 
{
    float:left; 
    padding-left:4px;
    /* margin-bottom:1px; */
}

#menu li a 
{
    display:block; 
    /*font-weight:bold;*/
    float:left; 
    width:176px; 
    height:24px; 
    /* background:#DCDCDC; */
    /*border-bottom:1px solid #1b5e8c; */
    color:#000; 
    line-height:24px;
    font-size:10pt; 
    text-decoration:none; 
    text-indent:10px;
}

#menu li:hover 
{
    position:relative;
    /*position:static;*/
    float:left;
}

#menu li a:hover 
{
    position:relative; 
    background-color:#e1e1e1; 
    /*color:#fff;*/
}

#menu li:hover > a 
{
    background-color:#e1e1e1; 
    color:#fff;
    background: linear-gradient(to bottom, #676767 0%,#4c4c4c 100%); /* W3C */
}

#menu ul li a 
{
    border-bottom:0;
    background:#e1e1e1;
    border:0;
     width:212px; 
}


#menu :hover ul,
#menu :hover ul :hover ul,
#menu :hover ul :hover ul :hover ul 
{
    left:178px;
}

#menu :hover ul ul,
#menu :hover ul :hover ul ul 
{
    left:-9999px;
}

#menu ul li:hover > a 
{
    background-color:#e1e1e1; 
    
}

/* make child wider than parent */
#menu li ul
{
    width:220px;
    /*border:1px solid #fff;*/
}

#menu li ul li a 
{
    /*border:1px solid #fff;*/
}

#menu li ul li a:hover
{
    /*border:1px solid #1b5e8c;*/
    color:#fff;
}