/* 
Style sheet
*/

.center {
  text-align: center;
  }
  
/* Default most of the items with margin & padding set to 0 */
  
div#pagewrapper, div#header, 
img.header1left, img.header1right, img.header2, img.header2left, img.header2full, 
div#image, div#nav, div#navigation,
div#main, div#mainNoImage, div#menuandbody, div#footerid, div#headerid  {

  margin-top: 0px; margin-bottom: 0px; margin-right: 0px; margin-left: 0px;
  padding-top:0px; padding-bottom: 0px; padding-right: 0px; padding-left: 0px;
}
  
/* This is the "pagewrapper" */
div#pagewrapper {

/* Define page width between 600 - 1000 px, everything over will be scroll bars; everything less will be whitespace */
  max-width:1000px;
  min-width:600px;  

  /* Define margin-left & -right as auto to center the page */
  margin-left:auto;
  margin-right:auto;

  background-color : white;
  background-image : none;
  border: thin solid black;
}

div#alert {
  border:thick double red; /* work around to get rid of the large white space between divs */
  color:black;
/*  background: red; */
  text-align: center;
  font-size: medium;
  padding-top:20px; padding-bottom:20px;
  padding-left:100px; padding-right:100px;
 /* width:100%; */

 /* max-width: 500px;  min-width: 500px; */
  margin-left:auto;
  margin-right:auto;
  background:#ffdddd;
  
/*  font-weight: bold; /*  */
  letter-spacing: +0.21em;
}

/* The headers are used like this:

div#header (wrapper)

div#header1 (wrapper)
img.header1left    img.header1right
</div header1>

div#header2 (wrapper)
img.header2full
</div header2>
 
</div header>


*/
div#header {
  width:100%;  /* Fill entire width of container */
}  
 
div#header1, div#header1left, img.header1left, img.header1right, img.header2, img.header2full{
  height: 115px; /* Set height of container */
  width:100%;
  }

div#image img {
width: 100%;
 }
 
img.header1left {
/* margin-left: -100%; /* */

  background-image: url("header-1-left.jpg");
/*float:left; /* */
  width: 35.5%;

}

img.header1lefttest {
 background-image: url('header-1-left.gif');
 background-repeat: no-repeat;
 width: 35.5%;
}


img.header1right  {

/*margin-left: 284px; /* */

/*width: 516px;
*/
  background-image: url("header-1-right.jpg");
  width: 64.5%;
}  

  
img.header2left {
  width:30%;
  }
  
div#image, div#nav {
padding-top:4px;
padding-right:4px;
padding-left:4px;
 }

div#image {
  float: right;
  width: 140px;
/*  padding-top: 4px;
  padding-right:4px;
  */
/*  border: thin solid gray; */
}
   
div#nav, div#navigation {
  width: 130px;
  font-size: small;
  
  margin-bottom: 2px;
  
  float: left;

  line-height:220%; /* Make whitespace between letters and container  */ 
  overflow: hidden; /* To hide the "right" of the links */
}

div#nav a, div#nav a.cssmenubutton, .testmenubutton {
  white-space : nowrap;  
  text-align: left;  
  margin-left: 5px;
  margin-top: 0px;
  margin-bottom: 2px;

  padding-left: 40px;
  padding-right:100%; 
  text-decoration: none;

  padding-top: 4%;
  padding-bottom: 4%;
}  

div#nav a:hover {

  background-color:blue;
  color:white;

}

div#nav a.cssmenubutton_active, .testmenubutton_active {
  background-color: red;
  }



div#main, div#mainNoImage {
  padding-left: 150px;
  padding-right: 5%; /* mainNoImage will be 5%, main with image will be different */
  padding-top: 1%;
  padding-bottom: 2%;
    
  line-height:1.1;
  font-size:medium;

 }
 
div#main {
  padding-right: 160px; /* Leave room for picture */
}  

div#main a,div#mainNoImage a {
  color: darkblue;
  border-bottom: 3px solid blue;
  text-decoration:none; 
}


}
  
div#main a:hover, div#mainNoImage a:hover {
  background-color: lime;
}

div#menuandbody {
  height: 100%;  

  background-color: ghostwhite;

  color: black; 
  font-size: small;
  text-align: left;
  min-height: 150px;
} 

  div#nav a, div#nav a.cssmenubutton, .testmenubutton, div#footerid, div#headerid  {
  background-color: lightslategray;
  background-image:none;
  color:white;
  
  font-family : arial, helvetica;
  font-size : small;
  font-style : normal;
  font-weight : bold;

  }
div#footerid, div#headerid {

  text-align: right;  
  
  padding-top: 8px;
  padding-bottom: 8px;
  padding-right: 10px;
    
  border-right-width: 10px;


}

/*   */

div#extra, div#googlesearchextra {
  font-size:small; 
  width:100%;
  line-height:1.25 ;
  margin-top: 0;
  margin-bottom: 0;
  color:gray;
}

div#extra a:hover {
color: red;
}

  
/* ***************************************************** */
/* End of CSS way of life... below is more of the  */
/* "original" way that doteasy website creator set up  */
/* the site  */
/* ***************************************************** */  
  
div#searchinfo a:hover, div#below a:hover { color:red; }

div#searchinfo{
  font-size:x-small; 
  width:800px;
  line-height:1.1 
  }
  
div#below{
  font-size:x-small; 
  width:800px;
  line-height:1; 
  text-align:center
  }
  
div#body{
  font-size:small; 
  width:100%;
  line-height:1.25; 
  text-align:left
  }
  
/* Redefine standard HTML */
h1, h2, h3 {font-size:medium; text-align:center}
h3{text-align:left}

hr.break  {
  text-align:center;
  width:70%;
  }

/*<hr align="center" width="70%" size="5" > */


/* Create "lines" across the page */
  
.divisionlinewhite {
  width:100%;
  background-image: url("/pb/images/xblank.gif");
  background-color: white;
  height:1px;
  }

.divisionlineblue {
  width:100%;
  background-color: #003366;
  height:15px;
  }
  
/* This doesn't work yet -- but include "image" into sheet.  */
/* Question of whether the image should be defined here... probably not */


.page
{
  margin-right: 0px;
  margin-left: 0px;
  margin-top: 0px;
  margin-bottom: 0px;
  background-color : white;
  background-image : none;
}

/* Header area */
.header
{
  background-color : black;
  background-image : none;
}
.header td
{
  font-size : small;
  color : white;
  font-weight : bold;
  font-style : normal;
}

.header a:link
{
  text-decoration : none;
  color : black;
}

.sidebar
{
  background-color: #0578a1;
  padding: 0 0 0 0;
}

.sidebar_space
{
  height : 100%;
}

.item
{
  border-style: solid;
  border-width: 1px 1px 1px 1px;
  border-color: #0d3450;
  background-color : #fe7404;
}

.item_title
{
  background-color: #0d3450;
  font-family: arial;
  font-size: small;
  font-weight: bold;
  font-style: normal;
  color: white;
  padding: 3px;
}

.item_content
{
  color : white;
  font-family : arial;
  font-size : small;
  font-weight : normal;
  font-style : normal;
  padding: 5px;
}

.item_caption
{
  color : white;
  font-family : arial;
  font-size : small;
  font-weight : normal;
  font-style : normal;
  padding: 5px;
}

.sidebar a:link
{
  text-decoration: none;
  color: black;
}

.body
{
  background-color : #0578a1;
  background-image : none;
  padding: 10px;
  text-align: left;
}

.body a:hover {
  background: lime;
  }
  
.body_text
{
  font-family : arial;
  font-size : small;
  font-weight : normal;
  font-style : normal;
  color : white;

  }

.body_text a:link
{
  text-decoration: none;
  color: black;
}

/* Footer area */
.footer
{
  background-color : #dbdbdc;
  background-image : none;
  text-align: right;  
  height:250%;
}

.footer td
{
  font-family : arial, helvetica;
  font-size : x-small;
  color : black;
  font-style : normal;
  font-weight : normal;
}

.footer a:link
{
  text-decoration : none;
  color : black;
}

.footer a:hover
{
  text-decoration : none;
  color : red ;
}

.footer a:visited
{
  text-decoration : none;
  color : black;
}

/* Tables */

table.fullwidth {
/*  border="0" cellpadding="0" cellspacing="0" width="100%" */  
  border: 0;
  padding: 0 0 0 0;
  border-spacing: 0;
/*  width:100%; */
  border-collapse:collapse;
  }
  
table.fullwidth td {
  padding: 0px;
  }
  
/* Menu controls */
table.menusystem {
  border: 0;
  padding: 0 0 0 0; /* in table format cellpadding: 0; */
  border-spacing: 0; /* cellspacing: 0; */
  width: 130px;
  border-collapse:collapse;
  }

table.menusystem td {
  padding-left:0px;
  padding-top: 0px;
  padding-bottom: 5px;
  padding-right: 0px;
  border-collapse:collapse;
  }

.menu
{
  background-color: #0578a1;
  vertical-align:top;
}

.menuButton, .menuButton_on
{
  padding-left: 10px;
  padding-right: 10px;
  padding-top:0px;
  padding-bottom:0px;

}

.menuButton a, .menuButton_on a
{
/*  vertical-align:center;
*/  line-height:150%;
  padding-left: 10px;
  padding-right: 10px;
  padding-top:0px;
  padding-bottom:0px;
  font-family : arial;
  font-size : x-small;
  font-weight : bold ;
  color : white;
  font-style : normal;
  text-decoration: none;
  }

.menuButton
{
  background-color: #003366;
}

.menuButton_on
{
  background-color: #fe7404;
}

.menudefault
{
  background-color: #003366;
  width:25%;
}

.menuright
{
  background-color: #003366;
  width:1px;
}

.menuright_on
{
  background-color: #fe7404;
  width:1px;
}

.menuleft
{
  background-color: #003366;
  width:1px;
}

.menuleft_on
{
  background-color: #fe7404;
  width:1px;
}

.menu_ButtonHeight
{
  background-color: black;
  width: 1px;
  height: 200%;
}

.menu_h_space
{
  background-color: #0578a1;
  height : 2px;
/*  colspan: 3;
/**/}

.header p {margin-top:0px; margin-bottom:0px}
.sidebar p {margin-top:0px; margin-bottom:0px}
.body p {margin-top:0px; margin-bottom:0px}
.footer p {margin-top:0px; margin-bottom:0px}