@import url(pagunan.css);

/* MOON CHART STYLES */

.main
{
	position: relative;
	z-index: 0;
	text-align: left;
	margin-top: 6px;
	background: url(images/circle.gif) 16px 16px no-repeat;
}

h4 { margin: 0; padding: 0; color: #321; }

.main li { margin-left: 15px; }

a span.legend { display: none; }

a:hover span.legend, .desctext
{
	position: absolute;
	left: 50%;
	top: 12px;
	width: 150px;
	height: 235px;
	border: 2px white groove;
	font-size: .8em;
	background: #F7EEE6;
	padding: 3px 5px;
	margin-left: 57px;
	text-decoration: none;
}

a:hover span.legend { z-index: 10; }
.desctext { z-index: 0; }

.desctext p { text-align: left; }

.main p.suptext { margin-top: 215px; }

.pleft { margin-right: 3px; }

.extext
{
	z-index: -1;
	position: absolute;
	top: 44px;
	left: 55px;
	height: 1%;
	width: 166px;
	font-size: .75em;
}

.extext p
{
	text-align: center;
	padding: 3px 0;
	margin: 0;
}

.legend li { text-align: left; font-weight: bold; }
.legend li li { margin-left: 10px; font-weight: normal; }

a.sxi span, a.venes span, a.hetig span, a.enni span, a.ent span, a.velnee span, a.vewlet span, a.neitreth span, a.noe span, a.wot span, a.heret span, a.rofu span, a.vefi span { display: none; }

a.sxi:hover span, a.venes:hover span, a.hetig:hover span, a.enni:hover span, a.ent:hover span, a.velnee:hover span, a.vewlet:hover span, a.neitreth:hover span, a.noe:hover span, a.wot:hover span, a.heret:hover span, a.rofu:hover span, a.vefi:hover span

{
	display: block;
	position: absolute;
}

.sxi, .venes, .hetig, .enni, .ent, .velnee, .vewlet, .neitreth, .noe, .wot, .heret, .rofu, .vefi
{
	display: block;
	z-index: 10;
	height: 40px;
	width: 40px;
	padding: 0;
	background-position: 0 0;
	filter: alpha(opacity=100);
}

.sxi
{
	top: 0px;
	left: 116px;
	background: url(images/sxi.gif) 0 0px no-repeat;
}

.venes
{
	top: 12px;
	left: 171px;
	background: url(images/venes.gif) no-repeat;
}

.hetig
{
	top: 50px;
	left: 212px;
	background: url(images/hetig.gif) no-repeat;
}

.enni
{
	top: 102px;
	left: 231px;
	background: url(images/enni.gif) no-repeat;
}

.ent
{
	top: 157px;
	left: 224px;
	background: url(images/ent.gif) no-repeat;
}

.velnee
{
	top: 203px;
	left: 192px;
	background: url(images/velnee.gif) no-repeat;
}

.vewlet
{
	top: 228px;
	left: 142px;
	background: url(images/vewlet.gif) no-repeat;
}

.neitreth
{
	top: 228px;
	left: 87px;
	background: url(images/neitreth.gif) no-repeat;
}

.noe
{
	top: 202px;
	left: 38px;
	background: url(images/noe.gif) no-repeat;
}

.wot
{
	top: 155px;
	left: 8px;
	background: url(images/wot.gif) no-repeat;
}

.heret
{
	top: 101px;
	left: 1px;
	background: url(images/heret.gif) no-repeat;
}

.rofu
{
	top: 49px;
	left: 20px;
	background: url(images/rofu.gif) no-repeat;
}

.vefi
{
	top: 12px;
	left: 62px;
	background: url(images/vefi.gif) no-repeat;
}

.green, span.green { background-position: 0 -40px; }
.blue, span.blue { background-position: 0 -80px; }
.purple, span.purple { background-position: 0 -120px; }
.white, span.white { background-position: 0 -160px; }

a.sxi { margin-left: 116px; margin-top: 0px; }
a.venes { margin-left: 171px; margin-top: -28px; }
a.hetig { margin-left: 212px; margin-top: -2px; }
a.enni { margin-left: 231px; margin-top: 12px; }
a.ent { margin-left: 224px; margin-top: 15px; }
a.velnee { margin-left: 192px; margin-top: 6px; }
a.vewlet { margin-left: 142px; margin-top: -15px; }
a.neitreth { margin-left: 87px; margin-top: -40px; }
a.noe { margin-left: 38px; margin-top: -66px; }
a.wot { margin-left: 8px; margin-top: -87px; }
a.heret { margin-left: 1px; margin-top: -94px; }
a.rofu { margin-left: 20px; margin-top: -92px; }
a.vefi { margin-left: 62px; margin-top: -77px; }


.purpletext { color: #C03; }
.bluetext { color: #960; }
.greentext { color: #060; }
