/*  JPMD 15 Oct 5: Changes to CSS are reflected immediately when you refresh a page.  If you don't see a change, there's something wrong with the CSS--the browser doesn't need to be restarted. */

/* major changes 1 Jan 8 */

/* define everything at body level, then refine as needed in following elements */
body
	{	color: black;
		font-family: "Trebuchet MS", "Tahoma", arial, sans-serif;
		font-size: small; /* choices according to blooberry.com: xx-small | x-small | small | medium | large | x-large | xx-large */
		font-weight: normal;
  		background-color: transparent;
		background-image: url("./images/backgrnd/musicbk1.gif");
		background-attachment: fixed;
		vertical-align: top;
		text-align: left;

		/* set margins to non-zero and padding to zero */
		/*	if using reverse colors like with p.header, override to zero and set padding to cover */
		/* sequence is top, right, bottom, left */
		margin: 10px 20px 10px 50px;  /* if you change this, change reverse video elements too! */
		padding: 0px 0px 0px 0px ;

		border-width: 0;
		border-style: none;
		border-color: transparent;
	}

body.alink
	{	/* color: #CC9900; */
		background-color: inherit;
	}

body.vlink
	{	/* color: #CC0033; */
		background-color: inherit;
	}

body.link
	{	/* color: #3333FF; */
		background-color: inherit;
	}

/* img                      work on this later
	{	padding: 50 px;
	}
*/

p /* ----------------------------------- paragraphs ----------------------- */
	{	/* derive almost all from body's settings */
	}


p.bottomborder
	{	color: white;
      background-color: navy;
      font-weight: bold;
		/* padding: .2em; */
	}

p.center
	{ text-align: center;
	}

p.comments
	{	color: maroon;
      background-color: inherit;
		font-size: small;
	}

p.copyright
	{	color: navy;
      background-color: inherit;
		font-size: small;
		text-align: center;
	}

p.d2
	{ 	/* inherit it all from p, which inherits all from body */
	}

p.details
	{	/* font-weight: normal; */
		color: maroon;
      background-color: inherit;
		/* padding: .2em; */
		/* font-size: .8em; */
		text-align: right;
	}

p.footer
	{	color: silver;
      background-color: navy;
	 	font-size: .8em;
      font-weight: lighter;
		text-align: right;
		vertical-align: middle;
      margin: 0px -20px -5px -50px; /* counteract prev L/R margins with minus */
      padding: 5px 20px 5px 50px;
	}

p.header
	{	color: silver;
      background-color: navy;
      font-weight: bold;
      font-size: 1.7em;
      margin: -10px -20px -10px -50px; /* counteract prev margins with minus */
      padding: 10px 20px 10px 50px;
	}

p.headerdiary
	{	color: inherit
      background-color: inherit
      margin: -10px -20px -10px -50px; /* counteract prev margins with minus */
      padding: 10px 20px 10px 50px;
	}

p.main
	{	/* inherit almost everything from p, e.g., from body */
		/* font-size: 0.9em; */
	}

p.subheader
	{	color: silver;
		background-color: navy;
      font-weight: bold;
		font-size: 0.8em;
		padding: .8em;
		margin-top: 0;
	}

p.reversedetails
	{	color: silver;
		background-color: maroon;
		padding: .2em;
      font-weight: normal;
		font-size: .8em;
		text-align: right;
	}

p.topnav
	{	color: silver;
		background-color: inherit;
      text-align: center;
		font-size: .8em;
	}

table  /* --------------------------------------------------------- tables ---------------- */
	{	table-layout: fixed; /* loads big tables faster, assumes that first row has proper number of columns */
	}

table.center /* center, 100% width */
	{	text-align: center;
		vertical-align: top;
		width: 100%;
	}

table.center600
	{  text-align: center;
		/* align: center; */  /* doesn't work? */
      font-size: small;
		width: 600px;
		vertical-align: top;
		margin-left: auto; /* margin left/right are supposed to center the table */
		margin-right: auto;
		margin-bottom: 20 px; //* add extra padding at bottom */
	}

tbody
	{	/* some stuff doesn't seem to flow down from tbody, but I may be missing something; */
		/*	for now, play it safe and only use tbody when it definitely works */

      /* color: gray; */ /* this works, but we don't want it */
		/* background-color: yellow; */ /* this works, but we don't want it yellow! */

		/*	border-style: solid; */  /* doesn't seem to work */
		/* border-color: green; */  /* doesn't seem to work */
		/* border-width: 10px; */  /* doesn't seem to work */

      /* padding: 200px; */ /* padding doesn't seem to apply */
	}

tbody.diary
	{	/* color: purple; */  /* works, but no change needed */
		/* background-color: inherit; */  /* ditto */
		/* border and padding stuff doesn't seem to flow down from tbody;
			border: solid;
			border-color: green;
			border-width: 1px;
         padding: 2px;
		*/
	}

tbody.bottomnav
	{	color: purple;
		background-color: inherit;
	}

tr
	{	/* not doing anything here */
	}

th, td
	{  vertical-align: top;
		padding: 2px; /* specify here because it doesn't seem to inherit from tbody */
		/* border: 2px; */
		/* border-style: none; */
	}

/* dh1 and dh2 are diary header 1 and 2; d1 and d2 are diary columns 1 and 2*/
th.dh1, td.d1
	{	color: navy;
      background-color: inherit;
      font-size: small;
      font-weight: lighter;
		text-align: center;
      width: 65px;
	}

th.dh2, th.d2
	{	/* inherit everything from body */
		/* font-weight: bold;
		color: navy;
      background-color: inherit;
		padding: .2em;
		font-size: .8em;
		text-align: left;
		margin-left: 120px;
		margin-right: 400px;
		vertical-align: top; */
		/* width: auto; */ /*90% */
	}

td.main
	{	/* inherit everything from td, e.g. from body */
	}

td.navtext
	{	font-weight: normal;
		color: navy;
      background-color: inherit;
		padding: .2em;
		font-size: .8em;
		text-align: center;
		width: 12%
	}

col.d1 /* ------------------------------------------------- columns? col.d2 rendered funny in IE
       		                                   collections? (video?  music?) ---------------------- */
	{	font-weight: normal;
		color: navy;
      background-color: inherit;
		padding: .2em;
		font-size: .8em;
		text-align: center;
		margin-left: 10px;
		margin-right: 400px;
		vertical-align: top;
		width: 10%
	}

col.d2
	{ 	color: inherit;
      background-color: inherit;
		/* padding: .2em;
		font-size: 1em;
		text-align: left;
		margin-left: 0px;
		margin-right: 400px; */
		vertical-align: top;
		width: 90%
	}

col.d2x
	{ 	font-weight: normal;
		color: black;
      background-color: inherit;
		padding: .2em;
		font-size: 1em;
		text-align: left;
		margin-left: 0px;
		margin-right: 400px;
		vertical-align: top;
		width: 90%
	}

.collection_image
	{	color: navy;
      background-color: inherit;
      font-size: small;
      font-weight: lighter;
		text-align: center;
      margin-left: 0px;
		margin-right: 0px;
		width: 230px; /* expecting maximum image width to be smaller than this */
	}

.collection_title
	{	font-weight: bold;
		color: black;
		background-color: inherit;
		padding: .2em;
		font-size: 1.3em;
		margin-left: 0px;
		margin-right: 400px;
		vertical-align: top;
		/* width: 80% */
	}

.collection_studio
	{ 	font-weight: normal;
		color: blue;
		background-color: inherit;
		padding: .2em;
		font-size: 1em;
		text-align: left;
		margin-left: 0px;
		margin-right: 400px;
		vertical-align: top
	}

.collection_detail
	{	font-weight: normal;
		color: navy;
		background-color: inherit;
		padding: .2em;
		font-size: 1em;
		text-align: left;
		margin-left: 0px;
		margin-right: 400px;
		vertical-align: top
	}

.collection_comments
	{	font-weight: normal;
		color: black;
		background-color: inherit;
		padding: .2em;
		font-size: 1em;
		text-align: left;
		margin-left: 0px;
		margin-right: 400px;
		vertical-align: top
	}

.collection_detail16
	{	font-weight: normal;
		color: navy;
		background-color: inherit;
		padding: .2em;
		font-size: 1em;
		text-align: left;
		margin-left: 0px;
		margin-right: 400px;
		vertical-align: top;
		width:16%
	}

.collection_comments16
	{	font-weight: normal;
		color: black;
		background-color: inherit;
		padding: .2em;
		font-size: 1em;
		text-align: left;
		margin-left: 0px;
		margin-right: 400px;
		vertical-align: top;
		width:16%
	}

pre  /* -------------------------------------------------- preformatted, e.g., unformatted ----------------------- */
	{ 	font-family: monospace;
		font-weight: normal;
		/* color: black;
		background-color: inherit; */
		/* padding: .2em; */
		/* font-size: .8em; */
		/* text-align: left; */
		/* margin-left: 50px; */
	}

h1 /* --------------------------------------------------- headings h1, h2, h3, etc --------------------------------- */
	{	color : navy;
		background-color: inherit;
		font-size: large;
		text-align: center;
	}

h2
	{	color : navy;
		background-color: inherit;
		font-size: medium;
		text-align: center;
	}

h3
	{	color : navy;
		background-color: inherit;
		font-size: medium;
		text-align: center;
	}

.note
	{	color: inherit;
		background-color: #FFFFCC;
	}

.sup
	{	background-color: green;
		font-weight: bold;
		color: white
	}

.nosup
	{	background-color: white;
		font-weight: normal;
		color: gray;
	}

a:active
	{	color: #000000;
		text-decoration: underline;
		background-color: transparent;
	}

a:hover
	{	color: #000099;
		text-decoration: underline;
		background-color: transparent;
	}

li		/* ----------------------------------------------------lists ---------------------------------*/
	{
	}

li ul, li ol
	{	/* margin-top: 0.3em;
		font-weight: normal;
		color: black;
		background-color: inherit;
		padding: .2em;
		font-size: 1em;
		vertical-align: top;
		text-align: left;
		margin-left: 50px */
	}

li.margintop { margin-top: 0.5em; text-align: left; }

/* added 8 sep 6 for m_all headers */
li.singleletter
	{	font-weight: bold;
		color: silver;
		font-size: 1.2em;
		background-color: navy;
		padding: .2em;
		margin-left: 10px;
		text-indent: 20px;
		vertical-align: middle;
		width:300px;
	}

/* added li.d2 on 23 Sep 7 */
li.d2
	{ 	/* font-weight: normal;
		color: black;
      background-color: inherit;
		padding: .2em;
		font-size: 1em;
		text-align: left;
		margin-left: 0px;
		margin-right: 400px;
		vertical-align: top;
		width: 90%
		*/
	}

/* changed 15 dec 7 to try to get bullets to match p.main
ul li, ol li { margin-bottom: 0.3em; }
li ul, li ol { margin-top: 0.3em; }
*/

ul li, ol li
	{	/* margin-bottom: 0em;
		font-weight: normal;
		color: black;
		background-color: inherit;
		padding: .2em;
		font-size: 1em;
		vertical-align: top;
		text-align: left;
		margin-left: 50px */
	}

hr  /* -------------------------------------------- header rules ---------------------------------------*/
	{
	}

hr.w600
	{	width: 600px
	}



