/* #9933FF purple for titles,  #33FF33 pale green for texts */

BODY	{ background: url(/imgs/BGstars.jpg) black;  /* star background, black if file not found */
	  color: #33FF33;            /* pale green */
	  font-family: Arial, Helvetica, sans-serif;
	  background-repeat: repeat }
	                             /* Links */
a:link { 	color: #9933FF;}     /* purple for new*/
a:visited {	color: #0033FF;}     /* blue for visited */
a:hover {	color: #FF0000;}     /* red  when you click */
a {	        font-weight: bold;}  /* all links are bold */

	/*  <p style="padding-bottom:12px;"> **************************** */
	  
/* this is the page properties */

div.body  { padding-left: 12em; /* left margin of 12em for body text, was 9em */
	    color: #33FF33;    /* pale green body text */
    	    background: url(/imgs/BGstars.jpg) black;}  /* star background, black if file not found */
p { margin: 0 0 20px; }
/* div.body p {padding-bottom:12em;}     CHECK HERE */
/*body {	background-color: #000000;
	    background-image: url(/imgs/BGstars.jpg);}
.TopTitle {font-size: xx-large} */

H1, H2, H3, H4, H5, H6	{   /* purple titles */
	font-family: Arial, Helvetica, sans-serif; /* Use Arial, but if not available, Helvetica, but if not, sans-serif */
	color:#9933FF;          /* purple */
}     
h1, h2, h3	        { text-align: center } /* first three levels of titles are centered */
H3 {
	color: #33FF33;
	font-weight: bold;
	font-size: x-large;
} /*H3 is green */

div.navbar ul  { list-style-type: none;  /*  This removes the bullets */
    padding: 0;    /* no padding between text and the box that surrounds it, all sides  */
    margin: 0;     /* no margins between edges and navbar box, all sides */
    position: absolute; /* Once you set position absoluter, you have to set top and left positions, or it ends up with the body  */
	/* Absolute is used to humor IE5,6, which doesn't understand fixed. Fixed keeps it there when you scroll down. It's below */
 /*   top: 2em;  /* 2em down from top  */
 /*   left: 1em;/*  1 em away from left edge */

	     background: #B5B ;  /* specified in RGB, this is light purple background of sidebar */
	     width: 8em;  /*  Total Width of the navbar */
	     height: 25em; /*  Total height of the navbar */
		 margin-left: 0px;  /* no left margin */
		 text-align: center; /* text is centered */
	     font-family: Arial, Helvetica, sans-serif; /* Arial Font */
		 margin-right: auto } /* automatically adjust right margin to max word length */


/* workaround IE5 & 6 to support positon: fixed where in browsers where
** it is known to work.  This is kinda kludgy. if browsers get it, the menu stays when you scroll down  */
body>div.navbar>ul  { position: fixed }
div.navbar a  { text-decoration: none;
		font-weight: bold } 

div.navbar a:link, div.navbar a:visited  { color: black } /* navbar text color is black, when fresh or already visited */
div.navbar a:hover {background: black ;color: maroon; font-weight: bold} /*inverts background to black when hovering over navbar element */

/* This is for regular links, not the navbar*/
a:link  { color: #3399FF}      /* Fresh links are blue */
a:visited  { color: #CC66FF }   /* Visited links are purple */
a:hover  { color: maroon; font-weight: bold } /* Hovering over a link makes them dark red and bold */

ol	{ list-style-type: decimal; }
ul	{ list-style-type: disc; }

div.navbar ul li  { font-size: normal;
		    border-style: solid;
		    border-color: black;
		    border-top-width: 1px;
		    border-left-width: 0px;
		    border-right-width: 0px;
		    border-bottom-width: 1px; }
div.navbar ul li.image	{ border-top-width: 0px;
			  border-bottom-width: 0px; }
		 
div.main  {url(/imgs/BGstars.jpg) black;  /* star background, black if file not found */
	    padding-left: 3px;
	    padding-right: 3px;
	    padding-top: 0px;
	    padding-bottom: 0px;
	  /*  color: #33FF33   /* body color is already green */
		  }  


div.New {
	color: #FFFF00;
	font-weight: bold;}
div.box { border: solid; border-width: thin; width: 100%; border-color: purple; padding: 0.5em; background: black}
/*dotted, dashed, solid, double, groove, ridge, inset and outset */

p.indent  { text-indent: 1.5em }
p.note    { font-style: italic;
	    text-align: center; }
blockquote.quote	{ border-left-width: 3px;
			  border-top-width: 0px;
			  border-right-width: 0px;
			  border-bottom-width: 0px;
			  padding-left: 4px;
			  border-style: solid;
			  border-color: #EE88EE }
			  
.Topic {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
color: #9900FF;
}

.ISpeak {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #9900FF;
}

.BoldSpeak {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
color: #9900FF;
} 
.BoldSpeakYellow {

font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
color: #FFFF00;
}
.TopTitle {font-size: xx-large}
			  
/* this is the title colors, below <div class=body>, before <div class=main>  */

/* 
  margin-top: 1em;
  margin-right: 0em;
  margin-bottom: 1em;
  margin-left: 0em;
is equivalent to 
  margin: 1em 0em 1em 0em;   First element is top, then it's clockwise

padding: also takes 4 values, top, then clockwise. Listing it once means all sides get the same value
Padding adds space between the text and the rectangle that surrounds it

 <style type="text/css">
  body { margin-left: 10%; margin-right: 10%; }  
  h1 { margin-left: -8%;}                       the change is additive, so H1 is at 2%
  h2,h3,h4,h5,h6 { margin-left: -4%; }          and the rest at 6%
</style>

h1 { font-size: 200%; }
h2 { font-size: 150%; }
h3 { font-size: 100%; }
aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow
*/