/* colors
background: #FFF (white)
text: #000 (black)
masthead: #EBD4B2 (beige)
menu bar, footer: #6fcee8; (turquoise)
menu hover: #E9D9C5 (light grey)
menu dropdown: #4C9DBB (darker turquoise)
menu borders: #AAA (grey)
image borders: #888 (dark grey)
borders: #CCC (light grey)
*/

/*====== GLOBAL OVERRIDES FOR MAJOR ITEMS AND DIFFERING BROWSER DEFAULTS =====*/
html {
background: #000; /* black */
background: #FFF; /* white*/
} 
body {
font-family: verdana, arial, geneva, helvetica, georgia, sans-serif;
font-size: .75em;
color: #000; /* black text color */
padding:0;
border:0;
text-align: center;
position: relative; /* if this is missing, initial display will be left justified */
width: 750px;
margin: 0 auto;
}
h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
border: 0;
color: #000;/* black text color */
}
h1{
font-size: 1.5em;
padding: 1em 0 .5em 0;
}
h2 {
font-size: 1em;
padding: .25em 1em .25em 0em;
color:#468799; /*darker turquoise */
text-transform: uppercase;
}
h3 {
font-size: .75em;
padding: .5em 0 1em 0;
}
h4 {
font-size: 1 em;
color: #000; /* match body text color */
}
p {
padding: 0em 0em 1em 0em;
margin: 0;
font-size: 1em;
}
a:link, a:visited {
color: #000; /* match body text color */
font-weight: bold;
text-decoration: underline;
}
a:hover{
font-weight: bold;
text-decoration: none;
color: #000; /* match body text color */
background: #CCC; /* hover color in menus and content */
}
element { /* must be in this order */
cursor: pointer;
cursor: hand;
}
table, img, button, iframe, ul, li  { margin:0; padding:0; border:0; }
table { text-align:left; }
iframe { width:0; height:0 }
/* -------------------- Section Div IDs ---------------------- */
#page-wrap {/* allows masthead and navigation to be placed under main content */
position: relative;/* required to place content under masthead */
width: 750px;
margin: 0;
text-align:left;
background: #FFF;
}
#page-wrap-wide {/* provides page sizing */
position: relative;/* required to place footer at bottom */
width: 882px;
text-align:left;
background: #FFF; /* match page-wrap */
}
#header {
position: relative;
}
#main-content {
position: absolute;
top: 92px;
left: 0;
padding: 0;
margin: 0;
/*border: 1px solid #AAA; *//* match masthead border*/
width: 750px; /* page-wrap less main padding */
background: #FFF;
}
#main-content-wide {
position: absolute;
top: 92px;
left: 0;
padding: 0;
margin: 0;
/*border: 1px solid #AAA; *//* match masthead */
width: 882px; /* page-wrap less main padding */
background: #FFF; /* match page-wrap */
}
#footer {
clear: both;
font-size: 1em;
background: #6fcee8;
/*border-top: 1px solid #000; *//* black border */
padding: 3px 20px 3px 20px;
width: 710px;/* page-wrap less padding */
position: absolute;/* stick to bottom */
bottom: 0;/* stick to bottom */
}
#footer-wide {
clear: both;
font-size: 1em;
background: #6fcee8;
/*border-top: 1px solid #000;*/ /* black border */
padding: 3px 20px 3px 20px;
width: 842px;/* page-wrap less  padding */
position: absolute;/* stick to bottom */
bottom: 0;/* stick to bottom */
}
/* suppress our whole footer when not an interactive mode (when printing, etc.) */
@media print, projection { #footer { d\isplay:none; } }
@media print, projection { #footer-wide { d\isplay:none; } }
/* -------------------- Content Width Settings ---------------------- */
#standard {
padding: 0 20px 0 20px;
}
#narrow {
padding: 0 53px 0 53px;
}
#compact {
padding: 0 95px 0 95px;
}
#wide {
padding: 0;
}
/* -------------------- Main Menu ---------------------- */
/*==============================================================================
GRC multi-level script-free pure-CSS menuing system stylesheet.
 This code is hereby placed into the public domain by its author
 Steve Gibson. It may be freely used for any purpose whatsoever.
Computed Geometries:	with a default 12px font, 1.0em == 12px and
1px == 0.08333em.
Thus, our 98px wide Freeware & Research buttons are 8.166666em wide.
http://www.grc.com/menudemo.htm
==============================================================================*/
/*================= STYLES FOR THE MASTHEAD & CONTROLS ==================*/
.menuminwidth0 {/* for all browsers (non-IE) that obey min-width */
position:relative;
border:0;
margin:0;
padding:0;
width:100%;
height:83px;  /* 68px masthead height + 15px button height + 1px lower border*/
min-width:560px;
}
/* suppress our whole menu when not an interactive mode (when printing, etc.) */
@media print, projection { .menuminwidth0 { d\isplay:none; } }

* html .menuminwidth1 {/* this allows IE5/6 to simulate min-width capability */
position:relative; /* we can simulate a minimum width by creating a large */
float:left; /* border in this first div, then placing our content */
height: 1px;/* into a second nested div (see 2nd nested div next */
/*border-left:560px solid #AAA;*/ /* CSS box-model borders are a fixed size */
}
* html .menuminwidth2 {/* used to simulate min-width capability for IE5/6 */
position:relative;
margin-left:-560px;
height: 1px;
}
#masthead {
position:relative;/* position our child objects relative to this div */
float:left;
vertical-align:top;/* protect from super-large user text sizing */
/*border-right: 1px solid #AAA;*/ /* match html */
/*border-left: 1px solid #AAA;*//* match html */
margin:5px;
width:100%;/* grey-fill the entire width */
height:68px;/* set the overall height above the menu-bar */
width: 730px;
text-align: left;
padding: 5px 10px 2px 0px;
background:#FFF; /* white */
}
#masthead-wide {
position:relative;/* position our child objects relative to this div */
float:left;
vertical-align:top;/* protect from super-large user text sizing */
/*border-right: 1px solid #AAA;*//* match masthead */
/*border-left: 1px solid #AAA;*//* match masthead */
margin:5px;
width:100%;/* grey-fill the entire width */
height:68px;/* set the overall height above the menu-bar */
width: 862px;
text-align: left;
padding: 5px 10px 2px 0px;
background:#FFF; /* white */
}
#masthead a:hover,
#masthead-wide a:hover {
background:#FFF; /* white */
}
#masthead h1,
#masthead-wide h1 {
/*color:#FFF; *//* match body text color */
/*color:#000; *//* match body text color */
font-weight: bold;
font-size: 1.5em;
font-style:italic;
}
#masthead h5,
#masthead-wide h5 {
/*color:#FFF; *//* match body text color */
/*color:#000; *//* match body text color */
font-size: 1.25em;
}
#masthead img, 
#masthead li,
#masthead-wide img{
border: none; /* Removes link line from images */
padding: 0px;
margin: 0px;
}
.tagline {
padding:0;
border: 0;
margin: 0;
font-weight: bold;
text-align: right;
list-style-type:none;
}
 /*========================= TOP OF THE MENU CASCADE =========================*/
.menu {
position:relative;/* establish a menu-relative positioning context */
float:left; /* play nicely with others */
margin: 0;
padding:0;
/*border-right: 1px solid #AAA;*/ /* match page-wrap color */
/*border-left: 1px solid #AAA; *//* match page-wrap color */
text-align: left;
height:20px; /* the menu's overall height */
width:100%; /* we always want our menu to fill the available space */
background: #6fcee8;
font-size: 1em;/* this (and also below) sets the menu's font size */
/*border-top:1px solid #000;*//* give us a black border above */
/*border-bottom:1px solid #000;*//* give us a black border underneath */
}
.menu ul {
padding:0;
margin:0;
border:0;
list-style-type:none;/* we don't want to view the list as a list */
line-height:1.5em;/* globally set the menu's item spacing. note */
}                         /* this must be 1.0 or 1.5 or 2.0 for Mozilla */
.menu li {
float:left; /* this creates the side-by-side array of top-level buttons */
position:relative; /* create local positioning contexts for each button */
margin:0;
}
.menu ul li table {
margin:-1px 0;/* IE5 needs -1px top and bottom table margins */
m\argin:0; /* re-zero the table margins for everyone but IE5 */
border-collapse:collapse; /* IE5 needs this for the sub-menus to work */
font-size:1em; /* this sets the base font size for our entire menu */
}
.drop {
display:block;
padding:0px 0.33em;/* this sets the l/r margins for our menu item */
margin:0;
text-align:right;/* this right alignment goes with the float:left below */
cursor:pointer;/* IE tries to switch back to an I-beam, don't let it */
cursor:hand;/* IE5 only knows about "hand", so set it both ways */
}
.drop span {  /* this simultaneously left and right aligns the text and */
float:left;/* the >> in the drop-down menus which link to sub-menus */
}
/*======================== TOP LEVEL MENU DEFINITIONS ========================*/
.menu ul li ul {
display:none;* initially hide the entire list hierarchy */
padding:1px;/* this is our box border width */
}
.menu ul li a,
.menu ul li a:visited {/* unselected top-level menu items */
display:block;
float:left;
text-decoration:none;
font-weight: normal;   /* must override global links (bold) */
height:20px;
}
/*======================== 2ND LEVEL MENU DEFINITIONS ========================*/
.menu ul li:hover ul,
.menu ul li a:hover ul { /* 2nd level drop-down box */
display:block;
position:absolute;
margin:0;
top:20px;  /* place us just up underneath the top-level images */
left:-1px; /* left-align our drop-down to the previous button border */
height:auto; /* the drop-down height will be determiend by line count */
width:15em;
color:#000;/* this sets the unselected-text color */
background:#000; /* this sets our menu's effective "border" color */
/*border:1px solid #000;*//* give us a black border underneath */
}
.menu ul li:hover ul.leftbutton,
.menu ul li a:hover ul.leftbutton {/* our first dropdown should not be skewed */
left:0px;
}
.menu ul li:hover ul.skinny,
.menu ul li a:hover ul.skinny {/* 2nd level skinny drop-down box */
width:8.08333em;   /* with a 12px default font, this is 97px width (97/12) */
}
.menu ul.rightmenu li:hover ul,
.menu ul.rightmenu li a:hover ul {  /* 2nd level neighborhood drop-down box */
left:auto;
right:0; /* nudge the right menu right to line up under the border */
}
* html .menu ul.rightmenu li a:hover ul {  /* IE5/6 needs a tweak here */
right:-1px;
}
.menu ul li:hover ul li a,
.menu ul li a:hover ul li a {/* 2nd level unselected items */
border:0;
margin:0;
padding:0;
font-weight:normal;
height:auto;
color:#000; /* this sets the unselected drop-down text color */
background:#4C9DBB;/* this sets the drop-down menu background color */
width:15em;
}
.menu ul li:hover ul li:hover a,
.menu ul li a:hover ul li a:hover {     /* 2nd level selected item */
color:#000;
background: #CCC; /* highlight color when hover over menu item */
}
.menu ul li:hover ul.skinny li a,
.menu ul li a:hover ul.skinny li a,
.menu ul li:hover ul.skinny li a:hover,
.menu ul li a:hover ul.skinny li a:hover {/* 2nd level un+selected items */
width:8.08333em;
}
/*======================== 3RD LEVEL MENU DEFINITIONS ========================*/
.menu ul li:hover ul li ul,
.menu ul li a:hover ul li a ul {/* hide inactive 3rd-level menus */
visibility:hidden;
} 
.menu ul li:hover ul li:hover ul,
.menu ul li a:hover ul li a:hover ul {   /* 3rd level drop-down box */
visibility:visible;
position:absolute;
margin-top:-1px;/* bring the top edge of the 3rd level menu up one */
top:0;
left:8.08333em;
width:14em;
}
.menu ul li:hover ul li:hover ul li a,
.menu ul li a:hover ul li a:hover ul li a {/* 3rd level unselected items */
width:14em;
background:#E9D9C5; /* color of hover on top level menu */
}
.menu ul li:hover ul li:hover ul li a:hover,
.menu ul li a:hover ul li a:hover ul li a:hover { /* level3 selected items */
width:14em;
background:#FFF;
}
#text { /* the Mac's standard Safari browser will not see this code */
height:1.215em;#/* ...  but every other browser will and should */
} /* Safari barfs on the illegal pound sign (#) after the rule's property val */
* -------------------- Gallery ---------------------- */
#gallery {/* required as a pseudo-definition so that flash content is correctly sized*/
padding: 0; 
}
#flashcontent {
clear: both;
margin: 0;
border:0;
padding: 0;
font-size: 1 em;
height: 425px;
}
#flashcontent a:link,
#flashcontent a:hover,
#flashcontent a:visited {
text-decoration: underline;
font-weight: bold;
color: #000; /* match body text color */
}
a:link.gallery {
color: #F1F2EA;
}
a:visited.gallery {
color: #F1F2EA;
}
a:hover.gallery {
background: #E7E7D6;
}
/* --------------------Forms ---------------------- */
form {  /* set width in form, not fieldset (still takes up more room w/ fieldset width */
font:100% verdana, arial, geneva, helvetica, georgia, sans-serif;
margin: 0;
padding: 0;
text-align: left;
}
form fieldset {
/* clear: both; note that this clear causes inputs to break to left in ie5.x mac, commented out */
/*border-color: #AAA; *//* match masthead border*/
/*border-width: 1px;*/
/*border-style: solid;*/
padding: 10px;  /* padding in fieldset support spotty in IE */
margin: 0;
}
form label { 
display: block;  /* block float the labels to left column, set a width */
float: left; 
width: 150px; 
padding: 0; 
margin: 5px 0 0; /* set top margin same as form input - textarea etc. elements */
text-align: right; 
}
form input, form textarea {
/* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
width:auto;      /* set width of form elements to auto-size, otherwise watch for wrap on resize */
margin:5px 0 0 10px; /* set margin on left of form elements rather than right of
                              label aligns textarea better in IE */
}
form input#reset {
margin-left:0px; /* set margin-left back to zero on reset button (set above) */
}
textarea { overflow: auto; }
form small {
display: block;
margin: 0 0 5px 160px; /* instructions/comments left margin set to align w/ right column inputs */
padding: 1px 3px;
font-size: 88%;
}
form br {
clear:left; /* setting clear on inputs didn't work consistently, so brs added for degrade */
}
/* --------------------Tables ---------------------- */
table.breeze img {
border-style: double;
padding: 3px;
border: 5px;
}
table.breezefull {
width: 300px;
}
table.breezefull img {
padding: 3px;
border-style: double;
border: 5px;
}
table.twocol {
width: 650px;
table-layout: fixed; 
border: 0;
padding: 0;
margin-left:auto; 
margin-right:auto;
}
table.twocol tr {
height: 30px;
vertical-align: top;
}
table.twocol td {
width: 50%;
font-family: verdana, ,arial, geneva, helvetica, georgia, sans-serif;
}
table.twocol th {
font-size: 1.25em;
margin: 0;
border: 0;
padding: 0;
}
tr.taller {
height:45px;
}
table.bbrowser {
font-size:.75em;
}
table.bbrowser img{
border: none;
vertical-align:bottom; /* Prevents a gap in Opera & Netscape */
/* The W3C standard is that inline elements are aligned to the TEXT BASELINE, */
/* which is always a few px above the bottom of a table cell in order to leave some */
/* room for the descenders on letters such as "g" and "y". */
}
/* -------------------- Colors ---------------------- */
.c-accent {
color: #b41621; /* red */
}
.c-accent-two {
color:#468799; /*darker turquoise */
}
/* -------------------- Lists ---------------------- */
ul.tight ul.spread {
margin: 0em 0em 2em 4em;
padding: 0;
}
ul.tight li {
padding: 5px 0 0 20px;
list-style-type: none;
}
ul.spread li {
margin: 1em 7em 1.5em  0em;
padding: 0;
list-style-type: square;
}
.square {
list-style-type: square
}
ol {
margin: 0em 0em 2em 2em;
padding: 0;
}
/* -------------------- Images ---------------------- */
img {
border: 1px solid #888;
}
.floatright { 
float: right; 
margin: 20px 0px 10px 20px;
border: 0;
}
.floatrightflush { 
float: right; 
margin: 0px 0px 0px 0px;
border: 0;
}
.floatleftflush {
float: left;
margin: 0px 0px 0px 0px;
border: 0;
}
.floatleft { 
float: left; 
margin: 10px 20px 10px 0px;
border: 0; /* Allows border to be added by overwriting this */
}
.floatcenter {
display: block;
margin: 0 0 10px 0;
margin-left: auto;
margin-right: auto 
}

/* -------------------- Misc ---------------------- */
.center {
text-align: center;
}
.clear {
clear: both;
}
.directions {
float: right;
width: 240px;
padding: 10px 10px 0 10px;
}
.hide {
position: absolute;
left: -9999px;
top: -9999px;
}
.italic {
font-style: italic;
}
.text {
padding: 0;
margin: 0;
border: 0;
}
.tiny_text {
padding: 0;
margin: 0;
border: 0;
font-size: .75em;
}
.last {
margin: 1em 0 0 0;
}
.after-space {
margin: 0em 0em .5em 0em;
}
.big-after-space {
margin: 0em 0em 1em 0em;
}
.strong {
font-weight: bold;
}
.moveright {
padding: 0 0 0 250px;
}
.spacer-tiny {
height: 25px;
}
.spacer {
height: 50px;
}
.spacer-sm {
height: 75px;
}
.spacer-med {
height: 100px;
}
.spacer-lg {
height: 150px;
}
.hspacer {
width: 25px;
}
.wborder { /* must be last */
border: 1px solid #888; /* match image border */
}