/* Cascading Style Sheet for site The New Pioneers - 25 Aug 2006 */
/* ******************  default body  *************** */

/* bgcolor="#EEBBBB" link="#0000EF" vlink="#330099" alink="#FF0000" text="#000000" background="/Images/bg.jpg" */
body {
   background-color: #ebb; /* colors lighter: #fdd, darker: #e99 */
   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: #e99; 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: #fdd; color: blue }
a.offscr:visited { text-decoration:underline; background: #fdd; 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: #ebb; color: black; } /* Default hover is like "onscr" colors */
/* Do these next two lines to avoid MSIE kludge doing something funny */
/* (But if an anchor and a link are on the same line, the background won't change then!) */
a[name]:hover { background: none; } /* For MSIE kludge */
a[id]:hover { background: none; } /* For MSIE kludge */
/* Other link definitions: */
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: #ebb; color: black; } */
/* MSIE Strict needs next, but this messes up non-MSIE, so see above */
a:hover { background: #ebb; 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  ********* */
body.private {
   background: none;
   background-color: white;
   text-align: left;
   color: black;
   font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
}
img.prvnorect {
   vertical-align: middle;
   border: 2px dotted #ffffff; /* "transparent" will not work on MSIE, yet! :-( */
}
/* Special treatments for private links: */
a.private:link { text-decoration:underline; background: #eeeeee; color: #444444; }
a.private:visited { text-decoration:underline; background: none; color: #444444; }
a.private[href]:hover { background: #444444; color: white }
a.private:href:hover { background: #444444; color: white } /* The MSIE kludge */
a.private:hover { background: #444444; color: white } /* The MSIE Strict kludge that hoses others */
a.prvextern:link { text-decoration:underline; background: #afc1db; color: #002454; }
a.prvextern:visited { text-decoration:underline; background: none; color: #037; }
a.prvextern[href]:hover { background: #444444; color: white }
a.prvextern:href:hover { background: #444444; color: white } /* The MSIE kludge */
a.prvextern:hover { background: #444444; color: white } /* The MSIE Strict kludge that hoses others */
/* hover bg on non-rectangular images would look wierd */
a.prvnorect[href]:hover { background: none; border: none; }
a.prvnorect:href:hover { background: none; border: none; }
a.prvnorect[href]:hover IMG { background: none; border: 2px solid #eeeeee; }
/* 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.prvnorect:href:hover IMG { background: none; border: 2px solid #eeeeee; }

/* define the link colors we use so we can show them if needed: */
.prvlink { text-decoration:underline; background: #eeeeee; color: #444444; }
.prvvisited { text-decoration:underline; background: none; color: #444444; }

/* Used on contract and other official pages: */
body.contract, body.metrics {
   background: none;
   background-color: white;
   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: Arial, Helvetica, sans-serif;
}

/* 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: #fdd;
}

/* 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: #fdd;
/*   border-color: #630; */
}

.center {
   text-align: center;
}

.left {
   text-align: left;
}

.right {
   text-align: right;
}

.justify {
   text-align: justify;
}

.middle {
   vertical-align: middle;
   text-align: center;
/*   border: 3px solid black; */
}

.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;
}

/* 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%;
}

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

/* Newsletter New Year blurb: */
.newsnewyr {
   color: red;
   font-size: 160%;
}

/* Newsletter Christmas blurb: */
.newsxmas {
   color: green;
   font-size: 160%;
}

/* Newsletter patriotic blurb table */
.patriotic
{
   background: #cce0ff; /* Light blue */
   color: white;
   text-align: center;
   vertical-align: middle;
/* Add the box around the table or block */
   border: 3px inset #cce0ff;
}

/* 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 #fdd;
   border-right: 3px outset #fdd;
   border-bottom: 3px outset #fdd;
   border-left: 3px outset #fdd;
}
/* For the page onscreen now: */
td.onscr
{
   background-color: #ebb;
   color: black;
}

/* For pages offscreen now and for "real" buttons: */
.inputbtn, .fakebtn, button.offscr, input.offscr, td.offscr
{
   background-color: #fdd;
   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: #ebb; 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: #ebb; color: black; }
}