/* CSS only needed for the demo */



#mainContainer{
        width:630px;
        border-left:1px solid #317082;  
        border-right:1px solid #317082; 
        margin:0 auto;  /* Center align content, equivalent to margin-left:auto;margin-right:auto; */
        text-align:left;        /* Override inherited text-align:center from the body tag */
        background-color:#FFF;
        height:100%;
}

#menuColumn{
        width:160px;
        float:left;
        padding:5px;
        font-size:0.9em;
}
#mainContent{
        width:440px;
        float:left;     
}

.oddRow{
        background-color:#FFF;
}
.evenRow{
        background-color:#EEE;
}

.productTable{
        border:3px double #000;
}
h3{
        margin-top:0px;
}


/* End css for the demo */

/* CSS needed for the script */

#ajax_tooltipObj{
        z-index:1000000;
        text-align:left;
}
#ajax_tooltipObj div{
        position:relative;
}

/* If you don't want the arrow - Just set the width of this div to 1 or something like that and drop the background selectors from the CSS below */

#ajax_tooltipObj .ajax_tooltip_arrow{   /* Left div for the small arrow */
        background-image:url('./images/arrow.gif');
        width:20px;
        position:absolute;
        left:0px;
        top:0px;
        background-repeat:no-repeat;
        background-position:center left;
        z-index:1000005;
        height:60px;
}


TR.WSGFormHeader
{
    FONT-WEIGHT: bolder;
    COLOR: black;
    HEIGHT: 15pt;
    BACKGROUND-COLOR: darkgray

}
TR.WSGField
{
}

TD.WSGFieldHeader
{
    FONT-WEIGHT: bolder;
    COLOR: black;
    TEXT-ALIGN: left;
}

TD.WSGFieldData
{
}