@charset "utf-8";
body  {
	font: 70% Arial, Verdana, Helvetica, sans-serif;
	background: #efefef url(../images/Tan.jpg);
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;


	
}

A:link { color: #006600 }          /* unvisited link */
A:visited { color: #006600 }        /* visited links */
A:active { color: lime }        /* active links */
A:hover { color: #006600; background:white }        /* active links */

#topbar{
	background:#a6d7ff url(../images/sky_bg_new.jpg);
	width:100%;
	height:78px;
	text-align:center;
}

#container { 
	width: 1000px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	background: #FFFFFF;
	margin: 0px auto; /* the auto margins (in conjunction with a width) center the page */
	border:0px;
	text-align: left; /* this overrides the text-align: center on the body element. */
} 



.wrapper{
   position: relative;
   float: left;
   left: 0.00%;
   width: 100.00%;
   
}




.left1{
   position: relative;
   float: left;
   left: 0.50%;
   width: 23.00%;
}
.left1 a{
	text-decoration:none;
}
.left1 img{
	text-decoration:none;
	border:0px;
}
.left2{
   position: relative;
   float: left;
   left: 1.50%;
   width: 52.00%;
   text-align:left;
}
.left2L{
	width:53px;
	float:left;
}
.left2R{
	width:400px;
	float:right;
	margin-top:-5px;
	text-align:right;
}
.left2 a{
	text-decoration:none;
}
.left2 img{
	text-decoration:none;
	border:0px;
}
.right{
   position: relative;
   float: right;
   right: 0.50%;
   width: 22.00%;
   text-align:right;
}

#welcome{
	font-size:11px;
	margin:0px;
}
#moreInformation{
	text-align:center;
	margin-top:10px;
	font-size:17px;
	margin-bottom:0px;
	margin-right:10px;
}



#maintab ul{
	margin: 0;
	padding:0;
}
.basictab{
	margin:0;
	padding:0;
	font-size: 12px;
	font-weight:bold;
	list-style-type: none;
	text-align: left; /*set to left, center, or right to align the menu as desired*/
}

.basictab li{
	display: inline;
	margin: 0;
	padding:0;
}

.basictab li a{
	text-decoration: none;
	padding-right: 0px ;
	padding-left:0px;
	margin-right: 0px;
	color: black;
}


.basictab li a:visited{
	color: black;
}

.basictab li a:hover{
	color: #006600;
}

.basictab li a:active{
	color: #009900;
}

.basictab li.selected a{ /*selected tab effect*/
	color: #006600;
}


.submenustyle{
	/*border: 1px solid black;*/
	padding-top:8px;
	padding-bottom:2px;
	color:#000;
	background-color: #eee;
	display: none;
	filter:alpha(opacity=0);
	-moz-opacity:0;
	text-align:center;
}

* html .submenustyle{ /*IE only width definition*/
	/*width: 90%;*/
}

.submenustyle a{
	color:#000;
	font-weight:bold;
	text-decoration: none;
}

.submenustyle a:hover{
	color:#006600;
	/*background-color: #ebffff;*/
}


#about{
	margin-left:-4px;
	width:487px;
	background: #fff url(../images/nav_about.gif) no-repeat;
}

#landscaping{
	margin-left:12px;
	width:419px;
	background: #fff url(../images/nav_landscaping.gif) no-repeat;
}

#playgrounds{
	margin-left:6px;
	width:462px;
	background: #fff url(../images/nav_playgrounds.gif) no-repeat;
}

#uses{
	margin-left:0px;
	width:462px;
	background: #fff url(../images/nav_playgrounds.gif) no-repeat;
}


#safety{
	margin-left:0px;
	width:436px;
	background: #fff url(../images/nav_safety.gif) no-repeat;
}

#products{
	margin-left:0px;
	width:445px;
	background: #fff url(../images/nav_products.gif) no-repeat;
}

#gallery{
	margin-left:260px;
	width:103px;
	background: #fff url(../images/nav_gallery.gif) no-repeat;
}

#calculators{
	margin-left:190px;
	width:282px;
	background: #fff url(../images/nav_calculators.gif) no-repeat;
}

#contact{
	margin-left:266px;
	width:204px;
	background: #fff url(../images/nav_contact.gif) no-repeat;
}




#feature {
	clear: both;
   	width: 940px;
	height:330px;
	margin-left:auto;
	margin-right:auto;
	background: #f1f1f1;
	/*background: #f1f1f1 url(../images/feature_kids.jpg) no-repeat;
	background-position: center center;*/
	/*<div style="width:940px;height:330px; background: #ff0 url(images/feature_kids.jpg);"></div>*/
}
#feature img{
	margin:0px;}

#feature h1{
	margin:0;
	font-family:Arial, Helvetica, sans-serif;
	letter-spacing:1px;
	font-size:22px;
	font-weight:500;
	color:#FFF;
	text-shadow: #333 2px 2px 2px;
}
#feature h2{
	margin:0;
	font-family:Arial, Verdana, Helvetica, sans-serif;
	letter-spacing:1px;
	font-size:18px;
	font-weight:bold;
	color:#FFF;
	text-shadow: #333 2px 2px 2px;
}
#featureTop{
	text-align:right;
	padding-top:16px;
	padding-right:20px;
}

#featureBottom{
	text-align:left;
	margin-top:190px;
	padding-left:20px;
}
#cse-search-box{
	margin-top:5px;
	margin-bottom:5px;
}
#cse-search-box input{
	margin:0px;
	width:130px;
	
}




.header{
   width: 940px;
   left: 30px;
	margin-top:10px;
	clear: both;
   float: left;
   position: relative;
   background-color:#fff;
}

#pinnacleLogo{
	position:absolute;
	z-index:99;
	top:-84px;
	right:-20px;
}

.colmask{
	margin-top:10px;
   width: 95%;
   left: 2%
}
.colmid{ right: 25% }
.colin{ right: 25% }
.colleft{ right: 25% }
.col1{
   width: 24%;
   left: 101%
}
.col2{
   width: 24%;
   left: 27%
}
.col3{
   width: 24%;
   left: 76%
}
.col1and3{
   width: 49%;
   left: 101%
}
.col4{
   width: 24%;
   left: 78%
}

.colmask{
   clear: both;
   float: left;
   overflow: hidden;
   position: relative;
   background-color: #fff
}
.colmid{
   float: left;
   width: 100%;
   position: relative;
   background-color: #fff
}
.colin{
   float: left;
   width: 100%;
   position: relative;
   background-color: #fff
}
.colleft{
   float: left;
   width: 100%;
   position: relative;
   background-color: #fff
}
.col1{
   padding: 0px 0px 1em 0px;
   overflow: hidden;
   float: left;
   position: relative;
   background-color: #f1f1f1
}
.col2{
   padding: 0px 0px 1em 0px;
   overflow: hidden;
   float: left;
   position: relative;
   background-color: #f1f1f1
}
.col3{
   padding: 0px 0px 1em 0px;
   overflow: hidden;
   float: left;
   position: relative;
   background-color: #f1f1f1
}
.col1and3{
   padding: 0px 0px 1em 0px;
   overflow: hidden;
   float: left;
   position: relative;
   background-color: #f1f1f1
}
.col4{
   padding: 0px 0px 1em 0px;
   overflow: hidden;
   float: left;
   position: relative;
   background-color: #f1f1f1
}
.colContent{
	padding-top:10px;
	padding-left:10px;
	padding-right:10px;
	text-align:center
}

.colContent h2{
	color:#336600;
	font-size:130%;
	margin-top:10px;
	margin-bottom:6px;
	text-align:left;
}

.colContent p{
	margin:0;
	padding:0;
	text-align:left;
}
.colContent img{
	margin:0px;
	padding:0px;
	text-decoration:none;
}

.lcolmask{
	clear:both;
	margin-top:10px;
   width: 940px;
   margin-left: 30px;
}
.lcol1{
	float:left;
	width:700px;
	border:1px solid #4a8448;
	height:160px;
}
.lcol1header{
	width:700px;
	background: #4a8448;
	text-align:center;
	color:#FFF;
	font-size:13pt;
	font-weight:bold;
	height:21px;
	line-height:21px;
}
.rcol1header{
	width:228px;
	background: #4a8448;
	text-align:center;
	color:#FFF;
	font-size:13pt;
	font-weight:bold;
	height:21px;
	line-height:21px;
	text-decoration:none;
	color:white;
}
.rcol1header a{
	text-decoration:none;
	color:white;
	background:green;
}
.lcol2{
	float:right;
	width:228px;
	text-align:center;
	font-size:10pt;
}
.lcol1 p{
	margin-left:5px;
	margin-right:5px;
	margin-top:9px;
	margin-bottom:0px;
	font-size:10pt;
}

.lcol1 a{
	color:#000;
	font-size:10pt;
}

.featureContent{
	padding-top:5px;
	padding-left:5px;
	padding-right:0px;
	text-align:left;
	text-decoration: none;
	background-color:#fafae6;
	width: 360px;
}

.featureContent a{
	font-size: inherit;
	text-decoration: none;
	background-color:#fafae6;
}


#maingallery {
	width: 321px;
	height:31px;
	background: url(../images/mulchie-6-gallery.jpg) no-repeat;
	float: left;
   position: relative;
   margin-left:15px;
   margin-top:15px;
}
#maingallery a{
	display:block;
	width: 321px;
	height:31px;
}
#maingallery a:hover {
	width: 321px;
	height:31px;
	background: url(../images/mulchie-6-gallery_over.jpg) no-repeat;
}

#maingallery span {
	display: none;
}


#mainstore {
	width: 183px;
	height:31px;
	background: url(../images/mulchie-6-store.jpg) no-repeat;
	float: left;
   position: relative;
   margin-top:15px;
}


#mainstore a{
	display:block;
	width: 183px;
	height:31px;
}
#mainstore a:hover {
	width: 183px;
	height:31px;
	background: url(../images/mulchie-6-store_over.jpg) no-repeat;
}

#mainstore span {
	display: none;
}

#mainpickup {
	width: 225px;
	height:31px;
	background: url(../images/mulchie-6-pickup.jpg) no-repeat;
	float: left;
   position: relative;
   margin-top:15px;
}


#mainpickup a{
	display:block;
	width: 225px;
	height:31px;
}
#mainpickup a:hover {
	width: 225px;
	height:31px;
	background: url(../images/mulchie-6-pickup_over.jpg) no-repeat;
}

#mainpickup span {
	display: none;
}





#mainContent{
   clear: both;
   overflow: hidden;
   width: 940px;
	margin-left:auto;
	margin-right:auto;
   background: #fff url(../images/grey_side_bar.gif) repeat-y;
}

#contentLeft{
	width:215px;
	position: relative;
	float:left;
	/*margin-bottom:20px;*/
   background-color: #f1f1f1;
   text-align:center;
}

#contentLeft p{
	margin-top:5px;
	margin-bottom:5px;
}

#usageCalculator{
	width:207px;
	margin:0px;
	padding:0px;
	margin-left:auto;
	margin-right:auto;
	background-color: #ababab;
}
	
#usageCalculatorInner{
	margin-left:1px;
	margin-right:1px;
	/*width:205px;*/
	height:200px;
	padding:0px;
	background-color: #fff;
	color:#000;
	padding-left:5px;
	padding-right:5px;
	text-align:left;

}

#mulchCalculatorLeft{
	float:left;
	left:3px;
	width: 80px;
	position: relative;
	text-align:center;
	font-weight:bold;
}

#mulchCalculatorRight{
	float:right;
	right: 7px;
	width: 100px;
	position: relative;
	text-align:center;
	font-weight:bold;
	padding-bottom:10px;
}

#usageCalculator h2{
	margin:0;
	font-size:18px;
	color:#006600;
}
#usageCalculator h3{
	margin:0;
	font-size:14px;
}
#mulchNeeded h3{
	margin:0;
	font-size:14px;
}

#usageCalculator p{
	margin-top:0;
}

#squareFeet{
	width:40px;
}

.mulchNeeded{
	margin-left:10px;
}

#contentRight{
	width:716px;
	position: relative;
	float:right;
	/*margin-bottom:20px;*/
	background-color: #f1f1f1;
}

#contentNav{
	margin-top:-5px;
	font-family: Arial, Verdana, sans-serif;
	font-size: 10px;
	
}

#contentNav h4{
	margin:0px;
}

#contentNav a{ 
	text-decoration:none;
  	color: #999; 
}

#contentNav a:hover {
	text-decoration:underline;
  	color: #333;
}

#contentRightInner{
	margin:5px;
	background-color: #fff;
	position: relative;
	padding:5px;
	font-size:14px;
	line-height:24px;
}
#contentRightInner h1{
	font-size:22px;
	color:#006600;
	margin-top:-15px;
}
#contentRightInnerLeft h1{
	font-size:22px;
	color:#006600;
	margin-top:-15px;
}
#pageTitle{
	font-size:22px;
	color:#006600;
	margin-top:-15px;
	margin-bottom:4px;
}
#contentRightInnerWrap{
	clear: both;
	overflow: hidden;
   position: relative;
	margin:5px;
	width:696px;
	padding:5px;
	background-color: #fff;
	font-size:14px;
	line-height:24px;
}
#contentRightInnerLeft{
	width:486px;
	position: relative;
	float:left;
	font-size:14px;
	line-height:21px;
	a:link {color: #}

}

#contentRightInnerLeftNoHighlights{
	width:660px;
	position: relative;
	float:left;
	font-size:14px;
	line-height:21px;
	a:link {color: #}

}


#contentRightInnerRight{
	width:190px;
	position: relative;
	float:right;
}
#rightInfoBox{
	width:190px;
	margin:0px;
	padding:0px;
	background-color: #006600;
}
#rightInfoBox img{
	margin:0px;
}

#rightInfoBox h2{
	color:#FFF;
	font-size:14px;
	margin:0px;
	margin-top:-5px;
	text-align:center;
}
#rightInfoBox li{
	margin-left:-25px;
}
#rightInfoBoxInner{
	width:178px;
	font-size:11px;
	margin-left:2px;
	padding:4px;
	line-height: 13px;
	background-color: #f1f1f1;
}


.gallery{
	
}

.gallery a{
	text-decoration:none;
}
.gallery a:hover{
	text-decoration:underline;
}

TABLE.productListing {
  border: 1px;
  border-style: solid;
  border-color: #b6b7cb;
  border-spacing: 1px;
}

.productListing-heading {
  font-family: Arial, Verdana, sans-serif;
  font-size: 10px;
  background: #b6b7cb;
  color: #FFFFFF;
  font-weight: bold;
}

TD.productListing-data {
  font-family: Arial, Verdana, sans-serif;
  font-size: 10px;
  background: #f1f1f1;
  line-height: 14px;
}




#footer{
   clear: both;
   width: 940px;
	margin-left:auto;
	margin-right:auto;
   background-color: #fff;
   padding-top:10px;
}

#footerLeft{
	margin-top:10px;
	width:428px;
	position: relative;
	float:left;
	margin-bottom:10px;
	
}

#footermiddle{
	margin-top:10px;
	width:172px;
	position: relative;
	float:left;
	margin-bottom:10px;
	background-color: #fff;
	border: black;
	
}


#footerRight{
	margin-top:10px;
	width:250px;
	position: relative;
	float:right;
	text-align:right;
	margin-bottom:10px;
}


#footerLinks{
   width: 940px;
   background-color: #f2f2f2;
   border:1px solid #999999;
   color:#666666;
   font-size:8pt;
   
   line-height:14pt;
}

#footer h4{
	font-size:11pt;
	margin-bottom:5px;
	margin-top:5px;
}
#footer p{
	margin:0px;
}


#footer a{
	text-decoration:none;
	color:#666666;
}

#footerL1{
	width:32%;
	float:left;
	margin-left:1%;
}
.newsLine{
	line-height:normal;
	padding-top:2px;
	padding-bottom:4px;
}
#footerL2{
	width:16%;
	float:left;
	margin-left:2%;
}
#footerL3{
	width:20%;
	float:left;
	margin-left:1%;
}

#footerR1{
	width:24%;
	float:right;
}
#footerR1 img{
	margin-right:3px;
}


#footerNav{
	clear:both;
	text-align:center;
	margin-bottom:10px;
}

.bottom{
   clear: both;
   width: 100%;
   float: left;
   position: relative;
   background-color: #fff;
   border:2px solid #757474;
}
.clear {
	clear:both;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}