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

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, font, img, ins, kbd, q, s, samp,
small, strike,  sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
	
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}

html, body { margin:0; padding:0; height:100%; }

body {
	color: black;
}

html>body { height:auto; min-height:100%;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}


blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

html, body { margin:0; padding:0; height:100%; }

body {
margin: 0;
padding: 0; 
font-size: 62.5%; /* Resets 1em to 10px */
font-family: arial,"trebuchet ms", Verdana, Arial, Sans-Serif;
background: url(images/background-tile.gif) repeat;
color: #000;
text-align: left;
border: 0;
position:relative;
top:0;
}

html>body { height:auto; min-height:100%;
}

#wrapper { 
margin: 0 auto;
width: 850px;
position: relative;
border-right: 1px solid #434242;
border-left: 1px solid #434242;
border-top: 1px solid #434242;
background: #fff;
}

ul#items {
list-style-position: inside;
list-style-type: none;
padding: 10px;
margin: 0 20px;
list-style-image: url(images/leaf-bullet.png);
}

ul#headlines {
list-style-position: inside;
padding: 0px 0px 10px 0px;
list-style-image: url(images/checkmark.png);
font-family: arial,"trebuchet ms", verdana, sans-serif;
font-size: 107%;
font-weight: bold;
color: #ff0202;
text-align: left;
letter-spacing: -.02em;
}

ul#headlines li {
padding: 3px 0;
}

#headlines{
text-align: left; height: auto; margin-top: 5px; 
}

.headlines_column{
float: left; width: 170px; color: #fff; font-size: 107%; 
}

.headlines_column_middle{
float: left; width: 175px; color: #fff; font-size: 107%; 
}

.headlines_column_last {
float: left; width: 255px; color: #fff; font-size: 107%;
}

#logo-ctnr{
padding: 25px 0 0px 10px;
height: 190px;
width: 345px;
float: left;
}

#front-display{
float: left;
padding: 5px 0 0 0;
margin: 0px 10px 5px 10px;
width: 580px;
font-family: arial, verdana, sans-serif;
font-size: 130%;
line-height: 1.5em;
color: #000;
text-align: justify;
}

#bags-ctnr{
float: right;
height: 226px;
width: 439px;
margin-top: 5px;
background: url(images/test-bags.png) no-repeat;
}

#product-ctnr {
margin: 0 20px 0 0px;
padding: 10px 0 15px 0;
border-bottom: 1px dashed #000;
float: left;
display: inline;
width: 830px;
}

#mainContent h5 {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
font-weight: bold;
color:#000000;
text-align:center;
}

#product-ctnr-last {
margin: 0 20px 0 0px;
padding: 10px 0 15px 0;
float: left;
display: inline;
width: 830px;
}

#product-img-ctnr {
float: left;
margin-right: 20px;
}

#product-description {
float: left;
margin-right: 10px;
margin-top: 10px;
width: 500px;
}

#product-description p {
font-family: arial,trebuchet ms, arial, sans-serif;
font-size: 13px;
line-height: 1.3em;
margin-bottom: 15px;
}

#product-description h1{
font-family: Georgia, Times New-Roman, serif;
font-size: 22px;
letter-spacing: -.5px;
font-weight: bold;
color: #FF0000;
border-bottom: 1px dotted #000;
margin-bottom: 10px;
}

#product-description h2{
font-family: Georgia, Times New-Roman, serif;
font-size: 15px;
font-weight: bold;
color: #000000;
margin-bottom: 5px;
}

ul#bag-items {
text-align: left;
list-style-type: none;
list-style-image:url(images/arrow-rt.gif);
list-style-position: outside;
line-height: 1.3em;
font-size: 13px;
font-family: Arial, Trebuchet MS, sans-serif;
padding-left: 20px;
margin-bottom: 15px;
}

#color-chart {
float: left;
width: 250px;
padding-top: 20px;
}

#pricing {
clear: both;
padding: 5px 0 5px 0px;
margin: 0 0 10px 0px;
border-collapse: collapse;
}

#pricing h1 {
font-family: Georgia,Arial, sans-serif;
font-size: 20px;
font-style: normal;
font-weight: bold;
letter-spacing: -.75px;
line-height: 1.2em;
margin-bottom: 5px;
color: #000;
}

#price-grid {
padding: 5px;
margin: 10px 10px;
border-collapse: collapse;
}

img.buy-now {
float: right;
margin: 20px 0 0 0;
}

th.table-header {
font-family: arial,"Trebuchet MS", Arial, sans-serif;
font-size: 13px;
font-weight: bold;
color: #FFFFFF;
background-color: #333333;
text-align: center;
padding: 5px 0;
border-top: 3px solid #272727;
border-right: 1px solid #3e3d3d;
border-bottom: 2px solid #4d4c4c;

}

td.spec-info {
font-family: Arial,"Trebuchet MS", Arial, sans-serif;
font-size: 13px;
font-weight: bold;
color: #000;
background: #fff;
text-align: center;
background: #d8edff;
padding: 5px 0;
border-right: 1px solid #e1f1fe;
border-top: 2px solid #e1f1fe;
border-bottom: 3px solid #c9e5fd;
}

#highlight {
background: #42BF38;
}

#header {
height: 230px;
background: url(images/header-bkground.gif) no-repeat;
}

img.display {
padding: 20px 0 10px 15px;
}

#badge-ctnr { 
width: 129px;
height: 125px;
position: absolute;
top: 120px;
right: 0px;
z-index: 9998;
}

#faq {
font-size: 130%;
line-height: 1.7em;
padding: 20px;
text-align: justify;
}

span.highlight {
background: #FFFDCC;
}

#footer { 
height: 170px; 
background: #ff0202;
border-top: 2px solid #777; 
clear: both;
}

#footer-logo {
height: 89px;
width: 240px;
background: url(images/footer.gif) no-repeat;
position: absolute;
right: 20px;
bottom: 45px;
}

#footer-content {
float: right;
margin: 90px 15px 0px 10px; 
padding: 10px 0px 0px 10px;
font-family: arial,"Trebuchet MS", sans serif;
font-size: 0.7em;
text-align: right;
line-height: 1.2em;
}

#footer a { 
color: #fff;
border-bottom: 1px dotted #fff;
text-decoration: none;
}

#footer a:hover{ 
color: #fff;
border-bottom: 0px;
text-decoration: none;
}

#copyright {
text-align: center;
width: 850px;
clear: both;
}

#copyright p {
font-size: 10px;
font-family: Arial, Trebuchet MS, sans-serif;
color: #fff;
}

#blockquote{
font-family: trebuchet ms, verdana, sans-serift;
font-size: 1.0em;
text-align: justify;
line-height: 1.2em;
background: #DAD9C7;
border-top: 1px solid #CCCBBA;
border-bottom: 1px solid #CCCBBA;
padding: 15px 25px;
margin: 0px 0px 15px 0px;
}

#hr {
height: 1px;
background-color: #ccc;
margin-top: 20px;
margin-bottom: 20px;
padding: 0;
line-height: 0;
font-size: 0;
}

#hr hr{
display: none;
}

#div hr{
border: 0;
height: 1px;
color: #ccc;
padding: 0;
margin-top: 20px;
margin-bottom: 30px;
line-height: 0;
font-size: 0;
}

#botnav{
text-align: left; height: auto; margin-top: 15px; 
}

.botnav_column{
float: left; width: 130px; color: #fff; font-size: 105%; 
}

.botnav_column_last {
float: left; width: 145px; color: #fff; font-size: 105%; border-right: 1px solid #fff; padding-right: 10px; 
}

.botnav_column_last_headlines {
float: left; width: 175px; color: #fff; font-size: 105%; 
}

ul#botnav {
list-style-type: none;
list-style-position: outside;
}

ul#sitemap {
list-style-type: none;
margin: 0 15px;
}

/*-----Footer Navigation--------*/

#clientele {
	height: 115px;
	margin-top: 3.1em;
}
/* separate the list from surrounding elements */
ol
{
  margin: 0 0 1.5em 15px;
  padding: 0;
}

ol li
{
  font-size: 1.1em;
  color: #fff;
  
  /* Stipulate the height of each item so that 
  vertical return = items * height */

  line-height: 15px;

  /* Clear the default margins & padding 
  so we can style the list from scratch */

  margin: 0;
  padding: 0;
}

/* If li position is left static, Internet 
Explorer disables hyperlinks in the list 
in all but the final column.

This rule will be processed only by 
Internet Explorer because only IE believes 
that there??s a level above HTML: */

* html #clientele ol li
{
	position: relative;
}

#clientele li.column1 { margin-left: 1.0em; }
#clientele li.column2 { margin-left: 11.0em; }
#clientele li.column3 { margin-left: 22.5em; }
#clientele li.column4 { margin-left: 33em; }

li.reset
{
  margin-top: -90px;
}

ol,ul {
list-style: none;
}

#testimonials {
margin: 20px 15px 25px 20px;
font-family: arial,trebuchet ms, verdana, sans-serif;
font-size: 130%;
text-align: justify;
display: inline;
float: left;
}

#leftcolumn {
	background-color: #F5F3F3;
	display: inline;
	float: left;
	border-right: 2px dotted #696969;
	text-align: center;
}

#leftcolumn a {
	color: #FF0000;
	font-weight: bold;
	font-size: 12px;
}

.commentbox{
background-color: #F5F3F3;
width: 575px;
padding: 15px;
border: 2px solid #CCC;
border-top: 3px solid #ccc;
border-bottom: 2px dotted #ccc;
line-height: 1.5em;
}

.commentfooter{

padding-top: 4px;
background-color: #CCCCCC;
margin-bottom: 10px;
font-size: 90%;
font-weight: bold;
height: 20px;
color: #4A4A4A;
text-align:right;
padding-right: 15px;
}

.numbers {
font-size: 30px;
}

img.symbol {
float: left;
margin-right: 4px;
}

	/*LEVEL ONE*/
ul.dropdown                         { position: relative; width: 960px; margin: 0 auto; z-index:9999; }
ul.dropdown li                      { font-family: Arial, Helvetica, sans-serif; font-size: 13px; font-weight: normal; background: #1a287d; list-style: none; float: left; height: 40px; }
ul.dropdown a:hover		            { color: #000; }
ul.dropdown a:active                { color: #ffa500; }
ul.dropdown li a                    { display: block; padding: 13px 13px 12px 13px; 
	 								  color: #fff; text-decoration: none; }
ul.dropdown li:last-child a         { border-right: none; } /* Doesn't work in IE */
ul.dropdown li.hover,
ul.dropdown li:hover                { background: #F3D673; color: black; position: relative; }
ul.dropdown li.hover a              { color: black; }


/* 
	LEVEL TWO
*/
ul.dropdown ul 						{ width: 220px; visibility: hidden; position: absolute; top: 100%; left: 0; z-index: 9999;}
ul.dropdown ul li 					{ font-weight: normal; background: #F3D673; color: #000; 
									  border-bottom: 1px solid #ccc; float: none; z-index: 9998;}
ul.dropdown ul li:hover             {background: #1a287d; color: #fff;}
ul.dropdown ul li.hover a           {color: #fff}
									  
                                    /* IE 6 & 7 Needs Inline Block */
ul.dropdown ul li a					{ border-right: none; width: 100%; display: inline-block;} 

/* 
	LEVEL THREE
*/
ul.dropdown ul ul 					{ left: 100%; top: 0; }
ul.dropdown li:hover > ul 			{ visibility: visible; }

#navigation {
width: 100%;
background: #1a287d;
height: 40px;
margin: 0 auto;
padding-left: 3px;
}

#mainContent {
width: 830px;
float: left;
padding: 0 10px;
}

#mainContent p {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
margin-bottom: 15px;
color: #000;
line-height: 1.4em;
text-align: justify;
}

#mainContent h1 {
font-family: Georgia,Arial, sans-serif;
font-size: 22px;
font-style: normal;
font-weight: bold;
letter-spacing: -.75px;
line-height: 1.2em;
margin-bottom: 5px;
color: #ff0000;
border-bottom: 1px dotted #000;
}

#mainContent h2 {
font-family: Georgia, Times New Roman, serif;
font-size: 16px;
font-weight: bold;
color: #000000;
padding-top: 10px;
}

#mainContent h4 {
font-family: Georgia, serif;
font-size: 16px;
font-weight: bold;
color: #000000;
text-align: center;
}

#bagContainer {
float: left;
overflow: visible;
width: 830px;
padding: 15px 0 15px 2px;
display: inline;
}

.bagboxLeft {
float: left;
width: 415px;
}

.bagboxRight {
float: right;
width: 415px;
}

.bagboxA {
float: left;
margin-right: 7px;
text-align: center;
width: 200px;
}

.bagboxB {
float: right;
text-align: center;
width: 200px;
margin-right: 7px;
}

#bagContainer h3 {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-weight: bold;
color: #4c4a4a;
margin-top: 5px;
padding:0;
}

#bagContainer h3 a {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-weight: bold;
color: #322d2d;
margin-top: 5px;
padding:0;
}

#bagContainer h3 a:hover {
color: #0484fb;
text-decoration: underline;
}

#bagContainer .a img {
margin-bottom: 15px;
border: 5px #ccc;
}

.centerImage {
text-align: left;
margin: 20px 0;
}

#bullets {
float: left;
margin: 10px 0 30px 150px;
display: inline;
line-height: 1.9em;
width: 680px;
}

ul#bullets-left {
float: left;
font-family: Trebuchet MS, Arial, sans-serif;
font-style:italic;
font-size: 13px;
list-style-position: inside;
list-style-image: url(images/star.png);
margin-right: 25px;
}

ul#bullets-middle {
float: left;
font-family: Trebuchet MS, Arial, sans-serif;
font-style:italic;
font-size: 13px;
list-style-position: inside;
list-style-image: url(images/star.png);
margin-right: 35px;
}

ul#bullets-right {
float: left;
font-family: Trebuchet MS, Arial, sans-serif;
font-style:italic;
font-size: 13px;
list-style-position: inside;
list-style-image: url(images/star.png);
}

img.ecoColors{
margin: 10px 0;
}

.accordionmenu{
width: 830px; /*width of menu*/
margin-bottom: 15px;
}

.accordionmenu .headerbar{
font: bold 13px Arial;
color: black;
background: #dbe9f6;
margin-bottom: 1px; /*bottom spacing between header and rest of content*/
padding: 10px 0 10px 10px; /*31px is left indentation of header text*/
border-left: 5px solid #ff0000;
border-right: 1px solid #bed3e6;
}

.accordionmenu .headerbar a{
text-decoration: none;
color: black;
display: block;
}

.accordionmenu ul{
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 0; /*bottom spacing between each UL and rest of content*/
}

.accordionmenu ul li{
padding: 8px 6px 8px 15px;
font-size: 13px;
text-align:justify;
line-height: 1.5em;
}

.accordionmenu ul li a{
text-decoration: underline;
color: #000;
}

.accordionmenu ul li a:visited{
color: black;
}

.accordionmenu ul li a:hover{ /*hover state CSS*/
text-decoration: underline;
color:#0066CC;
}

table {
width: 100%;
font-family:Arial, Helvetica, sans-serif;
font-size: 13px;
margin-bottom: 15px;
}

td {
padding: 5px 0;
}

td.firstCol {
padding: 5px 0 5px 15px;
font-weight: bold;
font-size: 13px;
}

td.allCols {
text-align: center;
}

tr.alt td {
background: #bcd4ec;
font-size: 13px;
}

tr.over td {
background: #ecf6fc;
}

th {
text-align:center;
font-size: 13px;
}

img.symbol {
float: left;
margin: 10px 5px 0 0;
}

#centerImg {
text-align: center;
margin: 20px 0 10px 0;
}

#trackorder {
	display: none;
	position: fixed;
	top: 30%;
	right: 0;
	background-color: #353131;
	height: 120px;
	width: 481px;
	margin: 0 -500px 0 10px;
	padding-left: 50px;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	z-index: 9999;
}

#trackorder img {
	cursor: pointer;
	position: absolute;
	left: 0;
	margin-left: -25px;
	top: -5px;
	
}
#trackorder h3 {
	font-family: Verdana;
	font-size: 16px;
	color: white;
}
#trackorder label {
	color: #FFF;
	font-weight: bold;
	width: 140px;
	float: left;
	text-align: right;
	padding-right: 10px;
	margin-bottom: 8px;
}
#trackorder input {
	width: 200px;
	float: left;
	margin-bottom: 8px;
}
#trackorder ul {
	list-style: none;
	list-style-type: none;
}
#trackorder ul li {
	clear: both;
	display: block;
}
#trackorder p {
	background: #565656;
	border: 1px solid #000000;
	color: #FFF;
	margin: 0;
	width: 465px;
	text-align: center;
	position: relative;
	z-index: 8;
}