/* Endeavours style sheet */

body { background: #FFFFFF URL(greyHback.jpg) top repeat-x; margin: 0px; padding: 0px; text-align: center; }

.pagearea { width: 980px; background-color: #DEDCD6; background: #FFFFFF URL(greyHback.jpg) top repeat-x; /*background: #ECECEC URL(greyVback.jpg) center repeat-y;*/ margin: 0px auto 0px auto; text-align: left; }
.displayarea { width: 980px; background: transparent; margin: 0px; border: 0px; padding: 0px 0px 0px 0px; }
.headingarea { width: 980px; height: 140px; padding: 0px; margin: 0px; background: #FFFFFF URL(top_bar.jpg) bottom repeat-x; border-bottom: solid 2px #DEDCD6; }
	/* Note that to have these elements on the same line you need float: commands - NOT display: inline
	   Also be very careful about width: 100% - it doesn't work in tables as you'd expect */
  .headerleft { float: left; width: 380px; height: 140px; background: transparent URL(top_corner.jpg) right bottom no-repeat; text-align: left; }
  .headermain { float: right; width: 600px; height: 112px; background: transparent URL(login_bak_image.jpg) top right no-repeat; color: #FFFFFF; text-align: right; }
  .headerright { float: left; width: 600px; height: 28px; background: transparent URL(top_bar2.jpg) bottom repeat-x; color: #FFFFFF; text-align: right; }

.leftcolumn { width: 200px; border: 0px; background: #00008B url(left_mid.jpg) left repeat-y; text-align: left; }
  .lefttop { height: 28px; width: 200px; background: url(left_top.jpg) top left no-repeat; }
  .leftmain { width: 150px; background: transparent; padding: 0px; padding-top: 10px; margin-left: 20px; }
  .leftbase { height: 30px; width: 200px; background: transparent; }

hr { height: 0px; width: 0px }

.toplinkarea { width: 780px; height: 26px; background: #FFFFFF URL(link_bar.jpg) repeat-x top; border-right: solid 1px #CCC; padding: 0px; color: #FFFFFF; }

.rightcolumn { display: none; }
    .righttop { }
	.rightmain { }
	.rightbase { }

.footer { width: 980px; height: 60px; background: #FFF URL(bot_bar2.jpg) bottom no-repeat; border-top: solid 0px #DEDCD6; color: #FFFFFF; }
	/* Note that to have these elements on the same line you need float: commands - NOT display: inline
	   Also be very careful about width: 100% - it doesn't work in tables as you'd expect */
    .footerleft { float: left; height: 30px; width: 979px; border-right: solid 1px #CCC; background: transparent url(left_bot.jpg) bottom left no-repeat; }
	.footermain { float: left; height: 30px; width: 980px; background: transparent; text-align: left; }
		.footermain .copy { float: left; Xdisplay: block; margin-top: 8px; margin-left: 20px; color: #FFFFFF; }
		.footermain .copy2 { float: right; Xdisplay: block; margin-top: 8px; margin-right: 20px; color: #FFFFFF; }
		.footermain a { color: #ffffff; }
	.footerright { /*float: left; height: 30px; width: 880px; background: transparent;*/ display: none; }

.mainarea { width: 780px; background: #FFFFFF; border-right: solid 1px #CCC; padding: 14px 10px 20px 10px;  }
.mainarea .leftpic {  }
.mainarea .rightpic {  }


.botlinkarea { height: 30px; padding-top: 10px; background: transparent; }

a img { border: none; }

#topnav1 a {
		display:inline;
		float: right;
		width: 82px;
		margin: 0px;
		margin-left: 2px;
		padding: 8px 0px 6px 0px;
		xfont: normal 14px/1 sans-serif;
		font-size: 0.916em;
		color:#fff;
		background: url("topnav1.jpg") 0 0 no-repeat;
		text-decoration: none;
		text-align: center;
		}
#topnav1 a:hover {	
		background-position: -100px 0;
		color: #c60;
		}
#topnav1 a:active {
		background-position: -200px 0;
		color:white;
		}

#topnav2 a {
		display:inline;
		float: right;
		width: 94px;
		margin: 0px;
		margin-left: 2px;
		padding: 6px 0px 8px 0px;
		xfont: normal 14px/1 sans-serif;
		font-size: 0.916em;
		color:#fff;
		background: url("topnav2.jpg") 0 0 no-repeat;
		text-decoration: none;
		text-align: center;
		text-transform: lowercase;
		}
#topnav2 a:hover {	
		background-position: -100px 0;
		color: #9bf;
		}
#topnav2 a:active {
		background-position: -200px 0;
		color:white;
		}

#flash_banner {
		clear: both;
		float: right;
		width: 540px;
		border-top: solid 4px #fff;
		border-bottom: solid 4px #fff;
		/*margin-top: 6px;*/
		/*padding-top: 4px;*/
		}

.featured { width: 320px; padding: 4px; float: left; margin-bottom: 14px; margin-right: 30px; }
.featured .leftpic { margin-left: 0px; padding-left: 0px; }
.featured H3 { color: #00008B; /*font-size: 14px;*/ font-size: 1.166em; padding-bottom: 2px; margin-bottom: 5px; border-bottom: solid 1px #00008B; }
.featured p { /*margin-bottom: 0px;*/ }

.featured2 { width: 740px; padding: 4px; float: left; margin-bottom: 14px; }
.featured2 .leftpic { margin-left: 0px; padding-left: 0px; }
.featured2 H3 { color: #00008B; /*font-size: 14px;*/ font-size: 1.166em; padding-bottom: 2px; margin-bottom: 5px; border-bottom: solid 1px #00008B; }
.featured2 p { /*margin-bottom: 0px;*/ }

.featured3 { width: 320px; background: #00008B; padding: 10px; float: left; margin-bottom: 14px; margin-right: 30px; }
.featured3 .leftpic { margin-left: 0px; margin-right: 8px; padding: 0px; border: solid 1px #fff; }
.featured3 H3 { color: #fff; /*font-size: 12px;*/ font-size: 1em; padding-bottom: 2px; margin-bottom: 5px; border-bottom: solid 1px #fff; }
.featured3 p { /*margin-bottom: 0px;*/ color: #fff; }

.featured4 { background: #00008B; padding: 0px; float: left; margin-bottom: 14px; }
.featured4 .leftpic { margin-left: 0px; margin-right: 6px; padding: 0px; border: solid 1px #fff; }
.featured4 H3 { color: #fff; /*font-size: 12px;*/ font-size: 1em; padding-bottom: 2px; margin-bottom: 5px; border-bottom: solid 1px #fff; }
.featured4 p { /*margin-bottom: 0px;*/ color: #fff; }