body {background-color: #000000; background-image: url(/img_moon/moon_back.jpg); background-repeat: no-repeat; background-position: 0px 0px; margin: 0px; padding: 0px; font-family: Verdana, Arial, Helvetica, sans-serif; color: #999999; z-index: -4;}

/*LINKS*/

a:link, a:hover, a:visited {text-decoration: none; color: #CC6600}
a:hover {color: #CCCCCC; text-indent: 0px;}
div#styleswitch {position: absolute; right: 0px; top: 0px;}
div#styleswitch a.black {display: none;}

/*NAVIGATION*/

div#moonnav {position:absolute; background-image: url(/img_moon/moonnav2.jpg); background-position: left top; display: block; left: 0px;	top: 223px; height: 176px; width: 193px;}
div#moonnav a{text-indent: -3000px;}
a#links, a#portfolio, a#methods, a#home, a#aboutourfirm, a#contactus, a#music, a#skills{display:block; left: 0px; width: 193px;}
a#links span,a#skills span, a#portfolio span, a#methods span, a#home span, a#aboutourfirm span, a#contactus span, a#music span {display:none;}
a#links:hover span, a#portfolio:hover span, a#methods:hover span, a#home:hover span, a#aboutourfirm:hover span, a#contactus:hover span, a#music:hover span, a#skills:hover span{display:block;	position: absolute; left: 0px;	top: -60px; font-family: Arial, Helvetica, sans-serif;	color: #FFFFFF;	text-decoration: none;	font-size: 0.7em; background-color: #000000; border: 1px solid #333333;	width: 193px;
z-index: 1; background-position: 0px 0px; padding: 8px; text-indent: 0px;}
a#links:hover, a#skills:hover, a#portfolio:hover, a#methods:hover, a#home:hover, a#aboutourfirm:hover, a#contactus:hover, a#music:hover{background-image: url(/img_moon/moonnav2.jpg);}
a#home {top: 0px; height: 75px;}
a#home:hover {background-position: -193px  0px;}
a#portfolio {top: 75px; height: 16px;}
a#portfolio:hover {background-position: -193px  -75px;}
a#skills {top: 91px; height: 15px;}
a#skills:hover {background-position: -193px -91px;}
a#music {top: 105px; height: 14px;}
a#music:hover {background-position: -193px -105px;}
a#methods {top: 119px; height: 14px;}
a#methods:hover {background-position: -193px  -119px;}
a#aboutourfirm {top: 133px; height: 14px;}
a#aboutourfirm:hover {background-position: -193px  -133px;}
a#links {top: 147px; height: 14px;}
a#links:hover {background-position: -193px  -147px;}
a#contactus {top: 161px; height: 15px;}
a#contactus:hover {background-position: -193px  -161px;}

/*FOOTER*/

div.fineprint {position: absolute;right: 0px; bottom:0px; background-image: url(/img_moon/saturn.gif);	background-position: 0px 0px; height: 202px; width: 201px; border: none;}
div.tuck {position: absolute; z-index: 1; right: 0px; bottom:0px; margin-bottom: 8px; text-align: right; font-size: 9px; color: #666666;}
a#validcss span, a#validxhtml span {display: none;}
a#validcss:hover span {display: block; width: 88px; height: 31px; background-image: url(img_moon/valid-css-blue.png); position: absolute; right: 100px; top: 0px;}
a#validxhtml:hover span {display: block; width: 88px; height: 31px; background-image: url(img_moon/valid-xhtml10-blue.png); position: absolute; right: 100px; top: 0px;}

/*CONTENT - LAYOUT*/

div#presentation {color: #CCCCCC;border: 1px solid #333333;font-family: Arial, Helvetica, sans-serif;font-size: .8em;position: absolute;width: 40%;left: 300px;top: 80px;padding: 20px;}
div#presentation h1 {font-size: 1.1em;	color: #669900;}


/*PORTFOLIO section*/

div.moonport {position: absolute; left: 280px;top: 300px; font-family: Verdana, Arial, Helvetica, sans-serif; padding: 4px;}
div.moonport a {color: #CCCCCC;	font-size: .7em; font-weight: 100;}
div.moonport a:hover {background-color: #66CC00; color: #000000; text-decoration: none;	font-weight: 100;}
div.moonport b {display:none;}
div.moonport span {background-image: url(/img_moon/moonport_snapshots.jpg); display:none;}
div.moonport a:hover span {display: block;position: absolute; top: -200px;left: 60px; width: 298px;background-position: left; text-align: right; vertical-align: text-bottom; background-image: url(/img_moon/moonport_snapshots.jpg);}
div.moonport a:hover b {display: block;	position: absolute; left: -120px;top: -294px; width: 380px; color: #FFFFFF;text-decoration: none; font-variant: normal; text-transform: none; font-weight: 100; font-size: .9em; border: 1px solid #333333; padding: 4px; background-color: #000000;}
div.moonport a:hover b em {color: #999900; font-size: 1.4em; font-style: normal; font-weight: bold; text-decoration: underline;}
a#amanda:hover span {background-position: 0px -1500px; height: 207px; margin-top: -10px;  }
a#cfr:hover span {background-position: 0px -752px;height: 188px;}
a#skn:hover span {background-position: 0px -564px;height: 189px;}
a#ig:hover span {background-position: 0px -1126px;height: 186px;}
a#dpt:hover span {background-position: 0px -378px;height: 186px;}
a#ddr:hover span {background-position: 0px -943px;height: 183px;}
a#bbk:hover span {background-position: 0px 0px;height: 186px;}
a#hung:hover span {background-position: 0px -187px;height: 186px;}
a#rapderm:hover span {background-position: 0px -1312px;height: 185px;}

/*HYPERLINKS SECTION*/
div.widelinks { width:100%; padding: 0px;}
div.widelinks a, div.widelinks a:visited {display: block;width: 30%;	height: 30px;	text-align: right;	vertical-align: middle;}
div.widelinks a:hover {color: #000000; background-color: #669900;}
div.widelinks a span {display: none;}
div.widelinks a:hover span {position: absolute;	display: block;	width: 40%;padding: 20px;margin: 0px;left: 40%;top: 0px;color: #FFFFFF;text-align: left;font-size: 1.2em;}
div.widelinks a:hover span img{border:none;}

a#ignaciomichaud {display: block; width: 82px; height: 198px; background-image: url(ignacio/brushlink.jpg); background-position: left 0px;}
a#ignaciomichaud:hover {background-position: -82px 0px;}
