BODY
{
background-color: #cdd2d5;
margin : 0px 0px 0px 0px;
}

IMG
{
border: 0px;
}

DIV.container
{
position:absolute;
left: 50%;
margin-left: -389px; /*set to a negative number 1/2 of your width*/
width:780px;
height: 100%;
}


DIV.bg
{
position: relative;
background-image: url(../images/header.jpg);
background-repeat: no-repeat;
width:780px;
height: 153px;
text-align: left;
}


DIV.nav-text
{
font-size: 11px;
font-family: verdana, arial, helvetica, sans-serif;
font-weight: bold;
color: #f79b5d;
position: relative;
top: 37px;
left: 76px;
padding-top: 3px;
padding-left: 11px;
}

DIV.nav-text a
{
text-decoration: none;
color: #f79b5d;
position: relative;
top: 37px;
left: 76px;
font-size: 11px;
padding-top: 3px;
padding-left: 11px;
}


.nav-text a:hover {text-decoration: none; color: #1897b6; font-size : 11px; font-weight : bold;}
          

DIV.intro-text
{
font-size: 11px;
font-family: verdana, arial, helvetica, sans-serif;
color: #595858;
text-align: left;
left:397px;
position: absolute;
top: 245px;
width: 360px;

}

DIV.intro-text a
{
text-decoration: none;
color: #1897b6;
font-weight : bold;
}

.intro-text a:hover {text-decoration: none; color: #f79b5d; font-size : 11px; font-weight : bold;}



#imap {
margin-top:0; 
  display:block; 
  left:0; 
    top:153; 
	width:780px; 
  height:644px; 
  background:url(../images/middlebg.jpg) no-repeat; 
  position:absolute;
  }

/* set up the definition list <dt><a> to hold the background image for the hover state */
#imap a#title {
margin-top:0; 
  display:block; 
  width:780px; 
  height:0; 
  padding-top:0px; 
  overflow:hidden; 
  position:absolute; 
  left:0; 
  top:153; 
  background:transparent url(../images/transparentvid.gif) no-repeat 379px 100px; 
  cursor:default;
  }
/* the hack for IE pre IE6 */
* html #imap a#title {
  height:0px;
  he\ight:0;
  }

/* the <dt><a> hover style to move the background image to position 0 0 */
#imap a#title:hover {
  background-position: 0 0; 
  z-index:10;
  }

	/* place the <dd>s in the correct absolute position */
#imap dd {
  position:absolute; 
  padding:0; 
  margin:0;
  }
#imap #picp {
  left:0px; 
  top:27px; 
  z-index:20;
  }
#imap #picr {
  left:0px; 
  top:137px; 
  z-index:20;
  }
#imap #picj {
  left:0px; 
  top:242px; 
  z-index:20;
  }
#imap #picg {
  left:0px; 
  top:346px; 
  z-index:20;
  }
#imap #pich {
  left:0px; 
  top:450px; 
  z-index:20;
  }
/* style the <dd><a> links physical size and the background image for the hover */
#imap a#video {
  display:block; 
  width:379px; 
  height:100px; 
  background:transparent url(../images/transparentvid.gif) -100px -100px no-repeat; 
  text-decoration:none; 
  z-index:20;
  }

/* style the <dd><a> links physical size and the background image for the hover */
#imap a#audio {
  display:block; 
  width:379px; 
  height:100px; 
  background:transparent url(../images/transparentaudio.gif) -100px -100px no-repeat; 
  text-decoration:none; 
  z-index:20;
  }
	
/* style the <dd><a> links physical size and the background image for the hover */
#imap a#songs {
  display:block; 
  width:379px; 
  height:100px; 
  background:transparent url(../images/transparentsongs.gif) -100px -100px no-repeat; 
  text-decoration:none; 
  z-index:20;
  }	
	
/* style the <dd><a> links physical size and the background image for the hover */
#imap a#studies {
  display:block; 
  width:379px; 
  height:100px; 
  background:transparent url(../images/transparentstudies.gif) -100px -100px no-repeat; 
  text-decoration:none; 
  z-index:20;
  }		
	
/* style the <dd><a> links physical size and the background image for the hover */
#imap a#download {
  display:block; 
  width:379px; 
  height:100px; 
  background:transparent url(../images/transparentdownload.gif) -100px -100px no-repeat; 
  text-decoration:none; 
  z-index:20;
  }		
	

	
/* style the span text so that it is not initially displayed */
#imap a span, #imap a:visited span {
  display:none;
  }

	/* move the link background image to position 0 0 when hovered */
#imap a#video:hover, #imap a#audio:hover, #imap a#songs:hover, #imap a#studies:hover, #imap a#download:hover {
  background-position:0 0;
  }

/* define the common styling for the span text */
#imap a:hover span {
  position:absolute;  
  width:45px; 
  display:block; 
  font-family:arial; 
  font-size:10px; 
  background:#000000; 
  color:#ffffff; 
  border:1px solid #000; 
  padding:3px;
  }
/* the hack for IE pre IE6 */
* html #imap a:hover span {
  width:45px; w\idth:45px;
  }


	
	

DIV.footer-background
{
position: relative;
background-image: url(../images/footer.jpg);
background-repeat: no-repeat;
height: 232px;
width: 780px;
text-align: left;
}

DIV.footer-text
{
font-size: 11px;
font-family: verdana, arial, helvetica, sans-serif;
font-weight: bold;
color: #f79b5d;
position: relative;
top: 32px;
left: 0px;
padding-top: 3px;
padding-left: 11px;
}

DIV.footer-text a
{
text-decoration: none;
color: #f79b5d;
position: relative;
top: 32px;
left: 0px;
font-size: 11px;
padding-top: 3px;
padding-left: 11px;
}


.footer-text a:hover {text-decoration: none; color: #1897b6; font-size : 11px; font-weight : bold;}