 /* SueZooStuff css March 2008 */
/* generic selectors */

/*--note--only one body tag per page -- insert into html template--
body.wh {background-image: url(http://www.stoons.ca/gr/gr-wh05.jpg);}
body.pe {background-image: url(http://www.stoons.ca/gr/gr-pe05.jpg);}
---*/
/* ----------------------------------------------------------------------- */
/* division styles */
div.c { text-align: center; padding: 0.5em; }
div.l { text-align: left; padding: 0.5em; }
/* ----------------------------------------------------------------------- */
/* ----------------------------------------------------------------------- */
/* paragraph styles */
/* main paragraph styles */
p.wh { color: #606060; text-indent: 0.5cm; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: normal; font-size: 1em; padding: 0.5em;}
p.pe { color: #983e30; text-indent: 0.5cm; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: normal; font-size: 1em; padding: 0.5em;}
/* ----------------------------------------------------------------------- */
/* tiny-copyright paragraph styles */
p.tinywh { color: #606060 font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: normal; font-size: 0.8em; padding: 0.5em;}
p.tinype { color: #983e30; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: normal; font-size: 0.8em; padding: 0.5em;}
/* ----------------------------------------------------------------------- */
/* main NAVIGATION  NAV1 paragraph style */
p.nav1wh { color: #606060 font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: bold; font-size: 1em; border: 0; padding: 5px; background-image: url(http://www.stoons.ca/gr/gr-wh02.jpg)}
p.nav1pe { color: #983e30; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: bold; font-size: 1em; border: 0; padding: 5px; background-image: url(http://www.stoons.ca/gr/gr-pe02.jpg)}
/* ----------------------------------------------------------------------- */
/* secondary NAVIGATION NAV2 paragraph styles */
p.nav2wh { text-align: center; border: #c0c0c0 2px outset; padding: 2px; font-size: 1em; color: #606060; background-image: url(http://www.stoons.ca/gr/gr-wh01.jpg);}
p.nav2pe { text-align: center; border: #feefea 2px outset; padding: 2px; font-size: 1em; color: #983e30; background-image: url(http://www.stoons.ca/gr/gr-pe01.jpg);}
/* ----------------------------------------------------------------------- */
/* ----------------------------------------------------------------------- */
/* heading styles*/
/* heading 1 */
h1.wh {color: #808080; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: bold; text-transform: uppercase; font-size: 1.2em; border-bottom: 3px double #808080;}
h1.pe {color: #983e30; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: bold; text-transform: uppercase; font-size: 1.2em; border-bottom: 3px double #983e30;}

/* heading 2 */
h2.wh {color: #808080; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: bold; font-size: 1.2em; border-bottom: 3px double #808080;}
h2.pe {color: #983e30; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: bold; font-size: 1.2em; border-bottom: 3px double #983e30;}

/* heading 3 call farm - red - important--*/
h3 {color: #88010b; border-top: 3px double #b6010f; padding: 5px; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-size: 1.2em; text-align: center; border-bottom: 3px double #b6010f;}

/* heading 4 -- list heading  */
h4.wh { color: #808080; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; text-align: left; font-size: 1em; padding: 0px; text-indent: 0.5cm;}
h4.pe { color: #983e30; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; text-align: left; font-size: 1em; padding: 0px; text-indent: 0.5cm;}

/* ----------------------------------------------------------------------- */
/* list styles*/
/* generic list*/
li.wh { list-style-type: disc; text-indent: 1cm; text-align: left; color: #808080; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: normal; font-size: 1em;}
li.pe { list-style-type: disc; text-indent: 1cm; text-align: left; color: #983e30; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: normal; font-size: 1em;}

/* ----------------------------------------------------------------------- */
 /* link styles*/
 /*  wh text color #606060 -- pe text color #983e30 */
/* ----------------------------------------------------------------------- */
/* peach generic links*/
a.pe:link { color: #983e30; background-color: transparent;}
a.pe:visited { color: #B26E64; background-color: transparent;}
a.pe:hover { color: #606060; background-color: transparent;}
a.pe:active { color: #983e30; background-color: transparent;}

/* white generic links*/
a.wh:link { color: #606060; background-color: transparent;}
a.wh:visited { color: #808080; background-color: transparent;}
a.wh:hover { color: #983e30; background-color: transparent;}
a.wh:active { color: #606060; background-color: transparent;}
/* ----------------------------------------------------------------------- */
/* tiny peach graphics links*/
a.tinype:link { font-size: 0.8em; color: #983e30; background-color: transparent;}
a.tinype:visited { font-size: 0.8em; color: #B26E64; background-color: transparent;}
a.tinype:hover { font-size: 0.8em; color: #606060; background-color: transparent;}
a.tinype:active { font-size: 0.8em; color: #983e30; background-color: transparent;}

/* tiny white graphics links*/
a.tinywh:link { font-size: 0.8em; color: #606060; background-color: transparent;}
a.tinywh:visited { font-size: 0.8em; color: #808080; background-color: transparent;}
a.tinywh:hover { font-size: 0.8em; color: #983e30; background-color: transparent;}
a.tinywh:active { font-size: 0.8em; color: #606060; background-color: transparent;}
/* ----------------------------------------------------------------------- */
/* ----------------------------------------------------------------------- */
 /* -reminder- p.nav1pe { color: #983e30; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: bold; font-size: 1em; border: 0; padding: 5px; background-image: url(http://www.stoons.ca/gr/gr-pe01.jpg)} -reminder- */
/* main NAV1 PEACH links */
/* NAV1 PEACH link */
a.nav1pe:link { padding: 6px; color: #983e30; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: bold; font-size: 1em; background-image: url(http://www.stoons.ca/gr/gr-pe02.jpg);}
/* visited NAV1 PEACH link */
a.nav1pe:visited { padding: 6px; color: #B26E64; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: bold; font-size: 1em; background-image: url(http://www.stoons.ca/gr/gr-pe02.jpg);}
/* hover NAV1 PEACH link */
a.nav1pe:hover { padding: 6px; color: #606060; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: bold; font-size: 1em; background-image: url(http://www.stoons.ca/gr/gr-pe02.jpg);}
/* active NAV1 PEACH link */
a.nav1pe:active { padding: 6px; color: #983e30; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: bold; font-size: 1em; background-image: url(http://www.stoons.ca/gr/gr-pe02.jpg);}
/* ----------------------------------------------------------------------- */
 /* -reminder- p.nav1wh { color: #606060 font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: bold; font-size: 1em; border: 0; padding: 5px; background-image: url(http://www.stoons.ca/gr/gr-wh02.jpg)} -reminder- */
 /* ----------------------------------------------------------------------- */
/* main NAV1 WHITE link*/
/* NAV1 WHITE link */
a.nav1wh:link { padding: 6px; color: #606060; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: bold; font-size: 1em; background-image: url(http://www.stoons.ca/gr/gr-wh02.jpg);}
/* visited NAV1 WHITE link */
a.nav1wh:visited { color: #808080; padding: 6px; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: bold; font-size: 1em; background-image: url(http://www.stoons.ca/gr/gr-wh02.jpg);}
/* hover NAV1 WHITE link*/
a.nav1wh:hover { color: #983e30; padding: 6px; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: bold; font-size: 1em; background-image: url(http://www.stoons.ca/gr/gr-wh02.jpg);}
/* active NAV1 WHITE link */
a.nav1wh:active { color: #606060; padding: 6px; font-family: "Trebuchet MS", Arial, Verdana, Helvetica, "sans-serif"; font-weight: bold; font-size: 1em; background-image: url(http://www.stoons.ca/gr/gr-wh02.jpg);}
/* ----------------------------------------------------------------------- */
/* ----------------------------------------------------------------------- */
/* -reminder- secondary NAVIGATION NAV2 paragraph styles -reminder- */
/*-reminder- p.nav2pe { text-align: center; border: #feefea 2px outset; padding: 2px; font-size: 1em; color: #983e30; background-image: url(http://www.stoons.ca/gr/gr-pe01.jpg);}  -reminder- */
/* ----------------------------------------------------------------------- */
/* Secondary NAV2 PEACH links*/
/* NAV2 PEACH link */
a.nav2pe:link { color: #983e30; padding: 2px; font-weight: bold; font-size: 1em;  background-image: url(http://www.stoons.ca/gr/gr-pe01.jpg);}
/* visited NAV2 PEACH link */
a.nav2pe:visited { color: #B26E64; padding: 2px; font-weight: bold; font-size: 1em;  background-image: url(http://www.stoons.ca/gr/gr-pe01.jpg);}
/* hover NAV2 PEACH link */
a.nav2pe:hover { color: #606060; padding: 2px; font-weight: bold; font-size: 1em;  background-image: url(http://www.stoons.ca/gr/gr-pe01.jpg);}
/* active NAV2 PEACH link */
a.nav2pe:active { color: #983e30; padding: 2px; font-weight: bold; font-size: 1em;  background-image: url(http://www.stoons.ca/gr/gr-pe01.jpg);}

/* ----------------------------------------------------------------------- */
/* -reminder- secondary NAVIGATION NAV2 paragraph styles -reminder- */
/* -reminder- p.nav2wh p.nav2wh { text-align: center; border: #c0c0c0 2px outset; padding: 2px; font-size: 1em; color: #606060; background-image: url(http://www.stoons.ca/gr/gr-wh01.jpg);}  -reminder- */
/* ----------------------------------------------------------------------- */
/* Secondary NAV2 WHITE links*/
/* NAV2 WHITE link */

a.nav2wh:link { color: #606060; padding: 2px; font-weight: bold; font-size: 1em;  background-image: url(http://www.stoons.ca/gr/gr-wh01.jpg);}
/* visited NAV2 WHITE link */
a.nav2wh:visited { color: #808080; padding: 2px; font-weight: bold; font-size: 1em;  background-image: url(http://www.stoons.ca/gr/gr-wh01.jpg);}
/* hover NAV2 WHITE link*/
a.nav2wh:hover { color: #983e30; padding: 2px; font-weight: bold; font-size: 1em;  background-image: url(http://www.stoons.ca/gr/gr-wh01.jpg);}
/* active NAV2 WHITE link */
a.nav2wh:active { color: #606060; padding: 2px; font-weight: bold; font-size: 1em;  background-image: url(http://www.stoons.ca/gr/gr-wh01.jpg);}
/* ----------------------------------------------------------------------- */
/* ----------------------------------------------------------------------- */
 /* horizontal rules */
 /* mozilla-based browsers color the rule using background-color */
 /* reference CSS Anthology page 43 */
hr.wh { background-color: #808080; color: #808080; width: 75%;}
hr.pe { background-color: #c57f72; color: #c57f72; width: 75%;}
/* ----------------------------------------------------------------------- */

/*---- id's ----*/
/*--note: critical--space btwn curly bracket and "p" in position---*/

/*first division corner graphics*/
#wh1 { position: absolute; left: 10px; top: 10px; width 110px; text-align: center; vertical align: middle; border: #606060 2px solid; padding: 5px; background-image: url(http://www.stoons.ca/gr/gr-wh03.jpg);}
#pe1 { position: absolute; left: 10px; top: 10px; width 110px; text-align: center; vertical align: middle; border: #983e30 2px solid; padding: 5px; background-image: url(http://www.stoons.ca/gr/gr-pe03.jpg);}

/*2nd division heading images*/
#wh2 { position: absolute; left: 150px; top: 10px; width: 680px; text-align: center; vertical align: middle; height: 140px; border: #606060 2px solid; padding: 5px; background-image: url(http://www.stoons.ca/gr/gr-wh02.jpg);}
#pe2 { position: absolute; left: 150px; top: 10px; width: 680px; text-align: center; vertical align: middle; height: 140px; border: #983e30 2px solid; padding: 5px; background-image: url(http://www.stoons.ca/gr/gr-pe02.jpg);}

/* 3rd division main nav style */
#wh3  {position: absolute; z-index: 1; left: 10px; top: 145px; width 110px; border: #606060 2px solid; padding: 15px; background-image: url(http://www.stoons.ca/gr/gr-wh03.jpg)}
#pe3  {position: absolute; z-index: 1; left: 10px; top: 145px; width 110px; border: #983e30 2px solid; padding: 15px; background-image: url(http://www.stoons.ca/gr/gr-pe03.jpg)}

/* 4th division content style */
#wh4 { position: absolute; left: 150px; top: 145px; width: 680px; padding: 5px height: 600px; border: #808080 2px solid; background-image: url(http://www.stoons.ca/gr/gr-wh01.jpg)}
#pe4 { position: absolute; left: 150px; top: 145px; width: 680px: padding: 5px height: 600px; border: #983e30 2px solid; background-image: url(http://www.stoons.ca/gr/gr-pe01.jpg)}