/* Modification History:
 * 
 * 09/18/11 - KDT - Copied from KDT-Plain-Style.css
 *
 * Notes:
 *
 */
 
* {margin:0; padding:0;}

body { /* this is the entire browser window */
  background: #fff8e8; /* background color from Gettysburg */
  color:#3a3a3a;
/*  color: black; */
  font:76% Verdana,Tahoma,Arial,sans-serif; 
  line-height:1.4em; 
  margin:0 auto; 
  padding:0;
}

#Wrapper { /* this is essentially my "viewport" into my page(s) */
  background: #fff; 
/*  color: #303030;  */
  color: black;  
  margin: 0 auto;  
  margin-top: 10px;
  margin-bottom: 10px;
  max-width: 820px;  /* using max-width (versus width) allows the width to shrink as the browser windo shrinks */
  min-width: 640px;
  border-right: 2px solid #467aa7; /* Header background */
  border-left: 2px solid #467aa7;
  border-bottom: 2px solid #467aa7;
}

#headerbg a {
  text-decoration: none;
}

#header {
  float: left; 
  width: 100%; 
  height: 60px; 
  margin: 0 auto; 
  padding: 0 0 0 0; 
  background: #467aa7; 
  color: #ffffff;
}

#header h1 {
  padding: 12px 0 0 10px; 
  font-size: 2.4em; 
  background-color: inherit; 
  color: #ffffff; 
  letter-spacing: -2px;
}

#header h2 {
  margin: 8px 0 0 10px; 
  padding-bottom: 3px; 
  font-size: 1.4em; 
  background-color: inherit; 
  color: #f0f2f4; 
  letter-spacing: -1px; 
  font-weight:normal;
}

#navigation {
  float: left; 
  height: 2.2em; 
  line-height: 2.2em; 
  width: 100%; 
  margin: 0 0px 0px 0px; 
  font-size: 0.8em; 
  background: #80b0da; 
  text-decoration: none; 
  color: #ffffff;
} 

#navigation li {
  float: left; 
  list-style-type: none; 
  white-space: nowrap; 
  color: #ffffff;
}

#navigation li  a {
  border-right: 1px solid #bad3eb; 
  display: block; 
  padding: 0 10px; 
  text-decoration: none; 
  background-color: inherit; 
  color: #ffffff;
}
  
#navigation li.selected {
  margin-left: -1px; 
  border-left: 1px solid #e0e0e0; 
  border-right: 1px solid #e0e0e0; 
  background-color: #bad3eb; 
  padding:0 10px; 
  font-weight: bold; 
  color:#467aa7; 
  text-decoration: none;
}
  
#navigation a: hover {
  background: #467aa7; /* same as Header background */
  text-decoration: none;
}

/* selection bar - below Navigation and same color as Navigation Selection */
#nav-select {
  clear: left; 
  height: 5px; 
  width: 100%; 
/*  margin: 0px 0px 1px 0px;  */ /* leave a 1px white space before Menu */
  margin: 0;
  padding: 0 0 0 0; 
  background: #bad3eb; 
  color:# ffffff;
} 

/* the following in presently not used - I had used it as a test to wrap everything but the header */  
div#Page {
  color: black;
  margin: 0;
  padding: 0;
  width: 100%;   /* this causes the right-border to lay outside the boarder of 'wrap', but leaving it out breaks IE*/
  background-color: #d0ffff; /* faint blue - sort of a sky-blue */
  border: 4px solid red;
  padding: 5px;
  margin: 5px;
}
  
div#PageBody {
   font-family: Arial, Verdana, Helvetica, sans-serif;
   background-color: white;
   margin: 0;
   margin-left: 150px;
   margin-right: 15%;
   padding: 10px 30px 20px 20px; 
   padding-bottom: 2em;     
   border-right: 2px solid #69c;
   border-left: 2px solid #69c;
   line-height: 150%;
}       
   
div#MenuPage { /* this is everything less the header and the footer */
   clear: left;
   margin: 0;
   padding: 0;
  /* this is necessary to "paint" the menu to the bottom */
  background-color: #f8fcff;  /* a lighter version of the Selected Navigation background */
}	

div#MenuPageMenu { /* this is the "menu" inside the "PageMenu" */
  float: left;
  font-family: Arial, Verdana, Helvetica, sans-serif;
  font-weight:bold;
  background-color: white;
  width: 150px;
  margin: 0;
  margin-top: 30px;
  padding: 0 0 0 0;
  border-right: 2px solid #bad3eb; /* same as Selected Navigation background - in case MenuPageBody is shorter than MenuPageMenu */
}

div#MenuPageMenu a {
  display: block;
  margin: 0;
  margin-bottom: 1px;
  padding: 4px 10px 2px 20px;
  text-decoration: none;
  color: white;
  text-align: right;
  background-color: #80b0da; /* same color used for Navigation background */
}  

div#MenuPageMenu a#first {
  display: block;
}   

div#MenuPageMenu span {
  display: block;
  text-decoration: none;
  text-align: right;
  background-color: #bad3eb; /* same as Selected Navigation background */
  color: #467aa7; /* same as Selected Navigation color */
  margin: 0px;
  margin-bottom: 1px;
  padding: 4px 10px 2px 20px;
}

div#MenuPageMenu span#first {
  border-width: 2px 0px 2px 0px;
}   

div#MenuPageMenu a:hover {
  display: block;
  background-color: #467aa7; /* same as background for plain header */
  color: white;
} 
  
div#MenuPageMenu a#HomePageLink {
  display: none;
}   
  
#MenuPageBody { /* this is the "Body" inside a "MenuPage" */
  background-color: white; /* added */
  line-height: 1.5em;
  margin: 0;
  margin-left: 150px;
  margin-top: 0;
  padding: 0; 
  padding-top: 10px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 5px;
  text-align: left; 
  border-left: 2px solid #bad3eb; /* same as Selected Navigation background */
}

#MenuPageBody h2 {
  font-size: 1.8em; 
  font-weight: 400; 
  letter-spacing: -1px;  
  margin: 8px 0 10px;   /* this causes the background from 'Page' to show at the top of MenuPageBody */
  padding: 0;
}

#MenuPageBody h3 {
  font-size: 1.5em; 
  font-weight: 400; 
  margin: 6px 0; 
  padding: 0;
}

#MenuPageBody img {
  background:#ccc; 
  border:4px solid #f0f0f0; 
  color:#303030; 
  display:inline; 
  padding:1px; 
  margin:0 10px 5px 0;
}

#MenuPageBody ul,#MenuPageBody ol {
  margin:0 0 16px 20px; 
  padding:0;
}

#MenuPageBody ul ul,#MenuPageBody ol ol {
  margin:2px 0 2px 15px;
}

#MenuPageBody li {
  margin:0 0 2px 5px; 
  padding:0 0 0 4px;
}
   
/* Right sidebar */
#RightSidebar {   
  float: right;
  padding: 0;
  margin: 0;
  margin-left: 10px;
  padding-top: 5px;
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 5px;
  background-color: #f8fcff;  /* a lighter version of the Selected Navigation background */
  border-left: 2px solid #bad3eb; /* same as Selected Navigation background */
  border-bottom: 2px solid #bad3eb;
  width: 200px;
}

#RightSidebar ul {
  border: 1px solid black;
  padding-left: 2em;
}

div.Text-sans-serif {
  font-family: Arial, Verdana, Helvetica, sans-serif;
  background-color: white;
  margin: 0;
  padding: 10px 30px 20px 20px;
  padding-bottom: 2em;
  line-height: 150%;
}
    
div.Text-serif {
  font-family: 'Times New Roman', Georgia, serif;
  background-color: white;
  margin: 0;
  padding: 10px 30px 20px 20px;
  padding-bottom: 2em;  
  line-height: 125%;
}
    
div#Footer {
  margin: 0;
  padding: 0;
  clear: left;   
  width: 100%;
}    

div.footnote {
  font-family: 'Times New Roman', Georgia, serif;
  margin: 0;
  line-height: 125%;
}

div#copyright-noprint {
  display: block;
  font-family: 'Times New Roman', Georgia, serif;
  text-align: center;
  margin: 0;
  padding: 5px 0px 5px 0px;
  line-height: 125%;
  border: 1px solid #467aa7; /* header background */
  border-width: 2px 0px 2px 0px;
}

div#copyright {
  display: block;
  color: #666;
  text-align: center;
  margin: 0;
  padding: 5px 0px 5px 0px;
  line-height: 125%;
  border-top: 2px solid #467aa7;
  border-bottom: 2px solid #467aa7;
}

div#PrintContact {
  display: none;   
}

div#signature {
  display: block;
  margin: 0;
  margin-top: 10px;
  padding: 0px 10px 7px 10px;
  line-height: 125%;
}

/*
#by {
  font-family: 'Times New Roman', Georgia, serif;
  margin: 0;
}
*/   
div#moddate {
  font-family: 'Times New Roman', Georgia, serif;
  font-size: x-small;
  color: #999;
  margin: 0;
  padding: 10px 10px 10px 5px;
  line-height: 125%;
  width: 95%;
}

div span#moddate {
  font-family: 'Times New Roman', Georgia, serif;
  font-size: x-small;
  color: #999;
  margin: 0;
  padding: 0;
  line-height: 125%;
  width: 95%;
}

p {
  margin:0 0 16px; 
}

span.clip {
  display: block;
  padding: 0;
  width: 100%; /* necessary for IE */
  overflow: auto;
}
 
p img {
  border: 2px solid red;
  margin: 0;
  padding: 0;
}

a {
  background:inherit; 
  color: #467aa7; /* same as Header background */
  text-decoration:none; 
  font-weight:700;
}

a:hover {
  background:inherit; 
  text-decoration:underline;
}