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

/* inner webpages layout. for Index (home) page, use layout.css*/

html,body{
    margin:0;
    padding:0;	
}

/* this is where to change the default text settings for the website. */

p { margin-top: 0; }



body, p{
	font-family:  Century Gothic, Verdana, Arial, sans-serif;
	font-size: 14px;
	color: #000000;
	font-style: normal;
	font-weight:lighter;
	line-height:  1.5;
	text-align:justify;	
}

.img {
display:inline;
margin: 10px;
}

.hr {
display:inline;
height:34px;
width:780px;
}  

.bookref{
text-decoration:underline;
font-weight:bold; 
}

.style6 {font-size: 16px}; /*for Main Nav Menu, unbolded*/
.style18 {color: #99CCFF; font-size: 14px; } /*for blue on form menu, first line*/
.style16 {color: #99CCFF; font-size: 24px} /*for blue on form menu, second line*/
.style20 {color: #999999}
.style23 {font-size: 18px}
.style26 {
font-size: 9px; 
display:inline;
color:#000000
}
.style24 {color: #99CCFF}


h1{      
     font-weight: bold;
     color:#99CCFF; /* (light blue) */
	 font-size:18px;
	 font-family: Century Gothic, Verdana, Arial, sans-serif;
}

h2{      
	 font-weight:bold;
     color:#99CCFF; /* (light blue) */
	 font-size:16px;
	 font-family: Century Gothic, Verdana, Arial, sans-serif;
}

h3{     
     font-weight:bold;
     color:#99CCFF; /* (light blue) */
	 font-size:14px;
	 font-family: Century Gothic, Verdana, Arial, sans-serif; 
}


/* this is the color of the links on the main navigation bar*/


a:link {display: block; color: #0000FF; padding: 5px;}

a:visited {display:block; color:#006699; padding: 5px;}

a:hover {display: block; color: #CC33CC; padding: 5px;}

a:active {display: block; color:#CC33CC; padding: 5px;}


/* Beginning of the page layout.  "Container" is the outer box that holds the design together */

div#container {
    width:1024px;
    margin-left: auto;
    margin-right: auto;
    }

div#container div {
   z-index: 1;
   margin: 0; 
}

/*  "Header" is the top box that holds the navigation bar */
div#header {
    background:	url(images/headerBG.png); 
    height: 158px;
    width: 100%;
    position: relative;
	z-index: 2;
}

div#header h1 {
    top: 90px;
    left: 50px;
    position: relative;
}

.img {
display:inline;
margin: 10px;
}

.title {
	color:#99CCFF;
	position: absolute;
	z-index:3;
	display:inline;
	float:right;
	font-weight: normal;
	font-size:20px;
	font-family:Century Gothic, Verdana, Arial, sans-serif;
	left: 723px;
	top: 26px;
	width: 265px;
	height: 43px;
}
 
/*  "Navcontainer" defines the properties of the navigation bar */
 
#navcontainer ul li { display: inline; }

#navcontainer ul {
   padding-left: 0;
   margin-left: 0;
   margin-top: 15px; /* this centers the font in the nav-bar*/
   background-color: transparent;  /*bar-right color*/ 
   color: white;
   float: left;
   width: 97%;
   font-family: Century Gothic, Verdana, Arial, sans-serif;
}

#navcontainer ul li a {  /*  this controls the menu items in the  upper navbar */
   padding: 0.2em 1em;
   background-color:transparent; /*box color on bar*/
   color: white;     /*font color*/
   text-decoration:  none;
   float: left;  /*this keeps the menu items horizontal*/ 
   /*border-left: 1px solid #000000;black line between boxes, currently unused. */
   }   
   
#navcontainer ul li a:hover {
   background-color: #99CCFF;  /*color of boxes when moused over*/
}
         
/* "Textfield" is the main body of the website which holds the text, links, images.Edit the text itself in .html, but edit the definition of the styles here in.css file */
		  
div#textfield {
	background: url(images/textBG2.jpg);
	background-repeat:repeat-y; 	
	height: inherit;
	width: 100%;
	position: relative;	
}

div#textfield div {
    margin-left: 80px; /* this keeps left textfield inside of the text background*/
	padding-top: 5px;	
	z-index: 2;
}

div#textfield ul {
color:#000000;
}


.box {
padding:0;
margin:0;
display:list-item;
text-align:left;
text-indent:inherit;
list-style-image:url(images/listbox.jpg);
list-style-position:outside;
}

.form {
padding:0;
margin: 0;
text-align:left;
}


/*  the links below are for links external to the website.  They need to display inline to avoid extra spacing in text areas.*/ 

a.external:link {display: inline; color: #99CCFF; font-weight:bold; text-decoration:none}

a.external:visited {display: inline; color:#99CCFF; font-weight:bold; text-decoration:none}

a.external:hover {display: inline; color: #66CCFF; font-weight:bold; text-decoration:none}

a.external:active {display: inline; color:#9999CC; font-weight:bold;text-decoration:none}

/*  "footer" is the bottom of the  website.  It can be used for a bottom menu, or contact info, etc. */
		  
div#footer {
    background: url(images/footerBG2.jpg);
	height: 48px;
    width: 100%;
    position: relative;
	z-index: 2;
}