@charset "utf-8";
body {
	font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
	background: #42413C;
	margin: 0;
	padding: 0;
	color: #000;
	margin-top: 20px;
	background-color: #FFC;
}

/* ~~ Element/tag selectors ~~ */
ul, ol, dl { /* Due to variations between browsers, it's best practices to zero padding and margin on lists.  */
	padding: 0;
	color: #000;
	font-family: "Times New Roman", Times, serif;
	line-height: 24px;
	list-style-position: inside;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 10pt;
	list-style-type: square;
}
h1, h2, h3, h4, h5, h6,{
	margin-top: 0;	 /* removing the top margin gets around an issue where margins can escape from their containing div.  */
	padding-right: 15px;
	padding-left: 15px; /* adding the padding to the sides of the elements within the divs, instead of the divs themselves, gets rid of any box model math.  */
}
.author {
	font-style: italic;
	text-align: center;
}

p {
	margin-top: 0;	 /* removing the top margin gets around an issue where margins can escape from their containing div.  */
	padding-right: 15px;
	padding-left: 15px; /* adding the padding to the sides of the elements within the divs, instead of the divs themselves, gets rid of any box model math.  */
	font-family: "Times New Roman", Times, serif;
	line-height: 24px;
}
a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
	border: none;
	left: 0px;
}

/* ~~ Styling must remain in this order - including the group of selectors that create the hover effect. ~~ */
a:link {
	color: #72A1FF;
	font-weight: bold;
}
a:visited {
	color: #72A1FF;
	text-decoration: underline;
	font-weight: bold;
}
a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
	text-decoration: none;
	font-family: "Times New Roman", Times, serif;
	font-style: italic;
}
#container {
	background-color: #FFF;
	width: 950px;
	border: thick solid #30c;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
#header {
	background-color: #72a1ff;
	text-align: left;
	float: left;
	width: 100%;
	border-bottom-style: solid;
	border-bottom-width: thick;
	border-bottom-color: #30c;
}
#pict {
	background-image: url(../images/OTMElogo2b.png);
	float: left;
	margin-top: 10px;
	margin-right: 10px;
	margin-left: 10px;
	width: 350px;
	height: 100px;
}
#sidebar {
	float: left;
	height: 550px;
	width: 170px;
	padding-bottom: 10px;
	background-image: url(../images/sidebarbkgrd.png);
	padding-top: 10px;
	/* [disabled]padding-left: 0px; */
}
#content {
	float: left;
	width: 450px;
	padding-left: 10px;
	margin-top: 10px;
}
#Widecontent {
	float: left;
	width: 750px;
	padding-left: 10px;
	margin-top: 10px;
}
.bluetext {
	color: #30C;
	height: auto;
}

.Red_Italicize {
	font-style: italic;
	color: #F00;
	line-height: 24px;
}

#sidepan {
	background-color: #C9DBFF;
	padding: 10px;
	float: right;
	width: 260px;
	margin-right: 10px;
	margin-top: 10px;
}
ul.nav {
	list-style: none; /* this creates the top border for the links - all others are placed using a bottom border on the LI */
	margin-bottom: 15px;
	border-top-style: none;
	margin-left: 10px;
	margin-top: 20px;
	}
ul.nav li {
	border-bottom: 2px solid #c2a652; /* this creates the button separation */
	width: 150px;
	border: 1px solid #c2a652;
	border-color: #FFF;
	background-color: #C0D5FF;
}
ul.nav a, ul.nav a:visited { /* grouping these selectors makes sure that links retain their button look even after being visited */
	display: block; /* this gives the link block properties causing it to fill the whole LI containing it. This causes the entire area to react to a mouse click. */
	width: 130px;  /*this width makes the entire button clickable for IE6.*/
	text-decoration: none;
	background-color: #C0D5FF;
	padding-top: 0px;
	padding-right: 5px;
	padding-bottom: 0px;
	padding-left: 15px;
}
ul.nav a:hover, ul.nav a:active, ul.nav a:focus { /* this changes the background and text color for both mouse and keyboard navigators */
	color: #FFF;
	font-family: Verdana, Geneva, sans-serif;
	background-color: #72A1FF;
}

#footer {
	background-color: #06f;
	text-align: center;
	clear: both;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 10px;
	padding-left: 0px;
	position: relative;
	margin-bottom: 0px;
}
/* ~~ miscellaneous float/clear classes ~~ */
.fltrt {  /* this class can be used to float an element right . */
	float: right;
	margin-left: 8px;
}
.hdrtext {
	float: right;
	width: 525px;
	margin-top: 10px;
	color: #FF0;
	padding-right: 15px;
}
#container #footer #footer2 p {
	font-size: 14px;
	color: #CCC;
	line-height: 12px;
	text-align: center;
}

h1 {
	font-size: 42px;
	color: #009;
	margin: 0px;
	padding: 0px;
	margin-left: 11px;
}
.smallItalics {
	font-size: 14px;
	font-style: italic;
	line-height: 12pt;
}
h2 {
	font-size: 24px;
	color: #30c;
	line-height: 26pt;
	text-align: center;
	height: 18px;
	font-weight: bolder;
}
h3 {
	font-size: 24px;
	color: #30c;
	line-height: 20pt;
	text-align: left;
	height: 18px;
	font-weight: bolder;
	margin-left: 14px;
}
h4 {
	font-size: 20px;
	line-height: 20px;
	font-style: italic;
	color: #06F;
	height: 16px;
	text-align: left;
}
.PictCaption {
	font-family: "Times New Roman", Times, serif;
	font-size: 12px;
	color: #948333;
	line-height: normal;
	text-align: center;
	font-weight: bold;
}
.PictHyper {
	font-family: "Times New Roman", Times, serif;
	font-size: 12px;
	color: #948333;
	font-style: italic;
}
.link2 {
	font-style: italic;
	text-align: right;
}
.Table_link {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
}
.footer {
	font-size: 9pt;
	line-height: normal;
	color: #C9DBFF;
	padding-top: 10px;
	height: 8px;
}