/* BODY */
html {background-color: #fff; text-align:center;}
body {background-color: #fff; font-family: verdana; font-size: 10pt; padding: 0; text-align:left;}
#main {position: relative; width: 1000px; border: 2px solid black; margin: 20px auto}

/* Popup Pictures */
a.screen, a.screen:visited {
color:#c00; 
position:relative; 
z-index:1;
}
a.screen b {
position:absolute;
visibility:hidden; /* hide the image */
width:150px; /* give it a width */
height:0; /* no height to solve an Opera bug that 
             makes it selectable when hidden */
border:0; /* add a border */
left:30px; /* position:the image */
top:-50px;
}
a.screen:hover {
text-decoration:none; 
border:0; /* needed for this to work in IE */ 
z-index:1000;
}
a.screen:hover b {
visibility:visible; /* make the image visible */
height:200px; /* now give it a height */
cursor:pointer; /* for IE */
z-index:500; 
}
a.screen:hover b img {
border:0; /* remove the link border */
}

/* Content Left */
#contentleft {text-align: left; width: 780px; float: left; margin: 10px 0 10px 10px;}
#contentleft h1 {font-size: 16px; color: #009933; margin: 10px 0 2px 0;}
#contentleft h2 {font-size: 14px; color: #009933; margin: 10px 0 2px 0;}
#contentleft p {margin: 0 0 5px 0;}
#contentleft td {padding: 1px 8px; font-size: 12px;}
/*#contentleft td a {color: #f00;}*/

/* Content Right */
#contentright {width: 190px; float: right; text-align: center; margin: 10px 10px 0 0;}
#contentright img {margin: 10px 0;}
#contentright img#team {margin: 10px 0 0 0;}
#contentright h1 {font-size: 16px; color: #009933; margin: 10px 0 2px 0;}
#contentright a {text-decoration: underline;}

/* FOOTER */
#footer {width: 1000px; clear: both; border-top: 1px solid black; font-size: 10pt; background: url('images/bar.jpg');}
#footer p {margin: 0 10px; padding: 5px 0px; color: #FFF;}
#footer a {color: #FFF;}