* { 	/* for ALL elements, make it standard to have no padding or margin */
		margin: 0px;
		padding: 0px;
		border: 0px;
		}

body {
		text-align: left;
		width: 735px;
		font-family: helvetica, arial, geneva, verdana, sans-serif;
		/* would Verdana, Arial, Helvetica, sans-serif be better? */
		font-size: 11px;
		color: #000;
		margin: 0px auto 0px auto;
		}

table {
  		border-collapse: collapse;
  		border-spacing: 0px;
  		padding: 0px;
  		font-size: 11px; /* IE 5 needs font-size speced for all tables (carries over from body) */
}


td	{
		vertical-align: top;
}

ul {
		list-style-position: outside;
		margin-left: 12px;
}

#header {
		width: 735px;  
		height: 107px;
		background-image: url("../images/bg_header.gif");
		background-repeat: no-repeat;
		text-align: right;
		}

		
#header #announce_space { /* space about the header announcement */
		height: 34px;
		}


#header #announce {
		height: 64px;
		text-align: right;
		font-size: 10px;
		color: #7D7D7D;
		}

		
#header #links {
		height: 18px;
		width: 100%;
		}


#header #links .link {
		padding-left: 70px;
		float: right;
}


.vertical_spacer {
		font-size: 3px;
		line-height: 3px;
		height: 6px;
		padding: 0px;
		margin: 0px;
		clear: both;
}


#navigation {
		width: 735px;
		height: 45px;
		background-image: url("../images/bg_nav0.gif");
		background-repeat: repeat-x;
}

#navigation .nav_item {
		height: 45px; 
		background-image: url("../images/bg_nav0.gif");
		background-repeat: repeat-x;
		text-align: center;	
		vertical-align: middle;
		font-size: 16px;
		color: #fff;
		float: left;
		line-height: 42px;
		padding-left: 10px;
		padding-right: 10px; 
}

* html body #navigation .nav_item {
		/* IE HACK! This is only seen by IE - need a width in IE but not in anything else */
		width: 50px;
}

#navigation .nav_item_on {
		height: 45px; 
		background-image: url("../images/bg_nav1.gif");
		background-repeat: repeat-x;
		text-align: center;	
		vertical-align: middle;
		font-size: 16px;
		color: #fff;
		float: left;
		line-height: 42px;
		padding-left: 10px;
		padding-right: 10px; 
}

* html body #navigation .nav_item_on {
		/* IE HACK! This is only seen by IE - need a width in IE but not in anything else */
		width: 50px;
}

#navigation .spacer {
		height: 45px;
		width: 50px;
		background-image: url("../images/bg_nav0.gif");
		background-repeat: repeat-x;
		float: left;
}


#main {
		width: 735px;  
		}

#footer {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		text-align: left;
		padding-left: 185px;
		width: 735px; 
		font-size: 10px;
		color: #7D7D7D; 
		padding-top: 30px;
		padding-bottom: 30px;
		}
		
#footer .links {
		padding-left: 23px;
		float: left;
		}		

.green_heading {
		font-weight: bold;
		font-size: 14px; 
		line-height: 15px; 
		color: #4B730D;
}

.green_box {
		height: 24px;
		line-height: 26px;
		border: 1px solid #779549;
		background-color: #9DAE1D;
		font-weight: bold;
		font-size: 14px; 
		text-transform: uppercase;
		color: #fff; 
		padding-left: 10px;
}

.green_border {
		border-right: 1px solid #779549;
		border-left: 1px solid #779549;
		border-bottom: 1px solid #779549;
}


.blue_box {
		height: 24px; 
		line-height: 26px;
		border: 1px solid #779549;
		background-color: #608CB3;
		font-weight: bold;
		font-size: 14px; 
		text-transform: uppercase;
		color: #fff; 
		padding-left: 10px;
}

.orange_button {
		height: 25px; 
		line-height: 27px; /* to vertically center text */
		width: 120px;
		background-color: #F27A12;
		font-weight: bold;
		font-size: 14px; 
		text-transform: uppercase;
		color: #fff; 
		text-align: center;
}


.green_button {
		height: 25px;
		line-height: 27px; /* to vertically center text */
		width: 120px;
		background-color: #9DAE1D;
		font-weight: bold;
		font-size: 14px; 
		text-transform: uppercase;
		color: #fff; 
		text-align: center;
}

/* twocol is the 2 column layout used on many of the pages with nav on the left and content on the right */

#twocol {
		width: 735px;
		background-image: url("../images/bg_green_col.gif");
		background-repeat: repeat-y;
}

#twocol #left {
		width: 182px;
		float: left;
}

#twocol #left .content {
		line-height: 15px; 
		margin: 30px 10px 10px 10px;
}

#twocol #left .content .heading {
		font-weight: bold;
		font-size: 12px; 
		line-height: 15px; 
		margin: 20px 0px 0px 0px;
		color: #4B730D;
}

#twocol #left .content ul {
		list-style-image: url("../images/bullet.gif");
}

#twocol #right {
		width: 552px;
		float: right;
}

#twocol #right .content {
		line-height: 15px; 
		margin-left: 27px;
		margin-right: 100px;
		margin-bottom: 75px;
}

#twocol #right .content .heading {
		font-weight: bold;
		font-size: 14px; 
		line-height: 15px; 
		color: #4B730D;
}

#how_it_works {
		width: 750px;
		background-image: url("../images/bg_green_col.gif");
		background-repeat: repeat-y;
}

#breadcrumbs {
		height: 34px;
		font-weight: bold;
		font-size: 10px;
		color: #7D7D7D;
}


#cart_table {
		width: 526px;
		border: 2px solid #ccc;
}

#cart_table td {
		height: 32px; 
		border: 1px solid #ccc; 
		vertical-align: middle;
		padding: 2px 5px 2px 10px;
		text-align:left; 
}





