﻿
/*

SIMPE TOOLTIP

*/

a.tooltip
{
    position: relative; /*this is the key*/
    z-index: 24;
}
a.tooltip:hover
{
    z-index: 25;
}
a.tooltip span
{
    display: none;
}
a.tooltip:hover span
{
    /*the span will display just on :hover state*/
    display: block;
    position: absolute;
    top: 2em;
    left: 2em;
    width:220px;
    border: 1px solid #0cf;
    background-color: #cff;
    color: #000;
    text-decoration: none;
    text-align: left;
    padding: 8px;
    font-size: 9pt;
    font-family: Trebuchet MS,Tahoma;
}

/*
*
*	Left aligned ToolTip	
*
*/


a.tooltip2
{
    position: relative; /*this is the key*/
    z-index: 24;
}
a.tooltip2:hover
{
    z-index: 25;
}
a.tooltip2 span
{
    display: none;
}
a.tooltip2:hover span
{
    /*the span will display just on :hover state*/
    display: block;
    position: absolute;
    top: 2em;
    left: -210px;
    width: 220px;
    border: 1px solid #0cf;
    background-color: #cff;
    color: #000;
    text-decoration: none;
    text-align: left;
    padding: 8px;
    font-size: 9pt;
    font-family: Trebuchet MS,Tahoma;
}


/*
*
*	Intented Tooltip for Left Navigation	
*
*/


a.tooltip3
{
    position: relative; /*this is the key*/
    z-index: 24;
}
a.tooltip3:hover
{
    z-index: 25;
}
a.tooltip3 span
{
    display: none;
}
a.tooltip3:hover span
{
    /*the span will display just on :hover state*/
    display: block;
    position: absolute;
    top: 2em;
    left: 10em;
    width: 220px;
    border: 1px solid #0cf;
    background-color: #cff;
    color: #000;
    text-decoration: none;
    text-align: left;
    padding: 8px;
    font-size: 9pt;
    font-family: Trebuchet MS,Tahoma;
}

/*

LEFT Aligned, Free Width

*/

a.tooltip4
{
    position: relative; /*this is the key*/
    z-index: 24;
}
a.tooltip4:hover
{
    z-index: 25;
}
a.tooltip4 span
{
    display: none;
}
a.tooltip4:hover span
{
    /*the span will display just on :hover state*/
    display: block;
    position: absolute;
    top: 2em;
    left: 2em;
    width:auto;
    border: 1px solid #0cf;
    background-color: #cff;
    color: #000;
    text-decoration: none;
    text-align: left;
    padding: 8px;
    font-size: 9pt;
    font-family: Trebuchet MS,Tahoma;
}
