body{
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#666666;
	background-image: url(images/back_grad.jpg);
	background-attachment: fixed;
	background-repeat: repeat-x;
}

a.info{
    position:relative; /*this is the key*/
    z-index:24; 
	background-color:#ffffff;
    color:#666666;
	font-size:13px;
    text-decoration:none}
a.info:hover{z-index:25; background-color:#ff0;}
a.info span{display: none;}
a.info:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:2em; left:2em; width:15em;
    border:1px solid #043bd1;
    background-color:#cff; 
	color:#000000;
    text-align: left;
	padding: 5px;}



.header 
{
	font-weight: bold;
	font-size: 18px;
} 

.magic {
	position : absolute;
	width : 740px;
	left : 816px;
	top : 590px;
	margin-left : -370px;
	z-index:0;
	height: 1386px;
	
/* old simple code. It only works if the whole page is aligned left 
	position:absolute;
	width:740px;
	z-index:C;
	left:260px;
	top: 580px;
*/	
}



.magicshort {
	position:absolute;
	width:740px;
	z-index:C;
	left:260px;
	top: 260px;
}

.hrstyle{
color: #cccccc; height: 1px;
}

a.navigation:link {text-decoration: none;color:#F9F7ED}
a.navigation:visited {text-decoration: none;color:#F9F7ED}
a.navigation:active {text-decoration: none;color:#F9F7ED}
a.navigation:hover {text-decoration: none; font-weight:bold; color: #F9F7ED;}

a.footer:link {text-decoration: none;color:#000000}
a.footer:visited {text-decoration: none;color:#000000}
a.footer:active {text-decoration: none;color:#000000}
a.footer:hover {text-decoration: none; font-weight:bold; color: #000000;}

/*A:link {text-decoration: underline; color:#324EBB}*/
/*
A:visited {text-decoration: underline; color:#324EBB}
A:active {text-decoration: underline; color:#324EBB}
A:hover {text-decoration: underline; color: #0000cc;}*/

.tablemain {background-color: #ffffff; border: 2px solid #5b5b5b; }
.h1header{font-family: Verdana, Arial, Helvetica, sans-serif; color: #0031ce; font-size: 24px; display:inline;}
.tdnavigation{padding: 7px; background-color: #36393D;  color: #ffffff; font-size: 13px;vertical-align:top}
.tdheader{vertical-align:top; width: 699px; background-color: #CDEB8B;  padding: 15px 15px 0px 15px;}
.tdbody{vertical-align:top; height: 150px; width: 699px; background-color: #ffffff; padding: 15px; font-size:14px;}
.tdfooter{vertical-align:top; padding: 4px; background-color: #F9F7ED; width: 200px; margin-top: 1px; color: #5b5b5b; font-size: 14px;}
.bigger{font-size: 18px;}

.bodylink{
text-decoration: none; 
color:#666666
}
.trans_back_bottom {
	background-image: url(images/trans_back_bottom.jpg);
	background-repeat: no-repeat;
	position: static;
	background-attachment: fixed;
	background-position: center bottom;
	background-color: #4DA7DC;
}