/*  class = .   .... id = #  */

body {
  margin: 0 auto;
  width: 800px;
  text-align: center;
} 
.body {
  margin: 20px auto;
  width: 800px;
  text-align: center;
} 


table {
  border-collapse:collapse;
}

#growsprouttable  {
  width: 100%;
  margin-top: 12px;
}
#growsprouttable table {
  width: 100%;
  margin-bottom: 5px;
}

#growsprouttable table th{
  font-size: 14px;
}
#growsprouttable table td {
  padding: 0 14px 6px 0;
  font-size: 12px;
}
#growsprouttable .bborder{
  border-bottom: 1px dotted #808080;
}
#growsprouttable .bborder2{
  border-bottom: 1px solid #808080;
}

#growsprouttable > tbody > tr:hover {
  background-color: #EEE;
}


table#messagetable th, table#messagetable td {
  padding: 0 12px 0;
}

table#shedtable th, table#shedtable td {
  padding: 0 12px 0;
}
table#shedtable th {
  border-bottom: 1px solid #808080;
}

table#shoppetable th, table#shoppetable td {
  padding: 0 8px 0;
}
table#shoppetable th {
  border-bottom: 1px solid #808080;
}

table.sproutInfoBox {
  width: 100%;
 	text-align: center;
}

table.sproutInfoBox  th{
  font-weight: bold;
  font-size: 16px;
}
table.sproutInfoBox  .bborder{
  border-bottom: 1px dotted #808080;
}

.jobHunt ul li {
  padding: 2px 0;
}
.jobHunt  p {
  padding: 4px 0;
}




.shaded  {
  background-color: #E8E8E8;
}
.grayed  {
  color: #888;
}

a {
  color: #000000;
}

a.aLink {
  text-decoration: none;
  color: #000000;
	padding: 1px 5px 1px 5px;
  margin: 3px;
  border-top: 1px solid #808080;
  border-bottom: 1px solid #808080;
}

a.aLink:hover {
  background-color: #E8E8E8;
	padding: 1px 4px 1px 4px;
  margin: 3px;
  border: 1px solid #808080;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}


a.boxpopup2{
  position:relative;
	z-index:24;
}
a.boxpopup2:hover{z-index:25; 	cursor: help;}
a.boxpopup2 span{display: none;}
a.boxpopup2:hover span{ /*DISPLAYS ONLY ON HOVER*/
	display:block;
	position:absolute;
	top:0; 
  left:-280px; 
  width:240px;
	padding:.5em;
  background:#FFF;
  font-family: sans-serif;
  font-size: 13px;
	text-align: center;
   
 	border: 1px solid #CCC;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
  -moz-box-shadow: 6px 6px 4px #888;
  -webkit-box-shadow: 6px 6px 4px #888;
  box-shadow: 6px 6px 4px #888;
}




a.boxpopup3{
  position:relative;
	z-index:24;
	border-bottom:thin dotted #046;
	text-decoration:none;
}
a.boxpopup3:hover{z-index:25; 	cursor: help;}
a.boxpopup3 span{display: none;}
a.boxpopup3:hover span{ /*DISPLAYS ONLY ON HOVER*/
	display:block;
	position:absolute;
	top:2em; 
  left:-2em; 
  width:20em;
	padding:.5em;
  background:#FFF;
  font-family: sans-serif;
  font-size: 13px;
	text-align: center;
  
 	border: 1px solid #CCC;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
  -moz-box-shadow: 6px 6px 4px #888;
  -webkit-box-shadow: 6px 6px 4px #888;
  box-shadow: 6px 6px 4px #888;
}


.fakeicon {
  background-color: #E8E8E8;
	padding: 0 4px 0 4px;
  margin: 0 2px 0 2px;
  border-left: 1px solid #808080;
  border-right: 1px solid #808080;
}

.navmenu {
  width: 800px;
  margin: 10px auto 10px auto;
 	padding: 6px 0; 
  text-align: center;
	font-size: 18px;
  font-weight: bold;
  color: #333;
  border-top: 2px solid #808080;
  border-bottom: 2px solid #808080;
} 

.navmenu a, .navmenu span {
  color: #333;
  padding: 1px 5px;
  text-decoration: underline;
}

.navmenu a:hover, .navmenu span:hover{
  -moz-border-radius: 4px;
  border-radius: 4px;
  background-color: #999;
  color: #FFFFFF;
  padding: 1px 5px;
  text-decoration: underline;
}

.navmenu a img, .navmenu a img:hover {
  padding: 0;
  margin: 0;
}

 
div.main {
	padding: 0;
	margin: 10px auto 0 auto;
	width: 800px;
  font-family: sans-serif;
  font-size: 14px;
}

.footer {
	clear: both;
	margin-left: auto;
	margin-right: auto;
	max-width: 100%;
	min-height: 20px;
  font-family: sans-serif;
}

.foot_left {
  float: left;
  text-align: left;
	width: 30%;
}

.foot_center {
  float: left;
  text-align: center;
	width: 40%;
}

.foot_right {
  float: left;
  text-align: right;
	width: 30%;
}

.col_w540, 
.left_col3,
#srbanner {
	width: 540px;
}
.col_w500 {
	width: 500px;
}
.col_w240 {
	width: 240px;
}
.col_w200 {
	width: 200px;
}

.full {
  padding: 20px; 
	margin: 20px 0 20px 0;
	font-size: 14px;
	text-align: center;
  font-family: sans-serif;
}

div.reg_top {
  font-size: 16px;
  color: #000000;
 	text-align: center;
}

div.reg_top  p {
  font-size: 20px;
 	text-align: center;
  margin: 0 10px 5px 10px;
  padding: 5px 0 5px 0;
  border-bottom: 2px solid #808080;
}

.reg_col1 h4, .reg_col2 h4, .reg_col3 h4 {
  font-size: 16px;
 	text-align: center;
  margin: 0;
  padding: 5px 0 5px 0;
}

div.reg_col1 {
	clear: both;
	float: left;
	width: 30%;
	text-align: center;
}
div.reg_col2{
	float: left;
	width: 40%;
	text-align: center;
}
div.reg_col3 {
	float: left;
	width: 30%;
	text-align: center;
}

.left_container {
	float: left;
  margin: 0;
  padding: 0;
  width: 590px;
}

.left_col3 {
	float: left;
  padding: 0 20px; 
	margin: 0 0 20px 0;
	font-size: 14px;
	text-align: left;
  position: relative;
}

div.left_subhead {
	float: left;
  width: 100%;
	font-size: 16px;
}
	
div.left_subhead h4 {
  display: inline-block;
	margin: 5px 10px 5px 0;
	text-align: left;
	font-size: 24px;
}

div.left_sub1 {
	clear: both;
	float: left;
	font-size: 14px;
 	padding: 0 20px 15px 0; 
}
div.left_sub2 {
	float: left;
	font-size: 14px;
 	padding: 0 0 15px 0; 
}

.left_subfoot {
	clear: both;
	float: left;
  width: 100%;
	font-size: 14px;
  margin-bottom: 20px;
}

.left_subfoot  p {
  margin: 0;
}

.left_subright {
  top: 30px;
  width: 20px;
  border-top: 1px dotted #808080;
  border-bottom: 1px dotted #808080;
  border-left: 1px dotted #808080;
  right: 0;
  position: absolute;
  text-align: center;
}

.left_col2 {
	float: left;
/* 	padding-top: 20px; */
 	padding: 0 20px; 
	margin: 0;
  font-size: 24px;
	text-align: center;
}

#flower_desc {
  width: 325px;
}

#main_list {
  width: 325px;
  margin-left: 5px;
  padding-left: 5px;
}
#main_list ul {
  margin-left: 7px;
  padding-left: 7px;
}


div.right_col1 {
	float: right;
	text-align: center;
}


/* ===== Game Menu ======================================================== */
div.gamemenu  {
  font-size: 16px;
  color: #000000;
 	text-align: center;
}

div.gamemenu  p {
  font-size: 20px;
 	text-align: center;
  margin: 0 10px 5px 10px;
  padding: 5px 0 5px 0;
  border-bottom: 2px solid #808080;
  text-shadow: #808080 2px 2px 2px;
}

div.gamemenu  ul {
  width: 90%;
  list-style: none;
  margin: 0 auto 5px auto;
  padding: 0;
}

div.gamemenu  ul li {
  margin: 0;
}

div.gamemenu  ul li a {
  display: block;
  text-decoration: none;
  color: #000000;
  padding: 1px;
}

div.gamemenu  ul li a:hover {
  background-color: #E8E8E8;
	padding: 0;
  border: 1px solid #808080;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

/* ===== Announcement Marquee ============================================= */
ul.marquee {
	/* required styles */
	display: block;
	padding: 0;
	margin: 0;
	list-style: none;
	line-height: 1;
	position: relative;
	overflow: hidden;

	/* optional styles for appearance */
	width: 480px;
	height: 27px; /* height should be included to reserve visual space for the marquee */

	/* background-color: #f2f2ff;
	border: 1px solid #08084d; */
}

ul.marquee li {
	/* required styles */
	position: absolute;
	top: -999em;
	left: 0;
	display: block;
	white-space: nowrap; /* keep all text on a single line */

	/* optional styles for appearance */
  font-family: sans-serif;
  font-size: 16px;
	padding: 5px;
}

.marquee_title {
  float: left; 
  width: 50px;
  text-align: left; 
  font-family: sans-serif;
  font-size: 16px;
  /* padding: 3px 5px 1px 0; */
}

.marquee_body {
 	border-bottom: 1px solid #808080;
}


.message_title {
  font-size: 14px;
  width: 530px; 
  margin-bottom: 6px;
 	border-bottom: 1px solid #808080;
}

.message_title  span{
  font-size: 16px;
  font-weight: bold;
}

.messagelist , .public_message, .cevent {
  font-size: 14px;
/*  overflow: auto;  */
/*  width: 530px;  */
  height: 200px;
  padding-top: 10px;
}
.public_message {
  overflow: auto;
  height: 150px;
  margin-bottom: 16px;
}

.messagelist ul , .public_message  ul, .cevent ul {
  width: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
}

.messagelist ul li , .public_message ul li, .cevent ul li {
  margin: 0 0 5px 0;
  padding-bottom: 2px;
  border-bottom: 1px dashed #808080;
}
.messagelist ul li span , .public_message  ul li span, .cevent ul li span {
  font-size: 10px;
}

.messagelist h3, .public_message h3, .cevent h3, .left_col3 h3 {
	display: block;
	padding-bottom: 5px;
	margin: 5px 0 3px 0;
	text-align: center;
	font-size: 20px;
	border-bottom: 2px solid #808080;
  text-shadow: #808080 2px 2px 2px;
  font-weight: normal;
}

.cevent p {
	display: block;
	margin: 5px 0;
	text-align: left;
	font-size: 16px;
  font-weight: bold;
}


/* ======================================================================== */
.awards_title {
  width: 540px; 
}

.awards {
  position: relative;
  font-size: 13px;
  overflow: auto; 
  width: 540px; 
  height: 250px;
  margin-bottom: 6px;
}

.awards h4 {
	display: block;
	/* padding-bottom: 5px; */
	margin: 5px 0;
	text-align: left;
	font-size: 15px;
}

.awards p {
	display: block;
	margin: 5px 0;
	text-align: left;
	font-size: 13px;
}

.awards table tr#bottom {
  border-bottom: 1px solid #808080;
  margin-bottom: 6px;
}

/* ======================================================================== */
.quest_title {
  width: 540px; 
}

.quest {
  position: relative;
  font-size: 14px;
  overflow: auto; 
  width: 540px; 
/*   height: 250px; */
  margin-bottom: 6px;
}

.quest h4 {
	display: block;
	/* padding-bottom: 5px; */
	margin: 5px 0;
	text-align: left;
	font-size: 16px;
}

.quest p {
	display: block;
	margin: 5px 0;
	text-align: left;
	font-size: 14px;
}

.quest table tr#bottom {
  border-bottom: 1px solid #808080;
  margin-bottom: 6px;
}



.gardenshed {
  font-size: 14px;
/*  overflow: auto; 
  width: 530px; 
  height: 150px; */
  padding-bottom: 10px;
}

.gardenshoppe  {
  font-size: 13px;
  padding-bottom: 10px;
}

/*
div.messagelist  ul li a {
  display: block;
  text-decoration: none;
  color: #000000;
  padding: 1px;
}

div.messagelist  ul li a:hover {
  background-color: #E8E8E8;
	padding: 0;
  border: 1px solid #808080;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}
*/



.lostPWD {
  font-size: 12px;
  text-decoration: none;
  color: #000000;
	padding: 1px 4px 1px 4px;
  margin: 3px;
  border-top: 1px solid #808080;
  border-bottom: 1px solid #808080;
}

.lostPWD:hover {
  background-color: #E8E8E8;
	padding: 1px 4px 1px 4px;
  margin: 3px;
  border: 1px solid #808080;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.margin20 {
	margin: 20px !important; 
}
.margin10 {
	margin: 10px !important; 
}


#news_sub1 {
	float: left;
  margin: 0 0 2px 0;
	padding: 0 5px 0 5px;
	text-align: center;
  font-family: sans-serif;
	font-size: 14px;
}

#news_sub1 h3 {
	display: block;
	padding-bottom: 5px;
	margin: 5px 10px 3px 10px;
	text-align: center;
	font-size: 16px;
/*	color: #006600; */
	border-bottom: 2px solid #808080;
}


#news_sub1 ul {
	margin: 0 10px 0 10px;
	padding: 0;
	list-style:none;
}

#news_sub1 li {
/*	list-style:none;
	background: url(/images/elements/dash_green_16.png) no-repeat 0px .2em;
	padding-left: 22px;
	color: #006600; */
	padding-bottom: 5px;
	border-bottom: 1px dashed #A9A9A9;
	padding-top: 5px;
}

#login {
  vertical-align:bottom;
}


/* ===== Spacing ========================================================== */
#spacer20, .spacer20 {
	clear: both;
	margin-left: auto;
	margin-right: auto;
	max-width: 100%;
	min-height: 20px;
}


/* ===== Nutrient Meter =================================================== */
div.nutrient-meter {
  position: relative;
  border: 1px solid #808080; 
  display: inline-block;
  width: 100px; 
  height: 11px;
  margin: 0; 
  padding: 0px; 
/*#  float: left;  */
  background: white;
}

div.nutrient-meter div {
  position: absolute;
  padding: 1px;
  height: 9px;
  line-height: 9px;
  text-align: center;
  overflow: hidden;
}

div.nutrient-meter div.bar {
  z-index: 1;
  background-color: #c0c0c0; 
  height: 9px;
}

div.nutrient-meter div.label {
  font-size: 9px;
  z-index: 2;
  width: 100%; 
}

/* ===== Award Meter =================================================== */
.meter {
  position: relative;
  border: 1px solid #808080; 
  display: inline-block;
  width: 200px; 
  height: 14px;
  margin: 0; 
  padding: 0px; 
/*#  float: left;  */
  background: white;
}

.meter div {
  position: absolute;
  padding: 1px;
  height: 12px;
  line-height: 12px;
  text-align: center;
  overflow: hidden;
}

.meter div.bar {
  z-index: 1;
  background-color: #c0c0c0; 
  height: 12px;
}

.meter div.label {
  font-size: 11px;
  z-index: 2;
  width: 100%; 
}







.privacy, .terms, .help {
  text-align: left;
  font-size: 16px;
}

.privacy  h1, .terms h1, .help h1 {
  display: block;
  font-size: 24px;
  font-weight: bold;
  margin: 0;
  padding: 10px 0 5px 0;
  border-bottom: 2px solid #000000; 
}

.privacy  h2, .terms h2, .help h2 {
  display: block;
  font-size: 18px;
  margin: 0;
  padding: 5px 0 5px 0;
  border-bottom: 1px solid #808080; 
}


.help dl {
  margin-bottom: 50px;
  float: left;
  width: 100%;
  border-bottom: 1px dotted silver;
}
 
.help dl dt {
  clear: left;
  float: left;
  border-top: 1px dotted silver;
  font-weight:bold;
/*  margin-right:10px; */
  margin: 0;
  padding:5px;
  width:150px;
}
 
.help dl dd {
  float: left;
/*  margin:2px 0; */
  margin: 0;
  padding:5px 0;
  border-top: 1px dotted silver;
  width: 600px;
}

.help ul {
  margin-bottom: 20px;
}

.help ul li {
  margin-bottom: 10px;
  margin-right: 20px;
}


UL.tabNavigation {
  list-style: none;
  margin: 0;
  padding: 0;
}
UL.tabNavigation LI {
  display: inline;
}
UL.tabNavigation LI A {
  padding: 3px 5px;
  background-color: #ccc;
  color: #000;
  text-decoration: none;
 	-moz-border-radius: 5px 5px 0 0;
	-webkit-border-radius: 5px 5px 0 0;
 	border-radius: 5px 5px 0 0;
}

UL.tabNavigation LI A.selected,
UL.tabNavigation LI A:hover {
  background-color: #333;
  color: #fff;
  padding-top: 7px;
 	-moz-border-radius: 5px 5px 0 0;
	-webkit-border-radius: 5px 5px 0 0;
 	border-radius: 5px 5px 0 0;
}
		
UL.tabNavigation LI A:focus {
  outline: 0;
}
div.tabs > div {
  padding: 5px;
  height: 165px;
  overflow: auto;
  margin-top: 3px;
  border: 3px solid #333;
 	-moz-border-radius: 0 0 10px 10px;
	-webkit-border-radius: 0 0 10px 10px;
 	border-radius: 0 0 10px 10px;
}
		
div.tabs > div h2 {
  margin-top: 0;
}
#mail {

}
#fight {

}
.waste {
  min-height: 1000px;
}


.bottom_ad {
  margin: 0 auto;
  width: 745px;
}

#srbanner {
float: left;
padding: 5px 20px;
border-top: 1px solid #CCC;
border-bottom: 1px solid #CCC;
}




.button {
   border: 1px solid #333333;
   background: #dddddd;
   background: -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#cccccc));
   background: -moz-linear-gradient(top, #eeeeee, #cccccc);
   padding: 3px 10px;
   margin: 1px 4px;
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
/*   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0; */
   color: #000000;
   font-size: 12px;
/*   font-family: Georgia, serif; */
   text-decoration: none;
   vertical-align: middle;
   }
.button:hover {
   border-top-color: #666666;
   background: #dddddd;
   background: -webkit-gradient(linear, left top, left bottom, from(#cccccc), to(#eeeeee));
   background: -moz-linear-gradient(top, #cccccc, #eeeeee);
   color: #333333;
   }
.button:active {
   border-top-color: #666666;
   background: #aaaaaa;
   }



/* ======================================================================== */
/* =====                                               border styling ===== */
/* ======================================================================== */
.full,
.right_sub1,
.left_col2,
.left_col3,
#login,
#news_sub1 {
	border: 1px solid #CCC;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	border-radius: 20px;
  -moz-box-shadow: 6px 6px 4px #888;
  -webkit-box-shadow: 6px 6px 4px #888;
  box-shadow: 6px 6px 4px #888;
}


/* ======================================================================== */
/* =====                                                        Fonts ===== */
/* ======================================================================== */

#news_sub1, 
.marquee_title,
ul.marquee li, 
.full, 
.footer, 
div.main,
a.boxpopup3:hover span,
a.boxpopup2:hover span,
table#buytable th, table#buytable td {
  font-family: "Philosopher", sans-serif;
}

