@CHARSET "UTF-8";

/*
 * /resources/css/Persistent.css
 * Created on: June 8, 2006
 * $Revision: 12 $
 * $LastChangedDate: 2007-03-14 23:44:53 -0400 (Wed, 14 Mar 2007) $
 * 
 * Copyright © Coco Engineering, Inc.
 * 34 Sullivan RD, North Billerica, MA 01862, U.S.A.
 * www.cocoengineering.com
 * All rights reserved.
 */

/*
 * The primary color scheme here uses this red & blue set:
 * 
 *      Background Red:             #915959
 * 
 *      Link Red:                   #A81900
 *      Link Visited:               #6B2600
 *      Link Hover:                 #40B879
 *      Link Active:                #007D3D
 * 
 *      Links On The Red BG:
 *          Link:                   #EEEEEE
 *          Visited:                #D9D9D9
 *          Hover:                  #BEE6D1
 *          Active:                 #68C997
 * 
 *      Solid Gray Background:      #f8f8f8
 */

/* XXX The descendant selectors below (as in: X Y) for the most part are
 *     intended to instead be child selectors (X > Y); but IE 6 does not
 *     recognize the child selector syntax: among others also. */

/* The body has a margin and basic styles. */
html {
    background-image: url("/resources/images/graphics/Gray-White-Stripes-BG.gif");
    background-attachment: fixed;
}
body {
    margin: 0 2.5% 28% 2.5%;
    padding: 0;
    font-family: serif;
    font-style: normal;
    color: black;
}

/* Elements with default styles: */

div {
    margin: 0;
    padding: 0;
}
p, address {
    margin: .5em 0;
    padding: 0;
}
img { border: none; }
hr { margin: 1em 0; }

/* A linked "thumbnail" image: */
img.ImageThumbnail {
    border-width: medium;
    border-style: solid;
}

:link { color: #A81900; }
:link img.ImageThumbnail { border-color: #A81900; }
:visited { color: #6B2600; }
:visited img.ImageThumbnail { border-color: #6B2600; }
:link:hover, :visited:hover { color: #40B879; }
:link:hover img.ImageThumbnail, :visited:hover img.ImageThumbnail {
    border-color: #40B879;
}
:link:active, :visited:active { color: #007D3D; }
:link:active img.ImageThumbnail, :visited:active img.ImageThumbnail {
    border-color: #007D3D;
}

form {
    background-color: #f8f8f8;
    margin: 1em;
    padding: 1em;
    border: 1px solid black;
}
fieldset {
    margin: 1em;
    padding: 1em;
}
label { margin-right: .5em; }
h1 {
    margin: 0 0 1em 0;
    font-size: 140%;
    font-weight: bolder;
    font-family: sans-serif;
}
h1:first-letter {
    font-size: 180%;
    font-family: serif;
}
h2 {
    margin: 2em 0 1em 0;
    border-bottom: 1px solid black;
    font-size: 122%;
    font-weight: bolder;
    font-family: sans-serif;
}
h3 {
    margin: 2em 0 1em 0;
    border-bottom: 1px solid black;
    font-size: 108%;
    font-weight: bolder;
    font-family: sans-serif;
}


/* The primary boxes: */

/* The header box should contain spans of terse items, which become separated;
 * and there is a child title style. */
#header {
    margin-bottom: .5em;
    border: 1px solid black;
    font-family: sans-serif;
    color: white;
    background-color: #915959;
}
#header span {
    margin: 0 .5em;
    font-size: 78%;
    font-weight: bold;
}
#header span.Title {
    font-size: 100%;
    letter-spacing: .5ex;
}
#header :link { color: #EEEEEE; }
#header :visited { color: #D9D9D9; }
#header :link:hover, #header :visited:hover { color: #BEE6D1; }
#header :link:active, #header :visited:active { color: #68C997; }

/* The "sign" contains the logo and 'signCaptions': */
#sign a #logo {
    clear: left;
    float: left;
    margin-right: .9em;
}
#sign #signText {
    float: left;
    text-align: center;
}
#sign #signCaption1 {
    border: thin dashed black;
    font-family: sans-serif;
    font-size: 108%;
    line-height: 250%;
    padding: .3em .6em;
    font-weight: bolder;
}
#sign #signCaption2 {
    font-size: 85%;
    font-family: sans-serif;
}

/* The main site menu: Each <a> tag forms a block rollover link. */
#mainMenu {
    width: 15em;
    clear: left;
    float: left;
    margin: 0 1em 1em 0;
    border: 1px solid black;
    background-color: #915959;
}
#mainMenu .MenuItem {
    display: block;
    margin: .3em;
    border: 1px solid black;
    padding: .3em;
    font-size: 83%;
    font-weight: bold;
    font-family: sans-serif;
    letter-spacing: -.05ex;
    background-color: white;
    background-image: url("/resources/images/graphics/Gray-White-Stripes-BG.gif");
}
#mainMenu .MenuItem:hover { background-image: none; }
#mainMenu .MenuItem:active { background-image: none; }


/* This box forms a column that fills past the main menu:
 * In essence, this maintains the box width, without flowing back under the
 * menu.
 * XXX This syntax should really be:
 *     #mainMenu + #mainMenuMargin */
#mainMenuMargin {
    margin-left: 16em;
}


/* A center box in the page body: */
div.CenterBox {
    margin: 0 0 .5em 0;
    border: 1px solid black;
    padding: .9em;
    background: white;
}

/* The footer appears inside a CenterBox: */
div.CenterBox div#footer {
    clear: both;
    margin-top: 2em;
    border-top: 1px solid black;
}


/* Special items: */

.FloatLeading {
    float: left;
    margin-right: 1em;
}
.FloatTrailing {
    float: right;
    margin-left: 1em;
}
.FloatFirstLineStart {
    float: left;
    margin-right: 1em;
    margin-bottom: 1em;
}
.FloatFirstLineEnd {
    float: right;
    margin-left: 1em;
    margin-bottom: 1em;
}

br.FullClear {
    display: block;
    clear: both;
    height: 1px;
}

.ClearBoth { clear: both; }
.ClearLeading { clear: left; }
.ClearTrailing { clear: right; }

/* The Holly Hack: apply to a container containing a float. */
/* Hides from IE5-mac \*/
* html div.CenterBox { height: 1%; }
/* End hide from IE5-mac */