/* Cascading Style Sheet for site thedaughters - 20 Aug 2006 */
/* ******************  default body  *************** */

/* bgcolor="#FFCC99" link="#0000EF" vlink="#55188A" alink="#FF0000" text="#000000" */
body {
   background-color: #fc9;
 /*  background: url(/Images/bg.jpg); */
   color: black;
   font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
}

/* Links */
a:link { text-decoration:underline; background: none; color: blue; }
a:visited { text-decoration:underline; background: none; color: #309; }
a:active { text-decoration:underline; background: none; color: #f00; }

a.nonrect:link { text-decoration:underline; background: none; }
a.extern:link { text-decoration:underline; background: #fa5; color: #037; }
a.extern:visited { text-decoration:underline; background: none; color: #525; }

/* Provide for special handling of "off-screen" nav links: */
a.offscr { text-decoration:underline; }
a.offscr:link { text-decoration:underline; background: #fa5; color: blue }
a.offscr:visited { text-decoration:underline; background: #fa5; color: #309 }

/* define the hover color we use so we can show it if needed: */
.hover { background: #309; color: white; }

@media screen { /* hide from IE3 */
a[href]:hover { background: #fdb; color: black; } /* Default hover is like "onscr" colors */
a[name]:hover { background: none; } /* Do this to avoid MSIE kludge doing something funny */
a[id]:hover { background: none; } /* Do this to avoid MSIE kludge doing something funny */
a.nonrect[href]:hover { background: none; border: none; } /* hover here would look wierd */
/* Kludge to make MSIE work since it doesn't support attribute selectors,
   so it doesn't recognise the standard "a[href]:hover" construct, sigh! */
/* 4.01 Transitional allowed: a:href:hover { background: #fdb; color: black; } */
/* MSIE Strict needs next, but this messes up non-MSIE, so see above */
a:hover { background: #fdb; color: black; }
a.nonrect:href:hover { background: none; border: none; } /* hover here would look wierd */
/* Kludge to make MSIE work since it doesn't support attribute selectors,
   so it doesn't recognise the standard "a[href]:hover" construct, sigh! */
}

/* Setting so there is no hover display for image links
   (otherwise it looks funny on non-rectangular images) */
@media screen { /* hide from IE3 */
a[href]:hover IMG {
   background: none;
   border: 0; /* For default, don't have a border, so none to hover either */
/*   border: 2px solid #309; */
 }
a.nonrect[href]:hover IMG {
   background: none; /* hover background here would look wierd */
   border: 2px solid #309;
 }
/* Kludge to make MSIE work since it doesn't support attribute selectors,
   so it doesn't recognise the standard "a[href]:hover" construct, sigh! */
a:href:hover IMG {
   background: none; /* hover background here would look wierd */
   border: 0; /* For default, don't have a border, so none to hover either */
/*   border: 2px solid #309; */
 }
a.nonrect:href:hover IMG {
   background: none; /* hover here would look wierd */
   border: 2px solid #309;
/*   color; none;
   border: none; */
 }
}

/* Other elements */

img {
   vertical-align: middle;
   border: 0; /* For default, don't have a border */
}
img.photo {
   vertical-align: middle;
   border: 2px solid black;
}
img.nonrect {
   vertical-align: middle;
   border: 2px dotted white; /* "transparent" will not work on MSIE, yet! :-( */
}
p.nonrect {
   margin-left: auto; /* These 2 center the table, but not on MSIE, see .msiekludge <grr> */
   margin-right: auto;
}

/* MSIE is broken and does not honor standard ways of centering a table
   So to do so, fool it by putting a table into a "<div>" of ths following class: */
.msiekludge {
   text-align: center;
}
/* Then, some notes say that in the _real_ table def, set the text-align back to
   "left" or defaulted cells will be centered, not left aligned,
   but this does not seem to work, so just make certain that all cells set
   their own text-align as is desired ... sheesh, what a mess! */

table {
   table-layout: auto;
   margin-left: auto; /* These 2 center the table, but not on MSIE, see .msiekludge <grr> */
   margin-right: auto;
   border-style: none; /* Drop the box around a standard table */
}

/* Used on certain script error pages: */
body.errorpg {
   background: none;
   background-color: #ffccff; /* Light magenta */
   color: #5e1b0f;            /* Dark Red */
   font-family: sans-serif;
}

/* Body styles used with ARDEpet application: */
body.master, body.mirror {
   background-color: white;
   color: black;
   font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
}
body.testsrvr {
   background-color: #ff0;    /* yellow */
   color: black;
   font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
}
body.othersrvr {
   background-color: red;
   color: black;
   font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
}

/* **********  "Private" page definitions  ********* */
/* Also used for private metrics pages */
/* MSIE does not seem to honor the following the same way Firefox does. */
/* On MSIE "transparent" causes the folowing to display "a:visited", etc. not the background: */
a.prvnorect:link IMG, a.metrnorect:link IMG,
a.prvnorect:visited IMG, a.metrnorect:visited IMG {
   border-width: 1px;
   border-style: dotted;
   border-color: transparent; /* white; since "transparent" does not work on MSIE! :-( */
}
a.prvnorect:active IMG, a.metrnorect:active IMG
 { border: 1px dotted red; }

body.private, body.metrics {
   background-color: white;
/*   background-image: url(/Images/bg.jpg); */
   background-image: none;
   text-align: left;
   color: black;
   font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
}
img.prvnorect, img.metrnorect {
   vertical-align: middle;
   border-width: 1px;
   border-style: dotted;
   border-color: transparent; /* white; since "transparent" does not work on MSIE! :-( */
}
/* Define the private link colors we use so we can show them if needed: */
.prvlink, .metrlink { background-color: #eee; color: #444; }
.prvvisited, .metrvisited { background-color: transparent; color: #444; }

/* Special treatments for private links: */
a.private:link, a.metrics:link
 { background-color: #eee; color: #444; }
a.private:visited, a.metrics:visited
 { background-color: transparent; color: #444; }
a.prvextern:link, a.metrextern:link
 { background-color: #afc1db; color: #002454; }
a.prvextern:visited, a.metrextern:visited
 { background-color: transparent; color: #037; }

/* Define the private hover color we use so we can show it if needed: */
.prvhover, .metrhover { background-color: #444; color: white; }
/* Define private hovers, keeping MSIE kludges separate or standard styles don't work */
a.private[href]:hover, a.prvextern[href]:hover, a.metrics[href]:hover, a.metrextern[href]:hover
  { background-color: #444; color: white }
/* The MSIE kludges: ones without 'href' hose standards-compliant agents, grr */
a.private:href:hover, a.prvextern:href:hover, a.metrics:href:hover, a.metrextern:href:hover,
a.private:hover, a.prvextern:hover, a.metrics:hover, a.metrextern:hover
  { background-color: #444; color: white }
/* hover bg on non-rectangular images would look wierd */
a.prvnorect[href]:hover, a.metrnorect[href]:hover
  { background-color: transparent; border: none; }
/* The MSIE kludges: ones without 'href' hose standards-compliant agents, grr */
a.prvnorect:href:hover, a.metrnorect:href:hover,
a.prvnorect:hover, a.metrnorect:hover
  { background-color: transparent; border: none; }
a.prvnorect[href]:hover IMG, a.metrnorect[href]:hover IMG
  { background-color: transparent; border: 1px solid #eee; }
/* The MSIE kludges: ones without 'href' hose standards-compliant agents, grr */
a.prvnorect:href:hover IMG, a.metrnorect:href:hover IMG,
a.prvnorect:hover IMG, a.metrnorect:hover IMG
  { background-color: transparent; border: 1px solid #eee; }

/* Used on contract and other official pages: */
body.contract {
   background-color: white;
   background-image: none;
   text-align: left;
   color: black;
   font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
}
/* For small things (like expiration messages) in the contract: */
.contractexp {
   text-align: center;
   color: black;
   font-size: 70%;
   line-height: 1.1;
   font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
}
/* Use sparingly! Confuses users due to links. */
.underline {
   text-decoration: underline;
}

/* These are classes which may be applied to multiple tags: */

.brdr {
   border-style: solid; /* Add the box around the table or block */
   border-width: 2px;
   border-color: #fa5;
}

/* border to be used around table content: */
.tblbrdr {
/*   width: 99%; */
   padding: 5px;
   border-style: outset; /* Add the box around the table or block */
   border-width: 3px;
   border-color: #fa5;
/*   border-color: #630; */
}

.center {
   text-align: center;
}

.left {
   text-align: left;
}

.right {
   text-align: right;
}

.justify {
   text-align: justify;
}

.margin {
   margin-left: 5%;
}

.indent {
   text-indent: 2em;
}

.undent {
   margin-left: 2em;
   text-indent: -2em;
}

.clearall {
   clear: both;
}

td {
   text-align: left;
}

/* Intended for photo display pages: */
/* Date of photos: */
.phimgdate {
   color: #999999;
   font-size: 80%;
}
/* Index of photos: */
.phimgindx {
   color: #999999;
}

/* More Specials: */

/* Page title (Hx, etc.) formats: */
.pgttl {
   text-align: center;
   margin: 5px; /* Scrunch title together a bit more than normal */
}

/* Title on an error page */
.errttl {
   text-align: center;
   background-color: #ff0000;
}

/* Page "Updated" info line: */
.updated {
   text-align: center;
   font-size: 70%;
}

/* Explanitory info: */
.explain {
   font-size: 80%;
}
.explaintiny {
   font-size: 60%;
}

/* Critical info: */
.critical {
   font-weight: bold;
   font-size: 90%;
}

/* The Daughter's name: */
.ourname {
   font-style: italic;
   font-size: 110%;
}

/* Highlighted info: */
.highlight {
   color: red;
}

/* Required info: */
.required {
   font-weight: bold;
   font-size: 70%;
   color: red;
}

/* Form action elements: */
.formele {
   text-align: center;
   vertical-align: middle;
   padding: 9px; /* if this is too small, MSIE chops the top of the fake button, grr */
   margin: 1px;
}

/* Form action button: */
input {
   font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
}

/* Real and fake form action button: */
.inputbtn, .fakebtn {
   line-height: 1.2;
   padding: 3px;
}

/* Top navigation block: */
.navblock
{
   background: #cce0ff; /* Light blue */
   color: white;
   text-align: center;
}

/* Navigation buttons */
td.onscr, button.offscr, input.offscr, td.offscr
{
   padding: 5px;
}
td.onscr, button.offscr, input.offscr, td.offscr, .inputbtn, .fakebtn
{
   text-align: center;
   vertical-align: middle;
   font-weight: bolder;

   margin: 3px 3px 3px 3px;

/* Add the box around the table or block */
   border-top: 3px outset #fa5;
   border-right: 3px outset #fa5;
   border-bottom: 3px outset #fa5;
   border-left: 3px outset #fa5;
}
/* For the page onscreen now: */
td.onscr
{
   background-color: #fdb;
   color: black;
}

/* For pages offscreen now and for "real" buttons: */
.inputbtn, .fakebtn, button.offscr, input.offscr, td.offscr
{
   background-color: #fa5;
   color: black;
}

/* Add special navigation hover styles; be sure background is appropriate */
@media screen { /* hide from IE3 */
button.offscr:hover, input.offscr:hover, a.offscr[href]:hover { background: #fdb; color: black; }
/* Kludge to make MSIE work since it doesn't support attribute selectors,
   so it doesn't recognise the standard "a[href]:hover" construct, sigh! */
/* in 4.01 transitional, use this: button.offscr:hover, input.offscr:hover, a.offscr:href:hover */
button.offscr:hover, input.offscr:hover, a.offscr:hover { background: #fdb; color: black; }
}