html {	margin: 0px;
		color: transparent;
		background-color: transparent;
		font-family: "Times New Roman", Times, serif;
		}

body {	background-image: url(bgspacer.gif); /*todo: make the spacer a proper maroon color*/
		background-repeat: repeat-y;  /*makes a maroon-colored column for as long as the page stretches*/
		color: black; /*#008080; teal font*/
		background-color: #D0D0D0;/*make sure this is a background same as main before putting up*/
		border: 0px;
		margin: 0px;
		padding: 0px;
		/*width=100%;
		height=100%; these don't affect the fact that there is white space below table/main on Nana's big screen.*/ 
		}

h1 	{	margin: 0 0 0 75px;/*with {position: relative} makes the sidebar free;  if cntr++ eventually will overlap main*/ 
		padding: 10px 0 0 20px;
		height: 65px;
		float: top left;
		position: relative;   /*absolute makes element left aligned and background run the length of the h1 text (see 
		position main); relative makes background run the length of the screen*/
		background-color: grey;
		font-family: serif;
		font-style: italic;
		font-color: black;
		font-size: 36pt;
		/*vertical-align: center; does not affect text placement in h1 box*/
		text-align: left;}

h2	{	text-align: center;}
		
/*#toplogo { threw toplogo out in favor of h1. might put it in again if we end up with an image up there.
		/*position:  top left; if there's an h1 element within the toplogo-div, toplogo colors apply*/ 
		/*background-color: grey; /*grey*
		color: black;/*#C0C0C0;/*silver font*/
		/*vertical-align: center; doesn't do anything*
		border: border;
		height: 75px;
		}*/

sup 	{
		line-height: 0;
		vertical-align: text-top;
		}

	
.toplimg {margin-top: -75px;
		float: top left;
		position: relative;
		display: block /*gets rid of a 2px or so borderline under the image, I believe. Is it also what pushes the h1 element 
		down?*/}	


#main {	/*float: right; getting rid of this seems to get rid of background white breaking in on CNTR - or +, that is type font
		size fudging; It also seems to make that command just affect the "main" div. */
		/*position: relative; commenting this out makes h1 - but not h1 background color - be in foreground of this element*/
		padding-top: 10px;
		padding-left: 25px;
		padding-bottom: 15px;
		padding-right: 70px; /*want this broad enough to balance out the left sidebar*/
		margin-left: 75px;
		background-color:#D0D0D0; /*previously the darker:#C8C8C8 and silver*/
		border: 0px;
		/*border: 5px solid yellow;
		/*width=90%;
		height=100%;  can be commented out in both css and html without affecting anything. width of main looks to be 
		determined by screenwidth (a default?), height by content. If in a table the hight of the other cell will adjust to it, I 
		have the impression.*/
		/*z-index=3;*/
		}
		
img.main {float: left;
		border: solid black 1px;
		padding-bottom: 0px;
		margin-right: 15px;
		margin-bottom 15px;}
		/*margin-bottom: 0px;	 bottom margin around floating picture seems to depend on text lines. read up on this. if I 
		uncomment this, the whole linkbar stuff breaks. why? */
		
img.fannewb {/*position: center; needs to be centering the images*/
		border: solid black 1px;
		padding-bottom: 0px;
		margin-right: 15px;
		margin-bottom:15px;}

#linkbar {background-color:#D0D0D0; /*fit this to main coloring, so previously silver*/
		padding: 20px 0px 35px 30px; /*top right bottom left; want bottom as high as top of main*/
		margin-left: 75px;
		border: 0px;}
		 /*margin-top: 0px;
		margin-bottom: 0px; for some reason putting this in broke the whole layout.*/

ul	{	list-style-type: disk;
		list-style-position: inside;
		margin-left: 15px;
		padding-left: 1em}
	
ul.lyric {list-style: none;}

.clear { clear: left;
		}
		
/*#sidelogo { threw sidelogo out in favor of background image. may put the div back in in order to have sidelinks. interesting 
		prospect.
		float: left; /*commenting out moves the whole of main to underneath the sidelogo -when it's actually used
		position: absolute top right; commenting out does not affect anything - in firefox*
		background-color: maroon;
		border: border;
		width: 75px; /*If it was 70px, there would be a 5px space between this and "main" because of the 75px margin 
		specified in "main". *
		height:600px;
		}*/
		
/*#table, td { border: 3px solid black; /*set to none in end;
			z-index: 2 ;
			padding: 10px; 
		 }*/
		
/*table img { display: block /*gets rid of a 2px or so borderline under the image, I believe. Is it also what pushes the h1 
		element down? no - no table in the version in which this happened.
		}*/


