/*******************************************************************************
*
*	ORIGINAL CSS BY BUBS
*	http://www.bubblessoc.net
*
*	Feel free to steal ;)
*
*******************************************************************************/

body {
	background: url("images/blue-bg.gif");
	margin: 0;
	padding: 0;
	font-family: "Verdana", "Arial", "Helvetica", sans-serif;
	font-size: 70%;
	color: #000;
	line-height: 1.5em;
}

img {
	border: 0;
}

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 20px 0;
	padding: 0;
}

ul {
	list-style: none;
	margin: 0 0 20px 0;
	padding: 0;
}

ol {
	margin: 0 0 20px 40px;
	padding: 0;
}

dl {
	margin: 0 0 20px 0;
	padding: 0;
}

dl dt code {
	font-size: 150%;
}

dl dd {
	margin: 10px 0 20px 40px;
	padding: 0;
}

p {
	margin: 0 0 20px 0;
	padding: 0;
}

p.pages,
p.center {
	text-align: center;
}

hr {
	display: none;
}

a {
	text-decoration: none;
}

form {
	margin: 0;
	padding: 0;
}

input, select, textarea {
	font-family: "Verdana", "Arial", "Helvetica", sans-serif;
	font-size: 100%;
	color: #000;
	background-color: #99cc00;
	border: 1px solid #000;
	padding: 3px;
}

code {
	font-size: 125%;
}

pre {
	overflow: auto;
	display: block;
	max-width: 370px;
	font-size: 150%;
	margin: 0 0 20px 0;
	padding: 0;
	white-space: pre;
}

* html pre {
	width: 370px;
}

#encompass {
	background: url(images/bkg.gif) top left repeat-x;
	width:100%;
	background-color:trasparent;
	}

#wrap {
	width: 696px;
	background: url("images/wrap-bg.gif") top left repeat-y;
	margin: 0 auto;
	position: relative;
}

h1 {
	background: url("images/top.gif") top left no-repeat;
	width: 696px;
	height: 158px;
	margin: 0;
	text-indent: -9999px;
}

h2#navigate {
	background: url("images/navigate.gif") top left no-repeat;
	width: 57px;
	height: 15px;
	text-indent: -9999px;
	position: absolute;
	top: 130px;
	left: 522px;
	margin: 0;
}

/***** NAVIGATION *************************************************************/

ul#navigation {
background-color:#58CE60;
text-align:center;
border:1px solid #000;
padding:10px;
margin:0px;
}

ul#navigation li a {
font-weight:normal;
color:#000;

}

ul#navigation li a:hover {
	position: relative;
	top: 1px;
	left: 1px;
}

ul#navigation li:hover {
background-color:#36BA3F;
}

/***** ACTIVITY NAVIGATION *************************************************************/


p#halloween07 a img {
	width:9px;
	height:8px;
	position:absolute;
	top:144px;
	left:40px;
}

p#easter07 a img {
	width:9px;
	height:10px;
	position:absolute;
	top:143px;
	left:520px;
}

p#valentine07 a img {
	width:15px;
	height:25px;
	position:absolute;
	top:50px;
	left:200px;
}

p#valentine08 a img {
	width:15px;
	height:25px;
	position:absolute;
	top:60px;
	left:220px;
}

p#flowers08 a img {
	width:16px;
	height:24px;
	position:absolute;
	top:130px;
	left:150px;
}


p#august07 a img {
	width:9px;
	height:8px;
	position:absolute;
	top:144px;
	left:10px;
}

p#christmas07 a img {
	width:21px;
	height:15px;
	position:absolute;
	top:136px;
	left:200px;
}


/***** SHROOMS ****************************************************************/

p#shrooms {
	margin: 0;
	position: absolute;
	left: 538px;
	top:140px;
}

p#shrooms img {
	width: 10px;
	height: 11px;
}


/***** SIDEBAR ****************************************************************/

#sidebar {
	float: left;
	width: 148px;
	padding: 25px 11px 0 21px;
	position: relative;
	z-index: 2;
}

#sidebar a {
	color: #fff;
	font-weight: bold;
}

#sidebar ul.quilt {
	float: left;
	width: 135px;
	line-height: 0;
	margin-bottom: 0;
	padding-left: 9px;
	padding-bottom: 20px;
}

#sidebar ul.quilt li {
	float: left;
	width: 45px;
	height: 45px;
}

#sidebar h2 {
	width: 110px;
	height: 18px;
	text-indent: -9999px;
	margin: 25px auto 20px auto;
	background: url("images/quilt-stats.gif") top left no-repeat;
}

/***** CONTENT ****************************************************************/

#content {
	float: left;
	text-align:justify;
	width: 450px;
	padding-left: 20px;
	position: relative;
	z-index: 2;
}

#content abbr,
#content acronym {
	border-bottom: 1px dashed #99cc00;
	cursor: help;
}

#content a {
	color: #C0C0C0;
}

#content a:hover {
	color: #F1F1F1;
	position: relative;
	top: 1px;
	left: 1px;
}

#content h2 {
	text-indent: -9999px;
	background: top left no-repeat;
	height: 15px;
}


#content h2.welcome {
	background-image: url("images/h2-welcome.gif");
	width:60px;
}

#content h2.about {
	background-image: url("images/h2-about.gif");
	width:65px;
}

#content h2.awards {
	background-image: url("images/h2-awards.gif");
	width:65px;
}

#content h2.qbeethanks {
	background-image: url("images/h2-qbeethanks.gif");
	width:65px;
}

#content h2.memberthanks {
	background-image: url("images/h2-memberthanks.gif");
	width:65px;
}


#content h2.quilt {
	background-image: url("images/h2-quilt.gif");
	width:px;
}


#content h3 {
	font-size: 120%;
}

#content ul.quilt {
	float: center;
	width: 360px;
	line-height: 0;
	margin-bottom: 0;
	padding-left: 5px;
	padding-bottom: 20px;
}

#content ul.quilt a {
	border-bottom-width: 0;
}

#content ul.quilt a:hover {
	position: static;
}

#content ul.quilt li {
	float: center;
	width: 45px;
	height: 45px;
}


#content ul.trade-log,
#content ul.star {
	margin-left: 10px;
	line-height: 1.8em;
}

#content ul.star {
	margin-left: 30px;
}

#content ul.trade-log li,
#content ul.star li {
	background: url("images/star-bullet.gif") 0 0.6em no-repeat;
	padding-left: 17px;
}

#content ul.star li {
	background-position: 0 0.5em;
}

#content fieldset {
	margin: 0;
	padding: 0;
	border: 0 solid #000;
}

#content fieldset ol {
	margin: 0;
	list-style: none;
}

#content fieldset ol li {
	margin-bottom: 15px;
}

#content fieldset ol li label {
	float: left;
	width: 100px;
}

#content fieldset ol li input,
#content fieldset ol li select,
#content fieldset ol li textarea {
	width: 18em;
}

#content fieldset ol li input.auto,
#content fieldset ol li select.auto,
#content fieldset ol li textarea.auto {
	width: auto;
}

#content input.button {
	margin-left: 100px;
	margin-bottom: 20px;
}

#content p.pages a,
#content p.pages span {
	padding: 3px 6px;
	border: 1px solid #000;
	background-color: #99cc00;
	margin-right: 3px;
	color: #669900;
}

#content p.pages span {
	color: #fff;
}

/***** FOOTER *****************************************************************/

#footer {
	clear: both; 
	height: 9px; 
	background: url(images/bottom.gif) bottom left no-repeat;
}