
.webfx-menu, .webfx-menu * {
    /*
    Set the box sizing to content box
    in the future when IE6 supports box-sizing
    there will be an issue to fix the sizes

    There is probably an issue with IE5 mac now
    because IE5 uses content-box but the script
    assumes all versions of IE uses border-box.

    At the time of this writing mozilla did not support
    box-sizing for absolute positioned element.

    Opera only supports content-box
    */
    box-sizing:         content-box;
    -moz-box-sizing:    content-box;
}

.webfx-menu {
    position:           absolute;
    z-index:            110;
    visibility:         hidden;
    width:              80px;
    border:             1px solid #957937;
    padding:            1px;

    color:#666666;
    
    text-align:         left;

    background:         #f2f0d3;

    -moz-opacity:       1;
}

.webfx-menu-empty {
    display:            block;
    border:             1px solid white;
    padding:            2px 5px 2px 5px;

    font-size:          11px;
    font-family:        Tahoma, Verdan, Helvetica, Sans-Serfif;

    color:              black;
}

.webfx-menu a {
    display:            block;
    width:              expression(constExpression(ieBox ? "100%": "auto"));    /* should be ignored by mz and op */
    height:             expression(constExpression("1px"));
    overflow:           visible;    
    padding:            2px 0px 2px 5px;
        
    font-size:          11px;
    font-family:        Tahoma, Verdan, Helvetica, Sans-Serfif;
    text-decoration:    none;
    vertical-align:     center;
    
    color:              #957937;
    border:             1px solid #f2f0d3;
}   

.webfx-menu a:visited,
.webfx-menu a:visited:hover {
    color:  #957937;
}

.webfx-menu a:hover {
    color:          #f2f0d3;
/*
    background:     rgb(234,242,255);
    border:         1px solid rgb(120,172,255);
*/
    background: #957937;
    border: 1px solid #957937;
}   

.webfx-menu a .arrow {
    float:          right;
    border:         0;
    width:          3px;
    margin-right:   3px;
    margin-top:     4px;
}

/* separtor */
.webfx-menu div {
    height:         0;
    height:         expression(constExpression(ieBox ? "2px" : "0"));
/*    border-top:     1px solid rgb(120,172,255);
    border-bottom:  1px solid rgb(234,242,255);
*/
    overflow:       hidden;
    margin:         2px 0px 2px 0px;
    font-size:      0mm;
}

.webfx-menu-bar {
/*    background:     rgb(120,172,255);/*rgb(255,128,0);*/
/*
    padding:        2px;
*/
    color: #E4BD86;
    padding:0px;    

    font-family:    Verdana, Helvetica, Sans-Serif;
    font-size:      11px;
    
    /* IE5.0 has the wierdest box model for inline elements */
/*    padding:        expression(constExpression(ie50 ? "0px" : "2px"));*/
}

.webfx-menu-bar a,
.webfx-menu-bar a:visited {
/*    border:             1px solid rgb(120,172,255);/*rgb(255,128,0);*/
    padding:            0px 0px 0px 0px;
    
    color: #E4BD86;
    text-decoration:    none;

    /* IE5.0 Does not paint borders and padding on inline elements without a height/width */
    height:     expression(constExpression(ie50 ? "20px" : "auto"));
}

.webfx-menu-bar a:hover {
    color:          black;
/*    background:     rgb(120,172,255);
    
    border-left:    1px solid rgb(234,242,255);
    border-right:   1px solid rgb(0,66,174);
    border-top:     1px solid rgb(234,242,255);
    border-bottom:  1px solid rgb(0,66,174);
*/
}

.webfx-menu-bar a .arrow {
    border:         0;
    float:          none;
}

.webfx-menu-bar a:active, .webfx-menu-bar a:focus {
    -moz-outline:   none;
    outline:        none;
    /*
        ie does not support outline but ie55 can hide the outline using
        a proprietary property on HTMLElement. Did I say that IE sucks at CSS?
    */
    

    ie-dummy:       expression(this.hideFocus=true);
/*      
    border-left:    1px solid rgb(0,66,174);
    border-right:   1px solid rgb(234,242,255);
    border-top:     1px solid rgb(0,66,174);
    border-bottom:  1px solid rgb(234,242,255);
*/
}