/* Import the page layout styles */
@import url(blocks/sake.css);

/* ============== BASIC RESETS ============== */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	background: transparent;
}
/*table, thead, tbody, tfoot, tr, th, td {
	vertical-align: middle;	
}*/
html, body {
	height: 100%;
	width: 100%;
}
ol, ul {
	list-style: none;
}
address {
	font-style: normal;
}

/* ============== BASIC STYLES ============== */
.clear {
	clear: both;
}
.onepx {
	display: block;
	height: 1px;
	width: 1px;
}
.invisible {
	visibility: hidden;
}

/* ============== PAGE STYLES ============== */



body {
	background: #F1E7CE;
	text-align: center;
	font: normal 14px/120% arial, "Gill Sans MT", Verdana, sans-serif;
	color: #233216;
}

#container {
	margin: 0 auto;
	width: 975px;
}

	#header {}

		#headerBanner {
			background: transparent url(image/banner.jpg) no-repeat left top;
			height: 86px;
			width: 100%;
			position: relative;
			text-align: left;
			margin-bottom: 2px;
		}
		
			#logo {
				float: left;
				height: 66px;
				width: 234px;
			}
				#logo a {
					display: block;
					height: 100%;
					text-indent: -900em;
					text-decoration: none;
				}
				
			#tagline {
				float: left;
				clear: left;
				width: 234px;
				height: 20px;
				text-indent: -900em;
			}
			
			#headerCart {
				position: absolute;
				height: 46px;
				top: 19px;
				right: 6px;
			}
				#headerCart .cart {
					float: left;
					height: 100%;
					margin: 0;
					padding: 0 10px 0 0;
					text-align: center;
					font: normal bold 11px/150% Arial, Helvetica, sans-serif;
					color: #FFF;
				}
					#headerCart .cart img {
						border: none;
						margin-bottom: 5px;
					}
					#headerCart .cart a {
						color: #FFF;
						text-decoration: none;
					}
						#headerCart .cart a:hover,
						#headerCart .cart a:focus {
							color: #FFF;
							text-decoration: underline;
						}
						
		#topNav {
			list-style: none;
			text-align: left;
			display: block;
		}
			#topNav>li {
				display: block;
				float: left;
				position: relative;
				margin-left: 1px;
			}
			#topNav>li:first-child {
				margin-left: 0;
			}
				#topNav>li>a {
					display: block;
					padding: 0 8px;
					font: normal bold 13px/24px arial, "Gill Sans MT", Verdana, sans-serif;
					color: #233216;
					text-decoration: none;
					background: transparent url(image/navSprites.jpg) no-repeat left top;
					width: auto;
					height: 24px;
					position: relative;
				}
				#topNav>li:hover>a,
				#topNav>li:focus>a,
				#topNav>li>a:hover,
				#topNav>li>a:focus {
					background: transparent url(image/navSprites.jpg) no-repeat left 50%;
					color: #9DA373;
				}
				#topNav>li>a:active,
				#topNav>li.current>a {
					background: transparent url(image/navSprites.jpg) no-repeat left bottom;
					color: #FFF;
				}
					#topNav>li>a span {
						display: block;
						height: 24px;
						width: 8px;
						position: absolute;
						top: 0;
						right: 0;
						background: transparent url(image/navSprites.jpg) no-repeat right top;
					}
					#topNav>li.current>a span,
					#topNav>li.current:hover>a span,
					#topNav>li.current:focus>a span {
						background: transparent url(image/navSprites.jpg) no-repeat right bottom;
					}
					#topNav>li:hover span,
					#topNav>li:focus span,
					#topNav>li>a:hover span,
					#topNav>li>a:focus span {
						background: transparent url(image/navSprites.jpg) no-repeat right 50%;
					}
					#topNav>li>a:active span {
						background: transparent url(image/navSprites.jpg) no-repeat right bottom;
					}
					
			/* === Dropdown Styles === */
			#topNav>li ul {
				display: block;
				position: absolute;
				left: 0;
				top: 24px;
				min-width: 9em;
				display: none;
				background: transparent;
				z-index: 900;
				background: none repeat scroll 0 0 #F1E7CE;
				border: 1px solid #000;
				-moz-border-radius: 6px;
				-webkit-border-radius: 6px;
				border-radius: 6px;
				-moz-box-shadow: 6px 4px 10px #666;
			}
			#topNav>li:hover ul,
			#topNav>li:focus ul {
				display: block;
			}
				#topNav>li li {
					padding: 0;
					display: block;
					font: normal bold 13px/100% arial, "Gill Sans MT", Verdana, sans-serif;
					color: #233216;
					/*background: #9DA373;*/
					background: #F1E7CE;
					border-bottom: 1px solid #333;
				}
				/* These two sets are necessary so that the ordinarily
				 * square corners of the secondary <li> tags don't overlap
				 * the newly rounded corners of their parent <ul> tag. This
				 * way the first <li> tag's top corners match its parent and
				 * ditto the bottom one. It's not IE compatible, but neither
				 * are the parent rounded corners, so who cares. */
				#topNav>li li:first-child {
					-moz-border-radius-topright: 6px;
					-moz-border-radius-topleft: 6px;
					-webkit-border-top-right-radius: 6px;
					-webkit-border-top-left-radius: 6px;
					border-top-right-radius: 6px;
					border-top-left-radius: 6px;
				}
				#topNav>li li:last-child {
					-moz-border-radius-bottomright: 6px;
					-moz-border-radius-bottomleft: 6px;
					-webkit-border-bottom-right-radius: 6px;
					-webkit-border-bottom-left-radius: 6px;
					border-bottom-right-radius: 6px;
					border-bottom-left-radius: 6px;
				}
				#topNav>li li:hover,
				#topNav>li li:focus {
					color: #233216;
					background: #9DA373;
				}
				#topNav>li li:active {
					background: #3f3832;
					color: #FFF;
				}
				#topNav>li li.last {
					border-bottom: none;
				}
					#topNav>li li a {
						color: #233216;
						text-decoration: none;
						display: block;
						height: 100%;
						padding: 4px 5px 5px;
					}
					#topNav>li li:hover a,
					#topNav>li li:focus a {
						/*color: #9DA373;*/
						color: #233216;
					}
					#topNav>li li:active a {
						color: #FFF;
					}
					
			/* === Search Bar Styles === */
			#topNav>#searchBar {
				width: 214px;
				height: 24px;
				background: transparent url(image/searchbar.png) no-repeat left top;
			}
				#topNav>#searchBar #headerSearchForm {
					float: left;
				}
				
					#headerSearchForm fieldset {
						width: 130px;
						height: 100%;
					}
					#headerSearchForm #headerSearch {
						float: left;
						position: absolute;
						left: 11px;
						top: 5px;
						height: 13px;
						width: 108px;
						border: none;
						background: transparent;
						padding: 0;
						color: #666;
						font: normal 10px/13px arial, Verdana sans-serif;
					}
					#headerSearchSubmit {
						border: none;
						background: transparent url(image/searchSprites.png) no-repeat left top;
						height: 15px;
						width: 17px;
						position: absolute;
						top: 4px;
						left: 114px;
						text-indent: -900em;
					}
					#headerSearchSubmit:hover,
					#headerSearchSubmit:focus {
						background: transparent url(image/searchSprites.png) no-repeat left 50%;
					}
					#headerSearchSubmit:active {
						background: transparent url(image/searchSprites.png) no-repeat left bottom;
					}
				#topNav>#searchBar #headerSearchAdvanced {
					/* Reset styles inherited from #topNav>li>a */
					background: transparent;
					width: 64px;
					height: 20px;
					position: absolute;
					top: 2px;
					right: 6px;
					text-indent: -900em;
					padding: 0;
				}
				





				
	#pageContentWrapper {
		margin: 2px 0 4px;
		background: transparent url(image/bodyContentTile.png) repeat-y center top;
		width: 100%;
	}
		#pageContentWrapper #topSpacer {
			display: block;
			width: 100%;
			height: 10px;
			line-height: 10px;
			background: transparent url(image/bodyContentTile.png) no-repeat left top;
		}
		#pageContentWrapper #bottomSpacer {
			display: block;
			width: 100%;
			height: 10px;
			line-height: 10px;
			background: transparent url(image/bodyContentTile.png) no-repeat right bottom;
		}
		#pageContentWrapper #sideSearch {
			float: left;
			display: block;
			width: 242px;
			padding: 10px 0 20px 20px;
		}
		#pageContentWrapper #plantpageContent {
			margin-left: 262px;
			padding: 18px 20px 9px 0px;
			text-align: left;
		}
		#pageContentWrapper #pageContent {
			padding: 18px 20px 9px 30px;
			text-align: left;
		}
			#pageContent ul {
				list-style: disc inside url(image/Bullet.gif);
			}
			#pageContent ol {
				list-style: decimal inside none;
			}
				#pageContent ul ul,
				#pageContent ol ul {
					list-style: circle inside url(image/Bullet.gif);
					padding-left: 1em;
				}
				#pageContent ol ol,
				#pageContent ul ol {
					list-style: lower-alpha inside none;
					padding-left: 1em;
				}
					#pageContent ul ul ol,
					#pageContent ul ol ol,
					#pageContent ol ol ol,
					#pageContent ol ul ol {
						list-style: lower-roman inside none;
						padding-left: 1em;
					}
	
	
	#footer {}
		#footer ul {
			display: block;
			width: 100%;
			height: 19px;
			margin: 0 0 5px;
			list-style: none;
			background: transparent url(image/footer.png) no-repeat center top;
			text-align: center;
		}
			#footer li {
				display: inline;
				padding: 0 0 0 0.1em;
				font: normal 11px/18px arial, "Gill Sans MT", Verdana, sans-serif;
				color: #FFF;
			}
				#footer li a {
					text-decoration: none;
					color: #FFF;
				}
				#footer li a:hover,
				#footer li a:focus {
					text-decoration: underline;
				}
				
		#footer #copyright {
			text-align: right;
			font: normal 11px/100% Arial, Verdana, sans-serif;
			color: #9C9484;
			margin-bottom: 5px;
		}
			#footer #copyright a {
				color: #9C9484;
				text-decoration: none;
			}
			#footer #copyright a:hover,
			#footer #copyright a:focus,
			#footer #copyright a:active {
				text-decoration: underline;
			}
			
			
			
			
			
/* tooltip styling. by default the element to be styled is .tooltip  */
.tooltip {
	display:none;
	background:transparent url(image/toolTip.png) no-repeat 50% 50%;
	font-size:11px;
	text-align:justify;
	padding: 72px 90px 0px 90px;
	height:299px;
	width:216px;
	color:#9A9A9A;
	font-family:arial;
	font-size:12px;
	line-height:140%;
	overflow:hidden;
}
 
/* style the trigger elements */
#demo img {
	border:0;
	cursor:pointer;
	margin:0px 8px;
}



.splash-rim {
	background-color: #f1e7ce;
	width: 679px;
	height: 360px;
	float: left;
	margin:8px 0px 10px 27px;
}

.homeSplash {
	width: 679px;
	height: 360px;
	float: left;
	margin:8px 0px 10px 0px;
}

.homeBlockSmall {
	width: 141px;
}

	.homeBlockSmall img {
		-o-border-radius: 0px 0px 8px 8px;
		-moz-border-radius: 0px 0px 8px 8px;
		-webkit-border-radius: 0px 0px 8px 8px;
		border-radius: 0px 0px 8px 8px;
		border: 2px solid #9DA373;
		margin-top: -23px;
	}
	
	.homeBlockSmall h3 {
		-o-border-radius: 8px 8px 0px 0px;
		-moz-border-radius: 8px 8px 0px 0px;
		-webkit-border-radius: 8px 8px 0px 0px;
		border-radius: 8px 8px 0px 0px;
		background-color: #9DA373;
		padding: 4px 0px;
		width: 145px;
	}
	
	

#homeBlockSmallContainer {
	margin: 0px 0px 0px 50px;
}

#socialMedia {
	width:300px;
	margin:10px 0px 20px 0px;
	clear:right;
	float:left;
}

#facebook {
	width:85px;
	float:left;
	text-align:left;
}

#twitter {
	width:85px;
	float:left;
	text-align:center;
	overflow:hidden;
}

#googlePlus {
	width:60px;
	float:left;
	text-align:center;
	overflow:hidden;
	margin-top:3px;
}

#pinterest {
	width:70px;
	float:left;
	text-align:left;
	overflow:hidden;
}