/* css Zen Garden submission 143 - 'Pixelisation', by Lim Yuan Qing, http://yuanqing.blogspot.com/ */
/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/  */
/* All associated graphics copyright 2004, Lim Yuan Qing */
/* Added: Dec. 16th, 2004 */

/* IMPORTANT */
/* This design is not a template. You may not reproduce it elsewhere without the 
   designer's written permission. However, feel free to study the CSS and use 
   techniques you learn from it elsewhere. */






/* ---------- misc ---------- */

* {
 padding: 0;
 margin: 0;
 border: 0;
 }
body	{
 background: #eee url(body.gif) no-repeat 50% 100%;
 color: #666; 
 font: 11px/1.3em Arial, Tahoma, sans-serif;
 text-align: center;
 }
acronym {
 cursor: help;
 }

/* ---------- div ---------- */

#container {
 margin: 30px auto;
 border: 1px solid #ddd;
 background: transparent url(container.gif) repeat-y 50% 50%;
 text-align: left;
 width: 448px !important;
 width /**/:450px;
 }
#intro {
 background: transparent url(intro.gif) no-repeat 0 0;
 }
#container, #intro {
 position: relative;
 }
#pageHeader {
 width: 448px;
 height: 260px;
 }
#preamble, #supportingText {
 width: 303px;
 }
#supportingText {
 background: transparent url(supportingText.gif) no-repeat 0 100%;
 width: 448px;
 }
#explanation {
 background: transparent url(explanation.gif) no-repeat 0 50%;
 }
#participation {
 background: transparent url(participation.gif) no-repeat 0 80%;
 }
#benefits {
 background: transparent url(benefits.gif) no-repeat 0 100%;
 }
#requirements {
 padding-bottom: 2px;
 }
#footer {
 text-align: center;
 font: 10px/33px Tahoma, Arial, sans-serif;
 width: 100%;
 height: 35px;
 }
#quickSummary, #linkList {
 position: absolute;
 left: 303px;
 width: 140px;
 font: 10px/1.3em Arial, Tahoma, sans-serif;
 }
#quickSummary {
 top: 260px;
 padding-top: 18px;
 }
#linkList {
 top: 420px;
 }
#linkList div {
 text-align: center;
 }
#lselect, #larchives, #lresources {
 padding: 5px 0 10px;
 }

/* ---------- h3 ---------- */

h3	{
 margin: 7px 15px 3px;
 background-position: 0 0;
 background-repeat: no-repeat;
 text-indent: -9999em;
 font: 1px/1px sans-serif; /* stop IE from revealing unnecessary bg */
 width: 273px;
 height: 28px;
 }
#preamble h3 {
 margin-top: 13px;
 background-image: url(h3_01.gif);
 }
#explanation h3 {
 background-image: url(h3_02.gif);
 }
#participation h3 {
 background-image: url(h3_03.gif);
 }
#benefits h3 {
 background-image: url(h3_04.gif);
 }
#requirements h3 {
 background-image: url(h3_05.gif);
 }
#linkList h3 {
 margin: 0 10px;
 width: 120px;
 height: 10px;
 }
.select {
 background-image: url(h3_06.gif);
 }
.archives {
 background-image: url(h3_07.gif);
 }
.resources {
 background-image: url(h3_08.gif);
 }

/* ---------- p ---------- */

p {
 padding: 0 15px 5px;
 text-align: justify;
 }
#supportingText p {
 margin-right: 145px;
 }
#quickSummary p {
 padding: 3px 12px 0;
 text-align: left;
 }

/* ---------- a ---------- */

a {
 text-decoration: none;
 }
a:link, a:visited {
 color: #666;
 }
a:hover, a:active {
 color: #000;
 }
#supportingText a {
 font-weight: bold;
 }
#footer a {
 padding: 0 1px;
 font-weight: normal;
 }
#quickSummary a:link, #quickSummary a:visited, #footer a:link, #footer a:visited {
 border-bottom: 1px dotted #888;
 }
#quickSummary a:hover, #quickSummary a:active, #footer a:hover, #footer a:active {
 border-bottom: 1px dotted #222;
 }
#linkList a:link, #linkList a:visited {
 text-transform: lowercase;
 color: #888;
 }
#lselect a:link.c, #lselect a:visited.c {
 display: inline;
 color: #666;
 }
#linkList a:hover, #linkList a:active, #lselect a:hover.c, #lselect a:active.c {
 color: #000;
 }
#lselect a {
 display: block;
 text-transform: lowercase;
 }

/* ---------- ul, li ---------- */

ul {
 margin: 5px 10px 0;
 border-top: 1px solid #ddd;
 text-align: left;
 list-style: none;
 }
li {
 padding: 3px 0 3px 20px;
 border-bottom: 1px solid #ddd;
 background-repeat: no-repeat;
 background-position: 6px 5px;
 display: block;
 list-style: none;
 }
li:hover {
 background-color: #f3f3f3;
 }
#lselect li {
 background-image: url(designs.gif);
 }
#larchives li {
 background-image: url(archives.gif);
 }
#lresources li {
 background-image: url(resources.gif);
 }

/* ---------- the unused ---------- */

h1, h2, extraDiv1, extraDiv2, extraDiv3, extraDiv4, extraDiv5, extraDiv6 {
 display: none;
 }