/* Set base positioning */

html,
body {
   margin:0;
   padding:0;
   height:100%;
   background: #9dc928 url(/images/body_bg.jpg)  repeat-x;
     
}
#wrapper { }

#container {
   min-height:100%;
   position:relative;
   background: url(/images/bg_961b.gif) repeat-y top center;

  
   
}



#header {
   
   
}
#body {
   padding-bottom: 84px;   
   text-align: center;
   margin: 0 auto;
   height: 100%;
   width: 960px;
   
   
}

#copy { width: 960px; background: #fff; }

#clear { clear: both; }

#footer {
   position:absolute;
   bottom:0;
   width:100%;
   height:84px;   

} 

/* Start Menu Nav */

#menunav 									{
												width: 963px;
												padding: 0;
												margin: 0;}




#menunav a 							{  float: left;
												margin: 0;
                                    padding: 0;
												height: 98px;
                                    display: block;
                                    line-height: 98px;
                                    background: url(/images/menu-nav.gif);
                                     }
												
#menunav a span { display: none; }

#menunav a.home  							{background-position: 0 0; width: 111px; }							
#menunav a.about 						{background-position: -111px 0; width: 101px;  }							
#menunav a.products 				{background-position: -212px 0; width: 124px; }							
#menunav a.retailers  						{background-position: -336px 0; width: 124px;  }							
#menunav a.resources  						{background-position: -460px 0; width: 136px;}
#menunav a.activities  					{background-position: -596px 0; width: 125px;  }
#menunav a.kidz-club 						{background-position: -721px 0; width: 122px;  }
#menunav a.contact  						{background-position: -843px 0; width: 117px;  }

#menunav a.home:hover						{background-position: 0px -98px;}
#menunav a.about:hover					{background-position: -111px -98px;}
#menunav a.products:hover					{background-position: -212px -98px;}
#menunav a.retailers:hover				{background-position: -336px -98px;}
#menunav a.resources:hover				{background-position: -460px -98px;}
#menunav a.activities:hover				{background-position: -596px -98px;}
#menunav a.kidz-club:hover				{background-position: -721px -98px;}
#menunav a.contact:hover					{background-position: -843px -98px;}

body.home #menunav a.home					{background-position: 0px -196px; cursor: default;}	
body.about #menunav a.about				{background-position: -111px -196px; cursor: default;}
body.products #menunav a.products		{background-position: -212px -196px; cursor: default;}
body.retailers #menunav a.retailers		{background-position: -336px -196px; cursor: default;}
body.resources #menunav a.resources		{background-position: -460px -196px; cursor: default;}
body.activities #menunav a.activities 	{background-position: -596px -196px; cursor: default;}
body.kidz-club #menunav a.kidz-club 		{background-position: -721px -196px; cursor: default;}
body.contact #menunav a.contact 			{background-position: -843px -196px; cursor: default;}



/* End Menu Nav */

/* Header */


#header { background: url(/images/header_bg.jpg); text-align: center; height: 218px;}

#headerBg { background: url(/images/header_center_bg.jpg) top center no-repeat; text-align: center; height: 218px; }

#headerInner { margin: 0 auto; text-align: center; width: 960px; padding-top: 14px; position: relative;} 

/* Content */

#content { width: 960px; text-align: left; margin: 0 auto; background: #fff;height:100%; padding: 10px 0 ;   }

#content  p { }

.heroShot { display: block; } 



/* Footer */

#footer { background: url(/images/bg-bottom.gif); text-align: center; margin: 0;}

#footerInner { margin: 0 auto; height: 67px; width:960px; background: url(/images/bg-footer-content.gif) repeat-x;   }

#footerInner p { margin: 0; padding-top: 10px; font: 11px/17px verdana, sans-serif; color: #808692; padding-bottom: -2px; }

#footerInner a { color: #808692; }

#footerInner a:hover { color: #008ae9; }



/* Home Panels */

#left { width: 215px; margin-left: 35px; float: left; min-height: 10px; }

#center { width: 400px; margin-left: 28px; float: left;  min-height: 10px; }

#right { width: 215px; margin-left: 28px; float: left; min-height: 10px;  }

#subLeft { width: 266px; float: left; min-height: 10px; }

#subCenter { width: 427px; float: left;  min-height: 10px; }

#subRight { width: 200px; margin-left: 35px; float: left; min-height: 10px;  }


/* Side Panel */

#sidepanelTop { background: url(/images/sidepaneltop_bg.jpg); height: 23px; width: 200px; }
#sidepanel { background: url(/images/sidepanel_bg.jpg) bottom left; min-height: 256px; width: 200px; }

/* Formatting */

h1 { margin-top: 15px;  font: 22px/25px Georgia, serif;  }
h2 { font: 16px/22px Georgia, serif; color: #a9cc52;  }
h3 { font: 14px/19px Georgia, serif;  color: #f27321; margin: 5px 0 0 0; }

#left h1, #subLeft h1, #subRight h1 { color: #009ade;  }
#left a, #subLeft a, #subCenter a { color: #009ade;  font-weight: bold; text-decoration: underline; }
#left a:hover, #subCenter a:hover { color: #007dd5;  font-weight: bold; text-decoration: underline; }

#subRight a { color: #009ade;  font-weight: bold; text-decoration: none; }
#subRight p { color: #009ade;  font-weight: bold; text-decoration: none; }


#center h1, #subCenter h1 { color: #a4c947;  }
#center a { color: #a4c947;  font-weight: bold; text-decoration: underline; }
#center a:hover { color: #7ab000;  font-weight: bold; text-decoration: underline; }

#products-small { float: left; width: 140px; padding-bottom: 20px; }
#products-small h3 { font: 14px/19px Georgia, serif;  color: #009ade; margin: 5px 0 0 0; }
#products-small h3:hover { font: 14px/19px Georgia, serif;  color: #007dd5; margin: 5px 0 0 0; }
#products-small a { font: 14px/19px Georgia, serif;  color: #009ade; margin: 5px 0 0 0; }
#products-small a:hover { font: 14px/19px Georgia, serif;  color: #007dd5; margin: 5px 0 0 0; }

#right h1 { color: #f27321; }
#right a { color: #f27321;  font-weight: bold; text-decoration: underline; }
#right a:hover { color: #f04b00;  font-weight: bold; text-decoration: underline; }

#copy p { font: 12px/20px verdana, sans-serif; color: #808692; }

a.readmore { background: url(/images/readmore.gif) no-repeat 0 4px; padding-left: 15px; }
a.readmore-blue { background: url(/images/readmore-blue.gif) no-repeat 0 4px; padding-left: 15px; }

#sidepanel a { font-weight: normal; text-decoration: none; }
#sidepanel a:hover { font-weight: normal; color: #007dd5; text-decoration: underline; }
#sidepanel p { color: #009ade; text-align: center; margin-top: 0;text-decoration: none; }



/* Activities */

.activity a  { width: 137px; padding: 120px 0 0 5px; height: 70px; display: block; float: left; text-align: center; font: normal 14px/19px Georgia, serif !important;  color: #f27321 !important; }

.activity a:hover { text-decoration: underline !important; } 

.rainy a { background: url(/images/actbtn_rainy.gif) no-repeat top center; }
.rainy a:hover { background: url(/images/actbtn_rainy_hover.gif) no-repeat top center; }

.party a { background: url(/images/actbtn_party.gif) no-repeat top center; }
.party a:hover { background: url(/images/actbtn_party_hover.gif) no-repeat top center; }

.plants a { background: url(/images/actbtn_plants.gif) no-repeat top center; }
.plants a:hover { background: url(/images/actbtn_plants_hover.gif) no-repeat top center; }

.animals a { background: url(/images/actbtn_animals.gif) no-repeat top center; }
.animals a:hover { background: url(/images/actbtn_animals_hover.gif) no-repeat top center; }

.science a { background: url(/images/recbtn_science.gif) no-repeat top center; }
.science a:hover { background: url(/images/recbtn_science_hover.gif) no-repeat top center; }

.interest a { background: url(/images/recbtn_interest.gif) no-repeat top center; }
.interest a:hover { background: url(/images/recbtn_interest_hover.gif) no-repeat top center; }

.aid a { background: url(/images/recbtn_aid.gif) no-repeat top center; }
.aid a:hover { background: url(/images/recbtn_aid_hover.gif) no-repeat top center; }




.actsml { margin-left: 20px; display: block; padding: 3px 0 20px 35px; color:#747a87 !important;font: normal 11px/16px verdana, sans-serif !important;  } 
.actsml:hover { color: #009ade !important; }

.rainySml { background: url(/images/actsml_rainy.gif) no-repeat; }
.rainySml:hover { background: url(/images/actsml_rainy_hover.gif) no-repeat; }

.partySml { background: url(/images/actsml_party.gif) no-repeat; }
.partySml:hover { background: url(/images/actsml_party_hover.gif) no-repeat; }

.plantsSml { background: url(/images/actsml_plants.gif) no-repeat; }
.plantsSml:hover { background: url(/images/actsml_plants_hover.gif) no-repeat; }

.animalsSml { background: url(/images/actsml_animals.gif) no-repeat; }
.animalsSml:hover { background: url(/images/actsml_animals_hover.gif) no-repeat; }

.scienceSml { background: url(/images/ressml_science.gif) no-repeat; }
.scienceSml:hover { background: url(/images/ressml_science_hover.gif) no-repeat; }

.interestSml { background: url(/images/ressml_interest.gif) no-repeat; }
.interestSml:hover { background: url(/images/ressml_interest_hover.gif) no-repeat; }

.aidSml { background: url(/images/ressml_aid.gif) no-repeat; }
.aidSml:hover { background: url(/images/ressml_aid_hover.gif) no-repeat; }

.handSml { background: url(/images/prodsml_shorttools.gif) no-repeat; }
.handSml:hover { background: url(/images/prodsml_shorttools_hover.gif) no-repeat; }

.longSml { background: url(/images/prodsml_longtools.gif) no-repeat; }
.longSml:hover { background: url(/images/prodsml_longtools_hover.gif) no-repeat; }

.canSml { background: url(/images/prodsml_wateringcan.gif) no-repeat; }
.canSml:hover { background: url(/images/prodsml_wateringcan_hover.gif) no-repeat; }

.gloveSml { background: url(/images/prodsml_glovesr.gif) no-repeat; }
.gloveSml:hover { background: url(/images/prodsml_gloves_hover.gif) no-repeat; }

.wheelbarrowSml { background: url(/images/prodsml-wheelbarrow.png) no-repeat; }
.wheelbarrowSml:hover { background: url(/images/prodsml-wheelbarrow-hover.png) no-repeat; }

.bucketSml { background: url(/images/prodsml-bucket.png) no-repeat; }
.bucketSml:hover { background: url(/images/prodsml-bucket-hover.png) no-repeat; }


/**************Social Media Buttons**************/
#sMedia {
	display: block;
	position: absolute;
	top: 45px;
	right: 35px;
}
.sMedia {
    background: url("/images/social-media-spr.png") no-repeat scroll 0 0 transparent;
    display: block;
    float: left;
    margin: 0 5px;
    padding: 0;
    height: 35px;
    width: 35px;
}
.sMedia span {
    display: none;
    visibility: hidden;
}
.sMedia.facebook {
    background-position: 0 0;
}
.sMedia.facebook:hover {
    background-position: 0 -35px;
}
.sMedia.twitter {
    background-position: -41px 0;
}
.sMedia.twitter:hover {
    background-position: -41px -35px;
}
.sMedia.youtube {
    background-position: -82px 0;
}
.sMedia.youtube:hover {
    background-position: -82px -35px;
}

