
body 
{
    background-color: #dfdfdf;
    background-image: url("/images/vertical.stripe.2.png");
    background-repeat: repeat-x; 
    margin: 0px;
    padding: 0px;
}

/* the generic p style will keep random typefaces from appearing
 * where they should not. */
p
{
    font-size:12px;
    font-family:verdana, helvetica, sans-serif;
}

.centeredandbold
{
  margin:0px auto 0px auto;
  padding:10px 0px 10px 0px;
  font-weight:bold;
  font-size:12px;
  font-family:verdana, helvetica, sans-serif;
  text-align:center;
}

/* this is the page, and the auto left/right margins keep the whole
 * thing centered in the window. The background is the stripe, and it
 * is here that we set the width to 800px. */
#wrapper
{
  width:800px;
  margin: 0px auto 0px auto;
  padding: 0px 0px 20px 0px;
  background-image: url("/images/horizontal.stripe.png");
  background-repeat: repeat-y;
  background-position: center;
}

/* the top; the image is put /in/ the masthead */
#masthead
{
  margin: 0px;
  padding: 0px;
  height: 100px;
  width: 800px;
}

#masthead a
{
  text-decoration:none;
  margin:0px;
  padding:0px;
}

/* left side navigation. This is the region, with the 
 * width set, the height adjustable, and the top margin
 * set to 20px to keep it away from the masthead. Note
 * that it is "floated" to the left. This allows the
 * content to appear to the right ... otherwise, the
 * content would appear below the nav. */
#nav
{
  padding: 0px;
  margin: 20px 0px 0px 0px;
  float:left;
  width: 125px;
  height: auto;
}

/* the items in the nav, are a list (ul). */
#nav ul
{
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;

}

/* these format the text of the list that makes up the nav. */
#nav li
{
  margin: 0px 0px 0px 0px;
  padding: 9px 0px 0px 11px;
  font-family: verdana, helvetica, arial, sans-serif;
  font-size: 12px;
  color: #555;
  display: block;
  height: 22px;
  border-bottom: 1px #999999 dotted;
  list-style-type: none;
}

/* primarily, to set the color of the link. */
#nav li a
{
  display: block;
  height: 20px;
  width: 100px;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  color: #0068cb;
  text-decoration: none;
  height: 100%;
}

/* this is the color change that takes place when the mouse 
 * arrives on the scene. */
#nav li a:hover,
#nav li a.active
{
  color: #d2a24b;
}

/* The margin keeps the content from lying atop the nav. It is
 * auto width, so if we ever adjust the wrapper width, then 
 * the content will still be wrapper-nav pixels wide. */
#content
{
  margin: 0px 0px 0px 130px;
  padding: 10px 20px 0px 0px;
  width: auto;
}

/* This information should be read as affecting "p"-s that are
 * in the content region. */
#content p
{
  margin-left:30px;
  margin-right:30px;
  text-align: left;
  color: #333;
  padding: 5px 5px 5px 10px;
}

/* And for lists in the content region (as opposed to the nav 
 * region). */
#content ol
{
  margin-left:20px;
}

#content li
{
  font-family:verdana, helvetica, arial, sans-serif;
  font-size:12px;
  padding: 5px 20px 5px 5px;
  margin:0px 0px 0px 40px;
}

/* The next few blocks control the headline styles in the content
 * region. */
#content h1
{
    font-family: helvetica, arial, sans-serif;
    font-weight: bold;
    padding: 5px 5px 5px 5px;
    margin-left: 10px;
    margin-top: 10px;
    border-left: #d2a24b 3px solid; 
    height: auto;
    padding-left: 10px;
    font-size:20px;
}

#content h2
{
    font-family: helvetica, arial, sans-serif;
    font-weight: bold;
    padding: 5px 5px 5px 10px;
    margin-left: 25px;
    color: #444;
    font-size:18px;
/*    clear: both; */
}

#content h3
{
    font-family: helvetica, arial, sans-serif;
    font-weight: bold;
    font-size:14px;
    padding: 5px 5px 5px 5px;
    margin-left: 30px;
    color: #444;
}

/* not currently in use, but if we need to create an alignment
 * break that goes all the way across the page, this statement
 *
 *  <div class="spacer"> </div>
 *
 *  will do the trick. It clears all floats and other divs on
 *  either the right or left sides. The div itself is invisible,
 *  and has no content. */
#content.spacer, .spacerbk
{
  background-color: transparent;
  height:1px;
  clear:both;
}

.spacerbk { background-color:#888; }

/* Tables are used for the phone numbers */
#content table
{
  margin:10px 20px 10px 60px;
}

/* The table cells are set to be wider than the minimum (10px on 
 * the left and right sides) so that the columns do not abut. */
td 
{
  padding:2px 10px;
  font-family: helvetica, arial, sans-serif;
  font-weight: bold;
  font-size:12px;
}

/* just like a td, but add in the right side justification. */
td .right
{
  text-align:right;
}

/* goes at the bottom. We might want to relocate it, so I set the 
 * width to 800px for it, as well as the wrapper. */
#footer
{
  margin-left: auto;
  margin-right: auto;
  clear:both;
  width:800px;
}

/* footer text will be a little different. */
#footer p
{
  width: 60%;
  margin-left: auto;
  margin-right: auto;

  text-align: center;
  font-size: 10px;
  color: #888888;

  padding: 7px;
}

/* if we want to put photos in the content, this puts them on the 
 * right hand side, lets the text wrap, and creates a 1px border. */
.floatedphoto
{
  margin: 5px 0px 15px 15px; 
  float: right;
  border: 1px solid #dfdfdf;
}

/* ... or, without the border. */
.floatedphoto_noborder
{
  margin: 5px 0px 15px 15px; 
  float: right;
}

/* ... or on the left */
.floatedphoto_noborder_left
{
  margin: 0px 15px 15px 20px; 
  float: left;
}


/* for our downloads. */
.right-float
{
  float:right;
  padding:2px;
  background-color:transparent;
  margin:5px 5px 10px 10px;
  width:140px;
}


.window-narrative 
{
  float:right;
  width:120px;
  margin:2px 2px 2px 2px;
  padding:5px;
  font-size:9px;
  font-family:verdana, helvetica, arial, sans-serif;
  background-color:#dfdfdf;
}

.adobe_icon
{
  float:right;
  height:32px;
  width:32px;
  margin:5px 5px 10px 10px;
  border:none;
  background-color:transparent;
}

/* for all links that are not defined more specifically, elsewhere. */
a { 
	color: #0068cb;
	text-decoration: none; 
}

a:hover { 
  color: #d2a24b;
}

a img {
	border: none;
}

hr {
    border-top: 1px solid #a5cbba;
    border-right: none;
    border-bottom: none;
    border-left: none;
    height: 0em;
    line-height: 0em;

    margin: .3em 0em;
    padding: 0;
    overflow: hidden;
}

.spacer_dot {
    padding: 0px 7px;
    color: #66ccff;
}

.bigblock
{
  clear:both;
  margin-right:150px;
}

.zapped
{
  text-decoration:line-through;
}

.globbit_footer {
    width: auto;
    margin-right: 20px;
    margin-bottom: 40px;
}

.globbit_date {
    height: 20px;
    background-image: url("/images/bkgd_globbit.png");
    background-repeat: no-repeat;
    padding-top: 4px;
    padding-right: 4px;

    float: right;
    font-size: 80%;
    color: #666666;
    margin-top: -15px;
}

.remarks {
    padding-left: 14px;
}

blockquote 
{
    padding:20px;
}

#content h1.lexlogo
{
  text-align:center;
  font-size:48px;
  font-family:"Copperplate";
  font-weight:100;
  border:none;
}

.lhs
{
  padding:5px;
  width:300px;
  float:left;
}


.rhs
{
  padding:5px;
  width:320px;
  float:right;
}

.orangetext
{
  color: #d2a24b;
}


