/* always */

a:link{
  text-decoration: none;
}

a:visited{
  text-decoration: none;
}

a:hover{
  text-decoration: none;
}



body {
/*  background-color: #FFFFCC; */
  background-color: #FFFFFF;
  margin: 0;
  padding: 0;
  }

/*
 * Begin the menu stuff that provides
 * site navigation for every page.
 */

#mypage {
  background-image: url(../image/menubar.jpg); /* Remember this path is relative to css. */
  height: 30px;
  width: 640px;
  }

#menu a {
  position: absolute;
  top: 0px;
  height: 30px;
  width: 30px;
  text-decoration: none;
  }

#menu a i { visibility: hidden; }

a#home { left: 5px; width: 45px; }
a#family { left: 63px; width: 64px; }
a#work { left: 138px; width: 46px; }
a#play { left: 198px; width: 44px; }
a#organize { left: 254px; width: 86px; }
a#reach { left: 352px; width: 53px; }
a#gallery { left: 419px; width: 74px; }
a#blog { left: 506px; width: 45px; }
a#extras { left: 565px; width: 63px; }

/* The paths here are relative to css as well. */
a#home:hover { background-image: url(../image/menu_sel_home.jpg); }
a#family:hover { background-image: url(../image/menu_sel_family.jpg); }
a#work:hover { background-image: url(../image/menu_sel_work.jpg); }
a#play:hover { background-image: url(../image/menu_sel_play.jpg); }
a#organize:hover { background-image: url(../image/menu_sel_organize.jpg); }
a#reach:hover { background-image: url(../image/menu_sel_reach.jpg); }
a#gallery:hover { background-image: url(../image/menu_sel_gallery.jpg); }
a#blog:hover { background-image: url(../image/menu_sel_blog.jpg); }
a#extras:hover { background-image: url(../image/menu_sel_extras.jpg); }

/*
   This is necessary to get around a bug in IE whereby the rollover
   images do not disappear as they should. The bug is not present in
   the V7 browser.
*/
a#home:hover,
a#family:hover,
a#work:hover,
a#play:hover,
a#organize:hover,
a#reach:hover,
a#gallery:hover,
a#blog:hover,
a#extras:hover { border:none; }


/* These are adjustments to standard markup. */

p {
  padding-left: 15px;
  padding-right: 15px;
  font-family: Verdana, sans-serif;
  font-size: 11px;
  line-height: 20px;
}

h2 {
  padding-left: 15px;
  font-family: Verdana, sans-serif;
  font-size: medium;
}

h3 {
  padding-left: 15px;
  font-family: Verdana, sans-serif;
  font-size: small;
}

pre {
  padding-left: 15px;
}

/* Stuff for nice columns. */

#container {
/*  background-color: #FFFFCC; */
  background-color: #FFFFFF;
  overflow: hidden;
  margin: 0 0px;
  padding-right: 350px; /* The width of the rail */
}

* html #container {
  height: 1%; /* So IE plays nice */
}

#content {
/*  background-color: #FFFFCC; */
  background-color: #FFFFFF;
  width: 100%;
/*  border-right: 350px solid #FFFFCC; */
  border-right: 350px solid #FFFFFF;
  margin-right: -350px;
  float: left;
}

#rail {
/*  background-color: #FFFFCC; */
  background-color: #FFFFFF;
  width: 350px;
  float: left;
  margin-right: -350px;
}

/* Stuff for image positioning. */

.floatright {
float: right;
border-width: 1px;
margin: 10px 0 10px 10px; /* top right bottom left */
}

.floatleft {
float: left;
border-width: 1px;
margin: 10px 10px 10px 0; /* top right bottom left */
}

.nbfloatright {
float: right;
margin: 10px 0 10px 10px; /* top right bottom left */
}

.nbfloatleft {
float: left;
margin: 10px 10px 10px 0; /* top right bottom left */
}