/*  FoxFire Studios of Saint Louis */
/*  Main Cascading Style Sheet     */
/*  © 2004 David Gonterman         */

/*  Section One:  The actual HTML Tag styles */

body {
  background: url(http://foxfirestudios.net/images/brushedaluminum.gif);
  font-family:  Verdana, Arial, Helvetica, sans-serif;
  font-size: 14pt;
  color : Black;
}

a:link {
  color: blue;
  text-decoration: none;
  background-color : inherit;
}

a:visited {
  color: blue;
  text-decoration: none;
  background-color : inherit;
}

a:hover {
  color: blue;
  text-decoration: underline;
  background-color : inherit;
}

a:active {
  color: blue;
  text-decoration: line-through;
}

div > p {
  margin-top: 0;
}

pre {
 margin: 10px;
 padding: 5px;
 background: #fff;
 font-family: 'Courier New', Courier, monospace;
 font-size: 11px;
 word-wrap: break-word;
}

 

/*  Section Two:  The Holy Grail Triple Border Effect One-Half */

/*  Row 1--Small Site Logo */

#topleft {
  margin-bottom: 10px;
  float: left;
  height: 105px;
  width: 245px;
}
#topright {
  background: #ccd;
  padding: 5px;
  height: 105px;
  margin-left: 250px;
  margin-bottom: 10px;
  border: 3px outset #ccd;
  text-align: center;
  font-family: 'Times New Roman', Times, serif;
  font-size: 65px;
}

/*  Row 1--Large Site Logo */

#topleft-main {
  padding: 2px;
  margin-bottom: 10px;
  float: left;
  height: 105px;
  width: 500px;
}
#topright-main {
  background: #ccd;
  padding: 5px;
  height: 105px;
  margin-left: 550px;
  margin-bottom: 10px;
  border: 3px outset #ccd;
  text-align: center;
}

/*  Row 2--Triple Column */

#wrapper {
  margin: 0 10px;
  padding: 0;
}
#left {
  float: left;
  width: 120px;
  background-color: #ccd;
  border: 3px groove #ccd;
  padding: 5px;
  margin-bottom: 10px;
  font-size: 10pt;
}
#right {
  float: right;
  width: 200px;
  background: #ccd;
  border: 3px groove #ccd;
  padding: 5px;
  margin-bottom: 10px;
  font-size: 10pt;
}

#banner {
  margin-left: 140px;
  margin-right: 220px;
  background-color: #ccd;
  border: 3px groove #ccd;
  padding: 5px;
  margin-bottom: 10px;
}

#center {
  margin-left: 140px;
  margin-right: 220px;
  background-color: #fffff6;
  padding: 5px;
  border: 3px ridge #dff;
  margin-bottom: 10px;
}

/*  Row 2--Double Column  Use the 'wrapper,' and 'left' from the Triple Column  */


#submenu {
  margin-left: 140px;
  padding: 5px;
}

#banner-two {
  margin-left: 140px;
  background-color: #ccd;
  border: 3px groove #ccd;
  padding: 5px;
  margin-bottom: 10px;
}

#center-two {
  margin-left: 140px;
  background-color: #fffff6;
  padding: 5px;
  border: 3px ridge #dff;
  margin-bottom: 10px;
}

/*  Row 3--Use to keep Footer from ducking inside Row 2  */
#clear {
  clear: both;
}

/*  Row 4--Footer */

#footer {
  background: #ccd;
  border: 3px inset #ccd;
  margin: 30px 20px 20px 20px;
  text-align: left;
  font-family: Courier, 'Courier New', monospace;
  font-size: 8pt;
}

/*  Section Three--Text Effects  */

.smalllabel {
  font-family: Courier, 'Courier New', monospace;
  letter-spacing: -0.05em;
  font-size: 14pt;
  text-align: center;
  text-decoration: overline;
  font-variant: small-caps;
  font-weight: 700;
}

.indent {
  text-indent: 2em;
}

.dropcap {
  font-family: serif;
  font-size: 50px;
  font-weight:bold;
  float: left;
  height:40px; 
  line-height:34px; 
  overflow:hidden; 
  margin-top:2px; 
  margin-right:1px;
}

li a:link {
  font-size: 1.15em;
  color: blue;
  text-decoration: none;
  background-color : inherit;
}

li a:visited {
  font-size: 1.15em;
  color: blue;
  text-decoration: none;
  background-color : inherit;
}

li a:hover {
  font-size: 1.15em;
  color: blue;
  text-decoration: underline;
}

li a:active {
  font-size: 1.15em;
  color: blue;
}

.hintsClass {
 text-align: justify;
 text-indent: 2em; 
 font-size: 12pt;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 background: #cce4f1;
 border: 3px outset #cce4f1;
 padding: 3px;
}

.coding {
 font-family: 'Courier New', Courier, monospace;
}

/* CSS Text by Stu Nicholls */

.outer {display:block; width:5px; height:10px; float:left; margin:1px; background:transparent;}

*html .outer {height:12px; h\eight:10px;}

.outer div {display:block; overflow:hidden; height:2px;}
* html .outer div {float:left;}
.la, .lz {width:5px;}

.lb, .lc, .ld, .lg, .ll, .ln, .lq, .lt {width:1px;}
.lh, .lm, .lo, .ls {width:2px;}
.li, .lk, .lr, .lp, lj {width:3px;}
.le, .lf {width:4px;}
.la, .lr, .lt {background:#000;}
.lz {background:transparent;}
.lh {margin-right:1px;}
.ld, .lf, .lh, .lk, .li, .lm, .lo, .lp, .lq {border-right:1px solid #000;}
.ld, .le, .li, .lm, .ls {border-left:1px solid #000;}
.lc {border-right:4px solid #000; background:#ccc;}
.lb {border-left:4px solid #000; background:#ccc;}
.lg, .ln, .ls {border-right:2px solid #000;}
.lj {border-right:1px solid #ccc; border-left:1px solid #ccc; background:#000;}
.ll, .ln, .lo {border-left:2px solid #000;}


* html .lb, * html .lc {width:5px; w\idth:1px;}
* html .ld, * html .lg, * html .ll {width:3px; w\idth:1px;}
* html .le, * html .lf {width:5px; w\idth:4px;}
* html .lh {width:3px; w\idth:2px;}
* html .li {width:5px; w\idth:3px;}
* html .lj {width:5px; w\idth:3px;}
* html .lk, * html .lp {width:4px; w\idth:3px;}
* html .lm {width:4px; w\idth:2px;}
* html .lo, * html .ls {width:5px; w\idth:2px;}
* html .lq {width:2px; w\idth:1px;}
* html .ln {width:5px; w\idth:1px;}

.clr {clear:left; height:1em;}


#nav, #nav ul { /* all lists */
	padding: 0;
	margin: 0;
      font-size: 11pt !important;
	list-style: none;
	line-height: 1;
}

#nav a {
	display: block;
	width: 150px;
        font-size: 11pt !important;
        font-color: black;
}

#nav a:hover {
	text-decoration: none;
}

#nav li { /* all list items */
	float: left;
	width: 150px; /* width needed or else Opera goes nuts */
        font-family: sans-serif;
        font-size: 11pt !important;
        font-color: black;
        background: white;
        padding: 1px;
}

#nav li ul { /* second-level lists */
	position: absolute;
	background: white;
	width: 150px;
      font-size: 11pt !important;
	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}

#nav li ul ul { /* third-level lists */
	margin: -12px 0 0 150px;
	background: white;
	width: 150px;
      font-size: 11pt !important;
	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
	left: -999em;
}

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul { /* lists nested under hovered list items */
	left: auto;
}

dt {
	font-size: 16pt;
	font-family: sans-serif;
	font-style: italic;
}