/* style sheet for Megan's pages */
/* Keith Wansbrough, July 2003, Oct 2004, Oct 2005 */

/* GENERAL */

/* support for browsers that don't support styles */
.nostyle { display: none }

/* PAGE LAYOUT */

BODY {
  background: #ffffd8;
  color: black;
  margin: 0px;
}

/* DIV.page {} */

DIV.top {
  width: 100%;
  position: relative;
}

DIV.main {
  position: relative;
  background:  url(megan-website-background-tiled.png) #ffffd8;
  height: auto;
  border-spacing: 0px;
}

DIV.content {  /* inside .main */
  width: auto;
  height: auto;
  min-height: 400px;
  border-left: solid #ff80cc 160px;
  margin-left: 0px;
  padding: 0.5em 1em;
  vertical-align: top;
}

DIV.leftnav {  /* inside .main */
  position: absolute;
  left: 0px;
  top: 0px;
  float: left;
  width: 160px;
  height: 100%;
  vertical-align: top;
}

DIV.trailer {
  position: relative;
  width: 100%;
  height: 4.2ex;
  background: #ecc6f5;
  font-size: 71%;
  clear: both;
}


/* TOP */

DIV.banner {  /* inside DIV.top */
  width: 100%;
  height: 105px;
  background: #b870bc;
  color: #c6daf5;
  text-align: center;
}

DIV.banner IMG {
  border: none;
  margin-top: 12px;
}

DIV.banner P, DIV.orientation P {
  margin: 0px;
}

DIV.banner P {
  font-size: 200%;
}

DIV.orientation {  /* inside DIV.top */
  position: relative;
  padding-left: 1ex;
  height: 20px;
  background: #ecc6f5;
  font-family: sans-serif;
  font-size: 71%;
}

DIV.orientationR {
  position: absolute;
  border:0px;
  padding: 0px;
  margin: 0px;
  width: auto;
  top: 0px;
  right: 0px;
}

DIV.orientationR P {
  text-align: right;
}

/* LEFT NAVIGATION */

TABLE.leftnavbuttons { width: 100%; margin-top: 10px; }
TABLE.leftnavbuttons TD { border: none; margin: 0px; padding: 0px; width: 160px; height: 30px; text-align: center }
TABLE.leftnavbuttons IMG { border: none }
TABLE.leftnavbuttons A { text-decoration: none }

/* RIGHT ORIENTATION */

TABLE.orientationRbuttons TD { border: none; margin: 0px; padding: 0px; width: 91px; height: 20px; text-align: center }
TABLE.orientationRbuttons { padding: 0px; margin: 0px; border: none; border-spacing: 0px }
TABLE.orientationRbuttons IMG { border: none }
TABLE.orientationRbuttons A { text-decoration: none }

/* FLOATING NAVIGATION */

DIV.floatnav {
  position: fixed;
  width: 140px;
  height: auto;
  left: 10px;
/*  top: 370px; */ /* a good value to use if bottom not supported; works even in 800x600 */
  bottom: 3ex;
  padding: 0px;
  margin: -1px;
  border-width: 1px;
  border-style: solid;
  border-color: black;
  background: #ffffd8;
  color: #ff80cc;
  z-index: 1;
}

DIV.floatnav A {
  color: #ff80cc;
  text-decoration: none;
}

DIV.floatnav .top {
  font-weight: bold;
  background: #ffffd8;
}
DIV.floatnav .top A {
  color: #b870bc;
}
DIV.floatnav .top A:hover {
  color: #ff80cc;
}

DIV.floatnav .here {
  font-weight: bold;
}
DIV.floatnav TD.but {
  vertical-align: center;
}
DIV.floatnav TD.butR {
  vertical-align: center;
  text-align: right;
}

DIV.floatnav TD.desc {
  text-align: center;
  vertical-align: center;
}

DIV.floatnav TABLE {
  width: 100%;
  border-spacing: 0px;
  padding: 0px;
  margin: 0px;
}

DIV.floatnav TD {
  margin: 0px;
  padding: 0px;
}

DIV.floatnav IMG {
  border-style: none;
}

TABLE.floatnavbuttons {
  border-spacing: 0px;
  margin: 0px;
  padding: 0px;
  border: none;
  font-size: 84%;
}


/* TRAILER */

DIV.trailer TABLE, DIV.trailer TR, DIV.trailer TD {
  font-size: 100%;
}


/* TEXT */

A:link { color: #b870bc; }
A:link:hover { background-color: #ecc6f5; }
A:visited { color: #ff80cc; }
A:visited:hover { background-color: #ecc6f5; }
A:active { color: #ff0000; }

DIV.top A:visited { color: #b870bc; }
DIV.trailer A:visited { color: #b870bc; }


/* avoid annoying purple image border */
A:link IMG, A:visited IMG { color: black }

IMG {
  border-width: 3px;
  border-style: solid;
  border-color: black;
}

IMG.info {
  border: none;
  margin: 1px;
  z-index: 1;
}

DIV.infop {
  position: relative;
  width: 18px;
  bottom: 18px;
  left: 0px;
/*  padding-top: 1px; */
}

DIV.infoL, DIV.infoR {
  position: absolute;
  bottom: 2px;
  width: 300px;
}
DIV.infoL {
  left: 20px;
}
DIV.infoR {
  right: 20px;
}

DIV.infop DIV.infoL, DIV.infop DIV.infoR {
  display: none;
}
DIV.infop:hover DIV.infoL, DIV.infop:hover DIV.infoR {
  display: block;
}
DIV.info {
  position: absolute;
  font-family: sans-serif;
  font-size: 9px;
  text-align: left;
  padding: 3px;
  border: solid black 1px;
  background: #ffffaa;  
  bottom: 0px;
  z-index: 1;
}
DIV.infoL DIV.info {
  left: 0px;
}
DIV.infoR DIV.info {
  right: 0px;
}

H1 {
  margin: 0px;
  color: #b870bc;
  font-weight: normal;
}

H1 IMG {
  border: none;
  margin: 0px;
  padding: 0px;
}

P.centretext {
  text-align: center;
}  

P.centretext IMG {
  border: none;
  margin: 0px;
  padding: 0px;
}

H3 {
  font-size: 100%;
  font-style: italic;
  font-weight: normal;
}

DIV.cphoto {
  text-align: center;
  font-style: italic;
}

DIV.aidan {
  /* diary font: was comic sans or sans serif; now nothing special */
}

DIV.latest {
  margin-left: 2em;
  margin-right: 5em;
}

TABLE.invisible {
  border: none;
}

.smallprint {
  font-size: 84%;
}

/* SIDEBAR AND PHOTOGRIDS */

/* annoying facts: inline-block not implemented on Firefox */

TABLE.photogrid {
  margin-top: 2ex;
  margin-bottom: 2ex;
  background-image: url(megan-website-background-tiled-rev.png);
  background-color: #ecc6f5;
}

TABLE.photogrid TD, DIV.sidebarL, DIV.sidebarR  {
  border-width: 1px;  
  border-style: solid;
  padding: 1em;
  text-align: center;
}

DIV.sidebarI, DIV.sidebarL, DIV.sidebarR {
  font-family: serif;
  font-style: italic;
  font-size: 71%;
}

DIV.sidebarI {
  display: inline;
/*  margin-left: 2em;
  margin-right: 2em;*/
}

DIV.sidebarL {
  float: left;
  margin-right: 2em;
}

DIV.sidebarR {
  float: right;
  margin-left: 2em;
}

/* TOOTHCHART */

DIV.toothchart {
  background: url(http://www.anbesol.com/teething/images/chart_new_2.gif) no-repeat;
/* backup: wyeth-tooth-chart.gif */
}

DIV.toothchart IMG {
  border-width: 0px;
}


/* OVERLAID IMAGES */

DIV.overimg {
  position: relative;  /* make this a container */
  margin: 0px;
  padding: 0px;
}
        
DIV.overimg IMG {
  position: absolute;
  left: 0px;
  top: 0px;
  border: 0px;
  margin: 0px;
  padding: 0px;
}

DIV.overimg IMG.overlay {
  position: relative;
  z-index: 1;
}

DIV.overimg IMG.overlay2 {
  visibility: hidden;
}

/* FUN STUFF */

DIV.quote {
  margin-left: 3em;
  margin-right: 5em;
  font-style: italic;
}