.no_css { display: none; }

.highlight { color: red; }
.bg_reverse { background-color: #BBBBFF; }
.iconic_text { font-size: 150%; color: #303498; vertical-align: middle; }

BODY
{
  font-family: "Arial", "Helvetica";
  color: #000000;
  margin: 0;
  padding: 0;
  background-color: #FFFFFF;
  height: 100%;
}

html { height: 100%; }		/* HTML and BODY both need to be 100% height to allow footer at bootom for IE. */

EM { color: #303498; font-weight: bold; font-size: 115%; font-style: normal; }
EM.soft { color: #9090A0; font-size: 90%; }
EM.note { color: #9090A0; font-size: 80%; font-style: italic; }
EM.medium { color: #404050; font-size: 80%; font-style: italic; }

code
{
  font-size: 115%;
  font-weight: bold;
  color:#000080;
}

SPAN.small { font-size:70%; }
SPAN.smaller { font-size:55%; }
SPAN.small_note { font-size:70%; font-style: normal;}
SPAN.big { font-size: 125%; font-weight: bold; color: #303458; }
SPAN.big_banner { font-size: 125%; font-weight: bold; color: #303458; background-color: #BCCBD0; padding: 0 .3em; }
SPAN.info_text { font-size: 115%; font-weight: bold; color: #475B76; }
SPAN.back_order { color:#FF0000; font-size:90%; font-weight: bold; background-color:#550000; }
.fluo { color: #305000; background-color: #CF5; }

P.big { font-size: 125%; font-weight: bold; }

TD, P, OL, DL {font-family: "Arial", "Helvetica";}

P#list { padding: .3em 2.3em; text-indent: -2.0em; }	/* Does not work as a class. */

tr.hilite { background-color: #E0E0E8; }
tr.hilite:hover { background-color: #FFFFEE; }

.filename
{
  font-size: 110%;
  font-weight: bold;
  color: #FFF;
  background-color: #00B;
  padding: 0 .3em;
}

.window_name
{
  font-size: 110%;
  font-weight: bold;
  color: #F8F8FF;
  background-color: #77B;
  padding: .1em .3em .2em .3em;
}

kbd, kbd.min
{

  font-family: "Tahoma", "Verdana", "Arial";
  font-weight: bold;
  padding: 0 .1em;
  border-width: .13em .2em;
  border-style: solid;
  border-color: #cbb #A99 #877 #ccb;
  background: #DDDDDD;
  color: #000;
}

kbd.min { padding: 0 .3em; }				/* Used for very narrow keycaps, such as "i" or "1". */

A, a:link, a:visited, a:hover, a:active
{
  font: 100% Arial;
  color: #000000;
  font-weight: bold;
  padding-left: .1em;
  padding-right: .1em;
  text-decoration: none;
  border-bottom: .04em solid #777788;
}

A:hover
{
  color: #000000;
  background: #D0D0E0;
  border-bottom: .1em solid #444455;
}

/* Kludges like this are always for IE; a class *must* be used to disable underlining image links. */
/* Completely disable link display and instead use IMG to provide feedback. */
A.im, a.im:link, a.im:visited, a.im:active
 { border: 0 none; padding: 0; margin: 0; text-decoration: none; }

/* This doesn't work on IE5...
 .im IMG { padding: 0; margin: .2em; border: 0; }
A.im:hover IMG { border: .2em solid #00CC00; padding: 0; margin: 0; text-decoration: none;}
*/

A.im IMG { border: .2em solid #E0E0F0; }
A.im:hover { background-color: transparent; }
A.im:hover IMG { border-color: #00CC00; }


p.hr { font: bold 20%/.1 Arial, Helvetica, sans-serif; border-bottom: .1em dashed #D0D0E0; }	/* For within .box, where hr is unusable. */


HR.big
{
  margin-top: .9em;
  margin-bottom: .8em;
  color: #B0B0C0;
  background-color: #B0ACDF;
  height: .1em;
  width: 85%;
  border: none;
}

SUP
{
  font-size: 75%;
}


.footnote { color: #565C7D; font-size: 80%; font-style: italic; }
.ul_bullet { margin: 0 .5em; color: #AAA; }		/* Great with &#9658. */
.ul_bullet_green { margin: 0 .5em; color: #7EB57E; }
.ul_bullet_blue { margin: 0 .5em; color: #97ABC6; }
.bullet { margin: 0 .5em; color: #8AC; }		/* Great with &#9658. */

input, textarea
{
  color:#000000;
  background-color:#FFFFEE;
  border-color:#99A;
  border-width:small;
  border-style:dotted;
  text-align:left;
  padding:.1em .2em;
  font-family:Arial;
  font-size:16px;
  font-weight:bold;
}

input:focus, textarea:focus
{
  background-color: #FFFFA0;	/* #DDFFDD */
  border-style: solid;
}

input.numeric { text-align:right; }


.bare
{
  color:#000000;
  border-style:none;
  border-width:0;
}

.container
{
  border-style: none;
  border-collapse: collapse;
  border: 0;
  padding: 0;
  margin: 0;
  text-align: left;
}

table.container tr td
{
  vertical-align:top;
  border:0;
  border-style: none;
}


table.footer_info
{
  background-color: #F8F8FF;
  border: 0;
  border-top: .05em solid;
  border-color: #A0A8B8;
  padding: 0;
}


table.info, table.info_bare
{
  border-collapse: collapse;
  border: .05em solid;
  border-color: #606888;
  padding: 0;
  margin: 0;
  background-color: #FFFBEA;
}

table.info td
{
  border: .05em solid;
  border-color: #A0A8B8;
  border-collapse: collapse;
  border-style: solid;
  padding: .2em;
  vertical-align:middle;
}

table.info td p { margin-bottom: .5em; }

table.info_bare td
{
  border: 0;
  padding: .2em;
  vertical-align:middle;
}

table.info td.header
{
  border-style: solid;
  color: #325;
  background-color: #C4C4D4;
  font-size: 120%;
  font-weight: bold;
  font-family: "Verdana", "Arial", "Helvetica";
}

td.side
{
  vertical-align:middle;
  color: #FFFFFF;
  background-color:#444466;
  text-align: right;
  font-size: 120%;
  font-family: "Verdana", "Arial", "Helvetica";
}

td.side_field
{
  vertical-align:middle;
  color: #222222;
  background-color: #CCCCDD;
  text-align: right;
  font-family: "Verdana", "Arial", "Helvetica";
}

td.side_non_edit
{
  vertical-align:middle;
  color: #222222;
  background-color: #DDDDE4;
  text-align: right;
  font-family: "Verdana", "Arial", "Helvetica";
}

td.banner
{
  vertical-align:middle;
  color: #FFFFFF;
  background-color: #555566;
  font-size: 120%;
  font-weight: bold;
  font-family: "Verdana", "Arial", "Helvetica";
  padding-top: .2em;
  padding-bottom: .2em;
}

tr.banner_gray
{
  vertical-align:middle;
  color: #FFFFFF;
  background-color: #333333;
  font-size: 120%;
  font-weight: bold;
  font-family: "Verdana", "Arial", "Helvetica";
  padding-top: .2em;
  padding-bottom: .2em;
}


td.side A { color: #FFF; }
td.side A:hover { color: #FFF; background: #202020; }

td.hard { color: #303498; font-weight: bold; }

.txr
{
  color:#000000;
  border-style:none;
  border-width:0;
  text-align:right;
  padding:.1em;
  font-family: "Courier New", "Courier", "monospace";
}

.txl
{
  color:#000000;
  border-style:none;
  border-width:0;
  padding:.1em;
  font-family: "Arial", "Helvetica";
}

.txg
{
  color:#000000;
  background:#DDDDE4;
  border-style:none;
  border-width:0;
  text-align:right;
  padding:.1em;
  font-family: "Courier New", "Courier", "monospace";
}



.sitemap { font-size: 125%; }

.sitemap a, .sitemap a:visited, .sitemap a:hover, .sitemap a:active
{
  text-decoration: none;
  border: 0;
  color: none;
  background: none;
  display: block;
  width: 100%;
}

.sitemap a:visited { color: #606070;  text-decoration: line-through; border: 0; }
.sitemap a:hover { background: #FFDD50; border: 0;}
.sitemap li { list-style: decimal none outside; margin-left: 1em; padding: 0; }
.sitemap ol { font-size: 90%; font-weight: bold; }		/* Bold digits. */

.sitemap li ol
{
  margin-left: -.4em;
  border-style: solid;
  border-color: #C0CCC4;
  border-width: 0;
  border-left-width: .1em;
  border-bottom-width: .3em;
  padding-bottom: .4em;
  margin-bottom: .4em;
  padding-left: 1.2em;
}

.sitemap li ol li ol { border-left-width: .1em; border-bottom-width: .2em; }


/*=====================================*/
/* Another IE bug; if using class instead of ID's, display fails randomly. */
#menu_tabs
{
  font-size: 93%;
  float: left;
  width: 100%;
  line-height: normal;
}

#menu_tabs UL
{
  padding: 0;
  margin: 0;
  list-style-type: none;
}

#menu_tabs LI
{
  padding: 0;
  display: inline;
  list-style: none outside none;
}

#menu_tabs A { float: left; text-decoration: none; margin-right: -0.1em; border: 0; }
#menu_tabs A:hover { background-color: transparent; }
#menu_tabs A:hover SPAN { color: #333; }

#menu_tabs A SPAN
{
  display: block;
  float: left;
  color: #556;
  font-weight: bold;
  padding: .3em 0 4px 0;
}

/* To force the line to appear "under" *all* tabs when there is no "current" tab. */
#menu_tabs .no_current
{
  float: left;
  padding-bottom: 1px;
}


#menu_tabs A SPAN.L
{
  background: url(tabs.gif) no-repeat left top;
  padding-left: 8px;	/* Do NOT use EM or % because a spurious rounding error occurs in FF at some font sizes. */
  white-space: nowrap;
}

#menu_tabs A SPAN.R
{
  background: url(tabs.gif) no-repeat right top;
  padding-right: 8px;
}

#menu_tabs .current A SPAN { padding-bottom: 5px; }
#menu_tabs .current A SPAN.L, #menu_tabs .current A SPAN.R
{
  color: #000;
  padding-bottom: 5px;
}

#menu_tabs .current A SPAN.L, #menu_tabs A:hover SPAN.L { background-position: left -150px; }
#menu_tabs .current A SPAN.R, #menu_tabs A:hover SPAN.R { background-position: right -150px; }


/*	Links looking like 3d buttons */
a.d3, a:visited.d3, a:hover.d3, a:active.d3
{
/*  display: block; float: left; */
  display: inline;
  text-decoration: none;
  font-weight: bold;
  text-align: center;
  padding: .1em .8em;
  border-style: solid;
  border-width: .16em;
  margin: .1em;
  white-space: nowrap;
}

a.d3, a:visited.d3, a:active.d3
{
  color: #4A4A53;
  background-color: #BBBBBB;
  border-color: #E8E8F8 #AAAABA #AAAABA #E8E8F8;
}

a:hover.d3
{
  color: #000000;
  background-color: #CCCCEE;
/*  border-color: #F8F8FF #BBBBCC #BBBBCC #F8F8FF; */
  text-decoration: underline;
}


input.d3
{
/*  display: block; float: left; */
  display: inline;
  text-decoration: none;
  font-weight: bold;
  text-align: center;
  padding: .1em .8em;
  border-style: solid;
  border-width: .16em;
  margin: .1em;
  white-space: nowrap;

  color: #4A4A53;
  background-color: #BBBBBB;
  border-color: #E8E8F8 #AAAABA #AAAABA #E8E8F8;
}


input:hover.d3
{
  color: #000000;
  background-color: #CCCCEE;
}


.inputsubmit
{
  display: inline;
  text-decoration: none;
  font-weight: bold;
  text-align: center;
  padding: .1em .8em;
  border-style: solid;
  border-width: .16em;
  margin: .1em;
  white-space: nowrap;

  color: #4A4A53;
  background-color: #BBBBBB;
  border-color: #E8E8F8 #AAAABA #AAAABA #E8E8F8;
}


.inputsubmit:hover
{
  color: #000000;
  background-color: #CCCCEE;
}




.slide_top_left, .slide_top_right, .slide_bottom_left, .slide_bottom_right
{
  border-color:#FFFFFF;
  border-style: solid;
  border-width:0;
}

.slide_top_left
{
  background: url(header.gif) #D7E4E9 left bottom no-repeat;
  padding-left: .5em;
  border-left-width: .3em;
}
.slide_top_right
{
  background: url(header.gif) #D7E4E9 right bottom no-repeat;
  border-right-width: .3em;
}

.slide_bottom_left
{
  background: url(header.gif) #D7E4E9 left top no-repeat;
  padding-left: .5em;
  border-left-width: .3em;
}
.slide_bottom_right
{
  background: url(header.gif) #D7E4E9 right top no-repeat;
  padding-right: .3em;
  border-right-width: .3em;
}




/* Advantages of this box:
   Cross-browser, no script, scalable, only 2 bitmaps, round corners, shadow,
   multiple background colors for "caption" & body.

   Disadvantages: Clunky use for web designer.
*/

.box			/* Right edge. */
{
  text-align: left;	/* Mandatory! To allow CENTER tag on whole box; auto margins don't work in most IE versions... */
  padding:0 12px 0 0;
  background:url(borders.png) 100% 1024px repeat-y;
  margin-bottom: .5em;
}

.box .b1, .box .b1_2, .box .b1_3, .box .b1_4, .box .b1_5		/* Left edge. */
{
  padding:0 0 0 12px;
  background:url(borders.png) 0px 0 repeat-y;	/* To change inner box background color, style that div background-color. */
}

.box .b2		/* Top mid & right */
{
  height:17px;
  margin:0 -12px;
  background:url(box.gif) 100% 0 no-repeat;
}

.box .b2 div	/* Top left */
{
  width:18px;
  height:17px;
  background:url(box.gif) 0 0 no-repeat;
}

.box .b3		/* Bottom mid & right */
{
  margin:0 -12px;
  background:url(box.gif) 100% 100% no-repeat;
}

.box .b3 div		/* Bottom left. */
{
  font-size: 10%;	/* IE does not honor height if smaller than font. */
  width:18px;
  height:14px;
  background:url(box.gif) 0 100% no-repeat;
}

/* Insure body text background is opaque to hide unwanted borders portions. */
/* Also sets background color of entire text body. */
.box body, .box p
{
  margin:0;
  padding: .5em .3em;
}



/* inherit would be cleaner, smaller, more useful, but as usual IE fails. */

.box .b1   { background-color: #EEEEFF; }
.box .b1_2 { background-color: #F8FCF8; }
.box .b1_3 { background-color: #F0F8F0; }
.box .b1_4 { background-color: #FFE0E0; }
.box .b1_5 { background-color: #FCF4F2; }



.box center { background-color:inherit; }

.box h1, .box h2, .box h3, .box h4, .box h5
{
  margin: 0;
  padding: 0.3em 0.3em;
  font: bold 120%/1 Arial, Helvetica, sans-serif;
}

.box h1 { color: #475B76; background: #D3DAEF; background-image:url(band.jpg); background-repeat: repeat-x; background-position: 0px top; }					/* Light-blue normal box. */
.box h2 { background: #C1D1C1; background-image:url(band.jpg); background-repeat: repeat-x; background-position: 0px center; }					/* Orange normal box. */
.box h3 { color: #305000; background: #D0F0C8; background-image:url(band.jpg); background-repeat: repeat-x; background-position: 0px bottom; }	/* Green strong highlight. */
.box h4 { background: #FF8383; }					/* Red strongest highlight. */
.box h5 { color: #432; background: #BA9; }			/* Light beige, very low key. */

.box li
{
  margin:0 0 0 2em;
  padding:0;
}


/*========= Here are variations for fluo background =========*/
.boxf			/* Right edge. */
{
  text-align: left;	/* Mandatory! To allow CENTER tag on whole box; auto margins don't work in most IE versions... */
  padding:0 12px 0 0;
  background:url(borders-fluo.png) 100% 1024px repeat-y;
  margin-bottom: .5em;
}

.boxf .b1, .boxf .b1_2, .boxf .b1_3, .boxf .b1_4, .boxf .b1_5		/* Left edge. */
{
  padding:0 0 0 12px;
  background:url(borders-fluo.png) 0 0 repeat-y;	/* To change inner box background color, style that div background-color. */
}

.boxf .b2		/* Top mid & right */
{
  height:17px;
  margin:0 -12px;
  background:url(box-fluo.gif) 100% 0 no-repeat;
}

.boxf .b2 div	/* Top left */
{
  width:18px;
  height:17px;
  background:url(box-fluo.gif) 0 0 no-repeat;
}

.boxf .b3		/* Bottom mid & right */
{
  margin:0 -12px;
  background:url(box-fluo.gif) 100% 100% no-repeat;
}

.boxf .b3 div		/* Bottom left. */
{
  font-size: 10%;	/* IE does not honor height if smaller than font. */
  width:18px;
  height:14px;
  background:url(box-fluo.gif) 0 100% no-repeat;
}

.boxf body, .boxf p
{
  margin:0;
  padding:.5em .3em;
}

/* inherit would be cleaner, smaller, more useful, but as usual IE fails. */
.boxf .b1,   .boxf .b1 p { background-color: #EEEEFF; }
.boxf .b1_2, .boxf .b1_2 p { background-color: #E7FF94; }
.boxf .b1_3, .boxf .b1_3 p { background-color: #F0F8F0; }
.boxf .b1_4, .boxf .b1_4 p { background-color: #FFE0E0; }
.boxf .b1_5, .boxf .b1_5 p { background-color: #FCF4F2; }

.boxf center { background-color:inherit; }

.boxf h1, .boxf h2, .boxf h3, .boxf h4, .boxf h5
{
  margin: 0;
  padding: 0.3em 0.3em;
  font: bold 120%/1 Arial, Helvetica, sans-serif;
}

.boxf h1 { color: #243; background: #C6E73A; }
.boxf h2 { background: #C1D1C1; background-image:url(band.jpg); background-repeat: repeat-x; background-position: 0px center; }					/* Orange normal box. */
.boxf h3 { color: #305000; background: #D0F0C8; background-image:url(band.jpg); background-repeat: repeat-x; background-position: 0px bottom; }	/* Green strong highlight. */
.boxf h4 { background: #FF8383; }					/* Red strongest highlight. */
.boxf h5 { color: #432; background: #BA9; }			/* Light beige, very low key. */

.boxf li
{
  margin:0 0 0 2em;
  padding:0;
}



/*=================== VERTICAL sub-menu ===================*/

.v_menu
{
  width: 13em;
  margin: .5em;
}

.v_menu li a
{
  margin-right: 1em;
  list-style: decimal none outside;
  height: 1.3em;		/* Necessary for IE. */
  text-decoration: none;
  padding: .2em .5em .2em .5em;
  border-top: .1em solid #FFFFFF;
  border-bottom: .1em solid #FFFFFF;
  display: block;
  color: #666;
  background: #D8D8D8 url(v_menu_1.gif) right center no-repeat;
}

.v_menu li a:visited
{
  padding-left: .5em;
  border-bottom: .1em solid #FFFFFF;
}

.v_menu .current A, .v_menu li a:hover, .v_menu li a:active
{
  margin-right: .5em;
  color: #333;
  background: #C3C3C3 url(v_menu_2.gif) right center no-repeat;
  border-bottom: .1em solid #FFFFFF;
}

.v_menu .current A
{
  padding-top: .5em;
  padding-bottom: .5em;
}

.v_menu ul
{
  list-style: none;
  margin: 0;
  padding: 0;
}