@charset "utf-8";
/* CSS Document */

body {
	margin: 10px 0;
	font-family: Arial, Helvetica, sans-serif;
}

/* ===== Structure =================================================================== */

#wrapper {
	background: url(../images/bg-repeat.gif) repeat-y;
	margin: 0 auto;
	width: 857px;
}
#top {
	background: url(../images/bg-top.gif) no-repeat;
	padding: 17px 17px 20px 17px;
}
#content-wrap {
	margin: 0 37px;
}
#footer {
	clear: both;
	background: url(../images/bg-bottom.gif) no-repeat;
	font-size: 65%;
	height: 48px;
	padding: 12px 37px 0 37px;
	text-align: right;
}

#top-banner {
	height: 63px;
}
#logo {
	float: left;
	margin: 19px 0 0 24px;
}
#strapline {
	float: right;
	color: #666;
	font-size: 120%;
	font-weight: bold;
	line-height: 63px;
	margin: 0 20px 0 0;
	text-align: right;
	width: 600px;
}

#content {
	clear: both;
}
#content .left-eql {
	float: left;
	width: 371px;
}
#content .right-eql {
	float: left;
	width: 371px;
	margin: 0 0 0 41px;
}


/* ===== Global styles ================================================================ */

img {
	border: 0;
}

ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
form {
	margin: 0;
}

/* ===== Content styles ================================================================ */

h1 {
	color: #333;
	font-size: 120%;
	font-weight: normal;
	margin: 0 0 10px 0;
}

#content-wrap h3 {
	clear: both;
	color: #000;
	font-size: 75%;
	font-weight: normal;
	margin: 0 0 2px 0;
}
#content-wrap .home h3 {
	margin: 0 0 1em 0;
}

p {
	color: #666;
	font-size: 70%;
	margin: 0 0 10px 0;
}
p.lead {
	color: #000;
	font-size: 75%;
}
.box-inner p {
	font-size: 75%;
}
p.footer {
	font-size: 65%;
	font-weight: bold;
}
.privacy h4 {
	color: #333;
	font-size: 75%;
	margin: 0;
}


/* ===== Lists ========================================================================= */

ul.bullet {
	list-style: disc;
	margin: 0 0 20px 15px;
}
ul.bullet li {
	font-size: 75%;
}
.feature-pic {
	float: left;
	width: 80px;
	padding: 0 0 20px 0;
}

ul.feature {
	float: left;
	width: 200px;
}
ul.feature li {
	background: url(../images/bullet.gif) 4px 5px no-repeat;
	color: #000;
	font-size: 75%;
	line-height: 120%;
	margin: 0;
	padding: 0 0 20px 15px;
}
ul.feature2 {
	list-style: disc;
	padding: 0 0 0 15px;
}
ul.feature2 li {
	color: #000;
	font-size: 75%;
	line-height: 120%;
	margin: 0;
	padding: 0 0 20px 0;
}

ul.colors {
	padding: 20px 0 0 20px;
}
ul.colors li {
	display: inline;
	padding: 0 2px 0 0;
}


/* ===== Images ========================================================================= */

#footer img {
	vertical-align: bottom;
}
.imgleft {
	float: left;
	margin: 0 10px 10px 0;
}
.imgright {
	float: right;
	margin: 0 10px 10px 10px;
}
.imgright2 {
	float: right;
	margin: 0 0 0 10px;
}



/* ===== Boxes ========================================================================= */

.box-main {
	background: url(../images/bg-box-main-repeat.gif) repeat-y;
	margin: 0 0 10px 0;
}
.box-main .box-top {
	background: url(../images/bg-box-main-top.gif) top no-repeat;
	padding: 6px 0 0 0;
}
.box-main .box-content {
	background: url(../images/bg-box-main-bottom.gif) bottom no-repeat;
	padding: 0 0 6px 0;
}

.box-main .box-content #main-col {
	float: left;
	margin: 0 0 0 8px;
	width: 460px;
}

.box-main .box-content .right-col {
	float: left;
	width: 285px;
}
.box-main .box-content .right-col ul#thumbs {
	clear: both;
}
.box-main .box-content .right-col ul#thumbs li {
	float: left;
	margin: 0 0 0 7px;
	width: 66px;
}
.box-main .box-content .right-col ul#thumbs li.first {
	margin: 0;
}



.box-main .box-inner {
	background: url(../images/bg-box-inner-repeat.gif) repeat-y;
	margin: 10px 0;
	width: 284px;
}
.box-main .box-inner .box-top {
	background: url(../images/bg-box-inner-top.gif) top no-repeat;
	padding: 5px 0 0 0;
}
.box-main .box-inner .box-content {
	background: url(../images/bg-box-inner-bottom.gif) bottom no-repeat;
	padding: 0 8px 5px 8px;
}
.box-main .box-inner .box-content h2 {
	color: #333;
	font-size: 120%;
	font-weight: normal;
	margin: 0 0 10px 0;
}

/* Full width Box */
.box-full {
	background: url(../images/box-full-repeat.gif) repeat-y;
}
.box-full .box-title {
	background: url(../images/box-full-title.gif) top no-repeat;
	padding: 6px 0 0 0;
}
.box-full .box-content {
	background: url(../images/box-full-bottom.gif) bottom no-repeat;
	padding: 20px 15px 6px 15px;
}

.box-full .box-title h1,
.box-full .box-title h2 {
	color: #333;
	font-size: 80%;
	font-weight: normal;
	height: 23px;
	margin: 0;
	padding: 3px 15px 0 15px;
}
.promo-box {
	margin: 10px 0 0 0;
}
.box-full .promos {
	padding: 15px 9px 6px 9px;
}



/* Medium Box (Equal 2 cols) */
.box-med {
	background: url(../images/box-med-repeat.gif) repeat-y;
}
.box-med .box-title {
	background: url(../images/box-med-title.gif) top no-repeat;
	padding: 6px 0 0 0;
}
.box-med .box-content {
	background: url(../images/box-med-bottom.gif) bottom no-repeat;
	padding: 20px 15px 6px 15px;
}

.box-med .box-title h2 {
	color: #333;
	font-size: 80%;
	font-weight: normal;
	height: 24px;
	margin: 0;
	padding: 3px 15px 0 15px;
}


/* Big Box (col) */
.big-col {
}

.box-big {
	background: url(../images/box-big-repeat.gif) repeat-y;
	float: left;
	margin: 0 20px 0 0;
	width: 448px;
}
.box-big .box-title {
	background: url(../images/box-big-title.gif) top no-repeat;
	padding: 6px 0 0 0;
}
.box-big .box-bottom {
	background: url(../images/box-big-bottom.gif) bottom no-repeat;
	padding: 0 0 6px 0;
}
.box-big .box-content {
	padding: 20px 15px 10px 15px;
}
.box-big .box-title h1,
.box-big .box-title h2 {
	color: #333;
	font-size: 80%;
	font-weight: normal;
	height: 23px;
	margin: 0;
	padding: 3px 15px 0 15px;
}



/* Small Box (col) */
.sml-col {
}

.box-sml {
	background: url(../images/box-sml-repeat.gif) repeat-y;
	float: left;
	width: 315px;
}
.box-sml .box-title {
	background: url(../images/box-sml-title.gif) top no-repeat;
	padding: 6px 0 0 0;
}
.box-sml .box-bottom {
	background: url(../images/box-sml-bottom.gif) bottom no-repeat;
	padding: 0 0 6px 0;
}
.box-sml .box-content {
	padding: 20px 15px 10px 15px;
}
.box-sml .box-content2 {
	padding: 10px 15px;
}
.box-sml .box-title h2 {
	color: #333;
	font-size: 80%;
	font-weight: normal;
	height: 23px;
	margin: 0;
	padding: 3px 15px 0 15px;
}
#content-wrap .box-sml h3.bar {
	clear: both;
	background: url(../images/bg-sml-title-bar.gif) left top no-repeat;
	color: #333;
	font-size: 80%;
	font-weight: normal;
	height: 24px;
	margin: 0;
	padding: 10px 15px 0 15px;
}



/* ===== Promos ==================================================================== */

ul#promo-bar {
	clear: both;
}
ul#promo-bar li {
	float: left;
	padding: 0 0 10px 0;
}

ul.promo-4 li {
	width: 165px;
	margin: 0 0 0 41px;
}

ul.promo-3 li {
	width: 165px;
	margin: 0 0 0 144px;
}

ul#promo-bar li.first {
	margin: 0;
}

.box-full ul.promo-4 li {
	margin: 0 0 0 35px;
}
.box-full ul.promo-3 li {
	margin: 0 0 0 135px;
}



/* ===== Where to buy ==================================================================== */

#header-sellers {
	font-size: 85%;
	margin: 2px;
	padding: 10px 0 0 0;
	color: #000;
}

.sellers-menu {
	border-top: 1px solid #666666;
	border-bottom: 1px solid #666666;
	margin: 10px 0 0 0;
}

.sellers-menu form {
	margin: 5px 0;
}

table.sellers {
	border: 0;
	width: 100%;
	margin-bottom: 20px;
}

table.sellers caption {
	font-size: 75%;
	color: #000;
	text-align: left;
	padding: 3px 5px;
	border-bottom: 1px solid #666666;
	margin: 2px 2px 0 2px;

}
table.sellers th {
	background-color: #999999;
	padding: 4px 5px;
	font-size: 80%;
	font-weight: normal;
	color:#FFFFFF;
	text-align: left;
	width: 50%;
}
table.sellers td {
	background-color: #d6d6d6;
	padding: 4px 5px;
	font-size: 70%;
	color: #ff0000;
	width: 50%;
	vertical-align: top;
}
table.sellers td.store-address {
	font-size: 80%;
}
.store-address form {
	margin: 0;
}
.store-address select {
	width: 200px;
	font-size: 80%;
}
h3.store-head {
	margin: 15px 20px 15px 5px;
	font-size: 100%;
	color: #ffffff;
}
div.address {
	margin: 0 20px 15px 5px;
	color: #ffffff;
}
.sellers a:link, .sellers a:active, .sellers a:visited, .sellers a:hover {
	color: #999999;
}
div.address a:link, .sellers a:active, .sellers a:visited, .sellers a:hover {
	color: #ff0000;
}



/* ===== Navigation ==================================================================== */

ul#nav {
	list-style: none;
	height: 35px;
	margin: 0;
	padding: 0;
}
ul#nav li {
	float: left;
	background: url(../images/div-nav.gif) no-repeat;
	background-position: right;
	font-size: 70%;
	padding: 0 4px 0 0;
	text-align: center;
	width: 98px;
}
ul#nav li.last {
	float: right;
	background-position: left;
	padding: 0 0 0 4px;
}


#subnav {
	height: 20px;
}
ul#subnav {
	background: url(../images/div-nav.gif) no-repeat;
	height: 19px;
	padding: 0 0 0 4px;
}
ul#subnav li {
	float: left;
	background: url(../images/div-nav.gif) right top no-repeat;
	font-size: 70%;
	padding: 0 4px 0 0;
	height: 19px;
}
ul.products {
	margin: 1px 0 0 98px;
}

ul.innov {
	margin: 1px 0 0 200px;
}





/* ===== Links ========================================================================= */

a {color: #ff0000; text-decoration: none;}
a:hover {color: #cc0000;}

#content-wrap a:link {color: #ff0000;}
#content-wrap a:visited {color: #ff3300;}
#content-wrap a:active {color: #cc0000;}
#content-wrap a:hover {color: #cc0000;}

ul#nav li a {
	display: block;
	color: #666;
	line-height: 35px;
}
ul#nav li.current a,
ul#nav li a:hover {color: #ff0000;}

ul#subnav li a {
	color: #333;
	line-height: 19px;
	padding: 0 10px;
}
ul#subnav li.current a,
ul#subnav li a:hover {color: #ff0000;}


#footer a {
	font-weight: bold;
}



/* ===== Form ========================================================================= */

form#subscribe {
	margin: 0 0 3px 0;
}
form#subscribe input.textbox {
	padding: 1px;
	margin: 0 5px 0 0;
	width: 200px;
}
form#subscribe input.submit {
	width: 120px;
}
form#subscribe label {
	display: block;
	color: #000;
	font-size: 75%;
	font-weight: normal;
	margin: 0 0 3px 0;
}

form#contact {
	padding: 10px 0;
}
form#contact input.textbox {
	float: left;
	font-size: 75%;
	margin: 0 0 15px 0;
	padding: 1px;
	width: 330px;
}
form#contact textarea {
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 75%;
	margin: 0 0 15px 0;
	width: 330px;
	height: 100px;
}
form#contact select {
	float: left;
	font-size: 75%;
	margin: 0 0 15px 0;
}
form#contact label {
	clear: both;
	float: left;
	color: #000;
	font-size: 75%;
	margin: 0 0 15px 0;
	width: 75px;
}
form#contact input.submit {
	clear: both;
	width: 120px;
	margin: 0 0 0 75px;
}


/* Contact feedback */

.border-hilite {
	border: 1px solid #ccc;
	color: #000;
	padding: 10px;
	margin: 0 0 10px 0;
}
.border-hilite p {
	color: #000;
	font-weight: bold;
}

.bg-hilite {
	background-color: #ddd;
	color: #000;
	padding: 10px;
	margin: 0 0 10px 0;
}
.bg-hilite p.error {
	color: #f00;
	font-weight: bold;
}

p.form-error {
	background-color: #ddd;
	color: #f00;
	padding: 10px;
}
p.contact-success a {
	color: #f60;
}





/* ===== Misc styles =================================================================== */

#footer .built-by {
	float: left;
}

.right {
	text-align: right;
}

/* Clearfix */
.clearfix:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}
* html > body .clearfix {
	display: block;
	width: 100%;
}
* html .clearfix {
	height: 1%;
}


.clear {
	clear: both;
	margin: 0;
	padding: 0;
	font-size: 0;
	line-height: 0;
}

