@charset "UTF-8";
/* CSS Document */

*{
	padding:0px;
	margin:0px;
} 

html, body  {
	height: 100%;
	width:100%;
	}  /* hack for IE5+/Win.*/

img {
	border:0;
}

.img_border {
	padding:7px;
	border:1px solid #573b7a;
	float:right;
	margin-left:5px;
}

	
html>body, html>body #main {height: auto;}
/* Without this, Moz1.0 adds a vertical scrollbar */

body {
	color:#333;
	font-size:14px;
	line-height:1.5em;
	font-family:Arial, Helvetica, sans-serif;
	background: url(images/bkgd.png) repeat-x #fff;
	text-align: center; 
	margin-top:50px;
}

p, td, li, blockquote {
	color:#333;
}

p {
	margin-top:8px;
	margin-bottom:0px;
}
/* Deb--I added some margin (to move the bullet points) and padding (to move the text) to the left of the list tags to indent them. You can tweak these numbers to get them exactly where you want */

li {
	padding-left:8px;
	margin-left:15px;
}

a, a:visited {
	color:#573b7a; 
	text-decoration:underline;
}

a:hover, a:visited:hover, a:active {
	color:#333; 
	text-decoration:underline;
}

h1 {
	font-size:20px;
	color:#573b7a;
	font-weight:normal;
	margin-top:-4px; /* negative margins and paddings are generally handled well by all browsers, but be careful about IE7 */
}

h2 {
	margin-top:10px;  /* I added 2 pixels to bump this down a bit. Was that what you wanted? */
	font-size:16px;
	color:#573b7a;
	font-weight:normal;
}

h3 {
	margin-top:8px;
	font-size:14px;
	color:#573b7a;
	font-weight:normal;
}

/* layout styles */

#outer {
	width:903px;
	margin:0 auto 40px auto;
}

#wrapper {
	background:url(images/bkgd_wrapper.png) repeat-y #fff;

	text-align:left;
	width:813px;
	padding: 30px 48px 35px 42px;
}

#header {
	float:left;
	width:810px;
	height:124px;
}

.nav {
	clear:both;
	margin-left:11px;
	background:url(images/bkgd_nav.png) no-repeat;
	width:799px;
	padding-top:12px;
	padding-left:35px;
	height: 36px;
	font-size:18px;
	color:#fff;
	margin-bottom:5px;
}


.nav a, .nav a:visited { 
	text-decoration: none;
    color: #fff;
	}
 
.nav a:hover, .nav a.current{
    color: #fff;
    text-decoration:underline;}
	
#content_left {
float:left;
width:572px;
padding-right:22px;
}

#content_left_inner_top {
	background:url(images/bkgd_content_left_inner_top.png);
	width:572px;
	height:15px;
}

#content_left_inner {
	background: url(images/bkgd_content_left_inner_middle.png) repeat-y;
	width:500px;
	padding:33px 52px 17px 36px;
}

#content_left_inner_bottom {
	background:url(images/bkgd_content_left_inner_bottom.png);
	width:572px;
	height:20px;
}

#content_right {
float:left;
padding-left:14px;
width:201px;
margin-top:9px;
}

.sidebar_top {
	background:url(images/bkgd_sidebar_top.png) no-repeat;
	height:10px;
	width:202px;
}

.sidebar {
	background:#977ea7;
	border-left:1px solid #573b74;
	border-right:1px solid #573b74;
	width:151px;
	padding: 20px 22px 19px 27px;
	text-align:center;
}

.sidebar_bottom {
	background:url(images/bkgd_sidebar_bottom.png) no-repeat;
	height:10px;
	width:202px;
	padding-bottom:25px;
}

.sidebar h2 {
	font-size:18px;
	font-weight:normal;
	color:#fff;
	margin-top:0px;
}

.sidebar p {
	color:#fff;
}

.callout_wrapper {
	margin-top:36px;
	margin-left:94px;
}

.callout_top {
	background:url(images/bkgd_callout_top.png) no-repeat;
	height:8px;
	width:315px;
}

.callout {
	background:#d8d8d8;
	width:281px;
	padding: 0px 11px 0px 23px;
}

.callout_bottom {
	background:url(images/bkgd_callout_bottom.png) no-repeat;
	height:7px;
	width:315px;
	padding-bottom:25px;
}

.callout h2 {
	font-size:18px;
	font-weight:normal;
	color:#573b74;
	margin-top:0px;
}

.callout p {
	color:#573b74;
}

#footer {
	clear:both;
	background:url(images/bkgd_footer.png) no-repeat;
	width:903px;
	height:19px;
	font-size:12px;
	color:#333;
	padding-top:20px;
	padding-bottom:20px;
	text-align:center;
}