/****************************************************
== Global Reset 
*****************************************************/
html, body, div, span, h1, h2, h3, h4, h5, h6, p, hr, 
blockquote, a, a img, font, img, dd, dl, dt, li, ol, ul,
fieldset, form, label, legend, table, caption, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	line-height: inherit;
	font-family: inherit;
	text-align: left;
	vertical-align: baseline;
	font-size: 100%;
}

ol, ul {
	list-style: none;
}

/*****************************************************
== Global Layout Structure
*****************************************************/

body{
    color: #333;
    text-align: center;
    background: #ececec url(/_img/body-bg.gif) top left repeat-x;
    font-family: Arial, Sans-Serif;
    font-size: 80%;
}

#wrap{
    margin: 0 auto;
    width: 780px;
}

#wrap .head{
    background: url(/_img/header-bg.jpg) top left no-repeat;
    padding-top: 20px;
}

#wrap .content .holder{
    float: left;
    margin-left: 20px;
    display: inline;
}

.lead{width: 400px;}
.supp{width: 340px;}
.full{width: 740px;}

#wrap .content .holder .feature{
    background: url(/_img/feature-top.gif) top left no-repeat;
}

#wrap .content .holder .feature .featureFoot{
    background: url(/_img/feature-btm.gif) bottom left no-repeat;
    padding: 5px 10px 1px 10px;
}

#wrap .content .holder .shop div{
    float: left;
    width: 100%;
    clear: both;
    margin: 0 0 8px 0;
    padding: 0 0 8px 0;
    border-bottom: solid 1px #ccc;
}

/*****************************************************
== top level navigation
*****************************************************/

#wrap .head .nav{
    height: 40px;
    clear:both;
    margin-top: 19px;
}

#wrap .head .nav ul li{
    float: left;
    display: inline;
    margin: 0 15px 0 0;
}

#wrap .head .nav ul li a{
    float: left;
    color: #666;
    text-decoration: none;
    height: 26px;
    padding-left: 8px;
    cursor: pointer;
    font-weight: bold;
}

#wrap .head .nav ul li a span{
    float: left;
    height: 26px;
    padding-right: 8px;
    padding-top: 4px;
}

#wrap .head .nav ul li a:hover, #wrap .head .nav ul li a.on{
     color: #fff;
     background: url(/_img/nav-left.gif) top left no-repeat;
}

#wrap .head .nav ul li a:hover span, #wrap .head .nav ul li a.on span{
     background: url(/_img/nav-right.gif) top right no-repeat;  
}

/*****************************************************
== Footer Nav
*****************************************************/

#wrap .content .foot{
    float: left;
    width: 100%;
    font-size: 85%;
    border-top: solid 2px #7bbf2a;
    padding-top: 5px;
    padding-bottom: 10px;
    margin-top: 10px;
}
#wrap .content .foot ul{
    float: left;
    width: 100%;
    text-align: center;
}
#wrap .content .foot ul li{
    display: inline;
}
#wrap .content .foot ul li a{
    color: #666;
    margin: 0 5px;
}
#wrap .content .foot ul li a:hover{
    text-decoration: none;
}

/*****************************************************
== Text, Links and Images
*****************************************************/

/***** Text ********/

#wrap .content h1{
    color: #000;
    font-size: 130%;
    font-family: Arial Rounded MT Bold, Arial;
    font-weight: bold;
    margin: 10px 0;
}
#wrap .content h1 span{font-size: 140%;}
#wrap .content h1 em{font-style: normal;font-size: 170%;color: #9abe39;}

#wrap .content h2, #wrap .content h3{
    font-size: 130%;
    font-weight: bold;
    color: #7bbf2a;
    margin: 10px 0;
}
#wrap .content h3{color: #000;}

#wrap .content hr{
    border: 0;
    border-top: solid 1px #ccc;
    height: 1px;
    margin: 3px 0;
}

#wrap .content p
{
    margin: 10px 0;
}

#wrap .content .holder ul{
    margin: 20px 0;
}

#wrap .content .holder ul li{
    padding-left: 20px;
    background: url(/_img/bullet.gif) left center no-repeat;
    margin-bottom: 10px;
}

#wrap .content em{
    color: #5f9520;
    font-style: normal;
    font-weight: bold;
}

/***** Links ********/

#wrap .content .holder a{color: #333;}
#wrap .content .holder a:hover{text-decoration: none; color: #5f9520;}
#wrap .content .holder h2 a{color: #7bbf2a;}
#wrap .content .holder .shop a.thumb{border: solid 1px #ccc; float: left;margin-right: 10px;}
#wrap .content .holder .shop a.thumb:hover{border: solid 1px #9abe39;}
#wrap .content .holder ul.faq a{padding: 3px; text-decoration: none; line-height: 1.5em;}
#wrap .content .holder ul.faq a:hover{color: #fff; background: #7bbf2a;}

/***** Images ********/
img{border:0;}

#wrap .content .imgStrip{
    text-align: center;
    margin: 10px 0;
}

#wrap .content .imgStrip img{
    margin: 0 4px;
    border: solid 1px #eee;
}

#wrap .content .holder .feature .featureFoot .prod{
    border: solid 1px #5f9520;
    margin-bottom: 5px;
    text-align: center;
    background: #fff;
}

.logoLink{width: 200px;}

/*****************************************************
== independent Styles
*****************************************************/

#wrap .content .floatLeft{float: left;}
#wrap .content .floatRight{float: right;}
.clr{clear:both;}
.smlText{font-size: 85%;}

/*****************************************************
== Forms
*****************************************************/

#wrap .content select{width: 100px;}
#wrap .content select.sml{width: 40px;}

/*****************************************************
== Tables
*****************************************************/

table{border-collapse: collapse;margin: 10px 0;}
table td{border: solid 1px #ccc;padding: 3px 10px;vertical-align: middle;}
table thead td{
    background: #7bbf2a;
    color: #fff;
    font-weight: bold;
}
table tfoot td{
    background: #ccc;
    border: solid 1px #999;
}
table tfoot tr.spacer td{
    background: none;
    border: 0;
    padding: 0;
}
table tbody tr.alt td{
    background:#ddd;
}