html
{	background-color: black;
}

body
{	background: black;
	color: #edf5f4;
	margin: 20px 20px 20px 20px;
	font-size: 12pt;
	font-family: sans-serif;
}

h1
{	color: #39a1ff;
	font-size: 18pt;
	font-weight: normal;
	font-family: sans-serif;
	font-style: italic;
}

h2
{	color: #39a1ff;
	font-size: 16pt;
	font-weight: normal;
	font-family: sans-serif;
	font-style: italic;
}

h3
{	color: #39a1ff;
	font-size: 14pt;
	font-weight: normal;
	font-family: sans-serif;
	font-style: italic;
}

/* The banner needs to have position:absolute to look the way I want. However, almost every page works best with position:relative, so a relative spacer goes over top of it: */
.banner
{	position:absolute;
	top:0px;
	left:0px;
	height:64px;
	width:100%;
	background-image:url('../astronomy/astronomyBanner.jpg');
	background-position:center center;
	background-repeat:repeat-x;
}

.bannerSpacer
{	position:relative;
	top:0px;
	left:0px;
	height:64px;
}

#dhtmltooltip {
	position: absolute;
	padding: 4px;
	background-color: #121212;
	border: 2px solid #808080;
	text-align: left;
	font-size: 11pt;
	color:#ffffcc;
	visibility: hidden;
	z-index: 100;
}

span.texttip {
	color: #ccddff;
	border-bottom: 1px dashed;
}

a:link, a:visited
{	color: #a4a7c2;
	text-decoration:underline;
}

a:hover
{	color: #ffffcc;
	text-decoration:underline;
}