/****************************************/
/* Styles for popup and tooltip controls */
/****************************************/

/* Use to create a css tooltip from a link.
   <a href="#" class="tooltip">Info<span>Tooltip Text</span></a>
================================================================*/
a.tooltip:hover
{
   position:relative; /*this is the key*/
}

a.tooltip span
{
   display: none;
   z-index: 5000;
}

a.tooltip:hover span
{  /*the span will display just on :hover state*/
   display:block;
   position:absolute;
   top:2em; left:2em;
   border:1px solid black;
   background-color:InfoBackground;
   color: InfoText;
   text-align: left;
   padding: 2px;
}

/* Used by popupControl.js
====================================================*/
div.PopupControl
{
   background-color: White;
   width: 500px;
   border: solid 1px black;
   padding: 5px;
   text-align: left;
   position: absolute;
   top: 0px; left: 0px; z-index: 999999;
   /*Remove below line to remove shadow. Below line should always appear last within this CSS*/
   filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135,Strength=5);
}

/* Used for modal AJAX popups
====================================================*/
.modalPopupControl
{
   background-color: White;
   border: solid 8px #4F6F86;
   padding: 5px;
   text-align: left;
}

.modalPopupControlBackground
{
	background-color:White;
	filter:alpha(opacity=50);
	opacity:0.5;
}

.modalPopupControlTitleBar
{
    background-color: #F3F3F3;
    width: 100%;
    color: #4F6F86;
    font-size: 14px;
    text-align: right;
}