/* --------------------------------------------
|  GLOBAL STYLES											
--------------------------------------------- */
html { border: none; }

body {
	margin: 0;
	padding: 0;
	line-height: 16px; 
	background: #b1aa85 url(graphics/bg_body.jpg) 50% 0 repeat-x;
}

body, td {
	font-size: 11px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	color: #666;
}

img {border: 0;}
p {margin: 0 0 15px 0;}

br.clearBoth {
	clear: both;
	line-height: 0;
	font-size: 0;
}

h1, h2, h3, h4, h5, form {margin: 0;}

/* --------------------------------------------
|  NAVIGATION												
--------------------------------------------- */

#primaryNav {
	margin: 83px 0 0 454px;
	position: absolute;
	padding: 0;
	list-style: none;
	}
	#primaryNav li { float: left; }
		#primaryNav li a {
			position: absolute;
			outline: none;
			display: block;
			text-indent: -9999px;
			text-decoration: none;
			}
			#plHome {
				margin: 25px 0 0 0;
				width: 90px;
				height: 44px;
				background: url(graphics/nav/pl_home.gif) no-repeat;
				}
				#plHome:hover,
				li.current #plHome { background-position: 0 -44px; }
			#plBoys {
				margin: 4px 0 0 76px;
				width: 90px;
				height: 44px;
				background: url(graphics/nav/pl_boys.gif) no-repeat;
				}
				#plBoys:hover,
				li.current #plBoys { background-position: 0 -44px; }
			#plGirls {
				margin: 26px 0 0 152px;
				width: 90px;
				height: 44px;
				background: url(graphics/nav/pl_girls.gif) no-repeat;
				}
				#plGirls:hover,
				li.current #plGirls { background-position: 0 -44px; }
			#plFamily {
				margin: 0 0 0 220px;
				width: 114px;
				height: 44px;
				background: url(graphics/nav/pl_family.gif) no-repeat;
				}
				#plFamily:hover,
				li.current #plFamily { background-position: 0 -44px; }
			#plAccessories {
				margin: 29px 0 0 317px;
				width: 138px;
				height: 39px;
				background: url(graphics/nav/pl_accessories.gif) no-repeat;
				}
				#plAccessories:hover,
				li.current #plAccessories { background-position: 0 -39px; }


#subNav {}

/* --------------------------------------------
|  COLOR SCHEMES!											
--------------------------------------------- */
#SBProductDescription strong { background: #9dd750; }


body.blue #header { background-image: url(graphics/bg_header_blue.jpg);	   }
body.blue .crTitle { background-image: url(graphics/bg_rounded_blue.gif);	}
body.blue #footer { position: relative; background-image: url(graphics/bg_footer_blue.jpg);	   }
body.blue #bAccount { background-position: 0 -49px; }
body.blue #bCart { background-position: -116px -49px; }
body.blue #SBProductDescription strong { background: #3f99d4; }

body.pink #header { background-image: url(graphics/bg_header_pink.jpg);	   }
body.pink .crTitle { background-image: url(graphics/bg_rounded_pink.gif);	}
body.pink #footer { position: relative; background-image: url(graphics/bg_footer_pink.jpg);	   }
body.pink #bAccount { background-position: 0 -98px; }
body.pink #bCart { background-position: -116px -98px; }
body.pink #SBProductDescription strong { background: #fc709a; }

body.purple #header { background-image: url(graphics/bg_header_purple.jpg);	}
body.purple .crTitle { background-image: url(graphics/bg_rounded_purple.gif);	}
body.purple #footer { position: relative; background-image: url(graphics/bg_footer_purple.jpg);	}
body.purple #bAccount { background-position: 0 -147px; }
body.purple #bCart { background-position: -116px -147px; }
body.purple #SBProductDescription strong { background: #8d4ebb; }

body.orange #header { background-image: url(graphics/bg_header_orange.jpg);	}
body.orange .crTitle { background-image: url(graphics/bg_rounded_orange.gif);	}
body.orange #footer { position: relative; background-image: url(graphics/bg_footer_orange.jpg);	}
body.orange #bAccount { background-position: 0 -196px; }
body.orange #bCart { background-position: -116px -196px; }
body.orange #SBProductDescription strong { background: #ffb132; }

/* --------------------------------------------
|  STRUCTURE												
--------------------------------------------- */

#siteContainer {
	width: 960px;
	margin: 0 auto;
	text-align: left;
	}

/* -- HEADER -- */
#header {
	margin: 0 3px 0 7px;
	height: 158px;
	background: url(graphics/bg_header_green.jpg) no-repeat;
	}
	#logo {
		position: absolute;
		width: 385px;
		height: 140px;
		text-indent: -9999px;
		margin: 10px 0 0 45px;
		}
	#bAccount, #bCart {
		background-image: url(graphics/action_nav_matrix.jpg);
		background-repeat: no-repeat;
		height: 49px;
		position: absolute;
		}
	#bAccount {
		width: 116px;
		margin: 11px 0 0 714px;
		}
	#bCart {
		width: 95px;
		background-position: -116px 0;
		margin: 11px 0 0 830px;
		}

/* -- BODY -- */
#contentArea {
	margin: 0 0 0 7px;
	background: url(graphics/bg_content_area_tile.gif) 12px 0 repeat-y;
	}
	#contentAreaBottom { background: url(graphics/bg_content_area_bottom.gif) 0 100% no-repeat; }
			
	#homeLeft {
		width: 743px;
		float: left;
		background: url(graphics/bg_content_area_top.gif) no-repeat;
		}
		#homeLeft .pad {
			padding: 23px 6px 28px 32px;
			}
			#flashHolder {
				width: 705px;
				height: 311px;
				background: url(graphics/bg_flash.gif) no-repeat;
				}
				#flashPad { padding: 15px 0 0 15px; }
				#flashHolder p {
					color: #FFF;
					text-align: center;
					font-weight: bold;
					line-height: 30px;
					margin-top: 120px;
					}
			#bhShopByBrand {
				position: absolute;
				margin: 171px 0 0 77px;
				width: 129px;
				height: 73px;
				background: url(graphics/bh_shop_by_brand.jpg) no-repeat;
				}
				#bhShopByBrand:hover { background-position: -129px 0; }
			#bhShopByConscience {
				position: absolute;
				margin: 74px 0 0 24px;
				width: 108px;
				height: 69px;
				background: url(graphics/bh_shop_by_conscience.jpg) no-repeat;
				}
				#bhShopByConscience:hover { background-position: -108px 0; }
			#bhDidYouKnow {
				position: absolute;
				margin: 249px 0 0 20px;
				width: 82px;
				height: 90px;
				background: url(graphics/bh_did_you_know.jpg) no-repeat;
				}
				#bhDidYouKnow:hover { background-position: -82px 0; }
				
			#homeContent {
			color:#666;
				}
				#homeContentPad {
					padding: 10px 0 0 0;
					width: 471px;
					float: left;
					}
				#homeTags {
					background: url(graphics/home_tags.jpg) no-repeat;
					width: 234px;
					float: left;
					height: 370px;
					}
	#colLeft {
		width: 210px;
		float: left;
		background: url(graphics/bg_content_area_top.gif) no-repeat;
		}
		#colLeft .pad {
			padding: 35px 0 25px 0;
			}
			#secondaryNav {
				background: url(graphics/lh_white_rounded.gif) no-repeat;
				padding: 0 0 0 0;
				}
				#secondaryNav .crTitle {
					background-position: 1px 1px;
					}
			#secondaryNav ul {
				margin: 1px 34px 0 19px;
				padding: 0;
				background: #e9f6fc;
				border-bottom: 1px solid #b5d4e2;
				list-style: none;
				}
				#secondaryNav ul li.active {
					font-weight: bold;
					}
				#secondaryNav ul li {
					line-height: 25px;
					background: url(graphics/bg_snav_li.gif) 0 100% repeat-x;
					margin: 0 9px;
					padding: 0;
					}
					#secondaryNav ul ul {
						margin: 0 10px 0 20px;
						padding: 0;
						}
						#secondaryNav ul ul li {
							padding: 0;
							margin: 0;
							}
					#secondaryNav ul li.noDots { background: none; }
					#secondaryNav ul li a {
						color: #7739a4;
						text-decoration: none;
						}
						#secondaryNav ul li a:hover {
							background: #DAF0FA;
							}
	.noLeft #colMid {
		width: 743px;
		background-position: 0 0;
		}
		.noLeft #colMid .pad {  padding-left: 32px; }
	#colMid {
		width: 533px;
		float: left;
		background: url(graphics/bg_content_area_top.gif) -210px 0 no-repeat;
		}
		#colMid .pad {
			padding: 35px 10px 0 0;
			}	
	#colRight {
		width: 208px;
		float: left;
		background: url(graphics/bg_content_area_top.gif) -743px 0 no-repeat;
		}
		#colRight .pad {
			padding: 12px 12px 60px 0;
			}
			#categories { background: url(graphics/rh_white_rounded.gif) no-repeat; }
			#categories ul {
				margin: 0 0 14px 0;
				padding: 4px 29px 0 28px;
				list-style: none;
				}
				#categories ul li {
					font-size: 14px;
					line-height: 24px;
					background: url(graphics/bg_cnav_dots.gif) 0 100% repeat-x;
					}
					#categories ul li a {
						color: #51302b;
						font-weight: bold;
						text-decoration: none;
						}
						#categories ul li a:hover { text-decoration: underline; }
						
			#search {
				margin: 0 0 14px 0;
				padding: 0 0 0 0;
				background: url(graphics/rh_white_rounded.gif) no-repeat;
				}
				#search form { padding: 8px 0 0 28px; }
				#search .inputText {
					width: 137px;
					margin: 0 0 8px 0;
					}
					#searchSubmit {
						background: url(graphics/rb_search.gif) no-repeat;
						width: 53px;
						height: 19px;
						}
					
			#newsletter {
				margin: 0 0 14px 0;
				padding: 0 0 0 0;
				background: url(graphics/rh_white_rounded.gif) no-repeat;
				}
				#newsletter form { padding: 8px 0 0 28px; }
				#newsletter .inputText {
					width: 137px;
					margin: 0 0 8px 0;
					}
					#newsletterSubmit {
						background: url(graphics/rb_submit.gif) no-repeat;
						width: 58px;
						height: 19px;
						}
	#minHeight {
		width: 1px;
		float: left;
		height: 1160px; /* height: 924px; */
		}
#nativeEnergyLogo {
	position: absolute;
	top: -126px;
	right: 50px;
	width: 122px;
	height: 61px;
	background: url(graphics/logo_native_energy.gif) no-repeat;
	display: block;
	}
#coopAmericaLogo {
	position: absolute;
	top: -210px;
	right: 50px;
	width: 64px;
	height: 72px;
	background: url(graphics/logo_coop_america.gif) no-repeat;
	display: block;
	}			
#greenDirectoryLogo {
	position: absolute;
	top: -316px;
	right: 50px;
	width: 94px;
	height: 94px;
	background: url(graphics/gdm_certification_09.png) no-repeat;
	display: block;
	}
	/* -- FOOTER -- */
#footer {
	position: relative; 
	clear: both;
	font-size: 10px;
	color: #fff;
	background: url(graphics/bg_footer_green.jpg) no-repeat;
	height: 120px;
	}
	#footer a {
		color: #FFF;
		text-decoration: none;
		}
	#poweredBy {
		float: left;
		margin: 19px 0 0 58px;
		font-family: Arial, Helvetica, sans-serif;
		}
	#footerNav {
		margin: 0 30px 4px 0;
		padding: 15px 0 0 0;
		list-style: none;
		text-align: right;
		}
		#footerNav li {
			display: inline;
			color: #FFF;
			font-weight: bold;
			}
			#footerNav li a { margin: 0 4px 0 0; }
		#copyright {
			text-align: right;
			margin: 0 30px 0 0;
			}

#bShopByBrand {
	width: 165px;
	height: 232px;
	background: url(graphics/b_shop_by_brand.jpg) no-repeat;
	margin-left: 19px;
	}
	#bShopByBrand:hover { background-position: -165px 0; }
#bShopByConscience {
	width: 135px;
	height: 183px;
	background: url(graphics/b_shop_by_conscience.jpg) no-repeat;
	margin-left: 19px;
	}
	#bShopByConscience:hover { background-position: -135px 0; }
/* --------------------------------------------
|  SITE MAP													
--------------------------------------------- */
	
	.siteMapList { margin-top: 15px }
	.siteMapList dt {
		background:url(graphics/ico_folder.gif) 0 4px no-repeat;
		padding-left:20px;
		line-height:20px;
	}
	.siteMapList dd {	
		padding-left:10px;
		margin-left:25px;
		line-height:16px;
		background:url(graphics/sitemap_2nd.gif) no-repeat;
	}
	.siteMapList dd a {	
		color: #666 !important;
		text-decoration:none;
	}
	.siteMapList .bottom { background:url(graphics/sitemap_2nd_bottom.gif) no-repeat; }


/* --------------------------------------------
|  CONTENT SPECIFIC										
--------------------------------------------- */

a {
	color: #7739a4;
	}
a:hover {
	color: #B96CF1;
	}

.clearBoth {clear: both}

.inputText,
.SBInputText {
	border: 1px solid #bbb8b1;
	background: #fffff7;
	font-size: 11px;
	color: #747158;
	}
.bReplace {
	display: block;
	outline: none;
	text-decoration: none;
	text-indent: -9999px;
	}
	
h1,
h3#SBProductTitle {
	font-size: 25px;
	line-height: 33px;
	color: #1f82bb;
	font-weight: normal;
	margin: 0 0 4px 0;
	}
h2 {
	font-size: 12px;
	line-height: 14px;
	margin: 0 0 3px 0;
	color: #1f82bb;
	}
.crTitle {
	height: 38px;
	margin: 0 0 0 0;
	background-image: url(graphics/bg_rounded_green.gif);
	background-repeat: no-repeat;
	background-position: 3px 1px;
	width: 195px;
	}
	.crTitle span {
		display: block;
		margin: 0 17px 0 27px;
		position: relative;
		top: 8px;
		height: 22px;
		color: #FFF;
		}
		
.TitleCategories, .TitleNewsletter, .TitleSearch {
	height: 38px;
	margin: 0 0 0 0;
	background-repeat: no-repeat;
	background-position: 3px 1px;
	width: 195px;
}
.TitleCategories {background-image: url(graphics/bg_title_categories.gif);}
.TitleNewsletter {background-image: url(graphics/bg_title_newsletter.gif);}
.TitleSearch {background-image: url(graphics/bg_title_search.gif);}


		
#colMid ul {
	background: #f6fae7;
	padding: 10px 14px;
	margin: 0 0 15px 0;
	list-style: none;
	border-top: 1px solid #daed8a;
	border-bottom: 1px solid #daed8a;
	}
	#colMid ul li {
		color: #707070;
		background: url(graphics/bullet_green_square.gif) 0 6px no-repeat;
		padding-left: 11px;
		}
/* --------------------------------------------
|  PAGE SPECIFIC											
--------------------------------------------- */
#contactFormStatic {
	}
	#contactFormStatic td {
		text-align: left;
		padding: 3px 10px 3px 0;
		line-height: 20px;
		}
		#contactFormStatic .inputText {
			width: 200px;
			}
		#contactFormStatic select {
			width: 205px;
			}
		#contactFormStatic textarea {
			width: 513px !important;
			height: 120px;
			}
		#contactFormStatic label {
			float: left;
			width: 100px;
			}
		#contactFormStatic .submitRow td { text-align: right; }
		
#logoPadding {
	height: 158px;
	width: 1px;
	clear: both;
	}		

/* --------------------------------------------
|  SIFR!										
--------------------------------------------- */
.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced { visibility: visible !important; }

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] { display: none !important; }

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */
.sIFR-hasFlash h1 { visibility: hidden; }
.sIFR-hasFlash h3#SBProductTitle { visibility: hidden; }
.sIFR-hasFlash .crTitle span { visibility: hidden; }

@media print{
	.sIFR-flash, .sIFR-flash object, .sIFR-flash embed {
		display: none !important;
		height: 0;
		width: 0;
		position: absolute;
		overflow: hidden;
	}
	
	span.sIFR-alternate {
		visibility: visible !important;
		display: block !important;
		position: static !important;
		left: auto !important;
		top: auto !important;
	}
}

.SBProductCont { 
	background: #f1efe8; 
	padding: 10px;
}

#searchForm .SBSearchCont {
	margin: 10px 0 0 375px;
	padding-bottom: 3px;
	
	}
.required {
	font-size: 10px;
	color: #CC0000;
	}
