@charset "utf-8";
/* CSS Document */
body {
	margin:0;
	padding:0;
	text-align: center; /* IE5 workaround for centering */
}

a {	outline: none;  /* removes focus box around links in Firefox */}
a:link {
	color:#31A7CE;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #31a7ce;
}
a:visited {
	color:#31A7CE;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #31a7ce;
}
a:hover {
	text-decoration: none;
	border:none;
}
h1 {
	font-size:18px;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-weight:normal;
	color:#ec5f00;
	padding:0px;
	margin:0px;
}





#banner {
	height:100px;
	background-image:url(../graphicsTemplate/bannerBackground.jpg);
	background-repeat: repeat-x;
	position:relative;
}

#banner .name {
	position:absolute;
	top:17px;
	left:30px;
}

/* 

navigation using css sprites -- www.alistapart.com/articles/sprites

*/
#navcontainer { /* used to add background with shadow */
	background:url(../graphicsTemplate/navBackground.jpg);
	position:relative;
	height:45px;
	margin:0;
}

#navwrap { /* used to align the navigation with the page content */
	width:761px;
	margin:auto;
}

#nav { /* used to define the nav button space and the nav button file */
	position: relative;
	background:url(../graphicsTemplate/navButtons.jpg);
	background-repeat:no-repeat;
	width: 553px; 
	height: 30px; 	
	margin:0px auto auto 0px;
}
	
#nav li { /* used to align the nav button file and turn off list style */
	margin:0;
	padding:0;
	position: absolute; 
	top: 0px;  
	list-style: none;
}
	
#nav li, #nav a {height:30px; display:block;} /* display:block to fill in the entire space with the button graphic */

/* used to define the locations of the UP buttons in the graphics file */
#home 		{left: 0px; width:113px;}
#about 		{left: 113px; width:143px;}
#resources 	{left: 256px; width:156px;}
#contact 	{left: 412px; width:141px;}

/* used to define the locations of the DOWN buttons in the graphics file */
#home a:hover {
	background-image: url(../graphicsTemplate/navButtons.jpg);
	background-position: 0px -50px;
	background-repeat: no-repeat;
}
	
#about a:hover {
	background-image: url(../graphicsTemplate/navButtons.jpg);
	background-position: -113px -50px;
	background-repeat: no-repeat;
}

#resources a:hover {
	background-image: url(../graphicsTemplate/navButtons.jpg);
	background-position: -256px -50px;
	background-repeat: no-repeat;
}
	
#contact a:hover {
	background-image: url(../graphicsTemplate/navButtons.jpg);
	background-position: -412px -50px;
	background-repeat: no-repeat;
}

/*

Webpage layout. Can apply to all webpages.

*/

#content {
	position:relative;
	width:761px;
	overflow: hidden; /* used so content div will stretch */
	margin: 30px auto 30px auto;
	padding:0px;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:12px;
	line-height:22px;
	color:#666666;
	text-align:left;
}

#leftpanel {
	position:relative;
	width:220px;
	float:left;
}
#leftpanelTop {
	width:220px;
	height:8px;
	background-image:url(../graphicsTemplate/leftpanelTop.png);
	background-repeat: no-repeat;
	position:relative;
	float:left;
}
#leftpanelMid {
	width:220px;
	height:10px;
	background-image:url(../graphicsTemplate/leftpanelMid.png);
	background-repeat: repeat-y;
	position:relative;
	float:left;
}
#leftpanelBottom {
	width:220px;
	height:8px;
	background-image:url(../graphicsTemplate/leftpanelBottom.png);
	background-repeat: no-repeat;
	position:relative;
	float:left;
}

#rightpanel {
	position:relative;
	width:519px;
	float:right;
}
#rightpanelTop {
	width:519px;
	height:8px;
	background-image:url(../graphicsTemplate/rightpanelTop.png);
	background-repeat: no-repeat;
	position:relative;
	float:left;
}
#rightpanelMid {
	width:519px;
	height:10px;
	background-image:url(../graphicsTemplate/rightpanelMid.png);
	background-repeat: repeat-y;
	position:relative;
	float:left;
}	
#rightpanelBottom {
	width:519px;
	height:8px;
	background-image:url(../graphicsTemplate/rightpanelBottom.png);
	background-repeat: no-repeat;
	position:relative;
	float:left;
}

#footer {
	position:relative;
	background-image:url(../graphicsTemplate/footerMid.png);
	background-repeat: repeat-x;
	position:relative;
	height:26px;
	width:759px;
	float:left;
	margin-top:40px;
}
#copyright {
	position:absolute;
	top:1px;
	right:10px;
	color:#E1E1E1;
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size:11px;
}
#date {
	position:absolute;
	top:1px;
	left:36px;
	color:#E1E1E1;
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size:11px;
}


/* Content for HOME page */
#ladyjustice {
	position:absolute;
	top:-5px;
	left:3px;
}
#ladyjusticebase {
	position:absolute;
	top:390px;
	left:3px;
}
#largeasterix {
	position:absolute;
	top:555px;
	left:7px;
}
#cfls {
	position:absolute;
	top:545px;
	left:20px;
}
#homecontent {
	position:absolute;
	top:0px;
	left:0px;
	width:300px;
	padding:0px 15px 0px 15px;
}
#staff {
	position:absolute;
	top:14px;
	right:0px;
	width:160px;
	padding:0px 10px 0px 20px;
	background-image:url(../home/nameBorder.gif);
	background-repeat:no-repeat;
	float:left;
}
.name {
	font-size:20px;
	color:#ec5f00;
	padding:0px;
	margin:0px;
}
.title {
	font-size:12px;
	font-family:Arial, Verdana, Helvetica, sans-serif;
	line-height:14px;
	color:#ec5f00;
	padding:0px 0px 0px 2px;
	margin:0px;
}
.more {
	font-size:12px;
	padding:0px;
	margin:0px 0px 40px 0px;
	text-align:right;
}


/* Content for ABOUT US page */
#aboutusImage {
	position:absolute;
	top:-5px;
	left:3px;
}
#aboutusImagebase {
	position:absolute;
	top:400px;
	left:3px;
}
#aboutusContent {
	position:absolute;
	top:0px;
	left:0px;
	padding:0px 15px 0px 15px;
}
#aboutusContent img {
	float:left;
	margin: 3px 7px 0px 0px;
}
#largeasterixAboutus {
	position:absolute;
	top:800px;
	left:7px;
}
#cflsAboutus {
	position:absolute;
	top:810px;
	left:20px;
}


/* Content for RESOURCES page */
#resourcesImage {
	position:absolute;
	top:-5px;
	left:3px;
}
#resourcesImagebase {
	position:absolute;
	top:400px;
	left:3px;
}
#resourcesContent {
	position:absolute;
	top:0px;
	left:0px;
	padding:0px 15px 0px 15px;
}
div#resourcesContent ul {
	list-style:none;
	padding:0;
	margin:20px 0px 50px 0px;
	font-size:14px;
}
div#resourcesContent li {
	padding:0;
	margin-bottom:15px;
}
.explain {
	font-size:12px;
	color:#C1C1C1;
	padding-left:15px;
	line-height:14px;
	font-family:Arial, Verdana, Helvetica, sans-serif;
}
#largeasterixresources {
	position:absolute;
	top:460px;
	left:7px;
}
#cflsresources {
	position:absolute;
	top:470px;
	left:20px;
}


/* Content for CONTACT page */
#contactImage {
	position:absolute;
	top:-5px;
	left:3px;
}
#contactImagebase {
	position:absolute;
	top:400px;
	left:3px;
}
#largeasterixContact {
	position:absolute;
	bottom:70px;
	left:7px;
}
#cflsContact {
	position:absolute;
	bottom:10px;
	left:20px;
}

#contactContent {
	position:relative;
	padding:0px 15px 0px 15px;
}
#address {
	position:relative;
	font-size:13px;
	float:left;
	top:3px;
	width:200px;
}
div#address ul {
	list-style:none;
	padding:0;
	margin:0px;
}
div#address li {
	padding:0px;
	margin:0px;
}
div#map {
	position:relative;
	float:right;
	margin-top:7px;
	text-align:right;
	font-size:10px;
	line-height:12px;
}
div#copyright a:link {
	color:#E1E1E1;
	text-decoration: none;
	border: none;
}
div#copyright a:visited {
	color:#E1E1E1;
	text-decoration: none;
	border: none;
}
div#copyright a:hover {
	color:#E1E1E1;
	text-decoration: none;
	border: none;
}



.email {
	clear:both;
	padding:50px 0px 30px 0px;
}
.inputbox {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:13px;
	border: 1px solid #CCCCCC;
	background-color:#F3F3F3;
	padding-left:3px;
	color: #3366CC;
	padding:4px;
}
#emailgood {
	padding:40px 0px 40px 0px;
	font-size: 16px;
	font-weight:bold;
	color: #339900;
	font-family: Arial, Verdana, Helvetica, sans-serif;
}
#emailbad {
	padding:40px 0px 40px 0px;
	font-size: 16px;
	font-weight:bold;
	color: #CC0000;
	font-family: Arial, Verdana, Helvetica, sans-serif;
}

