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

/* need to CHANGE to ems using http://clagnut.com/css/present_global.css and http://clagnut.com/blog/348/css/present_global.cs 
http://css-tricks.com/the-perfect-fluid-width-layout/
NOTE: id selector is defined in CSS using the "#" sign
NOTE: class selector is defined in CSS using the "." sign
*/
HTML {
	/*lifts sidebars off bottom of page*/
	margin-bottom:1em;
}
body {
	background: #89C3DB;
	color: black;
	/* width: 1009px; - - - -  should be 785px */
	width:expression(document.body.clientWidth < 782? "780px" : document.body.clientWidth > 1262? "1260px" : "auto");
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
}
#container1 { /* ID="container1" */
	width: 1009px; /* should be 785px */
	margin-right: auto;
	margin-left: 0px;
	background-color: #A30013;
	min-height: 38px;
	max-height: 38px;
	height: 38px;
	text-align: left;
}
#container_body { /* ID="container_body" */
	text-align: left;
	margin: 0px auto;
	min-width: 780px;
	max-width: 1260px;
	/* width: 1009px; ---- should be 785px */
	width:expression(document.body.clientWidth < 782? "780px" : document.body.clientWidth > 1262? "1260px" : "auto");
	background-color: #FEFEFE;
}
#container_body #story { /* ID="container_body" followed by  ID="story" */
	margin: 10px 10px 0px 10px;
	padding-top: 10px;
	padding-bottom: 10px;
}
#container_body #story2 { /* ID="container_body" followed by  ID="story2" */
	margin: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
}
.story { /* class="story" */
	width: 994px; /* (1024-30) should be  785px */
	margin-right: 10px;
	margin-left: 10px;
	margin-top: 10px;
	margin-bottom: 0px;
	padding-top: 10px;
	padding-bottom: 10px;
	background-color: #FEFEFE;
	text-align: left;
}
#story {
	width: 994px; /* (1024-30) should be  785px */
	margin-right: 10px;
	margin-left: 10px;
	margin-top: 10px;
	margin-bottom: 0px;
	padding-top: 10px;
	padding-bottom: 10px;
	background-color: #FEFEFE;
	text-align: left;
	min-height: 600;
}
#page-wrap {
	background: white;
	min-width: 780px;
	max-width: 1260px;
	margin: 10px auto;
 width:expression(document.body.clientWidth < 782? "780px" : document.body.clientWidth > 1262? "1260px" : "auto");
}
#page-wrap #inside {
	margin: 10px 10px 0px 10px;
	padding-top: 10px;
	padding-bottom: 10px;
}
/* This goes at very top of page, above buttons */
#titlebar {
	/* width: 1009px; --- should be 785px */
	width:expression(document.body.clientWidth < 782? "780px" : document.body.clientWidth > 1262? "1260px" : "auto");
	border-color: rgb(0,0,0);
	color: #000000;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 28px;
	font-weight: bold;
	text-transform: uppercase;
	font-variant: small-caps;
	background-color: #89C3DB;
	border-bottom-color: #000000;
	border-bottom-style: solid;
	border-bottom-width: 3px;
	border-top-style: solid;
	border-top-width: 0px;
	border-right-style: none;
	border-left-style: none;
	padding: 0px;
	margin: 0px;
	vertical-align: middle;
}
/* note: see "h t t p : / / w w w.digital family.com/dream  weaver/wolves/index.html" and 
 "h t t p : / / w w w. layers magazine.com/dreamweaver-navigation- bar- css.html  
 without spaces */
 
#navbar {
	/* width: 1009px; -- should be 785px */
	width:expression(document.body.clientWidth < 782? "780px" : document.body.clientWidth > 1262? "1260px" : "auto");
	background-color: black; /* #A30013; */
	background-image: url(/img/btn_blank_mid.jpg);
	background-repeat: repeat;
	background-position: 0px 0px;
	color: #A30013;
	float: none;
	margin-top: 0px;
	margin-right: auto; /* or 0 ? */
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	top: 0px;
	left: 0px;
	right: auto;
	bottom: auto;
	overflow: auto; /* hidden; */
	word-spacing: normal;
	letter-spacing: 0px;
	padding: 0px;
	margin: 0px;
	min-height: 39px; /* 36px */
	max-height: 39px;
	height: 39px;
}
#navbar ul {
	height: 36px;
	min-height: 36px;
	max-height: 36px;
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	border: none;
	left: 0px;
	top: 0px;
	position: relative;
}
#nav li {
	display: inline;
}
#nav ul li a {
	/* float: left; */
	padding-right: 0px;
	padding-left: 0px;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	color: #D1A547;
	font-weight: bold;
	border: thin none #000000;
	border: none;
	left: 0px;
	top: 0px;
	position: relative;
}
#navbar ul li a:hover {
	color: #CCCCCC;
}
#nav ul li a:hover {
	color: #CCCCCC;
}
#nav {
	background-color: #A30013;
	height: 20px;
	padding-top: 10px;
	padding-left: 10px;
}
.compass_image-right {
	float: right;
	width: 433px;
	margin-bottom: 10px;
	margin-left: 10px;
}
.clear {
	clear: both;
}
.larger {
	font-size: 32px
}
.title {
	font-family: "Times New Roman", Times, serif;
	font-size: medium;
	color: #FFCC00;
	background-color: #0066CC;
	font-weight: bold;
}
#footer {
	clear: both;
	padding: 20px 30px 20px 80px;
	background: #F7F7F7;
	border-top: 1px solid #CCC;
	font: .8em/1.4em "Lucida Grande", Verdana, Helvetica, sans-serif;
}
/*  Error Style (Font=RED) Added by Dan on July 25, 2008 */
.Err_Style {
	color: #FF0000;
	background-color:beige;
	border:2px dotted black;
	padding:10px;
	font-weight: bold;
}
/*  boxed note(Font=BLACK) Added by Dan on Sept 1, 2008 -- a style for a note in the middle of the page*/
.boxed_note {
	color: black;
	background-color:#FFFFCC;
	border:2px dotted black;
	margin-top: 10px;
	margin-right: 20px;
	margin-bottom: 10px;
	margin-left: 20px;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 40px;
	text-indent: -35px;
}
/*  boxed term(Font=BLACK, background = light Cyan) Added by Dan on Sept 1, 2008 -- a style for a "term"/defination in the middle of the page */
.boxed_term {
	color: black;
	background-color:#CCFFFF;
	border:2px dotted black;
	margin-top: 10px;
	margin-right: 20px;
	margin-bottom: 10px;
	margin-left: 20px;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 40px;
	text-indent: -35px;
	list-style-type: square;
}
p.MsoNormal, li.MsoNormal, div.MsoNormal {
	margin-top: 0px;
	margin-bottom: 1px;
	margin-left: 10px;
	margin-right: 10px;
	font-size:12.0pt;
	font-family:"Times New Roman";
}
.Bold_Italics {
	font-weight: bold;
	font-style:italic;
}
.Bold_Italics_Larger {
	font-weight: bold;
	font-style:italic;
	font-size: larger;
}
diamond_bullet {
	font-family: "Times New Roman", serif;
	font-size: 12pt;
	margin-bottom: 0px;
	list-style-type: square;
}
.text_small_on_bottom {
	font-family: "Times New Roman", serif;
	font-size: 10pt;
	margin-bottom: 0px;
}
.text_small_on_bottom_indent2_hanging {
	font-family: "Times New Roman", serif;
	font-size: 10pt;
	margin-left: 0.5in;
	text-indent: -0.25in;
	margin-bottom: 0px;
}
.text_large {
	font-family: "Times New Roman", serif;
	font-size: 12pt;
}
.text_large_on_bottom {
	font-family: "Times New Roman", serif;
	font-size: 12pt;
	margin-bottom: 0px;
}
.text_large_on_bottom_indent1 {
	font-family: "Times New Roman", serif;
	font-size: 12pt;
	margin-left: 0.25in;
	margin-bottom: 0px;
}
.text_large_on_bottom_indent1_hanging {
	font-family: "Times New Roman", serif;
	font-size: 12pt;
	margin-left: 0.25in;
	text-indent: -0.25in;
	margin-bottom: 0px;
}
.text_large_on_bottom_indent2 {
	font-family: "Times New Roman", serif;
	font-size: 12pt;
	margin-left: 0.5in;
	margin-bottom: 0px;
	border:none;
}
.text_large_on_bottom_indent2_hanging {
	font-family: "Times New Roman", serif;
	font-size: 12pt;
	margin-left: 0.5in;
	text-indent: -0.25in;
	margin-bottom: 0px;
}
.text_large_on_bottom_indent3 {
	font-family: "Times New Roman", serif;
	font-size: 12pt;
	margin-left: 0.75in;
	margin-bottom: 0px;
}
.text_xlarge {
	font-size: 14pt;
}
ul.NoBullet {
	list-style-type:none;
}
ul.UpperAlpha {
	list-style-type:upper-alpha;
}
ul.LowerAlpha {
	list-style-type:lower-alpha;
}
ul.Decimal {
	list-style-type:decimal;
}
/*  - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
	/* 3 columns, like training.html page */
	div.spacer {
	clear:both;
 height;
5px;
 display;
block;
}
#titleframe {
	text-align:left;
	background-color: #FFFFFF;
	position: relative;
	visibility: visible;
	margin-right: auto;
	margin-left: auto;
	float: none;
	padding-top: 15px;
	padding-bottom: 15px;
	overflow: hidden;
}
#colframe {
	text-align:left;
	width: 994px; /* (1024-30) should be  785px */
	background-color: #FFFFFF;
	position: relative;
	visibility: visible;
	margin-right: auto;
	margin-left: auto;
	float: none;
	padding-top: 0px;
	padding-bottom: 0px;
	overflow: hidden;
	display:block;
}
#leftframe {
	text-align:left;
	background-color: #FFFFFF;
	position: relative;
	visibility: visible;
	width: 	435px;
	margin-top: 0px;
	margin-right: 0px;
	margin-left: 10px;
	float: left;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-color: #000000;
	border-right-color: #000000;
	border-bottom-color: #000000;
	border-left-color: #000000;
	padding-top: 0;
	padding-right: 0px;
	padding-bottom: 0;
	padding-left: 0;
}
#middleframe {
	text-align:left;
	background-color: #FFFFFF;
	position: relative;
	visibility: visible;
	width: 72px;
	padding:0;
	margin-top: opx;
	margin-right: 0px;
	margin-left: 0px;
	float: left;
	background-image: url(/img/arrow-bkg.gif);
}
#rightframe {
	text-align:left;
	width: 	556px;
	background-color: #FFFFFF;
	position: relative;
	visibility: visible;
	width: 435px;
	padding:0;
	margin-top: 0px;
	margin-right: 5px;
	margin-left: 0px;
	float: left;
	height: 100px;
}
/*  - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ 
		/* vertical column of images, like training.html page */
		/*  - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ 
		
 div.vert_col_images {
}
#vert_col_images ul {
	list-style: none;
	list-style-type: none;
	background-color: #FFFFFF;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	display: block;
}
#vert_col_images li {
	display: inline;/* for ie 5 and ie 6 */
}
#vert_col_images ul li {
	display: inline;/* for ie 5 and ie 6 */
}
div.spacer72 {
	height: 72px;
	margin: 0px;
	padding: 0px;
}
div.box72 {
	height: 72px;
}
div.spacer150 {
	height: 150px;
	margin: 0px;
	padding: 0px;
}
div.spacer100 {
	height: 100px;
	margin: 0px;
	padding: 0px;
}
div.spacer72 {
	height: 75px;
	margin: 0px;
	padding: 0px;
}
div.spacer75 {
	height: 75px;
	margin: 0px;
	padding: 0px;
}
div.spacer60 {
	height: 60px;
	margin: 0px;
	padding: 0px;
}
div.spacer50 {
	height: 50px;
	margin: 0px;
	padding: 0px;
}
div.box100 {
	height: 100px;
	border: 3px solid #000000;
	margin: 0px;
	padding: 0px;
}
div.box100 {
	height: 120px;
	border: 3px solid #000000;
	margin: 0px;
	padding: 0px;
}
div.box125 {
	height: 125px;
	border: 3px solid #000000;
	margin: 0px;
	padding: 0px;
}
div.box130 {
	height: 130px;
	border: 3px solid #000000;
	margin: 0px;
	padding: 0px;
}
div.box150 {
	height: 150px;
	border: 3px solid #000000;
	margin: 0px;
	padding: 0px;
}
p.colorbluetext {
	color: #0066CC;
}
/*  - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.title_resources {
	font-family: "Times New Roman", Times, serif;
	font-size: medium;
	color: #FFCC00;
	background-color: #0066CC;
	font-weight: bold;
	width: 10em;
	height: auto;
	border-top-width: 5px;
	border-right-width: 5px;
	border-left-width: 2px;
	border-bottom-width: 5px;
	text-align: center;
	white-space: nowrap;
}
.title_3em {
	width: 3em;
	font-family: "Times New Roman", Times, serif;
	font-size: medium;
	color: #FFCC00;
	background-color: #0066CC;
	font-weight: bold;
	height: auto;
	border-top-width: 5px;
	border-right-width: 5px;
	border-left-width: 2px;
	border-bottom-width: 5px;
	text-align: center;
	white-space: nowrap;
}
.title_10em {
	width: 10em;
	font-family: "Times New Roman", Times, serif;
	font-size: medium;
	color: #FFCC00;
	background-color: #0066CC;
	font-weight: bold;
	height: auto;
	border-top-width: 5px;
	border-right-width: 5px;
	border-left-width: 2px;
	border-bottom-width: 5px;
	text-align: center;
	white-space: nowrap;
}
.title_15em {
	width: 15em;
	font-family: "Times New Roman", Times, serif;
	font-size: medium;
	color: #FFCC00;
	background-color: #0066CC;
	font-weight: bold;
	height: auto;
	border-top-width: 5px;
	border-right-width: 5px;
	border-left-width: 2px;
	border-bottom-width: 5px;
	text-align: center;
	white-space: nowrap;
}
.title_20em {
	width: 20em;
	font-family: "Times New Roman", Times, serif;
	font-size: medium;
	color: #FFCC00;
	background-color: #0066CC;
	font-weight: bold;
	height: auto;
	border-top-width: 5px;
	border-right-width: 5px;
	border-left-width: 2px;
	border-bottom-width: 5px;
	text-align: center;
	white-space: nowrap;
}
.title_22em {
	width: 22em;
	font-family: "Times New Roman", Times, serif;
	font-size: medium;
	color: #FFCC00;
	background-color: #0066CC;
	font-weight: bold;
	height: auto;
	border-top-width: 5px;
	border-right-width: 5px;
	border-left-width: 2px;
	border-bottom-width: 5px;
	text-align: center;
	white-space: nowrap;
}
.title_25em {
	width: 25em;
	font-family: "Times New Roman", Times, serif;
	font-size: medium;
	color: #FFCC00;
	background-color: #0066CC;
	font-weight: bold;
	height: auto;
	border-top-width: 5px;
	border-right-width: 5px;
	border-left-width: 2px;
	border-bottom-width: 5px;
	text-align: center;
	white-space: nowrap;
}
.title_30em {
	width: 30em;
	font-family: "Times New Roman", Times, serif;
	font-size: medium;
	color: #FFCC00;
	background-color: #0066CC;
	font-weight: bold;
	height: auto;
	border-top-width: 5px;
	border-right-width: 5px;
	border-left-width: 2px;
	border-bottom-width: 5px;
	text-align: center;
	white-space: nowrap;
}
.title_35em {
	width: 35em;
	font-family: "Times New Roman", Times, serif;
	font-size: medium;
	color: #FFCC00;
	background-color: #0066CC;
	font-weight: bold;
	height: auto;
	border-top-width: 5px;
	border-right-width: 5px;
	border-left-width: 2px;
	border-bottom-width: 5px;
	text-align: center;
	white-space: nowrap;
}
.title_40em {
	width: 40em;
	font-family: "Times New Roman", Times, serif;
	font-size: medium;
	color: #FFCC00;
	background-color: #0066CC;
	font-weight: bold;
	height: auto;
	border-top-width: 5px;
	border-right-width: 5px;
	border-left-width: 2px;
	border-bottom-width: 5px;
	text-align: center;
	white-space: nowrap;
}

/*  - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */